@burdenoff/website-sdk 2026.921.1 → 2026.922.1

package/dist/components/explore.js

@@ -2518,6 +2518,7 @@ function toPayload(staged) {
     textContent
   }));
 }
+var SHORT_VIEWPORT_PX = 420;
 var EXPLORE_CSS = `
 @keyframes boff-explore-pulse {
   0%, 80%, 100% { opacity: 0.25; transform: translateY(0); }
@@ -2552,6 +2553,12 @@ var EXPLORE_CSS = `
 .boff-explore-scroll {
   scrollbar-width: thin;
   scrollbar-color: hsl(var(--border)) transparent;
+  /* Stop the transcript handing its scroll to the page. Without this, the first
+     swipe that exhausts the transcript chains to the document \u2014 and on a host site
+     that is 65-70% footer, which is how a phone ends up showing nothing but the
+     footer. Engines that do not support this property ignore the line and keep
+     today's behaviour; the scroll correction above covers them. */
+  overscroll-behavior: contain;
 }
 .boff-explore-scroll::-webkit-scrollbar { width: 10px; }
 .boff-explore-scroll::-webkit-scrollbar-track { background: transparent; }
@@ -2669,6 +2676,68 @@ var EXPLORE_CSS = `
   .boff-explore-busy::after { animation: none; }
   .boff-explore-rise { animation: none; opacity: 1; transform: none; }
 }
+
+/* ---- Pane height ----------------------------------------------------------------------
+   This used to be one inline declaration, \`height: calc(100dvh - 64px)\`, and it carried two
+   defects. An inline style cannot carry a fallback, so every engine without \`dvh\` (iOS
+   Safari < 15.4, Chrome/WebView < 108, Samsung Internet < 21, Firefox < 101) dropped it
+   whole; and the 64px came from a prop hard-coded to 64 on all 41 host pages that matches
+   none of them \u2014 the burdenoff/algoshred chrome is 80px, the sticky-header sites are 65.
+
+   A class plus custom properties lets the cascade do the work: \`vh\` is the floor and \`dvh\`
+   an upgrade where it exists, while the two measured values stay *lengths*, never a height.
+   That distinction is the whole prerender contract. The host sites snapshot \`/explore\` by
+   loading the built SPA in headless Chromium and writing the POST-HYDRATION DOM to
+   dist/explore/index.html, so every attribute and inline value this component sets after
+   mount IS the static HTML CloudFront serves. A measured pixel *height* would therefore
+   hand every phone the prerender viewport's height until the bundle executes; a measured
+   *offset* is a site-header height, which is the same on every device to within a few
+   pixels, and the height built from it stays viewport-relative on the visitor's own screen.
+
+   --boff-explore-offset  chrome above the pane (measured root top; the prop pre-measure)
+   --boff-explore-inset   the slice of the layout viewport hidden below the visible area \u2014
+                          the on-screen keyboard, which \`dvh\` does not track. Zero unless
+                          something is actually covering the bottom, so a snapshot taken
+                          with no keyboard open never carries it. */
+.boff-explore-viewport {
+  height: calc(100vh - var(--boff-explore-offset, 0px) - var(--boff-explore-inset, 0px));
+}
+@supports (height: 100dvh) {
+  .boff-explore-viewport {
+    height: calc(100dvh - var(--boff-explore-offset, 0px) - var(--boff-explore-inset, 0px));
+  }
+}
+
+/* Landscape phones and other short viewports: a one-screen pane leaves a ~124px transcript
+   sliver under ~610px of chrome and content. At or below the threshold the pane stops
+   pretending to be a window and lets the page's own scrolling carry the transcript. The
+   min-height is the available height rather than a fixed rem value, so the fallback can
+   never be taller than the screen it is rescuing. */
+@media (max-height: ${SHORT_VIEWPORT_PX}px) {
+  .boff-explore-viewport {
+    height: auto;
+    min-height: calc(100vh - var(--boff-explore-offset, 0px));
+  }
+}
+@supports (height: 100dvh) {
+  @media (max-height: ${SHORT_VIEWPORT_PX}px) {
+    .boff-explore-viewport {
+      min-height: calc(100dvh - var(--boff-explore-offset, 0px));
+    }
+  }
+}
+
+/* ---- Composer dock --------------------------------------------------------------------
+   Three declarations, each the fallback for the one after it: a plain 1rem where \`max()\`
+   is unknown, then the measured overlap of any FOREIGN fixed chrome sitting over the
+   composer (the host sites' cookie banner is 229px tall and lands exactly there), then the
+   same plus the home-indicator inset. \`--boff-explore-chrome\` is set on the root only once
+   an overlap has actually been measured, so everywhere else this collapses to 1rem. */
+.boff-explore-composer {
+  padding-bottom: 1rem;
+  padding-bottom: max(1rem, var(--boff-explore-chrome, 0px));
+  padding-bottom: max(1rem, env(safe-area-inset-bottom), var(--boff-explore-chrome, 0px));
+}
 `;
 function ExploreStyles() {
   return /* @__PURE__ */ jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: EXPLORE_CSS } });
@@ -2690,6 +2759,8 @@ var CAPABILITIES = [
     body: "Get the sources and next steps \u2014 pricing, docs, a demo \u2014 without hunting."
   }
 ];
+var MIN_VISIBLE_FRACTION = 0.25;
+var SDK_OVERLAY_SELECTOR = "[data-boff-explore]";
 var CTA_VARIANTS = {
   CONTACT: "default",
   WAITLIST: "default",
@@ -2705,6 +2776,28 @@ function normalizeOffset(offset) {
   if (offset === void 0) return "0px";
   return typeof offset === "number" ? `${offset}px` : offset;
 }
+function isOwnElement(el, root) {
+  if (el === document.body || el === document.documentElement) return true;
+  if (root.contains(el)) return true;
+  return el.closest(SDK_OVERLAY_SELECTOR) !== null;
+}
+function visualViewportHeight() {
+  return window.visualViewport?.height ?? window.innerHeight;
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function isRestoredNavigation() {
+  const entries = window.performance?.getEntriesByType?.("navigation");
+  const entry = entries?.[0];
+  if (!entry) return true;
+  const navigation = entry;
+  return navigation.type === "reload" || navigation.type === "back_forward";
+}
+function pageOwnsScrolling(el) {
+  if (window.innerHeight > SHORT_VIEWPORT_PX) return false;
+  return el.scrollHeight - el.clientHeight <= 1;
+}
 function isInternalPath(url) {
   return url.startsWith("/") && !url.startsWith("//");
 }
@@ -3553,6 +3646,8 @@ function ExplorePage({
   const pickQueueRef = React.useRef(Promise.resolve());
   const [shareLabel, setShareLabel] = React.useState(T.share);
   const [shareUrl, setShareUrl] = React.useState(null);
+  const rootRef = React.useRef(null);
+  const composerRef = React.useRef(null);
   const scrollRef = React.useRef(null);
   const latestAssistantRef = React.useRef(null);
   const alignedForRef = React.useRef(null);
@@ -3580,11 +3675,196 @@ function ExplorePage({
     el.style.height = "auto";
     el.style.height = `${Math.min(el.scrollHeight, 200)}px`;
   }, [draft]);
+  const [paneOffset, setPaneOffset] = React.useState(null);
+  const [bottomInset, setBottomInset] = React.useState(0);
+  const paneOffsetRef = React.useRef(0);
+  const measurePane = React.useCallback(() => {
+    if (heightMode !== "viewport") return;
+    const el = rootRef.current;
+    if (!el) return;
+    const layoutHeight = window.innerHeight;
+    if (layoutHeight === 0) return;
+    const top = Math.round(
+      clamp(el.getBoundingClientRect().top, 0, layoutHeight)
+    );
+    const viewport = window.visualViewport;
+    const inset = viewport ? Math.round(
+      clamp(
+        layoutHeight - viewport.height - viewport.offsetTop,
+        0,
+        layoutHeight
+      )
+    ) : 0;
+    paneOffsetRef.current = top;
+    setPaneOffset((current) => current === top ? current : top);
+    setBottomInset((current) => current === inset ? current : inset);
+  }, [heightMode]);
+  const [chromeOverlap, setChromeOverlap] = React.useState(0);
+  const measureChrome = React.useCallback(() => {
+    const root = rootRef.current;
+    const dock = composerRef.current;
+    if (!root || !dock) return;
+    if (typeof document.elementFromPoint !== "function") return;
+    const viewportHeight = visualViewportHeight();
+    const rect = dock.getBoundingClientRect();
+    if (rect.width === 0 || viewportHeight === 0) return;
+    if (rect.bottom <= 0 || rect.top >= viewportHeight) return;
+    const edge = Math.min(rect.bottom, viewportHeight);
+    const hit = document.elementFromPoint(rect.left + rect.width / 2, edge - 1);
+    if (!hit || isOwnElement(hit, root)) {
+      setChromeOverlap(0);
+      return;
+    }
+    const overlap = Math.round(edge - hit.getBoundingClientRect().top);
+    setChromeOverlap(overlap > 0 && overlap < viewportHeight ? overlap : 0);
+  }, []);
+  const remeasure = React.useCallback(() => {
+    measurePane();
+    measureChrome();
+  }, [measurePane, measureChrome]);
+  React.useEffect(() => {
+    if (typeof window === "undefined") return;
+    let frame = 0;
+    const run = () => {
+      frame = 0;
+      remeasure();
+    };
+    const schedule = () => {
+      if (frame) return;
+      if (typeof window.requestAnimationFrame !== "function") {
+        remeasure();
+        return;
+      }
+      frame = window.requestAnimationFrame(run);
+    };
+    remeasure();
+    const viewport = window.visualViewport;
+    window.addEventListener("resize", schedule);
+    window.addEventListener("orientationchange", schedule);
+    viewport?.addEventListener("resize", schedule);
+    viewport?.addEventListener("scroll", schedule);
+    const observer = typeof MutationObserver === "function" ? new MutationObserver((records) => {
+      const el = rootRef.current;
+      if (el && records.every((record) => el.contains(record.target)))
+        return;
+      schedule();
+    }) : null;
+    observer?.observe(document.body, { childList: true, subtree: true });
+    return () => {
+      if (frame) window.cancelAnimationFrame(frame);
+      window.removeEventListener("resize", schedule);
+      window.removeEventListener("orientationchange", schedule);
+      viewport?.removeEventListener("resize", schedule);
+      viewport?.removeEventListener("scroll", schedule);
+      observer?.disconnect();
+      setPaneOffset(null);
+      setBottomInset(0);
+      setChromeOverlap(0);
+    };
+  }, [remeasure]);
+  React.useEffect(() => {
+    measureChrome();
+  }, [measureChrome, paneOffset, bottomInset]);
+  React.useEffect(() => {
+    if (heightMode !== "viewport" || typeof window === "undefined") return;
+    const { history: browserHistory } = window;
+    const previousRestoration = "scrollRestoration" in browserHistory ? browserHistory.scrollRestoration : null;
+    if (previousRestoration !== null)
+      browserHistory.scrollRestoration = "manual";
+    let frame = 0;
+    let visitorMoved = false;
+    const onVisitorMove = () => {
+      visitorMoved = true;
+    };
+    const align = () => {
+      if (visitorMoved) return;
+      const el = rootRef.current;
+      if (!el) return;
+      const viewportHeight = visualViewportHeight();
+      const rect = el.getBoundingClientRect();
+      if (rect.height === 0 || viewportHeight === 0) return;
+      const visible = Math.min(rect.bottom, viewportHeight) - Math.max(rect.top, 0);
+      const reachable = Math.min(rect.height, viewportHeight);
+      if (visible >= reachable * MIN_VISIBLE_FRACTION) return;
+      window.scrollTo({
+        top: Math.max(0, window.scrollY + rect.top),
+        left: window.scrollX,
+        behavior: "auto"
+      });
+      if (typeof document.elementFromPoint === "function") {
+        const probe = document.elementFromPoint(
+          Math.max(0, rect.left + rect.width / 2),
+          1
+        );
+        if (probe && !isOwnElement(probe, el)) {
+          const chrome = probe.getBoundingClientRect().bottom;
+          if (chrome > 0 && chrome < viewportHeight / 2) {
+            window.scrollBy({ top: -chrome, left: 0, behavior: "auto" });
+          }
+        }
+      }
+      remeasure();
+    };
+    const alignIfRestored = () => {
+      if (!isRestoredNavigation()) return;
+      align();
+    };
+    alignIfRestored();
+    if (typeof window.requestAnimationFrame === "function") {
+      frame = window.requestAnimationFrame(alignIfRestored);
+    }
+    const onPageShow = (event) => {
+      if (!event.persisted) {
+        alignIfRestored();
+        return;
+      }
+      visitorMoved = false;
+      align();
+    };
+    window.addEventListener("pageshow", onPageShow);
+    window.addEventListener("wheel", onVisitorMove, { passive: true });
+    window.addEventListener("touchmove", onVisitorMove, { passive: true });
+    window.addEventListener("keydown", onVisitorMove, { passive: true });
+    return () => {
+      if (frame) window.cancelAnimationFrame(frame);
+      window.removeEventListener("pageshow", onPageShow);
+      window.removeEventListener("wheel", onVisitorMove);
+      window.removeEventListener("touchmove", onVisitorMove);
+      window.removeEventListener("keydown", onVisitorMove);
+      if (previousRestoration !== null)
+        browserHistory.scrollRestoration = previousRestoration;
+    };
+  }, [heightMode, remeasure]);
   const handleScroll = React.useCallback(() => {
     const el = scrollRef.current;
     if (!el) return;
     stickToBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
   }, []);
+  React.useEffect(() => {
+    if (typeof window === "undefined") return;
+    let frame = 0;
+    const run = () => {
+      frame = 0;
+      const el = scrollRef.current;
+      const dock = composerRef.current;
+      if (!el || !dock) return;
+      if (!pageOwnsScrolling(el)) return;
+      stickToBottomRef.current = dock.getBoundingClientRect().bottom - visualViewportHeight() < 80;
+    };
+    const schedule = () => {
+      if (frame) return;
+      if (typeof window.requestAnimationFrame !== "function") {
+        run();
+        return;
+      }
+      frame = window.requestAnimationFrame(run);
+    };
+    window.addEventListener("scroll", schedule, { passive: true });
+    return () => {
+      if (frame) window.cancelAnimationFrame(frame);
+      window.removeEventListener("scroll", schedule);
+    };
+  }, []);
   const latestAssistantId = React.useMemo(() => {
     for (let i = messages.length - 1; i >= 0; i -= 1) {
       const message = messages[i];
@@ -3600,16 +3880,32 @@ function ExplorePage({
     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);
+    if (!pageOwnsScrolling(el)) {
+      const delta2 = anchor.getBoundingClientRect().top - el.getBoundingClientRect().top;
+      el.scrollTop = Math.max(0, el.scrollTop + delta2 - 12);
+      return;
+    }
+    const delta = Math.round(
+      anchor.getBoundingClientRect().top - paneOffsetRef.current - 12
+    );
+    if (delta !== 0) window.scrollBy({ top: delta, left: 0, behavior: "auto" });
   }, [latestAssistantId, messages]);
   React.useEffect(() => {
+    if (messages.length === 0) return;
     if (!stickToBottomRef.current) return;
     if (latestAssistantId && alignedForRef.current === latestAssistantId)
       return;
     const el = scrollRef.current;
     if (!el) return;
-    el.scrollTop = el.scrollHeight;
+    if (!pageOwnsScrolling(el)) {
+      el.scrollTop = el.scrollHeight;
+      return;
+    }
+    const dock = composerRef.current ?? el;
+    const delta = Math.round(
+      dock.getBoundingClientRect().bottom - visualViewportHeight()
+    );
+    if (delta > 0) window.scrollBy({ top: delta, left: 0, behavior: "auto" });
   }, [activity, latestAssistantId, messages]);
   const handleShare = React.useCallback(async () => {
     setShareLabel(T.copying);
@@ -3707,16 +4003,27 @@ function ExplorePage({
   const captchaOn = Boolean(
     catalog.captchaRequired && catalog.recaptchaSiteKey
   );
-  const rootStyle = heightMode === "viewport" ? { height: `calc(100dvh - ${normalizeOffset(viewportOffset)})` } : void 0;
+  const rootStyle = {};
+  if (heightMode === "viewport") {
+    rootStyle["--boff-explore-offset"] = paneOffset === null ? normalizeOffset(viewportOffset) : `${paneOffset}px`;
+    if (bottomInset > 0) {
+      rootStyle["--boff-explore-inset"] = `${bottomInset}px`;
+    }
+  }
+  if (chromeOverlap > 0) {
+    rootStyle["--boff-explore-chrome"] = `${chromeOverlap}px`;
+  }
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      ref: rootRef,
       "data-boff-explore": "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]",
         className
       ),
@@ -3950,249 +4257,257 @@ function ExplorePage({
             ]
           }
         ) : null,
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-border bg-background/85 px-4 pb-[max(1rem,env(safe-area-inset-bottom))] pt-3 backdrop-blur-md", children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "form",
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
           {
-            "data-boff-explore": "composer",
-            className: "mx-auto w-full max-w-3xl",
-            onSubmit: (event) => {
-              event.preventDefault();
-              submitDraft();
-            },
-            children: [
-              error ? /* @__PURE__ */ jsxRuntime.jsx(ErrorBanner, { error, onRetry: retry, onReset: reset }) : null,
-              staged.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
-                "ul",
-                {
-                  "data-boff-explore": "attachments",
-                  className: "mb-2 flex flex-wrap gap-1.5",
-                  "aria-label": T.attach,
-                  children: staged.map((entry) => /* @__PURE__ */ jsxRuntime.jsxs(
-                    "li",
+            ref: composerRef,
+            "data-boff-explore": "composer-dock",
+            className: "boff-explore-composer border-t border-border bg-background/85 px-4 pt-3 backdrop-blur-md",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "form",
+              {
+                "data-boff-explore": "composer",
+                className: "mx-auto w-full max-w-3xl",
+                onSubmit: (event) => {
+                  event.preventDefault();
+                  submitDraft();
+                },
+                children: [
+                  error ? /* @__PURE__ */ jsxRuntime.jsx(ErrorBanner, { error, onRetry: retry, onReset: reset }) : null,
+                  staged.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+                    "ul",
+                    {
+                      "data-boff-explore": "attachments",
+                      className: "mb-2 flex flex-wrap gap-1.5",
+                      "aria-label": T.attach,
+                      children: staged.map((entry) => /* @__PURE__ */ jsxRuntime.jsxs(
+                        "li",
+                        {
+                          "data-boff-explore": "attachment",
+                          "data-text-extracted": entry.textExtracted ? "true" : "false",
+                          className: "flex max-w-full items-center gap-1.5 rounded-full border border-border bg-muted/60 py-1 pl-2.5 pr-1 text-xs",
+                          children: [
+                            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { className: "h-3 w-3 shrink-0 text-muted-foreground" }),
+                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-medium", title: entry.name, children: entry.name }),
+                            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-muted-foreground", children: [
+                              formatBytes(entry.size),
+                              entry.textExtracted ? "" : ` \xB7 ${T.attachmentNameOnly}`
+                            ] }),
+                            /* @__PURE__ */ jsxRuntime.jsx(
+                              "button",
+                              {
+                                type: "button",
+                                "data-boff-explore": "attachment-remove",
+                                onClick: () => removeAttachment(entry.id),
+                                "aria-label": fill(T.removeAttachment, { name: entry.name }),
+                                className: "ml-0.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-background hover:text-foreground",
+                                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
+                              }
+                            )
+                          ]
+                        },
+                        entry.id
+                      ))
+                    }
+                  ) : null,
+                  attachmentNotice !== null ? /* @__PURE__ */ jsxRuntime.jsx(
+                    "p",
                     {
-                      "data-boff-explore": "attachment",
-                      "data-text-extracted": entry.textExtracted ? "true" : "false",
-                      className: "flex max-w-full items-center gap-1.5 rounded-full border border-border bg-muted/60 py-1 pl-2.5 pr-1 text-xs",
+                      "data-boff-explore": "attachment-notice",
+                      role: "status",
+                      className: "mb-2 text-xs text-destructive",
+                      children: attachmentNotice
+                    }
+                  ) : null,
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      className: cn(
+                        "flex min-w-0 items-end gap-2 rounded-2xl border bg-card p-2 shadow-sm transition-all",
+                        busy && "boff-explore-busy",
+                        overLimit ? "border-destructive/60" : "border-border focus-within:border-primary/40 focus-within:ring-1 focus-within:ring-ring"
+                      ),
                       children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { className: "h-3 w-3 shrink-0 text-muted-foreground" }),
-                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-medium", title: entry.name, children: entry.name }),
-                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-muted-foreground", children: [
-                          formatBytes(entry.size),
-                          entry.textExtracted ? "" : ` \xB7 ${T.attachmentNameOnly}`
-                        ] }),
                         /* @__PURE__ */ jsxRuntime.jsx(
-                          "button",
+                          Textarea,
+                          {
+                            ref: textareaRef,
+                            value: draft,
+                            rows: 1,
+                            disabled: composerDisabled,
+                            onChange: (event) => setDraft(event.target.value),
+                            onKeyDown: handleKeyDown,
+                            onCompositionStart: () => {
+                              composingRef.current = true;
+                            },
+                            onCompositionEnd: () => {
+                              composingRef.current = false;
+                            },
+                            "aria-label": "Ask a question",
+                            placeholder: composerDisabled ? phase === "limited" ? "Message limit reached \u2014 please try again later" : "Explore is unavailable right now" : focusedProductName ? fill(T.placeholderProduct, {
+                              product: focusedProductName
+                            }) : T.placeholder,
+                            className: "max-h-[200px] min-h-[44px] w-full min-w-0 flex-1 resize-none border-0 bg-transparent px-2 py-2.5 text-base shadow-none focus-visible:ring-0 sm:text-sm"
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "input",
+                          {
+                            ref: fileInputRef,
+                            type: "file",
+                            multiple: true,
+                            className: "hidden",
+                            onChange: (event) => {
+                              void handleFilesPicked(event.target.files);
+                              event.target.value = "";
+                            }
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          Button,
+                          {
+                            "data-boff-explore": "attach",
+                            type: "button",
+                            size: "icon",
+                            variant: "ghost",
+                            disabled: composerDisabled || staged.length >= MAX_ATTACHMENTS,
+                            "aria-label": T.attach,
+                            title: `${T.attach} \u2014 ${fill(T.attachHint, {
+                              max: String(MAX_ATTACHMENTS),
+                              size: String(MAX_ATTACHMENT_BYTES / (1024 * 1024))
+                            })}`,
+                            onClick: () => fileInputRef.current?.click(),
+                            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { className: "h-4 w-4" })
+                          }
+                        ),
+                        speech.supported ? /* @__PURE__ */ jsxRuntime.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 ? T.stopDictating : T.dictate,
+                            "aria-pressed": speech.listening,
+                            title: speech.listening ? T.stopDictating : T.dictate,
+                            onClick: speech.toggle,
+                            className: cn(speech.listening && "animate-pulse"),
+                            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mic, { className: "h-4 w-4" })
+                          }
+                        ) : null,
+                        busy ? /* @__PURE__ */ jsxRuntime.jsx(
+                          Button,
                           {
+                            "data-boff-explore": "stop",
                             type: "button",
-                            "data-boff-explore": "attachment-remove",
-                            onClick: () => removeAttachment(entry.id),
-                            "aria-label": fill(T.removeAttachment, { name: entry.name }),
-                            className: "ml-0.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-background hover:text-foreground",
-                            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
+                            size: "icon",
+                            variant: "secondary",
+                            "aria-label": T.stop,
+                            onClick: stop,
+                            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "h-4 w-4" })
+                          }
+                        ) : /* @__PURE__ */ jsxRuntime.jsx(
+                          Button,
+                          {
+                            "data-boff-explore": "send",
+                            type: "submit",
+                            size: "icon",
+                            disabled: !canSubmit,
+                            "aria-label": T.send,
+                            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-4 w-4" })
                           }
                         )
                       ]
-                    },
-                    entry.id
-                  ))
-                }
-              ) : null,
-              attachmentNotice !== null ? /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  "data-boff-explore": "attachment-notice",
-                  role: "status",
-                  className: "mb-2 text-xs text-destructive",
-                  children: attachmentNotice
-                }
-              ) : null,
-              /* @__PURE__ */ jsxRuntime.jsxs(
-                "div",
-                {
-                  className: cn(
-                    "flex min-w-0 items-end gap-2 rounded-2xl border bg-card p-2 shadow-sm transition-all",
-                    busy && "boff-explore-busy",
-                    overLimit ? "border-destructive/60" : "border-border focus-within:border-primary/40 focus-within:ring-1 focus-within:ring-ring"
+                    }
                   ),
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      Textarea,
+                  speech.listening || speech.interim !== "" ? /* @__PURE__ */ jsxRuntime.jsxs(
+                    "p",
+                    {
+                      "data-boff-explore": "dictation",
+                      className: "mt-2 flex items-center gap-2 text-xs text-muted-foreground",
+                      "aria-live": "polite",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex h-2 w-2 shrink-0", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75" }),
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-primary" })
+                        ] }),
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "italic", children: speech.interim !== "" ? speech.interim : "Listening\u2026" })
+                      ]
+                    }
+                  ) : null,
+                  speech.error !== null ? /* @__PURE__ */ jsxRuntime.jsx(
+                    "p",
+                    {
+                      "data-boff-explore": "dictation-error",
+                      className: "mt-2 text-xs text-destructive",
+                      children: speech.error
+                    }
+                  ) : null,
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Enter to send \xB7 Shift + Enter for a new line" }),
+                    remainingToday !== null ? /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-boff-explore": "remaining", children: [
+                      remainingToday,
+                      " message",
+                      remainingToday === 1 ? "" : "s",
+                      " left today"
+                    ] }) : null,
+                    /* @__PURE__ */ jsxRuntime.jsxs(
+                      "span",
                       {
-                        ref: textareaRef,
-                        value: draft,
-                        rows: 1,
-                        disabled: composerDisabled,
-                        onChange: (event) => setDraft(event.target.value),
-                        onKeyDown: handleKeyDown,
-                        onCompositionStart: () => {
-                          composingRef.current = true;
-                        },
-                        onCompositionEnd: () => {
-                          composingRef.current = false;
-                        },
-                        "aria-label": "Ask a question",
-                        placeholder: composerDisabled ? phase === "limited" ? "Message limit reached \u2014 please try again later" : "Explore is unavailable right now" : focusedProductName ? fill(T.placeholderProduct, {
-                          product: focusedProductName
-                        }) : T.placeholder,
-                        className: "max-h-[200px] min-h-[44px] w-full min-w-0 flex-1 resize-none border-0 bg-transparent px-2 py-2.5 text-base shadow-none focus-visible:ring-0 sm:text-sm"
+                        className: cn(
+                          "ml-auto tabular-nums",
+                          overLimit && "font-medium text-destructive"
+                        ),
+                        children: [
+                          draft.length.toLocaleString(),
+                          " / ",
+                          maxLength.toLocaleString()
+                        ]
                       }
-                    ),
+                    )
+                  ] }),
+                  shareUrl ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex items-center gap-2", children: [
                     /* @__PURE__ */ jsxRuntime.jsx(
                       "input",
                       {
-                        ref: fileInputRef,
-                        type: "file",
-                        multiple: true,
-                        className: "hidden",
-                        onChange: (event) => {
-                          void handleFilesPicked(event.target.files);
-                          event.target.value = "";
-                        }
+                        "data-boff-explore": "share-url",
+                        readOnly: true,
+                        value: shareUrl,
+                        "aria-label": "Read-only link to this conversation",
+                        onFocus: (event) => event.currentTarget.select(),
+                        className: "min-w-0 flex-1 rounded-md border border-border bg-muted px-2 py-1 text-xs text-muted-foreground"
                       }
                     ),
                     /* @__PURE__ */ jsxRuntime.jsx(
-                      Button,
-                      {
-                        "data-boff-explore": "attach",
-                        type: "button",
-                        size: "icon",
-                        variant: "ghost",
-                        disabled: composerDisabled || staged.length >= MAX_ATTACHMENTS,
-                        "aria-label": T.attach,
-                        title: `${T.attach} \u2014 ${fill(T.attachHint, {
-                          max: String(MAX_ATTACHMENTS),
-                          size: String(MAX_ATTACHMENT_BYTES / (1024 * 1024))
-                        })}`,
-                        onClick: () => fileInputRef.current?.click(),
-                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { className: "h-4 w-4" })
-                      }
-                    ),
-                    speech.supported ? /* @__PURE__ */ jsxRuntime.jsx(
-                      Button,
+                      "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 ? T.stopDictating : T.dictate,
-                        "aria-pressed": speech.listening,
-                        title: speech.listening ? T.stopDictating : T.dictate,
-                        onClick: speech.toggle,
-                        className: cn(speech.listening && "animate-pulse"),
-                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mic, { className: "h-4 w-4" })
+                        className: "shrink-0 text-xs underline underline-offset-2",
+                        onClick: () => setShareUrl(null),
+                        children: "Done"
                       }
-                    ) : null,
-                    busy ? /* @__PURE__ */ jsxRuntime.jsx(
-                      Button,
+                    )
+                  ] }) : null,
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: T.disclaimerShort }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "button",
                       {
-                        "data-boff-explore": "stop",
                         type: "button",
-                        size: "icon",
-                        variant: "secondary",
-                        "aria-label": T.stop,
-                        onClick: stop,
-                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "h-4 w-4" })
-                      }
-                    ) : /* @__PURE__ */ jsxRuntime.jsx(
-                      Button,
-                      {
-                        "data-boff-explore": "send",
-                        type: "submit",
-                        size: "icon",
-                        disabled: !canSubmit,
-                        "aria-label": T.send,
-                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-4 w-4" })
+                        "data-boff-explore": "disclaimer",
+                        onClick: () => setDisclaimerOpen(true),
+                        className: "shrink-0 underline underline-offset-2 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+                        children: T.disclaimer
                       }
                     )
-                  ]
-                }
-              ),
-              speech.listening || speech.interim !== "" ? /* @__PURE__ */ jsxRuntime.jsxs(
-                "p",
-                {
-                  "data-boff-explore": "dictation",
-                  className: "mt-2 flex items-center gap-2 text-xs text-muted-foreground",
-                  "aria-live": "polite",
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex h-2 w-2 shrink-0", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-primary" })
-                    ] }),
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "italic", children: speech.interim !== "" ? speech.interim : "Listening\u2026" })
-                  ]
-                }
-              ) : null,
-              speech.error !== null ? /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  "data-boff-explore": "dictation-error",
-                  className: "mt-2 text-xs text-destructive",
-                  children: speech.error
-                }
-              ) : null,
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Enter to send \xB7 Shift + Enter for a new line" }),
-                remainingToday !== null ? /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-boff-explore": "remaining", children: [
-                  remainingToday,
-                  " message",
-                  remainingToday === 1 ? "" : "s",
-                  " left today"
-                ] }) : null,
-                /* @__PURE__ */ jsxRuntime.jsxs(
-                  "span",
-                  {
-                    className: cn(
-                      "ml-auto tabular-nums",
-                      overLimit && "font-medium text-destructive"
-                    ),
-                    children: [
-                      draft.length.toLocaleString(),
-                      " / ",
-                      maxLength.toLocaleString()
-                    ]
-                  }
-                )
-              ] }),
-              shareUrl ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex items-center gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "input",
-                  {
-                    "data-boff-explore": "share-url",
-                    readOnly: true,
-                    value: shareUrl,
-                    "aria-label": "Read-only link to this conversation",
-                    onFocus: (event) => event.currentTarget.select(),
-                    className: "min-w-0 flex-1 rounded-md border border-border bg-muted px-2 py-1 text-xs text-muted-foreground"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    className: "shrink-0 text-xs underline underline-offset-2",
-                    onClick: () => setShareUrl(null),
-                    children: "Done"
-                  }
-                )
-              ] }) : null,
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: T.disclaimerShort }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    "data-boff-explore": "disclaimer",
-                    onClick: () => setDisclaimerOpen(true),
-                    className: "shrink-0 underline underline-offset-2 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
-                    children: T.disclaimer
-                  }
-                )
-              ] })
-            ]
+                  ] })
+                ]
+              }
+            )
           }
-        ) })
+        )
       ]
     }
   );