fix(core): allow undefined hotkey options (#1242)

packages/html/src/index.ts

@@ -27,8 +27,8 @@ export { ControlsElement } from './ui/controls/controls-element';
 export { ControlsGroupElement } from './ui/controls/controls-group-element';
 export { ErrorDialogElement } from './ui/error-dialog/error-dialog-element';
 export { FullscreenButtonElement } from './ui/fullscreen-button/fullscreen-button-element';
+export { AriaKeyShortcutsController } from './ui/hotkey/aria-key-shortcuts-controller';
 export { HotkeyElement } from './ui/hotkey/hotkey-element';
-export { HotkeyRegistryController } from './ui/hotkey/hotkey-registry-controller';
 export { MediaButtonElement } from './ui/media-button-element';
 // Primitives
 export * from './ui/media-element';

packages/html/src/ui/hotkey/aria-key-shortcuts-controller.ts

@@ -7,7 +7,7 @@ import { containerContext } from '../../player/context';
 import type { PlayerControllerHost } from '../../player/player-controller';
 
 /** Provides `aria-keyshortcuts` for a given hotkey action name. */
-export class HotkeyRegistryController implements ReactiveController {
+export class AriaKeyShortcutsController implements ReactiveController {
   #action: string;
   #container: ContainerContextConsumer;
 
@@ -20,7 +20,7 @@ export class HotkeyRegistryController implements ReactiveController {
   get value(): string | undefined {
     const container = this.#container.value?.container;
     if (!container) return undefined;
-    return findHotkeyCoordinator(container as HTMLElement)?.getAriaKeys(this.#action);
+    return findHotkeyCoordinator(container)?.getAriaKeys(this.#action);
   }
 
   hostConnected(): void {}

packages/html/src/ui/hotkey/hotkey-element.ts

@@ -58,14 +58,14 @@ export class HotkeyElement extends MediaElement {
 
     const { value, action } = this;
 
-    this.#cleanup = createHotkey(container as HTMLElement, {
+    this.#cleanup = createHotkey(container, {
       keys: this.keys,
       action,
       target: this.target,
       disabled: this.disabled,
-      allowRepeat: !isHotkeyToggleAction(action),
+      repeatable: !isHotkeyToggleAction(action),
       onActivate: (_event, key) => {
-        resolver({ store, key, ...(value !== undefined && { value }) });
+        resolver({ store, key, value });
       },
     });
   }

packages/html/src/ui/hotkey/tests/hotkey-element.test.ts

@@ -1,7 +1,6 @@
 import { afterEach, describe, expect, it } from 'vitest';
-
+import { AriaKeyShortcutsController } from '../aria-key-shortcuts-controller';
 import { HotkeyElement } from '../hotkey-element';
-import { HotkeyRegistryController } from '../hotkey-registry-controller';
 
 let tagCounter = 0;
 
@@ -42,12 +41,12 @@ describe('HotkeyElement', () => {
   });
 });
 
-describe('HotkeyRegistryController', () => {
+describe('AriaKeyShortcutsController', () => {
   it('returns undefined when no coordinator exists', () => {
     const el = createElement(HotkeyElement);
     document.body.appendChild(el);
 
-    const controller = new HotkeyRegistryController(el, 'togglePaused');
+    const controller = new AriaKeyShortcutsController(el, 'togglePaused');
 
     expect(controller.value).toBeUndefined();
   });

packages/html/src/ui/media-button-element.ts

@@ -10,7 +10,7 @@ import type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';
 import type { State } from '@videojs/store';
 
 import type { PlayerController } from '../player/player-controller';
-import { HotkeyRegistryController } from './hotkey/hotkey-registry-controller';
+import { AriaKeyShortcutsController } from './hotkey/aria-key-shortcuts-controller';
 import { MediaElement } from './media-element';
 
 /** Abstract base for HTML custom elements that render a media-control button. */
@@ -37,13 +37,13 @@ export abstract class MediaButtonElement<Core extends MediaButtonComponent> exte
   }
 
   #disconnect: AbortController | null = null;
-  #hotkeyRegistry: HotkeyRegistryController | null = null;
+  #hotkeyRegistry: AriaKeyShortcutsController | null = null;
 
   override connectedCallback(): void {
     super.connectedCallback();
 
     if (this.hotkeyAction && !this.#hotkeyRegistry) {
-      this.#hotkeyRegistry = new HotkeyRegistryController(this, this.hotkeyAction);
+      this.#hotkeyRegistry = new AriaKeyShortcutsController(this, this.hotkeyAction);
     }
 
     this.#disconnect = new AbortController();