slash-editor
API Reference

@slash-editor/react

Hooks and headless primitives over @tiptap/react.

Every hook here composes a core extension's editor.storage (subscribe/state) with the extension's own commands — none owns behavior the core doesn't already expose.

useSlashEditor

useSlashEditor(options?: UseSlashEditorOptions): Editor | null

Extends @tiptap/react's useEditor options with two fields:

OptionTypeDescription
blockKit?BlockKitOptions | falseBaseline block schema options, or false to start from an empty schema and supply everything through extensions. See the block kit guide.
extensions?ExtensionsExtensions appended after the block kit.

Every other option passes through to useEditor. Two defaults differ: immediatelyRender: false (so the same component renders under SSR without a hydration mismatch), and extensions are resolved once per editor instance — ProseMirror cannot swap a schema on a live document, so later changes to blockKit/extensions are ignored rather than silently half-applied.

useSlashMenu

useSlashMenu(editor: Editor | null): SlashMenu

Exposes the slash command's ranked state plus a caret anchor:

interface SlashMenu {
  open: boolean;
  query: string;
  items: SlashItem[];
  activeIndex: number;
  activeItem: SlashItem | null;
  anchor: SlashMenuAnchor | null;
  setActiveIndex: (index: number) => void;
  select: (index?: number) => void;
  close: () => void;
}

useBubbleToolbar

useBubbleToolbar(editor: Editor | null): BubbleToolbar

Selection-anchored formatting state — items already filtered by each item's when.

useMention

useMention(editor: Editor | null): MentionMenu

Same subscribe/setActiveIndex/select/close shape as useSlashMenu, plus loading while the async provider's promise for the current query is in flight. See the mentions guide.

useLinkEditor

useLinkEditor(editor: Editor | null): LinkEditor

Owns only visibility and a draft href — applying or removing the link calls the link mark's own setLink/unsetLink directly.

useComments

useComments(editor: Editor | null, options?: UseCommentsOptions): Comments

Prop

Type

See the comments guide for the CommentThreadStore contract store expects.

usePresence

usePresence(provider: PresenceProvider | null): PresencePeer[]

Reads any awareness-shaped provider — the same duck-typed surface collaboration uses — into a plain array of connected peers.

useActiveItemScroll

useActiveItemScroll(options: ActiveItemScrollOptions): void

Prop

Type

Keeps a menu's active row scrolled into view as activeIndex changes — used by both Slash Menu and Mention Menu.

useBlockDrag

useBlockDrag(editor: Editor | null): BlockDrag

Drag/insert-handle state consumed by Block Handle.

Re-exported from @tiptap/react

EditorContent, EditorContext, EditorProvider, useCurrentEditor, useEditorState — unchanged, re-exported so a consumer never needs a direct @tiptap/react import for the common path.

On this page