@elemental/ui / Class

LmnKeyboardNavigationItemDirective

A directive that enables keyboard navigation for elements in a navigation group.

This directive is part of the keyboard navigation system and should be applied to individual items that need to be navigated via keyboard. It works in conjunction with the LmnKeyboardNavigationManagerDirective to enable accessible keyboard navigation.

The directive adds necessary attributes and behaviors to the target element to support:

  • Arrow key navigation (horizontal, vertical, or both directions)
  • Grid-based navigation using row and column coordinates
  • Type-ahead functionality for quick item selection
  • Accessibility attributes for proper screen reader support

Properties

NameTypeDescription
active
r
InputSignal<boolean>
column
r
InputSignalWithTransform<number, unknown>
disabled
r
InputSignalWithTransform<boolean, unknown>
row
r
InputSignalWithTransform<number, unknown>
target
r
InputSignal<HTMLElement>
typeAheadLabel
r
InputSignalWithTransform<string, string>