@camstack/addon-pipeline 1.1.56 → 1.1.57

package/dist/stream-broker/_stub.js

@@ -2,7 +2,7 @@ import { a as e, c as t, d as n, i as r, l as i, n as a, o, r as s, s as c, t as
 import { a as d, i as f, n as p, o as m, r as h, t as g } from "./_virtual_mf___mfe_internal__addon_stream_broker_widgets__loadShare__react__loadShare__.js-C9j-2lBe.mjs";
 import { n as _, r as v, t as y } from "./_virtual_mf___mfe_internal__addon_stream_broker_widgets__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.js-XO0-Pyu6.mjs";
 import { n as b, t as x } from "./_virtual_mf___mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.js-BO7TIbJV.mjs";
-import { t as S } from "./_virtual_mf___mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_camstack_mf_1_types__loadShare__.js-D2z_vRMH.mjs";
+import { t as S } from "./_virtual_mf___mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_camstack_mf_1_types__loadShare__.js-Ba7Eyd47.mjs";
 //#region ../../node_modules/lucide-react/dist/esm/shared/src/utils.js
 var C = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), w = (e) => e.replace(/^([A-Z])|[\s-_]+(\w)/g, (e, t, n) => n ? n.toUpperCase() : t.toLowerCase()), T = (e) => {
 	let t = w(e);
@@ -37,19 +37,46 @@ var C = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), w = (e) =
 		...r
 	}));
 	return n.displayName = T(e), n;
-}, j = A("chevron-down", [["path", {
+}, j = A("check", [["path", {
+	d: "M20 6 9 17l-5-5",
+	key: "1gmf2c"
+}]]), M = A("chevron-down", [["path", {
 	d: "m6 9 6 6 6-6",
 	key: "qrunsl"
-}]]), M = A("chevron-right", [["path", {
+}]]), N = A("chevron-right", [["path", {
 	d: "m9 18 6-6-6-6",
 	key: "mthhwq"
-}]]), ee = A("plus", [["path", {
+}]]), ee = A("circle-alert", [
+	["circle", {
+		cx: "12",
+		cy: "12",
+		r: "10",
+		key: "1mglay"
+	}],
+	["line", {
+		x1: "12",
+		x2: "12",
+		y1: "8",
+		y2: "12",
+		key: "1pkeuh"
+	}],
+	["line", {
+		x1: "12",
+		x2: "12.01",
+		y1: "16",
+		y2: "16",
+		key: "4dfq90"
+	}]
+]), te = A("loader-circle", [["path", {
+	d: "M21 12a9 9 0 1 1-6.219-8.56",
+	key: "13zald"
+}]]), ne = A("plus", [["path", {
 	d: "M5 12h14",
 	key: "1ays0h"
 }], ["path", {
 	d: "M12 5v14",
 	key: "s699le"
-}]]), N = A("radio", [
+}]]), P = A("radio", [
 	["path", {
 		d: "M4.9 19.1C1 15.2 1 8.8 4.9 4.9",
 		key: "1vaf9d"
@@ -72,7 +99,7 @@ var C = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), w = (e) =
 		d: "M19.1 4.9C23 8.8 23 15.1 19.1 19",
 		key: "10b0cb"
 	}]
-]), te = A("x", [["path", {
+]), re = A("x", [["path", {
 	d: "M18 6 6 18",
 	key: "1bl5f8"
 }], ["path", {
@@ -81,7 +108,7 @@ var C = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), w = (e) =
 }]]);
 //#endregion
 //#region src/stream-broker/widgets/GeometryBuilder.tsx
-function ne(e) {
+function ie(e) {
 	let t = [];
 	if (e.crop && t.push(`crop=${e.crop.w}:${e.crop.h}:${e.crop.x}:${e.crop.y}`), e.targetAspect && e.width !== void 0 && e.height !== void 0) {
 		let n = e.targetAspect.replace(":", "/");
@@ -89,7 +116,7 @@ function ne(e) {
 	}
 	return e.rotate === 90 ? t.push("transpose=1") : e.rotate === 270 ? t.push("transpose=2") : e.rotate === 180 && t.push("hflip", "vflip"), e.hflip && e.rotate !== 180 && t.push("hflip"), e.vflip && e.rotate !== 180 && t.push("vflip"), t.join(",");
 }
-function re(e, t) {
+function ae(e, t) {
 	let n = [];
 	for (let t = 0; t < e.length; t++) {
 		if (e[t] === "-vf") {
@@ -101,9 +128,9 @@ function re(e, t) {
 	}
 	return t.length > 0 && n.push("-vf", t), n;
 }
-var P = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium";
-function ie({ outputArgs: e, onChange: t }) {
-	let [n, r] = m(""), [i, a] = m("pad"), [o, s] = m("1920"), [c, l] = m("1080"), [u, d] = m(!1), [f, p] = m("0"), [h, g] = m("0"), [b, x] = m("0"), [S, C] = m("0"), [w, T] = m(0), [E, D] = m(!1), [O, k] = m(!1), A = ne((() => {
+var F = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium";
+function oe({ outputArgs: e, onChange: t }) {
+	let [n, r] = m(""), [i, a] = m("pad"), [o, s] = m("1920"), [c, l] = m("1080"), [u, d] = m(!1), [f, p] = m("0"), [h, g] = m("0"), [b, x] = m("0"), [S, C] = m("0"), [w, T] = m(0), [E, D] = m(!1), [O, k] = m(!1), A = ie((() => {
 		let e = {
 			rotate: w,
 			hflip: E,
@@ -122,14 +149,14 @@ function ie({ outputArgs: e, onChange: t }) {
 			/* @__PURE__ */ v("div", {
 				className: "flex items-center justify-between",
 				children: [/* @__PURE__ */ v("span", {
-					className: P,
+					className: F,
 					children: ["Geometry / zoom", /* @__PURE__ */ _("span", {
 						className: "ml-2 text-[10px] normal-case text-foreground-subtle italic",
 						children: "composes a single -vf into output args"
 					})]
 				}), /* @__PURE__ */ _("button", {
 					type: "button",
-					onClick: () => t(re(e, A)),
+					onClick: () => t(ae(e, A)),
 					className: "rounded-md border border-border bg-surface-hover px-2 py-0.5 text-[10px] font-medium text-foreground hover:bg-surface-hover/70 transition-colors",
 					children: "Apply geometry"
 				})]
@@ -138,7 +165,7 @@ function ie({ outputArgs: e, onChange: t }) {
 				className: "flex flex-wrap items-center gap-2",
 				children: [
 					/* @__PURE__ */ _("label", {
-						className: P,
+						className: F,
 						htmlFor: "geom-aspect",
 						children: "Aspect"
 					}),
@@ -249,7 +276,7 @@ function ie({ outputArgs: e, onChange: t }) {
 				className: "flex flex-wrap items-center gap-2",
 				children: [
 					/* @__PURE__ */ _("label", {
-						className: P,
+						className: F,
 						htmlFor: "geom-rotate",
 						children: "Rotate"
 					}),
@@ -307,7 +334,7 @@ function ie({ outputArgs: e, onChange: t }) {
 }
 //#endregion
 //#region src/stream-broker/widgets/FfmpegParamsField.tsx
-var ae = [
+var se = [
 	{
 		group: "Demuxer",
 		label: "-thread_queue_size 1024",
@@ -362,7 +389,7 @@ var ae = [
 		args: ["-fflags", "+genpts+igndts"],
 		description: "Generate PTS + ignore DTS"
 	}
-], oe = [
+], ce = [
 	{
 		group: "Muxer",
 		label: "-flush_packets 1",
@@ -453,138 +480,152 @@ var ae = [
 		args: ["-muxdelay", "0"],
 		description: "No mux buffering delay"
 	}
-], se = {
+], le = {
 	video: { codec: "copy" },
 	audio: "passthrough"
-}, F = "w-full rounded border border-border bg-surface-2 px-2 py-1.5 text-[11px] font-mono text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 read-only:opacity-60 min-h-[60px] resize-y", I = "flex items-center justify-between gap-3 py-1.5", L = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium", R = "rounded-lg border border-border bg-surface overflow-hidden", z = "border-b border-border px-3 py-1.5 flex items-center justify-between bg-surface-hover/30", B = "text-[11px] font-semibold text-foreground uppercase tracking-wider";
-function ce({ config: e, value: t, onSave: n }) {
-	let [r, i] = m(!1), a = e.argsOnly === !0, o = t ?? se, [s, c] = m(() => (o.inputArgs ?? []).join("\n")), [l, u] = m(() => (o.outputArgs ?? []).join("\n")), f = d(o);
-	f.current !== o && (f.current = o, c((o.inputArgs ?? []).join("\n")), u((o.outputArgs ?? []).join("\n")));
-	let p = (e) => {
-		n(e(o));
-	}, h = (e) => p((t) => ({
+}, I = "w-full rounded border border-border bg-surface-2 px-2 py-1.5 text-[11px] font-mono text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 read-only:opacity-60 min-h-[60px] resize-y", L = "flex items-center justify-between gap-3 py-1.5", R = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium", z = "rounded-lg border border-border bg-surface overflow-hidden", B = "border-b border-border px-3 py-1.5 flex items-center justify-between bg-surface-hover/30", V = "text-[11px] font-semibold text-foreground uppercase tracking-wider";
+function ue({ config: e, value: t, onSave: n, saveStatus: r }) {
+	let [i, a] = m(!1), o = e.argsOnly === !0, s = t ?? le, [c, l] = m(() => (s.inputArgs ?? []).join("\n")), [u, f] = m(() => (s.outputArgs ?? []).join("\n")), p = d(s);
+	p.current !== s && (p.current = s, l((s.inputArgs ?? []).join("\n")), f((s.outputArgs ?? []).join("\n")));
+	let h = (e) => {
+		n(e(s));
+	}, g = (e) => h((t) => ({
 		...t,
 		video: {
 			...t.video,
 			codec: e
 		}
-	})), g = (e) => p((t) => ({
-		...t,
-		video: {
-			...t.video,
-			width: e
-		}
-	})), b = (e) => p((t) => ({
-		...t,
-		video: {
-			...t.video,
-			height: e
-		}
-	})), x = (e) => p((t) => ({
-		...t,
-		video: {
-			...t.video,
-			fps: e
-		}
-	})), S = (e) => p((t) => ({
-		...t,
-		video: {
-			...t.video,
-			bitrateKbps: e
-		}
-	})), C = () => p((e) => ({
+	})), b = (e) => {
+		!Number.isFinite(e) || e <= 0 || h((t) => ({
+			...t,
+			video: {
+				...t.video,
+				width: e
+			}
+		}));
+	}, x = (e) => {
+		!Number.isFinite(e) || e <= 0 || h((t) => ({
+			...t,
+			video: {
+				...t.video,
+				height: e
+			}
+		}));
+	}, S = (e) => {
+		!Number.isFinite(e) || e <= 0 || h((t) => ({
+			...t,
+			video: {
+				...t.video,
+				fps: e
+			}
+		}));
+	}, C = (e) => {
+		!Number.isFinite(e) || e <= 0 || h((t) => ({
+			...t,
+			video: {
+				...t.video,
+				bitrateKbps: e
+			}
+		}));
+	}, w = () => h((e) => ({
 		...e,
 		audio: "passthrough"
-	})), w = (e) => p((t) => ({
+	})), T = (e) => h((t) => ({
 		...t,
 		audio: typeof t.audio == "object" ? {
 			...t.audio,
 			codec: e
 		} : { codec: e }
-	})), T = (e) => p((t) => ({
-		...t,
-		audio: typeof t.audio == "object" ? {
-			...t.audio,
-			bitrateKbps: e
-		} : {
-			codec: "opus",
-			bitrateKbps: e
-		}
-	})), E = (e) => p((t) => ({
+	})), E = (e) => {
+		!Number.isFinite(e) || e <= 0 || h((t) => ({
+			...t,
+			audio: typeof t.audio == "object" ? {
+				...t.audio,
+				bitrateKbps: e
+			} : {
+				codec: "opus",
+				bitrateKbps: e
+			}
+		}));
+	}, D = (e) => h((t) => ({
 		...t,
 		inputArgs: e.split("\n").map((e) => e.trim()).filter((e) => e.length > 0)
-	})), D = (e) => p((t) => ({
+	})), O = (e) => h((t) => ({
 		...t,
 		outputArgs: e.split("\n").map((e) => e.trim()).filter((e) => e.length > 0)
-	})), O = (e, t) => {
+	})), k = (e, t) => {
 		let n = t.args.join(" ");
 		if (e === "input") {
-			let e = s.length === 0 ? n : `${s}\n${n}`;
-			c(e), E(e);
+			let e = c.length === 0 ? n : `${c}\n${n}`;
+			l(e), D(e);
 		} else {
-			let e = l.length === 0 ? n : `${l}\n${n}`;
-			u(e), D(e);
+			let e = u.length === 0 ? n : `${u}\n${n}`;
+			f(e), O(e);
 		}
-	}, k = /* @__PURE__ */ v("div", {
+	}, A = /* @__PURE__ */ v("div", {
 		className: "space-y-1.5",
 		children: [/* @__PURE__ */ v("div", {
 			className: "flex items-center justify-between",
 			children: [/* @__PURE__ */ v("label", {
 				htmlFor: `${e.fieldKey}-input-args`,
-				className: L,
+				className: R,
 				children: ["Input args", /* @__PURE__ */ _("span", {
 					className: "ml-2 text-[10px] normal-case text-foreground-subtle italic",
 					children: "one per line · inserted between globals and -i"
 				})]
-			}), /* @__PURE__ */ _(V, {
+			}), /* @__PURE__ */ _(H, {
 				id: `${e.fieldKey}-input-picker`,
 				disabled: !1,
-				catalogue: ae,
-				onPick: (e) => O("input", e)
+				catalogue: se,
+				onPick: (e) => k("input", e)
 			})]
 		}), /* @__PURE__ */ _("textarea", {
 			id: `${e.fieldKey}-input-args`,
-			value: s,
-			onChange: (e) => c(e.target.value),
-			onBlur: (e) => E(e.target.value),
+			value: c,
+			onChange: (e) => l(e.target.value),
+			onBlur: (e) => D(e.target.value),
 			placeholder: "-thread_queue_size 1024",
-			className: F
+			className: I
 		})]
-	}), A = /* @__PURE__ */ v("div", {
+	}), j = /* @__PURE__ */ v("div", {
 		className: "space-y-1.5",
 		children: [/* @__PURE__ */ v("div", {
 			className: "flex items-center justify-between",
 			children: [/* @__PURE__ */ v("label", {
 				htmlFor: `${e.fieldKey}-output-args`,
-				className: L,
+				className: R,
 				children: ["Output args", /* @__PURE__ */ _("span", {
 					className: "ml-2 text-[10px] normal-case text-foreground-subtle italic",
 					children: "one per line · inserted before the final muxer"
 				})]
-			}), /* @__PURE__ */ _(V, {
+			}), /* @__PURE__ */ _(H, {
 				id: `${e.fieldKey}-output-picker`,
 				disabled: !1,
-				catalogue: oe,
-				onPick: (e) => O("output", e)
+				catalogue: ce,
+				onPick: (e) => k("output", e)
 			})]
 		}), /* @__PURE__ */ _("textarea", {
 			id: `${e.fieldKey}-output-args`,
-			value: l,
-			onChange: (e) => u(e.target.value),
-			onBlur: (e) => D(e.target.value),
+			value: u,
+			onChange: (e) => f(e.target.value),
+			onBlur: (e) => O(e.target.value),
 			placeholder: "-bsf:v h264_mp4toannexb",
-			className: F
+			className: I
 		})]
 	});
 	return /* @__PURE__ */ v("div", {
 		className: "space-y-3",
 		children: [
+			r !== void 0 && /* @__PURE__ */ _("div", {
+				className: "flex items-center justify-end",
+				children: /* @__PURE__ */ _(de, { status: r })
+			}),
 			e.sourceParams !== void 0 && /* @__PURE__ */ v("div", {
-				className: R,
+				className: z,
 				children: [/* @__PURE__ */ v("div", {
-					className: z,
+					className: B,
 					children: [/* @__PURE__ */ _("h3", {
-						className: B,
+						className: V,
 						children: "Source (probed)"
 					}), /* @__PURE__ */ _("span", {
 						className: "text-[10px] text-foreground-subtle italic",
@@ -592,33 +633,33 @@ function ce({ config: e, value: t, onSave: n }) {
 					})]
 				}), /* @__PURE__ */ _("div", {
 					className: "px-3 py-2 flex flex-wrap gap-1.5",
-					children: /* @__PURE__ */ _(le, { profile: e.sourceParams })
+					children: /* @__PURE__ */ _(fe, { profile: e.sourceParams })
 				})]
 			}),
-			!a && /* @__PURE__ */ _("div", {
+			!o && /* @__PURE__ */ _("div", {
 				className: "@container",
 				children: /* @__PURE__ */ v("div", {
 					className: "grid grid-cols-1 @[480px]:grid-cols-2 gap-3",
 					children: [/* @__PURE__ */ v("div", {
-						className: R,
+						className: z,
 						children: [/* @__PURE__ */ _("div", {
-							className: z,
+							className: B,
 							children: /* @__PURE__ */ _("h3", {
-								className: B,
+								className: V,
 								children: "Video"
 							})
 						}), /* @__PURE__ */ v("div", {
 							className: "px-3 py-2 divide-y divide-border/30",
 							children: [/* @__PURE__ */ v("div", {
-								className: I,
+								className: L,
 								children: [/* @__PURE__ */ _("label", {
 									htmlFor: `${e.fieldKey}-video-codec`,
-									className: L,
+									className: R,
 									children: "Codec"
 								}), /* @__PURE__ */ v("select", {
 									id: `${e.fieldKey}-video-codec`,
-									value: o.video.codec,
-									onChange: (e) => h(e.target.value),
+									value: s.video.codec,
+									onChange: (e) => g(e.target.value),
 									className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed appearance-none pr-6 min-w-[120px]",
 									children: [
 										/* @__PURE__ */ _("option", {
@@ -635,84 +676,84 @@ function ce({ config: e, value: t, onSave: n }) {
 										})
 									]
 								})]
-							}), o.video.codec !== "copy" && /* @__PURE__ */ v(y, { children: [
+							}), s.video.codec !== "copy" && /* @__PURE__ */ v(y, { children: [
 								/* @__PURE__ */ v("div", {
-									className: I,
+									className: L,
 									children: [/* @__PURE__ */ _("label", {
 										htmlFor: `${e.fieldKey}-video-width`,
-										className: L,
+										className: R,
 										children: "Width"
 									}), /* @__PURE__ */ _("input", {
 										id: `${e.fieldKey}-video-width`,
 										type: "number",
 										"aria-label": "Width",
-										value: o.video.width ?? "",
-										onChange: (e) => g(Number(e.target.value)),
+										value: s.video.width ?? "",
+										onChange: (e) => b(Number(e.target.value)),
 										className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed w-24 text-right"
 									})]
 								}),
 								/* @__PURE__ */ v("div", {
-									className: I,
+									className: L,
 									children: [/* @__PURE__ */ _("label", {
 										htmlFor: `${e.fieldKey}-video-height`,
-										className: L,
+										className: R,
 										children: "Height"
 									}), /* @__PURE__ */ _("input", {
 										id: `${e.fieldKey}-video-height`,
 										type: "number",
-										value: o.video.height ?? "",
-										onChange: (e) => b(Number(e.target.value)),
+										value: s.video.height ?? "",
+										onChange: (e) => x(Number(e.target.value)),
 										className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed w-24 text-right"
 									})]
 								}),
 								/* @__PURE__ */ v("div", {
-									className: I,
+									className: L,
 									children: [/* @__PURE__ */ _("label", {
 										htmlFor: `${e.fieldKey}-video-fps`,
-										className: L,
+										className: R,
 										children: "FPS"
 									}), /* @__PURE__ */ _("input", {
 										id: `${e.fieldKey}-video-fps`,
 										type: "number",
-										value: o.video.fps ?? "",
-										onChange: (e) => x(Number(e.target.value)),
+										value: s.video.fps ?? "",
+										onChange: (e) => S(Number(e.target.value)),
 										className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed w-24 text-right"
 									})]
 								}),
 								/* @__PURE__ */ v("div", {
-									className: I,
+									className: L,
 									children: [/* @__PURE__ */ _("label", {
 										htmlFor: `${e.fieldKey}-video-bitrate`,
-										className: L,
+										className: R,
 										children: "Bitrate (kbps)"
 									}), /* @__PURE__ */ _("input", {
 										id: `${e.fieldKey}-video-bitrate`,
 										type: "number",
-										value: o.video.bitrateKbps ?? "",
-										onChange: (e) => S(Number(e.target.value)),
+										value: s.video.bitrateKbps ?? "",
+										onChange: (e) => C(Number(e.target.value)),
 										className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed w-24 text-right"
 									})]
 								})
 							] })]
 						})]
 					}), /* @__PURE__ */ v("div", {
-						className: R,
+						className: z,
 						children: [/* @__PURE__ */ _("div", {
-							className: z,
+							className: B,
 							children: /* @__PURE__ */ _("h3", {
-								className: B,
+								className: V,
 								children: "Audio"
 							})
 						}), /* @__PURE__ */ _("div", {
 							className: "px-3 py-2",
-							children: o.audio === "passthrough" ? /* @__PURE__ */ v("div", {
+							children: s.audio === "passthrough" ? /* @__PURE__ */ v("div", {
 								className: "flex items-center justify-between gap-3",
 								children: [/* @__PURE__ */ _("span", {
 									className: "text-[11px] text-foreground-subtle italic",
 									children: "Source audio forwarded without re-encode."
 								}), /* @__PURE__ */ _("button", {
 									type: "button",
-									onClick: () => w("opus"),
+									onClick: () => T("opus"),
 									className: "rounded-md border border-border bg-surface-hover px-2 py-1 text-[11px] text-foreground hover:bg-surface-hover/70 transition-colors",
 									children: "Switch to custom encode"
 								})]
@@ -720,15 +761,15 @@ function ce({ config: e, value: t, onSave: n }) {
 								className: "divide-y divide-border/30",
 								children: [
 									/* @__PURE__ */ v("div", {
-										className: I,
+										className: L,
 										children: [/* @__PURE__ */ _("label", {
 											htmlFor: `${e.fieldKey}-audio-codec`,
-											className: L,
+											className: R,
 											children: "Codec"
 										}), /* @__PURE__ */ v("select", {
 											id: `${e.fieldKey}-audio-codec`,
-											value: o.audio.codec,
-											onChange: (e) => w(e.target.value),
+											value: s.audio.codec,
+											onChange: (e) => T(e.target.value),
 											className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed appearance-none pr-6 min-w-[120px]",
 											children: [
 												/* @__PURE__ */ _("option", {
@@ -755,16 +796,16 @@ function ce({ config: e, value: t, onSave: n }) {
 										})]
 									}),
 									/* @__PURE__ */ v("div", {
-										className: I,
+										className: L,
 										children: [/* @__PURE__ */ _("label", {
 											htmlFor: `${e.fieldKey}-audio-bitrate`,
-											className: L,
+											className: R,
 											children: "Bitrate (kbps)"
 										}), /* @__PURE__ */ _("input", {
 											id: `${e.fieldKey}-audio-bitrate`,
 											type: "number",
-											value: o.audio.bitrateKbps ?? "",
-											onChange: (e) => T(Number(e.target.value)),
+											value: s.audio.bitrateKbps ?? "",
+											onChange: (e) => E(Number(e.target.value)),
 											className: "rounded border border-border bg-surface-2 px-2 py-1 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-accent disabled:opacity-50 disabled:cursor-not-allowed read-only:opacity-60 read-only:cursor-not-allowed w-24 text-right"
 										})]
 									}),
@@ -772,7 +813,7 @@ function ce({ config: e, value: t, onSave: n }) {
 										className: "pt-2",
 										children: /* @__PURE__ */ _("button", {
 											type: "button",
-											onClick: C,
+											onClick: w,
 											className: "text-[11px] text-foreground-subtle hover:text-foreground underline-offset-2 hover:underline",
 											children: "Switch back to passthrough"
 										})
@@ -783,61 +824,77 @@ function ce({ config: e, value: t, onSave: n }) {
 					})]
 				})
 			}),
-			a ? /* @__PURE__ */ v(y, { children: [/* @__PURE__ */ v("div", {
-				className: R,
+			o ? /* @__PURE__ */ v(y, { children: [/* @__PURE__ */ v("div", {
+				className: z,
 				children: [/* @__PURE__ */ _("div", {
-					className: z,
+					className: B,
 					children: /* @__PURE__ */ _("h3", {
-						className: B,
+						className: V,
 						children: "Input args"
 					})
 				}), /* @__PURE__ */ _("div", {
 					className: "px-3 py-2",
-					children: k
+					children: A
 				})]
 			}), /* @__PURE__ */ v("div", {
-				className: R,
+				className: z,
 				children: [/* @__PURE__ */ _("div", {
-					className: z,
+					className: B,
 					children: /* @__PURE__ */ _("h3", {
-						className: B,
+						className: V,
 						children: "Output args"
 					})
 				}), /* @__PURE__ */ _("div", {
 					className: "px-3 py-2",
-					children: A
+					children: j
 				})]
 			})] }) : /* @__PURE__ */ v("div", {
-				className: R,
+				className: z,
 				children: [/* @__PURE__ */ v("button", {
 					type: "button",
-					onClick: () => i((e) => !e),
+					onClick: () => a((e) => !e),
 					className: "w-full px-3 py-1.5 flex items-center justify-between bg-surface-hover/30 hover:bg-surface-hover transition-colors",
 					children: [/* @__PURE__ */ v("span", {
 						className: "inline-flex items-center gap-1.5 text-[11px] font-semibold text-foreground uppercase tracking-wider",
-						children: [_(r ? j : M, { className: "h-3 w-3" }), "Advanced — raw ffmpeg args"]
+						children: [_(i ? M : N, { className: "h-3 w-3" }), "Advanced — raw ffmpeg args"]
 					}), /* @__PURE__ */ v("span", {
 						className: "text-[10px] text-foreground-subtle italic",
-						children: [(o.inputArgs?.length ?? 0) + (o.outputArgs?.length ?? 0), " args"]
+						children: [(s.inputArgs?.length ?? 0) + (s.outputArgs?.length ?? 0), " args"]
 					})]
-				}), r && /* @__PURE__ */ v("div", {
+				}), i && /* @__PURE__ */ v("div", {
 					className: "px-3 py-2 space-y-3 border-t border-border/50",
 					children: [
-						k,
-						/* @__PURE__ */ _(ie, {
-							outputArgs: o.outputArgs ?? [],
+						A,
+						/* @__PURE__ */ _(oe, {
+							outputArgs: s.outputArgs ?? [],
 							onChange: (e) => {
-								u(e.join("\n")), D(e.join("\n"));
+								f(e.join("\n")), O(e.join("\n"));
 							}
 						}),
-						A
+						j
 					]
 				})]
 			})
 		]
 	});
 }
-function le({ profile: e }) {
+function de({ status: e }) {
+	let t = "inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-medium border";
+	return e === "saving" ? /* @__PURE__ */ v("span", {
+		className: `${t} bg-accent/10 text-accent border-accent/30`,
+		children: [/* @__PURE__ */ _(te, { className: "h-2.5 w-2.5 animate-spin" }), "Saving…"]
+	}) : e === "saved" ? /* @__PURE__ */ v("span", {
+		className: `${t} bg-success/10 text-success border-success/30`,
+		children: [/* @__PURE__ */ _(j, { className: "h-2.5 w-2.5" }), "Saved"]
+	}) : e === "error" ? /* @__PURE__ */ v("span", {
+		className: `${t} bg-red-500/10 text-red-400 border-red-500/30`,
+		children: [/* @__PURE__ */ _(ee, { className: "h-2.5 w-2.5" }), "Save failed"]
+	}) : /* @__PURE__ */ _("span", {
+		className: `${t} bg-foreground-subtle/10 text-foreground-subtle border-border`,
+		children: "Autosaves"
+	});
+}
+function fe({ profile: e }) {
 	let t = "inline-flex items-center gap-1 rounded-full bg-foreground-subtle/10 border border-border px-2 py-0.5 text-[11px] font-mono text-foreground-subtle", { video: n, audio: r } = e, i = n.width !== void 0 && n.height !== void 0 ? `${n.width}×${n.height}` : void 0;
 	return /* @__PURE__ */ v(y, { children: [
 		/* @__PURE__ */ v("span", {
@@ -918,7 +975,7 @@ function le({ profile: e }) {
 		] })
 	] });
 }
-function ue(e) {
+function pe(e) {
 	let t = e.config ?? {}, n = c(), [r, i] = m(() => t.initialValue), a = h((r) => {
 		if (i(r), e.deviceId === void 0) return;
 		let a = t.writerCapName, o = t.writerAddonId, s = t.fieldKey;
@@ -945,19 +1002,22 @@ function ue(e) {
 		children: "ffmpeg-params: no deviceId in widget context — this widget only renders inside a device tab."
 	});
 	let o = t.fieldKey;
-	return o === void 0 || o.length === 0 ? /* @__PURE__ */ _("div", {
+	if (o === void 0 || o.length === 0) return /* @__PURE__ */ _("div", {
 		className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning",
 		children: "ffmpeg-params: widgetConfig.fieldKey is required — fix the contribution builder."
-	}) : /* @__PURE__ */ _(ce, {
+	});
+	let s = n.isPending ? "saving" : n.isError ? "error" : n.isSuccess ? "saved" : "idle";
+	return /* @__PURE__ */ _(ue, {
 		config: {
 			...t,
 			fieldKey: o
 		},
 		value: r,
-		onSave: a
+		onSave: a,
+		saveStatus: s
 	});
 }
-function V({ id: e, disabled: t, catalogue: n, onPick: r }) {
+function H({ id: e, disabled: t, catalogue: n, onPick: r }) {
 	let [i, a] = m(!1), o = f(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of n) {
@@ -974,7 +1034,7 @@ function V({ id: e, disabled: t, catalogue: n, onPick: r }) {
 			disabled: t,
 			onClick: () => a((e) => !e),
 			className: "inline-flex items-center gap-1 rounded-md border border-border bg-surface-hover px-2 py-0.5 text-[10px] font-medium text-foreground-subtle hover:bg-surface-hover/70 disabled:opacity-40 disabled:cursor-not-allowed transition-colors",
-			children: [/* @__PURE__ */ _(ee, { className: "h-3 w-3" }), "Add flag…"]
+			children: [/* @__PURE__ */ _(ne, { className: "h-3 w-3" }), "Add flag…"]
 		}), i && !t && /* @__PURE__ */ v(y, { children: [/* @__PURE__ */ _("div", {
 			className: "fixed inset-0 z-40",
 			onClick: () => a(!1),
@@ -1007,36 +1067,36 @@ function V({ id: e, disabled: t, catalogue: n, onPick: r }) {
 }
 //#endregion
 //#region src/stream-broker/widgets/format-ua.ts
-var H = 24;
-function de(e) {
+var U = 24;
+function me(e) {
 	return /\bEdg\b|\bEdgA\b|\bEdgiOS\b|Edge\//.test(e) ? "Edge" : /\bOPR\b|Opera/.test(e) ? "Opera" : /Firefox\/|\bFxiOS\b/.test(e) ? "Firefox" : /Chrome\/|\bCriOS\b/.test(e) ? "Chrome" : /Safari\//.test(e) ? "Safari" : null;
 }
-function fe(e) {
+function he(e) {
 	return /iPhone|iPad|iPod|\biOS\b|CriOS|FxiOS/.test(e) ? "iOS" : /Mac OS X|Macintosh/.test(e) ? "macOS" : /Windows/.test(e) ? "Windows" : /Android/.test(e) ? "Android" : /Linux/.test(e) ? "Linux" : null;
 }
-function U(e) {
+function W(e) {
 	let t = e.trim();
 	if (t.length === 0) return "";
-	let n = de(t), r = fe(t);
-	return n && r ? `${n}/${r}` : n || r || (t.length > H ? `${t.slice(0, H)}…` : t);
+	let n = me(t), r = he(t);
+	return n && r ? `${n}/${r}` : n || r || (t.length > U ? `${t.slice(0, U)}…` : t);
 }
 //#endregion
 //#region src/stream-broker/widgets/StreamBrokerPanel.tsx
-function pe(e) {
+function ge(e) {
 	let t = Math.floor(e / 1e3);
 	if (t < 60) return `${t}s`;
 	let n = Math.floor(t / 60);
 	return n < 60 ? `${n}m` : `${Math.floor(n / 60)}h ${n % 60}m`;
 }
-var W = {
+var G = {
 	high: "High",
 	mid: "Mid",
 	low: "Low"
-}, G = [
+}, K = [
 	"high",
 	"mid",
 	"low"
-], me = {
+], _e = {
 	alexa: "bg-blue-500/15 text-blue-400",
 	homekit: "bg-purple-500/15 text-purple-400",
 	"webrtc-browser": "bg-emerald-500/15 text-emerald-400",
@@ -1049,7 +1109,7 @@ var W = {
 	snapshot: "bg-cyan-500/15 text-cyan-400",
 	warmup: "bg-foreground-subtle/10 text-foreground-subtle",
 	unknown: "bg-foreground-subtle/10 text-foreground-subtle"
-}, K = {
+}, q = {
 	alexa: "ALEXA",
 	homekit: "HOMEKIT",
 	"webrtc-browser": "BROWSER",
@@ -1063,32 +1123,32 @@ var W = {
 	warmup: "WARMUP",
 	unknown: "—"
 };
-function he(e) {
-	return K[e] ?? e.toUpperCase().slice(0, 8);
+function ve(e) {
+	return q[e] ?? e.toUpperCase().slice(0, 8);
 }
-function ge(e) {
-	return K[e] ?? e;
+function ye(e) {
+	return q[e] ?? e;
 }
-function _e(e) {
+function be(e) {
 	let t = e.config ?? {};
 	return e.deviceId === void 0 ? /* @__PURE__ */ _("div", {
 		className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning",
 		children: "StreamBrokerPanel requires a deviceId"
-	}) : /* @__PURE__ */ _(ve, {
+	}) : /* @__PURE__ */ _(xe, {
 		deviceId: e.deviceId,
 		title: t.title,
 		variant: t.variant,
 		hideEmpty: t.hideEmpty
 	});
 }
-function ve({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hideEmpty: c = !1 }) {
+function xe({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hideEmpty: c = !1 }) {
 	i(["streamBroker", "listAllProfileSlots"], [
 		"device.streams-registered",
 		"device.streams-unregistered",
 		"device.registered",
 		"device.unregistered"
 	]);
-	let { data: l } = r(void 0, { staleTime: 3e4 }), u = (l ?? []).filter((t) => t.deviceId === e && t.sourceCamStreamId !== null).slice().toSorted((e, t) => G.indexOf(e.profile) - G.indexOf(t.profile)), d = t(o().trpcClient, e), { data: f } = x({
+	let { data: l } = r(void 0, { staleTime: 3e4 }), u = (l ?? []).filter((t) => t.deviceId === e && t.sourceCamStreamId !== null).slice().toSorted((e, t) => K.indexOf(e.profile) - K.indexOf(t.profile)), d = t(o().trpcClient, e), { data: f } = x({
 		queryKey: [
 			"device",
 			e,
@@ -1102,7 +1162,7 @@ function ve({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hid
 	let { data: m } = n({ deviceId: e }, { staleTime: 3e4 }), h = m?.assignment.sourceNodeId ?? null, g = new Set(u.map((e) => e.sourceCamStreamId).filter((e) => e !== null)), y = (f ?? []).filter((e) => !g.has(e.camStreamId)), b = u.length > 0, S = y.length > 0;
 	return c && !b && !S ? null : s === "compact" ? b ? /* @__PURE__ */ _("div", {
 		className: "divide-y divide-border/30",
-		children: u.map((e) => /* @__PURE__ */ _(J, {
+		children: u.map((e) => /* @__PURE__ */ _(Y, {
 			slot: e,
 			camStreams: p,
 			compact: !0
@@ -1123,7 +1183,7 @@ function ve({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hid
 					children: [h !== null && /* @__PURE__ */ v("span", {
 						title: `Cluster node dialing this camera's source: ${h}`,
 						className: "inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-[10px] font-medium bg-accent/10 text-accent border border-accent/30 min-w-0 max-w-full",
-						children: [/* @__PURE__ */ _(N, { className: "h-2.5 w-2.5 shrink-0" }), /* @__PURE__ */ _("span", {
+						children: [/* @__PURE__ */ _(P, { className: "h-2.5 w-2.5 shrink-0" }), /* @__PURE__ */ _("span", {
 							className: "truncate",
 							children: h
 						})]
@@ -1135,19 +1195,19 @@ function ve({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hid
 			}),
 			b ? /* @__PURE__ */ _("div", {
 				className: "divide-y divide-border/30",
-				children: u.map((e) => /* @__PURE__ */ _(J, {
+				children: u.map((e) => /* @__PURE__ */ _(Y, {
 					slot: e,
 					camStreams: p,
 					compact: !1
 				}, e.brokerId))
 			}) : /* @__PURE__ */ v("div", {
 				className: "px-4 py-6 flex flex-col items-center text-center text-foreground-subtle",
-				children: [/* @__PURE__ */ _(N, { className: "h-5 w-5 mb-2 opacity-30" }), /* @__PURE__ */ _("p", {
+				children: [/* @__PURE__ */ _(P, { className: "h-5 w-5 mb-2 opacity-30" }), /* @__PURE__ */ _("p", {
 					className: "text-xs",
 					children: "No profile slots assigned for this device"
 				})]
 			}),
-			S && /* @__PURE__ */ _(ye, {
+			S && /* @__PURE__ */ _(Se, {
 				deviceId: e,
 				camStreamIds: y.map((e) => e.camStreamId),
 				camStreams: p
@@ -1155,7 +1215,7 @@ function ve({ deviceId: e, title: a = "Stream Brokers", variant: s = "full", hid
 		]
 	});
 }
-function ye({ deviceId: e, camStreamIds: t, camStreams: n }) {
+function Se({ deviceId: e, camStreamIds: t, camStreams: n }) {
 	let [r, i] = m(!1);
 	return /* @__PURE__ */ v("div", {
 		className: "border-t border-border/50",
@@ -1165,14 +1225,14 @@ function ye({ deviceId: e, camStreamIds: t, camStreams: n }) {
 			className: "w-full px-4 py-1.5 flex items-center justify-between bg-surface-hover/30 hover:bg-surface-hover transition-colors",
 			children: [/* @__PURE__ */ v("span", {
 				className: "inline-flex items-center gap-1.5 text-[11px] uppercase tracking-wider text-foreground-subtle",
-				children: [_(r ? j : M, { className: "h-3 w-3" }), "Other active streams"]
+				children: [_(r ? M : N, { className: "h-3 w-3" }), "Other active streams"]
 			}), /* @__PURE__ */ _("span", {
 				className: "rounded-full px-2 py-0.5 text-[10px] font-medium bg-foreground-subtle/10 text-foreground-subtle border border-border",
 				children: t.length
 			})]
 		}), r && /* @__PURE__ */ _("div", {
 			className: "divide-y divide-border/30",
-			children: t.map((t) => /* @__PURE__ */ _(be, {
+			children: t.map((t) => /* @__PURE__ */ _(Ce, {
 				deviceId: e,
 				camStreamId: t,
 				camStreams: n
@@ -1180,7 +1240,7 @@ function ye({ deviceId: e, camStreamIds: t, camStreams: n }) {
 		})]
 	});
 }
-function be({ deviceId: e, camStreamId: t, camStreams: n }) {
+function Ce({ deviceId: e, camStreamId: t, camStreams: n }) {
 	let r = S(e, t), i = u("stream-broker.metrics-snapshot", (e) => e.brokerId === r)?.stats, a = n.get(t), o = i?.status === "streaming";
 	return /* @__PURE__ */ v("div", {
 		className: "px-4 py-2",
@@ -1255,7 +1315,7 @@ function be({ deviceId: e, camStreamId: t, camStreams: n }) {
 		})]
 	});
 }
-function q(e, t) {
+function J(e, t) {
 	let n = (e) => {
 		if (!e || typeof e != "object") return;
 		let r = e;
@@ -1276,13 +1336,13 @@ function q(e, t) {
 		if (t !== void 0) return t;
 	}
 }
-function J({ slot: t, camStreams: n, compact: r }) {
+function Y({ slot: t, camStreams: n, compact: r }) {
 	let o = b(), c = u("stream-broker.metrics-snapshot", (e) => e.brokerId === t.brokerId)?.stats;
 	i(["streamBroker", "listClients"], ["stream-broker.metrics-snapshot"]);
 	let { data: d } = e({ brokerId: t.brokerId }, {
 		enabled: c?.status === "streaming",
 		staleTime: 2e3
-	}), { data: f } = a({ deviceId: t.deviceId }, { staleTime: 15e3 }), p = t.sourceCamStreamId ?? t.profile, m = !!(q(f, `preBufferEnabled:${p}`) ?? !0), g = q(f, `preBufferSec:${p}`), x = l({ onSuccess: () => {
+	}), { data: f } = a({ deviceId: t.deviceId }, { staleTime: 15e3 }), p = t.sourceCamStreamId ?? t.profile, m = !!(J(f, `preBufferEnabled:${p}`) ?? !0), g = J(f, `preBufferSec:${p}`), x = l({ onSuccess: () => {
 		o.invalidateQueries({ queryKey: [["streamBroker", "getDeviceSettingsContribution"]] });
 	} }), S = (e) => {
 		x.mutate({
@@ -1296,7 +1356,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 			brokerId: t.brokerId,
 			...e
 		});
-	}, [C, t.brokerId]), T = (t.sourceCamStreamId ? n.get(t.sourceCamStreamId) : void 0)?.resolution ?? t.resolution, E = c?.status === "streaming", D = T ? `${W[t.profile]} (${T.width}×${T.height})` : W[t.profile], O = c ? c.encodedSubscribers + c.decodedSubscribers + (c.rtspClients ?? 0) + (c.pipeClients ?? 0) : 0;
+	}, [C, t.brokerId]), T = (t.sourceCamStreamId ? n.get(t.sourceCamStreamId) : void 0)?.resolution ?? t.resolution, E = c?.status === "streaming", D = T ? `${G[t.profile]} (${T.width}×${T.height})` : G[t.profile], O = c ? c.encodedSubscribers + c.decodedSubscribers + (c.rtspClients ?? 0) + (c.pipeClients ?? 0) : 0;
 	return /* @__PURE__ */ v("div", {
 		className: `@container ${r ? "px-3 py-1.5" : "px-4 py-2"}`,
 		style: { containerType: "inline-size" },
@@ -1323,7 +1383,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 					]
 				}), /* @__PURE__ */ _("span", {
 					className: "text-[10px] text-foreground-subtle shrink-0 whitespace-nowrap",
-					children: c && c.uptimeMs > 0 ? pe(c.uptimeMs) : "—"
+					children: c && c.uptimeMs > 0 ? ge(c.uptimeMs) : "—"
 				})]
 			}),
 			c && E ? r ? /* @__PURE__ */ v("div", {
@@ -1378,7 +1438,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 								className: "text-foreground-subtle/70",
 								children: "("
 							}),
-							/* @__PURE__ */ _(we, {
+							/* @__PURE__ */ _(Oe, {
 								count: c.encodedSubscribers + c.decodedSubscribers,
 								clients: d,
 								onKill: w
@@ -1387,7 +1447,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 								className: "text-foreground-subtle/70",
 								children: "·"
 							}),
-							/* @__PURE__ */ _(Ee, {
+							/* @__PURE__ */ _(Ae, {
 								count: c.rtspClients ?? 0,
 								clients: d,
 								onKill: w
@@ -1538,7 +1598,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 						]
 					})
 				]
-			}), /* @__PURE__ */ _(Ce, {
+			}), /* @__PURE__ */ _(De, {
 				clients: d,
 				encodedCount: c.encodedSubscribers,
 				onKill: w
@@ -1553,7 +1613,7 @@ function J({ slot: t, camStreams: n, compact: r }) {
 						className: "text-foreground-subtle",
 						children: "Buffer:"
 					}),
-					/* @__PURE__ */ _(Te, {
+					/* @__PURE__ */ _(ke, {
 						enabled: m,
 						onToggle: (e) => S(e),
 						disabled: x.isPending
@@ -1571,12 +1631,12 @@ function J({ slot: t, camStreams: n, compact: r }) {
 		]
 	});
 }
-var xe = 280, Se = 120;
-function Y({ trigger: e, content: t, widthClass: n }) {
+var we = 280, Te = 120;
+function X({ trigger: e, content: t, widthClass: n }) {
 	let r = d(null), i = d(null), [a, o] = m(!1), [s, c] = m(!1), l = h(() => {
 		i.current &&= (clearTimeout(i.current), null);
 	}, []), u = h(() => {
-		l(), i.current = setTimeout(() => o(!1), Se);
+		l(), i.current = setTimeout(() => o(!1), Te);
 	}, [l]);
 	return /* @__PURE__ */ v("span", {
 		ref: r,
@@ -1586,7 +1646,7 @@ function Y({ trigger: e, content: t, widthClass: n }) {
 			let e = r.current;
 			if (e) {
 				let t = e.getBoundingClientRect(), n = window.innerHeight - t.bottom, r = t.top;
-				c(n < xe && r > n);
+				c(n < we && r > n);
 			}
 			o(!0);
 		}, [l]),
@@ -1599,17 +1659,17 @@ function Y({ trigger: e, content: t, widthClass: n }) {
 		})]
 	});
 }
-function X(e) {
+function Z(e) {
 	if (e < 1e3) return `${e}ms`;
 	let t = Math.floor(e / 1e3);
 	if (t < 60) return `${t}s`;
 	let n = Math.floor(t / 60);
 	return n < 60 ? `${n}m ${t % 60}s` : `${Math.floor(n / 60)}h ${n % 60}m`;
 }
-function Z(e) {
+function Ee(e) {
 	return e < 1024 ? `${e} B` : e < 1048576 ? `${(e / 1024).toFixed(1)} KB` : e < 1073741824 ? `${(e / 1048576).toFixed(1)} MB` : `${(e / 1073741824).toFixed(2)} GB`;
 }
-function Ce({ clients: e, encodedCount: t, onKill: n }) {
+function De({ clients: e, encodedCount: t, onKill: n }) {
 	let r = e?.decoded ?? [], i = e?.audio ?? [], a = e?.rtsp ?? [], o = e?.encoded ?? [], s = r.length + i.length + a.length + o.length, [c, l] = m(!0);
 	return s === 0 ? /* @__PURE__ */ _("div", {
 		className: "mt-1.5 text-[10px] text-foreground-subtle italic",
@@ -1620,7 +1680,7 @@ function Ce({ clients: e, encodedCount: t, onKill: n }) {
 			type: "button",
 			onClick: () => l((e) => !e),
 			className: "flex items-center gap-1 text-[10px] text-foreground-subtle hover:text-foreground transition-colors",
-			children: [_(c ? j : M, { className: "h-3 w-3" }), /* @__PURE__ */ v("span", {
+			children: [_(c ? M : N, { className: "h-3 w-3" }), /* @__PURE__ */ v("span", {
 				className: "uppercase tracking-wider",
 				children: [
 					"Subscribers (",
@@ -1665,12 +1725,12 @@ function Ce({ clients: e, encodedCount: t, onKill: n }) {
 					return /* @__PURE__ */ _(Q, {
 						kind: "RTSP",
 						kindClass: "bg-warning/10 text-warning",
-						tag: e.userAgent ? U(e.userAgent) : e.remoteAddr,
+						tag: e.userAgent ? W(e.userAgent) : e.remoteAddr,
 						state: {
 							text: i + (e.muted ? " · muted" : ""),
 							className: a
 						},
-						metrics: [Z(e.bytesSent), `last rtp ${X(t)} ago`],
+						metrics: [Ee(e.bytesSent), `last rtp ${Z(t)} ago`],
 						age: Date.now() - e.connectedAt,
 						onKill: n ? () => n({
 							channel: "rtsp",
@@ -1679,11 +1739,11 @@ function Ce({ clients: e, encodedCount: t, onKill: n }) {
 					}, `r-${e.sessionId}`);
 				}),
 				o.map((e) => {
-					let t = e.attribution, n = me[t.kind] ?? "bg-foreground-subtle/10 text-foreground-subtle", r = t.sessionId ? t.sessionId.slice(0, 8) : null, i = [];
-					t.label && i.push(t.label), r && i.push(`sess ${r}`), t.userId && i.push(`user ${t.userId.slice(0, 8)}`), t.remoteAddr && i.push(`@${t.remoteAddr}`), t.userAgent && i.push(U(t.userAgent));
-					let a = i.length > 0 ? i.join(" · ") : ge(t.kind), o = [];
+					let t = e.attribution, n = _e[t.kind] ?? "bg-foreground-subtle/10 text-foreground-subtle", r = t.sessionId ? t.sessionId.slice(0, 8) : null, i = [];
+					t.label && i.push(t.label), r && i.push(`sess ${r}`), t.userId && i.push(`user ${t.userId.slice(0, 8)}`), t.remoteAddr && i.push(`@${t.remoteAddr}`), t.userAgent && i.push(W(t.userAgent));
+					let a = i.length > 0 ? i.join(" · ") : ye(t.kind), o = [];
 					return t.media && o.push({ text: t.media }), t.targetCodec && o.push(t.targetCodec), t.transport && o.push(t.transport), o.push(`${e.packetsDelivered} pkts`), /* @__PURE__ */ _(Q, {
-						kind: he(t.kind),
+						kind: ve(t.kind),
 						kindClass: n,
 						tag: a,
 						metrics: o,
@@ -1746,7 +1806,7 @@ function Q({ kind: e, kindClass: t, tag: n, state: r, metrics: i, age: a, onKill
 					}, t)),
 					/* @__PURE__ */ v("span", {
 						className: "text-foreground-subtle/70 whitespace-nowrap",
-						children: ["· ", X(a)]
+						children: ["· ", Z(a)]
 					})
 				]
 			}),
@@ -1757,12 +1817,12 @@ function Q({ kind: e, kindClass: t, tag: n, state: r, metrics: i, age: a, onKill
 		]
 	});
 }
-function we({ count: e, clients: t, onKill: n }) {
+function Oe({ count: e, clients: t, onKill: n }) {
 	let r = t?.decoded ?? [], i = t?.audio ?? [], a = t ? t.encodedSubscribers : 0, o = r.length > 0 || i.length > 0 || a > 0, s = /* @__PURE__ */ _("span", {
 		className: `text-foreground ${o ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`,
 		children: e
 	});
-	return o ? /* @__PURE__ */ _(Y, {
+	return o ? /* @__PURE__ */ _(X, {
 		trigger: s,
 		content: /* @__PURE__ */ v(y, { children: [
 			r.length > 0 && /* @__PURE__ */ v("div", {
@@ -1790,7 +1850,7 @@ function we({ count: e, clients: t, onKill: n }) {
 								]
 							}),
 							/* @__PURE__ */ _("span", { children: "·" }),
-							/* @__PURE__ */ _("span", { children: X(Date.now() - e.subscribedAt) }),
+							/* @__PURE__ */ _("span", { children: Z(Date.now() - e.subscribedAt) }),
 							n && e.tag && /* @__PURE__ */ _($, { onClick: () => n({
 								channel: "decoded",
 								handle: e.tag
@@ -1814,7 +1874,7 @@ function we({ count: e, clients: t, onKill: n }) {
 						children: [
 							/* @__PURE__ */ v("span", { children: [e.chunksDelivered, " chunks"] }),
 							/* @__PURE__ */ _("span", { children: "·" }),
-							/* @__PURE__ */ _("span", { children: X(Date.now() - e.subscribedAt) }),
+							/* @__PURE__ */ _("span", { children: Z(Date.now() - e.subscribedAt) }),
 							n && e.tag && /* @__PURE__ */ _($, { onClick: () => n({
 								channel: "audio",
 								handle: e.tag
@@ -1834,7 +1894,7 @@ function we({ count: e, clients: t, onKill: n }) {
 		widthClass: "min-w-[260px] max-w-[360px]"
 	}) : s;
 }
-function Te({ enabled: e, onToggle: t, disabled: n }) {
+function ke({ enabled: e, onToggle: t, disabled: n }) {
 	return /* @__PURE__ */ _("button", {
 		type: "button",
 		role: "switch",
@@ -1854,15 +1914,15 @@ function $({ onClick: e }) {
 			t.stopPropagation(), e();
 		},
 		className: "inline-flex items-center justify-center h-4 w-4 rounded-sm border border-border/60 text-foreground-subtle hover:bg-red-500/10 hover:text-red-400 hover:border-red-500/40 transition-colors",
-		children: /* @__PURE__ */ _(te, { className: "h-2.5 w-2.5" })
+		children: /* @__PURE__ */ _(re, { className: "h-2.5 w-2.5" })
 	});
 }
-function Ee({ count: e, clients: t, onKill: n }) {
+function Ae({ count: e, clients: t, onKill: n }) {
 	let r = t?.rtsp ?? [], i = r.length > 0, a = /* @__PURE__ */ _("span", {
 		className: `text-foreground ${i ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`,
 		children: e
 	});
-	return i ? /* @__PURE__ */ _(Y, {
+	return i ? /* @__PURE__ */ _(X, {
 		trigger: a,
 		content: /* @__PURE__ */ v(y, { children: [/* @__PURE__ */ _("div", {
 			className: "text-foreground-subtle uppercase text-[9px] tracking-wider mb-1",
@@ -1875,7 +1935,7 @@ function Ee({ count: e, clients: t, onKill: n }) {
 					className: "flex items-center justify-between gap-2",
 					children: [/* @__PURE__ */ _("span", {
 						className: "text-foreground font-mono",
-						children: e.userAgent ? U(e.userAgent) : e.remoteAddr
+						children: e.userAgent ? W(e.userAgent) : e.remoteAddr
 					}), /* @__PURE__ */ v("span", {
 						className: "flex items-center gap-1 shrink-0",
 						children: [/* @__PURE__ */ v("span", {
@@ -1889,15 +1949,15 @@ function Ee({ count: e, clients: t, onKill: n }) {
 				}), /* @__PURE__ */ v("div", {
 					className: "flex items-center justify-between gap-2 text-foreground-subtle text-[9px] mt-0.5",
 					children: [
-						/* @__PURE__ */ v("span", { children: [Z(e.bytesSent), " sent"] }),
+						/* @__PURE__ */ v("span", { children: [Ee(e.bytesSent), " sent"] }),
 						/* @__PURE__ */ v("span", { children: [
 							"connected ",
-							X(Date.now() - e.connectedAt),
+							Z(Date.now() - e.connectedAt),
 							" ago"
 						] }),
 						/* @__PURE__ */ v("span", { children: [
 							"last rtp ",
-							X(t),
+							Z(t),
 							" ago"
 						] })
 					]
@@ -1909,9 +1969,9 @@ function Ee({ count: e, clients: t, onKill: n }) {
 }
 //#endregion
 //#region src/stream-broker/widgets/index.tsx
-var De = {
-	"stream-broker-panel": _e,
-	"ffmpeg-params": ue
+var je = {
+	"stream-broker-panel": be,
+	"ffmpeg-params": pe
 };
 //#endregion
-export { De as default };
+export { je as default };