@extend-ai/react-docx 0.6.1 → 0.6.3

package/dist/index.cjs

@@ -3978,10 +3978,14 @@ function parseParagraphRuns(paragraphXml2, context) {
       }
     }
   });
+  let hyperlinkRangeCursor = 0;
   return runRanges.map((range, runIndex) => {
-    const link = hyperlinkRanges.find(
-      (hyperlinkRange) => range.start >= hyperlinkRange.start && range.end <= hyperlinkRange.end && hyperlinkRange.href
-    )?.href ?? fieldLinksByRun.get(runIndex);
+    while (hyperlinkRangeCursor < hyperlinkRanges.length && hyperlinkRanges[hyperlinkRangeCursor].end <= range.start) {
+      hyperlinkRangeCursor += 1;
+    }
+    const currentHyperlinkRange = hyperlinkRanges[hyperlinkRangeCursor];
+    const hyperlinkHref = currentHyperlinkRange && range.start >= currentHyperlinkRange.start && range.end <= currentHyperlinkRange.end ? currentHyperlinkRange.href : void 0;
+    const link = hyperlinkHref ?? fieldLinksByRun.get(runIndex);
     return {
       xml: paragraphXml2.slice(range.start, range.end),
       start: range.start,
@@ -4577,9 +4581,14 @@ function parseParagraph(paragraphXml2, context) {
     runs
   );
   const contentTokens = [];
+  let formFieldTokenCursor = 0;
   for (const run of runs) {
-    const insideFormField = formFieldTokens.some(
-      (formFieldToken) => run.start >= formFieldToken.start && run.end <= formFieldToken.end
+    while (formFieldTokenCursor < formFieldTokens.length && formFieldTokens[formFieldTokenCursor].end <= run.start) {
+      formFieldTokenCursor += 1;
+    }
+    const currentFormFieldToken = formFieldTokens[formFieldTokenCursor];
+    const insideFormField = Boolean(
+      currentFormFieldToken && run.start >= currentFormFieldToken.start && run.end <= currentFormFieldToken.end
     );
     if (insideFormField) {
       continue;
@@ -8994,6 +9003,9 @@ function paragraphHasExplicitPageBreak(paragraph) {
   return sourceXml.length > 0 && PAGE_BREAK_XML_PATTERN.test(sourceXml);
 }
 function paragraphHasPageBreakBefore(paragraph) {
+  if (paragraph.style?.pageBreakBefore === true) {
+    return true;
+  }
   const sourceXml = paragraph.sourceXml ?? "";
   if (!sourceXml) {
     return false;
@@ -10379,6 +10391,8 @@ var LARGE_TABLE_PAGE_VIRTUALIZATION_OVERSCAN = 0;
 var LARGE_TABLE_PAGE_ADJACENT_RENDER_COUNT = 1;
 var DEFAULT_PAGE_VIRTUALIZATION_SETTLE_DELAY_MS = 350;
 var ENABLE_TABLE_ROW_SLICING = true;
+var MIN_TABLE_ROW_SLICE_REMAINING_HEIGHT_PX = MIN_PARAGRAPH_LINE_HEIGHT_PX * 2;
+var TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX = 2;
 var TOP_AND_BOTTOM_VERTICAL_DRAG_SNAP_PX = 10;
 var HEADER_FOOTER_INACTIVE_OPACITY = 0.5;
 var LETTERHEAD_INDENT_MIN_TWIPS = 900;
@@ -10414,6 +10428,10 @@ var paragraphDropCapBySourceXml = /* @__PURE__ */ new Map();
 var paragraphTrackedMarkupBySourceXml = /* @__PURE__ */ new Map();
 var paragraphMeasureCanvasContext;
 var textWidthByFontAndValue = /* @__PURE__ */ new Map();
+var estimatedTextAdvanceWidthByFontAndValue = /* @__PURE__ */ new Map();
+var pretextWordBreakModeByText = /* @__PURE__ */ new Map();
+var paragraphBaseFontSizePxByParagraph = /* @__PURE__ */ new WeakMap();
+var paragraphDominantFontFamilyByParagraph = /* @__PURE__ */ new WeakMap();
 function setCacheEntry(cache, key, value) {
   if (!cache.has(key) && cache.size >= XML_CACHE_MAX_ENTRIES) {
     const oldestKey = cache.keys().next().value;
@@ -11877,7 +11895,23 @@ function resolvePageContentHeightPxForPageSegments(pageSegments, pageIndex, defa
   );
 }
 function resolveRenderPageContentHeightPxForPageSegments(params) {
-  const resolvedHeightPx = resolvePageContentHeightPxForPageSegments(
+  const firstNodeIndex = params.pageSegments[0]?.nodeIndex ?? 0;
+  const metricsIndex = resolvePaginationSectionMetricsIndexForNodeIndex(
+    params.metricsBySection,
+    firstNodeIndex,
+    0
+  );
+  const sectionHeightMultiplier = Math.max(
+    1,
+    Math.round(
+      params.metricsBySection[metricsIndex]?.pageContentHeightMultiplier ?? 1
+    )
+  );
+  const pageContainsOnlySplitParagraphSegments = documentPageContainsOnlySplitParagraphSegments(params.pageSegments);
+  const measuredHeightPx = params.useMeasuredPageContentHeights === false ? void 0 : params.measuredPageContentHeightsPxByPageIndex?.[params.pageIndex];
+  const measuredHeightMatchesCurrentPage = params.pageIdentityKey === void 0 || params.measuredPageContentIdentityKeysByPageIndex?.[params.pageIndex] === void 0 || params.measuredPageContentIdentityKeysByPageIndex?.[params.pageIndex] === params.pageIdentityKey;
+  const usesMeasuredVisualHeight = Number.isFinite(measuredHeightPx) && measuredHeightMatchesCurrentPage && !pageContainsOnlySplitParagraphSegments;
+  let resolvedHeightPx = resolvePageContentHeightPxForPageSegments(
     params.pageSegments,
     params.pageIndex,
     params.defaultPageContentHeightPx,
@@ -11887,12 +11921,15 @@ function resolveRenderPageContentHeightPxForPageSegments(params) {
     params.pageIdentityKey
   );
   if (params.useMeasuredPageContentHeights === false && Number.isFinite(params.pageContentHeightScale) && Math.abs(params.pageContentHeightScale - 1) >= 1e-3) {
-    return Math.max(
+    resolvedHeightPx = Math.max(
       120,
       Math.round(resolvedHeightPx * params.pageContentHeightScale)
     );
   }
-  return resolvedHeightPx;
+  if (usesMeasuredVisualHeight || sectionHeightMultiplier <= 1) {
+    return resolvedHeightPx;
+  }
+  return Math.max(120, Math.round(resolvedHeightPx / sectionHeightMultiplier));
 }
 function documentPageContainsOnlySplitParagraphSegments(pageSegments) {
   return pageSegments.length > 0 && pageSegments.every(
@@ -12251,76 +12288,7 @@ var defaultStarterModel = {
   nodes: [
     {
       type: "paragraph",
-      style: { headingLevel: 1, styleId: "Heading1", styleName: "Heading 1" },
-      children: [
-        { type: "text", text: "React DOCX WYSIWYG", style: { bold: true } }
-      ]
-    },
-    {
-      type: "paragraph",
-      children: [
-        {
-          type: "text",
-          text: "Import a .docx, edit styles from the toolbar, and export.",
-          style: { highlight: "yellow" }
-        }
-      ]
-    },
-    {
-      type: "table",
-      style: {
-        borders: createDefaultEditorTableBorders()
-      },
-      rows: [
-        {
-          type: "table-row",
-          cells: [
-            {
-              type: "table-cell",
-              style: { backgroundColor: "#eef2ff" },
-              nodes: [
-                {
-                  type: "paragraph",
-                  children: [{ type: "text", text: "Header A" }]
-                }
-              ]
-            },
-            {
-              type: "table-cell",
-              style: { backgroundColor: "#eef2ff" },
-              nodes: [
-                {
-                  type: "paragraph",
-                  children: [{ type: "text", text: "Header B" }]
-                }
-              ]
-            }
-          ]
-        },
-        {
-          type: "table-row",
-          cells: [
-            {
-              type: "table-cell",
-              nodes: [
-                {
-                  type: "paragraph",
-                  children: [{ type: "text", text: "Row 1" }]
-                }
-              ]
-            },
-            {
-              type: "table-cell",
-              nodes: [
-                {
-                  type: "paragraph",
-                  children: [{ type: "text", text: "Value" }]
-                }
-              ]
-            }
-          ]
-        }
-      ]
+      children: [{ type: "text", text: "" }]
     }
   ],
   metadata: {
@@ -12403,6 +12371,9 @@ var defaultStarterModel = {
     defaultParagraphStyleId: "Normal"
   }
 };
+function createBlankDocumentModel() {
+  return cloneDocModel(defaultStarterModel);
+}
 function textRuns2(paragraph) {
   return paragraph.children.filter(
     (child) => child.type === "text"
@@ -12446,7 +12417,9 @@ function firstExplicitFontFamilyInNodeTree(nodes) {
     if (node.type === "table") {
       for (const row of node.rows) {
         for (const cell of row.cells) {
-          const nestedFontFamily = firstExplicitFontFamilyInNodeTree(cell.nodes);
+          const nestedFontFamily = firstExplicitFontFamilyInNodeTree(
+            cell.nodes
+          );
           if (nestedFontFamily) {
             return nestedFontFamily;
           }
@@ -13352,11 +13325,19 @@ function buildParagraphPretextTabSpacerText(widthPx, style, paragraphBaseFontPx)
   while (measuredWidthPx + spacerAdvancePx * 0.5 < safeWidthPx && spacerCount < 64) {
     spacerCount += 1;
     spacerText = spacerCharacter.repeat(spacerCount);
-    measuredWidthPx = measureTextWidthPx2(spacerText, style, paragraphBaseFontPx);
+    measuredWidthPx = measureTextWidthPx2(
+      spacerText,
+      style,
+      paragraphBaseFontPx
+    );
   }
   while (spacerCount > 1) {
     const nextText = spacerCharacter.repeat(spacerCount - 1);
-    const nextWidthPx = measureTextWidthPx2(nextText, style, paragraphBaseFontPx);
+    const nextWidthPx = measureTextWidthPx2(
+      nextText,
+      style,
+      paragraphBaseFontPx
+    );
     if (Math.abs(nextWidthPx - safeWidthPx) >= Math.abs(measuredWidthPx - safeWidthPx)) {
       break;
     }
@@ -13647,7 +13628,20 @@ function buildSyntheticPretextLayoutSource(text, style) {
   };
 }
 function pretextWordBreakModeForText(text) {
-  return KEEP_ALL_SCRIPT_RE.test(text) ? "keep-all" : "normal";
+  const cached = pretextWordBreakModeByText.get(text);
+  if (cached) {
+    return cached;
+  }
+  const mode = KEEP_ALL_SCRIPT_RE.test(text) ? "keep-all" : "normal";
+  setCacheEntry(pretextWordBreakModeByText, text, mode);
+  while (pretextWordBreakModeByText.size > TEXT_MEASURE_CACHE_MAX_ENTRIES) {
+    const firstKey = pretextWordBreakModeByText.keys().next().value;
+    if (!firstKey) {
+      break;
+    }
+    pretextWordBreakModeByText.delete(firstKey);
+  }
+  return mode;
 }
 function sanitizeRenderedPretextFragmentText(text) {
   return text.replace(/\r\n?|\n/g, "");
@@ -14131,36 +14125,55 @@ function estimateTextAdvanceWidthPx(text, style) {
   if (!text) {
     return 0;
   }
-  const normalized = text.replace(/\u00a0/g, " ");
   const fontSizePx = runFontSizePx(style);
+  const normalized = text.includes("\xA0") ? text.replace(/\u00a0/g, " ") : text;
+  const cacheKey = `${fontSizePx}\0${normalized}`;
+  const cached = estimatedTextAdvanceWidthByFontAndValue.get(cacheKey);
+  if (cached !== void 0) {
+    return cached;
+  }
   let total = 0;
-  for (const char of normalized) {
-    if (char === "\n" || char === "\r") {
+  for (let index = 0; index < normalized.length; index += 1) {
+    const code = normalized.charCodeAt(index);
+    if (code === 10 || code === 13) {
       continue;
     }
-    if (char === "	") {
+    if (code === 9) {
       total += fontSizePx * 2;
       continue;
     }
-    if (char === " ") {
+    if (code === 32) {
       total += fontSizePx * 0.33;
       continue;
     }
-    if (/[.,:;'"`!|ilI1]/.test(char)) {
+    if (code === 33 || code === 39 || code === 44 || code === 46 || code === 49 || code === 58 || code === 59 || code === 73 || code === 96 || code === 105 || code === 108 || code === 124) {
       total += fontSizePx * 0.29;
       continue;
     }
-    if (/[A-Z0-9]/.test(char)) {
+    if (code >= 65 && code <= 90 || code >= 48 && code <= 57) {
       total += fontSizePx * 0.6;
       continue;
     }
-    if (/[\u3000-\u9fff]/.test(char)) {
+    if (code >= 12288 && code <= 40959) {
       total += fontSizePx * 0.95;
       continue;
     }
     total += fontSizePx * 0.54;
   }
-  return Math.max(0, Math.round(total));
+  const estimatedWidthPx = Math.max(0, Math.round(total));
+  setCacheEntry(
+    estimatedTextAdvanceWidthByFontAndValue,
+    cacheKey,
+    estimatedWidthPx
+  );
+  while (estimatedTextAdvanceWidthByFontAndValue.size > TEXT_MEASURE_CACHE_MAX_ENTRIES) {
+    const firstKey = estimatedTextAdvanceWidthByFontAndValue.keys().next().value;
+    if (!firstKey) {
+      break;
+    }
+    estimatedTextAdvanceWidthByFontAndValue.delete(firstKey);
+  }
+  return estimatedWidthPx;
 }
 function updateEstimatedLineWidthPxForText(currentLineWidthPx, text, style) {
   if (!text) {
@@ -14466,7 +14479,8 @@ function paragraphHasLastRenderedPageBreak(paragraph) {
   if (cached) {
     return cached.lastRenderedPageBreak;
   }
-  return paragraphHasExplicitPageBreak2(paragraph) ? paragraphBreakFlagsBySourceXml.get(xml)?.lastRenderedPageBreak ?? false : false;
+  paragraphHasExplicitPageBreak2(paragraph);
+  return paragraphBreakFlagsBySourceXml.get(xml)?.lastRenderedPageBreak ?? false;
 }
 function paragraphStartsWithLastRenderedPageBreak(paragraph) {
   const xml = paragraph.sourceXml ?? "";
@@ -14640,7 +14654,8 @@ function paragraphHasPageBreakBefore2(paragraph) {
   if (cached) {
     return cached.pageBreakBefore;
   }
-  return paragraphHasExplicitPageBreak2(paragraph) ? paragraphBreakFlagsBySourceXml.get(xml)?.pageBreakBefore ?? false : false;
+  paragraphHasExplicitPageBreak2(paragraph);
+  return paragraphBreakFlagsBySourceXml.get(xml)?.pageBreakBefore ?? false;
 }
 function sectionBreakAfterParagraphStartsNewPage(paragraph) {
   const xml = paragraph.sourceXml ?? "";
@@ -14820,9 +14835,15 @@ function paragraphDominantFontSizePt(paragraph) {
   return dominantFontSizePt;
 }
 function paragraphBaseFontSizePx(paragraph) {
+  const cached = paragraphBaseFontSizePxByParagraph.get(paragraph);
+  if (cached !== void 0) {
+    return cached;
+  }
   const dominantRunFontSizePt = paragraphDominantFontSizePt(paragraph);
   const fontSizePt = dominantRunFontSizePt && dominantRunFontSizePt > 0 ? dominantRunFontSizePt : Number.isFinite(paragraph.style?.headingLevel) ? DEFAULT_PARAGRAPH_FONT_SIZE_PT + Math.max(0, 6 - (paragraph.style?.headingLevel ?? 6)) : DEFAULT_PARAGRAPH_FONT_SIZE_PT;
-  return Math.max(10, Math.round(fontSizePt * 96 / 72));
+  const baseFontSizePx = Math.max(10, Math.round(fontSizePt * 96 / 72));
+  paragraphBaseFontSizePxByParagraph.set(paragraph, baseFontSizePx);
+  return baseFontSizePx;
 }
 function paragraphMaxFontSizePx(paragraph) {
   const paragraphBaseFontPx = paragraphBaseFontSizePx(paragraph);
@@ -14847,6 +14868,10 @@ function normalizeFontFamilyToken(fontFamily) {
   return normalized || void 0;
 }
 function paragraphDominantFontFamily(paragraph) {
+  const cached = paragraphDominantFontFamilyByParagraph.get(paragraph);
+  if (cached !== void 0) {
+    return cached ?? void 0;
+  }
   const weightByFamily = /* @__PURE__ */ new Map();
   const addWeight = (fontFamily, weight) => {
     const normalizedFamily = normalizeFontFamilyToken(fontFamily);
@@ -14867,6 +14892,7 @@ function paragraphDominantFontFamily(paragraph) {
     addWeight(child.style?.fontFamily, text.length);
   });
   if (weightByFamily.size === 0) {
+    paragraphDominantFontFamilyByParagraph.set(paragraph, null);
     return void 0;
   }
   let dominantFamily;
@@ -14877,6 +14903,7 @@ function paragraphDominantFontFamily(paragraph) {
       dominantWeight = weight;
     }
   }
+  paragraphDominantFontFamilyByParagraph.set(paragraph, dominantFamily ?? null);
   return dominantFamily;
 }
 function singleLineAutoScaleForFontFamily(fontFamily) {
@@ -15966,6 +15993,11 @@ function rowHasDeepFlowContent(row) {
   }
   return nestedTableCount > 0 || blockNodeCount >= SPLITTABLE_TABLE_ROW_DEEP_CONTENT_NODE_THRESHOLD;
 }
+function rowHasNestedTableContent(row) {
+  return row.cells.some(
+    (cell) => cell.nodes.some((contentNode) => contentNode.type === "table")
+  );
+}
 function capSplitFriendlyTableRowEstimatePx(row, estimatedRowHeightPx, explicitHeightPx, pageContentHeightPx) {
   if (!rowAllowsPageSplit(row)) {
     return estimatedRowHeightPx;
@@ -16099,6 +16131,280 @@ function estimateTableRowHeightsPx(table, maxAvailableWidthPx, numberingDefiniti
     return Math.max(MIN_PARAGRAPH_LINE_HEIGHT_PX, rowHeightPx);
   });
 }
+function uniqueSortedPixelBoundaries(values) {
+  const sorted = values.filter((value) => Number.isFinite(value)).map((value) => Math.max(0, Math.round(value))).sort((left, right) => left - right);
+  const unique = [];
+  for (const value of sorted) {
+    const previous = unique[unique.length - 1];
+    if (previous === void 0 || Math.abs(previous - value) > TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX) {
+      unique.push(value);
+    }
+  }
+  return unique;
+}
+function estimateParagraphBoundaryOffsetsPx(paragraph, availableWidthPx, numberingDefinitions, applyWordTableDefaults, docGridLinePitchPx, paragraphIndex) {
+  const paragraphForLayout = wordLikeTableCellParagraph(
+    paragraph,
+    applyWordTableDefaults
+  );
+  const disableDocGridSnap = paragraphDocGridSnapState(paragraph) === "disable";
+  const paragraphHeightPx = estimateParagraphHeightPx(
+    paragraphForLayout,
+    availableWidthPx,
+    numberingDefinitions,
+    docGridLinePitchPx,
+    disableDocGridSnap
+  );
+  const suppressTopSpacing = paragraphIndex === 0 && suppressFirstTableCellParagraphTopSpacing(paragraph);
+  const beforeSpacingPx = suppressTopSpacing ? 0 : twipsToPixels(paragraphForLayout.style?.spacing?.beforeTwips) ?? 0;
+  const afterSpacingPx = twipsToPixels(paragraphForLayout.style?.spacing?.afterTwips) ?? 0;
+  const topBorderInsetPx = paragraphBorderInsetPx(
+    paragraphForLayout.style?.borders?.top
+  );
+  const bottomBorderInsetPx = paragraphBorderInsetPx(
+    paragraphForLayout.style?.borders?.bottom
+  );
+  const lineHeightPx = Math.max(
+    MIN_PARAGRAPH_LINE_HEIGHT_PX,
+    estimateParagraphLineHeightPx(
+      paragraphForLayout,
+      docGridLinePitchPx,
+      disableDocGridSnap
+    )
+  );
+  const pretextSource = buildParagraphPretextLayoutSource(paragraphForLayout, {
+    allowExplicitLineBreakText: true,
+    expandTabsForLayout: true
+  });
+  const paragraphTextWidthPx = paragraphAvailableTextWidthPx(
+    paragraphForLayout,
+    availableWidthPx,
+    numberingDefinitions
+  );
+  const pretextLayout = pretextSource ? layoutParagraphPretextSource(
+    paragraphForLayout,
+    pretextSource,
+    paragraphTextWidthPx,
+    lineHeightPx,
+    []
+  ) : void 0;
+  const lineTopOffsetsPx = pretextLayout ? pretextLayout.lines.map((line) => Math.max(0, Math.round(line.y))) : Array.from(
+    {
+      length: Math.max(
+        1,
+        paragraphLineCountWithinWidth(
+          paragraphForLayout,
+          availableWidthPx,
+          numberingDefinitions
+        )
+      )
+    },
+    (_, lineIndex) => lineIndex * lineHeightPx
+  );
+  const textTopPx = beforeSpacingPx + topBorderInsetPx;
+  const textHeightPx = pretextLayout ? wrappedPretextParagraphBlockHeightPx(pretextLayout) : lineTopOffsetsPx.length * lineHeightPx;
+  const visualHeightPx = Math.max(
+    1,
+    beforeSpacingPx + topBorderInsetPx + textHeightPx + bottomBorderInsetPx + afterSpacingPx
+  );
+  const heightPx = Math.max(1, paragraphHeightPx, visualHeightPx);
+  const lineBoundariesPx = lineTopOffsetsPx.map(
+    (lineTopPx) => textTopPx + lineTopPx + lineHeightPx
+  );
+  return {
+    heightPx,
+    safeBoundariesPx: uniqueSortedPixelBoundaries([
+      ...lineBoundariesPx,
+      heightPx
+    ])
+  };
+}
+function estimateNestedTableBoundaryOffsetsPx(table, availableWidthPx, numberingDefinitions, docGridLinePitchPx) {
+  const rowHeightsPx = estimateTableRowHeightsPx(
+    table,
+    availableWidthPx,
+    numberingDefinitions,
+    docGridLinePitchPx
+  );
+  const boundariesPx = [];
+  let cursorPx = 0;
+  for (const rowHeightPx of rowHeightsPx) {
+    cursorPx += Math.max(MIN_PARAGRAPH_LINE_HEIGHT_PX, rowHeightPx);
+    boundariesPx.push(cursorPx);
+  }
+  return {
+    heightPx: Math.max(MIN_PARAGRAPH_LINE_HEIGHT_PX, cursorPx),
+    safeBoundariesPx: uniqueSortedPixelBoundaries(boundariesPx)
+  };
+}
+function estimateTableCellSliceBoundaryLayoutPx(params) {
+  const {
+    cell,
+    rowHeightPx,
+    contentWidthPx,
+    tableCellMarginTwips,
+    numberingDefinitions,
+    applyWordTableDefaults,
+    docGridLinePitchPx
+  } = params;
+  const paddingPx = resolveTableSpacingPaddingPx(
+    mergeTableSpacing(tableCellMarginTwips, cell.style?.marginTwips)
+  );
+  const localBoundariesPx = [0, paddingPx.top];
+  let contentCursorPx = paddingPx.top;
+  let paragraphIndex = 0;
+  for (const contentNode of cell.nodes) {
+    const layout = contentNode.type === "paragraph" ? estimateParagraphBoundaryOffsetsPx(
+      contentNode,
+      contentWidthPx,
+      numberingDefinitions,
+      applyWordTableDefaults,
+      docGridLinePitchPx,
+      paragraphIndex++
+    ) : estimateNestedTableBoundaryOffsetsPx(
+      contentNode,
+      contentWidthPx,
+      numberingDefinitions,
+      docGridLinePitchPx
+    );
+    localBoundariesPx.push(
+      ...layout.safeBoundariesPx.map(
+        (boundaryPx) => contentCursorPx + boundaryPx
+      )
+    );
+    contentCursorPx += layout.heightPx;
+  }
+  const contentBottomPx = contentCursorPx + paddingPx.bottom;
+  const contentFlowHeightPx = Math.max(0, contentCursorPx - paddingPx.top);
+  const availableContentHeightPx = Math.max(
+    0,
+    rowHeightPx - paddingPx.top - paddingPx.bottom
+  );
+  const extraVerticalSpacePx = Math.max(
+    0,
+    availableContentHeightPx - contentFlowHeightPx
+  );
+  const verticalOffsetPx = cell.style?.verticalAlign === "center" ? Math.round(extraVerticalSpacePx / 2) : cell.style?.verticalAlign === "bottom" ? extraVerticalSpacePx : 0;
+  return {
+    safeBoundariesPx: uniqueSortedPixelBoundaries(
+      localBoundariesPx.map(
+        (boundaryPx) => Math.min(rowHeightPx, boundaryPx + verticalOffsetPx)
+      )
+    ),
+    contentBottomPx: Math.min(rowHeightPx, contentBottomPx + verticalOffsetPx)
+  };
+}
+function tableCellSliceBoundaryIsSafe(layout, boundaryPx) {
+  if (boundaryPx <= TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX) {
+    return true;
+  }
+  if (boundaryPx >= layout.contentBottomPx - TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX) {
+    return true;
+  }
+  return layout.safeBoundariesPx.some(
+    (safeBoundaryPx) => Math.abs(safeBoundaryPx - boundaryPx) <= TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX
+  );
+}
+function resolveTableRowSliceHeightOnSafeBoundaryPx(params) {
+  const {
+    table,
+    rowIndex,
+    rowHeightPx,
+    rowSliceOffsetPx,
+    preferredSliceHeightPx,
+    maxAvailableWidthPx,
+    numberingDefinitions,
+    docGridLinePitchPx
+  } = params;
+  const row = table.rows[rowIndex];
+  if (!row || !rowHasNestedTableContent(row)) {
+    return preferredSliceHeightPx;
+  }
+  const sliceStartPx = Math.max(0, Math.round(rowSliceOffsetPx));
+  const preferredSliceEndPx = Math.min(
+    rowHeightPx,
+    sliceStartPx + Math.max(0, Math.round(preferredSliceHeightPx))
+  );
+  if (preferredSliceEndPx >= rowHeightPx - TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX) {
+    return Math.max(0, rowHeightPx - sliceStartPx);
+  }
+  const columnCount = tableColumnCount(table);
+  const tableWidthPx = twipsToPixels(table.style?.widthTwips);
+  const rawTableColumnWidthsPx = (() => {
+    const definedWidthsTwips = columnWidthsFromTableDefinition(
+      table,
+      columnCount
+    );
+    if (!definedWidthsTwips || definedWidthsTwips.length === 0) {
+      return defaultColumnWidthsPx(columnCount, tableWidthPx);
+    }
+    const widthsPx = definedWidthsTwips.map(
+      (widthTwips) => twipsToPixels(widthTwips) ?? 0
+    );
+    return normalizeColumnWidthsPx(widthsPx, columnCount, tableWidthPx, 1);
+  })();
+  const rawResolvedTableWidthPx = tableWidthPx ?? rawTableColumnWidthsPx.reduce((sum, widthPx) => sum + widthPx, 0);
+  const collapsedHorizontalBorderBleedPx = resolveCollapsedTableHorizontalOuterBleedPx(table, columnCount);
+  const maxTableWidthPx = Number.isFinite(maxAvailableWidthPx) && maxAvailableWidthPx > 0 ? Math.max(
+    120,
+    maxAvailableWidthPx - collapsedHorizontalBorderBleedPx
+  ) : void 0;
+  const resolvedTableWidthPx = clampTableWidthPx(
+    rawResolvedTableWidthPx,
+    maxTableWidthPx
+  );
+  const tableColumnWidthsPx = fitColumnWidthsToWidth(
+    rawTableColumnWidthsPx,
+    resolvedTableWidthPx
+  );
+  const applyWordTableDefaults = tableUsesWordLikeParagraphDefaults(table);
+  const tableCellMarginTwips = table.style?.cellMarginTwips;
+  const cellLayouts = [];
+  const candidateBoundariesPx = [preferredSliceEndPx];
+  let columnCursor = 0;
+  for (const cell of row.cells) {
+    const colSpanValue = cell.style?.gridSpan && cell.style.gridSpan > 1 ? cell.style.gridSpan : 1;
+    const startColumnIndex = columnCursor;
+    const endColumnIndex = Math.min(
+      columnCount - 1,
+      startColumnIndex + colSpanValue - 1
+    );
+    columnCursor += colSpanValue;
+    const spannedWidthPx = tableColumnWidthsPx.slice(startColumnIndex, endColumnIndex + 1).reduce((sum, widthPx) => sum + widthPx, 0);
+    const fallbackCellWidthPx = resolvedTableWidthPx / Math.max(1, columnCount) * colSpanValue;
+    const cellRenderedWidthPx = twipsToPixels(cell.style?.widthTwips) ?? (spannedWidthPx > 0 ? spannedWidthPx : fallbackCellWidthPx);
+    const cellPaddingPx = resolveTableSpacingPaddingPx(
+      mergeTableSpacing(tableCellMarginTwips, cell.style?.marginTwips)
+    );
+    const cellContentWidthPx = Math.max(
+      1,
+      cellRenderedWidthPx - cellPaddingPx.left - cellPaddingPx.right
+    );
+    const cellLayout = estimateTableCellSliceBoundaryLayoutPx({
+      cell,
+      rowHeightPx,
+      contentWidthPx: cellContentWidthPx,
+      tableCellMarginTwips,
+      numberingDefinitions,
+      applyWordTableDefaults,
+      docGridLinePitchPx
+    });
+    cellLayouts.push(cellLayout);
+    candidateBoundariesPx.push(...cellLayout.safeBoundariesPx);
+  }
+  const minimumSliceEndPx = sliceStartPx + Math.max(1, MIN_TABLE_ROW_SLICE_REMAINING_HEIGHT_PX);
+  const candidatesPx = uniqueSortedPixelBoundaries(candidateBoundariesPx).filter(
+    (boundaryPx) => boundaryPx >= minimumSliceEndPx && boundaryPx <= preferredSliceEndPx + TABLE_ROW_SLICE_BOUNDARY_TOLERANCE_PX
+  ).sort((left, right) => right - left);
+  for (const candidatePx of candidatesPx) {
+    if (cellLayouts.every(
+      (layout) => tableCellSliceBoundaryIsSafe(layout, candidatePx)
+    )) {
+      return Math.max(0, candidatePx - sliceStartPx);
+    }
+  }
+  return void 0;
+}
 function estimateTableHeightPx(table, maxAvailableWidthPx, numberingDefinitions, docGridLinePitchPx) {
   const sourceXml = table.sourceXml;
   const widthKey = heightEstimateCacheKeyPx(
@@ -16387,6 +16693,234 @@ function estimateRenderedPageSegmentHeightPx(node, segment, model, availableWidt
     )
   );
 }
+function resolveParagraphColumnRenderLineRange(paragraph, segment, availableWidthPx, numberingDefinitions, docGridLinePitchPx) {
+  const lineHeightPx = Math.max(
+    1,
+    segment.paragraphLineRange?.lineHeightPx ?? estimateParagraphLineHeightPx(paragraph, docGridLinePitchPx)
+  );
+  if (segment.paragraphLineRange) {
+    return {
+      ...segment.paragraphLineRange,
+      lineHeightPx
+    };
+  }
+  const paragraphTextWidthPx = paragraphAvailableTextWidthPx(
+    paragraph,
+    availableWidthPx,
+    numberingDefinitions
+  );
+  const pretextSource = buildParagraphPretextLayoutSource(paragraph, {
+    allowExplicitLineBreakText: true,
+    expandTabsForLayout: true
+  });
+  const pretextLayout = pretextSource ? layoutParagraphPretextSource(
+    paragraph,
+    pretextSource,
+    paragraphTextWidthPx,
+    lineHeightPx,
+    []
+  ) : void 0;
+  const totalLineCount = pretextLayout && pretextLayout.lineCount > 0 ? pretextLayout.lineCount : paragraphLineCountWithinWidth(
+    paragraph,
+    availableWidthPx,
+    numberingDefinitions
+  );
+  return {
+    startLineIndex: 0,
+    endLineIndex: Math.max(1, totalLineCount),
+    totalLineCount: Math.max(1, totalLineCount),
+    lineHeightPx
+  };
+}
+function splitParagraphSegmentForColumnRender(params) {
+  const {
+    paragraph,
+    segment,
+    model,
+    availableWidthPx,
+    availableHeightPx,
+    numberingDefinitions,
+    docGridLinePitchPx
+  } = params;
+  if (segment.tableRowRange || segment.tableRowSlice || paragraphHasExplicitColumnBreak(paragraph)) {
+    return void 0;
+  }
+  const fullLineRange = resolveParagraphColumnRenderLineRange(
+    paragraph,
+    segment,
+    availableWidthPx,
+    numberingDefinitions,
+    docGridLinePitchPx
+  );
+  const startLineIndex = Math.max(0, fullLineRange.startLineIndex);
+  const endLineIndex = Math.max(startLineIndex, fullLineRange.endLineIndex);
+  if (endLineIndex - startLineIndex < 2 || !paragraphCanSplitAcrossPages(paragraph, fullLineRange.totalLineCount)) {
+    return void 0;
+  }
+  const safeAvailableHeightPx = Math.max(0, Math.round(availableHeightPx));
+  let bestSegment;
+  let bestHeightPx = 0;
+  for (let candidateEndLineIndex = startLineIndex + 1; candidateEndLineIndex < endLineIndex; candidateEndLineIndex += 1) {
+    const candidateSegment = {
+      ...segment,
+      paragraphLineRange: {
+        startLineIndex,
+        endLineIndex: candidateEndLineIndex,
+        totalLineCount: fullLineRange.totalLineCount,
+        lineHeightPx: fullLineRange.lineHeightPx
+      }
+    };
+    const candidateHeightPx = estimateRenderedPageSegmentHeightPx(
+      paragraph,
+      candidateSegment,
+      model,
+      availableWidthPx,
+      numberingDefinitions,
+      docGridLinePitchPx
+    );
+    if (candidateHeightPx > safeAvailableHeightPx + PAGE_OVERFLOW_TOLERANCE_PX) {
+      break;
+    }
+    bestSegment = candidateSegment;
+    bestHeightPx = candidateHeightPx;
+  }
+  if (!bestSegment?.paragraphLineRange) {
+    return void 0;
+  }
+  return {
+    currentSegment: bestSegment,
+    currentHeightPx: bestHeightPx,
+    remainderSegment: {
+      ...segment,
+      paragraphLineRange: {
+        startLineIndex: bestSegment.paragraphLineRange.endLineIndex,
+        endLineIndex,
+        totalLineCount: fullLineRange.totalLineCount,
+        lineHeightPx: fullLineRange.lineHeightPx
+      }
+    }
+  };
+}
+function buildRenderColumnSegmentsForPageSection(model, flowSegments, columnWidthsPx, columnHeightPx, numberingDefinitions, docGridLinePitchPxByNodeIndex, measuredParagraphOuterHeightsPxByNodeIndex, balanceColumns = false) {
+  const columnCount = Math.max(1, columnWidthsPx.length);
+  const columns = Array.from(
+    { length: columnCount },
+    () => []
+  );
+  const maxColumnHeightPx = Math.max(120, Math.round(columnHeightPx));
+  const resolveSegmentHeightPx = (segment, columnWidthPx) => {
+    const segmentNode = model.nodes[segment.nodeIndex];
+    if (!segmentNode) {
+      return MIN_PARAGRAPH_LINE_HEIGHT_PX;
+    }
+    const docGridLinePitchPx = docGridLinePitchPxByNodeIndex?.get(
+      segment.nodeIndex
+    );
+    const measuredSegmentHeightPx = segmentNode.type === "paragraph" && !segment.paragraphLineRange && !segment.tableRowRange && !segment.tableRowSlice ? measuredParagraphOuterHeightsPxByNodeIndex?.get(segment.nodeIndex) : void 0;
+    return Number.isFinite(measuredSegmentHeightPx) && measuredSegmentHeightPx > 0 ? Math.max(1, Math.round(measuredSegmentHeightPx)) : estimateRenderedPageSegmentHeightPx(
+      segmentNode,
+      segment,
+      model,
+      columnWidthPx,
+      numberingDefinitions,
+      docGridLinePitchPx
+    );
+  };
+  const safeColumnHeightPx = balanceColumns && columnCount > 1 ? Math.min(
+    maxColumnHeightPx,
+    Math.max(
+      MIN_PARAGRAPH_LINE_HEIGHT_PX * 4,
+      Math.ceil(
+        flowSegments.reduce((totalHeightPx, segment) => {
+          const columnWidthPx = Math.max(
+            120,
+            Math.round(columnWidthsPx[0] ?? 120)
+          );
+          return totalHeightPx + resolveSegmentHeightPx(segment, columnWidthPx);
+        }, 0) / columnCount
+      ) + PAGE_OVERFLOW_TOLERANCE_PX
+    )
+  ) : maxColumnHeightPx;
+  let columnIndex = 0;
+  let consumedHeightPx = 0;
+  const moveToNextColumn = () => {
+    if (columnIndex + 1 >= columnCount) {
+      return false;
+    }
+    columnIndex += 1;
+    consumedHeightPx = 0;
+    return true;
+  };
+  const pushSegment = (segment, heightPx) => {
+    columns[columnIndex]?.push(segment);
+    consumedHeightPx += Math.max(1, Math.round(heightPx));
+  };
+  for (const flowSegment of flowSegments) {
+    let pendingSegment = flowSegment;
+    let splitGuard = 0;
+    while (pendingSegment && splitGuard < 256) {
+      splitGuard += 1;
+      const currentSegment = pendingSegment;
+      const segmentNode = model.nodes[currentSegment.nodeIndex];
+      if (!segmentNode) {
+        columns[columnIndex]?.push(currentSegment);
+        break;
+      }
+      const columnWidthPx = Math.max(
+        120,
+        Math.round(columnWidthsPx[columnIndex] ?? columnWidthsPx[0] ?? 120)
+      );
+      const docGridLinePitchPx = docGridLinePitchPxByNodeIndex?.get(
+        currentSegment.nodeIndex
+      );
+      const segmentHeightPx = resolveSegmentHeightPx(
+        currentSegment,
+        columnWidthPx
+      );
+      const remainingHeightPx = Math.max(
+        0,
+        safeColumnHeightPx - consumedHeightPx
+      );
+      if (segmentHeightPx <= remainingHeightPx + PAGE_OVERFLOW_TOLERANCE_PX || columnIndex + 1 >= columnCount) {
+        pushSegment(currentSegment, segmentHeightPx);
+        pendingSegment = void 0;
+        break;
+      }
+      const splitSegment = segmentNode.type === "paragraph" ? splitParagraphSegmentForColumnRender({
+        paragraph: segmentNode,
+        segment: currentSegment,
+        model,
+        availableWidthPx: columnWidthPx,
+        availableHeightPx: remainingHeightPx,
+        numberingDefinitions,
+        docGridLinePitchPx
+      }) : void 0;
+      if (splitSegment) {
+        pushSegment(splitSegment.currentSegment, splitSegment.currentHeightPx);
+        pendingSegment = splitSegment.remainderSegment;
+        if (!moveToNextColumn()) {
+          const remainderSegment = splitSegment.remainderSegment;
+          const remainderHeightPx = estimateRenderedPageSegmentHeightPx(
+            segmentNode,
+            remainderSegment,
+            model,
+            columnWidthPx,
+            numberingDefinitions,
+            docGridLinePitchPx
+          );
+          pushSegment(remainderSegment, remainderHeightPx);
+          pendingSegment = void 0;
+        }
+        continue;
+      }
+      if (!moveToNextColumn()) {
+        pushSegment(currentSegment, segmentHeightPx);
+        pendingSegment = void 0;
+      }
+    }
+  }
+  return columns;
+}
 function sumEstimatedTableRowHeightsPx(rowHeightsPx, startRowIndex, endRowIndex) {
   let total = 0;
   const clampedStart = Math.max(0, startRowIndex);
@@ -16860,16 +17394,10 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
             const exactSegmentEndLineIndex = resolveMaxPretextLineRangeEndIndexThatFits(
               pretextLayoutForSegmentSplitting,
               lineCursor,
-              Math.min(
-                resolvedParagraphLineCount,
-                lineCursor + linesThatFit
-              ),
+              Math.min(resolvedParagraphLineCount, lineCursor + linesThatFit),
               availableForLinesPx
             );
-            linesThatFit = Math.max(
-              0,
-              exactSegmentEndLineIndex - lineCursor
-            );
+            linesThatFit = Math.max(0, exactSegmentEndLineIndex - lineCursor);
           }
           if (linesThatFit < minLinesPerSegment) {
             if (currentPageSegments.length > 0) {
@@ -16906,10 +17434,7 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
               lineCursor,
               segmentEndLineIndex
             );
-            if (topSpacingPx + resolveSegmentContentHeightPx(
-              lineCursor,
-              segmentEndLineIndex
-            ) + segmentReservePx <= remainingHeightPx2) {
+            if (topSpacingPx + resolveSegmentContentHeightPx(lineCursor, segmentEndLineIndex) + segmentReservePx <= remainingHeightPx2) {
               break;
             }
             linesThatFit -= 1;
@@ -17110,6 +17635,7 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
     let rowStartIndex = 0;
     let rowSliceOffsetPx = 0;
     let repeatedHeaderHeightPxOnThisPage = 0;
+    let tableBreakStartRowCursor = 0;
     while (rowStartIndex < estimatedRowHeightsPx.length) {
       if (currentPageSegments.length === 0) {
         repeatedHeaderHeightPxOnThisPage = 0;
@@ -17144,9 +17670,10 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
         currentPageContentHeightPx - repeatedHeaderHeightPxOnThisPage
       );
       const rowExceedsFreshPageHeightPx = currentRowTotalHeightPx > freshPageAvailableHeightPx + PAGE_OVERFLOW_TOLERANCE_PX;
+      const hasUsableCurrentPageSliceSpace = pageConsumedHeightPx > 0 && remainingHeightPx >= MIN_TABLE_ROW_SLICE_REMAINING_HEIGHT_PX;
       const canSplitCurrentRow = rowSliceOffsetPx > 0 || rowAllowsPageSplit(currentRow) || rowExceedsFreshPageHeightPx;
       const shouldContinueExistingRowSlice = rowSliceOffsetPx > 0;
-      const rowNeedsSliceOnThisPage = ENABLE_TABLE_ROW_SLICING && canSplitCurrentRow && currentRowRemainingHeightPx > remainingHeightPx + PAGE_OVERFLOW_TOLERANCE_PX && (shouldContinueExistingRowSlice || rowExceedsFreshPageHeightPx);
+      const rowNeedsSliceOnThisPage = ENABLE_TABLE_ROW_SLICING && canSplitCurrentRow && currentRowRemainingHeightPx > remainingHeightPx + PAGE_OVERFLOW_TOLERANCE_PX && (shouldContinueExistingRowSlice || rowExceedsFreshPageHeightPx || hasUsableCurrentPageSliceSpace);
       if (canSplitCurrentRow && currentRowRemainingHeightPx > remainingHeightPx + PAGE_OVERFLOW_TOLERANCE_PX && !rowNeedsSliceOnThisPage && currentPageSegments.length > 0) {
         startNextPage();
         pageConsumedHeightPx = 0;
@@ -17174,10 +17701,38 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
           MIN_PARAGRAPH_LINE_HEIGHT_PX,
           Math.round(remainingHeightPx)
         );
-        const sliceHeightPx = Math.max(
+        const preferredSliceHeightPx = Math.max(
           MIN_PARAGRAPH_LINE_HEIGHT_PX,
           Math.min(currentRowRemainingHeightPx, availableSliceHeightPx)
         );
+        const safeSliceHeightPx = resolveTableRowSliceHeightOnSafeBoundaryPx({
+          table: node,
+          rowIndex: rowStartIndex,
+          rowHeightPx: currentRowTotalHeightPx,
+          rowSliceOffsetPx,
+          preferredSliceHeightPx,
+          maxAvailableWidthPx: nodeMetrics.pageContentWidthPx,
+          numberingDefinitions,
+          docGridLinePitchPx: nodeMetrics.docGridLinePitchPx
+        });
+        if (safeSliceHeightPx === void 0 && pageConsumedHeightPx > 0 && currentPageSegments.length > 0) {
+          startNextPage();
+          pageConsumedHeightPx = 0;
+          previousParagraphAfterPx = 0;
+          currentSectionPageFlowOriginPx = 0;
+          currentPageContentHeightPx = resolveMetricsPageContentHeightPx(
+            currentPageIndex,
+            nodeMetrics
+          );
+          continue;
+        }
+        const sliceHeightPx = Math.max(
+          MIN_PARAGRAPH_LINE_HEIGHT_PX,
+          Math.min(
+            currentRowRemainingHeightPx,
+            safeSliceHeightPx ?? preferredSliceHeightPx
+          )
+        );
         currentPageSegments.push({
           nodeIndex,
           tableRowRange: {
@@ -17243,9 +17798,10 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
         pageConsumedHeightPx <= 0
       );
       let rowEndIndex = fittedRowEndIndex;
-      const forcedBreakRowIndex = tableBreakStartRows.find(
-        (breakRowIndex) => breakRowIndex > rowStartIndex
-      );
+      while (tableBreakStartRowCursor < tableBreakStartRows.length && tableBreakStartRows[tableBreakStartRowCursor] <= rowStartIndex) {
+        tableBreakStartRowCursor += 1;
+      }
+      const forcedBreakRowIndex = tableBreakStartRows[tableBreakStartRowCursor];
       if (forcedBreakRowIndex !== void 0) {
         rowEndIndex = Math.min(rowEndIndex, forcedBreakRowIndex);
       }
@@ -17311,6 +17867,19 @@ function buildDocumentPageNodeSegments(model, pageContentHeightPx, pageContentWi
       rowStartIndex = rowEndIndex;
       rowSliceOffsetPx = 0;
       if (rowStartIndex < estimatedRowHeightsPx.length) {
+        const nextRow = node.rows[rowStartIndex];
+        const nextRowHeightPx = Math.max(
+          MIN_PARAGRAPH_LINE_HEIGHT_PX,
+          estimatedRowHeightsPx[rowStartIndex] ?? MIN_PARAGRAPH_LINE_HEIGHT_PX
+        );
+        const remainingHeightAfterSegmentPx = Math.max(
+          0,
+          currentPageContentHeightPx - pageConsumedHeightPx
+        );
+        const canSliceNextRowOnCurrentPage = ENABLE_TABLE_ROW_SLICING && nextRow !== void 0 && rowAllowsPageSplit(nextRow) && !tableBreakStartRows.includes(rowStartIndex) && remainingHeightAfterSegmentPx >= MIN_TABLE_ROW_SLICE_REMAINING_HEIGHT_PX && nextRowHeightPx > remainingHeightAfterSegmentPx + PAGE_OVERFLOW_TOLERANCE_PX;
+        if (canSliceNextRowOnCurrentPage) {
+          continue;
+        }
         startNextPage();
         pageConsumedHeightPx = 0;
         previousParagraphAfterPx = 0;
@@ -24363,7 +24932,8 @@ function useDocxEditor(options = {}) {
   const [status, setStatus] = React.useState(
     options.initialStatus ?? "Ready"
   );
-  const isImporting = false;
+  const [importError, setImportError] = React.useState();
+  const [isImporting, setIsImporting] = React.useState(false);
   const [documentTheme, setDocumentThemeState] = React.useState(options.initialDocumentTheme ?? "light");
   const [showTrackedChanges, setShowTrackedChangesState] = React.useState(options.initialShowTrackedChanges ?? false);
   const [paginationInfo, setPaginationInfo] = React.useState({
@@ -24880,12 +25450,36 @@ function useDocxEditor(options = {}) {
     },
     [dispatchEditorTransaction]
   );
+  const replaceDocumentWithImportError = React.useCallback(
+    (fileName2, error) => {
+      unloadEmbeddedFonts();
+      setModel(createBlankDocumentModel());
+      setDocumentLoadNonce((current) => current + 1);
+      setHistory({ past: [], future: [] });
+      setHistoryRestoreRequest(void 0);
+      setBasePackage(void 0);
+      setFileName(fileName2);
+      setSelection({ kind: "paragraph", nodeIndex: 0 });
+      setActiveTextRangeState(void 0);
+      setPendingRunStyle(void 0);
+      setSelectedFormFieldLocation(void 0);
+      setImportError(error);
+      setStatus(`Failed to load file: ${error.message}`);
+    },
+    [unloadEmbeddedFonts]
+  );
   const importDocxFile = React.useCallback(
     async (file) => {
       if (!/\.docx$/i.test(file.name)) {
-        setStatus("Only .docx files are supported");
+        replaceDocumentWithImportError(
+          file.name,
+          new Error("Only .docx files are supported")
+        );
         return;
       }
+      setIsImporting(true);
+      setImportError(void 0);
+      setStatus(`Loading ${file.name}...`);
       try {
         const buffer = await file.arrayBuffer();
         const pkg = await parseDocx(buffer);
@@ -24901,14 +25495,16 @@ function useDocxEditor(options = {}) {
         setActiveTextRangeState(void 0);
         setPendingRunStyle(void 0);
         setSelectedFormFieldLocation(void 0);
+        setImportError(void 0);
         setStatus(`Loaded ${file.name}`);
       } catch (error) {
-        setStatus(
-          `Failed to load file: ${error instanceof Error ? error.message : "Unknown error"}`
-        );
+        const nextError = error instanceof Error ? error : new Error("Unknown error");
+        replaceDocumentWithImportError(file.name, nextError);
+      } finally {
+        setIsImporting(false);
       }
     },
-    [loadEmbeddedFontsFromPackage]
+    [loadEmbeddedFontsFromPackage, replaceDocumentWithImportError]
   );
   const newDocument = React.useCallback(() => {
     unloadEmbeddedFonts();
@@ -24922,6 +25518,7 @@ function useDocxEditor(options = {}) {
     setSelectedFormFieldLocation(void 0);
     setHistory({ past: [], future: [] });
     setHistoryRestoreRequest(void 0);
+    setImportError(void 0);
     setStatus("Created new document");
   }, [unloadEmbeddedFonts]);
   const exportDocx = React.useCallback(() => {
@@ -27830,6 +28427,7 @@ function useDocxEditor(options = {}) {
     documentLoadNonce,
     fileName,
     status,
+    importError,
     isImporting,
     documentTheme,
     trackedChanges,
@@ -29395,7 +29993,7 @@ function DocxEditorViewer({
   style,
   pageBackgroundColor,
   pageGapBackgroundColor,
-  deferInitialPaginationPaint = true,
+  deferInitialPaginationPaint = false,
   loadingState,
   pageVirtualization,
   visiblePageRange,
@@ -29456,6 +30054,10 @@ function DocxEditorViewer({
   const paragraphElementsRef = React.useRef(
     /* @__PURE__ */ new Map()
   );
+  const [
+    measuredParagraphOuterHeightsPxByNodeIndex,
+    setMeasuredParagraphOuterHeightsPxByNodeIndex
+  ] = React.useState(() => /* @__PURE__ */ new Map());
   const tableCellEditorElementsRef = React.useRef(
     /* @__PURE__ */ new Map()
   );
@@ -29730,6 +30332,9 @@ function DocxEditorViewer({
   const paginationMeasurementResumeTimeoutRef = React.useRef(
     null
   );
+  React.useLayoutEffect(() => {
+    setMeasuredParagraphOuterHeightsPxByNodeIndex(/* @__PURE__ */ new Map());
+  }, [editor.documentLoadNonce, paragraphStructureEpoch]);
   const schedulePaginationMeasurementResume = React.useCallback(
     (delayMs) => {
       if (typeof window === "undefined") {
@@ -29942,10 +30547,20 @@ function DocxEditorViewer({
     () => buildPaginationSectionMetrics(documentSections, documentLayout),
     [documentLayout, documentSections]
   );
-  const docGridLinePitchPxByNodeIndex = React.useMemo(() => {
+  const {
+    docGridLinePitchPxByNodeIndex,
+    pageContentWidthPxByNodeIndex,
+    pageContentHeightPxByNodeIndex
+  } = React.useMemo(() => {
     const pitchByNodeIndex = /* @__PURE__ */ new Map();
+    const widthByNodeIndex = /* @__PURE__ */ new Map();
+    const heightByNodeIndex = /* @__PURE__ */ new Map();
     if (editor.model.nodes.length === 0 || paginationSectionMetrics.length === 0) {
-      return pitchByNodeIndex;
+      return {
+        docGridLinePitchPxByNodeIndex: pitchByNodeIndex,
+        pageContentWidthPxByNodeIndex: widthByNodeIndex,
+        pageContentHeightPxByNodeIndex: heightByNodeIndex
+      };
     }
     let currentMetricsIndex = 0;
     for (let nodeIndex = 0; nodeIndex < editor.model.nodes.length; nodeIndex += 1) {
@@ -29954,51 +30569,22 @@ function DocxEditorViewer({
         nodeIndex,
         currentMetricsIndex
       );
-      const docGridLinePitchPx = paginationSectionMetrics[currentMetricsIndex]?.docGridLinePitchPx;
+      const nodeMetrics = paginationSectionMetrics[currentMetricsIndex];
+      const docGridLinePitchPx = nodeMetrics?.docGridLinePitchPx;
       if (Number.isFinite(docGridLinePitchPx) && docGridLinePitchPx > 0) {
         pitchByNodeIndex.set(
           nodeIndex,
           Math.round(docGridLinePitchPx)
         );
       }
-    }
-    return pitchByNodeIndex;
-  }, [editor.model.nodes, paginationSectionMetrics]);
-  const pageContentWidthPxByNodeIndex = React.useMemo(() => {
-    const widthByNodeIndex = /* @__PURE__ */ new Map();
-    if (editor.model.nodes.length === 0 || paginationSectionMetrics.length === 0) {
-      return widthByNodeIndex;
-    }
-    let currentMetricsIndex = 0;
-    for (let nodeIndex = 0; nodeIndex < editor.model.nodes.length; nodeIndex += 1) {
-      currentMetricsIndex = resolvePaginationSectionMetricsIndexForNodeIndex(
-        paginationSectionMetrics,
-        nodeIndex,
-        currentMetricsIndex
-      );
-      const pageContentWidthPx = paginationSectionMetrics[currentMetricsIndex]?.pageContentWidthPx;
+      const pageContentWidthPx = nodeMetrics?.pageContentWidthPx;
       if (Number.isFinite(pageContentWidthPx) && pageContentWidthPx > 0) {
         widthByNodeIndex.set(
           nodeIndex,
           Math.round(pageContentWidthPx)
         );
       }
-    }
-    return widthByNodeIndex;
-  }, [editor.model.nodes, paginationSectionMetrics]);
-  const pageContentHeightPxByNodeIndex = React.useMemo(() => {
-    const heightByNodeIndex = /* @__PURE__ */ new Map();
-    if (editor.model.nodes.length === 0 || paginationSectionMetrics.length === 0) {
-      return heightByNodeIndex;
-    }
-    let currentMetricsIndex = 0;
-    for (let nodeIndex = 0; nodeIndex < editor.model.nodes.length; nodeIndex += 1) {
-      currentMetricsIndex = resolvePaginationSectionMetricsIndexForNodeIndex(
-        paginationSectionMetrics,
-        nodeIndex,
-        currentMetricsIndex
-      );
-      const pageContentHeightPx = paginationSectionMetrics[currentMetricsIndex]?.pageContentHeightPx;
+      const pageContentHeightPx = nodeMetrics?.pageContentHeightPx;
       if (Number.isFinite(pageContentHeightPx) && pageContentHeightPx > 0) {
         heightByNodeIndex.set(
           nodeIndex,
@@ -30006,7 +30592,11 @@ function DocxEditorViewer({
         );
       }
     }
-    return heightByNodeIndex;
+    return {
+      docGridLinePitchPxByNodeIndex: pitchByNodeIndex,
+      pageContentWidthPxByNodeIndex: widthByNodeIndex,
+      pageContentHeightPxByNodeIndex: heightByNodeIndex
+    };
   }, [editor.model.nodes, paginationSectionMetrics]);
   const sectionColumnsBySectionIndex = React.useMemo(
     () => documentSections.map(
@@ -30158,11 +30748,11 @@ function DocxEditorViewer({
         renderPageContentHeightScale: estimatedRenderPageContentHeightScale
       };
     }
-    const pureEstimatedPages = buildEstimatedPages(
-      tableMeasuredRowHeightsForPagination,
-      null
-    );
     if (measuredPageContentHeightByIndex && measuredPageContentHeightByIndex.length > 0) {
+      const pureEstimatedPages = buildEstimatedPages(
+        tableMeasuredRowHeightsForPagination,
+        null
+      );
       const measuredPagesAreOnlySplitParagraphs = estimatedPages.length > 0 && estimatedPages.every(
         (pageSegments) => documentPageContainsOnlySplitParagraphSegments(pageSegments)
       );
@@ -30209,9 +30799,9 @@ function DocxEditorViewer({
       estimatedRenderMeasuredPageContentHeightsPxByPageIndex = bestCandidate.renderMeasuredPageContentHeightsPxByPageIndex;
       estimatedRenderPageContentHeightScale = bestCandidate.renderPageContentHeightScale;
     } else if (!editor.canUndo && !editor.canRedo && targetPageCount !== void 0 && !hasMultiColumnRenderedPageBreakHints) {
-      const pureEstimatedPages2 = buildEstimatedPages(void 0, null);
-      if (Math.abs(pureEstimatedPages2.length - targetPageCount) < Math.abs(estimatedPages.length - targetPageCount)) {
-        estimatedPages = pureEstimatedPages2;
+      const pureEstimatedPages = buildEstimatedPages(void 0, null);
+      if (Math.abs(pureEstimatedPages.length - targetPageCount) < Math.abs(estimatedPages.length - targetPageCount)) {
+        estimatedPages = pureEstimatedPages;
         estimatedPagesUseMeasuredPageContentHeightsForRender = false;
         estimatedRenderMeasuredPageContentHeightsPxByPageIndex = void 0;
         estimatedRenderPageContentHeightScale = void 0;
@@ -30331,9 +30921,9 @@ function DocxEditorViewer({
     ) : void 0;
     let reconciledRenderPageContentHeightScale = reconciledPagesUseMeasuredPageContentHeightsForRender ? void 0 : reconciledCandidate.scale;
     if (!editor.canUndo && !editor.canRedo) {
-      const pureEstimatedPages2 = buildEstimatedPages(void 0, null);
+      const pureEstimatedPages = buildEstimatedPages(void 0, null);
       const pureReconciledCandidate = reconcileCandidatePages(
-        pureEstimatedPages2,
+        pureEstimatedPages,
         void 0,
         null
       );
@@ -30830,8 +31420,9 @@ function DocxEditorViewer({
     pageCount,
     pageVirtualization?.overscan
   ]);
+  const shouldObserveVisiblePageRange = hasLargeTableLayoutSurface || internalVirtualItems.length === 0;
   React.useLayoutEffect(() => {
-    if (!internalPageVirtualizationEnabled || !internalVirtualScrollElement || internalVirtualItems.length > 0 || typeof window === "undefined") {
+    if (!internalPageVirtualizationEnabled || !internalVirtualScrollElement || !shouldObserveVisiblePageRange || typeof window === "undefined") {
       setObservedVisiblePageRange(
         (current) => current === void 0 ? current : void 0
       );
@@ -30845,6 +31436,15 @@ function DocxEditorViewer({
       return;
     }
     let frameId = null;
+    const commitObservedVisiblePageRange = (updater) => {
+      if (hasLargeTableLayoutSurface) {
+        (0, import_react_dom.flushSync)(() => {
+          setObservedVisiblePageRange(updater);
+        });
+        return;
+      }
+      setObservedVisiblePageRange(updater);
+    };
     const syncVisiblePageRange = () => {
       frameId = null;
       const viewportRect = internalVirtualScrollUsesWindow ? {
@@ -30878,7 +31478,7 @@ function DocxEditorViewer({
         lastVisiblePageIndex = pageIndex;
       }
       if (firstVisiblePageIndex === void 0 || lastVisiblePageIndex === void 0) {
-        setObservedVisiblePageRange(
+        commitObservedVisiblePageRange(
           (current) => current === void 0 ? current : void 0
         );
         return;
@@ -30893,7 +31493,7 @@ function DocxEditorViewer({
         startPageIndex,
         pageCount - 1
       );
-      setObservedVisiblePageRange((current) => {
+      commitObservedVisiblePageRange((current) => {
         if (current?.startPageIndex === startPageIndex && current?.endPageIndex === endPageIndex) {
           return current;
         }
@@ -30945,14 +31545,42 @@ function DocxEditorViewer({
       }
     };
   }, [
+    hasLargeTableLayoutSurface,
     internalPageVirtualizationEnabled,
     internalVirtualItems.length,
     internalVirtualScrollElement,
     internalVirtualScrollUsesWindow,
     pageCount,
-    pageVirtualizationOverscan
+    pageVirtualizationOverscan,
+    shouldObserveVisiblePageRange
   ]);
-  const effectiveVisiblePageRange = visiblePageRange ?? internalRenderVisiblePageRange ?? observedVisiblePageRange ?? (internalPageVirtualizationPending ? {
+  const internalEffectiveRenderVisiblePageRange = React.useMemo(() => {
+    if (!internalRenderVisiblePageRange) {
+      return observedVisiblePageRange;
+    }
+    if (!observedVisiblePageRange || !hasLargeTableLayoutSurface) {
+      return internalRenderVisiblePageRange;
+    }
+    const rangesAreAdjacentOrOverlapping = observedVisiblePageRange.startPageIndex <= internalRenderVisiblePageRange.endPageIndex + 2 && internalRenderVisiblePageRange.startPageIndex <= observedVisiblePageRange.endPageIndex + 2;
+    if (!rangesAreAdjacentOrOverlapping) {
+      return internalRenderVisiblePageRange;
+    }
+    return {
+      startPageIndex: Math.min(
+        internalRenderVisiblePageRange.startPageIndex,
+        observedVisiblePageRange.startPageIndex
+      ),
+      endPageIndex: Math.max(
+        internalRenderVisiblePageRange.endPageIndex,
+        observedVisiblePageRange.endPageIndex
+      )
+    };
+  }, [
+    hasLargeTableLayoutSurface,
+    internalRenderVisiblePageRange,
+    observedVisiblePageRange
+  ]);
+  const effectiveVisiblePageRange = visiblePageRange ?? internalEffectiveRenderVisiblePageRange ?? observedVisiblePageRange ?? (internalPageVirtualizationPending ? {
     startPageIndex: 0,
     endPageIndex: Math.min(
       pageCount - 1,
@@ -31001,6 +31629,43 @@ function DocxEditorViewer({
     }
     return indexes;
   }, [pageCount, visiblePageEndIndex, visiblePageStartIndex]);
+  React.useLayoutEffect(() => {
+    if (typeof window === "undefined") {
+      return;
+    }
+    setMeasuredParagraphOuterHeightsPxByNodeIndex((current) => {
+      const next = new Map(current);
+      let changed = false;
+      paragraphElementsRef.current.forEach((element, nodeIndex) => {
+        if (!element.isConnected || element.dataset.docxParagraphPartialLineRange === "true" || element.closest('[data-docx-header-footer-region="footer"]') || element.closest('[data-docx-header-footer-region="header"]')) {
+          return;
+        }
+        const rect = element.getBoundingClientRect();
+        if (rect.width <= 0 && rect.height <= 0) {
+          return;
+        }
+        const style2 = window.getComputedStyle(element);
+        const marginTop = Number.parseFloat(style2.marginTop || "0");
+        const marginBottom = Number.parseFloat(style2.marginBottom || "0");
+        const outerHeightPx = Math.max(
+          1,
+          Math.round(
+            rect.height + (Number.isFinite(marginTop) ? marginTop : 0) + (Number.isFinite(marginBottom) ? marginBottom : 0)
+          )
+        );
+        if (next.get(nodeIndex) !== outerHeightPx) {
+          next.set(nodeIndex, outerHeightPx);
+          changed = true;
+        }
+      });
+      return changed ? next : current;
+    });
+  }, [
+    editor.documentLoadNonce,
+    pageNodeSegmentIdentityKeysByPage,
+    visiblePageEndIndex,
+    visiblePageStartIndex
+  ]);
   const visibleTableRowIndexesByNodeIndex = React.useMemo(() => {
     const rowsByNodeIndex = /* @__PURE__ */ new Map();
     const addRowIndex = (nodeIndex, rowIndex) => {
@@ -31075,7 +31740,8 @@ function DocxEditorViewer({
     tableMeasuredRowHeights,
     visiblePageIndexes
   ]);
-  const visiblePagesNeedMeasurementUnlock = !hideDocumentUntilPaginationSettled && visiblePagesHavePendingPaginationMeasurements;
+  const allowPostImportPaginationMeasurement = !hasLargeTableLayoutSurface || !internalPageVirtualizationEnabled;
+  const visiblePagesNeedMeasurementUnlock = !hideDocumentUntilPaginationSettled && allowPostImportPaginationMeasurement && visiblePagesHavePendingPaginationMeasurements;
   React.useEffect(() => {
     if (!visiblePagesNeedMeasurementUnlock) {
       return;
@@ -41047,11 +41713,17 @@ function DocxEditorViewer({
       } : void 0,
       outline: "none"
     };
-    const fallbackParagraphRuns = renderInteractiveParagraphRuns(
-      paragraph,
-      `body-cell-${tableIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
-      location
-    );
+    let fallbackParagraphRuns;
+    const getFallbackParagraphRuns = () => {
+      if (fallbackParagraphRuns === void 0) {
+        fallbackParagraphRuns = renderInteractiveParagraphRuns(
+          paragraph,
+          `body-cell-${tableIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
+          location
+        );
+      }
+      return fallbackParagraphRuns;
+    };
     const renderedInteractiveParagraphContent = shouldRenderParagraphSegmentWithPretext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
@@ -41089,11 +41761,11 @@ function DocxEditorViewer({
             style: {
               transform: `translateY(-${paragraphSegmentTranslateYPx - paragraphSegmentClipBleedTopPx}px)`
             },
-            children: fallbackParagraphRuns
+            children: getFallbackParagraphRuns()
           }
         )
       }
-    ) : fallbackParagraphRuns;
+    ) : getFallbackParagraphRuns();
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
@@ -41335,6 +42007,7 @@ function DocxEditorViewer({
           ...resolvedAfterSpacingPx !== void 0 ? { marginBottom: resolvedAfterSpacingPx } : void 0
         } : void 0,
         ...letterheadStyleAdjustments ?? void 0,
+        ...options?.normalizeParagraphHostFontSize ? { fontSize: `${paragraphBaseFontSizePx(node)}px` } : void 0,
         ...options?.suppressLetterheadColumnLayout && options?.isFirstInLetterheadColumn ? { marginTop: 0 } : void 0,
         ...pageAbsoluteAnchorOnlyParagraph ? {
           position: "relative",
@@ -41353,19 +42026,25 @@ function DocxEditorViewer({
         } : void 0,
         outline: "none"
       };
-      const fallbackParagraphRuns = renderInteractiveParagraphRuns(
-        node,
-        `node-${nodeIndex}`,
-        {
-          kind: "paragraph",
-          nodeIndex
-        },
-        {
-          pageFlowTopPx: paragraphPageFlowTopPx,
-          pageLayout: resolvedPageLayout,
-          suppressLikelyFullPageCoverImageKeys: options?.suppressLikelyFullPageCoverImageKeys
+      let fallbackParagraphRuns;
+      const getFallbackParagraphRuns = () => {
+        if (fallbackParagraphRuns === void 0) {
+          fallbackParagraphRuns = renderInteractiveParagraphRuns(
+            node,
+            `node-${nodeIndex}`,
+            {
+              kind: "paragraph",
+              nodeIndex
+            },
+            {
+              pageFlowTopPx: paragraphPageFlowTopPx,
+              pageLayout: resolvedPageLayout,
+              suppressLikelyFullPageCoverImageKeys: options?.suppressLikelyFullPageCoverImageKeys
+            }
+          );
         }
-      );
+        return fallbackParagraphRuns;
+      };
       const renderedInteractiveParagraphContent = shouldRenderParagraphSegmentWithPretext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "div",
         {
@@ -41406,11 +42085,11 @@ function DocxEditorViewer({
               style: {
                 transform: `translateY(-${paragraphSegmentTranslateYPx - paragraphSegmentClipBleedTopPx}px)`
               },
-              children: fallbackParagraphRuns
+              children: getFallbackParagraphRuns()
             }
           )
         }
-      ) : fallbackParagraphRuns;
+      ) : getFallbackParagraphRuns();
       const paragraphDraftHtml = paragraphDraftsRef.current.get(nodeIndex);
       const renderedEditableParagraphHtml = typeof paragraphDraftHtml === "string" ? paragraphDraftHtml : renderStaticHtml(renderedInteractiveParagraphContent);
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -41421,6 +42100,7 @@ function DocxEditorViewer({
           "data-docx-paragraph-node-index": nodeIndex,
           "data-docx-paragraph-start-line": paragraphSegmentStartLine,
           "data-docx-paragraph-end-line": paragraphSegmentEndLine,
+          "data-docx-paragraph-partial-line-range": hasPartialLineRange ? "true" : void 0,
           style: paragraphStyle,
           dangerouslySetInnerHTML: editable ? {
             __html: renderedEditableParagraphHtml
@@ -42458,6 +43138,68 @@ ${currentText.slice(end)}`;
                           })() : void 0;
                           const tableCellDraftHtml = tableCellDraftsRef.current.get(cellDraftKey);
                           const renderedEditableCellHtml = editableCell ? typeof tableCellDraftHtml === "string" ? tableCellDraftHtml : renderStaticHtml(renderedEditableCellContent) : void 0;
+                          const renderStaticCellContent = () => {
+                            let paragraphCursor = 0;
+                            return cell.nodes.map(
+                              (cellContent, contentIndex) => {
+                                if (cellContent.type === "paragraph") {
+                                  const paragraphIndex = paragraphCursor;
+                                  paragraphCursor += 1;
+                                  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                    "div",
+                                    {
+                                      "data-docx-paragraph-host": "true",
+                                      "data-docx-paragraph-kind": "table-cell",
+                                      "data-docx-table-index": nodeIndex,
+                                      "data-docx-row-index": rowIndex,
+                                      "data-docx-cell-index": cellIndex,
+                                      "data-docx-paragraph-index": paragraphIndex,
+                                      "data-docx-table-paragraph-index": paragraphIndex,
+                                      style: tableCellParagraphBlockStyle(
+                                        cellContent,
+                                        editor.model.metadata.numberingDefinitions,
+                                        headingStyles,
+                                        paragraphIndex,
+                                        applyWordTableDefaults,
+                                        nodeDocGridLinePitchPx
+                                      ),
+                                      children: renderInteractiveParagraphRuns(
+                                        cellContent,
+                                        `body-cell-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
+                                        {
+                                          kind: "table-cell",
+                                          tableIndex: nodeIndex,
+                                          rowIndex,
+                                          cellIndex,
+                                          paragraphIndex
+                                        }
+                                      )
+                                    },
+                                    `body-cell-p-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`
+                                  );
+                                }
+                                return renderHeaderNode(
+                                  cellContent,
+                                  `body-cell-nested-table-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
+                                  documentContentTheme,
+                                  editor.model.metadata.numberingDefinitions,
+                                  headingStyles,
+                                  spannedWidthPx > 0 ? spannedWidthPx : void 0,
+                                  scrollToBookmark,
+                                  void 0,
+                                  void 0,
+                                  void 0,
+                                  void 0,
+                                  paragraphRunRenderOptions,
+                                  void 0,
+                                  void 0,
+                                  tableCellEditScope,
+                                  void 0,
+                                  embeddedTableResizeController
+                                );
+                              }
+                            );
+                          };
                           return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                             "td",
                             {
@@ -43343,68 +44085,27 @@ ${currentText.slice(end)}`;
                                     );
                                   })
                                 }
-                              ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { display: "grid", gap: 4 }, children: (() => {
-                                let paragraphCursor = 0;
-                                return cell.nodes.map(
-                                  (cellContent, contentIndex) => {
-                                    if (cellContent.type === "paragraph") {
-                                      const paragraphIndex = paragraphCursor;
-                                      paragraphCursor += 1;
-                                      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                                        "div",
-                                        {
-                                          "data-docx-paragraph-host": "true",
-                                          "data-docx-paragraph-kind": "table-cell",
-                                          "data-docx-table-index": nodeIndex,
-                                          "data-docx-row-index": rowIndex,
-                                          "data-docx-cell-index": cellIndex,
-                                          "data-docx-paragraph-index": paragraphIndex,
-                                          "data-docx-table-paragraph-index": paragraphIndex,
-                                          style: tableCellParagraphBlockStyle(
-                                            cellContent,
-                                            editor.model.metadata.numberingDefinitions,
-                                            headingStyles,
-                                            paragraphIndex,
-                                            applyWordTableDefaults,
-                                            nodeDocGridLinePitchPx
-                                          ),
-                                          children: renderInteractiveParagraphRuns(
-                                            cellContent,
-                                            `body-cell-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
-                                            {
-                                              kind: "table-cell",
-                                              tableIndex: nodeIndex,
-                                              rowIndex,
-                                              cellIndex,
-                                              paragraphIndex
-                                            }
-                                          )
-                                        },
-                                        `body-cell-p-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`
-                                      );
+                              ) : isSlicedRow && slicedCellViewportHeightPx ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                "div",
+                                {
+                                  style: {
+                                    height: slicedCellViewportHeightPx,
+                                    overflow: "hidden",
+                                    position: "relative"
+                                  },
+                                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                    "div",
+                                    {
+                                      style: {
+                                        display: "grid",
+                                        gap: 0,
+                                        transform: `translateY(-${tableRowSliceOffsetPx}px)`
+                                      },
+                                      children: renderStaticCellContent()
                                     }
-                                    return renderHeaderNode(
-                                      cellContent,
-                                      `body-cell-nested-table-${nodeIndex}-${rowIndex}-${cellIndex}-${contentIndex}`,
-                                      documentContentTheme,
-                                      editor.model.metadata.numberingDefinitions,
-                                      headingStyles,
-                                      spannedWidthPx > 0 ? spannedWidthPx : void 0,
-                                      scrollToBookmark,
-                                      void 0,
-                                      void 0,
-                                      void 0,
-                                      void 0,
-                                      paragraphRunRenderOptions,
-                                      void 0,
-                                      void 0,
-                                      tableCellEditScope,
-                                      void 0,
-                                      embeddedTableResizeController
-                                    );
-                                  }
-                                );
-                              })() })
+                                  )
+                                }
+                              ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { display: "grid", gap: 0 }, children: renderStaticCellContent() })
                             },
                             `cell-${nodeIndex}-${rowIndex}-${cellIndex}`
                           );
@@ -44463,8 +45164,11 @@ ${currentText.slice(end)}`;
     () => new Map(endnotes.map((note) => [note.id, note])),
     [endnotes]
   );
-  const pageFootnotesByIndex = React.useMemo(
-    () => pageNodeSegmentsByPage.map((nodeSegments) => {
+  const pageFootnotesByIndex = React.useMemo(() => {
+    if (footnotes.length === 0) {
+      return pageNodeSegmentsByPage.map(() => []);
+    }
+    return pageNodeSegmentsByPage.map((nodeSegments) => {
       const referencedIds = [];
       const seen = /* @__PURE__ */ new Set();
       nodeSegments.forEach((segment) => {
@@ -44486,10 +45190,17 @@ ${currentText.slice(end)}`;
         });
       });
       return referencedIds.map((referenceId) => footnotesById.get(referenceId)).filter((note) => Boolean(note));
-    }),
-    [editor.model.nodes, footnotesById, pageNodeSegmentsByPage]
-  );
+    });
+  }, [
+    editor.model.nodes,
+    footnotes.length,
+    footnotesById,
+    pageNodeSegmentsByPage
+  ]);
   const referencedEndnotes = React.useMemo(() => {
+    if (endnotes.length === 0) {
+      return endnotes;
+    }
     const referencedIds = [];
     const seen = /* @__PURE__ */ new Set();
     editor.model.nodes.forEach((node) => {
@@ -44696,6 +45407,35 @@ ${currentText.slice(end)}`;
             children: "Drop .docx anywhere to replace current document"
           }
         ) : null,
+        editor.importError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            role: "alert",
+            "data-docx-import-error": "true",
+            style: {
+              position: "absolute",
+              top: 24,
+              left: "50%",
+              transform: "translateX(-50%)",
+              zIndex: 80,
+              width: "min(520px, calc(100% - 32px))",
+              display: "grid",
+              gap: 6,
+              padding: "12px 14px",
+              borderRadius: 8,
+              border: `1px solid ${editor.documentTheme === "dark" ? "rgba(248, 113, 113, 0.42)" : "rgba(185, 28, 28, 0.26)"}`,
+              backgroundColor: editor.documentTheme === "dark" ? "rgba(69, 10, 10, 0.96)" : "rgba(254, 242, 242, 0.98)",
+              color: editor.documentTheme === "dark" ? "#fee2e2" : "#7f1d1d",
+              boxShadow: editor.documentTheme === "dark" ? "0 12px 28px rgba(2, 6, 23, 0.44)" : "0 12px 28px rgba(127, 29, 29, 0.12)",
+              fontSize: 13,
+              lineHeight: 1.35
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { style: { fontWeight: 600 }, children: "Failed to load DOCX" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { overflowWrap: "anywhere" }, children: editor.importError.message })
+            ]
+          }
+        ) : null,
         tableMoveDropPreview && !isReadOnly ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "div",
           {
@@ -44719,6 +45459,7 @@ ${currentText.slice(end)}`;
           const pageVisible = isPageVisible(pageIndex);
           const pageWrapperWidthPx = showTrackedChangeGutter ? pageLayout.pageWidthPx + TRACKED_CHANGE_GUTTER_WIDTH_PX : pageLayout.pageWidthPx;
           if (!pageVisible) {
+            const placeholderBackgroundColor = pageBackgroundColor ?? editor.model.metadata.documentBackgroundColor ?? pageSurfaceBaseStyle.backgroundColor;
             return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
               "div",
               {
@@ -44736,8 +45477,12 @@ ${currentText.slice(end)}`;
                     "data-docx-page-placeholder": "true",
                     ref: pagePlaceholderRefForIndex(pageIndex),
                     style: {
+                      ...pageSurfaceBaseStyle,
                       height: pageLayout.pageHeightPx,
-                      width: pageLayout.pageWidthPx
+                      minHeight: pageLayout.pageHeightPx,
+                      width: pageLayout.pageWidthPx,
+                      backgroundColor: placeholderBackgroundColor,
+                      pointerEvents: "none"
                     }
                   }
                 )
@@ -45195,6 +45940,14 @@ ${currentText.slice(end)}`;
                                   }
                                 );
                                 const explicitColumnWidthsPx = sectionColumns && sectionColumns.widthsPx?.length === sectionColumns.count ? sectionColumns.widthsPx : void 0;
+                                const flowSegmentsHaveExplicitColumnBreak = flowSegments.some((segment) => {
+                                  if (segment.tableRowRange) {
+                                    return false;
+                                  }
+                                  const segmentNode = editor.model.nodes[segment.nodeIndex];
+                                  return segmentNode?.type === "paragraph" && paragraphHasExplicitColumnBreak(segmentNode);
+                                });
+                                const canUseColumnLineSplitRender = flowSegments.length > 0 && !flowSegmentsHaveExplicitColumnBreak;
                                 const renderSegmentInColumn = (columnSegment, columnContentWidthPx) => {
                                   const columnNode = editor.model.nodes[columnSegment.nodeIndex];
                                   if (!columnNode) {
@@ -45226,7 +45979,8 @@ ${currentText.slice(end)}`;
                                                     suppressParagraphElementTracking: segmentIndex > 0,
                                                     syntheticKeySuffix: `column-break-${segmentIndex}`,
                                                     overrideBeforeSpacingPx: segmentIndex === 0 ? void 0 : 0,
-                                                    overrideAfterSpacingPx: isLastSegment ? void 0 : 0
+                                                    overrideAfterSpacingPx: isLastSegment ? void 0 : 0,
+                                                    normalizeParagraphHostFontSize: true
                                                   }
                                                 )
                                               },
@@ -45247,7 +46001,8 @@ ${currentText.slice(end)}`;
                                     {
                                       pageLayout,
                                       contentWidthPxOverride: columnContentWidthPx,
-                                      suppressLikelyFullPageCoverImageKeys: suppressedLikelyFullPageCoverImageKeys
+                                      suppressLikelyFullPageCoverImageKeys: suppressedLikelyFullPageCoverImageKeys,
+                                      normalizeParagraphHostFontSize: true
                                     }
                                   );
                                   const segmentKeySuffix = columnSegment.tableRowRange ? `rows-${columnSegment.tableRowRange.startRowIndex}-${columnSegment.tableRowRange.endRowIndex}${columnSegment.tableRowSlice ? `-slice-${Math.max(
@@ -45286,7 +46041,91 @@ ${currentText.slice(end)}`;
                                   "div",
                                   {
                                     style: { position: "relative" },
-                                    children: explicitColumnWidthsPx && explicitColumnWidthsPx.length === 2 && flowSegments.length > 0 ? (() => {
+                                    children: canUseColumnLineSplitRender ? (() => {
+                                      const columnWidthsPx = explicitColumnWidthsPx && explicitColumnWidthsPx.length === sectionColumns.count ? explicitColumnWidthsPx : (() => {
+                                        const inferredColumnWidthPx = Math.max(
+                                          120,
+                                          Math.round(
+                                            (pageContentWidthPx - sectionColumns.gapPx * Math.max(
+                                              0,
+                                              sectionColumns.count - 1
+                                            )) / Math.max(1, sectionColumns.count)
+                                          )
+                                        );
+                                        return Array.from(
+                                          { length: sectionColumns.count },
+                                          () => inferredColumnWidthPx
+                                        );
+                                      })();
+                                      const columnSegments = buildRenderColumnSegmentsForPageSection(
+                                        editor.model,
+                                        flowSegments,
+                                        columnWidthsPx,
+                                        pageBodyAvailableHeightPx,
+                                        editor.model.metadata.numberingDefinitions,
+                                        docGridLinePitchPxByNodeIndex,
+                                        measuredParagraphOuterHeightsPxByNodeIndex,
+                                        isLastPage
+                                      );
+                                      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+                                        overlaySegments.map((overlaySegment) => {
+                                          const overlayNode = editor.model.nodes[overlaySegment.nodeIndex];
+                                          if (!overlayNode) {
+                                            return null;
+                                          }
+                                          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                            React.Fragment,
+                                            {
+                                              children: renderDocumentNode(
+                                                overlayNode,
+                                                overlaySegment.nodeIndex,
+                                                overlaySegment.tableRowRange,
+                                                overlaySegment.tableRowSlice,
+                                                overlaySegment.paragraphLineRange,
+                                                {
+                                                  pageLayout,
+                                                  suppressLikelyFullPageCoverImageKeys: suppressedLikelyFullPageCoverImageKeys
+                                                }
+                                              )
+                                            },
+                                            `column-layout-overlay-${pageIndex}-${overlaySegment.nodeIndex}-${segmentIdentityKey(
+                                              overlaySegment
+                                            )}`
+                                          );
+                                        }),
+                                        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                          "div",
+                                          {
+                                            style: {
+                                              display: "grid",
+                                              gridTemplateColumns: columnWidthsPx.map((widthPx) => `${widthPx}px`).join(" "),
+                                              columnGap: sectionColumns.gapPx,
+                                              alignItems: "start",
+                                              minHeight: pageBodyAvailableHeightPx,
+                                              position: "relative",
+                                              zIndex: 1
+                                            },
+                                            children: columnSegments.map(
+                                              (segmentsForColumn, columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                                                "div",
+                                                {
+                                                  style: {
+                                                    minHeight: pageBodyAvailableHeightPx
+                                                  },
+                                                  children: segmentsForColumn.map(
+                                                    (segment) => renderSegmentInColumn(
+                                                      segment,
+                                                      columnWidthsPx[columnIndex]
+                                                    )
+                                                  )
+                                                },
+                                                `column-layout-flow-${pageIndex}-${groupIndex}-${columnIndex}`
+                                              )
+                                            )
+                                          }
+                                        )
+                                      ] });
+                                    })() : explicitColumnWidthsPx && explicitColumnWidthsPx.length === 2 && flowSegments.length > 0 ? (() => {
                                       const [leftColumnWidthPx, rightColumnWidthPx] = explicitColumnWidthsPx;
                                       const prefixHeightsPx = new Array(
                                         flowSegments.length + 1
@@ -47600,6 +48439,7 @@ function buildDocumentPageNodeSegments2(model, pageContentHeightPx, pageContentW
       );
     }
     let rowStartIndex = 0;
+    let tableBreakStartRowCursor = 0;
     while (rowStartIndex < estimatedRowHeightsPx.length) {
       const remainingHeightPx = Math.max(0, currentPageContentHeightPx - pageConsumedHeightPx);
       const fittedRowEndIndex = fitTableRowsWithinHeightPx2(
@@ -47611,9 +48451,10 @@ function buildDocumentPageNodeSegments2(model, pageContentHeightPx, pageContentW
         pageOverflowTolerancePx
       );
       let rowEndIndex = fittedRowEndIndex;
-      const forcedBreakRowIndex = tableBreakStartRows.find(
-        (breakRowIndex) => breakRowIndex > rowStartIndex
-      );
+      while (tableBreakStartRowCursor < tableBreakStartRows.length && tableBreakStartRows[tableBreakStartRowCursor] <= rowStartIndex) {
+        tableBreakStartRowCursor += 1;
+      }
+      const forcedBreakRowIndex = tableBreakStartRows[tableBreakStartRowCursor];
       if (forcedBreakRowIndex !== void 0) {
         rowEndIndex = Math.min(rowEndIndex, forcedBreakRowIndex);
       }