Prepared Docs

Command wraps cmdk with styled building blocks: CommandInput (search Input with lead icon), CommandList, CommandGroup (optional heading, value, forceMount), CommandItem (Interactable row with keywords, onSelect), CommandSeparator, and CommandEmpty. Set shouldFilter={false} when filtering happens on the server.

Command (root)

Name	Type	Default	Description
`onValueChange`	`((value: string) => void)`	—	Callback when the selected value changes
`shouldFilter`	`boolean`	—	Whether to filter items based on search. Set to false for server-side filtering.
`tabIndex`	`number`	—	When there is no search input, set to `-1` so the cmdk root can receive programmatic focus (arrow-key navigation) without entering the tab sequence.
`value`	`string`	—	The currently selected item value

Storybook

Interactive examples and edge cases for this component are in Storybook.

Default

CommandItem

Name	Type	Default	Description
`value`	`string`	`—`	Item id.
`keywords`	`string[]`	`—`	Extra search tokens.
`onSelect`	`(value: string) => void`	`—`	Chosen callback.
`disabled`	`boolean`	`—`	Non-interactive row.

Example

Command / Usage

Command / Accessibility

Command (root)

Name	Type	Default	Description
`onValueChange`	`((value: string) => void)`	—	Callback when the selected value changes
`shouldFilter`	`boolean`	—	Whether to filter items based on search. Set to false for server-side filtering.
`tabIndex`	`number`	—	When there is no search input, set to `-1` so the cmdk root can receive programmatic focus (arrow-key navigation) without entering the tab sequence.
`value`	`string`	—	The currently selected item value

Storybook

Interactive examples and edge cases for this component are in Storybook.

Default

CommandItem

Name	Type	Default	Description
`value`	`string`	`—`	Item id.
`keywords`	`string[]`	`—`	Extra search tokens.
`onSelect`	`(value: string) => void`	`—`	Chosen callback.
`disabled`	`boolean`	`—`	Non-interactive row.

Example

Command / Usage

Command / Accessibility