@camstack/ui-library 0.1.50 → 0.1.51

package/dist/index.cjs

@@ -1,29 +1,30 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 //#region \0rolldown/runtime.js
 var __create = Object.create;
-var __defProp = Object.defineProperty;
+var __defProp$1 = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
 	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
 		key = keys[i];
-		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+		if (!__hasOwnProp$1.call(to, key) && key !== except) __defProp$1(to, key, {
 			get: ((k) => from[k]).bind(null, key),
 			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
 		});
 	}
 	return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp$1(target, "default", {
 	value: mod,
 	enumerable: true
 }) : target, mod));
 //#endregion
 const require_theme_index = require("./theme/index.cjs");
 let react = require("react");
-react = __toESM(react, 1);
+let react$1 = __toESM(react, 1);
+react = __toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = __toESM(react_jsx_runtime, 1);
 let react_dom = require("react-dom");
@@ -38,6 +39,7 @@ let _trpc_react_query = require("@trpc/react-query");
 _trpc_react_query = __toESM(_trpc_react_query, 1);
 let _camstack_types = require("@camstack/types");
 let _camstack_sdk = require("@camstack/sdk");
+let zod = require("zod");
 //#region ../../node_modules/clsx/dist/clsx.mjs
 function r(e) {
 	var t, f, n = "";
@@ -3590,13 +3592,13 @@ function getPhaseVisual(phase) {
 * the Map is typed as `Context<unknown>`).
 */
 function createSharedContext(name, defaultValue) {
-	if (typeof globalThis === "undefined") return (0, react.createContext)(defaultValue);
+	if (typeof globalThis === "undefined") return (0, react$1.createContext)(defaultValue);
 	const existingMap = globalThis.__camstackSharedContexts;
 	const map = existingMap ?? /* @__PURE__ */ new Map();
 	if (!existingMap) globalThis.__camstackSharedContexts = map;
 	const existing = map.get(name);
 	if (existing) return existing;
-	const ctx = (0, react.createContext)(defaultValue);
+	const ctx = (0, react$1.createContext)(defaultValue);
 	map.set(name, ctx);
 	return ctx;
 }
@@ -6866,7 +6868,7 @@ function getModuleCache() {
 }
 function populateShareCache() {
 	const cache = getModuleCache();
-	cache.share["react"] ??= react;
+	cache.share["react"] ??= react$1;
 	cache.share["react-dom"] ??= react_dom;
 	cache.share["react-dom/client"] ??= react_dom_client;
 	cache.share["react/jsx-runtime"] ??= react_jsx_runtime;
@@ -6884,7 +6886,7 @@ function ensureMfHostInit() {
 		name: "admin_ui_host",
 		remotes: [],
 		shared: {
-			"react": npmShared(() => react),
+			"react": npmShared(() => react$1),
 			"react-dom": npmShared(() => react_dom),
 			"react-dom/client": npmShared(() => react_dom_client),
 			"react/jsx-runtime": npmShared(() => react_jsx_runtime),
@@ -7991,6 +7993,68 @@ var PowerOff = createLucideIcon("power-off", [
 		key: "1ooewy"
 	}]
 ]);
+var QrCode$1 = createLucideIcon("qr-code", [
+	["rect", {
+		width: "5",
+		height: "5",
+		x: "3",
+		y: "3",
+		rx: "1",
+		key: "1tu5fj"
+	}],
+	["rect", {
+		width: "5",
+		height: "5",
+		x: "16",
+		y: "3",
+		rx: "1",
+		key: "1v8r4q"
+	}],
+	["rect", {
+		width: "5",
+		height: "5",
+		x: "3",
+		y: "16",
+		rx: "1",
+		key: "1x03jg"
+	}],
+	["path", {
+		d: "M21 16h-3a2 2 0 0 0-2 2v3",
+		key: "177gqh"
+	}],
+	["path", {
+		d: "M21 21v.01",
+		key: "ents32"
+	}],
+	["path", {
+		d: "M12 7v3a2 2 0 0 1-2 2H7",
+		key: "8crl2c"
+	}],
+	["path", {
+		d: "M3 12h.01",
+		key: "nlz23k"
+	}],
+	["path", {
+		d: "M12 3h.01",
+		key: "n36tog"
+	}],
+	["path", {
+		d: "M12 16v.01",
+		key: "133mhm"
+	}],
+	["path", {
+		d: "M16 12h1",
+		key: "1slzba"
+	}],
+	["path", {
+		d: "M21 12v.01",
+		key: "1lwtk9"
+	}],
+	["path", {
+		d: "M12 21v-1",
+		key: "1880an"
+	}]
+]);
 var Radar = createLucideIcon("radar", [
 	["path", {
 		d: "M19.07 4.93A10 10 0 0 0 6.99 3.34",
@@ -8176,6 +8240,40 @@ var Server = createLucideIcon("server", [
 		key: "nzw8ys"
 	}]
 ]);
+var Share2 = createLucideIcon("share-2", [
+	["circle", {
+		cx: "18",
+		cy: "5",
+		r: "3",
+		key: "gq8acd"
+	}],
+	["circle", {
+		cx: "6",
+		cy: "12",
+		r: "3",
+		key: "w7nqdw"
+	}],
+	["circle", {
+		cx: "18",
+		cy: "19",
+		r: "3",
+		key: "1xt0gg"
+	}],
+	["line", {
+		x1: "8.59",
+		x2: "15.42",
+		y1: "13.51",
+		y2: "17.49",
+		key: "47mynk"
+	}],
+	["line", {
+		x1: "15.41",
+		x2: "8.59",
+		y1: "6.51",
+		y2: "10.49",
+		key: "1n3mei"
+	}]
+]);
 var Shield = createLucideIcon("shield", [["path", {
 	d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z",
 	key: "oel41y"
@@ -8383,6 +8481,10 @@ var TriangleAlert = createLucideIcon("triangle-alert", [
 		key: "p32p05"
 	}]
 ]);
+var Unlink2 = createLucideIcon("unlink-2", [["path", {
+	d: "M15 7h2a5 5 0 0 1 0 10h-2m-6 0H7A5 5 0 0 1 7 7h2",
+	key: "1re2ne"
+}]]);
 var Upload = createLucideIcon("upload", [
 	["path", {
 		d: "M12 3v12",
@@ -8603,7 +8705,7 @@ var buttonVariants = cva("inline-flex items-center justify-center rounded-md fon
 		size: "sm"
 	}
 });
-var Button = (0, react.forwardRef)(({ className, variant, size, ...props }, ref) => {
+var Button = (0, react$1.forwardRef)(({ className, variant, size, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		ref,
 		className: cn(buttonVariants({
@@ -8636,7 +8738,7 @@ var iconButtonVariants = cva("inline-flex items-center justify-center rounded-md
 		size: "sm"
 	}
 });
-var IconButton = (0, react.forwardRef)(({ className, variant, size, icon: Icon, ...props }, ref) => {
+var IconButton = (0, react$1.forwardRef)(({ className, variant, size, icon: Icon, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		ref,
 		className: cn(iconButtonVariants({
@@ -8669,7 +8771,7 @@ var badgeVariants = cva("inline-flex items-center rounded-full text-xs font-medi
 		styleVariant: "solid"
 	}
 });
-var Badge = (0, react.forwardRef)(({ className, variant, style, ...props }, ref) => {
+var Badge = (0, react$1.forwardRef)(({ className, variant, style, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 		ref,
 		className: cn(badgeVariants({
@@ -8689,7 +8791,7 @@ var cardVariants = cva("rounded-lg p-3", {
 	} },
 	defaultVariants: { variant: "bordered" }
 });
-var Card = (0, react.forwardRef)(({ className, variant, ...props }, ref) => {
+var Card = (0, react$1.forwardRef)(({ className, variant, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		ref,
 		className: cn(cardVariants({ variant }), className),
@@ -8725,7 +8827,7 @@ function CollapsibleCard({ expanded, onExpandedChange, header, children, dimmed
 }
 //#endregion
 //#region src/primitives/label.tsx
-var Label = (0, react.forwardRef)(({ className, ...props }, ref) => {
+var Label = (0, react$1.forwardRef)(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
 		ref,
 		className: cn("text-[10px] uppercase tracking-wider text-foreground-muted font-medium", className),
@@ -8742,7 +8844,7 @@ var separatorVariants = cva("", {
 	} },
 	defaultVariants: { orientation: "horizontal" }
 });
-var Separator = (0, react.forwardRef)(({ className, orientation, ...props }, ref) => {
+var Separator = (0, react$1.forwardRef)(({ className, orientation, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		ref,
 		role: "separator",
@@ -8753,7 +8855,7 @@ var Separator = (0, react.forwardRef)(({ className, orientation, ...props }, ref
 Separator.displayName = "Separator";
 //#endregion
 //#region src/primitives/skeleton.tsx
-var Skeleton = (0, react.forwardRef)(({ className, ...props }, ref) => {
+var Skeleton = (0, react$1.forwardRef)(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		ref,
 		className: cn("animate-pulse bg-surface-hover rounded-md h-4 w-full", className),
@@ -8770,7 +8872,7 @@ var inputVariants = cva("h-7 w-full px-2.5 text-xs bg-surface border rounded-md
 	} },
 	defaultVariants: { state: "default" }
 });
-var Input = (0, react.forwardRef)(({ className, state, leftSlot, rightSlot, ...props }, ref) => {
+var Input = (0, react$1.forwardRef)(({ className, state, leftSlot, rightSlot, ...props }, ref) => {
 	if (leftSlot || rightSlot) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "relative flex items-center w-full",
 		children: [
@@ -8798,7 +8900,7 @@ var Input = (0, react.forwardRef)(({ className, state, leftSlot, rightSlot, ...p
 Input.displayName = "Input";
 //#endregion
 //#region src/primitives/select.tsx
-var Select = (0, react.forwardRef)(({ className, options, ...props }, ref) => {
+var Select = (0, react$1.forwardRef)(({ className, options, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "relative w-full",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
@@ -8818,7 +8920,7 @@ var Select = (0, react.forwardRef)(({ className, options, ...props }, ref) => {
 Select.displayName = "Select";
 //#endregion
 //#region src/primitives/checkbox.tsx
-var Checkbox = (0, react.forwardRef)(({ className, ...props }, ref) => {
+var Checkbox = (0, react$1.forwardRef)(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 		ref,
 		type: "checkbox",
@@ -8829,7 +8931,7 @@ var Checkbox = (0, react.forwardRef)(({ className, ...props }, ref) => {
 Checkbox.displayName = "Checkbox";
 //#endregion
 //#region src/primitives/switch.tsx
-var Switch = (0, react.forwardRef)(({ className, checked, onCheckedChange, label, ...props }, ref) => {
+var Switch = (0, react$1.forwardRef)(({ className, checked, onCheckedChange, label, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 		ref,
 		role: "switch",
@@ -8850,17 +8952,17 @@ var Switch = (0, react.forwardRef)(({ className, checked, onCheckedChange, label
 Switch.displayName = "Switch";
 //#endregion
 //#region src/primitives/dialog.tsx
-var DialogContext = (0, react.createContext)(null);
+var DialogContext = (0, react$1.createContext)(null);
 function useDialogContext() {
-	const ctx = (0, react.useContext)(DialogContext);
+	const ctx = (0, react$1.useContext)(DialogContext);
 	if (!ctx) throw new Error("Dialog compound components must be used within <Dialog>");
 	return ctx;
 }
 function Dialog({ children, open: controlledOpen, onOpenChange }) {
-	const [uncontrolledOpen, setUncontrolledOpen] = (0, react.useState)(false);
+	const [uncontrolledOpen, setUncontrolledOpen] = (0, react$1.useState)(false);
 	const open = controlledOpen ?? uncontrolledOpen;
-	const contentId = (0, react.useId)();
-	const setOpen = (0, react.useCallback)((next) => {
+	const contentId = (0, react$1.useId)();
+	const setOpen = (0, react$1.useCallback)((next) => {
 		onOpenChange?.(next);
 		if (controlledOpen === void 0) setUncontrolledOpen(next);
 	}, [controlledOpen, onOpenChange]);
@@ -8890,11 +8992,11 @@ var contentVariants = cva("bg-background-elevated border border-border rounded-l
 	} },
 	defaultVariants: { width: "md" }
 });
-var DialogContent = (0, react.forwardRef)(({ className, width, children, ...props }, ref) => {
+var DialogContent = (0, react$1.forwardRef)(({ className, width, children, ...props }, ref) => {
 	const { open, setOpen, contentId } = useDialogContext();
-	const innerRef = (0, react.useRef)(null);
+	const innerRef = (0, react$1.useRef)(null);
 	const dialogRef = ref ?? innerRef;
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const el = dialogRef.current;
 		if (!el) return;
 		if (open && !el.open) el.showModal();
@@ -8940,17 +9042,17 @@ function DialogDescription({ className, ...props }) {
 }
 //#endregion
 //#region src/primitives/dropdown.tsx
-var DropdownContext = (0, react.createContext)(null);
+var DropdownContext = (0, react$1.createContext)(null);
 function useDropdownContext() {
-	const ctx = (0, react.useContext)(DropdownContext);
+	const ctx = (0, react$1.useContext)(DropdownContext);
 	if (!ctx) throw new Error("Dropdown compound components must be used within <Dropdown>");
 	return ctx;
 }
 function Dropdown({ children }) {
-	const [open, setOpen] = (0, react.useState)(false);
-	const triggerId = (0, react.useId)();
-	const contentId = (0, react.useId)();
-	const triggerRef = (0, react.useRef)(null);
+	const [open, setOpen] = (0, react$1.useState)(false);
+	const triggerId = (0, react$1.useId)();
+	const contentId = (0, react$1.useId)();
+	const triggerRef = (0, react$1.useRef)(null);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DropdownContext.Provider, {
 		value: {
 			open,
@@ -8981,9 +9083,9 @@ function DropdownTrigger({ children, ...props }) {
 }
 function DropdownContent({ className, children, align = "start", offset = 4, ...props }) {
 	const { open, setOpen, contentId, triggerId, triggerRef } = useDropdownContext();
-	const ref = (0, react.useRef)(null);
-	const [coords, setCoords] = (0, react.useState)(null);
-	(0, react.useLayoutEffect)(() => {
+	const ref = (0, react$1.useRef)(null);
+	const [coords, setCoords] = (0, react$1.useState)(null);
+	(0, react$1.useLayoutEffect)(() => {
 		if (!open) {
 			setCoords(null);
 			return;
@@ -9012,7 +9114,7 @@ function DropdownContent({ className, children, align = "start", offset = 4, ...
 		offset,
 		triggerRef
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!open) return;
 		const handler = (e) => {
 			const el = ref.current;
@@ -9052,7 +9154,7 @@ function DropdownContent({ className, children, align = "start", offset = 4, ...
 }
 function DropdownItem({ className, icon: Icon, variant = "default", children, onClick, ...props }) {
 	const { setOpen } = useDropdownContext();
-	const handleClick = (0, react.useCallback)((e) => {
+	const handleClick = (0, react$1.useCallback)((e) => {
 		onClick?.(e);
 		setOpen(false);
 	}, [onClick, setOpen]);
@@ -9067,16 +9169,16 @@ function DropdownItem({ className, icon: Icon, variant = "default", children, on
 }
 //#endregion
 //#region src/primitives/tooltip.tsx
-var TooltipContext = (0, react.createContext)(null);
+var TooltipContext = (0, react$1.createContext)(null);
 function useTooltipContext() {
-	const ctx = (0, react.useContext)(TooltipContext);
+	const ctx = (0, react$1.useContext)(TooltipContext);
 	if (!ctx) throw new Error("Tooltip compound components must be used within <Tooltip>");
 	return ctx;
 }
 function Tooltip({ children }) {
-	const [open, setOpen] = (0, react.useState)(false);
-	const timerRef = (0, react.useRef)(null);
-	const tooltipId = (0, react.useId)();
+	const [open, setOpen] = (0, react$1.useState)(false);
+	const timerRef = (0, react$1.useRef)(null);
+	const tooltipId = (0, react$1.useId)();
 	const show = () => {
 		timerRef.current = setTimeout(() => setOpen(true), 300);
 	};
@@ -9143,7 +9245,7 @@ function getServerSnapshot() {
 	return false;
 }
 function useIsMobile() {
-	return (0, react.useSyncExternalStore)(subscribeQuery(MOBILE_QUERY), getSnapshot(MOBILE_QUERY), getServerSnapshot);
+	return (0, react$1.useSyncExternalStore)(subscribeQuery(MOBILE_QUERY), getSnapshot(MOBILE_QUERY), getServerSnapshot);
 }
 /**
 * True when the viewport is in the medium (`md`) Tailwind range —
@@ -9152,12 +9254,12 @@ function useIsMobile() {
 * sidebar rail, narrower stat tiles).
 */
 function useIsMidWidth() {
-	return (0, react.useSyncExternalStore)(subscribeQuery(MID_QUERY), getSnapshot(MID_QUERY), getServerSnapshot);
+	return (0, react$1.useSyncExternalStore)(subscribeQuery(MID_QUERY), getSnapshot(MID_QUERY), getServerSnapshot);
 }
 //#endregion
 //#region src/primitives/bottom-sheet.tsx
 function BottomSheet({ open, onClose, title, children, className }) {
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!open) return;
 		const handleKeyDown = (e) => {
 			if (e.key === "Escape") onClose();
@@ -9202,18 +9304,18 @@ function BottomSheet({ open, onClose, title, children, className }) {
 }
 //#endregion
 //#region src/primitives/popover.tsx
-var PopoverContext = (0, react.createContext)(null);
+var PopoverContext = (0, react$1.createContext)(null);
 function usePopoverContext() {
-	const ctx = (0, react.useContext)(PopoverContext);
+	const ctx = (0, react$1.useContext)(PopoverContext);
 	if (!ctx) throw new Error("Popover compound components must be used within <Popover>");
 	return ctx;
 }
 function Popover({ children, open: controlledOpen, onOpenChange }) {
-	const [uncontrolledOpen, setUncontrolledOpen] = (0, react.useState)(false);
+	const [uncontrolledOpen, setUncontrolledOpen] = (0, react$1.useState)(false);
 	const open = controlledOpen ?? uncontrolledOpen;
-	const triggerId = (0, react.useId)();
-	const contentId = (0, react.useId)();
-	const setOpen = (0, react.useCallback)((next) => {
+	const triggerId = (0, react$1.useId)();
+	const contentId = (0, react$1.useId)();
+	const setOpen = (0, react$1.useCallback)((next) => {
 		onOpenChange?.(next);
 		if (controlledOpen === void 0) setUncontrolledOpen(next);
 	}, [controlledOpen, onOpenChange]);
@@ -9246,8 +9348,8 @@ function PopoverTrigger({ children, ...props }) {
 function PopoverContent({ className, children, ...props }) {
 	const { open, setOpen, contentId, triggerId } = usePopoverContext();
 	const isMobile = useIsMobile();
-	const ref = (0, react.useRef)(null);
-	(0, react.useEffect)(() => {
+	const ref = (0, react$1.useRef)(null);
+	(0, react$1.useEffect)(() => {
 		if (!open || isMobile) return;
 		const handler = (e) => {
 			const el = ref.current;
@@ -9287,16 +9389,16 @@ function PopoverContent({ className, children, ...props }) {
 }
 //#endregion
 //#region src/primitives/tabs.tsx
-var TabsContext = (0, react.createContext)(null);
+var TabsContext = (0, react$1.createContext)(null);
 function useTabsContext() {
-	const ctx = (0, react.useContext)(TabsContext);
+	const ctx = (0, react$1.useContext)(TabsContext);
 	if (!ctx) throw new Error("Tabs compound components must be used within <Tabs>");
 	return ctx;
 }
 function Tabs({ value: controlledValue, onValueChange, defaultValue = "", className, ...props }) {
-	const [uncontrolledValue, setUncontrolledValue] = (0, react.useState)(defaultValue);
+	const [uncontrolledValue, setUncontrolledValue] = (0, react$1.useState)(defaultValue);
 	const value = controlledValue ?? uncontrolledValue;
-	const setValue = (0, react.useCallback)((next) => {
+	const setValue = (0, react$1.useCallback)((next) => {
 		onValueChange?.(next);
 		if (controlledValue === void 0) setUncontrolledValue(next);
 	}, [controlledValue, onValueChange]);
@@ -9344,7 +9446,7 @@ function TabsContent({ value, className, ...props }) {
 }
 //#endregion
 //#region src/primitives/scroll-area.tsx
-var ScrollArea = (0, react.forwardRef)(({ className, ...props }, ref) => {
+var ScrollArea = (0, react$1.forwardRef)(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		ref,
 		className: cn("overflow-auto [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-surface-hover [&::-webkit-scrollbar-thumb]:rounded-full", className),
@@ -9355,23 +9457,23 @@ ScrollArea.displayName = "ScrollArea";
 //#endregion
 //#region src/primitives/floating-panel.tsx
 function FloatingPanel({ title, onClose, children, defaultWidth = 360, defaultHeight = 280, minWidth = 280, minHeight = 160, offsetIndex = 0, className }) {
-	const [pos, setPos] = (0, react.useState)({
+	const [pos, setPos] = (0, react$1.useState)({
 		x: 80 + offsetIndex * 30,
 		y: 80 + offsetIndex * 30
 	});
-	const [size, setSize] = (0, react.useState)({
+	const [size, setSize] = (0, react$1.useState)({
 		w: defaultWidth,
 		h: defaultHeight
 	});
-	const [minimized, setMinimized] = (0, react.useState)(false);
-	const dragging = (0, react.useRef)(false);
-	const resizing = (0, react.useRef)(false);
-	const offset = (0, react.useRef)({
+	const [minimized, setMinimized] = (0, react$1.useState)(false);
+	const dragging = (0, react$1.useRef)(false);
+	const resizing = (0, react$1.useRef)(false);
+	const offset = (0, react$1.useRef)({
 		x: 0,
 		y: 0
 	});
 	const isMobile = useIsMobile();
-	const onDragStart = (0, react.useCallback)((e) => {
+	const onDragStart = (0, react$1.useCallback)((e) => {
 		e.preventDefault();
 		dragging.current = true;
 		offset.current = {
@@ -9379,7 +9481,7 @@ function FloatingPanel({ title, onClose, children, defaultWidth = 360, defaultHe
 			y: e.clientY - pos.y
 		};
 	}, [pos]);
-	const onResizeStart = (0, react.useCallback)((e) => {
+	const onResizeStart = (0, react$1.useCallback)((e) => {
 		e.preventDefault();
 		e.stopPropagation();
 		resizing.current = true;
@@ -9388,7 +9490,7 @@ function FloatingPanel({ title, onClose, children, defaultWidth = 360, defaultHe
 			y: e.clientY
 		};
 	}, []);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const onMouseMove = (e) => {
 			if (dragging.current) setPos({
 				x: e.clientX - offset.current.x,
@@ -9493,8 +9595,8 @@ function FloatingPanel({ title, onClose, children, defaultWidth = 360, defaultHe
 //#endregion
 //#region src/primitives/mobile-drawer.tsx
 function MobileDrawer({ open, onClose, children, className, width = "w-64" }) {
-	const drawerRef = (0, react.useRef)(null);
-	(0, react.useEffect)(() => {
+	const drawerRef = (0, react$1.useRef)(null);
+	(0, react$1.useEffect)(() => {
 		if (!open) return;
 		const handleKeyDown = (e) => {
 			if (e.key === "Escape") onClose();
@@ -9538,7 +9640,7 @@ function Breadcrumb({ items, className }) {
 		children: items.map((item, i) => {
 			const isLast = i === items.length - 1;
 			const isClickable = !isLast && (item.onClick || item.href);
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.default.Fragment, { children: [i > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronRight, { className: "h-3 w-3 flex-shrink-0" }), isClickable ? item.onClick ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react$1.default.Fragment, { children: [i > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronRight, { className: "h-3 w-3 flex-shrink-0" }), isClickable ? item.onClick ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 				type: "button",
 				onClick: item.onClick,
 				className: "hover:text-foreground transition-colors",
@@ -9614,7 +9716,7 @@ function DataTable({ columns, rows, rowKey, onRowClick, minWidthPx = 480, emptyM
 //#endregion
 //#region src/composites/slide-over-panel.tsx
 function SlideOverPanel({ open, onClose, title, subtitle, footer, children, widthClass = "w-[360px]" }) {
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!open) return;
 		const onEsc = (e) => {
 			if (e.key === "Escape") onClose();
@@ -9757,7 +9859,7 @@ function modelsForStep(schema) {
 	}));
 }
 function PipelineStep({ step, schema, allSchemas: _allSchemas, depth: _depth = 0, onChange, onDelete: _onDelete, readOnly = false, toggleMode = "simple", overrideState = null, onOverrideChange, inheritedEnabled, hideModelAndSettings = false }) {
-	const [expanded, setExpanded] = (0, react.useState)(false);
+	const [expanded, setExpanded] = (0, react$1.useState)(false);
 	const models = modelsForStep(schema);
 	if (models.length > 0 && !models.some((m) => m.id === step.modelId) && !readOnly) {
 		const fallback = (schema?.defaultModelId ? models.find((m) => m.id === schema.defaultModelId) : null) ?? models[0];
@@ -10308,7 +10410,7 @@ function DeviceModeEditor({ addon, agentDefault, agentNodeId, currentPatch, mode
 }
 function AgentStepEditor(props) {
 	const { mode, addon, agentDefault, agentNodeId, currentPatch, onChangeAgentConfig, onChangePatch, engineFormat } = props;
-	const modelsForFormat = (0, react.useMemo)(() => addon.models.filter((m) => Boolean(m.formats[engineFormat])), [addon.models, engineFormat]);
+	const modelsForFormat = (0, react$1.useMemo)(() => addon.models.filter((m) => Boolean(m.formats[engineFormat])), [addon.models, engineFormat]);
 	if (mode === "agent") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AgentModeEditor, {
 		addon,
 		agentDefault,
@@ -10458,7 +10560,7 @@ function Row({ node, depth, agents, getCellState, onCellClick, selectedCell, tog
 	})] });
 }
 function PipelineTreeMatrix({ tree, agents, getCellState, onCellClick, selectedCell, onToggleEnabled }) {
-	const rows = (0, react.useMemo)(() => flattenTree(tree), [tree]);
+	const rows = (0, react$1.useMemo)(() => flattenTree(tree), [tree]);
 	const gridTemplate = `minmax(320px, 1fr) repeat(${agents.length}, minmax(160px, 220px))`;
 	const showToggle = onToggleEnabled !== void 0 && agents.length === 1;
 	const onlyAgent = agents[0]?.agentNodeId;
@@ -10564,7 +10666,7 @@ function SystemProvider({ system, children }) {
 * relies on the system, so a clear error beats a silent null.
 */
 function useSystem() {
-	const sys = (0, react.useContext)(SystemContext);
+	const sys = (0, react$1.useContext)(SystemContext);
 	if (!sys) throw new Error("useSystem(): no <SystemProvider> in tree");
 	return sys;
 }
@@ -10574,7 +10676,7 @@ function useSystem() {
 * (boot-time splash screens etc.).
 */
 function useOptionalSystem() {
-	return (0, react.useContext)(SystemContext);
+	return (0, react$1.useContext)(SystemContext);
 }
 //#endregion
 //#region src/hooks/use-live-event.ts
@@ -10590,15 +10692,15 @@ function useOptionalSystem() {
 */
 function useLiveEvent(category, cb) {
 	const system = useSystem();
-	const cbRef = (0, react.useRef)(cb);
+	const cbRef = (0, react$1.useRef)(cb);
 	cbRef.current = cb;
-	const [tick, setTick] = (0, react.useState)(system.connectionVersion);
-	(0, react.useEffect)(() => {
+	const [tick, setTick] = (0, react$1.useState)(system.connectionVersion);
+	(0, react$1.useEffect)(() => {
 		return system.subscribeConnectionEvents((state, version) => {
 			if (state === "connected") setTick(version);
 		});
 	}, [system]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		return system.subscribeEvent(category, (evt) => {
 			cbRef.current(evt);
 		});
@@ -10617,12 +10719,12 @@ function useLiveEvent(category, cb) {
 * useEventStreamMap — same but accumulates per-key payloads into a map.
 */
 function useFreshRef(value) {
-	const ref = (0, react.useRef)(value);
+	const ref = (0, react$1.useRef)(value);
 	ref.current = value;
 	return ref;
 }
 function useEventStreamLatest(category, filter) {
-	const [data, setData] = (0, react.useState)(null);
+	const [data, setData] = (0, react$1.useState)(null);
 	const filterRef = useFreshRef(filter);
 	useLiveEvent(category, (evt) => {
 		const payload = evt.data;
@@ -10633,7 +10735,7 @@ function useEventStreamLatest(category, filter) {
 	return data;
 }
 function useEventStreamMap(category, keyOf, filter) {
-	const [map, setMap] = (0, react.useState)(() => /* @__PURE__ */ new Map());
+	const [map, setMap] = (0, react$1.useState)(() => /* @__PURE__ */ new Map());
 	const keyOfRef = useFreshRef(keyOf);
 	const filterRef = useFreshRef(filter);
 	useLiveEvent(category, (evt) => {
@@ -10649,7 +10751,7 @@ function useEventStreamMap(category, keyOf, filter) {
 	});
 	return {
 		map,
-		values: (0, react.useMemo)(() => Array.from(map.values()), [map])
+		values: (0, react$1.useMemo)(() => Array.from(map.values()), [map])
 	};
 }
 //#endregion
@@ -10669,7 +10771,7 @@ function useClusterNodes() {
 	const { data: bootstrapTopology, isLoading } = trpc.nodes.topology.useQuery(void 0, { staleTime: 6e4 });
 	const sourceNodes = useEventStreamLatest("cluster.topology-snapshot")?.nodes ?? bootstrapTopology;
 	return {
-		nodes: (0, react.useMemo)(() => {
+		nodes: (0, react$1.useMemo)(() => {
 			const list = [];
 			for (const n of sourceNodes ?? []) list.push({
 				id: String(n.id ?? ""),
@@ -10803,7 +10905,7 @@ function ProviderBadge({ provider, showLabel = true, className }) {
 }
 //#endregion
 //#region src/composites/version-badge.tsx
-var VARIANT_STYLES = {
+var VARIANT_STYLES$1 = {
 	success: "bg-emerald-400 text-emerald-950",
 	warning: "bg-amber-400 text-amber-950",
 	danger: "bg-red-400 text-red-950",
@@ -10816,7 +10918,7 @@ var VARIANT_STYLES = {
 */
 function SemanticBadge({ children, variant = "neutral", mono, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		className: cn("inline-flex items-center rounded-md px-2 py-0.5 text-[11px] font-bold leading-tight", mono && "font-mono", VARIANT_STYLES[variant], className),
+		className: cn("inline-flex items-center rounded-md px-2 py-0.5 text-[11px] font-bold leading-tight", mono && "font-mono", VARIANT_STYLES$1[variant], className),
 		children
 	});
 }
@@ -10905,16 +11007,65 @@ function EmptyState({ icon: Icon, title, description, action, className }) {
 	});
 }
 //#endregion
+//#region src/composites/error-box.tsx
+var VARIANT_STYLES = {
+	danger: {
+		box: "border-danger/40 bg-danger/10",
+		icon: "text-danger",
+		title: "text-danger",
+		message: "text-danger"
+	},
+	warning: {
+		box: "border-amber-500/40 bg-amber-500/10",
+		icon: "text-amber-600 dark:text-amber-400",
+		title: "text-amber-700 dark:text-amber-300",
+		message: "text-amber-700 dark:text-amber-300"
+	}
+};
+function ErrorBox({ message, title, onRetry, action, variant = "danger", className }) {
+	const styles = VARIANT_STYLES[variant];
+	const Icon = variant === "warning" ? TriangleAlert : CircleAlert;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "alert",
+		className: cn("flex items-start gap-2.5 rounded border px-3 py-2.5", styles.box, className),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+				className: cn("h-4 w-4 mt-0.5 shrink-0", styles.icon),
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex-1 min-w-0",
+				children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: cn("text-xs font-semibold", styles.title),
+					children: title
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: cn("text-xs break-words", styles.message, title ? "mt-0.5" : ""),
+					children: message
+				})]
+			}),
+			action ?? (onRetry && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				onClick: onRetry,
+				className: cn("shrink-0 inline-flex items-center gap-1 rounded px-2 py-1 text-[11px] font-medium", "border border-current/30 hover:bg-current/10 transition-colors", styles.message),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RefreshCw, {
+					className: "h-3 w-3",
+					"aria-hidden": "true"
+				}), "Retry"]
+			}))
+		]
+	});
+}
+//#endregion
 //#region src/composites/confirm-dialog.tsx
 var ConfirmContext = createSharedContext("camstack:confirm-dialog", null);
 function useConfirm() {
-	const ctx = (0, react.useContext)(ConfirmContext);
+	const ctx = (0, react$1.useContext)(ConfirmContext);
 	if (!ctx) throw new Error("useConfirm must be used within ConfirmDialogProvider");
 	return ctx.confirm;
 }
 function ConfirmDialogProvider({ children }) {
-	const [dialog, setDialog] = (0, react.useState)(null);
-	const confirm = (0, react.useCallback)((options) => {
+	const [dialog, setDialog] = (0, react$1.useState)(null);
+	const confirm = (0, react$1.useCallback)((options) => {
 		return new Promise((resolve) => {
 			setDialog({
 				...options,
@@ -11026,8 +11177,8 @@ function KeyValueList({ items, className }) {
 //#endregion
 //#region src/composites/code-block.tsx
 function CodeBlock({ children, maxHeight = 300, className }) {
-	const [copied, setCopied] = (0, react.useState)(false);
-	const handleCopy = (0, react.useCallback)(() => {
+	const [copied, setCopied] = (0, react$1.useState)(false);
+	const handleCopy = (0, react$1.useCallback)(() => {
 		navigator.clipboard.writeText(children).then(() => {
 			setCopied(true);
 			setTimeout(() => setCopied(false), 2e3);
@@ -11057,7 +11208,7 @@ function CodeBlock({ children, maxHeight = 300, className }) {
 //#region src/composites/filter-bar.tsx
 function FilterBar({ filters, values, onChange, className }) {
 	const isMobile = useIsMobile();
-	const [sheetOpen, setSheetOpen] = (0, react.useState)(false);
+	const [sheetOpen, setSheetOpen] = (0, react$1.useState)(false);
 	const handleChange = (key, value) => {
 		onChange({
 			...values,
@@ -11222,7 +11373,7 @@ function Sidebar({ logo, sections, footer, onNavigate, className }) {
 //#region src/composites/app-shell/app-shell.tsx
 function AppShell({ sidebar, header, mobileLogo, mobileActions, children, className }) {
 	const isMobile = useIsMobile();
-	const [drawerOpen, setDrawerOpen] = (0, react.useState)(false);
+	const [drawerOpen, setDrawerOpen] = (0, react$1.useState)(false);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: cn("flex h-screen", className),
 		children: [
@@ -11408,8 +11559,8 @@ var BINDING_CHANGED_CATEGORY = "capability.binding-changed";
 * when `deviceId` is null. Re-rendered when bindings change.
 */
 function useDeviceProxy(trpc, deviceId) {
-	const [binding, setBinding] = (0, react.useState)(null);
-	(0, react.useEffect)(() => {
+	const [binding, setBinding] = (0, react$1.useState)(null);
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) {
 			setBinding(null);
 			return;
@@ -11437,7 +11588,7 @@ function useDeviceProxy(trpc, deviceId) {
 			sub?.unsubscribe();
 		};
 	}, [trpc, deviceId]);
-	return (0, react.useMemo)(() => {
+	return (0, react$1.useMemo)(() => {
 		if (!binding) return null;
 		return (0, _camstack_types.createDeviceProxy)(trpc, binding);
 	}, [trpc, binding]);
@@ -11461,12 +11612,12 @@ function useDeviceProxy(trpc, deviceId) {
 * de-dups identical pushes).
 */
 function useDeviceStateSlice(handle) {
-	const subscribe = (0, react.useCallback)((notify) => {
+	const subscribe = (0, react$1.useCallback)((notify) => {
 		if (!handle) return () => void 0;
 		return handle.subscribe(() => notify());
 	}, [handle]);
-	const getSnapshot = (0, react.useCallback)(() => handle?.value, [handle]);
-	return (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+	const getSnapshot = (0, react$1.useCallback)(() => handle?.value, [handle]);
+	return (0, react$1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
 }
 /**
 * One-line combinator — collapse the common
@@ -11751,7 +11902,7 @@ function ChildSwitchToggle({ trpc, deviceId }) {
 		cap: (d) => d.switch,
 		slice: (d) => d.state.switch
 	});
-	const [pending, setPending] = (0, react.useState)(false);
+	const [pending, setPending] = (0, react$1.useState)(false);
 	if (dev !== null && !cap) return null;
 	const on = slice?.on === true;
 	const knobStyle = { transform: on ? "translateX(14px)" : "translateX(2px)" };
@@ -11789,7 +11940,7 @@ function ChildMotionTriggerToggle({ trpc, deviceId, features }) {
 		requireFeature: "motion-trigger",
 		deviceFeatures: features
 	});
-	const [pending, setPending] = (0, react.useState)(false);
+	const [pending, setPending] = (0, react$1.useState)(false);
 	if (dev !== null && !cap) return null;
 	const on = slice?.enabled === true;
 	const handleClick = async (e) => {
@@ -11867,7 +12018,7 @@ function SwitchToggle({ trpc, deviceId }) {
 		cap: (d) => d.switch,
 		slice: (d) => d.state.switch
 	});
-	const [pending, setPending] = (0, react.useState)(false);
+	const [pending, setPending] = (0, react$1.useState)(false);
 	if (dev !== null && !cap) return null;
 	const on = slice?.on === true;
 	const knobStyle = { transform: on ? "translateX(14px)" : "translateX(2px)" };
@@ -11905,7 +12056,7 @@ function OnMotionToggle({ trpc, deviceId, features }) {
 		requireFeature: "motion-trigger",
 		deviceFeatures: features
 	});
-	const [pending, setPending] = (0, react.useState)(false);
+	const [pending, setPending] = (0, react$1.useState)(false);
 	if (dev !== null && !cap) return null;
 	const on = slice?.enabled === true;
 	const handleClick = async (e) => {
@@ -11939,10 +12090,10 @@ function MoreActionsMenu({ trpc, deviceId }) {
 		cap: (d) => d.reboot,
 		slice: () => void 0
 	});
-	const triggerRef = (0, react.useRef)(null);
-	const menuRef = (0, react.useRef)(null);
-	const [position, setPosition] = (0, react.useState)(null);
-	const [pending, setPending] = (0, react.useState)(false);
+	const triggerRef = (0, react$1.useRef)(null);
+	const menuRef = (0, react$1.useRef)(null);
+	const [position, setPosition] = (0, react$1.useState)(null);
+	const [pending, setPending] = (0, react$1.useState)(false);
 	const ready = dev !== null && cap !== void 0 && cap !== null;
 	const isOpen = position !== null;
 	const close = () => setPosition(null);
@@ -11957,7 +12108,7 @@ function MoreActionsMenu({ trpc, deviceId }) {
 			left
 		});
 	};
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!isOpen) return;
 		const onMouseDown = (e) => {
 			const trg = triggerRef.current;
@@ -12095,10 +12246,10 @@ function buildResolved(rawFeatures, binding) {
 	return out;
 }
 function useDeviceFeatures(trpc, deviceId, rawFeatures) {
-	const [binding, setBinding] = (0, react.useState)(null);
-	const [errored, setErrored] = (0, react.useState)(false);
-	const [loading, setLoading] = (0, react.useState)(true);
-	(0, react.useEffect)(() => {
+	const [binding, setBinding] = (0, react$1.useState)(null);
+	const [errored, setErrored] = (0, react$1.useState)(false);
+	const [loading, setLoading] = (0, react$1.useState)(true);
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) {
 			setBinding(null);
 			setErrored(false);
@@ -12196,8 +12347,8 @@ function ChildrenCountBadge({ accessoryCount, adoptedCount }) {
 var POPOVER_WIDTH$1 = 240;
 var POPOVER_MIN_HEIGHT = 200;
 function FeatureRow({ resolved }) {
-	const triggerRef = (0, react.useRef)(null);
-	const [position, setPosition] = (0, react.useState)(null);
+	const triggerRef = (0, react$1.useRef)(null);
+	const [position, setPosition] = (0, react$1.useState)(null);
 	const open = () => {
 		const el = triggerRef.current;
 		if (!el) return;
@@ -12390,7 +12541,7 @@ function useDeviceBattery(trpc, deviceId) {
 */
 function useDeviceSnapshotImage(trpc, deviceId) {
 	const dev = useDeviceProxy(trpc, deviceId);
-	const forceRef = (0, react.useRef)(false);
+	const forceRef = (0, react$1.useRef)(false);
 	const { data, isLoading, isFetching, refetch } = (0, _tanstack_react_query.useQuery)({
 		queryKey: [
 			"device",
@@ -12507,8 +12658,8 @@ var POPOVER_WIDTH = 288;
 var POPOVER_HEIGHT = 196;
 var TRIGGER_GAP = 8;
 function SnapshotPopoverInline({ deviceName, snapshotUrl, status }) {
-	const triggerRef = (0, react.useRef)(null);
-	const [position, setPosition] = (0, react.useState)(null);
+	const triggerRef = (0, react$1.useRef)(null);
+	const [position, setPosition] = (0, react$1.useState)(null);
 	const offline = status === "offline" || status === "disabled";
 	const open = () => {
 		const el = triggerRef.current;
@@ -12598,7 +12749,7 @@ function DeviceItem(props) {
 	const accessoryChildren = childrenList.filter(isAccessoryChild);
 	const adoptedChildren = childrenList.filter((c) => !isAccessoryChild(c));
 	const hasChildren = childrenList.length > 0;
-	const [localExpanded, setLocalExpanded] = (0, react.useState)(false);
+	const [localExpanded, setLocalExpanded] = (0, react$1.useState)(false);
 	const expanded = props.expanded ?? localExpanded;
 	const onToggleExpand = props.onToggleExpand ?? (() => setLocalExpanded((v) => !v));
 	const navigate = (id) => {
@@ -12748,8 +12899,8 @@ function DeviceItemTableRow(props) {
 * (caller's `useState`); this hook produces a debounced derivation.
 */
 function useDebouncedString(value, delayMs) {
-	const [debounced, setDebounced] = (0, react.useState)(value);
-	(0, react.useEffect)(() => {
+	const [debounced, setDebounced] = (0, react$1.useState)(value);
+	(0, react$1.useEffect)(() => {
 		const t = setTimeout(() => setDebounced(value), delayMs);
 		return () => clearTimeout(t);
 	}, [value, delayMs]);
@@ -13050,12 +13201,12 @@ function writeUrlState(scope, next, defaultView) {
 }
 function useDeviceListUrlState(options) {
 	const { scope, defaultView, lsKey } = options;
-	const [state, setState] = (0, react.useState)(() => {
+	const [state, setState] = (0, react$1.useState)(() => {
 		return readUrlState(scope, defaultView, readFromLS(lsKey));
 	});
-	const stateRef = (0, react.useRef)(state);
+	const stateRef = (0, react$1.useRef)(state);
 	stateRef.current = state;
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const handler = () => {
 			const next = readUrlState(scope, defaultView, readFromLS(lsKey));
 			stateRef.current = next;
@@ -13068,7 +13219,7 @@ function useDeviceListUrlState(options) {
 		defaultView,
 		lsKey
 	]);
-	const apply = (0, react.useCallback)((mutate) => {
+	const apply = (0, react$1.useCallback)((mutate) => {
 		const next = mutate(stateRef.current);
 		stateRef.current = next;
 		setState(next);
@@ -13086,30 +13237,30 @@ function useDeviceListUrlState(options) {
 	]);
 	return {
 		state,
-		setView: (0, react.useCallback)((view) => apply((s) => ({
+		setView: (0, react$1.useCallback)((view) => apply((s) => ({
 			...s,
 			view
 		})), [apply]),
-		setPage: (0, react.useCallback)((page) => apply((s) => ({
+		setPage: (0, react$1.useCallback)((page) => apply((s) => ({
 			...s,
 			page
 		})), [apply]),
-		setAddon: (0, react.useCallback)((addon) => apply((s) => ({
+		setAddon: (0, react$1.useCallback)((addon) => apply((s) => ({
 			...s,
 			addon,
 			page: 1
 		})), [apply]),
-		setType: (0, react.useCallback)((type) => apply((s) => ({
+		setType: (0, react$1.useCallback)((type) => apply((s) => ({
 			...s,
 			type,
 			page: 1
 		})), [apply]),
-		setQ: (0, react.useCallback)((q) => apply((s) => ({
+		setQ: (0, react$1.useCallback)((q) => apply((s) => ({
 			...s,
 			q,
 			page: 1
 		})), [apply]),
-		clearFilters: (0, react.useCallback)(() => apply((s) => ({
+		clearFilters: (0, react$1.useCallback)(() => apply((s) => ({
 			...s,
 			addon: null,
 			type: null,
@@ -13149,13 +13300,13 @@ function DeviceList(props) {
 	});
 	const view = url.state.view;
 	const currentPageSize = view === "cards" ? pageSize.cards : pageSize.table;
-	const [searchInput, setSearchInput] = (0, react.useState)(url.state.q);
+	const [searchInput, setSearchInput] = (0, react$1.useState)(url.state.q);
 	const debouncedSearch = useDebouncedString(searchInput, 300);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (debouncedSearch !== url.state.q) url.setQ(debouncedSearch);
 	}, [debouncedSearch]);
 	const effectiveAddon = forceAddon ?? url.state.addon;
-	const filtered = (0, react.useMemo)(() => {
+	const filtered = (0, react$1.useMemo)(() => {
 		const q = url.state.q.toLowerCase().trim();
 		return devices.filter((d) => {
 			if (effectiveAddon && d.addonId !== effectiveAddon) return false;
@@ -13169,8 +13320,8 @@ function DeviceList(props) {
 		url.state.type,
 		url.state.q
 	]);
-	const grouped = (0, react.useMemo)(() => groupTopLevelAndAccessories(filtered), [filtered]);
-	const autoExpandedParents = (0, react.useMemo)(() => {
+	const grouped = (0, react$1.useMemo)(() => groupTopLevelAndAccessories(filtered), [filtered]);
+	const autoExpandedParents = (0, react$1.useMemo)(() => {
 		if (url.state.q.trim() === "") return /* @__PURE__ */ new Set();
 		const q = url.state.q.toLowerCase().trim();
 		const matching = /* @__PURE__ */ new Set();
@@ -13182,7 +13333,7 @@ function DeviceList(props) {
 	const safePage = Math.min(url.state.page, totalPages);
 	const startIdx = (safePage - 1) * currentPageSize;
 	const pageRows = grouped.topLevel.slice(startIdx, startIdx + currentPageSize);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (safePage !== url.state.page) url.setPage(safePage);
 	}, [safePage]);
 	useDeviceListRealtimeSync();
@@ -13287,7 +13438,7 @@ function topLevelIndentLevel(device, parentType) {
 	return 0;
 }
 function TableLayout({ rows, accessoriesByParent, autoExpandedParents, devices, trpc, resolveIntegrationIcon, resolveParent, onNavigate }) {
-	const parentTypeById = (0, react.useMemo)(() => {
+	const parentTypeById = (0, react$1.useMemo)(() => {
 		const m = /* @__PURE__ */ new Map();
 		for (const d of devices) m.set(d.id, d.type);
 		return m;
@@ -13342,9 +13493,9 @@ function TableLayout({ rows, accessoriesByParent, autoExpandedParents, devices,
 	});
 }
 function TableRowGroup({ parent, accessories, hasAccessories, forceExpanded, trpc, integrationIcon, parentRowParent, indentLevel, onNavigate }) {
-	const [expanded, setExpanded] = (0, react.useState)(forceExpanded);
-	const prevForce = (0, react.useRef)(forceExpanded);
-	(0, react.useEffect)(() => {
+	const [expanded, setExpanded] = (0, react$1.useState)(forceExpanded);
+	const prevForce = (0, react$1.useRef)(forceExpanded);
+	(0, react$1.useEffect)(() => {
 		if (prevForce.current !== forceExpanded) {
 			setExpanded(forceExpanded);
 			prevForce.current = forceExpanded;
@@ -13508,9 +13659,9 @@ function PipelineBuilder({ schema, steps, onChange, templates, selectedTemplateI
 			inheritedEnabled: inheritedEnabledByAddon[addonId]
 		} : {}
 	});
-	const excluded = (0, react.useMemo)(() => new Set(excludeAddons), [excludeAddons]);
-	const schemaMap = (0, react.useMemo)(() => buildSchemaMap(schema), [schema]);
-	const [warnings, setWarnings] = (0, react.useState)([]);
+	const excluded = (0, react$1.useMemo)(() => new Set(excludeAddons), [excludeAddons]);
+	const schemaMap = (0, react$1.useMemo)(() => buildSchemaMap(schema), [schema]);
+	const [warnings, setWarnings] = (0, react$1.useState)([]);
 	const dirty = selectedTemplateId ? JSON.stringify(steps) !== JSON.stringify(templates.find((t) => t.id === selectedTemplateId)?.steps) : false;
 	function handleSelectTemplate(e) {
 		const id = e.target.value || null;
@@ -13965,8 +14116,8 @@ function BoundingBox({ detection, imageWidth, imageHeight, color, showConfidence
 }
 /** Renders a segmentation mask as a semi-transparent colored canvas overlay */
 function MaskOverlay({ mask, maskWidth, maskHeight, bbox, imageWidth, imageHeight, color }) {
-	const canvasRef = (0, react.useRef)(null);
-	(0, react.useEffect)(() => {
+	const canvasRef = (0, react$1.useRef)(null);
+	(0, react$1.useEffect)(() => {
 		const canvas = canvasRef.current;
 		if (!canvas) return;
 		const ctx = canvas.getContext("2d");
@@ -14278,7 +14429,7 @@ function ChildrenTree({ items, colors, hiddenKeys, onToggleVisibility }) {
 	});
 }
 function AlternateLabelsSection({ alternateLabels, colors }) {
-	const [expanded, setExpanded] = (0, react.useState)(false);
+	const [expanded, setExpanded] = (0, react$1.useState)(false);
 	const sources = Object.keys(alternateLabels);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "mt-1",
@@ -15184,11 +15335,11 @@ function SpinnerIcon({ className }) {
 	});
 }
 function LoginForm({ onLogin, serverUrl, logoSrc, error: externalError, className }) {
-	const [username, setUsername] = (0, react.useState)("");
-	const [password, setPassword] = (0, react.useState)("");
-	const [showPassword, setShowPassword] = (0, react.useState)(false);
-	const [submitting, setSubmitting] = (0, react.useState)(false);
-	const [internalError, setInternalError] = (0, react.useState)(null);
+	const [username, setUsername] = (0, react$1.useState)("");
+	const [password, setPassword] = (0, react$1.useState)("");
+	const [showPassword, setShowPassword] = (0, react$1.useState)(false);
+	const [submitting, setSubmitting] = (0, react$1.useState)(false);
+	const [internalError, setInternalError] = (0, react$1.useState)(null);
 	const error = externalError ?? internalError;
 	const handleSubmit = async (e) => {
 		e.preventDefault();
@@ -15280,9 +15431,9 @@ function LoginForm({ onLogin, serverUrl, logoSrc, error: externalError, classNam
 //#endregion
 //#region src/composites/dev-shell.tsx
 var STORAGE_KEY = "camstack_dev_token";
-var DevShellContext = (0, react.createContext)(null);
+var DevShellContext = (0, react$1.createContext)(null);
 function useDevShell() {
-	const ctx = (0, react.useContext)(DevShellContext);
+	const ctx = (0, react$1.useContext)(DevShellContext);
 	if (!ctx) throw new Error("useDevShell must be used within a DevShell");
 	return ctx;
 }
@@ -15332,7 +15483,7 @@ function MoonIcon({ className }) {
 }
 function DevShellInner({ children, serverUrl, title, token, onLogout }) {
 	const theme = require_theme_index.useThemeMode$1();
-	const links = (0, react.useMemo)(() => {
+	const links = (0, react$1.useMemo)(() => {
 		return [(0, _trpc_client.splitLink)({
 			condition: (op) => op.type === "subscription",
 			true: (0, _trpc_client.wsLink)({
@@ -15349,20 +15500,20 @@ function DevShellInner({ children, serverUrl, title, token, onLogout }) {
 			})
 		})];
 	}, [serverUrl, token]);
-	const trpc$1 = (0, react.useMemo)(() => (0, _trpc_client.createTRPCClient)({ links }), [links]);
-	const trpcReactClient = (0, react.useMemo)(() => trpc.createClient({ links }), [links]);
-	const system = (0, react.useMemo)(() => (0, _camstack_sdk.createSystem)({
+	const trpc$1 = (0, react$1.useMemo)(() => (0, _trpc_client.createTRPCClient)({ links }), [links]);
+	const trpcReactClient = (0, react$1.useMemo)(() => trpc.createClient({ links }), [links]);
+	const system = (0, react$1.useMemo)(() => (0, _camstack_sdk.createSystem)({
 		serverUrl,
 		token
 	}), [serverUrl, token]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		system.init().catch(() => void 0);
 		return () => {
 			system.close();
 		};
 	}, [system]);
-	const queryClient = (0, react.useMemo)(() => new _tanstack_react_query.QueryClient(), []);
-	const contextValue = (0, react.useMemo)(() => ({
+	const queryClient = (0, react$1.useMemo)(() => new _tanstack_react_query.QueryClient(), []);
+	const contextValue = (0, react$1.useMemo)(() => ({
 		trpc: trpc$1,
 		token,
 		logout: onLogout
@@ -15429,8 +15580,8 @@ function DevShellInner({ children, serverUrl, title, token, onLogout }) {
 	});
 }
 function DevShell({ children, serverUrl = "https://localhost:4443", title }) {
-	const [token, setToken] = (0, react.useState)(getStoredToken);
-	const handleLogin = (0, react.useCallback)(async (username, password) => {
+	const [token, setToken] = (0, react$1.useState)(getStoredToken);
+	const handleLogin = (0, react$1.useCallback)(async (username, password) => {
 		const loginResult = await (0, _trpc_client.createTRPCClient)({ links: [(0, _trpc_client.httpLink)({
 			url: `${serverUrl}/trpc`,
 			transformer: SuperJSON
@@ -15442,7 +15593,7 @@ function DevShell({ children, serverUrl = "https://localhost:4443", title }) {
 		localStorage.setItem(STORAGE_KEY, loginResult.token);
 		setToken(loginResult.token);
 	}, [serverUrl]);
-	const handleLogout = (0, react.useCallback)(() => {
+	const handleLogout = (0, react$1.useCallback)(() => {
 		localStorage.removeItem(STORAGE_KEY);
 		setToken(null);
 	}, []);
@@ -15491,10 +15642,10 @@ function mountAddonPage(PageComponent, options = {}) {
 		console.error(`[mountAddonPage] Element #${rootId} not found`);
 		return;
 	}
-	(0, react_dom_client.createRoot)(root).render((0, react.createElement)(DevShell, {
+	(0, react_dom_client.createRoot)(root).render((0, react$1.createElement)(DevShell, {
 		serverUrl,
 		title,
-		children: ({ trpc, theme }) => (0, react.createElement)(PageComponent, {
+		children: ({ trpc, theme }) => (0, react$1.createElement)(PageComponent, {
 			trpc,
 			theme: { isDark: theme.resolvedMode === "dark" },
 			navigate: (path) => {
@@ -15554,7 +15705,7 @@ function CustomFieldRenderersProvider({ renderers, children }) {
 * (or renders nothing).
 */
 function useCustomFieldRenderer(type) {
-	return (0, react.useContext)(CustomFieldRenderersContext)[type] ?? null;
+	return (0, react$1.useContext)(CustomFieldRenderersContext)[type] ?? null;
 }
 //#endregion
 //#region src/contexts/device-context.tsx
@@ -15591,11 +15742,11 @@ function DeviceContextProvider({ deviceId, device, children }) {
 }
 /** @returns the device id of the current page subtree, or null if outside any provider. */
 function useDeviceId() {
-	return (0, react.useContext)(DeviceContext)?.deviceId ?? null;
+	return (0, react$1.useContext)(DeviceContext)?.deviceId ?? null;
 }
 /** @returns the cached device snapshot, or null when no snapshot is provided. */
 function useDeviceSnapshot() {
-	return (0, react.useContext)(DeviceContext)?.device ?? null;
+	return (0, react$1.useContext)(DeviceContext)?.device ?? null;
 }
 //#endregion
 //#region src/generated/system-hooks.ts
@@ -15649,6 +15800,14 @@ var useAddonsRollbackPackage = trpc.addons.rollbackPackage.useMutation;
 var useAddonsForceRefresh = trpc.addons.forceRefresh.useMutation;
 /** Generated alias around `trpc.addons.restartServer.useMutation`. */
 var useAddonsRestartServer = trpc.addons.restartServer.useMutation;
+/** Generated alias around `trpc.addons.getLastRestart.useQuery`. */
+var useAddonsGetLastRestart = trpc.addons.getLastRestart.useQuery;
+/** Generated alias around `trpc.addons.listFrameworkPackages.useQuery`. */
+var useAddonsListFrameworkPackages = trpc.addons.listFrameworkPackages.useQuery;
+/** Generated alias around `trpc.addons.listCapabilityProviders.useQuery`. */
+var useAddonsListCapabilityProviders = trpc.addons.listCapabilityProviders.useQuery;
+/** Generated alias around `trpc.addons.updateFrameworkPackage.useMutation`. */
+var useAddonsUpdateFrameworkPackage = trpc.addons.updateFrameworkPackage.useMutation;
 /** Generated alias around `trpc.addons.getVersions.useQuery`. */
 var useAddonsGetVersions = trpc.addons.getVersions.useQuery;
 /** Generated alias around `trpc.addons.restartAddon.useMutation`. */
@@ -16748,7 +16907,7 @@ var BOOT_WINDOW_MS = 3e4;
 var POLL_INTERVAL_MS = 2e3;
 function WidgetRegistryProvider({ children }) {
 	const queryClient = (0, _tanstack_react_query.useQueryClient)();
-	const mountedAtRef = (0, react.useRef)(Date.now());
+	const mountedAtRef = (0, react$1.useRef)(Date.now());
 	const { data: rawWidgets } = useAddonWidgetsListWidgets(void 0, {
 		staleTime: 0,
 		refetchOnMount: "always",
@@ -16762,8 +16921,8 @@ function WidgetRegistryProvider({ children }) {
 	useLiveEvent("addon.widget-ready", () => {
 		queryClient.invalidateQueries({ queryKey: [["addonWidgets", "listWidgets"]] });
 	});
-	const [resolvedTick, setResolvedTick] = (0, react.useState)(0);
-	(0, react.useEffect)(() => {
+	const [resolvedTick, setResolvedTick] = (0, react$1.useState)(0);
+	(0, react$1.useEffect)(() => {
 		if (!rawWidgets) return;
 		let cancelled = false;
 		const seenRemotes = /* @__PURE__ */ new Set();
@@ -16787,7 +16946,7 @@ function WidgetRegistryProvider({ children }) {
 			cancelled = true;
 		};
 	}, [rawWidgets]);
-	const registry = (0, react.useMemo)(() => {
+	const registry = (0, react$1.useMemo)(() => {
 		const widgets = rawWidgets ?? [];
 		const byId = /* @__PURE__ */ new Map();
 		for (const w of widgets) byId.set(`${w.addonId}/${w.stableId}`, w);
@@ -16859,7 +17018,7 @@ function useOptionalWidgetRegistry() {
 	return useContextSafe(WidgetRegistryContext);
 }
 function useContextSafe(ctx) {
-	return (0, react.useContext)(ctx);
+	return (0, react$1.useContext)(ctx);
 }
 //#endregion
 //#region src/composites/widget-slot.tsx
@@ -16883,7 +17042,7 @@ function WidgetSlot(props) {
 	const { widgetId, host = "device-tab", config, deviceId, integrationId, instanceId, size, columns, rows } = props;
 	const Component = useWidget(widgetId);
 	const metadata = useWidgetMetadata(widgetId);
-	const resolvedInstanceId = (0, react.useMemo)(() => instanceId ?? widgetId, [instanceId, widgetId]);
+	const resolvedInstanceId = (0, react$1.useMemo)(() => instanceId ?? widgetId, [instanceId, widgetId]);
 	if (Component === void 0 && metadata === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetMissingError, {
 		widgetId,
 		reason: "unknown"
@@ -16977,9 +17136,9 @@ function TextField({ field, value, onChange, disabled, translationFn }) {
 	});
 }
 function NumberField({ field, value, onChange, disabled, translationFn }) {
-	const [local, setLocal] = (0, react.useState)(value === void 0 || value === null ? "" : String(value));
-	const focusedRef = (0, react.useRef)(false);
-	(0, react.useEffect)(() => {
+	const [local, setLocal] = (0, react$1.useState)(value === void 0 || value === null ? "" : String(value));
+	const focusedRef = (0, react$1.useRef)(false);
+	(0, react$1.useEffect)(() => {
 		if (focusedRef.current) return;
 		setLocal(value === void 0 || value === null ? "" : String(value));
 	}, [value]);
@@ -17145,7 +17304,7 @@ function MultiSelectField({ field, value, onChange, disabled, translationFn }) {
 	});
 }
 function PasswordField({ field, value, onChange, disabled, translationFn }) {
-	const [show, setShow] = (0, react.useState)(false);
+	const [show, setShow] = (0, react$1.useState)(false);
 	const showToggle = field.showToggle !== false;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldWrapper, {
 		label: field.label,
@@ -17312,9 +17471,9 @@ function SliderField({ field, value, onChange, disabled, translationFn }) {
 }
 function TagsField({ field, value, onChange, disabled, translationFn }) {
 	const tags = Array.isArray(value) ? value : [];
-	const [input, setInput] = (0, react.useState)("");
-	const inputRef = (0, react.useRef)(null);
-	const addTag = (0, react.useCallback)((tag) => {
+	const [input, setInput] = (0, react$1.useState)("");
+	const inputRef = (0, react$1.useRef)(null);
+	const addTag = (0, react$1.useCallback)((tag) => {
 		const trimmed = tag.trim();
 		if (!trimmed || tags.includes(trimmed)) return;
 		if (field.maxTags !== void 0 && tags.length >= field.maxTags) return;
@@ -17473,12 +17632,12 @@ function ColorField({ field, value, onChange, disabled, translationFn }) {
 	});
 }
 function ProbeField({ field, value, onChange, disabled, translationFn, onTestField, onAction, externalProbe }) {
-	const [localStatus, setLocalStatus] = (0, react.useState)("idle");
-	const [localResult, setLocalResult] = (0, react.useState)(null);
+	const [localStatus, setLocalStatus] = (0, react$1.useState)("idle");
+	const [localResult, setLocalResult] = (0, react$1.useState)(null);
 	const probeStatus = externalProbe?.status ?? localStatus;
 	const probeResult = externalProbe?.result ?? localResult;
 	const hasTestHandler = !!onTestField || !!onAction;
-	const handleTest = (0, react.useCallback)(async () => {
+	const handleTest = (0, react$1.useCallback)(async () => {
 		if (!hasTestHandler) return;
 		setLocalStatus("probing");
 		setLocalResult(null);
@@ -17557,7 +17716,7 @@ function ProbeField({ field, value, onChange, disabled, translationFn, onTestFie
 	});
 }
 function GroupField({ field, values, onChange, disabled, translationFn, onTestField }) {
-	const [collapsed, setCollapsed] = (0, react.useState)(field.defaultCollapsed ?? false);
+	const [collapsed, setCollapsed] = (0, react$1.useState)(field.defaultCollapsed ?? false);
 	const isAccordion = field.style === "accordion";
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: field.span === 2 ? "col-span-2" : field.span === 3 ? "col-span-3" : field.span === 4 ? "col-span-4" : "col-span-1",
@@ -17588,7 +17747,7 @@ function GroupField({ field, values, onChange, disabled, translationFn, onTestFi
 	});
 }
 function SubTabsField({ field, values, onChange, disabled, translationFn, onTestField, onAction }) {
-	const [active, setActive] = (0, react.useState)(field.tabs[0]?.id ?? "");
+	const [active, setActive] = (0, react$1.useState)(field.tabs[0]?.id ?? "");
 	const colSpanClass = field.span === 2 ? "col-span-2" : field.span === 3 ? "col-span-3" : field.span === 4 ? "col-span-4" : "col-span-1";
 	if (field.tabs.length === 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -17929,7 +18088,7 @@ function EditableArrayField({ field, value, onChange, disabled, translationFn, o
 	});
 }
 function ButtonField({ field, disabled, onAction }) {
-	const [loading, setLoading] = (0, react.useState)(false);
+	const [loading, setLoading] = (0, react$1.useState)(false);
 	const confirm = useConfirm();
 	const handleClick = async () => {
 		if (field.confirmMessage) {
@@ -17975,12 +18134,12 @@ function resolveActionParams(field, values) {
 	return params;
 }
 function AddonActionSelectField({ field, value, values, onChange, disabled, onAction }) {
-	const [loading, setLoading] = (0, react.useState)(false);
-	const [error, setError] = (0, react.useState)(null);
-	const [options, setOptions] = (0, react.useState)(null);
+	const [loading, setLoading] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
+	const [options, setOptions] = (0, react$1.useState)(null);
 	const params = resolveActionParams(field, values);
 	const missingParam = Object.keys(field.paramsFromForm ?? {}).some((k) => params[k] === void 0);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!onAction || missingParam) {
 			setOptions(null);
 			setError(null);
@@ -18066,8 +18225,8 @@ function AddonActionSelectField({ field, value, values, onChange, disabled, onAc
 	});
 }
 function AddonActionButtonField({ field, values, disabled, onAction }) {
-	const [loading, setLoading] = (0, react.useState)(false);
-	const [status, setStatus] = (0, react.useState)(null);
+	const [loading, setLoading] = (0, react$1.useState)(false);
+	const [status, setStatus] = (0, react$1.useState)(null);
 	const confirm = useConfirm();
 	const handleClick = async () => {
 		if (field.confirmMessage) {
@@ -18212,7 +18371,7 @@ function InlineIconGlyph({ name }) {
 */
 function InlineActionIcon({ action, fieldKey, value, onAction }) {
 	const confirm = useConfirm();
-	const [loading, setLoading] = (0, react.useState)(false);
+	const [loading, setLoading] = (0, react$1.useState)(false);
 	const variantClass = action.variant === "danger" ? "text-danger hover:bg-danger/10 border-danger/30" : action.variant === "primary" ? "text-primary hover:bg-primary/10 border-primary/30" : "text-foreground-subtle hover:text-foreground hover:bg-surface-hover border-border";
 	const handleClick = async () => {
 		if (action.confirmMessage) {
@@ -18560,7 +18719,7 @@ function resolveLabel(value, t) {
 	return value;
 }
 function SectionCard({ section, values, onChange, disabled, translationFn, onTestField, probeResults }) {
-	const [collapsed, setCollapsed] = (0, react.useState)(section.defaultCollapsed ?? false);
+	const [collapsed, setCollapsed] = (0, react$1.useState)(section.defaultCollapsed ?? false);
 	const isAccordion = section.style === "accordion";
 	const columns = section.columns ?? 2;
 	const gridClass = columns === 1 ? "grid-cols-1" : columns === 3 ? "grid-cols-1 @[480px]:grid-cols-2 @[880px]:grid-cols-3" : columns === 4 ? "grid-cols-1 @[480px]:grid-cols-2 @[1140px]:grid-cols-4" : "grid-cols-1 @[640px]:grid-cols-2";
@@ -18665,14 +18824,14 @@ function stripValues(schema) {
 }
 function AddonGlobalSettingsForm({ trpc, addonId, nodeId, title, disabled, onAfterChange, refreshToken, collapsible, defaultOpen, mode, onOverrideChange }) {
 	const effectiveMode = mode ?? "persist";
-	const [hydrated, setHydrated] = (0, react.useState)(null);
-	const [loading, setLoading] = (0, react.useState)(true);
-	const [error, setError] = (0, react.useState)(null);
-	const [saving, setSaving] = (0, react.useState)(false);
-	const [open, setOpen] = (0, react.useState)(defaultOpen ?? false);
-	const [overrideValues, setOverrideValues] = (0, react.useState)({});
-	const [baseValues, setBaseValues] = (0, react.useState)(null);
-	(0, react.useEffect)(() => {
+	const [hydrated, setHydrated] = (0, react$1.useState)(null);
+	const [loading, setLoading] = (0, react$1.useState)(true);
+	const [error, setError] = (0, react$1.useState)(null);
+	const [saving, setSaving] = (0, react$1.useState)(false);
+	const [open, setOpen] = (0, react$1.useState)(defaultOpen ?? false);
+	const [overrideValues, setOverrideValues] = (0, react$1.useState)({});
+	const [baseValues, setBaseValues] = (0, react$1.useState)(null);
+	(0, react$1.useEffect)(() => {
 		setBaseValues(null);
 		setOverrideValues({});
 	}, [
@@ -18682,7 +18841,7 @@ function AddonGlobalSettingsForm({ trpc, addonId, nodeId, title, disabled, onAft
 		refreshToken,
 		effectiveMode
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		let cancelled = false;
 		setLoading(true);
 		setError(null);
@@ -18712,8 +18871,8 @@ function AddonGlobalSettingsForm({ trpc, addonId, nodeId, title, disabled, onAft
 		effectiveMode,
 		JSON.stringify(overrideValues)
 	]);
-	const values = (0, react.useMemo)(() => extractValues(hydrated), [hydrated]);
-	const schemaNoValues = (0, react.useMemo)(() => hydrated ? stripValues(hydrated) : null, [hydrated]);
+	const values = (0, react$1.useMemo)(() => extractValues(hydrated), [hydrated]);
+	const schemaNoValues = (0, react$1.useMemo)(() => hydrated ? stripValues(hydrated) : null, [hydrated]);
 	const handleChange = async (nextValues) => {
 		if (effectiveMode === "override") {
 			const ref = baseValues ?? values;
@@ -18960,30 +19119,30 @@ function computeClientHints(container) {
 var RECONNECT_DELAY_MS = 3e3;
 var MAX_RECONNECT_ATTEMPTS = 5;
 function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, muted: initialMuted = true, showControls = true, className = "", onStateChange, onError, overlay, createSession, sendAnswer, closeSession, hintsOverride }) {
-	const videoRef = (0, react.useRef)(null);
-	const containerRef = (0, react.useRef)(null);
-	const pcRef = (0, react.useRef)(null);
+	const videoRef = (0, react$1.useRef)(null);
+	const containerRef = (0, react$1.useRef)(null);
+	const pcRef = (0, react$1.useRef)(null);
 	/** All session IDs created during this player's lifetime — closed on cleanup */
-	const sessionIdsRef = (0, react.useRef)(/* @__PURE__ */ new Set());
+	const sessionIdsRef = (0, react$1.useRef)(/* @__PURE__ */ new Set());
 	/** Abort controller to cancel in-flight connection attempts on cleanup */
-	const connectAbortRef = (0, react.useRef)(null);
-	const reconnectTimerRef = (0, react.useRef)(null);
-	const reconnectAttemptsRef = (0, react.useRef)(0);
-	const mountedRef = (0, react.useRef)(true);
-	const [state, setState] = (0, react.useState)("idle");
-	const [errorMessage, setErrorMessage] = (0, react.useState)("");
-	const [isMuted, setIsMuted] = (0, react.useState)(initialMuted);
-	const [isFullscreen, setIsFullscreen] = (0, react.useState)(false);
-	const [showToolbar, setShowToolbar] = (0, react.useState)(false);
-	const hideTimerRef = (0, react.useRef)(null);
-	const serverOfferModeRef = (0, react.useRef)(false);
+	const connectAbortRef = (0, react$1.useRef)(null);
+	const reconnectTimerRef = (0, react$1.useRef)(null);
+	const reconnectAttemptsRef = (0, react$1.useRef)(0);
+	const mountedRef = (0, react$1.useRef)(true);
+	const [state, setState] = (0, react$1.useState)("idle");
+	const [errorMessage, setErrorMessage] = (0, react$1.useState)("");
+	const [isMuted, setIsMuted] = (0, react$1.useState)(initialMuted);
+	const [isFullscreen, setIsFullscreen] = (0, react$1.useState)(false);
+	const [showToolbar, setShowToolbar] = (0, react$1.useState)(false);
+	const hideTimerRef = (0, react$1.useRef)(null);
+	const serverOfferModeRef = (0, react$1.useRef)(false);
 	if (sendAnswer || createSession) serverOfferModeRef.current = true;
 	const useServerOffer = serverOfferModeRef.current;
-	const updateState = (0, react.useCallback)((s) => {
+	const updateState = (0, react$1.useCallback)((s) => {
 		setState(s);
 		onStateChange?.(s);
 	}, [onStateChange]);
-	const cleanup = (0, react.useCallback)(() => {
+	const cleanup = (0, react$1.useCallback)(() => {
 		connectAbortRef.current?.abort();
 		connectAbortRef.current = null;
 		if (reconnectTimerRef.current) {
@@ -19000,7 +19159,7 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 		}
 		if (videoRef.current) videoRef.current.srcObject = null;
 	}, [closeSession]);
-	const connectServerOffer = (0, react.useCallback)(async () => {
+	const connectServerOffer = (0, react$1.useCallback)(async () => {
 		if (!mountedRef.current || !createSession || !sendAnswer) return;
 		cleanup();
 		updateState("connecting");
@@ -19091,7 +19250,7 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 		onError,
 		hintsOverride
 	]);
-	const connectWhep = (0, react.useCallback)(async () => {
+	const connectWhep = (0, react$1.useCallback)(async () => {
 		if (!mountedRef.current) return;
 		cleanup();
 		updateState("connecting");
@@ -19152,9 +19311,9 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 		onError
 	]);
 	const connect = useServerOffer ? connectServerOffer : connectWhep;
-	const connectRef = (0, react.useRef)(() => {});
+	const connectRef = (0, react$1.useRef)(() => {});
 	connectRef.current = connect;
-	const scheduleReconnect = (0, react.useCallback)(() => {
+	const scheduleReconnect = (0, react$1.useCallback)(() => {
 		if (!mountedRef.current) return;
 		if (reconnectAttemptsRef.current >= MAX_RECONNECT_ATTEMPTS) return;
 		reconnectAttemptsRef.current += 1;
@@ -19162,7 +19321,7 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 			if (mountedRef.current) connectRef.current();
 		}, RECONNECT_DELAY_MS);
 	}, []);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		mountedRef.current = true;
 		reconnectAttemptsRef.current = 0;
 		if (autoPlay) connect();
@@ -19171,8 +19330,8 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 			cleanup();
 		};
 	}, [serverUrl, streamKey]);
-	const hasSignaledRef = (0, react.useRef)(false);
-	(0, react.useEffect)(() => {
+	const hasSignaledRef = (0, react$1.useRef)(false);
+	(0, react$1.useEffect)(() => {
 		if (!autoPlay || !useServerOffer) return;
 		if (!createSession || !sendAnswer) return;
 		if (hasSignaledRef.current) return;
@@ -19218,7 +19377,7 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 		link.href = canvas.toDataURL("image/jpeg", .92);
 		link.click();
 	};
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const handler = () => setIsFullscreen(!!document.fullscreenElement);
 		document.addEventListener("fullscreenchange", handler);
 		return () => document.removeEventListener("fullscreenchange", handler);
@@ -19442,16 +19601,16 @@ async function waitForIceGathering(pc) {
 var PlayerOverlaysStateContext = createSharedContext("camstack:player-overlays-state", null);
 var PlayerOverlaysActionsContext = createSharedContext("camstack:player-overlays-actions", null);
 function PlayerOverlaysProvider({ children }) {
-	const [layers, setLayers] = (0, react.useState)(() => /* @__PURE__ */ new Map());
-	const [buttons, setButtons] = (0, react.useState)(() => /* @__PURE__ */ new Map());
-	const setLayer = (0, react.useCallback)((layer) => {
+	const [layers, setLayers] = (0, react$1.useState)(() => /* @__PURE__ */ new Map());
+	const [buttons, setButtons] = (0, react$1.useState)(() => /* @__PURE__ */ new Map());
+	const setLayer = (0, react$1.useCallback)((layer) => {
 		setLayers((prev) => {
 			const next = new Map(prev);
 			next.set(layer.id, layer);
 			return next;
 		});
 	}, []);
-	const removeLayer = (0, react.useCallback)((id) => {
+	const removeLayer = (0, react$1.useCallback)((id) => {
 		setLayers((prev) => {
 			if (!prev.has(id)) return prev;
 			const next = new Map(prev);
@@ -19459,14 +19618,14 @@ function PlayerOverlaysProvider({ children }) {
 			return next;
 		});
 	}, []);
-	const setButton = (0, react.useCallback)((button) => {
+	const setButton = (0, react$1.useCallback)((button) => {
 		setButtons((prev) => {
 			const next = new Map(prev);
 			next.set(button.id, button);
 			return next;
 		});
 	}, []);
-	const removeButton = (0, react.useCallback)((id) => {
+	const removeButton = (0, react$1.useCallback)((id) => {
 		setButtons((prev) => {
 			if (!prev.has(id)) return prev;
 			const next = new Map(prev);
@@ -19474,11 +19633,11 @@ function PlayerOverlaysProvider({ children }) {
 			return next;
 		});
 	}, []);
-	const stateValue = (0, react.useMemo)(() => ({
+	const stateValue = (0, react$1.useMemo)(() => ({
 		layers,
 		buttons
 	}), [layers, buttons]);
-	const actionsValue = (0, react.useMemo)(() => ({
+	const actionsValue = (0, react$1.useMemo)(() => ({
 		setLayer,
 		removeLayer,
 		setButton,
@@ -19501,16 +19660,16 @@ function PlayerOverlaysProvider({ children }) {
 *  by insertion order of the underlying Map). Returns `[]` outside a
 *  provider. */
 function usePlayerOverlayLayers() {
-	const state = (0, react.useContext)(PlayerOverlaysStateContext);
-	return (0, react.useMemo)(() => {
+	const state = (0, react$1.useContext)(PlayerOverlaysStateContext);
+	return (0, react$1.useMemo)(() => {
 		if (!state) return [];
 		return [...state.layers.values()].sort((a, b) => a.order - b.order);
 	}, [state]);
 }
 /** Snapshot of registered toolbar buttons, ordered by `order` (asc). */
 function usePlayerToolbarButtons() {
-	const state = (0, react.useContext)(PlayerOverlaysStateContext);
-	return (0, react.useMemo)(() => {
+	const state = (0, react$1.useContext)(PlayerOverlaysStateContext);
+	return (0, react$1.useMemo)(() => {
 		if (!state) return [];
 		return [...state.buttons.values()].sort((a, b) => a.order - b.order);
 	}, [state]);
@@ -19527,8 +19686,8 @@ function usePlayerToolbarButtons() {
 * effects depend on referential equality of the spec object.
 */
 function usePlayerOverlayLayer(spec) {
-	const actions = (0, react.useContext)(PlayerOverlaysActionsContext);
-	(0, react.useEffect)(() => {
+	const actions = (0, react$1.useContext)(PlayerOverlaysActionsContext);
+	(0, react$1.useEffect)(() => {
 		if (!actions || !spec) return void 0;
 		actions.setLayer(spec);
 		return () => actions.removeLayer(spec.id);
@@ -19536,8 +19695,8 @@ function usePlayerOverlayLayer(spec) {
 }
 /** Same shape as `usePlayerOverlayLayer`, scoped to toolbar buttons. */
 function usePlayerToolbarButton(spec) {
-	const actions = (0, react.useContext)(PlayerOverlaysActionsContext);
-	(0, react.useEffect)(() => {
+	const actions = (0, react$1.useContext)(PlayerOverlaysActionsContext);
+	(0, react$1.useEffect)(() => {
 		if (!actions || !spec) return void 0;
 		actions.setButton(spec);
 		return () => actions.removeButton(spec.id);
@@ -19706,13 +19865,13 @@ function ImageOffIcon({ className }) {
 }
 function StreamPanel({ serverUrl, createSession, sendAnswer, closeSession, streams, activeStreamId: controlledStreamId, onStreamChange, deviceName, phase, pipelineMetrics, detections, defaultShowDetections = true, defaultShowMotion = false, streamStats, autoPlay = false, showPlayStop = false, snapshotSrc, snapshotLoading = false, onRefreshSnapshot, showStreamStats = false, children, extraOverlay, ptzAvailable = false, ptzShown = false, ptzOverlay, onPtzToggle, intercomAvailable = false, intercomShown = false, onIntercomToggle, chromeless = false, className }) {
 	const registeredButtons = usePlayerToolbarButtons();
-	const [isPlaying, setIsPlaying] = (0, react.useState)(autoPlay);
-	const [showDetections, setShowDetections] = (0, react.useState)(defaultShowDetections);
-	const [showMotion, setShowMotion] = (0, react.useState)(defaultShowMotion);
-	const [internalStreamId, setInternalStreamId] = (0, react.useState)(null);
-	const [menuOpen, setMenuOpen] = (0, react.useState)(false);
-	const menuRef = (0, react.useRef)(null);
-	(0, react.useEffect)(() => {
+	const [isPlaying, setIsPlaying] = (0, react$1.useState)(autoPlay);
+	const [showDetections, setShowDetections] = (0, react$1.useState)(defaultShowDetections);
+	const [showMotion, setShowMotion] = (0, react$1.useState)(defaultShowMotion);
+	const [internalStreamId, setInternalStreamId] = (0, react$1.useState)(null);
+	const [menuOpen, setMenuOpen] = (0, react$1.useState)(false);
+	const menuRef = (0, react$1.useRef)(null);
+	(0, react$1.useEffect)(() => {
 		if (!menuOpen) return;
 		function onClick(e) {
 			if (menuRef.current && !menuRef.current.contains(e.target)) setMenuOpen(false);
@@ -19735,7 +19894,7 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, closeSession, strea
 			setTimeout(() => setIsPlaying(true), 50);
 		}
 	};
-	const playerCreateSession = (0, react.useMemo)(() => {
+	const playerCreateSession = (0, react$1.useMemo)(() => {
 		const target = selectedChoice?.target;
 		if (!target) return void 0;
 		return (hints) => createSession(target, hints);
@@ -20058,10 +20217,10 @@ function profileLabel(streamId) {
 	return streamId.charAt(0).toUpperCase() + streamId.slice(1);
 }
 function StreamBrokerSelector({ deviceId, value, onChange, disabled, label, className }) {
-	const labelId = (0, react.useId)();
+	const labelId = (0, react$1.useId)();
 	const query = useCameraStreamsGetRtspEntries({ deviceId }, { refetchOnWindowFocus: false });
-	const [options, setOptions] = (0, react.useState)([AUTO_OPTION]);
-	(0, react.useEffect)(() => {
+	const [options, setOptions] = (0, react$1.useState)([AUTO_OPTION]);
+	(0, react$1.useEffect)(() => {
 		if (!query.data) return;
 		const prefix = `${deviceId}/`;
 		const next = [AUTO_OPTION];
@@ -20100,6 +20259,1479 @@ function StreamBrokerSelector({ deviceId, value, onChange, disabled, label, clas
 	});
 }
 //#endregion
+//#region ../../node_modules/qrcode.react/lib/esm/index.js
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
+	enumerable: true,
+	configurable: true,
+	writable: true,
+	value
+}) : obj[key] = value;
+var __spreadValues = (a, b) => {
+	for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]);
+	if (__getOwnPropSymbols) {
+		for (var prop of __getOwnPropSymbols(b)) if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]);
+	}
+	return a;
+};
+var __objRest = (source, exclude) => {
+	var target = {};
+	for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop];
+	if (source != null && __getOwnPropSymbols) {
+		for (var prop of __getOwnPropSymbols(source)) if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop];
+	}
+	return target;
+};
+/**
+* @license QR Code generator library (TypeScript)
+* Copyright (c) Project Nayuki.
+* SPDX-License-Identifier: MIT
+*/
+var qrcodegen;
+((qrcodegen2) => {
+	const _QrCode = class _QrCode {
+		constructor(version, errorCorrectionLevel, dataCodewords, msk) {
+			this.version = version;
+			this.errorCorrectionLevel = errorCorrectionLevel;
+			this.modules = [];
+			this.isFunction = [];
+			if (version < _QrCode.MIN_VERSION || version > _QrCode.MAX_VERSION) throw new RangeError("Version value out of range");
+			if (msk < -1 || msk > 7) throw new RangeError("Mask value out of range");
+			this.size = version * 4 + 17;
+			let row = [];
+			for (let i = 0; i < this.size; i++) row.push(false);
+			for (let i = 0; i < this.size; i++) {
+				this.modules.push(row.slice());
+				this.isFunction.push(row.slice());
+			}
+			this.drawFunctionPatterns();
+			const allCodewords = this.addEccAndInterleave(dataCodewords);
+			this.drawCodewords(allCodewords);
+			if (msk == -1) {
+				let minPenalty = 1e9;
+				for (let i = 0; i < 8; i++) {
+					this.applyMask(i);
+					this.drawFormatBits(i);
+					const penalty = this.getPenaltyScore();
+					if (penalty < minPenalty) {
+						msk = i;
+						minPenalty = penalty;
+					}
+					this.applyMask(i);
+				}
+			}
+			assert(0 <= msk && msk <= 7);
+			this.mask = msk;
+			this.applyMask(msk);
+			this.drawFormatBits(msk);
+			this.isFunction = [];
+		}
+		static encodeText(text, ecl) {
+			const segs = qrcodegen2.QrSegment.makeSegments(text);
+			return _QrCode.encodeSegments(segs, ecl);
+		}
+		static encodeBinary(data, ecl) {
+			const seg = qrcodegen2.QrSegment.makeBytes(data);
+			return _QrCode.encodeSegments([seg], ecl);
+		}
+		static encodeSegments(segs, ecl, minVersion = 1, maxVersion = 40, mask = -1, boostEcl = true) {
+			if (!(_QrCode.MIN_VERSION <= minVersion && minVersion <= maxVersion && maxVersion <= _QrCode.MAX_VERSION) || mask < -1 || mask > 7) throw new RangeError("Invalid value");
+			let version;
+			let dataUsedBits;
+			for (version = minVersion;; version++) {
+				const dataCapacityBits2 = _QrCode.getNumDataCodewords(version, ecl) * 8;
+				const usedBits = QrSegment.getTotalBits(segs, version);
+				if (usedBits <= dataCapacityBits2) {
+					dataUsedBits = usedBits;
+					break;
+				}
+				if (version >= maxVersion) throw new RangeError("Data too long");
+			}
+			for (const newEcl of [
+				_QrCode.Ecc.MEDIUM,
+				_QrCode.Ecc.QUARTILE,
+				_QrCode.Ecc.HIGH
+			]) if (boostEcl && dataUsedBits <= _QrCode.getNumDataCodewords(version, newEcl) * 8) ecl = newEcl;
+			let bb = [];
+			for (const seg of segs) {
+				appendBits(seg.mode.modeBits, 4, bb);
+				appendBits(seg.numChars, seg.mode.numCharCountBits(version), bb);
+				for (const b of seg.getData()) bb.push(b);
+			}
+			assert(bb.length == dataUsedBits);
+			const dataCapacityBits = _QrCode.getNumDataCodewords(version, ecl) * 8;
+			assert(bb.length <= dataCapacityBits);
+			appendBits(0, Math.min(4, dataCapacityBits - bb.length), bb);
+			appendBits(0, (8 - bb.length % 8) % 8, bb);
+			assert(bb.length % 8 == 0);
+			for (let padByte = 236; bb.length < dataCapacityBits; padByte ^= 253) appendBits(padByte, 8, bb);
+			let dataCodewords = [];
+			while (dataCodewords.length * 8 < bb.length) dataCodewords.push(0);
+			bb.forEach((b, i) => dataCodewords[i >>> 3] |= b << 7 - (i & 7));
+			return new _QrCode(version, ecl, dataCodewords, mask);
+		}
+		getModule(x, y) {
+			return 0 <= x && x < this.size && 0 <= y && y < this.size && this.modules[y][x];
+		}
+		getModules() {
+			return this.modules;
+		}
+		drawFunctionPatterns() {
+			for (let i = 0; i < this.size; i++) {
+				this.setFunctionModule(6, i, i % 2 == 0);
+				this.setFunctionModule(i, 6, i % 2 == 0);
+			}
+			this.drawFinderPattern(3, 3);
+			this.drawFinderPattern(this.size - 4, 3);
+			this.drawFinderPattern(3, this.size - 4);
+			const alignPatPos = this.getAlignmentPatternPositions();
+			const numAlign = alignPatPos.length;
+			for (let i = 0; i < numAlign; i++) for (let j = 0; j < numAlign; j++) if (!(i == 0 && j == 0 || i == 0 && j == numAlign - 1 || i == numAlign - 1 && j == 0)) this.drawAlignmentPattern(alignPatPos[i], alignPatPos[j]);
+			this.drawFormatBits(0);
+			this.drawVersion();
+		}
+		drawFormatBits(mask) {
+			const data = this.errorCorrectionLevel.formatBits << 3 | mask;
+			let rem = data;
+			for (let i = 0; i < 10; i++) rem = rem << 1 ^ (rem >>> 9) * 1335;
+			const bits = (data << 10 | rem) ^ 21522;
+			assert(bits >>> 15 == 0);
+			for (let i = 0; i <= 5; i++) this.setFunctionModule(8, i, getBit(bits, i));
+			this.setFunctionModule(8, 7, getBit(bits, 6));
+			this.setFunctionModule(8, 8, getBit(bits, 7));
+			this.setFunctionModule(7, 8, getBit(bits, 8));
+			for (let i = 9; i < 15; i++) this.setFunctionModule(14 - i, 8, getBit(bits, i));
+			for (let i = 0; i < 8; i++) this.setFunctionModule(this.size - 1 - i, 8, getBit(bits, i));
+			for (let i = 8; i < 15; i++) this.setFunctionModule(8, this.size - 15 + i, getBit(bits, i));
+			this.setFunctionModule(8, this.size - 8, true);
+		}
+		drawVersion() {
+			if (this.version < 7) return;
+			let rem = this.version;
+			for (let i = 0; i < 12; i++) rem = rem << 1 ^ (rem >>> 11) * 7973;
+			const bits = this.version << 12 | rem;
+			assert(bits >>> 18 == 0);
+			for (let i = 0; i < 18; i++) {
+				const color = getBit(bits, i);
+				const a = this.size - 11 + i % 3;
+				const b = Math.floor(i / 3);
+				this.setFunctionModule(a, b, color);
+				this.setFunctionModule(b, a, color);
+			}
+		}
+		drawFinderPattern(x, y) {
+			for (let dy = -4; dy <= 4; dy++) for (let dx = -4; dx <= 4; dx++) {
+				const dist = Math.max(Math.abs(dx), Math.abs(dy));
+				const xx = x + dx;
+				const yy = y + dy;
+				if (0 <= xx && xx < this.size && 0 <= yy && yy < this.size) this.setFunctionModule(xx, yy, dist != 2 && dist != 4);
+			}
+		}
+		drawAlignmentPattern(x, y) {
+			for (let dy = -2; dy <= 2; dy++) for (let dx = -2; dx <= 2; dx++) this.setFunctionModule(x + dx, y + dy, Math.max(Math.abs(dx), Math.abs(dy)) != 1);
+		}
+		setFunctionModule(x, y, isDark) {
+			this.modules[y][x] = isDark;
+			this.isFunction[y][x] = true;
+		}
+		addEccAndInterleave(data) {
+			const ver = this.version;
+			const ecl = this.errorCorrectionLevel;
+			if (data.length != _QrCode.getNumDataCodewords(ver, ecl)) throw new RangeError("Invalid argument");
+			const numBlocks = _QrCode.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal][ver];
+			const blockEccLen = _QrCode.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal][ver];
+			const rawCodewords = Math.floor(_QrCode.getNumRawDataModules(ver) / 8);
+			const numShortBlocks = numBlocks - rawCodewords % numBlocks;
+			const shortBlockLen = Math.floor(rawCodewords / numBlocks);
+			let blocks = [];
+			const rsDiv = _QrCode.reedSolomonComputeDivisor(blockEccLen);
+			for (let i = 0, k = 0; i < numBlocks; i++) {
+				let dat = data.slice(k, k + shortBlockLen - blockEccLen + (i < numShortBlocks ? 0 : 1));
+				k += dat.length;
+				const ecc = _QrCode.reedSolomonComputeRemainder(dat, rsDiv);
+				if (i < numShortBlocks) dat.push(0);
+				blocks.push(dat.concat(ecc));
+			}
+			let result = [];
+			for (let i = 0; i < blocks[0].length; i++) blocks.forEach((block, j) => {
+				if (i != shortBlockLen - blockEccLen || j >= numShortBlocks) result.push(block[i]);
+			});
+			assert(result.length == rawCodewords);
+			return result;
+		}
+		drawCodewords(data) {
+			if (data.length != Math.floor(_QrCode.getNumRawDataModules(this.version) / 8)) throw new RangeError("Invalid argument");
+			let i = 0;
+			for (let right = this.size - 1; right >= 1; right -= 2) {
+				if (right == 6) right = 5;
+				for (let vert = 0; vert < this.size; vert++) for (let j = 0; j < 2; j++) {
+					const x = right - j;
+					const y = (right + 1 & 2) == 0 ? this.size - 1 - vert : vert;
+					if (!this.isFunction[y][x] && i < data.length * 8) {
+						this.modules[y][x] = getBit(data[i >>> 3], 7 - (i & 7));
+						i++;
+					}
+				}
+			}
+			assert(i == data.length * 8);
+		}
+		applyMask(mask) {
+			if (mask < 0 || mask > 7) throw new RangeError("Mask value out of range");
+			for (let y = 0; y < this.size; y++) for (let x = 0; x < this.size; x++) {
+				let invert;
+				switch (mask) {
+					case 0:
+						invert = (x + y) % 2 == 0;
+						break;
+					case 1:
+						invert = y % 2 == 0;
+						break;
+					case 2:
+						invert = x % 3 == 0;
+						break;
+					case 3:
+						invert = (x + y) % 3 == 0;
+						break;
+					case 4:
+						invert = (Math.floor(x / 3) + Math.floor(y / 2)) % 2 == 0;
+						break;
+					case 5:
+						invert = x * y % 2 + x * y % 3 == 0;
+						break;
+					case 6:
+						invert = (x * y % 2 + x * y % 3) % 2 == 0;
+						break;
+					case 7:
+						invert = ((x + y) % 2 + x * y % 3) % 2 == 0;
+						break;
+					default: throw new Error("Unreachable");
+				}
+				if (!this.isFunction[y][x] && invert) this.modules[y][x] = !this.modules[y][x];
+			}
+		}
+		getPenaltyScore() {
+			let result = 0;
+			for (let y = 0; y < this.size; y++) {
+				let runColor = false;
+				let runX = 0;
+				let runHistory = [
+					0,
+					0,
+					0,
+					0,
+					0,
+					0,
+					0
+				];
+				for (let x = 0; x < this.size; x++) if (this.modules[y][x] == runColor) {
+					runX++;
+					if (runX == 5) result += _QrCode.PENALTY_N1;
+					else if (runX > 5) result++;
+				} else {
+					this.finderPenaltyAddHistory(runX, runHistory);
+					if (!runColor) result += this.finderPenaltyCountPatterns(runHistory) * _QrCode.PENALTY_N3;
+					runColor = this.modules[y][x];
+					runX = 1;
+				}
+				result += this.finderPenaltyTerminateAndCount(runColor, runX, runHistory) * _QrCode.PENALTY_N3;
+			}
+			for (let x = 0; x < this.size; x++) {
+				let runColor = false;
+				let runY = 0;
+				let runHistory = [
+					0,
+					0,
+					0,
+					0,
+					0,
+					0,
+					0
+				];
+				for (let y = 0; y < this.size; y++) if (this.modules[y][x] == runColor) {
+					runY++;
+					if (runY == 5) result += _QrCode.PENALTY_N1;
+					else if (runY > 5) result++;
+				} else {
+					this.finderPenaltyAddHistory(runY, runHistory);
+					if (!runColor) result += this.finderPenaltyCountPatterns(runHistory) * _QrCode.PENALTY_N3;
+					runColor = this.modules[y][x];
+					runY = 1;
+				}
+				result += this.finderPenaltyTerminateAndCount(runColor, runY, runHistory) * _QrCode.PENALTY_N3;
+			}
+			for (let y = 0; y < this.size - 1; y++) for (let x = 0; x < this.size - 1; x++) {
+				const color = this.modules[y][x];
+				if (color == this.modules[y][x + 1] && color == this.modules[y + 1][x] && color == this.modules[y + 1][x + 1]) result += _QrCode.PENALTY_N2;
+			}
+			let dark = 0;
+			for (const row of this.modules) dark = row.reduce((sum, color) => sum + (color ? 1 : 0), dark);
+			const total = this.size * this.size;
+			const k = Math.ceil(Math.abs(dark * 20 - total * 10) / total) - 1;
+			assert(0 <= k && k <= 9);
+			result += k * _QrCode.PENALTY_N4;
+			assert(0 <= result && result <= 2568888);
+			return result;
+		}
+		getAlignmentPatternPositions() {
+			if (this.version == 1) return [];
+			else {
+				const numAlign = Math.floor(this.version / 7) + 2;
+				const step = this.version == 32 ? 26 : Math.ceil((this.version * 4 + 4) / (numAlign * 2 - 2)) * 2;
+				let result = [6];
+				for (let pos = this.size - 7; result.length < numAlign; pos -= step) result.splice(1, 0, pos);
+				return result;
+			}
+		}
+		static getNumRawDataModules(ver) {
+			if (ver < _QrCode.MIN_VERSION || ver > _QrCode.MAX_VERSION) throw new RangeError("Version number out of range");
+			let result = (16 * ver + 128) * ver + 64;
+			if (ver >= 2) {
+				const numAlign = Math.floor(ver / 7) + 2;
+				result -= (25 * numAlign - 10) * numAlign - 55;
+				if (ver >= 7) result -= 36;
+			}
+			assert(208 <= result && result <= 29648);
+			return result;
+		}
+		static getNumDataCodewords(ver, ecl) {
+			return Math.floor(_QrCode.getNumRawDataModules(ver) / 8) - _QrCode.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal][ver] * _QrCode.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal][ver];
+		}
+		static reedSolomonComputeDivisor(degree) {
+			if (degree < 1 || degree > 255) throw new RangeError("Degree out of range");
+			let result = [];
+			for (let i = 0; i < degree - 1; i++) result.push(0);
+			result.push(1);
+			let root = 1;
+			for (let i = 0; i < degree; i++) {
+				for (let j = 0; j < result.length; j++) {
+					result[j] = _QrCode.reedSolomonMultiply(result[j], root);
+					if (j + 1 < result.length) result[j] ^= result[j + 1];
+				}
+				root = _QrCode.reedSolomonMultiply(root, 2);
+			}
+			return result;
+		}
+		static reedSolomonComputeRemainder(data, divisor) {
+			let result = divisor.map((_) => 0);
+			for (const b of data) {
+				const factor = b ^ result.shift();
+				result.push(0);
+				divisor.forEach((coef, i) => result[i] ^= _QrCode.reedSolomonMultiply(coef, factor));
+			}
+			return result;
+		}
+		static reedSolomonMultiply(x, y) {
+			if (x >>> 8 != 0 || y >>> 8 != 0) throw new RangeError("Byte out of range");
+			let z = 0;
+			for (let i = 7; i >= 0; i--) {
+				z = z << 1 ^ (z >>> 7) * 285;
+				z ^= (y >>> i & 1) * x;
+			}
+			assert(z >>> 8 == 0);
+			return z;
+		}
+		finderPenaltyCountPatterns(runHistory) {
+			const n = runHistory[1];
+			assert(n <= this.size * 3);
+			const core = n > 0 && runHistory[2] == n && runHistory[3] == n * 3 && runHistory[4] == n && runHistory[5] == n;
+			return (core && runHistory[0] >= n * 4 && runHistory[6] >= n ? 1 : 0) + (core && runHistory[6] >= n * 4 && runHistory[0] >= n ? 1 : 0);
+		}
+		finderPenaltyTerminateAndCount(currentRunColor, currentRunLength, runHistory) {
+			if (currentRunColor) {
+				this.finderPenaltyAddHistory(currentRunLength, runHistory);
+				currentRunLength = 0;
+			}
+			currentRunLength += this.size;
+			this.finderPenaltyAddHistory(currentRunLength, runHistory);
+			return this.finderPenaltyCountPatterns(runHistory);
+		}
+		finderPenaltyAddHistory(currentRunLength, runHistory) {
+			if (runHistory[0] == 0) currentRunLength += this.size;
+			runHistory.pop();
+			runHistory.unshift(currentRunLength);
+		}
+	};
+	_QrCode.MIN_VERSION = 1;
+	_QrCode.MAX_VERSION = 40;
+	_QrCode.PENALTY_N1 = 3;
+	_QrCode.PENALTY_N2 = 3;
+	_QrCode.PENALTY_N3 = 40;
+	_QrCode.PENALTY_N4 = 10;
+	_QrCode.ECC_CODEWORDS_PER_BLOCK = [
+		[
+			-1,
+			7,
+			10,
+			15,
+			20,
+			26,
+			18,
+			20,
+			24,
+			30,
+			18,
+			20,
+			24,
+			26,
+			30,
+			22,
+			24,
+			28,
+			30,
+			28,
+			28,
+			28,
+			28,
+			30,
+			30,
+			26,
+			28,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30
+		],
+		[
+			-1,
+			10,
+			16,
+			26,
+			18,
+			24,
+			16,
+			18,
+			22,
+			22,
+			26,
+			30,
+			22,
+			22,
+			24,
+			24,
+			28,
+			28,
+			26,
+			26,
+			26,
+			26,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28,
+			28
+		],
+		[
+			-1,
+			13,
+			22,
+			18,
+			26,
+			18,
+			24,
+			18,
+			22,
+			20,
+			24,
+			28,
+			26,
+			24,
+			20,
+			30,
+			24,
+			28,
+			28,
+			26,
+			30,
+			28,
+			30,
+			30,
+			30,
+			30,
+			28,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30
+		],
+		[
+			-1,
+			17,
+			28,
+			22,
+			16,
+			22,
+			28,
+			26,
+			26,
+			24,
+			28,
+			24,
+			28,
+			22,
+			24,
+			24,
+			30,
+			28,
+			28,
+			26,
+			28,
+			30,
+			24,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30,
+			30
+		]
+	];
+	_QrCode.NUM_ERROR_CORRECTION_BLOCKS = [
+		[
+			-1,
+			1,
+			1,
+			1,
+			1,
+			1,
+			2,
+			2,
+			2,
+			2,
+			4,
+			4,
+			4,
+			4,
+			4,
+			6,
+			6,
+			6,
+			6,
+			7,
+			8,
+			8,
+			9,
+			9,
+			10,
+			12,
+			12,
+			12,
+			13,
+			14,
+			15,
+			16,
+			17,
+			18,
+			19,
+			19,
+			20,
+			21,
+			22,
+			24,
+			25
+		],
+		[
+			-1,
+			1,
+			1,
+			1,
+			2,
+			2,
+			4,
+			4,
+			4,
+			5,
+			5,
+			5,
+			8,
+			9,
+			9,
+			10,
+			10,
+			11,
+			13,
+			14,
+			16,
+			17,
+			17,
+			18,
+			20,
+			21,
+			23,
+			25,
+			26,
+			28,
+			29,
+			31,
+			33,
+			35,
+			37,
+			38,
+			40,
+			43,
+			45,
+			47,
+			49
+		],
+		[
+			-1,
+			1,
+			1,
+			2,
+			2,
+			4,
+			4,
+			6,
+			6,
+			8,
+			8,
+			8,
+			10,
+			12,
+			16,
+			12,
+			17,
+			16,
+			18,
+			21,
+			20,
+			23,
+			23,
+			25,
+			27,
+			29,
+			34,
+			34,
+			35,
+			38,
+			40,
+			43,
+			45,
+			48,
+			51,
+			53,
+			56,
+			59,
+			62,
+			65,
+			68
+		],
+		[
+			-1,
+			1,
+			1,
+			2,
+			4,
+			4,
+			4,
+			5,
+			6,
+			8,
+			8,
+			11,
+			11,
+			16,
+			16,
+			18,
+			16,
+			19,
+			21,
+			25,
+			25,
+			25,
+			34,
+			30,
+			32,
+			35,
+			37,
+			40,
+			42,
+			45,
+			48,
+			51,
+			54,
+			57,
+			60,
+			63,
+			66,
+			70,
+			74,
+			77,
+			81
+		]
+	];
+	qrcodegen2.QrCode = _QrCode;
+	function appendBits(val, len, bb) {
+		if (len < 0 || len > 31 || val >>> len != 0) throw new RangeError("Value out of range");
+		for (let i = len - 1; i >= 0; i--) bb.push(val >>> i & 1);
+	}
+	function getBit(x, i) {
+		return (x >>> i & 1) != 0;
+	}
+	function assert(cond) {
+		if (!cond) throw new Error("Assertion error");
+	}
+	const _QrSegment = class _QrSegment {
+		constructor(mode, numChars, bitData) {
+			this.mode = mode;
+			this.numChars = numChars;
+			this.bitData = bitData;
+			if (numChars < 0) throw new RangeError("Invalid argument");
+			this.bitData = bitData.slice();
+		}
+		static makeBytes(data) {
+			let bb = [];
+			for (const b of data) appendBits(b, 8, bb);
+			return new _QrSegment(_QrSegment.Mode.BYTE, data.length, bb);
+		}
+		static makeNumeric(digits) {
+			if (!_QrSegment.isNumeric(digits)) throw new RangeError("String contains non-numeric characters");
+			let bb = [];
+			for (let i = 0; i < digits.length;) {
+				const n = Math.min(digits.length - i, 3);
+				appendBits(parseInt(digits.substring(i, i + n), 10), n * 3 + 1, bb);
+				i += n;
+			}
+			return new _QrSegment(_QrSegment.Mode.NUMERIC, digits.length, bb);
+		}
+		static makeAlphanumeric(text) {
+			if (!_QrSegment.isAlphanumeric(text)) throw new RangeError("String contains unencodable characters in alphanumeric mode");
+			let bb = [];
+			let i;
+			for (i = 0; i + 2 <= text.length; i += 2) {
+				let temp = _QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)) * 45;
+				temp += _QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i + 1));
+				appendBits(temp, 11, bb);
+			}
+			if (i < text.length) appendBits(_QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)), 6, bb);
+			return new _QrSegment(_QrSegment.Mode.ALPHANUMERIC, text.length, bb);
+		}
+		static makeSegments(text) {
+			if (text == "") return [];
+			else if (_QrSegment.isNumeric(text)) return [_QrSegment.makeNumeric(text)];
+			else if (_QrSegment.isAlphanumeric(text)) return [_QrSegment.makeAlphanumeric(text)];
+			else return [_QrSegment.makeBytes(_QrSegment.toUtf8ByteArray(text))];
+		}
+		static makeEci(assignVal) {
+			let bb = [];
+			if (assignVal < 0) throw new RangeError("ECI assignment value out of range");
+			else if (assignVal < 128) appendBits(assignVal, 8, bb);
+			else if (assignVal < 16384) {
+				appendBits(2, 2, bb);
+				appendBits(assignVal, 14, bb);
+			} else if (assignVal < 1e6) {
+				appendBits(6, 3, bb);
+				appendBits(assignVal, 21, bb);
+			} else throw new RangeError("ECI assignment value out of range");
+			return new _QrSegment(_QrSegment.Mode.ECI, 0, bb);
+		}
+		static isNumeric(text) {
+			return _QrSegment.NUMERIC_REGEX.test(text);
+		}
+		static isAlphanumeric(text) {
+			return _QrSegment.ALPHANUMERIC_REGEX.test(text);
+		}
+		getData() {
+			return this.bitData.slice();
+		}
+		static getTotalBits(segs, version) {
+			let result = 0;
+			for (const seg of segs) {
+				const ccbits = seg.mode.numCharCountBits(version);
+				if (seg.numChars >= 1 << ccbits) return Infinity;
+				result += 4 + ccbits + seg.bitData.length;
+			}
+			return result;
+		}
+		static toUtf8ByteArray(str) {
+			str = encodeURI(str);
+			let result = [];
+			for (let i = 0; i < str.length; i++) if (str.charAt(i) != "%") result.push(str.charCodeAt(i));
+			else {
+				result.push(parseInt(str.substring(i + 1, i + 3), 16));
+				i += 2;
+			}
+			return result;
+		}
+	};
+	_QrSegment.NUMERIC_REGEX = /^[0-9]*$/;
+	_QrSegment.ALPHANUMERIC_REGEX = /^[A-Z0-9 $%*+.\/:-]*$/;
+	_QrSegment.ALPHANUMERIC_CHARSET = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:";
+	let QrSegment = _QrSegment;
+	qrcodegen2.QrSegment = _QrSegment;
+})(qrcodegen || (qrcodegen = {}));
+((qrcodegen2) => {
+	((QrCode2) => {
+		const _Ecc = class _Ecc {
+			constructor(ordinal, formatBits) {
+				this.ordinal = ordinal;
+				this.formatBits = formatBits;
+			}
+		};
+		_Ecc.LOW = new _Ecc(0, 1);
+		_Ecc.MEDIUM = new _Ecc(1, 0);
+		_Ecc.QUARTILE = new _Ecc(2, 3);
+		_Ecc.HIGH = new _Ecc(3, 2);
+		QrCode2.Ecc = _Ecc;
+	})(qrcodegen2.QrCode || (qrcodegen2.QrCode = {}));
+})(qrcodegen || (qrcodegen = {}));
+((qrcodegen2) => {
+	((QrSegment2) => {
+		const _Mode = class _Mode {
+			constructor(modeBits, numBitsCharCount) {
+				this.modeBits = modeBits;
+				this.numBitsCharCount = numBitsCharCount;
+			}
+			numCharCountBits(ver) {
+				return this.numBitsCharCount[Math.floor((ver + 7) / 17)];
+			}
+		};
+		_Mode.NUMERIC = new _Mode(1, [
+			10,
+			12,
+			14
+		]);
+		_Mode.ALPHANUMERIC = new _Mode(2, [
+			9,
+			11,
+			13
+		]);
+		_Mode.BYTE = new _Mode(4, [
+			8,
+			16,
+			16
+		]);
+		_Mode.KANJI = new _Mode(8, [
+			8,
+			10,
+			12
+		]);
+		_Mode.ECI = new _Mode(7, [
+			0,
+			0,
+			0
+		]);
+		QrSegment2.Mode = _Mode;
+	})(qrcodegen2.QrSegment || (qrcodegen2.QrSegment = {}));
+})(qrcodegen || (qrcodegen = {}));
+var qrcodegen_default = qrcodegen;
+/**
+* @license qrcode.react
+* Copyright (c) Paul O'Shannessy
+* SPDX-License-Identifier: ISC
+*/
+var ERROR_LEVEL_MAP = {
+	L: qrcodegen_default.QrCode.Ecc.LOW,
+	M: qrcodegen_default.QrCode.Ecc.MEDIUM,
+	Q: qrcodegen_default.QrCode.Ecc.QUARTILE,
+	H: qrcodegen_default.QrCode.Ecc.HIGH
+};
+var DEFAULT_SIZE$1 = 128;
+var DEFAULT_LEVEL = "L";
+var DEFAULT_BGCOLOR = "#FFFFFF";
+var DEFAULT_FGCOLOR = "#000000";
+var DEFAULT_INCLUDEMARGIN = false;
+var DEFAULT_MINVERSION = 1;
+var SPEC_MARGIN_SIZE = 4;
+var DEFAULT_MARGIN_SIZE = 0;
+var DEFAULT_IMG_SCALE = .1;
+function generatePath(modules, margin = 0) {
+	const ops = [];
+	modules.forEach(function(row, y) {
+		let start = null;
+		row.forEach(function(cell, x) {
+			if (!cell && start !== null) {
+				ops.push(`M${start + margin} ${y + margin}h${x - start}v1H${start + margin}z`);
+				start = null;
+				return;
+			}
+			if (x === row.length - 1) {
+				if (!cell) return;
+				if (start === null) ops.push(`M${x + margin},${y + margin} h1v1H${x + margin}z`);
+				else ops.push(`M${start + margin},${y + margin} h${x + 1 - start}v1H${start + margin}z`);
+				return;
+			}
+			if (cell && start === null) start = x;
+		});
+	});
+	return ops.join("");
+}
+function excavateModules(modules, excavation) {
+	return modules.slice().map((row, y) => {
+		if (y < excavation.y || y >= excavation.y + excavation.h) return row;
+		return row.map((cell, x) => {
+			if (x < excavation.x || x >= excavation.x + excavation.w) return cell;
+			return false;
+		});
+	});
+}
+function getImageSettings(cells, size, margin, imageSettings) {
+	if (imageSettings == null) return null;
+	const numCells = cells.length + margin * 2;
+	const defaultSize = Math.floor(size * DEFAULT_IMG_SCALE);
+	const scale = numCells / size;
+	const w = (imageSettings.width || defaultSize) * scale;
+	const h = (imageSettings.height || defaultSize) * scale;
+	const x = imageSettings.x == null ? cells.length / 2 - w / 2 : imageSettings.x * scale;
+	const y = imageSettings.y == null ? cells.length / 2 - h / 2 : imageSettings.y * scale;
+	const opacity = imageSettings.opacity == null ? 1 : imageSettings.opacity;
+	let excavation = null;
+	if (imageSettings.excavate) {
+		let floorX = Math.floor(x);
+		let floorY = Math.floor(y);
+		excavation = {
+			x: floorX,
+			y: floorY,
+			w: Math.ceil(w + x - floorX),
+			h: Math.ceil(h + y - floorY)
+		};
+	}
+	const crossOrigin = imageSettings.crossOrigin;
+	return {
+		x,
+		y,
+		h,
+		w,
+		excavation,
+		opacity,
+		crossOrigin
+	};
+}
+function getMarginSize(includeMargin, marginSize) {
+	if (marginSize != null) return Math.max(Math.floor(marginSize), 0);
+	return includeMargin ? SPEC_MARGIN_SIZE : DEFAULT_MARGIN_SIZE;
+}
+function useQRCode({ value, level, minVersion, includeMargin, marginSize, imageSettings, size, boostLevel }) {
+	let qrcode = react.default.useMemo(() => {
+		const segments = (Array.isArray(value) ? value : [value]).reduce((accum, v) => {
+			accum.push(...qrcodegen_default.QrSegment.makeSegments(v));
+			return accum;
+		}, []);
+		return qrcodegen_default.QrCode.encodeSegments(segments, ERROR_LEVEL_MAP[level], minVersion, void 0, void 0, boostLevel);
+	}, [
+		value,
+		level,
+		minVersion,
+		boostLevel
+	]);
+	const { cells, margin, numCells, calculatedImageSettings } = react.default.useMemo(() => {
+		let cells2 = qrcode.getModules();
+		const margin2 = getMarginSize(includeMargin, marginSize);
+		return {
+			cells: cells2,
+			margin: margin2,
+			numCells: cells2.length + margin2 * 2,
+			calculatedImageSettings: getImageSettings(cells2, size, margin2, imageSettings)
+		};
+	}, [
+		qrcode,
+		size,
+		imageSettings,
+		includeMargin,
+		marginSize
+	]);
+	return {
+		qrcode,
+		margin,
+		cells,
+		numCells,
+		calculatedImageSettings
+	};
+}
+var SUPPORTS_PATH2D = function() {
+	try {
+		new Path2D().addPath(new Path2D());
+	} catch (e) {
+		return false;
+	}
+	return true;
+}();
+var QRCodeCanvas = react.default.forwardRef(function QRCodeCanvas2(props, forwardedRef) {
+	const _a = props, { value, size = DEFAULT_SIZE$1, level = DEFAULT_LEVEL, bgColor = DEFAULT_BGCOLOR, fgColor = DEFAULT_FGCOLOR, includeMargin = DEFAULT_INCLUDEMARGIN, minVersion = DEFAULT_MINVERSION, boostLevel, marginSize, imageSettings } = _a;
+	const _b = __objRest(_a, [
+		"value",
+		"size",
+		"level",
+		"bgColor",
+		"fgColor",
+		"includeMargin",
+		"minVersion",
+		"boostLevel",
+		"marginSize",
+		"imageSettings"
+	]), { style } = _b, otherProps = __objRest(_b, ["style"]);
+	const imgSrc = imageSettings == null ? void 0 : imageSettings.src;
+	const _canvas = react.default.useRef(null);
+	const _image = react.default.useRef(null);
+	const setCanvasRef = react.default.useCallback((node) => {
+		_canvas.current = node;
+		if (typeof forwardedRef === "function") forwardedRef(node);
+		else if (forwardedRef) forwardedRef.current = node;
+	}, [forwardedRef]);
+	const [isImgLoaded, setIsImageLoaded] = react.default.useState(false);
+	const { margin, cells, numCells, calculatedImageSettings } = useQRCode({
+		value,
+		level,
+		minVersion,
+		boostLevel,
+		includeMargin,
+		marginSize,
+		imageSettings,
+		size
+	});
+	react.default.useEffect(() => {
+		if (_canvas.current != null) {
+			const canvas = _canvas.current;
+			const ctx = canvas.getContext("2d");
+			if (!ctx) return;
+			let cellsToDraw = cells;
+			const image = _image.current;
+			const haveImageToRender = calculatedImageSettings != null && image !== null && image.complete && image.naturalHeight !== 0 && image.naturalWidth !== 0;
+			if (haveImageToRender) {
+				if (calculatedImageSettings.excavation != null) cellsToDraw = excavateModules(cells, calculatedImageSettings.excavation);
+			}
+			const pixelRatio = window.devicePixelRatio || 1;
+			canvas.height = canvas.width = size * pixelRatio;
+			const scale = size / numCells * pixelRatio;
+			ctx.scale(scale, scale);
+			ctx.fillStyle = bgColor;
+			ctx.fillRect(0, 0, numCells, numCells);
+			ctx.fillStyle = fgColor;
+			if (SUPPORTS_PATH2D) ctx.fill(new Path2D(generatePath(cellsToDraw, margin)));
+			else cells.forEach(function(row, rdx) {
+				row.forEach(function(cell, cdx) {
+					if (cell) ctx.fillRect(cdx + margin, rdx + margin, 1, 1);
+				});
+			});
+			if (calculatedImageSettings) ctx.globalAlpha = calculatedImageSettings.opacity;
+			if (haveImageToRender) ctx.drawImage(image, calculatedImageSettings.x + margin, calculatedImageSettings.y + margin, calculatedImageSettings.w, calculatedImageSettings.h);
+		}
+	});
+	react.default.useEffect(() => {
+		setIsImageLoaded(false);
+	}, [imgSrc]);
+	const canvasStyle = __spreadValues({
+		height: size,
+		width: size
+	}, style);
+	let img = null;
+	if (imgSrc != null) img = /* @__PURE__ */ react.default.createElement("img", {
+		src: imgSrc,
+		key: imgSrc,
+		style: { display: "none" },
+		onLoad: () => {
+			setIsImageLoaded(true);
+		},
+		ref: _image,
+		crossOrigin: calculatedImageSettings == null ? void 0 : calculatedImageSettings.crossOrigin
+	});
+	return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("canvas", __spreadValues({
+		style: canvasStyle,
+		height: size,
+		width: size,
+		ref: setCanvasRef,
+		role: "img"
+	}, otherProps)), img);
+});
+QRCodeCanvas.displayName = "QRCodeCanvas";
+var QRCodeSVG = react.default.forwardRef(function QRCodeSVG2(props, forwardedRef) {
+	const _a = props, { value, size = DEFAULT_SIZE$1, level = DEFAULT_LEVEL, bgColor = DEFAULT_BGCOLOR, fgColor = DEFAULT_FGCOLOR, includeMargin = DEFAULT_INCLUDEMARGIN, minVersion = DEFAULT_MINVERSION, boostLevel, title, marginSize, imageSettings } = _a, otherProps = __objRest(_a, [
+		"value",
+		"size",
+		"level",
+		"bgColor",
+		"fgColor",
+		"includeMargin",
+		"minVersion",
+		"boostLevel",
+		"title",
+		"marginSize",
+		"imageSettings"
+	]);
+	const { margin, cells, numCells, calculatedImageSettings } = useQRCode({
+		value,
+		level,
+		minVersion,
+		boostLevel,
+		includeMargin,
+		marginSize,
+		imageSettings,
+		size
+	});
+	let cellsToDraw = cells;
+	let image = null;
+	if (imageSettings != null && calculatedImageSettings != null) {
+		if (calculatedImageSettings.excavation != null) cellsToDraw = excavateModules(cells, calculatedImageSettings.excavation);
+		image = /* @__PURE__ */ react.default.createElement("image", {
+			href: imageSettings.src,
+			height: calculatedImageSettings.h,
+			width: calculatedImageSettings.w,
+			x: calculatedImageSettings.x + margin,
+			y: calculatedImageSettings.y + margin,
+			preserveAspectRatio: "none",
+			opacity: calculatedImageSettings.opacity,
+			crossOrigin: calculatedImageSettings.crossOrigin
+		});
+	}
+	const fgPath = generatePath(cellsToDraw, margin);
+	return /* @__PURE__ */ react.default.createElement("svg", __spreadValues({
+		height: size,
+		width: size,
+		viewBox: `0 0 ${numCells} ${numCells}`,
+		ref: forwardedRef,
+		role: "img"
+	}, otherProps), !!title && /* @__PURE__ */ react.default.createElement("title", null, title), /* @__PURE__ */ react.default.createElement("path", {
+		fill: bgColor,
+		d: `M0,0 h${numCells}v${numCells}H0z`,
+		shapeRendering: "crispEdges"
+	}), /* @__PURE__ */ react.default.createElement("path", {
+		fill: fgColor,
+		d: fgPath,
+		shapeRendering: "crispEdges"
+	}), image);
+});
+QRCodeSVG.displayName = "QRCodeSVG";
+//#endregion
+//#region src/composites/qr-code.tsx
+var DEFAULT_SIZE = 192;
+function QrCode({ value, size = DEFAULT_SIZE, className, alt }) {
+	const trimmed = value.trim();
+	if (trimmed.length === 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: cn("inline-flex rounded-md bg-white p-2", className),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(QRCodeSVG, {
+			value: trimmed,
+			size,
+			marginSize: 1,
+			title: alt ?? "QR code"
+		})
+	});
+}
+//#endregion
+//#region src/composites/copy-button.tsx
+/**
+* `CopyButton` — a compact button that copies a string `value` to the
+* clipboard via `navigator.clipboard.writeText`, showing a brief
+* "copied" check state. Addon-agnostic; used wherever a secret / URL
+* needs a one-click copy affordance (export setup panels, etc.).
+*/
+var COPIED_RESET_MS = 2e3;
+function CopyButton({ value, label, className, disabled }) {
+	const [copied, setCopied] = (0, react$1.useState)(false);
+	const handleCopy = (0, react$1.useCallback)(() => {
+		if (!value) return;
+		navigator.clipboard.writeText(value).then(() => {
+			setCopied(true);
+			setTimeout(() => setCopied(false), COPIED_RESET_MS);
+		});
+	}, [value]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+		size: "sm",
+		variant: "ghost",
+		type: "button",
+		disabled: disabled || value.length === 0,
+		onClick: handleCopy,
+		className: cn(className),
+		"aria-label": copied ? "Copied" : `Copy ${label ?? "value"}`,
+		children: [copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, { className: "h-3.5 w-3.5 text-success" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Copy, { className: "h-3.5 w-3.5" }), label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "ml-1",
+			children: copied ? "Copied" : label
+		}) : null]
+	});
+}
+//#endregion
+//#region src/composites/device-export-panel.tsx
+/**
+* DeviceExportPanel — generic, addon-agnostic surface for the
+* `device-export` capability.
+*
+* Renders the COMMON device-export surface for a single export addon
+* (HomeAssistant via MQTT, HomeKit/HAP, Alexa Smart Home, …):
+*
+*   - a link-state status badge + exposed-device count from `getStatus`,
+*   - the exposed-devices table from `listExposedDevices` (device name,
+*     status, stream preference) with a per-row unexpose action
+*     (`unexposeDevice`),
+*   - an empty state directing the operator to the device-details page.
+*
+* This composite is the reusable replacement for the per-addon
+* Module-Federation overview tables that each export addon used to
+* ship. It is driven entirely by the `device-export` cap — there are no
+* Alexa / HAP / MQTT specifics here. Mount it next to an export addon's
+* standard settings form (e.g. in the addon-settings modal).
+*
+* Routing note: `device-export` is a collection cap; the codegen'd
+* router resolves `{ nodeId }` to the first registered provider. Export
+* addons are all `hub-only`, so the panel queries `nodeId: 'hub'`. When
+* multiple device-export addons are co-installed the cap-router today
+* resolves to the first provider only (per-provider routing is a
+* separate follow-up) — identical behaviour to the pages it replaces.
+*/
+var ExposedDeviceArraySchema = zod.z.array(_camstack_types.ExposedDeviceSchema);
+var STATUS_POLL_INTERVAL_MS = 1e4;
+function statusVariant(state) {
+	if (state === "linked") return "success";
+	if (state === "error") return "danger";
+	return "warning";
+}
+function capitaliseLinkState(state) {
+	if (state === "linked") return "Linked";
+	if (state === "unlinked") return "Unlinked";
+	if (state === "error") return "Error";
+	return state;
+}
+/**
+* A single label/value row in the Setup section. `secret` rows mask the
+* value behind a reveal toggle; every row gets a copy button.
+*/
+function SetupFieldRow({ field }) {
+	const [revealed, setRevealed] = (0, react$1.useState)(false);
+	const isSecret = field.secret === true;
+	const displayValue = isSecret && !revealed ? "•".repeat(Math.min(field.value.length, 24)) : field.value;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center gap-2 py-1.5",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-[11px] text-foreground-subtle w-32 shrink-0",
+				children: field.label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "flex-1 min-w-0 truncate font-mono text-xs text-foreground",
+				children: displayValue || "—"
+			}),
+			isSecret && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+				size: "sm",
+				variant: "ghost",
+				type: "button",
+				"aria-label": revealed ? "Hide value" : "Reveal value",
+				onClick: () => setRevealed((v) => !v),
+				children: revealed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EyeOff, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Eye, { className: "h-3.5 w-3.5" })
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopyButton, {
+				value: field.value,
+				label: field.label
+			})
+		]
+	});
+}
+/**
+* Generic "Setup" section — pairing QR + copyable label/value rows +
+* operator note. Driven entirely by the cap's `setup` block; renders
+* nothing addon-specific.
+*/
+function SetupSection({ setup }) {
+	const fields = setup.fields ?? [];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-b border-border bg-surface-hover/10",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-2 px-4 py-2 border-b border-border",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(QrCode$1, { className: "h-3.5 w-3.5 text-foreground-subtle shrink-0" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-[11px] font-semibold text-foreground-subtle uppercase tracking-wide",
+				children: "Setup"
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col gap-3 p-4 sm:flex-row sm:items-start",
+			children: [setup.qr && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "shrink-0",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(QrCode, {
+					value: setup.qr,
+					alt: "Pairing QR code"
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex-1 min-w-0",
+				children: [setup.note && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-xs text-foreground-muted whitespace-pre-line mb-2",
+					children: setup.note
+				}), fields.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "divide-y divide-border-subtle",
+					children: fields.map((field) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SetupFieldRow, { field }, field.label))
+				})]
+			})]
+		})]
+	});
+}
+/**
+* Generic device-export panel. Addon-agnostic — only the `device-export`
+* cap drives it.
+*/
+function DeviceExportPanel({ addonId, onOpenDevice }) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const statusQuery = useDeviceExportGetStatus({ nodeId: "hub" }, {
+		refetchInterval: STATUS_POLL_INTERVAL_MS,
+		retry: false
+	});
+	const exposedQuery = useDeviceExportListExposedDevices({ nodeId: "hub" }, {
+		refetchInterval: STATUS_POLL_INTERVAL_MS,
+		retry: false
+	});
+	const unexposeMutation = useDeviceExportUnexposeDevice({ onSuccess: () => {
+		queryClient.invalidateQueries({ queryKey: [["deviceExport"]] });
+	} });
+	const status = (0, react$1.useMemo)(() => {
+		const parsed = _camstack_types.DeviceExportStatusSchema.safeParse(statusQuery.data);
+		return parsed.success ? parsed.data : null;
+	}, [statusQuery.data]);
+	const exposed = (0, react$1.useMemo)(() => {
+		const parsed = ExposedDeviceArraySchema.safeParse(exposedQuery.data);
+		return parsed.success ? parsed.data : [];
+	}, [exposedQuery.data]);
+	const linkState = status?.linkState ?? "unlinked";
+	const rows = (0, react$1.useMemo)(() => exposed.map((entry) => ({
+		deviceId: entry.deviceId,
+		displayName: entry.exposedAs ?? `Device ${entry.deviceId}`,
+		streamPreference: "auto",
+		linkState
+	})), [exposed, linkState]);
+	const loading = statusQuery.isLoading || exposedQuery.isLoading;
+	const exposedCount = status?.exposedDeviceCount ?? rows.length;
+	const columns = (0, react$1.useMemo)(() => [
+		{
+			key: "device",
+			header: "Device",
+			render: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-foreground font-medium",
+					children: row.displayName
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "text-foreground-subtle text-xs font-mono",
+					children: ["#", row.deviceId]
+				})]
+			})
+		},
+		{
+			key: "status",
+			header: "Status",
+			render: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+				variant: statusVariant(row.linkState),
+				children: capitaliseLinkState(row.linkState)
+			})
+		},
+		{
+			key: "stream",
+			header: "Stream",
+			render: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-xs text-foreground-subtle font-mono",
+				children: row.streamPreference === "auto" ? "Auto" : row.streamPreference
+			})
+		},
+		{
+			key: "actions",
+			header: "",
+			align: "right",
+			render: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-end gap-2",
+				children: [onOpenDevice && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+					size: "sm",
+					variant: "ghost",
+					onClick: () => onOpenDevice(row.deviceId),
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ExternalLink, { className: "h-3.5 w-3.5 mr-1" }), "Open"]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+					size: "sm",
+					variant: "ghost",
+					disabled: unexposeMutation.isPending,
+					onClick: () => unexposeMutation.mutate({
+						deviceId: row.deviceId,
+						nodeId: "hub"
+					}),
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Unlink2, { className: "h-3.5 w-3.5 mr-1" }), "Unexpose"]
+				})]
+			})
+		}
+	], [onOpenDevice, unexposeMutation]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "rounded-lg border border-border bg-surface overflow-hidden",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-between gap-3 px-4 py-2.5 border-b border-border bg-surface-hover/20",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center gap-2 min-w-0",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Share2, { className: "h-3.5 w-3.5 text-foreground-subtle shrink-0" }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-[11px] font-semibold text-foreground-subtle uppercase tracking-wide",
+							children: "Exported devices"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+							variant: statusVariant(linkState),
+							children: capitaliseLinkState(linkState)
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "text-[11px] text-foreground-subtle",
+							children: [exposedCount, " exposed"]
+						})
+					]
+				}), loading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin text-foreground-subtle" })]
+			}),
+			status?.error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "px-4 py-3 border-b border-border",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorBox, { message: status.error })
+			}),
+			status?.setup && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SetupSection, { setup: status.setup }),
+			rows.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmptyState, {
+				icon: Share2,
+				title: "No devices exposed",
+				description: `Expose a camera to "${addonId}" from its device-details page to surface it in the connected ecosystem.`
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "p-3",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTable, {
+					columns,
+					rows,
+					rowKey: (row) => row.deviceId
+				})
+			})
+		]
+	});
+}
+//#endregion
 //#region src/composites/audio-waveform.tsx
 /**
 * Canvas-based audio waveform visualization.
@@ -20107,9 +21739,9 @@ function StreamBrokerSelector({ deviceId, value, onChange, disabled, label, clas
 * Downsamples to pixel resolution for performance.
 */
 function AudioWaveform({ samples, sampleRate = 16e3, height = 96, className = "", color = "#3b82f6", bgColor = "transparent" }) {
-	const canvasRef = (0, react.useRef)(null);
-	const containerRef = (0, react.useRef)(null);
-	const draw = (0, react.useCallback)(() => {
+	const canvasRef = (0, react$1.useRef)(null);
+	const containerRef = (0, react$1.useRef)(null);
+	const draw = (0, react$1.useCallback)(() => {
 		const canvas = canvasRef.current;
 		const container = containerRef.current;
 		if (!canvas || !container || !samples || samples.length === 0) return;
@@ -20161,10 +21793,10 @@ function AudioWaveform({ samples, sampleRate = 16e3, height = 96, className = ""
 		color,
 		bgColor
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		draw();
 	}, [draw]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const observer = new ResizeObserver(() => draw());
 		const el = containerRef.current;
 		if (el) observer.observe(el);
@@ -20203,10 +21835,10 @@ function AudioWaveform({ samples, sampleRate = 16e3, height = 96, className = ""
 * (each chunk, ~0.5s, produces one sample via `frame.level.dbfs`).
 */
 function AudioLevelWaveform({ currentDbfs, durationSec = 30, maxSamples = 120, height = 64, className = "", color = "#10b981", clipColor = "#ef4444", clipThreshold = -6, minDbfs = -96 }) {
-	const canvasRef = (0, react.useRef)(null);
-	const containerRef = (0, react.useRef)(null);
-	const [samples, setSamples] = (0, react.useState)([]);
-	(0, react.useEffect)(() => {
+	const canvasRef = (0, react$1.useRef)(null);
+	const containerRef = (0, react$1.useRef)(null);
+	const [samples, setSamples] = (0, react$1.useState)([]);
+	(0, react$1.useEffect)(() => {
 		if (currentDbfs === null) return;
 		setSamples((prev) => {
 			const next = [...prev, {
@@ -20216,7 +21848,7 @@ function AudioLevelWaveform({ currentDbfs, durationSec = 30, maxSamples = 120, h
 			return next.length > maxSamples ? next.slice(-maxSamples) : next;
 		});
 	}, [currentDbfs, maxSamples]);
-	const draw = (0, react.useCallback)(() => {
+	const draw = (0, react$1.useCallback)(() => {
 		const canvas = canvasRef.current;
 		const container = containerRef.current;
 		if (!canvas || !container) return;
@@ -20269,10 +21901,10 @@ function AudioLevelWaveform({ currentDbfs, durationSec = 30, maxSamples = 120, h
 		clipThreshold,
 		minDbfs
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		draw();
 	}, [draw]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const observer = new ResizeObserver(() => draw());
 		const el = containerRef.current;
 		if (el) observer.observe(el);
@@ -20394,7 +22026,7 @@ function AudioClassificationList({ classifications, processing = false, inferenc
 * Expandable log box showing the raw JSON response from a pipeline run.
 */
 function ResponseLog({ data, label = "Response", className = "" }) {
-	const [expanded, setExpanded] = (0, react.useState)(false);
+	const [expanded, setExpanded] = (0, react$1.useState)(false);
 	if (!data) return null;
 	const json = JSON.stringify(data, null, 2);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -20466,17 +22098,17 @@ function PhaseIcon({ phase, ...props }) {
 * keeping idle subscriptions alive.
 */
 function useLiveBuffer(max) {
-	const [entries, setEntries] = (0, react.useState)([]);
-	const append = (0, react.useCallback)((entry) => {
+	const [entries, setEntries] = (0, react$1.useState)([]);
+	const append = (0, react$1.useCallback)((entry) => {
 		setEntries((prev) => {
 			const next = [...prev, entry];
 			return next.length > max ? next.slice(-max) : next;
 		});
 	}, [max]);
-	const reset = (0, react.useCallback)(() => {
+	const reset = (0, react$1.useCallback)(() => {
 		setEntries([]);
 	}, []);
-	return (0, react.useMemo)(() => ({
+	return (0, react$1.useMemo)(() => ({
 		entries,
 		append,
 		reset
@@ -20550,15 +22182,15 @@ function passesLevel(logLevel, filterLevel) {
 	return (LEVEL_SEVERITY[logLevel] ?? 0) >= (LEVEL_SEVERITY[filterLevel] ?? 0);
 }
 function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: propsDeviceId, integrationId: propsIntegrationId, requestId: propsRequestId, level: initialLevel, maxHeight = "max-h-96", showScope = false, showFilters = true, limit = 100, liveBuffer: externalBuffer, onClose, className }) {
-	const [localAddonId, setLocalAddonId] = (0, react.useState)("");
-	const [localDeviceId, setLocalDeviceId] = (0, react.useState)("");
-	const [levelFilter, setLevelFilter] = (0, react.useState)(initialLevel);
+	const [localAddonId, setLocalAddonId] = (0, react$1.useState)("");
+	const [localDeviceId, setLocalDeviceId] = (0, react$1.useState)("");
+	const [levelFilter, setLevelFilter] = (0, react$1.useState)(initialLevel);
 	const agentId = propsAgentId;
 	const addonId = propsAddonId ?? (localAddonId || void 0);
 	const deviceId = propsDeviceId ?? (localDeviceId ? Number(localDeviceId) : void 0);
 	const integrationId = propsIntegrationId;
 	const requestId = propsRequestId;
-	const tags = (0, react.useMemo)(() => {
+	const tags = (0, react$1.useMemo)(() => {
 		const t = {};
 		if (agentId) t.agentId = agentId;
 		if (addonId) t.addonId = addonId;
@@ -20576,15 +22208,15 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 	const fallbackBuffer = useLiveBuffer(MAX_LIVE_ENTRIES$2);
 	const buffer = externalBuffer ?? fallbackBuffer;
 	const liveLogs = buffer.entries;
-	const [clearedAt, setClearedAt] = (0, react.useState)(0);
-	const [autoScroll, setAutoScroll] = (0, react.useState)(false);
-	const [copied, setCopied] = (0, react.useState)(false);
-	const [expandedRows, setExpandedRows] = (0, react.useState)(/* @__PURE__ */ new Set());
-	const [searchText, setSearchText] = (0, react.useState)("");
-	const scrollRef = (0, react.useRef)(null);
+	const [clearedAt, setClearedAt] = (0, react$1.useState)(0);
+	const [autoScroll, setAutoScroll] = (0, react$1.useState)(false);
+	const [copied, setCopied] = (0, react$1.useState)(false);
+	const [expandedRows, setExpandedRows] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [searchText, setSearchText] = (0, react$1.useState)("");
+	const scrollRef = (0, react$1.useRef)(null);
 	const scopeKey = `${agentId ?? ""}:${addonId ?? ""}:${String(deviceId ?? "")}:${integrationId ?? ""}:${requestId ?? ""}`;
-	const prevScopeRef = (0, react.useRef)(scopeKey);
-	(0, react.useEffect)(() => {
+	const prevScopeRef = (0, react$1.useRef)(scopeKey);
+	(0, react$1.useEffect)(() => {
 		if (prevScopeRef.current !== scopeKey) {
 			prevScopeRef.current = scopeKey;
 			buffer.reset();
@@ -20599,8 +22231,8 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 	trpc.logs.subscribe.useSubscription({ ...tags ? { tags } : {} }, { onData: (entry) => {
 		buffer.append(entry);
 	} });
-	const prevLiveCountRef = (0, react.useRef)(liveLogs.length);
-	(0, react.useEffect)(() => {
+	const prevLiveCountRef = (0, react$1.useRef)(liveLogs.length);
+	(0, react$1.useEffect)(() => {
 		const el = scrollRef.current;
 		if (!el) {
 			prevLiveCountRef.current = liveLogs.length;
@@ -20616,7 +22248,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 			el.scrollTop += rowHeight * (liveLogs.length - prevCount);
 		}
 	}, [liveLogs.length, autoScroll]);
-	const allLogs = (0, react.useMemo)(() => {
+	const allLogs = (0, react$1.useMemo)(() => {
 		const initial = (initialLogs ?? []).map((log) => ({
 			timestamp: log.timestamp,
 			level: log.level,
@@ -20661,7 +22293,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 		clearedAt,
 		searchText
 	]);
-	const handleCopyAll = (0, react.useCallback)(() => {
+	const handleCopyAll = (0, react$1.useCallback)(() => {
 		const lines = allLogs.map((log) => {
 			const time = new Date(log.timestamp).toLocaleTimeString();
 			const tagsStr = log.tags ? " " + Object.entries(log.tags).filter(([, v]) => v).map(([k, v]) => `${k}=${v}`).join(" ") : "";
@@ -20673,7 +22305,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 		});
 	}, [allLogs]);
 	const clearMutation = trpc.logs.clear.useMutation();
-	const handleClear = (0, react.useCallback)(() => {
+	const handleClear = (0, react$1.useCallback)(() => {
 		setClearedAt(Date.now());
 		buffer.reset();
 		clearMutation.mutate({ ...tags ? { tags } : {} });
@@ -20682,7 +22314,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 		clearMutation,
 		tags
 	]);
-	const toggleRow = (0, react.useCallback)((rowKey) => {
+	const toggleRow = (0, react$1.useCallback)((rowKey) => {
 		setExpandedRows((prev) => {
 			const next = new Set(prev);
 			if (next.has(rowKey)) next.delete(rowKey);
@@ -20690,8 +22322,8 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 			return next;
 		});
 	}, []);
-	const [copiedRowKey, setCopiedRowKey] = (0, react.useState)(null);
-	const copyOne = (0, react.useCallback)((log, key) => {
+	const [copiedRowKey, setCopiedRowKey] = (0, react$1.useState)(null);
+	const copyOne = (0, react$1.useCallback)((log, key) => {
 		const time = new Date(log.timestamp).toISOString();
 		const tagsStr = log.tags ? " " + Object.entries(log.tags).filter(([, v]) => v).map(([k, v]) => `${k}=${v}`).join(" ") : "";
 		const metaStr = log.meta && Object.keys(log.meta).length > 0 ? ` meta=${JSON.stringify(log.meta)}` : "";
@@ -20701,7 +22333,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 			setTimeout(() => setCopiedRowKey((prev) => prev === key ? null : prev), 1200);
 		});
 	}, []);
-	const rowKey = (0, react.useCallback)((log) => `${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`, []);
+	const rowKey = (0, react$1.useCallback)((log) => `${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`, []);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: cn("h-full min-h-0 flex flex-col", className),
 		onClick: (e) => e.stopPropagation(),
@@ -21266,11 +22898,11 @@ function hasContent(entry) {
 }
 var MAX_LIVE_ENTRIES$1 = 300;
 function EventStream({ agentId, addonId, deviceId, defaultCategories, categories: legacyCategories, category: propsCategory, maxHeight = "max-h-96", limit = 50, showCategoryFilter = true, showFilters: _showFilters = false, liveBuffer: externalBuffer, onClose, className }) {
-	const defaultsArray = (0, react.useMemo)(() => defaultCategories ?? legacyCategories ?? DEFAULT_EVENT_CATEGORIES, [defaultCategories, legacyCategories]);
-	const defaultsKey = (0, react.useMemo)(() => [...defaultsArray].sort().join(","), [defaultsArray]);
-	const [activeCategories, setActiveCategories] = (0, react.useState)(() => new Set(defaultsArray));
-	const prevDefaultsKey = (0, react.useRef)(defaultsKey);
-	(0, react.useEffect)(() => {
+	const defaultsArray = (0, react$1.useMemo)(() => defaultCategories ?? legacyCategories ?? DEFAULT_EVENT_CATEGORIES, [defaultCategories, legacyCategories]);
+	const defaultsKey = (0, react$1.useMemo)(() => [...defaultsArray].sort().join(","), [defaultsArray]);
+	const [activeCategories, setActiveCategories] = (0, react$1.useState)(() => new Set(defaultsArray));
+	const prevDefaultsKey = (0, react$1.useRef)(defaultsKey);
+	(0, react$1.useEffect)(() => {
 		if (prevDefaultsKey.current !== defaultsKey) {
 			prevDefaultsKey.current = defaultsKey;
 			setActiveCategories(new Set(defaultsArray));
@@ -21279,17 +22911,17 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 	const fallbackBuffer = useLiveBuffer(MAX_LIVE_ENTRIES$1);
 	const buffer = externalBuffer ?? fallbackBuffer;
 	const liveEvents = buffer.entries;
-	const [autoScroll, setAutoScroll] = (0, react.useState)(true);
-	const [expandedRows, setExpandedRows] = (0, react.useState)(/* @__PURE__ */ new Set());
-	const [searchText, setSearchText] = (0, react.useState)("");
-	const [filterOpen, setFilterOpen] = (0, react.useState)(false);
-	const [categorySearch, setCategorySearch] = (0, react.useState)("");
-	const [clearedAt, setClearedAt] = (0, react.useState)(0);
-	const scrollRef = (0, react.useRef)(null);
-	const filterRootRef = (0, react.useRef)(null);
+	const [autoScroll, setAutoScroll] = (0, react$1.useState)(true);
+	const [expandedRows, setExpandedRows] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [searchText, setSearchText] = (0, react$1.useState)("");
+	const [filterOpen, setFilterOpen] = (0, react$1.useState)(false);
+	const [categorySearch, setCategorySearch] = (0, react$1.useState)("");
+	const [clearedAt, setClearedAt] = (0, react$1.useState)(0);
+	const scrollRef = (0, react$1.useRef)(null);
+	const filterRootRef = (0, react$1.useRef)(null);
 	const scopeKey = `${agentId ?? ""}:${addonId ?? ""}:${String(deviceId ?? "")}:${propsCategory ?? ""}`;
-	const prevScopeRef = (0, react.useRef)(scopeKey);
-	(0, react.useEffect)(() => {
+	const prevScopeRef = (0, react$1.useRef)(scopeKey);
+	(0, react$1.useEffect)(() => {
 		if (prevScopeRef.current !== scopeKey) {
 			prevScopeRef.current = scopeKey;
 			buffer.reset();
@@ -21297,7 +22929,7 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 			setClearedAt(0);
 		}
 	}, [scopeKey, buffer]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!filterOpen) return;
 		const onDocClick = (e) => {
 			const root = filterRootRef.current;
@@ -21308,7 +22940,7 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 			document.removeEventListener("mousedown", onDocClick);
 		};
 	}, [filterOpen]);
-	const scopeInput = (0, react.useMemo)(() => {
+	const scopeInput = (0, react$1.useMemo)(() => {
 		const s = {};
 		if (agentId) s.agentId = agentId;
 		if (addonId) s.addonId = addonId;
@@ -21321,8 +22953,8 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 		deviceId,
 		propsCategory
 	]);
-	const activeArray = (0, react.useMemo)(() => [...activeCategories].sort(), [activeCategories]);
-	const getRecentInput = (0, react.useMemo)(() => {
+	const activeArray = (0, react$1.useMemo)(() => [...activeCategories].sort(), [activeCategories]);
+	const getRecentInput = (0, react$1.useMemo)(() => {
 		const s = {
 			...scopeInput,
 			limit
@@ -21332,12 +22964,12 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 	}, [
 		scopeInput,
 		limit,
-		(0, react.useMemo)(() => activeArray.join(","), [activeArray]),
+		(0, react$1.useMemo)(() => activeArray.join(","), [activeArray]),
 		activeArray
 	]);
 	const { data: initialEvents, isLoading } = trpc.systemEvents.getRecent.useQuery(getRecentInput, { staleTime: 3e4 });
-	const activeCategoriesRef = (0, react.useRef)(activeCategories);
-	(0, react.useEffect)(() => {
+	const activeCategoriesRef = (0, react$1.useRef)(activeCategories);
+	(0, react$1.useEffect)(() => {
 		activeCategoriesRef.current = activeCategories;
 	}, [activeCategories]);
 	const subInput = scopeInput;
@@ -21348,8 +22980,8 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 		if (!activeCategoriesRef.current.has(entry.category)) return;
 		buffer.append(entry);
 	} });
-	const prevLiveCountRef = (0, react.useRef)(liveEvents.length);
-	(0, react.useEffect)(() => {
+	const prevLiveCountRef = (0, react$1.useRef)(liveEvents.length);
+	(0, react$1.useEffect)(() => {
 		const el = scrollRef.current;
 		if (!el) {
 			prevLiveCountRef.current = liveEvents.length;
@@ -21365,7 +22997,7 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 			el.scrollTop += rowHeight * (liveEvents.length - prevCount);
 		}
 	}, [liveEvents.length, autoScroll]);
-	const allEvents = (0, react.useMemo)(() => {
+	const allEvents = (0, react$1.useMemo)(() => {
 		const byId = /* @__PURE__ */ new Map();
 		for (const e of initialEvents ?? []) byId.set(e.id, e);
 		for (const e of liveEvents) byId.set(e.id, e);
@@ -21394,7 +23026,7 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 		searchText,
 		clearedAt
 	]);
-	const toggleRow = (0, react.useCallback)((id) => {
+	const toggleRow = (0, react$1.useCallback)((id) => {
 		setExpandedRows((prev) => {
 			const next = new Set(prev);
 			if (next.has(id)) next.delete(id);
@@ -21402,7 +23034,7 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 			return next;
 		});
 	}, []);
-	const toggleCategory = (0, react.useCallback)((cat) => {
+	const toggleCategory = (0, react$1.useCallback)((cat) => {
 		setActiveCategories((prev) => {
 			const next = new Set(prev);
 			if (next.has(cat)) next.delete(cat);
@@ -21410,43 +23042,43 @@ function EventStream({ agentId, addonId, deviceId, defaultCategories, categories
 			return next;
 		});
 	}, []);
-	const handleReset = (0, react.useCallback)(() => {
+	const handleReset = (0, react$1.useCallback)(() => {
 		setActiveCategories(new Set(defaultsArray));
 		setSearchText("");
 		setClearedAt(0);
 	}, [defaultsArray]);
-	const handleClear = (0, react.useCallback)(() => {
+	const handleClear = (0, react$1.useCallback)(() => {
 		setClearedAt(Date.now());
 		buffer.reset();
 	}, [buffer]);
-	const [copiedAll, setCopiedAll] = (0, react.useState)(false);
-	const [copiedRowId, setCopiedRowId] = (0, react.useState)(null);
-	const formatEventForCopy = (0, react.useCallback)((event) => {
+	const [copiedAll, setCopiedAll] = (0, react$1.useState)(false);
+	const [copiedRowId, setCopiedRowId] = (0, react$1.useState)(null);
+	const formatEventForCopy = (0, react$1.useCallback)((event) => {
 		const time = new Date(event.timestamp).toISOString();
 		const summary = summarizeEvent(event.category, event.data) ?? "";
 		const summaryStr = summary ? `  ${summary}` : "";
 		return `${time} [${event.category}]${summaryStr}  data=${JSON.stringify(event.data)}`;
 	}, []);
-	const handleCopyAll = (0, react.useCallback)(() => {
+	const handleCopyAll = (0, react$1.useCallback)(() => {
 		const lines = allEvents.map(formatEventForCopy);
 		navigator.clipboard.writeText(lines.join("\n")).then(() => {
 			setCopiedAll(true);
 			setTimeout(() => setCopiedAll(false), 1500);
 		});
 	}, [allEvents, formatEventForCopy]);
-	const copyOne = (0, react.useCallback)((event) => {
+	const copyOne = (0, react$1.useCallback)((event) => {
 		navigator.clipboard.writeText(formatEventForCopy(event)).then(() => {
 			setCopiedRowId(event.id);
 			setTimeout(() => setCopiedRowId((prev) => prev === event.id ? null : prev), 1200);
 		});
 	}, [formatEventForCopy]);
-	const handleSelectAll = (0, react.useCallback)(() => {
+	const handleSelectAll = (0, react$1.useCallback)(() => {
 		setActiveCategories(new Set(ALL_EVENT_CATEGORIES));
 	}, []);
-	const handleSelectNone = (0, react.useCallback)(() => {
+	const handleSelectNone = (0, react$1.useCallback)(() => {
 		setActiveCategories(/* @__PURE__ */ new Set());
 	}, []);
-	const filteredPopoverCategories = (0, react.useMemo)(() => {
+	const filteredPopoverCategories = (0, react$1.useMemo)(() => {
 		const needle = categorySearch.trim().toLowerCase();
 		if (!needle) return ALL_EVENT_CATEGORIES;
 		return ALL_EVENT_CATEGORIES.filter((c) => c.toLowerCase().includes(needle));
@@ -21824,8 +23456,8 @@ function DiscoveryPanel({ deviceId, className = "", onOpenChild }) {
 	const releaseMutation = trpc.deviceDiscovery.releaseDevice.useMutation({ onSuccess: () => {
 		utils.deviceDiscovery.listDiscovered.invalidate({ deviceId });
 	} });
-	const [busyChildId, setBusyChildId] = (0, react.useState)(null);
-	const { available, adopted } = (0, react.useMemo)(() => {
+	const [busyChildId, setBusyChildId] = (0, react$1.useState)(null);
+	const { available, adopted } = (0, react$1.useMemo)(() => {
 		const list = listQuery.data ?? [];
 		const sortKey = (c) => typeof c.metadata.rtspChannel === "number" ? c.metadata.rtspChannel : Number.POSITIVE_INFINITY;
 		const byChannel = (a, b) => {
@@ -22104,20 +23736,20 @@ var MAX_LIVE_ENTRIES = 300;
 */
 var ALL_DEVICE_CAP_NAMES = Object.freeze([...new Set(_camstack_types.ALL_CAPABILITY_DEFINITIONS.filter((c) => c.scope === "device").map((c) => c.name))].sort());
 function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limit = 50, liveBuffer: externalBuffer, onClose, className }) {
-	const [activeCaps, setActiveCaps] = (0, react.useState)((0, react.useMemo)(() => new Set(defaultCaps ?? []), [defaultCaps]));
-	const [searchText, setSearchText] = (0, react.useState)("");
-	const [autoScroll, setAutoScroll] = (0, react.useState)(true);
-	const [expandedRows, setExpandedRows] = (0, react.useState)(/* @__PURE__ */ new Set());
-	const [clearedAt, setClearedAt] = (0, react.useState)(0);
-	const [filterOpen, setFilterOpen] = (0, react.useState)(false);
-	const [filterSearch, setFilterSearch] = (0, react.useState)("");
-	const filterRootRef = (0, react.useRef)(null);
+	const [activeCaps, setActiveCaps] = (0, react$1.useState)((0, react$1.useMemo)(() => new Set(defaultCaps ?? []), [defaultCaps]));
+	const [searchText, setSearchText] = (0, react$1.useState)("");
+	const [autoScroll, setAutoScroll] = (0, react$1.useState)(true);
+	const [expandedRows, setExpandedRows] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [clearedAt, setClearedAt] = (0, react$1.useState)(0);
+	const [filterOpen, setFilterOpen] = (0, react$1.useState)(false);
+	const [filterSearch, setFilterSearch] = (0, react$1.useState)("");
+	const filterRootRef = (0, react$1.useRef)(null);
 	const fallbackBuffer = useLiveBuffer(MAX_LIVE_ENTRIES);
 	const buffer = externalBuffer ?? fallbackBuffer;
 	const liveEvents = buffer.entries;
-	const scrollRef = (0, react.useRef)(null);
-	const prevDeviceRef = (0, react.useRef)(deviceId);
-	(0, react.useEffect)(() => {
+	const scrollRef = (0, react$1.useRef)(null);
+	const prevDeviceRef = (0, react$1.useRef)(deviceId);
+	(0, react$1.useEffect)(() => {
 		if (prevDeviceRef.current !== deviceId) {
 			prevDeviceRef.current = deviceId;
 			buffer.reset();
@@ -22125,14 +23757,14 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 			setClearedAt(0);
 		}
 	}, [deviceId, buffer]);
-	const recentInput = (0, react.useMemo)(() => ({
+	const recentInput = (0, react$1.useMemo)(() => ({
 		deviceId,
 		category: _camstack_types.EventCategory.DeviceStateChanged,
 		limit
 	}), [deviceId, limit]);
 	const { data: initialEvents, isLoading } = trpc.systemEvents.getRecent.useQuery(recentInput, { staleTime: 3e4 });
-	const activeCapsRef = (0, react.useRef)(activeCaps);
-	(0, react.useEffect)(() => {
+	const activeCapsRef = (0, react$1.useRef)(activeCaps);
+	(0, react$1.useEffect)(() => {
 		activeCapsRef.current = activeCaps;
 	}, [activeCaps]);
 	trpc.systemEvents.subscribe.useSubscription({
@@ -22146,8 +23778,8 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 		if (active.size > 0 && !active.has(entry.capName)) return;
 		buffer.append(entry);
 	} });
-	const prevLiveCountRef = (0, react.useRef)(liveEvents.length);
-	(0, react.useEffect)(() => {
+	const prevLiveCountRef = (0, react$1.useRef)(liveEvents.length);
+	(0, react$1.useEffect)(() => {
 		const el = scrollRef.current;
 		if (!el) {
 			prevLiveCountRef.current = liveEvents.length;
@@ -22164,7 +23796,7 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 			el.scrollTop += rowHeight * newCount;
 		}
 	}, [liveEvents.length, autoScroll]);
-	const allEntries = (0, react.useMemo)(() => {
+	const allEntries = (0, react$1.useMemo)(() => {
 		const byId = /* @__PURE__ */ new Map();
 		for (const e of initialEvents ?? []) {
 			const entry = toEntry(e);
@@ -22196,7 +23828,7 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 		searchText,
 		clearedAt
 	]);
-	const visibleCaps = (0, react.useMemo)(() => {
+	const visibleCaps = (0, react$1.useMemo)(() => {
 		const caps = new Set(ALL_DEVICE_CAP_NAMES);
 		for (const e of initialEvents ?? []) {
 			const entry = toEntry(e);
@@ -22205,7 +23837,7 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 		for (const e of liveEvents) caps.add(e.capName);
 		return [...caps].sort();
 	}, [initialEvents, liveEvents]);
-	const toggleRow = (0, react.useCallback)((id) => {
+	const toggleRow = (0, react$1.useCallback)((id) => {
 		setExpandedRows((prev) => {
 			const next = new Set(prev);
 			if (next.has(id)) next.delete(id);
@@ -22213,7 +23845,7 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 			return next;
 		});
 	}, []);
-	const toggleCap = (0, react.useCallback)((cap) => {
+	const toggleCap = (0, react$1.useCallback)((cap) => {
 		setActiveCaps((prev) => {
 			const next = new Set(prev);
 			if (next.has(cap)) next.delete(cap);
@@ -22221,39 +23853,39 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 			return next;
 		});
 	}, []);
-	const handleReset = (0, react.useCallback)(() => {
+	const handleReset = (0, react$1.useCallback)(() => {
 		setActiveCaps(new Set(defaultCaps ?? []));
 		setSearchText("");
 	}, [defaultCaps]);
-	const handleClear = (0, react.useCallback)(() => {
+	const handleClear = (0, react$1.useCallback)(() => {
 		setClearedAt(Date.now());
 		buffer.reset();
 	}, [buffer]);
-	const [copiedAll, setCopiedAll] = (0, react.useState)(false);
-	const [copiedRowId, setCopiedRowId] = (0, react.useState)(null);
-	const formatEntryForCopy = (0, react.useCallback)((entry) => {
+	const [copiedAll, setCopiedAll] = (0, react$1.useState)(false);
+	const [copiedRowId, setCopiedRowId] = (0, react$1.useState)(null);
+	const formatEntryForCopy = (0, react$1.useCallback)((entry) => {
 		return `${new Date(entry.timestamp).toISOString()} [${entry.capName}]  slice=${JSON.stringify(entry.slice)}`;
 	}, []);
-	const handleCopyAll = (0, react.useCallback)(() => {
+	const handleCopyAll = (0, react$1.useCallback)(() => {
 		const lines = allEntries.map(formatEntryForCopy);
 		navigator.clipboard.writeText(lines.join("\n")).then(() => {
 			setCopiedAll(true);
 			setTimeout(() => setCopiedAll(false), 1500);
 		});
 	}, [allEntries, formatEntryForCopy]);
-	const copyOne = (0, react.useCallback)((entry) => {
+	const copyOne = (0, react$1.useCallback)((entry) => {
 		navigator.clipboard.writeText(formatEntryForCopy(entry)).then(() => {
 			setCopiedRowId(entry.id);
 			setTimeout(() => setCopiedRowId((prev) => prev === entry.id ? null : prev), 1200);
 		});
 	}, [formatEntryForCopy]);
-	const handleSelectAllCaps = (0, react.useCallback)(() => {
+	const handleSelectAllCaps = (0, react$1.useCallback)(() => {
 		setActiveCaps(new Set(visibleCaps));
 	}, [visibleCaps]);
-	const handleSelectNoCaps = (0, react.useCallback)(() => {
+	const handleSelectNoCaps = (0, react$1.useCallback)(() => {
 		setActiveCaps(/* @__PURE__ */ new Set());
 	}, []);
-	const filteredPopoverCaps = (0, react.useMemo)(() => {
+	const filteredPopoverCaps = (0, react$1.useMemo)(() => {
 		const needle = filterSearch.trim().toLowerCase();
 		if (!needle) return visibleCaps;
 		return visibleCaps.filter((c) => c.toLowerCase().includes(needle));
@@ -22262,7 +23894,7 @@ function StateValuesStream({ deviceId, defaultCaps, maxHeight = "max-h-96", limi
 	const totalActive = activeCaps.size;
 	const allSelected = totalActive === 0 || totalActive === totalAvailable;
 	const filterLabel = allSelected ? "All" : `${totalActive}/${totalAvailable}`;
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!filterOpen) return;
 		const onDocClick = (e) => {
 			const root = filterRootRef.current;
@@ -22622,14 +24254,14 @@ var TABS = [
 	}
 ];
 function DeviceActivityPanel({ deviceId, defaultEventCategories, defaultStateCaps, initialTab = "events", className, maxHeight = "max-h-96" }) {
-	const [tab, setTab] = (0, react.useState)(initialTab);
+	const [tab, setTab] = (0, react$1.useState)(initialTab);
 	const logsBuffer = useLiveBuffer(PANEL_BUFFER_SIZE);
 	const eventsBuffer = useLiveBuffer(PANEL_BUFFER_SIZE);
 	const stateBuffer = useLiveBuffer(PANEL_BUFFER_SIZE);
 	const logsReset = logsBuffer.reset;
 	const eventsReset = eventsBuffer.reset;
 	const stateReset = stateBuffer.reset;
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		logsReset();
 		eventsReset();
 		stateReset();
@@ -22693,9 +24325,9 @@ function DeviceActivityPanel({ deviceId, defaultEventCategories, defaultStateCap
 * for reboot, RefreshCw for restart).
 */
 function ConfirmActionButton({ label, icon: Icon, title = "Confirm action", description, confirmLabel, triggerVariant = "outline", confirmVariant = "danger", size = "sm", disabled, className, action, onSuccess }) {
-	const [open, setOpen] = (0, react.useState)(false);
-	const [running, setRunning] = (0, react.useState)(false);
-	const [error, setError] = (0, react.useState)(null);
+	const [open, setOpen] = (0, react$1.useState)(false);
+	const [running, setRunning] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
 	const handleConfirm = async () => {
 		setError(null);
 		setRunning(true);
@@ -22774,9 +24406,9 @@ function ConfirmActionButton({ label, icon: Icon, title = "Confirm action", desc
 * release (`startContinuous` + `stopContinuous` on pointer up).
 */
 function DPadButton({ direction, icon: Icon, disabled, className, variant, onMove, onStart, onStop }) {
-	const [pressedAt, setPressedAt] = (0, react.useState)(null);
-	const [continuous, setContinuous] = (0, react.useState)(false);
-	const handlePointerDown = (0, react.useCallback)((e) => {
+	const [pressedAt, setPressedAt] = (0, react$1.useState)(null);
+	const [continuous, setContinuous] = (0, react$1.useState)(false);
+	const handlePointerDown = (0, react$1.useCallback)((e) => {
 		if (disabled) return;
 		e.currentTarget.setPointerCapture(e.pointerId);
 		setPressedAt(Date.now());
@@ -22791,7 +24423,7 @@ function DPadButton({ direction, icon: Icon, disabled, className, variant, onMov
 		disabled,
 		onStart
 	]);
-	const handlePointerUp = (0, react.useCallback)((e) => {
+	const handlePointerUp = (0, react$1.useCallback)((e) => {
 		const timerId = Number(e.currentTarget.dataset.timer);
 		if (timerId) clearTimeout(timerId);
 		e.currentTarget.dataset.timer = "";
@@ -22806,7 +24438,7 @@ function DPadButton({ direction, icon: Icon, disabled, className, variant, onMov
 		onStop,
 		pressedAt
 	]);
-	const handlePointerCancel = (0, react.useCallback)((e) => {
+	const handlePointerCancel = (0, react$1.useCallback)((e) => {
 		const timerId = Number(e.currentTarget.dataset.timer);
 		if (timerId) clearTimeout(timerId);
 		e.currentTarget.dataset.timer = "";
@@ -22829,7 +24461,7 @@ function DPadButton({ direction, icon: Icon, disabled, className, variant, onMov
 }
 function PTZOverlay({ controls, mode = "overlay", showPresets, showZoom = true, showHome = true, className }) {
 	const { move, startContinuous, stopContinuous, zoom, goHome, goToPreset, presets, busy, error } = controls;
-	const [presetsOpen, setPresetsOpen] = (0, react.useState)(false);
+	const [presetsOpen, setPresetsOpen] = (0, react$1.useState)(false);
 	const presetsVisible = (showPresets ?? presets.length > 0) && presets.length > 0;
 	const isPanel = mode === "panel";
 	const containerClass = isPanel ? "flex flex-col items-stretch gap-2 w-full h-full p-3" : "pointer-events-auto absolute top-3 right-3 z-10 flex flex-col items-end gap-2";
@@ -22982,11 +24614,11 @@ function downloadDataUrl(filename, dataUrl) {
 	document.body.removeChild(link);
 }
 function SnapshotButton({ trpc, deviceId, deviceName, size = "sm", className }) {
-	const [busy, setBusy] = (0, react.useState)(false);
-	const [done, setDone] = (0, react.useState)(false);
-	const [error, setError] = (0, react.useState)(null);
+	const [busy, setBusy] = (0, react$1.useState)(false);
+	const [done, setDone] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
 	const safeName = deviceName.replace(/[^a-zA-Z0-9_.-]+/g, "_");
-	const fetchSnapshot = (0, react.useCallback)(async (action) => {
+	const fetchSnapshot = (0, react$1.useCallback)(async (action) => {
 		setBusy(true);
 		setError(null);
 		setDone(false);
@@ -23019,8 +24651,8 @@ function SnapshotButton({ trpc, deviceId, deviceName, size = "sm", className })
 		safeName
 	]);
 	const sizeClasses = size === "md" ? "h-9 px-3 text-sm gap-2" : "h-7 px-2.5 text-[11px] gap-1.5";
-	const [pressTimer, setPressTimer] = (0, react.useState)(null);
-	const [longPressed, setLongPressed] = (0, react.useState)(false);
+	const [pressTimer, setPressTimer] = (0, react$1.useState)(null);
+	const [longPressed, setLongPressed] = (0, react$1.useState)(false);
 	const handlePointerDown = () => {
 		setLongPressed(false);
 		setPressTimer(setTimeout(() => {
@@ -23127,7 +24759,7 @@ function DoorbellRecentPanel({ history, limit = 5, latestIsFresh, className }) {
 * touch devices, no extra wiring needed.
 */
 function KebabMenu({ items, header, triggerClassName, title = "More actions" }) {
-	const [open, setOpen] = (0, react.useState)(false);
+	const [open, setOpen] = (0, react$1.useState)(false);
 	const visible = items.filter((i) => !i.hidden);
 	if (visible.length === 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Popover, {
@@ -23269,19 +24901,19 @@ function clampedAccessForRow(row, parent) {
 function ScopePicker({ value, onChange, clampToParent, emptyHint }) {
 	const { data: addons } = useAddonsList();
 	const { data: devices } = useDeviceManagerListAll({});
-	const addonChoices = (0, react.useMemo)(() => (addons ?? []).map((a) => ({
+	const addonChoices = (0, react$1.useMemo)(() => (addons ?? []).map((a) => ({
 		value: a.manifest.id,
 		label: a.manifest.id
 	})).sort((a, b) => a.label.localeCompare(b.label)), [addons]);
-	const capChoices = (0, react.useMemo)(() => [..._camstack_types.KNOWN_CAP_NAMES].sort().map((c) => ({
+	const capChoices = (0, react$1.useMemo)(() => [..._camstack_types.KNOWN_CAP_NAMES].sort().map((c) => ({
 		value: c,
 		label: c
 	})), []);
-	const deviceChoices = (0, react.useMemo)(() => (devices ?? []).map((d) => ({
+	const deviceChoices = (0, react$1.useMemo)(() => (devices ?? []).map((d) => ({
 		value: String(d.id),
 		label: `${d.name} (#${d.id} · ${d.addonId})`
 	})).sort((a, b) => a.label.localeCompare(b.label)), [devices]);
-	const parentDeviceClamp = (0, react.useMemo)(() => clampToParent == null ? null : parentDeviceTargets(clampToParent), [clampToParent]);
+	const parentDeviceClamp = (0, react$1.useMemo)(() => clampToParent == null ? null : parentDeviceTargets(clampToParent), [clampToParent]);
 	/**
 	* Build a fresh scope row when `type` changes. The discriminated union
 	* forces us to re-construct the object per variant so the resulting
@@ -23448,8 +25080,8 @@ function ScopePicker({ value, onChange, clampToParent, emptyHint }) {
 	});
 }
 function DeviceTargetPicker({ value, choices, clampToParent, onChange }) {
-	const [pendingAdd, setPendingAdd] = (0, react.useState)("");
-	const visibleChoices = (0, react.useMemo)(() => {
+	const [pendingAdd, setPendingAdd] = (0, react$1.useState)("");
+	const visibleChoices = (0, react$1.useMemo)(() => {
 		const filtered = clampToParent == null ? choices : choices.filter((c) => clampToParent.includes(c.value));
 		const taken = new Set(value);
 		return filtered.filter((c) => !taken.has(c.value));
@@ -23545,11 +25177,11 @@ function validateScopes(scopes) {
 */
 var ZoneEditingContext = createSharedContext("camstack:zone-editing", null);
 function ZoneEditingProvider({ children }) {
-	const [editing, setEditingRaw] = (0, react.useState)(false);
-	const [drawingKind, setDrawingKindRaw] = (0, react.useState)(null);
-	const [selectedZoneId, setSelectedZoneIdRaw] = (0, react.useState)(null);
-	const [editingDraft, setEditingDraftRaw] = (0, react.useState)(null);
-	const setEditing = (0, react.useCallback)((next) => {
+	const [editing, setEditingRaw] = (0, react$1.useState)(false);
+	const [drawingKind, setDrawingKindRaw] = (0, react$1.useState)(null);
+	const [selectedZoneId, setSelectedZoneIdRaw] = (0, react$1.useState)(null);
+	const [editingDraft, setEditingDraftRaw] = (0, react$1.useState)(null);
+	const setEditing = (0, react$1.useCallback)((next) => {
 		setEditingRaw(next);
 		if (!next) {
 			setDrawingKindRaw(null);
@@ -23557,38 +25189,38 @@ function ZoneEditingProvider({ children }) {
 			setEditingDraftRaw(null);
 		}
 	}, []);
-	const setDrawingKind = (0, react.useCallback)((kind) => {
+	const setDrawingKind = (0, react$1.useCallback)((kind) => {
 		setDrawingKindRaw(kind);
 	}, []);
-	const setSelectedZoneId = (0, react.useCallback)((id) => {
+	const setSelectedZoneId = (0, react$1.useCallback)((id) => {
 		setSelectedZoneIdRaw(id);
 	}, []);
-	const startDrawing = (0, react.useCallback)((kind) => {
+	const startDrawing = (0, react$1.useCallback)((kind) => {
 		setEditingRaw(true);
 		setSelectedZoneIdRaw(null);
 		setDrawingKindRaw(kind);
 		setEditingDraftRaw(null);
 	}, []);
-	const exitEditing = (0, react.useCallback)(() => {
+	const exitEditing = (0, react$1.useCallback)(() => {
 		setEditingRaw(false);
 		setDrawingKindRaw(null);
 		setSelectedZoneIdRaw(null);
 		setEditingDraftRaw(null);
 	}, []);
-	const enterDraft = (0, react.useCallback)((draft) => {
+	const enterDraft = (0, react$1.useCallback)((draft) => {
 		setSelectedZoneIdRaw(draft.id);
 		setEditingDraftRaw(draft);
 	}, []);
-	const updateDraft = (0, react.useCallback)((patch) => {
+	const updateDraft = (0, react$1.useCallback)((patch) => {
 		setEditingDraftRaw((prev) => prev === null ? prev : {
 			...prev,
 			...patch
 		});
 	}, []);
-	const discardDraft = (0, react.useCallback)(() => {
+	const discardDraft = (0, react$1.useCallback)(() => {
 		setEditingDraftRaw(null);
 	}, []);
-	const value = (0, react.useMemo)(() => ({
+	const value = (0, react$1.useMemo)(() => ({
 		editing,
 		drawingKind,
 		selectedZoneId,
@@ -23624,7 +25256,7 @@ function ZoneEditingProvider({ children }) {
 *  provider so callers that mount in pages without zones (e.g. a
 *  shared hero on a non-camera device) can no-op gracefully. */
 function useZoneEditing() {
-	return (0, react.useContext)(ZoneEditingContext);
+	return (0, react$1.useContext)(ZoneEditingContext);
 }
 //#endregion
 //#region src/hooks/use-device-detections.ts
@@ -23652,14 +25284,14 @@ function matchesDevice(source, deviceId) {
 	return source?.id === deviceId;
 }
 function useDeviceDetections(trpc, deviceId) {
-	const [motion, setMotion] = (0, react.useState)(null);
-	const [motionRaw, setMotionRaw] = (0, react.useState)(null);
-	const [detection, setDetection] = (0, react.useState)(null);
-	const [phase, setPhase] = (0, react.useState)("watching");
-	const motionTimer = (0, react.useRef)(void 0);
-	const motionRawTimer = (0, react.useRef)(void 0);
-	const detectionTimer = (0, react.useRef)(void 0);
-	(0, react.useEffect)(() => {
+	const [motion, setMotion] = (0, react$1.useState)(null);
+	const [motionRaw, setMotionRaw] = (0, react$1.useState)(null);
+	const [detection, setDetection] = (0, react$1.useState)(null);
+	const [phase, setPhase] = (0, react$1.useState)("watching");
+	const motionTimer = (0, react$1.useRef)(void 0);
+	const motionRawTimer = (0, react$1.useRef)(void 0);
+	const detectionTimer = (0, react$1.useRef)(void 0);
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		const sub = safeSubscribe(trpc, "detection.motion-analysis", (event) => {
 			const e = event;
@@ -23682,7 +25314,7 @@ function useDeviceDetections(trpc, deviceId) {
 			if (motionTimer.current) clearTimeout(motionTimer.current);
 		};
 	}, [trpc, deviceId]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		const sub = safeSubscribe(trpc, "detection.motion-zones-raw", (event) => {
 			const e = event;
@@ -23706,7 +25338,7 @@ function useDeviceDetections(trpc, deviceId) {
 			if (motionRawTimer.current) clearTimeout(motionRawTimer.current);
 		};
 	}, [trpc, deviceId]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		const sub = safeSubscribe(trpc, "detection.result", (event) => {
 			const e = event;
@@ -23726,7 +25358,7 @@ function useDeviceDetections(trpc, deviceId) {
 			if (detectionTimer.current) clearTimeout(detectionTimer.current);
 		};
 	}, [trpc, deviceId]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		const sub = safeSubscribe(trpc, "detection.phase-transition", (event) => {
 			const e = event;
@@ -23763,8 +25395,8 @@ function useDeviceDetections(trpc, deviceId) {
 * @param pollIntervalMs - how often to refresh profile slots (default: 5000)
 */
 function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
-	const [remoteStreams, setRemoteStreams] = (0, react.useState)([]);
-	(0, react.useEffect)(() => {
+	const [remoteStreams, setRemoteStreams] = (0, react$1.useState)([]);
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		let cancelled = false;
 		const fetch = () => {
@@ -23783,8 +25415,8 @@ function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
 		deviceId,
 		pollIntervalMs
 	]);
-	const [pipelineMetrics, setPipelineMetrics] = (0, react.useState)(null);
-	(0, react.useEffect)(() => {
+	const [pipelineMetrics, setPipelineMetrics] = (0, react$1.useState)(null);
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) return;
 		let cancelled = false;
 		if (trpc.pipelineOrchestrator) trpc.pipelineOrchestrator.getCameraMetrics.query({ deviceId }).then((m) => {
@@ -23811,7 +25443,7 @@ function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
 			droppedFrames: payload.metrics.droppedFrames
 		});
 	});
-	const { streams, hasWebrtc } = (0, react.useMemo)(() => {
+	const { streams, hasWebrtc } = (0, react$1.useMemo)(() => {
 		if (deviceId === null || remoteStreams.length === 0) return {
 			streams: [],
 			hasWebrtc: false
@@ -23833,7 +25465,7 @@ function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
 		streams,
 		hasWebrtc,
 		pipelineMetrics,
-		createSession: (0, react.useCallback)(async (target, hints) => {
+		createSession: (0, react$1.useCallback)(async (target, hints) => {
 			if (deviceId === null) throw new Error("No device selected");
 			const res = await trpc.webrtcSession.createSession.mutate({
 				deviceId,
@@ -23845,7 +25477,7 @@ function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
 				sdpOffer: res.sdpOffer
 			};
 		}, [trpc, deviceId]),
-		sendAnswer: (0, react.useCallback)(async (sessionId, sdpAnswer) => {
+		sendAnswer: (0, react$1.useCallback)(async (sessionId, sdpAnswer) => {
 			if (deviceId === null) throw new Error("No device selected");
 			await trpc.webrtcSession.handleAnswer.mutate({
 				deviceId,
@@ -23853,7 +25485,7 @@ function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
 				sdpAnswer
 			});
 		}, [trpc, deviceId]),
-		closeSession: (0, react.useCallback)(async (sessionId) => {
+		closeSession: (0, react$1.useCallback)(async (sessionId) => {
 			if (deviceId === null) return;
 			await trpc.webrtcSession.closeSession.mutate({
 				deviceId,
@@ -23926,10 +25558,10 @@ function usePTZ(trpc, deviceId, options) {
 	const pulseMs = options?.pulseMs ?? 250;
 	const enabled = options?.enabled ?? true;
 	const ptz = useDeviceProxy(trpc, enabled ? deviceId : null)?.ptz;
-	const [presets, setPresets] = (0, react.useState)([]);
-	const [busy, setBusy] = (0, react.useState)(false);
-	const [error, setError] = (0, react.useState)(null);
-	const refreshPresets = (0, react.useCallback)(async () => {
+	const [presets, setPresets] = (0, react$1.useState)([]);
+	const [busy, setBusy] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
+	const refreshPresets = (0, react$1.useCallback)(async () => {
 		if (!enabled || !ptz) return;
 		try {
 			setPresets(await ptz.getPresets({}));
@@ -23939,10 +25571,10 @@ function usePTZ(trpc, deviceId, options) {
 			setError(msg);
 		}
 	}, [ptz, enabled]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		refreshPresets();
 	}, [refreshPresets]);
-	const wrap = (0, react.useCallback)(async (fn) => {
+	const wrap = (0, react$1.useCallback)(async (fn) => {
 		if (!enabled || !ptz) return void 0;
 		setError(null);
 		setBusy(true);
@@ -23956,7 +25588,7 @@ function usePTZ(trpc, deviceId, options) {
 		}
 	}, [enabled, ptz]);
 	return {
-		move: (0, react.useCallback)(async (direction, speed) => {
+		move: (0, react$1.useCallback)(async (direction, speed) => {
 			if (!ptz) return;
 			const v = DIRECTION_VECTORS[direction];
 			const s = speed ?? defaultSpeed;
@@ -23975,7 +25607,7 @@ function usePTZ(trpc, deviceId, options) {
 			pulseMs,
 			wrap
 		]),
-		startContinuous: (0, react.useCallback)(async (direction, speed) => {
+		startContinuous: (0, react$1.useCallback)(async (direction, speed) => {
 			if (!ptz) return;
 			const v = DIRECTION_VECTORS[direction];
 			const s = speed ?? defaultSpeed;
@@ -23989,11 +25621,11 @@ function usePTZ(trpc, deviceId, options) {
 			defaultSpeed,
 			wrap
 		]),
-		stopContinuous: (0, react.useCallback)(async () => {
+		stopContinuous: (0, react$1.useCallback)(async () => {
 			if (!ptz) return;
 			await wrap(() => ptz.stop({}));
 		}, [ptz, wrap]),
-		zoom: (0, react.useCallback)(async (direction, speed) => {
+		zoom: (0, react$1.useCallback)(async (direction, speed) => {
 			if (!ptz) return;
 			const z = direction === "in" ? 1 : -1;
 			const s = speed ?? defaultSpeed;
@@ -24011,11 +25643,11 @@ function usePTZ(trpc, deviceId, options) {
 			pulseMs,
 			wrap
 		]),
-		goHome: (0, react.useCallback)(async () => {
+		goHome: (0, react$1.useCallback)(async () => {
 			if (!ptz) return;
 			await wrap(() => ptz.goHome({}));
 		}, [ptz, wrap]),
-		goToPreset: (0, react.useCallback)(async (presetId) => {
+		goToPreset: (0, react$1.useCallback)(async (presetId) => {
 			if (!ptz) return;
 			await wrap(() => ptz.goToPreset({ presetId }));
 		}, [ptz, wrap]),
@@ -24042,8 +25674,8 @@ function useDoorbellEvents(options) {
 	const deviceId = options?.deviceId ?? null;
 	const historyLimit = options?.historyLimit ?? 20;
 	const event = useEventStreamLatest("doorbell.onPressed", deviceId !== null ? (data) => data.deviceId === deviceId : void 0);
-	const [history, setHistory] = (0, react.useState)([]);
-	(0, react.useEffect)(() => {
+	const [history, setHistory] = (0, react$1.useState)([]);
+	(0, react$1.useEffect)(() => {
 		if (!event) return;
 		setHistory((prev) => {
 			if (prev.length > 0 && prev[0].deviceId === event.deviceId && prev[0].timestamp === event.timestamp) return prev;
@@ -24079,9 +25711,9 @@ function useDoorbellEvents(options) {
 */
 function useDevices(filters) {
 	const system = useSystem();
-	const filtersKey = (0, react.useMemo)(() => filters ? JSON.stringify(filters) : "", [filters]);
-	const [devices, setDevices] = (0, react.useState)(() => system.listDevices(filters));
-	(0, react.useEffect)(() => {
+	const filtersKey = (0, react$1.useMemo)(() => filters ? JSON.stringify(filters) : "", [filters]);
+	const [devices, setDevices] = (0, react$1.useState)(() => system.listDevices(filters));
+	(0, react$1.useEffect)(() => {
 		const refresh = () => {
 			setDevices(system.listDevices(filters));
 		};
@@ -24114,8 +25746,8 @@ function useDevices(filters) {
 */
 function useDevice(deviceId) {
 	const system = useSystem();
-	const [device, setDevice] = (0, react.useState)(() => deviceId === null ? null : system.getDevice(deviceId));
-	(0, react.useEffect)(() => {
+	const [device, setDevice] = (0, react$1.useState)(() => deviceId === null ? null : system.getDevice(deviceId));
+	(0, react$1.useEffect)(() => {
 		if (deviceId === null) {
 			setDevice(null);
 			return;
@@ -24213,15 +25845,15 @@ function useSystemMutation(select, opts) {
 function useEventInvalidation(queryKey, categories) {
 	const system = useSystem();
 	const queryClient = (0, _tanstack_react_query.useQueryClient)();
-	const [tick, setTick] = (0, react.useState)(system.connectionVersion);
-	(0, react.useEffect)(() => {
+	const [tick, setTick] = (0, react$1.useState)(system.connectionVersion);
+	(0, react$1.useEffect)(() => {
 		return system.subscribeConnectionEvents((state, version) => {
 			if (state === "connected") setTick(version);
 		});
 	}, [system]);
 	const key = categories.join("|");
 	const keyJson = JSON.stringify(queryKey);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const subs = [];
 		const refresh = () => {
 			const raw = JSON.parse(keyJson);
@@ -24276,6 +25908,7 @@ exports.ConfigFormField = FormField;
 exports.ConfigSchemaField = ConfigSchemaField;
 exports.ConfirmActionButton = ConfirmActionButton;
 exports.ConfirmDialogProvider = ConfirmDialogProvider;
+exports.CopyButton = CopyButton;
 exports.CustomFieldRenderersProvider = CustomFieldRenderersProvider;
 exports.DEFAULT_COLOR = DEFAULT_COLOR;
 exports.DataTable = DataTable;
@@ -24286,6 +25919,7 @@ exports.DevShell = DevShell;
 exports.DeviceActivityPanel = DeviceActivityPanel;
 exports.DeviceCard = DeviceCard;
 exports.DeviceContextProvider = DeviceContextProvider;
+exports.DeviceExportPanel = DeviceExportPanel;
 exports.DeviceGrid = DeviceGrid;
 exports.DeviceItem = DeviceItem;
 exports.DeviceList = DeviceList;
@@ -24303,6 +25937,7 @@ exports.DropdownContent = DropdownContent;
 exports.DropdownItem = DropdownItem;
 exports.DropdownTrigger = DropdownTrigger;
 exports.EmptyState = EmptyState;
+exports.ErrorBox = ErrorBox;
 exports.EventStream = EventStream;
 exports.FilterBar = FilterBar;
 exports.FloatingEventStream = FloatingEventStream;
@@ -24340,6 +25975,7 @@ exports.Popover = Popover;
 exports.PopoverContent = PopoverContent;
 exports.PopoverTrigger = PopoverTrigger;
 exports.ProviderBadge = ProviderBadge;
+exports.QrCode = QrCode;
 exports.ResponseLog = ResponseLog;
 exports.SECTION_BODY = SECTION_BODY;
 exports.SECTION_CARD = SECTION_CARD;
@@ -24414,12 +26050,15 @@ exports.useAddonsCustom = useAddonsCustom;
 exports.useAddonsForceRefresh = useAddonsForceRefresh;
 exports.useAddonsGetAddonAutoUpdate = useAddonsGetAddonAutoUpdate;
 exports.useAddonsGetAutoUpdateSettings = useAddonsGetAutoUpdateSettings;
+exports.useAddonsGetLastRestart = useAddonsGetLastRestart;
 exports.useAddonsGetLogs = useAddonsGetLogs;
 exports.useAddonsGetVersions = useAddonsGetVersions;
 exports.useAddonsInstallFromWorkspace = useAddonsInstallFromWorkspace;
 exports.useAddonsInstallPackage = useAddonsInstallPackage;
 exports.useAddonsIsWorkspaceAvailable = useAddonsIsWorkspaceAvailable;
 exports.useAddonsList = useAddonsList;
+exports.useAddonsListCapabilityProviders = useAddonsListCapabilityProviders;
+exports.useAddonsListFrameworkPackages = useAddonsListFrameworkPackages;
 exports.useAddonsListPackages = useAddonsListPackages;
 exports.useAddonsListUpdates = useAddonsListUpdates;
 exports.useAddonsListWorkspacePackages = useAddonsListWorkspacePackages;
@@ -24433,6 +26072,7 @@ exports.useAddonsSearchAvailable = useAddonsSearchAvailable;
 exports.useAddonsSetAddonAutoUpdate = useAddonsSetAddonAutoUpdate;
 exports.useAddonsSetAutoUpdateSettings = useAddonsSetAutoUpdateSettings;
 exports.useAddonsUninstallPackage = useAddonsUninstallPackage;
+exports.useAddonsUpdateFrameworkPackage = useAddonsUpdateFrameworkPackage;
 exports.useAddonsUpdatePackage = useAddonsUpdatePackage;
 exports.useAlertsDismiss = useAlertsDismiss;
 exports.useAlertsEmit = useAlertsEmit;