Plugins

Plugins are React components placed inside the EditorProvider, and are primarily used to register Behaviors ad-hoc in the Editor using the editor.registerBehavior(...) API:

function LogTextPlugin() {
  const editor = useEditor()

  useEffect(() => {
    const unregisterBehavior = editor.registerBehavior({
      behavior: defineBehavior({
        on: 'insert.text',
        actions: [
          ({event}) => [
            {
              type: 'effect',
              effect: () => {
                console.log(event)
              },
            },
            {
              type: 'forward',
              event,
            },
          ],
        ],
      }),
    })

    return () => {
      unregisterBehavior()
    }
  }, [editor])

  return null
}

Available plugins

@portabletext/plugin-character-pair-decorator Automatically match a pair of characters and decorate the text in between.

@portabletext/plugin-emoji-picker Easily configure an Emoji Picker for the Portable Text Editor.

@portabletext/plugin-input-rule Easily configure Input Rules in the Portable Text Editor.

@portabletext/plugin-markdown-shortcuts Adds helpful Markdown shortcuts to the editor.

@portabletext/plugin-one-line Restricts the Portable Text Editor to a single line.

@portabletext/plugin-paste-link Allows pasting links in the Portable Text Editor

@portabletext/plugin-sdk-value Connects a Portable Text Editor with a Sanity document using the SDK.

@portabletext/plugin-typeahead-picker Generic typeahead picker infrastructure for the Portable Text Editor.

@portabletext/plugin-typography Automatically transform text to typographic variants.