highsoft-ui 1.0.146 → 1.0.148

package/dist/VideoCover-DqMDvzvA.js

@@ -0,0 +1,195 @@
+import { t as e } from "./clsx-BWCAbrjV.js";
+import { et as t } from "./esm-BnxclXHW.js";
+import { t as n } from "./Icon-VeXJMj8Q.js";
+import { t as r } from "./Typography-AvvBRu-u.js";
+import { forwardRef as i, useCallback as a, useEffect as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+var d = {
+	caption: "a1m2bq_caption",
+	content: "a1m2bq_content",
+	cover: "a1m2bq_cover",
+	figure: "a1m2bq_figure",
+	hoverZoom: "a1m2bq_hoverZoom",
+	playControl: "a1m2bq_playControl",
+	poster: "a1m2bq_poster",
+	reduced: "a1m2bq_reduced",
+	video: "a1m2bq_video"
+}, f = () => /* @__PURE__ */ l("svg", {
+	viewBox: "0 0 24 24",
+	"aria-hidden": "true",
+	focusable: "false",
+	fill: "currentColor",
+	children: /* @__PURE__ */ l("path", { d: "M8.5 5.65v12.7c0 .8.87 1.29 1.55.88l10.2-6.35a1.04 1.04 0 0 0 0-1.76L10.05 4.77a1.04 1.04 0 0 0-1.55.88Z" })
+}), p = () => /* @__PURE__ */ u("svg", {
+	viewBox: "0 0 24 24",
+	"aria-hidden": "true",
+	focusable: "false",
+	fill: "currentColor",
+	children: [/* @__PURE__ */ l("rect", {
+		x: "6.5",
+		y: "5",
+		width: "4",
+		height: "14",
+		rx: "1.6"
+	}), /* @__PURE__ */ l("rect", {
+		x: "13.5",
+		y: "5",
+		width: "4",
+		height: "14",
+		rx: "1.6"
+	})]
+}), m = () => /* @__PURE__ */ u("svg", {
+	viewBox: "0 0 24 24",
+	"aria-hidden": "true",
+	focusable: "false",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2.4",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	children: [/* @__PURE__ */ l("path", { d: "M20 8.5A8.06 8.06 0 1 0 20.94 12" }), /* @__PURE__ */ l("path", {
+		d: "M21 4v4.5h-4.5",
+		fill: "none"
+	})]
+}), h = i(({ src: i, sources: h, poster: g, fit: _ = "cover", autoPlay: v = !0, loop: ee = !1, muted: y = !0, playsInline: b = !0, preload: x = "auto", lazy: S = !0, hoverZoom: C = !1, reducedMotion: w, aspectRatio: T, radius: E = 0, playControl: D = !0, playWhenVisible: O = !0, caption: k, children: A, "aria-label": j, className: te, style: ne }, M) => {
+	let N = s(null), P = s(null), [F, I] = c(!S), [L, R] = c(!1), [z, B] = c("paused"), [V, H] = c(!1), U = s("none"), W = !j, G = a((e) => {
+		P.current = e, typeof M == "function" ? M(e) : M && (M.current = e);
+	}, [M]), [K, q] = c(() => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+	o(() => {
+		if (typeof window > "u" || !window.matchMedia) return;
+		let e = window.matchMedia("(prefers-reduced-motion: reduce)"), t = () => q(e.matches);
+		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
+	}, []);
+	let J = w === void 0 ? K ? "no-animation" : !1 : w === !0 ? "no-animation" : w, Y = J !== !1, X = v && !Y, Z = a(() => {
+		let e = P.current;
+		e && (e.pause(), J === "skip-to-end" && Number.isFinite(e.duration) ? e.currentTime = Math.max(0, e.duration - .05) : J === "no-animation" && (e.currentTime = 0));
+	}, [J]);
+	o(() => {
+		let e = P.current;
+		!e || !F || (Y ? Z() : v && !O && e.play().catch(() => {}));
+	}, [
+		Y,
+		F,
+		v,
+		O,
+		Z
+	]);
+	let Q = a(() => {
+		let e = P.current;
+		e && B(e.ended ? "ended" : e.paused ? "paused" : "playing");
+	}, []), re = a(() => {
+		let e = P.current;
+		if (e) {
+			if (!e.paused) {
+				U.current = "pause", e.pause();
+				return;
+			}
+			U.current = "play", e.ended && (e.currentTime = 0), e.play().catch(() => {});
+		}
+	}, []);
+	o(() => {
+		if (!O) return;
+		let e = N.current;
+		if (!e || typeof IntersectionObserver > "u") {
+			H(!0);
+			return;
+		}
+		let t = new IntersectionObserver(([e]) => H(!!e?.isIntersecting), { threshold: .2 });
+		return t.observe(e), () => t.disconnect();
+	}, [O]), o(() => {
+		let e = P.current;
+		!e || !F || !O || (V ? (U.current === "play" || X && U.current !== "pause") && e.paused && !e.ended && e.play().catch(() => {}) : e.paused || e.pause());
+	}, [
+		V,
+		F,
+		O,
+		X
+	]), o(() => {
+		if (F) return;
+		let e = N.current;
+		if (!e || typeof IntersectionObserver > "u") {
+			I(!0);
+			return;
+		}
+		let t = new IntersectionObserver(([e]) => {
+			e?.isIntersecting && (I(!0), t.disconnect());
+		}, { rootMargin: "200px" });
+		return t.observe(e), () => t.disconnect();
+	}, [F]);
+	let $ = /* @__PURE__ */ u("div", {
+		ref: N,
+		className: e("hsui-video-cover", d.cover, {
+			[d.hoverZoom]: C,
+			[d.reduced]: Y
+		}, te),
+		style: {
+			"--vc-radius": `${E}px`,
+			aspectRatio: T,
+			...ne
+		},
+		role: W ? "presentation" : "img",
+		"aria-label": j,
+		children: [
+			g && /* @__PURE__ */ l("img", {
+				className: d.poster,
+				style: { objectFit: _ },
+				src: g,
+				alt: "",
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ l("video", {
+				ref: G,
+				className: d.video,
+				style: { objectFit: _ },
+				src: F && !h ? i : void 0,
+				autoPlay: X && !O,
+				loop: ee,
+				muted: y,
+				playsInline: b,
+				preload: F ? x : "none",
+				"data-ready": L || void 0,
+				onCanPlay: () => {
+					R(!0), Q();
+				},
+				onLoadedMetadata: Y ? Z : void 0,
+				onPlay: Q,
+				onPause: Q,
+				onEnded: Q,
+				"aria-hidden": W || void 0,
+				children: F && h?.map((e) => /* @__PURE__ */ l("source", {
+					src: e.src,
+					type: e.type
+				}, e.src))
+			}),
+			A != null && /* @__PURE__ */ l("div", {
+				className: d.content,
+				children: A
+			}),
+			D && /* @__PURE__ */ l("button", {
+				type: "button",
+				className: d.playControl,
+				onClick: re,
+				"aria-label": z === "playing" ? "Pause video" : z === "ended" ? "Replay video" : "Play video",
+				children: l(z === "playing" ? p : z === "ended" ? m : f, {})
+			})
+		]
+	});
+	return k == null ? $ : /* @__PURE__ */ u("figure", {
+		className: e("hsui-video-cover-figure", d.figure),
+		children: [$, /* @__PURE__ */ u("figcaption", {
+			className: d.caption,
+			children: [/* @__PURE__ */ l(n, {
+				name: t,
+				size: 12
+			}), /* @__PURE__ */ l(r, {
+				as: "span",
+				size: 75,
+				color: "tertiary",
+				children: k
+			})]
+		})]
+	});
+});
+h.displayName = "VideoCover";
+//#endregion
+export { h as t };

package/dist/VideoPlayer-Cq_garSg.js

@@ -0,0 +1,455 @@
+import { t as e } from "./clsx-BWCAbrjV.js";
+import { C as t, E as n, a as r, i, k as a, o, r as s, t as ee, tt as c, x as l } from "./esm-BnxclXHW.js";
+import { t as u } from "./Icon-VeXJMj8Q.js";
+import { detectProvider as d, providerPosterUrl as f, useMediaEngine as p } from "./components/VideoPlayer/useMediaEngine.js";
+import { forwardRef as m, useCallback as h, useEffect as g, useId as _, useImperativeHandle as v, useRef as y, useState as b } from "react";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+var C = {
+	button: "_1OFWhq_button",
+	ccButton: "_1OFWhq_ccButton",
+	centerPlay: "_1OFWhq_centerPlay",
+	controlBar: "_1OFWhq_controlBar",
+	docked: "_1OFWhq_docked",
+	dragging: "_1OFWhq_dragging",
+	embed: "_1OFWhq_embed",
+	fullscreenTranscript: "_1OFWhq_fullscreenTranscript",
+	fullscreenTranscriptBody: "_1OFWhq_fullscreenTranscriptBody",
+	fullscreenTranscriptClose: "_1OFWhq_fullscreenTranscriptClose",
+	fullscreenTranscriptHeader: "_1OFWhq_fullscreenTranscriptHeader",
+	fullscreenTranscriptOpen: "_1OFWhq_fullscreenTranscriptOpen",
+	fullscreenTranscriptTitle: "_1OFWhq_fullscreenTranscriptTitle",
+	fullscreenTranscriptVisible: "_1OFWhq_fullscreenTranscriptVisible",
+	idle: "_1OFWhq_idle",
+	player: "_1OFWhq_player",
+	progress: "_1OFWhq_progress",
+	scrim: "_1OFWhq_scrim",
+	slider: "_1OFWhq_slider",
+	sliderBuffered: "_1OFWhq_sliderBuffered",
+	sliderFill: "_1OFWhq_sliderFill",
+	sliderThumb: "_1OFWhq_sliderThumb",
+	sliderTrack: "_1OFWhq_sliderTrack",
+	stack: "_1OFWhq_stack",
+	startCover: "_1OFWhq_startCover",
+	tapLayer: "_1OFWhq_tapLayer",
+	time: "_1OFWhq_time",
+	timeDuration: "_1OFWhq_timeDuration",
+	transcript: "_1OFWhq_transcript",
+	transcriptBody: "_1OFWhq_transcriptBody",
+	transcriptButton: "_1OFWhq_transcriptButton",
+	transcriptClip: "_1OFWhq_transcriptClip",
+	transcriptReveal: "_1OFWhq_transcriptReveal",
+	transcriptRevealOpen: "_1OFWhq_transcriptRevealOpen",
+	video: "_1OFWhq_video",
+	volumePopover: "_1OFWhq_volumePopover",
+	volumeSlider: "_1OFWhq_volumeSlider",
+	volumeWrap: "_1OFWhq_volumeWrap"
+}, te = "var(--HS-text-brand-default-alt)", ne = 2600, w = -4;
+function T(e) {
+	if (!Number.isFinite(e) || e < 0) return "0:00";
+	let t = Math.floor(e), n = Math.floor(t / 3600), r = Math.floor(t % 3600 / 60), i = t % 60, a = n > 0 ? String(r).padStart(2, "0") : String(r), o = String(i).padStart(2, "0");
+	return n > 0 ? `${n}:${a}:${o}` : `${a}:${o}`;
+}
+var E = (e) => Math.max(0, Math.min(1, e));
+function D({ value: t, buffered: n, ariaLabel: r, ariaValueText: i, className: a, step: o = .05, onChange: s, onScrubStart: ee, onScrubEnd: c }) {
+	let l = y(null), [u, d] = b(!1), f = (e) => `${E(e) * 100}%`, p = h((e) => {
+		let t = l.current;
+		if (!t) return 0;
+		let n = t.getBoundingClientRect();
+		return E((e - n.left) / n.width);
+	}, []), m = (e) => {
+		e.preventDefault(), l.current?.setPointerCapture(e.pointerId), d(!0), ee?.(), s(p(e.clientX));
+	}, g = (e) => {
+		u && s(p(e.clientX));
+	}, _ = (e) => {
+		u && (d(!1), c?.(), l.current?.releasePointerCapture?.(e.pointerId));
+	}, v = (e) => {
+		let n = null;
+		switch (e.key) {
+			case "ArrowRight":
+			case "ArrowUp":
+				n = t + o;
+				break;
+			case "ArrowLeft":
+			case "ArrowDown":
+				n = t - o;
+				break;
+			case "Home":
+				n = 0;
+				break;
+			case "End":
+				n = 1;
+				break;
+			default: return;
+		}
+		e.preventDefault(), e.stopPropagation(), s(E(n));
+	};
+	return /* @__PURE__ */ S("div", {
+		ref: l,
+		role: "slider",
+		tabIndex: 0,
+		"aria-label": r,
+		"aria-valuemin": 0,
+		"aria-valuemax": 100,
+		"aria-valuenow": Math.round(E(t) * 100),
+		"aria-valuetext": i,
+		className: e(C.slider, a, { [C.dragging]: u }),
+		onPointerDown: m,
+		onPointerMove: g,
+		onPointerUp: _,
+		onPointerCancel: _,
+		onKeyDown: v,
+		children: [/* @__PURE__ */ S("div", {
+			className: C.sliderTrack,
+			children: [n != null && /* @__PURE__ */ x("div", {
+				className: C.sliderBuffered,
+				style: { width: f(n) }
+			}), /* @__PURE__ */ x("div", {
+				className: C.sliderFill,
+				style: { width: f(t) }
+			})]
+		}), /* @__PURE__ */ x("span", {
+			className: C.sliderThumb,
+			style: { left: f(t) }
+		})]
+	});
+}
+var O = m(({ src: m, sources: O, poster: k, muted: re = !1, autoPlay: ie = !1, loop: A = !1, playsInline: ae = !0, preload: oe = "metadata", aspectRatio: se = "16 / 9", radius: j = 16, accentGradient: ce = te, tracks: M, transcript: N, transcriptTitle: P = "Transcript", "aria-label": F = "Video player", className: le, style: ue }, de) => {
+	let I = d(m, !!O?.length), L = I !== "file", R = !L && M ? M : [], z = R.map((e, t) => (e.kind ?? "captions") === "descriptions" ? -1 : t).filter((e) => e >= 0), B = p({
+		provider: I,
+		src: m,
+		muted: re,
+		autoPlay: ie,
+		loop: A
+	}), { state: V } = B, H = y(null), U = y(null), W = y(void 0), G = _(), fe = h((e) => {
+		U.current = e, B.videoRef(e);
+	}, [B]);
+	v(de, () => U.current, []);
+	let [K, pe] = b(!1), [me, q] = b(!1), [he, J] = b(!1), [ge, _e] = b(!1), [Y, ve] = b(() => R.findIndex((e) => e.default && (e.kind ?? "captions") !== "descriptions")), [X, Z] = b(!1), Q = _(), ye = y(null), be = y(null), [xe, Se] = b(void 0);
+	g(() => {
+		V.playing && _e(!0);
+	}, [V.playing]), g(() => {
+		if (Se(void 0), I !== "vimeo" || k || !m) return;
+		let e = !1;
+		return fetch(`https://vimeo.com/api/oembed.json?url=${encodeURIComponent(m)}&width=1280`).then((e) => e.ok ? e.json() : null).then((t) => {
+			!e && t?.thumbnail_url && Se(t.thumbnail_url);
+		}).catch(() => {}), () => {
+			e = !0;
+		};
+	}, [
+		I,
+		k,
+		m
+	]), g(() => {
+		let e = () => pe(document.fullscreenElement === H.current);
+		return document.addEventListener("fullscreenchange", e), () => document.removeEventListener("fullscreenchange", e);
+	}, []), g(() => {
+		K && X && be.current?.focus();
+	}, [K, X]);
+	let Ce = h(() => {
+		q(!1), window.clearTimeout(W.current), W.current = window.setTimeout(() => q(!0), ne);
+	}, []);
+	g(() => () => window.clearTimeout(W.current), []);
+	let $ = h(() => {
+		let e = H.current;
+		e && (document.fullscreenElement === e ? document.exitFullscreen().catch(() => {}) : e.requestFullscreen?.().catch(() => {}));
+	}, []), we = h(() => {
+		Z(!1), window.requestAnimationFrame(() => ye.current?.focus());
+	}, []);
+	g(() => {
+		let e = U.current;
+		if (!e || !R.length) return;
+		let t = e.textTracks;
+		for (let e = 0; e < t.length; e += 1) {
+			let n = t[e];
+			n && (n.mode = e === Y ? "showing" : "hidden");
+		}
+	}, [
+		Y,
+		R.length,
+		V.duration
+	]), g(() => {
+		let e = U.current;
+		if (!e || !R.length || typeof VTTCue > "u" || typeof CSS < "u" && CSS.supports?.("-webkit-box-reflect", "below 0px")) return;
+		let t = Array.from(e.textTracks).map((e) => {
+			let t = () => {
+				let t = e.cues ?? e.activeCues;
+				if (t) for (let e = 0; e < t.length; e += 1) {
+					let n = t[e];
+					n instanceof VTTCue && n.line !== w && (n.line = w);
+				}
+			};
+			return t(), e.addEventListener("cuechange", t), [e, t];
+		});
+		return () => t.forEach(([e, t]) => e.removeEventListener("cuechange", t));
+	}, [
+		R.length,
+		Y,
+		V.duration
+	]);
+	let Te = h(() => {
+		if (!z.length) return;
+		let e = z.indexOf(Y), t = e + 1 < z.length ? z[e + 1] ?? -1 : -1;
+		ve(e === -1 ? z[0] ?? -1 : t);
+	}, [z, Y]), Ee = (e) => {
+		if (e.target === e.currentTarget) switch (e.key) {
+			case " ":
+			case "k":
+				e.preventDefault(), B.toggle();
+				break;
+			case "f":
+				e.preventDefault(), $();
+				break;
+			case "m":
+				e.preventDefault(), B.toggleMute();
+				break;
+			case "c":
+				e.preventDefault(), Te();
+				break;
+			case "t":
+				N != null && (e.preventDefault(), Z((e) => !e));
+				break;
+			case "ArrowRight":
+				e.preventDefault(), B.seekBy(5);
+				break;
+			case "ArrowLeft":
+				e.preventDefault(), B.seekBy(-5);
+				break;
+			default:
+		}
+	}, De = k ?? f(I, m) ?? xe, Oe = V.duration ? E(V.currentTime / V.duration) : 0, ke = V.muted || V.volume === 0 ? s : V.volume < .5 ? i : r, Ae = {
+		"--vp-radius": `${j}px`,
+		"--vp-gradient": ce,
+		aspectRatio: K ? void 0 : se
+	}, je = I === "file" ? /* @__PURE__ */ S("video", {
+		ref: fe,
+		className: C.video,
+		src: O?.length ? void 0 : m,
+		poster: k,
+		muted: re,
+		autoPlay: ie,
+		loop: A,
+		playsInline: ae,
+		preload: oe,
+		onClick: B.toggle,
+		children: [O?.map((e) => /* @__PURE__ */ x("source", {
+			src: e.src,
+			type: e.type
+		}, e.src)), R.map((e) => /* @__PURE__ */ x("track", {
+			src: e.src,
+			srcLang: e.srclang,
+			label: e.label,
+			kind: e.kind ?? "captions"
+		}, e.src))]
+	}) : /* @__PURE__ */ x("div", {
+		ref: B.mountRef,
+		className: C.embed
+	}), Me = /* @__PURE__ */ S("div", {
+		ref: H,
+		role: "region",
+		"aria-label": F,
+		"aria-labelledby": G,
+		tabIndex: 0,
+		className: e("hsui-video-player", C.player, {
+			[C.playing]: V.playing,
+			[C.ended]: V.ended,
+			[C.idle]: me && V.playing && !he,
+			[C.docked]: N != null && X,
+			[C.fullscreenTranscriptVisible]: K && X
+		}, le),
+		style: {
+			...Ae,
+			...ue
+		},
+		onPointerMove: Ce,
+		onPointerLeave: () => V.playing && q(!0),
+		onKeyDown: Ee,
+		onDoubleClick: $,
+		children: [
+			/* @__PURE__ */ x("span", {
+				id: G,
+				className: "sr-only",
+				children: F
+			}),
+			je,
+			L && !ge && /* @__PURE__ */ x("div", {
+				className: C.startCover,
+				"aria-hidden": "true",
+				style: De ? { backgroundImage: `url("${De}")` } : void 0
+			}),
+			L && /* @__PURE__ */ x("button", {
+				type: "button",
+				className: C.tapLayer,
+				onClick: B.toggle,
+				"aria-label": V.playing ? "Pause" : "Play",
+				tabIndex: -1
+			}),
+			/* @__PURE__ */ x("div", {
+				className: C.scrim,
+				"aria-hidden": "true"
+			}),
+			!V.playing && /* @__PURE__ */ x("button", {
+				type: "button",
+				className: C.centerPlay,
+				onClick: B.toggle,
+				"aria-label": V.ended ? "Replay" : "Play",
+				tabIndex: -1,
+				children: /* @__PURE__ */ x(u, {
+					name: l,
+					size: 32
+				})
+			}),
+			/* @__PURE__ */ S("div", {
+				className: C.controlBar,
+				children: [
+					/* @__PURE__ */ x("button", {
+						type: "button",
+						className: C.button,
+						onClick: B.toggle,
+						"aria-label": V.playing ? "Pause" : "Play",
+						children: /* @__PURE__ */ x(u, {
+							name: V.playing ? t : l,
+							size: 20
+						})
+					}),
+					/* @__PURE__ */ S("div", {
+						className: C.volumeWrap,
+						children: [/* @__PURE__ */ x("button", {
+							type: "button",
+							className: C.button,
+							onClick: B.toggleMute,
+							"aria-label": V.muted ? "Unmute" : "Mute",
+							"aria-pressed": V.muted,
+							children: /* @__PURE__ */ x(u, {
+								name: ke,
+								size: 20
+							})
+						}), /* @__PURE__ */ x("div", {
+							className: C.volumePopover,
+							children: /* @__PURE__ */ x(D, {
+								className: C.volumeSlider,
+								value: V.volume,
+								ariaLabel: "Volume",
+								ariaValueText: `${Math.round(V.volume * 100)}%`,
+								onChange: B.setVolume
+							})
+						})]
+					}),
+					/* @__PURE__ */ x("span", {
+						className: C.time,
+						children: T(V.currentTime)
+					}),
+					/* @__PURE__ */ x(D, {
+						className: C.progress,
+						value: Oe,
+						buffered: V.buffered,
+						ariaLabel: "Seek",
+						ariaValueText: `${T(V.currentTime)} of ${T(V.duration)}`,
+						onChange: B.seekFraction,
+						onScrubStart: () => {
+							J(!0), B.beginSeek();
+						},
+						onScrubEnd: () => {
+							J(!1), B.endSeek();
+						}
+					}),
+					/* @__PURE__ */ x("span", {
+						className: e(C.time, C.timeDuration),
+						children: T(V.duration)
+					}),
+					N != null && /* @__PURE__ */ x("button", {
+						ref: ye,
+						type: "button",
+						className: e(C.button, C.transcriptButton),
+						onClick: () => Z((e) => !e),
+						"aria-expanded": X,
+						"aria-controls": Q,
+						"aria-label": X ? "Hide transcript" : "Show transcript",
+						children: /* @__PURE__ */ x(u, {
+							name: c,
+							size: 20
+						})
+					}),
+					z.length > 0 && /* @__PURE__ */ x("button", {
+						type: "button",
+						className: e(C.button, C.ccButton),
+						onClick: Te,
+						"aria-pressed": Y !== -1,
+						"aria-label": Y === -1 ? "Turn on captions" : z.length > 1 ? `Captions: ${R[Y]?.label ?? ""} — next track` : "Turn off captions",
+						children: /* @__PURE__ */ x(u, {
+							name: o,
+							size: 20
+						})
+					}),
+					/* @__PURE__ */ x("button", {
+						type: "button",
+						className: C.button,
+						onClick: $,
+						"aria-label": K ? "Exit fullscreen" : "Enter fullscreen",
+						children: /* @__PURE__ */ x(u, {
+							name: K ? n : a,
+							size: 20
+						})
+					})
+				]
+			}),
+			K && N != null && /* @__PURE__ */ S("aside", {
+				id: Q,
+				role: "region",
+				"aria-label": P,
+				"aria-hidden": !X,
+				inert: !X,
+				className: e(C.fullscreenTranscript, { [C.fullscreenTranscriptOpen]: X }),
+				onKeyDown: (e) => {
+					e.key === "Escape" && (e.preventDefault(), we());
+				},
+				children: [/* @__PURE__ */ S("div", {
+					className: C.fullscreenTranscriptHeader,
+					children: [/* @__PURE__ */ x("h2", {
+						className: C.fullscreenTranscriptTitle,
+						children: P
+					}), /* @__PURE__ */ x("button", {
+						ref: be,
+						type: "button",
+						className: C.fullscreenTranscriptClose,
+						onClick: we,
+						"aria-label": "Close transcript",
+						children: /* @__PURE__ */ x(u, {
+							name: ee,
+							size: 20
+						})
+					})]
+				}), /* @__PURE__ */ x("div", {
+					className: e(C.transcriptBody, C.fullscreenTranscriptBody),
+					children: N
+				})]
+			})
+		]
+	});
+	return N == null ? Me : /* @__PURE__ */ S("div", {
+		className: e("hsui-video-player-stack", C.stack),
+		children: [Me, !K && /* @__PURE__ */ x("div", {
+			className: e(C.transcriptReveal, { [C.transcriptRevealOpen]: X }),
+			inert: !X,
+			children: /* @__PURE__ */ x("div", {
+				className: C.transcriptClip,
+				children: /* @__PURE__ */ x("div", {
+					id: Q,
+					role: "region",
+					"aria-label": P,
+					className: C.transcript,
+					style: {
+						borderBottomLeftRadius: j,
+						borderBottomRightRadius: j
+					},
+					children: /* @__PURE__ */ x("div", {
+						className: C.transcriptBody,
+						children: N
+					})
+				})
+			})
+		})]
+	});
+});
+O.displayName = "VideoPlayer";
+//#endregion
+export { O as t };

package/dist/{VideoPlayerModal-DbP3OjSF.js → VideoPlayerModal-D1v1O2kW.js}

@@ -1,7 +1,7 @@
-import { n as e } from "./esm-B0YmMAXt.js";
+import { n as e } from "./esm-BnxclXHW.js";
 import { t } from "./dist-J9cXmrDi.js";
 import { a as n, i as r, n as i, o as a, r as o, s, t as c } from "./dist-f0z6DapB.js";
-import { t as l } from "./VideoPlayer-CKjq7IRq.js";
+import { t as l } from "./VideoPlayer-Cq_garSg.js";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 var f = {
 	close: "ig0T5q_close",

package/dist/{YoutubeModal-D_ZHayEn.js → YoutubeModal-BBYdQil8.js}

@@ -1,6 +1,6 @@
 import { s as e } from "./fa-B95RwBpz.js";
-import { t } from "./VideoCover-BN8wnHpf.js";
-import { t as n } from "./VideoPlayerModal-DbP3OjSF.js";
+import { t } from "./VideoCover-DqMDvzvA.js";
+import { t as n } from "./VideoPlayerModal-D1v1O2kW.js";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 var a = {
 	youtube: "elwCNG_youtube",
@@ -23,6 +23,8 @@ function u() {
 				}],
 				preload: "metadata",
 				hoverZoom: !0,
+				loop: !0,
+				playControl: !1,
 				children: /* @__PURE__ */ i("span", {
 					className: a.youtubeCopy,
 					children: [/* @__PURE__ */ r(e, {}), /* @__PURE__ */ r("p", { children: o })]

package/dist/components/Button/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../Button-DIGyNR41.js";
+import { t as e } from "../../Button-BGsqFCRW.js";
 export { e as Button };

package/dist/components/ButtonGroup/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../ButtonGroup-BSQzx-sZ.js";
+import { t as e } from "../../ButtonGroup-DKfaXOeS.js";
 export { e as ButtonGroup };

package/dist/components/Checkbox/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../Checkbox-wlH6EGWW.js";
+import { n as e, t } from "../../Checkbox-CniRhVkQ.js";
 export { t as Checkbox, e as CheckboxGroup };

package/dist/components/CodeBlock/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../CodeBlock-DtTAC5ru.js";
+import { t as e } from "../../CodeBlock-BeseY88j.js";
 export { e as CodeBlock };