CommandPalette
/commandCommandPalettePropsPreview
Props
9| Prop | Type | Default |
|---|---|---|
className | string | — |
defaultOpened | boolean | — |
hotkey | string | false | — |
items required | readonly CommandItem[] | — |
labels | Partial<CommandPaletteLabels> | — |
maxResults | number | — |
onAction | ((key: string) => void) | — |
onOpenChange | ((opened: boolean) => void) | — |
opened | boolean | — |
Slot props
11Each one spreads over an inner element, so you can restyle a region without forking the component.
| Prop | Type | Default |
|---|---|---|
bodyProps Label and description column. | BoxSlotProps | — |
descriptionProps The description, when the command has one. | TextSlotProps | — |
emptyProps The no-results notice. It replaces the list, it is not added to it. | TextSlotProps | — |
iconProps Wrapper for the icon, when the command has one. | BoxSlotProps | — |
inputProps The search field. It spreads AFTER the aria combobox props. | Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> | — |
inputRowProps The search row: the magnifier and the field. | BoxSlotProps | — |
labelProps The command label. | TextSlotProps | — |
listProps The command list. It spreads AFTER the aria listbox props. | Omit<DetailedHTMLProps<HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> | — |
optionProps Every row. It carries `data-focused` and `data-disabled`, and the aria option props already. | Omit<DetailedHTMLProps<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> | — |
searchIconProps The magnifier glyph of that row, which is not the icon of the command rows. | BoxSlotProps | — |
shortcutProps The shortcut, rendered with `Kbd`. Only when the command has a `shortcut`. | Omit<KbdProps, "children"> | — |