Command

A search line and a list that narrows as you type. Groups, shortcuts, and a dialog wrapper.

pulls incmdklucide-react@afterglow/dialog

wire it toK

Command palette

Search for a command to run.

Installation

npx shadcn@latest add @afterglow/command

Composition

Component structure.

Command
├── CommandInput
└── CommandList
    ├── CommandEmpty
    ├── CommandGroup
    │   └── CommandItem
    │       └── CommandShortcut
    └── CommandSeparator
CommandDialog

API Reference

Command

The palette itself, laid into a page.

CommandDialog

The same palette in a dialog. title and description are its accessible name, read out rather than drawn, so they are worth setting to what the palette actually searches.

PropTypeDefault
titlestring"Command palette"
descriptionstring"Search for a command to run."
showCloseButtonbooleanfalse

Everything else is cmdk's API, documented there.