Skip to main content

@lexical/react/LexicalComposer

Type Aliases

InitialConfigType

InitialConfigType = Readonly<{ editable?: boolean; editorState?: InitialEditorStateType; html?: HTMLConfig; namespace: string; nodes?: readonly (Klass<LexicalNode> | LexicalNodeReplacement)[]; onError: (error, editor) => void; onWarn?: (error, editor) => void; theme?: EditorThemeClasses; }>

Defined in: packages/lexical-react/src/LexicalComposer.tsx:74

The configuration passed to LexicalComposer via its initialConfig prop. It is read once when the editor is created and describes the editor's namespace, registered nodes, theme, error handling, initial editable state, optional initial InitialEditorStateType, and HTML import/export configuration.


InitialEditorStateType

InitialEditorStateType = null | string | EditorState | ((editor) => void)

Defined in: packages/lexical-react/src/LexicalComposer.tsx:61

The initial editor state accepted by LexicalComposer via initialConfig.editorState. Each variant is handled differently:

  • null — skip default initialization entirely. The root is left with no children for an external owner (typically the collaboration plugin and its Yjs document) to populate.
  • string — a JSON string produced by serializing an EditorState. Parsed with LexicalEditor.parseEditorState and applied via LexicalEditor.setEditorState.
  • EditorState — applied directly via LexicalEditor.setEditorState.
  • (editor) => void — an updater run inside editor.update(...). Invoked only when the root is still empty, so it will not overwrite content bootstrapped by another mechanism, and is silently skipped if the root already has children.

Note that string and EditorState inputs go through setEditorState, which throws when the parsed state satisfies EditorState.isEmpty() (root with no children and no selection). The empty serialization produced by initializing with null and never modifying the editor falls into this category, so it cannot be re-applied via setEditorState after a round-trip.

Functions

LexicalComposer()

LexicalComposer(__namedParameters): Element

Defined in: packages/lexical-react/src/LexicalComposer.tsx:122

The root component for a Lexical editor in React. It creates a LexicalEditor from initialConfig, provides it (and its LexicalComposerContextType) to descendants through React context, and renders its children. Place plugins and UI such as RichTextPlugin and ContentEditable inside it, and read the editor from descendants with useLexicalComposerContext.

LexicalComposer uses the legacy plugin pattern and does not support the extension API. To build an editor from extensions, use LexicalExtensionComposer instead; see the React extensions guide.

Parameters

__namedParameters

Props

Returns

Element

A context provider wrapping children.