Command Palette
Search for a command to run...
Command
Command palette for searching and selecting items.About Command
A command palette component for searching and selecting items with keyboard navigation and filtering. Used for command menus, search interfaces, and quick navigation.Installation
Import the Command component from LSD:import { Command } from '@nipsys/lsd'
export default function MyComponent() {
return <Command />
}Usage
The simplest form of the component with default styling.Basic
Features
Additional features and capabilities of the component.Dialog
Groups
Shortcuts
Composition
Command
├── CommandInput
├── CommandList
│ ├── CommandEmpty
│ ├── CommandGroup
│ └── CommandSeparator
└── CommandDialog
Accessibility
The component follows accessibility best practices for screen readers and keyboard navigation.Keyboard Navigation
Keyboard shortcuts and navigation
• Arrow Up/Down - Navigate through command items• Enter - Select the currently focused item• Escape - Close the command palette• Tab - Move focus to interactive elements
ARIA Attributes
Proper ARIA attributes for screen readers
• role="listbox" is applied by cmdk for the list• role="option" is applied to each command item• aria-selected indicates the currently selected item• aria-invalid indicates validation errors
Focus States
Visible focus indicators for keyboard users
• Focus moves through items using arrow keys• Visible focus indicators show current selection• Focus is managed within the command palette