@burdenoff/website-sdk 2026.1024.1 → 2026.1026.1

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { createContext, useMemo, useContext, useState, useCallback, useLayoutEffect, useRef, useEffect, useId, version, Children, isValidElement, cloneElement } from 'react';
+import { createContext, forwardRef, useState, useEffect, useMemo, useContext, useCallback, useLayoutEffect, useRef, useId, version, Children, isValidElement, cloneElement } 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, ImageIcon, ChevronRight, Maximize2, Check, ArrowLeft, Sparkles, RotateCcw, Link2, History, Trash2, Paperclip, X, Mic, Square, ArrowUp, Info, ExternalLink, ChevronLeft, BookOpenText, Layers, TriangleAlert, FileText, Film, Play, Copy, ThumbsUp, ThumbsDown, Minimize, Maximize, VideoOff, Volume2 } from 'lucide-react';
+import { Instagram, Youtube, Facebook, Github, Linkedin, Twitter, Sparkles, Mail, Phone, MapPin, Clock, Send, CheckCircle, Upload, Globe, ChevronDown, Search, Rocket, ArrowRight, Download, ImageIcon, ChevronRight, Maximize2, Check, ArrowLeft, RotateCcw, Link2, History, Trash2, Paperclip, X, Mic, Square, ArrowUp, Minimize2, Info, ExternalLink, ChevronLeft, BookOpenText, Layers, TriangleAlert, FileText, Film, Play, Copy, ThumbsUp, ThumbsDown, Minimize, Maximize, VideoOff, Volume2 } from 'lucide-react';
 import ReCAPTCHA4 from 'react-google-recaptcha';
 import { toast } from 'sonner';
 import { Helmet } from 'react-helmet-async';
@@ -6531,6 +6531,14 @@ var EN = {
   closeVideo: "Close video",
   enterFullScreen: "Full screen",
   exitFullScreen: "Exit full screen",
+  panelTitle: "AI assistant",
+  panelViews: "Assistant views",
+  tabChat: "Chat",
+  tabAvatar: "Avatar",
+  closePanel: "Close",
+  liveAvatar: "Live avatar",
+  avatarComingSoon: "Live avatar coming soon",
+  continueInChat: "Continue in Chat",
   videoUnavailable: "This video can't be played right now.",
   groundedIn: "What this answer is based on",
   sourceCountOne: "1 source",
@@ -6639,6 +6647,14 @@ var ZH = {
   closeVideo: "\u5173\u95ED\u89C6\u9891",
   enterFullScreen: "\u5168\u5C4F",
   exitFullScreen: "\u9000\u51FA\u5168\u5C4F",
+  panelTitle: "AI \u52A9\u624B",
+  panelViews: "\u52A9\u624B\u89C6\u56FE",
+  tabChat: "\u804A\u5929",
+  tabAvatar: "\u865A\u62DF\u5F62\u8C61",
+  closePanel: "\u5173\u95ED",
+  liveAvatar: "\u5B9E\u65F6\u865A\u62DF\u5F62\u8C61",
+  avatarComingSoon: "\u5B9E\u65F6\u865A\u62DF\u5F62\u8C61\u5373\u5C06\u63A8\u51FA",
+  continueInChat: "\u5728\u804A\u5929\u4E2D\u7EE7\u7EED",
   videoUnavailable: "\u6682\u65F6\u65E0\u6CD5\u64AD\u653E\u6B64\u89C6\u9891\u3002",
   groundedIn: "\u8FD9\u4E2A\u56DE\u7B54\u7684\u4F9D\u636E",
   sourceCountOne: "1 \u4E2A\u6765\u6E90",
@@ -6743,6 +6759,14 @@ var HI = {
   closeVideo: "\u0935\u0940\u0921\u093F\u092F\u094B \u092C\u0902\u0926 \u0915\u0930\u0947\u0902",
   enterFullScreen: "\u092A\u0942\u0930\u094D\u0923 \u0938\u094D\u0915\u094D\u0930\u0940\u0928",
   exitFullScreen: "\u092A\u0942\u0930\u094D\u0923 \u0938\u094D\u0915\u094D\u0930\u0940\u0928 \u0938\u0947 \u092C\u093E\u0939\u0930 \u0928\u093F\u0915\u0932\u0947\u0902",
+  panelTitle: "AI \u0938\u0939\u093E\u092F\u0915",
+  panelViews: "\u0938\u0939\u093E\u092F\u0915 \u0926\u0943\u0936\u094D\u092F",
+  tabChat: "\u091A\u0948\u091F",
+  tabAvatar: "\u0905\u0935\u0924\u093E\u0930",
+  closePanel: "\u092C\u0902\u0926 \u0915\u0930\u0947\u0902",
+  liveAvatar: "\u0932\u093E\u0907\u0935 \u0905\u0935\u0924\u093E\u0930",
+  avatarComingSoon: "\u0932\u093E\u0907\u0935 \u0905\u0935\u0924\u093E\u0930 \u091C\u0932\u094D\u0926 \u0906 \u0930\u0939\u093E \u0939\u0948",
+  continueInChat: "\u091A\u0948\u091F \u092E\u0947\u0902 \u091C\u093E\u0930\u0940 \u0930\u0916\u0947\u0902",
   videoUnavailable: "\u092F\u0939 \u0935\u0940\u0921\u093F\u092F\u094B \u0905\u092D\u0940 \u0928\u0939\u0940\u0902 \u091A\u0932 \u0938\u0915\u0924\u093E\u0964",
   groundedIn: "\u092F\u0939 \u0909\u0924\u094D\u0924\u0930 \u0915\u093F\u0938 \u092A\u0930 \u0906\u0927\u093E\u0930\u093F\u0924 \u0939\u0948",
   sourceCountOne: "1 \u0938\u094D\u0930\u094B\u0924",
@@ -6851,6 +6875,14 @@ var ES = {
   closeVideo: "Cerrar v\xEDdeo",
   enterFullScreen: "Pantalla completa",
   exitFullScreen: "Salir de pantalla completa",
+  panelTitle: "Asistente de IA",
+  panelViews: "Vistas del asistente",
+  tabChat: "Chat",
+  tabAvatar: "Avatar",
+  closePanel: "Cerrar",
+  liveAvatar: "Avatar en vivo",
+  avatarComingSoon: "Avatar en vivo: pr\xF3ximamente",
+  continueInChat: "Continuar en el chat",
   videoUnavailable: "Ahora mismo no se puede reproducir este v\xEDdeo.",
   groundedIn: "En qu\xE9 se basa esta respuesta",
   sourceCountOne: "1 fuente",
@@ -6959,6 +6991,14 @@ var AR = {
   closeVideo: "\u0625\u063A\u0644\u0627\u0642 \u0627\u0644\u0641\u064A\u062F\u064A\u0648",
   enterFullScreen: "\u0645\u0644\u0621 \u0627\u0644\u0634\u0627\u0634\u0629",
   exitFullScreen: "\u0627\u0644\u062E\u0631\u0648\u062C \u0645\u0646 \u0645\u0644\u0621 \u0627\u0644\u0634\u0627\u0634\u0629",
+  panelTitle: "\u0645\u0633\u0627\u0639\u062F \u0627\u0644\u0630\u0643\u0627\u0621 \u0627\u0644\u0627\u0635\u0637\u0646\u0627\u0639\u064A",
+  panelViews: "\u0637\u0631\u0642 \u0639\u0631\u0636 \u0627\u0644\u0645\u0633\u0627\u0639\u062F",
+  tabChat: "\u062F\u0631\u062F\u0634\u0629",
+  tabAvatar: "\u0627\u0644\u0623\u0641\u0627\u062A\u0627\u0631",
+  closePanel: "\u0625\u063A\u0644\u0627\u0642",
+  liveAvatar: "\u0627\u0644\u0623\u0641\u0627\u062A\u0627\u0631 \u0627\u0644\u0645\u0628\u0627\u0634\u0631",
+  avatarComingSoon: "\u0627\u0644\u0623\u0641\u0627\u062A\u0627\u0631 \u0627\u0644\u0645\u0628\u0627\u0634\u0631 \u0642\u0631\u064A\u0628\u064B\u0627",
+  continueInChat: "\u0627\u0644\u0645\u062A\u0627\u0628\u0639\u0629 \u0641\u064A \u0627\u0644\u062F\u0631\u062F\u0634\u0629",
   videoUnavailable: "\u062A\u0639\u0630\u0651\u0631 \u062A\u0634\u063A\u064A\u0644 \u0647\u0630\u0627 \u0627\u0644\u0641\u064A\u062F\u064A\u0648 \u0627\u0644\u0622\u0646.",
   groundedIn: "\u0639\u0644\u0649 \u0645\u0627\u0630\u0627 \u062A\u0633\u062A\u0646\u062F \u0647\u0630\u0647 \u0627\u0644\u0625\u062C\u0627\u0628\u0629",
   sourceCountOne: "\u0645\u0635\u062F\u0631 \u0648\u0627\u062D\u062F",
@@ -7067,6 +7107,14 @@ var TA = {
   closeVideo: "\u0BB5\u0BC0\u0B9F\u0BBF\u0BAF\u0BCB\u0BB5\u0BC8 \u0BAE\u0BC2\u0B9F\u0BC1",
   enterFullScreen: "\u0BAE\u0BC1\u0BB4\u0BC1\u0BA4\u0BCD \u0BA4\u0BBF\u0BB0\u0BC8",
   exitFullScreen: "\u0BAE\u0BC1\u0BB4\u0BC1\u0BA4\u0BCD \u0BA4\u0BBF\u0BB0\u0BC8\u0BAF\u0BBF\u0BB2\u0BBF\u0BB0\u0BC1\u0BA8\u0BCD\u0BA4\u0BC1 \u0BB5\u0BC6\u0BB3\u0BBF\u0BAF\u0BC7\u0BB1\u0BC1",
+  panelTitle: "AI \u0B89\u0BA4\u0BB5\u0BBF\u0BAF\u0BBE\u0BB3\u0BB0\u0BCD",
+  panelViews: "\u0B89\u0BA4\u0BB5\u0BBF\u0BAF\u0BBE\u0BB3\u0BB0\u0BCD \u0B95\u0BBE\u0B9F\u0BCD\u0B9A\u0BBF\u0B95\u0BB3\u0BCD",
+  tabChat: "\u0B85\u0BB0\u0B9F\u0BCD\u0B9F\u0BC8",
+  tabAvatar: "\u0B85\u0BB5\u0BA4\u0BBE\u0BB0\u0BCD",
+  closePanel: "\u0BAE\u0BC2\u0B9F\u0BC1",
+  liveAvatar: "\u0BA8\u0BC7\u0BB0\u0BB2\u0BC8 \u0B85\u0BB5\u0BA4\u0BBE\u0BB0\u0BCD",
+  avatarComingSoon: "\u0BA8\u0BC7\u0BB0\u0BB2\u0BC8 \u0B85\u0BB5\u0BA4\u0BBE\u0BB0\u0BCD \u0BB5\u0BBF\u0BB0\u0BC8\u0BB5\u0BBF\u0BB2\u0BCD",
+  continueInChat: "\u0B85\u0BB0\u0B9F\u0BCD\u0B9F\u0BC8\u0BAF\u0BBF\u0BB2\u0BCD \u0BA4\u0BCA\u0B9F\u0BB0\u0BB5\u0BC1\u0BAE\u0BCD",
   videoUnavailable: "\u0B87\u0BA8\u0BCD\u0BA4 \u0BB5\u0BC0\u0B9F\u0BBF\u0BAF\u0BCB\u0BB5\u0BC8 \u0B87\u0BAA\u0BCD\u0BAA\u0BCB\u0BA4\u0BC1 \u0B87\u0BAF\u0B95\u0BCD\u0B95 \u0BAE\u0BC1\u0B9F\u0BBF\u0BAF\u0BB5\u0BBF\u0BB2\u0BCD\u0BB2\u0BC8.",
   groundedIn: "\u0B87\u0BA8\u0BCD\u0BA4\u0BAA\u0BCD \u0BAA\u0BA4\u0BBF\u0BB2\u0BCD \u0B8E\u0BA4\u0BC8 \u0B85\u0B9F\u0BBF\u0BAA\u0BCD\u0BAA\u0B9F\u0BC8\u0BAF\u0BBE\u0B95\u0B95\u0BCD \u0B95\u0BCA\u0BA3\u0BCD\u0B9F\u0BA4\u0BC1",
   sourceCountOne: "1 \u0BAE\u0BC2\u0BB2\u0BAE\u0BCD",
@@ -10223,7 +10271,9 @@ function useExploreChat(options = {}) {
     pollTimeoutMs = DEFAULT_POLL_TIMEOUT_MS,
     storageKey = DEFAULT_STORAGE_KEY,
     persist = true,
-    onSend
+    onSend,
+    enabled = true,
+    shareToken: shareTokenOption
   } = options;
   const client = useWebSDK();
   const { productId } = useWebSDKConfig();
@@ -10261,7 +10311,7 @@ function useExploreChat(options = {}) {
   const [hasConversation, setHasConversation] = useState(false);
   const shareTokenRef = useRef(void 0);
   if (shareTokenRef.current === void 0) {
-    shareTokenRef.current = readShareToken();
+    shareTokenRef.current = shareTokenOption === void 0 ? readShareToken() : shareTokenOption;
   }
   const isSharedView = shareTokenRef.current !== null;
   const catalogRef = useRef(catalog);
@@ -10299,6 +10349,7 @@ function useExploreChat(options = {}) {
     };
   }, []);
   useEffect(() => {
+    if (!enabled) return;
     const shareToken = shareTokenRef.current;
     if (!shareToken) return;
     let cancelled = false;
@@ -10333,8 +10384,9 @@ function useExploreChat(options = {}) {
     return () => {
       cancelled = true;
     };
-  }, [client]);
+  }, [client, enabled]);
   useEffect(() => {
+    if (!enabled) return;
     if (shareTokenRef.current !== null) return;
     if (!persist) {
       setHydrated(true);
@@ -10359,9 +10411,10 @@ function useExploreChat(options = {}) {
       setTurnCount(turns);
     }
     setHydrated(true);
-  }, [persist, rememberConversationToken, storageKey]);
+  }, [persist, rememberConversationToken, storageKey, enabled]);
   useEffect(() => {
-    if (!persist || !hydrated || typeof window === "undefined") return;
+    if (!persist || !hydrated || isSharedView || typeof window === "undefined")
+      return;
     try {
       const payload = {
         conversationToken: conversationTokenRef.current,
@@ -10375,10 +10428,10 @@ function useExploreChat(options = {}) {
       window.localStorage.setItem(storageKey, JSON.stringify(payload));
     } catch {
     }
-  }, [persist, hydrated, storageKey, messages, focusProduct]);
+  }, [persist, hydrated, isSharedView, storageKey, messages, focusProduct]);
   useEffect(() => {
     messagesRef.current = messages;
-    if (!persist || !hydrated) return;
+    if (!persist || !hydrated || isSharedView) return;
     const settled = messages.some(
       (m) => m.role === "ASSISTANT" && (m.status === "COMPLETED" || m.status === "FAILED")
     );
@@ -10390,8 +10443,9 @@ function useExploreChat(options = {}) {
         focusProduct: focusProductRef.current
       })
     );
-  }, [messages, persist, hydrated, storageKey]);
+  }, [messages, persist, hydrated, isSharedView, storageKey]);
   useEffect(() => {
+    if (!enabled) return;
     let cancelled = false;
     const load = async () => {
       const variables = { productSlug: productSlug ?? null };
@@ -10432,7 +10486,7 @@ function useExploreChat(options = {}) {
     return () => {
       cancelled = true;
     };
-  }, [client, productSlug, fallbackCatalog, bakedRaw]);
+  }, [client, productSlug, fallbackCatalog, bakedRaw, enabled]);
   const startPolling = useCallback(
     (conversationToken, messageId) => {
       pollGenerationRef.current += 1;
@@ -10929,6 +10983,56 @@ function makeOptimisticId() {
   optimisticCounter += 1;
   return `boff-explore-local-${Date.now()}-${optimisticCounter}`;
 }
+var ExploreConversationContext = createContext(null);
+function useExploreConversation(options = {}) {
+  const {
+    productSlug,
+    locale,
+    examplePrompts,
+    onSend,
+    pageUrl,
+    enabled,
+    shareToken
+  } = options;
+  const urlAtMount = useMemo(
+    () => typeof window === "undefined" ? void 0 : window.location.href,
+    []
+  );
+  const T = useMemo(
+    () => exploreStrings(resolveExploreLocale(locale)),
+    [locale]
+  );
+  const chat = useExploreChat({
+    productSlug,
+    pageUrl: pageUrl ?? urlAtMount,
+    onSend,
+    // Locale-aware, so a catalog outage degrades to a translated welcome rather than an English one.
+    examplePrompts: examplePrompts ?? T.prompts,
+    fallbackWelcome: { title: T.welcomeTitle, body: T.welcomeBody },
+    ...enabled === void 0 ? {} : { enabled },
+    ...shareToken === void 0 ? {} : { shareToken }
+  });
+  const [draft, setDraft] = useState("");
+  const [staged, setStaged] = useState([]);
+  return useMemo(
+    () => ({ ...chat, draft, setDraft, staged, setStaged }),
+    [chat, draft, staged]
+  );
+}
+function ExploreChatProvider({
+  enabled,
+  children,
+  ...options
+}) {
+  const [started, setStarted] = useState(enabled);
+  if (enabled && !started) setStarted(true);
+  const conversation = useExploreConversation({
+    ...options,
+    // `enabled` as well as `started`: on the render that first sees `enabled`, the latch above has only been queued.
+    enabled: enabled || started
+  });
+  return /* @__PURE__ */ jsx(ExploreConversationContext.Provider, { value: conversation, children });
+}
 var DRAIN_TARGET_MS = 1200;
 var MIN_CHARS_PER_SECOND = 90;
 var MAX_CHARS_PER_SECOND = 2200;
@@ -13573,15 +13677,17 @@ function WelcomeState({
   focusProduct,
   onPrompt,
   onFocus,
-  disabled
+  disabled,
+  heading = "h1"
 }) {
+  const Heading = heading;
   return /* @__PURE__ */ jsxs("div", { className: "boff-explore-aura mx-auto my-auto w-full max-w-3xl px-4 py-4 sm:py-5", children: [
     /* @__PURE__ */ jsxs("div", { className: "boff-explore-rise text-center", children: [
       /* @__PURE__ */ jsxs("span", { className: "boff-explore-hero-badge inline-flex items-center gap-1.5 rounded-full border border-border bg-muted px-3 py-1 text-xs font-medium text-muted-foreground", children: [
         /* @__PURE__ */ jsx(Sparkles, { className: "h-3.5 w-3.5" }),
         T.badge
       ] }),
-      /* @__PURE__ */ jsx("h1", { className: "mt-2 text-balance break-words text-2xl font-bold tracking-tight sm:text-3xl", children: title }),
+      /* @__PURE__ */ jsx(Heading, { className: "mt-2 text-balance break-words text-2xl font-bold tracking-tight sm:text-3xl", children: title }),
       /* @__PURE__ */ jsx("p", { className: "mx-auto mt-2 max-w-2xl text-pretty text-sm leading-relaxed text-muted-foreground", children: body })
     ] }),
     /* @__PURE__ */ jsx("ul", { className: "boff-explore-capabilities boff-explore-rise boff-explore-rise-1 mt-4 grid grid-cols-3 gap-2 sm:gap-2.5", children: CAPABILITIES.map(({ icon: Icon, body: capBody }, i) => /* @__PURE__ */ jsxs(
@@ -13636,19 +13742,36 @@ function exploreQuestionHref(question, base = "/explore") {
   const joiner = base.includes("?") ? "&" : "?";
   return `${base}${joiner}q=${encodeURIComponent(trimmed)}`;
 }
-function ExplorePage({
+function ExplorePage(props) {
+  const shared = useContext(ExploreConversationContext);
+  return shared ? /* @__PURE__ */ jsx(ExploreView, { ...props, conversation: shared }) : /* @__PURE__ */ jsx(StandaloneExplorePage, { ...props });
+}
+function StandaloneExplorePage(props) {
+  const conversation = useExploreConversation({
+    productSlug: props.productSlug,
+    locale: props.locale,
+    examplePrompts: props.examplePrompts,
+    onSend: props.onSend
+  });
+  return /* @__PURE__ */ jsx(ExploreView, { ...props, conversation });
+}
+function ExploreView({
   seo,
   productSlug,
-  examplePrompts,
   className,
   heightMode = "viewport",
   viewportOffset,
   onNavigate,
-  onSend,
   welcomeTitle,
   welcomeBody,
-  locale
+  locale,
+  presentation = "page",
+  active = true,
+  explorePath = "/explore",
+  conversation
 }) {
+  const panel = presentation === "panel";
+  const viewportPage = !panel && heightMode === "viewport";
   const pageUrl = useMemo(
     () => typeof window === "undefined" ? void 0 : window.location.href,
     []
@@ -13684,26 +13807,21 @@ function ExplorePage({
     escalate,
     canEscalate,
     createShareLink,
-    isSharedView
-  } = useExploreChat({
-    productSlug,
-    pageUrl,
-    onSend,
-    // Locale-aware, so a catalog outage degrades to a translated welcome rather than an
-    // English one. `T.prompts` seeds the chips the same way.
-    examplePrompts: examplePrompts ?? T.prompts,
-    fallbackWelcome: { title: T.welcomeTitle, body: T.welcomeBody }
-  });
-  const [draft, setDraft] = useState("");
+    isSharedView,
+    draft,
+    setDraft,
+    staged,
+    setStaged
+  } = conversation;
   const textareaRef = useRef(null);
   useEffect(() => {
-    if (typeof window === "undefined") return;
+    if (typeof window === "undefined" || panel) return;
     const params = new URLSearchParams(window.location.search);
     if (params.has("c")) return;
     const question = params.get("q")?.trim();
     if (!question) return;
     setDraft(question.slice(0, EXPLORE_PREFILL_MAX_LENGTH));
-  }, []);
+  }, [panel, setDraft]);
   const [historyOpen, setHistoryOpen] = useState(false);
   const speechStopRef = useRef(() => void 0);
   const stopDictation = useCallback(() => {
@@ -13719,8 +13837,12 @@ function ExplorePage({
     }
   });
   speechStopRef.current = speech.stop;
+  useEffect(() => {
+    if (active) return;
+    stopDictation();
+    stopSpeaking();
+  }, [active, stopDictation]);
   const [disclaimerOpen, setDisclaimerOpen] = useState(false);
-  const [staged, setStaged] = useState([]);
   const [attachmentNotice, setAttachmentNotice] = useState(null);
   const fileInputRef = useRef(null);
   const stagedRef = useRef([]);
@@ -13773,7 +13895,7 @@ function ExplorePage({
   const [bottomInset, setBottomInset] = useState(0);
   const paneOffsetRef = useRef(0);
   const measurePane = useCallback(() => {
-    if (heightMode !== "viewport") return;
+    if (!viewportPage) return;
     const el = rootRef.current;
     if (!el) return;
     const layoutHeight = window.innerHeight;
@@ -13792,7 +13914,7 @@ function ExplorePage({
     paneOffsetRef.current = top;
     setPaneOffset((current) => current === top ? current : top);
     setBottomInset((current) => current === inset ? current : inset);
-  }, [heightMode]);
+  }, [viewportPage]);
   const [chromeOverlap, setChromeOverlap] = useState(0);
   const measureChrome = useCallback(() => {
     const root = rootRef.current;
@@ -13817,7 +13939,7 @@ function ExplorePage({
     measureChrome();
   }, [measurePane, measureChrome]);
   useEffect(() => {
-    if (typeof window === "undefined") return;
+    if (typeof window === "undefined" || panel) return;
     let frame = 0;
     const run = () => {
       frame = 0;
@@ -13855,12 +13977,12 @@ function ExplorePage({
       setBottomInset(0);
       setChromeOverlap(0);
     };
-  }, [remeasure]);
+  }, [remeasure, panel]);
   useEffect(() => {
     measureChrome();
   }, [measureChrome, paneOffset, bottomInset]);
   useEffect(() => {
-    if (heightMode !== "viewport" || typeof window === "undefined") return;
+    if (!viewportPage || typeof window === "undefined") return;
     const { history: browserHistory } = window;
     const previousRestoration = "scrollRestoration" in browserHistory ? browserHistory.scrollRestoration : null;
     if (previousRestoration !== null)
@@ -13928,14 +14050,14 @@ function ExplorePage({
       if (previousRestoration !== null)
         browserHistory.scrollRestoration = previousRestoration;
     };
-  }, [heightMode, remeasure]);
+  }, [viewportPage, remeasure]);
   const handleScroll = useCallback(() => {
     const el = scrollRef.current;
     if (!el) return;
     stickToBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
   }, []);
   useEffect(() => {
-    if (typeof window === "undefined") return;
+    if (typeof window === "undefined" || panel) return;
     let frame = 0;
     const run = () => {
       frame = 0;
@@ -13958,7 +14080,7 @@ function ExplorePage({
       if (frame) window.cancelAnimationFrame(frame);
       window.removeEventListener("scroll", schedule);
     };
-  }, []);
+  }, [panel]);
   const latestAssistantId = useMemo(() => {
     for (let i = messages.length - 1; i >= 0; i -= 1) {
       const message = messages[i];
@@ -13974,7 +14096,7 @@ function ExplorePage({
     if (!stickToBottomRef.current) return;
     if (anchor.offsetHeight === 0) return;
     alignedForRef.current = latestAssistantId;
-    if (!pageOwnsScrolling(el)) {
+    if (panel || !pageOwnsScrolling(el)) {
       const delta2 = anchor.getBoundingClientRect().top - el.getBoundingClientRect().top;
       el.scrollTop = Math.max(0, el.scrollTop + delta2 - 12);
       return;
@@ -13983,7 +14105,7 @@ function ExplorePage({
       anchor.getBoundingClientRect().top - paneOffsetRef.current - 12
     );
     if (delta !== 0) window.scrollBy({ top: delta, left: 0, behavior: "auto" });
-  }, [latestAssistantId, messages]);
+  }, [latestAssistantId, messages, panel]);
   useEffect(() => {
     if (messages.length === 0) return;
     if (!stickToBottomRef.current) return;
@@ -13991,7 +14113,7 @@ function ExplorePage({
       return;
     const el = scrollRef.current;
     if (!el) return;
-    if (!pageOwnsScrolling(el)) {
+    if (panel || !pageOwnsScrolling(el)) {
       el.scrollTop = el.scrollHeight;
       return;
     }
@@ -14000,7 +14122,7 @@ function ExplorePage({
       dock.getBoundingClientRect().bottom - visualViewportHeight()
     );
     if (delta > 0) window.scrollBy({ top: delta, left: 0, behavior: "auto" });
-  }, [activity, latestAssistantId, messages]);
+  }, [activity, latestAssistantId, messages, panel]);
   const handleShare = useCallback(async () => {
     setShareLabel(T.copying);
     setShareUrl(null);
@@ -14010,7 +14132,7 @@ function ExplorePage({
       setTimeout(() => setShareLabel(T.share), 2500);
       return;
     }
-    const url = new URL(pageUrl ?? window.location.href);
+    const url = panel ? new URL(explorePath, window.location.href) : new URL(pageUrl ?? window.location.href);
     url.search = "";
     url.hash = "";
     url.searchParams.set("c", token);
@@ -14026,6 +14148,8 @@ function ExplorePage({
   }, [
     createShareLink,
     pageUrl,
+    panel,
+    explorePath,
     T.copied,
     T.copying,
     T.share,
@@ -14054,12 +14178,15 @@ function ExplorePage({
       });
       return pickQueueRef.current;
     },
-    [T]
+    [T, setStaged]
+  );
+  const removeAttachment = useCallback(
+    (id) => {
+      setStaged((prev) => prev.filter((entry) => entry.id !== id));
+      setAttachmentNotice(null);
+    },
+    [setStaged]
   );
-  const removeAttachment = useCallback((id) => {
-    setStaged((prev) => prev.filter((entry) => entry.id !== id));
-    setAttachmentNotice(null);
-  }, []);
   const submitDraft = useCallback(() => {
     const text = draft.trim();
     if (!text || overLimit || busy || !canSend) return;
@@ -14071,7 +14198,16 @@ function ExplorePage({
     setStaged([]);
     setAttachmentNotice(null);
     textareaRef.current?.focus();
-  }, [busy, canSend, draft, overLimit, send, stopDictation]);
+  }, [
+    busy,
+    canSend,
+    draft,
+    overLimit,
+    send,
+    setDraft,
+    setStaged,
+    stopDictation
+  ]);
   const sendPrompt = useCallback(
     (prompt) => {
       if (!canSend || busy) return;
@@ -14082,7 +14218,7 @@ function ExplorePage({
       setStaged([]);
       setAttachmentNotice(null);
     },
-    [busy, canSend, send]
+    [busy, canSend, send, setDraft, setStaged]
   );
   const handleKeyDown = useCallback(
     (event) => {
@@ -14104,7 +14240,7 @@ function ExplorePage({
     [serverCatalogRaw]
   );
   const rootStyle = {};
-  if (heightMode === "viewport") {
+  if (viewportPage) {
     rootStyle["--boff-explore-offset"] = paneOffset === null ? normalizeOffset(viewportOffset) : `${paneOffset}px`;
     if (bottomInset > 0) {
       rootStyle["--boff-explore-inset"] = `${bottomInset}px`;
@@ -14117,19 +14253,19 @@ function ExplorePage({
     "div",
     {
       ref: rootRef,
-      "data-boff-explore": "page",
+      "data-boff-explore": panel ? "panel" : "page",
       "data-phase": phase,
       "data-locale": activeLocale,
       dir: rtl ? "rtl" : void 0,
       className: cn(
-        "flex w-full min-w-0 flex-col overflow-x-hidden bg-background text-foreground",
-        heightMode === "viewport" && "boff-explore-viewport",
-        heightMode === "auto" && "min-h-[70vh]",
+        panel ? "boff-explore-panel flex h-full min-h-0 w-full min-w-0 flex-col overflow-hidden bg-background text-foreground" : "flex w-full min-w-0 flex-col overflow-x-hidden bg-background text-foreground",
+        viewportPage && "boff-explore-viewport",
+        !panel && heightMode === "auto" && "min-h-[70vh]",
         className
       ),
-      style: rootStyle,
+      style: panel ? void 0 : rootStyle,
       children: [
-        /* @__PURE__ */ jsx(
+        panel ? null : /* @__PURE__ */ jsx(
           PageHead,
           {
             title: seo?.title ?? T.seoTitle,
@@ -14142,7 +14278,11 @@ function ExplorePage({
         ),
         /* @__PURE__ */ jsx(ProseStyles, {}),
         /* @__PURE__ */ jsx(ExploreStyles, {}),
-        bakedCatalogJson ? /* @__PURE__ */ jsx(
+        panel ? /* @__PURE__ */ jsx("style", { children: `.boff-explore-panel .boff-explore-scroll { container: boff-explore-pane / size; }
+@container boff-explore-pane (width < ${toRem(WELCOME_FIT_MIN_WIDTH_PX)}) {
+  .boff-explore-panel .boff-explore-scroll .boff-explore-capabilities { display: none; }
+}` }) : null,
+        !panel && bakedCatalogJson ? /* @__PURE__ */ jsx(
           "script",
           {
             id: BAKED_CATALOG_ELEMENT_ID,
@@ -14162,7 +14302,7 @@ function ExplorePage({
               children: /* @__PURE__ */ jsx(Sparkles, { className: "h-4 w-4" })
             }
           ),
-          /* @__PURE__ */ jsx("h1", { className: "truncate text-sm font-semibold", children: resolvedTitle }),
+          panel ? /* @__PURE__ */ jsx("h2", { className: "truncate text-sm font-semibold", children: resolvedTitle }) : /* @__PURE__ */ jsx("h1", { className: "truncate text-sm font-semibold", children: resolvedTitle }),
           focusedProductName ? /* @__PURE__ */ jsx("span", { className: "hidden shrink-0 rounded-full bg-secondary px-2 py-0.5 text-xs font-medium text-secondary-foreground sm:inline", children: focusedProductName }) : null,
           /* @__PURE__ */ jsxs(
             Button,
@@ -14306,6 +14446,7 @@ function ExplorePage({
             children: showWelcome ? /* @__PURE__ */ jsx(
               WelcomeState,
               {
+                heading: panel ? "h2" : "h1",
                 strings: T,
                 title: resolvedTitle,
                 body: resolvedBody,
@@ -14668,77 +14809,738 @@ function samePath(a, b) {
   const norm = (v) => v.length > 1 ? v.replace(/\/+$/, "") : v;
   return norm(a) === norm(b);
 }
-function ExploreCta({
-  variant,
-  href = "/explore",
-  label = "Ask AI",
-  className,
+var ExploreCta = forwardRef(
+  function ExploreCta2({
+    variant,
+    href = "/explore",
+    label = "Ask AI",
+    className,
+    onNavigate,
+    onClick,
+    currentPath,
+    expanded,
+    controls
+  }, ref) {
+    const path = useCurrentPath(currentPath);
+    const isActive = samePath(path, href);
+    if (variant === "floating" && isActive) return null;
+    const handleClick = (event) => {
+      onClick?.();
+      if (!onNavigate) return;
+      if (event.defaultPrevented || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0) {
+        return;
+      }
+      event.preventDefault();
+      onNavigate(href);
+    };
+    const classes = {
+      // 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"
+    };
+    const hooks = {
+      header: "cta-header",
+      mobile: "cta-mobile",
+      floating: "cta-floating"
+    };
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        ref,
+        "data-boff-explore": hooks[variant],
+        href,
+        onClick: handleClick,
+        "aria-label": label,
+        "aria-current": isActive ? "page" : void 0,
+        "aria-expanded": expanded,
+        "aria-haspopup": expanded === void 0 ? void 0 : "dialog",
+        "aria-controls": expanded === void 0 ? void 0 : controls,
+        className: cn(
+          classes[variant],
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            Sparkles,
+            {
+              className: cn(
+                "shrink-0",
+                variant === "floating" ? "h-4 w-4" : variant === "header" ? "h-5 w-5" : "h-3.5 w-3.5"
+              ),
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                variant === "floating" && "hidden sm:inline",
+                // Never labelled in the header — see the class comment above.
+                variant === "header" && "hidden"
+              ),
+              children: label
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+var MARK_KEY = "boffExplorePanel";
+var POS_KEY = "boffExplorePanelPos";
+var DOC_KEY = "boffExplorePanelDoc";
+var DOC_ID = `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 10)}`;
+var lastPos = 0;
+var hostMode = null;
+var NARROW_QUERY = "(max-width: 639px)";
+var TOUCH_FIRST_QUERY = "(hover: none) and (pointer: coarse)";
+var COMPOSER_FOCUS_TRIES = 15;
+var PANEL_CSS = `
+.boff-explore-shell {
+  --boff-explore-shell-lift-at: max(var(--boff-explore-shell-lift, 0px), var(--boff-explore-shell-bottom, 0px));
+  --boff-explore-shell-room-at: var(--boff-explore-shell-room, calc(100vh - var(--boff-explore-shell-bottom, 0px)));
+  position: fixed;
+  z-index: var(--boff-explore-shell-z, 50);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  overscroll-behavior: contain;
+  inset-inline-end: 1rem;
+  bottom: calc(1rem + var(--boff-explore-shell-lift-at));
+  width: min(26rem, calc(100vw - 2rem));
+  height: min(40rem, calc(var(--boff-explore-shell-room-at) - 6rem));
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 1rem;
+}
+@supports (height: 100dvh) {
+  .boff-explore-shell {
+    --boff-explore-shell-room-at: var(--boff-explore-shell-room, calc(100dvh - var(--boff-explore-shell-bottom, 0px)));
+  }
+}
+@media (max-width: 639px) {
+  .boff-explore-shell[data-size="compact"] {
+    inset-inline: 0;
+    bottom: var(--boff-explore-shell-lift-at);
+    width: auto;
+    height: min(75vh, calc(var(--boff-explore-shell-room-at) - 4rem));
+    border-width: 1px 0 0;
+    border-radius: 1rem 1rem 0 0;
+  }
+  @supports (height: 100dvh) {
+    .boff-explore-shell[data-size="compact"] {
+      height: min(75dvh, calc(var(--boff-explore-shell-room-at) - 4rem));
+    }
+  }
+}
+.boff-explore-shell[data-size="expanded"] {
+  inset: var(--boff-explore-shell-top, 0px) 0 var(--boff-explore-shell-lift-at) 0;
+  width: auto;
+  height: auto;
+  border-width: 0;
+  border-radius: 0;
+  box-shadow: none;
+}
+.boff-explore-shell[data-open="false"] {
+  visibility: hidden;
+  content-visibility: hidden;
+}
+.boff-explore-shell:focus { outline: none; }
+`;
+function stateRecord() {
+  const state = window.history.state;
+  return state !== null && typeof state === "object" ? state : {};
+}
+function stampedHere() {
+  return stateRecord()[DOC_KEY] === DOC_ID;
+}
+function readMark() {
+  if (typeof window === "undefined" || !stampedHere()) return null;
+  const mark = stateRecord()[MARK_KEY];
+  return mark === "open" || mark === "expanded" ? mark : null;
+}
+function readPos() {
+  if (typeof window === "undefined" || !stampedHere()) return null;
+  const pos = stateRecord()[POS_KEY];
+  return typeof pos === "number" ? pos : null;
+}
+function stamp() {
+  if (typeof window === "undefined" || readPos() !== null) return;
+  const rest = { ...stateRecord() };
+  delete rest[MARK_KEY];
+  delete rest[POS_KEY];
+  delete rest[DOC_KEY];
+  lastPos += 1;
+  try {
+    window.history.replaceState(
+      { ...rest, [POS_KEY]: lastPos, [DOC_KEY]: DOC_ID },
+      ""
+    );
+  } catch {
+  }
+}
+function pushMark(mark) {
+  const { history } = window;
+  const mode = "scrollRestoration" in history ? history.scrollRestoration : null;
+  try {
+    if (mode !== null) history.scrollRestoration = "manual";
+    lastPos += 1;
+    history.pushState(
+      {
+        ...stateRecord(),
+        [MARK_KEY]: mark,
+        [POS_KEY]: lastPos,
+        [DOC_KEY]: DOC_ID
+      },
+      ""
+    );
+    return true;
+  } catch {
+    return false;
+  } finally {
+    if (mode !== null) history.scrollRestoration = mode;
+  }
+}
+function restoreScrollMode(mode, then) {
+  const { history } = window;
+  const put = () => {
+    if (history.scrollRestoration === "manual")
+      history.scrollRestoration = mode;
+    then?.();
+  };
+  if (typeof window.requestAnimationFrame !== "function") {
+    window.setTimeout(put, 50);
+    return;
+  }
+  window.requestAnimationFrame(() => window.requestAnimationFrame(put));
+}
+function closeInnerDialogs(shell) {
+  let closed = false;
+  document.querySelectorAll(
+    'dialog[data-boff-explore="video-dialog"]'
+  ).forEach((dialog) => {
+    if (!dialog.open) return;
+    dialog.close();
+    closed = true;
+  });
+  const disclaimer = shell?.querySelector(
+    '[data-boff-explore="disclaimer-dialog"]'
+  );
+  if (disclaimer) {
+    disclaimer.click();
+    closed = true;
+  }
+  return closed;
+}
+function marksOnTop(mark) {
+  if (mark === "expanded") return 2;
+  return mark === "open" ? 1 : 0;
+}
+function matches(query) {
+  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(query).matches;
+}
+function ExplorePanel({
+  open,
+  onOpenChange,
+  id = "boff-explore-panel",
+  productSlug,
+  locale,
   onNavigate,
-  onClick,
-  currentPath
+  welcomeTitle,
+  welcomeBody,
+  explorePath,
+  avatar,
+  bottomOffset,
+  zIndex,
+  returnFocusRef,
+  className
 }) {
-  const path = useCurrentPath(currentPath);
-  const isActive = samePath(path, href);
-  if (variant === "floating" && isActive) return null;
-  const handleClick = (event) => {
-    onClick?.();
-    if (!onNavigate) return;
-    if (event.defaultPrevented || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0) {
+  const resolvedLocale = resolveExploreLocale(locale);
+  const T = useMemo(() => exploreStrings(resolvedLocale), [resolvedLocale]);
+  const rtl = isRtlLocale(resolvedLocale);
+  const uid = useId();
+  const titleId = `${uid}-title`;
+  const chatTabId = `${uid}-chat-tab`;
+  const avatarTabId = `${uid}-avatar-tab`;
+  const chatPaneId = `${uid}-chat`;
+  const avatarPaneId = `${uid}-avatar`;
+  const [mounted, setMounted] = useState(open);
+  const [size, setSize] = useState("compact");
+  const [view, setView] = useState("chat");
+  const [focusRequest, setFocusRequest] = useState(
+    open ? "in" : null
+  );
+  const [wasOpen, setWasOpen] = useState(open);
+  if (open !== wasOpen) {
+    setWasOpen(open);
+    if (open) {
+      setMounted(true);
+      setFocusRequest("in");
+    } else {
+      setSize("compact");
+      setFocusRequest("back");
+    }
+  }
+  const shellRef = useRef(null);
+  const chatPaneRef = useRef(null);
+  const chatTabRef = useRef(null);
+  const avatarTabRef = useRef(null);
+  const ownPopsRef = useRef(0);
+  const settlingRef = useRef(false);
+  const afterPopRef = useRef([]);
+  const markRef = useRef(null);
+  const posRef = useRef(null);
+  const hrefRef = useRef(null);
+  const openRef = useRef(open);
+  const onOpenChangeRef = useRef(onOpenChange);
+  const lookedRef = useRef(false);
+  const traverse = useCallback((delta) => {
+    ownPopsRef.current += 1;
+    window.history.go(delta);
+  }, []);
+  const push = useCallback((mark) => {
+    const { history } = window;
+    if ("scrollRestoration" in history && history.scrollRestoration !== "manual") {
+      hostMode = history.scrollRestoration;
+    }
+    stamp();
+    if (!pushMark(mark)) return false;
+    markRef.current = mark;
+    posRef.current = readPos();
+    hrefRef.current = window.location.href;
+    return true;
+  }, []);
+  const whenSettled = useCallback((work) => {
+    if (ownPopsRef.current > 0 || settlingRef.current) {
+      afterPopRef.current.push(work);
+    } else {
+      work();
+    }
+  }, []);
+  const flush = useCallback(() => {
+    settlingRef.current = false;
+    while (afterPopRef.current.length > 0 && ownPopsRef.current === 0 && !settlingRef.current) {
+      afterPopRef.current.shift()?.();
+    }
+  }, []);
+  useEffect(() => {
+    openRef.current = open;
+    onOpenChangeRef.current = onOpenChange;
+  });
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    if (ownPopsRef.current > 0 || settlingRef.current) return;
+    const pos = readPos();
+    if (lookedRef.current && pos !== null && pos !== posRef.current) return;
+    lookedRef.current = true;
+    stamp();
+    markRef.current = readMark();
+    posRef.current = readPos();
+    hrefRef.current = window.location.href;
+  });
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    whenSettled(() => {
+      if (openRef.current) {
+        if (readMark() === null) push("open");
+        return;
+      }
+      closeInnerDialogs(shellRef.current);
+      const count = marksOnTop(readMark());
+      if (count > 0) traverse(-count);
+    });
+  }, [open, push, traverse, whenSettled]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const onPopState = () => {
+      const open2 = openRef.current;
+      const onOpenChange2 = onOpenChangeRef.current;
+      const leftMark = markRef.current;
+      const leftPos = posRef.current;
+      const leftHref = hrefRef.current;
+      const mark = readMark();
+      const pos = readPos();
+      markRef.current = mark;
+      posRef.current = pos;
+      hrefRef.current = window.location.href;
+      const forward = pos !== null && leftPos !== null && pos > leftPos;
+      const mode = hostMode;
+      const restoring = leftMark !== null && mode !== null;
+      if (ownPopsRef.current > 0) {
+        ownPopsRef.current -= 1;
+        if (ownPopsRef.current > 0) return;
+        if (restoring) {
+          settlingRef.current = true;
+          restoreScrollMode(mode, flush);
+        } else {
+          flush();
+        }
+        return;
+      }
+      if (restoring) restoreScrollMode(mode);
+      if (leftMark !== null && !forward) {
+        if (open2 && closeInnerDialogs(shellRef.current)) {
+          if (readMark() === null) push("open");
+          if (leftMark === "expanded" && readMark() === "open") {
+            push("expanded");
+          }
+          return;
+        }
+        setSize("compact");
+        if (mark === null && open2) onOpenChange2(false);
+        return;
+      }
+      if (leftHref !== null && window.location.href !== leftHref) {
+        closeInnerDialogs(shellRef.current);
+      }
+      if (mark === null) return;
+      if (forward) {
+        setSize(mark === "expanded" ? "expanded" : "compact");
+        if (!open2) onOpenChange2(true);
+        return;
+      }
+      if (!open2) {
+        traverse(-marksOnTop(mark));
+        return;
+      }
+      setSize(mark === "expanded" ? "expanded" : "compact");
+    };
+    window.addEventListener("popstate", onPopState);
+    return () => window.removeEventListener("popstate", onPopState);
+  }, [flush, push, traverse]);
+  useEffect(() => {
+    if (!open || typeof window === "undefined") return;
+    const viewport = window.visualViewport;
+    const shell = shellRef.current;
+    if (!viewport || !shell) return;
+    const clear = () => {
+      shell.style.removeProperty("--boff-explore-shell-lift");
+      shell.style.removeProperty("--boff-explore-shell-room");
+      shell.style.removeProperty("--boff-explore-shell-top");
+    };
+    const apply = () => {
+      const covered = Math.max(
+        0,
+        Math.round(window.innerHeight - viewport.height - viewport.offsetTop)
+      );
+      const panned = viewport.offsetTop > 1;
+      if (covered <= 1 && !panned) {
+        clear();
+        return;
+      }
+      shell.style.setProperty("--boff-explore-shell-lift", `${covered}px`);
+      shell.style.setProperty(
+        "--boff-explore-shell-room",
+        `calc(${Math.round(viewport.height)}px - max(0px, var(--boff-explore-shell-bottom, 0px) - ${covered}px))`
+      );
+      shell.style.setProperty(
+        "--boff-explore-shell-top",
+        `${Math.max(0, Math.round(viewport.offsetTop))}px`
+      );
+    };
+    apply();
+    viewport.addEventListener("resize", apply);
+    viewport.addEventListener("scroll", apply);
+    return () => {
+      viewport.removeEventListener("resize", apply);
+      viewport.removeEventListener("scroll", apply);
+      clear();
+    };
+  }, [open]);
+  const focusComposerSoon = useCallback((from) => {
+    let tries = 0;
+    const next = (attempt2) => {
+      if (typeof window.requestAnimationFrame === "function") {
+        window.requestAnimationFrame(attempt2);
+      } else {
+        window.setTimeout(attempt2, 16);
+      }
+    };
+    const attempt = () => {
+      if (document.activeElement !== from) return;
+      const composer = chatPaneRef.current?.querySelector(
+        "textarea:not(:disabled)"
+      );
+      if (!composer) return;
+      composer.focus();
+      tries += 1;
+      if (document.activeElement !== composer && tries < COMPOSER_FOCUS_TRIES) {
+        next(attempt);
+      }
+    };
+    next(attempt);
+  }, []);
+  useEffect(() => {
+    if (focusRequest === null) return;
+    setFocusRequest(null);
+    const shell = shellRef.current;
+    if (focusRequest === "back") {
+      const active = document.activeElement;
+      if (active === null || active === document.body || shell?.contains(active)) {
+        returnFocusRef?.current?.focus();
+      }
       return;
     }
-    event.preventDefault();
-    onNavigate(href);
-  };
-  const classes = {
-    // 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"
-  };
-  const hooks = {
-    header: "cta-header",
-    mobile: "cta-mobile",
-    floating: "cta-floating"
+    if (!shell) return;
+    shell.focus();
+    if (view === "chat" && !matches(TOUCH_FIRST_QUERY)) {
+      focusComposerSoon(shell);
+    }
+  }, [focusComposerSoon, focusRequest, returnFocusRef, view]);
+  const close = useCallback(() => onOpenChange(false), [onOpenChange]);
+  const expand = useCallback(() => {
+    setSize("expanded");
+    whenSettled(() => {
+      if (!openRef.current) return;
+      if (readMark() === null) push("open");
+      if (readMark() === "open") push("expanded");
+    });
+  }, [push, whenSettled]);
+  const restore = useCallback(() => {
+    setSize("compact");
+    whenSettled(() => {
+      if (readMark() === "expanded") traverse(-1);
+    });
+  }, [traverse, whenSettled]);
+  const onKeyDown = useCallback(
+    (event) => {
+      if (event.key !== "Escape" || event.defaultPrevented) return;
+      if (event.nativeEvent.isComposing || event.keyCode === 229) return;
+      const shell = shellRef.current;
+      if (!shell || !(event.target instanceof Node) || !shell.contains(event.target)) {
+        return;
+      }
+      if (shell.querySelector('dialog[open], [role="dialog"][aria-modal="true"]')) {
+        return;
+      }
+      event.preventDefault();
+      if (size === "expanded") restore();
+      else close();
+    },
+    [close, restore, size]
+  );
+  const navigate = useCallback(
+    (path) => {
+      if (!onNavigate) return;
+      setSize("compact");
+      const stayOpen = !matches(NARROW_QUERY);
+      if (!stayOpen) onOpenChange(false);
+      whenSettled(() => {
+        const go = () => {
+          onNavigate(path);
+          if (stayOpen && openRef.current && readMark() === null) {
+            push("open");
+          }
+        };
+        const count = marksOnTop(readMark());
+        if (count === 0) {
+          go();
+          return;
+        }
+        afterPopRef.current.push(go);
+        traverse(-count);
+      });
+    },
+    [onNavigate, onOpenChange, push, traverse, whenSettled]
+  );
+  const selectView = useCallback((next) => {
+    setView(next);
+    (next === "chat" ? chatTabRef : avatarTabRef).current?.focus();
+  }, []);
+  const continueInChat = useCallback(() => {
+    setView("chat");
+    const tab = chatTabRef.current;
+    tab?.focus();
+    focusComposerSoon(tab);
+  }, [focusComposerSoon]);
+  const onTabKeyDown = useCallback(
+    (event) => {
+      const other = view === "chat" ? "avatar" : "chat";
+      const next = {
+        ArrowLeft: other,
+        ArrowRight: other,
+        Home: "chat",
+        End: "avatar"
+      };
+      const target = next[event.key];
+      if (!target) return;
+      event.preventDefault();
+      selectView(target);
+    },
+    [selectView, view]
+  );
+  if (!mounted) return null;
+  const style = {
+    "--boff-explore-shell-bottom": bottomOffset ?? "0px",
+    ...zIndex === void 0 ? {} : { "--boff-explore-shell-z": String(zIndex) }
   };
+  const iconButton = "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 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
+  const tabButton = "rounded-md px-3 py-1.5 text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
+  const expanded = size === "expanded";
+  const sizeLabel = expanded ? T.exitFullScreen : T.enterFullScreen;
+  const tabs = [
+    { key: "chat", id: chatTabId, pane: chatPaneId, label: T.tabChat },
+    { key: "avatar", id: avatarTabId, pane: avatarPaneId, label: T.tabAvatar }
+  ];
   return /* @__PURE__ */ jsxs(
-    "a",
+    "div",
     {
-      "data-boff-explore": hooks[variant],
-      href,
-      onClick: handleClick,
-      "aria-label": label,
-      "aria-current": isActive ? "page" : void 0,
+      ref: shellRef,
+      id,
+      role: "dialog",
+      "aria-modal": "false",
+      "aria-labelledby": titleId,
+      tabIndex: -1,
+      "data-boff-explore": "panel-shell",
+      "data-open": open ? "true" : "false",
+      "data-size": size,
+      dir: rtl ? "rtl" : void 0,
       className: cn(
-        classes[variant],
-        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+        "boff-explore-shell border-border bg-background text-foreground shadow-2xl",
         className
       ),
+      style,
+      onKeyDown,
       children: [
-        /* @__PURE__ */ jsx(
-          Sparkles,
-          {
-            className: cn(
-              "shrink-0",
-              variant === "floating" ? "h-4 w-4" : variant === "header" ? "h-5 w-5" : "h-3.5 w-3.5"
-            ),
-            "aria-hidden": "true"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: cn(
-              variant === "floating" && "hidden sm:inline",
-              // Never labelled in the header — see the class comment above.
-              variant === "header" && "hidden"
+        /* @__PURE__ */ jsx("style", { children: PANEL_CSS }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-border px-3 py-2", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              id: titleId,
+              className: "min-w-0 flex-1 truncate text-sm font-semibold",
+              children: T.panelTitle
+            }
+          ),
+          avatar ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              role: "tablist",
+              "aria-label": T.panelViews,
+              className: "inline-flex shrink-0 rounded-lg bg-muted p-0.5",
+              children: tabs.map((tab) => /* @__PURE__ */ jsx(
+                "button",
+                {
+                  ref: tab.key === "chat" ? chatTabRef : avatarTabRef,
+                  type: "button",
+                  role: "tab",
+                  id: tab.id,
+                  "aria-selected": view === tab.key,
+                  "aria-controls": tab.pane,
+                  tabIndex: view === tab.key ? 0 : -1,
+                  "data-boff-explore": `panel-tab-${tab.key}`,
+                  className: cn(
+                    tabButton,
+                    view === tab.key ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
+                  ),
+                  onClick: () => selectView(tab.key),
+                  onKeyDown: onTabKeyDown,
+                  children: tab.label
+                },
+                tab.key
+              ))
+            }
+          ) : null,
+          /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-boff-explore": expanded ? "panel-restore" : "panel-expand",
+                "aria-label": sizeLabel,
+                title: sizeLabel,
+                className: iconButton,
+                onClick: expanded ? restore : expand,
+                children: expanded ? /* @__PURE__ */ jsx(Minimize2, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Maximize2, { className: "h-4 w-4", "aria-hidden": "true" })
+              }
             ),
-            children: label
-          }
-        )
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-boff-explore": "panel-close",
+                "aria-label": T.closePanel,
+                title: T.closePanel,
+                className: iconButton,
+                onClick: close,
+                children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4", "aria-hidden": "true" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative flex min-h-0 flex-1 flex-col", children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: chatPaneRef,
+              id: chatPaneId,
+              role: avatar ? "tabpanel" : void 0,
+              "aria-labelledby": avatar ? chatTabId : void 0,
+              "data-boff-explore": "panel-chat",
+              className: cn(
+                "flex min-h-0 flex-1 flex-col",
+                view === "avatar" && "invisible"
+              ),
+              children: /* @__PURE__ */ jsx(
+                ExplorePage,
+                {
+                  presentation: "panel",
+                  active: open && view === "chat",
+                  productSlug,
+                  locale,
+                  onNavigate: onNavigate ? navigate : void 0,
+                  welcomeTitle,
+                  welcomeBody,
+                  explorePath
+                }
+              )
+            }
+          ),
+          avatar ? /* @__PURE__ */ jsxs(
+            "div",
+            {
+              id: avatarPaneId,
+              role: "tabpanel",
+              "aria-labelledby": avatarTabId,
+              "data-boff-explore": "panel-avatar",
+              className: cn(
+                "absolute inset-0 flex-col items-center justify-center gap-4 overflow-y-auto bg-background p-6 text-center",
+                view === "avatar" ? "flex" : "hidden"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(
+                  "img",
+                  {
+                    src: avatar.src,
+                    alt: avatar.name ? `${avatar.name}, ${T.liveAvatar}` : T.liveAvatar,
+                    loading: "lazy",
+                    decoding: "async",
+                    width: 128,
+                    height: 128,
+                    className: "h-32 w-32 rounded-full border border-border object-cover shadow-sm"
+                  }
+                ),
+                /* @__PURE__ */ jsx("p", { className: "text-base font-semibold", children: T.avatarComingSoon }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "data-boff-explore": "panel-continue-chat",
+                    className: "inline-flex items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground transition-opacity hover:opacity-90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+                    onClick: continueInChat,
+                    children: T.continueInChat
+                  }
+                )
+              ]
+            }
+          ) : null
+        ] })
       ]
     }
   );
@@ -19526,6 +20328,6 @@ function shouldRenderSiteFooter(pathname) {
   return !isFooterlessPath(pathname);
 }
 
-export { ANSWERS_PATH, ANSWER_HEADING_SHIFT, ANSWER_PATH_PREFIX, AnswerDetailPage, AnswersPage, BlogListPage, BlogPostPage, Button, CONCEPTS_PATH, CONCEPT_ILLUSTRATION_NOTICE, CONCEPT_PATH_PREFIX, CONCEPT_WORKFLOW_NOTICE, CareersApplyForm, CareersSubmissionForm, CaseStudiesListPage, CaseStudyPage, ChangelogPage, ConceptDetailPage, ConceptsPage, ContactPage, ContentRenderer, ContractsPage, DEFAULT_CONTACT_CATEGORIES, DEFAULT_EXPLORE_EXAMPLE_PROMPTS, DOMAINS_URL, ECOSYSTEM_PRODUCTS, ESCALATE_EXPLORE_CONVERSATION_MUTATION, EXPLORE_CATALOG_QUERY, EXPLORE_CATALOG_QUERY_WITHOUT_HIGHLIGHTS, EXPLORE_ESCALATION_NOTE_SOFT_MAX, EXPLORE_LOCALES, EXPLORE_MESSAGE_QUERY, EXPLORE_PREFILL_MAX_LENGTH, EXPLORE_RECAPTCHA_ACTION, ElectronDownloadLink, ExploreAnswerBody, ExploreAnswerStyles, ExploreCta, ExplorePage, FALLBACK_EXPLORE_LIMITS, FOOTERLESS_ROUTES, Input, LEGAL_DOCUMENTS, LEGAL_DOCUMENT_KEYS, Label, LaunchCountdown, LegalPage, Markdown, NewsletterForm, NewsletterPage, PRODUCT_SLUG_ALIASES, PRODUCT_SLUG_EMIT, PRODUCT_SLUG_RENAMES, PUBLISHED_ANSWER_FIELDS, PageHead, PartnersPage, PressKitPage, PricingPage, PricingProductKeyError, PricingSection, ProblemsSolvedSection, ProductCard, ProductProvider, ResourceLinks, RybbitAnalytics, SEND_EXPLORE_MESSAGE_MUTATION, Select, SocialLinks, StarRating, StoreBrowsePage, StoreHomePage, StoreProductDetailPage, Textarea, TypeBadge, UnsubscribePage, WaitlistForm, WaitlistPage, WebSDKClient, WebSDKProvider, WebsiteSwitcher, answerPath, answerPlainText, answerSourceHost, answerSpeechText, answerStrings, availablePlanCurrencies, buttonVariants, classifyExploreError, cleanPlanDisplayName, cn, conceptPath, detectElectronPlatform, emitProductSlug, exploreQuestionHref, fetchLegalContent, fetchLegalContentPage, fetchPublicJobPosting, fetchPublicJobPostings, fetchPublicJobPostingsForSubmission, fetchPublicProduct, findLegalDocument, formatAnswerDate, formatDownloads, formatLegalDate, formatPrice2 as formatPrice, getAnswerBySlug, getConceptBySlug, getRecaptchaV3Token, inlineImageOrigins, isFooterlessPath, isInlineImageAllowed, isInlineVideoAllowed, isPublishedSourceUrl, isSameProductSlug, isUuidLike, isValidUrl, legacyProductSlug, loadRecaptchaV3, looksLikeDeliverableEmail, normalizeProductSlug, normalizeRoutePath, planPriceIn, productSlugVariants, productSlugsByOrigin, resolvePricingProductKey, shouldRenderSiteFooter, speechLocaleOf, splitLeadingHeading, stopSpeaking, useContentPage, useContentPages, useExploreChat, useProduct, useProductConfig, useProgressiveReveal, usePublicJobPosting, usePublicJobPostings, usePublicJobPostingsForSubmission, useSpeechOutput, useWebSDK, useWebSDKConfig };
+export { ANSWERS_PATH, ANSWER_HEADING_SHIFT, ANSWER_PATH_PREFIX, AnswerDetailPage, AnswersPage, BlogListPage, BlogPostPage, Button, CONCEPTS_PATH, CONCEPT_ILLUSTRATION_NOTICE, CONCEPT_PATH_PREFIX, CONCEPT_WORKFLOW_NOTICE, CareersApplyForm, CareersSubmissionForm, CaseStudiesListPage, CaseStudyPage, ChangelogPage, ConceptDetailPage, ConceptsPage, ContactPage, ContentRenderer, ContractsPage, DEFAULT_CONTACT_CATEGORIES, DEFAULT_EXPLORE_EXAMPLE_PROMPTS, DOMAINS_URL, ECOSYSTEM_PRODUCTS, ESCALATE_EXPLORE_CONVERSATION_MUTATION, EXPLORE_CATALOG_QUERY, EXPLORE_CATALOG_QUERY_WITHOUT_HIGHLIGHTS, EXPLORE_ESCALATION_NOTE_SOFT_MAX, EXPLORE_LOCALES, EXPLORE_MESSAGE_QUERY, EXPLORE_PREFILL_MAX_LENGTH, EXPLORE_RECAPTCHA_ACTION, ElectronDownloadLink, ExploreAnswerBody, ExploreAnswerStyles, ExploreChatProvider, ExploreCta, ExplorePage, ExplorePanel, FALLBACK_EXPLORE_LIMITS, FOOTERLESS_ROUTES, Input, LEGAL_DOCUMENTS, LEGAL_DOCUMENT_KEYS, Label, LaunchCountdown, LegalPage, Markdown, NewsletterForm, NewsletterPage, PRODUCT_SLUG_ALIASES, PRODUCT_SLUG_EMIT, PRODUCT_SLUG_RENAMES, PUBLISHED_ANSWER_FIELDS, PageHead, PartnersPage, PressKitPage, PricingPage, PricingProductKeyError, PricingSection, ProblemsSolvedSection, ProductCard, ProductProvider, ResourceLinks, RybbitAnalytics, SEND_EXPLORE_MESSAGE_MUTATION, Select, SocialLinks, StarRating, StoreBrowsePage, StoreHomePage, StoreProductDetailPage, Textarea, TypeBadge, UnsubscribePage, WaitlistForm, WaitlistPage, WebSDKClient, WebSDKProvider, WebsiteSwitcher, answerPath, answerPlainText, answerSourceHost, answerSpeechText, answerStrings, availablePlanCurrencies, buttonVariants, classifyExploreError, cleanPlanDisplayName, cn, conceptPath, detectElectronPlatform, emitProductSlug, exploreQuestionHref, fetchLegalContent, fetchLegalContentPage, fetchPublicJobPosting, fetchPublicJobPostings, fetchPublicJobPostingsForSubmission, fetchPublicProduct, findLegalDocument, formatAnswerDate, formatDownloads, formatLegalDate, formatPrice2 as formatPrice, getAnswerBySlug, getConceptBySlug, getRecaptchaV3Token, inlineImageOrigins, isFooterlessPath, isInlineImageAllowed, isInlineVideoAllowed, isPublishedSourceUrl, isSameProductSlug, isUuidLike, isValidUrl, legacyProductSlug, loadRecaptchaV3, looksLikeDeliverableEmail, normalizeProductSlug, normalizeRoutePath, planPriceIn, productSlugVariants, productSlugsByOrigin, resolvePricingProductKey, shouldRenderSiteFooter, speechLocaleOf, splitLeadingHeading, stopSpeaking, useContentPage, useContentPages, useExploreChat, useExploreConversation, useProduct, useProductConfig, useProgressiveReveal, usePublicJobPosting, usePublicJobPostings, usePublicJobPostingsForSubmission, useSpeechOutput, useWebSDK, useWebSDKConfig };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map