@json-to-office/core-docx 7.0.1 → 7.2.0

package/dist/index.js

@@ -1810,15 +1810,15 @@ function convertLineSpacing(lineSpacing) {
       lineRule2 = "auto";
       break;
     case "atLeast":
-      line = value !== void 0 ? value * TWIPS_PER_POINT : void 0;
+      line = value !== void 0 ? pointsToTwips(value) : void 0;
       lineRule2 = "atLeast";
       break;
     case "exactly":
-      line = value !== void 0 ? value * TWIPS_PER_POINT : void 0;
+      line = value !== void 0 ? pointsToTwips(value) : void 0;
       lineRule2 = "exact";
       break;
     case "multiple":
-      line = value !== void 0 ? value * SINGLE_LINE_SPACING_TWIPS : void 0;
+      line = value !== void 0 ? Math.round(value * SINGLE_LINE_SPACING_TWIPS) : void 0;
       lineRule2 = "auto";
       break;
     default:
@@ -2014,6 +2014,7 @@ var init_layoutUtils = __esm({
       if (themeConfig?.page) {
         const margins = themeConfig.page.margins || {};
         const dimensions = getPageDimensions(themeConfig.page.size);
+        const gutter = margins.gutter;
         return {
           size: {
             width: dimensions.width,
@@ -2024,7 +2025,13 @@ var init_layoutUtils = __esm({
             top: margins.top ?? defaultMargins.top ?? 1440,
             right: margins.right ?? defaultMargins.right ?? 1440,
             bottom: margins.bottom ?? defaultMargins.bottom ?? 1440,
-            left: margins.left ?? defaultMargins.left ?? 1440
+            left: margins.left ?? defaultMargins.left ?? 1440,
+            // How far the running head and foot sit from the page edge. Left out,
+            // each renderer writes its own default — docx.js 708, office-open 851
+            // and 992 — in place of the distance the theme states.
+            header: margins.header ?? defaultMargins.header ?? 720,
+            footer: margins.footer ?? defaultMargins.footer ?? 720,
+            ...gutter !== void 0 && { gutter }
           }
         };
       }
@@ -2040,50 +2047,15 @@ var init_layoutUtils = __esm({
           top: defaultMargins.top ?? 1440,
           right: defaultMargins.right ?? 1440,
           bottom: defaultMargins.bottom ?? 1440,
-          left: defaultMargins.left ?? 1440
+          left: defaultMargins.left ?? 1440,
+          header: defaultMargins.header ?? 720,
+          footer: defaultMargins.footer ?? 720
         }
       };
     };
   }
 });
 
-// src/utils/generationContext.ts
-import { AsyncLocalStorage } from "async_hooks";
-import { isAbsolute, resolve } from "path";
-function runWithBaseDir(baseDir, callback) {
-  return baseDir === void 0 ? callback() : baseDirStorage.run(resolve(baseDir), callback);
-}
-function resolveFromBaseDir(filePath) {
-  const base = baseDirStorage.getStore();
-  if (!base || isAbsolute(filePath)) return filePath;
-  return resolve(base, filePath);
-}
-function runWithWarnings(warnings, callback) {
-  return warnings === void 0 ? callback() : warningsStorage.run(warnings, callback);
-}
-function reportWarning(component, code, message, context) {
-  const warnings = warningsStorage.getStore();
-  if (warnings) {
-    warnings.push({
-      component,
-      message,
-      severity: "warning",
-      context: { code, ...context }
-    });
-    return;
-  }
-  console.warn(`[json-to-docx] [${code}] ${message}`);
-}
-var generationDateStorage, baseDirStorage, warningsStorage;
-var init_generationContext = __esm({
-  "src/utils/generationContext.ts"() {
-    "use strict";
-    generationDateStorage = new AsyncLocalStorage();
-    baseDirStorage = new AsyncLocalStorage();
-    warningsStorage = new AsyncLocalStorage();
-  }
-});
-
 // src/themes/json/parser.ts
 import { validateThemeJson } from "@json-to-office/shared-docx/validation/unified";
 var ThemeValidationError, ThemeParseError, ThemeParser;
@@ -2416,7 +2388,8 @@ function getAvailableWidthTwips(theme, themeName) {
   const width = page?.size?.width || 0;
   const left = page?.margin?.left || 0;
   const right = page?.margin?.right || 0;
-  return Math.max(0, width - left - right);
+  const gutter = page?.margin?.gutter || 0;
+  return Math.max(0, width - left - right - gutter);
 }
 function getPageWidthTwips(theme, themeName) {
   const page = getPageSetup(theme, themeName);
@@ -2451,6 +2424,13 @@ function resolveOffsetTwips(value, referenceTwips) {
   }
   return Math.round(referenceTwips * parseFloat(match[1]) / 100);
 }
+function splitTwips(count, totalTwips) {
+  const edge = (index) => Math.round(totalTwips * index / count);
+  return Array.from(
+    { length: count },
+    (_, index) => edge(index + 1) - edge(index)
+  );
+}
 function relativeLengthToTwips(value, availableWidthTwips) {
   if (typeof value === "number") {
     return pointsToTwips(value);
@@ -2467,6 +2447,43 @@ var init_widthUtils = __esm({
   }
 });
 
+// src/utils/generationContext.ts
+import { AsyncLocalStorage } from "async_hooks";
+import { isAbsolute, resolve } from "path";
+function runWithBaseDir(baseDir, callback) {
+  return baseDir === void 0 ? callback() : baseDirStorage.run(resolve(baseDir), callback);
+}
+function resolveFromBaseDir(filePath) {
+  const base = baseDirStorage.getStore();
+  if (!base || isAbsolute(filePath)) return filePath;
+  return resolve(base, filePath);
+}
+function runWithWarnings(warnings, callback) {
+  return warnings === void 0 ? callback() : warningsStorage.run(warnings, callback);
+}
+function reportWarning(component, code, message, context) {
+  const warnings = warningsStorage.getStore();
+  if (warnings) {
+    warnings.push({
+      component,
+      message,
+      severity: "warning",
+      context: { code, ...context }
+    });
+    return;
+  }
+  console.warn(`[json-to-docx] [${code}] ${message}`);
+}
+var generationDateStorage, baseDirStorage, warningsStorage;
+var init_generationContext = __esm({
+  "src/utils/generationContext.ts"() {
+    "use strict";
+    generationDateStorage = new AsyncLocalStorage();
+    baseDirStorage = new AsyncLocalStorage();
+    warningsStorage = new AsyncLocalStorage();
+  }
+});
+
 // src/utils/imageUtils.ts
 import { readFileSync } from "fs";
 import { availableParallelism } from "os";
@@ -2762,7 +2779,7 @@ var init_imageUtils = __esm({
 });
 
 // src/ir/types.ts
-var TWIPS_PER_INCH, TWIPS_PER_POINT2, EMU_PER_INCH, EMU_PER_TWIP, DOCX_IR_SCHEMA_VERSION;
+var TWIPS_PER_INCH, TWIPS_PER_POINT2, EMU_PER_INCH, EMU_PER_TWIP, DOCX_IR_SCHEMA_VERSION, DOCX_IR_BORDER_STYLES;
 var init_types = __esm({
   "src/ir/types.ts"() {
     "use strict";
@@ -2771,6 +2788,35 @@ var init_types = __esm({
     EMU_PER_INCH = 914400;
     EMU_PER_TWIP = EMU_PER_INCH / TWIPS_PER_INCH;
     DOCX_IR_SCHEMA_VERSION = 1;
+    DOCX_IR_BORDER_STYLES = [
+      "single",
+      "dashDotStroked",
+      "dashed",
+      "dashSmallGap",
+      "dotDash",
+      "dotDotDash",
+      "dotted",
+      "double",
+      "doubleWave",
+      "inset",
+      "nil",
+      "none",
+      "outset",
+      "thick",
+      "thickThinLargeGap",
+      "thickThinMediumGap",
+      "thickThinSmallGap",
+      "thinThickLargeGap",
+      "thinThickMediumGap",
+      "thinThickSmallGap",
+      "thinThickThinLargeGap",
+      "thinThickThinMediumGap",
+      "thinThickThinSmallGap",
+      "threeDEmboss",
+      "threeDEngrave",
+      "triple",
+      "wave"
+    ];
   }
 });
 
@@ -2779,6 +2825,9 @@ import { createHash as createHash2 } from "crypto";
 function pointsToTwips2(points) {
   return Math.round(points * TWIPS_PER_POINT2);
 }
+function wholeTwips(twips2) {
+  return Math.round(twips2);
+}
 function pointsToHalfPoints(points) {
   return Math.round(points * 2);
 }
@@ -2794,8 +2843,8 @@ function inchesToEmu(inches) {
 function pointsToEmu(points) {
   return Math.round(points * EMU_PER_INCH / 72);
 }
-function twipsToEmu(twips) {
-  return Math.round(twips * EMU_PER_TWIP);
+function twipsToEmu(twips2) {
+  return Math.round(twips2 * EMU_PER_TWIP);
 }
 function pixelsToEmu(pixels) {
   return Math.round(pixels * 9525);
@@ -2803,8 +2852,8 @@ function pixelsToEmu(pixels) {
 function emuToPixels(emu) {
   return emu / 9525;
 }
-function twipsToPixels(twips) {
-  return twips / TWIPS_PER_INCH * 96;
+function twipsToPixels(twips2) {
+  return twips2 / TWIPS_PER_INCH * 96;
 }
 function irColor(hex) {
   return { hex: hex.startsWith("#") ? hex.slice(1) : hex };
@@ -2830,7 +2879,6 @@ import {
   AlignmentType,
   BookmarkEnd,
   BookmarkStart,
-  BorderStyle,
   ColumnBreak,
   CommentRangeEnd,
   CommentRangeStart,
@@ -3276,7 +3324,8 @@ function emitTable(block2, resources = /* @__PURE__ */ new Map()) {
     },
     layout: block2.layout === "fixed" ? TableLayoutType.FIXED : TableLayoutType.AUTOFIT,
     // An empty grid is a table with nothing to say about its columns, which is
-    // not the same as one whose columns are all zero wide.
+    // not the same as one whose columns are all zero wide. The compiler hands
+    // over every grid in twips, the unit `columnWidths` takes.
     ...block2.columnGrid.values.length > 0 ? { columnWidths: block2.columnGrid.values } : {},
     ...block2.borders ? {
       borders: {
@@ -3370,7 +3419,10 @@ function emitTableCell(cell, resources) {
 function emitBorder(border3) {
   if (!border3) return void 0;
   return {
-    style: BORDER_STYLE[border3.style] ?? BorderStyle.SINGLE,
+    // Already OOXML's word, and docx.js's `BorderStyle` values are exactly
+    // those words. Mapping unknown ones to `single` here is what once hid an
+    // authoring word the IR should never have carried.
+    style: border3.style,
     size: border3.sizeEighthPoints ?? 0,
     color: border3.color?.hex ?? "000000",
     // Stated only when the IR states it, so every border that predates the
@@ -3379,7 +3431,7 @@ function emitBorder(border3) {
     ...border3.spacePoints !== void 0 ? { space: border3.spacePoints } : {}
   };
 }
-var ALIGNMENT2, PAGE_FIELDS, isSequenceField, WRAP_TYPE, ThemedTableOfContents, VERTICAL_ALIGN, TABLE_ANCHOR, HORIZONTAL_POSITION, VERTICAL_POSITION, BORDER_STYLE;
+var ALIGNMENT2, PAGE_FIELDS, isSequenceField, WRAP_TYPE, ThemedTableOfContents, VERTICAL_ALIGN, TABLE_ANCHOR, HORIZONTAL_POSITION, VERTICAL_POSITION;
 var init_emit = __esm({
   "src/renderers/docxjs/emit.ts"() {
     "use strict";
@@ -3428,20 +3480,10 @@ var init_emit = __esm({
       inside: RelativeVerticalPosition.INSIDE,
       outside: RelativeVerticalPosition.OUTSIDE
     };
-    BORDER_STYLE = {
-      none: BorderStyle.NONE,
-      single: BorderStyle.SINGLE,
-      double: BorderStyle.DOUBLE,
-      dashed: BorderStyle.DASHED,
-      dotted: BorderStyle.DOTTED
-    };
   }
 });
 
 // src/renderers/docxjs/styles.ts
-import {
-  BorderStyle as BorderStyle2
-} from "docx";
 function runProperties(formatting) {
   const out = {};
   if (formatting.fontFamily !== void 0) out.font = formatting.fontFamily;
@@ -3450,7 +3492,7 @@ function runProperties(formatting) {
   }
   if (formatting.color) out.color = formatting.color.hex;
   if (formatting.bold !== void 0) out.bold = formatting.bold;
-  if (formatting.italic !== void 0) out.italic = formatting.italic;
+  if (formatting.italic !== void 0) out.italics = formatting.italic;
   if (formatting.underline) {
     out.underline = {
       type: formatting.underline.type,
@@ -3462,7 +3504,9 @@ function runProperties(formatting) {
   if (formatting.subScript) out.subScript = true;
   if (formatting.smallCaps !== void 0) out.smallCaps = formatting.smallCaps;
   if (formatting.allCaps !== void 0) out.allCaps = formatting.allCaps;
-  if (formatting.highlight !== void 0) out.highlight = formatting.highlight;
+  if (formatting.highlight !== void 0) {
+    out.highlight = formatting.highlight;
+  }
   if (formatting.characterSpacingTwentieths !== void 0) {
     out.characterSpacing = formatting.characterSpacingTwentieths;
   }
@@ -3476,7 +3520,10 @@ function runProperties(formatting) {
 }
 function border(value) {
   return {
-    style: BORDER_STYLE2[value.style] ?? BorderStyle2.SINGLE,
+    // OOXML's word, which is what docx.js's `BorderStyle` values are. A theme
+    // may state any of them; mapping the unlisted ones to `single` drew a
+    // `wave` or `triple` rule as a plain line here and as asked on office-open.
+    style: value.style,
     ...value.sizeEighthPoints !== void 0 ? { size: value.sizeEighthPoints } : {},
     ...value.color ? { color: value.color.hex } : {},
     ...value.spacePoints !== void 0 ? { space: value.spacePoints } : {}
@@ -3589,19 +3636,10 @@ function emitStyles(styles) {
     }
   };
 }
-var BORDER_STYLE2;
 var init_styles2 = __esm({
   "src/renderers/docxjs/styles.ts"() {
     "use strict";
     init_emit();
-    BORDER_STYLE2 = {
-      none: BorderStyle2.NONE,
-      single: BorderStyle2.SINGLE,
-      double: BorderStyle2.DOUBLE,
-      dashed: BorderStyle2.DASHED,
-      dotted: BorderStyle2.DOTTED,
-      thick: BorderStyle2.THICK
-    };
   }
 });
 
@@ -3780,7 +3818,7 @@ import {
   Header,
   ImageRun,
   Packer,
-  LineRuleType as LineRuleType2,
+  LineRuleType,
   Paragraph as Paragraph2
 } from "docx";
 function createDocxJsRenderer() {
@@ -4067,7 +4105,7 @@ function lastBlockIsFrame(section2) {
 function anchorParagraph(anchor) {
   return new Paragraph2({
     children: anchor ? [anchor] : [],
-    spacing: { before: 0, after: 0, line: 20, lineRule: LineRuleType2.EXACT }
+    spacing: { before: 0, after: 0, line: 20, lineRule: LineRuleType.EXACT }
   });
 }
 function coreProperties(ir) {
@@ -4240,11 +4278,71 @@ var init_chartParts = __esm({
   }
 });
 
+// src/renderers/office-open/cellTocs.ts
+function spliceCellTocs(zip, tocs, stringifyTableOfContents) {
+  if (tocs.length === 0) return;
+  const spliced = /* @__PURE__ */ new Set();
+  for (const entry of zip.getEntries()) {
+    if (!TABLE_PARTS.test(entry.entryName)) continue;
+    const original = entry.getData().toString("utf8");
+    let xml = original;
+    for (const toc of tocs) {
+      const start = markerParagraph(xml, toc.start);
+      if (!start) continue;
+      const end = markerParagraph(xml, toc.end);
+      if (spliced.has(toc) || !end || end.from < start.to) {
+        throw new Error(
+          `the office-open renderer lost track of a table of contents in a table cell (${entry.entryName})`
+        );
+      }
+      xml = xml.slice(0, start.from) + stringifyTableOfContents(
+        toc.alias,
+        toc.options,
+        xml.slice(start.to, end.from)
+      ) + xml.slice(end.to);
+      spliced.add(toc);
+    }
+    if (xml !== original) zip.updateFile(entry, Buffer.from(xml, "utf8"));
+  }
+  if (spliced.size !== tocs.length) {
+    throw new Error(
+      `the office-open renderer placed ${tocs.length} table(s) of contents in table cells and found ${spliced.size}`
+    );
+  }
+}
+function markerParagraph(xml, marker) {
+  const at = xml.indexOf(marker);
+  if (at < 0) return void 0;
+  const from = Math.max(
+    xml.lastIndexOf("<w:p>", at),
+    xml.lastIndexOf("<w:p ", at)
+  );
+  const close = xml.indexOf("</w:p>", at);
+  if (xml.indexOf(marker, at + marker.length) >= 0 || from < 0 || close < 0 || xml.lastIndexOf("</w:p>", at) > from) {
+    throw new Error(
+      "the office-open renderer found a table-of-contents marker it did not write"
+    );
+  }
+  return { from, to: close + "</w:p>".length };
+}
+var TABLE_PARTS;
+var init_cellTocs = __esm({
+  "src/renderers/office-open/cellTocs.ts"() {
+    "use strict";
+    TABLE_PARTS = /^word\/(?:document|header\d+|footer\d+)\.xml$/;
+  }
+});
+
 // src/renderers/office-open/emit.ts
 import { assertNever as assertNever2 } from "@json-to-office/shared/rendering";
 function emptyContext() {
   let next = 1;
-  return { pictures: /* @__PURE__ */ new Map(), nextDrawingId: () => next++, charts: [] };
+  return {
+    pictures: /* @__PURE__ */ new Map(),
+    nextDrawingId: () => next++,
+    charts: [],
+    cellTocs: []
+  };
 }
 function simpleField(instruction, cachedText) {
   return {
@@ -4254,16 +4352,26 @@ function simpleField(instruction, cachedText) {
     }
   };
 }
+function twips(value) {
+  return Math.floor(value);
+}
 function runProperties2(formatting) {
   if (!formatting) return {};
   const out = {};
   if (formatting.fontFamily) out.font = formatting.fontFamily;
   if (formatting.sizeHalfPoints !== void 0) {
     out.size = formatting.sizeHalfPoints / 2;
+    if (formatting.sizeHalfPoints) out.sizeComplexScript = out.size;
   }
   if (formatting.color) out.color = formatting.color.hex;
-  if (formatting.bold !== void 0) out.bold = formatting.bold;
-  if (formatting.italic !== void 0) out.italic = formatting.italic;
+  if (formatting.bold !== void 0) {
+    out.bold = formatting.bold;
+    out.boldComplexScript = formatting.bold;
+  }
+  if (formatting.italic !== void 0) {
+    out.italic = formatting.italic;
+    out.italicComplexScript = formatting.italic;
+  }
   if (formatting.underline) {
     out.underline = {
       type: formatting.underline.type,
@@ -4283,7 +4391,9 @@ function runProperties2(formatting) {
   if (formatting.scalePercent !== void 0)
     out.scale = formatting.scalePercent;
   if (formatting.characterSpacingTwentieths !== void 0) {
-    out.characterSpacing = formatting.characterSpacingTwentieths;
+    const stated = formatting.characterSpacingTwentieths;
+    const twentieths = twips(stated);
+    out.characterSpacing = twentieths === 0 && stated !== 0 ? "0pt" : twentieths;
   }
   if (formatting.language) out.language = { value: formatting.language };
   if (formatting.noProof !== void 0) out.noProof = formatting.noProof;
@@ -4674,16 +4784,16 @@ function paragraphProperties2(formatting) {
   if (formatting.indent) {
     const indent = {};
     if (formatting.indent.leftTwips !== void 0) {
-      indent.left = formatting.indent.leftTwips;
+      indent.left = twips(formatting.indent.leftTwips);
     }
     if (formatting.indent.rightTwips !== void 0) {
-      indent.right = formatting.indent.rightTwips;
+      indent.right = twips(formatting.indent.rightTwips);
     }
     if (formatting.indent.firstLineTwips !== void 0) {
-      indent.firstLine = formatting.indent.firstLineTwips;
+      indent.firstLine = twips(formatting.indent.firstLineTwips);
     }
     if (formatting.indent.hangingTwips !== void 0) {
-      indent.hanging = formatting.indent.hangingTwips;
+      indent.hanging = twips(formatting.indent.hangingTwips);
     }
     out.indent = indent;
   }
@@ -4814,15 +4924,14 @@ function table(value, ctx) {
       // `w:w` is an integer in OOXML. A grid that splits a remainder between
       // unstated columns comes out fractional, and the XML would carry it
       // verbatim; floored here, as the docxjs backend floors it.
-      size: value.width.kind === "auto" ? 0 : value.width.kind === "twips" ? Math.floor(value.width.value) : value.width.value,
+      size: value.width.kind === "auto" ? 0 : value.width.kind === "twips" ? twips(value.width.value) : value.width.value,
       type: value.width.kind === "twips" ? "dxa" : value.width.kind === "percent" ? "pct" : "auto"
     },
     layout: value.layout,
     // An empty grid is a table with nothing to say about its columns, which is
-    // not the same as one whose columns are all zero wide.
-    ...value.columnGrid.values.length > 0 ? {
-      columnWidths: value.columnGrid.unit === "twips" ? value.columnGrid.values.map(Math.floor) : value.columnGrid.values
-    } : {},
+    // not the same as one whose columns are all zero wide. The compiler hands
+    // over every grid in twips; floored for the same reason as the width.
+    ...value.columnGrid.values.length > 0 ? { columnWidths: value.columnGrid.values.map(twips) } : {},
     ...value.alignment ? { alignment: alignment(value.alignment) } : {},
     ...value.borders ? { borders: borders2(value.borders) } : {},
     ...value.cellMargins ? { margins: cellMargins(value.cellMargins) } : {},
@@ -4833,14 +4942,22 @@ function tableFloat2(floating) {
   return {
     ...floating.horizontalAnchor ? { horizontalAnchor: floating.horizontalAnchor } : {},
     ...floating.verticalAnchor ? { verticalAnchor: floating.verticalAnchor } : {},
-    ...floating.absoluteHorizontalPositionTwips !== void 0 ? { absoluteHorizontalPosition: floating.absoluteHorizontalPositionTwips } : {},
+    ...floating.absoluteHorizontalPositionTwips !== void 0 ? {
+      absoluteHorizontalPosition: twips(
+        floating.absoluteHorizontalPositionTwips
+      )
+    } : {},
     ...floating.relativeHorizontalPosition ? { relativeHorizontalPosition: floating.relativeHorizontalPosition } : {},
-    ...floating.absoluteVerticalPositionTwips !== void 0 ? { absoluteVerticalPosition: floating.absoluteVerticalPositionTwips } : {},
+    ...floating.absoluteVerticalPositionTwips !== void 0 ? {
+      absoluteVerticalPosition: twips(
+        floating.absoluteVerticalPositionTwips
+      )
+    } : {},
     ...floating.relativeVerticalPosition ? { relativeVerticalPosition: floating.relativeVerticalPosition } : {},
-    ...floating.topFromTextTwips !== void 0 ? { topFromText: floating.topFromTextTwips } : {},
-    ...floating.rightFromTextTwips !== void 0 ? { rightFromText: floating.rightFromTextTwips } : {},
-    ...floating.bottomFromTextTwips !== void 0 ? { bottomFromText: floating.bottomFromTextTwips } : {},
-    ...floating.leftFromTextTwips !== void 0 ? { leftFromText: floating.leftFromTextTwips } : {},
+    ...floating.topFromTextTwips !== void 0 ? { topFromText: twips(floating.topFromTextTwips) } : {},
+    ...floating.rightFromTextTwips !== void 0 ? { rightFromText: twips(floating.rightFromTextTwips) } : {},
+    ...floating.bottomFromTextTwips !== void 0 ? { bottomFromText: twips(floating.bottomFromTextTwips) } : {},
+    ...floating.leftFromTextTwips !== void 0 ? { leftFromText: twips(floating.leftFromTextTwips) } : {},
     ...floating.overlap ? { overlap: floating.overlap } : {}
   };
 }
@@ -4848,7 +4965,10 @@ function tableRow(row, ctx) {
   return {
     cells: row.cells.map((cell) => tableCell(cell, ctx)),
     ...row.heightTwips !== void 0 ? {
-      height: { value: row.heightTwips, rule: row.heightRule ?? "atLeast" }
+      height: {
+        value: twips(row.heightTwips),
+        rule: row.heightRule ?? "atLeast"
+      }
     } : {},
     ...row.isHeader !== void 0 ? { tableHeader: row.isHeader } : {},
     ...row.cantSplit !== void 0 ? { cantSplit: row.cantSplit } : {},
@@ -4856,9 +4976,12 @@ function tableRow(row, ctx) {
   };
 }
 function tableCell(cell, ctx) {
+  const children = cellChildren2(cell, ctx);
+  if (cell.children[cell.children.length - 1]?.kind !== "paragraph")
+    children.push({ paragraph: { children: [] } });
   return {
-    children: cell.children.map((child) => block(child, ctx)),
-    ...cell.widthTwips !== void 0 ? { width: { size: cell.widthTwips, type: "dxa" } } : {},
+    children,
+    ...cell.widthTwips !== void 0 ? { width: { size: twips(cell.widthTwips), type: "dxa" } } : {},
     ...cell.verticalAlign ? { verticalAlign: cell.verticalAlign } : {},
     ...cell.shading ? { shading: shading(cell.shading) } : {},
     ...cell.margins ? { margins: cellMargins(cell.margins) } : {},
@@ -4868,8 +4991,38 @@ function tableCell(cell, ctx) {
     ...cell.textDirection ? { textDirection: cell.textDirection } : {}
   };
 }
+function cellChildren2(cell, ctx) {
+  const children = [];
+  for (const child of cell.children) {
+    if (child.kind !== "toc") {
+      children.push(block(child, ctx));
+      continue;
+    }
+    const { alias, entries, ...options } = tableOfContents(child);
+    const index = ctx.cellTocs.length;
+    const toc = {
+      start: cellTocMarker(index, "start"),
+      end: cellTocMarker(index, "end"),
+      alias: String(alias),
+      options
+    };
+    ctx.cellTocs.push(toc);
+    children.push(
+      markerParagraph2(toc.start),
+      ...entries ?? [],
+      markerParagraph2(toc.end)
+    );
+  }
+  return children;
+}
+function cellTocMarker(index, edge) {
+  return `\uE000jto-cell-toc-${index}-${edge}\uE000`;
+}
+function markerParagraph2(text) {
+  return { paragraph: { children: [{ text }] } };
+}
 function cellMargins(margins) {
-  const side = (value) => value === void 0 ? void 0 : { size: value, type: "dxa" };
+  const side = (value) => value === void 0 ? void 0 : { size: twips(value), type: "dxa" };
   const out = {};
   for (const [name, value] of [
     ["top", margins.topTwips],
@@ -4916,18 +5069,18 @@ function section(value, ctx, closesDocument = false) {
         // Orientation is implied by the width/height pair, which is how this
         // pipeline has always expressed it; stating it as well changes `w:pgSz`.
         size: {
-          width: page.widthTwips,
-          height: page.heightTwips,
+          width: twips(page.widthTwips),
+          height: twips(page.heightTwips),
           ...page.code !== void 0 ? { code: page.code } : {}
         },
         margin: {
-          top: page.margins.topTwips,
-          right: page.margins.rightTwips,
-          bottom: page.margins.bottomTwips,
-          left: page.margins.leftTwips,
-          ...page.margins.headerTwips !== void 0 ? { header: page.margins.headerTwips } : {},
-          ...page.margins.footerTwips !== void 0 ? { footer: page.margins.footerTwips } : {},
-          ...page.margins.gutterTwips !== void 0 ? { gutter: page.margins.gutterTwips } : {}
+          top: twips(page.margins.topTwips),
+          right: twips(page.margins.rightTwips),
+          bottom: twips(page.margins.bottomTwips),
+          left: twips(page.margins.leftTwips),
+          ...page.margins.headerTwips !== void 0 ? { header: twips(page.margins.headerTwips) } : {},
+          ...page.margins.footerTwips !== void 0 ? { footer: twips(page.margins.footerTwips) } : {},
+          ...page.margins.gutterTwips !== void 0 ? { gutter: twips(page.margins.gutterTwips) } : {}
         },
         ...value.properties.pageNumbers ? {
           pageNumbers: {
@@ -4946,17 +5099,23 @@ function section(value, ctx, closesDocument = false) {
       ...columns ? {
         column: {
           count: columns.count,
-          ...columns.spaceTwips !== void 0 ? { space: columns.spaceTwips } : {},
+          ...columns.spaceTwips !== void 0 ? { space: twips(columns.spaceTwips) } : {},
           ...columns.separator !== void 0 ? { separate: columns.separator } : {},
           ...columns.equalWidth !== void 0 ? { equalWidth: columns.equalWidth } : {},
           ...columns.widths ? {
             children: columns.widths.map((column) => ({
-              width: column.widthTwips,
-              ...column.spaceTwips !== void 0 ? { space: column.spaceTwips } : {}
+              width: twips(column.widthTwips),
+              ...column.spaceTwips !== void 0 ? { space: twips(column.spaceTwips) } : {}
             }))
           } : {}
         }
-      } : {}
+      } : {},
+      // No document grid, as the IR states none. Left to the backend, every
+      // section gets the one Word's Chinese template sets — a 15.6pt line grid
+      // (`w:type="lines"`, pitch 312) — and every line is laid out on it here
+      // but at its own height on docx.js, which writes no grid type. A field
+      // the backend is not given takes that default, so all three are stated.
+      grid: { type: "default", linePitch: 360, charSpace: 0 }
     },
     children: sectionChildren2(value, ctx, closesDocument),
     ...value.headers ? { headers: headerFooterSet(value.headers, ctx) } : {},
@@ -4974,14 +5133,14 @@ function headerFooterSet(set, ctx) {
 function sectionChildren2(value, ctx, closesDocument = false) {
   const blocks = value.children.map((child) => block(child, ctx));
   const last = value.children[value.children.length - 1];
-  if (closesDocument && last?.kind === "paragraph" && last.frame !== void 0)
+  const bookmark = value.bookmark;
+  if (bookmark?.closes && last?.kind !== "paragraph" || closesDocument && last?.kind === "paragraph" && last.frame !== void 0)
     blocks.push({
       paragraph: {
         children: [],
         spacing: { before: 0, after: 0, line: 20, lineRule: "exact" }
       }
     });
-  const bookmark = value.bookmark;
   if (!bookmark) return blocks;
   return [
     ...bookmark.opens ? [{ bookmarkStart: { id: bookmark.id, name: bookmark.name } }] : [],
@@ -5004,8 +5163,8 @@ function numberingConfig2(numbering) {
         ...level.indent ? {
           paragraph: {
             indent: {
-              ...level.indent.leftTwips !== void 0 ? { left: level.indent.leftTwips } : {},
-              ...level.indent.hangingTwips !== void 0 ? { hanging: level.indent.hangingTwips } : {}
+              ...level.indent.leftTwips !== void 0 ? { left: twips(level.indent.leftTwips) } : {},
+              ...level.indent.hangingTwips !== void 0 ? { hanging: twips(level.indent.hangingTwips) } : {}
             }
           }
         } : {},
@@ -5041,12 +5200,11 @@ function builtIn2(style) {
   };
 }
 function emitStyles2(styles) {
-  const documentDefaults = {
-    ...Object.keys(styles.defaults.run).length > 0 ? { run: runProperties2(styles.defaults.run) } : {},
-    ...Object.keys(styles.defaults.paragraph).length > 0 ? { paragraph: paragraphProperties2(styles.defaults.paragraph) } : {}
-  };
   const defaults = {
-    ...Object.keys(documentDefaults).length > 0 ? { document: documentDefaults } : {}
+    document: {
+      run: Object.keys(styles.defaults.run).length > 0 ? runProperties2(styles.defaults.run) : null,
+      paragraph: Object.keys(styles.defaults.paragraph).length > 0 ? paragraphProperties2(styles.defaults.paragraph) : null
+    }
   };
   for (const slot of [
     "footnoteText",
@@ -5075,7 +5233,7 @@ function emitStyles2(styles) {
         run: runProperties2(style.run)
       }))
     } : {},
-    ...Object.keys(defaults).length > 0 ? { default: defaults } : {}
+    default: defaults
   };
 }
 var init_styles3 = __esm({
@@ -5098,10 +5256,15 @@ async function createOfficeOpenDocxRenderer() {
     /* @vite-ignore */
     OFFICE_OPEN_DOCX
   );
-  if (typeof backend.generateDocument !== "function") {
-    throw new Error(
-      `${OFFICE_OPEN_DOCX} does not export generateDocument(); the installed version is not compatible with this adapter.`
-    );
+  for (const name of [
+    "generateDocument",
+    "stringifyTableOfContents"
+  ]) {
+    if (typeof backend[name] !== "function") {
+      throw new Error(
+        `${OFFICE_OPEN_DOCX} does not export ${name}(); the installed version is not compatible with this adapter.`
+      );
+    }
   }
   return {
     id: OFFICE_OPEN_DOCX_RENDERER_ID,
@@ -5109,10 +5272,12 @@ async function createOfficeOpenDocxRenderer() {
     capabilities: OFFICE_OPEN_CAPABILITIES,
     async render(ir, options) {
       const charts = [];
+      const cellTocs = [];
       const document = await buildDocumentOptions(
         ir,
         charts,
-        options?.svgRasterFallback
+        options?.svgRasterFallback,
+        cellTocs
       );
       const bytes = await backend.generateDocument(document, {
         type: "uint8array"
@@ -5120,9 +5285,10 @@ async function createOfficeOpenDocxRenderer() {
       let raw = Buffer.from(
         bytes instanceof Uint8Array ? bytes : new Uint8Array(bytes)
       );
-      if (charts.length > 0) {
+      if (charts.length > 0 || cellTocs.length > 0) {
         const zip = new AdmZip4(raw);
         spliceChartParts(zip, charts);
+        spliceCellTocs(zip, cellTocs, backend.stringifyTableOfContents);
         raw = zip.toBuffer();
       }
       if (options?.deterministic === false)
@@ -5139,12 +5305,13 @@ async function createOfficeOpenDocxRenderer() {
     }
   };
 }
-async function buildDocumentOptions(ir, charts = [], svgRasterFallback) {
+async function buildDocumentOptions(ir, charts = [], svgRasterFallback, cellTocs = []) {
   let nextDrawingId = 1;
   const ctx = {
     pictures: await prepareImages2(ir, svgRasterFallback),
     nextDrawingId: () => nextDrawingId++,
-    charts
+    charts,
+    cellTocs
   };
   return {
     styles: emitStyles2(ir.styles),
@@ -5423,6 +5590,7 @@ var init_office_open = __esm({
   "src/renderers/office-open/index.ts"() {
     "use strict";
     init_chartParts();
+    init_cellTocs();
     init_imageUtils();
     init_packageDocument();
     init_emit2();
@@ -6023,7 +6191,7 @@ import {
 
 // src/components/highcharts.ts
 init_colorUtils();
-init_layoutUtils();
+init_widthUtils();
 import {
   chartFamilyResolver,
   remoteExportNotice,
@@ -6134,8 +6302,7 @@ function placedWidthPt(config, theme) {
   const chart = config.options.chart;
   if (typeof width === "number") return width * POINTS_PER_PIXEL;
   if (typeof width === "string") {
-    const page = getPageSetup(theme);
-    const contentWidthPt = (page.size.width - page.margin.left - page.margin.right) * POINTS_PER_TWIP;
+    const contentWidthPt = getAvailableWidthTwips(theme) * POINTS_PER_TWIP;
     return parseFloat(width) / 100 * contentWidthPt;
   }
   if (typeof height === "number" && chart.height > 0) {
@@ -6386,6 +6553,7 @@ import {
   assetUnreadableError
 } from "@json-to-office/shared/rendering";
 import { capsFormatting as capsFormatting2, synthesizeFamilyName as synthesizeFamilyName2 } from "@json-to-office/shared";
+import { unrenderedComponentText } from "@json-to-office/quality";
 import {
   isNativeVisualProps as isNativeVisualProps4
 } from "@json-to-office/shared-docx";
@@ -6899,6 +7067,7 @@ function resolveColors(entries, at, deps) {
 
 // src/styles/themeToStyles.ts
 init_themes();
+init_types();
 init_colorUtils();
 init_styleHelpers();
 import {
@@ -7065,10 +7234,13 @@ function convertParagraphProperties(merged, styleProps, theme) {
     }
   };
 }
+function themeBorderStyle(style) {
+  return DOCX_IR_BORDER_STYLES.includes(style) ? style : "single";
+}
 function convertBorders(borders3, theme) {
   if (!borders3) return void 0;
   const mapSide = (side) => side ? {
-    style: side.style,
+    style: themeBorderStyle(side.style),
     sizeEighthPoints: side.size,
     color: { hex: resolveColor(side.color, theme) },
     ...side.space !== void 0 ? { spacePoints: side.space } : {}
@@ -7507,7 +7679,8 @@ function createDocumentStyles(themeNameOrObject = "consulting", language) {
               tabStops: effectiveTabStops.map(
                 (ts) => ({
                   type: ts.type,
-                  positionTwips: ts.position === "max" ? RIGHT_MARGIN_TAB_TWIPS : ts.position,
+                  // Whole twips: `w:pos` is an integer no backend rounds.
+                  positionTwips: ts.position === "max" ? RIGHT_MARGIN_TAB_TWIPS : Math.round(ts.position),
                   ...ts.leader && { leader: ts.leader }
                 })
               )
@@ -8255,7 +8428,11 @@ function resolveTableModel(source, theme, themeName, options = {}) {
   });
   adjudicateInteriorEdges([...hasHeader ? [header] : [], ...rows]);
   return {
-    ...resolveWidths(source, columns, theme, themeName),
+    ...resolveWidths(
+      source,
+      columns,
+      options.measureTwips ?? getAvailableWidthTwips(theme, themeName)
+    ),
     ...hasHeader ? { header } : {},
     rows,
     repeatHeader: source.repeatHeaderOnPageBreak ?? true
@@ -8309,22 +8486,24 @@ function adjudicateInteriorEdges(rows) {
     });
   });
 }
-function resolveWidths(source, columns, theme, themeName) {
+function resolveWidths(source, columns, measureTwips) {
   const hasExplicitWidths = columns.some((col) => col.width !== void 0);
   if (!hasExplicitWidths) {
-    const share = 100 / columns.length;
+    const percent = source.width ?? 100;
     return {
-      columnGrid: { unit: "percent", values: columns.map(() => share) },
-      width: { size: source.width ?? 100, unit: "percent" }
+      columnGrid: {
+        unit: "twips",
+        values: splitTwips(columns.length, measureTwips * percent / 100)
+      },
+      width: { size: percent, unit: "percent" }
     };
   }
-  const available = getAvailableWidthTwips(theme, themeName);
   const stated = columns.map(
-    (col) => col.width !== void 0 ? relativeLengthToTwips(col.width, available) : void 0
+    (col) => col.width !== void 0 ? relativeLengthToTwips(col.width, measureTwips) : void 0
   );
   const totalStated = stated.reduce((sum, w) => sum + (w ?? 0), 0);
   const unstatedCount = columns.filter((col) => col.width === void 0).length;
-  const remaining = Math.max(0, available - totalStated);
+  const remaining = Math.max(0, measureTwips - totalStated);
   const shareOfRemainder = unstatedCount > 0 ? remaining / unstatedCount : pointsToTwips(72);
   const values = stated.map((w) => w || shareOfRemainder);
   return {
@@ -8333,7 +8512,7 @@ function resolveWidths(source, columns, theme, themeName) {
       size: values.reduce((sum, w) => sum + w, 0),
       unit: "twips"
     },
-    ...totalStated > available ? { overflow: { totalTwips: totalStated, availableTwips: available } } : {}
+    ...totalStated > measureTwips ? { overflow: { totalTwips: totalStated, availableTwips: measureTwips } } : {}
   };
 }
 
@@ -9049,6 +9228,36 @@ function emptyToUndefined(formatting) {
 
 // src/ir/compiler.ts
 init_types();
+
+// src/ir/measure.ts
+var DEFAULT_COLUMN_SPACE_TWIPS = 720;
+function textWidthTwips(page) {
+  const { leftTwips, rightTwips, gutterTwips = 0 } = page.margins;
+  return Math.max(0, page.widthTwips - leftTwips - rightTwips - gutterTwips);
+}
+function sectionMeasureTwips(properties) {
+  const textWidth = textWidthTwips(properties.page);
+  const columns = properties.columns;
+  if (!columns || columns.count <= 1) return textWidth;
+  if (columns.equalWidth !== true && columns.widths?.length) {
+    return Math.min(...columns.widths.map((column) => column.widthTwips));
+  }
+  const space = columns.spaceTwips ?? DEFAULT_COLUMN_SPACE_TWIPS;
+  return Math.max(0, (textWidth - space * (columns.count - 1)) / columns.count);
+}
+function cellMeasureTwips(widthTwips, margins) {
+  return Math.max(
+    0,
+    widthTwips - (margins?.leftTwips ?? 0) - (margins?.rightTwips ?? 0)
+  );
+}
+function tableWidthTwips(width, measureTwips) {
+  if (width.kind === "twips") return width.value;
+  if (width.kind === "percent") return measureTwips * width.value / 100;
+  return measureTwips;
+}
+
+// src/ir/compiler.ts
 init_units();
 var CONTENT_BOOKMARK_ID_BASE = 2e6;
 var SINGLE_LINE_TWIPS = 240;
@@ -9249,6 +9458,42 @@ function compileSectionBody(section2, index, ordinal, chrome, ctx) {
   if (column && column.count > 1) {
     ctx.features.require("columns", `${path4}.properties.columns`);
   }
+  const properties = {
+    page: {
+      widthTwips: page.size.width,
+      heightTwips: page.size.height,
+      orientation: page.size.width > page.size.height ? "landscape" : "portrait",
+      ...page.size.code !== void 0 ? { code: page.size.code } : {},
+      margins: {
+        topTwips: page.margin.top,
+        bottomTwips: page.margin.bottom,
+        leftTwips: page.margin.left,
+        rightTwips: page.margin.right,
+        ...page.margin.header !== void 0 ? { headerTwips: page.margin.header } : {},
+        ...page.margin.footer !== void 0 ? { footerTwips: page.margin.footer } : {},
+        ...page.margin.gutter !== void 0 ? { gutterTwips: page.margin.gutter } : {}
+      }
+    },
+    // A chunk that starts on a new page says so; the rest continue the flow.
+    // The layout stage already decided which, so it is carried rather than
+    // re-derived from `breakBefore`: a section can be continuous without the
+    // two agreeing.
+    ...section2.properties.type ? { type: sectionType(section2.properties.type) } : {},
+    ...column ? {
+      columns: {
+        count: column.count,
+        ...column.space !== void 0 ? { spaceTwips: column.space } : {},
+        ...column.equalWidth !== void 0 ? { equalWidth: column.equalWidth } : {},
+        ...column.widths ? {
+          widths: column.widths.map((c) => ({
+            widthTwips: c.width,
+            ...c.space !== void 0 ? { spaceTwips: c.space } : {}
+          }))
+        } : {}
+      }
+    } : {}
+  };
+  const measureTwips = sectionMeasureTwips(properties);
   const children = [];
   const sectionBookmarkName = section2.belongsToUserSection && ordinal.ordinal !== void 0 ? `_Section_${ordinal.ordinal}` : void 0;
   section2.components.forEach((component, i) => {
@@ -9258,6 +9503,7 @@ function compileSectionBody(section2, index, ordinal, chrome, ctx) {
         ctx,
         path: `${path4}.children[${i}]`,
         id: blockId(index, [i]),
+        measureTwips,
         ...sectionBookmarkName ? { sectionBookmarkName } : {}
       })
     );
@@ -9270,41 +9516,7 @@ function compileSectionBody(section2, index, ordinal, chrome, ctx) {
     id: `s${index}`,
     path: path4,
     children,
-    properties: {
-      page: {
-        widthTwips: page.size.width,
-        heightTwips: page.size.height,
-        orientation: page.size.width > page.size.height ? "landscape" : "portrait",
-        ...page.size.code !== void 0 ? { code: page.size.code } : {},
-        margins: {
-          topTwips: page.margin.top,
-          bottomTwips: page.margin.bottom,
-          leftTwips: page.margin.left,
-          rightTwips: page.margin.right,
-          ...page.margin.header !== void 0 ? { headerTwips: page.margin.header } : {},
-          ...page.margin.footer !== void 0 ? { footerTwips: page.margin.footer } : {},
-          ...page.margin.gutter !== void 0 ? { gutterTwips: page.margin.gutter } : {}
-        }
-      },
-      // A chunk that starts on a new page says so; the rest continue the flow.
-      // The layout stage already decided which, so it is carried rather than
-      // re-derived from `breakBefore`: a section can be continuous without the
-      // two agreeing.
-      ...section2.properties.type ? { type: sectionType(section2.properties.type) } : {},
-      ...column ? {
-        columns: {
-          count: column.count,
-          ...column.space !== void 0 ? { spaceTwips: column.space } : {},
-          ...column.equalWidth !== void 0 ? { equalWidth: column.equalWidth } : {},
-          ...column.widths ? {
-            widths: column.widths.map((c) => ({
-              widthTwips: c.width,
-              ...c.space !== void 0 ? { spaceTwips: c.space } : {}
-            }))
-          } : {}
-        }
-      } : {}
-    }
+    properties
   };
   if (ordinal.ordinal !== void 0) {
     compiled.bookmark = {
@@ -9315,9 +9527,22 @@ function compileSectionBody(section2, index, ordinal, chrome, ctx) {
     };
     ctx.features.require("bookmarks", `${path4}.bookmark`);
   }
-  const headers = compilePart(chrome.header, "header", index, ctx);
+  const chromeMeasureTwips = textWidthTwips(properties.page);
+  const headers = compilePart(
+    chrome.header,
+    "header",
+    index,
+    chromeMeasureTwips,
+    ctx
+  );
   if (headers) compiled.headers = { default: headers };
-  const footers = compilePart(chrome.footer, "footer", index, ctx);
+  const footers = compilePart(
+    chrome.footer,
+    "footer",
+    index,
+    chromeMeasureTwips,
+    ctx
+  );
   if (footers) compiled.footers = { default: footers };
   if (headers || footers) {
     ctx.features.require("headers-footers", `${path4}.headers`);
@@ -9336,7 +9561,7 @@ function sectionType(value) {
       return void 0;
   }
 }
-function compilePart(part, kind, sectionIndex, ctx) {
+function compilePart(part, kind, sectionIndex, measureTwips, ctx) {
   if (!part) return void 0;
   const id = `${kind}:s${sectionIndex}:default`;
   const children = [];
@@ -9347,7 +9572,8 @@ function compilePart(part, kind, sectionIndex, ctx) {
     const scope = {
       ctx,
       path: `sections[${sectionIndex}].${kind}s.default.children[${i}]`,
-      id: headerFooterBlockId(id, [i])
+      id: headerFooterBlockId(id, [i]),
+      measureTwips
     };
     children.push(
       ...component.name === "paragraph" ? compileChromeParagraph(component, scope) : component.name === "image" ? compileChromeImage(component, scope) : compileComponent(component, scope)
@@ -9423,9 +9649,7 @@ function compileChromeImage(component, scope) {
   if (mediaType === "svg") ctx.features.require("svg-images", path4);
   const page = getPageSetup(ctx.theme);
   const pageWidthPx = Math.round(twipsToPixels(page.size.width));
-  const contentWidthPx = Math.round(
-    twipsToPixels(page.size.width - page.margin.left - page.margin.right)
-  );
+  const contentWidthPx = Math.round(twipsToPixels(scope.measureTwips));
   const pageHeightPx = Math.round(twipsToPixels(page.size.height));
   const contentHeightPx = Math.round(
     twipsToPixels(page.size.height - page.margin.top - page.margin.bottom)
@@ -9633,7 +9857,7 @@ function compileColumns(component, scope) {
   const props = component.props ?? {};
   const configs = columnConfigs(props.columns);
   if (configs.length === 0) return [];
-  const available = getAvailableWidthTwips(ctx.theme, ctx.themeName);
+  const available = scope.measureTwips;
   const { widths, gaps } = columnMetrics(configs, props.gap, available);
   const stated = widths.map(
     (width, index) => width + gaps[index] / 2 + (index > 0 ? gaps[index - 1] / 2 : 0)
@@ -9662,11 +9886,18 @@ function compileColumns(component, scope) {
       rows: [
         {
           cells: configs.map((_, index) => {
+            const margins = {
+              topTwips: 0,
+              rightTwips: gaps[index] / 2,
+              bottomTwips: 0,
+              leftTwips: index > 0 ? gaps[index - 1] / 2 : 0
+            };
             const blocks = contents[index].flatMap(
               (child, childIndex) => compileComponent(child, {
                 ...scope,
                 path: `${path4}.children[${index}][${childIndex}]`,
-                id: `${scope.id}:c${index}:${childIndex}`
+                id: `${scope.id}:c${index}:${childIndex}`,
+                measureTwips: cellMeasureTwips(cells[index], margins)
               })
             );
             return {
@@ -9681,12 +9912,7 @@ function compileColumns(component, scope) {
                 }
               ],
               widthTwips: cells[index],
-              margins: {
-                topTwips: 0,
-                rightTwips: gaps[index] / 2,
-                bottomTwips: 0,
-                leftTwips: index > 0 ? gaps[index - 1] / 2 : 0
-              },
+              margins,
               verticalAlign: "top",
               borders: {
                 top: NO_BORDERS.top,
@@ -9743,6 +9969,16 @@ var DEFAULT_TEXT_BOX_WIDTH_TWIPS = 5e3;
 function compileTextBox(component, scope) {
   const { ctx, path: path4 } = scope;
   const props = component.props ?? {};
+  const style = props.style;
+  const padding = style?.padding;
+  const width = textBoxWidth(props);
+  const widthTwips = Math.round(tableWidthTwips(width, scope.measureTwips));
+  const margins = {
+    topTwips: padding?.top ? pointsToTwips2(padding.top) : 0,
+    rightTwips: padding?.right ? pointsToTwips2(padding.right) : 0,
+    bottomTwips: padding?.bottom ? pointsToTwips2(padding.bottom) : 0,
+    leftTwips: padding?.left ? pointsToTwips2(padding.left) : 0
+  };
   const children = [];
   const contents = component.children ?? [];
   contents.forEach((child, index) => {
@@ -9750,12 +9986,12 @@ function compileTextBox(component, scope) {
       ...compileComponent(child, {
         ...scope,
         path: `${path4}.children[${index}]`,
-        id: `${scope.id}:c${index}`
+        id: `${scope.id}:c${index}`,
+        // What the box holds is set against the box less its padding.
+        measureTwips: cellMeasureTwips(widthTwips, margins)
       })
     );
   });
-  const style = props.style;
-  const padding = style?.padding;
   if (props.renderAs === "shape") {
     const shape = compileShape2(props, children, scope);
     if (shape) return shape;
@@ -9767,9 +10003,11 @@ function compileTextBox(component, scope) {
       kind: "table",
       id: scope.id,
       path: path4,
-      // No grid: one cell, whose width the table itself decides.
-      columnGrid: { unit: "twips", values: [] },
-      width: textBoxWidth(props),
+      // One cell, as wide as the box. Left out, the grid would be each
+      // backend's 100-twip placeholder, which a reader that takes the grid as
+      // the column widths draws.
+      columnGrid: { unit: "twips", values: [widthTwips] },
+      width,
       layout: "fixed",
       // The container is invisible; whatever border the author asked for is
       // drawn by the cell inside it.
@@ -9789,12 +10027,7 @@ function compileTextBox(component, scope) {
                   children: []
                 }
               ],
-              margins: {
-                topTwips: padding?.top ? pointsToTwips2(padding.top) : 0,
-                rightTwips: padding?.right ? pointsToTwips2(padding.right) : 0,
-                bottomTwips: padding?.bottom ? pointsToTwips2(padding.bottom) : 0,
-                leftTwips: padding?.left ? pointsToTwips2(padding.left) : 0
-              },
+              margins,
               ...style?.shading?.fill ? {
                 shading: {
                   fill: irColor(
@@ -9813,8 +10046,11 @@ function compileTextBox(component, scope) {
 var EMU_PER_PIXEL = 9525;
 function compileShape2(props, children, scope) {
   const { ctx, path: path4 } = scope;
-  const width = shapeSize(props.width, "width", ctx);
-  const height = shapeSize(props.height, "height", ctx);
+  const width = shapeSize(props.width, scope.measureTwips);
+  const height = shapeSize(
+    props.height,
+    getAvailableHeightTwips(ctx.theme, ctx.themeName)
+  );
   if (width.pixels === void 0 || height.pixels === void 0) {
     warnOnce(
       ctx,
@@ -9845,7 +10081,7 @@ function compileShape2(props, children, scope) {
     warnOnce(
       ctx,
       "text-box",
-      '[core-docx] text-box renderAs "shape" resolves percentage sizes at generation time, against the current page content box; the shape will not reflow if the page size changes.'
+      '[core-docx] text-box renderAs "shape" resolves percentage sizes at generation time \u2014 a width against what holds it, a height against the page \u2014 so the shape will not reflow if either changes.'
     );
   }
   if (outline.ignoredSides.length > 0) {
@@ -9890,7 +10126,7 @@ function compileShape2(props, children, scope) {
     }
   ];
 }
-function shapeSize(value, axis, ctx) {
+function shapeSize(value, referenceTwips) {
   if (typeof value === "number") {
     return { pixels: Math.round(value), resolvedPercentage: false };
   }
@@ -9899,9 +10135,8 @@ function shapeSize(value, axis, ctx) {
   if (!Number.isFinite(fraction) || fraction <= 0) {
     return { resolvedPercentage: false };
   }
-  const availableTwips = axis === "width" ? getAvailableWidthTwips(ctx.theme, ctx.themeName) : getAvailableHeightTwips(ctx.theme, ctx.themeName);
   return {
-    pixels: Math.round(availableTwips * fraction / TWIPS_PER_PIXEL),
+    pixels: Math.round(referenceTwips * fraction / TWIPS_PER_PIXEL),
     resolvedPercentage: true
   };
 }
@@ -9976,10 +10211,20 @@ function textBoxWidth(props) {
     value: typeof raw === "number" ? raw * TWIPS_PER_PIXEL : DEFAULT_TEXT_BOX_WIDTH_TWIPS
   };
 }
+function borderLineStyle(authored) {
+  switch (authored) {
+    case "dashed":
+    case "dotted":
+    case "double":
+      return authored;
+    default:
+      return "single";
+  }
+}
 function compileBorders(border3, ctx) {
   if (!border3) return void 0;
   const side = (value) => value ? {
-    style: String(value.style ?? "single"),
+    style: value.style === "none" ? "none" : borderLineStyle(value.style),
     // Points to eighths of a point, never thinner than the hairline a
     // reader can actually see.
     sizeEighthPoints: value.width !== void 0 ? Math.max(1, Math.round(value.width * 8)) : 1,
@@ -10055,7 +10300,9 @@ function compileToc(component, scope) {
       formatting: {
         alignment: "left",
         spacing: {
-          beforeTwips: ctx.theme.componentDefaults?.heading?.spacing?.before ?? 240,
+          beforeTwips: wholeTwips(
+            ctx.theme.componentDefaults?.heading?.spacing?.before ?? 240
+          ),
           // ~9pt, which separates the title from the list clearly enough to
           // read as a heading rather than a first entry.
           afterTwips: 180
@@ -10083,12 +10330,6 @@ function compileToc(component, scope) {
 var DEFAULT_DIVIDER_SPACING_PT = 6;
 var DEFAULT_DIVIDER_THICKNESS_PT = 1;
 var DIVIDER_LINE_TWIPS = 20;
-var DIVIDER_BORDER_STYLE = {
-  solid: "single",
-  dashed: "dashed",
-  dotted: "dotted",
-  double: "double"
-};
 function compileDivider(component, scope) {
   const { ctx, path: path4 } = scope;
   const props = component.props ?? {};
@@ -10117,10 +10358,10 @@ function compileDivider(component, scope) {
           lineTwips: DIVIDER_LINE_TWIPS,
           lineRule: "exact"
         },
-        ...dividerIndent(props, ctx, path4),
+        ...dividerIndent(props, scope),
         borders: {
           bottom: {
-            style: DIVIDER_BORDER_STYLE[String(props.style)] ?? "single",
+            style: borderLineStyle(props.style),
             sizeEighthPoints: pointsToEighthPoints(thicknessPt),
             color: irColor(
               resolveColor(String(props.color ?? "border"), ctx.theme)
@@ -10134,14 +10375,10 @@ function compileDivider(component, scope) {
     }
   ];
 }
-function dividerIndent(props, ctx, path4) {
+function dividerIndent(props, scope) {
+  const { ctx, path: path4, measureTwips } = scope;
   const width = props.width;
   if (width === void 0) return {};
-  const page = getPageSetup(ctx.theme);
-  const measureTwips = Math.max(
-    0,
-    page.size.width - page.margin.left - page.margin.right
-  );
   let usedTwips;
   if (typeof width === "number" && Number.isFinite(width)) {
     usedTwips = pointsToTwips2(width);
@@ -10185,8 +10422,8 @@ function compileStatistic(component, scope) {
   const alignment2 = compileAlignment(props.alignment) ?? "center";
   ctx.usesStatistic = true;
   const spacing = props.spacing ? {
-    ...props.spacing.before !== void 0 ? { beforeTwips: props.spacing.before } : {},
-    ...props.spacing.after !== void 0 ? { afterTwips: props.spacing.after } : {}
+    ...props.spacing.before !== void 0 ? { beforeTwips: wholeTwips(props.spacing.before) } : {},
+    ...props.spacing.after !== void 0 ? { afterTwips: wholeTwips(props.spacing.after) } : {}
   } : void 0;
   if (props.format !== void 0) {
     warnOnce(
@@ -10297,7 +10534,7 @@ function compileList(component, scope, referencePrefix = "list", explicitLevels)
     }
     blocks.push(
       paragraphNode(
-        { ctx, path: itemPath, id: `${scope.id}:i${index}` },
+        { ...scope, path: itemPath, id: `${scope.id}:i${index}` },
         revision === void 0 ? parseInline(text, {
           base,
           hyperlinks: true,
@@ -10811,7 +11048,7 @@ function paragraphFormatting(props, ctx, extra = {}) {
   if (Array.isArray(props.tabStops) && props.tabStops.length > 0) {
     formatting.tabStops = props.tabStops.map(
       (stop) => ({
-        positionTwips: stop.position,
+        positionTwips: wholeTwips(stop.position),
         type: stop.type ?? "left",
         ...stop.leader ? { leader: stop.leader } : {}
       })
@@ -10860,7 +11097,10 @@ function compileSpacing(props, ctx) {
 }
 function compileLineSpacing(value) {
   if (typeof value === "number") {
-    return { lineTwips: value * SINGLE_LINE_TWIPS, lineRule: "auto" };
+    return {
+      lineTwips: wholeTwips(value * SINGLE_LINE_TWIPS),
+      lineRule: "auto"
+    };
   }
   if (typeof value !== "object" || value === null) return void 0;
   const { type, value: amount } = value;
@@ -10881,7 +11121,7 @@ function compileLineSpacing(value) {
       };
     case "multiple":
       return {
-        ...amount !== void 0 ? { lineTwips: amount * SINGLE_LINE_TWIPS } : {},
+        ...amount !== void 0 ? { lineTwips: wholeTwips(amount * SINGLE_LINE_TWIPS) } : {},
         lineRule: "auto"
       };
     default:
@@ -10944,7 +11184,7 @@ function compileVisual(component, scope) {
   );
   if (!group) return [];
   const size = visualPlacementPixels(props, group.canvas, {
-    widthPx: Math.round(twipsToPixels(getAvailableWidthTwips(ctx.theme))),
+    widthPx: Math.round(twipsToPixels(scope.measureTwips)),
     heightPx: Math.round(twipsToPixels(getAvailableHeightTwips(ctx.theme)))
   });
   const drawing = {
@@ -11059,7 +11299,7 @@ function compileImage2(component, scope) {
       `Alt text is not written to the document: the DOCX pipeline has never emitted \`wp:docPr\` descriptions, so the image at ${path4} will have none. The text is preserved in the IR.`
     );
   }
-  const size = imagePixelSize(props, loaded, ctx);
+  const size = imagePixelSize(props, loaded, scope);
   const resourceId = declareResource(loaded, mediaType, ctx);
   const image = {
     kind: "image",
@@ -11169,8 +11409,7 @@ function compileChart(component, scope) {
       return [];
     }
   });
-  const page = getPageSetup(ctx.theme);
-  const contentWidthInches = (page.size.width - page.margin.left - page.margin.right) / 1440;
+  const contentWidthInches = scope.measureTwips / 1440;
   const widthInches = typeof props.width === "number" ? props.width : contentWidthInches;
   const heightInches = typeof props.height === "number" ? props.height : DEFAULT_CHART_HEIGHT_INCHES;
   const chart = {
@@ -11270,12 +11509,13 @@ function wrapType(value) {
       return "square";
   }
 }
-function imagePixelSize(props, loaded, ctx) {
+function imagePixelSize(props, loaded, scope) {
+  const { ctx } = scope;
   const widthRef = props.widthRelativeTo === "page" ? "page" : "content";
   const heightRef = props.heightRelativeTo === "page" ? "page" : "content";
   const availableWidthPx = Math.round(
     twipsToPixels(
-      widthRef === "page" ? getPageWidthTwips(ctx.theme) : getAvailableWidthTwips(ctx.theme)
+      widthRef === "page" ? getPageWidthTwips(ctx.theme) : scope.measureTwips
     )
   );
   const availableHeightPx = Math.round(
@@ -11342,8 +11582,8 @@ function compileFrame(floating, ctx, path4) {
   const useAbsolute = hasHorizontalOffset || hasVerticalOffset;
   const frame = {
     // 2in by 1in when the author gave no size.
-    widthTwips: floating.width || 2880,
-    heightTwips: floating.height || 1440,
+    widthTwips: wholeTwips(floating.width || 2880),
+    heightTwips: wholeTwips(floating.height || 1440),
     anchorHorizontal: floating.horizontalPosition?.relative || "page",
     anchorVertical: floating.verticalPosition?.relative || "page",
     ...floating.wrap?.type ? { wrap: floating.wrap.type } : {}
@@ -11356,17 +11596,21 @@ function compileFrame(floating, ctx, path4) {
     if (typeof rawX === "string" || typeof rawY === "string") {
       const hRelative = floating.horizontalPosition?.relative;
       const vRelative = floating.verticalPosition?.relative;
-      frame.xTwips = resolveOffsetTwips(
-        rawX,
-        hRelative && hRelative !== "page" ? getAvailableWidthTwips(ctx.theme, ctx.themeName) : getPageWidthTwips(ctx.theme, ctx.themeName)
+      frame.xTwips = wholeTwips(
+        resolveOffsetTwips(
+          rawX,
+          hRelative && hRelative !== "page" ? getAvailableWidthTwips(ctx.theme, ctx.themeName) : getPageWidthTwips(ctx.theme, ctx.themeName)
+        )
       );
-      frame.yTwips = resolveOffsetTwips(
-        rawY,
-        vRelative && vRelative !== "page" ? getAvailableHeightTwips(ctx.theme, ctx.themeName) : getPageHeightTwips(ctx.theme, ctx.themeName)
+      frame.yTwips = wholeTwips(
+        resolveOffsetTwips(
+          rawY,
+          vRelative && vRelative !== "page" ? getAvailableHeightTwips(ctx.theme, ctx.themeName) : getPageHeightTwips(ctx.theme, ctx.themeName)
+        )
       );
     } else {
-      frame.xTwips = rawX;
-      frame.yTwips = rawY;
+      frame.xTwips = wholeTwips(rawX);
+      frame.yTwips = wholeTwips(rawY);
     }
     return frame;
   }
@@ -11462,7 +11706,10 @@ function compileTable(component, scope) {
     source,
     ctx.theme,
     ctx.themeName,
-    { onWarning: (code, message) => warnOnce(ctx, "table", message, code) }
+    {
+      onWarning: (code, message) => warnOnce(ctx, "table", message, code),
+      measureTwips: scope.measureTwips
+    }
   );
   if (model.overflow) {
     warnOnce(
@@ -11480,6 +11727,7 @@ function compileTable(component, scope) {
     ...model.header ? [
       compileTableRow(
         model.header,
+        model.columnGrid.values,
         style.headerParagraph,
         style.tableHeader,
         {
@@ -11492,13 +11740,19 @@ function compileTable(component, scope) {
       )
     ] : [],
     ...model.rows.map(
-      (row, index) => compileTableRow(row, style.cellParagraph, style.tableCell, {
-        ctx,
-        path: `${path4}.rows[${index}]`,
-        id: `${scope.id}:r${index}`,
-        ...row.tableHeader !== void 0 ? { isHeader: row.tableHeader } : {},
-        ...row.cantSplit !== void 0 ? { cantSplit: row.cantSplit } : {}
-      })
+      (row, index) => compileTableRow(
+        row,
+        model.columnGrid.values,
+        style.cellParagraph,
+        style.tableCell,
+        {
+          ctx,
+          path: `${path4}.rows[${index}]`,
+          id: `${scope.id}:r${index}`,
+          ...row.tableHeader !== void 0 ? { isHeader: row.tableHeader } : {},
+          ...row.cantSplit !== void 0 ? { cantSplit: row.cantSplit } : {}
+        }
+      )
     )
   ];
   ctx.features.require("tables", path4);
@@ -11576,7 +11830,7 @@ function tableBlocker(model, path4) {
   }
   return void 0;
 }
-function compileTableRow(row, spacing, baseStyle, scope) {
+function compileTableRow(row, columnTwips, spacing, baseStyle, scope) {
   const { ctx } = scope;
   const rowRevision = row.revision;
   const rowMark = rowRevision ? {
@@ -11596,6 +11850,7 @@ function compileTableRow(row, spacing, baseStyle, scope) {
     cells: row.cells.map(
       (cell, colIndex) => compileTableCell(
         cell,
+        columnTwips[colIndex] ?? 0,
         spacing,
         baseStyle,
         row.keepNext,
@@ -11617,7 +11872,17 @@ function compileTableRow(row, spacing, baseStyle, scope) {
     ...scope.cantSplit !== void 0 ? { cantSplit: scope.cantSplit } : {}
   };
 }
-function compileTableCell(cell, spacing, baseStyle, keepNext, scope, rowRevision, markRevision) {
+function compileTableCell(cell, columnTwips, spacing, baseStyle, keepNext, partScope, rowRevision, markRevision) {
+  const margins = !cell.missing && cell.padding ? {
+    topTwips: pointsToTwips2(cell.padding.top),
+    bottomTwips: pointsToTwips2(cell.padding.bottom),
+    leftTwips: pointsToTwips2(cell.padding.left),
+    rightTwips: pointsToTwips2(cell.padding.right)
+  } : void 0;
+  const scope = {
+    ...partScope,
+    measureTwips: cellMeasureTwips(columnTwips, margins)
+  };
   const cellLine = compileLineSpacing(cell.font?.lineSpacing);
   const paragraph2 = {
     kind: "paragraph",
@@ -11646,14 +11911,7 @@ function compileTableCell(cell, spacing, baseStyle, keepNext, scope, rowRevision
     ...cell.missing ? {} : {
       verticalAlign: verticalAlign(cell.verticalAlignment),
       ...cell.backgroundColor !== void 0 && cell.backgroundColor !== "transparent" ? { shading: { fill: { hex: cell.backgroundColor } } } : {},
-      ...cell.padding ? {
-        margins: {
-          topTwips: pointsToTwips2(cell.padding.top),
-          bottomTwips: pointsToTwips2(cell.padding.bottom),
-          leftTwips: pointsToTwips2(cell.padding.left),
-          rightTwips: pointsToTwips2(cell.padding.right)
-        }
-      } : {}
+      ...margins ? { margins } : {}
     },
     borders: {
       top: compileTableBorder(cell.borders.top),
@@ -11686,10 +11944,17 @@ function cellChildren(cell, baseStyle, scope, rowRevision) {
       return wrap(cellVisual(content, scope));
     }
     if (content.name !== "paragraph") {
+      const text2 = unrenderedComponentText(content.name);
+      warnOnce(
+        ctx,
+        "table",
+        `${scope.path} holds a "${content.name}", which a table cell cannot render, so it shows "${text2}" instead. A cell takes a string, a paragraph, an image, a visual or a highcharts chart; set statistics side by side with a columns component.`,
+        "W_UNSUPPORTED_CELL_CONTENT"
+      );
       return wrap([
         {
           kind: "text",
-          text: `[Unsupported component type: ${content.name}]`,
+          text: text2,
           formatting: placeholderFormatting(base)
         }
       ]);
@@ -12847,9 +13112,10 @@ function docxBlockContext(document, theme, path4, sources) {
     page.size ?? theme.page.size
   );
   const overrides = isBlockRecord(page.margins) ? page.margins : {};
+  const gutter = "gutter" in margins ? margins.gutter : 0;
   const width = Object.keys(page).length ? Math.max(
     0,
-    dimensions.width - Number(overrides.left ?? margins.left ?? 1440) - Number(overrides.right ?? margins.right ?? 1440)
+    dimensions.width - Number(overrides.left ?? margins.left ?? 1440) - Number(overrides.right ?? margins.right ?? 1440) - Number(overrides.gutter ?? gutter ?? 0)
   ) : getAvailableWidthTwips(theme);
   const height = Object.keys(page).length ? Math.max(
     0,
@@ -13057,6 +13323,11 @@ init_widthUtils();
 import probe2 from "probe-image-size";
 
 // src/quality/text-inventory.ts
+import {
+  unrenderedComponentText as unrenderedComponentText2
+} from "@json-to-office/quality";
+import { TABLE_CELL_COMPONENTS } from "@json-to-office/shared-docx";
+var CELL_COMPONENTS = new Set(TABLE_CELL_COMPONENTS);
 function tocDepth(depth) {
   const range = asRecord(depth) ?? {};
   const from = typeof range.from === "number" ? range.from : 1;
@@ -13105,7 +13376,14 @@ function collectDocxTextInventory(children, basePath = "/children") {
         add(`${path4}/content`, rec.content, cellRole, extra);
       else {
         const inner = asRecord(rec.content);
-        if (inner)
+        if (inner && typeof inner.name === "string" && !CELL_COMPONENTS.has(inner.name)) {
+          add(
+            `${path4}/content`,
+            unrenderedComponentText2(inner.name),
+            cellRole,
+            { ...extra, optional: true, unrendered: inner.name }
+          );
+        } else if (inner)
           visitNode(inner, `${path4}/content`, { ...inherited, inCell: true });
       }
       return;
@@ -13430,7 +13708,7 @@ function pageBox(theme, themeName, pageOverride) {
   return {
     availableWidthTwips: Math.max(
       0,
-      page.size.width - page.margin.left - page.margin.right
+      page.size.width - page.margin.left - page.margin.right - (page.margin.gutter ?? 0)
     ),
     pageBottomTwips: page.size.height
   };