cencori 1.4.0 → 1.4.1

package/dist/react/index.js

@@ -20,14 +20,352 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/react/index.ts
 var react_exports = {};
 __export(react_exports, {
+  Chat: () => Chat,
+  SpeakButton: () => SpeakButton,
   VisionFormatBanner: () => VisionFormatBanner,
-  VisionUploader: () => VisionUploader
+  VisionUploader: () => VisionUploader,
+  VoiceRecorder: () => VoiceRecorder,
+  useMemory: () => useMemory,
+  useVoiceRecorder: () => useVoiceRecorder
 });
 module.exports = __toCommonJS(react_exports);
 
-// src/react/vision/vision-format-banner.tsx
+// src/react/chat/chat.tsx
+var import_react = require("react");
 var import_lucide_react = require("lucide-react");
 var import_jsx_runtime = require("react/jsx-runtime");
+var DEFAULT_BASE_URL = "https://cencori.com";
+function Chat({
+  model,
+  apiKey,
+  memory,
+  system,
+  initialMessages,
+  temperature,
+  maxTokens,
+  stream = true,
+  baseUrl = DEFAULT_BASE_URL,
+  placeholder = "Send a message\u2026",
+  onMemoryRetrieved,
+  onError,
+  emptyState,
+  className,
+  hideMemoryIndicator = false
+}) {
+  const [messages, setMessages] = (0, import_react.useState)(initialMessages ?? []);
+  const [input, setInput] = (0, import_react.useState)("");
+  const [busy, setBusy] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
+  const [recalled, setRecalled] = (0, import_react.useState)(null);
+  const scrollRef = (0, import_react.useRef)(null);
+  const endpoint = (0, import_react.useMemo)(
+    () => `${baseUrl.replace(/\/$/, "")}/api/v1/chat/completions`,
+    [baseUrl]
+  );
+  (0, import_react.useEffect)(() => {
+    scrollRef.current?.scrollTo({ top: scrollRef.current.scrollHeight, behavior: "smooth" });
+  }, [messages, busy]);
+  const send = (0, import_react.useCallback)(
+    async (text) => {
+      const trimmed = text.trim();
+      if (!trimmed || busy) return;
+      setError(null);
+      setBusy(true);
+      const userMsg = { role: "user", content: trimmed };
+      const history = [...messages, userMsg];
+      setMessages(history);
+      setInput("");
+      const outbound = system ? [{ role: "system", content: system }, ...history] : history;
+      const body = {
+        model,
+        messages: outbound,
+        memory,
+        temperature,
+        max_tokens: maxTokens,
+        stream
+      };
+      const headers = { "Content-Type": "application/json" };
+      if (apiKey) headers["CENCORI_API_KEY"] = apiKey;
+      try {
+        const res = await fetch(endpoint, {
+          method: "POST",
+          headers,
+          body: JSON.stringify(body)
+        });
+        if (!res.ok || stream && !res.body) {
+          const data = await res.json().catch(() => ({}));
+          const msg = typeof data.error === "object" ? data.error?.message : data.error;
+          throw new Error(msg || `Cencori API error (${res.status})`);
+        }
+        if (memory && !hideMemoryIndicator) {
+          const count = Number(res.headers.get("X-Cencori-Memory-Retrieved") || 0);
+          setRecalled(count);
+          onMemoryRetrieved?.(count);
+        }
+        if (stream && res.body) {
+          setMessages((prev) => [...prev, { role: "assistant", content: "" }]);
+          const reader = res.body.getReader();
+          const decoder = new TextDecoder();
+          let buffer = "";
+          for (; ; ) {
+            const { done, value } = await reader.read();
+            if (done) break;
+            buffer += decoder.decode(value, { stream: true });
+            const lines = buffer.split("\n");
+            buffer = lines.pop() ?? "";
+            for (const line of lines) {
+              const t = line.trim();
+              if (!t.startsWith("data: ")) continue;
+              const payload = t.slice(6);
+              if (payload === "[DONE]") break;
+              try {
+                const parsed = JSON.parse(payload);
+                const delta = parsed.choices?.[0]?.delta?.content ?? "";
+                if (!delta) continue;
+                setMessages((prev) => {
+                  const next = [...prev];
+                  const last = next[next.length - 1];
+                  if (last?.role === "assistant") {
+                    next[next.length - 1] = {
+                      ...last,
+                      content: last.content + delta
+                    };
+                  }
+                  return next;
+                });
+              } catch {
+              }
+            }
+          }
+        } else {
+          const data = await res.json();
+          const reply = data.choices?.[0]?.message?.content ?? "";
+          setMessages((prev) => [...prev, { role: "assistant", content: reply }]);
+        }
+      } catch (err) {
+        const e = err instanceof Error ? err : new Error(String(err));
+        setError(e.message);
+        onError?.(e);
+        setMessages(
+          (prev) => prev.filter((m, i) => !(i === prev.length - 1 && m.role === "user" && m.content === trimmed))
+        );
+        setInput(trimmed);
+      } finally {
+        setBusy(false);
+      }
+    },
+    [
+      apiKey,
+      busy,
+      endpoint,
+      hideMemoryIndicator,
+      maxTokens,
+      memory,
+      messages,
+      model,
+      onError,
+      onMemoryRetrieved,
+      stream,
+      system,
+      temperature
+    ]
+  );
+  const onSubmit = (e) => {
+    e.preventDefault();
+    void send(input);
+  };
+  const visible = messages.filter((m) => m.role !== "system");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      className: `flex flex-col h-full min-h-[24rem] rounded-xl border border-neutral-200 bg-white dark:border-neutral-800 dark:bg-neutral-950 ${className ?? ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: scrollRef, className: "flex-1 overflow-y-auto p-4 space-y-3", children: [
+          visible.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-full flex items-center justify-center text-sm text-neutral-400", children: emptyState ?? "Start the conversation." }),
+          visible.map((m, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "div",
+            {
+              className: `flex ${m.role === "user" ? "justify-end" : "justify-start"}`,
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: `max-w-[85%] whitespace-pre-wrap rounded-2xl px-3.5 py-2 text-sm ${m.role === "user" ? "bg-neutral-900 text-white dark:bg-white dark:text-neutral-900" : "bg-neutral-100 text-neutral-900 dark:bg-neutral-900 dark:text-neutral-100"}`,
+                  children: m.content || (busy && i === visible.length - 1 ? "\u2026" : "")
+                }
+              )
+            },
+            i
+          ))
+        ] }),
+        memory && !hideMemoryIndicator && recalled !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5 px-4 py-1.5 text-xs text-neutral-500 border-t border-neutral-100 dark:border-neutral-900", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Brain, { className: "h-3.5 w-3.5" }),
+          recalled > 0 ? `Recalled ${recalled} ${recalled === 1 ? "memory" : "memories"} about this user` : "No prior memories yet \u2014 learning"
+        ] }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-4 py-2 text-xs text-red-600 dark:text-red-400", children: error }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "form",
+          {
+            onSubmit,
+            className: "flex items-center gap-2 border-t border-neutral-200 p-3 dark:border-neutral-800",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "input",
+                {
+                  value: input,
+                  onChange: (e) => setInput(e.target.value),
+                  placeholder,
+                  disabled: busy,
+                  className: "flex-1 rounded-lg bg-neutral-100 px-3 py-2 text-sm outline-none placeholder:text-neutral-400 disabled:opacity-60 dark:bg-neutral-900"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "button",
+                {
+                  type: "submit",
+                  disabled: busy || !input.trim(),
+                  className: "inline-flex h-9 w-9 items-center justify-center rounded-lg bg-neutral-900 text-white transition disabled:opacity-40 dark:bg-white dark:text-neutral-900",
+                  "aria-label": "Send",
+                  children: busy ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Send, { className: "h-4 w-4" })
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/react/memory/use-memory.ts
+var import_react2 = require("react");
+var DEFAULT_BASE_URL2 = "https://cencori.com";
+function useMemory(options) {
+  const {
+    userId,
+    sessionId,
+    scope = "user",
+    namespace,
+    apiKey,
+    baseUrl = DEFAULT_BASE_URL2,
+    limit = 50,
+    manual = false
+  } = options;
+  const [memories, setMemories] = (0, import_react2.useState)([]);
+  const [loading, setLoading] = (0, import_react2.useState)(!manual);
+  const [error, setError] = (0, import_react2.useState)(null);
+  const base = (0, import_react2.useMemo)(() => baseUrl.replace(/\/$/, ""), [baseUrl]);
+  const headers = (0, import_react2.useMemo)(() => {
+    const h = { "Content-Type": "application/json" };
+    if (apiKey) h["CENCORI_API_KEY"] = apiKey;
+    return h;
+  }, [apiKey]);
+  const scopeBody = (0, import_react2.useCallback)(
+    () => ({ userId, sessionId, scope, namespace }),
+    [userId, sessionId, scope, namespace]
+  );
+  const request = (0, import_react2.useCallback)(
+    async (path, init) => {
+      const res = await fetch(`${base}${path}`, { ...init, headers });
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({}));
+        throw new Error(data.error?.message || data.message || `Request failed (${res.status})`);
+      }
+      return res.json();
+    },
+    [base, headers]
+  );
+  const refresh = (0, import_react2.useCallback)(async () => {
+    if (!userId && !sessionId) return;
+    setLoading(true);
+    setError(null);
+    try {
+      const params = new URLSearchParams();
+      if (userId) params.set("userId", userId);
+      if (sessionId) params.set("sessionId", sessionId);
+      params.set("scope", scope);
+      if (namespace) params.set("namespace", namespace);
+      params.set("limit", String(limit));
+      const data = await request(
+        `/v1/memory/list?${params.toString()}`,
+        { method: "GET" }
+      );
+      setMemories(data.memories ?? []);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setLoading(false);
+    }
+  }, [userId, sessionId, scope, namespace, limit, request]);
+  (0, import_react2.useEffect)(() => {
+    if (!manual) void refresh();
+  }, [manual, refresh]);
+  const write = (0, import_react2.useCallback)(
+    async (content, opts) => {
+      setError(null);
+      try {
+        await request("/v1/memory/write", {
+          method: "POST",
+          body: JSON.stringify({ ...scopeBody(), content, ...opts })
+        });
+        await refresh();
+      } catch (err) {
+        setError(err instanceof Error ? err.message : String(err));
+        throw err;
+      }
+    },
+    [request, scopeBody, refresh]
+  );
+  const search = (0, import_react2.useCallback)(
+    async (query, topK = 5) => {
+      const data = await request("/v1/memory/search", {
+        method: "POST",
+        body: JSON.stringify({ ...scopeBody(), query, topK })
+      });
+      return data.results ?? [];
+    },
+    [request, scopeBody]
+  );
+  const forget = (0, import_react2.useCallback)(
+    async (id) => {
+      setError(null);
+      setMemories((prev) => prev.filter((m) => m.id !== id));
+      try {
+        await request(`/v1/memory/${id}`, { method: "DELETE" });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : String(err));
+        await refresh();
+        throw err;
+      }
+    },
+    [request, refresh]
+  );
+  const exportAll = (0, import_react2.useCallback)(async () => {
+    const params = new URLSearchParams();
+    if (userId) params.set("userId", userId);
+    if (sessionId) params.set("sessionId", sessionId);
+    params.set("scope", scope);
+    if (namespace) params.set("namespace", namespace);
+    params.set("limit", "1000");
+    const data = await request(
+      `/v1/memory/list?${params.toString()}`,
+      { method: "GET" }
+    );
+    const blob = new Blob([JSON.stringify(data.memories ?? [], null, 2)], {
+      type: "application/json"
+    });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `cencori-memory-${userId ?? sessionId ?? "export"}.json`;
+    a.click();
+    URL.revokeObjectURL(url);
+  }, [request, userId, sessionId, scope, namespace]);
+  return { memories, loading, error, refresh, write, search, forget, exportAll };
+}
+
+// src/react/vision/vision-format-banner.tsx
+var import_lucide_react2 = require("lucide-react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var UNIVERSAL_FORMATS = ["JPEG", "PNG", "WEBP", "GIF"];
 var PROVIDER_LIMITS = {
   openai: { formats: ["JPEG", "PNG", "WEBP", "GIF"], maxMB: 20, notes: "Non-animated GIFs only." },
@@ -46,7 +384,7 @@ function VisionFormatBanner({
   const info = provider ? PROVIDER_LIMITS[provider] : { formats: UNIVERSAL_FORMATS, maxMB: 5, notes: "These formats work across every supported provider." };
   const heading = title ?? (provider ? `Supported for ${providerLabel(provider)}` : "Supported image formats");
   const base = variant === "info" ? "bg-blue-50 border-blue-200 text-blue-900 dark:bg-blue-950/40 dark:border-blue-900 dark:text-blue-100" : "bg-neutral-50 border-neutral-200 text-neutral-800 dark:bg-neutral-900 dark:border-neutral-800 dark:text-neutral-100";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     "div",
     {
       role: "note",
@@ -56,23 +394,23 @@ function VisionFormatBanner({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex-shrink-0 pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Info, { className: "h-5 w-5 opacity-70", "aria-hidden": true }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "font-medium", children: heading }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap gap-1.5", children: info.formats.map((f) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex-shrink-0 pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.Info, { className: "h-5 w-5 opacity-70", "aria-hidden": true }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "font-medium", children: heading }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex flex-wrap gap-1.5", children: info.formats.map((f) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
             "span",
             {
               className: "inline-flex items-center gap-1 rounded-md border border-current/20 bg-white/50 px-2 py-0.5 text-xs font-medium dark:bg-black/20",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ImageIcon, { className: "h-3 w-3 opacity-70", "aria-hidden": true }),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.ImageIcon, { className: "h-3 w-3 opacity-70", "aria-hidden": true }),
                 f
               ]
             },
             f
           )) }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-xs opacity-80", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { className: "text-xs opacity-80", children: [
             "Up to ",
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("strong", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("strong", { children: [
               info.maxMB,
               "MB"
             ] }),
@@ -91,8 +429,8 @@ function providerLabel(p) {
 }
 
 // src/react/vision/vision-uploader.tsx
-var import_react = require("react");
-var import_lucide_react2 = require("lucide-react");
+var import_react3 = require("react");
+var import_lucide_react3 = require("lucide-react");
 
 // src/react/vision/downscale.ts
 var DOWNSCALABLE_TYPES = /* @__PURE__ */ new Set(["image/jpeg", "image/png", "image/webp"]);
@@ -153,7 +491,7 @@ function renameToJpeg(name) {
 }
 
 // src/react/vision/vision-uploader.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var UNIVERSAL_FORMATS2 = ["image/jpeg", "image/png", "image/webp", "image/gif"];
 var PROVIDER_RULES = {
   openai: { formats: UNIVERSAL_FORMATS2, maxBytes: 20 * 1024 * 1024 },
@@ -188,17 +526,17 @@ function VisionUploader({
   headers,
   className
 }) {
-  const [file, setFile] = (0, import_react.useState)(null);
-  const [preview, setPreview] = (0, import_react.useState)(null);
-  const [error, setError] = (0, import_react.useState)(null);
-  const [loading, setLoading] = (0, import_react.useState)(false);
-  const [result, setResult] = (0, import_react.useState)(null);
-  const [dragging, setDragging] = (0, import_react.useState)(false);
-  const [notice, setNotice] = (0, import_react.useState)(null);
-  const inputRef = (0, import_react.useRef)(null);
-  const rules = (0, import_react.useMemo)(() => rulesFor(provider), [provider]);
+  const [file, setFile] = (0, import_react3.useState)(null);
+  const [preview, setPreview] = (0, import_react3.useState)(null);
+  const [error, setError] = (0, import_react3.useState)(null);
+  const [loading, setLoading] = (0, import_react3.useState)(false);
+  const [result, setResult] = (0, import_react3.useState)(null);
+  const [dragging, setDragging] = (0, import_react3.useState)(false);
+  const [notice, setNotice] = (0, import_react3.useState)(null);
+  const inputRef = (0, import_react3.useRef)(null);
+  const rules = (0, import_react3.useMemo)(() => rulesFor(provider), [provider]);
   const targetUrl = task === "analyze" ? endpoint : `${endpoint.replace(/\/$/, "")}/${task}`;
-  const acceptFile = (0, import_react.useCallback)(async (f) => {
+  const acceptFile = (0, import_react3.useCallback)(async (f) => {
     setResult(null);
     setNotice(null);
     let effective = f;
@@ -249,13 +587,13 @@ function VisionUploader({
     setFile(effective);
     setPreview(URL.createObjectURL(effective));
   }, [rules, provider, autoCompress, onError]);
-  const handleDrop = (0, import_react.useCallback)((e) => {
+  const handleDrop = (0, import_react3.useCallback)((e) => {
     e.preventDefault();
     setDragging(false);
     const f = e.dataTransfer.files?.[0];
     if (f) acceptFile(f);
   }, [acceptFile]);
-  const handleSubmit = (0, import_react.useCallback)(async () => {
+  const handleSubmit = (0, import_react3.useCallback)(async () => {
     if (!file) return;
     setLoading(true);
     setError(null);
@@ -292,7 +630,7 @@ function VisionUploader({
       setLoading(false);
     }
   }, [file, prompt, model, task, targetUrl, apiKey, headers, onResult, onError]);
-  const clear = (0, import_react.useCallback)(() => {
+  const clear = (0, import_react3.useCallback)(() => {
     setFile(null);
     setPreview(null);
     setResult(null);
@@ -300,9 +638,9 @@ function VisionUploader({
     setNotice(null);
     if (inputRef.current) inputRef.current.value = "";
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: joinClasses2("flex flex-col gap-3", className), children: [
-    !hideBanner && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VisionFormatBanner, { provider }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: joinClasses2("flex flex-col gap-3", className), children: [
+    !hideBanner && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(VisionFormatBanner, { provider }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
       "div",
       {
         onDragOver: (e) => {
@@ -320,9 +658,9 @@ function VisionUploader({
           dragging ? "border-blue-500 bg-blue-50 dark:bg-blue-950/30" : "border-neutral-300 hover:border-neutral-400 dark:border-neutral-700 dark:hover:border-neutral-600"
         ),
         children: [
-          preview ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "relative", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("img", { src: preview, alt: "Preview", className: "max-h-64 rounded-lg object-contain" }),
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          preview ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "relative", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("img", { src: preview, alt: "Preview", className: "max-h-64 rounded-lg object-contain" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
               "button",
               {
                 type: "button",
@@ -332,19 +670,19 @@ function VisionUploader({
                 },
                 className: "absolute -right-2 -top-2 rounded-full bg-white p-1 shadow ring-1 ring-neutral-200 hover:bg-neutral-100 dark:bg-neutral-900 dark:ring-neutral-700",
                 "aria-label": "Remove image",
-                children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.X, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.X, { className: "h-4 w-4" })
               }
             )
-          ] }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.Upload, { className: "h-8 w-8 text-neutral-400", "aria-hidden": true }),
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "text-sm font-medium", children: "Drop an image or click to upload" }),
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { className: "text-xs text-neutral-500", children: [
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.Upload, { className: "h-8 w-8 text-neutral-400", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "text-sm font-medium", children: "Drop an image or click to upload" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("p", { className: "text-xs text-neutral-500", children: [
               friendlyFormats(rules.formats),
               " \xB7 up to ",
               formatBytes(rules.maxBytes)
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             "input",
             {
               ref: inputRef,
@@ -360,15 +698,15 @@ function VisionUploader({
         ]
       }
     ),
-    error && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { role: "alert", className: "flex items-start gap-2 rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-900 dark:border-red-900 dark:bg-red-950/40 dark:text-red-100", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.AlertCircle, { className: "mt-0.5 h-4 w-4 flex-shrink-0", "aria-hidden": true }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "font-medium", children: "Can't process this image" }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "text-xs opacity-90", children: error.message })
+    error && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { role: "alert", className: "flex items-start gap-2 rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-900 dark:border-red-900 dark:bg-red-950/40 dark:text-red-100", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.AlertCircle, { className: "mt-0.5 h-4 w-4 flex-shrink-0", "aria-hidden": true }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "font-medium", children: "Can't process this image" }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "text-xs opacity-90", children: error.message })
       ] })
     ] }),
-    notice && !error && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: notice }),
-    file && !loading && !result && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    notice && !error && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: notice }),
+    file && !loading && !result && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
       "button",
       {
         type: "button",
@@ -377,19 +715,359 @@ function VisionUploader({
         children: "Analyze image"
       }
     ),
-    loading && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "inline-flex items-center gap-2 text-sm text-neutral-600 dark:text-neutral-400", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react2.Loader2, { className: "h-4 w-4 animate-spin", "aria-hidden": true }),
+    loading && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "inline-flex items-center gap-2 text-sm text-neutral-600 dark:text-neutral-400", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.Loader2, { className: "h-4 w-4 animate-spin", "aria-hidden": true }),
       "Analyzing\u2026"
     ] }),
-    result !== null && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "rounded-lg border border-neutral-200 bg-neutral-50 p-3 text-sm dark:border-neutral-800 dark:bg-neutral-900", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "mb-1 text-xs font-medium uppercase text-neutral-500", children: "Result" }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("pre", { className: "overflow-auto whitespace-pre-wrap break-words text-xs", children: typeof result === "string" ? result : JSON.stringify(result, null, 2) })
+    result !== null && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "rounded-lg border border-neutral-200 bg-neutral-50 p-3 text-sm dark:border-neutral-800 dark:bg-neutral-900", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "mb-1 text-xs font-medium uppercase text-neutral-500", children: "Result" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("pre", { className: "overflow-auto whitespace-pre-wrap break-words text-xs", children: typeof result === "string" ? result : JSON.stringify(result, null, 2) })
+    ] })
+  ] });
+}
+
+// src/react/voice/voice-recorder.tsx
+var import_react5 = require("react");
+var import_lucide_react4 = require("lucide-react");
+
+// src/react/voice/use-voice-recorder.ts
+var import_react4 = require("react");
+function pickMimeType() {
+  if (typeof MediaRecorder === "undefined") return void 0;
+  const candidates = ["audio/webm;codecs=opus", "audio/webm", "audio/mp4", "audio/ogg"];
+  return candidates.find((t) => MediaRecorder.isTypeSupported(t));
+}
+function useVoiceRecorder() {
+  const [state, setState] = (0, import_react4.useState)("idle");
+  const [seconds, setSeconds] = (0, import_react4.useState)(0);
+  const [mimeType, setMimeType] = (0, import_react4.useState)(null);
+  const [error, setError] = (0, import_react4.useState)(null);
+  const [blob, setBlob] = (0, import_react4.useState)(null);
+  const recorderRef = (0, import_react4.useRef)(null);
+  const streamRef = (0, import_react4.useRef)(null);
+  const chunksRef = (0, import_react4.useRef)([]);
+  const timerRef = (0, import_react4.useRef)(null);
+  const cleanupStream = (0, import_react4.useCallback)(() => {
+    if (timerRef.current) {
+      clearInterval(timerRef.current);
+      timerRef.current = null;
+    }
+    streamRef.current?.getTracks().forEach((t) => t.stop());
+    streamRef.current = null;
+  }, []);
+  (0, import_react4.useEffect)(() => cleanupStream, [cleanupStream]);
+  const start = (0, import_react4.useCallback)(async () => {
+    setError(null);
+    setBlob(null);
+    setSeconds(0);
+    if (typeof navigator === "undefined" || !navigator.mediaDevices?.getUserMedia) {
+      setState("error");
+      setError("Microphone recording is not supported in this browser.");
+      return;
+    }
+    try {
+      setState("requesting");
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      streamRef.current = stream;
+      const type = pickMimeType();
+      const recorder = new MediaRecorder(stream, type ? { mimeType: type } : void 0);
+      chunksRef.current = [];
+      recorder.ondataavailable = (e) => {
+        if (e.data.size > 0) chunksRef.current.push(e.data);
+      };
+      recorder.start();
+      recorderRef.current = recorder;
+      setMimeType(recorder.mimeType || type || "audio/webm");
+      setState("recording");
+      timerRef.current = setInterval(() => setSeconds((s) => s + 1), 1e3);
+    } catch (e) {
+      cleanupStream();
+      setState("error");
+      setError(e instanceof Error ? e.message : "Could not access the microphone.");
+    }
+  }, [cleanupStream]);
+  const stop = (0, import_react4.useCallback)(() => {
+    const recorder = recorderRef.current;
+    if (!recorder || recorder.state === "inactive") {
+      return Promise.resolve(null);
+    }
+    return new Promise((resolve) => {
+      recorder.onstop = () => {
+        const type = recorder.mimeType || "audio/webm";
+        const recorded = new Blob(chunksRef.current, { type });
+        cleanupStream();
+        recorderRef.current = null;
+        setBlob(recorded);
+        setState("stopped");
+        resolve(recorded);
+      };
+      recorder.stop();
+    });
+  }, [cleanupStream]);
+  const reset = (0, import_react4.useCallback)(() => {
+    cleanupStream();
+    recorderRef.current = null;
+    chunksRef.current = [];
+    setBlob(null);
+    setSeconds(0);
+    setError(null);
+    setState("idle");
+  }, [cleanupStream]);
+  return { state, seconds, mimeType, error, blob, start, stop, reset };
+}
+
+// src/react/voice/voice-recorder.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function joinClasses3(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+function formatClock(total) {
+  const m = Math.floor(total / 60);
+  const s = total % 60;
+  return `${m}:${String(s).padStart(2, "0")}`;
+}
+function VoiceRecorder({
+  endpoint = "/api/ai/audio/transcriptions",
+  apiKey,
+  model = "whisper-1",
+  language,
+  diarize = false,
+  onTranscript,
+  onError,
+  headers,
+  className
+}) {
+  const rec = useVoiceRecorder();
+  const [uploading, setUploading] = (0, import_react5.useState)(false);
+  const [transcript, setTranscript] = (0, import_react5.useState)(null);
+  const [error, setError] = (0, import_react5.useState)(null);
+  const transcribe = (0, import_react5.useCallback)(async (blob) => {
+    setUploading(true);
+    setError(null);
+    try {
+      const form = new FormData();
+      const ext = (blob.type.split("/")[1] || "webm").split(";")[0];
+      form.append("file", blob, `recording.${ext}`);
+      form.append("model", model);
+      form.append("response_format", diarize ? "verbose_json" : "json");
+      if (language) form.append("language", language);
+      if (diarize) form.append("diarize", "true");
+      const res = await fetch(endpoint, {
+        method: "POST",
+        headers: { ...apiKey ? { Authorization: `Bearer ${apiKey}` } : {}, ...headers },
+        body: form
+      });
+      const data = await res.json().catch(() => ({}));
+      if (!res.ok) {
+        const err = {
+          code: typeof data.error === "string" ? data.error : "request_failed",
+          message: typeof data.message === "string" ? data.message : `Transcription failed (${res.status})`
+        };
+        setError(err);
+        onError?.(err);
+        return;
+      }
+      const full = data;
+      setTranscript(full);
+      onTranscript?.(full.text ?? "", full);
+    } catch (e) {
+      const err = { code: "network_error", message: e instanceof Error ? e.message : "Network error" };
+      setError(err);
+      onError?.(err);
+    } finally {
+      setUploading(false);
+    }
+  }, [endpoint, apiKey, model, language, diarize, headers, onTranscript, onError]);
+  const toggle = (0, import_react5.useCallback)(async () => {
+    if (rec.state === "recording") {
+      const blob = await rec.stop();
+      if (blob) await transcribe(blob);
+    } else {
+      setTranscript(null);
+      await rec.start();
+    }
+  }, [rec, transcribe]);
+  const recording = rec.state === "recording";
+  const busy = rec.state === "requesting" || uploading;
+  const activeError = error || (rec.error ? { code: "mic_error", message: rec.error } : null);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: joinClasses3("cencori-voice-recorder", className), style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: toggle,
+          disabled: busy,
+          "aria-label": recording ? "Stop recording" : "Start recording",
+          className: joinClasses3("cencori-voice-btn", recording && "is-recording"),
+          style: {
+            display: "inline-flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: 56,
+            height: 56,
+            borderRadius: "9999px",
+            border: "none",
+            cursor: busy ? "default" : "pointer",
+            background: recording ? "#dc2626" : "#111827",
+            color: "#fff",
+            opacity: busy ? 0.6 : 1,
+            transition: "background 0.15s"
+          },
+          children: busy ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react4.Loader2, { size: 22, className: "animate-spin" }) : recording ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react4.Square, { size: 20 }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react4.Mic, { size: 22 })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", flexDirection: "column" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { fontVariantNumeric: "tabular-nums", fontWeight: 600 }, children: recording ? formatClock(rec.seconds) : uploading ? "Transcribing\u2026" : "Tap to record" }),
+        recording && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { style: { fontSize: 12, color: "#dc2626", display: "inline-flex", alignItems: "center", gap: 6 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { width: 8, height: 8, borderRadius: "9999px", background: "#dc2626", display: "inline-block" } }),
+          "recording"
+        ] })
+      ] })
+    ] }),
+    activeError && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { role: "alert", style: { display: "flex", gap: 8, alignItems: "flex-start", color: "#b91c1c", fontSize: 13 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react4.AlertCircle, { size: 16, style: { flexShrink: 0, marginTop: 2 } }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: activeError.message })
+    ] }),
+    transcript && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "cencori-voice-result", style: { fontSize: 14, lineHeight: 1.5 }, children: transcript.segments && transcript.segments.some((s) => s.speaker) ? transcript.segments.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("p", { style: { margin: "4px 0" }, children: [
+      s.speaker && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("strong", { style: { marginRight: 6 }, children: [
+        s.speaker,
+        ":"
+      ] }),
+      s.text
+    ] }, i)) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { style: { margin: 0 }, children: transcript.text }) })
+  ] });
+}
+
+// src/react/voice/speak-button.tsx
+var import_react6 = require("react");
+var import_lucide_react5 = require("lucide-react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function joinClasses4(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+function SpeakButton({
+  text,
+  endpoint = "/api/ai/audio/speech",
+  apiKey,
+  model = "tts-1",
+  voice,
+  language,
+  label = "Listen",
+  headers,
+  onError,
+  className
+}) {
+  const [state, setState] = (0, import_react6.useState)("idle");
+  const [error, setError] = (0, import_react6.useState)(null);
+  const audioRef = (0, import_react6.useRef)(null);
+  const urlRef = (0, import_react6.useRef)(null);
+  const cleanup = (0, import_react6.useCallback)(() => {
+    if (audioRef.current) {
+      audioRef.current.pause();
+      audioRef.current = null;
+    }
+    if (urlRef.current) {
+      URL.revokeObjectURL(urlRef.current);
+      urlRef.current = null;
+    }
+  }, []);
+  (0, import_react6.useEffect)(() => cleanup, [cleanup]);
+  const play = (0, import_react6.useCallback)(async () => {
+    if (state === "playing") {
+      cleanup();
+      setState("idle");
+      return;
+    }
+    if (!text.trim()) return;
+    setState("loading");
+    setError(null);
+    try {
+      const res = await fetch(endpoint, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...apiKey ? { Authorization: `Bearer ${apiKey}` } : {},
+          ...headers
+        },
+        body: JSON.stringify({ input: text, model, voice, language })
+      });
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({}));
+        const err = {
+          code: typeof data.error === "string" ? data.error : "request_failed",
+          message: typeof data.message === "string" ? data.message : `Speech failed (${res.status})`
+        };
+        setError(err);
+        onError?.(err);
+        setState("idle");
+        return;
+      }
+      const blob = await res.blob();
+      cleanup();
+      const url = URL.createObjectURL(blob);
+      urlRef.current = url;
+      const audio = new Audio(url);
+      audioRef.current = audio;
+      audio.onended = () => {
+        setState("idle");
+        cleanup();
+      };
+      audio.onerror = () => {
+        setState("idle");
+        cleanup();
+      };
+      await audio.play();
+      setState("playing");
+    } catch (e) {
+      const err = { code: "network_error", message: e instanceof Error ? e.message : "Network error" };
+      setError(err);
+      onError?.(err);
+      setState("idle");
+    }
+  }, [state, text, endpoint, apiKey, model, voice, language, headers, onError, cleanup]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { style: { display: "inline-flex", flexDirection: "column", gap: 4 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+      "button",
+      {
+        type: "button",
+        onClick: play,
+        disabled: state === "loading" || !text.trim(),
+        "aria-label": label ?? (state === "playing" ? "Pause" : "Listen"),
+        className: joinClasses4("cencori-speak-btn", className),
+        style: {
+          display: "inline-flex",
+          alignItems: "center",
+          gap: 6,
+          padding: label ? "6px 12px" : 8,
+          borderRadius: 8,
+          border: "1px solid #e5e7eb",
+          background: "#fff",
+          color: "#111827",
+          cursor: state === "loading" ? "default" : "pointer",
+          fontSize: 14,
+          fontWeight: 500
+        },
+        children: [
+          state === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react5.Loader2, { size: 16, className: "animate-spin" }) : state === "playing" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react5.Pause, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react5.Volume2, { size: 16 }),
+          label && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: label })
+        ]
+      }
+    ),
+    error && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { role: "alert", style: { display: "inline-flex", gap: 4, alignItems: "center", color: "#b91c1c", fontSize: 12 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react5.AlertCircle, { size: 13 }),
+      error.message
     ] })
   ] });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Chat,
+  SpeakButton,
   VisionFormatBanner,
-  VisionUploader
+  VisionUploader,
+  VoiceRecorder,
+  useMemory,
+  useVoiceRecorder
 });
 //# sourceMappingURL=index.js.map