Command Menu

unreleasedstable

A command palette surface with searchable actions and app-level shortcut hooks.

Usage

tsxUsage

import { CommandMenu } from "@/components/ui/command-menu";
 
export function Component() {
  return (
    <CommandMenu
      hotkeys={false}
      items={[
        { value: "open-dashboard", label: "Open dashboard" },
        { value: "copy-link", label: "Copy link" },
      ]}
      trigger={<span>Open command menu</span>}
    />
  );
}

API Reference

CommandMenu

High-level command palette composition for trigger, input, grouped list, empty state, shortcuts, and optional footer.

createCommandMenuStore

TanStack Store-backed state helper for shared open, query, selected command, and recent command state.

CommandMenuRoot / Trigger / Content

Compound parts for apps that need lower-level command palette composition.

CommandMenuInput / List / Group / Item

Search input and listbox anatomy backed by Keystone Command keyboard and selection behavior.

CommandMenuShortcut / Empty / Separator / Footer

Display and layout parts for app-specific command palette content.

Examples