CoreHooks
useEditorState
Reactive editor state hook for tracking editor emptiness
useEditorState provides a reactive isEmpty flag that updates whenever the editor content changes.
Import
import { useEditorState } from '@typix-editor/react';Usage
function SubmitButton() {
const { isEmpty } = useEditorState();
return (
<button disabled={isEmpty}>
Submit
</button>
);
}Return value
| Property | Type | Description |
|---|---|---|
isEmpty | boolean | Whether the editor content is empty (reactive) |
isEmpty behavior
The isEmpty flag updates reactively whenever the editor content changes. It uses Lexical's $isRootTextContentEmpty to determine if the editor has any text content.
Accessing the Lexical editor
If you need the raw Lexical editor instance, use useTypixEditor instead:
const editor = useTypixEditor();
const lexical = editor.lexical; // LexicalEditorSee useTypixEditor for more details.
Requirements
Must be used inside a LexicalComposer (which EditorRoot sets up automatically).