opinion
CommandPalette
Search every action and project from one box.
PaletteSubstring match, grouped results, arrows and Enter
Nothing picked yet
In context
Projects headerThe palette behind a search button
Projects
5Props
| Prop | Type | Required | Default |
|---|---|---|---|
open | boolean | undefined | No | — |
defaultOpen | boolean | undefined | No | — |
onOpenChange | ((open: boolean) => void) | undefined | No | — |
commands | CommandPaletteCommand[] | Yes | — |
placeholder | string | undefined | No | Type a command... |
Accessibility
Built on Radix Dialog (focus trap, Esc to close, backdrop click). The search input drives keyboard navigation through aria-activedescendant rather than moving focus between rows: ArrowUp and ArrowDown move, Enter runs the highlighted command. No global shortcut is registered for you; bind ⌘K in the app.
data-rebar-* attributes
data-rebar-component="command-palette"; data-rebar-part="overlay"|"search-input"|"list"|"group-label"|"item", with data-rebar-active on the highlighted item.
Migrating to Ant Design
AntD has no command palette. A migration composes Modal with AutoComplete, or reaches for a small library such as cmdk.