Actions

Hotkeys

@xui/hotkeys

The ?-triggered help overlay listing every registered hotkey, grouped. Mounted by {@link XuiHotkeysService.openHelp}; not intended to be used directly.

Install

pnpm add @xui/hotkeys

Add the barrel to a standalone component's imports:

import { XuiHotkeysImports } from '@xui/hotkeys';

@Component({
  imports: [XuiHotkeysImports],
  // …
})

Examples

Default

Source only — this one needs a component of its own to run, so there is nothing to render here.

<div class="text-foreground max-w-md text-sm">
  <p class="mb-4">Try the shortcuts (click here first to focus the page):</p>
  <ul class="text-foreground-muted mb-4 list-disc pl-5">
    <li><kbd>?</kbd> — open the shortcut help</li>
    <li>
      <kbd>{{ mod }}+S</kbd> — save ({{ saves() }})
    </li>
    <li>
      <kbd>{{ mod }}+K</kbd> — command palette ({{ palette() }})
    </li>
    <li><kbd>G</kbd> then nothing — go home ({{ home() }})</li>
  </ul>
  <button class="bg-primary text-primary-foreground rounded-lg px-3 py-1.5 text-sm" (click)="help.openHelp()">
    Show shortcuts
  </button>
</div>

API

XuiHotkeysDialog

componentxui-hotkeys-dialog

The ?-triggered help overlay listing every registered hotkey, grouped. Mounted by {@link XuiHotkeysService.openHelp}; not intended to be used directly.

Source

libs/ui/hotkeys/xui

xUI 2.0.0 — Apache 2.0 licensed. Built with Angular and Tailwind CSS.