@moldable-ai/ui 0.2.19 → 0.2.21

package/dist/components/native-capabilities/midi-monitor.js

@@ -0,0 +1,534 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Music, Plus, Unplug } from 'lucide-react';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { getMoldableMIDIInputs, getMoldableMIDIOutputs, observeMoldableMIDIState, openMoldableMIDIInput, openMoldableMIDIOutput, requestMoldableMIDIWithFallback, } from '../../lib/native-capabilities';
+import { Badge } from '../ui/badge';
+import { Button } from '../ui/button';
+import { Spinner } from '../ui/spinner';
+import { CapabilityBadge } from './capability-badge';
+import { DeviceList, DeviceListEmpty, DeviceListItem } from './device-list';
+import { LiveIndicator } from './live-indicator';
+import { NativeCapabilityPanel, NativeCapabilityPanelAction, NativeCapabilityPanelContent, NativeCapabilityPanelHeader, NativeCapabilityPanelIcon, NativeCapabilityPanelTitle, } from './native-capability-panel';
+import { StreamLog, useStreamLog } from './stream-log';
+const NOTE_NAMES = [
+    'C',
+    'C#',
+    'D',
+    'D#',
+    'E',
+    'F',
+    'F#',
+    'G',
+    'G#',
+    'A',
+    'A#',
+    'B',
+];
+function toError(cause) {
+    return cause instanceof Error ? cause : new Error(String(cause));
+}
+/** Scientific pitch name for a MIDI note number (middle C, 60, is C4). */
+function pitchName(note) {
+    return `${NOTE_NAMES[((note % 12) + 12) % 12]}${Math.floor(note / 12) - 1}`;
+}
+function hexDump(bytes) {
+    return bytes
+        .map((byte) => byte.toString(16).padStart(2, '0').toUpperCase())
+        .join(' ');
+}
+/**
+ * Human-readable summary of a raw MIDI message: note on/off with pitch name,
+ * control change, program change, and pitch bend; anything else as hex.
+ */
+function formatMidiMessage(data) {
+    const bytes = Array.from(data);
+    if (bytes.length === 0)
+        return '(empty)';
+    const [status = 0, first = 0, second = 0] = bytes;
+    if (status < 0x80 || status >= 0xf0)
+        return hexDump(bytes);
+    const channel = (status & 0x0f) + 1;
+    const kind = status & 0xf0;
+    if (kind === 0x90 && second > 0) {
+        return `Note On ${pitchName(first)} (${first}) vel ${second} ch ${channel}`;
+    }
+    if (kind === 0x80 || kind === 0x90) {
+        return `Note Off ${pitchName(first)} (${first}) ch ${channel}`;
+    }
+    if (kind === 0xb0)
+        return `CC ${first} = ${second} ch ${channel}`;
+    if (kind === 0xc0)
+        return `Program Change ${first} ch ${channel}`;
+    if (kind === 0xe0) {
+        return `Pitch Bend ${((second << 7) | first) - 8192} ch ${channel}`;
+    }
+    return hexDump(bytes);
+}
+const DEFAULT_SYSEX_MESSAGE = [0xf0, 0x7e, 0x7f, 0x06, 0x01, 0xf7];
+const ALL_NOTES_OFF_MESSAGE = [0xb0, 0x7b, 0];
+function systemExclusiveBytes(data) {
+    const bytes = Array.from(data);
+    if (bytes.length < 2 ||
+        bytes[0] !== 0xf0 ||
+        bytes.at(-1) !== 0xf7 ||
+        bytes.some((byte) => !Number.isInteger(byte) || byte < 0 || byte > 255)) {
+        throw new TypeError('SysEx data must start with F0 and end with F7.');
+    }
+    return bytes;
+}
+/**
+ * MIDI state machine behind `MidiMonitor`. Handles both transports returned
+ * by `requestMoldableMIDIWithFallback`: Web MIDI (full port enumeration and
+ * state observation) and the desktop bridge (host-owned per-port chooser via
+ * `requestPort`).
+ */
+export function useMoldableMidi(options = {}) {
+    const [status, setStatus] = useState('idle');
+    const [access, setAccess] = useState(null);
+    const [inputs, setInputs] = useState([]);
+    const [outputs, setOutputs] = useState([]);
+    const [openInputIds, setOpenInputIds] = useState([]);
+    const [sysexEnabled, setSysexEnabled] = useState(false);
+    const [error, setError] = useState(null);
+    const { entries, append, clear } = useStreamLog();
+    const generationRef = useRef(0);
+    const transportRef = useRef(null);
+    const openInputsRef = useRef(new Map());
+    const outputsRef = useRef(new Map());
+    const outputClosingRef = useRef(new Map());
+    const nativePortsRef = useRef(new Map());
+    const noteTimersRef = useRef(new Set());
+    const pendingNotesRef = useRef(new Map());
+    const stopStateRef = useRef(null);
+    const onMessageRef = useRef(options.onMessage);
+    onMessageRef.current = options.onMessage;
+    const handleMessage = useCallback((portId, data) => {
+        append({ direction: 'in', data: formatMidiMessage(data) });
+        onMessageRef.current?.(data, portId);
+    }, [append]);
+    const refreshPorts = useCallback((accessValue) => {
+        setInputs(getMoldableMIDIInputs(accessValue).map((input) => ({
+            id: input.id,
+            name: input.name || 'MIDI input',
+            manufacturer: input.manufacturer || undefined,
+        })));
+        setOutputs(getMoldableMIDIOutputs(accessValue).map((output) => ({
+            id: output.id,
+            name: output.name || 'MIDI output',
+            manufacturer: output.manufacturer || undefined,
+        })));
+    }, []);
+    const connect = useCallback(async (connectOptions = {}) => {
+        if (transportRef.current)
+            return;
+        const generation = generationRef.current;
+        setStatus('connecting');
+        setError(null);
+        try {
+            const transport = await requestMoldableMIDIWithFallback({
+                sysex: connectOptions.sysex === true,
+            });
+            if (generationRef.current !== generation)
+                return;
+            transportRef.current = transport;
+            setAccess(transport);
+            if (transport.kind === 'web-midi') {
+                setSysexEnabled(transport.access.sysexEnabled);
+                refreshPorts(transport.access);
+                stopStateRef.current = observeMoldableMIDIState(transport.access, () => refreshPorts(transport.access));
+            }
+            else {
+                // The desktop bridge cannot enumerate ports; they arrive one at a
+                // time through the host-owned chooser (`requestPort`).
+                setSysexEnabled(connectOptions.sysex === true);
+            }
+            setStatus('connected');
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            setError(toError(cause));
+            setStatus('error');
+        }
+    }, [refreshPorts]);
+    /** Desktop-bridge only: opens the host chooser for one input or output. */
+    const requestPort = useCallback(async (kind) => {
+        const transport = transportRef.current;
+        if (!transport || transport.kind !== 'desktop-bridge')
+            return;
+        const generation = generationRef.current;
+        setError(null);
+        try {
+            const port = await transport.access.requestPort(kind);
+            if (generationRef.current !== generation) {
+                void port.close().catch(() => undefined);
+                return;
+            }
+            const previousPort = nativePortsRef.current.get(port.id);
+            if (previousPort && previousPort !== port) {
+                try {
+                    await previousPort.close();
+                }
+                catch (cause) {
+                    void port.close().catch(() => undefined);
+                    if (generationRef.current === generation)
+                        setError(toError(cause));
+                    return;
+                }
+            }
+            nativePortsRef.current.set(port.id, port);
+            const info = {
+                id: port.id,
+                name: port.name || `MIDI ${kind}`,
+            };
+            const update = (previous) => [
+                ...previous.filter((item) => item.id !== info.id),
+                info,
+            ];
+            if (kind === 'input')
+                setInputs(update);
+            else
+                setOutputs(update);
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            setError(toError(cause));
+        }
+    }, []);
+    const openInput = useCallback(async (id) => {
+        const transport = transportRef.current;
+        if (!transport || openInputsRef.current.has(id))
+            return;
+        const generation = generationRef.current;
+        setError(null);
+        try {
+            if (transport.kind === 'web-midi') {
+                const connection = await openMoldableMIDIInput(transport.access, id, (event) => {
+                    if (event.data)
+                        handleMessage(id, new Uint8Array(event.data));
+                });
+                if (generationRef.current !== generation) {
+                    void connection.close().catch(() => undefined);
+                    return;
+                }
+                openInputsRef.current.set(id, () => connection.close());
+            }
+            else {
+                const port = nativePortsRef.current.get(id);
+                if (!port)
+                    return;
+                const stopObserving = port.observeMessages((data) => handleMessage(id, data));
+                openInputsRef.current.set(id, async () => {
+                    stopObserving();
+                });
+            }
+            setOpenInputIds((previous) => previous.includes(id) ? previous : [...previous, id]);
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            setError(toError(cause));
+        }
+    }, [handleMessage]);
+    const closeInput = useCallback(async (id) => {
+        const stop = openInputsRef.current.get(id);
+        if (!stop)
+            return;
+        try {
+            await stop();
+            if (openInputsRef.current.get(id) !== stop)
+                return;
+            openInputsRef.current.delete(id);
+            setOpenInputIds((previous) => previous.filter((value) => value !== id));
+        }
+        catch (cause) {
+            setError(toError(cause));
+        }
+    }, []);
+    const openOutput = useCallback(async (outputId, generation) => {
+        const transport = transportRef.current;
+        if (!transport)
+            return undefined;
+        const existing = outputsRef.current.get(outputId);
+        if (existing)
+            return existing;
+        let handle;
+        if (transport.kind === 'web-midi') {
+            const connection = await openMoldableMIDIOutput(transport.access, outputId);
+            if (generationRef.current !== generation) {
+                void connection.close().catch(() => undefined);
+                return undefined;
+            }
+            handle = {
+                send: (data) => connection.send(data),
+                close: () => connection.close(),
+            };
+        }
+        else {
+            const port = nativePortsRef.current.get(outputId);
+            if (!port)
+                return undefined;
+            handle = {
+                send: (data) => port.send(data),
+                close: () => port.close(),
+                nativePort: port,
+            };
+        }
+        const raced = outputsRef.current.get(outputId);
+        if (raced) {
+            void handle.close().catch(() => undefined);
+            return raced;
+        }
+        outputsRef.current.set(outputId, handle);
+        return handle;
+    }, []);
+    const releaseOutput = useCallback((outputId) => {
+        const pending = outputClosingRef.current.get(outputId);
+        if (pending)
+            return pending;
+        const handle = outputsRef.current.get(outputId);
+        if (!handle)
+            return Promise.resolve(null);
+        const operation = (async () => {
+            try {
+                await handle.close();
+                if (outputsRef.current.get(outputId) !== handle)
+                    return null;
+                outputsRef.current.delete(outputId);
+                if (handle.nativePort &&
+                    nativePortsRef.current.get(outputId) === handle.nativePort) {
+                    nativePortsRef.current.delete(outputId);
+                    setOutputs((previous) => previous.filter((port) => port.id !== outputId));
+                }
+                return null;
+            }
+            catch (cause) {
+                const failure = toError(cause);
+                setError(failure);
+                return failure;
+            }
+        })();
+        const closing = operation.finally(() => {
+            if (outputClosingRef.current.get(outputId) === closing) {
+                outputClosingRef.current.delete(outputId);
+            }
+        });
+        outputClosingRef.current.set(outputId, closing);
+        return closing;
+    }, []);
+    const sendNote = useCallback(async (outputId, note = 60, velocity = 100) => {
+        const generation = generationRef.current;
+        setError(null);
+        try {
+            const handle = await openOutput(outputId, generation);
+            if (!handle)
+                return;
+            const noteOn = [0x90, note, velocity];
+            await handle.send(noteOn);
+            if (generationRef.current !== generation)
+                return;
+            pendingNotesRef.current.set(outputId, (pendingNotesRef.current.get(outputId) ?? 0) + 1);
+            append({ direction: 'out', data: formatMidiMessage(noteOn) });
+            const timer = window.setTimeout(() => {
+                noteTimersRef.current.delete(timer);
+                if (generationRef.current !== generation)
+                    return;
+                const active = outputsRef.current.get(outputId);
+                void (async () => {
+                    try {
+                        if (active) {
+                            const noteOff = [0x80, note, 0];
+                            await active.send(noteOff);
+                            append({ direction: 'out', data: formatMidiMessage(noteOff) });
+                        }
+                    }
+                    catch (cause) {
+                        if (generationRef.current === generation)
+                            setError(toError(cause));
+                    }
+                    finally {
+                        const pending = Math.max(0, (pendingNotesRef.current.get(outputId) ?? 1) - 1);
+                        if (pending === 0) {
+                            pendingNotesRef.current.delete(outputId);
+                            await releaseOutput(outputId);
+                        }
+                        else {
+                            pendingNotesRef.current.set(outputId, pending);
+                        }
+                    }
+                })();
+            }, 200);
+            noteTimersRef.current.add(timer);
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            setError(toError(cause));
+        }
+    }, [append, openOutput, releaseOutput]);
+    const sendSystemExclusive = useCallback(async (outputId, data = DEFAULT_SYSEX_MESSAGE) => {
+        const generation = generationRef.current;
+        setError(null);
+        try {
+            if (!sysexEnabled) {
+                throw new DOMException('Reconnect with SysEx enabled before sending SysEx data.', 'NotAllowedError');
+            }
+            const bytes = systemExclusiveBytes(data);
+            const handle = await openOutput(outputId, generation);
+            if (!handle)
+                return;
+            await handle.send(bytes);
+            if (generationRef.current !== generation)
+                return;
+            append({ direction: 'out', data: formatMidiMessage(bytes) });
+            if ((pendingNotesRef.current.get(outputId) ?? 0) === 0) {
+                await releaseOutput(outputId);
+            }
+        }
+        catch (cause) {
+            if (generationRef.current !== generation)
+                return;
+            setError(toError(cause));
+        }
+    }, [append, openOutput, releaseOutput, sysexEnabled]);
+    const disconnect = useCallback(async () => {
+        generationRef.current++;
+        for (const timer of noteTimersRef.current)
+            window.clearTimeout(timer);
+        noteTimersRef.current.clear();
+        pendingNotesRef.current.clear();
+        stopStateRef.current?.();
+        stopStateRef.current = null;
+        const failures = [];
+        for (const [id, stop] of openInputsRef.current) {
+            try {
+                await stop();
+                if (openInputsRef.current.get(id) === stop) {
+                    openInputsRef.current.delete(id);
+                    setOpenInputIds((previous) => previous.filter((value) => value !== id));
+                }
+            }
+            catch (cause) {
+                failures.push(toError(cause));
+            }
+        }
+        for (const id of [...outputsRef.current.keys()]) {
+            const handle = outputsRef.current.get(id);
+            if (handle) {
+                try {
+                    await handle.send(ALL_NOTES_OFF_MESSAGE);
+                    append({
+                        direction: 'out',
+                        data: formatMidiMessage(ALL_NOTES_OFF_MESSAGE),
+                    });
+                }
+                catch (cause) {
+                    failures.push(toError(cause));
+                }
+            }
+            const failure = await releaseOutput(id);
+            if (failure)
+                failures.push(failure);
+        }
+        for (const [id, port] of nativePortsRef.current) {
+            try {
+                await port.close();
+                if (nativePortsRef.current.get(id) === port) {
+                    nativePortsRef.current.delete(id);
+                }
+            }
+            catch (cause) {
+                failures.push(toError(cause));
+            }
+        }
+        if (failures.length > 0) {
+            setError(failures[0]);
+            setStatus('error');
+            return;
+        }
+        transportRef.current = null;
+        setAccess(null);
+        setInputs([]);
+        setOutputs([]);
+        setOpenInputIds([]);
+        setSysexEnabled(false);
+        setError(null);
+        setStatus('idle');
+    }, [append, releaseOutput]);
+    useEffect(() => {
+        const liveGeneration = generationRef;
+        const liveInputs = openInputsRef;
+        const liveOutputs = outputsRef;
+        const livePorts = nativePortsRef;
+        const liveStopState = stopStateRef;
+        const liveTimers = noteTimersRef;
+        const livePendingNotes = pendingNotesRef;
+        return () => {
+            liveGeneration.current++;
+            for (const timer of liveTimers.current)
+                window.clearTimeout(timer);
+            liveTimers.current.clear();
+            livePendingNotes.current.clear();
+            liveStopState.current?.();
+            liveStopState.current = null;
+            for (const stop of liveInputs.current.values()) {
+                void stop().catch(() => undefined);
+            }
+            liveInputs.current.clear();
+            for (const handle of liveOutputs.current.values()) {
+                void Promise.resolve(handle.send(ALL_NOTES_OFF_MESSAGE))
+                    .catch(() => undefined)
+                    .then(() => handle.close())
+                    .catch(() => undefined);
+            }
+            const outputPorts = new Set([...liveOutputs.current.values()].flatMap((handle) => handle.nativePort ? [handle.nativePort] : []));
+            for (const port of livePorts.current.values()) {
+                if (outputPorts.has(port))
+                    continue;
+                void port.close().catch(() => undefined);
+            }
+            liveOutputs.current.clear();
+            livePorts.current.clear();
+        };
+    }, []);
+    return {
+        status,
+        access,
+        inputs,
+        outputs,
+        openInputIds,
+        sysexEnabled,
+        error,
+        entries,
+        connect,
+        disconnect,
+        requestPort,
+        openInput,
+        closeInput,
+        sendNote,
+        sendSystemExclusive,
+        clearEntries: clear,
+    };
+}
+function MidiPortSection({ label, ports, emptyLabel, onRequestPort, renderAction, isConnected, }) {
+    return (_jsxs("section", { "data-slot": "midi-port-section", className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-muted-foreground text-[10px] font-medium uppercase tracking-wider", children: label }), onRequestPort ? (_jsxs(Button, { variant: "ghost", size: "xs", onClick: onRequestPort, children: [_jsx(Plus, {}), " Add"] })) : null] }), _jsx(DeviceList, { children: ports.length === 0 ? (_jsx(DeviceListEmpty, { children: emptyLabel })) : (ports.map((port) => (_jsx(DeviceListItem, { name: port.name, description: port.manufacturer, connected: isConnected?.(port) ?? false, action: renderAction(port) }, port.id)))) })] }));
+}
+/**
+ * MIDI monitor panel: connect either transport, monitor inputs, fire a test
+ * note at outputs, and read a live parsed-message log.
+ */
+function MidiMonitor({ className, sysex = false, onMessage, ...props }) {
+    const midi = useMoldableMidi({ onMessage });
+    const connecting = midi.status === 'connecting';
+    const connected = midi.access !== null;
+    const native = midi.access?.kind === 'desktop-bridge';
+    return (_jsxs(NativeCapabilityPanel, { "data-slot": "midi-monitor", "data-status": midi.status, className: className, ...props, children: [_jsxs(NativeCapabilityPanelHeader, { children: [_jsx(NativeCapabilityPanelIcon, { children: _jsx(Music, {}) }), _jsx(NativeCapabilityPanelTitle, { children: "MIDI" }), _jsx(CapabilityBadge, { capability: "midi" }), _jsx(NativeCapabilityPanelAction, { children: connected ? (_jsxs(_Fragment, { children: [midi.sysexEnabled ? (_jsx(Badge, { variant: "outline", children: "SysEx" })) : null, _jsxs(Button, { size: "sm", variant: "outline", onClick: () => void midi.disconnect(), children: [_jsx(Unplug, {}), midi.status === 'error' ? 'Retry cleanup' : 'Disconnect'] })] })) : (_jsxs(Button, { size: "sm", disabled: connecting, onClick: () => void midi.connect({ sysex }), children: [connecting ? _jsx(Spinner, {}) : null, connecting ? 'Connecting…' : 'Connect'] })) })] }), _jsx(NativeCapabilityPanelContent, { children: connected ? (_jsxs("div", { className: "animate-in fade-in space-y-4 duration-300 motion-reduce:animate-none", children: [_jsx(MidiPortSection, { label: "Inputs", ports: midi.inputs, emptyLabel: "No inputs", onRequestPort: native ? () => void midi.requestPort('input') : undefined, isConnected: (port) => midi.openInputIds.includes(port.id), renderAction: (port) => {
+                                const open = midi.openInputIds.includes(port.id);
+                                return (_jsx(Button, { variant: "outline", size: "xs", onClick: () => void (open
+                                        ? midi.closeInput(port.id)
+                                        : midi.openInput(port.id)), children: open ? 'Stop' : 'Monitor' }));
+                            } }), _jsx(MidiPortSection, { label: "Outputs", ports: midi.outputs, emptyLabel: "No outputs", onRequestPort: native ? () => void midi.requestPort('output') : undefined, renderAction: (port) => (_jsxs("div", { className: "flex items-center gap-1.5", children: [midi.sysexEnabled ? (_jsx(Button, { variant: "ghost", size: "xs", onClick: () => void midi.sendSystemExclusive(port.id), children: "Send SysEx" })) : null, _jsx(Button, { variant: "outline", size: "xs", onClick: () => void midi.sendNote(port.id, 48 + Math.floor(Math.random() * 25), 96), children: "Send note" })] })) }), midi.error ? (_jsx("p", { className: "text-status-error text-xs", children: midi.error.message })) : null, _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-muted-foreground text-[10px] font-medium uppercase tracking-wider", children: "Messages" }), midi.openInputIds.length > 0 ? _jsx(LiveIndicator, {}) : null] }), _jsx(StreamLog, { entries: midi.entries, maxHeight: 200, emptyLabel: "Waiting for MIDI messages" })] })] })) : (_jsx("div", { className: "animate-in fade-in flex flex-col items-center gap-3 py-6 text-center duration-300 motion-reduce:animate-none", children: connecting ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { className: "text-muted-foreground" }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Requesting MIDI access\u2026" })] })) : midi.status === 'error' ? (_jsxs(_Fragment, { children: [_jsx("p", { className: "text-sm font-medium", children: "MIDI access failed" }), _jsx("p", { className: "text-muted-foreground max-w-64 text-xs", children: midi.error?.message ?? 'The MIDI request failed.' })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "text-muted-foreground bg-background shadow-xs flex size-10 items-center justify-center rounded-lg border [&_svg]:size-5", children: _jsx(Music, {}) }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Connect to list MIDI inputs and outputs." })] })) })) })] }));
+}
+export { MidiMonitor, formatMidiMessage };

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

@@ -0,0 +1,11 @@
+import * as React from 'react';
+declare function NativeCapabilityPanel({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelIcon({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelDescription({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelAction({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelContent({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function NativeCapabilityPanelFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { NativeCapabilityPanel, NativeCapabilityPanelHeader, NativeCapabilityPanelIcon, NativeCapabilityPanelTitle, NativeCapabilityPanelDescription, NativeCapabilityPanelAction, NativeCapabilityPanelContent, NativeCapabilityPanelFooter, };
+//# sourceMappingURL=native-capability-panel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"native-capability-panel.d.ts","sourceRoot":"","sources":["../../../src/components/native-capabilities/native-capability-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,2BAA2B,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,yBAAyB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,0BAA0B,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,gCAAgC,CAAC,EACxC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,2BAA2B,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,4BAA4B,CAAC,EACpC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,2BAA2B,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,OAAO,EACL,qBAAqB,EACrB,2BAA2B,EAC3B,yBAAyB,EACzB,0BAA0B,EAC1B,gCAAgC,EAChC,2BAA2B,EAC3B,4BAA4B,EAC5B,2BAA2B,GAC5B,CAAA"}

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

@@ -0,0 +1,28 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../lib/utils';
+function NativeCapabilityPanel({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel", className: cn('bg-card text-card-foreground shadow-xs flex flex-col overflow-hidden rounded-xl border', className), ...props }));
+}
+function NativeCapabilityPanelHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-header", className: cn('flex items-center gap-2.5 border-b px-4 py-3', className), ...props }));
+}
+function NativeCapabilityPanelIcon({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-icon", className: cn("text-muted-foreground bg-muted/50 flex size-7 shrink-0 items-center justify-center rounded-md border [&_svg:not([class*='size-'])]:size-3.5", className), ...props }));
+}
+function NativeCapabilityPanelTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-title", className: cn('text-sm font-medium leading-none', className), ...props }));
+}
+function NativeCapabilityPanelDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-description", className: cn('text-muted-foreground mt-1 text-xs', className), ...props }));
+}
+function NativeCapabilityPanelAction({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-action", className: cn('ml-auto flex shrink-0 items-center gap-2', className), ...props }));
+}
+function NativeCapabilityPanelContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-content", className: cn('flex-1 p-4', className), ...props }));
+}
+function NativeCapabilityPanelFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "native-capability-panel-footer", className: cn('text-muted-foreground bg-muted/30 flex items-center gap-2 border-t px-4 py-2 text-xs', className), ...props }));
+}
+export { NativeCapabilityPanel, NativeCapabilityPanelHeader, NativeCapabilityPanelIcon, NativeCapabilityPanelTitle, NativeCapabilityPanelDescription, NativeCapabilityPanelAction, NativeCapabilityPanelContent, NativeCapabilityPanelFooter, };

package/dist/components/native-capabilities/notification-panel.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { type MoldableNotificationOptions } from '../../lib/native-capabilities';
+export type MoldableNotificationPermissionState = 'granted' | 'denied' | 'prompt' | 'unknown';
+export type MoldableNotificationSendStatus = 'idle' | 'sending' | 'sent' | 'error';
+/**
+ * Notification state machine behind `NotificationsPanel`: permission loading,
+ * explicit permission requests, and sends with the library's length limits
+ * enforced by truncation.
+ */
+export declare function useMoldableNotifications(): {
+    permission: MoldableNotificationPermissionState;
+    status: MoldableNotificationSendStatus;
+    sentAt: number | null;
+    error: Error | null;
+    request: () => Promise<MoldableNotificationPermissionState | null>;
+    send: (options: MoldableNotificationOptions) => Promise<boolean>;
+};
+/**
+ * Notification composer panel: permission chip with an inline allow flow, a
+ * compact title/body/silent composer, and delivery feedback.
+ */
+declare function NotificationsPanel({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { NotificationsPanel };
+//# sourceMappingURL=notification-panel.d.ts.map

package/dist/components/native-capabilities/notification-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-panel.d.ts","sourceRoot":"","sources":["../../../src/components/native-capabilities/notification-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,KAAK,2BAA2B,EAOjC,MAAM,+BAA+B,CAAA;AAoBtC,MAAM,MAAM,mCAAmC,GAC3C,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,SAAS,CAAA;AAEb,MAAM,MAAM,8BAA8B,GACtC,MAAM,GACN,SAAS,GACT,MAAM,GACN,OAAO,CAAA;AAEX;;;;GAIG;AACH,wBAAgB,wBAAwB;;;;;mBAuBd,OAAO,CAAC,mCAAmC,GAAG,IAAI,CAAC;oBAazD,2BAA2B,KAAG,OAAO,CAAC,OAAO,CAAC;EAiCjE;AAiBD;;;GAGG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAiH7B;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAA"}