Command

The Command component provides a fast, searchable command menu with keyboard navigation.

Basic Usage

Icons

An item's icon is a kebab-case Lucide icon name, resolved against lucide's runtime icons record — the same surface ui:button and the action:* family resolve against. A name that is not a live key of that record (an unknown, or a retired spelling such as smile) renders no glyph, never a fallback glyph and never the literal name as text.

Schema

interface CommandItem {
  value: string;
  label: string;
  icon?: string;                  // kebab-case Lucide icon name (e.g. "face-slightly-smiling")
}

interface CommandGroup {
  heading?: string;
  items: CommandItem[];
}

interface CommandSchema {
  type: 'command';
  placeholder?: string;           // Search placeholder
  groups: CommandGroup[];         // Command groups
  emptyText?: string;             // Text when no results
  
  // Styling
  className?: string;
}

Examples

File Command Palette

A single-group palette of file commands, with its own search placeholder.