@coral-ai/chat 0.5.0 → 0.6.0

package/README.md

@@ -22,4 +22,18 @@ import { Chat } from "@coral-ai/chat";
 `ChatChunk`s, or a `ChatResponse`. A backend URL can also be supplied via the
 `api` prop or `coral.config.json`'s `chat.api`.
 
+`disclaimer?: React.ReactNode` adds optional content beneath the input. By
+default no disclaimer or footer space is rendered; `undefined`, `null`, and
+`false` also hide it. To retain the previous built-in text, opt in explicitly:
+
+```tsx
+<Chat api="/api/chat" disclaimer="AI makes mistakes. Check outputs." />
+```
+
+Custom React content, such as a policy link, is also supported.
+
 See [coral-ai](https://github.com/mochimilk/coral-ai) for the full project.
+
+## Migrating to 0.6
+
+User-message editing and `useChatContext().editMessage` have been removed. Assistant Copy/Regenerate and error Retry remain. The disclaimer is opt-in: pass `disclaimer` to render footer content; omission reserves no space. Sidecars use the true default 15px assistant font. Message rows use a 0px gap; footer buttons are small with a 2px gap.

package/dist/index.d.ts

@@ -227,6 +227,8 @@ interface ChatProps {
      * to invoke `sendMessage(text)` on click.
      */
     promptSuggestions?: React__default.ReactNode;
+    /** Optional content below the input. Omit or pass null to render no footer or reserved space. */
+    disclaimer?: React__default.ReactNode;
     /**
      * Pass `null` to disable the chat's built-in surface motion (input slide to
      * bottom on first message). Omit / leave undefined for default motion.
@@ -550,11 +552,6 @@ interface ChatContextValue {
      * If `messageId` targets a user message, the existing assistant reply for that turn is discarded and re-generated.
      */
     regenerate: (messageId?: string) => Promise<void>;
-    /**
-     * Replaces the content of an existing user message and re-runs from that point.
-     * Truncates everything after the edited message and re-invokes the handler.
-     */
-    editMessage: (messageId: string, newContent: string) => Promise<void>;
     scrollToBottom: () => void;
     /** Pre-binds navigator.clipboard.writeText + the onCopy prop callback. */
     handleCopy: (content: string) => void;

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%)"
   }
@@ -675,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,
@@ -733,6 +715,7 @@ var ChatCanvas = ({
           Button2,
           {
             onClick: scrollToBottom,
+            "aria-label": "Scroll to bottom",
             className: styles.scrollToBottom,
             shape: "circular",
             style: {
@@ -755,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
@@ -1228,7 +1208,7 @@ 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 = [];
@@ -1256,7 +1236,7 @@ var useStyles7 = makeStyles7({
   messageWrapper: {
     display: "flex",
     flexDirection: "column",
-    gap: "24px",
+    gap: "0px",
     width: "100%",
     maxWidth: "768px",
     padding: "0 16px",
@@ -1286,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: {
@@ -1347,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: {
@@ -1387,7 +1328,6 @@ var ChatMessages = ({
     thinkingStatus,
     sendMessage,
     regenerate,
-    editMessage,
     handleCopy,
     lastUserInputRef,
     registerMessagesContainer,
@@ -1402,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);
@@ -1460,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(
@@ -1506,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) => {
@@ -1651,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, {})
               }
@@ -1661,6 +1504,7 @@ var ChatMessages = ({
                 onClick: () => regenerate(msg.id),
                 title: "Regenerate response",
                 appearance: "subtle",
+                size: "small",
                 className: styles.footerIconButton,
                 icon: /* @__PURE__ */ jsx7(ArrowClockwise, {})
               }
@@ -1674,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") {
@@ -1728,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"]
 }) => {
@@ -1737,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",
       {
@@ -1812,9 +1656,6 @@ var useStyles8 = makeStyles8({
     boxSizing: "border-box",
     overflow: "hidden"
   },
-  cardFocused: {
-    boxShadow: tokens8.shadow28
-  },
   cardDisabled: {
     opacity: "0.3",
     pointerEvents: "none"
@@ -1990,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}`
         },
@@ -2064,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: {
@@ -2159,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." })
       ]
     }
   );
@@ -2167,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%",
@@ -2208,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,
@@ -2231,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;
@@ -2246,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,
@@ -2285,7 +2113,7 @@ var ChatLayout = ({
             components,
             onCopy,
             onNavigate,
-            fontSize: effectiveFontSize,
+            fontSize,
             fontFamily
           }
         )
@@ -2317,8 +2145,8 @@ var ChatLayout = ({
         }
       }
     ),
-    /* @__PURE__ */ jsx11(
-      Caption14,
+    disclaimer != null && disclaimer !== false && /* @__PURE__ */ jsx11(
+      Caption13,
       {
         style: {
           display: "flex",
@@ -2327,7 +2155,7 @@ var ChatLayout = ({
           height: "32px",
           opacity: 0.5
         },
-        children: "AI makes mistakes. Check outputs."
+        children: disclaimer
       }
     )
   ] });
@@ -2347,6 +2175,7 @@ var Chat = ({
   onStop,
   welcomeMessage,
   promptSuggestions,
+  disclaimer,
   surfaceMotion,
   components,
   onCopy,
@@ -2381,6 +2210,7 @@ var Chat = ({
         {
           welcomeMessage,
           promptSuggestions,
+          disclaimer,
           surfaceMotion,
           placeholder,
           disabled,
@@ -2737,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>."
@@ -2789,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);
@@ -2820,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)]);
@@ -2828,7 +2658,7 @@ function ChatThreadsProvider({
     },
     [adapter]
   );
-  const renameThread = React9.useCallback(
+  const renameThread = React8.useCallback(
     async (id, newTitle) => {
       await adapter.rename(id, newTitle);
       setThreads(
@@ -2839,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));
@@ -2847,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;
@@ -2863,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,