@camstack/ui-library 1.1.45 → 1.1.46

package/dist/index.cjs

@@ -3775,7 +3775,6 @@ function mirror(input) {
 			}
 		}
 		const patch = {
-			enabled: srcCfg.enabled,
 			...chosenModelId ? { modelId: chosenModelId } : {},
 			settings: dropModelSpecific(srcCfg.settings, targetAddon)
 		};
@@ -13874,6 +13873,228 @@ function buildStepTreeFromSchema(schema) {
 	return [...roots, ...audioRoots];
 }
 //#endregion
+//#region src/composites/grouped-model-selector.tsx
+/**
+* GroupedModelSelector — the shared Family → Tier → Variant model picker.
+*
+* The catalog is a FLAT list of models (ids like `yolo26s`, `yolo26s-int8`);
+* this folds it into a `family → tier → variant` tree (see
+* `buildModelVariantGroups` in `@camstack/types`) so the operator picks
+* "YOLO26 → Small → Int8" instead of scanning a flat dropdown of every
+* size×quantization. The selected value stays the flat model id.
+*
+* Parameterised on the minimal `ModelVariantSource` shape so BOTH the config-UI
+* catalog (`ModelCatalogEntry`) and the pipeline/device steppers
+* (`PipelineModelOption`) drive the same component. Legacy / ungrouped models
+* never appear here (the grouping helpers skip them).
+*/
+function Chip({ active, onClick, disabled, children, title }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		onClick,
+		disabled,
+		title,
+		className: cn("rounded-full px-3 py-1 text-[11px] font-medium border transition-colors", active ? "border-primary bg-primary/10 text-primary" : "border-border bg-background text-foreground-subtle hover:text-foreground hover:border-foreground-subtle/40", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
+		children
+	});
+}
+function GroupedModelSelector({ catalog, value, onChange, disabled }) {
+	const families = (0, _camstack_types.buildModelVariantGroups)(catalog);
+	const current = (0, _camstack_types.describeModelVariant)(catalog, value);
+	const activeFamily = families.find((f) => f.family === current?.family)?.family ?? families[0]?.family ?? "";
+	const family = families.find((f) => f.family === activeFamily) ?? families[0];
+	if (!family) return null;
+	const activeTier = family.tiers.find((t) => t.tier === current?.tier)?.tier ?? family.tiers[0]?.tier ?? "";
+	const tier = family.tiers.find((t) => t.tier === activeTier) ?? family.tiers[0];
+	if (!tier) return null;
+	const resolutions = [...new Set(tier.options.map((o) => o.resolution))].sort((a, b) => (b ?? Infinity) - (a ?? Infinity));
+	const selectedResolution = resolutions.includes(current?.resolution) ? current?.resolution : resolutions[0];
+	const variantOptions = tier.options.filter((o) => o.resolution === selectedResolution);
+	const resLabel = (r) => r === void 0 ? "640 · native" : `${r}`;
+	const selectTier = (tierId) => {
+		const t = family.tiers.find((x) => x.tier === tierId);
+		if (!t) return;
+		onChange((t.options.find((o) => o.precision === (current?.precision ?? "fp32") && o.optimization === (current?.optimization ?? "standard") && o.resolution === current?.resolution) ?? t.options[0]).modelId);
+	};
+	const selectResolution = (resolution) => {
+		const opts = tier.options.filter((o) => o.resolution === resolution);
+		const pick = opts.find((o) => o.precision === (current?.precision ?? "fp32") && o.optimization === (current?.optimization ?? "standard")) ?? opts[0];
+		if (pick) onChange(pick.modelId);
+	};
+	const selectVariant = (opt) => {
+		const id = (0, _camstack_types.resolveVariantModelId)(catalog, {
+			family: family.family,
+			tier: tier.tier,
+			precision: opt.precision,
+			optimization: opt.optimization,
+			resolution: opt.resolution
+		});
+		if (id) onChange(id);
+	};
+	const selectedOption = tier.options.find((o) => o.modelId === value) ?? null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-3",
+		children: [
+			families.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
+				children: "Family"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap gap-1.5",
+				children: families.map((f) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
+					active: f.family === family.family,
+					disabled,
+					onClick: () => onChange(f.tiers[0]?.baseModelId ?? ""),
+					children: f.label
+				}, f.family))
+			})] }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
+				children: [family.label, " — size"]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "grid grid-cols-2 gap-1.5 sm:grid-cols-4",
+				children: family.tiers.map((t) => {
+					const active = t.tier === tier.tier;
+					const base = t.options.find((o) => o.modelId === t.baseModelId) ?? t.options[0];
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						disabled,
+						onClick: () => selectTier(t.tier),
+						className: cn("rounded-lg border px-2 py-2 text-left transition-all", active ? "border-primary bg-primary/5 ring-1 ring-primary/30" : "border-border bg-background hover:border-foreground-subtle/40", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center gap-1",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "text-xs font-semibold text-foreground",
+								children: t.label
+							}), active && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, { className: "h-3 w-3 text-primary" })]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "text-[10px] text-foreground-subtle",
+							children: [
+								"~",
+								base?.sizeMB ?? 0,
+								" MB"
+							]
+						})]
+					}, t.tier);
+				})
+			})] }),
+			resolutions.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
+				children: "Resolution"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap gap-1.5",
+				children: resolutions.map((r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
+					active: r === selectedResolution,
+					disabled,
+					title: r === void 0 ? "native (best accuracy)" : `${r}×${r} (faster)`,
+					onClick: () => selectResolution(r),
+					children: resLabel(r)
+				}, r ?? "native"))
+			})] }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
+				children: "Variant"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap gap-1.5",
+				children: variantOptions.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
+					active: opt.modelId === value,
+					disabled,
+					title: `${opt.formats.join(", ")} · ~${opt.sizeMB} MB`,
+					onClick: () => selectVariant(opt),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "inline-flex items-center gap-1",
+						children: [opt.optimization === "fast" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Zap, { className: "h-3 w-3" }), opt.label]
+					})
+				}, opt.modelId))
+			})] }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center gap-2 text-[10px] text-foreground-subtle pt-0.5",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Cpu, { className: "h-3 w-3" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "font-mono",
+						children: value || "—"
+					}),
+					selectedOption && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
+						"· ",
+						selectedOption.formats.join(", "),
+						" · ~",
+						selectedOption.sizeMB,
+						" MB"
+					] })
+				]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/composites/model-picker.tsx
+/**
+* Shared model picker — the ONE model-selection control across the app.
+*
+* Renders the grouped Family→Tier→Resolution→Variant selector
+* ({@link GroupedModelSelector}) when the step's models declare variant groups
+* (yolo26 / yolov9 …), else a flat `<select>` (face / plate / classifier
+* catalogs and operator-registered custom models). Custom / ungrouped ids stay
+* selectable via an "Other models" flat select alongside the grouped picker, and
+* a legacy/removed pin is surfaced with an explicit banner rather than a
+* silently mis-highlighted chip.
+*
+* Used by the pipeline stepper (`PipelineStep`), the agent/device step editor
+* (`AgentStepEditor`), and the benchmark — so the picker looks identical
+* everywhere. `value === ''` renders nothing selected (callers that support an
+* "Auto / node default" mode own that affordance and hide this picker while it
+* is active).
+*/
+function ModelPicker({ models, value, onChange, disabled }) {
+	const hasGroups = (0, react$1.useMemo)(() => (0, _camstack_types.buildModelVariantGroups)(models).length > 0, [models]);
+	const ungrouped = (0, react$1.useMemo)(() => models.filter((m) => m.group === void 0), [models]);
+	const unresolvedBanner = value !== "" && !models.some((m) => m.id === value) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "rounded border border-amber-500/40 bg-amber-500/10 px-2 py-1.5 text-[10px] text-amber-300",
+		children: [
+			"Current pin (",
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "font-mono",
+				children: value
+			}),
+			") is a legacy/removed model — no longer offered below. Pick a replacement to change it; Save persists whatever is selected here."
+		]
+	});
+	const flatSelect = (opts, selectPlaceholder) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+		disabled,
+		className: "w-full bg-surface border border-border rounded px-2 py-1 text-xs disabled:opacity-50",
+		value: opts.some((m) => m.id === value) ? value : "",
+		onChange: (e) => onChange(e.target.value),
+		children: [selectPlaceholder !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+			value: "",
+			disabled: true,
+			children: selectPlaceholder
+		}), opts.map((m) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+			value: m.id,
+			children: m.name
+		}, m.id))]
+	});
+	if (!hasGroups) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-2",
+		children: [unresolvedBanner, flatSelect(models)]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-3",
+		children: [
+			unresolvedBanner,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupedModelSelector, {
+				catalog: models,
+				value,
+				onChange,
+				disabled
+			}),
+			ungrouped.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "text-[10px] uppercase tracking-widest text-foreground-subtle mb-1",
+				children: "Other models"
+			}), flatSelect(ungrouped, "— custom / ungrouped model —")] })
+		]
+	});
+}
+//#endregion
 //#region src/composites/pipeline-step.tsx
 /**
 * PipelineStep — single step card in the pipeline builder.
@@ -13883,11 +14104,7 @@ function buildStepTreeFromSchema(schema) {
 * (Model → Confidence), children recursively.
 */
 function modelsForStep(schema) {
-	if (!schema) return [];
-	return schema.models.map((m) => ({
-		id: m.id,
-		name: m.name
-	}));
+	return schema?.models ?? [];
 }
 function PipelineStep({ step, schema, allSchemas: _allSchemas, depth: _depth = 0, onChange, onDelete: _onDelete, readOnly = false, toggleMode = "simple", overrideState = null, onOverrideChange, inheritedEnabled, hideModelAndSettings = false, allowAutoModel = false }) {
 	const [expanded, setExpanded] = (0, react$1.useState)(false);
@@ -13978,21 +14195,35 @@ function PipelineStep({ step, schema, allSchemas: _allSchemas, depth: _depth = 0
 			children: "Model and detection settings are managed per agent — open the Pipeline page for this camera's agent to edit them."
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "space-y-3",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfigSelect, {
-				label: "Model",
-				value: step.modelId,
-				disabled: readOnly,
-				options: [...allowAutoModel ? [{
-					value: "",
-					label: "Auto (node default)"
-				}] : [], ...models.map((m) => ({
-					value: m.id,
-					label: m.name
-				}))],
-				onChange: (v) => onChange({
-					...step,
-					modelId: v
-				})
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "space-y-2",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+						className: "block text-[10px] font-medium text-foreground-subtle uppercase tracking-wide",
+						children: "Model"
+					}),
+					allowAutoModel && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+						className: "flex items-center gap-2 text-[11px] text-foreground-subtle",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							type: "checkbox",
+							checked: isAutoSentinel,
+							disabled: readOnly,
+							onChange: (e) => onChange({
+								...step,
+								modelId: e.target.checked ? "" : schema?.defaultModelId ?? models[0]?.id ?? ""
+							})
+						}), "Auto (node default)"]
+					}),
+					!isAutoSentinel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelPicker, {
+						models,
+						value: step.modelId,
+						disabled: readOnly,
+						onChange: (id) => onChange({
+							...step,
+							modelId: id
+						})
+					})
+				]
 			}), schema?.configSchema?.map((field) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfigSchemaField, {
 				field,
 				allFields: schema.configSchema ?? [],
@@ -14198,218 +14429,7 @@ function ThreeStateButton({ label, active, variant, subtext, onClick }) {
 	});
 }
 //#endregion
-//#region src/composites/grouped-model-selector.tsx
-/**
-* GroupedModelSelector — the shared Family → Tier → Variant model picker.
-*
-* The catalog is a FLAT list of models (ids like `yolo26s`, `yolo26s-int8`);
-* this folds it into a `family → tier → variant` tree (see
-* `buildModelVariantGroups` in `@camstack/types`) so the operator picks
-* "YOLO26 → Small → Int8" instead of scanning a flat dropdown of every
-* size×quantization. The selected value stays the flat model id.
-*
-* Parameterised on the minimal `ModelVariantSource` shape so BOTH the config-UI
-* catalog (`ModelCatalogEntry`) and the pipeline/device steppers
-* (`PipelineModelOption`) drive the same component. Legacy / ungrouped models
-* never appear here (the grouping helpers skip them).
-*/
-function Chip({ active, onClick, disabled, children, title }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		type: "button",
-		onClick,
-		disabled,
-		title,
-		className: cn("rounded-full px-3 py-1 text-[11px] font-medium border transition-colors", active ? "border-primary bg-primary/10 text-primary" : "border-border bg-background text-foreground-subtle hover:text-foreground hover:border-foreground-subtle/40", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
-		children
-	});
-}
-function GroupedModelSelector({ catalog, value, onChange, disabled }) {
-	const families = (0, _camstack_types.buildModelVariantGroups)(catalog);
-	const current = (0, _camstack_types.describeModelVariant)(catalog, value);
-	const activeFamily = families.find((f) => f.family === current?.family)?.family ?? families[0]?.family ?? "";
-	const family = families.find((f) => f.family === activeFamily) ?? families[0];
-	if (!family) return null;
-	const activeTier = family.tiers.find((t) => t.tier === current?.tier)?.tier ?? family.tiers[0]?.tier ?? "";
-	const tier = family.tiers.find((t) => t.tier === activeTier) ?? family.tiers[0];
-	if (!tier) return null;
-	const resolutions = [...new Set(tier.options.map((o) => o.resolution))].sort((a, b) => (b ?? Infinity) - (a ?? Infinity));
-	const selectedResolution = resolutions.includes(current?.resolution) ? current?.resolution : resolutions[0];
-	const variantOptions = tier.options.filter((o) => o.resolution === selectedResolution);
-	const resLabel = (r) => r === void 0 ? "640 · native" : `${r}`;
-	const selectTier = (tierId) => {
-		const t = family.tiers.find((x) => x.tier === tierId);
-		if (!t) return;
-		onChange((t.options.find((o) => o.precision === (current?.precision ?? "fp32") && o.optimization === (current?.optimization ?? "standard") && o.resolution === current?.resolution) ?? t.options[0]).modelId);
-	};
-	const selectResolution = (resolution) => {
-		const opts = tier.options.filter((o) => o.resolution === resolution);
-		const pick = opts.find((o) => o.precision === (current?.precision ?? "fp32") && o.optimization === (current?.optimization ?? "standard")) ?? opts[0];
-		if (pick) onChange(pick.modelId);
-	};
-	const selectVariant = (opt) => {
-		const id = (0, _camstack_types.resolveVariantModelId)(catalog, {
-			family: family.family,
-			tier: tier.tier,
-			precision: opt.precision,
-			optimization: opt.optimization,
-			resolution: opt.resolution
-		});
-		if (id) onChange(id);
-	};
-	const selectedOption = tier.options.find((o) => o.modelId === value) ?? null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "space-y-3",
-		children: [
-			families.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
-				children: "Family"
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "flex flex-wrap gap-1.5",
-				children: families.map((f) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
-					active: f.family === family.family,
-					disabled,
-					onClick: () => onChange(f.tiers[0]?.baseModelId ?? ""),
-					children: f.label
-				}, f.family))
-			})] }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
-				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
-				children: [family.label, " — size"]
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "grid grid-cols-2 gap-1.5 sm:grid-cols-4",
-				children: family.tiers.map((t) => {
-					const active = t.tier === tier.tier;
-					const base = t.options.find((o) => o.modelId === t.baseModelId) ?? t.options[0];
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-						type: "button",
-						disabled,
-						onClick: () => selectTier(t.tier),
-						className: cn("rounded-lg border px-2 py-2 text-left transition-all", active ? "border-primary bg-primary/5 ring-1 ring-primary/30" : "border-border bg-background hover:border-foreground-subtle/40", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: "flex items-center gap-1",
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-								className: "text-xs font-semibold text-foreground",
-								children: t.label
-							}), active && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, { className: "h-3 w-3 text-primary" })]
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-							className: "text-[10px] text-foreground-subtle",
-							children: [
-								"~",
-								base?.sizeMB ?? 0,
-								" MB"
-							]
-						})]
-					}, t.tier);
-				})
-			})] }),
-			resolutions.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
-				children: "Resolution"
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "flex flex-wrap gap-1.5",
-				children: resolutions.map((r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
-					active: r === selectedResolution,
-					disabled,
-					title: r === void 0 ? "native (best accuracy)" : `${r}×${r} (faster)`,
-					onClick: () => selectResolution(r),
-					children: resLabel(r)
-				}, r ?? "native"))
-			})] }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-[10px] uppercase tracking-wide text-foreground-subtle mb-1.5",
-				children: "Variant"
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "flex flex-wrap gap-1.5",
-				children: variantOptions.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chip, {
-					active: opt.modelId === value,
-					disabled,
-					title: `${opt.formats.join(", ")} · ~${opt.sizeMB} MB`,
-					onClick: () => selectVariant(opt),
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-						className: "inline-flex items-center gap-1",
-						children: [opt.optimization === "fast" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Zap, { className: "h-3 w-3" }), opt.label]
-					})
-				}, opt.modelId))
-			})] }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "flex items-center gap-2 text-[10px] text-foreground-subtle pt-0.5",
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Cpu, { className: "h-3 w-3" }),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: "font-mono",
-						children: value || "—"
-					}),
-					selectedOption && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
-						"· ",
-						selectedOption.formats.join(", "),
-						" · ~",
-						selectedOption.sizeMB,
-						" MB"
-					] })
-				]
-			})
-		]
-	});
-}
-//#endregion
 //#region src/composites/agent-step-editor.tsx
-/**
-* Shared model picker for the step editor — renders the grouped
-* Family→Tier→Variant selector when the step's models declare variant groups
-* (yolo26 …), else a flat `<select>` (face / plate / classifier catalogs and
-* custom models). Same component both the agent-default and per-device-override
-* modes use, so the picker looks identical across the pipeline stepper, the
-* device stepper and the cluster matrix.
-*/
-function ModelPicker({ models, value, onChange, disabled }) {
-	const hasGroups = (0, react$1.useMemo)(() => (0, _camstack_types.buildModelVariantGroups)(models).length > 0, [models]);
-	const ungrouped = (0, react$1.useMemo)(() => models.filter((m) => m.group === void 0), [models]);
-	const unresolvedBanner = value !== "" && !models.some((m) => m.id === value) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "rounded border border-amber-500/40 bg-amber-500/10 px-2 py-1.5 text-[10px] text-amber-300",
-		children: [
-			"Current pin (",
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "font-mono",
-				children: value
-			}),
-			") is a legacy/removed model — no longer offered below. Pick a replacement to change it; Save persists whatever is selected here."
-		]
-	});
-	const flatSelect = (opts, selectPlaceholder) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
-		disabled,
-		className: "w-full bg-surface border border-border rounded px-2 py-1 text-xs disabled:opacity-50",
-		value: opts.some((m) => m.id === value) ? value : "",
-		onChange: (e) => onChange(e.target.value),
-		children: [selectPlaceholder !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-			value: "",
-			disabled: true,
-			children: selectPlaceholder
-		}), opts.map((m) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-			value: m.id,
-			children: m.name
-		}, m.id))]
-	});
-	if (!hasGroups) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "space-y-2",
-		children: [unresolvedBanner, flatSelect(models)]
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "space-y-3",
-		children: [
-			unresolvedBanner,
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupedModelSelector, {
-				catalog: models,
-				value,
-				onChange,
-				disabled
-			}),
-			ungrouped.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "text-[10px] uppercase tracking-widest text-foreground-subtle mb-1",
-				children: "Other models"
-			}), flatSelect(ungrouped, "— custom / ungrouped model —")] })
-		]
-	});
-}
 function buildDisplayStep(addon, cfg) {
 	return {
 		addonId: addon.id,
@@ -14469,14 +14489,14 @@ function DeviceModeEditor({ addon, agentDefault, agentNodeId, currentPatch, mode
 		onChangePatch?.(hasAnyField ? next : null);
 	};
 	const setModel = (modelId) => {
-		const { enabled: _enabled, modelId: _prev, ...rest } = currentPatch ?? {};
+		const { modelId: _prev, ...rest } = currentPatch ?? {};
 		commitPatch(modelId === void 0 ? rest : {
 			...rest,
 			modelId
 		});
 	};
 	const setSettings = (settings) => {
-		const { enabled: _enabled, settings: _prev, ...rest } = currentPatch ?? {};
+		const { settings: _prev, ...rest } = currentPatch ?? {};
 		commitPatch(settings === void 0 ? rest : {
 			...rest,
 			settings
@@ -14597,6 +14617,42 @@ function AgentStepEditor(props) {
 		onChangePatch
 	});
 }
+//#endregion
+//#region src/composites/pipeline-matrix-shared.tsx
+/**
+* Stable column identity. Plain per-node columns key by `agentNodeId` (so the
+* rendered `key` is byte-identical to the pre-C7.4 matrix); device sub-columns
+* disambiguate with their `deviceKey`. MUST be used everywhere a React `key`,
+* selection compare, or column identity is derived.
+*/
+function agentColumnKey(a) {
+	return a.deviceKey !== void 0 ? `${a.agentNodeId}::${a.deviceKey}` : a.agentNodeId;
+}
+/**
+* Coalesce CONSECUTIVE columns that share an `agentNodeId` into node groups.
+* Order-preserving: the flat column order is untouched, so body cells still map
+* 1:1 to `agents`. A run of length 1 is a plain (ungrouped) node header.
+*/
+function groupAgentColumns(agents) {
+	const groups = [];
+	for (const col of agents) {
+		const last = groups[groups.length - 1];
+		if (last && last.agentNodeId === col.agentNodeId) {
+			const columns = [...last.columns, col];
+			groups[groups.length - 1] = {
+				...last,
+				columns,
+				grouped: columns.length > 1
+			};
+		} else groups.push({
+			agentNodeId: col.agentNodeId,
+			engineLabel: col.engineLabel,
+			columns: [col],
+			grouped: false
+		});
+	}
+	return groups;
+}
 function flattenTree(nodes) {
 	const out = [];
 	const walk = (list, depth) => {
@@ -14675,6 +14731,41 @@ function ClassChips({ inputs, outputs }) {
 		]
 	});
 }
+/**
+* Grouped node header (C7.4): a node super-label spanning its device
+* sub-columns, with a per-device sub-label row beneath. Rendered ONLY for a
+* node expanded into 2+ device sub-columns; a single plain column keeps each
+* matrix's own byte-identical single-header markup. The spanning cell uses
+* `gridColumn: span N` so it aligns to its N body columns; the inner flex row
+* gives each device its own equal-width, padded sub-label slot.
+*/
+function GroupedAgentHeader({ group }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "sticky top-0 z-10 min-w-0 border-b border-l border-border bg-muted/60",
+		style: { gridColumn: `span ${group.columns.length}` },
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "truncate px-3 pt-2 text-xs font-semibold text-foreground",
+				children: group.agentNodeId
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "truncate px-3 text-[10px] text-foreground-subtle",
+				children: group.engineLabel
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mt-1 flex border-t border-border/50",
+				children: group.columns.map((c, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: cn("min-w-0 flex-1 px-3 py-1", i > 0 && "border-l border-border/50"),
+					title: c.deviceLabel ?? c.deviceKey,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "truncate text-[10px] font-medium text-foreground/90",
+						children: c.deviceLabel ?? c.deviceKey
+					})
+				}, agentColumnKey(c)))
+			})
+		]
+	});
+}
 /** Step label (slot heading + addon name + class chips), shared by both views. */
 function StepLabel({ node }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -14777,13 +14868,13 @@ function GridRow({ node, depth, agents, getCellState, onCellClick, selectedCell,
 			})
 		})]
 	}), agents.map((a) => {
-		const state = getCellState(node.addonId, a.agentNodeId);
+		const state = getCellState(node.addonId, a);
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 			type: "button",
-			onClick: () => onCellClick(node.addonId, a.agentNodeId),
-			className: cellButtonClass(state, selectedCell?.addonId === node.addonId && selectedCell.agentNodeId === a.agentNodeId, "min-w-0 overflow-hidden px-3 py-1.5 border-b border-l border-border"),
+			onClick: () => onCellClick(node.addonId, a),
+			className: cellButtonClass(state, selectedCell !== null && selectedCell.addonId === node.addonId && agentColumnKey(selectedCell) === agentColumnKey(a), "min-w-0 overflow-hidden px-3 py-1.5 border-b border-l border-border"),
 			children: renderCellContent(state)
-		}, a.agentNodeId);
+		}, agentColumnKey(a));
 	})] });
 }
 /**
@@ -14795,7 +14886,8 @@ function GridRow({ node, depth, agents, getCellState, onCellClick, selectedCell,
 function MatrixGrid$1({ rows, agents, getCellState, onCellClick, selectedCell, onToggleEnabled }) {
 	const gridTemplate = `${STEP_COL_REM$1}rem repeat(${agents.length}, 13rem)`;
 	const showToggle = onToggleEnabled !== void 0 && agents.length === 1;
-	const onlyAgent = agents[0]?.agentNodeId;
+	const onlyAgent = agents[0];
+	const groups = groupAgentColumns(agents);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "overflow-auto border border-border rounded",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -14806,16 +14898,16 @@ function MatrixGrid$1({ rows, agents, getCellState, onCellClick, selectedCell, o
 					className: "sticky top-0 left-0 z-20 bg-muted/60 px-3 py-2 text-[10px] uppercase tracking-widest text-foreground-subtle border-b border-border",
 					children: "Step"
 				}),
-				agents.map((a) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				groups.map((group) => group.grouped ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupedAgentHeader, { group }, group.agentNodeId) : group.columns.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "sticky top-0 z-10 min-w-0 bg-muted/60 px-3 py-2 border-b border-l border-border",
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "text-xs font-semibold text-foreground truncate",
-						children: a.agentNodeId
+						children: col.agentNodeId
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "text-[10px] text-foreground-subtle truncate",
-						children: a.engineLabel
+						children: col.engineLabel
 					})]
-				}, a.agentNodeId)),
+				}, agentColumnKey(col)))),
 				rows.map(({ node, depth }) => {
 					const cellState = showToggle && onlyAgent !== void 0 ? getCellState(node.addonId, onlyAgent) : null;
 					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GridRow, {
@@ -14851,14 +14943,14 @@ function StackedCards({ rows, agents, getCellState, onCellClick, selectedCell, o
 				className: "bg-muted/60 px-3 py-2 border-b border-border",
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "text-xs font-semibold text-foreground truncate",
-					children: a.agentNodeId
+					children: a.deviceLabel ? `${a.agentNodeId} · ${a.deviceLabel}` : a.agentNodeId
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "text-[10px] text-foreground-subtle truncate",
 					children: a.engineLabel
 				})]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", { children: rows.map(({ node, depth }) => {
-				const state = getCellState(node.addonId, a.agentNodeId);
-				const isSelected = selectedCell?.addonId === node.addonId && selectedCell.agentNodeId === a.agentNodeId;
+				const state = getCellState(node.addonId, a);
+				const isSelected = selectedCell !== null && selectedCell.addonId === node.addonId && agentColumnKey(selectedCell) === agentColumnKey(a);
 				const toggleProps = showToggle && state !== null ? {
 					enabled: state.kind === "enabled",
 					onChange: (next) => onToggleEnabled?.(node.addonId, next),
@@ -14870,7 +14962,7 @@ function StackedCards({ rows, agents, getCellState, onCellClick, selectedCell, o
 						className: "flex items-center gap-2",
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 							type: "button",
-							onClick: () => onCellClick(node.addonId, a.agentNodeId),
+							onClick: () => onCellClick(node.addonId, a),
 							className: cellButtonClass(state, isSelected, "flex flex-1 min-w-0 items-start justify-between gap-3 px-3 py-2"),
 							style: { paddingLeft: `${12 + depth * 14}px` },
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StepLabel, { node }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -14888,7 +14980,7 @@ function StackedCards({ rows, agents, getCellState, onCellClick, selectedCell, o
 					})
 				}, node.addonId);
 			}) })]
-		}, a.agentNodeId))
+		}, agentColumnKey(a)))
 	});
 }
 function PipelineTreeMatrix({ tree, agents, getCellState, onCellClick, selectedCell, onToggleEnabled }) {
@@ -15009,11 +15101,12 @@ function StepGateCell({ node, depth, gate, busy, onSet }) {
 }
 /**
 * Agents-scoped node selector for the B fallback. Styled like the shared
-* `NodePicker` but driven by THIS matrix's `agents` set — the cluster-wide
+* `NodePicker` but driven by THIS matrix's NODE set — the cluster-wide
 * NodePicker can list nodes (e.g. the hub) that own no pipeline column here,
-* which would let the operator select a node the matrix can't show.
+* which would let the operator select a node the matrix can't show. Selects a
+* NODE (grouping its device sub-columns), never a raw device column.
 */
-function NodeSelectorBar({ agents, selected, onSelect }) {
+function NodeSelectorBar({ nodes, selected, onSelect }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "flex flex-wrap items-center gap-1.5",
 		role: "tablist",
@@ -15026,7 +15119,7 @@ function NodeSelectorBar({ agents, selected, onSelect }) {
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: "flex overflow-hidden rounded-md border border-border text-[11px] font-medium",
-				children: agents.map((a, idx) => {
+				children: nodes.map((a, idx) => {
 					const isSelected = a.agentNodeId === selected;
 					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 						type: "button",
@@ -15044,6 +15137,7 @@ function NodeSelectorBar({ agents, selected, onSelect }) {
 }
 function MatrixGrid({ tree, agents, gateFor, getCellState, onCellClick, selectedCell, onSetGate, gateBusy, single }) {
 	const rows = (0, react$1.useMemo)(() => flattenTree(tree), [tree]);
+	const groups = (0, react$1.useMemo)(() => groupAgentColumns(agents), [agents]);
 	const gridTemplate = single ? `minmax(0, 1.35fr) repeat(${agents.length}, minmax(0, 1fr))` : `${STEP_COL_REM}rem repeat(${agents.length}, 13rem)`;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: cn("rounded border border-border", single ? "overflow-hidden" : "overflow-auto"),
@@ -15055,16 +15149,16 @@ function MatrixGrid({ tree, agents, gateFor, getCellState, onCellClick, selected
 					className: "sticky left-0 top-0 z-20 border-b border-border bg-muted/60 px-3 py-2 text-[10px] uppercase tracking-widest text-foreground-subtle",
 					children: "Step · gate"
 				}),
-				agents.map((a) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				groups.map((group) => group.grouped ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupedAgentHeader, { group }, group.agentNodeId) : group.columns.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "sticky top-0 z-10 min-w-0 border-b border-l border-border bg-muted/60 px-3 py-2",
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "truncate text-xs font-semibold text-foreground",
-						children: a.agentNodeId
+						children: col.agentNodeId
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "truncate text-[10px] text-foreground-subtle",
-						children: a.engineLabel
+						children: col.engineLabel
 					})]
-				}, a.agentNodeId)),
+				}, agentColumnKey(col)))),
 				rows.map(({ node, depth }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MatrixRow, {
 					node,
 					depth,
@@ -15088,16 +15182,16 @@ function MatrixRow({ node, depth, agents, gate, getCellState, onCellClick, selec
 		busy: gateBusy,
 		onSet: (next) => onSetGate(node.addonId, next)
 	}), agents.map((a) => {
-		const state = getCellState(node.addonId, a.agentNodeId);
-		const isSelected = selectedCell?.addonId === node.addonId && selectedCell.agentNodeId === a.agentNodeId;
+		const state = getCellState(node.addonId, a);
+		const isSelected = selectedCell !== null && selectedCell.addonId === node.addonId && agentColumnKey(selectedCell) === agentColumnKey(a);
 		const actionable = state.kind === "enabled" || state.kind === "skip";
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 			type: "button",
 			disabled: !actionable,
-			onClick: () => onCellClick(node.addonId, a.agentNodeId),
+			onClick: () => onCellClick(node.addonId, a),
 			className: cellButtonClass(state, isSelected, cn("min-w-0 overflow-hidden border-b border-l border-border px-3 py-2", !actionable && "cursor-default hover:bg-transparent")),
 			children: renderCellContent(state)
-		}, a.agentNodeId);
+		}, agentColumnKey(a));
 	})] });
 }
 function DeviceStepMatrix({ tree, agents, gateFor, getCellState, onCellClick, selectedCell, onSetGate, gateBusy, fallbackNodeId, onFallbackNodeChange }) {
@@ -15112,17 +15206,18 @@ function DeviceStepMatrix({ tree, agents, gateFor, getCellState, onCellClick, se
 		RO?.observe(el);
 		return () => RO?.disconnect();
 	}, []);
-	const single = shouldUseSingleNode(width, agents.length, STEP_COL_PX);
+	const nodes = (0, react$1.useMemo)(() => groupAgentColumns(agents), [agents]);
+	const single = shouldUseSingleNode(width, nodes.length, STEP_COL_PX);
 	const selectedNode = (0, react$1.useMemo)(() => {
-		if (agents.length === 0) return null;
-		return agents.find((a) => a.agentNodeId === fallbackNodeId) ?? agents[0];
-	}, [agents, fallbackNodeId]);
-	const shownAgents = single && selectedNode ? [selectedNode] : agents;
+		if (nodes.length === 0) return null;
+		return nodes.find((n) => n.agentNodeId === fallbackNodeId) ?? nodes[0] ?? null;
+	}, [nodes, fallbackNodeId]);
+	const shownAgents = single && selectedNode ? selectedNode.columns : agents;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		ref: containerRef,
 		className: "w-full space-y-2",
 		children: [single && selectedNode && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorBar, {
-			agents,
+			nodes,
 			selected: selectedNode.agentNodeId,
 			onSelect: onFallbackNodeChange
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MatrixGrid, {
@@ -18850,8 +18945,6 @@ var usePipelineExecutorGetAvailableEngines = trpc.pipelineExecutor.getAvailableE
 var usePipelineExecutorGetSelectedEngine = trpc.pipelineExecutor.getSelectedEngine.useQuery;
 /** Generated alias around `trpc.pipelineExecutor.getDefaultSteps.useQuery`. */
 var usePipelineExecutorGetDefaultSteps = trpc.pipelineExecutor.getDefaultSteps.useQuery;
-/** Generated alias around `trpc.pipelineExecutor.reprobeEngine.useMutation`. */
-var usePipelineExecutorReprobeEngine = trpc.pipelineExecutor.reprobeEngine.useMutation;
 /** Generated alias around `trpc.pipelineExecutor.getEngineProvisioning.useQuery`. */
 var usePipelineExecutorGetEngineProvisioning = trpc.pipelineExecutor.getEngineProvisioning.useQuery;
 /** Generated alias around `trpc.pipelineExecutor.getVideoPipelineSteps.useQuery`. */
@@ -18922,6 +19015,10 @@ var usePipelineExecutorGetDetectionConfigSchema = trpc.pipelineExecutor.getDetec
 var usePipelineOrchestratorAssignPipeline = trpc.pipelineOrchestrator.assignPipeline.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.unassignPipeline.useMutation`. */
 var usePipelineOrchestratorUnassignPipeline = trpc.pipelineOrchestrator.unassignPipeline.useMutation;
+/** Generated alias around `trpc.pipelineOrchestrator.setPipelineDevicePin.useMutation`. */
+var usePipelineOrchestratorSetPipelineDevicePin = trpc.pipelineOrchestrator.setPipelineDevicePin.useMutation;
+/** Generated alias around `trpc.pipelineOrchestrator.getPipelineDevicePin.useQuery`. */
+var usePipelineOrchestratorGetPipelineDevicePin = trpc.pipelineOrchestrator.getPipelineDevicePin.useQuery;
 /** Generated alias around `trpc.pipelineOrchestrator.rebalance.useMutation`. */
 var usePipelineOrchestratorRebalance = trpc.pipelineOrchestrator.rebalance.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.getPipelineAssignments.useQuery`. */
@@ -18954,8 +19051,6 @@ var usePipelineOrchestratorGetAudioAssignments = trpc.pipelineOrchestrator.getAu
 var usePipelineOrchestratorGetAgentSettings = trpc.pipelineOrchestrator.getAgentSettings.useQuery;
 /** Generated alias around `trpc.pipelineOrchestrator.listAgentSettings.useQuery`. */
 var usePipelineOrchestratorListAgentSettings = trpc.pipelineOrchestrator.listAgentSettings.useQuery;
-/** Generated alias around `trpc.pipelineOrchestrator.setAgentAddonDefaults.useMutation`. */
-var usePipelineOrchestratorSetAgentAddonDefaults = trpc.pipelineOrchestrator.setAgentAddonDefaults.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.removeAgentSettings.useMutation`. */
 var usePipelineOrchestratorRemoveAgentSettings = trpc.pipelineOrchestrator.removeAgentSettings.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.setAgentMaxCameras.useMutation`. */
@@ -18968,6 +19063,8 @@ var usePipelineOrchestratorSetAgentCapabilities = trpc.pipelineOrchestrator.setA
 var usePipelineOrchestratorSetAgentReachableHost = trpc.pipelineOrchestrator.setAgentReachableHost.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.setAgentInferenceDevices.useMutation`. */
 var usePipelineOrchestratorSetAgentInferenceDevices = trpc.pipelineOrchestrator.setAgentInferenceDevices.useMutation;
+/** Generated alias around `trpc.pipelineOrchestrator.getNodeInferenceDevices.useQuery`. */
+var usePipelineOrchestratorGetNodeInferenceDevices = trpc.pipelineOrchestrator.getNodeInferenceDevices.useQuery;
 /** Generated alias around `trpc.pipelineOrchestrator.resetNodePipelineDefaults.useMutation`. */
 var usePipelineOrchestratorResetNodePipelineDefaults = trpc.pipelineOrchestrator.resetNodePipelineDefaults.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.getCameraSettings.useQuery`. */
@@ -28829,15 +28926,34 @@ function DeviceItemPreview({ trpc, device, status, enabled, showStatusPills = fa
 }
 //#endregion
 //#region src/composites/device-item/status-dot.tsx
+/** The states that breathe (are "alive"). Offline + disabled are static. */
+function isAlive(status) {
+	return status === "online" || status === "recording-continuous" || status === "recording-events";
+}
 function resolveTitle(status, lastChangedAt) {
-	if (status === "disabled") return "Disabled";
-	if (status === "online") return "Online";
-	const lastSeen = formatLastSeen(lastChangedAt);
-	return lastSeen === null ? "Offline" : `Offline · last seen ${lastSeen}`;
+	switch (status) {
+		case "disabled": return "Disabled";
+		case "online": return "Online";
+		case "recording-continuous": return "Recording · always";
+		case "recording-events": return "Recording · on motion";
+		case "offline": {
+			const lastSeen = formatLastSeen(lastChangedAt);
+			return lastSeen === null ? "Offline" : `Offline · last seen ${lastSeen}`;
+		}
+	}
+}
+function colorClass(status) {
+	switch (status) {
+		case "disabled": return "bg-black ring-1 ring-foreground-subtle/60";
+		case "offline": return "bg-foreground-subtle";
+		case "recording-continuous": return "bg-danger";
+		case "recording-events": return "bg-info";
+		case "online": return "bg-success";
+	}
 }
 function StatusDot({ status, lastChangedAt }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		className: cn("h-1.5 w-1.5 rounded-full flex-shrink-0", status === "disabled" ? "bg-warning" : status === "online" ? "bg-success" : "bg-danger"),
+		className: cn("h-1.5 w-1.5 rounded-full flex-shrink-0", colorClass(status), isAlive(status) && "animate-pulse"),
 		title: resolveTitle(status, lastChangedAt)
 	});
 }
@@ -47081,6 +47197,7 @@ exports.MediaPlayerHeroCard = MediaPlayerHeroCard;
 exports.MediaPlayerInlineControl = MediaPlayerInlineControl;
 exports.MediaPlayerPanel = MediaPlayerPanel;
 exports.MobileDrawer = MobileDrawer;
+exports.ModelPicker = ModelPicker;
 exports.MotionZonesSettings = MotionZonesSettings;
 exports.NodeMultiSelectField = NodeMultiSelectField;
 exports.NodePicker = NodePicker;
@@ -47182,6 +47299,7 @@ exports.WidgetPanel = WidgetPanel;
 exports.WidgetRegistryProvider = WidgetRegistryProvider;
 exports.WidgetSlot = WidgetSlot;
 exports.ZoneEditingProvider = ZoneEditingProvider;
+exports.agentColumnKey = agentColumnKey;
 exports.allDeviceTypeFilterOptions = allDeviceTypeFilterOptions;
 exports.buildStepTreeFromSchema = buildStepTreeFromSchema;
 exports.childEntityId = childEntityId;
@@ -47215,6 +47333,7 @@ exports.formatNumeric = formatNumeric;
 exports.fuzzyMatch = fuzzyMatch;
 exports.getClassColor = getClassColor;
 exports.getPhaseVisual = getPhaseVisual;
+exports.groupAgentColumns = groupAgentColumns;
 exports.groupChildrenByLayout = groupChildrenByLayout;
 exports.hardwareLabel = hardwareLabel;
 exports.humidifierTint = humidifierTint;
@@ -47820,7 +47939,6 @@ exports.usePipelineExecutorKillEngine = usePipelineExecutorKillEngine;
 exports.usePipelineExecutorListLoadedEngines = usePipelineExecutorListLoadedEngines;
 exports.usePipelineExecutorListReferenceImages = usePipelineExecutorListReferenceImages;
 exports.usePipelineExecutorListTemplates = usePipelineExecutorListTemplates;
-exports.usePipelineExecutorReprobeEngine = usePipelineExecutorReprobeEngine;
 exports.usePipelineExecutorRunAudioTest = usePipelineExecutorRunAudioTest;
 exports.usePipelineExecutorRunPipeline = usePipelineExecutorRunPipeline;
 exports.usePipelineExecutorRunPipelineBatch = usePipelineExecutorRunPipelineBatch;
@@ -47849,8 +47967,10 @@ exports.usePipelineOrchestratorGetDeviceLiveContribution = usePipelineOrchestrat
 exports.usePipelineOrchestratorGetDeviceSettingsContribution = usePipelineOrchestratorGetDeviceSettingsContribution;
 exports.usePipelineOrchestratorGetGlobalMetrics = usePipelineOrchestratorGetGlobalMetrics;
 exports.usePipelineOrchestratorGetIngestOwner = usePipelineOrchestratorGetIngestOwner;
+exports.usePipelineOrchestratorGetNodeInferenceDevices = usePipelineOrchestratorGetNodeInferenceDevices;
 exports.usePipelineOrchestratorGetPipelineAssignment = usePipelineOrchestratorGetPipelineAssignment;
 exports.usePipelineOrchestratorGetPipelineAssignments = usePipelineOrchestratorGetPipelineAssignments;
+exports.usePipelineOrchestratorGetPipelineDevicePin = usePipelineOrchestratorGetPipelineDevicePin;
 exports.usePipelineOrchestratorListAgentSettings = usePipelineOrchestratorListAgentSettings;
 exports.usePipelineOrchestratorListTemplates = usePipelineOrchestratorListTemplates;
 exports.usePipelineOrchestratorRebalance = usePipelineOrchestratorRebalance;
@@ -47858,7 +47978,6 @@ exports.usePipelineOrchestratorRemoveAgentSettings = usePipelineOrchestratorRemo
 exports.usePipelineOrchestratorResetNodePipelineDefaults = usePipelineOrchestratorResetNodePipelineDefaults;
 exports.usePipelineOrchestratorResolvePipeline = usePipelineOrchestratorResolvePipeline;
 exports.usePipelineOrchestratorSaveTemplate = usePipelineOrchestratorSaveTemplate;
-exports.usePipelineOrchestratorSetAgentAddonDefaults = usePipelineOrchestratorSetAgentAddonDefaults;
 exports.usePipelineOrchestratorSetAgentCapabilities = usePipelineOrchestratorSetAgentCapabilities;
 exports.usePipelineOrchestratorSetAgentDetectWeight = usePipelineOrchestratorSetAgentDetectWeight;
 exports.usePipelineOrchestratorSetAgentInferenceDevices = usePipelineOrchestratorSetAgentInferenceDevices;
@@ -47868,6 +47987,7 @@ exports.usePipelineOrchestratorSetCameraPipelineForAgent = usePipelineOrchestrat
 exports.usePipelineOrchestratorSetCameraStepOverride = usePipelineOrchestratorSetCameraStepOverride;
 exports.usePipelineOrchestratorSetCameraStepToggle = usePipelineOrchestratorSetCameraStepToggle;
 exports.usePipelineOrchestratorSetCapabilityBinding = usePipelineOrchestratorSetCapabilityBinding;
+exports.usePipelineOrchestratorSetPipelineDevicePin = usePipelineOrchestratorSetPipelineDevicePin;
 exports.usePipelineOrchestratorUnassignAudio = usePipelineOrchestratorUnassignAudio;
 exports.usePipelineOrchestratorUnassignPipeline = usePipelineOrchestratorUnassignPipeline;
 exports.usePipelineOrchestratorUpdateTemplate = usePipelineOrchestratorUpdateTemplate;