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

package/cdn/{create-player-BKLw7l1a.js → create-player-B-gVAMdr.js}

@@ -1,7 +1,7 @@
 import { t as listen } from "./listen-CJT7C4kM.js";
-import { a as ContextRequestEvent, n as mediaContext, r as playerContext, t as containerContext } from "./context-0rI_P6jf.js";
-import { t as anyAbortSignal } from "./abort-DsTff8mS.js";
-import { t as shallowEqual } from "./shallow-equal-Daj3-_LC.js";
+import { a as isUndefined, c as playerContext, i as isObject, n as isNull, o as containerContext, s as mediaContext, t as isFunction, u as ContextRequestEvent } from "./predicate-BOcV_HDG.js";
+import { t as anyAbortSignal } from "./abort-DQxwCs92.js";
+import { t as shallowEqual } from "./shallow-equal-DSpD9PMp.js";
 
 //#region ../utils/dist/dom/event.js
 /** Resolve the deepest event target, preferring composedPath for shadow DOM. */
@@ -219,8 +219,8 @@ var ReactiveElement = class extends HTMLElement {
 	static get observedAttributes() {
 		return [...resolve(this).attrToProp.keys()];
 	}
-	#controllers = /* @__PURE__ */ new Set();
-	#changedProperties = /* @__PURE__ */ new Map();
+	#controllers;
+	#changedProperties;
 	#instanceProperties;
 	/**
 	* Promise that gates the first update until `connectedCallback`. Also
@@ -231,6 +231,8 @@ var ReactiveElement = class extends HTMLElement {
 	#updatePromise;
 	constructor() {
 		super();
+		this.#controllers = /* @__PURE__ */ new Set();
+		this.#changedProperties = /* @__PURE__ */ new Map();
 		this.isUpdatePending = false;
 		this.hasUpdated = false;
 		this.#updatePromise = new Promise((res) => this.enableUpdating = res);
@@ -734,27 +736,6 @@ var MediaContainerElement = class extends ContainerMixin(MediaElement) {
 	};
 };
 
-//#endregion
-//#region ../utils/dist/predicate/predicate.js
-function isNumber(value) {
-	return typeof value === "number";
-}
-function isFunction(value) {
-	return typeof value === "function";
-}
-function isNull(value) {
-	return value === null;
-}
-function isUndefined(value) {
-	return typeof value === "undefined";
-}
-/**
-* Check if a value is an object, excluding null.
-*/
-function isObject(value) {
-	return value !== null && typeof value === "object";
-}
-
 //#endregion
 //#region ../store/dist/dev/core/abort-controller-registry.js
 var AbortControllerRegistry = class {
@@ -1064,6 +1045,12 @@ function isMediaTextTrackCapable(value) {
 function isMediaRemotePlaybackCapable(value) {
 	return isObject(value) && "remote" in value && isObject(value.remote);
 }
+function isMediaStreamTypeCapable(value) {
+	return isObject(value) && "streamType" in value;
+}
+function isMediaLiveCapable(value) {
+	return isObject(value) && "liveEdgeStart" in value && "targetLiveWindow" in value;
+}
 function isQuerySelectorAllCapable(value) {
 	return isObject(value) && "querySelectorAll" in value && isFunction(value.querySelectorAll);
 }
@@ -1089,112 +1076,6 @@ const bufferFeature = definePlayerFeature({
 	}
 });
 
-//#endregion
-//#region ../core/dist/dev/dom/presentation/cast.js
-function resolveRemote(media) {
-	const target = media;
-	if (isObject(target.remote) && "state" in target.remote && "prompt" in target.remote) return target.remote;
-}
-function isCastConnected(media) {
-	return resolveRemote(media)?.state === "connected";
-}
-function isCastConnecting(media) {
-	return resolveRemote(media)?.state === "connecting";
-}
-async function requestCast(media) {
-	const remote = resolveRemote(media);
-	if (!remote) throw new DOMException("Remote playback not supported", "NotSupportedError");
-	return remote.prompt();
-}
-
-//#endregion
-//#region ../core/dist/dev/dom/presentation/fullscreen.js
-function isFullscreenEnabled() {
-	const doc = document;
-	if (doc.fullscreenEnabled || doc.webkitFullscreenEnabled) return true;
-	return isFunction(document.createElement("video").webkitEnterFullscreen);
-}
-function getFullscreenElement() {
-	const doc = document;
-	return doc.fullscreenElement ?? doc.webkitFullscreenElement ?? null;
-}
-function isFullscreenElement(container, media) {
-	if (media instanceof HTMLMediaElement) {
-		const video = media;
-		if (video.webkitDisplayingFullscreen && video.webkitPresentationMode === "fullscreen") return true;
-	}
-	const target = container ?? media;
-	if (getFullscreenElement() === target) return true;
-	if (target instanceof Element) try {
-		return target.matches(":fullscreen");
-	} catch {
-		return false;
-	}
-	return false;
-}
-async function requestFullscreen(container, media) {
-	const doc = document;
-	if (container && (doc.fullscreenEnabled || doc.webkitFullscreenEnabled)) {
-		const el = container;
-		if (isFunction(el.requestFullscreen)) return el.requestFullscreen();
-		if (isFunction(el.webkitRequestFullscreen)) return el.webkitRequestFullscreen();
-	}
-	if (media instanceof HTMLMediaElement) {
-		const video = media;
-		if (isFunction(video.webkitEnterFullscreen)) {
-			video.webkitEnterFullscreen();
-			return;
-		}
-		if (isFunction(media.requestFullscreen)) return media.requestFullscreen();
-	}
-	throw new DOMException("Fullscreen not supported", "NotSupportedError");
-}
-async function exitFullscreen(media) {
-	const doc = document;
-	if (media instanceof HTMLMediaElement) {
-		const video = media;
-		if (isFunction(video.webkitExitFullscreen) && video.webkitDisplayingFullscreen) {
-			video.webkitExitFullscreen();
-			return;
-		}
-	}
-	if (isFunction(doc.exitFullscreen)) return doc.exitFullscreen();
-	if (isFunction(doc.webkitExitFullscreen)) return doc.webkitExitFullscreen();
-}
-
-//#endregion
-//#region ../core/dist/dev/dom/store/features/cast.js
-const castFeature = definePlayerFeature({
-	name: "cast",
-	state: ({ target }) => ({
-		castState: "disconnected",
-		castAvailability: "unavailable",
-		async toggleCast() {
-			const { media, container } = target();
-			if (isCastConnected(media)) return requestCast(media);
-			if (isFullscreenElement(container, media)) await exitFullscreen();
-			return requestCast(media);
-		}
-	}),
-	attach({ target, signal, set }) {
-		const { media } = target;
-		if (!isMediaRemotePlaybackCapable(media)) return;
-		const syncState = () => set({ castState: media.remote.state });
-		syncState();
-		listen(media.remote, "connect", syncState, { signal });
-		listen(media.remote, "connecting", syncState, { signal });
-		listen(media.remote, "disconnect", syncState, { signal });
-		media.remote.watchAvailability((available) => {
-			set({ castAvailability: available ? "available" : "unavailable" });
-		}).catch(() => {
-			set({ castAvailability: "unsupported" });
-		});
-		signal.addEventListener("abort", () => {
-			media.remote?.cancelWatchAvailability().catch(() => {});
-		});
-	}
-});
-
 //#endregion
 //#region ../core/dist/dev/dom/gesture/region.js
 /**
@@ -1326,6 +1207,24 @@ function getActiveRegions(bindings, type, pointerType) {
 	return regions;
 }
 
+//#endregion
+//#region ../core/dist/dev/dom/presentation/remote-playback.js
+function resolveRemote(media) {
+	const target = media;
+	if (isObject(target.remote) && "state" in target.remote && "prompt" in target.remote) return target.remote;
+}
+function isRemotePlaybackConnected(media) {
+	return resolveRemote(media)?.state === "connected";
+}
+function isRemotePlaybackConnecting(media) {
+	return resolveRemote(media)?.state === "connecting";
+}
+async function requestRemotePlayback(media) {
+	const remote = resolveRemote(media);
+	if (!remote) throw new DOMException("Remote playback not supported", "NotSupportedError");
+	return remote.prompt();
+}
+
 //#endregion
 //#region ../core/dist/dev/dom/store/features/controls.js
 const IDLE_DELAY = 2e3;
@@ -1351,7 +1250,7 @@ const controlsFeature = definePlayerFeature({
 			return;
 		}
 		const computeVisible = (userActive) => {
-			return userActive || media.paused || isCastConnected(media) || isCastConnecting(media);
+			return userActive || media.paused || isRemotePlaybackConnected(media) || isRemotePlaybackConnecting(media);
 		};
 		let idleTimer;
 		function clearIdle() {
@@ -1441,11 +1340,61 @@ const errorFeature = definePlayerFeature({
 });
 
 //#endregion
-//#region ../core/dist/dev/dom/presentation/pip.js
-function resolveMediaTarget(media) {
-	const target = media.target;
-	return target instanceof HTMLMediaElement ? target : media;
+//#region ../core/dist/dev/dom/presentation/fullscreen.js
+function isFullscreenEnabled() {
+	const doc = document;
+	if (doc.fullscreenEnabled || doc.webkitFullscreenEnabled) return true;
+	return isFunction(document.createElement("video").webkitSetPresentationMode);
 }
+function getFullscreenElement() {
+	const doc = document;
+	return doc.fullscreenElement ?? doc.webkitFullscreenElement ?? null;
+}
+function matchesFullscreen(element) {
+	if (!(element instanceof Element)) return false;
+	try {
+		return element.matches(":fullscreen");
+	} catch {
+		return false;
+	}
+}
+function isFullscreen(container, media) {
+	if (media.webkitPresentationMode === "fullscreen") return true;
+	const fullscreenElement = getFullscreenElement();
+	if (fullscreenElement && (fullscreenElement === container || fullscreenElement === media)) return true;
+	if (matchesFullscreen(container) || matchesFullscreen(media)) return true;
+	return media.isFullscreen ?? false;
+}
+async function requestFullscreen(container, media) {
+	const doc = document;
+	if (container && (doc.fullscreenEnabled || doc.webkitFullscreenEnabled)) {
+		const el = container;
+		if (isFunction(el.requestFullscreen)) return el.requestFullscreen();
+		if (isFunction(el.webkitRequestFullscreen)) return el.webkitRequestFullscreen();
+	}
+	const webkitVideo = media;
+	if (isFunction(webkitVideo.webkitSetPresentationMode)) {
+		webkitVideo.webkitSetPresentationMode("fullscreen");
+		return;
+	}
+	const video = media;
+	if (isFunction(video.requestFullscreen)) return video.requestFullscreen();
+}
+async function exitFullscreen(media) {
+	const doc = document;
+	const webkitVideo = media;
+	if (webkitVideo.webkitPresentationMode === "fullscreen" && isFunction(webkitVideo.webkitSetPresentationMode)) {
+		webkitVideo.webkitSetPresentationMode("inline");
+		return;
+	}
+	if (isFunction(doc.exitFullscreen)) return doc.exitFullscreen();
+	if (isFunction(doc.webkitExitFullscreen)) return doc.webkitExitFullscreen();
+	const video = media;
+	if (isFunction(video.exitFullscreen)) return video.exitFullscreen();
+}
+
+//#endregion
+//#region ../core/dist/dev/dom/presentation/pip.js
 function isPictureInPictureEnabled() {
 	if (document.pictureInPictureEnabled) {
 		const isSafari = /.*Version\/.*Safari\/.*/.test(navigator.userAgent);
@@ -1454,38 +1403,29 @@ function isPictureInPictureEnabled() {
 	}
 	return isFunction(document.createElement("video").webkitSetPresentationMode);
 }
-function isPictureInPictureElement(media) {
-	const target = resolveMediaTarget(media);
-	if (document.pictureInPictureElement === target) return true;
-	if (target instanceof HTMLVideoElement) return target.webkitPresentationMode === "picture-in-picture";
-	return false;
+function isPictureInPicture(media) {
+	if (media.webkitPresentationMode === "picture-in-picture") return true;
+	if (document.pictureInPictureElement === media) return true;
+	return media.isPictureInPicture ?? false;
 }
 async function requestPictureInPicture(media) {
-	const target = resolveMediaTarget(media);
-	if (!(target instanceof HTMLVideoElement)) throw new DOMException("Picture-in-Picture not supported", "NotSupportedError");
-	const video = target;
-	if (isFunction(video.webkitSetPresentationMode)) {
-		video.webkitSetPresentationMode("picture-in-picture");
-		return;
-	}
-	if (isFunction(video.requestPictureInPicture)) {
-		await video.requestPictureInPicture();
+	const webkitVideo = media;
+	if (isFunction(webkitVideo.webkitSetPresentationMode)) {
+		webkitVideo.webkitSetPresentationMode("picture-in-picture");
 		return;
 	}
-	throw new DOMException("Picture-in-Picture not supported", "NotSupportedError");
+	const video = media;
+	if (isFunction(video.requestPictureInPicture)) return video.requestPictureInPicture();
 }
 async function exitPictureInPicture(media) {
-	if (media) {
-		const target = resolveMediaTarget(media);
-		if (target instanceof HTMLVideoElement) {
-			const video = target;
-			if (isFunction(video.webkitSetPresentationMode) && video.webkitPresentationMode === "picture-in-picture") {
-				video.webkitSetPresentationMode("inline");
-				return;
-			}
-		}
+	const webkitVideo = media;
+	if (webkitVideo.webkitPresentationMode === "picture-in-picture" && isFunction(webkitVideo.webkitSetPresentationMode)) {
+		webkitVideo.webkitSetPresentationMode("inline");
+		return;
 	}
 	if (isFunction(document.exitPictureInPicture)) return document.exitPictureInPicture();
+	const video = media;
+	if (isFunction(video.exitPictureInPicture)) return video.exitPictureInPicture();
 }
 
 //#endregion
@@ -1497,7 +1437,7 @@ const fullscreenFeature = definePlayerFeature({
 		fullscreenAvailability: "unavailable",
 		async requestFullscreen() {
 			const { media, container } = target();
-			if (isPictureInPictureElement(media)) await exitPictureInPicture(media);
+			if (isPictureInPicture(media)) await exitPictureInPicture(media);
 			return requestFullscreen(container, media);
 		},
 		async exitFullscreen() {
@@ -1506,15 +1446,15 @@ const fullscreenFeature = definePlayerFeature({
 		},
 		async toggleFullscreen() {
 			const { media, container } = target();
-			if (isFullscreenElement(container, media)) return exitFullscreen(media);
-			if (isPictureInPictureElement(media)) await exitPictureInPicture(media);
+			if (isFullscreen(container, media)) return exitFullscreen(media);
+			if (isPictureInPicture(media)) await exitPictureInPicture(media);
 			return requestFullscreen(container, media);
 		}
 	}),
 	attach({ target, signal, set }) {
 		const { media, container } = target;
 		set({ fullscreenAvailability: isFullscreenEnabled() ? "available" : "unsupported" });
-		const sync = () => set({ fullscreen: isFullscreenElement(container, media) });
+		const sync = () => set({ fullscreen: isFullscreen(container, media) });
 		sync();
 		listen(document, "fullscreenchange", sync, { signal });
 		listen(document, "webkitfullscreenchange", sync, { signal });
@@ -1522,6 +1462,49 @@ const fullscreenFeature = definePlayerFeature({
 	}
 });
 
+//#endregion
+//#region ../core/dist/dev/dom/store/features/live.js
+/**
+* Player feature exposing `liveEdgeStart` and `targetLiveWindow` in store
+* state for media that implements `MediaLiveCapability` (currently
+* `HlsMedia` and its delegates).
+*
+* - `liveEdgeStart` — presentation time marking the start of the Live Edge
+*   Window. Playing at the live edge when `currentTime >= liveEdgeStart`.
+*   `NaN` when the stream isn't live or the value is unknown.
+* - `targetLiveWindow` — `0` for standard latency live, `Infinity` for DVR,
+*   `NaN` for on-demand or unknown.
+*
+* Included by the {@link liveVideoFeatures} and {@link liveAudioFeatures}
+* presets; apps can also compose it into a custom preset.
+*
+* @see https://github.com/video-dev/media-ui-extensions/blob/main/proposals/0007-live-edge.md
+*/
+const liveFeature = definePlayerFeature({
+	name: "live",
+	state: () => ({
+		liveEdgeStart: NaN,
+		targetLiveWindow: NaN
+	}),
+	attach({ target, signal, set }) {
+		const { media } = target;
+		if (!isMediaLiveCapable(media)) return;
+		const sync = () => set({
+			liveEdgeStart: media.liveEdgeStart,
+			targetLiveWindow: media.targetLiveWindow
+		});
+		sync();
+		listen(media, "targetlivewindowchange", sync, { signal });
+		listen(media, "streamtypechange", sync, { signal });
+		listen(media, "loadedmetadata", sync, { signal });
+		listen(media, "canplay", sync, { signal });
+		listen(media, "progress", sync, { signal });
+		listen(media, "durationchange", sync, { signal });
+		listen(media, "timeupdate", sync, { signal });
+		listen(media, "emptied", sync, { signal });
+	}
+});
+
 //#endregion
 //#region ../core/dist/dev/dom/store/features/pip.js
 const pipFeature = definePlayerFeature({
@@ -1531,7 +1514,7 @@ const pipFeature = definePlayerFeature({
 		pipAvailability: "unavailable",
 		async requestPictureInPicture() {
 			const { media, container } = target();
-			if (isFullscreenElement(container, media)) await exitFullscreen();
+			if (isFullscreen(container, media)) await exitFullscreen(media);
 			return requestPictureInPicture(media);
 		},
 		async exitPictureInPicture() {
@@ -1540,15 +1523,15 @@ const pipFeature = definePlayerFeature({
 		},
 		async togglePictureInPicture() {
 			const { media, container } = target();
-			if (isPictureInPictureElement(media)) return exitPictureInPicture(media);
-			if (isFullscreenElement(container, media)) await exitFullscreen();
+			if (isPictureInPicture(media)) return exitPictureInPicture(media);
+			if (isFullscreen(container, media)) await exitFullscreen(media);
 			return requestPictureInPicture(media);
 		}
 	}),
 	attach({ target, signal, set }) {
 		const { media } = target;
 		set({ pipAvailability: isPictureInPictureEnabled() ? "available" : "unsupported" });
-		const sync = () => set({ pip: isPictureInPictureElement(media) });
+		const sync = () => set({ pip: isPictureInPicture(media) });
 		sync();
 		listen(media, "enterpictureinpicture", sync, { signal });
 		listen(media, "leavepictureinpicture", sync, { signal });
@@ -1634,6 +1617,39 @@ const playbackRateFeature = definePlayerFeature({
 	}
 });
 
+//#endregion
+//#region ../core/dist/dev/dom/store/features/remote-playback.js
+const remotePlaybackFeature = definePlayerFeature({
+	name: "remotePlayback",
+	state: ({ target }) => ({
+		remotePlaybackState: "disconnected",
+		remotePlaybackAvailability: "unavailable",
+		async toggleRemotePlayback() {
+			const { media, container } = target();
+			if (isRemotePlaybackConnected(media)) return requestRemotePlayback(media);
+			if (isFullscreen(container, media)) await exitFullscreen(media);
+			return requestRemotePlayback(media);
+		}
+	}),
+	attach({ target, signal, set }) {
+		const { media } = target;
+		if (!isMediaRemotePlaybackCapable(media)) return;
+		const syncState = () => set({ remotePlaybackState: media.remote.state });
+		syncState();
+		listen(media.remote, "connect", syncState, { signal });
+		listen(media.remote, "connecting", syncState, { signal });
+		listen(media.remote, "disconnect", syncState, { signal });
+		media.remote.watchAvailability((available) => {
+			set({ remotePlaybackAvailability: available ? "available" : "unavailable" });
+		}).catch(() => {
+			set({ remotePlaybackAvailability: "unsupported" });
+		});
+		signal.addEventListener("abort", () => {
+			media.remote?.cancelWatchAvailability().catch(() => {});
+		});
+	}
+});
+
 //#endregion
 //#region ../core/dist/dev/dom/store/features/source.js
 const sourceFeature = definePlayerFeature({
@@ -1767,22 +1783,31 @@ const timeFeature = definePlayerFeature({
 	attach({ target, signal, set, get }) {
 		const { media } = target;
 		if (!isMediaSeekCapable(media)) return;
+		const resolveDuration = () => {
+			const { duration } = media;
+			if (duration === Number.POSITIVE_INFINITY && isMediaBufferCapable(media)) {
+				const { seekable } = media;
+				return seekable.length > 0 ? seekable.end(seekable.length - 1) : 0;
+			}
+			return Number.isFinite(duration) ? duration : 0;
+		};
 		const sync = () => set({
 			currentTime: media.currentTime,
-			duration: Number.isFinite(media.duration) ? media.duration : 0,
+			duration: resolveDuration(),
 			seeking: media.seeking
 		});
-		const onTimeUpdate = () => {
+		const syncUnlessSeeking = () => {
 			if (get().seeking) return;
 			sync();
 		};
 		sync();
-		listen(media, "timeupdate", onTimeUpdate, { signal });
+		listen(media, "timeupdate", syncUnlessSeeking, { signal });
 		listen(media, "durationchange", sync, { signal });
 		listen(media, "seeking", sync, { signal });
 		listen(media, "seeked", sync, { signal });
 		listen(media, "loadedmetadata", sync, { signal });
 		listen(media, "emptied", sync, { signal });
+		listen(media, "progress", syncUnlessSeeking, { signal });
 	}
 });
 
@@ -1848,7 +1873,7 @@ const videoFeatures = [
 	bufferFeature,
 	fullscreenFeature,
 	pipFeature,
-	castFeature,
+	remotePlaybackFeature,
 	controlsFeature,
 	textTrackFeature,
 	errorFeature
@@ -2242,5 +2267,5 @@ function createPlayer(config) {
 }
 
 //#endregion
-export { ContextProvider as A, AbortControllerRegistry as C, isUndefined as D, isNumber as E, ReactiveElement as M, isEditableTarget as N, MediaContainerElement as O, isInteractiveActivation as P, throwNoTargetError as S, isNull as T, getGestureCoordinator as _, backgroundFeatures as a, createState as b, timeFeature as c, playbackRateFeature as d, playbackFeature as f, controlsFeature as g, errorFeature as h, audioFeatures as i, ContextConsumer as j, MediaElement as k, textTrackFeature as l, fullscreenFeature as m, PlayerController as n, videoFeatures as o, pipFeature as p, SnapshotController as r, volumeFeature as s, createPlayer as t, sourceFeature as u, castFeature as v, isFunction as w, noop as x, bufferFeature as y };
-//# sourceMappingURL=create-player-BKLw7l1a.js.map
+export { MediaElement as A, isMediaStreamTypeCapable as C, throwNoTargetError as D, noop as E, isInteractiveActivation as F, ContextConsumer as M, ReactiveElement as N, AbortControllerRegistry as O, isEditableTarget as P, isMediaSeekCapable as S, createState as T, errorFeature as _, backgroundFeatures as a, bufferFeature as b, timeFeature as c, remotePlaybackFeature as d, playbackRateFeature as f, fullscreenFeature as g, liveFeature as h, audioFeatures as i, ContextProvider as j, MediaContainerElement as k, textTrackFeature as l, pipFeature as m, PlayerController as n, videoFeatures as o, playbackFeature as p, SnapshotController as r, volumeFeature as s, createPlayer as t, sourceFeature as u, controlsFeature as v, definePlayerFeature as w, isMediaBufferCapable as x, getGestureCoordinator as y };
+//# sourceMappingURL=create-player-B-gVAMdr.js.map