@arbidocs/blocks 0.5.115 → 0.5.117

package/dist/connection/viewer/useViewerTabs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/connection/viewer/useViewerTabs.tsx"],
-  "sourcesContent": ["/**\n * Tabs of the document viewer: which tabs a document has, the automatic switches when the\n * document's type or parsed content changes, and switching (which ends a comparison when leaving\n * the tab that hosts it). The open tab is the session state's, so whatever opens a document can\n * open it on a tab.\n */\n\nimport { useEffect, useRef } from 'react'\nimport { Code, FileText, History, MonitorPlay } from 'lucide-react'\nimport { friendlyFileType } from '@arbidocs/react/ui'\nimport {\n  AudIcon,\n  DocIcon,\n  EmlIcon,\n  HtmlIcon,\n  ImgIcon,\n  PdfIcon,\n  VidIcon,\n  XlsIcon,\n  useArbiSessionState,\n  useArbiSessionStore,\n  type ArbiViewerTab,\n} from '@arbidocs/react'\nimport type { ViewerTab } from '../../files/ViewerParts'\nimport { useIsPhone } from '../../lib/use-media-query'\nimport type { ViewedDocument } from './useViewedDocument'\n\n/**\n * @param hasHistory The document has earlier versions (a signed copy, a re-upload): PDF and text\n *   documents then get a Versions tab too. Artifacts and Word documents always have one.\n */\nexport function useViewerTabs(doc: ViewedDocument, isCompact: boolean, hasHistory = false) {\n  const {\n    documentData,\n    isArtifact,\n    isDocx,\n    isXlsx,\n    isEmail,\n    isVideo,\n    isAudio,\n    isImage,\n    liveKind,\n    hasParsedContent,\n    isParsedDocLoading,\n  } = doc\n  const session = useArbiSessionStore()\n  const {\n    tab: activeTab,\n    compareId,\n    tabRequest,\n    phonePdfChosen,\n  } = useArbiSessionState((s) => s.documentViewer)\n  const setActiveTab = (tab: ArbiViewerTab) => session.setDocumentViewer({ tab })\n  // A plain-text file is still shown as a generated PDF, but the tab names the file the user\n  // opened (\"Text\", as the Fields panel does), not the rendering format.\n  const isTextFile = friendlyFileType(documentData?.file_type, documentData?.file_name) === 'Text'\n  const isPhone = useIsPhone()\n  const phoneDefaultDecidedFor = useRef<string | null>(null)\n\n  // Switch to the tab that fits the document type. Only on type changes: never over the user's own\n  // choice. Keyed on the document and its kind, not on the record: a refreshed record (a new\n  // version finishing processing) must not send a user on the PDF tab of a Word document back to\n  // the editor.\n  const hasDocumentData = !!documentData\n  const documentKey = documentData?.external_id\n  useEffect(() => {\n    // A Word artifact (an AI draft, stored as .docx) has one Word tab, 'edit', not a DOCX tab.\n    if (isArtifact && (activeTab === 'pdf' || (!liveKind && activeTab === 'docx'))) {\n      setActiveTab(liveKind ? 'preview' : 'edit')\n    } else if (isDocx && activeTab === 'pdf') {\n      setActiveTab('docx')\n    } else if (!liveKind && activeTab === 'preview') {\n      setActiveTab(isArtifact ? 'edit' : 'pdf')\n    } else if (!isArtifact && documentData && activeTab === 'edit') {\n      setActiveTab(isDocx ? 'docx' : isXlsx ? 'xlsx' : 'pdf')\n    } else if (\n      !isArtifact &&\n      !isDocx &&\n      !isXlsx &&\n      documentData &&\n      (activeTab === 'docx' || activeTab === 'xlsx')\n    ) {\n      setActiveTab('pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hasDocumentData, documentKey, isArtifact, isDocx, isXlsx, liveKind])\n\n  // A tab asked for when the document was opened (a signature request opens on the PDF, where it\n  // is signed) wins over the type's own tab once that document has loaded, and over the phone's\n  // text default. Declared after the type switch above so it has the last word.\n  useEffect(() => {\n    if (!tabRequest || !documentKey || tabRequest.documentId !== documentKey) return\n    phoneDefaultDecidedFor.current = documentKey\n    session.setDocumentViewer({ tabRequest: null, tab: tabRequest.tab })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [documentKey, tabRequest])\n\n  // Versions of a PDF or text document exist only with history: leave the tab when there is none\n  // (another document opened while it was active).\n  const hasVersionsTab = isArtifact || isDocx || hasHistory\n  useEffect(() => {\n    if (activeTab === 'versions' && documentData && !hasVersionsTab) {\n      setActiveTab(isXlsx ? 'xlsx' : 'pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [activeTab, documentData, hasVersionsTab])\n\n  // The text tab exists only with parsed content. When it is open without any (a recording with\n  // no transcript, a failed parse), fall back to the natural default once the parsed query\n  // settles. Not during a comparison, which uses the text tab. Waits for the record: until it is\n  // here the parsed query has not started, so it is not loading yet.\n  useEffect(() => {\n    if (\n      activeTab === 'html' &&\n      documentData !== undefined &&\n      !isParsedDocLoading &&\n      !hasParsedContent &&\n      !compareId\n    ) {\n      setActiveTab(isArtifact ? 'edit' : isDocx ? 'docx' : isXlsx ? 'xlsx' : 'pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    activeTab,\n    documentData,\n    isParsedDocLoading,\n    hasParsedContent,\n    compareId,\n    isArtifact,\n    isDocx,\n    isXlsx,\n  ])\n\n  // Phones open a document on the readable reflowed (text) view: a fit-width PDF on a 390px\n  // screen is footnote-sized. Decided once per document, after the parsed query settles, and only\n  // over the PDF default (Word, sheets, artifacts and media keep their own tab). A PDF the user\n  // picked by hand this session wins.\n  useEffect(() => {\n    if (!isPhone || !documentKey || isParsedDocLoading) return\n    if (phoneDefaultDecidedFor.current === documentKey) return\n    phoneDefaultDecidedFor.current = documentKey\n    const opensOnPdf =\n      !isArtifact && !isDocx && !isXlsx && !isVideo && !isAudio && !isImage && !isEmail\n    if (opensOnPdf && hasParsedContent && !compareId && !phonePdfChosen && activeTab === 'pdf') {\n      setActiveTab('html')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isPhone, documentKey, isParsedDocLoading, hasParsedContent])\n\n  const handleTabChange = (tabId: string) => {\n    // A comparison is shown on the text tab: leaving it ends the comparison.\n    const change: Parameters<typeof session.setDocumentViewer>[0] = { tab: tabId as ArbiViewerTab }\n    if (tabId !== 'html' && compareId) change.compareId = null\n    // A phone user who goes back to the PDF wants it: stop opening documents on the text view\n    // until they pick it again.\n    if (isPhone && (tabId === 'pdf' || tabId === 'html')) change.phonePdfChosen = tabId === 'pdf'\n    session.setDocumentViewer(change)\n  }\n\n  const mediaTab = isVideo\n    ? { icon: <VidIcon size={20} />, tooltip: 'Video' }\n    : isAudio\n      ? { icon: <AudIcon size={20} />, tooltip: 'Audio' }\n      : isImage\n        ? { icon: <ImgIcon size={20} />, tooltip: 'Image' }\n        : isEmail\n          ? { icon: <EmlIcon size={20} />, tooltip: 'Email' }\n          : isTextFile\n            ? { icon: <FileText className=\"size-5\" />, tooltip: 'Text' }\n            : documentData\n              ? { icon: <PdfIcon size={20} />, tooltip: 'PDF' }\n              : // The file type is unknown until the record loads: name no guess (a text file\n                // would flip from PDF to Text once it arrives).\n                { icon: <FileText className=\"size-5\" />, tooltip: 'Document' }\n  // Tabs say what they are: in a narrow panel or on a phone only the open tab keeps its name, plus\n  // the text view, whose icon is not recognisable. Labelling every tab there would crowd the header.\n  const tabLabel = (id: string, label: string) =>\n    !isCompact || activeTab === id || id === 'html' ? label : undefined\n\n  const versionsTab: ViewerTab = {\n    id: 'versions',\n    icon: <History className=\"size-5\" />,\n    tooltip: 'Versions',\n    label: tabLabel('versions', 'Versions'),\n  }\n  const viewerTabs: ViewerTab[] = [\n    ...(isArtifact\n      ? [\n          ...(liveKind\n            ? [\n                {\n                  id: 'preview',\n                  icon: <MonitorPlay className=\"size-5\" />,\n                  tooltip: 'Preview',\n                  label: tabLabel('preview', 'Preview'),\n                },\n              ]\n            : []),\n          {\n            id: 'edit',\n            icon: liveKind ? <Code className=\"size-5\" /> : <FileText className=\"size-5\" />,\n            tooltip: liveKind ? 'Code' : 'Editor',\n            label: tabLabel('edit', liveKind ? 'Code' : 'Document'),\n          },\n          versionsTab,\n        ]\n      : [\n          ...(isDocx\n            ? [\n                {\n                  id: 'docx',\n                  icon: <DocIcon size={20} />,\n                  tooltip: 'DOCX (with track changes & comments)',\n                  label: tabLabel('docx', 'DOCX'),\n                },\n              ]\n            : []),\n          ...(isXlsx\n            ? [\n                {\n                  id: 'xlsx',\n                  icon: <XlsIcon size={20} />,\n                  tooltip: 'Spreadsheet',\n                  label: tabLabel('xlsx', 'Sheet'),\n                },\n              ]\n            : []),\n          { id: 'pdf', ...mediaTab, label: tabLabel('pdf', mediaTab.tooltip) },\n          ...(hasVersionsTab ? [versionsTab] : []),\n        ]),\n    ...((hasParsedContent || compareId) && !liveKind\n      ? [\n          {\n            id: 'html',\n            icon: compareId ? <FileText className=\"size-5\" /> : <HtmlIcon size={20} />,\n            tooltip: compareId ? 'Word redline' : 'HTML',\n            label: tabLabel('html', compareId ? 'Compare' : 'HTML'),\n          },\n        ]\n      : []),\n  ]\n\n  return { activeTab, handleTabChange, viewerTabs }\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * Tabs of the document viewer: which tabs a document has, the automatic switches when the\n * document's type or parsed content changes, and switching (which ends a comparison when leaving\n * the tab that hosts it). The open tab is the session state's, so whatever opens a document can\n * open it on a tab.\n */\n\nimport { useEffect, useRef } from 'react'\nimport { Code, FileText, History, MonitorPlay } from 'lucide-react'\nimport { friendlyFileType } from '@arbidocs/react/ui'\nimport {\n  AudIcon,\n  DocIcon,\n  EmlIcon,\n  HtmlIcon,\n  ImgIcon,\n  PdfIcon,\n  VidIcon,\n  XlsIcon,\n  useArbiSessionState,\n  useArbiSessionStore,\n  type ArbiViewerTab,\n} from '@arbidocs/react'\nimport type { ViewerTab } from '../../files/ViewerParts'\nimport { useIsPhone } from '../../lib/use-media-query'\nimport type { ViewedDocument } from './useViewedDocument'\n\n/**\n * @param hasHistory The document has earlier versions (a signed copy, a re-upload): PDF and text\n *   documents then get a Versions tab too. Artifacts and Word documents always have one.\n */\nexport function useViewerTabs(doc: ViewedDocument, isCompact: boolean, hasHistory = false) {\n  const {\n    documentData,\n    isArtifact,\n    isDraft,\n    isStreaming,\n    isDocx,\n    isXlsx,\n    isEmail,\n    isVideo,\n    isAudio,\n    isImage,\n    liveKind,\n    hasParsedContent,\n    isParsedDocLoading,\n  } = doc\n  const session = useArbiSessionStore()\n  const {\n    tab: activeTab,\n    compareId,\n    tabRequest,\n    phonePdfChosen,\n  } = useArbiSessionState((s) => s.documentViewer)\n  const setActiveTab = (tab: ArbiViewerTab) => session.setDocumentViewer({ tab })\n  // A plain-text file is still shown as a generated PDF, but the tab names the file the user\n  // opened (\"Text\", as the Fields panel does), not the rendering format.\n  const isTextFile = friendlyFileType(documentData?.file_type, documentData?.file_name) === 'Text'\n  const isPhone = useIsPhone()\n  const phoneDefaultDecidedFor = useRef<string | null>(null)\n\n  // Switch to the tab that fits the document type. Only on type changes: never over the user's own\n  // choice. Keyed on the document and its kind, not on the record: a refreshed record (a new\n  // version finishing processing) must not send a user on the PDF tab of a Word document back to\n  // the editor.\n  const hasDocumentData = !!documentData\n  const documentKey = documentData?.external_id\n  useEffect(() => {\n    // A Word artifact (an AI draft, stored as .docx) has one Word tab, 'edit', not a DOCX tab.\n    if (isArtifact && (activeTab === 'pdf' || (!liveKind && activeTab === 'docx'))) {\n      setActiveTab(liveKind ? 'preview' : 'edit')\n    } else if (isDocx && activeTab === 'pdf') {\n      setActiveTab('docx')\n    } else if (!liveKind && activeTab === 'preview') {\n      setActiveTab(isArtifact ? 'edit' : 'pdf')\n    } else if (!isArtifact && documentData && activeTab === 'edit') {\n      setActiveTab(isDocx ? 'docx' : isXlsx ? 'xlsx' : 'pdf')\n    } else if (\n      !isArtifact &&\n      !isDocx &&\n      !isXlsx &&\n      documentData &&\n      (activeTab === 'docx' || activeTab === 'xlsx')\n    ) {\n      setActiveTab('pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hasDocumentData, documentKey, isArtifact, isDocx, isXlsx, liveKind])\n\n  // A tab asked for when the document was opened (a signature request opens on the PDF, where it\n  // is signed) wins over the type's own tab once that document has loaded, and over the phone's\n  // text default. Declared after the type switch above so it has the last word.\n  useEffect(() => {\n    if (!tabRequest || !documentKey || tabRequest.documentId !== documentKey) return\n    phoneDefaultDecidedFor.current = documentKey\n    session.setDocumentViewer({ tabRequest: null, tab: tabRequest.tab })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [documentKey, tabRequest])\n\n  // Versions of a PDF or text document exist only with history: leave the tab when there is none\n  // (another document opened while it was active).\n  const hasVersionsTab = isArtifact || isDocx || hasHistory\n  useEffect(() => {\n    if (activeTab === 'versions' && documentData && !hasVersionsTab) {\n      setActiveTab(isXlsx ? 'xlsx' : 'pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [activeTab, documentData, hasVersionsTab])\n\n  // The text tab exists only with parsed content. When it is open without any (a recording with\n  // no transcript, a failed parse), fall back to the natural default once the parsed query\n  // settles. Not during a comparison, which uses the text tab. Waits for the record: until it is\n  // here the parsed query has not started, so it is not loading yet.\n  useEffect(() => {\n    if (\n      activeTab === 'html' &&\n      documentData !== undefined &&\n      !isParsedDocLoading &&\n      !hasParsedContent &&\n      !compareId\n    ) {\n      setActiveTab(isArtifact ? 'edit' : isDocx ? 'docx' : isXlsx ? 'xlsx' : 'pdf')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    activeTab,\n    documentData,\n    isParsedDocLoading,\n    hasParsedContent,\n    compareId,\n    isArtifact,\n    isDocx,\n    isXlsx,\n  ])\n\n  // Phones open a document on the readable reflowed (text) view: a fit-width PDF on a 390px\n  // screen is footnote-sized. Decided once per document, after the parsed query settles, and only\n  // over the PDF default (Word, sheets, artifacts and media keep their own tab). A PDF the user\n  // picked by hand this session wins.\n  useEffect(() => {\n    if (!isPhone || !documentKey || isParsedDocLoading) return\n    if (phoneDefaultDecidedFor.current === documentKey) return\n    phoneDefaultDecidedFor.current = documentKey\n    const opensOnPdf =\n      !isArtifact && !isDocx && !isXlsx && !isVideo && !isAudio && !isImage && !isEmail\n    if (opensOnPdf && hasParsedContent && !compareId && !phonePdfChosen && activeTab === 'pdf') {\n      setActiveTab('html')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isPhone, documentKey, isParsedDocLoading, hasParsedContent])\n\n  const handleTabChange = (tabId: string) => {\n    // A comparison is shown on the text tab: leaving it ends the comparison.\n    const change: Parameters<typeof session.setDocumentViewer>[0] = { tab: tabId as ArbiViewerTab }\n    if (tabId !== 'html' && compareId) change.compareId = null\n    // A phone user who goes back to the PDF wants it: stop opening documents on the text view\n    // until they pick it again.\n    if (isPhone && (tabId === 'pdf' || tabId === 'html')) change.phonePdfChosen = tabId === 'pdf'\n    session.setDocumentViewer(change)\n  }\n\n  const mediaTab = isVideo\n    ? { icon: <VidIcon size={20} />, tooltip: 'Video' }\n    : isAudio\n      ? { icon: <AudIcon size={20} />, tooltip: 'Audio' }\n      : isImage\n        ? { icon: <ImgIcon size={20} />, tooltip: 'Image' }\n        : isEmail\n          ? { icon: <EmlIcon size={20} />, tooltip: 'Email' }\n          : isTextFile\n            ? { icon: <FileText className=\"size-5\" />, tooltip: 'Text' }\n            : documentData\n              ? { icon: <PdfIcon size={20} />, tooltip: 'PDF' }\n              : // The file type is unknown until the record loads: name no guess (a text file\n                // would flip from PDF to Text once it arrives).\n                { icon: <FileText className=\"size-5\" />, tooltip: 'Document' }\n  // Tabs say what they are: in a narrow panel or on a phone only the open tab keeps its name, plus\n  // the text view, whose icon is not recognisable. Labelling every tab there would crowd the header.\n  const tabLabel = (id: string, label: string) =>\n    !isCompact || activeTab === id || id === 'html' ? label : undefined\n\n  const versionsTab: ViewerTab = {\n    id: 'versions',\n    icon: <History className=\"size-5\" />,\n    tooltip: 'Versions',\n    label: tabLabel('versions', 'Versions'),\n  }\n  const viewerTabs: ViewerTab[] = [\n    ...(isArtifact\n      ? [\n          ...(liveKind\n            ? [\n                {\n                  id: 'preview',\n                  icon: <MonitorPlay className=\"size-5\" />,\n                  tooltip: 'Preview',\n                  label: tabLabel('preview', 'Preview'),\n                },\n              ]\n            : []),\n          {\n            id: 'edit',\n            icon: liveKind ? <Code className=\"size-5\" /> : <FileText className=\"size-5\" />,\n            tooltip: liveKind ? 'Code' : 'Editor',\n            label: tabLabel('edit', liveKind ? 'Code' : 'Document'),\n          },\n          ...(!liveKind && !isDraft && !isStreaming && isDocx\n            ? [\n                {\n                  id: 'pdf',\n                  icon: <PdfIcon size={20} />,\n                  tooltip: 'PDF',\n                  label: tabLabel('pdf', 'PDF'),\n                },\n              ]\n            : []),\n          versionsTab,\n        ]\n      : [\n          ...(isDocx\n            ? [\n                {\n                  id: 'docx',\n                  icon: <DocIcon size={20} />,\n                  tooltip: 'DOCX (with track changes & comments)',\n                  label: tabLabel('docx', 'DOCX'),\n                },\n              ]\n            : []),\n          ...(isXlsx\n            ? [\n                {\n                  id: 'xlsx',\n                  icon: <XlsIcon size={20} />,\n                  tooltip: 'Spreadsheet',\n                  label: tabLabel('xlsx', 'Sheet'),\n                },\n              ]\n            : []),\n          { id: 'pdf', ...mediaTab, label: tabLabel('pdf', mediaTab.tooltip) },\n          ...(hasVersionsTab ? [versionsTab] : []),\n        ]),\n    ...((hasParsedContent || compareId) && !liveKind\n      ? [\n          {\n            id: 'html',\n            icon: compareId ? <FileText className=\"size-5\" /> : <HtmlIcon size={20} />,\n            tooltip: compareId ? 'Word redline' : 'HTML',\n            label: tabLabel('html', compareId ? 'Compare' : 'HTML'),\n          },\n        ]\n      : []),\n  ]\n\n  return { activeTab, handleTabChange, viewerTabs }\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/dashboards/index.cjs

@@ -10,8 +10,8 @@ require('../chunk-ZU2B2RZK.cjs');
 var chunkNSD37OF5_cjs = require('../chunk-NSD37OF5.cjs');
 var chunkOEJQFPWO_cjs = require('../chunk-OEJQFPWO.cjs');
 require('../chunk-JV5TVUOU.cjs');
-var chunkZW6FPIFC_cjs = require('../chunk-ZW6FPIFC.cjs');
 require('../chunk-IPSHAMO2.cjs');
+var chunkZW6FPIFC_cjs = require('../chunk-ZW6FPIFC.cjs');
 var chunkTKHCIHE2_cjs = require('../chunk-TKHCIHE2.cjs');
 require('../chunk-JDFBEGQO.cjs');
 require('../chunk-ULWRNGGE.cjs');

package/dist/docx/DocxCommandMenu.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type DocxImageGeneration } from './layout/GenerateImage';
+/** One editing menu, with named categories and the existing editor commands. */
+export declare function DocxCommandMenu({ onSave, badge, imageGeneration, }: {
+    onSave: () => void;
+    badge?: React.ReactNode;
+    imageGeneration?: DocxImageGeneration;
+}): React.JSX.Element;

package/dist/docx/DocxCommandMenu.js

@@ -0,0 +1,202 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { DocxEditor, useChromeTranslate } from "@docx-editor.dev/react";
+import {
+  BookA,
+  ChevronDown,
+  FilePenLine,
+  Home,
+  Image,
+  LayoutGrid,
+  ListChecks,
+  Menu,
+  Plus,
+  Table,
+  UsersRound
+} from "lucide-react";
+import { useDefinedTerms } from "./definitions/DefinedTerms.js";
+import { RibbonMenu } from "./RibbonMenu.js";
+import { NamedCommandList, RibbonItem } from "./RibbonOverflow.js";
+import { StyleGallery } from "./StyleGallery.js";
+import { NoteButtons } from "./WordReferences.js";
+import { CrossReferenceButton, UpdateCrossReferencesButton } from "./references/EditorMenus.js";
+import { LayoutTabContent, LAYOUT_TAB, useContextualTabs } from "./layout/LayoutTabs.js";
+import {
+  GenerateImageButton,
+  useGenerateImageTarget
+} from "./layout/GenerateImage.js";
+import { QuickParts } from "./template/QuickParts.js";
+import { HouseTemplatePanel } from "./template/HouseTemplatePanel.js";
+import { MySignatureMenu, SignatureFieldMenu } from "./signatures/SignatureFields.js";
+function DefinedTermButton() {
+  const terms = useDefinedTerms();
+  if (!terms) return null;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      className: "native-docx-ribbon-trigger",
+      "aria-label": terms.labels.insert,
+      title: `${terms.labels.insert} (type @@)`,
+      "data-testid": "docx-insert-defined-term",
+      onMouseDown: (event) => event.preventDefault(),
+      onClick: (event) => terms.openPicker(event.currentTarget),
+      children: /* @__PURE__ */ jsx(BookA, { size: 16 })
+    }
+  );
+}
+const categories = [
+  { name: "Home", icon: Home },
+  { name: "Insert", icon: Plus },
+  { name: "Design", icon: FilePenLine },
+  { name: LAYOUT_TAB, icon: LayoutGrid },
+  { name: "References", icon: BookA },
+  { name: "Review", icon: ListChecks }
+];
+function DocxCommandMenu({
+  onSave,
+  badge,
+  imageGeneration
+}) {
+  const [selected, setSelected] = useState("Home");
+  const contextual = useContextualTabs(selected);
+  const tab = contextual.shown;
+  const t = useChromeTranslate();
+  useGenerateImageTarget();
+  const allCategories = [
+    ...categories,
+    ...contextual.tabs.map((name) => ({ name, icon: name === "Table" ? Table : Image }))
+  ];
+  return /* @__PURE__ */ jsxs("div", { className: "native-docx-ribbon native-docx-command-menu", children: [
+    /* @__PURE__ */ jsxs(DocxEditor.Toolbar, { t, preset: false, onSave, children: [
+      /* @__PURE__ */ jsx(
+        RibbonMenu,
+        {
+          label: "Editing tools",
+          icon: /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Menu, { size: 16 }),
+            /* @__PURE__ */ jsx("span", { children: "Editing tools" }),
+            /* @__PURE__ */ jsx(ChevronDown, { size: 14 })
+          ] }),
+          className: "native-docx-command-trigger",
+          popoverClassName: "native-docx-command-panel",
+          keepMounted: true,
+          restoreFocus: true,
+          children: (close) => /* @__PURE__ */ jsxs("div", { className: "native-docx-command-layout", children: [
+            /* @__PURE__ */ jsx("nav", { className: "native-docx-command-categories", "aria-label": "Editing tool categories", children: allCategories.map(({ name, icon: Icon }) => /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                "aria-pressed": tab === name,
+                onClick: () => setSelected(name),
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { size: 16, "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx("span", { children: name })
+                ]
+              },
+              name
+            )) }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "native-docx-command-list",
+                role: "group",
+                "aria-label": `${tab} commands`,
+                onClick: (event) => {
+                  const target = event.target;
+                  const button = target.closest("button");
+                  const item = target.closest("[data-ribbon-item]")?.dataset.ribbonItem;
+                  const direct = /* @__PURE__ */ new Set([
+                    "home-undo",
+                    "home-redo",
+                    "home-save",
+                    "home-bold",
+                    "home-italic",
+                    "home-underline",
+                    "home-bullets",
+                    "home-numbers",
+                    "home-indent",
+                    "home-outdent",
+                    "home-strike",
+                    "home-clear",
+                    "references-footnote",
+                    "references-endnote",
+                    "references-update-cross-references",
+                    "table-row-above",
+                    "table-row-below",
+                    "table-column-left",
+                    "table-column-right"
+                  ]);
+                  if ((!button || !button.disabled) && target.closest('[aria-disabled="true"]') === null && (button && item && direct.has(item) || target.closest('[role="gridcell"]') || target.closest('[role="menuitemradio"]') || target.closest('[data-testid="docx-insert-my-signature"]') || target.closest('[data-testid="docx-insert-my-initials"]') || target.closest('.native-docx-style-gallery [role="option"]') || button && button.closest(".native-docx-style-gallery"))) {
+                    close();
+                  }
+                },
+                children: /* @__PURE__ */ jsxs(NamedCommandList, { children: [
+                  tab === "Home" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-undo", label: "Undo", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Undo, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-redo", label: "Redo", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Redo, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-save", label: "Save", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Save, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-style", label: "Styles", children: /* @__PURE__ */ jsx(StyleGallery, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-bold", label: "Bold", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Bold, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-italic", label: "Italic", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Italic, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-underline", label: "Underline", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Underline, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-font-family", label: "Font family", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.FontFamily, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-font-size", label: "Font size", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.FontSize, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-font-color", label: "Font color", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.FontColor, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-highlight", label: "Highlight", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Highlight, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-alignment", label: "Alignment", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Alignment, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-bullets", label: "Bulleted list", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.BulletList, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-numbers", label: "Numbered list", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.NumberedList, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-line-spacing", label: "Line spacing", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.LineSpacing, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-indent", label: "Increase indent", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Indent, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-outdent", label: "Decrease indent", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Outdent, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-strike", label: "Strikethrough", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Strike, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "home-clear", label: "Clear formatting", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.ClearFormatting, {}) })
+                  ] }),
+                  tab === "Insert" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-table", label: "Table", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.TableInsert, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-picture", label: "Picture", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.ImageInsert, {}) }),
+                    imageGeneration && /* @__PURE__ */ jsx(RibbonItem, { id: "insert-generate-image", label: "Generate image", children: /* @__PURE__ */ jsx(GenerateImageButton, { generation: imageGeneration }) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-page-break", label: "Page break", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Button, { slotId: "insert.pageBreak" }) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-link", label: "Link", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Link, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-defined-term", label: "Defined term", children: /* @__PURE__ */ jsx(DefinedTermButton, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-quick-parts", label: "Quick Parts", children: /* @__PURE__ */ jsx(QuickParts, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-signature-field", label: "Signature field", children: /* @__PURE__ */ jsx(SignatureFieldMenu, { onInserted: close }) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-my-signature", label: "My signature", children: /* @__PURE__ */ jsx(MySignatureMenu, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "insert-cross-reference", label: "Cross-reference", children: /* @__PURE__ */ jsx(CrossReferenceButton, {}) })
+                  ] }),
+                  /* @__PURE__ */ jsx(LayoutTabContent, { tab }),
+                  tab === "Design" && /* @__PURE__ */ jsx(RibbonItem, { id: "design-house-template", label: "House template", children: /* @__PURE__ */ jsx(HouseTemplatePanel, {}) }),
+                  tab === "References" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(NoteButtons, {}),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "references-cross-reference", label: "Cross-reference", children: /* @__PURE__ */ jsx(CrossReferenceButton, {}) }),
+                    /* @__PURE__ */ jsx(
+                      RibbonItem,
+                      {
+                        id: "references-update-cross-references",
+                        label: "Update cross-references",
+                        children: /* @__PURE__ */ jsx(UpdateCrossReferencesButton, {})
+                      }
+                    )
+                  ] }),
+                  tab === "Review" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "review-editing-mode", label: "Editing mode", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.EditingMode, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "review-comments", label: "Comments", children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Comments, {}) }),
+                    /* @__PURE__ */ jsx(RibbonItem, { id: "review-options", label: "Review options", children: /* @__PURE__ */ jsx(RibbonMenu, { label: "Review options", icon: /* @__PURE__ */ jsx(UsersRound, { size: 16 }), children: /* @__PURE__ */ jsx(DocxEditor.Toolbar.Reviewers, {}) }) })
+                  ] })
+                ] })
+              }
+            )
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsx(DocxEditor.Toolbar.TableCellFill, { hidden: true })
+    ] }),
+    badge && /* @__PURE__ */ jsx("span", { className: "native-docx-ribbon-badge", "data-testid": "docx-ribbon-badge", children: badge })
+  ] });
+}
+export {
+  DocxCommandMenu
+};
+//# sourceMappingURL=DocxCommandMenu.js.map

package/dist/docx/DocxCommandMenu.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/docx/DocxCommandMenu.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react'\nimport { DocxEditor, useChromeTranslate } from '@docx-editor.dev/react'\nimport {\n  BookA,\n  ChevronDown,\n  FilePenLine,\n  Home,\n  Image,\n  LayoutGrid,\n  ListChecks,\n  Menu,\n  Plus,\n  Table,\n  UsersRound,\n} from 'lucide-react'\nimport { useDefinedTerms } from './definitions/DefinedTerms'\nimport { RibbonMenu } from './RibbonMenu'\nimport { NamedCommandList, RibbonItem } from './RibbonOverflow'\nimport { StyleGallery } from './StyleGallery'\nimport { NoteButtons } from './WordReferences'\nimport { CrossReferenceButton, UpdateCrossReferencesButton } from './references/EditorMenus'\nimport { LayoutTabContent, LAYOUT_TAB, useContextualTabs } from './layout/LayoutTabs'\nimport {\n  GenerateImageButton,\n  useGenerateImageTarget,\n  type DocxImageGeneration,\n} from './layout/GenerateImage'\nimport { QuickParts } from './template/QuickParts'\nimport { HouseTemplatePanel } from './template/HouseTemplatePanel'\nimport { MySignatureMenu, SignatureFieldMenu } from './signatures/SignatureFields'\n\nfunction DefinedTermButton() {\n  const terms = useDefinedTerms()\n  if (!terms) return null\n  return (\n    <button\n      type=\"button\"\n      className=\"native-docx-ribbon-trigger\"\n      aria-label={terms.labels.insert}\n      title={`${terms.labels.insert} (type @@)`}\n      data-testid=\"docx-insert-defined-term\"\n      onMouseDown={(event) => event.preventDefault()}\n      onClick={(event) => terms.openPicker(event.currentTarget)}\n    >\n      <BookA size={16} />\n    </button>\n  )\n}\n\nconst categories = [\n  { name: 'Home', icon: Home },\n  { name: 'Insert', icon: Plus },\n  { name: 'Design', icon: FilePenLine },\n  { name: LAYOUT_TAB, icon: LayoutGrid },\n  { name: 'References', icon: BookA },\n  { name: 'Review', icon: ListChecks },\n] as const\n\n/** One editing menu, with named categories and the existing editor commands. */\nexport function DocxCommandMenu({\n  onSave,\n  badge,\n  imageGeneration,\n}: {\n  onSave: () => void\n  badge?: React.ReactNode\n  imageGeneration?: DocxImageGeneration\n}) {\n  const [selected, setSelected] = useState('Home')\n  const contextual = useContextualTabs(selected)\n  const tab = contextual.shown\n  const t = useChromeTranslate()\n  useGenerateImageTarget()\n  const allCategories = [\n    ...categories,\n    ...contextual.tabs.map((name) => ({ name, icon: name === 'Table' ? Table : Image })),\n  ]\n  return (\n    <div className=\"native-docx-ribbon native-docx-command-menu\">\n      <DocxEditor.Toolbar t={t} preset={false} onSave={onSave}>\n        <RibbonMenu\n          label=\"Editing tools\"\n          icon={\n            <>\n              <Menu size={16} />\n              <span>Editing tools</span>\n              <ChevronDown size={14} />\n            </>\n          }\n          className=\"native-docx-command-trigger\"\n          popoverClassName=\"native-docx-command-panel\"\n          keepMounted\n          restoreFocus\n        >\n          {(close) => (\n            <div className=\"native-docx-command-layout\">\n              <nav className=\"native-docx-command-categories\" aria-label=\"Editing tool categories\">\n                {allCategories.map(({ name, icon: Icon }) => (\n                  <button\n                    type=\"button\"\n                    key={name}\n                    aria-pressed={tab === name}\n                    onClick={() => setSelected(name)}\n                  >\n                    <Icon size={16} aria-hidden=\"true\" />\n                    <span>{name}</span>\n                  </button>\n                ))}\n              </nav>\n              <div\n                className=\"native-docx-command-list\"\n                role=\"group\"\n                aria-label={`${tab} commands`}\n                onClick={(event) => {\n                  const target = event.target as HTMLElement\n                  const button = target.closest<HTMLButtonElement>('button')\n                  const item = target.closest<HTMLElement>('[data-ribbon-item]')?.dataset.ribbonItem\n                  const direct = new Set([\n                    'home-undo',\n                    'home-redo',\n                    'home-save',\n                    'home-bold',\n                    'home-italic',\n                    'home-underline',\n                    'home-bullets',\n                    'home-numbers',\n                    'home-indent',\n                    'home-outdent',\n                    'home-strike',\n                    'home-clear',\n                    'references-footnote',\n                    'references-endnote',\n                    'references-update-cross-references',\n                    'table-row-above',\n                    'table-row-below',\n                    'table-column-left',\n                    'table-column-right',\n                  ])\n                  if (\n                    (!button || !button.disabled) &&\n                    target.closest('[aria-disabled=\"true\"]') === null &&\n                    ((button && item && direct.has(item)) ||\n                      target.closest('[role=\"gridcell\"]') ||\n                      target.closest('[role=\"menuitemradio\"]') ||\n                      target.closest('[data-testid=\"docx-insert-my-signature\"]') ||\n                      target.closest('[data-testid=\"docx-insert-my-initials\"]') ||\n                      target.closest('.native-docx-style-gallery [role=\"option\"]') ||\n                      (button && button.closest('.native-docx-style-gallery')))\n                  ) {\n                    close()\n                  }\n                }}\n              >\n                <NamedCommandList>\n                  {tab === 'Home' && (\n                    <>\n                      <RibbonItem id=\"home-undo\" label=\"Undo\">\n                        <DocxEditor.Toolbar.Undo />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-redo\" label=\"Redo\">\n                        <DocxEditor.Toolbar.Redo />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-save\" label=\"Save\">\n                        <DocxEditor.Toolbar.Save />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-style\" label=\"Styles\">\n                        <StyleGallery />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-bold\" label=\"Bold\">\n                        <DocxEditor.Toolbar.Bold />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-italic\" label=\"Italic\">\n                        <DocxEditor.Toolbar.Italic />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-underline\" label=\"Underline\">\n                        <DocxEditor.Toolbar.Underline />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-font-family\" label=\"Font family\">\n                        <DocxEditor.Toolbar.FontFamily />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-font-size\" label=\"Font size\">\n                        <DocxEditor.Toolbar.FontSize />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-font-color\" label=\"Font color\">\n                        <DocxEditor.Toolbar.FontColor />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-highlight\" label=\"Highlight\">\n                        <DocxEditor.Toolbar.Highlight />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-alignment\" label=\"Alignment\">\n                        <DocxEditor.Toolbar.Alignment />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-bullets\" label=\"Bulleted list\">\n                        <DocxEditor.Toolbar.BulletList />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-numbers\" label=\"Numbered list\">\n                        <DocxEditor.Toolbar.NumberedList />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-line-spacing\" label=\"Line spacing\">\n                        <DocxEditor.Toolbar.LineSpacing />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-indent\" label=\"Increase indent\">\n                        <DocxEditor.Toolbar.Indent />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-outdent\" label=\"Decrease indent\">\n                        <DocxEditor.Toolbar.Outdent />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-strike\" label=\"Strikethrough\">\n                        <DocxEditor.Toolbar.Strike />\n                      </RibbonItem>\n                      <RibbonItem id=\"home-clear\" label=\"Clear formatting\">\n                        <DocxEditor.Toolbar.ClearFormatting />\n                      </RibbonItem>\n                    </>\n                  )}\n                  {tab === 'Insert' && (\n                    <>\n                      <RibbonItem id=\"insert-table\" label=\"Table\">\n                        <DocxEditor.Toolbar.TableInsert />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-picture\" label=\"Picture\">\n                        <DocxEditor.Toolbar.ImageInsert />\n                      </RibbonItem>\n                      {imageGeneration && (\n                        <RibbonItem id=\"insert-generate-image\" label=\"Generate image\">\n                          <GenerateImageButton generation={imageGeneration} />\n                        </RibbonItem>\n                      )}\n                      <RibbonItem id=\"insert-page-break\" label=\"Page break\">\n                        <DocxEditor.Toolbar.Button slotId=\"insert.pageBreak\" />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-link\" label=\"Link\">\n                        <DocxEditor.Toolbar.Link />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-defined-term\" label=\"Defined term\">\n                        <DefinedTermButton />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-quick-parts\" label=\"Quick Parts\">\n                        <QuickParts />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-signature-field\" label=\"Signature field\">\n                        <SignatureFieldMenu onInserted={close} />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-my-signature\" label=\"My signature\">\n                        <MySignatureMenu />\n                      </RibbonItem>\n                      <RibbonItem id=\"insert-cross-reference\" label=\"Cross-reference\">\n                        <CrossReferenceButton />\n                      </RibbonItem>\n                    </>\n                  )}\n                  <LayoutTabContent tab={tab} />\n                  {tab === 'Design' && (\n                    <RibbonItem id=\"design-house-template\" label=\"House template\">\n                      <HouseTemplatePanel />\n                    </RibbonItem>\n                  )}\n                  {tab === 'References' && (\n                    <>\n                      <NoteButtons />\n                      <RibbonItem id=\"references-cross-reference\" label=\"Cross-reference\">\n                        <CrossReferenceButton />\n                      </RibbonItem>\n                      <RibbonItem\n                        id=\"references-update-cross-references\"\n                        label=\"Update cross-references\"\n                      >\n                        <UpdateCrossReferencesButton />\n                      </RibbonItem>\n                    </>\n                  )}\n                  {tab === 'Review' && (\n                    <>\n                      <RibbonItem id=\"review-editing-mode\" label=\"Editing mode\">\n                        <DocxEditor.Toolbar.EditingMode />\n                      </RibbonItem>\n                      <RibbonItem id=\"review-comments\" label=\"Comments\">\n                        <DocxEditor.Toolbar.Comments />\n                      </RibbonItem>\n                      <RibbonItem id=\"review-options\" label=\"Review options\">\n                        <RibbonMenu label=\"Review options\" icon={<UsersRound size={16} />}>\n                          <DocxEditor.Toolbar.Reviewers />\n                        </RibbonMenu>\n                      </RibbonItem>\n                    </>\n                  )}\n                </NamedCommandList>\n              </div>\n            </div>\n          )}\n        </RibbonMenu>\n        <DocxEditor.Toolbar.TableCellFill hidden />\n      </DocxEditor.Toolbar>\n      {badge && (\n        <span className=\"native-docx-ribbon-badge\" data-testid=\"docx-ribbon-badge\">\n          {badge}\n        </span>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/docx/NativeDocxEditor.d.ts

@@ -35,7 +35,7 @@ export interface NativeDocxAdapter {
     author?: string;
     subscribeTokenChanges?: (listener: () => void) => () => void;
     onDirtyChange?: (dirty: boolean) => void;
-    onVersionSaved?: (documentId: string) => void | Promise<void>;
+    onVersionSaved?: (documentId: string, version?: number) => void | Promise<void>;
     notify?: (message: string, kind: 'success' | 'error') => void;
     mentions?: readonly DocxMention[];
     requestAgent?: (documentId: string, request: DocxAgentCommentRequest) => Promise<DocxMentionDelivery | void>;
@@ -89,6 +89,8 @@ export interface NativeDocxEditorProps {
     compact?: boolean;
     /** Receives a reader of the live room's state, so the host's save can include the latest keystrokes. */
     stateRef?: React.MutableRefObject<(() => string | undefined) | null>;
+    /** Save the current live room before leaving the editor; false means the caller must stay. */
+    saveRef?: React.MutableRefObject<(() => Promise<boolean | number>) | null>;
 }
 export declare function DocxParticipants({ session }: {
     session?: DocxCollaborationSession;
@@ -100,4 +102,4 @@ export declare function DocxRibbon({ onSave, badge, imageGeneration, }: {
     /** A short state label at the end of the row, such as "Co-editing". */
     badge?: React.ReactNode;
 }): React.JSX.Element;
-export declare function NativeDocxEditor({ documentId, title, draftContent, initialCommentId, snapshot, onSaved, stream, adapter, compact, stateRef, }: NativeDocxEditorProps): React.JSX.Element;
+export declare function NativeDocxEditor({ documentId, title, draftContent, initialCommentId, snapshot, onSaved, stream, adapter, compact, stateRef, saveRef, }: NativeDocxEditorProps): React.JSX.Element;

package/dist/docx/NativeDocxEditor.js

@@ -33,6 +33,7 @@ import {
 } from "lucide-react";
 import { DefinedTermsProvider, useDefinedTerms } from "./definitions/DefinedTerms.js";
 import { RibbonMenu } from "./RibbonMenu.js";
+import { DocxCommandMenu } from "./DocxCommandMenu.js";
 import { RibbonItem, RibbonOverflow } from "./RibbonOverflow.js";
 import { StyleGallery } from "./StyleGallery.js";
 import { NoteButtons, WordShortcuts } from "./WordReferences.js";
@@ -100,12 +101,21 @@ class EditorBoundary extends React.Component {
     ] }) : this.props.children;
   }
 }
-function RoomInputBinding({ session }) {
+function RoomInputBinding({
+  session,
+  flushRef
+}) {
   const editor = useDocxEditor();
   useEffect(() => {
-    if (!editor || !session) return;
-    return session.bindEditorInput(() => editor.surface?.flushPendingInput());
-  }, [editor, session]);
+    if (!editor) return;
+    const flush = () => editor.surface?.flushPendingInput();
+    flushRef.current = flush;
+    const unbind = session?.bindEditorInput(flush);
+    return () => {
+      if (flushRef.current === flush) flushRef.current = null;
+      unbind?.();
+    };
+  }, [editor, session, flushRef]);
   return null;
 }
 function DocxParticipants({ session }) {
@@ -252,11 +262,14 @@ function NativeDocxEditor({
   stream,
   adapter,
   compact = false,
-  stateRef
+  stateRef,
+  saveRef
 }) {
   const [ready, setReady] = useState(), [error, setError] = useState(""), [retry, setRetry] = useState(0);
   const [status, setStatus] = useState("Connecting\u2026"), [dirty, setDirty] = useState(false), [saving, setSaving] = useState(false), [offline, setOffline] = useState(false);
   const revision = useRef(0);
+  const savingRef = useRef(false);
+  const flushInputRef = useRef(null);
   const stageRef = useRef(null), fitCleanup = useRef(void 0), refit = useRef(void 0);
   const fitting = useRef(true), fitted = useRef(void 0);
   const [fitWidth, setFitWidth] = useState(true), [zoomPercent, setZoomPercent] = useState(100);
@@ -480,11 +493,16 @@ function NativeDocxEditor({
     };
   }, [documentId, isDraft, ready]);
   async function saveVersion() {
-    if (!ready || saving || stream) return;
+    if (!ready || savingRef.current || stream) return false;
+    if (snapshot || !ready.canEdit) return true;
+    if (offline) return false;
+    savingRef.current = true;
     setSaving(true);
-    runBeforeSave(ref.current);
-    const atRevision = revision.current;
     try {
+      if (!flushInputRef.current) throw new Error("The editor is not ready to save yet.");
+      flushInputRef.current();
+      runBeforeSave(ref.current);
+      const atRevision = revision.current;
       const result = isDraft ? await (async () => {
         const bytes = await ref.current?.save();
         if (!bytes) throw new Error("The editor is not ready.");
@@ -501,17 +519,32 @@ function NativeDocxEditor({
         setDirty(false);
         drafts.delete(documentId);
       }
-      await Promise.resolve(adapter.onVersionSaved?.(result.document_ext_id)).catch(() => {
-      });
+      const savedVersion = "version" in result && typeof result.version === "number" ? result.version : void 0;
+      if (!isDraft && !savedVersion) throw new Error("Could not confirm the saved version.");
+      await adapter.onVersionSaved?.(result.document_ext_id, savedVersion);
       onSaved?.(result.document_ext_id);
+      if (revision.current !== atRevision) {
+        adapter.notify?.("The document changed while saving. Please try again.", "error");
+        return false;
+      }
       adapter.notify?.(isDraft ? "Word note saved" : "DOCX version saved", "success");
+      return savedVersion ?? true;
     } catch (e) {
       adapter.notify?.(e instanceof Error ? e.message : "Could not save this document.", "error");
       setStatus("Save failed \xB7 your draft is retained");
+      return false;
     } finally {
+      savingRef.current = false;
       setSaving(false);
     }
   }
+  useEffect(() => {
+    if (!saveRef) return;
+    saveRef.current = saveVersion;
+    return () => {
+      saveRef.current = null;
+    };
+  });
   function editorReady(editor) {
     ref.current = editor;
     if (streamRef.current) {
@@ -672,7 +705,7 @@ function NativeDocxEditor({
                               ),
                               compact && !stream && /* @__PURE__ */ jsx(CompactToolbar, {}),
                               !compact && !stream && /* @__PURE__ */ jsx(
-                                DocxRibbon,
+                                DocxCommandMenu,
                                 {
                                   onSave: () => void saveVersion(),
                                   imageGeneration: adapter.imageGeneration && {
@@ -713,7 +746,13 @@ function NativeDocxEditor({
                                           getAgentStatus: adapter.getAgentStatus,
                                           requestAgent: adapter.requestAgent ? (request) => adapter.requestAgent(documentId, request) : void 0,
                                           children: [
-                                            /* @__PURE__ */ jsx(RoomInputBinding, { session: ready.room?.session }),
+                                            /* @__PURE__ */ jsx(
+                                              RoomInputBinding,
+                                              {
+                                                session: ready.room?.session,
+                                                flushRef: flushInputRef
+                                              }
+                                            ),
                                             /* @__PURE__ */ jsx(AgentUndoRoom.Provider, { value: ready.room?.ydoc ?? null, children: /* @__PURE__ */ jsx(DocxEditorReview, { children: () => /* @__PURE__ */ jsxs(DocxEditorReview.Card, { children: [
                                               /* @__PURE__ */ jsx(DocxCommentActivity, {}),
                                               /* @__PURE__ */ jsx(AgentUndo, {})