Command

Fast, composable, unstyled command menu for Angular.

Default

Standard command menu with groups and items.

SuggestionsSettings

Dialog

Command menu wrapped in a dialog, accessible via a keyboard shortcut.

Press Ctrl + J or ⌘ + J to open the command palette.

Last selected: none

Combobox

Using the command menu as a search and selection tool inside a popover.

Installation & Usage

Installation

Imports

Basic Skeleton

API Reference

Brain API

Functional logic based on the cmdk pattern.

DirectiveSelectorInputs / Outputs
BrnCommandbrn-command, [brnCommand]
  • filter: (value: string, search: string) => number
BrnCommandItem[brnCommandItem]
  • value: string
  • disabled: boolean
  • selected: EventEmitter<void>

Helm API

Styling components for the command menu.

Component / DirectiveSelectorDescription
HlmCommandhlm-commandThe main container component.
HlmCommandDialoghlm-command-dialog Dialog wrapper for command menu. Inputs: state, title, description.
HlmCommandInputhlm-command-inputSearch input field.
HlmCommandListhlm-command-listScrollable container for items.
HlmCommandItem[hlmCommandItem]A command menu item button.
HlmCommandGrouphlm-command-groupContainer for grouping items.
HlmCommandEmpty[hlmCommandEmpty] Displayed when no results are found. Use with *hlmCommandEmptyState.