@openrails/contentkit-ui 0.85.1 → 0.87.0-rc.1

package/dist/components/admin/media-item-panel.js

@@ -1,397 +1,409 @@
 import { toContentKitError as e } from "../../client/errors.js";
 import { samePath as t } from "../../client/media/client.js";
-import { useMessages as n } from "../../i18n/context.js";
-import { useErrorReporter as r, useGuarded as i } from "../../react/context.js";
-import { EncodeProgress as a } from "../encode-progress.js";
-import { isProcessing as o } from "../../client/media/windows.js";
-import { useMediaRead as s } from "../../react/read.js";
-import { usePublicImage as c } from "../../react/public.js";
-import { Alert as l, AlertDescription as u } from "../../ui/alert.js";
-import { Button as d } from "../../ui/button.js";
-import { SlotImage as f } from "../slot-image.js";
-import { VideoPosterPicker as p } from "../video-poster-picker.js";
-import { Badge as m } from "../../ui/badge.js";
-import { Input as h } from "../../ui/input.js";
-import { Label as g } from "../../ui/label.js";
-import { Select as _, SelectContent as v, SelectItem as y, SelectTrigger as b, SelectValue as x } from "../../ui/select.js";
-import { ErrorLine as S, useAction as C } from "../social/parts.js";
-import { AdminRoot as w, LoadFailed as T, NoAccess as E, Rows as D, useConfirm as O } from "./shell.js";
-import { Switch as k } from "../../ui/switch.js";
-import { useFlowClient as A } from "../../react/admin.js";
-import { useId as j, useRef as M, useState as N } from "react";
-import { Fragment as P, jsx as F, jsxs as I } from "react/jsx-runtime";
+import { acceptOf as n, isPattern as r } from "../../client/media/rules.js";
+import { useMessages as i } from "../../i18n/context.js";
+import { useContentKitClient as a, useErrorReporter as o, useGuarded as s } from "../../react/context.js";
+import { EncodeProgress as c } from "../encode-progress.js";
+import { isProcessing as l } from "../../client/media/windows.js";
+import { useMediaRead as u } from "../../react/read.js";
+import { usePublicImage as d } from "../../react/public.js";
+import { Alert as f, AlertDescription as p } from "../../ui/alert.js";
+import { Button as m } from "../../ui/button.js";
+import { SlotImage as h } from "../slot-image.js";
+import { VideoPosterPicker as g } from "../video-poster-picker.js";
+import { isSubtitleType as _, isVideoType as v } from "../../client/gallery.js";
+import { Badge as y } from "../../ui/badge.js";
+import { Input as b } from "../../ui/input.js";
+import { Label as x } from "../../ui/label.js";
+import { Select as S, SelectContent as C, SelectItem as w, SelectTrigger as T, SelectValue as E } from "../../ui/select.js";
+import { ErrorLine as D, useAction as O } from "../social/parts.js";
+import { AdminRoot as k, LoadFailed as A, NoAccess as j, Rows as M, useConfirm as N } from "./shell.js";
+import { Switch as P } from "../../ui/switch.js";
+import { useFlowClient as F } from "../../react/admin.js";
+import { useId as I, useRef as L, useState as R } from "react";
+import { Fragment as z, jsx as B, jsxs as V } from "react/jsx-runtime";
 //#region src/components/admin/media-item-panel.tsx
-var L = (e) => (e ?? []).map((e) => typeof e == "string" ? {
+function H(e) {
+	let t = (e, t) => e.types.length > 0 && e.types.every(t), n = e.find((e) => !r(e.path) && t(e, v))?.path;
+	return {
+		source: n,
+		poster: n ? e.find((e) => !r(e.path) && e.frames === n)?.path : void 0,
+		subtitles: e.find((e) => r(e.path) && t(e, _))?.path
+	};
+}
+var U = (e) => (e ?? []).map((e) => typeof e == "string" ? {
 	value: e,
 	label: e
-} : e), R = (e) => e.slice(0, e.indexOf("{name}"));
-function z({ client: e, baseUrl: t, auth: n, guard: r, appearance: i, className: a, language: o, messages: s, ...c }) {
-	let l = A({
+} : e), W = (e) => e.slice(0, e.indexOf("{name}"));
+function G({ client: e, baseUrl: t, auth: n, guard: r, appearance: i, className: a, language: o, messages: s, ...c }) {
+	let l = F({
 		client: e,
 		baseUrl: t,
 		auth: n
 	});
-	return /* @__PURE__ */ F(w, {
+	return /* @__PURE__ */ B(k, {
 		flow: "media-item-panel",
 		appearance: i,
 		className: a,
 		language: o,
 		messages: s,
 		guard: r,
-		children: /* @__PURE__ */ F(B, {
+		children: /* @__PURE__ */ B(K, {
 			...c,
 			client: l
 		})
 	});
 }
-function B({ item: e, client: r, source: i = "source", subtitles: a = "subs/{name}", poster: c = "poster", posterPreset: f = "poster", languages: p, onError: h }) {
-	let g = n(), { t: _ } = g, v = s(e, {
+function K({ item: e, client: r, source: o, subtitles: s, poster: c, posterPreset: d = "poster", languages: h, onError: g }) {
+	let _ = i(), { t: v } = _, b = a(r), x = u(e, {
 		editor: !0,
-		client: r
-	}), y = C("media.save", h);
-	if (!v.read) return v.error?.code === "not_found" ? /* @__PURE__ */ F(E, { children: _("mediaPanel.noAccess") }) : v.error ? /* @__PURE__ */ F(T, {
-		error: v.error,
-		message: _("mediaPanel.loadFailed"),
-		retry: v.reload
-	}) : /* @__PURE__ */ F(D, { count: 2 });
-	if (!v.read.uploads) return /* @__PURE__ */ F(E, { children: _("mediaPanel.noAccess") });
-	let b = v.read.files.filter((e) => e.upload && !e.unattached), x = b.find((e) => t(e.path, i)), w = b.filter((e) => e.failed), O = x ? w.length ? "failed" : b.some(o) ? "processing" : "ready" : "empty", k = a === null ? [] : b.filter((e) => e.path.startsWith(R(a)));
-	return /* @__PURE__ */ I(P, { children: [
-		/* @__PURE__ */ I("div", {
+		client: b
+	}), S = O("media.save", g);
+	if (!x.read) return x.error?.code === "not_found" ? /* @__PURE__ */ B(j, { children: v("mediaPanel.noAccess") }) : x.error ? /* @__PURE__ */ B(A, {
+		error: x.error,
+		message: v("mediaPanel.loadFailed"),
+		retry: x.reload
+	}) : /* @__PURE__ */ B(M, { count: 2 });
+	if (!x.read.uploads) return /* @__PURE__ */ B(j, { children: v("mediaPanel.noAccess") });
+	let C = x.read.uploads, w = H(C), T = o ?? w.source, E = c === void 0 ? w.poster : c, k = s === void 0 ? w.subtitles : s, N = (e) => n(C.filter((t) => t.path === e)), P = x.read.files.filter((e) => e.upload && !e.unattached), F = T ? P.find((e) => t(e.path, T)) : void 0, I = P.filter((e) => e.failed), L = F ? I.length ? "failed" : P.some(l) ? "processing" : "ready" : "empty", R = k ? P.filter((e) => e.path.startsWith(W(k))) : [];
+	return /* @__PURE__ */ V(z, { children: [
+		/* @__PURE__ */ V("div", {
 			className: "flex flex-wrap items-center gap-2",
 			children: [
-				/* @__PURE__ */ F("h2", {
+				/* @__PURE__ */ B("h2", {
 					className: "text-base font-semibold",
-					children: _("mediaPanel.title")
+					children: v("mediaPanel.title")
 				}),
-				/* @__PURE__ */ F(m, {
-					variant: O === "failed" ? "destructive" : O === "ready" ? "outline" : "secondary",
+				/* @__PURE__ */ B(y, {
+					variant: L === "failed" ? "destructive" : L === "ready" ? "outline" : "secondary",
 					"data-ckui": "media-state",
-					"data-state": O,
-					children: _(`mediaPanel.${O}`)
+					"data-state": L,
+					children: v(`mediaPanel.${L}`)
 				}),
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ B(m, {
 					size: "sm",
 					variant: "outline",
 					className: "ms-auto",
-					disabled: y.pending || !b.length,
-					onClick: () => void y.run(() => r.media.commit(e, [{ op: "regenerate" }])),
-					children: _("mediaPanel.regenerate")
+					disabled: S.pending || !P.length,
+					onClick: () => void S.run(() => b.media.commit(e, [{ op: "regenerate" }])),
+					children: v("mediaPanel.regenerate")
 				})
 			]
 		}),
-		/* @__PURE__ */ F(S, { error: y.error }),
-		w.map((e) => /* @__PURE__ */ F(l, {
+		/* @__PURE__ */ B(D, { error: S.error }),
+		I.map((e) => /* @__PURE__ */ B(f, {
 			variant: "destructive",
 			"data-ckui": "media-failure",
-			children: /* @__PURE__ */ F(u, { children: _("mediaPanel.failedFile", {
+			children: /* @__PURE__ */ B(p, { children: v("mediaPanel.failedFile", {
 				name: e.path.split("/").pop(),
-				reason: g.error({
+				reason: _.error({
 					code: e.failed.code,
 					message: e.failed.message,
 					status: 422
 				})
 			}) })
 		}, e.path)),
-		/* @__PURE__ */ F(U, {
+		T && /* @__PURE__ */ B(Y, {
 			item: e,
-			path: i,
-			video: x,
-			client: r,
-			onError: h
+			path: T,
+			accept: N(T) ?? "video/*",
+			video: F,
+			client: b,
+			onError: g
 		}),
-		c !== null && x && /* @__PURE__ */ F(W, {
+		T && E && F && /* @__PURE__ */ B(X, {
 			item: e,
-			path: c,
-			video: i,
-			preset: f,
-			client: r,
-			onError: h
+			path: E,
+			video: T,
+			preset: d,
+			client: b,
+			onError: g
 		}),
-		a !== null && /* @__PURE__ */ F(G, {
+		k && /* @__PURE__ */ B(Z, {
 			item: e,
-			pattern: a,
-			files: k,
-			languages: p,
-			client: r,
-			onError: h
+			pattern: k,
+			accept: N(k),
+			files: R,
+			languages: h,
+			client: b,
+			onError: g
 		})
 	] });
 }
-function V(e) {
+function q(e) {
 	if (!e) return "";
 	let t = e / (1 << 20);
 	return t >= 1024 ? `${(t / 1024).toFixed(1)} GB` : `${t.toFixed(+(t < 10))} MB`;
 }
-function H(e) {
+function J(e) {
 	if (!e) return "";
 	let t = Math.floor(e / 60), n = Math.round(e - t * 60);
 	return `${t}:${String(n).padStart(2, "0")}`;
 }
-function U({ item: t, path: s, video: c, client: l, onError: u }) {
-	let { t: f } = n(), p = M(null), [m, h] = N(null), g = r(u), _ = i(), [v, y] = N(null), b = async (n) => {
-		y(null);
+function Y({ item: t, path: n, accept: r, video: a, client: u, onError: d }) {
+	let { t: f } = i(), p = L(null), [h, g] = R(null), _ = o(d), v = s(), [y, b] = R(null), x = async (r) => {
+		b(null);
 		try {
-			await _(() => l.media.put(n, {
+			await v(() => u.media.put(r, {
 				ref: t,
-				path: s,
+				path: n,
 				wait: !1,
-				onProgress: h
+				onProgress: g
 			}));
 		} catch (t) {
 			let n = e(t);
-			y(n), g(n, "media.save");
+			b(n), _(n, "media.save");
 		} finally {
-			h(null);
+			g(null);
 		}
-	}, x = c ? [
-		c.w && c.h ? `${c.w}×${c.h}` : "",
-		H(c.dur),
-		V(c.size)
+	}, S = a ? [
+		a.w && a.h ? `${a.w}×${a.h}` : "",
+		J(a.dur),
+		q(a.size)
 	].filter(Boolean).join(" · ") : "";
-	return /* @__PURE__ */ I("section", {
+	return /* @__PURE__ */ V("section", {
 		className: "grid gap-2",
 		"data-ckui": "media-source",
 		children: [
-			/* @__PURE__ */ F("h3", {
+			/* @__PURE__ */ B("h3", {
 				className: "font-medium",
 				children: f("mediaPanel.source")
 			}),
-			/* @__PURE__ */ I("div", {
+			/* @__PURE__ */ V("div", {
 				className: "flex flex-wrap items-center gap-3",
 				children: [
-					/* @__PURE__ */ F("span", {
+					/* @__PURE__ */ B("span", {
 						className: "min-w-0 flex-1 text-muted-foreground",
-						children: c ? x || c.path : f("mediaPanel.noSource")
+						children: a ? S || a.path : f("mediaPanel.noSource")
 					}),
-					/* @__PURE__ */ F(d, {
+					/* @__PURE__ */ B(m, {
 						size: "sm",
 						variant: "outline",
-						disabled: !!m,
+						disabled: !!h,
 						onClick: () => p.current?.click(),
-						children: f(c ? "mediaPanel.replace" : "mediaPanel.upload")
+						children: f(a ? "mediaPanel.replace" : "mediaPanel.upload")
 					}),
-					/* @__PURE__ */ F("input", {
+					/* @__PURE__ */ B("input", {
 						ref: p,
 						type: "file",
-						accept: "video/*",
+						accept: r,
 						hidden: !0,
 						"aria-label": f("mediaPanel.source"),
 						onChange: (e) => {
 							let t = e.target.files?.[0];
-							e.target.value = "", t && b(t);
+							e.target.value = "", t && x(t);
 						}
 					})
 				]
 			}),
-			m && /* @__PURE__ */ I("div", {
+			h && /* @__PURE__ */ V("div", {
 				className: "grid gap-1",
 				role: "status",
-				children: [/* @__PURE__ */ F("div", {
+				children: [/* @__PURE__ */ B("div", {
 					className: "h-1.5 overflow-hidden rounded-full bg-muted",
-					children: /* @__PURE__ */ F("div", {
+					children: /* @__PURE__ */ B("div", {
 						className: "h-full bg-primary transition-[width]",
-						style: { width: `${m.total ? Math.round(m.loaded / m.total * 100) : 0}%` }
+						style: { width: `${h.total ? Math.round(h.loaded / h.total * 100) : 0}%` }
 					})
-				}), /* @__PURE__ */ F("span", {
+				}), /* @__PURE__ */ B("span", {
 					className: "text-xs text-muted-foreground",
-					children: f(`mediaPanel.phase_${m.phase}`)
+					children: f(`mediaPanel.phase_${h.phase}`)
 				})]
 			}),
-			c && o(c) && !m && /* @__PURE__ */ F(a, { progress: c.progress }),
-			/* @__PURE__ */ F(S, { error: v })
+			a && l(a) && !h && /* @__PURE__ */ B(c, { progress: a.progress }),
+			/* @__PURE__ */ B(D, { error: y })
 		]
 	});
 }
-function W({ item: e, path: t, video: r, preset: i, client: a, onError: o }) {
-	let { t: s } = n(), [l, u] = N(!1), { image: m, reload: h } = c(e, i, { client: a });
-	return /* @__PURE__ */ I("section", {
+function X({ item: e, path: t, video: n, preset: r, client: a, onError: o }) {
+	let { t: s } = i(), [c, l] = R(!1), { image: u, reload: f } = d(e, r, { client: a });
+	return /* @__PURE__ */ V("section", {
 		className: "grid gap-2",
 		"data-ckui": "media-poster",
 		children: [
-			/* @__PURE__ */ F("h3", {
+			/* @__PURE__ */ B("h3", {
 				className: "font-medium",
 				children: s("mediaPanel.poster")
 			}),
-			/* @__PURE__ */ I("div", {
+			/* @__PURE__ */ V("div", {
 				className: "flex flex-wrap items-center gap-3",
-				children: [/* @__PURE__ */ F("div", {
+				children: [/* @__PURE__ */ B("div", {
 					className: "w-40 overflow-hidden rounded-md border border-border",
-					children: /* @__PURE__ */ F(f, {
-						image: m,
-						fallback: /* @__PURE__ */ F("div", { className: "aspect-video bg-muted" })
+					children: /* @__PURE__ */ B(h, {
+						image: u,
+						fallback: /* @__PURE__ */ B("div", { className: "aspect-video bg-muted" })
 					})
-				}), /* @__PURE__ */ F(d, {
+				}), /* @__PURE__ */ B(m, {
 					size: "sm",
 					variant: "outline",
-					onClick: () => u(!0),
+					onClick: () => l(!0),
 					children: s("mediaPanel.choosePoster")
 				})]
 			}),
-			/* @__PURE__ */ F(p, {
-				open: l,
-				onOpenChange: u,
+			/* @__PURE__ */ B(g, {
+				open: c,
+				onOpenChange: l,
 				item: e,
-				video: r,
+				video: n,
 				path: t,
-				image: m,
+				image: u,
 				client: a,
 				onError: o,
-				onChange: () => h()
+				onChange: () => f()
 			})
 		]
 	});
 }
-function G({ item: e, pattern: t, files: r, languages: i, client: a, onError: o }) {
-	let { t: s } = n(), c = j(), l = L(i), [u, f] = N(l[0]?.value ?? ""), [p, w] = N(""), [T, E] = N(!1), [D, A] = N(null), P = M(null), R = C("media.save", o), z = C("media.save", o), { confirm: B, dialog: V } = O(), H = async () => {
-		if (!D || !u.trim()) return;
-		let n = u.trim(), r = `${n}${T ? "-forced" : ""}`;
-		await R.run(() => a.media.put(D, {
+function Z({ item: e, pattern: t, accept: n, files: r, languages: a, client: o, onError: s }) {
+	let { t: c } = i(), l = I(), u = U(a), [d, f] = R(u[0]?.value ?? ""), [p, h] = R(""), [g, _] = R(!1), [v, k] = R(null), A = L(null), j = O("media.save", s), M = O("media.save", s), { confirm: F, dialog: z } = N(), H = async () => {
+		if (!v || !d.trim()) return;
+		let n = d.trim(), r = `${n}${g ? "-forced" : ""}`;
+		await j.run(() => o.media.put(v, {
 			ref: e,
 			path: t.replace("{name}", r),
 			wait: !1,
 			meta: {
 				lang: n,
-				label: p.trim() || (l.find((e) => e.value === n)?.label ?? n),
-				forced: T
+				label: p.trim() || (u.find((e) => e.value === n)?.label ?? n),
+				forced: g
 			}
-		})) && (A(null), P.current && (P.current.value = ""), w(""), E(!1));
-	}, U = async (t) => {
-		await B({
-			title: s("mediaPanel.removeSubtitleTitle", { name: String(t.meta?.label ?? t.path) }),
-			confirm: s("common.remove")
-		}) && await z.run(() => a.media.commit(e, [{
+		})) && (k(null), A.current && (A.current.value = ""), h(""), _(!1));
+	}, W = async (t) => {
+		await F({
+			title: c("mediaPanel.removeSubtitleTitle", { name: String(t.meta?.label ?? t.path) }),
+			confirm: c("common.remove")
+		}) && await M.run(() => o.media.commit(e, [{
 			op: "remove",
 			path: t.path
 		}]));
 	};
-	return /* @__PURE__ */ I("section", {
+	return /* @__PURE__ */ V("section", {
 		className: "grid gap-2",
 		"data-ckui": "media-subtitles",
 		children: [
-			/* @__PURE__ */ F("h3", {
+			/* @__PURE__ */ B("h3", {
 				className: "font-medium",
-				children: s("mediaPanel.subtitles")
+				children: c("mediaPanel.subtitles")
 			}),
-			r.length ? /* @__PURE__ */ F("ul", {
+			r.length ? /* @__PURE__ */ B("ul", {
 				className: "grid divide-y divide-border rounded-lg border border-border",
-				children: r.map((e) => /* @__PURE__ */ I("li", {
+				children: r.map((e) => /* @__PURE__ */ V("li", {
 					className: "flex flex-wrap items-center gap-2 p-2.5",
 					"data-ckui": "subtitle",
 					children: [
-						/* @__PURE__ */ F(m, {
+						/* @__PURE__ */ B(y, {
 							variant: "outline",
 							children: String(e.meta?.lang ?? "?")
 						}),
-						/* @__PURE__ */ F("span", {
+						/* @__PURE__ */ B("span", {
 							className: "min-w-0 flex-1 break-words",
 							children: String(e.meta?.label ?? e.path.split("/").pop())
 						}),
-						e.meta?.forced === !0 && /* @__PURE__ */ F(m, {
+						e.meta?.forced === !0 && /* @__PURE__ */ B(y, {
 							variant: "secondary",
-							children: s("mediaPanel.forced")
+							children: c("mediaPanel.forced")
 						}),
-						e.failed && /* @__PURE__ */ F(m, {
+						e.failed && /* @__PURE__ */ B(y, {
 							variant: "destructive",
-							children: s("mediaPanel.failed")
+							children: c("mediaPanel.failed")
 						}),
-						/* @__PURE__ */ F(d, {
+						/* @__PURE__ */ B(m, {
 							size: "xs",
 							variant: "ghost",
-							disabled: z.pending,
-							onClick: () => void U(e),
-							children: s("common.remove")
+							disabled: M.pending,
+							onClick: () => void W(e),
+							children: c("common.remove")
 						})
 					]
 				}, e.path))
-			}) : /* @__PURE__ */ F("p", {
+			}) : /* @__PURE__ */ B("p", {
 				className: "text-muted-foreground",
-				children: s("mediaPanel.noSubtitles")
+				children: c("mediaPanel.noSubtitles")
 			}),
-			/* @__PURE__ */ I("form", {
+			/* @__PURE__ */ V("form", {
 				className: "grid gap-2 rounded-lg border border-dashed border-border p-3 sm:grid-cols-2",
 				onSubmit: (e) => {
 					e.preventDefault(), H();
 				},
 				children: [
-					/* @__PURE__ */ I("div", {
+					/* @__PURE__ */ V("div", {
 						className: "grid gap-1.5",
-						children: [/* @__PURE__ */ F(g, {
-							htmlFor: `${c}-file`,
-							children: s("mediaPanel.subtitleFile")
-						}), /* @__PURE__ */ F(h, {
-							id: `${c}-file`,
-							ref: P,
+						children: [/* @__PURE__ */ B(x, {
+							htmlFor: `${l}-file`,
+							children: c("mediaPanel.subtitleFile")
+						}), /* @__PURE__ */ B(b, {
+							id: `${l}-file`,
+							ref: A,
 							type: "file",
-							accept: ".vtt,.srt,text/vtt,application/x-subrip",
-							onChange: (e) => A(e.target.files?.[0] ?? null)
+							accept: n ?? ".vtt,.srt,text/vtt,application/x-subrip",
+							onChange: (e) => k(e.target.files?.[0] ?? null)
 						})]
 					}),
-					/* @__PURE__ */ I("div", {
+					/* @__PURE__ */ V("div", {
 						className: "grid gap-1.5",
-						children: [/* @__PURE__ */ F(g, {
-							htmlFor: `${c}-lang`,
-							children: s("mediaPanel.language")
-						}), l.length ? /* @__PURE__ */ I(_, {
-							value: u,
+						children: [/* @__PURE__ */ B(x, {
+							htmlFor: `${l}-lang`,
+							children: c("mediaPanel.language")
+						}), u.length ? /* @__PURE__ */ V(S, {
+							value: d,
 							onValueChange: (e) => f(String(e)),
-							children: [/* @__PURE__ */ F(b, {
-								id: `${c}-lang`,
+							children: [/* @__PURE__ */ B(T, {
+								id: `${l}-lang`,
 								className: "w-full",
-								children: /* @__PURE__ */ F(x, { children: (e) => l.find((t) => t.value === e)?.label ?? e })
-							}), /* @__PURE__ */ F(v, { children: l.map((e) => /* @__PURE__ */ F(y, {
+								children: /* @__PURE__ */ B(E, { children: (e) => u.find((t) => t.value === e)?.label ?? e })
+							}), /* @__PURE__ */ B(C, { children: u.map((e) => /* @__PURE__ */ B(w, {
 								value: e.value,
 								children: e.label
 							}, e.value)) })]
-						}) : /* @__PURE__ */ F(h, {
-							id: `${c}-lang`,
-							value: u,
+						}) : /* @__PURE__ */ B(b, {
+							id: `${l}-lang`,
+							value: d,
 							placeholder: "en",
 							onChange: (e) => f(e.target.value)
 						})]
 					}),
-					/* @__PURE__ */ I("div", {
+					/* @__PURE__ */ V("div", {
 						className: "grid gap-1.5",
-						children: [/* @__PURE__ */ F(g, {
-							htmlFor: `${c}-label`,
-							children: s("mediaPanel.label")
-						}), /* @__PURE__ */ F(h, {
-							id: `${c}-label`,
+						children: [/* @__PURE__ */ B(x, {
+							htmlFor: `${l}-label`,
+							children: c("mediaPanel.label")
+						}), /* @__PURE__ */ B(b, {
+							id: `${l}-label`,
 							value: p,
-							placeholder: s("mediaPanel.labelPlaceholder"),
-							onChange: (e) => w(e.target.value)
+							placeholder: c("mediaPanel.labelPlaceholder"),
+							onChange: (e) => h(e.target.value)
 						})]
 					}),
-					/* @__PURE__ */ I("div", {
+					/* @__PURE__ */ V("div", {
 						className: "flex items-center gap-2 self-end",
-						children: [/* @__PURE__ */ F(k, {
-							id: `${c}-forced`,
-							checked: T,
-							onCheckedChange: E
-						}), /* @__PURE__ */ F(g, {
-							htmlFor: `${c}-forced`,
-							children: s("mediaPanel.forcedLabel")
+						children: [/* @__PURE__ */ B(P, {
+							id: `${l}-forced`,
+							checked: g,
+							onCheckedChange: _
+						}), /* @__PURE__ */ B(x, {
+							htmlFor: `${l}-forced`,
+							children: c("mediaPanel.forcedLabel")
 						})]
 					}),
-					/* @__PURE__ */ F(S, {
-						error: R.error,
+					/* @__PURE__ */ B(D, {
+						error: j.error,
 						className: "sm:col-span-2"
 					}),
-					/* @__PURE__ */ F(d, {
+					/* @__PURE__ */ B(m, {
 						type: "submit",
 						size: "sm",
 						className: "justify-self-start",
-						disabled: R.pending || !D || !u.trim(),
-						children: R.pending ? s("common.saving") : s("mediaPanel.addSubtitle")
+						disabled: j.pending || !v || !d.trim(),
+						children: j.pending ? c("common.saving") : c("mediaPanel.addSubtitle")
 					})
 				]
 			}),
-			/* @__PURE__ */ F(S, { error: z.error }),
-			V
+			/* @__PURE__ */ B(D, { error: M.error }),
+			z
 		]
 	});
 }
 //#endregion
-export { z as MediaItemPanel };
+export { G as MediaItemPanel, K as VideoMediaEditor, H as videoPaths };
 
 //# sourceMappingURL=media-item-panel.js.map