@camstack/addon-pipeline 0.1.19 → 0.1.20

package/dist/stream-broker/_stub.js

@@ -1,22 +1,23 @@
-import { _ as e, a as r, b as B } from "./__mfe_internal__addon_stream_broker_widgets__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.mjs-gBEZsQrp.mjs";
-import { _ as z, a as G } from "./__mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.mjs-U1EUeEPs.mjs";
-import { a as R, b as S, c as k, d as y, e as I } from "./__mfe_internal__addon_stream_broker_widgets__loadShare__react__loadShare__.mjs-BsB2G7oY.mjs";
-import { _ as E, a as Q, b as W, c as X, d as T, e as Z, f as V, g as J, h as Y } from "./__mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_camstack_mf_1_ui_mf_2_library__loadShare__.mjs-BAv_5ISf.mjs";
+import { _ as r, a as e, b as $ } from "./__mfe_internal__addon_stream_broker_widgets__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.mjs-x6pP3Ghk.mjs";
+import { a as oe, b as V, c as x, d as R, e as W, f as me } from "./__mfe_internal__addon_stream_broker_widgets__loadShare__react__loadShare__.mjs-CaDEYBIU.mjs";
+import { _ as he, a as ie, b as fe, c as ge, d as be, e as le, f as xe, g as ve, h as Ne, i as we } from "./__mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_camstack_mf_1_ui_mf_2_library__loadShare__.mjs-CYXy_bhS.mjs";
+import { _ as ye, a as ke } from "./__mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.mjs-U1EUeEPs.mjs";
+import { _ as Ce } from "./__mfe_internal__addon_stream_broker_widgets__loadShare___mf_0_camstack_mf_1_types__loadShare__.mjs-DJ3UNg7O.mjs";
 /**
  * @license lucide-react v0.511.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ee = (s) => s.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), te = (s) => s.replace(
+const _e = (t) => t.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), $e = (t) => t.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
-  (n, o, i) => i ? i.toUpperCase() : o.toLowerCase()
-), A = (s) => {
-  const n = te(s);
-  return n.charAt(0).toUpperCase() + n.slice(1);
-}, L = (...s) => s.filter((n, o, i) => !!n && n.trim() !== "" && i.indexOf(n) === o).join(" ").trim(), se = (s) => {
-  for (const n in s)
-    if (n.startsWith("aria-") || n === "role" || n === "title")
+  (a, n, o) => o ? o.toUpperCase() : n.toLowerCase()
+), Y = (t) => {
+  const a = $e(t);
+  return a.charAt(0).toUpperCase() + a.slice(1);
+}, ce = (...t) => t.filter((a, n, o) => !!a && a.trim() !== "" && o.indexOf(a) === n).join(" ").trim(), Ae = (t) => {
+  for (const a in t)
+    if (a.startsWith("aria-") || a === "role" || a === "title")
       return !0;
 };
 /**
@@ -25,7 +26,7 @@ const ee = (s) => s.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), te = (
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-var re = {
+var Se = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -42,32 +43,32 @@ var re = {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ne = R(
+const Ie = oe(
   ({
-    color: s = "currentColor",
-    size: n = 24,
-    strokeWidth: o = 2,
-    absoluteStrokeWidth: i,
+    color: t = "currentColor",
+    size: a = 24,
+    strokeWidth: n = 2,
+    absoluteStrokeWidth: o,
     className: c = "",
-    children: t,
-    iconNode: l,
-    ...d
-  }, u) => S(
+    children: s,
+    iconNode: m,
+    ...l
+  }, f) => V(
     "svg",
     {
-      ref: u,
-      ...re,
-      width: n,
-      height: n,
-      stroke: s,
-      strokeWidth: i ? Number(o) * 24 / Number(n) : o,
-      className: L("lucide", c),
-      ...!t && !se(d) && { "aria-hidden": "true" },
-      ...d
+      ref: f,
+      ...Se,
+      width: a,
+      height: a,
+      stroke: t,
+      strokeWidth: o ? Number(n) * 24 / Number(a) : n,
+      className: ce("lucide", c),
+      ...!s && !Ae(l) && { "aria-hidden": "true" },
+      ...l
     },
     [
-      ...l.map(([a, m]) => S(a, m)),
-      ...Array.isArray(t) ? t : [t]
+      ...m.map(([u, d]) => V(u, d)),
+      ...Array.isArray(s) ? s : [s]
     ]
   )
 );
@@ -77,20 +78,20 @@ const ne = R(
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const _ = (s, n) => {
-  const o = R(
-    ({ className: i, ...c }, t) => S(ne, {
-      ref: t,
-      iconNode: n,
-      className: L(
-        `lucide-${ee(A(s))}`,
-        `lucide-${s}`,
-        i
+const T = (t, a) => {
+  const n = oe(
+    ({ className: o, ...c }, s) => V(Ie, {
+      ref: s,
+      iconNode: a,
+      className: ce(
+        `lucide-${_e(Y(t))}`,
+        `lucide-${t}`,
+        o
       ),
       ...c
     })
   );
-  return o.displayName = A(s), o;
+  return n.displayName = Y(t), n;
 };
 /**
  * @license lucide-react v0.511.0 - ISC
@@ -98,67 +99,679 @@ const _ = (s, n) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ae = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], O = _("chevron-down", ae);
+const Fe = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], X = T("chevron-down", Fe);
 /**
  * @license lucide-react v0.511.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const oe = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]], j = _("chevron-right", oe);
+const Pe = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]], Q = T("chevron-right", Pe);
 /**
  * @license lucide-react v0.511.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ie = [
+const Be = [
+  ["path", { d: "M5 12h14", key: "1ays0h" }],
+  ["path", { d: "M12 5v14", key: "s699le" }]
+], Oe = T("plus", Be);
+/**
+ * @license lucide-react v0.511.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const De = [
   ["path", { d: "M4.9 19.1C1 15.2 1 8.8 4.9 4.9", key: "1vaf9d" }],
   ["path", { d: "M7.8 16.2c-2.3-2.3-2.3-6.1 0-8.5", key: "u1ii0m" }],
   ["circle", { cx: "12", cy: "12", r: "2", key: "1c9p78" }],
   ["path", { d: "M16.2 7.8c2.3 2.3 2.3 6.1 0 8.5", key: "1j5fej" }],
   ["path", { d: "M19.1 4.9C23 8.8 23 15.1 19.1 19", key: "10b0cb" }]
-], ce = _("radio", ie);
+], Me = T("radio", De);
 /**
  * @license lucide-react v0.511.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const de = [
+const Ee = [
   ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
   ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
-], le = _("x", de);
-function pe(s) {
-  const n = Math.floor(s / 1e3);
-  if (n < 60) return `${n}s`;
-  const o = Math.floor(n / 60);
-  return o < 60 ? `${o}m` : `${Math.floor(o / 60)}h ${o % 60}m`;
+], Ke = T("x", Ee);
+function Re(t) {
+  const a = [];
+  if (t.crop && a.push(`crop=${t.crop.w}:${t.crop.h}:${t.crop.x}:${t.crop.y}`), t.targetAspect && t.width !== void 0 && t.height !== void 0) {
+    const n = t.targetAspect.replace(":", "/");
+    t.mode === "pad" ? (a.push(`scale=${t.width}:${t.height}:force_original_aspect_ratio=decrease`), a.push(`pad=${t.width}:${t.height}:(ow-iw)/2:(oh-ih)/2`)) : (a.push(`scale=${t.width}:${t.height}:force_original_aspect_ratio=increase`), a.push(`crop=${t.width}:${t.height}`)), a.push(`setdar=${n}`);
+  }
+  return t.rotate === 90 ? a.push("transpose=1") : t.rotate === 270 ? a.push("transpose=2") : t.rotate === 180 && a.push("hflip", "vflip"), t.hflip && t.rotate !== 180 && a.push("hflip"), t.vflip && t.rotate !== 180 && a.push("vflip"), a.join(",");
+}
+function Te(t, a) {
+  const n = [];
+  for (let o = 0; o < t.length; o++) {
+    if (t[o] === "-vf") {
+      o++;
+      continue;
+    }
+    const c = t[o];
+    c !== void 0 && n.push(c);
+  }
+  return a.length > 0 && n.push("-vf", a), n;
+}
+const F = "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", q = F + " appearance-none pr-6", B = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium";
+function je({ outputArgs: t, onChange: a }) {
+  const [n, o] = x(""), [c, s] = x("pad"), [m, l] = x("1920"), [f, u] = x("1080"), [d, p] = x(!1), [v, N] = x("0"), [h, C] = x("0"), [w, A] = x("0"), [S, M] = x("0"), [k, E] = x(0), [K, i] = x(!1), [g, y] = x(!1), z = Re((() => {
+    const b = { rotate: k, hflip: K, vflip: g };
+    return n !== "" && (b.targetAspect = n, b.mode = c, b.width = Number(m), b.height = Number(f)), d && (b.crop = { x: Number(v), y: Number(h), w: Number(w), h: Number(S) }), b;
+  })());
+  return /* @__PURE__ */ r("div", { className: "space-y-2 rounded border border-border/50 bg-surface-2/30 px-3 py-2", children: [
+    /* @__PURE__ */ r("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ r("span", { className: B, children: [
+        "Geometry / zoom",
+        /* @__PURE__ */ e("span", { className: "ml-2 text-[10px] normal-case text-foreground-subtle italic", children: "composes a single -vf into output args" })
+      ] }),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          onClick: () => a(Te(t, z)),
+          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"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ e("label", { className: B, htmlFor: "geom-aspect", children: "Aspect" }),
+      /* @__PURE__ */ r(
+        "select",
+        {
+          id: "geom-aspect",
+          value: n,
+          onChange: (b) => o(b.target.value),
+          className: q + " min-w-[90px]",
+          children: [
+            /* @__PURE__ */ e("option", { value: "", children: "none" }),
+            /* @__PURE__ */ e("option", { value: "16:9", children: "16:9" }),
+            /* @__PURE__ */ e("option", { value: "4:3", children: "4:3" }),
+            /* @__PURE__ */ e("option", { value: "1:1", children: "1:1" })
+          ]
+        }
+      ),
+      n !== "" && /* @__PURE__ */ r($, { children: [
+        /* @__PURE__ */ r(
+          "select",
+          {
+            "aria-label": "Aspect mode",
+            value: c,
+            onChange: (b) => s(b.target.value),
+            className: q + " min-w-[80px]",
+            children: [
+              /* @__PURE__ */ e("option", { value: "pad", children: "pad" }),
+              /* @__PURE__ */ e("option", { value: "crop", children: "crop" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          "input",
+          {
+            type: "number",
+            "aria-label": "Aspect width",
+            value: m,
+            onChange: (b) => l(b.target.value),
+            className: F + " w-20 text-right"
+          }
+        ),
+        /* @__PURE__ */ e("span", { className: "text-[11px] text-foreground-subtle", children: "×" }),
+        /* @__PURE__ */ e(
+          "input",
+          {
+            type: "number",
+            "aria-label": "Aspect height",
+            value: f,
+            onChange: (b) => u(b.target.value),
+            className: F + " w-20 text-right"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ r("label", { className: B + " inline-flex items-center gap-1", children: [
+        /* @__PURE__ */ e("input", { type: "checkbox", checked: d, onChange: (b) => p(b.target.checked) }),
+        "Crop / zoom"
+      ] }),
+      d && /* @__PURE__ */ r($, { children: [
+        /* @__PURE__ */ e("input", { type: "number", "aria-label": "Crop x", value: v, onChange: (b) => N(b.target.value), className: F + " w-16 text-right", placeholder: "x" }),
+        /* @__PURE__ */ e("input", { type: "number", "aria-label": "Crop y", value: h, onChange: (b) => C(b.target.value), className: F + " w-16 text-right", placeholder: "y" }),
+        /* @__PURE__ */ e("input", { type: "number", "aria-label": "Crop width", value: w, onChange: (b) => A(b.target.value), className: F + " w-20 text-right", placeholder: "w" }),
+        /* @__PURE__ */ e("input", { type: "number", "aria-label": "Crop height", value: S, onChange: (b) => M(b.target.value), className: F + " w-20 text-right", placeholder: "h" })
+      ] })
+    ] }),
+    /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ e("label", { className: B, htmlFor: "geom-rotate", children: "Rotate" }),
+      /* @__PURE__ */ r(
+        "select",
+        {
+          id: "geom-rotate",
+          value: String(k),
+          onChange: (b) => E(Number(b.target.value)),
+          className: q + " min-w-[80px]",
+          children: [
+            /* @__PURE__ */ e("option", { value: "0", children: "0°" }),
+            /* @__PURE__ */ e("option", { value: "90", children: "90°" }),
+            /* @__PURE__ */ e("option", { value: "180", children: "180°" }),
+            /* @__PURE__ */ e("option", { value: "270", children: "270°" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ r("label", { className: B + " inline-flex items-center gap-1", children: [
+        /* @__PURE__ */ e("input", { type: "checkbox", checked: K, onChange: (b) => i(b.target.checked) }),
+        "hflip"
+      ] }),
+      /* @__PURE__ */ r("label", { className: B + " inline-flex items-center gap-1", children: [
+        /* @__PURE__ */ e("input", { type: "checkbox", checked: g, onChange: (b) => y(b.target.checked) }),
+        "vflip"
+      ] })
+    ] }),
+    /* @__PURE__ */ r("div", { className: "font-mono text-[10px] text-foreground-subtle break-all", children: [
+      "-vf ",
+      z.length > 0 ? z : /* @__PURE__ */ e("span", { className: "italic", children: "(empty)" })
+    ] })
+  ] });
+}
+const Le = [
+  { group: "Demuxer", label: "-thread_queue_size 1024", args: ["-thread_queue_size", "1024"], description: "Larger input packet queue (helps with high-bitrate sources)" },
+  { group: "Demuxer", label: "-fflags +genpts", args: ["-fflags", "+genpts"], description: "Generate PTS when the source lacks them" },
+  { group: "Demuxer", label: "-re", args: ["-re"], description: "Read input at native frame rate (file replay)" },
+  { group: "Demuxer", label: "-probesize 32", args: ["-probesize", "32"], description: "Minimal probe size — faster start" },
+  { group: "Demuxer", label: "-analyzeduration 0", args: ["-analyzeduration", "0"], description: "Skip stream analysis — faster start" },
+  { group: "RTSP", label: "-rtsp_transport tcp", args: ["-rtsp_transport", "tcp"], description: "Force TCP transport for RTSP source" },
+  { group: "RTSP", label: "-stimeout 5000000", args: ["-stimeout", "5000000"], description: "Socket I/O timeout (microseconds, 5s)" }
+], He = [
+  { group: "Muxer", label: "-flush_packets 1", args: ["-flush_packets", "1"], description: "Flush each packet immediately" },
+  { group: "Muxer", label: "-movflags +faststart", args: ["-movflags", "+faststart"], description: "Move MOOV atom to front (MP4)" },
+  { group: "Bitstream", label: "-bsf:v h264_mp4toannexb", args: ["-bsf:v", "h264_mp4toannexb"], description: "Convert MP4-format H.264 to Annex-B" },
+  { group: "Bitstream", label: "-bsf:v hevc_mp4toannexb", args: ["-bsf:v", "hevc_mp4toannexb"], description: "Convert MP4-format HEVC to Annex-B" },
+  { group: "x264", label: "-x264-params keyint_min=15", args: ["-x264-params", "keyint_min=15"], description: "Force minimum keyframe interval to 15 frames" },
+  { group: "x264", label: "-x264-params scenecut=0", args: ["-x264-params", "scenecut=0"], description: "Disable scene-change keyframes (predictable GOP)" },
+  { group: "x264", label: "-x264-params nal-hrd=cbr", args: ["-x264-params", "nal-hrd=cbr"], description: "Force CBR HRD signalling (HomeKit-friendly)" },
+  { group: "x264", label: "-aq-mode 3", args: ["-aq-mode", "3"], description: "Auto-variance adaptive quantisation (mode 3)" },
+  { group: "x265", label: "-x265-params keyint=30", args: ["-x265-params", "keyint=30"], description: "Force maximum keyframe interval to 30 frames" },
+  { group: "x265", label: "-x265-params no-scenecut=1", args: ["-x265-params", "no-scenecut=1"], description: "Disable scene-change keyframes" },
+  { group: "Global", label: "-fps_mode passthrough", args: ["-fps_mode", "passthrough"], description: "Preserve source framerate exactly" },
+  { group: "Global", label: "-copyts", args: ["-copyts"], description: "Preserve source timestamps" }
+], Ue = { video: { codec: "copy" }, audio: "passthrough" }, O = "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", Z = O + " appearance-none pr-6", J = "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", _ = "text-[11px] uppercase tracking-wider text-foreground-subtle font-medium", j = "rounded-lg border border-border bg-surface overflow-hidden", G = "border-b border-border px-3 py-1.5 flex items-center justify-between bg-surface-hover/30", L = "text-[11px] font-semibold text-foreground uppercase tracking-wider";
+function ze({ config: t, value: a, onSave: n }) {
+  const [o, c] = x(!1), s = a ?? Ue, [m, l] = x(() => (s.inputArgs ?? []).join(`
+`)), [f, u] = x(() => (s.outputArgs ?? []).join(`
+`)), d = W(s);
+  d.current !== s && (d.current = s, l((s.inputArgs ?? []).join(`
+`)), u((s.outputArgs ?? []).join(`
+`)));
+  const p = (i) => {
+    n(i(s));
+  }, v = (i) => p((g) => ({ ...g, video: { ...g.video, codec: i } })), N = (i) => p((g) => ({ ...g, video: { ...g.video, width: i } })), h = (i) => p((g) => ({ ...g, video: { ...g.video, height: i } })), C = (i) => p((g) => ({ ...g, video: { ...g.video, fps: i } })), w = (i) => p((g) => ({ ...g, video: { ...g.video, bitrateKbps: i } })), A = () => p((i) => ({ ...i, audio: "passthrough" })), S = (i) => p((g) => ({
+    ...g,
+    audio: typeof g.audio == "object" ? { ...g.audio, codec: i } : { codec: i }
+  })), M = (i) => p((g) => ({
+    ...g,
+    audio: typeof g.audio == "object" ? { ...g.audio, bitrateKbps: i } : { codec: "opus", bitrateKbps: i }
+  })), k = (i) => p((g) => ({ ...g, inputArgs: i.split(`
+`).map((y) => y.trim()).filter((y) => y.length > 0) })), E = (i) => p((g) => ({ ...g, outputArgs: i.split(`
+`).map((y) => y.trim()).filter((y) => y.length > 0) })), K = (i, g) => {
+    const y = g.args.join(" ");
+    if (i === "input") {
+      const P = m.length === 0 ? y : `${m}
+${y}`;
+      l(P), k(P);
+    } else {
+      const P = f.length === 0 ? y : `${f}
+${y}`;
+      u(P), E(P);
+    }
+  };
+  return /* @__PURE__ */ r("div", { className: "space-y-3", children: [
+    t.sourceParams !== void 0 && /* @__PURE__ */ r("div", { className: j, children: [
+      /* @__PURE__ */ r("div", { className: G, children: [
+        /* @__PURE__ */ e("h3", { className: L, children: "Source (probed)" }),
+        /* @__PURE__ */ e("span", { className: "text-[10px] text-foreground-subtle italic", children: "From the publisher" })
+      ] }),
+      /* @__PURE__ */ e("div", { className: "px-3 py-2 flex flex-wrap gap-1.5", children: /* @__PURE__ */ e(qe, { profile: t.sourceParams }) })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "@container", children: /* @__PURE__ */ r("div", { className: "grid grid-cols-1 @[480px]:grid-cols-2 gap-3", children: [
+      /* @__PURE__ */ r("div", { className: j, children: [
+        /* @__PURE__ */ e("div", { className: G, children: /* @__PURE__ */ e("h3", { className: L, children: "Video" }) }),
+        /* @__PURE__ */ r("div", { className: "px-3 py-2 divide-y divide-border/30", children: [
+          /* @__PURE__ */ r("div", { className: I, children: [
+            /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-video-codec`, className: _, children: "Codec" }),
+            /* @__PURE__ */ r(
+              "select",
+              {
+                id: `${t.fieldKey}-video-codec`,
+                value: s.video.codec,
+                onChange: (i) => v(i.target.value),
+                className: Z + " min-w-[120px]",
+                children: [
+                  /* @__PURE__ */ e("option", { value: "h264", children: "h264" }),
+                  /* @__PURE__ */ e("option", { value: "h265", children: "h265" }),
+                  /* @__PURE__ */ e("option", { value: "copy", children: "copy (passthrough)" })
+                ]
+              }
+            )
+          ] }),
+          s.video.codec !== "copy" && /* @__PURE__ */ r($, { children: [
+            /* @__PURE__ */ r("div", { className: I, children: [
+              /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-video-width`, className: _, children: "Width" }),
+              /* @__PURE__ */ e(
+                "input",
+                {
+                  id: `${t.fieldKey}-video-width`,
+                  type: "number",
+                  "aria-label": "Width",
+                  value: s.video.width ?? "",
+                  onChange: (i) => N(Number(i.target.value)),
+                  className: O + " w-24 text-right"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ r("div", { className: I, children: [
+              /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-video-height`, className: _, children: "Height" }),
+              /* @__PURE__ */ e(
+                "input",
+                {
+                  id: `${t.fieldKey}-video-height`,
+                  type: "number",
+                  value: s.video.height ?? "",
+                  onChange: (i) => h(Number(i.target.value)),
+                  className: O + " w-24 text-right"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ r("div", { className: I, children: [
+              /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-video-fps`, className: _, children: "FPS" }),
+              /* @__PURE__ */ e(
+                "input",
+                {
+                  id: `${t.fieldKey}-video-fps`,
+                  type: "number",
+                  value: s.video.fps ?? "",
+                  onChange: (i) => C(Number(i.target.value)),
+                  className: O + " w-24 text-right"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ r("div", { className: I, children: [
+              /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-video-bitrate`, className: _, children: "Bitrate (kbps)" }),
+              /* @__PURE__ */ e(
+                "input",
+                {
+                  id: `${t.fieldKey}-video-bitrate`,
+                  type: "number",
+                  value: s.video.bitrateKbps ?? "",
+                  onChange: (i) => w(Number(i.target.value)),
+                  className: O + " w-24 text-right"
+                }
+              )
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ r("div", { className: j, children: [
+        /* @__PURE__ */ e("div", { className: G, children: /* @__PURE__ */ e("h3", { className: L, children: "Audio" }) }),
+        /* @__PURE__ */ e("div", { className: "px-3 py-2", children: s.audio === "passthrough" ? /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ e("span", { className: "text-[11px] text-foreground-subtle italic", children: "Source audio forwarded without re-encode." }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: () => S("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"
+            }
+          )
+        ] }) : /* @__PURE__ */ r("div", { className: "divide-y divide-border/30", children: [
+          /* @__PURE__ */ r("div", { className: I, children: [
+            /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-audio-codec`, className: _, children: "Codec" }),
+            /* @__PURE__ */ r(
+              "select",
+              {
+                id: `${t.fieldKey}-audio-codec`,
+                value: s.audio.codec,
+                onChange: (i) => S(i.target.value),
+                className: Z + " min-w-[120px]",
+                children: [
+                  /* @__PURE__ */ e("option", { value: "opus", children: "opus" }),
+                  /* @__PURE__ */ e("option", { value: "aac", children: "aac" }),
+                  /* @__PURE__ */ e("option", { value: "pcmu", children: "pcmu" }),
+                  /* @__PURE__ */ e("option", { value: "pcma", children: "pcma" }),
+                  /* @__PURE__ */ e("option", { value: "copy", children: "copy (passthrough)" })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ r("div", { className: I, children: [
+            /* @__PURE__ */ e("label", { htmlFor: `${t.fieldKey}-audio-bitrate`, className: _, children: "Bitrate (kbps)" }),
+            /* @__PURE__ */ e(
+              "input",
+              {
+                id: `${t.fieldKey}-audio-bitrate`,
+                type: "number",
+                value: s.audio.bitrateKbps ?? "",
+                onChange: (i) => M(Number(i.target.value)),
+                className: O + " w-24 text-right"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e("div", { className: "pt-2", children: /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: A,
+              className: "text-[11px] text-foreground-subtle hover:text-foreground underline-offset-2 hover:underline",
+              children: "Switch back to passthrough"
+            }
+          ) })
+        ] }) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ r("div", { className: j, children: [
+      /* @__PURE__ */ r(
+        "button",
+        {
+          type: "button",
+          onClick: () => c((i) => !i),
+          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__ */ r("span", { className: "inline-flex items-center gap-1.5 " + L, children: [
+              o ? /* @__PURE__ */ e(X, { className: "h-3 w-3" }) : /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
+              "Advanced — raw ffmpeg args"
+            ] }),
+            /* @__PURE__ */ r("span", { className: "text-[10px] text-foreground-subtle italic", children: [
+              (s.inputArgs?.length ?? 0) + (s.outputArgs?.length ?? 0),
+              " args"
+            ] })
+          ]
+        }
+      ),
+      o && /* @__PURE__ */ r("div", { className: "px-3 py-2 space-y-3 border-t border-border/50", children: [
+        /* @__PURE__ */ r("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ r("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ r("label", { htmlFor: `${t.fieldKey}-input-args`, className: _, children: [
+              "Input args",
+              /* @__PURE__ */ e("span", { className: "ml-2 text-[10px] normal-case text-foreground-subtle italic", children: "one per line · inserted between globals and -i" })
+            ] }),
+            /* @__PURE__ */ e(
+              ee,
+              {
+                id: `${t.fieldKey}-input-picker`,
+                disabled: !1,
+                catalogue: Le,
+                onPick: (i) => K("input", i)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e(
+            "textarea",
+            {
+              id: `${t.fieldKey}-input-args`,
+              value: m,
+              onChange: (i) => l(i.target.value),
+              onBlur: (i) => k(i.target.value),
+              placeholder: "-thread_queue_size 1024",
+              className: J
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e(
+          je,
+          {
+            outputArgs: s.outputArgs ?? [],
+            onChange: (i) => {
+              u(i.join(`
+`)), E(i.join(`
+`));
+            }
+          }
+        ),
+        /* @__PURE__ */ r("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ r("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ r("label", { htmlFor: `${t.fieldKey}-output-args`, className: _, children: [
+              "Output args",
+              /* @__PURE__ */ e("span", { className: "ml-2 text-[10px] normal-case text-foreground-subtle italic", children: "one per line · inserted before the final muxer" })
+            ] }),
+            /* @__PURE__ */ e(
+              ee,
+              {
+                id: `${t.fieldKey}-output-picker`,
+                disabled: !1,
+                catalogue: He,
+                onPick: (i) => K("output", i)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e(
+            "textarea",
+            {
+              id: `${t.fieldKey}-output-args`,
+              value: f,
+              onChange: (i) => u(i.target.value),
+              onBlur: (i) => E(i.target.value),
+              placeholder: "-bsf:v h264_mp4toannexb",
+              className: J
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function qe({ profile: t }) {
+  const a = "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: o } = t, c = n.width !== void 0 && n.height !== void 0 ? `${n.width}×${n.height}` : void 0;
+  return /* @__PURE__ */ r($, { children: [
+    /* @__PURE__ */ r("span", { className: a, children: [
+      /* @__PURE__ */ e("span", { className: "opacity-60", children: "codec" }),
+      n.codec
+    ] }),
+    c !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+      /* @__PURE__ */ e("span", { className: "opacity-60", children: "res" }),
+      c
+    ] }),
+    n.fps !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+      /* @__PURE__ */ e("span", { className: "opacity-60", children: "fps" }),
+      n.fps
+    ] }),
+    n.bitrateKbps !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+      /* @__PURE__ */ e("span", { className: "opacity-60", children: "bitrate" }),
+      n.bitrateKbps,
+      "k"
+    ] }),
+    o === "passthrough" ? /* @__PURE__ */ r("span", { className: a, children: [
+      /* @__PURE__ */ e("span", { className: "opacity-60", children: "audio" }),
+      "passthrough"
+    ] }) : /* @__PURE__ */ r($, { children: [
+      /* @__PURE__ */ r("span", { className: a, children: [
+        /* @__PURE__ */ e("span", { className: "opacity-60", children: "audio" }),
+        o.codec
+      ] }),
+      o.bitrateKbps !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+        /* @__PURE__ */ e("span", { className: "opacity-60", children: "a-bitrate" }),
+        o.bitrateKbps,
+        "k"
+      ] }),
+      o.sampleRateHz !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+        /* @__PURE__ */ e("span", { className: "opacity-60", children: "a-sr" }),
+        o.sampleRateHz,
+        "Hz"
+      ] }),
+      o.channels !== void 0 && /* @__PURE__ */ r("span", { className: a, children: [
+        /* @__PURE__ */ e("span", { className: "opacity-60", children: "a-ch" }),
+        o.channels
+      ] })
+    ] })
+  ] });
 }
-const F = {
+function Ge(t) {
+  const a = t.config ?? {}, n = he(), [o, c] = x(() => a.initialValue), s = R((f) => {
+    if (c(f), t.deviceId === void 0) return;
+    const u = a.writerCapName, d = a.writerAddonId, p = a.fieldKey;
+    if (u === void 0 || d === void 0 || p === void 0) {
+      console.warn(
+        `[ffmpeg-params] widgetConfig is missing writerCapName/writerAddonId/fieldKey — field ${p ?? "(unknown)"} cannot be saved. Fix the contribution builder.`
+      );
+      return;
+    }
+    n.mutate({
+      deviceId: t.deviceId,
+      writerCapName: u,
+      writerAddonId: d,
+      key: p,
+      value: f ?? null
+    });
+  }, [
+    t.deviceId,
+    a.fieldKey,
+    a.writerCapName,
+    a.writerAddonId,
+    n
+  ]);
+  if (t.deviceId === void 0)
+    return /* @__PURE__ */ e("div", { className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning", children: "ffmpeg-params: no deviceId in widget context — this widget only renders inside a device tab." });
+  const m = a.fieldKey;
+  if (m === void 0 || m.length === 0)
+    return /* @__PURE__ */ e("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." });
+  const l = { ...a, fieldKey: m };
+  return /* @__PURE__ */ e(ze, { config: l, value: o, onSave: s });
+}
+function ee({ id: t, disabled: a, catalogue: n, onPick: o }) {
+  const [c, s] = x(!1), m = me(() => {
+    const l = /* @__PURE__ */ new Map();
+    for (const f of n) {
+      const u = l.get(f.group) ?? [];
+      u.push(f), l.set(f.group, u);
+    }
+    return l;
+  }, [n]);
+  return /* @__PURE__ */ r("div", { className: "relative", children: [
+    /* @__PURE__ */ r(
+      "button",
+      {
+        id: t,
+        type: "button",
+        disabled: a,
+        onClick: () => s((l) => !l),
+        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__ */ e(Oe, { className: "h-3 w-3" }),
+          "Add flag…"
+        ]
+      }
+    ),
+    c && !a && /* @__PURE__ */ r($, { children: [
+      /* @__PURE__ */ e("div", { className: "fixed inset-0 z-40", onClick: () => s(!1), "aria-hidden": "true" }),
+      /* @__PURE__ */ e(
+        "div",
+        {
+          className: "absolute right-0 top-full z-50 mt-1 max-h-72 w-72 overflow-y-auto rounded-lg border border-border bg-surface shadow-lg",
+          role: "menu",
+          children: Array.from(m.entries()).map(([l, f]) => /* @__PURE__ */ r("div", { className: "border-b border-border/30 last:border-b-0", children: [
+            /* @__PURE__ */ e("div", { className: "sticky top-0 bg-surface-hover/80 backdrop-blur px-2 py-1 text-[9px] font-semibold uppercase tracking-wider text-foreground-subtle", children: l }),
+            f.map((u) => /* @__PURE__ */ r(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  o(u), s(!1);
+                },
+                className: "w-full text-left px-2 py-1.5 hover:bg-surface-hover transition-colors group",
+                children: [
+                  /* @__PURE__ */ e("div", { className: "font-mono text-[11px] text-foreground", children: u.label }),
+                  u.description !== void 0 && /* @__PURE__ */ e("div", { className: "text-[10px] text-foreground-subtle leading-snug mt-0.5", children: u.description })
+                ]
+              },
+              u.label
+            ))
+          ] }, l))
+        }
+      )
+    ] })
+  ] });
+}
+const te = 24;
+function Ve(t) {
+  return /\bEdg\b|\bEdgA\b|\bEdgiOS\b|Edge\//.test(t) ? "Edge" : /\bOPR\b|Opera/.test(t) ? "Opera" : /Firefox\/|\bFxiOS\b/.test(t) ? "Firefox" : /Chrome\/|\bCriOS\b/.test(t) ? "Chrome" : /Safari\//.test(t) ? "Safari" : null;
+}
+function We(t) {
+  return /iPhone|iPad|iPod|\biOS\b|CriOS|FxiOS/.test(t) ? "iOS" : /Mac OS X|Macintosh/.test(t) ? "macOS" : /Windows/.test(t) ? "Windows" : /Android/.test(t) ? "Android" : /Linux/.test(t) ? "Linux" : null;
+}
+function Xe(t) {
+  const a = t.trim();
+  if (a.length === 0) return "";
+  const n = Ve(a), o = We(a);
+  return n && o ? `${n}/${o}` : n || o || (a.length > te ? `${a.slice(0, te)}…` : a);
+}
+function Qe(t) {
+  const a = Math.floor(t / 1e3);
+  if (a < 60) return `${a}s`;
+  const n = Math.floor(a / 60);
+  return n < 60 ? `${n}m` : `${Math.floor(n / 60)}h ${n % 60}m`;
+}
+const re = {
   high: "High",
   mid: "Mid",
   low: "Low"
-}, D = ["high", "mid", "low"];
-function ue(s) {
-  const n = s.config ?? {};
-  return s.deviceId === void 0 ? /* @__PURE__ */ e("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__ */ e(
-    me,
+}, se = ["high", "mid", "low"], Ye = {
+  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",
+  "webrtc-mobile": "bg-emerald-500/15 text-emerald-400",
+  "webrtc-whep": "bg-emerald-500/15 text-emerald-400",
+  "rtsp-listen": "bg-warning/15 text-warning",
+  "derived-broker": "bg-amber-500/15 text-amber-400",
+  recording: "bg-rose-500/15 text-rose-400",
+  pipeline: "bg-cyan-500/15 text-cyan-400",
+  snapshot: "bg-cyan-500/15 text-cyan-400",
+  warmup: "bg-foreground-subtle/10 text-foreground-subtle",
+  unknown: "bg-foreground-subtle/10 text-foreground-subtle"
+}, de = {
+  alexa: "ALEXA",
+  homekit: "HOMEKIT",
+  "webrtc-browser": "BROWSER",
+  "webrtc-mobile": "MOBILE",
+  "webrtc-whep": "WHEP",
+  "rtsp-listen": "RTSP",
+  "derived-broker": "DERIVED",
+  recording: "RECORD",
+  pipeline: "PIPELINE",
+  snapshot: "SNAP",
+  warmup: "WARMUP",
+  unknown: "—"
+};
+function Ze(t) {
+  return de[t] ?? t.toUpperCase().slice(0, 8);
+}
+function Je(t) {
+  return de[t] ?? t;
+}
+function et(t) {
+  const a = t.config ?? {};
+  return t.deviceId === void 0 ? /* @__PURE__ */ e("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__ */ e(
+    tt,
     {
-      deviceId: s.deviceId,
-      title: n.title,
-      variant: n.variant,
-      hideEmpty: n.hideEmpty
+      deviceId: t.deviceId,
+      title: a.title,
+      variant: a.variant,
+      hideEmpty: a.hideEmpty
     }
   );
 }
-function me({
-  deviceId: s,
-  title: n = "Stream Brokers",
-  variant: o = "full",
-  hideEmpty: i = !1
+function tt({
+  deviceId: t,
+  title: a = "Stream Brokers",
+  variant: n = "full",
+  hideEmpty: o = !1
 }) {
-  E(
+  ie(
     ["streamBroker", "listAllProfileSlots"],
     [
       "device.streams-registered",
@@ -167,188 +780,188 @@ function me({
       "device.unregistered"
     ]
   );
-  const { data: c } = Q(
+  const { data: c } = fe(
     void 0,
     { staleTime: 3e4 }
-  ), t = (c ?? []).filter((p) => p.deviceId === s && p.sourceCamStreamId !== null).slice().sort((p, N) => D.indexOf(p.profile) - D.indexOf(N.profile)), l = W(), d = X(l.trpcClient, s), { data: u } = z({
-    queryKey: ["device", s, "cameraStreams.getCameraStreams"],
-    queryFn: () => d?.cameraStreams?.getCameraStreams({}) ?? [],
-    enabled: !!d,
+  ), s = (c ?? []).filter((h) => h.deviceId === t && h.sourceCamStreamId !== null).slice().sort((h, C) => se.indexOf(h.profile) - se.indexOf(C.profile)), m = ge(), l = be(m.trpcClient, t), { data: f } = ye({
+    queryKey: ["device", t, "cameraStreams.getCameraStreams"],
+    queryFn: () => l?.cameraStreams?.getCameraStreams({}) ?? [],
+    enabled: !!l,
     staleTime: 3e4
-  }), a = /* @__PURE__ */ new Map();
-  for (const p of u ?? []) a.set(p.camStreamId, p);
-  const m = new Set(
-    t.map((p) => p.sourceCamStreamId).filter((p) => p !== null)
-  ), f = (u ?? []).filter(
-    (p) => !m.has(p.camStreamId)
-  ), x = t.length > 0, h = f.length > 0;
-  return i && !x && !h ? null : o === "compact" ? x ? /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: t.map((p) => /* @__PURE__ */ e(
-    P,
+  }), u = /* @__PURE__ */ new Map();
+  for (const h of f ?? []) u.set(h.camStreamId, h);
+  const d = new Set(
+    s.map((h) => h.sourceCamStreamId).filter((h) => h !== null)
+  ), p = (f ?? []).filter(
+    (h) => !d.has(h.camStreamId)
+  ), v = s.length > 0, N = p.length > 0;
+  return o && !v && !N ? null : n === "compact" ? v ? /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: s.map((h) => /* @__PURE__ */ e(
+    ne,
     {
-      slot: p,
-      camStreams: a,
+      slot: h,
+      camStreams: u,
       compact: !0
     },
-    p.brokerId
+    h.brokerId
   )) }) : /* @__PURE__ */ e("div", { className: "text-[11px] text-foreground-subtle italic px-2 py-1", children: "No active profile slots" }) : /* @__PURE__ */ r("div", { className: "rounded-lg border border-border bg-surface overflow-hidden", children: [
     /* @__PURE__ */ r("div", { className: "border-b border-border px-4 py-2 flex items-center justify-between", children: [
-      /* @__PURE__ */ e("h2", { className: "text-xs font-semibold text-foreground uppercase tracking-wider", children: n }),
-      x && /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-[10px] font-medium bg-foreground-subtle/10 text-foreground-subtle border border-border", children: [
-        t.length,
+      /* @__PURE__ */ e("h2", { className: "text-xs font-semibold text-foreground uppercase tracking-wider", children: a }),
+      v && /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-[10px] font-medium bg-foreground-subtle/10 text-foreground-subtle border border-border", children: [
+        s.length,
         " assigned"
       ] })
     ] }),
-    x ? /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: t.map((p) => /* @__PURE__ */ e(
-      P,
+    v ? /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: s.map((h) => /* @__PURE__ */ e(
+      ne,
       {
-        slot: p,
-        camStreams: a,
+        slot: h,
+        camStreams: u,
         compact: !1
       },
-      p.brokerId
+      h.brokerId
     )) }) : /* @__PURE__ */ r("div", { className: "px-4 py-6 flex flex-col items-center text-center text-foreground-subtle", children: [
-      /* @__PURE__ */ e(ce, { className: "h-5 w-5 mb-2 opacity-30" }),
+      /* @__PURE__ */ e(Me, { className: "h-5 w-5 mb-2 opacity-30" }),
       /* @__PURE__ */ e("p", { className: "text-xs", children: "No profile slots assigned for this device" })
     ] }),
-    h && /* @__PURE__ */ e(
-      fe,
+    N && /* @__PURE__ */ e(
+      rt,
       {
-        deviceId: s,
-        camStreamIds: f.map((p) => p.camStreamId),
-        camStreams: a
+        deviceId: t,
+        camStreamIds: p.map((h) => h.camStreamId),
+        camStreams: u
       }
     )
   ] });
 }
-function fe({
-  deviceId: s,
-  camStreamIds: n,
-  camStreams: o
+function rt({
+  deviceId: t,
+  camStreamIds: a,
+  camStreams: n
 }) {
-  const [i, c] = y(!1);
+  const [o, c] = x(!1);
   return /* @__PURE__ */ r("div", { className: "border-t border-border/50", children: [
     /* @__PURE__ */ r(
       "button",
       {
         type: "button",
-        onClick: () => c((t) => !t),
+        onClick: () => c((s) => !s),
         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__ */ r("span", { className: "inline-flex items-center gap-1.5 text-[11px] uppercase tracking-wider text-foreground-subtle", children: [
-            i ? /* @__PURE__ */ e(O, { className: "h-3 w-3" }) : /* @__PURE__ */ e(j, { className: "h-3 w-3" }),
+            o ? /* @__PURE__ */ e(X, { className: "h-3 w-3" }) : /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
             "Other active streams"
           ] }),
-          /* @__PURE__ */ e("span", { className: "rounded-full px-2 py-0.5 text-[10px] font-medium bg-foreground-subtle/10 text-foreground-subtle border border-border", children: n.length })
+          /* @__PURE__ */ e("span", { className: "rounded-full px-2 py-0.5 text-[10px] font-medium bg-foreground-subtle/10 text-foreground-subtle border border-border", children: a.length })
         ]
       }
     ),
-    i && /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: n.map((t) => /* @__PURE__ */ e(
-      he,
+    o && /* @__PURE__ */ e("div", { className: "divide-y divide-border/30", children: a.map((s) => /* @__PURE__ */ e(
+      st,
       {
-        deviceId: s,
-        camStreamId: t,
-        camStreams: o
+        deviceId: t,
+        camStreamId: s,
+        camStreams: n
       },
-      t
+      s
     )) })
   ] });
 }
-function he({ deviceId: s, camStreamId: n, camStreams: o }) {
-  const i = `${s}/${n}`, t = T("stream-broker.metrics-snapshot", (u) => u.brokerId === i)?.stats, l = o.get(n), d = t?.status === "streaming";
+function st({ deviceId: t, camStreamId: a, camStreams: n }) {
+  const o = Ce(t, a), s = le("stream-broker.metrics-snapshot", (f) => f.brokerId === o)?.stats, m = n.get(a), l = s?.status === "streaming";
   return /* @__PURE__ */ r("div", { className: "px-4 py-2", children: [
     /* @__PURE__ */ e("div", { className: "flex items-center justify-between mb-1", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5", children: [
       /* @__PURE__ */ e(
         "span",
         {
-          className: `h-1.5 w-1.5 rounded-full ${d ? "bg-success" : "bg-foreground-subtle/40"}`
+          className: `h-1.5 w-1.5 rounded-full ${l ? "bg-success" : "bg-foreground-subtle/40"}`
         }
       ),
-      /* @__PURE__ */ e("span", { className: "text-[11px] font-medium text-foreground", children: l?.label ?? n }),
-      l?.resolution && /* @__PURE__ */ r("span", { className: "text-[10px] text-foreground-subtle", children: [
-        l.resolution.width,
+      /* @__PURE__ */ e("span", { className: "text-[11px] font-medium text-foreground", children: m?.label ?? a }),
+      m?.resolution && /* @__PURE__ */ r("span", { className: "text-[10px] text-foreground-subtle", children: [
+        m.resolution.width,
         "×",
-        l.resolution.height
+        m.resolution.height
       ] }),
-      /* @__PURE__ */ e("span", { className: `text-[10px] ${d ? "text-success" : "text-foreground-subtle"}`, children: t?.status ?? "idle" })
+      /* @__PURE__ */ e("span", { className: `text-[10px] ${l ? "text-success" : "text-foreground-subtle"}`, children: s?.status ?? "idle" })
     ] }) }),
-    t && d && /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-x-3 gap-y-1 text-[10px]", children: [
+    s && l && /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-x-3 gap-y-1 text-[10px]", children: [
       /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
         /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "FPS:" }),
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: t.inputFps.toFixed(1) })
+        /* @__PURE__ */ e("span", { className: "text-foreground", children: s.inputFps.toFixed(1) })
       ] }),
       /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
         /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Bitrate:" }),
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: t.bitrateKbps >= 1e3 ? `${(t.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${t.bitrateKbps} kbps` })
+        /* @__PURE__ */ e("span", { className: "text-foreground", children: s.bitrateKbps >= 1e3 ? `${(s.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${s.bitrateKbps} kbps` })
       ] }),
       /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
         /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Codec:" }),
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: t.codec?.toUpperCase() ?? "—" })
+        /* @__PURE__ */ e("span", { className: "text-foreground", children: s.codec?.toUpperCase() ?? "—" })
       ] }),
       /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
         /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Pkts:" }),
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: t.packetCount > 1e3 ? `${(t.packetCount / 1e3).toFixed(1)}k` : t.packetCount })
+        /* @__PURE__ */ e("span", { className: "text-foreground", children: s.packetCount > 1e3 ? `${(s.packetCount / 1e3).toFixed(1)}k` : s.packetCount })
       ] })
     ] })
   ] });
 }
-function M(s, n) {
-  const o = (i) => {
-    if (!i || typeof i != "object") return;
-    const c = i;
-    if (typeof c.key == "string" && c.key === n && "value" in c) return c.value;
+function ae(t, a) {
+  const n = (o) => {
+    if (!o || typeof o != "object") return;
+    const c = o;
+    if (typeof c.key == "string" && c.key === a && "value" in c) return c.value;
     if (c.type === "group" && Array.isArray(c.fields))
-      for (const t of c.fields) {
-        const l = o(t);
-        if (l !== void 0) return l;
+      for (const s of c.fields) {
+        const m = n(s);
+        if (m !== void 0) return m;
       }
     else if (c.type === "sub-tabs" && Array.isArray(c.tabs)) {
-      for (const t of c.tabs)
-        if (Array.isArray(t.fields))
-          for (const l of t.fields) {
-            const d = o(l);
-            if (d !== void 0) return d;
+      for (const s of c.tabs)
+        if (Array.isArray(s.fields))
+          for (const m of s.fields) {
+            const l = n(m);
+            if (l !== void 0) return l;
           }
     }
   };
-  for (const i of s?.sections ?? [])
-    if (Array.isArray(i.fields))
-      for (const c of i.fields) {
-        const t = o(c);
-        if (t !== void 0) return t;
+  for (const o of t?.sections ?? [])
+    if (Array.isArray(o.fields))
+      for (const c of o.fields) {
+        const s = n(c);
+        if (s !== void 0) return s;
       }
 }
-function P({ slot: s, camStreams: n, compact: o }) {
-  const i = G(), t = T("stream-broker.metrics-snapshot", (b) => b.brokerId === s.brokerId)?.stats;
-  E(["streamBroker", "listClients"], ["stream-broker.metrics-snapshot"]);
-  const { data: l } = Z(
-    { brokerId: s.brokerId },
-    { enabled: t?.status === "streaming", staleTime: 2e3 }
-  ), { data: d } = V(
-    { deviceId: s.deviceId },
+function ne({ slot: t, camStreams: a, compact: n }) {
+  const o = ke(), s = le("stream-broker.metrics-snapshot", (k) => k.brokerId === t.brokerId)?.stats;
+  ie(["streamBroker", "listClients"], ["stream-broker.metrics-snapshot"]);
+  const { data: m } = xe(
+    { brokerId: t.brokerId },
+    { enabled: s?.status === "streaming", staleTime: 2e3 }
+  ), { data: l } = ve(
+    { deviceId: t.deviceId },
     { staleTime: 15e3 }
-  ), u = s.sourceCamStreamId ?? s.profile, a = !!(M(d, `preBufferEnabled:${u}`) ?? !0), m = M(d, `preBufferSec:${u}`), f = J({
+  ), f = t.sourceCamStreamId ?? t.profile, u = !!(ae(l, `preBufferEnabled:${f}`) ?? !0), d = ae(l, `preBufferSec:${f}`), p = Ne({
     onSuccess: () => {
-      i.invalidateQueries({ queryKey: [["streamBroker", "getDeviceSettingsContribution"]] });
+      o.invalidateQueries({ queryKey: [["streamBroker", "getDeviceSettingsContribution"]] });
     }
-  }), x = (b) => {
-    f.mutate({
-      deviceId: s.deviceId,
-      patch: { [`preBufferEnabled:${u}`]: b }
+  }), v = (k) => {
+    p.mutate({
+      deviceId: t.deviceId,
+      patch: { [`preBufferEnabled:${f}`]: k }
     });
-  }, h = Y({
+  }, N = we({
     onSuccess: () => {
-      i.invalidateQueries({ queryKey: [["streamBroker", "listClients"]] });
+      o.invalidateQueries({ queryKey: [["streamBroker", "listClients"]] });
     }
-  }), p = k(
-    (b) => {
-      h.mutate({ brokerId: s.brokerId, ...b });
+  }), h = R(
+    (k) => {
+      N.mutate({ brokerId: t.brokerId, ...k });
     },
-    [h, s.brokerId]
-  ), w = (s.sourceCamStreamId ? n.get(s.sourceCamStreamId) : void 0)?.resolution ?? s.resolution, v = t?.status === "streaming", q = w ? `${F[s.profile]} (${w.width}×${w.height})` : F[s.profile], H = t ? t.encodedSubscribers + t.decodedSubscribers + (t.rtspClients ?? 0) + (t.pipeClients ?? 0) : 0;
+    [N, t.brokerId]
+  ), w = (t.sourceCamStreamId ? a.get(t.sourceCamStreamId) : void 0)?.resolution ?? t.resolution, A = s?.status === "streaming", S = w ? `${re[t.profile]} (${w.width}×${w.height})` : re[t.profile], M = s ? s.encodedSubscribers + s.decodedSubscribers + (s.rtspClients ?? 0) + (s.pipeClients ?? 0) : 0;
   return /* @__PURE__ */ r(
     "div",
     {
-      className: `@container ${o ? "px-3 py-1.5" : "px-4 py-2"}`,
+      className: `@container ${n ? "px-3 py-1.5" : "px-4 py-2"}`,
       style: { containerType: "inline-size" },
       children: [
         /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1.5", children: [
@@ -356,184 +969,184 @@ function P({ slot: s, camStreams: n, compact: o }) {
             /* @__PURE__ */ e(
               "span",
               {
-                className: `h-1.5 w-1.5 rounded-full ${v ? s.profile === "high" ? "bg-success" : s.profile === "mid" ? "bg-warning" : "bg-foreground-subtle" : "bg-foreground-subtle/40"}`
+                className: `h-1.5 w-1.5 rounded-full ${A ? t.profile === "high" ? "bg-success" : t.profile === "mid" ? "bg-warning" : "bg-foreground-subtle" : "bg-foreground-subtle/40"}`
               }
             ),
-            /* @__PURE__ */ e("span", { className: "text-[11px] font-medium text-foreground", children: q }),
-            /* @__PURE__ */ e("span", { className: `text-[10px] ${v ? "text-success" : "text-foreground-subtle"}`, children: t?.status ?? "loading" }),
-            s.sourceCamStreamId && /* @__PURE__ */ r("span", { className: "text-[10px] text-foreground-subtle", children: [
+            /* @__PURE__ */ e("span", { className: "text-[11px] font-medium text-foreground", children: S }),
+            /* @__PURE__ */ e("span", { className: `text-[10px] ${A ? "text-success" : "text-foreground-subtle"}`, children: s?.status ?? "loading" }),
+            t.sourceCamStreamId && /* @__PURE__ */ r("span", { className: "text-[10px] text-foreground-subtle", children: [
               "← ",
-              s.sourceCamStreamId
+              t.sourceCamStreamId
             ] })
           ] }),
-          /* @__PURE__ */ e("span", { className: "text-[10px] text-foreground-subtle", children: t && t.uptimeMs > 0 ? pe(t.uptimeMs) : "—" })
+          /* @__PURE__ */ e("span", { className: "text-[10px] text-foreground-subtle", children: s && s.uptimeMs > 0 ? Qe(s.uptimeMs) : "—" })
         ] }),
-        t && v ? o ? /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-x-3 gap-y-0.5 text-[10px]", children: [
+        s && A ? n ? /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-x-3 gap-y-0.5 text-[10px]", children: [
           /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "FPS:" }),
             /* @__PURE__ */ r("span", { className: "text-foreground", children: [
-              t.inputFps.toFixed(1),
+              s.inputFps.toFixed(1),
               "/",
-              t.decodeFps.toFixed(1)
+              s.decodeFps.toFixed(1)
             ] })
           ] }),
           /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Bitrate:" }),
-            /* @__PURE__ */ e("span", { className: "text-foreground", children: t.bitrateKbps >= 1e3 ? `${(t.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${t.bitrateKbps} kbps` })
+            /* @__PURE__ */ e("span", { className: "text-foreground", children: s.bitrateKbps >= 1e3 ? `${(s.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${s.bitrateKbps} kbps` })
           ] }),
           /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Codec:" }),
-            /* @__PURE__ */ e("span", { className: "text-foreground", children: t.codec?.toUpperCase() ?? "—" })
+            /* @__PURE__ */ e("span", { className: "text-foreground", children: s.codec?.toUpperCase() ?? "—" })
           ] }),
           /* @__PURE__ */ r("span", { className: "inline-flex items-center whitespace-nowrap gap-1", children: [
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Clients:" }),
-            /* @__PURE__ */ e("span", { className: "text-foreground font-semibold", children: H }),
+            /* @__PURE__ */ e("span", { className: "text-foreground font-semibold", children: M }),
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle/70", children: "(" }),
-            /* @__PURE__ */ e(Ne, { count: t.encodedSubscribers + t.decodedSubscribers, clients: l, onKill: p }),
+            /* @__PURE__ */ e(it, { count: s.encodedSubscribers + s.decodedSubscribers, clients: m, onKill: h }),
             /* @__PURE__ */ e("span", { className: "text-foreground-subtle/70", children: "·" }),
-            /* @__PURE__ */ e(ve, { count: t.rtspClients ?? 0, clients: l, onKill: p }),
+            /* @__PURE__ */ e(ct, { count: s.rtspClients ?? 0, clients: m, onKill: h }),
             /* @__PURE__ */ r("span", { className: "text-foreground-subtle/70", children: [
               "· pipe ",
-              t.pipeClients ?? 0,
+              s.pipeClients ?? 0,
               ")"
             ] })
           ] })
-        ] }) : /* @__PURE__ */ r(B, { children: [
+        ] }) : /* @__PURE__ */ r($, { children: [
           /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-x-3 gap-y-1 text-[10px]", children: [
             /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "In:" }),
               /* @__PURE__ */ r("span", { className: "text-foreground", children: [
-                t.inputFps.toFixed(1),
+                s.inputFps.toFixed(1),
                 " fps"
               ] })
             ] }),
             /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Dec:" }),
               /* @__PURE__ */ r("span", { className: "text-foreground", children: [
-                t.decodeFps.toFixed(1),
+                s.decodeFps.toFixed(1),
                 " fps"
               ] })
             ] }),
             /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Bitrate:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.bitrateKbps >= 1e3 ? `${(t.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${t.bitrateKbps} kbps` })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.bitrateKbps >= 1e3 ? `${(s.bitrateKbps / 1e3).toFixed(1)} Mbps` : `${s.bitrateKbps} kbps` })
             ] }),
             /* @__PURE__ */ r("span", { className: "hidden @[480px]:inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "IDR:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.idrIntervalMs > 0 ? `${(t.idrIntervalMs / 1e3).toFixed(1)}s` : "—" })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.idrIntervalMs > 0 ? `${(s.idrIntervalMs / 1e3).toFixed(1)}s` : "—" })
             ] }),
             /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Codec:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.codec?.toUpperCase() ?? "—" })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.codec?.toUpperCase() ?? "—" })
             ] }),
             /* @__PURE__ */ r("span", { className: "hidden @[480px]:inline-flex whitespace-nowrap gap-1 max-w-full overflow-hidden", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Decoder:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground font-mono truncate", children: t.decoderNodeId ?? /* @__PURE__ */ e("span", { className: "text-foreground-subtle italic", children: "deferred" }) })
+              /* @__PURE__ */ e("span", { className: "text-foreground font-mono truncate", children: s.decoderNodeId ?? /* @__PURE__ */ e("span", { className: "text-foreground-subtle italic", children: "deferred" }) })
             ] }),
             /* @__PURE__ */ r("span", { className: "hidden @[640px]:inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Pipe:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.pipeClients ?? 0 })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.pipeClients ?? 0 })
             ] }),
             /* @__PURE__ */ r("span", { className: "hidden @[640px]:inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Packets:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.packetCount > 1e3 ? `${(t.packetCount / 1e3).toFixed(1)}k` : t.packetCount })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.packetCount > 1e3 ? `${(s.packetCount / 1e3).toFixed(1)}k` : s.packetCount })
             ] }),
             /* @__PURE__ */ r("span", { className: "hidden @[640px]:inline-flex whitespace-nowrap gap-1", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Data:" }),
-              /* @__PURE__ */ e("span", { className: "text-foreground", children: t.totalBytes > 1048576 ? `${(t.totalBytes / 1048576).toFixed(1)} MB` : `${(t.totalBytes / 1024).toFixed(0)} KB` })
+              /* @__PURE__ */ e("span", { className: "text-foreground", children: s.totalBytes > 1048576 ? `${(s.totalBytes / 1048576).toFixed(1)} MB` : `${(s.totalBytes / 1024).toFixed(0)} KB` })
             ] }),
-            t.audio && /* @__PURE__ */ r("div", { className: "basis-full flex flex-wrap items-center gap-x-1.5 gap-y-0.5", children: [
+            s.audio && /* @__PURE__ */ r("div", { className: "basis-full flex flex-wrap items-center gap-x-1.5 gap-y-0.5", children: [
               /* @__PURE__ */ e("span", { className: "text-foreground-subtle whitespace-nowrap", children: "Audio:" }),
               /* @__PURE__ */ r("span", { className: "inline-flex whitespace-nowrap items-center gap-1.5", children: [
-                /* @__PURE__ */ e("span", { className: "text-foreground", children: t.audio.codec.toUpperCase() }),
+                /* @__PURE__ */ e("span", { className: "text-foreground", children: s.audio.codec.toUpperCase() }),
                 /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "·" }),
-                /* @__PURE__ */ e("span", { className: "text-foreground", children: t.audio.sampleRate >= 1e3 ? `${(t.audio.sampleRate / 1e3).toFixed(t.audio.sampleRate % 1e3 === 0 ? 0 : 1)}kHz` : `${t.audio.sampleRate}Hz` }),
+                /* @__PURE__ */ e("span", { className: "text-foreground", children: s.audio.sampleRate >= 1e3 ? `${(s.audio.sampleRate / 1e3).toFixed(s.audio.sampleRate % 1e3 === 0 ? 0 : 1)}kHz` : `${s.audio.sampleRate}Hz` }),
                 /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "·" }),
-                /* @__PURE__ */ e("span", { className: "text-foreground", children: t.audio.channels === 1 ? "mono" : t.audio.channels === 2 ? "stereo" : `${t.audio.channels}ch` })
+                /* @__PURE__ */ e("span", { className: "text-foreground", children: s.audio.channels === 1 ? "mono" : s.audio.channels === 2 ? "stereo" : `${s.audio.channels}ch` })
               ] }),
-              /* @__PURE__ */ e("span", { className: `px-1 py-px rounded text-[8px] font-medium whitespace-nowrap ${t.audio.supported ? "bg-success/15 text-success" : "bg-amber-500/15 text-amber-500"}`, children: t.audio.supported ? "decoded" : "no decoder" })
+              /* @__PURE__ */ e("span", { className: `px-1 py-px rounded text-[8px] font-medium whitespace-nowrap ${s.audio.supported ? "bg-success/15 text-success" : "bg-amber-500/15 text-amber-500"}`, children: s.audio.supported ? "decoded" : "no decoder" })
             ] })
           ] }),
-          /* @__PURE__ */ e(ge, { clients: l, encodedCount: t.encodedSubscribers, onKill: p })
+          /* @__PURE__ */ e(ot, { clients: m, encodedCount: s.encodedSubscribers, onKill: h })
         ] }) : /* @__PURE__ */ e("p", { className: "text-[10px] text-foreground-subtle italic", children: "No demand — stream suspended" }),
         /* @__PURE__ */ r("div", { className: "mt-1.5 flex items-center gap-1.5 text-[10px]", children: [
           /* @__PURE__ */ e("span", { className: "text-foreground-subtle", children: "Buffer:" }),
           /* @__PURE__ */ e(
-            we,
+            lt,
             {
-              enabled: a,
-              onToggle: (b) => x(b),
-              disabled: f.isPending
+              enabled: u,
+              onToggle: (k) => v(k),
+              disabled: p.isPending
             }
           ),
           /* @__PURE__ */ r("span", { className: "text-foreground", children: [
-            m ?? t?.preBufferSec ?? 0,
+            d ?? s?.preBufferSec ?? 0,
             "s",
-            t && v ? ` (${t.preBufferPackets}p)` : ""
+            s && A ? ` (${s.preBufferPackets}p)` : ""
           ] })
         ] })
       ]
     }
   );
 }
-const xe = 280, be = 120;
-function K({ trigger: s, content: n, widthClass: o }) {
-  const i = I(null), c = I(null), [t, l] = y(!1), [d, u] = y(!1), a = k(() => {
+const at = 280, nt = 120;
+function ue({ trigger: t, content: a, widthClass: n }) {
+  const o = W(null), c = W(null), [s, m] = x(!1), [l, f] = x(!1), u = R(() => {
     c.current && (clearTimeout(c.current), c.current = null);
-  }, []), m = k(() => {
-    a(), c.current = setTimeout(() => l(!1), be);
-  }, [a]), f = k(() => {
-    a();
-    const h = i.current;
-    if (h) {
-      const p = h.getBoundingClientRect(), N = window.innerHeight - p.bottom, w = p.top;
-      u(N < xe && w > N);
+  }, []), d = R(() => {
+    u(), c.current = setTimeout(() => m(!1), nt);
+  }, [u]), p = R(() => {
+    u();
+    const N = o.current;
+    if (N) {
+      const h = N.getBoundingClientRect(), C = window.innerHeight - h.bottom, w = h.top;
+      f(C < at && w > C);
     }
-    l(!0);
-  }, [a]);
+    m(!0);
+  }, [u]);
   return /* @__PURE__ */ r(
     "span",
     {
-      ref: i,
+      ref: o,
       className: "relative inline-block",
-      onMouseEnter: f,
-      onMouseLeave: m,
+      onMouseEnter: p,
+      onMouseLeave: d,
       children: [
-        s,
-        t && /* @__PURE__ */ e(
+        t,
+        s && /* @__PURE__ */ e(
           "div",
           {
-            className: `absolute left-0 ${d ? "bottom-full mb-1" : "top-full mt-1"} z-50 ${o} rounded-md border border-border bg-surface shadow-xl p-2 text-[10px] normal-case`,
-            onMouseEnter: a,
-            onMouseLeave: m,
-            children: n
+            className: `absolute left-0 ${l ? "bottom-full mb-1" : "top-full mt-1"} z-50 ${n} rounded-md border border-border bg-surface shadow-xl p-2 text-[10px] normal-case`,
+            onMouseEnter: u,
+            onMouseLeave: d,
+            children: a
           }
         )
       ]
     }
   );
 }
-function g(s) {
-  if (s < 1e3) return `${s}ms`;
-  const n = Math.floor(s / 1e3);
-  if (n < 60) return `${n}s`;
-  const o = Math.floor(n / 60);
-  return o < 60 ? `${o}m ${n % 60}s` : `${Math.floor(o / 60)}h ${o % 60}m`;
+function D(t) {
+  if (t < 1e3) return `${t}ms`;
+  const a = Math.floor(t / 1e3);
+  if (a < 60) return `${a}s`;
+  const n = Math.floor(a / 60);
+  return n < 60 ? `${n}m ${a % 60}s` : `${Math.floor(n / 60)}h ${n % 60}m`;
 }
-function U(s) {
-  return s < 1024 ? `${s} B` : s < 1048576 ? `${(s / 1024).toFixed(1)} KB` : s < 1073741824 ? `${(s / 1048576).toFixed(1)} MB` : `${(s / 1073741824).toFixed(2)} GB`;
+function pe(t) {
+  return t < 1024 ? `${t} B` : t < 1048576 ? `${(t / 1024).toFixed(1)} KB` : t < 1073741824 ? `${(t / 1048576).toFixed(1)} MB` : `${(t / 1073741824).toFixed(2)} GB`;
 }
-function ge({ clients: s, encodedCount: n, onKill: o }) {
-  const i = s?.decoded ?? [], c = s?.audio ?? [], t = s?.rtsp ?? [], l = i.length + c.length + t.length + n, [d, u] = y(!0);
+function ot({ clients: t, encodedCount: a, onKill: n }) {
+  const o = t?.decoded ?? [], c = t?.audio ?? [], s = t?.rtsp ?? [], m = t?.encoded ?? [], l = o.length + c.length + s.length + m.length, [f, u] = x(!0);
   return l === 0 ? /* @__PURE__ */ e("div", { className: "mt-1.5 text-[10px] text-foreground-subtle italic", children: "No active subscribers" }) : /* @__PURE__ */ r("div", { className: "mt-1.5 border-t border-border/30 pt-1.5", children: [
     /* @__PURE__ */ r(
       "button",
       {
         type: "button",
-        onClick: () => u((a) => !a),
+        onClick: () => u((d) => !d),
         className: "flex items-center gap-1 text-[10px] text-foreground-subtle hover:text-foreground transition-colors",
         children: [
-          d ? /* @__PURE__ */ e(O, { className: "h-3 w-3" }) : /* @__PURE__ */ e(j, { className: "h-3 w-3" }),
+          f ? /* @__PURE__ */ e(X, { className: "h-3 w-3" }) : /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
           /* @__PURE__ */ r("span", { className: "uppercase tracking-wider", children: [
             "Subscribers (",
             l,
@@ -542,211 +1155,228 @@ function ge({ clients: s, encodedCount: n, onKill: o }) {
         ]
       }
     ),
-    d && /* @__PURE__ */ r("div", { className: "mt-1 divide-y divide-border/20", children: [
-      i.map((a, m) => /* @__PURE__ */ e(
-        $,
+    f && /* @__PURE__ */ r("div", { className: "mt-1 divide-y divide-border/20", children: [
+      o.map((d, p) => /* @__PURE__ */ e(
+        H,
         {
           kind: "DECODED",
           kindClass: "bg-success/10 text-success",
-          tag: a.tag || "unknown",
+          tag: d.tag || "unknown",
           metrics: [
-            `${a.maxFps.toFixed(0)}fps`,
-            `${a.framesDelivered} del`,
-            ...a.framesDropped > 0 ? [{ text: `${a.framesDropped} drop`, warn: !0 }] : []
+            `${d.maxFps.toFixed(0)}fps`,
+            `${d.framesDelivered} del`,
+            ...d.framesDropped > 0 ? [{ text: `${d.framesDropped} drop`, warn: !0 }] : []
           ],
-          age: Date.now() - a.subscribedAt,
-          onKill: o && a.tag ? () => o({ channel: "decoded", handle: a.tag }) : void 0
+          age: Date.now() - d.subscribedAt,
+          onKill: n && d.tag ? () => n({ channel: "decoded", handle: d.tag }) : void 0
         },
-        `d-${m}`
+        `d-${p}`
       )),
-      c.map((a, m) => /* @__PURE__ */ e(
-        $,
+      c.map((d, p) => /* @__PURE__ */ e(
+        H,
         {
           kind: "AUDIO",
           kindClass: "bg-info/10 text-info",
-          tag: a.tag || "unknown",
-          metrics: [`${a.chunksDelivered} chunks`],
-          age: Date.now() - a.subscribedAt,
-          onKill: o && a.tag ? () => o({ channel: "audio", handle: a.tag }) : void 0
+          tag: d.tag || "unknown",
+          metrics: [`${d.chunksDelivered} chunks`],
+          age: Date.now() - d.subscribedAt,
+          onKill: n && d.tag ? () => n({ channel: "audio", handle: d.tag }) : void 0
         },
-        `a-${m}`
+        `a-${p}`
       )),
-      t.map((a) => {
-        const m = Date.now() - a.lastRtpAt, f = m > 5e3, x = a.playing ? f ? "stalled" : "playing" : "paused", h = a.playing ? f ? "bg-amber-400/10 text-amber-400" : "bg-success/10 text-success" : "bg-foreground-subtle/10 text-foreground-subtle";
+      s.map((d) => {
+        const p = Date.now() - d.lastRtpAt, v = p > 5e3, N = d.playing ? v ? "stalled" : "playing" : "paused", h = d.playing ? v ? "bg-amber-400/10 text-amber-400" : "bg-success/10 text-success" : "bg-foreground-subtle/10 text-foreground-subtle";
         return /* @__PURE__ */ e(
-          $,
+          H,
           {
             kind: "RTSP",
             kindClass: "bg-warning/10 text-warning",
-            tag: a.remoteAddr,
-            state: { text: x + (a.muted ? " · muted" : ""), className: h },
-            metrics: [U(a.bytesSent), `last rtp ${g(m)} ago`],
-            age: Date.now() - a.connectedAt,
-            onKill: o ? () => o({ channel: "rtsp", handle: a.sessionId }) : void 0
+            tag: d.remoteAddr,
+            state: { text: N + (d.muted ? " · muted" : ""), className: h },
+            metrics: [pe(d.bytesSent), `last rtp ${D(p)} ago`],
+            age: Date.now() - d.connectedAt,
+            onKill: n ? () => n({ channel: "rtsp", handle: d.sessionId }) : void 0
+          },
+          `r-${d.sessionId}`
+        );
+      }),
+      m.map((d) => {
+        const p = d.attribution, v = Ye[p.kind] ?? "bg-foreground-subtle/10 text-foreground-subtle", N = p.sessionId ? p.sessionId.slice(0, 8) : null, h = [];
+        p.label && h.push(p.label), N && h.push(`sess ${N}`), p.userId && h.push(`user ${p.userId.slice(0, 8)}`), p.remoteAddr && h.push(`@${p.remoteAddr}`), p.userAgent && h.push(Xe(p.userAgent));
+        const C = h.length > 0 ? h.join(" · ") : Je(p.kind), w = [];
+        return p.media && w.push({ text: p.media }), p.targetCodec && w.push(p.targetCodec), p.transport && w.push(p.transport), w.push(`${d.packetsDelivered} pkts`), /* @__PURE__ */ e(
+          H,
+          {
+            kind: Ze(p.kind),
+            kindClass: v,
+            tag: C,
+            metrics: w,
+            age: Date.now() - d.subscribedAt
           },
-          `r-${a.sessionId}`
+          d.id
         );
       }),
-      n > 0 && /* @__PURE__ */ r("div", { className: "py-0.5 text-[10px] text-foreground-subtle", children: [
+      m.length === 0 && a > 0 && /* @__PURE__ */ r("div", { className: "py-0.5 text-[10px] text-foreground-subtle", children: [
         /* @__PURE__ */ e("span", { className: "inline-block px-1 rounded text-[9px] font-bold bg-foreground-subtle/10 text-foreground-subtle mr-2", children: "ENCODED" }),
-        n,
+        a,
         " callback subscriber(s)"
       ] })
     ] })
   ] });
 }
-function $({ kind: s, kindClass: n, tag: o, state: i, metrics: c, age: t, onKill: l }) {
+function H({ kind: t, kindClass: a, tag: n, state: o, metrics: c, age: s, onKill: m }) {
   return /* @__PURE__ */ r("div", { className: "flex items-center gap-2 py-0.5 text-[10px]", children: [
-    /* @__PURE__ */ e("span", { className: `inline-block px-1 rounded text-[9px] font-bold shrink-0 w-14 text-center ${n}`, children: s }),
-    /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate flex-1", children: o }),
-    i && /* @__PURE__ */ e("span", { className: `text-[9px] px-1 rounded shrink-0 ${i.className}`, children: i.text }),
+    /* @__PURE__ */ e("span", { className: `inline-block px-1 rounded text-[9px] font-bold shrink-0 w-14 text-center ${a}`, children: t }),
+    /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate flex-1", children: n }),
+    o && /* @__PURE__ */ e("span", { className: `text-[9px] px-1 rounded shrink-0 ${o.className}`, children: o.text }),
     /* @__PURE__ */ r("span", { className: "text-foreground-subtle flex items-center gap-1.5 shrink-0", children: [
-      c.map((d, u) => /* @__PURE__ */ r("span", { children: [
-        u > 0 && /* @__PURE__ */ e("span", { className: "mr-1.5 text-foreground-subtle/50", children: "·" }),
-        typeof d == "string" ? d : /* @__PURE__ */ e("span", { className: d.warn ? "text-amber-400" : "", children: d.text })
-      ] }, u)),
+      c.map((l, f) => /* @__PURE__ */ r("span", { children: [
+        f > 0 && /* @__PURE__ */ e("span", { className: "mr-1.5 text-foreground-subtle/50", children: "·" }),
+        typeof l == "string" ? l : /* @__PURE__ */ e("span", { className: l.warn ? "text-amber-400" : "", children: l.text })
+      ] }, f)),
       /* @__PURE__ */ r("span", { className: "text-foreground-subtle/70", children: [
         "· ",
-        g(t)
+        D(s)
       ] })
     ] }),
-    /* @__PURE__ */ e("div", { className: "w-5 flex-shrink-0 flex items-center justify-end", children: l ? /* @__PURE__ */ e(C, { onClick: l }) : null })
+    /* @__PURE__ */ e("div", { className: "w-5 flex-shrink-0 flex items-center justify-end", children: m ? /* @__PURE__ */ e(U, { onClick: m }) : null })
   ] });
 }
-function Ne({ count: s, clients: n, onKill: o }) {
-  const i = n?.decoded ?? [], c = n?.audio ?? [], t = n ? n.encodedSubscribers : 0, l = i.length > 0 || c.length > 0 || t > 0, d = /* @__PURE__ */ e("span", { className: `text-foreground ${l ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`, children: s });
-  if (!l) return d;
-  const u = /* @__PURE__ */ r(B, { children: [
-    i.length > 0 && /* @__PURE__ */ r("div", { className: "mb-2", children: [
+function it({ count: t, clients: a, onKill: n }) {
+  const o = a?.decoded ?? [], c = a?.audio ?? [], s = a ? a.encodedSubscribers : 0, m = o.length > 0 || c.length > 0 || s > 0, l = /* @__PURE__ */ e("span", { className: `text-foreground ${m ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`, children: t });
+  if (!m) return l;
+  const f = /* @__PURE__ */ r($, { children: [
+    o.length > 0 && /* @__PURE__ */ r("div", { className: "mb-2", children: [
       /* @__PURE__ */ e("div", { className: "text-foreground-subtle uppercase text-[9px] tracking-wider mb-1", children: "Decoded subscribers" }),
-      i.map((a, m) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2 py-0.5", children: [
-        /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate", children: a.tag || "unknown" }),
+      o.map((u, d) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2 py-0.5", children: [
+        /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate", children: u.tag || "unknown" }),
         /* @__PURE__ */ r("span", { className: "text-foreground-subtle text-[9px] flex items-center gap-1.5 shrink-0", children: [
           /* @__PURE__ */ r("span", { children: [
-            a.maxFps.toFixed(0),
+            u.maxFps.toFixed(0),
             "fps"
           ] }),
           /* @__PURE__ */ e("span", { children: "·" }),
           /* @__PURE__ */ r("span", { children: [
-            a.framesDelivered,
+            u.framesDelivered,
             " del"
           ] }),
-          a.framesDropped > 0 && /* @__PURE__ */ r("span", { className: "text-amber-400", children: [
+          u.framesDropped > 0 && /* @__PURE__ */ r("span", { className: "text-amber-400", children: [
             "· ",
-            a.framesDropped,
+            u.framesDropped,
             " drop"
           ] }),
           /* @__PURE__ */ e("span", { children: "·" }),
-          /* @__PURE__ */ e("span", { children: g(Date.now() - a.subscribedAt) }),
-          o && a.tag && /* @__PURE__ */ e(C, { onClick: () => o({ channel: "decoded", handle: a.tag }) })
+          /* @__PURE__ */ e("span", { children: D(Date.now() - u.subscribedAt) }),
+          n && u.tag && /* @__PURE__ */ e(U, { onClick: () => n({ channel: "decoded", handle: u.tag }) })
         ] })
-      ] }, `d-${m}`))
+      ] }, `d-${d}`))
     ] }),
     c.length > 0 && /* @__PURE__ */ r("div", { className: "mb-2", children: [
       /* @__PURE__ */ e("div", { className: "text-foreground-subtle uppercase text-[9px] tracking-wider mb-1", children: "Audio subscribers" }),
-      c.map((a, m) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2 py-0.5", children: [
-        /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate", children: a.tag || "unknown" }),
+      c.map((u, d) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2 py-0.5", children: [
+        /* @__PURE__ */ e("span", { className: "text-foreground font-medium truncate", children: u.tag || "unknown" }),
         /* @__PURE__ */ r("span", { className: "text-foreground-subtle text-[9px] flex items-center gap-1.5 shrink-0", children: [
           /* @__PURE__ */ r("span", { children: [
-            a.chunksDelivered,
+            u.chunksDelivered,
             " chunks"
           ] }),
           /* @__PURE__ */ e("span", { children: "·" }),
-          /* @__PURE__ */ e("span", { children: g(Date.now() - a.subscribedAt) }),
-          o && a.tag && /* @__PURE__ */ e(C, { onClick: () => o({ channel: "audio", handle: a.tag }) })
+          /* @__PURE__ */ e("span", { children: D(Date.now() - u.subscribedAt) }),
+          n && u.tag && /* @__PURE__ */ e(U, { onClick: () => n({ channel: "audio", handle: u.tag }) })
         ] })
-      ] }, `a-${m}`))
+      ] }, `a-${d}`))
     ] }),
-    t > 0 && /* @__PURE__ */ r("div", { children: [
+    s > 0 && /* @__PURE__ */ r("div", { children: [
       /* @__PURE__ */ e("div", { className: "text-foreground-subtle uppercase text-[9px] tracking-wider mb-1", children: "Encoded" }),
       /* @__PURE__ */ r("div", { className: "text-foreground", children: [
-        t,
+        s,
         " callback subscriber(s)"
       ] })
     ] })
   ] });
-  return /* @__PURE__ */ e(K, { trigger: d, content: u, widthClass: "min-w-[260px] max-w-[360px]" });
+  return /* @__PURE__ */ e(ue, { trigger: l, content: f, widthClass: "min-w-[260px] max-w-[360px]" });
 }
-function we({
-  enabled: s,
-  onToggle: n,
-  disabled: o
+function lt({
+  enabled: t,
+  onToggle: a,
+  disabled: n
 }) {
   return /* @__PURE__ */ e(
     "button",
     {
       type: "button",
       role: "switch",
-      "aria-checked": s,
-      disabled: o,
-      onClick: () => n(!s),
-      className: `relative inline-flex h-3 w-6 shrink-0 items-center rounded-full transition-colors ${s ? "bg-success/60" : "bg-foreground-subtle/30"} ${o ? "opacity-50 cursor-wait" : "cursor-pointer"}`,
-      title: s ? "Pre-buffer enabled — click to disable" : "Pre-buffer disabled — click to enable",
+      "aria-checked": t,
+      disabled: n,
+      onClick: () => a(!t),
+      className: `relative inline-flex h-3 w-6 shrink-0 items-center rounded-full transition-colors ${t ? "bg-success/60" : "bg-foreground-subtle/30"} ${n ? "opacity-50 cursor-wait" : "cursor-pointer"}`,
+      title: t ? "Pre-buffer enabled — click to disable" : "Pre-buffer disabled — click to enable",
       children: /* @__PURE__ */ e(
         "span",
         {
-          className: `inline-block h-2.5 w-2.5 rounded-full bg-white shadow transition-transform ${s ? "translate-x-3" : "translate-x-0.5"}`
+          className: `inline-block h-2.5 w-2.5 rounded-full bg-white shadow transition-transform ${t ? "translate-x-3" : "translate-x-0.5"}`
         }
       )
     }
   );
 }
-function C({ onClick: s }) {
+function U({ onClick: t }) {
   return /* @__PURE__ */ e(
     "button",
     {
       type: "button",
       title: "Force-disconnect this client",
-      onClick: (n) => {
-        n.stopPropagation(), s();
+      onClick: (a) => {
+        a.stopPropagation(), t();
       },
       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__ */ e(le, { className: "h-2.5 w-2.5" })
+      children: /* @__PURE__ */ e(Ke, { className: "h-2.5 w-2.5" })
     }
   );
 }
-function ve({ count: s, clients: n, onKill: o }) {
-  const i = n?.rtsp ?? [], c = i.length > 0, t = /* @__PURE__ */ e("span", { className: `text-foreground ${c ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`, children: s });
-  if (!c) return t;
-  const l = /* @__PURE__ */ r(B, { children: [
+function ct({ count: t, clients: a, onKill: n }) {
+  const o = a?.rtsp ?? [], c = o.length > 0, s = /* @__PURE__ */ e("span", { className: `text-foreground ${c ? "underline decoration-dotted decoration-foreground-subtle/50 underline-offset-2 cursor-help" : ""}`, children: t });
+  if (!c) return s;
+  const m = /* @__PURE__ */ r($, { children: [
     /* @__PURE__ */ e("div", { className: "text-foreground-subtle uppercase text-[9px] tracking-wider mb-1", children: "RTSP sessions" }),
-    i.map((d) => {
-      const u = Date.now() - d.lastRtpAt, a = u > 5e3;
+    o.map((l) => {
+      const f = Date.now() - l.lastRtpAt, u = f > 5e3;
       return /* @__PURE__ */ r("div", { className: "py-1 border-b border-border/40 last:border-b-0", children: [
         /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ e("span", { className: "text-foreground font-mono", children: d.remoteAddr }),
+          /* @__PURE__ */ e("span", { className: "text-foreground font-mono", children: l.remoteAddr }),
           /* @__PURE__ */ r("span", { className: "flex items-center gap-1 shrink-0", children: [
-            /* @__PURE__ */ r("span", { className: `text-[9px] px-1 rounded ${d.playing ? a ? "bg-amber-400/10 text-amber-400" : "bg-success/10 text-success" : "bg-foreground-subtle/10 text-foreground-subtle"}`, children: [
-              d.playing ? a ? "stalled" : "playing" : "paused",
-              d.muted && " · muted"
+            /* @__PURE__ */ r("span", { className: `text-[9px] px-1 rounded ${l.playing ? u ? "bg-amber-400/10 text-amber-400" : "bg-success/10 text-success" : "bg-foreground-subtle/10 text-foreground-subtle"}`, children: [
+              l.playing ? u ? "stalled" : "playing" : "paused",
+              l.muted && " · muted"
             ] }),
-            o && /* @__PURE__ */ e(C, { onClick: () => o({ channel: "rtsp", handle: d.sessionId }) })
+            n && /* @__PURE__ */ e(U, { onClick: () => n({ channel: "rtsp", handle: l.sessionId }) })
           ] })
         ] }),
         /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-2 text-foreground-subtle text-[9px] mt-0.5", children: [
           /* @__PURE__ */ r("span", { children: [
-            U(d.bytesSent),
+            pe(l.bytesSent),
             " sent"
           ] }),
           /* @__PURE__ */ r("span", { children: [
             "connected ",
-            g(Date.now() - d.connectedAt),
+            D(Date.now() - l.connectedAt),
             " ago"
           ] }),
           /* @__PURE__ */ r("span", { children: [
             "last rtp ",
-            g(u),
+            D(f),
             " ago"
           ] })
         ] })
-      ] }, d.sessionId);
+      ] }, l.sessionId);
     })
   ] });
-  return /* @__PURE__ */ e(K, { trigger: t, content: l, widthClass: "min-w-[300px] max-w-[420px]" });
+  return /* @__PURE__ */ e(ue, { trigger: s, content: m, widthClass: "min-w-[300px] max-w-[420px]" });
 }
-const $e = {
-  "stream-broker-panel": ue
+const gt = {
+  "stream-broker-panel": et,
+  "ffmpeg-params": Ge
 };
 export {
-  $e as default
+  gt as default
 };