@coral-ai/chat 0.4.2 → 0.6.0

package/dist/index.js

@@ -1,7 +1,6 @@
 // src/Chat.tsx
-import { useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as useState7 } from "react";
 import {
-  Caption1 as Caption14,
+  Caption1 as Caption13,
   Title3,
   makeStyles as makeStyles10,
   motionTokens
@@ -183,7 +182,7 @@ var useStyles2 = makeStyles2({
     zIndex: 1e3,
     cursor: "pointer",
     boxShadow: tokens2.shadow8,
-    marginBottom: "48px",
+    marginBottom: "12px",
     backgroundColor: "var(--colorNeutralBackgroundAlpha2)",
     backdropFilter: "blur(40px) saturate(150%)"
   }
@@ -424,32 +423,54 @@ var ChatCanvas = ({
             const response = await resolvedHandler(textToSend, historyForAI, snapshotAttachments.map((a) => a.file));
             if (isAsyncIterable(response)) {
               let assistantContent = "";
+              const blocks = [];
+              let openText = "";
+              let todosIndex = null;
               let rafId = null;
-              let pendingContent = "";
               let streamedApproval;
-              let streamedTodos;
-              let streamedCharts;
+              const snapshotBlocks = () => openText ? [...blocks, { type: "text", content: openText }] : blocks;
+              const flushOpenText = () => {
+                if (openText) {
+                  blocks.push({ type: "text", content: openText });
+                  openText = "";
+                }
+              };
+              const commit = () => {
+                const nextBlocks = snapshotBlocks();
+                let nextMsg = {
+                  id: assistantId,
+                  role: "assistant",
+                  content: assistantContent,
+                  blocks: nextBlocks
+                };
+                setMessages((prev) => {
+                  const updated = [...prev];
+                  const last = updated[updated.length - 1];
+                  if (last && last.id === assistantId) {
+                    nextMsg = {
+                      ...last,
+                      content: assistantContent,
+                      blocks: nextBlocks
+                    };
+                  }
+                  updated[updated.length - 1] = nextMsg;
+                  return updated;
+                });
+                onMessagesChange?.(
+                  [...updatedMessages, nextMsg],
+                  sessionAtSend
+                );
+              };
               for await (const chunk of response) {
                 if (shouldStopRef.current) break;
                 if (sessionAtSend !== void 0 && currentConversationIdRef.current !== sessionAtSend) break;
                 if (typeof chunk === "string") {
                   assistantContent += chunk;
-                  pendingContent = assistantContent;
+                  openText += chunk;
                   if (rafId === null) {
                     rafId = requestAnimationFrame(() => {
-                      const content = pendingContent;
-                      let nextMsg = { id: assistantId, role: "assistant", content };
-                      setMessages((prev) => {
-                        const updated = [...prev];
-                        const last = updated[updated.length - 1];
-                        if (last && last.id === assistantId) {
-                          nextMsg = { ...last, content };
-                        }
-                        updated[updated.length - 1] = nextMsg;
-                        return updated;
-                      });
-                      onMessagesChange?.([...updatedMessages, nextMsg], sessionAtSend);
                       rafId = null;
+                      commit();
                     });
                   }
                 } else if (chunk.type === "reasoning") {
@@ -468,26 +489,18 @@ var ChatCanvas = ({
                     return updated;
                   });
                 } else if (chunk.type === "todos") {
-                  streamedTodos = chunk.todos;
-                  setMessages((prev) => {
-                    const updated = [...prev];
-                    const last = updated[updated.length - 1];
-                    if (last && last.id === assistantId) {
-                      updated[updated.length - 1] = { ...last, todos: chunk.todos };
-                    }
-                    return updated;
-                  });
+                  if (todosIndex === null) {
+                    flushOpenText();
+                    todosIndex = blocks.length;
+                    blocks.push({ type: "todos", todos: chunk.todos });
+                  } else {
+                    blocks[todosIndex] = { type: "todos", todos: chunk.todos };
+                  }
+                  commit();
                 } else if (chunk.type === "chart") {
-                  streamedCharts = [...streamedCharts ?? [], chunk.spec];
-                  const nextCharts = streamedCharts;
-                  setMessages((prev) => {
-                    const updated = [...prev];
-                    const last = updated[updated.length - 1];
-                    if (last && last.id === assistantId) {
-                      updated[updated.length - 1] = { ...last, charts: nextCharts };
-                    }
-                    return updated;
-                  });
+                  flushOpenText();
+                  blocks.push({ type: "chart", spec: chunk.spec });
+                  commit();
                 }
               }
               if (rafId !== null) cancelAnimationFrame(rafId);
@@ -495,14 +508,14 @@ var ChatCanvas = ({
               if (sessionAtSend !== void 0 && currentConversationIdRef.current !== sessionAtSend) {
                 break;
               }
+              flushOpenText();
               const finalMsg = {
                 id: assistantId,
                 role: "assistant",
                 content: assistantContent,
+                blocks,
                 ...reasoningRef.current ? { metadata: { reasoning: reasoningRef.current } } : {},
-                ...streamedApproval ? { approval: streamedApproval } : {},
-                ...streamedTodos ? { todos: streamedTodos } : {},
-                ...streamedCharts ? { charts: streamedCharts } : {}
+                ...streamedApproval ? { approval: streamedApproval } : {}
               };
               const finalMessages = [...updatedMessages, finalMsg];
               setMessages(finalMessages);
@@ -661,29 +674,12 @@ var ChatCanvas = ({
     const baseMessages = messages.slice(0, userIdx + 1);
     await runHandler(userMsg.content, baseMessages, []);
   };
-  const editMessage = async (messageId, newContent) => {
-    const idx = messages.findIndex((m) => m.id === messageId);
-    if (idx === -1) return;
-    if (messages[idx].role !== "user") return;
-    const trimmed = newContent.replace(/^[\n\r]+|[\n\r]+$/g, "");
-    if (!trimmed.trim()) return;
-    const editedMessage = {
-      ...messages[idx],
-      content: trimmed
-    };
-    const baseMessages = [
-      ...messages.slice(0, idx),
-      editedMessage
-    ];
-    await runHandler(trimmed, baseMessages, []);
-  };
   return /* @__PURE__ */ jsx2(
     ChatContext.Provider,
     {
       value: {
         sendMessage,
         regenerate,
-        editMessage,
         scrollToBottom,
         handleCopy,
         messages,
@@ -719,6 +715,7 @@ var ChatCanvas = ({
           Button2,
           {
             onClick: scrollToBottom,
+            "aria-label": "Scroll to bottom",
             className: styles.scrollToBottom,
             shape: "circular",
             style: {
@@ -741,15 +738,12 @@ import React5, { useEffect as useEffect4, useLayoutEffect as useLayoutEffect2, u
 import {
   Body1 as Body15,
   Button as Button4,
-  Caption1 as Caption12,
   makeStyles as makeStyles7,
   tokens as tokens7
 } from "@fluentui/react-components";
 import {
   ArrowClockwise,
-  Copy,
-  Edit as EditIcon,
-  Info
+  Copy
 } from "@coral-ai/bundleicons";
 import {
   CoralMarkdown
@@ -1214,7 +1208,19 @@ var Chat_TodoList_default = ChatTodoList;
 // src/Chat.Messages.tsx
 import { CoralChart } from "@coral-ai/charts";
 import { CheckmarkCircle20Filled } from "@fluentui/react-icons";
-import { Fragment, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function resolveBlocks(msg) {
+  if (msg.blocks) return msg.blocks;
+  const legacy = [];
+  if (msg.todos && msg.todos.length > 0) {
+    legacy.push({ type: "todos", todos: msg.todos });
+  }
+  if (msg.charts) {
+    for (const spec of msg.charts) legacy.push({ type: "chart", spec });
+  }
+  if (msg.content) legacy.push({ type: "text", content: msg.content });
+  return legacy;
+}
 var useStyles7 = makeStyles7({
   messages: {
     flex: "1",
@@ -1230,7 +1236,7 @@ var useStyles7 = makeStyles7({
   messageWrapper: {
     display: "flex",
     flexDirection: "column",
-    gap: "24px",
+    gap: "0px",
     width: "100%",
     maxWidth: "768px",
     padding: "0 16px",
@@ -1260,51 +1266,12 @@ var useStyles7 = makeStyles7({
     display: "flex",
     justifyContent: "flex-end",
     marginTop: "6px",
-    marginRight: "-10px",
     opacity: 0,
     transition: "opacity 120ms ease-in-out"
   },
   userActions: {
-    display: "flex"
-  },
-  // ── Inline edit mode ──
-  userEditWrap: {
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "stretch",
-    width: "min(640px, 80vw)",
-    gap: "8px"
-  },
-  userEditTextarea: {
-    backgroundColor: tokens7.colorNeutralBackground2,
-    color: tokens7.colorNeutralForeground2,
-    border: `1px solid ${tokens7.colorNeutralStroke1}`,
-    padding: "8px 12px",
-    borderRadius: tokens7.borderRadiusLarge,
-    fontFamily: tokens7.fontFamilyBase,
-    fontSize: tokens7.fontSizeBase300,
-    lineHeight: tokens7.lineHeightBase300,
-    resize: "none",
-    outline: "none",
-    width: "100%",
-    boxSizing: "border-box",
-    minHeight: "40px",
-    "&:focus": {
-      border: `1px solid ${tokens7.colorNeutralStroke3}`
-    }
-  },
-  userEditFooter: {
     display: "flex",
-    marginTop: "8px",
-    // marginLeft: "12px",
-    color: `${tokens7.colorNeutralForeground3}`,
-    gap: "12px",
-    alignItems: "center"
-  },
-  userEditActions: {
-    display: "flex",
-    justifyContent: "flex-end",
-    gap: "8px"
+    gap: "2px"
   },
   // ── Assistant message ──
   messageAssistant: {
@@ -1321,20 +1288,20 @@ var useStyles7 = makeStyles7({
     display: "flex",
     justifyContent: "space-between",
     marginTop: "6px",
-    marginLeft: "-10px",
     // Hover-only by default; the latest message overrides this to stay visible.
     opacity: 0,
     transition: "opacity 120ms ease-in-out"
   },
   assistantActions: {
-    display: "flex"
+    display: "flex",
+    gap: "2px"
   },
   copiedBadge: {
     display: "inline-flex",
     alignItems: "center",
     justifyContent: "center",
-    width: "32px",
-    height: "32px",
+    width: "24px",
+    height: "24px",
     color: tokens7.colorPaletteSeafoamForeground2
   },
   footerIconButton: {
@@ -1361,7 +1328,6 @@ var ChatMessages = ({
     thinkingStatus,
     sendMessage,
     regenerate,
-    editMessage,
     handleCopy,
     lastUserInputRef,
     registerMessagesContainer,
@@ -1376,55 +1342,10 @@ var ChatMessages = ({
   const isSidecar = surface === "panel-right";
   const [copiedKey, setCopiedKey] = useState5(null);
   const copiedTimerRef = useRef4(null);
-  const [editingId, setEditingId] = useState5(null);
-  const [editDraft, setEditDraft] = useState5("");
-  const editTextareaRef = useRef4(null);
   useEffect4(() => {
     registerMessagesContainer(containerRef.current);
     return () => registerMessagesContainer(null);
   }, []);
-  useLayoutEffect2(() => {
-    if (editingId && editTextareaRef.current) {
-      const ta = editTextareaRef.current;
-      ta.focus();
-      ta.setSelectionRange(ta.value.length, ta.value.length);
-      ta.style.height = "auto";
-      ta.style.height = `${ta.scrollHeight}px`;
-    }
-  }, [editingId]);
-  const startEdit = (msg) => {
-    if (!msg.id) return;
-    setEditingId(msg.id);
-    setEditDraft(msg.content);
-  };
-  const cancelEdit = () => {
-    setEditingId(null);
-    setEditDraft("");
-  };
-  const saveEdit = async () => {
-    if (!editingId) return;
-    const trimmed = editDraft.trim();
-    if (!trimmed) return;
-    const id = editingId;
-    setEditingId(null);
-    setEditDraft("");
-    await editMessage(id, trimmed);
-  };
-  const handleEditTextareaInput = (e) => {
-    setEditDraft(e.target.value);
-    const ta = e.target;
-    ta.style.height = "auto";
-    ta.style.height = `${ta.scrollHeight}px`;
-  };
-  const handleEditKeyDown = (e) => {
-    if (e.key === "Escape") {
-      e.preventDefault();
-      cancelEdit();
-    } else if (e.key === "Enter" && !e.shiftKey) {
-      e.preventDefault();
-      void saveEdit();
-    }
-  };
   const onCopyMerged = (content, key) => {
     handleCopy(content);
     onCopy?.(content);
@@ -1434,7 +1355,6 @@ var ChatMessages = ({
   };
   const renderUserMessage = (msg, index) => {
     const key = msg.id ?? `idx-${index}`;
-    const isEditing = !!msg.id && editingId === msg.id;
     const attachments = Array.isArray(msg.metadata?.attachments) ? msg.metadata.attachments : null;
     return /* @__PURE__ */ jsxs7("div", { className: styles.userRow, children: [
       attachments && /* @__PURE__ */ jsx7(
@@ -1480,73 +1400,21 @@ var ChatMessages = ({
           )
         }
       ),
-      isEditing ? /* @__PURE__ */ jsxs7("div", { className: styles.userEditWrap, children: [
-        /* @__PURE__ */ jsx7(
-          "textarea",
-          {
-            ref: editTextareaRef,
-            className: styles.userEditTextarea,
-            value: editDraft,
-            onChange: handleEditTextareaInput,
-            onKeyDown: handleEditKeyDown,
-            rows: 1
-          }
-        ),
-        /* @__PURE__ */ jsxs7("div", { className: styles.userEditFooter, children: [
-          /* @__PURE__ */ jsx7(
-            Info,
-            {
-              style: {
-                marginRight: "6px",
-                color: `${tokens7.colorNeutralForeground3}`,
-                fontSize: "20px",
-                boxSizing: "border-box",
-                flexShrink: 0
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx7(Caption12, { children: "Editing this message will discard the current response and regenerate from here." }),
-          /* @__PURE__ */ jsxs7("div", { className: styles.userEditActions, children: [
-            /* @__PURE__ */ jsx7(Button4, { appearance: "subtle", onClick: cancelEdit, children: "Cancel" }),
-            /* @__PURE__ */ jsx7(
-              Button4,
-              {
-                appearance: "primary",
-                onClick: saveEdit,
-                disabled: !editDraft.trim(),
-                children: "Save"
-              }
-            )
-          ] })
-        ] })
-      ] }) : /* @__PURE__ */ jsxs7(Fragment, { children: [
-        /* @__PURE__ */ jsx7("div", { className: styles.userBubble, children: /* @__PURE__ */ jsx7(Body15, { children: msg.content.split("\n").map((line, i, arr) => /* @__PURE__ */ jsxs7(React5.Fragment, { children: [
-          line,
-          i < arr.length - 1 && /* @__PURE__ */ jsx7("br", {})
-        ] }, i)) }) }),
-        msg.id && /* @__PURE__ */ jsx7("div", { className: `${styles.userFooter} coral-user-footer`, children: /* @__PURE__ */ jsxs7("div", { className: styles.userActions, children: [
-          copiedKey === `user-${key}` ? /* @__PURE__ */ jsx7("span", { className: styles.copiedBadge, children: /* @__PURE__ */ jsx7(CheckmarkCircle20Filled, {}) }) : /* @__PURE__ */ jsx7(
-            Button4,
-            {
-              onClick: () => onCopyMerged(msg.content, `user-${key}`),
-              title: "Copy message",
-              appearance: "subtle",
-              className: styles.footerIconButton,
-              icon: /* @__PURE__ */ jsx7(Copy, {})
-            }
-          ),
-          /* @__PURE__ */ jsx7(
-            Button4,
-            {
-              onClick: () => startEdit(msg),
-              title: "Edit message",
-              appearance: "subtle",
-              className: styles.footerIconButton,
-              icon: /* @__PURE__ */ jsx7(EditIcon, {})
-            }
-          )
-        ] }) })
-      ] })
+      /* @__PURE__ */ jsx7("div", { className: styles.userBubble, children: /* @__PURE__ */ jsx7(Body15, { children: msg.content.split("\n").map((line, i, arr) => /* @__PURE__ */ jsxs7(React5.Fragment, { children: [
+        line,
+        i < arr.length - 1 && /* @__PURE__ */ jsx7("br", {})
+      ] }, i)) }) }),
+      msg.id && /* @__PURE__ */ jsx7("div", { className: `${styles.userFooter} coral-user-footer`, children: /* @__PURE__ */ jsx7("div", { className: styles.userActions, children: copiedKey === `user-${key}` ? /* @__PURE__ */ jsx7("span", { className: styles.copiedBadge, children: /* @__PURE__ */ jsx7(CheckmarkCircle20Filled, {}) }) : /* @__PURE__ */ jsx7(
+        Button4,
+        {
+          onClick: () => onCopyMerged(msg.content, `user-${key}`),
+          title: "Copy message",
+          appearance: "subtle",
+          size: "small",
+          className: styles.footerIconButton,
+          icon: /* @__PURE__ */ jsx7(Copy, {})
+        }
+      ) }) })
     ] }, key);
   };
   const renderAssistantMessage = (msg, index) => {
@@ -1578,17 +1446,24 @@ var ChatMessages = ({
           isStreaming: isLatest && isTyping && !msg.content
         }
       ),
-      msg.todos && msg.todos.length > 0 && /* @__PURE__ */ jsx7(Chat_TodoList_default, { todos: msg.todos }),
-      msg.charts && msg.charts.length > 0 && /* @__PURE__ */ jsx7(Fragment, { children: msg.charts.map((spec, i) => /* @__PURE__ */ jsx7(CoralChart, { spec }, i)) }),
-      /* @__PURE__ */ jsx7(
-        CoralMarkdown,
-        {
-          onNavigate,
-          fontSize,
-          fontFamily,
-          children: msg.content
+      resolveBlocks(msg).map((block, i) => {
+        if (block.type === "todos") {
+          return /* @__PURE__ */ jsx7(Chat_TodoList_default, { todos: block.todos }, `todos-${i}`);
         }
-      ),
+        if (block.type === "chart") {
+          return /* @__PURE__ */ jsx7(CoralChart, { spec: block.spec }, `chart-${i}`);
+        }
+        return /* @__PURE__ */ jsx7(
+          CoralMarkdown,
+          {
+            onNavigate,
+            fontSize,
+            fontFamily,
+            children: block.content
+          },
+          `text-${i}`
+        );
+      }),
       msg.error && /* @__PURE__ */ jsx7(
         Chat_Error_default,
         {
@@ -1618,6 +1493,7 @@ var ChatMessages = ({
                 onClick: () => onCopyMerged(msg.content, `assistant-${key}`),
                 title: "Copy response",
                 appearance: "subtle",
+                size: "small",
                 className: styles.footerIconButton,
                 icon: /* @__PURE__ */ jsx7(Copy, {})
               }
@@ -1628,6 +1504,7 @@ var ChatMessages = ({
                 onClick: () => regenerate(msg.id),
                 title: "Regenerate response",
                 appearance: "subtle",
+                size: "small",
                 className: styles.footerIconButton,
                 icon: /* @__PURE__ */ jsx7(ArrowClockwise, {})
               }
@@ -1641,7 +1518,7 @@ var ChatMessages = ({
     "div",
     {
       className: styles.messageWrapper,
-      style: isSidecar ? { padding: "0 8px" } : void 0,
+      style: isSidecar ? { padding: "0 16px" } : void 0,
       children: [
         messages.map((msg, index) => {
           if (msg.role === "user") {
@@ -1695,7 +1572,7 @@ import {
   MenuItem
 } from "@fluentui/react-components";
 import { Add, DocumentAdd, ImageAdd } from "@coral-ai/bundleicons";
-import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 var ChatAttachButton = ({
   types = ["files", "photos"]
 }) => {
@@ -1704,7 +1581,7 @@ var ChatAttachButton = ({
   const photoRef = useRef5(null);
   const showFiles = types.includes("files");
   const showPhotos = types.includes("photos");
-  return /* @__PURE__ */ jsxs8(Fragment2, { children: [
+  return /* @__PURE__ */ jsxs8(Fragment, { children: [
     showFiles && /* @__PURE__ */ jsx8(
       "input",
       {
@@ -1779,9 +1656,6 @@ var useStyles8 = makeStyles8({
     boxSizing: "border-box",
     overflow: "hidden"
   },
-  cardFocused: {
-    boxShadow: tokens8.shadow28
-  },
   cardDisabled: {
     opacity: "0.3",
     pointerEvents: "none"
@@ -1957,7 +1831,7 @@ var ChatInput = forwardRef(
     return /* @__PURE__ */ jsx9("div", { ref: containerRef, className: styles.wrapper, style, children: /* @__PURE__ */ jsxs9(
       "div",
       {
-        className: `${styles.card}${isFocused ? ` ${styles.cardFocused}` : ""}${disabled ? ` ${styles.cardDisabled}` : ""}`,
+        className: `${styles.card}${disabled ? ` ${styles.cardDisabled}` : ""}`,
         style: {
           border: isFocused ? `1px solid ${tokens8.colorNeutralStroke1}` : `1px solid ${tokens8.colorNeutralStroke2}`
         },
@@ -2031,7 +1905,7 @@ var ChatInput = forwardRef(
 var Chat_Input_default = ChatInput;
 
 // src/Chat.Approval.tsx
-import { Body1 as Body17, Body1Strong, Button as Button7, Caption1 as Caption13, makeStyles as makeStyles9, tokens as tokens9 } from "@fluentui/react-components";
+import { Body1 as Body17, Body1Strong, Button as Button7, Caption1 as Caption12, makeStyles as makeStyles9, tokens as tokens9 } from "@fluentui/react-components";
 import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 var useStyles9 = makeStyles9({
   root: {
@@ -2126,7 +2000,7 @@ var ChatApproval = ({
             opt.id
           );
         }) }),
-        awaitingFreeform && !isAnswered && /* @__PURE__ */ jsx10(Caption13, { className: styles.hint, children: "Type your reply in the message box below." })
+        awaitingFreeform && !isAnswered && /* @__PURE__ */ jsx10(Caption12, { className: styles.hint, children: "Type your reply in the message box below." })
       ]
     }
   );
@@ -2134,7 +2008,7 @@ var ChatApproval = ({
 var Chat_Approval_default = ChatApproval;
 
 // src/Chat.tsx
-import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 var useStyles10 = makeStyles10({
   emptySlot: {
     width: "100%",
@@ -2175,15 +2049,10 @@ var useStyles10 = makeStyles10({
     justifyContent: "center"
   }
 });
-var remapFontSizeForSurface = (size, surface) => {
-  if (surface === "panel-right" && (size === void 0 || size === "default")) {
-    return "small";
-  }
-  return size;
-};
 var ChatLayout = ({
   welcomeMessage,
   promptSuggestions,
+  disclaimer,
   surfaceMotion,
   placeholder,
   disabled,
@@ -2198,13 +2067,6 @@ var ChatLayout = ({
   const welcomeIsFill = welcomeMessage !== void 0 && typeof welcomeMessage !== "string";
   const welcomeNode = typeof welcomeMessage === "string" ? /* @__PURE__ */ jsx11(Title3, { children: welcomeMessage }) : welcomeMessage;
   const styles = useStyles10();
-  const surfaceProbeRef = useRef7(null);
-  const [surface, setSurface] = useState7(null);
-  useLayoutEffect3(() => {
-    const el = surfaceProbeRef.current?.closest("[data-coral-surface]");
-    setSurface(el?.getAttribute("data-coral-surface") ?? null);
-  }, []);
-  const effectiveFontSize = remapFontSizeForSurface(fontSize, surface);
   const { messages, isTyping, pendingApproval, awaitingFreeformApproval } = useChatContext();
   const empty = messages.every((m) => m.role === "system") && !isTyping;
   const approvalLocksInput = pendingApproval !== null && awaitingFreeformApproval === null;
@@ -2213,11 +2075,10 @@ var ChatLayout = ({
   const curve = motionTokens.curveDecelerateMax;
   const spacerTransition = motionEnabled ? `flex-grow 300ms ${curve}` : "none";
   const gapTransition = motionEnabled ? `height 300ms ${curve}` : "none";
-  return /* @__PURE__ */ jsxs11(Fragment3, { children: [
+  return /* @__PURE__ */ jsxs11(Fragment2, { children: [
     /* @__PURE__ */ jsx11(
       "div",
       {
-        ref: surfaceProbeRef,
         style: {
           flexGrow: empty && !welcomeIsFill ? 1 : 0,
           flexShrink: 1,
@@ -2252,7 +2113,7 @@ var ChatLayout = ({
             components,
             onCopy,
             onNavigate,
-            fontSize: effectiveFontSize,
+            fontSize,
             fontFamily
           }
         )
@@ -2284,8 +2145,8 @@ var ChatLayout = ({
         }
       }
     ),
-    /* @__PURE__ */ jsx11(
-      Caption14,
+    disclaimer != null && disclaimer !== false && /* @__PURE__ */ jsx11(
+      Caption13,
       {
         style: {
           display: "flex",
@@ -2294,7 +2155,7 @@ var ChatLayout = ({
           height: "32px",
           opacity: 0.5
         },
-        children: "AI makes mistakes. Check outputs."
+        children: disclaimer
       }
     )
   ] });
@@ -2314,6 +2175,7 @@ var Chat = ({
   onStop,
   welcomeMessage,
   promptSuggestions,
+  disclaimer,
   surfaceMotion,
   components,
   onCopy,
@@ -2348,6 +2210,7 @@ var Chat = ({
         {
           welcomeMessage,
           promptSuggestions,
+          disclaimer,
           surfaceMotion,
           placeholder,
           disabled,
@@ -2704,13 +2567,13 @@ function createAgentHandler(options) {
 }
 
 // src/Chat.Threads.tsx
-import * as React9 from "react";
+import * as React8 from "react";
 import { jsx as jsx12 } from "react/jsx-runtime";
-var ChatThreadsContext = React9.createContext(
+var ChatThreadsContext = React8.createContext(
   null
 );
 function useChatThreads() {
-  const value = React9.useContext(ChatThreadsContext);
+  const value = React8.useContext(ChatThreadsContext);
   if (!value) {
     throw new Error(
       "useChatThreads must be used inside <ChatThreadsProvider>."
@@ -2756,25 +2619,25 @@ function ChatThreadsProvider({
   onActiveThreadChange,
   children
 }) {
-  const adapter = React9.useMemo(
+  const adapter = React8.useMemo(
     () => providedAdapter ?? createMemoryThreadsAdapter(),
     [providedAdapter]
   );
-  const [threads, setThreads] = React9.useState([]);
-  const [uncontrolledId, setUncontrolledId] = React9.useState(
+  const [threads, setThreads] = React8.useState([]);
+  const [uncontrolledId, setUncontrolledId] = React8.useState(
     defaultActiveThreadId
   );
-  const [isLoading, setIsLoading] = React9.useState(true);
+  const [isLoading, setIsLoading] = React8.useState(true);
   const isControlled = controlledId !== void 0;
   const activeThreadId = isControlled ? controlledId : uncontrolledId;
-  const setActiveThreadId = React9.useCallback(
+  const setActiveThreadId = React8.useCallback(
     (id) => {
       if (!isControlled) setUncontrolledId(id);
       onActiveThreadChange?.(id);
     },
     [isControlled, onActiveThreadChange]
   );
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     let cancelled = false;
     (async () => {
       setIsLoading(true);
@@ -2787,7 +2650,7 @@ function ChatThreadsProvider({
       cancelled = true;
     };
   }, [adapter]);
-  const createThread = React9.useCallback(
+  const createThread = React8.useCallback(
     async (initial) => {
       const thread = await adapter.create(initial);
       setThreads((prev) => [thread, ...prev.filter((t) => t.id !== thread.id)]);
@@ -2795,7 +2658,7 @@ function ChatThreadsProvider({
     },
     [adapter]
   );
-  const renameThread = React9.useCallback(
+  const renameThread = React8.useCallback(
     async (id, newTitle) => {
       await adapter.rename(id, newTitle);
       setThreads(
@@ -2806,7 +2669,7 @@ function ChatThreadsProvider({
     },
     [adapter]
   );
-  const removeThread = React9.useCallback(
+  const removeThread = React8.useCallback(
     async (id) => {
       await adapter.remove(id);
       setThreads((prev) => prev.filter((t) => t.id !== id));
@@ -2814,9 +2677,9 @@ function ChatThreadsProvider({
     },
     [adapter, activeThreadId, setActiveThreadId]
   );
-  const threadsRef = React9.useRef(threads);
+  const threadsRef = React8.useRef(threads);
   threadsRef.current = threads;
-  const updateThreadMessages = React9.useCallback(
+  const updateThreadMessages = React8.useCallback(
     (id, messages) => {
       const existing = threadsRef.current.find((t) => t.id === id);
       if (!existing) return;
@@ -2830,11 +2693,11 @@ function ChatThreadsProvider({
     },
     [adapter]
   );
-  const activeThread = React9.useMemo(
+  const activeThread = React8.useMemo(
     () => threads.find((t) => t.id === activeThreadId),
     [threads, activeThreadId]
   );
-  const value = React9.useMemo(
+  const value = React8.useMemo(
     () => ({
       threads,
       activeThreadId,