@camstack/ui-library 1.2.331 → 1.2.333

package/dist/index.cjs

@@ -40,6 +40,7 @@ let react_dom_client = require("react-dom/client");
 react_dom_client = __toESM(react_dom_client, 1);
 let _trpc_client = require("@trpc/client");
 _trpc_client = __toESM(_trpc_client, 1);
+let _camstack_types_client = require("@camstack/types/client");
 let _camstack_sdk = require("@camstack/sdk");
 let zod = require("zod");
 //#region src/contexts/ui-text.tsx
@@ -4706,6 +4707,40 @@ var VolumeX = require_createLucideIcon.createLucideIcon("volume-x", [
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
+var WashingMachine = require_createLucideIcon.createLucideIcon("washing-machine", [
+	["path", {
+		d: "M3 6h3",
+		key: "155dbl"
+	}],
+	["path", {
+		d: "M17 6h.01",
+		key: "e2y6kg"
+	}],
+	["rect", {
+		width: "18",
+		height: "20",
+		x: "3",
+		y: "2",
+		rx: "2",
+		key: "od3kk9"
+	}],
+	["circle", {
+		cx: "12",
+		cy: "13",
+		r: "5",
+		key: "nlbqau"
+	}],
+	["path", {
+		d: "M12 18a2.5 2.5 0 0 0 0-5 2.5 2.5 0 0 1 0-5",
+		key: "17lach"
+	}]
+]);
+/**
+* @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 Waves = require_createLucideIcon.createLucideIcon("waves", [
 	["path", {
 		d: "M2 6c.6.5 1.2 1 2.5 1C7 7 7 5 9.5 5c2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1",
@@ -5369,6 +5404,16 @@ var DEVICE_TYPE_META = {
 		icon: Waves,
 		labelKey: "uiLibrary.deviceMeta.type.dishwasher",
 		labelFallback: "Dishwasher"
+	},
+	[_camstack_types.DeviceType.Washer]: {
+		icon: WashingMachine,
+		labelKey: "uiLibrary.deviceMeta.type.washer",
+		labelFallback: "Washing machine"
+	},
+	[_camstack_types.DeviceType.Dryer]: {
+		icon: Wind,
+		labelKey: "uiLibrary.deviceMeta.type.dryer",
+		labelFallback: "Dryer"
 	}
 };
 var DEVICE_ROLE_META = {
@@ -5850,7 +5895,7 @@ function lucideExportName(key) {
 function loadIconGlyphs() {
 	if (fullTable !== void 0) return Promise.resolve();
 	if (failure$1 !== void 0) return Promise.reject(failure$1);
-	pending ??= Promise.resolve().then(() => require("./icons-pqV1UOV_.cjs")).then((module) => {
+	pending ??= Promise.resolve().then(() => require("./icons-CWmwnulO.cjs")).then((module) => {
 		fullTable = module;
 		publish();
 	}, (error) => {
@@ -14504,6 +14549,9 @@ function AccountSignInField({ field, values, disabled, onAction, onChangeMany })
 		if (Object.keys(patch).length > 0) onChangeMany?.(patch);
 		const nextChoices = choicesOf(result["choices"]);
 		setChoices(nextChoices.length > 1 ? nextChoices : []);
+		const picked = typeof result["gatewayId"] === "string" && result["gatewayId"].length > 0;
+		const summary = typeof result["summary"] === "string" ? result["summary"] : null;
+		if (summary !== null && !picked && nextChoices.length < 2) setError(summary);
 		setPhase("idle");
 		setPaste("");
 		setAttemptId(null);
@@ -19624,6 +19672,1151 @@ function AutotrackSection({ deviceId }) {
 	});
 }
 //#endregion
+//#region src/composites/device-name/device-fleet.tsx
+/**
+* One slim fleet, shared. A row reads its parent from this index — never a
+* `getDevice` per row (the Customize bounded-read rule). `null` is "not
+* answered yet": a label then keeps the stored name, so a list does not flash
+* `#id` while the fleet is in flight. An empty array is an answer.
+*/
+var DeviceNameIndexContext = (0, react$1.createContext)(null);
+function useDeviceNameIndex() {
+	return (0, react$1.useContext)(DeviceNameIndexContext);
+}
+function copyDevice(device) {
+	const label = device.display?.label;
+	const trimmed = label === void 0 || label === null ? "" : label.trim();
+	return {
+		id: device.id,
+		name: device.name,
+		type: device.type,
+		stableId: device.stableId,
+		role: device.role ?? null,
+		parentDeviceId: device.parentDeviceId ?? null,
+		location: device.location ?? null,
+		...trimmed.length > 0 ? { display: { label: trimmed } } : {},
+		...device.primaryChildEntityId !== void 0 ? { primaryChildEntityId: device.primaryChildEntityId } : {},
+		...device.userNamed === void 0 ? {} : { userNamed: device.userNamed }
+	};
+}
+/** Build the parent/child maps once per fleet answer. */
+function indexDeviceNames(devices) {
+	const byId = /* @__PURE__ */ new Map();
+	const children = /* @__PURE__ */ new Map();
+	for (const device of devices) {
+		const fields = copyDevice(device);
+		byId.set(fields.id, fields);
+		const parentId = fields.parentDeviceId;
+		if (parentId === null || parentId === void 0 || parentId === fields.id) continue;
+		const list = children.get(parentId);
+		if (list === void 0) children.set(parentId, [fields.id]);
+		else list.push(fields.id);
+	}
+	return {
+		byId,
+		childIds: children
+	};
+}
+function DeviceFleetProvider({ devices, children }) {
+	const index = (0, react$1.useMemo)(() => devices === null ? null : indexDeviceNames(devices), [devices]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceNameIndexContext.Provider, {
+		value: index,
+		children
+	});
+}
+/**
+* The one `deviceManager.listAll` subscriber for names. Same query key the
+* pickers already use, so a second observer does not fetch a second fleet.
+*/
+function DeviceFleetFromServer({ children }) {
+	const query = useDeviceManagerListAll({ projection: "slim" });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceFleetProvider, {
+		devices: query.data === void 0 ? null : query.data,
+		children
+	});
+}
+//#endregion
+//#region src/composites/device-name/format-device-name.ts
+/**
+* One display name for a device.
+*
+* Canonical copy: `packages/ui-library/src/composites/device-name/format-device-name.ts`.
+* The viewer mirrors this file; `scripts/check-device-name-in-sync.ts` diffs the two.
+* Noun strings stay outside — this file only decides which noun to ask for.
+*/
+/** Middle dot used between a container and its noun, and before a room. */
+var DEVICE_NAME_JOIN = " · ";
+var DEVICE_NAME_FORMS = [
+	"compact",
+	"full",
+	"nested",
+	"with-location"
+];
+var PARENT_SEPARATORS = [" — ", " "];
+/**
+* Readings that are never what a container is. Matches the comment on
+* `CONTAINER_CHILD_ROLE_PRIORITY`: battery, temperature, humidity, illuminance,
+* signal, last-seen, plus numeric and enum. `update` is the same kind of row.
+*/
+var DIAGNOSTIC_ROLES = new Set([
+	"battery-sensor",
+	"temperature-sensor",
+	"humidity-sensor",
+	"ambient-light-sensor",
+	"connectivity-sensor",
+	"datetime-sensor",
+	"numeric-sensor",
+	"enum-sensor"
+]);
+/** Hyphen, underscore and whitespace fold together — the namesake comparison. */
+function foldDeviceName(value) {
+	return value.toLowerCase().replace(/[-_\s]+/g, " ").trim();
+}
+function sameDeviceName(left, right) {
+	return foldDeviceName(left) === foldDeviceName(right);
+}
+/**
+* Drop a parent prefix. `" — "` before a space, case-insensitive, so a provider
+* that capitalised the parent differently still strips, and an em-dash child
+* does not keep a dangling dash.
+*/
+function stripDeviceParentPrefix(name, parentName) {
+	if (parentName.length === 0) return name;
+	const nameFold = name.toLowerCase();
+	const parentFold = parentName.toLowerCase();
+	for (const separator of PARENT_SEPARATORS) {
+		const prefix = `${parentFold}${separator}`;
+		if (!nameFold.startsWith(prefix)) continue;
+		return name.slice(prefix.length).trim();
+	}
+	return name;
+}
+function roleOf(device) {
+	const role = device.role;
+	if (role === void 0 || role === null || role.length === 0) return null;
+	return role;
+}
+function isDiagnostic(device) {
+	if (device.type === "update") return true;
+	const role = roleOf(device);
+	return role !== null && DIAGNOSTIC_ROLES.has(role);
+}
+function displayLabel(device) {
+	const label = device.display?.label;
+	if (label === void 0 || label === null) return "";
+	return label.trim();
+}
+function nounOf(device, parent, nouns) {
+	const caption = displayLabel(device);
+	if (caption.length > 0) return caption;
+	const stripped = stripDeviceParentPrefix(device.name, parent.name);
+	const shown = stripped.length > 0 ? stripped : device.name;
+	if (device.userNamed === true) return shown;
+	if (stripped.length === 0 || sameDeviceName(stripped, parent.name) || nouns.isStockPhrase(shown, roleOf(device), device.type)) return nouns.shortNoun(roleOf(device), device.type);
+	return shown;
+}
+function foldsIntoParent(device, parent, noun) {
+	if (sameDeviceName(noun, parent.name)) return true;
+	if (displayLabel(device).length > 0 || device.userNamed === true) return false;
+	return sameDeviceName(stripDeviceParentPrefix(device.name, parent.name), parent.name);
+}
+function meaningfulChildCount(siblings) {
+	let count = 0;
+	for (const sibling of siblings) if (!isDiagnostic(sibling)) count += 1;
+	return count;
+}
+function isContainerPrimary(device, parent, siblings) {
+	const picked = (0, _camstack_types_client.resolveContainerPrimaryChild)(siblings.map((sibling) => {
+		const role = roleOf(sibling);
+		return {
+			id: sibling.id,
+			stableId: sibling.stableId,
+			type: sibling.type,
+			name: sibling.name,
+			...role === null ? {} : { role }
+		};
+	}), parent.primaryChildEntityId, parent.name);
+	return picked !== null && picked.id === device.id;
+}
+function childLine(device, parent, siblings, nouns, form) {
+	const noun = nounOf(device, parent, nouns);
+	if (foldsIntoParent(device, parent, noun)) return parent.name;
+	if (form === "compact" && parent.type === "container" && isContainerPrimary(device, parent, siblings) && meaningfulChildCount(siblings) === 1) return parent.name;
+	return `${parent.name}${DEVICE_NAME_JOIN}${noun}`;
+}
+function joinLocation(label, location) {
+	if (location === void 0 || location === null) return label;
+	const room = location.trim();
+	if (room.length === 0) return label;
+	if (label.split(" · ").some((segment) => sameDeviceName(segment, room))) return label;
+	return `${label}${DEVICE_NAME_JOIN}${room}`;
+}
+function hasParent(device, parent) {
+	if (parent === null) return false;
+	const parentId = device.parentDeviceId;
+	return parentId !== null && parentId !== void 0;
+}
+/**
+* The label for `form`. A top-level device keeps its stored name. A child uses
+* the noun: `compact` may stand in for the container when this child is what
+* the container is, `full` always names both unless they fold together,
+* `nested` is the noun alone, `with-location` is `compact` plus the room.
+*/
+function formatDeviceName(device, form, context, nouns) {
+	if (!hasParent(device, context.parent)) return form === "with-location" ? joinLocation(device.name, device.location) : device.name;
+	if (form === "nested") return nounOf(device, context.parent, nouns);
+	const line = childLine(device, context.parent, context.siblings, nouns, form === "full" ? "full" : "compact");
+	return form === "with-location" ? joinLocation(line, device.location) : line;
+}
+//#endregion
+//#region src/composites/device-name/device-name-nouns.ts
+/**
+* Short nouns and the stock words they replace.
+*
+* Long labels are the existing role and type names, both locales, so a stored
+* "Motion sensor" and a stored "Sensore di movimento" are the same stock word.
+* The short noun is what a list shows. Where the long label is already one
+* word it is the short noun. Aliases are provider stock words that are not the
+* label ("Illumination", "Last seen").
+*/
+var DEVICE_ROLE_NOUNS = [
+	{
+		id: "siren",
+		key: "uiLibrary.deviceMeta.noun.role.siren",
+		en: "Siren",
+		it: "Sirena",
+		shortEn: "Siren",
+		shortIt: "Sirena",
+		aliases: []
+	},
+	{
+		id: "floodlight",
+		key: "uiLibrary.deviceMeta.noun.role.floodlight",
+		en: "Floodlight",
+		it: "Faro",
+		shortEn: "Floodlight",
+		shortIt: "Faro",
+		aliases: []
+	},
+	{
+		id: "spotlight",
+		key: "uiLibrary.deviceMeta.noun.role.spotlight",
+		en: "Spotlight",
+		it: "Faretto",
+		shortEn: "Spotlight",
+		shortIt: "Faretto",
+		aliases: []
+	},
+	{
+		id: "pir-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.pirSensor",
+		en: "PIR sensor",
+		it: "Sensore PIR",
+		shortEn: "PIR",
+		shortIt: "PIR",
+		aliases: []
+	},
+	{
+		id: "chime",
+		key: "uiLibrary.deviceMeta.noun.role.chime",
+		en: "Chime",
+		it: "Campanello",
+		shortEn: "Chime",
+		shortIt: "Campanello",
+		aliases: []
+	},
+	{
+		id: "autotrack",
+		key: "uiLibrary.deviceMeta.noun.role.autotrack",
+		en: "Auto-track",
+		it: "Auto-tracking",
+		shortEn: "Auto-track",
+		shortIt: "Auto-tracking",
+		aliases: []
+	},
+	{
+		id: "nightvision",
+		key: "uiLibrary.deviceMeta.noun.role.nightvision",
+		en: "Night vision",
+		it: "Visione notturna",
+		shortEn: "Night",
+		shortIt: "Notturna",
+		aliases: []
+	},
+	{
+		id: "privacy-mask",
+		key: "uiLibrary.deviceMeta.noun.role.privacyMask",
+		en: "Privacy mask",
+		it: "Maschera privacy",
+		shortEn: "Privacy",
+		shortIt: "Privacy",
+		aliases: []
+	},
+	{
+		id: "doorbell",
+		key: "uiLibrary.deviceMeta.noun.role.doorbell",
+		en: "Doorbell",
+		it: "Campanello video",
+		shortEn: "Doorbell",
+		shortIt: "Campanello video",
+		aliases: []
+	},
+	{
+		id: "cover-blind",
+		key: "uiLibrary.deviceMeta.noun.role.coverBlind",
+		en: "Blind",
+		it: "Tapparella",
+		shortEn: "Blind",
+		shortIt: "Tapparella",
+		aliases: []
+	},
+	{
+		id: "cover-shutter",
+		key: "uiLibrary.deviceMeta.noun.role.coverShutter",
+		en: "Shutter",
+		it: "Persiana",
+		shortEn: "Shutter",
+		shortIt: "Persiana",
+		aliases: []
+	},
+	{
+		id: "cover-awning",
+		key: "uiLibrary.deviceMeta.noun.role.coverAwning",
+		en: "Awning",
+		it: "Tenda da sole",
+		shortEn: "Awning",
+		shortIt: "Tenda da sole",
+		aliases: []
+	},
+	{
+		id: "cover-curtain",
+		key: "uiLibrary.deviceMeta.noun.role.coverCurtain",
+		en: "Curtain",
+		it: "Tenda",
+		shortEn: "Curtain",
+		shortIt: "Tenda",
+		aliases: []
+	},
+	{
+		id: "cover-garage",
+		key: "uiLibrary.deviceMeta.noun.role.coverGarage",
+		en: "Garage door",
+		it: "Porta del garage",
+		shortEn: "Garage",
+		shortIt: "Garage",
+		aliases: []
+	},
+	{
+		id: "cover-gate",
+		key: "uiLibrary.deviceMeta.noun.role.coverGate",
+		en: "Gate",
+		it: "Cancello",
+		shortEn: "Gate",
+		shortIt: "Cancello",
+		aliases: []
+	},
+	{
+		id: "cover-door",
+		key: "uiLibrary.deviceMeta.noun.role.coverDoor",
+		en: "Door",
+		it: "Porta",
+		shortEn: "Door",
+		shortIt: "Porta",
+		aliases: []
+	},
+	{
+		id: "cover-window",
+		key: "uiLibrary.deviceMeta.noun.role.coverWindow",
+		en: "Window",
+		it: "Finestra",
+		shortEn: "Window",
+		shortIt: "Finestra",
+		aliases: []
+	},
+	{
+		id: "binary-helper",
+		key: "uiLibrary.deviceMeta.noun.role.binaryHelper",
+		en: "Binary helper",
+		it: "Helper binario",
+		shortEn: "Helper",
+		shortIt: "Helper",
+		aliases: []
+	},
+	{
+		id: "outlet",
+		key: "uiLibrary.deviceMeta.noun.role.outlet",
+		en: "Outlet",
+		it: "Presa",
+		shortEn: "Outlet",
+		shortIt: "Presa",
+		aliases: []
+	},
+	{
+		id: "motion-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.motionSensor",
+		en: "Motion sensor",
+		it: "Sensore di movimento",
+		shortEn: "Motion",
+		shortIt: "Movimento",
+		aliases: []
+	},
+	{
+		id: "contact-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.contactSensor",
+		en: "Contact sensor",
+		it: "Sensore di contatto",
+		shortEn: "Contact",
+		shortIt: "Contatto",
+		aliases: []
+	},
+	{
+		id: "leak-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.leakSensor",
+		en: "Leak sensor",
+		it: "Sensore di perdite",
+		shortEn: "Leak",
+		shortIt: "Perdita",
+		aliases: []
+	},
+	{
+		id: "smoke-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.smokeSensor",
+		en: "Smoke sensor",
+		it: "Sensore di fumo",
+		shortEn: "Smoke",
+		shortIt: "Fumo",
+		aliases: []
+	},
+	{
+		id: "co-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.cOSensor",
+		en: "CO sensor",
+		it: "Sensore di CO",
+		shortEn: "CO",
+		shortIt: "CO",
+		aliases: []
+	},
+	{
+		id: "gas-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.gasSensor",
+		en: "Gas sensor",
+		it: "Sensore di gas",
+		shortEn: "Gas",
+		shortIt: "Gas",
+		aliases: []
+	},
+	{
+		id: "tamper-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.tamperSensor",
+		en: "Tamper sensor",
+		it: "Sensore antimanomissione",
+		shortEn: "Tamper",
+		shortIt: "Manomissione",
+		aliases: []
+	},
+	{
+		id: "vibration-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.vibrationSensor",
+		en: "Vibration sensor",
+		it: "Sensore di vibrazione",
+		shortEn: "Vibration",
+		shortIt: "Vibrazione",
+		aliases: []
+	},
+	{
+		id: "connectivity-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.connectivitySensor",
+		en: "Connectivity",
+		it: "Connettività",
+		shortEn: "Connectivity",
+		shortIt: "Connettività",
+		aliases: []
+	},
+	{
+		id: "sound-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.soundSensor",
+		en: "Sound sensor",
+		it: "Sensore acustico",
+		shortEn: "Sound",
+		shortIt: "Suono",
+		aliases: []
+	},
+	{
+		id: "binary-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.binarySensor",
+		en: "Binary sensor",
+		it: "Sensore binario",
+		shortEn: "Binary",
+		shortIt: "Binario",
+		aliases: []
+	},
+	{
+		id: "temperature-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.temperatureSensor",
+		en: "Temperature",
+		it: "Temperatura",
+		shortEn: "Temperature",
+		shortIt: "Temperatura",
+		aliases: []
+	},
+	{
+		id: "humidity-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.humiditySensor",
+		en: "Humidity",
+		it: "Umidità",
+		shortEn: "Humidity",
+		shortIt: "Umidità",
+		aliases: []
+	},
+	{
+		id: "ambient-light-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.ambientLightSensor",
+		en: "Ambient light",
+		it: "Luce ambientale",
+		shortEn: "Light",
+		shortIt: "Luce",
+		aliases: ["Illumination"]
+	},
+	{
+		id: "pressure-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.pressureSensor",
+		en: "Pressure",
+		it: "Pressione",
+		shortEn: "Pressure",
+		shortIt: "Pressione",
+		aliases: []
+	},
+	{
+		id: "wind-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.windSensor",
+		en: "Wind",
+		it: "Vento",
+		shortEn: "Wind",
+		shortIt: "Vento",
+		aliases: []
+	},
+	{
+		id: "rain-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.rainSensor",
+		en: "Rain",
+		it: "Pioggia",
+		shortEn: "Rain",
+		shortIt: "Pioggia",
+		aliases: []
+	},
+	{
+		id: "uv-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.uvSensor",
+		en: "UV index",
+		it: "Indice UV",
+		shortEn: "UV index",
+		shortIt: "Indice UV",
+		aliases: []
+	},
+	{
+		id: "solar-radiation-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.solarRadiationSensor",
+		en: "Solar radiation",
+		it: "Radiazione solare",
+		shortEn: "Solar radiation",
+		shortIt: "Radiazione solare",
+		aliases: []
+	},
+	{
+		id: "soil-moisture-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.soilMoistureSensor",
+		en: "Soil moisture",
+		it: "Umidità del suolo",
+		shortEn: "Soil moisture",
+		shortIt: "Umidità del suolo",
+		aliases: []
+	},
+	{
+		id: "power-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.powerSensor",
+		en: "Power",
+		it: "Potenza",
+		shortEn: "Power",
+		shortIt: "Potenza",
+		aliases: []
+	},
+	{
+		id: "energy-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.energySensor",
+		en: "Energy",
+		it: "Energia",
+		shortEn: "Energy",
+		shortIt: "Energia",
+		aliases: []
+	},
+	{
+		id: "voltage-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.voltageSensor",
+		en: "Voltage",
+		it: "Tensione",
+		shortEn: "Voltage",
+		shortIt: "Tensione",
+		aliases: []
+	},
+	{
+		id: "current-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.currentSensor",
+		en: "Current",
+		it: "Corrente",
+		shortEn: "Current",
+		shortIt: "Corrente",
+		aliases: []
+	},
+	{
+		id: "air-quality-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.airQualitySensor",
+		en: "Air quality",
+		it: "Qualità dell’aria",
+		shortEn: "Air quality",
+		shortIt: "Qualità dell’aria",
+		aliases: []
+	},
+	{
+		id: "battery-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.batterySensor",
+		en: "Battery",
+		it: "Batteria",
+		shortEn: "Battery",
+		shortIt: "Batteria",
+		aliases: []
+	},
+	{
+		id: "numeric-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.numericSensor",
+		en: "Numeric sensor",
+		it: "Sensore numerico",
+		shortEn: "Value",
+		shortIt: "Numerico",
+		aliases: []
+	},
+	{
+		id: "enum-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.enumSensor",
+		en: "Enum sensor",
+		it: "Sensore a stati",
+		shortEn: "State",
+		shortIt: "Stato",
+		aliases: []
+	},
+	{
+		id: "datetime-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.dateTimeSensor",
+		en: "Date / time",
+		it: "Data / ora",
+		shortEn: "Time",
+		shortIt: "Ora",
+		aliases: ["Last seen"]
+	},
+	{
+		id: "generic-sensor",
+		key: "uiLibrary.deviceMeta.noun.role.genericSensor",
+		en: "Sensor",
+		it: "Sensore",
+		shortEn: "Sensor",
+		shortIt: "Sensore",
+		aliases: []
+	},
+	{
+		id: "numeric-control",
+		key: "uiLibrary.deviceMeta.noun.role.numericControl",
+		en: "Numeric control",
+		it: "Controllo numerico",
+		shortEn: "Number",
+		shortIt: "Numero",
+		aliases: []
+	},
+	{
+		id: "select-control",
+		key: "uiLibrary.deviceMeta.noun.role.selectControl",
+		en: "Select control",
+		it: "Controllo a selezione",
+		shortEn: "Select",
+		shortIt: "Selezione",
+		aliases: []
+	},
+	{
+		id: "text-control",
+		key: "uiLibrary.deviceMeta.noun.role.textControl",
+		en: "Text control",
+		it: "Controllo testo",
+		shortEn: "Text",
+		shortIt: "Testo",
+		aliases: []
+	},
+	{
+		id: "datetime-control",
+		key: "uiLibrary.deviceMeta.noun.role.dateTimeControl",
+		en: "Date / time control",
+		it: "Controllo data / ora",
+		shortEn: "Time",
+		shortIt: "Ora",
+		aliases: []
+	},
+	{
+		id: "mobile-push-notifier",
+		key: "uiLibrary.deviceMeta.noun.role.mobilePushNotifier",
+		en: "Mobile push",
+		it: "Push su mobile",
+		shortEn: "Push",
+		shortIt: "Push",
+		aliases: []
+	},
+	{
+		id: "messaging-notifier",
+		key: "uiLibrary.deviceMeta.noun.role.messagingNotifier",
+		en: "Messaging",
+		it: "Messaggistica",
+		shortEn: "Messaging",
+		shortIt: "Messaggistica",
+		aliases: []
+	},
+	{
+		id: "email-notifier",
+		key: "uiLibrary.deviceMeta.noun.role.emailNotifier",
+		en: "Email",
+		it: "Email",
+		shortEn: "Email",
+		shortIt: "Email",
+		aliases: []
+	},
+	{
+		id: "generic-notifier",
+		key: "uiLibrary.deviceMeta.noun.role.genericNotifier",
+		en: "Notifier",
+		it: "Notificatore",
+		shortEn: "Notifier",
+		shortIt: "Notificatore",
+		aliases: []
+	}
+];
+var DEVICE_TYPE_NOUNS = [
+	{
+		id: "camera",
+		key: "uiLibrary.deviceMeta.noun.type.camera",
+		en: "Camera",
+		it: "Telecamera",
+		shortEn: "Camera",
+		shortIt: "Telecamera",
+		aliases: []
+	},
+	{
+		id: "hub",
+		key: "uiLibrary.deviceMeta.noun.type.hub",
+		en: "Hub",
+		it: "Hub",
+		shortEn: "Hub",
+		shortIt: "Hub",
+		aliases: []
+	},
+	{
+		id: "light",
+		key: "uiLibrary.deviceMeta.noun.type.light",
+		en: "Light",
+		it: "Luce",
+		shortEn: "Light",
+		shortIt: "Luce",
+		aliases: []
+	},
+	{
+		id: "siren",
+		key: "uiLibrary.deviceMeta.noun.type.siren",
+		en: "Siren",
+		it: "Sirena",
+		shortEn: "Siren",
+		shortIt: "Sirena",
+		aliases: []
+	},
+	{
+		id: "switch",
+		key: "uiLibrary.deviceMeta.noun.type.switch",
+		en: "Switch",
+		it: "Interruttore",
+		shortEn: "Switch",
+		shortIt: "Interruttore",
+		aliases: []
+	},
+	{
+		id: "sensor",
+		key: "uiLibrary.deviceMeta.noun.type.sensor",
+		en: "Sensor",
+		it: "Sensore",
+		shortEn: "Sensor",
+		shortIt: "Sensore",
+		aliases: []
+	},
+	{
+		id: "thermostat",
+		key: "uiLibrary.deviceMeta.noun.type.thermostat",
+		en: "Thermostat",
+		it: "Termostato",
+		shortEn: "Thermostat",
+		shortIt: "Termostato",
+		aliases: []
+	},
+	{
+		id: "climate",
+		key: "uiLibrary.deviceMeta.noun.type.climate",
+		en: "Air conditioner",
+		it: "Condizionatore",
+		shortEn: "Climate",
+		shortIt: "Condizionatore",
+		aliases: []
+	},
+	{
+		id: "button",
+		key: "uiLibrary.deviceMeta.noun.type.button",
+		en: "Button",
+		it: "Pulsante",
+		shortEn: "Button",
+		shortIt: "Pulsante",
+		aliases: []
+	},
+	{
+		id: "event-emitter",
+		key: "uiLibrary.deviceMeta.noun.type.eventEmitter",
+		en: "Event Emitter",
+		it: "Emettitore di eventi",
+		shortEn: "Event",
+		shortIt: "Evento",
+		aliases: []
+	},
+	{
+		id: "update",
+		key: "uiLibrary.deviceMeta.noun.type.update",
+		en: "Update",
+		it: "Aggiornamento",
+		shortEn: "Update",
+		shortIt: "Aggiornamento",
+		aliases: []
+	},
+	{
+		id: "generic",
+		key: "uiLibrary.deviceMeta.noun.type.generic",
+		en: "Generic",
+		it: "Generico",
+		shortEn: "Generic",
+		shortIt: "Generico",
+		aliases: []
+	},
+	{
+		id: "notifier",
+		key: "uiLibrary.deviceMeta.noun.type.notifier",
+		en: "Notifier",
+		it: "Notificatore",
+		shortEn: "Notifier",
+		shortIt: "Notificatore",
+		aliases: []
+	},
+	{
+		id: "script",
+		key: "uiLibrary.deviceMeta.noun.type.script",
+		en: "Script",
+		it: "Script",
+		shortEn: "Script",
+		shortIt: "Script",
+		aliases: []
+	},
+	{
+		id: "automation",
+		key: "uiLibrary.deviceMeta.noun.type.automation",
+		en: "Automation",
+		it: "Automazione",
+		shortEn: "Automation",
+		shortIt: "Automazione",
+		aliases: []
+	},
+	{
+		id: "lock",
+		key: "uiLibrary.deviceMeta.noun.type.lock",
+		en: "Lock",
+		it: "Serratura",
+		shortEn: "Lock",
+		shortIt: "Serratura",
+		aliases: []
+	},
+	{
+		id: "cover",
+		key: "uiLibrary.deviceMeta.noun.type.cover",
+		en: "Cover",
+		it: "Copertura",
+		shortEn: "Cover",
+		shortIt: "Copertura",
+		aliases: []
+	},
+	{
+		id: "valve",
+		key: "uiLibrary.deviceMeta.noun.type.valve",
+		en: "Valve",
+		it: "Valvola",
+		shortEn: "Valve",
+		shortIt: "Valvola",
+		aliases: []
+	},
+	{
+		id: "humidifier",
+		key: "uiLibrary.deviceMeta.noun.type.humidifier",
+		en: "Humidifier",
+		it: "Umidificatore",
+		shortEn: "Humidifier",
+		shortIt: "Umidificatore",
+		aliases: []
+	},
+	{
+		id: "water-heater",
+		key: "uiLibrary.deviceMeta.noun.type.waterHeater",
+		en: "Water heater",
+		it: "Scaldabagno",
+		shortEn: "Heater",
+		shortIt: "Scaldabagno",
+		aliases: []
+	},
+	{
+		id: "fan",
+		key: "uiLibrary.deviceMeta.noun.type.fan",
+		en: "Fan",
+		it: "Ventilatore",
+		shortEn: "Fan",
+		shortIt: "Ventilatore",
+		aliases: []
+	},
+	{
+		id: "media-player",
+		key: "uiLibrary.deviceMeta.noun.type.mediaPlayer",
+		en: "Media player",
+		it: "Lettore multimediale",
+		shortEn: "Player",
+		shortIt: "Lettore",
+		aliases: []
+	},
+	{
+		id: "alarm-panel",
+		key: "uiLibrary.deviceMeta.noun.type.alarmPanel",
+		en: "Alarm panel",
+		it: "Pannello allarme",
+		shortEn: "Alarm",
+		shortIt: "Allarme",
+		aliases: []
+	},
+	{
+		id: "control",
+		key: "uiLibrary.deviceMeta.noun.type.control",
+		en: "Control",
+		it: "Controllo",
+		shortEn: "Control",
+		shortIt: "Controllo",
+		aliases: []
+	},
+	{
+		id: "presence",
+		key: "uiLibrary.deviceMeta.noun.type.presence",
+		en: "Presence",
+		it: "Presenza",
+		shortEn: "Presence",
+		shortIt: "Presenza",
+		aliases: []
+	},
+	{
+		id: "weather",
+		key: "uiLibrary.deviceMeta.noun.type.weather",
+		en: "Weather",
+		it: "Meteo",
+		shortEn: "Weather",
+		shortIt: "Meteo",
+		aliases: []
+	},
+	{
+		id: "vacuum",
+		key: "uiLibrary.deviceMeta.noun.type.vacuum",
+		en: "Vacuum",
+		it: "Aspirapolvere",
+		shortEn: "Vacuum",
+		shortIt: "Aspirapolvere",
+		aliases: []
+	},
+	{
+		id: "lawn-mower",
+		key: "uiLibrary.deviceMeta.noun.type.lawnMower",
+		en: "Lawn mower",
+		it: "Tagliaerba",
+		shortEn: "Mower",
+		shortIt: "Tagliaerba",
+		aliases: []
+	},
+	{
+		id: "container",
+		key: "uiLibrary.deviceMeta.noun.type.container",
+		en: "Container",
+		it: "Contenitore",
+		shortEn: "Container",
+		shortIt: "Contenitore",
+		aliases: []
+	},
+	{
+		id: "image",
+		key: "uiLibrary.deviceMeta.noun.type.image",
+		en: "Image",
+		it: "Immagine",
+		shortEn: "Image",
+		shortIt: "Immagine",
+		aliases: []
+	},
+	{
+		id: "pet-feeder",
+		key: "uiLibrary.deviceMeta.noun.type.petFeeder",
+		en: "Pet feeder",
+		it: "Distributore di cibo per animali",
+		shortEn: "Feeder",
+		shortIt: "Distributore",
+		aliases: []
+	},
+	{
+		id: "dishwasher",
+		key: "uiLibrary.deviceMeta.noun.type.dishwasher",
+		en: "Dishwasher",
+		it: "Lavastoviglie",
+		shortEn: "Dishwasher",
+		shortIt: "Lavastoviglie",
+		aliases: []
+	}
+];
+var FALLBACK_NOUN = {
+	id: "",
+	key: "uiLibrary.deviceMeta.noun.fallback",
+	en: "Device",
+	it: "Dispositivo",
+	shortEn: "Device",
+	shortIt: "Dispositivo",
+	aliases: []
+};
+function findNoun(list, id) {
+	if (id === null || id.length === 0) return void 0;
+	return list.find((spec) => spec.id === id);
+}
+/** Role wins when it has a noun; otherwise the type. Unknown types fall back. */
+function nounSpecFor(role, type) {
+	if (role !== null) {
+		const byRole = findNoun(DEVICE_ROLE_NOUNS, role);
+		if (byRole !== void 0) return byRole;
+	}
+	return findNoun(DEVICE_TYPE_NOUNS, type) ?? FALLBACK_NOUN;
+}
+function stockPhrases(role, type) {
+	const phrases = [];
+	const specs = [findNoun(DEVICE_ROLE_NOUNS, role), findNoun(DEVICE_TYPE_NOUNS, type)];
+	for (const spec of specs) {
+		if (spec === void 0) continue;
+		phrases.push(spec.en, spec.it, spec.shortEn, spec.shortIt, ...spec.aliases);
+	}
+	return phrases;
+}
+function isDeviceNameStock(text, role, type) {
+	const folded = foldDeviceName(text);
+	if (folded.length === 0) return true;
+	return stockPhrases(role, type).some((phrase) => foldDeviceName(phrase) === folded);
+}
+/** Noun table for a locale. Tests and the viewer parity spec use this directly. */
+function deviceNameNouns(locale) {
+	return {
+		shortNoun(role, type) {
+			const spec = nounSpecFor(role, type);
+			return locale === "it" ? spec.shortIt : spec.shortEn;
+		},
+		isStockPhrase(text, role, type) {
+			return isDeviceNameStock(text, role, type);
+		}
+	};
+}
+//#endregion
+//#region src/composites/device-name/use-device-label.ts
+/**
+* `useDeviceLabel` is the string `DeviceName` renders — sort keys, aria
+* labels, confirm copy and search titles call it instead of painting
+* `device.name`.
+*/
+function useDeviceNameNouns() {
+	const t = useUiText();
+	return {
+		shortNoun(role, type) {
+			const spec = nounSpecFor(role, type);
+			return t(spec.key, spec.shortEn);
+		},
+		isStockPhrase(text, role, type) {
+			return isDeviceNameStock(text, role, type);
+		}
+	};
+}
+function placeholderParent(id) {
+	return {
+		id,
+		name: `#${String(id)}`,
+		type: "unknown",
+		stableId: "",
+		role: null,
+		parentDeviceId: null
+	};
+}
+function parentFromIndex(device, index) {
+	const parentId = device.parentDeviceId;
+	if (parentId === null || parentId === void 0) return null;
+	return index.byId.get(parentId) ?? placeholderParent(parentId);
+}
+function siblingsFromIndex(device, index) {
+	const parentId = device.parentDeviceId;
+	if (parentId === null || parentId === void 0) return [];
+	const ids = index.childIds.get(parentId) ?? [];
+	const siblings = [];
+	for (const id of ids) {
+		const row = index.byId.get(id);
+		if (row !== void 0) siblings.push(row);
+	}
+	if (!siblings.some((sibling) => sibling.id === device.id)) siblings.push(device);
+	return siblings;
+}
+/**
+* Label for a device the caller already holds. While the fleet has not
+* answered and no parent was passed, this is the stored name — not `#id`.
+*/
+function resolveDeviceLabel(device, form, index, nouns, scope) {
+	const subject = index?.byId.get(device.id) ?? device;
+	const parentId = subject.parentDeviceId;
+	if (parentId !== null && parentId !== void 0 && index === null && scope?.parent === void 0) return subject.name;
+	return formatDeviceName(subject, form, {
+		parent: scope?.parent !== void 0 ? scope.parent : index === null ? null : parentFromIndex(subject, index),
+		siblings: scope?.siblings ?? (index === null ? [] : siblingsFromIndex(subject, index))
+	}, nouns);
+}
+function useDeviceLabel(device, form, scope) {
+	return resolveDeviceLabel(device, form, useDeviceNameIndex(), useDeviceNameNouns(), scope);
+}
+/** `#id` until the fleet answers, and `#id` when the id is not in it. */
+function useDeviceLabelById(id, form, pendingName) {
+	const index = useDeviceNameIndex();
+	const nouns = useDeviceNameNouns();
+	if (index === null) return pendingName ?? `#${String(id)}`;
+	const device = index.byId.get(id);
+	if (device === void 0) return `#${String(id)}`;
+	return resolveDeviceLabel(device, form, index, nouns);
+}
+//#endregion
+//#region src/composites/device-name/DeviceName.tsx
+function DeviceName({ device, form, parent, siblings, className, testId }) {
+	const label = useDeviceLabel(device, form, {
+		...parent !== void 0 ? { parent } : {},
+		...siblings !== void 0 ? { siblings } : {}
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className,
+		title: label,
+		"data-testid": testId,
+		children: label
+	});
+}
+//#endregion
 //#region src/hooks/use-device-proxy.ts
 /**
 * useDeviceProxy — canonical React entry point for a device.
@@ -20526,6 +21719,9 @@ function GridCellBox({ cell, selected, onSelect, onDragStart }) {
 		}, handle))
 	});
 }
+function CameraOptionLabel({ camera }) {
+	return useDeviceLabel(camera, "compact");
+}
 function CellInspector({ cell, index, cameras, onChange, onRemove }) {
 	const t = useUiText();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -20556,7 +21752,7 @@ function CellInspector({ cell, index, cameras, onChange, onRemove }) {
 					className: "flex-1 rounded border border-border bg-transparent px-1 py-0.5",
 					children: cameras.map((camera) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
 						value: String(camera.id),
-						children: camera.name
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CameraOptionLabel, { camera })
 					}, camera.id))
 				})]
 			}),
@@ -31013,13 +32209,13 @@ function InfoBox({ field }) {
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: `rounded-md border-l-4 px-3 py-2.5 ${styles.border} ${styles.bg}`,
 			children: [field.label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: `text-xs font-semibold mb-0.5 ${styles.text}`,
+				className: field.content.length > 0 ? `text-xs font-semibold mb-0.5 ${styles.text}` : "text-xs text-foreground-subtle leading-relaxed whitespace-pre-line break-words",
 				children: field.label
 			}), isHtml ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: "text-xs text-foreground-subtle leading-relaxed info-html-content",
 				dangerouslySetInnerHTML: { __html: sanitizeInfoHtml(field.content) }
-			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-xs text-foreground-subtle leading-relaxed whitespace-pre-line",
+			}) : field.content.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-xs text-foreground-subtle leading-relaxed whitespace-pre-line break-words",
 				children: field.content
 			})]
 		})
@@ -48244,17 +49440,19 @@ function SensorHeroInner({ trpc, device }) {
 	if (resolution.kind === "quiet") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "flex flex-col items-center justify-center gap-2 rounded-lg border border-border bg-surface p-4 min-h-[96px]",
 		"data-testid": "sensor-hero-quiet",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "text-sm text-foreground-subtle",
-			children: device.name
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+			device,
+			form: "full",
+			className: "text-sm text-foreground-subtle"
 		})
 	});
 	const slice = resolution.kind === "value" ? resolution.slice : void 0;
 	if (descriptor === void 0 || slice === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "flex flex-col items-center justify-center gap-2 rounded-lg border border-border bg-surface p-4 min-h-[96px]",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "text-sm text-foreground-subtle",
-			children: device.name
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+			device,
+			form: "full",
+			className: "text-sm text-foreground-subtle"
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			className: "text-xs text-foreground-subtle italic",
 			children: t("uiLibrary.sensorHeroCard.awaiting", "Awaiting state…")
@@ -48294,9 +49492,10 @@ function SensorHeroInner({ trpc, device }) {
 					"data-testid": "sensor-hero-occupancy",
 					children: occupancyOn ? t("uiLibrary.sensorHeroCard.occupied", "Occupied") : t("uiLibrary.sensorHeroCard.clear", "Clear")
 				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "text-sm text-foreground-subtle",
-					children: device.name
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+					device,
+					form: "full",
+					className: "text-sm text-foreground-subtle"
 				})
 			]
 		});
@@ -48311,9 +49510,10 @@ function SensorHeroInner({ trpc, device }) {
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: cn("inline-flex items-center rounded px-3 py-1.5 text-lg font-semibold", active ? "bg-warning/15 text-warning" : "bg-surface-subtle text-foreground-subtle"),
 				children: label
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-sm text-foreground-subtle",
-				children: device.name
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device,
+				form: "full",
+				className: "text-sm text-foreground-subtle"
 			})]
 		});
 	}
@@ -48321,9 +49521,10 @@ function SensorHeroInner({ trpc, device }) {
 		if (!isStringSliceValue(slice)) return null;
 		if (slice.value === "") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "flex flex-col items-center justify-center gap-2 rounded-lg border border-border bg-surface p-4 min-h-[96px]",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-sm text-foreground-subtle",
-				children: device.name
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device,
+				form: "full",
+				className: "text-sm text-foreground-subtle"
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: "text-xs text-foreground-subtle italic",
 				children: t("uiLibrary.sensorHeroCard.awaiting", "Awaiting state…")
@@ -48335,9 +49536,10 @@ function SensorHeroInner({ trpc, device }) {
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: "text-3xl font-semibold tabular-nums text-foreground",
 				children: formatControlDateTime(slice.value, format)
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-sm text-foreground-subtle",
-				children: device.name
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device,
+				form: "full",
+				className: "text-sm text-foreground-subtle"
 			})]
 		});
 	}
@@ -48349,9 +49551,10 @@ function SensorHeroInner({ trpc, device }) {
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: "text-xl font-semibold text-foreground",
 				children: slice.value
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-sm text-foreground-subtle",
-				children: device.name
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device,
+				form: "full",
+				className: "text-sm text-foreground-subtle"
 			})]
 		});
 	}
@@ -48362,9 +49565,10 @@ function SensorHeroInner({ trpc, device }) {
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			className: cn("inline-flex items-center rounded px-3 py-1.5 text-lg font-semibold", slice.state === "home" ? "bg-success/15 text-success" : "bg-surface-subtle text-foreground-subtle"),
 			children: label
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "text-sm text-foreground-subtle",
-			children: device.name
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+			device,
+			form: "full",
+			className: "text-sm text-foreground-subtle"
 		})]
 	});
 }
@@ -55119,7 +56323,9 @@ var CONTROL_FILLS = {
 	[_camstack_types.DeviceType.Container]: false,
 	[_camstack_types.DeviceType.Image]: false,
 	[_camstack_types.DeviceType.PetFeeder]: false,
-	[_camstack_types.DeviceType.Dishwasher]: false
+	[_camstack_types.DeviceType.Dishwasher]: false,
+	[_camstack_types.DeviceType.Washer]: false,
+	[_camstack_types.DeviceType.Dryer]: false
 };
 var DEVICE_TYPE_VALUES = new Set(Object.values(_camstack_types.DeviceType));
 /**
@@ -56375,6 +57581,7 @@ function useContainerChildren(deviceId) {
 var SENSOR_VALUE_TYPES = new Set([_camstack_types.DeviceType.Sensor, _camstack_types.DeviceType.Presence]);
 function DeviceItemActions({ trpc, device, controlPlacement }) {
 	const containerChildren = useContainerChildren(device.id);
+	const deviceLabel = useDeviceLabel(device, "compact");
 	const placement = controlPlacement ?? "right";
 	if (!!device.disabled) return null;
 	if (device.type === _camstack_types.DeviceType.Container) {
@@ -56430,7 +57637,7 @@ function DeviceItemActions({ trpc, device, controlPlacement }) {
 		showReboot && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RebootQuickAction, {
 			trpc,
 			deviceId: device.id,
-			deviceName: device.name
+			deviceName: deviceLabel
 		}),
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AdminLinkQuickAction, {
 			trpc,
@@ -56666,9 +57873,16 @@ function ChildRow$1({ trpc, child, onNavigate, parentName }) {
 				running: runningSlice === void 0 || runningSlice.running === null ? null : runningSlice.running,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChildIcon, { className: "h-3 w-3 text-foreground-subtle flex-shrink-0" })
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-[10.5px] text-foreground flex-1 truncate",
-				children: childListName(child, parentName)
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device: child,
+				form: "nested",
+				parent: {
+					id: child.parentDeviceId ?? 0,
+					name: parentName,
+					type: "unknown",
+					stableId: ""
+				},
+				className: "text-[10.5px] text-foreground flex-1 truncate"
 			}),
 			showMotionTrigger && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChildMotionTriggerToggle, {
 				trpc,
@@ -56775,8 +57989,9 @@ function IconAction({ icon: Icon, label, onClick, danger = false }) {
 function DeviceDeleteAction({ device, onDelete }) {
 	const t = useUiText();
 	const confirm = useConfirm();
+	const deviceLabel = useDeviceLabel(device, "full");
 	const requestDelete = async () => {
-		const label = device.name.trim() !== "" ? device.name : `#${String(device.id)}`;
+		const label = deviceLabel.trim() !== "" ? deviceLabel : `#${String(device.id)}`;
 		if (await confirm({
 			title: t("uiLibrary.deviceDeleteAction.title", "Delete device?"),
 			message: t("uiLibrary.deviceDeleteAction.message", "This will remove \"{{label}}\" and all its settings. This action cannot be undone.", { label }),
@@ -57059,7 +58274,7 @@ var CHEVRON_SLOT_CLASS = {
 	horizontal: "h-3.5 w-3.5",
 	stacked: "h-4 w-4 mt-0.5"
 };
-function DeviceItemHeader({ trpc, device, variant, flags, parent, integrationIcon, hasChildren, expanded, onToggleExpand, onNavigateToParent, stacked = false, nameOverflow = "truncate" }) {
+function DeviceItemHeader({ trpc, device, variant, flags, parent, integrationIcon, hasChildren, expanded, onToggleExpand, onNavigateToParent, stacked = false, nameOverflow = "truncate", nameForm = "compact" }) {
 	const t = useUiText();
 	const containerChildren = useContainerChildren(device.id);
 	const roleDefaults = useRoleDisplayDefaults();
@@ -57070,6 +58285,13 @@ function DeviceItemHeader({ trpc, device, variant, flags, parent, integrationIco
 	const slotClass = stacked ? CHEVRON_SLOT_CLASS.stacked : CHEVRON_SLOT_CLASS.horizontal;
 	const iconClass = cn("text-foreground-subtle flex-shrink-0", stacked ? "h-4 w-4 mt-0.5" : variant === "minimal" ? "h-3 w-3" : "h-3.5 w-3.5");
 	const lineClass = nameOverflow === "scroll" ? NAME_TEXT_CLASS : "truncate";
+	const nameParent = nameForm === "nested" && parent !== null ? {
+		id: parent.id,
+		name: parent.name,
+		type: parent.type ?? "unknown",
+		stableId: ""
+	} : void 0;
+	const parentLabel = useDeviceLabelById(parent?.id ?? 0, "compact", parent?.name);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: cn(stacked ? "flex items-start gap-2 w-full min-w-0" : "flex items-center gap-2 flex-1 min-w-0"),
 		children: [
@@ -57100,11 +58322,12 @@ function DeviceItemHeader({ trpc, device, variant, flags, parent, integrationIco
 						children: [flags.showIntegrationIcon && integrationIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: "flex-shrink-0",
 							children: integrationIcon
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							"data-testid": "device-name",
-							className: cn("font-semibold text-foreground", stacked ? "text-[13px] leading-snug line-clamp-2 break-words" : cn(lineClass, variant === "minimal" ? "text-[10.5px]" : "text-[11px]")),
-							title: device.name,
-							children: device.name
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+							device,
+							form: nameForm,
+							...nameParent !== void 0 ? { parent: nameParent } : {},
+							testId: "device-name",
+							className: cn("font-semibold text-foreground", stacked ? "text-[13px] leading-snug line-clamp-2 break-words" : cn(lineClass, variant === "minimal" ? "text-[10.5px]" : "text-[11px]"))
 						})]
 					}),
 					(flags.showId || flags.showStableId) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -57133,12 +58356,12 @@ function DeviceItemHeader({ trpc, device, variant, flags, parent, integrationIco
 						},
 						className: cn("mt-0.5 inline-flex items-center gap-1 text-[9px] text-foreground-subtle hover:text-primary transition-colors", nameOverflow === "scroll" ? "md:max-w-full" : "max-w-full"),
 						title: t("uiLibrary.deviceItemHeader.openParent", "Open parent: {{name}} (#{{id}})", {
-							name: parent.name,
+							name: parentLabel,
 							id: parent.id
 						}),
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Network, { className: "h-2.5 w-2.5 shrink-0" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: lineClass,
-							children: t("uiLibrary.deviceItemHeader.under", "Under: {{name}}", { name: parent.name })
+							children: t("uiLibrary.deviceItemHeader.under", "Under: {{name}}", { name: parentLabel })
 						})]
 					})
 				]
@@ -57267,7 +58490,9 @@ function HoverZoomImage({ src, alt, caption, placeholder = "No image", thumbClas
 *  the 288 px hover zoom. */
 var PREVIEW_SNAPSHOT_WIDTH = 480;
 function DeviceItemPreview({ trpc, device, status, enabled, showStatusPills = false }) {
-	const snapshot = useDeviceSnapshotImage(enabled && device.online ? device.id : null, { width: PREVIEW_SNAPSHOT_WIDTH });
+	const liveActive = enabled && device.online;
+	const deviceLabel = useDeviceLabel(device, "compact");
+	const snapshot = useDeviceSnapshotImage(liveActive ? device.id : null, { width: PREVIEW_SNAPSHOT_WIDTH });
 	const isBatteryOperated = (device.features ?? []).includes("battery-operated");
 	const wantPills = showStatusPills && isBatteryOperated && !device.disabled;
 	const batteryStatus = useDeviceBattery(trpc, wantPills ? device.id : null);
@@ -57283,7 +58508,7 @@ function DeviceItemPreview({ trpc, device, status, enabled, showStatusPills = fa
 			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,
+				alt: deviceLabel,
 				placeholder,
 				thumbClassName: "h-7 w-7 rounded"
 			})
@@ -57506,6 +58731,14 @@ function DeviceItem(props) {
 	const flags = resolveFlags(props);
 	const variant = props.variant ?? "compact";
 	const view = props.view ?? "card";
+	const nameForm = props.isAccessoryRow ? "nested" : "compact";
+	const nameParent = nameForm === "nested" && parent ? {
+		id: parent.id,
+		name: parent.name,
+		type: parent.type ?? "unknown",
+		stableId: ""
+	} : void 0;
+	const rowLabel = useDeviceLabel(device, nameForm, nameParent !== void 0 ? { parent: nameParent } : void 0);
 	const enabled = !device.disabled;
 	const isCamera = device.isCamera ?? device.type.toLowerCase() === "camera";
 	const childrenList = props.children ?? [];
@@ -57581,7 +58814,7 @@ function DeviceItem(props) {
 					checked: selection.selected,
 					onChange: selection.onToggle,
 					onClick: (e) => e.stopPropagation(),
-					"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: device.name }),
+					"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: rowLabel }),
 					className: "flex-shrink-0"
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceItemHeader, {
@@ -57590,6 +58823,7 @@ function DeviceItem(props) {
 					variant,
 					flags,
 					parent: parent ?? null,
+					nameForm,
 					integrationIcon: integrationIcon ?? null,
 					hasChildren,
 					expanded,
@@ -57658,7 +58892,7 @@ function DeviceItem(props) {
 							checked: selection.selected,
 							onChange: selection.onToggle,
 							onClick: (e) => e.stopPropagation(),
-							"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: device.name }),
+							"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: rowLabel }),
 							className: "flex-shrink-0 mt-0.5"
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceItemHeader, {
@@ -57667,6 +58901,7 @@ function DeviceItem(props) {
 							variant,
 							flags,
 							parent: parent ?? null,
+							nameForm,
 							integrationIcon: integrationIcon ?? null,
 							hasChildren,
 							expanded,
@@ -57727,6 +58962,14 @@ function DeviceItemTableRow(props) {
 	const t = useUiText();
 	const { trpc, device, variant, flags, parent, integrationIcon, accessoryCount, adoptedCount, hasChildren, expanded, onToggleExpand, onNavigate, onRowClick, rowSelects, rowSelected, displayStatus, isCamera, showSnapshot, isAccessoryRow, indentLevel, className, renderRowAction, onDelete, selection, showTypeCell, showManufacturerCell, showFeaturesCell } = props;
 	const containerChildren = useContainerChildren(device.id);
+	const nameForm = isAccessoryRow ? "nested" : "compact";
+	const nameParent = nameForm === "nested" && parent ? {
+		id: parent.id,
+		name: parent.name,
+		type: parent.type ?? "unknown",
+		stableId: ""
+	} : void 0;
+	const rowLabel = useDeviceLabel(device, nameForm, nameParent !== void 0 ? { parent: nameParent } : void 0);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("tr", {
 		onClick: onRowClick,
 		...rowSelects ? {
@@ -57751,7 +58994,7 @@ function DeviceItemTableRow(props) {
 						checked: selection.selected,
 						onChange: selection.onToggle,
 						onClick: (e) => e.stopPropagation(),
-						"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: device.name }),
+						"aria-label": t("uiLibrary.deviceItem.select", "Select {{name}}", { name: rowLabel }),
 						className: "flex-shrink-0"
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceItemHeader, {
 						trpc,
@@ -57759,6 +59002,7 @@ function DeviceItemTableRow(props) {
 						variant,
 						flags,
 						parent,
+						nameForm,
 						integrationIcon,
 						hasChildren,
 						expanded,
@@ -58497,13 +59741,13 @@ function TableRowGroup({ parent, accessories, hasAccessories, expanded, onToggle
 function AccessorySubRow({ trpc, accessory, parentName, showType, showManufacturer, showFeatures, onNavigate, muted }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceItem, {
 		trpc,
-		device: {
-			...accessory,
-			name: childListName(accessory, parentName)
-		},
+		device: accessory,
 		view: "table",
 		integrationIcon: null,
-		parent: null,
+		parent: accessory.parentDeviceId === null ? null : {
+			id: accessory.parentDeviceId,
+			name: parentName
+		},
 		isAccessoryRow: true,
 		showChildrenAccordion: false,
 		onNavigate: onNavigate ?? void 0,
@@ -59302,6 +60546,15 @@ function DeviceExportSetup({ addonId }) {
 		}), status.setup && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SetupSection, { setup: status.setup })]
 	});
 }
+function ExportSelectCell({ device, checked, onToggle }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		type: "checkbox",
+		checked,
+		onChange: onToggle,
+		onClick: (e) => e.stopPropagation(),
+		"aria-label": useUiText()("uiLibrary.deviceExport.select", "Select {{name}}", { name: useDeviceLabel(device, "compact") })
+	});
+}
 /**
 * Per-row Expose/Exposed toggle. Reflects whether the row's device is exposed
 * to THIS exporter and flips it through the SAME runner the bulk buttons use —
@@ -59313,6 +60566,7 @@ function DeviceExportSetup({ addonId }) {
 */
 function ExportRowToggle({ addonId, device, exposed, busy, onToggle }) {
 	const t = useUiText();
+	const deviceLabel = useDeviceLabel(device, "compact");
 	const handleClick = (e) => {
 		e.stopPropagation();
 		if (busy) return;
@@ -59323,7 +60577,7 @@ function ExportRowToggle({ addonId, device, exposed, busy, onToggle }) {
 		variant: exposed ? "ghost" : "primary",
 		disabled: busy,
 		onClick: handleClick,
-		"aria-label": exposed ? t("uiLibrary.deviceExport.unexposeDevice", "Unexpose {{name}}", { name: device.name }) : t("uiLibrary.deviceExport.exposeDevice", "Expose {{name}}", { name: device.name }),
+		"aria-label": exposed ? t("uiLibrary.deviceExport.unexposeDevice", "Unexpose {{name}}", { name: deviceLabel }) : t("uiLibrary.deviceExport.exposeDevice", "Expose {{name}}", { name: deviceLabel }),
 		title: exposed ? t("uiLibrary.deviceExport.stopTitle", "Stop exposing to \"{{addon}}\"", { addon: addonId }) : t("uiLibrary.deviceExport.exposeTitle", "Expose to \"{{addon}}\"", { addon: addonId }),
 		children: exposed ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Unlink2, { className: "mr-1 h-3.5 w-3.5" }), t("uiLibrary.deviceExport.exposed", "Exposed")] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Share2, { className: "mr-1 h-3.5 w-3.5" }), t("uiLibrary.deviceExport.expose", "Expose")] })
 	});
@@ -59539,12 +60793,10 @@ function DeviceExportPanel({ addonId, onOpenDevice, showSetup = true }) {
 			key: "select",
 			header: "",
 			headerClassName: "w-8",
-			cell: (device) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-				type: "checkbox",
+			cell: (device) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ExportSelectCell, {
+				device,
 				checked: selectedIds.has(String(device.id)),
-				onChange: () => toggleSelection(String(device.id)),
-				onClick: (e) => e.stopPropagation(),
-				"aria-label": t("uiLibrary.deviceExport.select", "Select {{name}}", { name: device.name })
+				onToggle: () => toggleSelection(String(device.id))
 			})
 		},
 		{
@@ -59563,9 +60815,10 @@ function DeviceExportPanel({ addonId, onOpenDevice, showSetup = true }) {
 		{
 			key: "name",
 			header: t("uiLibrary.deviceExport.colName", "Name"),
-			cell: (device) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-xs font-medium text-foreground",
-				children: device.name
+			cell: (device) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceName, {
+				device,
+				form: "compact",
+				className: "text-xs font-medium text-foreground"
 			})
 		},
 		{
@@ -61148,28 +62401,61 @@ function FormField$1({ label, description, error, required, children, orientatio
 }
 //#endregion
 //#region src/composites/grouped-tile-picker.tsx
+/**
+* `GroupedTilePicker` — choose ONE "type of thing" from tiles grouped by who
+* provides it (an AI profile kind, a notification-target kind…): an uppercase
+* group label, then a grid of icon + label tiles. The pre-modal of a
+* create-flow whose form depends on the choice.
+*
+* The tile is deliberately not a `Button`: a vertical icon-over-label card in
+* a grid, which toolbar-button chrome fights. One place owns that look so the
+* pickers stay identical.
+*/
 function GroupedTilePicker({ groups, onPick, emptyMessage }) {
+	const [openKey, setOpenKey] = (0, react$1.useState)(null);
+	const openTile = openKey === null ? null : groups.flatMap((group) => group.tiles).find((tile) => tile.key === openKey) ?? null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "space-y-4",
-		children: [groups.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-			className: "text-xs text-foreground-subtle",
-			children: emptyMessage
-		}), groups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "mb-1.5 text-[10px] font-semibold uppercase tracking-wider text-foreground-subtle",
-			children: group.label
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "grid grid-cols-2 gap-2 sm:grid-cols-3",
-			children: group.tiles.map((tile) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-				type: "button",
-				"data-testid": tile.testId,
-				onClick: () => onPick(tile.key),
-				className: "flex flex-col items-center gap-1.5 rounded-lg border border-border bg-surface px-3 py-3 text-xs transition-colors hover:border-primary/50 hover:bg-surface-hover",
-				children: [tile.icon, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "text-center font-medium text-foreground",
-					children: tile.label
-				})]
-			}, tile.key))
-		})] }, group.id))]
+		children: [
+			groups.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-xs text-foreground-subtle",
+				children: emptyMessage
+			}),
+			groups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mb-1.5 text-[10px] font-semibold uppercase tracking-wider text-foreground-subtle",
+				children: group.label
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "grid grid-cols-2 gap-2 sm:grid-cols-3",
+				children: group.tiles.map((tile) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "relative",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						"data-testid": tile.testId,
+						onClick: () => onPick(tile.key),
+						className: "flex h-full w-full flex-col items-center gap-1.5 rounded-lg border border-border bg-surface px-3 py-3 text-xs transition-colors hover:border-primary/50 hover:bg-surface-hover",
+						children: [tile.icon, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-center font-medium text-foreground",
+							children: tile.label
+						})]
+					}), tile.detail !== void 0 && tile.detailLabel !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "absolute top-1 right-1",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconButton, {
+							type: "button",
+							variant: "ghost",
+							size: "sm",
+							icon: Info,
+							"aria-label": tile.detailLabel,
+							onClick: () => setOpenKey((current) => current === tile.key ? null : tile.key)
+						})
+					})]
+				}, tile.key))
+			})] }, group.id)),
+			openTile?.detail !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BottomSheet, {
+				open: true,
+				onClose: () => setOpenKey(null),
+				children: openTile.detail
+			})
+		]
 	});
 }
 //#endregion
@@ -66345,6 +67631,26 @@ function deviceGroupTitle(group, t = defaultUiText) {
 function isDeviceNoun(noun) {
 	return noun === "camera" || noun === "device";
 }
+/** Compact label for a device id. String ids (nodes, packages) keep the stored text. */
+function usePickerDeviceLabel(id, stored) {
+	const lookedUp = useDeviceLabelById(typeof id === "number" ? id : 0, "compact", stored);
+	return typeof id === "number" ? lookedUp : stored;
+}
+function PickerDeviceName({ id, stored, className }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className,
+		children: usePickerDeviceLabel(id, stored)
+	});
+}
+function PickerChip({ id, stored, removed, onRemove }) {
+	const label = usePickerDeviceLabel(id, stored);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectedChip, {
+		testId: `picker-chip-${String(id)}`,
+		label,
+		warning: removed,
+		...onRemove !== void 0 ? { onRemove } : {}
+	});
+}
 function chipsOf(value, devices, fleet, noun, t) {
 	const byId = new Map(devices.map((device) => [device.id, device.name]));
 	const orphans = new Map(offListSelections(value, devices, fleet.devices, fleet.state).map((row) => [row.id, row]));
@@ -66380,7 +67686,7 @@ function DevicePicker({ devices: devicesIn, listState, fleet, value, onChange, s
 	const t = useUiText();
 	const groupTitle = groupTitleProp ?? ((group) => deviceGroupTitle(group, t));
 	const lockedNote = lockedNoteProp ?? t("uiLibrary.devicePicker.alreadyAdded", "Already added");
-	const devices = (0, react$1.useMemo)(() => withResolvedParentDetail(devicesIn), [devicesIn]);
+	const devices = (0, react$1.useMemo)(() => isDeviceNoun(noun) ? devicesIn : withResolvedParentDetail(devicesIn), [devicesIn, noun]);
 	const judge = fleet ?? {
 		state: listState,
 		devices: listState === "answered" ? devices : void 0
@@ -66415,10 +67721,10 @@ function DevicePicker({ devices: devicesIn, listState, fleet, value, onChange, s
 					chips.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						className: "text-[11px] text-foreground-subtle",
 						children: emptyLabel ?? (emptyMeansAll ? t("uiLibrary.devicePicker.everyNoRestriction", "Every {{noun}} — no restriction", { noun: pickerNounLabel(noun, t) }) : t("uiLibrary.devicePicker.noneSelected", "None selected"))
-					}) : overflow.shown.map((chip) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectedChip, {
-						testId: `picker-chip-${String(chip.id)}`,
-						label: chip.label,
-						warning: chip.removed,
+					}) : overflow.shown.map((chip) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PickerChip, {
+						id: chip.id,
+						stored: chip.label,
+						removed: chip.removed,
 						...!disabled ? { onRemove: () => onChange(value.filter((id) => id !== chip.id)) } : {}
 					}, chip.id)),
 					overflow.hidden > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
@@ -66711,9 +68017,10 @@ function PickerRowView({ row, value, onChange, onToggleGroup, annotate, groupTit
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 			className: "flex min-w-0 flex-1 flex-col",
 			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "truncate",
-					children: row.device.name
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PickerDeviceName, {
+					id: row.device.id,
+					stored: row.device.name,
+					className: "truncate"
 				}),
 				second !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					className: "truncate text-[10px] text-foreground-subtle",
@@ -69804,10 +71111,14 @@ exports.DEVICE_COLUMNS = DEVICE_COLUMNS;
 exports.DEVICE_EXPORT_PAGE_SIZE_KEY = DEVICE_EXPORT_PAGE_SIZE_KEY;
 exports.DEVICE_LIST_PAGE_SIZE_KEY = DEVICE_LIST_PAGE_SIZE_KEY;
 exports.DEVICE_LIST_PAGE_SIZE_OPTIONS = DEVICE_LIST_PAGE_SIZE_OPTIONS;
+exports.DEVICE_NAME_FORMS = DEVICE_NAME_FORMS;
+exports.DEVICE_NAME_JOIN = DEVICE_NAME_JOIN;
 exports.DEVICE_PICKER_GROUP_STORAGE_KEY = DEVICE_PICKER_GROUP_STORAGE_KEY;
 exports.DEVICE_ROLE_META = DEVICE_ROLE_META;
+exports.DEVICE_ROLE_NOUNS = DEVICE_ROLE_NOUNS;
 exports.DEVICE_TYPE_CONTROL = DEVICE_TYPE_CONTROL;
 exports.DEVICE_TYPE_META = DEVICE_TYPE_META;
+exports.DEVICE_TYPE_NOUNS = DEVICE_TYPE_NOUNS;
 exports.DataRecordsHub = DataRecordsHub;
 exports.DataTable = DataTable;
 exports.DataTableFilterBar = DataTableFilterBar;
@@ -69824,11 +71135,14 @@ exports.DeviceContextProvider = DeviceContextProvider;
 exports.DeviceExportPanel = DeviceExportPanel;
 exports.DeviceExportSetup = DeviceExportSetup;
 exports.DeviceFilterBar = DeviceFilterBar;
+exports.DeviceFleetFromServer = DeviceFleetFromServer;
+exports.DeviceFleetProvider = DeviceFleetProvider;
 exports.DeviceGrid = DeviceGrid;
 exports.DeviceHistoryView = DeviceHistoryView;
 exports.DeviceItem = DeviceItem;
 exports.DeviceList = DeviceList;
 exports.DeviceMultiSelectField = DeviceMultiSelectField;
+exports.DeviceName = DeviceName;
 exports.DevicePicker = DevicePicker;
 exports.DeviceQuickDetailProvider = DeviceQuickDetailProvider;
 exports.DeviceSelectField = DeviceSelectField;
@@ -70257,6 +71571,7 @@ exports.ViewSwitch = ViewSwitch;
 exports.VodPlaybackProvider = VodPlaybackProvider;
 exports.Volume2 = Volume2;
 exports.VolumeX = VolumeX;
+exports.WashingMachine = WashingMachine;
 exports.WaterHeaterHeroCard = WaterHeaterHeroCard;
 exports.WaterHeaterInlineControl = WaterHeaterInlineControl;
 exports.Waves = Waves;
@@ -70359,6 +71674,7 @@ exports.describeDeviceSelector = describeDeviceSelector;
 exports.deviceIntegrationResolver = deviceIntegrationResolver;
 exports.deviceListStateOf = deviceListStateOf;
 exports.deviceMatchesFilter = deviceMatchesFilter;
+exports.deviceNameNouns = deviceNameNouns;
 exports.deviceOptionLabel = deviceOptionLabel;
 exports.deviceRoleMeta = deviceRoleMeta;
 exports.deviceRoleMetaOf = deviceRoleMetaOf;
@@ -70386,10 +71702,12 @@ exports.findTimezone = _camstack_types.findTimezone;
 exports.flattenPickerGrouping = flattenPickerGrouping;
 exports.flattenPickerRows = flattenPickerRows;
 exports.fleetViewOf = fleetViewOf;
+exports.foldDeviceName = foldDeviceName;
 exports.formatChartBytes = formatChartBytes;
 exports.formatChartNumber = formatChartNumber;
 exports.formatChartValue = formatChartValue;
 exports.formatControlDateTime = formatControlDateTime;
+exports.formatDeviceName = formatDeviceName;
 exports.formatLastSeen = formatLastSeen;
 exports.formatNumeric = formatNumeric;
 exports.formatSettingValue = formatSettingValue;
@@ -70417,6 +71735,7 @@ exports.humanizeName = humanizeName;
 exports.humidifierTint = humidifierTint;
 exports.iconGlyphsFailed = iconGlyphsFailed;
 exports.iconGlyphsLoaded = iconGlyphsLoaded;
+exports.indexDeviceNames = indexDeviceNames;
 exports.initialScrubState = initialScrubState;
 exports.insertAtSelection = insertAtSelection;
 exports.isAbsentProvider = isAbsentProvider;
@@ -70424,6 +71743,7 @@ exports.isAbsentProvider$1 = isAbsentProvider;
 exports.isByteUnit = isByteUnit;
 exports.isConsumableLevelField = isConsumableLevelField;
 exports.isDataTableFilterActive = isDataTableFilterActive;
+exports.isDeviceNameStock = isDeviceNameStock;
 Object.defineProperty(exports, "isDrawableSubjectPath", {
 	enumerable: true,
 	get: function() {
@@ -70465,6 +71785,7 @@ exports.nodeTextColorClass = nodeTextColorClass;
 exports.normalizeForSearch = normalizeForSearch;
 exports.normalizeLanguage = normalizeLanguage;
 exports.normalizeSelection = normalizeSelection;
+exports.nounSpecFor = nounSpecFor;
 exports.occupancyFacets = occupancyFacets;
 exports.occupancyLines = occupancyLines;
 exports.offListSelections = offListSelections;
@@ -70519,6 +71840,7 @@ exports.resolveContainerPrimary = resolveContainerPrimary;
 exports.resolveControlAlign = resolveControlAlign;
 exports.resolveDeviceControl = resolveDeviceControl;
 exports.resolveDeviceIntegration = resolveDeviceIntegration;
+exports.resolveDeviceLabel = resolveDeviceLabel;
 exports.resolveDisplayIcon = resolveDisplayIcon;
 exports.resolveEffectiveDefaultModel = resolveEffectiveDefaultModel;
 exports.resolveEffectiveStepModel = resolveEffectiveStepModel;
@@ -70537,6 +71859,7 @@ exports.rootSourceState = rootSourceState;
 exports.routerBasename = routerBasename;
 exports.runningDurationSince = runningDurationSince;
 exports.runningStatusParts = runningStatusParts;
+exports.sameDeviceName = sameDeviceName;
 exports.sameLocationSuggestions = sameLocationSuggestions;
 exports.scrubReducer = scrubReducer;
 exports.searchSteps = searchSteps;
@@ -70570,6 +71893,7 @@ exports.stepFieldDomId = stepFieldDomId;
 exports.stepHasModelForFormat = stepHasModelForFormat;
 exports.stepLocalFields = stepLocalFields;
 exports.stepModelOptions = stepModelOptions;
+exports.stripDeviceParentPrefix = stripDeviceParentPrefix;
 exports.stripParentNamePrefix = stripParentNamePrefix;
 Object.defineProperty(exports, "subjectPathSampleFromBox", {
 	enumerable: true,
@@ -70867,6 +72191,8 @@ exports.useDeviceHistoryRecord = useDeviceHistoryRecord;
 exports.useDeviceHistoryRecordBuckets = useDeviceHistoryRecordBuckets;
 exports.useDeviceHistorySetDeviceEnabled = useDeviceHistorySetDeviceEnabled;
 exports.useDeviceId = useDeviceId;
+exports.useDeviceLabel = useDeviceLabel;
+exports.useDeviceLabelById = useDeviceLabelById;
 exports.useDeviceListPageSize = useDeviceListPageSize;
 exports.useDeviceManagerAddLocation = useDeviceManagerAddLocation;
 exports.useDeviceManagerAdoptDevice = useDeviceManagerAdoptDevice;
@@ -70960,6 +72286,8 @@ exports.useDeviceManagerTestField = useDeviceManagerTestField;
 exports.useDeviceManagerUpdateConfig = useDeviceManagerUpdateConfig;
 exports.useDeviceManagerUpdateDeviceField = useDeviceManagerUpdateDeviceField;
 exports.useDeviceManagerUpdateDeviceFieldsBatch = useDeviceManagerUpdateDeviceFieldsBatch;
+exports.useDeviceNameIndex = useDeviceNameIndex;
+exports.useDeviceNameNouns = useDeviceNameNouns;
 exports.useDeviceNetworkLink = useDeviceNetworkLink;
 exports.useDeviceOpsGetConfigEntries = useDeviceOpsGetConfigEntries;
 exports.useDeviceOpsGetRawState = useDeviceOpsGetRawState;