@camstack/addon-osd-manager 0.1.160 → 0.1.163

package/dist/_stub.js

@@ -1,18 +1,18 @@
 import "./virtualExposes-BgZ5Cn7S.mjs";
-import "./virtual_mf-REMOTE_ENTRY_ID___mfe_internal__addon_osd_manager_page__remoteEntry_js-BAuPDG6y.mjs";
+import "./virtual_mf-REMOTE_ENTRY_ID___mfe_internal__addon_osd_manager_page__remoteEntry_js-BDRx238Q.mjs";
 import { _ as e, b as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, p as d, r as f, t as p, u as m, v as h } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare__react__loadShare__.js-C5jUMd7X.mjs";
-import { a as g, c as _, i as v, n as y, o as b, r as x, s as S } from "./responsive-B7zCyVCX.mjs";
-import { d as C, l as w, s as T, u as E } from "./scene-monitor-copy-DWIcj1X6.mjs";
-import { i as D, r as O } from "./player-overlays-BgDqoYs3.mjs";
-import { i as ee, n as te, r as ne, t as k } from "./square-D0YQUHMC.mjs";
-import { t as re } from "./trash-2-C_1H5SIl.mjs";
+import { a as g, c as _, i as v, n as y, o as b, r as x, s as S } from "./responsive-f0BEKhKZ.mjs";
+import { d as C, l as w, s as T, u as E } from "./scene-monitor-copy-3aBK5dFt.mjs";
+import { i as D, r as O } from "./player-overlays-Jq6b7VG9.mjs";
+import { i as ee, n as te, r as ne, t as k } from "./square-0Yv5lztO.mjs";
+import { t as re } from "./trash-2-DW3JH3cd.mjs";
 import { t as ie } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_trpc_mf_1_react_mf_2_query__loadShare__.js-BpP33rwB.mjs";
 import { n as A, r as j, t as M } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare__react_mf_1_jsx_mf_2_runtime__loadShare__.js-DalfdIDw.mjs";
 import { t as ae } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare__react_mf_2_dom__loadShare__.js-qB5uHZAd.mjs";
 import { n as N, t as oe } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.js-CHxDN0gE.mjs";
 import "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare__react_mf_2_dom_mf_1_client__loadShare__.js-Dhy3m6Ij.mjs";
 import "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_trpc_mf_1_client__loadShare__.js-C7omKvJr.mjs";
-import { _ as P, a as F, b as I, c as se, d as L, f as ce, g as le, h as ue, l as de, m as fe, n as pe, o as me, p as he, r as ge, s as _e, t as ve, u as ye, v as R, y as be } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_camstack_mf_1_types__loadShare__.js-BzuGVFNp.mjs";
+import { _ as P, a as F, b as I, c as se, d as L, f as ce, g as le, h as ue, l as de, m as fe, n as pe, o as me, p as he, r as ge, s as _e, t as ve, u as ye, v as R, y as be } from "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_camstack_mf_1_types__loadShare__.js-m50hiGN8.mjs";
 import "./_virtual_mf___mfe_internal__addon_osd_manager_page__loadShare___mf_0_camstack_mf_1_sdk__loadShare__.js-B_4MkXHU.mjs";
 var xe = _("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",
@@ -6100,7 +6100,7 @@ t(), t(), t(), S("camstack:recorded-playback", {
 	mode: "live",
 	positionMs: null,
 	send: () => !1
-}), t(), t(), t(), t(), t(), t(), s(() => import("./MotionZonesSettings-gJgHYJJc.mjs").then((e) => ({ default: e.MotionZonesSettings }))), s(() => import("./PrivacyMaskSettings-HmUc5RFn.mjs").then((e) => ({ default: e.PrivacyMaskSettings }))), t(), t();
+}), t(), t(), t(), t(), t(), t(), s(() => import("./MotionZonesSettings-D2hCddip.mjs").then((e) => ({ default: e.MotionZonesSettings }))), s(() => import("./PrivacyMaskSettings-Y4wvw_Gu.mjs").then((e) => ({ default: e.PrivacyMaskSettings }))), t(), t();
 var Oo = Object.defineProperty, ko = Object.getOwnPropertySymbols, Ao = Object.prototype.hasOwnProperty, jo = Object.prototype.propertyIsEnumerable, Mo = (e, t, n) => t in e ? Oo(e, t, {
 	enumerable: !0,
 	configurable: !0,
@@ -22468,7 +22468,7 @@ var IT = class {
 		} catch {}
 	}
 };
-t(), new IT(), t(), t(), t(), s(() => import("./MaskShapeCanvas-BT714ljC.mjs").then((e) => ({ default: e.MaskShapeCanvas }))), s(() => import("./MotionZonesSettings-gJgHYJJc.mjs").then((e) => ({ default: e.MotionZonesSettings }))), s(() => import("./SceneMonitorEditor-Dqc4eAZT.mjs").then((e) => ({ default: e.SceneMonitorEditor }))), s(() => import("./PrivacyMaskSettings-HmUc5RFn.mjs").then((e) => ({ default: e.PrivacyMaskSettings })));
+t(), new IT(), t(), t(), t(), s(() => import("./MaskShapeCanvas-BT714ljC.mjs").then((e) => ({ default: e.MaskShapeCanvas }))), s(() => import("./MotionZonesSettings-D2hCddip.mjs").then((e) => ({ default: e.MotionZonesSettings }))), s(() => import("./SceneMonitorEditor-TTBo-9RR.mjs").then((e) => ({ default: e.SceneMonitorEditor }))), s(() => import("./PrivacyMaskSettings-Y4wvw_Gu.mjs").then((e) => ({ default: e.PrivacyMaskSettings })));
 //#endregion
 //#region src/ui/osd-page-model.ts
 function LT() {
@@ -22717,23 +22717,60 @@ function yE(e, t) {
 	return e.find((e) => e.id === t);
 }
 //#endregion
-//#region src/components/DeviceStateSourceEditor.tsx
-t();
+//#region src/unit-display.ts
 function bE(e) {
-	return `${e.deviceId}:${e.capName}:${e.valuePath}`;
-}
-function xE(e) {
 	if (e === void 0) return;
 	let t = F(e);
-	return t === void 0 ? void 0 : L(t);
+	if (t !== void 0) return L(t);
+}
+function xE(e, t, n) {
+	let r = t === void 0 ? void 0 : F(t), i = n === void 0 ? void 0 : F(n);
+	if (r === void 0 || i === void 0 || r === i) return {
+		value: e,
+		unit: i ?? r ?? ""
+	};
+	let a = ye(e, r, i);
+	return a === void 0 ? {
+		value: e,
+		unit: r
+	} : {
+		value: a,
+		unit: i
+	};
+}
+function SE(e, t) {
+	if (typeof e != "object" || !e || Array.isArray(e)) return;
+	let n = { ...e }, r = t.split(".");
+	if (r.length >= 1) {
+		let e = n;
+		for (let t of r.slice(0, -1)) {
+			if (typeof e != "object" || !e || Array.isArray(e)) {
+				e = void 0;
+				break;
+			}
+			e = { ...e }[t];
+		}
+		if (typeof e == "object" && e && !Array.isArray(e)) {
+			let t = { ...e }.unit;
+			if (typeof t == "string" && t.length > 0) return t;
+		}
+	}
+	let i = n.unit;
+	return typeof i == "string" && i.length > 0 ? i : void 0;
+}
+//#endregion
+//#region src/components/DeviceStateSourceEditor.tsx
+t();
+function CE(e) {
+	return `${e.deviceId}:${e.capName}:${e.valuePath}`;
 }
-function SE(e) {
+function wE(e) {
 	let t = e.toLowerCase();
 	if (t.includes("temp")) return "°C";
 	if (t.includes("humid")) return "%";
 	if (t.includes("pressure") || t.includes("hpa")) return "hPa";
 }
-function CE(e) {
+function TE(e) {
 	return e.map((e) => ({
 		id: e.id,
 		name: e.name,
@@ -22742,12 +22779,12 @@ function CE(e) {
 		parentDeviceId: "parentDeviceId" in e && typeof e.parentDeviceId == "number" ? e.parentDeviceId : null
 	}));
 }
-function wE({ source: e, sources: t, pickerDevices: n, listState: r, onChange: i }) {
-	let o = l(() => CE(n), [n]), s = l(() => new Set(t.map((e) => e.deviceId)), [t]), [c, u] = a(void 0), d = e.deviceId, f = c ?? d, p = c !== void 0 && gE(yE(o, c)?.type) ? c : void 0, m = p === void 0 ? [] : vE(p, o, s), h = l(() => d === void 0 || p !== void 0 ? void 0 : dE(t, d), [
+function EE({ source: e, sources: t, pickerDevices: n, listState: r, onChange: i }) {
+	let o = l(() => TE(n), [n]), s = l(() => new Set(t.map((e) => e.deviceId)), [t]), [c, u] = a(void 0), d = e.deviceId, f = c ?? d, p = c !== void 0 && gE(yE(o, c)?.type) ? c : void 0, m = p === void 0 ? [] : vE(p, o, s), h = l(() => d === void 0 || p !== void 0 ? void 0 : dE(t, d), [
 		t,
 		d,
 		p
-	]), g = d === void 0 || p !== void 0 ? void 0 : t.find((t) => t.deviceId === d && t.capName === e.capName && t.valuePath === e.valuePath), _ = SE(e.valuePath), v = xE(e.displayUnit ?? _);
+	]), g = d === void 0 || p !== void 0 ? void 0 : t.find((t) => t.deviceId === d && t.capName === e.capName && t.valuePath === e.valuePath), _ = wE(e.valuePath), v = bE(_);
 	return /* @__PURE__ */ j("div", {
 		className: "space-y-2",
 		"data-testid": "osd-device-state-editor",
@@ -22854,17 +22891,17 @@ function wE({ source: e, sources: t, pickerDevices: n, listState: r, onChange: i
 			}), /* @__PURE__ */ A(po, {
 				id: "osd-field-pick",
 				"data-testid": "osd-field-pick",
-				value: bE(g || {
+				value: CE(g || {
 					deviceId: d ?? 0,
 					capName: e.capName,
 					valuePath: e.valuePath
 				}),
 				options: h.fields.map((e) => ({
-					value: bE(e),
+					value: CE(e),
 					label: e.label
 				})),
 				onChange: (t) => {
-					let n = h.fields.find((e) => bE(e) === t.target.value);
+					let n = h.fields.find((e) => CE(e) === t.target.value);
 					n && i({
 						kind: "device-state",
 						deviceId: n.deviceId,
@@ -22906,7 +22943,7 @@ function wE({ source: e, sources: t, pickerDevices: n, listState: r, onChange: i
 //#endregion
 //#region src/components/SourceEditor.tsx
 t();
-var TE = [
+var DE = [
 	{
 		value: "static",
 		label: "Static text"
@@ -22928,7 +22965,7 @@ var TE = [
 		label: "Named template"
 	}
 ];
-function EE({ source: e, sources: t, pickerDevices: n, listState: r, templates: i, onChange: a }) {
+function OE({ source: e, sources: t, pickerDevices: n, listState: r, templates: i, onChange: a }) {
 	let o = l(() => i.map((e) => ({
 		value: e.id,
 		label: e.name || e.id
@@ -22942,7 +22979,7 @@ function EE({ source: e, sources: t, pickerDevices: n, listState: r, templates:
 			}), /* @__PURE__ */ A(po, {
 				id: "osd-source-kind",
 				value: e.kind,
-				options: TE,
+				options: DE,
 				onChange: (e) => {
 					let t = e.target.value;
 					if (t === "static") a({
@@ -23013,7 +23050,7 @@ function EE({ source: e, sources: t, pickerDevices: n, listState: r, templates:
 					})
 				})] })]
 			}),
-			e.kind === "device-state" && /* @__PURE__ */ A(wE, {
+			e.kind === "device-state" && /* @__PURE__ */ A(EE, {
 				source: e,
 				sources: t,
 				pickerDevices: n,
@@ -23058,7 +23095,7 @@ function EE({ source: e, sources: t, pickerDevices: n, listState: r, templates:
 }
 //#endregion
 //#region src/components/ValueMapEditor.tsx
-function DE({ valueMap: e, onChange: t }) {
+function kE({ valueMap: e, onChange: t }) {
 	let n = Object.entries(e ?? {});
 	function r(e) {
 		if (e.length === 0) {
@@ -23118,13 +23155,13 @@ function DE({ valueMap: e, onChange: t }) {
 }
 //#endregion
 //#region src/components/ScheduleEditor.tsx
-function OE(e, t, n) {
+function AE(e, t, n) {
 	return {
 		...e,
 		windows: e.windows.map((e, r) => r === t ? n : e)
 	};
 }
-function kE({ schedule: e, onChange: t }) {
+function jE({ schedule: e, onChange: t }) {
 	let n = e !== void 0;
 	return /* @__PURE__ */ j("div", {
 		className: "space-y-3",
@@ -23145,7 +23182,7 @@ function kE({ schedule: e, onChange: t }) {
 							type: "button",
 							"aria-pressed": n.days.includes(a),
 							className: ["px-1.5 py-0.5 rounded text-[10px] font-medium", n.days.includes(a) ? "bg-primary text-primary-foreground" : "bg-surface-hover text-foreground-muted"].join(" "),
-							onClick: () => t(OE(e, r, sE(n, a))),
+							onClick: () => t(AE(e, r, sE(n, a))),
 							children: i
 						}, a))
 					}),
@@ -23159,7 +23196,7 @@ function kE({ schedule: e, onChange: t }) {
 							type: "time",
 							className: "h-7 w-full px-2 text-xs bg-surface border border-border rounded-md text-foreground",
 							value: aE(n.startMinute),
-							onChange: (i) => t(OE(e, r, {
+							onChange: (i) => t(AE(e, r, {
 								...n,
 								startMinute: oE(i.target.value)
 							}))
@@ -23171,7 +23208,7 @@ function kE({ schedule: e, onChange: t }) {
 							type: "time",
 							className: "h-7 w-full px-2 text-xs bg-surface border border-border rounded-md text-foreground",
 							value: aE(n.endMinute),
-							onChange: (i) => t(OE(e, r, {
+							onChange: (i) => t(AE(e, r, {
 								...n,
 								endMinute: oE(i.target.value)
 							}))
@@ -23203,7 +23240,7 @@ function kE({ schedule: e, onChange: t }) {
 }
 //#endregion
 //#region src/components/ConditionsEditor.tsx
-function AE({ conditions: e, supported: t, devices: n, deviceStateSnapshot: r, onSelectDeviceStateDevice: i, onChange: a }) {
+function ME({ conditions: e, supported: t, devices: n, deviceStateSnapshot: r, onSelectDeviceStateDevice: i, onChange: a }) {
 	let o = t.includes("deviceState"), s = lE(r);
 	return /* @__PURE__ */ j("div", {
 		className: "space-y-3",
@@ -23274,7 +23311,7 @@ function AE({ conditions: e, supported: t, devices: n, deviceStateSnapshot: r, o
 //#endregion
 //#region src/components/SlotEditor.tsx
 t();
-function jE({ deviceId: e, slot: t, sources: n, conditionSupport: r, devices: i, pickerDevices: o, listState: s, templates: c, onClose: u, onSaved: d }) {
+function NE({ deviceId: e, slot: t, sources: n, conditionSupport: r, devices: i, pickerDevices: o, listState: s, templates: c, onClose: u, onSaved: d }) {
 	let [f, p] = a(() => RT(t)), [m, h] = a(f.conditions?.deviceState?.deviceId), [g, _] = a(void 0), v = gi({ deviceId: m ?? 0 }, { enabled: m !== void 0 }), y = xi(), b = Si(), x = wi(), S = y.isPending || b.isPending || x.isPending, C = y.error ?? b.error ?? x.error, w = l(() => [{
 		id: "value",
 		label: "${value}",
@@ -23342,7 +23379,7 @@ function jE({ deviceId: e, slot: t, sources: n, conditionSupport: r, devices: i,
 					}))
 				}), "Binding enabled"]
 			}),
-			/* @__PURE__ */ A(EE, {
+			/* @__PURE__ */ A(OE, {
 				source: f.source,
 				sources: n,
 				pickerDevices: o,
@@ -23433,21 +23470,21 @@ function jE({ deviceId: e, slot: t, sources: n, conditionSupport: r, devices: i,
 					})
 				]
 			}),
-			/* @__PURE__ */ A(DE, {
+			/* @__PURE__ */ A(kE, {
 				valueMap: f.valueMap,
 				onChange: (e) => p((t) => ({
 					...t,
 					valueMap: e
 				}))
 			}),
-			/* @__PURE__ */ A(kE, {
+			/* @__PURE__ */ A(jE, {
 				schedule: f.schedule,
 				onChange: (e) => p((t) => ({
 					...t,
 					schedule: e
 				}))
 			}),
-			/* @__PURE__ */ A(AE, {
+			/* @__PURE__ */ A(ME, {
 				conditions: f.conditions,
 				supported: r,
 				devices: i,
@@ -23505,7 +23542,7 @@ function jE({ deviceId: e, slot: t, sources: n, conditionSupport: r, devices: i,
 //#endregion
 //#region src/components/DuplicateIntoAction.tsx
 t();
-function ME({ source: e, destinations: t, onDuplicated: n }) {
+function PE({ source: e, destinations: t, onDuplicated: n }) {
 	let [r, i] = a(!1), [o, s] = a(void 0), [c, l] = a(void 0), [u, d] = a(void 0), f = Ci();
 	if (t.length === 0) return null;
 	function p() {
@@ -23600,7 +23637,7 @@ function ME({ source: e, destinations: t, onDuplicated: n }) {
 //#endregion
 //#region src/components/CameraOsdRow.tsx
 t();
-function NE({ cameraId: e, supportsOsd: t, onRefetchReady: n }) {
+function FE({ cameraId: e, supportsOsd: t, onRefetchReady: n }) {
 	let r = vi({ deviceId: e }, { enabled: t });
 	if (m(() => {
 		t && n(e, () => void r.refetch());
@@ -23615,7 +23652,7 @@ function NE({ cameraId: e, supportsOsd: t, onRefetchReady: n }) {
 		children: WT(i)
 	});
 }
-function PE({ cameraId: e, supportsOsd: t, deviceNameById: n }) {
+function IE({ cameraId: e, supportsOsd: t, deviceNameById: n }) {
 	let r = vi({ deviceId: e }, { enabled: t });
 	if (!t) return /* @__PURE__ */ A("span", {
 		className: "text-xs text-foreground-subtle",
@@ -23638,7 +23675,7 @@ function PE({ cameraId: e, supportsOsd: t, deviceNameById: n }) {
 		}, e.key))
 	});
 }
-function FE({ camera: e, allDevices: t, conditionSupport: n, pickerDevices: r, listState: i, templates: o, destinations: s, onRefetchReady: c, refetchCamera: u }) {
+function LE({ camera: e, allDevices: t, conditionSupport: n, pickerDevices: r, listState: i, templates: o, destinations: s, onRefetchReady: c, refetchCamera: u }) {
 	let [d, f] = a(null), [p, h] = a(0), g = vi({ deviceId: e.id }, { enabled: e.supportsOsd }), _ = g.data?.slots ?? [], v = l(() => d !== null && _.some((e) => e.slotId === d) ? d : XT(_), [d, _]), y = _.find((e) => e.slotId === v), b = yi({ deviceId: e.id }, { enabled: e.supportsOsd && y !== void 0 && !y.readOnly }), x = Ti();
 	m(() => {
 		e.supportsOsd && c(e.id, () => void g.refetch());
@@ -23667,7 +23704,7 @@ function FE({ camera: e, allDevices: t, conditionSupport: n, pickerDevices: r, l
 						disabled: x.isPending,
 						onClick: () => x.mutate({ deviceId: e.id }, { onSuccess: () => void g.refetch() }),
 						children: [x.isPending ? /* @__PURE__ */ A(un, { className: "h-3.5 w-3.5 animate-spin" }) : null, "Render now"]
-					}) : null, e.supportsOsd ? /* @__PURE__ */ A(ME, {
+					}) : null, e.supportsOsd ? /* @__PURE__ */ A(PE, {
 						source: e,
 						destinations: s,
 						onDuplicated: (e) => {
@@ -23701,9 +23738,9 @@ function FE({ camera: e, allDevices: t, conditionSupport: n, pickerDevices: r, l
 					},
 					children: /* @__PURE__ */ A(Rs, {
 						className: "mb-3",
-						children: _.map((e) => /* @__PURE__ */ A(IE, { slot: e }, e.slotId))
+						children: _.map((e) => /* @__PURE__ */ A(RE, { slot: e }, e.slotId))
 					})
-				}), y === void 0 ? null : /* @__PURE__ */ A(LE, {
+				}), y === void 0 ? null : /* @__PURE__ */ A(zE, {
 					cameraId: e.id,
 					slot: y,
 					editorEpoch: p,
@@ -23721,7 +23758,7 @@ function FE({ camera: e, allDevices: t, conditionSupport: n, pickerDevices: r, l
 		]
 	});
 }
-function IE({ slot: e }) {
+function RE({ slot: e }) {
 	let t = qT(e);
 	return /* @__PURE__ */ j(zs, {
 		value: e.slotId,
@@ -23732,7 +23769,7 @@ function IE({ slot: e }) {
 		})]
 	});
 }
-function LE({ cameraId: e, slot: t, editorEpoch: n, sources: r, conditionSupport: i, devices: a, pickerDevices: o, listState: s, templates: c, onSaved: l }) {
+function zE({ cameraId: e, slot: t, editorEpoch: n, sources: r, conditionSupport: i, devices: a, pickerDevices: o, listState: s, templates: c, onSaved: l }) {
 	return t.readOnly ? /* @__PURE__ */ j("div", {
 		className: "rounded-lg border border-border bg-surface p-4 space-y-2",
 		"data-testid": "osd-slot-readonly",
@@ -23764,7 +23801,7 @@ function LE({ cameraId: e, slot: t, editorEpoch: n, sources: r, conditionSupport
 				children: VT(t.binding)
 			})
 		]
-	}) : /* @__PURE__ */ A(jE, {
+	}) : /* @__PURE__ */ A(NE, {
 		deviceId: e,
 		slot: t,
 		sources: r,
@@ -23779,7 +23816,7 @@ function LE({ cameraId: e, slot: t, editorEpoch: n, sources: r, conditionSupport
 //#endregion
 //#region src/components/CameraOsdTable.tsx
 t();
-function RE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r, pickerDevices: i, listState: s, templates: c }) {
+function BE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r, pickerDevices: i, listState: s, templates: c }) {
 	let [u, d] = a(void 0), f = o(/* @__PURE__ */ new Map()), p = l(() => new Map(n.map((e) => [e.id, e.name])), [n]), m = l(() => e.map((e) => ({
 		id: e.id,
 		name: e.name,
@@ -23840,7 +23877,7 @@ function RE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r,
 			{
 				key: "status",
 				header: "Status",
-				cell: (e) => /* @__PURE__ */ A(NE, {
+				cell: (e) => /* @__PURE__ */ A(FE, {
 					cameraId: e.id,
 					supportsOsd: e.supportsOsd,
 					onRefetchReady: h
@@ -23849,7 +23886,7 @@ function RE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r,
 			{
 				key: "sources",
 				header: "Active sources",
-				cell: (e) => /* @__PURE__ */ A(PE, {
+				cell: (e) => /* @__PURE__ */ A(IE, {
 					cameraId: e.id,
 					supportsOsd: e.supportsOsd,
 					deviceNameById: p
@@ -23859,7 +23896,7 @@ function RE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r,
 		isExpanded: (e) => u === e.id,
 		renderExpanded: (e) => /* @__PURE__ */ A("div", {
 			id: `osd-camera-detail-${e.id}`,
-			children: /* @__PURE__ */ A(FE, {
+			children: /* @__PURE__ */ A(LE, {
 				camera: e,
 				allDevices: n,
 				conditionSupport: r,
@@ -23877,7 +23914,7 @@ function RE({ cameras: e, osdCapableIds: t, allDevices: n, conditionSupport: r,
 }
 //#endregion
 //#region src/format.ts
-function zE(e, t) {
+function VE(e, t) {
 	if (!Number.isFinite(e)) return "";
 	if (t <= 0) return String(Math.trunc(e));
 	let n = 10 ** t, r = Math.trunc(e * n) / n;
@@ -23885,16 +23922,39 @@ function zE(e, t) {
 }
 //#endregion
 //#region src/template-tokens.ts
-function BE(e) {
-	return `{${e}}`;
+function HE(e, t = "full") {
+	return t === "full" ? `{${e}}` : `{${e}.${t}}`;
+}
+function UE(e) {
+	return `{${e}.full}`;
 }
-function VE(e) {
-	return BE(e.alias);
+function WE(e) {
+	let t = e.alias;
+	return [
+		{
+			id: `${t}.value`,
+			label: `${t} · value`,
+			token: HE(t, "value"),
+			kind: "value"
+		},
+		{
+			id: `${t}.unit`,
+			label: `${t} · unit`,
+			token: HE(t, "unit"),
+			kind: "unit"
+		},
+		{
+			id: `${t}.full`,
+			label: `${t} · value+unit`,
+			token: UE(t),
+			kind: "full"
+		}
+	];
 }
-function HE(e, t, n) {
+function GE(e, t, n) {
 	return e.replaceAll(t, n);
 }
-function UE(e, t, n = "b") {
+function KE(e, t, n = "b") {
 	let r = e.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "").replace(/^(\d)/, "a$1").slice(0, 24), i = r.length > 0 ? r : n;
 	if (!t.has(i)) return i;
 	for (let e = 2; e < 1e3; e += 1) {
@@ -23904,51 +23964,14 @@ function UE(e, t, n = "b") {
 	return `${n}${Date.now().toString(36)}`;
 }
 //#endregion
-//#region src/unit-display.ts
-function WE(e, t, n) {
-	let r = t === void 0 ? void 0 : F(t), i = n === void 0 ? void 0 : F(n);
-	if (r === void 0 || i === void 0 || r === i) return {
-		value: e,
-		unit: i ?? r ?? ""
-	};
-	let a = ye(e, r, i);
-	return a === void 0 ? {
-		value: e,
-		unit: r
-	} : {
-		value: a,
-		unit: i
-	};
-}
-function GE(e, t) {
-	if (typeof e != "object" || !e || Array.isArray(e)) return;
-	let n = { ...e }, r = t.split(".");
-	if (r.length >= 1) {
-		let e = n;
-		for (let t of r.slice(0, -1)) {
-			if (typeof e != "object" || !e || Array.isArray(e)) {
-				e = void 0;
-				break;
-			}
-			e = { ...e }[t];
-		}
-		if (typeof e == "object" && e && !Array.isArray(e)) {
-			let t = { ...e }.unit;
-			if (typeof t == "string" && t.length > 0) return t;
-		}
-	}
-	let i = n.unit;
-	return typeof i == "string" && i.length > 0 ? i : void 0;
-}
-//#endregion
 //#region src/named-template-render.ts
-function KE(e, t, n) {
+function qE(e, t, n) {
 	if (n === "value") return e;
 	if (n === "unit") return t;
 	let r = e.trim(), i = t.trim();
 	return r === "" ? i : i === "" ? r : `${r} ${i}`;
 }
-function qE(e, t) {
+function JE(e, t) {
 	let n = e.pick.deviceId, r = t.stateByDevice.get(n);
 	if (r === void 0) return { reason: `no state mirrored for device ${n}` };
 	let i = r[e.capName];
@@ -23957,61 +23980,56 @@ function qE(e, t) {
 	if (a === void 0) return { reason: `"${e.capName}.${e.valuePath}" is absent on device ${n}` };
 	let o, s = "";
 	if (typeof a == "number") {
-		let t = WE(a, GE(i, e.valuePath), e.displayUnit);
-		o = zE(t.value, e.maxDecimals), s = t.unit;
+		let t = xE(a, SE(i, e.valuePath), e.displayUnit);
+		o = VE(t.value, e.maxDecimals), s = t.unit;
 	} else o = typeof a == "boolean" ? a ? "ON" : "OFF" : a === null ? "" : String(a);
 	return {
 		value: o,
 		unit: s,
-		formatted: KE(o, s, e.format)
+		formatted: qE(o, s, "full")
 	};
 }
-function JE(e, t) {
+function YE(e, t, n) {
+	let r = e;
+	return r = GE(r, UE(t), n.formatted), r = GE(r, HE(t, "value"), n.value), r = GE(r, HE(t, "unit"), n.unit), r = GE(r, HE(t, "full"), n.formatted), r;
+}
+function XE(e, t) {
 	let n = e.parser;
 	if (e.bindings.length === 0) return n.trim() === "" ? { reason: `template "${e.id}" has no bindings` } : { text: n };
 	for (let r of e.bindings) {
-		let e = qE(r, t);
+		let e = JE(r, t);
 		if ("reason" in e) return e;
-		n = HE(n, BE(r.alias), e.formatted);
+		n = YE(n, r.alias, e);
 	}
 	return { text: n };
 }
 //#endregion
 //#region src/template-id.ts
-function YE() {
+function ZE() {
 	return typeof crypto < "u" && typeof crypto.randomUUID == "function" ? crypto.randomUUID() : `tpl-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 10)}`;
 }
 //#endregion
 //#region src/components/TemplatesPanel.tsx
 t();
-var XE = [
-	{
-		value: "value+unit",
-		label: "Value + unit"
-	},
-	{
-		value: "value",
-		label: "Value"
-	},
-	{
-		value: "unit",
-		label: "Unit"
-	}
-];
-function ZE(e) {
-	if (e === void 0) return;
-	let t = F(e);
-	return t === void 0 ? void 0 : L(t);
-}
-function QE(e) {
-	return e.pick.containerId ?? e.pick.deviceId;
-}
+var QE = 0;
 function $E(e, t) {
 	let n = /* @__PURE__ */ new Set();
 	for (let r = 0; r < e.length; r += 1) r !== t && n.add(e[r].alias);
 	return n;
 }
-function eD() {
+function eD(e) {
+	return {
+		alias: KE("sensor", e),
+		pick: { deviceId: QE },
+		capName: "",
+		valuePath: "",
+		maxDecimals: 1
+	};
+}
+function tD(e) {
+	return e.pick.deviceId > 0 && e.capName !== "" && e.valuePath !== "" && e.alias !== "";
+}
+function nD() {
 	let e = Ei({}), t = pi({ projection: "slim" }), n = Di(), r = Oi(), [i, o] = a(null), s = l(() => _E(t.data ?? []), [t.data]), c = t.isError ? "failed" : t.isSuccess ? "answered" : "pending", u = e.error ?? n.error ?? r.error;
 	return /* @__PURE__ */ j("div", {
 		className: "space-y-4",
@@ -24024,13 +24042,13 @@ function eD() {
 					children: "Named templates"
 				}), /* @__PURE__ */ A("p", {
 					className: "text-xs text-foreground-muted mt-0.5",
-					children: "Combine sensors into one overlay string via alias bindings. Slot kind Template picks one of these by id."
+					children: "Combine sensors into one overlay string via alias bindings. Each binding picks its own device (a container may contribute more than one child). Slot kind Template picks one of these by id."
 				})] }), /* @__PURE__ */ A(G, {
 					type: "button",
 					size: "sm",
 					"data-testid": "osd-template-new",
 					onClick: () => o({
-						id: YE(),
+						id: ZE(),
 						name: "New template",
 						bindings: [],
 						parser: ""
@@ -24087,7 +24105,7 @@ function eD() {
 					})]
 				}, t.id))
 			}),
-			i !== null && /* @__PURE__ */ A(tD, {
+			i !== null && /* @__PURE__ */ A(rD, {
 				draft: i,
 				pickerDevices: s,
 				listState: c,
@@ -24101,15 +24119,11 @@ function eD() {
 		]
 	});
 }
-function tD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, onCancel: o, onSave: s }) {
-	let c = t.find((e) => !gE(e.type))?.id ?? 0, u = yi({ deviceId: c }, { enabled: c > 0 }).data?.sources ?? [], d = l(() => new Set(u.map((e) => e.deviceId)), [u]), [f, p] = a([]), m = l(() => {
-		let t = e.bindings.map(QE);
-		return [...new Set([...t, ...f])];
-	}, [e.bindings, f]), h = l(() => e.bindings.map((e) => ({
-		id: e.alias,
-		label: `{${e.alias}}`,
-		token: VE(e)
-	})), [e.bindings]), g = rD(e.bindings), _ = l(() => JE(e, { stateByDevice: g }), [e, g]), v = e.name.trim().length > 0 && f.length === 0 && e.bindings.every((e) => e.capName !== "" && e.valuePath !== "" && e.alias !== "");
+function rD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, onCancel: a, onSave: o }) {
+	let s = t.find((e) => !gE(e.type))?.id ?? 0, c = yi({ deviceId: s }, { enabled: s > 0 }).data?.sources ?? [], u = l(() => e.bindings.filter(tD).flatMap((e) => WE(e)), [e.bindings]), d = aD(e.bindings), f = l(() => XE({
+		...e,
+		bindings: e.bindings.filter(tD)
+	}, { stateByDevice: d }), [e, d]), p = e.name.trim().length > 0 && e.bindings.every(tD);
 	return /* @__PURE__ */ j(xo, {
 		className: "p-4 space-y-3",
 		"data-testid": "osd-template-editor",
@@ -24127,121 +24141,48 @@ function tD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, on
 					name: t.target.value
 				})
 			})] }),
-			/* @__PURE__ */ j("div", { children: [
-				/* @__PURE__ */ A(K, { children: "Devices" }),
-				/* @__PURE__ */ A(vT, {
-					devices: t,
-					listState: n,
-					value: m,
-					onChange: (n) => {
-						let r = new Set(n), a = e.bindings.filter((e) => r.has(QE(e))), o = new Set(a.map(QE)), s = [], c = [], l = $E(a);
-						for (let e of n) {
-							if (o.has(e) || f.includes(e)) {
-								f.includes(e) && r.has(e) && s.push(e);
-								continue;
-							}
-							let n = yE(t, e);
-							if (n === void 0) continue;
-							if (gE(n.type)) {
-								s.push(e);
-								continue;
-							}
-							if (!d.has(e)) continue;
-							let i = dE(u, e), a = i.auto ?? fE(i.fields);
-							if (a === void 0) continue;
-							let p = UE(n.name || a.valuePath, l);
-							l.add(p), c.push({
-								alias: p,
-								pick: { deviceId: e },
-								capName: a.capName,
-								valuePath: a.valuePath,
-								format: "value+unit",
-								maxDecimals: 1
-							});
-						}
-						for (let e of f) r.has(e) && !s.includes(e) && !o.has(e) && s.push(e);
-						p(s), i({
-							...e,
-							bindings: [...a, ...c]
-						});
-					},
-					noun: "device",
-					testId: "osd-tpl-devices"
-				}),
-				/* @__PURE__ */ A("p", {
-					className: "text-[10px] text-foreground-muted mt-1",
-					children: "Containers are allowed — pick an OSD-supported child next."
-				})
-			] }),
-			f.map((n) => {
-				let r = yE(t, n), a = vE(n, t, d);
-				return /* @__PURE__ */ j("div", {
-					className: "rounded border border-border p-2 space-y-2",
-					"data-testid": `osd-tpl-pending-container-${n}`,
-					children: [
-						/* @__PURE__ */ j("p", {
+			/* @__PURE__ */ j("div", {
+				className: "space-y-2",
+				children: [
+					/* @__PURE__ */ j("div", {
+						className: "flex items-center justify-between gap-2",
+						children: [/* @__PURE__ */ A("p", {
 							className: "text-xs font-medium text-foreground",
-							children: [r?.name ?? `#${n}`, " — pick a child"]
-						}),
-						a.length === 0 ? /* @__PURE__ */ A("p", {
-							className: "text-xs text-foreground-muted",
-							children: "No OSD-supported children on this container."
-						}) : /* @__PURE__ */ A(po, {
-							"data-testid": `osd-tpl-child-${n}`,
-							value: "",
-							options: [{
-								value: "",
-								label: "Select child…"
-							}, ...a.map((e) => ({
-								value: String(e.id),
-								label: e.name
-							}))],
-							onChange: (r) => {
-								let a = Number(r.target.value);
-								if (!Number.isFinite(a) || a <= 0) return;
-								let o = yE(t, a), s = dE(u, a), c = s.auto ?? fE(s.fields);
-								if (c === void 0) return;
-								let l = $E(e.bindings), d = UE(o?.name ?? c.valuePath, l);
-								p(f.filter((e) => e !== n)), i({
-									...e,
-									bindings: [...e.bindings, {
-										alias: d,
-										pick: {
-											containerId: n,
-											deviceId: a
-										},
-										capName: c.capName,
-										valuePath: c.valuePath,
-										format: "value+unit",
-										maxDecimals: 1
-									}]
-								});
-							}
-						}),
-						/* @__PURE__ */ A(G, {
+							children: "Bindings"
+						}), /* @__PURE__ */ A(G, {
 							type: "button",
 							size: "sm",
-							variant: "ghost",
-							onClick: () => p(f.filter((e) => e !== n)),
-							children: "Cancel"
-						})
-					]
-				}, `pending-${n}`);
-			}),
-			e.bindings.length > 0 && /* @__PURE__ */ j("div", {
-				className: "space-y-2",
-				children: [/* @__PURE__ */ A("p", {
-					className: "text-xs font-medium text-foreground",
-					children: "Bindings"
-				}), e.bindings.map((n, r) => /* @__PURE__ */ A(nD, {
-					binding: n,
-					index: r,
-					draft: e,
-					pickerDevices: t,
-					sources: u,
-					stateByDevice: g,
-					onChange: i
-				}, `${n.alias}-${r}`))]
+							variant: "secondary",
+							"data-testid": "osd-tpl-add-binding",
+							onClick: () => {
+								let t = $E(e.bindings);
+								i({
+									...e,
+									bindings: [...e.bindings, eD(t)]
+								});
+							},
+							children: "Add binding"
+						})]
+					}),
+					/* @__PURE__ */ A("p", {
+						className: "text-[10px] text-foreground-muted",
+						children: "Each binding picks device → child (if a container) → field. The same container can appear on more than one binding."
+					}),
+					e.bindings.length === 0 && /* @__PURE__ */ A("p", {
+						className: "text-xs text-foreground-muted",
+						children: "No bindings yet — add one to start."
+					}),
+					e.bindings.map((r, a) => /* @__PURE__ */ A(iD, {
+						binding: r,
+						index: a,
+						draft: e,
+						pickerDevices: t,
+						listState: n,
+						sources: c,
+						stateByDevice: d,
+						onChange: i
+					}, `binding-${a}`))
+				]
 			}),
 			/* @__PURE__ */ A(AT, {
 				label: "Parser",
@@ -24250,9 +24191,9 @@ function tD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, on
 					...e,
 					parser: t
 				}),
-				chips: h,
+				chips: u,
 				multiline: !0,
-				placeholder: "e.g. {t} / {h}",
+				placeholder: "e.g. {t.value} {t.unit} / {h.full}",
 				testId: "osd-tpl-parser",
 				maxLength: 256
 			}),
@@ -24262,12 +24203,12 @@ function tD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, on
 				children: [/* @__PURE__ */ A("p", {
 					className: "text-[10px] uppercase tracking-wide text-foreground-muted",
 					children: "Live preview"
-				}), "text" in _ ? /* @__PURE__ */ A("p", {
+				}), "text" in f ? /* @__PURE__ */ A("p", {
 					className: "text-sm font-mono text-foreground mt-0.5",
-					children: _.text === "" ? "(empty)" : _.text
+					children: f.text === "" ? "(empty)" : f.text
 				}) : /* @__PURE__ */ A("p", {
 					className: "text-xs text-foreground-muted mt-0.5",
-					children: _.reason
+					children: f.reason
 				})]
 			}),
 			/* @__PURE__ */ j("div", {
@@ -24275,39 +24216,128 @@ function tD({ draft: e, pickerDevices: t, listState: n, busy: r, onChange: i, on
 				children: [/* @__PURE__ */ A(G, {
 					type: "button",
 					size: "sm",
-					disabled: r || !v,
-					onClick: () => void s(),
+					disabled: r || !p,
+					onClick: () => void o(),
 					children: "Save template"
 				}), /* @__PURE__ */ A(G, {
 					type: "button",
 					size: "sm",
 					variant: "ghost",
-					onClick: o,
+					onClick: a,
 					children: "Cancel"
 				})]
 			})
 		]
 	});
 }
-function nD({ binding: e, index: t, draft: n, pickerDevices: r, sources: i, stateByDevice: a, onChange: o }) {
-	let s = dE(i, e.pick.deviceId), c = yE(r, e.pick.deviceId), l = e.pick.containerId === void 0 ? void 0 : yE(r, e.pick.containerId), u = l === void 0 ? c?.name ?? `#${e.pick.deviceId}` : `${l.name} › ${c?.name ?? `#${e.pick.deviceId}`}`, d = qE(e, { stateByDevice: a }), f = (e) => {
-		o({
+function iD({ binding: e, index: t, draft: n, pickerDevices: r, listState: i, sources: o, stateByDevice: s, onChange: c }) {
+	let u = l(() => new Set(o.map((e) => e.deviceId)), [o]), [d, f] = a(e.pick.containerId);
+	m(() => {
+		f(e.pick.containerId);
+	}, [e.pick.containerId, e.pick.deviceId]);
+	let p = e.pick.deviceId > 0 ? e.pick.deviceId : void 0, h = d ?? p, g = d !== void 0 && gE(yE(r, d)?.type) ? d : void 0, _ = g === void 0 ? [] : vE(g, r, u), v = p === void 0 ? void 0 : dE(o, p), y = p === void 0 ? void 0 : yE(r, p), b = e.pick.containerId === void 0 ? void 0 : yE(r, e.pick.containerId), x = g !== void 0 && p === void 0 ? `${yE(r, g)?.name ?? `#${g}`} › …` : b === void 0 ? y?.name ?? (p === void 0 ? "No device" : `#${e.pick.deviceId}`) : `${b.name} › ${y?.name ?? `#${e.pick.deviceId}`}`, S = tD(e) ? JE(e, { stateByDevice: s }) : { reason: "Pick a device and field" }, C = SE(p === void 0 ? void 0 : s.get(p)?.[e.capName], e.valuePath), w = bE(C), T = (e) => {
+		c({
 			...n,
 			bindings: n.bindings.map((n, r) => r === t ? e : n)
 		});
+	}, E = (i, a) => {
+		let s = dE(o, i), c = s.auto ?? fE(s.fields), l = yE(r, i), u = $E(n.bindings, t), d = e.alias !== "" && !u.has(e.alias) ? e.alias : KE(l?.name ?? c?.valuePath ?? "sensor", u);
+		T({
+			...e,
+			alias: d,
+			pick: a === void 0 ? { deviceId: i } : {
+				containerId: a,
+				deviceId: i
+			},
+			capName: c?.capName ?? "",
+			valuePath: c?.valuePath ?? ""
+		});
 	};
 	return /* @__PURE__ */ j("div", {
 		className: "rounded border border-border p-2 grid grid-cols-3 gap-2",
-		"data-testid": `osd-tpl-binding-${e.alias}`,
+		"data-testid": `osd-tpl-binding-${t}`,
 		children: [
 			/* @__PURE__ */ j("div", {
 				className: "col-span-3 flex items-center justify-between gap-2",
 				children: [/* @__PURE__ */ A("p", {
 					className: "text-[11px] text-foreground-muted truncate",
-					children: u
-				}), /* @__PURE__ */ A("p", {
+					children: x
+				}), e.alias !== "" && /* @__PURE__ */ j("p", {
 					className: "text-[10px] font-mono text-foreground-muted shrink-0",
-					children: BE(e.alias)
+					children: [
+						HE(e.alias),
+						" · ",
+						HE(e.alias, "value"),
+						" ·",
+						" ",
+						HE(e.alias, "unit")
+					]
+				})]
+			}),
+			/* @__PURE__ */ j("div", {
+				className: "col-span-3 space-y-2",
+				children: [
+					/* @__PURE__ */ A(K, { children: "Device" }),
+					/* @__PURE__ */ A(vT, {
+						devices: r,
+						listState: i,
+						value: h === void 0 ? [] : [h],
+						onChange: (t) => {
+							let n = t.length === 0 ? void 0 : t.length === 1 ? t[0] : t.find((e) => e !== h) ?? t[t.length - 1];
+							if (n === void 0) {
+								f(void 0), T({
+									...e,
+									pick: { deviceId: QE },
+									capName: "",
+									valuePath: ""
+								});
+								return;
+							}
+							let i = yE(r, n);
+							if (i !== void 0 && gE(i.type)) {
+								f(n), T({
+									...e,
+									pick: {
+										containerId: n,
+										deviceId: QE
+									},
+									capName: "",
+									valuePath: ""
+								});
+								return;
+							}
+							f(void 0), E(n, void 0);
+						},
+						noun: "device",
+						emptyLabel: "Pick a device",
+						testId: `osd-tpl-device-${t}`
+					}),
+					/* @__PURE__ */ A("p", {
+						className: "text-[10px] text-foreground-muted",
+						children: "Single selection for this binding. Containers are allowed — then pick a child."
+					})
+				]
+			}),
+			g !== void 0 && /* @__PURE__ */ j("div", {
+				className: "col-span-3",
+				"data-testid": `osd-tpl-child-pick-${t}`,
+				children: [/* @__PURE__ */ A(K, { children: "Child" }), _.length === 0 ? /* @__PURE__ */ A("p", {
+					className: "text-xs text-foreground-muted",
+					children: "No OSD-supported children on this container."
+				}) : /* @__PURE__ */ A(po, {
+					"data-testid": `osd-tpl-child-${t}`,
+					value: p === void 0 ? "" : String(p),
+					options: [{
+						value: "",
+						label: "Select child…"
+					}, ..._.map((e) => ({
+						value: String(e.id),
+						label: e.name
+					}))],
+					onChange: (e) => {
+						let t = Number(e.target.value);
+						!Number.isFinite(t) || t <= 0 || E(t, g);
+					}
 				})]
 			}),
 			/* @__PURE__ */ j("div", { children: [/* @__PURE__ */ A(K, { children: "Alias" }), /* @__PURE__ */ A(os, {
@@ -24316,23 +24346,28 @@ function nD({ binding: e, index: t, draft: n, pickerDevices: r, sources: i, stat
 				maxLength: 32,
 				onChange: (r) => {
 					let i = r.target.value, a = $E(n.bindings, t);
-					i !== "" && a.has(i) || f({
+					i !== "" && a.has(i) || T({
 						...e,
 						alias: i
 					});
 				}
 			})] }),
-			(s.mode === "pick" || s.mode === "auto") && /* @__PURE__ */ j("div", {
+			v !== void 0 && (v.mode === "pick" || v.mode === "auto") && /* @__PURE__ */ j("div", {
 				className: "col-span-2",
-				children: [/* @__PURE__ */ A(K, { children: "Field" }), /* @__PURE__ */ A(po, {
+				children: [/* @__PURE__ */ A(K, { children: "Field" }), v.mode === "auto" && v.auto !== void 0 ? /* @__PURE__ */ A("p", {
+					className: "text-xs text-foreground-muted mt-1.5",
+					"data-testid": `osd-tpl-field-auto-${t}`,
+					children: v.auto.label
+				}) : /* @__PURE__ */ A(po, {
+					"data-testid": `osd-tpl-field-${t}`,
 					value: `${e.capName}:${e.valuePath}`,
-					options: s.fields.map((e) => ({
+					options: v.fields.map((e) => ({
 						value: `${e.capName}:${e.valuePath}`,
 						label: e.label
 					})),
 					onChange: (t) => {
-						let n = s.fields.find((e) => `${e.capName}:${e.valuePath}` === t.target.value);
-						n && f({
+						let n = v.fields.find((e) => `${e.capName}:${e.valuePath}` === t.target.value);
+						n && T({
 							...e,
 							capName: n.capName,
 							valuePath: n.valuePath
@@ -24340,44 +24375,23 @@ function nD({ binding: e, index: t, draft: n, pickerDevices: r, sources: i, stat
 					}
 				})]
 			}),
-			/* @__PURE__ */ j("div", {
-				className: "col-span-3",
-				children: [/* @__PURE__ */ A(K, { children: "Format" }), /* @__PURE__ */ A("div", {
-					className: "flex gap-1 mt-1",
-					role: "radiogroup",
-					"aria-label": `Format for ${e.alias}`,
-					"data-testid": `osd-tpl-format-${t}`,
-					children: XE.map((t) => /* @__PURE__ */ A(G, {
-						type: "button",
-						size: "sm",
-						variant: e.format === t.value ? "primary" : "outline",
-						"aria-checked": e.format === t.value,
-						role: "radio",
-						onClick: () => f({
-							...e,
-							format: t.value
-						}),
-						children: t.label
-					}, t.value))
-				})]
-			}),
 			/* @__PURE__ */ j("div", { children: [/* @__PURE__ */ A(K, { children: "Unit" }), /* @__PURE__ */ A(ET, {
-				dimension: ZE(e.displayUnit),
+				dimension: w,
 				value: e.displayUnit ?? "",
-				onChange: (t) => f({
+				onChange: (t) => T({
 					...e,
 					displayUnit: t === "" ? void 0 : t
 				}),
 				inheritLabel: "Source",
-				emptyReason: "Pick a unit family via a known unit first",
-				"aria-label": `Unit for ${e.alias}`
+				emptyReason: C === void 0 ? "Source unit unknown (waiting for sensor state)" : "Source unit has no same-dimension conversions",
+				"aria-label": `Unit for ${e.alias || `binding ${t + 1}`}`
 			})] }),
 			/* @__PURE__ */ j("div", { children: [/* @__PURE__ */ A(K, { children: "Decimals" }), /* @__PURE__ */ A(os, {
 				type: "number",
 				min: 0,
 				max: 4,
 				value: e.maxDecimals,
-				onChange: (t) => f({
+				onChange: (t) => T({
 					...e,
 					maxDecimals: Number(t.target.value)
 				})
@@ -24388,7 +24402,8 @@ function nD({ binding: e, index: t, draft: n, pickerDevices: r, sources: i, stat
 					type: "button",
 					size: "sm",
 					variant: "ghost",
-					onClick: () => o({
+					"data-testid": `osd-tpl-remove-${t}`,
+					onClick: () => c({
 						...n,
 						bindings: n.bindings.filter((e, n) => n !== t)
 					}),
@@ -24398,16 +24413,16 @@ function nD({ binding: e, index: t, draft: n, pickerDevices: r, sources: i, stat
 			/* @__PURE__ */ A("p", {
 				className: "col-span-3 text-xs font-mono text-foreground",
 				"data-testid": `osd-tpl-live-${t}`,
-				children: "formatted" in d ? /* @__PURE__ */ j(M, { children: ["Live: ", d.formatted === "" ? "(empty)" : d.formatted] }) : /* @__PURE__ */ A("span", {
+				children: "formatted" in S ? /* @__PURE__ */ j(M, { children: ["Live: ", S.formatted === "" ? "(empty)" : S.formatted] }) : /* @__PURE__ */ A("span", {
 					className: "text-foreground-muted",
-					children: d.reason
+					children: S.reason
 				})
 			})
 		]
 	});
 }
-function rD(e) {
-	let t = l(() => new Set(e.map((e) => e.pick.deviceId)), [e]), n = _i({}, {
+function aD(e) {
+	let t = l(() => new Set(e.map((e) => e.pick.deviceId).filter((e) => e > 0)), [e]), n = _i({}, {
 		enabled: t.size > 0,
 		refetchInterval: 5e3
 	});
@@ -24424,7 +24439,7 @@ function rD(e) {
 //#endregion
 //#region src/page.tsx
 t();
-function iD(e) {
+function oD(e) {
 	let [t, n] = a("cameras"), r = pi({ projection: "slim" }), i = hi({}), o = Ei({}), s = l(() => (r.data ?? []).filter((e) => e.isCamera).map((e) => ({
 		id: e.id,
 		name: e.name
@@ -24471,7 +24486,7 @@ function iD(e) {
 			}) : null,
 			!h && t === "templates" ? /* @__PURE__ */ A(xo, {
 				className: "p-4",
-				children: /* @__PURE__ */ A(eD, {})
+				children: /* @__PURE__ */ A(nD, {})
 			}) : null,
 			!h && t === "cameras" && s.length === 0 ? /* @__PURE__ */ A("div", {
 				className: "text-xs text-foreground-subtle text-center py-16",
@@ -24480,7 +24495,7 @@ function iD(e) {
 			!h && t === "cameras" && s.length > 0 ? /* @__PURE__ */ A(xo, {
 				className: "p-4",
 				"data-testid": "osd-cameras",
-				children: /* @__PURE__ */ A(RE, {
+				children: /* @__PURE__ */ A(BE, {
 					cameras: s,
 					osdCapableIds: f,
 					allDevices: c,
@@ -24494,4 +24509,4 @@ function iD(e) {
 	});
 }
 //#endregion
-export { iD as default };
+export { oD as default };