diversion-crumb 0.1.0

package/README.md

@@ -0,0 +1,77 @@
+# @diversion/crumb
+
+Crumb voice assistant SDK. Install in your app, set your API key and **adapters**, and you get a full bakery-style experience: voice + chat widget, cart proposals, navigation, and discounts. The SDK fetches assistant config from the Crumb IaaS backend; later you can customise tools and system prompts via the provider.
+
+## Install
+
+```bash
+pnpm add @diversion/crumb @vapi-ai/web
+```
+
+## Env
+
+- `NEXT_PUBLIC_CRUMB_API_KEY` – Your Crumb API key (from the IaaS provider).
+- `NEXT_PUBLIC_CRUMB_BACKEND_URL` – Crumb backend base URL (e.g. `https://api.crumb.example.com` or `http://localhost:3001` for dev).
+- `NEXT_PUBLIC_VAPI_PUBLIC_KEY` – Your VAPI public key (from the same provider or your own VAPI project).
+
+## Quick start (full UI)
+
+Wrap your app with `CrumbProvider`, pass adapters, and render `<CrumbWidget />`. You get floating voice + chat buttons, sidebar with messages and cart proposal cards (Yes/No), mic selector, and call controls. No extra UI code.
+
+```tsx
+import { CrumbProvider, CrumbWidget } from "@diversion/crumb";
+import { useRouter } from "next/navigation";
+
+function App({ children }) {
+  const router = useRouter();
+  const adapters = {
+    navigate: (path) => router.push(path),
+    applyDiscount: (percent) => { /* update your cart */ },
+    removeFromCart: async (cartItemId) => { /* call your API */ },
+    onCartUpdated: () => { /* reload cart */ },
+  };
+
+  return (
+    <CrumbProvider
+      apiKey={process.env.NEXT_PUBLIC_CRUMB_API_KEY!}
+      backendUrl={process.env.NEXT_PUBLIC_CRUMB_BACKEND_URL!}
+      vapiPublicKey={process.env.NEXT_PUBLIC_VAPI_PUBLIC_KEY!}
+      adapters={adapters}
+    >
+      {children}
+      <CrumbWidget assistantName="Crumb" />
+    </CrumbProvider>
+  );
+}
+```
+
+When the assistant calls `proposeCartUpdate`, the widget shows the proposal cards and Yes/No automatically. Optional: pass `onCartProposal` if you want to show your own UI and call `approveProposal()` / `rejectProposal()` from `useCrumb()`.
+
+## Headless (custom UI)
+
+Use `useCrumb()` and build your own UI:
+
+```tsx
+import { CrumbProvider, useCrumb } from "@diversion/crumb";
+
+// Wrap with CrumbProvider and adapters, then:
+const { status, startCall, endCall, messages, pendingProposal, approveProposal, rejectProposal } = useCrumb();
+```
+
+## Adapters
+
+| Adapter | Required | Description |
+|--------|----------|-------------|
+| `navigate` | Yes | Navigate to a path (e.g. `router.push(path)`). |
+| `onCartProposal` | No | Called when the assistant shows a cart update proposal; show your UI and use `approveProposal()` / `rejectProposal()` from `useCrumb()`. |
+| `applyDiscount` | No | Apply a discount percentage to the cart. |
+| `removeFromCart` | No | Remove a cart item by ID (async). |
+| `onCartUpdated` | No | Called after server-side cart tools run; reload your cart. |
+
+## Provider selection and env
+
+Your IaaS provider may give you an env template based on selected providers (STT, TTS, LLM). Set the variables they provide; the SDK only needs `NEXT_PUBLIC_CRUMB_API_KEY`, `NEXT_PUBLIC_CRUMB_BACKEND_URL`, and `NEXT_PUBLIC_VAPI_PUBLIC_KEY`.
+
+## Scaffolding a new project
+
+For a new Next.js app from scratch, you can use **create-vapi-agent** (`packages/create-agent` in this repo) to scaffold a project with Vapi, shadcn/ui, and a voice agent. For the Crumb IaaS flow (our backend + tools + system prompts), use this SDK instead: install `@diversion/crumb`, add `CrumbProvider` + `CrumbWidget` and adapters, and point env at the Crumb backend.

package/dist/CrumbProvider.d.ts

@@ -0,0 +1,12 @@
+import { type CrumbAdapters, type CrumbContextValue, type CrumbIdentity } from "./types";
+export interface CrumbProviderProps {
+    children: React.ReactNode;
+    apiKey: string;
+    backendUrl: string;
+    vapiPublicKey: string;
+    adapters: CrumbAdapters;
+    identity?: CrumbIdentity;
+}
+export declare function CrumbProvider({ children, apiKey, backendUrl, vapiPublicKey, adapters, identity }: CrumbProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useCrumb(): CrumbContextValue;
+//# sourceMappingURL=CrumbProvider.d.ts.map

package/dist/CrumbProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrumbProvider.d.ts","sourceRoot":"","sources":["../src/CrumbProvider.tsx"],"names":[],"mappings":"AAYA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAMnB,MAAM,SAAS,CAAC;AA8CjB,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,aAAa,CAAC;IACxB,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CAgXpH;AAED,wBAAgB,QAAQ,IAAI,iBAAiB,CAI5C"}

package/dist/CrumbProvider.js

@@ -0,0 +1,394 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useEffect, useRef, useState, } from "react";
+import { fetchAssistantConfig } from "./config";
+import { CLIENT_TOOL_NAMES, } from "./types";
+const SESSION_STORAGE_KEY = "crumb_session_id";
+const MAX_POLICY_DISCOUNT = 20;
+function parseToolArgs(raw) {
+    if (!raw)
+        return {};
+    if (typeof raw === "object")
+        return raw;
+    try {
+        return JSON.parse(raw);
+    }
+    catch {
+        return {};
+    }
+}
+function normalizePath(raw) {
+    const value = String(raw ?? "/").trim();
+    const lower = value.toLowerCase();
+    const aliasMap = {
+        "/home": "/", "/homepage": "/", "home": "/",
+        "/product": "/products", "products": "/products",
+        "/my-orders": "/account", "/orders": "/account", "orders": "/account", "/order-history": "/account",
+    };
+    const aliased = aliasMap[lower] ?? value;
+    const path = aliased.startsWith("/") ? aliased : `/${aliased}`;
+    const blocked = path === "/admin" || path.startsWith("/admin/");
+    return { path, blocked };
+}
+const CrumbContext = createContext(undefined);
+export function CrumbProvider({ children, apiKey, backendUrl, vapiPublicKey, adapters, identity }) {
+    const vapiRef = useRef(null);
+    const isStartingRef = useRef(false);
+    const [status, setStatus] = useState("idle");
+    const [isSpeaking, setIsSpeaking] = useState(false);
+    const [isMuted, setIsMuted] = useState(false);
+    const [messages, setMessages] = useState([]);
+    const [liveTranscript, setLiveTranscript] = useState(null);
+    const [pendingProposal, setPendingProposal] = useState(null);
+    const [conversationId, setConversationId] = useState(null);
+    const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+    const [selectedMicrophoneId, setSelectedMicrophoneId] = useState("");
+    const pendingUserMessageRef = useRef(null);
+    const pendingMicrophoneIdRef = useRef("");
+    const sessionIdRef = useRef(null);
+    const MIC_STORAGE_KEY = "crumb_selected_mic_id";
+    const handleClientToolRef = useRef(async () => { });
+    const onMessageRef = useRef(() => { });
+    const shouldPersistEscalatedRef = useRef(false);
+    const autoMutedForTextRef = useRef(false);
+    const mutedBeforeTextRef = useRef(false);
+    const handleClientTool = useCallback(async (vapi, call) => {
+        const { name } = call.function;
+        const args = parseToolArgs(call.function.arguments);
+        let result = "done";
+        try {
+            switch (name) {
+                case "navigateTo": {
+                    const { path, blocked } = normalizePath(args.path);
+                    if (blocked) {
+                        result = "Admin pages are restricted. I can navigate to public pages only.";
+                        break;
+                    }
+                    adapters.navigate(path);
+                    result = `Navigated to ${path}`;
+                    break;
+                }
+                case "openCartDrawer": {
+                    adapters.navigate("/cart");
+                    result = "Navigated to /cart";
+                    break;
+                }
+                case "removeFromCart": {
+                    const cartItemId = String(args.cartItemId ?? "");
+                    if (adapters.removeFromCart) {
+                        await adapters.removeFromCart(cartItemId);
+                        result = "Removed item from cart";
+                    }
+                    else {
+                        result = "removeFromCart adapter not provided";
+                    }
+                    break;
+                }
+                case "proposeCartUpdate": {
+                    const items = args.items ?? [];
+                    const message = String(args.message ?? "Do you want me to update your cart?");
+                    setPendingProposal({ toolCallId: call.id, message, items });
+                    setIsSidebarOpen(true);
+                    if (adapters.onCartProposal) {
+                        adapters.onCartProposal({ toolCallId: call.id, message, items });
+                    }
+                    result = "Confirmation cards displayed. Ask the customer to confirm or decline.";
+                    break;
+                }
+                case "applyDiscount": {
+                    const percent = Number(args.discountPercent ?? 0);
+                    if (!Number.isFinite(percent) || percent < 0) {
+                        result = "Invalid discount percentage.";
+                        break;
+                    }
+                    const capped = Math.min(percent, MAX_POLICY_DISCOUNT);
+                    if (adapters.applyDiscount) {
+                        adapters.applyDiscount(capped);
+                    }
+                    result = capped > 0 ? `${capped}% discount applied.` : "Discount cleared.";
+                    break;
+                }
+                default:
+                    result = `Unknown client tool: ${name}`;
+            }
+        }
+        catch (err) {
+            result = `Error: ${err instanceof Error ? err.message : "Tool failed"}`;
+        }
+        vapi.send({
+            type: "add-message",
+            message: { role: "tool", tool_call_id: call.id, content: result },
+            triggerResponseEnabled: true,
+        });
+    }, [adapters]);
+    const handleMessage = useCallback((msg) => {
+        if (msg.type === "transcript") {
+            const role = (msg.role ?? "assistant");
+            const content = msg.transcript ?? "";
+            if (msg.transcriptType === "partial") {
+                setLiveTranscript({ role, content });
+            }
+            else if (msg.transcriptType === "final" && content.trim()) {
+                setLiveTranscript(null);
+                setMessages((prev) => [...prev, { id: crypto.randomUUID(), role, content, timestamp: Date.now() }]);
+                if (role === "assistant" && autoMutedForTextRef.current && vapiRef.current) {
+                    vapiRef.current.setMuted(mutedBeforeTextRef.current);
+                    setIsMuted(mutedBeforeTextRef.current);
+                    autoMutedForTextRef.current = false;
+                }
+            }
+            return;
+        }
+        const vapi = vapiRef.current;
+        if (!vapi)
+            return;
+        let callList = [];
+        if (msg.type === "tool-calls" && Array.isArray(msg.toolCallList)) {
+            callList = msg.toolCallList.filter((c) => CLIENT_TOOL_NAMES.has(c.function.name));
+            const overPolicy = msg.toolCallList.some((tc) => {
+                if (tc.function.name !== "requestSupervisorApproval")
+                    return false;
+                const a = parseToolArgs(tc.function.arguments);
+                return Number(a.requestedDiscountPercent) > MAX_POLICY_DISCOUNT;
+            });
+            if (overPolicy && status === "active") {
+                shouldPersistEscalatedRef.current = true;
+                setStatus("escalated");
+                setIsSidebarOpen(true);
+                setLiveTranscript(null);
+                setPendingProposal(null);
+                vapi.stop();
+            }
+        }
+        if (msg.type === "function-call" && msg.functionCall && CLIENT_TOOL_NAMES.has(msg.functionCall.name)) {
+            callList.push({
+                id: msg.functionCall.id ?? crypto.randomUUID(),
+                type: "function",
+                function: { name: msg.functionCall.name, arguments: JSON.stringify(msg.functionCall.parameters) },
+            });
+        }
+        const cartTools = new Set(["addToCart", "updateCartItemQuantity"]);
+        const allCalls = msg.toolCallList ?? (msg.functionCall ? [{ function: { name: msg.functionCall.name } }] : []);
+        if (allCalls.some((c) => cartTools.has(c.function.name)) && adapters.onCartUpdated) {
+            setTimeout(() => adapters.onCartUpdated(), 2000);
+        }
+        for (const call of callList) {
+            void handleClientToolRef.current(vapi, call);
+        }
+    }, [status, adapters]);
+    useEffect(() => {
+        handleClientToolRef.current = handleClientTool;
+    }, [handleClientTool]);
+    useEffect(() => {
+        onMessageRef.current = handleMessage;
+    }, [handleMessage]);
+    const getVapi = useCallback(async () => {
+        if (vapiRef.current)
+            return vapiRef.current;
+        const { default: VapiSDK } = await import("@vapi-ai/web");
+        const instance = new VapiSDK(vapiPublicKey);
+        instance.on("call-start", () => {
+            setStatus("active");
+            if (!pendingUserMessageRef.current)
+                setMessages([]);
+            setLiveTranscript(null);
+            setPendingProposal(null);
+            setIsSidebarOpen(true);
+            if (autoMutedForTextRef.current) {
+                instance.setMuted(true);
+                setIsMuted(true);
+            }
+            if (pendingMicrophoneIdRef.current) {
+                try {
+                    instance.setInputDevicesAsync?.({ audioSource: pendingMicrophoneIdRef.current });
+                }
+                catch { /* ignore */ }
+            }
+            if (pendingUserMessageRef.current) {
+                instance.send({ type: "add-message", message: { role: "user", content: pendingUserMessageRef.current }, triggerResponseEnabled: true });
+                pendingUserMessageRef.current = null;
+            }
+        });
+        instance.on("call-end", () => {
+            if (shouldPersistEscalatedRef.current) {
+                setStatus("escalated");
+                setIsSidebarOpen(true);
+                shouldPersistEscalatedRef.current = false;
+            }
+            else {
+                setStatus("idle");
+                setIsSidebarOpen(false);
+            }
+            setIsSpeaking(false);
+            setIsMuted(false);
+            setLiveTranscript(null);
+            setPendingProposal(null);
+            isStartingRef.current = false;
+        });
+        instance.on("speech-start", () => setIsSpeaking(true));
+        instance.on("speech-end", () => setIsSpeaking(false));
+        instance.on("message", (m) => onMessageRef.current(m));
+        instance.on("error", (err) => {
+            console.error("[Crumb] VAPI error:", err);
+            setStatus("idle");
+            isStartingRef.current = false;
+        });
+        vapiRef.current = instance;
+        return instance;
+    }, [vapiPublicKey]);
+    const startCall = useCallback(async (userName, options) => {
+        if ((!options?.force && status !== "idle") || isStartingRef.current)
+            return;
+        isStartingRef.current = true;
+        setStatus("connecting");
+        try {
+            const vapi = await getVapi();
+            const sessionId = (() => {
+                try {
+                    let id = typeof window !== "undefined" ? localStorage.getItem(SESSION_STORAGE_KEY) : null;
+                    if (!id) {
+                        id = crypto.randomUUID();
+                        if (typeof window !== "undefined")
+                            localStorage.setItem(SESSION_STORAGE_KEY, id);
+                    }
+                    return id;
+                }
+                catch {
+                    return crypto.randomUUID();
+                }
+            })();
+            sessionIdRef.current = sessionId;
+            setConversationId(sessionId);
+            const identityForConfig = {
+                userId: identity?.userId,
+                sessionId: identity?.sessionId ?? sessionId,
+                userName: userName ?? identity?.userName,
+            };
+            const config = await fetchAssistantConfig({
+                apiKey,
+                backendUrl,
+                identity: identityForConfig,
+            });
+            await vapi.start(config);
+        }
+        catch (err) {
+            console.error("[Crumb] startCall error:", err);
+            setStatus("idle");
+        }
+        finally {
+            isStartingRef.current = false;
+        }
+    }, [apiKey, backendUrl, identity, status, getVapi]);
+    const sendTextMessage = useCallback(async (text, options) => {
+        const message = text.trim();
+        if (!message)
+            return;
+        const append = () => setMessages((prev) => [...prev, { id: crypto.randomUUID(), role: "user", content: message, timestamp: Date.now() }]);
+        if (options?.textOnly) {
+            mutedBeforeTextRef.current = isMuted;
+            autoMutedForTextRef.current = true;
+            if (vapiRef.current)
+                vapiRef.current.setMuted(true);
+            setIsMuted(true);
+        }
+        if (status === "idle") {
+            append();
+            pendingUserMessageRef.current = message;
+            await startCall();
+            return;
+        }
+        if (status === "connecting") {
+            append();
+            pendingUserMessageRef.current = message;
+            return;
+        }
+        if (status === "active" && vapiRef.current) {
+            append();
+            vapiRef.current.send({ type: "add-message", message: { role: "user", content: message }, triggerResponseEnabled: true });
+        }
+    }, [status, isMuted, startCall]);
+    const approveProposal = useCallback(() => {
+        setPendingProposal(null);
+        vapiRef.current?.send({
+            type: "add-message",
+            message: { role: "user", content: "Yes, please make those changes to my cart." },
+            triggerResponseEnabled: true,
+        });
+    }, []);
+    const rejectProposal = useCallback(() => {
+        setPendingProposal(null);
+        vapiRef.current?.send({
+            type: "add-message",
+            message: { role: "user", content: "No, keep my cart as it is." },
+            triggerResponseEnabled: true,
+        });
+    }, []);
+    const endCall = useCallback(() => {
+        vapiRef.current?.stop();
+        setStatus("idle");
+    }, []);
+    const toggleMute = useCallback(() => {
+        if (!vapiRef.current)
+            return;
+        const next = !isMuted;
+        vapiRef.current.setMuted(next);
+        setIsMuted(next);
+    }, [isMuted]);
+    const setMicrophoneDevice = useCallback(async (deviceId) => {
+        const id = deviceId.trim();
+        setSelectedMicrophoneId(id);
+        pendingMicrophoneIdRef.current = id;
+        try {
+            if (typeof window !== "undefined")
+                localStorage.setItem(MIC_STORAGE_KEY, id);
+        }
+        catch { /* ignore */ }
+        if (vapiRef.current && status === "active") {
+            try {
+                vapiRef.current.setInputDevicesAsync?.({ audioSource: id });
+            }
+            catch { /* ignore */ }
+        }
+    }, [status]);
+    useEffect(() => {
+        try {
+            if (typeof window !== "undefined") {
+                const saved = localStorage.getItem(MIC_STORAGE_KEY) ?? "";
+                if (saved) {
+                    setSelectedMicrophoneId(saved);
+                    pendingMicrophoneIdRef.current = saved;
+                }
+            }
+        }
+        catch { /* ignore */ }
+    }, []);
+    useEffect(() => () => { vapiRef.current?.stop(); }, []);
+    const value = {
+        status,
+        isSpeaking,
+        isMuted,
+        messages,
+        liveTranscript,
+        pendingProposal,
+        conversationId,
+        isSidebarOpen,
+        startCall,
+        endCall,
+        toggleMute,
+        sendTextMessage,
+        approveProposal,
+        rejectProposal,
+        selectedMicrophoneId,
+        setMicrophoneDevice,
+        openSidebar: () => setIsSidebarOpen(true),
+        closeSidebar: () => setIsSidebarOpen(false),
+        toggleSidebar: () => setIsSidebarOpen((o) => !o),
+    };
+    return _jsx(CrumbContext.Provider, { value: value, children: children });
+}
+export function useCrumb() {
+    const ctx = useContext(CrumbContext);
+    if (!ctx)
+        throw new Error("useCrumb must be used within CrumbProvider");
+    return ctx;
+}

package/dist/CrumbWidget.d.ts

@@ -0,0 +1,12 @@
+export interface CrumbWidgetProps {
+    /** Assistant name shown in the sidebar header */
+    assistantName?: string;
+    /** Optional custom styles merged over defaults */
+    styles?: Partial<{
+        widget: React.CSSProperties;
+        fab: React.CSSProperties;
+        sidebar: React.CSSProperties;
+    }>;
+}
+export declare function CrumbWidget({ assistantName, styles: customStyles }: CrumbWidgetProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CrumbWidget.d.ts.map

package/dist/CrumbWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrumbWidget.d.ts","sourceRoot":"","sources":["../src/CrumbWidget.tsx"],"names":[],"mappings":"AAmMA,MAAM,WAAW,gBAAgB;IAC/B,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kDAAkD;IAClD,MAAM,CAAC,EAAE,OAAO,CAAC;QAAE,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC;QAAC,GAAG,EAAE,KAAK,CAAC,aAAa,CAAC;QAAC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAA;KAAE,CAAC,CAAC;CAC3G;AAED,wBAAgB,WAAW,CAAC,EAAE,aAA2B,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,gBAAgB,2CAoTlG"}

package/dist/CrumbWidget.js

@@ -0,0 +1,248 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCrumb } from "./CrumbProvider";
+const defaultStyles = {
+    widget: {
+        fontFamily: "system-ui, -apple-system, sans-serif",
+        fontSize: "14px",
+        zIndex: 9998,
+    },
+    fab: {
+        position: "fixed",
+        bottom: 24,
+        right: 24,
+        width: 56,
+        height: 56,
+        borderRadius: "50%",
+        border: "1px solid rgba(255,255,255,0.1)",
+        background: "rgba(24,24,27,0.95)",
+        color: "#fff",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        cursor: "pointer",
+        boxShadow: "0 4px 12px rgba(0,0,0,0.3)",
+        transition: "transform 0.2s, opacity 0.3s",
+    },
+    sidebar: {
+        position: "fixed",
+        top: 0,
+        right: 0,
+        width: "min(100vw, 26rem)",
+        height: "100vh",
+        background: "rgba(24,24,27,0.97)",
+        borderLeft: "1px solid rgba(255,255,255,0.08)",
+        boxShadow: "-4px 0 24px rgba(0,0,0,0.2)",
+        display: "flex",
+        flexDirection: "column",
+        transition: "transform 0.3s ease, opacity 0.3s ease",
+    },
+    header: {
+        padding: "12px 14px",
+        borderBottom: "1px solid rgba(255,255,255,0.08)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        gap: 8,
+    },
+    btnIcon: {
+        width: 32,
+        height: 32,
+        borderRadius: "50%",
+        border: "none",
+        background: "transparent",
+        color: "rgba(255,255,255,0.7)",
+        cursor: "pointer",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    msgBubble: (role) => ({
+        padding: "6px 10px",
+        borderRadius: 6,
+        fontSize: 12,
+        marginBottom: 6,
+        maxWidth: "95%",
+        alignSelf: role === "user" ? "flex-end" : "flex-start",
+        background: role === "user" ? "rgba(255,255,255,0.12)" : "rgba(59,130,246,0.2)",
+        color: role === "user" ? "#fff" : "rgb(191,219,254)",
+    }),
+    input: {
+        width: "100%",
+        padding: "8px 12px",
+        borderRadius: 6,
+        border: "1px solid rgba(255,255,255,0.1)",
+        background: "rgba(0,0,0,0.2)",
+        color: "#fff",
+        fontSize: 13,
+        outline: "none",
+    },
+    proposalCard: {
+        padding: 10,
+        borderRadius: 8,
+        border: "1px solid rgba(255,255,255,0.08)",
+        background: "rgba(0,0,0,0.15)",
+        marginBottom: 8,
+    },
+    proposalActions: {
+        display: "flex",
+        gap: 8,
+        marginTop: 10,
+    },
+    btn: (primary) => ({
+        padding: "8px 14px",
+        borderRadius: 6,
+        border: "none",
+        fontSize: 12,
+        fontWeight: 600,
+        cursor: "pointer",
+        background: primary ? "rgba(34,197,94,0.9)" : "rgba(255,255,255,0.1)",
+        color: primary ? "#fff" : "rgba(255,255,255,0.9)",
+    }),
+};
+function MicIcon() {
+    return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M12 2a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V5a3 3 0 0 1 3-3Z" }), _jsx("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }), _jsx("line", { x1: "12", y1: "19", x2: "12", y2: "22" })] }));
+}
+function MicOffIcon() {
+    return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" }), _jsx("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }), _jsx("path", { d: "M5 10v2a7 7 0 0 0 12 5" }), _jsx("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }), _jsx("path", { d: "M12 19v3" }), _jsx("path", { d: "M8 23h8" })] }));
+}
+function PhoneIcon() {
+    return (_jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" }) }));
+}
+function PhoneOffIcon() {
+    return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" }), _jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" })] }));
+}
+function MessageCircleIcon() {
+    return (_jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }));
+}
+function SendIcon() {
+    return (_jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "m22 2-7 20-4-9-9-4Z" }), _jsx("path", { d: "M22 2 11 13" })] }));
+}
+function XIcon() {
+    return (_jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M18 6 6 18" }), _jsx("path", { d: "m6 6 12 12" })] }));
+}
+function LoaderIcon() {
+    return (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { animation: "crumb-spin 0.8s linear infinite" }, children: _jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) }));
+}
+function PersonaPlaceholder({ state }) {
+    const pulse = state === "active" || state === "speaking";
+    return (_jsx("div", { style: {
+            width: 64,
+            height: 64,
+            borderRadius: "50%",
+            background: state === "connecting" ? "rgba(59,130,246,0.3)" : "rgba(255,255,255,0.08)",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            animation: pulse ? "crumb-pulse 1.5s ease-in-out infinite" : undefined,
+        }, children: _jsx(MicIcon, {}) }));
+}
+export function CrumbWidget({ assistantName = "Assistant", styles: customStyles }) {
+    const { status, isSpeaking, isMuted, messages, liveTranscript, pendingProposal, startCall, endCall, toggleMute, sendTextMessage, approveProposal, rejectProposal, selectedMicrophoneId, setMicrophoneDevice, openSidebar, closeSidebar, isSidebarOpen, } = useCrumb();
+    const [isVoiceExpanded, setIsVoiceExpanded] = useState(false);
+    const [isChatExpanded, setIsChatExpanded] = useState(false);
+    const [chatTab, setChatTab] = useState("chat");
+    const [chatDraft, setChatDraft] = useState("");
+    const [micDevices, setMicDevices] = useState([]);
+    const prevStatusRef = useRef(status);
+    const isConnecting = status === "connecting";
+    const isActive = status === "active";
+    const isEscalated = status === "escalated";
+    const convoLine = useMemo(() => {
+        if (liveTranscript?.content.trim()) {
+            const who = liveTranscript.role === "user" ? "You" : assistantName;
+            return `${who}: ${liveTranscript.content.trim()}`;
+        }
+        if (messages.length > 0) {
+            const last = messages[messages.length - 1];
+            const who = last.role === "user" ? "You" : assistantName;
+            return `${who}: ${last.content}`;
+        }
+        if (status === "connecting")
+            return "Connecting…";
+        if (status === "active")
+            return isSpeaking ? "Speaking…" : "Listening…";
+        if (status === "escalated")
+            return "Human agent joining…";
+        return `Hi, I'm ${assistantName} — ask me anything.`;
+    }, [liveTranscript, messages, status, isSpeaking, assistantName]);
+    useEffect(() => {
+        if (typeof navigator !== "undefined" && navigator.mediaDevices?.enumerateDevices) {
+            navigator.mediaDevices.enumerateDevices().then((devices) => {
+                const mics = devices.filter((d) => d.kind === "audioinput").map((d) => ({ deviceId: d.deviceId, label: d.label || `Microphone ${d.deviceId.slice(0, 8)}` }));
+                setMicDevices(mics);
+            });
+        }
+    }, [isChatExpanded || isVoiceExpanded]);
+    useEffect(() => {
+        if (prevStatusRef.current !== "idle" && status === "idle")
+            setIsVoiceExpanded(false);
+        if (status === "escalated") {
+            setIsVoiceExpanded(false);
+            setIsChatExpanded(true);
+            setChatTab("chat");
+        }
+        prevStatusRef.current = status;
+    }, [status]);
+    const handleOpenVoice = useCallback(async () => {
+        setIsChatExpanded(false);
+        setIsVoiceExpanded(true);
+        if (!isActive && !isConnecting && !isEscalated)
+            await startCall();
+    }, [isActive, isConnecting, isEscalated, startCall]);
+    const handleOpenChat = useCallback(() => {
+        setIsVoiceExpanded(false);
+        setIsChatExpanded(true);
+        setChatTab("chat");
+    }, []);
+    const handleSendChat = useCallback(async () => {
+        const t = chatDraft.trim();
+        if (!t)
+            return;
+        setChatDraft("");
+        await sendTextMessage(t, { textOnly: true });
+    }, [chatDraft, sendTextMessage]);
+    const styles = useMemo(() => ({
+        widget: { ...defaultStyles.widget, ...customStyles?.widget },
+        fab: { ...defaultStyles.fab, ...customStyles?.fab },
+        sidebar: { ...defaultStyles.sidebar, ...customStyles?.sidebar },
+    }), [customStyles]);
+    const sidebarVisible = isChatExpanded || isVoiceExpanded;
+    const personaState = isConnecting ? "connecting" : isActive ? (isSpeaking ? "speaking" : "active") : "idle";
+    return (_jsxs("div", { className: "crumb-widget", style: styles.widget, "data-crumb-widget": true, children: [_jsx("style", { children: `
+        @keyframes crumb-spin { to { transform: rotate(360deg); } }
+        @keyframes crumb-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }
+      ` }), _jsx("button", { type: "button", onClick: handleOpenVoice, style: {
+                    ...styles.fab,
+                    opacity: isVoiceExpanded ? 0 : 1,
+                    pointerEvents: isVoiceExpanded ? "none" : "auto",
+                    transform: isVoiceExpanded ? "scale(0.95)" : "scale(1)",
+                }, "aria-label": "Open voice assistant", children: _jsx(MicIcon, {}) }), _jsx("button", { type: "button", onClick: handleOpenChat, style: {
+                    ...styles.fab,
+                    bottom: isVoiceExpanded ? 24 : 96,
+                    opacity: isChatExpanded ? 0 : 1,
+                    pointerEvents: isChatExpanded ? "none" : "auto",
+                    transform: isChatExpanded ? "scale(0.95)" : "scale(1)",
+                }, "aria-label": "Open chat", children: _jsx(MessageCircleIcon, {}) }), _jsxs("div", { style: {
+                    ...styles.sidebar,
+                    transform: sidebarVisible ? "translateX(0)" : "translateX(100%)",
+                    opacity: sidebarVisible ? 1 : 0,
+                    pointerEvents: sidebarVisible ? "auto" : "none",
+                }, children: [_jsxs("div", { style: defaultStyles.header, children: [_jsx("span", { style: { color: "rgba(255,255,255,0.85)", fontWeight: 600, fontSize: 13 }, children: assistantName }), _jsxs("div", { style: { display: "flex", gap: 4 }, children: [_jsx("button", { type: "button", onClick: () => setChatTab((t) => (t === "chat" ? "voice" : "chat")), style: defaultStyles.btnIcon, "aria-label": chatTab === "chat" ? "Switch to voice" : "Switch to chat", children: chatTab === "chat" ? _jsx(MicIcon, {}) : _jsx(MessageCircleIcon, {}) }), _jsx("button", { type: "button", onClick: () => { setIsChatExpanded(false); setIsVoiceExpanded(false); closeSidebar(); }, style: defaultStyles.btnIcon, "aria-label": "Close", children: _jsx(XIcon, {}) })] })] }), pendingProposal && (_jsxs("div", { style: { padding: 12, borderBottom: "1px solid rgba(255,255,255,0.08)" }, children: [_jsx("p", { style: { color: "rgba(255,255,255,0.9)", fontSize: 12, marginBottom: 8 }, children: pendingProposal.message }), _jsx("div", { style: { marginBottom: 8 }, children: pendingProposal.items.map((item, i) => (_jsxs("div", { style: defaultStyles.proposalCard, children: [item.imageUrl && _jsx("img", { src: item.imageUrl, alt: "", style: { width: 40, height: 40, borderRadius: 4, objectFit: "cover", marginRight: 8 } }), _jsx("span", { style: { color: "rgba(255,255,255,0.9)", fontSize: 12 }, children: item.name }), _jsxs("span", { style: { color: "rgba(255,255,255,0.6)", fontSize: 12, marginLeft: 8 }, children: ["$", Number(item.price).toFixed(2)] })] }, i))) }), _jsxs("div", { style: defaultStyles.proposalActions, children: [_jsx("button", { type: "button", onClick: approveProposal, style: defaultStyles.btn(true), children: "Yes" }), _jsx("button", { type: "button", onClick: rejectProposal, style: defaultStyles.btn(false), children: "No" })] })] })), chatTab === "chat" ? (_jsxs(_Fragment, { children: [_jsx("div", { style: { flex: 1, overflow: "auto", padding: 12, display: "flex", flexDirection: "column", minHeight: 0 }, children: messages.length === 0 && !liveTranscript?.content ? (_jsx("p", { style: { color: "rgba(255,255,255,0.5)", fontSize: 11 }, children: "No conversation yet. Type below or open voice." })) : (_jsxs(_Fragment, { children: [messages.map((m) => (_jsxs("div", { style: { ...defaultStyles.msgBubble(m.role), display: "flex", flexDirection: "column", alignItems: m.role === "user" ? "flex-end" : "flex-start" }, children: [_jsxs("span", { style: { opacity: 0.8, marginRight: 4 }, children: [m.role === "user" ? "You" : assistantName, ":"] }), m.content] }, m.id))), liveTranscript?.content?.trim() && (_jsxs("div", { style: { ...defaultStyles.msgBubble(liveTranscript.role), opacity: 0.9 }, children: [_jsxs("span", { style: { opacity: 0.8 }, children: [liveTranscript.role === "user" ? "You" : assistantName, ":"] }), " ", liveTranscript.content] }))] })) }), _jsxs("div", { style: { padding: 12, display: "flex", gap: 8, borderTop: "1px solid rgba(255,255,255,0.08)" }, children: [_jsx("input", { value: chatDraft, onChange: (e) => setChatDraft(e.target.value), onKeyDown: (e) => { if (e.key === "Enter") {
+                                            e.preventDefault();
+                                            handleSendChat();
+                                        } }, placeholder: "Type a message...", style: { ...defaultStyles.input, flex: 1 } }), _jsx("button", { type: "button", onClick: () => handleSendChat(), style: defaultStyles.btnIcon, "aria-label": "Send", children: _jsx(SendIcon, {}) })] })] })) : (_jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", minHeight: 0 }, children: [_jsx("p", { style: { padding: "12px 12px 8px", color: "rgba(255,255,255,0.6)", fontSize: 11, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, title: convoLine, children: convoLine }), _jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: 8, padding: "8px 12px 12px" }, children: [_jsx("button", { type: "button", onClick: isConnecting || isEscalated ? undefined : isActive ? endCall : () => startCall(), disabled: isConnecting || isEscalated, style: { ...defaultStyles.btnIcon, ...(isActive ? { background: "rgba(255,255,255,0.1)", color: "#fff" } : {}) }, "aria-label": isActive ? "End call" : "Start call", children: isConnecting ? _jsx(LoaderIcon, {}) : isActive ? _jsx(PhoneOffIcon, {}) : _jsx(PhoneIcon, {}) }), micDevices.length > 0 && (_jsx("select", { value: selectedMicrophoneId || micDevices[0]?.deviceId, onChange: (e) => setMicrophoneDevice(e.target.value), style: { ...defaultStyles.input, width: 140, padding: "6px 8px" }, children: micDevices.map((d) => (_jsx("option", { value: d.deviceId, children: d.label }, d.deviceId))) })), _jsx(PersonaPlaceholder, { state: personaState }), isActive && (_jsx("button", { type: "button", onClick: toggleMute, style: defaultStyles.btnIcon, "aria-label": isMuted ? "Unmute" : "Mute", children: isMuted ? _jsx(MicOffIcon, {}) : _jsx(MicIcon, {}) }))] }), _jsx("div", { style: { flex: 1, overflow: "auto", padding: 12 }, children: messages.length === 0 && !liveTranscript?.content ? (_jsx("p", { style: { color: "rgba(255,255,255,0.5)", fontSize: 11 }, children: "No voice conversation yet." })) : (messages.map((m) => (_jsxs("div", { style: { ...defaultStyles.msgBubble(m.role) }, children: [_jsxs("span", { style: { opacity: 0.8 }, children: [m.role === "user" ? "You" : assistantName, ":"] }), " ", m.content] }, m.id)))) })] }))] }), isVoiceExpanded && (_jsxs("div", { style: {
+                    position: "fixed",
+                    bottom: 12,
+                    left: "50%",
+                    transform: "translateX(-50%)",
+                    width: "min(100vw - 16px, 272px)",
+                    padding: "6px 10px 10px",
+                    borderRadius: 12,
+                    border: "1px solid rgba(255,255,255,0.06)",
+                    background: "rgba(24,24,27,0.95)",
+                    boxShadow: "0 4px 12px rgba(0,0,0,0.2)",
+                    zIndex: 9998,
+                }, children: [_jsx("p", { style: { textAlign: "center", color: "rgba(255,255,255,0.6)", fontSize: 11, marginBottom: 6 }, title: convoLine, children: convoLine }), _jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: 8 }, children: [_jsx("button", { type: "button", onClick: isConnecting || isEscalated ? undefined : isActive ? endCall : () => startCall(), disabled: isConnecting || isEscalated, style: { ...defaultStyles.btnIcon, ...(isActive ? { background: "rgba(255,255,255,0.1)" } : {}) }, children: isConnecting ? _jsx(LoaderIcon, {}) : isActive ? _jsx(PhoneOffIcon, {}) : _jsx(PhoneIcon, {}) }), micDevices.length > 0 && (_jsx("select", { value: selectedMicrophoneId || micDevices[0]?.deviceId, onChange: (e) => setMicrophoneDevice(e.target.value), style: { ...defaultStyles.input, width: 120, padding: "4px 6px" }, children: micDevices.map((d) => (_jsx("option", { value: d.deviceId, children: d.label }, d.deviceId))) })), _jsx(PersonaPlaceholder, { state: personaState }), isActive && (_jsx("button", { type: "button", onClick: toggleMute, style: defaultStyles.btnIcon, children: isMuted ? _jsx(MicOffIcon, {}) : _jsx(MicIcon, {}) }))] })] }))] }));
+}

package/dist/config.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Fetch assistant config from the Crumb IaaS backend.
+ */
+export interface FetchConfigParams {
+    apiKey: string;
+    backendUrl: string;
+    identity?: {
+        userId?: string;
+        sessionId?: string;
+        userName?: string;
+    };
+}
+export declare function fetchAssistantConfig(params: FetchConfigParams): Promise<Record<string, unknown>>;
+//# sourceMappingURL=config.d.ts.map

package/dist/config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE;QAAE,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACvE;AAED,wBAAsB,oBAAoB,CAAC,MAAM,EAAE,iBAAiB,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAetG"}

package/dist/config.js

@@ -0,0 +1,21 @@
+/**
+ * Fetch assistant config from the Crumb IaaS backend.
+ */
+export async function fetchAssistantConfig(params) {
+    const { apiKey, backendUrl, identity } = params;
+    const base = backendUrl.replace(/\/$/, "");
+    const url = new URL("/api/vapi/config", base);
+    url.searchParams.set("apiKey", apiKey);
+    if (identity?.userId)
+        url.searchParams.set("userId", identity.userId);
+    if (identity?.sessionId)
+        url.searchParams.set("sessionId", identity.sessionId);
+    if (identity?.userName)
+        url.searchParams.set("userName", identity.userName);
+    const res = await fetch(url.toString());
+    if (!res.ok) {
+        const err = await res.json().catch(() => ({}));
+        throw new Error(err?.error ?? `Config fetch failed: ${res.status}`);
+    }
+    return res.json();
+}

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export { CrumbProvider, useCrumb } from "./CrumbProvider";
+export { CrumbWidget } from "./CrumbWidget";
+export type { CrumbWidgetProps } from "./CrumbWidget";
+export { fetchAssistantConfig } from "./config";
+export type { CrumbAdapters, CrumbContextValue, CrumbIdentity, CrumbStatus, CartProposalPayload, CartProposalItem, ChatMessage, } from "./types";
+export { CLIENT_TOOL_NAMES } from "./types";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAChD,YAAY,EACV,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,mBAAmB,EACnB,gBAAgB,EAChB,WAAW,GACZ,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,4 @@
+export { CrumbProvider, useCrumb } from "./CrumbProvider";
+export { CrumbWidget } from "./CrumbWidget";
+export { fetchAssistantConfig } from "./config";
+export { CLIENT_TOOL_NAMES } from "./types";

package/dist/types.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Adapter types: the host app implements these so the SDK can manipulate the site
+ * without assuming routes or cart implementation.
+ */
+export interface CrumbAdapters {
+    /** Navigate to a path (e.g. router.push(path) or window.location) */
+    navigate: (path: string) => void;
+    /** Optional: show a cart update proposal; host calls approveProposal() / rejectProposal() from context */
+    onCartProposal?: (payload: CartProposalPayload) => void;
+    /** Optional: apply a discount percentage to the cart */
+    applyDiscount?: (percent: number) => void;
+    /** Optional: remove a cart item by ID; return when done so SDK can send result to VAPI */
+    removeFromCart?: (cartItemId: string) => Promise<void>;
+    /** Optional: called when server-side cart tools (addToCart, updateCartItemQuantity) ran; host can reload cart */
+    onCartUpdated?: () => void;
+}
+export interface CartProposalPayload {
+    toolCallId: string;
+    message: string;
+    items: CartProposalItem[];
+}
+export interface CartProposalItem {
+    variantId?: string;
+    name: string;
+    price: number;
+    imageUrl?: string;
+    action?: "add" | "remove" | "replace";
+}
+export interface CrumbIdentity {
+    userId?: string;
+    sessionId?: string;
+    userName?: string;
+}
+export type CrumbStatus = "idle" | "connecting" | "active" | "escalated";
+export interface CrumbContextValue {
+    status: CrumbStatus;
+    isSpeaking: boolean;
+    isMuted: boolean;
+    messages: ChatMessage[];
+    liveTranscript: {
+        role: "user" | "assistant";
+        content: string;
+    } | null;
+    pendingProposal: CartProposalPayload | null;
+    conversationId: string | null;
+    isSidebarOpen: boolean;
+    startCall: (userName?: string, options?: {
+        force?: boolean;
+    }) => Promise<void>;
+    endCall: () => void;
+    toggleMute: () => void;
+    sendTextMessage: (text: string, options?: {
+        textOnly?: boolean;
+    }) => Promise<void>;
+    approveProposal: () => void;
+    rejectProposal: () => void;
+    selectedMicrophoneId: string;
+    setMicrophoneDevice: (deviceId: string) => Promise<void>;
+    openSidebar: () => void;
+    closeSidebar: () => void;
+    toggleSidebar: () => void;
+}
+export interface ChatMessage {
+    id: string;
+    role: "user" | "assistant";
+    content: string;
+    timestamp: number;
+}
+/** Client tool names the SDK handles locally (no server URL in config) */
+export declare const CLIENT_TOOL_NAMES: Set<string>;
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,aAAa;IAC5B,qEAAqE;IACrE,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,0GAA0G;IAC1G,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACxD,wDAAwD;IACxD,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,0FAA0F;IAC1F,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,iHAAiH;IACjH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,gBAAgB,EAAE,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,SAAS,CAAC;CACvC;AAED,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,YAAY,GAAG,QAAQ,GAAG,WAAW,CAAC;AAEzE,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,WAAW,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,cAAc,EAAE;QAAE,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACvE,eAAe,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAC5C,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACnF,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACzD,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,0EAA0E;AAC1E,eAAO,MAAM,iBAAiB,aAM5B,CAAC"}

package/dist/types.js

@@ -0,0 +1,12 @@
+/**
+ * Adapter types: the host app implements these so the SDK can manipulate the site
+ * without assuming routes or cart implementation.
+ */
+/** Client tool names the SDK handles locally (no server URL in config) */
+export const CLIENT_TOOL_NAMES = new Set([
+    "navigateTo",
+    "openCartDrawer",
+    "removeFromCart",
+    "proposeCartUpdate",
+    "applyDiscount",
+]);

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "diversion-crumb",
+  "version": "0.1.0",
+  "description": "Crumb voice assistant SDK – connect your site to the Crumb IaaS backend via adapters",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": ["dist"],
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "pnpm run build"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "@vapi-ai/web": ">=2.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19",
+    "@vapi-ai/web": "^2.5.2",
+    "react": "19.2.3",
+    "tsup": "^8.3.5",
+    "typescript": "^5"
+  }
+}