fauna-api 0.0.0-stage → 1.0.679

package/dist/src/ui/toast.d.ts

@@ -0,0 +1,7 @@
+type ToastType = 'success' | 'error' | 'warning' | 'info';
+export declare function sendInformaticToast(html: string, type: ToastType, duration?: number): Promise<boolean>;
+export declare function sendProgressToast(html: string): {
+    show: Promise<boolean>;
+    setProgress: (progress: number) => void;
+};
+export {};

package/dist/src/ui/toast.js

@@ -0,0 +1,258 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { createRoot } from "react-dom/client";
+import gsap from "gsap";
+// Per-type palette (baked in — not sourced from host CSS). Each entry is a soft
+// tinted surface with a saturated accent bar + icon so the toast reads clearly
+// on any background.
+const PALETTE = {
+    success: { bg: '#f7fbf8', border: '#d7e8dc', accent: '#2f7d50', icon: 'M20 6 9 17l-5-5' },
+    error: { bg: '#fff8f7', border: '#efd9d6', accent: '#b94b43', icon: 'M18 6 6 18M6 6l12 12' },
+    warning: { bg: '#fffaf0', border: '#ebdfc4', accent: '#9c721e', icon: 'M12 9v4m0 4h.01M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z' },
+    info: { bg: '#f7f9fc', border: '#dce2ea', accent: '#4d6f94', icon: 'M12 16v-4m0-4h.01M22 12a10 10 0 1 1-20 0 10 10 0 0 1 20 0z' },
+};
+const QUEUE = [];
+let ACTIVE = null;
+let PROCESSING = false;
+let listener = null;
+function notify() {
+    listener?.(ACTIVE ? ACTIVE.state : null);
+}
+async function drain() {
+    if (PROCESSING)
+        return;
+    PROCESSING = true;
+    ensureMounted();
+    await MOUNT_READY;
+    while (QUEUE.length > 0) {
+        const build = QUEUE.shift();
+        const toast = build();
+        if (!toast)
+            continue;
+        ACTIVE = toast;
+        notify();
+        try {
+            await toast.done;
+        }
+        catch { /* dismissed */ }
+        ACTIVE = null;
+        notify();
+    }
+    PROCESSING = false;
+}
+// ─── Public API (imperative, unchanged signatures) ────────────────────────────
+export async function sendInformaticToast(html, type, duration = 5000) {
+    return new Promise((resolveShow) => {
+        QUEUE.push(() => {
+            let resolveDone;
+            const done = new Promise((res) => { resolveDone = res; });
+            const toast = {
+                state: { html, type, progress: null },
+                done,
+                resolveDone,
+                resolveShow,
+                dismissed: false,
+            };
+            // Auto-dismiss after `duration` once shown; the component reports the
+            // shown flag and starts the timer via onShown below.
+            toast.autoDismissMs = duration;
+            return toast;
+        });
+        void drain();
+    });
+}
+export function sendProgressToast(html) {
+    let setter = () => { };
+    let current = 0;
+    const show = new Promise((resolveShow) => {
+        QUEUE.push(() => {
+            if (current >= 1) {
+                resolveShow(false);
+                return null;
+            }
+            let resolveDone;
+            const done = new Promise((res) => { resolveDone = res; });
+            const toast = {
+                state: { html, type: 'info', progress: current },
+                done,
+                resolveDone,
+                resolveShow,
+                dismissed: false,
+            };
+            setter = (p) => {
+                const clamped = Math.min(Math.max(p, 0), 1);
+                toast.state = { ...toast.state, progress: clamped };
+                if (ACTIVE === toast)
+                    notify();
+                if (clamped >= 1) {
+                    // Let the filled bar render a beat, then dismiss.
+                    setTimeout(() => { if (ACTIVE === toast)
+                        requestDismiss(toast); }, 250);
+                }
+            };
+            return toast;
+        });
+        void drain();
+    });
+    return {
+        show,
+        setProgress: (p) => { current = p; setter(p); },
+    };
+}
+// ─── Dismiss plumbing ──────────────────────────────────────────────────────────
+function requestDismiss(toast) {
+    if (toast.dismissed)
+        return;
+    toast.dismissed = true;
+    // The component watches for dismiss requests to animate out, then finalizes.
+    DISMISS_LISTENERS.forEach((fn) => fn(toast));
+}
+const DISMISS_LISTENERS = new Set();
+// ─── React component + self-mount ──────────────────────────────────────────────
+const PORTAL_ID = 'fauna-toast-portal';
+let mounted = false;
+let resolveMount = () => { };
+const MOUNT_READY = new Promise((resolve) => { resolveMount = resolve; });
+function ensureMounted() {
+    if (mounted || typeof document === 'undefined')
+        return;
+    mounted = true;
+    const host = document.createElement('div');
+    host.id = PORTAL_ID;
+    Object.assign(host.style, {
+        position: 'fixed',
+        top: 'clamp(14px, 2vw, 22px)',
+        left: '50%',
+        transform: 'translateX(-50%)',
+        zIndex: '2147483647',
+        width: 'min(380px, calc(100vw - 28px))',
+        pointerEvents: 'none',
+    });
+    document.body.appendChild(host);
+    createRoot(host).render(_jsx(ToastRoot, {}));
+}
+function ToastRoot() {
+    const [state, setState] = useState(null);
+    const activeRef = useRef(null);
+    const cardRef = useRef(null);
+    const dismissTimer = useRef(null);
+    // Subscribe the module store to this component instance.
+    useEffect(() => {
+        listener = (s) => {
+            activeRef.current = ACTIVE;
+            setState(s);
+        };
+        if (ACTIVE) {
+            activeRef.current = ACTIVE;
+            setState(ACTIVE.state);
+        }
+        resolveMount();
+        return () => { listener = null; };
+    }, []);
+    const animateOut = (toast) => {
+        const el = cardRef.current;
+        const finish = () => {
+            toast.resolveDone();
+        };
+        if (!el) {
+            finish();
+            return;
+        }
+        gsap.killTweensOf(el);
+        gsap.to(el, {
+            duration: 0.28,
+            x: 18,
+            y: -6,
+            opacity: 0,
+            scale: 0.98,
+            ease: 'power2.in',
+            onComplete: finish,
+        });
+    };
+    // React to external dismiss requests (progress-complete / setProgress).
+    useEffect(() => {
+        const onDismiss = (t) => { if (t === activeRef.current)
+            animateOut(t); };
+        DISMISS_LISTENERS.add(onDismiss);
+        return () => { DISMISS_LISTENERS.delete(onDismiss); };
+    }, []);
+    // Animate in whenever a new active toast appears; arm auto-dismiss.
+    useEffect(() => {
+        if (dismissTimer.current) {
+            clearTimeout(dismissTimer.current);
+            dismissTimer.current = null;
+        }
+        const toast = activeRef.current;
+        const el = cardRef.current;
+        if (!state || !toast || !el)
+            return;
+        gsap.killTweensOf(el);
+        gsap.fromTo(el, { x: 18, y: -6, opacity: 0, scale: 0.98 }, {
+            x: 0,
+            y: 0,
+            opacity: 1,
+            scale: 1,
+            duration: 0.36,
+            ease: 'power3.out',
+            onComplete: () => {
+                toast.resolveShow(true);
+                if (toast.autoDismissMs && toast.state.progress === null) {
+                    dismissTimer.current = setTimeout(() => animateOut(toast), toast.autoDismissMs);
+                }
+            },
+        });
+        return () => { if (dismissTimer.current)
+            clearTimeout(dismissTimer.current); };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [state]);
+    if (!state)
+        return null;
+    const p = PALETTE[state.type];
+    const onClick = () => {
+        const toast = activeRef.current;
+        if (toast)
+            animateOut(toast);
+    };
+    return (_jsxs("div", { ref: cardRef, onClick: onClick, role: "status", "aria-live": "polite", style: {
+            position: 'relative',
+            display: 'flex',
+            alignItems: 'center',
+            gap: 10,
+            width: '100%',
+            boxSizing: 'border-box',
+            padding: '11px 12px',
+            borderRadius: 12,
+            background: p.bg,
+            border: `1px solid ${p.border}`,
+            boxShadow: '0 12px 32px rgba(39, 35, 29, 0.14), 0 2px 8px rgba(39, 35, 29, 0.08)',
+            color: '#292722',
+            fontFamily: 'inherit',
+            fontSize: 13,
+            fontWeight: 500,
+            lineHeight: 1.45,
+            letterSpacing: '0.01em',
+            cursor: 'pointer',
+            pointerEvents: 'auto',
+            opacity: 0,
+            overflow: 'hidden',
+            backdropFilter: 'blur(14px)',
+            WebkitBackdropFilter: 'blur(14px)',
+        }, children: [_jsx("span", { style: {
+                    flex: '0 0 auto',
+                    display: 'grid',
+                    placeItems: 'center',
+                    width: 24,
+                    height: 24,
+                    borderRadius: 999,
+                    background: `${p.accent}18`,
+                    color: p.accent,
+                }, children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.4, strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: p.icon }) }) }), _jsx("span", { style: { flex: 1, minWidth: 0, overflowWrap: 'anywhere' }, dangerouslySetInnerHTML: { __html: state.html } }), _jsx("span", { "aria-hidden": "true", style: { flex: '0 0 auto', color: '#8d8981', fontSize: 16, lineHeight: 1 }, children: "\u00D7" }), state.progress !== null && (_jsx("span", { style: {
+                    position: 'absolute',
+                    left: 0,
+                    bottom: 0,
+                    height: 3,
+                    width: `${Math.round(state.progress * 100)}%`,
+                    background: p.accent,
+                    transition: 'width 0.12s linear',
+                } }))] }));
+}

package/dist/src/ui/tokenText.d.ts

@@ -0,0 +1,18 @@
+export type Token = {
+    type: string;
+    value: string;
+    label: string;
+    icon?: string;
+};
+export type Part = {
+    kind: 'text';
+    text: string;
+} | {
+    kind: 'token';
+    token: Token;
+};
+export declare function encodeToken(token: Token): string;
+export declare function serializeParts(parts: Part[]): string;
+export declare function parseRichText(text: string): Part[];
+export declare function hasTokens(text: string): boolean;
+export declare function toPlainText(text: string): string;

package/dist/src/ui/tokenText.js

@@ -0,0 +1,96 @@
+// Lossless token serialization (DOM-free).
+//
+// A composed message is flattened to a single string (for persistence and for
+// feeding back into the chat log). Tokens emit a self-describing marker carrying
+// the whole Token as base64-encoded JSON: `[[ft:<b64>]]`, fenced by zero-width
+// spaces so it survives round-trips and never trips markdown. `parseRichText`
+// turns the string back into Parts so any consumer hydrates the same chips, and
+// `toPlainText` strips markers down to `@label` (plus `ids` when present) for
+// the LLM / clipboard.
+const TOKEN_MARKER = /\[\[ft:([A-Za-z0-9+/=]+)\]\]/g;
+function encodeUtf8Base64(str) {
+    const bytes = new TextEncoder().encode(str);
+    let binary = '';
+    for (const b of bytes)
+        binary += String.fromCharCode(b);
+    return btoa(binary);
+}
+function decodeUtf8Base64(b64) {
+    const binary = atob(b64);
+    const bytes = new Uint8Array(binary.length);
+    for (let i = 0; i < binary.length; i++)
+        bytes[i] = binary.charCodeAt(i);
+    return new TextDecoder().decode(bytes);
+}
+export function encodeToken(token) {
+    return `\u200B[[ft:${encodeUtf8Base64(JSON.stringify(token))}]]\u200B`;
+}
+export function serializeParts(parts) {
+    return parts.map(p => p.kind === 'text' ? p.text : encodeToken(p.token)).join('');
+}
+export function parseRichText(text) {
+    const parts = [];
+    let lastIndex = 0;
+    const pushText = (raw) => {
+        const clean = raw.replace(/\u200B/g, '');
+        if (clean.length === 0)
+            return;
+        const last = parts[parts.length - 1];
+        if (last && last.kind === 'text')
+            last.text += clean;
+        else
+            parts.push({ kind: 'text', text: clean });
+    };
+    TOKEN_MARKER.lastIndex = 0;
+    let match;
+    while ((match = TOKEN_MARKER.exec(text)) !== null) {
+        pushText(text.slice(lastIndex, match.index));
+        try {
+            parts.push({ kind: 'token', token: JSON.parse(decodeUtf8Base64(match[1])) });
+        }
+        catch {
+            pushText(match[0]);
+        }
+        lastIndex = match.index + match[0].length;
+    }
+    pushText(text.slice(lastIndex));
+    return parts;
+}
+export function hasTokens(text) {
+    TOKEN_MARKER.lastIndex = 0;
+    return TOKEN_MARKER.test(text);
+}
+function expandToken(token) {
+    if (token.type === 'pin') {
+        try {
+            const data = JSON.parse(token.value);
+            const note = typeof data?.note === 'string' && data.note.trim() ? data.note.trim() : token.label;
+            return note ? `@Pin ${note}` : '@Pin';
+        }
+        catch {
+            return token.label ? `@Pin ${token.label}` : '@Pin';
+        }
+    }
+    const label = token.label || token.value;
+    try {
+        const data = JSON.parse(token.value);
+        if (data && Array.isArray(data.ids)) {
+            const ids = data.ids.map(String).filter(Boolean);
+            return ids.length ? `@${label} [${ids.join(', ')}]` : `@${label} (none)`;
+        }
+    }
+    catch { /* not JSON, or no ids */ }
+    return `@${label}`;
+}
+export function toPlainText(text) {
+    return text
+        .replace(TOKEN_MARKER, (_, b64) => {
+        try {
+            return expandToken(JSON.parse(decodeUtf8Base64(b64)));
+        }
+        catch {
+            return '';
+        }
+    })
+        .replace(/\u200B/g, '');
+}

package/dist/src/ui/tokenized.d.ts

@@ -0,0 +1,42 @@
+import { Fauna } from "fauna-api";
+import { type Token, type Part } from "./tokenText.js";
+export type { Token, Part };
+export { encodeToken, serializeParts, parseRichText, hasTokens, toPlainText } from "./tokenText.js";
+export type Suggestion = {
+    label: string;
+    subtitle?: string;
+    icon?: string;
+    image?: string;
+    data?: any;
+};
+export type Trigger = {
+    char: string;
+    type: string;
+    suggest: (query: string) => Promise<Suggestion[]> | Suggestion[];
+    onPick: (s: Suggestion) => Token;
+};
+export declare function createTokenizedInput(container: HTMLElement, options?: Partial<{
+    placeholder: string;
+    triggers: Trigger[];
+    multiline: boolean;
+    onSubmit: (parts: Part[]) => void;
+    onInput: (parts: Part[]) => void;
+}>): {
+    getParts: () => Part[];
+    getText: () => string;
+    setParts: (parts: Part[]) => void;
+    insertToken: (token: Token) => void;
+    clear: () => void;
+    focus: () => void;
+    getElement: () => HTMLElement;
+    setPlaceholder: (text: string) => void;
+};
+/**
+ * `@` mentions. By default it searches every Fauna user; pass `people` (a
+ * group's members, say) to pick only from that list, shown in full as soon as
+ * `@` is typed.
+ */
+export declare function createUserTrigger(credentials: Fauna.Authentification.Credentials, options?: {
+    people?: Fauna.Authentification.Profile[];
+}): Trigger;
+export declare function createDriveTrigger(credentials: Fauna.Authentification.Credentials): Trigger;