@camstack/ui-library 1.1.11 → 1.1.13

package/dist/index.cjs

@@ -7834,6 +7834,30 @@ var Activity = createLucideIcon("activity", [["path", {
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var AirVent = createLucideIcon("air-vent", [
+	["path", {
+		d: "M18 17.5a2.5 2.5 0 1 1-4 2.03V12",
+		key: "yd12zl"
+	}],
+	["path", {
+		d: "M6 12H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2",
+		key: "larmp2"
+	}],
+	["path", {
+		d: "M6 8h12",
+		key: "6g4wlu"
+	}],
+	["path", {
+		d: "M6.6 15.572A2 2 0 1 0 10 17v-5",
+		key: "1x1kqn"
+	}]
+]);
+/**
+* @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 AlarmSmoke = createLucideIcon("alarm-smoke", [
 	["path", {
 		d: "M11 21c0-2.5 2-2.5 2-5",
@@ -7954,6 +7978,21 @@ var ArrowUp = createLucideIcon("arrow-up", [["path", {
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Ban = createLucideIcon("ban", [["circle", {
+	cx: "12",
+	cy: "12",
+	r: "10",
+	key: "1mglay"
+}], ["path", {
+	d: "M4.929 4.929 19.07 19.071",
+	key: "196cmz"
+}]]);
+/**
+* @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 Bath = createLucideIcon("bath", [
 	["path", {
 		d: "M10 4 8 6",
@@ -9108,6 +9147,26 @@ var Fan = createLucideIcon("fan", [["path", {
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Feather = createLucideIcon("feather", [
+	["path", {
+		d: "M12.67 19a2 2 0 0 0 1.416-.588l6.154-6.172a6 6 0 0 0-8.49-8.49L5.586 9.914A2 2 0 0 0 5 11.328V18a1 1 0 0 0 1 1z",
+		key: "18jl4k"
+	}],
+	["path", {
+		d: "M16 8 2 22",
+		key: "vp34q"
+	}],
+	["path", {
+		d: "M17.5 15H9",
+		key: "1oz8nu"
+	}]
+]);
+/**
+* @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 Film = createLucideIcon("film", [
 	["rect", {
 		width: "18",
@@ -9549,6 +9608,19 @@ var LayoutGrid = createLucideIcon("layout-grid", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Leaf = createLucideIcon("leaf", [["path", {
+	d: "M11 20A7 7 0 0 1 9.8 6.1C15.5 5 17 4.48 19 2c1 2 2 4.18 2 8 0 5.5-4.78 10-10 10Z",
+	key: "nnexq3"
+}], ["path", {
+	d: "M2 21c0-3 1.85-5.36 5.08-6C9.5 14.52 12 13 13 12",
+	key: "mt58a7"
+}]]);
+/**
+* @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 Lightbulb = createLucideIcon("lightbulb", [
 	["path", {
 		d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5",
@@ -9953,6 +10025,46 @@ var MousePointerClick = createLucideIcon("mouse-pointer-click", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var MoveHorizontal = createLucideIcon("move-horizontal", [
+	["path", {
+		d: "m18 8 4 4-4 4",
+		key: "1ak13k"
+	}],
+	["path", {
+		d: "M2 12h20",
+		key: "9i4pu4"
+	}],
+	["path", {
+		d: "m6 8-4 4 4 4",
+		key: "15zrgr"
+	}]
+]);
+/**
+* @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 MoveVertical = createLucideIcon("move-vertical", [
+	["path", {
+		d: "M12 2v20",
+		key: "t6zp3m"
+	}],
+	["path", {
+		d: "m8 18 4 4 4-4",
+		key: "bh5tu3"
+	}],
+	["path", {
+		d: "m8 6 4-4 4 4",
+		key: "ybng9g"
+	}]
+]);
+/**
+* @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 Move = createLucideIcon("move", [
 	["path", {
 		d: "M12 2v20",
@@ -10784,6 +10896,88 @@ var Smartphone = createLucideIcon("smartphone", [["rect", {
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var Snowflake = createLucideIcon("snowflake", [
+	["path", {
+		d: "m10 20-1.25-2.5L6 18",
+		key: "18frcb"
+	}],
+	["path", {
+		d: "M10 4 8.75 6.5 6 6",
+		key: "7mghy3"
+	}],
+	["path", {
+		d: "m14 20 1.25-2.5L18 18",
+		key: "1chtki"
+	}],
+	["path", {
+		d: "m14 4 1.25 2.5L18 6",
+		key: "1b4wsy"
+	}],
+	["path", {
+		d: "m17 21-3-6h-4",
+		key: "15hhxa"
+	}],
+	["path", {
+		d: "m17 3-3 6 1.5 3",
+		key: "11697g"
+	}],
+	["path", {
+		d: "M2 12h6.5L10 9",
+		key: "kv9z4n"
+	}],
+	["path", {
+		d: "m20 10-1.5 2 1.5 2",
+		key: "1swlpi"
+	}],
+	["path", {
+		d: "M22 12h-6.5L14 15",
+		key: "1mxi28"
+	}],
+	["path", {
+		d: "m4 10 1.5 2L4 14",
+		key: "k9enpj"
+	}],
+	["path", {
+		d: "m7 21 3-6-1.5-3",
+		key: "j8hb9u"
+	}],
+	["path", {
+		d: "m7 3 3 6h4",
+		key: "1otusx"
+	}]
+]);
+/**
+* @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 Sparkles = createLucideIcon("sparkles", [
+	["path", {
+		d: "M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z",
+		key: "1s2grr"
+	}],
+	["path", {
+		d: "M20 2v4",
+		key: "1rf3ol"
+	}],
+	["path", {
+		d: "M22 4h-4",
+		key: "gwowj6"
+	}],
+	["circle", {
+		cx: "4",
+		cy: "20",
+		r: "2",
+		key: "6kqj1y"
+	}]
+]);
+/**
+* @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 Sprout = createLucideIcon("sprout", [
 	["path", {
 		d: "M14 9.536V7a4 4 0 0 1 4-4h1.5a.5.5 0 0 1 .5.5V5a4 4 0 0 1-4 4 4 4 0 0 0-4 4c0 2 1 3 1 5a5 5 0 0 1-1 3",
@@ -14589,6 +14783,10 @@ var DEVICE_TYPE_META = {
 		icon: Thermometer,
 		label: "Thermostat"
 	},
+	[_camstack_types.DeviceType.Climate]: {
+		icon: AirVent,
+		label: "Air conditioner"
+	},
 	[_camstack_types.DeviceType.Button]: {
 		icon: CircleDot,
 		label: "Button"
@@ -14940,6 +15138,7 @@ var PRIORITY = [
 	"media-player",
 	"alarm-panel",
 	"thermostat",
+	"climate",
 	"humidifier",
 	"water-heater",
 	"lock",
@@ -17206,6 +17405,8 @@ var useDeviceManagerGetCreationSchema = trpc.deviceManager.getCreationSchema.use
 var useDeviceManagerCreateDevice = trpc.deviceManager.createDevice.useMutation;
 /** Generated alias around `trpc.deviceManager.testCreationField.useMutation`. */
 var useDeviceManagerTestCreationField = trpc.deviceManager.testCreationField.useMutation;
+/** Generated alias around `trpc.deviceManager.adoptionListCandidateFilters.useQuery`. */
+var useDeviceManagerAdoptionListCandidateFilters = trpc.deviceManager.adoptionListCandidateFilters.useQuery;
 /** Generated alias around `trpc.deviceManager.adoptionListCandidates.useQuery`. */
 var useDeviceManagerAdoptionListCandidates = trpc.deviceManager.adoptionListCandidates.useQuery;
 /** Generated alias around `trpc.deviceManager.adoptionRefresh.useMutation`. */
@@ -17216,6 +17417,16 @@ var useDeviceManagerAdoptionAdopt = trpc.deviceManager.adoptionAdopt.useMutation
 var useDeviceManagerAdoptionRelease = trpc.deviceManager.adoptionRelease.useMutation;
 /** Generated alias around `trpc.deviceManager.adoptionResync.useMutation`. */
 var useDeviceManagerAdoptionResync = trpc.deviceManager.adoptionResync.useMutation;
+/** Generated alias around `trpc.deviceManager.discoveryProviders.useQuery`. */
+var useDeviceManagerDiscoveryProviders = trpc.deviceManager.discoveryProviders.useQuery;
+/** Generated alias around `trpc.deviceManager.discoverAllProviders.useMutation`. */
+var useDeviceManagerDiscoverAllProviders = trpc.deviceManager.discoverAllProviders.useMutation;
+/** Generated alias around `trpc.deviceManager.discoverProvider.useMutation`. */
+var useDeviceManagerDiscoverProvider = trpc.deviceManager.discoverProvider.useMutation;
+/** Generated alias around `trpc.deviceManager.providerCreationType.useQuery`. */
+var useDeviceManagerProviderCreationType = trpc.deviceManager.providerCreationType.useQuery;
+/** Generated alias around `trpc.deviceManager.providerDiscoveryParamsSchema.useQuery`. */
+var useDeviceManagerProviderDiscoveryParamsSchema = trpc.deviceManager.providerDiscoveryParamsSchema.useQuery;
 /** Generated alias around `trpc.deviceManager.testField.useMutation`. */
 var useDeviceManagerTestField = trpc.deviceManager.testField.useMutation;
 /** Generated alias around `trpc.deviceManager.getDeviceStatusAggregate.useQuery`. */
@@ -17246,6 +17457,10 @@ var useDeviceProviderGetDevices = trpc.deviceProvider.getDevices.useQuery;
 var useDeviceProviderSupportsDiscovery = trpc.deviceProvider.supportsDiscovery.useQuery;
 /** Generated alias around `trpc.deviceProvider.discoverDevices.useMutation`. */
 var useDeviceProviderDiscoverDevices = trpc.deviceProvider.discoverDevices.useMutation;
+/** Generated alias around `trpc.deviceProvider.getDiscoveryParamsSchema.useQuery`. */
+var useDeviceProviderGetDiscoveryParamsSchema = trpc.deviceProvider.getDiscoveryParamsSchema.useQuery;
+/** Generated alias around `trpc.deviceProvider.getManualCreationType.useQuery`. */
+var useDeviceProviderGetManualCreationType = trpc.deviceProvider.getManualCreationType.useQuery;
 /** Generated alias around `trpc.deviceProvider.adoptDiscoveredDevice.useMutation`. */
 var useDeviceProviderAdoptDiscoveredDevice = trpc.deviceProvider.adoptDiscoveredDevice.useMutation;
 /** Generated alias around `trpc.deviceProvider.supportsManualCreation.useQuery`. */
@@ -18893,78 +19108,163 @@ function vacuumGraphicTint(state) {
 		};
 	}
 }
+var ROBOT_KEYFRAMES = `
+@keyframes rg-breathe { 0%,100%{opacity:.78;transform:scale(1)} 50%{opacity:1;transform:scale(1.05)} }
+@keyframes rg-zzz { 0%{opacity:0;transform:translateY(3px)} 30%{opacity:.85} 100%{opacity:0;transform:translateY(-9px)} }
+@keyframes rg-spark { 0%,100%{opacity:.25;transform:scale(.9)} 50%{opacity:1;transform:scale(1.1)} }
+@keyframes rg-pulse { 0%,100%{opacity:.35} 50%{opacity:.85} }
+@keyframes rg-blink { 0%,49%{opacity:1} 50%,100%{opacity:.3} }
+@keyframes rg-spin { to { transform:rotate(360deg) } }
+@media (prefers-reduced-motion: reduce) { .rg-a { animation: none !important; } }
+`;
 /**
 * VacuumGraphic — a framed, top-down robot-vacuum illustration in the SAME
 * visual style as the cover window (w-28 h-36 rounded bordered box, gradient
-* bg, overflow-hidden, inset white shadow). State-tinted via `vacuumGraphicTint`.
+* bg, overflow-hidden, inset white shadow). State-tinted via `vacuumGraphicTint`
+* and state-ANIMATED: it breathes + emits "Zzz" when dormant on the dock, shows
+* a pulsing electricity bolt while charging, blinks on error, and keeps the
+* expanding activity ring + a spinning turret while cleaning / returning.
 * Decorative only (`aria-hidden`); the textual state label lives in the hero.
 */
-function VacuumGraphic({ state }) {
+function VacuumGraphic({ state, batteryLevel }) {
 	const tint = vacuumGraphicTint(state);
+	const charging = tint.docked && batteryLevel != null && batteryLevel < 100;
+	const sleeping = tint.docked && !charging;
+	const erroring = state === "error";
+	const bodyStyle = sleeping ? {
+		animation: "rg-breathe 3.4s ease-in-out infinite",
+		transformBox: "fill-box",
+		transformOrigin: "center"
+	} : erroring ? { animation: "rg-blink 1s steps(1) infinite" } : void 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		"aria-hidden": "true",
 		className: "relative w-28 h-36 rounded border-2 border-border bg-gradient-to-b from-surface-hover to-surface overflow-hidden flex-shrink-0",
 		style: { boxShadow: "inset 0 0 0 2px rgba(255,255,255,.06)" },
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: cn("absolute inset-0 transition-colors duration-300", tint.glow) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: cn("absolute inset-0 flex items-center justify-center", tint.accent),
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-				viewBox: "0 0 100 100",
-				className: "w-20 h-20",
-				fill: "none",
-				children: [
-					tint.docked && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-						x: "34",
-						y: "80",
-						width: "32",
-						height: "8",
-						rx: "2",
-						fill: "currentColor",
-						opacity: "0.35"
-					}),
-					tint.active && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "50",
-						cy: "50",
-						r: "44",
-						stroke: "currentColor",
-						strokeWidth: "2",
-						opacity: "0.4",
-						className: "animate-ping",
-						style: { transformOrigin: "center" }
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "50",
-						cy: "50",
-						r: "34",
-						fill: "currentColor",
-						fillOpacity: "0.12",
-						stroke: "currentColor",
-						strokeWidth: "2.5"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
-						d: "M 24 42 A 34 34 0 0 1 76 42",
-						stroke: "currentColor",
-						strokeWidth: "3",
-						opacity: "0.55",
-						strokeLinecap: "round"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "50",
-						cy: "50",
-						r: "9",
-						fill: "currentColor",
-						fillOpacity: "0.25",
-						stroke: "currentColor",
-						strokeWidth: "2"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "50",
-						cy: "50",
-						r: "3",
-						fill: "currentColor"
-					})
-				]
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: ROBOT_KEYFRAMES }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: cn("absolute inset-0 transition-colors duration-300", tint.glow) }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: cn("absolute inset-0 flex items-center justify-center", tint.accent),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+					viewBox: "0 0 100 100",
+					className: "w-20 h-20",
+					fill: "none",
+					children: [
+						tint.docked && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+							x: "34",
+							y: "80",
+							width: "32",
+							height: "8",
+							rx: "2",
+							fill: "currentColor",
+							opacity: "0.35",
+							className: cn(charging && "rg-a"),
+							style: charging ? { animation: "rg-pulse 1.2s ease-in-out infinite" } : void 0
+						}),
+						tint.active && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+							cx: "50",
+							cy: "50",
+							r: "44",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							opacity: "0.4",
+							className: "animate-ping",
+							style: { transformOrigin: "center" }
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+							className: cn((sleeping || erroring) && "rg-a"),
+							style: bodyStyle,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+									cx: "50",
+									cy: "50",
+									r: "34",
+									fill: "currentColor",
+									fillOpacity: "0.12",
+									stroke: "currentColor",
+									strokeWidth: "2.5"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+									d: "M 24 42 A 34 34 0 0 1 76 42",
+									stroke: "currentColor",
+									strokeWidth: "3",
+									opacity: "0.55",
+									strokeLinecap: "round"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+									className: cn(tint.active && "rg-a"),
+									style: tint.active ? {
+										animation: "rg-spin 3s linear infinite",
+										transformBox: "fill-box",
+										transformOrigin: "center"
+									} : void 0,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+										cx: "50",
+										cy: "50",
+										r: "9",
+										fill: "currentColor",
+										fillOpacity: "0.25",
+										stroke: "currentColor",
+										strokeWidth: "2"
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+										cx: "50",
+										cy: "43",
+										r: "2.4",
+										fill: "currentColor"
+									})]
+								})
+							]
+						}),
+						sleeping && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+							fill: "currentColor",
+							fontFamily: "sans-serif",
+							fontWeight: "700",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "64",
+									y: "30",
+									fontSize: "13",
+									opacity: "0.7",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out infinite" },
+									children: "z"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "73",
+									y: "23",
+									fontSize: "10",
+									opacity: "0.6",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out .7s infinite" },
+									children: "z"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "80",
+									y: "17",
+									fontSize: "8",
+									opacity: "0.5",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out 1.4s infinite" },
+									children: "z"
+								})
+							]
+						}),
+						charging && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+							d: "M53 20 L44 40 L50 40 L46 56 L60 34 L53 34 Z",
+							fill: "#fbbf24",
+							stroke: "#f59e0b",
+							strokeWidth: "1",
+							className: "rg-a",
+							style: {
+								animation: "rg-spark 1s ease-in-out infinite",
+								transformBox: "fill-box",
+								transformOrigin: "center"
+							}
+						})
+					]
+				})
 			})
-		})]
+		]
 	});
 }
 /** Battery % badge — shared between inline + hero. */
@@ -19143,7 +19443,7 @@ function VacuumInlineControl({ trpc, deviceId }) {
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VacuumIconButton, {
 				label: "Return to base",
 				busy,
-				active: state === "returning",
+				active: state === "returning" || state === "docked",
 				onClick: () => press(cap.returnToBase),
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(House, { className: "h-3.5 w-3.5" })
 			}),
@@ -19192,7 +19492,10 @@ function VacuumHeroCard({ trpc, deviceId }) {
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex items-center gap-6",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VacuumGraphic, { state }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VacuumGraphic, {
+					state,
+					batteryLevel: slice?.batteryLevel ?? null
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "flex flex-col gap-3 flex-1",
 					children: [
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -19246,7 +19549,7 @@ function VacuumHeroCard({ trpc, deviceId }) {
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VacuumHeroButton, {
 									label: "Return to base",
 									busy,
-									active: state === "returning",
+									active: state === "returning" || state === "docked",
 									onClick: () => press(cap.returnToBase),
 									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(House, { className: "h-5 w-5" })
 								}),
@@ -19379,112 +19682,206 @@ function lawnMowerGraphicTint(activity) {
 		};
 	}
 }
+var MOWER_KEYFRAMES = `
+@keyframes rg-breathe { 0%,100%{opacity:.78;transform:scale(1)} 50%{opacity:1;transform:scale(1.05)} }
+@keyframes rg-zzz { 0%{opacity:0;transform:translateY(3px)} 30%{opacity:.85} 100%{opacity:0;transform:translateY(-9px)} }
+@keyframes rg-spark { 0%,100%{opacity:.25;transform:scale(.9)} 50%{opacity:1;transform:scale(1.1)} }
+@keyframes rg-pulse { 0%,100%{opacity:.35} 50%{opacity:.85} }
+@keyframes rg-blink { 0%,49%{opacity:1} 50%,100%{opacity:.3} }
+@keyframes rg-spin { to { transform:rotate(360deg) } }
+@media (prefers-reduced-motion: reduce) { .rg-a { animation: none !important; } }
+`;
 /**
 * LawnMowerGraphic — a framed robot-lawn-mower illustration in the SAME visual
 * style as the cover window (w-28 h-36 rounded bordered box, gradient bg,
 * overflow-hidden, inset white shadow), over a grass-green gradient. Tinted by
-* `lawnMowerGraphicTint`. Decorative only (`aria-hidden`).
+* `lawnMowerGraphicTint` and state-ANIMATED: it breathes + emits "Zzz" when
+* dormant on the dock, shows a pulsing electricity bolt while charging, blinks
+* on error, and spins its cutting deck + streams clippings while mowing.
+* Decorative only (`aria-hidden`).
 */
-function LawnMowerGraphic({ activity }) {
+function LawnMowerGraphic({ activity, batteryLevel }) {
 	const tint = lawnMowerGraphicTint(activity);
+	const charging = tint.docked && batteryLevel != null && batteryLevel < 100;
+	const sleeping = tint.docked && !charging;
+	const erroring = activity === "error";
+	const bodyStyle = sleeping ? {
+		animation: "rg-breathe 3.4s ease-in-out infinite",
+		transformBox: "fill-box",
+		transformOrigin: "center"
+	} : erroring ? { animation: "rg-blink 1s steps(1) infinite" } : void 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		"aria-hidden": "true",
 		className: "relative w-28 h-36 rounded border-2 border-border bg-gradient-to-b from-emerald-700/40 to-emerald-900/30 overflow-hidden flex-shrink-0",
 		style: { boxShadow: "inset 0 0 0 2px rgba(255,255,255,.06)" },
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: cn("absolute inset-0 transition-colors duration-300", tint.glow) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: cn("absolute inset-0 flex items-center justify-center", tint.accent),
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-				viewBox: "0 0 100 100",
-				className: "w-20 h-20",
-				fill: "none",
-				children: [
-					tint.docked && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-						x: "30",
-						y: "78",
-						width: "40",
-						height: "9",
-						rx: "2",
-						fill: "currentColor",
-						opacity: "0.35"
-					}),
-					tint.active && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
-						stroke: "currentColor",
-						strokeWidth: "2.5",
-						strokeLinecap: "round",
-						opacity: "0.5",
-						children: [
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-								x1: "18",
-								y1: "36",
-								x2: "10",
-								y2: "36",
-								className: "animate-pulse"
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-								x1: "18",
-								y1: "50",
-								x2: "6",
-								y2: "50",
-								className: "animate-pulse"
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-								x1: "18",
-								y1: "64",
-								x2: "10",
-								y2: "64",
-								className: "animate-pulse"
-							})
-						]
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-						x: "28",
-						y: "34",
-						width: "44",
-						height: "34",
-						rx: "8",
-						fill: "currentColor",
-						fillOpacity: "0.14",
-						stroke: "currentColor",
-						strokeWidth: "2.5"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-						x1: "34",
-						y1: "60",
-						x2: "66",
-						y2: "60",
-						stroke: "currentColor",
-						strokeWidth: "2",
-						opacity: "0.5"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "50",
-						cy: "48",
-						r: "5",
-						stroke: "currentColor",
-						strokeWidth: "2",
-						opacity: "0.6"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "34",
-						cy: "68",
-						r: "6",
-						fill: "currentColor",
-						fillOpacity: "0.3",
-						stroke: "currentColor",
-						strokeWidth: "2"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-						cx: "66",
-						cy: "68",
-						r: "6",
-						fill: "currentColor",
-						fillOpacity: "0.3",
-						stroke: "currentColor",
-						strokeWidth: "2"
-					})
-				]
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: MOWER_KEYFRAMES }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: cn("absolute inset-0 transition-colors duration-300", tint.glow) }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: cn("absolute inset-0 flex items-center justify-center", tint.accent),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+					viewBox: "0 0 100 100",
+					className: "w-20 h-20",
+					fill: "none",
+					children: [
+						tint.docked && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+							x: "30",
+							y: "78",
+							width: "40",
+							height: "9",
+							rx: "2",
+							fill: "currentColor",
+							opacity: "0.35",
+							className: cn(charging && "rg-a"),
+							style: charging ? { animation: "rg-pulse 1.2s ease-in-out infinite" } : void 0
+						}),
+						tint.active && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+							stroke: "currentColor",
+							strokeWidth: "2.5",
+							strokeLinecap: "round",
+							opacity: "0.5",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+									x1: "18",
+									y1: "36",
+									x2: "10",
+									y2: "36",
+									className: "animate-pulse"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+									x1: "18",
+									y1: "50",
+									x2: "6",
+									y2: "50",
+									className: "animate-pulse"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+									x1: "18",
+									y1: "64",
+									x2: "10",
+									y2: "64",
+									className: "animate-pulse"
+								})
+							]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+							className: cn((sleeping || erroring) && "rg-a"),
+							style: bodyStyle,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+									x: "28",
+									y: "34",
+									width: "44",
+									height: "34",
+									rx: "8",
+									fill: "currentColor",
+									fillOpacity: "0.14",
+									stroke: "currentColor",
+									strokeWidth: "2.5"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+									x1: "34",
+									y1: "60",
+									x2: "66",
+									y2: "60",
+									stroke: "currentColor",
+									strokeWidth: "2",
+									opacity: "0.5"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+									className: cn(tint.active && "rg-a"),
+									style: tint.active ? {
+										animation: "rg-spin 0.9s linear infinite",
+										transformBox: "fill-box",
+										transformOrigin: "center"
+									} : void 0,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+										cx: "50",
+										cy: "48",
+										r: "5",
+										stroke: "currentColor",
+										strokeWidth: "2",
+										opacity: "0.6"
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+										x1: "45",
+										y1: "48",
+										x2: "55",
+										y2: "48",
+										stroke: "currentColor",
+										strokeWidth: "2",
+										opacity: "0.7"
+									})]
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+									cx: "34",
+									cy: "68",
+									r: "6",
+									fill: "currentColor",
+									fillOpacity: "0.3",
+									stroke: "currentColor",
+									strokeWidth: "2"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+									cx: "66",
+									cy: "68",
+									r: "6",
+									fill: "currentColor",
+									fillOpacity: "0.3",
+									stroke: "currentColor",
+									strokeWidth: "2"
+								})
+							]
+						}),
+						sleeping && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+							fill: "currentColor",
+							fontFamily: "sans-serif",
+							fontWeight: "700",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "64",
+									y: "30",
+									fontSize: "13",
+									opacity: "0.7",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out infinite" },
+									children: "z"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "73",
+									y: "23",
+									fontSize: "10",
+									opacity: "0.6",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out .7s infinite" },
+									children: "z"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+									x: "80",
+									y: "17",
+									fontSize: "8",
+									opacity: "0.5",
+									className: "rg-a",
+									style: { animation: "rg-zzz 3.4s ease-in-out 1.4s infinite" },
+									children: "z"
+								})
+							]
+						}),
+						charging && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+							d: "M53 20 L44 40 L50 40 L46 56 L60 34 L53 34 Z",
+							fill: "#fbbf24",
+							stroke: "#f59e0b",
+							strokeWidth: "1",
+							className: "rg-a",
+							style: {
+								animation: "rg-spark 1s ease-in-out infinite",
+								transformBox: "fill-box",
+								transformOrigin: "center"
+							}
+						})
+					]
+				})
 			})
-		})]
+		]
 	});
 }
 /** Tailwind text tone for a device-code severity. */
@@ -19619,7 +20016,10 @@ function LawnMowerHeroCard({ trpc, deviceId }) {
 		className: "flex flex-col items-stretch gap-4 rounded-lg border border-border bg-surface p-4",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "flex items-center gap-6",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LawnMowerGraphic, { activity }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LawnMowerGraphic, {
+				activity,
+				batteryLevel: slice?.batteryLevel ?? null
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex flex-col gap-3 flex-1",
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -22195,6 +22595,561 @@ function ClimatePanel({ trpc, deviceId, features: _features, layout, optimistic
 	});
 }
 //#endregion
+//#region src/composites/device-controls/ac-panel.tsx
+/** AC-appropriate short mode labels. Exhaustive over HvacMode. */
+var MODE_LABEL = {
+	cool: "Cool",
+	heat: "Heat",
+	auto: "Auto",
+	heat_cool: "Heat·Cool",
+	fan_only: "Fan",
+	dry: "Dry",
+	off: "Off"
+};
+/** Per-mode icon (lucide). Exhaustive over HvacMode. */
+var MODE_ICON = {
+	cool: Snowflake,
+	heat: Flame,
+	auto: Sparkles,
+	heat_cool: Thermometer,
+	fan_only: Fan,
+	dry: Droplets,
+	off: Power
+};
+/** Mode accent hex — drives the airflow particles, the glow, and the target
+*  value colour. Mirrors the thermostat gauge palette. Exhaustive. */
+var MODE_ACCENT = {
+	heat: "#f59e0b",
+	cool: "#60a5fa",
+	auto: "#c084fc",
+	heat_cool: "#e879f9",
+	fan_only: "#94a3b8",
+	dry: "#22d3ee",
+	off: "#a1a1aa"
+};
+/** Practical AC setpoint range (Celsius) for the target range track. */
+var TARGET_MIN = 16;
+var TARGET_MAX = 30;
+/** Title-case a snake/lower token for a selector option ('medium_low' → 'Medium
+*  low', 'turbo' → 'Turbo'). Shared by the fan + preset selectors. */
+function fanLabel(token) {
+	const spaced = token.replace(/_/g, " ");
+	return spaced.charAt(0).toUpperCase() + spaced.slice(1);
+}
+/** Preset → icon. Unknown presets fall back to a neutral sparkle. */
+function presetIcon(preset) {
+	switch (preset) {
+		case "turbo": return Zap;
+		case "quiet": return Feather;
+		case "sleep": return Moon;
+		case "eco": return Leaf;
+		case "8c_heat": return Snowflake;
+		case "none": return Ban;
+		default: return Sparkles;
+	}
+}
+/**
+* Fan level → airflow animation period. Higher speed ⇒ shorter period. Unknown
+* strings fall back to a medium pace. Turbo (a preset) shortens it further.
+*/
+function airflowPeriodSec(fanMode) {
+	switch (fanMode) {
+		case "high": return 1;
+		case "medium_high": return 1.3;
+		case "medium": return 1.6;
+		case "medium_low": return 1.9;
+		case "low": return 2.2;
+		default: return 1.8;
+	}
+}
+var KEYFRAMES = `
+@keyframes acv-fall { 0%{transform:translateY(-1.75rem);opacity:0} 18%{opacity:.7} 82%{opacity:.7} 100%{transform:translateY(7.5rem);opacity:0} }
+@keyframes acv-rise { 0%{transform:translateY(7.5rem);opacity:0} 18%{opacity:.7} 82%{opacity:.7} 100%{transform:translateY(-1.75rem);opacity:0} }
+@keyframes acv-sway { 0%,100%{transform:translateX(-9%)} 50%{transform:translateX(9%)} }
+@keyframes acv-swing-h { 0%,100%{transform:translateX(-22%)} 50%{transform:translateX(22%)} }
+@keyframes acv-swing-v { 0%,100%{transform:translateY(-22%)} 50%{transform:translateY(22%)} }
+@keyframes acv-spin { to { transform:rotate(360deg) } }
+@keyframes acv-glow { 0%,100%{opacity:.35;transform:scale(1)} 50%{opacity:.6;transform:scale(1.06)} }
+@media (prefers-reduced-motion: reduce) {
+  .acv-streak, .acv-fan, .acv-sway-wrap, .acv-glow, .acv-swing { animation: none !important; }
+}
+`;
+function AcPanel({ trpc, deviceId, layout, optimistic }) {
+	const { cap, slice, available } = useDeviceCapability({
+		trpc,
+		deviceId,
+		cap: (d) => d.climateControl,
+		slice: (d) => d.state.climateControl
+	});
+	const { display, applyOptimistic } = useOptimisticSlice(slice, { enabled: optimistic ?? true });
+	if (cap === void 0) return null;
+	if (display === void 0) return null;
+	const busy = !available;
+	if (layout === "compact") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"data-mode": display.mode,
+		className: "inline-flex items-center gap-1",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: cn("text-xs tabular-nums font-medium", MODE_TEXT_COLOR[display.mode]),
+				children: display.target !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+					display.target,
+					"°",
+					display.currentTemp !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "text-foreground-subtle font-normal",
+						children: [
+							" ",
+							"(",
+							display.currentTemp,
+							"°)"
+						]
+					})
+				] }) : display.currentTemp !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "text-foreground-subtle",
+					children: [display.currentTemp, "°"]
+				}) : null
+			}),
+			display.target !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				"aria-label": "Decrease target",
+				disabled: busy,
+				onClick: (e) => {
+					e.stopPropagation();
+					if (!busy && display.target !== null) {
+						const next = display.target - 1;
+						applyOptimistic({ target: next });
+						cap.setTarget({ target: next });
+					}
+				},
+				className: cn("inline-flex h-5 w-5 items-center justify-center rounded text-foreground-subtle hover:text-foreground hover:bg-surface-hover transition-colors text-xs", busy && "opacity-40 cursor-not-allowed"),
+				children: "−"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				"aria-label": "Increase target",
+				disabled: busy,
+				onClick: (e) => {
+					e.stopPropagation();
+					if (!busy && display.target !== null) {
+						const next = display.target + 1;
+						applyOptimistic({ target: next });
+						cap.setTarget({ target: next });
+					}
+				},
+				className: cn("inline-flex h-5 w-5 items-center justify-center rounded text-foreground-subtle hover:text-foreground hover:bg-surface-hover transition-colors text-xs", busy && "opacity-40 cursor-not-allowed"),
+				children: "+"
+			})] }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+				"aria-label": "Mode",
+				value: display.mode,
+				disabled: busy,
+				onChange: (e) => {
+					e.stopPropagation();
+					const mode = display.availableModes.find((m) => m === e.target.value);
+					if (!busy && mode) {
+						applyOptimistic({ mode });
+						cap.setMode({ mode });
+					}
+				},
+				className: cn("bg-transparent px-0.5 text-xs text-foreground-subtle hover:text-foreground cursor-pointer", busy && "opacity-40 cursor-not-allowed"),
+				children: display.availableModes.map((m) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+					value: m,
+					children: MODE_LABEL[m]
+				}, m))
+			})
+		]
+	});
+	const accent = MODE_ACCENT[display.mode];
+	const on = display.mode !== "off";
+	const CurrentPresetIcon = presetIcon(display.preset);
+	const boost = display.preset === "turbo";
+	const period = Math.max(.55, airflowPeriodSec(display.fanMode) * (boost ? .6 : 1));
+	const showVSwing = display.swingVertical !== null;
+	const showHSwing = display.swingHorizontal !== null;
+	const swaying = on && (display.swingVertical === true || display.swingHorizontal === true);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"data-mode": display.mode,
+		className: cn("relative flex flex-col items-stretch gap-2.5 overflow-hidden rounded-lg border p-3 transition-colors", MODE_COLOR[display.mode]),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: KEYFRAMES }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "relative z-10 flex flex-col items-center justify-center gap-1 overflow-hidden rounded-lg border border-border/50 bg-surface/30 px-3 py-3",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "pointer-events-none absolute inset-0 opacity-60",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AirflowViz, {
+							mode: display.mode,
+							accent,
+							periodSec: period,
+							swaying
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute inset-0 bg-gradient-to-b from-surface/50 via-transparent to-surface/50" }),
+					on && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						"aria-hidden": true,
+						className: "acv-glow pointer-events-none absolute left-1/2 top-1/2 h-16 w-16 -translate-x-1/2 -translate-y-1/2 rounded-full blur-2xl",
+						style: {
+							background: accent,
+							animation: "acv-glow 3.2s ease-in-out infinite"
+						}
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "relative z-10 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wide",
+						style: { color: accent },
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModeIcon, {
+								mode: display.mode,
+								className: "h-3.5 w-3.5"
+							}),
+							MODE_LABEL[display.mode],
+							display.currentTemp !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: "normal-case text-foreground-subtle",
+								children: [
+									"· ",
+									display.currentTemp,
+									"° now"
+								]
+							}),
+							display.currentHumidity !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: "inline-flex items-center gap-0.5 normal-case text-foreground-subtle",
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Droplets, { className: "h-3 w-3" }),
+									display.currentHumidity,
+									"%"
+								]
+							})
+						]
+					}),
+					display.target !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "relative z-10 flex items-center gap-3",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RoundStep, {
+								label: "Decrease target",
+								symbol: "−",
+								disabled: busy,
+								onClick: () => {
+									if (busy || display.target === null) return;
+									const next = display.target - 1;
+									applyOptimistic({ target: next });
+									cap.setTarget({ target: next });
+								}
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "flex items-baseline gap-0.5",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "text-4xl font-bold leading-none tabular-nums",
+									style: { color: accent },
+									children: display.target
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "text-lg text-foreground-subtle",
+									children: "°"
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RoundStep, {
+								label: "Increase target",
+								symbol: "+",
+								disabled: busy,
+								onClick: () => {
+									if (busy || display.target === null) return;
+									const next = display.target + 1;
+									applyOptimistic({ target: next });
+									cap.setTarget({ target: next });
+								}
+							})
+						]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "relative z-10 w-36",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RangeTrack, {
+							value: display.target,
+							min: TARGET_MIN,
+							max: TARGET_MAX,
+							accent
+						})
+					})] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "relative z-10 flex items-baseline gap-0.5",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-4xl font-bold leading-none tabular-nums text-foreground",
+							children: display.currentTemp ?? "—"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-lg text-foreground-subtle",
+							children: "°"
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "relative z-10 grid grid-cols-3 gap-2",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CompactSelect, {
+						label: "Mode",
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: { color: accent },
+							className: "flex",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModeIcon, {
+								mode: display.mode,
+								className: "h-4 w-4"
+							})
+						}),
+						value: display.mode,
+						options: display.availableModes.map((m) => ({
+							value: m,
+							label: MODE_LABEL[m]
+						})),
+						disabled: busy,
+						onChange: (v) => {
+							const mode = display.availableModes.find((m) => m === v);
+							if (mode) {
+								applyOptimistic({ mode });
+								cap.setMode({ mode });
+							}
+						}
+					}),
+					display.availableFanModes.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CompactSelect, {
+						label: "Fan",
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Wind, { className: "h-4 w-4 text-sky-500" }),
+						value: display.fanMode,
+						options: display.availableFanModes.map((f) => ({
+							value: f,
+							label: fanLabel(f)
+						})),
+						disabled: busy,
+						onChange: (v) => {
+							applyOptimistic({ fanMode: v });
+							cap.setFanMode({ fanMode: v });
+						}
+					}),
+					display.availablePresets.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CompactSelect, {
+						label: "Preset",
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CurrentPresetIcon, { className: "h-4 w-4 text-emerald-500" }),
+						value: display.preset,
+						options: display.availablePresets.map((p) => ({
+							value: p,
+							label: fanLabel(p)
+						})),
+						disabled: busy,
+						onChange: (v) => {
+							applyOptimistic({ preset: v });
+							cap.setPreset({ preset: v });
+						}
+					})
+				]
+			}),
+			(showVSwing || showHSwing) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+				label: "Swing",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "grid grid-cols-2 gap-1",
+					children: [showVSwing && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SwingToggle, {
+						axis: "vertical",
+						on: display.swingVertical ?? false,
+						busy,
+						onToggle: (next) => {
+							applyOptimistic({ swingVertical: next });
+							cap.setSwingVertical({ on: next });
+						}
+					}), showHSwing && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SwingToggle, {
+						axis: "horizontal",
+						on: display.swingHorizontal ?? false,
+						busy,
+						onToggle: (next) => {
+							applyOptimistic({ swingHorizontal: next });
+							cap.setSwingHorizontal({ on: next });
+						}
+					})]
+				})
+			})
+		]
+	});
+}
+/** Labelled control group — a small uppercase header above its control. */
+function Field({ label, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "relative z-10 flex flex-col gap-1",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-[10px] font-semibold uppercase tracking-wider text-foreground-subtle",
+			children: label
+		}), children]
+	});
+}
+function ModeIcon({ mode, className }) {
+	const Icon = MODE_ICON[mode];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+		className,
+		"aria-hidden": true
+	});
+}
+/** Compact labelled dropdown — a leading icon + native `<select>` + chevron,
+*  used for the Mode / Fan / Preset selectors so all three fit in one row. */
+function CompactSelect({ label, icon, value, options, disabled, onChange }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex min-w-0 flex-col gap-1",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-[10px] font-semibold uppercase tracking-wider text-foreground-subtle",
+			children: label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: cn("flex items-center gap-1 overflow-hidden rounded-lg border border-border/60 bg-surface-subtle px-1.5 py-1.5", disabled && "opacity-40"),
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "flex shrink-0",
+					children: icon
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+					"aria-label": label,
+					value,
+					disabled,
+					onChange: (e) => {
+						e.stopPropagation();
+						if (!disabled) onChange(e.target.value);
+					},
+					className: "min-w-0 flex-1 cursor-pointer appearance-none truncate bg-transparent text-xs font-medium text-foreground outline-none",
+					children: options.map((o) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+						value: o.value,
+						children: o.label
+					}, o.value))
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronDown, { className: "h-3 w-3 shrink-0 text-foreground-subtle" })
+			]
+		})]
+	});
+}
+/** Circular ± button for the target. */
+function RoundStep({ label, symbol, disabled, onClick }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		"aria-label": label,
+		disabled,
+		onClick,
+		className: cn("flex h-8 w-8 shrink-0 items-center justify-center rounded-full border border-border bg-surface text-lg leading-none text-foreground-subtle transition-colors hover:bg-surface-hover hover:text-foreground active:scale-95", disabled && "opacity-40 cursor-not-allowed"),
+		children: symbol
+	});
+}
+/** Thin gradient range track with a knob at the setpoint fraction. */
+function RangeTrack({ value, min, max, accent }) {
+	const pct = `${Math.min(1, Math.max(0, (value - min) / (max - min))) * 100}%`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "mt-2 w-full",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "relative h-1.5 w-full rounded-full bg-surface-subtle",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "absolute inset-y-0 left-0 rounded-full",
+				style: {
+					width: pct,
+					background: accent
+				}
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "absolute top-1/2 h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow",
+				style: {
+					left: pct,
+					background: accent
+				}
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mt-0.5 flex justify-between text-[9px] tabular-nums text-foreground-subtle",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [min, "°"] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [max, "°"] })]
+		})]
+	});
+}
+/**
+* Animated centerpiece. `fan_only` renders a spinning fan; `off` a dim static
+* vent; every active mode renders drifting particles that FALL (cool/dry/auto)
+* or RISE (heat), with a horizontal sweep overlaid when a swing axis is active.
+*/
+function AirflowViz({ mode, accent, periodSec, swaying }) {
+	const columns = [
+		0,
+		1,
+		2,
+		3,
+		4,
+		5
+	];
+	const rising = mode === "heat";
+	const isDroplet = mode === "dry";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"aria-hidden": true,
+		className: "absolute inset-0 overflow-hidden",
+		children: mode === "off" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex h-full items-center justify-center gap-2 opacity-30",
+			children: columns.map((i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "h-8 w-1 rounded-full bg-foreground-subtle opacity-40" }, i))
+		}) : mode === "fan_only" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex h-full items-center justify-center",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FanBlades, {
+				color: accent,
+				periodSec: Math.max(.5, periodSec * .7),
+				size: 56
+			})
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: cn("acv-sway-wrap absolute inset-0", swaying && "acv-sway"),
+			style: swaying ? { animation: "acv-sway 2.6s ease-in-out infinite" } : void 0,
+			children: columns.map((i) => {
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "acv-streak absolute rounded-full",
+					style: {
+						left: `${8 + i * 15}%`,
+						width: isDroplet ? "0.4rem" : "0.3rem",
+						height: isDroplet ? "0.4rem" : "1.9rem",
+						background: accent,
+						boxShadow: `0 0 6px ${accent}`,
+						animationName: rising ? "acv-rise" : "acv-fall",
+						animationTimingFunction: "linear",
+						animationIterationCount: "infinite",
+						animationDuration: `${periodSec}s`,
+						animationDelay: `${i % 3 * (periodSec / 3) + i * .05}s`
+					}
+				}, i);
+			})
+		})
+	});
+}
+/** Big spinning fan for `fan_only` mode. */
+function FanBlades({ color, periodSec, size }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		width: size,
+		height: size,
+		viewBox: "0 0 100 100",
+		className: "acv-fan",
+		style: {
+			animation: `acv-spin ${periodSec}s linear infinite`,
+			transformOrigin: "50% 50%"
+		},
+		"aria-hidden": true,
+		children: [[
+			0,
+			120,
+			240
+		].map((deg) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M50 50 C 58 30, 78 26, 84 12 C 66 20, 54 34, 50 50 Z",
+			fill: color,
+			opacity: .85,
+			transform: `rotate(${deg} 50 50)`
+		}, deg)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+			cx: "50",
+			cy: "50",
+			r: "7",
+			fill: color
+		})]
+	});
+}
+/** Swing axis toggle — a card with a MoveVertical/Horizontal glyph that
+*  oscillates along its axis when on. On/off is non-destructive → plain tap. */
+function SwingToggle({ axis, on, busy, onToggle }) {
+	const label = axis === "vertical" ? "Vertical" : "Horizontal";
+	const Icon = axis === "vertical" ? MoveVertical : MoveHorizontal;
+	const anim = axis === "vertical" ? "acv-swing-v" : "acv-swing-h";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		"aria-label": `${label} swing`,
+		"aria-pressed": on,
+		disabled: busy,
+		onClick: () => {
+			if (!busy) onToggle(!on);
+		},
+		className: cn("flex items-center justify-center gap-2 rounded-lg border px-2 py-1.5 text-xs font-medium transition-colors", on ? "border-transparent bg-indigo-400 text-indigo-950 shadow-sm" : "border-border/60 bg-surface-subtle text-foreground-subtle hover:bg-surface-hover hover:text-foreground", busy && "opacity-40 cursor-not-allowed"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			className: "acv-swing h-4 w-4",
+			"aria-hidden": true,
+			style: on ? { animation: `${anim} 1.4s ease-in-out infinite` } : void 0
+		}), label]
+	});
+}
+//#endregion
 //#region src/composites/device-controls/media-player-panel.tsx
 /**
 * Exhaustive colour map — one entry per MediaPlayerState.
@@ -24076,6 +25031,26 @@ function ThermostatInlineControl({ trpc, deviceId, features, optimistic }) {
 		optimistic
 	});
 }
+function AcInlineControl({ trpc, deviceId, features, optimistic }) {
+	if (!useClimateCapGuard(trpc, deviceId)) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AcPanel, {
+		trpc,
+		deviceId,
+		features,
+		layout: "compact",
+		optimistic
+	});
+}
+function AcHeroCard({ trpc, deviceId, features, optimistic }) {
+	if (!useClimateCapGuard(trpc, deviceId)) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AcPanel, {
+		trpc,
+		deviceId,
+		features,
+		layout: "full",
+		optimistic
+	});
+}
 function useMediaPlayerCapGuard(trpc, deviceId) {
 	const { cap } = useDeviceCapability({
 		trpc,
@@ -24162,6 +25137,10 @@ var THERMOSTAT_CONTROL = {
 	InlineControl: ThermostatInlineControl,
 	HeroCard: ThermostatHeroCard
 };
+var CLIMATE_CONTROL = {
+	InlineControl: AcInlineControl,
+	HeroCard: AcHeroCard
+};
 var MEDIA_PLAYER_CONTROL = {
 	InlineControl: MediaPlayerInlineControl,
 	HeroCard: MediaPlayerHeroCard
@@ -24219,6 +25198,7 @@ var DEVICE_TYPE_CONTROL = {
 	[_camstack_types.DeviceType.Fan]: FAN_CONTROL,
 	[_camstack_types.DeviceType.Sensor]: SENSOR_CONTROL,
 	[_camstack_types.DeviceType.Thermostat]: THERMOSTAT_CONTROL,
+	[_camstack_types.DeviceType.Climate]: CLIMATE_CONTROL,
 	[_camstack_types.DeviceType.Button]: {
 		InlineControl: ButtonControl,
 		HeroCard: ButtonHeroCard
@@ -24263,6 +25243,7 @@ var CONTROL_FILLS = {
 	[_camstack_types.DeviceType.Cover]: true,
 	[_camstack_types.DeviceType.Valve]: true,
 	[_camstack_types.DeviceType.Thermostat]: true,
+	[_camstack_types.DeviceType.Climate]: true,
 	[_camstack_types.DeviceType.Control]: true,
 	[_camstack_types.DeviceType.Button]: true,
 	[_camstack_types.DeviceType.MediaPlayer]: true,
@@ -43074,6 +44055,7 @@ exports.useDeviceListPageSize = useDeviceListPageSize;
 exports.useDeviceManagerAddLocation = useDeviceManagerAddLocation;
 exports.useDeviceManagerAdoptDevice = useDeviceManagerAdoptDevice;
 exports.useDeviceManagerAdoptionAdopt = useDeviceManagerAdoptionAdopt;
+exports.useDeviceManagerAdoptionListCandidateFilters = useDeviceManagerAdoptionListCandidateFilters;
 exports.useDeviceManagerAdoptionListCandidates = useDeviceManagerAdoptionListCandidates;
 exports.useDeviceManagerAdoptionRefresh = useDeviceManagerAdoptionRefresh;
 exports.useDeviceManagerAdoptionRelease = useDeviceManagerAdoptionRelease;
@@ -43082,7 +44064,10 @@ exports.useDeviceManagerAllocateDeviceId = useDeviceManagerAllocateDeviceId;
 exports.useDeviceManagerApplyInitialMeta = useDeviceManagerApplyInitialMeta;
 exports.useDeviceManagerCreateDevice = useDeviceManagerCreateDevice;
 exports.useDeviceManagerDisable = useDeviceManagerDisable;
+exports.useDeviceManagerDiscoverAllProviders = useDeviceManagerDiscoverAllProviders;
 exports.useDeviceManagerDiscoverDevices = useDeviceManagerDiscoverDevices;
+exports.useDeviceManagerDiscoverProvider = useDeviceManagerDiscoverProvider;
+exports.useDeviceManagerDiscoveryProviders = useDeviceManagerDiscoveryProviders;
 exports.useDeviceManagerEnable = useDeviceManagerEnable;
 exports.useDeviceManagerGetAllBindings = useDeviceManagerGetAllBindings;
 exports.useDeviceManagerGetBindings = useDeviceManagerGetBindings;
@@ -43108,6 +44093,8 @@ exports.useDeviceManagerLoadMeta = useDeviceManagerLoadMeta;
 exports.useDeviceManagerLoadRuntimeState = useDeviceManagerLoadRuntimeState;
 exports.useDeviceManagerPersistConfig = useDeviceManagerPersistConfig;
 exports.useDeviceManagerProbeStreams = useDeviceManagerProbeStreams;
+exports.useDeviceManagerProviderCreationType = useDeviceManagerProviderCreationType;
+exports.useDeviceManagerProviderDiscoveryParamsSchema = useDeviceManagerProviderDiscoveryParamsSchema;
 exports.useDeviceManagerRegisterDevice = useDeviceManagerRegisterDevice;
 exports.useDeviceManagerRemove = useDeviceManagerRemove;
 exports.useDeviceManagerRemoveByIntegration = useDeviceManagerRemoveByIntegration;
@@ -43144,6 +44131,8 @@ exports.useDeviceProviderCreateDevice = useDeviceProviderCreateDevice;
 exports.useDeviceProviderDiscoverDevices = useDeviceProviderDiscoverDevices;
 exports.useDeviceProviderGetChildCreationSchema = useDeviceProviderGetChildCreationSchema;
 exports.useDeviceProviderGetDevices = useDeviceProviderGetDevices;
+exports.useDeviceProviderGetDiscoveryParamsSchema = useDeviceProviderGetDiscoveryParamsSchema;
+exports.useDeviceProviderGetManualCreationType = useDeviceProviderGetManualCreationType;
 exports.useDeviceProviderGetStatus = useDeviceProviderGetStatus;
 exports.useDeviceProviderStart = useDeviceProviderStart;
 exports.useDeviceProviderStop = useDeviceProviderStop;