Install

One command, source you own

Interlace components install as source into your repo via the shadcn CLI. You own the files and edit the styling freely. Requires React 19 and Tailwind CSS.

Props

Prop	Type	Description
commands	Command[]	The commands to show. Each may have a group, keywords, icon, onSelect, or children.
groups	CommandGroup[]?	Group definitions; controls section order and labels.
open	boolean	Controlled open state.
onOpenChange	(open: boolean) => void	Called when the palette wants to open or close.
placeholder	string?	Input placeholder text.
disableShortcut	boolean?	Disable the built-in ⌘K / Ctrl+K shortcut.
defaultQuery	string?	Open the palette pre-filtered with this query.
recents	string[]?	Recently-used command ids (most-recent first); boosts them in ranking.
onSelectCommand	(id, command) => void	Fires on every selection — use it to record usage for recents.
rank	RankFn?	Bring your own matcher. Defaults to the built-in fuzzy ranker.
shortcut (per command)	string[]?	Display-only hint shown on the row, e.g. ["⌘","⇧","P"]. Your app binds the actual key (like cmdk); the palette only renders it.

Customizing

Because the source lives in your repo under components/command-palette, you can change Tailwind classes, swap motion timings in motion.ts, or extend the command types directly.

Bring your own matcher

The built-in fuzzy ranker is the default. Pass rank to swap in your own — fuzzysort, command-score, or a server-side ranker:

<CommandPalette
  commands={commands}
  rank={(cmds, query) =>
    myMatcher(cmds, query).map((command) => ({
      command,
      matchedIndices: [],
    }))
  }
/>