@videojs/html 10.0.0-beta.21 → 10.0.0-beta.23

package/cdn/{compounds-CM_NP-ej.js → compounds-BHHGcL_P.js}

@@ -1,7 +1,8 @@
-import { A as ContextConsumer, C as isFunction, E as isUndefined, M as isEditableTarget, N as isInteractiveActivation, O as MediaElement, S as AbortControllerRegistry, T as isNumber, b as noop, c as timeFeature, d as playbackRateFeature, f as playbackFeature, g as controlsFeature, h as errorFeature, k as ContextProvider, l as textTrackFeature, m as fullscreenFeature, n as PlayerController, p as pipFeature, r as SnapshotController, s as volumeFeature, u as sourceFeature, v as bufferFeature, w as isNull, x as throwNoTargetError, y as createState } from "./create-player-Bi6WUwDZ.js";
+import { A as MediaElement, C as isMediaStreamTypeCapable, D as throwNoTargetError, E as noop, F as isInteractiveActivation, M as ContextConsumer, O as AbortControllerRegistry, P as isEditableTarget, S as isMediaSeekCapable, T as createState, _ as errorFeature, b as bufferFeature, c as timeFeature, d as remotePlaybackFeature, f as playbackRateFeature, g as fullscreenFeature, h as liveFeature, j as ContextProvider, l as textTrackFeature, m as pipFeature, n as PlayerController, p as playbackFeature, r as SnapshotController, s as volumeFeature, u as sourceFeature, v as controlsFeature, w as definePlayerFeature, x as isMediaBufferCapable } from "./create-player-B-gVAMdr.js";
 import { t as listen } from "./listen-CJT7C4kM.js";
 import { n as kebabCase, t as pick } from "./pick-D-wCJ3iA.js";
-import { i as createContext, o as safeDefine, r as playerContext, t as containerContext } from "./context-0rI_P6jf.js";
+import { a as isUndefined, c as playerContext, d as safeDefine, l as createContext, n as isNull, o as containerContext, r as isNumber, t as isFunction } from "./predicate-BOcV_HDG.js";
+import { t as MediaStreamTypes } from "./types-B_4Es-UH.js";
 
 //#region ../utils/dist/dom/direction.js
 /** Check whether an element's text direction is right-to-left. */
@@ -1284,6 +1285,35 @@ const VolumeSliderDataAttrs = {
 	availability: "data-availability"
 };
 
+//#endregion
+//#region ../core/dist/dev/dom/store/features/stream-type.js
+const streamTypeFeature = definePlayerFeature({
+	name: "streamType",
+	state: () => ({ streamType: MediaStreamTypes.UNKNOWN }),
+	attach({ target, signal, set }) {
+		const { media } = target;
+		if (isMediaStreamTypeCapable(media)) {
+			const sync = () => set({ streamType: media.streamType });
+			sync();
+			listen(media, "streamtypechange", sync, { signal });
+			return;
+		}
+		if (!isMediaSeekCapable(media)) return;
+		const detect = () => {
+			const { duration } = media;
+			if (duration === Number.POSITIVE_INFINITY) return MediaStreamTypes.LIVE;
+			if (Number.isFinite(duration) && duration > 0) return MediaStreamTypes.ON_DEMAND;
+			return MediaStreamTypes.UNKNOWN;
+		};
+		const sync = () => set({ streamType: detect() });
+		sync();
+		listen(media, "durationchange", sync, { signal });
+		listen(media, "loadedmetadata", sync, { signal });
+		listen(media, "emptied", sync, { signal });
+		if (isMediaBufferCapable(media)) listen(media, "progress", sync, { signal });
+	}
+});
+
 //#endregion
 //#region ../core/dist/dev/dom/store/selectors.js
 /** Select the buffer state (buffered ranges, percent buffered). */
@@ -1294,14 +1324,20 @@ const selectControls = createSelector(controlsFeature);
 const selectError = createSelector(errorFeature);
 /** Select the fullscreen state (fullscreen active, availability). */
 const selectFullscreen = createSelector(fullscreenFeature);
+/** Select the live state (`liveEdgeStart`, `targetLiveWindow`). */
+const selectLive = createSelector(liveFeature);
 /** Select the PiP state (picture-in-picture active, availability). */
 const selectPiP = createSelector(pipFeature);
 /** Select the playback state (paused, ended, play, pause, toggle). */
 const selectPlayback = createSelector(playbackFeature);
 /** Select the playback rate state (playbackRate, playbackRates, setPlaybackRate). */
 const selectPlaybackRate = createSelector(playbackRateFeature);
+/** Select the remote playback state (remote playback connection state, availability). */
+const selectRemotePlayback = createSelector(remotePlaybackFeature);
 /** Select the source state (src, type). */
 const selectSource = createSelector(sourceFeature);
+/** Select the stream type state (`'on-demand' | 'live' | 'unknown'`). */
+const selectStreamType = createSelector(streamTypeFeature);
 /** Select the text track state (chapters cues, thumbnail cues). */
 const selectTextTrack = createSelector(textTrackFeature);
 /** Select the time state (currentTime, duration, seek). */
@@ -2183,8 +2219,9 @@ function createSlider(options) {
 			});
 		},
 		onPointerUp(event) {
-			if (isNull(capturedPointerId)) return;
+			if (options.isDisabled()) return;
 			event.stopPropagation();
+			if (isNull(capturedPointerId)) return;
 			const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation(), cachedRTL);
 			throttledChange?.cancel();
 			options.onValueChange?.(percent);
@@ -2710,6 +2747,8 @@ var MediaButtonElement = class extends MediaElement {
 		this.disabled = false;
 		this.label = "";
 		this.hotkeyAction = void 0;
+		this.#disconnect = null;
+		this.#hotkeyRegistry = null;
 	}
 	static {
 		this.properties = {
@@ -2720,8 +2759,8 @@ var MediaButtonElement = class extends MediaElement {
 	get $state() {
 		return this.core.state;
 	}
-	#disconnect = null;
-	#hotkeyRegistry = null;
+	#disconnect;
+	#hotkeyRegistry;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;
@@ -2902,6 +2941,13 @@ var PopoverElement = class extends MediaElement {
 		this.openOnHover = PopoverCore.defaultProps.openOnHover;
 		this.delay = PopoverCore.defaultProps.delay;
 		this.closeDelay = PopoverCore.defaultProps.closeDelay;
+		this.#core = new PopoverCore();
+		this.#position = new PositionController(this);
+		this.#popover = null;
+		this.#snapshot = null;
+		this.#disconnect = null;
+		this.#triggerAbort = null;
+		this.#currentTrigger = null;
 	}
 	static {
 		this.tagName = "media-popover";
@@ -2935,13 +2981,13 @@ var PopoverElement = class extends MediaElement {
 			}
 		};
 	}
-	#core = new PopoverCore();
-	#position = new PositionController(this);
-	#popover = null;
-	#snapshot = null;
-	#disconnect = null;
-	#triggerAbort = null;
-	#currentTrigger = null;
+	#core;
+	#position;
+	#popover;
+	#snapshot;
+	#disconnect;
+	#triggerAbort;
+	#currentTrigger;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;
@@ -3094,6 +3140,14 @@ var TooltipElement = class extends MediaElement {
 		this.closeDelay = TooltipCore.defaultProps.closeDelay;
 		this.disableHoverablePopup = TooltipCore.defaultProps.disableHoverablePopup;
 		this.disabled = TooltipCore.defaultProps.disabled;
+		this.#core = new TooltipCore();
+		this.#groupConsumer = new ContextConsumer(this, { context: tooltipGroupContext });
+		this.#position = new PositionController(this);
+		this.#tooltip = null;
+		this.#snapshot = null;
+		this.#disconnect = null;
+		this.#triggerAbort = null;
+		this.#currentTrigger = null;
 	}
 	static {
 		this.tagName = "media-tooltip";
@@ -3119,14 +3173,14 @@ var TooltipElement = class extends MediaElement {
 			disabled: { type: Boolean }
 		};
 	}
-	#core = new TooltipCore();
-	#groupConsumer = new ContextConsumer(this, { context: tooltipGroupContext });
-	#position = new PositionController(this);
-	#tooltip = null;
-	#snapshot = null;
-	#disconnect = null;
-	#triggerAbort = null;
-	#currentTrigger = null;
+	#core;
+	#groupConsumer;
+	#position;
+	#tooltip;
+	#snapshot;
+	#disconnect;
+	#triggerAbort;
+	#currentTrigger;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;
@@ -3237,6 +3291,11 @@ var TooltipGroupElement = class extends MediaElement {
 		this.delay = TooltipGroupCore.defaultProps.delay;
 		this.closeDelay = TooltipGroupCore.defaultProps.closeDelay;
 		this.timeout = TooltipGroupCore.defaultProps.timeout;
+		this.#core = new TooltipGroupCore();
+		this.#provider = new ContextProvider(this, {
+			context: tooltipGroupContext,
+			initialValue: this.#core
+		});
 	}
 	static {
 		this.tagName = "media-tooltip-group";
@@ -3251,11 +3310,8 @@ var TooltipGroupElement = class extends MediaElement {
 			timeout: { type: Number }
 		};
 	}
-	#core = new TooltipGroupCore();
-	#provider = new ContextProvider(this, {
-		context: tooltipGroupContext,
-		initialValue: this.#core
-	});
+	#core;
+	#provider;
 	update(_changed) {
 		super.update(_changed);
 		this.#core.setProps(this);
@@ -3274,6 +3330,11 @@ var AlertDialogCloseElement = class extends MediaElement {
 	constructor(..._args) {
 		super(..._args);
 		this.disabled = false;
+		this.#ctx = new ContextConsumer(this, {
+			context: alertDialogContext,
+			subscribe: true
+		});
+		this.#disconnect = null;
 	}
 	static {
 		this.tagName = "media-alert-dialog-close";
@@ -3281,11 +3342,8 @@ var AlertDialogCloseElement = class extends MediaElement {
 	static {
 		this.properties = { disabled: { type: Boolean } };
 	}
-	#ctx = new ContextConsumer(this, {
-		context: alertDialogContext,
-		subscribe: true
-	});
-	#disconnect = null;
+	#ctx;
+	#disconnect;
 	connectedCallback() {
 		super.connectedCallback();
 		this.#disconnect = new AbortController();
@@ -3466,7 +3524,10 @@ var ErrorDialogElement = class extends MediaElement {
 		const errorState = this.#errorState.value;
 		const hasError = Boolean(errorState?.error);
 		const { active: isOpen } = this.#dialog.input.current;
-		if (errorState?.error) this.#lastErrorMessage = errorState.error.message?.trim() || null;
+		if (errorState?.error) {
+			const message = errorState.error.message?.trim();
+			this.#lastErrorMessage = message || null;
+		}
 		const desc = this.querySelector("media-alert-dialog-description");
 		if (desc) desc.textContent = this.#lastErrorMessage ?? FALLBACK_MESSAGE;
 		if (hasError && !isOpen) this.#dialog.open();
@@ -3529,6 +3590,12 @@ var SliderPreviewElement = class extends MediaElement {
 	constructor(..._args) {
 		super(..._args);
 		this.overflow = "clamp";
+		this.#ctx = new ContextConsumer(this, {
+			context: sliderContext,
+			subscribe: true
+		});
+		this.#resizeObserver = null;
+		this.#width = 0;
 	}
 	static {
 		this.tagName = "media-slider-preview";
@@ -3536,12 +3603,9 @@ var SliderPreviewElement = class extends MediaElement {
 	static {
 		this.properties = { overflow: { type: String } };
 	}
-	#ctx = new ContextConsumer(this, {
-		context: sliderContext,
-		subscribe: true
-	});
-	#resizeObserver = null;
-	#width = 0;
+	#ctx;
+	#resizeObserver;
+	#width;
 	connectedCallback() {
 		super.connectedCallback();
 		this.#resizeObserver = new ResizeObserver(([entry]) => {
@@ -3630,16 +3694,21 @@ var ThumbnailElement = class extends MediaElement {
 			}
 		};
 	}
-	#core = new ThumbnailCore();
-	#img = document.createElement("img");
-	#textTracks = new PlayerController(this, playerContext, selectTextTrack);
-	#thumbnails = [];
+	#core;
+	#img;
+	#textTracks;
+	#thumbnails;
 	#externalThumbnails;
 	#lastTextTrack;
-	#api = null;
+	#api;
 	constructor() {
 		super();
 		this.time = 0;
+		this.#core = new ThumbnailCore();
+		this.#img = document.createElement("img");
+		this.#textTracks = new PlayerController(this, playerContext, selectTextTrack);
+		this.#thumbnails = [];
+		this.#api = null;
 		const shadow = this.attachShadow({ mode: "open" });
 		const style = document.createElement("style");
 		style.textContent = SHADOW_CSS;
@@ -3771,6 +3840,10 @@ var SliderValueElement = class extends MediaElement {
 	constructor(..._args) {
 		super(..._args);
 		this.type = "current";
+		this.#ctx = new ContextConsumer(this, {
+			context: sliderContext,
+			subscribe: true
+		});
 	}
 	static {
 		this.tagName = "media-slider-value";
@@ -3778,10 +3851,7 @@ var SliderValueElement = class extends MediaElement {
 	static {
 		this.properties = { type: { type: String } };
 	}
-	#ctx = new ContextConsumer(this, {
-		context: sliderContext,
-		subscribe: true
-	});
+	#ctx;
 	connectedCallback() {
 		super.connectedCallback();
 		this.setAttribute("aria-live", "off");
@@ -3804,6 +3874,10 @@ var TimeElement = class extends MediaElement {
 		this.type = TimeCore.defaultProps.type;
 		this.negativeSign = TimeCore.defaultProps.negativeSign;
 		this.label = TimeCore.defaultProps.label;
+		this.#core = new TimeCore();
+		this.#state = new PlayerController(this, playerContext, selectTime);
+		this.#signSpan = document.createElement("span");
+		this.#textNode = document.createTextNode("");
 	}
 	static {
 		this.tagName = "media-time";
@@ -3818,10 +3892,10 @@ var TimeElement = class extends MediaElement {
 			label: { type: String }
 		};
 	}
-	#core = new TimeCore();
-	#state = new PlayerController(this, playerContext, selectTime);
-	#signSpan = document.createElement("span");
-	#textNode = document.createTextNode("");
+	#core;
+	#state;
+	#signSpan;
+	#textNode;
 	connectedCallback() {
 		super.connectedCallback();
 		if (!this.#signSpan.parentNode) {
@@ -3883,6 +3957,12 @@ var TimeSliderElement = class extends MediaElement {
 		this.orientation = TimeSliderCore.defaultProps.orientation;
 		this.disabled = TimeSliderCore.defaultProps.disabled;
 		this.thumbAlignment = TimeSliderCore.defaultProps.thumbAlignment;
+		this.#core = new TimeSliderCore();
+		this.#provider = new ContextProvider(this, { context: sliderContext });
+		this.#timeState = new PlayerController(this, playerContext, selectTime);
+		this.#bufferState = new PlayerController(this, playerContext, selectBuffer);
+		this.#slider = null;
+		this.#disconnect = null;
 	}
 	static {
 		this.tagName = "media-time-slider";
@@ -3907,12 +3987,12 @@ var TimeSliderElement = class extends MediaElement {
 			}
 		};
 	}
-	#core = new TimeSliderCore();
-	#provider = new ContextProvider(this, { context: sliderContext });
-	#timeState = new PlayerController(this, playerContext, selectTime);
-	#bufferState = new PlayerController(this, playerContext, selectBuffer);
-	#slider = null;
-	#disconnect = null;
+	#core;
+	#provider;
+	#timeState;
+	#bufferState;
+	#slider;
+	#disconnect;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;
@@ -4005,6 +4085,11 @@ var VolumeSliderElement = class extends MediaElement {
 		this.orientation = VolumeSliderCore.defaultProps.orientation;
 		this.disabled = VolumeSliderCore.defaultProps.disabled;
 		this.thumbAlignment = VolumeSliderCore.defaultProps.thumbAlignment;
+		this.#core = new VolumeSliderCore();
+		this.#provider = new ContextProvider(this, { context: sliderContext });
+		this.#volumeState = new PlayerController(this, playerContext, selectVolume);
+		this.#slider = null;
+		this.#disconnect = null;
 	}
 	static {
 		this.tagName = "media-volume-slider";
@@ -4029,11 +4114,11 @@ var VolumeSliderElement = class extends MediaElement {
 			}
 		};
 	}
-	#core = new VolumeSliderCore();
-	#provider = new ContextProvider(this, { context: sliderContext });
-	#volumeState = new PlayerController(this, playerContext, selectVolume);
-	#slider = null;
-	#disconnect = null;
+	#core;
+	#provider;
+	#volumeState;
+	#slider;
+	#disconnect;
 	connectedCallback() {
 		super.connectedCallback();
 		if (this.destroyed) return;
@@ -4150,5 +4235,5 @@ function defineVolumeSlider() {
 }
 
 //#endregion
-export { selectVolume as C, selectTime as S, selectFullscreen as _, defineVolumeSlider as a, selectPlaybackRate as b, SeekButtonElement as c, PlayButtonElement as d, MuteButtonElement as f, createHotkey as g, logMissingFeature as h, defineTimeSlider as i, PopoverElement as l, applyStateDataAttrs as m, defineErrorDialog as n, TooltipGroupElement as o, MediaButtonElement as p, defineTime as r, TooltipElement as s, defineControls as t, PlaybackRateButtonElement as u, selectPiP as v, defaults as w, selectTextTrack as x, selectPlayback as y };
-//# sourceMappingURL=compounds-CM_NP-ej.js.map
+export { selectTime as C, selectTextTrack as S, defaults as T, selectFullscreen as _, defineVolumeSlider as a, selectPlaybackRate as b, SeekButtonElement as c, PlayButtonElement as d, MuteButtonElement as f, createHotkey as g, logMissingFeature as h, defineTimeSlider as i, PopoverElement as l, applyStateDataAttrs as m, defineErrorDialog as n, TooltipGroupElement as o, MediaButtonElement as p, defineTime as r, TooltipElement as s, defineControls as t, PlaybackRateButtonElement as u, selectPiP as v, selectVolume as w, selectRemotePlayback as x, selectPlayback as y };
+//# sourceMappingURL=compounds-BHHGcL_P.js.map