@beyondwork/docx-react-component 1.0.60 → 1.0.62

package/package.json

@@ -1,9 +1,8 @@
 {
   "name": "@beyondwork/docx-react-component",
   "publisher": "beyondwork",
-  "version": "1.0.60",
+  "version": "1.0.62",
   "description": "Embeddable React Word (docx) editor with review, comments, tracked changes, and round-trip OOXML fidelity.",
-  "packageManager": "pnpm@10.30.3",
   "type": "module",
   "sideEffects": [
     "**/*.css"
@@ -93,38 +92,6 @@
     "./ui-tailwind/theme/editor-theme.css": "./src/ui-tailwind/theme/editor-theme.css"
   },
   "types": "./src/index.ts",
-  "scripts": {
-    "build": "tsup",
-    "test": "bash scripts/run-workspace-tests.sh",
-    "test:repo": "node scripts/ci-check-layout-engine-version.mjs && node scripts/run-repo-tests.mjs core",
-    "test:repo:all": "node scripts/run-repo-tests.mjs all",
-    "test:repo:optional": "node scripts/run-repo-tests.mjs optional",
-    "test:repo:browser-ui": "node scripts/run-repo-tests.mjs browser-ui",
-    "test:wcag-audit": "node scripts/run-repo-tests.mjs wcag-audit",
-    "test:harness": "pnpm --filter @docx-react-component/react-word-editor-harness test",
-    "test:visual": "VISUAL_SMOKE_PROFILE=bare pnpm exec playwright test --project=chromium",
-    "test:visual:chrome": "VISUAL_SMOKE_PROFILE=chrome-cycle pnpm exec playwright test --project=chromium",
-    "test:visual:redline": "VISUAL_SMOKE_PROFILE=redline-cycle pnpm exec playwright test --project=chromium",
-    "visual:list-runs": "node scripts/visual-smoke-list-runs.mjs",
-    "mcp:visual-smoke": "node scripts/visual-smoke-mcp.mjs",
-    "lint": "pnpm run lint:no-authored-js && pnpm run lint:docs-contracts && pnpm run lint:tsgo && pnpm run lint:tsgo:harness",
-    "lint:docs-contracts": "bash scripts/check-reference-load-contract.sh",
-    "lint:no-authored-js": "bash scripts/check-no-authored-js.sh",
-    "lint:tsgo": "tsgo --noEmit -p tsconfig.build.json",
-    "lint:tsgo:harness": "pnpm --filter @docx-react-component/react-word-editor-harness lint:tsgo",
-    "generate:token-reference": "node scripts/generate-token-reference.mjs",
-    "check:token-reference": "node scripts/generate-token-reference.mjs --check",
-    "context7:api-check": "bash scripts/context7-export-env.sh run bash scripts/context7-api-check.sh",
-    "wave:doctor": "bash scripts/context7-export-env.sh run pnpm exec wave doctor --json",
-    "wave:dry-run": "bash scripts/context7-export-env.sh run pnpm exec wave launch --lane main --dry-run --no-dashboard",
-    "wave:launch": "bash scripts/context7-export-env.sh run pnpm exec wave launch --lane main",
-    "wave:launch:managed": "bash scripts/wave-launch.sh",
-    "wave:status": "bash scripts/wave-status.sh",
-    "wave:watch": "bash scripts/wave-watch.sh --follow",
-    "wave:dashboard:current": "bash scripts/wave-dashboard-attach.sh current",
-    "wave:dashboard:global": "bash scripts/wave-dashboard-attach.sh global",
-    "harness:dev": "pnpm --filter @docx-react-component/react-word-editor-harness dev"
-  },
   "keywords": [
     "docx",
     "word",
@@ -208,14 +175,36 @@
     "y-protocols": "^1.0.7",
     "yjs": "^13.6.30"
   },
-  "pnpm": {
-    "onlyBuiltDependencies": [
-      "esbuild",
-      "sharp"
-    ],
-    "overrides": {
-      "react": "19.2.4",
-      "react-dom": "19.2.4"
-    }
+  "scripts": {
+    "build": "tsup",
+    "test": "bash scripts/run-workspace-tests.sh",
+    "test:repo": "node scripts/ci-check-layout-engine-version.mjs && node scripts/run-repo-tests.mjs core",
+    "test:repo:all": "node scripts/run-repo-tests.mjs all",
+    "test:repo:optional": "node scripts/run-repo-tests.mjs optional",
+    "test:repo:browser-ui": "node scripts/run-repo-tests.mjs browser-ui",
+    "test:wcag-audit": "node scripts/run-repo-tests.mjs wcag-audit",
+    "test:harness": "pnpm --filter @docx-react-component/react-word-editor-harness test",
+    "test:visual": "VISUAL_SMOKE_PROFILE=bare pnpm exec playwright test --project=chromium",
+    "test:visual:chrome": "VISUAL_SMOKE_PROFILE=chrome-cycle pnpm exec playwright test --project=chromium",
+    "test:visual:redline": "VISUAL_SMOKE_PROFILE=redline-cycle pnpm exec playwright test --project=chromium",
+    "visual:list-runs": "node scripts/visual-smoke-list-runs.mjs",
+    "mcp:visual-smoke": "node scripts/visual-smoke-mcp.mjs",
+    "lint": "pnpm run lint:no-authored-js && pnpm run lint:docs-contracts && pnpm run lint:tsgo && pnpm run lint:tsgo:harness",
+    "lint:docs-contracts": "bash scripts/check-reference-load-contract.sh",
+    "lint:no-authored-js": "bash scripts/check-no-authored-js.sh",
+    "lint:tsgo": "tsgo --noEmit -p tsconfig.build.json",
+    "lint:tsgo:harness": "pnpm --filter @docx-react-component/react-word-editor-harness lint:tsgo",
+    "generate:token-reference": "node scripts/generate-token-reference.mjs",
+    "check:token-reference": "node scripts/generate-token-reference.mjs --check",
+    "context7:api-check": "bash scripts/context7-export-env.sh run bash scripts/context7-api-check.sh",
+    "wave:doctor": "bash scripts/context7-export-env.sh run pnpm exec wave doctor --json",
+    "wave:dry-run": "bash scripts/context7-export-env.sh run pnpm exec wave launch --lane main --dry-run --no-dashboard",
+    "wave:launch": "bash scripts/context7-export-env.sh run pnpm exec wave launch --lane main",
+    "wave:launch:managed": "bash scripts/wave-launch.sh",
+    "wave:status": "bash scripts/wave-status.sh",
+    "wave:watch": "bash scripts/wave-watch.sh --follow",
+    "wave:dashboard:current": "bash scripts/wave-dashboard-attach.sh current",
+    "wave:dashboard:global": "bash scripts/wave-dashboard-attach.sh global",
+    "harness:dev": "pnpm --filter @docx-react-component/react-word-editor-harness dev"
   }
-}
+}

package/src/api/public-types.ts

@@ -524,6 +524,26 @@ export interface SetSelectionOptions {
   silent?: boolean;
 }
 
+export interface ClearHighlightOptions {
+  /**
+   * Range to clear. Defaults to the current document selection when omitted.
+   * Only `{ kind: "range" }` anchors produce a clear; other anchor kinds
+   * (`"node"`, `"detached"`) and collapsed selections are no-ops unless
+   * `expand` widens them into a real range.
+   */
+  range?: EditorAnchorProjection;
+  /**
+   * When `true`, the resolved range is grown outward to cover the full
+   * contiguous highlighted span that touches it before clearing. A text
+   * segment counts as highlighted when `markAttrs.backgroundColor` is a
+   * non-empty string. Expansion scans each paragraph that overlaps the
+   * resolved range independently and stops at paragraph and table-cell
+   * boundaries — it will never leap into a neighboring paragraph or a
+   * different table cell. Defaults to `false`.
+   */
+  expandToFullHighlight?: boolean;
+}
+
 export interface SearchResultSnapshot {
   resultId: string;
   anchor: EditorAnchorProjection;
@@ -1043,6 +1063,14 @@ export interface SurfaceTableCellSnapshot {
   borderRight?: string | null;
   borderBottom?: string | null;
   borderLeft?: string | null;
+  /**
+   * Effective cell padding in twips after applying the cell's direct `tcMar`
+   * and then falling back per-side to table-level `tblCellMar`.
+   */
+  paddingTop?: number | null;
+  paddingRight?: number | null;
+  paddingBottom?: number | null;
+  paddingLeft?: number | null;
   /**
    * R3.a Phase 2: per-cell text-flow direction copied from
    * `TableCellNode.textDirection`. The node-view maps these to CSS
@@ -4058,6 +4086,19 @@ export interface WordReviewEditorRef {
   setFontSize(size: number | null): void;
   setTextColor(color: string | null): void;
   setHighlightColor(color: string | null): void;
+  /**
+   * Clears the highlight (background color) on a range in the currently
+   * active story. The caller's selection is NOT moved — the cursor stays
+   * where the user left it.
+   *
+   * When `options.range` is omitted, the current document selection is used.
+   *
+   * Tracked-changes / suggesting mode is honored: in suggesting mode the
+   * clear is recorded as a property-change suggestion when the resolved
+   * range is one bounded text segment, and is blocked (with a
+   * `command_blocked` event) when the range spans multiple segments.
+   */
+  clearHighlight(options?: ClearHighlightOptions): void;
   setAlignment(alignment: FormattingAlignment): void;
   setParagraphStyle(styleId: string | null): void;
   setTableStyle(styleId: string | null): void;

package/src/io/docx-session.ts

@@ -130,6 +130,7 @@ import type {
   FootnoteCollection,
   HeaderDocument,
   FooterDocument,
+  InlineNode,
   MediaCatalog,
   NumberingCatalog,
   OpaqueFragmentRecord,
@@ -581,15 +582,27 @@ export function loadDocxEditorSession(
       }
 
       const partPath = resolveRelationshipTarget(mainDocumentPath, relationship);
-      const partBytes = sourcePackage.parts.get(partPath)?.bytes;
+      const part = sourcePackage.parts.get(partPath);
+      const partBytes = part?.bytes;
       if (!partBytes) {
         continue;
       }
 
       const xml = decodeUtf8(partBytes);
+      const subPartRelationships = part?.relationships ?? [];
+      const subPartChartPartLookup = createChartPartLookup(
+        sourcePackage,
+        partPath,
+        subPartRelationships,
+      );
       if (ref.kind === "header") {
         const parsedHeaderRevisions = parseRevisionsFromStoryXml(xml);
-        const parsed = parseHeaderXml(xml);
+        const parsed = parseHeaderXml(xml, {
+          relationships: subPartRelationships,
+          mediaParts,
+          sourcePartPath: partPath,
+          chartPartLookup: subPartChartPartLookup,
+        });
         parsedHeaders.push({
           variant: ref.variant,
           partPath,
@@ -621,7 +634,12 @@ export function loadDocxEditorSession(
         sourceHeaderPaths.push({ partPath, relationshipId: ref.relationshipId });
       } else {
         const parsedFooterRevisions = parseRevisionsFromStoryXml(xml);
-        const parsed = parseFooterXml(xml);
+        const parsed = parseFooterXml(xml, {
+          relationships: subPartRelationships,
+          mediaParts,
+          sourcePartPath: partPath,
+          chartPartLookup: subPartChartPartLookup,
+        });
         parsedFooters.push({
           variant: ref.variant,
           partPath,
@@ -775,6 +793,13 @@ export function loadDocxEditorSession(
           )
         : undefined;
 
+    const mergedMedia = mergeSecondaryStoryMediaCatalog(normalizedDocument.media, {
+      headers: parsedHeaders,
+      footers: parsedFooters,
+      footnoteCollection,
+      mediaParts,
+    });
+
     const subParts: SubPartsCatalog | undefined =
       parsedHeaders.length > 0 ||
       parsedFooters.length > 0 ||
@@ -809,7 +834,7 @@ export function loadDocxEditorSession(
       documentId: options.documentId,
       timestamp,
       numbering: parsedNumbering,
-      media: normalizedDocument.media,
+      media: mergedMedia,
       content: normalizedDocument.content,
       subParts,
       parsedStyles,
@@ -1518,16 +1543,28 @@ export async function loadDocxEditorSessionAsync(
       }
 
       const partPath = resolveRelationshipTarget(mainDocumentPath, relationship);
-      const partBytes = sourcePackage.parts.get(partPath)?.bytes;
+      const part = sourcePackage.parts.get(partPath);
+      const partBytes = part?.bytes;
       if (!partBytes) {
         continue;
       }
 
       await scheduler.yield();
       const xml = decodeUtf8(partBytes);
+      const subPartRelationships = part?.relationships ?? [];
+      const subPartChartPartLookup = createChartPartLookup(
+        sourcePackage,
+        partPath,
+        subPartRelationships,
+      );
       if (ref.kind === "header") {
         const parsedHeaderRevisions = parseRevisionsFromStoryXml(xml);
-        const parsed = parseHeaderXml(xml);
+        const parsed = parseHeaderXml(xml, {
+          relationships: subPartRelationships,
+          mediaParts,
+          sourcePartPath: partPath,
+          chartPartLookup: subPartChartPartLookup,
+        });
         parsedHeaders.push({
           variant: ref.variant,
           partPath,
@@ -1559,7 +1596,12 @@ export async function loadDocxEditorSessionAsync(
         sourceHeaderPaths.push({ partPath, relationshipId: ref.relationshipId });
       } else {
         const parsedFooterRevisions = parseRevisionsFromStoryXml(xml);
-        const parsed = parseFooterXml(xml);
+        const parsed = parseFooterXml(xml, {
+          relationships: subPartRelationships,
+          mediaParts,
+          sourcePartPath: partPath,
+          chartPartLookup: subPartChartPartLookup,
+        });
         parsedFooters.push({
           variant: ref.variant,
           partPath,
@@ -1715,6 +1757,13 @@ export async function loadDocxEditorSessionAsync(
           )
         : undefined;
 
+    const mergedMedia = mergeSecondaryStoryMediaCatalog(normalizedDocument.media, {
+      headers: parsedHeaders,
+      footers: parsedFooters,
+      footnoteCollection,
+      mediaParts,
+    });
+
     const subParts: SubPartsCatalog | undefined =
       parsedHeaders.length > 0 ||
       parsedFooters.length > 0 ||
@@ -1749,7 +1798,7 @@ export async function loadDocxEditorSessionAsync(
       documentId: options.documentId,
       timestamp,
       numbering: parsedNumbering,
-      media: normalizedDocument.media,
+      media: mergedMedia,
       content: normalizedDocument.content,
       subParts,
       parsedStyles,
@@ -2644,6 +2693,116 @@ function recordImportedOpaqueBlock(
   };
 }
 
+function mergeSecondaryStoryMediaCatalog(
+  media: MediaCatalog,
+  input: {
+    headers: readonly HeaderDocument[];
+    footers: readonly FooterDocument[];
+    footnoteCollection?: FootnoteCollection;
+    mediaParts: ReadonlyMap<string, { path: string; contentType: string }>;
+  },
+): MediaCatalog {
+  const items = { ...media.items };
+  let changed = false;
+
+  const registerMediaItem = (
+    mediaId: string,
+    record: Omit<NonNullable<MediaCatalog["items"][string]>, "mediaId">,
+  ) => {
+    const existing = items[mediaId];
+    items[mediaId] = existing
+      ? {
+          ...existing,
+          ...record,
+          mediaId,
+        }
+      : {
+          mediaId,
+          ...record,
+        };
+    changed = true;
+  };
+
+  const visitInline = (node: InlineNode) => {
+    if (node.type === "image") {
+      const packagePartName = `/${node.mediaId.slice("media:".length)}`;
+      registerMediaItem(node.mediaId, {
+        contentType:
+          items[node.mediaId]?.contentType ??
+          input.mediaParts.get(packagePartName)?.contentType ??
+          "application/octet-stream",
+        filename: packagePartName.slice(packagePartName.lastIndexOf("/") + 1) || "image.bin",
+        packagePartName,
+        ...(node.altText ? { altText: node.altText } : {}),
+      });
+      return;
+    }
+    if (node.type === "drawing_frame" && node.content.type === "picture" && node.content.mediaId) {
+      const packagePartName =
+        typeof node.content.packagePartName === "string" && node.content.packagePartName.length > 0
+          ? node.content.packagePartName
+          : `/${node.content.mediaId.slice("media:".length)}`;
+      registerMediaItem(node.content.mediaId, {
+        contentType:
+          items[node.content.mediaId]?.contentType ??
+          input.mediaParts.get(packagePartName)?.contentType ??
+          "application/octet-stream",
+        filename: packagePartName.slice(packagePartName.lastIndexOf("/") + 1) || "image.bin",
+        packagePartName,
+        relationshipId: node.content.blipRef,
+        ...(node.anchor.docPr?.descr ? { altText: node.anchor.docPr.descr } : {}),
+        widthEmu: node.anchor.extent.widthEmu,
+        heightEmu: node.anchor.extent.heightEmu,
+      });
+      return;
+    }
+    if (node.type === "hyperlink" || node.type === "field") {
+      for (const child of node.children) {
+        visitInline(child);
+      }
+    }
+  };
+
+  const visitBlocks = (blocks: ReadonlyArray<BlockNode>) => {
+    for (const block of blocks) {
+      if (block.type === "paragraph") {
+        for (const child of block.children) {
+          visitInline(child);
+        }
+        continue;
+      }
+      if (block.type === "table") {
+        for (const row of block.rows) {
+          for (const cell of row.cells) {
+            visitBlocks(cell.children);
+          }
+        }
+        continue;
+      }
+      if (block.type === "sdt" || block.type === "custom_xml") {
+        visitBlocks(block.children);
+      }
+    }
+  };
+
+  for (const header of input.headers) {
+    visitBlocks(header.blocks);
+  }
+  for (const footer of input.footers) {
+    visitBlocks(footer.blocks);
+  }
+  if (input.footnoteCollection) {
+    for (const note of Object.values(input.footnoteCollection.footnotes)) {
+      visitBlocks(note.blocks);
+    }
+    for (const note of Object.values(input.footnoteCollection.endnotes)) {
+      visitBlocks(note.blocks);
+    }
+  }
+
+  return changed ? { ...media, items } : media;
+}
+
 // Canonical model styleId validation pattern — styleIds that don't match
 // are excluded from the catalog to avoid snapshot validation failures.
 const VALID_STYLE_ID = /^[A-Za-z_][A-Za-z0-9._-]{0,127}$/;

package/src/io/export/serialize-footnotes.ts

@@ -37,8 +37,20 @@ export function serializeFootnotesXml(
 ): string {
   const entries = Object.values(collection.footnotes).sort(compareNoteIds);
   const body = [
-    serializeSeparatorStub("footnote", "-1", "separator"),
-    serializeSeparatorStub("footnote", "0", "continuationSeparator"),
+    serializeSeparatorStub(
+      "footnote",
+      "-1",
+      "separator",
+      collection.footnoteSeparators?.separatorParagraphXml,
+      collection.footnoteSeparators?.separatorContent,
+    ),
+    serializeSeparatorStub(
+      "footnote",
+      "0",
+      "continuationSeparator",
+      collection.footnoteSeparators?.continuationSeparatorParagraphXml,
+      collection.footnoteSeparators?.continuationSeparatorContent,
+    ),
     ...entries.map((entry) =>
       serializeNoteDefinition("footnote", entry, revisionsByNoteId[entry.noteId] ?? [])),
   ].join("");
@@ -59,8 +71,20 @@ export function serializeEndnotesXml(
 ): string {
   const entries = Object.values(collection.endnotes).sort(compareNoteIds);
   const body = [
-    serializeSeparatorStub("endnote", "-1", "separator"),
-    serializeSeparatorStub("endnote", "0", "continuationSeparator"),
+    serializeSeparatorStub(
+      "endnote",
+      "-1",
+      "separator",
+      collection.endnoteSeparators?.separatorParagraphXml,
+      collection.endnoteSeparators?.separatorContent,
+    ),
+    serializeSeparatorStub(
+      "endnote",
+      "0",
+      "continuationSeparator",
+      collection.endnoteSeparators?.continuationSeparatorParagraphXml,
+      collection.endnoteSeparators?.continuationSeparatorContent,
+    ),
     ...entries.map((entry) =>
       serializeNoteDefinition("endnote", entry, revisionsByNoteId[entry.noteId] ?? [])),
   ].join("");
@@ -77,9 +101,16 @@ function serializeSeparatorStub(
   kind: "footnote" | "endnote",
   id: string,
   type: "separator" | "continuationSeparator",
+  paragraphXml?: string,
+  content?: string,
 ): string {
   const tag = kind === "footnote" ? "w:footnote" : "w:endnote";
-  return `<${tag} w:type="${type}" w:id="${id}"><w:p/></${tag}>`;
+  const body = paragraphXml && paragraphXml.length > 0
+    ? paragraphXml
+    : content && content.length > 0
+      ? `<w:p>${content}</w:p>`
+      : "<w:p/>";
+  return `<${tag} w:type="${type}" w:id="${id}">${body}</${tag}>`;
 }
 
 function serializeNoteDefinition(

package/src/io/export/serialize-headers-footers.ts

@@ -263,6 +263,13 @@ function serializeInlineNode(node: InlineNode): string {
     case "wordart":
     case "vml_shape":
       return wrapInlineRawXml(node.rawXml);
+    case "drawing_frame": {
+      const { content } = node;
+      if (!("rawXml" in content) || typeof content.rawXml !== "string" || content.rawXml.length === 0) {
+        throw new Error("Cannot safely serialize drawing_frame content in header/footer sub-parts without rawXml.");
+      }
+      return wrapInlineRawXml(content.rawXml);
+    }
     case "ole_embed":
       // OLE in header/footer is rare but legal in OOXML. Relationship
       // tracking for sub-parts is not wired; emit rawXml verbatim

package/src/io/export/serialize-main-document.ts

@@ -675,18 +675,10 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
   if (paragraph.styleId) {
     children.push(`<w:pStyle w:val="${escapeXmlAttribute(paragraph.styleId)}"/>`);
   }
-  if (paragraph.keepNext) {
-    children.push("<w:keepNext/>");
-  }
-  if (paragraph.keepLines) {
-    children.push("<w:keepLines/>");
-  }
-  if (paragraph.pageBreakBefore) {
-    children.push("<w:pageBreakBefore/>");
-  }
-  if (paragraph.widowControl) {
-    children.push("<w:widowControl/>");
-  }
+  pushOnOffParagraphProperty(children, "keepNext", paragraph.keepNext);
+  pushOnOffParagraphProperty(children, "keepLines", paragraph.keepLines);
+  pushOnOffParagraphProperty(children, "pageBreakBefore", paragraph.pageBreakBefore);
+  pushOnOffParagraphProperty(children, "widowControl", paragraph.widowControl);
   if (paragraph.outlineLevel !== undefined) {
     children.push(`<w:outlineLvl w:val="${paragraph.outlineLevel}"/>`);
   }
@@ -738,12 +730,8 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
       children.push(shadingXml);
     }
   }
-  if (paragraph.bidi) {
-    children.push("<w:bidi/>");
-  }
-  if (paragraph.suppressLineNumbers) {
-    children.push("<w:suppressLineNumbers/>");
-  }
+  pushOnOffParagraphProperty(children, "bidi", paragraph.bidi);
+  pushOnOffParagraphProperty(children, "suppressLineNumbers", paragraph.suppressLineNumbers);
   if (paragraph.cnfStyle) {
     children.push(`<w:cnfStyle w:val="${escapeXmlAttribute(paragraph.cnfStyle)}"/>`);
   }
@@ -811,9 +799,28 @@ function serializeParagraphShading(shading: ParagraphNode["shading"]): string {
   } else if (shading.val === "clear") {
     attrs.push(`w:fill="auto"`);
   }
+  if (shading.themeFill) attrs.push(`w:themeFill="${escapeXmlAttribute(shading.themeFill)}"`);
+  if (shading.themeFillTint) attrs.push(`w:themeFillTint="${escapeXmlAttribute(shading.themeFillTint)}"`);
+  if (shading.themeFillShade) attrs.push(`w:themeFillShade="${escapeXmlAttribute(shading.themeFillShade)}"`);
+  if (shading.themeColor) attrs.push(`w:themeColor="${escapeXmlAttribute(shading.themeColor)}"`);
+  if (shading.themeColorTint) attrs.push(`w:themeColorTint="${escapeXmlAttribute(shading.themeColorTint)}"`);
+  if (shading.themeColorShade) attrs.push(`w:themeColorShade="${escapeXmlAttribute(shading.themeColorShade)}"`);
   return attrs.length > 0 ? `<w:shd ${attrs.join(" ")}/>` : "";
 }
 
+function pushOnOffParagraphProperty(
+  children: string[],
+  localName: string,
+  value: boolean | undefined,
+): void {
+  if (value === undefined) return;
+  children.push(
+    value
+      ? `<w:${localName}/>`
+      : `<w:${localName} w:val="false"/>`,
+  );
+}
+
 function serializeRunPropertiesFromMarks(marks: TextMark[] | undefined): string {
   return serializeRunProperties(marks);
 }

package/src/io/export/serialize-paragraph-formatting.ts

@@ -61,6 +61,12 @@ function buildShadingXml(s: ParagraphShading | undefined): string {
   if (s.val) attrs.push(`w:val="${escXml(s.val)}"`);
   if (s.color) attrs.push(`w:color="${escXml(s.color)}"`);
   if (s.fill) attrs.push(`w:fill="${escXml(s.fill)}"`);
+  if (s.themeFill) attrs.push(`w:themeFill="${escXml(s.themeFill)}"`);
+  if (s.themeFillTint) attrs.push(`w:themeFillTint="${escXml(s.themeFillTint)}"`);
+  if (s.themeFillShade) attrs.push(`w:themeFillShade="${escXml(s.themeFillShade)}"`);
+  if (s.themeColor) attrs.push(`w:themeColor="${escXml(s.themeColor)}"`);
+  if (s.themeColorTint) attrs.push(`w:themeColorTint="${escXml(s.themeColorTint)}"`);
+  if (s.themeColorShade) attrs.push(`w:themeColorShade="${escXml(s.themeColorShade)}"`);
   return attrs.length > 0 ? `<w:shd ${attrs.join(" ")}/>` : "";
 }