@beyondwork/docx-react-component 1.0.132 → 1.0.134

package/dist/ui-tailwind.cjs

@@ -876,18 +876,7 @@ function findScrollAnchor(root, options) {
         offsetWithinBlock: viewportTopFramePx - blockTop
       };
     }
-  }
-  const rootRect = root.getBoundingClientRect();
-  const rootTop = rootRect.top;
-  for (const block of blocks) {
-    const rect2 = block.getBoundingClientRect();
-    if (rect2.bottom < rootTop) continue;
-    const blockId = block.getAttribute("data-block-id");
-    if (!blockId) continue;
-    return {
-      blockId,
-      offsetWithinBlock: rootTop - rect2.top
-    };
+    return null;
   }
   return null;
 }
@@ -905,17 +894,9 @@ function resolveScrollTopForAnchor(root, anchor, options) {
       const rect2 = geometry.rects[0];
       return rect2.topPx + anchor.offsetWithinBlock;
     }
+    return null;
   }
-  const selector = `[data-block-id="${cssEscape(anchor.blockId)}"]`;
-  const block = root.querySelector(selector);
-  if (!block) return null;
-  const rootRect = root.getBoundingClientRect();
-  const blockRect = block.getBoundingClientRect();
-  const delta = blockRect.top - rootRect.top + anchor.offsetWithinBlock;
-  return root.scrollTop + delta;
-}
-function cssEscape(value) {
-  return value.replace(/[^a-zA-Z0-9_-]/g, (ch) => `\\${ch}`);
+  return null;
 }
 
 // src/ui/headless/chrome-registry.ts
@@ -2668,6 +2649,43 @@ function TwToolbar(props) {
   const showPostFormattingDivider = showListActionsInRow || showSpacingActionsInRow || showInsertActionsInRow || showUpdateActionsInRow || showCompactOverflow;
   const zoomLabel = typeof zoomLevel === "number" ? `${zoomLevel}%` : zoomLevel === "pageWidth" ? "Fit width" : "Fit page";
   const showZoomSteppers = responsiveTier === "wide";
+  const bulletedListState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onToggleBulletedList,
+    availability: getListCommandAvailability(props.activeListReadback, "toggle-bulleted")
+  });
+  const numberedListState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onToggleNumberedList,
+    availability: getListCommandAvailability(props.activeListReadback, "toggle-numbered")
+  });
+  const outdentState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onOutdent,
+    availability: getListCommandAvailability(props.activeListReadback, "outdent")
+  });
+  const indentState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onIndent,
+    availability: getListCommandAvailability(props.activeListReadback, "indent")
+  });
+  const restartNumberingState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onRestartNumbering,
+    availability: getListCommandAvailability(props.activeListReadback, "restart-numbering")
+  });
+  const continueNumberingState = resolveListCommandControl({
+    canEdit,
+    editDisabledReason,
+    callback: props.onContinueNumbering,
+    availability: getListCommandAvailability(props.activeListReadback, "continue-numbering")
+  });
+  const activeListKind = props.activeListReadback?.listKind;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
     "header",
     {
@@ -2683,7 +2701,7 @@ function TwToolbar(props) {
       },
       className: [
         "shrink-0 rounded-[var(--radius-sm)] border border-[var(--color-border-subtle)]",
-        "bg-[var(--color-bg-chrome)] px-2.5",
+        "bg-[var(--color-bg-chrome)] px-2.5 shadow-[var(--shadow-soft)]",
         isCompact ? "flex min-h-10 flex-wrap items-center gap-1.5 py-1.5" : "flex items-center gap-1"
       ].join(" "),
       children: [
@@ -2852,9 +2870,9 @@ function TwToolbar(props) {
               {
                 icon: import_lucide_react5.List,
                 label: "Bulleted list",
-                active: Boolean(props.activeListContext && !props.activeListContext.isOrdered),
-                disabled: !canEdit || !props.onToggleBulletedList,
-                disabledReason: editDisabledReason,
+                active: activeListKind ? activeListKind === "bulleted" : Boolean(props.activeListContext && !props.activeListContext.isOrdered),
+                disabled: bulletedListState.disabled,
+                disabledReason: bulletedListState.disabledReason,
                 onClick: props.onToggleBulletedList
               }
             ),
@@ -2863,9 +2881,9 @@ function TwToolbar(props) {
               {
                 icon: import_lucide_react5.Rows3,
                 label: "Numbered list",
-                active: Boolean(props.activeListContext?.isOrdered),
-                disabled: !canEdit || !props.onToggleNumberedList,
-                disabledReason: editDisabledReason,
+                active: activeListKind ? activeListKind === "numbered" : Boolean(props.activeListContext?.isOrdered),
+                disabled: numberedListState.disabled,
+                disabledReason: numberedListState.disabledReason,
                 onClick: props.onToggleNumberedList
               }
             )
@@ -2876,8 +2894,8 @@ function TwToolbar(props) {
               {
                 icon: import_lucide_react5.Outdent,
                 label: "Outdent",
-                disabled: !canEdit || !props.onOutdent,
-                disabledReason: editDisabledReason,
+                disabled: outdentState.disabled,
+                disabledReason: outdentState.disabledReason,
                 onClick: props.onOutdent
               }
             ),
@@ -2886,8 +2904,8 @@ function TwToolbar(props) {
               {
                 icon: import_lucide_react5.Indent,
                 label: "Indent",
-                disabled: !canEdit || !props.onIndent,
-                disabledReason: editDisabledReason,
+                disabled: indentState.disabled,
+                disabledReason: indentState.disabledReason,
                 onClick: props.onIndent
               }
             )
@@ -2897,8 +2915,8 @@ function TwToolbar(props) {
               ToolbarTextButton,
               {
                 ariaLabel: "Restart numbering",
-                disabled: !canEdit || !props.onRestartNumbering,
-                disabledReason: editDisabledReason,
+                disabled: restartNumberingState.disabled,
+                disabledReason: restartNumberingState.disabledReason,
                 onClick: props.onRestartNumbering,
                 children: "Restart"
               }
@@ -2907,8 +2925,8 @@ function TwToolbar(props) {
               ToolbarTextButton,
               {
                 ariaLabel: "Continue numbering",
-                disabled: !canEdit || !props.onContinueNumbering,
-                disabledReason: editDisabledReason,
+                disabled: continueNumberingState.disabled,
+                disabledReason: continueNumberingState.disabledReason,
                 onClick: props.onContinueNumbering,
                 children: "Continue"
               }
@@ -2952,6 +2970,7 @@ function TwToolbar(props) {
             ToolbarCompactOverflow,
             {
               activeListContext: props.activeListContext,
+              activeListReadback: props.activeListReadback,
               canEdit,
               canInsertStructural,
               editDisabledReason,
@@ -3485,8 +3504,59 @@ function ToolbarFontSizeSelect(props) {
     }
   );
 }
+function getListCommandAvailability(readback, command) {
+  return readback?.commandSupport.find((entry) => entry.command === command);
+}
+function resolveListCommandControl(input) {
+  if (!input.canEdit) {
+    return { disabled: true, disabledReason: input.editDisabledReason };
+  }
+  if (!input.callback) {
+    return { disabled: true };
+  }
+  if (input.availability?.enabled === false) {
+    return { disabled: true, disabledReason: input.availability.reason };
+  }
+  return { disabled: false };
+}
 function ToolbarCompactOverflow(props) {
   const [open, setOpen] = import_react4.default.useState(false);
+  const bulletedListState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onToggleBulletedList,
+    availability: getListCommandAvailability(props.activeListReadback, "toggle-bulleted")
+  });
+  const numberedListState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onToggleNumberedList,
+    availability: getListCommandAvailability(props.activeListReadback, "toggle-numbered")
+  });
+  const outdentState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onOutdent,
+    availability: getListCommandAvailability(props.activeListReadback, "outdent")
+  });
+  const indentState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onIndent,
+    availability: getListCommandAvailability(props.activeListReadback, "indent")
+  });
+  const restartNumberingState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onRestartNumbering,
+    availability: getListCommandAvailability(props.activeListReadback, "restart-numbering")
+  });
+  const continueNumberingState = resolveListCommandControl({
+    canEdit: props.canEdit,
+    editDisabledReason: props.editDisabledReason,
+    callback: props.onContinueNumbering,
+    availability: getListCommandAvailability(props.activeListReadback, "continue-numbering")
+  });
   const overflowGroups = [
     props.showStyleSelectors || props.showInlineFormatting || props.showTextColors ? "Format" : null,
     props.showListActions || props.showParagraphActions || props.showParagraphAlignment || props.showListContinuation ? "Paragraph" : null,
@@ -3703,8 +3773,8 @@ function ToolbarCompactOverflow(props) {
           ToolbarMenuButton,
           {
             ariaLabel: "Bulleted list",
-            disabled: !props.canEdit || !props.onToggleBulletedList,
-            disabledReason: props.editDisabledReason,
+            disabled: bulletedListState.disabled,
+            disabledReason: bulletedListState.disabledReason,
             icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.List, { className: "h-3.5 w-3.5" }),
             label: "Bulleted list",
             onClick: () => {
@@ -3717,8 +3787,8 @@ function ToolbarCompactOverflow(props) {
           ToolbarMenuButton,
           {
             ariaLabel: "Numbered list",
-            disabled: !props.canEdit || !props.onToggleNumberedList,
-            disabledReason: props.editDisabledReason,
+            disabled: numberedListState.disabled,
+            disabledReason: numberedListState.disabledReason,
             icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Rows3, { className: "h-3.5 w-3.5" }),
             label: "Numbered list",
             onClick: () => {
@@ -3747,8 +3817,8 @@ function ToolbarCompactOverflow(props) {
             ToolbarMenuButton,
             {
               ariaLabel: "Outdent",
-              disabled: !props.canEdit || !props.onOutdent,
-              disabledReason: props.editDisabledReason,
+              disabled: outdentState.disabled,
+              disabledReason: outdentState.disabledReason,
               icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Outdent, { className: "h-3.5 w-3.5" }),
               label: "Outdent",
               onClick: () => {
@@ -3761,8 +3831,8 @@ function ToolbarCompactOverflow(props) {
             ToolbarMenuButton,
             {
               ariaLabel: "Indent",
-              disabled: !props.canEdit || !props.onIndent,
-              disabledReason: props.editDisabledReason,
+              disabled: indentState.disabled,
+              disabledReason: indentState.disabledReason,
               icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Indent, { className: "h-3.5 w-3.5" }),
               label: "Indent",
               onClick: () => {
@@ -3777,8 +3847,8 @@ function ToolbarCompactOverflow(props) {
             ToolbarMenuButton,
             {
               ariaLabel: "Restart numbering",
-              disabled: !props.canEdit || !props.onRestartNumbering,
-              disabledReason: props.editDisabledReason,
+              disabled: restartNumberingState.disabled,
+              disabledReason: restartNumberingState.disabledReason,
               icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Rows3, { className: "h-3.5 w-3.5" }),
               label: "Restart numbering",
               onClick: () => {
@@ -3791,8 +3861,8 @@ function ToolbarCompactOverflow(props) {
             ToolbarMenuButton,
             {
               ariaLabel: "Continue numbering",
-              disabled: !props.canEdit || !props.onContinueNumbering,
-              disabledReason: props.editDisabledReason,
+              disabled: continueNumberingState.disabled,
+              disabledReason: continueNumberingState.disabledReason,
               icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Rows3, { className: "h-3.5 w-3.5" }),
               label: "Continue numbering",
               onClick: () => {
@@ -9131,7 +9201,20 @@ function sourceJoinHash(refs) {
   if (sourceIds.length === 0) return void 0;
   return hashText(sourceIds.join("\0"));
 }
+var numberingCatalogHashCache = /* @__PURE__ */ new WeakMap();
+var numberingTargetHashCache = /* @__PURE__ */ new WeakMap();
 function createNumberingCatalogRevisionHash(doc) {
+  const numbering = doc.numbering;
+  if (numbering !== void 0) {
+    const cached = numberingCatalogHashCache.get(numbering);
+    if (cached !== void 0) return cached;
+    const fresh = computeNumberingCatalogRevisionHash(doc);
+    numberingCatalogHashCache.set(numbering, fresh);
+    return fresh;
+  }
+  return computeNumberingCatalogRevisionHash(doc);
+}
+function computeNumberingCatalogRevisionHash(doc) {
   const catalog = doc.numbering ?? { abstractDefinitions: {}, instances: {} };
   const abstractDefinitions = catalog.abstractDefinitions ?? {};
   const instances = catalog.instances ?? {};
@@ -9182,8 +9265,27 @@ function createNumberingCatalogRevisionHash(doc) {
   }));
 }
 function createNumberingTargetRevisionHash(doc) {
+  const numbering = doc.numbering;
+  const styles = doc.styles;
+  if (numbering !== void 0 && styles !== void 0) {
+    let inner = numberingTargetHashCache.get(numbering);
+    if (inner === void 0) {
+      inner = /* @__PURE__ */ new WeakMap();
+      numberingTargetHashCache.set(numbering, inner);
+    }
+    const cached = inner.get(styles);
+    if (cached !== void 0) return cached;
+    const fresh = computeNumberingTargetRevisionHash(doc);
+    inner.set(styles, fresh);
+    return fresh;
+  }
+  return computeNumberingTargetRevisionHash(doc);
+}
+function computeNumberingTargetRevisionHash(doc) {
   const paragraphStyles = doc.styles?.paragraphs ?? {};
   return hashText(JSON.stringify({
+    // Reuses the memoized catalog hash on the hot path so a typing edit
+    // pays for the catalog hash at most once across both helpers.
     numberingCatalogHash: createNumberingCatalogRevisionHash(doc),
     paragraphStyleNumbering: Object.keys(paragraphStyles).sort().map((styleId) => {
       const style = paragraphStyles[styleId];
@@ -12675,6 +12777,7 @@ var PICTURE_EFFECT_SCHEME_ALIASES = {
   bg2: "lt2"
 };
 var EMPTY_EDITABLE_TARGETS_BY_BLOCK_PATH = /* @__PURE__ */ new Map();
+var NO_EDITABLE_TARGETS_INDEX = EMPTY_EDITABLE_TARGETS_BY_BLOCK_PATH;
 function indexEditableTargetsByBlockPath(document2) {
   const targets = collectEditableTargetRefs(document2);
   if (targets.length === 0) return EMPTY_EDITABLE_TARGETS_BY_BLOCK_PATH;
@@ -14891,7 +14994,8 @@ function buildResolvedSections(document2) {
   const mainSurface = createEditorSurfaceSnapshot(
     document2,
     createSelectionSnapshot(0, 0),
-    MAIN_STORY_TARGET
+    MAIN_STORY_TARGET,
+    { editableTargetsByBlockPath: NO_EDITABLE_TARGETS_INDEX }
   );
   const sections = [];
   let sectionStart = 0;
@@ -20368,7 +20472,7 @@ function fnv1a2(input) {
 }
 
 // src/runtime/layout/layout-engine-version.ts
-var LAYOUT_ENGINE_VERSION = 93;
+var LAYOUT_ENGINE_VERSION = 94;
 
 // src/runtime/layout/layout-engine-instance.ts
 var FULL_VIEWPORT_WINDOW_KEY = "full";
@@ -20594,11 +20698,45 @@ function createLayoutEngine(options = {}) {
   const telemetryBus = options.telemetryBus;
   const dirtyFieldFamilies = /* @__PURE__ */ new Set();
   const listeners = /* @__PURE__ */ new Set();
-  let cachedKey = null;
-  let cachedGraph = null;
-  let cachedFormatting = null;
-  let cachedMapper = null;
+  let cachedFull = null;
+  let cachedWindowed = null;
   let previousPageCount = 0;
+  function isFullViewportKey(key) {
+    return key === FULL_VIEWPORT_WINDOW_KEY;
+  }
+  function getCachedSlot(viewportWindowKeyValue) {
+    return isFullViewportKey(viewportWindowKeyValue) ? cachedFull : cachedWindowed;
+  }
+  function preferredCachedGraph() {
+    return cachedFull?.graph ?? cachedWindowed?.graph ?? null;
+  }
+  function clearAllSlots() {
+    cachedFull = null;
+    cachedWindowed = null;
+  }
+  function clearWindowedSlot() {
+    cachedWindowed = null;
+  }
+  function evictStaleSiblingSlot(freshKey) {
+    const sibling = isFullViewportKey(freshKey.viewportWindowKey) ? cachedWindowed : cachedFull;
+    if (sibling === null) return;
+    if (sibling.key.content === freshKey.content && sibling.key.styles === freshKey.styles && sibling.key.subParts === freshKey.subParts) {
+      return;
+    }
+    if (isFullViewportKey(freshKey.viewportWindowKey)) {
+      cachedWindowed = null;
+    } else {
+      cachedFull = null;
+    }
+  }
+  function commitSlot(slot) {
+    if (isFullViewportKey(slot.key.viewportWindowKey)) {
+      cachedFull = slot;
+    } else {
+      cachedWindowed = slot;
+    }
+    evictStaleSiblingSlot(slot.key);
+  }
   let pendingInvalidation = null;
   function emit(event) {
     for (const listener of listeners) {
@@ -20744,27 +20882,31 @@ function createLayoutEngine(options = {}) {
       subParts: document2.subParts,
       anchors: layoutInputs.anchors
     });
+    const priorGraphForMaterialization = preferredCachedGraph();
     const graph = applyViewportWindowMaterialization(
       measuredGraph,
       viewportWindow,
-      cachedGraph
+      priorGraphForMaterialization
     );
-    const dirtyFamilies = computeFieldDirtiness(cachedGraph, graph);
+    const priorGraphForFieldDirtiness = preferredCachedGraph();
+    const dirtyFamilies = computeFieldDirtiness(priorGraphForFieldDirtiness, graph);
     for (const family of dirtyFamilies) {
       dirtyFieldFamilies.add(family);
     }
     const formatting = buildResolvedFormattingState(document2, mainSurface);
     const currentPageCount = graph.contentPageCount;
     const pageCountDelta = currentPageCount !== previousPageCount ? { previous: previousPageCount, current: currentPageCount } : void 0;
-    cachedKey = {
-      content: document2.content,
-      styles: document2.styles,
-      subParts: document2.subParts,
-      viewportWindowKey: viewportWindowKey(viewportWindow)
-    };
-    cachedGraph = graph;
-    cachedFormatting = formatting;
-    cachedMapper = createPageFragmentMapper(graph);
+    commitSlot({
+      key: {
+        content: document2.content,
+        styles: document2.styles,
+        subParts: document2.subParts,
+        viewportWindowKey: viewportWindowKey(viewportWindow)
+      },
+      graph,
+      formatting,
+      mapper: createPageFragmentMapper(graph)
+    });
     if (pageCountDelta) {
       emit({
         kind: "page_count_changed",
@@ -20805,7 +20947,7 @@ function createLayoutEngine(options = {}) {
     return graph;
   }
   function incrementalRelayout(input, pending) {
-    const priorGraph = cachedGraph;
+    const priorGraph = cachedFull?.graph ?? null;
     const range = pending.result.dirtyPageRange;
     if (!priorGraph || !range) return null;
     const telemetryOn = telemetryBus?.isEnabled("layout") ?? false;
@@ -20898,6 +21040,22 @@ function createLayoutEngine(options = {}) {
       deriveDocumentPageSnapshots(splicedGraph)
     );
     const pageCountDelta = currentPageCount !== previousPageCount ? { previous: previousPageCount, current: currentPageCount } : void 0;
+    const priorMapper = cachedFull?.mapper ?? null;
+    commitSlot({
+      key: {
+        content: document2.content,
+        styles: document2.styles,
+        subParts: document2.subParts,
+        viewportWindowKey: FULL_VIEWPORT_WINDOW_KEY
+      },
+      graph: splicedGraph,
+      formatting,
+      mapper: rebuildMapper(
+        priorMapper ?? createPageFragmentMapper(splicedGraph),
+        splicedGraph,
+        firstDirty
+      )
+    });
     if (pageCountDelta) {
       emit({
         kind: "page_count_changed",
@@ -20927,19 +21085,6 @@ function createLayoutEngine(options = {}) {
       ...dirtyFamilies.length > 0 ? { dirtyFieldFamilies: dirtyFamilies } : {},
       ...pageCountDelta ? { pageCountDelta } : {}
     });
-    cachedKey = {
-      content: document2.content,
-      styles: document2.styles,
-      subParts: document2.subParts,
-      viewportWindowKey: FULL_VIEWPORT_WINDOW_KEY
-    };
-    cachedGraph = splicedGraph;
-    cachedFormatting = formatting;
-    cachedMapper = rebuildMapper(
-      cachedMapper ?? createPageFragmentMapper(splicedGraph),
-      splicedGraph,
-      firstDirty
-    );
     if (telemetryOn) {
       emitRecomputeCompleted(
         "bounded",
@@ -20956,13 +21101,14 @@ function createLayoutEngine(options = {}) {
     const document2 = input.document;
     const normalizedWindow = normalizeViewportPageWindow(input.viewportPageWindow);
     const currentViewportWindowKey = viewportWindowKey(normalizedWindow);
-    const keyEqual = cachedGraph !== null && cachedKey !== null && cachedKey.content === document2.content && cachedKey.styles === document2.styles && cachedKey.subParts === document2.subParts && cachedKey.viewportWindowKey === currentViewportWindowKey;
+    const slot = getCachedSlot(currentViewportWindowKey);
+    const keyEqual = slot !== null && slot.key.content === document2.content && slot.key.styles === document2.styles && slot.key.subParts === document2.subParts && slot.key.viewportWindowKey === currentViewportWindowKey;
     if (keyEqual && pendingInvalidation === null) {
-      return cachedGraph;
+      return slot.graph;
     }
     const pending = pendingInvalidation;
     pendingInvalidation = null;
-    if (pending !== null && pending.result.scope === "bounded" && cachedGraph !== null && normalizedWindow === void 0) {
+    if (pending !== null && pending.result.scope === "bounded" && cachedFull !== null && normalizedWindow === void 0) {
       const spliced = incrementalRelayout(input, pending);
       if (spliced !== null) {
         return spliced;
@@ -20971,16 +21117,39 @@ function createLayoutEngine(options = {}) {
     }
     return fullRebuild(input, pending?.reason);
   }
+  function ensureSlotMapperAndFormatting(slot, document2) {
+    if (slot.mapper === null) {
+      slot.mapper = createPageFragmentMapper(slot.graph);
+    }
+    if (slot.formatting === null) {
+      const mainSurface = createEditorSurfaceSnapshot(
+        document2,
+        createSelectionSnapshot(0, 0),
+        MAIN_STORY_TARGET
+      );
+      slot.formatting = buildResolvedFormattingState(document2, mainSurface);
+    }
+  }
   function getMapper(input) {
     getGraphInternal(input);
-    return cachedMapper;
+    const currentViewportWindowKey = viewportWindowKey(
+      normalizeViewportPageWindow(input.viewportPageWindow)
+    );
+    const slot = getCachedSlot(currentViewportWindowKey);
+    ensureSlotMapperAndFormatting(slot, input.document);
+    return slot.mapper;
   }
   function getFormatting(input) {
     getGraphInternal(input);
-    return cachedFormatting;
+    const currentViewportWindowKey = viewportWindowKey(
+      normalizeViewportPageWindow(input.viewportPageWindow)
+    );
+    const slot = getCachedSlot(currentViewportWindowKey);
+    ensureSlotMapperAndFormatting(slot, input.document);
+    return slot.formatting;
   }
   if (autoUpgradeToCanvas && options.measurementProvider === void 0 && typeof document !== "undefined" && typeof HTMLCanvasElement !== "undefined") {
-    const readCachedRevision = () => cachedGraph?.revision ?? 0;
+    const readCachedRevision = () => preferredCachedGraph()?.revision ?? 0;
     void (async () => {
       try {
         const mod = await Promise.resolve().then(() => (init_measurement_backend_canvas(), measurement_backend_canvas_exports));
@@ -20990,10 +21159,7 @@ function createLayoutEngine(options = {}) {
           options.measurementCache,
           telemetryBus
         );
-        cachedKey = null;
-        cachedGraph = null;
-        cachedFormatting = null;
-        cachedMapper = null;
+        clearAllSlots();
         emit({
           kind: "measurement_backend_ready",
           revision: readCachedRevision(),
@@ -21037,22 +21203,19 @@ function createLayoutEngine(options = {}) {
       return getMapper(input);
     },
     invalidate(reason) {
-      const result = analyzeInvalidation(reason, cachedGraph);
+      const result = analyzeInvalidation(reason, preferredCachedGraph());
       for (const family of result.dirtyFieldFamilies) {
         dirtyFieldFamilies.add(family);
       }
       if (result.scope === "bounded") {
         pendingInvalidation = { reason, result };
       } else {
-        cachedKey = null;
-        cachedGraph = null;
-        cachedFormatting = null;
-        cachedMapper = null;
+        clearAllSlots();
         pendingInvalidation = { reason, result };
       }
     },
     analyzeInvalidation(reason) {
-      return analyzeInvalidation(reason, cachedGraph);
+      return analyzeInvalidation(reason, preferredCachedGraph());
     },
     getDirtyFieldFamilies() {
       return Array.from(dirtyFieldFamilies);
@@ -21080,14 +21243,11 @@ function createLayoutEngine(options = {}) {
         telemetryBus
       );
       if (previousFidelity !== provider.fidelity) {
-        cachedKey = null;
-        cachedGraph = null;
-        cachedFormatting = null;
-        cachedMapper = null;
+        clearAllSlots();
       }
       emit({
         kind: "measurement_backend_ready",
-        revision: cachedGraph?.revision ?? 0,
+        revision: preferredCachedGraph()?.revision ?? 0,
         fidelity: provider.fidelity
       });
     },
@@ -21102,30 +21262,33 @@ function createLayoutEngine(options = {}) {
      */
     invalidateMeasurementCache() {
       measurementProvider.invalidateCache();
-      cachedKey = null;
-      cachedGraph = null;
-      cachedFormatting = null;
-      cachedMapper = null;
+      clearAllSlots();
     },
     getMeasurementCacheStats() {
       if (!isCachedLayoutMeasurementProvider(measurementProvider)) return null;
       return measurementProvider.measurementCacheStats();
     },
     /**
-     * L7 Phase 2.5 — seed the cached graph from a prerender envelope.
-     * Populates both `cachedGraph` and `cachedKey` (keyed on the provided
-     * document's identity-equal slots) so the next getPageGraph query
-     * returns the seeded graph directly. Any subsequent mutation
-     * invalidates normally through the existing path.
+     * L7 Phase 2.5 — seed the full-slot cached graph from a prerender
+     * envelope. Populates the full slot (graph + key, with formatting and
+     * mapper computed lazily on first read) so the next viewport-
+     * independent `getPageGraph` query returns the seeded graph directly.
+     * Any subsequent mutation invalidates normally through the existing
+     * path; sibling eviction in `commitSlot` clears `cachedWindowed` if
+     * it carried a different document tuple.
      */
     seedCachedGraph(graph, document2) {
-      cachedGraph = graph;
-      cachedKey = {
-        content: document2.content,
-        styles: document2.styles,
-        subParts: document2.subParts,
-        viewportWindowKey: FULL_VIEWPORT_WINDOW_KEY
-      };
+      commitSlot({
+        key: {
+          content: document2.content,
+          styles: document2.styles,
+          subParts: document2.subParts,
+          viewportWindowKey: FULL_VIEWPORT_WINDOW_KEY
+        },
+        graph,
+        formatting: null,
+        mapper: null
+      });
       previousPageCount = graph.contentPageCount;
     }
   };
@@ -22032,7 +22195,17 @@ function TwSelectionToolStructure(props) {
           onSetCellVerticalAlign: props.onSetCellVerticalAlign
         }
       );
-    case "list":
+    case "list": {
+      const continueState = resolveListToolbarButtonState({
+        canMutate: props.model.canMutate,
+        callback: props.onContinueNumbering,
+        availability: getListCommandAvailability2(props.activeListReadback, "continue-numbering")
+      });
+      const restartState = resolveListToolbarButtonState({
+        canMutate: props.model.canMutate,
+        callback: props.onRestartNumbering,
+        availability: getListCommandAvailability2(props.activeListReadback, "restart-numbering")
+      });
       return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
         "div",
         {
@@ -22044,7 +22217,8 @@ function TwSelectionToolStructure(props) {
               ToolbarButton3,
               {
                 ariaLabel: "Continue numbering",
-                disabled: !props.model.canMutate || !props.onContinueNumbering,
+                disabled: continueState.disabled,
+                disabledReason: continueState.disabledReason,
                 onClick: props.onContinueNumbering,
                 children: "Continue"
               }
@@ -22053,7 +22227,8 @@ function TwSelectionToolStructure(props) {
               ToolbarButton3,
               {
                 ariaLabel: "Restart numbering",
-                disabled: !props.model.canMutate || !props.onRestartNumbering,
+                disabled: restartState.disabled,
+                disabledReason: restartState.disabledReason,
                 onClick: props.onRestartNumbering,
                 children: "Restart"
               }
@@ -22061,15 +22236,31 @@ function TwSelectionToolStructure(props) {
           ]
         }
       );
+    }
+  }
+}
+function getListCommandAvailability2(readback, command) {
+  return readback?.commandSupport.find((entry) => entry.command === command);
+}
+function resolveListToolbarButtonState(input) {
+  if (!input.canMutate || !input.callback) {
+    return { disabled: true };
   }
+  if (input.availability?.enabled === false) {
+    return { disabled: true, disabledReason: input.availability.reason };
+  }
+  return { disabled: false };
 }
 function ToolbarButton3(props) {
+  const disabledReason = props.disabled && props.disabledReason ? props.disabledReason : void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "button",
     {
       type: "button",
       "aria-label": props.ariaLabel,
       disabled: props.disabled,
+      "data-disabled-reason": disabledReason,
+      title: disabledReason ? `Not available: ${disabledReason}` : void 0,
       onMouseDown: preserveEditorSelectionMouseDown,
       onClick: props.onClick,
       className: "inline-flex h-7 items-center rounded-md border border-border px-2 text-[length:var(--text-xs)] font-medium text-secondary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40",
@@ -22458,6 +22649,7 @@ function renderTool(props, tool, density) {
           onSetImageFrame: props.onSetImageFrame,
           onRestartNumbering: props.onRestartNumbering,
           onContinueNumbering: props.onContinueNumbering,
+          activeListReadback: props.activeListReadback,
           onToggleRowHeader: props.onToggleRowHeader,
           onToggleRowCantSplit: props.onToggleRowCantSplit,
           onDistributeColumnsEvenly: props.onDistributeColumnsEvenly,
@@ -24419,6 +24611,7 @@ var EDITOR_ACTION_REGISTRY = [
     group: "clipboard",
     targetKinds: [
       "plain-text",
+      "list-item",
       "table-cell",
       "image",
       "hyperlink",
@@ -24437,9 +24630,11 @@ var EDITOR_ACTION_REGISTRY = [
     group: "clipboard",
     targetKinds: [
       "plain-text",
+      "list-item",
       "table-cell",
       "image",
       "hyperlink",
+      "generated-field",
       "suggestion",
       "comment-anchor",
       "opaque-block",
@@ -24454,6 +24649,7 @@ var EDITOR_ACTION_REGISTRY = [
     group: "clipboard",
     targetKinds: [
       "plain-text",
+      "list-item",
       "table-cell",
       "hyperlink",
       "suggestion",
@@ -24614,28 +24810,28 @@ var EDITOR_ACTION_REGISTRY = [
     id: "list-bulleted",
     label: "Bulleted list",
     group: "formatting",
-    targetKinds: ["plain-text", "table-cell"],
+    targetKinds: ["list-item", "plain-text", "table-cell"],
     callback: "onToggleBulletedList"
   }),
   mk({
     id: "list-numbered",
     label: "Numbered list",
     group: "formatting",
-    targetKinds: ["plain-text", "table-cell"],
+    targetKinds: ["list-item", "plain-text", "table-cell"],
     callback: "onToggleNumberedList"
   }),
   mk({
     id: "paragraph-outdent",
     label: "Decrease indent",
     group: "formatting",
-    targetKinds: ["plain-text", "table-cell"],
+    targetKinds: ["list-item", "plain-text", "table-cell"],
     callback: "onOutdent"
   }),
   mk({
     id: "paragraph-indent",
     label: "Increase indent",
     group: "formatting",
-    targetKinds: ["plain-text", "table-cell"],
+    targetKinds: ["list-item", "plain-text", "table-cell"],
     callback: "onIndent"
   }),
   mkArg({
@@ -24984,6 +25180,23 @@ var EDITOR_ACTION_REGISTRY = [
     targetKinds: ["hyperlink"],
     callback: "onOpenHyperlink"
   }),
+  // -------- Generated fields --------
+  mk({
+    id: "field-refresh",
+    label: "Refresh field",
+    description: "Refresh generated field results through the runtime field updater.",
+    group: "misc",
+    targetKinds: ["generated-field"],
+    callback: "onUpdateFields"
+  }),
+  mk({
+    id: "toc-refresh",
+    label: "Refresh table of contents",
+    description: "Refresh TOC entries through the runtime table-of-contents updater.",
+    group: "misc",
+    targetKinds: ["toc-field"],
+    callback: "onUpdateTableOfContents"
+  }),
   // -------- Workflow scope --------
   mk({
     id: "scope-open-card",
@@ -25877,13 +26090,40 @@ function hasAncestorAttributeValue(el, attribute, expected, root) {
   }
   return false;
 }
+function hasAncestorAttributeValueInsensitive(el, attribute, expected, root) {
+  const normalizedExpected = expected.toLowerCase();
+  let cursor = el;
+  while (cursor) {
+    if (cursor.getAttribute?.(attribute)?.toLowerCase() === normalizedExpected) {
+      return true;
+    }
+    if (cursor === root) return false;
+    cursor = cursor.parentElement;
+  }
+  return false;
+}
 function resolveTargetKind(target, options = {}) {
   const kinds = [];
   const el = toElement(target);
   if (el) {
     const { root } = options;
+    const insideNumberingMarker = hasAncestorAttributeValue(
+      el,
+      "data-numbering-marker",
+      "true",
+      root
+    );
+    const insideListItem = insideNumberingMarker || hasAncestorAttributeValue(el, "data-numbered", "true", root);
+    const insideGeneratedField = hasAncestorAttributeValue(el, "data-generated-field", "true", root) || hasAncestorAttributeValue(el, "data-node-type", "field_ref_atom", root) || hasAncestorAttributeValue(el, "data-node-type", "field_ref", root);
+    if (insideListItem) kinds.push("list-item");
+    if (insideGeneratedField) {
+      kinds.push("generated-field");
+      if (hasAncestorAttributeValueInsensitive(el, "data-field-family", "TOC", root)) {
+        kinds.push("toc-field");
+      }
+    }
     if (hasAncestorTag(el, "a", root)) kinds.push("hyperlink");
-    if (hasAncestorTag(el, "img", root)) {
+    if (!insideNumberingMarker && hasAncestorTag(el, "img", root)) {
       kinds.push("image");
     }
     if (hasAncestorTag(el, "td", root) || hasAncestorTag(el, "th", root)) {
@@ -25919,7 +26159,9 @@ function resolveTargetKind(target, options = {}) {
       if (!kinds.includes("template-slot")) kinds.push("template-slot");
     }
   }
-  if (!kinds.includes("plain-text")) kinds.push("plain-text");
+  if (!kinds.includes("generated-field") && !kinds.includes("plain-text")) {
+    kinds.push("plain-text");
+  }
   return kinds;
 }
 
@@ -27001,294 +27243,6 @@ function resolveSkeletalPageOverlayRectsFromLayout(facet) {
   }
   return rects;
 }
-function pageOverlayLastBottom(rects) {
-  let bottom = 0;
-  for (const rect2 of rects) {
-    if (rect2.bottomPx > bottom) bottom = rect2.bottomPx;
-  }
-  return bottom;
-}
-function extendFinalPageOverlayRectToFlowHeight(rects, flowHeightPx) {
-  if (rects.length === 0 || !Number.isFinite(flowHeightPx)) return rects;
-  const last = rects[rects.length - 1];
-  if (flowHeightPx <= last.bottomPx + 1) return rects;
-  return [
-    ...rects.slice(0, -1),
-    {
-      ...last,
-      bottomPx: flowHeightPx,
-      heightPx: Math.max(0, flowHeightPx - last.topPx)
-    }
-  ];
-}
-function extendPageOverlayRectsAcrossTableBoundaryGaps(rects, tableBoundaryIndices) {
-  if (rects.length === 0 || tableBoundaryIndices.length === 0) return rects;
-  const tableBoundaries = new Set(tableBoundaryIndices);
-  const byPageIndex = /* @__PURE__ */ new Map();
-  for (const rect2 of rects) {
-    byPageIndex.set(rect2.pageIndex, rect2);
-  }
-  let changed = false;
-  const bridged = rects.map((rect2) => {
-    if (!tableBoundaries.has(rect2.pageIndex)) return rect2;
-    const next = byPageIndex.get(rect2.pageIndex + 1);
-    if (!next || next.topPx <= rect2.bottomPx + 1) return rect2;
-    changed = true;
-    return {
-      ...rect2,
-      bottomPx: next.topPx,
-      heightPx: Math.max(0, next.topPx - rect2.topPx)
-    };
-  });
-  return changed ? bridged : rects;
-}
-function mergePageOverlayRectsByPageIndex(baseRects, flowRects) {
-  if (baseRects.length === 0 || flowRects.length === 0) return baseRects;
-  const flowByIndex = /* @__PURE__ */ new Map();
-  for (const rect2 of flowRects) {
-    flowByIndex.set(rect2.pageIndex, rect2);
-  }
-  return baseRects.map((rect2) => flowByIndex.get(rect2.pageIndex) ?? rect2);
-}
-function normalizeVisiblePageIndexRange(range, pageCount) {
-  if (!range || pageCount <= 0) return null;
-  const start = Math.max(0, Math.min(range.start, pageCount));
-  const end = Math.max(start, Math.min(range.end, pageCount));
-  if (start >= end) return null;
-  return { start, end };
-}
-function collectBoundaryIndicesForVisibleRange(range, pageCount) {
-  if (pageCount <= 1) return [];
-  const startBoundaryIndex = Math.max(0, range.start - 1);
-  const endBoundaryIndex = Math.min(pageCount - 2, range.end - 1);
-  if (startBoundaryIndex > endBoundaryIndex) return [];
-  const indices = [];
-  for (let index = startBoundaryIndex; index <= endBoundaryIndex; index += 1) {
-    indices.push(index);
-  }
-  return indices;
-}
-function parsePageBoundaryIndex(prevPageId) {
-  const match = /^page-(\d+)$/.exec(prevPageId);
-  if (!match) return void 0;
-  return Number.parseInt(match[1] ?? "", 10);
-}
-function collectTableEmbeddedBoundaryIndices(queryRoot) {
-  if (!queryRoot) return [];
-  const indices = [];
-  const widgets = Array.from(
-    queryRoot.querySelectorAll("[data-page-frame-end]")
-  );
-  for (const widget of widgets) {
-    const prevPageId = widget.getAttribute("data-page-frame-end");
-    if (!prevPageId) continue;
-    const boundaryIndex = parsePageBoundaryIndex(prevPageId);
-    if (boundaryIndex === void 0) continue;
-    if (widget.closest("[data-pm-table-root='true'], table")) {
-      indices.push(boundaryIndex);
-    }
-  }
-  return indices;
-}
-function containsTableBoundaryRisk(queryRoot) {
-  if (!queryRoot) return false;
-  if (queryRoot.getElementsByTagName("table").length > 0) return true;
-  const descendants = queryRoot.getElementsByTagName("*");
-  for (let i = 0; i < descendants.length; i += 1) {
-    const element = descendants[i];
-    if (element.getAttribute("data-pm-table-root") === "true") {
-      return true;
-    }
-  }
-  return false;
-}
-function resolvePageOverlayRects(input, legacyPageCount) {
-  let widgets;
-  let pageCount;
-  let scrollHeight;
-  if (Array.isArray(input)) {
-    const [scrollRoot, count] = input;
-    if (!scrollRoot || count <= 0) return [];
-    widgets = measureWidgetsViaOffsetChain(scrollRoot);
-    pageCount = count;
-    scrollHeight = scrollRoot.clientHeight;
-  } else if (input !== null && typeof input === "object" && "widgets" in input) {
-    widgets = input.widgets;
-    pageCount = input.pageCount;
-    scrollHeight = input.scrollHeight;
-  } else if (input && legacyPageCount !== void 0) {
-    const scrollRoot = input;
-    if (legacyPageCount <= 0) return [];
-    widgets = measureWidgetsViaOffsetChain(scrollRoot);
-    pageCount = legacyPageCount;
-    scrollHeight = scrollRoot.clientHeight;
-  } else {
-    return [];
-  }
-  if (pageCount <= 0) return [];
-  const boundaries = [...widgets].sort((a, b) => a.topPx - b.topPx);
-  const normalizedVisiblePageIndexRange = Array.isArray(input) ? null : normalizeVisiblePageIndexRange(input.visiblePageIndexRange, pageCount);
-  const boundaryByIndex = /* @__PURE__ */ new Map();
-  boundaries.forEach((boundary, index) => {
-    const boundaryIndex = boundary.boundaryIndex ?? parsePageBoundaryIndex(boundary.prevPageId) ?? index;
-    boundaryByIndex.set(boundaryIndex, boundary);
-  });
-  const pageStart = normalizedVisiblePageIndexRange?.start ?? 0;
-  const pageEnd = normalizedVisiblePageIndexRange?.end ?? pageCount;
-  const rects = [];
-  for (let pageIndex = pageStart; pageIndex < pageEnd; pageIndex += 1) {
-    const boundaryBefore = pageIndex === 0 ? null : boundaryByIndex.get(pageIndex - 1) ?? null;
-    const boundaryAfter = pageIndex === pageCount - 1 ? null : boundaryByIndex.get(pageIndex) ?? null;
-    let pageId = null;
-    if (boundaryBefore) pageId = boundaryBefore.nextPageId;
-    else if (boundaryAfter) pageId = boundaryAfter.prevPageId;
-    if (!pageId) pageId = `page-${pageIndex}`;
-    const topPx = boundaryBefore ? boundaryBefore.bottomPx : 0;
-    const bottomPx = boundaryAfter ? boundaryAfter.topPx : scrollHeight;
-    if (bottomPx <= topPx) continue;
-    rects.push({
-      pageId,
-      pageIndex,
-      topPx,
-      bottomPx,
-      heightPx: bottomPx - topPx
-    });
-  }
-  return rects;
-}
-function measureWidgetsViaBoundingRect(queryRoot, originElement, options) {
-  if (!queryRoot || !originElement) return [];
-  const originRect = originElement.getBoundingClientRect();
-  const normalizedVisiblePageIndexRange = normalizeVisiblePageIndexRange(
-    options?.visiblePageIndexRange,
-    options?.pageCount ?? 0
-  );
-  const queryOne = typeof queryRoot.querySelector === "function" ? queryRoot.querySelector.bind(queryRoot) : null;
-  const widgets = normalizedVisiblePageIndexRange && queryOne && options?.pageCount ? collectBoundaryIndicesForVisibleRange(
-    normalizedVisiblePageIndexRange,
-    options.pageCount
-  ).map(
-    (boundaryIndex) => queryOne(`[data-page-frame-end="page-${boundaryIndex}"]`)
-  ).filter((widget) => widget !== null) : Array.from(
-    queryRoot.querySelectorAll("[data-page-frame-end]")
-  );
-  const out = [];
-  for (const widget of widgets) {
-    const prevPageId = widget.getAttribute("data-page-frame-end");
-    const nextPageId = widget.getAttribute("data-page-frame-start");
-    if (!prevPageId || !nextPageId) continue;
-    const rect2 = widget.getBoundingClientRect();
-    out.push({
-      prevPageId,
-      nextPageId,
-      boundaryIndex: parsePageBoundaryIndex(prevPageId),
-      topPx: rect2.top - originRect.top,
-      bottomPx: rect2.bottom - originRect.top
-    });
-  }
-  return out;
-}
-function measureWidgetsViaOffsetChain(scrollRoot, options) {
-  const normalizedVisiblePageIndexRange = normalizeVisiblePageIndexRange(
-    options?.visiblePageIndexRange,
-    options?.pageCount ?? 0
-  );
-  const queryOne = typeof scrollRoot.querySelector === "function" ? scrollRoot.querySelector.bind(scrollRoot) : null;
-  const widgets = normalizedVisiblePageIndexRange && queryOne && options?.pageCount ? collectBoundaryIndicesForVisibleRange(
-    normalizedVisiblePageIndexRange,
-    options.pageCount
-  ).map(
-    (boundaryIndex) => queryOne(`[data-page-frame-end="page-${boundaryIndex}"]`)
-  ).filter((widget) => widget !== null) : Array.from(
-    scrollRoot.querySelectorAll("[data-page-frame-end]")
-  );
-  const out = [];
-  for (const widget of widgets) {
-    const prevPageId = widget.getAttribute("data-page-frame-end");
-    const nextPageId = widget.getAttribute("data-page-frame-start");
-    if (!prevPageId || !nextPageId) continue;
-    const topPx = resolveOffsetTop(widget, scrollRoot);
-    const bottomPx = topPx + resolveOffsetHeight(widget);
-    out.push({
-      prevPageId,
-      nextPageId,
-      boundaryIndex: parsePageBoundaryIndex(prevPageId),
-      topPx,
-      bottomPx
-    });
-  }
-  return out;
-}
-function resolveOffsetTop(widget, scrollRoot) {
-  let node = widget;
-  let top = 0;
-  while (node) {
-    top += node.offsetTop ?? 0;
-    const parent = node.offsetParent;
-    if (parent === scrollRoot || parent === null) break;
-    node = parent;
-  }
-  return top;
-}
-function resolveOffsetHeight(widget) {
-  return widget.offsetHeight ?? 0;
-}
-function readElementFlowHeight(element, options = {}) {
-  if (!element) return 0;
-  let height = 0;
-  height = Math.max(height, element.clientHeight || 0);
-  if (options.includeScrollHeight !== false) {
-    height = Math.max(height, element.scrollHeight || 0);
-  }
-  if (height <= 0) {
-    const rect2 = element.getBoundingClientRect();
-    height = Math.max(height, rect2.height || 0);
-  }
-  return height;
-}
-function readOverlayFlowHeight(origin) {
-  if (!origin) return 0;
-  const parent = origin.parentElement instanceof HTMLElement ? origin.parentElement : null;
-  const parentHeight = readElementFlowHeight(parent);
-  if (parentHeight > 0) return parentHeight;
-  return readElementFlowHeight(origin, { includeScrollHeight: false });
-}
-function reconcilePageStackRectsWithFlow(input) {
-  const { baseRects, pageCount, scrollRoot, originElement } = input;
-  if (baseRects.length === 0 || pageCount <= 0) return baseRects;
-  const flowHeight = readOverlayFlowHeight(originElement);
-  if (flowHeight <= 0) return baseRects;
-  const geometryBottom = pageOverlayLastBottom(baseRects);
-  const tableBoundaryRisk = containsTableBoundaryRisk(scrollRoot);
-  if (!tableBoundaryRisk && flowHeight <= geometryBottom + 1) {
-    return extendFinalPageOverlayRectToFlowHeight(baseRects, flowHeight);
-  }
-  const bridgedBase = extendPageOverlayRectsAcrossTableBoundaryGaps(
-    baseRects,
-    tableBoundaryRisk ? collectTableEmbeddedBoundaryIndices(scrollRoot) : []
-  );
-  const extendedBase = extendFinalPageOverlayRectToFlowHeight(
-    bridgedBase,
-    flowHeight
-  );
-  if (!originElement || !scrollRoot) return extendedBase;
-  if (flowHeight <= pageOverlayLastBottom(bridgedBase) + 1) {
-    return extendedBase;
-  }
-  const widgets = measureWidgetsViaBoundingRect(scrollRoot, originElement, {
-    pageCount,
-    visiblePageIndexRange: null
-  });
-  if (widgets.length === 0) return extendedBase;
-  const flowRects = resolvePageOverlayRects({
-    widgets,
-    pageCount,
-    scrollHeight: flowHeight,
-    visiblePageIndexRange: null
-  });
-  const merged = mergePageOverlayRectsByPageIndex(extendedBase, flowRects);
-  return extendFinalPageOverlayRectToFlowHeight(merged, flowHeight);
-}
 var resolvePageOverlayRectsFromGeometry2 = resolvePageOverlayRectsFromGeometry;
 function resolvePageOverlayRectsFromUiApi(ui, pageCount, visiblePageIndexRange, pageIds) {
   if (pageCount <= 0) return [];
@@ -27346,17 +27300,6 @@ var TwPageStackOverlayLayer = ({
     },
     []
   );
-  const reconcilePaperRectsWithFlow = React21.useCallback(
-    (baseRects, pageCount) => {
-      return reconcilePageStackRectsWithFlow({
-        baseRects,
-        pageCount,
-        scrollRoot,
-        originElement: overlayRootRef.current
-      });
-    },
-    [scrollRoot]
-  );
   const refreshRectsNow = React21.useCallback(() => {
     const pageCount = facet.getPageCount();
     const skeletalRects = resolveSkeletalPageOverlayRectsFromLayout(facet);
@@ -27397,51 +27340,11 @@ var TwPageStackOverlayLayer = ({
       setRectsIfChanged(skeletalRects);
       return;
     }
-    if (!scrollRoot) {
-      setRectsIfChanged(skeletalRects);
-      return;
-    }
-    const origin = overlayRootRef.current;
-    incrementInvalidationCounter("overlay.page.dom_fallback");
-    if (origin) {
-      incrementInvalidationCounter("overlay.page.dom.degraded");
-      const widgets = measureWidgetsViaBoundingRect(scrollRoot, origin, {
-        pageCount,
-        visiblePageIndexRange: null
-      });
-      const originRect = origin.getBoundingClientRect();
-      const domRects = resolvePageOverlayRects({
-        widgets,
-        pageCount,
-        scrollHeight: (
-          // geometry:allow-dom-fallback
-          origin.clientHeight > 0 ? origin.clientHeight : originRect.height
-        ),
-        visiblePageIndexRange: null
-      });
-      const reconciled = reconcilePaperRectsWithFlow(domRects, pageCount);
-      setRectsIfChanged(reconciled.length > 0 ? reconciled : skeletalRects);
-    } else {
-      incrementInvalidationCounter("overlay.page.dom.degraded");
-      const widgets = measureWidgetsViaOffsetChain(scrollRoot, {
-        pageCount,
-        visiblePageIndexRange: null
-      });
-      const domRects = resolvePageOverlayRects({
-        widgets,
-        pageCount,
-        // geometry:allow-dom-fallback
-        scrollHeight: scrollRoot.clientHeight,
-        visiblePageIndexRange: null
-      });
-      const reconciled = reconcilePaperRectsWithFlow(domRects, pageCount);
-      setRectsIfChanged(reconciled.length > 0 ? reconciled : skeletalRects);
-    }
+    incrementInvalidationCounter("overlay.page.skeletal_fallback");
+    setRectsIfChanged(skeletalRects);
   }, [
     facet,
     geometryFacet,
-    reconcilePaperRectsWithFlow,
-    scrollRoot,
     setRectsIfChanged,
     ui
   ]);
@@ -27472,33 +27375,6 @@ var TwPageStackOverlayLayer = ({
       }
     };
   }, [refreshRects, renderFrameRevision, scrollRoot]);
-  React21.useEffect(() => {
-    if (geometryFacet) return;
-    if (!scrollRoot) return;
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.ResizeObserver) return;
-    const observer = new runtime.ResizeObserver(() => refreshRects());
-    observer.observe(scrollRoot);
-    return () => observer.disconnect();
-  }, [geometryFacet, scrollRoot, refreshRects]);
-  React21.useEffect(() => {
-    if (geometryFacet) return;
-    if (!scrollRoot) return;
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.MutationObserver) return;
-    const observer = new runtime.MutationObserver((records) => {
-      const overlay = overlayRootRef.current;
-      if (overlay) {
-        const allSelf = records.every(
-          (r) => r.target instanceof Node && overlay.contains(r.target)
-        );
-        if (allSelf) return;
-      }
-      refreshRects();
-    });
-    observer.observe(scrollRoot, { childList: true, subtree: false });
-    return () => observer.disconnect();
-  }, [geometryFacet, scrollRoot, refreshRects]);
   if (rects.length === 0) {
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       "div",
@@ -28140,6 +28016,18 @@ function emuToPx(emu, pxPerTwip) {
   return emu / EMU_PER_PX * zoomFactor;
 }
 
+// src/ui-tailwind/editor-surface/media-src-policy.ts
+var SAFE_DATA_IMAGE_PREFIX_RE = /^data:image\/(?:png|jpe?g|gif|webp|bmp);base64,/iu;
+var MAX_NUMBERING_PICTURE_BULLET_DATA_URL_LENGTH = 1024 * 1024;
+function sanitizeNumberingPictureBulletSrc(src) {
+  if (typeof src !== "string") return null;
+  const trimmed = src.trim();
+  if (trimmed.length === 0) return null;
+  if (trimmed.length > MAX_NUMBERING_PICTURE_BULLET_DATA_URL_LENGTH) return null;
+  if (!SAFE_DATA_IMAGE_PREFIX_RE.test(trimmed)) return null;
+  return trimmed;
+}
+
 // src/ui-tailwind/page-stack/tw-region-block-renderer.tsx
 var import_jsx_runtime49 = require("react/jsx-runtime");
 var EMU_PER_PX2 = 9525;
@@ -28254,6 +28142,10 @@ function renderSegment(seg, mediaPreviews, fallbackDisplay, tabInfoBySegment) {
         "span",
         {
           "data-node-type": "field_ref",
+          "data-generated-field": "true",
+          "data-field-family": seg.fieldFamily,
+          "data-field-target": seg.fieldTarget,
+          "data-field-refresh-status": seg.refreshStatus,
           style: { opacity: 0.6, fontSize: "0.85em" },
           children: seg.displayText ?? seg.label
         },
@@ -28303,6 +28195,9 @@ function RegionParagraph({
   const markerWidth = resolvedNumbering?.geometry?.markerLane?.width;
   const markerStart = resolvedNumbering?.geometry?.markerLane?.start;
   const markerJustification = resolvedNumbering?.geometry?.markerJustification;
+  const pictureBulletSrc = sanitizeNumberingPictureBulletSrc(
+    resolvedNumbering?.picBulletMediaId ? mediaPreviews[resolvedNumbering.picBulletMediaId]?.src : null
+  );
   const prefixSpan = numberingPrefix != null ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     "span",
     {
@@ -28313,7 +28208,9 @@ function RegionParagraph({
         ...!markerRunProperties ? ["text-tertiary", "font-[family-name:var(--font-legal-sans)]"] : []
       ].join(" "),
       contentEditable: false,
-      "data-numbering-prefix": numberingPrefix,
+      "data-numbering-marker": "true",
+      "data-numbering-prefix": pictureBulletSrc ? "" : numberingPrefix,
+      ...pictureBulletSrc ? { "data-numbering-picture-bullet": resolvedNumbering?.pictureBulletPosture?.status ?? "media-rendered" } : {},
       ...typeof resolvedNumbering?.level === "number" ? { "data-numbering-level": String(resolvedNumbering.level) } : {},
       ...numberingSuffix ? { "data-numbering-suffix": numberingSuffix } : {},
       style: buildMarkerStyle(
@@ -28324,7 +28221,20 @@ function RegionParagraph({
         markerStart,
         markerJustification
       ),
-      children: numberingPrefix
+      children: pictureBulletSrc ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+        "img",
+        {
+          src: pictureBulletSrc,
+          alt: "",
+          "aria-hidden": "true",
+          style: {
+            maxWidth: "100%",
+            maxHeight: "100%",
+            objectFit: "contain",
+            display: "block"
+          }
+        }
+      ) : numberingPrefix
     }
   ) : null;
   const attrs = {
@@ -29556,25 +29466,23 @@ var TwPageStackChromeLayerInner = ({
     const pageCount = facet.getPageCount();
     const uiRects = resolveUiPageRects(pageCount);
     if (uiRects !== null) return uiRects;
-    if (!geometryFacet) return [];
-    const warm = resolvePageOverlayRectsFromGeometry2(
-      geometryFacet,
-      pageCount,
-      visiblePageIndexRange
+    if (geometryFacet) {
+      const warm = resolvePageOverlayRectsFromGeometry2(
+        geometryFacet,
+        pageCount,
+        visiblePageIndexRange
+      );
+      if (warm !== null) return warm;
+    }
+    return resolveSkeletalPageOverlayRectsFromLayout(facet).filter(
+      (rect2) => !visiblePageIndexRange || rect2.pageIndex >= visiblePageIndexRange.start && rect2.pageIndex < visiblePageIndexRange.end
     );
-    return warm ?? [];
   });
   const overlayRootRef = import_react29.default.useRef(null);
   const rafHandleRef = import_react29.default.useRef(null);
   const [activeStoryPageIndex, setActiveStoryPageIndex] = import_react29.default.useState(null);
   const refreshRectsNow = import_react29.default.useCallback(() => {
     const pageCount = facet.getPageCount();
-    const reconcileDomRects = (baseRects) => reconcilePageStackRectsWithFlow({
-      baseRects,
-      pageCount,
-      scrollRoot,
-      originElement: overlayRootRef.current
-    });
     const uiRects = resolveUiPageRects(pageCount);
     if (uiRects !== null) {
       setRects(uiRects);
@@ -29593,47 +29501,11 @@ var TwPageStackChromeLayerInner = ({
       setRects([]);
       return;
     }
-    if (!scrollRoot) {
-      setRects([]);
-      return;
-    }
-    const origin = overlayRootRef.current;
-    if (origin) {
-      const widgets = measureWidgetsViaBoundingRect(scrollRoot, origin, {
-        pageCount,
-        visiblePageIndexRange
-      });
-      const originRect = origin.getBoundingClientRect();
-      const scrollHeight = (
-        // geometry:allow-dom-fallback
-        origin.clientHeight > 0 ? origin.clientHeight : originRect.height > 0 ? originRect.height : scrollRoot.clientHeight
-      );
-      const domRects = resolvePageOverlayRects({
-        widgets,
-        pageCount,
-        scrollHeight,
-        visiblePageIndexRange
-      });
-      setRects(
-        reconcileDomRects(domRects)
-      );
-    } else {
-      const widgets = measureWidgetsViaOffsetChain(scrollRoot, {
-        pageCount,
-        visiblePageIndexRange
-      });
-      const domRects = resolvePageOverlayRects({
-        widgets,
-        pageCount,
-        // geometry:allow-dom-fallback
-        scrollHeight: scrollRoot.clientHeight,
-        visiblePageIndexRange
-      });
-      setRects(
-        reconcileDomRects(domRects)
-      );
-    }
-  }, [facet, geometryFacet, resolveUiPageRects, scrollRoot, visiblePageIndexRange]);
+    const skeletalRects = resolveSkeletalPageOverlayRectsFromLayout(facet).filter(
+      (rect2) => !visiblePageIndexRange || rect2.pageIndex >= visiblePageIndexRange.start && rect2.pageIndex < visiblePageIndexRange.end
+    );
+    setRects(skeletalRects);
+  }, [facet, geometryFacet, resolveUiPageRects, visiblePageIndexRange]);
   const refreshRects = import_react29.default.useCallback(() => {
     if (!scrollRoot) {
       refreshRectsNow();
@@ -29673,33 +29545,6 @@ var TwPageStackChromeLayerInner = ({
     },
     [onOpenStory]
   );
-  import_react29.default.useEffect(() => {
-    if (geometryFacet) return;
-    if (!scrollRoot) return;
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.ResizeObserver) return;
-    const observer = new runtime.ResizeObserver(() => refreshRects());
-    observer.observe(scrollRoot);
-    return () => observer.disconnect();
-  }, [geometryFacet, scrollRoot, refreshRects]);
-  import_react29.default.useEffect(() => {
-    if (geometryFacet) return;
-    if (!scrollRoot) return;
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.MutationObserver) return;
-    const observer = new runtime.MutationObserver((records) => {
-      const overlay = overlayRootRef.current;
-      if (overlay) {
-        const allSelf = records.every(
-          (r) => r.target instanceof Node && overlay.contains(r.target)
-        );
-        if (allSelf) return;
-      }
-      refreshRects();
-    });
-    observer.observe(scrollRoot, { childList: true, subtree: false });
-    return () => observer.disconnect();
-  }, [geometryFacet, scrollRoot, refreshRects]);
   import_react29.default.useLayoutEffect(() => {
     if (!pmSurfaceElement) return;
     const overlay = overlayRootRef.current;
@@ -31184,45 +31029,17 @@ var TwFloatingImageLayer = ({
   const [pageRects, setPageRects] = React37.useState([]);
   const refreshPageRectsNow = React37.useCallback(() => {
     const pageCount = facet.getPageCount();
-    if (geometryFacet) {
-      const geometryRects = resolvePageOverlayRectsFromGeometry2(
-        geometryFacet,
-        pageCount,
-        visiblePageIndexRange
-      );
-      if (geometryRects !== null) {
-        setPageRects(geometryRects);
-        return;
-      }
-      setPageRects([]);
-      return;
-    }
-    if (!scrollRoot) {
-      setPageRects([]);
-      return;
-    }
-    const origin = overlayRootRef.current;
-    if (!origin) {
+    if (!geometryFacet) {
       setPageRects([]);
       return;
     }
-    const widgets = measureWidgetsViaBoundingRect(scrollRoot, origin, {
+    const geometryRects = resolvePageOverlayRectsFromGeometry2(
+      geometryFacet,
       pageCount,
       visiblePageIndexRange
-    });
-    const originRect = origin.getBoundingClientRect();
-    setPageRects(
-      resolvePageOverlayRects({
-        widgets,
-        pageCount,
-        scrollHeight: (
-          // geometry:allow-dom-fallback
-          origin.clientHeight > 0 ? origin.clientHeight : originRect.height
-        ),
-        visiblePageIndexRange
-      })
     );
-  }, [facet, geometryFacet, scrollRoot, visiblePageIndexRange]);
+    setPageRects(geometryRects ?? []);
+  }, [facet, geometryFacet, visiblePageIndexRange]);
   const refreshPageRects = React37.useCallback(() => {
     if (!scrollRoot) {
       refreshPageRectsNow();
@@ -31252,47 +31069,6 @@ var TwFloatingImageLayer = ({
       }
     };
   }, [refreshPageRects, renderFrameRevision, scrollRoot]);
-  React37.useEffect(() => {
-    if (geometryFacet) {
-      return;
-    }
-    if (!scrollRoot) {
-      return;
-    }
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.ResizeObserver) {
-      return;
-    }
-    const observer = new runtime.ResizeObserver(() => refreshPageRects());
-    observer.observe(scrollRoot);
-    return () => observer.disconnect();
-  }, [geometryFacet, refreshPageRects, scrollRoot]);
-  React37.useEffect(() => {
-    if (geometryFacet) {
-      return;
-    }
-    if (!scrollRoot) {
-      return;
-    }
-    const runtime = scrollRoot.ownerDocument?.defaultView;
-    if (!runtime?.MutationObserver) {
-      return;
-    }
-    const observer = new runtime.MutationObserver((records) => {
-      const overlay = overlayRootRef.current;
-      if (overlay) {
-        const allSelf = records.every(
-          (record) => record.target instanceof Node && overlay.contains(record.target)
-        );
-        if (allSelf) {
-          return;
-        }
-      }
-      refreshPageRects();
-    });
-    observer.observe(scrollRoot, { childList: true, subtree: false });
-    return () => observer.disconnect();
-  }, [geometryFacet, refreshPageRects, scrollRoot]);
   const items = React37.useMemo(() => {
     const viewportScale = geometryFacet?.getViewport().pxPerTwip;
     const pxPerTwip = typeof viewportScale === "number" && viewportScale > 0 ? viewportScale : void 0;
@@ -33694,6 +33470,21 @@ function resolveRoleChromePreset(basePreset, role) {
   }
   return basePreset;
 }
+function resolveActiveListReadback(rows, activeListContext, selection) {
+  if (!activeListContext) {
+    return null;
+  }
+  const selectionPoint = selection.activeRange.kind === "range" ? selection.head : selection.activeRange.kind === "node" ? selection.activeRange.at : selection.activeRange.lastKnownRange.from;
+  const matchingSelectionRow = rows.find(
+    (row) => row.numberingInstanceId === activeListContext.numberingInstanceId && row.level === activeListContext.level && selectionPoint >= row.authoredTextRange.from && selectionPoint <= row.authoredTextRange.to
+  );
+  if (matchingSelectionRow) {
+    return matchingSelectionRow;
+  }
+  return rows.find(
+    (row) => row.numberingInstanceId === activeListContext.numberingInstanceId && row.level === activeListContext.level
+  ) ?? null;
+}
 function TwReviewWorkspace(inputProps) {
   const props = {
     ...inputProps,
@@ -33808,6 +33599,14 @@ function TwReviewWorkspace(inputProps) {
     () => uiApi?.scope.list().length,
     [uiApi, renderFrameRevision]
   );
+  const activeListReadback = (0, import_react51.useMemo)(
+    () => resolveActiveListReadback(
+      uiApi?.lists.list() ?? [],
+      props.activeListContext,
+      viewState.selection
+    ),
+    [uiApi, props.activeListContext, viewState.selection, renderFrameRevision]
+  );
   const headings = props.documentNavigation?.headings ?? [];
   const headerVariant = snapshot.pageLayout?.headerVariants[0]?.variant ?? "default";
   const footerVariant = snapshot.pageLayout?.footerVariants[0]?.variant ?? "default";
@@ -34076,6 +33875,7 @@ function TwReviewWorkspace(inputProps) {
                 zoomLevel: props.zoomLevel,
                 formattingState: props.formattingState,
                 activeListContext: props.activeListContext,
+                activeListReadback,
                 styleCatalog: props.styleCatalog,
                 showTrackedChanges: trackedChangesAuthoringEnabled,
                 showSidebarToggle: responsiveChrome.showSidebarToggle,
@@ -34287,6 +34087,7 @@ function TwReviewWorkspace(inputProps) {
                               onSetImageFrame: props.onSetImageFrame,
                               onRestartNumbering: props.onRestartNumbering,
                               onContinueNumbering: props.onContinueNumbering,
+                              activeListReadback,
                               onToggleRowHeader: props.onToggleRowHeader,
                               onToggleRowCantSplit: props.onToggleRowCantSplit,
                               onDistributeColumnsEvenly: props.onDistributeColumnsEvenly,