AI & AgentsPro

Slash Command Menu

The popover that opens when someone types / in the prompt: commands with a short description, filtered as they type.

Usage

bash

npm install @wunderui/react

Then import what you need:

tsx

import { SlashCommandMenu } from "@wunderui/react"

Right after typing /.

The text after the slash narrows the list.

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

Typing / opens the menu above the prompt. Arrow keys move, Enter runs the command, Esc closes the menu.

⌘↵

Prop	Type	Default
commands	{ name: string; description?: string; icon?: ReactNode }[]	—
query	string	""
activeIndex / onActiveIndexChange	number / (index: number) => void	0
onSelect	(command) => void	—