@factorialco/f0-react 12.10.0 → 12.12.0

package/dist/F0AudioPlayer-BefDLQA2.js

@@ -0,0 +1,1083 @@
+import { a as e, r as t } from "./i18n-provider-Bdgo-LeP.js";
+import { n } from "./skeleton-AC0Fb8zj.js";
+import { L as r, R as i } from "./tooltip-BX4dSfeL.js";
+import { U as a, h as o, t as s } from "./F0Button-d91IgOnc.js";
+import { As as c, Pa as l, go as u, ho as d } from "./F0CanvasPanel-BOo_mxBl.js";
+import { o as f, t as p } from "./F0Icon-DmCBV0gK.js";
+import { t as m } from "./Check-DAp9gCRh.js";
+import { a as h, i as g, r as _ } from "./dist-CFY0KELA.js";
+import { A as v, H as y, L as b, M as x, N as S, a as C, ct as w, ft as ee, gt as T, ht as E, i as D, k as O, lt as k, mt as te, st as A, t as ne, tt as re } from "./popover-ics24JxK.js";
+import { n as ie } from "./scrollarea-cxaFAWG5.js";
+import { n as j, t as ae } from "./F0SegmentedControl-DXoAzTmH.js";
+import { i as oe, n as se, r as M, t as ce } from "./localized-BrUgGMzm.js";
+import * as N from "react";
+import { forwardRef as le, memo as P, useCallback as F, useEffect as I, useMemo as L, useRef as R, useState as z } from "react";
+import { Fragment as B, jsx as V, jsxs as H } from "react/jsx-runtime";
+//#region src/blocks/F0AudioPlayer/utils.ts
+var ue = (e) => Object.fromEntries(Object.entries(e).filter(([e]) => e.startsWith("data-"))), U = (e) => {
+	(!Number.isFinite(e) || e < 0) && (e = 0);
+	let t = Math.floor(e), n = Math.floor(t / 3600), r = Math.floor(t % 3600 / 60), i = t % 60, a = (e) => String(e).padStart(2, "0");
+	return n > 0 ? `${n}:${a(r)}:${a(i)}` : `${r}:${a(i)}`;
+}, de = (e) => e.map((e, t) => ({
+	start: e.startTime,
+	cueIndex: t
+})).filter((e) => typeof e.start == "number" && Number.isFinite(e.start)).sort((e, t) => e.start - t.start), fe = (e, t) => {
+	let n = 0, r = e.length - 1, i = -1;
+	for (; n <= r;) {
+		let a = n + r >> 1, o = e[a];
+		if (o === void 0) break;
+		o.start <= t ? (i = o.cueIndex, n = a + 1) : r = a - 1;
+	}
+	return i;
+}, W = /* @__PURE__ */ new Set([
+	"captions",
+	"subtitles",
+	"descriptions",
+	"metadata"
+]), pe = (e) => W.has(e), G = (e, t) => {
+	let n = e.querySelectorAll("track");
+	for (let e of Array.from(n)) if (e.track === t) return !1;
+	return !0;
+}, me = (e) => {
+	let t = e.cues;
+	if (!t || t.length === 0) return "";
+	let n = [];
+	for (let e of Array.from(t)) {
+		let t = e.text;
+		typeof t == "string" && t.trim() && n.push(t.trim());
+	}
+	return n.join("\n");
+}, he = (e, t, n) => {
+	let [r, i] = z();
+	return I(() => {
+		if (!n) {
+			i(void 0);
+			return;
+		}
+		let t = e.current;
+		if (!t) return;
+		let r = t.textTracks, a = () => {
+			let e = Array.from(r).filter((e) => pe(e.kind));
+			e.sort((e, n) => Number(G(t, n)) - Number(G(t, e)));
+			for (let t of e) {
+				t.mode === "disabled" && (t.mode = "hidden");
+				let e = me(t);
+				if (e) {
+					i(e);
+					return;
+				}
+			}
+		};
+		a();
+		let o = [], s = (e) => {
+			if (typeof e.addEventListener != "function") return;
+			let t = () => a();
+			e.addEventListener("cuechange", t), o.push(() => e.removeEventListener("cuechange", t));
+		};
+		Array.from(r).forEach(s);
+		let c = (e) => {
+			e.track && s(e.track), a();
+		}, l = typeof r.addEventListener == "function";
+		return l && r.addEventListener("addtrack", c), () => {
+			l && r.removeEventListener("addtrack", c), o.forEach((e) => e());
+		};
+	}, [
+		e,
+		n,
+		t
+	]), r;
+}, K = ["PageUp", "PageDown"], q = [
+	"ArrowUp",
+	"ArrowDown",
+	"ArrowLeft",
+	"ArrowRight"
+], ge = {
+	"from-left": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowLeft"
+	],
+	"from-right": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowRight"
+	],
+	"from-bottom": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowLeft"
+	],
+	"from-top": [
+		"Home",
+		"PageDown",
+		"ArrowUp",
+		"ArrowLeft"
+	]
+}, J = "Slider", [Y, X, _e] = w(J), [Z, Q] = te(J, [_e]), [ve, $] = Z(J), ye = N.forwardRef((e, t) => {
+	let { name: n, min: r = 0, max: i = 100, step: a = 1, orientation: o = "horizontal", disabled: s = !1, minStepsBetweenThumbs: c = 0, defaultValue: l = [r], value: u, onValueChange: d = () => {}, onValueCommit: f = () => {}, inverted: p = !1, form: m, ...h } = e, g = N.useRef(/* @__PURE__ */ new Set()), v = N.useRef(0), y = o === "horizontal" ? Se : Ce, [b = [], x] = ee({
+		prop: u,
+		defaultProp: l,
+		onChange: (e) => {
+			[...g.current][v.current]?.focus(), d(e);
+		}
+	}), S = N.useRef(b);
+	function C(e) {
+		D(e, Le(b, e));
+	}
+	function w(e) {
+		D(e, v.current);
+	}
+	function T() {
+		let e = S.current[v.current];
+		b[v.current] !== e && f(b);
+	}
+	function D(e, t, { commit: n } = { commit: !1 }) {
+		let o = He(a), s = Ue(Math.round((e - r) / a) * a + r, o), l = _(s, [r, i]);
+		x((e = []) => {
+			let r = Pe(e, l, t);
+			if (Be(r, c * a)) {
+				v.current = r.indexOf(l);
+				let t = String(r) !== String(e);
+				return t && n && f(r), t ? r : e;
+			}
+			return e;
+		});
+	}
+	return /* @__PURE__ */ V(ve, {
+		scope: e.__scopeSlider,
+		name: n,
+		disabled: s,
+		min: r,
+		max: i,
+		valueIndexToChangeRef: v,
+		thumbs: g.current,
+		values: b,
+		orientation: o,
+		form: m,
+		children: /* @__PURE__ */ V(Y.Provider, {
+			scope: e.__scopeSlider,
+			children: /* @__PURE__ */ V(Y.Slot, {
+				scope: e.__scopeSlider,
+				children: /* @__PURE__ */ V(y, {
+					"aria-disabled": s,
+					"data-disabled": s ? "" : void 0,
+					...h,
+					ref: t,
+					onPointerDown: E(h.onPointerDown, () => {
+						s || (S.current = b);
+					}),
+					min: r,
+					max: i,
+					inverted: p,
+					onSlideStart: s ? void 0 : C,
+					onSlideMove: s ? void 0 : w,
+					onSlideEnd: s ? void 0 : T,
+					onHomeKeyDown: () => !s && D(r, 0, { commit: !0 }),
+					onEndKeyDown: () => !s && D(i, b.length - 1, { commit: !0 }),
+					onStepKeyDown: ({ event: e, direction: t }) => {
+						if (!s) {
+							let n = K.includes(e.key) || e.shiftKey && q.includes(e.key) ? 10 : 1, r = v.current, i = b[r];
+							D(i + a * n * t, r, { commit: !0 });
+						}
+					}
+				})
+			})
+		})
+	});
+});
+ye.displayName = J;
+var [be, xe] = Z(J, {
+	startEdge: "left",
+	endEdge: "right",
+	size: "width",
+	direction: 1
+}), Se = N.forwardRef((e, t) => {
+	let { min: n, max: r, dir: i, inverted: a, onSlideStart: o, onSlideMove: s, onSlideEnd: c, onStepKeyDown: l, ...u } = e, [d, f] = N.useState(null), p = T(t, (e) => f(e)), m = N.useRef(void 0), h = A(i), g = h === "ltr", _ = g && !a || !g && a;
+	function v(e) {
+		let t = m.current || d.getBoundingClientRect(), i = Ve([0, t.width], _ ? [n, r] : [r, n]);
+		return m.current = t, i(e - t.left);
+	}
+	return /* @__PURE__ */ V(be, {
+		scope: e.__scopeSlider,
+		startEdge: _ ? "left" : "right",
+		endEdge: _ ? "right" : "left",
+		direction: _ ? 1 : -1,
+		size: "width",
+		children: /* @__PURE__ */ V(we, {
+			dir: h,
+			"data-orientation": "horizontal",
+			...u,
+			ref: p,
+			style: {
+				...u.style,
+				"--radix-slider-thumb-transform": "translateX(-50%)"
+			},
+			onSlideStart: (e) => {
+				let t = v(e.clientX);
+				o?.(t);
+			},
+			onSlideMove: (e) => {
+				let t = v(e.clientX);
+				s?.(t);
+			},
+			onSlideEnd: () => {
+				m.current = void 0, c?.();
+			},
+			onStepKeyDown: (e) => {
+				let t = ge[_ ? "from-left" : "from-right"].includes(e.key);
+				l?.({
+					event: e,
+					direction: t ? -1 : 1
+				});
+			}
+		})
+	});
+}), Ce = N.forwardRef((e, t) => {
+	let { min: n, max: r, inverted: i, onSlideStart: a, onSlideMove: o, onSlideEnd: s, onStepKeyDown: c, ...l } = e, u = N.useRef(null), d = T(t, u), f = N.useRef(void 0), p = !i;
+	function m(e) {
+		let t = f.current || u.current.getBoundingClientRect(), i = Ve([0, t.height], p ? [r, n] : [n, r]);
+		return f.current = t, i(e - t.top);
+	}
+	return /* @__PURE__ */ V(be, {
+		scope: e.__scopeSlider,
+		startEdge: p ? "bottom" : "top",
+		endEdge: p ? "top" : "bottom",
+		size: "height",
+		direction: p ? 1 : -1,
+		children: /* @__PURE__ */ V(we, {
+			"data-orientation": "vertical",
+			...l,
+			ref: d,
+			style: {
+				...l.style,
+				"--radix-slider-thumb-transform": "translateY(50%)"
+			},
+			onSlideStart: (e) => {
+				let t = m(e.clientY);
+				a?.(t);
+			},
+			onSlideMove: (e) => {
+				let t = m(e.clientY);
+				o?.(t);
+			},
+			onSlideEnd: () => {
+				f.current = void 0, s?.();
+			},
+			onStepKeyDown: (e) => {
+				let t = ge[p ? "from-bottom" : "from-top"].includes(e.key);
+				c?.({
+					event: e,
+					direction: t ? -1 : 1
+				});
+			}
+		})
+	});
+}), we = N.forwardRef((e, t) => {
+	let { __scopeSlider: n, onSlideStart: r, onSlideMove: i, onSlideEnd: a, onHomeKeyDown: o, onEndKeyDown: s, onStepKeyDown: c, ...l } = e, u = $(J, n);
+	return /* @__PURE__ */ V(k.span, {
+		...l,
+		ref: t,
+		onKeyDown: E(e.onKeyDown, (e) => {
+			e.key === "Home" ? (o(e), e.preventDefault()) : e.key === "End" ? (s(e), e.preventDefault()) : K.concat(q).includes(e.key) && (c(e), e.preventDefault());
+		}),
+		onPointerDown: E(e.onPointerDown, (e) => {
+			let t = e.target;
+			t.setPointerCapture(e.pointerId), e.preventDefault(), u.thumbs.has(t) ? t.focus() : r(e);
+		}),
+		onPointerMove: E(e.onPointerMove, (e) => {
+			e.target.hasPointerCapture(e.pointerId) && i(e);
+		}),
+		onPointerUp: E(e.onPointerUp, (e) => {
+			let t = e.target;
+			t.hasPointerCapture(e.pointerId) && (t.releasePointerCapture(e.pointerId), a(e));
+		})
+	});
+}), Te = "SliderTrack", Ee = N.forwardRef((e, t) => {
+	let { __scopeSlider: n, ...r } = e, i = $(Te, n);
+	return /* @__PURE__ */ V(k.span, {
+		"data-disabled": i.disabled ? "" : void 0,
+		"data-orientation": i.orientation,
+		...r,
+		ref: t
+	});
+});
+Ee.displayName = Te;
+var De = "SliderRange", Oe = N.forwardRef((e, t) => {
+	let { __scopeSlider: n, ...r } = e, i = $(De, n), a = xe(De, n), o = N.useRef(null), s = T(t, o), c = i.values.length, l = i.values.map((e) => Fe(e, i.min, i.max)), u = c > 1 ? Math.min(...l) : 0, d = 100 - Math.max(...l);
+	return /* @__PURE__ */ V(k.span, {
+		"data-orientation": i.orientation,
+		"data-disabled": i.disabled ? "" : void 0,
+		...r,
+		ref: s,
+		style: {
+			...e.style,
+			[a.startEdge]: u + "%",
+			[a.endEdge]: d + "%"
+		}
+	});
+});
+Oe.displayName = De;
+var ke = "SliderThumb", Ae = N.forwardRef((e, t) => {
+	let n = X(e.__scopeSlider), [r, i] = N.useState(null), a = T(t, (e) => i(e)), o = N.useMemo(() => r ? n().findIndex((e) => e.ref.current === r) : -1, [n, r]);
+	return /* @__PURE__ */ V(je, {
+		...e,
+		ref: a,
+		index: o
+	});
+}), je = N.forwardRef((e, t) => {
+	let { __scopeSlider: n, index: r, name: i, ...a } = e, o = $(ke, n), s = xe(ke, n), [c, l] = N.useState(null), u = T(t, (e) => l(e)), d = !c || o.form || !!c.closest("form"), f = re(c), p = o.values[r], m = p === void 0 ? 0 : Fe(p, o.min, o.max), h = Ie(r, o.values.length), g = f?.[s.size], _ = g ? Re(g, m, s.direction) : 0;
+	return N.useEffect(() => {
+		if (c) return o.thumbs.add(c), () => {
+			o.thumbs.delete(c);
+		};
+	}, [c, o.thumbs]), /* @__PURE__ */ H("span", {
+		style: {
+			transform: "var(--radix-slider-thumb-transform)",
+			position: "absolute",
+			[s.startEdge]: `calc(${m}% + ${_}px)`
+		},
+		children: [/* @__PURE__ */ V(Y.ItemSlot, {
+			scope: e.__scopeSlider,
+			children: /* @__PURE__ */ V(k.span, {
+				role: "slider",
+				"aria-label": e["aria-label"] || h,
+				"aria-valuemin": o.min,
+				"aria-valuenow": p,
+				"aria-valuemax": o.max,
+				"aria-orientation": o.orientation,
+				"data-orientation": o.orientation,
+				"data-disabled": o.disabled ? "" : void 0,
+				tabIndex: o.disabled ? void 0 : 0,
+				...a,
+				ref: u,
+				style: p === void 0 ? { display: "none" } : e.style,
+				onFocus: E(e.onFocus, () => {
+					o.valueIndexToChangeRef.current = r;
+				})
+			})
+		}), d && /* @__PURE__ */ V(Ne, {
+			name: i ?? (o.name ? o.name + (o.values.length > 1 ? "[]" : "") : void 0),
+			form: o.form,
+			value: p
+		}, r)]
+	});
+});
+Ae.displayName = ke;
+var Me = "RadioBubbleInput", Ne = N.forwardRef(({ __scopeSlider: e, value: t, ...n }, r) => {
+	let i = N.useRef(null), a = T(i, r), o = g(t);
+	return N.useEffect(() => {
+		let e = i.current;
+		if (!e) return;
+		let n = window.HTMLInputElement.prototype, r = Object.getOwnPropertyDescriptor(n, "value").set;
+		if (o !== t && r) {
+			let n = new Event("input", { bubbles: !0 });
+			r.call(e, t), e.dispatchEvent(n);
+		}
+	}, [o, t]), /* @__PURE__ */ V(k.input, {
+		style: { display: "none" },
+		...n,
+		ref: a,
+		defaultValue: t
+	});
+});
+Ne.displayName = Me;
+function Pe(e = [], t, n) {
+	let r = [...e];
+	return r[n] = t, r.sort((e, t) => e - t);
+}
+function Fe(e, t, n) {
+	let r = 100 / (n - t) * (e - t);
+	return _(r, [0, 100]);
+}
+function Ie(e, t) {
+	if (t > 2) return `Value ${e + 1} of ${t}`;
+	if (t === 2) return ["Minimum", "Maximum"][e];
+}
+function Le(e, t) {
+	if (e.length === 1) return 0;
+	let n = e.map((e) => Math.abs(e - t)), r = Math.min(...n);
+	return n.indexOf(r);
+}
+function Re(e, t, n) {
+	let r = e / 2;
+	return (r - Ve([0, 50], [0, r])(t) * n) * n;
+}
+function ze(e) {
+	return e.slice(0, -1).map((t, n) => e[n + 1] - t);
+}
+function Be(e, t) {
+	if (t > 0) {
+		let n = ze(e);
+		return Math.min(...n) >= t;
+	}
+	return !0;
+}
+function Ve(e, t) {
+	return (n) => {
+		if (e[0] === e[1] || t[0] === t[1]) return t[0];
+		let r = (t[1] - t[0]) / (e[1] - e[0]);
+		return t[0] + r * (n - e[0]);
+	};
+}
+function He(e) {
+	return (String(e).split(".")[1] || "").length;
+}
+function Ue(e, t) {
+	let n = 10 ** t;
+	return Math.round(e * n) / n;
+}
+var We = ye, Ge = Ee, Ke = Oe, qe = Ae, Je = We, Ye = Ge, Xe = Ke, Ze = qe, Qe = ({ currentTime: e, duration: n, buffered: i = 0, disabled: a, onSeek: o }) => {
+	let s = t(), [c, l] = z(null), u = R(!1), d = n > 0 ? n : 0, f = c ?? e, p = d > 0 ? Math.min(Math.max(f, 0), d) / d * 100 : 0, m = d > 0 ? Math.min(i / d * 100, 100) : 0, h = a || d === 0, g = R(null), [_, v] = z(0);
+	I(() => {
+		let e = g.current;
+		if (!e) return;
+		let t = () => v(e.clientWidth);
+		t();
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []);
+	let y = _ > 0 ? `${Math.round(_ * p / 100)}px` : `${p}%`, b = F((e) => {
+		let [t] = e;
+		t !== void 0 && u.current && l(t);
+	}, []), x = F((e) => {
+		let [t] = e;
+		t === void 0 || u.current || o(t);
+	}, [o]), S = F(() => {
+		u.current = !0;
+	}, []), C = F(() => {
+		u.current = !1, l(null);
+	}, []), w = F(() => {
+		u.current && (u.current = !1, l(null), c !== null && o(c));
+	}, [c, o]);
+	return /* @__PURE__ */ H(Je, {
+		value: [f],
+		onValueChange: b,
+		onValueCommit: x,
+		onPointerDown: S,
+		onPointerCancel: C,
+		onLostPointerCapture: w,
+		min: 0,
+		max: d || 1,
+		step: 1,
+		disabled: h,
+		className: r("group relative flex w-full touch-none select-none items-center py-2", a && "opacity-50"),
+		children: [
+			/* @__PURE__ */ H(Ye, {
+				ref: g,
+				className: "relative h-2 grow overflow-hidden rounded bg-f1-background-tertiary",
+				children: [/* @__PURE__ */ V("span", {
+					"aria-hidden": !0,
+					className: "absolute h-full bg-f1-background-secondary",
+					style: { width: `${m}%` }
+				}), /* @__PURE__ */ V("span", {
+					"aria-hidden": !0,
+					className: "absolute h-full bg-f1-background-selected-bold",
+					style: { width: `${p}%` }
+				})]
+			}),
+			h ? null : /* @__PURE__ */ V("span", {
+				"aria-hidden": !0,
+				style: { left: y },
+				className: r("pointer-events-none absolute top-1/2 size-3 -translate-x-1/2 -translate-y-1/2 rounded-full bg-f1-background-selected-bold opacity-0 transition-opacity", "group-hover:opacity-100 group-has-[:focus-visible]:opacity-100", "group-has-[:focus-visible]:ring-1 group-has-[:focus-visible]:ring-f1-special-ring group-has-[:focus-visible]:ring-offset-1")
+			}),
+			/* @__PURE__ */ V(Ze, {
+				"aria-label": s.audioPlayer.seek,
+				"aria-valuetext": s.t("audioPlayer.position", {
+					current: U(f),
+					total: U(d)
+				}),
+				className: "block size-3 opacity-0 focus-visible:outline-none"
+			})
+		]
+	});
+};
+//#endregion
+//#region src/blocks/F0AudioPlayer/components/LanguageSelect.tsx
+function $e({ value: e, options: t, onChange: n, kind: i }) {
+	let [a, o] = z(!1), c = t.find((t) => t.locale === e), l = c ? M(c) : e;
+	return /* @__PURE__ */ H(ne, {
+		open: a,
+		onOpenChange: o,
+		children: [/* @__PURE__ */ V(C, {
+			asChild: !0,
+			children: /* @__PURE__ */ V(s, {
+				variant: "outline",
+				size: "sm",
+				label: l,
+				"aria-label": `${i}: ${l}`,
+				tooltip: i
+			})
+		}), /* @__PURE__ */ V(D, {
+			align: "end",
+			sideOffset: 4,
+			className: r("flex w-auto min-w-[8rem] flex-col gap-0.5 rounded-md border", "border-solid border-f1-border-secondary bg-f1-background p-1 shadow-md"),
+			role: "menu",
+			"aria-label": i,
+			onKeyDown: (e) => {
+				let t = Array.from(e.currentTarget.querySelectorAll("[role=\"menuitemradio\"]"));
+				if (t.length === 0) return;
+				let n = t.indexOf(document.activeElement), r;
+				switch (e.key) {
+					case "ArrowDown":
+						r = n < 0 ? 0 : (n + 1) % t.length;
+						break;
+					case "ArrowUp":
+						r = n <= 0 ? t.length - 1 : n - 1;
+						break;
+					case "Home":
+						r = 0;
+						break;
+					case "End":
+						r = t.length - 1;
+						break;
+					default: return;
+				}
+				e.preventDefault(), t[r]?.focus();
+			},
+			children: t.map((t) => {
+				let i = t.locale === e;
+				return /* @__PURE__ */ H("button", {
+					type: "button",
+					role: "menuitemradio",
+					"aria-checked": i,
+					className: r("relative flex items-center rounded-xs py-1.5 pl-8 pr-3", "cursor-pointer border-none bg-transparent text-left text-sm font-medium", "text-f1-foreground transition-colors hover:bg-f1-background-secondary", "focus-visible:bg-f1-background-secondary focus-visible:outline-none", "[&_svg]:h-3.5 [&_svg]:w-3.5"),
+					onClick: () => {
+						n(t.locale), o(!1);
+					},
+					children: [i ? /* @__PURE__ */ V("span", {
+						className: "absolute left-2.5 inline-flex items-center",
+						children: /* @__PURE__ */ V(m, {})
+					}) : null, M(t)]
+				}, t.locale);
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/blocks/F0AudioPlayer/components/PlaybackTime.tsx
+var et = f({
+	base: "shrink-0 font-medium tabular-nums text-f1-foreground-secondary",
+	variants: { size: {
+		sm: "text-xs",
+		md: "text-sm"
+	} }
+}), tt = ({ currentTime: e, duration: t, size: n = "md" }) => /* @__PURE__ */ H("span", {
+	className: et({ size: n }),
+	children: [
+		U(e),
+		" / ",
+		U(t)
+	]
+}), nt = ({ isPlaying: e, disabled: n, size: a = "md", onToggle: o }) => {
+	let s = t(), c = e ? u : d;
+	return /* @__PURE__ */ V("button", {
+		type: "button",
+		"aria-label": e ? s.audioPlayer.pause : s.audioPlayer.play,
+		disabled: n,
+		onClick: o,
+		className: r("flex shrink-0 items-center justify-center rounded-xl border border-solid border-f1-border-secondary bg-f1-background-inverse-secondary text-f1-foreground-secondary transition-colors dark:bg-f1-background-tertiary", "hover:bg-f1-background-secondary disabled:cursor-not-allowed disabled:opacity-50", a === "sm" ? "size-8" : "size-10", i()),
+		children: /* @__PURE__ */ V(c, { className: a === "sm" ? "size-5" : "size-6" })
+	});
+}, rt = ({ playbackRate: e, playbackRates: n, onRateChange: i, disabled: a, extraItems: o = [], audioLanguages: l = [], audioLanguage: u, onAudioLanguageChange: d }) => {
+	let f = t(), m = n.length > 0, g = l.length > 1;
+	return /* @__PURE__ */ H(O, { children: [/* @__PURE__ */ V(y, {
+		asChild: !0,
+		children: /* @__PURE__ */ V(s, {
+			variant: "ghost",
+			size: "sm",
+			icon: c,
+			label: f.audioPlayer.options,
+			hideLabel: !0,
+			disabled: a
+		})
+	}), /* @__PURE__ */ H(v, {
+		align: "end",
+		className: "flex min-w-44 flex-col gap-0.5",
+		children: [
+			m ? /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V(S, {
+				className: "text-f1-foreground-secondary",
+				children: f.audioPlayer.playbackSpeed
+			}), n.map((t) => {
+				let n = t === e;
+				return /* @__PURE__ */ H(x, {
+					onSelect: () => i(t),
+					className: r("justify-between gap-3 px-3 text-sm text-f1-foreground", n && "before:absolute before:inset-x-1 before:inset-y-0 before:rounded before:bg-f1-background-selected-bold/10 before:content-[''] dark:before:bg-f1-background-selected-bold/20"),
+					children: [/* @__PURE__ */ H("span", {
+						className: "relative",
+						children: [t, "x"]
+					}), n ? /* @__PURE__ */ V("span", {
+						className: "relative flex text-f1-icon-selected",
+						children: /* @__PURE__ */ V(p, {
+							icon: h,
+							size: "md"
+						})
+					}) : null]
+				}, t);
+			})] }) : null,
+			g ? /* @__PURE__ */ H(B, { children: [
+				m ? /* @__PURE__ */ V(b, {}) : null,
+				/* @__PURE__ */ V(S, {
+					className: "text-f1-foreground-secondary",
+					children: f.audioPlayer.audio
+				}),
+				l.map((e) => {
+					let t = e.locale === u;
+					return /* @__PURE__ */ H(x, {
+						onSelect: () => d?.(e.locale),
+						className: r("justify-between gap-3 px-3 text-sm text-f1-foreground", t && "before:absolute before:inset-x-1 before:inset-y-0 before:rounded before:bg-f1-background-selected-bold/10 before:content-[''] dark:before:bg-f1-background-selected-bold/20"),
+						children: [/* @__PURE__ */ V("span", {
+							className: "relative",
+							children: M(e)
+						}), t ? /* @__PURE__ */ V("span", {
+							className: "relative flex text-f1-icon-selected",
+							children: /* @__PURE__ */ V(p, {
+								icon: h,
+								size: "md"
+							})
+						}) : null]
+					}, e.locale);
+				})
+			] }) : null,
+			o.length > 0 ? /* @__PURE__ */ H(B, { children: [m || g ? /* @__PURE__ */ V(b, {}) : null, o.map((e) => /* @__PURE__ */ H(x, {
+				onSelect: () => e.onClick(),
+				className: r("gap-2 px-3 text-sm", e.critical ? "text-f1-foreground-critical" : "text-f1-foreground"),
+				children: [e.icon ? /* @__PURE__ */ V("span", {
+					className: r("relative flex", e.critical ? "text-f1-icon-critical" : "text-f1-icon"),
+					children: /* @__PURE__ */ V(p, {
+						icon: e.icon,
+						size: "md"
+					})
+				}) : null, /* @__PURE__ */ V("span", {
+					className: "relative",
+					children: e.label
+				})]
+			}, e.label))] }) : null
+		]
+	})] });
+}, it = (e) => r("block w-full rounded px-2 py-1 text-left transition-colors", e ? "bg-f1-background-selected-secondary font-medium" : "bg-transparent"), at = P(function({ cue: e, index: n, isActive: a, onSeek: o, cueRefs: s }) {
+	let c = t(), { startTime: u } = e, d = o && u !== void 0, f = F((e) => {
+		s?.current && (s.current[n] = e);
+	}, [s, n]), p = F(() => {
+		u !== void 0 && o?.(u);
+	}, [o, u]);
+	return /* @__PURE__ */ V("li", {
+		ref: f,
+		children: d ? /* @__PURE__ */ V("button", {
+			type: "button",
+			onClick: p,
+			"aria-current": a || void 0,
+			title: c.t("audioPlayer.jumpTo", { time: U(u) }),
+			className: r(it(a), i(), !a && "hover:bg-f1-background-secondary"),
+			children: /* @__PURE__ */ V(l, {
+				as: "span",
+				variant: "body",
+				content: e.text
+			})
+		}) : /* @__PURE__ */ V("div", {
+			className: it(a),
+			children: /* @__PURE__ */ V(l, {
+				as: "span",
+				variant: "body",
+				content: e.text
+			})
+		})
+	});
+}), ot = P(function({ cues: e, activeIndex: n, onSeek: r, cueRefs: i }) {
+	let a = t();
+	return /* @__PURE__ */ H(B, { children: [r ? /* @__PURE__ */ V("p", {
+		className: "sr-only",
+		children: a.audioPlayer.transcriptHint
+	}) : null, /* @__PURE__ */ V("ol", {
+		className: "flex list-none flex-col gap-1 p-0",
+		children: e.map((e, t) => /* @__PURE__ */ V(at, {
+			cue: e,
+			index: t,
+			isActive: t === n,
+			onSeek: r,
+			cueRefs: i
+		}, t))
+	})] });
+});
+//#endregion
+//#region src/blocks/F0AudioPlayer/useAudioLanguage.ts
+function st(e, t) {
+	let n = L(() => ce(e), [e]), [r, i] = z(() => se(n, t)), a = n.some((e) => e.locale === r) ? r : se(n, t);
+	return {
+		languages: n,
+		activeLocale: a,
+		resolvedSrc: oe(e, a) ?? "",
+		setLocale: i
+	};
+}
+function ct(e) {
+	if (!e) return;
+	let t = e.currentTime, n = !e.paused, r = () => {
+		e.currentTime = t, n && e.play().catch(() => {}), e.removeEventListener("loadedmetadata", r);
+	};
+	e.addEventListener("loadedmetadata", r);
+}
+//#endregion
+//#region src/blocks/F0AudioPlayer/usePlayerController.ts
+var lt = (e) => {
+	let { src: t, duration: n, playing: r, onPlayingChange: i, playbackRates: a = [
+		1,
+		1.5,
+		2
+	], onPlay: o, onPause: s, onSeek: c, onTimeUpdate: l, onEnded: u, onError: d } = e, f = typeof t == "function" ? t : void 0, p = typeof t == "function" ? void 0 : t, m = R(null), [h, g] = z(p), _ = R(null), [v, y] = z(null), b = R(!1), x = R(!1), S = R(!1), C = F(async () => {
+		if (f && !b.current) {
+			b.current = !0;
+			try {
+				g(await f());
+			} catch {
+				x.current = !1, d?.(null);
+			} finally {
+				b.current = !1;
+			}
+		}
+	}, [f, d]), w = F(() => {
+		S.current = !1, o?.();
+	}, [o]), ee = F((e) => {
+		d?.(e), f && !S.current && (S.current = !0, x.current = !0, g(void 0), C());
+	}, [
+		d,
+		f,
+		C
+	]), T = j(m, {
+		onPlay: w,
+		onPause: s,
+		onSeek: c,
+		onTimeUpdate: l,
+		onEnded: u,
+		onError: ee
+	}, n ?? 0), E = T.seek, D = F((e) => {
+		let t = m.current, n = Math.max(e, 0);
+		t && h && t.readyState >= t.HAVE_METADATA ? E(n) : (_.current = n, y(n));
+	}, [E, h]);
+	I(() => {
+		let e = m.current;
+		if (!e) return;
+		let t = () => {
+			let e = _.current;
+			e !== null && (_.current = null, y(null), E(e));
+		};
+		return e.addEventListener("loadedmetadata", t), () => e.removeEventListener("loadedmetadata", t);
+	}, [E]), I(() => {
+		p !== void 0 && g(p);
+	}, [p]), I(() => {
+		h && x.current && (x.current = !1, T.play());
+	}, [h, T]);
+	let O = F(() => {
+		!T.isPlaying && !h && f ? (x.current = !0, C()) : T.toggle();
+	}, [
+		T,
+		h,
+		f,
+		C
+	]);
+	I(() => {
+		r !== void 0 && (r && !T.isPlaying ? !h && f ? (x.current = !0, C()) : T.play() : !r && T.isPlaying && T.pause());
+	}, [
+		r,
+		T,
+		h,
+		f,
+		C
+	]);
+	let k = R(T.isPlaying);
+	I(() => {
+		k.current !== T.isPlaying && (k.current = T.isPlaying, i?.(T.isPlaying));
+	}, [T.isPlaying, i]);
+	let te = v !== null && T.duration > 0 ? Math.min(v, T.duration) : null;
+	return {
+		audioRef: m,
+		currentSrc: h,
+		pendingTime: v,
+		isPlaying: T.isPlaying,
+		currentTime: te ?? T.currentTime,
+		duration: T.duration,
+		buffered: T.buffered,
+		playbackRate: T.playbackRate,
+		isLoading: T.isLoading,
+		error: T.error,
+		toggle: O,
+		seek: D,
+		setPlaybackRate: T.setPlaybackRate,
+		playbackRates: a
+	};
+}, ut = /* @__PURE__ */ new Set([
+	"ArrowUp",
+	"ArrowDown",
+	"PageUp",
+	"PageDown",
+	"Home",
+	"End",
+	" "
+]), dt = le((e, n) => {
+	let { title: i, subtitle: c, actions: l, className: u, src: d, preload: f, autoPlay: p = !1, disabled: m = !1, ariaLabel: h, size: g = "md", content: _, defaultLanguage: v, details: y, expanded: b, defaultExpanded: x = !1, onExpandedChange: S, detailsMaxHeight: C = 200 } = e, w = t(), T = st(d, v), E = lt({
+		...e,
+		src: T.resolvedSrc
+	}), D = ue(e), O = o(), k = (e) => {
+		ct(E.audioRef.current), T.setLocale(e);
+	}, te = !_ && !!(y && y.length > 0), A = L(() => ce(_?.summary, _?.transcription), [_?.summary, _?.transcription]), [ne, re] = z(() => se(A, v)), j = A.some((e) => e.locale === ne) ? ne : se(A, v), M = oe(_?.summary, j), N = oe(_?.transcription, j), le = he(E.audioRef, E.currentSrc, !N), P = N ?? le, B = Array.isArray(P) ? P : void 0, U = typeof P == "string" ? P : void 0, W = !!(U || B?.length), pe = L(() => B ? de(B) : [], [B]), G = pe.length > 0, me = E.pendingTime ?? E.currentTime, K = L(() => G ? fe(pe, me) : -1, [
+		G,
+		pe,
+		me
+	]), q = R(null), ge = R([]), J = R(!1), Y = F((e) => {
+		J.current = !1, E.seek(e);
+	}, [E.seek]);
+	I(() => {
+		let e = q.current;
+		if (!e) return;
+		let t = () => {
+			J.current = !0;
+		}, n = (e) => {
+			ut.has(e.key) && t();
+		}, r = (n) => {
+			e.contains(n.target) || t();
+		}, i = e.parentElement;
+		return e.addEventListener("wheel", t, { passive: !0 }), e.addEventListener("touchmove", t, { passive: !0 }), e.addEventListener("keydown", n), i?.addEventListener("pointerdown", r), () => {
+			e.removeEventListener("wheel", t), e.removeEventListener("touchmove", t), e.removeEventListener("keydown", n), i?.removeEventListener("pointerdown", r);
+		};
+	}, [W]);
+	let X = L(() => {
+		if (te) return y ?? [];
+		let e = [];
+		return M && e.push({
+			value: "summary",
+			label: w.audioPlayer.summary,
+			content: /* @__PURE__ */ V("p", {
+				className: "whitespace-pre-line",
+				children: M
+			})
+		}), W && e.push({
+			value: "transcription",
+			label: w.audioPlayer.transcription,
+			content: B ? /* @__PURE__ */ V(ot, {
+				cues: B,
+				activeIndex: K,
+				onSeek: G ? Y : void 0,
+				cueRefs: ge
+			}) : /* @__PURE__ */ V("p", {
+				className: "whitespace-pre-line",
+				children: U
+			})
+		}), e;
+	}, [
+		te,
+		y,
+		M,
+		W,
+		B,
+		U,
+		K,
+		G,
+		Y,
+		w.audioPlayer.summary,
+		w.audioPlayer.transcription
+	]), _e = W ? "available" : "missing", Z = X.length > 0, Q = X.length === 1 ? X[0] : void 0, ve = (e) => Q?.value === "transcription" ? e ? w.audioPlayer.hideTranscription : w.audioPlayer.viewTranscription : Q?.value === "summary" ? e ? w.audioPlayer.hideSummary : w.audioPlayer.viewSummary : e ? w.audioPlayer.hideDetail : w.audioPlayer.viewDetail, [$ = !1, ye] = ee({
+		prop: b,
+		defaultProp: x,
+		onChange: S
+	});
+	I(() => {
+		if (!$ || K < 0 || J.current) return;
+		let e = q.current, t = ge.current[K];
+		if (!e || !t) return;
+		let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = r.top - n.top, a = r.bottom - n.bottom;
+		i >= 0 && a <= 0 || e.scrollTo({
+			top: e.scrollTop + (i < 0 ? i : a),
+			behavior: O ? "auto" : "smooth"
+		});
+	}, [
+		K,
+		$,
+		O
+	]);
+	let [be, xe] = z(X[0]?.value), Se = X.some((e) => e.value === be) ? be : X[0]?.value, Ce = X.find((e) => e.value === Se)?.content;
+	return /* @__PURE__ */ H("div", {
+		ref: n,
+		role: "group",
+		"aria-label": h ?? i,
+		"data-audio-transcription": _e,
+		className: r("flex flex-col gap-2.5 rounded-2xl border border-solid border-f1-border-secondary bg-f1-background p-3", u),
+		...D,
+		children: [
+			/* @__PURE__ */ V("audio", {
+				ref: E.audioRef,
+				src: E.currentSrc,
+				preload: f ?? (typeof T.resolvedSrc == "function" ? "none" : "metadata"),
+				autoPlay: p
+			}),
+			/* @__PURE__ */ H("div", {
+				className: "flex items-start justify-between gap-2",
+				children: [/* @__PURE__ */ H("div", {
+					className: "flex min-w-0 flex-1 items-center gap-2.5",
+					children: [/* @__PURE__ */ V(nt, {
+						isPlaying: E.isPlaying,
+						disabled: m,
+						size: g,
+						onToggle: E.toggle
+					}), /* @__PURE__ */ H("div", {
+						className: "flex min-w-0 flex-col",
+						children: [/* @__PURE__ */ V("span", {
+							className: "truncate text-base font-medium text-f1-foreground",
+							children: i
+						}), c ? /* @__PURE__ */ V("span", {
+							className: "truncate text-base text-f1-foreground-secondary",
+							children: c
+						}) : null]
+					})]
+				}), Z || E.playbackRates.length > 0 || T.languages.length > 1 || l ? /* @__PURE__ */ H("div", {
+					className: "flex shrink-0 items-center gap-2",
+					children: [Z ? /* @__PURE__ */ V(s, {
+						variant: "outline",
+						size: "sm",
+						label: ve($),
+						onClick: () => ye(!$),
+						"aria-expanded": $
+					}) : null, E.playbackRates.length > 0 || T.languages.length > 1 || l ? /* @__PURE__ */ V(rt, {
+						playbackRate: E.playbackRate,
+						playbackRates: E.playbackRates,
+						onRateChange: E.setPlaybackRate,
+						disabled: m,
+						extraItems: l,
+						audioLanguages: T.languages,
+						audioLanguage: T.activeLocale,
+						onAudioLanguageChange: k
+					}) : null]
+				}) : null]
+			}),
+			/* @__PURE__ */ H("div", {
+				className: "flex w-full items-center gap-2",
+				children: [/* @__PURE__ */ V(Qe, {
+					currentTime: E.currentTime,
+					duration: E.duration,
+					buffered: E.buffered,
+					disabled: m,
+					onSeek: Y
+				}), /* @__PURE__ */ V(tt, {
+					currentTime: E.currentTime,
+					duration: E.duration,
+					size: g
+				})]
+			}),
+			Z ? /* @__PURE__ */ H(a.div, {
+				role: "region",
+				"aria-label": Q ? Q.label : w.audioPlayer.details,
+				initial: !1,
+				animate: {
+					height: $ ? "auto" : 0,
+					marginTop: $ ? 0 : "-0.625rem",
+					opacity: +!!$,
+					visibility: $ ? "visible" : "hidden"
+				},
+				transition: {
+					duration: O ? 0 : .15,
+					ease: [
+						.165,
+						.84,
+						.44,
+						1
+					]
+				},
+				className: "overflow-hidden",
+				children: [
+					A.length > 1 && j ? /* @__PURE__ */ V("div", {
+						className: "flex justify-end pb-2.5",
+						children: /* @__PURE__ */ V($e, {
+							value: j,
+							options: A,
+							onChange: re,
+							kind: w.audioPlayer.language
+						})
+					}) : null,
+					Q ? null : /* @__PURE__ */ V(ae, {
+						fullWidth: !0,
+						ariaLabel: w.audioPlayer.details,
+						value: Se,
+						onChange: xe,
+						items: X.map((e) => ({
+							value: e.value,
+							label: e.label
+						}))
+					}),
+					/* @__PURE__ */ V("div", {
+						className: Q ? void 0 : "pt-2.5",
+						children: /* @__PURE__ */ V(ie, {
+							viewportRef: q,
+							style: { "--audio-details-max-h": `${C}px` },
+							className: "[&_[data-scroll-container]]:max-h-[var(--audio-details-max-h)]",
+							children: /* @__PURE__ */ V("div", {
+								className: "break-words pr-1 text-base text-f1-foreground",
+								children: Ce
+							})
+						})
+					})
+				]
+			}) : null
+		]
+	});
+});
+dt.displayName = "F0AudioPlayerCard";
+//#endregion
+//#region src/blocks/F0AudioPlayer/F0AudioPlayer.tsx
+var ft = f({
+	base: "flex w-full items-center",
+	variants: { size: {
+		sm: "gap-2",
+		md: "gap-3"
+	} }
+}), pt = le((e, n) => {
+	let { src: i, preload: a, autoPlay: o = !1, disabled: s = !1, ariaLabel: c, size: l = "md", defaultLanguage: u, className: d } = e, f = t(), p = st(i, u), m = lt({
+		...e,
+		src: p.resolvedSrc
+	}), h = ue(e), g = (e) => {
+		ct(m.audioRef.current), p.setLocale(e);
+	};
+	return /* @__PURE__ */ H("div", {
+		ref: n,
+		role: "group",
+		"aria-label": c ?? f.audioPlayer.label,
+		className: r(ft({ size: l }), d),
+		...h,
+		children: [
+			/* @__PURE__ */ V("audio", {
+				ref: m.audioRef,
+				src: m.currentSrc,
+				preload: a ?? (typeof p.resolvedSrc == "function" ? "none" : "metadata"),
+				autoPlay: o
+			}),
+			/* @__PURE__ */ V(nt, {
+				isPlaying: m.isPlaying,
+				disabled: s,
+				size: l,
+				onToggle: m.toggle
+			}),
+			/* @__PURE__ */ V(Qe, {
+				currentTime: m.currentTime,
+				duration: m.duration,
+				buffered: m.buffered,
+				disabled: s,
+				onSeek: m.seek
+			}),
+			/* @__PURE__ */ V(tt, {
+				currentTime: m.currentTime,
+				duration: m.duration,
+				size: l
+			}),
+			p.languages.length > 1 && p.activeLocale ? /* @__PURE__ */ V($e, {
+				value: p.activeLocale,
+				options: p.languages,
+				onChange: g,
+				kind: f.audioPlayer.audio
+			}) : null
+		]
+	});
+});
+pt.displayName = "F0AudioPlayer";
+var mt = n("F0AudioPlayer", e(pt)), ht = n("F0AudioPlayerCard", e(dt));
+//#endregion
+export { Ze as a, U as c, Xe as i, ht as n, Ye as o, Je as r, he as s, mt as t };