@burdenoff/website-sdk 2026.828.4 → 2026.828.6

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { createContext, useMemo, useContext, useState, useCallback, useLayoutEffect, useRef, useEffect } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Instagram, Youtube, Facebook, Github, Linkedin, Twitter, Mail, Phone, MapPin, Clock, Send, CheckCircle, Upload, Globe, ChevronDown, Search, Rocket, ArrowRight, Download, Sparkles, RotateCcw, Square, ArrowUp, History, BookOpenText, Layers, Link2, TriangleAlert, ChevronLeft, ChevronRight, FileText, ExternalLink } from 'lucide-react';
+import { Instagram, Youtube, Facebook, Github, Linkedin, Twitter, Mail, Phone, MapPin, Clock, Send, CheckCircle, Upload, Globe, ChevronDown, Search, Rocket, ArrowRight, Download, Sparkles, RotateCcw, History, Trash2, Mic, Square, ArrowUp, BookOpenText, Layers, Link2, TriangleAlert, ChevronLeft, ChevronRight, FileText, ExternalLink } from 'lucide-react';
 import ReCAPTCHA4 from 'react-google-recaptcha';
 import { toast } from 'sonner';
 import { Helmet } from 'react-helmet-async';
@@ -5246,6 +5246,8 @@ async function getRecaptchaV3Token(siteKey, action = EXPLORE_RECAPTCHA_ACTION) {
 
 // src/hooks/use-explore-chat.ts
 var DEFAULT_STORAGE_KEY = "boff.explore.v1";
+var HISTORY_SUFFIX = ".history";
+var MAX_ARCHIVED_CONVERSATIONS = 15;
 var DEFAULT_POLL_INTERVAL_MS = 1500;
 var DEFAULT_POLL_TIMEOUT_MS = 9e4;
 var POLL_REQUEST_TIMEOUT_MS = 1e4;
@@ -5384,10 +5386,58 @@ function classifyExploreError(code, serverMessage) {
     retryable: true
   };
 }
+function historyKey(key) {
+  return `${key}${HISTORY_SUFFIX}`;
+}
+function readArchive(key) {
+  if (typeof window === "undefined") return [];
+  try {
+    const raw = window.localStorage.getItem(historyKey(key));
+    if (!raw) return [];
+    const parsed = JSON.parse(raw);
+    if (!Array.isArray(parsed)) return [];
+    return parsed.filter(
+      (entry) => typeof entry === "object" && entry !== null && typeof entry.token === "string" && Array.isArray(entry.messages)
+    );
+  } catch {
+    return [];
+  }
+}
+function writeArchive(key, entries) {
+  if (typeof window === "undefined") return;
+  try {
+    if (entries.length === 0) {
+      window.localStorage.removeItem(historyKey(key));
+      return;
+    }
+    window.localStorage.setItem(historyKey(key), JSON.stringify(entries));
+  } catch {
+  }
+}
+function upsertArchive(key, thread) {
+  if (!thread.token) return readArchive(key);
+  const real = thread.messages.filter(
+    (m) => m.content.trim() !== "" || m.role === "USER"
+  );
+  if (real.length === 0) return readArchive(key);
+  const firstUser = real.find((m) => m.role === "USER");
+  const entry = {
+    token: thread.token,
+    title: (firstUser?.content ?? "Conversation").trim().slice(0, 80),
+    updatedAt: real[real.length - 1]?.createdAt ?? (/* @__PURE__ */ new Date()).toISOString(),
+    messageCount: real.length,
+    focusProduct: thread.focusProduct,
+    messages: real.slice(-20)
+  };
+  const rest = readArchive(key).filter((e) => e.token !== entry.token);
+  const next = [entry, ...rest].slice(0, MAX_ARCHIVED_CONVERSATIONS);
+  writeArchive(key, next);
+  return next;
+}
 function readPersisted(key) {
   if (typeof window === "undefined") return null;
   try {
-    const raw = window.sessionStorage.getItem(key);
+    const raw = window.localStorage.getItem(key);
     if (!raw) return null;
     const parsed = JSON.parse(raw);
     if (!parsed || typeof parsed !== "object") return null;
@@ -5432,6 +5482,8 @@ function useExploreChat(options = {}) {
   const [remainingToday, setRemainingToday] = useState(null);
   const [focusProduct, setFocusProductState] = useState(null);
   const [turnCount, setTurnCount] = useState(0);
+  const messagesRef = useRef([]);
+  const [archive, setArchive] = useState([]);
   const [hydrated, setHydrated] = useState(false);
   const mountedRef = useRef(true);
   const pollGenerationRef = useRef(0);
@@ -5469,6 +5521,7 @@ function useExploreChat(options = {}) {
       setHydrated(true);
       return;
     }
+    setArchive(readArchive(storageKey));
     const stored = readPersisted(storageKey);
     if (stored) {
       conversationTokenRef.current = stored.conversationToken;
@@ -5497,13 +5550,28 @@ function useExploreChat(options = {}) {
         focusProduct
       };
       if (!payload.conversationToken && payload.messages.length === 0 && !payload.focusProduct) {
-        window.sessionStorage.removeItem(storageKey);
+        window.localStorage.removeItem(storageKey);
         return;
       }
-      window.sessionStorage.setItem(storageKey, JSON.stringify(payload));
+      window.localStorage.setItem(storageKey, JSON.stringify(payload));
     } catch {
     }
   }, [persist, hydrated, storageKey, messages, focusProduct]);
+  useEffect(() => {
+    messagesRef.current = messages;
+    if (!persist || !hydrated) return;
+    const settled = messages.some(
+      (m) => m.role === "ASSISTANT" && (m.status === "COMPLETED" || m.status === "FAILED")
+    );
+    if (!settled) return;
+    setArchive(
+      upsertArchive(storageKey, {
+        token: conversationTokenRef.current,
+        messages,
+        focusProduct: focusProductRef.current
+      })
+    );
+  }, [messages, persist, hydrated, storageKey]);
   useEffect(() => {
     let cancelled = false;
     const load = async () => {
@@ -5789,6 +5857,13 @@ function useExploreChat(options = {}) {
     void send(text);
   }, [cancelPolling, send]);
   const reset = useCallback(() => {
+    setArchive(
+      upsertArchive(storageKey, {
+        token: conversationTokenRef.current,
+        messages: messagesRef.current,
+        focusProduct: focusProductRef.current
+      })
+    );
     cancelPolling();
     inFlightRef.current = false;
     conversationTokenRef.current = null;
@@ -5801,11 +5876,48 @@ function useExploreChat(options = {}) {
     setPhase(catalogRef.current.enabled ? "ready" : "disabled");
     if (typeof window !== "undefined") {
       try {
-        window.sessionStorage.removeItem(storageKey);
+        window.localStorage.removeItem(storageKey);
       } catch {
       }
     }
   }, [cancelPolling, storageKey]);
+  const openConversation = useCallback(
+    (token) => {
+      const entry = readArchive(storageKey).find((e) => e.token === token);
+      if (!entry) return;
+      upsertArchive(storageKey, {
+        token: conversationTokenRef.current,
+        messages: messagesRef.current,
+        focusProduct: focusProductRef.current
+      });
+      cancelPolling();
+      inFlightRef.current = false;
+      conversationTokenRef.current = entry.token;
+      turnCountRef.current = entry.messages.filter(
+        (m) => m.role === "USER"
+      ).length;
+      setTurnCount(turnCountRef.current);
+      setMessages(entry.messages);
+      focusProductRef.current = entry.focusProduct;
+      setFocusProductState(entry.focusProduct);
+      setError(null);
+      setPhase(catalogRef.current.enabled ? "ready" : "disabled");
+      setArchive(readArchive(storageKey));
+    },
+    [cancelPolling, storageKey]
+  );
+  const deleteConversation = useCallback(
+    (token) => {
+      const next = readArchive(storageKey).filter((e) => e.token !== token);
+      writeArchive(storageKey, next);
+      setArchive(next);
+    },
+    [storageKey]
+  );
+  const clearHistory = useCallback(() => {
+    writeArchive(storageKey, []);
+    setArchive([]);
+  }, [storageKey]);
   const setFocusProduct = useCallback((slug) => {
     focusProductRef.current = slug;
     setFocusProductState(slug);
@@ -5834,7 +5946,11 @@ function useExploreChat(options = {}) {
     stop,
     retry,
     reset,
-    canSend
+    canSend,
+    history: archive,
+    openConversation,
+    deleteConversation,
+    clearHistory
   };
 }
 var optimisticCounter = 0;
@@ -5842,6 +5958,182 @@ function makeOptimisticId() {
   optimisticCounter += 1;
   return `boff-explore-local-${Date.now()}-${optimisticCounter}`;
 }
+function getRecognitionCtor() {
+  if (typeof window === "undefined") return null;
+  const w = window;
+  return w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;
+}
+var MIC_DENIED_MESSAGE = "Microphone access was blocked. Allow it in your browser's site settings to dictate.";
+async function ensureMicrophoneAccess() {
+  const media = typeof navigator === "undefined" ? void 0 : navigator.mediaDevices;
+  if (!media?.getUserMedia) return { ok: true };
+  try {
+    const status = await navigator.permissions?.query({
+      name: "microphone"
+    });
+    if (status?.state === "granted") return { ok: true };
+    if (status?.state === "denied")
+      return { ok: false, message: MIC_DENIED_MESSAGE };
+  } catch {
+  }
+  try {
+    const stream = await media.getUserMedia({ audio: true });
+    for (const track of stream.getTracks()) track.stop();
+    return { ok: true };
+  } catch (error) {
+    const name = typeof error === "object" && error !== null && "name" in error ? String(error.name) : "";
+    if (name === "NotAllowedError" || name === "SecurityError") {
+      return { ok: false, message: MIC_DENIED_MESSAGE };
+    }
+    if (name === "NotFoundError" || name === "DevicesNotFoundError") {
+      return { ok: false, message: "No microphone was found." };
+    }
+    return {
+      ok: false,
+      message: "Dictation could not start. You can type instead."
+    };
+  }
+}
+function describeError(code) {
+  switch (code) {
+    case "not-allowed":
+    case "service-not-allowed":
+      return MIC_DENIED_MESSAGE;
+    case "no-speech":
+      return "I didn't catch anything \u2014 try again a little closer to the mic.";
+    case "audio-capture":
+      return "No microphone was found.";
+    case "network":
+      return "Speech recognition needs a network connection.";
+    case "aborted":
+      return "";
+    default:
+      return "Dictation stopped unexpectedly. You can type instead.";
+  }
+}
+function useSpeechInput({
+  onFinalTranscript,
+  lang,
+  onError
+}) {
+  const [supported] = useState(() => getRecognitionCtor() !== null);
+  const [listening, setListening] = useState(false);
+  const [interim, setInterim] = useState("");
+  const [error, setError] = useState(null);
+  const recognitionRef = useRef(null);
+  const startTokenRef = useRef(0);
+  const beginRecognitionRef = useRef(null);
+  const beginRecognition = useCallback(
+    (Ctor, token) => {
+      beginRecognitionRef.current?.(Ctor, token);
+    },
+    []
+  );
+  const finalRef = useRef(onFinalTranscript);
+  const errorRef = useRef(onError);
+  finalRef.current = onFinalTranscript;
+  errorRef.current = onError;
+  const stop = useCallback(() => {
+    startTokenRef.current += 1;
+    setListening(false);
+    setInterim("");
+    const recognition = recognitionRef.current;
+    if (!recognition) return;
+    try {
+      recognition.stop();
+    } catch {
+    }
+    setListening(false);
+    setInterim("");
+  }, []);
+  const start = useCallback(() => {
+    const Ctor = getRecognitionCtor();
+    if (!Ctor) return;
+    if (recognitionRef.current) stop();
+    setError(null);
+    setListening(true);
+    startTokenRef.current += 1;
+    const token = startTokenRef.current;
+    void ensureMicrophoneAccess().then((access) => {
+      if (token !== startTokenRef.current) return;
+      if (!access.ok) {
+        setListening(false);
+        setError(access.message);
+        errorRef.current?.(access.message);
+        return;
+      }
+      beginRecognition(Ctor, token);
+    });
+  }, [beginRecognition, stop]);
+  const beginRecognitionImpl = useCallback(
+    (Ctor, token) => {
+      const recognition = new Ctor();
+      recognition.lang = lang ?? (typeof navigator === "undefined" ? "en-US" : navigator.language || "en-US");
+      recognition.continuous = true;
+      recognition.interimResults = true;
+      recognition.maxAlternatives = 1;
+      recognition.onstart = () => {
+        if (token !== startTokenRef.current) return;
+        setError(null);
+        setListening(true);
+      };
+      recognition.onresult = (event) => {
+        let settled = "";
+        let pending = "";
+        for (let i = event.resultIndex; i < event.results.length; i += 1) {
+          const result = event.results[i];
+          if (!result) continue;
+          const text = result[0]?.transcript ?? "";
+          if (result.isFinal) settled += text;
+          else pending += text;
+        }
+        setInterim(pending);
+        if (settled.trim() !== "") finalRef.current(settled);
+      };
+      recognition.onerror = (event) => {
+        const message = describeError(event.error);
+        setListening(false);
+        setInterim("");
+        if (message !== "") {
+          setError(message);
+          errorRef.current?.(message);
+        }
+      };
+      recognition.onend = () => {
+        setListening(false);
+        setInterim("");
+      };
+      recognitionRef.current = recognition;
+      try {
+        recognition.start();
+      } catch {
+        setListening(false);
+      }
+    },
+    [lang]
+  );
+  beginRecognitionRef.current = beginRecognitionImpl;
+  const toggle = useCallback(() => {
+    if (listening) stop();
+    else start();
+  }, [listening, start, stop]);
+  useEffect(
+    () => () => {
+      const recognition = recognitionRef.current;
+      if (!recognition) return;
+      recognition.onresult = null;
+      recognition.onerror = null;
+      recognition.onend = null;
+      recognition.onstart = null;
+      try {
+        recognition.abort();
+      } catch {
+      }
+    },
+    []
+  );
+  return { supported, listening, interim, error, start, stop, toggle };
+}
 var EXPLORE_CSS = `
 @keyframes boff-explore-pulse {
   0%, 80%, 100% { opacity: 0.25; transform: translateY(0); }
@@ -5936,10 +6228,33 @@ function initialOf(value, fallback) {
   const source = (value || fallback).trim();
   return source ? source.slice(0, 1).toUpperCase() : "?";
 }
+function logoUrlOf(url) {
+  try {
+    const { origin, protocol } = new URL(url);
+    if (protocol !== "https:" && protocol !== "http:") return null;
+    return `${origin}/favicon.svg`;
+  } catch {
+    return null;
+  }
+}
 function ReferenceCard({ reference }) {
   const [imageFailed, setImageFailed] = useState(false);
+  const [logoFailed, setLogoFailed] = useState(false);
   const host = hostnameOf(reference.url);
+  const logoUrl = logoUrlOf(reference.url);
   const showImage = Boolean(reference.imageUrl) && !imageFailed;
+  const showLogo = Boolean(logoUrl) && !logoFailed;
+  const letterPlate = /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center bg-gradient-to-br from-primary/25 via-primary/5 to-secondary", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-primary/70 sm:text-2xl", children: initialOf(reference.product, reference.title || host) }) });
+  const logoImg = showLogo ? /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: logoUrl ?? "",
+      alt: "",
+      loading: "lazy",
+      onError: () => setLogoFailed(true),
+      className: "h-full w-full object-contain p-1.5 sm:p-0"
+    }
+  ) : letterPlate;
   return /* @__PURE__ */ jsxs(
     "a",
     {
@@ -5947,9 +6262,10 @@ function ReferenceCard({ reference }) {
       href: reference.url,
       target: "_blank",
       rel: "noopener noreferrer",
-      className: "group flex flex-col overflow-hidden rounded-xl border border-border bg-card transition-colors hover:border-primary/40 hover:bg-accent/40 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+      className: "group flex flex-row items-center gap-3 overflow-hidden rounded-xl border border-border bg-card p-2 transition-colors hover:border-primary/40 hover:bg-accent/40 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring sm:flex-col sm:items-stretch sm:gap-0 sm:p-0",
       children: [
-        /* @__PURE__ */ jsx("div", { className: "relative aspect-[16/9] w-full overflow-hidden bg-muted", children: showImage ? /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: "relative h-11 w-11 shrink-0 overflow-hidden rounded-lg bg-muted sm:hidden", children: logoImg }),
+        /* @__PURE__ */ jsx("div", { className: "relative hidden aspect-[16/9] w-full overflow-hidden bg-muted sm:block", children: showImage ? /* @__PURE__ */ jsx(
           "img",
           {
             src: reference.imageUrl ?? "",
@@ -5958,17 +6274,22 @@ function ReferenceCard({ reference }) {
             onError: () => setImageFailed(true),
             className: "h-full w-full object-cover transition-transform duration-300 group-hover:scale-105"
           }
-        ) : (
-          /* Graceful fallback: a token-derived gradient plate, so a missing or
-             broken preview still reads as a deliberate card, not a hole. */
-          /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center bg-gradient-to-br from-primary/25 via-primary/5 to-secondary", children: /* @__PURE__ */ jsx("span", { className: "text-2xl font-semibold text-primary/70", children: initialOf(reference.product, reference.title || host) }) })
-        ) }),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-1.5 p-3", children: [
+        ) : showLogo ? /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center bg-gradient-to-br from-primary/15 via-transparent to-secondary/60 p-6", children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: logoUrl ?? "",
+            alt: "",
+            loading: "lazy",
+            onError: () => setLogoFailed(true),
+            className: "max-h-full max-w-full object-contain"
+          }
+        ) }) : letterPlate }),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5 sm:gap-1.5 sm:p-3", children: [
           /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-sm font-semibold leading-snug text-card-foreground", children: reference.title || host || reference.url }),
-          reference.description ? /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-xs leading-relaxed text-muted-foreground", children: reference.description }) : null,
-          /* @__PURE__ */ jsxs("div", { className: "mt-auto flex items-center gap-2 pt-2", children: [
-            reference.product ? /* @__PURE__ */ jsx("span", { className: "rounded-full bg-secondary px-2 py-0.5 text-xs font-medium text-secondary-foreground", children: reference.product }) : null,
-            /* @__PURE__ */ jsxs("span", { className: "ml-auto inline-flex min-w-0 items-center gap-1 text-xs text-muted-foreground", children: [
+          reference.description ? /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-xs leading-relaxed text-muted-foreground max-sm:hidden", children: reference.description }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 sm:mt-auto sm:pt-2", children: [
+            reference.product ? /* @__PURE__ */ jsx("span", { className: "rounded-full bg-secondary px-2 py-0.5 text-xs font-medium text-secondary-foreground max-sm:hidden", children: reference.product }) : null,
+            /* @__PURE__ */ jsxs("span", { className: "inline-flex min-w-0 items-center gap-1 text-xs text-muted-foreground sm:ml-auto", children: [
               /* @__PURE__ */ jsx(ExternalLink, { className: "h-3 w-3 shrink-0" }),
               /* @__PURE__ */ jsx("span", { className: "truncate", children: host })
             ] })
@@ -6054,7 +6375,8 @@ function UserBubble({ message }) {
 function AssistantBubble({
   message,
   activity,
-  onNavigate
+  onNavigate,
+  anchorRef
 }) {
   const streaming = message.status === "PENDING" || message.status === "RUNNING";
   const body = message.content || message.partialContent || "";
@@ -6062,9 +6384,10 @@ function AssistantBubble({
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ref: anchorRef,
       "data-boff-explore": "assistant",
       "data-status": message.status,
-      className: "flex gap-3",
+      className: "flex scroll-mt-4 gap-3",
       children: [
         /* @__PURE__ */ jsx(
           "span",
@@ -6269,11 +6592,32 @@ function ExplorePage({
     stop,
     retry,
     reset,
-    canSend
+    canSend,
+    history,
+    openConversation,
+    deleteConversation,
+    clearHistory
   } = useExploreChat({ productSlug, pageUrl, onSend, examplePrompts });
   const [draft, setDraft] = useState("");
   const textareaRef = useRef(null);
+  const [historyOpen, setHistoryOpen] = useState(false);
+  const speechStopRef = useRef(() => void 0);
+  const stopDictation = useCallback(() => {
+    speechStopRef.current();
+  }, []);
+  const speech = useSpeechInput({
+    onFinalTranscript: (text) => {
+      setDraft((current) => {
+        const joined = current.trim() === "" ? text.trimStart() : `${current.trimEnd()} ${text.trim()}`;
+        return joined;
+      });
+      textareaRef.current?.focus();
+    }
+  });
+  speechStopRef.current = speech.stop;
   const scrollRef = useRef(null);
+  const latestAssistantRef = useRef(null);
+  const alignedForRef = useRef(null);
   const stickToBottomRef = useRef(true);
   const composingRef = useRef(false);
   const busy = phase === "sending" || phase === "streaming";
@@ -6299,20 +6643,41 @@ function ExplorePage({
     if (!el) return;
     stickToBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
   }, []);
+  const latestAssistantId = useMemo(() => {
+    for (let i = messages.length - 1; i >= 0; i -= 1) {
+      const message = messages[i];
+      if (message && message.role === "ASSISTANT") return message.id;
+    }
+    return null;
+  }, [messages]);
   useEffect(() => {
+    const el = scrollRef.current;
+    const anchor = latestAssistantRef.current;
+    if (!el || !anchor || !latestAssistantId) return;
+    if (alignedForRef.current === latestAssistantId) return;
     if (!stickToBottomRef.current) return;
+    if (anchor.offsetHeight === 0) return;
+    alignedForRef.current = latestAssistantId;
+    const delta = anchor.getBoundingClientRect().top - el.getBoundingClientRect().top;
+    el.scrollTop = Math.max(0, el.scrollTop + delta - 12);
+  }, [latestAssistantId, messages]);
+  useEffect(() => {
+    if (!stickToBottomRef.current) return;
+    if (latestAssistantId && alignedForRef.current === latestAssistantId)
+      return;
     const el = scrollRef.current;
     if (!el) return;
     el.scrollTop = el.scrollHeight;
-  }, [messages, activity]);
+  }, [activity, latestAssistantId, messages]);
   const submitDraft = useCallback(() => {
     const text = draft.trim();
     if (!text || overLimit || busy || !canSend) return;
+    stopDictation();
     setDraft("");
     stickToBottomRef.current = true;
     void send(text);
     textareaRef.current?.focus();
-  }, [busy, canSend, draft, overLimit, send]);
+  }, [busy, canSend, draft, overLimit, send, stopDictation]);
   const sendPrompt = useCallback(
     (prompt) => {
       if (!canSend || busy) return;
@@ -6385,8 +6750,96 @@ function ExplorePage({
                 /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "New chat" })
               ]
             }
-          )
+          ),
+          history.length > 0 ? /* @__PURE__ */ jsxs(
+            Button,
+            {
+              "data-boff-explore": "history-toggle",
+              type: "button",
+              size: "sm",
+              variant: "ghost",
+              className: "shrink-0 text-muted-foreground",
+              "aria-expanded": historyOpen,
+              onClick: () => {
+                setHistoryOpen((open) => !open);
+              },
+              children: [
+                /* @__PURE__ */ jsx(History, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ jsxs("span", { className: "hidden sm:inline", children: [
+                  "History (",
+                  history.length,
+                  ")"
+                ] })
+              ]
+            }
+          ) : null
         ] }) : null,
+        historyOpen && history.length > 0 ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-boff-explore": "history-panel",
+            className: "border-b border-border bg-muted/30 px-4 py-3",
+            children: /* @__PURE__ */ jsxs("div", { className: "mx-auto w-full max-w-3xl", children: [
+              /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: "Your recent conversations" }),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    "data-boff-explore": "history-clear",
+                    type: "button",
+                    size: "sm",
+                    variant: "ghost",
+                    className: "h-7 shrink-0 text-xs text-muted-foreground hover:text-destructive",
+                    onClick: () => {
+                      clearHistory();
+                      setHistoryOpen(false);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5" }),
+                      "Clear history"
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("ul", { className: "space-y-1", children: history.map((entry) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-1", children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    "data-boff-explore": "history-item",
+                    type: "button",
+                    className: "flex-1 truncate rounded-md px-2 py-1.5 text-left text-sm text-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
+                    onClick: () => {
+                      openConversation(entry.token);
+                      setHistoryOpen(false);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx("span", { className: "truncate", children: entry.title }),
+                      /* @__PURE__ */ jsxs("span", { className: "ml-2 text-xs text-muted-foreground", children: [
+                        entry.messageCount,
+                        " message",
+                        entry.messageCount === 1 ? "" : "s"
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    size: "icon",
+                    variant: "ghost",
+                    className: "h-7 w-7 shrink-0 text-muted-foreground hover:text-destructive",
+                    "aria-label": `Delete conversation: ${entry.title}`,
+                    onClick: () => {
+                      deleteConversation(entry.token);
+                    },
+                    children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5" })
+                  }
+                )
+              ] }, entry.token)) })
+            ] })
+          }
+        ) : null,
         /* @__PURE__ */ jsx(
           "div",
           {
@@ -6415,7 +6868,8 @@ function ExplorePage({
                 {
                   message,
                   activity,
-                  onNavigate
+                  onNavigate,
+                  anchorRef: message.id === latestAssistantId ? latestAssistantRef : void 0
                 },
                 message.id
               )
@@ -6461,6 +6915,23 @@ function ExplorePage({
                         className: "max-h-[200px] min-h-[44px] flex-1 resize-none border-0 bg-transparent px-2 py-2.5 text-sm shadow-none focus-visible:ring-0 md:text-sm"
                       }
                     ),
+                    speech.supported ? /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        "data-boff-explore": "mic",
+                        "data-listening": speech.listening ? "true" : "false",
+                        type: "button",
+                        size: "icon",
+                        variant: speech.listening ? "default" : "ghost",
+                        disabled: composerDisabled,
+                        "aria-label": speech.listening ? "Stop dictating" : "Dictate your question",
+                        "aria-pressed": speech.listening,
+                        title: speech.listening ? "Stop dictating" : "Dictate your question",
+                        onClick: speech.toggle,
+                        className: cn(speech.listening && "animate-pulse"),
+                        children: /* @__PURE__ */ jsx(Mic, { className: "h-4 w-4" })
+                      }
+                    ) : null,
                     busy ? /* @__PURE__ */ jsx(
                       Button,
                       {
@@ -6486,6 +6957,29 @@ function ExplorePage({
                   ]
                 }
               ),
+              speech.listening || speech.interim !== "" ? /* @__PURE__ */ jsxs(
+                "p",
+                {
+                  "data-boff-explore": "dictation",
+                  className: "mt-2 flex items-center gap-2 text-xs text-muted-foreground",
+                  "aria-live": "polite",
+                  children: [
+                    /* @__PURE__ */ jsxs("span", { className: "relative flex h-2 w-2 shrink-0", children: [
+                      /* @__PURE__ */ jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75" }),
+                      /* @__PURE__ */ jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-primary" })
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { className: "italic", children: speech.interim !== "" ? speech.interim : "Listening\u2026" })
+                  ]
+                }
+              ) : null,
+              speech.error !== null ? /* @__PURE__ */ jsx(
+                "p",
+                {
+                  "data-boff-explore": "dictation-error",
+                  className: "mt-2 text-xs text-destructive",
+                  children: speech.error
+                }
+              ) : null,
               /* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
                 /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "Enter to send \xB7 Shift + Enter for a new line" }),
                 remainingToday !== null ? /* @__PURE__ */ jsxs("span", { "data-boff-explore": "remaining", children: [
@@ -6509,39 +7003,48 @@ function ExplorePage({
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs("p", { className: "mt-2 text-xs leading-relaxed text-muted-foreground", children: [
-                "Answers are generated from our public documentation and can be imperfect \u2014 check anything important against the linked sources.",
-                captchaOn ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                  " ",
-                  "This site is protected by reCAPTCHA; the Google",
-                  " ",
-                  /* @__PURE__ */ jsx(
-                    "a",
-                    {
-                      href: "https://policies.google.com/privacy",
-                      target: "_blank",
-                      rel: "noopener noreferrer",
-                      className: "underline underline-offset-2 hover:text-foreground",
-                      children: "Privacy Policy"
-                    }
-                  ),
-                  " ",
-                  "and",
-                  " ",
-                  /* @__PURE__ */ jsx(
-                    "a",
-                    {
-                      href: "https://policies.google.com/terms",
-                      target: "_blank",
-                      rel: "noopener noreferrer",
-                      className: "underline underline-offset-2 hover:text-foreground",
-                      children: "Terms of Service"
-                    }
-                  ),
-                  " ",
-                  "apply."
-                ] }) : null
-              ] })
+              /* @__PURE__ */ jsxs(
+                "p",
+                {
+                  "data-boff-explore": "disclaimer",
+                  className: "mt-2 text-xs leading-relaxed text-muted-foreground",
+                  children: [
+                    "Answers are generated from our public documentation and can be imperfect \u2014 check anything important against the linked sources.",
+                    " ",
+                    "Conversations are saved in this browser so you can come back to them, and are also stored on our servers to help us improve these answers. Please don't share personal or confidential information.",
+                    captchaOn ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      " ",
+                      "This site is protected by reCAPTCHA; the Google",
+                      " ",
+                      /* @__PURE__ */ jsx(
+                        "a",
+                        {
+                          href: "https://policies.google.com/privacy",
+                          target: "_blank",
+                          rel: "noopener noreferrer",
+                          className: "underline underline-offset-2 hover:text-foreground",
+                          children: "Privacy Policy"
+                        }
+                      ),
+                      " ",
+                      "and",
+                      " ",
+                      /* @__PURE__ */ jsx(
+                        "a",
+                        {
+                          href: "https://policies.google.com/terms",
+                          target: "_blank",
+                          rel: "noopener noreferrer",
+                          className: "underline underline-offset-2 hover:text-foreground",
+                          children: "Terms of Service"
+                        }
+                      ),
+                      " ",
+                      "apply."
+                    ] }) : null
+                  ]
+                }
+              )
             ]
           }
         ) })
@@ -6591,11 +7094,12 @@ function ExploreCta({
     onNavigate(href);
   };
   const classes = {
-    // `shrink-0` matters: this sits in a host header's flex row, and without it the
-    // surrounding nav gets squeezed and its links wrap onto two lines. The label is hidden
-    // below 2xl for the same reason — most product headers are already close to full at
-    // 1440px, and a 90px pill there pushes them over.
-    header: "inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-primary to-primary/70 px-2.5 py-1.5 text-sm font-medium text-primary-foreground shadow-sm transition-opacity hover:opacity-90 2xl:px-3.5",
+    // A quiet icon control, deliberately NOT a second gradient pill: a header should carry one
+    // primary CTA ("Get started"), and a competing coloured button next to it reads as clutter.
+    // This matches the theme toggle's visual weight, so the row scans as [utilities] [CTA].
+    // The prominent, labelled entry point to /explore is the floating bubble, which is visible
+    // on every page without scrolling. `shrink-0` keeps it from squeezing the nav.
+    header: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     mobile: "inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     floating: "fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90"
   };
@@ -6623,7 +7127,7 @@ function ExploreCta({
           {
             className: cn(
               "shrink-0",
-              variant === "floating" ? "h-4 w-4" : "h-3.5 w-3.5"
+              variant === "floating" ? "h-4 w-4" : variant === "header" ? "h-5 w-5" : "h-3.5 w-3.5"
             ),
             "aria-hidden": "true"
           }
@@ -6633,7 +7137,8 @@ function ExploreCta({
           {
             className: cn(
               variant === "floating" && "hidden sm:inline",
-              variant === "header" && "hidden 2xl:inline"
+              // Never labelled in the header — see the class comment above.
+              variant === "header" && "hidden"
             ),
             children: label
           }