@harbour-enterprises/superdoc 0.21.0-next.8 → 0.21.1

package/dist/superdoc.umd.js

@@ -32581,17 +32581,16 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   };
   const getDefaultParagraphStyle = (docx, styleId = "") => {
     const styles = docx["word/styles.xml"];
-    if (!styles) {
+    const rootElements = styles?.elements?.[0]?.elements;
+    if (!rootElements?.length) {
       return {};
     }
-    const defaults = styles.elements[0].elements?.find((el) => el.name === "w:docDefaults");
-    const pDefault = defaults.elements.find((el) => el.name === "w:pPrDefault");
+    const defaults = rootElements.find((el) => el.name === "w:docDefaults");
+    const pDefault = defaults?.elements?.find((el) => el.name === "w:pPrDefault") || {};
     const pPrDefault = pDefault?.elements?.find((el) => el.name === "w:pPr");
     const pPrDefaultSpacingTag = pPrDefault?.elements?.find((el) => el.name === "w:spacing") || {};
     const pPrDefaultIndentTag = pPrDefault?.elements?.find((el) => el.name === "w:ind") || {};
-    const stylesNormal = styles.elements[0].elements?.find(
-      (el) => el.name === "w:style" && el.attributes["w:styleId"] === "Normal"
-    );
+    const stylesNormal = rootElements.find((el) => el.name === "w:style" && el.attributes["w:styleId"] === "Normal");
     const pPrNormal = stylesNormal?.elements?.find((el) => el.name === "w:pPr");
     const pPrNormalSpacingTag = pPrNormal?.elements?.find((el) => el.name === "w:spacing") || {};
     const pPrNormalIndentTag = pPrNormal?.elements?.find((el) => el.name === "w:ind") || {};
@@ -32600,9 +32599,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     let pPrStyleIdIndentTag = {};
     let pPrStyleJc = {};
     if (styleId) {
-      const stylesById = styles.elements[0].elements?.find(
-        (el) => el.name === "w:style" && el.attributes["w:styleId"] === styleId
-      );
+      const stylesById = rootElements.find((el) => el.name === "w:style" && el.attributes["w:styleId"] === styleId);
       const pPrById = stylesById?.elements?.find((el) => el.name === "w:pPr");
       pPrStyleIdSpacingTag = pPrById?.elements?.find((el) => el.name === "w:spacing") || {};
       pPrStyleIdIndentTag = pPrById?.elements?.find((el) => el.name === "w:ind") || {};
@@ -34905,6 +34902,68 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     decode: decode$h
   };
   const translator$a = NodeTranslator.from(config$a);
+  const DEFAULT_PAGE_WIDTH_TWIPS = 12240;
+  const DEFAULT_PAGE_MARGIN_TWIPS = 1440;
+  const DEFAULT_CONTENT_WIDTH_TWIPS = DEFAULT_PAGE_WIDTH_TWIPS - 2 * DEFAULT_PAGE_MARGIN_TWIPS;
+  const MIN_COLUMN_WIDTH_TWIPS = pixelsToTwips(10);
+  const pctToPercent = (value) => {
+    if (value == null) return null;
+    return value / 50;
+  };
+  const resolveContentWidthTwips = () => DEFAULT_CONTENT_WIDTH_TWIPS;
+  const resolveMeasurementWidthPx = (measurement) => {
+    if (!measurement || typeof measurement.value !== "number" || measurement.value <= 0) return null;
+    const { value, type: type2 } = measurement;
+    if (!type2 || type2 === "auto") return null;
+    if (type2 === "dxa") return twipsToPixels(value);
+    if (type2 === "pct") {
+      const percent2 = pctToPercent(value);
+      if (percent2 == null || percent2 <= 0) return null;
+      const widthTwips = resolveContentWidthTwips() * percent2 / 100;
+      return twipsToPixels(widthTwips);
+    }
+    return null;
+  };
+  const countColumnsInRow = (row) => {
+    if (!row?.elements?.length) return 0;
+    return row.elements.reduce((count, element) => {
+      if (element.name !== "w:tc") return count;
+      const tcPr = element.elements?.find((el) => el.name === "w:tcPr");
+      const gridSpan = tcPr?.elements?.find((el) => el.name === "w:gridSpan");
+      const spanValue = parseInt(gridSpan?.attributes?.["w:val"] || "1", 10);
+      return count + (Number.isFinite(spanValue) && spanValue > 0 ? spanValue : 1);
+    }, 0);
+  };
+  const clampColumnWidthTwips = (value) => Math.max(Math.round(value), MIN_COLUMN_WIDTH_TWIPS);
+  const createFallbackGrid = (columnCount, columnWidthTwips) => Array.from({ length: columnCount }, () => ({ col: clampColumnWidthTwips(columnWidthTwips) }));
+  const buildFallbackGridForTable = ({ params: params2, rows, tableWidth, tableWidthMeasurement }) => {
+    const firstRow = rows.find((row) => row.elements?.some((el) => el.name === "w:tc"));
+    const columnCount = countColumnsInRow(firstRow);
+    if (!columnCount) return null;
+    const schemaDefaultPx = getSchemaDefaultColumnWidthPx(
+      /** @type {any} */
+      params2
+    );
+    const minimumColumnWidthPx = Number.isFinite(schemaDefaultPx) && schemaDefaultPx > 0 ? schemaDefaultPx : DEFAULT_COLUMN_WIDTH_PX;
+    let totalWidthPx;
+    if (tableWidthMeasurement) {
+      const resolved = resolveMeasurementWidthPx(tableWidthMeasurement);
+      if (resolved != null) totalWidthPx = resolved;
+    }
+    if (totalWidthPx == null && tableWidth?.width && tableWidth.width > 0) {
+      totalWidthPx = tableWidth.width;
+    }
+    if (totalWidthPx == null) {
+      totalWidthPx = minimumColumnWidthPx * columnCount;
+    }
+    const rawColumnWidthPx = Math.max(totalWidthPx / columnCount, minimumColumnWidthPx);
+    const columnWidthTwips = clampColumnWidthTwips(pixelsToTwips(rawColumnWidthPx));
+    const fallbackColumnWidthPx = twipsToPixels(columnWidthTwips);
+    return {
+      grid: createFallbackGrid(columnCount, columnWidthTwips),
+      columnWidths: Array(columnCount).fill(fallbackColumnWidthPx)
+    };
+  };
   const XML_NODE_NAME$9 = "w:tbl";
   const SD_NODE_NAME$9 = "table";
   const encode$g = (params2, encodedAttrs) => {
@@ -34924,7 +34983,6 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       "justification",
       "tableLayout",
       ["tableIndent", ({ value, type: type2 }) => ({ width: twipsToPixels(value), type: type2 })],
-      ["tableWidth", ({ value, type: type2 }) => ({ width: twipsToPixels(value), type: type2 })],
       ["tableCellSpacing", ({ value, type: type2 }) => ({ w: String(value), type: type2 })]
     ].forEach((prop) => {
       let key2;
@@ -34942,6 +35000,21 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     if (encodedAttrs.tableCellSpacing) {
       encodedAttrs["borderCollapse"] = "separate";
     }
+    if (encodedAttrs.tableProperties?.tableWidth) {
+      const tableWidthMeasurement = encodedAttrs.tableProperties.tableWidth;
+      const widthPx = twipsToPixels(tableWidthMeasurement.value);
+      if (widthPx != null) {
+        encodedAttrs.tableWidth = {
+          width: widthPx,
+          type: tableWidthMeasurement.type
+        };
+      } else if (tableWidthMeasurement.type === "auto") {
+        encodedAttrs.tableWidth = {
+          width: 0,
+          type: tableWidthMeasurement.type
+        };
+      }
+    }
     const { borders, rowBorders } = _processTableBorders(encodedAttrs.tableProperties?.borders || {});
     const referencedStyles = _getReferencedTableStyles(encodedAttrs.tableStyleId, params2);
     if (referencedStyles?.cellMargins && !encodedAttrs.tableProperties?.cellMargins) {
@@ -34955,7 +35028,19 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     const borderRowData = Object.assign({}, referencedStyles?.rowBorders || {}, rowBorders || {});
     encodedAttrs["borders"] = borderData;
     const tblStyleTag = tblPr?.elements?.find((el) => el.name === "w:tblStyle");
-    const columnWidths = (encodedAttrs["grid"] ?? []).map((item) => twipsToPixels(item.col));
+    let columnWidths = Array.isArray(encodedAttrs["grid"]) ? encodedAttrs["grid"].map((item) => twipsToPixels(item.col)) : [];
+    if (!columnWidths.length) {
+      const fallback = buildFallbackGridForTable({
+        params: params2,
+        rows,
+        tableWidth: encodedAttrs.tableWidth,
+        tableWidthMeasurement: encodedAttrs.tableProperties?.tableWidth
+      });
+      if (fallback) {
+        encodedAttrs.grid = fallback.grid;
+        columnWidths = fallback.columnWidths;
+      }
+    }
     const content = [];
     rows.forEach((row) => {
       const result = translator$G.encode({
@@ -38336,6 +38421,63 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     attributes: validXmlAttributes
   };
   const translator = NodeTranslator.from(config);
+  const DEFAULT_SECTION_PROPS_TWIPS = Object.freeze({
+    pageSize: Object.freeze({ width: "12240", height: "15840" }),
+    pageMargins: Object.freeze({
+      top: "1440",
+      right: "1440",
+      bottom: "1440",
+      left: "1440",
+      header: "720",
+      footer: "720",
+      gutter: "0"
+    })
+  });
+  const ensureSectionLayoutDefaults = (sectPr, converter) => {
+    if (!sectPr) {
+      return {
+        type: "element",
+        name: "w:sectPr",
+        elements: []
+      };
+    }
+    if (!sectPr.elements) sectPr.elements = [];
+    const ensureChild = (name) => {
+      let child = sectPr.elements.find((n) => n.name === name);
+      if (!child) {
+        child = {
+          type: "element",
+          name,
+          elements: [],
+          attributes: {}
+        };
+        sectPr.elements.push(child);
+      } else {
+        if (!child.elements) child.elements = [];
+        if (!child.attributes) child.attributes = {};
+      }
+      return child;
+    };
+    const pageSize = converter?.pageStyles?.pageSize;
+    const pgSz = ensureChild("w:pgSz");
+    if (pageSize?.width != null) pgSz.attributes["w:w"] = String(inchesToTwips(pageSize.width));
+    if (pageSize?.height != null) pgSz.attributes["w:h"] = String(inchesToTwips(pageSize.height));
+    if (pgSz.attributes["w:w"] == null) pgSz.attributes["w:w"] = DEFAULT_SECTION_PROPS_TWIPS.pageSize.width;
+    if (pgSz.attributes["w:h"] == null) pgSz.attributes["w:h"] = DEFAULT_SECTION_PROPS_TWIPS.pageSize.height;
+    const pageMargins = converter?.pageStyles?.pageMargins;
+    const pgMar = ensureChild("w:pgMar");
+    if (pageMargins) {
+      Object.entries(pageMargins).forEach(([key2, value]) => {
+        const converted = inchesToTwips(value);
+        if (converted != null) pgMar.attributes[`w:${key2}`] = String(converted);
+      });
+    }
+    Object.entries(DEFAULT_SECTION_PROPS_TWIPS.pageMargins).forEach(([key2, value]) => {
+      const attrKey = `w:${key2}`;
+      if (pgMar.attributes[attrKey] == null) pgMar.attributes[attrKey] = value;
+    });
+    return sectPr;
+  };
   const isLineBreakOnlyRun = (node) => {
     if (!node) return false;
     if (node.type === "lineBreak" || node.type === "hardBreak") return true;
@@ -38388,28 +38530,30 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     return handler2(params2);
   }
   function translateBodyNode(params2) {
-    let sectPr = params2.bodyNode?.elements.find((n) => n.name === "w:sectPr") || {};
+    let sectPr = params2.bodyNode?.elements?.find((n) => n.name === "w:sectPr");
+    if (!sectPr) {
+      sectPr = {
+        type: "element",
+        name: "w:sectPr",
+        elements: []
+      };
+    } else if (!sectPr.elements) {
+      sectPr = { ...sectPr, elements: [] };
+    }
+    sectPr = ensureSectionLayoutDefaults(sectPr, params2.converter);
     if (params2.converter) {
-      const hasHeader = sectPr?.elements?.some((n) => n.name === "w:headerReference");
+      const hasHeader = sectPr.elements?.some((n) => n.name === "w:headerReference");
       const hasDefaultHeader = params2.converter.headerIds?.default;
       if (!hasHeader && hasDefaultHeader && !params2.editor.options.isHeaderOrFooter) {
         const defaultHeader = generateDefaultHeaderFooter("header", params2.converter.headerIds?.default);
         sectPr.elements.push(defaultHeader);
       }
-      const hasFooter = sectPr?.elements?.some((n) => n.name === "w:footerReference");
+      const hasFooter = sectPr.elements?.some((n) => n.name === "w:footerReference");
       const hasDefaultFooter = params2.converter.footerIds?.default;
       if (!hasFooter && hasDefaultFooter && !params2.editor.options.isHeaderOrFooter) {
         const defaultFooter = generateDefaultHeaderFooter("footer", params2.converter.footerIds?.default);
         sectPr.elements.push(defaultFooter);
       }
-      const newMargins = params2.converter.pageStyles.pageMargins;
-      const sectPrMargins = sectPr.elements.find((n) => n.name === "w:pgMar");
-      const { attributes } = sectPrMargins;
-      Object.entries(newMargins).forEach(([key2, value]) => {
-        const convertedValue = inchesToTwips(value);
-        attributes[`w:${key2}`] = convertedValue;
-      });
-      sectPrMargins.attributes = attributes;
     }
     const elements = translateChildNodes(params2);
     if (params2.isHeaderFooter) {
@@ -40397,6 +40541,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     const nodeListHandler = defaultNodeListHandler();
     const bodyNode = json.elements[0].elements.find((el) => el.name === "w:body");
     if (bodyNode) {
+      ensureSectionProperties(bodyNode);
       const node = bodyNode;
       const contentElements = node.elements?.filter((n) => n.name !== "w:sectPr") ?? [];
       const content = pruneIgnoredNodes(contentElements);
@@ -40630,6 +40775,59 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     styles.alternateHeaders = isAlternatingHeadersOddEven(docx);
     return styles;
   }
+  const DEFAULT_SECTION_PROPS = Object.freeze({
+    pageSize: Object.freeze({ width: "12240", height: "15840" }),
+    pageMargins: Object.freeze({
+      top: "1440",
+      right: "1440",
+      bottom: "1440",
+      left: "1440",
+      header: "720",
+      footer: "720",
+      gutter: "0"
+    })
+  });
+  function ensureSectionProperties(bodyNode, converter) {
+    if (!bodyNode.elements) bodyNode.elements = [];
+    let sectPr = bodyNode.elements.find((el) => el.name === "w:sectPr");
+    if (!sectPr) {
+      sectPr = {
+        type: "element",
+        name: "w:sectPr",
+        elements: []
+      };
+      bodyNode.elements.push(sectPr);
+    } else if (!sectPr.elements) {
+      sectPr.elements = [];
+    }
+    const ensureChild = (name, factory) => {
+      let child = sectPr.elements.find((el) => el.name === name);
+      if (!child) {
+        child = factory();
+        sectPr.elements.push(child);
+      } else if (!child.attributes) {
+        child.attributes = {};
+      }
+      return child;
+    };
+    const pgSz = ensureChild("w:pgSz", () => ({
+      type: "element",
+      name: "w:pgSz",
+      attributes: {}
+    }));
+    pgSz.attributes["w:w"] = pgSz.attributes["w:w"] ?? DEFAULT_SECTION_PROPS.pageSize.width;
+    pgSz.attributes["w:h"] = pgSz.attributes["w:h"] ?? DEFAULT_SECTION_PROPS.pageSize.height;
+    const pgMar = ensureChild("w:pgMar", () => ({
+      type: "element",
+      name: "w:pgMar",
+      attributes: {}
+    }));
+    Object.entries(DEFAULT_SECTION_PROPS.pageMargins).forEach(([key2, value]) => {
+      const attrKey = `w:${key2}`;
+      if (pgMar.attributes[attrKey] == null) pgMar.attributes[attrKey] = value;
+    });
+    return sectPr;
+  }
   function getStyleDefinitions(docx) {
     const styles = docx["word/styles.xml"];
     if (!styles) return [];
@@ -40822,6 +41020,36 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     auto: "sans-serif"
   });
   const DEFAULT_GENERIC_FALLBACK = "sans-serif";
+  const DEFAULT_FONT_SIZE_PT = 10;
+  const collectRunDefaultProperties = (runProps, { allowOverrideTypeface = true, allowOverrideSize = true, themeResolver, state: state2 }) => {
+    if (!runProps?.elements?.length || !state2) return;
+    const fontsNode = runProps.elements.find((el) => el.name === "w:rFonts");
+    if (fontsNode?.attributes) {
+      const themeName = fontsNode.attributes["w:asciiTheme"];
+      if (themeName) {
+        const themeInfo = themeResolver?.(themeName) || {};
+        if ((allowOverrideTypeface || !state2.typeface) && themeInfo.typeface) state2.typeface = themeInfo.typeface;
+        if ((allowOverrideTypeface || !state2.panose) && themeInfo.panose) state2.panose = themeInfo.panose;
+      }
+      const ascii = fontsNode.attributes["w:ascii"];
+      if ((allowOverrideTypeface || !state2.typeface) && ascii) {
+        state2.typeface = ascii;
+      }
+    }
+    const sizeNode = runProps.elements.find((el) => el.name === "w:sz");
+    if (sizeNode?.attributes?.["w:val"]) {
+      const sizeTwips = Number(sizeNode.attributes["w:val"]);
+      if (Number.isFinite(sizeTwips)) {
+        if (state2.fallbackSzTwips === void 0) state2.fallbackSzTwips = sizeTwips;
+        const sizePt = sizeTwips / 2;
+        if (allowOverrideSize || state2.fontSizePt === void 0) state2.fontSizePt = sizePt;
+      }
+    }
+    const kernNode = runProps.elements.find((el) => el.name === "w:kern");
+    if (kernNode?.attributes?.["w:val"]) {
+      if (allowOverrideSize || state2.kern === void 0) state2.kern = kernNode.attributes["w:val"];
+    }
+  };
   const _SuperConverter = class _SuperConverter2 {
     constructor(params2 = null) {
       __privateAdd$2(this, _SuperConverter_instances);
@@ -40927,7 +41155,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         return;
       }
     }
-    static updateDocumentVersion(docx = this.convertedXml, version2 = "0.20.2") {
+    static updateDocumentVersion(docx = this.convertedXml, version2 = "0.21.1") {
       const customLocation = "docProps/custom.xml";
       if (!docx[customLocation]) {
         docx[customLocation] = generateCustomXml();
@@ -40949,49 +41177,45 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     getDocumentDefaultStyles() {
       const styles = this.convertedXml["word/styles.xml"];
-      if (!styles) return {};
-      const defaults = styles.elements[0].elements.find((el) => el.name === "w:docDefaults");
-      const rDefault = defaults.elements.find((el) => el.name === "w:rPrDefault");
-      if (!rDefault.elements) return {};
-      const rElements = rDefault.elements[0].elements;
-      const rFonts = rElements?.find((el) => el.name === "w:rFonts");
-      if ("elements" in rDefault) {
-        const fontThemeName = rElements.find((el) => el.name === "w:rFonts")?.attributes["w:asciiTheme"];
-        let typeface, panose, fontSizeNormal;
-        if (fontThemeName) {
-          const fontInfo = this.getThemeInfo(fontThemeName);
-          typeface = fontInfo.typeface;
-          panose = fontInfo.panose;
-        } else if (rFonts) {
-          typeface = rFonts?.attributes["w:ascii"];
-        }
-        const paragraphDefaults = styles.elements[0].elements.filter((el) => {
-          return el.name === "w:style" && el.attributes["w:styleId"] === "Normal";
-        }) || [];
-        paragraphDefaults.forEach((el) => {
-          const rPr = el.elements.find((el2) => el2.name === "w:rPr");
-          const fonts = rPr?.elements?.find((el2) => el2.name === "w:rFonts");
-          typeface = fonts?.attributes["w:ascii"];
-          fontSizeNormal = Number(rPr?.elements?.find((el2) => el2.name === "w:sz")?.attributes["w:val"]) / 2;
-        });
-        const rPrDefaults = defaults?.elements?.find((el) => el.name === "w:rPrDefault");
-        if (rPrDefaults) {
-          const rPr = rPrDefaults.elements?.find((el) => el.name === "w:rPr");
-          const fonts = rPr?.elements?.find((el) => el.name === "w:rFonts");
-          if (fonts?.attributes?.["w:ascii"]) {
-            typeface = fonts.attributes["w:ascii"];
-          }
-          const fontSizeRaw = rPr?.elements?.find((el) => el.name === "w:sz")?.attributes?.["w:val"];
-          if (!fontSizeNormal && fontSizeRaw) {
-            fontSizeNormal = Number(fontSizeRaw) / 2;
-          }
-        }
-        const fallbackSz = Number(rElements.find((el) => el.name === "w:sz")?.attributes?.["w:val"]);
-        const fontSizePt = fontSizeNormal ?? (Number.isFinite(fallbackSz) ? fallbackSz / 2 : void 0) ?? 10;
-        const kern = rElements.find((el) => el.name === "w:kern")?.attributes["w:val"];
-        const fontFamilyCss = _SuperConverter2.toCssFontFamily(typeface, this.convertedXml);
-        return { fontSizePt, kern, typeface, panose, fontFamilyCss };
-      }
+      const styleRoot = styles?.elements?.[0];
+      const styleElements = styleRoot?.elements || [];
+      if (!styleElements.length) return {};
+      const defaults = styleElements.find((el) => el.name === "w:docDefaults");
+      const normalStyle = styleElements.find((el) => el.name === "w:style" && el.attributes?.["w:styleId"] === "Normal");
+      const defaultsState = {
+        typeface: void 0,
+        panose: void 0,
+        fontSizePt: void 0,
+        kern: void 0,
+        fallbackSzTwips: void 0
+      };
+      const docDefaultRun = defaults?.elements?.find((el) => el.name === "w:rPrDefault");
+      const docDefaultProps = docDefaultRun?.elements?.find((el) => el.name === "w:rPr") ?? docDefaultRun;
+      collectRunDefaultProperties(docDefaultProps, {
+        allowOverrideTypeface: true,
+        allowOverrideSize: true,
+        themeResolver: (theme) => this.getThemeInfo(theme),
+        state: defaultsState
+      });
+      const normalRunProps = normalStyle?.elements?.find((el) => el.name === "w:rPr") ?? null;
+      collectRunDefaultProperties(normalRunProps, {
+        allowOverrideTypeface: true,
+        allowOverrideSize: true,
+        themeResolver: (theme) => this.getThemeInfo(theme),
+        state: defaultsState
+      });
+      if (defaultsState.fontSizePt === void 0) {
+        if (Number.isFinite(defaultsState.fallbackSzTwips)) defaultsState.fontSizePt = defaultsState.fallbackSzTwips / 2;
+        else defaultsState.fontSizePt = DEFAULT_FONT_SIZE_PT;
+      }
+      const fontFamilyCss = defaultsState.typeface ? _SuperConverter2.toCssFontFamily(defaultsState.typeface, this.convertedXml) : void 0;
+      const result = {};
+      if (defaultsState.fontSizePt !== void 0) result.fontSizePt = defaultsState.fontSizePt;
+      if (defaultsState.kern !== void 0) result.kern = defaultsState.kern;
+      if (defaultsState.typeface) result.typeface = defaultsState.typeface;
+      if (defaultsState.panose) result.panose = defaultsState.panose;
+      if (fontFamilyCss) result.fontFamilyCss = fontFamilyCss;
+      return result;
     }
     getDocumentFonts() {
       const fontTable = this.convertedXml["word/fontTable.xml"];
@@ -41420,7 +41644,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   function generateCustomXml() {
     return DEFAULT_CUSTOM_XML;
   }
-  function generateSuperdocVersion(pid = 2, version2 = "0.20.2") {
+  function generateSuperdocVersion(pid = 2, version2 = "0.21.1") {
     return {
       type: "element",
       name: "property",
@@ -43858,14 +44082,19 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     /**
      * Update [Content_Types].xml with extensions of new Image annotations
      */
-    async updateContentTypes(docx, media, fromJson) {
+    async updateContentTypes(docx, media, fromJson, updatedDocs = {}) {
+      const additionalPartNames = Object.keys(updatedDocs || {});
       const newMediaTypes = Object.keys(media).map((name) => {
         return this.getFileExtension(name);
       }).filter(Boolean);
       const contentTypesPath = "[Content_Types].xml";
       let contentTypesXml;
       if (fromJson) {
-        contentTypesXml = docx.files.find((file) => file.name === contentTypesPath)?.content || "";
+        if (Array.isArray(docx.files)) {
+          contentTypesXml = docx.files.find((file) => file.name === contentTypesPath)?.content || "";
+        } else {
+          contentTypesXml = docx.files?.[contentTypesPath] || "";
+        }
       } else contentTypesXml = await docx.file(contentTypesPath).async("string");
       let typesString = "";
       const defaultMediaTypes = getContentTypesFromXml(contentTypesXml);
@@ -43891,24 +44120,39 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       const hasCommentsExtensible = types2.elements?.some(
         (el) => el.name === "Override" && el.attributes.PartName === "/word/commentsExtensible.xml"
       );
-      if (docx.files["word/comments.xml"]) {
+      const hasFile = (filename) => {
+        if (!docx?.files) return false;
+        if (!fromJson) return Boolean(docx.files[filename]);
+        if (Array.isArray(docx.files)) return docx.files.some((file) => file.name === filename);
+        return Boolean(docx.files[filename]);
+      };
+      if (hasFile("word/comments.xml")) {
         const commentsDef = `<Override PartName="/word/comments.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.comments+xml" />`;
         if (!hasComments) typesString += commentsDef;
       }
-      if (docx.files["word/commentsExtended.xml"]) {
+      if (hasFile("word/commentsExtended.xml")) {
         const commentsExtendedDef = `<Override PartName="/word/commentsExtended.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.commentsExtended+xml" />`;
         if (!hasCommentsExtended) typesString += commentsExtendedDef;
       }
-      if (docx.files["word/commentsIds.xml"]) {
+      if (hasFile("word/commentsIds.xml")) {
         const commentsIdsDef = `<Override PartName="/word/commentsIds.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.commentsIds+xml" />`;
         if (!hasCommentsIds) typesString += commentsIdsDef;
       }
-      if (docx.files["word/commentsExtensible.xml"]) {
+      if (hasFile("word/commentsExtensible.xml")) {
         const commentsExtendedDef = `<Override PartName="/word/commentsExtensible.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.commentsExtensible+xml" />`;
         if (!hasCommentsExtensible) typesString += commentsExtendedDef;
       }
-      Object.keys(docx.files).forEach((name) => {
-        if (name.includes(".rels") || !name.includes("header") && !name.includes("footer")) return;
+      const partNames = new Set(additionalPartNames);
+      if (docx?.files) {
+        if (fromJson && Array.isArray(docx.files)) {
+          docx.files.forEach((file) => partNames.add(file.name));
+        } else {
+          Object.keys(docx.files).forEach((key2) => partNames.add(key2));
+        }
+      }
+      partNames.forEach((name) => {
+        if (name.includes(".rels")) return;
+        if (!name.includes("header") && !name.includes("footer")) return;
         const hasExtensible = types2.elements?.some(
           (el) => el.name === "Override" && el.attributes.PartName === `/${name}`
         );
@@ -43919,7 +44163,48 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         }
       });
       const beginningString = '<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">';
-      const updatedContentTypesXml = contentTypesXml.replace(beginningString, `${beginningString}${typesString}`);
+      let updatedContentTypesXml = contentTypesXml.replace(beginningString, `${beginningString}${typesString}`);
+      let relationshipsXml = updatedDocs["word/_rels/document.xml.rels"];
+      if (!relationshipsXml) {
+        if (fromJson) {
+          if (Array.isArray(docx.files)) {
+            relationshipsXml = docx.files.find((file) => file.name === "word/_rels/document.xml.rels")?.content;
+          } else {
+            relationshipsXml = docx.files?.["word/_rels/document.xml.rels"];
+          }
+        } else {
+          relationshipsXml = await docx.file("word/_rels/document.xml.rels")?.async("string");
+        }
+      }
+      if (relationshipsXml) {
+        try {
+          const relJson = xmljs.xml2js(relationshipsXml, { compact: false });
+          const relationships = relJson.elements?.find((el) => el.name === "Relationships");
+          relationships?.elements?.forEach((rel) => {
+            const type2 = rel.attributes?.Type;
+            const target = rel.attributes?.Target;
+            if (!type2 || !target) return;
+            const isHeader = type2.includes("/header");
+            const isFooter = type2.includes("/footer");
+            if (!isHeader && !isFooter) return;
+            let sanitizedTarget = target.replace(/^\.\//, "");
+            if (sanitizedTarget.startsWith("../")) sanitizedTarget = sanitizedTarget.slice(3);
+            if (sanitizedTarget.startsWith("/")) sanitizedTarget = sanitizedTarget.slice(1);
+            const partName = sanitizedTarget.startsWith("word/") ? sanitizedTarget : `word/${sanitizedTarget}`;
+            partNames.add(partName);
+          });
+        } catch (error) {
+          console.warn("Failed to parse document relationships while updating content types", error);
+        }
+      }
+      partNames.forEach((name) => {
+        if (name.includes(".rels")) return;
+        if (!name.includes("header") && !name.includes("footer")) return;
+        if (updatedContentTypesXml.includes(`PartName="/${name}"`)) return;
+        const type2 = name.includes("header") ? "header" : "footer";
+        const extendedDef = `<Override PartName="/${name}" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.${type2}+xml"/>`;
+        updatedContentTypesXml = updatedContentTypesXml.replace("</Types>", `${extendedDef}</Types>`);
+      });
       if (fromJson) return updatedContentTypesXml;
       docx.file(contentTypesPath, updatedContentTypesXml);
     }
@@ -43960,7 +44245,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       for (const [fontName, fontUintArray] of Object.entries(fonts)) {
         zip.file(fontName, fontUintArray);
       }
-      await this.updateContentTypes(zip, media);
+      await this.updateContentTypes(zip, media, false, updatedDocs);
       return zip;
     }
     /**
@@ -43986,7 +44271,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       Object.keys(media).forEach((path) => {
         unzippedOriginalDocx.file(path, media[path]);
       });
-      await this.updateContentTypes(unzippedOriginalDocx, media);
+      await this.updateContentTypes(unzippedOriginalDocx, media, false, updatedDocs);
       return unzippedOriginalDocx;
     }
   }
@@ -55644,9 +55929,11 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       item.editor.view.dom.setAttribute("documentmode", documentMode);
     });
     if (isEditMode) {
-      const pm = document.querySelector(".ProseMirror");
-      pm.classList.add("header-footer-edit");
-      pm.setAttribute("aria-readonly", true);
+      const pm = editor.view?.dom || editor.options.element?.querySelector?.(".ProseMirror");
+      if (pm) {
+        pm.classList.add("header-footer-edit");
+        pm.setAttribute("aria-readonly", true);
+      }
     }
     if (focusedSectionEditor) {
       focusedSectionEditor.view.focus();
@@ -56676,6 +56963,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       const mappedRowStart = tr.mapping.map(absoluteRowStart);
       const rowEnd = mappedRowStart + rowNode.nodeSize;
       tr.replaceWith(mappedRowStart, rowEnd, Fragment.from(newRows));
+      tr.setMeta("tableGeneration", true);
     } catch (error) {
       console.error("Error during row generation:", error);
       throw error;
@@ -57080,7 +57368,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   }
   function findRemovedFieldAnnotations(tr) {
     let removedNodes = [];
-    if (!tr.steps.length || tr.meta && !Object.keys(tr.meta).every((meta) => ["inputType", "uiEvent", "paste"].includes(meta)) || ["historyUndo", "historyRedo"].includes(tr.getMeta("inputType")) || ["drop"].includes(tr.getMeta("uiEvent")) || tr.getMeta("fieldAnnotationUpdate") === true) {
+    if (!tr.steps.length || tr.meta && !Object.keys(tr.meta).every((meta) => ["inputType", "uiEvent", "paste"].includes(meta)) || ["historyUndo", "historyRedo"].includes(tr.getMeta("inputType")) || ["drop"].includes(tr.getMeta("uiEvent")) || tr.getMeta("fieldAnnotationUpdate") === true || tr.getMeta("tableGeneration") === true) {
       return removedNodes;
     }
     const hasDeletion = transactionDeletedAnything(tr);
@@ -58258,7 +58546,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     setDocumentMode(documentMode) {
       let cleanedMode = documentMode?.toLowerCase() || "editing";
       if (!this.extensionService || !this.state) return;
-      const pm = document.querySelector(".ProseMirror");
+      const pm = this.view?.dom || this.options.element?.querySelector?.(".ProseMirror");
       if (this.options.role === "viewer") cleanedMode = "viewing";
       if (this.options.role === "suggester" && cleanedMode === "editing") cleanedMode = "suggesting";
       if (cleanedMode === "viewing") {
@@ -58746,7 +59034,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
               files: this.options.content
             },
             media,
-            true
+            true,
+            updatedDocs
           );
           return updatedDocs;
         }
@@ -58812,7 +59101,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
      * @returns {Object | void} Migration results
      */
     processCollaborationMigrations() {
-      console.debug("[checkVersionMigrations] Current editor version", "0.20.2");
+      console.debug("[checkVersionMigrations] Current editor version", "0.21.1");
       if (!this.options.ydoc) return;
       const metaMap = this.options.ydoc.getMap("meta");
       let docVersion = metaMap.get("version");
@@ -59232,9 +59521,11 @@ Please report this to https://github.com/markedjs/marked.`, e) {
             isEditMode: false,
             documentMode: this.options.documentMode
           });
-          const pm = document.querySelector(".ProseMirror");
-          pm.classList.remove("header-footer-edit");
-          pm.setAttribute("aria-readonly", false);
+          const pm = this.view?.dom || this.options.element?.querySelector?.(".ProseMirror");
+          if (pm) {
+            pm.classList.remove("header-footer-edit");
+            pm.setAttribute("aria-readonly", false);
+          }
         }
         setWordSelection(view, pos);
       }
@@ -61289,15 +61580,31 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return result;
   };
-  const CustomSelectionPluginKey = new PluginKey("CustomSelection");
-  const shouldAllowNativeContextMenu = (event) => {
+  const isKeyboardInvocation = (event) => {
+    return event.type === "contextmenu" && typeof event.detail === "number" && event.detail === 0 && (event.button === 0 || event.button === void 0) && event.clientX === 0 && event.clientY === 0;
+  };
+  const prefersNativeMenu = (event) => {
     if (!event) return false;
     if (event.ctrlKey || event.metaKey) {
       return true;
     }
-    const isKeyboardInvocation = event.type === "contextmenu" && typeof event.detail === "number" && event.detail === 0 && (event.button === 0 || event.button === void 0) && event.clientX === 0 && event.clientY === 0;
-    return Boolean(isKeyboardInvocation);
+    return isKeyboardInvocation(event);
   };
+  const shouldAllowNativeContextMenu = (event) => {
+    return prefersNativeMenu(event);
+  };
+  const shouldBypassContextMenu = shouldAllowNativeContextMenu;
+  const DEFAULT_SELECTION_STATE = Object.freeze({
+    focused: false,
+    preservedSelection: null,
+    showVisualSelection: false,
+    skipFocusReset: false
+  });
+  const normalizeSelectionState = (state2 = {}) => ({
+    ...DEFAULT_SELECTION_STATE,
+    ...state2
+  });
+  const CustomSelectionPluginKey = new PluginKey("CustomSelection");
   const handleClickOutside = (event, editor) => {
     const editorElem = editor?.options?.element;
     if (!editorElem) return;
@@ -61334,11 +61641,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       const customSelectionPlugin = new Plugin({
         key: CustomSelectionPluginKey,
         state: {
-          init: () => ({
-            focused: false,
-            preservedSelection: null,
-            showVisualSelection: false
-          }),
+          init: () => ({ ...DEFAULT_SELECTION_STATE }),
           apply: (tr, value) => {
             const meta = getFocusMeta(tr);
             if (meta !== void 0) {
@@ -61369,7 +61672,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                   setFocusMeta(view.state.tr, {
                     focused: true,
                     preservedSelection: selection,
-                    showVisualSelection: true
+                    showVisualSelection: true,
+                    skipFocusReset: true
                   })
                 );
               }
@@ -61390,7 +61694,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                     setFocusMeta(view.state.tr, {
                       focused: true,
                       preservedSelection: selection2,
-                      showVisualSelection: true
+                      showVisualSelection: true,
+                      skipFocusReset: true
                     })
                   );
                   this.editor.setOptions({
@@ -61413,7 +61718,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                   setFocusMeta(view.state.tr, {
                     focused: true,
                     preservedSelection: selection,
-                    showVisualSelection: true
+                    showVisualSelection: true,
+                    skipFocusReset: false
                   })
                 );
                 this.editor.setOptions({
@@ -61431,7 +61737,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                     setFocusMeta(view.state.tr, {
                       focused: true,
                       preservedSelection: selection,
-                      showVisualSelection: true
+                      showVisualSelection: true,
+                      skipFocusReset: false
                     })
                   );
                 }
@@ -61442,7 +61749,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                   setFocusMeta(view.state.tr, {
                     focused: false,
                     preservedSelection: null,
-                    showVisualSelection: false
+                    showVisualSelection: false,
+                    skipFocusReset: false
                   })
                 );
                 if (!selection.empty && !this.editor.options.element?.contains(target)) {
@@ -61459,12 +61767,20 @@ Please report this to https://github.com/markedjs/marked.`, e) {
               const isElement2 = target instanceof Element;
               const isToolbarBtn = isElement2 && isToolbarButton(target);
               const isToolbarInp = isElement2 && isToolbarInput(target);
+              const focusState = getFocusState(view.state);
+              if (focusState?.skipFocusReset) {
+                view.dispatch(
+                  setFocusMeta(view.state.tr, normalizeSelectionState({ ...focusState, skipFocusReset: false }))
+                );
+                return false;
+              }
               if (!isToolbarBtn && !isToolbarInp) {
                 view.dispatch(
                   setFocusMeta(view.state.tr, {
                     focused: false,
                     preservedSelection: null,
-                    showVisualSelection: false
+                    showVisualSelection: false,
+                    skipFocusReset: false
                   })
                 );
               }
@@ -61475,12 +61791,16 @@ Please report this to https://github.com/markedjs/marked.`, e) {
               const isToolbarBtn = isElement2 && isToolbarButton(target);
               const isToolbarInp = isElement2 && isToolbarInput(target);
               const state2 = getFocusState(view.state);
+              if (state2?.skipFocusReset) {
+                return false;
+              }
               if (isToolbarBtn || isToolbarInp) {
                 view.dispatch(
                   setFocusMeta(view.state.tr, {
                     focused: true,
                     preservedSelection: state2.preservedSelection || view.state.selection,
-                    showVisualSelection: true
+                    showVisualSelection: true,
+                    skipFocusReset: false
                   })
                 );
               } else {
@@ -61488,7 +61808,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
                   setFocusMeta(view.state.tr, {
                     focused: false,
                     preservedSelection: null,
-                    showVisualSelection: false
+                    showVisualSelection: false,
+                    skipFocusReset: false
                   })
                 );
               }
@@ -77263,7 +77584,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
             const prevSelection = prevState.selection;
             if (selection.from !== prevSelection.from || selection.to !== prevSelection.to) {
               setTimeout(() => {
-                const selectedResizableWrapper = document.querySelector(".sd-editor-resizable-wrapper");
+                const searchRoot = editorView?.dom;
+                const selectedResizableWrapper = searchRoot?.querySelector(".sd-editor-resizable-wrapper");
                 if (selectedResizableWrapper) {
                   showResizeHandles(view2, selectedResizableWrapper);
                 } else {
@@ -90799,7 +91121,7 @@ ${style2}
           if (!argument) return;
           item.onActivate({ zoom: argument });
           this.emit("superdoc-command", { item, argument });
-          const layers = document.querySelector(this.superdoc.config.selector)?.querySelector(".layers");
+          const layers = this.superdoc.element?.querySelector(".layers");
           if (!layers) return;
           const isMobileDevice = typeof screen.orientation !== "undefined";
           const isSmallScreen = window.matchMedia("(max-width: 834px)").matches;
@@ -91861,14 +92183,6 @@ ${style2}
       return null;
     }
   }
-  const shouldBypassContextMenu = (event) => {
-    if (!event) return false;
-    if (event.ctrlKey || event.metaKey) {
-      return true;
-    }
-    const isKeyboardInvocation = event.type === "contextmenu" && typeof event.detail === "number" && event.detail === 0 && (event.button === 0 || event.button === void 0) && event.clientX === 0 && event.clientY === 0;
-    return Boolean(isKeyboardInvocation);
-  };
   const isModuleEnabled = (editorOptions, moduleName) => {
     switch (moduleName) {
       case "ai":
@@ -110461,7 +110775,7 @@ ${style2}
       this.config.colors = shuffleArray(this.config.colors);
       this.userColorMap = /* @__PURE__ */ new Map();
       this.colorIndex = 0;
-      this.version = "0.20.2";
+      this.version = "0.21.1";
       this.#log("🦋 [superdoc] Using SuperDoc version:", this.version);
       this.superdocId = config2.superdocId || v4();
       this.colors = this.config.colors;
@@ -110476,6 +110790,9 @@ ${style2}
       this.isDev = this.config.isDev || false;
       this.activeEditor = null;
       this.comments = [];
+      if (!this.config.selector) {
+        throw new Error("SuperDoc: selector is required");
+      }
       this.app.mount(this.config.selector);
       this.readyEditors = 0;
       this.isLocked = this.config.isLocked || false;
@@ -110495,6 +110812,16 @@ ${style2}
         users: this.users
       };
     }
+    /**
+     * Get the SuperDoc container element
+     * @returns {HTMLElement | null}
+     */
+    get element() {
+      if (typeof this.config.selector === "string") {
+        return document.querySelector(this.config.selector);
+      }
+      return this.config.selector;
+    }
     #patchNaiveUIStyles() {
       const cspNonce = this.config.cspNonce;
       const originalCreateElement = document.createElement;
@@ -110518,10 +110845,16 @@ ${style2}
       }
       if (hasDocumentConfig) {
         const normalized = normalizeDocumentEntry(this.config.document);
-        this.config.documents = [normalized];
+        this.config.documents = [
+          {
+            id: v4(),
+            ...normalized
+          }
+        ];
       } else if (hasDocumentUrl) {
         this.config.documents = [
           {
+            id: v4(),
             type: DOCX,
             url: this.config.document,
             name: "document.docx",
@@ -110529,33 +110862,34 @@ ${style2}
           }
         ];
       } else if (hasDocumentFile) {
+        const normalized = normalizeDocumentEntry(this.config.document);
         this.config.documents = [
           {
-            type: this.config.document.type,
-            data: this.config.document,
-            name: this.config.document.name,
-            isNewFile: true
+            id: v4(),
+            ...normalized
           }
         ];
       } else if (hasDocumentBlob) {
-        const docType = this.config.document.type || DOCX;
-        let extension = ".docx";
-        if (docType === PDF) {
-          extension = ".pdf";
-        } else if (docType === HTML) {
-          extension = ".html";
-        }
+        const normalized = normalizeDocumentEntry(this.config.document);
         this.config.documents = [
           {
-            type: docType,
-            data: this.config.document,
-            name: `document${extension}`,
-            isNewFile: true
+            id: v4(),
+            ...normalized
           }
         ];
       }
       if (Array.isArray(this.config.documents) && this.config.documents.length > 0) {
-        this.config.documents = this.config.documents.map((d2) => normalizeDocumentEntry(d2));
+        this.config.documents = this.config.documents.map((d2) => {
+          const normalized = normalizeDocumentEntry(d2);
+          if (!normalized || typeof normalized !== "object") {
+            return normalized;
+          }
+          const existingId = typeof normalized === "object" && "id" in normalized && normalized.id || d2 && typeof d2 === "object" && "id" in d2 && d2.id;
+          return {
+            ...normalized,
+            id: existingId || v4()
+          };
+        });
       }
     }
     #initVueApp() {