superdoc 1.0.0-beta.71 → 1.0.0-beta.73

package/dist/superdoc.umd.js

@@ -42327,7 +42327,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     static getStoredSuperdocVersion(docx) {
       return _SuperConverter2.getStoredCustomProperty(docx, "SuperdocVersion");
     }
-    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-beta.71") {
+    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-beta.73") {
       return _SuperConverter2.setStoredCustomProperty(docx, "SuperdocVersion", version2, false);
     }
     /**
@@ -67373,7 +67373,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   const shouldSkipNodeView = (editor) => {
     return isHeadless(editor);
   };
-  const summaryVersion = "1.0.0-beta.71";
+  const summaryVersion = "1.0.0-beta.73";
   const nodeKeys = ["group", "content", "marks", "inline", "atom", "defining", "code", "tableRole", "summary"];
   const markKeys = ["group", "inclusive", "excludes", "spanning", "code"];
   function mapAttributes(attrs) {
@@ -68162,7 +68162,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         { default: remarkStringify2 },
         { default: remarkGfm2 }
       ] = await Promise.all([
-        Promise.resolve().then(() => indexDNdPLYmc),
+        Promise.resolve().then(() => indexDZuRXtuO),
         Promise.resolve().then(() => indexDRCvimau),
         Promise.resolve().then(() => indexC_x_N6Uh),
         Promise.resolve().then(() => indexD_sWOSiG),
@@ -68367,7 +68367,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
      * Process collaboration migrations
      */
     processCollaborationMigrations() {
-      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-beta.71");
+      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-beta.73");
       if (!this.options.ydoc) return;
       const metaMap = this.options.ydoc.getMap("meta");
       let docVersion = metaMap.get("version");
@@ -75898,11 +75898,11 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return spaces;
   };
-  const getJustifyAdjustment = (block, line, availableWidthOverride) => {
+  const getJustifyAdjustment = (block, line, availableWidthOverride, alignmentOverride) => {
     if (block.kind !== "paragraph") {
       return { extraPerSpace: 0, totalSpaces: 0 };
     }
-    const alignment2 = block.attrs?.alignment;
+    const alignment2 = alignmentOverride ?? block.attrs?.alignment;
     const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
     const availableWidth = availableWidthOverride ?? line.maxWidth ?? line.width;
     const slack = Math.max(0, availableWidth - line.width);
@@ -75981,13 +75981,13 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return result;
   }
-  function measureCharacterX(block, line, charOffset, availableWidthOverride) {
+  function measureCharacterX(block, line, charOffset, availableWidthOverride, alignmentOverride) {
     const ctx2 = getMeasurementContext();
     const availableWidth = availableWidthOverride ?? line.maxWidth ?? // Fallback: if no maxWidth, approximate available width as line width (no slack)
     line.width;
-    const justify = getJustifyAdjustment(block, line, availableWidth);
-    const renderedLineWidth = line.width + Math.max(0, availableWidth - line.width);
-    const alignment2 = block.kind === "paragraph" ? block.attrs?.alignment : void 0;
+    const justify = getJustifyAdjustment(block, line, availableWidth, alignmentOverride);
+    const alignment2 = alignmentOverride ?? (block.kind === "paragraph" ? block.attrs?.alignment : void 0);
+    const renderedLineWidth = alignment2 === "justify" ? line.width + Math.max(0, availableWidth - line.width) : line.width;
     const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
     const alignmentOffset = !hasExplicitPositioning && alignment2 === "center" ? Math.max(0, (availableWidth - renderedLineWidth) / 2) : !hasExplicitPositioning && alignment2 === "right" ? Math.max(0, availableWidth - renderedLineWidth) : 0;
     if (hasExplicitPositioning && line.segments && ctx2) {
@@ -76116,13 +76116,13 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return lastPm;
   }
-  function findCharacterAtX(block, line, x2, pmStart, availableWidthOverride) {
+  function findCharacterAtX(block, line, x2, pmStart, availableWidthOverride, alignmentOverride) {
     const ctx2 = getMeasurementContext();
     const availableWidth = availableWidthOverride ?? line.maxWidth ?? // Fallback: approximate with line width when no maxWidth is present
     line.width;
-    const justify = getJustifyAdjustment(block, line, availableWidth);
-    const renderedLineWidth = line.width + Math.max(0, availableWidth - line.width);
-    const alignment2 = block.kind === "paragraph" ? block.attrs?.alignment : void 0;
+    const justify = getJustifyAdjustment(block, line, availableWidth, alignmentOverride);
+    const alignment2 = alignmentOverride ?? (block.kind === "paragraph" ? block.attrs?.alignment : void 0);
+    const renderedLineWidth = alignment2 === "justify" ? line.width + Math.max(0, availableWidth - line.width) : line.width;
     const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
     const alignmentOffset = !hasExplicitPositioning && alignment2 === "center" ? Math.max(0, (availableWidth - renderedLineWidth) / 2) : !hasExplicitPositioning && alignment2 === "right" ? Math.max(0, availableWidth - renderedLineWidth) : 0;
     if (!ctx2) {
@@ -88830,7 +88830,10 @@ ${l}
           `[clickToPosition] Paragraph indents (${totalIndent}px) exceed fragment width (${fragment.width}px) for block ${fragment.blockId}. This may indicate a layout miscalculation. Available width clamped to 0.`
         );
       }
-      const pos = mapPointToPm(block, line, pageRelativePoint.x - fragment.x, isRTL, availableWidth);
+      const markerWidth = fragment.markerWidth ?? measure.marker?.markerWidth ?? 0;
+      const isListItem = markerWidth > 0;
+      const alignmentOverride = isListItem ? "left" : void 0;
+      const pos = mapPointToPm(block, line, pageRelativePoint.x - fragment.x, isRTL, availableWidth, alignmentOverride);
       if (pos == null) {
         logClickStage("warn", "no-position", {
           blockId: fragment.blockId
@@ -88872,7 +88875,10 @@ ${l}
             `[clickToPosition:table] Paragraph indents (${totalIndent}px) exceed fragment width (${tableHit.fragment.width}px) for block ${tableHit.fragment.blockId}. This may indicate a layout miscalculation. Available width clamped to 0.`
           );
         }
-        const pos = mapPointToPm(cellBlock, line, localX, isRTL, availableWidth);
+        const cellMarkerWidth = cellMeasure.marker?.markerWidth ?? 0;
+        const isListItem = cellMarkerWidth > 0;
+        const alignmentOverride = isListItem ? "left" : void 0;
+        const pos = mapPointToPm(cellBlock, line, localX, isRTL, availableWidth, alignmentOverride);
         if (pos != null) {
           logClickStage("log", "success", {
             blockId: tableHit.fragment.blockId,
@@ -89028,18 +89034,19 @@ ${l}
             if (sliceFrom >= sliceTo) return;
             const charOffsetFrom = pmPosToCharOffset(block, line, sliceFrom);
             const charOffsetTo = pmPosToCharOffset(block, line, sliceTo);
-            const startX = mapPmToX(block, line, charOffsetFrom, fragment.width);
-            const endX = mapPmToX(block, line, charOffsetTo, fragment.width);
             const markerWidth = fragment.markerWidth ?? measure.marker?.markerWidth ?? 0;
+            const isListItem = markerWidth > 0;
+            const alignmentOverride = isListItem ? "left" : void 0;
+            const startX = mapPmToX(block, line, charOffsetFrom, fragment.width, alignmentOverride);
+            const endX = mapPmToX(block, line, charOffsetTo, fragment.width, alignmentOverride);
             const paraIndentLeft = block.attrs?.indent?.left ?? 0;
             const firstLineOffset = (block.attrs?.indent?.firstLine ?? 0) - (block.attrs?.indent?.hanging ?? 0);
             const isFirstLine = index2 === fragment.fromLine;
-            const isListFirstLine = isFirstLine && !fragment.continuesFromPrev && (fragment.markerWidth ?? 0) > 0;
-            let indentAdjust = 0;
-            if (!isListFirstLine) {
-              indentAdjust = paraIndentLeft + (isFirstLine ? firstLineOffset : 0);
+            let indentAdjust = paraIndentLeft;
+            if (isFirstLine && !isListItem) {
+              indentAdjust += firstLineOffset;
             }
-            const rectX = fragment.x + markerWidth + indentAdjust + Math.min(startX, endX);
+            const rectX = fragment.x + indentAdjust + Math.min(startX, endX);
             const rectWidth = Math.max(1, Math.abs(endX - startX));
             const lineOffset = lineHeightBeforeIndex(measure, index2) - lineHeightBeforeIndex(measure, fragment.fromLine);
             const rectY = fragment.y + lineOffset;
@@ -89141,6 +89148,9 @@ ${l}
               let blockTopCursor = padding.top + verticalOffset;
               renderedBlocks.forEach((info) => {
                 const paragraphMarkerWidth = info.measure.marker?.markerWidth ?? 0;
+                const isListItem = paragraphMarkerWidth > 0;
+                const alignmentOverride = isListItem ? "left" : void 0;
+                const paraIndentLeft = info.block.kind === "paragraph" ? info.block.attrs?.indent?.left ?? 0 : 0;
                 const intersectingLines = findLinesIntersectingRange(info.block, info.measure, from2, to);
                 intersectingLines.forEach(({ line, index: index2 }) => {
                   if (index2 < info.startLine || index2 >= info.endLine) {
@@ -89154,9 +89164,9 @@ ${l}
                   const charOffsetFrom = pmPosToCharOffset(info.block, line, sliceFrom);
                   const charOffsetTo = pmPosToCharOffset(info.block, line, sliceTo);
                   const availableWidth = Math.max(1, cellMeasure.width - padding.left - padding.right);
-                  const startX = mapPmToX(info.block, line, charOffsetFrom, availableWidth);
-                  const endX = mapPmToX(info.block, line, charOffsetTo, availableWidth);
-                  const rectX = fragment.x + cellX + padding.left + paragraphMarkerWidth + Math.min(startX, endX);
+                  const startX = mapPmToX(info.block, line, charOffsetFrom, availableWidth, alignmentOverride);
+                  const endX = mapPmToX(info.block, line, charOffsetTo, availableWidth, alignmentOverride);
+                  const rectX = fragment.x + cellX + padding.left + paraIndentLeft + Math.min(startX, endX);
                   const rectWidth = Math.max(1, Math.abs(endX - startX));
                   const lineOffset = lineHeightBeforeIndex(info.measure, index2) - lineHeightBeforeIndex(info.measure, info.startLine);
                   const rectY = fragment.y + rowOffset + blockTopCursor + lineOffset;
@@ -89415,11 +89425,11 @@ ${l}
     }
     return height;
   };
-  const mapPointToPm = (block, line, x2, isRTL, availableWidthOverride) => {
+  const mapPointToPm = (block, line, x2, isRTL, availableWidthOverride, alignmentOverride) => {
     if (block.kind !== "paragraph") return null;
     const range2 = computeLinePmRange(block, line);
     if (range2.pmStart == null || range2.pmEnd == null) return null;
-    const result = findCharacterAtX(block, line, x2, range2.pmStart, availableWidthOverride);
+    const result = findCharacterAtX(block, line, x2, range2.pmStart, availableWidthOverride, alignmentOverride);
     if (isRTL) {
       const charOffset = result.charOffset;
       const charsInLine = Math.max(1, line.toChar - line.fromChar);
@@ -89428,7 +89438,7 @@ ${l}
     }
     return result.pmPosition;
   };
-  const mapPmToX = (block, line, offset2, fragmentWidth) => {
+  const mapPmToX = (block, line, offset2, fragmentWidth, alignmentOverride) => {
     if (fragmentWidth <= 0 || line.width <= 0) return 0;
     let paraIndentLeft = 0;
     let paraIndentRight = 0;
@@ -89445,7 +89455,7 @@ ${l}
         `[mapPmToX] Paragraph indents (${totalIndent}px) exceed fragment width (${fragmentWidth}px) for block ${block.id}. This may indicate a layout miscalculation. Available width clamped to 0.`
       );
     }
-    return measureCharacterX(block, line, offset2, availableWidth);
+    return measureCharacterX(block, line, offset2, availableWidth, alignmentOverride);
   };
   const isRtlBlock = (block) => {
     if (block.kind !== "paragraph") return false;
@@ -93512,6 +93522,74 @@ ${l}
     getLayoutOptions() {
       return { ...__privateGet$1(this, _layoutOptions) };
     }
+    /**
+     * Get the page styles for the section containing the current caret position.
+     *
+     * In multi-section documents, different sections can have different page sizes,
+     * margins, and orientations. This method returns the styles for the section
+     * where the caret is currently located, enabling section-aware UI components
+     * like rulers to display accurate information.
+     *
+     * @returns Object containing:
+     *   - pageSize: { width, height } in inches
+     *   - pageMargins: { left, right, top, bottom } in inches
+     *   - sectionIndex: The current section index (0-based)
+     *   - orientation: 'portrait' or 'landscape'
+     *
+     * Falls back to document-level defaults if section info is unavailable.
+     *
+     * @example
+     * ```typescript
+     * const sectionStyles = presentation.getCurrentSectionPageStyles();
+     * console.log(`Section ${sectionStyles.sectionIndex}: ${sectionStyles.pageSize.width}" x ${sectionStyles.pageSize.height}"`);
+     * ```
+     */
+    getCurrentSectionPageStyles() {
+      const PPI2 = 96;
+      const layout = __privateGet$1(this, _layoutState).layout;
+      const pageIndex = __privateMethod$1(this, _PresentationEditor_instances, getCurrentPageIndex_fn).call(this);
+      const page = layout?.pages?.[pageIndex];
+      const converterStyles = __privateGet$1(this, _editor3).converter?.pageStyles ?? {};
+      const defaultMargins = converterStyles.pageMargins ?? { left: 1, right: 1, top: 1, bottom: 1 };
+      const safeMargins = {
+        left: typeof defaultMargins.left === "number" ? defaultMargins.left : 1,
+        right: typeof defaultMargins.right === "number" ? defaultMargins.right : 1,
+        top: typeof defaultMargins.top === "number" ? defaultMargins.top : 1,
+        bottom: typeof defaultMargins.bottom === "number" ? defaultMargins.bottom : 1
+      };
+      if (!page) {
+        return {
+          pageSize: { width: 8.5, height: 11 },
+          pageMargins: safeMargins,
+          sectionIndex: 0,
+          orientation: "portrait"
+        };
+      }
+      const pageOrientation = page.orientation === "landscape" || page.orientation === "portrait" ? page.orientation : "portrait";
+      const standardPortrait = { w: 8.5 * PPI2, h: 11 * PPI2 };
+      const standardLandscape = { w: 11 * PPI2, h: 8.5 * PPI2 };
+      const orientationDefault = pageOrientation === "landscape" ? standardLandscape : standardPortrait;
+      const pageWidthPx = page.size?.w ?? orientationDefault.w;
+      const pageHeightPx = page.size?.h ?? orientationDefault.h;
+      const marginLeftPx = page.margins?.left ?? safeMargins.left * PPI2;
+      const marginRightPx = page.margins?.right ?? safeMargins.right * PPI2;
+      const marginTopPx = page.margins?.top ?? safeMargins.top * PPI2;
+      const marginBottomPx = page.margins?.bottom ?? safeMargins.bottom * PPI2;
+      return {
+        pageSize: {
+          width: pageWidthPx / PPI2,
+          height: pageHeightPx / PPI2
+        },
+        pageMargins: {
+          left: marginLeftPx / PPI2,
+          right: marginRightPx / PPI2,
+          top: marginTopPx / PPI2,
+          bottom: marginBottomPx / PPI2
+        },
+        sectionIndex: page.sectionIndex ?? 0,
+        orientation: pageOrientation
+      };
+    }
     /**
      * Get current remote cursor states (normalized to absolute PM positions).
      * Returns an array of cursor states for all remote collaborators, excluding the local user.
@@ -96406,9 +96484,26 @@ ${l}
     }
     const layout = __privateGet$1(this, _layoutState).layout;
     const selection = __privateGet$1(this, _editor3).state?.selection;
-    if (!layout || !selection) return 0;
+    if (!layout || !selection) {
+      return 0;
+    }
     const rects = selectionToRects(layout, __privateGet$1(this, _layoutState).blocks, __privateGet$1(this, _layoutState).measures, selection.from, selection.to) ?? [];
-    return rects[0]?.pageIndex ?? 0;
+    if (rects.length > 0) {
+      return rects[0]?.pageIndex ?? 0;
+    }
+    const pos = selection.from;
+    for (let pageIdx = 0; pageIdx < layout.pages.length; pageIdx++) {
+      const page = layout.pages[pageIdx];
+      for (const fragment of page.fragments) {
+        const frag = fragment;
+        if (frag.pmStart != null && frag.pmEnd != null) {
+          if (pos >= frag.pmStart && pos <= frag.pmEnd) {
+            return pageIdx;
+          }
+        }
+      }
+    }
+    return 0;
   };
   findRegionForPage_fn = function(kind, pageIndex) {
     const map2 = kind === "header" ? __privateGet$1(this, _headerRegions) : __privateGet$1(this, _footerRegions);
@@ -131116,6 +131211,7 @@ ${style2}
       const rulerHandleActiveColor = ref("#2563EB66");
       const pageSize = ref(null);
       const pageMargins = ref(null);
+      const currentSectionIndex = ref(0);
       const isDragging = ref(false);
       const currentHandle = ref(null);
       const leftHandle = reactive({ side: "left", x: 0 });
@@ -131123,9 +131219,29 @@ ${style2}
       const showVerticalIndicator = ref(false);
       const initialX = ref(0);
       let offsetX = 0;
-      const initRuler = () => {
-        if (props.editor.options.mode !== "docx") return null;
-        const { pageMargins: docMargins, pageSize: docSize } = props.editor.getPageStyles();
+      let selectionUpdateHandler = null;
+      const getPresentationEditor = () => {
+        return props.editor?.presentationEditor ?? null;
+      };
+      const updateRulerForCurrentSection = () => {
+        if (!props.editor || props.editor.options?.mode !== "docx") return;
+        const presentationEditor = getPresentationEditor();
+        let docSize, docMargins, sectionIndex;
+        if (presentationEditor && typeof presentationEditor.getCurrentSectionPageStyles === "function") {
+          const sectionStyles = presentationEditor.getCurrentSectionPageStyles();
+          docSize = sectionStyles.pageSize;
+          docMargins = sectionStyles.pageMargins;
+          sectionIndex = sectionStyles.sectionIndex;
+        } else {
+          const styles = props.editor.getPageStyles();
+          docSize = styles.pageSize ?? { width: 8.5, height: 11 };
+          docMargins = styles.pageMargins ?? { left: 1, right: 1, top: 1, bottom: 1 };
+          sectionIndex = 0;
+        }
+        if (pageSize.value && currentSectionIndex.value === sectionIndex) {
+          return;
+        }
+        currentSectionIndex.value = sectionIndex;
         pageSize.value = docSize;
         pageMargins.value = docMargins;
         const definition2 = generateRulerDefinition({
@@ -131139,7 +131255,7 @@ ${style2}
         });
         leftHandle.x = definition2.leftMarginPx;
         rightHandle.x = definition2.rightMarginPx;
-        return definition2;
+        rulerDefinition.value = definition2;
       };
       const getTickStyle = computed(() => (tick) => {
         return {
@@ -131193,7 +131309,8 @@ ${style2}
           const marginValue = getNewMarginValue();
           emit2("margin-change", {
             side: currentHandle.value.side,
-            value: marginValue
+            value: marginValue,
+            sectionIndex: currentSectionIndex.value
           });
         }
       };
@@ -131217,12 +131334,40 @@ ${style2}
           "--ruler-width": `${width}px`
         };
       });
+      const handleSelectionUpdate = () => {
+        if (isDragging.value) return;
+        updateRulerForCurrentSection();
+      };
+      const setupEditorListeners = () => {
+        if (!props.editor) return;
+        selectionUpdateHandler = handleSelectionUpdate;
+        props.editor.on("selectionUpdate", selectionUpdateHandler);
+      };
+      const cleanupEditorListeners = () => {
+        if (!props.editor || !selectionUpdateHandler) return;
+        props.editor.off("selectionUpdate", selectionUpdateHandler);
+        selectionUpdateHandler = null;
+      };
+      watch(
+        () => props.editor,
+        (newEditor, oldEditor) => {
+          if (oldEditor && selectionUpdateHandler) {
+            oldEditor.off("selectionUpdate", selectionUpdateHandler);
+          }
+          if (newEditor) {
+            setupEditorListeners();
+            updateRulerForCurrentSection();
+          }
+        }
+      );
       onMounted(() => {
-        rulerDefinition.value = initRuler();
+        updateRulerForCurrentSection();
+        setupEditorListeners();
         window.addEventListener("mousemove", handleMouseMove2);
         window.addEventListener("mouseup", handleMouseUp);
       });
       onUnmounted(() => {
+        cleanupEditorListeners();
         window.removeEventListener("mousemove", handleMouseMove2);
         window.removeEventListener("mouseup", handleMouseUp);
       });
@@ -131263,7 +131408,7 @@ ${style2}
       };
     }
   };
-  const Ruler = /* @__PURE__ */ _export_sfc$1(_sfc_main$6$1, [["__scopeId", "data-v-b9f4f30a"]]);
+  const Ruler = /* @__PURE__ */ _export_sfc$1(_sfc_main$6$1, [["__scopeId", "data-v-0d1b9cd1"]]);
   const _sfc_main$5$1 = {
     __name: "GenericPopover",
     props: {
@@ -150253,7 +150398,7 @@ ${style2}
       this.config.colors = shuffleArray(this.config.colors);
       this.userColorMap = /* @__PURE__ */ new Map();
       this.colorIndex = 0;
-      this.version = "1.0.0-beta.71";
+      this.version = "1.0.0-beta.73";
       this.#log("🦋 [superdoc] Using SuperDoc version:", this.version);
       this.superdocId = config2.superdocId || v4();
       this.colors = this.config.colors;
@@ -152725,7 +152870,7 @@ ${style2}
       value && typeof value === "object" && "byteLength" in value && "byteOffset" in value
     );
   }
-  const indexDNdPLYmc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  const indexDZuRXtuO = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     __proto__: null,
     unified
   }, Symbol.toStringTag, { value: "Module" }));