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

package/cdn/seek-button-element-BkC8xrVR.js

@@ -0,0 +1,394 @@
+import { N as defaults, O as selectPlaybackRate, _ as MediaButtonElement, b as applyElementProps, d as MenuRadioItemElement, f as MenuRadioGroupElement, j as selectTime, m as MenuElement, p as MenuItemIndicatorElement, v as applyStateDataAttrs, y as logMissingFeature } from "./compounds-DxdDY3jr.js";
+import { E as createState, j as MediaElement, n as PlayerController } from "./create-player-_WED6HtK.js";
+import { l as playerContext, o as isUndefined, t as isFunction } from "./predicate-Dqd8wbW6.js";
+
+//#region ../core/dist/dev/core/ui/playback-rate-menu/playback-rate-menu-core.js
+function formatPlaybackRate(rate) {
+	return `${rate}×`;
+}
+var PlaybackRateMenuCore = class PlaybackRateMenuCore {
+	static defaultProps = {
+		label: "",
+		formatRate: formatPlaybackRate,
+		disabled: false
+	};
+	state = createState({
+		rate: 1,
+		rates: [],
+		disabled: false,
+		label: ""
+	});
+	#props = { ...PlaybackRateMenuCore.defaultProps };
+	#media = null;
+	constructor(props) {
+		if (props) this.setProps(props);
+	}
+	setProps(props) {
+		this.#props = defaults(props, PlaybackRateMenuCore.defaultProps);
+	}
+	getLabel(state) {
+		const { label } = this.#props;
+		if (isFunction(label)) {
+			const customLabel = label(state);
+			if (customLabel) return customLabel;
+		} else if (label) return label;
+		return `Playback rate ${state.rate}`;
+	}
+	getRateLabel(rate) {
+		return this.#props.formatRate(rate);
+	}
+	getRateValue(rate) {
+		return String(rate);
+	}
+	getAttrs(state) {
+		return {
+			"aria-label": this.getLabel(state),
+			"aria-disabled": state.disabled ? "true" : void 0
+		};
+	}
+	setMedia(media) {
+		this.#media = media;
+	}
+	getState() {
+		const media = this.#media;
+		this.state.patch({
+			rate: media.playbackRate,
+			rates: media.playbackRates,
+			disabled: this.#props.disabled || media.playbackRates.length === 0
+		});
+		this.state.patch({ label: this.getLabel(this.state.current) });
+		return this.state.current;
+	}
+	select(media, rate) {
+		if (this.#props.disabled) return;
+		if (!media.playbackRates.includes(rate)) return;
+		media.setPlaybackRate(rate);
+	}
+	selectValue(media, value) {
+		const rate = media.playbackRates.find((candidate) => this.getRateValue(candidate) === value);
+		if (isUndefined(rate)) return;
+		this.select(media, rate);
+	}
+};
+
+//#endregion
+//#region ../core/dist/dev/core/ui/playback-rate-menu/playback-rate-menu-data-attrs.js
+const PlaybackRateMenuDataAttrs = {
+	rate: "data-rate",
+	disabled: "data-disabled"
+};
+
+//#endregion
+//#region ../core/dist/dev/core/ui/seek-button/seek-button-core.js
+var SeekButtonCore = class SeekButtonCore {
+	static defaultProps = {
+		seconds: 30,
+		label: "",
+		disabled: false
+	};
+	state = createState({
+		seeking: false,
+		direction: "forward",
+		label: ""
+	});
+	#props = { ...SeekButtonCore.defaultProps };
+	#media = null;
+	constructor(props) {
+		if (props) this.setProps(props);
+	}
+	setProps(props) {
+		this.#props = defaults(props, SeekButtonCore.defaultProps);
+	}
+	getLabel(state) {
+		const { label } = this.#props;
+		if (isFunction(label)) {
+			const customLabel = label(state);
+			if (customLabel) return customLabel;
+		} else if (label) return label;
+		const abs = Math.abs(this.#props.seconds);
+		return state.direction === "backward" ? `Seek backward ${abs} seconds` : `Seek forward ${abs} seconds`;
+	}
+	getAttrs(state) {
+		return {
+			"aria-label": this.getLabel(state),
+			"aria-disabled": this.#props.disabled ? "true" : void 0
+		};
+	}
+	setMedia(media) {
+		this.#media = media;
+	}
+	getState() {
+		const media = this.#media;
+		const direction = this.#props.seconds < 0 ? "backward" : "forward";
+		this.state.patch({
+			seeking: media.seeking,
+			direction
+		});
+		this.state.patch({ label: this.getLabel(this.state.current) });
+		return this.state.current;
+	}
+	async seek(media) {
+		if (this.#props.disabled) return;
+		await media.seek(media.currentTime + this.#props.seconds);
+	}
+};
+
+//#endregion
+//#region ../core/dist/dev/core/ui/seek-button/seek-button-data-attrs.js
+const SeekButtonDataAttrs = {
+	seeking: "data-seeking",
+	direction: "data-direction"
+};
+
+//#endregion
+//#region src/ui/playback-rate-menu/playback-rate-menu-element.ts
+var PlaybackRateMenuElement = class extends MenuElement {
+	constructor(..._args) {
+		super(..._args);
+		this.label = "";
+		this.disabled = false;
+		this.align = "center";
+		this.formatRate = PlaybackRateMenuCore.defaultProps.formatRate;
+		this.#core = new PlaybackRateMenuCore();
+		this.#mediaState = new PlayerController(this, playerContext, selectPlaybackRate);
+	}
+	static {
+		this.tagName = "media-playback-rate-menu";
+	}
+	static {
+		this.properties = {
+			...MenuElement.properties,
+			label: { type: String },
+			disabled: { type: Boolean }
+		};
+	}
+	#core;
+	#mediaState;
+	connectedCallback() {
+		super.connectedCallback();
+		if (this.destroyed) return;
+		if (!this.#mediaState.value && this.#mediaState.displayName) logMissingFeature(this.localName, this.#mediaState.displayName);
+	}
+	update(changed) {
+		super.update(changed);
+		const media = this.#mediaState.value;
+		if (!media) return;
+		this.#core.setProps(this);
+		this.#core.setMedia(media);
+		const state = this.#core.getState();
+		applyElementProps(this, this.#core.getAttrs(state));
+		applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);
+	}
+};
+
+//#endregion
+//#region src/ui/playback-rate-menu/playback-rate-menu-trigger-element.ts
+var PlaybackRateMenuTriggerElement = class extends MediaElement {
+	constructor(..._args) {
+		super(..._args);
+		this.label = "";
+		this.disabled = false;
+		this.commandfor = void 0;
+		this.formatRate = PlaybackRateMenuCore.defaultProps.formatRate;
+		this.#core = new PlaybackRateMenuCore();
+		this.#mediaState = new PlayerController(this, playerContext, selectPlaybackRate);
+		this.#disconnect = null;
+		this.#handleClick = (event) => {
+			if (this.#mediaState.value && !this.#core.state.current.disabled) return;
+			event.preventDefault();
+			event.stopImmediatePropagation();
+		};
+		this.#handleKeyDown = (event) => {
+			if (event.target !== event.currentTarget) return;
+			if (!this.#mediaState.value || this.#core.state.current.disabled) {
+				if (event.key !== "Tab") event.preventDefault();
+				return;
+			}
+			if (event.key === "Enter" || event.key === " ") {
+				event.preventDefault();
+				this.click();
+			}
+		};
+	}
+	static {
+		this.tagName = "media-playback-rate-menu-trigger";
+	}
+	static {
+		this.properties = {
+			label: { type: String },
+			disabled: { type: Boolean },
+			commandfor: { type: String }
+		};
+	}
+	#core;
+	#mediaState;
+	#disconnect;
+	connectedCallback() {
+		super.connectedCallback();
+		if (this.destroyed) return;
+		this.#disconnect = new AbortController();
+		applyElementProps(this, {
+			onClick: this.#handleClick,
+			onKeyDown: this.#handleKeyDown
+		}, { signal: this.#disconnect.signal });
+		if (!this.#mediaState.value && this.#mediaState.displayName) logMissingFeature(this.localName, this.#mediaState.displayName);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#disconnect?.abort();
+		this.#disconnect = null;
+	}
+	/** Returns the trigger's current label derived from media state. */
+	getLabel() {
+		return this.#core.state.current.label || void 0;
+	}
+	update(changed) {
+		super.update(changed);
+		const media = this.#mediaState.value;
+		if (!media) return;
+		this.#core.setProps(this);
+		this.#core.setMedia(media);
+		const state = this.#core.getState();
+		applyElementProps(this, {
+			role: "button",
+			tabIndex: 0,
+			...this.#core.getAttrs(state)
+		});
+		applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);
+	}
+	#handleClick;
+	#handleKeyDown;
+};
+
+//#endregion
+//#region src/ui/playback-rate-menu/playback-rate-options-element.ts
+var PlaybackRateOptionsElement = class extends MenuRadioGroupElement {
+	constructor(..._args) {
+		super(..._args);
+		this.disabled = false;
+		this.formatRate = PlaybackRateMenuCore.defaultProps.formatRate;
+		this.#core = new PlaybackRateMenuCore();
+		this.#mediaState = new PlayerController(this, playerContext, selectPlaybackRate);
+		this.#ratesKey = "";
+		this.#disconnect = null;
+		this.#handleValueChange = (event) => {
+			if (event.target !== this) return;
+			const media = this.#mediaState.value;
+			if (!media) return;
+			const { value } = event.detail;
+			this.#core.selectValue(media, value);
+		};
+	}
+	static {
+		this.tagName = "media-playback-rate-options";
+	}
+	static {
+		this.properties = {
+			...MenuRadioGroupElement.properties,
+			disabled: { type: Boolean }
+		};
+	}
+	#core;
+	#mediaState;
+	#ratesKey;
+	#disconnect;
+	connectedCallback() {
+		super.connectedCallback();
+		if (this.destroyed) return;
+		this.#disconnect = new AbortController();
+		this.addEventListener("value-change", this.#handleValueChange, { signal: this.#disconnect.signal });
+		if (!this.#mediaState.value && this.#mediaState.displayName) logMissingFeature(this.localName, this.#mediaState.displayName);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#disconnect?.abort();
+		this.#disconnect = null;
+	}
+	update(changed) {
+		const media = this.#mediaState.value;
+		let state = null;
+		if (media) {
+			this.#core.setProps({
+				formatRate: this.formatRate,
+				disabled: this.disabled
+			});
+			this.#core.setMedia(media);
+			state = this.#core.getState();
+			this.value = this.#core.getRateValue(state.rate);
+			this.label = this.label || "Playback rate";
+			this.#syncContent(state);
+		}
+		super.update(changed);
+		if (state) applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);
+	}
+	#syncContent(state) {
+		const template = this.#getTemplate();
+		const templateKey = template?.innerHTML ?? "";
+		const ratesKey = `${state.rates.join("|")}::${templateKey}`;
+		if (ratesKey !== this.#ratesKey) {
+			this.#ratesKey = ratesKey;
+			for (const child of [...this.children]) {
+				if (child instanceof HTMLTemplateElement) continue;
+				child.remove();
+			}
+			this.append(...state.rates.map((rate) => this.#createItem(rate, template)));
+		}
+		for (const item of this.querySelectorAll(MenuRadioItemElement.tagName)) {
+			const checked = item.value === this.value;
+			item.disabled = state.disabled;
+			for (const indicator of item.querySelectorAll(MenuItemIndicatorElement.tagName)) indicator.checked = checked;
+		}
+	}
+	#createItem(rate, template) {
+		const item = this.#createItemFromTemplate(template);
+		const value = this.#core.getRateValue(rate);
+		item.value = value;
+		item.setAttribute("data-rate", value);
+		this.#setLabel(item, this.#core.getRateLabel(rate));
+		return item;
+	}
+	#createItemFromTemplate(template) {
+		if (!template) return document.createElement(MenuRadioItemElement.tagName);
+		const root = template.content.cloneNode(true).firstElementChild;
+		if (!root || root.localName !== MenuRadioItemElement.tagName || root.nextElementSibling) return document.createElement(MenuRadioItemElement.tagName);
+		return root;
+	}
+	#setLabel(item, label) {
+		const labelPart = item.querySelector("[data-part~=\"label\"]");
+		if (labelPart) labelPart.textContent = label;
+		else item.textContent = label;
+	}
+	#getTemplate() {
+		for (const child of this.children) if (child instanceof HTMLTemplateElement) return child;
+		return null;
+	}
+	#handleValueChange;
+};
+
+//#endregion
+//#region src/ui/seek-button/seek-button-element.ts
+var SeekButtonElement = class extends MediaButtonElement {
+	constructor(..._args) {
+		super(..._args);
+		this.seconds = SeekButtonCore.defaultProps.seconds;
+		this.core = new SeekButtonCore();
+		this.stateAttrMap = SeekButtonDataAttrs;
+		this.mediaState = new PlayerController(this, playerContext, selectTime);
+	}
+	static {
+		this.tagName = "media-seek-button";
+	}
+	static {
+		this.properties = {
+			...MediaButtonElement.properties,
+			seconds: { type: Number }
+		};
+	}
+	activate(state) {
+		this.core.seek(state);
+	}
+};
+
+//#endregion
+export { PlaybackRateMenuElement as i, PlaybackRateOptionsElement as n, PlaybackRateMenuTriggerElement as r, SeekButtonElement as t };
+//# sourceMappingURL=seek-button-element-BkC8xrVR.js.map

package/cdn/seek-button-element-BkC8xrVR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-button-element-BkC8xrVR.js","names":["#props","#media","#props","#media","#core","#mediaState","#mediaState","#core","#disconnect","#handleClick","#handleKeyDown","#mediaState","#core","#disconnect","#handleValueChange","#syncContent","#getTemplate","#ratesKey","#createItem","#createItemFromTemplate","#setLabel"],"sources":["../../core/dist/dev/core/ui/playback-rate-menu/playback-rate-menu-core.js","../../core/dist/dev/core/ui/playback-rate-menu/playback-rate-menu-data-attrs.js","../../core/dist/dev/core/ui/seek-button/seek-button-core.js","../../core/dist/dev/core/ui/seek-button/seek-button-data-attrs.js","../src/ui/playback-rate-menu/playback-rate-menu-element.ts","../src/ui/playback-rate-menu/playback-rate-menu-trigger-element.ts","../src/ui/playback-rate-menu/playback-rate-options-element.ts","../src/ui/seek-button/seek-button-element.ts"],"sourcesContent":["import { createState } from \"@videojs/store\";\nimport { defaults } from \"@videojs/utils/object\";\nimport { isFunction, isUndefined } from \"@videojs/utils/predicate\";\n//#region src/core/ui/playback-rate-menu/playback-rate-menu-core.ts\nfunction formatPlaybackRate(rate) {\n\treturn `${rate}×`;\n}\nvar PlaybackRateMenuCore = class PlaybackRateMenuCore {\n\tstatic defaultProps = {\n\t\tlabel: \"\",\n\t\tformatRate: formatPlaybackRate,\n\t\tdisabled: false\n\t};\n\tstate = createState({\n\t\trate: 1,\n\t\trates: [],\n\t\tdisabled: false,\n\t\tlabel: \"\"\n\t});\n\t#props = { ...PlaybackRateMenuCore.defaultProps };\n\t#media = null;\n\tconstructor(props) {\n\t\tif (props) this.setProps(props);\n\t}\n\tsetProps(props) {\n\t\tthis.#props = defaults(props, PlaybackRateMenuCore.defaultProps);\n\t}\n\tgetLabel(state) {\n\t\tconst { label } = this.#props;\n\t\tif (isFunction(label)) {\n\t\t\tconst customLabel = label(state);\n\t\t\tif (customLabel) return customLabel;\n\t\t} else if (label) return label;\n\t\treturn `Playback rate ${state.rate}`;\n\t}\n\tgetRateLabel(rate) {\n\t\treturn this.#props.formatRate(rate);\n\t}\n\tgetRateValue(rate) {\n\t\treturn String(rate);\n\t}\n\tgetAttrs(state) {\n\t\treturn {\n\t\t\t\"aria-label\": this.getLabel(state),\n\t\t\t\"aria-disabled\": state.disabled ? \"true\" : void 0\n\t\t};\n\t}\n\tsetMedia(media) {\n\t\tthis.#media = media;\n\t}\n\tgetState() {\n\t\tconst media = this.#media;\n\t\tthis.state.patch({\n\t\t\trate: media.playbackRate,\n\t\t\trates: media.playbackRates,\n\t\t\tdisabled: this.#props.disabled || media.playbackRates.length === 0\n\t\t});\n\t\tthis.state.patch({ label: this.getLabel(this.state.current) });\n\t\treturn this.state.current;\n\t}\n\tselect(media, rate) {\n\t\tif (this.#props.disabled) return;\n\t\tif (!media.playbackRates.includes(rate)) return;\n\t\tmedia.setPlaybackRate(rate);\n\t}\n\tselectValue(media, value) {\n\t\tconst rate = media.playbackRates.find((candidate) => this.getRateValue(candidate) === value);\n\t\tif (isUndefined(rate)) return;\n\t\tthis.select(media, rate);\n\t}\n};\n//#endregion\nexport { PlaybackRateMenuCore };\n\n//# sourceMappingURL=playback-rate-menu-core.js.map","//#region src/core/ui/playback-rate-menu/playback-rate-menu-data-attrs.ts\nconst PlaybackRateMenuDataAttrs = {\n\trate: \"data-rate\",\n\tdisabled: \"data-disabled\"\n};\n//#endregion\nexport { PlaybackRateMenuDataAttrs };\n\n//# sourceMappingURL=playback-rate-menu-data-attrs.js.map","import { createState } from \"@videojs/store\";\nimport { defaults } from \"@videojs/utils/object\";\nimport { isFunction } from \"@videojs/utils/predicate\";\n//#region src/core/ui/seek-button/seek-button-core.ts\nvar SeekButtonCore = class SeekButtonCore {\n\tstatic defaultProps = {\n\t\tseconds: 30,\n\t\tlabel: \"\",\n\t\tdisabled: false\n\t};\n\tstate = createState({\n\t\tseeking: false,\n\t\tdirection: \"forward\",\n\t\tlabel: \"\"\n\t});\n\t#props = { ...SeekButtonCore.defaultProps };\n\t#media = null;\n\tconstructor(props) {\n\t\tif (props) this.setProps(props);\n\t}\n\tsetProps(props) {\n\t\tthis.#props = defaults(props, SeekButtonCore.defaultProps);\n\t}\n\tgetLabel(state) {\n\t\tconst { label } = this.#props;\n\t\tif (isFunction(label)) {\n\t\t\tconst customLabel = label(state);\n\t\t\tif (customLabel) return customLabel;\n\t\t} else if (label) return label;\n\t\tconst abs = Math.abs(this.#props.seconds);\n\t\treturn state.direction === \"backward\" ? `Seek backward ${abs} seconds` : `Seek forward ${abs} seconds`;\n\t}\n\tgetAttrs(state) {\n\t\treturn {\n\t\t\t\"aria-label\": this.getLabel(state),\n\t\t\t\"aria-disabled\": this.#props.disabled ? \"true\" : void 0\n\t\t};\n\t}\n\tsetMedia(media) {\n\t\tthis.#media = media;\n\t}\n\tgetState() {\n\t\tconst media = this.#media;\n\t\tconst direction = this.#props.seconds < 0 ? \"backward\" : \"forward\";\n\t\tthis.state.patch({\n\t\t\tseeking: media.seeking,\n\t\t\tdirection\n\t\t});\n\t\tthis.state.patch({ label: this.getLabel(this.state.current) });\n\t\treturn this.state.current;\n\t}\n\tasync seek(media) {\n\t\tif (this.#props.disabled) return;\n\t\tawait media.seek(media.currentTime + this.#props.seconds);\n\t}\n};\n//#endregion\nexport { SeekButtonCore };\n\n//# sourceMappingURL=seek-button-core.js.map","//#region src/core/ui/seek-button/seek-button-data-attrs.ts\nconst SeekButtonDataAttrs = {\n\tseeking: \"data-seeking\",\n\tdirection: \"data-direction\"\n};\n//#endregion\nexport { SeekButtonDataAttrs };\n\n//# sourceMappingURL=seek-button-data-attrs.js.map","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuElement } from '../menu/menu-element';\n\nexport class PlaybackRateMenuElement extends MenuElement {\n  static override readonly tagName = 'media-playback-rate-menu';\n\n  static override properties = {\n    ...MenuElement.properties,\n    label: { type: String },\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<\n    | 'open'\n    | 'defaultOpen'\n    | 'side'\n    | 'align'\n    | 'closeOnEscape'\n    | 'closeOnOutsideClick'\n    | 'boundary'\n    | 'label'\n    | 'disabled'\n  >;\n\n  label = '';\n  disabled = false;\n  override align: MenuElement['align'] = 'center';\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !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    const media = this.#mediaState.value;\n    if (!media) return;\n\n    this.#core.setProps(this);\n    this.#core.setMedia(media);\n    const state = this.#core.getState();\n\n    applyElementProps(this, this.#core.getAttrs(state));\n    applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n}\n\nexport namespace PlaybackRateMenuElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class PlaybackRateMenuTriggerElement extends MediaElement {\n  static readonly tagName = 'media-playback-rate-menu-trigger';\n\n  static override properties = {\n    label: { type: String },\n    disabled: { type: Boolean },\n    commandfor: { type: String },\n  } satisfies PropertyDeclarationMap<'label' | 'disabled' | 'commandfor'>;\n\n  label = '';\n  disabled = false;\n  commandfor: string | undefined = undefined;\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    this.#disconnect = new AbortController();\n    applyElementProps(\n      this,\n      {\n        onClick: this.#handleClick,\n        onKeyDown: this.#handleKeyDown,\n      },\n      { signal: this.#disconnect.signal }\n    );\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  /** Returns the trigger's current label derived from media state. */\n  getLabel(): string | undefined {\n    return this.#core.state.current.label || undefined;\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    const media = this.#mediaState.value;\n    if (!media) return;\n\n    this.#core.setProps(this);\n    this.#core.setMedia(media);\n    const state = this.#core.getState();\n\n    applyElementProps(this, {\n      role: 'button',\n      tabIndex: 0,\n      ...this.#core.getAttrs(state),\n    });\n    applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n\n  #handleClick = (event: MouseEvent): void => {\n    if (this.#mediaState.value && !this.#core.state.current.disabled) return;\n\n    event.preventDefault();\n    event.stopImmediatePropagation();\n  };\n\n  #handleKeyDown = (event: KeyboardEvent): void => {\n    if (event.target !== event.currentTarget) return;\n\n    if (!this.#mediaState.value || this.#core.state.current.disabled) {\n      if (event.key !== 'Tab') event.preventDefault();\n      return;\n    }\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.click();\n    }\n  };\n}\n\nexport namespace PlaybackRateMenuTriggerElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuItemIndicatorElement } from '../menu/menu-item-indicator-element';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { MenuRadioItemElement } from '../menu/menu-radio-item-element';\n\nexport class PlaybackRateOptionsElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-playback-rate-options';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  #ratesKey = '';\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    this.#disconnect = new AbortController();\n    this.addEventListener('value-change', this.#handleValueChange, { signal: this.#disconnect.signal });\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: PlaybackRateMenuCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatRate: this.formatRate, disabled: this.disabled });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.value = this.#core.getRateValue(state.rate);\n      this.label = this.label || 'Playback rate';\n      this.#syncContent(state);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n\n  #syncContent(state: PlaybackRateMenuCore.State): void {\n    const template = this.#getTemplate();\n    const templateKey = template?.innerHTML ?? '';\n    const ratesKey = `${state.rates.join('|')}::${templateKey}`;\n\n    if (ratesKey !== this.#ratesKey) {\n      this.#ratesKey = ratesKey;\n\n      for (const child of [...this.children]) {\n        if (child instanceof HTMLTemplateElement) continue;\n        child.remove();\n      }\n\n      this.append(...state.rates.map((rate) => this.#createItem(rate, template)));\n    }\n\n    for (const item of this.querySelectorAll<MenuRadioItemElement>(MenuRadioItemElement.tagName)) {\n      const checked = item.value === this.value;\n\n      item.disabled = state.disabled;\n\n      for (const indicator of item.querySelectorAll<MenuItemIndicatorElement>(MenuItemIndicatorElement.tagName)) {\n        indicator.checked = checked;\n      }\n    }\n  }\n\n  #createItem(rate: number, template: HTMLTemplateElement | null): MenuRadioItemElement {\n    const item = this.#createItemFromTemplate(template);\n    const value = this.#core.getRateValue(rate);\n\n    item.value = value;\n    item.setAttribute('data-rate', value);\n    this.#setLabel(item, this.#core.getRateLabel(rate));\n\n    return item;\n  }\n\n  #createItemFromTemplate(template: HTMLTemplateElement | null): MenuRadioItemElement {\n    if (!template) return document.createElement(MenuRadioItemElement.tagName) as MenuRadioItemElement;\n\n    const fragment = template.content.cloneNode(true) as DocumentFragment;\n    const root = fragment.firstElementChild;\n\n    if (!root || root.localName !== MenuRadioItemElement.tagName || root.nextElementSibling) {\n      return document.createElement(MenuRadioItemElement.tagName) as MenuRadioItemElement;\n    }\n\n    return root as MenuRadioItemElement;\n  }\n\n  #setLabel(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  #getTemplate(): HTMLTemplateElement | null {\n    for (const child of this.children) {\n      if (child instanceof HTMLTemplateElement) return child;\n    }\n\n    return null;\n  }\n\n  #handleValueChange = (event: Event): void => {\n    if (event.target !== this) return;\n\n    const media = this.#mediaState.value;\n    if (!media) return;\n\n    const { value } = (event as CustomEvent<{ value: string }>).detail;\n    this.#core.selectValue(media, value);\n  };\n}\n\nexport namespace PlaybackRateOptionsElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { type MediaTimeState, SeekButtonCore, SeekButtonDataAttrs } from '@videojs/core';\nimport { selectTime } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaButtonElement } from '../media-button-element';\n\nexport class SeekButtonElement extends MediaButtonElement<SeekButtonCore> {\n  static readonly tagName = 'media-seek-button';\n\n  static override properties: PropertyDeclarationMap = {\n    ...MediaButtonElement.properties,\n    seconds: { type: Number },\n  };\n\n  seconds = SeekButtonCore.defaultProps.seconds;\n\n  protected readonly core = new SeekButtonCore();\n  protected readonly stateAttrMap = SeekButtonDataAttrs;\n  protected readonly mediaState = new PlayerController(this, playerContext, selectTime);\n\n  protected activate(state: MediaTimeState): void {\n    this.core.seek(state);\n  }\n}\n"],"mappings":"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"}

package/cdn/seek-button-element-C0uAXebE.js

@@ -0,0 +1,2 @@
+import{A as e,D as t,M as n,_ as r,d as i,f as a,m as o,p as s,v as c,y as l}from"./compounds-CJ9NGNJr.js";import{E as u,j as d,n as f}from"./create-player-B2W5yr5I.js";import{l as p,o as m,t as h}from"./predicate-Dxl3IuYh.js";function g(e){return`${e}×`}var _=class e{static defaultProps={label:``,formatRate:g,disabled:!1};state=u({rate:1,rates:[],disabled:!1,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=n(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(h(t)){let n=t(e);if(n)return n}else if(t)return t;return`Playback rate ${e.rate}`}getRateLabel(e){return this.#e.formatRate(e)}getRateValue(e){return String(e)}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t;return this.state.patch({rate:e.playbackRate,rates:e.playbackRates,disabled:this.#e.disabled||e.playbackRates.length===0}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}select(e,t){this.#e.disabled||e.playbackRates.includes(t)&&e.setPlaybackRate(t)}selectValue(e,t){let n=e.playbackRates.find(e=>this.getRateValue(e)===t);m(n)||this.select(e,n)}};const v={rate:`data-rate`,disabled:`data-disabled`};var y=class e{static defaultProps={seconds:30,label:``,disabled:!1};state=u({seeking:!1,direction:`forward`,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=n(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(h(t)){let n=t(e);if(n)return n}else if(t)return t;let n=Math.abs(this.#e.seconds);return e.direction===`backward`?`Seek backward ${n} seconds`:`Seek forward ${n} seconds`}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":this.#e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t,t=this.#e.seconds<0?`backward`:`forward`;return this.state.patch({seeking:e.seeking,direction:t}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}async seek(e){this.#e.disabled||await e.seek(e.currentTime+this.#e.seconds)}};const b={seeking:`data-seeking`,direction:`data-direction`};var x=class extends o{constructor(...e){super(...e),this.label=``,this.disabled=!1,this.align=`center`,this.formatRate=_.defaultProps.formatRate,this.#e=new _,this.#t=new f(this,p,t)}static{this.tagName=`media-playback-rate-menu`}static{this.properties={...o.properties,label:{type:String},disabled:{type:Boolean}}}#e;#t;connectedCallback(){super.connectedCallback(),this.destroyed}update(e){super.update(e);let t=this.#t.value;if(!t)return;this.#e.setProps(this),this.#e.setMedia(t);let n=this.#e.getState();l(this,this.#e.getAttrs(n)),c(this,n,v)}},S=class extends d{constructor(...e){super(...e),this.label=``,this.disabled=!1,this.commandfor=void 0,this.formatRate=_.defaultProps.formatRate,this.#e=new _,this.#t=new f(this,p,t),this.#n=null,this.#r=e=>{this.#t.value&&!this.#e.state.current.disabled||(e.preventDefault(),e.stopImmediatePropagation())},this.#i=e=>{if(e.target===e.currentTarget){if(!this.#t.value||this.#e.state.current.disabled){e.key!==`Tab`&&e.preventDefault();return}(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),this.click())}}}static{this.tagName=`media-playback-rate-menu-trigger`}static{this.properties={label:{type:String},disabled:{type:Boolean},commandfor:{type:String}}}#e;#t;#n;connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#n=new AbortController,l(this,{onClick:this.#r,onKeyDown:this.#i},{signal:this.#n.signal}))}disconnectedCallback(){super.disconnectedCallback(),this.#n?.abort(),this.#n=null}getLabel(){return this.#e.state.current.label||void 0}update(e){super.update(e);let t=this.#t.value;if(!t)return;this.#e.setProps(this),this.#e.setMedia(t);let n=this.#e.getState();l(this,{role:`button`,tabIndex:0,...this.#e.getAttrs(n)}),c(this,n,v)}#r;#i},C=class extends a{constructor(...e){super(...e),this.disabled=!1,this.formatRate=_.defaultProps.formatRate,this.#e=new _,this.#t=new f(this,p,t),this.#n=``,this.#r=null,this.#l=e=>{if(e.target!==this)return;let t=this.#t.value;if(!t)return;let{value:n}=e.detail;this.#e.selectValue(t,n)}}static{this.tagName=`media-playback-rate-options`}static{this.properties={...a.properties,disabled:{type:Boolean}}}#e;#t;#n;#r;connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#r=new AbortController,this.addEventListener(`value-change`,this.#l,{signal:this.#r.signal}))}disconnectedCallback(){super.disconnectedCallback(),this.#r?.abort(),this.#r=null}update(e){let t=this.#t.value,n=null;t&&(this.#e.setProps({formatRate:this.formatRate,disabled:this.disabled}),this.#e.setMedia(t),n=this.#e.getState(),this.value=this.#e.getRateValue(n.rate),this.label=this.label||`Playback rate`,this.#i(n)),super.update(e),n&&c(this,n,v)}#i(e){let t=this.#c(),n=t?.innerHTML??``,r=`${e.rates.join(`|`)}::${n}`;if(r!==this.#n){this.#n=r;for(let e of[...this.children])e instanceof HTMLTemplateElement||e.remove();this.append(...e.rates.map(e=>this.#a(e,t)))}for(let t of this.querySelectorAll(i.tagName)){let n=t.value===this.value;t.disabled=e.disabled;for(let e of t.querySelectorAll(s.tagName))e.checked=n}}#a(e,t){let n=this.#o(t),r=this.#e.getRateValue(e);return n.value=r,n.setAttribute(`data-rate`,r),this.#s(n,this.#e.getRateLabel(e)),n}#o(e){if(!e)return document.createElement(i.tagName);let t=e.content.cloneNode(!0).firstElementChild;return!t||t.localName!==i.tagName||t.nextElementSibling?document.createElement(i.tagName):t}#s(e,t){let n=e.querySelector(`[data-part~="label"]`);n?n.textContent=t:e.textContent=t}#c(){for(let e of this.children)if(e instanceof HTMLTemplateElement)return e;return null}#l},w=class extends r{constructor(...t){super(...t),this.seconds=y.defaultProps.seconds,this.core=new y,this.stateAttrMap=b,this.mediaState=new f(this,p,e)}static{this.tagName=`media-seek-button`}static{this.properties={...r.properties,seconds:{type:Number}}}activate(e){this.core.seek(e)}};export{x as i,C as n,S as r,w as t};
+//# sourceMappingURL=seek-button-element-C0uAXebE.js.map

package/cdn/seek-button-element-C0uAXebE.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-button-element-C0uAXebE.js","names":["#props","#media","#props","#media","#core","#mediaState","#mediaState","#core","#disconnect","#handleClick","#handleKeyDown","#mediaState","#core","#disconnect","#handleValueChange","#syncContent","#getTemplate","#ratesKey","#createItem","#createItemFromTemplate","#setLabel"],"sources":["../../core/dist/default/core/ui/playback-rate-menu/playback-rate-menu-core.js","../../core/dist/default/core/ui/playback-rate-menu/playback-rate-menu-data-attrs.js","../../core/dist/default/core/ui/seek-button/seek-button-core.js","../../core/dist/default/core/ui/seek-button/seek-button-data-attrs.js","../src/ui/playback-rate-menu/playback-rate-menu-element.ts","../src/ui/playback-rate-menu/playback-rate-menu-trigger-element.ts","../src/ui/playback-rate-menu/playback-rate-options-element.ts","../src/ui/seek-button/seek-button-element.ts"],"sourcesContent":["import { createState } from \"@videojs/store\";\nimport { defaults } from \"@videojs/utils/object\";\nimport { isFunction, isUndefined } from \"@videojs/utils/predicate\";\n//#region src/core/ui/playback-rate-menu/playback-rate-menu-core.ts\nfunction formatPlaybackRate(rate) {\n\treturn `${rate}×`;\n}\nvar PlaybackRateMenuCore = class PlaybackRateMenuCore {\n\tstatic defaultProps = {\n\t\tlabel: \"\",\n\t\tformatRate: formatPlaybackRate,\n\t\tdisabled: false\n\t};\n\tstate = createState({\n\t\trate: 1,\n\t\trates: [],\n\t\tdisabled: false,\n\t\tlabel: \"\"\n\t});\n\t#props = { ...PlaybackRateMenuCore.defaultProps };\n\t#media = null;\n\tconstructor(props) {\n\t\tif (props) this.setProps(props);\n\t}\n\tsetProps(props) {\n\t\tthis.#props = defaults(props, PlaybackRateMenuCore.defaultProps);\n\t}\n\tgetLabel(state) {\n\t\tconst { label } = this.#props;\n\t\tif (isFunction(label)) {\n\t\t\tconst customLabel = label(state);\n\t\t\tif (customLabel) return customLabel;\n\t\t} else if (label) return label;\n\t\treturn `Playback rate ${state.rate}`;\n\t}\n\tgetRateLabel(rate) {\n\t\treturn this.#props.formatRate(rate);\n\t}\n\tgetRateValue(rate) {\n\t\treturn String(rate);\n\t}\n\tgetAttrs(state) {\n\t\treturn {\n\t\t\t\"aria-label\": this.getLabel(state),\n\t\t\t\"aria-disabled\": state.disabled ? \"true\" : void 0\n\t\t};\n\t}\n\tsetMedia(media) {\n\t\tthis.#media = media;\n\t}\n\tgetState() {\n\t\tconst media = this.#media;\n\t\tthis.state.patch({\n\t\t\trate: media.playbackRate,\n\t\t\trates: media.playbackRates,\n\t\t\tdisabled: this.#props.disabled || media.playbackRates.length === 0\n\t\t});\n\t\tthis.state.patch({ label: this.getLabel(this.state.current) });\n\t\treturn this.state.current;\n\t}\n\tselect(media, rate) {\n\t\tif (this.#props.disabled) return;\n\t\tif (!media.playbackRates.includes(rate)) return;\n\t\tmedia.setPlaybackRate(rate);\n\t}\n\tselectValue(media, value) {\n\t\tconst rate = media.playbackRates.find((candidate) => this.getRateValue(candidate) === value);\n\t\tif (isUndefined(rate)) return;\n\t\tthis.select(media, rate);\n\t}\n};\n//#endregion\nexport { PlaybackRateMenuCore };\n\n//# sourceMappingURL=playback-rate-menu-core.js.map","//#region src/core/ui/playback-rate-menu/playback-rate-menu-data-attrs.ts\nconst PlaybackRateMenuDataAttrs = {\n\trate: \"data-rate\",\n\tdisabled: \"data-disabled\"\n};\n//#endregion\nexport { PlaybackRateMenuDataAttrs };\n\n//# sourceMappingURL=playback-rate-menu-data-attrs.js.map","import { createState } from \"@videojs/store\";\nimport { defaults } from \"@videojs/utils/object\";\nimport { isFunction } from \"@videojs/utils/predicate\";\n//#region src/core/ui/seek-button/seek-button-core.ts\nvar SeekButtonCore = class SeekButtonCore {\n\tstatic defaultProps = {\n\t\tseconds: 30,\n\t\tlabel: \"\",\n\t\tdisabled: false\n\t};\n\tstate = createState({\n\t\tseeking: false,\n\t\tdirection: \"forward\",\n\t\tlabel: \"\"\n\t});\n\t#props = { ...SeekButtonCore.defaultProps };\n\t#media = null;\n\tconstructor(props) {\n\t\tif (props) this.setProps(props);\n\t}\n\tsetProps(props) {\n\t\tthis.#props = defaults(props, SeekButtonCore.defaultProps);\n\t}\n\tgetLabel(state) {\n\t\tconst { label } = this.#props;\n\t\tif (isFunction(label)) {\n\t\t\tconst customLabel = label(state);\n\t\t\tif (customLabel) return customLabel;\n\t\t} else if (label) return label;\n\t\tconst abs = Math.abs(this.#props.seconds);\n\t\treturn state.direction === \"backward\" ? `Seek backward ${abs} seconds` : `Seek forward ${abs} seconds`;\n\t}\n\tgetAttrs(state) {\n\t\treturn {\n\t\t\t\"aria-label\": this.getLabel(state),\n\t\t\t\"aria-disabled\": this.#props.disabled ? \"true\" : void 0\n\t\t};\n\t}\n\tsetMedia(media) {\n\t\tthis.#media = media;\n\t}\n\tgetState() {\n\t\tconst media = this.#media;\n\t\tconst direction = this.#props.seconds < 0 ? \"backward\" : \"forward\";\n\t\tthis.state.patch({\n\t\t\tseeking: media.seeking,\n\t\t\tdirection\n\t\t});\n\t\tthis.state.patch({ label: this.getLabel(this.state.current) });\n\t\treturn this.state.current;\n\t}\n\tasync seek(media) {\n\t\tif (this.#props.disabled) return;\n\t\tawait media.seek(media.currentTime + this.#props.seconds);\n\t}\n};\n//#endregion\nexport { SeekButtonCore };\n\n//# sourceMappingURL=seek-button-core.js.map","//#region src/core/ui/seek-button/seek-button-data-attrs.ts\nconst SeekButtonDataAttrs = {\n\tseeking: \"data-seeking\",\n\tdirection: \"data-direction\"\n};\n//#endregion\nexport { SeekButtonDataAttrs };\n\n//# sourceMappingURL=seek-button-data-attrs.js.map","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuElement } from '../menu/menu-element';\n\nexport class PlaybackRateMenuElement extends MenuElement {\n  static override readonly tagName = 'media-playback-rate-menu';\n\n  static override properties = {\n    ...MenuElement.properties,\n    label: { type: String },\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<\n    | 'open'\n    | 'defaultOpen'\n    | 'side'\n    | 'align'\n    | 'closeOnEscape'\n    | 'closeOnOutsideClick'\n    | 'boundary'\n    | 'label'\n    | 'disabled'\n  >;\n\n  label = '';\n  disabled = false;\n  override align: MenuElement['align'] = 'center';\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !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    const media = this.#mediaState.value;\n    if (!media) return;\n\n    this.#core.setProps(this);\n    this.#core.setMedia(media);\n    const state = this.#core.getState();\n\n    applyElementProps(this, this.#core.getAttrs(state));\n    applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n}\n\nexport namespace PlaybackRateMenuElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyElementProps, applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class PlaybackRateMenuTriggerElement extends MediaElement {\n  static readonly tagName = 'media-playback-rate-menu-trigger';\n\n  static override properties = {\n    label: { type: String },\n    disabled: { type: Boolean },\n    commandfor: { type: String },\n  } satisfies PropertyDeclarationMap<'label' | 'disabled' | 'commandfor'>;\n\n  label = '';\n  disabled = false;\n  commandfor: string | undefined = undefined;\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    this.#disconnect = new AbortController();\n    applyElementProps(\n      this,\n      {\n        onClick: this.#handleClick,\n        onKeyDown: this.#handleKeyDown,\n      },\n      { signal: this.#disconnect.signal }\n    );\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  /** Returns the trigger's current label derived from media state. */\n  getLabel(): string | undefined {\n    return this.#core.state.current.label || undefined;\n  }\n\n  protected override update(changed: PropertyValues): void {\n    super.update(changed);\n\n    const media = this.#mediaState.value;\n    if (!media) return;\n\n    this.#core.setProps(this);\n    this.#core.setMedia(media);\n    const state = this.#core.getState();\n\n    applyElementProps(this, {\n      role: 'button',\n      tabIndex: 0,\n      ...this.#core.getAttrs(state),\n    });\n    applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n\n  #handleClick = (event: MouseEvent): void => {\n    if (this.#mediaState.value && !this.#core.state.current.disabled) return;\n\n    event.preventDefault();\n    event.stopImmediatePropagation();\n  };\n\n  #handleKeyDown = (event: KeyboardEvent): void => {\n    if (event.target !== event.currentTarget) return;\n\n    if (!this.#mediaState.value || this.#core.state.current.disabled) {\n      if (event.key !== 'Tab') event.preventDefault();\n      return;\n    }\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.click();\n    }\n  };\n}\n\nexport namespace PlaybackRateMenuTriggerElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { PlaybackRateMenuCore, PlaybackRateMenuDataAttrs } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuItemIndicatorElement } from '../menu/menu-item-indicator-element';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { MenuRadioItemElement } from '../menu/menu-radio-item-element';\n\nexport class PlaybackRateOptionsElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-playback-rate-options';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  formatRate = PlaybackRateMenuCore.defaultProps.formatRate;\n\n  readonly #core = new PlaybackRateMenuCore();\n  readonly #mediaState = new PlayerController(this, playerContext, selectPlaybackRate);\n\n  #ratesKey = '';\n  #disconnect: AbortController | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    this.#disconnect = new AbortController();\n    this.addEventListener('value-change', this.#handleValueChange, { signal: this.#disconnect.signal });\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: PlaybackRateMenuCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatRate: this.formatRate, disabled: this.disabled });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.value = this.#core.getRateValue(state.rate);\n      this.label = this.label || 'Playback rate';\n      this.#syncContent(state);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, PlaybackRateMenuDataAttrs);\n  }\n\n  #syncContent(state: PlaybackRateMenuCore.State): void {\n    const template = this.#getTemplate();\n    const templateKey = template?.innerHTML ?? '';\n    const ratesKey = `${state.rates.join('|')}::${templateKey}`;\n\n    if (ratesKey !== this.#ratesKey) {\n      this.#ratesKey = ratesKey;\n\n      for (const child of [...this.children]) {\n        if (child instanceof HTMLTemplateElement) continue;\n        child.remove();\n      }\n\n      this.append(...state.rates.map((rate) => this.#createItem(rate, template)));\n    }\n\n    for (const item of this.querySelectorAll<MenuRadioItemElement>(MenuRadioItemElement.tagName)) {\n      const checked = item.value === this.value;\n\n      item.disabled = state.disabled;\n\n      for (const indicator of item.querySelectorAll<MenuItemIndicatorElement>(MenuItemIndicatorElement.tagName)) {\n        indicator.checked = checked;\n      }\n    }\n  }\n\n  #createItem(rate: number, template: HTMLTemplateElement | null): MenuRadioItemElement {\n    const item = this.#createItemFromTemplate(template);\n    const value = this.#core.getRateValue(rate);\n\n    item.value = value;\n    item.setAttribute('data-rate', value);\n    this.#setLabel(item, this.#core.getRateLabel(rate));\n\n    return item;\n  }\n\n  #createItemFromTemplate(template: HTMLTemplateElement | null): MenuRadioItemElement {\n    if (!template) return document.createElement(MenuRadioItemElement.tagName) as MenuRadioItemElement;\n\n    const fragment = template.content.cloneNode(true) as DocumentFragment;\n    const root = fragment.firstElementChild;\n\n    if (!root || root.localName !== MenuRadioItemElement.tagName || root.nextElementSibling) {\n      return document.createElement(MenuRadioItemElement.tagName) as MenuRadioItemElement;\n    }\n\n    return root as MenuRadioItemElement;\n  }\n\n  #setLabel(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  #getTemplate(): HTMLTemplateElement | null {\n    for (const child of this.children) {\n      if (child instanceof HTMLTemplateElement) return child;\n    }\n\n    return null;\n  }\n\n  #handleValueChange = (event: Event): void => {\n    if (event.target !== this) return;\n\n    const media = this.#mediaState.value;\n    if (!media) return;\n\n    const { value } = (event as CustomEvent<{ value: string }>).detail;\n    this.#core.selectValue(media, value);\n  };\n}\n\nexport namespace PlaybackRateOptionsElement {\n  export type State = PlaybackRateMenuCore.State;\n}\n","import { type MediaTimeState, SeekButtonCore, SeekButtonDataAttrs } from '@videojs/core';\nimport { selectTime } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaButtonElement } from '../media-button-element';\n\nexport class SeekButtonElement extends MediaButtonElement<SeekButtonCore> {\n  static readonly tagName = 'media-seek-button';\n\n  static override properties: PropertyDeclarationMap = {\n    ...MediaButtonElement.properties,\n    seconds: { type: Number },\n  };\n\n  seconds = SeekButtonCore.defaultProps.seconds;\n\n  protected readonly core = new SeekButtonCore();\n  protected readonly stateAttrMap = SeekButtonDataAttrs;\n  protected readonly mediaState = new PlayerController(this, playerContext, selectTime);\n\n  protected activate(state: MediaTimeState): void {\n    this.core.seek(state);\n  }\n}\n"],"mappings":"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"}

package/cdn/{shallow-equal-xh6Wj-hj.js → shallow-equal-D-fthE54.js}

@@ -1,2 +1,2 @@
 const e=Object.prototype.hasOwnProperty;function t(t,n){if(Object.is(t,n))return!0;if(typeof t!=`object`||!t||typeof n!=`object`||!n)return!1;let r=Object.keys(t),i=Object.keys(n);if(r.length!==i.length)return!1;for(let i of r)if(!e.call(n,i)||!Object.is(t[i],n[i]))return!1;return!0}export{t};
-//# sourceMappingURL=shallow-equal-xh6Wj-hj.js.map
+//# sourceMappingURL=shallow-equal-D-fthE54.js.map

package/cdn/{shallow-equal-xh6Wj-hj.js.map → shallow-equal-D-fthE54.js.map}

@@ -1 +1 @@
-{"version":3,"file":"shallow-equal-xh6Wj-hj.js","names":[],"sources":["../../utils/dist/object/shallow-equal.js"],"sourcesContent":["//#region src/object/shallow-equal.ts\nconst hasOwn = Object.prototype.hasOwnProperty;\nfunction shallowEqual(a, b) {\n\tif (Object.is(a, b)) return true;\n\tif (typeof a !== \"object\" || a === null || typeof b !== \"object\" || b === null) return false;\n\tconst keysA = Object.keys(a);\n\tconst keysB = Object.keys(b);\n\tif (keysA.length !== keysB.length) return false;\n\tfor (const key of keysA) if (!hasOwn.call(b, key) || !Object.is(a[key], b[key])) return false;\n\treturn true;\n}\n//#endregion\nexport { shallowEqual };\n\n//# sourceMappingURL=shallow-equal.js.map"],"mappings":"AACA,MAAM,EAAS,OAAO,UAAU,eAChC,SAAS,EAAa,EAAG,EAAG,CAC3B,GAAI,OAAO,GAAG,EAAG,EAAE,CAAE,MAAO,GAC5B,GAAI,OAAO,GAAM,WAAY,GAAc,OAAO,GAAM,WAAY,EAAY,MAAO,GACvF,IAAM,EAAQ,OAAO,KAAK,EAAE,CACtB,EAAQ,OAAO,KAAK,EAAE,CAC5B,GAAI,EAAM,SAAW,EAAM,OAAQ,MAAO,GAC1C,IAAK,IAAM,KAAO,EAAO,GAAI,CAAC,EAAO,KAAK,EAAG,EAAI,EAAI,CAAC,OAAO,GAAG,EAAE,GAAM,EAAE,GAAK,CAAE,MAAO,GACxF,MAAO"}
+{"version":3,"file":"shallow-equal-D-fthE54.js","names":[],"sources":["../../utils/dist/object/shallow-equal.js"],"sourcesContent":["//#region src/object/shallow-equal.ts\nconst hasOwn = Object.prototype.hasOwnProperty;\nfunction shallowEqual(a, b) {\n\tif (Object.is(a, b)) return true;\n\tif (typeof a !== \"object\" || a === null || typeof b !== \"object\" || b === null) return false;\n\tconst keysA = Object.keys(a);\n\tconst keysB = Object.keys(b);\n\tif (keysA.length !== keysB.length) return false;\n\tfor (const key of keysA) if (!hasOwn.call(b, key) || !Object.is(a[key], b[key])) return false;\n\treturn true;\n}\n//#endregion\nexport { shallowEqual };\n\n//# sourceMappingURL=shallow-equal.js.map"],"mappings":"AACA,MAAM,EAAS,OAAO,UAAU,eAChC,SAAS,EAAa,EAAG,EAAG,CAC3B,GAAI,OAAO,GAAG,EAAG,EAAE,CAAE,MAAO,GAC5B,GAAI,OAAO,GAAM,WAAY,GAAc,OAAO,GAAM,WAAY,EAAY,MAAO,GACvF,IAAM,EAAQ,OAAO,KAAK,EAAE,CACtB,EAAQ,OAAO,KAAK,EAAE,CAC5B,GAAI,EAAM,SAAW,EAAM,OAAQ,MAAO,GAC1C,IAAK,IAAM,KAAO,EAAO,GAAI,CAAC,EAAO,KAAK,EAAG,EAAI,EAAI,CAAC,OAAO,GAAG,EAAE,GAAM,EAAE,GAAK,CAAE,MAAO,GACxF,MAAO"}

package/cdn/{shallow-equal-Daj3-_LC.js → shallow-equal-DSpD9PMp.js}

@@ -12,4 +12,4 @@ function shallowEqual(a, b) {
 
 //#endregion
 export { shallowEqual as t };
-//# sourceMappingURL=shallow-equal-Daj3-_LC.js.map
+//# sourceMappingURL=shallow-equal-DSpD9PMp.js.map

package/cdn/{shallow-equal-Daj3-_LC.js.map → shallow-equal-DSpD9PMp.js.map}

@@ -1 +1 @@
-{"version":3,"file":"shallow-equal-Daj3-_LC.js","names":[],"sources":["../../utils/dist/object/shallow-equal.js"],"sourcesContent":["//#region src/object/shallow-equal.ts\nconst hasOwn = Object.prototype.hasOwnProperty;\nfunction shallowEqual(a, b) {\n\tif (Object.is(a, b)) return true;\n\tif (typeof a !== \"object\" || a === null || typeof b !== \"object\" || b === null) return false;\n\tconst keysA = Object.keys(a);\n\tconst keysB = Object.keys(b);\n\tif (keysA.length !== keysB.length) return false;\n\tfor (const key of keysA) if (!hasOwn.call(b, key) || !Object.is(a[key], b[key])) return false;\n\treturn true;\n}\n//#endregion\nexport { shallowEqual };\n\n//# sourceMappingURL=shallow-equal.js.map"],"mappings":";AACA,MAAM,SAAS,OAAO,UAAU;AAChC,SAAS,aAAa,GAAG,GAAG;AAC3B,KAAI,OAAO,GAAG,GAAG,EAAE,CAAE,QAAO;AAC5B,KAAI,OAAO,MAAM,YAAY,MAAM,QAAQ,OAAO,MAAM,YAAY,MAAM,KAAM,QAAO;CACvF,MAAM,QAAQ,OAAO,KAAK,EAAE;CAC5B,MAAM,QAAQ,OAAO,KAAK,EAAE;AAC5B,KAAI,MAAM,WAAW,MAAM,OAAQ,QAAO;AAC1C,MAAK,MAAM,OAAO,MAAO,KAAI,CAAC,OAAO,KAAK,GAAG,IAAI,IAAI,CAAC,OAAO,GAAG,EAAE,MAAM,EAAE,KAAK,CAAE,QAAO;AACxF,QAAO"}
+{"version":3,"file":"shallow-equal-DSpD9PMp.js","names":[],"sources":["../../utils/dist/object/shallow-equal.js"],"sourcesContent":["//#region src/object/shallow-equal.ts\nconst hasOwn = Object.prototype.hasOwnProperty;\nfunction shallowEqual(a, b) {\n\tif (Object.is(a, b)) return true;\n\tif (typeof a !== \"object\" || a === null || typeof b !== \"object\" || b === null) return false;\n\tconst keysA = Object.keys(a);\n\tconst keysB = Object.keys(b);\n\tif (keysA.length !== keysB.length) return false;\n\tfor (const key of keysA) if (!hasOwn.call(b, key) || !Object.is(a[key], b[key])) return false;\n\treturn true;\n}\n//#endregion\nexport { shallowEqual };\n\n//# sourceMappingURL=shallow-equal.js.map"],"mappings":";AACA,MAAM,SAAS,OAAO,UAAU;AAChC,SAAS,aAAa,GAAG,GAAG;AAC3B,KAAI,OAAO,GAAG,GAAG,EAAE,CAAE,QAAO;AAC5B,KAAI,OAAO,MAAM,YAAY,MAAM,QAAQ,OAAO,MAAM,YAAY,MAAM,KAAM,QAAO;CACvF,MAAM,QAAQ,OAAO,KAAK,EAAE;CAC5B,MAAM,QAAQ,OAAO,KAAK,EAAE;AAC5B,KAAI,MAAM,WAAW,MAAM,OAAQ,QAAO;AAC1C,MAAK,MAAM,OAAO,MAAO,KAAI,CAAC,OAAO,KAAK,GAAG,IAAI,IAAI,CAAC,OAAO,GAAG,EAAE,MAAM,EAAE,KAAK,CAAE,QAAO;AACxF,QAAO"}

package/cdn/skin-element-D0TDGWJH.js

@@ -0,0 +1,2 @@
+import{P as e}from"./create-player-B2W5yr5I.js";import{n as t,r as n,t as r}from"./shadow-styles-BYZ6q3Q4.js";function i(e){let t=globalThis.document;if(!t)return null;let n=t.createElement(`template`);return n.innerHTML=e,n}function a(e,t){e.appendChild(e.ownerDocument.importNode(t.content,!0))}var o=`video-player,live-video-player{display:contents}video-player video,video-player [slot=poster],live-video-player video,live-video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container,live-video-player video::-webkit-media-text-track-container{z-index:1;scale:.98;translate:0 var(--media-caption-track-y,0);transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);font-family:inherit}`;const s=t(`media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}`);var c=class extends e{static{this.shadowRootOptions={mode:`open`}}constructor(){if(super(),n(`__media-styles`,o),!this.shadowRoot){let e=this.constructor;this.attachShadow(e.shadowRootOptions),e.template&&a(this.shadowRoot,e.template);let t=[s];e.styles&&t.push(e.styles),r(this.shadowRoot,t)}}};export{i as n,c as t};
+//# sourceMappingURL=skin-element-D0TDGWJH.js.map

package/cdn/skin-element-D0TDGWJH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin-element-D0TDGWJH.js","names":["sharedStyles","globalStyles"],"sources":["../../utils/dist/dom/template.js","../inline-css:src/define/global.js","../inline-css:src/define/shared.js","../src/define/skin-element.ts"],"sourcesContent":["//#region src/dom/template.ts\n/** Create an `HTMLTemplateElement` from an HTML string, or `null` when `document` is unavailable (SSR). */\nfunction createTemplate(html) {\n\tconst doc = globalThis.document;\n\tif (!doc) return null;\n\tconst template = doc.createElement(\"template\");\n\ttemplate.innerHTML = html;\n\treturn template;\n}\n/** Deep-clone a template's content into a container. */\nfunction renderTemplate(container, template) {\n\tcontainer.appendChild(container.ownerDocument.importNode(template.content, true));\n}\n//#endregion\nexport { createTemplate, renderTemplate };\n\n//# sourceMappingURL=template.js.map","export default \"video-player,live-video-player{display:contents}video-player video,video-player [slot=poster],live-video-player video,live-video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container,live-video-player video::-webkit-media-text-track-container{z-index:1;scale:.98;translate:0 var(--media-caption-track-y,0);transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);font-family:inherit}\";","export default \"media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}\";","import { ReactiveElement } from '@videojs/element';\nimport {\n  applyShadowStyles,\n  createShadowStyle,\n  ensureGlobalStyle,\n  renderTemplate,\n  type ShadowStyle,\n} from '@videojs/utils/dom';\nimport globalStyles from './global.css?inline';\nimport sharedStyles from './shared.css?inline';\n\nconst STYLES_ID = '__media-styles';\nconst sharedSheet = createShadowStyle(sharedStyles);\n\n/**\n * Base element for skin definitions. Attaches a shadow root, clones\n * `static template` into it, and applies shared + per-skin styles\n * via `adoptedStyleSheets` (or `<style>` fallback).\n */\nexport class SkinElement extends ReactiveElement {\n  static shadowRootOptions: ShadowRootInit = { mode: 'open' };\n  static styles?: ShadowStyle;\n  static template?: HTMLTemplateElement | null;\n\n  constructor() {\n    super();\n\n    ensureGlobalStyle(STYLES_ID, globalStyles);\n\n    if (!this.shadowRoot) {\n      const ctor = this.constructor as typeof SkinElement;\n      this.attachShadow(ctor.shadowRootOptions);\n\n      if (ctor.template) {\n        renderTemplate(this.shadowRoot!, ctor.template);\n      }\n\n      const sheets: ShadowStyle[] = [sharedSheet];\n      if (ctor.styles) {\n        sheets.push(ctor.styles);\n      }\n      applyShadowStyles(this.shadowRoot!, sheets);\n    }\n  }\n}\n"],"mappings":"8GAEA,SAAS,EAAe,EAAM,CAC7B,IAAM,EAAM,WAAW,SACvB,GAAI,CAAC,EAAK,OAAO,KACjB,IAAM,EAAW,EAAI,cAAc,WAAW,CAE9C,MADA,GAAS,UAAY,EACd,EAGR,SAAS,EAAe,EAAW,EAAU,CAC5C,EAAU,YAAY,EAAU,cAAc,WAAW,EAAS,QAAS,GAAK,CAAC,CCXlF,IAAA,EAAe,4fEWf,MACM,EAAc,EDZL,kKCYoC,CAOnD,IAAa,EAAb,cAAiC,CAAgB,+BACJ,CAAE,KAAM,OAAQ,CAI3D,aAAc,CAKZ,GAJA,OAAO,CAEP,EAAkB,iBAAWC,EAAa,CAEtC,CAAC,KAAK,WAAY,CACpB,IAAM,EAAO,KAAK,YAClB,KAAK,aAAa,EAAK,kBAAkB,CAErC,EAAK,UACP,EAAe,KAAK,WAAa,EAAK,SAAS,CAGjD,IAAM,EAAwB,CAAC,EAAY,CACvC,EAAK,QACP,EAAO,KAAK,EAAK,OAAO,CAE1B,EAAkB,KAAK,WAAa,EAAO"}

package/cdn/skin-element-mgqcAutZ.js

@@ -0,0 +1,55 @@
+import { P as ReactiveElement } from "./create-player-_WED6HtK.js";
+import { n as createShadowStyle, r as ensureGlobalStyle, t as applyShadowStyles } from "./shadow-styles-DKXFMmyD.js";
+
+//#region ../utils/dist/dom/template.js
+/** Create an `HTMLTemplateElement` from an HTML string, or `null` when `document` is unavailable (SSR). */
+function createTemplate(html) {
+	const doc = globalThis.document;
+	if (!doc) return null;
+	const template = doc.createElement("template");
+	template.innerHTML = html;
+	return template;
+}
+/** Deep-clone a template's content into a container. */
+function renderTemplate(container, template) {
+	container.appendChild(container.ownerDocument.importNode(template.content, true));
+}
+
+//#endregion
+//#region inline-css:src/define/global.js
+var global_default = "/* -------------------------------------------------------------------------- */\n/* Global styles for the host document, outside of the Shadow DOM             */\n/* -------------------------------------------------------------------------- */\n\nvideo-player,\nlive-video-player {\n  display: contents;\n}\n\n/*\nRequired to override any default video and image styles (such as\nTailwind's CSS reset) and ensure they fill the container as expected.\n*/\nvideo-player video,\nvideo-player [slot=\"poster\"],\nlive-video-player video,\nlive-video-player [slot=\"poster\"] {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\nvideo-player video::-webkit-media-text-track-container,\nlive-video-player video::-webkit-media-text-track-container {\n  z-index: 1;\n  font-family: inherit;\n  scale: 0.98;\n  translate: 0 var(--media-caption-track-y, 0);\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\n  transition-delay: var(--media-caption-track-delay, 0);\n}\n";
+
+//#endregion
+//#region inline-css:src/define/shared.js
+var shared_default = "/* -------------------------------------------------------------------------- */\n/* Shared styles for all HTML skins                                           */\n/* -------------------------------------------------------------------------- */\n\nmedia-tooltip-group {\n  display: contents;\n}\n\n:host {\n  /* `display:grid` fixes a weird issue with Safari when setting aspect-ratio */\n  display: grid;\n  width: 100%;\n}\n\n/* Hide volume popover when volume control is unsupported (e.g., iOS Safari). */\n.media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n";
+
+//#endregion
+//#region src/define/skin-element.ts
+const STYLES_ID = "__media-styles";
+const sharedSheet = createShadowStyle(shared_default);
+/**
+* Base element for skin definitions. Attaches a shadow root, clones
+* `static template` into it, and applies shared + per-skin styles
+* via `adoptedStyleSheets` (or `<style>` fallback).
+*/
+var SkinElement = class extends ReactiveElement {
+	static {
+		this.shadowRootOptions = { mode: "open" };
+	}
+	constructor() {
+		super();
+		ensureGlobalStyle(STYLES_ID, global_default);
+		if (!this.shadowRoot) {
+			const ctor = this.constructor;
+			this.attachShadow(ctor.shadowRootOptions);
+			if (ctor.template) renderTemplate(this.shadowRoot, ctor.template);
+			const sheets = [sharedSheet];
+			if (ctor.styles) sheets.push(ctor.styles);
+			applyShadowStyles(this.shadowRoot, sheets);
+		}
+	}
+};
+
+//#endregion
+export { createTemplate as n, SkinElement as t };
+//# sourceMappingURL=skin-element-mgqcAutZ.js.map

package/cdn/skin-element-mgqcAutZ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin-element-mgqcAutZ.js","names":["sharedStyles","globalStyles"],"sources":["../../utils/dist/dom/template.js","../inline-css:src/define/global.js","../inline-css:src/define/shared.js","../src/define/skin-element.ts"],"sourcesContent":["//#region src/dom/template.ts\n/** Create an `HTMLTemplateElement` from an HTML string, or `null` when `document` is unavailable (SSR). */\nfunction createTemplate(html) {\n\tconst doc = globalThis.document;\n\tif (!doc) return null;\n\tconst template = doc.createElement(\"template\");\n\ttemplate.innerHTML = html;\n\treturn template;\n}\n/** Deep-clone a template's content into a container. */\nfunction renderTemplate(container, template) {\n\tcontainer.appendChild(container.ownerDocument.importNode(template.content, true));\n}\n//#endregion\nexport { createTemplate, renderTemplate };\n\n//# sourceMappingURL=template.js.map","export default \"/* -------------------------------------------------------------------------- */\\n/* Global styles for the host document, outside of the Shadow DOM             */\\n/* -------------------------------------------------------------------------- */\\n\\nvideo-player,\\nlive-video-player {\\n  display: contents;\\n}\\n\\n/*\\nRequired to override any default video and image styles (such as\\nTailwind's CSS reset) and ensure they fill the container as expected.\\n*/\\nvideo-player video,\\nvideo-player [slot=\\\"poster\\\"],\\nlive-video-player video,\\nlive-video-player [slot=\\\"poster\\\"] {\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n}\\n\\nvideo-player video::-webkit-media-text-track-container,\\nlive-video-player video::-webkit-media-text-track-container {\\n  z-index: 1;\\n  font-family: inherit;\\n  scale: 0.98;\\n  translate: 0 var(--media-caption-track-y, 0);\\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\\n  transition-delay: var(--media-caption-track-delay, 0);\\n}\\n\";","export default \"/* -------------------------------------------------------------------------- */\\n/* Shared styles for all HTML skins                                           */\\n/* -------------------------------------------------------------------------- */\\n\\nmedia-tooltip-group {\\n  display: contents;\\n}\\n\\n:host {\\n  /* `display:grid` fixes a weird issue with Safari when setting aspect-ratio */\\n  display: grid;\\n  width: 100%;\\n}\\n\\n/* Hide volume popover when volume control is unsupported (e.g., iOS Safari). */\\n.media-popover--volume:has(media-volume-slider[data-availability=\\\"unsupported\\\"]) {\\n  display: none;\\n}\\n\";","import { ReactiveElement } from '@videojs/element';\nimport {\n  applyShadowStyles,\n  createShadowStyle,\n  ensureGlobalStyle,\n  renderTemplate,\n  type ShadowStyle,\n} from '@videojs/utils/dom';\nimport globalStyles from './global.css?inline';\nimport sharedStyles from './shared.css?inline';\n\nconst STYLES_ID = '__media-styles';\nconst sharedSheet = createShadowStyle(sharedStyles);\n\n/**\n * Base element for skin definitions. Attaches a shadow root, clones\n * `static template` into it, and applies shared + per-skin styles\n * via `adoptedStyleSheets` (or `<style>` fallback).\n */\nexport class SkinElement extends ReactiveElement {\n  static shadowRootOptions: ShadowRootInit = { mode: 'open' };\n  static styles?: ShadowStyle;\n  static template?: HTMLTemplateElement | null;\n\n  constructor() {\n    super();\n\n    ensureGlobalStyle(STYLES_ID, globalStyles);\n\n    if (!this.shadowRoot) {\n      const ctor = this.constructor as typeof SkinElement;\n      this.attachShadow(ctor.shadowRootOptions);\n\n      if (ctor.template) {\n        renderTemplate(this.shadowRoot!, ctor.template);\n      }\n\n      const sheets: ShadowStyle[] = [sharedSheet];\n      if (ctor.styles) {\n        sheets.push(ctor.styles);\n      }\n      applyShadowStyles(this.shadowRoot!, sheets);\n    }\n  }\n}\n"],"mappings":";;;;;AAEA,SAAS,eAAe,MAAM;CAC7B,MAAM,MAAM,WAAW;AACvB,KAAI,CAAC,IAAK,QAAO;CACjB,MAAM,WAAW,IAAI,cAAc,WAAW;AAC9C,UAAS,YAAY;AACrB,QAAO;;;AAGR,SAAS,eAAe,WAAW,UAAU;AAC5C,WAAU,YAAY,UAAU,cAAc,WAAW,SAAS,SAAS,KAAK,CAAC;;;;;ACXlF,qBAAe;;;;ACAf,qBAAe;;;;ACWf,MAAM,YAAY;AAClB,MAAM,cAAc,kBAAkBA,eAAa;;;;;;AAOnD,IAAa,cAAb,cAAiC,gBAAgB;;2BACJ,EAAE,MAAM,QAAQ;;CAI3D,cAAc;AACZ,SAAO;AAEP,oBAAkB,WAAWC,eAAa;AAE1C,MAAI,CAAC,KAAK,YAAY;GACpB,MAAM,OAAO,KAAK;AAClB,QAAK,aAAa,KAAK,kBAAkB;AAEzC,OAAI,KAAK,SACP,gBAAe,KAAK,YAAa,KAAK,SAAS;GAGjD,MAAM,SAAwB,CAAC,YAAY;AAC3C,OAAI,KAAK,OACP,QAAO,KAAK,KAAK,OAAO;AAE1B,qBAAkB,KAAK,YAAa,OAAO"}