@camstack/addon-pipeline-orchestrator 0.1.27 → 0.2.0

package/dist/_stub.js

@@ -1,1080 +1,1005 @@
-import { _ as t, a as i, b as X } from "./__mfe_internal__addon_pipeline_orchestrator_widgets__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.mjs-Cg6QsnjR.mjs";
-import { _ as B } from "./__mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.mjs-DoWbefqS.mjs";
-import { _ as V, a as re, b as oe, c as O, d as q, e as ae, f as U, g as P, h as se, i as z, j as J, k as ie, l as le, m as A, n as F, o as T, p as ce, q as de, r as ue, s as pe, t as me, u as fe, v as he, w as ge } from "./__mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_camstack_mf_1_ui_mf_2_library__loadShare__.mjs-B1VWqPID.mjs";
-import { a as Y, b as K, c as Z, d as R, e as be, f as xe, g as w } from "./__mfe_internal__addon_pipeline_orchestrator_widgets__loadShare__react__loadShare__.mjs-ZXZUECVq.mjs";
-import { _ as ye } from "./__mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_camstack_mf_1_types__loadShare__.mjs-CP1zJ0aB.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 _e = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), ve = (e) => e.replace(
-  /^([A-Z])|[\s-_]+(\w)/g,
-  (o, n, p) => p ? p.toUpperCase() : n.toLowerCase()
-), Q = (e) => {
-  const o = ve(e);
-  return o.charAt(0).toUpperCase() + o.slice(1);
-}, ee = (...e) => e.filter((o, n, p) => !!o && o.trim() !== "" && p.indexOf(o) === n).join(" ").trim(), ke = (e) => {
-  for (const o in e)
-    if (o.startsWith("aria-") || o === "role" || o === "title")
-      return !0;
-};
-/**
- * @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.
- */
-var we = {
-  xmlns: "http://www.w3.org/2000/svg",
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  fill: "none",
-  stroke: "currentColor",
-  strokeWidth: 2,
-  strokeLinecap: "round",
-  strokeLinejoin: "round"
-};
-/**
- * @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 Ne = Y(
-  ({
-    color: e = "currentColor",
-    size: o = 24,
-    strokeWidth: n = 2,
-    absoluteStrokeWidth: p,
-    className: m = "",
-    children: a,
-    iconNode: s,
-    ...r
-  }, f) => K(
-    "svg",
-    {
-      ref: f,
-      ...we,
-      width: o,
-      height: o,
-      stroke: e,
-      strokeWidth: p ? Number(n) * 24 / Number(o) : n,
-      className: ee("lucide", m),
-      ...!a && !ke(r) && { "aria-hidden": "true" },
-      ...r
-    },
-    [
-      ...s.map(([l, k]) => K(l, k)),
-      ...Array.isArray(a) ? a : [a]
-    ]
-  )
-);
-/**
- * @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 v = (e, o) => {
-  const n = Y(
-    ({ className: p, ...m }, a) => K(Ne, {
-      ref: a,
-      iconNode: o,
-      className: ee(
-        `lucide-${_e(Q(e))}`,
-        `lucide-${e}`,
-        p
-      ),
-      ...m
-    })
-  );
-  return n.displayName = Q(e), n;
-};
-/**
- * @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 Ce = [
-  [
-    "path",
-    {
-      d: "M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2",
-      key: "169zse"
-    }
-  ]
-], De = v("activity", Ce);
-/**
- * @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 Se = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]], Ze = v("check", Se);
-/**
- * @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 $e = [
-  ["path", { d: "M12 20v2", key: "1lh1kg" }],
-  ["path", { d: "M12 2v2", key: "tus03m" }],
-  ["path", { d: "M17 20v2", key: "1rnc9c" }],
-  ["path", { d: "M17 2v2", key: "11trls" }],
-  ["path", { d: "M2 12h2", key: "1t8f8n" }],
-  ["path", { d: "M2 17h2", key: "7oei6x" }],
-  ["path", { d: "M2 7h2", key: "asdhe0" }],
-  ["path", { d: "M20 12h2", key: "1q8mjw" }],
-  ["path", { d: "M20 17h2", key: "1fpfkl" }],
-  ["path", { d: "M20 7h2", key: "1o8tra" }],
-  ["path", { d: "M7 20v2", key: "4gnj0m" }],
-  ["path", { d: "M7 2v2", key: "1i4yhu" }],
-  ["rect", { x: "4", y: "4", width: "16", height: "16", rx: "2", key: "1vbyd7" }],
-  ["rect", { x: "8", y: "8", width: "8", height: "8", rx: "1", key: "z9xiuo" }]
-], Ie = v("cpu", $e);
-/**
- * @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 Me = [
-  [
-    "path",
-    {
-      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
-      key: "1nclc0"
-    }
-  ],
-  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], Ae = v("eye", Me);
-/**
- * @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 Fe = [
-  ["path", { d: "m12 14 4-4", key: "9kzdfg" }],
-  ["path", { d: "M3.34 19a10 10 0 1 1 17.32 0", key: "19p75a" }]
-], Te = v("gauge", 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 Re = [
-  [
-    "path",
-    {
-      d: "M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z",
-      key: "yt0hxn"
-    }
-  ]
-], Ee = v("hexagon", Re);
-/**
- * @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 je = [["path", { d: "M5 12h14", key: "1ays0h" }]], Le = v("minus", je);
-/**
- * @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 Pe = [
-  ["path", { d: "M5 12h14", key: "1ays0h" }],
-  ["path", { d: "M12 5v14", key: "s699le" }]
-], Ke = v("plus", 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 Oe = [
-  [
-    "path",
-    {
-      d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z",
-      key: "1c8476"
-    }
-  ],
-  ["path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7", key: "1ydtos" }],
-  ["path", { d: "M7 3v4a1 1 0 0 0 1 1h7", key: "t51u73" }]
-], qe = v("save", Oe);
-/**
- * @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 Ue = [
-  ["path", { d: "M3 6h18", key: "d0wm0j" }],
-  ["path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6", key: "4alrt4" }],
-  ["path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2", key: "v07s0e" }],
-  ["line", { x1: "10", x2: "10", y1: "11", y2: "17", key: "1uufr5" }],
-  ["line", { x1: "14", x2: "14", y1: "11", y2: "17", key: "xtxkd" }]
-], H = v("trash-2", Ue);
-/**
- * @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 ze = [
-  [
-    "path",
-    {
-      d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z",
-      key: "uqj9uw"
-    }
-  ],
-  ["path", { d: "M16 9a5 5 0 0 1 0 6", key: "1q6k2b" }],
-  ["path", { d: "M19.364 18.364a9 9 0 0 0 0-12.728", key: "ijwkga" }]
-], He = v("volume-2", ze);
-/**
- * @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 Be = [
-  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
-  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
-], te = v("x", Be);
-function Ve(e) {
-  return e.deviceId === void 0 ? /* @__PURE__ */ t("div", { className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning", children: "PipelineQuickStats requires a deviceId" }) : /* @__PURE__ */ t(Qe, { deviceId: e.deviceId });
+import { t as e } from "./_virtual_mf___mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.js-BiLBDmU5.mjs";
+import { a as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./_virtual_mf___mfe_internal__addon_pipeline_orchestrator_widgets__loadShare__react__loadShare__.js-CBokMOYQ.mjs";
+import { C as c, S as l, _ as u, a as d, b as f, c as p, d as m, f as h, g, h as _, i as v, l as y, m as b, n as x, o as S, p as C, r as w, s as T, t as E, u as D, v as O, w as k, x as A, y as j } from "./_virtual_mf___mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_camstack_mf_1_ui_mf_2_library__loadShare__.js-CnELcfi3.mjs";
+import { n as M, r as N, t as P } from "./_virtual_mf___mfe_internal__addon_pipeline_orchestrator_widgets__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.js-yD-rMaFX.mjs";
+import { t as F } from "./_virtual_mf___mfe_internal__addon_pipeline_orchestrator_widgets__loadShare___mf_0_camstack_mf_1_types__loadShare__.js-DTMQMZQR.mjs";
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils.js
+var I = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), ee = (e) => e.replace(/^([A-Z])|[\s-_]+(\w)/g, (e, t, n) => n ? n.toUpperCase() : t.toLowerCase()), L = (e) => {
+	let t = ee(e);
+	return t.charAt(0).toUpperCase() + t.slice(1);
+}, R = (...e) => e.filter((e, t, n) => !!e && e.trim() !== "" && n.indexOf(e) === t).join(" ").trim(), z = (e) => {
+	for (let t in e) if (t.startsWith("aria-") || t === "role" || t === "title") return !0;
+}, te = {
+	xmlns: "http://www.w3.org/2000/svg",
+	width: 24,
+	height: 24,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: 2,
+	strokeLinecap: "round",
+	strokeLinejoin: "round"
+}, ne = r(({ color: e = "currentColor", size: t = 24, strokeWidth: n = 2, absoluteStrokeWidth: r, className: i = "", children: a, iconNode: o, ...c }, l) => s("svg", {
+	ref: l,
+	...te,
+	width: t,
+	height: t,
+	stroke: e,
+	strokeWidth: r ? Number(n) * 24 / Number(t) : n,
+	className: R("lucide", i),
+	...!a && !z(c) && { "aria-hidden": "true" },
+	...c
+}, [...o.map(([e, t]) => s(e, t)), ...Array.isArray(a) ? a : [a]])), B = (e, t) => {
+	let n = r(({ className: n, ...r }, i) => s(ne, {
+		ref: i,
+		iconNode: t,
+		className: R(`lucide-${I(L(e))}`, `lucide-${e}`, n),
+		...r
+	}));
+	return n.displayName = L(e), n;
+}, re = B("activity", [["path", {
+	d: "M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2",
+	key: "169zse"
+}]]), ie = B("check", [["path", {
+	d: "M20 6 9 17l-5-5",
+	key: "1gmf2c"
+}]]), ae = B("cpu", [
+	["path", {
+		d: "M12 20v2",
+		key: "1lh1kg"
+	}],
+	["path", {
+		d: "M12 2v2",
+		key: "tus03m"
+	}],
+	["path", {
+		d: "M17 20v2",
+		key: "1rnc9c"
+	}],
+	["path", {
+		d: "M17 2v2",
+		key: "11trls"
+	}],
+	["path", {
+		d: "M2 12h2",
+		key: "1t8f8n"
+	}],
+	["path", {
+		d: "M2 17h2",
+		key: "7oei6x"
+	}],
+	["path", {
+		d: "M2 7h2",
+		key: "asdhe0"
+	}],
+	["path", {
+		d: "M20 12h2",
+		key: "1q8mjw"
+	}],
+	["path", {
+		d: "M20 17h2",
+		key: "1fpfkl"
+	}],
+	["path", {
+		d: "M20 7h2",
+		key: "1o8tra"
+	}],
+	["path", {
+		d: "M7 20v2",
+		key: "4gnj0m"
+	}],
+	["path", {
+		d: "M7 2v2",
+		key: "1i4yhu"
+	}],
+	["rect", {
+		x: "4",
+		y: "4",
+		width: "16",
+		height: "16",
+		rx: "2",
+		key: "1vbyd7"
+	}],
+	["rect", {
+		x: "8",
+		y: "8",
+		width: "8",
+		height: "8",
+		rx: "1",
+		key: "z9xiuo"
+	}]
+]), oe = B("eye", [["path", {
+	d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
+	key: "1nclc0"
+}], ["circle", {
+	cx: "12",
+	cy: "12",
+	r: "3",
+	key: "1v7zrd"
+}]]), V = B("gauge", [["path", {
+	d: "m12 14 4-4",
+	key: "9kzdfg"
+}], ["path", {
+	d: "M3.34 19a10 10 0 1 1 17.32 0",
+	key: "19p75a"
+}]]), H = B("hexagon", [["path", {
+	d: "M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z",
+	key: "yt0hxn"
+}]]), U = B("minus", [["path", {
+	d: "M5 12h14",
+	key: "1ays0h"
+}]]), W = B("plus", [["path", {
+	d: "M5 12h14",
+	key: "1ays0h"
+}], ["path", {
+	d: "M12 5v14",
+	key: "s699le"
+}]]), G = B("save", [
+	["path", {
+		d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z",
+		key: "1c8476"
+	}],
+	["path", {
+		d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7",
+		key: "1ydtos"
+	}],
+	["path", {
+		d: "M7 3v4a1 1 0 0 0 1 1h7",
+		key: "t51u73"
+	}]
+]), K = B("trash-2", [
+	["path", {
+		d: "M3 6h18",
+		key: "d0wm0j"
+	}],
+	["path", {
+		d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6",
+		key: "4alrt4"
+	}],
+	["path", {
+		d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",
+		key: "v07s0e"
+	}],
+	["line", {
+		x1: "10",
+		x2: "10",
+		y1: "11",
+		y2: "17",
+		key: "1uufr5"
+	}],
+	["line", {
+		x1: "14",
+		x2: "14",
+		y1: "11",
+		y2: "17",
+		key: "xtxkd"
+	}]
+]), q = B("video", [["path", {
+	d: "m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5",
+	key: "ftymec"
+}], ["rect", {
+	x: "2",
+	y: "6",
+	width: "14",
+	height: "12",
+	rx: "2",
+	key: "158x01"
+}]]), se = B("volume-2", [
+	["path", {
+		d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z",
+		key: "uqj9uw"
+	}],
+	["path", {
+		d: "M16 9a5 5 0 0 1 0 6",
+		key: "1q6k2b"
+	}],
+	["path", {
+		d: "M19.364 18.364a9 9 0 0 0 0-12.728",
+		key: "ijwkga"
+	}]
+]), J = B("x", [["path", {
+	d: "M18 6 6 18",
+	key: "1bl5f8"
+}], ["path", {
+	d: "m6 6 12 12",
+	key: "d8bk6v"
+}]]);
+//#endregion
+//#region src/widgets/PipelineQuickStats.tsx
+function ce(e) {
+	return e.deviceId === void 0 ? /* @__PURE__ */ M("div", {
+		className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning",
+		children: "PipelineQuickStats requires a deviceId"
+	}) : /* @__PURE__ */ M(le, { deviceId: e.deviceId });
 }
-function Qe({ deviceId: e }) {
-  V(
-    ["pipelineOrchestrator", "getPipelineAssignment"],
-    ["pipeline.camera-assigned", "pipeline.camera-unassigned", "pipeline.camera-updated"]
-  ), V(
-    ["pipelineRunner", "getCameraMetrics"],
-    ["pipeline.camera-metrics-snapshot"]
-  );
-  const { data: o } = re(
-    { deviceId: e },
-    { staleTime: 3e4 }
-  ), n = o?.agentNodeId ?? null, m = typeof n == "string" && n.length > 0 && !n.startsWith("addon:") ? n : void 0, { data: a } = oe(
-    {
-      deviceId: e,
-      ...m ? { nodeId: m } : {}
-    },
-    { staleTime: 2e3, retry: !1 }
-  ), s = O(), r = q(s.trpcClient, e), { data: f } = B({
-    queryKey: ["device", e, "pipelineAnalytics.getActiveTracks"],
-    queryFn: () => r?.pipelineAnalytics?.getActiveTracks({}) ?? [],
-    enabled: !!r,
-    refetchInterval: 5e3,
-    retry: !1
-  }), { data: l } = B({
-    queryKey: ["device", e, "audioMetrics.getCurrentSnapshot"],
-    queryFn: () => r?.audioMetrics?.getCurrentSnapshot({}) ?? null,
-    enabled: !!r,
-    refetchInterval: 2e3,
-    retry: !1
-  }), k = a?.phase ?? null, D = a?.detectionMode ?? null, N = Number(a?.actualFps ?? 0), C = Number(a?.configuredFps ?? 0), S = Number(a?.avgInferenceTimeMs ?? 0), c = Number(a?.queueDepth ?? 0), g = Number(a?.droppedFrames ?? 0), _ = ae(k ?? "watching"), u = f?.length ?? 0, h = l?.level.dbfs ?? null, $ = typeof h == "number" ? `${h.toFixed(1)} dBFS` : "—";
-  return /* @__PURE__ */ i("div", { className: "grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3", children: [
-    /* @__PURE__ */ t(
-      M,
-      {
-        icon: De,
-        label: "Phase",
-        value: _.label,
-        color: _.textColor,
-        subtext: D ?? void 0
-      }
-    ),
-    /* @__PURE__ */ t(
-      M,
-      {
-        icon: Te,
-        label: "Detection FPS",
-        value: `${N.toFixed(1)}`,
-        subtext: C > 0 ? `target: ${C}` : void 0
-      }
-    ),
-    /* @__PURE__ */ t(
-      M,
-      {
-        icon: Ie,
-        label: "Inference",
-        value: `${S.toFixed(1)} ms`,
-        subtext: c > 0 ? `queue: ${c}` : void 0
-      }
-    ),
-    /* @__PURE__ */ t(
-      M,
-      {
-        icon: Ae,
-        label: "Active Tracks",
-        value: String(u),
-        subtext: g > 0 ? `dropped: ${g}` : void 0
-      }
-    ),
-    /* @__PURE__ */ t(
-      M,
-      {
-        icon: He,
-        label: "Current dB",
-        value: $
-      }
-    )
-  ] });
+function le({ deviceId: t }) {
+	f(["pipelineOrchestrator", "getPipelineAssignment"], [
+		"pipeline.camera-assigned",
+		"pipeline.camera-unassigned",
+		"pipeline.camera-updated"
+	]), f(["pipelineRunner", "getCameraMetrics"], ["pipeline.camera-metrics-snapshot"]);
+	let { data: n } = A({ deviceId: t }, { staleTime: 3e4 }), r = n?.agentNodeId ?? null, i = typeof r == "string" && r.length > 0 && !r.startsWith("addon:") ? r : void 0, { data: a } = l({
+		deviceId: t,
+		...i ? { nodeId: i } : {}
+	}, {
+		staleTime: 2e3,
+		retry: !1
+	}), o = k(), s = O(o.trpcClient, t), { data: c } = e({
+		queryKey: [
+			"device",
+			t,
+			"pipelineAnalytics.getActiveTracks"
+		],
+		queryFn: () => s?.pipelineAnalytics?.getActiveTracks({}) ?? [],
+		enabled: !!s,
+		refetchInterval: 5e3,
+		retry: !1
+	}), { data: d } = e({
+		queryKey: [
+			"device",
+			t,
+			"audioMetrics.getCurrentSnapshot"
+		],
+		queryFn: () => s?.audioMetrics?.getCurrentSnapshot({}) ?? null,
+		enabled: !!s,
+		refetchInterval: 2e3,
+		retry: !1
+	}), { data: p } = e({
+		queryKey: ["recording.getStatus", t],
+		queryFn: async () => await o.trpcClient.recording.getStatus.query({ deviceId: t }),
+		refetchInterval: 5e3,
+		retry: !1
+	}), { data: m } = e({
+		queryKey: ["recording.getDeviceConfig", t],
+		queryFn: async () => await o.trpcClient.recording.getDeviceConfig.query({ deviceId: t }),
+		staleTime: 3e4,
+		retry: !1
+	}), h = a?.phase ?? null, g = a?.detectionMode ?? null, _ = Number(a?.actualFps ?? 0), v = Number(a?.configuredFps ?? 0), y = Number(a?.avgInferenceTimeMs ?? 0), b = Number(a?.queueDepth ?? 0), x = Number(a?.droppedFrames ?? 0), S = u(h ?? "watching"), C = c?.length ?? 0, w = d?.level.dbfs ?? null, T = typeof w == "number" ? `${w.toFixed(1)} dBFS` : "—", E = p?.enabled ?? !1, D = p?.activeMode ?? "off", j = E && D !== "off", P = E ? D === "off" ? "Idle" : D === "continuous" ? "Continuous" : D === "onMotion" ? "On motion" : D === "onAudioThreshold" ? "On audio" : D : "Disabled", F = (m?.profiles ?? []).join(", "), I = p ? `${ue(p.storageBytes ?? 0)}${F ? ` · ${F}` : ""}` : void 0;
+	return /* @__PURE__ */ N("div", {
+		className: "grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3",
+		children: [
+			/* @__PURE__ */ M(Y, {
+				icon: re,
+				label: "Phase",
+				value: S.label,
+				color: S.textColor,
+				subtext: g ?? void 0
+			}),
+			/* @__PURE__ */ M(Y, {
+				icon: V,
+				label: "Detection FPS",
+				value: `${_.toFixed(1)}`,
+				subtext: v > 0 ? `target: ${v}` : void 0
+			}),
+			/* @__PURE__ */ M(Y, {
+				icon: ae,
+				label: "Inference",
+				value: `${y.toFixed(1)} ms`,
+				subtext: b > 0 ? `queue: ${b}` : void 0
+			}),
+			/* @__PURE__ */ M(Y, {
+				icon: oe,
+				label: "Active Tracks",
+				value: String(C),
+				subtext: x > 0 ? `dropped: ${x}` : void 0
+			}),
+			/* @__PURE__ */ M(Y, {
+				icon: se,
+				label: "Current dB",
+				value: T
+			}),
+			/* @__PURE__ */ M(Y, {
+				icon: q,
+				label: "Recording",
+				value: P,
+				color: j ? "text-success" : void 0,
+				subtext: I
+			})
+		]
+	});
 }
-function M({ icon: e, label: o, value: n, subtext: p, color: m }) {
-  return /* @__PURE__ */ i("div", { className: "rounded-lg border border-border bg-surface p-3 min-w-0", children: [
-    /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 mb-1 min-w-0", children: [
-      /* @__PURE__ */ t(e, { className: "h-3.5 w-3.5 text-foreground-subtle flex-shrink-0" }),
-      /* @__PURE__ */ t(
-        "span",
-        {
-          className: "text-[10px] text-foreground-subtle uppercase tracking-wider truncate",
-          title: o,
-          children: o
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t(
-      "p",
-      {
-        className: `text-lg font-semibold leading-tight truncate ${m ?? "text-foreground"}`,
-        title: n,
-        children: n
-      }
-    ),
-    p && /* @__PURE__ */ t("p", { className: "text-[10px] text-foreground-subtle mt-0.5 truncate", title: p, children: p })
-  ] });
+function ue(e) {
+	if (!Number.isFinite(e) || e <= 0) return "0 B";
+	let t = [
+		"B",
+		"KB",
+		"MB",
+		"GB",
+		"TB"
+	], n = Math.min(t.length - 1, Math.floor(Math.log(e) / Math.log(1024))), r = e / 1024 ** n;
+	return `${n === 0 ? Math.round(r) : r.toFixed(1)} ${t[n]}`;
 }
-const We = {
-  polygon: "Polygon",
-  tripwire: "Tripwire"
-}, Ge = {
-  polygon: "bg-info/10 text-info",
-  tripwire: "bg-warning/10 text-warning"
+function Y({ icon: e, label: t, value: n, subtext: r, color: i }) {
+	return /* @__PURE__ */ N("div", {
+		className: "rounded-lg border border-border bg-surface p-3 min-w-0",
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: "flex items-center gap-1.5 mb-1 min-w-0",
+				children: [/* @__PURE__ */ M(e, { className: "h-3.5 w-3.5 text-foreground-subtle flex-shrink-0" }), /* @__PURE__ */ M("span", {
+					className: "text-[10px] text-foreground-subtle uppercase tracking-wider truncate",
+					title: t,
+					children: t
+				})]
+			}),
+			/* @__PURE__ */ M("p", {
+				className: `text-lg font-semibold leading-tight truncate ${i ?? "text-foreground"}`,
+				title: n,
+				children: n
+			}),
+			r && /* @__PURE__ */ M("p", {
+				className: "text-[10px] text-foreground-subtle mt-0.5 truncate",
+				title: r,
+				children: r
+			})
+		]
+	});
+}
+//#endregion
+//#region src/widgets/zone-editor/ZoneList.tsx
+var de = {
+	polygon: "Polygon",
+	tripwire: "Tripwire"
+}, fe = {
+	polygon: "bg-info/10 text-info",
+	tripwire: "bg-warning/10 text-warning"
 };
-function Xe({
-  zones: e,
-  selectedZoneId: o,
-  drawingKind: n,
-  onSelectZone: p,
-  onDeleteZone: m,
-  onStartDraw: a,
-  onCancelDraw: s
-}) {
-  return /* @__PURE__ */ i("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: n ? /* @__PURE__ */ i(
-      "button",
-      {
-        type: "button",
-        onClick: s,
-        className: "inline-flex items-center justify-center gap-1 rounded border border-amber-500/30 bg-amber-500/10 text-amber-400 hover:bg-amber-500/20 transition-colors h-8 px-3 text-[11px] font-medium",
-        title: "Cancel drawing",
-        children: [
-          /* @__PURE__ */ t(te, { className: "h-3.5 w-3.5" }),
-          /* @__PURE__ */ t("span", { children: "Cancel" })
-        ]
-      }
-    ) : /* @__PURE__ */ i(X, { children: [
-      /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          onClick: () => a("polygon"),
-          className: "inline-flex items-center justify-center rounded border border-border bg-surface text-foreground-subtle hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-colors h-8 w-8",
-          title: "Add polygon zone",
-          "aria-label": "Add polygon zone",
-          children: /* @__PURE__ */ t(Ee, { className: "h-4 w-4" })
-        }
-      ),
-      /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          onClick: () => a("tripwire"),
-          className: "inline-flex items-center justify-center rounded border border-border bg-surface text-foreground-subtle hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-colors h-8 w-8",
-          title: "Add tripwire",
-          "aria-label": "Add tripwire",
-          children: /* @__PURE__ */ t(Le, { className: "h-5 w-5 stroke-[2.5]" })
-        }
-      )
-    ] }) }),
-    e.length === 0 ? /* @__PURE__ */ t("p", { className: "text-center text-[10px] text-foreground-subtle py-3 leading-tight", children: 'No zones yet — pick "Zone" or "Tripwire" to draw.' }) : /* @__PURE__ */ t("div", { className: "flex flex-col gap-1", children: e.map((r) => {
-      const f = r.id === o;
-      return /* @__PURE__ */ i(
-        "div",
-        {
-          className: [
-            "flex items-center gap-1.5 rounded border px-1.5 py-1 cursor-pointer transition-colors",
-            f ? "border-primary/50 bg-primary/10" : "border-border bg-surface hover:bg-surface-hover"
-          ].join(" "),
-          onClick: () => p(f ? null : r.id),
-          children: [
-            /* @__PURE__ */ t(
-              "div",
-              {
-                className: "h-2.5 w-2.5 rounded-sm flex-shrink-0",
-                style: { backgroundColor: r.color }
-              }
-            ),
-            /* @__PURE__ */ t("span", { className: "flex-1 truncate text-[11px] font-medium text-foreground", children: r.name }),
-            /* @__PURE__ */ t(
-              "span",
-              {
-                className: `inline-flex items-center rounded-full px-1.5 py-0.5 text-[9px] font-medium flex-shrink-0 ${Ge[r.kind]}`,
-                children: We[r.kind]
-              }
-            ),
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                title: "Delete zone",
-                className: "p-0.5 text-foreground-subtle hover:text-danger rounded transition-colors flex-shrink-0",
-                onClick: (l) => {
-                  l.stopPropagation(), m(r.id);
-                },
-                children: /* @__PURE__ */ t(H, { className: "h-3 w-3" })
-              }
-            )
-          ]
-        },
-        r.id
-      );
-    }) })
-  ] });
+function pe({ zones: e, selectedZoneId: t, drawingKind: n, onSelectZone: r, onDeleteZone: i, onStartDraw: a, onCancelDraw: o }) {
+	return /* @__PURE__ */ N("div", {
+		className: "flex flex-col gap-2",
+		children: [/* @__PURE__ */ M("div", {
+			className: "flex items-center gap-1",
+			children: n ? /* @__PURE__ */ N("button", {
+				type: "button",
+				onClick: o,
+				className: "inline-flex items-center justify-center gap-1 rounded border border-amber-500/30 bg-amber-500/10 text-amber-400 hover:bg-amber-500/20 transition-colors h-8 px-3 text-[11px] font-medium",
+				title: "Cancel drawing",
+				children: [/* @__PURE__ */ M(J, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ M("span", { children: "Cancel" })]
+			}) : /* @__PURE__ */ N(P, { children: [/* @__PURE__ */ M("button", {
+				type: "button",
+				onClick: () => a("polygon"),
+				className: "inline-flex items-center justify-center rounded border border-border bg-surface text-foreground-subtle hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-colors h-8 w-8",
+				title: "Add polygon zone",
+				"aria-label": "Add polygon zone",
+				children: /* @__PURE__ */ M(H, { className: "h-4 w-4" })
+			}), /* @__PURE__ */ M("button", {
+				type: "button",
+				onClick: () => a("tripwire"),
+				className: "inline-flex items-center justify-center rounded border border-border bg-surface text-foreground-subtle hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-colors h-8 w-8",
+				title: "Add tripwire",
+				"aria-label": "Add tripwire",
+				children: /* @__PURE__ */ M(U, { className: "h-5 w-5 stroke-[2.5]" })
+			})] })
+		}), e.length === 0 ? /* @__PURE__ */ M("p", {
+			className: "text-center text-[10px] text-foreground-subtle py-3 leading-tight",
+			children: "No zones yet — pick \"Zone\" or \"Tripwire\" to draw."
+		}) : /* @__PURE__ */ M("div", {
+			className: "flex flex-col gap-1",
+			children: e.map((e) => {
+				let n = e.id === t;
+				return /* @__PURE__ */ N("div", {
+					className: ["flex items-center gap-1.5 rounded border px-1.5 py-1 cursor-pointer transition-colors", n ? "border-primary/50 bg-primary/10" : "border-border bg-surface hover:bg-surface-hover"].join(" "),
+					onClick: () => r(n ? null : e.id),
+					children: [
+						/* @__PURE__ */ M("div", {
+							className: "h-2.5 w-2.5 rounded-sm flex-shrink-0",
+							style: { backgroundColor: e.color }
+						}),
+						/* @__PURE__ */ M("span", {
+							className: "flex-1 truncate text-[11px] font-medium text-foreground",
+							children: e.name
+						}),
+						/* @__PURE__ */ M("span", {
+							className: `inline-flex items-center rounded-full px-1.5 py-0.5 text-[9px] font-medium flex-shrink-0 ${fe[e.kind]}`,
+							children: de[e.kind]
+						}),
+						/* @__PURE__ */ M("button", {
+							type: "button",
+							title: "Delete zone",
+							className: "p-0.5 text-foreground-subtle hover:text-danger rounded transition-colors flex-shrink-0",
+							onClick: (t) => {
+								t.stopPropagation(), i(e.id);
+							},
+							children: /* @__PURE__ */ M(K, { className: "h-3 w-3" })
+						})
+					]
+				}, e.id);
+			})
+		})]
+	});
 }
-const Je = [
-  "#3b82f6",
-  // blue
-  "#10b981",
-  // green
-  "#f59e0b",
-  // amber
-  "#ef4444",
-  // red
-  "#8b5cf6",
-  // purple
-  "#06b6d4",
-  // cyan
-  "#f97316",
-  // orange
-  "#ec4899"
-  // pink
+//#endregion
+//#region src/widgets/zone-editor/ZoneForm.tsx
+var me = [
+	"#3b82f6",
+	"#10b981",
+	"#f59e0b",
+	"#ef4444",
+	"#8b5cf6",
+	"#06b6d4",
+	"#f97316",
+	"#ec4899"
 ];
-function Ye({ zone: e, onSave: o, onDiscard: n, onDelete: p }) {
-  const m = U(), a = (r) => m?.updateDraft({ name: r }), s = (r) => m?.updateDraft({ color: r });
-  return /* @__PURE__ */ i("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ i("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ t("h3", { className: "text-[10px] font-semibold text-foreground-subtle uppercase tracking-wider", children: "Editing" }),
-      /* @__PURE__ */ t("span", { className: "inline-flex items-center rounded-full px-1.5 py-0.5 text-[9px] font-medium bg-surface border border-border text-foreground-subtle", children: e.kind === "tripwire" ? "Tripwire" : "Polygon" })
-    ] }),
-    /* @__PURE__ */ t(
-      "input",
-      {
-        type: "text",
-        className: P,
-        value: e.name,
-        autoFocus: !0,
-        onChange: (r) => a(r.target.value),
-        onKeyDown: (r) => {
-          r.key === "Enter" ? (r.preventDefault(), o()) : r.key === "Escape" && (r.preventDefault(), n());
-        },
-        placeholder: "Zone name"
-      }
-    ),
-    /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-1", children: Je.map((r) => /* @__PURE__ */ t(
-      "button",
-      {
-        type: "button",
-        title: r,
-        className: [
-          "h-4 w-4 rounded border-2 cursor-pointer transition-transform hover:scale-110",
-          e.color === r ? "border-white scale-110" : "border-transparent"
-        ].join(" "),
-        style: { backgroundColor: r },
-        onClick: () => s(r)
-      },
-      r
-    )) }),
-    /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ t(
-        "input",
-        {
-          type: "color",
-          className: "h-6 w-6 rounded border border-border bg-background cursor-pointer p-0.5",
-          value: e.color,
-          onChange: (r) => s(r.target.value)
-        }
-      ),
-      /* @__PURE__ */ t(
-        "input",
-        {
-          type: "text",
-          className: `${P} font-mono`,
-          value: e.color,
-          placeholder: "#000000",
-          onChange: (r) => s(r.target.value)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ i("p", { className: "text-[9px] text-foreground-subtle leading-tight", children: [
-      e.kind === "tripwire" ? "2 points" : `${e.points.length} pts`,
-      e.points.length > 0 && " · drag handles to reshape"
-    ] }),
-    /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ i(
-        "button",
-        {
-          type: "button",
-          onClick: o,
-          className: "inline-flex items-center justify-center gap-1 rounded border border-primary/40 bg-primary/10 text-primary hover:bg-primary/20 transition-colors h-7 flex-1 text-[11px] font-medium",
-          title: "Save changes (Enter)",
-          children: [
-            /* @__PURE__ */ t(Ze, { className: "h-3 w-3" }),
-            "Save"
-          ]
-        }
-      ),
-      /* @__PURE__ */ i(
-        "button",
-        {
-          type: "button",
-          onClick: n,
-          className: "inline-flex items-center justify-center gap-1 rounded border border-border bg-surface text-foreground-subtle hover:text-foreground hover:bg-surface-hover transition-colors h-7 px-3 text-[11px] font-medium",
-          title: "Discard changes (Esc)",
-          children: [
-            /* @__PURE__ */ t(te, { className: "h-3 w-3" }),
-            "Discard"
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ i(
-      "button",
-      {
-        type: "button",
-        onClick: p,
-        className: `${se} w-full`,
-        children: [
-          /* @__PURE__ */ t(H, { className: "h-3 w-3" }),
-          "Delete"
-        ]
-      }
-    )
-  ] });
+function he({ zone: e, onSave: t, onDiscard: n, onDelete: r }) {
+	let i = w(), a = (e) => i?.updateDraft({ name: e }), o = (e) => i?.updateDraft({ color: e });
+	return /* @__PURE__ */ N("div", {
+		className: "flex flex-col gap-2",
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ M("h3", {
+					className: "text-[10px] font-semibold text-foreground-subtle uppercase tracking-wider",
+					children: "Editing"
+				}), /* @__PURE__ */ M("span", {
+					className: "inline-flex items-center rounded-full px-1.5 py-0.5 text-[9px] font-medium bg-surface border border-border text-foreground-subtle",
+					children: e.kind === "tripwire" ? "Tripwire" : "Polygon"
+				})]
+			}),
+			/* @__PURE__ */ M("input", {
+				type: "text",
+				className: d,
+				value: e.name,
+				autoFocus: !0,
+				onChange: (e) => a(e.target.value),
+				onKeyDown: (e) => {
+					e.key === "Enter" ? (e.preventDefault(), t()) : e.key === "Escape" && (e.preventDefault(), n());
+				},
+				placeholder: "Zone name"
+			}),
+			/* @__PURE__ */ M("div", {
+				className: "flex flex-wrap gap-1",
+				children: me.map((t) => /* @__PURE__ */ M("button", {
+					type: "button",
+					title: t,
+					className: ["h-4 w-4 rounded border-2 cursor-pointer transition-transform hover:scale-110", e.color === t ? "border-white scale-110" : "border-transparent"].join(" "),
+					style: { backgroundColor: t },
+					onClick: () => o(t)
+				}, t))
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "flex items-center gap-1.5",
+				children: [/* @__PURE__ */ M("input", {
+					type: "color",
+					className: "h-6 w-6 rounded border border-border bg-background cursor-pointer p-0.5",
+					value: e.color,
+					onChange: (e) => o(e.target.value)
+				}), /* @__PURE__ */ M("input", {
+					type: "text",
+					className: `${d} font-mono`,
+					value: e.color,
+					placeholder: "#000000",
+					onChange: (e) => o(e.target.value)
+				})]
+			}),
+			/* @__PURE__ */ N("p", {
+				className: "text-[9px] text-foreground-subtle leading-tight",
+				children: [e.kind === "tripwire" ? "2 points" : `${e.points.length} pts`, e.points.length > 0 && " · drag handles to reshape"]
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "flex items-center gap-1.5",
+				children: [/* @__PURE__ */ N("button", {
+					type: "button",
+					onClick: t,
+					className: "inline-flex items-center justify-center gap-1 rounded border border-primary/40 bg-primary/10 text-primary hover:bg-primary/20 transition-colors h-7 flex-1 text-[11px] font-medium",
+					title: "Save changes (Enter)",
+					children: [/* @__PURE__ */ M(ie, { className: "h-3 w-3" }), "Save"]
+				}), /* @__PURE__ */ N("button", {
+					type: "button",
+					onClick: n,
+					className: "inline-flex items-center justify-center gap-1 rounded border border-border bg-surface text-foreground-subtle hover:text-foreground hover:bg-surface-hover transition-colors h-7 px-3 text-[11px] font-medium",
+					title: "Discard changes (Esc)",
+					children: [/* @__PURE__ */ M(J, { className: "h-3 w-3" }), "Discard"]
+				})]
+			}),
+			/* @__PURE__ */ N("button", {
+				type: "button",
+				onClick: r,
+				className: `${v} w-full`,
+				children: [/* @__PURE__ */ M(K, { className: "h-3 w-3" }), "Delete"]
+			})
+		]
+	});
 }
-const et = ye.map(
-  (e) => ({ id: e.id, label: e.name })
-);
-function tt(e) {
-  return {
-    id: e.id,
-    name: e.name ?? "",
-    zoneIds: e.zoneIds,
-    mode: e.mode,
-    classFilter: e.classFilter ?? [],
-    enabled: e.enabled !== !1
-  };
+//#endregion
+//#region src/widgets/zone-editor/ZoneRulesEditor.tsx
+var ge = F.map((e) => ({
+	id: e.id,
+	label: e.name
+}));
+function _e(e) {
+	return {
+		id: e.id,
+		name: e.name ?? "",
+		zoneIds: e.zoneIds,
+		mode: e.mode,
+		classFilter: e.classFilter ?? [],
+		enabled: e.enabled !== !1
+	};
 }
-function nt(e) {
-  const o = {
-    id: e.id,
-    zoneIds: e.zoneIds,
-    mode: e.mode,
-    enabled: e.enabled
-  };
-  return e.name && (o.name = e.name), e.classFilter.length > 0 && (o.classFilter = e.classFilter), o;
+function ve(e) {
+	let t = {
+		id: e.id,
+		zoneIds: e.zoneIds,
+		mode: e.mode,
+		enabled: e.enabled
+	};
+	return e.name && (t.name = e.name), e.classFilter.length > 0 && (t.classFilter = e.classFilter), t;
 }
-function W({ dev: e, stage: o, zones: n, title: p }) {
-  const m = z(e?.state.zoneRules), a = Z(
-    () => m?.[o] ?? [],
-    [m, o]
-  ), [s, r] = R([]), [f, l] = R(!1), [k, D] = R(!1), [N, C] = R(null);
-  be(() => {
-    f || r(a.map(tt));
-  }, [a, f]);
-  const S = () => {
-    r((d) => [
-      ...d,
-      {
-        id: crypto.randomUUID(),
-        name: "",
-        zoneIds: n[0] ? [n[0].id] : [],
-        mode: "exclude",
-        classFilter: [],
-        enabled: !0
-      }
-    ]), l(!0);
-  }, c = (d, y) => {
-    r(
-      (b) => b.map((x, I) => {
-        if (I !== d) return x;
-        const E = x.classFilter.includes(y) ? x.classFilter.filter((j) => j !== y) : [...x.classFilter, y];
-        return { ...x, classFilter: E };
-      })
-    ), l(!0);
-  }, g = (d, y) => {
-    r(
-      (b) => b.map((x, I) => {
-        if (I !== d) return x;
-        const E = x.zoneIds.includes(y) ? x.zoneIds.filter((j) => j !== y) : [...x.zoneIds, y];
-        return { ...x, zoneIds: E };
-      })
-    ), l(!0);
-  }, _ = (d) => {
-    r((y) => y.filter((b, x) => x !== d)), l(!0);
-  }, u = (d, y) => {
-    r((b) => b.map((x, I) => I === d ? { ...x, ...y } : x)), l(!0);
-  }, h = async () => {
-    if (e?.zoneRules) {
-      D(!0), C(null);
-      try {
-        await e.zoneRules.setRules({ stage: o, rules: s.map(nt) }), l(!1);
-      } catch (d) {
-        C(d instanceof Error ? d.message : String(d));
-      } finally {
-        D(!1);
-      }
-    }
-  }, $ = f && !!e?.zoneRules && !k;
-  return /* @__PURE__ */ i("div", { className: "rounded-md border border-border bg-surface/40 p-2.5", children: [
-    /* @__PURE__ */ i("div", { className: "flex items-center justify-between mb-2 gap-2", children: [
-      /* @__PURE__ */ t("h3", { className: `${J} truncate`, children: p ?? `${o === "motion" ? "Motion" : "Detection"} Rules` }),
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-1 flex-shrink-0", children: [
-        /* @__PURE__ */ i(
-          "button",
-          {
-            type: "button",
-            onClick: S,
-            disabled: n.length === 0 || !e,
-            className: ie,
-            title: "Add rule",
-            children: [
-              /* @__PURE__ */ t(Ke, { className: "h-2.5 w-2.5" }),
-              " Add"
-            ]
-          }
-        ),
-        /* @__PURE__ */ i(
-          "button",
-          {
-            type: "button",
-            onClick: () => {
-              h();
-            },
-            disabled: !$,
-            className: le,
-            children: [
-              /* @__PURE__ */ t(qe, { className: "h-2.5 w-2.5" }),
-              k ? "…" : "Save"
-            ]
-          }
-        )
-      ] })
-    ] }),
-    s.length === 0 ? /* @__PURE__ */ t("p", { className: "text-[10px] text-foreground-subtle italic px-1 py-1.5 leading-tight", children: n.length === 0 ? "Define a zone first — rules reference zone ids." : "No rules — every detection at this stage passes through." }) : /* @__PURE__ */ t("div", { className: "flex flex-col gap-1.5", children: s.map((d, y) => /* @__PURE__ */ i(
-      "div",
-      {
-        className: "rounded border border-border/50 bg-background/40 px-2 py-1.5 flex flex-col gap-1.5 overflow-hidden",
-        children: [
-          /* @__PURE__ */ i("div", { className: "grid grid-cols-[auto_1fr_auto] items-center gap-1.5", children: [
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                role: "switch",
-                "aria-checked": d.enabled,
-                "aria-label": d.enabled ? "Disable rule" : "Enable rule",
-                title: d.enabled ? "Rule is active — click to disable" : "Rule is disabled — click to enable",
-                onClick: () => u(y, { enabled: !d.enabled }),
-                className: [
-                  "inline-flex items-center justify-center h-5 w-9 rounded-full border transition-colors flex-shrink-0",
-                  d.enabled ? "border-primary/50 bg-primary/20 text-primary" : "border-border bg-surface text-foreground-subtle"
-                ].join(" "),
-                children: /* @__PURE__ */ t(
-                  "span",
-                  {
-                    className: [
-                      "h-3 w-3 rounded-full transition-transform",
-                      d.enabled ? "translate-x-1.5 bg-primary" : "-translate-x-1.5 bg-foreground-subtle"
-                    ].join(" ")
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ t(
-              "input",
-              {
-                className: `${P} min-w-0`,
-                placeholder: "Rule name (optional)",
-                value: d.name,
-                onChange: (b) => u(y, { name: b.target.value })
-              }
-            ),
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                title: "Remove rule",
-                "aria-label": "Remove rule",
-                onClick: () => _(y),
-                className: "flex items-center justify-center h-6 w-6 rounded text-foreground-subtle hover:text-danger hover:bg-danger/10 transition-colors flex-shrink-0",
-                children: /* @__PURE__ */ t(H, { className: "h-3.5 w-3.5" })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
-            /* @__PURE__ */ t("span", { className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0", children: "Mode" }),
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                onClick: () => u(y, { mode: "include" }),
-                className: `${A} ${d.mode === "include" ? F : T}`,
-                children: "Include"
-              }
-            ),
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                onClick: () => u(y, { mode: "exclude" }),
-                className: `${A} ${d.mode === "exclude" ? F : T}`,
-                children: "Exclude"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
-            /* @__PURE__ */ t("span", { className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0", children: "Zones" }),
-            n.length === 0 ? /* @__PURE__ */ t("span", { className: "text-[10px] text-foreground-subtle italic", children: "none" }) : n.map((b) => {
-              const x = d.zoneIds.includes(b.id);
-              return /* @__PURE__ */ i(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => g(y, b.id),
-                  className: `${A} ${x ? F : T}`,
-                  children: [
-                    /* @__PURE__ */ t(
-                      "span",
-                      {
-                        className: "h-2 w-2 rounded-sm",
-                        style: { backgroundColor: b.color || "#3b82f6" }
-                      }
-                    ),
-                    /* @__PURE__ */ t("span", { className: "truncate max-w-[7rem]", children: b.name || b.id })
-                  ]
-                },
-                b.id
-              );
-            })
-          ] }),
-          /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
-            /* @__PURE__ */ t("span", { className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0", children: "Class" }),
-            et.map((b) => {
-              const x = d.classFilter.includes(b.id);
-              return /* @__PURE__ */ t(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => c(y, b.id),
-                  className: `${A} ${x ? F : T}`,
-                  children: b.label
-                },
-                b.id
-              );
-            }),
-            d.classFilter.length === 0 && /* @__PURE__ */ t("span", { className: "text-[10px] text-foreground-subtle italic ml-1", children: "any" })
-          ] })
-        ]
-      },
-      d.id
-    )) }),
-    N && /* @__PURE__ */ t("p", { className: "mt-2 text-[10px] text-danger", children: N })
-  ] });
+function X({ dev: e, stage: n, zones: r, title: a }) {
+	let s = j(e?.state.zoneRules), c = i(() => s?.[n] ?? [], [s, n]), [l, u] = o([]), [f, p] = o(!1), [m, h] = o(!1), [v, y] = o(null);
+	t(() => {
+		f || u(c.map(_e));
+	}, [c, f]);
+	let x = () => {
+		u((e) => [...e, {
+			id: crypto.randomUUID(),
+			name: "",
+			zoneIds: r[0] ? [r[0].id] : [],
+			mode: "exclude",
+			classFilter: [],
+			enabled: !0
+		}]), p(!0);
+	}, w = (e, t) => {
+		u((n) => n.map((n, r) => {
+			if (r !== e) return n;
+			let i = n.classFilter.includes(t) ? n.classFilter.filter((e) => e !== t) : [...n.classFilter, t];
+			return {
+				...n,
+				classFilter: i
+			};
+		})), p(!0);
+	}, T = (e, t) => {
+		u((n) => n.map((n, r) => {
+			if (r !== e) return n;
+			let i = n.zoneIds.includes(t) ? n.zoneIds.filter((e) => e !== t) : [...n.zoneIds, t];
+			return {
+				...n,
+				zoneIds: i
+			};
+		})), p(!0);
+	}, D = (e) => {
+		u((t) => t.filter((t, n) => n !== e)), p(!0);
+	}, O = (e, t) => {
+		u((n) => n.map((n, r) => r === e ? {
+			...n,
+			...t
+		} : n)), p(!0);
+	}, k = async () => {
+		if (e?.zoneRules) {
+			h(!0), y(null);
+			try {
+				await e.zoneRules.setRules({
+					stage: n,
+					rules: l.map(ve)
+				}), p(!1);
+			} catch (e) {
+				y(e instanceof Error ? e.message : String(e));
+			} finally {
+				h(!1);
+			}
+		}
+	}, A = f && !!e?.zoneRules && !m;
+	return /* @__PURE__ */ N("div", {
+		className: "rounded-md border border-border bg-surface/40 p-2.5",
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: "flex items-center justify-between mb-2 gap-2",
+				children: [/* @__PURE__ */ M("h3", {
+					className: `${C} truncate`,
+					children: a ?? `${n === "motion" ? "Motion" : "Detection"} Rules`
+				}), /* @__PURE__ */ N("div", {
+					className: "flex items-center gap-1 flex-shrink-0",
+					children: [/* @__PURE__ */ N("button", {
+						type: "button",
+						onClick: x,
+						disabled: r.length === 0 || !e,
+						className: E,
+						title: "Add rule",
+						children: [/* @__PURE__ */ M(W, { className: "h-2.5 w-2.5" }), " Add"]
+					}), /* @__PURE__ */ N("button", {
+						type: "button",
+						onClick: () => {
+							k();
+						},
+						disabled: !A,
+						className: S,
+						children: [/* @__PURE__ */ M(G, { className: "h-2.5 w-2.5" }), m ? "…" : "Save"]
+					})]
+				})]
+			}),
+			l.length === 0 ? /* @__PURE__ */ M("p", {
+				className: "text-[10px] text-foreground-subtle italic px-1 py-1.5 leading-tight",
+				children: r.length === 0 ? "Define a zone first — rules reference zone ids." : "No rules — every detection at this stage passes through."
+			}) : /* @__PURE__ */ M("div", {
+				className: "flex flex-col gap-1.5",
+				children: l.map((e, t) => /* @__PURE__ */ N("div", {
+					className: "rounded border border-border/50 bg-background/40 px-2 py-1.5 flex flex-col gap-1.5 overflow-hidden",
+					children: [
+						/* @__PURE__ */ N("div", {
+							className: "grid grid-cols-[auto_1fr_auto] items-center gap-1.5",
+							children: [
+								/* @__PURE__ */ M("button", {
+									type: "button",
+									role: "switch",
+									"aria-checked": e.enabled,
+									"aria-label": e.enabled ? "Disable rule" : "Enable rule",
+									title: e.enabled ? "Rule is active — click to disable" : "Rule is disabled — click to enable",
+									onClick: () => O(t, { enabled: !e.enabled }),
+									className: ["inline-flex items-center justify-center h-5 w-9 rounded-full border transition-colors flex-shrink-0", e.enabled ? "border-primary/50 bg-primary/20 text-primary" : "border-border bg-surface text-foreground-subtle"].join(" "),
+									children: /* @__PURE__ */ M("span", { className: ["h-3 w-3 rounded-full transition-transform", e.enabled ? "translate-x-1.5 bg-primary" : "-translate-x-1.5 bg-foreground-subtle"].join(" ") })
+								}),
+								/* @__PURE__ */ M("input", {
+									className: `${d} min-w-0`,
+									placeholder: "Rule name (optional)",
+									value: e.name,
+									onChange: (e) => O(t, { name: e.target.value })
+								}),
+								/* @__PURE__ */ M("button", {
+									type: "button",
+									title: "Remove rule",
+									"aria-label": "Remove rule",
+									onClick: () => D(t),
+									className: "flex items-center justify-center h-6 w-6 rounded text-foreground-subtle hover:text-danger hover:bg-danger/10 transition-colors flex-shrink-0",
+									children: /* @__PURE__ */ M(K, { className: "h-3.5 w-3.5" })
+								})
+							]
+						}),
+						/* @__PURE__ */ N("div", {
+							className: "flex items-center gap-1.5 flex-wrap",
+							children: [
+								/* @__PURE__ */ M("span", {
+									className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0",
+									children: "Mode"
+								}),
+								/* @__PURE__ */ M("button", {
+									type: "button",
+									onClick: () => O(t, { mode: "include" }),
+									className: `${_} ${e.mode === "include" ? b : g}`,
+									children: "Include"
+								}),
+								/* @__PURE__ */ M("button", {
+									type: "button",
+									onClick: () => O(t, { mode: "exclude" }),
+									className: `${_} ${e.mode === "exclude" ? b : g}`,
+									children: "Exclude"
+								})
+							]
+						}),
+						/* @__PURE__ */ N("div", {
+							className: "flex items-center gap-1.5 flex-wrap",
+							children: [/* @__PURE__ */ M("span", {
+								className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0",
+								children: "Zones"
+							}), r.length === 0 ? /* @__PURE__ */ M("span", {
+								className: "text-[10px] text-foreground-subtle italic",
+								children: "none"
+							}) : r.map((n) => /* @__PURE__ */ N("button", {
+								type: "button",
+								onClick: () => T(t, n.id),
+								className: `${_} ${e.zoneIds.includes(n.id) ? b : g}`,
+								children: [/* @__PURE__ */ M("span", {
+									className: "h-2 w-2 rounded-sm",
+									style: { backgroundColor: n.color || "#3b82f6" }
+								}), /* @__PURE__ */ M("span", {
+									className: "truncate max-w-[7rem]",
+									children: n.name || n.id
+								})]
+							}, n.id))]
+						}),
+						/* @__PURE__ */ N("div", {
+							className: "flex items-center gap-1.5 flex-wrap",
+							children: [
+								/* @__PURE__ */ M("span", {
+									className: "text-[9px] uppercase tracking-wider text-foreground-subtle w-12 sm:w-14 flex-shrink-0",
+									children: "Class"
+								}),
+								ge.map((n) => /* @__PURE__ */ M("button", {
+									type: "button",
+									onClick: () => w(t, n.id),
+									className: `${_} ${e.classFilter.includes(n.id) ? b : g}`,
+									children: n.label
+								}, n.id)),
+								e.classFilter.length === 0 && /* @__PURE__ */ M("span", {
+									className: "text-[10px] text-foreground-subtle italic ml-1",
+									children: "any"
+								})
+							]
+						})
+					]
+				}, e.id))
+			}),
+			v && /* @__PURE__ */ M("p", {
+				className: "mt-2 text-[10px] text-danger",
+				children: v
+			})
+		]
+	});
 }
-function rt(e) {
-  const o = e.kind === "tripwire" ? { kind: "line", points: e.points } : { kind: "polygon", points: e.points };
-  return { id: e.id, label: e.name, color: e.color, shape: o };
+//#endregion
+//#region src/widgets/zone-editor/types.ts
+function ye(e) {
+	let t = e.kind === "tripwire" ? {
+		kind: "line",
+		points: e.points
+	} : {
+		kind: "polygon",
+		points: e.points
+	};
+	return {
+		id: e.id,
+		label: e.name,
+		color: e.color,
+		shape: t
+	};
 }
-function ot(e) {
-  return e === "line" ? "tripwire" : "polygon";
+function be(e) {
+	return e === "line" ? "tripwire" : "polygon";
 }
-function at(e) {
-  return e === "tripwire" ? "line" : "polygon";
+function xe(e) {
+	return e === "tripwire" ? "line" : "polygon";
 }
-const st = "#3b82f6", it = ["polygon", "line"], L = [
-  "#3b82f6",
-  "#10b981",
-  "#f59e0b",
-  "#ec4899",
-  "#a855f7",
-  "#06b6d4",
-  "#f43f5e",
-  "#84cc16",
-  "#8b5cf6",
-  "#14b8a6"
+//#endregion
+//#region src/widgets/zone-editor/ZoneOverlay.tsx
+var Se = "#3b82f6", Z = ["polygon", "line"], Q = [
+	"#3b82f6",
+	"#10b981",
+	"#f59e0b",
+	"#ec4899",
+	"#a855f7",
+	"#06b6d4",
+	"#f43f5e",
+	"#84cc16",
+	"#8b5cf6",
+	"#14b8a6"
 ];
-function lt(e) {
-  const o = new Set(e.map((n) => (n.color ?? "").toLowerCase()));
-  for (const n of L)
-    if (!o.has(n.toLowerCase())) return n;
-  return L[e.length % L.length];
+function Ce(e) {
+	let t = new Set(e.map((e) => (e.color ?? "").toLowerCase()));
+	for (let e of Q) if (!t.has(e.toLowerCase())) return e;
+	return Q[e.length % Q.length];
 }
-function ct(e) {
-  return {
-    id: e.id,
-    name: e.name,
-    kind: e.kind,
-    color: e.color || st,
-    points: [...e.polygon]
-  };
+function we(e) {
+	return {
+		id: e.id,
+		name: e.name,
+		kind: e.kind,
+		color: e.color || Se,
+		points: [...e.polygon]
+	};
 }
-function G(e) {
-  return {
-    id: e.id,
-    name: e.name,
-    kind: e.kind,
-    polygon: e.points,
-    color: e.color
-  };
+function $(e) {
+	return {
+		id: e.id,
+		name: e.name,
+		kind: e.kind,
+		polygon: e.points,
+		color: e.color
+	};
 }
-function dt({ deviceId: e }) {
-  const o = O(), n = q(o.trpcClient, e), p = z(n?.state.zones), m = Z(() => p?.zones ?? [], [p]), a = U(), s = a?.drawingKind ?? null, r = a?.selectedZoneId ?? null, f = a?.editingDraft ?? null, l = Z(() => m.map((c) => f && f.id === c.id ? {
-    id: f.id,
-    name: f.name,
-    kind: f.kind,
-    color: f.color,
-    points: [...f.points]
-  } : ct(c)), [m, f]), k = Z(() => l.map(rt), [l]), D = w(
-    async (c) => {
-      if (c.kind !== "polygon" && c.kind !== "line") return;
-      const g = {
-        id: crypto.randomUUID(),
-        name: "",
-        kind: ot(c.kind),
-        color: lt(l),
-        points: [...c.points]
-      };
-      try {
-        await n?.zones?.addZone({ zone: G(g) });
-      } catch (_) {
-        console.error("zones.addZone failed", _);
-      }
-      a?.setSelectedZoneId(g.id), a?.setDrawingKind(null);
-    },
-    [n, l, a]
-  ), N = w(
-    async (c, g) => {
-      const _ = g.map((h) => ({ x: h.x, y: h.y }));
-      if (f && f.id === c) {
-        a?.updateDraft({ points: _ });
-        return;
-      }
-      const u = l.find((h) => h.id === c);
-      if (u)
-        try {
-          await n?.zones?.updateZone({ zone: G({ ...u, points: _ }) });
-        } catch (h) {
-          console.error("zones.updateZone failed", h);
-        }
-    },
-    [n, l, f, a]
-  ), C = w(
-    (c, g) => {
-      typeof c == "string" && (g.kind !== "polygon" && g.kind !== "line" || N(c, g.points));
-    },
-    [N]
-  ), S = w(
-    (c) => {
-      if (c === null) {
-        a?.discardDraft(), a?.setSelectedZoneId(null);
-        return;
-      }
-      if (typeof c != "string") return;
-      const g = l.find((_) => _.id === c);
-      if (!g) {
-        a?.setSelectedZoneId(c);
-        return;
-      }
-      a?.enterDraft({
-        id: g.id,
-        kind: g.kind,
-        name: g.name,
-        color: g.color,
-        points: g.points
-      });
-    },
-    [l, a]
-  );
-  return l.length === 0 && s === null ? null : /* @__PURE__ */ t(
-    ce,
-    {
-      transparent: !0,
-      items: k,
-      supportedShapes: it,
-      selectedId: r,
-      onSelect: S,
-      onShapeChange: C,
-      onDrawComplete: (c) => {
-        D(c);
-      },
-      drawingKind: s === null ? null : at(s)
-    }
-  );
+function Te({ deviceId: e }) {
+	let t = O(k().trpcClient, e), r = j(t?.state.zones), a = i(() => r?.zones ?? [], [r]), o = w(), s = o?.drawingKind ?? null, c = o?.selectedZoneId ?? null, l = o?.editingDraft ?? null, u = i(() => a.map((e) => l && l.id === e.id ? {
+		id: l.id,
+		name: l.name,
+		kind: l.kind,
+		color: l.color,
+		points: [...l.points]
+	} : we(e)), [a, l]), d = i(() => u.map(ye), [u]), f = n(async (e) => {
+		if (e.kind !== "polygon" && e.kind !== "line") return;
+		let n = {
+			id: crypto.randomUUID(),
+			name: "",
+			kind: be(e.kind),
+			color: Ce(u),
+			points: [...e.points]
+		};
+		try {
+			await t?.zones?.addZone({ zone: $(n) });
+		} catch (e) {
+			console.error("zones.addZone failed", e);
+		}
+		o?.setSelectedZoneId(n.id), o?.setDrawingKind(null);
+	}, [
+		t,
+		u,
+		o
+	]), p = n(async (e, n) => {
+		let r = n.map((e) => ({
+			x: e.x,
+			y: e.y
+		}));
+		if (l && l.id === e) {
+			o?.updateDraft({ points: r });
+			return;
+		}
+		let i = u.find((t) => t.id === e);
+		if (i) try {
+			await t?.zones?.updateZone({ zone: $({
+				...i,
+				points: r
+			}) });
+		} catch (e) {
+			console.error("zones.updateZone failed", e);
+		}
+	}, [
+		t,
+		u,
+		l,
+		o
+	]), m = n((e, t) => {
+		typeof e == "string" && (t.kind !== "polygon" && t.kind !== "line" || p(e, t.points));
+	}, [p]), h = n((e) => {
+		if (e === null) {
+			o?.discardDraft(), o?.setSelectedZoneId(null);
+			return;
+		}
+		if (typeof e != "string") return;
+		let t = u.find((t) => t.id === e);
+		if (!t) {
+			o?.setSelectedZoneId(e);
+			return;
+		}
+		o?.enterDraft({
+			id: t.id,
+			kind: t.kind,
+			name: t.name,
+			color: t.color,
+			points: t.points
+		});
+	}, [u, o]);
+	return u.length === 0 && s === null ? null : /* @__PURE__ */ M(T, {
+		transparent: !0,
+		items: d,
+		supportedShapes: Z,
+		selectedId: c,
+		onSelect: h,
+		onShapeChange: m,
+		onDrawComplete: (e) => {
+			f(e);
+		},
+		drawingKind: s === null ? null : xe(s)
+	});
 }
-const ut = xe(dt), pt = "#3b82f6";
-function mt(e) {
-  return {
-    id: e.id,
-    name: e.name,
-    kind: e.kind,
-    color: e.color || pt,
-    points: [...e.polygon]
-  };
+var Ee = a(Te), De = "#3b82f6";
+function Oe(e) {
+	return {
+		id: e.id,
+		name: e.name,
+		kind: e.kind,
+		color: e.color || De,
+		points: [...e.polygon]
+	};
 }
-function ft(e) {
-  return {
-    id: e.id,
-    name: e.name,
-    kind: e.kind,
-    polygon: e.points,
-    color: e.color
-  };
+function ke(e) {
+	return {
+		id: e.id,
+		name: e.name,
+		kind: e.kind,
+		polygon: e.points,
+		color: e.color
+	};
 }
-function ht({ deviceId: e }) {
-  const o = O(), n = q(o.trpcClient, e), p = z(n?.state.zones), m = Z(() => p?.zones ?? [], [p]), a = Z(() => m.map(mt), [m]), s = U(), r = s?.drawingKind ?? null, f = s?.selectedZoneId ?? null, l = s?.editingDraft ?? null, k = Z(
-    () => ({
-      id: "zones",
-      order: 100,
-      // above PTZ overlay (order 0) so handles aren't occluded
-      node: /* @__PURE__ */ t(ut, { deviceId: e })
-    }),
-    [e]
-  );
-  de(k);
-  const D = w(
-    (u) => {
-      if (u === null) {
-        s?.discardDraft(), s?.setSelectedZoneId(null);
-        return;
-      }
-      const h = a.find(($) => $.id === u);
-      h && s?.enterDraft({
-        id: h.id,
-        kind: h.kind,
-        name: h.name,
-        color: h.color,
-        points: h.points
-      });
-    },
-    [a, s]
-  ), N = w(async () => {
-    const u = s?.editingDraft;
-    if (u) {
-      try {
-        await n?.zones?.updateZone({
-          zone: ft({
-            id: u.id,
-            kind: u.kind,
-            name: u.name,
-            color: u.color,
-            points: [...u.points]
-          })
-        });
-      } catch (h) {
-        console.error("zones.updateZone failed", h);
-      }
-      s?.discardDraft(), s?.setSelectedZoneId(null);
-    }
-  }, [n, s]), C = w(() => {
-    s?.discardDraft(), s?.setSelectedZoneId(null);
-  }, [s]), S = w(
-    async (u) => {
-      try {
-        await n?.zones?.removeZone({ zoneId: u });
-      } catch (h) {
-        console.error("zones.removeZone failed", h);
-      }
-      s?.selectedZoneId === u && s.setSelectedZoneId(null), s?.editingDraft?.id === u && s.discardDraft();
-    },
-    [n, s]
-  ), c = w(
-    (u) => {
-      s?.startDrawing(u);
-    },
-    [s]
-  ), g = w(() => {
-    s?.setDrawingKind(null);
-  }, [s]), _ = Z(() => !l || !a.find((h) => h.id === l.id) ? null : {
-    id: l.id,
-    kind: l.kind,
-    name: l.name,
-    color: l.color,
-    points: [...l.points]
-  }, [a, l]);
-  return /* @__PURE__ */ i("div", { className: ue, children: [
-    /* @__PURE__ */ i("div", { className: pe, children: [
-      /* @__PURE__ */ t("div", { className: me, children: /* @__PURE__ */ i("div", { className: "min-w-0", children: [
-        /* @__PURE__ */ t("h2", { className: J, children: "Detection Zones" }),
-        /* @__PURE__ */ i("p", { className: `${fe} mt-0.5 leading-tight`, children: [
-          "Pick a shape below or use the ",
-          /* @__PURE__ */ t("strong", { className: "text-foreground", children: "Zones" }),
-          " button on the live frame to draw new polygons or tripwires. Behaviour is set per-stage in the rules editors below — a zone with no rule is observed by analytics but never filters."
-        ] })
-      ] }) }),
-      /* @__PURE__ */ i("div", { className: `${he} flex flex-col gap-3`, children: [
-        /* @__PURE__ */ t(
-          Xe,
-          {
-            zones: a,
-            selectedZoneId: f,
-            drawingKind: r,
-            onSelectZone: D,
-            onDeleteZone: S,
-            onStartDraw: c,
-            onCancelDraw: g
-          }
-        ),
-        _ && /* @__PURE__ */ i(X, { children: [
-          /* @__PURE__ */ t("div", { className: "border-t border-border" }),
-          /* @__PURE__ */ t(
-            Ye,
-            {
-              zone: _,
-              onSave: N,
-              onDiscard: C,
-              onDelete: () => S(_.id)
-            }
-          )
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ i("div", { className: `grid grid-cols-1 2xl:grid-cols-2 ${ge}`, children: [
-      /* @__PURE__ */ t(W, { dev: n, stage: "motion", zones: m }),
-      /* @__PURE__ */ t(W, { dev: n, stage: "detection", zones: m })
-    ] })
-  ] });
+function Ae({ deviceId: e }) {
+	let t = O(k().trpcClient, e), r = j(t?.state.zones), a = i(() => r?.zones ?? [], [r]), o = i(() => a.map(Oe), [a]), s = w(), l = s?.drawingKind ?? null, u = s?.selectedZoneId ?? null, d = s?.editingDraft ?? null;
+	c(i(() => ({
+		id: "zones",
+		order: 100,
+		node: /* @__PURE__ */ M(Ee, { deviceId: e })
+	}), [e]));
+	let f = n((e) => {
+		if (e === null) {
+			s?.discardDraft(), s?.setSelectedZoneId(null);
+			return;
+		}
+		let t = o.find((t) => t.id === e);
+		t && s?.enterDraft({
+			id: t.id,
+			kind: t.kind,
+			name: t.name,
+			color: t.color,
+			points: t.points
+		});
+	}, [o, s]), g = n(async () => {
+		let e = s?.editingDraft;
+		if (e) {
+			try {
+				await t?.zones?.updateZone({ zone: ke({
+					id: e.id,
+					kind: e.kind,
+					name: e.name,
+					color: e.color,
+					points: [...e.points]
+				}) });
+			} catch (e) {
+				console.error("zones.updateZone failed", e);
+			}
+			s?.discardDraft(), s?.setSelectedZoneId(null);
+		}
+	}, [t, s]), _ = n(() => {
+		s?.discardDraft(), s?.setSelectedZoneId(null);
+	}, [s]), v = n(async (e) => {
+		try {
+			await t?.zones?.removeZone({ zoneId: e });
+		} catch (e) {
+			console.error("zones.removeZone failed", e);
+		}
+		s?.selectedZoneId === e && s.setSelectedZoneId(null), s?.editingDraft?.id === e && s.discardDraft();
+	}, [t, s]), b = n((e) => {
+		s?.startDrawing(e);
+	}, [s]), S = n(() => {
+		s?.setDrawingKind(null);
+	}, [s]), T = i(() => !d || !o.find((e) => e.id === d.id) ? null : {
+		id: d.id,
+		kind: d.kind,
+		name: d.name,
+		color: d.color,
+		points: [...d.points]
+	}, [o, d]);
+	return /* @__PURE__ */ N("div", {
+		className: m,
+		children: [/* @__PURE__ */ N("div", {
+			className: y,
+			children: [/* @__PURE__ */ M("div", {
+				className: D,
+				children: /* @__PURE__ */ N("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ M("h2", {
+						className: C,
+						children: "Detection Zones"
+					}), /* @__PURE__ */ N("p", {
+						className: `${h} mt-0.5 leading-tight`,
+						children: [
+							"Pick a shape below or use the ",
+							/* @__PURE__ */ M("strong", {
+								className: "text-foreground",
+								children: "Zones"
+							}),
+							" ",
+							"button on the live frame to draw new polygons or tripwires. Behaviour is set per-stage in the rules editors below — a zone with no rule is observed by analytics but never filters."
+						]
+					})]
+				})
+			}), /* @__PURE__ */ N("div", {
+				className: `${p} flex flex-col gap-3`,
+				children: [/* @__PURE__ */ M(pe, {
+					zones: o,
+					selectedZoneId: u,
+					drawingKind: l,
+					onSelectZone: f,
+					onDeleteZone: v,
+					onStartDraw: b,
+					onCancelDraw: S
+				}), T && /* @__PURE__ */ N(P, { children: [/* @__PURE__ */ M("div", { className: "border-t border-border" }), /* @__PURE__ */ M(he, {
+					zone: T,
+					onSave: g,
+					onDiscard: _,
+					onDelete: () => v(T.id)
+				})] })]
+			})]
+		}), /* @__PURE__ */ N("div", {
+			className: `grid grid-cols-1 2xl:grid-cols-2 ${x}`,
+			children: [/* @__PURE__ */ M(X, {
+				dev: t,
+				stage: "motion",
+				zones: a
+			}), /* @__PURE__ */ M(X, {
+				dev: t,
+				stage: "detection",
+				zones: a
+			})]
+		})]
+	});
 }
-function gt(e) {
-  return e.deviceId === void 0 ? /* @__PURE__ */ t("div", { className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning", children: "ZoneEditor requires a deviceId" }) : /* @__PURE__ */ t(ht, { deviceId: e.deviceId });
+//#endregion
+//#region src/widgets/ZoneEditor.tsx
+function je(e) {
+	return e.deviceId === void 0 ? /* @__PURE__ */ M("div", {
+		className: "rounded-lg border border-warning/30 bg-warning/10 px-3 py-2 text-xs text-warning",
+		children: "ZoneEditor requires a deviceId"
+	}) : /* @__PURE__ */ M(Ae, { deviceId: e.deviceId });
 }
-const kt = {
-  "pipeline-quick-stats": Ve,
-  "zone-editor": gt
-};
-export {
-  kt as default
+//#endregion
+//#region src/widgets/index.tsx
+var Me = {
+	"pipeline-quick-stats": ce,
+	"zone-editor": je
 };
+//#endregion
+export { Me as default };