@beyondwork/docx-react-component 1.0.41 → 1.0.43

package/src/ui-tailwind/review/tw-review-rail-footer.tsx

@@ -17,11 +17,36 @@ export interface TwReviewRailFooterProps {
 const focusRingClass =
   "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-1 focus-visible:ring-offset-canvas";
 
+/**
+ * Accept only http(s) and mailto help links.  Rejects javascript:, data:,
+ * and any other scheme that could execute code when a reviewer clicks the
+ * help button.  Host-supplied; treated as untrusted.
+ */
+function safeHelpHref(raw: string | undefined): string | undefined {
+  if (typeof raw !== "string") return undefined;
+  const value = raw.trim();
+  if (value.length === 0) return undefined;
+  // Allow relative paths (no scheme) — hosts often use `/docs/help`.
+  if (value.startsWith("/") || value.startsWith("#") || value.startsWith("?")) {
+    return value;
+  }
+  try {
+    const url = new URL(value, "https://placeholder.invalid/");
+    if (url.protocol === "https:" || url.protocol === "http:" || url.protocol === "mailto:") {
+      return value;
+    }
+  } catch {
+    // fall through
+  }
+  return undefined;
+}
+
 export function TwReviewRailFooter(props: TwReviewRailFooterProps) {
   const searchLabel = props.searchLabel ?? "SEARCH";
   const helpLabel = props.helpLabel ?? "HELP";
+  const helpHref = safeHelpHref(props.helpHref);
 
-  if (!props.onSearch && !props.helpHref) {
+  if (!props.onSearch && !helpHref) {
     return null;
   }
 
@@ -38,9 +63,10 @@ export function TwReviewRailFooter(props: TwReviewRailFooterProps) {
         </button>
       ) : null}
 
-      {props.helpHref ? (
+      {helpHref ? (
         <a
-          href={props.helpHref}
+          href={helpHref}
+          rel="noopener noreferrer"
           className={`inline-flex items-center gap-1.5 rounded-sm px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.14em] text-tertiary transition-colors hover:text-secondary ${focusRingClass}`}
         >
           <HelpCircle aria-hidden="true" className="h-3 w-3" />

package/src/ui-tailwind/status/tw-status-bar.tsx

@@ -1,6 +1,9 @@
 import React from "react";
 
-import type { RuntimeContextAnalyticsSnapshot } from "../../api/public-types";
+import type {
+  PublicMeasurementFidelity,
+  RuntimeContextAnalyticsSnapshot,
+} from "../../api/public-types";
 
 export interface TwStatusBarProps {
   isDirty: boolean;
@@ -10,6 +13,26 @@ export interface TwStatusBarProps {
   changeCount: number;
   sessionId: string;
   contextAnalytics?: RuntimeContextAnalyticsSnapshot | null;
+  /**
+   * P5b: **displayed** page number for the selection head.  When the
+   * active section restarts page numbering (roman front matter → arabic
+   * body), this reflects what Word would print on the page — not the
+   * raw 0-based document-order index.  Pass `null` when the facet has
+   * no resolved page (e.g., during initial load).
+   */
+  displayPageNumber?: number | null;
+  /**
+   * P5b: total **content** page count (excludes evenPage / oddPage
+   * blank fillers).  Matches `facet.getPageCount()` — same quantity a
+   * `NUMPAGES` field resolves to on every page.
+   */
+  pageCount?: number | null;
+  /**
+   * P5b: measurement fidelity the layout engine is computing against.
+   * Surfaced as a compact badge so harness operators can see when the
+   * canvas backend is live vs. the empirical fallback.  Absent = skip.
+   */
+  measurementFidelity?: PublicMeasurementFidelity;
 }
 
 export function TwStatusBar(props: TwStatusBarProps) {
@@ -56,10 +79,38 @@ export function TwStatusBar(props: TwStatusBarProps) {
         {props.commentCount} comment{props.commentCount !== 1 ? "s" : ""} ·{" "}
         {props.changeCount} change{props.changeCount !== 1 ? "s" : ""}
       </span>
+      {props.displayPageNumber != null && props.pageCount != null ? (
+        <span data-testid="status-bar-page-count">
+          Page {props.displayPageNumber} of {props.pageCount}
+        </span>
+      ) : null}
       <span className="flex-1" />
+      {props.measurementFidelity ? (
+        <span
+          data-testid="status-bar-measurement-fidelity"
+          data-fidelity={props.measurementFidelity}
+          className="uppercase tracking-[0.12em] text-tertiary/70"
+          title={`Measurement fidelity: ${props.measurementFidelity}`}
+        >
+          {formatFidelityBadge(props.measurementFidelity)}
+        </span>
+      ) : null}
       <span className="truncate text-[10px] uppercase tracking-[0.12em] text-tertiary/80">
         Session active
       </span>
     </footer>
   );
 }
+
+function formatFidelityBadge(fidelity: PublicMeasurementFidelity): string {
+  switch (fidelity) {
+    case "empirical":
+      return "E";
+    case "canvas":
+      return "C";
+    case "canvas-with-font-loading":
+      return "C+F";
+    default:
+      return String(fidelity);
+  }
+}

package/src/ui-tailwind/theme/editor-theme.css

@@ -488,6 +488,31 @@
   outline-offset: -1px;
 }
 
+/*
+ * ─── Agent-pending shimmer (K2 / scope-card-overlay P2) ───
+ *
+ * Painted on every scope tint that overlaps a WorkflowCandidateRange
+ * with `source: "ai"`.  A soft 1.8s pulse signals the agent is
+ * thinking without competing with the active outline.  Reduced-
+ * motion disables the animation and holds a static 60% opacity
+ * border so the posture is still readable.
+ */
+@keyframes wre-agent-pulse {
+  0%, 100% { opacity: 0.4; }
+  50% { opacity: 0.85; }
+}
+
+.wre-scope-rail-tint-agent-pending {
+  outline: 1px solid color-mix(in srgb, var(--color-workflow) 70%, transparent);
+  outline-offset: -1px;
+  animation: wre-agent-pulse 1.8s ease-in-out infinite;
+}
+
+[data-reduced-motion="true"] .wre-scope-rail-tint-agent-pending {
+  animation: none;
+  opacity: 0.6;
+}
+
 /*
  * ─── Scope rail stripe ───
  *