@harbour-enterprises/superdoc 0.25.0-next.4 → 0.25.0-next.5

package/dist/superdoc.umd.js

@@ -60282,7 +60282,9 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         isHeaderFooterChanged: false,
         isCustomXmlChanged: false,
         focusTarget: null,
-        permissionResolver: null
+        permissionResolver: null,
+        // header/footer editors may have parent(main) editor set
+        parentEditor: null
       });
       __privateMethod$1(this, _Editor_instances, initContainerElement_fn).call(this, options);
       __privateMethod$1(this, _Editor_instances, checkHeadless_fn).call(this, options);
@@ -72490,58 +72492,6 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       }
     });
   };
-  const normalizeWrap = (attrs = {}) => {
-    const wrap2 = attrs.wrap;
-    if (wrap2?.type && wrap2.type !== "Inline") {
-      return {
-        type: wrap2.type,
-        attrs: wrap2.attrs ?? {}
-      };
-    }
-    if (wrap2?.type === "Inline" && Object.keys(wrap2.attrs ?? {}).length) {
-      return {
-        type: "Inline",
-        attrs: wrap2.attrs
-      };
-    }
-    if (!wrap2 && attrs.wrapText) {
-      return {
-        type: "Square",
-        attrs: {
-          wrapText: attrs.wrapText
-        }
-      };
-    }
-    if (!wrap2 && attrs.wrapTopAndBottom) {
-      return {
-        type: "TopAndBottom",
-        attrs: {}
-      };
-    }
-    if (wrap2?.type === "Inline") {
-      return {
-        type: "Inline",
-        attrs: wrap2.attrs ?? {}
-      };
-    }
-    return {
-      type: "Inline",
-      attrs: {}
-    };
-  };
-  const normalizeMarginOffset = (marginOffset = {}) => {
-    const { left: left2, horizontal, ...rest } = marginOffset;
-    return {
-      ...rest,
-      horizontal: horizontal ?? left2
-    };
-  };
-  const getNormalizedImageAttrs = (attrs = {}) => {
-    return {
-      wrap: normalizeWrap(attrs),
-      marginOffset: normalizeMarginOffset(attrs.marginOffset ?? {})
-    };
-  };
   const ImagePositionPluginKey = new PluginKey("ImagePosition");
   const ImagePositionPlugin = ({ editor }) => {
     const { view } = editor;
@@ -72554,8 +72504,9 @@ Please report this to https://github.com/markedjs/marked.`, e) {
           return DecorationSet.empty;
         },
         apply(tr, oldDecorationSet, oldState, newState) {
-          if (!tr.docChanged) return oldDecorationSet;
+          if (!tr.docChanged && !shouldUpdate) return oldDecorationSet;
           const decorations = getImagePositionDecorations(newState, view);
+          shouldUpdate = false;
           return DecorationSet.create(newState.doc, decorations);
         }
       },
@@ -72564,7 +72515,6 @@ Please report this to https://github.com/markedjs/marked.`, e) {
           update: (view2, lastState) => {
             const pagination = PaginationPluginKey.getState(lastState);
             if (shouldUpdate) {
-              shouldUpdate = false;
               const decorations = getImagePositionDecorations(lastState, view2);
               const updateTransaction = view2.state.tr.setMeta(ImagePositionPluginKey, { decorations });
               view2.dispatch(updateTransaction);
@@ -72590,41 +72540,35 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         let className = "";
         const { vRelativeFrom, alignH } = node.attrs.anchorData;
         const { size: size2, padding } = node.attrs;
-        const { marginOffset } = getNormalizedImageAttrs(node.attrs);
         const pageBreak = findPreviousDomNodeWithClass(view, pos, "pagination-break-wrapper");
-        if (pageBreak) {
-          switch (alignH) {
-            case "left":
-              style2 += "float: left; left: 0; margin-left: 0; ";
-              break;
-            case "right":
-              style2 += "float: right; right: 0; margin-right: 0; ";
-              break;
-            case "center":
-              style2 += "display: block; margin-left: auto; margin-right: auto; ";
-              break;
+        if (pageBreak && vRelativeFrom === "margin" && alignH) {
+          const topPos = pageBreak?.offsetTop + pageBreak?.offsetHeight;
+          let horizontalAlignment = `${alignH}: 0;`;
+          if (alignH === "center") horizontalAlignment = "left: 50%; transform: translateX(-50%);";
+          style2 += vRelativeFrom === "margin" ? `position: absolute; top: ${topPos}px; ${horizontalAlignment}` : "";
+          const nextPos = view.posAtDOM(pageBreak, 1);
+          if (nextPos < 0) {
+            const $pos = view.state.doc.resolve(pos);
+            decorations.push(
+              Decoration.node(pos - 1, pos + $pos.parent.nodeSize - 1, {
+                style: `height: ${size2.height + parseInt(padding.top) + parseInt(padding.bottom)}px`
+              })
+            );
           }
-          const topPos = marginOffset.top !== void 0 ? marginOffset.top : pageBreak?.offsetTop + pageBreak?.offsetHeight;
-          style2 += vRelativeFrom === "margin" ? `position: absolute; top: ${topPos}px; ` : "";
-          if (vRelativeFrom === "margin") {
-            const nextPos = view.posAtDOM(pageBreak, 1);
-            if (nextPos < 0) {
-              const $pos = view.state.doc.resolve(pos);
-              decorations.push(
-                Decoration.node(pos - 1, pos + $pos.parent.nodeSize - 1, {
-                  style: `height: ${size2.height + parseInt(padding.top) + parseInt(padding.bottom)}px`
-                })
-              );
-            }
-            const imageBlock = document.createElement("div");
-            imageBlock.className = "anchor-image-placeholder";
-            imageBlock.style.float = alignH;
-            imageBlock.style.width = size2.width + parseInt(padding[alignH]) + "px";
-            imageBlock.style.height = size2.height + parseInt(padding.top) + parseInt(padding.bottom) + "px";
-            decorations.push(Decoration.widget(nextPos, imageBlock, { key: "stable-key" }));
+          const imageBlock = document.createElement("div");
+          imageBlock.className = "anchor-image-placeholder";
+          imageBlock.style.float = alignH === "left" || alignH === "right" ? alignH : "none";
+          let paddingHorizontal;
+          if (alignH === "center") {
+            paddingHorizontal = (parseInt(padding.left) || 0) + (parseInt(padding.right) || 0);
+          } else {
+            paddingHorizontal = parseInt(padding[alignH]) || 0;
           }
+          imageBlock.style.width = size2.width + paddingHorizontal + "px";
+          imageBlock.style.height = size2.height + parseInt(padding.top) + parseInt(padding.bottom) + "px";
+          decorations.push(Decoration.widget(nextPos, imageBlock, { key: "stable-key" }));
+          decorations.push(Decoration.inline(pos, pos + node.nodeSize, { style: style2, class: className }));
         }
-        decorations.push(Decoration.inline(pos, pos + node.nodeSize, { style: style2, class: className }));
       }
     });
     return decorations;
@@ -72649,6 +72593,58 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return null;
   };
+  const normalizeWrap = (attrs = {}) => {
+    const wrap2 = attrs.wrap;
+    if (wrap2?.type && wrap2.type !== "Inline") {
+      return {
+        type: wrap2.type,
+        attrs: wrap2.attrs ?? {}
+      };
+    }
+    if (wrap2?.type === "Inline" && Object.keys(wrap2.attrs ?? {}).length) {
+      return {
+        type: "Inline",
+        attrs: wrap2.attrs
+      };
+    }
+    if (!wrap2 && attrs.wrapText) {
+      return {
+        type: "Square",
+        attrs: {
+          wrapText: attrs.wrapText
+        }
+      };
+    }
+    if (!wrap2 && attrs.wrapTopAndBottom) {
+      return {
+        type: "TopAndBottom",
+        attrs: {}
+      };
+    }
+    if (wrap2?.type === "Inline") {
+      return {
+        type: "Inline",
+        attrs: wrap2.attrs ?? {}
+      };
+    }
+    return {
+      type: "Inline",
+      attrs: {}
+    };
+  };
+  const normalizeMarginOffset = (marginOffset = {}) => {
+    const { left: left2, horizontal, ...rest } = marginOffset;
+    return {
+      ...rest,
+      horizontal: horizontal ?? left2
+    };
+  };
+  const getNormalizedImageAttrs = (attrs = {}) => {
+    return {
+      wrap: normalizeWrap(attrs),
+      marginOffset: normalizeMarginOffset(attrs.marginOffset ?? {})
+    };
+  };
   const getRotationMargins = (w2, h2, angleDegrees) => {
     const rad = angleDegrees * (Math.PI / 180);
     const cos = Math.abs(Math.cos(rad));
@@ -72857,27 +72853,15 @@ Please report this to https://github.com/markedjs/marked.`, e) {
               style2 += "float: right;";
               floatRight = true;
             } else if (["largest", "bothSides"].includes(attrs.wrapText)) {
-              const pageStyles2 = this.editor?.converter?.pageStyles;
-              if (pageStyles2?.pageSize && pageStyles2?.pageMargins && size2.width) {
-                const pageWidth = inchesToPixels(pageStyles2.pageSize.width);
-                const leftMargin = inchesToPixels(pageStyles2.pageMargins.left);
-                const rightMargin = inchesToPixels(pageStyles2.pageMargins.right);
-                const contentWidth = pageWidth - leftMargin - rightMargin;
-                const imageWidth = size2.width + (attrs.distLeft || 0) + (attrs.distRight || 0);
-                const leftSpace = marginOffset.horizontal;
-                const rightSpace = contentWidth - leftSpace - imageWidth;
-                if (rightSpace < 0) {
-                  style2 += "float: left;";
-                } else if (rightSpace > leftSpace) {
-                  style2 += "float: left;";
-                } else {
-                  style2 += "float: right;";
-                  floatRight = true;
-                  baseHorizontal = rightSpace;
-                }
-              } else {
-                style2 += "float: left;";
-              }
+              const pageStylesData2 = getDataFromPageStyles({
+                editor: this.editor,
+                marginOffset,
+                size: size2,
+                attrs
+              });
+              style2 += pageStylesData2.style;
+              floatRight = pageStylesData2.floatRight;
+              baseHorizontal = pageStylesData2.baseHorizontal;
             }
             if (attrs.distTop) margin.top += attrs.distTop;
             if (attrs.distBottom) margin.bottom += attrs.distBottom;
@@ -72887,27 +72871,15 @@ Please report this to https://github.com/markedjs/marked.`, e) {
           case "Through":
           case "Tight":
             style2 += "clear: both;";
-            const pageStyles = this.editor?.converter?.pageStyles;
-            if (pageStyles?.pageSize && pageStyles?.pageMargins && size2.width) {
-              const pageWidth = inchesToPixels(pageStyles.pageSize.width);
-              const leftMargin = inchesToPixels(pageStyles.pageMargins.left);
-              const rightMargin = inchesToPixels(pageStyles.pageMargins.right);
-              const contentWidth = pageWidth - leftMargin - rightMargin;
-              const imageWidth = size2.width + (attrs.distLeft || 0) + (attrs.distRight || 0);
-              const leftSpace = marginOffset.horizontal;
-              const rightSpace = contentWidth - leftSpace - imageWidth;
-              if (rightSpace < 0) {
-                style2 += "float: left;";
-              } else if (rightSpace > leftSpace) {
-                style2 += "float: left;";
-              } else {
-                style2 += "float: right;";
-                floatRight = true;
-                baseHorizontal = rightSpace;
-              }
-            } else {
-              style2 += "float: left;";
-            }
+            const pageStylesData = getDataFromPageStyles({
+              editor: this.editor,
+              marginOffset,
+              size: size2,
+              attrs
+            });
+            style2 += pageStylesData.style;
+            floatRight = pageStylesData.floatRight;
+            baseHorizontal = pageStylesData.baseHorizontal;
             if (attrs.distTop) margin.top += attrs.distTop;
             if (attrs.distBottom) margin.bottom += attrs.distBottom;
             if (attrs.distLeft) margin.left += attrs.distLeft;
@@ -72944,6 +72916,22 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       }
       const hasAnchorData = Boolean(anchorData);
       const hasMarginOffsets = marginOffset?.horizontal != null || marginOffset?.top != null;
+      if (hasAnchorData) {
+        switch (anchorData.hRelativeFrom) {
+          case "page":
+            const pageStyles = this.editor?.converter?.pageStyles || this.editor?.options.parentEditor?.converter?.pageStyles;
+            margin.left -= inchesToPixels(pageStyles?.pageMargins?.left) || 0;
+            break;
+          case "margin":
+            if (anchorData.alignH === "center") {
+              style2 += "position: absolute; left: 50%; transform: translateX(-50%);";
+            }
+            if (anchorData.alignH === "left" || anchorData.alignH === "right") {
+              style2 += `position: absolute; ${anchorData.alignH}: 0;`;
+            }
+            break;
+        }
+      }
       if (hasAnchorData || hasMarginOffsets) {
         const relativeFromPageV = anchorData?.vRelativeFrom === "page";
         const maxMarginV = 500;
@@ -73092,6 +73080,37 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       return [ImageRegistrationPlugin({ editor: this.editor }), ImagePositionPlugin({ editor: this.editor })];
     }
   });
+  const getDataFromPageStyles = ({ editor, marginOffset, size: size2, attrs }) => {
+    let style2 = "";
+    let floatRight = false;
+    let baseHorizontal = marginOffset?.horizontal || 0;
+    const pageStyles = editor?.converter?.pageStyles || editor?.options.parentEditor?.converter?.pageStyles;
+    if (pageStyles?.pageSize && pageStyles?.pageMargins && size2.width) {
+      const pageWidth = inchesToPixels(pageStyles.pageSize.width);
+      const leftMargin = inchesToPixels(pageStyles.pageMargins.left);
+      const rightMargin = inchesToPixels(pageStyles.pageMargins.right);
+      const contentWidth = pageWidth - leftMargin - rightMargin;
+      const imageWidth = size2.width + (attrs.distLeft || 0) + (attrs.distRight || 0);
+      const leftSpace = marginOffset.horizontal;
+      const rightSpace = contentWidth - leftSpace - imageWidth;
+      if (rightSpace < 0) {
+        style2 += "float: left;";
+      } else if (rightSpace > leftSpace) {
+        style2 += "float: left;";
+      } else {
+        style2 += "float: right;";
+        floatRight = true;
+        baseHorizontal = rightSpace;
+      }
+    } else {
+      style2 += "float: left;";
+    }
+    return {
+      style: style2,
+      floatRight,
+      baseHorizontal
+    };
+  };
   const ACCEPT_IMAGE_TYPES = [".jpg", ".jpeg", ".png", "image/jpeg", "image/png"];
   const getFileOpener = () => {
     let fileInput = document.createElement("input");
@@ -80534,7 +80553,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
             return oldState;
           }
           if (typeof document === "undefined" || editor.options.isHeadless) return oldState;
-          if (editor.options.documentMode === "viewing" || !editor.isEditable) {
+          if (!editor.options.isHeaderOrFooter && (editor.options.documentMode === "viewing" || !editor.isEditable)) {
             return DecorationSet.empty;
           }
           const { selection } = newState;