diff --git a/packages/super-editor/src/extensions/structured-content/document-section.js b/packages/super-editor/src/extensions/structured-content/document-section.js index 97e884344d..e590a2a54d 100644 --- a/packages/super-editor/src/extensions/structured-content/document-section.js +++ b/packages/super-editor/src/extensions/structured-content/document-section.js @@ -1,34 +1,34 @@ // @ts-check /** - * Base section attributes + * Document section attributes * @typedef {Object} SectionAttributes - * @property {number} [id] - Section identifier - * @property {string} [title] - Section title - * @property {string} [description] - Section description - * @property {string} [sectionType] - Type of section - * @property {boolean} [isLocked] - Whether section is locked + * @property {number} [id] - Unique section identifier + * @property {string} [title] - Display label (becomes w:alias in Word) + * @property {string} [description] - Additional metadata stored in w:tag + * @property {string} [sectionType] - Business type for filtering/logic (e.g., 'legal', 'pricing') + * @property {boolean} [isLocked] - Lock state (maps to w:lock="sdtContentLocked") */ /** - * Options for creating a section + * Create a new document section * @typedef {Object} SectionCreate - * @property {number} [id] - Section identifier (auto-generated if not provided) - * @property {string} [title] - Section title (defaults to "Document section") - * @property {string} [description] - Section description - * @property {string} [sectionType] - Type of section - * @property {boolean} [isLocked] - Whether section is locked - * @property {string} [html] - HTML content to parse - * @property {Object} [json] - ProseMirror JSON content (takes precedence over html) + * @property {number} [id] - Unique ID. Auto-increments from existing sections if omitted + * @property {string} [title="Document section"] - Label shown in section header + * @property {string} [description] - Metadata for tracking (stored in Word's w:tag) + * @property {string} [sectionType] - Business classification + * @property {boolean} [isLocked=false] - Prevent editing when true + * @property {string} [html] - HTML content to insert + * @property {Object} [json] - ProseMirror JSON (overrides html if both provided) */ /** - * Options for updating a section + * Update an existing section * @typedef {Object} SectionUpdate - * @property {number} id - Section ID to update (required) - * @property {string} [html] - HTML content to parse - * @property {Object} [json] - ProseMirror JSON content (takes precedence over html) - * @property {Partial} [attrs] - Attributes to update + * @property {number} id - Target section ID (required) + * @property {string} [html] - Replace content with HTML + * @property {Object} [json] - Replace content with ProseMirror JSON (overrides html) + * @property {Partial} [attrs] - Update attributes only (preserves content) */ import { Node, Attribute } from '@core/index.js'; @@ -39,8 +39,9 @@ import { DOMParser as PMDOMParser } from 'prosemirror-model'; import { findParentNode, SectionHelpers } from '@helpers/index.js'; /** - * Document Section - Structured content blocks * @module DocumentSection + * @sidebarTitle Document Section + * @snippetPath /snippets/extensions/document-section.mdx */ export const DocumentSection = Node.create({ name: 'documentSection', @@ -98,10 +99,17 @@ export const DocumentSection = Node.create({ addCommands() { return { /** - * Create a new document section + * Create a lockable content section * @category Command - * @param {SectionCreate} [options={}] - * @returns {Function} Command function - returns true if section was created successfully + * @param {SectionCreate} [options={}] - Section configuration + * @returns {Function} Command - true if created, false if position invalid + * @example + * createDocumentSection({ + * id: 'legal-1', + * title: 'Terms & Conditions', + * isLocked: true, + * html: '

Legal content...

' + * }) */ createDocumentSection: (options = {}) => @@ -214,9 +222,12 @@ export const DocumentSection = Node.create({ }, /** - * Remove section at current selection, keeping content + * Remove section wrapper at cursor, preserving its content * @category Command - * @returns {Function} Command function - returns true if section was removed, false if none found + * @returns {Function} Command - true if removed, false if no section at position + * @example + * removeSectionAtSelection() + * @note Content stays in document, only section wrapper is removed */ removeSectionAtSelection: () => @@ -254,10 +265,12 @@ export const DocumentSection = Node.create({ }, /** - * Remove section by ID + * Delete section and all its content * @category Command - * @param {number} id - Section ID to remove - * @returns {Function} Command function - returns true if section was removed, false if not found + * @param {number} id - Section to delete + * @returns {Function} Command - true if deleted, false if ID doesn't exist + * @example + * removeSectionById(123) */ removeSectionById: (id) => @@ -282,11 +295,12 @@ export const DocumentSection = Node.create({ }, /** - * Lock section by ID + * Lock section against edits * @category Command - * @param {number} id - Section ID to lock - * @returns {Function} Command function - returns true if section was locked, false if not found - * @private + * @param {number} id - Section to lock + * @returns {Function} Command - true if locked, false if ID doesn't exist + * @example + * lockSectionById(123) */ lockSectionById: (id) => @@ -306,10 +320,23 @@ export const DocumentSection = Node.create({ }, /** - * Update section by ID + * Modify section attributes or content * @category Command - * @param {SectionUpdate} options - * @returns {Function} Command function - returns true if section was updated, false if not found + * @param {SectionUpdate} options - Changes to apply + * @returns {Function} Command - true if updated, false if ID doesn't exist + * @example + * // Toggle lock + * updateSectionById({ id: 123, attrs: { isLocked: false } }) + * + * // Replace content + * updateSectionById({ id: 123, html: '

New content

' }) + * + * // Both + * updateSectionById({ + * id: 123, + * html: '

Updated

', + * attrs: { title: 'New Title' } + * }) */ updateSectionById: ({ id, html, json, attrs }) =>