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

package/cdn/{video-host-ycP7ckxU.js → video-host-BtD61mpF.js}

@@ -282,12 +282,53 @@ var HTMLMediaElementHost = class extends EventTarget {
 	get target() {
 		return this.#target;
 	}
+	attach(target) {
+		if (!target || this.#target === target) return;
+		this.#target = target;
+		for (const type of this.#types) target.addEventListener(type, this.#forwardEvent);
+	}
+	detach() {
+		if (!this.#target) return;
+		for (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);
+		this.#target = null;
+	}
+	querySelectorAll(selectors) {
+		return this.target?.querySelectorAll(selectors) ?? [];
+	}
+	querySelector(selectors) {
+		return this.target?.querySelector(selectors) ?? null;
+	}
+	addEventListener(type, listener, options) {
+		if (!this.#types.has(type)) {
+			this.#types.add(type);
+			this.target?.addEventListener(type, this.#forwardEvent);
+		}
+		super.addEventListener(type, listener, options);
+	}
+	removeEventListener(type, listener, options) {
+		super.removeEventListener(type, listener, options);
+	}
+	#forwardEvent = (event) => {
+		this.dispatchEvent(new event.constructor(event.type, event));
+	};
+	get title() {
+		return this.target?.title ?? "";
+	}
+	set title(value) {
+		if (this.target) this.target.title = value;
+	}
 	get paused() {
 		return this.target?.paused ?? true;
 	}
 	get ended() {
 		return this.target?.ended ?? false;
 	}
+	get loop() {
+		return this.target?.loop ?? false;
+	}
+	set loop(value) {
+		if (this.target) this.target.loop = value;
+	}
 	play() {
 		return this.target?.play() ?? Promise.reject();
 	}
@@ -351,37 +392,32 @@ var HTMLMediaElementHost = class extends EventTarget {
 	get textTracks() {
 		return this.target?.textTracks ?? [];
 	}
-	attach(target) {
-		if (!target || this.#target === target) return;
-		this.#target = target;
-		for (const type of this.#types) target.addEventListener(type, this.#forwardEvent);
-	}
-	detach() {
-		if (!this.#target) return;
-		for (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);
-		this.#target = null;
+	get remote() {
+		return this.target?.remote;
 	}
-	querySelectorAll(selectors) {
-		return this.target?.querySelectorAll(selectors) ?? [];
+	get disableRemotePlayback() {
+		return this.target?.disableRemotePlayback ?? false;
 	}
-	addEventListener(type, listener, options) {
-		if (!this.#types.has(type)) {
-			this.#types.add(type);
-			this.target?.addEventListener(type, this.#forwardEvent);
-		}
-		super.addEventListener(type, listener, options);
-	}
-	removeEventListener(type, listener, options) {
-		super.removeEventListener(type, listener, options);
+	set disableRemotePlayback(value) {
+		if (this.target) this.target.disableRemotePlayback = value;
 	}
-	#forwardEvent = (event) => {
-		this.dispatchEvent(new event.constructor(event.type, event));
-	};
 };
 
 //#endregion
 //#region ../core/dist/dev/dom/media/video-host.js
 var HTMLVideoElementHost = class extends HTMLMediaElementHost {
+	get poster() {
+		return this.target?.poster ?? "";
+	}
+	set poster(value) {
+		if (this.target) this.target.poster = value;
+	}
+	get webkitDisplayingFullscreen() {
+		return this.target?.webkitDisplayingFullscreen ?? false;
+	}
+	get webkitPresentationMode() {
+		return this.target?.webkitPresentationMode ?? "inline";
+	}
 	requestPictureInPicture() {
 		return this.target?.requestPictureInPicture() ?? Promise.reject();
 	}
@@ -397,14 +433,8 @@ var HTMLVideoElementHost = class extends HTMLMediaElementHost {
 	webkitSetPresentationMode(mode) {
 		return this.target?.webkitSetPresentationMode?.(mode);
 	}
-	get webkitDisplayingFullscreen() {
-		return this.target?.webkitDisplayingFullscreen ?? false;
-	}
-	get webkitPresentationMode() {
-		return this.target?.webkitPresentationMode ?? "inline";
-	}
 };
 
 //#endregion
 export { CustomMediaElement as n, HTMLVideoElementHost as t };
-//# sourceMappingURL=video-host-ycP7ckxU.js.map
+//# sourceMappingURL=video-host-BtD61mpF.js.map

package/cdn/{video-host-ycP7ckxU.js.map → video-host-BtD61mpF.js.map}

@@ -1 +1 @@
-{"version":3,"file":"video-host-ycP7ckxU.js","names":["#define","#mediaHost","#attachToTarget","#childObserver","#syncMediaChildAttribute","#syncMediaChildren","#bridgedEventTypes","#bridgeEvent","#childMap","#enableDefaultTrack","#target","#types","#forwardEvent"],"sources":["../../utils/dist/object/omit.js","../../core/dist/dev/dom/media/custom-media-element/index.js","../../core/dist/dev/dom/media/media-host.js","../../core/dist/dev/dom/media/video-host.js"],"sourcesContent":["//#region src/object/omit.ts\n/**\n* Creates a new object without the specified keys.\n*\n* @example\n* const obj = { a: 1, b: 2, c: 3 };\n* omit(obj, ['b']); // { a: 1, c: 3 }\n*/\nfunction omit(obj, keys) {\n\tconst result = {};\n\tfor (const key in obj) if (!keys.includes(key)) result[key] = obj[key];\n\treturn result;\n}\n//#endregion\nexport { omit };\n\n//# sourceMappingURL=omit.js.map","import { omit, pick } from \"@videojs/utils/object\";\nimport { namedNodeMapToObject, serializeAttributes } from \"@videojs/utils/dom\";\nimport { kebabCase } from \"@videojs/utils/string\";\n//#region src/dom/media/custom-media-element/index.ts\n/** CSS custom property names for video elements. */\nconst VideoCSSVars = {\n\tborderRadius: \"--media-video-border-radius\",\n\tobjectFit: \"--media-object-fit\",\n\tobjectPosition: \"--media-object-position\",\n\tcaptionTrackDuration: \"--media-caption-track-duration\",\n\tcaptionTrackDelay: \"--media-caption-track-delay\",\n\tcaptionTrackY: \"--media-caption-track-y\"\n};\n/** CSS custom property names for audio elements. */\nconst AudioCSSVars = {};\n/** Helper function to generate the HTML template for video elements. */\nfunction getVideoTemplateHTML(attrs) {\n\treturn `\n    <style>\n      :host {\n        display: contents;\n      }\n\n      video {\n        display: block;\n        width: 100%;\n        height: 100%;\n        border-radius: var(${VideoCSSVars.borderRadius});\n        object-fit: var(${VideoCSSVars.objectFit}, contain);\n        object-position: var(${VideoCSSVars.objectPosition}, center);\n      }\n\n      video::-webkit-media-text-track-container {\n        transition: translate var(${VideoCSSVars.captionTrackDuration}, 0) ease-out;\n        transition-delay: var(${VideoCSSVars.captionTrackDelay}, 0);\n        translate: 0 var(${VideoCSSVars.captionTrackY}, 0);\n        scale: 0.98;\n        z-index: 1;\n        font-family: inherit;\n      }\n    </style>\n    <slot name=\"media\">\n      <video${serializeAttributes(attrs)}></video>\n    </slot>\n    <slot></slot>\n  `;\n}\n/** Helper function to generate the HTML template for other elements. */\nfunction getCommonTemplateHTML(tag) {\n\treturn (attrs) => {\n\t\treturn `\n      <style>\n        :host {\n          display: inline-flex;\n          line-height: 0;\n          flex-direction: column;\n          justify-content: end;\n        }\n\n        ${tag} {\n          width: 100%;\n        }\n      </style>\n      <slot name=\"media\">\n        <${tag}${serializeAttributes(attrs)}></${tag}>\n      </slot>\n      <slot></slot>\n    `;\n\t};\n}\nconst excludedProperties = [\n\t\"attach\",\n\t\"detach\",\n\t\"destroy\"\n];\nfunction CustomMediaElement(tag, MediaHost) {\n\tconst mediaHostAttrToProp = /* @__PURE__ */ new Map();\n\tlet isDefined = false;\n\tclass CustomMedia extends (globalThis.HTMLElement ?? class {}) {\n\t\tstatic getTemplateHTML = tag.endsWith(\"video\") ? getVideoTemplateHTML : getCommonTemplateHTML(tag);\n\t\tstatic shadowRootOptions = { mode: \"open\" };\n\t\tstatic properties = {\n\t\t\tautoPictureInPicture: { type: Boolean },\n\t\t\tautoplay: { type: Boolean },\n\t\t\tcontrols: { type: Boolean },\n\t\t\tcontrolsList: { type: String },\n\t\t\tcrossOrigin: { type: String },\n\t\t\tdefaultMuted: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tattribute: \"muted\"\n\t\t\t},\n\t\t\tdisablePictureInPicture: { type: Boolean },\n\t\t\tdisableRemotePlayback: { type: Boolean },\n\t\t\tloading: { type: String },\n\t\t\tloop: { type: Boolean },\n\t\t\tplaysInline: { type: Boolean },\n\t\t\tposter: { type: String },\n\t\t\tpreload: { type: String },\n\t\t\tsrc: { type: String }\n\t\t};\n\t\tstatic get observedAttributes() {\n\t\t\tCustomMedia.#define(this);\n\t\t\treturn [...getAttrsFromProps(this.properties)];\n\t\t}\n\t\tstatic #define(ctor) {\n\t\t\tif (isDefined) return;\n\t\t\tisDefined = true;\n\t\t\tfor (let proto = MediaHost.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) for (const prop of Object.getOwnPropertyNames(proto)) {\n\t\t\t\tif (prop in CustomMedia.prototype || excludedProperties.includes(prop)) continue;\n\t\t\t\tconst descriptor = Object.getOwnPropertyDescriptor(proto, prop);\n\t\t\t\tif (!descriptor) continue;\n\t\t\t\tconst config = {\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t};\n\t\t\t\tif (typeof descriptor.value === \"function\") config.value = function(...args) {\n\t\t\t\t\treturn this.#mediaHost[prop](...args);\n\t\t\t\t};\n\t\t\t\telse if (descriptor.get) {\n\t\t\t\t\tconfig.get = function() {\n\t\t\t\t\t\treturn this.#mediaHost[prop];\n\t\t\t\t\t};\n\t\t\t\t\tif (descriptor.set) {\n\t\t\t\t\t\tconst attr = kebabCase(prop);\n\t\t\t\t\t\tif (ctor.observedAttributes.includes(attr)) {\n\t\t\t\t\t\t\tmediaHostAttrToProp.set(attr, prop);\n\t\t\t\t\t\t\tconfig.set = function(val) {\n\t\t\t\t\t\t\t\tif (val === true || val === false || val == null) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\t\t\telse this.setAttribute(attr, String(val));\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t} else config.set = function(val) {\n\t\t\t\t\t\t\tthis.#mediaHost[prop] = val;\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, config);\n\t\t\t}\n\t\t\tconst properties = ctor.properties;\n\t\t\tfor (const [prop, { type, attribute }] of Object.entries(properties)) {\n\t\t\t\tif (prop in CustomMedia.prototype) continue;\n\t\t\t\tconst attr = attribute ?? prop.toLowerCase();\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, {\n\t\t\t\t\tget: function() {\n\t\t\t\t\t\treturn type === Boolean ? this.hasAttribute(attr) : this.getAttribute(attr);\n\t\t\t\t\t},\n\t\t\t\t\tset: function(val) {\n\t\t\t\t\t\tif (type === Boolean) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\telse this.setAttribute(attr, val);\n\t\t\t\t\t},\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t\t#mediaHost;\n\t\t#bridgedEventTypes = /* @__PURE__ */ new Set();\n\t\t#childMap = /* @__PURE__ */ new Map();\n\t\t#childObserver;\n\t\tconstructor() {\n\t\t\tsuper();\n\t\t\tif (!this.shadowRoot) {\n\t\t\t\tconst ctor = this.constructor;\n\t\t\t\tthis.attachShadow(ctor.shadowRootOptions);\n\t\t\t\tconst allowedKeys = getAttrsFromProps(ctor.properties);\n\t\t\t\tconst disallowedKeys = [...mediaHostAttrToProp.keys()];\n\t\t\t\tconst attrs = omit(pick(namedNodeMapToObject(this.attributes), allowedKeys), disallowedKeys);\n\t\t\t\tif (tag && !attrs.part) attrs.part = tag;\n\t\t\t\tthis.shadowRoot.innerHTML = ctor.getTemplateHTML(attrs);\n\t\t\t}\n\t\t\tthis.#mediaHost = new MediaHost();\n\t\t\tthis.#attachToTarget();\n\t\t\tthis.#childObserver = new MutationObserver(this.#syncMediaChildAttribute.bind(this));\n\t\t\tthis.shadowRoot.addEventListener(\"slotchange\", () => {\n\t\t\t\tthis.#attachToTarget();\n\t\t\t\tthis.#syncMediaChildren();\n\t\t\t});\n\t\t\tthis.#syncMediaChildren();\n\t\t}\n\t\t#attachToTarget() {\n\t\t\tconst target = this.target;\n\t\t\tif (target === this.#mediaHost.target) return;\n\t\t\tif (this.#mediaHost.target) this.#mediaHost.detach();\n\t\t\tthis.#mediaHost.attach(target);\n\t\t}\n\t\tget target() {\n\t\t\treturn this.querySelector(\":scope > [slot=media]\") ?? this.querySelector(tag) ?? this.shadowRoot?.querySelector(tag) ?? null;\n\t\t}\n\t\tdisconnectedCallback() {\n\t\t\tif (!this.hasAttribute(\"keep-alive\")) this.#mediaHost.destroy();\n\t\t}\n\t\taddEventListener(type, listener, options) {\n\t\t\tsuper.addEventListener(type, listener, options);\n\t\t\tif (!this.#bridgedEventTypes.has(type)) {\n\t\t\t\tthis.#bridgedEventTypes.add(type);\n\t\t\t\tthis.#mediaHost.addEventListener(type, this.#bridgeEvent);\n\t\t\t}\n\t\t}\n\t\tremoveEventListener(type, listener, options) {\n\t\t\tsuper.removeEventListener(type, listener, options);\n\t\t}\n\t\t#bridgeEvent = (event) => {\n\t\t\tif (!event.composed) this.dispatchEvent(new event.constructor(event.type, event));\n\t\t};\n\t\tattributeChangedCallback(attrName, oldValue, newValue) {\n\t\t\tconst prop = mediaHostAttrToProp.get(attrName);\n\t\t\tif (prop) {\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tconst valueType = typeof this.#mediaHost[prop];\n\t\t\t\t\tthis.#mediaHost[prop] = valueType === \"boolean\" ? newValue !== null : valueType === \"number\" ? Number(newValue) : newValue ?? \"\";\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (!CustomMedia.observedAttributes.includes(attrName) && this.constructor.observedAttributes.includes(attrName)) return;\n\t\t\tif (newValue === null) this.target?.removeAttribute(attrName);\n\t\t\telse if (this.target?.getAttribute(attrName) !== newValue) this.target?.setAttribute(attrName, newValue);\n\t\t}\n\t\t#syncMediaChildren() {\n\t\t\tconst defaultSlot = this.shadowRoot?.querySelector(\"slot:not([name])\");\n\t\t\tconst mediaChildren = new Set(defaultSlot?.assignedElements({ flatten: true }).filter((el) => el.localName === \"track\" || el.localName === \"source\"));\n\t\t\tfor (const [el, clone] of this.#childMap) if (!mediaChildren.has(el)) {\n\t\t\t\tclone.remove();\n\t\t\t\tthis.#childMap.delete(el);\n\t\t\t}\n\t\t\tfor (const el of mediaChildren) {\n\t\t\t\tlet clone = this.#childMap.get(el);\n\t\t\t\tif (!clone) {\n\t\t\t\t\tclone = el.cloneNode();\n\t\t\t\t\tthis.#childMap.set(el, clone);\n\t\t\t\t\tthis.#childObserver?.observe(el, { attributes: true });\n\t\t\t\t}\n\t\t\t\tthis.target?.append(clone);\n\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t}\n\t\t}\n\t\t#syncMediaChildAttribute(mutations) {\n\t\t\tfor (const mutation of mutations) if (mutation.type === \"attributes\") {\n\t\t\t\tconst { target, attributeName } = mutation;\n\t\t\t\tconst clone = this.#childMap.get(target);\n\t\t\t\tif (clone && attributeName) {\n\t\t\t\t\tclone.setAttribute(attributeName, target.getAttribute(attributeName) ?? \"\");\n\t\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t#enableDefaultTrack(trackEl) {\n\t\t\tif (trackEl && trackEl.localName === \"track\" && trackEl.default && (trackEl.kind === \"chapters\" || trackEl.kind === \"metadata\") && trackEl.track.mode === \"disabled\") trackEl.track.mode = \"hidden\";\n\t\t}\n\t}\n\treturn CustomMedia;\n}\nfunction getAttrsFromProps(props) {\n\treturn Object.keys(props).map((prop) => props[prop]?.attribute ?? prop.toLowerCase());\n}\n//#endregion\nexport { AudioCSSVars, CustomMediaElement, VideoCSSVars };\n\n//# sourceMappingURL=index.js.map","//#region src/dom/media/media-host.ts\nconst EMPTY_TIME_RANGES = Object.freeze({\n\tlength: 0,\n\tstart() {\n\t\treturn 0;\n\t},\n\tend() {\n\t\treturn 0;\n\t}\n});\nvar HTMLMediaElementHost = class extends EventTarget {\n\t#target = null;\n\t#types = /* @__PURE__ */ new Set();\n\tget target() {\n\t\treturn this.#target;\n\t}\n\tget paused() {\n\t\treturn this.target?.paused ?? true;\n\t}\n\tget ended() {\n\t\treturn this.target?.ended ?? false;\n\t}\n\tplay() {\n\t\treturn this.target?.play() ?? Promise.reject();\n\t}\n\tpause() {\n\t\tthis.target?.pause();\n\t}\n\tget currentTime() {\n\t\treturn this.target?.currentTime ?? 0;\n\t}\n\tset currentTime(value) {\n\t\tif (this.target) this.target.currentTime = value;\n\t}\n\tget duration() {\n\t\treturn this.target?.duration ?? NaN;\n\t}\n\tget seeking() {\n\t\treturn this.target?.seeking ?? false;\n\t}\n\tget src() {\n\t\treturn this.target?.src ?? \"\";\n\t}\n\tset src(value) {\n\t\tif (this.target) this.target.src = value;\n\t}\n\tget currentSrc() {\n\t\treturn this.target?.currentSrc ?? \"\";\n\t}\n\tget readyState() {\n\t\treturn this.target?.readyState ?? 0;\n\t}\n\tload() {\n\t\tthis.target?.load();\n\t}\n\tget volume() {\n\t\treturn this.target?.volume ?? 1;\n\t}\n\tset volume(value) {\n\t\tif (this.target) this.target.volume = value;\n\t}\n\tget muted() {\n\t\treturn this.target?.muted ?? false;\n\t}\n\tset muted(value) {\n\t\tif (this.target) this.target.muted = value;\n\t}\n\tget playbackRate() {\n\t\treturn this.target?.playbackRate ?? 1;\n\t}\n\tset playbackRate(value) {\n\t\tif (this.target) this.target.playbackRate = value;\n\t}\n\tget buffered() {\n\t\treturn this.target?.buffered ?? EMPTY_TIME_RANGES;\n\t}\n\tget seekable() {\n\t\treturn this.target?.seekable ?? EMPTY_TIME_RANGES;\n\t}\n\tget error() {\n\t\treturn this.target?.error ?? null;\n\t}\n\tget textTracks() {\n\t\treturn this.target?.textTracks ?? [];\n\t}\n\tattach(target) {\n\t\tif (!target || this.#target === target) return;\n\t\tthis.#target = target;\n\t\tfor (const type of this.#types) target.addEventListener(type, this.#forwardEvent);\n\t}\n\tdetach() {\n\t\tif (!this.#target) return;\n\t\tfor (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);\n\t\tthis.#target = null;\n\t}\n\tquerySelectorAll(selectors) {\n\t\treturn this.target?.querySelectorAll(selectors) ?? [];\n\t}\n\taddEventListener(type, listener, options) {\n\t\tif (!this.#types.has(type)) {\n\t\t\tthis.#types.add(type);\n\t\t\tthis.target?.addEventListener(type, this.#forwardEvent);\n\t\t}\n\t\tsuper.addEventListener(type, listener, options);\n\t}\n\tremoveEventListener(type, listener, options) {\n\t\tsuper.removeEventListener(type, listener, options);\n\t}\n\t#forwardEvent = (event) => {\n\t\tthis.dispatchEvent(new event.constructor(event.type, event));\n\t};\n};\n//#endregion\nexport { HTMLMediaElementHost };\n\n//# sourceMappingURL=media-host.js.map","import { HTMLMediaElementHost } from \"./media-host.js\";\n//#region src/dom/media/video-host.ts\nvar HTMLVideoElementHost = class extends HTMLMediaElementHost {\n\trequestPictureInPicture() {\n\t\treturn this.target?.requestPictureInPicture() ?? Promise.reject();\n\t}\n\trequestFullscreen() {\n\t\treturn this.target?.requestFullscreen() ?? Promise.reject();\n\t}\n\twebkitEnterFullscreen() {\n\t\treturn this.target?.webkitEnterFullscreen?.();\n\t}\n\twebkitExitFullscreen() {\n\t\treturn this.target?.webkitExitFullscreen?.();\n\t}\n\twebkitSetPresentationMode(mode) {\n\t\treturn this.target?.webkitSetPresentationMode?.(mode);\n\t}\n\tget webkitDisplayingFullscreen() {\n\t\treturn this.target?.webkitDisplayingFullscreen ?? false;\n\t}\n\tget webkitPresentationMode() {\n\t\treturn this.target?.webkitPresentationMode ?? \"inline\";\n\t}\n};\n//#endregion\nexport { HTMLVideoElementHost };\n\n//# sourceMappingURL=video-host.js.map"],"mappings":"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"}
+{"version":3,"file":"video-host-BtD61mpF.js","names":["#define","#mediaHost","#attachToTarget","#childObserver","#syncMediaChildAttribute","#syncMediaChildren","#bridgedEventTypes","#bridgeEvent","#childMap","#enableDefaultTrack","#target","#types","#forwardEvent"],"sources":["../../utils/dist/object/omit.js","../../core/dist/dev/dom/media/custom-media-element/index.js","../../core/dist/dev/dom/media/media-host.js","../../core/dist/dev/dom/media/video-host.js"],"sourcesContent":["//#region src/object/omit.ts\n/**\n* Creates a new object without the specified keys.\n*\n* @example\n* const obj = { a: 1, b: 2, c: 3 };\n* omit(obj, ['b']); // { a: 1, c: 3 }\n*/\nfunction omit(obj, keys) {\n\tconst result = {};\n\tfor (const key in obj) if (!keys.includes(key)) result[key] = obj[key];\n\treturn result;\n}\n//#endregion\nexport { omit };\n\n//# sourceMappingURL=omit.js.map","import { omit, pick } from \"@videojs/utils/object\";\nimport { namedNodeMapToObject, serializeAttributes } from \"@videojs/utils/dom\";\nimport { kebabCase } from \"@videojs/utils/string\";\n//#region src/dom/media/custom-media-element/index.ts\n/** CSS custom property names for video elements. */\nconst VideoCSSVars = {\n\tborderRadius: \"--media-video-border-radius\",\n\tobjectFit: \"--media-object-fit\",\n\tobjectPosition: \"--media-object-position\",\n\tcaptionTrackDuration: \"--media-caption-track-duration\",\n\tcaptionTrackDelay: \"--media-caption-track-delay\",\n\tcaptionTrackY: \"--media-caption-track-y\"\n};\n/** CSS custom property names for audio elements. */\nconst AudioCSSVars = {};\n/** Helper function to generate the HTML template for video elements. */\nfunction getVideoTemplateHTML(attrs) {\n\treturn `\n    <style>\n      :host {\n        display: contents;\n      }\n\n      video {\n        display: block;\n        width: 100%;\n        height: 100%;\n        border-radius: var(${VideoCSSVars.borderRadius});\n        object-fit: var(${VideoCSSVars.objectFit}, contain);\n        object-position: var(${VideoCSSVars.objectPosition}, center);\n      }\n\n      video::-webkit-media-text-track-container {\n        transition: translate var(${VideoCSSVars.captionTrackDuration}, 0) ease-out;\n        transition-delay: var(${VideoCSSVars.captionTrackDelay}, 0);\n        translate: 0 var(${VideoCSSVars.captionTrackY}, 0);\n        scale: 0.98;\n        z-index: 1;\n        font-family: inherit;\n      }\n    </style>\n    <slot name=\"media\">\n      <video${serializeAttributes(attrs)}></video>\n    </slot>\n    <slot></slot>\n  `;\n}\n/** Helper function to generate the HTML template for other elements. */\nfunction getCommonTemplateHTML(tag) {\n\treturn (attrs) => {\n\t\treturn `\n      <style>\n        :host {\n          display: inline-flex;\n          line-height: 0;\n          flex-direction: column;\n          justify-content: end;\n        }\n\n        ${tag} {\n          width: 100%;\n        }\n      </style>\n      <slot name=\"media\">\n        <${tag}${serializeAttributes(attrs)}></${tag}>\n      </slot>\n      <slot></slot>\n    `;\n\t};\n}\nconst excludedProperties = [\n\t\"attach\",\n\t\"detach\",\n\t\"destroy\"\n];\nfunction CustomMediaElement(tag, MediaHost) {\n\tconst mediaHostAttrToProp = /* @__PURE__ */ new Map();\n\tlet isDefined = false;\n\tclass CustomMedia extends (globalThis.HTMLElement ?? class {}) {\n\t\tstatic getTemplateHTML = tag.endsWith(\"video\") ? getVideoTemplateHTML : getCommonTemplateHTML(tag);\n\t\tstatic shadowRootOptions = { mode: \"open\" };\n\t\tstatic properties = {\n\t\t\tautoPictureInPicture: { type: Boolean },\n\t\t\tautoplay: { type: Boolean },\n\t\t\tcontrols: { type: Boolean },\n\t\t\tcontrolsList: { type: String },\n\t\t\tcrossOrigin: { type: String },\n\t\t\tdefaultMuted: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tattribute: \"muted\"\n\t\t\t},\n\t\t\tdisablePictureInPicture: { type: Boolean },\n\t\t\tdisableRemotePlayback: { type: Boolean },\n\t\t\tloading: { type: String },\n\t\t\tloop: { type: Boolean },\n\t\t\tplaysInline: { type: Boolean },\n\t\t\tposter: { type: String },\n\t\t\tpreload: { type: String },\n\t\t\tsrc: { type: String }\n\t\t};\n\t\tstatic get observedAttributes() {\n\t\t\tCustomMedia.#define(this);\n\t\t\treturn [...getAttrsFromProps(this.properties)];\n\t\t}\n\t\tstatic #define(ctor) {\n\t\t\tif (isDefined) return;\n\t\t\tisDefined = true;\n\t\t\tfor (let proto = MediaHost.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) for (const prop of Object.getOwnPropertyNames(proto)) {\n\t\t\t\tif (prop in CustomMedia.prototype || excludedProperties.includes(prop)) continue;\n\t\t\t\tconst descriptor = Object.getOwnPropertyDescriptor(proto, prop);\n\t\t\t\tif (!descriptor) continue;\n\t\t\t\tconst config = {\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t};\n\t\t\t\tif (typeof descriptor.value === \"function\") config.value = function(...args) {\n\t\t\t\t\treturn this.#mediaHost[prop](...args);\n\t\t\t\t};\n\t\t\t\telse if (descriptor.get) {\n\t\t\t\t\tconfig.get = function() {\n\t\t\t\t\t\treturn this.#mediaHost[prop];\n\t\t\t\t\t};\n\t\t\t\t\tif (descriptor.set) {\n\t\t\t\t\t\tconst attr = kebabCase(prop);\n\t\t\t\t\t\tif (ctor.observedAttributes.includes(attr)) {\n\t\t\t\t\t\t\tmediaHostAttrToProp.set(attr, prop);\n\t\t\t\t\t\t\tconfig.set = function(val) {\n\t\t\t\t\t\t\t\tif (val === true || val === false || val == null) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\t\t\telse this.setAttribute(attr, String(val));\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t} else config.set = function(val) {\n\t\t\t\t\t\t\tthis.#mediaHost[prop] = val;\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, config);\n\t\t\t}\n\t\t\tconst properties = ctor.properties;\n\t\t\tfor (const [prop, { type, attribute }] of Object.entries(properties)) {\n\t\t\t\tif (prop in CustomMedia.prototype) continue;\n\t\t\t\tconst attr = attribute ?? prop.toLowerCase();\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, {\n\t\t\t\t\tget: function() {\n\t\t\t\t\t\treturn type === Boolean ? this.hasAttribute(attr) : this.getAttribute(attr);\n\t\t\t\t\t},\n\t\t\t\t\tset: function(val) {\n\t\t\t\t\t\tif (type === Boolean) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\telse this.setAttribute(attr, val);\n\t\t\t\t\t},\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t\t#mediaHost;\n\t\t#bridgedEventTypes = /* @__PURE__ */ new Set();\n\t\t#childMap = /* @__PURE__ */ new Map();\n\t\t#childObserver;\n\t\tconstructor() {\n\t\t\tsuper();\n\t\t\tif (!this.shadowRoot) {\n\t\t\t\tconst ctor = this.constructor;\n\t\t\t\tthis.attachShadow(ctor.shadowRootOptions);\n\t\t\t\tconst allowedKeys = getAttrsFromProps(ctor.properties);\n\t\t\t\tconst disallowedKeys = [...mediaHostAttrToProp.keys()];\n\t\t\t\tconst attrs = omit(pick(namedNodeMapToObject(this.attributes), allowedKeys), disallowedKeys);\n\t\t\t\tif (tag && !attrs.part) attrs.part = tag;\n\t\t\t\tthis.shadowRoot.innerHTML = ctor.getTemplateHTML(attrs);\n\t\t\t}\n\t\t\tthis.#mediaHost = new MediaHost();\n\t\t\tthis.#attachToTarget();\n\t\t\tthis.#childObserver = new MutationObserver(this.#syncMediaChildAttribute.bind(this));\n\t\t\tthis.shadowRoot.addEventListener(\"slotchange\", () => {\n\t\t\t\tthis.#attachToTarget();\n\t\t\t\tthis.#syncMediaChildren();\n\t\t\t});\n\t\t\tthis.#syncMediaChildren();\n\t\t}\n\t\t#attachToTarget() {\n\t\t\tconst target = this.target;\n\t\t\tif (target === this.#mediaHost.target) return;\n\t\t\tif (this.#mediaHost.target) this.#mediaHost.detach();\n\t\t\tthis.#mediaHost.attach(target);\n\t\t}\n\t\tget target() {\n\t\t\treturn this.querySelector(\":scope > [slot=media]\") ?? this.querySelector(tag) ?? this.shadowRoot?.querySelector(tag) ?? null;\n\t\t}\n\t\tdisconnectedCallback() {\n\t\t\tif (!this.hasAttribute(\"keep-alive\")) this.#mediaHost.destroy();\n\t\t}\n\t\taddEventListener(type, listener, options) {\n\t\t\tsuper.addEventListener(type, listener, options);\n\t\t\tif (!this.#bridgedEventTypes.has(type)) {\n\t\t\t\tthis.#bridgedEventTypes.add(type);\n\t\t\t\tthis.#mediaHost.addEventListener(type, this.#bridgeEvent);\n\t\t\t}\n\t\t}\n\t\tremoveEventListener(type, listener, options) {\n\t\t\tsuper.removeEventListener(type, listener, options);\n\t\t}\n\t\t#bridgeEvent = (event) => {\n\t\t\tif (!event.composed) this.dispatchEvent(new event.constructor(event.type, event));\n\t\t};\n\t\tattributeChangedCallback(attrName, oldValue, newValue) {\n\t\t\tconst prop = mediaHostAttrToProp.get(attrName);\n\t\t\tif (prop) {\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tconst valueType = typeof this.#mediaHost[prop];\n\t\t\t\t\tthis.#mediaHost[prop] = valueType === \"boolean\" ? newValue !== null : valueType === \"number\" ? Number(newValue) : newValue ?? \"\";\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (!CustomMedia.observedAttributes.includes(attrName) && this.constructor.observedAttributes.includes(attrName)) return;\n\t\t\tif (newValue === null) this.target?.removeAttribute(attrName);\n\t\t\telse if (this.target?.getAttribute(attrName) !== newValue) this.target?.setAttribute(attrName, newValue);\n\t\t}\n\t\t#syncMediaChildren() {\n\t\t\tconst defaultSlot = this.shadowRoot?.querySelector(\"slot:not([name])\");\n\t\t\tconst mediaChildren = new Set(defaultSlot?.assignedElements({ flatten: true }).filter((el) => el.localName === \"track\" || el.localName === \"source\"));\n\t\t\tfor (const [el, clone] of this.#childMap) if (!mediaChildren.has(el)) {\n\t\t\t\tclone.remove();\n\t\t\t\tthis.#childMap.delete(el);\n\t\t\t}\n\t\t\tfor (const el of mediaChildren) {\n\t\t\t\tlet clone = this.#childMap.get(el);\n\t\t\t\tif (!clone) {\n\t\t\t\t\tclone = el.cloneNode();\n\t\t\t\t\tthis.#childMap.set(el, clone);\n\t\t\t\t\tthis.#childObserver?.observe(el, { attributes: true });\n\t\t\t\t}\n\t\t\t\tthis.target?.append(clone);\n\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t}\n\t\t}\n\t\t#syncMediaChildAttribute(mutations) {\n\t\t\tfor (const mutation of mutations) if (mutation.type === \"attributes\") {\n\t\t\t\tconst { target, attributeName } = mutation;\n\t\t\t\tconst clone = this.#childMap.get(target);\n\t\t\t\tif (clone && attributeName) {\n\t\t\t\t\tclone.setAttribute(attributeName, target.getAttribute(attributeName) ?? \"\");\n\t\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t#enableDefaultTrack(trackEl) {\n\t\t\tif (trackEl && trackEl.localName === \"track\" && trackEl.default && (trackEl.kind === \"chapters\" || trackEl.kind === \"metadata\") && trackEl.track.mode === \"disabled\") trackEl.track.mode = \"hidden\";\n\t\t}\n\t}\n\treturn CustomMedia;\n}\nfunction getAttrsFromProps(props) {\n\treturn Object.keys(props).map((prop) => props[prop]?.attribute ?? prop.toLowerCase());\n}\n//#endregion\nexport { AudioCSSVars, CustomMediaElement, VideoCSSVars };\n\n//# sourceMappingURL=index.js.map","//#region src/dom/media/media-host.ts\nconst EMPTY_TIME_RANGES = Object.freeze({\n\tlength: 0,\n\tstart() {\n\t\treturn 0;\n\t},\n\tend() {\n\t\treturn 0;\n\t}\n});\nvar HTMLMediaElementHost = class extends EventTarget {\n\t#target = null;\n\t#types = /* @__PURE__ */ new Set();\n\tget target() {\n\t\treturn this.#target;\n\t}\n\tattach(target) {\n\t\tif (!target || this.#target === target) return;\n\t\tthis.#target = target;\n\t\tfor (const type of this.#types) target.addEventListener(type, this.#forwardEvent);\n\t}\n\tdetach() {\n\t\tif (!this.#target) return;\n\t\tfor (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);\n\t\tthis.#target = null;\n\t}\n\tquerySelectorAll(selectors) {\n\t\treturn this.target?.querySelectorAll(selectors) ?? [];\n\t}\n\tquerySelector(selectors) {\n\t\treturn this.target?.querySelector(selectors) ?? null;\n\t}\n\taddEventListener(type, listener, options) {\n\t\tif (!this.#types.has(type)) {\n\t\t\tthis.#types.add(type);\n\t\t\tthis.target?.addEventListener(type, this.#forwardEvent);\n\t\t}\n\t\tsuper.addEventListener(type, listener, options);\n\t}\n\tremoveEventListener(type, listener, options) {\n\t\tsuper.removeEventListener(type, listener, options);\n\t}\n\t#forwardEvent = (event) => {\n\t\tthis.dispatchEvent(new event.constructor(event.type, event));\n\t};\n\tget title() {\n\t\treturn this.target?.title ?? \"\";\n\t}\n\tset title(value) {\n\t\tif (this.target) this.target.title = value;\n\t}\n\tget paused() {\n\t\treturn this.target?.paused ?? true;\n\t}\n\tget ended() {\n\t\treturn this.target?.ended ?? false;\n\t}\n\tget loop() {\n\t\treturn this.target?.loop ?? false;\n\t}\n\tset loop(value) {\n\t\tif (this.target) this.target.loop = value;\n\t}\n\tplay() {\n\t\treturn this.target?.play() ?? Promise.reject();\n\t}\n\tpause() {\n\t\tthis.target?.pause();\n\t}\n\tget currentTime() {\n\t\treturn this.target?.currentTime ?? 0;\n\t}\n\tset currentTime(value) {\n\t\tif (this.target) this.target.currentTime = value;\n\t}\n\tget duration() {\n\t\treturn this.target?.duration ?? NaN;\n\t}\n\tget seeking() {\n\t\treturn this.target?.seeking ?? false;\n\t}\n\tget src() {\n\t\treturn this.target?.src ?? \"\";\n\t}\n\tset src(value) {\n\t\tif (this.target) this.target.src = value;\n\t}\n\tget currentSrc() {\n\t\treturn this.target?.currentSrc ?? \"\";\n\t}\n\tget readyState() {\n\t\treturn this.target?.readyState ?? 0;\n\t}\n\tload() {\n\t\tthis.target?.load();\n\t}\n\tget volume() {\n\t\treturn this.target?.volume ?? 1;\n\t}\n\tset volume(value) {\n\t\tif (this.target) this.target.volume = value;\n\t}\n\tget muted() {\n\t\treturn this.target?.muted ?? false;\n\t}\n\tset muted(value) {\n\t\tif (this.target) this.target.muted = value;\n\t}\n\tget playbackRate() {\n\t\treturn this.target?.playbackRate ?? 1;\n\t}\n\tset playbackRate(value) {\n\t\tif (this.target) this.target.playbackRate = value;\n\t}\n\tget buffered() {\n\t\treturn this.target?.buffered ?? EMPTY_TIME_RANGES;\n\t}\n\tget seekable() {\n\t\treturn this.target?.seekable ?? EMPTY_TIME_RANGES;\n\t}\n\tget error() {\n\t\treturn this.target?.error ?? null;\n\t}\n\tget textTracks() {\n\t\treturn this.target?.textTracks ?? [];\n\t}\n\tget remote() {\n\t\treturn this.target?.remote;\n\t}\n\tget disableRemotePlayback() {\n\t\treturn this.target?.disableRemotePlayback ?? false;\n\t}\n\tset disableRemotePlayback(value) {\n\t\tif (this.target) this.target.disableRemotePlayback = value;\n\t}\n};\n//#endregion\nexport { HTMLMediaElementHost };\n\n//# sourceMappingURL=media-host.js.map","import { HTMLMediaElementHost } from \"./media-host.js\";\n//#region src/dom/media/video-host.ts\nvar HTMLVideoElementHost = class extends HTMLMediaElementHost {\n\tget poster() {\n\t\treturn this.target?.poster ?? \"\";\n\t}\n\tset poster(value) {\n\t\tif (this.target) this.target.poster = value;\n\t}\n\tget webkitDisplayingFullscreen() {\n\t\treturn this.target?.webkitDisplayingFullscreen ?? false;\n\t}\n\tget webkitPresentationMode() {\n\t\treturn this.target?.webkitPresentationMode ?? \"inline\";\n\t}\n\trequestPictureInPicture() {\n\t\treturn this.target?.requestPictureInPicture() ?? Promise.reject();\n\t}\n\trequestFullscreen() {\n\t\treturn this.target?.requestFullscreen() ?? Promise.reject();\n\t}\n\twebkitEnterFullscreen() {\n\t\treturn this.target?.webkitEnterFullscreen?.();\n\t}\n\twebkitExitFullscreen() {\n\t\treturn this.target?.webkitExitFullscreen?.();\n\t}\n\twebkitSetPresentationMode(mode) {\n\t\treturn this.target?.webkitSetPresentationMode?.(mode);\n\t}\n};\n//#endregion\nexport { HTMLVideoElementHost };\n\n//# sourceMappingURL=video-host.js.map"],"mappings":"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"}

package/cdn/{video-host-CPRJVRi3.js → video-host-LeB1FKfO.js}

@@ -43,5 +43,5 @@ import{n as e,r as t}from"./media-attach-mixin-C2wz0Qbd.js";import{n,t as r}from
         <${e}${t(n)}></${e}>
       </slot>
       <slot></slot>
-    `}const c=[`attach`,`detach`,`destroy`];function l(t,a){let l=new Map,d=!1;class f extends (globalThis.HTMLElement??class{}){static getTemplateHTML=t.endsWith(`video`)?o:s(t);static shadowRootOptions={mode:`open`};static properties={autoPictureInPicture:{type:Boolean},autoplay:{type:Boolean},controls:{type:Boolean},controlsList:{type:String},crossOrigin:{type:String},defaultMuted:{type:Boolean,attribute:`muted`},disablePictureInPicture:{type:Boolean},disableRemotePlayback:{type:Boolean},loading:{type:String},loop:{type:Boolean},playsInline:{type:Boolean},poster:{type:String},preload:{type:String},src:{type:String}};static get observedAttributes(){return f.#define(this),[...u(this.properties)]}static#define(e){if(d)return;d=!0;for(let t=a.prototype;t&&t!==Object.prototype;t=Object.getPrototypeOf(t))for(let r of Object.getOwnPropertyNames(t)){if(r in f.prototype||c.includes(r))continue;let i=Object.getOwnPropertyDescriptor(t,r);if(!i)continue;let a={enumerable:!0,configurable:!0};if(typeof i.value==`function`)a.value=function(...e){return this.#mediaHost[r](...e)};else if(i.get&&(a.get=function(){return this.#mediaHost[r]},i.set)){let t=n(r);e.observedAttributes.includes(t)?(l.set(t,r),a.set=function(e){e===!0||e===!1||e==null?this.toggleAttribute(t,!!e):this.setAttribute(t,String(e))}):a.set=function(e){this.#mediaHost[r]=e}}Object.defineProperty(f.prototype,r,a)}let t=e.properties;for(let[e,{type:n,attribute:r}]of Object.entries(t)){if(e in f.prototype)continue;let t=r??e.toLowerCase();Object.defineProperty(f.prototype,e,{get:function(){return n===Boolean?this.hasAttribute(t):this.getAttribute(t)},set:function(e){n===Boolean?this.toggleAttribute(t,!!e):this.setAttribute(t,e)},enumerable:!0,configurable:!0})}}#mediaHost;#bridgedEventTypes=new Set;#childMap=new Map;#childObserver;constructor(){if(super(),!this.shadowRoot){let n=this.constructor;this.attachShadow(n.shadowRootOptions);let a=u(n.properties),o=[...l.keys()],s=i(r(e(this.attributes),a),o);t&&!s.part&&(s.part=t),this.shadowRoot.innerHTML=n.getTemplateHTML(s)}this.#mediaHost=new a,this.#attachToTarget(),this.#childObserver=new MutationObserver(this.#syncMediaChildAttribute.bind(this)),this.shadowRoot.addEventListener(`slotchange`,()=>{this.#attachToTarget(),this.#syncMediaChildren()}),this.#syncMediaChildren()}#attachToTarget(){let e=this.target;e!==this.#mediaHost.target&&(this.#mediaHost.target&&this.#mediaHost.detach(),this.#mediaHost.attach(e))}get target(){return this.querySelector(`:scope > [slot=media]`)??this.querySelector(t)??this.shadowRoot?.querySelector(t)??null}disconnectedCallback(){this.hasAttribute(`keep-alive`)||this.#mediaHost.destroy()}addEventListener(e,t,n){super.addEventListener(e,t,n),this.#bridgedEventTypes.has(e)||(this.#bridgedEventTypes.add(e),this.#mediaHost.addEventListener(e,this.#bridgeEvent))}removeEventListener(e,t,n){super.removeEventListener(e,t,n)}#bridgeEvent=e=>{e.composed||this.dispatchEvent(new e.constructor(e.type,e))};attributeChangedCallback(e,t,n){let r=l.get(e);if(r){if(t!==n){let e=typeof this.#mediaHost[r];this.#mediaHost[r]=e===`boolean`?n!==null:e===`number`?Number(n):n??``}return}!f.observedAttributes.includes(e)&&this.constructor.observedAttributes.includes(e)||(n===null?this.target?.removeAttribute(e):this.target?.getAttribute(e)!==n&&this.target?.setAttribute(e,n))}#syncMediaChildren(){let e=this.shadowRoot?.querySelector(`slot:not([name])`),t=new Set(e?.assignedElements({flatten:!0}).filter(e=>e.localName===`track`||e.localName===`source`));for(let[e,n]of this.#childMap)t.has(e)||(n.remove(),this.#childMap.delete(e));for(let e of t){let t=this.#childMap.get(e);t||(t=e.cloneNode(),this.#childMap.set(e,t),this.#childObserver?.observe(e,{attributes:!0})),this.target?.append(t),this.#enableDefaultTrack(t)}}#syncMediaChildAttribute(e){for(let t of e)if(t.type===`attributes`){let{target:e,attributeName:n}=t,r=this.#childMap.get(e);r&&n&&(r.setAttribute(n,e.getAttribute(n)??``),this.#enableDefaultTrack(r))}}#enableDefaultTrack(e){e&&e.localName===`track`&&e.default&&(e.kind===`chapters`||e.kind===`metadata`)&&e.track.mode===`disabled`&&(e.track.mode=`hidden`)}}return f}function u(e){return Object.keys(e).map(t=>e[t]?.attribute??t.toLowerCase())}const d=Object.freeze({length:0,start(){return 0},end(){return 0}});var f=class extends EventTarget{#e=null;#t=new Set;get target(){return this.#e}get paused(){return this.target?.paused??!0}get ended(){return this.target?.ended??!1}play(){return this.target?.play()??Promise.reject()}pause(){this.target?.pause()}get currentTime(){return this.target?.currentTime??0}set currentTime(e){this.target&&(this.target.currentTime=e)}get duration(){return this.target?.duration??NaN}get seeking(){return this.target?.seeking??!1}get src(){return this.target?.src??``}set src(e){this.target&&(this.target.src=e)}get currentSrc(){return this.target?.currentSrc??``}get readyState(){return this.target?.readyState??0}load(){this.target?.load()}get volume(){return this.target?.volume??1}set volume(e){this.target&&(this.target.volume=e)}get muted(){return this.target?.muted??!1}set muted(e){this.target&&(this.target.muted=e)}get playbackRate(){return this.target?.playbackRate??1}set playbackRate(e){this.target&&(this.target.playbackRate=e)}get buffered(){return this.target?.buffered??d}get seekable(){return this.target?.seekable??d}get error(){return this.target?.error??null}get textTracks(){return this.target?.textTracks??[]}attach(e){if(!(!e||this.#e===e)){this.#e=e;for(let t of this.#t)e.addEventListener(t,this.#n)}}detach(){if(this.#e){for(let e of this.#t)this.#e.removeEventListener(e,this.#n);this.#e=null}}querySelectorAll(e){return this.target?.querySelectorAll(e)??[]}addEventListener(e,t,n){this.#t.has(e)||(this.#t.add(e),this.target?.addEventListener(e,this.#n)),super.addEventListener(e,t,n)}removeEventListener(e,t,n){super.removeEventListener(e,t,n)}#n=e=>{this.dispatchEvent(new e.constructor(e.type,e))}},p=class extends f{requestPictureInPicture(){return this.target?.requestPictureInPicture()??Promise.reject()}requestFullscreen(){return this.target?.requestFullscreen()??Promise.reject()}webkitEnterFullscreen(){return this.target?.webkitEnterFullscreen?.()}webkitExitFullscreen(){return this.target?.webkitExitFullscreen?.()}webkitSetPresentationMode(e){return this.target?.webkitSetPresentationMode?.(e)}get webkitDisplayingFullscreen(){return this.target?.webkitDisplayingFullscreen??!1}get webkitPresentationMode(){return this.target?.webkitPresentationMode??`inline`}};export{l as n,p as t};
-//# sourceMappingURL=video-host-CPRJVRi3.js.map
+    `}const c=[`attach`,`detach`,`destroy`];function l(t,a){let l=new Map,d=!1;class f extends (globalThis.HTMLElement??class{}){static getTemplateHTML=t.endsWith(`video`)?o:s(t);static shadowRootOptions={mode:`open`};static properties={autoPictureInPicture:{type:Boolean},autoplay:{type:Boolean},controls:{type:Boolean},controlsList:{type:String},crossOrigin:{type:String},defaultMuted:{type:Boolean,attribute:`muted`},disablePictureInPicture:{type:Boolean},disableRemotePlayback:{type:Boolean},loading:{type:String},loop:{type:Boolean},playsInline:{type:Boolean},poster:{type:String},preload:{type:String},src:{type:String}};static get observedAttributes(){return f.#define(this),[...u(this.properties)]}static#define(e){if(d)return;d=!0;for(let t=a.prototype;t&&t!==Object.prototype;t=Object.getPrototypeOf(t))for(let r of Object.getOwnPropertyNames(t)){if(r in f.prototype||c.includes(r))continue;let i=Object.getOwnPropertyDescriptor(t,r);if(!i)continue;let a={enumerable:!0,configurable:!0};if(typeof i.value==`function`)a.value=function(...e){return this.#mediaHost[r](...e)};else if(i.get&&(a.get=function(){return this.#mediaHost[r]},i.set)){let t=n(r);e.observedAttributes.includes(t)?(l.set(t,r),a.set=function(e){e===!0||e===!1||e==null?this.toggleAttribute(t,!!e):this.setAttribute(t,String(e))}):a.set=function(e){this.#mediaHost[r]=e}}Object.defineProperty(f.prototype,r,a)}let t=e.properties;for(let[e,{type:n,attribute:r}]of Object.entries(t)){if(e in f.prototype)continue;let t=r??e.toLowerCase();Object.defineProperty(f.prototype,e,{get:function(){return n===Boolean?this.hasAttribute(t):this.getAttribute(t)},set:function(e){n===Boolean?this.toggleAttribute(t,!!e):this.setAttribute(t,e)},enumerable:!0,configurable:!0})}}#mediaHost;#bridgedEventTypes=new Set;#childMap=new Map;#childObserver;constructor(){if(super(),!this.shadowRoot){let n=this.constructor;this.attachShadow(n.shadowRootOptions);let a=u(n.properties),o=[...l.keys()],s=i(r(e(this.attributes),a),o);t&&!s.part&&(s.part=t),this.shadowRoot.innerHTML=n.getTemplateHTML(s)}this.#mediaHost=new a,this.#attachToTarget(),this.#childObserver=new MutationObserver(this.#syncMediaChildAttribute.bind(this)),this.shadowRoot.addEventListener(`slotchange`,()=>{this.#attachToTarget(),this.#syncMediaChildren()}),this.#syncMediaChildren()}#attachToTarget(){let e=this.target;e!==this.#mediaHost.target&&(this.#mediaHost.target&&this.#mediaHost.detach(),this.#mediaHost.attach(e))}get target(){return this.querySelector(`:scope > [slot=media]`)??this.querySelector(t)??this.shadowRoot?.querySelector(t)??null}disconnectedCallback(){this.hasAttribute(`keep-alive`)||this.#mediaHost.destroy()}addEventListener(e,t,n){super.addEventListener(e,t,n),this.#bridgedEventTypes.has(e)||(this.#bridgedEventTypes.add(e),this.#mediaHost.addEventListener(e,this.#bridgeEvent))}removeEventListener(e,t,n){super.removeEventListener(e,t,n)}#bridgeEvent=e=>{e.composed||this.dispatchEvent(new e.constructor(e.type,e))};attributeChangedCallback(e,t,n){let r=l.get(e);if(r){if(t!==n){let e=typeof this.#mediaHost[r];this.#mediaHost[r]=e===`boolean`?n!==null:e===`number`?Number(n):n??``}return}!f.observedAttributes.includes(e)&&this.constructor.observedAttributes.includes(e)||(n===null?this.target?.removeAttribute(e):this.target?.getAttribute(e)!==n&&this.target?.setAttribute(e,n))}#syncMediaChildren(){let e=this.shadowRoot?.querySelector(`slot:not([name])`),t=new Set(e?.assignedElements({flatten:!0}).filter(e=>e.localName===`track`||e.localName===`source`));for(let[e,n]of this.#childMap)t.has(e)||(n.remove(),this.#childMap.delete(e));for(let e of t){let t=this.#childMap.get(e);t||(t=e.cloneNode(),this.#childMap.set(e,t),this.#childObserver?.observe(e,{attributes:!0})),this.target?.append(t),this.#enableDefaultTrack(t)}}#syncMediaChildAttribute(e){for(let t of e)if(t.type===`attributes`){let{target:e,attributeName:n}=t,r=this.#childMap.get(e);r&&n&&(r.setAttribute(n,e.getAttribute(n)??``),this.#enableDefaultTrack(r))}}#enableDefaultTrack(e){e&&e.localName===`track`&&e.default&&(e.kind===`chapters`||e.kind===`metadata`)&&e.track.mode===`disabled`&&(e.track.mode=`hidden`)}}return f}function u(e){return Object.keys(e).map(t=>e[t]?.attribute??t.toLowerCase())}const d=Object.freeze({length:0,start(){return 0},end(){return 0}});var f=class extends EventTarget{#e=null;#t=new Set;get target(){return this.#e}attach(e){if(!(!e||this.#e===e)){this.#e=e;for(let t of this.#t)e.addEventListener(t,this.#n)}}detach(){if(this.#e){for(let e of this.#t)this.#e.removeEventListener(e,this.#n);this.#e=null}}querySelectorAll(e){return this.target?.querySelectorAll(e)??[]}querySelector(e){return this.target?.querySelector(e)??null}addEventListener(e,t,n){this.#t.has(e)||(this.#t.add(e),this.target?.addEventListener(e,this.#n)),super.addEventListener(e,t,n)}removeEventListener(e,t,n){super.removeEventListener(e,t,n)}#n=e=>{this.dispatchEvent(new e.constructor(e.type,e))};get title(){return this.target?.title??``}set title(e){this.target&&(this.target.title=e)}get paused(){return this.target?.paused??!0}get ended(){return this.target?.ended??!1}get loop(){return this.target?.loop??!1}set loop(e){this.target&&(this.target.loop=e)}play(){return this.target?.play()??Promise.reject()}pause(){this.target?.pause()}get currentTime(){return this.target?.currentTime??0}set currentTime(e){this.target&&(this.target.currentTime=e)}get duration(){return this.target?.duration??NaN}get seeking(){return this.target?.seeking??!1}get src(){return this.target?.src??``}set src(e){this.target&&(this.target.src=e)}get currentSrc(){return this.target?.currentSrc??``}get readyState(){return this.target?.readyState??0}load(){this.target?.load()}get volume(){return this.target?.volume??1}set volume(e){this.target&&(this.target.volume=e)}get muted(){return this.target?.muted??!1}set muted(e){this.target&&(this.target.muted=e)}get playbackRate(){return this.target?.playbackRate??1}set playbackRate(e){this.target&&(this.target.playbackRate=e)}get buffered(){return this.target?.buffered??d}get seekable(){return this.target?.seekable??d}get error(){return this.target?.error??null}get textTracks(){return this.target?.textTracks??[]}get remote(){return this.target?.remote}get disableRemotePlayback(){return this.target?.disableRemotePlayback??!1}set disableRemotePlayback(e){this.target&&(this.target.disableRemotePlayback=e)}},p=class extends f{get poster(){return this.target?.poster??``}set poster(e){this.target&&(this.target.poster=e)}get webkitDisplayingFullscreen(){return this.target?.webkitDisplayingFullscreen??!1}get webkitPresentationMode(){return this.target?.webkitPresentationMode??`inline`}requestPictureInPicture(){return this.target?.requestPictureInPicture()??Promise.reject()}requestFullscreen(){return this.target?.requestFullscreen()??Promise.reject()}webkitEnterFullscreen(){return this.target?.webkitEnterFullscreen?.()}webkitExitFullscreen(){return this.target?.webkitExitFullscreen?.()}webkitSetPresentationMode(e){return this.target?.webkitSetPresentationMode?.(e)}};export{l as n,p as t};
+//# sourceMappingURL=video-host-LeB1FKfO.js.map

package/cdn/{video-host-CPRJVRi3.js.map → video-host-LeB1FKfO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"video-host-CPRJVRi3.js","names":["#define","#mediaHost","#attachToTarget","#childObserver","#syncMediaChildAttribute","#syncMediaChildren","#bridgedEventTypes","#bridgeEvent","#childMap","#enableDefaultTrack","#target","#types","#forwardEvent"],"sources":["../../utils/dist/object/omit.js","../../core/dist/default/dom/media/custom-media-element/index.js","../../core/dist/default/dom/media/media-host.js","../../core/dist/default/dom/media/video-host.js"],"sourcesContent":["//#region src/object/omit.ts\n/**\n* Creates a new object without the specified keys.\n*\n* @example\n* const obj = { a: 1, b: 2, c: 3 };\n* omit(obj, ['b']); // { a: 1, c: 3 }\n*/\nfunction omit(obj, keys) {\n\tconst result = {};\n\tfor (const key in obj) if (!keys.includes(key)) result[key] = obj[key];\n\treturn result;\n}\n//#endregion\nexport { omit };\n\n//# sourceMappingURL=omit.js.map","import { omit, pick } from \"@videojs/utils/object\";\nimport { namedNodeMapToObject, serializeAttributes } from \"@videojs/utils/dom\";\nimport { kebabCase } from \"@videojs/utils/string\";\n//#region src/dom/media/custom-media-element/index.ts\n/** CSS custom property names for video elements. */\nconst VideoCSSVars = {\n\tborderRadius: \"--media-video-border-radius\",\n\tobjectFit: \"--media-object-fit\",\n\tobjectPosition: \"--media-object-position\",\n\tcaptionTrackDuration: \"--media-caption-track-duration\",\n\tcaptionTrackDelay: \"--media-caption-track-delay\",\n\tcaptionTrackY: \"--media-caption-track-y\"\n};\n/** CSS custom property names for audio elements. */\nconst AudioCSSVars = {};\n/** Helper function to generate the HTML template for video elements. */\nfunction getVideoTemplateHTML(attrs) {\n\treturn `\n    <style>\n      :host {\n        display: contents;\n      }\n\n      video {\n        display: block;\n        width: 100%;\n        height: 100%;\n        border-radius: var(${VideoCSSVars.borderRadius});\n        object-fit: var(${VideoCSSVars.objectFit}, contain);\n        object-position: var(${VideoCSSVars.objectPosition}, center);\n      }\n\n      video::-webkit-media-text-track-container {\n        transition: translate var(${VideoCSSVars.captionTrackDuration}, 0) ease-out;\n        transition-delay: var(${VideoCSSVars.captionTrackDelay}, 0);\n        translate: 0 var(${VideoCSSVars.captionTrackY}, 0);\n        scale: 0.98;\n        z-index: 1;\n        font-family: inherit;\n      }\n    </style>\n    <slot name=\"media\">\n      <video${serializeAttributes(attrs)}></video>\n    </slot>\n    <slot></slot>\n  `;\n}\n/** Helper function to generate the HTML template for other elements. */\nfunction getCommonTemplateHTML(tag) {\n\treturn (attrs) => {\n\t\treturn `\n      <style>\n        :host {\n          display: inline-flex;\n          line-height: 0;\n          flex-direction: column;\n          justify-content: end;\n        }\n\n        ${tag} {\n          width: 100%;\n        }\n      </style>\n      <slot name=\"media\">\n        <${tag}${serializeAttributes(attrs)}></${tag}>\n      </slot>\n      <slot></slot>\n    `;\n\t};\n}\nconst excludedProperties = [\n\t\"attach\",\n\t\"detach\",\n\t\"destroy\"\n];\nfunction CustomMediaElement(tag, MediaHost) {\n\tconst mediaHostAttrToProp = /* @__PURE__ */ new Map();\n\tlet isDefined = false;\n\tclass CustomMedia extends (globalThis.HTMLElement ?? class {}) {\n\t\tstatic getTemplateHTML = tag.endsWith(\"video\") ? getVideoTemplateHTML : getCommonTemplateHTML(tag);\n\t\tstatic shadowRootOptions = { mode: \"open\" };\n\t\tstatic properties = {\n\t\t\tautoPictureInPicture: { type: Boolean },\n\t\t\tautoplay: { type: Boolean },\n\t\t\tcontrols: { type: Boolean },\n\t\t\tcontrolsList: { type: String },\n\t\t\tcrossOrigin: { type: String },\n\t\t\tdefaultMuted: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tattribute: \"muted\"\n\t\t\t},\n\t\t\tdisablePictureInPicture: { type: Boolean },\n\t\t\tdisableRemotePlayback: { type: Boolean },\n\t\t\tloading: { type: String },\n\t\t\tloop: { type: Boolean },\n\t\t\tplaysInline: { type: Boolean },\n\t\t\tposter: { type: String },\n\t\t\tpreload: { type: String },\n\t\t\tsrc: { type: String }\n\t\t};\n\t\tstatic get observedAttributes() {\n\t\t\tCustomMedia.#define(this);\n\t\t\treturn [...getAttrsFromProps(this.properties)];\n\t\t}\n\t\tstatic #define(ctor) {\n\t\t\tif (isDefined) return;\n\t\t\tisDefined = true;\n\t\t\tfor (let proto = MediaHost.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) for (const prop of Object.getOwnPropertyNames(proto)) {\n\t\t\t\tif (prop in CustomMedia.prototype || excludedProperties.includes(prop)) continue;\n\t\t\t\tconst descriptor = Object.getOwnPropertyDescriptor(proto, prop);\n\t\t\t\tif (!descriptor) continue;\n\t\t\t\tconst config = {\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t};\n\t\t\t\tif (typeof descriptor.value === \"function\") config.value = function(...args) {\n\t\t\t\t\treturn this.#mediaHost[prop](...args);\n\t\t\t\t};\n\t\t\t\telse if (descriptor.get) {\n\t\t\t\t\tconfig.get = function() {\n\t\t\t\t\t\treturn this.#mediaHost[prop];\n\t\t\t\t\t};\n\t\t\t\t\tif (descriptor.set) {\n\t\t\t\t\t\tconst attr = kebabCase(prop);\n\t\t\t\t\t\tif (ctor.observedAttributes.includes(attr)) {\n\t\t\t\t\t\t\tmediaHostAttrToProp.set(attr, prop);\n\t\t\t\t\t\t\tconfig.set = function(val) {\n\t\t\t\t\t\t\t\tif (val === true || val === false || val == null) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\t\t\telse this.setAttribute(attr, String(val));\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t} else config.set = function(val) {\n\t\t\t\t\t\t\tthis.#mediaHost[prop] = val;\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, config);\n\t\t\t}\n\t\t\tconst properties = ctor.properties;\n\t\t\tfor (const [prop, { type, attribute }] of Object.entries(properties)) {\n\t\t\t\tif (prop in CustomMedia.prototype) continue;\n\t\t\t\tconst attr = attribute ?? prop.toLowerCase();\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, {\n\t\t\t\t\tget: function() {\n\t\t\t\t\t\treturn type === Boolean ? this.hasAttribute(attr) : this.getAttribute(attr);\n\t\t\t\t\t},\n\t\t\t\t\tset: function(val) {\n\t\t\t\t\t\tif (type === Boolean) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\telse this.setAttribute(attr, val);\n\t\t\t\t\t},\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t\t#mediaHost;\n\t\t#bridgedEventTypes = /* @__PURE__ */ new Set();\n\t\t#childMap = /* @__PURE__ */ new Map();\n\t\t#childObserver;\n\t\tconstructor() {\n\t\t\tsuper();\n\t\t\tif (!this.shadowRoot) {\n\t\t\t\tconst ctor = this.constructor;\n\t\t\t\tthis.attachShadow(ctor.shadowRootOptions);\n\t\t\t\tconst allowedKeys = getAttrsFromProps(ctor.properties);\n\t\t\t\tconst disallowedKeys = [...mediaHostAttrToProp.keys()];\n\t\t\t\tconst attrs = omit(pick(namedNodeMapToObject(this.attributes), allowedKeys), disallowedKeys);\n\t\t\t\tif (tag && !attrs.part) attrs.part = tag;\n\t\t\t\tthis.shadowRoot.innerHTML = ctor.getTemplateHTML(attrs);\n\t\t\t}\n\t\t\tthis.#mediaHost = new MediaHost();\n\t\t\tthis.#attachToTarget();\n\t\t\tthis.#childObserver = new MutationObserver(this.#syncMediaChildAttribute.bind(this));\n\t\t\tthis.shadowRoot.addEventListener(\"slotchange\", () => {\n\t\t\t\tthis.#attachToTarget();\n\t\t\t\tthis.#syncMediaChildren();\n\t\t\t});\n\t\t\tthis.#syncMediaChildren();\n\t\t}\n\t\t#attachToTarget() {\n\t\t\tconst target = this.target;\n\t\t\tif (target === this.#mediaHost.target) return;\n\t\t\tif (this.#mediaHost.target) this.#mediaHost.detach();\n\t\t\tthis.#mediaHost.attach(target);\n\t\t}\n\t\tget target() {\n\t\t\treturn this.querySelector(\":scope > [slot=media]\") ?? this.querySelector(tag) ?? this.shadowRoot?.querySelector(tag) ?? null;\n\t\t}\n\t\tdisconnectedCallback() {\n\t\t\tif (!this.hasAttribute(\"keep-alive\")) this.#mediaHost.destroy();\n\t\t}\n\t\taddEventListener(type, listener, options) {\n\t\t\tsuper.addEventListener(type, listener, options);\n\t\t\tif (!this.#bridgedEventTypes.has(type)) {\n\t\t\t\tthis.#bridgedEventTypes.add(type);\n\t\t\t\tthis.#mediaHost.addEventListener(type, this.#bridgeEvent);\n\t\t\t}\n\t\t}\n\t\tremoveEventListener(type, listener, options) {\n\t\t\tsuper.removeEventListener(type, listener, options);\n\t\t}\n\t\t#bridgeEvent = (event) => {\n\t\t\tif (!event.composed) this.dispatchEvent(new event.constructor(event.type, event));\n\t\t};\n\t\tattributeChangedCallback(attrName, oldValue, newValue) {\n\t\t\tconst prop = mediaHostAttrToProp.get(attrName);\n\t\t\tif (prop) {\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tconst valueType = typeof this.#mediaHost[prop];\n\t\t\t\t\tthis.#mediaHost[prop] = valueType === \"boolean\" ? newValue !== null : valueType === \"number\" ? Number(newValue) : newValue ?? \"\";\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (!CustomMedia.observedAttributes.includes(attrName) && this.constructor.observedAttributes.includes(attrName)) return;\n\t\t\tif (newValue === null) this.target?.removeAttribute(attrName);\n\t\t\telse if (this.target?.getAttribute(attrName) !== newValue) this.target?.setAttribute(attrName, newValue);\n\t\t}\n\t\t#syncMediaChildren() {\n\t\t\tconst defaultSlot = this.shadowRoot?.querySelector(\"slot:not([name])\");\n\t\t\tconst mediaChildren = new Set(defaultSlot?.assignedElements({ flatten: true }).filter((el) => el.localName === \"track\" || el.localName === \"source\"));\n\t\t\tfor (const [el, clone] of this.#childMap) if (!mediaChildren.has(el)) {\n\t\t\t\tclone.remove();\n\t\t\t\tthis.#childMap.delete(el);\n\t\t\t}\n\t\t\tfor (const el of mediaChildren) {\n\t\t\t\tlet clone = this.#childMap.get(el);\n\t\t\t\tif (!clone) {\n\t\t\t\t\tclone = el.cloneNode();\n\t\t\t\t\tthis.#childMap.set(el, clone);\n\t\t\t\t\tthis.#childObserver?.observe(el, { attributes: true });\n\t\t\t\t}\n\t\t\t\tthis.target?.append(clone);\n\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t}\n\t\t}\n\t\t#syncMediaChildAttribute(mutations) {\n\t\t\tfor (const mutation of mutations) if (mutation.type === \"attributes\") {\n\t\t\t\tconst { target, attributeName } = mutation;\n\t\t\t\tconst clone = this.#childMap.get(target);\n\t\t\t\tif (clone && attributeName) {\n\t\t\t\t\tclone.setAttribute(attributeName, target.getAttribute(attributeName) ?? \"\");\n\t\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t#enableDefaultTrack(trackEl) {\n\t\t\tif (trackEl && trackEl.localName === \"track\" && trackEl.default && (trackEl.kind === \"chapters\" || trackEl.kind === \"metadata\") && trackEl.track.mode === \"disabled\") trackEl.track.mode = \"hidden\";\n\t\t}\n\t}\n\treturn CustomMedia;\n}\nfunction getAttrsFromProps(props) {\n\treturn Object.keys(props).map((prop) => props[prop]?.attribute ?? prop.toLowerCase());\n}\n//#endregion\nexport { AudioCSSVars, CustomMediaElement, VideoCSSVars };\n\n//# sourceMappingURL=index.js.map","//#region src/dom/media/media-host.ts\nconst EMPTY_TIME_RANGES = Object.freeze({\n\tlength: 0,\n\tstart() {\n\t\treturn 0;\n\t},\n\tend() {\n\t\treturn 0;\n\t}\n});\nvar HTMLMediaElementHost = class extends EventTarget {\n\t#target = null;\n\t#types = /* @__PURE__ */ new Set();\n\tget target() {\n\t\treturn this.#target;\n\t}\n\tget paused() {\n\t\treturn this.target?.paused ?? true;\n\t}\n\tget ended() {\n\t\treturn this.target?.ended ?? false;\n\t}\n\tplay() {\n\t\treturn this.target?.play() ?? Promise.reject();\n\t}\n\tpause() {\n\t\tthis.target?.pause();\n\t}\n\tget currentTime() {\n\t\treturn this.target?.currentTime ?? 0;\n\t}\n\tset currentTime(value) {\n\t\tif (this.target) this.target.currentTime = value;\n\t}\n\tget duration() {\n\t\treturn this.target?.duration ?? NaN;\n\t}\n\tget seeking() {\n\t\treturn this.target?.seeking ?? false;\n\t}\n\tget src() {\n\t\treturn this.target?.src ?? \"\";\n\t}\n\tset src(value) {\n\t\tif (this.target) this.target.src = value;\n\t}\n\tget currentSrc() {\n\t\treturn this.target?.currentSrc ?? \"\";\n\t}\n\tget readyState() {\n\t\treturn this.target?.readyState ?? 0;\n\t}\n\tload() {\n\t\tthis.target?.load();\n\t}\n\tget volume() {\n\t\treturn this.target?.volume ?? 1;\n\t}\n\tset volume(value) {\n\t\tif (this.target) this.target.volume = value;\n\t}\n\tget muted() {\n\t\treturn this.target?.muted ?? false;\n\t}\n\tset muted(value) {\n\t\tif (this.target) this.target.muted = value;\n\t}\n\tget playbackRate() {\n\t\treturn this.target?.playbackRate ?? 1;\n\t}\n\tset playbackRate(value) {\n\t\tif (this.target) this.target.playbackRate = value;\n\t}\n\tget buffered() {\n\t\treturn this.target?.buffered ?? EMPTY_TIME_RANGES;\n\t}\n\tget seekable() {\n\t\treturn this.target?.seekable ?? EMPTY_TIME_RANGES;\n\t}\n\tget error() {\n\t\treturn this.target?.error ?? null;\n\t}\n\tget textTracks() {\n\t\treturn this.target?.textTracks ?? [];\n\t}\n\tattach(target) {\n\t\tif (!target || this.#target === target) return;\n\t\tthis.#target = target;\n\t\tfor (const type of this.#types) target.addEventListener(type, this.#forwardEvent);\n\t}\n\tdetach() {\n\t\tif (!this.#target) return;\n\t\tfor (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);\n\t\tthis.#target = null;\n\t}\n\tquerySelectorAll(selectors) {\n\t\treturn this.target?.querySelectorAll(selectors) ?? [];\n\t}\n\taddEventListener(type, listener, options) {\n\t\tif (!this.#types.has(type)) {\n\t\t\tthis.#types.add(type);\n\t\t\tthis.target?.addEventListener(type, this.#forwardEvent);\n\t\t}\n\t\tsuper.addEventListener(type, listener, options);\n\t}\n\tremoveEventListener(type, listener, options) {\n\t\tsuper.removeEventListener(type, listener, options);\n\t}\n\t#forwardEvent = (event) => {\n\t\tthis.dispatchEvent(new event.constructor(event.type, event));\n\t};\n};\n//#endregion\nexport { HTMLMediaElementHost };\n\n//# sourceMappingURL=media-host.js.map","import { HTMLMediaElementHost } from \"./media-host.js\";\n//#region src/dom/media/video-host.ts\nvar HTMLVideoElementHost = class extends HTMLMediaElementHost {\n\trequestPictureInPicture() {\n\t\treturn this.target?.requestPictureInPicture() ?? Promise.reject();\n\t}\n\trequestFullscreen() {\n\t\treturn this.target?.requestFullscreen() ?? Promise.reject();\n\t}\n\twebkitEnterFullscreen() {\n\t\treturn this.target?.webkitEnterFullscreen?.();\n\t}\n\twebkitExitFullscreen() {\n\t\treturn this.target?.webkitExitFullscreen?.();\n\t}\n\twebkitSetPresentationMode(mode) {\n\t\treturn this.target?.webkitSetPresentationMode?.(mode);\n\t}\n\tget webkitDisplayingFullscreen() {\n\t\treturn this.target?.webkitDisplayingFullscreen ?? false;\n\t}\n\tget webkitPresentationMode() {\n\t\treturn this.target?.webkitPresentationMode ?? \"inline\";\n\t}\n};\n//#endregion\nexport { HTMLVideoElementHost };\n\n//# sourceMappingURL=video-host.js.map"],"mappings":"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"}
+{"version":3,"file":"video-host-LeB1FKfO.js","names":["#define","#mediaHost","#attachToTarget","#childObserver","#syncMediaChildAttribute","#syncMediaChildren","#bridgedEventTypes","#bridgeEvent","#childMap","#enableDefaultTrack","#target","#types","#forwardEvent"],"sources":["../../utils/dist/object/omit.js","../../core/dist/default/dom/media/custom-media-element/index.js","../../core/dist/default/dom/media/media-host.js","../../core/dist/default/dom/media/video-host.js"],"sourcesContent":["//#region src/object/omit.ts\n/**\n* Creates a new object without the specified keys.\n*\n* @example\n* const obj = { a: 1, b: 2, c: 3 };\n* omit(obj, ['b']); // { a: 1, c: 3 }\n*/\nfunction omit(obj, keys) {\n\tconst result = {};\n\tfor (const key in obj) if (!keys.includes(key)) result[key] = obj[key];\n\treturn result;\n}\n//#endregion\nexport { omit };\n\n//# sourceMappingURL=omit.js.map","import { omit, pick } from \"@videojs/utils/object\";\nimport { namedNodeMapToObject, serializeAttributes } from \"@videojs/utils/dom\";\nimport { kebabCase } from \"@videojs/utils/string\";\n//#region src/dom/media/custom-media-element/index.ts\n/** CSS custom property names for video elements. */\nconst VideoCSSVars = {\n\tborderRadius: \"--media-video-border-radius\",\n\tobjectFit: \"--media-object-fit\",\n\tobjectPosition: \"--media-object-position\",\n\tcaptionTrackDuration: \"--media-caption-track-duration\",\n\tcaptionTrackDelay: \"--media-caption-track-delay\",\n\tcaptionTrackY: \"--media-caption-track-y\"\n};\n/** CSS custom property names for audio elements. */\nconst AudioCSSVars = {};\n/** Helper function to generate the HTML template for video elements. */\nfunction getVideoTemplateHTML(attrs) {\n\treturn `\n    <style>\n      :host {\n        display: contents;\n      }\n\n      video {\n        display: block;\n        width: 100%;\n        height: 100%;\n        border-radius: var(${VideoCSSVars.borderRadius});\n        object-fit: var(${VideoCSSVars.objectFit}, contain);\n        object-position: var(${VideoCSSVars.objectPosition}, center);\n      }\n\n      video::-webkit-media-text-track-container {\n        transition: translate var(${VideoCSSVars.captionTrackDuration}, 0) ease-out;\n        transition-delay: var(${VideoCSSVars.captionTrackDelay}, 0);\n        translate: 0 var(${VideoCSSVars.captionTrackY}, 0);\n        scale: 0.98;\n        z-index: 1;\n        font-family: inherit;\n      }\n    </style>\n    <slot name=\"media\">\n      <video${serializeAttributes(attrs)}></video>\n    </slot>\n    <slot></slot>\n  `;\n}\n/** Helper function to generate the HTML template for other elements. */\nfunction getCommonTemplateHTML(tag) {\n\treturn (attrs) => {\n\t\treturn `\n      <style>\n        :host {\n          display: inline-flex;\n          line-height: 0;\n          flex-direction: column;\n          justify-content: end;\n        }\n\n        ${tag} {\n          width: 100%;\n        }\n      </style>\n      <slot name=\"media\">\n        <${tag}${serializeAttributes(attrs)}></${tag}>\n      </slot>\n      <slot></slot>\n    `;\n\t};\n}\nconst excludedProperties = [\n\t\"attach\",\n\t\"detach\",\n\t\"destroy\"\n];\nfunction CustomMediaElement(tag, MediaHost) {\n\tconst mediaHostAttrToProp = /* @__PURE__ */ new Map();\n\tlet isDefined = false;\n\tclass CustomMedia extends (globalThis.HTMLElement ?? class {}) {\n\t\tstatic getTemplateHTML = tag.endsWith(\"video\") ? getVideoTemplateHTML : getCommonTemplateHTML(tag);\n\t\tstatic shadowRootOptions = { mode: \"open\" };\n\t\tstatic properties = {\n\t\t\tautoPictureInPicture: { type: Boolean },\n\t\t\tautoplay: { type: Boolean },\n\t\t\tcontrols: { type: Boolean },\n\t\t\tcontrolsList: { type: String },\n\t\t\tcrossOrigin: { type: String },\n\t\t\tdefaultMuted: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tattribute: \"muted\"\n\t\t\t},\n\t\t\tdisablePictureInPicture: { type: Boolean },\n\t\t\tdisableRemotePlayback: { type: Boolean },\n\t\t\tloading: { type: String },\n\t\t\tloop: { type: Boolean },\n\t\t\tplaysInline: { type: Boolean },\n\t\t\tposter: { type: String },\n\t\t\tpreload: { type: String },\n\t\t\tsrc: { type: String }\n\t\t};\n\t\tstatic get observedAttributes() {\n\t\t\tCustomMedia.#define(this);\n\t\t\treturn [...getAttrsFromProps(this.properties)];\n\t\t}\n\t\tstatic #define(ctor) {\n\t\t\tif (isDefined) return;\n\t\t\tisDefined = true;\n\t\t\tfor (let proto = MediaHost.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) for (const prop of Object.getOwnPropertyNames(proto)) {\n\t\t\t\tif (prop in CustomMedia.prototype || excludedProperties.includes(prop)) continue;\n\t\t\t\tconst descriptor = Object.getOwnPropertyDescriptor(proto, prop);\n\t\t\t\tif (!descriptor) continue;\n\t\t\t\tconst config = {\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t};\n\t\t\t\tif (typeof descriptor.value === \"function\") config.value = function(...args) {\n\t\t\t\t\treturn this.#mediaHost[prop](...args);\n\t\t\t\t};\n\t\t\t\telse if (descriptor.get) {\n\t\t\t\t\tconfig.get = function() {\n\t\t\t\t\t\treturn this.#mediaHost[prop];\n\t\t\t\t\t};\n\t\t\t\t\tif (descriptor.set) {\n\t\t\t\t\t\tconst attr = kebabCase(prop);\n\t\t\t\t\t\tif (ctor.observedAttributes.includes(attr)) {\n\t\t\t\t\t\t\tmediaHostAttrToProp.set(attr, prop);\n\t\t\t\t\t\t\tconfig.set = function(val) {\n\t\t\t\t\t\t\t\tif (val === true || val === false || val == null) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\t\t\telse this.setAttribute(attr, String(val));\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t} else config.set = function(val) {\n\t\t\t\t\t\t\tthis.#mediaHost[prop] = val;\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, config);\n\t\t\t}\n\t\t\tconst properties = ctor.properties;\n\t\t\tfor (const [prop, { type, attribute }] of Object.entries(properties)) {\n\t\t\t\tif (prop in CustomMedia.prototype) continue;\n\t\t\t\tconst attr = attribute ?? prop.toLowerCase();\n\t\t\t\tObject.defineProperty(CustomMedia.prototype, prop, {\n\t\t\t\t\tget: function() {\n\t\t\t\t\t\treturn type === Boolean ? this.hasAttribute(attr) : this.getAttribute(attr);\n\t\t\t\t\t},\n\t\t\t\t\tset: function(val) {\n\t\t\t\t\t\tif (type === Boolean) this.toggleAttribute(attr, Boolean(val));\n\t\t\t\t\t\telse this.setAttribute(attr, val);\n\t\t\t\t\t},\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t\t#mediaHost;\n\t\t#bridgedEventTypes = /* @__PURE__ */ new Set();\n\t\t#childMap = /* @__PURE__ */ new Map();\n\t\t#childObserver;\n\t\tconstructor() {\n\t\t\tsuper();\n\t\t\tif (!this.shadowRoot) {\n\t\t\t\tconst ctor = this.constructor;\n\t\t\t\tthis.attachShadow(ctor.shadowRootOptions);\n\t\t\t\tconst allowedKeys = getAttrsFromProps(ctor.properties);\n\t\t\t\tconst disallowedKeys = [...mediaHostAttrToProp.keys()];\n\t\t\t\tconst attrs = omit(pick(namedNodeMapToObject(this.attributes), allowedKeys), disallowedKeys);\n\t\t\t\tif (tag && !attrs.part) attrs.part = tag;\n\t\t\t\tthis.shadowRoot.innerHTML = ctor.getTemplateHTML(attrs);\n\t\t\t}\n\t\t\tthis.#mediaHost = new MediaHost();\n\t\t\tthis.#attachToTarget();\n\t\t\tthis.#childObserver = new MutationObserver(this.#syncMediaChildAttribute.bind(this));\n\t\t\tthis.shadowRoot.addEventListener(\"slotchange\", () => {\n\t\t\t\tthis.#attachToTarget();\n\t\t\t\tthis.#syncMediaChildren();\n\t\t\t});\n\t\t\tthis.#syncMediaChildren();\n\t\t}\n\t\t#attachToTarget() {\n\t\t\tconst target = this.target;\n\t\t\tif (target === this.#mediaHost.target) return;\n\t\t\tif (this.#mediaHost.target) this.#mediaHost.detach();\n\t\t\tthis.#mediaHost.attach(target);\n\t\t}\n\t\tget target() {\n\t\t\treturn this.querySelector(\":scope > [slot=media]\") ?? this.querySelector(tag) ?? this.shadowRoot?.querySelector(tag) ?? null;\n\t\t}\n\t\tdisconnectedCallback() {\n\t\t\tif (!this.hasAttribute(\"keep-alive\")) this.#mediaHost.destroy();\n\t\t}\n\t\taddEventListener(type, listener, options) {\n\t\t\tsuper.addEventListener(type, listener, options);\n\t\t\tif (!this.#bridgedEventTypes.has(type)) {\n\t\t\t\tthis.#bridgedEventTypes.add(type);\n\t\t\t\tthis.#mediaHost.addEventListener(type, this.#bridgeEvent);\n\t\t\t}\n\t\t}\n\t\tremoveEventListener(type, listener, options) {\n\t\t\tsuper.removeEventListener(type, listener, options);\n\t\t}\n\t\t#bridgeEvent = (event) => {\n\t\t\tif (!event.composed) this.dispatchEvent(new event.constructor(event.type, event));\n\t\t};\n\t\tattributeChangedCallback(attrName, oldValue, newValue) {\n\t\t\tconst prop = mediaHostAttrToProp.get(attrName);\n\t\t\tif (prop) {\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tconst valueType = typeof this.#mediaHost[prop];\n\t\t\t\t\tthis.#mediaHost[prop] = valueType === \"boolean\" ? newValue !== null : valueType === \"number\" ? Number(newValue) : newValue ?? \"\";\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (!CustomMedia.observedAttributes.includes(attrName) && this.constructor.observedAttributes.includes(attrName)) return;\n\t\t\tif (newValue === null) this.target?.removeAttribute(attrName);\n\t\t\telse if (this.target?.getAttribute(attrName) !== newValue) this.target?.setAttribute(attrName, newValue);\n\t\t}\n\t\t#syncMediaChildren() {\n\t\t\tconst defaultSlot = this.shadowRoot?.querySelector(\"slot:not([name])\");\n\t\t\tconst mediaChildren = new Set(defaultSlot?.assignedElements({ flatten: true }).filter((el) => el.localName === \"track\" || el.localName === \"source\"));\n\t\t\tfor (const [el, clone] of this.#childMap) if (!mediaChildren.has(el)) {\n\t\t\t\tclone.remove();\n\t\t\t\tthis.#childMap.delete(el);\n\t\t\t}\n\t\t\tfor (const el of mediaChildren) {\n\t\t\t\tlet clone = this.#childMap.get(el);\n\t\t\t\tif (!clone) {\n\t\t\t\t\tclone = el.cloneNode();\n\t\t\t\t\tthis.#childMap.set(el, clone);\n\t\t\t\t\tthis.#childObserver?.observe(el, { attributes: true });\n\t\t\t\t}\n\t\t\t\tthis.target?.append(clone);\n\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t}\n\t\t}\n\t\t#syncMediaChildAttribute(mutations) {\n\t\t\tfor (const mutation of mutations) if (mutation.type === \"attributes\") {\n\t\t\t\tconst { target, attributeName } = mutation;\n\t\t\t\tconst clone = this.#childMap.get(target);\n\t\t\t\tif (clone && attributeName) {\n\t\t\t\t\tclone.setAttribute(attributeName, target.getAttribute(attributeName) ?? \"\");\n\t\t\t\t\tthis.#enableDefaultTrack(clone);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t#enableDefaultTrack(trackEl) {\n\t\t\tif (trackEl && trackEl.localName === \"track\" && trackEl.default && (trackEl.kind === \"chapters\" || trackEl.kind === \"metadata\") && trackEl.track.mode === \"disabled\") trackEl.track.mode = \"hidden\";\n\t\t}\n\t}\n\treturn CustomMedia;\n}\nfunction getAttrsFromProps(props) {\n\treturn Object.keys(props).map((prop) => props[prop]?.attribute ?? prop.toLowerCase());\n}\n//#endregion\nexport { AudioCSSVars, CustomMediaElement, VideoCSSVars };\n\n//# sourceMappingURL=index.js.map","//#region src/dom/media/media-host.ts\nconst EMPTY_TIME_RANGES = Object.freeze({\n\tlength: 0,\n\tstart() {\n\t\treturn 0;\n\t},\n\tend() {\n\t\treturn 0;\n\t}\n});\nvar HTMLMediaElementHost = class extends EventTarget {\n\t#target = null;\n\t#types = /* @__PURE__ */ new Set();\n\tget target() {\n\t\treturn this.#target;\n\t}\n\tattach(target) {\n\t\tif (!target || this.#target === target) return;\n\t\tthis.#target = target;\n\t\tfor (const type of this.#types) target.addEventListener(type, this.#forwardEvent);\n\t}\n\tdetach() {\n\t\tif (!this.#target) return;\n\t\tfor (const type of this.#types) this.#target.removeEventListener(type, this.#forwardEvent);\n\t\tthis.#target = null;\n\t}\n\tquerySelectorAll(selectors) {\n\t\treturn this.target?.querySelectorAll(selectors) ?? [];\n\t}\n\tquerySelector(selectors) {\n\t\treturn this.target?.querySelector(selectors) ?? null;\n\t}\n\taddEventListener(type, listener, options) {\n\t\tif (!this.#types.has(type)) {\n\t\t\tthis.#types.add(type);\n\t\t\tthis.target?.addEventListener(type, this.#forwardEvent);\n\t\t}\n\t\tsuper.addEventListener(type, listener, options);\n\t}\n\tremoveEventListener(type, listener, options) {\n\t\tsuper.removeEventListener(type, listener, options);\n\t}\n\t#forwardEvent = (event) => {\n\t\tthis.dispatchEvent(new event.constructor(event.type, event));\n\t};\n\tget title() {\n\t\treturn this.target?.title ?? \"\";\n\t}\n\tset title(value) {\n\t\tif (this.target) this.target.title = value;\n\t}\n\tget paused() {\n\t\treturn this.target?.paused ?? true;\n\t}\n\tget ended() {\n\t\treturn this.target?.ended ?? false;\n\t}\n\tget loop() {\n\t\treturn this.target?.loop ?? false;\n\t}\n\tset loop(value) {\n\t\tif (this.target) this.target.loop = value;\n\t}\n\tplay() {\n\t\treturn this.target?.play() ?? Promise.reject();\n\t}\n\tpause() {\n\t\tthis.target?.pause();\n\t}\n\tget currentTime() {\n\t\treturn this.target?.currentTime ?? 0;\n\t}\n\tset currentTime(value) {\n\t\tif (this.target) this.target.currentTime = value;\n\t}\n\tget duration() {\n\t\treturn this.target?.duration ?? NaN;\n\t}\n\tget seeking() {\n\t\treturn this.target?.seeking ?? false;\n\t}\n\tget src() {\n\t\treturn this.target?.src ?? \"\";\n\t}\n\tset src(value) {\n\t\tif (this.target) this.target.src = value;\n\t}\n\tget currentSrc() {\n\t\treturn this.target?.currentSrc ?? \"\";\n\t}\n\tget readyState() {\n\t\treturn this.target?.readyState ?? 0;\n\t}\n\tload() {\n\t\tthis.target?.load();\n\t}\n\tget volume() {\n\t\treturn this.target?.volume ?? 1;\n\t}\n\tset volume(value) {\n\t\tif (this.target) this.target.volume = value;\n\t}\n\tget muted() {\n\t\treturn this.target?.muted ?? false;\n\t}\n\tset muted(value) {\n\t\tif (this.target) this.target.muted = value;\n\t}\n\tget playbackRate() {\n\t\treturn this.target?.playbackRate ?? 1;\n\t}\n\tset playbackRate(value) {\n\t\tif (this.target) this.target.playbackRate = value;\n\t}\n\tget buffered() {\n\t\treturn this.target?.buffered ?? EMPTY_TIME_RANGES;\n\t}\n\tget seekable() {\n\t\treturn this.target?.seekable ?? EMPTY_TIME_RANGES;\n\t}\n\tget error() {\n\t\treturn this.target?.error ?? null;\n\t}\n\tget textTracks() {\n\t\treturn this.target?.textTracks ?? [];\n\t}\n\tget remote() {\n\t\treturn this.target?.remote;\n\t}\n\tget disableRemotePlayback() {\n\t\treturn this.target?.disableRemotePlayback ?? false;\n\t}\n\tset disableRemotePlayback(value) {\n\t\tif (this.target) this.target.disableRemotePlayback = value;\n\t}\n};\n//#endregion\nexport { HTMLMediaElementHost };\n\n//# sourceMappingURL=media-host.js.map","import { HTMLMediaElementHost } from \"./media-host.js\";\n//#region src/dom/media/video-host.ts\nvar HTMLVideoElementHost = class extends HTMLMediaElementHost {\n\tget poster() {\n\t\treturn this.target?.poster ?? \"\";\n\t}\n\tset poster(value) {\n\t\tif (this.target) this.target.poster = value;\n\t}\n\tget webkitDisplayingFullscreen() {\n\t\treturn this.target?.webkitDisplayingFullscreen ?? false;\n\t}\n\tget webkitPresentationMode() {\n\t\treturn this.target?.webkitPresentationMode ?? \"inline\";\n\t}\n\trequestPictureInPicture() {\n\t\treturn this.target?.requestPictureInPicture() ?? Promise.reject();\n\t}\n\trequestFullscreen() {\n\t\treturn this.target?.requestFullscreen() ?? Promise.reject();\n\t}\n\twebkitEnterFullscreen() {\n\t\treturn this.target?.webkitEnterFullscreen?.();\n\t}\n\twebkitExitFullscreen() {\n\t\treturn this.target?.webkitExitFullscreen?.();\n\t}\n\twebkitSetPresentationMode(mode) {\n\t\treturn this.target?.webkitSetPresentationMode?.(mode);\n\t}\n};\n//#endregion\nexport { HTMLVideoElementHost };\n\n//# sourceMappingURL=video-host.js.map"],"mappings":"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"}

package/cdn/video-minimal-ui.dev.js

@@ -1,4 +1,4 @@
-import "./compounds-CM_NP-ej.js";
+import "./compounds-DD3MYkSc.js";
 import "./context-0rI_P6jf.js";
-import "./player-CatrGW7l.js";
-import "./minimal-ui-cy2oEbFm.js";
+import "./player-DX5Ka0vt.js";
+import "./minimal-ui-yKur3jyD.js";

package/cdn/video-minimal-ui.js

@@ -1 +1 @@
-import"./compounds-Vvz-YfXP.js";import"./context-CEFisYD0.js";import"./player-C7ajkBi4.js";import"./minimal-ui-C_G24FML.js";
+import"./compounds-CCgS3IGo.js";import"./context-CEFisYD0.js";import"./player-B7jISTmQ.js";import"./minimal-ui-lnw8AjaS.js";

package/cdn/video-minimal.dev.js

@@ -1,13 +1,13 @@
-import "./compounds-CM_NP-ej.js";
+import "./compounds-DD3MYkSc.js";
 import { n as createShadowStyle } from "./shadow-styles-DKXFMmyD.js";
-import { n as createTemplate, t as SkinElement } from "./skin-element-CDUkmCtS.js";
+import { n as createTemplate, t as SkinElement } from "./skin-element-D3iVinGP.js";
 import { o as safeDefine } from "./context-0rI_P6jf.js";
-import "./player-CatrGW7l.js";
-import { t as renderIcon } from "./minimal-BnDnlwbj.js";
-import "./minimal-ui-cy2oEbFm.js";
+import "./player-DX5Ka0vt.js";
+import { t as renderIcon } from "./minimal-AX_y2YBU.js";
+import "./minimal-ui-yKur3jyD.js";
 
 //#region inline-css:src/define/video/minimal-skin.js
-var minimal_skin_default = "/* -------------------------------------------------------------------------- */\n/* Base                                                                       */\n/* -------------------------------------------------------------------------- */\n\nvideo-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\"] {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\nvideo-player video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\n  transition-delay: var(--media-caption-track-delay, 0);\n  translate: 0 var(--media-caption-track-y, 0);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\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\n/* ==========================================================================\n   Reset\n   ========================================================================== */\n\n.media-minimal-skin *,\n.media-minimal-skin *::before,\n.media-minimal-skin *::after {\n  box-sizing: border-box;\n}\n.media-minimal-skin img,\n.media-minimal-skin video,\n.media-minimal-skin svg {\n  display: block;\n  max-width: 100%;\n}\n.media-minimal-skin button {\n  font: inherit;\n}\n@media (prefers-reduced-motion: no-preference) {\n  .media-minimal-skin {\n    interpolate-size: allow-keywords;\n  }\n}\n\n/* ==========================================================================\n   Root Container\n   ========================================================================== */\n\n.media-minimal-skin {\n  container: media-root / inline-size;\n  position: relative;\n  isolation: isolate;\n  display: block;\n  height: 100%;\n  width: 100%;\n  border-radius: var(--media-border-radius, 0.75rem);\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n\n  &:focus-visible {\n    outline-color: currentColor;\n  }\n  font-family:\n    Inter Variable,\n    Inter,\n    ui-sans-serif,\n    system-ui,\n    sans-serif;\n  line-height: 1.5;\n  letter-spacing: normal;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n\n  & > * {\n    font-size: 0.75rem; /* 12px at 100% font size */\n  }\n\n  @container media-root (width > 48rem) {\n    & > * {\n      font-size: 0.875rem; /* 14px at 100% font size */\n    }\n  }\n}\n\n/* ==========================================================================\n   Media Element\n   ========================================================================== */\n\n.media-minimal-skin ::slotted(video),\n.media-minimal-skin video {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n}\n.media-minimal-skin ::slotted(video) {\n  border-radius: var(--media-video-border-radius);\n}\n.media-minimal-skin video {\n  border-radius: inherit;\n}\n\n.media-minimal-skin:fullscreen ::slotted(video),\n.media-minimal-skin:fullscreen video {\n  object-fit: contain;\n}\n\n/* ==========================================================================\n   Overlay / Scrim\n   ========================================================================== */\n\n.media-minimal-skin .media-overlay {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background-image: linear-gradient(to top, oklch(0 0 0 / 0.7), oklch(0 0 0 / 0.5) 7.5rem, oklch(0 0 0 / 0));\n  backdrop-filter: blur(0) saturate(1);\n  opacity: 0;\n  pointer-events: none;\n  transition-property: opacity, backdrop-filter;\n  transition-duration: var(--media-controls-transition-duration);\n  transition-timing-function: ease-out;\n}\n\n.media-minimal-skin .media-error ~ .media-overlay {\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n}\n\n.media-minimal-skin .media-controls[data-visible] ~ .media-overlay,\n.media-minimal-skin .media-error[data-open] ~ .media-overlay {\n  opacity: 1;\n}\n\n.media-minimal-skin .media-error[data-open] ~ .media-overlay {\n  backdrop-filter: blur(16px) saturate(1.2);\n}\n\n/* ==========================================================================\n   Buffering Indicator\n   ========================================================================== */\n\n.media-minimal-skin .media-buffering-indicator {\n  position: absolute;\n  inset: 0;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  color: oklch(1 0 0);\n  pointer-events: none;\n\n  &[data-visible] {\n    display: flex;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin .media-error:not([data-open]) {\n  display: none;\n}\n\n.media-minimal-skin .media-error__title {\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.media-minimal-skin .media-error__description {\n  opacity: 0.7;\n  overflow-wrap: anywhere;\n}\n\n.media-minimal-skin .media-error__actions {\n  display: flex;\n  gap: 0.5rem;\n\n  & > * {\n    flex: 1;\n  }\n}\n\n.media-minimal-skin .media-error[data-open] ~ .media-controls * {\n  visibility: hidden;\n}\n\n/* ==========================================================================\n   Controls\n   ========================================================================== */\n\n.media-minimal-skin .media-controls {\n  container: media-controls / inline-size;\n  display: flex;\n  align-items: center;\n  --media-controls-current-shadow-color: oklch(from currentColor 0 0 0 / clamp(0, calc((l - 0.5) * 0.5), 0.15));\n  --media-controls-current-shadow-color-subtle: oklch(\n    from var(--media-controls-current-shadow-color) l c h /\n    calc(alpha * 0.4)\n  );\n  background-color: var(--media-controls-background-color);\n  backdrop-filter: var(--media-controls-backdrop-filter);\n  text-shadow: 0 1px 0 var(--media-controls-current-shadow-color);\n}\n\n/* ==========================================================================\n   Time Controls & Display\n   ========================================================================== */\n\n.media-minimal-skin .media-time-controls {\n  container: media-time-controls / inline-size;\n  display: flex;\n  flex-direction: row-reverse;\n  align-items: center;\n  flex: 1;\n  gap: 0.75rem;\n}\n\n.media-minimal-skin .media-time-group {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.media-minimal-skin .media-time {\n  font-variant-numeric: tabular-nums;\n}\n\n.media-minimal-skin .media-time--current,\n.media-minimal-skin .media-time-separator {\n  display: none;\n}\n\n@container media-root (width > 42rem) {\n  .media-minimal-skin .media-time-controls {\n    flex-direction: row;\n  }\n\n  .media-minimal-skin .media-time--duration,\n  .media-minimal-skin .media-time-separator {\n    color: oklch(from currentColor l c h / 0.6);\n  }\n\n  .media-minimal-skin .media-time--current,\n  .media-minimal-skin .media-time-separator {\n    display: inline;\n  }\n}\n\n/* ==========================================================================\n   Buttons\n   ========================================================================== */\n\n/* Base button */\n.media-minimal-skin .media-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  padding: 0.5rem 1rem;\n  border: none;\n  border-radius: 0.5rem;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n  transition-property: background-color, outline-offset, scale;\n  /* Fix weird jumping when clicking on the buttons in Safari. */\n  will-change: scale;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  touch-action: manipulation;\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n\n  &:active {\n    scale: 0.98;\n  }\n\n  &[disabled] {\n    opacity: 0.5;\n    filter: grayscale(1);\n    cursor: not-allowed;\n  }\n\n  &[data-availability=\"unavailable\"] {\n    display: none;\n  }\n}\n\n/* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n@supports (corner-shape: squircle) {\n  .media-minimal-skin .media-button {\n    border-radius: 1rem;\n    /* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n    corner-shape: squircle;\n  }\n}\n\n/* Primary button variant */\n.media-minimal-skin .media-button--primary {\n  background: oklch(1 0 0);\n  color: oklch(0 0 0);\n  font-weight: 500;\n  text-shadow: none;\n}\n\n/* Subtle button variant */\n.media-minimal-skin .media-button--subtle {\n  background: transparent;\n  color: inherit;\n  text-shadow: inherit;\n\n  &:hover,\n  &:focus-visible,\n  &[aria-expanded=\"true\"] {\n    background: oklch(from currentColor l c h / 0.1);\n  }\n}\n\n/* Icon button variant */\n.media-minimal-skin .media-button--icon {\n  display: grid;\n  width: 2.375rem;\n  padding: 0;\n  aspect-ratio: 1;\n\n  &:active {\n    scale: 0.9;\n  }\n\n  & .media-icon {\n    filter: drop-shadow(0 1px 0 var(--media-controls-current-shadow-color, oklch(0 0 0 / 0.25)));\n  }\n}\n\n/* Seek button */\n.media-minimal-skin .media-button--seek {\n  & .media-icon__label {\n    position: absolute;\n    right: -1px;\n    bottom: -3px;\n    font-size: 10px; /* Hard coded due to size limitations. */\n    font-weight: 480;\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:has(.media-icon--flipped) .media-icon__label {\n    right: unset;\n    left: -1px;\n  }\n}\n\n/* Playback rate button */\n.media-minimal-skin .media-button--playback-rate {\n  padding: 0;\n\n  &::after {\n    content: attr(data-rate) \"\\00D7\";\n    width: 4ch;\n    font-variant-numeric: tabular-nums;\n  }\n}\n\n/* ==========================================================================\n   Button Groups\n   ========================================================================== */\n\n.media-minimal-skin .media-button-group {\n  display: flex;\n  align-items: center;\n  gap: 0.075rem;\n\n  @container media-root (width > 42rem) {\n    gap: 0.125rem;\n  }\n}\n\n/* ==========================================================================\n   Icons\n   ========================================================================== */\n\n.media-minimal-skin .media-icon__container {\n  position: relative;\n}\n.media-minimal-skin .media-icon {\n  display: block;\n  flex-shrink: 0;\n  grid-area: 1 / 1;\n  width: 18px;\n  height: 18px;\n  transition-behavior: allow-discrete;\n  transition-property: display, opacity;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n}\n.media-minimal-skin .media-icon--flipped {\n  scale: -1 1;\n}\n\n/* ==========================================================================\n   Poster Image\n   ========================================================================== */\n\n.media-minimal-skin media-poster,\n.media-minimal-skin > img {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  transition: opacity 0.25s;\n  pointer-events: none;\n}\n.media-minimal-skin media-poster:not([data-visible]),\n.media-minimal-skin > img:not([data-visible]) {\n  opacity: 0;\n}\n.media-minimal-skin media-poster ::slotted(img),\n.media-minimal-skin media-poster img {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n  border-radius: var(--media-video-border-radius);\n}\n.media-minimal-skin > img {\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n  border-radius: inherit;\n}\n\n.media-minimal-skin:fullscreen media-poster ::slotted(img),\n.media-minimal-skin:fullscreen media-poster img,\n.media-minimal-skin:fullscreen > img {\n  object-fit: contain;\n}\n\n/* ==========================================================================\n   Media preview\n   ========================================================================== */\n.media-minimal-skin .media-preview {\n  pointer-events: none;\n\n  & .media-preview__thumbnail-wrapper {\n    position: relative;\n    border-radius: 0.5rem;\n    background-color: oklch(0 0 0 / 0.9);\n  }\n  & .media-preview__thumbnail {\n    display: block;\n    border-radius: inherit;\n  }\n\n  & .media-preview__time {\n    display: block;\n    text-align: center;\n    margin-top: 0.5rem;\n  }\n\n  & .media-overlay {\n    opacity: 1;\n  }\n\n  & .media-preview__spinner {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    translate: -50% -50%;\n    opacity: 0;\n  }\n\n  & .media-preview__thumbnail,\n  & .media-preview__spinner {\n    transition: opacity 150ms ease-out;\n  }\n\n  &:has(.media-preview__thumbnail[data-loading]) {\n    & .media-preview__thumbnail {\n      opacity: 0;\n    }\n    & .media-preview__spinner {\n      opacity: 1;\n    }\n  }\n}\n\n/* ==========================================================================\n   Slider\n   ========================================================================== */\n\n.media-minimal-skin .media-slider {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  border-radius: calc(infinity * 1px);\n  outline: none;\n  cursor: pointer;\n\n  &[data-orientation=\"horizontal\"] {\n    min-width: 5rem;\n    width: 100%;\n    height: 2rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 2rem;\n    height: 4.5rem;\n  }\n}\n\n/* Track */\n.media-minimal-skin .media-slider__track {\n  position: relative;\n  isolation: isolate;\n  overflow: hidden;\n  border-radius: inherit;\n  user-select: none;\n  background-color: oklch(from currentColor l c h / 0.2);\n\n  &[data-orientation=\"horizontal\"] {\n    width: 100%;\n    height: 0.1875rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 0.1875rem;\n    height: 100%;\n  }\n}\n\n/* Thumb */\n.media-minimal-skin .media-slider__thumb {\n  position: absolute;\n  translate: -50% -50%;\n  z-index: 10;\n  width: 0.75rem;\n  height: 0.75rem;\n  background-color: currentColor;\n  border-radius: calc(infinity * 1px);\n  box-shadow:\n    0 0 0 1px var(--media-controls-current-shadow-color-subtle, oklch(0 0 0 / 0.1)),\n    0 1px 3px 0 oklch(0 0 0 / 0.15),\n    0 1px 2px -1px oklch(0 0 0 / 0.15);\n  opacity: 0;\n  scale: 0.7;\n  transform-origin: center;\n  transition-property: opacity, scale, outline-offset;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  user-select: none;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n\n  &[data-orientation=\"horizontal\"] {\n    top: 50%;\n    left: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    left: 50%;\n    top: calc(100% - var(--media-slider-fill));\n  }\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n}\n\n.media-minimal-skin .media-slider:hover .media-slider__thumb,\n.media-minimal-skin .media-slider:focus-within .media-slider__thumb,\n.media-minimal-skin .media-slider__thumb--persistent {\n  opacity: 1;\n  scale: 1;\n}\n\n/* Shared track fills */\n.media-minimal-skin .media-slider__buffer,\n.media-minimal-skin .media-slider__fill {\n  position: absolute;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"horizontal\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"horizontal\"] {\n  inset-block: 0;\n  left: 0;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"vertical\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"vertical\"] {\n  inset-inline: 0;\n  bottom: 0;\n}\n\n/* Buffer */\n.media-minimal-skin .media-slider__buffer {\n  background-color: oklch(from currentColor l c h / 0.2);\n  transition-duration: 0.25s;\n  transition-timing-function: ease-out;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-buffer);\n    transition-property: width;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-buffer);\n    transition-property: height;\n  }\n}\n\n/* Fill */\n.media-minimal-skin .media-slider__fill {\n  background-color: currentColor;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-fill);\n  }\n}\n\n/* Dragging — thumb and fill follow the pointer position */\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"horizontal\"] {\n  left: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"vertical\"] {\n  top: calc(100% - var(--media-slider-pointer));\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"horizontal\"] {\n  width: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"vertical\"] {\n  height: var(--media-slider-pointer);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin .media-popover,\n.media-minimal-skin .media-tooltip {\n  margin: 0;\n  border: 0;\n  color: inherit;\n  overflow: visible;\n  transition-property: scale, opacity, filter;\n  transition-duration: var(--media-popup-transition-duration);\n  transition-timing-function: var(--media-popup-transition-timing-function);\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    opacity: 0;\n    scale: 0.5;\n    filter: blur(8px);\n  }\n\n  &[data-instant] {\n    transition-duration: 0ms;\n  }\n\n  &[data-side=\"top\"] {\n    transform-origin: bottom;\n  }\n  &[data-side=\"bottom\"] {\n    transform-origin: top;\n  }\n  &[data-side=\"left\"] {\n    transform-origin: right;\n  }\n  &[data-side=\"right\"] {\n    transform-origin: left;\n  }\n\n  /* Safe area between trigger and popup */\n  &::before {\n    content: \"\";\n    position: absolute;\n    pointer-events: inherit;\n  }\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    width: 100%;\n    inset-inline: 0;\n  }\n  &[data-side=\"top\"]::before {\n    top: 100%;\n  }\n  &[data-side=\"bottom\"]::before {\n    bottom: 100%;\n  }\n\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    height: 100%;\n    inset-block: 0;\n  }\n  &[data-side=\"left\"]::before {\n    left: 100%;\n  }\n  &[data-side=\"right\"]::before {\n    right: 100%;\n  }\n}\n\n.media-minimal-skin .media-popover {\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-popover-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-popover-side-offset);\n  }\n}\n\n.media-minimal-skin .media-tooltip {\n  padding: 0.25rem 0.5rem;\n  border-radius: 0.5rem;\n  background-color: var(--media-tooltip-background-color);\n  backdrop-filter: var(--media-tooltip-backdrop-filter);\n  box-shadow:\n    0 0 0 1px var(--media-tooltip-border-color),\n    0 4px 6px -1px oklch(0 0 0 / 0.1),\n    0 2px 4px -2px oklch(0 0 0 / 0.1);\n  color: var(--media-tooltip-text-color);\n  font-size: 0.75rem; /* 12px at 100% font size */\n  white-space: nowrap;\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-tooltip-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-tooltip-side-offset);\n  }\n}\n\n.media-minimal-skin .media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n\n/* ==========================================================================\n   Native Caption Track\n   ========================================================================== */\n\n.media-minimal-skin {\n  --media-caption-track-duration: var(--media-controls-transition-duration);\n  --media-caption-track-delay: 25ms;\n  --media-caption-track-y: -0.5rem;\n\n  &:has(.media-controls[data-visible]) {\n    --media-caption-track-y: -5rem;\n  }\n\n  @container media-root (width > 42rem) {\n    &:has(.media-controls[data-visible]) > * {\n      --media-caption-track-y: -3rem;\n    }\n  }\n}\n\n.media-minimal-skin video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration) ease-out;\n  transition-delay: var(--media-caption-track-delay);\n  translate: 0 var(--media-caption-track-y);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\n}\n\n/* ==========================================================================\n   Icon State Visibility for Video Skins\n\n   Data-attribute-driven visibility rules for multi-state icon buttons.\n   Uses :is() with both element selectors (for HTML custom element wrappers)\n   and class selectors (for React rendered SVG elements).\n   ========================================================================== */\n\n/* --- All icons hidden by default --- */\n\n.media-button--play .media-icon--restart,\n.media-button--play .media-icon--play,\n.media-button--play .media-icon--pause,\n.media-button--mute .media-icon--volume-off,\n.media-button--mute .media-icon--volume-low,\n.media-button--mute .media-icon--volume-high,\n.media-button--fullscreen .media-icon--fullscreen-enter,\n.media-button--fullscreen .media-icon--fullscreen-exit,\n.media-button--pip .media-icon--pip-enter,\n.media-button--pip .media-icon--pip-exit,\n.media-button--captions .media-icon--captions-off,\n.media-button--captions .media-icon--captions-on {\n  display: none;\n  opacity: 0;\n}\n\n/* --- Active icon per state --- */\n\n/* Play: ended → restart */\n.media-button--play[data-ended] .media-icon--restart,\n/* Play: paused (not ended) → play */\n.media-button--play:not([data-ended])[data-paused] .media-icon--play,\n/* Play: playing (not paused, not ended) → pause */\n.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,\n/* Mute: muted → volume off */\n.media-button--mute[data-muted] .media-icon--volume-off,\n/* Mute: volume low (not muted) → volume low */\n.media-button--mute:not([data-muted])[data-volume-level=\"low\"] .media-icon--volume-low,\n/* Mute: volume high (not muted, not low) → volume high */\n.media-button--mute:not([data-muted]):not([data-volume-level=\"low\"]) .media-icon--volume-high,\n/* Fullscreen: not fullscreen → enter */\n.media-button--fullscreen:not([data-fullscreen]) .media-icon--fullscreen-enter,\n/* Fullscreen: fullscreen → exit */\n.media-button--fullscreen[data-fullscreen] .media-icon--fullscreen-exit,\n/* Picture-in-Picture: not active → enter */\n.media-button--pip:not([data-pip]) .media-icon--pip-enter,\n/* Picture-in-Picture: active → exit */\n.media-button--pip[data-pip] .media-icon--pip-exit,\n/* Captions: not active → captions off */\n.media-button--captions:not([data-active]) .media-icon--captions-off,\n/* Captions: active → captions on */\n.media-button--captions[data-active] .media-icon--captions-on {\n  display: block;\n  opacity: 1;\n}\n\n\n/* ==========================================================================\n   Root\n   ========================================================================== */\n\n.media-minimal-skin--video {\n  overflow: clip;\n  background: oklch(0 0 0);\n  --media-border-color: oklch(0 0 0 / 0.15);\n  --media-video-border-radius: var(--media-border-radius, 0.75rem);\n  --media-controls-background-color: transparent;\n  --media-controls-transition-duration: 100ms;\n  --media-controls-transition-timing-function: ease-out;\n  --media-error-dialog-transition-duration: 150ms;\n  --media-error-dialog-transition-delay: 100ms;\n  --media-error-dialog-transition-timing-function: ease-out;\n  --media-popup-transition-duration: 100ms;\n  --media-popup-transition-timing-function: ease-out;\n  --media-tooltip-background-color: oklch(1 0 0 / 0.1);\n  --media-tooltip-border-color: transparent;\n  --media-tooltip-backdrop-filter: blur(16px) saturate(1.5);\n  --media-tooltip-text-color: currentColor;\n  --media-tooltip-side-offset: 0.5rem;\n  --media-popover-side-offset: 1.5rem;\n\n  @media (prefers-reduced-motion: reduce) {\n    --media-error-dialog-transition-duration: 50ms;\n    --media-error-dialog-transition-delay: 0ms;\n    --media-popup-transition-duration: 0ms;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    --media-border-color: oklch(1 0 0 / 0.15);\n  }\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    --media-controls-background-color: oklch(0 0 0);\n    --media-tooltip-background-color: oklch(0 0 0);\n  }\n\n  @container media-root (width > 42rem) {\n    & > * {\n      --media-popover-side-offset: 0rem;\n    }\n  }\n\n  &:has(.media-controls:not([data-visible])) {\n    /* Slight delay to hide controls on non-touch devices after interaction */\n    @media (pointer: fine) {\n      --media-controls-transition-duration: 300ms;\n    }\n    @media (pointer: coarse) {\n      --media-controls-transition-duration: 150ms;\n    }\n    @media (prefers-reduced-motion: reduce) {\n      --media-controls-transition-duration: 50ms;\n    }\n  }\n\n  /* Inner border ring */\n  &::after {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    z-index: 10;\n    border-radius: inherit;\n    box-shadow: inset 0 0 0 1px var(--media-border-color);\n    pointer-events: none;\n  }\n\n  /* Fullscreen */\n  &:fullscreen {\n    --media-border-radius: 0;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin--video .media-error {\n  position: absolute;\n  inset: 0;\n  z-index: 20;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  pointer-events: none;\n  outline: none;\n}\n\n.media-minimal-skin--video .media-error__dialog {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  max-width: 16rem;\n  padding: 1rem;\n  color: oklch(1 0 0);\n  text-shadow: 0 1px 0 oklch(0 0 0 / 0.5);\n  transition-property: opacity, scale;\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n  transition-timing-function: var(--media-error-dialog-transition-timing-function);\n  pointer-events: auto;\n}\n\n.media-minimal-skin--video .media-error[data-starting-style] .media-error__dialog,\n.media-minimal-skin--video .media-error[data-ending-style] .media-error__dialog {\n  opacity: 0;\n  scale: 0.5;\n}\n.media-minimal-skin--video .media-error[data-ending-style] .media-error__dialog {\n  transition-delay: 0ms;\n}\n\n.media-minimal-skin--video .media-error__content {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  padding: 0.375rem 0;\n}\n\n.media-minimal-skin--video .media-error__title {\n  font-size: 1.125rem;\n}\n\n.media-minimal-skin--video .media-error[data-open] ~ .media-controls {\n  display: none;\n}\n\n/* ==========================================================================\n  Controls (hide/show behavior)\n  ========================================================================== */\n\n.media-minimal-skin--video .media-controls {\n  padding: 0.25rem;\n  column-gap: 0.5rem;\n  flex-wrap: wrap;\n  position: absolute;\n  bottom: 0.25rem;\n  inset-inline: 0.25rem;\n  z-index: 10;\n  color: oklch(1 0 0);\n  border-radius: 0.75rem;\n  transition-duration: var(--media-controls-transition-duration);\n  transition-timing-function: var(--media-controls-transition-timing-function);\n\n  @media (pointer: fine) {\n    will-change: translate, filter, opacity;\n    transition-property: translate, filter, opacity;\n  }\n\n  @media (pointer: coarse) {\n    will-change: translate, opacity;\n    transition-property: translate, opacity;\n  }\n\n  &:not([data-visible]) {\n    opacity: 0;\n    pointer-events: none;\n    translate: 0 100%;\n\n    @media (pointer: fine) {\n      filter: blur(8px);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      translate: 0 0;\n      filter: blur(0);\n    }\n  }\n\n  & .media-time-controls {\n    order: -1;\n    flex: 0 0 100%;\n    padding-inline: 0.625rem;\n  }\n\n  & .media-button-group:first-child {\n    flex: 1;\n    text-align: left;\n  }\n\n  & .media-button-group:last-child {\n    flex: 1;\n    justify-content: end;\n  }\n\n  @container media-root (width > 42rem) {\n    flex-wrap: nowrap;\n    bottom: 0.5rem;\n    inset-inline: 0.5rem;\n\n    & .media-time-controls {\n      order: unset;\n      flex: 1;\n    }\n\n    & .media-button-group:first-child,\n    & .media-button-group:last-child {\n      flex: 0 0 auto;\n    }\n  }\n}\n\n/* Hide cursor when controls are hidden */\n.media-minimal-skin--video:has(.media-controls:not([data-visible])) {\n  cursor: none;\n}\n\n/* ==========================================================================\n   Sliders\n   ========================================================================== */\n\n.media-minimal-skin--video .media-slider__track {\n  box-shadow: 0 0 0 1px oklch(0 0 0 / 0.05);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin--video .media-popover--volume {\n  background: transparent;\n  padding-block: 0.75rem;\n  border-radius: 0.75rem;\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    background: var(--media-controls-background-color);\n  }\n}\n\n/* ==========================================================================\n   Slider preview\n   ========================================================================== */\n\n.media-minimal-skin--video .media-slider__preview {\n  --media-preview-max-width: 11rem;\n  --media-preview-padding: -0.5rem;\n  /**\n    Inset is the difference between the container width and the slider (100%) width.\n    We only add to the end as we render the time there.\n  */\n  --media-preview-inset: calc(100cqi - 100%);\n\n  position: absolute;\n  left: clamp(\n    calc(var(--media-preview-max-width) / 2 + var(--media-preview-padding)),\n    var(--media-slider-pointer),\n    calc(100% - var(--media-preview-max-width) / 2 - var(--media-preview-padding) + var(--media-preview-inset))\n  );\n  bottom: 100%;\n  translate: -50%;\n  opacity: 0;\n  scale: 0.8;\n  filter: blur(8px);\n  transition-property: scale, opacity, filter;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  transform-origin: bottom;\n\n  @container media-root (width > 42rem) {\n    bottom: calc(100% + 0.25rem);\n    left: var(--media-slider-pointer);\n  }\n\n  & .media-preview__thumbnail-wrapper {\n    position: relative;\n\n    &::after {\n      content: \"\";\n      position: absolute;\n      inset: 0;\n      border-radius: inherit;\n      box-shadow:\n        0 0 0 1px oklch(0 0 0 / 0.05),\n        0 1px 3px 0 oklch(0 0 0 / 0.2),\n        0 1px 2px -1px oklch(0 0 0 / 0.2);\n    }\n  }\n\n  & .media-preview__thumbnail {\n    max-width: var(--media-preview-max-width);\n  }\n\n  &:has(.media-preview__thumbnail[data-loading]) {\n    max-height: 6rem;\n  }\n}\n.media-minimal-skin--video .media-slider[data-pointing] .media-slider__preview:has([role=\"img\"]:not([data-hidden])) {\n  opacity: 1;\n  scale: 1;\n  filter: blur(0);\n}\n\n";
+var minimal_skin_default = "/* -------------------------------------------------------------------------- */\n/* Base                                                                       */\n/* -------------------------------------------------------------------------- */\n\nvideo-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\"] {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\nvideo-player video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\n  transition-delay: var(--media-caption-track-delay, 0);\n  translate: 0 var(--media-caption-track-y, 0);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\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\n/* ==========================================================================\n   Reset\n   ========================================================================== */\n\n.media-minimal-skin *,\n.media-minimal-skin *::before,\n.media-minimal-skin *::after {\n  box-sizing: border-box;\n}\n.media-minimal-skin img,\n.media-minimal-skin video,\n.media-minimal-skin svg {\n  display: block;\n  max-width: 100%;\n}\n.media-minimal-skin button {\n  font: inherit;\n}\n@media (prefers-reduced-motion: no-preference) {\n  .media-minimal-skin {\n    interpolate-size: allow-keywords;\n  }\n}\n\n/* ==========================================================================\n   Root Container\n   ========================================================================== */\n\n.media-minimal-skin {\n  container: media-root / inline-size;\n  position: relative;\n  isolation: isolate;\n  display: block;\n  height: 100%;\n  width: 100%;\n  border-radius: var(--media-border-radius, 0.75rem);\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n\n  &:focus-visible {\n    outline-color: currentColor;\n  }\n  font-family:\n    Inter Variable,\n    Inter,\n    ui-sans-serif,\n    system-ui,\n    sans-serif;\n  line-height: 1.5;\n  letter-spacing: normal;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n\n  & > * {\n    font-size: 0.75rem; /* 12px at 100% font size */\n  }\n\n  @container media-root (width > 48rem) {\n    & > * {\n      font-size: 0.875rem; /* 14px at 100% font size */\n    }\n  }\n}\n\n/* ==========================================================================\n   Media Element\n   ========================================================================== */\n\n.media-minimal-skin ::slotted(video),\n.media-minimal-skin video {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n}\n.media-minimal-skin ::slotted(video) {\n  border-radius: var(--media-video-border-radius);\n}\n.media-minimal-skin video {\n  border-radius: inherit;\n}\n\n.media-minimal-skin:fullscreen ::slotted(video),\n.media-minimal-skin:fullscreen video {\n  object-fit: contain;\n}\n\n/* ==========================================================================\n   Overlay / Scrim\n   ========================================================================== */\n\n.media-minimal-skin .media-overlay {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background-image: linear-gradient(to top, oklch(0 0 0 / 0.7), oklch(0 0 0 / 0.5) 7.5rem, oklch(0 0 0 / 0));\n  backdrop-filter: blur(0) saturate(1);\n  opacity: 0;\n  pointer-events: none;\n  transition-property: opacity, backdrop-filter;\n  transition-duration: var(--media-controls-transition-duration);\n  transition-timing-function: ease-out;\n}\n\n.media-minimal-skin .media-error ~ .media-overlay {\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n}\n\n.media-minimal-skin .media-controls[data-visible] ~ .media-overlay,\n.media-minimal-skin .media-error[data-open] ~ .media-overlay {\n  opacity: 1;\n}\n\n.media-minimal-skin .media-error[data-open] ~ .media-overlay {\n  backdrop-filter: blur(16px) saturate(1.2);\n}\n\n/* ==========================================================================\n   Buffering Indicator\n   ========================================================================== */\n\n.media-minimal-skin .media-buffering-indicator {\n  position: absolute;\n  inset: 0;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  color: oklch(1 0 0);\n  pointer-events: none;\n\n  &[data-visible] {\n    display: flex;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin .media-error:not([data-open]) {\n  display: none;\n}\n\n.media-minimal-skin .media-error__title {\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.media-minimal-skin .media-error__description {\n  opacity: 0.7;\n  overflow-wrap: anywhere;\n}\n\n.media-minimal-skin .media-error__actions {\n  display: flex;\n  gap: 0.5rem;\n\n  & > * {\n    flex: 1;\n  }\n}\n\n.media-minimal-skin .media-error[data-open] ~ .media-controls * {\n  visibility: hidden;\n}\n\n/* ==========================================================================\n   Controls\n   ========================================================================== */\n\n.media-minimal-skin .media-controls {\n  container: media-controls / inline-size;\n  display: flex;\n  align-items: center;\n  --media-controls-current-shadow-color: oklch(from currentColor 0 0 0 / clamp(0, calc((l - 0.5) * 0.5), 0.15));\n  --media-controls-current-shadow-color-subtle: oklch(\n    from var(--media-controls-current-shadow-color) l c h /\n    calc(alpha * 0.4)\n  );\n  background-color: var(--media-controls-background-color);\n  backdrop-filter: var(--media-controls-backdrop-filter);\n  text-shadow: 0 1px 0 var(--media-controls-current-shadow-color);\n}\n\n/* ==========================================================================\n   Time Controls & Display\n   ========================================================================== */\n\n.media-minimal-skin .media-time-controls {\n  container: media-time-controls / inline-size;\n  display: flex;\n  flex-direction: row-reverse;\n  align-items: center;\n  flex: 1;\n  gap: 0.75rem;\n}\n\n.media-minimal-skin .media-time-group {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.media-minimal-skin .media-time {\n  font-variant-numeric: tabular-nums;\n}\n\n.media-minimal-skin .media-time--current,\n.media-minimal-skin .media-time-separator {\n  display: none;\n}\n\n@container media-root (width > 42rem) {\n  .media-minimal-skin .media-time-controls {\n    flex-direction: row;\n  }\n\n  .media-minimal-skin .media-time--duration,\n  .media-minimal-skin .media-time-separator {\n    color: oklch(from currentColor l c h / 0.6);\n  }\n\n  .media-minimal-skin .media-time--current,\n  .media-minimal-skin .media-time-separator {\n    display: inline;\n  }\n}\n\n/* ==========================================================================\n   Buttons\n   ========================================================================== */\n\n/* Base button */\n.media-minimal-skin .media-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  padding: 0.5rem 1rem;\n  border: none;\n  border-radius: 0.5rem;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n  transition-property: background-color, outline-offset, scale;\n  /* Fix weird jumping when clicking on the buttons in Safari. */\n  will-change: scale;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  touch-action: manipulation;\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n\n  &:active {\n    scale: 0.98;\n  }\n\n  &[disabled] {\n    opacity: 0.5;\n    filter: grayscale(1);\n    cursor: not-allowed;\n  }\n\n  &[data-availability=\"unavailable\"] {\n    display: none;\n  }\n}\n\n/* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n@supports (corner-shape: squircle) {\n  .media-minimal-skin .media-button {\n    border-radius: 1rem;\n    /* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n    corner-shape: squircle;\n  }\n}\n\n/* Primary button variant */\n.media-minimal-skin .media-button--primary {\n  background: oklch(1 0 0);\n  color: oklch(0 0 0);\n  font-weight: 500;\n  text-shadow: none;\n}\n\n/* Subtle button variant */\n.media-minimal-skin .media-button--subtle {\n  background: transparent;\n  color: inherit;\n  text-shadow: inherit;\n\n  &:hover,\n  &:focus-visible,\n  &[aria-expanded=\"true\"] {\n    background: oklch(from currentColor l c h / 0.1);\n  }\n}\n\n/* Icon button variant */\n.media-minimal-skin .media-button--icon {\n  display: grid;\n  width: 2.375rem;\n  padding: 0;\n  aspect-ratio: 1;\n\n  &:active {\n    scale: 0.9;\n  }\n\n  & .media-icon {\n    filter: drop-shadow(0 1px 0 var(--media-controls-current-shadow-color, oklch(0 0 0 / 0.25)));\n  }\n}\n\n/* Seek button */\n.media-minimal-skin .media-button--seek {\n  & .media-icon__label {\n    position: absolute;\n    right: -1px;\n    bottom: -3px;\n    font-size: 10px; /* Hard coded due to size limitations. */\n    font-weight: 480;\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:has(.media-icon--flipped) .media-icon__label {\n    right: unset;\n    left: -1px;\n  }\n}\n\n/* Playback rate button */\n.media-minimal-skin .media-button--playback-rate {\n  padding: 0;\n\n  &::after {\n    content: attr(data-rate) \"\\00D7\";\n    width: 4ch;\n    font-variant-numeric: tabular-nums;\n  }\n}\n\n/* ==========================================================================\n   Button Groups\n   ========================================================================== */\n\n.media-minimal-skin .media-button-group {\n  display: flex;\n  align-items: center;\n  gap: 0.075rem;\n\n  @container media-root (width > 42rem) {\n    gap: 0.125rem;\n  }\n}\n\n/* ==========================================================================\n   Icons\n   ========================================================================== */\n\n.media-minimal-skin .media-icon__container {\n  position: relative;\n}\n.media-minimal-skin .media-icon {\n  display: block;\n  flex-shrink: 0;\n  grid-area: 1 / 1;\n  width: 18px;\n  height: 18px;\n  transition-behavior: allow-discrete;\n  transition-property: display, opacity;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n}\n.media-minimal-skin .media-icon--flipped {\n  scale: -1 1;\n}\n\n/* ==========================================================================\n   Poster Image\n   ========================================================================== */\n\n.media-minimal-skin media-poster,\n.media-minimal-skin > img {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  transition: opacity 0.25s;\n  pointer-events: none;\n}\n.media-minimal-skin media-poster:not([data-visible]),\n.media-minimal-skin > img:not([data-visible]) {\n  opacity: 0;\n}\n.media-minimal-skin media-poster ::slotted(img),\n.media-minimal-skin media-poster img {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n  border-radius: var(--media-video-border-radius);\n}\n.media-minimal-skin > img {\n  object-fit: var(--media-object-fit, contain);\n  object-position: var(--media-object-position, center);\n  border-radius: inherit;\n}\n\n.media-minimal-skin:fullscreen media-poster ::slotted(img),\n.media-minimal-skin:fullscreen media-poster img,\n.media-minimal-skin:fullscreen > img {\n  object-fit: contain;\n}\n\n/* ==========================================================================\n   Media preview\n   ========================================================================== */\n.media-minimal-skin .media-preview {\n  pointer-events: none;\n\n  & .media-preview__thumbnail-wrapper {\n    position: relative;\n    border-radius: 0.5rem;\n    background-color: oklch(0 0 0 / 0.9);\n  }\n  & .media-preview__thumbnail {\n    display: block;\n    border-radius: inherit;\n  }\n\n  & .media-preview__time {\n    display: block;\n    text-align: center;\n    margin-top: 0.5rem;\n  }\n\n  & .media-overlay {\n    opacity: 1;\n  }\n\n  & .media-preview__spinner {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    translate: -50% -50%;\n    opacity: 0;\n  }\n\n  & .media-preview__thumbnail,\n  & .media-preview__spinner {\n    transition: opacity 150ms ease-out;\n  }\n\n  &:has(.media-preview__thumbnail[data-loading]) {\n    & .media-preview__thumbnail {\n      opacity: 0;\n    }\n    & .media-preview__spinner {\n      opacity: 1;\n    }\n  }\n}\n\n/* ==========================================================================\n   Slider\n   ========================================================================== */\n\n.media-minimal-skin .media-slider {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  border-radius: calc(infinity * 1px);\n  outline: none;\n  cursor: pointer;\n\n  &[data-orientation=\"horizontal\"] {\n    min-width: 5rem;\n    width: 100%;\n    height: 2rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 2rem;\n    height: 4.5rem;\n  }\n}\n\n/* Track */\n.media-minimal-skin .media-slider__track {\n  position: relative;\n  isolation: isolate;\n  overflow: hidden;\n  border-radius: inherit;\n  user-select: none;\n  background-color: oklch(from currentColor l c h / 0.2);\n\n  &[data-orientation=\"horizontal\"] {\n    width: 100%;\n    height: 0.1875rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 0.1875rem;\n    height: 100%;\n  }\n}\n\n/* Thumb */\n.media-minimal-skin .media-slider__thumb {\n  position: absolute;\n  translate: -50% -50%;\n  z-index: 10;\n  width: 0.75rem;\n  height: 0.75rem;\n  background-color: currentColor;\n  border-radius: calc(infinity * 1px);\n  box-shadow:\n    0 0 0 1px var(--media-controls-current-shadow-color-subtle, oklch(0 0 0 / 0.1)),\n    0 1px 3px 0 oklch(0 0 0 / 0.15),\n    0 1px 2px -1px oklch(0 0 0 / 0.15);\n  opacity: 0;\n  scale: 0.7;\n  transform-origin: center;\n  transition-property: opacity, scale, outline-offset;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  user-select: none;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n\n  &[data-orientation=\"horizontal\"] {\n    top: 50%;\n    left: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    left: 50%;\n    top: calc(100% - var(--media-slider-fill));\n  }\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n}\n\n.media-minimal-skin .media-slider:hover .media-slider__thumb,\n.media-minimal-skin .media-slider:focus-within .media-slider__thumb,\n.media-minimal-skin .media-slider__thumb--persistent {\n  opacity: 1;\n  scale: 1;\n}\n\n/* Shared track fills */\n.media-minimal-skin .media-slider__buffer,\n.media-minimal-skin .media-slider__fill {\n  position: absolute;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"horizontal\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"horizontal\"] {\n  inset-block: 0;\n  left: 0;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"vertical\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"vertical\"] {\n  inset-inline: 0;\n  bottom: 0;\n}\n\n/* Buffer */\n.media-minimal-skin .media-slider__buffer {\n  background-color: oklch(from currentColor l c h / 0.2);\n  transition-duration: 0.25s;\n  transition-timing-function: ease-out;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-buffer);\n    transition-property: width;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-buffer);\n    transition-property: height;\n  }\n}\n\n/* Fill */\n.media-minimal-skin .media-slider__fill {\n  background-color: currentColor;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-fill);\n  }\n}\n\n/* Dragging — thumb and fill follow the pointer position */\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"horizontal\"] {\n  left: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"vertical\"] {\n  top: calc(100% - var(--media-slider-pointer));\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"horizontal\"] {\n  width: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"vertical\"] {\n  height: var(--media-slider-pointer);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin .media-popover,\n.media-minimal-skin .media-tooltip {\n  margin: 0;\n  border: 0;\n  color: inherit;\n  overflow: visible;\n  transition-property: scale, opacity, filter;\n  transition-duration: var(--media-popup-transition-duration);\n  transition-timing-function: var(--media-popup-transition-timing-function);\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    opacity: 0;\n    scale: 0.5;\n    filter: blur(8px);\n  }\n\n  &[data-instant] {\n    transition-duration: 0ms;\n  }\n\n  &[data-side=\"top\"] {\n    transform-origin: bottom;\n  }\n  &[data-side=\"bottom\"] {\n    transform-origin: top;\n  }\n  &[data-side=\"left\"] {\n    transform-origin: right;\n  }\n  &[data-side=\"right\"] {\n    transform-origin: left;\n  }\n\n  /* Safe area between trigger and popup */\n  &::before {\n    content: \"\";\n    position: absolute;\n    pointer-events: inherit;\n  }\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    width: 100%;\n    inset-inline: 0;\n  }\n  &[data-side=\"top\"]::before {\n    top: 100%;\n  }\n  &[data-side=\"bottom\"]::before {\n    bottom: 100%;\n  }\n\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    height: 100%;\n    inset-block: 0;\n  }\n  &[data-side=\"left\"]::before {\n    left: 100%;\n  }\n  &[data-side=\"right\"]::before {\n    right: 100%;\n  }\n}\n\n.media-minimal-skin .media-popover {\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-popover-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-popover-side-offset);\n  }\n}\n\n.media-minimal-skin .media-tooltip {\n  padding: 0.25rem 0.5rem;\n  border-radius: 0.5rem;\n  background-color: var(--media-tooltip-background-color);\n  backdrop-filter: var(--media-tooltip-backdrop-filter);\n  box-shadow:\n    0 0 0 1px var(--media-tooltip-border-color),\n    0 4px 6px -1px oklch(0 0 0 / 0.1),\n    0 2px 4px -2px oklch(0 0 0 / 0.1);\n  color: var(--media-tooltip-text-color);\n  font-size: 0.75rem; /* 12px at 100% font size */\n  white-space: nowrap;\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-tooltip-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-tooltip-side-offset);\n  }\n}\n\n.media-minimal-skin .media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n\n/* ==========================================================================\n   Native Caption Track\n   ========================================================================== */\n\n.media-minimal-skin {\n  --media-caption-track-duration: var(--media-controls-transition-duration);\n  --media-caption-track-delay: 25ms;\n  --media-caption-track-y: -0.5rem;\n\n  &:has(.media-controls[data-visible]) {\n    --media-caption-track-y: -5rem;\n  }\n\n  @container media-root (width > 42rem) {\n    &:has(.media-controls[data-visible]) > * {\n      --media-caption-track-y: -3rem;\n    }\n  }\n}\n\n.media-minimal-skin video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration) ease-out;\n  transition-delay: var(--media-caption-track-delay);\n  translate: 0 var(--media-caption-track-y);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\n}\n\n/* ==========================================================================\n   Icon State Visibility for Video Skins\n\n   Data-attribute-driven visibility rules for multi-state icon buttons.\n   Uses :is() with both element selectors (for HTML custom element wrappers)\n   and class selectors (for React rendered SVG elements).\n   ========================================================================== */\n\n/* --- All icons hidden by default --- */\n\n.media-button--play .media-icon--restart,\n.media-button--play .media-icon--play,\n.media-button--play .media-icon--pause,\n.media-button--mute .media-icon--volume-off,\n.media-button--mute .media-icon--volume-low,\n.media-button--mute .media-icon--volume-high,\n.media-button--fullscreen .media-icon--fullscreen-enter,\n.media-button--fullscreen .media-icon--fullscreen-exit,\n.media-button--pip .media-icon--pip-enter,\n.media-button--pip .media-icon--pip-exit,\n.media-button--cast .media-icon--cast-enter,\n.media-button--cast .media-icon--cast-exit,\n.media-button--captions .media-icon--captions-off,\n.media-button--captions .media-icon--captions-on {\n  display: none;\n  opacity: 0;\n}\n\n/* --- Active icon per state --- */\n\n/* Play: ended → restart */\n.media-button--play[data-ended] .media-icon--restart,\n/* Play: paused (not ended) → play */\n.media-button--play:not([data-ended])[data-paused] .media-icon--play,\n/* Play: playing (not paused, not ended) → pause */\n.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,\n/* Mute: muted → volume off */\n.media-button--mute[data-muted] .media-icon--volume-off,\n/* Mute: volume low (not muted) → volume low */\n.media-button--mute:not([data-muted])[data-volume-level=\"low\"] .media-icon--volume-low,\n/* Mute: volume high (not muted, not low) → volume high */\n.media-button--mute:not([data-muted]):not([data-volume-level=\"low\"]) .media-icon--volume-high,\n/* Fullscreen: not fullscreen → enter */\n.media-button--fullscreen:not([data-fullscreen]) .media-icon--fullscreen-enter,\n/* Fullscreen: fullscreen → exit */\n.media-button--fullscreen[data-fullscreen] .media-icon--fullscreen-exit,\n/* Picture-in-Picture: not active → enter */\n.media-button--pip:not([data-pip]) .media-icon--pip-enter,\n/* Picture-in-Picture: active → exit */\n.media-button--pip[data-pip] .media-icon--pip-exit,\n/* Cast: not connected → enter */\n.media-button--cast:not([data-cast-state=\"connected\"]) .media-icon--cast-enter,\n/* Cast: connected → exit */\n.media-button--cast[data-cast-state=\"connected\"] .media-icon--cast-exit,\n/* Captions: not active → captions off */\n.media-button--captions:not([data-active]) .media-icon--captions-off,\n/* Captions: active → captions on */\n.media-button--captions[data-active] .media-icon--captions-on {\n  display: block;\n  opacity: 1;\n}\n\n\n/* ==========================================================================\n   Root\n   ========================================================================== */\n\n.media-minimal-skin--video {\n  overflow: clip;\n  background: oklch(0 0 0);\n  --media-border-color: oklch(0 0 0 / 0.15);\n  --media-video-border-radius: var(--media-border-radius, 0.75rem);\n  --media-controls-background-color: transparent;\n  --media-controls-transition-duration: 100ms;\n  --media-controls-transition-timing-function: ease-out;\n  --media-error-dialog-transition-duration: 150ms;\n  --media-error-dialog-transition-delay: 100ms;\n  --media-error-dialog-transition-timing-function: ease-out;\n  --media-popup-transition-duration: 100ms;\n  --media-popup-transition-timing-function: ease-out;\n  --media-tooltip-background-color: oklch(1 0 0 / 0.1);\n  --media-tooltip-border-color: transparent;\n  --media-tooltip-backdrop-filter: blur(16px) saturate(1.5);\n  --media-tooltip-text-color: currentColor;\n  --media-tooltip-side-offset: 0.5rem;\n  --media-popover-side-offset: 1.5rem;\n\n  @media (prefers-reduced-motion: reduce) {\n    --media-error-dialog-transition-duration: 50ms;\n    --media-error-dialog-transition-delay: 0ms;\n    --media-popup-transition-duration: 0ms;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    --media-border-color: oklch(1 0 0 / 0.15);\n  }\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    --media-controls-background-color: oklch(0 0 0);\n    --media-tooltip-background-color: oklch(0 0 0);\n  }\n\n  @container media-root (width > 42rem) {\n    & > * {\n      --media-popover-side-offset: 0rem;\n    }\n  }\n\n  &:has(.media-controls:not([data-visible])) {\n    /* Slight delay to hide controls on non-touch devices after interaction */\n    @media (pointer: fine) {\n      --media-controls-transition-duration: 300ms;\n    }\n    @media (pointer: coarse) {\n      --media-controls-transition-duration: 150ms;\n    }\n    @media (prefers-reduced-motion: reduce) {\n      --media-controls-transition-duration: 50ms;\n    }\n  }\n\n  /* Inner border ring */\n  &::after {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    z-index: 10;\n    border-radius: inherit;\n    box-shadow: inset 0 0 0 1px var(--media-border-color);\n    pointer-events: none;\n  }\n\n  /* Fullscreen */\n  &:fullscreen {\n    --media-border-radius: 0;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin--video .media-error {\n  position: absolute;\n  inset: 0;\n  z-index: 20;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  pointer-events: none;\n  outline: none;\n}\n\n.media-minimal-skin--video .media-error__dialog {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  max-width: 16rem;\n  padding: 1rem;\n  color: oklch(1 0 0);\n  text-shadow: 0 1px 0 oklch(0 0 0 / 0.5);\n  transition-property: opacity, scale;\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n  transition-timing-function: var(--media-error-dialog-transition-timing-function);\n  pointer-events: auto;\n}\n\n.media-minimal-skin--video .media-error[data-starting-style] .media-error__dialog,\n.media-minimal-skin--video .media-error[data-ending-style] .media-error__dialog {\n  opacity: 0;\n  scale: 0.5;\n}\n.media-minimal-skin--video .media-error[data-ending-style] .media-error__dialog {\n  transition-delay: 0ms;\n}\n\n.media-minimal-skin--video .media-error__content {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  padding: 0.375rem 0;\n}\n\n.media-minimal-skin--video .media-error__title {\n  font-size: 1.125rem;\n}\n\n.media-minimal-skin--video .media-error[data-open] ~ .media-controls {\n  display: none;\n}\n\n/* ==========================================================================\n  Controls (hide/show behavior)\n  ========================================================================== */\n\n.media-minimal-skin--video .media-controls {\n  padding: 0.25rem;\n  column-gap: 0.5rem;\n  flex-wrap: wrap;\n  position: absolute;\n  bottom: 0.25rem;\n  inset-inline: 0.25rem;\n  z-index: 10;\n  color: oklch(1 0 0);\n  border-radius: 0.75rem;\n  transition-duration: var(--media-controls-transition-duration);\n  transition-timing-function: var(--media-controls-transition-timing-function);\n\n  @media (pointer: fine) {\n    will-change: translate, filter, opacity;\n    transition-property: translate, filter, opacity;\n  }\n\n  @media (pointer: coarse) {\n    will-change: translate, opacity;\n    transition-property: translate, opacity;\n  }\n\n  &:not([data-visible]) {\n    opacity: 0;\n    pointer-events: none;\n    translate: 0 100%;\n\n    @media (pointer: fine) {\n      filter: blur(8px);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      translate: 0 0;\n      filter: blur(0);\n    }\n  }\n\n  & .media-time-controls {\n    order: -1;\n    flex: 0 0 100%;\n    padding-inline: 0.625rem;\n  }\n\n  & .media-button-group:first-child {\n    flex: 1;\n    text-align: left;\n  }\n\n  & .media-button-group:last-child {\n    flex: 1;\n    justify-content: end;\n  }\n\n  @container media-root (width > 42rem) {\n    flex-wrap: nowrap;\n    bottom: 0.5rem;\n    inset-inline: 0.5rem;\n\n    & .media-time-controls {\n      order: unset;\n      flex: 1;\n    }\n\n    & .media-button-group:first-child,\n    & .media-button-group:last-child {\n      flex: 0 0 auto;\n    }\n  }\n}\n\n/* Hide cursor when controls are hidden */\n.media-minimal-skin--video:has(.media-controls:not([data-visible])) {\n  cursor: none;\n}\n\n/* ==========================================================================\n   Sliders\n   ========================================================================== */\n\n.media-minimal-skin--video .media-slider__track {\n  box-shadow: 0 0 0 1px oklch(0 0 0 / 0.05);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin--video .media-popover--volume {\n  background: transparent;\n  padding-block: 0.75rem;\n  border-radius: 0.75rem;\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    background: var(--media-controls-background-color);\n  }\n}\n\n/* ==========================================================================\n   Slider preview\n   ========================================================================== */\n\n.media-minimal-skin--video .media-slider__preview {\n  --media-preview-max-width: 11rem;\n  --media-preview-padding: -0.5rem;\n  /**\n    Inset is the difference between the container width and the slider (100%) width.\n    We only add to the end as we render the time there.\n  */\n  --media-preview-inset: calc(100cqi - 100%);\n\n  position: absolute;\n  left: clamp(\n    calc(var(--media-preview-max-width) / 2 + var(--media-preview-padding)),\n    var(--media-slider-pointer),\n    calc(100% - var(--media-preview-max-width) / 2 - var(--media-preview-padding) + var(--media-preview-inset))\n  );\n  bottom: 100%;\n  translate: -50%;\n  opacity: 0;\n  scale: 0.8;\n  filter: blur(8px);\n  transition-property: scale, opacity, filter;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  transform-origin: bottom;\n\n  @container media-root (width > 42rem) {\n    bottom: calc(100% + 0.25rem);\n    left: var(--media-slider-pointer);\n  }\n\n  & .media-preview__thumbnail-wrapper {\n    position: relative;\n\n    &::after {\n      content: \"\";\n      position: absolute;\n      inset: 0;\n      border-radius: inherit;\n      box-shadow:\n        0 0 0 1px oklch(0 0 0 / 0.05),\n        0 1px 3px 0 oklch(0 0 0 / 0.2),\n        0 1px 2px -1px oklch(0 0 0 / 0.2);\n    }\n  }\n\n  & .media-preview__thumbnail {\n    max-width: var(--media-preview-max-width);\n  }\n\n  &:has(.media-preview__thumbnail[data-loading]) {\n    max-height: 6rem;\n  }\n}\n.media-minimal-skin--video .media-slider[data-pointing] .media-slider__preview:has([role=\"img\"]:not([data-hidden])) {\n  opacity: 1;\n  scale: 1;\n  filter: blur(0);\n}\n\n";
 
 //#endregion
 //#region src/define/video/minimal-skin.ts
@@ -123,6 +123,12 @@ function getTemplateHTML() {
               Toggle captions
             </media-tooltip>
 
+            <media-cast-button commandfor="cast-tooltip" class="media-button media-button--subtle media-button--icon media-button--cast">
+              ${renderIcon("cast-enter", { class: "media-icon media-icon--cast-enter" })}
+              ${renderIcon("cast-exit", { class: "media-icon media-icon--cast-exit" })}
+            </media-cast-button>
+            <media-tooltip id="cast-tooltip" side="top" class="media-tooltip"></media-tooltip>
+
             <media-pip-button commandfor="pip-tooltip" class="media-button media-button--subtle media-button--icon media-button--pip">
               ${renderIcon("pip-enter", { class: "media-icon media-icon--pip-enter" })}
               ${renderIcon("pip-exit", { class: "media-icon media-icon--pip-exit" })}