@docx-editor.dev/react

ContextMenuCellVerticalAlignmentfunctionSource ↗

Compact vertical-alignment picker for selected table cells.

declare function ContextMenuCellVerticalAlignment(input: ContextMenuCommandProps): react.JSX.Element | null;

ContextMenuItemfunctionSource ↗

A host-owned context-menu row, styled and behaved like the packaged ones.

The toolbar's Action for the right-click surface: no slot, no command, no engine wiring — enabled state and the action are the host's, because the engine has no opinion about an action it does not model. Selecting it closes the menu.

declare function ContextMenuItem(input: ContextMenuItemProps): react.JSX.Element;

ContextMenuPastefunctionSource ↗

Paste the clipboard's text at the selection.

THE ROW READS THE CLIPBOARD, not the engine. exec is synchronous and clipboard read is not — it prompts in Chrome and is refused outright by Firefox and Safari — so the read happens here, inside the click that asked for it, where the permission gesture belongs, and the text goes to the engine as an argument.

Nothing can know whether the read will succeed BEFORE it is attempted, so the row starts enabled (when the engine would accept a paste at all) and disables itself, with the browser's own reason, once a read has actually been refused. Guessing the answer up front would either grey out a working Paste on Chrome or advertise a dead one on Safari.

declare function ContextMenuPaste(input: ContextMenuCommandProps): react.JSX.Element | null;

ContextMenuPasteWithoutFormattingfunctionSource ↗

Paste the clipboard's plain text as if typed, whatever richer flavours it holds.

The Cmd+Shift+V twin as a menu row: same clipboard-read contract as [ContextMenuPaste](ContextMenuPaste), routed through the pasteWithoutFormatting command.

declare function ContextMenuPasteWithoutFormatting(input: ContextMenuCommandProps): react.JSX.Element | null;

definePopupfunctionSource ↗

Register an ordinary component in the popups map while preserving its props and hooks. Define the component outside the parent render function to keep its state on rerenders.

declare function definePopup<Props extends object>(component: ComponentType<Props>): (props: Props) => DocxEditorChildren;

DocumentNamefunctionSource ↗

Deprecated. Use `<DocxEditor>` document name slot instead.

declare function DocumentName(input: DocumentNameProps): react__default.JSX.Element;

DocxEditorAuthorStylefunctionSource ↗

Declare one author's presentation, while mounted.

Renders nothing. The editor already colours every author from the --doc-review-author-N ramp; this overrides one of them, and leaves the rest where they are. Prop changes re-apply live — pages repaint without a remount, so the caret and undo history stay — and unmounting returns that author to the ramp.

Read who is in the document with useReviewAuthors, and read these declarations back inside a custom review card with useReviewAuthor.

tsx <DocxEditor.Root document={bytes} modules={MODULES}> <DocxEditor.AuthorStyle author="Jess Lin" color="#7c3aed" avatarUrl="/jess.png" /> … </DocxEditor.Root>

declare function DocxEditorAuthorStyle(props: DocxEditorAuthorStyleProps): null;

DocxEditorColorByChangeTypefunctionSource ↗

Colour tracked changes by the TYPE of change instead of by author, while mounted.

The editor colours by author out of the box — Word's own default, so a paragraph three people edited reads as three people. Mount this to opt out: insertions take --doc-revision-insertion and deletions --doc-revision-deletion, whoever proposed them. Renders nothing; unmounting it returns to by-author colouring.

Composed with DocxEditor.AuthorStyle, it also expresses "highlight these reviewers and leave everyone else green and red": the authors you declare keep their own colour, and this puts the rest on the kind colours.

tsx <DocxEditor.Root document={bytes} modules={MODULES}> <DocxEditor.ColorByChangeType /> … </DocxEditor.Root>

declare function DocxEditorColorByChangeType(): null;

DocxEditorContentfunctionSource ↗

The element the engine paints pages into. Must render inside a DocxEditor.Viewport; the facade attaches here and detaches on unmount. Detaching parks the editor, so mounting the content elsewhere, even in another window, moves it with its undo history, selection and reading position.

Its centring margin lives in the STYLESHEET, not in an inline style here, and behind :where() so it carries no specificity: a host that places the page itself — inside its own stage, beside its own art — overrides it with a plain class and no !important. An inline style could not be beaten by a class at all, which is exactly the trap that makes a library feel like something to fight.

declare function DocxEditorContent(input: DocxEditorContentProps): react.JSX.Element;

DocxEditorContextMenufunctionSource ↗

The packaged right-click menu over the painted document.

Mounted by default inside DocxEditor.Viewport; contextMenu={false} on DocxEditor removes it. Rendered as a child of the viewport so it finds its own surface, but positioned in client space, so it is never clipped by the scroller.

declare function DocxEditorContextMenu(input: DocxEditorContextMenuProps): react.JSX.Element;

DocxEditorDocumentOutlinefunctionSource ↗

The document outline as a context-fed part (DocxEditor.DocumentOutline): headings from Editor.getOutline(), in document order; clicking one moves the caret to that heading. The panel positions absolutely — give it a position: relative container.

Renders nothing while the editor has no document — a floating panel saying "no headings" about a document that is not there is the same false claim the rulers made.

declare function DocxEditorDocumentOutline(props: DocxEditorDocumentOutlineProps): ReactElement | null;

DocxEditorEquationfunctionSource ↗

Default equation editor mounted by the packaged React host.

declare function DocxEditorEquation(): react.JSX.Element | null;

DocxEditorExportDialogfunctionSource ↗

Default progress and error dialog for popups.export.

declare function DocxEditorExportDialog(input: DocxEditorExportDialogProps): react.JSX.Element | null;

DocxEditorFontNoticefunctionSource ↗

Word-style font compatibility notice.

Shown when the open document declares font families this platform cannot resolve — not installed, not embedded in the file, not supplied by the app's font configuration — so the text is rendering in a substitute face. Dismissing hides the notice for that set of families; a different document (or a font arriving) changes the set and surfaces it again.

declare function DocxEditorFontNotice(input: DocxEditorFontNoticeProps): react.JSX.Element | null;

DocxEditorHeaderFooterChromefunctionSource ↗

Thin overlay while a header or footer scope is open: region label and contextual options. Mount beside DocxEditor.Content.

declare function DocxEditorHeaderFooterChrome(input: DocxEditorHeaderFooterChromeProps): ReactElement | null;

DocxEditorHorizontalRulerfunctionSource ↗

The horizontal ruler as a context-fed part (DocxEditor.HorizontalRuler): page width, margins and zoom straight from the editor. Left/right margin handles are draggable when the engine supports page-setup writes; the drag previews locally and commits one undoable step on release.

Renders nothing while the editor holds no document — see [selectDocumentAbsent](selectDocumentAbsent).

declare function DocxEditorHorizontalRuler(props: DocxEditorRulerProps): ReactElement | null;

DocxEditorImageAltTextPopupfunctionSource ↗

Default image alt-text panel.

declare function DocxEditorImageAltTextPopup(input: DocxEditorImageAltTextPopupProps): react.JSX.Element;

DocxEditorImageInsertErrorDialogfunctionSource ↗

The packaged picture refusal: an editor dialog, never a page-blocking browser alert.

declare function DocxEditorImageInsertErrorDialog(input: DocxEditorImageInsertErrorDialogProps): react.JSX.Element;

DocxEditorImagePropertiesDialogfunctionSource ↗

Properties dialog for the selected picture.

declare function DocxEditorImagePropertiesDialog(input: DocxEditorImagePropertiesDialogProps): react.JSX.Element | null;

DocxEditorInvalidTextFormFieldDialogfunctionSource ↗

Default acknowledgement shell for a custom popup renderer.

declare function DocxEditorInvalidTextFormFieldDialog(props: DocxEditorInvalidTextFormFieldDialogProps): react.JSX.Element;

DocxEditorLoadingSpinnerfunctionSource ↗

The packaged spinner, on its own. Exposed because children replaces the default screen wholesale — a host that wants "spinner plus my own label" would otherwise have to hand-copy an internal class name.

Decorative: it carries aria-hidden, so the surrounding live region needs its own text. DocxEditor.Loading supplies a translated one when you pass no children.

declare function DocxEditorLoadingSpinner(input: DocxEditorLoadingSpinnerProps): react.JSX.Element;

DocxEditorNavigationfunctionSource ↗

The document navigation pane — headings and find — over the left gutter.

declare function DocxEditorNavigation(props: DocxEditorNavigationProps): ReactElement;

DocxEditorNotePreviewfunctionSource ↗

Default informational note preview.

declare function DocxEditorNotePreview(input: DocxEditorNotePreviewProps): react.JSX.Element;

DocxEditorNotePropertiesDialogfunctionSource ↗

Default note properties dialog.

declare function DocxEditorNotePropertiesDialog(props: DocxEditorNotePropertiesDialogProps): ReactElement;

DocxEditorNotesChromefunctionSource ↗

declare function DocxEditorNotesChrome(input: DocxEditorNotesChromeProps): ReactElement | null;

DocxEditorNotesContextMenufunctionSource ↗

Default note context menu.

declare function DocxEditorNotesContextMenu(input: DocxEditorNotesContextMenuProps): react.JSX.Element;

DocxEditorOpenFailureActionfunctionSource ↗

A button in the open-failure dialog, styled as the packaged **Close**. Use it in actions, or in your own children. With asChild, it styles your own element instead, such as a link to your support page:

tsx <DocxEditor.OpenFailure actions={({ failure }) => ( <DocxEditor.OpenFailure.Action asChild> <a href={/support?code=${failure.code}}>Get help</a> </DocxEditor.OpenFailure.Action> )} />

declare function DocxEditorOpenFailureAction(input: DocxEditorOpenFailureActionProps): react.JSX.Element;

DocxEditorPageNumberfunctionSource ↗

Floating localized page readout for the active DocxEditor.Viewport.

It appears while a multi-page document scrolls and fades after 600 ms of inactivity. It is positioned absolute against the nearest positioned ancestor, so give the element that holds the viewport position: relative.

Place it as a sibling of the viewport or inside it. Inside the viewport, it renders into the viewport's parent element, so it stays in view while the pages scroll.

declare function DocxEditorPageNumber(input: DocxEditorPageNumberProps): react.JSX.Element | null;

```tsx
<div style={{ position: 'relative', height: '100%' }}>
  <DocxEditor.Viewport>
    <DocxEditor.Content />
  </DocxEditor.Viewport>
  <DocxEditor.PageNumber />
</div>
```

DocxEditorPrintDialogfunctionSource ↗

Default progress and error dialog for popups.print. The editor closes it when the browser print dialog opens.

declare function DocxEditorPrintDialog(input: DocxEditorPrintDialogProps): react.JSX.Element | null;

DocxEditorRevisionMarkupfunctionSource ↗

Declares markup settings without rendering an element.

declare function DocxEditorRevisionMarkup(props: DocxEditorRevisionMarkupProps): null;

DocxEditorRootfunctionSource ↗

Creates and owns a DocxEditorInstance and provides it to the subtree. Renders no DOM — compose it with DocxEditor.Viewport + DocxEditor.Content for the painted pages, and any hook-built chrome anywhere inside.

declare function DocxEditorRoot(props: DocxEditorRootProps): react.JSX.Element;

DocxEditorShellfunctionSource ↗

Deprecated. Use `<DocxEditor>` from the composition layer instead.

Outer chrome of the editor: i18n + error provider wrappers, the scroll container with its background-click handler, horizontal and vertical rulers, the floating page indicator, document outline panel + toggle button, plus slots for the toolbar, paged-area body, overlays, dialogs, and hidden file inputs.

This shell renders NO review highlight of its own. Marking the active comment or tracked change belongs to the engine, which paints docx-comment-band--active and docx-revision-band--active for the item the caret is in, or for the one an Editor.setActiveReviewItem pin names instead. One source for which item is active, so a host sidebar and the painted document cannot disagree about it.

declare function DocxEditorShell(input: {
    i18n: React.ComponentProps<typeof LocaleProvider>['i18n'];
    isDark?: boolean;
    onEditorError: (error: Error) => void;
    containerRef: React.Ref<HTMLDivElement>;
    scrollContainerRef: React.Ref<HTMLDivElement>;
    editorContentRef: React.Ref<HTMLDivElement>;
    className: string | undefined;
    containerStyle: CSSProperties;
    mainContentStyle: CSSProperties;
    editorContainerStyle: CSSProperties;
    showRuler: boolean;
    readOnlyProp: boolean | undefined;
    showOutline: boolean;
    showOutlineButton: boolean;
    sidebarOpen: boolean;
    minLayoutWidth: number;
    toolbarHeight: number;
    editorScrollLeft: number;
    expandedSidebarItem?: string | null;
    trackedChanges?: readonly TrackedChangeSummary[];
    onScrollContainerMouseDown: (e: React.MouseEvent) => void;
    onEditorBgMouseDown: (e: React.MouseEvent) => void;
    onEditorContextMenu: (e: React.MouseEvent) => void;
    horizontalRulerProps: HorizontalRulerProps;
    verticalRulerProps: VerticalRulerProps$1;
    outlineProps: OutlineProps;
    onToggleOutline: () => void;
    scrollPageInfo: ScrollPageInfo;
    toolbar: ReactNode;
    pagedArea: ReactNode;
    overlays: ReactNode;
    dialogs: ReactNode;
    fileInputs: ReactNode;
}): react.JSX.Element;

DocxEditorUnsupportedElementfunctionSource ↗

Register a renderer under DocxEditor or DocxEditor.Root. The first mounted matching declaration wins. Prop updates retain its priority. Omit match for a catch-all. Returning null, false, an empty fragment or array, or whitespace keeps what the editor shows. Layout uses points and only sizes content without an existing layout box. Custom content gets the occurrence's box (element.bounds); size it to 100% of the width and height. Clicking a custom preview selects the underlying drawing for moving, resizing, or deletion. Links, buttons, and form fields retain their normal behavior. Components can remount when pagination or virtualization removes an occurrence.

declare function DocxEditorUnsupportedElement(input: DocxEditorUnsupportedElementProps): react.JSX.Element[];

DocxEditorVerticalRulerfunctionSource ↗

The vertical ruler as a context-fed part (DocxEditor.VerticalRuler): page height, margins and zoom straight from the editor. Top/bottom margin handles are draggable when the engine supports page-setup writes, committing one undoable step on release.

Renders nothing while the editor holds no document — see [selectDocumentAbsent](selectDocumentAbsent) — and nothing while the page is wider than the viewport: the ruler rides the scroller at content x=0, so a horizontal scroll would carry it out of view, and pinning it instead would paint ticks over page text. Word's web peers drop it on cramped viewports; so does this part, and it returns as soon as the page fits again.

declare function DocxEditorVerticalRuler(props: DocxEditorRulerProps): ReactElement | null;

DocxEditorViewportfunctionSource ↗

The sole scroll container for the painted document. Put DocxEditor.Content inside it; the engine discovers this element by class and manages scrolling against it.

declare function DocxEditorViewport(input: DocxEditorViewportProps): react.JSX.Element;

DocxEditorWindowfunctionSource ↗

Render the editor panel in its own browser window while open is true.

Place it inside DocxEditor.Root around the parts to pop out. The Root stays in this window, so the editor moves into the pop-out and back with its undo history, selection and collaboration session. The window gets this page's stylesheets, and closing it brings the panel back and calls onClose.

declare function DocxEditorWindow(input: DocxEditorWindowProps): react.JSX.Element;

```tsx
const [popped, setPopped] = useState(false);

<DocxEditor.Root document={bytes}>
  <button onClick={() => setPopped(!popped)}>Pop out</button>
  <DocxEditor.Window open={popped} onClose={() => setPopped(false)}>
    <DocxEditor.Toolbar />
    <DocxEditor.Viewport>
      <DocxEditor.Content />
    </DocxEditor.Viewport>
  </DocxEditor.Window>
</DocxEditor.Root>
```

HorizontalRulerfunctionSource ↗

declare function HorizontalRuler(input: HorizontalRulerProps$1): react__default.ReactElement;

ImageAltTextfunctionSource ↗

Opens a small panel to edit image description (and optional title).

declare function ImageAltText(input: ImageAltTextProps): react.JSX.Element | null;

ImageInsertProviderfunctionSource ↗

declare function ImageInsertProvider(input: ImageInsertProviderProps): react.JSX.Element;

ImageInsertTriggerfunctionSource ↗

Toolbar insert-image control — opens the shared file picker.

declare function ImageInsertTrigger(input: ImageInsertTriggerProps): react.JSX.Element | null;

ImagePropertiesTriggerfunctionSource ↗

Opens the image properties dialog for the selected drawing.

declare function ImagePropertiesTrigger(input: ImagePropertiesTriggerProps): react.JSX.Element | null;

ImageWrapfunctionSource ↗

Wrap-text dropdown presenting all nine Word choices.

declare function ImageWrap(input: ImageWrapProps): react.JSX.Element | null;

isFieldLinkfunctionSource ↗

A field-derived link (a HYPERLINK field's instruction) rather than a typed w:hyperlink. Structurally signalled: the field registry mints every record with no addressable range (paragraphId stays empty), because no w:hyperlink node backs it. The typed editing lane (edit / unlink) can never resolve its id, so chrome offers neither action. Caret dismissal DOES apply: the field is a one-unit atom, and fieldLinkAtCaret resolves the caret onto it (boundary-inclusive) so the panel closes when the caret leaves.

declare function isFieldLink(link: SurfaceHyperlink): boolean;

LocaleProviderfunctionSource ↗

declare function LocaleProvider(input: LocaleProviderProps): react.JSX.Element;

LogofunctionSource ↗

Deprecated. Use `<DocxEditor>` title slots instead.

declare function Logo(input: LogoProps): react__default.JSX.Element;

MenuBarfunctionSource ↗

Deprecated. Use `DocxEditor.Menu` from the composition layer instead.

declare function MenuBar(): react__default.JSX.Element;

NavigationClosefunctionSource ↗

The back arrow that closes the pane.

declare function NavigationClose(input: NavigationPartProps): ReactElement;

NavigationFindfunctionSource ↗

The find panel: a query box, a result counter with previous/next, the match-case and whole-word toggles, and the result list. Selecting a result moves the caret onto the match and reveals its page.

declare function NavigationFind(input: NavigationPartProps): ReactElement;

NavigationGoTofunctionSource ↗

The Bookmarks panel: a bookmark search box, the sort order and hidden-bookmarks toggle, and the bookmarks it offers, grouped by place when sorted by location.

declare function NavigationGoTo(input: NavigationPartProps): ReactElement;

NavigationHeaderfunctionSource ↗

The pane's title row. With no children it renders the close arrow and the title.

declare function NavigationHeader(input: NavigationPartProps): ReactElement;

NavigationHeadingsfunctionSource ↗

The heading list, indented by outline depth. Clicking a row moves the caret to that heading and brings it into view.

The filter box narrows the list CLIENT-SIDE — it hides rows whose text does not contain what you typed. It is deliberately not the document search: filtering an outline and searching a document are different questions, and the Find tab answers the second one.

declare function NavigationHeadings(input: NavigationPartProps): ReactElement;

navigationPaneOverlaysfunctionSource ↗

Whether an open pane overlays the page rather than moving it: true when the viewport leaves less than [NAVIGATION_PANE_MIN_PAGE_ROOM](NAVIGATION_PANE_MIN_PAGE_ROOM) beside the reservation. Uses the viewport's client width only, never a padding the pane itself causes, so the answer cannot feed back into its own input. false for a viewport that has not been measured.

declare function navigationPaneOverlays(viewportWidth: number, reservation: number): boolean;

navigationPaneReservationfunctionSource ↗

Total left space an open pane needs before the page may start.

declare function navigationPaneReservation(paneWidth?: number): number;

navigationShiftfunctionSource ↗

The viewport's left padding, in px, that puts the page's left edge exactly at reservation — and 0 whenever the gutter is already wide enough.

Returns 0 for a degenerate measurement (a viewport that has not been laid out yet, a document with no page setup) rather than guessing: shifting on a zero measurement would make the pane jump on the first frame and settle on the second.

declare function navigationShift(input: NavigationShiftInput): number;

NavigationTabfunctionSource ↗

One tab button. Children replace the label.

declare function NavigationTab(input: NavigationTabProps): ReactElement;

NavigationTabsfunctionSource ↗

The tab strip. With no children it renders one Tab per tab the pane supports.

A real role="tablist", so arrow keys move between tabs and a screen reader announces the panel each one controls.

declare function NavigationTabs(input: NavigationPartProps): ReactElement;

NavigationTitlefunctionSource ↗

The pane's heading text.

declare function NavigationTitle(input: NavigationPartProps): ReactElement;

NavigationTogglefunctionSource ↗

The collapsed pane's disc button. DocxEditor.Navigation renders one for you while the pane is closed; place it yourself (a toolbar, a menu) with toggle={false} on the root.

declare function NavigationToggle(input: NavigationPartProps): ReactElement;

normalizeImageBytesfunctionSource ↗

Preflight raster bytes for insert/replace. Never allocates from file-supplied dimensions alone.

declare function normalizeImageBytes(bytes: Uint8Array): NormalizedImagePayload;

PageIndicatorfunctionSource ↗

Floating page indicator shown next to the scrollbar while the user scrolls a multi-page document. Wrapped so the {current} of {total} template runs through t(); useTranslation() only works inside <LocaleProvider>, which DocxEditor's own body is not.

declare function PageIndicator(input: PageIndicatorProps): react.JSX.Element;

PaginatedDocxEditorfunctionSource ↗

declare function PaginatedDocxEditor(input: PaginatedDocxEditorProps): react.JSX.Element;

PaginatedDocxEditorShellfunctionSource ↗

Deprecated. Use `<DocxEditor>` from the composition layer instead.

declare function PaginatedDocxEditorShell(input: PaginatedDocxEditorShellProps): react.JSX.Element;

provideDocxEditorfunctionSource ↗

Prepares Root props and listeners while exposing the instance created by that Root. Call this function during render, like a React hook.

declare function useProvidedDocxEditor(options: DocxEditorRootProps): ProvideDocxEditorResult;

reviewGutterfunctionSource ↗

The paddings, in px, the scroll container reserves for the review rail.

Returns the FULL column for a degenerate measurement (a viewport that has not been laid out yet, a document with no page setup) rather than guessing: that is the value the stylesheet fell back to before this measurement existed, so an unmeasured first frame paints exactly as it always did and collapses only once there is a real width to decide by.

declare function reviewGutter(input: ReviewGutterInput): ReviewGutter;

SlotfunctionSource ↗

Renders its single child element with the slot's props merged in.

declare function Slot(input: SlotProps): ReactElement<unknown, string | react.JSXElementConstructor<any>> | null;

TitleBarfunctionSource ↗

Deprecated. Use `<DocxEditor>` from the composition layer instead.

declare function TitleBar(input: TitleBarProps): react__default.JSX.Element;

TitleBarRightfunctionSource ↗

Deprecated. Use `<DocxEditor>` title slots instead.

declare function TitleBarRight(input: TitleBarRightProps): react__default.JSX.Element;

ToolbarfunctionSource ↗

Deprecated. Use `DocxEditor.Toolbar` from the composition layer instead.

declare function Toolbar(explicitProps: ToolbarProps): react__default.JSX.Element;

ToolbarButtonfunctionSource ↗

Deprecated. Use `DocxEditor.Toolbar` button parts instead.

declare function ToolbarButton(input: ToolbarButtonProps): react__default.JSX.Element;

ToolbarGroupfunctionSource ↗

Deprecated. Use `DocxEditor.Toolbar` group parts instead.

declare function ToolbarGroup(input: ToolbarGroupProps): react__default.JSX.Element;

useBookmarkDialogfunctionSource ↗

Read the enclosing Bookmark dialog draft.

declare function useBookmarkDialog(): UseBookmarkDialogReturn;

useBookmarksfunctionSource ↗

The document's bookmarks plus the commands that change them.

declare function useBookmarks(): UseBookmarksReturn;

useChromeDirfunctionSource ↗

The dir attribute a chrome part sets on its root: the direction a provider decided (its dir prop, the catalog's _dir, or a right-to-left _lang), otherwise nothing, so the part keeps the host page direction.

Read it in your own controls to follow the editor chrome: undefined means the chrome inherits the host page direction, so set no dir then.

declare function useChromeDir(): 'ltr' | 'rtl' | undefined;

useChromeTranslatefunctionSource ↗

The catalogue-backed resolver for composed chrome, ready to pass as any part's t.

useTranslation().t is keyed by the strict TranslationKey union, which does not assign to the parts' plain-string t props — so before this hook, every composing host hand-wrote the same cast wrapper <DocxEditor> builds internally. This is that wrapper, exported: it resolves through the active LocaleContext catalogue (bundled English by default), with overrides consulted first for key-level renames.

```tsx const MY_LABELS = new Map([['formattingBar.bold', 'Heavy']]); // module-level: stable identity

const t = useChromeTranslate(MY_LABELS); <DocxEditor.Toolbar t={t} /> ```

Keep the overrides Map identity stable (module-level or memoized) — the returned resolver is memoized on it, and an inline new Map(...) re-creates the resolver, and with it every consuming part's props, on each render.

overrides is a Map on purpose: the key is caller input, and an object literal would answer constructor and toString off the prototype chain. Parts pass no params today for overridden keys, so override values are literal strings.

declare function useChromeTranslate(overrides?: ReadonlyMap<string, string>): ChromeTranslate;

useCommentDraftRequestfunctionSource ↗

Open the host's own comment draft when the review.addComment control is pressed.

While the component is mounted and handler is set, the control is enabled (subject to the engine's other rules: the review module, the editing mode, and a selection). Without any registration the control is disabled, because nothing could open the draft. The most recent registration receives each request. Pass null to stop serving requests, for example while your comment UI cannot open a draft.

The handler takes no arguments. Read the selection with editor.getSelectionPlacement(), and pin it with editor.retainSelection() while the draft is open.

declare function useCommentDraftRequest(handler: (() => void) | null | undefined): void;

```tsx
function CommentButton() {
  const [drafting, setDrafting] = useState(false);
  useCommentDraftRequest(() => setDrafting(true));
  const addComment = useEditorCommand('review.addComment');
  return (
    <>
      <button
        disabled={!addComment.isEnabled}
        title={addComment.disabledReason ?? 'Add comment'}
        onClick={() => addComment.execute()}
      >
        Add comment
      </button>
      {drafting ? <MyCommentDraft onClose={() => setDrafting(false)} /> : null}
    </>
  );
}
```

useCompareDocumentsDialogfunctionSource ↗

Read the enclosing Compare documents draft.

declare function useCompareDocumentsDialog(): UseCompareDocumentsDialogReturn;

useContentControlfunctionSource ↗

Headless content-control chrome. Mount under DocxEditor.Root.

Both the context-provided instance and a local fallback run every render (same order), matching useHyperlinkPopup.

declare function useContentControl(): UseContentControlResult;

useContentControlInstancefunctionSource ↗

Create the content-control chrome state. Used by DocxEditor.Root to publish one shared instance; also usable in tests without the provider.

declare function useContentControlInstance(): UseContentControlResult;

useContentControlWidgetfunctionSource ↗

Draft state of the enclosing content-control value pop-up.

declare function useContentControlWidget(): UseContentControlWidgetResult;

useContextMenuTargetfunctionSource ↗

The element the opening right-click landed on, or null while the menu is closed.

Public so capability packages can render contextual sections — a row that only exists when the press landed on their own painted chrome — without a second listener.

declare function useContextMenuTarget(): HTMLElement | null;

useDocumentOutlinefunctionSource ↗

The document outline's behavior, with no UI attached: the headings, their nesting depth, and the jump. DocxEditor.Navigation.Headings is this hook plus rows; a host that wants a different list takes the hook and renders its own.

declare function useDocumentOutline(): UseDocumentOutlineResult;

useDocumentSearchfunctionSource ↗

The editor's shared search, with no UI attached. The packaged Find pane uses the same session, so state set here shows there.

declare function useDocumentSearch(options?: UseDocumentSearchOptions): UseDocumentSearchResult;

useDocxEditorfunctionSource ↗

The editor instance from the nearest DocxEditor.Root, or null before the Root's mount effect has created it (and outside any Root). Deliberately not a throwing variant: pre-mount is a normal frame every consumer renders through, and the state hooks built on this already answer it with a typed loading snapshot.

declare function useDocxEditor(): DocxEditorInstance | null;

useDocxSourcefunctionSource ↗

Load a document (and optionally fonts) for DocxEditor.

tsx const { document, fonts, error } = useDocxSource(url, { fonts: packagedFonts() }); if (error) return <p>{error.message}</p>; return <DocxEditor document={document} fonts={fonts} />;

FONTS NEVER FAIL THE DOCUMENT. A face that will not load degrades that family to fixed-width measurement — the document still opens, it just paginates less like Word — so a font failure leaves error null and is the loader's to report. A document failure is different: there is nothing to show, so it lands on error.

THE DOCUMENT WAITS FOR THE FONTS, on the eager path. They fetch concurrently, but document stays undefined until fonts have settled — resolved OR failed — because layout MEASURES with them. Handing the editor bytes first paginates the whole document on the fixed fallback and then re-paginates when the real faces arrive, which the reader sees as the text jumping. One slightly longer wait beats a visible reflow. Without a fonts option there is nothing to wait for and the bytes go straight through.

AN ON-DEMAND ORIGIN CANNOT BE WAITED FOR, and this hook does not pretend otherwise. A resolver is answered with the families the file declares, which nothing knows until the engine has parsed it, so holding the bytes back would wait on work that only the bytes can start. document is released at once, fonts is a stable resolver, and the engine re-paginates when the faces land. That one reflow is what buys loading the faces a document uses rather than everything an origin would load up front; { fonts: defaultFonts } is still there when the no-reflow guarantee matters more than the megabytes.

A URL is fetched with the browser's own fetch, exactly as the caller wrote it. Validate it first if it came from user input: this hook adds no allowlist of its own, and inventing one would only give callers a false sense of where the trust boundary is.

declare function useDocxSource(source: DocxSource | null | undefined, options?: UseDocxSourceOptions): UseDocxSourceResult;

useEditorCaretfunctionSource ↗

The caret's paragraph and offset, or null when nothing is placed.

Compared by value, so a consumer re-renders only when the caret actually moves.

tsx const caret = useEditorCaret(); // …later, in a menu row that inserts at where the user was reading: insertCustomNode(editor, citation, attrs, label, caret ? { at: caret } : {});

declare function useEditorCaret(): EditorCaret | null;

useEditorColorModefunctionSource ↗

The theme the enclosing DocxEditor.Root resolved from its colorMode, so parts you build yourself can match the editor chrome. 'system' resolves to the operating system's current setting and re-renders when it changes. Outside a Root, or without colorMode, the answer is 'light'.

declare function useEditorColorMode(): UseEditorColorModeReturn;

```tsx
function MyPanel() {
  const { colorMode } = useEditorColorMode();
  return <aside className={colorMode === 'dark' ? 'panel panel--dark' : 'panel'} />;
}
```

useEditorCommandfunctionSource ↗

Bind a chrome slot ('text.bold', 'history.undo', …) or a raw EditorCommand ({ type: 'selectAll' }) to the editor. The result object is identity-stable while its fields are unchanged, so it can sit in dependency arrays and memo props without churn.

declare function useEditorCommand(target: ChromeSlotId | EditorCommand): EditorCommandState;

useEditorEventfunctionSource ↗

Subscribe to an editor event ('change', 'selectionChange', 'error', …) for the lifetime of the component. No-op until the nearest DocxEditor.Root has created the editor; resubscribes automatically when the instance is replaced.

declare function useEditorEvent<E extends keyof EditorEvents>(event: E, handler: EditorEvents[E]): void;

useEditorHostDocumentfunctionSource ↗

The document the editor's pages are mounted in: a pop-out window's or an iframe's when the host attached the editor there, otherwise the page's own. null during server rendering.

Custom chrome that adds document listeners, reads focus, or injects a <style> uses this instead of the global document, which belongs to the window the script runs in. The value changes when the editor moves to another window, so effects keyed on it re-bind. Its defaultView is the editor's window, for timers, viewport size and the clipboard.

declare function useEditorHostDocument(): UseEditorHostDocumentReturn;

```tsx
function ShortcutListener() {
  const hostDocument = useEditorHostDocument();
  useEffect(() => {
    if (!hostDocument) return;
    hostDocument.addEventListener('keydown', onShortcut);
    return () => hostDocument.removeEventListener('keydown', onShortcut);
  }, [hostDocument]);
  return null;
}
```

useEditorSnapshotfunctionSource ↗

Re-render the caller whenever the editor commits a change, moves the selection, or republishes display. Returns a counter that changes on each such event, so it can also be used as a dependency.

declare function useEditorSnapshot(editor: Editor | null): number;

useEditorStatefunctionSource ↗

Subscribe to a slice of the editor's read model. Re-renders the component ONLY when selector's result changes (by isEqual, default Object.is).

Before the editor exists — outside a DocxEditor.Root, pre-mount, and on the server — the selector receives a frozen loading snapshot (isLoading: true, page: {current: 0, total: 0}), never null.

declare function useEditorState<T>(selector: (snapshot: EditorSnapshot) => T, isEqual?: (a: T, b: T) => boolean, options?: UseEditorStateOptions): T;

useEditorValueCommandfunctionSource ↗

Bind a value slot. Font size values use half-points; colors use six digits without #.

declare function useEditorValueCommand<K extends keyof ToolbarValueMap>(slotId: K): EditorValueCommandState<ToolbarValueMap[K]>;

useFontFamilyfunctionSource ↗

The font-family picker's behavior, UI-free.

declare function useFontFamily(): UseFontFamilyResult;

useFontsfunctionSource ↗

Merge font origins into one stable value for DocxEditor.Root's fonts prop.

```tsx // The bundled substitutes: the families this document names, plus its default face. const fonts = useFonts(packagedFonts());

// The same, plus the Google catalog for everything they do not cover. const fonts = useFonts(packagedFonts(), googleFonts());

// Brand faces first, then whatever is left. const fonts = useFonts(brandFragment, packagedFonts());

return <DocxEditor.Root fonts={fonts}>{children}</DocxEditor.Root>; ```

EVERY argument takes the same union, so adding an origin is adding an argument and never a change of shape. Origins compose first-wins in argument order, exactly like composeFontConfiguration: the first argument beats later ones, and any of them beats a substitution for a family some origin supplies directly.

They resolve ONE AFTER ANOTHER, not concurrently, so that each can be told which faces the ones before it already cover and skip fetching them. That costs one extra origin's latency on the critical path and saves a duplicate download — and, for a network origin, a request that would have told a font host which families the document uses for nothing. Order origins cheapest-first.

The returned resolver never changes identity, so the editor is never rebuilt on account of this prop. Arguments are re-read when opening a document or requesting a new family. Changing them alone does not replace already loaded faces; reload the document for that.

It is marked (defineFontResolver), so it can itself be an origin of another list or useDocxSource's fonts option without being mistaken for a zero-argument loader.

declare function useFonts(source: FontsInput, ...fragments: readonly (FontConfigurationFragment | undefined)[]): MarkedFontResolver;

useFontsfunctionSource ↗

The uniform form: every position takes the same [FontOrigin](FontOrigin), so composing two resolvers is one extra argument.

A resolver in any position but the first must carry the defineFontResolver mark. The first position keeps the older, looser type so that every call that compiled before this overload existed still compiles.

declare function useFonts(...origins: readonly FontOrigin[]): MarkedFontResolver;

useGoToBookmarkfunctionSource ↗

Go To for bookmarks: filter by name, move through the offered rows, and jump.

declare function useGoToBookmark(options?: UseGoToBookmarkOptions): UseGoToBookmarkReturn;

useHeaderFooterStatefunctionSource ↗

Subscribe to getHeaderFooterState() with reference-stable results when unchanged.

declare function useHeaderFooterState(): HeaderFooterState | null;

useHighlightAtfunctionSource ↗

The topmost text highlight under the pointer, or null. Pass a set name to watch one set. R is your range type, so fields you added to your ranges come back typed on range.

declare function useHighlightAt<R extends HighlightRange = HighlightRange>(name?: string): HighlightHit<R> | null;

```tsx
const hit = useHighlightAt<GlossaryRange>('glossary');
return hit ? <Tooltip anchor={hit.rect}>{hit.range.definition}</Tooltip> : null;
```

useHighlightsfunctionSource ↗

Highlight text ranges as the named set while the component is mounted, and keep them current as the document changes. Returns what the last application resolved.

Use a unique name per hook: two hooks with the same name replace each other's ranges. Keep a function source stable with useCallback.

declare function useHighlights(name: string, source: HighlightSource, options?: HighlightOptions): HighlightResult;

```tsx
const findTerms = useCallback(
  (editor: Editor) => editor.findMatches(terms, { wholeWord: true }).flat(),
  [terms]
);
useHighlights('glossary', findTerms, { className: 'glossary-term' });
```

useHistoryGroupfunctionSource ↗

Bind a control's native gesture lifecycle. Apply values through the existing command hooks.

declare function useHistoryGroup(input: HistoryGroupBindingOptions): UseHistoryGroupReturn;

useHyperlinkPopupfunctionSource ↗

The hyperlink popover's behavior.

Inside DocxEditor.Root this is the SHARED state that DocxEditor.HyperLink renders, so a custom panel and the toolbar agree. Calling it marks the component as a view of that state: while one is mounted, link clicks, Ctrl/Cmd+K and the Insert link controls open it. Outside a root it is a standalone instance that registers with the engine itself — a host building its own link UI from scratch needs nothing else.

declare function useHyperlinkPopup(): UseHyperlinkPopupResult;

useHyperlinkPopupInstancefunctionSource ↗

A popover instance. active gates ENGINE REGISTRATION only — an instance created inside a provider still exists, it just does not compete for the surface's chrome handlers.

declare function useHyperlinkPopupInstance(active?: boolean): UseHyperlinkPopupResult;

useNavigationPanefunctionSource ↗

The navigation pane's behavior, with no UI attached: open state, the active tab, and the document displacement an open pane is entitled to.

DocxEditor.Navigation calls this and shares the result with its parts. Call it directly to drive a pane of your own.

declare function useNavigationPane(options?: UseNavigationPaneOptions): UseNavigationPaneResult;

useNavigationShiftfunctionSource ↗

The px the chrome is currently displaced by an open navigation pane. 0 when no pane is mounted, when it is closed, and whenever the left gutter was already wide enough.

declare function useNavigationShift(): number;

useNotePropertiesStatefunctionSource ↗

Subscribe to getNotePropertiesState() with reference-stable results when unchanged.

declare function useNotePropertiesState(): NotePropertiesState | null;

useNoteScopeStatefunctionSource ↗

Subscribe to the active note view scope with reference-stable results when unchanged.

declare function useNoteScopeState(): Extract<ViewScope, {
    kind: 'note';
}> | null;

useOpenFailurefunctionSource ↗

Reads the document the editor refused to open, for a host that shows it in its own UI, such as a toast. Pair it with openFailure={false} on <DocxEditor>, so the packaged dialog does not show as well. Call it inside a DocxEditor.Root.

tsx function OpenFailureToast() { const { failure, message, dismiss } = useOpenFailure(); if (!failure) return null; return <Toast title={message} detail={failure.code} onClose={() => dismiss(failure)} />; }

declare function useOpenFailure(options?: UseOpenFailureOptions): UseOpenFailureReturn;

usePageSetupfunctionSource ↗

The section's page setup — size, orientation, margins — plus the command to change it.

Reads snapshot().pageSetup, which is reference-stable across ticks that did not move the section, so a subscriber re-renders only when the page actually changes shape. In a multi-section document it reflects the CARET's section, as Word's ruler does.

declare function usePageSetup(): UsePageSetupReturn;

usePageSetupDialogfunctionSource ↗

Read the enclosing Page Setup dialog draft.

Call it in a child of the dialog. It does not open the dialog. To open the dialog from your own toolbar, keep its open state and render DocxEditor.PageSetupDialog with open and onClose. Take the button's enabled state from usePageSetup().isEnabled.

declare function usePageSetupDialog(): UsePageSetupDialogReturn;

useParagraphDialogfunctionSource ↗

Read the enclosing Paragraph Options draft.

Call it in a child of the dialog. It does not open the dialog. To open the dialog from your own toolbar, keep its open state and render DocxEditor.ParagraphDialog with open and onClose. Take the button's enabled state from useParagraphFormat().isEnabled.

declare function useParagraphDialog(): UseParagraphDialogReturn;

useParagraphFormatfunctionSource ↗

The selection's paragraph formatting, plus the command to change it.

apply sends ONE setParagraphFormat, so a dialog's worth of changes is one undo step and the page repaints once.

declare function useParagraphFormat(): UseParagraphFormatReturn;

useParagraphIndentfunctionSource ↗

The selection's paragraph indent — left, right, and the signed first line — plus the command to change it.

This is what DocxEditor.HorizontalRuler drives its four handles from. A host that wants its own indent chrome takes the hook and renders whatever it likes; the ruler's drag geometry is separately available as pure functions (dragIndent / handlePosition from the engine).

declare function useParagraphIndent(): UseParagraphIndentReturn;

useParagraphStylefunctionSource ↗

The paragraph-style picker's behavior, UI-free.

declare function useParagraphStyle(): UseParagraphStyleResult;

useReviewAuthorsfunctionSource ↗

Every author the review surface DRAWS, in Word's slot order, with the colour and style each resolves to. [] before an editor or document exists.

Both halves of review: authors of tracked changes first, numbered by where their first change appears, then authors who only commented. One person is one colour across the two. Once assigned, a slot stays with that author for the attached document session.

The complete attached-document roster. An author remains here while the current review view hides their revisions and comments, so reviewer chrome can turn them on again.

The array is reference-stable between changes (the facade caches per layout and colour state), so it is safe as a dependency and under useSyncExternalStore.

Pairs with the declarative components: read the roster here, declare the styling as <DocxEditor.AuthorStyle> elements.

tsx const authors = useReviewAuthors(); authors.map(({ author }) => ( <DocxEditor.AuthorStyle key={author} author={author} color={myTeam[author]?.color} /> ));

declare function useReviewAuthors(): readonly ReviewAuthorInfo[];

useReviewGutterfunctionSource ↗

The gutter the review rail reserves right now: nothing with no rail mounted, and the measured reviewGutter pair otherwise. The one source for the scroll container's paddings and both rulers.

The result is reference-stable — the pure function answers with one of four shared constants — and the hook stores THAT, never the raw width: a resize sweeps through hundreds of widths that all resolve to the same constant, and holding the width as state re-rendered every consumer (the review rail among them) once per pixel. Storing the derived constant lets the state setter bail on identity, so consumers re-render only when the reservation actually flips.

declare function useReviewGutter(): ReviewGutter;

useRevisionMarkupDialogfunctionSource ↗

Read the enclosing revision markup draft.

declare function useRevisionMarkupDialog(): UseRevisionMarkupDialogReturn;

useScopeClassNamefunctionSource ↗

The scope class a chrome part should add to its own root element: the class when nothing above it is scoped, an empty string when something already is.

tsx const scope = useScopeClassName(); <div className={${scope}docx-toolbar} />

Under a Root whose colorMode resolved dark, the class is 'docx-editor dark ', so a part you build with the editor's --doc-* tokens follows the editor theme.

Returns a trailing space so it concatenates cleanly, and '' collapses away.

declare function useScopeClassName(): '' | 'docx-editor ' | 'docx-editor dark ';

useScopedChromeAnchorfunctionSource ↗

Attach contextual chrome to a painted story instead of the top of the editor viewport.

The engine owns and may replace everything inside the paginated surface, so React cannot portal controls into a header, footer, or note node. This hook keeps the controls as a sibling overlay and derives only their screen placement from the current painted host.

declare function useScopedChromeAnchor(findAnchor: (viewport: HTMLElement) => HTMLElement | null, placement: ScopedChromeAnchorPlacement): ScopedChromeAnchor;

useSplitCellDialogfunctionSource ↗

Read the enclosing Split cells dialog draft.

declare function useSplitCellDialog(): UseSplitCellDialogReturn;

useTableBorderTargetLabelfunctionSource ↗

Resolved label for the active border target in the shared draft.

For custom table chrome that shows the current target name outside the packaged picker.

declare function useTableBorderTargetLabel(): string;

useTextFormFieldDialogfunctionSource ↗

Read the enclosing Field Options draft.

declare function useTextFormFieldDialog(): UseTextFormFieldDialogReturn;

useToolbarContextfunctionSource ↗

The toolbar root's published value. Internal: parts read it, hosts pass props.

declare function useToolbarContext(): ToolbarContextValue;

useToolbarLabelfunctionSource ↗

The label for an i18n key: the host's translation, else the locale catalogue.

declare function useToolbarLabel(): (key: string) => string;

useToolbarLabelForfunctionSource ↗

The label for an i18n key given a host resolver: the host's translation, else the locale catalogue. The toolbar ROOT needs this before it publishes its context, so the resolver is separate from the context read below — a raw key must never reach the DOM.

declare function useToolbarLabelFor(t: ToolbarTranslate | undefined): (key: string) => string;

useTranslationfunctionSource ↗

The active catalogue's t(), the catalogue itself, its language tag (_lang, en by default), which formats numbers the way the strings around them read, and the providers' writing direction (dir). dir is 'ltr' when the chrome inherits a right-to-left host page; useChromeDir() returns the direction a provider decided, or undefined then.

declare function useTranslation(): {
    t: TFunction;
    catalogue: LocaleStrings;
    lang: string;
    dir: 'ltr' | 'rtl';
};

useWatermarkfunctionSource ↗

The document watermark plus the command to change it.

declare function useWatermark(): UseWatermarkReturn;

useWatermarkDialogfunctionSource ↗

Read the enclosing Watermark dialog draft.

declare function useWatermarkDialog(): UseWatermarkDialogReturn;

useZoomfunctionSource ↗

Read and drive the document's zoom.

tsx const { zoom, isFit, auto, zoomIn } = useZoom(); <button onClick={auto} aria-pressed={isFit}>Fit</button> <span>{Math.round(zoom * 100)}%</span>

Outside a DocxEditor.Root — and before the editor is created — this reports 100% fixed and every action is a no-op, so a control can render unconditionally.

declare function useZoom(): UseZoomResult;

VerticalRulerfunctionSource ↗

declare function VerticalRuler(input: VerticalRulerProps): react__default.ReactElement;

BookmarkDialogFieldsinterfaceSource ↗

The Bookmark dialog's draft.

interface BookmarkDialogFields

CompareDocumentsDialogValuesinterfaceSource ↗

The Compare documents draft.

interface CompareDocumentsDialogValues

ContentControlActionPropsinterfaceSource ↗

Props for action parts that also take an icon.

interface ContentControlActionProps extends ContentControlPartProps

ContentControlInspectorStateinterfaceSource ↗

Live inspector model for the control at the caret.

locked is the content-edit axis. Removal lock is reported separately via removalLocked from the boundary's effective lock / surface disabled reason.

interface ContentControlInspectorState

ContentControlPartPropsinterfaceSource ↗

Shared props for every part.

interface ContentControlPartProps

ContentControlPropsinterfaceSource ↗

Props for DocxEditor.ContentControl.

interface ContentControlProps extends ContentControlPartProps

ContentControlWidgetDayPropsinterfaceSource ↗

Props for one calendar cell.

interface ContentControlWidgetDayProps extends DocxEditorContentControlWidgetPartProps

ContentControlWidgetEntryinterfaceSource ↗

One selectable entry of a dropdown or combo-box control.

interface ContentControlWidgetEntry

ContentControlWidgetItemPropsinterfaceSource ↗

Props for one list entry.

interface ContentControlWidgetItemProps extends DocxEditorContentControlWidgetPartProps

ContentControlWidgetPicturePropsinterfaceSource ↗

Props for the picture file input.

interface ContentControlWidgetPictureProps extends DocxEditorContentControlWidgetPartProps

ContextMenuAnchorinterfaceSource ↗

Where the panel opened, in client coordinates.

interface ContextMenuAnchor

ContextMenuCommandPropsinterfaceSource ↗

Props for a packaged context-menu row.

interface ContextMenuCommandProps

ContextMenuContextValueinterfaceSource ↗

interface ContextMenuContextValue

ContextMenuItemPropsinterfaceSource ↗

Props for DocxEditor.ContextMenu.Item: a host-owned row.

interface ContextMenuItemProps

ContextMenuTableRowPropsinterfaceSource ↗

Props for packaged table context-menu rows.

interface ContextMenuTableRowProps extends ContextMenuCommandProps

DialogCustomizationPropsinterfaceSource ↗

Layout customization for a packaged dialog.

interface DialogCustomizationProps

DialogPartPropsinterfaceSource ↗

Presentation overrides for a dialog part.

Anything beyond these members reaches the rendered element, so a part takes an id, an aria-* label or a data-* test hook. The part's own wiring wins every collision: a host cannot replace Apply's handler or its data-docx-part marker by passing one. To own the element and its handler outright, pass asChild and supply your own.

interface DialogPartProps

DocxEditorAuthorStylePropsinterfaceSource ↗

Props for DocxEditor.AuthorStyle: one author, and the [RevisionAuthorStyle](RevisionAuthorStyle) fields to apply — color (document ink and the review chrome's accent), background (the wash), activeBackground (the open change's band), spanClassName (classes on the painted spans), and avatarUrl.

interface DocxEditorAuthorStyleProps extends RevisionAuthorStyle

DocxEditorBookmarkDialogPropsinterfaceSource ↗

Props for DocxEditor.BookmarkDialog.

interface DocxEditorBookmarkDialogProps extends DialogCustomizationProps

DocxEditorCompareDocumentsDialogPropsinterfaceSource ↗

Compare documents session and presentation.

interface DocxEditorCompareDocumentsDialogProps extends DialogCustomizationProps

DocxEditorContentControlNamespaceinterfaceSource ↗

The content-control inspector compound. Parts live on the namespace statics.

interface DocxEditorContentControlNamespace

DocxEditorContentControlWidgetNamespaceinterfaceSource ↗

The compound pop-up with its parts attached as statics.

interface DocxEditorContentControlWidgetNamespace

DocxEditorContentControlWidgetPartPropsinterfaceSource ↗

Presentation overrides for a value pop-up part.

Anything beyond these members reaches the rendered element, so a part takes an id, an aria-* label or a data-* test hook. The part's own wiring wins every collision. Pass asChild to own the element outright and keep its behavior.

interface DocxEditorContentControlWidgetPartProps

DocxEditorContentControlWidgetPropsinterfaceSource ↗

Value-widget session and optional replacement controls.

interface DocxEditorContentControlWidgetProps

DocxEditorContentPropsinterfaceSource ↗

Props for DocxEditor.Content.

interface DocxEditorContentProps

DocxEditorContextMenuNamespaceinterfaceSource ↗

DocxEditor.ContextMenu with its rows attached as statics.

interface DocxEditorContextMenuNamespace

DocxEditorContextMenuPropsinterfaceSource ↗

Props for DocxEditor.ContextMenu.

interface DocxEditorContextMenuProps

DocxEditorDocumentOutlinePropsinterfaceSource ↗

Props for the context-fed outline part.

interface DocxEditorDocumentOutlineProps

DocxEditorExportDialogPropsinterfaceSource ↗

State and presentation for the File menu export dialog.

interface DocxEditorExportDialogProps

DocxEditorFontNoticePropsinterfaceSource ↗

Props for DocxEditor.FontNotice.

interface DocxEditorFontNoticeProps

DocxEditorHeaderFooterChromePropsinterfaceSource ↗

Props for DocxEditor.HeaderFooterChrome.

interface DocxEditorHeaderFooterChromeProps

DocxEditorHyperLinkNamespaceinterfaceSource ↗

The link popover compound.

interface DocxEditorHyperLinkNamespace

DocxEditorImageAltTextPopupPropsinterfaceSource ↗

State and actions for the image alt-text panel.

interface DocxEditorImageAltTextPopupProps

DocxEditorImageInsertErrorDialogPropsinterfaceSource ↗

Why a picture could not be inserted. Replace it through popups.imageInsertError, or pass false there to show nothing.

interface DocxEditorImageInsertErrorDialogProps

DocxEditorImagePropertiesDialogPropsinterfaceSource ↗

Props for DocxEditor.ImagePropertiesDialog.

interface DocxEditorImagePropertiesDialogProps

DocxEditorInvalidTextFormFieldDialogPropsinterfaceSource ↗

Invalid-value acknowledgement with editor-owned clearing and focus restoration.

interface DocxEditorInvalidTextFormFieldDialogProps

DocxEditorLoadingComponentinterfaceSource ↗

The loading part with the packaged spinner attached as a static.

interface DocxEditorLoadingComponent

DocxEditorLoadingPropsinterfaceSource ↗

Props for DocxEditor.Loading.

interface DocxEditorLoadingProps

DocxEditorLoadingSpinnerPropsinterfaceSource ↗

Props for DocxEditor.Loading.Spinner.

interface DocxEditorLoadingSpinnerProps

DocxEditorMenuNamespaceinterfaceSource ↗

The menu bar with its parts attached as statics.

interface DocxEditorMenuNamespace

DocxEditorMenuPropsinterfaceSource ↗

Props for DocxEditor.Menu.

interface DocxEditorMenuProps

DocxEditorNamespaceinterfaceSource ↗

The composed editor component with its composition primitives attached as statics, so <DocxEditor.Root>, <DocxEditor.Viewport>, and <DocxEditor.Content> work without extra imports.

interface DocxEditorNamespace extends ForwardRefExoticComponent<DocxEditorProps & RefAttributes<DocxEditorRef>>

DocxEditorNavigationNamespaceinterfaceSource ↗

DocxEditor.Navigation with its parts attached as statics.

interface DocxEditorNavigationNamespace

DocxEditorNavigationPropsinterfaceSource ↗

Props for DocxEditor.Navigation.

interface DocxEditorNavigationProps extends UseNavigationPaneOptions

DocxEditorNotePreviewPropsinterfaceSource ↗

Note hover preview content and viewport coordinates.

interface DocxEditorNotePreviewProps

DocxEditorNotePropertiesDialogPropsinterfaceSource ↗

Properties actions for a note settings dialog.

interface DocxEditorNotePropertiesDialogProps

DocxEditorNotesChromePropsinterfaceSource ↗

Props for DocxEditor.NotesChrome.

interface DocxEditorNotesChromeProps

DocxEditorNotesContextMenuPropsinterfaceSource ↗

Note menu target, viewport coordinates, command gates, and actions.

interface DocxEditorNotesContextMenuProps

DocxEditorOpenFailureActionPropsinterfaceSource ↗

Props for DocxEditor.OpenFailure.Action.

interface DocxEditorOpenFailureActionProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'>

DocxEditorOpenFailureComponentinterfaceSource ↗

The open-failure part with its button attached as a static.

interface DocxEditorOpenFailureComponent

DocxEditorOpenFailureContextinterfaceSource ↗

What actions and children receive.

interface DocxEditorOpenFailureContext

DocxEditorOpenFailurePropsinterfaceSource ↗

Props for DocxEditor.OpenFailure.

interface DocxEditorOpenFailureProps

DocxEditorPageNumberPropsinterfaceSource ↗

Props for DocxEditor.PageNumber.

interface DocxEditorPageNumberProps

DocxEditorPageSetupDialogPropsinterfaceSource ↗

Props for DocxEditor.PageSetupDialog.

interface DocxEditorPageSetupDialogProps extends DialogCustomizationProps

DocxEditorParagraphDialogPropsinterfaceSource ↗

Props for DocxEditor.ParagraphDialog.

interface DocxEditorParagraphDialogProps extends DialogCustomizationProps

DocxEditorPopupsinterfaceSource ↗

Render overrides for automatically mounted editor popups. false disables automatic rendering.

interface DocxEditorPopups

DocxEditorPrintDialogPropsinterfaceSource ↗

State and presentation for the File menu print dialog.

interface DocxEditorPrintDialogProps

DocxEditorPropsinterfaceSource ↗

Props for the React DocxEditor. The adapter is a thin renderer over the Editor contract; it holds no editing-engine state of its own and never imports ProseMirror or OOXML feature logic.

interface DocxEditorProps

DocxEditorRefinterfaceSource ↗

The imperative handle, identical on both adapters (enforced by bun run check:parity-contract). Every member forwards to the Editor facade and is safe to call before the editor has mounted — mutations no-op, reads return the honest empty answer (null, a notFound refusal, a loading snapshot) — so a host can hold the ref from first render without guarding it.

The ref deliberately stays small: everything else (zoom, paging, formatting queries, document state) is reachable through the full facade via getEditor, so the ref never mirrors capabilities the Editor contract already names.

interface DocxEditorRef

DocxEditorRevisionMarkupDialogPropsinterfaceSource ↗

Revision markup session and presentation.

interface DocxEditorRevisionMarkupDialogProps extends DialogCustomizationProps

DocxEditorRevisionMarkupPropsinterfaceSource ↗

Viewer-local markup declarations.

interface DocxEditorRevisionMarkupProps extends RevisionMarkupOptions

DocxEditorRootListenersinterfaceSource ↗

Vue-only lifecycle listeners; exported for cross-adapter API parity.

interface DocxEditorRootListeners

DocxEditorRootPropsinterfaceSource ↗

Props for DocxEditor.Root. document and imageDecodePort identity changes remount the editor. Changing fontShaping.maxFontBytes also remounts. Later fonts, author, locale, mode, translate, zoom, and zoomMode changes use instance setters, so edits, selection and undo history survive them. modules is sampled at mount only.

interface DocxEditorRootProps

DocxEditorRulerPropsinterfaceSource ↗

Props for the context-fed ruler parts.

interface DocxEditorRulerProps

DocxEditorSplitCellDialogPropsinterfaceSource ↗

Props for DocxEditor.SplitCellDialog.

interface DocxEditorSplitCellDialogProps extends DialogCustomizationProps

DocxEditorTextFormFieldDialogPropsinterfaceSource ↗

Field Options session and presentation.

interface DocxEditorTextFormFieldDialogProps extends DialogCustomizationProps

DocxEditorToolbarGroupPropsinterfaceSource ↗

Props for DocxEditor.Toolbar.Group.

interface DocxEditorToolbarGroupProps

DocxEditorToolbarNamespaceinterfaceSource ↗

The toolbar with its parts attached as statics.

interface DocxEditorToolbarNamespace

DocxEditorToolbarPropsinterfaceSource ↗

Props for DocxEditor.Toolbar.

interface DocxEditorToolbarProps

DocxEditorToolbarSlotPropsinterfaceSource ↗

Props for DocxEditor.Toolbar.Slot.

interface DocxEditorToolbarSlotProps

DocxEditorUnsupportedElementPropsinterfaceSource ↗

Props for a registered unsupported-content renderer.

interface DocxEditorUnsupportedElementProps extends UnsupportedElementRule

DocxEditorViewportPropsinterfaceSource ↗

Props for DocxEditor.Viewport.

interface DocxEditorViewportProps

DocxEditorWatermarkDialogPropsinterfaceSource ↗

Props for DocxEditor.WatermarkDialog.

interface DocxEditorWatermarkDialogProps extends DialogCustomizationProps

DocxEditorWindowPropsinterfaceSource ↗

Props for DocxEditor.Window.

interface DocxEditorWindowProps

EditorCaretinterfaceSource ↗

A caret position: a paragraph and a UTF-16 offset inside it — the shape the write APIs take as their at.

interface EditorCaret

EditorCommandStateinterfaceSource ↗

The live state of one editor control, plus its action.

interface EditorCommandState

EditorValueCommandStateinterfaceSource ↗

Live state and typed execution for a value control.

interface EditorValueCommandState<T extends string | number>

FontFamilyItemPropsinterfaceSource ↗

Props for FontFamily.Item.

interface FontFamilyItemProps extends FontFamilyPartProps

FontFamilyNamespaceinterfaceSource ↗

The compound part with its sub-parts attached as statics.

interface FontFamilyNamespace

FontFamilyPartPropsinterfaceSource ↗

Props for DocxEditorToolbar.FontFamily and its sub-parts.

interface FontFamilyPartProps

FontFamilyPropsinterfaceSource ↗

Props for the compound root.

interface FontFamilyProps extends FontFamilyPartProps

FontOptioninterfaceSource ↗

Shared FontOption shape + normaliser used by FontPicker components in both adapters. Lifted from packages/react/src/components/ui/ normalizeFontFamilies.ts so the type definition has a single home.

interface FontOption

HorizontalRulerPropsinterfaceSource ↗

interface HorizontalRulerProps$1

HyperLinkActionPropsinterfaceSource ↗

Props for the action parts, which also take an icon.

interface HyperLinkActionProps extends HyperLinkPartProps

HyperLinkPartPropsinterfaceSource ↗

Shared props for every part.

interface HyperLinkPartProps

HyperlinkPopupAnchorinterfaceSource ↗

Where the popover sits, in viewport coordinates.

interface HyperlinkPopupAnchor

HyperlinkPopupStateinterfaceSource ↗

The popover's observable state.

interface HyperlinkPopupState

HyperLinkPropsinterfaceSource ↗

Props for DocxEditor.HyperLink.

interface HyperLinkProps extends HyperLinkPartProps

ImagePropertiesTriggerPropsinterfaceSource ↗

Props for the toolbar properties trigger.

interface ImagePropertiesTriggerProps

IndentUpdateinterfaceSource ↗

The fields apply accepts — twips throughout, like every other read shape here.

Omitted fields are left as authored; null CLEARS one, so the paragraph falls back to its style. That is a different thing from zero, which blocks the cascade — the same distinction setParagraphSpacing draws.

firstLine is ONE SIGNED offset from the left indent: negative IS the hanging indent. OOXML spells it as two mutually exclusive attributes, and a caller should not have to know which of them wins.

interface IndentUpdate

ListStateinterfaceSource ↗

interface ListState

LocaleProviderPropsinterfaceSource ↗

interface LocaleProviderProps

MenuActionPropsinterfaceSource ↗

Props for the pinned File rows.

interface MenuActionProps

MenuGroupPropsinterfaceSource ↗

Props for DocxEditor.Menu.Group: a titled section of rows.

interface MenuGroupProps

MenuItemBasePropsinterfaceSource ↗

The props every Menu.Item takes besides the slot it names.

interface MenuItemBaseProps

MenuItemPropsinterfaceSource ↗

Props for DocxEditor.Menu.Item: one chrome slot as a menu row. Set slotId. A row with neither slotId nor the deprecated slot renders nothing, with a development warning. An interface, so a host can extend it.

interface MenuItemProps extends MenuItemBaseProps

MenuPartComponentinterfaceSource ↗

A menu pinned to one registry id, for DocxEditor.Menu.File and friends.

interface MenuPartComponent

MenuPropsinterfaceSource ↗

Props for DocxEditor.Menu.Menu and the five pinned menu parts.

interface MenuProps

MenuReportIssuePropsinterfaceSource ↗

Props for DocxEditor.Menu.ReportIssue.

interface MenuReportIssueProps

MenuRowPropsinterfaceSource ↗

Props for DocxEditor.Menu.Row: one presentational menu row.

interface MenuRowProps

MenuSeparatorPropsinterfaceSource ↗

Props for DocxEditor.Menu.Separator.

interface MenuSeparatorProps

MenuSubmenuBasePropsinterfaceSource ↗

The props every Menu.Submenu takes besides its label.

interface MenuSubmenuBaseProps

MenuSubmenuPropsinterfaceSource ↗

Props for DocxEditor.Menu.Submenu. Set labelKey or label. A submenu with neither has no name, with a development warning. An interface, so a host can extend it.

interface MenuSubmenuProps extends MenuSubmenuBaseProps

MenuTableGridPropsinterfaceSource ↗

Props for DocxEditor.Menu.TableGrid.

interface MenuTableGridProps

NavigationPartPropsinterfaceSource ↗

Shared props for the pane's structural parts.

interface NavigationPartProps

NavigationShiftInputinterfaceSource ↗

interface NavigationShiftInput

NavigationTabPropsinterfaceSource ↗

Props for one tab.

interface NavigationTabProps extends NavigationPartProps

OutlineHeadingIteminterfaceSource ↗

A heading plus how deep to indent it in a rendered list.

interface OutlineHeadingItem

PageIndicatorPropsinterfaceSource ↗

interface PageIndicatorProps

PageSetupDialogFieldsinterfaceSource ↗

Draft page dimensions and margins use twips.

interface PageSetupDialogFields

PageSetupUpdateinterfaceSource ↗

The fields apply accepts — twips throughout, like every read shape. Omitted fields are left as authored. scope is Word's "Apply to": 'document' (the default) writes every section, 'section' only the one the selection is in.

interface PageSetupUpdate

PaginatedDocxEditorHandleinterfaceSource ↗

What a host can drive from outside.

Commands only. There is no accessor for the document or the layout, because a caller holding either could act on a revision the model has already left behind.

interface PaginatedDocxEditorHandle