Atelier UI

Search components…

Search components…

Command Palette

⌘K command palette with fuzzy search, groups, shortcut hints and full keyboard control.

Edit in sandbox

Copy a prompt for your AI coding tool with the source, dependencies and usage

Props

CommandMenuProps

Also accepts all props of Omit<React.ComponentProps<"div">, "onSelect">

PropTypeDefaultDescription
groups* requiredCommandGroup[]——
placeholderstring"Type a command or search…"—
emptyTextstring"No results found."—
onSelect(item: CommandItem) => void—Called after an item's own onSelect
autoFocusSearchbooleanfalseFocus the search field on mount
showFooterbooleantrue—

CommandPaletteProps

Also accepts all props of CommandMenuProps

PropTypeDefaultDescription
open* requiredboolean——
onOpenChange* required(open: boolean) => void——
hotkeybooleantrueToggle with ⌘K / Ctrl+K

Install

$ npx shadcn@latest add https://chromotion.dev/r/command-palette.json

The CLI installs the base component; your customizations live in the code generated on the Customize tab.

More like this