Skip to content

Add a new directive-based hotkey system

Daniel Gerhardt requested to merge refac-keyboard-shortcut-handling into master

Hotkeys can now be easily registered by using a new HotkeyDirective with an element in a template. This will create a hotkey which triggers a focus (default) or click event for this element. The hotkey is automatically unregistered once the directive is destroyed. Furthermore, hotkeys are ignored if a element is active which supports text input (input, textarea, select).

Basic example:

<button appHotkey="h">Do something!</button>

Advanced example:

<button
  appHotkey="h"
  [appHotkeyControl]="true"
  [appHotkeyAction]="HotkeyAction.CLICK"
  appHotkeyTitle="Optional hotkey action description"
  [appHotkeyDisabled]="!hotkeyCondition"
  (click)="doSomething()"
>Do something!</button>

A list of all registered hotkeys can be displayed in a dialog (hotkey H). This list is automatically updated and suitable for a11y. It can replace the manually maintained hotkey announcement strings.

All existing code has been migrated to utilize the new system. The old keyboard utility classes which managed key mappings to support IE have been removed. Furthermore, the focus state flag has been removed from the EventService.

new-hotkey-handling

Furthermore, manually maintained hotkey announcements, which were hard-coded through the translation files, have been removed. A new a11yIntro pipe has been introduced to append the info regarding the help key to page intro announcements.

Related: #774 (closed)

Edited by Daniel Gerhardt

Merge request reports