@camstack/ui-library 0.1.57 → 0.1.58

package/dist/composites/device-controls/types.d.ts

@@ -0,0 +1,17 @@
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+/** Shared props for every control panel. `layout` selects the compact (row
+ *  popover) vs full (detail tab) presentation. `features` gates sub-controls
+ *  (e.g. cover position/tilt, fan speed/preset). */
+export interface ControlPanelProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly deviceId: number;
+    readonly features: readonly string[] | undefined;
+    readonly layout: 'compact' | 'full';
+    /** Enable optimistic UI mode (default: true). Set to false to disable. */
+    readonly optimistic?: boolean;
+}
+/** Cap names whose presence (bound on a device) means it has a control surface.
+ *  Single source of truth shared by the row registry and the detail Controls tab
+ *  so the two never drift. */
+export declare const CONTROL_CAP_NAMES: readonly ["cover", "lock-control", "switch", "brightness", "fan-control", "climate-control", "media-player", "control"];
+export type ControlCapName = (typeof CONTROL_CAP_NAMES)[number];

package/dist/composites/device-controls/update-control.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { DeviceControlProps } from './control-registry';
+/**
+ * UpdateInlineControl — compact firmware state for a device-list row.
+ */
+export declare function UpdateInlineControl({ trpc, deviceId }: DeviceControlProps): ReactNode;
+/**
+ * UpdateHeroCard — version transition + Install action for the device-detail
+ * hero area.
+ */
+export declare function UpdateHeroCard({ trpc, deviceId }: DeviceControlProps): ReactNode;

package/dist/composites/device-controls/vacuum-control.d.ts

@@ -0,0 +1,36 @@
+import { ReactNode } from 'react';
+import { VacuumState, TankStatus } from '@camstack/types';
+import { DeviceControlProps } from './control-registry';
+export interface VacuumStateMeta {
+    readonly label: string;
+    /** Tailwind text-colour token for the state label. */
+    readonly tone: string;
+}
+/**
+ * Pure helper — maps a VacuumState (or undefined when no slice yet) to a
+ * human label + colour tone. Exhaustive switch: a new enum member fails
+ * the build.
+ */
+export declare function vacuumStateMeta(state: VacuumState | undefined): VacuumStateMeta;
+/** The four intrinsic tanks a vacuum cap can expose. */
+export type TankKind = 'cleanWater' | 'dirtyWater' | 'detergent' | 'dustBin';
+export type TankAlert = 'ok' | 'warning';
+/**
+ * Pure helper — classifies a tank as `ok` or `warning`.
+ *
+ * Clean-water + detergent are "supply" tanks: low is bad. Dirty-water +
+ * dust-bin are "waste" tanks: full is bad. Prefers the numeric `level`
+ * (thresholds 15 / 85), falling back to the discrete `status` flag. Both
+ * unknown → `ok`. Exhaustive over TankKind.
+ */
+export declare function tankAlert(kind: TankKind, tank: TankStatus): TankAlert;
+/**
+ * VacuumInlineControl — compact, state-aware vacuum controls for a
+ * device-list row. Start / Pause / Return-to-base + battery badge.
+ */
+export declare function VacuumInlineControl({ trpc, deviceId }: DeviceControlProps): ReactNode;
+/**
+ * VacuumHeroCard — full control surface for the device-detail hero area.
+ * State label + action buttons + fan-speed selector + battery readout.
+ */
+export declare function VacuumHeroCard({ trpc, deviceId }: DeviceControlProps): ReactNode;

package/dist/composites/device-controls/valve-control.d.ts

@@ -0,0 +1,46 @@
+import { ReactNode } from 'react';
+import { ValveState } from '@camstack/types';
+import { DeviceControlProps } from './control-registry';
+export interface ValveStateMeta {
+    readonly label: string;
+    /** Tailwind text-colour token for the state label. */
+    readonly tone: string;
+}
+/**
+ * Pure helper — maps a ValveState (or undefined when no slice yet) to a
+ * human label + colour tone. Exhaustive switch: a new enum member fails
+ * the build.
+ */
+export declare function valveStateMeta(state: ValveState | undefined): ValveStateMeta;
+/**
+ * ValveInlineControl — compact, state-aware valve controls for a
+ * device-list row. Open ▲ Stop ■ Close ▼ + optional position % badge.
+ * Mirrors `CoverInlineControl` exactly. Must NOT blow out the row width.
+ */
+export declare function ValveInlineControl({ trpc, deviceId, optimistic }: DeviceControlProps): ReactNode;
+/** Per-state visual tint tokens for the framed valve graphic. */
+export interface ValveGraphicTint {
+    /** Tailwind class for the flow-glow wash over the pipe. */
+    readonly glow: string;
+    /** Tailwind text token driving the valve body via currentColor. */
+    readonly accent: string;
+    /** Whether to render the animated flow dashes (open / opening). */
+    readonly flowing: boolean;
+    /** Whether to render the transient-motion activity pulse. */
+    readonly active: boolean;
+}
+export declare function valveGraphicTint(state: ValveState | undefined): ValveGraphicTint;
+/**
+ * ValveHeroCard — full control surface for the device-detail hero area.
+ *
+ * Bespoke pipe + gate-valve graphic (drag surface when positionable) +
+ * a large position % (or capitalized state when position is null) +
+ * Open / Stop / Close hero buttons + a position slider gated on
+ * `ValvePositionable` (additive to drag), and a read-only range when a
+ * position is reported but not settable.
+ *
+ * Position support is detected via `ValveStatus.position !== null`; the
+ * interactive setPosition surface is gated on `DeviceFeature.ValvePositionable`.
+ * Only hides when the device truly has no valve cap.
+ */
+export declare function ValveHeroCard({ trpc, deviceId, features, optimistic }: DeviceControlProps): ReactNode;

package/dist/composites/device-controls/water-heater-control.d.ts

@@ -0,0 +1,41 @@
+import { ReactNode } from 'react';
+import { DeviceControlProps } from './control-registry';
+/** Heating phase derived from the slice — drives the tank tint + element glow. */
+export type WaterHeaterPhase = 'heating' | 'idle' | 'off';
+export interface WaterHeaterTint {
+    /** Tailwind class for the wash behind the tank. */
+    readonly glow: string;
+    /** Tailwind text token driving the tank via currentColor. */
+    readonly accent: string;
+    /** Whether to render the heating-element glow. */
+    readonly heating: boolean;
+}
+/**
+ * Pure helper — maps a phase to a tint. Exhaustive over WaterHeaterPhase
+ * (a new member fails the build).
+ *
+ *   heating → warning (element glow)
+ *   idle    → primary (warm but settled)
+ *   off     → muted
+ */
+export declare function waterHeaterTint(phase: WaterHeaterPhase): WaterHeaterTint;
+/**
+ * Heuristic heating phase: off when the operation mode is 'off' (or null);
+ * heating when current < target (actively warming); otherwise idle.
+ */
+export declare function waterHeaterPhase(operationMode: string | null, currentTemp: number | null, targetTemp: number | null): WaterHeaterPhase;
+/**
+ * WaterHeaterInlineControl — compact current→target readout + mode hint
+ * for a device-list row. Must NOT blow out the row width.
+ */
+export declare function WaterHeaterInlineControl({ trpc, deviceId, optimistic }: DeviceControlProps): ReactNode;
+/**
+ * WaterHeaterHeroCard — full control surface for the device-detail hero.
+ *
+ * Bespoke tank graphic + a large current-temp readout + a target-temp
+ * stepper (clamped to min/maxTemp) + an operation-mode `<select>` + an
+ * "Away" toggle (only when `away !== null`) + the current-temp readout.
+ * Gated on `available`. Only hides when the device truly has no
+ * water-heater cap.
+ */
+export declare function WaterHeaterHeroCard({ trpc, deviceId, optimistic }: DeviceControlProps): ReactNode;

package/dist/composites/device-controls/weather-control.d.ts

@@ -0,0 +1,41 @@
+import { ReactNode } from 'react';
+import { DeviceControlProps } from './control-registry';
+/** Which sky glyph a condition maps to. Drives both the inline icon and
+ *  the hero scene's graphic branch. */
+export type WeatherGlyph = 'sun' | 'clear-night' | 'partly-cloudy' | 'cloudy' | 'rain' | 'snow' | 'lightning' | 'fog' | 'wind' | 'hail';
+export interface WeatherConditionMeta {
+    /** Human-readable label for the condition. */
+    readonly label: string;
+    /** Which glyph to render. */
+    readonly glyph: WeatherGlyph;
+}
+export interface WeatherTint {
+    /** Tailwind class for the wash behind the scene. */
+    readonly glow: string;
+    /** Tailwind text token driving the scene glyph via currentColor. */
+    readonly accent: string;
+}
+/**
+ * Pure helper — maps a verbatim HA condition string to a label + glyph.
+ * Covers the known HA `weather.*` condition set; an unknown / null
+ * condition falls back to a neutral cloud.
+ */
+export declare function weatherConditionMeta(condition: string | null): WeatherConditionMeta;
+/**
+ * Pure helper — maps a verbatim HA condition string to a tint. Exhaustive
+ * over the known condition set with a neutral default.
+ */
+export declare function weatherTint(condition: string | null): WeatherTint;
+/**
+ * WeatherInlineControl — compact condition icon + temperature readout
+ * for a device-list row. Read-only; must NOT blow out the row width.
+ */
+export declare function WeatherInlineControl({ trpc, deviceId }: DeviceControlProps): ReactNode;
+/**
+ * WeatherHeroCard — read-only weather panel for the device-detail hero.
+ *
+ * Bespoke state-tinted sky scene + a large temperature readout +
+ * humidity / wind-speed (with a bearing arrow) / pressure readouts.
+ * Pure — no controls (the cap is read-only).
+ */
+export declare function WeatherHeroCard({ trpc, deviceId }: DeviceControlProps): ReactNode;

package/dist/composites/device-item/actions.d.ts

@@ -1,9 +1,20 @@
 import { ReactNode } from 'react';
 import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { ControlPlacement } from '../device-controls/control-registry';
 import { DeviceItemDevice, VariantDefaults } from './helpers';
 export interface DeviceItemActionsProps {
     readonly trpc: UseDeviceProxyTrpc;
     readonly device: DeviceItemDevice;
     readonly flags: VariantDefaults;
+    /**
+     * Where the control sits and whether the column carries the fixed `w-[140px]`
+     * box. `'right'` (default) → flush right in the fixed column, for card /
+     * minimal views. `'center'` → centered in the fixed column. `'table'` → the
+     * column sizes to its content (no fixed width) so a wide control lays out in
+     * sequence with the trailing trash + status dot without overflowing/colliding
+     * — used by the main devices table. FILL controls stretch to the fixed column
+     * width under `'right'`/`'center'`; under `'table'` they take natural width.
+     */
+    readonly controlPlacement?: ControlPlacement;
 }
-export declare function DeviceItemActions({ trpc, device, flags }: DeviceItemActionsProps): ReactNode;
+export declare function DeviceItemActions({ trpc, device, controlPlacement }: DeviceItemActionsProps): ReactNode;

package/dist/composites/device-item/child-layout.d.ts

@@ -0,0 +1,32 @@
+import { ChildLayout } from '@camstack/types';
+import { DeviceItemDevice } from './helpers';
+export interface ChildLayoutSection {
+    readonly title: string;
+    readonly children: readonly DeviceItemDevice[];
+    /** Whether the section renders open by default. `false` when any matched
+     *  layout entry for this section declared `collapsed: true`. */
+    readonly defaultOpen: boolean;
+    /** When `true`, the section's children render visually de-emphasized
+     *  (muted). Set only on the synthetic "Disabled" section. */
+    readonly muted?: boolean;
+}
+export interface GroupedChildren {
+    /** Sections ordered by first appearance in `childLayout`. */
+    readonly sections: readonly ChildLayoutSection[];
+    /** Children not referenced by any layout entry — render plainly, as today. */
+    readonly ungrouped: readonly DeviceItemDevice[];
+    /** Trailing synthetic section gathering every child whose CamStack-side
+     *  `disabled` flag is set. Kept SEPARATE from `sections`/`ungrouped` so
+     *  consumers render it LAST (after provider sections + ungrouped) and
+     *  muted. Undefined when no child is disabled. Generic — driven purely by
+     *  `child.disabled`, no provider/HA-specific input. */
+    readonly disabledSection?: ChildLayoutSection;
+}
+/**
+ * Partition a parent's children into provider-declared accordion sections +
+ * the remaining (ungrouped) children. A child matches an entry when
+ * `child.stableId === ${parentStableId}-${entry.childKey}`. Within a section,
+ * children sort by `order ?? Number.MAX_SAFE_INTEGER` then by name. Sections
+ * appear in first-seen order across `childLayout`. Pure — no I/O.
+ */
+export declare function groupChildrenByLayout(parentStableId: string, children: readonly DeviceItemDevice[], childLayout: ChildLayout | undefined): GroupedChildren;

package/dist/composites/device-item/child-section-accordion.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+interface ChildSectionAccordionProps {
+    readonly title: string;
+    readonly count: number;
+    readonly children: ReactNode;
+    readonly defaultOpen?: boolean;
+}
+export declare function ChildSectionAccordion({ title, count, children, defaultOpen, }: ChildSectionAccordionProps): ReactNode;
+export {};

package/dist/composites/device-item/container-children-context.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { DeviceItemDevice } from './helpers';
+export interface ContainerChildrenProviderProps {
+    /** `parentDeviceId → that parent's children`. Built once by the list. */
+    readonly value: ReadonlyMap<number, readonly DeviceItemDevice[]>;
+    readonly children: ReactNode;
+}
+export declare function ContainerChildrenProvider({ value, children, }: ContainerChildrenProviderProps): ReactNode;
+/**
+ * The children of `deviceId` as published by the nearest
+ * `ContainerChildrenProvider`. Returns a stable empty array when there is no
+ * provider or the device has no children — so a non-container row, or a row
+ * rendered outside a list, degrades exactly like the old optional prop.
+ */
+export declare function useContainerChildren(deviceId: number): readonly DeviceItemDevice[];

package/dist/composites/device-item/device-delete-action.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { DeviceItemDevice } from './helpers';
+export interface DeviceDeleteActionProps {
+    readonly device: DeviceItemDevice;
+    /** Called only after the operator confirms the destructive delete. */
+    readonly onDelete: (device: DeviceItemDevice) => void;
+}
+export declare function DeviceDeleteAction({ device, onDelete }: DeviceDeleteActionProps): ReactNode;

package/dist/composites/device-item/header.d.ts

@@ -10,5 +10,12 @@ export interface DeviceItemHeaderProps {
     readonly expanded: boolean;
     readonly onToggleExpand: () => void;
     readonly onNavigateToParent: (id: number) => void;
+    /**
+     * Vertical-card layout. When true, the name is rendered as the card's
+     * primary anchor: bigger font, heavier weight, line-clamp-2 instead of
+     * single-line truncation, and the inline integrationIcon flips above
+     * the name as a small lead-line so the name's full width is name-only.
+     */
+    readonly stacked?: boolean;
 }
-export declare function DeviceItemHeader({ device, variant, flags, parent, integrationIcon, hasChildren, expanded, onToggleExpand, onNavigateToParent, }: DeviceItemHeaderProps): ReactNode;
+export declare function DeviceItemHeader({ device, variant, flags, parent, integrationIcon, hasChildren, expanded, onToggleExpand, onNavigateToParent, stacked, }: DeviceItemHeaderProps): ReactNode;

package/dist/composites/device-item/helpers.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 import { LucideIcon } from 'lucide-react';
+import { SourceInfo, ChildLayout } from '@camstack/types';
 import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
 /**
  * Mirror of the canonical `DeviceInfo` wire shape (see
@@ -26,6 +27,40 @@ export interface DeviceItemDevice {
     readonly features?: readonly string[];
     /** True for ICameraDevice instances — gates snapshot popover. */
     readonly isCamera?: boolean;
+    /** Upstream-system identity (dispatch key + system tag + optional uniqueId).
+     *  Flows from `DeviceInfo.sourceInfo` via structural cast / parse;
+     *  optional so rows from providers that pre-date SourceInfo still work.
+     *  Does NOT carry rendering hints (unit, precision) — those live in the
+     *  cap STATUS SLICE for generic numeric-sensor, or are canonical constants
+     *  in ROLE_DESCRIPTOR for typed sensor roles. */
+    readonly sourceInfo?: SourceInfo;
+    /** Soft-link to another device id. For a CONTAINER device this is the
+     *  LEGACY picker-chosen primary child (numeric id); the row/hero resolve the
+     *  primary child via `resolveContainerPrimary(children, linkDeviceId)`.
+     *  Nullable: an explicit null means "no override → priority default".
+     *  Mirrors `DeviceInfo.linkDeviceId` so the wire row passes through. */
+    readonly linkDeviceId?: number | null;
+    /** Durable primary-child override for a CONTAINER device, keyed on the
+     *  chosen child's re-sync/rename-stable `entityId`. Preferred over the
+     *  numeric `linkDeviceId` in `resolveContainerPrimary` (survives a re-sync
+     *  that reallocates the child's numeric id). Mirrors
+     *  `DeviceInfo.primaryChildEntityId`. */
+    readonly primaryChildEntityId?: string | null;
+    /** Container-level layout hint: assigns specific accessory children to named
+     *  accordion sections (with optional intra-section order). Each entry's
+     *  `childKey` is the child's re-sync-stable accessory `stableIdSuffix`; a child
+     *  matches when `child.stableId === ${this.stableId}-${childKey}`. Mirrors
+     *  `DeviceInfo.childLayout` so the wire row passes through. Absent ⇒ no layout
+     *  declared (all children render in the plain list). Consumed by
+     *  `groupChildrenByLayout` for the device-detail list + the table row
+     *  expansion. */
+    readonly childLayout?: ChildLayout;
+    /** Hardware + identity blob (manufacturer / model / firmware / sn / uid /
+     *  mac / …). Driver-populated; keys are free-form and values arbitrary, so
+     *  consumers MUST treat them defensively (string-coerce for display, skip
+     *  non-string/empty). Mirrors `DeviceInfo.metadata` so the wire row passes
+     *  through unchanged. Absent/null ⇒ no identity info advertised. */
+    readonly metadata?: Readonly<Record<string, unknown>> | null;
 }
 export interface DeviceItemParent {
     readonly id: number;
@@ -105,6 +140,47 @@ export interface DeviceItemProps {
      * so every existing call site renders unchanged.
      */
     readonly renderRowAction?: (device: DeviceItemDevice) => ReactNode;
+    /**
+     * Built-in confirmed delete (TABLE feature). When provided, the merged
+     * previewActions cell renders a red trash button that opens the shared
+     * centered confirm dialog and calls `onDelete(device)` only on confirm.
+     * Cap/feature-agnostic — delete is generic. Context gating is "consumer
+     * passes the handler or not": omitted ⇒ no trash, zero layout change.
+     * No effect on `view='card'` (card delete is a deliberate follow-up).
+     */
+    readonly onDelete?: (device: DeviceItemDevice) => void;
+    /**
+     * When provided, renders a leading checkbox for row selection.
+     * Only passed to top-level rows (accessory sub-rows omit it).
+     * Omitted ⇒ no checkbox, zero layout change for existing callers.
+     */
+    readonly selection?: {
+        readonly selected: boolean;
+        readonly onToggle: () => void;
+    };
+    /**
+     * When `true` (and `selection` is provided), a click anywhere on the
+     * row's primary body toggles selection instead of navigating — the
+     * batch-mode interaction (spec §6). The row also gains an accessible
+     * pressed affordance (`role="button"` + `aria-pressed`). When omitted
+     * or `false`, the row navigates on click as usual; the leading
+     * checkbox remains the only selection surface. The checkbox always
+     * toggles regardless of this flag (and never bubbles to navigate).
+     */
+    readonly rowClickSelects?: boolean;
+    /**
+     * Table-view column gates (context-configured). Default `true` so every
+     * existing call site renders all cells. When `false`, the corresponding
+     * `<td>` is omitted entirely (the matching `<th>` is gated in the parent
+     * `TableLayout`, so header + cells stay in lock-step). No effect on
+     * `view='card'`.
+     */
+    readonly showTypeCell?: boolean;
+    /** Render the Hardware (manufacturer/model) `<td>` (context-gated). Default
+     *  `true` so existing call sites render it; the parent `TableLayout` gates the
+     *  matching `<th>` so header + cell stay in lock-step. No effect on `'card'`. */
+    readonly showManufacturerCell?: boolean;
+    readonly showFeaturesCell?: boolean;
 }
 export interface VariantDefaults {
     readonly showIntegrationIcon: boolean;
@@ -117,8 +193,6 @@ export interface VariantDefaults {
     readonly showChildrenAccordion: boolean;
 }
 export declare function resolveFlags(props: DeviceItemProps): VariantDefaults;
-export declare const ROLE_ICONS: Readonly<Record<string, LucideIcon>>;
-export declare const TYPE_ICONS: Readonly<Record<string, LucideIcon>>;
 export declare function deviceLeadIcon(device: DeviceItemDevice): LucideIcon;
 /**
  * Icon for each `DeviceFeature` advertised on a device row. Used by
@@ -153,4 +227,36 @@ export declare const FEATURE_TO_CAP_NAME: Readonly<Record<string, string>>;
 export declare function maySupportSwitch(device: DeviceItemDevice): boolean;
 export declare function isAccessoryChild(device: DeviceItemDevice): boolean;
 export declare function hasMotionTriggerFeature(device: DeviceItemDevice): boolean;
+/**
+ * Effective online state for a device row's status dot.
+ *
+ * A CONTAINER device renders AS its PRIMARY child (same row control via
+ * `ContainerPrimaryInline`, same hero via `ContainerPrimaryHero`). Its
+ * reachability dot should therefore follow that primary child's `online`,
+ * NOT "any child online" — so the dot and the control gate agree (the
+ * control is bound to the same primary child via `resolveContainerPrimary`).
+ *
+ * Resolution reuses the SAME `resolveContainerPrimary(children, linkDeviceId)`
+ * helper the row control uses, then reads the resolved child row's `online`.
+ * Degrades gracefully: a non-container, a container with no children, or a
+ * container with no resolvable primary child falls back to `device.online`
+ * (never crashes, never forces offline).
+ */
+export declare function effectiveOnline(device: DeviceItemDevice, containerChildren: readonly DeviceItemDevice[] | undefined): boolean;
+/**
+ * The type a CONTAINER should DISPLAY as (and be FILTERED by): its primary
+ * child's type, since a container renders as that child (a vacuum container
+ * should read + filter as `vacuum`, not the structural `container`). Mirrors
+ * {@link effectiveOnline} — same primary-child resolution. Non-containers, and
+ * containers with no resolvable primary child, fall back to `device.type`.
+ */
+export declare function effectiveType(device: DeviceItemDevice, containerChildren: readonly DeviceItemDevice[] | undefined): string;
+/**
+ * The device whose lead ICON a row should display: a Container shows its
+ * primary CHILD's icon (the child's type + role drive the glyph, e.g. a vacuum
+ * rather than the generic container box). Mirrors {@link effectiveType}, but
+ * returns the resolved device so {@link deviceLeadIcon} also picks up the
+ * child's role. Falls back to the device itself for non-containers / no primary.
+ */
+export declare function effectiveIconDevice(device: DeviceItemDevice, containerChildren: readonly DeviceItemDevice[] | undefined): DeviceItemDevice;
 export declare function shortStableId(stableId: string): string;

package/dist/composites/device-item/index.d.ts

@@ -2,4 +2,8 @@ import { ReactNode } from 'react';
 import { DeviceItemProps } from './helpers';
 export type { DeviceItemDevice, DeviceItemParent, DeviceItemKind, DeviceItemVariant, DeviceItemView, DeviceItemProps, } from './helpers';
 export { deriveDeviceKind } from './helpers';
+export { ChildSectionAccordion } from './child-section-accordion';
+export { ContainerChildrenProvider, useContainerChildren } from './container-children-context';
+export { groupChildrenByLayout } from './child-layout';
+export type { GroupedChildren, ChildLayoutSection } from './child-layout';
 export declare function DeviceItem(props: DeviceItemProps): ReactNode;

package/dist/composites/device-item/preview.d.ts

@@ -6,7 +6,7 @@ export interface DeviceItemPreviewProps {
     readonly device: DeviceItemDevice;
     readonly status: 'online' | 'offline' | 'disabled';
     /**
-     * Render gate for the snapshot eye icon (typically
+     * Render gate for the snapshot thumbnail (typically
      * `flags.showSnapshot && isCamera` from the orchestrator). Even when
      * `false`, the component still renders the status-pills row when
      * `showStatusPills` is on.
@@ -14,8 +14,8 @@ export interface DeviceItemPreviewProps {
     readonly enabled: boolean;
     /**
      * When true, render the battery / charging / sleeping pills next to
-     * the snapshot eye. Driven by table view (where the Preview cell is
-     * the natural home for status indicators); off in card view to keep
+     * the snapshot thumbnail. Driven by table view (where the Preview cell
+     * is the natural home for status indicators); off in card view to keep
      * the row narrow.
      */
     readonly showStatusPills?: boolean;

package/dist/composites/device-item/reboot-quick-action.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+export interface RebootQuickActionProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly deviceId: number;
+    /** Device display name — woven into the confirm-modal body. */
+    readonly deviceName: string;
+}
+export declare function RebootQuickAction({ trpc, deviceId, deviceName }: RebootQuickActionProps): ReactNode;

package/dist/composites/device-item/status-dot.d.ts

@@ -1,5 +1,8 @@
 import { ReactNode } from 'react';
 export interface StatusDotProps {
     readonly status: 'online' | 'offline' | 'disabled';
+    /** Ms epoch of the last online→offline transition. Only used to enrich
+     *  the tooltip when `status === 'offline'`. */
+    readonly lastChangedAt?: number | null;
 }
-export declare function StatusDot({ status }: StatusDotProps): ReactNode;
+export declare function StatusDot({ status, lastChangedAt }: StatusDotProps): ReactNode;

package/dist/composites/device-list/batch-actions-bar.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export interface DeviceBatchActionsBarProps {
+    readonly selectedIds: ReadonlySet<number>;
+    readonly onClear: () => void;
+    readonly remove: (input: {
+        deviceId: number;
+    }) => void;
+    readonly disable: (input: {
+        deviceId: number;
+    }) => void;
+    readonly enable: (input: {
+        deviceId: number;
+    }) => void;
+}
+export declare function DeviceBatchActionsBar(props: DeviceBatchActionsBarProps): ReactNode;

package/dist/composites/device-list/batch-toolbar.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export interface DeviceBatchToolbarProps {
+    readonly selectedIds: ReadonlySet<number>;
+    readonly onClear: () => void;
+    readonly remove: (input: {
+        deviceId: number;
+    }) => void;
+    readonly disable: (input: {
+        deviceId: number;
+    }) => void;
+    readonly enable: (input: {
+        deviceId: number;
+    }) => void;
+}
+export declare function DeviceBatchToolbar({ selectedIds, onClear, remove, disable, enable, }: DeviceBatchToolbarProps): ReactNode;

package/dist/composites/device-list/cards-layout.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice, DeviceItemParent } from '../device-item/helpers';
+export interface CardsLayoutProps {
+    readonly rows: readonly DeviceItemDevice[];
+    readonly accessoriesByParent: ReadonlyMap<number, readonly DeviceItemDevice[]>;
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly resolveIntegrationIcon: ((addonId: string) => ReactNode | null) | null;
+    readonly resolveParent: ((parentId: number) => DeviceItemParent | null) | null;
+    readonly onNavigate: ((deviceId: number) => void) | null;
+    readonly renderRowAction: ((device: DeviceItemDevice) => ReactNode) | null;
+    readonly selectable: boolean;
+    /** Batch mode active — a row click toggles selection instead of navigating. */
+    readonly rowClickSelects: boolean;
+    readonly activeSelected: ReadonlySet<number>;
+    readonly onToggleSelection: (id: number) => void;
+}
+export declare function CardsLayout({ rows, accessoriesByParent, trpc, resolveIntegrationIcon, resolveParent, onNavigate, renderRowAction, selectable, rowClickSelects, activeSelected, onToggleSelection, }: CardsLayoutProps): ReactNode;

package/dist/composites/device-list/columns.d.ts

@@ -0,0 +1,68 @@
+/**
+ * Device-mode column model: a fixed catalog, a per-context subset matrix,
+ * a responsive priority, and a priority-derived breakpoint mapping. Each
+ * consumer declares its `TableContext`; the table renders only the columns
+ * that context enables, in catalog order, hiding the optional ones as the
+ * viewport narrows.
+ *
+ * The catalog is intentionally device-mode only. Generic-mode (integration
+ * rows) keeps its own `DeviceListColumn[]` defs — reconciled in a later phase.
+ *
+ * ── Responsive convention (single source of truth) ────────────────────────
+ *   LOWER priority number = MORE important = hidden at a NARROWER width (kept
+ *   longest). So as the viewport shrinks the HIGHEST-priority-number column
+ *   drops first.
+ *
+ *     name           (0) — never hidden; sticky left, always visible
+ *     previewActions (1) — never hidden; carries the live control + status dot
+ *     icon           (2) — integration badge; rendered INSIDE the name cell,
+ *                          not a standalone column, so it has no breakpoint
+ *     features       (3) — optional; hidden below `md` (kept longer)
+ *     type           (4) — optional; hidden below `lg`
+ *     manufacturer   (5) — optional; hidden below `xl` (drops FIRST,
+ *                          wide-screen-only hardware/identity column)
+ *
+ *   `COLUMN_BREAKPOINT_CLASS` derives ONE Tailwind visibility class per id and
+ *   is the single source used by BOTH the `<th>` and the `<td>`, so a hidden
+ *   column folds header + cell in lock-step. The drop order is therefore:
+ *   `manufacturer` first (below `xl`), then `type` (below `lg`), then
+ *   `features` (below `md`) — matching the priority numbers above.
+ */
+/** Fixed device-mode column catalog, in render order. `name` is always first.
+ *  `manufacturer` sits after `type` — a wide-screen-only hardware/identity
+ *  column (manufacturer · model, full metadata in a tooltip). */
+export declare const DEVICE_COLUMNS: readonly ["name", "icon", "type", "manufacturer", "features", "previewActions"];
+export type DeviceColumnId = (typeof DEVICE_COLUMNS)[number];
+/**
+ * The places a device table is rendered; each declares its column subset.
+ *
+ * Device-detail CHILDREN are deliberately NOT a table context: they render as
+ * a stack of `<DeviceItem variant="minimal">` cards (see `ChildrenList`), not
+ * through this table, so no `device-children` context exists.
+ */
+export type TableContext = 'devices' | 'integration-detail';
+export declare function columnsForContext(ctx: TableContext): readonly DeviceColumnId[];
+/**
+ * Lower number = higher priority (kept longest as width shrinks). `name` = 0
+ * (sticky, never dropped); `previewActions` = 1 (always visible). The optional
+ * columns drop in REVERSE priority order as width shrinks — highest number
+ * (`type`) hides first, then `features`. `icon` is a name-cell badge, not a
+ * standalone column. See `COLUMN_BREAKPOINT_CLASS` for the derived classes.
+ */
+export declare const COLUMN_PRIORITY: Record<DeviceColumnId, number>;
+/**
+ * Priority-derived Tailwind visibility class per column. Used by BOTH the
+ * `<th>` and the `<td>` (single source → header + cell stay in lock-step).
+ *
+ *   - `name` / `previewActions`: empty string — never hidden (always visible).
+ *   - `icon`: empty string — rendered inside the name cell, no standalone cell.
+ *   - `features`: `hidden md:table-cell` — visible from `md` up (kept longer).
+ *   - `type`: `hidden lg:table-cell` — visible only from `lg` up.
+ *   - `manufacturer`: `hidden xl:table-cell` — visible only from `xl` up (drops
+ *     first).
+ *
+ * Drop order as the viewport narrows therefore follows the priority numbers:
+ * `manufacturer` (5) disappears below `xl`, then `type` (4) below `lg`, then
+ * `features` (3) below `md`.
+ */
+export declare const COLUMN_BREAKPOINT_CLASS: Record<DeviceColumnId, string>;