Skip to main content

@lexical/a11y

Interfaces​

AriaLiveRegionExtensionConfig​

Defined in: packages/lexical-a11y/src/index.ts:456

Properties​

owner​

owner: HTMLElement | null

Defined in: packages/lexical-a11y/src/index.ts:464

Owner element to append the live region to. null falls back to document.body; an explicit element keeps the region in the same accessibility subtree as the editor (shadow root or portaled overlay).

politeness​

politeness: AriaPoliteness

Defined in: packages/lexical-a11y/src/index.ts:458

AriaPoliteness for the mounted region.

EditorModeAnnounceExtensionConfig​

Defined in: packages/lexical-a11y/src/index.ts:628

Properties​

disabled​

disabled: boolean

Defined in: packages/lexical-a11y/src/index.ts:638

When true, editable / read-only transitions are not announced. Toggle at runtime via the output signal. Default false. Announcements are transition-based (like the initial mount, which is silent), so toggling disabled back to false while the editor is already read-only does not re-announce the current mode — the next setEditable transition does.

editable​

editable: string

Defined in: packages/lexical-a11y/src/index.ts:630

Message announced when the editor becomes editable.

readOnly​

readOnly: string

Defined in: packages/lexical-a11y/src/index.ts:632

Message announced when the editor becomes read-only.

FocusManagerOptions​

Defined in: packages/lexical-a11y/src/index.ts:368

Properties​

toolbarItemSelector?​

optional toolbarItemSelector?: string

Defined in: packages/lexical-a11y/src/index.ts:375

Selector used to find the toolbar's first focusable item when activating via the shortcut. Defaults to non-disabled direct-child buttons (the same scope used by registerRovingTabIndex), so the active roving item naturally receives focus.

FocusTrapOptions​

Defined in: packages/lexical-a11y/src/index.ts:96

Properties​

allowOutside?​

optional allowOutside?: (target) => boolean

Defined in: packages/lexical-a11y/src/index.ts:115

Predicate that exempts an element from the pull-back. When it returns true for event.target, the focusin handler lets focus stay outside the container. Useful for portaled panels (e.g. autocomplete popups) that live outside the trap container yet logically belong to it.

Parameters​
target​

HTMLElement

Returns​

boolean

initialFocus?​

optional initialFocus?: FocusTrapInitialFocus

Defined in: packages/lexical-a11y/src/index.ts:107

Where to land focus when the trap activates:

  • 'firstFocusable' (default): focus the first focusable descendant.
  • 'container': focus the container itself. The container must satisfy tabIndex >= -1; callers typically set tabIndex={-1} to keep it out of the natural Tab order while remaining programmatically focusable. Use for dialogs whose first focusable is a dismiss/close action so the user lands on the dialog body and screen readers announce the dialog label before any control.

HistoryAnnounceExtensionConfig​

Defined in: packages/lexical-a11y/src/index.ts:573

Properties​

disabled​

disabled: boolean

Defined in: packages/lexical-a11y/src/index.ts:580

When true, undo / redo are not announced. Toggle at runtime via the output signal. Default false.

redone​

redone: string

Defined in: packages/lexical-a11y/src/index.ts:577

Message announced after a redo.

undone​

undone: string

Defined in: packages/lexical-a11y/src/index.ts:575

Message announced after an undo.

RovingTabIndexOptions​

Defined in: packages/lexical-a11y/src/index.ts:226

Properties​

itemSelector?​

optional itemSelector?: string

Defined in: packages/lexical-a11y/src/index.ts:239

Selector for the group's roving items. The default matches direct-child non-disabled buttons. Pass a custom selector to include other focusables or to scope to a marker attribute (e.g. [data-roving-item]).

orientation?​

optional orientation?: RovingOrientation

Defined in: packages/lexical-a11y/src/index.ts:233

Which arrow keys move focus.

  • horizontal (default): ArrowLeft / ArrowRight
  • vertical: ArrowUp / ArrowDown
  • both: any arrow key

Type Aliases​

AriaLiveRegion​

AriaLiveRegion = NamedSignalsOutput<AriaLiveRegionExtensionConfig> & object

Defined in: packages/lexical-a11y/src/index.ts:474

Public output of AriaLiveRegionExtension. The politeness and owner config values are exposed as runtime-tunable signals — setting politeness updates the mounted region's aria-live, setting owner re-mounts the region — alongside a stable announce sink that is valid for the editor's lifetime (callers never see the region element or its disposal).

Type Declaration​

announce​

announce: (message) => void

Write a message into the editor's live region. Announcing the same string back-to-back appends a zero-width space so screen readers register the change and re-announce. A no-op until a region is mounted (the editor has a root element, or an owner is configured).

Parameters​
message​

string

Returns​

void

AriaPoliteness​

AriaPoliteness = "polite" | "assertive"

Defined in: packages/lexical-a11y/src/index.ts:33

ContainerRegistry​

ContainerRegistry<Options> = RefCountedRegistry<HTMLElement, Options>

Defined in: packages/lexical-a11y/src/index.ts:682

The public output of the focus-trap, roving-tabindex and focus-manager extensions: register a container (reference counted) and get back an idempotent disposer. Callers register through this method instead of a mutable map and never see the container bookkeeping. It is the core RefCountedRegistry keyed by HTMLElement.

Each extension creates the registry in build (where the editor is available for the per-container activation) and disposes it on register teardown via RefCountedRegistry.dispose.

Type Parameters​

Options​

Options

FocusTrapInitialFocus​

FocusTrapInitialFocus = "firstFocusable" | "container"

Defined in: packages/lexical-a11y/src/index.ts:94

RovingOrientation​

RovingOrientation = "horizontal" | "vertical" | "both"

Defined in: packages/lexical-a11y/src/index.ts:224

Variables​

AriaLiveRegionExtension​

const AriaLiveRegionExtension: LexicalExtension<AriaLiveRegionExtensionConfig, "@lexical/a11y/AriaLiveRegion", AriaLiveRegion, Signal<string>>

Defined in: packages/lexical-a11y/src/index.ts:503

Platform-independent extension that owns a single aria-live region for the editor and exposes a stable AriaLiveRegion sink as its output. Other a11y extensions (HistoryAnnounceExtension, EditorModeAnnounceExtension) depend on it and announce through output.announce.

The sink writes to a private message signal created in init. The politeness / owner config are exposed as signals (via namedSignals). register tracks the editor's root element reactively and runs three effects: one creates / disposes the region element as the root document (or owner) changes, one applies the current politeness to the mounted region, and one mirrors the current message into it. Buffering through signals decouples the stable announce (from build) from the region element — which comes and goes with the root — and creates the region in the editor's own document (e.g. an iframe-portaled editor) rather than the top-level document.

EditorModeAnnounceExtension​

const EditorModeAnnounceExtension: LexicalExtension<EditorModeAnnounceExtensionConfig, "@lexical/a11y/EditorModeAnnounce", NamedSignalsOutput<EditorModeAnnounceExtensionConfig>, unknown>

Defined in: packages/lexical-a11y/src/index.ts:646

Platform-independent extension that announces editor.setEditable(true|false) transitions through the AriaLiveRegionExtension's shared sink.

FocusManagerExtension​

const FocusManagerExtension: LexicalExtension<ExtensionConfigBase, "@lexical/a11y/FocusManager", ContainerRegistry<FocusManagerOptions>, unknown>

Defined in: packages/lexical-a11y/src/index.ts:719

Platform-independent extension that wires the editor-to-toolbar focus jump (Alt+F10 / Escape return) on one or more toolbars. Register a toolbar through the extension output (ContainerRegistry.register); the React adapter is useLexicalFocusManagerRef from @lexical/react.

FocusTrapExtension​

const FocusTrapExtension: LexicalExtension<ExtensionConfigBase, "@lexical/a11y/FocusTrap", ContainerRegistry<FocusTrapOptions>, unknown>

Defined in: packages/lexical-a11y/src/index.ts:693

Platform-independent extension that traps Tab / Shift+Tab focus inside one or more containers. Register a container through the extension output (ContainerRegistry.register); the React adapter is useLexicalFocusTrapRef from @lexical/react.

HistoryAnnounceExtension​

const HistoryAnnounceExtension: LexicalExtension<HistoryAnnounceExtensionConfig, "@lexical/a11y/HistoryAnnounce", NamedSignalsOutput<HistoryAnnounceExtensionConfig>, unknown>

Defined in: packages/lexical-a11y/src/index.ts:587

Platform-independent extension that announces undo / redo through the AriaLiveRegionExtension's shared sink.

RovingTabIndexExtension​

const RovingTabIndexExtension: LexicalExtension<ExtensionConfigBase, "@lexical/a11y/RovingTabIndex", ContainerRegistry<RovingTabIndexOptions>, unknown>

Defined in: packages/lexical-a11y/src/index.ts:706

Platform-independent extension that wires the WAI-ARIA roving-tabindex pattern on one or more containers. Register a container through the extension output (ContainerRegistry.register); the React adapter is useLexicalRovingTabIndexRef from @lexical/react.