@camstack/ui-library 1.2.174 → 1.2.176

package/dist/index.cjs

@@ -6625,10 +6625,10 @@ var usePtzGetHomePreset = trpc.ptz.getHomePreset.useQuery;
 var usePtzSetHomePreset = trpc.ptz.setHomePreset.useMutation;
 /** Generated alias around `trpc.ptz.captureHomeHere.useMutation`. */
 var usePtzCaptureHomeHere = trpc.ptz.captureHomeHere.useMutation;
-/** Generated alias around `trpc.ptz.getHomeReturnSeconds.useQuery`. */
-var usePtzGetHomeReturnSeconds = trpc.ptz.getHomeReturnSeconds.useQuery;
-/** Generated alias around `trpc.ptz.setHomeReturnSeconds.useMutation`. */
-var usePtzSetHomeReturnSeconds = trpc.ptz.setHomeReturnSeconds.useMutation;
+/** Generated alias around `trpc.ptz.getHomeReturn.useQuery`. */
+var usePtzGetHomeReturn = trpc.ptz.getHomeReturn.useQuery;
+/** Generated alias around `trpc.ptz.setHomeReturn.useMutation`. */
+var usePtzSetHomeReturn = trpc.ptz.setHomeReturn.useMutation;
 /** Generated alias around `trpc.ptz.getPosition.useQuery`. */
 var usePtzGetPosition = trpc.ptz.getPosition.useQuery;
 /** Generated alias around `trpc.ptz.setAutofocus.useMutation`. */
@@ -16261,6 +16261,136 @@ function AutotrackSection({ deviceId }) {
 	});
 }
 //#endregion
+//#region src/hooks/use-device-proxy.ts
+/**
+* useDeviceProxy — canonical React entry point for a device.
+*
+* Symmetric with the server's `ctx.fetchDevice(id)` and the SDK's
+* `BackendClient.fetchDevice(id)` — same `DeviceProxy` shape, same
+* routing semantics (cap-method calls go through the wrapper chain;
+* `state.<cap>.value` reads the kernel's mirrored snapshot, never
+* the provider).
+*
+* What you can do with the returned proxy:
+*
+*   const dev = useDeviceProxy(trpc, deviceId)
+*
+*   // Reactive runtime state — re-renders when the slice changes.
+*   const battery = useDeviceStateSlice(dev?.state.battery)
+*
+*   // Imperative cap-method calls — through the wrapper chain.
+*   await dev?.snapshot?.getSnapshot({ streamId: 'high' })
+*   await dev?.ptz?.move({ direction: 'left', steps: 1 })
+*
+* Lifecycle: the hook resolves bindings via `deviceManager.getBindings`
+* the first time `deviceId` becomes valid, and refreshes them on
+* `capability.binding-changed` events for that device. Returns `null`
+* until the first resolution completes (the proxy is not constructible
+* without a binding).
+*
+* Works in both admin-ui (`BackendClient.trpc`) and addon pages
+* (`AddonPageProps.trpc`) — parametrized by a minimal vanilla tRPC
+* proxy shape (matches both at runtime).
+*/
+var BINDING_CHANGED_CATEGORY = "capability.binding-changed";
+/**
+* @returns the proxy, or `null` while bindings are still loading or
+* when `deviceId` is null. Re-rendered when bindings change.
+*/
+function useDeviceProxy(trpc, deviceId) {
+	const [binding, setBinding] = (0, react$1.useState)(null);
+	(0, react$1.useEffect)(() => {
+		if (deviceId === null) {
+			setBinding(null);
+			return;
+		}
+		let cancelled = false;
+		const refresh = async () => {
+			try {
+				const next = await trpc.deviceManager.getBindings.query({ deviceId });
+				if (!cancelled) setBinding(next);
+			} catch {
+				if (!cancelled) setBinding((prev) => prev);
+			}
+		};
+		refresh();
+		const sub = trpc.live?.onEvent.subscribe({ category: BINDING_CHANGED_CATEGORY }, { onData: (evt) => {
+			const src = evt.data?.source;
+			if (!src) {
+				refresh();
+				return;
+			}
+			if (src.type === "device" && src.id === deviceId) refresh();
+		} });
+		return () => {
+			cancelled = true;
+			sub?.unsubscribe();
+		};
+	}, [trpc, deviceId]);
+	return (0, react$1.useMemo)(() => {
+		if (!binding) return null;
+		return (0, _camstack_types.createDeviceProxy)(trpc, binding);
+	}, [trpc, binding]);
+}
+/**
+* Companion hook — reads a `SliceHandle` reactively, returning the
+* current value and re-rendering on every push from the kernel
+* mirror. Pass `dev?.state.battery` etc. as the handle.
+*
+*   const dev = useDeviceProxy(trpc, deviceId)
+*   const battery = useDeviceStateSlice(dev?.state.battery)
+*
+* Why a hook (and not just `dev.state.battery.subscribe(...)` inline)?
+* React doesn't observe external mutations on its own — a bare
+* subscribe call inside a render would fire on every render (memory
+* leak), wouldn't trigger a re-render on slice change, and wouldn't
+* clean up at unmount. The hook bridges the imperative
+* `(value, subscribe)` pair into React's declarative lifecycle via
+* `useSyncExternalStore` (the canonical React 18 primitive for
+* external stores — handles tearing in concurrent rendering and
+* de-dups identical pushes).
+*/
+function useDeviceStateSlice(handle) {
+	const subscribe = (0, react$1.useCallback)((notify) => {
+		if (!handle) return () => void 0;
+		return handle.subscribe(() => notify());
+	}, [handle]);
+	const getSnapshot = (0, react$1.useCallback)(() => handle?.value, [handle]);
+	return (0, react$1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+}
+/**
+* One-line combinator — collapse the common
+* `useDeviceProxy + useDeviceStateSlice(dev?.state.<cap>)` pair into a
+* single hook. The selector receives the live `DeviceProxy['state']`
+* bag (typed against the codegen, so `s.battery` etc. autocomplete)
+* and returns one slice handle. Returns the slice value, undefined
+* while the binding resolves OR when the slice has no cached push yet.
+*
+* Idiomatic call-site:
+*
+*   const battery = useDeviceState(trpc, deviceId, (s) => s.battery)
+*   const zones = useDeviceState(trpc, deviceId, (s) => s.zones)
+*
+* vs. the manual pair:
+*
+*   const dev = useDeviceProxy(trpc, deviceId)
+*   const battery = useDeviceStateSlice(dev?.state.battery)
+*   const zones = useDeviceStateSlice(dev?.state.zones)
+*
+* Use the manual pair when:
+*   - you also need the proxy's cap method bag (`dev.zones?.addZone(...)`)
+*   - you want to share the proxy across multiple slice reads with a
+*     single binding fetch (the combinator calls useDeviceProxy
+*     internally, which dedups bindings via React Query in practice
+*     but spawns one extra subscription per call site)
+*
+* Use the combinator when reading just one slice — most common case.
+*/
+function useDeviceState(trpc, deviceId, select) {
+	const dev = useDeviceProxy(trpc, deviceId);
+	return useDeviceStateSlice(dev ? select(dev.state) : void 0);
+}
+//#endregion
 //#region src/hooks/use-devices.ts
 /**
 * useDevices / useDevice — reactive sync-mirror reads.
@@ -16446,20 +16576,49 @@ function readCell(value) {
 		cell
 	};
 }
-/** Parse the `getGridForDevice` reply. See {@link GridLayoutReadOutcome}. */
+function readProfileOffer(value) {
+	if (!isRecord(value)) return null;
+	const profile = value["profile"];
+	const offered = value["offered"];
+	const missing = value["missingSources"];
+	if (profile !== "high" && profile !== "mid" && profile !== "low") return null;
+	if (typeof offered !== "boolean" || !Array.isArray(missing)) return null;
+	const missingSources = [];
+	for (const entry of missing) {
+		if (typeof entry !== "number" || !Number.isInteger(entry)) return null;
+		missingSources.push(entry);
+	}
+	return {
+		profile,
+		offered,
+		missingSources
+	};
+}
+/**
+* Parse the `camera-grid-layout.getLayout` reply. See {@link GridLayoutReadOutcome}.
+*
+* The cap answers the view itself, or `null` — there is no envelope. It used to
+* come back as `{ grid }` from `addons.custom`, which was the mechanism the
+* widget reached the addon through before the geometry had a capability of its
+* own; the widget now asks THE CAMERA and the envelope went with the bridge.
+*/
 function parseGridView(raw) {
-	if (!isRecord(raw) || !("grid" in raw)) return "unreadable";
-	const grid = raw["grid"];
-	if (grid === null) return null;
-	if (!isRecord(grid)) return "unreadable";
-	const { instanceId, deviceId, name, width, height, fps, cells } = grid;
-	if (typeof instanceId !== "string" || typeof deviceId !== "number" || typeof name !== "string" || typeof width !== "number" || typeof height !== "number" || typeof fps !== "number" || !Array.isArray(cells)) return "unreadable";
+	if (raw === null) return null;
+	if (!isRecord(raw)) return "unreadable";
+	const { instanceId, deviceId, name, width, height, fps, cells, profiles } = raw;
+	if (typeof instanceId !== "string" || typeof deviceId !== "number" || typeof name !== "string" || typeof width !== "number" || typeof height !== "number" || typeof fps !== "number" || !Array.isArray(cells) || !Array.isArray(profiles)) return "unreadable";
 	const parsed = [];
 	for (const entry of cells) {
 		const cell = readCell(entry);
 		if (cell === null) return "unreadable";
 		parsed.push(cell);
 	}
+	const offers = [];
+	for (const entry of profiles) {
+		const offer = readProfileOffer(entry);
+		if (offer === null) return "unreadable";
+		offers.push(offer);
+	}
 	return {
 		instanceId,
 		deviceId,
@@ -16467,7 +16626,8 @@ function parseGridView(raw) {
 		width,
 		height,
 		fps,
-		cells: parsed
+		cells: parsed,
+		profiles: offers
 	};
 }
 /**
@@ -16525,7 +16685,6 @@ function resizeNormalizedRect(rect, dw, dh) {
 * the server nothing and it is wrong in exactly the ways the real composition
 * would be wrong.
 */
-var ADDON_ID = "camera-grid";
 var FULL_FRAME = {
 	x: 0,
 	y: 0,
@@ -16544,36 +16703,36 @@ function CameraGridLayoutEditor({ deviceId }) {
 	const [saveError, setSaveError] = (0, react$1.useState)(null);
 	const [selected, setSelected] = (0, react$1.useState)(0);
 	const [drag, setDrag] = (0, react$1.useState)(null);
+	const dev = useDeviceProxy(system.trpcClient, deviceId);
 	const reload = (0, react$1.useCallback)(async () => {
-		const outcome = parseGridView(await system.trpcClient.addons.custom.mutate({
-			addonId: ADDON_ID,
-			action: "getGridForDevice",
-			input: { deviceId }
-		}));
+		const layout = dev?.cameraGridLayout;
+		if (!layout) return;
+		const outcome = parseGridView(await layout.getLayout({}));
 		setLoaded(outcome);
 		setDraft(outcome === null || outcome === "unreadable" ? null : outcome);
-	}, [system, deviceId]);
+	}, [dev]);
 	(0, react$1.useEffect)(() => {
+		if (!dev) return;
+		if (!dev.cameraGridLayout) {
+			setLoaded(null);
+			return;
+		}
 		reload().catch(() => {
 			setLoaded("unreadable");
 		});
-	}, [reload]);
+	}, [dev, reload]);
 	const save = (0, react$1.useCallback)(async () => {
-		if (draft === null) return;
+		const layout = dev?.cameraGridLayout;
+		if (draft === null || !layout) return;
 		setSaving(true);
 		setSaveError(null);
 		try {
-			const outcome = parseGridView(await system.trpcClient.addons.custom.mutate({
-				addonId: ADDON_ID,
-				action: "saveGridLayout",
-				input: {
-					deviceId,
-					name: draft.name,
-					width: draft.width,
-					height: draft.height,
-					fps: draft.fps,
-					cells: draft.cells.map((cell) => ({ ...cell }))
-				}
+			const outcome = parseGridView(await layout.saveLayout({
+				name: draft.name,
+				width: draft.width,
+				height: draft.height,
+				fps: draft.fps,
+				cells: draft.cells.map((cell) => ({ ...cell }))
 			}));
 			if (outcome !== null && outcome !== "unreadable") {
 				setLoaded(outcome);
@@ -16584,11 +16743,7 @@ function CameraGridLayoutEditor({ deviceId }) {
 		} finally {
 			setSaving(false);
 		}
-	}, [
-		system,
-		deviceId,
-		draft
-	]);
+	}, [dev, draft]);
 	const patchCell = (0, react$1.useCallback)((index, patch) => {
 		setDraft((prev) => prev === null ? prev : {
 			...prev,
@@ -16742,6 +16897,10 @@ function CameraGridLayoutEditor({ deviceId }) {
 						})
 					]
 				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GridProfileReport, {
+					offers: loaded.profiles,
+					cameras
+				}),
 				draft.cells[selected] !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CellInspector, {
 					cell: draft.cells[selected],
 					index: selected,
@@ -16761,6 +16920,37 @@ function CameraGridLayoutEditor({ deviceId }) {
 		})
 	});
 }
+/**
+* The honest report. A grid's `high` composes its sources' `high` and its `low`
+* their `low`, so a profile is on offer only when EVERY source can serve it —
+* and the refusal names the source, because "this grid has no low" is not
+* something an operator can act on and "615 has no low" is.
+*
+* Read-only on purpose: what is on offer is decided by the source cameras'
+* assignments, and a control here would be a switch that writes nothing (D62).
+*/
+function GridProfileReport({ offers, cameras }) {
+	const nameOf = (deviceId) => cameras.find((camera) => camera.id === deviceId)?.name ?? `#${String(deviceId)}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-1 rounded border border-border p-2 text-[10.5px]",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "uppercase text-foreground-subtle",
+			children: "Published profiles"
+		}), offers.map((offer) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-baseline gap-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "w-10 uppercase",
+				children: offer.profile
+			}), offer.offered ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "text-foreground-subtle",
+				children: ["composed from every source’s ", offer.profile]
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-danger",
+				children: offer.missingSources.length === 0 ? "not offered — this grid has no cells yet" : `not offered — no ${offer.profile} on ${offer.missingSources.map(nameOf).join(", ")}`
+			})]
+		}, offer.profile))]
+	});
+}
 function GridCellBox({ cell, selected, onSelect, onDragStart }) {
 	const { src } = useDeviceSnapshotImage(cell.deviceId, { width: 640 });
 	const backgroundSize = `${String(100 / cell.source.width)}% ${String(100 / cell.source.height)}%`;
@@ -16866,136 +17056,6 @@ function LabelledNumber({ label, value, step = 1, onChange }) {
 	});
 }
 //#endregion
-//#region src/hooks/use-device-proxy.ts
-/**
-* useDeviceProxy — canonical React entry point for a device.
-*
-* Symmetric with the server's `ctx.fetchDevice(id)` and the SDK's
-* `BackendClient.fetchDevice(id)` — same `DeviceProxy` shape, same
-* routing semantics (cap-method calls go through the wrapper chain;
-* `state.<cap>.value` reads the kernel's mirrored snapshot, never
-* the provider).
-*
-* What you can do with the returned proxy:
-*
-*   const dev = useDeviceProxy(trpc, deviceId)
-*
-*   // Reactive runtime state — re-renders when the slice changes.
-*   const battery = useDeviceStateSlice(dev?.state.battery)
-*
-*   // Imperative cap-method calls — through the wrapper chain.
-*   await dev?.snapshot?.getSnapshot({ streamId: 'high' })
-*   await dev?.ptz?.move({ direction: 'left', steps: 1 })
-*
-* Lifecycle: the hook resolves bindings via `deviceManager.getBindings`
-* the first time `deviceId` becomes valid, and refreshes them on
-* `capability.binding-changed` events for that device. Returns `null`
-* until the first resolution completes (the proxy is not constructible
-* without a binding).
-*
-* Works in both admin-ui (`BackendClient.trpc`) and addon pages
-* (`AddonPageProps.trpc`) — parametrized by a minimal vanilla tRPC
-* proxy shape (matches both at runtime).
-*/
-var BINDING_CHANGED_CATEGORY = "capability.binding-changed";
-/**
-* @returns the proxy, or `null` while bindings are still loading or
-* when `deviceId` is null. Re-rendered when bindings change.
-*/
-function useDeviceProxy(trpc, deviceId) {
-	const [binding, setBinding] = (0, react$1.useState)(null);
-	(0, react$1.useEffect)(() => {
-		if (deviceId === null) {
-			setBinding(null);
-			return;
-		}
-		let cancelled = false;
-		const refresh = async () => {
-			try {
-				const next = await trpc.deviceManager.getBindings.query({ deviceId });
-				if (!cancelled) setBinding(next);
-			} catch {
-				if (!cancelled) setBinding((prev) => prev);
-			}
-		};
-		refresh();
-		const sub = trpc.live?.onEvent.subscribe({ category: BINDING_CHANGED_CATEGORY }, { onData: (evt) => {
-			const src = evt.data?.source;
-			if (!src) {
-				refresh();
-				return;
-			}
-			if (src.type === "device" && src.id === deviceId) refresh();
-		} });
-		return () => {
-			cancelled = true;
-			sub?.unsubscribe();
-		};
-	}, [trpc, deviceId]);
-	return (0, react$1.useMemo)(() => {
-		if (!binding) return null;
-		return (0, _camstack_types.createDeviceProxy)(trpc, binding);
-	}, [trpc, binding]);
-}
-/**
-* Companion hook — reads a `SliceHandle` reactively, returning the
-* current value and re-rendering on every push from the kernel
-* mirror. Pass `dev?.state.battery` etc. as the handle.
-*
-*   const dev = useDeviceProxy(trpc, deviceId)
-*   const battery = useDeviceStateSlice(dev?.state.battery)
-*
-* Why a hook (and not just `dev.state.battery.subscribe(...)` inline)?
-* React doesn't observe external mutations on its own — a bare
-* subscribe call inside a render would fire on every render (memory
-* leak), wouldn't trigger a re-render on slice change, and wouldn't
-* clean up at unmount. The hook bridges the imperative
-* `(value, subscribe)` pair into React's declarative lifecycle via
-* `useSyncExternalStore` (the canonical React 18 primitive for
-* external stores — handles tearing in concurrent rendering and
-* de-dups identical pushes).
-*/
-function useDeviceStateSlice(handle) {
-	const subscribe = (0, react$1.useCallback)((notify) => {
-		if (!handle) return () => void 0;
-		return handle.subscribe(() => notify());
-	}, [handle]);
-	const getSnapshot = (0, react$1.useCallback)(() => handle?.value, [handle]);
-	return (0, react$1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
-}
-/**
-* One-line combinator — collapse the common
-* `useDeviceProxy + useDeviceStateSlice(dev?.state.<cap>)` pair into a
-* single hook. The selector receives the live `DeviceProxy['state']`
-* bag (typed against the codegen, so `s.battery` etc. autocomplete)
-* and returns one slice handle. Returns the slice value, undefined
-* while the binding resolves OR when the slice has no cached push yet.
-*
-* Idiomatic call-site:
-*
-*   const battery = useDeviceState(trpc, deviceId, (s) => s.battery)
-*   const zones = useDeviceState(trpc, deviceId, (s) => s.zones)
-*
-* vs. the manual pair:
-*
-*   const dev = useDeviceProxy(trpc, deviceId)
-*   const battery = useDeviceStateSlice(dev?.state.battery)
-*   const zones = useDeviceStateSlice(dev?.state.zones)
-*
-* Use the manual pair when:
-*   - you also need the proxy's cap method bag (`dev.zones?.addZone(...)`)
-*   - you want to share the proxy across multiple slice reads with a
-*     single binding fetch (the combinator calls useDeviceProxy
-*     internally, which dedups bindings via React Query in practice
-*     but spawns one extra subscription per call site)
-*
-* Use the combinator when reading just one slice — most common case.
-*/
-function useDeviceState(trpc, deviceId, select) {
-	const dev = useDeviceProxy(trpc, deviceId);
-	return useDeviceStateSlice(dev ? select(dev.state) : void 0);
-}
-//#endregion
 //#region src/hooks/use-device-capability.ts
 function useDeviceCapability(options) {
 	const dev = useDeviceProxy(options.trpc, options.deviceId);
@@ -17638,7 +17698,7 @@ function usePTZ(trpc, deviceId, hookOptions) {
 	const ptz = useDeviceProxy(trpc, enabled ? deviceId : null)?.ptz;
 	const [presets, setPresets] = (0, react$1.useState)([]);
 	const [homePreset, setHomePresetState] = (0, react$1.useState)(null);
-	const [homeReturnSeconds, setHomeReturnState] = (0, react$1.useState)(null);
+	const [homeReturn, setHomeReturnState] = (0, react$1.useState)(null);
 	const [options, setOptions] = (0, react$1.useState)(null);
 	const [busy, setBusy] = (0, react$1.useState)(false);
 	const [error, setError] = (0, react$1.useState)(null);
@@ -17663,7 +17723,7 @@ function usePTZ(trpc, deviceId, hookOptions) {
 	const refreshHomeReturn = (0, react$1.useCallback)(async () => {
 		if (!enabled || !ptz) return;
 		try {
-			setHomeReturnState(await ptz.getHomeReturnSeconds({}));
+			setHomeReturnState(await ptz.getHomeReturn({}));
 		} catch (err) {
 			if (isAbsentProvider(err)) return;
 			setHomeReturnState(null);
@@ -17781,10 +17841,13 @@ function usePTZ(trpc, deviceId, hookOptions) {
 			wrap,
 			refreshHomePreset
 		]),
-		homeReturnSeconds,
-		setHomeReturnSeconds: (0, react$1.useCallback)(async (seconds) => {
+		homeReturn,
+		setHomeReturn: (0, react$1.useCallback)(async (enabled, seconds) => {
 			if (!ptz) return;
-			await wrap(() => ptz.setHomeReturnSeconds({ seconds }));
+			await wrap(() => ptz.setHomeReturn({
+				enabled,
+				seconds
+			}));
 			await refreshHomeReturn();
 		}, [
 			ptz,
@@ -17885,7 +17948,7 @@ function usePTZ(trpc, deviceId, hookOptions) {
 */
 var SELECT_CLASS$2 = "rounded-md border border-border bg-surface px-2 py-1 text-[11px] text-foreground focus:border-primary focus:outline-none disabled:opacity-50";
 function HomePresetPicker({ controls }) {
-	const { homePreset, presets, setHomePreset, captureHomeHere, homeReturnSeconds, setHomeReturnSeconds, busy } = controls;
+	const { homePreset, presets, setHomePreset, captureHomeHere, homeReturn, setHomeReturn, busy } = controls;
 	const [saving, setSaving] = (0, react$1.useState)(false);
 	if (homePreset === null) return null;
 	const disabled = busy || saving;
@@ -17926,23 +17989,37 @@ function HomePresetPicker({ controls }) {
 				className: "self-start rounded-md border border-border px-2 py-1 text-[11px] text-foreground hover:bg-primary/10 disabled:opacity-50",
 				children: "Set home here"
 			}),
-			homeReturnSeconds !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			homeReturn !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex flex-col gap-1",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "text-[10px] font-medium text-foreground-subtle",
-					children: "Return home after (s)"
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-					type: "number",
-					min: 0,
-					max: 3600,
-					defaultValue: homeReturnSeconds,
-					disabled,
-					onBlur: (e) => {
-						const next = Number(e.target.value);
-						if (!Number.isFinite(next) || next === homeReturnSeconds) return;
-						run(() => setHomeReturnSeconds(Math.round(next)));
-					},
-					className: SELECT_CLASS$2
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						type: "checkbox",
+						checked: homeReturn.enabled,
+						disabled,
+						onChange: (e) => run(() => setHomeReturn(e.target.checked, homeReturn.seconds))
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[10px] font-medium text-foreground-subtle",
+						children: "Return home when idle"
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[10px] font-medium text-foreground-subtle",
+						children: "After (s)"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						type: "number",
+						min: 0,
+						max: 3600,
+						defaultValue: homeReturn.seconds,
+						disabled,
+						onBlur: (e) => {
+							const next = Number(e.target.value);
+							if (!Number.isFinite(next) || Math.round(next) === homeReturn.seconds) return;
+							run(() => setHomeReturn(homeReturn.enabled, Math.round(next)));
+						},
+						className: SELECT_CLASS$2
+					})]
 				})]
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -52588,7 +52665,7 @@ exports.usePtzCaptureHomeHere = usePtzCaptureHomeHere;
 exports.usePtzContinuousMove = usePtzContinuousMove;
 exports.usePtzDeletePreset = usePtzDeletePreset;
 exports.usePtzGetHomePreset = usePtzGetHomePreset;
-exports.usePtzGetHomeReturnSeconds = usePtzGetHomeReturnSeconds;
+exports.usePtzGetHomeReturn = usePtzGetHomeReturn;
 exports.usePtzGetOptions = usePtzGetOptions;
 exports.usePtzGetPosition = usePtzGetPosition;
 exports.usePtzGetPresets = usePtzGetPresets;
@@ -52599,7 +52676,7 @@ exports.usePtzMove = usePtzMove;
 exports.usePtzSavePreset = usePtzSavePreset;
 exports.usePtzSetAutofocus = usePtzSetAutofocus;
 exports.usePtzSetHomePreset = usePtzSetHomePreset;
-exports.usePtzSetHomeReturnSeconds = usePtzSetHomeReturnSeconds;
+exports.usePtzSetHomeReturn = usePtzSetHomeReturn;
 exports.usePtzStop = usePtzStop;
 exports.useRebootReboot = useRebootReboot;
 exports.useRecordedPlayback = useRecordedPlayback;