@beyondwork/docx-react-component 1.0.29 → 1.0.31

package/dist/chunk-2TG72QSW.js

@@ -1,3874 +0,0 @@
-import {
-  DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP,
-  canCreateDocxCommentAnchor,
-  estimateBlockHeight,
-  estimateParagraphLineCount,
-  estimateParagraphLineHeight,
-  findPageForOffset,
-  getUsableColumnWidth,
-  incrementInvalidationCounter,
-  recordPerfSample
-} from "./chunk-GBVOWFIK.js";
-import {
-  createDetachedAnchor,
-  createNodeAnchor,
-  createRangeAnchor
-} from "./chunk-EBI3BX6U.js";
-
-// src/runtime/session-capabilities.ts
-function deriveCapabilities(snapshot, reviewMode, workflowScope) {
-  const hasFatalError = Boolean(snapshot.fatalError);
-  const isReady = snapshot.isReady;
-  const isReadOnly = snapshot.readOnly;
-  const exportBlocked = snapshot.compatibility.blockExport;
-  const activeStory = snapshot.activeStory ?? { kind: "main" };
-  const documentMode = snapshot.documentMode ?? "editing";
-  const phase = !isReady ? "loading" : hasFatalError ? "diagnostics" : "ready";
-  const mode = phase === "diagnostics" ? "read-only-diagnostics" : reviewMode;
-  const canEdit = isReady && !isReadOnly && !hasFatalError && documentMode !== "viewing";
-  const canUndo = snapshot.commandState.canUndo && canEdit;
-  const canRedo = snapshot.commandState.canRedo && canEdit;
-  const canAddComment = canEdit && activeStory.kind === "main" && !snapshot.selection.isCollapsed && Boolean(snapshot.surface) && canCreateDocxCommentAnchor(snapshot.surface, toRuntimeAnchor(snapshot.selection.activeRange));
-  const canExport = isReady && !exportBlocked && !hasFatalError;
-  const actionableRevisions = snapshot.trackedChanges.revisions.filter(
-    (r) => r.status === "active" && r.actionability === "actionable"
-  );
-  const canAcceptChange = canEdit && actionableRevisions.some((r) => r.canAccept);
-  const canRejectChange = canEdit && actionableRevisions.some((r) => r.canReject);
-  const canAcceptAll = canEdit && actionableRevisions.length > 0;
-  const canRejectAll = canEdit && actionableRevisions.length > 0;
-  const preserveOnlyCount = snapshot.compatibility.featureEntries.filter(
-    (e) => e.featureClass === "preserve-only"
-  ).length;
-  const unsupportedFatalCount = snapshot.compatibility.featureEntries.filter(
-    (e) => e.featureClass === "unsupported-fatal"
-  ).length;
-  const workflowOverlayPresent = workflowScope?.overlayPresent ?? false;
-  const workflowBlocked = (workflowScope?.blockedReasons?.length ?? 0) > 0;
-  const trackChangesSupported = snapshot.trackedChanges.totalCount > 0;
-  const hasTrustConcerns = exportBlocked || preserveOnlyCount > 0 || unsupportedFatalCount > 0 || snapshot.warnings.length > 0 || hasFatalError;
-  const reviewRailVisible = workflowOverlayPresent ? false : mode === "review" || mode === "read-only-diagnostics" || mode === "editing" && hasTrustConcerns;
-  const healthIssueCount = preserveOnlyCount + unsupportedFatalCount + snapshot.warnings.length;
-  const protection = snapshot.protectionSnapshot;
-  const hasDocumentProtection = protection?.hasDocumentProtection ?? false;
-  const protectedRangeCount = protection?.ranges?.length ?? 0;
-  return {
-    phase,
-    mode,
-    documentMode,
-    canUndo,
-    canRedo,
-    canEdit,
-    canAddComment,
-    canExport,
-    canAcceptChange,
-    canRejectChange,
-    canAcceptAll,
-    canRejectAll,
-    reviewRailVisible,
-    trackChangesSupported,
-    exportBlocked,
-    preserveOnlyCount,
-    unsupportedFatalCount,
-    hasDocumentProtection,
-    protectedRangeCount,
-    healthIssueCount,
-    workflowOverlayPresent,
-    workflowBlocked,
-    isDirty: snapshot.isDirty,
-    isReady,
-    hasFatalError
-  };
-}
-function toRuntimeAnchor(anchor) {
-  switch (anchor.kind) {
-    case "range":
-      return createRangeAnchor(anchor.from, anchor.to, anchor.assoc);
-    case "node":
-      return createNodeAnchor(anchor.at, anchor.assoc);
-    case "detached":
-      return createDetachedAnchor(anchor.lastKnownRange, anchor.reason);
-  }
-}
-
-// src/ui-tailwind/chrome/tw-alert-banner.tsx
-import { AlertTriangle, XCircle } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function TwAlertBanner(props) {
-  const { snapshot, preserveOnlyCount, workflowBlockedReasons = [] } = props;
-  if (snapshot.fatalError) {
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-danger-soft text-danger text-xs", children: [
-      /* @__PURE__ */ jsx(XCircle, { className: "h-3.5 w-3.5 shrink-0" }),
-      /* @__PURE__ */ jsx("span", { children: snapshot.fatalError.message })
-    ] });
-  }
-  if (snapshot.compatibility.blockExport) {
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-danger-soft text-danger text-xs", children: [
-      /* @__PURE__ */ jsx(XCircle, { className: "h-3.5 w-3.5 shrink-0" }),
-      /* @__PURE__ */ jsxs("span", { children: [
-        "Export blocked \u2014",
-        " ",
-        snapshot.compatibility.blockExportReasons[0] ?? "unsupported content"
-      ] })
-    ] });
-  }
-  if (preserveOnlyCount > 0) {
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-warning-soft text-comment text-xs", children: [
-      /* @__PURE__ */ jsx(AlertTriangle, { className: "h-3.5 w-3.5 shrink-0" }),
-      /* @__PURE__ */ jsxs("span", { children: [
-        preserveOnlyCount,
-        " preserve-only feature",
-        preserveOnlyCount !== 1 ? "s" : "",
-        " detected"
-      ] })
-    ] });
-  }
-  if (workflowBlockedReasons.length > 0) {
-    const firstReason = workflowBlockedReasons[0];
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-amber-50 text-amber-700 text-xs", children: [
-      /* @__PURE__ */ jsx(AlertTriangle, { className: "h-3.5 w-3.5 shrink-0" }),
-      /* @__PURE__ */ jsxs("span", { children: [
-        firstReason.message,
-        workflowBlockedReasons.length > 1 ? ` (+${workflowBlockedReasons.length - 1} more)` : ""
-      ] })
-    ] });
-  }
-  return null;
-}
-
-// src/ui-tailwind/chrome/tw-selection-toolbar.tsx
-import { forwardRef } from "react";
-import * as Tooltip from "@radix-ui/react-tooltip";
-import { Baseline, Bold, Highlighter, Italic, MessageSquare, Underline } from "lucide-react";
-
-// src/ui/headless/preserve-editor-selection.ts
-function preserveEditorSelectionMouseDown(event) {
-  event.preventDefault();
-}
-
-// src/ui-tailwind/chrome/tw-selection-toolbar.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var focusRingClass = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-var TwSelectionToolbar = forwardRef(function TwSelectionToolbar2(props, ref) {
-  const { model } = props;
-  const addCommentDisabled = !model.canAddComment;
-  const formattingDisabled = !model.canToggleFormatting;
-  const contextLabel = summarizeSelectionContext(model);
-  const tooltipLabel = addCommentDisabled ? props.disabledReason ?? "Select text within one paragraph to add a DOCX comment" : "Add comment";
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ref,
-      "data-testid": "selection-toolbar",
-      className: "inline-flex max-w-[min(24rem,calc(100vw-2rem))] items-center gap-1.5 rounded-xl border border-border/80 bg-canvas px-1.5 py-1.5 shadow-lg ring-1 ring-border/80",
-      role: "toolbar",
-      "aria-label": "Selection actions",
-      onFocusCapture: props.onFocusCapture,
-      onBlurCapture: props.onBlurCapture,
-      children: [
-        /* @__PURE__ */ jsx2(
-          ToolbarActionButton,
-          {
-            icon: /* @__PURE__ */ jsx2(Bold, { className: "h-3.5 w-3.5" }),
-            label: "Bold selection",
-            pressed: model.boldActive,
-            disabled: formattingDisabled,
-            onClick: props.onToggleBold
-          }
-        ),
-        /* @__PURE__ */ jsx2(
-          ToolbarActionButton,
-          {
-            icon: /* @__PURE__ */ jsx2(Italic, { className: "h-3.5 w-3.5" }),
-            label: "Italic selection",
-            pressed: model.italicActive,
-            disabled: formattingDisabled,
-            onClick: props.onToggleItalic
-          }
-        ),
-        /* @__PURE__ */ jsx2(
-          ToolbarActionButton,
-          {
-            icon: /* @__PURE__ */ jsx2(Underline, { className: "h-3.5 w-3.5" }),
-            label: "Underline selection",
-            pressed: model.underlineActive,
-            disabled: formattingDisabled,
-            onClick: props.onToggleUnderline
-          }
-        ),
-        /* @__PURE__ */ jsx2(
-          ToolbarActionButton,
-          {
-            icon: /* @__PURE__ */ jsx2(Baseline, { className: "h-3.5 w-3.5" }),
-            label: "Text color blue",
-            pressed: false,
-            disabled: formattingDisabled,
-            onClick: () => props.onSetTextColor?.("#1660a8")
-          }
-        ),
-        /* @__PURE__ */ jsx2(
-          ToolbarActionButton,
-          {
-            icon: /* @__PURE__ */ jsx2(Highlighter, { className: "h-3.5 w-3.5" }),
-            label: "Highlight yellow",
-            pressed: false,
-            disabled: formattingDisabled,
-            onClick: () => props.onSetHighlightColor?.("#ffff00")
-          }
-        ),
-        /* @__PURE__ */ jsx2("div", { className: "mx-0.5 h-4 w-px bg-border" }),
-        /* @__PURE__ */ jsxs2(Tooltip.Root, { children: [
-          /* @__PURE__ */ jsx2(Tooltip.Trigger, { asChild: true, children: /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Add comment from selection",
-              disabled: addCommentDisabled,
-              onMouseDown: preserveEditorSelectionMouseDown,
-              onClick: props.onAddComment,
-              className: `inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors text-accent hover:bg-accent-soft disabled:cursor-not-allowed disabled:opacity-30 ${focusRingClass}`,
-              children: /* @__PURE__ */ jsx2(MessageSquare, { className: "h-3.5 w-3.5" })
-            }
-          ) }),
-          /* @__PURE__ */ jsx2(Tooltip.Portal, { children: /* @__PURE__ */ jsx2(
-            Tooltip.Content,
-            {
-              className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50",
-              sideOffset: 6,
-              children: tooltipLabel
-            }
-          ) })
-        ] }),
-        model.previewText ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-          /* @__PURE__ */ jsx2("div", { className: "mx-0.5 h-4 w-px bg-border" }),
-          /* @__PURE__ */ jsx2("span", { className: "max-w-[8rem] truncate text-[11px] text-secondary", children: model.previewText })
-        ] }) : null,
-        contextLabel ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-          !model.previewText ? /* @__PURE__ */ jsx2("div", { className: "mx-0.5 h-4 w-px bg-border" }) : null,
-          /* @__PURE__ */ jsx2(
-            "span",
-            {
-              className: `min-w-0 max-w-[11rem] truncate rounded-full px-2 py-0.5 text-[10px] font-medium tracking-[0.08em] ${model.badges.some((badge) => badge.tone === "accent") ? "bg-accent-soft text-accent" : "bg-surface text-tertiary"}`,
-              children: contextLabel
-            }
-          )
-        ] }) : null
-      ]
-    }
-  );
-});
-function summarizeSelectionContext(model) {
-  if (model.badges.length === 0) {
-    return null;
-  }
-  const accentBadges = model.badges.filter((badge) => badge.tone === "accent");
-  const source = accentBadges.length > 0 ? accentBadges : model.badges;
-  const labels = source.slice(0, 2).map((badge) => badge.label.trim()).filter(Boolean);
-  if (labels.length === 0) {
-    return null;
-  }
-  const summary = labels.join(" \xB7 ");
-  return summary.length > 30 ? `${summary.slice(0, 27)}...` : summary;
-}
-function ToolbarActionButton(props) {
-  return /* @__PURE__ */ jsxs2(Tooltip.Root, { children: [
-    /* @__PURE__ */ jsx2(Tooltip.Trigger, { asChild: true, children: /* @__PURE__ */ jsx2(
-      "button",
-      {
-        type: "button",
-        "aria-label": props.label,
-        "aria-pressed": props.pressed,
-        disabled: props.disabled,
-        onMouseDown: preserveEditorSelectionMouseDown,
-        onClick: props.onClick,
-        className: `inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors disabled:cursor-not-allowed disabled:opacity-30 ${props.pressed ? "bg-accent-soft text-accent" : "text-secondary hover:bg-surface"} ${focusRingClass}`,
-        children: props.icon
-      }
-    ) }),
-    /* @__PURE__ */ jsx2(Tooltip.Portal, { children: /* @__PURE__ */ jsx2(
-      Tooltip.Content,
-      {
-        className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50",
-        sideOffset: 6,
-        children: props.label
-      }
-    ) })
-  ] });
-}
-
-// src/ui-tailwind/review/tw-comment-sidebar.tsx
-import { useCallback, useEffect, useRef, useState } from "react";
-import { Check, CornerDownRight, RotateCcw } from "lucide-react";
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var focusRingClass2 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-function TwCommentSidebar(props) {
-  const { comments, activeCommentId, currentUserId } = props;
-  return /* @__PURE__ */ jsxs3("div", { className: "outline-none", children: [
-    /* @__PURE__ */ jsxs3("div", { className: "mb-2 flex items-center gap-2 text-[10px] text-tertiary", children: [
-      /* @__PURE__ */ jsxs3("span", { children: [
-        comments.openCommentIds.length,
-        " open"
-      ] }),
-      /* @__PURE__ */ jsx3("span", { className: "text-border", children: "\xB7" }),
-      /* @__PURE__ */ jsxs3("span", { children: [
-        comments.resolvedCommentIds.length,
-        " resolved"
-      ] }),
-      comments.detachedCommentIds.length > 0 && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-        /* @__PURE__ */ jsx3("span", { className: "text-border", children: "\xB7" }),
-        /* @__PURE__ */ jsxs3("span", { children: [
-          comments.detachedCommentIds.length,
-          " detached"
-        ] })
-      ] })
-    ] }),
-    comments.threads.length > 0 ? /* @__PURE__ */ jsx3("div", { className: "space-y-1.5", children: comments.threads.map((thread) => /* @__PURE__ */ jsx3(
-      CommentThreadCard,
-      {
-        thread,
-        isActive: activeCommentId === thread.commentId,
-        currentUserId,
-        onOpenComment: props.onOpenComment,
-        onResolveComment: props.onResolveComment,
-        onReopenComment: props.onReopenComment,
-        onAddReply: props.onAddReply,
-        onEditBody: props.onEditBody
-      },
-      thread.commentId
-    )) }) : /* @__PURE__ */ jsx3("div", { className: "rounded-lg border border-dashed border-border bg-surface/60 px-2.5 py-3 text-[10px] leading-4 text-tertiary", children: "No comment threads yet. Select text and add one from the toolbar." })
-  ] });
-}
-function CommentThreadCard(props) {
-  const { thread, isActive } = props;
-  const leadEntry = thread.entries[0];
-  const isDraftThread = thread.status === "open" && thread.entryCount === 1 && isEmptyCommentBody(leadEntry?.body);
-  const isOwnComment = props.currentUserId != null && leadEntry?.authorId === props.currentUserId;
-  const canEdit = isOwnComment && thread.status === "open" && props.onEditBody != null;
-  const hasNoBody = isEmptyCommentBody(leadEntry?.body);
-  const showExcerpt = Boolean(thread.excerpt) && !isDraftThread && thread.excerpt !== "Empty thread";
-  const scrollRef = useCallback(
-    (node) => {
-      if (node && isActive && typeof node.scrollIntoView === "function") {
-        node.scrollIntoView({ behavior: "smooth", block: "nearest" });
-      }
-    },
-    [isActive]
-  );
-  return /* @__PURE__ */ jsxs3(
-    "div",
-    {
-      ref: scrollRef,
-      "data-comment-thread-id": thread.commentId,
-      "data-comment-thread-status": thread.status,
-      role: "button",
-      tabIndex: 0,
-      className: [
-        "cursor-pointer rounded-lg border px-2 py-1.5 transition-colors",
-        focusRingClass2,
-        isActive ? "border-accent/25 bg-accent-soft/35" : "border-border bg-canvas hover:border-border-strong hover:bg-surface/70",
-        thread.status === "detached" ? "opacity-70" : ""
-      ].join(" "),
-      onClick: () => props.onOpenComment?.(thread),
-      onKeyDown: (event) => {
-        if (event.key === "Enter" || event.key === " ") {
-          event.preventDefault();
-          props.onOpenComment?.(thread);
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsxs3("div", { className: "mb-1 flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx3("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-accent/10 text-[8px] font-semibold text-accent", children: thread.createdBy.charAt(0).toUpperCase() }),
-          /* @__PURE__ */ jsx3("span", { className: "truncate text-[10px] font-medium text-primary", children: thread.createdBy }),
-          /* @__PURE__ */ jsx3("span", { "data-comment-thread-created-at": "true", className: "text-[9px] text-tertiary", children: formatCommentDate(thread.createdAt) }),
-          /* @__PURE__ */ jsx3("span", { className: "flex-1" }),
-          isDraftThread ? /* @__PURE__ */ jsx3(StatusBadge, { label: "draft", tone: "draft" }) : null,
-          thread.status === "resolved" ? /* @__PURE__ */ jsx3(StatusBadge, { label: "resolved", tone: "resolved" }) : null,
-          thread.status === "detached" ? /* @__PURE__ */ jsx3(StatusBadge, { label: "detached", tone: "detached" }) : null
-        ] }),
-        showExcerpt ? /* @__PURE__ */ jsx3("p", { className: "mb-1 rounded-md border-l-2 border-comment/25 bg-comment-soft/30 px-2 py-1 text-[9px] leading-4 text-comment/80 italic whitespace-pre-wrap break-words line-clamp-2", children: thread.excerpt }) : null,
-        canEdit && (isActive || hasNoBody) ? /* @__PURE__ */ jsx3(
-          InlineEditableBody,
-          {
-            body: leadEntry?.body ?? "",
-            autoFocus: isActive && hasNoBody,
-            onSave: (newBody) => props.onEditBody?.(thread.commentId, newBody),
-            label: isDraftThread ? "New comment" : void 0
-          }
-        ) : leadEntry?.body ? /* @__PURE__ */ jsx3(
-          "p",
-          {
-            className: "text-[10px] leading-[1.1rem] text-secondary whitespace-pre-wrap break-words line-clamp-4",
-            "data-comment-thread-body": "true",
-            children: leadEntry.body
-          }
-        ) : canEdit ? /* @__PURE__ */ jsx3(
-          "p",
-          {
-            className: "cursor-text text-[10px] italic text-tertiary",
-            onClick: (e) => {
-              e.stopPropagation();
-              props.onOpenComment?.(thread);
-            },
-            children: "New comment"
-          }
-        ) : null,
-        thread.entries.slice(1).map((entry) => /* @__PURE__ */ jsxs3("div", { className: "mt-1.5 ml-4 border-l border-border/50 pl-2.5", children: [
-          /* @__PURE__ */ jsxs3("div", { className: "mb-0.5 flex items-center gap-1", children: [
-            /* @__PURE__ */ jsx3("span", { className: "text-[9px] font-medium text-secondary", children: entry.authorId }),
-            /* @__PURE__ */ jsx3("span", { className: "text-[9px] text-tertiary", children: formatCommentDate(entry.createdAt) })
-          ] }),
-          /* @__PURE__ */ jsx3(
-            "p",
-            {
-              className: "text-[10px] leading-4 text-secondary whitespace-pre-wrap break-words line-clamp-3",
-              "data-comment-reply-body": "true",
-              children: entry.body
-            }
-          )
-        ] }, entry.entryId)),
-        thread.entryCount > thread.entries.length ? /* @__PURE__ */ jsxs3("p", { className: "mt-1 text-[9px] text-tertiary", children: [
-          "+",
-          thread.entryCount - thread.entries.length,
-          " more"
-        ] }) : null,
-        /* @__PURE__ */ jsxs3("div", { className: "mt-1 flex items-center gap-0.5", children: [
-          thread.status === "open" && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-            /* @__PURE__ */ jsxs3(
-              "button",
-              {
-                type: "button",
-                className: "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium text-insert hover:bg-insert-soft transition-colors",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  props.onResolveComment?.(thread.commentId);
-                },
-                children: [
-                  /* @__PURE__ */ jsx3(Check, { className: "h-2 w-2" }),
-                  " Resolve"
-                ]
-              }
-            ),
-            props.onAddReply && /* @__PURE__ */ jsx3(ReplyInput, { commentId: thread.commentId, onAddReply: props.onAddReply })
-          ] }),
-          thread.status === "resolved" && /* @__PURE__ */ jsxs3(
-            "button",
-            {
-              type: "button",
-              className: "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium text-secondary hover:bg-surface transition-colors",
-              "data-comment-thread-action": "reopen",
-              onClick: (e) => {
-                e.stopPropagation();
-                props.onReopenComment?.(thread.commentId);
-              },
-              children: [
-                /* @__PURE__ */ jsx3(RotateCcw, { className: "h-2 w-2" }),
-                " Reopen"
-              ]
-            }
-          ),
-          thread.status === "detached" && /* @__PURE__ */ jsx3("span", { className: "text-[9px] text-comment", children: "Detached" })
-        ] })
-      ]
-    }
-  );
-}
-function InlineEditableBody(props) {
-  const [isEditing, setIsEditing] = useState(props.autoFocus || props.body === "");
-  const [draft, setDraft] = useState(props.body);
-  const textareaRef = useRef(null);
-  useEffect(() => {
-    if (isEditing && textareaRef.current) {
-      textareaRef.current.focus();
-      textareaRef.current.setSelectionRange(draft.length, draft.length);
-    }
-  }, [isEditing]);
-  if (!isEditing) {
-    return /* @__PURE__ */ jsx3(
-      "p",
-      {
-        className: `cursor-text rounded px-1 text-[10px] leading-[1.15rem] -mx-1 transition-colors hover:bg-surface ${props.body ? "text-secondary" : "text-tertiary italic"}`,
-        onClick: (e) => {
-          e.stopPropagation();
-          setDraft(props.body);
-          setIsEditing(true);
-        },
-        title: "Click to edit",
-        children: props.body || "Click to add comment\u2026"
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs3("div", { className: "space-y-1", children: [
-    props.label ? /* @__PURE__ */ jsx3("span", { className: "block text-[10px] font-medium uppercase tracking-[0.08em] text-tertiary", children: props.label }) : null,
-    /* @__PURE__ */ jsx3(
-      "textarea",
-      {
-        ref: textareaRef,
-        className: "w-full resize-none rounded-md border border-border bg-surface px-2 py-1.5 text-[10px] leading-4 text-primary placeholder:text-tertiary focus:outline-none focus:ring-1 focus:ring-accent",
-        rows: 2,
-        value: draft,
-        placeholder: "Type your comment...",
-        onClick: (e) => e.stopPropagation(),
-        onChange: (e) => setDraft(e.target.value),
-        onBlur: () => {
-          if (draft.trim() && draft.trim() !== props.body) {
-            props.onSave(draft.trim());
-          }
-          setIsEditing(false);
-        },
-        onKeyDown: (e) => {
-          if (e.key === "Enter" && !e.shiftKey) {
-            e.preventDefault();
-            if (draft.trim() && draft.trim() !== props.body) {
-              props.onSave(draft.trim());
-            }
-            setIsEditing(false);
-          }
-          if (e.key === "Escape") {
-            setDraft(props.body);
-            setIsEditing(false);
-          }
-          e.stopPropagation();
-        }
-      }
-    )
-  ] });
-}
-function ReplyInput(props) {
-  const [body, setBody] = useState("");
-  const [isOpen, setIsOpen] = useState(false);
-  const inputRef = useRef(null);
-  useEffect(() => {
-    if (isOpen && inputRef.current) {
-      inputRef.current.focus();
-    }
-  }, [isOpen]);
-  if (!isOpen) {
-    return /* @__PURE__ */ jsxs3(
-      "button",
-      {
-        type: "button",
-        className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 text-[10px] font-medium text-tertiary hover:text-secondary hover:bg-surface transition-colors",
-        onClick: (e) => {
-          e.stopPropagation();
-          setIsOpen(true);
-        },
-        children: [
-          /* @__PURE__ */ jsx3(CornerDownRight, { className: "h-2.5 w-2.5" }),
-          " Reply"
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs3("div", { className: "w-full mt-1.5", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsx3(
-      "textarea",
-      {
-        ref: inputRef,
-        className: "w-full rounded border border-border bg-surface px-2 py-1 text-[11px] text-primary placeholder:text-tertiary resize-none focus:outline-none focus:ring-1 focus:ring-accent",
-        rows: 2,
-        placeholder: "Reply...",
-        value: body,
-        onChange: (e) => setBody(e.target.value),
-        onKeyDown: (e) => {
-          if (e.key === "Enter" && !e.shiftKey && body.trim()) {
-            e.preventDefault();
-            props.onAddReply(props.commentId, body.trim());
-            setBody("");
-            setIsOpen(false);
-          }
-          if (e.key === "Escape") {
-            setBody("");
-            setIsOpen(false);
-          }
-          e.stopPropagation();
-        }
-      }
-    ),
-    /* @__PURE__ */ jsxs3("div", { className: "flex gap-1 mt-0.5", children: [
-      /* @__PURE__ */ jsx3(
-        "button",
-        {
-          type: "button",
-          disabled: !body.trim(),
-          className: "rounded px-1.5 py-0.5 text-[10px] font-medium text-accent hover:bg-accent-soft transition-colors disabled:opacity-40",
-          onClick: () => {
-            if (body.trim()) {
-              props.onAddReply(props.commentId, body.trim());
-              setBody("");
-              setIsOpen(false);
-            }
-          },
-          children: "Send"
-        }
-      ),
-      /* @__PURE__ */ jsx3(
-        "button",
-        {
-          type: "button",
-          className: "rounded px-1.5 py-0.5 text-[10px] text-tertiary hover:bg-surface transition-colors",
-          onClick: () => {
-            setBody("");
-            setIsOpen(false);
-          },
-          children: "Cancel"
-        }
-      )
-    ] })
-  ] });
-}
-function formatCommentDate(raw) {
-  try {
-    const date = new Date(raw);
-    if (Number.isNaN(date.getTime())) return raw;
-    const now = /* @__PURE__ */ new Date();
-    const diffMs = now.getTime() - date.getTime();
-    const diffMin = Math.floor(diffMs / 6e4);
-    if (diffMin < 1) return "just now";
-    if (diffMin < 60) return `${diffMin}m ago`;
-    const diffHours = Math.floor(diffMin / 60);
-    if (diffHours < 24) return `${diffHours}h ago`;
-    const diffDays = Math.floor(diffHours / 24);
-    if (diffDays < 7) return `${diffDays}d ago`;
-    return new Intl.DateTimeFormat("en-US", {
-      month: "short",
-      day: "numeric",
-      year: date.getFullYear() !== now.getFullYear() ? "numeric" : void 0
-    }).format(date);
-  } catch {
-    return raw;
-  }
-}
-function StatusBadge(props) {
-  const styles = {
-    resolved: "text-insert bg-insert-soft",
-    detached: "text-comment bg-warning-soft",
-    draft: "text-secondary bg-subtle"
-  };
-  return /* @__PURE__ */ jsx3(
-    "span",
-    {
-      className: `shrink-0 rounded px-1 py-px text-[8px] font-medium uppercase tracking-[0.08em] ${styles[props.tone] ?? "text-secondary bg-subtle"}`,
-      "data-comment-thread-badge": props.tone,
-      children: props.label
-    }
-  );
-}
-function isEmptyCommentBody(body) {
-  return !body || body.trim() === "";
-}
-
-// src/ui-tailwind/review/tw-revision-sidebar.tsx
-import { Check as Check2, X } from "lucide-react";
-
-// src/ui/shared/revision-filters.ts
-function selectVisibleRevisions(revisions, markupDisplay) {
-  switch (markupDisplay) {
-    case "clean":
-    case "simple":
-      return revisions.filter(
-        (revision) => revision.status === "active" && revision.actionability === "actionable"
-      );
-    case "all":
-      return [...revisions];
-  }
-}
-
-// src/ui-tailwind/review/tw-revision-sidebar.tsx
-import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var focusRingClass3 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-function TwRevisionSidebar(props) {
-  const { trackedChanges, markupDisplay, activeRevisionId } = props;
-  const visibleRevisions = selectVisibleRevisions(trackedChanges.revisions, markupDisplay);
-  const actionablePendingCount = trackedChanges.revisions.filter(
-    (r) => r.status === "active" && r.actionability === "actionable"
-  ).length;
-  return /* @__PURE__ */ jsxs4("div", { className: "outline-none", children: [
-    /* @__PURE__ */ jsxs4("p", { className: "mb-2 text-[10px] text-tertiary", children: [
-      trackedChanges.pendingChangeIds.length,
-      " active \xB7 ",
-      trackedChanges.acceptedChangeIds.length,
-      " accepted \xB7 ",
-      trackedChanges.preserveOnlyChangeIds.length,
-      " preserve-only"
-    ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "mb-2 flex gap-1", children: [
-      /* @__PURE__ */ jsxs4(
-        "button",
-        {
-          type: "button",
-          disabled: actionablePendingCount === 0,
-          className: "inline-flex items-center gap-1 rounded-md px-2 py-1 text-[10px] font-semibold text-accent hover:bg-accent-soft transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-          onClick: props.onAcceptAllChanges,
-          children: [
-            "Accept all (",
-            actionablePendingCount,
-            ")"
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx4(
-        "button",
-        {
-          type: "button",
-          disabled: actionablePendingCount === 0,
-          className: "inline-flex items-center gap-1 rounded-md px-2 py-1 text-[10px] text-secondary hover:bg-surface transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-          onClick: props.onRejectAllChanges,
-          children: "Reject all"
-        }
-      )
-    ] }),
-    visibleRevisions.length > 0 ? /* @__PURE__ */ jsx4("div", { className: "space-y-1", children: visibleRevisions.map((rev) => {
-      const isActive = activeRevisionId === rev.revisionId;
-      return /* @__PURE__ */ jsxs4(
-        "div",
-        {
-          role: "button",
-          tabIndex: 0,
-          className: `flex rounded-lg transition-colors cursor-pointer ${focusRingClass3} ${isActive ? "bg-accent-soft" : "hover:bg-surface"}`,
-          onClick: () => props.onOpenRevision?.(rev),
-          onKeyDown: (event) => {
-            if (event.key === "Enter" || event.key === " ") {
-              event.preventDefault();
-              props.onOpenRevision?.(rev);
-            }
-          },
-          children: [
-            /* @__PURE__ */ jsx4("div", { className: `w-0.5 shrink-0 rounded-l-lg ${rev.kind === "insertion" ? "bg-insert" : rev.kind === "deletion" ? "bg-danger" : "bg-tertiary"}` }),
-            /* @__PURE__ */ jsxs4("div", { className: "p-2 flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsxs4("div", { className: "mb-0.5 flex items-start justify-between gap-2", children: [
-                /* @__PURE__ */ jsx4("span", { className: "text-[11px] font-medium text-primary", children: rev.anchorLabel }),
-                /* @__PURE__ */ jsx4(RevisionBadge, { status: rev.status, actionability: rev.actionability })
-              ] }),
-              /* @__PURE__ */ jsxs4("p", { className: "mb-1 text-[10px] text-tertiary", children: [
-                rev.authorId,
-                " \xB7 ",
-                rev.createdAt
-              ] }),
-              rev.excerpt ? /* @__PURE__ */ jsx4("p", { className: `text-[11px] ${rev.kind === "insertion" ? "text-insert" : rev.kind === "deletion" ? "text-danger line-through" : "text-secondary"}`, children: rev.excerpt }) : /* @__PURE__ */ jsx4("p", { className: "text-[11px] text-secondary", children: rev.label }),
-              rev.detail ? /* @__PURE__ */ jsx4("p", { className: "mt-1 text-[10px] text-secondary", children: rev.detail }) : null,
-              /* @__PURE__ */ jsx4("div", { className: "mt-1.5 flex gap-1", children: rev.actionability === "actionable" ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
-                /* @__PURE__ */ jsxs4(
-                  "button",
-                  {
-                    type: "button",
-                    disabled: !rev.canAccept || rev.status === "accepted",
-                    className: "inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 text-[10px] text-insert hover:bg-insert-soft transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      props.onAcceptRevision?.(rev.revisionId);
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx4(Check2, { className: "h-3 w-3" }),
-                      " Accept"
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxs4(
-                  "button",
-                  {
-                    type: "button",
-                    disabled: !rev.canReject || rev.status === "rejected",
-                    className: "inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 text-[10px] text-danger hover:bg-delete-soft transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      props.onRejectRevision?.(rev.revisionId);
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx4(X, { className: "h-3 w-3" }),
-                      " Reject"
-                    ]
-                  }
-                )
-              ] }) : /* @__PURE__ */ jsx4("span", { className: "px-1.5 py-0.5 text-[10px] text-tertiary", children: "Preserve-only" }) })
-            ] })
-          ]
-        },
-        rev.revisionId
-      );
-    }) }) : /* @__PURE__ */ jsx4("p", { className: "text-xs text-tertiary py-4", children: trackedChanges.totalCount > 0 ? "Switch to Full markup to see all tracked changes." : "Tracked change cards will appear here when present." })
-  ] });
-}
-function RevisionBadge(props) {
-  if (props.actionability === "preserve-only") {
-    return /* @__PURE__ */ jsx4("span", { className: "inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium text-comment bg-warning-soft", children: "preserve-only" });
-  }
-  const styles = {
-    active: "text-secondary bg-subtle",
-    accepted: "text-insert bg-insert-soft",
-    rejected: "text-danger bg-delete-soft",
-    detached: "text-comment bg-warning-soft"
-  };
-  return /* @__PURE__ */ jsx4("span", { className: `inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium ${styles[props.status] ?? "text-secondary bg-subtle"}`, children: props.status });
-}
-
-// src/ui-tailwind/review/tw-review-rail.tsx
-import * as Tabs from "@radix-ui/react-tabs";
-import * as ScrollArea from "@radix-ui/react-scroll-area";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-var focusRingClass4 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-function TwReviewRail(props) {
-  const warningCount = props.compatibility.featureEntries.filter(
-    (e) => e.featureClass !== "supported-roundtrip"
-  ).length + props.warnings.length;
-  return /* @__PURE__ */ jsx5(
-    "aside",
-    {
-      "aria-label": "Review rail",
-      className: "flex w-[304px] shrink-0 flex-col border-l border-border bg-canvas",
-      children: /* @__PURE__ */ jsxs5(
-        Tabs.Root,
-        {
-          value: props.activeTab,
-          onValueChange: (v) => props.onActiveTabChange(v),
-          className: "flex flex-1 flex-col min-h-0",
-          children: [
-            /* @__PURE__ */ jsxs5(Tabs.List, { className: "flex shrink-0 border-b border-border px-2", children: [
-              /* @__PURE__ */ jsxs5(
-                Tabs.Trigger,
-                {
-                  value: "comments",
-                  className: `flex-1 py-2 text-xs text-tertiary font-medium transition-colors data-[state=active]:text-primary data-[state=active]:font-semibold data-[state=active]:shadow-[inset_0_-2px_0_var(--color-accent)] outline-none ${focusRingClass4}`,
-                  children: [
-                    "Comments",
-                    " ",
-                    /* @__PURE__ */ jsx5("span", { className: "ml-1 inline-flex min-w-[14px] items-center justify-center rounded-full bg-subtle px-1.5 py-px text-[10px] font-medium text-tertiary", children: props.comments.totalCount })
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsxs5(
-                Tabs.Trigger,
-                {
-                  value: "changes",
-                  className: `flex-1 py-2 text-xs text-tertiary font-medium transition-colors data-[state=active]:text-primary data-[state=active]:font-semibold data-[state=active]:shadow-[inset_0_-2px_0_var(--color-accent)] outline-none ${focusRingClass4}`,
-                  children: [
-                    "Changes",
-                    " ",
-                    /* @__PURE__ */ jsx5("span", { className: "ml-1 inline-flex min-w-[14px] items-center justify-center rounded-full bg-subtle px-1.5 py-px text-[10px] font-medium text-tertiary", children: props.trackedChanges.totalCount })
-                  ]
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs5(ScrollArea.Root, { className: "flex-1 min-h-0", children: [
-              /* @__PURE__ */ jsxs5(ScrollArea.Viewport, { className: "h-full w-full", children: [
-                /* @__PURE__ */ jsx5(Tabs.Content, { value: "comments", className: "p-2.5 outline-none", children: /* @__PURE__ */ jsx5(
-                  TwCommentSidebar,
-                  {
-                    currentUserId: props.currentUserId,
-                    comments: props.comments,
-                    activeCommentId: props.activeCommentId,
-                    onOpenComment: props.onOpenComment,
-                    onResolveComment: props.onResolveComment,
-                    onReopenComment: props.onReopenComment,
-                    onAddReply: props.onAddReply,
-                    onEditBody: props.onEditBody
-                  }
-                ) }),
-                /* @__PURE__ */ jsx5(Tabs.Content, { value: "changes", className: "p-2.5 outline-none", children: /* @__PURE__ */ jsx5(
-                  TwRevisionSidebar,
-                  {
-                    trackedChanges: props.trackedChanges,
-                    markupDisplay: props.markupDisplay,
-                    activeRevisionId: props.activeRevisionId,
-                    onOpenRevision: props.onOpenRevision,
-                    onAcceptRevision: props.onAcceptRevision,
-                    onRejectRevision: props.onRejectRevision,
-                    onAcceptAllChanges: props.onAcceptAllChanges,
-                    onRejectAllChanges: props.onRejectAllChanges
-                  }
-                ) })
-              ] }),
-              /* @__PURE__ */ jsx5(
-                ScrollArea.Scrollbar,
-                {
-                  orientation: "vertical",
-                  className: "flex w-1.5 touch-none select-none p-0.5",
-                  children: /* @__PURE__ */ jsx5(ScrollArea.Thumb, { className: "relative flex-1 rounded-full bg-black/[0.12]" })
-                }
-              )
-            ] })
-          ]
-        }
-      )
-    }
-  );
-}
-
-// src/ui-tailwind/status/tw-status-bar.tsx
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-function TwStatusBar(props) {
-  const saveState = props.isExportBlocked ? "Read-only" : props.isDirty ? "Unsaved" : "Ready";
-  const exportState = props.isExportBlocked ? "Blocked" : props.preserveOnlyCount > 0 ? "Warnings" : "Ready";
-  return /* @__PURE__ */ jsxs6(
-    "footer",
-    {
-      "data-testid": "status-bar",
-      className: "flex h-7 shrink-0 items-center gap-4 border-t border-border px-3 text-xs text-tertiary",
-      children: [
-        /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx6(
-            "span",
-            {
-              className: `inline-block h-1.5 w-1.5 rounded-full ${props.isExportBlocked ? "bg-danger" : props.isDirty ? "bg-comment" : "bg-insert"}`
-            }
-          ),
-          saveState
-        ] }),
-        /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx6(
-            "span",
-            {
-              className: `inline-block h-1.5 w-1.5 rounded-full ${props.isExportBlocked ? "bg-danger" : props.preserveOnlyCount > 0 ? "bg-comment" : "bg-insert"}`
-            }
-          ),
-          "Export ",
-          exportState.toLowerCase()
-        ] }),
-        /* @__PURE__ */ jsxs6("span", { children: [
-          props.commentCount,
-          " comment",
-          props.commentCount !== 1 ? "s" : "",
-          " \xB7",
-          " ",
-          props.changeCount,
-          " change",
-          props.changeCount !== 1 ? "s" : ""
-        ] }),
-        /* @__PURE__ */ jsx6("span", { className: "flex-1" }),
-        /* @__PURE__ */ jsx6("span", { children: props.sessionId })
-      ]
-    }
-  );
-}
-
-// src/ui-tailwind/review/tw-health-panel.tsx
-import { AlertTriangle as AlertTriangle2, Info, Shield, ShieldAlert, ShieldCheck } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
-function TwHealthPanel(props) {
-  const { compatibility, warnings, blockedReasons = [] } = props;
-  const supportedCount = compatibility.featureEntries.filter(
-    (e) => e.featureClass === "supported-roundtrip"
-  ).length;
-  const preserveOnlyCount = compatibility.featureEntries.filter(
-    (e) => e.featureClass === "preserve-only"
-  ).length;
-  const blockedCount = compatibility.featureEntries.filter(
-    (e) => e.featureClass === "unsupported-fatal"
-  ).length;
-  return /* @__PURE__ */ jsxs7("div", { className: "outline-none", children: [
-    /* @__PURE__ */ jsxs7("p", { className: "text-xs text-tertiary mb-3", children: [
-      supportedCount,
-      " supported \xB7 ",
-      preserveOnlyCount,
-      " preserve-only \xB7 ",
-      blockedCount,
-      " blocked",
-      warnings.length > 0 ? ` \xB7 ${warnings.length} warning${warnings.length !== 1 ? "s" : ""}` : ""
-    ] }),
-    /* @__PURE__ */ jsxs7("div", { className: "space-y-1", children: [
-      compatibility.featureEntries.map((entry) => /* @__PURE__ */ jsxs7("div", { className: "flex rounded-lg transition-colors hover:bg-surface", children: [
-        entry.featureClass !== "supported-roundtrip" ? /* @__PURE__ */ jsx7("div", { className: `w-0.5 shrink-0 rounded-l-lg ${entry.featureClass === "unsupported-fatal" ? "bg-danger" : "bg-comment"}` }) : null,
-        /* @__PURE__ */ jsxs7("div", { className: "flex items-start gap-2 p-2.5 flex-1", children: [
-          /* @__PURE__ */ jsx7(HealthIcon, { featureClass: entry.featureClass }),
-          /* @__PURE__ */ jsxs7("div", { className: "flex-1 min-w-0", children: [
-            /* @__PURE__ */ jsxs7("div", { className: "flex items-start justify-between gap-2", children: [
-              /* @__PURE__ */ jsx7("span", { className: "text-sm font-medium text-primary", children: entry.message }),
-              /* @__PURE__ */ jsx7(FeatureClassBadge, { featureClass: entry.featureClass })
-            ] }),
-            /* @__PURE__ */ jsx7("p", { className: "text-xs text-tertiary mt-0.5", children: entry.featureKey })
-          ] })
-        ] })
-      ] }, entry.featureEntryId)),
-      warnings.map((warning) => /* @__PURE__ */ jsxs7("div", { className: "flex rounded-lg transition-colors hover:bg-surface", children: [
-        /* @__PURE__ */ jsx7("div", { className: `w-0.5 shrink-0 rounded-l-lg ${warning.severity === "warning" ? "bg-comment" : "bg-accent"}` }),
-        /* @__PURE__ */ jsxs7("div", { className: "flex items-start gap-2 p-2.5 flex-1", children: [
-          warning.severity === "warning" ? /* @__PURE__ */ jsx7(AlertTriangle2, { className: "h-4 w-4 text-comment shrink-0 mt-0.5" }) : /* @__PURE__ */ jsx7(Info, { className: "h-4 w-4 text-accent shrink-0 mt-0.5" }),
-          /* @__PURE__ */ jsxs7("div", { className: "flex-1 min-w-0", children: [
-            /* @__PURE__ */ jsxs7("div", { className: "flex items-start justify-between gap-2", children: [
-              /* @__PURE__ */ jsx7("span", { className: "text-sm font-medium text-primary", children: warning.message }),
-              /* @__PURE__ */ jsx7("span", { className: `inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium ${warning.severity === "warning" ? "text-comment bg-warning-soft" : "text-accent bg-accent-soft"}`, children: warning.code.replace(/_/g, " ") })
-            ] }),
-            /* @__PURE__ */ jsx7("p", { className: "text-xs text-tertiary mt-0.5", children: warning.source })
-          ] })
-        ] })
-      ] }, warning.warningId)),
-      blockedReasons.length > 0 ? /* @__PURE__ */ jsxs7(Fragment4, { children: [
-        /* @__PURE__ */ jsx7("div", { className: "border-t border-border mt-2 pt-2", children: /* @__PURE__ */ jsx7("p", { className: "text-xs font-medium text-tertiary mb-1", children: "Workflow blocked reasons" }) }),
-        blockedReasons.map((reason, index) => /* @__PURE__ */ jsxs7("div", { className: "flex rounded-lg transition-colors hover:bg-surface", children: [
-          /* @__PURE__ */ jsx7("div", { className: "w-0.5 shrink-0 rounded-l-lg bg-amber-400" }),
-          /* @__PURE__ */ jsxs7("div", { className: "flex items-start gap-2 p-2.5 flex-1", children: [
-            /* @__PURE__ */ jsx7(ShieldAlert, { className: "h-4 w-4 text-amber-500 shrink-0 mt-0.5" }),
-            /* @__PURE__ */ jsxs7("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsxs7("div", { className: "flex items-start justify-between gap-2", children: [
-                /* @__PURE__ */ jsx7("span", { className: "text-sm font-medium text-primary", children: reason.message }),
-                /* @__PURE__ */ jsx7("span", { className: "inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium text-amber-700 bg-amber-100", children: reason.code.replace(/_/g, " ") })
-              ] }),
-              reason.scopeId ? /* @__PURE__ */ jsxs7("p", { className: "text-xs text-tertiary mt-0.5", children: [
-                "scope: ",
-                reason.scopeId
-              ] }) : null
-            ] })
-          ] })
-        ] }, `blocked-${index}`))
-      ] }) : null,
-      compatibility.featureEntries.length === 0 && warnings.length === 0 && blockedReasons.length === 0 ? /* @__PURE__ */ jsx7("p", { className: "text-xs text-tertiary py-4", children: "No compatibility entries or warnings to display." }) : null
-    ] })
-  ] });
-}
-function HealthIcon(props) {
-  switch (props.featureClass) {
-    case "supported-roundtrip":
-      return /* @__PURE__ */ jsx7(ShieldCheck, { className: "h-4 w-4 text-insert shrink-0 mt-0.5" });
-    case "preserve-only":
-      return /* @__PURE__ */ jsx7(Shield, { className: "h-4 w-4 text-comment shrink-0 mt-0.5" });
-    case "unsupported-fatal":
-      return /* @__PURE__ */ jsx7(ShieldAlert, { className: "h-4 w-4 text-danger shrink-0 mt-0.5" });
-  }
-}
-function FeatureClassBadge(props) {
-  const styles = {
-    "supported-roundtrip": "text-insert bg-insert-soft",
-    "preserve-only": "text-comment bg-warning-soft",
-    "unsupported-fatal": "text-danger bg-delete-soft"
-  };
-  const labels = {
-    "supported-roundtrip": "supported",
-    "preserve-only": "preserve-only",
-    "unsupported-fatal": "blocked"
-  };
-  return /* @__PURE__ */ jsx7("span", { className: `inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium ${styles[props.featureClass]}`, children: labels[props.featureClass] });
-}
-
-// src/ui-tailwind/toolbar/tw-toolbar-icon-button.tsx
-import * as Tooltip2 from "@radix-ui/react-tooltip";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
-var focusRingClass5 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-function TwToolbarIconButton(props) {
-  return /* @__PURE__ */ jsxs8(Tooltip2.Root, { children: [
-    /* @__PURE__ */ jsx8(Tooltip2.Trigger, { asChild: true, children: /* @__PURE__ */ jsx8(
-      "button",
-      {
-        type: "button",
-        "aria-label": props.label,
-        disabled: props.disabled,
-        onMouseDown: preserveEditorSelectionMouseDown,
-        onClick: props.onClick,
-        className: [
-          "inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors outline-none",
-          "disabled:opacity-30 disabled:cursor-not-allowed",
-          props.emphasis ? "text-accent hover:bg-accent-soft" : props.active ? "bg-accent-soft text-accent" : "text-secondary hover:bg-surface hover:text-primary",
-          focusRingClass5
-        ].join(" "),
-        children: /* @__PURE__ */ jsx8(props.icon, { className: "h-4 w-4" })
-      }
-    ) }),
-    /* @__PURE__ */ jsx8(Tooltip2.Portal, { children: /* @__PURE__ */ jsx8(
-      Tooltip2.Content,
-      {
-        className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50",
-        sideOffset: 6,
-        children: props.label
-      }
-    ) })
-  ] });
-}
-
-// src/ui-tailwind/toolbar/tw-toolbar.tsx
-import React3 from "react";
-import * as Popover from "@radix-ui/react-popover";
-import * as Select from "@radix-ui/react-select";
-import * as Toggle from "@radix-ui/react-toggle";
-import * as ToggleGroup from "@radix-ui/react-toggle-group";
-import * as Tooltip3 from "@radix-ui/react-tooltip";
-import {
-  AlignCenter,
-  AlignJustify,
-  AlignLeft,
-  AlignRight,
-  Baseline as Baseline2,
-  Bold as Bold2,
-  ChevronDown,
-  Download,
-  Eye,
-  EyeOff,
-  FileText,
-  Highlighter as Highlighter2,
-  ImagePlus,
-  Indent,
-  Italic as Italic2,
-  MessageSquare as MessageSquare2,
-  Minus,
-  Monitor,
-  MoreHorizontal,
-  Outdent,
-  Plus,
-  Redo2,
-  Rows3,
-  Strikethrough,
-  Subscript,
-  Superscript,
-  ShieldAlert as ShieldAlert2,
-  ShieldCheck as ShieldCheck2,
-  Underline as Underline2,
-  Undo2
-} from "lucide-react";
-import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
-function getSupportedZoomPresets() {
-  return [75, 100, 125, 150];
-}
-var focusRingClass6 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-var FONT_FAMILIES = ["Arial", "Times New Roman", "Calibri", "Cambria", "Georgia", "Verdana"];
-var FONT_SIZES = [8, 9, 10, 11, 12, 14, 16, 18, 20, 24, 28, 36];
-var TEXT_COLORS = ["#000000", "#434343", "#1660a8", "#1a7f37", "#cf222e", "#7a4f00"];
-var HIGHLIGHT_COLORS = [
-  { value: "#ffff00", label: "Yellow" },
-  { value: "#00ff00", label: "Green" },
-  { value: "#00ffff", label: "Cyan" },
-  { value: "#ff69b4", label: "Pink" },
-  { value: null, label: "None" }
-];
-function TwToolbar(props) {
-  const caps = props.capabilities;
-  const workspaceMode = props.workspaceMode;
-  const isPageMode = workspaceMode === "page";
-  const paragraphStyles = props.styleCatalog?.paragraphs ?? [];
-  const zoomLevel = props.zoomLevel ?? 100;
-  const canEdit = props.interactionPolicy?.canFormatText ?? (caps ? caps.canEdit : false);
-  const canInsertStructural = props.interactionPolicy?.canInsertStructural ?? canEdit;
-  const canAddComment = props.interactionPolicy?.canAddComment ?? (caps ? caps.canAddComment : false);
-  const zoomLabel = typeof zoomLevel === "number" ? `${zoomLevel}%` : zoomLevel === "pageWidth" ? "Fit width" : "Fit page";
-  return /* @__PURE__ */ jsxs9("header", { className: "flex h-10 shrink-0 items-center gap-1 border-b border-border px-2", children: [
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-0.5", children: [
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Undo2,
-          label: "Undo",
-          disabled: caps ? !caps.canUndo : true,
-          onClick: props.onUndo
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Redo2,
-          label: "Redo",
-          disabled: caps ? !caps.canRedo : true,
-          onClick: props.onRedo
-        }
-      ),
-      /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-      /* @__PURE__ */ jsx9(
-        ToolbarParagraphStyleSelect,
-        {
-          disabled: !canEdit || paragraphStyles.length === 0 || !props.onSetParagraphStyle,
-          styles: paragraphStyles,
-          value: props.formattingState?.paragraphStyleId,
-          onValueChange: props.onSetParagraphStyle
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarFontFamilySelect,
-        {
-          disabled: !canEdit || !props.onSetFontFamily,
-          value: props.formattingState?.fontFamily,
-          onValueChange: props.onSetFontFamily
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarFontSizeSelect,
-        {
-          disabled: !canEdit || !props.onSetFontSize,
-          value: props.formattingState?.fontSize,
-          onValueChange: props.onSetFontSize
-        }
-      ),
-      /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Bold2,
-          label: "Bold",
-          active: props.formattingState?.bold ?? false,
-          disabled: !canEdit,
-          onClick: props.onToggleBold
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Italic2,
-          label: "Italic",
-          active: props.formattingState?.italic ?? false,
-          disabled: !canEdit,
-          onClick: props.onToggleItalic
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Underline2,
-          label: "Underline",
-          active: props.formattingState?.underline ?? false,
-          disabled: !canEdit,
-          onClick: props.onToggleUnderline
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarFormattingOverflow,
-        {
-          disabled: !canEdit,
-          formattingState: props.formattingState,
-          onToggleStrikethrough: props.onToggleStrikethrough,
-          onToggleSuperscript: props.onToggleSuperscript,
-          onToggleSubscript: props.onToggleSubscript
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarColorPopover,
-        {
-          ariaLabel: "Text color",
-          colors: TEXT_COLORS.map((value) => ({ value, label: value })),
-          disabled: !canEdit || !props.onSetTextColor,
-          icon: /* @__PURE__ */ jsx9(Baseline2, { className: "h-3.5 w-3.5" }),
-          onSelect: (value) => {
-            if (value) {
-              props.onSetTextColor?.(value);
-            }
-          },
-          title: "Text color"
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarColorPopover,
-        {
-          ariaLabel: "Highlight color",
-          colors: HIGHLIGHT_COLORS.map((entry) => ({ value: entry.value, label: entry.label })),
-          disabled: !canEdit || !props.onSetHighlightColor,
-          icon: /* @__PURE__ */ jsx9(Highlighter2, { className: "h-3.5 w-3.5" }),
-          onSelect: (value) => props.onSetHighlightColor?.(value),
-          title: "Highlight color"
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarAlignmentPopover,
-        {
-          activeAlignment: props.formattingState?.alignment,
-          disabled: !canEdit || !props.onSetAlignment,
-          onSelect: (alignment) => props.onSetAlignment?.(alignment)
-        }
-      ),
-      /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Outdent,
-          label: "Outdent",
-          disabled: !canEdit,
-          onClick: props.onOutdent
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: Indent,
-          label: "Indent",
-          disabled: !canEdit,
-          onClick: props.onIndent
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarInsertMenu,
-        {
-          disabled: !canInsertStructural,
-          onInsertImage: props.onInsertImage,
-          onInsertPageBreak: props.onInsertPageBreak,
-          onInsertSectionBreak: props.onInsertSectionBreak,
-          onInsertTable: props.onInsertTable
-        }
-      ),
-      props.activeStory && props.activeStory.kind !== "main" ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
-        /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-        /* @__PURE__ */ jsxs9(
-          "button",
-          {
-            type: "button",
-            onClick: props.onCloseStory,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: `inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 text-xs font-medium text-accent hover:bg-accent-soft transition-colors outline-none ${focusRingClass6}`,
-            "aria-label": `Editing ${storyLabel(props.activeStory)} \u2014 click to return to main body`,
-            children: [
-              /* @__PURE__ */ jsx9("span", { className: "text-secondary", children: "\u2190" }),
-              storyLabel(props.activeStory)
-            ]
-          }
-        )
-      ] }) : null
-    ] }),
-    /* @__PURE__ */ jsx9("div", { className: "flex-1 text-center min-w-0", children: /* @__PURE__ */ jsx9("span", { className: "text-sm font-medium truncate block", children: props.sourceLabel ?? "Untitled" }) }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-0.5", children: [
-      /* @__PURE__ */ jsx9(
-        TwToolbarIconButton,
-        {
-          icon: MessageSquare2,
-          label: "Add comment",
-          disabled: !canAddComment,
-          emphasis: true,
-          onClick: props.onAddComment
-        }
-      ),
-      /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-        /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-          Toggle.Root,
-          {
-            pressed: props.showTrackedChanges,
-            onPressedChange: props.onShowTrackedChangesChange,
-            disabled: caps ? !caps.trackChangesSupported : false,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface data-[state=on]:bg-accent-soft data-[state=on]:text-accent outline-none disabled:opacity-40 ${focusRingClass6}`,
-            children: props.showTrackedChanges ? /* @__PURE__ */ jsx9(Eye, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx9(EyeOff, { className: "h-4 w-4" })
-          }
-        ) }),
-        /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(
-          Tooltip3.Content,
-          {
-            className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50",
-            sideOffset: 6,
-            children: props.showTrackedChanges ? "Hide tracked changes" : "Show tracked changes"
-          }
-        ) })
-      ] }),
-      /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-      /* @__PURE__ */ jsxs9(
-        ToggleGroup.Root,
-        {
-          type: "single",
-          value: workspaceMode,
-          onValueChange: (v) => {
-            if (v) props.onWorkspaceModeChange(v);
-          },
-          className: "flex items-center gap-0.5",
-          children: [
-            /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-              /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-                ToggleGroup.Item,
-                {
-                  value: "canvas",
-                  "aria-label": "Canvas workspace",
-                  onMouseDown: preserveEditorSelectionMouseDown,
-                  className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface data-[state=on]:bg-accent-soft data-[state=on]:text-accent outline-none ${focusRingClass6}`,
-                  children: /* @__PURE__ */ jsx9(Monitor, { className: "h-3.5 w-3.5" })
-                }
-              ) }),
-              /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Canvas \u2014 clean flowing text" }) })
-            ] }),
-            /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-              /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-                ToggleGroup.Item,
-                {
-                  value: "page",
-                  "aria-label": "Page workspace",
-                  onMouseDown: preserveEditorSelectionMouseDown,
-                  className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface data-[state=on]:bg-accent-soft data-[state=on]:text-accent outline-none ${focusRingClass6}`,
-                  children: /* @__PURE__ */ jsx9(FileText, { className: "h-3.5 w-3.5" })
-                }
-              ) }),
-              /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Page \u2014 layout-sensitive view" }) })
-            ] })
-          ]
-        }
-      ),
-      isPageMode && props.onZoomChange ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
-        /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-        /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-0.5", children: [
-          /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-            /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Zoom out",
-                className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface outline-none ${focusRingClass6}`,
-                disabled: typeof zoomLevel === "number" && zoomLevel <= 50,
-                onMouseDown: preserveEditorSelectionMouseDown,
-                onClick: () => {
-                  const current = typeof zoomLevel === "number" ? zoomLevel : 100;
-                  props.onZoomChange(Math.max(50, current - 10));
-                },
-                children: /* @__PURE__ */ jsx9(Minus, { className: "h-3 w-3" })
-              }
-            ) }),
-            /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Zoom out" }) })
-          ] }),
-          /* @__PURE__ */ jsxs9(Popover.Root, { children: [
-            /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-              /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-                "button",
-                {
-                  type: "button",
-                  "aria-label": `Zoom: ${zoomLabel}`,
-                  onMouseDown: preserveEditorSelectionMouseDown,
-                  className: `inline-flex h-7 items-center justify-center rounded-md px-1.5 text-[11px] font-medium text-secondary transition-colors hover:bg-surface outline-none ${focusRingClass6}`,
-                  children: zoomLabel
-                }
-              ) }) }),
-              /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Zoom level" }) })
-            ] }),
-            /* @__PURE__ */ jsx9(Popover.Portal, { children: /* @__PURE__ */ jsx9(
-              Popover.Content,
-              {
-                className: "w-[140px] rounded-lg bg-canvas shadow-lg ring-1 ring-border p-1 z-50",
-                sideOffset: 8,
-                align: "center",
-                children: getSupportedZoomPresets().map((preset) => {
-                  const label = `${preset}%`;
-                  return /* @__PURE__ */ jsx9(Popover.Close, { asChild: true, children: /* @__PURE__ */ jsx9(
-                    "button",
-                    {
-                      type: "button",
-                      onMouseDown: preserveEditorSelectionMouseDown,
-                      className: `w-full rounded-md px-3 py-1.5 text-left text-xs transition-colors hover:bg-surface ${zoomLevel === preset ? "font-semibold text-accent" : "text-primary"}`,
-                      onClick: () => props.onZoomChange(preset),
-                      children: label
-                    }
-                  ) }, preset);
-                })
-              }
-            ) })
-          ] }),
-          /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-            /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Zoom in",
-                className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface outline-none ${focusRingClass6}`,
-                disabled: typeof zoomLevel === "number" && zoomLevel >= 200,
-                onMouseDown: preserveEditorSelectionMouseDown,
-                onClick: () => {
-                  const current = typeof zoomLevel === "number" ? zoomLevel : 100;
-                  props.onZoomChange(Math.min(200, current + 10));
-                },
-                children: /* @__PURE__ */ jsx9(Plus, { className: "h-3 w-3" })
-              }
-            ) }),
-            /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Zoom in" }) })
-          ] })
-        ] })
-      ] }) : null,
-      props.compatibility && props.warnings ? /* @__PURE__ */ jsxs9(Popover.Root, { children: [
-        /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-          /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs9(
-            "button",
-            {
-              type: "button",
-              onMouseDown: preserveEditorSelectionMouseDown,
-              className: `relative inline-flex h-7 w-7 items-center justify-center rounded-md transition-colors hover:bg-surface hover:text-primary outline-none ${focusRingClass6} ${(caps?.healthIssueCount ?? 0) > 0 ? "text-secondary" : "text-secondary"}`,
-              children: [
-                (caps?.healthIssueCount ?? 0) > 0 ? /* @__PURE__ */ jsx9(ShieldAlert2, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx9(ShieldCheck2, { className: "h-4 w-4" }),
-                (caps?.healthIssueCount ?? 0) > 0 ? /* @__PURE__ */ jsx9("span", { className: "absolute -top-0.5 -right-0.5 flex h-3 min-w-[12px] items-center justify-center rounded-full bg-tertiary text-[8px] font-medium text-white", children: caps?.healthIssueCount }) : null
-              ]
-            }
-          ) }) }),
-          /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: (caps?.healthIssueCount ?? 0) > 0 ? `Document health \u2014 ${caps?.healthIssueCount} issue${(caps?.healthIssueCount ?? 0) !== 1 ? "s" : ""}` : "Document health \u2014 no issues" }) })
-        ] }),
-        /* @__PURE__ */ jsx9(Popover.Portal, { children: /* @__PURE__ */ jsx9(
-          Popover.Content,
-          {
-            className: "w-[360px] max-h-[480px] overflow-y-auto rounded-lg bg-canvas shadow-lg ring-1 ring-border p-3 z-50",
-            sideOffset: 8,
-            align: "end",
-            children: /* @__PURE__ */ jsx9(
-              TwHealthPanel,
-              {
-                blockedReasons: props.blockedReasons,
-                compatibility: props.compatibility,
-                warnings: props.warnings
-              }
-            )
-          }
-        ) })
-      ] }) : null,
-      /* @__PURE__ */ jsx9("div", { className: "mx-1 h-4 w-px bg-border" }),
-      /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-        /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs9(
-          "button",
-          {
-            type: "button",
-            disabled: caps ? !caps.canExport : true,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: [
-              "inline-flex h-7 items-center gap-1.5 rounded-md px-2.5 text-xs font-semibold transition-colors outline-none",
-              focusRingClass6,
-              caps?.exportBlocked ? "cursor-not-allowed text-danger opacity-50" : "text-accent hover:bg-accent-soft"
-            ].join(" "),
-            onClick: props.onExport,
-            children: [
-              /* @__PURE__ */ jsx9(Download, { className: "h-3.5 w-3.5" }),
-              "Export .docx"
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: caps?.exportBlocked ? "Export blocked by unsupported content" : "Export document" }) })
-      ] })
-    ] })
-  ] });
-}
-function ToolbarParagraphStyleSelect(props) {
-  const resolvedValue = props.value && props.styles.some((style) => style.styleId === props.value) ? props.value : "";
-  return /* @__PURE__ */ jsxs9(
-    Select.Root,
-    {
-      disabled: props.disabled,
-      onValueChange: (value) => props.onValueChange?.(value),
-      value: resolvedValue,
-      children: [
-        /* @__PURE__ */ jsxs9(
-          Select.Trigger,
-          {
-            "aria-label": "Paragraph style",
-            "aria-disabled": props.disabled || void 0,
-            "data-disabled": props.disabled ? "" : void 0,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: `inline-flex h-7 min-w-[8.5rem] items-center justify-between gap-2 rounded-md border border-border bg-canvas px-2.5 text-xs font-medium text-primary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-            children: [
-              /* @__PURE__ */ jsx9(Select.Value, { placeholder: "Style" }),
-              /* @__PURE__ */ jsx9(Select.Icon, { children: /* @__PURE__ */ jsx9(ChevronDown, { className: "h-3.5 w-3.5 text-tertiary" }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx9(Select.Portal, { children: /* @__PURE__ */ jsx9(
-          Select.Content,
-          {
-            align: "start",
-            className: "z-50 overflow-hidden rounded-lg bg-canvas shadow-lg ring-1 ring-border",
-            position: "popper",
-            sideOffset: 8,
-            children: /* @__PURE__ */ jsx9(Select.Viewport, { className: "p-1", children: props.styles.map((style) => /* @__PURE__ */ jsx9(
-              Select.Item,
-              {
-                className: `flex cursor-pointer items-center rounded-md px-2.5 py-1.5 text-xs text-primary outline-none data-[highlighted]:bg-surface data-[state=checked]:bg-accent-soft data-[state=checked]:text-accent ${focusRingClass6}`,
-                value: style.styleId,
-                children: /* @__PURE__ */ jsx9(Select.ItemText, { children: style.displayName })
-              },
-              style.styleId
-            )) })
-          }
-        ) })
-      ]
-    }
-  );
-}
-function ToolbarFontFamilySelect(props) {
-  const resolvedValue = props.value && FONT_FAMILIES.includes(props.value) ? props.value : "";
-  return /* @__PURE__ */ jsxs9(
-    Select.Root,
-    {
-      disabled: props.disabled,
-      onValueChange: (value) => props.onValueChange?.(value),
-      value: resolvedValue,
-      children: [
-        /* @__PURE__ */ jsxs9(
-          Select.Trigger,
-          {
-            "aria-label": "Font family",
-            "aria-disabled": props.disabled || void 0,
-            "data-disabled": props.disabled ? "" : void 0,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: `inline-flex h-7 min-w-[7rem] items-center justify-between gap-2 rounded-md border border-border bg-canvas px-2 text-xs font-medium text-primary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-            children: [
-              /* @__PURE__ */ jsx9(Select.Value, { placeholder: "Font" }),
-              /* @__PURE__ */ jsx9(Select.Icon, { children: /* @__PURE__ */ jsx9(ChevronDown, { className: "h-3.5 w-3.5 text-tertiary" }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx9(Select.Portal, { children: /* @__PURE__ */ jsx9(
-          Select.Content,
-          {
-            align: "start",
-            className: "z-50 overflow-hidden rounded-lg bg-canvas shadow-lg ring-1 ring-border",
-            position: "popper",
-            sideOffset: 8,
-            children: /* @__PURE__ */ jsx9(Select.Viewport, { className: "p-1", children: FONT_FAMILIES.map((font) => /* @__PURE__ */ jsx9(
-              Select.Item,
-              {
-                className: `flex cursor-pointer items-center rounded-md px-2.5 py-1.5 text-xs text-primary outline-none data-[highlighted]:bg-surface data-[state=checked]:bg-accent-soft data-[state=checked]:text-accent ${focusRingClass6}`,
-                value: font,
-                children: /* @__PURE__ */ jsx9(Select.ItemText, { children: font })
-              },
-              font
-            )) })
-          }
-        ) })
-      ]
-    }
-  );
-}
-function ToolbarFontSizeSelect(props) {
-  const resolvedValue = typeof props.value === "number" && FONT_SIZES.includes(props.value) ? String(props.value) : "";
-  return /* @__PURE__ */ jsxs9(
-    Select.Root,
-    {
-      disabled: props.disabled,
-      onValueChange: (value) => props.onValueChange?.(Number(value)),
-      value: resolvedValue,
-      children: [
-        /* @__PURE__ */ jsxs9(
-          Select.Trigger,
-          {
-            "aria-label": "Font size",
-            "aria-disabled": props.disabled || void 0,
-            "data-disabled": props.disabled ? "" : void 0,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            className: `inline-flex h-7 min-w-[4rem] items-center justify-between gap-2 rounded-md border border-border bg-canvas px-2 text-xs font-medium text-primary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-            children: [
-              /* @__PURE__ */ jsx9(Select.Value, { placeholder: "Size" }),
-              /* @__PURE__ */ jsx9(Select.Icon, { children: /* @__PURE__ */ jsx9(ChevronDown, { className: "h-3.5 w-3.5 text-tertiary" }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx9(Select.Portal, { children: /* @__PURE__ */ jsx9(
-          Select.Content,
-          {
-            align: "start",
-            className: "z-50 overflow-hidden rounded-lg bg-canvas shadow-lg ring-1 ring-border",
-            position: "popper",
-            sideOffset: 8,
-            children: /* @__PURE__ */ jsx9(Select.Viewport, { className: "p-1", children: FONT_SIZES.map((size) => /* @__PURE__ */ jsx9(
-              Select.Item,
-              {
-                className: `flex cursor-pointer items-center rounded-md px-2.5 py-1.5 text-xs text-primary outline-none data-[highlighted]:bg-surface data-[state=checked]:bg-accent-soft data-[state=checked]:text-accent ${focusRingClass6}`,
-                value: String(size),
-                children: /* @__PURE__ */ jsx9(Select.ItemText, { children: size })
-              },
-              size
-            )) })
-          }
-        ) })
-      ]
-    }
-  );
-}
-function ToolbarFormattingOverflow(props) {
-  const [open, setOpen] = React3.useState(false);
-  return /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-      /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-        "button",
-        {
-          type: "button",
-          "aria-label": "More text formatting",
-          "aria-expanded": open,
-          disabled: props.disabled,
-          onMouseDown: preserveEditorSelectionMouseDown,
-          onClick: () => setOpen((value) => !value),
-          className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-          children: /* @__PURE__ */ jsx9(MoreHorizontal, { className: "h-3.5 w-3.5" })
-        }
-      ) }),
-      /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "More text formatting" }) })
-    ] }),
-    open ? /* @__PURE__ */ jsxs9("div", { className: "absolute left-0 top-9 z-50 w-[220px] rounded-lg bg-canvas p-2 shadow-lg ring-1 ring-border", children: [
-      /* @__PURE__ */ jsx9("div", { className: "mb-1 px-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Text styling" }),
-      /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-3 gap-1", children: [
-        /* @__PURE__ */ jsx9(
-          ToolbarPopoverActionButton,
-          {
-            active: props.formattingState?.strikethrough ?? false,
-            ariaLabel: "Strikethrough",
-            disabled: props.disabled,
-            icon: /* @__PURE__ */ jsx9(Strikethrough, { className: "h-3.5 w-3.5" }),
-            onClick: () => {
-              props.onToggleStrikethrough?.();
-              setOpen(false);
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx9(
-          ToolbarPopoverActionButton,
-          {
-            active: props.formattingState?.superscript ?? false,
-            ariaLabel: "Superscript",
-            disabled: props.disabled,
-            icon: /* @__PURE__ */ jsx9(Superscript, { className: "h-3.5 w-3.5" }),
-            onClick: () => {
-              props.onToggleSuperscript?.();
-              setOpen(false);
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx9(
-          ToolbarPopoverActionButton,
-          {
-            active: props.formattingState?.subscript ?? false,
-            ariaLabel: "Subscript",
-            disabled: props.disabled,
-            icon: /* @__PURE__ */ jsx9(Subscript, { className: "h-3.5 w-3.5" }),
-            onClick: () => {
-              props.onToggleSubscript?.();
-              setOpen(false);
-            }
-          }
-        )
-      ] })
-    ] }) : null
-  ] });
-}
-function ToolbarColorPopover(props) {
-  const [open, setOpen] = React3.useState(false);
-  return /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-      /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-        "button",
-        {
-          type: "button",
-          "aria-label": props.ariaLabel,
-          "aria-expanded": open,
-          disabled: props.disabled,
-          onMouseDown: preserveEditorSelectionMouseDown,
-          onClick: () => setOpen((value) => !value),
-          className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-          children: props.icon
-        }
-      ) }),
-      /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: props.title }) })
-    ] }),
-    open ? /* @__PURE__ */ jsxs9("div", { className: "absolute left-0 top-9 z-50 w-[180px] rounded-lg bg-canvas p-2 shadow-lg ring-1 ring-border", children: [
-      /* @__PURE__ */ jsx9("div", { className: "mb-1 px-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: props.title }),
-      /* @__PURE__ */ jsx9("div", { className: "grid grid-cols-3 gap-1", children: props.colors.map((color) => /* @__PURE__ */ jsx9(
-        "button",
-        {
-          type: "button",
-          "aria-label": `${props.title} ${color.label}`,
-          disabled: props.disabled,
-          onMouseDown: preserveEditorSelectionMouseDown,
-          onClick: () => {
-            props.onSelect(color.value);
-            setOpen(false);
-          },
-          className: `inline-flex h-8 items-center justify-center rounded-md border border-border text-[10px] font-medium text-primary transition-transform hover:scale-[1.04] disabled:cursor-not-allowed disabled:opacity-40 ${color.value ? "" : "bg-surface"} ${focusRingClass6}`,
-          style: color.value ? { backgroundColor: color.value } : void 0,
-          children: color.value ? /* @__PURE__ */ jsx9("span", { className: "sr-only", children: color.label }) : "None"
-        },
-        `${props.ariaLabel}-${color.label}`
-      )) })
-    ] }) : null
-  ] });
-}
-function ToolbarAlignmentPopover(props) {
-  const [open, setOpen] = React3.useState(false);
-  const alignments = [
-    { value: "left", label: "Align left", icon: /* @__PURE__ */ jsx9(AlignLeft, { className: "h-3.5 w-3.5" }) },
-    { value: "center", label: "Align center", icon: /* @__PURE__ */ jsx9(AlignCenter, { className: "h-3.5 w-3.5" }) },
-    { value: "right", label: "Align right", icon: /* @__PURE__ */ jsx9(AlignRight, { className: "h-3.5 w-3.5" }) },
-    { value: "justify", label: "Align justify", icon: /* @__PURE__ */ jsx9(AlignJustify, { className: "h-3.5 w-3.5" }) }
-  ];
-  return /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-      /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Paragraph alignment",
-          "aria-expanded": open,
-          disabled: props.disabled,
-          onMouseDown: preserveEditorSelectionMouseDown,
-          onClick: () => setOpen((value) => !value),
-          className: `inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-          children: (alignments.find((entry) => entry.value === props.activeAlignment) ?? alignments[0])?.icon
-        }
-      ) }),
-      /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Paragraph alignment" }) })
-    ] }),
-    open ? /* @__PURE__ */ jsxs9("div", { className: "absolute left-0 top-9 z-50 w-[220px] rounded-lg bg-canvas p-2 shadow-lg ring-1 ring-border", children: [
-      /* @__PURE__ */ jsx9("div", { className: "mb-1 px-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Paragraph alignment" }),
-      /* @__PURE__ */ jsx9("div", { className: "grid grid-cols-2 gap-1", children: alignments.map((entry) => /* @__PURE__ */ jsx9(
-        ToolbarPopoverActionButton,
-        {
-          active: props.activeAlignment === entry.value,
-          ariaLabel: entry.label,
-          disabled: props.disabled,
-          icon: entry.icon,
-          onClick: () => {
-            props.onSelect(entry.value);
-            setOpen(false);
-          }
-        },
-        entry.value
-      )) })
-    ] }) : null
-  ] });
-}
-function ToolbarInsertMenu(props) {
-  const [open, setOpen] = React3.useState(false);
-  async function handleImageChange(event) {
-    const file = event.target.files?.[0];
-    if (!file || props.disabled || !props.onInsertImage) {
-      event.target.value = "";
-      return;
-    }
-    const data = new Uint8Array(await file.arrayBuffer());
-    props.onInsertImage({
-      data,
-      mimeType: file.type || "image/png",
-      altText: file.name
-    });
-    setOpen(false);
-    event.target.value = "";
-  }
-  return /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs9(Tooltip3.Root, { children: [
-      /* @__PURE__ */ jsx9(Tooltip3.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs9(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Insert",
-          "aria-expanded": open,
-          disabled: props.disabled,
-          onMouseDown: preserveEditorSelectionMouseDown,
-          onClick: () => setOpen((value) => !value),
-          className: `inline-flex h-7 items-center gap-1 rounded-md border border-border bg-canvas px-2 text-xs font-medium text-primary transition-colors hover:bg-surface outline-none disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-          children: [
-            "Insert",
-            /* @__PURE__ */ jsx9(ChevronDown, { className: "h-3.5 w-3.5 text-tertiary" })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsx9(Tooltip3.Portal, { children: /* @__PURE__ */ jsx9(Tooltip3.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Insert" }) })
-    ] }),
-    open ? /* @__PURE__ */ jsx9("div", { className: "absolute left-0 top-9 z-50 w-[220px] rounded-lg bg-canvas p-2 shadow-lg ring-1 ring-border", children: /* @__PURE__ */ jsxs9("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx9(
-        ToolbarMenuButton,
-        {
-          ariaLabel: "Insert page break",
-          disabled: props.disabled || !props.onInsertPageBreak,
-          icon: /* @__PURE__ */ jsx9(Minus, { className: "h-3.5 w-3.5" }),
-          label: "Page break",
-          onClick: () => {
-            props.onInsertPageBreak?.();
-            setOpen(false);
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarMenuButton,
-        {
-          ariaLabel: "Insert table",
-          disabled: props.disabled || !props.onInsertTable,
-          icon: /* @__PURE__ */ jsx9(Rows3, { className: "h-3.5 w-3.5" }),
-          label: "Table",
-          onClick: () => {
-            props.onInsertTable?.();
-            setOpen(false);
-          }
-        }
-      ),
-      /* @__PURE__ */ jsxs9(
-        "label",
-        {
-          className: `flex h-8 cursor-pointer items-center gap-2 rounded-md px-2 text-xs font-medium text-primary transition-colors hover:bg-surface ${props.disabled || !props.onInsertImage ? "pointer-events-none opacity-40" : ""}`,
-          children: [
-            /* @__PURE__ */ jsx9(ImagePlus, { className: "h-3.5 w-3.5 text-secondary" }),
-            /* @__PURE__ */ jsx9("span", { children: "Image" }),
-            /* @__PURE__ */ jsx9(
-              "input",
-              {
-                accept: "image/png,image/jpeg,image/gif",
-                "aria-label": "Insert image",
-                className: "sr-only",
-                disabled: props.disabled || !props.onInsertImage,
-                type: "file",
-                onChange: (event) => {
-                  void handleImageChange(event);
-                }
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ToolbarMenuButton,
-        {
-          ariaLabel: "Insert next-page section break",
-          disabled: props.disabled || !props.onInsertSectionBreak,
-          icon: /* @__PURE__ */ jsx9(FileText, { className: "h-3.5 w-3.5" }),
-          label: "Next-page section break",
-          onClick: () => {
-            props.onInsertSectionBreak?.("nextPage");
-            setOpen(false);
-          }
-        }
-      )
-    ] }) }) : null
-  ] });
-}
-function ToolbarPopoverActionButton(props) {
-  return /* @__PURE__ */ jsx9(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.ariaLabel,
-      "aria-pressed": props.active,
-      disabled: props.disabled,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: `inline-flex h-8 items-center justify-center rounded-md border border-border transition-colors disabled:cursor-not-allowed disabled:opacity-40 ${props.active ? "bg-accent-soft text-accent" : "bg-canvas text-secondary hover:bg-surface"} ${focusRingClass6}`,
-      children: props.icon
-    }
-  );
-}
-function ToolbarMenuButton(props) {
-  return /* @__PURE__ */ jsxs9(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.ariaLabel,
-      disabled: props.disabled,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: `flex h-8 w-full items-center gap-2 rounded-md px-2 text-left text-xs font-medium text-primary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass6}`,
-      children: [
-        /* @__PURE__ */ jsx9("span", { className: "text-secondary", children: props.icon }),
-        /* @__PURE__ */ jsx9("span", { children: props.label })
-      ]
-    }
-  );
-}
-function storyLabel(target) {
-  switch (target.kind) {
-    case "header":
-      return `Header (${target.variant})`;
-    case "footer":
-      return `Footer (${target.variant})`;
-    case "footnote":
-      return "Footnote";
-    case "endnote":
-      return "Endnote";
-    default:
-      return "Document";
-  }
-}
-
-// src/ui-tailwind/tw-review-workspace.tsx
-import {
-  useCallback as useCallback2,
-  useEffect as useEffect3,
-  useMemo as useMemo2,
-  useRef as useRef3,
-  useState as useState3
-} from "react";
-import * as Tooltip5 from "@radix-ui/react-tooltip";
-import { ChevronLeft, ChevronRight, List as List2 } from "lucide-react";
-
-// src/ui-tailwind/page-chrome-model.ts
-function computeLineMarkersIfEnabled(input) {
-  if (!input.pageLayout?.lineNumbering) {
-    return [];
-  }
-  return input.buildLineNumberMarkers(input.surfaceBlocks, input.pages);
-}
-
-// src/ui-tailwind/chrome/tw-image-context-toolbar.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
-var IMAGE_SIZE_PRESETS = [
-  { label: "Small image", widthEmu: 1828800, heightEmu: 914400 },
-  { label: "Medium image", widthEmu: 2743200, heightEmu: 1371600 },
-  { label: "Large image", widthEmu: 3657600, heightEmu: 1828800 }
-];
-var NUDGE_EMU = 228600;
-function TwImageContextToolbar(props) {
-  const { activeImage } = props;
-  return /* @__PURE__ */ jsxs10(
-    "div",
-    {
-      "data-testid": "image-context-toolbar",
-      className: "flex flex-wrap items-center gap-2 rounded-xl border border-border bg-canvas px-3 py-2 shadow-sm",
-      children: [
-        /* @__PURE__ */ jsx10("span", { className: "text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Image" }),
-        /* @__PURE__ */ jsx10("span", { className: "rounded-full bg-surface px-2 py-1 text-[10px] font-medium uppercase tracking-[0.1em] text-secondary", children: activeImage.display }),
-        IMAGE_SIZE_PRESETS.map((preset) => /* @__PURE__ */ jsx10(
-          ToolbarButton,
-          {
-            ariaLabel: preset.label,
-            disabled: props.disabled || !props.onSetImageLayout,
-            onClick: () => props.onSetImageLayout?.(activeImage.mediaId, {
-              widthEmu: preset.widthEmu,
-              heightEmu: preset.heightEmu
-            }),
-            children: preset.label.replace(" image", "")
-          },
-          preset.label
-        )),
-        activeImage.display === "floating" ? /* @__PURE__ */ jsxs10(Fragment6, { children: [
-          /* @__PURE__ */ jsx10(
-            ToolbarButton,
-            {
-              ariaLabel: "Nudge image left",
-              disabled: props.disabled || !props.onSetImageFrame,
-              onClick: () => props.onSetImageFrame?.(activeImage.mediaId, {
-                horizontalOffsetEmu: (activeImage.horizontalOffsetEmu ?? 0) - NUDGE_EMU
-              }),
-              children: "Left"
-            }
-          ),
-          /* @__PURE__ */ jsx10(
-            ToolbarButton,
-            {
-              ariaLabel: "Nudge image right",
-              disabled: props.disabled || !props.onSetImageFrame,
-              onClick: () => props.onSetImageFrame?.(activeImage.mediaId, {
-                horizontalOffsetEmu: (activeImage.horizontalOffsetEmu ?? 0) + NUDGE_EMU
-              }),
-              children: "Right"
-            }
-          ),
-          /* @__PURE__ */ jsx10(
-            ToolbarButton,
-            {
-              ariaLabel: "Nudge image up",
-              disabled: props.disabled || !props.onSetImageFrame,
-              onClick: () => props.onSetImageFrame?.(activeImage.mediaId, {
-                verticalOffsetEmu: (activeImage.verticalOffsetEmu ?? 0) - NUDGE_EMU
-              }),
-              children: "Up"
-            }
-          ),
-          /* @__PURE__ */ jsx10(
-            ToolbarButton,
-            {
-              ariaLabel: "Nudge image down",
-              disabled: props.disabled || !props.onSetImageFrame,
-              onClick: () => props.onSetImageFrame?.(activeImage.mediaId, {
-                verticalOffsetEmu: (activeImage.verticalOffsetEmu ?? 0) + NUDGE_EMU
-              }),
-              children: "Down"
-            }
-          )
-        ] }) : null
-      ]
-    }
-  );
-}
-function ToolbarButton(props) {
-  return /* @__PURE__ */ jsx10(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.ariaLabel,
-      disabled: props.disabled,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: "inline-flex h-8 items-center rounded-md px-2 text-xs font-medium text-primary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40",
-      children: props.children
-    }
-  );
-}
-
-// src/ui-tailwind/chrome/tw-layout-panel.tsx
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
-function TwLayoutPanel(props) {
-  const nextOrientation = props.pageLayout.orientation === "portrait" ? "landscape" : "portrait";
-  const titlePageEnabled = props.pageLayout.differentFirstPage;
-  return /* @__PURE__ */ jsxs11("div", { className: "mt-3 flex flex-wrap items-center gap-2 rounded-xl border border-border bg-canvas px-3 py-2 shadow-sm", children: [
-    /* @__PURE__ */ jsx11("span", { className: "text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Section" }),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: "Insert next-page section break",
-        disabled: props.readOnly || !props.onInsertSectionBreak,
-        onClick: () => props.onInsertSectionBreak?.("nextPage"),
-        children: "Next-page break"
-      }
-    ),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: `Switch section to ${nextOrientation}`,
-        disabled: props.readOnly || !props.onUpdateSectionLayout,
-        onClick: () => props.onUpdateSectionLayout?.(props.pageLayout.sectionIndex, {
-          pageSize: {
-            orientation: nextOrientation,
-            width: props.pageLayout.pageHeight,
-            height: props.pageLayout.pageWidth
-          }
-        }),
-        children: nextOrientation === "landscape" ? "Landscape" : "Portrait"
-      }
-    ),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: "Delete current section break",
-        disabled: props.readOnly || props.pageLayout.sectionIndex === 0 || !props.onDeleteSectionBreak,
-        onClick: () => props.onDeleteSectionBreak?.(props.pageLayout.sectionIndex),
-        children: "Delete break"
-      }
-    ),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: "Restart page numbering at 1",
-        disabled: props.readOnly || !props.onSetSectionPageNumbering,
-        onClick: () => props.onSetSectionPageNumbering?.(props.pageLayout.sectionIndex, {
-          ...props.pageLayout.pageNumbering ?? {},
-          start: 1
-        }),
-        children: "Restart numbering"
-      }
-    ),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: "Use roman page numbering",
-        disabled: props.readOnly || !props.onSetSectionPageNumbering,
-        onClick: () => props.onSetSectionPageNumbering?.(props.pageLayout.sectionIndex, {
-          ...props.pageLayout.pageNumbering ?? {},
-          format: "roman"
-        }),
-        children: "Roman numerals"
-      }
-    ),
-    /* @__PURE__ */ jsx11(
-      ToolbarButton2,
-      {
-        ariaLabel: "Toggle different first page",
-        disabled: props.readOnly || !props.onUpdateSectionLayout,
-        onClick: () => props.onUpdateSectionLayout?.(props.pageLayout.sectionIndex, {
-          titlePage: !titlePageEnabled
-        }),
-        children: titlePageEnabled ? "Same first page" : "Different first page"
-      }
-    )
-  ] });
-}
-function ToolbarButton2(props) {
-  return /* @__PURE__ */ jsx11(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.ariaLabel,
-      disabled: props.disabled,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: "inline-flex h-8 items-center rounded-md px-2 text-xs font-medium text-primary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40",
-      children: props.children
-    }
-  );
-}
-
-// src/ui-tailwind/chrome/tw-object-context-toolbar.tsx
-import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
-function TwObjectContextToolbar(props) {
-  const label = props.activeObject.kind === "textbox" ? "Text box" : "Shape";
-  return /* @__PURE__ */ jsxs12(
-    "div",
-    {
-      "data-testid": "object-context-toolbar",
-      className: "flex flex-wrap items-center gap-2 rounded-xl border border-border bg-canvas px-3 py-2 shadow-sm",
-      children: [
-        /* @__PURE__ */ jsx12("span", { className: "text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Object" }),
-        /* @__PURE__ */ jsx12("span", { className: "rounded-full bg-surface px-2 py-1 text-[10px] font-medium uppercase tracking-[0.1em] text-secondary", children: label }),
-        /* @__PURE__ */ jsx12("span", { className: "rounded-full bg-surface px-2 py-1 text-[10px] font-medium uppercase tracking-[0.1em] text-secondary", children: props.activeObject.display }),
-        /* @__PURE__ */ jsx12("span", { className: "text-xs text-secondary", children: "Object selection is active." })
-      ]
-    }
-  );
-}
-
-// src/ui-tailwind/chrome/tw-page-ruler.tsx
-import { useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
-import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
-var MIN_HANDLE_TWIPS = 0;
-var HANDLE_OVERLAP_THRESHOLD_PERCENT = 1.4;
-var HANDLE_OFFSET_PERCENT = 0.9;
-var MARKER_HALF_PX = 8;
-function TwPageRuler(props) {
-  const trackRef = useRef2(null);
-  const dragCleanupRef = useRef2(null);
-  const [, setDragState] = useState2(null);
-  const [previewLayout, setPreviewLayout] = useState2(null);
-  const effectiveLayout = previewLayout ?? props.paragraphLayout;
-  const activeRegion = props.viewState.activePageRegion?.region ?? "body";
-  const isBodyParagraphContext = activeRegion === "body" && Boolean(props.paragraphLayout);
-  const availableHeader = props.pageLayout.headerVariants[0];
-  const availableFooter = props.pageLayout.footerVariants[0];
-  const usablePageWidth = Math.max(
-    1440,
-    props.pageLayout.pageWidth - props.pageLayout.marginLeft - props.pageLayout.marginRight
-  );
-  useEffect2(() => {
-    return () => {
-      dragCleanupRef.current?.();
-    };
-  }, []);
-  function beginDrag(kind, clientX) {
-    if (!isBodyParagraphContext || !props.paragraphLayout || props.readOnly) {
-      return;
-    }
-    dragCleanupRef.current?.();
-    const activeDrag = {
-      kind,
-      startClientX: clientX,
-      startLeftIndent: props.paragraphLayout.leftIndent,
-      startFirstLineOffset: props.paragraphLayout.firstLineOffset
-    };
-    setDragState(activeDrag);
-    const handleMouseMove = (event) => {
-      const track = trackRef.current;
-      if (!track) {
-        return;
-      }
-      const rect = track.getBoundingClientRect();
-      const deltaPx = event.clientX - activeDrag.startClientX;
-      const deltaTwips = pxToTwips(deltaPx, rect.width, usablePageWidth);
-      if (activeDrag.kind === "left-indent") {
-        setPreviewLayout({
-          ...props.paragraphLayout,
-          leftIndent: clampTwips(activeDrag.startLeftIndent + deltaTwips),
-          firstLineOffset: activeDrag.startFirstLineOffset
-        });
-        return;
-      }
-      setPreviewLayout({
-        ...props.paragraphLayout,
-        leftIndent: activeDrag.startLeftIndent,
-        firstLineOffset: activeDrag.startFirstLineOffset + deltaTwips
-      });
-    };
-    const handleMouseUp = (event) => {
-      const track = trackRef.current;
-      if (!track || !props.onSetIndentation) {
-        cleanupDrag();
-        setDragState(null);
-        setPreviewLayout(null);
-        return;
-      }
-      const rect = track.getBoundingClientRect();
-      const deltaPx = event.clientX - activeDrag.startClientX;
-      const deltaTwips = pxToTwips(deltaPx, rect.width, usablePageWidth);
-      const leftIndent = activeDrag.kind === "left-indent" ? clampTwips(activeDrag.startLeftIndent + deltaTwips) : activeDrag.startLeftIndent;
-      const firstLineOffset = activeDrag.kind === "first-line" ? activeDrag.startFirstLineOffset + deltaTwips : activeDrag.startFirstLineOffset;
-      cleanupDrag();
-      props.onSetIndentation(
-        composeIndentation(leftIndent, effectiveLayout?.rightIndent ?? props.paragraphLayout?.rightIndent ?? 0, firstLineOffset)
-      );
-      setDragState(null);
-      setPreviewLayout(null);
-    };
-    const cleanupDrag = () => {
-      window.removeEventListener("mousemove", handleMouseMove);
-      window.removeEventListener("mouseup", handleMouseUp);
-      if (dragCleanupRef.current === cleanupDrag) {
-        dragCleanupRef.current = null;
-      }
-    };
-    dragCleanupRef.current = cleanupDrag;
-    window.addEventListener("mousemove", handleMouseMove);
-    window.addEventListener("mouseup", handleMouseUp);
-  }
-  const markerLayout = useMemo(() => {
-    if (!effectiveLayout || !isBodyParagraphContext) {
-      return null;
-    }
-    return {
-      leftIndent: twipsToPercent(effectiveLayout.leftIndent, usablePageWidth),
-      firstLine: twipsToPercent(
-        Math.max(MIN_HANDLE_TWIPS, effectiveLayout.leftIndent + effectiveLayout.firstLineOffset),
-        usablePageWidth
-      ),
-      tabStops: effectiveLayout.tabStops.map((tabStop, index) => ({
-        id: `${tabStop.pos}-${index}`,
-        left: twipsToPercent(tabStop.pos, usablePageWidth)
-      }))
-    };
-  }, [effectiveLayout, isBodyParagraphContext, usablePageWidth]);
-  const handlesOverlap = markerLayout ? Math.abs(markerLayout.leftIndent - markerLayout.firstLine) < HANDLE_OVERLAP_THRESHOLD_PERCENT : false;
-  const leftIndentHandleLeft = markerLayout ? offsetHandlePercent(markerLayout.leftIndent, handlesOverlap ? -HANDLE_OFFSET_PERCENT : 0) : 0;
-  const firstLineHandleLeft = markerLayout ? offsetHandlePercent(markerLayout.firstLine, handlesOverlap ? HANDLE_OFFSET_PERCENT : 0) : 0;
-  return /* @__PURE__ */ jsxs13(
-    "div",
-    {
-      "aria-label": "Page ruler",
-      className: "mb-4 rounded-2xl border border-border bg-surface/80 px-4 py-3 shadow-sm",
-      children: [
-        /* @__PURE__ */ jsxs13("div", { className: "mb-3 flex flex-wrap items-center gap-2", children: [
-          /* @__PURE__ */ jsx13(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Return to document body",
-              title: "Return to document body",
-              onClick: props.onReturnToBody,
-              className: regionButtonClass(activeRegion === "body"),
-              children: "Body"
-            }
-          ),
-          availableHeader ? /* @__PURE__ */ jsx13(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Open header story",
-              title: "Open header story",
-              onClick: props.onOpenHeader,
-              className: regionButtonClass(activeRegion === "header"),
-              children: "Header"
-            }
-          ) : null,
-          availableFooter ? /* @__PURE__ */ jsx13(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Open footer story",
-              title: "Open footer story",
-              onClick: props.onOpenFooter,
-              className: regionButtonClass(activeRegion === "footer"),
-              children: "Footer"
-            }
-          ) : null,
-          props.viewState.activeListContext ? /* @__PURE__ */ jsxs13(Fragment7, { children: [
-            /* @__PURE__ */ jsx13("div", { className: "h-4 w-px bg-border" }),
-            /* @__PURE__ */ jsx13(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Continue numbering",
-                title: "Continue numbering from previous list",
-                disabled: props.readOnly,
-                onClick: props.onContinueNumbering,
-                className: controlButtonClass,
-                children: "Continue"
-              }
-            ),
-            /* @__PURE__ */ jsx13(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Restart numbering",
-                title: "Restart numbering at 1",
-                disabled: props.readOnly,
-                onClick: props.onRestartNumbering,
-                className: controlButtonClass,
-                children: "Restart"
-              }
-            )
-          ] }) : null
-        ] }),
-        /* @__PURE__ */ jsx13(
-          "div",
-          {
-            className: "mb-2 flex items-center justify-between",
-            "aria-label": `Section ${props.pageLayout.sectionIndex + 1}, ${props.pageLayout.orientation}`,
-            title: `Section ${props.pageLayout.sectionIndex + 1} \xB7 ${props.pageLayout.orientation}`,
-            children: /* @__PURE__ */ jsx13("span", { className: "sr-only", children: "Page ruler" })
-          }
-        ),
-        /* @__PURE__ */ jsxs13(
-          "div",
-          {
-            ref: trackRef,
-            "aria-label": "Page ruler track",
-            className: "relative h-14 overflow-hidden rounded-xl border border-border bg-canvas",
-            onClick: (event) => {
-              if (props.readOnly || !isBodyParagraphContext || !props.paragraphLayout || !props.onSetTabStops) {
-                return;
-              }
-              if (event.target.dataset.handle === "true") {
-                return;
-              }
-              const rect = event.currentTarget.getBoundingClientRect();
-              const nextPos = clampTwips(pxToTwips(event.clientX - rect.left, rect.width, usablePageWidth));
-              props.onSetTabStops(
-                [...props.paragraphLayout.tabStops, { pos: nextPos, val: "left" }].sort((left, right) => left.pos - right.pos)
-              );
-            },
-            children: [
-              /* @__PURE__ */ jsx13("div", { className: "absolute inset-x-4 top-2 h-px bg-border" }),
-              /* @__PURE__ */ jsx13("div", { className: "absolute inset-x-4 top-7 h-px bg-border/70" }),
-              Array.from({ length: 8 }, (_, index) => /* @__PURE__ */ jsx13(
-                "div",
-                {
-                  className: "absolute top-1 h-3 w-px bg-border/80",
-                  style: { left: `${12 + index * 12}%` }
-                },
-                `tick-${index}`
-              )),
-              markerLayout ? /* @__PURE__ */ jsxs13(Fragment7, { children: [
-                /* @__PURE__ */ jsx13(
-                  "button",
-                  {
-                    type: "button",
-                    "data-handle": "true",
-                    "aria-label": "Left indent handle",
-                    title: `Left indent: ${effectiveLayout?.leftIndent ?? 0} twips`,
-                    disabled: props.readOnly,
-                    className: `absolute top-8 h-4 w-4 -translate-x-1/2 rounded-[5px] border border-accent/40 bg-accent-soft shadow-sm transition-opacity ${handlesOverlap ? "opacity-80 z-10" : ""}`,
-                    style: { left: markerLeftStyle(leftIndentHandleLeft) },
-                    onMouseDown: (event) => {
-                      event.preventDefault();
-                      beginDrag("left-indent", event.clientX);
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx13(
-                  "button",
-                  {
-                    type: "button",
-                    "data-handle": "true",
-                    "aria-label": "First line indent handle",
-                    title: `First line offset: ${effectiveLayout?.firstLineOffset ?? 0} twips`,
-                    disabled: props.readOnly,
-                    className: `absolute top-1 h-4 w-4 -translate-x-1/2 rotate-45 rounded-[4px] border border-primary/30 bg-surface-raised shadow-sm transition-opacity ${handlesOverlap ? "opacity-80 z-20" : ""}`,
-                    style: { left: markerLeftStyle(firstLineHandleLeft) },
-                    onMouseDown: (event) => {
-                      event.preventDefault();
-                      beginDrag("first-line", event.clientX);
-                    }
-                  }
-                ),
-                markerLayout.tabStops.map((tabStop) => /* @__PURE__ */ jsx13(
-                  "div",
-                  {
-                    "data-handle": "true",
-                    "aria-label": `Tab stop at ${tabStop.left.toFixed(0)}%`,
-                    title: `Tab stop`,
-                    className: "absolute top-5 h-4 w-4 -translate-x-1/2 rounded-sm border border-border bg-surface-raised shadow-sm",
-                    style: { left: markerLeftStyle(tabStop.left) }
-                  },
-                  tabStop.id
-                ))
-              ] }) : null
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-function composeIndentation(leftIndent, rightIndent, firstLineOffset) {
-  const indentation = {};
-  if (leftIndent > 0) {
-    indentation.left = leftIndent;
-  }
-  if (rightIndent > 0) {
-    indentation.right = rightIndent;
-  }
-  if (firstLineOffset > 0) {
-    indentation.firstLine = Math.round(firstLineOffset);
-  } else if (firstLineOffset < 0) {
-    indentation.hanging = Math.round(Math.abs(firstLineOffset));
-  }
-  return indentation;
-}
-function regionButtonClass(active) {
-  return `inline-flex items-center rounded-full border px-3 py-1 text-xs transition-colors ${active ? "border-accent/30 bg-accent-soft text-accent" : "border-border bg-canvas text-secondary hover:bg-surface"}`;
-}
-var controlButtonClass = "inline-flex items-center rounded-full border border-border bg-canvas px-3 py-1 text-xs text-secondary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-50";
-function twipsToPercent(value, usablePageWidth) {
-  return Math.max(0, Math.min(100, value / usablePageWidth * 100));
-}
-function pxToTwips(px, width, usablePageWidth) {
-  if (width <= 0) {
-    return 0;
-  }
-  return Math.round(px / width * usablePageWidth);
-}
-function clampTwips(value) {
-  return Math.max(MIN_HANDLE_TWIPS, Math.round(value));
-}
-function offsetHandlePercent(value, offset) {
-  return Math.max(0, Math.min(100, value + offset));
-}
-function markerLeftStyle(value) {
-  const clamped = Math.max(0, Math.min(100, value));
-  return `clamp(${MARKER_HALF_PX}px, ${clamped}%, calc(100% - ${MARKER_HALF_PX}px))`;
-}
-
-// src/ui-tailwind/chrome/tw-suggestion-card.tsx
-import * as Tooltip4 from "@radix-ui/react-tooltip";
-import { Check as Check3, MessageSquare as MessageSquare3, Pencil, X as X2 } from "lucide-react";
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
-var focusRingClass7 = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-canvas";
-function TwSuggestionCard(props) {
-  const contextLabel = summarizeSuggestionContext(props.model);
-  const commentDisabled = !props.model.canAddComment;
-  const tooltipLabel = commentDisabled ? props.model.disabledReason ?? "Commenting is unavailable for this selection" : "Comment on suggestion";
-  return /* @__PURE__ */ jsxs14(
-    "div",
-    {
-      "data-testid": "suggestion-card",
-      className: "inline-flex max-w-[min(28rem,calc(100vw-2rem))] flex-col gap-2 rounded-2xl border border-border/80 bg-canvas px-3 py-2 shadow-xl ring-1 ring-border/80",
-      onFocusCapture: props.onFocusCapture,
-      onBlurCapture: props.onBlurCapture,
-      role: "group",
-      "aria-label": "Suggestion actions",
-      children: [
-        /* @__PURE__ */ jsxs14("div", { className: "flex items-start justify-between gap-3", children: [
-          /* @__PURE__ */ jsxs14("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx14("div", { className: "text-[11px] font-semibold uppercase tracking-[0.12em] text-warning", children: props.model.kindLabel }),
-            /* @__PURE__ */ jsx14("div", { className: "mt-1 max-w-[16rem] truncate text-sm text-primary", children: props.model.previewText })
-          ] }),
-          contextLabel ? /* @__PURE__ */ jsx14("div", { className: "shrink-0 rounded-full bg-accent-soft px-2 py-0.5 text-[10px] font-medium uppercase tracking-[0.08em] text-accent", children: contextLabel }) : null
-        ] }),
-        /* @__PURE__ */ jsxs14("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx14(
-            SuggestionActionButton,
-            {
-              icon: /* @__PURE__ */ jsx14(Check3, { className: "h-3.5 w-3.5" }),
-              label: "Accept suggestion",
-              disabled: !props.model.canAccept,
-              tone: "accept",
-              onClick: props.onAccept
-            }
-          ),
-          /* @__PURE__ */ jsx14(
-            SuggestionActionButton,
-            {
-              icon: /* @__PURE__ */ jsx14(X2, { className: "h-3.5 w-3.5" }),
-              label: "Reject suggestion",
-              disabled: !props.model.canReject,
-              tone: "reject",
-              onClick: props.onReject
-            }
-          ),
-          /* @__PURE__ */ jsx14(
-            SuggestionActionButton,
-            {
-              icon: /* @__PURE__ */ jsx14(Pencil, { className: "h-3.5 w-3.5" }),
-              label: "Edit suggestion",
-              disabled: !props.model.canEditSuggestion,
-              tone: "neutral",
-              onClick: props.onEditSuggestion
-            }
-          ),
-          /* @__PURE__ */ jsxs14(Tooltip4.Root, { children: [
-            /* @__PURE__ */ jsx14(Tooltip4.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs14(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Comment on suggestion",
-                disabled: commentDisabled,
-                onMouseDown: preserveEditorSelectionMouseDown,
-                onClick: props.onAddComment,
-                className: `inline-flex h-8 items-center gap-1 rounded-lg border border-border px-2.5 text-xs font-medium text-secondary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40 ${focusRingClass7}`,
-                children: [
-                  /* @__PURE__ */ jsx14(MessageSquare3, { className: "h-3.5 w-3.5" }),
-                  "Comment"
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ jsx14(Tooltip4.Portal, { children: /* @__PURE__ */ jsx14(
-              Tooltip4.Content,
-              {
-                className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50",
-                sideOffset: 6,
-                children: tooltipLabel
-              }
-            ) })
-          ] })
-        ] })
-      ]
-    }
-  );
-}
-function summarizeSuggestionContext(model) {
-  const labels = model.badges.map((badge) => badge.label.trim()).filter(Boolean);
-  if (labels.length === 0) {
-    return null;
-  }
-  const summary = labels.slice(0, 2).join(" \xB7 ");
-  return summary.length > 36 ? `${summary.slice(0, 33)}...` : summary;
-}
-function SuggestionActionButton(props) {
-  const toneClass = props.tone === "accept" ? "border-emerald-500/30 bg-emerald-500/10 text-emerald-700 hover:bg-emerald-500/15 dark:text-emerald-300" : props.tone === "reject" ? "border-rose-500/30 bg-rose-500/10 text-rose-700 hover:bg-rose-500/15 dark:text-rose-300" : "border-border text-secondary hover:bg-surface";
-  return /* @__PURE__ */ jsxs14(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.label,
-      disabled: props.disabled,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: `inline-flex h-8 items-center gap-1 rounded-lg border px-2.5 text-xs font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-40 ${toneClass} ${focusRingClass7}`,
-      children: [
-        props.icon,
-        props.label.replace(" suggestion", "").replace(" on suggestion", "")
-      ]
-    }
-  );
-}
-
-// src/ui-tailwind/chrome/tw-table-context-toolbar.tsx
-import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
-var CELL_COLORS = [
-  "#ffffff",
-  "#f0f0ee",
-  "#dbeafe",
-  "#fef3c7",
-  "#dcfce7",
-  "#fce7f3"
-];
-function TwTableContextToolbar(props) {
-  return /* @__PURE__ */ jsxs15(
-    "div",
-    {
-      "data-testid": "table-context-toolbar",
-      className: "flex flex-wrap items-center gap-2 rounded-xl border border-border bg-canvas px-3 py-2 shadow-sm",
-      children: [
-        /* @__PURE__ */ jsx15("span", { className: "text-[10px] font-semibold uppercase tracking-[0.12em] text-tertiary", children: "Table" }),
-        /* @__PURE__ */ jsxs15(
-          "select",
-          {
-            "aria-label": "Table style",
-            className: "h-8 rounded-md border border-border bg-canvas px-2 text-xs text-primary disabled:opacity-40",
-            disabled: props.disabled || props.tableStyles.length === 0 || !props.onSetTableStyle,
-            onMouseDown: preserveEditorSelectionMouseDown,
-            onChange: (event) => props.onSetTableStyle?.(event.target.value),
-            defaultValue: "",
-            children: [
-              /* @__PURE__ */ jsx15("option", { value: "", disabled: true, children: "Table style" }),
-              props.tableStyles.map((style) => /* @__PURE__ */ jsx15("option", { value: style.styleId, children: style.displayName }, style.styleId))
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Add row above", disabled: props.disabled, onClick: props.onAddRowBefore, children: "Row above" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Add row below", disabled: props.disabled, onClick: props.onAddRowAfter, children: "Row below" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Delete row", disabled: props.disabled, onClick: props.onDeleteRow, children: "Delete row" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Add column left", disabled: props.disabled, onClick: props.onAddColumnBefore, children: "Column left" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Add column right", disabled: props.disabled, onClick: props.onAddColumnAfter, children: "Column right" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Delete column", disabled: props.disabled, onClick: props.onDeleteColumn, children: "Delete column" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Merge cells", disabled: props.disabled, onClick: props.onMergeCells, children: "Merge" }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Split cell", disabled: props.disabled, onClick: props.onSplitCell, children: "Split" }),
-        /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx15("span", { className: "text-[11px] text-secondary", children: "Fill" }),
-          CELL_COLORS.map((color) => /* @__PURE__ */ jsx15(
-            "button",
-            {
-              type: "button",
-              "aria-label": `Set cell fill ${color}`,
-              disabled: props.disabled || !props.onSetCellBackground,
-              onMouseDown: preserveEditorSelectionMouseDown,
-              onClick: () => props.onSetCellBackground?.(color),
-              className: "h-6 w-6 rounded border border-border disabled:opacity-40",
-              style: { backgroundColor: color }
-            },
-            color
-          ))
-        ] }),
-        /* @__PURE__ */ jsx15(ToolbarButton3, { ariaLabel: "Delete table", danger: true, disabled: props.disabled, onClick: props.onDeleteTable, children: "Delete table" })
-      ]
-    }
-  );
-}
-function ToolbarButton3(props) {
-  return /* @__PURE__ */ jsx15(
-    "button",
-    {
-      type: "button",
-      "aria-label": props.ariaLabel,
-      disabled: props.disabled || !props.onClick,
-      onMouseDown: preserveEditorSelectionMouseDown,
-      onClick: props.onClick,
-      className: `inline-flex h-8 items-center rounded-md px-2 text-xs font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-40 ${props.danger ? "text-danger hover:bg-danger/10" : "text-primary hover:bg-surface"}`,
-      children: props.children
-    }
-  );
-}
-
-// src/ui-tailwind/tw-review-workspace.tsx
-import { Fragment as Fragment8, jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
-function TwReviewWorkspace(inputProps) {
-  const props = {
-    ...inputProps,
-    ...inputProps.commands
-  };
-  const { snapshot, viewState } = props;
-  const selectionToolbarRootRef = useRef3(null);
-  const caps = props.capabilities;
-  const isPageWorkspace = props.workspaceMode === "page";
-  const markupDisplay = props.markupDisplay;
-  const [navOpen, setNavOpen] = useState3(false);
-  const [layoutToolsOpen, setLayoutToolsOpen] = useState3(false);
-  const zoomLevel = props.zoomLevel ?? 100;
-  const zoomScale = typeof zoomLevel === "number" ? zoomLevel / 100 : 1;
-  const preserveOnlyCount = caps?.preserveOnlyCount ?? snapshot.compatibility.featureEntries.filter(
-    (entry) => entry.featureClass === "preserve-only"
-  ).length;
-  const blockedReasons = props.interactionGuardSnapshot?.blockedReasons ?? props.workflowScopeSnapshot?.blockedReasons ?? [];
-  const chromeVisibility = {
-    toolbar: true,
-    alerts: true,
-    selectionOverlay: true,
-    contextToolbars: true,
-    pageChrome: true,
-    statusBar: true,
-    reviewRail: true,
-    ...props.chromeVisibility
-  };
-  const showReviewRail = chromeVisibility.reviewRail && (caps?.reviewRailVisible ?? true);
-  const headings = props.documentNavigation?.headings ?? [];
-  const headerVariant = snapshot.pageLayout?.headerVariants[0]?.variant ?? "default";
-  const footerVariant = snapshot.pageLayout?.footerVariants[0]?.variant ?? "default";
-  const selectionPosition = viewState.selection.activeRange.kind === "node" ? viewState.selection.activeRange.at : viewState.selection.head;
-  const activeParagraphLayout = useMemo2(
-    () => resolveActiveParagraphLayout(snapshot.surface, selectionPosition),
-    [selectionPosition, snapshot.surface]
-  );
-  const isTableContext = Boolean(
-    props.formattingState?.breadcrumb.some((item) => item.kind === "table" || item.kind === "table_cell" || item.kind === "table_row")
-  );
-  const contextualSurface = props.activeImageContext ? "image" : props.activeObjectContext ? "object" : isTableContext ? "table" : null;
-  const pageChromeModel = useMemo2(
-    () => buildPageChromeModel(
-      snapshot.surface,
-      snapshot.pageLayout,
-      props.documentNavigation,
-      snapshot.activeStory
-    ),
-    [props.documentNavigation, snapshot.activeStory, snapshot.pageLayout, snapshot.surface]
-  );
-  const selectionToolbarPlacement = resolveSelectionToolbarPlacement(
-    props.selectionToolbarAnchor,
-    selectionToolbarRootRef.current,
-    zoomScale
-  );
-  const activePage = props.documentNavigation?.pages[props.documentNavigation.activePageIndex] ?? null;
-  const pageShellMetrics = useMemo2(
-    () => buildPageShellMetrics(snapshot.pageLayout),
-    [snapshot.pageLayout]
-  );
-  const hidePageBorderForActiveEditing = isPageWorkspace && snapshot.activeStory.kind === "main" && shouldHidePageBorderForSelection(viewState.selection);
-  const effectiveSelectionMode = props.interactionGuardSnapshot?.effectiveMode ?? "edit";
-  const allowLocalChromeMutations = Boolean(caps?.canEdit) && effectiveSelectionMode === "edit";
-  const pageChromeReadOnly = snapshot.readOnly || snapshot.activeStory.kind !== "main" || effectiveSelectionMode !== "edit";
-  const toolbarInteractionPolicy = caps ? {
-    mode: effectiveSelectionMode,
-    canFormatText: caps.canEdit && effectiveSelectionMode === "edit",
-    canInsertStructural: caps.canEdit && effectiveSelectionMode === "edit",
-    canAddComment: caps.canAddComment && effectiveSelectionMode !== "view" && effectiveSelectionMode !== "blocked"
-  } : void 0;
-  useEffect3(() => {
-    recordPerfSample("workspace.chrome");
-    incrementInvalidationCounter("workspace.chrome.recomputes");
-  }, [activeParagraphLayout, pageChromeModel, pageShellMetrics]);
-  useEffect3(() => {
-    if (isPageWorkspace && snapshot.activeStory.kind !== "main") {
-      setLayoutToolsOpen(true);
-    }
-  }, [isPageWorkspace, snapshot.activeStory.kind]);
-  const dismissSelectionToolbar = useCallback2(() => {
-    props.onDismissSelectionToolbar?.();
-  }, [props.onDismissSelectionToolbar]);
-  const runWithSelectionToolbarDismiss = useCallback2(
-    (action) => () => {
-      dismissSelectionToolbar();
-      action?.();
-    },
-    [dismissSelectionToolbar]
-  );
-  return /* @__PURE__ */ jsx16(Tooltip5.Provider, { delayDuration: 400, children: /* @__PURE__ */ jsxs16("div", { className: "flex h-full flex-col bg-canvas text-primary", children: [
-    chromeVisibility.toolbar ? /* @__PURE__ */ jsx16(
-      TwToolbar,
-      {
-        sourceLabel: snapshot.sourceLabel,
-        capabilities: caps,
-        compatibility: snapshot.compatibility,
-        warnings: snapshot.warnings,
-        interactionPolicy: toolbarInteractionPolicy,
-        workspaceMode: props.workspaceMode,
-        zoomLevel: props.zoomLevel,
-        formattingState: props.formattingState,
-        styleCatalog: props.styleCatalog,
-        showTrackedChanges: props.showTrackedChanges,
-        onUndo: runWithSelectionToolbarDismiss(props.onUndo),
-        onRedo: runWithSelectionToolbarDismiss(props.onRedo),
-        onSetParagraphStyle: props.onSetParagraphStyle ? (styleId) => {
-          dismissSelectionToolbar();
-          props.onSetParagraphStyle?.(styleId);
-        } : void 0,
-        onToggleBold: runWithSelectionToolbarDismiss(props.onToggleBold),
-        onToggleItalic: runWithSelectionToolbarDismiss(props.onToggleItalic),
-        onToggleUnderline: runWithSelectionToolbarDismiss(props.onToggleUnderline),
-        onToggleStrikethrough: runWithSelectionToolbarDismiss(props.onToggleStrikethrough),
-        onToggleSuperscript: runWithSelectionToolbarDismiss(props.onToggleSuperscript),
-        onToggleSubscript: runWithSelectionToolbarDismiss(props.onToggleSubscript),
-        onSetFontFamily: props.onSetFontFamily ? (fontFamily) => {
-          dismissSelectionToolbar();
-          props.onSetFontFamily?.(fontFamily);
-        } : void 0,
-        onSetFontSize: props.onSetFontSize ? (fontSize) => {
-          dismissSelectionToolbar();
-          props.onSetFontSize?.(fontSize);
-        } : void 0,
-        onSetTextColor: props.onSetTextColor ? (color) => {
-          dismissSelectionToolbar();
-          props.onSetTextColor?.(color);
-        } : void 0,
-        onSetHighlightColor: props.onSetHighlightColor ? (color) => {
-          dismissSelectionToolbar();
-          props.onSetHighlightColor?.(color);
-        } : void 0,
-        onSetAlignment: props.onSetAlignment ? (alignment) => {
-          dismissSelectionToolbar();
-          props.onSetAlignment?.(alignment);
-        } : void 0,
-        onOutdent: runWithSelectionToolbarDismiss(props.onOutdent),
-        onIndent: runWithSelectionToolbarDismiss(props.onIndent),
-        onAddComment: runWithSelectionToolbarDismiss(props.onAddComment),
-        onInsertPageBreak: runWithSelectionToolbarDismiss(props.onInsertPageBreak),
-        onInsertTable: runWithSelectionToolbarDismiss(props.onInsertTable),
-        onInsertSectionBreak: props.onInsertSectionBreak ? (type) => {
-          dismissSelectionToolbar();
-          props.onInsertSectionBreak?.(type);
-        } : void 0,
-        onInsertImage: props.onInsertImage ? (options) => {
-          dismissSelectionToolbar();
-          props.onInsertImage?.(options);
-        } : void 0,
-        onExport: runWithSelectionToolbarDismiss(props.onExport),
-        activeStory: snapshot.activeStory,
-        onCloseStory: props.onCloseStory ? runWithSelectionToolbarDismiss(props.onCloseStory) : void 0,
-        onWorkspaceModeChange: (value) => {
-          dismissSelectionToolbar();
-          props.onWorkspaceModeChange(value);
-        },
-        onZoomChange: props.onZoomChange ? (level) => {
-          dismissSelectionToolbar();
-          props.onZoomChange?.(level);
-        } : void 0,
-        onShowTrackedChangesChange: (show) => {
-          dismissSelectionToolbar();
-          props.onShowTrackedChangesChange(show);
-        },
-        blockedReasons
-      }
-    ) : null,
-    chromeVisibility.alerts ? /* @__PURE__ */ jsx16(
-      TwAlertBanner,
-      {
-        snapshot,
-        preserveOnlyCount,
-        workflowBlockedReasons: blockedReasons
-      }
-    ) : null,
-    /* @__PURE__ */ jsxs16("div", { className: "flex flex-1 min-h-0", children: [
-      isPageWorkspace && chromeVisibility.pageChrome ? /* @__PURE__ */ jsx16(
-        "aside",
-        {
-          "aria-label": "Document navigator",
-          className: `shrink-0 border-r border-border bg-surface transition-[width] duration-200 ${navOpen ? "w-48" : "w-0"} overflow-hidden`,
-          children: navOpen ? /* @__PURE__ */ jsxs16("div", { className: "flex h-full flex-col", children: [
-            /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border", children: [
-              /* @__PURE__ */ jsx16("span", { className: "text-xs font-medium text-secondary uppercase tracking-wider", children: "Navigator" }),
-              /* @__PURE__ */ jsxs16(Tooltip5.Root, { children: [
-                /* @__PURE__ */ jsx16(Tooltip5.Trigger, { asChild: true, children: /* @__PURE__ */ jsx16(
-                  "button",
-                  {
-                    type: "button",
-                    "aria-label": "Collapse navigator",
-                    onMouseDown: preserveEditorSelectionMouseDown,
-                    onClick: () => {
-                      dismissSelectionToolbar();
-                      setNavOpen(false);
-                    },
-                    className: "inline-flex h-6 w-6 items-center justify-center rounded-md text-secondary hover:bg-surface-hover transition-colors",
-                    children: /* @__PURE__ */ jsx16(ChevronLeft, { className: "h-3.5 w-3.5" })
-                  }
-                ) }),
-                /* @__PURE__ */ jsx16(Tooltip5.Portal, { children: /* @__PURE__ */ jsx16(Tooltip5.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Collapse navigator" }) })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx16("nav", { className: "flex-1 overflow-y-auto px-2 py-2", "aria-label": "Document headings", children: headings.length > 0 ? /* @__PURE__ */ jsx16("ul", { className: "space-y-0.5", children: headings.map((entry) => /* @__PURE__ */ jsx16("li", { children: /* @__PURE__ */ jsx16(
-              "button",
-              {
-                type: "button",
-                className: "block w-full truncate rounded-md px-2 py-1 text-left text-xs text-primary hover:bg-surface-hover",
-                style: { paddingLeft: `${8 + (entry.level - 1) * 12}px` },
-                onMouseDown: preserveEditorSelectionMouseDown,
-                onClick: () => {
-                  dismissSelectionToolbar();
-                  props.onNavigateHeading?.(entry.headingId);
-                  setNavOpen(false);
-                },
-                children: entry.text
-              }
-            ) }, entry.headingId)) }) : /* @__PURE__ */ jsx16("p", { className: "px-2 py-4 text-xs text-tertiary", children: "No headings found." }) })
-          ] }) : null
-        }
-      ) : null,
-      isPageWorkspace && chromeVisibility.pageChrome && !navOpen ? /* @__PURE__ */ jsx16("div", { className: "shrink-0 flex items-start pt-2 pl-1", children: /* @__PURE__ */ jsxs16(Tooltip5.Root, { children: [
-        /* @__PURE__ */ jsx16(Tooltip5.Trigger, { asChild: true, children: /* @__PURE__ */ jsx16(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Open document navigator",
-            onMouseDown: preserveEditorSelectionMouseDown,
-            onClick: () => {
-              dismissSelectionToolbar();
-              setNavOpen(true);
-            },
-            className: "inline-flex h-7 w-7 items-center justify-center rounded-md text-secondary hover:bg-surface-hover transition-colors",
-            children: /* @__PURE__ */ jsx16(List2, { className: "h-3.5 w-3.5" })
-          }
-        ) }),
-        /* @__PURE__ */ jsx16(Tooltip5.Portal, { children: /* @__PURE__ */ jsx16(Tooltip5.Content, { className: "rounded-md bg-primary px-2 py-1 text-xs text-white shadow-md z-50", sideOffset: 6, children: "Open document navigator" }) })
-      ] }) }) : null,
-      /* @__PURE__ */ jsxs16("div", { className: "flex flex-1 flex-col min-w-0", children: [
-        /* @__PURE__ */ jsx16(
-          "div",
-          {
-            className: `flex-1 overflow-y-auto ${isPageWorkspace ? "bg-surface" : "bg-canvas"}`,
-            "data-wre-scroll-root": "true",
-            children: /* @__PURE__ */ jsxs16(
-              "div",
-              {
-                ref: selectionToolbarRootRef,
-                className: `mx-auto min-h-full ${isPageWorkspace ? "wre-page-chrome wre-page-surface relative max-w-[840px] my-8 overflow-hidden" : "wre-canvas-surface relative bg-canvas"}`,
-                style: isPageWorkspace && zoomScale !== 1 ? { transform: `scale(${zoomScale})`, transformOrigin: "top center" } : void 0,
-                children: [
-                  isPageWorkspace && chromeVisibility.pageChrome && snapshot.pageLayout ? /* @__PURE__ */ jsx16("div", { className: "border-b border-border/70 bg-surface/65 px-5 py-3", "data-testid": "page-context-summary", children: /* @__PURE__ */ jsxs16("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
-                    /* @__PURE__ */ jsxs16("div", { className: "flex flex-wrap items-center gap-2 text-xs text-secondary", children: [
-                      /* @__PURE__ */ jsx16("span", { className: "rounded-full bg-canvas px-2 py-1 font-medium text-primary", children: activePage ? `Page ${activePage.pageIndex + 1} of ${props.documentNavigation?.pageCount ?? 1}` : "Page workspace" }),
-                      /* @__PURE__ */ jsx16("span", { children: `Section ${snapshot.pageLayout.sectionIndex + 1}` }),
-                      /* @__PURE__ */ jsx16("span", { className: "uppercase tracking-[0.12em] text-tertiary", children: snapshot.pageLayout.orientation })
-                    ] }),
-                    /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
-                      snapshot.activeStory.kind !== "main" ? /* @__PURE__ */ jsx16(
-                        "button",
-                        {
-                          type: "button",
-                          "aria-label": "Return to document body",
-                          onMouseDown: preserveEditorSelectionMouseDown,
-                          onClick: runWithSelectionToolbarDismiss(props.onCloseStory),
-                          className: "inline-flex items-center gap-1 rounded-md border border-border bg-canvas px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface",
-                          children: "Body"
-                        }
-                      ) : null,
-                      snapshot.activeStory.kind === "main" && snapshot.pageLayout.sectionIndex > 0 ? /* @__PURE__ */ jsxs16(Fragment8, { children: [
-                        /* @__PURE__ */ jsx16(
-                          "button",
-                          {
-                            type: "button",
-                            "aria-label": "Link header to previous",
-                            disabled: !props.onSetHeaderFooterLink || !allowLocalChromeMutations,
-                            onMouseDown: preserveEditorSelectionMouseDown,
-                            onClick: () => {
-                              dismissSelectionToolbar();
-                              props.onSetHeaderFooterLink?.(snapshot.pageLayout.sectionIndex, {
-                                kind: "header",
-                                variant: headerVariant,
-                                linkToPrevious: true
-                              });
-                            },
-                            className: "inline-flex items-center gap-1 rounded-md border border-border bg-canvas px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40",
-                            children: "Link header"
-                          }
-                        ),
-                        /* @__PURE__ */ jsx16(
-                          "button",
-                          {
-                            type: "button",
-                            "aria-label": "Link footer to previous",
-                            disabled: !props.onSetHeaderFooterLink || !allowLocalChromeMutations,
-                            onMouseDown: preserveEditorSelectionMouseDown,
-                            onClick: () => {
-                              dismissSelectionToolbar();
-                              props.onSetHeaderFooterLink?.(snapshot.pageLayout.sectionIndex, {
-                                kind: "footer",
-                                variant: footerVariant,
-                                linkToPrevious: true
-                              });
-                            },
-                            className: "inline-flex items-center gap-1 rounded-md border border-border bg-canvas px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface disabled:cursor-not-allowed disabled:opacity-40",
-                            children: "Link footer"
-                          }
-                        )
-                      ] }) : null,
-                      /* @__PURE__ */ jsxs16(
-                        "button",
-                        {
-                          type: "button",
-                          "aria-label": "Toggle layout tools",
-                          "aria-expanded": layoutToolsOpen,
-                          onMouseDown: preserveEditorSelectionMouseDown,
-                          onClick: () => {
-                            dismissSelectionToolbar();
-                            setLayoutToolsOpen((open) => !open);
-                          },
-                          className: "inline-flex items-center gap-1 rounded-md border border-border bg-canvas px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface",
-                          children: [
-                            /* @__PURE__ */ jsx16(ChevronRight, { className: `h-3.5 w-3.5 transition-transform ${layoutToolsOpen ? "rotate-90" : ""}` }),
-                            "Layout tools"
-                          ]
-                        }
-                      )
-                    ] })
-                  ] }) }) : null,
-                  isPageWorkspace && chromeVisibility.pageChrome && snapshot.pageLayout && layoutToolsOpen ? /* @__PURE__ */ jsxs16("div", { className: "px-5 pt-3", children: [
-                    /* @__PURE__ */ jsx16(
-                      TwPageRuler,
-                      {
-                        pageLayout: snapshot.pageLayout,
-                        viewState,
-                        paragraphLayout: activeParagraphLayout,
-                        readOnly: pageChromeReadOnly,
-                        onReturnToBody: props.onCloseStory ? runWithSelectionToolbarDismiss(props.onCloseStory) : () => void 0,
-                        onOpenHeader: props.onOpenHeaderStory ? runWithSelectionToolbarDismiss(props.onOpenHeaderStory) : void 0,
-                        onOpenFooter: props.onOpenFooterStory ? runWithSelectionToolbarDismiss(props.onOpenFooterStory) : void 0,
-                        onSetIndentation: props.onSetParagraphIndentation ? (indentation) => {
-                          dismissSelectionToolbar();
-                          props.onSetParagraphIndentation?.(indentation);
-                        } : void 0,
-                        onSetTabStops: props.onSetParagraphTabStops ? (tabStops) => {
-                          dismissSelectionToolbar();
-                          props.onSetParagraphTabStops?.(tabStops);
-                        } : void 0,
-                        onRestartNumbering: props.onRestartNumbering ? runWithSelectionToolbarDismiss(props.onRestartNumbering) : void 0,
-                        onContinueNumbering: props.onContinueNumbering ? runWithSelectionToolbarDismiss(props.onContinueNumbering) : void 0
-                      }
-                    ),
-                    /* @__PURE__ */ jsx16(
-                      TwLayoutPanel,
-                      {
-                        pageLayout: snapshot.pageLayout,
-                        readOnly: pageChromeReadOnly,
-                        onInsertSectionBreak: props.onInsertSectionBreak ? (type) => {
-                          dismissSelectionToolbar();
-                          props.onInsertSectionBreak?.(type);
-                        } : void 0,
-                        onDeleteSectionBreak: props.onDeleteSectionBreak ? (sectionIndex) => {
-                          dismissSelectionToolbar();
-                          props.onDeleteSectionBreak?.(sectionIndex);
-                        } : void 0,
-                        onUpdateSectionLayout: props.onUpdateSectionLayout ? (sectionIndex, patch) => {
-                          dismissSelectionToolbar();
-                          props.onUpdateSectionLayout?.(sectionIndex, patch);
-                        } : void 0,
-                        onSetSectionPageNumbering: props.onSetSectionPageNumbering ? (sectionIndex, patch) => {
-                          dismissSelectionToolbar();
-                          props.onSetSectionPageNumbering?.(sectionIndex, patch);
-                        } : void 0
-                      }
-                    )
-                  ] }) : null,
-                  chromeVisibility.contextToolbars && contextualSurface ? /* @__PURE__ */ jsxs16("div", { className: "px-5 pt-3 space-y-3", children: [
-                    contextualSurface === "table" ? /* @__PURE__ */ jsx16(
-                      TwTableContextToolbar,
-                      {
-                        disabled: !allowLocalChromeMutations,
-                        tableStyles: props.styleCatalog?.tables ?? [],
-                        onSetTableStyle: props.onSetTableStyle ? (styleId) => {
-                          dismissSelectionToolbar();
-                          props.onSetTableStyle?.(styleId);
-                        } : void 0,
-                        onAddRowBefore: runWithSelectionToolbarDismiss(props.onAddRowBefore),
-                        onAddRowAfter: runWithSelectionToolbarDismiss(props.onAddRowAfter),
-                        onAddColumnBefore: runWithSelectionToolbarDismiss(props.onAddColumnBefore),
-                        onAddColumnAfter: runWithSelectionToolbarDismiss(props.onAddColumnAfter),
-                        onDeleteRow: runWithSelectionToolbarDismiss(props.onDeleteRow),
-                        onDeleteColumn: runWithSelectionToolbarDismiss(props.onDeleteColumn),
-                        onDeleteTable: runWithSelectionToolbarDismiss(props.onDeleteTable),
-                        onMergeCells: runWithSelectionToolbarDismiss(props.onMergeCells),
-                        onSplitCell: runWithSelectionToolbarDismiss(props.onSplitCell),
-                        onSetCellBackground: props.onSetCellBackground ? (color) => {
-                          dismissSelectionToolbar();
-                          props.onSetCellBackground?.(color);
-                        } : void 0
-                      }
-                    ) : null,
-                    contextualSurface === "image" && props.activeImageContext ? /* @__PURE__ */ jsx16(
-                      TwImageContextToolbar,
-                      {
-                        activeImage: props.activeImageContext,
-                        disabled: !allowLocalChromeMutations,
-                        onSetImageLayout: props.onSetImageLayout ? (mediaId, dimensions) => {
-                          dismissSelectionToolbar();
-                          props.onSetImageLayout?.(mediaId, dimensions);
-                        } : void 0,
-                        onSetImageFrame: props.onSetImageFrame ? (mediaId, offsets) => {
-                          dismissSelectionToolbar();
-                          props.onSetImageFrame?.(mediaId, offsets);
-                        } : void 0
-                      }
-                    ) : null,
-                    contextualSurface === "object" && props.activeObjectContext ? /* @__PURE__ */ jsx16(TwObjectContextToolbar, { activeObject: props.activeObjectContext }) : null
-                  ] }) : null,
-                  chromeVisibility.selectionOverlay && props.suggestionCard && selectionToolbarPlacement ? /* @__PURE__ */ jsx16("div", { className: "pointer-events-none absolute inset-0 z-20", "data-testid": "suggestion-card-overlay", children: /* @__PURE__ */ jsx16(
-                    "div",
-                    {
-                      className: "pointer-events-auto absolute",
-                      "data-placement": selectionToolbarPlacement.placement,
-                      style: selectionToolbarPlacement.style,
-                      children: /* @__PURE__ */ jsx16(
-                        TwSuggestionCard,
-                        {
-                          model: props.suggestionCard,
-                          onFocusCapture: props.onSelectionToolbarFocusCapture,
-                          onBlurCapture: props.onSelectionToolbarBlurCapture,
-                          onAccept: props.onAcceptSuggestion,
-                          onReject: props.onRejectSuggestion,
-                          onEditSuggestion: props.onEditSuggestion,
-                          onAddComment: props.onAddCommentFromSuggestion ?? props.onAddComment
-                        }
-                      )
-                    }
-                  ) }) : null,
-                  chromeVisibility.selectionOverlay && props.suggestionCard && !selectionToolbarPlacement ? /* @__PURE__ */ jsx16(
-                    "div",
-                    {
-                      className: "pointer-events-none absolute inset-x-0 top-0 z-20 flex justify-center px-4 pt-3",
-                      "data-testid": "suggestion-card-fallback",
-                      children: /* @__PURE__ */ jsx16("div", { className: "pointer-events-auto", "data-placement": "fallback", children: /* @__PURE__ */ jsx16(
-                        TwSuggestionCard,
-                        {
-                          model: props.suggestionCard,
-                          onFocusCapture: props.onSelectionToolbarFocusCapture,
-                          onBlurCapture: props.onSelectionToolbarBlurCapture,
-                          onAccept: props.onAcceptSuggestion,
-                          onReject: props.onRejectSuggestion,
-                          onEditSuggestion: props.onEditSuggestion,
-                          onAddComment: props.onAddCommentFromSuggestion ?? props.onAddComment
-                        }
-                      ) })
-                    }
-                  ) : null,
-                  chromeVisibility.selectionOverlay && props.selectionToolbar && !props.suggestionCard && selectionToolbarPlacement ? /* @__PURE__ */ jsx16("div", { className: "pointer-events-none absolute inset-0 z-20", "data-testid": "selection-toolbar-overlay", children: /* @__PURE__ */ jsx16(
-                    "div",
-                    {
-                      className: "pointer-events-auto absolute",
-                      "data-placement": selectionToolbarPlacement.placement,
-                      style: selectionToolbarPlacement.style,
-                      children: /* @__PURE__ */ jsx16(
-                        TwSelectionToolbar,
-                        {
-                          ref: props.selectionToolbarRef,
-                          model: props.selectionToolbar,
-                          disabledReason: props.selectionToolbar.disabledReason,
-                          onFocusCapture: props.onSelectionToolbarFocusCapture,
-                          onBlurCapture: props.onSelectionToolbarBlurCapture,
-                          onToggleBold: props.onToggleBold,
-                          onToggleItalic: props.onToggleItalic,
-                          onToggleUnderline: props.onToggleUnderline,
-                          onSetTextColor: props.onSetSelectionTextColor,
-                          onSetHighlightColor: props.onSetSelectionHighlightColor,
-                          onAddComment: props.onAddCommentFromSelection ?? props.onAddComment
-                        }
-                      )
-                    }
-                  ) }) : null,
-                  chromeVisibility.selectionOverlay && props.selectionToolbar && !props.suggestionCard && !selectionToolbarPlacement ? /* @__PURE__ */ jsx16(
-                    "div",
-                    {
-                      className: "pointer-events-none absolute inset-x-0 top-0 z-20 flex justify-center px-4 pt-3",
-                      "data-testid": "selection-toolbar-fallback",
-                      children: /* @__PURE__ */ jsx16("div", { className: "pointer-events-auto", "data-placement": "fallback", children: /* @__PURE__ */ jsx16(
-                        TwSelectionToolbar,
-                        {
-                          ref: props.selectionToolbarRef,
-                          model: props.selectionToolbar,
-                          disabledReason: props.selectionToolbar.disabledReason,
-                          onFocusCapture: props.onSelectionToolbarFocusCapture,
-                          onBlurCapture: props.onSelectionToolbarBlurCapture,
-                          onToggleBold: props.onToggleBold,
-                          onToggleItalic: props.onToggleItalic,
-                          onToggleUnderline: props.onToggleUnderline,
-                          onSetTextColor: props.onSetSelectionTextColor,
-                          onSetHighlightColor: props.onSetSelectionHighlightColor,
-                          onAddComment: props.onAddCommentFromSelection ?? props.onAddComment
-                        }
-                      ) })
-                    }
-                  ) : null,
-                  /* @__PURE__ */ jsxs16(
-                    "div",
-                    {
-                      className: isPageWorkspace ? "relative" : void 0,
-                      "data-line-numbering": pageChromeModel.lineNumberingEnabled ? "enabled" : "disabled",
-                      children: [
-                        isPageWorkspace && chromeVisibility.pageChrome && pageChromeModel.lineNumberingEnabled ? /* @__PURE__ */ jsx16(
-                          "div",
-                          {
-                            "aria-hidden": "true",
-                            className: "pointer-events-none absolute inset-y-0 left-0 z-10",
-                            "data-testid": "page-line-number-gutter",
-                            style: { width: `${pageChromeModel.gutterWidthPx}px` },
-                            children: pageChromeModel.lineMarkers.map((marker) => /* @__PURE__ */ jsx16(
-                              "span",
-                              {
-                                className: "absolute right-2 font-[family-name:var(--font-legal-sans)] text-[10px] font-medium tabular-nums tracking-[0.12em] text-tertiary/80",
-                                style: { top: `${marker.topPx}px` },
-                                children: marker.label
-                              },
-                              marker.id
-                            ))
-                          }
-                        ) : null,
-                        /* @__PURE__ */ jsx16(
-                          "div",
-                          {
-                            className: isPageWorkspace && chromeVisibility.pageChrome && pageChromeModel.lineNumberingEnabled ? "pl-12" : void 0,
-                            style: isPageWorkspace ? pageShellMetrics.contentInsetStyle : void 0,
-                            children: /* @__PURE__ */ jsxs16(
-                              "div",
-                              {
-                                className: isPageWorkspace ? "relative" : void 0,
-                                "data-document-grid": pageChromeModel.documentGridType,
-                                "data-page-border-display": pageChromeModel.pageBorderDisplay,
-                                style: isPageWorkspace ? {
-                                  ...pageChromeModel.documentGridStyle,
-                                  ...pageShellMetrics.pageFrameStyle
-                                } : pageChromeModel.documentGridStyle,
-                                children: [
-                                  isPageWorkspace && chromeVisibility.pageChrome ? /* @__PURE__ */ jsxs16(
-                                    "div",
-                                    {
-                                      "data-testid": "page-header-band",
-                                      className: "relative z-10 flex items-center justify-between border-b border-dashed border-border/60 px-4 text-[11px] text-secondary",
-                                      style: pageShellMetrics.headerBandStyle,
-                                      children: [
-                                        /* @__PURE__ */ jsx16("span", { className: "uppercase tracking-[0.12em] text-tertiary", children: "Header" }),
-                                        snapshot.pageLayout?.headerVariants[0] ? /* @__PURE__ */ jsx16(
-                                          "button",
-                                          {
-                                            type: "button",
-                                            "aria-label": "Open header story",
-                                            onClick: props.onOpenHeaderStory,
-                                            className: "rounded-md px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface",
-                                            children: "Edit header"
-                                          }
-                                        ) : null
-                                      ]
-                                    }
-                                  ) : null,
-                                  isPageWorkspace && chromeVisibility.pageChrome && pageChromeModel.showPageBorder && !hidePageBorderForActiveEditing ? /* @__PURE__ */ jsx16(
-                                    "div",
-                                    {
-                                      "aria-hidden": "true",
-                                      className: "pointer-events-none absolute inset-0 z-0 rounded-[2px]",
-                                      "data-testid": "page-border-overlay",
-                                      style: pageChromeModel.pageBorderStyle
-                                    }
-                                  ) : null,
-                                  /* @__PURE__ */ jsx16("div", { className: isPageWorkspace ? "relative z-10" : void 0, children: props.document }),
-                                  isPageWorkspace && chromeVisibility.pageChrome ? /* @__PURE__ */ jsxs16(
-                                    "div",
-                                    {
-                                      "data-testid": "page-footer-band",
-                                      className: "relative z-10 flex items-center justify-between border-t border-dashed border-border/60 px-4 text-[11px] text-secondary",
-                                      style: pageShellMetrics.footerBandStyle,
-                                      children: [
-                                        /* @__PURE__ */ jsx16("span", { className: "uppercase tracking-[0.12em] text-tertiary", children: "Footer" }),
-                                        snapshot.pageLayout?.footerVariants[0] ? /* @__PURE__ */ jsx16(
-                                          "button",
-                                          {
-                                            type: "button",
-                                            "aria-label": "Open footer story",
-                                            onClick: props.onOpenFooterStory,
-                                            className: "rounded-md px-2 py-1 text-xs font-medium text-primary transition-colors hover:bg-surface",
-                                            children: "Edit footer"
-                                          }
-                                        ) : null
-                                      ]
-                                    }
-                                  ) : null
-                                ]
-                              }
-                            )
-                          }
-                        )
-                      ]
-                    }
-                  )
-                ]
-              }
-            )
-          }
-        ),
-        chromeVisibility.statusBar ? /* @__PURE__ */ jsx16(
-          TwStatusBar,
-          {
-            isDirty: snapshot.isDirty,
-            isExportBlocked: snapshot.compatibility.blockExport,
-            preserveOnlyCount,
-            commentCount: snapshot.comments.totalCount,
-            changeCount: snapshot.trackedChanges.totalCount,
-            sessionId: snapshot.sessionId
-          }
-        ) : null
-      ] }),
-      showReviewRail ? /* @__PURE__ */ jsx16(
-        TwReviewRail,
-        {
-          activeTab: props.activeRailTab,
-          currentUserId: props.currentUserId,
-          comments: snapshot.comments,
-          trackedChanges: snapshot.trackedChanges,
-          compatibility: snapshot.compatibility,
-          warnings: snapshot.warnings,
-          markupDisplay,
-          activeCommentId: props.activeCommentId,
-          activeRevisionId: props.activeRevisionId,
-          onActiveTabChange: props.onActiveRailTabChange,
-          onOpenComment: props.onOpenComment,
-          onResolveComment: props.onResolveComment,
-          onReopenComment: props.onReopenComment,
-          onAddReply: props.onAddReply,
-          onEditBody: props.onEditBody,
-          onOpenRevision: props.onOpenRevision,
-          onAcceptRevision: props.onAcceptRevision,
-          onRejectRevision: props.onRejectRevision,
-          onAcceptAllChanges: props.onAcceptAllChanges,
-          onRejectAllChanges: props.onRejectAllChanges
-        }
-      ) : null
-    ] })
-  ] }) });
-}
-function shouldHidePageBorderForSelection(selection) {
-  if (selection.isCollapsed) {
-    return false;
-  }
-  return selection.activeRange.kind === "range";
-}
-function resolveActiveParagraphLayout(surface, position) {
-  const paragraph = surface ? findActiveParagraph(surface.blocks, position) : null;
-  if (!paragraph) {
-    return null;
-  }
-  return {
-    leftIndent: paragraph.indentation?.left ?? 0,
-    rightIndent: paragraph.indentation?.right ?? 0,
-    firstLineOffset: paragraph.indentation?.firstLine ?? (paragraph.indentation?.hanging ? -paragraph.indentation.hanging : 0),
-    tabStops: paragraph.tabStops ? [...paragraph.tabStops] : []
-  };
-}
-function findActiveParagraph(blocks, position) {
-  for (const block of blocks) {
-    if (block.kind === "paragraph" && position >= block.from && position <= block.to) {
-      return block;
-    }
-    if (block.kind === "table") {
-      for (const row of block.rows) {
-        for (const cell of row.cells) {
-          const paragraph = findActiveParagraph(cell.content, position);
-          if (paragraph) {
-            return paragraph;
-          }
-        }
-      }
-    }
-    if (block.kind === "sdt_block") {
-      const paragraph = findActiveParagraph(block.children, position);
-      if (paragraph) {
-        return paragraph;
-      }
-    }
-  }
-  return null;
-}
-var EMPTY_PAGE_CHROME_MODEL = {
-  lineNumberingEnabled: false,
-  gutterWidthPx: 0,
-  lineMarkers: [],
-  showPageBorder: false,
-  pageBorderDisplay: "none",
-  pageBorderStyle: void 0,
-  documentGridType: "none",
-  documentGridStyle: void 0
-};
-var DOCUMENT_CONTENT_TOP_PADDING_PX = 40;
-function buildPageChromeModel(surface, pageLayout, navigation, activeStory) {
-  if (!surface || !pageLayout || !navigation || activeStory.kind !== "main") {
-    return EMPTY_PAGE_CHROME_MODEL;
-  }
-  const lineMarkers = computeLineMarkersIfEnabled({
-    pageLayout,
-    surfaceBlocks: surface.blocks,
-    pages: navigation.pages,
-    buildLineNumberMarkers
-  });
-  const lineNumberingEnabled = Boolean(pageLayout.lineNumbering) && lineMarkers.length > 0;
-  const distance = pageLayout.lineNumbering?.distance ?? 0;
-  const gutterWidthPx = lineNumberingEnabled ? Math.max(40, Math.min(88, 24 + Math.round(distance * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP))) : 0;
-  const showPageBorder = shouldRenderPageBorder(pageLayout, navigation.pages, navigation.activePageIndex);
-  return {
-    lineNumberingEnabled,
-    gutterWidthPx,
-    lineMarkers,
-    showPageBorder,
-    pageBorderDisplay: pageLayout.pageBorders?.display ?? "none",
-    pageBorderStyle: showPageBorder ? buildPageBorderStyle(pageLayout) : void 0,
-    documentGridType: pageLayout.documentGrid?.type ?? "none",
-    documentGridStyle: buildDocumentGridStyle(pageLayout.documentGrid)
-  };
-}
-function buildPageShellMetrics(pageLayout) {
-  if (!pageLayout) {
-    return {
-      contentInsetStyle: {},
-      pageFrameStyle: {},
-      headerBandStyle: {},
-      footerBandStyle: {}
-    };
-  }
-  const horizontalInsetPx = Math.max(
-    24,
-    Math.min(120, Math.round(pageLayout.marginLeft * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP))
-  );
-  const verticalInsetPx = Math.max(
-    24,
-    Math.min(140, Math.round(pageLayout.marginTop * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP))
-  );
-  const headerBandHeightPx = Math.max(
-    40,
-    Math.min(96, Math.round(pageLayout.headerMargin * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP + 16))
-  );
-  const footerBandHeightPx = Math.max(
-    40,
-    Math.min(96, Math.round(pageLayout.footerMargin * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP + 16))
-  );
-  return {
-    contentInsetStyle: {
-      paddingLeft: `${horizontalInsetPx}px`,
-      paddingRight: `${horizontalInsetPx}px`,
-      paddingTop: `${Math.max(20, verticalInsetPx - 12)}px`,
-      paddingBottom: `${Math.max(20, Math.round(pageLayout.marginBottom * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP) - 12)}px`
-    },
-    pageFrameStyle: {
-      backgroundColor: "var(--color-page-bg)"
-    },
-    headerBandStyle: {
-      minHeight: `${headerBandHeightPx}px`
-    },
-    footerBandStyle: {
-      minHeight: `${footerBandHeightPx}px`
-    }
-  };
-}
-function buildLineNumberMarkers(blocks, pages) {
-  const markers = [];
-  if (pages.length === 0) {
-    return markers;
-  }
-  let currentTopTwips = 0;
-  let lineNumber = 1;
-  let lastPageIndex = -1;
-  let lastSectionIndex = -1;
-  for (const block of blocks) {
-    const pageIndex = findPageForOffset(pages, block.from);
-    const page = pages[pageIndex];
-    if (!page) {
-      continue;
-    }
-    const lineNumbering = page.layout.lineNumbering;
-    const restartMode = lineNumbering?.restart ?? "newPage";
-    const restartStart = lineNumbering?.start ?? 1;
-    const countBy = Math.max(1, lineNumbering?.countBy ?? 1);
-    const columnWidth = getUsableColumnWidth(page.layout);
-    if (pageIndex !== lastPageIndex) {
-      if (restartMode === "newPage" || lastPageIndex === -1) {
-        lineNumber = restartStart;
-      }
-      lastPageIndex = pageIndex;
-    }
-    if (page.sectionIndex !== lastSectionIndex) {
-      if (restartMode === "newSection" || lastSectionIndex === -1) {
-        lineNumber = restartStart;
-      }
-      lastSectionIndex = page.sectionIndex;
-    }
-    if (block.kind === "paragraph" && lineNumbering) {
-      const lineCount = estimateParagraphLineCount(block, columnWidth);
-      const lineHeight = estimateParagraphLineHeight(block);
-      const suppress = block.suppressLineNumbers === true;
-      for (let lineIndex = 0; lineIndex < lineCount; lineIndex += 1) {
-        if (!suppress && (lineNumber - restartStart) % countBy === 0) {
-          markers.push({
-            id: `${block.blockId}-${lineIndex}`,
-            label: String(lineNumber),
-            topPx: DOCUMENT_CONTENT_TOP_PADDING_PX + (currentTopTwips + lineIndex * lineHeight) * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP
-          });
-        }
-        if (!suppress) {
-          lineNumber += 1;
-        }
-      }
-    }
-    currentTopTwips += estimateBlockHeight(block, columnWidth);
-  }
-  return markers;
-}
-function shouldRenderPageBorder(pageLayout, pages, activePageIndex) {
-  const display = pageLayout?.pageBorders?.display ?? "allPages";
-  const activePage = pages[activePageIndex];
-  if (!pageLayout?.pageBorders || !activePage) {
-    return false;
-  }
-  switch (display) {
-    case "firstPage":
-      return activePage.pageInSection === 0;
-    case "notFirstPage":
-      return activePage.pageInSection > 0;
-    default:
-      return true;
-  }
-}
-function buildPageBorderStyle(pageLayout) {
-  const pageBorders = pageLayout.pageBorders;
-  if (!pageBorders) {
-    return void 0;
-  }
-  const leftInset = createInsetValue(
-    pageBorders.left?.space,
-    pageBorders.offsetFrom === "text" ? pageLayout.marginLeft / Math.max(1, pageLayout.pageWidth) * 100 : 1.25
-  );
-  const rightInset = createInsetValue(
-    pageBorders.right?.space,
-    pageBorders.offsetFrom === "text" ? pageLayout.marginRight / Math.max(1, pageLayout.pageWidth) * 100 : 1.25
-  );
-  const topInset = createInsetValue(
-    pageBorders.top?.space,
-    pageBorders.offsetFrom === "text" ? pageLayout.marginTop / Math.max(1, pageLayout.pageHeight) * 100 : 1.5
-  );
-  const bottomInset = createInsetValue(
-    pageBorders.bottom?.space,
-    pageBorders.offsetFrom === "text" ? pageLayout.marginBottom / Math.max(1, pageLayout.pageHeight) * 100 : 1.5
-  );
-  return {
-    top: topInset,
-    right: rightInset,
-    bottom: bottomInset,
-    left: leftInset,
-    borderTop: toBorderCss(pageBorders.top),
-    borderRight: toBorderCss(pageBorders.right),
-    borderBottom: toBorderCss(pageBorders.bottom),
-    borderLeft: toBorderCss(pageBorders.left),
-    boxSizing: "border-box",
-    mixBlendMode: pageBorders.zOrder === "back" ? "multiply" : void 0
-  };
-}
-function buildDocumentGridStyle(documentGrid) {
-  if (!documentGrid || !documentGrid.type || documentGrid.type === "default") {
-    return void 0;
-  }
-  const linePitchPx = Math.max(
-    18,
-    Math.round((documentGrid.linePitch ?? 360) * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP)
-  );
-  const charSpacePx = Math.max(
-    12,
-    Math.round((documentGrid.charSpace ?? 204) * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP)
-  );
-  const gridColor = "rgba(15, 23, 42, 0.06)";
-  const backgrounds = [];
-  if (documentGrid.type === "lines" || documentGrid.type === "linesAndChars" || documentGrid.type === "snapToChars") {
-    backgrounds.push(
-      `repeating-linear-gradient(to bottom, ${gridColor} 0, ${gridColor} 1px, transparent 1px, transparent ${linePitchPx}px)`
-    );
-  }
-  if (documentGrid.type === "linesAndChars" || documentGrid.type === "snapToChars") {
-    backgrounds.push(
-      `repeating-linear-gradient(to right, rgba(15, 23, 42, 0.04) 0, rgba(15, 23, 42, 0.04) 1px, transparent 1px, transparent ${charSpacePx}px)`
-    );
-  }
-  if (backgrounds.length === 0) {
-    return void 0;
-  }
-  return {
-    backgroundImage: backgrounds.join(", "),
-    backgroundOrigin: "content-box"
-  };
-}
-function createInsetValue(spaceTwips, percent) {
-  const spacingPx = Math.max(0, Math.round((spaceTwips ?? 0) * DEFAULT_PAGE_ESTIMATE_PX_PER_TWIP));
-  return `calc(${percent.toFixed(2)}% + ${spacingPx}px)`;
-}
-function resolveSelectionToolbarPlacement(anchor, root, zoomScale) {
-  if (!anchor || !root) {
-    return null;
-  }
-  const rootRect = root.getBoundingClientRect();
-  if (rootRect.width <= 0 || rootRect.height <= 0 || zoomScale <= 0) {
-    return null;
-  }
-  const centerX = (anchor.left + anchor.right) / 2;
-  const centerY = (anchor.top + anchor.bottom) / 2;
-  const localLeftEdge = (anchor.left - rootRect.left) / zoomScale;
-  const localRightEdge = (anchor.right - rootRect.left) / zoomScale;
-  const localLeft = (centerX - rootRect.left) / zoomScale;
-  const localCenterY = (centerY - rootRect.top) / zoomScale;
-  const localTop = (anchor.top - rootRect.top) / zoomScale;
-  const localBottom = (anchor.bottom - rootRect.top) / zoomScale;
-  const edgePadding = 16 / zoomScale;
-  const containerWidth = rootRect.width / zoomScale;
-  const containerHeight = rootRect.height / zoomScale;
-  const gapPx = 12 / zoomScale;
-  const estimatedToolbarWidth = Math.min(260 / zoomScale, Math.max(168 / zoomScale, containerWidth * 0.32));
-  const estimatedToolbarHeight = 44 / zoomScale;
-  const clampedCenterLeft = Math.max(
-    edgePadding,
-    Math.min(localLeft, Math.max(edgePadding, containerWidth - edgePadding))
-  );
-  const clampedCenterY = Math.max(
-    edgePadding + estimatedToolbarHeight / 2,
-    Math.min(localCenterY, Math.max(edgePadding + estimatedToolbarHeight / 2, containerHeight - edgePadding - estimatedToolbarHeight / 2))
-  );
-  const rightClearance = containerWidth - localRightEdge - gapPx - edgePadding;
-  const leftClearance = localLeftEdge - gapPx - edgePadding;
-  if (rightClearance >= estimatedToolbarWidth) {
-    return {
-      placement: "right",
-      style: {
-        left: `${localRightEdge}px`,
-        top: `${clampedCenterY}px`,
-        maxWidth: `${Math.max(220, containerWidth - edgePadding * 2)}px`,
-        transform: `translate(${gapPx}px, -50%)`
-      }
-    };
-  }
-  if (leftClearance >= estimatedToolbarWidth) {
-    return {
-      placement: "left",
-      style: {
-        left: `${localLeftEdge}px`,
-        top: `${clampedCenterY}px`,
-        maxWidth: `${Math.max(220, containerWidth - edgePadding * 2)}px`,
-        transform: `translate(calc(-100% - ${gapPx}px), -50%)`
-      }
-    };
-  }
-  const placement = localTop < estimatedToolbarHeight + gapPx + edgePadding ? "below" : "above";
-  return {
-    placement,
-    style: {
-      left: `${clampedCenterLeft}px`,
-      top: `${placement === "above" ? localTop : localBottom}px`,
-      maxWidth: `${Math.max(220, containerWidth - edgePadding * 2)}px`,
-      transform: placement === "above" ? `translate(-50%, calc(-100% - ${gapPx}px))` : `translate(-50%, ${gapPx}px)`
-    }
-  };
-}
-function toBorderCss(border) {
-  if (!border || border.value === "none" || border.value === "nil") {
-    return void 0;
-  }
-  const width = border.size ? `${Math.max(1, Math.round(border.size / 8))}px` : "1px";
-  const style = border.value === "double" ? "double" : border.value === "dotted" ? "dotted" : border.value === "dashed" || border.value === "dashSmallGap" ? "dashed" : "solid";
-  const color = border.color && border.color !== "auto" ? `#${border.color}` : "rgba(31, 31, 31, 0.28)";
-  return `${width} ${style} ${color}`;
-}
-
-// src/ui/headless/comment-decoration-model.ts
-function createCommentDecorationModel(snapshot) {
-  if (!snapshot) {
-    return void 0;
-  }
-  return {
-    activeCommentId: snapshot.activeCommentId,
-    threads: snapshot.threads.filter((thread) => thread.anchor.kind !== "detached").map((thread) => {
-      const anchor = thread.anchor;
-      const from = anchor.kind === "range" ? anchor.from : anchor.kind === "node" ? anchor.at : 0;
-      const to = anchor.kind === "range" ? anchor.to : anchor.kind === "node" ? anchor.at : 0;
-      return {
-        commentId: thread.commentId,
-        from,
-        to,
-        status: thread.status,
-        isActive: thread.isActive
-      };
-    })
-  };
-}
-function getCommentRangeState(model, from, to) {
-  if (!model) {
-    return {
-      hasComments: false,
-      hasOpen: false,
-      hasResolved: false,
-      hasActive: false,
-      count: 0,
-      overlapping: []
-    };
-  }
-  const overlapping = model.threads.filter(
-    (thread) => rangesOverlap(thread.from, thread.to, from, to)
-  );
-  return {
-    hasComments: overlapping.length > 0,
-    hasOpen: overlapping.some((thread) => thread.status === "open"),
-    hasResolved: overlapping.some((thread) => thread.status === "resolved"),
-    hasActive: overlapping.some((thread) => thread.isActive),
-    count: overlapping.length,
-    overlapping
-  };
-}
-function getCommentHighlightClass(model, from, to, markupDisplay = "all") {
-  const state = getCommentRangeState(model, from, to);
-  if (!state.hasComments) {
-    return "";
-  }
-  switch (markupDisplay) {
-    case "clean":
-      return state.hasActive ? "bg-comment-soft" : "";
-    case "simple":
-      if (state.hasActive) {
-        return "underline decoration-comment decoration-2 underline-offset-4";
-      }
-      if (state.hasOpen) {
-        return "underline decoration-comment/60 decoration-1 underline-offset-4";
-      }
-      return "underline decoration-comment/40 decoration-1 underline-offset-4";
-    case "all":
-      if (state.hasActive) {
-        return "bg-comment-strong";
-      }
-      if (state.hasOpen) {
-        return "bg-comment-soft";
-      }
-      return "bg-comment-soft opacity-60";
-  }
-}
-function rangesOverlap(leftFrom, leftTo, rightFrom, rightTo) {
-  const leftEnd = Math.max(leftFrom, leftTo);
-  const rightEnd = Math.max(rightFrom, rightTo);
-  return leftFrom < rightEnd && rightFrom < leftEnd;
-}
-
-// src/ui/headless/revision-decoration-model.ts
-function createRevisionDecorationModel(snapshot, activeRevisionId) {
-  if (!snapshot) {
-    return void 0;
-  }
-  return {
-    revisions: snapshot.revisions.filter((rev) => rev.anchor.kind !== "detached" && rev.status === "active").map((rev) => {
-      const anchor = rev.anchor;
-      const from = anchor.kind === "range" ? anchor.from : anchor.kind === "node" ? anchor.at : 0;
-      const to = anchor.kind === "range" ? anchor.to : anchor.kind === "node" ? anchor.at : 0;
-      return {
-        revisionId: rev.revisionId,
-        from,
-        to,
-        kind: rev.kind,
-        status: rev.status,
-        actionability: rev.actionability,
-        isActive: rev.revisionId === activeRevisionId
-      };
-    })
-  };
-}
-function getRevisionRangeState(model, from, to) {
-  if (!model) {
-    return {
-      hasChanges: false,
-      hasInsertions: false,
-      hasDeletions: false,
-      hasActive: false,
-      count: 0,
-      overlapping: []
-    };
-  }
-  const overlapping = model.revisions.filter(
-    (rev) => rangesOverlap(rev.from, rev.to, from, to)
-  );
-  return {
-    hasChanges: overlapping.length > 0,
-    hasInsertions: overlapping.some((rev) => rev.kind === "insertion"),
-    hasDeletions: overlapping.some((rev) => rev.kind === "deletion"),
-    hasActive: overlapping.some((rev) => rev.isActive),
-    count: overlapping.length,
-    overlapping
-  };
-}
-function getRevisionHighlightClass(model, from, to, markupDisplay = "all") {
-  const state = getRevisionRangeState(model, from, to);
-  if (!state.hasChanges) {
-    return "";
-  }
-  const activeRing = state.hasActive ? " ring-1 ring-accent/30" : "";
-  switch (markupDisplay) {
-    case "clean":
-      return "";
-    case "simple":
-      if (state.hasInsertions) {
-        return `underline decoration-insert/60 decoration-1 underline-offset-2 text-primary${activeRing}`;
-      }
-      if (state.hasDeletions) {
-        return `text-secondary line-through decoration-danger/70 decoration-1${activeRing}`;
-      }
-      return activeRing;
-    case "all":
-      if (state.hasInsertions) {
-        return `text-primary bg-insert-soft/80 ring-1 ring-insert/20${activeRing}`;
-      }
-      if (state.hasDeletions) {
-        return `text-danger line-through decoration-danger/80 decoration-1 bg-delete-soft/70${activeRing}`;
-      }
-      return activeRing;
-  }
-}
-function shouldHideInCleanMode(model, from, to) {
-  const state = getRevisionRangeState(model, from, to);
-  return state.hasDeletions;
-}
-
-// src/ui/headless/selection-helpers.ts
-function createSelectionSnapshot(anchor, head = anchor) {
-  const from = Math.min(anchor, head);
-  const to = Math.max(anchor, head);
-  return {
-    anchor,
-    head,
-    isCollapsed: anchor === head,
-    activeRange: {
-      kind: "range",
-      from,
-      to,
-      assoc: {
-        start: -1,
-        end: 1
-      }
-    }
-  };
-}
-function createNodeSelectionSnapshot(at, assoc = 1) {
-  return {
-    anchor: at,
-    head: at,
-    isCollapsed: true,
-    activeRange: {
-      kind: "node",
-      at,
-      assoc
-    }
-  };
-}
-function selectionTouchesRange(selection, from, to) {
-  if (selection.isCollapsed) {
-    return false;
-  }
-  const selectionFrom = Math.min(selection.anchor, selection.head);
-  const selectionTo = Math.max(selection.anchor, selection.head);
-  return selectionFrom < to && from < selectionTo;
-}
-
-export {
-  deriveCapabilities,
-  TwAlertBanner,
-  TwSelectionToolbar,
-  TwCommentSidebar,
-  TwRevisionSidebar,
-  TwReviewRail,
-  TwStatusBar,
-  TwHealthPanel,
-  TwToolbarIconButton,
-  TwToolbar,
-  TwReviewWorkspace,
-  createCommentDecorationModel,
-  getCommentRangeState,
-  getCommentHighlightClass,
-  createRevisionDecorationModel,
-  getRevisionRangeState,
-  getRevisionHighlightClass,
-  shouldHideInCleanMode,
-  createSelectionSnapshot,
-  createNodeSelectionSnapshot,
-  selectionTouchesRange
-};
-//# sourceMappingURL=chunk-2TG72QSW.js.map