@beyondwork/docx-react-component 1.0.36 → 1.0.37

package/README.md

@@ -1,17 +1,19 @@
 ---
-title: React OOXML Office
-summary: Shipped docx package landing page and primary router into consumer, wrapper, agent, and maintainer documentation.
+title: Beyond Work Components
+summary: Backoffice work components landing page and primary router into consumer, wrapper, agent, and maintainer documentation.
 audience: consumer, wrapper, agent, maintainer
 stability: main-path
 docRole: main-path
 canonical: true
 ---
 
-# React OOXML Office
+# Beyond Work Components
 
 [![CI](https://github.com/bwllaming/React-OOXML-Office/actions/workflows/ci.yml/badge.svg?branch=main)](https://github.com/bwllaming/React-OOXML-Office/actions/workflows/ci.yml)
 
-`@beyondwork/docx-react-component` is the shipped product in this repository: a fidelity-first React docx editor centered on `WordReviewEditor`.
+This repository builds **backoffice work components** for the [Beyond Work](https://beyondwork.ai) runtime — embeddable, composable modules that handle document editing, review workflows, data processing, and task automation inside enterprise workspaces.
+
+The design principle across every component: **advanced tasks should be equally easy for AI agents and human users.** Every capability exposed through the UI is also available through a structured API. Every API is designed so an agent can inspect state, reason about it, and act on it without special accommodation. Humans and agents share the same runtime, the same commands, the same read models, and the same fidelity guarantees.
 
 ## Use This README For
 
@@ -19,11 +21,70 @@ canonical: true
 - installing the package
 - finding the right documentation lane quickly
 
-Do not use this README as the full package contract. The canonical consumer path starts in `docs/README.md`, `docs/reference/public-api.md`, and `docs/reference/integration-guide.md`.
+Do not use this README as the full package contract. The canonical consumer path starts in `docs/README.md`, [`docs/reference/public-api.md`](docs/reference/public-api.md), and [`docs/reference/integration-guide.md`](docs/reference/integration-guide.md).
+
+## Components
+
+### Document Editor (`@beyondwork/docx-react-component`)
+
+A fidelity-first React `.docx` editor centered on `WordReviewEditor`. Built for legal review, contract negotiation, and any workflow where documents need to survive a round-trip through Microsoft Word without damage.
+
+**Capabilities:**
+- Full tracked-change and comment support (add, resolve, accept, reject)
+- Suggesting mode where every edit automatically becomes a tracked change
+- Round-trip OOXML preservation — open, edit, export, reopen in Word without repair prompts
+- Workflow overlays with scope-based editing constraints
+- Runtime-backed read models for document structure, review state, selection, compatibility, and fields
+- Document comparison with LCS-based diffing and redline export
+- Legal document analysis (bookmarks, cross-references, defined terms, signature blocks)
+- Real-time collaboration via Yjs
+
+**Human-AI parity in practice:**
+- The human clicks "Add Comment" on selected text; the agent calls `addComment({ anchor, body })` on the same selection
+- The human reviews tracked changes in the sidebar; the agent reads `getTrackedChanges()` and makes the same accept/reject decisions
+- The human exports via toolbar; the agent calls `exportDocx()` after the same `getCompatibilityReport()` check
+- Workflow overlays constrain both humans and agents identically — `getInteractionGuardSnapshot()` is the single source of posture truth
+- The AI action policy module gates 37 discrete agent operations with risk classification and context validation
+
+### Workblocks
+
+Composable task modules that automate business processes. Each workblock is a self-contained package of Python backend logic, React UI components, and a declarative task graph defined in `manifest.yaml`. They execute on the Beyond Work platform via Temporal workflows.
+
+**Categories:**
+- **Document processing** — invoice extraction, PDF template OCR, bulk processing, email-to-action
+- **AI agents** — explore, flow debugging, data querying, task launching, authoring
+- **Analytics** — execution history, company insights, timeline queries
+- **Learning** — human correction capture, learning set curation, embedding management
+- **Infrastructure** — registry, health checks, credential management (9 types)
+
+**Human-AI parity in practice:**
+- Users create workblocks through VS Code Studio with prompts and visual editing; authoring agents create them through the same manifest schema and file tools
+- Users validate invoice fields in a React form; agents validate the same fields through typed task inputs/outputs
+- Both humans and agents operate within the same workblock execution engine — same task graph, same data flow, same error handling
+
+## The Beyond Work Runtime
+
+These components plug into a four-layer platform:
+
+```
+User-Facing (Layer 4)
+  neui (Next.js 15), bport (BFF), MCP server, VS Code extension
+       |
+Workblocks (Layer 3)
+  20+ composable task modules: agents, data processing, credentials
+       |
+Platform Services (Layer 2)
+  bworker (Go), modelproxy (LiteLLM), registry, pythonworker, Temporal
+       |
+AWS Infrastructure (Layer 1)
+  EKS, Crossplane, Terraform, PostgreSQL, Redis, Qdrant, S3, SQS
+```
+
+The document editor lives at Layer 4 as an embeddable surface. Workblocks live at Layer 3 and are orchestrated by the platform. Both expose their capabilities symmetrically to human UIs and agent APIs.
 
 ## Current Package Reality
 
-The repository may also carry broader branch-local work, but the shipped contract today is still docx-first:
+The shipped contract today is docx-first:
 
 - `docx` is the only implemented and shipped runtime contract
 - `xlsx` is planned work, not part of the current package contract
@@ -93,11 +154,11 @@ The current shipped ESM exports include:
   - `@beyondwork/docx-react-component/tailwind`
   - `@beyondwork/docx-react-component/api/public-types`
 
-Use `docs/reference/public-api.md` and `docs/reference/public-api.manifest.json` for the current contract inventory and stability guidance.
+Use [`docs/reference/public-api.md`](docs/reference/public-api.md) and `docs/reference/public-api.manifest.json` for the current contract inventory and stability guidance.
 
 ## Product Contract
 
-For every format the repo eventually ships, the standard is:
+For every component this repo ships, the standard is:
 
 > Open -> edit -> save -> reopen in the host application without damage.
 
@@ -158,7 +219,38 @@ Current integration honesty:
 
 The CCEP corpus is kept on `main` as a maintainer-safe smoke-doc source set for agreement-heavy validation and wrapper or agent benchmarking.
 
-Maintainer prompts, operator runbooks, and proof/closure material remain important, but they are not the first reading path for package consumers.
+### Technical Wiki
+
+- [`docs/wiki/`](docs/wiki/) — Feature-by-feature technical documentation (25+ topics covering OOXML, ProseMirror, runtime, and platform)
+
+## Agent Integration
+
+Agents consume the editor through a consistent pipeline:
+
+```
+inspect --> locate --> mutate --> validate --> export
+```
+
+Beyond Work platform agents extend this with propose/approve gates:
+
+```
+inspect --> locate --> propose --> approve --> mutate --> validate --> export
+```
+
+The package exposes purpose-built read models — not a monolithic state dump:
+
+| Read model | Getter | Purpose |
+|---|---|---|
+| Document surface | `getRenderSnapshot()` | Structure, blocks, text, selection |
+| Comments | `getComments()` | Thread state, resolution, anchors |
+| Tracked changes | `getTrackedChanges()` | Revision inventory, actionability |
+| Workflow scope | `getWorkflowScopeSnapshot()` | Scope boundaries, work items, mode |
+| Interaction guard | `getInteractionGuardSnapshot()` | Effective mode, blocked reasons |
+| Compatibility | `getCompatibilityReport()` | Export risk assessment |
+| Warnings | `getWarnings()` | Active fidelity or mutation warnings |
+| Fields | `getFieldSnapshot()` | Field posture and refresh state |
+
+Agents should read the narrow snapshot that answers the next question, not pull the full render snapshot for every decision.
 
 ## Packaging And Release
 
@@ -181,9 +273,7 @@ Maintainer prompts, operator runbooks, and proof/closure material remain importa
 
 ## Guiding Principle
 
-This repo is not trying to become a generic office clone.
-
-It is building fidelity-first office-document runtimes with explicit preservation and calm, reviewable UI.
+This repo builds backoffice work components where humans and AI agents are first-class peers. Every capability is designed for both audiences from the start — not bolted on for one after the other. The result is tools that are powerful enough for complex enterprise workflows and structured enough that an agent can operate them safely and predictably.
 
 ## Using the package
 
@@ -663,7 +753,7 @@ Fired when the document transitions between clean and dirty (unsaved) states.
 
 #### `story_changed`
 
-Fired when the user navigates between document stories (e.g. main body → header/footer).
+Fired when the user navigates between document stories (e.g. main body -> header/footer).
 
 ```ts
 {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@beyondwork/docx-react-component",
   "publisher": "beyondwork",
-  "version": "1.0.36",
+  "version": "1.0.37",
   "description": "Embeddable React Word (docx) editor with review, comments, tracked changes, and round-trip OOXML fidelity.",
   "type": "module",
   "sideEffects": [

package/src/api/package-version.ts

@@ -0,0 +1,13 @@
+/**
+ * Package version string — pinned to package.json `version`.
+ *
+ * Consumed by export paths that embed a producer identity (e.g.
+ * `/docProps/app.xml` `<Application>` tag) so exported packages can be
+ * traced back to the exact runtime release.
+ *
+ * Keep this in lockstep with `package.json#version`. A future enhancement
+ * would be to generate this file from package.json at build time; for now
+ * the string is committed directly so the runtime works without a build
+ * step for tests.
+ */
+export const PACKAGE_VERSION = "1.0.36";

package/src/api/public-types.ts

@@ -1,4 +1,26 @@
 import type { PersistedEditorSnapshot as RuntimePersistedEditorSnapshot } from "../core/state/editor-state.ts";
+import type { WordReviewEditorLayoutFacet } from "../runtime/layout/public-facet.ts";
+
+export type {
+  WordReviewEditorLayoutFacet,
+  LayoutFacetEvent,
+  LayoutFacetInvalidationReason,
+  PublicBlockFragment,
+  PublicBlockMeasurement,
+  PublicFieldDirtinessReport,
+  PublicLineBox,
+  PublicMeasurementFidelity,
+  PublicNoteAllocation,
+  PublicPageAnchor,
+  PublicPageNode,
+  PublicPageRegion,
+  PublicPageRegions,
+  PublicPageSpan,
+  PublicResolvedPageStories,
+  PublicResolvedParagraphFormatting,
+  PublicResolvedRunFormatting,
+  PublicSectionNode,
+} from "../runtime/layout/public-facet.ts";
 
 export type FieldFamily = import("../model/canonical-document.ts").FieldFamily;
 export type FieldRefreshStatus = import("../model/canonical-document.ts").FieldRefreshStatus;
@@ -767,6 +789,7 @@ export type SurfaceBlockSnapshot =
       keepNext?: boolean;
       keepLines?: boolean;
       pageBreakBefore?: boolean;
+      widowControl?: boolean;
       outlineLevel?: number;
       bidi?: boolean;
       suppressLineNumbers?: boolean;
@@ -1916,6 +1939,19 @@ export interface WordReviewEditorRef {
   getRuntimeContextAnalytics(
     query?: RuntimeContextAnalyticsQuery,
   ): RuntimeContextAnalyticsSnapshot | null;
+
+  /**
+   * Runtime-owned layout facet.
+   *
+   * The ergonomic surface for walking the page graph, resolving offsets to
+   * fragments, inspecting formatting, and observing layout events.  Prefer
+   * this over `getPageLayoutSnapshot()` / `getDocumentNavigationSnapshot()`
+   * for new code — those remain as thin adapters for compatibility.
+   *
+   * Returns `null` only when the runtime is still loading; once the `ready`
+   * event has fired, the facet is always available.
+   */
+  readonly layout: WordReviewEditorLayoutFacet;
 }
 
 export type WordReviewEditorChromePreset =
@@ -1970,3 +2006,50 @@ export interface WordReviewEditorChromeVisibility {
   statusBar: boolean;
   reviewRail: boolean;
 }
+
+// ---------------------------------------------------------------------------
+// Bounded local-first predicted-text lane contract
+// ---------------------------------------------------------------------------
+
+export type TextCommandAckKind =
+  | "equivalent"
+  | "adjusted"
+  | "rejected"
+  | "structural-divergence";
+
+export interface ScopeTagTouch {
+  /** Tag family: "comment" | "revision" | "field" | "bookmark" | "sdt" | "opaque" | custom string. */
+  tagType: string;
+  tagId: string;
+  behavior: "extended" | "trimmed" | "split" | "detached" | "unchanged";
+  range: { from: number; to: number };
+}
+
+/**
+ * Sync reconciliation result returned by `DocumentRuntime.applyActiveStoryTextCommand`.
+ *
+ * The predicted-text lane in the mounted editor dispatches a local PM transaction,
+ * then calls the runtime synchronously. The ack tells the lane how to reconcile:
+ *
+ * - `equivalent`: runtime accepted the edit and produced the same text shape;
+ *   the lane can skip the Lane A PM rebuild entirely.
+ * - `adjusted`: runtime accepted but normalized or added review marks; the lane
+ *   patches the affected range from the canonical snapshot.
+ * - `rejected`: runtime blocked the edit (workflow, protection, read-only);
+ *   the lane rolls back the predicted PM range from its pre-image.
+ * - `structural-divergence`: the command affected structure beyond the
+ *   predicted range; the lane falls back to a full PM rebuild.
+ */
+export interface TextCommandAck {
+  kind: TextCommandAckKind;
+  /** Opaque id echoed back from the predicted op. Undefined for canonical callers. */
+  opId?: string;
+  /** Revision token of the document AFTER commit. Empty string when `kind === "rejected"`. */
+  newRevisionToken: string;
+  /** For `adjusted`: the canonical range that differs from the prediction. */
+  adjustedRange?: { fromRuntime: number; toRuntime: number };
+  /** For `rejected`: the blocked reasons. */
+  blockedReasons?: readonly { code: string; message: string }[];
+  /** Tag touches the runtime applied so the lane can redraw decorations without a PM rebuild. */
+  scopeTagTouches?: readonly ScopeTagTouch[];
+}

package/src/core/commands/index.ts

@@ -35,6 +35,7 @@ import {
 } from "./text-commands.ts";
 import type { RevisionRecord as CanonicalRevisionRecord } from "../../model/canonical-document.ts";
 import { remapCommentThreads } from "../../review/store/comment-remapping.ts";
+import { collectScopeTagTouches } from "../../review/store/scope-tag-diff.ts";
 import { applyRevisionRuntimeCommand } from "../../runtime/revision-runtime.ts";
 import type { RevisionStore } from "../../review/store/revision-store.ts";
 
@@ -878,6 +879,22 @@ function applyTextCommand(
     result.mapping,
   );
 
+  const scopeTagTouches = collectScopeTagTouches(
+    state.document.review.comments,
+    reviewState.document.review.comments,
+    state.document.review.revisions,
+    reviewState.document.review.revisions,
+  );
+  const mappingWithTouches: TransactionMapping = scopeTagTouches.length > 0
+    ? {
+        ...result.mapping,
+        metadata: {
+          ...(result.mapping.metadata ?? {}),
+          scopeTagTouches,
+        },
+      }
+    : result.mapping;
+
   return createTransaction(
     {
       ...state,
@@ -892,7 +909,7 @@ function applyTextCommand(
     {
       historyBoundary: "push",
       markDirty: true,
-      mapping: result.mapping,
+      mapping: mappingWithTouches,
       effects: reviewState.effects,
     },
   );

package/src/core/selection/mapping.ts

@@ -51,6 +51,12 @@ export interface TransactionMapping {
     affectsComments?: boolean;
     affectsRevisions?: boolean;
     affectsOpaqueFragments?: boolean;
+    /**
+     * Review-tag touches performed during this transaction. Used by the
+     * predicted-text lane's reconciler to classify acks as `adjusted` vs
+     * `structural-divergence` without re-walking the document.
+     */
+    scopeTagTouches?: readonly import("../../api/public-types.ts").ScopeTagTouch[];
     [key: string]: unknown;
   };
 }

package/src/io/docx-session.ts

@@ -67,6 +67,7 @@ import {
   createBrokenRelationshipIssue,
   createMissingPartIssue,
 } from "./opc/corrupt-package.ts";
+import { buildAppPropertiesXml } from "./export/build-app-properties-xml.ts";
 import { createExportSession } from "./export/export-session.ts";
 import { serializeMainDocument } from "./export/serialize-main-document.ts";
 import {
@@ -2909,10 +2910,31 @@ function serializeCanonicalDocumentForExport(document: CanonicalDocumentEnvelope
   });
 }
 
+/**
+ * Read a Node-style environment variable without referencing the Node-only
+ * `process` global in the production build (which excludes @types/node).
+ * Returns `undefined` in browser environments or when the var is unset.
+ */
+function readNodeEnvVar(name: string): string | undefined {
+  const proc = (globalThis as unknown as {
+    process?: { env?: Record<string, string | undefined> };
+  }).process;
+  return proc?.env?.[name];
+}
+
 function canReuseSourceBytesForCurrentDocument(
   state: ImportedDocxState,
   document: CanonicalDocumentEnvelope,
 ): boolean {
+  // The validator-loop CI harness (§1 / §7) needs to exercise the full
+  // serializer pipeline — including A.1 / A.2 / A.3 / A.6 / A.7 / A.8 /
+  // A.9 fixes — so it sets DOCX_VALIDATOR_FORCE_REGEN=1 to disable the
+  // fast-path byte-reuse. Never set this flag in production; it forces a
+  // full XML regeneration on every export and is only used by the CCEP
+  // validator harness to prove our serializer's correctness.
+  if (readNodeEnvVar("DOCX_VALIDATOR_FORCE_REGEN") === "1") {
+    return false;
+  }
   if (requiresHostMetadataNormalization(state.sourcePackage, state.sourceDocumentPartPath)) {
     return false;
   }
@@ -3108,15 +3130,8 @@ function buildCorePropertiesXml(document: CanonicalDocumentEnvelope): string {
   ].join("\n");
 }
 
-function buildAppPropertiesXml(): string {
-  return [
-    `<?xml version="1.0" encoding="UTF-8" standalone="yes"?>`,
-    `<Properties xmlns="http://schemas.openxmlformats.org/officeDocument/2006/extended-properties" xmlns:vt="http://schemas.openxmlformats.org/officeDocument/2006/docPropsVTypes">`,
-    `  <Application>React OOXML Office</Application>`,
-    `  <AppVersion>1.0</AppVersion>`,
-    `</Properties>`,
-  ].join("\n");
-}
+// buildAppPropertiesXml moved to src/io/export/build-app-properties-xml.ts
+// per close-render-fidelity §2 A.5. Re-import as `buildAppPropertiesXmlFn`.
 
 function xmlNode(tagName: string, value: string | undefined): string | undefined {
   if (typeof value !== "string" || value.length === 0) {

package/src/io/export/build-app-properties-xml.ts

@@ -0,0 +1,88 @@
+/**
+ * build-app-properties-xml — synthesises `/docProps/app.xml` for the export.
+ *
+ * Mirrors `buildCorePropertiesXml` (in `docx-session.ts`) but targets the
+ * `extended-properties` namespace. Emitted once per export when the source
+ * package does not already carry a valid app.xml part with the correct
+ * content type.
+ *
+ * Required by:
+ *   docs/plans/close-render-fidelity.md §2 A.5
+ *
+ * Schema shape (ECMA-376 Part 1, Office Extended properties):
+ *   <Properties xmlns="…/extended-properties" xmlns:vt="…/docPropsVTypes">
+ *     <Application>@beyondwork/docx-react-component/<pkg.version></Application>
+ *     <AppVersion>1.0</AppVersion>
+ *     <Pages>0</Pages>
+ *     <Words>0</Words>
+ *     <Characters>0</Characters>
+ *     <Lines>0</Lines>
+ *     <Paragraphs>0</Paragraphs>
+ *   </Properties>
+ *
+ * Zero counts are acceptable per the ECMA schema — Word-authoritative counts
+ * are recomputed at open time by the hosting application. A future §4 pass
+ * can replace these with canonical-derived counts without changing the XML
+ * shape.
+ */
+
+import { PACKAGE_VERSION } from "../../api/package-version.ts";
+
+export const APP_PROPERTIES_NAMESPACE =
+  "http://schemas.openxmlformats.org/officeDocument/2006/extended-properties";
+export const APP_PROPERTIES_VT_NAMESPACE =
+  "http://schemas.openxmlformats.org/officeDocument/2006/docPropsVTypes";
+
+export interface AppPropertiesStats {
+  /** Rendered page count; zero is a valid placeholder. */
+  pages?: number;
+  /** Word count. */
+  words?: number;
+  /** Character count. */
+  characters?: number;
+  /** Line count. */
+  lines?: number;
+  /** Paragraph count. */
+  paragraphs?: number;
+  /** App-version string override; defaults to the package version. */
+  appVersion?: string;
+  /** Application identifier override; defaults to package.json name@version. */
+  application?: string;
+}
+
+export function buildAppPropertiesXml(
+  stats: AppPropertiesStats = {},
+): string {
+  const application = stats.application ?? defaultApplicationLabel();
+  const appVersion = stats.appVersion ?? PACKAGE_VERSION;
+  const pages = stats.pages ?? 0;
+  const words = stats.words ?? 0;
+  const characters = stats.characters ?? 0;
+  const lines = stats.lines ?? 0;
+  const paragraphs = stats.paragraphs ?? 0;
+
+  return [
+    `<?xml version="1.0" encoding="UTF-8" standalone="yes"?>`,
+    `<Properties xmlns="${APP_PROPERTIES_NAMESPACE}" xmlns:vt="${APP_PROPERTIES_VT_NAMESPACE}">`,
+    `  <Application>${escapeXml(application)}</Application>`,
+    `  <AppVersion>${escapeXml(appVersion)}</AppVersion>`,
+    `  <Pages>${Math.max(0, Math.round(pages))}</Pages>`,
+    `  <Words>${Math.max(0, Math.round(words))}</Words>`,
+    `  <Characters>${Math.max(0, Math.round(characters))}</Characters>`,
+    `  <Lines>${Math.max(0, Math.round(lines))}</Lines>`,
+    `  <Paragraphs>${Math.max(0, Math.round(paragraphs))}</Paragraphs>`,
+    `</Properties>`,
+  ].join("\n");
+}
+
+function defaultApplicationLabel(): string {
+  return `@beyondwork/docx-react-component/${PACKAGE_VERSION}`;
+}
+
+function escapeXml(value: string): string {
+  return value
+    .replace(/&/gu, "&amp;")
+    .replace(/</gu, "&lt;")
+    .replace(/>/gu, "&gt;")
+    .replace(/"/gu, "&quot;");
+}

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

@@ -64,8 +64,13 @@ export interface SerializedCommentDocumentResult {
   skippedCommentIds: string[];
 }
 
+// A.8: emit root attributes in deterministic order (xmlns:* alphabetised,
+// then mc:Ignorable, then other attrs). The sort above happens to produce
+// the same token order `mc < w < w14` + `mc:Ignorable` — keep the literal
+// in sync with renderDeterministicRootAttributes so regenerated docs and
+// comments.xml samples match byte-for-byte when snapshots compare them.
 const DEFAULT_COMMENTS_ROOT_TAG =
-  `<w:comments xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main" xmlns:w14="http://schemas.microsoft.com/office/word/2010/wordml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="w14">`;
+  `<w:comments xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main" xmlns:w14="http://schemas.microsoft.com/office/word/2010/wordml" mc:Ignorable="w14">`;
 const DEFAULT_COMMENTS_EXTENDED_ROOT_TAG =
   `<w15:commentsEx xmlns:w15="http://schemas.microsoft.com/office/word/2012/wordml">`;
 const DEFAULT_COMMENTS_IDS_ROOT_TAG =

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

@@ -16,6 +16,7 @@ import {
   serializeTablePropertiesXml,
   serializeTableRowPropertiesXml,
 } from "./table-properties-xml.ts";
+import { twip } from "./twip.ts";
 
 export const WORD_FOOTNOTES_CONTENT_TYPE =
   "application/vnd.openxmlformats-officedocument.wordprocessingml.footnotes+xml";
@@ -142,7 +143,7 @@ function serializeTable(table: TableNode): string {
   if (table.gridColumns.length > 0) {
     xml += "<w:tblGrid>";
     for (const width of table.gridColumns) {
-      xml += `<w:gridCol w:w="${width}"/>`;
+      xml += `<w:gridCol w:w="${twip(width)}"/>`;
     }
     xml += "</w:tblGrid>";
   }
@@ -194,9 +195,9 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
   }
   if (paragraph.spacing) {
     const attrs: string[] = [];
-    if (paragraph.spacing.before !== undefined) attrs.push(`w:before="${paragraph.spacing.before}"`);
-    if (paragraph.spacing.after !== undefined) attrs.push(`w:after="${paragraph.spacing.after}"`);
-    if (paragraph.spacing.line !== undefined) attrs.push(`w:line="${paragraph.spacing.line}"`);
+    if (paragraph.spacing.before !== undefined) attrs.push(`w:before="${twip(paragraph.spacing.before)}"`);
+    if (paragraph.spacing.after !== undefined) attrs.push(`w:after="${twip(paragraph.spacing.after)}"`);
+    if (paragraph.spacing.line !== undefined) attrs.push(`w:line="${twip(paragraph.spacing.line)}"`);
     if (paragraph.spacing.lineRule) attrs.push(`w:lineRule="${escapeAttribute(paragraph.spacing.lineRule)}"`);
     if (attrs.length > 0) {
       parts.push(`<w:spacing ${attrs.join(" ")}/>`);
@@ -204,10 +205,10 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
   }
   if (paragraph.indentation) {
     const attrs: string[] = [];
-    if (paragraph.indentation.left !== undefined) attrs.push(`w:left="${paragraph.indentation.left}"`);
-    if (paragraph.indentation.right !== undefined) attrs.push(`w:right="${paragraph.indentation.right}"`);
-    if (paragraph.indentation.firstLine !== undefined) attrs.push(`w:firstLine="${paragraph.indentation.firstLine}"`);
-    if (paragraph.indentation.hanging !== undefined) attrs.push(`w:hanging="${paragraph.indentation.hanging}"`);
+    if (paragraph.indentation.left !== undefined) attrs.push(`w:left="${twip(paragraph.indentation.left)}"`);
+    if (paragraph.indentation.right !== undefined) attrs.push(`w:right="${twip(paragraph.indentation.right)}"`);
+    if (paragraph.indentation.firstLine !== undefined) attrs.push(`w:firstLine="${twip(paragraph.indentation.firstLine)}"`);
+    if (paragraph.indentation.hanging !== undefined) attrs.push(`w:hanging="${twip(paragraph.indentation.hanging)}"`);
     if (attrs.length > 0) {
       parts.push(`<w:ind ${attrs.join(" ")}/>`);
     }
@@ -330,7 +331,7 @@ function buildRunPropertiesXml(marks: TextMark[] | undefined): string {
         );
         break;
       case "fontSize":
-        parts.push(`<w:sz w:val="${mark.val}"/>`);
+        parts.push(`<w:sz w:val="${twip(mark.val)}"/>`);
         break;
       case "textColor":
         parts.push(`<w:color w:val="${escapeAttribute(mark.color)}"/>`);

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

@@ -16,6 +16,7 @@ import {
   serializeTablePropertiesXml,
   serializeTableRowPropertiesXml,
 } from "./table-properties-xml.ts";
+import { twip } from "./twip.ts";
 
 export const WORD_HEADER_CONTENT_TYPE =
   "application/vnd.openxmlformats-officedocument.wordprocessingml.header+xml";
@@ -132,7 +133,7 @@ function serializeTable(table: TableNode): string {
   if (table.gridColumns.length > 0) {
     xml += "<w:tblGrid>";
     for (const width of table.gridColumns) {
-      xml += `<w:gridCol w:w="${width}"/>`;
+      xml += `<w:gridCol w:w="${twip(width)}"/>`;
     }
     xml += "</w:tblGrid>";
   }
@@ -182,19 +183,19 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
   if (paragraph.spacing) {
     const s = paragraph.spacing;
     const attrs: string[] = [];
-    if (s.before !== undefined) attrs.push(`w:before="${s.before}"`);
-    if (s.after !== undefined) attrs.push(`w:after="${s.after}"`);
-    if (s.line !== undefined) attrs.push(`w:line="${s.line}"`);
+    if (s.before !== undefined) attrs.push(`w:before="${twip(s.before)}"`);
+    if (s.after !== undefined) attrs.push(`w:after="${twip(s.after)}"`);
+    if (s.line !== undefined) attrs.push(`w:line="${twip(s.line)}"`);
     if (s.lineRule) attrs.push(`w:lineRule="${escapeAttribute(s.lineRule)}"`);
     if (attrs.length > 0) parts.push(`<w:spacing ${attrs.join(" ")}/>`);
   }
   if (paragraph.indentation) {
     const ind = paragraph.indentation;
     const attrs: string[] = [];
-    if (ind.left !== undefined) attrs.push(`w:left="${ind.left}"`);
-    if (ind.right !== undefined) attrs.push(`w:right="${ind.right}"`);
-    if (ind.firstLine !== undefined) attrs.push(`w:firstLine="${ind.firstLine}"`);
-    if (ind.hanging !== undefined) attrs.push(`w:hanging="${ind.hanging}"`);
+    if (ind.left !== undefined) attrs.push(`w:left="${twip(ind.left)}"`);
+    if (ind.right !== undefined) attrs.push(`w:right="${twip(ind.right)}"`);
+    if (ind.firstLine !== undefined) attrs.push(`w:firstLine="${twip(ind.firstLine)}"`);
+    if (ind.hanging !== undefined) attrs.push(`w:hanging="${twip(ind.hanging)}"`);
     if (attrs.length > 0) parts.push(`<w:ind ${attrs.join(" ")}/>`);
   }
   if (paragraph.alignment) {
@@ -203,7 +204,7 @@ function buildParagraphPropertiesXml(paragraph: ParagraphNode): string {
   if (paragraph.tabStops && paragraph.tabStops.length > 0) {
     const tabsXml = paragraph.tabStops.map((tab) => {
       const leaderAttr = tab.leader ? ` w:leader="${escapeAttribute(tab.leader)}"` : "";
-      return `<w:tab w:val="${tab.align}" w:pos="${tab.position}"${leaderAttr}/>`;
+      return `<w:tab w:val="${tab.align}" w:pos="${twip(tab.position)}"${leaderAttr}/>`;
     }).join("");
     parts.push(`<w:tabs>${tabsXml}</w:tabs>`);
   }
@@ -303,7 +304,7 @@ function buildRunPropertiesXml(marks: TextMark[] | undefined): string {
         parts.push(`<w:rFonts w:ascii="${escapeAttribute(mark.val)}" w:hAnsi="${escapeAttribute(mark.val)}"/>`);
         break;
       case "fontSize":
-        parts.push(`<w:sz w:val="${mark.val}"/>`);
+        parts.push(`<w:sz w:val="${twip(mark.val)}"/>`);
         break;
       case "textColor":
         parts.push(`<w:color w:val="${escapeAttribute(mark.color)}"/>`);