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

package/dist/default/ui/radio-options/radio-options-controller.js

@@ -1,81 +0,0 @@
-import { MenuRadioItemElement } from "../menu/menu-radio-item-element.js";
-import { cacheKey } from "../../i18n/cache-key.js";
-import { MenuItemIndicatorElement } from "../menu/menu-item-indicator-element.js";
-import { applyElementProps } from "@videojs/core/dom";
-import { translateText } from "@videojs/core/i18n";
-import { cloneTemplateRoot, getTemplateElement, getTemplateRoot } from "@videojs/utils/dom";
-//#region src/ui/radio-options/radio-options-controller.ts
-/** Renders normalized options into menu radio items and manages their interaction lifecycle. */
-var RadioOptionsController = class {
-	#host;
-	#config;
-	#contentKey = "";
-	#translator = null;
-	#disconnect = null;
-	constructor(host, config) {
-		this.#host = host;
-		this.#config = config;
-		host.addController(this);
-	}
-	hostConnected() {
-		this.#disconnect = new AbortController();
-		this.#host.addEventListener("value-change", this.#handleValueChange, { signal: this.#disconnect.signal });
-	}
-	hostDisconnected() {
-		this.#disconnect?.abort();
-		this.#disconnect = null;
-	}
-	hostDestroyed() {
-		this.hostDisconnected();
-	}
-	sync(state, translator, locale) {
-		this.#host.value = state.value;
-		applyElementProps(this.#host, {
-			"aria-disabled": state.disabled ? "true" : void 0,
-			hidden: state.hidden ? "" : void 0
-		});
-		const template = getTemplateElement(this.#host);
-		const templateRoot = template ? getTemplateRoot(template) : null;
-		const itemRoot = templateRoot?.localName === MenuRadioItemElement.tagName ? templateRoot : null;
-		const contentKey = `${state.options.map((option) => `${option.value}:${cacheKey(option.label, option.labelParams)}:${this.#config.getOptionCacheKey?.(option) ?? ""}`).join("|")}::${locale}::${template?.innerHTML ?? ""}`;
-		if (contentKey !== this.#contentKey || translator !== this.#translator) {
-			this.#contentKey = contentKey;
-			this.#translator = translator;
-			for (const child of [...this.#host.children]) {
-				if (child === template) continue;
-				child.remove();
-			}
-			const items = state.options.map((option) => {
-				const item = itemRoot ? cloneTemplateRoot(itemRoot, this.#host.ownerDocument) : this.#host.ownerDocument.createElement(MenuRadioItemElement.tagName);
-				item.value = option.value;
-				this.#config.setItemAttributes?.(item, option);
-				const label = translateText(option.label, translator, option.labelParams);
-				if (this.#config.renderItem) this.#config.renderItem(item, label, option);
-				else this.#setItemLabel(item, label);
-				return item;
-			});
-			this.#host.append(...items);
-		}
-		const optionsByValue = new Map(state.options.map((option) => [option.value, option]));
-		for (const item of this.#host.querySelectorAll(MenuRadioItemElement.tagName)) {
-			const checked = item.value === state.value;
-			const option = optionsByValue.get(item.value);
-			item.disabled = state.disabled || option?.disabled === true;
-			for (const indicator of item.querySelectorAll(MenuItemIndicatorElement.tagName)) indicator.checked = checked;
-		}
-	}
-	#handleValueChange = (event) => {
-		if (event.target !== this.#host) return;
-		const { value } = event.detail;
-		this.#config.onValueChange(value);
-	};
-	#setItemLabel(item, label) {
-		const labelPart = item.querySelector("[data-part~=\"label\"]");
-		if (labelPart) labelPart.textContent = label;
-		else item.textContent = label;
-	}
-};
-//#endregion
-export { RadioOptionsController };
-
-//# sourceMappingURL=radio-options-controller.js.map

package/dist/default/ui/radio-options/radio-options-controller.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio-options-controller.js","names":["#host","#config","#disconnect","#handleValueChange","#contentKey","#translator","#setItemLabel"],"sources":["../../../../src/ui/radio-options/radio-options-controller.ts"],"sourcesContent":["import type { RadioOption, RadioOptionsState } from '@videojs/core';\nimport { applyElementProps } from '@videojs/core/dom';\nimport { type Translator, translateText } from '@videojs/core/i18n';\nimport type { ReactiveController, ReactiveControllerHost } from '@videojs/element';\nimport { cloneTemplateRoot, getTemplateElement, getTemplateRoot } from '@videojs/utils/dom';\n\nimport { cacheKey } from '../../i18n/cache-key';\nimport { MenuItemIndicatorElement } from '../menu/menu-item-indicator-element';\nimport { MenuRadioItemElement } from '../menu/menu-radio-item-element';\n\nexport type RadioOptionsControllerHost = ReactiveControllerHost &\n  HTMLElement & {\n    value: string;\n  };\n\nexport interface RadioOptionsControllerConfig<Option extends RadioOption> {\n  renderItem?: ((item: MenuRadioItemElement, label: string, option: Option) => void) | undefined;\n  setItemAttributes?: ((item: MenuRadioItemElement, option: Option) => void) | undefined;\n  getOptionCacheKey?: ((option: Option) => string) | undefined;\n  onValueChange: (value: string) => void;\n}\n\n/** Renders normalized options into menu radio items and manages their interaction lifecycle. */\nexport class RadioOptionsController<Option extends RadioOption> implements ReactiveController {\n  readonly #host: RadioOptionsControllerHost;\n  readonly #config: RadioOptionsControllerConfig<Option>;\n\n  #contentKey = '';\n  #translator: Translator | null = null;\n  #disconnect: AbortController | null = null;\n\n  constructor(host: RadioOptionsControllerHost, config: RadioOptionsControllerConfig<Option>) {\n    this.#host = host;\n    this.#config = config;\n    host.addController(this);\n  }\n\n  hostConnected(): void {\n    this.#disconnect = new AbortController();\n    this.#host.addEventListener('value-change', this.#handleValueChange, { signal: this.#disconnect.signal });\n  }\n\n  hostDisconnected(): void {\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  hostDestroyed(): void {\n    this.hostDisconnected();\n  }\n\n  sync(state: RadioOptionsState<Option>, translator: Translator, locale: string): void {\n    this.#host.value = state.value;\n    applyElementProps(this.#host, {\n      'aria-disabled': state.disabled ? 'true' : undefined,\n      hidden: state.hidden ? '' : undefined,\n    });\n\n    const template = getTemplateElement(this.#host);\n    const templateRoot = template ? getTemplateRoot(template) : null;\n    const itemRoot = templateRoot?.localName === MenuRadioItemElement.tagName ? templateRoot : null;\n\n    const contentKey = `${state.options\n      .map(\n        (option) =>\n          `${option.value}:${cacheKey(option.label, option.labelParams)}:${this.#config.getOptionCacheKey?.(option) ?? ''}`\n      )\n      .join('|')}::${locale}::${template?.innerHTML ?? ''}`;\n\n    if (contentKey !== this.#contentKey || translator !== this.#translator) {\n      this.#contentKey = contentKey;\n      this.#translator = translator;\n\n      for (const child of [...this.#host.children]) {\n        if (child === template) continue;\n\n        child.remove();\n      }\n\n      const items = state.options.map((option) => {\n        const item = itemRoot\n          ? (cloneTemplateRoot(itemRoot, this.#host.ownerDocument) as MenuRadioItemElement)\n          : (this.#host.ownerDocument.createElement(MenuRadioItemElement.tagName) as MenuRadioItemElement);\n\n        item.value = option.value;\n        this.#config.setItemAttributes?.(item, option);\n        const label = translateText(option.label, translator, option.labelParams);\n\n        if (this.#config.renderItem) this.#config.renderItem(item, label, option);\n        else this.#setItemLabel(item, label);\n\n        return item;\n      });\n\n      this.#host.append(...items);\n    }\n\n    const optionsByValue = new Map(state.options.map((option) => [option.value, option]));\n\n    for (const item of this.#host.querySelectorAll<MenuRadioItemElement>(MenuRadioItemElement.tagName)) {\n      const checked = item.value === state.value;\n      const option = optionsByValue.get(item.value);\n\n      item.disabled = state.disabled || option?.disabled === true;\n\n      for (const indicator of item.querySelectorAll<MenuItemIndicatorElement>(MenuItemIndicatorElement.tagName)) {\n        indicator.checked = checked;\n      }\n    }\n  }\n\n  #handleValueChange = (event: Event): void => {\n    if (event.target !== this.#host) return;\n\n    const { value } = (event as CustomEvent<{ value: string }>).detail;\n\n    this.#config.onValueChange(value);\n  };\n\n  #setItemLabel(item: MenuRadioItemElement, label: string): void {\n    const labelPart = item.querySelector<HTMLElement>('[data-part~=\"label\"]');\n\n    if (labelPart) labelPart.textContent = label;\n    else item.textContent = label;\n  }\n}\n"],"mappings":";;;;;;;;AAuBA,IAAa,yBAAb,MAA8F;CAC5F;CACA;CAEA,cAAc;CACd,cAAiC;CACjC,cAAsC;CAEtC,YAAY,MAAkC,QAA8C;EAC1F,KAAKA,QAAQ;EACb,KAAKC,UAAU;EACf,KAAK,cAAc,IAAI;CACzB;CAEA,gBAAsB;EACpB,KAAKC,cAAc,IAAI,gBAAgB;EACvC,KAAKF,MAAM,iBAAiB,gBAAgB,KAAKG,oBAAoB,EAAE,QAAQ,KAAKD,YAAY,OAAO,CAAC;CAC1G;CAEA,mBAAyB;EACvB,KAAKA,aAAa,MAAM;EACxB,KAAKA,cAAc;CACrB;CAEA,gBAAsB;EACpB,KAAK,iBAAiB;CACxB;CAEA,KAAK,OAAkC,YAAwB,QAAsB;EACnF,KAAKF,MAAM,QAAQ,MAAM;EACzB,kBAAkB,KAAKA,OAAO;GAC5B,iBAAiB,MAAM,WAAW,SAAS,KAAA;GAC3C,QAAQ,MAAM,SAAS,KAAK,KAAA;EAC9B,CAAC;EAED,MAAM,WAAW,mBAAmB,KAAKA,KAAK;EAC9C,MAAM,eAAe,WAAW,gBAAgB,QAAQ,IAAI;EAC5D,MAAM,WAAW,cAAc,cAAc,qBAAqB,UAAU,eAAe;EAE3F,MAAM,aAAa,GAAG,MAAM,QACzB,KACE,WACC,GAAG,OAAO,MAAM,GAAG,SAAS,OAAO,OAAO,OAAO,WAAW,EAAE,GAAG,KAAKC,QAAQ,oBAAoB,MAAM,KAAK,IACjH,CAAC,CACA,KAAK,GAAG,EAAE,IAAI,OAAO,IAAI,UAAU,aAAa;EAEnD,IAAI,eAAe,KAAKG,eAAe,eAAe,KAAKC,aAAa;GACtE,KAAKD,cAAc;GACnB,KAAKC,cAAc;GAEnB,KAAK,MAAM,SAAS,CAAC,GAAG,KAAKL,MAAM,QAAQ,GAAG;IAC5C,IAAI,UAAU,UAAU;IAExB,MAAM,OAAO;GACf;GAEA,MAAM,QAAQ,MAAM,QAAQ,KAAK,WAAW;IAC1C,MAAM,OAAO,WACR,kBAAkB,UAAU,KAAKA,MAAM,aAAa,IACpD,KAAKA,MAAM,cAAc,cAAc,qBAAqB,OAAO;IAExE,KAAK,QAAQ,OAAO;IACpB,KAAKC,QAAQ,oBAAoB,MAAM,MAAM;IAC7C,MAAM,QAAQ,cAAc,OAAO,OAAO,YAAY,OAAO,WAAW;IAExE,IAAI,KAAKA,QAAQ,YAAY,KAAKA,QAAQ,WAAW,MAAM,OAAO,MAAM;SACnE,KAAKK,cAAc,MAAM,KAAK;IAEnC,OAAO;GACT,CAAC;GAED,KAAKN,MAAM,OAAO,GAAG,KAAK;EAC5B;EAEA,MAAM,iBAAiB,IAAI,IAAI,MAAM,QAAQ,KAAK,WAAW,CAAC,OAAO,OAAO,MAAM,CAAC,CAAC;EAEpF,KAAK,MAAM,QAAQ,KAAKA,MAAM,iBAAuC,qBAAqB,OAAO,GAAG;GAClG,MAAM,UAAU,KAAK,UAAU,MAAM;GACrC,MAAM,SAAS,eAAe,IAAI,KAAK,KAAK;GAE5C,KAAK,WAAW,MAAM,YAAY,QAAQ,aAAa;GAEvD,KAAK,MAAM,aAAa,KAAK,iBAA2C,yBAAyB,OAAO,GACtG,UAAU,UAAU;EAExB;CACF;CAEA,sBAAsB,UAAuB;EAC3C,IAAI,MAAM,WAAW,KAAKA,OAAO;EAEjC,MAAM,EAAE,UAAW,MAAyC;EAE5D,KAAKC,QAAQ,cAAc,KAAK;CAClC;CAEA,cAAc,MAA4B,OAAqB;EAC7D,MAAM,YAAY,KAAK,cAA2B,wBAAsB;EAExE,IAAI,WAAW,UAAU,cAAc;OAClC,KAAK,cAAc;CAC1B;AACF"}

package/dist/default/ui/seek-button/seek-button-element.js

@@ -1,35 +0,0 @@
-import { playerContext } from "../../player/context.js";
-import { PlayerController } from "../../player/player-controller.js";
-import { MediaButtonElement } from "../media-button-element.js";
-import { SeekButtonCore, SeekButtonDataAttrs } from "@videojs/core";
-import { selectTime } from "@videojs/core/dom";
-//#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);
-		this.hotkeyAction = "seekStep";
-	}
-	static {
-		this.tagName = "media-seek-button";
-	}
-	static {
-		this.properties = {
-			...MediaButtonElement.properties,
-			seconds: { type: Number }
-		};
-	}
-	get hotkeyValue() {
-		return this.seconds;
-	}
-	activate(state) {
-		this.core.seek(state);
-	}
-};
-//#endregion
-export { SeekButtonElement };
-
-//# sourceMappingURL=seek-button-element.js.map

package/dist/default/ui/seek-button/seek-button-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"seek-button-element.js","names":[],"sources":["../../../../src/ui/seek-button/seek-button-element.ts"],"sourcesContent":["import { SeekButtonCore, SeekButtonDataAttrs } from '@videojs/core';\nimport { selectTime } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap } from '@videojs/element';\nimport type { MediaTimeState } from '@videojs/media';\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  protected override readonly hotkeyAction = 'seekStep';\n\n  protected override get hotkeyValue(): number | undefined {\n    return this.seconds;\n  }\n\n  protected activate(state: MediaTimeState): void {\n    this.core.seek(state);\n  }\n}\n"],"mappings":";;;;;;AASA,IAAa,oBAAb,cAAuC,mBAAmC;;;EAQ9D,KAAA,UAAA,eAAe,aAAa;EAEZ,KAAA,OAAA,IAAI,eAAe;EACX,KAAA,eAAA;EACF,KAAA,aAAA,IAAI,iBAAiB,MAAM,eAAe,UAAU;EACzC,KAAA,eAAA;;;EAZjB,KAAA,UAAA;;;EAE2B,KAAA,aAAA;GACnD,GAAG,mBAAmB;GACtB,SAAS,EAAE,MAAM,OAAO;EAC1B;;CASA,IAAuB,cAAkC;EACvD,OAAO,KAAK;CACd;CAEA,SAAmB,OAA6B;EAC9C,KAAK,KAAK,KAAK,KAAK;CACtB;AACF"}

package/dist/default/ui/seek-indicator/seek-indicator-element.js

@@ -1,44 +0,0 @@
-import { InputIndicatorElement } from "../input-indicator/input-indicator-element.js";
-import { LiveIndicator } from "../input-indicator/live-indicator.js";
-import { SeekIndicatorCore, SeekIndicatorDataAttrs, getSeekIndicatorDisplayValue } from "@videojs/core";
-import { createTransition } from "@videojs/core/dom";
-//#region src/ui/seek-indicator/seek-indicator-element.ts
-var SeekIndicatorElement = class extends InputIndicatorElement {
-	static {
-		this.tagName = "media-seek-indicator";
-	}
-	static {
-		this.properties = { closeDelay: {
-			type: Number,
-			attribute: "close-delay"
-		} };
-	}
-	#core = new SeekIndicatorCore();
-	#transition = createTransition();
-	#liveIndicator = new LiveIndicator({
-		host: this,
-		dataAttrs: SeekIndicatorDataAttrs,
-		render: renderSeekIndicator
-	});
-	get core() {
-		return this.#core;
-	}
-	get transition() {
-		return this.#transition;
-	}
-	get liveIndicator() {
-		return this.#liveIndicator;
-	}
-	syncCoreProps() {
-		this.#core.setProps({ closeDelay: this.closeDelay });
-	}
-};
-function renderSeekIndicator(element, state) {
-	const value = element.querySelector("media-seek-indicator-value");
-	if (!value) return;
-	value.textContent = getSeekIndicatorDisplayValue(state);
-}
-//#endregion
-export { SeekIndicatorElement };
-
-//# sourceMappingURL=seek-indicator-element.js.map

package/dist/default/ui/seek-indicator/seek-indicator-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"seek-indicator-element.js","names":["#core","#transition","#liveIndicator"],"sources":["../../../../src/ui/seek-indicator/seek-indicator-element.ts"],"sourcesContent":["import { getSeekIndicatorDisplayValue, SeekIndicatorCore, SeekIndicatorDataAttrs } from '@videojs/core';\nimport { createTransition } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap } from '@videojs/element';\n\nimport { InputIndicatorElement } from '../input-indicator/input-indicator-element';\nimport { LiveIndicator } from '../input-indicator/live-indicator';\n\nexport class SeekIndicatorElement extends InputIndicatorElement<SeekIndicatorCore.State> {\n  static readonly tagName = 'media-seek-indicator';\n\n  static override properties = {\n    closeDelay: { type: Number, attribute: 'close-delay' },\n  } satisfies PropertyDeclarationMap<'closeDelay'>;\n\n  closeDelay: number | undefined;\n\n  readonly #core = new SeekIndicatorCore();\n  readonly #transition = createTransition();\n  readonly #liveIndicator = new LiveIndicator({\n    host: this,\n    dataAttrs: SeekIndicatorDataAttrs,\n    render: renderSeekIndicator,\n  });\n\n  protected get core() {\n    return this.#core;\n  }\n\n  protected get transition() {\n    return this.#transition;\n  }\n\n  protected get liveIndicator() {\n    return this.#liveIndicator;\n  }\n\n  protected override syncCoreProps(): void {\n    this.#core.setProps({ closeDelay: this.closeDelay });\n  }\n}\n\nfunction renderSeekIndicator(element: HTMLElement, state: SeekIndicatorCore.State): void {\n  const value = element.querySelector('media-seek-indicator-value');\n  if (!value) return;\n\n  value.textContent = getSeekIndicatorDisplayValue(state);\n}\n"],"mappings":";;;;;AAOA,IAAa,uBAAb,cAA0C,sBAA+C;;EAC7D,KAAA,UAAA;;;EAEG,KAAA,aAAA,EAC3B,YAAY;GAAE,MAAM;GAAQ,WAAW;EAAc,EACvD;;CAIA,QAAiB,IAAI,kBAAkB;CACvC,cAAuB,iBAAiB;CACxC,iBAA0B,IAAI,cAAc;EAC1C,MAAM;EACN,WAAW;EACX,QAAQ;CACV,CAAC;CAED,IAAc,OAAO;EACnB,OAAO,KAAKA;CACd;CAEA,IAAc,aAAa;EACzB,OAAO,KAAKC;CACd;CAEA,IAAc,gBAAgB;EAC5B,OAAO,KAAKC;CACd;CAEA,gBAAyC;EACvC,KAAKF,MAAM,SAAS,EAAE,YAAY,KAAK,WAAW,CAAC;CACrD;AACF;AAEA,SAAS,oBAAoB,SAAsB,OAAsC;CACvF,MAAM,QAAQ,QAAQ,cAAc,4BAA4B;CAChE,IAAI,CAAC,OAAO;CAEZ,MAAM,cAAc,6BAA6B,KAAK;AACxD"}

package/dist/default/ui/seek-indicator/seek-indicator-value-element.js

@@ -1,11 +0,0 @@
-import { UIElement } from "../ui-element.js";
-//#region src/ui/seek-indicator/seek-indicator-value-element.ts
-var SeekIndicatorValueElement = class extends UIElement {
-	static {
-		this.tagName = "media-seek-indicator-value";
-	}
-};
-//#endregion
-export { SeekIndicatorValueElement };
-
-//# sourceMappingURL=seek-indicator-value-element.js.map

package/dist/default/ui/seek-indicator/seek-indicator-value-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"seek-indicator-value-element.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-value-element.ts"],"sourcesContent":["import { UIElement } from '../ui-element';\n\nexport class SeekIndicatorValueElement extends UIElement {\n  static readonly tagName = 'media-seek-indicator-value';\n}\n"],"mappings":";;AAEA,IAAa,4BAAb,cAA+C,UAAU;;EAC7B,KAAA,UAAA;;AAC5B"}

package/dist/default/ui/slider/slider-buffer-element.js

@@ -1,20 +0,0 @@
-import { ContextPartElement } from "../context-part-element.js";
-import { sliderContext } from "./context.js";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-buffer-element.ts
-var SliderBufferElement = class extends ContextPartElement {
-	constructor(..._args) {
-		super(..._args);
-		this.consumer = new ContextConsumer(this, {
-			context: sliderContext,
-			subscribe: true
-		});
-	}
-	static {
-		this.tagName = "media-slider-buffer";
-	}
-};
-//#endregion
-export { SliderBufferElement };
-
-//# sourceMappingURL=slider-buffer-element.js.map

package/dist/default/ui/slider/slider-buffer-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-buffer-element.js","names":[],"sources":["../../../../src/ui/slider/slider-buffer-element.ts"],"sourcesContent":["import type { SliderState } from '@videojs/core';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { sliderContext } from './context';\n\nexport class SliderBufferElement extends ContextPartElement<SliderState> {\n  static readonly tagName = 'media-slider-buffer';\n\n  protected readonly consumer = new ContextConsumer(this, { context: sliderContext, subscribe: true });\n}\n"],"mappings":";;;;AAMA,IAAa,sBAAb,cAAyC,mBAAgC;;;EAGzC,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFzE,KAAA,UAAA;;AAG5B"}

package/dist/default/ui/slider/slider-element.js

@@ -1,157 +0,0 @@
-import { i18nContext } from "../../i18n/context.js";
-import { I18nController } from "../../i18n/controller.js";
-import { playerContext } from "../../player/context.js";
-import { PlayerController } from "../../player/player-controller.js";
-import { UIElement } from "../ui-element.js";
-import { sliderContext } from "./context.js";
-import { SliderCore, SliderDataAttrs } from "@videojs/core";
-import { applyElementProps, applyStateDataAttrs, createSlider, getSliderCSSVars, selectControls } from "@videojs/core/dom";
-import { ContextProvider } from "@videojs/element/context";
-import { translateText } from "@videojs/core/i18n";
-import { applyStyles } from "@videojs/utils/dom";
-//#region src/ui/slider/slider-element.ts
-/**
-* @fires value-change - Fired while the slider value changes during an interaction.
-* @fires value-commit - Fired when an interaction commits the slider value.
-* @fires drag-start - Fired when a pointer drag starts.
-* @fires drag-end - Fired when a pointer drag ends.
-*/
-var SliderElement = class extends UIElement {
-	constructor(..._args) {
-		super(..._args);
-		this.label = "";
-		this.value = SliderCore.defaultProps.value;
-		this.min = SliderCore.defaultProps.min;
-		this.max = SliderCore.defaultProps.max;
-		this.step = SliderCore.defaultProps.step;
-		this.largeStep = SliderCore.defaultProps.largeStep;
-		this.orientation = SliderCore.defaultProps.orientation;
-		this.disabled = SliderCore.defaultProps.disabled;
-		this.thumbAlignment = SliderCore.defaultProps.thumbAlignment;
-		this.#core = new SliderCore();
-		this.#controlsState = new PlayerController(this, playerContext, selectControls);
-		this.#i18n = new I18nController(this, i18nContext);
-		this.#provider = new ContextProvider(this, { context: sliderContext });
-		this.#slider = null;
-		this.#disconnect = null;
-		this.#releaseControlsLock = null;
-	}
-	static {
-		this.tagName = "media-slider";
-	}
-	static {
-		this.properties = {
-			label: { type: String },
-			value: { type: Number },
-			min: { type: Number },
-			max: { type: Number },
-			step: { type: Number },
-			largeStep: {
-				type: Number,
-				attribute: "large-step"
-			},
-			orientation: { type: String },
-			disabled: { type: Boolean },
-			thumbAlignment: {
-				type: String,
-				attribute: "thumb-alignment"
-			}
-		};
-	}
-	#core;
-	#controlsState;
-	#i18n;
-	#provider;
-	#slider;
-	#disconnect;
-	#releaseControlsLock;
-	connectedCallback() {
-		super.connectedCallback();
-		if (this.destroyed) return;
-		this.#disconnect = new AbortController();
-		const signal = this.#disconnect.signal;
-		this.#slider = createSlider({
-			getElement: () => this,
-			getThumbElement: () => this.querySelector("media-slider-thumb"),
-			getOrientation: () => this.orientation,
-			isDisabled: () => this.disabled,
-			getPercent: () => this.#core.percentFromValue(this.value),
-			getStepPercent: () => this.#core.getStepPercent(),
-			getLargeStepPercent: () => this.#core.getLargeStepPercent(),
-			onValueChange: (percent) => {
-				this.value = this.#core.valueFromPercent(percent);
-				this.dispatchEvent(new CustomEvent("value-change", {
-					detail: { value: this.value },
-					bubbles: true
-				}));
-			},
-			onValueCommit: (percent) => {
-				this.value = this.#core.valueFromPercent(percent);
-				this.dispatchEvent(new CustomEvent("value-commit", {
-					detail: { value: this.value },
-					bubbles: true
-				}));
-			},
-			onPressStart: () => {
-				this.#releaseControlsLock ??= this.#controlsState.value?.requestControlsLock() ?? null;
-			},
-			onPressEnd: () => this.#releaseControlsVisibilityLock(),
-			onDragStart: () => {
-				this.dispatchEvent(new CustomEvent("drag-start", { bubbles: true }));
-			},
-			onDragEnd: () => {
-				this.dispatchEvent(new CustomEvent("drag-end", { bubbles: true }));
-			},
-			adjustPercent: (raw, thumbSize, trackSize) => this.#core.adjustPercentForAlignment(raw, thumbSize, trackSize),
-			onResize: () => this.requestUpdate()
-		});
-		applyElementProps(this, this.#slider.rootProps, { signal });
-		applyStyles(this, this.#slider.rootStyle);
-		this.#slider.input.subscribe(() => this.requestUpdate(), { signal });
-	}
-	disconnectedCallback() {
-		this.#releaseControlsVisibilityLock();
-		super.disconnectedCallback();
-		this.#disconnect?.abort();
-		this.#disconnect = null;
-	}
-	destroyCallback() {
-		this.#releaseControlsVisibilityLock();
-		this.#slider?.destroy();
-		super.destroyCallback();
-	}
-	#releaseControlsVisibilityLock() {
-		this.#releaseControlsLock?.();
-		this.#releaseControlsLock = null;
-	}
-	willUpdate(_changed) {
-		super.willUpdate(_changed);
-		this.#core.setProps(this);
-	}
-	update(_changed) {
-		super.update(_changed);
-		if (!this.#slider) return;
-		this.#core.setInput(this.#slider.input.current);
-		const state = this.#core.getSliderState(this.value);
-		const cssVars = getSliderCSSVars(this.#slider.adjustForAlignment(state));
-		applyStyles(this, cssVars);
-		applyStateDataAttrs(this, state, SliderDataAttrs);
-		this.#provider.setValue({
-			state,
-			stateAttrMap: SliderDataAttrs,
-			pointerValue: this.#core.valueFromPercent(state.pointerPercent),
-			thumbAttrs: (() => {
-				const attrs = this.#core.getAttrs(state);
-				return {
-					...attrs,
-					"aria-label": translateText(attrs["aria-label"], this.#i18n.value)
-				};
-			})(),
-			thumbProps: this.#slider.thumbProps
-		});
-	}
-};
-//#endregion
-export { SliderElement };
-
-//# sourceMappingURL=slider-element.js.map

package/dist/default/ui/slider/slider-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-element.js","names":["#core","#controlsState","#i18n","#provider","#disconnect","#slider","#releaseControlsLock","#releaseControlsVisibilityLock"],"sources":["../../../../src/ui/slider/slider-element.ts"],"sourcesContent":["import { SliderCore, SliderDataAttrs } from '@videojs/core';\nimport {\n  applyElementProps,\n  applyStateDataAttrs,\n  createSlider,\n  getSliderCSSVars,\n  type SliderApi,\n  selectControls,\n} from '@videojs/core/dom';\nimport { type Text, translateText } from '@videojs/core/i18n';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { applyStyles } from '@videojs/utils/dom';\n\nimport { i18nContext } from '../../i18n/context';\nimport { I18nController } from '../../i18n/controller';\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { UIElement } from '../ui-element';\nimport { sliderContext } from './context';\n\n/**\n * @fires value-change - Fired while the slider value changes during an interaction.\n * @fires value-commit - Fired when an interaction commits the slider value.\n * @fires drag-start - Fired when a pointer drag starts.\n * @fires drag-end - Fired when a pointer drag ends.\n */\nexport class SliderElement extends UIElement {\n  static readonly tagName = 'media-slider';\n\n  static override properties = {\n    label: { type: String },\n    value: { type: Number },\n    min: { type: Number },\n    max: { type: Number },\n    step: { type: Number },\n    largeStep: { type: Number, attribute: 'large-step' },\n    orientation: { type: String },\n    disabled: { type: Boolean },\n    thumbAlignment: { type: String, attribute: 'thumb-alignment' },\n  } satisfies PropertyDeclarationMap<keyof SliderCore.Props>;\n\n  label: Text | string = '';\n  value = SliderCore.defaultProps.value;\n  min = SliderCore.defaultProps.min;\n  max = SliderCore.defaultProps.max;\n  step = SliderCore.defaultProps.step;\n  largeStep = SliderCore.defaultProps.largeStep;\n  orientation = SliderCore.defaultProps.orientation;\n  disabled = SliderCore.defaultProps.disabled;\n  thumbAlignment = SliderCore.defaultProps.thumbAlignment;\n\n  readonly #core = new SliderCore();\n  readonly #controlsState = new PlayerController(this, playerContext, selectControls);\n  readonly #i18n = new I18nController(this, i18nContext);\n  readonly #provider = new ContextProvider(this, { context: sliderContext });\n\n  #slider: SliderApi | null = null;\n  #disconnect: AbortController | null = null;\n  #releaseControlsLock: (() => void) | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (this.destroyed) return;\n\n    this.#disconnect = new AbortController();\n    const signal = this.#disconnect.signal;\n\n    this.#slider = createSlider({\n      getElement: () => this,\n      getThumbElement: () => this.querySelector<HTMLElement>('media-slider-thumb'),\n      getOrientation: () => this.orientation,\n      isDisabled: () => this.disabled,\n      getPercent: () => this.#core.percentFromValue(this.value),\n      getStepPercent: () => this.#core.getStepPercent(),\n      getLargeStepPercent: () => this.#core.getLargeStepPercent(),\n      onValueChange: (percent) => {\n        this.value = this.#core.valueFromPercent(percent);\n        this.dispatchEvent(new CustomEvent('value-change', { detail: { value: this.value }, bubbles: true }));\n      },\n      onValueCommit: (percent) => {\n        this.value = this.#core.valueFromPercent(percent);\n        this.dispatchEvent(new CustomEvent('value-commit', { detail: { value: this.value }, bubbles: true }));\n      },\n      onPressStart: () => {\n        this.#releaseControlsLock ??= this.#controlsState.value?.requestControlsLock() ?? null;\n      },\n      onPressEnd: () => this.#releaseControlsVisibilityLock(),\n      onDragStart: () => {\n        this.dispatchEvent(new CustomEvent('drag-start', { bubbles: true }));\n      },\n      onDragEnd: () => {\n        this.dispatchEvent(new CustomEvent('drag-end', { bubbles: true }));\n      },\n      adjustPercent: (raw, thumbSize, trackSize) => this.#core.adjustPercentForAlignment(raw, thumbSize, trackSize),\n      onResize: () => this.requestUpdate(),\n    });\n\n    applyElementProps(this, this.#slider.rootProps, { signal });\n    applyStyles(this, this.#slider.rootStyle);\n    this.#slider.input.subscribe(() => this.requestUpdate(), { signal });\n  }\n\n  override disconnectedCallback(): void {\n    this.#releaseControlsVisibilityLock();\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n  }\n\n  override destroyCallback(): void {\n    this.#releaseControlsVisibilityLock();\n    this.#slider?.destroy();\n    super.destroyCallback();\n  }\n\n  #releaseControlsVisibilityLock(): void {\n    this.#releaseControlsLock?.();\n    this.#releaseControlsLock = null;\n  }\n\n  protected override willUpdate(_changed: PropertyValues): void {\n    super.willUpdate(_changed);\n    this.#core.setProps(this);\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    if (!this.#slider) return;\n\n    this.#core.setInput(this.#slider.input.current);\n    const state = this.#core.getSliderState(this.value);\n\n    const cssVars = getSliderCSSVars(this.#slider.adjustForAlignment(state));\n\n    applyStyles(this, cssVars);\n\n    // Apply state data attributes to the root element.\n    applyStateDataAttrs(this, state, SliderDataAttrs);\n\n    // Provide context to child elements (thumb, value, track, etc.).\n    this.#provider.setValue({\n      state,\n      stateAttrMap: SliderDataAttrs,\n      pointerValue: this.#core.valueFromPercent(state.pointerPercent),\n      thumbAttrs: (() => {\n        const attrs = this.#core.getAttrs(state);\n\n        return { ...attrs, 'aria-label': translateText(attrs['aria-label'], this.#i18n.value) };\n      })(),\n      thumbProps: this.#slider.thumbProps,\n    });\n  }\n}\n"],"mappings":"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"}

package/dist/default/ui/slider/slider-fill-element.js

@@ -1,20 +0,0 @@
-import { ContextPartElement } from "../context-part-element.js";
-import { sliderContext } from "./context.js";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-fill-element.ts
-var SliderFillElement = class extends ContextPartElement {
-	constructor(..._args) {
-		super(..._args);
-		this.consumer = new ContextConsumer(this, {
-			context: sliderContext,
-			subscribe: true
-		});
-	}
-	static {
-		this.tagName = "media-slider-fill";
-	}
-};
-//#endregion
-export { SliderFillElement };
-
-//# sourceMappingURL=slider-fill-element.js.map

package/dist/default/ui/slider/slider-fill-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-fill-element.js","names":[],"sources":["../../../../src/ui/slider/slider-fill-element.ts"],"sourcesContent":["import type { SliderState } from '@videojs/core';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { sliderContext } from './context';\n\nexport class SliderFillElement extends ContextPartElement<SliderState> {\n  static readonly tagName = 'media-slider-fill';\n\n  protected readonly consumer = new ContextConsumer(this, { context: sliderContext, subscribe: true });\n}\n"],"mappings":";;;;AAMA,IAAa,oBAAb,cAAuC,mBAAgC;;;EAGvC,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFzE,KAAA,UAAA;;AAG5B"}

package/dist/default/ui/slider/slider-preview-element.js

@@ -1,52 +0,0 @@
-import { UIElement } from "../ui-element.js";
-import { sliderContext } from "./context.js";
-import { applyStateDataAttrs, getSliderPreviewStyle } from "@videojs/core/dom";
-import { ContextConsumer } from "@videojs/element/context";
-import { applyStyles, observeResize } from "@videojs/utils/dom";
-//#region src/ui/slider/slider-preview-element.ts
-var SliderPreviewElement = class extends UIElement {
-	constructor(..._args) {
-		super(..._args);
-		this.overflow = "clamp";
-		this.#ctx = new ContextConsumer(this, {
-			context: sliderContext,
-			subscribe: true
-		});
-		this.#stopObservingResize = null;
-		this.#width = 0;
-	}
-	static {
-		this.tagName = "media-slider-preview";
-	}
-	static {
-		this.properties = { overflow: { type: String } };
-	}
-	#ctx;
-	#stopObservingResize;
-	#width;
-	connectedCallback() {
-		super.connectedCallback();
-		this.#stopObservingResize = observeResize(this, ([entry]) => {
-			this.#width = entry.contentRect.width;
-			this.#applyPosition();
-		});
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		this.#stopObservingResize?.();
-		this.#stopObservingResize = null;
-	}
-	#applyPosition() {
-		applyStyles(this, getSliderPreviewStyle(this.#width, this.overflow));
-	}
-	update(_changed) {
-		super.update(_changed);
-		const ctx = this.#ctx.value;
-		if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);
-		this.#applyPosition();
-	}
-};
-//#endregion
-export { SliderPreviewElement };
-
-//# sourceMappingURL=slider-preview-element.js.map

package/dist/default/ui/slider/slider-preview-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-preview-element.js","names":["#ctx","#stopObservingResize","#width","#applyPosition"],"sources":["../../../../src/ui/slider/slider-preview-element.ts"],"sourcesContent":["import type { SliderPreviewProps } from '@videojs/core';\nimport { applyStateDataAttrs, getSliderPreviewStyle } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\nimport { applyStyles, observeResize } from '@videojs/utils/dom';\n\nimport { UIElement } from '../ui-element';\nimport { sliderContext } from './context';\n\nexport class SliderPreviewElement extends UIElement {\n  static readonly tagName = 'media-slider-preview';\n\n  static override properties = {\n    overflow: { type: String },\n  } satisfies PropertyDeclarationMap<'overflow'>;\n\n  overflow: NonNullable<SliderPreviewProps['overflow']> = 'clamp';\n\n  readonly #ctx = new ContextConsumer(this, {\n    context: sliderContext,\n    subscribe: true,\n  });\n\n  #stopObservingResize: (() => void) | null = null;\n  #width = 0;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    this.#stopObservingResize = observeResize(this, ([entry]) => {\n      this.#width = entry!.contentRect.width;\n      this.#applyPosition();\n    });\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#stopObservingResize?.();\n    this.#stopObservingResize = null;\n  }\n\n  #applyPosition(): void {\n    applyStyles(this, getSliderPreviewStyle(this.#width, this.overflow));\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const ctx = this.#ctx.value;\n\n    if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n\n    this.#applyPosition();\n  }\n}\n"],"mappings":";;;;;;AASA,IAAa,uBAAb,cAA0C,UAAU;;;EAOM,KAAA,WAAA;EAExC,KAAA,OAAA,IAAI,gBAAgB,MAAM;GACxC,SAAS;GACT,WAAW;EACb,CAAC;EAE2C,KAAA,uBAAA;EACnC,KAAA,SAAA;;;EAdiB,KAAA,UAAA;;;EAEG,KAAA,aAAA,EAC3B,UAAU,EAAE,MAAM,OAAO,EAC3B;;CAIA;CAKA;CACA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EAExB,KAAKC,uBAAuB,cAAc,OAAO,CAAC,WAAW;GAC3D,KAAKC,SAAS,MAAO,YAAY;GACjC,KAAKC,eAAe;EACtB,CAAC;CACH;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKF,uBAAuB;EAC5B,KAAKA,uBAAuB;CAC9B;CAEA,iBAAuB;EACrB,YAAY,MAAM,sBAAsB,KAAKC,QAAQ,KAAK,QAAQ,CAAC;CACrE;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKF,KAAK;EAEtB,IAAI,KAAK,oBAAoB,MAAM,IAAI,OAAO,IAAI,YAAY;EAE9D,KAAKG,eAAe;CACtB;AACF"}

package/dist/default/ui/slider/slider-thumb-element.js

@@ -1,42 +0,0 @@
-import { UIElement } from "../ui-element.js";
-import { sliderContext } from "./context.js";
-import { applyElementProps, applyStateDataAttrs } from "@videojs/core/dom";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-thumb-element.ts
-var SliderThumbElement = class extends UIElement {
-	static {
-		this.tagName = "media-slider-thumb";
-	}
-	#ctx = new ContextConsumer(this, {
-		context: sliderContext,
-		subscribe: true
-	});
-	#disconnect = null;
-	#thumbPropsApplied = false;
-	connectedCallback() {
-		super.connectedCallback();
-		this.#disconnect = new AbortController();
-		this.#thumbPropsApplied = false;
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		this.#disconnect?.abort();
-		this.#disconnect = null;
-		this.#thumbPropsApplied = false;
-	}
-	update(_changed) {
-		super.update(_changed);
-		const ctx = this.#ctx.value;
-		if (!ctx) return;
-		if (!this.#thumbPropsApplied && this.#disconnect) {
-			applyElementProps(this, ctx.thumbProps, { signal: this.#disconnect.signal });
-			this.#thumbPropsApplied = true;
-		}
-		applyElementProps(this, ctx.thumbAttrs);
-		applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);
-	}
-};
-//#endregion
-export { SliderThumbElement };
-
-//# sourceMappingURL=slider-thumb-element.js.map

package/dist/default/ui/slider/slider-thumb-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-thumb-element.js","names":["#ctx","#disconnect","#thumbPropsApplied"],"sources":["../../../../src/ui/slider/slider-thumb-element.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs } from '@videojs/core/dom';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { UIElement } from '../ui-element';\nimport { sliderContext } from './context';\n\nexport class SliderThumbElement extends UIElement {\n  static readonly tagName = 'media-slider-thumb';\n\n  readonly #ctx = new ContextConsumer(this, {\n    context: sliderContext,\n    subscribe: true,\n  });\n\n  #disconnect: AbortController | null = null;\n  #thumbPropsApplied = false;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.#disconnect = new AbortController();\n    this.#thumbPropsApplied = false;\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#disconnect?.abort();\n    this.#disconnect = null;\n    this.#thumbPropsApplied = false;\n  }\n\n  protected override update(_changed: PropertyValues): void {\n    super.update(_changed);\n\n    const ctx = this.#ctx.value;\n    if (!ctx) return;\n\n    // Apply keyboard and focus handlers once — they don't change per slider instance.\n    if (!this.#thumbPropsApplied && this.#disconnect) {\n      applyElementProps(this, ctx.thumbProps, { signal: this.#disconnect.signal });\n      this.#thumbPropsApplied = true;\n    }\n\n    // Apply ARIA attributes every update (values change as slider moves).\n    applyElementProps(this, ctx.thumbAttrs);\n\n    // Apply state data attributes.\n    applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n  }\n}\n"],"mappings":";;;;;AAOA,IAAa,qBAAb,cAAwC,UAAU;;EACtB,KAAA,UAAA;;CAE1B,OAAgB,IAAI,gBAAgB,MAAM;EACxC,SAAS;EACT,WAAW;CACb,CAAC;CAED,cAAsC;CACtC,qBAAqB;CAErB,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAKC,cAAc,IAAI,gBAAgB;EACvC,KAAKC,qBAAqB;CAC5B;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKD,aAAa,MAAM;EACxB,KAAKA,cAAc;EACnB,KAAKC,qBAAqB;CAC5B;CAEA,OAA0B,UAAgC;EACxD,MAAM,OAAO,QAAQ;EAErB,MAAM,MAAM,KAAKF,KAAK;EACtB,IAAI,CAAC,KAAK;EAGV,IAAI,CAAC,KAAKE,sBAAsB,KAAKD,aAAa;GAChD,kBAAkB,MAAM,IAAI,YAAY,EAAE,QAAQ,KAAKA,YAAY,OAAO,CAAC;GAC3E,KAAKC,qBAAqB;EAC5B;EAGA,kBAAkB,MAAM,IAAI,UAAU;EAGtC,oBAAoB,MAAM,IAAI,OAAO,IAAI,YAAY;CACvD;AACF"}

package/dist/default/ui/slider/slider-thumbnail-element.js

@@ -1,22 +0,0 @@
-import { sliderContext } from "./context.js";
-import { ThumbnailElement } from "../thumbnail/thumbnail-element.js";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-thumbnail-element.ts
-var SliderThumbnailElement = class extends ThumbnailElement {
-	static {
-		this.tagName = "media-slider-thumbnail";
-	}
-	#ctx = new ContextConsumer(this, {
-		context: sliderContext,
-		subscribe: true
-	});
-	update(changed) {
-		const ctx = this.#ctx.value;
-		if (ctx) this.time = ctx.pointerValue;
-		super.update(changed);
-	}
-};
-//#endregion
-export { SliderThumbnailElement };
-
-//# sourceMappingURL=slider-thumbnail-element.js.map

package/dist/default/ui/slider/slider-thumbnail-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-thumbnail-element.js","names":["#ctx"],"sources":["../../../../src/ui/slider/slider-thumbnail-element.ts"],"sourcesContent":["import type { PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ThumbnailElement } from '../thumbnail/thumbnail-element';\nimport { sliderContext } from './context';\n\n// @ts-expect-error TS2417 — tagName narrows to a different literal for custom element registration.\nexport class SliderThumbnailElement extends ThumbnailElement {\n  static override readonly tagName = 'media-slider-thumbnail';\n\n  readonly #ctx = new ContextConsumer(this, {\n    context: sliderContext,\n    subscribe: true,\n  });\n\n  protected override update(changed: PropertyValues): void {\n    const ctx = this.#ctx.value;\n\n    if (ctx) this.time = ctx.pointerValue;\n\n    super.update(changed);\n  }\n}\n"],"mappings":";;;;AAOA,IAAa,yBAAb,cAA4C,iBAAiB;;EACxB,KAAA,UAAA;;CAEnC,OAAgB,IAAI,gBAAgB,MAAM;EACxC,SAAS;EACT,WAAW;CACb,CAAC;CAED,OAA0B,SAA+B;EACvD,MAAM,MAAM,KAAKA,KAAK;EAEtB,IAAI,KAAK,KAAK,OAAO,IAAI;EAEzB,MAAM,OAAO,OAAO;CACtB;AACF"}

package/dist/default/ui/slider/slider-track-element.js

@@ -1,20 +0,0 @@
-import { ContextPartElement } from "../context-part-element.js";
-import { sliderContext } from "./context.js";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-track-element.ts
-var SliderTrackElement = class extends ContextPartElement {
-	constructor(..._args) {
-		super(..._args);
-		this.consumer = new ContextConsumer(this, {
-			context: sliderContext,
-			subscribe: true
-		});
-	}
-	static {
-		this.tagName = "media-slider-track";
-	}
-};
-//#endregion
-export { SliderTrackElement };
-
-//# sourceMappingURL=slider-track-element.js.map

package/dist/default/ui/slider/slider-track-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider-track-element.js","names":[],"sources":["../../../../src/ui/slider/slider-track-element.ts"],"sourcesContent":["import type { SliderState } from '@videojs/core';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { ContextPartElement } from '../context-part-element';\nimport { sliderContext } from './context';\n\nexport class SliderTrackElement extends ContextPartElement<SliderState> {\n  static readonly tagName = 'media-slider-track';\n\n  protected readonly consumer = new ContextConsumer(this, { context: sliderContext, subscribe: true });\n}\n"],"mappings":";;;;AAMA,IAAa,qBAAb,cAAwC,mBAAgC;;;EAGxC,KAAA,WAAA,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAe,WAAW;EAAK,CAAC;;;EAFzE,KAAA,UAAA;;AAG5B"}

package/dist/default/ui/slider/slider-value-element.js

@@ -1,38 +0,0 @@
-import { UIElement } from "../ui-element.js";
-import { sliderContext } from "./context.js";
-import { applyStateDataAttrs } from "@videojs/core/dom";
-import { ContextConsumer } from "@videojs/element/context";
-//#region src/ui/slider/slider-value-element.ts
-var SliderValueElement = class extends UIElement {
-	constructor(..._args) {
-		super(..._args);
-		this.type = "current";
-		this.#ctx = new ContextConsumer(this, {
-			context: sliderContext,
-			subscribe: true
-		});
-	}
-	static {
-		this.tagName = "media-slider-value";
-	}
-	static {
-		this.properties = { type: { type: String } };
-	}
-	#ctx;
-	connectedCallback() {
-		super.connectedCallback();
-		this.setAttribute("aria-live", "off");
-	}
-	update(_changed) {
-		super.update(_changed);
-		const ctx = this.#ctx.value;
-		if (!ctx) return;
-		const value = this.type === "pointer" ? ctx.pointerValue : ctx.state.value;
-		this.textContent = ctx.formatValue ? ctx.formatValue(value, this.type) : String(Math.round(value));
-		applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);
-	}
-};
-//#endregion
-export { SliderValueElement };
-
-//# sourceMappingURL=slider-value-element.js.map