@videojs/html 10.0.0-rc.2 → 10.0.0-rc.4

package/dist/dev/ui/controls/element.js

@@ -7,6 +7,10 @@ import { applyStateDataAttrs, logMissingFeature, selectControls } from "@videojs
 import { ContextProvider } from "@videojs/element/context";
 import { isFunction } from "@videojs/utils/predicate";
 //#region src/ui/controls/element.ts
+/**
+* Tracks controls visibility, reflects it as data attributes, and shares it with its descendant controls parts. Hiding
+* the controls closes any popup open inside it.
+*/
 var ControlsElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/controls/element.js.map

@@ -1 +1 @@
-{"version":3,"file":"element.js","names":["#core","#mediaState","#provider","#visible","#closeOwnedOverlays"],"sources":["../../../../src/ui/controls/element.ts"],"sourcesContent":["import { ControlsCore, ControlsDataAttrs, type ControlsVisibility, POPUP_HOST_SELECTOR } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectControls } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { isFunction } from '@videojs/utils/predicate';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/controller';\nimport { UIElement } from '../ui-element';\nimport { controlsContext } from './context';\n\nexport class ControlsElement extends UIElement {\n  static readonly tagName = 'media-controls';\n\n  static override properties = {\n    visibility: { type: String },\n  } satisfies PropertyDeclarationMap<'visibility'>;\n\n  visibility: ControlsVisibility = ControlsCore.defaultProps.visibility;\n\n  readonly #core = new ControlsCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectControls);\n  readonly #provider = new ContextProvider(this, { context: controlsContext });\n  #visible = true;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (__DEV__ && this.visibility === 'auto' && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    this.#core.setProps({ visibility: this.visibility });\n    this.#core.setMedia(this.#mediaState.value ?? null);\n\n    const state = this.#core.getState();\n    if (!state) return;\n\n    applyStateDataAttrs(this, state, ControlsDataAttrs);\n\n    this.#provider.setValue({\n      state,\n      stateAttrMap: ControlsDataAttrs,\n    });\n\n    const wasVisible = this.#visible;\n\n    this.#visible = state.visible;\n\n    if (wasVisible && !state.visible) {\n      this.#closeOwnedOverlays();\n    }\n  }\n\n  #closeOwnedOverlays(): void {\n    for (const element of this.querySelectorAll(POPUP_HOST_SELECTOR)) {\n      const host = element as Element & { close?: unknown };\n      if (!isFunction(host.close)) continue;\n\n      host.close('imperative-action');\n    }\n  }\n}\n"],"mappings":";;;;;;;;;AAWA,IAAa,kBAAb,cAAqC,UAAU;;;EAOZ,KAAA,aAAA,aAAa,aAAa;EAE1C,KAAA,QAAA,IAAI,aAAa;EACX,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,cAAc;EAC1D,KAAA,YAAA,IAAI,gBAAgB,MAAM,EAAE,SAAS,gBAAgB,CAAC;EAChE,KAAA,WAAA;;;EAXe,KAAA,UAAA;;;EAEG,KAAA,aAAA,EAC3B,YAAY,EAAE,MAAM,OAAO,EAC7B;;CAIA;CACA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EAExB,IAAe,KAAK,eAAe,UAAU,CAAC,KAAKC,YAAY,SAAS,KAAKA,YAAY,aACvF,kBAAkB,KAAK,WAAW,KAAKA,YAAY,WAAW;CAElE;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,KAAKD,MAAM,SAAS,EAAE,YAAY,KAAK,WAAW,CAAC;EACnD,KAAKA,MAAM,SAAS,KAAKC,YAAY,SAAS,IAAI;EAElD,MAAM,QAAQ,KAAKD,MAAM,SAAS;EAClC,IAAI,CAAC,OAAO;EAEZ,oBAAoB,MAAM,OAAO,iBAAiB;EAElD,KAAKE,UAAU,SAAS;GACtB;GACA,cAAc;EAChB,CAAC;EAED,MAAM,aAAa,KAAKC;EAExB,KAAKA,WAAW,MAAM;EAEtB,IAAI,cAAc,CAAC,MAAM,SACvB,KAAKC,oBAAoB;CAE7B;CAEA,sBAA4B;EAC1B,KAAK,MAAM,WAAW,KAAK,iBAAiB,mBAAmB,GAAG;GAChE,MAAM,OAAO;GACb,IAAI,CAAC,WAAW,KAAK,KAAK,GAAG;GAE7B,KAAK,MAAM,mBAAmB;EAChC;CACF;AACF"}
+{"version":3,"file":"element.js","names":["#core","#mediaState","#provider","#visible","#closeOwnedOverlays"],"sources":["../../../../src/ui/controls/element.ts"],"sourcesContent":["import { ControlsCore, ControlsDataAttrs, type ControlsVisibility, POPUP_HOST_SELECTOR } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectControls } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { isFunction } from '@videojs/utils/predicate';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/controller';\nimport { UIElement } from '../ui-element';\nimport { controlsContext } from './context';\n\n/**\n * Tracks controls visibility, reflects it as data attributes, and shares it with its descendant controls parts. Hiding\n * the controls closes any popup open inside it.\n */\nexport class ControlsElement extends UIElement {\n  static readonly tagName = 'media-controls';\n\n  static override properties = {\n    visibility: { type: String },\n  } satisfies PropertyDeclarationMap<'visibility'>;\n\n  visibility: ControlsVisibility = ControlsCore.defaultProps.visibility;\n\n  readonly #core = new ControlsCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectControls);\n  readonly #provider = new ContextProvider(this, { context: controlsContext });\n  #visible = true;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (__DEV__ && this.visibility === 'auto' && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    this.#core.setProps({ visibility: this.visibility });\n    this.#core.setMedia(this.#mediaState.value ?? null);\n\n    const state = this.#core.getState();\n    if (!state) return;\n\n    applyStateDataAttrs(this, state, ControlsDataAttrs);\n\n    this.#provider.setValue({\n      state,\n      stateAttrMap: ControlsDataAttrs,\n    });\n\n    const wasVisible = this.#visible;\n\n    this.#visible = state.visible;\n\n    if (wasVisible && !state.visible) {\n      this.#closeOwnedOverlays();\n    }\n  }\n\n  #closeOwnedOverlays(): void {\n    for (const element of this.querySelectorAll(POPUP_HOST_SELECTOR)) {\n      const host = element as Element & { close?: unknown };\n      if (!isFunction(host.close)) continue;\n\n      host.close('imperative-action');\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AAeA,IAAa,kBAAb,cAAqC,UAAU;;;EAOZ,KAAA,aAAA,aAAa,aAAa;EAE1C,KAAA,QAAA,IAAI,aAAa;EACX,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,cAAc;EAC1D,KAAA,YAAA,IAAI,gBAAgB,MAAM,EAAE,SAAS,gBAAgB,CAAC;EAChE,KAAA,WAAA;;;EAXe,KAAA,UAAA;;;EAEG,KAAA,aAAA,EAC3B,YAAY,EAAE,MAAM,OAAO,EAC7B;;CAIA;CACA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EAExB,IAAe,KAAK,eAAe,UAAU,CAAC,KAAKC,YAAY,SAAS,KAAKA,YAAY,aACvF,kBAAkB,KAAK,WAAW,KAAKA,YAAY,WAAW;CAElE;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,KAAKD,MAAM,SAAS,EAAE,YAAY,KAAK,WAAW,CAAC;EACnD,KAAKA,MAAM,SAAS,KAAKC,YAAY,SAAS,IAAI;EAElD,MAAM,QAAQ,KAAKD,MAAM,SAAS;EAClC,IAAI,CAAC,OAAO;EAEZ,oBAAoB,MAAM,OAAO,iBAAiB;EAElD,KAAKE,UAAU,SAAS;GACtB;GACA,cAAc;EAChB,CAAC;EAED,MAAM,aAAa,KAAKC;EAExB,KAAKA,WAAW,MAAM;EAEtB,IAAI,cAAc,CAAC,MAAM,SACvB,KAAKC,oBAAoB;CAE7B;CAEA,sBAA4B;EAC1B,KAAK,MAAM,WAAW,KAAK,iBAAiB,mBAAmB,GAAG;GAChE,MAAM,OAAO;GACb,IAAI,CAAC,WAAW,KAAK,KAAK,GAAG;GAE7B,KAAK,MAAM,mBAAmB;EAChC;CACF;AACF"}

package/dist/dev/ui/dialog/close.d.ts

@@ -1,6 +1,7 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/dialog/close.d.ts
+/** Button that closes its owning dialog; the element itself takes `role="button"` and keyboard focus. */
 declare class DialogCloseElement extends UIElement {
   #private;
   static readonly tagName: string;

package/dist/dev/ui/dialog/close.js

@@ -3,6 +3,7 @@ import { dialogContext } from "./context.js";
 import { applyElementProps, applyStateDataAttrs, createButton } from "@videojs/core/dom";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/dialog/close.ts
+/** Button that closes its owning dialog; the element itself takes `role="button"` and keyboard focus. */
 var DialogCloseElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/dialog/close.js.map

@@ -1 +1 @@
-{"version":3,"file":"close.js","names":["#ctx","#disconnect"],"sources":["../../../../src/ui/dialog/close.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs, createButton } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { dialogContext } from './context';\n\nexport class DialogCloseElement extends UIElement {\n  static readonly tagName: string = 'media-dialog-close';\n\n  static override properties = {\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'disabled'>;\n\n  disabled = false;\n\n  readonly #ctx = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n\n    const buttonProps = createButton({\n      onActivate: () => this.#ctx.value?.close(),\n      isDisabled: () => this.disabled,\n    });\n\n    applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n    const ctx = this.#ctx.value;\n\n    if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAOA,IAAa,qBAAb,cAAwC,UAAU;;;EAOrC,KAAA,WAAA;EAEK,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;EAC/C,KAAA,cAAA;;;EATJ,KAAA,UAAA;;;EAEL,KAAA,aAAA,EAC3B,UAAU,EAAE,MAAM,QAAQ,EAC5B;;CAIA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;EAEvC,MAAM,cAAc,aAAa;GAC/B,kBAAkB,KAAKD,KAAK,OAAO,MAAM;GACzC,kBAAkB,KAAK;EACzB,CAAC;EAED,kBAAkB,MAAM,aAAa,EAAE,QAAQ,KAAKC,YAAY,OAAO,CAAC;CAC1E;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKA,aAAa,MAAM;EACxB,KAAKA,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EACrB,MAAM,MAAM,KAAKD,KAAK;EAEtB,IAAI,KAAK,oBAAoB,MAAM,IAAI,OAAO,IAAI,YAAY;CAChE;AACF"}
+{"version":3,"file":"close.js","names":["#ctx","#disconnect"],"sources":["../../../../src/ui/dialog/close.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs, createButton } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { dialogContext } from './context';\n\n/** Button that closes its owning dialog; the element itself takes `role=\"button\"` and keyboard focus. */\nexport class DialogCloseElement extends UIElement {\n  static readonly tagName: string = 'media-dialog-close';\n\n  static override properties = {\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'disabled'>;\n\n  disabled = false;\n\n  readonly #ctx = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n\n    const buttonProps = createButton({\n      onActivate: () => this.#ctx.value?.close(),\n      isDisabled: () => this.disabled,\n    });\n\n    applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n    const ctx = this.#ctx.value;\n\n    if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;;AAQA,IAAa,qBAAb,cAAwC,UAAU;;;EAOrC,KAAA,WAAA;EAEK,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;EAC/C,KAAA,cAAA;;;EATJ,KAAA,UAAA;;;EAEL,KAAA,aAAA,EAC3B,UAAU,EAAE,MAAM,QAAQ,EAC5B;;CAIA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;EAEvC,MAAM,cAAc,aAAa;GAC/B,kBAAkB,KAAKD,KAAK,OAAO,MAAM;GACzC,kBAAkB,KAAK;EACzB,CAAC;EAED,kBAAkB,MAAM,aAAa,EAAE,QAAQ,KAAKC,YAAY,OAAO,CAAC;CAC1E;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKA,aAAa,MAAM;EACxB,KAAKA,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EACrB,MAAM,MAAM,KAAKD,KAAK;EAEtB,IAAI,KAAK,oBAAoB,MAAM,IAAI,OAAO,IAAI,YAAY;CAChE;AACF"}

package/dist/dev/ui/dialog/description.d.ts

@@ -5,6 +5,10 @@ import { DialogState } from "@videojs/core";
 import { PropertyValues } from "@videojs/element";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/dialog/description.d.ts
+/**
+ * Text announced as its owning dialog's description. The element takes the `id` that the popup's `aria-describedby`
+ * points to.
+ */
 declare class DialogDescriptionElement extends ContextPartElement<DialogState> {
   static readonly tagName: string;
   protected readonly consumer: ContextConsumer<{

package/dist/dev/ui/dialog/description.js

@@ -2,6 +2,10 @@ import { dialogContext } from "./context.js";
 import { ContextPartElement } from "../context-part-element.js";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/dialog/description.ts
+/**
+* Text announced as its owning dialog's description. The element takes the `id` that the popup's `aria-describedby`
+* points to.
+*/
 var DialogDescriptionElement = class extends ContextPartElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/dialog/description.js.map

@@ -1 +1 @@
-{"version":3,"file":"description.js","names":[],"sources":["../../../../src/ui/dialog/description.ts"],"sourcesContent":["import type { DialogState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { dialogContext } from './context';\n\nexport class DialogDescriptionElement extends ContextPartElement<DialogState> {\n  static readonly tagName: string = 'media-dialog-description';\n\n  protected readonly consumer = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const descriptionId = this.consumer.value?.state.descriptionId;\n\n    if (descriptionId) this.id = descriptionId;\n  }\n}\n"],"mappings":";;;;AAOA,IAAa,2BAAb,cAA8C,mBAAgC;;;EAG9C,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFjE,KAAA,UAAA;;CAIlC,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EACpB,MAAM,gBAAgB,KAAK,SAAS,OAAO,MAAM;EAEjD,IAAI,eAAe,KAAK,KAAK;CAC/B;AACF"}
+{"version":3,"file":"description.js","names":[],"sources":["../../../../src/ui/dialog/description.ts"],"sourcesContent":["import type { DialogState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { dialogContext } from './context';\n\n/**\n * Text announced as its owning dialog's description. The element takes the `id` that the popup's `aria-describedby`\n * points to.\n */\nexport class DialogDescriptionElement extends ContextPartElement<DialogState> {\n  static readonly tagName: string = 'media-dialog-description';\n\n  protected readonly consumer = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const descriptionId = this.consumer.value?.state.descriptionId;\n\n    if (descriptionId) this.id = descriptionId;\n  }\n}\n"],"mappings":";;;;;;;;AAWA,IAAa,2BAAb,cAA8C,mBAAgC;;;EAG9C,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFjE,KAAA,UAAA;;CAIlC,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EACpB,MAAM,gBAAgB,KAAK,SAAS,OAAO,MAAM;EAEjD,IAAI,eAAe,KAAK,KAAK;CAC/B;AACF"}

package/dist/dev/ui/dialog/title.d.ts

@@ -5,6 +5,7 @@ import { DialogState } from "@videojs/core";
 import { PropertyValues } from "@videojs/element";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/dialog/title.d.ts
+/** Text that labels its owning dialog. The element takes the `id` that the popup's `aria-labelledby` points to. */
 declare class DialogTitleElement extends ContextPartElement<DialogState> {
   static readonly tagName: string;
   protected readonly consumer: ContextConsumer<{

package/dist/dev/ui/dialog/title.js

@@ -2,6 +2,7 @@ import { dialogContext } from "./context.js";
 import { ContextPartElement } from "../context-part-element.js";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/dialog/title.ts
+/** Text that labels its owning dialog. The element takes the `id` that the popup's `aria-labelledby` points to. */
 var DialogTitleElement = class extends ContextPartElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/dialog/title.js.map

@@ -1 +1 @@
-{"version":3,"file":"title.js","names":[],"sources":["../../../../src/ui/dialog/title.ts"],"sourcesContent":["import type { DialogState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { dialogContext } from './context';\n\nexport class DialogTitleElement extends ContextPartElement<DialogState> {\n  static readonly tagName: string = 'media-dialog-title';\n\n  protected readonly consumer = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const titleId = this.consumer.value?.state.titleId;\n\n    if (titleId) this.id = titleId;\n  }\n}\n"],"mappings":";;;;AAOA,IAAa,qBAAb,cAAwC,mBAAgC;;;EAGxC,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFjE,KAAA,UAAA;;CAIlC,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EACpB,MAAM,UAAU,KAAK,SAAS,OAAO,MAAM;EAE3C,IAAI,SAAS,KAAK,KAAK;CACzB;AACF"}
+{"version":3,"file":"title.js","names":[],"sources":["../../../../src/ui/dialog/title.ts"],"sourcesContent":["import type { DialogState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { dialogContext } from './context';\n\n/** Text that labels its owning dialog. The element takes the `id` that the popup's `aria-labelledby` points to. */\nexport class DialogTitleElement extends ContextPartElement<DialogState> {\n  static readonly tagName: string = 'media-dialog-title';\n\n  protected readonly consumer = new ContextConsumer(this, { context: dialogContext, subscribe: true });\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const titleId = this.consumer.value?.state.titleId;\n\n    if (titleId) this.id = titleId;\n  }\n}\n"],"mappings":";;;;;AAQA,IAAa,qBAAb,cAAwC,mBAAgC;;;EAGxC,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFjE,KAAA,UAAA;;CAIlC,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EACpB,MAAM,UAAU,KAAK,SAAS,OAAO,MAAM;EAE3C,IAAI,SAAS,KAAK,KAAK;CACzB;AACF"}

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

@@ -1,7 +1,12 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/checkbox-item.d.ts
-/** @fires checked-change - Fired when the checked state changes. */
+/**
+ * Menu item that toggles `checked` when activated and leaves the menu open. The element itself takes
+ * `role="menuitemcheckbox"`.
+ *
+ * @fires checked-change - Fired when the checked state changes.
+ */
 declare class MenuCheckboxItemElement extends UIElement {
   #private;
   static readonly tagName = "media-menu-checkbox-item";

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

@@ -3,7 +3,12 @@ import { menuContext } from "./context.js";
 import { applyElementProps } from "@videojs/core/dom";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/menu/checkbox-item.ts
-/** @fires checked-change - Fired when the checked state changes. */
+/**
+* Menu item that toggles `checked` when activated and leaves the menu open. The element itself takes
+* `role="menuitemcheckbox"`.
+*
+* @fires checked-change - Fired when the checked state changes.
+*/
 var MenuCheckboxItemElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

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

@@ -1 +1 @@
-{"version":3,"file":"checkbox-item.js","names":["#ctx","#disconnect","#registered","#cleanupRegistration"],"sources":["../../../../src/ui/menu/checkbox-item.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuContext } from './context';\n\n/** @fires checked-change - Fired when the checked state changes. */\nexport class MenuCheckboxItemElement extends UIElement {\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\n            if (!this.disabled) currentCtx?.menu.highlight(this, { focus: false, pointer: true });\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}\n"],"mappings":";;;;;;AAQA,IAAa,0BAAb,cAA6C,UAAU;;;EAQ3C,KAAA,UAAA;EACC,KAAA,WAAA;EAEK,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAE7C,KAAA,cAAA;EACxB,KAAA,cAAA;EAC8B,KAAA,uBAAA;;;EAdlB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,SAAS,EAAE,MAAM,QAAQ;GACzB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CAKA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;EACvC,KAAKC,cAAc;CACrB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;EACnB,KAAKC,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKF,KAAK;EACtB,IAAI,CAAC,OAAO,CAAC,KAAKC,aAAa;EAE/B,IAAI,CAAC,KAAKC,aAAa;GACrB,KAAKA,cAAc;GAEnB,KAAKC,uBAAuB,IAAI,KAAK,aAAa,IAAI;GAEtD,kBACE,MACA;IACE,eAAe;KAEb,IAAI,CADe,KAAKH,KAAK,SACV,KAAK,UAAU;KAElC,KAAK,UAAU,CAAC,KAAK;KACrB,KAAK,cAAc,IAAI,YAAY,kBAAkB;MAAE,QAAQ,EAAE,SAAS,KAAK,QAAQ;MAAG,SAAS;KAAK,CAAC,CAAC;IAC5G;IACA,sBAAsB;KACpB,MAAM,aAAa,KAAKA,KAAK;KAE7B,IAAI,CAAC,KAAK,UAAU,YAAY,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IACtF;GACF,GACA,EAAE,QAAQ,KAAKC,YAAY,OAAO,CACpC;EACF;EAEA,kBAAkB,MAAM;GACtB,MAAM;GACN,gBAAgB,OAAO,KAAK,OAAO;GACnC,iBAAiB,KAAK,WAAW,SAAS,KAAA;EAC5C,CAAC;CACH;AACF"}
+{"version":3,"file":"checkbox-item.js","names":["#ctx","#disconnect","#registered","#cleanupRegistration"],"sources":["../../../../src/ui/menu/checkbox-item.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuContext } from './context';\n\n/**\n * Menu item that toggles `checked` when activated and leaves the menu open. The element itself takes\n * `role=\"menuitemcheckbox\"`.\n *\n * @fires checked-change - Fired when the checked state changes.\n */\nexport class MenuCheckboxItemElement extends UIElement {\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\n            if (!this.disabled) currentCtx?.menu.highlight(this, { focus: false, pointer: true });\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}\n"],"mappings":";;;;;;;;;;;AAaA,IAAa,0BAAb,cAA6C,UAAU;;;EAQ3C,KAAA,UAAA;EACC,KAAA,WAAA;EAEK,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAE7C,KAAA,cAAA;EACxB,KAAA,cAAA;EAC8B,KAAA,uBAAA;;;EAdlB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,SAAS,EAAE,MAAM,QAAQ;GACzB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CAKA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;EACvC,KAAKC,cAAc;CACrB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;EACnB,KAAKC,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKF,KAAK;EACtB,IAAI,CAAC,OAAO,CAAC,KAAKC,aAAa;EAE/B,IAAI,CAAC,KAAKC,aAAa;GACrB,KAAKA,cAAc;GAEnB,KAAKC,uBAAuB,IAAI,KAAK,aAAa,IAAI;GAEtD,kBACE,MACA;IACE,eAAe;KAEb,IAAI,CADe,KAAKH,KAAK,SACV,KAAK,UAAU;KAElC,KAAK,UAAU,CAAC,KAAK;KACrB,KAAK,cAAc,IAAI,YAAY,kBAAkB;MAAE,QAAQ,EAAE,SAAS,KAAK,QAAQ;MAAG,SAAS;KAAK,CAAC,CAAC;IAC5G;IACA,sBAAsB;KACpB,MAAM,aAAa,KAAKA,KAAK;KAE7B,IAAI,CAAC,KAAK,UAAU,YAAY,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IACtF;GACF,GACA,EAAE,QAAQ,KAAKC,YAAY,OAAO,CACpC;EACF;EAEA,kBAAkB,MAAM;GACtB,MAAM;GACN,gBAAgB,OAAO,KAAK,OAAO;GACnC,iBAAiB,KAAK,WAAW,SAAS,KAAA;EAC5C,CAAC;CACH;AACF"}

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

@@ -163,7 +163,7 @@ var MenuContentElement = class MenuContentElement extends UIElement {
 			applyElementProps(trigger, this.#core.getTriggerAttrs(state, active ? this.id : void 0));
 			this.#syncOptionState(trigger);
 		}
-		if (isSubmenu && active && !this.#wasActive) menu.highlightFirstItem({ preventScroll: true });
+		if (isSubmenu && active && !this.#wasActive) menu.highlightInitialItem({ preventScroll: true });
 		this.#wasActive = active;
 		this.#context = {
 			core: this.#core,

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

@@ -1 +1 @@
-{"version":3,"file":"content.js","names":["#menu","#parentMenu","#optionStates","#optionState","#syncOptionState","#findTrigger","#optionParent","#optionSource","#root","#provider","#core","#generatedId","#context","#normalizing","#disconnect","#handleKeyDown","#handleFocusOut","#cleanupMenu","#ownsMenu","#rootMenu","#setupMenu","#setOptionParent","#wasActive","#setOptionState","#normalize","#cleanupParentRegistration","#cleanupRegistration","#clearOptionState","#stateTrigger","#triggerWasDisabled","#triggerWasHidden"],"sources":["../../../../src/ui/menu/content.ts"],"sourcesContent":["import { MenuContentDataAttrs, MenuCore, type MenuOptionState, resolveMenuOptionState } from '@videojs/core';\nimport {\n  applyElementProps,\n  applyStateDataAttrs,\n  createMenu,\n  createTransition,\n  isMenuNavigationKey,\n  type MenuApi,\n  type MenuChangeDetails,\n  type MenuOpenChangeReason,\n  type UIKeyboardEvent,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer, ContextProvider } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { type MenuContextValue, menuContext } from './context';\nlet idCounter = 0;\n\n/** One accessible menu page. Root and nested pages are sibling children of `<media-menu>`. */\nexport class MenuContentElement extends UIElement {\n  static readonly tagName = 'media-menu-content';\n\n  static override properties = {\n    open: { type: Boolean },\n    defaultOpen: { type: Boolean, attribute: 'default-open' },\n  } satisfies PropertyDeclarationMap<'open' | 'defaultOpen'>;\n\n  open = false;\n  defaultOpen = false;\n\n  readonly #root = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #provider = new ContextProvider(this, { context: menuContext });\n  readonly #core = new MenuCore();\n  readonly #generatedId = `vjs-menu-content-${idCounter++}`;\n  #context: MenuContextValue | null = null;\n  #menu: MenuApi | null = null;\n  #parentMenu: MenuApi | null = null;\n  #rootMenu: MenuApi | null = null;\n  #ownsMenu = false;\n  #disconnect: AbortController | null = null;\n  #cleanupRegistration: (() => void) | null = null;\n  #cleanupParentRegistration: (() => void) | null = null;\n  readonly #optionStates = new Map<symbol, MenuOptionState>();\n  readonly #optionSource = Symbol('menu');\n  #optionState: MenuOptionState | null = null;\n  #optionParent: MenuContextValue | null = null;\n  #stateTrigger: HTMLElement | null = null;\n  #triggerWasDisabled = false;\n  #triggerWasHidden = false;\n  #wasActive = false;\n  #normalizing = false;\n\n  get context(): MenuContextValue | null {\n    return this.#context;\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (this.#normalizing) return;\n\n    this.#disconnect = new AbortController();\n    applyElementProps(\n      this,\n      { onKeyDown: this.#handleKeyDown, onFocusOut: this.#handleFocusOut },\n      { signal: this.#disconnect.signal }\n    );\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    if (this.#normalizing) return;\n\n    this.#cleanupMenu();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  openMenu(reason: MenuOpenChangeReason = 'imperative-action'): void {\n    this.#menu?.open(reason);\n  }\n\n  close(reason: MenuOpenChangeReason = 'imperative-action'): void {\n    this.#menu?.close(reason);\n  }\n\n  protected override willUpdate(changed: PropertyValues): void {\n    super.willUpdate(changed);\n\n    if (!this.hasUpdated && this.defaultOpen && !this.open) this.open = true;\n\n    if (this.#ownsMenu && this.#menu && changed.has('open')) this.#menu.syncOpen(this.open);\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const root = this.#root.value ?? null;\n    if (!root) return;\n\n    if (!this.id) this.id = this.#generatedId;\n\n    const trigger = this.#findTrigger();\n    const parentContent = trigger?.closest<MenuContentElement>(MenuContentElement.tagName) ?? null;\n\n    if (parentContent && !parentContent.context) {\n      this.hidden = true;\n      requestAnimationFrame(() => this.requestUpdate());\n      return;\n    }\n\n    const parentMenu = parentContent?.context?.menu ?? null;\n    const isSubmenu = parentMenu !== null;\n\n    if (root.menu !== this.#rootMenu || parentMenu !== this.#parentMenu) {\n      this.#cleanupMenu();\n      this.#rootMenu = root.menu;\n      this.#parentMenu = parentMenu;\n      this.#setupMenu(root, parentMenu);\n    }\n\n    this.#setOptionParent(parentContent?.context ?? root);\n\n    const menu = this.#menu;\n    if (!menu) return;\n\n    const input = menu.input.current;\n\n    this.#core.setInput({ ...input, isSubmenu });\n    const state = this.#core.getState();\n    const active = !isSubmenu || state.open || state.status === 'ending';\n\n    applyElementProps(this, {\n      ...this.#core.getContentAttrs(),\n      hidden: !active,\n    });\n    applyStateDataAttrs(this, state, MenuContentDataAttrs);\n\n    if (trigger) {\n      menu.setTriggerElement(trigger);\n      applyElementProps(trigger, this.#core.getTriggerAttrs(state, active ? this.id : undefined));\n      this.#syncOptionState(trigger);\n    }\n\n    if (isSubmenu && active && !this.#wasActive) menu.highlightFirstItem({ preventScroll: true });\n\n    this.#wasActive = active;\n\n    this.#context = {\n      core: this.#core,\n      menu,\n      popup: root.popup,\n      state,\n      setOptionState: this.#setOptionState,\n    };\n    this.#provider.setValue(this.#context);\n    root.popup.sync();\n    this.#normalize();\n  }\n\n  #setupMenu(root: MenuContextValue, parentMenu: MenuApi | null): void {\n    const isSubmenu = parentMenu !== null;\n\n    if (isSubmenu) {\n      this.#ownsMenu = true;\n      this.#menu = createMenu({\n        transition: createTransition(),\n        onOpenChange: (nextOpen: boolean, details: MenuChangeDetails) => {\n          const accepted = this.dispatchEvent(\n            new CustomEvent('open-change', {\n              bubbles: true,\n              cancelable: true,\n              composed: true,\n              detail: { open: nextOpen, ...details },\n            })\n          );\n\n          if (accepted) this.open = nextOpen;\n        },\n        closeOnEscape: () => true,\n        closeOnOutsideClick: () => false,\n      });\n      this.#menu.setPopupElement(this);\n      this.#cleanupParentRegistration = parentMenu.registerSubmenu(this.#menu);\n      const signal = this.#disconnect?.signal;\n\n      if (signal) this.#menu.input.subscribe(() => this.requestUpdate(), { signal });\n\n      this.#menu.syncOpen(this.open);\n    } else {\n      this.#ownsMenu = false;\n      this.#menu = root.menu;\n    }\n\n    this.#cleanupRegistration = root.popup.registerContent({\n      menu: this.#menu,\n      parent: parentMenu,\n      element: this,\n    });\n  }\n\n  #cleanupMenu(): void {\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#cleanupParentRegistration?.();\n    this.#cleanupParentRegistration = null;\n    this.#setOptionParent(null);\n    this.#clearOptionState();\n    this.#optionStates.clear();\n    this.#optionState = null;\n\n    if (this.#ownsMenu) this.#menu?.destroy();\n\n    this.#menu = null;\n    this.#context = null;\n    this.#rootMenu = null;\n    this.#parentMenu = null;\n    this.#ownsMenu = false;\n    this.#wasActive = false;\n  }\n\n  #findTrigger(): HTMLElement | null {\n    if (!this.id) return null;\n\n    const root = this.getRootNode() as Document | ShadowRoot;\n\n    return (\n      [...root.querySelectorAll<HTMLElement>('[commandfor], media-menu-item')].find(\n        (element) =>\n          element.getAttribute('commandfor') === this.id ||\n          (element as HTMLElement & { commandfor?: string }).commandfor === this.id\n      ) ?? null\n    );\n  }\n\n  /** Keep every page as a direct popup child, including authored nested pages. */\n  #normalize(): void {\n    const popup = this.closest('media-menu');\n    if (!popup || this.parentElement === popup) return;\n\n    this.#normalizing = true;\n    popup.append(this);\n    this.#normalizing = false;\n  }\n\n  #handleKeyDown = (event: UIKeyboardEvent): void => {\n    const isNavigationKey = isMenuNavigationKey(event);\n    const defaultPrevented = event.defaultPrevented;\n\n    this.#menu?.contentProps.onKeyDown(event);\n\n    if (this.#parentMenu && (event.key === 'ArrowLeft' || event.key === 'Escape') && !defaultPrevented) {\n      event.preventDefault();\n      this.#menu?.close('escape');\n    }\n\n    if (event.key !== 'Escape' && isNavigationKey) event.stopPropagation();\n  };\n\n  #handleFocusOut = (event: FocusEvent): void => {\n    this.#menu?.contentProps.onFocusOut(event);\n  };\n\n  #setOptionState = (source: symbol, optionState: MenuOptionState | null): void => {\n    const previous = this.#optionStates.get(source);\n    if (optionState && isSameOptionState(previous, optionState)) return;\n\n    if (!optionState && !previous) return;\n\n    if (optionState) this.#optionStates.set(source, optionState);\n    else this.#optionStates.delete(source);\n\n    this.#optionState = resolveMenuOptionState(this.#optionStates.values());\n\n    if ((this.#optionState?.disabled || this.#optionState?.hidden) && this.open && this.#parentMenu) {\n      this.close('imperative-action');\n    }\n\n    this.#syncOptionState(this.#findTrigger());\n    this.#optionParent?.setOptionState(this.#optionSource, this.#optionState);\n  };\n\n  #setOptionParent(parent: MenuContextValue | null): void {\n    if (parent?.menu === this.#optionParent?.menu) {\n      this.#optionParent = parent;\n      return;\n    }\n\n    this.#optionParent?.setOptionState(this.#optionSource, null);\n    this.#optionParent = parent;\n    this.#optionParent?.setOptionState(this.#optionSource, this.#optionState);\n  }\n\n  #syncOptionState(trigger: HTMLElement | null): void {\n    if (trigger !== this.#stateTrigger) {\n      this.#clearOptionState();\n      this.#stateTrigger = trigger;\n      this.#triggerWasDisabled = trigger ? isTriggerExplicitlyDisabled(trigger) : false;\n      this.#triggerWasHidden = trigger?.hidden === true;\n    }\n\n    if (!trigger) return;\n\n    const disabled = this.#optionState?.disabled || this.#triggerWasDisabled;\n\n    applyElementProps(trigger, {\n      disabled: disabled || undefined,\n      'aria-disabled': disabled ? 'true' : undefined,\n      'data-availability': this.#optionState?.availability,\n      hidden: this.#triggerWasHidden || this.#optionState?.hidden || undefined,\n    });\n    const value = trigger.querySelector<HTMLElement>('[data-part~=\"value\"], [data-part~=\"hint\"]');\n\n    if (value && value.textContent !== this.#optionState?.value) value.textContent = this.#optionState?.value ?? '';\n  }\n\n  #clearOptionState(): void {\n    const trigger = this.#stateTrigger;\n    if (!trigger) return;\n\n    applyElementProps(trigger, {\n      disabled: this.#triggerWasDisabled || undefined,\n      'aria-disabled': this.#triggerWasDisabled ? 'true' : undefined,\n      'data-availability': undefined,\n      hidden: this.#triggerWasHidden || undefined,\n    });\n    const value = trigger.querySelector<HTMLElement>('[data-part~=\"value\"], [data-part~=\"hint\"]');\n\n    if (value?.textContent) value.textContent = '';\n\n    this.#stateTrigger = null;\n    this.#triggerWasDisabled = false;\n    this.#triggerWasHidden = false;\n  }\n}\n\nfunction isSameOptionState(a: MenuOptionState | undefined, b: MenuOptionState): boolean {\n  return (\n    a?.value === b.value && a.disabled === b.disabled && a.hidden === b.hidden && a.availability === b.availability\n  );\n}\n\nfunction isTriggerExplicitlyDisabled(trigger: HTMLElement): boolean {\n  return (\n    trigger.hasAttribute('disabled') ||\n    ('disabled' in trigger && (trigger as HTMLElement & { disabled?: boolean }).disabled === true)\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"content.js","names":["#menu","#parentMenu","#optionStates","#optionState","#syncOptionState","#findTrigger","#optionParent","#optionSource","#root","#provider","#core","#generatedId","#context","#normalizing","#disconnect","#handleKeyDown","#handleFocusOut","#cleanupMenu","#ownsMenu","#rootMenu","#setupMenu","#setOptionParent","#wasActive","#setOptionState","#normalize","#cleanupParentRegistration","#cleanupRegistration","#clearOptionState","#stateTrigger","#triggerWasDisabled","#triggerWasHidden"],"sources":["../../../../src/ui/menu/content.ts"],"sourcesContent":["import { MenuContentDataAttrs, MenuCore, type MenuOptionState, resolveMenuOptionState } from '@videojs/core';\nimport {\n  applyElementProps,\n  applyStateDataAttrs,\n  createMenu,\n  createTransition,\n  isMenuNavigationKey,\n  type MenuApi,\n  type MenuChangeDetails,\n  type MenuOpenChangeReason,\n  type UIKeyboardEvent,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer, ContextProvider } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { type MenuContextValue, menuContext } from './context';\nlet idCounter = 0;\n\n/** One accessible menu page. Root and nested pages are sibling children of `<media-menu>`. */\nexport class MenuContentElement extends UIElement {\n  static readonly tagName = 'media-menu-content';\n\n  static override properties = {\n    open: { type: Boolean },\n    defaultOpen: { type: Boolean, attribute: 'default-open' },\n  } satisfies PropertyDeclarationMap<'open' | 'defaultOpen'>;\n\n  open = false;\n  defaultOpen = false;\n\n  readonly #root = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #provider = new ContextProvider(this, { context: menuContext });\n  readonly #core = new MenuCore();\n  readonly #generatedId = `vjs-menu-content-${idCounter++}`;\n  #context: MenuContextValue | null = null;\n  #menu: MenuApi | null = null;\n  #parentMenu: MenuApi | null = null;\n  #rootMenu: MenuApi | null = null;\n  #ownsMenu = false;\n  #disconnect: AbortController | null = null;\n  #cleanupRegistration: (() => void) | null = null;\n  #cleanupParentRegistration: (() => void) | null = null;\n  readonly #optionStates = new Map<symbol, MenuOptionState>();\n  readonly #optionSource = Symbol('menu');\n  #optionState: MenuOptionState | null = null;\n  #optionParent: MenuContextValue | null = null;\n  #stateTrigger: HTMLElement | null = null;\n  #triggerWasDisabled = false;\n  #triggerWasHidden = false;\n  #wasActive = false;\n  #normalizing = false;\n\n  get context(): MenuContextValue | null {\n    return this.#context;\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (this.#normalizing) return;\n\n    this.#disconnect = new AbortController();\n    applyElementProps(\n      this,\n      { onKeyDown: this.#handleKeyDown, onFocusOut: this.#handleFocusOut },\n      { signal: this.#disconnect.signal }\n    );\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    if (this.#normalizing) return;\n\n    this.#cleanupMenu();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  openMenu(reason: MenuOpenChangeReason = 'imperative-action'): void {\n    this.#menu?.open(reason);\n  }\n\n  close(reason: MenuOpenChangeReason = 'imperative-action'): void {\n    this.#menu?.close(reason);\n  }\n\n  protected override willUpdate(changed: PropertyValues): void {\n    super.willUpdate(changed);\n\n    if (!this.hasUpdated && this.defaultOpen && !this.open) this.open = true;\n\n    if (this.#ownsMenu && this.#menu && changed.has('open')) this.#menu.syncOpen(this.open);\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n    const root = this.#root.value ?? null;\n    if (!root) return;\n\n    if (!this.id) this.id = this.#generatedId;\n\n    const trigger = this.#findTrigger();\n    const parentContent = trigger?.closest<MenuContentElement>(MenuContentElement.tagName) ?? null;\n\n    if (parentContent && !parentContent.context) {\n      this.hidden = true;\n      requestAnimationFrame(() => this.requestUpdate());\n      return;\n    }\n\n    const parentMenu = parentContent?.context?.menu ?? null;\n    const isSubmenu = parentMenu !== null;\n\n    if (root.menu !== this.#rootMenu || parentMenu !== this.#parentMenu) {\n      this.#cleanupMenu();\n      this.#rootMenu = root.menu;\n      this.#parentMenu = parentMenu;\n      this.#setupMenu(root, parentMenu);\n    }\n\n    this.#setOptionParent(parentContent?.context ?? root);\n\n    const menu = this.#menu;\n    if (!menu) return;\n\n    const input = menu.input.current;\n\n    this.#core.setInput({ ...input, isSubmenu });\n    const state = this.#core.getState();\n    const active = !isSubmenu || state.open || state.status === 'ending';\n\n    applyElementProps(this, {\n      ...this.#core.getContentAttrs(),\n      hidden: !active,\n    });\n    applyStateDataAttrs(this, state, MenuContentDataAttrs);\n\n    if (trigger) {\n      menu.setTriggerElement(trigger);\n      applyElementProps(trigger, this.#core.getTriggerAttrs(state, active ? this.id : undefined));\n      this.#syncOptionState(trigger);\n    }\n\n    if (isSubmenu && active && !this.#wasActive) menu.highlightInitialItem({ preventScroll: true });\n\n    this.#wasActive = active;\n\n    this.#context = {\n      core: this.#core,\n      menu,\n      popup: root.popup,\n      state,\n      setOptionState: this.#setOptionState,\n    };\n    this.#provider.setValue(this.#context);\n    root.popup.sync();\n    this.#normalize();\n  }\n\n  #setupMenu(root: MenuContextValue, parentMenu: MenuApi | null): void {\n    const isSubmenu = parentMenu !== null;\n\n    if (isSubmenu) {\n      this.#ownsMenu = true;\n      this.#menu = createMenu({\n        transition: createTransition(),\n        onOpenChange: (nextOpen: boolean, details: MenuChangeDetails) => {\n          const accepted = this.dispatchEvent(\n            new CustomEvent('open-change', {\n              bubbles: true,\n              cancelable: true,\n              composed: true,\n              detail: { open: nextOpen, ...details },\n            })\n          );\n\n          if (accepted) this.open = nextOpen;\n        },\n        closeOnEscape: () => true,\n        closeOnOutsideClick: () => false,\n      });\n      this.#menu.setPopupElement(this);\n      this.#cleanupParentRegistration = parentMenu.registerSubmenu(this.#menu);\n      const signal = this.#disconnect?.signal;\n\n      if (signal) this.#menu.input.subscribe(() => this.requestUpdate(), { signal });\n\n      this.#menu.syncOpen(this.open);\n    } else {\n      this.#ownsMenu = false;\n      this.#menu = root.menu;\n    }\n\n    this.#cleanupRegistration = root.popup.registerContent({\n      menu: this.#menu,\n      parent: parentMenu,\n      element: this,\n    });\n  }\n\n  #cleanupMenu(): void {\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#cleanupParentRegistration?.();\n    this.#cleanupParentRegistration = null;\n    this.#setOptionParent(null);\n    this.#clearOptionState();\n    this.#optionStates.clear();\n    this.#optionState = null;\n\n    if (this.#ownsMenu) this.#menu?.destroy();\n\n    this.#menu = null;\n    this.#context = null;\n    this.#rootMenu = null;\n    this.#parentMenu = null;\n    this.#ownsMenu = false;\n    this.#wasActive = false;\n  }\n\n  #findTrigger(): HTMLElement | null {\n    if (!this.id) return null;\n\n    const root = this.getRootNode() as Document | ShadowRoot;\n\n    return (\n      [...root.querySelectorAll<HTMLElement>('[commandfor], media-menu-item')].find(\n        (element) =>\n          element.getAttribute('commandfor') === this.id ||\n          (element as HTMLElement & { commandfor?: string }).commandfor === this.id\n      ) ?? null\n    );\n  }\n\n  /** Keep every page as a direct popup child, including authored nested pages. */\n  #normalize(): void {\n    const popup = this.closest('media-menu');\n    if (!popup || this.parentElement === popup) return;\n\n    this.#normalizing = true;\n    popup.append(this);\n    this.#normalizing = false;\n  }\n\n  #handleKeyDown = (event: UIKeyboardEvent): void => {\n    const isNavigationKey = isMenuNavigationKey(event);\n    const defaultPrevented = event.defaultPrevented;\n\n    this.#menu?.contentProps.onKeyDown(event);\n\n    if (this.#parentMenu && (event.key === 'ArrowLeft' || event.key === 'Escape') && !defaultPrevented) {\n      event.preventDefault();\n      this.#menu?.close('escape');\n    }\n\n    if (event.key !== 'Escape' && isNavigationKey) event.stopPropagation();\n  };\n\n  #handleFocusOut = (event: FocusEvent): void => {\n    this.#menu?.contentProps.onFocusOut(event);\n  };\n\n  #setOptionState = (source: symbol, optionState: MenuOptionState | null): void => {\n    const previous = this.#optionStates.get(source);\n    if (optionState && isSameOptionState(previous, optionState)) return;\n\n    if (!optionState && !previous) return;\n\n    if (optionState) this.#optionStates.set(source, optionState);\n    else this.#optionStates.delete(source);\n\n    this.#optionState = resolveMenuOptionState(this.#optionStates.values());\n\n    if ((this.#optionState?.disabled || this.#optionState?.hidden) && this.open && this.#parentMenu) {\n      this.close('imperative-action');\n    }\n\n    this.#syncOptionState(this.#findTrigger());\n    this.#optionParent?.setOptionState(this.#optionSource, this.#optionState);\n  };\n\n  #setOptionParent(parent: MenuContextValue | null): void {\n    if (parent?.menu === this.#optionParent?.menu) {\n      this.#optionParent = parent;\n      return;\n    }\n\n    this.#optionParent?.setOptionState(this.#optionSource, null);\n    this.#optionParent = parent;\n    this.#optionParent?.setOptionState(this.#optionSource, this.#optionState);\n  }\n\n  #syncOptionState(trigger: HTMLElement | null): void {\n    if (trigger !== this.#stateTrigger) {\n      this.#clearOptionState();\n      this.#stateTrigger = trigger;\n      this.#triggerWasDisabled = trigger ? isTriggerExplicitlyDisabled(trigger) : false;\n      this.#triggerWasHidden = trigger?.hidden === true;\n    }\n\n    if (!trigger) return;\n\n    const disabled = this.#optionState?.disabled || this.#triggerWasDisabled;\n\n    applyElementProps(trigger, {\n      disabled: disabled || undefined,\n      'aria-disabled': disabled ? 'true' : undefined,\n      'data-availability': this.#optionState?.availability,\n      hidden: this.#triggerWasHidden || this.#optionState?.hidden || undefined,\n    });\n    const value = trigger.querySelector<HTMLElement>('[data-part~=\"value\"], [data-part~=\"hint\"]');\n\n    if (value && value.textContent !== this.#optionState?.value) value.textContent = this.#optionState?.value ?? '';\n  }\n\n  #clearOptionState(): void {\n    const trigger = this.#stateTrigger;\n    if (!trigger) return;\n\n    applyElementProps(trigger, {\n      disabled: this.#triggerWasDisabled || undefined,\n      'aria-disabled': this.#triggerWasDisabled ? 'true' : undefined,\n      'data-availability': undefined,\n      hidden: this.#triggerWasHidden || undefined,\n    });\n    const value = trigger.querySelector<HTMLElement>('[data-part~=\"value\"], [data-part~=\"hint\"]');\n\n    if (value?.textContent) value.textContent = '';\n\n    this.#stateTrigger = null;\n    this.#triggerWasDisabled = false;\n    this.#triggerWasHidden = false;\n  }\n}\n\nfunction isSameOptionState(a: MenuOptionState | undefined, b: MenuOptionState): boolean {\n  return (\n    a?.value === b.value && a.disabled === b.disabled && a.hidden === b.hidden && a.availability === b.availability\n  );\n}\n\nfunction isTriggerExplicitlyDisabled(trigger: HTMLElement): boolean {\n  return (\n    trigger.hasAttribute('disabled') ||\n    ('disabled' in trigger && (trigger as HTMLElement & { disabled?: boolean }).disabled === true)\n  );\n}\n"],"mappings":"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"}

package/dist/dev/ui/menu/group-label.d.ts

@@ -1,6 +1,7 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/group-label.d.ts
+/** Non-interactive label that names its enclosing `<media-menu-group>` or `<media-menu-radio-group>`. */
 declare class MenuGroupLabelElement extends UIElement {
   #private;
   static readonly tagName = "media-menu-group-label";

package/dist/dev/ui/menu/group-label.js

@@ -3,6 +3,7 @@ import { menuGroupContext } from "./context.js";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/menu/group-label.ts
 let idCounter = 0;
+/** Non-interactive label that names its enclosing `<media-menu-group>` or `<media-menu-radio-group>`. */
 var MenuGroupLabelElement = class extends UIElement {
 	static {
 		this.tagName = "media-menu-group-label";

package/dist/dev/ui/menu/group-label.js.map

@@ -1 +1 @@
-{"version":3,"file":"group-label.js","names":["#groupCtx","#generatedId","#cleanupRegistration","#registeredId","#registerLabel"],"sources":["../../../../src/ui/menu/group-label.ts"],"sourcesContent":["import type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuGroupContext } from './context';\n\nlet idCounter = 0;\n\nexport class MenuGroupLabelElement extends UIElement {\n  static readonly tagName = 'media-menu-group-label';\n\n  readonly #groupCtx = new ContextConsumer(this, { context: menuGroupContext, subscribe: true });\n  readonly #generatedId = `vjs-menu-group-label-${idCounter++}`;\n\n  #cleanupRegistration: (() => void) | null = null;\n  #registeredId: string | null = null;\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#registeredId = null;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    if (!this.id) {\n      this.id = this.#generatedId;\n    }\n\n    this.#registerLabel();\n  }\n\n  #registerLabel(): void {\n    const groupCtx = this.#groupCtx.value;\n\n    if (!groupCtx) {\n      this.#cleanupRegistration?.();\n      this.#cleanupRegistration = null;\n      this.#registeredId = null;\n      return;\n    }\n\n    if (this.#registeredId === this.id) return;\n\n    this.#cleanupRegistration?.();\n    this.#registeredId = this.id;\n    this.#cleanupRegistration = groupCtx.registerLabel(this.id);\n  }\n}\n"],"mappings":";;;;AAMA,IAAI,YAAY;AAEhB,IAAa,wBAAb,cAA2C,UAAU;;EACzB,KAAA,UAAA;;CAE1B,YAAqB,IAAI,gBAAgB,MAAM;EAAE,SAAS;EAAkB,WAAW;CAAK,CAAC;CAC7F,eAAwB,wBAAwB;CAEhD,uBAA4C;CAC5C,gBAA+B;CAE/B,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKE,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKC,gBAAgB;CACvB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,IAAI,CAAC,KAAK,IACR,KAAK,KAAK,KAAKF;EAGjB,KAAKG,eAAe;CACtB;CAEA,iBAAuB;EACrB,MAAM,WAAW,KAAKJ,UAAU;EAEhC,IAAI,CAAC,UAAU;GACb,KAAKE,uBAAuB;GAC5B,KAAKA,uBAAuB;GAC5B,KAAKC,gBAAgB;GACrB;EACF;EAEA,IAAI,KAAKA,kBAAkB,KAAK,IAAI;EAEpC,KAAKD,uBAAuB;EAC5B,KAAKC,gBAAgB,KAAK;EAC1B,KAAKD,uBAAuB,SAAS,cAAc,KAAK,EAAE;CAC5D;AACF"}
+{"version":3,"file":"group-label.js","names":["#groupCtx","#generatedId","#cleanupRegistration","#registeredId","#registerLabel"],"sources":["../../../../src/ui/menu/group-label.ts"],"sourcesContent":["import type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuGroupContext } from './context';\n\nlet idCounter = 0;\n\n/** Non-interactive label that names its enclosing `<media-menu-group>` or `<media-menu-radio-group>`. */\nexport class MenuGroupLabelElement extends UIElement {\n  static readonly tagName = 'media-menu-group-label';\n\n  readonly #groupCtx = new ContextConsumer(this, { context: menuGroupContext, subscribe: true });\n  readonly #generatedId = `vjs-menu-group-label-${idCounter++}`;\n\n  #cleanupRegistration: (() => void) | null = null;\n  #registeredId: string | null = null;\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#registeredId = null;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    if (!this.id) {\n      this.id = this.#generatedId;\n    }\n\n    this.#registerLabel();\n  }\n\n  #registerLabel(): void {\n    const groupCtx = this.#groupCtx.value;\n\n    if (!groupCtx) {\n      this.#cleanupRegistration?.();\n      this.#cleanupRegistration = null;\n      this.#registeredId = null;\n      return;\n    }\n\n    if (this.#registeredId === this.id) return;\n\n    this.#cleanupRegistration?.();\n    this.#registeredId = this.id;\n    this.#cleanupRegistration = groupCtx.registerLabel(this.id);\n  }\n}\n"],"mappings":";;;;AAMA,IAAI,YAAY;;AAGhB,IAAa,wBAAb,cAA2C,UAAU;;EACzB,KAAA,UAAA;;CAE1B,YAAqB,IAAI,gBAAgB,MAAM;EAAE,SAAS;EAAkB,WAAW;CAAK,CAAC;CAC7F,eAAwB,wBAAwB;CAEhD,uBAA4C;CAC5C,gBAA+B;CAE/B,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKE,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKC,gBAAgB;CACvB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,IAAI,CAAC,KAAK,IACR,KAAK,KAAK,KAAKF;EAGjB,KAAKG,eAAe;CACtB;CAEA,iBAAuB;EACrB,MAAM,WAAW,KAAKJ,UAAU;EAEhC,IAAI,CAAC,UAAU;GACb,KAAKE,uBAAuB;GAC5B,KAAKA,uBAAuB;GAC5B,KAAKC,gBAAgB;GACrB;EACF;EAEA,IAAI,KAAKA,kBAAkB,KAAK,IAAI;EAEpC,KAAKD,uBAAuB;EAC5B,KAAKC,gBAAgB,KAAK;EAC1B,KAAKD,uBAAuB,SAAS,cAAc,KAAK,EAAE;CAC5D;AACF"}

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

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/group.d.ts
+/**
+ * Groups related menu items; the element itself takes `role="group"`. A `<media-menu-group-label>` child names the
+ * group unless it already has an `aria-label` or `aria-labelledby`.
+ */
 declare class MenuGroupElement extends UIElement {
   #private;
   static readonly tagName = "media-menu-group";

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

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { MenuGroupController } from "./group-controller.js";
 //#region src/ui/menu/group.ts
+/**
+* Groups related menu items; the element itself takes `role="group"`. A `<media-menu-group-label>` child names the
+* group unless it already has an `aria-label` or `aria-labelledby`.
+*/
 var MenuGroupElement = class extends UIElement {
 	static {
 		this.tagName = "media-menu-group";

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

@@ -1 +1 @@
-{"version":3,"file":"group.js","names":["#group"],"sources":["../../../../src/ui/menu/group.ts"],"sourcesContent":["import type { PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\nimport { MenuGroupController } from './group-controller';\n\nexport class MenuGroupElement extends UIElement {\n  static readonly tagName = 'media-menu-group';\n\n  readonly #group = new MenuGroupController(this);\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    this.#group.applyProps();\n  }\n}\n"],"mappings":";;;AAKA,IAAa,mBAAb,cAAsC,UAAU;;EACpB,KAAA,UAAA;;CAE1B,SAAkB,IAAI,oBAAoB,IAAI;CAE9C,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,KAAKA,OAAO,WAAW;CACzB;AACF"}
+{"version":3,"file":"group.js","names":["#group"],"sources":["../../../../src/ui/menu/group.ts"],"sourcesContent":["import type { PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\nimport { MenuGroupController } from './group-controller';\n\n/**\n * Groups related menu items; the element itself takes `role=\"group\"`. A `<media-menu-group-label>` child names the\n * group unless it already has an `aria-label` or `aria-labelledby`.\n */\nexport class MenuGroupElement extends UIElement {\n  static readonly tagName = 'media-menu-group';\n\n  readonly #group = new MenuGroupController(this);\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    this.#group.applyProps();\n  }\n}\n"],"mappings":";;;;;;;AASA,IAAa,mBAAb,cAAsC,UAAU;;EACpB,KAAA,UAAA;;CAE1B,SAAkB,IAAI,oBAAoB,IAAI;CAE9C,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,KAAKA,OAAO,WAAW;CACzB;AACF"}

package/dist/dev/ui/menu/item-indicator.d.ts

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/item-indicator.d.ts
+/**
+ * Decorative checked-state mark inside a menu item, hidden from assistive technology. It stays `hidden` unless
+ * `checked` or `force-mount` is set; option radio groups set `checked` on the indicators in the items they generate.
+ */
 declare class MenuItemIndicatorElement extends UIElement {
   static readonly tagName = "media-menu-item-indicator";
   static properties: {

package/dist/dev/ui/menu/item-indicator.js

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { applyElementProps } from "@videojs/core/dom";
 //#region src/ui/menu/item-indicator.ts
+/**
+* Decorative checked-state mark inside a menu item, hidden from assistive technology. It stays `hidden` unless
+* `checked` or `force-mount` is set; option radio groups set `checked` on the indicators in the items they generate.
+*/
 var MenuItemIndicatorElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/menu/item-indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"item-indicator.js","names":[],"sources":["../../../../src/ui/menu/item-indicator.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\n\nexport class MenuItemIndicatorElement extends UIElement {\n  static readonly tagName = 'media-menu-item-indicator';\n\n  static override properties = {\n    checked: { type: Boolean },\n    forceMount: { type: Boolean, attribute: 'force-mount' },\n  } satisfies PropertyDeclarationMap<'checked' | 'forceMount'>;\n\n  checked = false;\n  forceMount = false;\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const hidden = !this.checked && !this.forceMount;\n\n    applyElementProps(this, {\n      'aria-hidden': 'true',\n      hidden: hidden,\n    });\n  }\n}\n"],"mappings":";;;AAKA,IAAa,2BAAb,cAA8C,UAAU;;;EAQ5C,KAAA,UAAA;EACG,KAAA,aAAA;;;EARa,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,SAAS,EAAE,MAAM,QAAQ;GACzB,YAAY;IAAE,MAAM;IAAS,WAAW;GAAc;EACxD;;CAKA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,SAAS,CAAC,KAAK,WAAW,CAAC,KAAK;EAEtC,kBAAkB,MAAM;GACtB,eAAe;GACP;EACV,CAAC;CACH;AACF"}
+{"version":3,"file":"item-indicator.js","names":[],"sources":["../../../../src/ui/menu/item-indicator.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\n\n/**\n * Decorative checked-state mark inside a menu item, hidden from assistive technology. It stays `hidden` unless\n * `checked` or `force-mount` is set; option radio groups set `checked` on the indicators in the items they generate.\n */\nexport class MenuItemIndicatorElement extends UIElement {\n  static readonly tagName = 'media-menu-item-indicator';\n\n  static override properties = {\n    checked: { type: Boolean },\n    forceMount: { type: Boolean, attribute: 'force-mount' },\n  } satisfies PropertyDeclarationMap<'checked' | 'forceMount'>;\n\n  checked = false;\n  forceMount = false;\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const hidden = !this.checked && !this.forceMount;\n\n    applyElementProps(this, {\n      'aria-hidden': 'true',\n      hidden: hidden,\n    });\n  }\n}\n"],"mappings":";;;;;;;AASA,IAAa,2BAAb,cAA8C,UAAU;;;EAQ5C,KAAA,UAAA;EACG,KAAA,aAAA;;;EARa,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,SAAS,EAAE,MAAM,QAAQ;GACzB,YAAY;IAAE,MAAM;IAAS,WAAW;GAAc;EACxD;;CAKA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,SAAS,CAAC,KAAK,WAAW,CAAC,KAAK;EAEtC,kBAAkB,MAAM;GACtB,eAAe;GACP;EACV,CAAC;CACH;AACF"}

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

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/item.d.ts
+/**
+ * Menu action; the element itself takes `role="menuitem"`. Activation fires a cancelable `select` event and then closes
+ * the menu, unless `commandfor` names a nested `<media-menu-content>` page to open instead.
+ */
 declare class MenuItemElement extends UIElement {
   #private;
   static readonly tagName = "media-menu-item";

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

@@ -3,6 +3,10 @@ import { menuContext } from "./context.js";
 import { applyElementProps, completeMenuItemSelection } from "@videojs/core/dom";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/menu/item.ts
+/**
+* Menu action; the element itself takes `role="menuitem"`. Activation fires a cancelable `select` event and then closes
+* the menu, unless `commandfor` names a nested `<media-menu-content>` page to open instead.
+*/
 var MenuItemElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

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

@@ -1 +1 @@
-{"version":3,"file":"item.js","names":["#ctx","#disconnect","#cleanupRegistration","#registeredMenu","#isDisabled","#openSubmenu"],"sources":["../../../../src/ui/menu/item.ts"],"sourcesContent":["import { applyElementProps, completeMenuItemSelection } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { type MenuContextValue, menuContext } from './context';\n\nexport class MenuItemElement extends UIElement {\n  static readonly tagName = 'media-menu-item';\n\n  static override properties = {\n    disabled: { type: Boolean },\n    commandfor: { type: String },\n  } satisfies PropertyDeclarationMap<'disabled' | 'commandfor'>;\n\n  disabled = false;\n  /** ID of a nested `<media-menu-content>` page to open when activated. */\n  commandfor: string | undefined = undefined;\n  readonly #ctx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n\n  #disconnect: AbortController | null = null;\n  #registeredMenu: MenuContextValue['menu'] | null = null;\n  #cleanupRegistration: (() => void) | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#registeredMenu = null;\n    this.#disconnect?.abort();\n    this.#disconnect = null;\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.#registeredMenu !== ctx.menu) {\n      this.#cleanupRegistration?.();\n      this.#registeredMenu = ctx.menu;\n      this.#cleanupRegistration = ctx.menu.registerItem(this);\n\n      applyElementProps(\n        this,\n        {\n          onClick: (event: MouseEvent) => {\n            const currentCtx = this.#ctx.value;\n            if (!currentCtx || this.#isDisabled()) return;\n\n            const target = this.commandfor;\n\n            if (target) {\n              this.#openSubmenu(target);\n            } else {\n              const select = new CustomEvent('select', { bubbles: true, cancelable: true });\n\n              if (!this.dispatchEvent(select)) {\n                event.preventDefault();\n                return;\n              }\n\n              completeMenuItemSelection(currentCtx.menu);\n            }\n\n            event.preventDefault();\n          },\n          onKeyDown: (event: KeyboardEvent) => {\n            const currentCtx = this.#ctx.value;\n            if (!currentCtx || this.#isDisabled() || event.key !== 'ArrowRight') return;\n\n            const target = this.commandfor;\n            if (!target) return;\n\n            this.#openSubmenu(target);\n            event.preventDefault();\n          },\n          onPointerenter: () => {\n            const currentCtx = this.#ctx.value;\n\n            if (!this.#isDisabled()) currentCtx?.menu.highlight(this, { focus: false, pointer: true });\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    const hasSubmenu = Boolean(this.commandfor);\n\n    applyElementProps(this, {\n      role: 'menuitem',\n      'aria-disabled': this.#isDisabled() ? 'true' : undefined,\n      ...(hasSubmenu && {\n        'aria-haspopup': 'menu',\n        'aria-expanded': 'false',\n        'data-has-submenu': '',\n      }),\n    });\n  }\n\n  #openSubmenu(id: string): void {\n    const root = this.getRootNode() as Document | ShadowRoot;\n    const submenu = root.querySelector<HTMLElement>(`#${CSS.escape(id)}`) as HTMLElement & {\n      openMenu?: (reason?: 'click') => void;\n    };\n\n    submenu?.openMenu?.('click');\n  }\n\n  #isDisabled(): boolean {\n    return this.disabled || this.getAttribute('aria-disabled') === 'true';\n  }\n}\n"],"mappings":";;;;;AAOA,IAAa,kBAAb,cAAqC,UAAU;;;EAQlC,KAAA,WAAA;EAEsB,KAAA,aAAA,KAAA;EACjB,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAE7C,KAAA,cAAA;EACa,KAAA,kBAAA;EACP,KAAA,uBAAA;;;EAdlB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,UAAU,EAAE,MAAM,QAAQ;GAC1B,YAAY,EAAE,MAAM,OAAO;EAC7B;;CAKA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;CACzC;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKC,kBAAkB;EACvB,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKD,KAAK;EACtB,IAAI,CAAC,OAAO,CAAC,KAAKC,aAAa;EAE/B,IAAI,KAAKE,oBAAoB,IAAI,MAAM;GACrC,KAAKD,uBAAuB;GAC5B,KAAKC,kBAAkB,IAAI;GAC3B,KAAKD,uBAAuB,IAAI,KAAK,aAAa,IAAI;GAEtD,kBACE,MACA;IACE,UAAU,UAAsB;KAC9B,MAAM,aAAa,KAAKF,KAAK;KAC7B,IAAI,CAAC,cAAc,KAAKI,YAAY,GAAG;KAEvC,MAAM,SAAS,KAAK;KAEpB,IAAI,QACF,KAAKC,aAAa,MAAM;UACnB;MACL,MAAM,SAAS,IAAI,YAAY,UAAU;OAAE,SAAS;OAAM,YAAY;MAAK,CAAC;MAE5E,IAAI,CAAC,KAAK,cAAc,MAAM,GAAG;OAC/B,MAAM,eAAe;OACrB;MACF;MAEA,0BAA0B,WAAW,IAAI;KAC3C;KAEA,MAAM,eAAe;IACvB;IACA,YAAY,UAAyB;KAEnC,IAAI,CADe,KAAKL,KAAK,SACV,KAAKI,YAAY,KAAK,MAAM,QAAQ,cAAc;KAErE,MAAM,SAAS,KAAK;KACpB,IAAI,CAAC,QAAQ;KAEb,KAAKC,aAAa,MAAM;KACxB,MAAM,eAAe;IACvB;IACA,sBAAsB;KACpB,MAAM,aAAa,KAAKL,KAAK;KAE7B,IAAI,CAAC,KAAKI,YAAY,GAAG,YAAY,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IAC3F;GACF,GACA,EAAE,QAAQ,KAAKH,YAAY,OAAO,CACpC;EACF;EAEA,MAAM,aAAa,QAAQ,KAAK,UAAU;EAE1C,kBAAkB,MAAM;GACtB,MAAM;GACN,iBAAiB,KAAKG,YAAY,IAAI,SAAS,KAAA;GAC/C,GAAI,cAAc;IAChB,iBAAiB;IACjB,iBAAiB;IACjB,oBAAoB;GACtB;EACF,CAAC;CACH;CAEA,aAAa,IAAkB;EAM7B,KALkB,YACC,CAAC,CAAC,cAA2B,IAAI,IAAI,OAAO,EAAE,GAI3D,CAAC,EAAE,WAAW,OAAO;CAC7B;CAEA,cAAuB;EACrB,OAAO,KAAK,YAAY,KAAK,aAAa,eAAe,MAAM;CACjE;AACF"}
+{"version":3,"file":"item.js","names":["#ctx","#disconnect","#cleanupRegistration","#registeredMenu","#isDisabled","#openSubmenu"],"sources":["../../../../src/ui/menu/item.ts"],"sourcesContent":["import { applyElementProps, completeMenuItemSelection } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { type MenuContextValue, menuContext } from './context';\n\n/**\n * Menu action; the element itself takes `role=\"menuitem\"`. Activation fires a cancelable `select` event and then closes\n * the menu, unless `commandfor` names a nested `<media-menu-content>` page to open instead.\n */\nexport class MenuItemElement extends UIElement {\n  static readonly tagName = 'media-menu-item';\n\n  static override properties = {\n    disabled: { type: Boolean },\n    commandfor: { type: String },\n  } satisfies PropertyDeclarationMap<'disabled' | 'commandfor'>;\n\n  disabled = false;\n  /** ID of a nested `<media-menu-content>` page to open when activated. */\n  commandfor: string | undefined = undefined;\n  readonly #ctx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n\n  #disconnect: AbortController | null = null;\n  #registeredMenu: MenuContextValue['menu'] | null = null;\n  #cleanupRegistration: (() => void) | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#cleanupRegistration?.();\n    this.#cleanupRegistration = null;\n    this.#registeredMenu = null;\n    this.#disconnect?.abort();\n    this.#disconnect = null;\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.#registeredMenu !== ctx.menu) {\n      this.#cleanupRegistration?.();\n      this.#registeredMenu = ctx.menu;\n      this.#cleanupRegistration = ctx.menu.registerItem(this);\n\n      applyElementProps(\n        this,\n        {\n          onClick: (event: MouseEvent) => {\n            const currentCtx = this.#ctx.value;\n            if (!currentCtx || this.#isDisabled()) return;\n\n            const target = this.commandfor;\n\n            if (target) {\n              this.#openSubmenu(target);\n            } else {\n              const select = new CustomEvent('select', { bubbles: true, cancelable: true });\n\n              if (!this.dispatchEvent(select)) {\n                event.preventDefault();\n                return;\n              }\n\n              completeMenuItemSelection(currentCtx.menu);\n            }\n\n            event.preventDefault();\n          },\n          onKeyDown: (event: KeyboardEvent) => {\n            const currentCtx = this.#ctx.value;\n            if (!currentCtx || this.#isDisabled() || event.key !== 'ArrowRight') return;\n\n            const target = this.commandfor;\n            if (!target) return;\n\n            this.#openSubmenu(target);\n            event.preventDefault();\n          },\n          onPointerenter: () => {\n            const currentCtx = this.#ctx.value;\n\n            if (!this.#isDisabled()) currentCtx?.menu.highlight(this, { focus: false, pointer: true });\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    const hasSubmenu = Boolean(this.commandfor);\n\n    applyElementProps(this, {\n      role: 'menuitem',\n      'aria-disabled': this.#isDisabled() ? 'true' : undefined,\n      ...(hasSubmenu && {\n        'aria-haspopup': 'menu',\n        'aria-expanded': 'false',\n        'data-has-submenu': '',\n      }),\n    });\n  }\n\n  #openSubmenu(id: string): void {\n    const root = this.getRootNode() as Document | ShadowRoot;\n    const submenu = root.querySelector<HTMLElement>(`#${CSS.escape(id)}`) as HTMLElement & {\n      openMenu?: (reason?: 'click') => void;\n    };\n\n    submenu?.openMenu?.('click');\n  }\n\n  #isDisabled(): boolean {\n    return this.disabled || this.getAttribute('aria-disabled') === 'true';\n  }\n}\n"],"mappings":";;;;;;;;;AAWA,IAAa,kBAAb,cAAqC,UAAU;;;EAQlC,KAAA,WAAA;EAEsB,KAAA,aAAA,KAAA;EACjB,KAAA,OAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAE7C,KAAA,cAAA;EACa,KAAA,kBAAA;EACP,KAAA,uBAAA;;;EAdlB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,UAAU,EAAE,MAAM,QAAQ;GAC1B,YAAY,EAAE,MAAM,OAAO;EAC7B;;CAKA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;CACzC;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKC,kBAAkB;EACvB,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKD,KAAK;EACtB,IAAI,CAAC,OAAO,CAAC,KAAKC,aAAa;EAE/B,IAAI,KAAKE,oBAAoB,IAAI,MAAM;GACrC,KAAKD,uBAAuB;GAC5B,KAAKC,kBAAkB,IAAI;GAC3B,KAAKD,uBAAuB,IAAI,KAAK,aAAa,IAAI;GAEtD,kBACE,MACA;IACE,UAAU,UAAsB;KAC9B,MAAM,aAAa,KAAKF,KAAK;KAC7B,IAAI,CAAC,cAAc,KAAKI,YAAY,GAAG;KAEvC,MAAM,SAAS,KAAK;KAEpB,IAAI,QACF,KAAKC,aAAa,MAAM;UACnB;MACL,MAAM,SAAS,IAAI,YAAY,UAAU;OAAE,SAAS;OAAM,YAAY;MAAK,CAAC;MAE5E,IAAI,CAAC,KAAK,cAAc,MAAM,GAAG;OAC/B,MAAM,eAAe;OACrB;MACF;MAEA,0BAA0B,WAAW,IAAI;KAC3C;KAEA,MAAM,eAAe;IACvB;IACA,YAAY,UAAyB;KAEnC,IAAI,CADe,KAAKL,KAAK,SACV,KAAKI,YAAY,KAAK,MAAM,QAAQ,cAAc;KAErE,MAAM,SAAS,KAAK;KACpB,IAAI,CAAC,QAAQ;KAEb,KAAKC,aAAa,MAAM;KACxB,MAAM,eAAe;IACvB;IACA,sBAAsB;KACpB,MAAM,aAAa,KAAKL,KAAK;KAE7B,IAAI,CAAC,KAAKI,YAAY,GAAG,YAAY,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IAC3F;GACF,GACA,EAAE,QAAQ,KAAKH,YAAY,OAAO,CACpC;EACF;EAEA,MAAM,aAAa,QAAQ,KAAK,UAAU;EAE1C,kBAAkB,MAAM;GACtB,MAAM;GACN,iBAAiB,KAAKG,YAAY,IAAI,SAAS,KAAA;GAC/C,GAAI,cAAc;IAChB,iBAAiB;IACjB,iBAAiB;IACjB,oBAAoB;GACtB;EACF,CAAC;CACH;CAEA,aAAa,IAAkB;EAM7B,KALkB,YACC,CAAC,CAAC,cAA2B,IAAI,IAAI,OAAO,EAAE,GAI3D,CAAC,EAAE,WAAW,OAAO;CAC7B;CAEA,cAAuB;EACrB,OAAO,KAAK,YAAY,KAAK,aAAa,eAAe,MAAM;CACjE;AACF"}

package/dist/dev/ui/menu/radio-group.d.ts

@@ -3,6 +3,7 @@ import { MenuRadioItemElement } from "./radio-item.js";
 import { MenuOptionState } from "@videojs/core";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/radio-group.d.ts
+/** Group of mutually exclusive `<media-menu-radio-item>` children; the element itself takes `role="group"`. */
 declare class MenuRadioGroupElement extends RadioGroupElement {
   #private;
   static readonly tagName: string;

package/dist/dev/ui/menu/radio-group.js

@@ -5,6 +5,7 @@ import { MenuRadioItemElement } from "./radio-item.js";
 import { ContextConsumer } from "@videojs/element/context";
 import { findElementChild } from "@videojs/utils/dom";
 //#region src/ui/menu/radio-group.ts
+/** Group of mutually exclusive `<media-menu-radio-item>` children; the element itself takes `role="group"`. */
 var MenuRadioGroupElement = class extends RadioGroupElement {
 	static {
 		this.tagName = "media-menu-radio-group";

package/dist/dev/ui/menu/radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group.js","names":["#group","#menu","#optionSource","#clearMenuOptionState","#ariaLabel","#optionMenu","#setOptionState"],"sources":["../../../../src/ui/menu/radio-group.ts"],"sourcesContent":["import type { MenuOptionState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\nimport { findElementChild } from '@videojs/utils/dom';\n\nimport { RadioGroupElement } from '../radio-group/element';\nimport { type MenuContextValue, menuContext } from './context';\nimport { MenuGroupController } from './group-controller';\nimport { MenuRadioItemElement } from './radio-item';\n\nexport class MenuRadioGroupElement extends RadioGroupElement {\n  static readonly tagName: string = 'media-menu-radio-group';\n\n  readonly #group = new MenuGroupController(this);\n  readonly #menu = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #optionSource = Symbol('menu-option');\n  #ariaLabel: string | null = null;\n  #optionMenu: MenuContextValue['menu'] | null = null;\n  #setOptionState: MenuContextValue['setOptionState'] | null = null;\n\n  override disconnectedCallback(): void {\n    this.#clearMenuOptionState();\n    super.disconnectedCallback();\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    this.#group.applyProps();\n  }\n\n  protected setItemLabel(item: MenuRadioItemElement, label: string): void {\n    const labelPart = item.querySelector<HTMLElement>('[data-part~=\"label\"]');\n\n    if (labelPart) {\n      labelPart.textContent = label;\n    } else {\n      item.textContent = label;\n    }\n  }\n\n  /** Applies a generated fallback without replacing an author-provided accessible name. */\n  protected applyDefaultAriaLabel(label: string): void {\n    if (this.hasAttribute('aria-labelledby')) return;\n\n    const current = this.getAttribute('aria-label');\n    if (current !== null && current !== this.#ariaLabel) return;\n\n    this.#ariaLabel = label;\n    this.setAttribute('aria-label', label);\n  }\n\n  protected publishMenuOptionState(\n    disabled: boolean,\n    hidden: boolean,\n    availability: MenuOptionState['availability']\n  ): void {\n    const context = this.#menu.value ?? null;\n\n    if (context?.menu !== this.#optionMenu) {\n      this.#clearMenuOptionState();\n      this.#optionMenu = context?.menu ?? null;\n      this.#setOptionState = context?.setOptionState ?? null;\n    }\n\n    if (!this.#setOptionState) return;\n\n    const selectedItem = findElementChild(\n      this,\n      (item): item is MenuRadioItemElement => item instanceof MenuRadioItemElement && item.value === this.value\n    );\n    const label = selectedItem?.querySelector<HTMLElement>('[data-part~=\"label\"]')?.textContent;\n    const value = label ?? selectedItem?.textContent?.trim() ?? '';\n\n    this.#setOptionState(this.#optionSource, { value, disabled, hidden, availability });\n  }\n\n  #clearMenuOptionState(): void {\n    this.#setOptionState?.(this.#optionSource, null);\n    this.#optionMenu = null;\n    this.#setOptionState = null;\n  }\n}\n"],"mappings":";;;;;;;AAUA,IAAa,wBAAb,cAA2C,kBAAkB;;EACzB,KAAA,UAAA;;CAElC,SAAkB,IAAI,oBAAoB,IAAI;CAC9C,QAAiB,IAAI,gBAAgB,MAAM;EAAE,SAAS;EAAa,WAAW;CAAK,CAAC;CACpF,gBAAyB,OAAO,aAAa;CAC7C,aAA4B;CAC5B,cAA+C;CAC/C,kBAA6D;CAE7D,uBAAsC;EACpC,KAAKG,sBAAsB;EAC3B,MAAM,qBAAqB;CAC7B;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAEpB,KAAKH,OAAO,WAAW;CACzB;CAEA,aAAuB,MAA4B,OAAqB;EACtE,MAAM,YAAY,KAAK,cAA2B,wBAAsB;EAExE,IAAI,WACF,UAAU,cAAc;OAExB,KAAK,cAAc;CAEvB;;CAGA,sBAAgC,OAAqB;EACnD,IAAI,KAAK,aAAa,iBAAiB,GAAG;EAE1C,MAAM,UAAU,KAAK,aAAa,YAAY;EAC9C,IAAI,YAAY,QAAQ,YAAY,KAAKI,YAAY;EAErD,KAAKA,aAAa;EAClB,KAAK,aAAa,cAAc,KAAK;CACvC;CAEA,uBACE,UACA,QACA,cACM;EACN,MAAM,UAAU,KAAKH,MAAM,SAAS;EAEpC,IAAI,SAAS,SAAS,KAAKI,aAAa;GACtC,KAAKF,sBAAsB;GAC3B,KAAKE,cAAc,SAAS,QAAQ;GACpC,KAAKC,kBAAkB,SAAS,kBAAkB;EACpD;EAEA,IAAI,CAAC,KAAKA,iBAAiB;EAE3B,MAAM,eAAe,iBACnB,OACC,SAAuC,gBAAgB,wBAAwB,KAAK,UAAU,KAAK,KACtG;EAEA,MAAM,QADQ,cAAc,cAA2B,wBAAsB,CAAC,EAAE,eACzD,cAAc,aAAa,KAAK,KAAK;EAE5D,KAAKA,gBAAgB,KAAKJ,eAAe;GAAE;GAAO;GAAU;GAAQ;EAAa,CAAC;CACpF;CAEA,wBAA8B;EAC5B,KAAKI,kBAAkB,KAAKJ,eAAe,IAAI;EAC/C,KAAKG,cAAc;EACnB,KAAKC,kBAAkB;CACzB;AACF"}
+{"version":3,"file":"radio-group.js","names":["#group","#menu","#optionSource","#clearMenuOptionState","#ariaLabel","#optionMenu","#setOptionState"],"sources":["../../../../src/ui/menu/radio-group.ts"],"sourcesContent":["import type { MenuOptionState } from '@videojs/core';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\nimport { findElementChild } from '@videojs/utils/dom';\n\nimport { RadioGroupElement } from '../radio-group/element';\nimport { type MenuContextValue, menuContext } from './context';\nimport { MenuGroupController } from './group-controller';\nimport { MenuRadioItemElement } from './radio-item';\n\n/** Group of mutually exclusive `<media-menu-radio-item>` children; the element itself takes `role=\"group\"`. */\nexport class MenuRadioGroupElement extends RadioGroupElement {\n  static readonly tagName: string = 'media-menu-radio-group';\n\n  readonly #group = new MenuGroupController(this);\n  readonly #menu = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #optionSource = Symbol('menu-option');\n  #ariaLabel: string | null = null;\n  #optionMenu: MenuContextValue['menu'] | null = null;\n  #setOptionState: MenuContextValue['setOptionState'] | null = null;\n\n  override disconnectedCallback(): void {\n    this.#clearMenuOptionState();\n    super.disconnectedCallback();\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    this.#group.applyProps();\n  }\n\n  protected setItemLabel(item: MenuRadioItemElement, label: string): void {\n    const labelPart = item.querySelector<HTMLElement>('[data-part~=\"label\"]');\n\n    if (labelPart) {\n      labelPart.textContent = label;\n    } else {\n      item.textContent = label;\n    }\n  }\n\n  /** Applies a generated fallback without replacing an author-provided accessible name. */\n  protected applyDefaultAriaLabel(label: string): void {\n    if (this.hasAttribute('aria-labelledby')) return;\n\n    const current = this.getAttribute('aria-label');\n    if (current !== null && current !== this.#ariaLabel) return;\n\n    this.#ariaLabel = label;\n    this.setAttribute('aria-label', label);\n  }\n\n  protected publishMenuOptionState(\n    disabled: boolean,\n    hidden: boolean,\n    availability: MenuOptionState['availability']\n  ): void {\n    const context = this.#menu.value ?? null;\n\n    if (context?.menu !== this.#optionMenu) {\n      this.#clearMenuOptionState();\n      this.#optionMenu = context?.menu ?? null;\n      this.#setOptionState = context?.setOptionState ?? null;\n    }\n\n    if (!this.#setOptionState) return;\n\n    const selectedItem = findElementChild(\n      this,\n      (item): item is MenuRadioItemElement => item instanceof MenuRadioItemElement && item.value === this.value\n    );\n    const label = selectedItem?.querySelector<HTMLElement>('[data-part~=\"label\"]')?.textContent;\n    const value = label ?? selectedItem?.textContent?.trim() ?? '';\n\n    this.#setOptionState(this.#optionSource, { value, disabled, hidden, availability });\n  }\n\n  #clearMenuOptionState(): void {\n    this.#setOptionState?.(this.#optionSource, null);\n    this.#optionMenu = null;\n    this.#setOptionState = null;\n  }\n}\n"],"mappings":";;;;;;;;AAWA,IAAa,wBAAb,cAA2C,kBAAkB;;EACzB,KAAA,UAAA;;CAElC,SAAkB,IAAI,oBAAoB,IAAI;CAC9C,QAAiB,IAAI,gBAAgB,MAAM;EAAE,SAAS;EAAa,WAAW;CAAK,CAAC;CACpF,gBAAyB,OAAO,aAAa;CAC7C,aAA4B;CAC5B,cAA+C;CAC/C,kBAA6D;CAE7D,uBAAsC;EACpC,KAAKG,sBAAsB;EAC3B,MAAM,qBAAqB;CAC7B;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAEpB,KAAKH,OAAO,WAAW;CACzB;CAEA,aAAuB,MAA4B,OAAqB;EACtE,MAAM,YAAY,KAAK,cAA2B,wBAAsB;EAExE,IAAI,WACF,UAAU,cAAc;OAExB,KAAK,cAAc;CAEvB;;CAGA,sBAAgC,OAAqB;EACnD,IAAI,KAAK,aAAa,iBAAiB,GAAG;EAE1C,MAAM,UAAU,KAAK,aAAa,YAAY;EAC9C,IAAI,YAAY,QAAQ,YAAY,KAAKI,YAAY;EAErD,KAAKA,aAAa;EAClB,KAAK,aAAa,cAAc,KAAK;CACvC;CAEA,uBACE,UACA,QACA,cACM;EACN,MAAM,UAAU,KAAKH,MAAM,SAAS;EAEpC,IAAI,SAAS,SAAS,KAAKI,aAAa;GACtC,KAAKF,sBAAsB;GAC3B,KAAKE,cAAc,SAAS,QAAQ;GACpC,KAAKC,kBAAkB,SAAS,kBAAkB;EACpD;EAEA,IAAI,CAAC,KAAKA,iBAAiB;EAE3B,MAAM,eAAe,iBACnB,OACC,SAAuC,gBAAgB,wBAAwB,KAAK,UAAU,KAAK,KACtG;EAEA,MAAM,QADQ,cAAc,cAA2B,wBAAsB,CAAC,EAAE,eACzD,cAAc,aAAa,KAAK,KAAK;EAE5D,KAAKA,gBAAgB,KAAKJ,eAAe;GAAE;GAAO;GAAU;GAAQ;EAAa,CAAC;CACpF;CAEA,wBAA8B;EAC5B,KAAKI,kBAAkB,KAAKJ,eAAe,IAAI;EAC/C,KAAKG,cAAc;EACnB,KAAKC,kBAAkB;CACzB;AACF"}

package/dist/dev/ui/menu/radio-item.d.ts

@@ -1,6 +1,10 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/radio-item.d.ts
+/**
+ * Menu item that selects its `value` in the enclosing `<media-menu-radio-group>` and closes the menu. The element
+ * itself takes `role="menuitemradio"`, checked while its value matches the group's.
+ */
 declare class MenuRadioItemElement extends UIElement {
   #private;
   static readonly tagName = "media-menu-radio-item";

package/dist/dev/ui/menu/radio-item.js

@@ -4,6 +4,10 @@ import { menuContext } from "./context.js";
 import { applyElementProps, completeMenuItemSelection } from "@videojs/core/dom";
 import { ContextConsumer } from "@videojs/element/context";
 //#region src/ui/menu/radio-item.ts
+/**
+* Menu item that selects its `value` in the enclosing `<media-menu-radio-group>` and closes the menu. The element
+* itself takes `role="menuitemradio"`, checked while its value matches the group's.
+*/
 var MenuRadioItemElement = class extends UIElement {
 	constructor(..._args) {
 		super(..._args);

package/dist/dev/ui/menu/radio-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-item.js","names":["menuRadioGroupContext","#menuCtx","#groupCtx","#disconnect","#registered","#cleanupRegistration"],"sources":["../../../../src/ui/menu/radio-item.ts"],"sourcesContent":["import { applyElementProps, completeMenuItemSelection } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuContext, menuRadioGroupContext } from './context';\n\nexport class MenuRadioItemElement extends UIElement {\n  static readonly tagName = 'media-menu-radio-item';\n\n  static override properties = {\n    value: { type: String },\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'value' | 'disabled'>;\n\n  value = '';\n  disabled = false;\n\n  readonly #menuCtx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #groupCtx = new ContextConsumer(this, { context: menuRadioGroupContext, 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 menuCtx = this.#menuCtx.value;\n    const groupCtx = this.#groupCtx.value;\n    if (!menuCtx || !groupCtx || !this.#disconnect) return;\n\n    if (!this.#registered) {\n      this.#registered = true;\n\n      this.#cleanupRegistration = menuCtx.menu.registerItem(this);\n\n      applyElementProps(\n        this,\n        {\n          onClick: () => {\n            const currentMenuCtx = this.#menuCtx.value;\n            const currentGroupCtx = this.#groupCtx.value;\n            if (!currentMenuCtx || !currentGroupCtx || this.disabled) return;\n\n            currentGroupCtx.onValueChange(this.value);\n            completeMenuItemSelection(currentMenuCtx.menu);\n          },\n          onPointerenter: () => {\n            const currentMenuCtx = this.#menuCtx.value;\n\n            if (!this.disabled) currentMenuCtx?.menu.highlight(this, { focus: false, pointer: true });\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    const checked = groupCtx.value === this.value;\n\n    applyElementProps(this, {\n      role: 'menuitemradio',\n      'aria-checked': String(checked),\n      'aria-disabled': this.disabled ? 'true' : undefined,\n    });\n  }\n}\n"],"mappings":";;;;;;AAOA,IAAa,uBAAb,cAA0C,UAAU;;;EAQ1C,KAAA,QAAA;EACG,KAAA,WAAA;EAES,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAClE,KAAA,YAAA,IAAI,gBAAgB,MAAM;GAAE,SAASA;GAAuB,WAAW;EAAK,CAAC;EAE5D,KAAA,cAAA;EACxB,KAAA,cAAA;EAC8B,KAAA,uBAAA;;;EAflB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,OAAO,EAAE,MAAM,OAAO;GACtB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CAKA;CACA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKG,cAAc,IAAI,gBAAgB;EACvC,KAAKC,cAAc;CACrB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;EACnB,KAAKC,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,UAAU,KAAKH,SAAS;EAC9B,MAAM,WAAW,KAAKC,UAAU;EAChC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,KAAKC,aAAa;EAEhD,IAAI,CAAC,KAAKC,aAAa;GACrB,KAAKA,cAAc;GAEnB,KAAKC,uBAAuB,QAAQ,KAAK,aAAa,IAAI;GAE1D,kBACE,MACA;IACE,eAAe;KACb,MAAM,iBAAiB,KAAKJ,SAAS;KACrC,MAAM,kBAAkB,KAAKC,UAAU;KACvC,IAAI,CAAC,kBAAkB,CAAC,mBAAmB,KAAK,UAAU;KAE1D,gBAAgB,cAAc,KAAK,KAAK;KACxC,0BAA0B,eAAe,IAAI;IAC/C;IACA,sBAAsB;KACpB,MAAM,iBAAiB,KAAKD,SAAS;KAErC,IAAI,CAAC,KAAK,UAAU,gBAAgB,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IAC1F;GACF,GACA,EAAE,QAAQ,KAAKE,YAAY,OAAO,CACpC;EACF;EAEA,MAAM,UAAU,SAAS,UAAU,KAAK;EAExC,kBAAkB,MAAM;GACtB,MAAM;GACN,gBAAgB,OAAO,OAAO;GAC9B,iBAAiB,KAAK,WAAW,SAAS,KAAA;EAC5C,CAAC;CACH;AACF"}
+{"version":3,"file":"radio-item.js","names":["menuRadioGroupContext","#menuCtx","#groupCtx","#disconnect","#registered","#cleanupRegistration"],"sources":["../../../../src/ui/menu/radio-item.ts"],"sourcesContent":["import { applyElementProps, completeMenuItemSelection } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { menuContext, menuRadioGroupContext } from './context';\n\n/**\n * Menu item that selects its `value` in the enclosing `<media-menu-radio-group>` and closes the menu. The element\n * itself takes `role=\"menuitemradio\"`, checked while its value matches the group's.\n */\nexport class MenuRadioItemElement extends UIElement {\n  static readonly tagName = 'media-menu-radio-item';\n\n  static override properties = {\n    value: { type: String },\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'value' | 'disabled'>;\n\n  value = '';\n  disabled = false;\n\n  readonly #menuCtx = new ContextConsumer(this, { context: menuContext, subscribe: true });\n  readonly #groupCtx = new ContextConsumer(this, { context: menuRadioGroupContext, 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 menuCtx = this.#menuCtx.value;\n    const groupCtx = this.#groupCtx.value;\n    if (!menuCtx || !groupCtx || !this.#disconnect) return;\n\n    if (!this.#registered) {\n      this.#registered = true;\n\n      this.#cleanupRegistration = menuCtx.menu.registerItem(this);\n\n      applyElementProps(\n        this,\n        {\n          onClick: () => {\n            const currentMenuCtx = this.#menuCtx.value;\n            const currentGroupCtx = this.#groupCtx.value;\n            if (!currentMenuCtx || !currentGroupCtx || this.disabled) return;\n\n            currentGroupCtx.onValueChange(this.value);\n            completeMenuItemSelection(currentMenuCtx.menu);\n          },\n          onPointerenter: () => {\n            const currentMenuCtx = this.#menuCtx.value;\n\n            if (!this.disabled) currentMenuCtx?.menu.highlight(this, { focus: false, pointer: true });\n          },\n        },\n        { signal: this.#disconnect.signal }\n      );\n    }\n\n    const checked = groupCtx.value === this.value;\n\n    applyElementProps(this, {\n      role: 'menuitemradio',\n      'aria-checked': String(checked),\n      'aria-disabled': this.disabled ? 'true' : undefined,\n    });\n  }\n}\n"],"mappings":";;;;;;;;;;AAWA,IAAa,uBAAb,cAA0C,UAAU;;;EAQ1C,KAAA,QAAA;EACG,KAAA,WAAA;EAES,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAa,WAAW;EAAK,CAAC;EAClE,KAAA,YAAA,IAAI,gBAAgB,MAAM;GAAE,SAASA;GAAuB,WAAW;EAAK,CAAC;EAE5D,KAAA,cAAA;EACxB,KAAA,cAAA;EAC8B,KAAA,uBAAA;;;EAflB,KAAA,UAAA;;;EAEG,KAAA,aAAA;GAC3B,OAAO,EAAE,MAAM,OAAO;GACtB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CAKA;CACA;CAEA;CACA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKG,cAAc,IAAI,gBAAgB;EACvC,KAAKC,cAAc;CACrB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,uBAAuB;EAC5B,KAAKA,uBAAuB;EAC5B,KAAKF,aAAa,MAAM;EACxB,KAAKA,cAAc;EACnB,KAAKC,cAAc;CACrB;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,UAAU,KAAKH,SAAS;EAC9B,MAAM,WAAW,KAAKC,UAAU;EAChC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,KAAKC,aAAa;EAEhD,IAAI,CAAC,KAAKC,aAAa;GACrB,KAAKA,cAAc;GAEnB,KAAKC,uBAAuB,QAAQ,KAAK,aAAa,IAAI;GAE1D,kBACE,MACA;IACE,eAAe;KACb,MAAM,iBAAiB,KAAKJ,SAAS;KACrC,MAAM,kBAAkB,KAAKC,UAAU;KACvC,IAAI,CAAC,kBAAkB,CAAC,mBAAmB,KAAK,UAAU;KAE1D,gBAAgB,cAAc,KAAK,KAAK;KACxC,0BAA0B,eAAe,IAAI;IAC/C;IACA,sBAAsB;KACpB,MAAM,iBAAiB,KAAKD,SAAS;KAErC,IAAI,CAAC,KAAK,UAAU,gBAAgB,KAAK,UAAU,MAAM;MAAE,OAAO;MAAO,SAAS;KAAK,CAAC;IAC1F;GACF,GACA,EAAE,QAAQ,KAAKE,YAAY,OAAO,CACpC;EACF;EAEA,MAAM,UAAU,SAAS,UAAU,KAAK;EAExC,kBAAkB,MAAM;GACtB,MAAM;GACN,gBAAgB,OAAO,OAAO;GAC9B,iBAAiB,KAAK,WAAW,SAAS,KAAA;EAC5C,CAAC;CACH;AACF"}

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

@@ -1,6 +1,7 @@
 import { UIElement } from "../ui-element.js";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/menu/separator.d.ts
+/** Visual divider between groups of menu items; the element itself takes `role="separator"`. */
 declare class MenuSeparatorElement extends UIElement {
   static readonly tagName = "media-menu-separator";
   protected update(_changed: PropertyValues): void;

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

@@ -1,6 +1,7 @@
 import { UIElement } from "../ui-element.js";
 import { applyElementProps } from "@videojs/core/dom";
 //#region src/ui/menu/separator.ts
+/** Visual divider between groups of menu items; the element itself takes `role="separator"`. */
 var MenuSeparatorElement = class extends UIElement {
 	static {
 		this.tagName = "media-menu-separator";

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

@@ -1 +1 @@
-{"version":3,"file":"separator.js","names":[],"sources":["../../../../src/ui/menu/separator.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\n\nexport class MenuSeparatorElement extends UIElement {\n  static readonly tagName = 'media-menu-separator';\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    applyElementProps(this, { role: 'separator' });\n  }\n}\n"],"mappings":";;;AAKA,IAAa,uBAAb,cAA0C,UAAU;;EACxB,KAAA,UAAA;;CAE1B,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,kBAAkB,MAAM,EAAE,MAAM,YAAY,CAAC;CAC/C;AACF"}
+{"version":3,"file":"separator.js","names":[],"sources":["../../../../src/ui/menu/separator.ts"],"sourcesContent":["import { applyElementProps } from '@videojs/core/dom';\nimport type { PropertyValues } from '@videojs/element';\n\nimport { UIElement } from '../ui-element';\n\n/** Visual divider between groups of menu items; the element itself takes `role=\"separator\"`. */\nexport class MenuSeparatorElement extends UIElement {\n  static readonly tagName = 'media-menu-separator';\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    applyElementProps(this, { role: 'separator' });\n  }\n}\n"],"mappings":";;;;AAMA,IAAa,uBAAb,cAA0C,UAAU;;EACxB,KAAA,UAAA;;CAE1B,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,kBAAkB,MAAM,EAAE,MAAM,YAAY,CAAC;CAC/C;AACF"}

package/dist/dev/ui/playback-rate-radio-group/element.d.ts

@@ -2,6 +2,11 @@ import { MenuRadioGroupElement } from "../menu/radio-group.js";
 import { PlaybackRateRadioGroupCore } from "@videojs/core";
 import { PropertyValues } from "@videojs/element";
 //#region src/ui/playback-rate-radio-group/element.d.ts
+/**
+ * Menu radio group that generates a `<media-menu-radio-item>` per available playback rate and shares the selected label
+ * and availability with an enclosing menu. An optional `<template>` holding one `<media-menu-radio-item>` customizes
+ * each generated item.
+ */
 declare class PlaybackRateRadioGroupElement extends MenuRadioGroupElement {
   #private;
   static readonly tagName = "media-playback-rate-radio-group";

package/dist/dev/ui/playback-rate-radio-group/element.js

@@ -8,6 +8,11 @@ import { PlaybackRateRadioGroupCore, PlaybackRateRadioGroupDataAttrs } from "@vi
 import { applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from "@videojs/core/dom";
 import { translateText } from "@videojs/core/i18n";
 //#region src/ui/playback-rate-radio-group/element.ts
+/**
+* Menu radio group that generates a `<media-menu-radio-item>` per available playback rate and shares the selected label
+* and availability with an enclosing menu. An optional `<template>` holding one `<media-menu-radio-item>` customizes
+* each generated item.
+*/
 var PlaybackRateRadioGroupElement = class extends MenuRadioGroupElement {
 	constructor(..._args) {
 		super(..._args);