@moldable-ai/ui 0.2.19 → 0.2.21

package/dist/components/native-capabilities/usb-panel.js

@@ -0,0 +1,363 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { RefreshCw, RotateCcw, Trash2, Usb } from 'lucide-react';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { NativeCapabilityBridgeError, clearMoldableUsbHalt, closeMoldableUsbDevice, forgetMoldableUsbDevice, getMoldableUsbDevices, openMoldableUsbDevice, readMoldableUsbControlTransfer, readMoldableUsbEndpoint, requestMoldableUsbDevice, resetMoldableUsbDevice, writeMoldableUsbControlTransfer, writeMoldableUsbEndpoint, } from '../../lib/native-capabilities';
+import { Button } from '../ui/button';
+import { Input } from '../ui/input';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../ui/select';
+import { Spinner } from '../ui/spinner';
+import { CapabilityBadge } from './capability-badge';
+import { formatHexBytes, parseHexBytes, parseIntegerInput, } from './device-io-controls';
+import { DeviceList, DeviceListEmpty, DeviceListItem } from './device-list';
+import { NativeCapabilityPanel, NativeCapabilityPanelAction, NativeCapabilityPanelContent, NativeCapabilityPanelFooter, NativeCapabilityPanelHeader, NativeCapabilityPanelIcon, NativeCapabilityPanelTitle, } from './native-capability-panel';
+import { Readout, ReadoutItem } from './readout';
+function toError(cause) {
+    return cause instanceof Error ? cause : new Error(String(cause));
+}
+function formatHexId(value) {
+    return `0x${value.toString(16).padStart(4, '0')}`;
+}
+function usbDeviceDescriptionId(device) {
+    return [
+        device.vendorId,
+        device.productId,
+        device.serialNumber ?? '',
+        device.productName ?? '',
+    ].join(':');
+}
+/**
+ * USB state machine behind `UsbDevicePanel`: granted-device enumeration,
+ * chooser requests, minimal-claim open/close tracking. Use directly to build
+ * custom USB UI on the same best-effort error handling.
+ */
+export function useMoldableUsb(options = {}) {
+    const [devices, setDevices] = useState([]);
+    const [status, setStatus] = useState('idle');
+    const [error, setError] = useState(null);
+    const [openDeviceIds, setOpenDeviceIds] = useState([]);
+    const [nativeDeviceChoices, setNativeDeviceChoices] = useState([]);
+    const openDevicesRef = useRef(new Map());
+    const idsRef = useRef(new WeakMap());
+    const idCounterRef = useRef(0);
+    const pendingSelectionRef = useRef(null);
+    const generationRef = useRef(0);
+    const unmountedRef = useRef(false);
+    const optionsRef = useRef(options);
+    optionsRef.current = options;
+    const deviceId = useCallback((device) => {
+        let id = idsRef.current.get(device);
+        if (!id) {
+            id = `usb-${++idCounterRef.current}`;
+            idsRef.current.set(device, id);
+        }
+        return id;
+    }, []);
+    const refresh = useCallback(async () => {
+        const generation = ++generationRef.current;
+        setStatus('loading');
+        setError(null);
+        try {
+            const known = await getMoldableUsbDevices();
+            if (generationRef.current !== generation)
+                return;
+            setDevices((previous) => [
+                ...known,
+                ...previous.filter((device) => openDevicesRef.current.has(deviceId(device)) &&
+                    !known.includes(device)),
+            ]);
+            setStatus('idle');
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            if (cause instanceof NativeCapabilityBridgeError &&
+                cause.code === 'unsupported') {
+                // No WebUSB enumeration here (native fallback runtime). Devices
+                // granted through `request` stay listed; this is not an error.
+                setStatus('idle');
+                return;
+            }
+            setError(toError(cause));
+            setStatus('error');
+        }
+    }, [deviceId]);
+    const handleDisconnect = useCallback((device) => {
+        if (unmountedRef.current)
+            return;
+        const id = deviceId(device);
+        const record = openDevicesRef.current.get(id);
+        if (record) {
+            device.removeEventListener('disconnect', record.onDisconnect);
+        }
+        openDevicesRef.current.delete(id);
+        setOpenDeviceIds((previous) => previous.filter((existing) => existing !== id));
+        setDevices((previous) => previous.filter((existing) => existing !== device));
+    }, [deviceId]);
+    const chooseNativeDevice = useCallback((devices) => new Promise((resolve, reject) => {
+        pendingSelectionRef.current = { devices, resolve, reject };
+        setNativeDeviceChoices(devices);
+    }), []);
+    const selectNativeDevice = useCallback((device) => {
+        const pending = pendingSelectionRef.current;
+        if (!pending || !pending.devices.includes(device))
+            return;
+        pendingSelectionRef.current = null;
+        setNativeDeviceChoices([]);
+        pending.resolve(device);
+    }, []);
+    const cancelNativeSelection = useCallback(() => {
+        const pending = pendingSelectionRef.current;
+        if (!pending)
+            return;
+        pendingSelectionRef.current = null;
+        setNativeDeviceChoices([]);
+        pending.reject(new NativeCapabilityBridgeError({
+            code: 'cancelled',
+            message: 'USB device selection was cancelled.',
+            retryable: true,
+        }));
+    }, []);
+    const request = useCallback(async (filters) => {
+        const generation = ++generationRef.current;
+        setStatus('requesting');
+        setError(null);
+        try {
+            const device = await requestMoldableUsbDevice({
+                filters: filters ?? optionsRef.current.filters ?? [],
+                selectNativeDevice: optionsRef.current.selectNativeDevice ?? chooseNativeDevice,
+            });
+            if (generationRef.current !== generation)
+                return;
+            setDevices((previous) => previous.includes(device) ? previous : [...previous, device]);
+            setStatus('idle');
+            return device;
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            if (cause instanceof NativeCapabilityBridgeError &&
+                (cause.code === 'cancelled' || cause.code === 'aborted')) {
+                // The user dismissed the chooser; that is not an error state.
+                setStatus('idle');
+                return;
+            }
+            setError(toError(cause));
+            setStatus('error');
+        }
+    }, [chooseNativeDevice]);
+    const open = useCallback(async (device) => {
+        const id = deviceId(device);
+        if (openDevicesRef.current.has(id))
+            return;
+        try {
+            await openMoldableUsbDevice(device, optionsRef.current.openOptions);
+            if (unmountedRef.current) {
+                void closeMoldableUsbDevice(device, optionsRef.current.openOptions?.claimInterfaces).catch(() => undefined);
+                return;
+            }
+            const onDisconnect = () => handleDisconnect(device);
+            device.addEventListener('disconnect', onDisconnect, { once: true });
+            openDevicesRef.current.set(id, {
+                device,
+                onDisconnect,
+                releaseInterfaces: optionsRef.current.openOptions?.claimInterfaces ?? [],
+            });
+            setOpenDeviceIds((previous) => previous.includes(id) ? previous : [...previous, id]);
+            setError(null);
+            setStatus('idle');
+            optionsRef.current.onDeviceOpen?.(device);
+        }
+        catch (cause) {
+            if (unmountedRef.current)
+                return;
+            setError(toError(cause));
+            setStatus('error');
+        }
+    }, [deviceId, handleDisconnect]);
+    const close = useCallback(async (device) => {
+        const id = deviceId(device);
+        const record = openDevicesRef.current.get(id);
+        try {
+            await closeMoldableUsbDevice(device, record?.releaseInterfaces);
+            if (record) {
+                device.removeEventListener('disconnect', record.onDisconnect);
+            }
+            openDevicesRef.current.delete(id);
+            setOpenDeviceIds((previous) => previous.filter((existing) => existing !== id));
+            setError(null);
+            setStatus('idle');
+            return true;
+        }
+        catch (cause) {
+            if (record)
+                record.releaseInterfaces = [];
+            if (unmountedRef.current)
+                return false;
+            setError(toError(cause));
+            setStatus('error');
+            return false;
+        }
+    }, [deviceId]);
+    const runOperation = useCallback(async (operation) => {
+        setError(null);
+        try {
+            const result = await operation();
+            if (!unmountedRef.current)
+                setStatus('idle');
+            return result;
+        }
+        catch (cause) {
+            if (!unmountedRef.current) {
+                setError(toError(cause));
+                setStatus('error');
+            }
+            throw cause;
+        }
+    }, []);
+    const forget = useCallback(async (device) => {
+        const id = deviceId(device);
+        if ((openDevicesRef.current.has(id) || device.opened) &&
+            !(await close(device))) {
+            return false;
+        }
+        try {
+            await runOperation(() => forgetMoldableUsbDevice(device));
+            if (unmountedRef.current)
+                return false;
+            setDevices((previous) => previous.filter((known) => known !== device));
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }, [close, deviceId, runOperation]);
+    useEffect(() => {
+        unmountedRef.current = false;
+        void refresh();
+        const liveGeneration = generationRef;
+        const openDevices = openDevicesRef.current;
+        return () => {
+            unmountedRef.current = true;
+            liveGeneration.current++;
+            const pending = pendingSelectionRef.current;
+            pendingSelectionRef.current = null;
+            pending?.reject(new NativeCapabilityBridgeError({
+                code: 'aborted',
+                message: 'USB device selection was interrupted.',
+                retryable: true,
+            }));
+            const stillOpen = [...openDevices.values()];
+            openDevices.clear();
+            for (const { device, onDisconnect, releaseInterfaces } of stillOpen) {
+                device.removeEventListener('disconnect', onDisconnect);
+                void closeMoldableUsbDevice(device, releaseInterfaces).catch(() => undefined);
+            }
+        };
+    }, [refresh]);
+    return {
+        devices,
+        status,
+        error,
+        openDeviceIds,
+        nativeDeviceChoices,
+        deviceId,
+        refresh,
+        request,
+        selectNativeDevice,
+        cancelNativeSelection,
+        open,
+        close,
+        forget,
+        readEndpoint: (device, endpoint, length) => runOperation(() => readMoldableUsbEndpoint(device, endpoint, length)),
+        writeEndpoint: (device, endpoint, data) => runOperation(() => writeMoldableUsbEndpoint(device, endpoint, data)),
+        readControl: (device, setup, length) => runOperation(() => readMoldableUsbControlTransfer(device, setup, length)),
+        writeControl: (device, setup, data) => runOperation(() => writeMoldableUsbControlTransfer(device, setup, data)),
+        clearHalt: (device, direction, endpoint) => runOperation(() => clearMoldableUsbHalt(device, direction, endpoint)),
+        reset: (device) => runOperation(() => resetMoldableUsbDevice(device)),
+    };
+}
+function UsbDeviceControls({ device, usb }) {
+    const [endpoint, setEndpoint] = useState('1');
+    const [length, setLength] = useState('64');
+    const [payload, setPayload] = useState('');
+    const [requestType, setRequestType] = useState('vendor');
+    const [recipient, setRecipient] = useState('device');
+    const [request, setRequest] = useState('0');
+    const [value, setValue] = useState('0');
+    const [index, setIndex] = useState('0');
+    const [result, setResult] = useState('Ready');
+    const [busy, setBusy] = useState(false);
+    const run = async (operation) => {
+        setBusy(true);
+        try {
+            setResult(await operation());
+        }
+        catch (cause) {
+            setResult(toError(cause).message);
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const endpointNumber = () => parseIntegerInput(endpoint, 'Endpoint', 1, 15);
+    const transferLength = () => parseIntegerInput(length, 'Length', 1, 65_535);
+    const setup = () => ({
+        requestType,
+        recipient,
+        request: parseIntegerInput(request, 'Request', 0, 255),
+        value: parseIntegerInput(value, 'Value', 0, 65_535),
+        index: parseIntegerInput(index, 'Index', 0, 65_535),
+    });
+    return (_jsxs("div", { "data-slot": "usb-device-controls", className: "bg-muted/30 mt-2 space-y-3 rounded-md border p-2.5", children: [_jsxs("div", { className: "grid gap-2 sm:grid-cols-3", children: [_jsx(Input, { "aria-label": "USB endpoint number", value: endpoint, onChange: (event) => setEndpoint(event.target.value), placeholder: "Endpoint", className: "h-8 font-mono text-xs" }), _jsx(Input, { "aria-label": "USB transfer length", value: length, onChange: (event) => setLength(event.target.value), placeholder: "Length", className: "h-8 font-mono text-xs" }), _jsx(Input, { "aria-label": "USB endpoint payload", value: payload, onChange: (event) => setPayload(event.target.value), placeholder: "Hex payload", className: "h-8 font-mono text-xs" })] }), _jsxs("div", { className: "flex flex-wrap gap-1.5", children: [_jsx(Button, { size: "xs", variant: "outline", disabled: busy, onClick: () => void run(async () => {
+                            const transfer = await usb.readEndpoint(device, endpointNumber(), transferLength());
+                            return `Endpoint IN · ${transfer.status} · ${formatHexBytes(transfer.data)}`;
+                        }), children: "Endpoint IN" }), _jsx(Button, { size: "xs", variant: "outline", disabled: busy, onClick: () => void run(async () => {
+                            const transfer = await usb.writeEndpoint(device, endpointNumber(), parseHexBytes(payload));
+                            return `Endpoint OUT · ${transfer.status} · ${transfer.bytesWritten ?? 0} bytes`;
+                        }), children: "Endpoint OUT" }), _jsx(Button, { size: "xs", variant: "ghost", disabled: busy, onClick: () => void run(async () => {
+                            await usb.clearHalt(device, 'in', endpointNumber());
+                            return 'IN halt cleared';
+                        }), children: "Clear IN halt" }), _jsx(Button, { size: "xs", variant: "ghost", disabled: busy, onClick: () => void run(async () => {
+                            await usb.clearHalt(device, 'out', endpointNumber());
+                            return 'OUT halt cleared';
+                        }), children: "Clear OUT halt" })] }), _jsxs("div", { className: "grid gap-2 sm:grid-cols-5", children: [_jsxs(Select, { value: requestType, onValueChange: (next) => setRequestType(next), children: [_jsx(SelectTrigger, { size: "sm", "aria-label": "USB control request type", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "standard", children: "Standard" }), _jsx(SelectItem, { value: "class", children: "Class" }), _jsx(SelectItem, { value: "vendor", children: "Vendor" })] })] }), _jsxs(Select, { value: recipient, onValueChange: (next) => setRecipient(next), children: [_jsx(SelectTrigger, { size: "sm", "aria-label": "USB control recipient", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "device", children: "Device" }), _jsx(SelectItem, { value: "interface", children: "Interface" }), _jsx(SelectItem, { value: "endpoint", children: "Endpoint" }), _jsx(SelectItem, { value: "other", children: "Other" })] })] }), [
+                        ['Request', request, setRequest],
+                        ['Value', value, setValue],
+                        ['Index', index, setIndex],
+                    ].map(([label, current, update]) => (_jsx(Input, { "aria-label": `USB control ${String(label).toLowerCase()}`, value: current, onChange: (event) => update(event.target.value), placeholder: label, className: "h-8 font-mono text-xs" }, label)))] }), _jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx(Button, { size: "xs", variant: "outline", disabled: busy, onClick: () => void run(async () => {
+                            const transfer = await usb.readControl(device, setup(), transferLength());
+                            return `Control IN · ${transfer.status} · ${formatHexBytes(transfer.data)}`;
+                        }), children: "Control IN" }), _jsx(Button, { size: "xs", variant: "outline", disabled: busy, onClick: () => void run(async () => {
+                            const transfer = await usb.writeControl(device, setup(), parseHexBytes(payload));
+                            return `Control OUT · ${transfer.status} · ${transfer.bytesWritten ?? 0} bytes`;
+                        }), children: "Control OUT" }), _jsxs(Button, { size: "xs", variant: "ghost", disabled: busy, onClick: () => void run(async () => {
+                            await usb.reset(device);
+                            return 'Device reset';
+                        }), children: [_jsx(RotateCcw, {}), "Reset"] }), _jsx("span", { className: "text-muted-foreground ml-auto truncate font-mono text-[10px]", children: busy ? 'Working…' : result })] })] }));
+}
+/**
+ * USB device panel: request access, list granted devices, open/close each
+ * with minimal claims, and read out live device details while open.
+ */
+function UsbDevicePanel({ className, filters, selectNativeDevice, openOptions, onDeviceOpen, ...props }) {
+    const usb = useMoldableUsb({
+        filters,
+        selectNativeDevice,
+        openOptions,
+        onDeviceOpen,
+    });
+    const requesting = usb.status === 'requesting';
+    const loading = usb.status === 'loading';
+    return (_jsxs(NativeCapabilityPanel, { "data-slot": "usb-device-panel", "data-status": usb.status, className: className, ...props, children: [_jsxs(NativeCapabilityPanelHeader, { children: [_jsx(NativeCapabilityPanelIcon, { children: _jsx(Usb, {}) }), _jsx(NativeCapabilityPanelTitle, { children: "USB" }), _jsx(CapabilityBadge, { capability: "usb" }), _jsxs(NativeCapabilityPanelAction, { children: [_jsxs(Button, { size: "sm", disabled: requesting, onClick: () => void usb.request(), children: [requesting ? _jsx(Spinner, {}) : _jsx(Usb, {}), requesting ? 'Requesting…' : 'Request device'] }), _jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Refresh devices", disabled: loading || requesting, onClick: () => void usb.refresh(), children: _jsx(RefreshCw, { className: loading ? 'animate-spin motion-reduce:animate-none' : undefined }) })] })] }), _jsxs(NativeCapabilityPanelContent, { children: [usb.nativeDeviceChoices.length > 0 ? (_jsxs("div", { "data-slot": "usb-native-device-picker", className: "bg-muted/30 mb-4 space-y-2 rounded-lg border p-3", children: [_jsx("p", { className: "text-sm font-medium", children: "Choose a USB device" }), _jsx("p", { className: "text-muted-foreground text-xs", children: "More than one native device matched. Select the device explicitly." }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [usb.nativeDeviceChoices.map((device, index) => (_jsxs(Button, { size: "xs", variant: "outline", onClick: () => usb.selectNativeDevice(device), children: [device.productName || 'USB device', " \u00B7", ' ', formatHexId(device.vendorId), ":", formatHexId(device.productId)] }, `${usbDeviceDescriptionId(device)}:${index}`))), _jsx(Button, { size: "xs", variant: "ghost", onClick: usb.cancelNativeSelection, children: "Cancel" })] })] })) : null, _jsx(DeviceList, { children: usb.devices.length === 0 ? (_jsxs(DeviceListEmpty, { icon: _jsx(Usb, {}), children: [_jsx("span", { className: "font-medium", children: "No devices yet" }), _jsx("span", { className: "text-muted-foreground/70 text-xs", children: "Request access to a USB device to get started." })] })) : (usb.devices.map((device, index) => {
+                            const id = usb.deviceId(device);
+                            const open = usb.openDeviceIds.includes(id) || device.opened;
+                            return (_jsx(DeviceListItem, { icon: _jsx(Usb, {}), name: device.productName || 'USB device', description: `${formatHexId(device.vendorId)}:${formatHexId(device.productId)}` +
+                                    (device.manufacturerName
+                                        ? ` · ${device.manufacturerName}`
+                                        : ''), connected: open, action: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Button, { size: "xs", variant: "outline", onClick: () => void (open ? usb.close(device) : usb.open(device)), children: open ? 'Close' : 'Open' }), _jsx(Button, { size: "icon-xs", variant: "ghost", "aria-label": `Forget ${device.productName || 'USB device'}`, onClick: () => void usb.forget(device), children: _jsx(Trash2, {}) })] }), children: open ? (_jsxs("div", { "data-slot": "usb-device-details", className: "animate-in fade-in slide-in-from-top-1 bg-muted/30 mt-2 rounded-md border p-2.5 duration-200 motion-reduce:animate-none", children: [_jsxs(Readout, { className: "gap-y-2 sm:grid-cols-4", children: [_jsx(ReadoutItem, { label: "Configuration", value: device.configuration?.configurationValue ?? null }), _jsx(ReadoutItem, { label: "Vendor ID", value: formatHexId(device.vendorId) }), _jsx(ReadoutItem, { label: "Product ID", value: formatHexId(device.productId) }), _jsx(ReadoutItem, { label: "Serial", value: device.serialNumber ?? null })] }), _jsx(UsbDeviceControls, { device: device, usb: usb })] })) : null }, `${id}:${index}`));
+                        })) })] }), _jsxs(NativeCapabilityPanelFooter, { children: [usb.error ? (_jsx("span", { className: "text-status-error truncate", children: usb.error.message })) : (_jsx("span", { className: "truncate", children: usb.devices.length === 0
+                            ? 'No devices authorized'
+                            : `${usb.devices.length} device${usb.devices.length === 1 ? '' : 's'} known` })), _jsxs("span", { className: "ml-auto shrink-0 font-mono tabular-nums", children: [usb.openDeviceIds.length, " open"] })] })] }));
+}
+export { UsbDevicePanel };

package/dist/components/native-capabilities/use-capability.d.ts

@@ -0,0 +1,20 @@
+import { type NativeCapabilityDescriptor, type NativeCapabilityId, type NativeCapabilityManifest } from '../../lib/native-capabilities';
+export type MoldableCapabilityStatus = 'checking' | 'supported' | 'partial' | 'unsupported' | 'unavailable';
+/**
+ * Loads the native capability manifest once per page and shares it across all
+ * hardware components. Pass `force` to bypass the cache (e.g. after a grant).
+ */
+export declare function loadMoldableCapabilities(force?: boolean): Promise<NativeCapabilityManifest>;
+export interface MoldableCapability {
+    status: MoldableCapabilityStatus;
+    descriptor: NativeCapabilityDescriptor | null;
+    manifest: NativeCapabilityManifest | null;
+    error: Error | null;
+    refresh: () => void;
+}
+/**
+ * Reads the support level for one native capability. `unavailable` means the
+ * manifest could not be loaded at all (typically: not running inside Moldable).
+ */
+export declare function useMoldableCapability(id: NativeCapabilityId): MoldableCapability;
+//# sourceMappingURL=use-capability.d.ts.map

package/dist/components/native-capabilities/use-capability.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-capability.d.ts","sourceRoot":"","sources":["../../../src/components/native-capabilities/use-capability.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACvB,KAAK,wBAAwB,EAE9B,MAAM,+BAA+B,CAAA;AAEtC,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,WAAW,GACX,SAAS,GACT,aAAa,GACb,aAAa,CAAA;AAIjB;;;GAGG;AACH,wBAAgB,wBAAwB,CACtC,KAAK,UAAQ,GACZ,OAAO,CAAC,wBAAwB,CAAC,CAUnC;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,wBAAwB,CAAA;IAChC,UAAU,EAAE,0BAA0B,GAAG,IAAI,CAAA;IAC7C,QAAQ,EAAE,wBAAwB,GAAG,IAAI,CAAA;IACzC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CACnC,EAAE,EAAE,kBAAkB,GACrB,kBAAkB,CA4CpB"}

package/dist/components/native-capabilities/use-capability.js

@@ -0,0 +1,61 @@
+'use client';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { getMoldableNativeCapabilities, } from '../../lib/native-capabilities';
+let manifestPromise = null;
+/**
+ * Loads the native capability manifest once per page and shares it across all
+ * hardware components. Pass `force` to bypass the cache (e.g. after a grant).
+ */
+export function loadMoldableCapabilities(force = false) {
+    if (force || !manifestPromise) {
+        manifestPromise = getMoldableNativeCapabilities().catch((error) => {
+            manifestPromise = null;
+            throw error;
+        });
+    }
+    return manifestPromise;
+}
+/**
+ * Reads the support level for one native capability. `unavailable` means the
+ * manifest could not be loaded at all (typically: not running inside Moldable).
+ */
+export function useMoldableCapability(id) {
+    const [manifest, setManifest] = useState(null);
+    const [error, setError] = useState(null);
+    const [checking, setChecking] = useState(true);
+    const generation = useRef(0);
+    const load = useCallback((force) => {
+        const current = ++generation.current;
+        setChecking(true);
+        setError(null);
+        loadMoldableCapabilities(force)
+            .then((value) => {
+            if (generation.current !== current)
+                return;
+            setManifest(value);
+            setChecking(false);
+        })
+            .catch((cause) => {
+            if (generation.current !== current)
+                return;
+            setManifest(null);
+            setError(cause instanceof Error ? cause : new Error(String(cause)));
+            setChecking(false);
+        });
+    }, []);
+    useEffect(() => {
+        load(false);
+        const liveGeneration = generation;
+        return () => {
+            liveGeneration.current++;
+        };
+    }, [load]);
+    const refresh = useCallback(() => load(true), [load]);
+    const descriptor = manifest ? manifest.capabilities[id] : null;
+    const status = checking
+        ? 'checking'
+        : descriptor
+            ? descriptor.support
+            : 'unavailable';
+    return { status, descriptor, manifest, error, refresh };
+}

package/dist/components/ui/alert-dialog.d.ts

@@ -6,14 +6,18 @@ declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof Al
 declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogContent({ className, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
-    size?: 'default' | 'sm';
+    size?: 'sm' | 'default' | 'lg';
 }): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogBody({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogMedia({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
-declare function AlertDialogAction({ className, variant, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action> & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogAction({ className, children, disabled, pending, pendingLabel, variant, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action> & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'> & {
+    pending?: boolean;
+    pendingLabel?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogCancel({ className, variant, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel> & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>): import("react/jsx-runtime").JSX.Element;
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
+export { AlertDialog, AlertDialogAction, AlertDialogBody, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
 //# sourceMappingURL=alert-dialog.d.ts.map

package/dist/components/ui/alert-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,oBAAoB,MAAM,8BAA8B,CAAA;AACpE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,2CAExD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,2CAI3D;AAED,iBAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,2CAI1D;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,2CAW3D;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG;IAC7D,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;CACxB,2CAeA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC,2CAWzD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,WAAW,CAAC,2CAQ/D;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,GACzD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,2CAU9D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,GACzD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,2CAU9D;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,GACnB,CAAA"}
+{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/alert-dialog.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import { cn } from '../../lib/utils';
 import { Button } from './button';
+import { Spinner } from './spinner';
 function AlertDialog({ ...props }) {
     return _jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
 }
@@ -16,13 +17,16 @@ function AlertDialogOverlay({ className, ...props }) {
     return (_jsx(AlertDialogPrimitive.Overlay, { "data-slot": "alert-dialog-overlay", className: cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50', className), ...props }));
 }
 function AlertDialogContent({ className, size = 'default', ...props }) {
-    return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Content, { "data-slot": "alert-dialog-content", "data-size": size, className: cn('bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 group/alert-dialog-content fixed left-[50%] top-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg', className), ...props })] }));
+    return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx("div", { "data-slot": "alert-dialog-positioner", className: "pointer-events-none fixed bottom-[max(var(--window-content-inset-bottom),var(--chat-safe-padding),1rem)] left-[max(var(--window-content-inset-inline-start),1rem)] right-[max(var(--window-content-inset-inline-end),1rem)] top-[max(var(--window-content-inset-top),1rem)] z-50 grid place-items-center", children: _jsx(AlertDialogPrimitive.Content, { "data-slot": "alert-dialog-content", "data-size": size, className: cn('bg-background group/alert-dialog-content rounded-overlay border-separator shadow-overlay pointer-events-auto relative grid max-h-full min-h-0 w-full gap-4 overflow-hidden border p-6 outline-none', 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95', 'duration-[var(--motion-duration-normal)]', 'data-[size=default]:max-w-lg data-[size=lg]:max-w-2xl data-[size=sm]:max-w-xs', className), ...props }) })] }));
 }
 function AlertDialogHeader({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn('has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr] grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left', className), ...props }));
 }
 function AlertDialogFooter({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn('flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end', className), ...props }));
+    return (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn('flex shrink-0 flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:flex-wrap sm:justify-end', className), ...props }));
+}
+function AlertDialogBody({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "alert-dialog-body", className: cn('min-h-0 overflow-y-auto overscroll-contain [scrollbar-gutter:stable]', className), ...props }));
 }
 function AlertDialogTitle({ className, ...props }) {
     return (_jsx(AlertDialogPrimitive.Title, { "data-slot": "alert-dialog-title", className: cn('sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2 text-lg font-semibold', className), ...props }));
@@ -33,10 +37,10 @@ function AlertDialogDescription({ className, ...props }) {
 function AlertDialogMedia({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-dialog-media", className: cn("bg-muted *:[svg:not([class*='size-'])]:size-8 mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2", className), ...props }));
 }
-function AlertDialogAction({ className, variant = 'default', size = 'default', ...props }) {
-    return (_jsx(Button, { variant: variant, size: size, asChild: true, children: _jsx(AlertDialogPrimitive.Action, { "data-slot": "alert-dialog-action", className: cn(className), ...props }) }));
+function AlertDialogAction({ className, children, disabled, pending = false, pendingLabel, variant = 'default', size = 'default', ...props }) {
+    return (_jsx(Button, { variant: variant, size: size, disabled: disabled || pending, "aria-busy": pending || undefined, asChild: true, children: _jsxs(AlertDialogPrimitive.Action, { "data-slot": "alert-dialog-action", "data-pending": pending || undefined, className: cn(className), ...props, children: [pending ? _jsx(Spinner, { "aria-hidden": "true" }) : null, pending && pendingLabel !== undefined ? pendingLabel : children] }) }));
 }
 function AlertDialogCancel({ className, variant = 'outline', size = 'default', ...props }) {
     return (_jsx(Button, { variant: variant, size: size, asChild: true, children: _jsx(AlertDialogPrimitive.Cancel, { "data-slot": "alert-dialog-cancel", className: cn(className), ...props }) }));
 }
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
+export { AlertDialog, AlertDialogAction, AlertDialogBody, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };

package/dist/components/ui/alert.d.ts

@@ -1,10 +1,26 @@
 import * as React from 'react';
+import { type IconButtonProps } from './icon-button';
 import { type VariantProps } from 'class-variance-authority';
 declare const alertVariants: (props?: ({
-    variant?: "default" | "destructive" | null | undefined;
+    tone?: "success" | "warning" | "neutral" | "info" | "danger" | null | undefined;
+    density?: "compact" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Alert({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>): import("react/jsx-runtime").JSX.Element;
+type AlertTone = NonNullable<VariantProps<typeof alertVariants>['tone']>;
+type AlertDensity = NonNullable<VariantProps<typeof alertVariants>['density']>;
+interface AlertProps extends Omit<React.ComponentProps<'div'>, 'role'>, VariantProps<typeof alertVariants> {
+    /**
+     * Compatibility alias. Prefer `tone`; `destructive` maps to `danger`.
+     */
+    variant?: 'default' | 'destructive';
+    role?: React.AriaRole;
+}
+declare function Alert({ className, density, role, tone, variant, ...props }: AlertProps): import("react/jsx-runtime").JSX.Element;
 declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
-export { Alert, AlertTitle, AlertDescription };
+declare function AlertActions({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+interface AlertDismissProps extends Omit<IconButtonProps, 'children' | 'label' | 'loading' | 'shape' | 'size'> {
+    label: string;
+}
+declare function AlertDismiss({ className, label, ...props }: AlertDismissProps): import("react/jsx-runtime").JSX.Element;
+export { Alert, AlertActions, AlertDescription, AlertDismiss, AlertTitle, alertVariants, type AlertDensity, type AlertDismissProps, type AlertProps, type AlertTone, };
 //# sourceMappingURL=alert.d.ts.map

package/dist/components/ui/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/ui/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAEjE,QAAA,MAAM,aAAa;;8EAclB,CAAA;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,2CASlE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/ui/alert.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAEjE,QAAA,MAAM,aAAa;;;8EAwBlB,CAAA;AAED,KAAK,SAAS,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,CAAA;AACxE,KAAK,YAAY,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC,SAAS,CAAC,CAAC,CAAA;AAE9E,UAAU,UACR,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,EAC/C,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAA;CACtB;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAmB,EACnB,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,GAAG,KAAK,EACT,EAAE,UAAU,2CAcZ;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWzE;AAED,UAAU,iBACR,SAAQ,IAAI,CACV,eAAe,EACf,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CACpD;IACD,KAAK,EAAE,MAAM,CAAA;CACd;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,2CActE;AAED,OAAO,EACL,KAAK,EACL,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,aAAa,EACb,KAAK,YAAY,EACjB,KAAK,iBAAiB,EACtB,KAAK,UAAU,EACf,KAAK,SAAS,GACf,CAAA"}

package/dist/components/ui/alert.js

@@ -1,20 +1,31 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { XIcon } from 'lucide-react';
 import { cn } from '../../lib/utils';
+import { IconButton } from './icon-button';
 import { cva } from 'class-variance-authority';
-const alertVariants = cva('relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current', {
+const alertVariants = cva('relative grid w-full items-start rounded-container border text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 has-[>[data-slot=alert-dismiss]]:pr-10 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current', {
     variants: {
-        variant: {
-            default: 'bg-card text-card-foreground',
-            destructive: 'text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90',
+        tone: {
+            neutral: 'border-border bg-card text-card-foreground',
+            info: 'border-ring/35 bg-ring/8 text-foreground [&>svg]:text-ring',
+            success: 'border-success/35 bg-success/10 text-foreground [&>svg]:text-success',
+            warning: 'border-warning/40 bg-warning/12 text-foreground [&>svg]:text-warning',
+            danger: 'border-destructive/35 bg-destructive/8 text-destructive [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90',
+        },
+        density: {
+            compact: 'gap-y-0 px-3 py-2 text-xs',
+            default: 'gap-y-0.5 px-4 py-3 text-sm',
         },
     },
     defaultVariants: {
-        variant: 'default',
+        tone: 'neutral',
+        density: 'default',
     },
 });
-function Alert({ className, variant, ...props }) {
-    return (_jsx("div", { "data-slot": "alert", role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
+function Alert({ className, density = 'default', role, tone, variant, ...props }) {
+    const resolvedTone = tone ?? (variant === 'destructive' ? 'danger' : 'neutral');
+    return (_jsx("div", { "data-slot": "alert", "data-tone": resolvedTone, "data-density": density, role: role ?? (resolvedTone === 'danger' ? 'alert' : 'status'), className: cn(alertVariants({ tone: resolvedTone, density }), className), ...props }));
 }
 function AlertTitle({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-title", className: cn('col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight', className), ...props }));
@@ -22,4 +33,10 @@ function AlertTitle({ className, ...props }) {
 function AlertDescription({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-description", className: cn('text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed', className), ...props }));
 }
-export { Alert, AlertTitle, AlertDescription };
+function AlertActions({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "alert-actions", className: cn('col-start-2 mt-2 flex flex-wrap items-center gap-1.5', className), ...props }));
+}
+function AlertDismiss({ className, label, ...props }) {
+    return (_jsx(IconButton, { "data-slot": "alert-dismiss", label: label, tooltip: true, variant: "ghost", size: "xs", className: cn('absolute right-2 top-2', className), ...props, children: _jsx(XIcon, {}) }));
+}
+export { Alert, AlertActions, AlertDescription, AlertDismiss, AlertTitle, alertVariants, };