Command palette
Cmd+K global command search with grouped lists, character match highlighting, and keyboard navigation.
Basic usage
Each entry in items can carry a group for automatic grouping and a shortcut for the right-aligned hint. Typed characters fuzzy-match against label / description / keywords, and matched characters are bolded in the accent color.
<CfCommandPalette
:open="open"
:items="items"
@update:open="(v) => open = v"
@select="(id) => onPick(id)"
/> <CfCommandPalette
open={open}
onOpenChange={setOpen}
items={items}
onSelect={(id) => onPick(id)}
/> Hide the footer
hide-footer hides the bottom “up/down to navigate, enter to select, Esc to close” hint to save vertical space.
<CfCommandPalette ... hide-footer /> <CfCommandPalette ... hideFooter /> API
| Prop | Type | Default | Description |
|---|---|---|---|
open / v-model:open | boolean | — | |
items | CommandPaletteItem[] | — | { id, label, description?, group?, shortcut?, keywords?, disabled? } |
placeholder | string | 'Search commands, requests, settings…' | |
emptyText | string | 'No matches' | |
closeOnSelect | boolean | true | |
hideFooter | boolean | false |
Keyboard: up/down navigate, enter select, Esc close.
反馈与讨论
Command palette · Discussion