@akropolys/kiku 1.6.7 → 1.6.9

package/dist/index.js

@@ -89,7 +89,7 @@ function SearchBar({
   }, []);
   const handleSelect = (r) => {
     if (query.trim()) {
-      client.api.searchVector(query, 1).catch(() => {
+      client.api.searchVector(query, 1, void 0, true).catch(() => {
       });
     }
     ignoreNextQueryChange.current = true;
@@ -99,7 +99,7 @@ function SearchBar({
   };
   const handleCommitSearch = () => {
     if (!query.trim()) return;
-    client.api.searchVector(query, 1).catch(() => {
+    client.api.searchVector(query, 1, void 0, true).catch(() => {
     });
     if (results.length > 0) {
       handleSelect(results[0]);
@@ -1189,6 +1189,7 @@ var ArrowUpIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", {
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "m5 12 7-7 7 7" }),
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 19V5" })
 ] });
+var StopIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "5", y: "5", width: "14", height: "14", rx: "2" }) });
 var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
@@ -1199,7 +1200,6 @@ var HistoryIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { w
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 3v5h5" }),
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 7v5l4 2" })
 ] });
-var NewChatIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 5v14M5 12h14" }) });
 var BookmarkIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M19 21 12 16l-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z" }) });
 var TrashIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 6h18" }),
@@ -1225,8 +1225,6 @@ var DEFAULT_CHIPS = [
   "Noise-cancelling headphones",
   "Best laptop for students"
 ];
-var SESSIONS_KEY = "akropolys_chat_sessions";
-var MAX_SESSIONS = 20;
 function parseAtKiku(raw) {
   const trimmed = raw.trim();
   if (!/^@kiku\b/i.test(trimmed)) return null;
@@ -1379,33 +1377,7 @@ function AtPickerMenu({ onSelect, onDismiss }) {
     }
   );
 }
-function loadSessions() {
-  try {
-    if (typeof window === "undefined") return [];
-    const raw = localStorage.getItem(SESSIONS_KEY);
-    return raw ? JSON.parse(raw) : [];
-  } catch {
-    return [];
-  }
-}
-function saveSessions(sessions) {
-  try {
-    if (typeof window === "undefined") return;
-    localStorage.setItem(SESSIONS_KEY, JSON.stringify(sessions.slice(0, MAX_SESSIONS)));
-  } catch {
-  }
-}
-function relativeTime(ts) {
-  const diff = Date.now() - ts;
-  const mins = Math.floor(diff / 6e4);
-  if (mins < 1) return "just now";
-  if (mins < 60) return `${mins}m ago`;
-  const hrs = Math.floor(mins / 60);
-  if (hrs < 24) return `${hrs}h ago`;
-  const days = Math.floor(hrs / 24);
-  return `${days}d ago`;
-}
-function SourcesCarousel({ sources, defaultCurrency, onSelectSource, referencedIds = [] }) {
+function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClick, referencedIds = [] }) {
   const client = (0, import_sdk6.useAkropolysContext)();
   const isProperty = client?.vertical === "property";
   const railRef = (0, import_react5.useRef)(null);
@@ -1444,7 +1416,18 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, referencedI
           onClick: () => onSelectSource?.(src),
           children: [
             src.image ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-src-imgwrap", style: { position: "relative" }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: src.image, alt: src.name, loading: "lazy" }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                "img",
+                {
+                  src: src.image,
+                  alt: src.name,
+                  loading: "lazy",
+                  onClick: onImageClick ? (e) => {
+                    e.stopPropagation();
+                    onImageClick(src.image);
+                  } : void 0
+                }
+              ),
               isReferenced && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, { size: 10 }) }),
               isProperty && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: {
                 position: "absolute",
@@ -1717,7 +1700,7 @@ function ChatModal({
   visionCategoryHint
 }) {
   const client = (0, import_sdk6.useAkropolysContext)();
-  const { messages, sources, loading, streaming, error, lastAction, lastIntent, send, reset, referencedIds } = (0, import_sdk5.useKiku)();
+  const { messages, sources, loading, streaming, error, lastAction, lastIntent, send, stop, reset, referencedIds } = (0, import_sdk5.useKiku)();
   const [input, setInput] = (0, import_react5.useState)("");
   const [attachments, setAttachments] = (0, import_react5.useState)([]);
   const imageInputRef = (0, import_react5.useRef)(null);
@@ -1792,6 +1775,7 @@ function ChatModal({
   const activeTitle = title === "Shopping Assistant" && isProperty ? "Property Assistant" : title;
   const activePlaceholder = placeholder === "Ask me anything \u2014 gifts, budget, use case\u2026" && isProperty ? "Ask me anything \u2014 location, budget, bedrooms\u2026" : placeholder;
   const [selectedProduct, setSelectedProduct] = (0, import_react5.useState)(null);
+  const [lightboxSrc, setLightboxSrc] = (0, import_react5.useState)(null);
   const bottomRef = (0, import_react5.useRef)(null);
   const textareaRef = (0, import_react5.useRef)(null);
   const [keyInput, setKeyInput] = (0, import_react5.useState)("");
@@ -1801,9 +1785,6 @@ function ChatModal({
   const [minting, setMinting] = (0, import_react5.useState)(false);
   const [showKikuPicker, setShowKikuPicker] = (0, import_react5.useState)(false);
   const [showAtPicker, setShowAtPicker] = (0, import_react5.useState)(false);
-  const [sessions, setSessions] = (0, import_react5.useState)(() => loadSessions());
-  const [sidebarOpen, setSidebarOpen] = (0, import_react5.useState)(false);
-  const [replayMessages, setReplayMessages] = (0, import_react5.useState)(null);
   (0, import_react5.useEffect)(() => {
     if (!lastAction) return;
     if (lastAction.type === "request_kiku_key") {
@@ -1860,9 +1841,15 @@ function ChatModal({
     }
   };
   const msgsContainerRef = (0, import_react5.useRef)(null);
+  const messageRefs = (0, import_react5.useRef)([]);
   (0, import_react5.useEffect)(() => {
     const container = msgsContainerRef.current;
     if (!container) return;
+    const lastMsg = messages[messages.length - 1];
+    if (lastMsg?.role === "user") {
+      messageRefs.current[messages.length - 1]?.scrollIntoView({ behavior: "smooth", block: "start" });
+      return;
+    }
     const distanceFromBottom = container.scrollHeight - container.scrollTop - container.clientHeight;
     if (distanceFromBottom < 120) {
       bottomRef.current?.scrollIntoView({ behavior: "smooth" });
@@ -1870,30 +1857,20 @@ function ChatModal({
   }, [messages, loading, selectedProduct]);
   (0, import_react5.useEffect)(() => {
     const h = (e) => {
-      if (e.key === "Escape") onClose();
+      if (e.key !== "Escape") return;
+      if (lightboxSrc) {
+        setLightboxSrc(null);
+        return;
+      }
+      onClose();
     };
     document.addEventListener("keydown", h);
     return () => document.removeEventListener("keydown", h);
-  }, []);
-  const saveCurrentSession = (0, import_react5.useCallback)(() => {
-    if (messages.length < 2) return;
-    const firstUser = messages.find((m) => m.role === "user");
-    const session = {
-      id: `session_${Date.now()}`,
-      title: firstUser ? firstUser.content.slice(0, 60) : "Chat session",
-      messages,
-      ts: Date.now()
-    };
-    const updated = [session, ...sessions].slice(0, MAX_SESSIONS);
-    setSessions(updated);
-    saveSessions(updated);
-  }, [messages, sessions]);
+  }, [lightboxSrc, onClose]);
   const handleReset = (0, import_react5.useCallback)(() => {
-    saveCurrentSession();
     reset();
-    setReplayMessages(null);
     setKeyPhase("idle");
-  }, [reset, saveCurrentSession]);
+  }, [reset]);
   const handleSourceClick = (src) => {
     setSelectedProduct(src);
     onSelectSource?.(src);
@@ -1906,7 +1883,6 @@ function ChatModal({
     const kiku = parseAtKiku(raw);
     const q = kiku ? kiku.cleanQuery : raw;
     const resolvedForcedIntent = forcedIntent ?? kiku?.intent;
-    setReplayMessages(null);
     setSelectedProduct(null);
     setShowKikuPicker(false);
     setShowAtPicker(false);
@@ -1931,7 +1907,6 @@ function ChatModal({
     const display = `@kiku capture${name ? " " + name : ""}`;
     const q = name || "capture current page";
     setInput("");
-    setReplayMessages(null);
     setSelectedProduct(null);
     const toSend = attachments;
     setAttachments([]);
@@ -1948,7 +1923,6 @@ function ChatModal({
     const names = products.map((p) => p.name).filter(Boolean).join(", ");
     const display = `@kiku capture all (${products.length} items)`;
     setInput("");
-    setReplayMessages(null);
     setSelectedProduct(null);
     setAttachments([]);
     send(names || "capture all", display, void 0, "capture_all", targets);
@@ -1956,7 +1930,6 @@ function ChatModal({
   const handleKikuViewHistory = (0, import_react5.useCallback)(() => {
     const display = "@kiku what have you saved?";
     setInput("");
-    setReplayMessages(null);
     setSelectedProduct(null);
     setAttachments([]);
     send("show my saved items", display, void 0, "view_history");
@@ -1964,7 +1937,6 @@ function ChatModal({
   const handleKikuDelete = (0, import_react5.useCallback)(() => {
     const display = "@kiku delete this";
     setInput("");
-    setReplayMessages(null);
     setSelectedProduct(null);
     setAttachments([]);
     send("delete this", display, void 0, "delete");
@@ -2010,17 +1982,7 @@ function ChatModal({
     return () => clearTimeout(timer);
   }, [voiceState]);
   const blurVal = typeof backdropBlur === "number" ? `${backdropBlur}px` : backdropBlur ?? "20px";
-  const displayMessages = replayMessages ?? messages;
-  const loadSession = (session) => {
-    setReplayMessages(session.messages);
-    setSidebarOpen(false);
-  };
-  const deleteSession = (id, e) => {
-    e.stopPropagation();
-    const updated = sessions.filter((s) => s.id !== id);
-    setSessions(updated);
-    saveSessions(updated);
-  };
+  const displayMessages = messages;
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "div",
     {
@@ -2033,326 +1995,298 @@ function ChatModal({
         ...backdropColor ? { background: backdropColor } : {},
         ...customStyles
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn("hsk-cb-panel hsk-cb-panel--with-sidebar", classNames.panel), onClick: (e) => e.stopPropagation(), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn("hsk-cb-sidebar", sidebarOpen && "hsk-cb-sidebar--open"), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-sidebar-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-sidebar-title", children: "History" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-              "button",
-              {
-                className: "hsk-cb-sidebar-new",
-                onClick: handleReset,
-                title: "New chat",
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(NewChatIcon, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "New chat" })
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-sidebar-list", children: sessions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-sidebar-empty", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HistoryIcon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "No history yet" })
-          ] }) : sessions.map((session) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-            "div",
-            {
-              className: cn(
-                "hsk-cb-sidebar-session",
-                replayMessages === session.messages && "hsk-cb-sidebar-session--active"
-              ),
-              onClick: () => loadSession(session),
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-sidebar-session-title", children: session.title }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-sidebar-session-meta", children: relativeTime(session.ts) }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                  "button",
-                  {
-                    className: "hsk-cb-sidebar-session-del",
-                    onClick: (e) => deleteSession(session.id, e),
-                    title: "Delete",
-                    children: "\xD7"
-                  }
-                )
-              ]
-            },
-            session.id
-          )) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-main", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-left", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "button",
-                {
-                  className: cn("hsk-cb-sidebar-toggle", sidebarOpen && "hsk-cb-sidebar-toggle--active"),
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    setSidebarOpen((v) => !v);
-                  },
-                  "aria-label": "Toggle history",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HistoryIcon, {})
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-topbar-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-topbar-title", children: activeTitle }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        "div",
+        {
+          className: cn("hsk-cb-panel", classNames.panel),
+          onClick: (e) => {
+            e.stopPropagation();
+            const target = e.target;
+            if (target.tagName === "IMG" && (target.classList.contains("hsk-markdown-img") || target.classList.contains("hsk-cb-user-img-thumb"))) {
+              const src = target.src;
+              if (src) setLightboxSrc(src);
+            }
+          },
+          children: [
+            lightboxSrc && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-lightbox", onClick: () => setLightboxSrc(null), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-lightbox-close", onClick: () => setLightboxSrc(null), "aria-label": "Close image", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CloseIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: lightboxSrc, alt: "", className: "hsk-lightbox-img", onClick: (e) => e.stopPropagation() })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-actions", children: [
-              replayMessages ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-topbar-btn", onClick: () => {
-                setReplayMessages(null);
-              }, children: "\u2190 Live chat" }) : messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-topbar-btn", onClick: handleReset, children: "Clear chat" }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CloseIcon, {}) })
-            ] })
-          ] }),
-          replayMessages && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-replay-banner", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HistoryIcon, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "You're viewing a past conversation." }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { onClick: () => setReplayMessages(null), children: "Back to chat \u2192" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-msgs", ref: msgsContainerRef, children: [
-            displayMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-empty", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-empty-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-empty-title", children: "Find exactly what you need" }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-chips", children: activeChips.map((chip) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "button",
-                {
-                  className: "hsk-cb-chip",
-                  onClick: () => handleSend(chip),
-                  children: chip
-                },
-                chip
-              )) })
-            ] }) : displayMessages.map((msg, idx) => {
-              const isLast = idx === displayMessages.length - 1 && !replayMessages;
-              const isUser = msg.role === "user";
-              const displayContent = !isUser && isLast && lastIntent === "compare" && sources.length >= 2 && !replayMessages ? stripMarkdownTables(msg.content) : msg.content;
-              return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-user-msg", children: [
-                msg.images && msg.images.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-user-imgs", children: msg.images.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: img, alt: `attachment ${i + 1}`, className: "hsk-cb-user-img-thumb" }, i)) }),
-                msg.content && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-user-bubble", children: [
-                  /^@kiku\b/i.test(msg.content) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-badge", children: "@kiku" }),
-                  msg.content
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-main", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-topbar-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-topbar-title", children: activeTitle }) })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-actions", children: [
+                  messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-topbar-btn", onClick: handleReset, children: "Clear chat" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CloseIcon, {}) })
                 ] })
-              ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-body", children: [
-                  (() => {
-                    const { thinking, content, isComplete } = parseThinking(displayContent);
-                    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                      thinking && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ThinkingBlock, { text: thinking, isComplete }),
-                      content && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-text", children: [
-                        renderMarkdown(content),
-                        isLast && streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { display: "inline-block", width: "0.5em", height: "1.05em", marginLeft: "2px", verticalAlign: "text-bottom", background: "currentColor", opacity: 0.55, borderRadius: "1px" } })
-                      ] })
-                    ] });
-                  })(),
-                  isLast && lastIntent === "compare" && sources.length >= 2 && !replayMessages && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ComparisonMatrix, { sources, defaultCurrency }),
-                  isLast && referencedIds.length > 0 && lastIntent !== "compare" && lastAction?.type !== "request_kiku_key" && lastAction?.type !== "capture" && lastAction?.type !== "delete" && lastAction?.type !== "view_history" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                    SourcesCarousel,
-                    {
-                      sources,
-                      defaultCurrency,
-                      onSelectSource: handleSourceClick,
-                      referencedIds
-                    }
-                  ),
-                  isLast && !loading && lastAction?.url && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-action-pills", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("a", { className: "hsk-action-pill", href: lastAction.url, children: [
-                    String(lastAction.type || "continue").replace(/_/g, " "),
-                    " \u2192"
-                  ] }) }),
-                  isLast && !loading && !replayMessages && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                    SmartContextPills,
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-msgs", ref: msgsContainerRef, children: [
+                displayMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-empty", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-empty-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-empty-title", children: "Find exactly what you need" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-chips", children: activeChips.map((chip) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "button",
                     {
-                      intent: lastIntent,
-                      sources: sources.filter((s) => s.id && referencedIds.includes(s.id)),
-                      onSend: handleSend,
-                      loading
-                    }
-                  )
-                ] })
-              ] }) }, idx);
-            }),
-            selectedProduct && loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-              "div",
-              {
-                className: "hsk-cb-selected-product",
-                onClick: () => selectedProduct.url && window.open(selectedProduct.url, "_blank"),
-                children: [
-                  selectedProduct.image && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { className: "hsk-cb-selected-img", src: selectedProduct.image, alt: selectedProduct.name }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-info", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-selected-name", children: selectedProduct.name }),
-                    selectedProduct.price && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-price", children: [
-                      selectedProduct.currency ?? defaultCurrency,
-                      " ",
-                      parseFloat(String(selectedProduct.price ?? "").replace(/[^0-9.]/g, "") || "0").toLocaleString()
+                      className: "hsk-cb-chip",
+                      onClick: () => handleSend(chip),
+                      children: chip
+                    },
+                    chip
+                  )) })
+                ] }) : displayMessages.map((msg, idx) => {
+                  const isLast = idx === displayMessages.length - 1;
+                  const isUser = msg.role === "user";
+                  const displayContent = !isUser && isLast && lastIntent === "compare" && sources.length >= 2 ? stripMarkdownTables(msg.content) : msg.content;
+                  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-msg-group", ref: (el) => {
+                    messageRefs.current[idx] = el;
+                  }, children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-user-msg", children: [
+                    msg.images && msg.images.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-user-imgs", children: msg.images.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: img, alt: `attachment ${i + 1}`, className: "hsk-cb-user-img-thumb" }, i)) }),
+                    msg.content && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-user-bubble", children: [
+                      /^@kiku\b/i.test(msg.content) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-badge", children: "@kiku" }),
+                      msg.content
                     ] })
-                  ] })
-                ]
-              }
-            ),
-            loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-typing-row", style: { display: "flex", alignItems: "flex-start", gap: "10px" }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center", marginTop: "4px" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("style", { children: `
+                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-body", children: [
+                      (() => {
+                        const { thinking, content, isComplete } = parseThinking(displayContent);
+                        return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
+                          thinking && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ThinkingBlock, { text: thinking, isComplete }),
+                          content && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-text", children: [
+                            renderMarkdown(content),
+                            isLast && streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { display: "inline-block", width: "0.5em", height: "1.05em", marginLeft: "2px", verticalAlign: "text-bottom", background: "currentColor", opacity: 0.55, borderRadius: "1px" } })
+                          ] })
+                        ] });
+                      })(),
+                      isLast && lastIntent === "compare" && sources.length >= 2 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ComparisonMatrix, { sources, defaultCurrency }),
+                      (() => {
+                        const msgReferencedIds = isLast ? referencedIds : msg.referencedIds ?? [];
+                        const msgSources = isLast ? sources : msg.sources ?? [];
+                        const showCarousel = msgReferencedIds.length > 0 && (isLast ? lastIntent !== "compare" : msg.intent !== "compare") && lastAction?.type !== "request_kiku_key" && lastAction?.type !== "capture" && lastAction?.type !== "delete" && lastAction?.type !== "view_history";
+                        return showCarousel && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                          SourcesCarousel,
+                          {
+                            sources: msgSources,
+                            defaultCurrency,
+                            onSelectSource: handleSourceClick,
+                            onImageClick: setLightboxSrc,
+                            referencedIds: msgReferencedIds
+                          }
+                        );
+                      })(),
+                      isLast && !loading && lastAction?.url && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-action-pills", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("a", { className: "hsk-action-pill", href: lastAction.url, children: [
+                        String(lastAction.type || "continue").replace(/_/g, " "),
+                        " \u2192"
+                      ] }) }),
+                      isLast && !loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                        SmartContextPills,
+                        {
+                          intent: lastIntent,
+                          sources: sources.filter((s) => s.id && referencedIds.includes(s.id)),
+                          onSend: handleSend,
+                          loading
+                        }
+                      )
+                    ] })
+                  ] }) }, idx);
+                }),
+                selectedProduct && loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+                  "div",
+                  {
+                    className: "hsk-cb-selected-product",
+                    onClick: () => selectedProduct.url && window.open(selectedProduct.url, "_blank"),
+                    children: [
+                      selectedProduct.image && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { className: "hsk-cb-selected-img", src: selectedProduct.image, alt: selectedProduct.name }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-info", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-selected-name", children: selectedProduct.name }),
+                        selectedProduct.price && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-price", children: [
+                          selectedProduct.currency ?? defaultCurrency,
+                          " ",
+                          parseFloat(String(selectedProduct.price ?? "").replace(/[^0-9.]/g, "") || "0").toLocaleString()
+                        ] })
+                      ] })
+                    ]
+                  }
+                ),
+                loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-typing-row", style: { display: "flex", alignItems: "flex-start", gap: "10px" }, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center", marginTop: "4px" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("style", { children: `
                     @keyframes hsk-pulse {
                       0%, 100% { opacity: 0.6; }
                       50% { opacity: 1; }
                     }
                   ` }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: "0.85rem", color: "#6b7280", fontStyle: "italic", animation: "hsk-pulse 1.5s infinite ease-in-out" }, children: "Thinking\u2026" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-typing", style: { margin: 0, alignSelf: "flex-start" }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" })
-                ] })
-              ] })
-            ] }),
-            error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError(error) }),
-            !replayMessages && keyPhase === "prompt_key" && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-phone-form", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("label", { className: "hsk-cb-phone-label", children: "Paste your kiku key \u2014 or create one" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                  "input",
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: "0.85rem", color: "#6b7280", fontStyle: "italic", animation: "hsk-pulse 1.5s infinite ease-in-out" }, children: "Thinking\u2026" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-typing", style: { margin: 0, alignSelf: "flex-start" }, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-dot" })
+                    ] })
+                  ] })
+                ] }),
+                error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError(error) }),
+                keyPhase === "prompt_key" && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-phone-form", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("label", { className: "hsk-cb-phone-label", children: "Paste your kiku key \u2014 or create one" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                      "input",
+                      {
+                        type: "text",
+                        className: "hsk-cb-phone-input",
+                        placeholder: "kiku_\u2026",
+                        value: keyInput,
+                        onChange: (e) => setKeyInput(e.target.value),
+                        onKeyDown: (e) => e.key === "Enter" && handleUseExistingKey(),
+                        autoFocus: true
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8 }, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleUseExistingKey, disabled: !keyInput.trim(), children: "Use my key" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleCreateKey, disabled: minting, children: minting ? "Creating\u2026" : "I'm new \u2014 create my key" })
+                    ] })
+                  ] }) }) })
+                ] }),
+                mintedKey && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { padding: "10px 12px", border: "1px solid var(--hsk-border, #e5e5e5)", borderRadius: 8 }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "\u{1F511} Your kiku key \u2014 shown only once" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { style: { display: "block", fontSize: 14, fontWeight: 700, marginBottom: 6, wordBreak: "break-all" }, children: mintedKey }),
+                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => {
+                        try {
+                          navigator.clipboard?.writeText(mintedKey);
+                        } catch {
+                        }
+                      }, children: "Copy" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { style: { fontSize: 11, opacity: 0.7 }, children: [
+                        "Disappears in ",
+                        keyCountdown,
+                        "s. Save it like a password \u2014 if lost, the memory it opens is lost with it."
+                      ] })
+                    ] })
+                  ] }) }) })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: bottomRef, style: { height: 1 } })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
+                showAtPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  AtPickerMenu,
                   {
-                    type: "text",
-                    className: "hsk-cb-phone-input",
-                    placeholder: "kiku_\u2026",
-                    value: keyInput,
-                    onChange: (e) => setKeyInput(e.target.value),
-                    onKeyDown: (e) => e.key === "Enter" && handleUseExistingKey(),
-                    autoFocus: true
+                    onSelect: handleSelectExtension,
+                    onDismiss: () => setShowAtPicker(false)
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8 }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleUseExistingKey, disabled: !keyInput.trim(), children: "Use my key" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleCreateKey, disabled: minting, children: minting ? "Creating\u2026" : "I'm new \u2014 create my key" })
-                ] })
-              ] }) }) })
-            ] }),
-            !replayMessages && mintedKey && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { padding: "10px 12px", border: "1px solid var(--hsk-border, #e5e5e5)", borderRadius: 8 }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "\u{1F511} Your kiku key \u2014 shown only once" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { style: { display: "block", fontSize: 14, fontWeight: 700, marginBottom: 6, wordBreak: "break-all" }, children: mintedKey }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => {
-                    try {
-                      navigator.clipboard?.writeText(mintedKey);
-                    } catch {
+                showKikuPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  KikuPickerMenu,
+                  {
+                    sources,
+                    referencedIds,
+                    defaultCurrency,
+                    onCapture: handleKikuCapture,
+                    onCaptureAll: handleKikuCaptureAll,
+                    onViewHistory: handleKikuViewHistory,
+                    onDelete: handleKikuDelete,
+                    onDismiss: () => setShowKikuPicker(false)
+                  }
+                ),
+                attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-img-strip", children: attachments.map((att, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-img-thumb-wrap", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: att.data, alt: `attachment ${i + 1}`, className: "hsk-cb-img-thumb" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "button",
+                    {
+                      className: "hsk-cb-img-thumb-remove",
+                      onClick: () => removeAttachment(i),
+                      "aria-label": "Remove image",
+                      children: "\xD7"
+                    }
+                  )
+                ] }, i)) }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-box", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "input",
+                    {
+                      ref: imageInputRef,
+                      type: "file",
+                      accept: "image/*",
+                      multiple: true,
+                      style: { display: "none" },
+                      onChange: (e) => handleImageFiles(e.target.files)
                     }
-                  }, children: "Copy" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { style: { fontSize: 11, opacity: 0.7 }, children: [
-                    "Disappears in ",
-                    keyCountdown,
-                    "s. Save it like a password \u2014 if lost, the memory it opens is lost with it."
-                  ] })
-                ] })
-              ] }) }) })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: bottomRef, style: { height: 1 } })
-          ] }),
-          !replayMessages && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
-            showAtPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-              AtPickerMenu,
-              {
-                onSelect: handleSelectExtension,
-                onDismiss: () => setShowAtPicker(false)
-              }
-            ),
-            showKikuPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-              KikuPickerMenu,
-              {
-                sources,
-                referencedIds,
-                defaultCurrency,
-                onCapture: handleKikuCapture,
-                onCaptureAll: handleKikuCaptureAll,
-                onViewHistory: handleKikuViewHistory,
-                onDelete: handleKikuDelete,
-                onDismiss: () => setShowKikuPicker(false)
-              }
-            ),
-            attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-img-strip", children: attachments.map((att, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-img-thumb-wrap", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: att.data, alt: `attachment ${i + 1}`, className: "hsk-cb-img-thumb" }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "button",
-                {
-                  className: "hsk-cb-img-thumb-remove",
-                  onClick: () => removeAttachment(i),
-                  "aria-label": "Remove image",
-                  children: "\xD7"
-                }
-              )
-            ] }, i)) }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-box", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "input",
-                {
-                  ref: imageInputRef,
-                  type: "file",
-                  accept: "image/*",
-                  multiple: true,
-                  style: { display: "none" },
-                  onChange: (e) => handleImageFiles(e.target.files)
-                }
-              ),
-              enableVision && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "button",
-                {
-                  className: "hsk-cb-attach-btn",
-                  onClick: () => imageInputRef.current?.click(),
-                  disabled: loading,
-                  "aria-label": "Attach image",
-                  title: "Attach image",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(PaperclipIcon, {})
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "textarea",
-                {
-                  ref: textareaRef,
-                  className: cn("hsk-cb-textarea", classNames.input),
-                  value: input,
-                  onChange: handleInput,
-                  onKeyDown: handleKeyDown,
-                  placeholder: voiceState === "listening" ? "\u{1F399}\uFE0F Listening\u2026 tap the mic to stop" : voiceState === "processing" ? "Got it \u2014 sending\u2026" : activePlaceholder,
-                  rows: 1,
-                  disabled: loading,
-                  autoFocus: true
-                }
-              ),
-              hasSpeechAPI && enableVoice && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-                "button",
-                {
-                  className: cn(
-                    "hsk-cb-mic-btn",
-                    voiceState === "listening" && "hsk-cb-mic-btn--listening",
-                    voiceState === "processing" && "hsk-cb-mic-btn--processing"
                   ),
-                  onClick: voiceState === "idle" ? startVoice : stopVoice,
-                  disabled: loading,
-                  "aria-label": voiceState === "idle" ? "Start voice input" : "Stop recording",
-                  title: voiceState === "idle" ? "Voice input" : "Stop",
-                  children: [
-                    voiceState === "listening" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicIcon2, {}),
-                    voiceState === "listening" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-mic-pulse" })
-                  ]
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-                "button",
-                {
-                  className: cn("hsk-cb-send", classNames.sendButton),
-                  onClick: () => handleSend(),
-                  disabled: !input.trim() && attachments.length === 0 || loading,
-                  "aria-label": "Send message",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ArrowUpIcon2, {})
-                }
-              )
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-hint", children: "Akropolys AI \xB7 searches the whole catalogue in real time" })
-          ] })
-        ] })
-      ] })
+                  enableVision && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "button",
+                    {
+                      className: "hsk-cb-attach-btn",
+                      onClick: () => imageInputRef.current?.click(),
+                      disabled: loading,
+                      "aria-label": "Attach image",
+                      title: "Attach image",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(PaperclipIcon, {})
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "textarea",
+                    {
+                      ref: textareaRef,
+                      className: cn("hsk-cb-textarea", classNames.input),
+                      value: input,
+                      onChange: handleInput,
+                      onKeyDown: handleKeyDown,
+                      placeholder: voiceState === "listening" ? "\u{1F399}\uFE0F Listening\u2026 tap the mic to stop" : voiceState === "processing" ? "Got it \u2014 sending\u2026" : activePlaceholder,
+                      rows: 1,
+                      disabled: loading,
+                      autoFocus: true
+                    }
+                  ),
+                  hasSpeechAPI && enableVoice && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+                    "button",
+                    {
+                      className: cn(
+                        "hsk-cb-mic-btn",
+                        voiceState === "listening" && "hsk-cb-mic-btn--listening",
+                        voiceState === "processing" && "hsk-cb-mic-btn--processing"
+                      ),
+                      onClick: voiceState === "idle" ? startVoice : stopVoice,
+                      disabled: loading,
+                      "aria-label": voiceState === "idle" ? "Start voice input" : "Stop recording",
+                      title: voiceState === "idle" ? "Voice input" : "Stop",
+                      children: [
+                        voiceState === "listening" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicIcon2, {}),
+                        voiceState === "listening" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-mic-pulse" })
+                      ]
+                    }
+                  ),
+                  loading || streaming ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "button",
+                    {
+                      className: cn("hsk-cb-send", "hsk-cb-send--stop", classNames.sendButton),
+                      onClick: stop,
+                      "aria-label": "Stop generating",
+                      title: "Stop generating",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(StopIcon, {})
+                    }
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    "button",
+                    {
+                      className: cn("hsk-cb-send", classNames.sendButton),
+                      onClick: () => handleSend(),
+                      disabled: !input.trim() && attachments.length === 0,
+                      "aria-label": "Send message",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ArrowUpIcon2, {})
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-hint", children: "Akropolys AI \xB7 searches the whole catalogue in real time" })
+              ] })
+            ] })
+          ]
+        }
+      )
     }
   );
 }