superdoc 0.35.3 → 0.36.0

package/dist/style.css

@@ -2323,10 +2323,10 @@ on the right if it is inside shape textbox.
   min-height: 40px;
 }
 
-.editor-element[data-v-86fdd359] {
+.editor-element[data-v-25b8680d] {
   position: relative;
 }
-.super-editor-container[data-v-86fdd359] {
+.super-editor-container[data-v-25b8680d] {
   width: auto;
   height: auto;
   min-width: 8in;
@@ -2335,13 +2335,17 @@ on the right if it is inside shape textbox.
   display: flex;
   flex-direction: column;
 }
-.ruler[data-v-86fdd359] {
+.super-editor-container.no-min-height[data-v-25b8680d] {
+  min-height: unset;
+  min-width: unset;
+}
+.ruler[data-v-25b8680d] {
   margin-bottom: 2px;
 }
-.super-editor[data-v-86fdd359] {
+.super-editor[data-v-25b8680d] {
   color: initial;
 }
-.placeholder-editor[data-v-86fdd359] {
+.placeholder-editor[data-v-25b8680d] {
   position: absolute;
   top: 0;
   left: 0;
@@ -2353,7 +2357,7 @@ on the right if it is inside shape textbox.
   background-color: white;
   box-sizing: border-box;
 }
-.placeholder-title[data-v-86fdd359] {
+.placeholder-title[data-v-25b8680d] {
   display: flex;
   justify-content: center;
   margin-bottom: 40px;
@@ -2537,46 +2541,46 @@ img[data-v-7dd69850] {
     box-shadow: 0 0 5px hsla(0, 0%, 0%, 0.05);
 }
 
-.superdoc[data-v-29e35f23] {
+.superdoc[data-v-5138e8c6] {
   display: flex;
 }
-.right-sidebar[data-v-29e35f23] {
+.right-sidebar[data-v-5138e8c6] {
   min-width: 320px;
 }
-.floating-comments[data-v-29e35f23] {
+.floating-comments[data-v-5138e8c6] {
   min-width: 300px;
   width: 300px;
 }
-.superdoc__layers[data-v-29e35f23] {
+.superdoc__layers[data-v-5138e8c6] {
   height: 100%;
   position: relative;
   box-sizing: border-box;
 }
-.superdoc__document[data-v-29e35f23] {
+.superdoc__document[data-v-5138e8c6] {
   width: 100%;
   position: relative;
 }
-.superdoc__sub-document[data-v-29e35f23] {
+.superdoc__sub-document[data-v-5138e8c6] {
   width: 100%;
   position: relative;
 }
-.superdoc__selection-layer[data-v-29e35f23] {
+.superdoc__selection-layer[data-v-5138e8c6] {
   position: absolute;
   min-width: 100%;
   min-height: 100%;
   z-index: 10;
   pointer-events: none;
 }
-.superdoc__temp-selection[data-v-29e35f23] {
+.superdoc__temp-selection[data-v-5138e8c6] {
   position: absolute;
 }
-.superdoc__comments-layer[data-v-29e35f23] {
+.superdoc__comments-layer[data-v-5138e8c6] {
   /* position: absolute; */
   top: 0;
   height: 100%;
   position: relative;
 }
-.superdoc__right-sidebar[data-v-29e35f23] {
+.superdoc__right-sidebar[data-v-5138e8c6] {
   width: 320px;
   min-width: 320px;
   padding: 0 10px;
@@ -2586,14 +2590,14 @@ img[data-v-7dd69850] {
 }
 
 /* Tools styles */
-.tools[data-v-29e35f23] {
+.tools[data-v-5138e8c6] {
   position: absolute;
   z-index: 3;
   display: flex;
   flex-direction: column;
   gap: 6px;
 }
-.tools .tool-icon[data-v-29e35f23] {
+.tools .tool-icon[data-v-5138e8c6] {
   font-size: 20px;
   border-radius: 12px;
   border: none;
@@ -2601,7 +2605,7 @@ img[data-v-7dd69850] {
   background-color: #dbdbdb;
   cursor: pointer;
 }
-.tools-item[data-v-29e35f23] {
+.tools-item[data-v-5138e8c6] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2611,10 +2615,10 @@ img[data-v-7dd69850] {
   border-radius: 12px;
   cursor: pointer;
 }
-.tools-item i[data-v-29e35f23] {
+.tools-item i[data-v-5138e8c6] {
   cursor: pointer;
 }
-.superdoc__tools-icon[data-v-29e35f23] {
+.superdoc__tools-icon[data-v-5138e8c6] {
   width: 20px;
   height: 20px;
   flex-shrink: 0;
@@ -2629,15 +2633,15 @@ img[data-v-7dd69850] {
 
 /* 834px is iPad screen size in portrait orientation */
 @media (max-width: 834px) {
-.superdoc .superdoc__layers[data-v-29e35f23] {
+.superdoc .superdoc__layers[data-v-5138e8c6] {
     margin: 0;
     border: 0 !important;
     box-shadow: none;
 }
-.superdoc__sub-document[data-v-29e35f23] {
+.superdoc__sub-document[data-v-5138e8c6] {
     max-width: 100%;
 }
-.superdoc__right-sidebar[data-v-29e35f23] {
+.superdoc__right-sidebar[data-v-5138e8c6] {
     padding: 10px;
     width: 55px;
     position: relative;
@@ -2645,7 +2649,7 @@ img[data-v-7dd69850] {
 }
 
 /* AI Writer styles */
-.ai-writer-container[data-v-29e35f23] {
+.ai-writer-container[data-v-5138e8c6] {
   position: fixed;
   z-index: 1000;
   background: white;
@@ -2663,13 +2667,13 @@ img[data-v-7dd69850] {
 } */
 
 /* Tools styles */
-.tools[data-v-29e35f23] {
+.tools[data-v-5138e8c6] {
   position: absolute;
   z-index: 3;
   display: flex;
   gap: 6px;
 }
-.tools .tool-icon[data-v-29e35f23] {
+.tools .tool-icon[data-v-5138e8c6] {
   font-size: 20px;
   border-radius: 12px;
   border: none;
@@ -2677,7 +2681,7 @@ img[data-v-7dd69850] {
   background-color: #dbdbdb;
   cursor: pointer;
 }
-.tools-item[data-v-29e35f23] {
+.tools-item[data-v-5138e8c6] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2688,18 +2692,18 @@ img[data-v-7dd69850] {
   border-radius: 12px;
   cursor: pointer;
 }
-.tools-item i[data-v-29e35f23] {
+.tools-item i[data-v-5138e8c6] {
   cursor: pointer;
 }
-.superdoc__tools-icon[data-v-29e35f23] {
+.superdoc__tools-icon[data-v-5138e8c6] {
   width: 20px;
   height: 20px;
   flex-shrink: 0;
 }
-.ai-tool > svg[data-v-29e35f23] {
+.ai-tool > svg[data-v-5138e8c6] {
   fill: transparent;
 }
-.ai-tool[data-v-29e35f23]::before {
+.ai-tool[data-v-5138e8c6]::before {
   content: '';
   position: absolute;
   width: 20px;
@@ -2720,7 +2724,7 @@ img[data-v-7dd69850] {
   filter: brightness(1.2);
   transition: filter 0.2s ease;
 }
-.ai-tool[data-v-29e35f23]:hover::before {
+.ai-tool[data-v-5138e8c6]:hover::before {
   filter: brightness(1.3);
 }
 

package/dist/super-editor/ai-writer.es.js

@@ -1,6 +1,6 @@
 import { ref, onMounted, onUnmounted, computed, createElementBlock, openBlock, withModifiers, createElementVNode, withDirectives, unref, vModelText, createCommentVNode, nextTick } from "vue";
-import { T as TextSelection } from "./chunks/converter-DCcuo33v.js";
-import { _ as _export_sfc } from "./chunks/editor-CyldDVIe.js";
+import { T as TextSelection } from "./chunks/converter-B_MV8Ifd.js";
+import { _ as _export_sfc } from "./chunks/editor-DJdDJYe1.js";
 const DEFAULT_API_ENDPOINT = "https://sd-dev-express-gateway-i6xtm.ondigitalocean.app/insights";
 const SYSTEM_PROMPT = "You are an expert copywriter and you are immersed in a document editor. You are to provide document related text responses based on the user prompts. Only write what is asked for. Do not provide explanations. Try to keep placeholders as short as possible. Do not output your prompt. Your instructions are: ";
 async function baseInsightsFetch(payload, options = {}) {

package/dist/super-editor/chunks/{converter-DCcuo33v.js → converter-B_MV8Ifd.js}

@@ -36067,7 +36067,7 @@ const _SuperConverter = class _SuperConverter {
   static getStoredSuperdocVersion(docx) {
     return _SuperConverter.getStoredCustomProperty(docx, "SuperdocVersion");
   }
-  static setStoredSuperdocVersion(docx = this.convertedXml, version = "0.35.3") {
+  static setStoredSuperdocVersion(docx = this.convertedXml, version = "0.36.0") {
     return _SuperConverter.setStoredCustomProperty(docx, "SuperdocVersion", version, false);
   }
   /**

package/dist/super-editor/chunks/{docx-zipper-BmJ2rJSz.js → docx-zipper-BErVQPhm.js}

@@ -1,4 +1,4 @@
-import { p as process$1, az as commonjsGlobal, B as Buffer, aA as getDefaultExportFromCjs, aB as getContentTypesFromXml, aC as xmljs } from "./converter-DCcuo33v.js";
+import { p as process$1, az as commonjsGlobal, B as Buffer, aA as getDefaultExportFromCjs, aB as getContentTypesFromXml, aC as xmljs } from "./converter-B_MV8Ifd.js";
 function commonjsRequire(path) {
   throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
 }

package/dist/super-editor/chunks/{editor-CyldDVIe.js → editor-DJdDJYe1.js}

@@ -9,11 +9,11 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _Attribute_static, getGlobalAttributes_fn, getNodeAndMarksAttributes_fn, _Schema_static, createNodesSchema_fn, createMarksSchema_fn, _events, _ExtensionService_instances, setupExtensions_fn, attachEditorEvents_fn, _editor, _stateValidators, _xmlValidators, _requiredNodeTypes, _requiredMarkTypes, _SuperValidator_instances, initializeValidators_fn, collectValidatorRequirements_fn, analyzeDocument_fn, _commandService, _Editor_instances, initContainerElement_fn, init_fn, initRichText_fn, onFocus_fn, checkHeadless_fn, registerCopyHandler_fn, insertNewFileData_fn, createExtensionService_fn, createCommandService_fn, createConverter_fn, initMedia_fn, initFonts_fn, checkFonts_fn, determineUnsupportedFonts_fn, createSchema_fn, generatePmData_fn, createView_fn, onCollaborationReady_fn, initComments_fn, initPagination_fn, dispatchTransaction_fn, handleNodeSelection_fn, prepareDocumentForImport_fn, prepareDocumentForExport_fn, endCollaboration_fn, validateDocumentInit_fn, validateDocumentExport_fn, initDevTools_fn, _DocumentSectionView_instances, init_fn2, addToolTip_fn, _ListItemNodeView_instances, init_fn3, applyIndentStyling_fn, _FieldAnnotationView_instances, createAnnotation_fn, _AutoPageNumberNodeView_instances, renderDom_fn, scheduleUpdateNodeStyle_fn;
+var _Attribute_static, getGlobalAttributes_fn, getNodeAndMarksAttributes_fn, _Schema_static, createNodesSchema_fn, createMarksSchema_fn, _events, _ExtensionService_instances, setupExtensions_fn, attachEditorEvents_fn, _editor, _stateValidators, _xmlValidators, _requiredNodeTypes, _requiredMarkTypes, _SuperValidator_instances, initializeValidators_fn, collectValidatorRequirements_fn, analyzeDocument_fn, _commandService, _Editor_instances, initContainerElement_fn, init_fn, initRichText_fn, onFocus_fn, checkHeadless_fn, validateLayoutMargins_fn, isResponsiveMode_fn, registerCopyHandler_fn, insertNewFileData_fn, createExtensionService_fn, createCommandService_fn, createConverter_fn, initMedia_fn, initFonts_fn, checkFonts_fn, determineUnsupportedFonts_fn, createSchema_fn, generatePmData_fn, createView_fn, onCollaborationReady_fn, initComments_fn, initPagination_fn, dispatchTransaction_fn, handleNodeSelection_fn, prepareDocumentForImport_fn, prepareDocumentForExport_fn, endCollaboration_fn, validateDocumentInit_fn, validateDocumentExport_fn, initDevTools_fn, _DocumentSectionView_instances, init_fn2, addToolTip_fn, _ListItemNodeView_instances, init_fn3, applyIndentStyling_fn, _FieldAnnotationView_instances, createAnnotation_fn, _AutoPageNumberNodeView_instances, renderDom_fn, scheduleUpdateNodeStyle_fn;
 import * as Y from "yjs";
 import { UndoManager, Item as Item$1, ContentType, Text as Text$1, XmlElement, encodeStateAsUpdate } from "yjs";
-import { P as PluginKey, a as Plugin, M as Mapping, N as NodeSelection, S as Selection, T as TextSelection, b as Slice, D as DOMSerializer, F as Fragment, c as DOMParser$1, d as Mark$1, e as dropPoint, A as AllSelection, p as process$1, B as Buffer2, f as callOrGet, g as getExtensionConfigField, h as getMarkType, i as getMarksFromSelection, j as getNodeType, k as getSchemaTypeNameByName, l as Schema$1, m as cleanSchemaItem, n as canSplit, o as defaultBlockAt$1, q as liftTarget, r as canJoin, s as joinPoint, t as replaceStep$1, R as ReplaceAroundStep$1, u as isTextSelection, v as getMarkRange, w as isMarkActive, x as isNodeActive, y as deleteProps, z as processContent, C as ReplaceStep, E as NodeRange, G as findWrapping, L as ListHelpers, H as findParentNode, I as isMacOS, J as isIOS, K as getSchemaTypeByName, O as inputRulesPlugin, Q as TrackDeleteMarkName, U as TrackInsertMarkName, V as v4, W as TrackFormatMarkName, X as comments_module_events, Y as findMark, Z as objectIncludes, _ as AddMarkStep, $ as RemoveMarkStep, a0 as twipsToLines, a1 as pixelsToTwips, a2 as helpers, a3 as posToDOMRect, a4 as CommandService, a5 as SuperConverter, a6 as createDocument, a7 as createDocFromMarkdown, a8 as createDocFromHTML, a9 as EditorState, aa as hasSomeParentWithClass, ab as isActive, ac as unflattenListsInHtml, ad as parseSizeUnit, ae as minMax, af as getLineHeightValueString, ag as updateDOMAttributes, ah as findChildren$5, ai as htmlHandler, aj as generateRandomSigned32BitIntStrId, ak as InputRule, al as kebabCase, am as findParentNodeClosestToPos, an as getListItemStyleDefinitions, ao as docxNumberingHelpers, ap as parseIndentElement, aq as combineIndents, ar as twipsToPixels, as as PIXELS_PER_INCH, at as SelectionRange, au as Transform, av as isInTable$1, aw as generateDocxRandomId, ax as insertNewRelationship, ay as inchesToPixels } from "./converter-DCcuo33v.js";
-import { D as DocxZipper } from "./docx-zipper-BmJ2rJSz.js";
+import { P as PluginKey, a as Plugin, M as Mapping, N as NodeSelection, S as Selection, T as TextSelection, b as Slice, D as DOMSerializer, F as Fragment, c as DOMParser$1, d as Mark$1, e as dropPoint, A as AllSelection, p as process$1, B as Buffer2, f as callOrGet, g as getExtensionConfigField, h as getMarkType, i as getMarksFromSelection, j as getNodeType, k as getSchemaTypeNameByName, l as Schema$1, m as cleanSchemaItem, n as canSplit, o as defaultBlockAt$1, q as liftTarget, r as canJoin, s as joinPoint, t as replaceStep$1, R as ReplaceAroundStep$1, u as isTextSelection, v as getMarkRange, w as isMarkActive, x as isNodeActive, y as deleteProps, z as processContent, C as ReplaceStep, E as NodeRange, G as findWrapping, L as ListHelpers, H as findParentNode, I as isMacOS, J as isIOS, K as getSchemaTypeByName, O as inputRulesPlugin, Q as TrackDeleteMarkName, U as TrackInsertMarkName, V as v4, W as TrackFormatMarkName, X as comments_module_events, Y as findMark, Z as objectIncludes, _ as AddMarkStep, $ as RemoveMarkStep, a0 as twipsToLines, a1 as pixelsToTwips, a2 as helpers, a3 as posToDOMRect, a4 as CommandService, a5 as SuperConverter, a6 as createDocument, a7 as createDocFromMarkdown, a8 as createDocFromHTML, a9 as EditorState, aa as hasSomeParentWithClass, ab as isActive, ac as unflattenListsInHtml, ad as parseSizeUnit, ae as minMax, af as getLineHeightValueString, ag as updateDOMAttributes, ah as findChildren$5, ai as htmlHandler, aj as generateRandomSigned32BitIntStrId, ak as InputRule, al as kebabCase, am as findParentNodeClosestToPos, an as getListItemStyleDefinitions, ao as docxNumberingHelpers, ap as parseIndentElement, aq as combineIndents, ar as twipsToPixels, as as PIXELS_PER_INCH$1, at as SelectionRange, au as Transform, av as isInTable$1, aw as generateDocxRandomId, ax as insertNewRelationship, ay as inchesToPixels } from "./converter-B_MV8Ifd.js";
+import { D as DocxZipper } from "./docx-zipper-BErVQPhm.js";
 import { ref, computed, createElementBlock, openBlock, withModifiers, Fragment as Fragment$1, renderList, normalizeClass, createCommentVNode, toDisplayString, createElementVNode, createApp } from "vue";
 var GOOD_LEAF_SIZE = 200;
 var RopeSequence = function RopeSequence2() {
@@ -14494,6 +14494,9 @@ function buildSchemaSummary(schema, schemaVersion) {
     marks
   };
 }
+const PIXELS_PER_INCH = 96;
+const MAX_HEIGHT_BUFFER_PX = 50;
+const MAX_WIDTH_BUFFER_PX = 20;
 const _Editor = class _Editor extends EventEmitter {
   /**
    * Create a new Editor instance
@@ -14575,6 +14578,8 @@ const _Editor = class _Editor extends EventEmitter {
       lastSelection: null,
       suppressDefaultDocxStyles: false,
       jsonOverride: null,
+      layoutMode: "paginated",
+      layoutMargins: null,
       onBeforeCreate: () => null,
       onCreate: () => null,
       onUpdate: () => null,
@@ -14613,6 +14618,7 @@ const _Editor = class _Editor extends EventEmitter {
     });
     __privateMethod(this, _Editor_instances, initContainerElement_fn).call(this, options);
     __privateMethod(this, _Editor_instances, checkHeadless_fn).call(this, options);
+    __privateMethod(this, _Editor_instances, validateLayoutMargins_fn).call(this, options);
     this.setOptions(options);
     let modes = {
       docx: () => __privateMethod(this, _Editor_instances, init_fn).call(this),
@@ -14991,17 +14997,28 @@ const _Editor = class _Editor extends EventEmitter {
     });
   }
   /**
-   * Get the maximum content size
-   * @returns {Object} Size object with width and height
+   * Get the maximum content size based on page dimensions and margins
+   * @returns {{width: number, height: number} | {}} Size object with width and height in pixels, or empty object if no page size
    */
   getMaxContentSize() {
     if (!this.converter) return {};
     const { pageSize = {}, pageMargins = {} } = this.converter.pageStyles ?? {};
+    const { layoutMargins } = this.options;
     const { width, height } = pageSize;
-    const { top: top2 = 0, bottom: bottom2 = 0, left: left2 = 0, right: right2 = 0 } = pageMargins;
+    const isResponsive = __privateMethod(this, _Editor_instances, isResponsiveMode_fn).call(this);
+    const getMarginPx = (side) => {
+      if (isResponsive) {
+        return layoutMargins?.[side] ?? PIXELS_PER_INCH;
+      }
+      return (pageMargins?.[side] ?? 0) * PIXELS_PER_INCH;
+    };
+    const topPx = getMarginPx("top");
+    const bottomPx = getMarginPx("bottom");
+    const leftPx = getMarginPx("left");
+    const rightPx = getMarginPx("right");
     if (!width || !height) return {};
-    const maxHeight = height * 96 - top2 * 96 - bottom2 * 96 - 50;
-    const maxWidth = width * 96 - left2 * 96 - right2 * 96 - 20;
+    const maxHeight = height * PIXELS_PER_INCH - topPx - bottomPx - MAX_HEIGHT_BUFFER_PX;
+    const maxWidth = width * PIXELS_PER_INCH - leftPx - rightPx - MAX_WIDTH_BUFFER_PX;
     return {
       width: maxWidth,
       height: maxHeight
@@ -15009,9 +15026,15 @@ const _Editor = class _Editor extends EventEmitter {
   }
   /**
    * Attach styles and attributes to the editor element
+   * @param {HTMLElement} element - The editor container element
+   * @param {HTMLElement} proseMirror - The ProseMirror element
+   * @param {boolean} [hasPaginationEnabled=true] - Whether pagination is enabled
+   * @returns {void}
    */
   updateEditorStyles(element, proseMirror, hasPaginationEnabled = true) {
     const { pageSize, pageMargins } = this.converter.pageStyles ?? {};
+    const { layoutMargins, pagination } = this.options;
+    const isResponsive = __privateMethod(this, _Editor_instances, isResponsiveMode_fn).call(this);
     if (!proseMirror || !element) {
       return;
     }
@@ -15020,12 +15043,17 @@ const _Editor = class _Editor extends EventEmitter {
     proseMirror.setAttribute("aria-label", "Main content area, start typing to enter text.");
     proseMirror.setAttribute("aria-description", "");
     proseMirror.classList.remove("view-mode");
-    if (pageSize) {
-      element.style.width = pageSize.width + "in";
-      element.style.minWidth = pageSize.width + "in";
-      element.style.minHeight = pageSize.height + "in";
+    if (pageSize?.width != null) {
+      element.style.width = isResponsive ? "100%" : `${pageSize.width}in`;
+      element.style.minWidth = isResponsive ? "" : `${pageSize.width}in`;
     }
-    if (pageMargins) {
+    if (pageSize?.height != null) {
+      element.style.minHeight = isResponsive ? "" : `${pageSize.height}in`;
+    }
+    if (isResponsive) {
+      element.style.paddingLeft = (layoutMargins?.left ?? PIXELS_PER_INCH) + "px";
+      element.style.paddingRight = (layoutMargins?.right ?? PIXELS_PER_INCH) + "px";
+    } else if (pageMargins) {
       element.style.paddingLeft = pageMargins.left + "in";
       element.style.paddingRight = pageMargins.right + "in";
     }
@@ -15048,7 +15076,10 @@ const _Editor = class _Editor extends EventEmitter {
     element.style.webkitOverflowScrolling = "touch";
     const defaultLineHeight = 1.2;
     proseMirror.style.lineHeight = defaultLineHeight;
-    if (!hasPaginationEnabled) {
+    if (isResponsive) {
+      proseMirror.style.paddingTop = (layoutMargins?.top ?? PIXELS_PER_INCH) + "px";
+      proseMirror.style.paddingBottom = (layoutMargins?.bottom ?? PIXELS_PER_INCH) + "px";
+    } else if (!pagination) {
       proseMirror.style.paddingTop = "1in";
       proseMirror.style.paddingBottom = "1in";
     } else {
@@ -15073,6 +15104,7 @@ const _Editor = class _Editor extends EventEmitter {
   /**
    * Initializes responsive styles for mobile devices.
    * Sets up scaling based on viewport width and handles orientation changes.
+   * Note: Scaling is skipped in responsive layout mode since content reflows naturally.
    *
    * @param {HTMLElement|void} element - The DOM element to apply mobile styles to
    * @returns {void}
@@ -15081,6 +15113,9 @@ const _Editor = class _Editor extends EventEmitter {
     if (!element) {
       return;
     }
+    if (__privateMethod(this, _Editor_instances, isResponsiveMode_fn).call(this)) {
+      return;
+    }
     const initialWidth = element.offsetWidth;
     const updateScale = () => {
       const minPageSideMargin = 10;
@@ -15229,7 +15264,7 @@ const _Editor = class _Editor extends EventEmitter {
       { default: remarkStringify },
       { default: remarkGfm }
     ] = await Promise.all([
-      import("./index-CUb1VdVb.js"),
+      import("./index-C6pGFRDv.js"),
       import("./index-DRCvimau.js"),
       import("./index-C_x_N6Uh.js"),
       import("./index-D_sWOSiG.js"),
@@ -15447,7 +15482,7 @@ const _Editor = class _Editor extends EventEmitter {
    * @returns {Object | void} Migration results
    */
   processCollaborationMigrations() {
-    console.debug("[checkVersionMigrations] Current editor version", "0.35.3");
+    console.debug("[checkVersionMigrations] Current editor version", "0.36.0");
     if (!this.options.ydoc) return;
     const metaMap = this.options.ydoc.getMap("meta");
     let docVersion = metaMap.get("version");
@@ -15761,6 +15796,39 @@ checkHeadless_fn = function(options) {
     global.window = options.mockWindow;
   }
 };
+/**
+ * Validate layoutMargins option values
+ * @param {EditorOptions} options - Editor options
+ * @returns {void}
+ */
+validateLayoutMargins_fn = function(options) {
+  if (!options.layoutMargins) return;
+  const margins = options.layoutMargins;
+  const validatedMargins = {};
+  let hasValidValues = false;
+  for (const key2 of ["top", "bottom", "left", "right"]) {
+    if (margins[key2] !== void 0 && margins[key2] !== null) {
+      const value = margins[key2];
+      if (typeof value === "number" && Number.isFinite(value) && value >= 0) {
+        validatedMargins[key2] = value;
+        hasValidValues = true;
+      } else {
+        console.warn(
+          `[SuperDoc] Invalid layoutMargins.${key2}: ${value}. Value must be a positive finite number. Ignoring this property.`
+        );
+      }
+    }
+  }
+  options.layoutMargins = hasValidValues ? validatedMargins : null;
+};
+/**
+ * Check if responsive layout mode is enabled
+ * @returns {boolean} True if layoutMode is 'responsive'
+ * @private
+ */
+isResponsiveMode_fn = function() {
+  return this.options.layoutMode === "responsive";
+};
 registerCopyHandler_fn = function() {
   this.view.dom.addEventListener("copy", (event) => {
     const clipboardData = event.clipboardData;
@@ -16043,6 +16111,9 @@ initPagination_fn = async function() {
   if (this.options.isHeadless || !this.extensionService || this.options.isHeaderOrFooter) {
     return;
   }
+  if (__privateMethod(this, _Editor_instances, isResponsiveMode_fn).call(this)) {
+    return;
+  }
   const pagination = this.options.extensions.find((e) => e.name === "pagination");
   if (pagination && this.options.pagination) {
     const sectionData = await initPaginationData(this);
@@ -22057,7 +22128,7 @@ function updateColumns(node, colgroup, table, cellMinWidth, overrideCol, overrid
     const pageWidth = toNumber(pageStyles.pageSize.width);
     const marginLeft = toNumber(pageStyles.pageMargins?.left);
     const marginRight = toNumber(pageStyles.pageMargins?.right);
-    const pageAvailableWidthPx = Math.max((pageWidth - marginLeft - marginRight) * PIXELS_PER_INCH, 0);
+    const pageAvailableWidthPx = Math.max((pageWidth - marginLeft - marginRight) * PIXELS_PER_INCH$1, 0);
     if (pageAvailableWidthPx > 0) {
       availableWidth = availableWidth ? Math.min(availableWidth, pageAvailableWidthPx) : pageAvailableWidthPx;
     }

package/dist/super-editor/chunks/{index-CUb1VdVb.js → index-C6pGFRDv.js}

@@ -1,4 +1,4 @@
-import { aA as getDefaultExportFromCjs } from "./converter-DCcuo33v.js";
+import { aA as getDefaultExportFromCjs } from "./converter-B_MV8Ifd.js";
 import { V as VFile } from "./index-CvBqQJbG.js";
 function bail(error) {
   if (error) {

package/dist/super-editor/chunks/{toolbar-CO92tGD-.js → toolbar-C3z7Pv8Z.js}

@@ -1,6 +1,6 @@
 import { computed, createElementBlock, openBlock, createElementVNode, createCommentVNode, normalizeClass, normalizeStyle, ref, withKeys, unref, withModifiers, createBlock, toDisplayString, withDirectives, vModelText, nextTick, getCurrentInstance, createVNode, readonly, watch, onMounted, onBeforeUnmount, reactive, onBeforeMount, inject, onActivated, onDeactivated, createTextVNode, Fragment, Comment, defineComponent, provide, h, Teleport, toRef, renderSlot, isVNode, shallowRef, watchEffect, mergeProps, Transition, vShow, cloneVNode, Text, renderList, withCtx } from "vue";
-import { p as process$1 } from "./converter-DCcuo33v.js";
-import { _ as _export_sfc, u as useHighContrastMode, g as global$1 } from "./editor-CyldDVIe.js";
+import { p as process$1 } from "./converter-B_MV8Ifd.js";
+import { _ as _export_sfc, u as useHighContrastMode, g as global$1 } from "./editor-DJdDJYe1.js";
 const sanitizeNumber = (value, defaultNumber) => {
   let sanitized = value.replace(/[^0-9.]/g, "");
   sanitized = parseFloat(sanitized);

package/dist/super-editor/converter.es.js

@@ -1,4 +1,4 @@
-import { a5 } from "./chunks/converter-DCcuo33v.js";
+import { a5 } from "./chunks/converter-B_MV8Ifd.js";
 export {
   a5 as SuperConverter
 };

package/dist/super-editor/docx-zipper.es.js

@@ -1,5 +1,5 @@
-import "./chunks/converter-DCcuo33v.js";
-import { D } from "./chunks/docx-zipper-BmJ2rJSz.js";
+import "./chunks/converter-B_MV8Ifd.js";
+import { D } from "./chunks/docx-zipper-BErVQPhm.js";
 export {
   D as default
 };

package/dist/super-editor/editor.es.js

@@ -1,6 +1,6 @@
-import { E } from "./chunks/editor-CyldDVIe.js";
-import "./chunks/converter-DCcuo33v.js";
-import "./chunks/docx-zipper-BmJ2rJSz.js";
+import { E } from "./chunks/editor-DJdDJYe1.js";
+import "./chunks/converter-B_MV8Ifd.js";
+import "./chunks/docx-zipper-BErVQPhm.js";
 export {
   E as Editor
 };

package/dist/super-editor/file-zipper.es.js

@@ -1,4 +1,4 @@
-import { J as JSZip } from "./chunks/docx-zipper-BmJ2rJSz.js";
+import { J as JSZip } from "./chunks/docx-zipper-BErVQPhm.js";
 async function createZip(blobs, fileNames) {
   const zip = new JSZip();
   blobs.forEach((blob, index) => {

package/dist/super-editor/style.css

@@ -1949,10 +1949,10 @@ on the right if it is inside shape textbox.
   min-height: 40px;
 }
 
-.editor-element[data-v-86fdd359] {
+.editor-element[data-v-25b8680d] {
   position: relative;
 }
-.super-editor-container[data-v-86fdd359] {
+.super-editor-container[data-v-25b8680d] {
   width: auto;
   height: auto;
   min-width: 8in;
@@ -1961,13 +1961,17 @@ on the right if it is inside shape textbox.
   display: flex;
   flex-direction: column;
 }
-.ruler[data-v-86fdd359] {
+.super-editor-container.no-min-height[data-v-25b8680d] {
+  min-height: unset;
+  min-width: unset;
+}
+.ruler[data-v-25b8680d] {
   margin-bottom: 2px;
 }
-.super-editor[data-v-86fdd359] {
+.super-editor[data-v-25b8680d] {
   color: initial;
 }
-.placeholder-editor[data-v-86fdd359] {
+.placeholder-editor[data-v-25b8680d] {
   position: absolute;
   top: 0;
   left: 0;
@@ -1979,7 +1983,7 @@ on the right if it is inside shape textbox.
   background-color: white;
   box-sizing: border-box;
 }
-.placeholder-title[data-v-86fdd359] {
+.placeholder-title[data-v-25b8680d] {
   display: flex;
   justify-content: center;
   margin-bottom: 40px;

package/dist/super-editor/super-editor/src/core/Editor.d.ts

@@ -90,6 +90,8 @@
  * @property {string} [html] - HTML content to initialize the editor with
  * @property {string} [markdown] - Markdown content to initialize the editor with
  * @property {boolean} [isDebug=false] - Whether to enable debug mode
+ * @property {'responsive' | 'paginated'} [layoutMode='paginated'] - Document layout mode ('paginated' for fixed page width, 'responsive' for fluid width)
+ * @property {{top?: number, bottom?: number, left?: number, right?: number}} [layoutMargins] - Custom margins in pixels for responsive layout mode
  * @property {(params: {
  *   permission: string,
  *   role?: string,
@@ -223,6 +225,8 @@ export class Editor extends EventEmitter {
         lastSelection: any;
         suppressDefaultDocxStyles: boolean;
         jsonOverride: any;
+        layoutMode: string;
+        layoutMargins: any;
         onBeforeCreate: () => any;
         onCreate: () => any;
         onUpdate: () => any;
@@ -395,14 +399,21 @@ export class Editor extends EventEmitter {
      */
     createNodeViews(): void;
     /**
-     * Get the maximum content size
-     * @returns {Object} Size object with width and height
+     * Get the maximum content size based on page dimensions and margins
+     * @returns {{width: number, height: number} | {}} Size object with width and height in pixels, or empty object if no page size
      */
-    getMaxContentSize(): any;
+    getMaxContentSize(): {
+        width: number;
+        height: number;
+    } | {};
     /**
      * Attach styles and attributes to the editor element
+     * @param {HTMLElement} element - The editor container element
+     * @param {HTMLElement} proseMirror - The ProseMirror element
+     * @param {boolean} [hasPaginationEnabled=true] - Whether pagination is enabled
+     * @returns {void}
      */
-    updateEditorStyles(element: any, proseMirror: any, hasPaginationEnabled?: boolean): void;
+    updateEditorStyles(element: HTMLElement, proseMirror: HTMLElement, hasPaginationEnabled?: boolean): void;
     /**
      * Initialize default styles for the editor container and ProseMirror.
      * Get page size and margins from the converter.
@@ -415,6 +426,7 @@ export class Editor extends EventEmitter {
     /**
      * Initializes responsive styles for mobile devices.
      * Sets up scaling based on viewport width and handles orientation changes.
+     * Note: Scaling is skipped in responsive layout mode since content reflows naturally.
      *
      * @param {HTMLElement|void} element - The DOM element to apply mobile styles to
      * @returns {void}
@@ -915,6 +927,19 @@ export type EditorOptions = {
      * - Whether to enable debug mode
      */
     isDebug?: boolean;
+    /**
+     * - Document layout mode ('paginated' for fixed page width, 'responsive' for fluid width)
+     */
+    layoutMode?: "responsive" | "paginated";
+    /**
+     * - Custom margins in pixels for responsive layout mode
+     */
+    layoutMargins?: {
+        top?: number;
+        bottom?: number;
+        left?: number;
+        right?: number;
+    };
     /**
      * - Host-provided permission hook
      */