@camstack/ui-library 1.2.119 → 1.2.121

package/dist/index.cjs

@@ -799,6 +799,42 @@ var Bus = createLucideIcon("bus", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Cable = createLucideIcon("cable", [
+	["path", {
+		d: "M17 19a1 1 0 0 1-1-1v-2a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2a1 1 0 0 1-1 1z",
+		key: "trhst0"
+	}],
+	["path", {
+		d: "M17 21v-2",
+		key: "ds4u3f"
+	}],
+	["path", {
+		d: "M19 14V6.5a1 1 0 0 0-7 0v11a1 1 0 0 1-7 0V10",
+		key: "1mo9zo"
+	}],
+	["path", {
+		d: "M21 21v-2",
+		key: "eo0ou"
+	}],
+	["path", {
+		d: "M3 5V3",
+		key: "1k5hjh"
+	}],
+	["path", {
+		d: "M4 10a2 2 0 0 1-2-2V6a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2a2 2 0 0 1-2 2z",
+		key: "1dd30t"
+	}],
+	["path", {
+		d: "M7 5V3",
+		key: "1t1388"
+	}]
+]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var Camera = createLucideIcon("camera", [["path", {
 	d: "M13.997 4a2 2 0 0 1 1.76 1.05l.486.9A2 2 0 0 0 18.003 7H20a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1.997a2 2 0 0 0 1.759-1.048l.489-.904A2 2 0 0 1 10.004 4z",
 	key: "18u6gg"
@@ -1854,6 +1890,34 @@ var Flame = createLucideIcon("flame", [["path", {
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var FlashlightOff = createLucideIcon("flashlight-off", [
+	["path", {
+		d: "M11.652 6H18",
+		key: "voqkpr"
+	}],
+	["path", {
+		d: "M12 13v1",
+		key: "176q98"
+	}],
+	["path", {
+		d: "M16 16v4a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2v-8a4 4 0 0 0-.8-2.4l-.6-.8A3 3 0 0 1 6 7V6",
+		key: "dzyf92"
+	}],
+	["path", {
+		d: "m2 2 20 20",
+		key: "1ooewy"
+	}],
+	["path", {
+		d: "M7.649 2H17a1 1 0 0 1 1 1v4a3 3 0 0 1-.6 1.8l-.6.8a4 4 0 0 0-.55 1.007",
+		key: "1hvcfn"
+	}]
+]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var Flashlight = createLucideIcon("flashlight", [
 	["path", {
 		d: "M12 13v1",
@@ -2045,6 +2109,30 @@ var Hammer = createLucideIcon("hammer", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Hand = createLucideIcon("hand", [
+	["path", {
+		d: "M18 11V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2",
+		key: "1fvzgz"
+	}],
+	["path", {
+		d: "M14 10V4a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2",
+		key: "1kc0my"
+	}],
+	["path", {
+		d: "M10 10.5V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2v8",
+		key: "10h0bg"
+	}],
+	["path", {
+		d: "M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15",
+		key: "1s1gnw"
+	}]
+]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var HardDrive = createLucideIcon("hard-drive", [
 	["path", {
 		d: "M10 16h.01",
@@ -3161,6 +3249,44 @@ var Radar = createLucideIcon("radar", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var RadioTower = createLucideIcon("radio-tower", [
+	["path", {
+		d: "M4.9 16.1C1 12.2 1 5.8 4.9 1.9",
+		key: "s0qx1y"
+	}],
+	["path", {
+		d: "M7.8 4.7a6.14 6.14 0 0 0-.8 7.5",
+		key: "1idnkw"
+	}],
+	["circle", {
+		cx: "12",
+		cy: "9",
+		r: "2",
+		key: "1092wv"
+	}],
+	["path", {
+		d: "M16.2 4.8c2 2 2.26 5.11.8 7.47",
+		key: "ojru2q"
+	}],
+	["path", {
+		d: "M19.1 1.9a9.96 9.96 0 0 1 0 14.1",
+		key: "rhi7fg"
+	}],
+	["path", {
+		d: "M9.5 18h5",
+		key: "mfy3pd"
+	}],
+	["path", {
+		d: "m8 22 4-11 4 11",
+		key: "25yftu"
+	}]
+]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var Radio = createLucideIcon("radio", [
 	["path", {
 		d: "M16.247 7.761a6 6 0 0 1 0 8.478",
@@ -4212,6 +4338,19 @@ var Type = createLucideIcon("type", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Undo2 = createLucideIcon("undo-2", [["path", {
+	d: "M9 14 4 9l5-5",
+	key: "102s5s"
+}], ["path", {
+	d: "M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11",
+	key: "f3b9sd"
+}]]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 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"
@@ -4419,6 +4558,39 @@ var Waves = createLucideIcon("waves", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var WifiHigh = createLucideIcon("wifi-high", [
+	["path", {
+		d: "M12 20h.01",
+		key: "zekei9"
+	}],
+	["path", {
+		d: "M5 12.859a10 10 0 0 1 14 0",
+		key: "1x1e6c"
+	}],
+	["path", {
+		d: "M8.5 16.429a5 5 0 0 1 7 0",
+		key: "1bycff"
+	}]
+]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var WifiLow = createLucideIcon("wifi-low", [["path", {
+	d: "M12 20h.01",
+	key: "zekei9"
+}], ["path", {
+	d: "M8.5 16.429a5 5 0 0 1 7 0",
+	key: "1bycff"
+}]]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var WifiOff = createLucideIcon("wifi-off", [
 	["path", {
 		d: "M12 20h.01",
@@ -4455,6 +4627,16 @@ var WifiOff = createLucideIcon("wifi-off", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var WifiZero = createLucideIcon("wifi-zero", [["path", {
+	d: "M12 20h.01",
+	key: "zekei9"
+}]]);
+/**
+* @license lucide-react v0.576.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
 var Wifi = createLucideIcon("wifi", [
 	["path", {
 		d: "M12 20h.01",
@@ -5805,6 +5987,28 @@ var useMqttBrokerGetStatus = trpc.mqttBroker.getStatus.useQuery;
 var useNativeObjectDetectionSetEnabled = trpc.nativeObjectDetection.setEnabled.useMutation;
 /** Generated alias around `trpc.nativeObjectDetection.getStatus.useQuery`. */
 var useNativeObjectDetectionGetStatus = trpc.nativeObjectDetection.getStatus.useQuery;
+/** Generated alias around `trpc.navigation.move.useMutation`. */
+var useNavigationMove = trpc.navigation.move.useMutation;
+/** Generated alias around `trpc.navigation.stop.useMutation`. */
+var useNavigationStop = trpc.navigation.stop.useMutation;
+/** Generated alias around `trpc.navigation.goToPoint.useMutation`. */
+var useNavigationGoToPoint = trpc.navigation.goToPoint.useMutation;
+/** Generated alias around `trpc.navigation.listActions.useQuery`. */
+var useNavigationListActions = trpc.navigation.listActions.useQuery;
+/** Generated alias around `trpc.navigation.runAction.useMutation`. */
+var useNavigationRunAction = trpc.navigation.runAction.useMutation;
+/** Generated alias around `trpc.navigation.playSound.useMutation`. */
+var useNavigationPlaySound = trpc.navigation.playSound.useMutation;
+/** Generated alias around `trpc.navigation.setLightOn.useMutation`. */
+var useNavigationSetLightOn = trpc.navigation.setLightOn.useMutation;
+/** Generated alias around `trpc.navigation.setLightMode.useMutation`. */
+var useNavigationSetLightMode = trpc.navigation.setLightMode.useMutation;
+/** Generated alias around `trpc.navigation.setLightLevel.useMutation`. */
+var useNavigationSetLightLevel = trpc.navigation.setLightLevel.useMutation;
+/** Generated alias around `trpc.navigation.getFeatures.useQuery`. */
+var useNavigationGetFeatures = trpc.navigation.getFeatures.useQuery;
+/** Generated alias around `trpc.navigation.getStatus.useQuery`. */
+var useNavigationGetStatus = trpc.navigation.getStatus.useQuery;
 /** Generated alias around `trpc.networkAccess.start.useMutation`. */
 var useNetworkAccessStart = trpc.networkAccess.start.useMutation;
 /** Generated alias around `trpc.networkAccess.stop.useMutation`. */
@@ -5815,6 +6019,8 @@ var useNetworkAccessGetEndpoint = trpc.networkAccess.getEndpoint.useQuery;
 var useNetworkAccessGetStatus = trpc.networkAccess.getStatus.useQuery;
 /** Generated alias around `trpc.networkAccess.listEndpoints.useQuery`. */
 var useNetworkAccessListEndpoints = trpc.networkAccess.listEndpoints.useQuery;
+/** Generated alias around `trpc.networkLink.getStatus.useQuery`. */
+var useNetworkLinkGetStatus = trpc.networkLink.getStatus.useQuery;
 /** Generated alias around `trpc.networkQuality.getDeviceStats.useQuery`. */
 var useNetworkQualityGetDeviceStats = trpc.networkQuality.getDeviceStats.useQuery;
 /** Generated alias around `trpc.networkQuality.getAllStats.useQuery`. */
@@ -15870,6 +16076,373 @@ function ConsumablesPanel({ deviceId }) {
 	});
 }
 //#endregion
+//#region src/hooks/use-navigation.ts
+/**
+* useNavigation — drive a `navigation` robot camera from the UI.
+*
+* The cap's `move` is MOMENTARY: fluid driving is the UI sending a nudge at
+* 1 Hz while a direction is held and ONE `stop` on release, exactly like the
+* robot app's joystick. This hook owns that cadence (`startDrive` /
+* `stopDrive`); the provider forwards each nudge to a single drive write.
+*
+* Everything else is a plain call plus the data the panel renders from:
+* `features` (which primitives are on), `actions` (the enabled dictionary)
+* and the live `status` slice off the device proxy.
+*/
+/** The cadence the robot app drives at while a direction is held. */
+var NAVIGATION_DRIVE_INTERVAL_MS = 1e3;
+var DIRECTION_VECTORS$1 = {
+	forward: {
+		pan: 0,
+		tilt: 1
+	},
+	left: {
+		pan: -1,
+		tilt: 0
+	},
+	right: {
+		pan: 1,
+		tilt: 0
+	},
+	spin: {
+		pan: 0,
+		tilt: -1
+	}
+};
+function isAbsentProvider$1(err) {
+	const message = err instanceof Error ? err.message : String(err);
+	return /not available|no provider|NOT_FOUND|PRECONDITION/i.test(message);
+}
+function useNavigation(trpc, deviceId, hookOptions) {
+	const enabled = hookOptions?.enabled ?? true;
+	const nav = useDeviceProxy(trpc, enabled ? deviceId : null)?.navigation;
+	const status = useDeviceState(trpc, enabled ? deviceId : null, (s) => s.navigation);
+	const [features, setFeatures] = (0, react$1.useState)(null);
+	const [actions, setActions] = (0, react$1.useState)([]);
+	const [busy, setBusy] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
+	const [driving, setDriving] = (0, react$1.useState)(null);
+	const driveTimer = (0, react$1.useRef)(null);
+	(0, react$1.useEffect)(() => {
+		if (!enabled || !nav) return;
+		let cancelled = false;
+		(async () => {
+			try {
+				const [nextFeatures, nextActions] = await Promise.all([nav.getFeatures({}), nav.listActions({})]);
+				if (cancelled) return;
+				setFeatures(nextFeatures);
+				setActions(nextActions);
+			} catch (err) {
+				if (cancelled || isAbsentProvider$1(err)) return;
+				setError(err instanceof Error ? err.message : String(err));
+			}
+		})();
+		return () => {
+			cancelled = true;
+		};
+	}, [nav, enabled]);
+	const wrap = (0, react$1.useCallback)(async (fn) => {
+		if (!enabled || !nav) return;
+		setError(null);
+		setBusy(true);
+		try {
+			await fn();
+		} catch (err) {
+			setError(err instanceof Error ? err.message : String(err));
+		} finally {
+			setBusy(false);
+		}
+	}, [enabled, nav]);
+	const clearTimer = (0, react$1.useCallback)(() => {
+		if (driveTimer.current !== null) {
+			clearInterval(driveTimer.current);
+			driveTimer.current = null;
+		}
+	}, []);
+	const stopDrive = (0, react$1.useCallback)(async () => {
+		clearTimer();
+		setDriving(null);
+		if (!nav) return;
+		await wrap(() => nav.stop({}));
+	}, [
+		clearTimer,
+		nav,
+		wrap
+	]);
+	const startDrive = (0, react$1.useCallback)((direction) => {
+		if (!nav) return;
+		clearTimer();
+		setDriving(direction);
+		const vector = DIRECTION_VECTORS$1[direction];
+		const nudge = () => {
+			nav.move({
+				pan: vector.pan,
+				tilt: vector.tilt
+			}).catch((err) => {
+				setError(err instanceof Error ? err.message : String(err));
+			});
+		};
+		nudge();
+		driveTimer.current = setInterval(nudge, NAVIGATION_DRIVE_INTERVAL_MS);
+	}, [clearTimer, nav]);
+	(0, react$1.useEffect)(() => {
+		return () => {
+			if (driveTimer.current !== null) {
+				clearInterval(driveTimer.current);
+				driveTimer.current = null;
+				nav?.stop({}).catch(() => void 0);
+			}
+		};
+	}, [nav]);
+	const runAction = (0, react$1.useCallback)((actionId) => wrap(async () => nav?.runAction({ actionId })), [nav, wrap]);
+	const playSound = (0, react$1.useCallback)((soundId) => wrap(async () => nav?.playSound({ soundId })), [nav, wrap]);
+	const setLightOn = (0, react$1.useCallback)((on) => wrap(async () => nav?.setLightOn({ on })), [nav, wrap]);
+	const setLightMode = (0, react$1.useCallback)((mode, level) => wrap(async () => nav?.setLightMode(level === void 0 ? { mode } : {
+		mode,
+		level
+	})), [nav, wrap]);
+	const setLightLevel = (0, react$1.useCallback)((level) => wrap(async () => nav?.setLightLevel({ level })), [nav, wrap]);
+	return {
+		features,
+		actions,
+		status: status ?? null,
+		startDrive,
+		stopDrive,
+		runAction,
+		playSound,
+		setLightOn,
+		setLightMode,
+		setLightLevel,
+		busy,
+		error,
+		driving
+	};
+}
+//#endregion
+//#region src/composites/cap-settings/NavigationPanel.tsx
+/** The cap's icon HINTS are lucide names; unknown hints fall back to a spark. */
+var ICONS = {
+	play: Play,
+	pause: Pause,
+	hand: Hand,
+	home: House,
+	bell: Bell,
+	crosshair: Crosshair,
+	"paw-print": PawPrint,
+	footprints: Footprints,
+	droplets: Droplets,
+	"trash-2": Trash2,
+	flashlight: Flashlight,
+	"flashlight-off": FlashlightOff,
+	cat: Cat,
+	dog: Dog,
+	clock: Clock
+};
+function iconFor(hint) {
+	return ICONS[hint] ?? Sparkles;
+}
+var DRIVE_BUTTONS = [
+	{
+		direction: "left",
+		label: "Turn left",
+		Icon: RotateCcw
+	},
+	{
+		direction: "forward",
+		label: "Forward",
+		Icon: ArrowUp
+	},
+	{
+		direction: "right",
+		label: "Turn right",
+		Icon: RotateCw
+	},
+	{
+		direction: "spin",
+		label: "Turn around",
+		Icon: Undo2
+	}
+];
+var BUTTON = "inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-[10px] font-medium transition-colors bg-surface-elevated/40 text-foreground-subtle hover:bg-surface-hover hover:text-foreground disabled:opacity-50";
+var BUTTON_ON = "bg-success/15 text-success hover:bg-success/25";
+function EntryButton({ entry, disabled, onRun }) {
+	const Glyph = iconFor(entry.icon);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: BUTTON,
+		disabled,
+		onClick: () => onRun(entry),
+		title: entry.label,
+		"aria-label": entry.label,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Glyph, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: entry.label })]
+	});
+}
+function NavigationPanel({ deviceId }) {
+	const system = useSystem();
+	const ready = Number.isFinite(deviceId);
+	const nav = useNavigation(system.trpcClient, ready ? deviceId : 0, { enabled: ready });
+	if (!ready) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center justify-center h-full text-[11px] text-foreground-subtle italic",
+		children: [
+			"Device #",
+			deviceId,
+			" not loaded."
+		]
+	});
+	const features = nav.features;
+	const actions = nav.actions.filter((entry) => entry.enabled && entry.kind === "action");
+	const sounds = nav.actions.filter((entry) => entry.enabled && entry.kind === "sound");
+	const status = nav.status;
+	const manual = status?.lightMode === "manual";
+	const run = (entry) => {
+		if (entry.kind === "sound") {
+			if (entry.soundId !== void 0) nav.playSound(entry.soundId);
+			return;
+		}
+		nav.runAction(entry.id);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(WidgetPanel, {
+		title: "Navigation",
+		icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Navigation, { className: "h-3.5 w-3.5 text-foreground-subtle" }),
+		bodyClassName: "p-3 flex flex-col gap-3 overflow-y-auto",
+		children: [
+			status && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-wrap items-center gap-1.5 text-[10px]",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "rounded-full bg-surface-elevated/60 px-2 py-0.5 text-foreground",
+						children: status.mode
+					}),
+					status.following && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "rounded-full bg-info/15 px-2 py-0.5 text-info",
+						children: "following"
+					}),
+					status.flash && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "rounded-full bg-warning/15 px-2 py-0.5 text-warning",
+						children: "light on"
+					})
+				]
+			}),
+			features?.move && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: "flex flex-col gap-1.5",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[10.5px] font-semibold text-foreground",
+						children: "Drive (hold)"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "grid grid-cols-4 gap-1.5",
+						children: DRIVE_BUTTONS.map(({ direction, label, Icon }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: cn(BUTTON, "justify-center select-none", nav.driving === direction && BUTTON_ON),
+							"aria-label": label,
+							title: label,
+							onPointerDown: () => nav.startDrive(direction),
+							onPointerUp: () => void nav.stopDrive(),
+							onPointerLeave: () => {
+								if (nav.driving === direction) nav.stopDrive();
+							},
+							onPointerCancel: () => void nav.stopDrive(),
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" })
+						}, direction))
+					}),
+					features.stop && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: cn(BUTTON, "justify-center"),
+						onClick: () => void nav.stopDrive(),
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Hand, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "Stop" })]
+					})
+				]
+			}),
+			features?.runAction && actions.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: "flex flex-col gap-1.5",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-[10.5px] font-semibold text-foreground",
+					children: "Actions"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex flex-wrap gap-1.5",
+					children: actions.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EntryButton, {
+						entry,
+						disabled: nav.busy,
+						onRun: run
+					}, entry.id))
+				})]
+			}),
+			features?.playSound && sounds.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: "flex flex-col gap-1.5",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-[10.5px] font-semibold text-foreground",
+					children: "Sounds"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex flex-wrap gap-1.5",
+					children: sounds.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EntryButton, {
+						entry,
+						disabled: nav.busy,
+						onRun: run
+					}, entry.id))
+				})]
+			}),
+			features?.light && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: "flex flex-col gap-1.5 border-t border-border/40 pt-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center justify-between",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[10.5px] font-semibold text-foreground",
+						children: "Fill light"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: cn(BUTTON, status?.flash && BUTTON_ON),
+						"aria-pressed": status?.flash === true,
+						disabled: nav.busy,
+						onClick: () => void nav.setLightOn(!(status?.flash === true)),
+						children: [status?.flash ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Flashlight, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FlashlightOff, { className: "h-3.5 w-3.5" }), status?.flash ? "On" : "Off"]
+					})]
+				}), features.lightMode && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+							"aria-label": "Light mode",
+							className: "rounded-md bg-surface-elevated/40 px-2 py-1 text-[10px] text-foreground",
+							value: status?.lightMode ?? "auto",
+							disabled: nav.busy,
+							onChange: (event) => {
+								const mode = event.target.value === "manual" ? "manual" : "auto";
+								nav.setLightMode(mode, mode === "manual" ? status?.lightLevel : void 0);
+							},
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "auto",
+								children: "Auto"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "manual",
+								children: "Manual"
+							})]
+						}),
+						manual && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							type: "range",
+							"aria-label": "Light level",
+							className: "flex-1",
+							min: _camstack_types.NAVIGATION_LIGHT_LEVEL_MIN,
+							max: _camstack_types.NAVIGATION_LIGHT_LEVEL_MAX,
+							step: 1,
+							value: status?.lightLevel ?? _camstack_types.NAVIGATION_LIGHT_LEVEL_MAX,
+							disabled: nav.busy,
+							onChange: (event) => void nav.setLightLevel(Number(event.target.value))
+						}),
+						manual && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-[10px] text-foreground-subtle w-8 text-right",
+							children: status?.lightLevel ?? _camstack_types.NAVIGATION_LIGHT_LEVEL_MAX
+						})
+					]
+				})]
+			}),
+			nav.error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "text-[10px] text-danger",
+				children: nav.error
+			})
+		]
+	});
+}
+//#endregion
 //#region src/lib/cap-error.ts
 /**
 * Shared capability-error utilities for the admin UI.
@@ -18695,6 +19268,7 @@ var HOST_WIDGETS = {
 	"host/motion-zones-grid": (0, react$1.lazy)(() => Promise.resolve().then(() => require("./MotionZonesSettings-BP9p0pFB.cjs")).then((m) => ({ default: m.MotionZonesSettings }))),
 	"host/privacy-mask-grid": (0, react$1.lazy)(() => Promise.resolve().then(() => require("./PrivacyMaskSettings-Oo7gyB4E.cjs")).then((m) => ({ default: m.PrivacyMaskSettings }))),
 	"host/ptz-panel": PtzPanel,
+	"host/navigation-panel": NavigationPanel,
 	"host/consumables-panel": ConsumablesPanel,
 	"host/ptz-autotrack": AutotrackSection,
 	"host/recording-panel": RecordingPanel
@@ -24486,6 +25060,49 @@ function BatteryBadge({ status, variant = "compact", className }) {
 	});
 }
 //#endregion
+//#region src/composites/network-link-badge.tsx
+/**
+* NetworkLinkBadge — compact link indicator for device rows and headers.
+*
+* A wire glyph for ethernet, a wifi glyph with the signal for wireless, an
+* antenna for cellular. Renders nothing for an `unknown` link — that is the
+* absence of a read, not a link — and shows no percentage when the signal is
+* `null` (a wire has none; a wireless link not yet read must not sit at 0 %).
+*
+* Self-contained on data: the caller passes the `network-link` slice from
+* `useDeviceNetworkLink` and drops the badge in unconditionally.
+*/
+/** Monotonic — more signal, more arcs. */
+function pickWifiIcon(signalPercent) {
+	if (signalPercent === null) return Wifi;
+	if (signalPercent <= 20) return WifiZero;
+	if (signalPercent <= 50) return WifiLow;
+	if (signalPercent <= 80) return WifiHigh;
+	return Wifi;
+}
+function signalColor(signalPercent) {
+	if (signalPercent === null) return "text-foreground-subtle";
+	if (signalPercent <= 20) return "text-rose-400";
+	if (signalPercent <= 50) return "text-amber-400";
+	return "text-foreground-subtle";
+}
+function NetworkLinkBadge({ status, className }) {
+	if (!status || status.type === "unknown") return null;
+	if (status.type === "ethernet") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: cn("inline-flex items-center gap-1 text-[10px] font-medium text-foreground-subtle", className),
+		title: "Network: ethernet",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Cable, { className: "h-3.5 w-3.5" })
+	});
+	const Icon = status.type === "cellular" ? RadioTower : pickWifiIcon(status.signalPercent);
+	const signal = status.signalPercent === null ? null : Math.round(status.signalPercent);
+	const title = `Network: ${status.type}` + (status.ssid ? ` (${status.ssid})` : "") + (signal === null ? "" : ` · signal ${signal}%`);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: cn("inline-flex items-center gap-1 text-[10px] font-medium", signalColor(status.signalPercent), className),
+		title,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-3.5 w-3.5" }), signal !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [signal, "%"] })]
+	});
+}
+//#endregion
 //#region src/composites/breadcrumb.tsx
 /**
 * Breadcrumb navigation component.
@@ -42027,6 +42644,19 @@ function useDeviceBattery(trpc, deviceId) {
 	return useDeviceState(trpc, deviceId, (s) => s.battery) ?? null;
 }
 //#endregion
+//#region src/hooks/use-device-network-link.ts
+/**
+* useDeviceNetworkLink — the device's own network link (medium + signal).
+*
+* Same shape as `useDeviceBattery`: a thin wrapper over `useDeviceState`,
+* fed by the kernel runtime-state mirror (one fetch on first subscribe, then
+* push updates on every `network-link` slice write). Returns `null` when no
+* provider has emitted yet — a device without the cap simply has no badge.
+*/
+function useDeviceNetworkLink(trpc, deviceId) {
+	return useDeviceState(trpc, deviceId, (s) => s.networkLink) ?? null;
+}
+//#endregion
 //#region src/hooks/use-device-snapshot.ts
 /**
 * useDeviceSnapshotImage — a device's snapshot as a plain image URL.
@@ -42200,17 +42830,23 @@ function DeviceItemPreview({ trpc, device, status, enabled, showStatusPills = fa
 	const isBatteryOperated = (device.features ?? []).includes("battery-operated");
 	const wantPills = showStatusPills && isBatteryOperated && !device.disabled;
 	const batteryStatus = useDeviceBattery(trpc, wantPills ? device.id : null);
-	if (!enabled && !wantPills) return null;
+	const wantLinkPill = showStatusPills && !device.disabled;
+	const linkStatus = useDeviceNetworkLink(trpc, wantLinkPill ? device.id : null);
+	if (!enabled && !wantPills && !(wantLinkPill && linkStatus)) return null;
 	const offline = status === "offline" || status === "disabled";
 	const placeholder = status === "offline" ? "Offline — no snapshot" : status === "disabled" ? "Disabled" : "No snapshot yet";
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 		className: "inline-flex items-center gap-1.5 flex-nowrap whitespace-nowrap",
-		children: [wantPills && batteryStatus && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BatteryBadge, { status: batteryStatus }), enabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HoverZoomImage, {
-			src: offline ? null : snapshot.src,
-			alt: device.name,
-			placeholder,
-			thumbClassName: "h-7 w-7 rounded"
-		})]
+		children: [
+			wantPills && batteryStatus && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BatteryBadge, { status: batteryStatus }),
+			wantLinkPill && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NetworkLinkBadge, { status: linkStatus }),
+			enabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HoverZoomImage, {
+				src: offline ? null : snapshot.src,
+				alt: device.name,
+				placeholder,
+				thumbClassName: "h-7 w-7 rounded"
+			})
+		]
 	});
 }
 //#endregion
@@ -49664,6 +50300,9 @@ exports.Mic = Mic;
 exports.MobileDrawer = MobileDrawer;
 exports.ModelPicker = ModelPicker;
 exports.MotionZonesSettings = MotionZonesSettings;
+exports.NAVIGATION_DRIVE_INTERVAL_MS = NAVIGATION_DRIVE_INTERVAL_MS;
+exports.NavigationPanel = NavigationPanel;
+exports.NetworkLinkBadge = NetworkLinkBadge;
 exports.NodeMultiSelectField = NodeMultiSelectField;
 exports.NodePicker = NodePicker;
 exports.NodeSelectField = NodeSelectField;
@@ -50181,6 +50820,7 @@ exports.useDeviceManagerTestField = useDeviceManagerTestField;
 exports.useDeviceManagerUpdateConfig = useDeviceManagerUpdateConfig;
 exports.useDeviceManagerUpdateDeviceField = useDeviceManagerUpdateDeviceField;
 exports.useDeviceManagerUpdateDeviceFieldsBatch = useDeviceManagerUpdateDeviceFieldsBatch;
+exports.useDeviceNetworkLink = useDeviceNetworkLink;
 exports.useDeviceOpsGetConfigEntries = useDeviceOpsGetConfigEntries;
 exports.useDeviceOpsGetRawState = useDeviceOpsGetRawState;
 exports.useDeviceOpsGetSettingsSchema = useDeviceOpsGetSettingsSchema;
@@ -50381,11 +51021,24 @@ exports.useMqttBrokerStopEmbeddedBroker = useMqttBrokerStopEmbeddedBroker;
 exports.useMqttBrokerTestConnection = useMqttBrokerTestConnection;
 exports.useNativeObjectDetectionGetStatus = useNativeObjectDetectionGetStatus;
 exports.useNativeObjectDetectionSetEnabled = useNativeObjectDetectionSetEnabled;
+exports.useNavigation = useNavigation;
+exports.useNavigationGetFeatures = useNavigationGetFeatures;
+exports.useNavigationGetStatus = useNavigationGetStatus;
+exports.useNavigationGoToPoint = useNavigationGoToPoint;
+exports.useNavigationListActions = useNavigationListActions;
+exports.useNavigationMove = useNavigationMove;
+exports.useNavigationPlaySound = useNavigationPlaySound;
+exports.useNavigationRunAction = useNavigationRunAction;
+exports.useNavigationSetLightLevel = useNavigationSetLightLevel;
+exports.useNavigationSetLightMode = useNavigationSetLightMode;
+exports.useNavigationSetLightOn = useNavigationSetLightOn;
+exports.useNavigationStop = useNavigationStop;
 exports.useNetworkAccessGetEndpoint = useNetworkAccessGetEndpoint;
 exports.useNetworkAccessGetStatus = useNetworkAccessGetStatus;
 exports.useNetworkAccessListEndpoints = useNetworkAccessListEndpoints;
 exports.useNetworkAccessStart = useNetworkAccessStart;
 exports.useNetworkAccessStop = useNetworkAccessStop;
+exports.useNetworkLinkGetStatus = useNetworkLinkGetStatus;
 exports.useNetworkQualityGetAllStats = useNetworkQualityGetAllStats;
 exports.useNetworkQualityGetDeviceStats = useNetworkQualityGetDeviceStats;
 exports.useNetworkQualityReportClientStats = useNetworkQualityReportClientStats;