For AI agents: the documentation index is at /llms.txt, and any docs page is available as Markdown by appending .md to its URL.

Editor slash menu

Verified

A searchable menu opened by typing / in a block, to insert headings, lists, quotes, code, and dividers.

When to use

Use when: People insert blocks by typing / in a line.
Avoid when: Mentions or other trigger characters; use Editor Suggestion.

Installation

bunx shelf add editor-slash-menu

The source lands in src/components/ui/editor-slash-menu.tsx, along with any Shelf items it builds on, and .shelf/lock.json records what was installed. It's yours to edit.

Usage

import * as Editor from "@/components/ui/editor-slash-menu";

<Editor.Root>
  <Editor.Content />
  <EditorSlashMenu />
</Editor.Root>

Built on

Packages: @floating-ui/dom, @stylexjs/stylex, @tiptap/pm, @tiptap/suggestion
Shelf items: Editor, foundations, utils
Figma: Optional native Figma library. See Designers.

Verified

Size: 2.9 kB gzipped on its own, 137 kB with the Shelf items and packages it builds on. JS and CSS in a production build, without React.
Accessibility: Axe passes on 3 stories
Behavior: 3 interaction tests in Storybook
React Compiler: Compiles with React Compiler
React Doctor: React Doctor finds nothing