Command palette

stable 5.4 kB
<hk-command>

Fuzzy subsequence matching over grouped commands — typing "dbi" still finds "Deploy billing-api". Arrow keys move, Enter runs.

#cmdk#search

Live demo

Running in this page — interact with it.

Inputs

NameTypeDefaultDescription
openbooleanfalseVisibility. Two-way bindable.
commandsHkCommand[][]Commands, each with a label, group and optional hint.
hotkeystring'mod+k'Global shortcut that opens the palette.
placeholderstring'Type a command…'Search field placeholder.

Outputs

  • runEventEmitter<HkCommand>

    Emits the chosen command.

Keyboard

  • Mod + K Opens the palette from anywhere
  • ↑ / ↓ Moves the highlight, wrapping at both ends
  • Enter Runs the highlighted command
  • Escape Closes and restores focus

Theming

Component tokens, each falling back to a global one:

PropertyDefaultControls
--hk-palette-bg#ffffffPanel background.
--hk-palette-activergb(220 38 38 / 0.10)Highlighted row fill.

Accessibility

  • The field is a combobox over a listbox; the highlight is tracked with aria-activedescendant so focus stays in the input.
  • Group headings are real headings, so the result set can be skimmed by structure.
  • Matching is subsequence-based, which keeps it forgiving without hiding what matched.

More in Navigation