Skip to content

Editor API Overview

The editor API provides access to the editor instance and selectors for deriving state.

Use the following hooks to access the editor from within your components.

useEditor

Access the editor instance. Commonly used when building toolbars or passing snapshot to selectors.

import {useEditor} from '@portabletext/editor'
const editor = useEditor()

useEditorSelector

Access selectors in areas where the snapshot is available by combining with useEditor.

import {useEditor, useEditorSelector} from '@portabletext/editor'
import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.isActiveDecorator('em'))