Slash Command

Type / anywhere in the editor and a menu appears with insertable blocks — headings, lists, code blocks, quotes, custom items. The discoverable counterpart to keyboard shortcuts.

Install

pnpm add @typix-editor/extension-slash-command

Live demo

Programmatic insertion

import {
  canInsertSlashCommand,
  insertSlashCommand,
} from "@typix-editor/extension-slash-command";

if (canInsertSlashCommand(editor)) {
  insertSlashCommand(editor);
}

Custom menu items

SlashDropdownMenu accepts a custom items prop with extra block types (insert image, embed, table, AI-generated content, etc.).

Vendor the UI

npx typix ui add slash-command

Related