@camstack/ui-library 0.1.38 → 0.1.40

package/dist/composites/detection-colors.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Detection class colors — single source of truth.
+ *
+ * Used by: DetectionCanvas (UI), result-annotator (server-side SVG),
+ * admin-ui event viewer, and any other place that visualizes detections.
+ */
+/** Fixed colors for known detection classes */
+export declare const CLASS_COLORS: Readonly<Record<string, string>>;
+/** Primary/default color when nothing else matches */
+export declare const DEFAULT_COLOR = "#f59e42";
+/**
+ * Get the color for a detection class name.
+ * Returns a fixed color for known classes, or a deterministic hash-based color for unknown ones.
+ */
+export declare function getClassColor(className: string, customColors?: Readonly<Record<string, string>>): string;

package/dist/composites/detection-overlay.d.ts

@@ -0,0 +1,9 @@
+import { DeviceDetections } from '../hooks/use-device-detections';
+export interface DetectionOverlayProps {
+    readonly detections: DeviceDetections;
+    readonly showMotionZones?: boolean;
+    readonly showMotionRaw?: boolean;
+    readonly showDetections?: boolean;
+    readonly showPhaseIndicator?: boolean;
+}
+export declare function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones, showMotionRaw, showDetections, showPhaseIndicator, }: DetectionOverlayProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/composites/detection-result-tree.d.ts

@@ -0,0 +1,11 @@
+import { ObjectDetection } from '@camstack/types';
+export interface DetectionResultTreeProps {
+    readonly detections: readonly ObjectDetection[];
+    readonly classColors?: Readonly<Record<string, string>>;
+    readonly className?: string;
+    /** Set of detection ids that are hidden */
+    readonly hiddenKeys?: ReadonlySet<string>;
+    /** Callback when a detection's visibility is toggled */
+    readonly onToggleVisibility?: (key: string, visible: boolean) => void;
+}
+export declare function DetectionResultTree({ detections, classColors, className, hiddenKeys, onToggleVisibility, }: DetectionResultTreeProps): import("react/jsx-runtime").JSX.Element;

package/dist/composites/dev-shell.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { TRPCClient } from '@trpc/client';
+import { AppRouter } from '@camstack/types';
+import { UseThemeModeReturn } from '../theme/types';
+export interface DevShellProps {
+    children: (props: {
+        trpc: TRPCClient<AppRouter>;
+        theme: UseThemeModeReturn;
+    }) => ReactNode;
+    serverUrl?: string;
+    title?: string;
+}
+interface DevShellContextValue {
+    trpc: TRPCClient<AppRouter>;
+    token: string;
+    logout: () => void;
+}
+export declare function useDevShell(): DevShellContextValue;
+export declare function DevShell({ children, serverUrl, title, }: DevShellProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/composites/device-activity-panel.d.ts

@@ -0,0 +1,29 @@
+export interface DeviceActivityPanelProps {
+    readonly deviceId: number;
+    /** Initial event categories the user wants tracked. Defaults to "all". */
+    readonly defaultEventCategories?: readonly string[];
+    /** Initial state-cap whitelist. Empty = show every cap that fires. */
+    readonly defaultStateCaps?: readonly string[];
+    /** Tab to show first. */
+    readonly initialTab?: ActivityTabId;
+    /** CSS class for the panel root. */
+    readonly className?: string;
+    /** Max content height (passed to the active stream). */
+    readonly maxHeight?: string;
+}
+declare const TABS: readonly [{
+    readonly id: "logs";
+    readonly label: "Logs";
+    readonly icon: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
+}, {
+    readonly id: "events";
+    readonly label: "Events";
+    readonly icon: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
+}, {
+    readonly id: "state";
+    readonly label: "State";
+    readonly icon: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
+}];
+export type ActivityTabId = (typeof TABS)[number]['id'];
+export declare function DeviceActivityPanel({ deviceId, defaultEventCategories, defaultStateCaps, initialTab, className, maxHeight, }: DeviceActivityPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/composites/device-card.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+export interface DeviceCardBadge {
+    /** Badge label text */
+    label: string;
+    /** Optional icon rendered before the label */
+    icon?: ReactNode;
+    /** Click handler — makes the badge interactive */
+    onClick?: () => void;
+}
+export interface DeviceCardAction {
+    /** Icon to render */
+    icon: ReactNode;
+    /** Tooltip / aria-label */
+    label: string;
+    /** Click handler */
+    onClick: () => void;
+}
+export interface DeviceCardProps {
+    /** Primary title (e.g., device name) */
+    title: string;
+    /** Secondary text (e.g., model, IP) */
+    subtitle?: string;
+    /** Status: determines the color of the status dot */
+    status?: 'online' | 'offline' | 'warning' | 'unknown';
+    /** Whether this card is currently selected */
+    selected?: boolean;
+    /** Click handler for the card body */
+    onClick?: () => void;
+    /** Clickable badges (e.g., stream profiles) */
+    badges?: DeviceCardBadge[];
+    /** Action icons shown at the bottom (e.g., PTZ, events) */
+    actions?: DeviceCardAction[];
+    /** Content rendered at the bottom when status is offline (e.g., Connect button) */
+    offlineAction?: ReactNode;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function DeviceCard({ title, subtitle, status, selected, onClick, badges, actions, offlineAction, className, }: DeviceCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/composites/device-grid.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+export interface DeviceGridProps {
+    /** Grid items */
+    children: ReactNode;
+    /** Minimum card width in pixels (default 220) */
+    minCardWidth?: number;
+    /** Gap between cards in Tailwind spacing units (default 3) */
+    gap?: number;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function DeviceGrid({ children, minCardWidth, gap, className, }: DeviceGridProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice, VariantDefaults } from './helpers';
+export interface DeviceItemActionsProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly device: DeviceItemDevice;
+    readonly flags: VariantDefaults;
+}
+export declare function DeviceItemActions({ trpc, device, flags }: DeviceItemActionsProps): ReactNode;

package/dist/composites/device-item/children-accordion.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice } from './helpers';
+interface ChildrenAccordionProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly accessoryChildren: readonly DeviceItemDevice[];
+    readonly adoptedChildren: readonly DeviceItemDevice[];
+    readonly onNavigate: (id: number) => void;
+}
+export declare function ChildrenAccordion({ trpc, accessoryChildren, adoptedChildren, onNavigate }: ChildrenAccordionProps): ReactNode;
+export {};

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

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice, VariantDefaults } from './helpers';
+export interface DeviceItemFeaturesProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly device: DeviceItemDevice;
+    readonly flags: VariantDefaults;
+    readonly accessoryCount: number;
+    readonly adoptedCount: number;
+    /**
+     * When true, render the feature-icon row + popover (table view's
+     * "Features" column). Off in card view — only battery + +N badge
+     * to save horizontal space.
+     */
+    readonly showFeatureRow?: boolean;
+}
+export declare function DeviceItemFeatures({ trpc, device, flags, accessoryCount, adoptedCount, showFeatureRow, }: DeviceItemFeaturesProps): ReactNode;

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

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import { DeviceItemDevice, DeviceItemParent, DeviceItemVariant, VariantDefaults } from './helpers';
+export interface DeviceItemHeaderProps {
+    readonly device: DeviceItemDevice;
+    readonly variant: DeviceItemVariant;
+    readonly flags: VariantDefaults;
+    readonly parent: DeviceItemParent | null;
+    readonly integrationIcon: ReactNode | null;
+    readonly hasChildren: boolean;
+    readonly expanded: boolean;
+    readonly onToggleExpand: () => void;
+    readonly onNavigateToParent: (id: number) => void;
+}
+export declare function DeviceItemHeader({ device, variant, flags, parent, integrationIcon, hasChildren, expanded, onToggleExpand, onNavigateToParent, }: DeviceItemHeaderProps): ReactNode;

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

@@ -0,0 +1,147 @@
+import { ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+/**
+ * Mirror of the canonical `DeviceInfo` wire shape (see
+ * `packages/types/src/capabilities/device-manager.cap.ts`). Every
+ * `deviceManager.listAll` / `getDevice` / `getChildren` row is
+ * already this exact shape — call sites pass the raw row through
+ * without remapping. Lives here as a structural type (not an
+ * import) so this composite stays decoupled from `@camstack/types`.
+ */
+export interface DeviceItemDevice {
+    readonly id: number;
+    readonly stableId: string;
+    readonly addonId: string;
+    readonly type: string;
+    readonly name: string;
+    readonly online: boolean;
+    /** Soft-disable flag — `true` dims the row + skips live fetches.
+     *  Matches `DeviceInfo.disabled` so the wire row passes through. */
+    readonly disabled: boolean;
+    readonly parentDeviceId: number | null;
+    /** Optional `DeviceRole` string. Present ⇒ this is an accessory. */
+    readonly role?: string | null;
+    /** DeviceFeature strings — gates BatteryBadge etc. */
+    readonly features?: readonly string[];
+    /** True for ICameraDevice instances — gates snapshot popover. */
+    readonly isCamera?: boolean;
+}
+export interface DeviceItemParent {
+    readonly id: number;
+    readonly name: string;
+    /**
+     * Type of the parent device. Optional — when provided, callers can
+     * distinguish "adopted under a hub/nvr" (renders with extra indent in
+     * the table view) from a generic accessory parent.
+     */
+    readonly type?: string;
+}
+export type DeviceItemKind = 'top-level' | 'adopted' | 'accessory';
+export declare function deriveDeviceKind(device: Pick<DeviceItemDevice, 'parentDeviceId' | 'role'>): DeviceItemKind;
+export type DeviceItemVariant = 'minimal' | 'compact' | 'expanded';
+export type DeviceItemView = 'card' | 'table';
+export interface DeviceItemProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly device: DeviceItemDevice;
+    readonly variant?: DeviceItemVariant;
+    /**
+     * Render mode. `'card'` (default) = flex row + optional accordion
+     * below. `'table'` = `<tr>` with one `<td>` per logical column.
+     * Phase 2's `<DeviceList>` wrapper drives this prop; Phase 1
+     * scaffolds both branches with no current consumer using table.
+     */
+    readonly view?: DeviceItemView;
+    /**
+     * When true, the row is rendered as an accessory of a parent (Phase 2
+     * nested-only mode). Adds a subtle background tint + indent on the
+     * first cell. Has no effect on `view='card'`. Caller provides `true`
+     * only for the accessory passes inside <DeviceList>.
+     */
+    readonly isAccessoryRow?: boolean;
+    /**
+     * Indent level for the `<td>` first cell in `view='table'`. Controls
+     * `pl-N` on the name cell so adopted-under-hub rows can be visually
+     * nested below their parent without forcing the accessory tint.
+     *
+     *   0 → `pl-2`  (top-level, no parent)
+     *   1 → `pl-6`  (adopted under a hub/nvr — visual hierarchy hint)
+     *   2 → `pl-8`  (accessory under any parent — strongest indent)
+     *
+     * When omitted, the orchestrator derives `2` from `isAccessoryRow` and
+     * otherwise defaults to `0`. Caller may override (e.g. <DeviceList>
+     * promoting "adopted-under-hub" rows from 0 → 1).
+     */
+    readonly indentLevel?: 0 | 1 | 2;
+    /**
+     * Controlled expand state for the children-accordion chevron. When
+     * BOTH `expanded` and `onToggleExpand` are passed, DeviceItem becomes
+     * fully controlled; otherwise it falls back to internal state. Used
+     * by `<TableRowGroup>` to lift expand state to the parent so the
+     * accessory `<tr>` rows can render based on the same flag the chevron
+     * flips.
+     */
+    readonly expanded?: boolean;
+    readonly onToggleExpand?: () => void;
+    readonly integrationIcon?: ReactNode;
+    readonly parent?: DeviceItemParent | null;
+    readonly showIntegrationIcon?: boolean;
+    readonly showParentBadge?: boolean;
+    readonly showSnapshot?: boolean;
+    readonly showBattery?: boolean;
+    readonly showStableId?: boolean;
+    readonly showId?: boolean;
+    readonly showSwitchToggle?: boolean;
+    readonly showChildrenAccordion?: boolean;
+    readonly children?: readonly DeviceItemDevice[];
+    readonly onNavigate?: (deviceId: number) => void;
+    readonly className?: string;
+}
+export interface VariantDefaults {
+    readonly showIntegrationIcon: boolean;
+    readonly showParentBadge: boolean;
+    readonly showSnapshot: boolean;
+    readonly showBattery: boolean;
+    readonly showStableId: boolean;
+    readonly showId: boolean;
+    readonly showSwitchToggle: boolean;
+    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
+ * the features popover (`<DeviceItemFeatures>`) to render compact
+ * feature chips. Keys mirror `DeviceFeature` enum string values from
+ * `@camstack/types/device/device-type.ts`.
+ */
+export declare const FEATURE_ICON_MAP: Readonly<Record<string, LucideIcon>>;
+export declare const FEATURE_LABEL_MAP: Readonly<Record<string, string>>;
+/**
+ * Maps a wire-level `DeviceFeature` string to the cap name registered
+ * in `deviceManager.getBindings` entries. A feature with NO entry here
+ * is a pure informational marker (no cap to interrogate) — render but
+ * without a native/enhanced label.
+ *
+ * Source of truth: live `getBindings` capNames observed against a
+ * Reolink camera (snapshot, reboot, ptz, ptz-autotrack, intercom,
+ * motion-trigger). Cap-name strings cross-checked against the
+ * `name:` fields in `packages/types/src/capabilities/*.cap.ts`. When
+ * a new feature ↔ cap pairing goes live, add the row here so the
+ * popover picks it up.
+ *
+ * Pure markers (no cap to bind, intentionally absent):
+ *   - `battery-operated` — exposed as a plain `device.features` flag;
+ *     the runtime-state slice lives under the `battery` cap which has
+ *     its own dedicated reactive surface (`useDeviceBattery`).
+ *   - `doorbell-button` — UI marker only; the actual press events
+ *     flow through the `doorbell` cap which is already exercised by
+ *     `useDoorbellEvents`. Distinct from the marker.
+ */
+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;
+export declare function shortStableId(stableId: string): string;

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

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+import { DeviceItemProps } from './helpers';
+export type { DeviceItemDevice, DeviceItemParent, DeviceItemKind, DeviceItemVariant, DeviceItemView, DeviceItemProps, } from './helpers';
+export { deriveDeviceKind } from './helpers';
+export declare function DeviceItem(props: DeviceItemProps): ReactNode;

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

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice } from './helpers';
+export interface DeviceItemPreviewProps {
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly device: DeviceItemDevice;
+    readonly status: 'online' | 'offline' | 'disabled';
+    /**
+     * Render gate for the snapshot eye icon (typically
+     * `flags.showSnapshot && isCamera` from the orchestrator). Even when
+     * `false`, the component still renders the status-pills row when
+     * `showStatusPills` is on.
+     */
+    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 row narrow.
+     */
+    readonly showStatusPills?: boolean;
+}
+export declare function DeviceItemPreview({ trpc, device, status, enabled, showStatusPills, }: DeviceItemPreviewProps): ReactNode;

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

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export interface StatusDotProps {
+    readonly status: 'online' | 'offline' | 'disabled';
+}
+export declare function StatusDot({ status }: StatusDotProps): ReactNode;

package/dist/composites/device-list/empty-state.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export interface EmptyStateProps {
+    readonly variant: 'nofilter' | 'filtered';
+    readonly onClearFilters?: () => void;
+}
+export declare function DeviceListEmptyState({ variant, onClearFilters }: EmptyStateProps): ReactNode;

package/dist/composites/device-list/filter-chips.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { DeviceListView } from './url-state';
+export interface FilterChipsProps {
+    readonly view: DeviceListView;
+    readonly onViewChange: (view: DeviceListView) => void;
+    readonly types?: readonly string[];
+    readonly currentType: string | null;
+    readonly onTypeChange: (type: string | null) => void;
+    readonly addons?: readonly {
+        readonly id: string;
+        readonly name: string;
+        readonly icon?: ReactNode;
+    }[];
+    readonly currentAddon: string | null;
+    readonly onAddonChange: (addon: string | null) => void;
+    /** When true, the addon group is hidden (used by Integrations expand-row inner DeviceList). */
+    readonly hideAddons?: boolean;
+}
+export declare function FilterChips({ view, onViewChange, types, currentType, onTypeChange, addons, currentAddon, onAddonChange, hideAddons, }: FilterChipsProps): ReactNode;

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

@@ -0,0 +1,6 @@
+import { DeviceItemDevice } from '../device-item/helpers';
+export interface GroupedDevices {
+    readonly topLevel: readonly DeviceItemDevice[];
+    readonly accessoriesByParent: ReadonlyMap<number, readonly DeviceItemDevice[]>;
+}
+export declare function groupTopLevelAndAccessories(devices: readonly DeviceItemDevice[]): GroupedDevices;

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

@@ -0,0 +1,31 @@
+import { ReactNode } from 'react';
+import { UseDeviceProxyTrpc } from '../../hooks/use-device-proxy';
+import { DeviceItemDevice, DeviceItemParent } from '../device-item/helpers';
+import { DeviceListView } from './url-state';
+export interface DeviceListAddonOption {
+    readonly id: string;
+    readonly name: string;
+    readonly icon?: ReactNode;
+}
+export interface DeviceListProps {
+    readonly devices: readonly DeviceItemDevice[];
+    readonly trpc: UseDeviceProxyTrpc;
+    readonly defaultView?: DeviceListView;
+    readonly filters?: {
+        readonly types?: readonly string[];
+        readonly addons?: readonly DeviceListAddonOption[];
+    };
+    /** Pre-applied addon filter — hides the addon-chip group. */
+    readonly forceAddon?: string;
+    readonly resolveIntegrationIcon?: (addonId: string) => ReactNode | null;
+    readonly resolveParent?: (parentId: number) => DeviceItemParent | null;
+    readonly onNavigate?: (deviceId: number) => void;
+    readonly pageSize?: {
+        readonly cards: number;
+        readonly table: number;
+    };
+    readonly urlScope?: 'root' | 'nested';
+    /** LocalStorage key prefix. Default 'devices' for root scope, 'integrations:nested' for nested. */
+    readonly lsKey?: string;
+}
+export declare function DeviceList(props: DeviceListProps): ReactNode;

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

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+export interface PaginationProps {
+    readonly currentPage: number;
+    readonly totalItems: number;
+    readonly pageSize: number;
+    readonly onPageChange: (page: number) => void;
+    /** Singular noun for the showing-info label. Default `'devices'`. */
+    readonly itemNoun?: string;
+}
+export type PageButton = {
+    readonly kind: 'page';
+    readonly n: number;
+} | {
+    readonly kind: 'ellipsis';
+    readonly side: 'left' | 'right';
+};
+export declare function computePageButtons(currentPage: number, totalPages: number): readonly PageButton[];
+export declare function Pagination({ currentPage, totalItems, pageSize, onPageChange, itemNoun, }: PaginationProps): ReactNode;

package/dist/composites/device-list/url-state.d.ts

@@ -0,0 +1,24 @@
+export type DeviceListView = 'cards' | 'table';
+export interface DeviceListUrlState {
+    readonly view: DeviceListView;
+    readonly page: number;
+    readonly addon: string | null;
+    readonly type: string | null;
+    readonly q: string;
+}
+export interface UseDeviceListUrlStateOptions {
+    readonly scope: 'root' | 'nested';
+    readonly defaultView: DeviceListView;
+    /** LocalStorage key prefix, e.g. `'devices'` → `camstack:devices:lastFilters`. */
+    readonly lsKey: string;
+}
+export interface UseDeviceListUrlStateResult {
+    readonly state: DeviceListUrlState;
+    readonly setView: (view: DeviceListView) => void;
+    readonly setPage: (page: number) => void;
+    readonly setAddon: (addon: string | null) => void;
+    readonly setType: (type: string | null) => void;
+    readonly setQ: (q: string) => void;
+    readonly clearFilters: () => void;
+}
+export declare function useDeviceListUrlState(options: UseDeviceListUrlStateOptions): UseDeviceListUrlStateResult;

package/dist/composites/discovery-panel.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Shared discovery panel — renders the `device-discovery` cap surface
+ * for any parent device that registers it (Reolink Hub, future ONVIF
+ * gateway, NVR-style integrations). Keeps the integration's UI
+ * surface zero-effort: as long as the cap is mounted, the panel
+ * renders the channel list with status badges, refresh, adopt, and
+ * release controls.
+ *
+ * Mirrors the Scrypted device-discovery affordance pattern: a single
+ * generic UI used by every plugin that exposes children behind a
+ * gateway. Keeps the operator UX consistent across integrations.
+ */
+interface DiscoveryPanelProps {
+    readonly deviceId: number;
+    readonly className?: string;
+    /**
+     * Optional navigation callback fired when the operator clicks the
+     * "Open" link on an adopted child row. ui-library deliberately
+     * stays free of `react-router-dom` so it works in agent UIs +
+     * embedded admin shells alike — host wires the actual navigation.
+     * When omitted, the link is hidden.
+     */
+    readonly onOpenChild?: (childDeviceId: number) => void;
+}
+export declare function DiscoveryPanel({ deviceId, className, onOpenChild }: DiscoveryPanelProps): React.ReactElement;
+export {};

package/dist/composites/doorbell-recent-panel.d.ts

@@ -0,0 +1,10 @@
+import { DoorbellPressEvent } from '../hooks/use-doorbell-events';
+export interface DoorbellRecentPanelProps {
+    readonly history: readonly DoorbellPressEvent[];
+    /** Max rows to show (defaults to 5). */
+    readonly limit?: number;
+    /** Visual hint that the latest press is fresh (< 30s) — pulses the icon. */
+    readonly latestIsFresh?: boolean;
+    readonly className?: string;
+}
+export declare function DoorbellRecentPanel({ history, limit, latestIsFresh, className, }: DoorbellRecentPanelProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/composites/empty-state.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
+export interface EmptyStateProps {
+    icon?: LucideIcon;
+    title: string;
+    description?: string;
+    action?: ReactNode;
+    className?: string;
+}
+export declare function EmptyState({ icon: Icon, title, description, action, className, }: EmptyStateProps): import("react/jsx-runtime").JSX.Element;

package/dist/composites/event-stream.d.ts

@@ -0,0 +1,48 @@
+import { LiveBuffer } from '../hooks/use-live-buffer';
+interface EventEntry {
+    readonly id: string;
+    readonly timestamp: string;
+    readonly source: {
+        readonly type: string;
+        readonly id: string | number;
+        readonly nodeId?: string;
+        readonly addonId?: string;
+        readonly deviceId?: number;
+    };
+    readonly category: string;
+    readonly data: Record<string, unknown>;
+}
+export interface EventStreamProps {
+    readonly agentId?: string;
+    readonly addonId?: string;
+    readonly deviceId?: number;
+    /** Initial whitelist — the user can mutate through the multiselect popover.
+     *  Defaults to ALL EventCategory values when both this and `categories`
+     *  are omitted. */
+    readonly defaultCategories?: readonly string[];
+    /** Legacy alias for `defaultCategories`. Kept for back-compat. */
+    readonly categories?: readonly string[];
+    /** Category glob/pattern passed to the backend subscription (e.g. 'addon.*'). */
+    readonly category?: string;
+    readonly maxHeight?: string;
+    readonly limit?: number;
+    /** Show the multiselect filter button in the toolbar (default true). */
+    readonly showCategoryFilter?: boolean;
+    readonly showFilters?: boolean;
+    /**
+     * Optional controlled live buffer. When provided, the stream reads
+     * + appends to this external store rather than its own `useState`,
+     * so the visible list survives an unmount/remount of the component
+     * (used by `DeviceActivityPanel` to keep tab content alive across
+     * tab switches without keeping subscriptions open in inactive tabs).
+     */
+    readonly liveBuffer?: LiveBuffer<EventEntry>;
+    readonly onClose?: () => void;
+    readonly className?: string;
+}
+export declare function EventStream({ agentId, addonId, deviceId, defaultCategories, categories: legacyCategories, category: propsCategory, maxHeight, limit, showCategoryFilter, showFilters: _showFilters, liveBuffer: externalBuffer, onClose, className, }: EventStreamProps): import("react/jsx-runtime").JSX.Element;
+export interface FloatingEventStreamProps extends EventStreamProps {
+    readonly position?: 'bottom' | 'overlay';
+}
+export declare function FloatingEventStream({ position, className, ...props }: FloatingEventStreamProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/composites/filter-bar.d.ts

@@ -0,0 +1,28 @@
+type FilterDef = {
+    type: 'search';
+    key: string;
+    placeholder?: string;
+} | {
+    type: 'select';
+    key: string;
+    label: string;
+    options: {
+        value: string;
+        label: string;
+    }[];
+} | {
+    type: 'badge-toggle';
+    key: string;
+    options: {
+        value: string;
+        label: string;
+    }[];
+};
+export type { FilterDef };
+export interface FilterBarProps {
+    filters: FilterDef[];
+    values: Record<string, unknown>;
+    onChange: (values: Record<string, unknown>) => void;
+    className?: string;
+}
+export declare function FilterBar({ filters, values, onChange, className }: FilterBarProps): import("react/jsx-runtime").JSX.Element;

package/dist/composites/form-field.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export interface FormFieldProps {
+    label: string;
+    description?: string;
+    error?: string;
+    required?: boolean;
+    children: ReactNode;
+    orientation?: 'vertical' | 'horizontal';
+    className?: string;
+}
+export declare function FormField({ label, description, error, required, children, orientation, className, }: FormFieldProps): import("react/jsx-runtime").JSX.Element;