@beyondwork/docx-react-component 1.0.120 → 1.0.122

package/dist/{chunk-4JNUMMM7.js → chunk-PGGPPZ65.js}

@@ -642,6 +642,9 @@ function validateDocumentNode(value, path, issues, context = "root") {
       }
       return;
     case "table_row":
+      if (record.sourceRef !== void 0) {
+        validateCanonicalSourceRef(record.sourceRef, `${path}.sourceRef`, issues);
+      }
       if (!Array.isArray(record.cells)) {
         issues.push({ path: `${path}.cells`, message: "cells must be an array." });
       } else {
@@ -651,6 +654,9 @@ function validateDocumentNode(value, path, issues, context = "root") {
       }
       return;
     case "table_cell":
+      if (record.sourceRef !== void 0) {
+        validateCanonicalSourceRef(record.sourceRef, `${path}.sourceRef`, issues);
+      }
       if (!Array.isArray(record.children)) {
         issues.push({ path: `${path}.children`, message: "children must be an array." });
       } else {
@@ -681,9 +687,15 @@ function validateDocumentNode(value, path, issues, context = "root") {
     case "bookmark_start":
       expectString(record.bookmarkId, `${path}.bookmarkId`, issues);
       expectString(record.name, `${path}.name`, issues);
+      if (record.sourceRef !== void 0) {
+        validateCanonicalSourceRef(record.sourceRef, `${path}.sourceRef`, issues);
+      }
       return;
     case "bookmark_end":
       expectString(record.bookmarkId, `${path}.bookmarkId`, issues);
+      if (record.sourceRef !== void 0) {
+        validateCanonicalSourceRef(record.sourceRef, `${path}.sourceRef`, issues);
+      }
       return;
     case "scope_marker_start":
     case "scope_marker_end":
@@ -784,6 +796,9 @@ function validateDocumentNode(value, path, issues, context = "root") {
       return;
     }
     case "ole_embed":
+      if (record.sourceRef !== void 0) {
+        validateCanonicalSourceRef(record.sourceRef, `${path}.sourceRef`, issues);
+      }
       expectString(record.id, `${path}.id`, issues);
       expectString(record.relationshipId, `${path}.relationshipId`, issues);
       expectString(record.rawXml, `${path}.rawXml`, issues);
@@ -912,12 +927,12 @@ function validateCanonicalSourceRef(value, path, issues) {
     return;
   }
   expectString(record.sourceId, `${path}.sourceId`, issues);
-  for (const key of ["partPath", "storyKind", "element"]) {
+  for (const key of ["partPath", "storyKind", "element", "xmlPath", "tableCellPath"]) {
     if (record[key] !== void 0) {
       expectString(record[key], `${path}.${key}`, issues);
     }
   }
-  for (const key of ["ordinal", "startOffset", "endOffset"]) {
+  for (const key of ["ordinal", "startOffset", "endOffset", "tableDepth"]) {
     if (record[key] !== void 0 && (!Number.isInteger(record[key]) || record[key] < 0)) {
       issues.push({
         path: `${path}.${key}`,

package/dist/{chunk-KHZNNBTN.js → chunk-QFU7ZOAD.js}

@@ -2,7 +2,7 @@ import {
   incrementInvalidationCounter,
   recordPerfSample,
   resolvePageOverlayRectsFromGeometry
-} from "./chunk-WVZX4NYG.js";
+} from "./chunk-GZW2ERUO.js";
 import {
   buildPageAnchorAttributes,
   buildPageAnchorSelector,
@@ -10,7 +10,7 @@ import {
   resolveChromePreset,
   resolveChromePresetOptions,
   resolveChromeVisibilityForPreset
-} from "./chunk-VCL5MJMZ.js";
+} from "./chunk-GON2DNTE.js";
 import {
   DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP,
   DEFAULT_PX_PER_TWIP,
@@ -20,23 +20,23 @@ import {
   findPageForOffset,
   getUsableColumnWidth,
   sanitizeMarkdown
-} from "./chunk-TMQGWF7R.js";
+} from "./chunk-G3B2OBCZ.js";
 import {
   createCanvasBackend
 } from "./chunk-KFCQYZXR.js";
 import {
   storyTargetKey
-} from "./chunk-AUQDC5BD.js";
+} from "./chunk-3TUQCHYT.js";
 import {
   EMU_PER_INCH,
   EMU_PER_PX,
   ROTATION_UNITS_PER_DEGREE,
   TWIPS_PER_PX
-} from "./chunk-AQA7OZ2R.js";
+} from "./chunk-TFSXOIAI.js";
 import {
   createPublicNodeAnchor,
   createPublicRangeAnchor
-} from "./chunk-4JNUMMM7.js";
+} from "./chunk-PGGPPZ65.js";
 
 // src/ui/headless/chrome-registry.ts
 var ALL_ROLES = ["editor", "review", "workflow"];
@@ -754,8 +754,8 @@ function TwToolbarIconButton(props) {
           "transition-colors duration-[var(--motion-fast)]",
           "disabled:opacity-30 disabled:cursor-not-allowed",
           props.active ? (
-            // Active = underline-tint grammar: accent-soft fill, accent-primary glyph, accent border ring.
-            "bg-[var(--color-accent-soft)] text-[var(--color-accent-primary)] border-[var(--color-border-accent)]"
+            // Active = neutral elevated surface + accent glyph + accent border. No mint fill.
+            "bg-[var(--color-bg-elevated)] text-[var(--color-accent-primary)] border-[var(--color-border-accent)]"
           ) : props.emphasis ? "text-[var(--color-accent-primary)] hover:bg-[var(--color-bg-hover)] hover:border-[var(--color-border-subtle)]" : "text-[var(--color-text-secondary)] hover:bg-[var(--color-bg-hover)] hover:text-[var(--color-text-primary)] hover:border-[var(--color-border-subtle)]",
           focusRingClass
         ].join(" "),
@@ -1884,7 +1884,7 @@ function TwToolbar(props) {
       },
       className: [
         "shrink-0 rounded-[var(--radius-sm)] border border-[var(--color-border-subtle)]",
-        "bg-[var(--color-bg-chrome)]/92 px-2.5 shadow-[var(--shadow-soft)] backdrop-blur-sm",
+        "bg-[var(--color-bg-chrome)] px-2.5",
         isCompact ? "flex min-h-10 flex-wrap items-center gap-1.5 py-1.5" : "flex items-center gap-1"
       ].join(" "),
       children: [
@@ -4022,29 +4022,29 @@ import { Baseline as Baseline2, Bold as Bold2, Highlighter as Highlighter3, Ital
 var BRAND_TOKENS = {
   color: {
     bg: {
-      app: "#F4F7F5",
-      chrome: "#FAFCFA",
-      sidebar: "#F1F6F2",
+      app: "#F6F6F6",
+      chrome: "#FBFBFB",
+      sidebar: "#F4F4F4",
       canvas: "#FFFFFF",
       elevated: "#FFFFFF",
-      hover: "#EAF6EF",
-      selected: "#E2F2E8",
-      muted: "#F7FAF8",
-      overlay: "rgba(21, 26, 23, 0.08)"
+      hover: "#F0F0F0",
+      selected: "#E8E8E8",
+      muted: "#F5F5F5",
+      overlay: "rgba(17, 17, 17, 0.10)"
     },
     border: {
-      subtle: "#E2EAE4",
-      default: "#D3DED6",
-      strong: "#BECDBF",
+      subtle: "#E6E6E6",
+      default: "#D6D6D6",
+      strong: "#BFBFBF",
       accent: "#8FC9AD"
     },
     text: {
-      primary: "#151A17",
-      secondary: "#5E6D63",
-      tertiary: "#8A978F",
-      quiet: "#A4AEA8",
-      inverse: "#F7FAF8",
-      onAccent: "#F7FAF8",
+      primary: "#111111",
+      secondary: "#555555",
+      tertiary: "#888888",
+      quiet: "#A8A8A8",
+      inverse: "#FAFAFA",
+      onAccent: "#FAFAFA",
       onSoftAccent: "#18563F"
     },
     accent: {
@@ -4292,7 +4292,7 @@ function ToolbarActionButton(props) {
         disabled: props.disabled,
         onMouseDown: preserveEditorSelectionMouseDown,
         onClick: props.onClick,
-        className: `inline-flex h-[30px] w-[30px] items-center justify-center rounded-[8px] transition-colors duration-[var(--motion-fast)] disabled:cursor-not-allowed disabled:opacity-40 ${props.pressed ? "bg-[var(--color-accent-soft)] text-[var(--color-text-on-soft-accent)]" : "text-[var(--color-text-secondary)] hover:bg-[var(--color-bg-hover)] hover:text-[var(--color-text-primary)]"} ${focusRingClass3}`,
+        className: `inline-flex h-[30px] w-[30px] items-center justify-center rounded-[8px] border transition-colors duration-[var(--motion-fast)] disabled:cursor-not-allowed disabled:opacity-40 ${props.pressed ? "border-[var(--color-border-accent)] bg-[var(--color-bg-elevated)] text-[var(--color-accent-primary)]" : "border-transparent text-[var(--color-text-secondary)] hover:bg-[var(--color-bg-hover)] hover:text-[var(--color-text-primary)]"} ${focusRingClass3}`,
         children: props.icon
       }
     ) }),
@@ -5743,7 +5743,7 @@ import * as Tabs from "@radix-ui/react-tabs";
 import * as ScrollArea from "@radix-ui/react-scroll-area";
 import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
 var focusRingClass9 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-var PILL_TRIGGER_CLASS = `flex-1 rounded-[var(--radius-md)] px-3 py-1.5 text-xs font-medium text-[var(--color-text-tertiary)] transition-colors data-[state=active]:bg-[var(--color-bg-selected)] data-[state=active]:text-[var(--color-text-primary)] outline-none ${focusRingClass9}`;
+var PILL_TRIGGER_CLASS = `flex-1 px-3 py-1.5 text-xs font-medium text-[var(--color-text-tertiary)] border-b-2 border-transparent transition-colors data-[state=active]:border-[var(--color-accent-primary)] data-[state=active]:text-[var(--color-text-primary)] data-[state=active]:font-semibold outline-none ${focusRingClass9}`;
 var UNDERLINE_TRIGGER_CLASS = `flex items-center gap-1.5 px-3 py-2 text-xs font-medium text-[var(--color-text-tertiary)] border-b-2 border-transparent transition-colors data-[state=active]:border-[var(--color-accent-primary)] data-[state=active]:text-[var(--color-text-primary)] outline-none ${focusRingClass9}`;
 function TwReviewRail(props) {
   const variant = props.variant ?? "docked";
@@ -5762,7 +5762,7 @@ function TwReviewRail(props) {
       "data-wre-drawer": variant === "drawer" ? "true" : "false",
       "data-editorial-header": editorial ? "true" : "false",
       className: [
-        "flex flex-col border-l border-[var(--color-border-subtle)]/60 bg-[var(--color-bg-sidebar)]",
+        "flex flex-col border-l border-[var(--color-border-subtle)] bg-[var(--color-bg-chrome)]",
         variant === "drawer" ? `h-full ${drawerWidthClass} max-w-full shrink-0 shadow-[var(--shadow-float)]` : `${widthClass} shrink-0`
       ].join(" "),
       children: [
@@ -6316,7 +6316,7 @@ function TwCommandPalette(props) {
                             "text-sm",
                             "transition-colors duration-[var(--motion-fast)]",
                             "disabled:opacity-40 disabled:cursor-not-allowed",
-                            isActive ? "bg-[var(--color-accent-soft)] text-[var(--color-accent-primary)]" : "text-[var(--color-text-primary)] hover:bg-[var(--color-bg-hover)]"
+                            isActive ? "bg-[var(--color-bg-hover)] text-[var(--color-text-primary)] font-medium" : "text-[var(--color-text-primary)] hover:bg-[var(--color-bg-hover)]"
                           ].join(" "),
                           children: [
                             cmd.icon ? /* @__PURE__ */ jsx24(
@@ -10103,9 +10103,9 @@ function TwImageContextToolbar(props) {
                 widthEmu: preset.widthEmu,
                 heightEmu: preset.heightEmu
               }),
-              className: `inline-flex h-6 items-center px-2 text-[length:var(--text-xs)] font-medium rounded-[var(--radius-sm)] transition-colors disabled:cursor-not-allowed disabled:opacity-40
-                aria-pressed:bg-[var(--color-bg-selected)] aria-pressed:text-[var(--color-accent-primary)]
-                text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)]`,
+              className: `inline-flex h-6 items-center px-2 text-[length:var(--text-xs)] font-medium rounded-[var(--radius-sm)] border border-transparent transition-colors disabled:cursor-not-allowed disabled:opacity-40
+                aria-pressed:border-[var(--color-border-accent)] aria-pressed:text-[var(--color-accent-primary)]
+                text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] hover:bg-[var(--color-bg-hover)]`,
               children: shortLabel
             },
             preset.label
@@ -10170,7 +10170,7 @@ function ToolbarButton(props) {
       disabled: props.disabled,
       onMouseDown: preserveEditorSelectionMouseDown,
       onClick: props.onClick,
-      className: "inline-flex h-7 items-center rounded-md px-2 text-[length:var(--text-xs)] font-medium text-[var(--color-text-primary)] transition-colors hover:bg-[var(--color-accent-soft)] disabled:cursor-not-allowed disabled:opacity-40",
+      className: "inline-flex h-7 items-center rounded-md px-2 text-[length:var(--text-xs)] font-medium text-[var(--color-text-primary)] transition-colors hover:bg-[var(--color-bg-hover)] disabled:cursor-not-allowed disabled:opacity-40",
       children: props.children
     }
   );
@@ -14378,7 +14378,9 @@ function resolveBlockRangeFromOffsetSpan(input) {
     const block = blocks[index];
     if (!block) continue;
     if (block.from >= endOffset) break;
-    if (block.from < endOffset && block.to > startOffset) {
+    const intersectsSpan = block.from < endOffset && block.to > startOffset;
+    const zeroWidthInsideSpan = block.from === block.to && block.from >= startOffset && block.from < endOffset;
+    if (intersectsSpan || zeroWidthInsideSpan) {
       if (first < 0) first = index;
       last = index;
     }
@@ -16380,7 +16382,7 @@ var TwActiveBandRibbon = React29.memo(({
         pointerEvents: "auto",
         zIndex: 2
       },
-      className: "flex flex-col gap-1 rounded-md border border-border/50 bg-canvas/95 px-2 py-1 shadow-sm backdrop-blur-sm",
+      className: "flex flex-col gap-1 rounded-md border border-border bg-canvas px-2 py-1 shadow-sm",
       children: [
         /* @__PURE__ */ jsxs44("div", { className: "flex flex-wrap items-center gap-1", children: [
           /* @__PURE__ */ jsxs44("span", { className: "text-[10px] font-semibold uppercase tracking-[var(--tracking-status)] text-tertiary", children: [
@@ -18528,20 +18530,22 @@ var noopModeChange = (_scopeId, _mode) => void 0;
 var noopIssueAction = (_scopeId, _issueId, _action) => void 0;
 
 // src/ui/headless/selection-helpers.ts
-function createSelectionSnapshot(anchor, head = anchor) {
+function createSelectionSnapshot(anchor, head = anchor, editableTarget) {
   return {
     anchor,
     head,
     isCollapsed: anchor === head,
-    activeRange: createPublicRangeAnchor(anchor, head)
+    activeRange: createPublicRangeAnchor(anchor, head),
+    ...editableTarget ? { editableTarget } : {}
   };
 }
-function createNodeSelectionSnapshot(at, assoc = 1) {
+function createNodeSelectionSnapshot(at, assoc = 1, editableTarget) {
   return {
     anchor: at,
     head: at,
     isCollapsed: true,
-    activeRange: createPublicNodeAnchor(at, assoc)
+    activeRange: createPublicNodeAnchor(at, assoc),
+    ...editableTarget ? { editableTarget } : {}
   };
 }
 function selectionTouchesRange(selection, from, to) {

package/dist/{chunk-4ZNQFWFM.js → chunk-QIO6V46H.js}

@@ -41,7 +41,7 @@ function parseTextStory(content) {
 function countLogicalPositions(units) {
   let size = 0;
   for (const unit of units) {
-    if (unit.kind !== "scope_marker") size += 1;
+    size += unitLogicalSize(unit);
   }
   return size;
 }
@@ -53,11 +53,15 @@ function logicalPositionToUnitIndex(units, logicalPos, startBias = "after") {
       return unitIndex;
     }
     const unit = units[unitIndex];
-    if (unit.kind !== "scope_marker") {
+    const unitSize = unitLogicalSize(unit);
+    if (unitSize > 0) {
       if (logicalCursor === logicalPos && startBias === "after") {
         return unitIndex;
       }
-      logicalCursor += 1;
+      if (logicalPos > logicalCursor && logicalPos < logicalCursor + unitSize) {
+        return unitIndex;
+      }
+      logicalCursor += unitSize;
     }
     unitIndex += 1;
   }
@@ -191,6 +195,9 @@ function serializeTextStory(story) {
           warningId: unit.warningId
         });
         break;
+      case "protected_inline":
+        pushInlineNode(structuredClone(unit.node));
+        break;
       case "scope_marker":
         pushInlineNode({
           type: unit.boundary === "start" ? "scope_marker_start" : "scope_marker_end",
@@ -223,6 +230,8 @@ function createPlainText(story) {
         return "\uFFFC";
       case "opaque_inline":
         return "\uFFF9";
+      case "protected_inline":
+        return protectedInlineText(unit.node);
       case "opaque_block":
         return "\uFFFA";
       case "structural_block":
@@ -263,6 +272,13 @@ function cloneStoryUnit(unit) {
         fragmentId: unit.fragmentId,
         warningId: unit.warningId
       };
+    case "protected_inline":
+      return {
+        kind: "protected_inline",
+        node: structuredClone(unit.node),
+        logicalSize: unit.logicalSize,
+        reason: unit.reason
+      };
     case "opaque_block":
       return {
         kind: "opaque_block",
@@ -345,7 +361,29 @@ function flattenInlineNodes(nodes, hyperlinkHref) {
         });
         break;
       case "hyperlink":
-        units.push(...flattenInlineNodes(node.children, node.href));
+        units.push({
+          kind: "protected_inline",
+          node: structuredClone(node),
+          logicalSize: inlineLogicalLength(node),
+          reason: "hyperlink"
+        });
+        break;
+      case "field":
+        units.push({
+          kind: "protected_inline",
+          node: structuredClone(node),
+          logicalSize: inlineLogicalLength(node),
+          reason: "field"
+        });
+        break;
+      case "bookmark_start":
+      case "bookmark_end":
+        units.push({
+          kind: "protected_inline",
+          node: structuredClone(node),
+          logicalSize: 0,
+          reason: "bookmark"
+        });
         break;
       case "image":
         units.push({
@@ -379,6 +417,48 @@ function flattenInlineNodes(nodes, hyperlinkHref) {
   }
   return units;
 }
+function unitLogicalSize(unit) {
+  switch (unit.kind) {
+    case "scope_marker":
+      return 0;
+    case "protected_inline":
+      return unit.logicalSize;
+    default:
+      return 1;
+  }
+}
+function inlineLogicalLength(node) {
+  switch (node.type) {
+    case "text":
+      return Array.from(node.text).length;
+    case "hyperlink":
+    case "field":
+      return node.children.reduce((total, child) => total + inlineLogicalLength(child), 0);
+    case "bookmark_start":
+    case "bookmark_end":
+    case "scope_marker_start":
+    case "scope_marker_end":
+      return 0;
+    default:
+      return 1;
+  }
+}
+function protectedInlineText(node) {
+  switch (node.type) {
+    case "text":
+      return node.text;
+    case "hyperlink":
+    case "field":
+      return node.children.map((child) => protectedInlineText(child)).join("");
+    case "bookmark_start":
+    case "bookmark_end":
+    case "scope_marker_start":
+    case "scope_marker_end":
+      return "";
+    default:
+      return "\uFFF9";
+  }
+}
 function extractParagraphProperties(paragraph) {
   return {
     ...paragraph.styleId ? { styleId: paragraph.styleId } : {},

package/dist/{chunk-IQ2VJEF6.js → chunk-QNGJRZ2D.js}

@@ -1,6 +1,6 @@
 import {
   buildSearchPattern
-} from "./chunk-TMQGWF7R.js";
+} from "./chunk-G3B2OBCZ.js";
 
 // src/ui-tailwind/editor-surface/search-plugin.ts
 import { Plugin, PluginKey } from "prosemirror-state";

package/dist/{chunk-BM5NSDII.js → chunk-S4ANOS2M.js}

@@ -1,10 +1,10 @@
 import {
   loadDocxSessionAsync
-} from "./chunk-KCHEAX4Z.js";
+} from "./chunk-EMDH4IQN.js";
 import {
   buildCompatibilityReport,
   createLoadScheduler
-} from "./chunk-327AIUXL.js";
+} from "./chunk-UWDWGQH5.js";
 import {
   decodePersistedSourcePackageBytes,
   hasValidPersistedSourcePackageDigest,