Command

Searchable command palette. Built on cmdk — handles filtering, keyboard nav, and selection.

Basic

<Command className="border border-border shadow-overlay">
  <CommandInput placeholder="Type a command or search…" />
  <CommandList>
    <CommandEmpty>No results found.</CommandEmpty>

    <CommandGroup heading="Suggestions">
      <CommandItem>Calendar</CommandItem>
      <CommandItem>Search emoji</CommandItem>
      <CommandItem>Find a file</CommandItem>
    </CommandGroup>

    <CommandSeparator />

    <CommandGroup heading="Settings">
      <CommandItem>
        Profile
        <CommandShortcut>⌘P</CommandShortcut>
      </CommandItem>
      <CommandItem>
        Billing
        <CommandShortcut>⌘B</CommandShortcut>
      </CommandItem>
      <CommandItem>
        Settings
        <CommandShortcut>⌘,</CommandShortcut>
      </CommandItem>
    </CommandGroup>
  </CommandList>
</Command>

Exports

Export	Role
Command	Root.
CommandInput	Search input with leading icon.
CommandList	Scroll container (max-h 300px).
CommandEmpty	Fallback when filter yields nothing.
CommandGroup	Titled section. Pass `heading`.
CommandSeparator	Divider.
CommandItem	A row. Filters + keyboard nav via cmdk.
CommandShortcut	Keyboard-hint text.

Source

packages/react/src/components/command.tsx