# AriaKeyShortcutsController

Reactive controller that exposes registered hotkey shortcut metadata

## Import

```ts
import { AriaKeyShortcutsController } from "@videojs/html";
```

## Usage

Create the controller on a reactive element inside a player container. It follows the container’s hotkey registrations and requests a host update when they change.

```ts
class CustomPlayButton extends UIElement {
  readonly #shortcut = new AriaKeyShortcutsController(this, "togglePaused");

  get ariaKeyShortcuts() {
    return this.#shortcut.aria;
  }

  get shortcutLabel() {
    return this.#shortcut.shortcut;
  }
}
```

Use `aria` for the element’s `aria-keyshortcuts` value and `shortcut` for display text. Both are `undefined` until the matching action has a registered shortcut.

## API Reference

`new AriaKeyShortcutsController(host, action, options?)`

### Parameters

| Parameter | Type | Default | Description |
| --- | --- | --- | --- |
| `host` (required) | `{ addController(controller: ReactiveController): void; removeController(controller: ReactiveController): void; requestUpdate(): void; updateComplete: Promise<boolean> } & HTMLElement` | — | Host element whose nearest player container supplies hotkey registrations. |
| `action` (required) | `string` | — | Registered hotkey action to look up. |
| `options` | `{ value?: (() => number \| undefined) }` | `{}` | Optional value resolver for value-dependent shortcuts. |

### Return Value

| Property | Type |
| --- | --- |
| `value` | `string \| undefined` |
| `aria` | `string \| undefined` |
| `shortcut` | `string \| undefined` |
| `details` | `{ aria?: string; shortcut?: string }` |

---

HTML documentation: https://videojs.org/docs/framework/html/llms.txt
All documentation: https://videojs.org/llms.txt