@assistant-ui/react 0.5.19 → 0.5.20

package/dist/index.mjs

@@ -1118,8 +1118,8 @@ var BranchPickerPrimitiveNumber = () => {
 BranchPickerPrimitiveNumber.displayName = "BranchPickerPrimitive.Number";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-import { Primitive as Primitive6 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef9 } from "react";
+import { Primitive as Primitive5 } from "@radix-ui/react-primitive";
+import { forwardRef as forwardRef10 } from "react";
 
 // src/primitives/message/index.ts
 var message_exports = {};
@@ -1161,9 +1161,9 @@ var useIsHoveringRef = () => {
   );
   return useManagedRef(callbackRef);
 };
-var MessagePrimitiveRoot = forwardRef6(({ onMouseEnter, onMouseLeave, ...rest }, forwardRef28) => {
+var MessagePrimitiveRoot = forwardRef6(({ onMouseEnter, onMouseLeave, ...rest }, forwardRef29) => {
   const isHoveringRef = useIsHoveringRef();
-  const ref = useComposedRefs(forwardRef28, isHoveringRef);
+  const ref = useComposedRefs(forwardRef29, isHoveringRef);
   return /* @__PURE__ */ jsx12(Primitive3.div, { ...rest, ref });
 });
 MessagePrimitiveRoot.displayName = "MessagePrimitive.Root";
@@ -1225,7 +1225,6 @@ var useContentPartContext2 = (partIndex) => {
     const useContentPart = create10(
       () => getContentPartState(useMessage.getState(), void 0, partIndex)
     );
-    getContentPartState(useMessage.getState(), useContentPart, partIndex);
     return { useContentPart };
   });
   useEffect6(() => {
@@ -1252,11 +1251,58 @@ var ContentPartProvider = ({
 };
 
 // src/primitives/contentPart/ContentPartText.tsx
-import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef7 } from "react";
+import {
+  forwardRef as forwardRef8
+} from "react";
+
+// src/utils/smooth/useSmooth.tsx
+import { useEffect as useEffect7, useMemo as useMemo3, useRef as useRef3, useState as useState6 } from "react";
+
+// src/utils/smooth/SmoothContext.tsx
+import {
+  createContext as createContext5,
+  forwardRef as forwardRef7,
+  useContext as useContext5,
+  useState as useState5
+} from "react";
+import { create as create11 } from "zustand";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var SmoothContext = createContext5(null);
+var makeSmoothContext = (initialState) => {
+  const useSmoothStatus2 = create11(() => initialState);
+  return { useSmoothStatus: useSmoothStatus2 };
+};
+var SmoothContextProvider = ({ children }) => {
+  const outer = useSmoothContext({ optional: true });
+  const { useContentPart } = useContentPartContext();
+  const [context] = useState5(
+    () => makeSmoothContext(useContentPart.getState().status)
+  );
+  if (outer) return children;
+  return /* @__PURE__ */ jsx14(SmoothContext.Provider, { value: context, children });
+};
+var withSmoothContextProvider = (Component) => {
+  const Wrapped = forwardRef7((props, ref) => {
+    return /* @__PURE__ */ jsx14(SmoothContextProvider, { children: /* @__PURE__ */ jsx14(Component, { ...props, ref }) });
+  });
+  Wrapped.displayName = Component.displayName;
+  return Wrapped;
+};
+function useSmoothContext(options) {
+  const context = useContext5(SmoothContext);
+  if (!options?.optional && !context)
+    throw new Error(
+      "This component must be used within a SmoothContextProvider."
+    );
+  return context;
+}
+var useSmoothStatus = () => {
+  const { useSmoothStatus: useSmoothStatus2 } = useSmoothContext();
+  return useSmoothStatus2();
+};
 
-// src/utils/hooks/useSmooth.tsx
-import { useEffect as useEffect7, useRef as useRef3, useState as useState5 } from "react";
+// src/utils/smooth/useSmooth.tsx
+import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
 var TextStreamAnimator = class {
   constructor(currentText, setText) {
     this.currentText = currentText;
@@ -1301,13 +1347,24 @@ var TextStreamAnimator = class {
     this.setText(this.currentText);
   };
 };
-var useSmooth = (text, smooth = false) => {
+var SMOOTH_STATUS = Object.freeze({
+  type: "running"
+});
+var useSmooth = (state, smooth = false) => {
+  const { useSmoothStatus: useSmoothStatus2 } = useSmoothContext({ optional: true }) ?? {};
+  const {
+    part: { text }
+  } = state;
   const { useMessage } = useMessageContext();
   const id = useMessage((m) => m.message.id);
   const idRef = useRef3(id);
-  const [displayedText, setDisplayedText] = useState5(text);
-  const [animatorRef] = useState5(
-    new TextStreamAnimator(text, setDisplayedText)
+  const [displayedText, setDisplayedText] = useState6(text);
+  const setText = useCallbackRef2((text2) => {
+    setDisplayedText(text2);
+    useSmoothStatus2?.setState(text2 !== state.part.text ? SMOOTH_STATUS : state.status);
+  });
+  const [animatorRef] = useState6(
+    new TextStreamAnimator(text, setText)
   );
   useEffect7(() => {
     if (!smooth) {
@@ -1316,7 +1373,7 @@ var useSmooth = (text, smooth = false) => {
     }
     if (idRef.current !== id || !text.startsWith(animatorRef.targetText)) {
       idRef.current = id;
-      setDisplayedText(text);
+      setText(text);
       animatorRef.currentText = text;
       animatorRef.targetText = text;
       animatorRef.stop();
@@ -1324,36 +1381,41 @@ var useSmooth = (text, smooth = false) => {
     }
     animatorRef.targetText = text;
     animatorRef.start();
-  }, [animatorRef, id, smooth, text]);
+  }, [setText, animatorRef, id, smooth, text]);
   useEffect7(() => {
     return () => {
       animatorRef.stop();
     };
   }, [animatorRef]);
-  return smooth ? displayedText : text;
+  return useMemo3(
+    () => smooth ? {
+      part: { type: "text", text: displayedText },
+      status: text === displayedText ? state.status : SMOOTH_STATUS
+    } : state,
+    [smooth, displayedText, state, text]
+  );
 };
 
 // src/primitives/contentPart/ContentPartText.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
-var ContentPartPrimitiveText = forwardRef7(({ smooth = true, ...rest }, forwardedRef) => {
+import { jsx as jsx15 } from "react/jsx-runtime";
+var ContentPartPrimitiveText = forwardRef8(({ smooth = true, component: Component = "span", ...rest }, forwardedRef) => {
   const {
-    status,
-    part: { text }
-  } = useContentPartText();
-  const smoothText = useSmooth(text, smooth);
-  return /* @__PURE__ */ jsx14(Primitive4.span, { "data-status": status.type, ...rest, ref: forwardedRef, children: smoothText });
+    part: { text },
+    status
+  } = useSmooth(useContentPartText(), smooth);
+  return /* @__PURE__ */ jsx15(Component, { "data-status": status.type, ...rest, ref: forwardedRef, children: text });
 });
 ContentPartPrimitiveText.displayName = "ContentPartPrimitive.Text";
 
 // src/primitives/contentPart/ContentPartImage.tsx
-import { Primitive as Primitive5 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef8 } from "react";
-import { jsx as jsx15 } from "react/jsx-runtime";
-var ContentPartPrimitiveImage = forwardRef8((props, forwardedRef) => {
+import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
+import { forwardRef as forwardRef9 } from "react";
+import { jsx as jsx16 } from "react/jsx-runtime";
+var ContentPartPrimitiveImage = forwardRef9((props, forwardedRef) => {
   const {
     part: { image }
   } = useContentPartImage();
-  return /* @__PURE__ */ jsx15(Primitive5.img, { src: image, ...props, ref: forwardedRef });
+  return /* @__PURE__ */ jsx16(Primitive4.img, { src: image, ...props, ref: forwardedRef });
 });
 ContentPartPrimitiveImage.displayName = "ContentPartPrimitive.Image";
 
@@ -1375,20 +1437,20 @@ var ContentPartPrimitiveInProgress = ({ children }) => {
 ContentPartPrimitiveInProgress.displayName = "ContentPartPrimitive.InProgress";
 
 // src/primitives/message/MessageContent.tsx
-import { jsx as jsx16, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs2 } from "react/jsx-runtime";
 var defaultComponents = {
   Text: () => /* @__PURE__ */ jsxs2("p", { style: { whiteSpace: "pre-line" }, children: [
-    /* @__PURE__ */ jsx16(ContentPartPrimitiveText, {}),
-    /* @__PURE__ */ jsx16(ContentPartPrimitiveInProgress, { children: /* @__PURE__ */ jsx16("span", { style: { fontFamily: "revert" }, children: " \u25CF" }) })
+    /* @__PURE__ */ jsx17(ContentPartPrimitiveText, {}),
+    /* @__PURE__ */ jsx17(ContentPartPrimitiveInProgress, { children: /* @__PURE__ */ jsx17("span", { style: { fontFamily: "revert" }, children: " \u25CF" }) })
   ] }),
-  Image: () => /* @__PURE__ */ jsx16(ContentPartPrimitiveImage, {}),
-  UI: () => /* @__PURE__ */ jsx16(ContentPartPrimitiveDisplay, {}),
+  Image: () => /* @__PURE__ */ jsx17(ContentPartPrimitiveImage, {}),
+  UI: () => /* @__PURE__ */ jsx17(ContentPartPrimitiveDisplay, {}),
   tools: {
     Fallback: (props) => {
       const { useToolUIs } = useAssistantContext();
       const Render = useToolUIs((s) => s.getToolUI(props.part.toolName));
       if (!Render) return null;
-      return /* @__PURE__ */ jsx16(Render, { ...props });
+      return /* @__PURE__ */ jsx17(Render, { ...props });
     }
   }
 };
@@ -1411,16 +1473,16 @@ var MessageContentPartComponent = ({
     case "text":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      if (part === EMPTY_CONTENT) return /* @__PURE__ */ jsx16(Empty, { part, status });
-      return /* @__PURE__ */ jsx16(Text2, { part, status });
+      if (part === EMPTY_CONTENT) return /* @__PURE__ */ jsx17(Empty, { part, status });
+      return /* @__PURE__ */ jsx17(Text2, { part, status });
     case "image":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      return /* @__PURE__ */ jsx16(Image2, { part, status });
+      return /* @__PURE__ */ jsx17(Image2, { part, status });
     case "ui":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      return /* @__PURE__ */ jsx16(UI, { part, status });
+      return /* @__PURE__ */ jsx17(UI, { part, status });
     case "tool-call": {
       const Tool = by_name[part.toolName] || Fallback2;
       const addResult = (result) => addToolResult({
@@ -1428,7 +1490,7 @@ var MessageContentPartComponent = ({
         toolCallId: part.toolCallId,
         result
       });
-      return /* @__PURE__ */ jsx16(Tool, { part, status, addResult });
+      return /* @__PURE__ */ jsx17(Tool, { part, status, addResult });
     }
     default:
       const unhandledType = type;
@@ -1439,7 +1501,7 @@ var MessageContentPartImpl = ({
   partIndex,
   components
 }) => {
-  return /* @__PURE__ */ jsx16(ContentPartProvider, { partIndex, children: /* @__PURE__ */ jsx16(MessageContentPartComponent, { components }) });
+  return /* @__PURE__ */ jsx17(ContentPartProvider, { partIndex, children: /* @__PURE__ */ jsx17(MessageContentPartComponent, { components }) });
 };
 var MessageContentPart = memo2(
   MessageContentPartImpl,
@@ -1452,7 +1514,7 @@ var MessagePrimitiveContent = ({
   const contentLength = useMessage((s) => s.message.content.length) || 1;
   return new Array(contentLength).fill(null).map((_, idx) => {
     const partIndex = idx;
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx17(
       MessageContentPart,
       {
         partIndex,
@@ -1471,9 +1533,9 @@ var MessagePrimitiveInProgress = () => {
 MessagePrimitiveInProgress.displayName = "MessagePrimitive.InProgress";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
-var BranchPickerPrimitiveRoot = forwardRef9(({ hideWhenSingleBranch, ...rest }, ref) => {
-  return /* @__PURE__ */ jsx17(MessagePrimitiveIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ jsx17(Primitive6.div, { ...rest, ref }) });
+import { jsx as jsx18 } from "react/jsx-runtime";
+var BranchPickerPrimitiveRoot = forwardRef10(({ hideWhenSingleBranch, ...rest }, ref) => {
+  return /* @__PURE__ */ jsx18(MessagePrimitiveIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ jsx18(Primitive5.div, { ...rest, ref }) });
 });
 BranchPickerPrimitiveRoot.displayName = "BranchPickerPrimitive.Root";
 
@@ -1489,20 +1551,20 @@ __export(composer_exports, {
 
 // src/primitives/composer/ComposerRoot.tsx
 import { composeEventHandlers as composeEventHandlers4 } from "@radix-ui/primitive";
-import { Primitive as Primitive7 } from "@radix-ui/react-primitive";
+import { Primitive as Primitive6 } from "@radix-ui/react-primitive";
 import {
-  forwardRef as forwardRef10
+  forwardRef as forwardRef11
 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
-var ComposerPrimitiveRoot = forwardRef10(({ onSubmit, ...rest }, forwardedRef) => {
+import { jsx as jsx19 } from "react/jsx-runtime";
+var ComposerPrimitiveRoot = forwardRef11(({ onSubmit, ...rest }, forwardedRef) => {
   const send = useComposerSend();
   const handleSubmit = (e) => {
     e.preventDefault();
     if (!send) return;
     send();
   };
-  return /* @__PURE__ */ jsx18(
-    Primitive7.form,
+  return /* @__PURE__ */ jsx19(
+    Primitive6.form,
     {
       ...rest,
       ref: forwardedRef,
@@ -1517,15 +1579,15 @@ import { composeEventHandlers as composeEventHandlers5 } from "@radix-ui/primiti
 import { useComposedRefs as useComposedRefs2 } from "@radix-ui/react-compose-refs";
 import { Slot } from "@radix-ui/react-slot";
 import {
-  forwardRef as forwardRef11,
+  forwardRef as forwardRef12,
   useCallback as useCallback15,
   useEffect as useEffect8,
   useRef as useRef4
 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
 import { useEscapeKeydown } from "@radix-ui/react-use-escape-keydown";
-import { jsx as jsx19 } from "react/jsx-runtime";
-var ComposerPrimitiveInput = forwardRef11(
+import { jsx as jsx20 } from "react/jsx-runtime";
+var ComposerPrimitiveInput = forwardRef12(
   ({
     autoFocus = false,
     asChild,
@@ -1577,7 +1639,7 @@ var ComposerPrimitiveInput = forwardRef11(
         focus();
       }
     });
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx20(
       Component,
       {
         name: "input",
@@ -1598,14 +1660,14 @@ var ComposerPrimitiveInput = forwardRef11(
 ComposerPrimitiveInput.displayName = "ComposerPrimitive.Input";
 
 // src/primitives/composer/ComposerSend.tsx
-import { forwardRef as forwardRef12 } from "react";
-import { Primitive as Primitive8 } from "@radix-ui/react-primitive";
-import { jsx as jsx20 } from "react/jsx-runtime";
-var ComposerPrimitiveSend = forwardRef12(({ disabled, ...rest }, ref) => {
+import { forwardRef as forwardRef13 } from "react";
+import { Primitive as Primitive7 } from "@radix-ui/react-primitive";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var ComposerPrimitiveSend = forwardRef13(({ disabled, ...rest }, ref) => {
   const { useComposer } = useComposerContext();
   const hasValue = useComposer((c) => c.isEditing && c.value.length > 0);
-  return /* @__PURE__ */ jsx20(
-    Primitive8.button,
+  return /* @__PURE__ */ jsx21(
+    Primitive7.button,
     {
       type: "submit",
       ...rest,
@@ -1654,11 +1716,11 @@ __export(thread_exports, {
 });
 
 // src/primitives/thread/ThreadRoot.tsx
-import { Primitive as Primitive9 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef13 } from "react";
-import { jsx as jsx21 } from "react/jsx-runtime";
-var ThreadPrimitiveRoot = forwardRef13((props, ref) => {
-  return /* @__PURE__ */ jsx21(Primitive9.div, { ...props, ref });
+import { Primitive as Primitive8 } from "@radix-ui/react-primitive";
+import { forwardRef as forwardRef14 } from "react";
+import { jsx as jsx22 } from "react/jsx-runtime";
+var ThreadPrimitiveRoot = forwardRef14((props, ref) => {
+  return /* @__PURE__ */ jsx22(Primitive8.div, { ...props, ref });
 });
 ThreadPrimitiveRoot.displayName = "ThreadPrimitive.Root";
 
@@ -1683,18 +1745,18 @@ ThreadPrimitiveIf.displayName = "ThreadPrimitive.If";
 
 // src/primitives/thread/ThreadViewport.tsx
 import { useComposedRefs as useComposedRefs4 } from "@radix-ui/react-compose-refs";
-import { Primitive as Primitive10 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef14 } from "react";
+import { Primitive as Primitive9 } from "@radix-ui/react-primitive";
+import { forwardRef as forwardRef15 } from "react";
 
 // src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
 import { useComposedRefs as useComposedRefs3 } from "@radix-ui/react-compose-refs";
 import { useRef as useRef5 } from "react";
 
 // src/utils/hooks/useOnResizeContent.tsx
-import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
+import { useCallbackRef as useCallbackRef3 } from "@radix-ui/react-use-callback-ref";
 import { useCallback as useCallback16 } from "react";
 var useOnResizeContent = (callback) => {
-  const callbackRef = useCallbackRef2(callback);
+  const callbackRef = useCallbackRef3(callback);
   const refCallback = useCallback16(
     (el) => {
       const resizeObserver = new ResizeObserver(() => {
@@ -1731,10 +1793,10 @@ var useOnResizeContent = (callback) => {
 };
 
 // src/utils/hooks/useOnScrollToBottom.tsx
-import { useCallbackRef as useCallbackRef3 } from "@radix-ui/react-use-callback-ref";
+import { useCallbackRef as useCallbackRef4 } from "@radix-ui/react-use-callback-ref";
 import { useEffect as useEffect9 } from "react";
 var useOnScrollToBottom = (callback) => {
-  const callbackRef = useCallbackRef3(callback);
+  const callbackRef = useCallbackRef4(callback);
   const { useViewport } = useThreadContext();
   useEffect9(() => {
     return useViewport.getState().onScrollToBottom(() => {
@@ -1795,13 +1857,13 @@ var useThreadViewportAutoScroll = ({
 };
 
 // src/primitives/thread/ThreadViewport.tsx
-import { jsx as jsx22 } from "react/jsx-runtime";
-var ThreadPrimitiveViewport = forwardRef14(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
+import { jsx as jsx23 } from "react/jsx-runtime";
+var ThreadPrimitiveViewport = forwardRef15(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
   const autoScrollRef = useThreadViewportAutoScroll({
     autoScroll
   });
   const ref = useComposedRefs4(forwardedRef, autoScrollRef);
-  return /* @__PURE__ */ jsx22(Primitive10.div, { ...rest, ref, children });
+  return /* @__PURE__ */ jsx23(Primitive9.div, { ...rest, ref, children });
 });
 ThreadPrimitiveViewport.displayName = "ThreadPrimitive.Viewport";
 
@@ -1809,15 +1871,15 @@ ThreadPrimitiveViewport.displayName = "ThreadPrimitive.Viewport";
 import { memo as memo3 } from "react";
 
 // src/context/providers/MessageProvider.tsx
-import { useEffect as useEffect10, useState as useState6 } from "react";
-import { create as create13 } from "zustand";
+import { useEffect as useEffect10, useState as useState7 } from "react";
+import { create as create14 } from "zustand";
 
 // src/context/stores/EditComposer.ts
-import { create as create11 } from "zustand";
+import { create as create12 } from "zustand";
 var makeEditComposerStore = ({
   onEdit,
   onSend
-}) => create11()((set, get, store) => ({
+}) => create12()((set, get, store) => ({
   ...makeBaseComposer(set, get, store),
   canCancel: false,
   isEditing: false,
@@ -1836,8 +1898,8 @@ var makeEditComposerStore = ({
 }));
 
 // src/context/stores/MessageUtils.ts
-import { create as create12 } from "zustand";
-var makeMessageUtilsStore = () => create12((set) => ({
+import { create as create13 } from "zustand";
+var makeMessageUtilsStore = () => create13((set) => ({
   isCopied: false,
   setIsCopied: (value) => {
     set({ isCopied: value });
@@ -1849,7 +1911,7 @@ var makeMessageUtilsStore = () => create12((set) => ({
 }));
 
 // src/context/providers/MessageProvider.tsx
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var getIsLast = (messages, message) => {
   return messages[messages.length - 1]?.id === message.id;
 };
@@ -1871,8 +1933,8 @@ var getMessageState = (messages, getBranches, useMessage, messageIndex) => {
 };
 var useMessageContext2 = (messageIndex) => {
   const { useThreadMessages, useThreadActions } = useThreadContext();
-  const [context] = useState6(() => {
-    const useMessage = create13(
+  const [context] = useState7(() => {
+    const useMessage = create14(
       () => getMessageState(
         useThreadMessages.getState(),
         useThreadActions.getState().getBranches,
@@ -1933,11 +1995,11 @@ var MessageProvider = ({
   children
 }) => {
   const context = useMessageContext2(messageIndex);
-  return /* @__PURE__ */ jsx23(MessageContext.Provider, { value: context, children });
+  return /* @__PURE__ */ jsx24(MessageContext.Provider, { value: context, children });
 };
 
 // src/primitives/thread/ThreadMessages.tsx
-import { jsx as jsx24, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs3 } from "react/jsx-runtime";
 var DEFAULT_SYSTEM_MESSAGE = () => null;
 var getComponents = (components) => {
   return {
@@ -1954,11 +2016,11 @@ var ThreadMessageImpl = ({
   const { UserMessage: UserMessage2, EditComposer: EditComposer2, AssistantMessage: AssistantMessage2, SystemMessage: SystemMessage2 } = getComponents(components);
   return /* @__PURE__ */ jsxs3(MessageProvider, { messageIndex, children: [
     /* @__PURE__ */ jsxs3(MessagePrimitiveIf, { user: true, children: [
-      /* @__PURE__ */ jsx24(ComposerPrimitiveIf, { editing: false, children: /* @__PURE__ */ jsx24(UserMessage2, {}) }),
-      /* @__PURE__ */ jsx24(ComposerPrimitiveIf, { editing: true, children: /* @__PURE__ */ jsx24(EditComposer2, {}) })
+      /* @__PURE__ */ jsx25(ComposerPrimitiveIf, { editing: false, children: /* @__PURE__ */ jsx25(UserMessage2, {}) }),
+      /* @__PURE__ */ jsx25(ComposerPrimitiveIf, { editing: true, children: /* @__PURE__ */ jsx25(EditComposer2, {}) })
     ] }),
-    /* @__PURE__ */ jsx24(MessagePrimitiveIf, { assistant: true, children: /* @__PURE__ */ jsx24(AssistantMessage2, {}) }),
-    /* @__PURE__ */ jsx24(MessagePrimitiveIf, { system: true, children: /* @__PURE__ */ jsx24(SystemMessage2, {}) })
+    /* @__PURE__ */ jsx25(MessagePrimitiveIf, { assistant: true, children: /* @__PURE__ */ jsx25(AssistantMessage2, {}) }),
+    /* @__PURE__ */ jsx25(MessagePrimitiveIf, { system: true, children: /* @__PURE__ */ jsx25(SystemMessage2, {}) })
   ] });
 };
 var ThreadMessage = memo3(
@@ -1973,7 +2035,7 @@ var ThreadPrimitiveMessagesImpl = ({
   if (messagesLength === 0) return null;
   return new Array(messagesLength).fill(null).map((_, idx) => {
     const messageIndex = idx;
-    return /* @__PURE__ */ jsx24(
+    return /* @__PURE__ */ jsx25(
       ThreadMessage,
       {
         messageIndex,
@@ -2003,7 +2065,7 @@ var ThreadPrimitiveSuggestion = createActionButton(
 );
 
 // src/runtimes/local/useLocalRuntime.tsx
-import { useInsertionEffect as useInsertionEffect3, useState as useState8 } from "react";
+import { useInsertionEffect as useInsertionEffect3, useState as useState9 } from "react";
 
 // src/runtimes/core/BaseAssistantRuntime.tsx
 var BaseAssistantRuntime = class {
@@ -2036,7 +2098,9 @@ __export(internal_exports, {
   ProxyConfigProvider: () => ProxyConfigProvider,
   TooltipIconButton: () => TooltipIconButton,
   generateId: () => generateId,
-  useSmooth: () => useSmooth
+  useSmooth: () => useSmooth,
+  useSmoothStatus: () => useSmoothStatus,
+  withSmoothContextProvider: () => withSmoothContextProvider
 });
 
 // src/utils/idUtils.tsx
@@ -2260,17 +2324,17 @@ var MessageRepository = class {
 };
 
 // src/ui/base/tooltip-icon-button.tsx
-import { forwardRef as forwardRef17 } from "react";
+import { forwardRef as forwardRef18 } from "react";
 
 // src/ui/base/tooltip.tsx
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 
 // src/ui/utils/withDefaults.tsx
 import {
-  forwardRef as forwardRef15
+  forwardRef as forwardRef16
 } from "react";
 import classNames from "classnames";
-import { jsx as jsx25 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 var withDefaultProps = ({
   className,
   ...defaultProps
@@ -2283,10 +2347,10 @@ var withDefaultProps = ({
 };
 var withDefaults = (Component, defaultProps) => {
   const getProps = withDefaultProps(defaultProps);
-  const WithDefaults = forwardRef15(
+  const WithDefaults = forwardRef16(
     (props, ref) => {
       const ComponentAsAny = Component;
-      return /* @__PURE__ */ jsx25(ComponentAsAny, { ...getProps(props), ref });
+      return /* @__PURE__ */ jsx26(ComponentAsAny, { ...getProps(props), ref });
     }
   );
   WithDefaults.displayName = "withDefaults(" + (typeof Component === "string" ? Component : Component.displayName) + ")";
@@ -2294,9 +2358,9 @@ var withDefaults = (Component, defaultProps) => {
 };
 
 // src/ui/base/tooltip.tsx
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx27 } from "react/jsx-runtime";
 var Tooltip = (props) => {
-  return /* @__PURE__ */ jsx26(TooltipPrimitive.Provider, { children: /* @__PURE__ */ jsx26(TooltipPrimitive.Root, { ...props }) });
+  return /* @__PURE__ */ jsx27(TooltipPrimitive.Provider, { children: /* @__PURE__ */ jsx27(TooltipPrimitive.Root, { ...props }) });
 };
 Tooltip.displayName = "Tooltip";
 var TooltipTrigger = TooltipPrimitive.Trigger;
@@ -2308,9 +2372,9 @@ TooltipContent.displayName = "TooltipContent";
 
 // src/ui/base/button.tsx
 import { cva } from "class-variance-authority";
-import { Primitive as Primitive11 } from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef16 } from "react";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { Primitive as Primitive10 } from "@radix-ui/react-primitive";
+import { forwardRef as forwardRef17 } from "react";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var buttonVariants = cva("aui-button", {
   variants: {
     variant: {
@@ -2328,10 +2392,10 @@ var buttonVariants = cva("aui-button", {
     size: "default"
   }
 });
-var Button = forwardRef16(
+var Button = forwardRef17(
   ({ className, variant, size, ...props }, ref) => {
-    return /* @__PURE__ */ jsx27(
-      Primitive11.button,
+    return /* @__PURE__ */ jsx28(
+      Primitive10.button,
       {
         className: buttonVariants({ variant, size, className }),
         ...props,
@@ -2343,14 +2407,14 @@ var Button = forwardRef16(
 Button.displayName = "Button";
 
 // src/ui/base/tooltip-icon-button.tsx
-import { jsx as jsx28, jsxs as jsxs4 } from "react/jsx-runtime";
-var TooltipIconButton = forwardRef17(({ children, tooltip, side = "bottom", ...rest }, ref) => {
+import { jsx as jsx29, jsxs as jsxs4 } from "react/jsx-runtime";
+var TooltipIconButton = forwardRef18(({ children, tooltip, side = "bottom", ...rest }, ref) => {
   return /* @__PURE__ */ jsxs4(Tooltip, { children: [
-    /* @__PURE__ */ jsx28(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs4(Button, { variant: "ghost", size: "icon", ...rest, ref, children: [
+    /* @__PURE__ */ jsx29(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs4(Button, { variant: "ghost", size: "icon", ...rest, ref, children: [
       children,
-      /* @__PURE__ */ jsx28("span", { className: "aui-sr-only", children: tooltip })
+      /* @__PURE__ */ jsx29("span", { className: "aui-sr-only", children: tooltip })
     ] }) }),
-    /* @__PURE__ */ jsx28(TooltipContent, { side, children: tooltip })
+    /* @__PURE__ */ jsx29(TooltipContent, { side, children: tooltip })
   ] });
 });
 TooltipIconButton.displayName = "TooltipIconButton";
@@ -2640,7 +2704,7 @@ var toLanguageModelTools = (tools) => {
 };
 
 // src/runtimes/edge/useEdgeRuntime.ts
-import { useState as useState7 } from "react";
+import { useState as useState8 } from "react";
 
 // src/runtimes/edge/streams/assistantDecoderStream.ts
 function assistantDecoderStream() {
@@ -3380,7 +3444,7 @@ var useEdgeRuntime = ({
   initialMessages,
   ...options
 }) => {
-  const [adapter] = useState7(() => new EdgeChatAdapter(options));
+  const [adapter] = useState8(() => new EdgeChatAdapter(options));
   return useLocalRuntime(adapter, { initialMessages });
 };
 
@@ -3594,7 +3658,7 @@ var LocalRuntime = class extends BaseAssistantRuntime {
 
 // src/runtimes/local/useLocalRuntime.tsx
 var useLocalRuntime = (adapter, options) => {
-  const [runtime] = useState8(() => new LocalRuntime(adapter, options));
+  const [runtime] = useState9(() => new LocalRuntime(adapter, options));
   useInsertionEffect3(() => {
     runtime.adapter = adapter;
   });
@@ -3602,7 +3666,7 @@ var useLocalRuntime = (adapter, options) => {
 };
 
 // src/runtimes/external-store/ExternalStoreThreadRuntime.tsx
-import { create as create14 } from "zustand";
+import { create as create15 } from "zustand";
 
 // src/runtimes/external-store/getExternalStoreMessage.tsx
 var symbolInnerMessage = Symbol("innerMessage");
@@ -3611,7 +3675,7 @@ var getExternalStoreMessage = (message) => {
 };
 
 // src/runtimes/external-store/useExternalStoreSync.tsx
-import { useEffect as useEffect11, useInsertionEffect as useInsertionEffect4, useMemo as useMemo3, useRef as useRef6 } from "react";
+import { useEffect as useEffect11, useInsertionEffect as useInsertionEffect4, useMemo as useMemo4, useRef as useRef6 } from "react";
 
 // src/runtimes/external-store/ThreadMessageConverter.ts
 var ThreadMessageConverter = class {
@@ -3709,7 +3773,7 @@ var useExternalStoreSync = (adapter, updateData) => {
   useInsertionEffect4(() => {
     adapterRef.current = adapter;
   });
-  const [converter, convertCallback] = useMemo3(() => {
+  const [converter, convertCallback] = useMemo4(() => {
     const converter2 = adapter.convertMessage ?? ((m) => m);
     const convertCallback2 = (cache, m, idx) => {
       const autoStatus = getAutoStatus(
@@ -3756,7 +3820,7 @@ var ExternalStoreThreadRuntime = class {
       store.isRunning ?? false,
       store.messages
     );
-    this.useStore = create14(() => ({
+    this.useStore = create15(() => ({
       store
     }));
   }
@@ -3897,9 +3961,9 @@ var ExternalStoreRuntime = class extends BaseAssistantRuntime {
 };
 
 // src/runtimes/external-store/useExternalStoreRuntime.tsx
-import { useEffect as useEffect12, useInsertionEffect as useInsertionEffect5, useState as useState9 } from "react";
+import { useEffect as useEffect12, useInsertionEffect as useInsertionEffect5, useState as useState10 } from "react";
 var useExternalStoreRuntime = (store) => {
-  const [runtime] = useState9(() => new ExternalStoreRuntime(store));
+  const [runtime] = useState10(() => new ExternalStoreRuntime(store));
   useInsertionEffect5(() => {
     runtime.store = store;
   });
@@ -3911,34 +3975,34 @@ var useExternalStoreRuntime = (store) => {
 
 // src/ui/thread-config.tsx
 import {
-  createContext as createContext5,
-  useContext as useContext5
+  createContext as createContext6,
+  useContext as useContext6
 } from "react";
-import { Fragment as Fragment3, jsx as jsx29 } from "react/jsx-runtime";
-var ThreadConfigContext = createContext5({});
+import { Fragment as Fragment3, jsx as jsx30 } from "react/jsx-runtime";
+var ThreadConfigContext = createContext6({});
 var useThreadConfig = () => {
-  return useContext5(ThreadConfigContext);
+  return useContext6(ThreadConfigContext);
 };
 var ThreadConfigProvider = ({
   children,
   config
 }) => {
   const assistant = useAssistantContext({ optional: true });
-  const configProvider = config && Object.keys(config ?? {}).length > 0 ? /* @__PURE__ */ jsx29(ThreadConfigContext.Provider, { value: config, children }) : /* @__PURE__ */ jsx29(Fragment3, { children });
+  const configProvider = config && Object.keys(config ?? {}).length > 0 ? /* @__PURE__ */ jsx30(ThreadConfigContext.Provider, { value: config, children }) : /* @__PURE__ */ jsx30(Fragment3, { children });
   if (!config?.runtime) return configProvider;
   if (assistant) {
     throw new Error(
       "You provided a runtime to <Thread> while simulataneously using <AssistantRuntimeProvider>. This is not allowed."
     );
   }
-  return /* @__PURE__ */ jsx29(AssistantRuntimeProvider, { runtime: config.runtime, children: configProvider });
+  return /* @__PURE__ */ jsx30(AssistantRuntimeProvider, { runtime: config.runtime, children: configProvider });
 };
 ThreadConfigProvider.displayName = "ThreadConfigProvider";
 
 // src/ui/assistant-action-bar.tsx
-import { forwardRef as forwardRef18 } from "react";
+import { forwardRef as forwardRef19 } from "react";
 import { CheckIcon, CopyIcon, RefreshCwIcon } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx30, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx31, jsxs as jsxs5 } from "react/jsx-runtime";
 var useAllowCopy = () => {
   const { assistantMessage: { allowCopy = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -3962,8 +4026,8 @@ var AssistantActionBar = () => {
       autohide: "not-last",
       autohideFloat: "single-branch",
       children: [
-        /* @__PURE__ */ jsx30(AssistantActionBarCopy, {}),
-        /* @__PURE__ */ jsx30(AssistantActionBarReload, {})
+        /* @__PURE__ */ jsx31(AssistantActionBarCopy, {}),
+        /* @__PURE__ */ jsx31(AssistantActionBarReload, {})
       ]
     }
   );
@@ -3973,7 +4037,7 @@ var AssistantActionBarRoot = withDefaults(actionBar_exports.Root, {
   className: "aui-assistant-action-bar-root"
 });
 AssistantActionBarRoot.displayName = "AssistantActionBarRoot";
-var AssistantActionBarCopy = forwardRef18((props, ref) => {
+var AssistantActionBarCopy = forwardRef19((props, ref) => {
   const {
     strings: {
       assistantMessage: { reload: { tooltip = "Copy" } = {} } = {}
@@ -3981,13 +4045,13 @@ var AssistantActionBarCopy = forwardRef18((props, ref) => {
   } = useThreadConfig();
   const allowCopy = useAllowCopy();
   if (!allowCopy) return null;
-  return /* @__PURE__ */ jsx30(actionBar_exports.Copy, { asChild: true, children: /* @__PURE__ */ jsx30(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsxs5(Fragment4, { children: [
-    /* @__PURE__ */ jsx30(message_exports.If, { copied: true, children: /* @__PURE__ */ jsx30(CheckIcon, {}) }),
-    /* @__PURE__ */ jsx30(message_exports.If, { copied: false, children: /* @__PURE__ */ jsx30(CopyIcon, {}) })
+  return /* @__PURE__ */ jsx31(actionBar_exports.Copy, { asChild: true, children: /* @__PURE__ */ jsx31(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsxs5(Fragment4, { children: [
+    /* @__PURE__ */ jsx31(message_exports.If, { copied: true, children: /* @__PURE__ */ jsx31(CheckIcon, {}) }),
+    /* @__PURE__ */ jsx31(message_exports.If, { copied: false, children: /* @__PURE__ */ jsx31(CopyIcon, {}) })
   ] }) }) });
 });
 AssistantActionBarCopy.displayName = "AssistantActionBarCopy";
-var AssistantActionBarReload = forwardRef18((props, ref) => {
+var AssistantActionBarReload = forwardRef19((props, ref) => {
   const {
     strings: {
       assistantMessage: { reload: { tooltip = "Refresh" } = {} } = {}
@@ -3995,7 +4059,7 @@ var AssistantActionBarReload = forwardRef18((props, ref) => {
   } = useThreadConfig();
   const allowReload = useAllowReload();
   if (!allowReload) return null;
-  return /* @__PURE__ */ jsx30(actionBar_exports.Reload, { asChild: true, children: /* @__PURE__ */ jsx30(TooltipIconButton, { tooltip, ...props, ref, children: /* @__PURE__ */ jsx30(RefreshCwIcon, {}) }) });
+  return /* @__PURE__ */ jsx31(actionBar_exports.Reload, { asChild: true, children: /* @__PURE__ */ jsx31(TooltipIconButton, { tooltip, ...props, ref, children: /* @__PURE__ */ jsx31(RefreshCwIcon, {}) }) });
 });
 AssistantActionBarReload.displayName = "AssistantActionBarReload";
 var exports = {
@@ -4009,12 +4073,12 @@ var assistant_action_bar_default = Object.assign(
 );
 
 // src/ui/assistant-message.tsx
-import { forwardRef as forwardRef20 } from "react";
+import { forwardRef as forwardRef21 } from "react";
 
 // src/ui/branch-picker.tsx
-import { forwardRef as forwardRef19 } from "react";
+import { forwardRef as forwardRef20 } from "react";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
-import { jsx as jsx31, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs6 } from "react/jsx-runtime";
 var useAllowBranchPicker = () => {
   const { branchPicker: { allowBranchPicker = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -4025,9 +4089,9 @@ var BranchPicker = () => {
   const allowBranchPicker = useAllowBranchPicker();
   if (!allowBranchPicker) return null;
   return /* @__PURE__ */ jsxs6(BranchPickerRoot, { hideWhenSingleBranch: true, children: [
-    /* @__PURE__ */ jsx31(BranchPickerPrevious2, {}),
-    /* @__PURE__ */ jsx31(BranchPickerState, {}),
-    /* @__PURE__ */ jsx31(BranchPickerNext, {})
+    /* @__PURE__ */ jsx32(BranchPickerPrevious2, {}),
+    /* @__PURE__ */ jsx32(BranchPickerState, {}),
+    /* @__PURE__ */ jsx32(BranchPickerNext, {})
   ] });
 };
 BranchPicker.displayName = "BranchPicker";
@@ -4035,31 +4099,31 @@ var BranchPickerRoot = withDefaults(branchPicker_exports.Root, {
   className: "aui-branch-picker-root"
 });
 BranchPickerRoot.displayName = "BranchPickerRoot";
-var BranchPickerPrevious2 = forwardRef19((props, ref) => {
+var BranchPickerPrevious2 = forwardRef20((props, ref) => {
   const {
     strings: {
       branchPicker: { previous: { tooltip = "Previous" } = {} } = {}
     } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx31(branchPicker_exports.Previous, { asChild: true, children: /* @__PURE__ */ jsx31(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx31(ChevronLeftIcon, {}) }) });
+  return /* @__PURE__ */ jsx32(branchPicker_exports.Previous, { asChild: true, children: /* @__PURE__ */ jsx32(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx32(ChevronLeftIcon, {}) }) });
 });
 BranchPickerPrevious2.displayName = "BranchPickerPrevious";
 var BranchPickerStateWrapper = withDefaults("span", {
   className: "aui-branch-picker-state"
 });
-var BranchPickerState = forwardRef19((props, ref) => {
+var BranchPickerState = forwardRef20((props, ref) => {
   return /* @__PURE__ */ jsxs6(BranchPickerStateWrapper, { ...props, ref, children: [
-    /* @__PURE__ */ jsx31(branchPicker_exports.Number, {}),
+    /* @__PURE__ */ jsx32(branchPicker_exports.Number, {}),
     " / ",
-    /* @__PURE__ */ jsx31(branchPicker_exports.Count, {})
+    /* @__PURE__ */ jsx32(branchPicker_exports.Count, {})
   ] });
 });
 BranchPickerState.displayName = "BranchPickerState";
-var BranchPickerNext = forwardRef19((props, ref) => {
+var BranchPickerNext = forwardRef20((props, ref) => {
   const {
     strings: { branchPicker: { next: { tooltip = "Next" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx31(branchPicker_exports.Next, { asChild: true, children: /* @__PURE__ */ jsx31(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx31(ChevronRightIcon, {}) }) });
+  return /* @__PURE__ */ jsx32(branchPicker_exports.Next, { asChild: true, children: /* @__PURE__ */ jsx32(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx32(ChevronRightIcon, {}) }) });
 });
 BranchPickerNext.displayName = "BranchPickerNext";
 var exports2 = {
@@ -4071,12 +4135,12 @@ var branch_picker_default = Object.assign(BranchPicker, exports2);
 
 // src/ui/base/avatar.tsx
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
-import { jsx as jsx32, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs7 } from "react/jsx-runtime";
 var Avatar = ({ src, alt, fallback }) => {
   if (src == null && fallback == null) return null;
   return /* @__PURE__ */ jsxs7(AvatarRoot, { children: [
-    src != null && /* @__PURE__ */ jsx32(AvatarImage, { src, alt }),
-    fallback != null && /* @__PURE__ */ jsx32(AvatarFallback, { children: fallback })
+    src != null && /* @__PURE__ */ jsx33(AvatarImage, { src, alt }),
+    fallback != null && /* @__PURE__ */ jsx33(AvatarFallback, { children: fallback })
   ] });
 };
 Avatar.displayName = "Avatar";
@@ -4095,36 +4159,37 @@ AvatarFallback.displayName = "AvatarFallback";
 
 // src/ui/content-part.tsx
 import classNames2 from "classnames";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var Text = ({ status }) => {
-  return /* @__PURE__ */ jsx33(
-    "p",
+import { jsx as jsx34 } from "react/jsx-runtime";
+var Text = () => {
+  const status = useSmoothStatus();
+  return /* @__PURE__ */ jsx34(
+    contentPart_exports.Text,
     {
       className: classNames2(
         "aui-text",
-        status.type === "running" && "aui-text-in-progress"
+        status.type === "running" && "aui-text-running"
       ),
-      children: /* @__PURE__ */ jsx33(contentPart_exports.Text, {})
+      component: "p"
     }
   );
 };
-var exports3 = { Text };
+var exports3 = { Text: withSmoothContextProvider(Text) };
 var content_part_default = exports3;
 
 // src/ui/assistant-message.tsx
-import { jsx as jsx34, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs8 } from "react/jsx-runtime";
 var AssistantMessage = () => {
   return /* @__PURE__ */ jsxs8(AssistantMessageRoot, { children: [
-    /* @__PURE__ */ jsx34(AssistantMessageAvatar, {}),
-    /* @__PURE__ */ jsx34(AssistantMessageContent, {}),
-    /* @__PURE__ */ jsx34(branch_picker_default, {}),
-    /* @__PURE__ */ jsx34(assistant_action_bar_default, {})
+    /* @__PURE__ */ jsx35(AssistantMessageAvatar, {}),
+    /* @__PURE__ */ jsx35(AssistantMessageContent, {}),
+    /* @__PURE__ */ jsx35(branch_picker_default, {}),
+    /* @__PURE__ */ jsx35(assistant_action_bar_default, {})
   ] });
 };
 AssistantMessage.displayName = "AssistantMessage";
 var AssistantMessageAvatar = () => {
   const { assistantAvatar: avatar = { fallback: "A" } } = useThreadConfig();
-  return /* @__PURE__ */ jsx34(Avatar, { ...avatar });
+  return /* @__PURE__ */ jsx35(Avatar, { ...avatar });
 };
 var AssistantMessageRoot = withDefaults(message_exports.Root, {
   className: "aui-assistant-message-root"
@@ -4133,9 +4198,9 @@ AssistantMessageRoot.displayName = "AssistantMessageRoot";
 var AssistantMessageContentWrapper = withDefaults("div", {
   className: "aui-assistant-message-content"
 });
-var AssistantMessageContent = forwardRef20(({ components: componentsProp, ...rest }, ref) => {
+var AssistantMessageContent = forwardRef21(({ components: componentsProp, ...rest }, ref) => {
   const { assistantMessage: { components = {} } = {} } = useThreadConfig();
-  return /* @__PURE__ */ jsx34(AssistantMessageContentWrapper, { ...rest, ref, children: /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsx35(AssistantMessageContentWrapper, { ...rest, ref, children: /* @__PURE__ */ jsx35(
     message_exports.Content,
     {
       components: {
@@ -4157,38 +4222,38 @@ var assistant_message_default = Object.assign(
 );
 
 // src/ui/assistant-modal.tsx
-import { forwardRef as forwardRef27 } from "react";
+import { forwardRef as forwardRef28 } from "react";
 import { BotIcon, ChevronDownIcon } from "lucide-react";
 
 // src/ui/thread.tsx
-import { forwardRef as forwardRef26 } from "react";
+import { forwardRef as forwardRef27 } from "react";
 import { ArrowDownIcon } from "lucide-react";
 
 // src/ui/composer.tsx
-import { forwardRef as forwardRef21 } from "react";
+import { forwardRef as forwardRef22 } from "react";
 import { SendHorizontalIcon } from "lucide-react";
 
 // src/ui/base/CircleStopIcon.tsx
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var CircleStopIcon = () => {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 16 16",
       fill: "currentColor",
-      children: /* @__PURE__ */ jsx35("rect", { width: "10", height: "10", x: "3", y: "3", rx: "2" })
+      children: /* @__PURE__ */ jsx36("rect", { width: "10", height: "10", x: "3", y: "3", rx: "2" })
     }
   );
 };
 CircleStopIcon.displayName = "CircleStopIcon";
 
 // src/ui/composer.tsx
-import { Fragment as Fragment5, jsx as jsx36, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx37, jsxs as jsxs9 } from "react/jsx-runtime";
 var Composer = () => {
   return /* @__PURE__ */ jsxs9(ComposerRoot, { children: [
-    /* @__PURE__ */ jsx36(ComposerInput, { autoFocus: true }),
-    /* @__PURE__ */ jsx36(ComposerAction, {})
+    /* @__PURE__ */ jsx37(ComposerInput, { autoFocus: true }),
+    /* @__PURE__ */ jsx37(ComposerAction, {})
   ] });
 };
 Composer.displayName = "Composer";
@@ -4201,14 +4266,14 @@ var ComposerInputStyled = withDefaults(composer_exports.Input, {
   autoFocus: true,
   className: "aui-composer-input"
 });
-var ComposerInput = forwardRef21(
+var ComposerInput = forwardRef22(
   (props, ref) => {
     const {
       strings: {
         composer: { input: { placeholder = "Write a message..." } = {} } = {}
       } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx36(ComposerInputStyled, { placeholder, ...props, ref });
+    return /* @__PURE__ */ jsx37(ComposerInputStyled, { placeholder, ...props, ref });
   }
 );
 ComposerInput.displayName = "ComposerInput";
@@ -4219,10 +4284,10 @@ var useAllowCancel = () => {
 };
 var ComposerAction = () => {
   const allowCancel = useAllowCancel();
-  if (!allowCancel) return /* @__PURE__ */ jsx36(ComposerSend, {});
+  if (!allowCancel) return /* @__PURE__ */ jsx37(ComposerSend, {});
   return /* @__PURE__ */ jsxs9(Fragment5, { children: [
-    /* @__PURE__ */ jsx36(thread_exports.If, { running: false, children: /* @__PURE__ */ jsx36(ComposerSend, {}) }),
-    /* @__PURE__ */ jsx36(thread_exports.If, { running: true, children: /* @__PURE__ */ jsx36(ComposerCancel, {}) })
+    /* @__PURE__ */ jsx37(thread_exports.If, { running: false, children: /* @__PURE__ */ jsx37(ComposerSend, {}) }),
+    /* @__PURE__ */ jsx37(thread_exports.If, { running: true, children: /* @__PURE__ */ jsx37(ComposerCancel, {}) })
   ] });
 };
 ComposerAction.displayName = "ComposerAction";
@@ -4230,22 +4295,22 @@ var ComposerSendButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-send"
 });
-var ComposerSend = forwardRef21((props, ref) => {
+var ComposerSend = forwardRef22((props, ref) => {
   const {
     strings: { composer: { send: { tooltip = "Send" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx36(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx36(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx36(SendHorizontalIcon, {}) }) });
+  return /* @__PURE__ */ jsx37(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx37(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx37(SendHorizontalIcon, {}) }) });
 });
 ComposerSend.displayName = "ComposerSend";
 var ComposerCancelButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-cancel"
 });
-var ComposerCancel = forwardRef21((props, ref) => {
+var ComposerCancel = forwardRef22((props, ref) => {
   const {
     strings: { composer: { cancel: { tooltip = "Cancel" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx36(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx36(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx36(CircleStopIcon, {}) }) });
+  return /* @__PURE__ */ jsx37(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx37(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx37(CircleStopIcon, {}) }) });
 });
 ComposerCancel.displayName = "ComposerCancel";
 var exports5 = {
@@ -4258,15 +4323,15 @@ var exports5 = {
 var composer_default = Object.assign(Composer, exports5);
 
 // src/ui/thread-welcome.tsx
-import { forwardRef as forwardRef22 } from "react";
-import { jsx as jsx37, jsxs as jsxs10 } from "react/jsx-runtime";
+import { forwardRef as forwardRef23 } from "react";
+import { jsx as jsx38, jsxs as jsxs10 } from "react/jsx-runtime";
 var ThreadWelcome = () => {
   return /* @__PURE__ */ jsxs10(ThreadWelcomeRoot, { children: [
     /* @__PURE__ */ jsxs10(ThreadWelcomeCenter, { children: [
-      /* @__PURE__ */ jsx37(ThreadWelcomeAvatar, {}),
-      /* @__PURE__ */ jsx37(ThreadWelcomeMessage, {})
+      /* @__PURE__ */ jsx38(ThreadWelcomeAvatar, {}),
+      /* @__PURE__ */ jsx38(ThreadWelcomeMessage, {})
     ] }),
-    /* @__PURE__ */ jsx37(ThreadWelcomeSuggestions, {})
+    /* @__PURE__ */ jsx38(ThreadWelcomeSuggestions, {})
   ] });
 };
 ThreadWelcome.displayName = "ThreadWelcome";
@@ -4276,22 +4341,22 @@ var ThreadWelcomeRootStyled = withDefaults("div", {
 var ThreadWelcomeCenter = withDefaults("div", {
   className: "aui-thread-welcome-center"
 });
-var ThreadWelcomeRoot = forwardRef22(
+var ThreadWelcomeRoot = forwardRef23(
   (props, ref) => {
-    return /* @__PURE__ */ jsx37(thread_exports.Empty, { children: /* @__PURE__ */ jsx37(ThreadWelcomeRootStyled, { ...props, ref }) });
+    return /* @__PURE__ */ jsx38(thread_exports.Empty, { children: /* @__PURE__ */ jsx38(ThreadWelcomeRootStyled, { ...props, ref }) });
   }
 );
 ThreadWelcomeRoot.displayName = "ThreadWelcomeRoot";
 var ThreadWelcomeAvatar = () => {
   const { assistantAvatar: avatar = { fallback: "A" } } = useThreadConfig();
-  return /* @__PURE__ */ jsx37(Avatar, { ...avatar });
+  return /* @__PURE__ */ jsx38(Avatar, { ...avatar });
 };
 var ThreadWelcomeMessageStyled = withDefaults("p", {
   className: "aui-thread-welcome-message"
 });
-var ThreadWelcomeMessage = forwardRef22(({ message: messageProp, ...rest }, ref) => {
+var ThreadWelcomeMessage = forwardRef23(({ message: messageProp, ...rest }, ref) => {
   const { welcome: { message = "How can I help you today?" } = {} } = useThreadConfig();
-  return /* @__PURE__ */ jsx37(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
+  return /* @__PURE__ */ jsx38(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
 });
 ThreadWelcomeMessage.displayName = "ThreadWelcomeMessage";
 var ThreadWelcomeSuggestionContainer = withDefaults("div", {
@@ -4303,21 +4368,21 @@ var ThreadWelcomeSuggestionStyled = withDefaults(thread_exports.Suggestion, {
 var ThreadWelcomeSuggestion = ({
   suggestion: { text, prompt }
 }) => {
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx38(
     ThreadWelcomeSuggestionStyled,
     {
       prompt,
       method: "replace",
       autoSend: true,
-      children: /* @__PURE__ */ jsx37("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt })
+      children: /* @__PURE__ */ jsx38("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt })
     }
   );
 };
 var ThreadWelcomeSuggestions = () => {
   const { welcome: { suggestions } = {} } = useThreadConfig();
-  return /* @__PURE__ */ jsx37(ThreadWelcomeSuggestionContainer, { children: suggestions?.map((suggestion, idx) => {
+  return /* @__PURE__ */ jsx38(ThreadWelcomeSuggestionContainer, { children: suggestions?.map((suggestion, idx) => {
     const key = `${suggestion.prompt}-${idx}`;
-    return /* @__PURE__ */ jsx37(ThreadWelcomeSuggestion, { suggestion }, key);
+    return /* @__PURE__ */ jsx38(ThreadWelcomeSuggestion, { suggestion }, key);
   }) });
 };
 ThreadWelcomeSuggestions.displayName = "ThreadWelcomeSuggestions";
@@ -4332,12 +4397,12 @@ var exports6 = {
 var thread_welcome_default = Object.assign(ThreadWelcome, exports6);
 
 // src/ui/user-message.tsx
-import { forwardRef as forwardRef24 } from "react";
+import { forwardRef as forwardRef25 } from "react";
 
 // src/ui/user-action-bar.tsx
-import { forwardRef as forwardRef23 } from "react";
+import { forwardRef as forwardRef24 } from "react";
 import { PencilIcon } from "lucide-react";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 var useAllowEdit = () => {
   const { userMessage: { allowEdit = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -4347,20 +4412,20 @@ var useAllowEdit = () => {
 var UserActionBar = () => {
   const allowEdit = useAllowEdit();
   if (!allowEdit) return null;
-  return /* @__PURE__ */ jsx38(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ jsx38(UserActionBarEdit, {}) });
+  return /* @__PURE__ */ jsx39(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ jsx39(UserActionBarEdit, {}) });
 };
 UserActionBar.displayName = "UserActionBar";
 var UserActionBarRoot = withDefaults(actionBar_exports.Root, {
   className: "aui-user-action-bar-root"
 });
 UserActionBarRoot.displayName = "UserActionBarRoot";
-var UserActionBarEdit = forwardRef23((props, ref) => {
+var UserActionBarEdit = forwardRef24((props, ref) => {
   const {
     strings: { userMessage: { edit: { tooltip = "Edit" } = {} } = {} } = {}
   } = useThreadConfig();
   const allowEdit = useAllowEdit();
   if (!allowEdit) return null;
-  return /* @__PURE__ */ jsx38(actionBar_exports.Edit, { asChild: true, children: /* @__PURE__ */ jsx38(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx38(PencilIcon, {}) }) });
+  return /* @__PURE__ */ jsx39(actionBar_exports.Edit, { asChild: true, children: /* @__PURE__ */ jsx39(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx39(PencilIcon, {}) }) });
 });
 UserActionBarEdit.displayName = "UserActionBarEdit";
 var exports7 = {
@@ -4370,12 +4435,12 @@ var exports7 = {
 var user_action_bar_default = Object.assign(UserActionBar, exports7);
 
 // src/ui/user-message.tsx
-import { jsx as jsx39, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs11 } from "react/jsx-runtime";
 var UserMessage = () => {
   return /* @__PURE__ */ jsxs11(UserMessageRoot, { children: [
-    /* @__PURE__ */ jsx39(user_action_bar_default, {}),
-    /* @__PURE__ */ jsx39(UserMessageContent, {}),
-    /* @__PURE__ */ jsx39(branch_picker_default, {})
+    /* @__PURE__ */ jsx40(user_action_bar_default, {}),
+    /* @__PURE__ */ jsx40(UserMessageContent, {}),
+    /* @__PURE__ */ jsx40(branch_picker_default, {})
   ] });
 };
 UserMessage.displayName = "UserMessage";
@@ -4386,9 +4451,9 @@ UserMessageRoot.displayName = "UserMessageRoot";
 var UserMessageContentWrapper = withDefaults("div", {
   className: "aui-user-message-content"
 });
-var UserMessageContent = forwardRef24(
+var UserMessageContent = forwardRef25(
   ({ components, ...props }, ref) => {
-    return /* @__PURE__ */ jsx39(UserMessageContentWrapper, { ...props, ref, children: /* @__PURE__ */ jsx39(
+    return /* @__PURE__ */ jsx40(UserMessageContentWrapper, { ...props, ref, children: /* @__PURE__ */ jsx40(
       message_exports.Content,
       {
         components: {
@@ -4407,14 +4472,14 @@ var exports8 = {
 var user_message_default = Object.assign(UserMessage, exports8);
 
 // src/ui/edit-composer.tsx
-import { forwardRef as forwardRef25 } from "react";
-import { jsx as jsx40, jsxs as jsxs12 } from "react/jsx-runtime";
+import { forwardRef as forwardRef26 } from "react";
+import { jsx as jsx41, jsxs as jsxs12 } from "react/jsx-runtime";
 var EditComposer = () => {
   return /* @__PURE__ */ jsxs12(EditComposerRoot, { children: [
-    /* @__PURE__ */ jsx40(EditComposerInput, {}),
+    /* @__PURE__ */ jsx41(EditComposerInput, {}),
     /* @__PURE__ */ jsxs12(EditComposerFooter, { children: [
-      /* @__PURE__ */ jsx40(EditComposerCancel, {}),
-      /* @__PURE__ */ jsx40(EditComposerSend, {})
+      /* @__PURE__ */ jsx41(EditComposerCancel, {}),
+      /* @__PURE__ */ jsx41(EditComposerSend, {})
     ] })
   ] });
 };
@@ -4431,23 +4496,23 @@ var EditComposerFooter = withDefaults("div", {
   className: "aui-edit-composer-footer"
 });
 EditComposerFooter.displayName = "EditComposerFooter";
-var EditComposerCancel = forwardRef25(
+var EditComposerCancel = forwardRef26(
   (props, ref) => {
     const {
       strings: {
         editComposer: { cancel: { label = "Cancel" } = {} } = {}
       } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx40(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx40(Button, { variant: "ghost", ...props, ref, children: props.children ?? label }) });
+    return /* @__PURE__ */ jsx41(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx41(Button, { variant: "ghost", ...props, ref, children: props.children ?? label }) });
   }
 );
 EditComposerCancel.displayName = "EditComposerCancel";
-var EditComposerSend = forwardRef25(
+var EditComposerSend = forwardRef26(
   (props, ref) => {
     const {
       strings: { editComposer: { send: { label = "Send" } = {} } = {} } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx40(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx40(Button, { ...props, ref, children: props.children ?? label }) });
+    return /* @__PURE__ */ jsx41(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx41(Button, { ...props, ref, children: props.children ?? label }) });
   }
 );
 EditComposerSend.displayName = "EditComposerSend";
@@ -4461,23 +4526,23 @@ var exports9 = {
 var edit_composer_default = Object.assign(EditComposer, exports9);
 
 // src/ui/thread.tsx
-import { jsx as jsx41, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs13 } from "react/jsx-runtime";
 var Thread = (config) => {
-  return /* @__PURE__ */ jsx41(ThreadRoot, { config, children: /* @__PURE__ */ jsxs13(ThreadViewport, { children: [
-    /* @__PURE__ */ jsx41(thread_welcome_default, {}),
-    /* @__PURE__ */ jsx41(ThreadMessages, {}),
+  return /* @__PURE__ */ jsx42(ThreadRoot, { config, children: /* @__PURE__ */ jsxs13(ThreadViewport, { children: [
+    /* @__PURE__ */ jsx42(thread_welcome_default, {}),
+    /* @__PURE__ */ jsx42(ThreadMessages, {}),
     /* @__PURE__ */ jsxs13(ThreadViewportFooter, { children: [
-      /* @__PURE__ */ jsx41(ThreadScrollToBottom, {}),
-      /* @__PURE__ */ jsx41(composer_default, {})
+      /* @__PURE__ */ jsx42(ThreadScrollToBottom, {}),
+      /* @__PURE__ */ jsx42(composer_default, {})
     ] })
   ] }) });
 };
 var ThreadRootStyled = withDefaults(thread_exports.Root, {
   className: "aui-root aui-thread-root"
 });
-var ThreadRoot = forwardRef26(
+var ThreadRoot = forwardRef27(
   ({ config, ...props }, ref) => {
-    return /* @__PURE__ */ jsx41(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx41(ThreadRootStyled, { ...props, ref }) });
+    return /* @__PURE__ */ jsx42(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx42(ThreadRootStyled, { ...props, ref }) });
   }
 );
 ThreadRoot.displayName = "ThreadRoot";
@@ -4491,7 +4556,7 @@ var ThreadViewportFooter = withDefaults("div", {
 ThreadViewportFooter.displayName = "ThreadViewportFooter";
 var SystemMessage = () => null;
 var ThreadMessages = ({ components, ...rest }) => {
-  return /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsx42(
     thread_exports.Messages,
     {
       components: {
@@ -4509,13 +4574,13 @@ var ThreadScrollToBottomIconButton = withDefaults(TooltipIconButton, {
   variant: "outline",
   className: "aui-thread-scroll-to-bottom"
 });
-var ThreadScrollToBottom = forwardRef26((props, ref) => {
+var ThreadScrollToBottom = forwardRef27((props, ref) => {
   const {
     strings: {
       thread: { scrollToBottom: { tooltip = "Scroll to bottom" } = {} } = {}
     } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx41(thread_exports.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx41(ThreadScrollToBottomIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx41(ArrowDownIcon, {}) }) });
+  return /* @__PURE__ */ jsx42(thread_exports.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx42(ThreadScrollToBottomIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx42(ArrowDownIcon, {}) }) });
 });
 ThreadScrollToBottom.displayName = "ThreadScrollToBottom";
 var exports10 = {
@@ -4528,20 +4593,20 @@ var exports10 = {
 var thread_default = Object.assign(Thread, exports10);
 
 // src/ui/assistant-modal.tsx
-import { Fragment as Fragment6, jsx as jsx42, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx43, jsxs as jsxs14 } from "react/jsx-runtime";
 var AssistantModal = (config) => {
   return /* @__PURE__ */ jsxs14(AssistantModalRoot, { config, children: [
-    /* @__PURE__ */ jsx42(AssistantModalTrigger, {}),
-    /* @__PURE__ */ jsx42(AssistantModalContent, { children: /* @__PURE__ */ jsx42(thread_default, {}) })
+    /* @__PURE__ */ jsx43(AssistantModalTrigger, {}),
+    /* @__PURE__ */ jsx43(AssistantModalContent, { children: /* @__PURE__ */ jsx43(thread_default, {}) })
   ] });
 };
 AssistantModal.displayName = "AssistantModal";
 var AssistantModalRoot = ({ config, ...props }) => {
-  return /* @__PURE__ */ jsx42(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx42(assistantModal_exports.Root, { ...props }) });
+  return /* @__PURE__ */ jsx43(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx43(assistantModal_exports.Root, { ...props }) });
 };
 AssistantModalRoot.displayName = "AssistantModalRoot";
-var AssistantModalTrigger = forwardRef27((props, ref) => {
-  return /* @__PURE__ */ jsx42(AssistantModalAnchor, { children: /* @__PURE__ */ jsx42(assistantModal_exports.Trigger, { asChild: true, children: /* @__PURE__ */ jsx42(AssistantModalButton, { ...props, ref }) }) });
+var AssistantModalTrigger = forwardRef28((props, ref) => {
+  return /* @__PURE__ */ jsx43(AssistantModalAnchor, { children: /* @__PURE__ */ jsx43(assistantModal_exports.Trigger, { asChild: true, children: /* @__PURE__ */ jsx43(AssistantModalButton, { ...props, ref }) }) });
 });
 AssistantModalTrigger.displayName = "AssistantModalTrigger";
 var AssistantModalAnchor = withDefaults(assistantModal_exports.Anchor, {
@@ -4552,7 +4617,7 @@ var ModalButtonStyled = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-modal-button"
 });
-var AssistantModalButton = forwardRef27(({ "data-state": state, ...rest }, ref) => {
+var AssistantModalButton = forwardRef28(({ "data-state": state, ...rest }, ref) => {
   const {
     strings: {
       assistantModal: {
@@ -4566,7 +4631,7 @@ var AssistantModalButton = forwardRef27(({ "data-state": state, ...rest }, ref)
     } = {}
   } = useThreadConfig();
   const tooltip = state === "open" ? openTooltip : closedTooltip;
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx43(
     ModalButtonStyled,
     {
       side: "left",
@@ -4575,14 +4640,14 @@ var AssistantModalButton = forwardRef27(({ "data-state": state, ...rest }, ref)
       ...rest,
       ref,
       children: rest.children ?? /* @__PURE__ */ jsxs14(Fragment6, { children: [
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx43(
           BotIcon,
           {
             "data-state": state,
             className: "aui-modal-button-closed-icon"
           }
         ),
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx43(
           ChevronDownIcon,
           {
             "data-state": state,