@videojs/html 0.1.0-preview.6 → 0.1.0-preview.7

package/dist/{button-D1DWjsQu.js → button-Bu1mGG-F.js}

@@ -23,6 +23,9 @@ var ButtonElement = class extends HTMLElement {
 	static {
 		this.getTemplateHTML = getTemplateHTML;
 	}
+	static {
+		this.observedAttributes = ["commandfor"];
+	}
 	constructor() {
 		super();
 		if (!this.shadowRoot) {
@@ -35,6 +38,9 @@ var ButtonElement = class extends HTMLElement {
 		this.addEventListener("click", this);
 		this.addEventListener("keydown", this);
 	}
+	attributeChangedCallback(name, _oldValue, newValue) {
+		if (name === "commandfor") this.style.setProperty("anchor-name", `--${newValue}`);
+	}
 	handleEvent(event) {
 		const { type } = event;
 		if (type === "keydown") this.#handleKeyDown(event);
@@ -54,4 +60,4 @@ var ButtonElement = class extends HTMLElement {
 
 //#endregion
 export { ButtonElement as t };
-//# sourceMappingURL=button-D1DWjsQu.js.map
+//# sourceMappingURL=button-Bu1mGG-F.js.map

package/dist/button-Bu1mGG-F.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-Bu1mGG-F.js","names":["#handleKeyDown","#handleKeyUp"],"sources":["../src/elements/button.ts"],"sourcesContent":["import { namedNodeMapToObject } from '@videojs/utils/dom';\n\nexport function getTemplateHTML(\n  this: typeof ButtonElement,\n  _attrs: Record<string, string>,\n  _props: Record<string, any> = {},\n): string {\n  return /* html */ `\n    <style>\n      /*\n        NOTE: Even though primitives should aim to be \"unstyled\" in their core definitions, we should\n        still add pointer-events, as this defines functionality. (CJP)\n      */\n      :host {\n        pointer-events: auto;\n      }\n    </style>\n    <slot>\n    </slot>\n  `;\n}\n\nexport class ButtonElement extends HTMLElement {\n  static shadowRootOptions = {\n    mode: 'open' as ShadowRootMode,\n  };\n\n  static getTemplateHTML: typeof getTemplateHTML = getTemplateHTML;\n\n  static observedAttributes: string[] = ['commandfor'];\n\n  constructor() {\n    super();\n\n    if (!this.shadowRoot) {\n      // Set up the Shadow DOM if not using Declarative Shadow DOM.\n      this.attachShadow((this.constructor as typeof ButtonElement).shadowRootOptions);\n\n      const attrs = namedNodeMapToObject(this.attributes);\n      const html = (this.constructor as typeof ButtonElement).getTemplateHTML(attrs);\n      // From MDN: setHTMLUnsafe should be used instead of ShadowRoot.innerHTML\n      // when a string of HTML may contain declarative shadow roots.\n      const shadowRoot = this.shadowRoot as unknown as ShadowRoot;\n      shadowRoot.setHTMLUnsafe ? shadowRoot.setHTMLUnsafe(html) : (shadowRoot.innerHTML = html);\n    }\n\n    this.addEventListener('click', this);\n    this.addEventListener('keydown', this);\n  }\n\n  attributeChangedCallback(name: string, _oldValue: string, newValue: string): void {\n    if (name === 'commandfor') {\n      this.style.setProperty('anchor-name', `--${newValue}`);\n    }\n  }\n\n  handleEvent(event: Event): void {\n    const { type } = event;\n    if (type === 'keydown') {\n      this.#handleKeyDown(event as KeyboardEvent);\n    }\n  }\n\n  #handleKeyDown = (event: KeyboardEvent): void => {\n    const { metaKey, altKey, key } = event;\n    if (metaKey || altKey || !['Enter', ' '].includes(key)) {\n      this.removeEventListener('keyup', this.#handleKeyUp);\n      return;\n    }\n    this.addEventListener('keyup', this.#handleKeyUp, { once: true });\n  };\n\n  #handleKeyUp = (_event: KeyboardEvent): void => {\n    this.handleEvent({ type: 'click' } as Event);\n  };\n}\n"],"mappings":";;;AAEA,SAAgB,gBAEd,QACA,SAA8B,EAAE,EACxB;AACR,QAAkB;;;;;;;;;;;;;;AAepB,IAAa,gBAAb,cAAmC,YAAY;;2BAClB,EACzB,MAAM,QACP;;;yBAEgD;;;4BAEX,CAAC,aAAa;;CAEpD,cAAc;AACZ,SAAO;AAEP,MAAI,CAAC,KAAK,YAAY;AAEpB,QAAK,aAAc,KAAK,YAAqC,kBAAkB;GAE/E,MAAM,QAAQ,qBAAqB,KAAK,WAAW;GACnD,MAAM,OAAQ,KAAK,YAAqC,gBAAgB,MAAM;GAG9E,MAAM,aAAa,KAAK;AACxB,cAAW,gBAAgB,WAAW,cAAc,KAAK,GAAI,WAAW,YAAY;;AAGtF,OAAK,iBAAiB,SAAS,KAAK;AACpC,OAAK,iBAAiB,WAAW,KAAK;;CAGxC,yBAAyB,MAAc,WAAmB,UAAwB;AAChF,MAAI,SAAS,aACX,MAAK,MAAM,YAAY,eAAe,KAAK,WAAW;;CAI1D,YAAY,OAAoB;EAC9B,MAAM,EAAE,SAAS;AACjB,MAAI,SAAS,UACX,OAAKA,cAAe,MAAuB;;CAI/C,kBAAkB,UAA+B;EAC/C,MAAM,EAAE,SAAS,QAAQ,QAAQ;AACjC,MAAI,WAAW,UAAU,CAAC,CAAC,SAAS,IAAI,CAAC,SAAS,IAAI,EAAE;AACtD,QAAK,oBAAoB,SAAS,MAAKC,YAAa;AACpD;;AAEF,OAAK,iBAAiB,SAAS,MAAKA,aAAc,EAAE,MAAM,MAAM,CAAC;;CAGnE,gBAAgB,WAAgC;AAC9C,OAAK,YAAY,EAAE,MAAM,SAAS,CAAU"}

package/dist/define/index.d.ts

@@ -1,5 +1,5 @@
-import "../media-container-DPnFjmtK.js";
-import "../video-provider-BcBuWpx6.js";
+import "../video-provider-nSCfwA7l.js";
+import "../media-container-ChS9lZvf.js";
 import "../media-play-button-oq8yDlxe.js";
 import "../media-mute-button-NVJF2EEW.js";
 import "../media-volume-slider-DP47VLVi.js";

package/dist/define/index.js

@@ -1,27 +1,27 @@
 import "../component-factory-DeAN6cjC.js";
 import "../current-time-display-C3qndGf5.js";
 import "../duration-display-JOPp3bdU.js";
-import "../button-D1DWjsQu.js";
-import "../fullscreen-button-CGO2UJjs.js";
-import "../mute-button-vW2sLqqY.js";
-import "../play-button-aVb0g10G.js";
-import "../popover-ty9dFDNE.js";
+import "../button-Bu1mGG-F.js";
+import "../fullscreen-button-C1nq8yP-.js";
+import "../mute-button-BSDoCZs3.js";
+import "../play-button-gaqIKsrv.js";
+import "../popover-BUCVOjnO.js";
 import "../preview-time-display-Dax0FQ2X.js";
-import "../time-slider-CA1GMs6A.js";
-import "../tooltip-CJpujx2f.js";
-import "../volume-slider-guD8gqpi.js";
-import "../media-container-C0MUzkJ_.js";
+import "../time-slider-DKamO_2Q.js";
+import "../tooltip-B-glki2f.js";
+import "../volume-slider-CbFzCHX4.js";
+import "../media-container-BOL0PKuG.js";
 import "../video-provider-BKDqoKFf.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-container-BGEXSi9g.js";
-import "../video-provider-BCGedOLm.js";
-import "../media-play-button-CLj-hkwn.js";
-import "../media-mute-button-BOVhZ3aP.js";
-import "../media-volume-slider-CKSxmdQv.js";
-import "../media-time-slider-Bp2qnwsW.js";
-import "../media-fullscreen-button-Dcflbt54.js";
+import "../video-provider-BPPI5e47.js";
+import "../media-container-DwKSOa1h.js";
+import "../media-play-button-DhSK0JQk.js";
+import "../media-mute-button-CHHISH91.js";
+import "../media-volume-slider-B-n6b3Y8.js";
+import "../media-time-slider-SuxR3Rep.js";
+import "../media-fullscreen-button-CIpcLhtU.js";
 import "../media-duration-display-BLMr7VHo.js";
 import "../media-current-time-display-B-4Cp845.js";
 import "../media-preview-time-display-DAiMgLPX.js";
-import "../media-popover-DVCIlSBX.js";
-import "../media-tooltip-C4jOtQ8a.js";
+import "../media-popover-Cw9d_Bh3.js";
+import "../media-tooltip-CMRN_X4D.js";

package/dist/define/media-container.d.ts

@@ -1 +1 @@
-import "../media-container-DPnFjmtK.js";
+import "../media-container-ChS9lZvf.js";

package/dist/define/media-container.js

@@ -1,3 +1,3 @@
-import "../media-container-C0MUzkJ_.js";
+import "../media-container-BOL0PKuG.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-container-BGEXSi9g.js";
+import "../media-container-DwKSOa1h.js";

package/dist/define/media-fullscreen-button.js

@@ -1,5 +1,5 @@
 import "../component-factory-DeAN6cjC.js";
-import "../button-D1DWjsQu.js";
-import "../fullscreen-button-CGO2UJjs.js";
+import "../button-Bu1mGG-F.js";
+import "../fullscreen-button-C1nq8yP-.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-fullscreen-button-Dcflbt54.js";
+import "../media-fullscreen-button-CIpcLhtU.js";

package/dist/define/media-mute-button.js

@@ -1,5 +1,5 @@
 import "../component-factory-DeAN6cjC.js";
-import "../button-D1DWjsQu.js";
-import "../mute-button-vW2sLqqY.js";
+import "../button-Bu1mGG-F.js";
+import "../mute-button-BSDoCZs3.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-mute-button-BOVhZ3aP.js";
+import "../media-mute-button-CHHISH91.js";

package/dist/define/media-play-button.js

@@ -1,5 +1,5 @@
 import "../component-factory-DeAN6cjC.js";
-import "../button-D1DWjsQu.js";
-import "../play-button-aVb0g10G.js";
+import "../button-Bu1mGG-F.js";
+import "../play-button-gaqIKsrv.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-play-button-CLj-hkwn.js";
+import "../media-play-button-DhSK0JQk.js";

package/dist/define/media-popover.js

@@ -1,3 +1,3 @@
-import "../popover-ty9dFDNE.js";
+import "../popover-BUCVOjnO.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-popover-DVCIlSBX.js";
+import "../media-popover-Cw9d_Bh3.js";

package/dist/define/media-time-slider.js

@@ -1,4 +1,4 @@
 import "../component-factory-DeAN6cjC.js";
-import "../time-slider-CA1GMs6A.js";
+import "../time-slider-DKamO_2Q.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-time-slider-Bp2qnwsW.js";
+import "../media-time-slider-SuxR3Rep.js";

package/dist/define/media-tooltip.js

@@ -1,3 +1,3 @@
-import "../tooltip-CJpujx2f.js";
+import "../tooltip-B-glki2f.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-tooltip-C4jOtQ8a.js";
+import "../media-tooltip-CMRN_X4D.js";

package/dist/define/media-volume-slider.js

@@ -1,4 +1,4 @@
 import "../component-factory-DeAN6cjC.js";
-import "../volume-slider-guD8gqpi.js";
+import "../volume-slider-CbFzCHX4.js";
 import "../custom-element-3bDlB2XO.js";
-import "../media-volume-slider-CKSxmdQv.js";
+import "../media-volume-slider-B-n6b3Y8.js";

package/dist/define/video-provider.d.ts

@@ -1 +1 @@
-import "../video-provider-BcBuWpx6.js";
+import "../video-provider-nSCfwA7l.js";

package/dist/define/video-provider.js

@@ -1,3 +1,3 @@
 import "../video-provider-BKDqoKFf.js";
 import "../custom-element-3bDlB2XO.js";
-import "../video-provider-BCGedOLm.js";
+import "../video-provider-BPPI5e47.js";

package/dist/{fullscreen-button-CGO2UJjs.js → fullscreen-button-C1nq8yP-.js}

@@ -1,5 +1,5 @@
 import { t as toConnectedHTMLComponent } from "./component-factory-DeAN6cjC.js";
-import { t as ButtonElement } from "./button-D1DWjsQu.js";
+import { t as ButtonElement } from "./button-Bu1mGG-F.js";
 import { fullscreenButtonStateDefinition } from "@videojs/core/store";
 import { setAttributes } from "@videojs/utils/dom";
 
@@ -45,4 +45,4 @@ const FullscreenButtonElement = toConnectedHTMLComponent(FullscreenButton, getFu
 
 //#endregion
 export { FullscreenButtonElement as t };
-//# sourceMappingURL=fullscreen-button-CGO2UJjs.js.map
+//# sourceMappingURL=fullscreen-button-C1nq8yP-.js.map

package/dist/{fullscreen-button-CGO2UJjs.js.map → fullscreen-button-C1nq8yP-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"fullscreen-button-CGO2UJjs.js","names":["getFullscreenButtonState: StateHook<{ fullscreen: boolean }>","getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }>","FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState>"],"sources":["../src/elements/fullscreen-button.ts"],"sourcesContent":["import type { FullscreenButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { fullscreenButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class FullscreenButton extends ButtonElement {\n  _state:\n    | {\n      fullscreen: boolean;\n      requestEnterFullscreen: () => void;\n      requestExitFullscreen: () => void;\n    }\n    | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n    if (state && type === 'click') {\n      if (state.fullscreen) {\n        state.requestExitFullscreen();\n      } else {\n        state.requestEnterFullscreen();\n      }\n    }\n  }\n\n  get fullscreen(): boolean {\n    return this._state?.fullscreen ?? false;\n  }\n\n  _update(props: any, state: any, _mediaStore?: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\n/**\n * FullscreenButton state hook - equivalent to React's useFullscreenButtonState\n * Handles media store state subscription and transformation\n */\nexport const getFullscreenButtonState: StateHook<{ fullscreen: boolean }> = {\n  keys: fullscreenButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...fullscreenButtonStateDefinition.stateTransform(rawState),\n    ...fullscreenButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-fullscreen': state.fullscreen,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.fullscreen ? 'exit fullscreen' : 'enter fullscreen',\n    /** tooltip */\n    'data-tooltip': state.fullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState> = toConnectedHTMLComponent(\n  FullscreenButton,\n  getFullscreenButtonState,\n  getFullscreenButtonProps,\n  'FullscreenButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,mBAAb,cAAsC,cAAc;CASlD,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AACnB,MAAI,SAAS,SAAS,QACpB,KAAI,MAAM,WACR,OAAM,uBAAuB;MAE7B,OAAM,wBAAwB;;CAKpC,IAAI,aAAsB;AACxB,SAAO,KAAK,QAAQ,cAAc;;CAGpC,QAAQ,OAAY,OAAY,aAAyB;AACvD,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;;;;;AAQ9B,MAAaA,2BAA+D;CAC1E,MAAM,gCAAgC;CACtC,YAAY,UAAU,gBAAgB;EACpC,GAAG,gCAAgC,eAAe,SAAS;EAC3D,GAAG,gCAAgC,qBAAqB,WAAW,SAAS;EAC7E;CACF;AAED,MAAaC,4BAAgE,OAAO,aAAa;AAgB/F,QAfuC;EAErC,mBAAmB,MAAM;EAGzB,MAAM;EACN,UAAU;EACV,cAAc,MAAM,aAAa,oBAAoB;EAErD,gBAAgB,MAAM,aAAa,oBAAoB;EAIxD;;AAKH,MAAaC,0BAAgF,yBAC3F,kBACA,0BACA,0BACA,mBACD"}
+{"version":3,"file":"fullscreen-button-C1nq8yP-.js","names":["getFullscreenButtonState: StateHook<{ fullscreen: boolean }>","getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }>","FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState>"],"sources":["../src/elements/fullscreen-button.ts"],"sourcesContent":["import type { FullscreenButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { fullscreenButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class FullscreenButton extends ButtonElement {\n  _state:\n    | {\n      fullscreen: boolean;\n      requestEnterFullscreen: () => void;\n      requestExitFullscreen: () => void;\n    }\n    | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n    if (state && type === 'click') {\n      if (state.fullscreen) {\n        state.requestExitFullscreen();\n      } else {\n        state.requestEnterFullscreen();\n      }\n    }\n  }\n\n  get fullscreen(): boolean {\n    return this._state?.fullscreen ?? false;\n  }\n\n  _update(props: any, state: any, _mediaStore?: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\n/**\n * FullscreenButton state hook - equivalent to React's useFullscreenButtonState\n * Handles media store state subscription and transformation\n */\nexport const getFullscreenButtonState: StateHook<{ fullscreen: boolean }> = {\n  keys: fullscreenButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...fullscreenButtonStateDefinition.stateTransform(rawState),\n    ...fullscreenButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-fullscreen': state.fullscreen,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.fullscreen ? 'exit fullscreen' : 'enter fullscreen',\n    /** tooltip */\n    'data-tooltip': state.fullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState> = toConnectedHTMLComponent(\n  FullscreenButton,\n  getFullscreenButtonState,\n  getFullscreenButtonProps,\n  'FullscreenButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,mBAAb,cAAsC,cAAc;CASlD,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AACnB,MAAI,SAAS,SAAS,QACpB,KAAI,MAAM,WACR,OAAM,uBAAuB;MAE7B,OAAM,wBAAwB;;CAKpC,IAAI,aAAsB;AACxB,SAAO,KAAK,QAAQ,cAAc;;CAGpC,QAAQ,OAAY,OAAY,aAAyB;AACvD,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;;;;;AAQ9B,MAAaA,2BAA+D;CAC1E,MAAM,gCAAgC;CACtC,YAAY,UAAU,gBAAgB;EACpC,GAAG,gCAAgC,eAAe,SAAS;EAC3D,GAAG,gCAAgC,qBAAqB,WAAW,SAAS;EAC7E;CACF;AAED,MAAaC,4BAAgE,OAAO,aAAa;AAgB/F,QAfuC;EAErC,mBAAmB,MAAM;EAGzB,MAAM;EACN,UAAU;EACV,cAAc,MAAM,aAAa,oBAAoB;EAErD,gBAAgB,MAAM,aAAa,oBAAoB;EAIxD;;AAKH,MAAaC,0BAAgF,yBAC3F,kBACA,0BACA,0BACA,mBACD"}

package/dist/index.d.ts

@@ -1,7 +1,6 @@
 import { t as MediaSkinElement } from "./media-skin-Di3vSHvS.js";
 import { CurrentTimeDisplayState, DurationDisplayState, FullscreenButtonState, MediaStore, MuteButtonState, PlayButtonState, PreviewTimeDisplayState } from "@videojs/core/store";
 import { Constructor, CustomElement } from "@open-wc/context-protocol";
-import { Placement } from "@floating-ui/dom";
 import { TimeSlider, VolumeSlider } from "@videojs/core";
 
 //#region src/utils/component-factory.d.ts
@@ -23,22 +22,25 @@ declare const DurationDisplayElement: ConnectedComponentConstructor<DurationDisp
 declare const FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState>;
 //#endregion
 //#region src/elements/mute-button.d.ts
+
 declare const MuteButtonElement: ConnectedComponentConstructor<MuteButtonState>;
 //#endregion
 //#region src/elements/play-button.d.ts
 declare const PlayButtonElement: ConnectedComponentConstructor<PlayButtonState>;
 //#endregion
 //#region src/elements/popover.d.ts
+type Placement$1 = "top" | "top-start" | "top-end";
 declare class PopoverElement extends HTMLElement {
   #private;
+  static get observedAttributes(): string[];
+  attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
   connectedCallback(): void;
   disconnectedCallback(): void;
   handleEvent(event: Event): void;
-  static get observedAttributes(): string[];
   get openOnHover(): boolean;
   get delay(): number;
   get closeDelay(): number;
-  get side(): Placement;
+  get side(): Placement$1;
   get sideOffset(): number;
 }
 //#endregion
@@ -66,12 +68,15 @@ declare const TimeSliderElement: {
 };
 //#endregion
 //#region src/elements/tooltip.d.ts
+type Placement = "top" | "top-start" | "top-end";
 declare class TooltipElement extends HTMLElement {
   #private;
+  static get observedAttributes(): string[];
+  constructor();
+  attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
   connectedCallback(): void;
   disconnectedCallback(): void;
   handleEvent(event: Event): void;
-  static get observedAttributes(): string[];
   get delay(): number;
   get closeDelay(): number;
   get trackCursorAxis(): "x" | "y" | "both" | undefined;
@@ -99,7 +104,7 @@ declare const VolumeSliderTrackElement: ConnectedComponentConstructor<any>;
 /**
 * Connected VolumeSlider Progress component
 */
-declare const VolumeSliderProgressElement: ConnectedComponentConstructor<any>;
+declare const VolumeSliderIndicatorElement: ConnectedComponentConstructor<any>;
 /**
 * Connected VolumeSlider Thumb component
 */
@@ -110,7 +115,7 @@ declare const VolumeSliderThumbElement: ConnectedComponentConstructor<any>;
 declare const VolumeSliderElement: {
   Root: typeof VolumeSliderRootElement;
   Track: typeof VolumeSliderTrackElement;
-  Progress: typeof VolumeSliderProgressElement;
+  Indicator: typeof VolumeSliderIndicatorElement;
   Thumb: typeof VolumeSliderThumbElement;
 };
 //#endregion

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":["useCurrentTimeDisplayState: StateHook<{\n  currentTime: number | undefined;\n  duration: number | undefined;\n}>","getCurrentTimeDisplayProps: PropsHook<{\n  currentTime: number | undefined;\n  duration: number | undefined;\n}>","CurrentTimeDisplayElement: ConnectedComponentConstructor<CurrentTimeDisplayState>","useDurationDisplayState: StateHook<{\n  duration: number | undefined;\n}>","getDurationDisplayProps: PropsHook<{\n  duration: number | undefined;\n}>","DurationDisplayElement: ConnectedComponentConstructor<DurationDisplayState>","getFullscreenButtonState: StateHook<{ fullscreen: boolean }>","getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }>","FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState>","getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","MuteButtonElement: ConnectedComponentConstructor<MuteButtonState>","getPlayButtonState: StateHook<{ paused: boolean }>","getPlayButtonProps: PropsHook<{ paused: boolean }>","PlayButtonElement: ConnectedComponentConstructor<PlayButtonState>","usePreviewTimeDisplayState: StateHook<{\n  previewTime: number | undefined;\n}>","getPreviewTimeDisplayProps: PropsHook<{\n  previewTime: number | undefined;\n}>","PreviewTimeDisplayElement: ConnectedComponentConstructor<PreviewTimeDisplayState>","getTimeSliderRootProps: PropsHook<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","useTimeSliderRootState: StateHook<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","getTimeSliderTrackProps: PropsHook<Record<string, never>>","getTimeSliderProgressProps: PropsHook<Record<string, never>>","getTimeSliderPointerProps: PropsHook<Record<string, never>>","getTimeSliderThumbProps: PropsHook<Record<string, never>>","TimeSliderRootElement: ConnectedComponentConstructor<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","TimeSliderTrackElement: ConnectedComponentConstructor<any>","TimeSliderProgressElement: ConnectedComponentConstructor<any>","TimeSliderPointerElement: ConnectedComponentConstructor<any>","TimeSliderThumbElement: ConnectedComponentConstructor<any>","getVolumeSliderRootProps: PropsHook<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","useVolumeSliderRootState: StateHook<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","getVolumeSliderTrackProps: PropsHook<Record<string, never>>","getVolumeSliderProgressProps: PropsHook<Record<string, never>>","getVolumeSliderThumbProps: PropsHook<Record<string, never>>","VolumeSliderRootElement: ConnectedComponentConstructor<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","VolumeSliderTrackElement: ConnectedComponentConstructor<any>","VolumeSliderProgressElement: ConnectedComponentConstructor<any>","VolumeSliderThumbElement: ConnectedComponentConstructor<any>","CustomElementConsumer: Constructor<CustomElement & HTMLElement>","ProviderHTMLElement: Constructor<CustomElement & HTMLElement>"],"sources":["../src/utils/component-factory.ts","../src/elements/current-time-display.ts","../src/elements/duration-display.ts","../src/elements/fullscreen-button.ts","../src/elements/mute-button.ts","../src/elements/play-button.ts","../src/elements/popover.ts","../src/elements/preview-time-display.ts","../src/elements/time-slider.ts","../src/elements/tooltip.ts","../src/elements/volume-slider.ts","../src/media/media-container.ts","../src/media/video-provider.ts"],"sourcesContent":[],"mappings":";;;;;;;;UAaiB;cACH,QAAQ;;;;;cCqETE,2BAA2B,8BAA8B;;;;cCNzDG,wBAAwB,8BAA8B;;;;AEQtDM,cDXAH,uBCWiD,EDXxB,6BCWN,CDXoC,qBCWpC,CAAA;;;AAAnBG,cAAAA,iBAAiD,EAA9B,6BAAA,CAA8B,eAA9B,CAAA;;;ADXnBH,cEVAM,iBFUuD,EEVpC,6BFUM,CEVwB,eFUxB,CAAA;;;cG1DzB,cAAA,SAAuB,WAAA;;;;qBAmCf;;ENtCrB,IAAiB,WAAA,CAAA,CAAA,EAAA,OAAA;;;cM4EH;ELNd,IAAaZ,UAAAA,CAAAA,CAAAA,EAAAA,MAAAA;;;;cMVAe,2BAA2B,8BAA8B;;;;cCsKzDO,uBAAuB;;ECzOpC,QAAa,EAAA,MAAA;EAqCQ,WAAA,EAAA,CAAA,IAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAiCP,IAAA,EDuKN,UCvKM,GAAA,IAAA;CAtEsB,CAAA;AAAA,cDgPvBC,sBChPuB,EDgPC,6BChPD,CAAA,GAAA,CAAA;cDuPvBC,2BAA2B;cAO3BC,0BAA0B;cAO1BC,wBAAwB;AE/BxBM,cFsCA,iBEtCAA,EAAAA;EAWb,IAAaC,EAAAA,OFqCE,qBErCwB;EAUvC,KAAaC,EAAAA,OF4BG,sBE5B0B;EAU1C,QAAaC,EAAAA,OFmBM,yBEnBoB;EAUvC,OAAa,EAAA,OFUK,wBEVL;EASE,KAAA,EAAA,OFEC,sBEFD;CACC;;;cDzRH,cAAA,SAAuB,WAAA;;;;qBAqCf;;ET9BrB,IAAiB,KAAA,CAAA,CAAA,EAAA,MAAA;;;cS+DH;EROd,IAAanC,UAAAA,CAAAA,CAAAA,EAAAA,MAAAA;;;;;;;;;AUpEgB,cD6NhBgC,uBC7NgB,ED6NS,6BC7NT,CAAA;EAE7B,MAAa,EAAA,MAAA;EACkC,KAAA,EAAA,OAAA;EAIjC,WAAA,EAAA,MAAA;EAmDW,mBAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAxDkB,IAAA,EDgOnC,YChOmC,GAAA,IAAA;CAAA,CAAA;;;;ACXrCK,cFiPOJ,wBEjP0C,EFiPhB,6BEjPgB,CAAA,GAAA,CAAA;;;;AAA5B,cF2PdC,2BE3Pc,EF2Pe,6BE3Pf,CAAA,GAAA,CAAA;AAE3B;;;cFmQaC,0BAA0B;;;;cAU1B;eASE;gBACC;mBACG;gBACH;;;;cClRVC,uBAAuB,YAAY,gBAAgB;cAE5C,qBAAA,SAA8B,qBAAA;;UACI;;EXL/C,OAAiB,eAAA,EAAA,GAAA,GAAA,MAAA;;cWSH;;EV6Dd,QAAapC,EAAAA;;;;ECNb,iBAAaG,CAAAA,CAAAA,EAAAA,IAAAA;;;;ECHb,sBAAaG,EAAAA,GAAAA,GAAuD,IAAA;wBQD3C;;;;;cCnEnB+B,qBAAqB,YAAY,gBAAgB;cAE1C,oBAAA,SAA6B,mBAAA;;sBAEtB;;AZGpB"}
+{"version":3,"file":"index.d.ts","names":["useCurrentTimeDisplayState: StateHook<{\n  currentTime: number | undefined;\n  duration: number | undefined;\n}>","getCurrentTimeDisplayProps: PropsHook<{\n  currentTime: number | undefined;\n  duration: number | undefined;\n}>","CurrentTimeDisplayElement: ConnectedComponentConstructor<CurrentTimeDisplayState>","useDurationDisplayState: StateHook<{\n  duration: number | undefined;\n}>","getDurationDisplayProps: PropsHook<{\n  duration: number | undefined;\n}>","DurationDisplayElement: ConnectedComponentConstructor<DurationDisplayState>","getFullscreenButtonState: StateHook<{ fullscreen: boolean }>","getFullscreenButtonProps: PropsHook<{ fullscreen: boolean }>","FullscreenButtonElement: ConnectedComponentConstructor<FullscreenButtonState>","getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","MuteButtonElement: ConnectedComponentConstructor<MuteButtonState>","getPlayButtonState: StateHook<{ paused: boolean }>","getPlayButtonProps: PropsHook<{ paused: boolean }>","PlayButtonElement: ConnectedComponentConstructor<PlayButtonState>","usePreviewTimeDisplayState: StateHook<{\n  previewTime: number | undefined;\n}>","getPreviewTimeDisplayProps: PropsHook<{\n  previewTime: number | undefined;\n}>","PreviewTimeDisplayElement: ConnectedComponentConstructor<PreviewTimeDisplayState>","getTimeSliderRootProps: PropsHook<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","useTimeSliderRootState: StateHook<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","getTimeSliderTrackProps: PropsHook<Record<string, never>>","getTimeSliderProgressProps: PropsHook<Record<string, never>>","getTimeSliderPointerProps: PropsHook<Record<string, never>>","getTimeSliderThumbProps: PropsHook<Record<string, never>>","TimeSliderRootElement: ConnectedComponentConstructor<{\n  currentTime: number;\n  duration: number;\n  requestSeek: (time: number) => void;\n  core: CoreTimeSlider | null;\n}>","TimeSliderTrackElement: ConnectedComponentConstructor<any>","TimeSliderProgressElement: ConnectedComponentConstructor<any>","TimeSliderPointerElement: ConnectedComponentConstructor<any>","TimeSliderThumbElement: ConnectedComponentConstructor<any>","getVolumeSliderRootProps: PropsHook<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","useVolumeSliderRootState: StateHook<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","getVolumeSliderTrackProps: PropsHook<Record<string, never>>","getVolumeSliderProgressProps: PropsHook<Record<string, never>>","getVolumeSliderThumbProps: PropsHook<Record<string, never>>","VolumeSliderRootElement: ConnectedComponentConstructor<{\n  volume: number;\n  muted: boolean;\n  volumeLevel: string;\n  requestVolumeChange: (volume: number) => void;\n  core: CoreVolumeSlider | null;\n}>","VolumeSliderTrackElement: ConnectedComponentConstructor<any>","VolumeSliderIndicatorElement: ConnectedComponentConstructor<any>","VolumeSliderThumbElement: ConnectedComponentConstructor<any>","CustomElementConsumer: Constructor<CustomElement & HTMLElement>","ProviderHTMLElement: Constructor<CustomElement & HTMLElement>"],"sources":["../src/utils/component-factory.ts","../src/elements/current-time-display.ts","../src/elements/duration-display.ts","../src/elements/fullscreen-button.ts","../src/elements/mute-button.ts","../src/elements/play-button.ts","../src/elements/popover.ts","../src/elements/preview-time-display.ts","../src/elements/time-slider.ts","../src/elements/tooltip.ts","../src/elements/volume-slider.ts","../src/media/media-container.ts","../src/media/video-provider.ts"],"sourcesContent":[],"mappings":";;;;;;;UAaiB;cACH,QAAQ;AE+DtB;;;;AGbac,cJmBAZ,yBInBiD,EJmBtB,6BInBR,CJmBsC,uBInBtC,CAAA;;;;cHanBG,wBAAwB,8BAA8B;;;;cCHtDG,yBAAyB,8BAA8B;;;;cCWvDG,mBAAmB,8BAA8B;;;cCrBjDG,mBAAmB,8BAA8B;;;KC9DzD,WAAA;cAEQ,cAAA,SAAuB,WAAA;;;;;ENSpC,oBAAiB,CAAA,CAAA,EAAA,IAAA;qBM4CI;;;EL0BrB,IAAaZ,UAAAA,CAAAA,CAAAA,EAAAA,MAAAA;cKQC;;;;;AFNDS,cGZAM,yBHYiD,EGZtB,6BHYR,CGZsC,uBHYtC,CAAA;;;;cI4JnBO,uBAAuB;;UCzO/B,EAAA,MAAA;EAEL,WAAa,EAAA,CAAA,IAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAgEQ,IAAA,ED2Kb,UC3Ka,GAAA,IAAA;CA6BP,CAAA;AA7FsB,cD8OvBC,sBC9OuB,ED8OC,6BC9OD,CAAA,GAAA,CAAA;AAAA,cDqPvBC,yBCrPuB,EDqPI,6BCrPJ,CAAA,GAAA,CAAA;cD4PvBC,0BAA0B;cAO1BC,wBAAwB;cAOxB;EExCb,IAAaM,EAAAA,OFkDE,qBElDFA;EAWb,KAAaC,EAAAA,OFwCG,sBExCuB;EAUvC,QAAaC,EAAAA,OF+BM,yBE/BwB;EAU3C,OAAaC,EAAAA,OFsBK,wBEtBqB;EAUvC,KAAa,EAAA,OFaG,sBEbH;CASE;;;KDtRV,SAAA;cAEQ,cAAA,SAAuB,WAAA;;;;;ETGpC,iBAAiB,CAAA,CAAA,EAAA,IAAA;;qBS6DI;;ERSrB,IAAanC,UAAAA,CAAAA,CAAAA,EAAAA,MAAAA;;cQoBC;;EP1Bd,IAAaG,gBAAAA,CAAAA,CAAAA,EAAAA,MAAsD;;;;;ASzEnD;;;AAOa,cDiOhB6B,uBCjOgB,EDiOS,6BCjOT,CAAA;EAAA,MAAA,EAAA,MAAA;EAE7B,KAAa,EAAA,OAAA;EACkC,WAAA,EAAA,MAAA;EAIjC,mBAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAmDW,IAAA,ED4KjB,YC5KiB,GAAA,IAAA;CAxDkB,CAAA;;;;cD0O9BC,0BAA0B;AEtPP;;;AAKL,cF2PdC,4BE3Pc,EF2PgB,6BE3PhB,CAAA,GAAA,CAAA;;AAE3B;;cFmQaC,0BAA0B;;;;cAU1B;eASE;gBACC;oBACI;gBACJ;;;;cCtRVC,uBAAuB,YAAY,gBAAgB;cAE5C,qBAAA,SAA8B,qBAAA;;UACI;EXD/C,CAAA;;;cWKc;EViEd,OAAapC,EAAAA,OAAAA;;;;ECNb,WAAaG,CAAAA;;;;ECHb,8BAAoE,EAAA,GAAA,GAAA,IAAA;;wBQL3C;;APgBzB;;;cQ/EMkC,qBAAqB,YAAY,gBAAgB;cAE1C,oBAAA,SAA6B,mBAAA;;sBAEtB;EZGpB,CAAA"}

package/dist/index.js

@@ -1,16 +1,16 @@
 import "./component-factory-DeAN6cjC.js";
 import { t as CurrentTimeDisplayElement } from "./current-time-display-C3qndGf5.js";
 import { t as DurationDisplayElement } from "./duration-display-JOPp3bdU.js";
-import "./button-D1DWjsQu.js";
-import { t as FullscreenButtonElement } from "./fullscreen-button-CGO2UJjs.js";
-import { t as MuteButtonElement } from "./mute-button-vW2sLqqY.js";
-import { t as PlayButtonElement } from "./play-button-aVb0g10G.js";
-import { t as PopoverElement } from "./popover-ty9dFDNE.js";
+import "./button-Bu1mGG-F.js";
+import { t as FullscreenButtonElement } from "./fullscreen-button-C1nq8yP-.js";
+import { t as MuteButtonElement } from "./mute-button-BSDoCZs3.js";
+import { t as PlayButtonElement } from "./play-button-gaqIKsrv.js";
+import { t as PopoverElement } from "./popover-BUCVOjnO.js";
 import { t as PreviewTimeDisplayElement } from "./preview-time-display-Dax0FQ2X.js";
-import { t as TimeSliderElement } from "./time-slider-CA1GMs6A.js";
-import { t as TooltipElement } from "./tooltip-CJpujx2f.js";
-import { t as VolumeSliderElement } from "./volume-slider-guD8gqpi.js";
-import { t as MediaContainerElement } from "./media-container-C0MUzkJ_.js";
+import { t as TimeSliderElement } from "./time-slider-DKamO_2Q.js";
+import { t as TooltipElement } from "./tooltip-B-glki2f.js";
+import { t as VolumeSliderElement } from "./volume-slider-CbFzCHX4.js";
+import { t as MediaContainerElement } from "./media-container-BOL0PKuG.js";
 import { t as MediaSkinElement } from "./media-skin-CxnuHwhu.js";
 import { t as VideoProviderElement } from "./video-provider-BKDqoKFf.js";
 

package/dist/{media-container-C0MUzkJ_.js → media-container-BOL0PKuG.js}

@@ -5,9 +5,6 @@ function getTemplateHTML() {
 	return `
     <slot name="media"></slot>
     <slot></slot>
-    <div id="@default_portal_id" style={ position: absolute; zIndex: 10; }>
-      <slot name="portal"></slot>
-    </div>
   `;
 }
 const CustomElementConsumer = ConsumerMixin(HTMLElement);
@@ -80,4 +77,4 @@ var MediaContainerElement = class extends CustomElementConsumer {
 
 //#endregion
 export { MediaContainerElement as t };
-//# sourceMappingURL=media-container-C0MUzkJ_.js.map
+//# sourceMappingURL=media-container-BOL0PKuG.js.map

package/dist/media-container-BOL0PKuG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-container-BOL0PKuG.js","names":["CustomElementConsumer: Constructor<CustomElement & HTMLElement>"],"sources":["../src/media/media-container.ts"],"sourcesContent":["import type { Constructor, CustomElement } from '@open-wc/context-protocol';\n\nimport { ConsumerMixin } from '@open-wc/context-protocol';\n\nexport function getTemplateHTML() {\n  return /* html */ `\n    <slot name=\"media\"></slot>\n    <slot></slot>\n  `;\n}\n\nconst CustomElementConsumer: Constructor<CustomElement & HTMLElement> = ConsumerMixin(HTMLElement);\n\nexport class MediaContainerElement extends CustomElementConsumer {\n  static shadowRootOptions = { mode: 'open' as ShadowRootMode };\n  static getTemplateHTML: () => string = getTemplateHTML;\n\n  _mediaStore: any;\n  _mediaSlot: HTMLSlotElement;\n  _paused: boolean = true;\n  contexts = {\n    mediaStore: (mediaStore: any): void => {\n      this._mediaStore = mediaStore;\n      this._handleMediaSlotChange();\n      this._registerContainerStateOwner();\n      this._subscribeToPlayState();\n    },\n  };\n\n  constructor() {\n    super();\n\n    if (!this.shadowRoot) {\n      this.attachShadow((this.constructor as typeof MediaContainerElement).shadowRootOptions);\n      this.shadowRoot!.innerHTML = (this.constructor as typeof MediaContainerElement).getTemplateHTML();\n    }\n\n    this._mediaSlot = this.shadowRoot!.querySelector('slot[name=media]') as HTMLSlotElement;\n    this._mediaSlot.addEventListener('slotchange', this._handleMediaSlotChange);\n\n    // Add click handler for play/pause functionality\n    this.addEventListener('click', this._handleClick);\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback?.();\n    this._registerContainerStateOwner();\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback?.();\n    this._unregisterContainerStateOwner();\n  }\n\n  _registerContainerStateOwner = (): void => {\n    if (!this._mediaStore) return;\n    this._mediaStore.dispatch({ type: 'containerstateownerchangerequest', detail: this });\n  };\n\n  _unregisterContainerStateOwner = (): void => {\n    if (!this._mediaStore) return;\n    this._mediaStore.dispatch({ type: 'containerstateownerchangerequest', detail: null });\n  };\n\n  _handleMediaSlotChange = (): void => {\n    const media = this._mediaSlot.assignedElements({ flatten: true })[0];\n    this._mediaStore.dispatch({ type: 'mediastateownerchangerequest', detail: media });\n  };\n\n  _handleClick = (event: Event): void => {\n    if (!this._mediaStore) return;\n\n    if (!['video', 'audio'].includes((event.target as HTMLElement).localName || '')) return;\n\n    if (this._paused) {\n      this._mediaStore.dispatch({ type: 'playrequest' });\n    } else {\n      this._mediaStore.dispatch({ type: 'pauserequest' });\n    }\n  };\n\n  _subscribeToPlayState = (): void => {\n    if (!this._mediaStore) return;\n\n    // Subscribe to paused state changes\n    this._mediaStore.subscribe((state: any) => {\n      this._paused = state.paused ?? true;\n    });\n  };\n}\n"],"mappings":";;;AAIA,SAAgB,kBAAkB;AAChC,QAAkB;;;;;AAMpB,MAAMA,wBAAkE,cAAc,YAAY;AAElG,IAAa,wBAAb,cAA2C,sBAAsB;;2BACpC,EAAE,MAAM,QAA0B;;;yBACtB;;CAcvC,cAAc;AACZ,SAAO;iBAXU;kBACR,EACT,aAAa,eAA0B;AACrC,QAAK,cAAc;AACnB,QAAK,wBAAwB;AAC7B,QAAK,8BAA8B;AACnC,QAAK,uBAAuB;KAE/B;4CA2B0C;AACzC,OAAI,CAAC,KAAK,YAAa;AACvB,QAAK,YAAY,SAAS;IAAE,MAAM;IAAoC,QAAQ;IAAM,CAAC;;8CAG1C;AAC3C,OAAI,CAAC,KAAK,YAAa;AACvB,QAAK,YAAY,SAAS;IAAE,MAAM;IAAoC,QAAQ;IAAM,CAAC;;sCAGlD;GACnC,MAAM,QAAQ,KAAK,WAAW,iBAAiB,EAAE,SAAS,MAAM,CAAC,CAAC;AAClE,QAAK,YAAY,SAAS;IAAE,MAAM;IAAgC,QAAQ;IAAO,CAAC;;uBAGpE,UAAuB;AACrC,OAAI,CAAC,KAAK,YAAa;AAEvB,OAAI,CAAC,CAAC,SAAS,QAAQ,CAAC,SAAU,MAAM,OAAuB,aAAa,GAAG,CAAE;AAEjF,OAAI,KAAK,QACP,MAAK,YAAY,SAAS,EAAE,MAAM,eAAe,CAAC;OAElD,MAAK,YAAY,SAAS,EAAE,MAAM,gBAAgB,CAAC;;qCAInB;AAClC,OAAI,CAAC,KAAK,YAAa;AAGvB,QAAK,YAAY,WAAW,UAAe;AACzC,SAAK,UAAU,MAAM,UAAU;KAC/B;;AAvDF,MAAI,CAAC,KAAK,YAAY;AACpB,QAAK,aAAc,KAAK,YAA6C,kBAAkB;AACvF,QAAK,WAAY,YAAa,KAAK,YAA6C,iBAAiB;;AAGnG,OAAK,aAAa,KAAK,WAAY,cAAc,mBAAmB;AACpE,OAAK,WAAW,iBAAiB,cAAc,KAAK,uBAAuB;AAG3E,OAAK,iBAAiB,SAAS,KAAK,aAAa;;CAGnD,oBAA0B;AACxB,QAAM,qBAAqB;AAC3B,OAAK,8BAA8B;;CAGrC,uBAA6B;AAC3B,QAAM,wBAAwB;AAC9B,OAAK,gCAAgC"}

package/dist/{media-container-BGEXSi9g.js → media-container-DwKSOa1h.js}

@@ -1,8 +1,8 @@
-import { t as MediaContainerElement } from "./media-container-C0MUzkJ_.js";
+import { t as MediaContainerElement } from "./media-container-BOL0PKuG.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-container.ts
 defineCustomElement("media-container", MediaContainerElement);
 
 //#endregion
-//# sourceMappingURL=media-container-BGEXSi9g.js.map
+//# sourceMappingURL=media-container-DwKSOa1h.js.map

package/dist/{media-container-BGEXSi9g.js.map → media-container-DwKSOa1h.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-container-BGEXSi9g.js","names":[],"sources":["../src/define/media-container.ts"],"sourcesContent":["import { MediaContainerElement } from '@/media/media-container';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-container', MediaContainerElement);\n"],"mappings":";;;;AAGA,oBAAoB,mBAAmB,sBAAsB"}
+{"version":3,"file":"media-container-DwKSOa1h.js","names":[],"sources":["../src/define/media-container.ts"],"sourcesContent":["import { MediaContainerElement } from '@/media/media-container';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-container', MediaContainerElement);\n"],"mappings":";;;;AAGA,oBAAoB,mBAAmB,sBAAsB"}

package/dist/{media-fullscreen-button-Dcflbt54.js → media-fullscreen-button-CIpcLhtU.js}

@@ -1,8 +1,8 @@
-import { t as FullscreenButtonElement } from "./fullscreen-button-CGO2UJjs.js";
+import { t as FullscreenButtonElement } from "./fullscreen-button-C1nq8yP-.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-fullscreen-button.ts
 defineCustomElement("media-fullscreen-button", FullscreenButtonElement);
 
 //#endregion
-//# sourceMappingURL=media-fullscreen-button-Dcflbt54.js.map
+//# sourceMappingURL=media-fullscreen-button-CIpcLhtU.js.map

package/dist/{media-fullscreen-button-Dcflbt54.js.map → media-fullscreen-button-CIpcLhtU.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-fullscreen-button-Dcflbt54.js","names":[],"sources":["../src/define/media-fullscreen-button.ts"],"sourcesContent":["import { FullscreenButtonElement } from '@/elements/fullscreen-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-fullscreen-button', FullscreenButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,2BAA2B,wBAAwB"}
+{"version":3,"file":"media-fullscreen-button-CIpcLhtU.js","names":[],"sources":["../src/define/media-fullscreen-button.ts"],"sourcesContent":["import { FullscreenButtonElement } from '@/elements/fullscreen-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-fullscreen-button', FullscreenButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,2BAA2B,wBAAwB"}

package/dist/{media-mute-button-BOVhZ3aP.js → media-mute-button-CHHISH91.js}

@@ -1,8 +1,8 @@
-import { t as MuteButtonElement } from "./mute-button-vW2sLqqY.js";
+import { t as MuteButtonElement } from "./mute-button-BSDoCZs3.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-mute-button.ts
 defineCustomElement("media-mute-button", MuteButtonElement);
 
 //#endregion
-//# sourceMappingURL=media-mute-button-BOVhZ3aP.js.map
+//# sourceMappingURL=media-mute-button-CHHISH91.js.map

package/dist/{media-mute-button-BOVhZ3aP.js.map → media-mute-button-CHHISH91.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-mute-button-BOVhZ3aP.js","names":[],"sources":["../src/define/media-mute-button.ts"],"sourcesContent":["import { MuteButtonElement } from '@/elements/mute-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-mute-button', MuteButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,kBAAkB"}
+{"version":3,"file":"media-mute-button-CHHISH91.js","names":[],"sources":["../src/define/media-mute-button.ts"],"sourcesContent":["import { MuteButtonElement } from '@/elements/mute-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-mute-button', MuteButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,kBAAkB"}

package/dist/{media-play-button-CLj-hkwn.js → media-play-button-DhSK0JQk.js}

@@ -1,8 +1,8 @@
-import { t as PlayButtonElement } from "./play-button-aVb0g10G.js";
+import { t as PlayButtonElement } from "./play-button-gaqIKsrv.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-play-button.ts
 defineCustomElement("media-play-button", PlayButtonElement);
 
 //#endregion
-//# sourceMappingURL=media-play-button-CLj-hkwn.js.map
+//# sourceMappingURL=media-play-button-DhSK0JQk.js.map

package/dist/{media-play-button-CLj-hkwn.js.map → media-play-button-DhSK0JQk.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-play-button-CLj-hkwn.js","names":[],"sources":["../src/define/media-play-button.ts"],"sourcesContent":["import { PlayButtonElement } from '@/elements/play-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-play-button', PlayButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,kBAAkB"}
+{"version":3,"file":"media-play-button-DhSK0JQk.js","names":[],"sources":["../src/define/media-play-button.ts"],"sourcesContent":["import { PlayButtonElement } from '@/elements/play-button';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-play-button', PlayButtonElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,kBAAkB"}

package/dist/{media-popover-DVCIlSBX.js → media-popover-Cw9d_Bh3.js}

@@ -1,8 +1,8 @@
-import { t as PopoverElement } from "./popover-ty9dFDNE.js";
+import { t as PopoverElement } from "./popover-BUCVOjnO.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-popover.ts
 defineCustomElement("media-popover", PopoverElement);
 
 //#endregion
-//# sourceMappingURL=media-popover-DVCIlSBX.js.map
+//# sourceMappingURL=media-popover-Cw9d_Bh3.js.map

package/dist/{media-popover-DVCIlSBX.js.map → media-popover-Cw9d_Bh3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-popover-DVCIlSBX.js","names":[],"sources":["../src/define/media-popover.ts"],"sourcesContent":["import { PopoverElement } from '@/elements/popover';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-popover', PopoverElement);\n"],"mappings":";;;;AAGA,oBAAoB,iBAAiB,eAAe"}
+{"version":3,"file":"media-popover-Cw9d_Bh3.js","names":[],"sources":["../src/define/media-popover.ts"],"sourcesContent":["import { PopoverElement } from '@/elements/popover';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-popover', PopoverElement);\n"],"mappings":";;;;AAGA,oBAAoB,iBAAiB,eAAe"}

package/dist/{media-time-slider-Bp2qnwsW.js → media-time-slider-SuxR3Rep.js}

@@ -1,4 +1,4 @@
-import { a as TimeSliderThumbElement, i as TimeSliderRootElement, n as TimeSliderPointerElement, o as TimeSliderTrackElement, r as TimeSliderProgressElement } from "./time-slider-CA1GMs6A.js";
+import { a as TimeSliderThumbElement, i as TimeSliderRootElement, n as TimeSliderPointerElement, o as TimeSliderTrackElement, r as TimeSliderProgressElement } from "./time-slider-DKamO_2Q.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-time-slider.ts
@@ -9,4 +9,4 @@ defineCustomElement("media-time-slider-pointer", TimeSliderPointerElement);
 defineCustomElement("media-time-slider-thumb", TimeSliderThumbElement);
 
 //#endregion
-//# sourceMappingURL=media-time-slider-Bp2qnwsW.js.map
+//# sourceMappingURL=media-time-slider-SuxR3Rep.js.map

package/dist/{media-time-slider-Bp2qnwsW.js.map → media-time-slider-SuxR3Rep.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-time-slider-Bp2qnwsW.js","names":[],"sources":["../src/define/media-time-slider.ts"],"sourcesContent":["import { TimeSliderPointerElement, TimeSliderProgressElement, TimeSliderRootElement, TimeSliderThumbElement, TimeSliderTrackElement } from '@/elements/time-slider';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-time-slider', TimeSliderRootElement);\ndefineCustomElement('media-time-slider-track', TimeSliderTrackElement);\ndefineCustomElement('media-time-slider-progress', TimeSliderProgressElement);\ndefineCustomElement('media-time-slider-pointer', TimeSliderPointerElement);\ndefineCustomElement('media-time-slider-thumb', TimeSliderThumbElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,sBAAsB;AAC/D,oBAAoB,2BAA2B,uBAAuB;AACtE,oBAAoB,8BAA8B,0BAA0B;AAC5E,oBAAoB,6BAA6B,yBAAyB;AAC1E,oBAAoB,2BAA2B,uBAAuB"}
+{"version":3,"file":"media-time-slider-SuxR3Rep.js","names":[],"sources":["../src/define/media-time-slider.ts"],"sourcesContent":["import { TimeSliderPointerElement, TimeSliderProgressElement, TimeSliderRootElement, TimeSliderThumbElement, TimeSliderTrackElement } from '@/elements/time-slider';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-time-slider', TimeSliderRootElement);\ndefineCustomElement('media-time-slider-track', TimeSliderTrackElement);\ndefineCustomElement('media-time-slider-progress', TimeSliderProgressElement);\ndefineCustomElement('media-time-slider-pointer', TimeSliderPointerElement);\ndefineCustomElement('media-time-slider-thumb', TimeSliderThumbElement);\n"],"mappings":";;;;AAGA,oBAAoB,qBAAqB,sBAAsB;AAC/D,oBAAoB,2BAA2B,uBAAuB;AACtE,oBAAoB,8BAA8B,0BAA0B;AAC5E,oBAAoB,6BAA6B,yBAAyB;AAC1E,oBAAoB,2BAA2B,uBAAuB"}

package/dist/{media-tooltip-C4jOtQ8a.js → media-tooltip-CMRN_X4D.js}

@@ -1,8 +1,8 @@
-import { t as TooltipElement } from "./tooltip-CJpujx2f.js";
+import { t as TooltipElement } from "./tooltip-B-glki2f.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-tooltip.ts
 defineCustomElement("media-tooltip", TooltipElement);
 
 //#endregion
-//# sourceMappingURL=media-tooltip-C4jOtQ8a.js.map
+//# sourceMappingURL=media-tooltip-CMRN_X4D.js.map

package/dist/{media-tooltip-C4jOtQ8a.js.map → media-tooltip-CMRN_X4D.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-tooltip-C4jOtQ8a.js","names":[],"sources":["../src/define/media-tooltip.ts"],"sourcesContent":["import { TooltipElement } from '@/elements/tooltip';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-tooltip', TooltipElement);\n"],"mappings":";;;;AAGA,oBAAoB,iBAAiB,eAAe"}
+{"version":3,"file":"media-tooltip-CMRN_X4D.js","names":[],"sources":["../src/define/media-tooltip.ts"],"sourcesContent":["import { TooltipElement } from '@/elements/tooltip';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-tooltip', TooltipElement);\n"],"mappings":";;;;AAGA,oBAAoB,iBAAiB,eAAe"}

package/dist/{media-volume-slider-CKSxmdQv.js → media-volume-slider-B-n6b3Y8.js}

@@ -1,4 +1,4 @@
-import { a as VolumeSliderTrackElement, i as VolumeSliderThumbElement, n as VolumeSliderIndicatorElement, r as VolumeSliderRootElement } from "./volume-slider-guD8gqpi.js";
+import { a as VolumeSliderTrackElement, i as VolumeSliderThumbElement, n as VolumeSliderIndicatorElement, r as VolumeSliderRootElement } from "./volume-slider-CbFzCHX4.js";
 import { t as defineCustomElement } from "./custom-element-3bDlB2XO.js";
 
 //#region src/define/media-volume-slider.ts
@@ -8,4 +8,4 @@ defineCustomElement("media-volume-slider-indicator", VolumeSliderIndicatorElemen
 defineCustomElement("media-volume-slider-thumb", VolumeSliderThumbElement);
 
 //#endregion
-//# sourceMappingURL=media-volume-slider-CKSxmdQv.js.map
+//# sourceMappingURL=media-volume-slider-B-n6b3Y8.js.map

package/dist/{media-volume-slider-CKSxmdQv.js.map → media-volume-slider-B-n6b3Y8.js.map}

@@ -1 +1 @@
-{"version":3,"file":"media-volume-slider-CKSxmdQv.js","names":[],"sources":["../src/define/media-volume-slider.ts"],"sourcesContent":["import { VolumeSliderIndicatorElement, VolumeSliderRootElement, VolumeSliderThumbElement, VolumeSliderTrackElement } from '@/elements/volume-slider';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-volume-slider', VolumeSliderRootElement);\ndefineCustomElement('media-volume-slider-track', VolumeSliderTrackElement);\ndefineCustomElement('media-volume-slider-indicator', VolumeSliderIndicatorElement);\ndefineCustomElement('media-volume-slider-thumb', VolumeSliderThumbElement);\n"],"mappings":";;;;AAGA,oBAAoB,uBAAuB,wBAAwB;AACnE,oBAAoB,6BAA6B,yBAAyB;AAC1E,oBAAoB,iCAAiC,6BAA6B;AAClF,oBAAoB,6BAA6B,yBAAyB"}
+{"version":3,"file":"media-volume-slider-B-n6b3Y8.js","names":[],"sources":["../src/define/media-volume-slider.ts"],"sourcesContent":["import { VolumeSliderIndicatorElement, VolumeSliderRootElement, VolumeSliderThumbElement, VolumeSliderTrackElement } from '@/elements/volume-slider';\nimport { defineCustomElement } from '@/utils/custom-element';\n\ndefineCustomElement('media-volume-slider', VolumeSliderRootElement);\ndefineCustomElement('media-volume-slider-track', VolumeSliderTrackElement);\ndefineCustomElement('media-volume-slider-indicator', VolumeSliderIndicatorElement);\ndefineCustomElement('media-volume-slider-thumb', VolumeSliderThumbElement);\n"],"mappings":";;;;AAGA,oBAAoB,uBAAuB,wBAAwB;AACnE,oBAAoB,6BAA6B,yBAAyB;AAC1E,oBAAoB,iCAAiC,6BAA6B;AAClF,oBAAoB,6BAA6B,yBAAyB"}

package/dist/{mute-button-vW2sLqqY.js → mute-button-BSDoCZs3.js}

@@ -1,5 +1,5 @@
 import { t as toConnectedHTMLComponent } from "./component-factory-DeAN6cjC.js";
-import { t as ButtonElement } from "./button-D1DWjsQu.js";
+import { t as ButtonElement } from "./button-Bu1mGG-F.js";
 import { muteButtonStateDefinition } from "@videojs/core/store";
 import { setAttributes } from "@videojs/utils/dom";
 
@@ -47,4 +47,4 @@ const MuteButtonElement = toConnectedHTMLComponent(MuteButton, getMuteButtonStat
 
 //#endregion
 export { MuteButtonElement as t };
-//# sourceMappingURL=mute-button-vW2sLqqY.js.map
+//# sourceMappingURL=mute-button-BSDoCZs3.js.map

package/dist/{mute-button-vW2sLqqY.js.map → mute-button-BSDoCZs3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"mute-button-vW2sLqqY.js","names":["getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","MuteButtonElement: ConnectedComponentConstructor<MuteButtonState>"],"sources":["../src/elements/mute-button.ts"],"sourcesContent":["import type { MuteButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { muteButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class MuteButton extends ButtonElement {\n  _state:\n    | {\n      muted: boolean;\n      volumeLevel: string;\n      requestMute: () => void;\n      requestUnmute: () => void;\n    }\n    | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n\n    if (state) {\n      if (type === 'click') {\n        if (state.volumeLevel === 'off') {\n          state.requestUnmute();\n        } else {\n          state.requestMute();\n        }\n      }\n    }\n  }\n\n  get muted(): boolean {\n    return this._state?.muted ?? false;\n  }\n\n  get volumeLevel(): string {\n    return this._state?.volumeLevel ?? 'high';\n  }\n\n  _update(props: any, state: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\nexport const getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}> = {\n  keys: muteButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...muteButtonStateDefinition.stateTransform(rawState),\n    ...muteButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-muted': state.muted,\n    'data-volume-level': state.volumeLevel,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.muted ? 'unmute' : 'mute',\n    /** tooltip */\n    'data-tooltip': state.muted ? 'Unmute' : 'Mute',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const MuteButtonElement: ConnectedComponentConstructor<MuteButtonState> = toConnectedHTMLComponent(\n  MuteButton,\n  getMuteButtonState,\n  getMuteButtonProps,\n  'MuteButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,aAAb,cAAgC,cAAc;CAU5C,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AAEnB,MAAI,OACF;OAAI,SAAS,QACX,KAAI,MAAM,gBAAgB,MACxB,OAAM,eAAe;OAErB,OAAM,aAAa;;;CAM3B,IAAI,QAAiB;AACnB,SAAO,KAAK,QAAQ,SAAS;;CAG/B,IAAI,cAAsB;AACxB,SAAO,KAAK,QAAQ,eAAe;;CAGrC,QAAQ,OAAY,OAAkB;AACpC,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;AAI9B,MAAaA,qBAGR;CACH,MAAM,0BAA0B;CAChC,YAAY,UAAU,gBAAgB;EACpC,GAAG,0BAA0B,eAAe,SAAS;EACrD,GAAG,0BAA0B,qBAAqB,WAAW,SAAS;EACvE;CACF;AAED,MAAaC,sBAGP,OAAO,aAAa;AAiBxB,QAhBuC;EAErC,cAAc,MAAM;EACpB,qBAAqB,MAAM;EAG3B,MAAM;EACN,UAAU;EACV,cAAc,MAAM,QAAQ,WAAW;EAEvC,gBAAgB,MAAM,QAAQ,WAAW;EAI1C;;AAKH,MAAaC,oBAAoE,yBAC/E,YACA,oBACA,oBACA,aACD"}
+{"version":3,"file":"mute-button-BSDoCZs3.js","names":["getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}>","MuteButtonElement: ConnectedComponentConstructor<MuteButtonState>"],"sources":["../src/elements/mute-button.ts"],"sourcesContent":["import type { MuteButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { muteButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class MuteButton extends ButtonElement {\n  _state:\n    | {\n      muted: boolean;\n      volumeLevel: string;\n      requestMute: () => void;\n      requestUnmute: () => void;\n    }\n    | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n\n    if (state) {\n      if (type === 'click') {\n        if (state.volumeLevel === 'off') {\n          state.requestUnmute();\n        } else {\n          state.requestMute();\n        }\n      }\n    }\n  }\n\n  get muted(): boolean {\n    return this._state?.muted ?? false;\n  }\n\n  get volumeLevel(): string {\n    return this._state?.volumeLevel ?? 'high';\n  }\n\n  _update(props: any, state: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\nexport const getMuteButtonState: StateHook<{\n  muted: boolean;\n  volumeLevel: string;\n}> = {\n  keys: muteButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...muteButtonStateDefinition.stateTransform(rawState),\n    ...muteButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getMuteButtonProps: PropsHook<{\n  muted: boolean;\n  volumeLevel: string;\n}> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-muted': state.muted,\n    'data-volume-level': state.volumeLevel,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.muted ? 'unmute' : 'mute',\n    /** tooltip */\n    'data-tooltip': state.muted ? 'Unmute' : 'Mute',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const MuteButtonElement: ConnectedComponentConstructor<MuteButtonState> = toConnectedHTMLComponent(\n  MuteButton,\n  getMuteButtonState,\n  getMuteButtonProps,\n  'MuteButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,aAAb,cAAgC,cAAc;CAU5C,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AAEnB,MAAI,OACF;OAAI,SAAS,QACX,KAAI,MAAM,gBAAgB,MACxB,OAAM,eAAe;OAErB,OAAM,aAAa;;;CAM3B,IAAI,QAAiB;AACnB,SAAO,KAAK,QAAQ,SAAS;;CAG/B,IAAI,cAAsB;AACxB,SAAO,KAAK,QAAQ,eAAe;;CAGrC,QAAQ,OAAY,OAAkB;AACpC,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;AAI9B,MAAaA,qBAGR;CACH,MAAM,0BAA0B;CAChC,YAAY,UAAU,gBAAgB;EACpC,GAAG,0BAA0B,eAAe,SAAS;EACrD,GAAG,0BAA0B,qBAAqB,WAAW,SAAS;EACvE;CACF;AAED,MAAaC,sBAGP,OAAO,aAAa;AAiBxB,QAhBuC;EAErC,cAAc,MAAM;EACpB,qBAAqB,MAAM;EAG3B,MAAM;EACN,UAAU;EACV,cAAc,MAAM,QAAQ,WAAW;EAEvC,gBAAgB,MAAM,QAAQ,WAAW;EAI1C;;AAKH,MAAaC,oBAAoE,yBAC/E,YACA,oBACA,oBACA,aACD"}

package/dist/{play-button-aVb0g10G.js → play-button-gaqIKsrv.js}

@@ -1,5 +1,5 @@
 import { t as toConnectedHTMLComponent } from "./component-factory-DeAN6cjC.js";
-import { t as ButtonElement } from "./button-D1DWjsQu.js";
+import { t as ButtonElement } from "./button-Bu1mGG-F.js";
 import { playButtonStateDefinition } from "@videojs/core/store";
 import { setAttributes } from "@videojs/utils/dom";
 
@@ -41,4 +41,4 @@ const PlayButtonElement = toConnectedHTMLComponent(PlayButton, getPlayButtonStat
 
 //#endregion
 export { PlayButtonElement as t };
-//# sourceMappingURL=play-button-aVb0g10G.js.map
+//# sourceMappingURL=play-button-gaqIKsrv.js.map

package/dist/{play-button-aVb0g10G.js.map → play-button-gaqIKsrv.js.map}

@@ -1 +1 @@
-{"version":3,"file":"play-button-aVb0g10G.js","names":["getPlayButtonState: StateHook<{ paused: boolean }>","getPlayButtonProps: PropsHook<{ paused: boolean }>","PlayButtonElement: ConnectedComponentConstructor<PlayButtonState>"],"sources":["../src/elements/play-button.ts"],"sourcesContent":["import type { PlayButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { playButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class PlayButton extends ButtonElement {\n  _state: { paused: boolean; requestPlay: () => void; requestPause: () => void } | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n    if (state && type === 'click') {\n      if (state.paused) {\n        state.requestPlay();\n      } else {\n        state.requestPause();\n      }\n    }\n  }\n\n  get paused(): boolean {\n    return this._state?.paused ?? true;\n  }\n\n  _update(props: any, state: any, _mediaStore?: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\nexport const getPlayButtonState: StateHook<{ paused: boolean }> = {\n  keys: playButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...playButtonStateDefinition.stateTransform(rawState),\n    ...playButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getPlayButtonProps: PropsHook<{ paused: boolean }> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-paused': state.paused,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.paused ? 'play' : 'pause',\n    /** tooltip */\n    'data-tooltip': state.paused ? 'Play' : 'Pause',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const PlayButtonElement: ConnectedComponentConstructor<PlayButtonState> = toConnectedHTMLComponent(\n  PlayButton,\n  getPlayButtonState,\n  getPlayButtonProps,\n  'PlayButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,aAAb,cAAgC,cAAc;CAG5C,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AACnB,MAAI,SAAS,SAAS,QACpB,KAAI,MAAM,OACR,OAAM,aAAa;MAEnB,OAAM,cAAc;;CAK1B,IAAI,SAAkB;AACpB,SAAO,KAAK,QAAQ,UAAU;;CAGhC,QAAQ,OAAY,OAAY,aAAyB;AACvD,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;AAI9B,MAAaA,qBAAqD;CAChE,MAAM,0BAA0B;CAChC,YAAY,UAAU,gBAAgB;EACpC,GAAG,0BAA0B,eAAe,SAAS;EACrD,GAAG,0BAA0B,qBAAqB,WAAW,SAAS;EACvE;CACF;AAED,MAAaC,sBAAsD,OAAO,aAAa;AAgBrF,QAfuC;EAErC,eAAe,MAAM;EAGrB,MAAM;EACN,UAAU;EACV,cAAc,MAAM,SAAS,SAAS;EAEtC,gBAAgB,MAAM,SAAS,SAAS;EAIzC;;AAKH,MAAaC,oBAAoE,yBAC/E,YACA,oBACA,oBACA,aACD"}
+{"version":3,"file":"play-button-gaqIKsrv.js","names":["getPlayButtonState: StateHook<{ paused: boolean }>","getPlayButtonProps: PropsHook<{ paused: boolean }>","PlayButtonElement: ConnectedComponentConstructor<PlayButtonState>"],"sources":["../src/elements/play-button.ts"],"sourcesContent":["import type { PlayButtonState } from '@videojs/core/store';\nimport type { ConnectedComponentConstructor, PropsHook, StateHook } from '../utils/component-factory';\n\nimport { playButtonStateDefinition } from '@videojs/core/store';\n\nimport { setAttributes } from '@videojs/utils/dom';\nimport { toConnectedHTMLComponent } from '../utils/component-factory';\nimport { ButtonElement } from './button';\n\nexport class PlayButton extends ButtonElement {\n  _state: { paused: boolean; requestPlay: () => void; requestPause: () => void } | undefined;\n\n  handleEvent(event: Event): void {\n    super.handleEvent(event);\n\n    const { type } = event;\n    const state = this._state;\n    if (state && type === 'click') {\n      if (state.paused) {\n        state.requestPlay();\n      } else {\n        state.requestPause();\n      }\n    }\n  }\n\n  get paused(): boolean {\n    return this._state?.paused ?? true;\n  }\n\n  _update(props: any, state: any, _mediaStore?: any): void {\n    this._state = state;\n    /** @TODO Follow up with React vs. W.C. data-* attributes discrepancies (CJP)  */\n    setAttributes(this, props);\n  }\n}\n\nexport const getPlayButtonState: StateHook<{ paused: boolean }> = {\n  keys: playButtonStateDefinition.keys,\n  transform: (rawState, mediaStore) => ({\n    ...playButtonStateDefinition.stateTransform(rawState),\n    ...playButtonStateDefinition.createRequestMethods(mediaStore.dispatch),\n  }),\n};\n\nexport const getPlayButtonProps: PropsHook<{ paused: boolean }> = (state, _element) => {\n  const baseProps: Record<string, any> = {\n    /** data attributes/props */\n    'data-paused': state.paused,\n    /** @TODO Need another state provider in core for i18n (CJP) */\n    /** aria attributes/props */\n    role: 'button',\n    tabindex: '0',\n    'aria-label': state.paused ? 'play' : 'pause',\n    /** tooltip */\n    'data-tooltip': state.paused ? 'Play' : 'Pause',\n    /** @TODO Figure out how we want to handle attr overrides (e.g. aria-label) (CJP) */\n    /** external props spread last to allow for overriding */\n    // ...props,\n  };\n\n  return baseProps;\n};\n\nexport const PlayButtonElement: ConnectedComponentConstructor<PlayButtonState> = toConnectedHTMLComponent(\n  PlayButton,\n  getPlayButtonState,\n  getPlayButtonProps,\n  'PlayButton',\n);\n"],"mappings":";;;;;;AASA,IAAa,aAAb,cAAgC,cAAc;CAG5C,YAAY,OAAoB;AAC9B,QAAM,YAAY,MAAM;EAExB,MAAM,EAAE,SAAS;EACjB,MAAM,QAAQ,KAAK;AACnB,MAAI,SAAS,SAAS,QACpB,KAAI,MAAM,OACR,OAAM,aAAa;MAEnB,OAAM,cAAc;;CAK1B,IAAI,SAAkB;AACpB,SAAO,KAAK,QAAQ,UAAU;;CAGhC,QAAQ,OAAY,OAAY,aAAyB;AACvD,OAAK,SAAS;;AAEd,gBAAc,MAAM,MAAM;;;AAI9B,MAAaA,qBAAqD;CAChE,MAAM,0BAA0B;CAChC,YAAY,UAAU,gBAAgB;EACpC,GAAG,0BAA0B,eAAe,SAAS;EACrD,GAAG,0BAA0B,qBAAqB,WAAW,SAAS;EACvE;CACF;AAED,MAAaC,sBAAsD,OAAO,aAAa;AAgBrF,QAfuC;EAErC,eAAe,MAAM;EAGrB,MAAM;EACN,UAAU;EACV,cAAc,MAAM,SAAS,SAAS;EAEtC,gBAAgB,MAAM,SAAS,SAAS;EAIzC;;AAKH,MAAaC,oBAAoE,yBAC/E,YACA,oBACA,oBACA,aACD"}