@videojs/html 10.0.0-beta.22 → 10.0.0-beta.24

package/dist/dev/ui/input-indicators/live-indicator.js

@@ -0,0 +1,32 @@
+import { applyStateDataAttrs } from "@videojs/core/dom";
+//#region src/ui/input-indicators/live-indicator.ts
+var LiveIndicator = class {
+	#host;
+	#dataAttrs;
+	#render;
+	constructor(options) {
+		this.#host = options.host;
+		this.#dataAttrs = options.dataAttrs;
+		this.#render = options.render;
+	}
+	get element() {
+		return this.#host;
+	}
+	render(state) {
+		this.#host.hidden = false;
+		applyStateDataAttrs(this.#host, state, this.#dataAttrs);
+		this.#render(this.#host, state);
+		return this.#host;
+	}
+	remove() {
+		this.#host.hidden = true;
+		for (const key in this.#dataAttrs) {
+			const name = this.#dataAttrs[key];
+			if (name) this.#host.removeAttribute(name);
+		}
+	}
+};
+//#endregion
+export { LiveIndicator };
+
+//# sourceMappingURL=live-indicator.js.map

package/dist/dev/ui/input-indicators/live-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-indicator.js","names":["#host","#dataAttrs","#render"],"sources":["../../../../src/ui/input-indicators/live-indicator.ts"],"sourcesContent":["import type { StateAttrMap } from '@videojs/core';\nimport { applyStateDataAttrs } from '@videojs/core/dom';\n\nexport interface LiveIndicatorOptions<State extends object> {\n  host: HTMLElement;\n  dataAttrs: StateAttrMap<State>;\n  render: (element: HTMLElement, state: State) => void;\n}\n\nexport class LiveIndicator<State extends object> {\n  readonly #host: HTMLElement;\n  readonly #dataAttrs: StateAttrMap<State>;\n  readonly #render: (element: HTMLElement, state: State) => void;\n\n  constructor(options: LiveIndicatorOptions<State>) {\n    this.#host = options.host;\n    this.#dataAttrs = options.dataAttrs;\n    this.#render = options.render;\n  }\n\n  get element(): HTMLElement {\n    return this.#host;\n  }\n\n  render(state: State): HTMLElement {\n    this.#host.hidden = false;\n    applyStateDataAttrs(this.#host, state, this.#dataAttrs);\n    this.#render(this.#host, state);\n\n    return this.#host;\n  }\n\n  remove(): void {\n    this.#host.hidden = true;\n\n    for (const key in this.#dataAttrs) {\n      const name = this.#dataAttrs[key];\n      if (name) this.#host.removeAttribute(name);\n    }\n  }\n}\n"],"mappings":";;AASA,IAAa,gBAAb,MAAiD;CAC/C;CACA;CACA;CAEA,YAAY,SAAsC;AAChD,QAAA,OAAa,QAAQ;AACrB,QAAA,YAAkB,QAAQ;AAC1B,QAAA,SAAe,QAAQ;;CAGzB,IAAI,UAAuB;AACzB,SAAO,MAAA;;CAGT,OAAO,OAA2B;AAChC,QAAA,KAAW,SAAS;AACpB,sBAAoB,MAAA,MAAY,OAAO,MAAA,UAAgB;AACvD,QAAA,OAAa,MAAA,MAAY,MAAM;AAE/B,SAAO,MAAA;;CAGT,SAAe;AACb,QAAA,KAAW,SAAS;AAEpB,OAAK,MAAM,OAAO,MAAA,WAAiB;GACjC,MAAM,OAAO,MAAA,UAAgB;AAC7B,OAAI,KAAM,OAAA,KAAW,gBAAgB,KAAK"}

package/dist/dev/ui/live-button/live-button-element.d.ts

@@ -0,0 +1,38 @@
+import { MediaElement } from "../media-element.js";
+import { PlayerController } from "../../player/player-controller.js";
+import { index_d_exports } from "../../index.js";
+import { PropertyDeclarationMap, PropertyValues } from "@videojs/element";
+import { State } from "@videojs/store";
+import * as _$_videojs_core0 from "@videojs/core";
+import { LiveButtonCore } from "@videojs/core";
+
+//#region src/ui/live-button/live-button-element.d.ts
+/**
+ * `<media-live-button>` — selects from `live`, `time`, and `buffer` features
+ * and composes them into the `LiveButtonMediaState` consumed by
+ * `LiveButtonCore`.
+ *
+ * Doesn't extend `MediaButtonElement` because that base couples a button to
+ * a single feature selector; the LiveButton needs three.
+ */
+declare class LiveButtonElement extends MediaElement {
+  #private;
+  static readonly tagName = "media-live-button";
+  static properties: PropertyDeclarationMap;
+  disabled: boolean;
+  label: string;
+  protected readonly core: LiveButtonCore;
+  protected readonly live: PlayerController<index_d_exports.AnyPlayerStore, _$_videojs_core0.MediaLiveState | undefined>;
+  protected readonly time: PlayerController<index_d_exports.AnyPlayerStore, _$_videojs_core0.MediaTimeState | undefined>;
+  protected readonly buffer: PlayerController<index_d_exports.AnyPlayerStore, _$_videojs_core0.MediaBufferState | undefined>;
+  get $state(): State<LiveButtonCore.State>;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  /** Returns the button's current label derived from media state. */
+  getLabel(): string | undefined;
+  protected willUpdate(changed: PropertyValues): void;
+  protected update(changed: PropertyValues): void;
+}
+//#endregion
+export { LiveButtonElement };
+//# sourceMappingURL=live-button-element.d.ts.map

package/dist/dev/ui/live-button/live-button-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-button-element.d.ts","names":[],"sources":["../../../../src/ui/live-button/live-button-element.ts"],"mappings":";;;;;;;;;;;;;AAyBA;;;;cAAa,iBAAA,SAA0B,YAAA;EAAA;kBACrB,OAAA;EAAA,OAEA,UAAA,EAAY,sBAAA;EAK5B,QAAA;EACA,KAAA;EAAA,mBAEmB,IAAA,EAAI,cAAA;EAAA,mBAEJ,IAAA,EAAI,gBAAA,CAFA,eAAA,CAEA,cAAA,EAAA,gBAAA,CAAA,cAAA;EAAA,mBACJ,IAAA,EAAI,gBAAA,CADA,eAAA,CACA,cAAA,EAAA,gBAAA,CAAA,cAAA;EAAA,mBACJ,MAAA,EAAM,gBAAA,CADF,eAAA,CACE,cAAA,EAAA,gBAAA,CAAA,gBAAA;EAAA,IAErB,MAAA,CAAA,GAAU,KAAA,CAAM,cAAA,CAAe,KAAA;EAM1B,iBAAA,CAAA;EAyBA,oBAAA,CAAA;EAgB0B;EATnC,QAAA,CAAA;EAAA,UAImB,UAAA,CAAW,OAAA,EAAS,cAAA;EAAA,UAKpB,MAAA,CAAO,OAAA,EAAS,cAAA;AAAA"}

package/dist/dev/ui/live-button/live-button-element.js

@@ -0,0 +1,98 @@
+import { playerContext } from "../../player/context.js";
+import { MediaElement } from "../media-element.js";
+import { PlayerController } from "../../player/player-controller.js";
+import { applyElementProps, applyStateDataAttrs, createButton, logMissingFeature, selectBuffer, selectLive, selectTime } from "@videojs/core/dom";
+import { LiveButtonCore, LiveButtonDataAttrs } from "@videojs/core";
+//#region src/ui/live-button/live-button-element.ts
+/**
+* `<media-live-button>` — selects from `live`, `time`, and `buffer` features
+* and composes them into the `LiveButtonMediaState` consumed by
+* `LiveButtonCore`.
+*
+* Doesn't extend `MediaButtonElement` because that base couples a button to
+* a single feature selector; the LiveButton needs three.
+*/
+var LiveButtonElement = class extends MediaElement {
+	constructor(..._args) {
+		super(..._args);
+		this.disabled = false;
+		this.label = "";
+		this.core = new LiveButtonCore();
+		this.live = new PlayerController(this, playerContext, selectLive);
+		this.time = new PlayerController(this, playerContext, selectTime);
+		this.buffer = new PlayerController(this, playerContext, selectBuffer);
+		this.#disconnect = null;
+	}
+	static {
+		this.tagName = "media-live-button";
+	}
+	static {
+		this.properties = {
+			label: { type: String },
+			disabled: { type: Boolean }
+		};
+	}
+	get $state() {
+		return this.core.state;
+	}
+	#disconnect;
+	connectedCallback() {
+		super.connectedCallback();
+		if (this.destroyed) return;
+		if (!this.textContent?.trim()) this.textContent = LiveButtonCore.defaultText;
+		this.#disconnect = new AbortController();
+		const buttonProps = createButton({
+			onActivate: () => {
+				const media = this.#getMedia();
+				if (media) this.core.seekToLive(media);
+			},
+			isDisabled: () => this.disabled || !this.#getMedia()
+		});
+		applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });
+		if (!this.#getMedia()) logMissingFeature(this.localName, this.live.displayName ?? "live");
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#disconnect?.abort();
+		this.#disconnect = null;
+	}
+	/** Returns the button's current label derived from media state. */
+	getLabel() {
+		return this.core.state.current.label || void 0;
+	}
+	willUpdate(changed) {
+		super.willUpdate(changed);
+		this.core.setProps(this);
+	}
+	update(changed) {
+		super.update(changed);
+		const media = this.#getMedia();
+		if (!media) return;
+		this.core.setMedia(media);
+		const state = this.core.getState();
+		applyElementProps(this, this.core.getAttrs(state));
+		applyStateDataAttrs(this, state, LiveButtonDataAttrs);
+	}
+	/**
+	* Compose the LiveButton media state from the three feature slices.
+	* Returns `null` when any are missing so the button stays disabled until
+	* all three features are registered on the player.
+	*/
+	#getMedia() {
+		const live = this.live.value;
+		const time = this.time.value;
+		const buffer = this.buffer.value;
+		if (!live || !time || !buffer) return null;
+		return {
+			currentTime: time.currentTime,
+			seek: time.seek,
+			seekable: buffer.seekable,
+			liveEdgeStart: live.liveEdgeStart,
+			targetLiveWindow: live.targetLiveWindow
+		};
+	}
+};
+//#endregion
+export { LiveButtonElement };
+
+//# sourceMappingURL=live-button-element.js.map

package/dist/dev/ui/live-button/live-button-element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-button-element.js","names":["#disconnect","#getMedia"],"sources":["../../../../src/ui/live-button/live-button-element.ts"],"sourcesContent":["import { LiveButtonCore, LiveButtonDataAttrs, type LiveButtonMediaState } from '@videojs/core';\nimport {\n  applyElementProps,\n  applyStateDataAttrs,\n  createButton,\n  logMissingFeature,\n  selectBuffer,\n  selectLive,\n  selectTime,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport type { State } from '@videojs/store';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\n/**\n * `<media-live-button>` — selects from `live`, `time`, and `buffer` features\n * and composes them into the `LiveButtonMediaState` consumed by\n * `LiveButtonCore`.\n *\n * Doesn't extend `MediaButtonElement` because that base couples a button to\n * a single feature selector; the LiveButton needs three.\n */\nexport class LiveButtonElement extends MediaElement {\n  static readonly tagName = 'media-live-button';\n\n  static override properties: PropertyDeclarationMap = {\n    label: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  disabled = false;\n  label = '';\n\n  protected readonly core = new LiveButtonCore();\n\n  protected readonly live = new PlayerController(this, playerContext, selectLive);\n  protected readonly time = new PlayerController(this, playerContext, selectTime);\n  protected readonly buffer = new PlayerController(this, playerContext, selectBuffer);\n\n  get $state(): State<LiveButtonCore.State> {\n    return this.core.state;\n  }\n\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (!this.textContent?.trim()) {\n      this.textContent = LiveButtonCore.defaultText;\n    }\n\n    this.#disconnect = new AbortController();\n\n    const buttonProps = createButton({\n      onActivate: () => {\n        const media = this.#getMedia();\n        if (media) this.core.seekToLive(media);\n      },\n      isDisabled: () => this.disabled || !this.#getMedia(),\n    });\n\n    applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n\n    if (__DEV__ && !this.#getMedia()) {\n      logMissingFeature(this.localName, this.live.displayName ?? 'live');\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  /** Returns the button's current label derived from media state. */\n  getLabel(): string | undefined {\n    return this.core.state.current.label || undefined;\n  }\n\n  protected override willUpdate(changed: PropertyValues): void {\n    super.willUpdate(changed);\n    this.core.setProps(this);\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    const media = this.#getMedia();\n    if (!media) return;\n\n    this.core.setMedia(media);\n    const state = this.core.getState();\n    applyElementProps(this, this.core.getAttrs(state));\n    applyStateDataAttrs(this, state, LiveButtonDataAttrs);\n  }\n\n  /**\n   * Compose the LiveButton media state from the three feature slices.\n   * Returns `null` when any are missing so the button stays disabled until\n   * all three features are registered on the player.\n   */\n  #getMedia(): LiveButtonMediaState | null {\n    const live = this.live.value;\n    const time = this.time.value;\n    const buffer = this.buffer.value;\n    if (!live || !time || !buffer) return null;\n    return {\n      currentTime: time.currentTime,\n      seek: time.seek,\n      seekable: buffer.seekable,\n      liveEdgeStart: live.liveEdgeStart,\n      targetLiveWindow: live.targetLiveWindow,\n    };\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAyBA,IAAa,oBAAb,cAAuC,aAAa;;;kBAQvC;eACH;cAEkB,IAAI,gBAAgB;cAEpB,IAAI,iBAAiB,MAAM,eAAe,WAAW;cACrD,IAAI,iBAAiB,MAAM,eAAe,WAAW;gBACnD,IAAI,iBAAiB,MAAM,eAAe,aAAa;qBAM7C;;;iBApBZ;;;oBAE2B;GACnD,OAAO,EAAE,MAAM,QAAQ;GACvB,UAAU,EAAE,MAAM,SAAS;GAC5B;;CAWD,IAAI,SAAsC;AACxC,SAAO,KAAK,KAAK;;CAGnB;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,MAAI,CAAC,KAAK,aAAa,MAAM,CAC3B,MAAK,cAAc,eAAe;AAGpC,QAAA,aAAmB,IAAI,iBAAiB;EAExC,MAAM,cAAc,aAAa;GAC/B,kBAAkB;IAChB,MAAM,QAAQ,MAAA,UAAgB;AAC9B,QAAI,MAAO,MAAK,KAAK,WAAW,MAAM;;GAExC,kBAAkB,KAAK,YAAY,CAAC,MAAA,UAAgB;GACrD,CAAC;AAEF,oBAAkB,MAAM,aAAa,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CAAC;AAEzE,MAAe,CAAC,MAAA,UAAgB,CAC9B,mBAAkB,KAAK,WAAW,KAAK,KAAK,eAAe,OAAO;;CAItE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;;;CAIrB,WAA+B;AAC7B,SAAO,KAAK,KAAK,MAAM,QAAQ,SAAS,KAAA;;CAG1C,WAA8B,SAA+B;AAC3D,QAAM,WAAW,QAAQ;AACzB,OAAK,KAAK,SAAS,KAAK;;CAG1B,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;EAErB,MAAM,QAAQ,MAAA,UAAgB;AAC9B,MAAI,CAAC,MAAO;AAEZ,OAAK,KAAK,SAAS,MAAM;EACzB,MAAM,QAAQ,KAAK,KAAK,UAAU;AAClC,oBAAkB,MAAM,KAAK,KAAK,SAAS,MAAM,CAAC;AAClD,sBAAoB,MAAM,OAAO,oBAAoB;;;;;;;CAQvD,YAAyC;EACvC,MAAM,OAAO,KAAK,KAAK;EACvB,MAAM,OAAO,KAAK,KAAK;EACvB,MAAM,SAAS,KAAK,OAAO;AAC3B,MAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAQ,QAAO;AACtC,SAAO;GACL,aAAa,KAAK;GAClB,MAAM,KAAK;GACX,UAAU,OAAO;GACjB,eAAe,KAAK;GACpB,kBAAkB,KAAK;GACxB"}

package/dist/dev/ui/media-button-element.d.ts

@@ -1,7 +1,7 @@
 import { MediaElement } from "./media-element.js";
 import { PlayerController } from "../player/player-controller.js";
-import { State } from "@videojs/store";
 import { PropertyDeclarationMap, PropertyValues } from "@videojs/element";
+import { State } from "@videojs/store";
 import { ButtonState, InferComponentState, InferMediaState, MediaButtonComponent, StateAttrMap } from "@videojs/core";
 
 //#region src/ui/media-button-element.d.ts

package/dist/dev/ui/media-button-element.js

@@ -9,6 +9,8 @@ var MediaButtonElement = class extends MediaElement {
 		this.disabled = false;
 		this.label = "";
 		this.hotkeyAction = void 0;
+		this.#disconnect = null;
+		this.#hotkeyRegistry = null;
 	}
 	static {
 		this.properties = {
@@ -19,8 +21,8 @@ var MediaButtonElement = class extends MediaElement {
 	get $state() {
 		return this.core.state;
 	}
-	#disconnect = null;
-	#hotkeyRegistry = null;
+	#disconnect;
+	#hotkeyRegistry;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;

package/dist/dev/ui/media-button-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"media-button-element.js","names":["#hotkeyRegistry","#disconnect"],"sources":["../../../src/ui/media-button-element.ts"],"sourcesContent":["import type {\n  ButtonState,\n  InferComponentState,\n  InferMediaState,\n  MediaButtonComponent,\n  StateAttrMap,\n} from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, createButton, logMissingFeature } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport type { State } from '@videojs/store';\n\nimport type { PlayerController } from '../player/player-controller';\nimport { AriaKeyShortcutsController } from './hotkey/aria-key-shortcuts-controller';\nimport { MediaElement } from './media-element';\n\n/** Abstract base for HTML custom elements that render a media-control button. */\nexport abstract class MediaButtonElement<Core extends MediaButtonComponent> extends MediaElement {\n  static override properties: PropertyDeclarationMap = {\n    label: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  disabled = false;\n  label = '';\n\n  protected abstract readonly core: Core;\n  protected abstract readonly stateAttrMap: StateAttrMap<InferComponentState<Core>>;\n  protected abstract readonly mediaState: PlayerController<any, InferMediaState<Core> | undefined>;\n\n  protected abstract activate(state: InferMediaState<Core>): void;\n\n  /** Override to set the hotkey action name for `aria-keyshortcuts`. */\n  protected readonly hotkeyAction: string | undefined = undefined;\n\n  get $state(): State<ButtonState> {\n    return this.core.state;\n  }\n\n  #disconnect: AbortController | null = null;\n  #hotkeyRegistry: AriaKeyShortcutsController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (this.hotkeyAction && !this.#hotkeyRegistry) {\n      this.#hotkeyRegistry = new AriaKeyShortcutsController(this, this.hotkeyAction);\n    }\n\n    this.#disconnect = new AbortController();\n\n    const buttonProps = createButton({\n      onActivate: () => this.activate(this.mediaState.value!),\n      isDisabled: () => this.disabled || !this.mediaState.value,\n    });\n\n    applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n\n    if (__DEV__ && !this.mediaState.value && this.mediaState.displayName) {\n      logMissingFeature(this.localName, this.mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  /** Returns the button's current label derived from media state. */\n  getLabel(): string | undefined {\n    return this.core.state.current.label || undefined;\n  }\n\n  protected override willUpdate(changed: PropertyValues): void {\n    super.willUpdate(changed);\n    this.core.setProps?.(this);\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    const media = this.mediaState.value;\n\n    if (!media) return;\n\n    this.core.setMedia(media);\n    const state = this.core.getState();\n    applyElementProps(this, {\n      ...this.core.getAttrs?.(state),\n      'aria-keyshortcuts': this.#hotkeyRegistry?.value,\n    });\n    applyStateDataAttrs(this, state, this.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAgBA,IAAsB,qBAAtB,cAAoF,aAAa;;;kBAMpF;eACH;sBAS8C,KAAA;;;oBAfD;GACnD,OAAO,EAAE,MAAM,QAAQ;GACvB,UAAU,EAAE,MAAM,SAAS;GAC5B;;CAcD,IAAI,SAA6B;AAC/B,SAAO,KAAK,KAAK;;CAGnB,cAAsC;CACtC,kBAAqD;CAErD,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,MAAI,KAAK,gBAAgB,CAAC,MAAA,eACxB,OAAA,iBAAuB,IAAI,2BAA2B,MAAM,KAAK,aAAa;AAGhF,QAAA,aAAmB,IAAI,iBAAiB;EAExC,MAAM,cAAc,aAAa;GAC/B,kBAAkB,KAAK,SAAS,KAAK,WAAW,MAAO;GACvD,kBAAkB,KAAK,YAAY,CAAC,KAAK,WAAW;GACrD,CAAC;AAEF,oBAAkB,MAAM,aAAa,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CAAC;AAEzE,MAAe,CAAC,KAAK,WAAW,SAAS,KAAK,WAAW,YACvD,mBAAkB,KAAK,WAAW,KAAK,WAAW,YAAY;;CAIlE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;;;CAIrB,WAA+B;AAC7B,SAAO,KAAK,KAAK,MAAM,QAAQ,SAAS,KAAA;;CAG1C,WAA8B,SAA+B;AAC3D,QAAM,WAAW,QAAQ;AACzB,OAAK,KAAK,WAAW,KAAK;;CAG5B,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;EAErB,MAAM,QAAQ,KAAK,WAAW;AAE9B,MAAI,CAAC,MAAO;AAEZ,OAAK,KAAK,SAAS,MAAM;EACzB,MAAM,QAAQ,KAAK,KAAK,UAAU;AAClC,oBAAkB,MAAM;GACtB,GAAG,KAAK,KAAK,WAAW,MAAM;GAC9B,qBAAqB,MAAA,gBAAsB;GAC5C,CAAC;AACF,sBAAoB,MAAM,OAAO,KAAK,aAAa"}
+{"version":3,"file":"media-button-element.js","names":["#hotkeyRegistry","#disconnect"],"sources":["../../../src/ui/media-button-element.ts"],"sourcesContent":["import type {\n  ButtonState,\n  InferComponentState,\n  InferMediaState,\n  MediaButtonComponent,\n  StateAttrMap,\n} from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, createButton, logMissingFeature } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport type { State } from '@videojs/store';\n\nimport type { PlayerController } from '../player/player-controller';\nimport { AriaKeyShortcutsController } from './hotkey/aria-key-shortcuts-controller';\nimport { MediaElement } from './media-element';\n\n/** Abstract base for HTML custom elements that render a media-control button. */\nexport abstract class MediaButtonElement<Core extends MediaButtonComponent> extends MediaElement {\n  static override properties: PropertyDeclarationMap = {\n    label: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  disabled = false;\n  label = '';\n\n  protected abstract readonly core: Core;\n  protected abstract readonly stateAttrMap: StateAttrMap<InferComponentState<Core>>;\n  protected abstract readonly mediaState: PlayerController<any, InferMediaState<Core> | undefined>;\n\n  protected abstract activate(state: InferMediaState<Core>): void;\n\n  /** Override to set the hotkey action name for `aria-keyshortcuts`. */\n  protected readonly hotkeyAction: string | undefined = undefined;\n\n  get $state(): State<ButtonState> {\n    return this.core.state;\n  }\n\n  #disconnect: AbortController | null = null;\n  #hotkeyRegistry: AriaKeyShortcutsController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (this.hotkeyAction && !this.#hotkeyRegistry) {\n      this.#hotkeyRegistry = new AriaKeyShortcutsController(this, this.hotkeyAction);\n    }\n\n    this.#disconnect = new AbortController();\n\n    const buttonProps = createButton({\n      onActivate: () => this.activate(this.mediaState.value!),\n      isDisabled: () => this.disabled || !this.mediaState.value,\n    });\n\n    applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n\n    if (__DEV__ && !this.mediaState.value && this.mediaState.displayName) {\n      logMissingFeature(this.localName, this.mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  /** Returns the button's current label derived from media state. */\n  getLabel(): string | undefined {\n    return this.core.state.current.label || undefined;\n  }\n\n  protected override willUpdate(changed: PropertyValues): void {\n    super.willUpdate(changed);\n    this.core.setProps?.(this);\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    const media = this.mediaState.value;\n\n    if (!media) return;\n\n    this.core.setMedia(media);\n    const state = this.core.getState();\n    applyElementProps(this, {\n      ...this.core.getAttrs?.(state),\n      'aria-keyshortcuts': this.#hotkeyRegistry?.value,\n    });\n    applyStateDataAttrs(this, state, this.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAgBA,IAAsB,qBAAtB,cAAoF,aAAa;;;kBAMpF;eACH;sBAS8C,KAAA;qBAMhB;yBACe;;;oBAtBA;GACnD,OAAO,EAAE,MAAM,QAAQ;GACvB,UAAU,EAAE,MAAM,SAAS;GAC5B;;CAcD,IAAI,SAA6B;AAC/B,SAAO,KAAK,KAAK;;CAGnB;CACA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,MAAI,KAAK,gBAAgB,CAAC,MAAA,eACxB,OAAA,iBAAuB,IAAI,2BAA2B,MAAM,KAAK,aAAa;AAGhF,QAAA,aAAmB,IAAI,iBAAiB;EAExC,MAAM,cAAc,aAAa;GAC/B,kBAAkB,KAAK,SAAS,KAAK,WAAW,MAAO;GACvD,kBAAkB,KAAK,YAAY,CAAC,KAAK,WAAW;GACrD,CAAC;AAEF,oBAAkB,MAAM,aAAa,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CAAC;AAEzE,MAAe,CAAC,KAAK,WAAW,SAAS,KAAK,WAAW,YACvD,mBAAkB,KAAK,WAAW,KAAK,WAAW,YAAY;;CAIlE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;;;CAIrB,WAA+B;AAC7B,SAAO,KAAK,KAAK,MAAM,QAAQ,SAAS,KAAA;;CAG1C,WAA8B,SAA+B;AAC3D,QAAM,WAAW,QAAQ;AACzB,OAAK,KAAK,WAAW,KAAK;;CAG5B,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;EAErB,MAAM,QAAQ,KAAK,WAAW;AAE9B,MAAI,CAAC,MAAO;AAEZ,OAAK,KAAK,SAAS,MAAM;EACzB,MAAM,QAAQ,KAAK,KAAK,UAAU;AAClC,oBAAkB,MAAM;GACtB,GAAG,KAAK,KAAK,WAAW,MAAM;GAC9B,qBAAqB,MAAA,gBAAsB;GAC5C,CAAC;AACF,sBAAoB,MAAM,OAAO,KAAK,aAAa"}

package/dist/dev/ui/media-element.d.ts

@@ -1,9 +1,9 @@
-import * as _videojs_element0 from "@videojs/element";
+import * as _$_videojs_element0 from "@videojs/element";
 import { ReactiveElement } from "@videojs/element";
 import { Constructor } from "@videojs/utils/types";
 
 //#region src/ui/media-element.d.ts
-declare const MediaElement_base: typeof ReactiveElement & (new (...args: any[]) => _videojs_element0.Destroyable);
+declare const MediaElement_base: typeof ReactiveElement & (new (...args: any[]) => _$_videojs_element0.Destroyable);
 /** Base class for interactive media UI elements. */
 declare class MediaElement extends MediaElement_base {}
 interface MediaElementConstructor extends Constructor<MediaElement> {}

package/dist/dev/ui/menu/context.d.ts

@@ -0,0 +1,25 @@
+import { MenuApi, NavigationState } from "@videojs/core/dom";
+import { MenuState, StateAttrMap } from "@videojs/core";
+
+//#region src/ui/menu/context.d.ts
+interface MenuContextValue {
+  menu: MenuApi;
+  state: MenuState;
+  stateAttrMap: StateAttrMap<MenuState>;
+  navigation: NavigationState;
+  /** The parent menu's API — set by nested submenus for pop-on-select behavior. */
+  parentMenu: MenuApi | null;
+}
+interface MenuRadioGroupContextValue {
+  value: string;
+  onValueChange: (value: string) => void;
+}
+declare const menuContext: {
+  __context__: MenuContextValue;
+};
+declare const menuRadioGroupContext: {
+  __context__: MenuRadioGroupContextValue;
+};
+//#endregion
+export { MenuContextValue, MenuRadioGroupContextValue, menuContext, menuRadioGroupContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/dev/ui/menu/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/menu/context.ts"],"mappings":";;;;UAIiB,gBAAA;EACf,IAAA,EAAM,OAAA;EACN,KAAA,EAAO,SAAA;EACP,YAAA,EAAc,YAAA,CAAa,SAAA;EAC3B,UAAA,EAAY,eAAA;EAHN;EAKN,UAAA,EAAY,OAAA;AAAA;AAAA,UAGG,0BAAA;EACf,KAAA;EACA,aAAA,GAAgB,KAAA;AAAA;AAAA,cAML,WAAA;eAA+D,gBAAA;AAAA;AAAA,cAC/D,qBAAA;eAA+F,0BAAA;AAAA"}

package/dist/dev/ui/menu/context.js

@@ -0,0 +1,10 @@
+import { createContext } from "@videojs/element/context";
+//#region src/ui/menu/context.ts
+const MENU_CONTEXT_KEY = Symbol("@videojs/menu");
+const MENU_RADIO_GROUP_CONTEXT_KEY = Symbol("@videojs/menu-radio-group");
+const menuContext = createContext(MENU_CONTEXT_KEY);
+const menuRadioGroupContext = createContext(MENU_RADIO_GROUP_CONTEXT_KEY);
+//#endregion
+export { menuContext, menuRadioGroupContext };
+
+//# sourceMappingURL=context.js.map

package/dist/dev/ui/menu/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/menu/context.ts"],"sourcesContent":["import type { MenuState, StateAttrMap } from '@videojs/core';\nimport type { MenuApi, NavigationState } from '@videojs/core/dom';\nimport { createContext } from '@videojs/element/context';\n\nexport interface MenuContextValue {\n  menu: MenuApi;\n  state: MenuState;\n  stateAttrMap: StateAttrMap<MenuState>;\n  navigation: NavigationState;\n  /** The parent menu's API — set by nested submenus for pop-on-select behavior. */\n  parentMenu: MenuApi | null;\n}\n\nexport interface MenuRadioGroupContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n}\n\nconst MENU_CONTEXT_KEY = Symbol('@videojs/menu');\nconst MENU_RADIO_GROUP_CONTEXT_KEY = Symbol('@videojs/menu-radio-group');\n\nexport const menuContext = createContext<MenuContextValue>(MENU_CONTEXT_KEY);\nexport const menuRadioGroupContext = createContext<MenuRadioGroupContextValue>(MENU_RADIO_GROUP_CONTEXT_KEY);\n"],"mappings":";;AAkBA,MAAM,mBAAmB,OAAO,gBAAgB;AAChD,MAAM,+BAA+B,OAAO,4BAA4B;AAExE,MAAa,cAAc,cAAgC,iBAAiB;AAC5E,MAAa,wBAAwB,cAA0C,6BAA6B"}

package/dist/dev/ui/menu/menu-back-element.d.ts

@@ -0,0 +1,20 @@
+import { MediaElement } from "../media-element.js";
+import { PropertyValues } from "@videojs/element";
+
+//#region src/ui/menu/menu-back-element.d.ts
+declare class MenuBackElement extends MediaElement {
+  #private;
+  static readonly tagName = "media-menu-back";
+  static properties: {
+    label: {
+      type: StringConstructor;
+    };
+  };
+  label: string;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  protected update(_changed: PropertyValues): void;
+}
+//#endregion
+export { MenuBackElement };
+//# sourceMappingURL=menu-back-element.d.ts.map

package/dist/dev/ui/menu/menu-back-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-back-element.d.ts","names":[],"sources":["../../../../src/ui/menu/menu-back-element.ts"],"mappings":";;;;cAOa,eAAA,SAAwB,YAAA;EAAA;kBACnB,OAAA;EAAA,OAEA,UAAA;;MACL,IAAA,EAAI,iBAAA;IAAA;EAAA;EAGf,KAAA;EAOS,iBAAA,CAAA;EAMA,oBAAA,CAAA;EAAA,UAOU,MAAA,CAAO,QAAA,EAAU,cAAA;AAAA"}

package/dist/dev/ui/menu/menu-back-element.js

@@ -0,0 +1,57 @@
+import { MediaElement } from "../media-element.js";
+import { menuContext } from "./context.js";
+import { applyElementProps, applyStateDataAttrs } from "@videojs/core/dom";
+import { ContextConsumer } from "@videojs/element/context";
+//#region src/ui/menu/menu-back-element.ts
+var MenuBackElement = class extends MediaElement {
+	constructor(..._args) {
+		super(..._args);
+		this.label = "Back";
+		this.#ctx = new ContextConsumer(this, {
+			context: menuContext,
+			subscribe: true
+		});
+		this.#disconnect = null;
+		this.#bound = false;
+	}
+	static {
+		this.tagName = "media-menu-back";
+	}
+	static {
+		this.properties = { label: { type: String } };
+	}
+	#ctx;
+	#disconnect;
+	#bound;
+	connectedCallback() {
+		super.connectedCallback();
+		this.#disconnect = new AbortController();
+		this.#bound = false;
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#disconnect?.abort();
+		this.#disconnect = null;
+		this.#bound = false;
+	}
+	update(_changed) {
+		super.update(_changed);
+		const ctx = this.#ctx.value;
+		if (!ctx || !this.#disconnect) return;
+		if (!this.#bound) {
+			this.#bound = true;
+			applyElementProps(this, { onClick: () => {
+				ctx.parentMenu?.pop();
+			} }, { signal: this.#disconnect.signal });
+		}
+		applyElementProps(this, {
+			role: "button",
+			"aria-label": this.label
+		});
+		if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);
+	}
+};
+//#endregion
+export { MenuBackElement };
+
+//# sourceMappingURL=menu-back-element.js.map

package/dist/dev/ui/menu/menu-back-element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-back-element.js","names":["#ctx","#disconnect","#bound"],"sources":["../../../../src/ui/menu/menu-back-element.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { MediaElement } from '../media-element';\nimport { menuContext } from './context';\n\nexport class MenuBackElement extends MediaElement {\n  static readonly tagName = 'media-menu-back';\n\n  static override properties = {\n    label: { type: String },\n  } satisfies PropertyDeclarationMap<'label'>;\n\n  label = 'Back';\n\n  readonly #ctx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n\n  #disconnect: AbortController | null = null;\n  #bound = false;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n    this.#bound = false;\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n    this.#bound = false;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const ctx = this.#ctx.value;\n    if (!ctx || !this.#disconnect) return;\n\n    if (!this.#bound) {\n      this.#bound = true;\n\n      applyElementProps(\n        this,\n        {\n          onClick: () => {\n            // Pop to the parent menu view.\n            ctx.parentMenu?.pop();\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    applyElementProps(this, {\n      role: 'button',\n      'aria-label': this.label,\n    });\n\n    if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAOA,IAAa,kBAAb,cAAqC,aAAa;;;eAOxC;cAEQ,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;GAAM,CAAC;qBAE9C;gBAC7B;;;iBAXiB;;;oBAEG,EAC3B,OAAO,EAAE,MAAM,QAAQ,EACxB;;CAID;CAEA;CACA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,QAAA,aAAmB,IAAI,iBAAiB;AACxC,QAAA,QAAc;;CAGhB,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;AACnB,QAAA,QAAc;;CAGhB,OAA0B,UAAgC;AACxD,QAAM,OAAO,SAAS;EAEtB,MAAM,MAAM,MAAA,IAAU;AACtB,MAAI,CAAC,OAAO,CAAC,MAAA,WAAkB;AAE/B,MAAI,CAAC,MAAA,OAAa;AAChB,SAAA,QAAc;AAEd,qBACE,MACA,EACE,eAAe;AAEb,QAAI,YAAY,KAAK;MAExB,EACD,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CACpC;;AAGH,oBAAkB,MAAM;GACtB,MAAM;GACN,cAAc,KAAK;GACpB,CAAC;AAEF,MAAI,IAAK,qBAAoB,MAAM,IAAI,OAAO,IAAI,aAAa"}

package/dist/dev/ui/menu/menu-checkbox-item-element.d.ts

@@ -0,0 +1,24 @@
+import { MediaElement } from "../media-element.js";
+import { PropertyValues } from "@videojs/element";
+
+//#region src/ui/menu/menu-checkbox-item-element.d.ts
+declare class MenuCheckboxItemElement extends MediaElement {
+  #private;
+  static readonly tagName = "media-menu-checkbox-item";
+  static properties: {
+    checked: {
+      type: BooleanConstructor;
+    };
+    disabled: {
+      type: BooleanConstructor;
+    };
+  };
+  checked: boolean;
+  disabled: boolean;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  protected update(_changed: PropertyValues): void;
+}
+//#endregion
+export { MenuCheckboxItemElement };
+//# sourceMappingURL=menu-checkbox-item-element.d.ts.map

package/dist/dev/ui/menu/menu-checkbox-item-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-checkbox-item-element.d.ts","names":[],"sources":["../../../../src/ui/menu/menu-checkbox-item-element.ts"],"mappings":";;;;cAOa,uBAAA,SAAgC,YAAA;EAAA;kBAC3B,OAAA;EAAA,OAEA,UAAA;;MACH,IAAA,EAAI,kBAAA;IAAA;;MACH,IAAA,EAAI,kBAAA;IAAA;EAAA;EAGlB,OAAA;EACA,QAAA;EAQS,iBAAA,CAAA;EAMA,oBAAA,CAAA;EAAA,UASU,MAAA,CAAO,QAAA,EAAU,cAAA;AAAA"}

package/dist/dev/ui/menu/menu-checkbox-item-element.js

@@ -0,0 +1,78 @@
+import { MediaElement } from "../media-element.js";
+import { menuContext } from "./context.js";
+import { applyElementProps, applyStateDataAttrs } from "@videojs/core/dom";
+import { ContextConsumer } from "@videojs/element/context";
+//#region src/ui/menu/menu-checkbox-item-element.ts
+var MenuCheckboxItemElement = class extends MediaElement {
+	constructor(..._args) {
+		super(..._args);
+		this.checked = false;
+		this.disabled = false;
+		this.#ctx = new ContextConsumer(this, {
+			context: menuContext,
+			subscribe: true
+		});
+		this.#disconnect = null;
+		this.#registered = false;
+		this.#cleanupRegistration = null;
+	}
+	static {
+		this.tagName = "media-menu-checkbox-item";
+	}
+	static {
+		this.properties = {
+			checked: { type: Boolean },
+			disabled: { type: Boolean }
+		};
+	}
+	#ctx;
+	#disconnect;
+	#registered;
+	#cleanupRegistration;
+	connectedCallback() {
+		super.connectedCallback();
+		this.#disconnect = new AbortController();
+		this.#registered = false;
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#cleanupRegistration?.();
+		this.#cleanupRegistration = null;
+		this.#disconnect?.abort();
+		this.#disconnect = null;
+		this.#registered = false;
+	}
+	update(_changed) {
+		super.update(_changed);
+		const ctx = this.#ctx.value;
+		if (!ctx || !this.#disconnect) return;
+		if (!this.#registered) {
+			this.#registered = true;
+			this.#cleanupRegistration = ctx.menu.registerItem(this);
+			applyElementProps(this, {
+				onClick: () => {
+					if (!this.#ctx.value || this.disabled) return;
+					this.checked = !this.checked;
+					this.dispatchEvent(new CustomEvent("checked-change", {
+						detail: { checked: this.checked },
+						bubbles: true
+					}));
+				},
+				onPointerenter: () => {
+					const currentCtx = this.#ctx.value;
+					if (!this.disabled) currentCtx?.menu.highlight(this, { focus: false });
+				}
+			}, { signal: this.#disconnect.signal });
+		}
+		applyElementProps(this, {
+			role: "menuitemcheckbox",
+			"aria-checked": String(this.checked),
+			"aria-disabled": this.disabled ? "true" : void 0
+		});
+		applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);
+	}
+};
+//#endregion
+export { MenuCheckboxItemElement };
+
+//# sourceMappingURL=menu-checkbox-item-element.js.map

package/dist/dev/ui/menu/menu-checkbox-item-element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-checkbox-item-element.js","names":["#ctx","#disconnect","#registered","#cleanupRegistration"],"sources":["../../../../src/ui/menu/menu-checkbox-item-element.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { MediaElement } from '../media-element';\nimport { menuContext } from './context';\n\nexport class MenuCheckboxItemElement extends MediaElement {\n  static readonly tagName = 'media-menu-checkbox-item';\n\n  static override properties = {\n    checked: { type: Boolean },\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'checked' | 'disabled'>;\n\n  checked = false;\n  disabled = false;\n\n  readonly #ctx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n\n  #disconnect: AbortController | null = null;\n  #registered = false;\n  #cleanupRegistration: (() => void) | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n    this.#registered = false;\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n    this.#registered = false;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const ctx = this.#ctx.value;\n    if (!ctx || !this.#disconnect) return;\n\n    if (!this.#registered) {\n      this.#registered = true;\n\n      this.#cleanupRegistration = ctx.menu.registerItem(this);\n\n      applyElementProps(\n        this,\n        {\n          onClick: () => {\n            const currentCtx = this.#ctx.value;\n            if (!currentCtx || this.disabled) return;\n\n            this.checked = !this.checked;\n            this.dispatchEvent(new CustomEvent('checked-change', { detail: { checked: this.checked }, bubbles: true }));\n          },\n          onPointerenter: () => {\n            const currentCtx = this.#ctx.value;\n            if (!this.disabled) currentCtx?.menu.highlight(this, { focus: false });\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    applyElementProps(this, {\n      role: 'menuitemcheckbox',\n      'aria-checked': String(this.checked),\n      'aria-disabled': this.disabled ? 'true' : undefined,\n    });\n\n    applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAOA,IAAa,0BAAb,cAA6C,aAAa;;;iBAQ9C;kBACC;cAEK,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;GAAM,CAAC;qBAE9C;qBACxB;8BAC8B;;;iBAdlB;;;oBAEG;GAC3B,SAAS,EAAE,MAAM,SAAS;GAC1B,UAAU,EAAE,MAAM,SAAS;GAC5B;;CAKD;CAEA;CACA;CACA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,QAAA,aAAmB,IAAI,iBAAiB;AACxC,QAAA,aAAmB;;CAGrB,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,uBAA6B;AAC7B,QAAA,sBAA4B;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;AACnB,QAAA,aAAmB;;CAGrB,OAA0B,UAAgC;AACxD,QAAM,OAAO,SAAS;EAEtB,MAAM,MAAM,MAAA,IAAU;AACtB,MAAI,CAAC,OAAO,CAAC,MAAA,WAAkB;AAE/B,MAAI,CAAC,MAAA,YAAkB;AACrB,SAAA,aAAmB;AAEnB,SAAA,sBAA4B,IAAI,KAAK,aAAa,KAAK;AAEvD,qBACE,MACA;IACE,eAAe;AAEb,SAAI,CADe,MAAA,IAAU,SACV,KAAK,SAAU;AAElC,UAAK,UAAU,CAAC,KAAK;AACrB,UAAK,cAAc,IAAI,YAAY,kBAAkB;MAAE,QAAQ,EAAE,SAAS,KAAK,SAAS;MAAE,SAAS;MAAM,CAAC,CAAC;;IAE7G,sBAAsB;KACpB,MAAM,aAAa,MAAA,IAAU;AAC7B,SAAI,CAAC,KAAK,SAAU,aAAY,KAAK,UAAU,MAAM,EAAE,OAAO,OAAO,CAAC;;IAEzE,EACD,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CACpC;;AAGH,oBAAkB,MAAM;GACtB,MAAM;GACN,gBAAgB,OAAO,KAAK,QAAQ;GACpC,iBAAiB,KAAK,WAAW,SAAS,KAAA;GAC3C,CAAC;AAEF,sBAAoB,MAAM,IAAI,OAAO,IAAI,aAAa"}

package/dist/dev/ui/menu/menu-element.d.ts

@@ -0,0 +1,52 @@
+import { MediaElement } from "../media-element.js";
+import { MenuOpenChangeReason, PositioningBoundary } from "@videojs/core/dom";
+import { PropertyValues } from "@videojs/element";
+import * as _$_videojs_core0 from "@videojs/core";
+
+//#region src/ui/menu/menu-element.d.ts
+declare class MenuElement extends MediaElement {
+  #private;
+  static readonly tagName: string;
+  static properties: {
+    open: {
+      type: BooleanConstructor;
+    };
+    defaultOpen: {
+      type: BooleanConstructor;
+      attribute: string;
+    };
+    side: {
+      type: StringConstructor;
+    };
+    align: {
+      type: StringConstructor;
+    };
+    closeOnEscape: {
+      type: BooleanConstructor;
+      attribute: string;
+    };
+    closeOnOutsideClick: {
+      type: BooleanConstructor;
+      attribute: string;
+    };
+    boundary: {
+      type: StringConstructor;
+    };
+  };
+  open: boolean;
+  defaultOpen: boolean;
+  side: _$_videojs_core0.PopoverSide;
+  align: _$_videojs_core0.PopoverAlign;
+  closeOnEscape: boolean;
+  closeOnOutsideClick: boolean;
+  boundary: PositioningBoundary;
+  connectedCallback(): void;
+  protected firstUpdated(changed: PropertyValues): void;
+  disconnectedCallback(): void;
+  close(reason?: MenuOpenChangeReason): void;
+  protected willUpdate(changed: PropertyValues): void;
+  protected update(_changed: PropertyValues): void;
+}
+//#endregion
+export { MenuElement };
+//# sourceMappingURL=menu-element.d.ts.map

package/dist/dev/ui/menu/menu-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-element.d.ts","names":[],"sources":["../../../../src/ui/menu/menu-element.ts"],"mappings":";;;;;;cAqCa,WAAA,SAAoB,YAAA;EAAA;kBACf,OAAA;EAAA,OAEA,UAAA;;MACN,IAAA,EAAI,kBAAA;IAAA;;MACG,IAAA,EAAI,kBAAA;MAAW,SAAA;IAAA;;MACtB,IAAA,EAAI,iBAAA;IAAA;;MACH,IAAA,EAAI,iBAAA;IAAA;;MACI,IAAA,EAAI,kBAAA;MAAW,SAAA;IAAA;;MACT,IAAA,EAAI,kBAAA;MAAW,SAAA;IAAA;;MAC1B,IAAA,EAAI,iBAAA;IAAA;EAAA;EAKlB,IAAA;EACA,WAAA;EACA,IAAA,EAPkB,gBAAA,CAOd,WAAA;EACJ,KAAA,EADI,gBAAA,CACC,YAAA;EACL,aAAA;EACA,mBAAA;EACA,QAAA,EAAU,mBAAA;EA+BD,iBAAA,CAAA;EAAA,UAgDU,YAAA,CAAa,OAAA,EAAS,cAAA;EAQhC,oBAAA,CAAA;EAUT,KAAA,CAAM,MAAA,GAAQ,oBAAA;EAAA,UAIK,UAAA,CAAW,OAAA,EAAS,cAAA;EAAA,UA4BpB,MAAA,CAAO,QAAA,EAAU,cAAA;AAAA"}