Command
A searchable command palette with filtering, grouped results and full keyboard navigation, inline or in a modal dialog. No cmdk dependency.
Preview
Open the dialog, or use the palette below.
People
Ines DuarteDesign
Malik OseiField ops
Priya NairResearch
Pages
Spring survey planEdited 2h ago
Tide table · North shore12 stops
Archived routesRead only
Actions
New pageAltN
Invite a teammateAltI
Switch themeAltT
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| shouldFilter | boolean | true | Filter items by the query; false shows all (Command, CommandDialog). |
| loop | boolean | true | Arrow keys wrap at the ends (Command, CommandDialog). |
| label | string | - | Accessible name for the input and list (Command). |
| value | string | - | Controlled query (CommandInput); on CommandItem, the text matched and passed to onSelect (defaults to rendered text). |
| onValueChange | (value: string) => void | - | Called as the query changes (CommandInput). |
| keywords | string[] | - | Extra search terms (CommandItem). |
| disabled | boolean | false | Dim and skip the item (CommandItem). |
| onSelect | (value: string) => void | - | Runs on click or Enter (CommandItem). |
| heading | ReactNode | - | Group heading, also its accessible name (CommandGroup). |
| title / description | string | "Command menu" / hint | Visually hidden dialog title and description (CommandDialog). |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.