@beyondwork/docx-react-component 1.0.28 → 1.0.30

package/src/ui/headless/selection-tool-types.ts

@@ -0,0 +1,129 @@
+import type {
+  ActiveListContext,
+  CommentSidebarThreadSnapshot,
+  FormattingStateSnapshot,
+  InteractionGuardSnapshot,
+  StyleCatalogSnapshot,
+  TableStructureContextSnapshot,
+  SuggestionsSnapshot,
+  TrackedChangeEntrySnapshot,
+  WorkflowMarkupSnapshot,
+  WorkflowScopeSnapshot,
+} from "../../api/public-types";
+
+export interface SelectionToolBadge {
+  label: string;
+  tone?: "neutral" | "accent";
+}
+
+export interface SelectionToolAnchor {
+  left: number;
+  right: number;
+  top: number;
+  bottom: number;
+}
+
+export interface ActiveImageContext {
+  mediaId: string;
+  display: "inline" | "floating";
+  widthEmu?: number;
+  heightEmu?: number;
+  horizontalOffsetEmu?: number;
+  verticalOffsetEmu?: number;
+}
+
+export interface ActiveObjectContext {
+  kind: "textbox" | "shape";
+  display: "inline" | "floating";
+}
+
+export type SelectionToolKind =
+  | "formatting-inline"
+  | "suggestion-review"
+  | "comment-thread"
+  | "workflow-task"
+  | "structure-context"
+  | "blocked-explainer";
+
+export interface BaseSelectionToolModel {
+  kind: SelectionToolKind;
+  badges: SelectionToolBadge[];
+  previewText?: string;
+  disabledReason?: string;
+}
+
+export interface FormattingInlineSelectionToolModel extends BaseSelectionToolModel {
+  kind: "formatting-inline";
+  previewText: string;
+  canToggleFormatting: boolean;
+  boldActive: boolean;
+  italicActive: boolean;
+  underlineActive: boolean;
+  canAddComment: boolean;
+}
+
+export interface SuggestionReviewSelectionToolModel extends BaseSelectionToolModel {
+  kind: "suggestion-review";
+  suggestionId: string;
+  changeIds: string[];
+  kindLabel: string;
+  previewText: string;
+  canAccept: boolean;
+  canReject: boolean;
+  canEditSuggestion: boolean;
+  canAddComment: boolean;
+}
+
+export type StructureContextKind = "table" | "image" | "object" | "list";
+
+export interface StructureContextSelectionToolModel extends BaseSelectionToolModel {
+  kind: "structure-context";
+  structureKind: StructureContextKind;
+  tableStyles?: StyleCatalogSnapshot["tables"];
+  activeTable?: TableStructureContextSnapshot | null;
+  activeImage?: ActiveImageContext;
+  activeObject?: ActiveObjectContext;
+  activeListContext?: ActiveListContext | null;
+  canMutate: boolean;
+}
+
+export interface WorkflowTaskSelectionToolModel extends BaseSelectionToolModel {
+  kind: "workflow-task";
+  workflowTitle?: string;
+  workflowDetail?: string;
+}
+
+export interface CommentThreadSelectionToolModel extends BaseSelectionToolModel {
+  kind: "comment-thread";
+  thread?: CommentSidebarThreadSnapshot;
+  canAddComment: boolean;
+}
+
+export interface BlockedExplainerSelectionToolModel extends BaseSelectionToolModel {
+  kind: "blocked-explainer";
+  disabledReason: string;
+}
+
+export type ActiveSelectionToolModel =
+  | FormattingInlineSelectionToolModel
+  | SuggestionReviewSelectionToolModel
+  | CommentThreadSelectionToolModel
+  | WorkflowTaskSelectionToolModel
+  | StructureContextSelectionToolModel
+  | BlockedExplainerSelectionToolModel;
+
+export interface SelectionToolResolverContext {
+  workflowScopeSnapshot?: WorkflowScopeSnapshot | null;
+  interactionGuardSnapshot?: InteractionGuardSnapshot;
+  workflowMarkupSnapshot?: WorkflowMarkupSnapshot;
+  suggestionsSnapshot?: SuggestionsSnapshot;
+  activeRevisionId?: string;
+  activeCommentId?: string;
+  activeCommentThread?: CommentSidebarThreadSnapshot;
+  activeTableContext?: TableStructureContextSnapshot | null;
+  activeImageContext?: ActiveImageContext | null;
+  activeObjectContext?: ActiveObjectContext | null;
+  activeListContext?: ActiveListContext | null;
+  selectedRevision?: TrackedChangeEntrySnapshot;
+  formattingState?: FormattingStateSnapshot;
+}

package/src/ui/headless/selection-toolbar-model.ts

@@ -1,34 +1,11 @@
-export interface SelectionToolbarBadge {
-  label: string;
-  tone?: "neutral" | "accent";
-}
+import type {
+  FormattingInlineSelectionToolModel,
+  SelectionToolAnchor,
+  SelectionToolBadge,
+  SuggestionReviewSelectionToolModel,
+} from "./selection-tool-types";
 
-export interface SelectionToolbarModel {
-  previewText: string;
-  badges: SelectionToolbarBadge[];
-  canToggleFormatting: boolean;
-  boldActive: boolean;
-  italicActive: boolean;
-  underlineActive: boolean;
-  canAddComment: boolean;
-  disabledReason?: string;
-}
-
-export interface SuggestionCardModel {
-  revisionId: string;
-  kindLabel: string;
-  previewText: string;
-  badges: SelectionToolbarBadge[];
-  canAccept: boolean;
-  canReject: boolean;
-  canEditSuggestion: boolean;
-  canAddComment: boolean;
-  disabledReason?: string;
-}
-
-export interface SelectionToolbarAnchor {
-  left: number;
-  right: number;
-  top: number;
-  bottom: number;
-}
+export type SelectionToolbarBadge = SelectionToolBadge;
+export type SelectionToolbarAnchor = SelectionToolAnchor;
+export type SelectionToolbarModel = FormattingInlineSelectionToolModel;
+export type SuggestionCardModel = SuggestionReviewSelectionToolModel;

package/src/ui/runtime-shortcut-dispatch.ts

@@ -0,0 +1,365 @@
+import type {
+  StyleCatalogSnapshot,
+  WorkflowBlockedCommandReason,
+} from "../api/public-types.ts";
+
+export interface ShortcutKeyInput {
+  key: string;
+  ctrlKey?: boolean;
+  metaKey?: boolean;
+  altKey?: boolean;
+  shiftKey?: boolean;
+}
+
+export interface ShellShortcutContext {
+  target: "document" | "selection-toolbar" | "shell";
+  selectionToolbarVisible: boolean;
+}
+
+export interface SurfaceShortcutContext {
+  inTable: boolean;
+}
+
+export type ShellShortcutResolution =
+  | { kind: "none" }
+  | { kind: "delegate"; shortcut: "find" | "print" | "zoom-in" | "zoom-out" | "zoom-reset" }
+  | { kind: "block"; command: string; reason: WorkflowBlockedCommandReason }
+  | { kind: "history"; history: "undo" | "redo" }
+  | { kind: "focus-region"; direction: 1 | -1 }
+  | { kind: "dismiss-selection-toolbar" }
+  | { kind: "toggle-formatting"; mark: "bold" | "italic" | "underline" }
+  | { kind: "add-comment" }
+  | { kind: "set-heading-level"; level: 1 | 2 | 3 };
+
+export type SurfaceShortcutResolution =
+  | { kind: "none" }
+  | { kind: "delete-backward" }
+  | { kind: "delete-forward" }
+  | { kind: "split-paragraph" }
+  | { kind: "insert-hard-break" }
+  | { kind: "insert-tab" }
+  | { kind: "outdent-tab" }
+  | { kind: "navigate-table-cell"; direction: 1 | -1 }
+  | { kind: "history"; history: "undo" | "redo" };
+
+export function resolveShellShortcut(
+  input: ShortcutKeyInput,
+  context: ShellShortcutContext,
+): ShellShortcutResolution {
+  const key = normalizeKey(input.key);
+  const editorTarget = context.target === "document" || context.target === "selection-toolbar";
+
+  if (key === "f6") {
+    return { kind: "focus-region", direction: input.shiftKey ? -1 : 1 };
+  }
+
+  if (
+    key === "escape" &&
+    context.selectionToolbarVisible &&
+    editorTarget
+  ) {
+    return { kind: "dismiss-selection-toolbar" };
+  }
+
+  if (!editorTarget) {
+    return { kind: "none" };
+  }
+
+  if (isUndoShortcut(input, key)) {
+    return { kind: "history", history: "undo" };
+  }
+
+  if (isRedoShortcut(input, key)) {
+    return { kind: "history", history: "redo" };
+  }
+
+  if (isModShortcut(input, key, "b")) {
+    return { kind: "toggle-formatting", mark: "bold" };
+  }
+
+  if (isModShortcut(input, key, "i")) {
+    return { kind: "toggle-formatting", mark: "italic" };
+  }
+
+  if (isModShortcut(input, key, "u")) {
+    return { kind: "toggle-formatting", mark: "underline" };
+  }
+
+  if (isWindowsCommentShortcut(input, key) || isMacCommentShortcut(input, key)) {
+    return { kind: "add-comment" };
+  }
+
+  if (isWindowsHeadingShortcut(input, key) || isMacHeadingShortcut(input, key)) {
+    return { kind: "set-heading-level", level: Number.parseInt(key, 10) as 1 | 2 | 3 };
+  }
+
+  if (isModShortcut(input, key, "f")) {
+    return { kind: "delegate", shortcut: "find" };
+  }
+
+  if (isModShortcut(input, key, "p")) {
+    return { kind: "delegate", shortcut: "print" };
+  }
+
+  if (isZoomInShortcut(input, key)) {
+    return { kind: "delegate", shortcut: "zoom-in" };
+  }
+
+  if (isZoomOutShortcut(input, key)) {
+    return { kind: "delegate", shortcut: "zoom-out" };
+  }
+
+  if (isModShortcut(input, key, "0")) {
+    return { kind: "delegate", shortcut: "zoom-reset" };
+  }
+
+  if (isPasteTextOnlyShortcut(input, key)) {
+    return {
+      kind: "block",
+      command: "pasteTextOnly",
+      reason: createUnsupportedShortcutReason(
+        "Plain-text paste is not supported in the mounted editor yet.",
+      ),
+    };
+  }
+
+  if (isReplaceShortcut(input, key)) {
+    return {
+      kind: "block",
+      command: "replaceText",
+      reason: createUnsupportedShortcutReason(
+        "Replace shortcuts are not supported in the mounted editor yet.",
+      ),
+    };
+  }
+
+  if (
+    isGoToShortcut(input, key) ||
+    (key === "f5" && !input.shiftKey)
+  ) {
+    return {
+      kind: "block",
+      command: "goTo",
+      reason: createUnsupportedShortcutReason(
+        "Go To shortcuts are not supported in the mounted editor yet.",
+      ),
+    };
+  }
+
+  if (isModShiftShortcut(input, key, "e")) {
+    return {
+      kind: "block",
+      command: "toggleTrackChanges",
+      reason: createUnsupportedShortcutReason(
+        "Track changes authoring shortcuts are not supported in the mounted editor.",
+      ),
+    };
+  }
+
+  if (key === "f7" && !input.shiftKey) {
+    return {
+      kind: "block",
+      command: "checkSpelling",
+      reason: createUnsupportedShortcutReason(
+        "Spelling shortcuts are not supported in the mounted editor.",
+      ),
+    };
+  }
+
+  if (key === "f7" && input.shiftKey) {
+    return {
+      kind: "block",
+      command: "openThesaurus",
+      reason: createUnsupportedShortcutReason(
+        "Thesaurus shortcuts are not supported in the mounted editor.",
+      ),
+    };
+  }
+
+  if (key === "f8") {
+    return {
+      kind: "block",
+      command: "extendSelection",
+      reason: createUnsupportedShortcutReason(
+        "Extend-selection shortcuts are not supported in the mounted editor.",
+      ),
+    };
+  }
+
+  if (key === "f5" && input.shiftKey) {
+    return {
+      kind: "block",
+      command: "lastEdit",
+      reason: createUnsupportedShortcutReason(
+        "Last-edit shortcuts are not supported in the mounted editor.",
+      ),
+    };
+  }
+
+  return { kind: "none" };
+}
+
+export function resolveSurfaceShortcut(
+  input: ShortcutKeyInput,
+  context: SurfaceShortcutContext,
+): SurfaceShortcutResolution {
+  const key = normalizeKey(input.key);
+
+  if (isUndoShortcut(input, key)) {
+    return { kind: "history", history: "undo" };
+  }
+
+  if (isRedoShortcut(input, key)) {
+    return { kind: "history", history: "redo" };
+  }
+
+  if (key === "backspace" && !hasAnyModifiers(input)) {
+    return { kind: "delete-backward" };
+  }
+
+  if (key === "delete" && !hasAnyModifiers(input)) {
+    return { kind: "delete-forward" };
+  }
+
+  if (key === "enter" && input.shiftKey && !input.ctrlKey && !input.metaKey && !input.altKey) {
+    return { kind: "insert-hard-break" };
+  }
+
+  if (key === "enter" && !hasAnyModifiers(input)) {
+    return { kind: "split-paragraph" };
+  }
+
+  if (key === "tab" && input.shiftKey && !input.ctrlKey && !input.metaKey && !input.altKey) {
+    return context.inTable
+      ? { kind: "navigate-table-cell", direction: -1 }
+      : { kind: "outdent-tab" };
+  }
+
+  if (key === "tab" && !hasAnyModifiers(input)) {
+    return context.inTable
+      ? { kind: "navigate-table-cell", direction: 1 }
+      : { kind: "insert-tab" };
+  }
+
+  return { kind: "none" };
+}
+
+export function resolveHeadingShortcutStyleId(
+  styleCatalog: StyleCatalogSnapshot,
+  level: 1 | 2 | 3,
+): string | null {
+  const headingToken = `heading${level}`;
+  for (const entry of styleCatalog.paragraphs) {
+    if (normalizeStyleToken(entry.styleId) === headingToken) {
+      return entry.styleId;
+    }
+  }
+  for (const entry of styleCatalog.paragraphs) {
+    if (normalizeStyleToken(entry.displayName) === headingToken) {
+      return entry.styleId;
+    }
+  }
+  return null;
+}
+
+function createUnsupportedShortcutReason(message: string): WorkflowBlockedCommandReason {
+  return {
+    code: "unsupported_surface",
+    message,
+  };
+}
+
+function normalizeKey(key: string): string {
+  return key.toLowerCase();
+}
+
+function normalizeStyleToken(value: string): string {
+  return value.toLowerCase().replace(/[^a-z0-9]/g, "");
+}
+
+function hasAnyModifiers(input: ShortcutKeyInput): boolean {
+  return Boolean(input.ctrlKey || input.metaKey || input.altKey || input.shiftKey);
+}
+
+function isModShortcut(input: ShortcutKeyInput, key: string, expectedKey: string): boolean {
+  return (
+    key === expectedKey &&
+    Boolean(input.ctrlKey || input.metaKey) &&
+    !input.altKey &&
+    !input.shiftKey
+  );
+}
+
+function isModShiftShortcut(input: ShortcutKeyInput, key: string, expectedKey: string): boolean {
+  return (
+    key === expectedKey &&
+    Boolean(input.ctrlKey || input.metaKey) &&
+    !input.altKey &&
+    Boolean(input.shiftKey)
+  );
+}
+
+function isUndoShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return isModShortcut(input, key, "z");
+}
+
+function isRedoShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return (
+    (isModShiftShortcut(input, key, "z")) ||
+    (key === "y" && Boolean(input.ctrlKey || input.metaKey) && !input.altKey && !input.shiftKey)
+  );
+}
+
+function isReplaceShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return key === "h" && Boolean(input.ctrlKey) && !input.metaKey && !input.altKey && !input.shiftKey;
+}
+
+function isGoToShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return (
+    (key === "g" && Boolean(input.ctrlKey) && !input.metaKey && !input.altKey && !input.shiftKey) ||
+    (key === "g" && Boolean(input.metaKey) && !input.ctrlKey && Boolean(input.altKey) && !input.shiftKey)
+  );
+}
+
+function isWindowsCommentShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return key === "m" && Boolean(input.ctrlKey) && Boolean(input.altKey) && !input.metaKey && !input.shiftKey;
+}
+
+function isMacCommentShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return key === "a" && Boolean(input.metaKey) && Boolean(input.altKey) && !input.ctrlKey && !input.shiftKey;
+}
+
+function isWindowsHeadingShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return ["1", "2", "3"].includes(key) &&
+    Boolean(input.ctrlKey) &&
+    Boolean(input.altKey) &&
+    !input.metaKey &&
+    !input.shiftKey;
+}
+
+function isMacHeadingShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return ["1", "2", "3"].includes(key) &&
+    Boolean(input.metaKey) &&
+    Boolean(input.altKey) &&
+    !input.ctrlKey &&
+    !input.shiftKey;
+}
+
+function isZoomInShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return Boolean(input.ctrlKey || input.metaKey) &&
+    !input.altKey &&
+    (key === "+" || key === "=" || key === "add");
+}
+
+function isZoomOutShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return Boolean(input.ctrlKey || input.metaKey) &&
+    !input.altKey &&
+    (key === "-" || key === "_" || key === "subtract");
+}
+
+function isPasteTextOnlyShortcut(input: ShortcutKeyInput, key: string): boolean {
+  return key === "v" &&
+    Boolean(input.ctrlKey || input.metaKey) &&
+    !input.altKey &&
+    Boolean(input.shiftKey);
+}

package/src/ui-tailwind/chrome/chrome-preset-model.ts

@@ -0,0 +1,107 @@
+import type {
+  WordReviewEditorChromeOptions,
+  WordReviewEditorChromePreset,
+  WordReviewEditorChromeVisibility,
+  WordReviewEditorProps,
+} from "../../api/public-types";
+
+export function resolveChromePreset(
+  chromePreset: WordReviewEditorProps["chromePreset"],
+  _reviewMode: WordReviewEditorProps["reviewMode"] = "review",
+): WordReviewEditorChromePreset {
+  if (chromePreset) {
+    return chromePreset;
+  }
+  return "advanced";
+}
+
+export function resolveChromePresetOptions(
+  chromePreset: WordReviewEditorChromePreset,
+  overrides?: Partial<WordReviewEditorChromeOptions>,
+): WordReviewEditorChromeOptions {
+  const defaults: Record<WordReviewEditorChromePreset, WordReviewEditorChromeOptions> = {
+    selection: {
+      showReviewQueueBar: false,
+      showSectionTagAction: false,
+      showReviewRail: false,
+    },
+    simple: {
+      showReviewQueueBar: false,
+      showSectionTagAction: false,
+      showReviewRail: false,
+    },
+    advanced: {
+      showReviewQueueBar: false,
+      showSectionTagAction: false,
+      showReviewRail: true,
+    },
+    review: {
+      showReviewQueueBar: true,
+      showSectionTagAction: true,
+      showReviewRail: true,
+    },
+  };
+
+  return {
+    ...defaults[chromePreset],
+    ...overrides,
+  };
+}
+
+export function resolveChromeVisibilityForPreset(input: {
+  chromePreset: WordReviewEditorChromePreset;
+  chromeOptions?: Partial<WordReviewEditorChromeOptions>;
+  chromeVisibility?: Partial<WordReviewEditorChromeVisibility>;
+}): WordReviewEditorChromeVisibility {
+  const options = resolveChromePresetOptions(input.chromePreset, input.chromeOptions);
+  const defaults: Record<WordReviewEditorChromePreset, WordReviewEditorChromeVisibility> = {
+    selection: {
+      toolbar: false,
+      alerts: true,
+      selectionOverlay: true,
+      contextToolbars: true,
+      contextAnalytics: true,
+      pageChrome: true,
+      statusBar: true,
+      reviewRail: false,
+    },
+    simple: {
+      toolbar: true,
+      alerts: true,
+      selectionOverlay: true,
+      contextToolbars: true,
+      contextAnalytics: true,
+      pageChrome: true,
+      statusBar: true,
+      reviewRail: false,
+    },
+    advanced: {
+      toolbar: true,
+      alerts: true,
+      selectionOverlay: true,
+      contextToolbars: true,
+      contextAnalytics: true,
+      pageChrome: true,
+      statusBar: true,
+      reviewRail: true,
+    },
+    review: {
+      toolbar: true,
+      alerts: true,
+      selectionOverlay: true,
+      contextToolbars: true,
+      contextAnalytics: true,
+      pageChrome: true,
+      statusBar: true,
+      reviewRail: options.showReviewRail,
+    },
+  };
+
+  return {
+    ...defaults[input.chromePreset],
+    ...(input.chromeOptions?.showReviewRail === undefined
+      ? {}
+      : { reviewRail: input.chromeOptions.showReviewRail }),
+    ...input.chromeVisibility,
+  };
+}

package/src/ui-tailwind/chrome/chrome-preset-toolbar.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+
+import type { WordReviewEditorChromePreset } from "../../api/public-types";
+import {
+  TwToolbar,
+  type TwToolbarProps,
+} from "../toolbar/tw-toolbar";
+
+export interface ChromePresetToolbarProps extends TwToolbarProps {
+  chromePreset: WordReviewEditorChromePreset;
+}
+
+export function ChromePresetToolbar(props: ChromePresetToolbarProps) {
+  return <TwToolbar {...props} preset={props.chromePreset} />;
+}