@assistant-ui/react 0.5.18 → 0.5.20

package/dist/index.js

@@ -1213,8 +1213,8 @@ var BranchPickerPrimitiveNumber = () => {
 BranchPickerPrimitiveNumber.displayName = "BranchPickerPrimitive.Number";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-var import_react_primitive6 = require("@radix-ui/react-primitive");
-var import_react39 = require("react");
+var import_react_primitive5 = require("@radix-ui/react-primitive");
+var import_react40 = require("react");
 
 // src/primitives/message/index.ts
 var message_exports = {};
@@ -1253,9 +1253,9 @@ var useIsHoveringRef = () => {
   );
   return useManagedRef(callbackRef);
 };
-var MessagePrimitiveRoot = (0, import_react33.forwardRef)(({ onMouseEnter, onMouseLeave, ...rest }, forwardRef28) => {
+var MessagePrimitiveRoot = (0, import_react33.forwardRef)(({ onMouseEnter, onMouseLeave, ...rest }, forwardRef29) => {
   const isHoveringRef = useIsHoveringRef();
-  const ref = (0, import_react_compose_refs.useComposedRefs)(forwardRef28, isHoveringRef);
+  const ref = (0, import_react_compose_refs.useComposedRefs)(forwardRef29, isHoveringRef);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_primitive3.Primitive.div, { ...rest, ref });
 });
 MessagePrimitiveRoot.displayName = "MessagePrimitive.Root";
@@ -1271,7 +1271,7 @@ var MessagePrimitiveIf = ({
 MessagePrimitiveIf.displayName = "MessagePrimitive.If";
 
 // src/primitives/message/MessageContent.tsx
-var import_react38 = require("react");
+var import_react39 = require("react");
 
 // src/context/providers/ContentPartProvider.tsx
 var import_react34 = require("react");
@@ -1317,7 +1317,6 @@ var useContentPartContext2 = (partIndex) => {
     const useContentPart = (0, import_zustand10.create)(
       () => getContentPartState(useMessage.getState(), void 0, partIndex)
     );
-    getContentPartState(useMessage.getState(), useContentPart, partIndex);
     return { useContentPart };
   });
   (0, import_react34.useEffect)(() => {
@@ -1344,11 +1343,51 @@ var ContentPartProvider = ({
 };
 
 // src/primitives/contentPart/ContentPartText.tsx
-var import_react_primitive4 = require("@radix-ui/react-primitive");
+var import_react37 = require("react");
+
+// src/utils/smooth/useSmooth.tsx
 var import_react36 = require("react");
 
-// src/utils/hooks/useSmooth.tsx
+// src/utils/smooth/SmoothContext.tsx
 var import_react35 = require("react");
+var import_zustand11 = require("zustand");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var SmoothContext = (0, import_react35.createContext)(null);
+var makeSmoothContext = (initialState) => {
+  const useSmoothStatus2 = (0, import_zustand11.create)(() => initialState);
+  return { useSmoothStatus: useSmoothStatus2 };
+};
+var SmoothContextProvider = ({ children }) => {
+  const outer = useSmoothContext({ optional: true });
+  const { useContentPart } = useContentPartContext();
+  const [context] = (0, import_react35.useState)(
+    () => makeSmoothContext(useContentPart.getState().status)
+  );
+  if (outer) return children;
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SmoothContext.Provider, { value: context, children });
+};
+var withSmoothContextProvider = (Component) => {
+  const Wrapped = (0, import_react35.forwardRef)((props, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SmoothContextProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Component, { ...props, ref }) });
+  });
+  Wrapped.displayName = Component.displayName;
+  return Wrapped;
+};
+function useSmoothContext(options) {
+  const context = (0, import_react35.useContext)(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/smooth/useSmooth.tsx
+var import_react_use_callback_ref2 = require("@radix-ui/react-use-callback-ref");
 var TextStreamAnimator = class {
   constructor(currentText, setText) {
     this.currentText = currentText;
@@ -1393,22 +1432,33 @@ 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 = (0, import_react35.useRef)(id);
-  const [displayedText, setDisplayedText] = (0, import_react35.useState)(text);
-  const [animatorRef] = (0, import_react35.useState)(
-    new TextStreamAnimator(text, setDisplayedText)
+  const idRef = (0, import_react36.useRef)(id);
+  const [displayedText, setDisplayedText] = (0, import_react36.useState)(text);
+  const setText = (0, import_react_use_callback_ref2.useCallbackRef)((text2) => {
+    setDisplayedText(text2);
+    useSmoothStatus2?.setState(text2 !== state.part.text ? SMOOTH_STATUS : state.status);
+  });
+  const [animatorRef] = (0, import_react36.useState)(
+    new TextStreamAnimator(text, setText)
   );
-  (0, import_react35.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (!smooth) {
       animatorRef.stop();
       return;
     }
     if (idRef.current !== id || !text.startsWith(animatorRef.targetText)) {
       idRef.current = id;
-      setDisplayedText(text);
+      setText(text);
       animatorRef.currentText = text;
       animatorRef.targetText = text;
       animatorRef.stop();
@@ -1416,36 +1466,41 @@ var useSmooth = (text, smooth = false) => {
     }
     animatorRef.targetText = text;
     animatorRef.start();
-  }, [animatorRef, id, smooth, text]);
-  (0, import_react35.useEffect)(() => {
+  }, [setText, animatorRef, id, smooth, text]);
+  (0, import_react36.useEffect)(() => {
     return () => {
       animatorRef.stop();
     };
   }, [animatorRef]);
-  return smooth ? displayedText : text;
+  return (0, import_react36.useMemo)(
+    () => smooth ? {
+      part: { type: "text", text: displayedText },
+      status: text === displayedText ? state.status : SMOOTH_STATUS
+    } : state,
+    [smooth, displayedText, state, text]
+  );
 };
 
 // src/primitives/contentPart/ContentPartText.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var ContentPartPrimitiveText = (0, import_react36.forwardRef)(({ smooth = true, ...rest }, forwardedRef) => {
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var ContentPartPrimitiveText = (0, import_react37.forwardRef)(({ smooth = true, component: Component = "span", ...rest }, forwardedRef) => {
   const {
-    status,
-    part: { text }
-  } = useContentPartText();
-  const smoothText = useSmooth(text, smooth);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_primitive4.Primitive.span, { "data-status": status.type, ...rest, ref: forwardedRef, children: smoothText });
+    part: { text },
+    status
+  } = useSmooth(useContentPartText(), smooth);
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Component, { "data-status": status.type, ...rest, ref: forwardedRef, children: text });
 });
 ContentPartPrimitiveText.displayName = "ContentPartPrimitive.Text";
 
 // src/primitives/contentPart/ContentPartImage.tsx
-var import_react_primitive5 = require("@radix-ui/react-primitive");
-var import_react37 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var ContentPartPrimitiveImage = (0, import_react37.forwardRef)((props, forwardedRef) => {
+var import_react_primitive4 = require("@radix-ui/react-primitive");
+var import_react38 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var ContentPartPrimitiveImage = (0, import_react38.forwardRef)((props, forwardedRef) => {
   const {
     part: { image }
   } = useContentPartImage();
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_primitive5.Primitive.img, { src: image, ...props, ref: forwardedRef });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_primitive4.Primitive.img, { src: image, ...props, ref: forwardedRef });
 });
 ContentPartPrimitiveImage.displayName = "ContentPartPrimitive.Image";
 
@@ -1467,25 +1522,26 @@ var ContentPartPrimitiveInProgress = ({ children }) => {
 ContentPartPrimitiveInProgress.displayName = "ContentPartPrimitive.InProgress";
 
 // src/primitives/message/MessageContent.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var defaultComponents = {
-  Text: () => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("p", { style: { whiteSpace: "pre-line" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ContentPartPrimitiveText, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ContentPartPrimitiveInProgress, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { style: { fontFamily: "revert" }, children: " \u25CF" }) })
+  Text: () => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("p", { style: { whiteSpace: "pre-line" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContentPartPrimitiveText, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContentPartPrimitiveInProgress, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { style: { fontFamily: "revert" }, children: " \u25CF" }) })
   ] }),
-  Image: () => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ContentPartPrimitiveImage, {}),
-  UI: () => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ContentPartPrimitiveDisplay, {}),
+  Image: () => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContentPartPrimitiveImage, {}),
+  UI: () => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContentPartPrimitiveDisplay, {}),
   tools: {
     Fallback: (props) => {
       const { useToolUIs } = useAssistantContext();
       const Render = useToolUIs((s) => s.getToolUI(props.part.toolName));
       if (!Render) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Render, { ...props });
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Render, { ...props });
     }
   }
 };
 var MessageContentPartComponent = ({
   components: {
+    Empty = defaultComponents.Text,
     Text: Text2 = defaultComponents.Text,
     Image: Image2 = defaultComponents.Image,
     UI = defaultComponents.UI,
@@ -1502,15 +1558,16 @@ var MessageContentPartComponent = ({
     case "text":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Text2, { part, status });
+      if (part === EMPTY_CONTENT) return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Empty, { part, status });
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Text2, { part, status });
     case "image":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Image2, { part, status });
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Image2, { part, status });
     case "ui":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UI, { part, status });
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(UI, { part, status });
     case "tool-call": {
       const Tool = by_name[part.toolName] || Fallback2;
       const addResult = (result) => addToolResult({
@@ -1518,7 +1575,7 @@ var MessageContentPartComponent = ({
         toolCallId: part.toolCallId,
         result
       });
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Tool, { part, status, addResult });
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Tool, { part, status, addResult });
     }
     default:
       const unhandledType = type;
@@ -1529,9 +1586,9 @@ var MessageContentPartImpl = ({
   partIndex,
   components
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ContentPartProvider, { partIndex, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(MessageContentPartComponent, { components }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContentPartProvider, { partIndex, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(MessageContentPartComponent, { components }) });
 };
-var MessageContentPart = (0, import_react38.memo)(
+var MessageContentPart = (0, import_react39.memo)(
   MessageContentPartImpl,
   (prev, next) => prev.partIndex === next.partIndex && prev.components?.Text === next.components?.Text && prev.components?.Image === next.components?.Image && prev.components?.UI === next.components?.UI && prev.components?.tools === next.components?.tools
 );
@@ -1542,7 +1599,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__ */ (0, import_jsx_runtime16.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       MessageContentPart,
       {
         partIndex,
@@ -1561,9 +1618,9 @@ var MessagePrimitiveInProgress = () => {
 MessagePrimitiveInProgress.displayName = "MessagePrimitive.InProgress";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var BranchPickerPrimitiveRoot = (0, import_react39.forwardRef)(({ hideWhenSingleBranch, ...rest }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(MessagePrimitiveIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_primitive6.Primitive.div, { ...rest, ref }) });
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var BranchPickerPrimitiveRoot = (0, import_react40.forwardRef)(({ hideWhenSingleBranch, ...rest }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(MessagePrimitiveIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_primitive5.Primitive.div, { ...rest, ref }) });
 });
 BranchPickerPrimitiveRoot.displayName = "BranchPickerPrimitive.Root";
 
@@ -1579,18 +1636,18 @@ __export(composer_exports, {
 
 // src/primitives/composer/ComposerRoot.tsx
 var import_primitive4 = require("@radix-ui/primitive");
-var import_react_primitive7 = require("@radix-ui/react-primitive");
-var import_react40 = require("react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var ComposerPrimitiveRoot = (0, import_react40.forwardRef)(({ onSubmit, ...rest }, forwardedRef) => {
+var import_react_primitive6 = require("@radix-ui/react-primitive");
+var import_react41 = require("react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var ComposerPrimitiveRoot = (0, import_react41.forwardRef)(({ onSubmit, ...rest }, forwardedRef) => {
   const send = useComposerSend();
   const handleSubmit = (e) => {
     e.preventDefault();
     if (!send) return;
     send();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-    import_react_primitive7.Primitive.form,
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    import_react_primitive6.Primitive.form,
     {
       ...rest,
       ref: forwardedRef,
@@ -1604,11 +1661,11 @@ ComposerPrimitiveRoot.displayName = "ComposerPrimitive.Root";
 var import_primitive5 = require("@radix-ui/primitive");
 var import_react_compose_refs2 = require("@radix-ui/react-compose-refs");
 var import_react_slot = require("@radix-ui/react-slot");
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
 var import_react_use_escape_keydown = require("@radix-ui/react-use-escape-keydown");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var ComposerPrimitiveInput = (0, import_react41.forwardRef)(
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var ComposerPrimitiveInput = (0, import_react42.forwardRef)(
   ({
     autoFocus = false,
     asChild,
@@ -1625,7 +1682,7 @@ var ComposerPrimitiveInput = (0, import_react41.forwardRef)(
     });
     const Component = asChild ? import_react_slot.Slot : import_react_textarea_autosize.default;
     const isDisabled = useThread((t) => t.isDisabled) ?? disabledProp ?? false;
-    const textareaRef = (0, import_react41.useRef)(null);
+    const textareaRef = (0, import_react42.useRef)(null);
     const ref = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, textareaRef);
     (0, import_react_use_escape_keydown.useEscapeKeydown)((e) => {
       const composer = useComposer.getState();
@@ -1645,7 +1702,7 @@ var ComposerPrimitiveInput = (0, import_react41.forwardRef)(
       }
     };
     const autoFocusEnabled = autoFocus && !isDisabled;
-    const focus = (0, import_react41.useCallback)(() => {
+    const focus = (0, import_react42.useCallback)(() => {
       const textarea = textareaRef.current;
       if (!textarea || !autoFocusEnabled) return;
       textarea.focus({ preventScroll: true });
@@ -1654,13 +1711,13 @@ var ComposerPrimitiveInput = (0, import_react41.forwardRef)(
         textareaRef.current.value.length
       );
     }, [autoFocusEnabled]);
-    (0, import_react41.useEffect)(() => focus(), [focus]);
+    (0, import_react42.useEffect)(() => focus(), [focus]);
     useOnComposerFocus(() => {
       if (type === "new") {
         focus();
       }
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       Component,
       {
         name: "input",
@@ -1681,14 +1738,14 @@ var ComposerPrimitiveInput = (0, import_react41.forwardRef)(
 ComposerPrimitiveInput.displayName = "ComposerPrimitive.Input";
 
 // src/primitives/composer/ComposerSend.tsx
-var import_react42 = require("react");
-var import_react_primitive8 = require("@radix-ui/react-primitive");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var ComposerPrimitiveSend = (0, import_react42.forwardRef)(({ disabled, ...rest }, ref) => {
+var import_react43 = require("react");
+var import_react_primitive7 = require("@radix-ui/react-primitive");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var ComposerPrimitiveSend = (0, import_react43.forwardRef)(({ disabled, ...rest }, ref) => {
   const { useComposer } = useComposerContext();
   const hasValue = useComposer((c) => c.isEditing && c.value.length > 0);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    import_react_primitive8.Primitive.button,
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    import_react_primitive7.Primitive.button,
     {
       type: "submit",
       ...rest,
@@ -1737,11 +1794,11 @@ __export(thread_exports, {
 });
 
 // src/primitives/thread/ThreadRoot.tsx
-var import_react_primitive9 = require("@radix-ui/react-primitive");
-var import_react43 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var ThreadPrimitiveRoot = (0, import_react43.forwardRef)((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_primitive9.Primitive.div, { ...props, ref });
+var import_react_primitive8 = require("@radix-ui/react-primitive");
+var import_react44 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var ThreadPrimitiveRoot = (0, import_react44.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_primitive8.Primitive.div, { ...props, ref });
 });
 ThreadPrimitiveRoot.displayName = "ThreadPrimitive.Root";
 
@@ -1766,19 +1823,19 @@ ThreadPrimitiveIf.displayName = "ThreadPrimitive.If";
 
 // src/primitives/thread/ThreadViewport.tsx
 var import_react_compose_refs4 = require("@radix-ui/react-compose-refs");
-var import_react_primitive10 = require("@radix-ui/react-primitive");
-var import_react47 = require("react");
+var import_react_primitive9 = require("@radix-ui/react-primitive");
+var import_react48 = require("react");
 
 // src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
 var import_react_compose_refs3 = require("@radix-ui/react-compose-refs");
-var import_react46 = require("react");
+var import_react47 = require("react");
 
 // src/utils/hooks/useOnResizeContent.tsx
-var import_react_use_callback_ref2 = require("@radix-ui/react-use-callback-ref");
-var import_react44 = require("react");
+var import_react_use_callback_ref3 = require("@radix-ui/react-use-callback-ref");
+var import_react45 = require("react");
 var useOnResizeContent = (callback) => {
-  const callbackRef = (0, import_react_use_callback_ref2.useCallbackRef)(callback);
-  const refCallback = (0, import_react44.useCallback)(
+  const callbackRef = (0, import_react_use_callback_ref3.useCallbackRef)(callback);
+  const refCallback = (0, import_react45.useCallback)(
     (el) => {
       const resizeObserver = new ResizeObserver(() => {
         callbackRef();
@@ -1814,12 +1871,12 @@ var useOnResizeContent = (callback) => {
 };
 
 // src/utils/hooks/useOnScrollToBottom.tsx
-var import_react_use_callback_ref3 = require("@radix-ui/react-use-callback-ref");
-var import_react45 = require("react");
+var import_react_use_callback_ref4 = require("@radix-ui/react-use-callback-ref");
+var import_react46 = require("react");
 var useOnScrollToBottom = (callback) => {
-  const callbackRef = (0, import_react_use_callback_ref3.useCallbackRef)(callback);
+  const callbackRef = (0, import_react_use_callback_ref4.useCallbackRef)(callback);
   const { useViewport } = useThreadContext();
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     return useViewport.getState().onScrollToBottom(() => {
       callbackRef();
     });
@@ -1830,10 +1887,10 @@ var useOnScrollToBottom = (callback) => {
 var useThreadViewportAutoScroll = ({
   autoScroll = true
 }) => {
-  const divRef = (0, import_react46.useRef)(null);
+  const divRef = (0, import_react47.useRef)(null);
   const { useViewport } = useThreadContext();
-  const lastScrollTop = (0, import_react46.useRef)(0);
-  const isScrollingToBottomRef = (0, import_react46.useRef)(false);
+  const lastScrollTop = (0, import_react47.useRef)(0);
+  const isScrollingToBottomRef = (0, import_react47.useRef)(false);
   const scrollToBottom = (behavior) => {
     const div = divRef.current;
     if (!div || !autoScroll) return;
@@ -1878,29 +1935,29 @@ var useThreadViewportAutoScroll = ({
 };
 
 // src/primitives/thread/ThreadViewport.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var ThreadPrimitiveViewport = (0, import_react47.forwardRef)(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var ThreadPrimitiveViewport = (0, import_react48.forwardRef)(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
   const autoScrollRef = useThreadViewportAutoScroll({
     autoScroll
   });
   const ref = (0, import_react_compose_refs4.useComposedRefs)(forwardedRef, autoScrollRef);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_primitive10.Primitive.div, { ...rest, ref, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_primitive9.Primitive.div, { ...rest, ref, children });
 });
 ThreadPrimitiveViewport.displayName = "ThreadPrimitive.Viewport";
 
 // src/primitives/thread/ThreadMessages.tsx
-var import_react49 = require("react");
+var import_react50 = require("react");
 
 // src/context/providers/MessageProvider.tsx
-var import_react48 = require("react");
-var import_zustand13 = require("zustand");
+var import_react49 = require("react");
+var import_zustand14 = require("zustand");
 
 // src/context/stores/EditComposer.ts
-var import_zustand11 = require("zustand");
+var import_zustand12 = require("zustand");
 var makeEditComposerStore = ({
   onEdit,
   onSend
-}) => (0, import_zustand11.create)()((set, get, store) => ({
+}) => (0, import_zustand12.create)()((set, get, store) => ({
   ...makeBaseComposer(set, get, store),
   canCancel: false,
   isEditing: false,
@@ -1919,8 +1976,8 @@ var makeEditComposerStore = ({
 }));
 
 // src/context/stores/MessageUtils.ts
-var import_zustand12 = require("zustand");
-var makeMessageUtilsStore = () => (0, import_zustand12.create)((set) => ({
+var import_zustand13 = require("zustand");
+var makeMessageUtilsStore = () => (0, import_zustand13.create)((set) => ({
   isCopied: false,
   setIsCopied: (value) => {
     set({ isCopied: value });
@@ -1932,7 +1989,7 @@ var makeMessageUtilsStore = () => (0, import_zustand12.create)((set) => ({
 }));
 
 // src/context/providers/MessageProvider.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var getIsLast = (messages, message) => {
   return messages[messages.length - 1]?.id === message.id;
 };
@@ -1954,8 +2011,8 @@ var getMessageState = (messages, getBranches, useMessage, messageIndex) => {
 };
 var useMessageContext2 = (messageIndex) => {
   const { useThreadMessages, useThreadActions } = useThreadContext();
-  const [context] = (0, import_react48.useState)(() => {
-    const useMessage = (0, import_zustand13.create)(
+  const [context] = (0, import_react49.useState)(() => {
+    const useMessage = (0, import_zustand14.create)(
       () => getMessageState(
         useThreadMessages.getState(),
         useThreadActions.getState().getBranches,
@@ -1992,7 +2049,7 @@ var useMessageContext2 = (messageIndex) => {
     });
     return { useMessage, useMessageUtils, useEditComposer };
   });
-  (0, import_react48.useEffect)(() => {
+  (0, import_react49.useEffect)(() => {
     const syncMessage = (thread) => {
       const newState = getMessageState(
         thread,
@@ -2016,11 +2073,11 @@ var MessageProvider = ({
   children
 }) => {
   const context = useMessageContext2(messageIndex);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(MessageContext.Provider, { value: context, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MessageContext.Provider, { value: context, children });
 };
 
 // src/primitives/thread/ThreadMessages.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var DEFAULT_SYSTEM_MESSAGE = () => null;
 var getComponents = (components) => {
   return {
@@ -2035,16 +2092,16 @@ var ThreadMessageImpl = ({
   components
 }) => {
   const { UserMessage: UserMessage2, EditComposer: EditComposer2, AssistantMessage: AssistantMessage2, SystemMessage: SystemMessage2 } = getComponents(components);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(MessageProvider, { messageIndex, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(MessagePrimitiveIf, { user: true, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ComposerPrimitiveIf, { editing: false, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(UserMessage2, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ComposerPrimitiveIf, { editing: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(EditComposer2, {}) })
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(MessageProvider, { messageIndex, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(MessagePrimitiveIf, { user: true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ComposerPrimitiveIf, { editing: false, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(UserMessage2, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ComposerPrimitiveIf, { editing: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(EditComposer2, {}) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MessagePrimitiveIf, { assistant: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(AssistantMessage2, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MessagePrimitiveIf, { system: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SystemMessage2, {}) })
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MessagePrimitiveIf, { assistant: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(AssistantMessage2, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MessagePrimitiveIf, { system: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SystemMessage2, {}) })
   ] });
 };
-var ThreadMessage = (0, import_react49.memo)(
+var ThreadMessage = (0, import_react50.memo)(
   ThreadMessageImpl,
   (prev, next) => prev.messageIndex === next.messageIndex && prev.components.Message === next.components.Message && prev.components.UserMessage === next.components.UserMessage && prev.components.EditComposer === next.components.EditComposer && prev.components.AssistantMessage === next.components.AssistantMessage && prev.components.SystemMessage === next.components.SystemMessage
 );
@@ -2056,7 +2113,7 @@ var ThreadPrimitiveMessagesImpl = ({
   if (messagesLength === 0) return null;
   return new Array(messagesLength).fill(null).map((_, idx) => {
     const messageIndex = idx;
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       ThreadMessage,
       {
         messageIndex,
@@ -2067,7 +2124,7 @@ var ThreadPrimitiveMessagesImpl = ({
   });
 };
 ThreadPrimitiveMessagesImpl.displayName = "ThreadPrimitive.Messages";
-var ThreadPrimitiveMessages = (0, import_react49.memo)(
+var ThreadPrimitiveMessages = (0, import_react50.memo)(
   ThreadPrimitiveMessagesImpl,
   (prev, next) => prev.components?.Message === next.components?.Message && prev.components?.UserMessage === next.components?.UserMessage && prev.components?.EditComposer === next.components?.EditComposer && prev.components?.AssistantMessage === next.components?.AssistantMessage && prev.components?.SystemMessage === next.components?.SystemMessage
 );
@@ -2086,7 +2143,7 @@ var ThreadPrimitiveSuggestion = createActionButton(
 );
 
 // src/runtimes/local/useLocalRuntime.tsx
-var import_react54 = require("react");
+var import_react55 = require("react");
 
 // src/runtimes/core/BaseAssistantRuntime.tsx
 var BaseAssistantRuntime = class {
@@ -2119,7 +2176,9 @@ __export(internal_exports, {
   ProxyConfigProvider: () => ProxyConfigProvider,
   TooltipIconButton: () => TooltipIconButton,
   generateId: () => generateId,
-  useSmooth: () => useSmooth
+  useSmooth: () => useSmooth,
+  useSmoothStatus: () => useSmoothStatus,
+  withSmoothContextProvider: () => withSmoothContextProvider
 });
 
 // src/utils/idUtils.tsx
@@ -2343,15 +2402,15 @@ var MessageRepository = class {
 };
 
 // src/ui/base/tooltip-icon-button.tsx
-var import_react52 = require("react");
+var import_react53 = require("react");
 
 // src/ui/base/tooltip.tsx
 var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
 
 // src/ui/utils/withDefaults.tsx
-var import_react50 = require("react");
+var import_react51 = require("react");
 var import_classnames = __toESM(require("classnames"));
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var withDefaultProps = ({
   className,
   ...defaultProps
@@ -2364,10 +2423,10 @@ var withDefaultProps = ({
 };
 var withDefaults = (Component, defaultProps) => {
   const getProps = withDefaultProps(defaultProps);
-  const WithDefaults = (0, import_react50.forwardRef)(
+  const WithDefaults = (0, import_react51.forwardRef)(
     (props, ref) => {
       const ComponentAsAny = Component;
-      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ComponentAsAny, { ...getProps(props), ref });
+      return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ComponentAsAny, { ...getProps(props), ref });
     }
   );
   WithDefaults.displayName = "withDefaults(" + (typeof Component === "string" ? Component : Component.displayName) + ")";
@@ -2375,9 +2434,9 @@ var withDefaults = (Component, defaultProps) => {
 };
 
 // src/ui/base/tooltip.tsx
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var Tooltip = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipPrimitive.Provider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipPrimitive.Root, { ...props }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipPrimitive.Provider, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipPrimitive.Root, { ...props }) });
 };
 Tooltip.displayName = "Tooltip";
 var TooltipTrigger = TooltipPrimitive.Trigger;
@@ -2389,9 +2448,9 @@ TooltipContent.displayName = "TooltipContent";
 
 // src/ui/base/button.tsx
 var import_class_variance_authority = require("class-variance-authority");
-var import_react_primitive11 = require("@radix-ui/react-primitive");
-var import_react51 = require("react");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_react_primitive10 = require("@radix-ui/react-primitive");
+var import_react52 = require("react");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority.cva)("aui-button", {
   variants: {
     variant: {
@@ -2409,10 +2468,10 @@ var buttonVariants = (0, import_class_variance_authority.cva)("aui-button", {
     size: "default"
   }
 });
-var Button = (0, import_react51.forwardRef)(
+var Button = (0, import_react52.forwardRef)(
   ({ className, variant, size, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-      import_react_primitive11.Primitive.button,
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      import_react_primitive10.Primitive.button,
       {
         className: buttonVariants({ variant, size, className }),
         ...props,
@@ -2424,14 +2483,14 @@ var Button = (0, import_react51.forwardRef)(
 Button.displayName = "Button";
 
 // src/ui/base/tooltip-icon-button.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
-var TooltipIconButton = (0, import_react52.forwardRef)(({ children, tooltip, side = "bottom", ...rest }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Tooltip, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Button, { variant: "ghost", size: "icon", ...rest, ref, children: [
+var import_jsx_runtime29 = require("react/jsx-runtime");
+var TooltipIconButton = (0, import_react53.forwardRef)(({ children, tooltip, side = "bottom", ...rest }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Tooltip, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Button, { variant: "ghost", size: "icon", ...rest, ref, children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "aui-sr-only", children: tooltip })
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "aui-sr-only", children: tooltip })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TooltipContent, { side, children: tooltip })
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TooltipContent, { side, children: tooltip })
   ] });
 });
 TooltipIconButton.displayName = "TooltipIconButton";
@@ -2721,7 +2780,7 @@ var toLanguageModelTools = (tools) => {
 };
 
 // src/runtimes/edge/useEdgeRuntime.ts
-var import_react53 = require("react");
+var import_react54 = require("react");
 
 // src/runtimes/edge/streams/assistantDecoderStream.ts
 function assistantDecoderStream() {
@@ -3461,7 +3520,7 @@ var useEdgeRuntime = ({
   initialMessages,
   ...options
 }) => {
-  const [adapter] = (0, import_react53.useState)(() => new EdgeChatAdapter(options));
+  const [adapter] = (0, import_react54.useState)(() => new EdgeChatAdapter(options));
   return useLocalRuntime(adapter, { initialMessages });
 };
 
@@ -3675,15 +3734,15 @@ var LocalRuntime = class extends BaseAssistantRuntime {
 
 // src/runtimes/local/useLocalRuntime.tsx
 var useLocalRuntime = (adapter, options) => {
-  const [runtime] = (0, import_react54.useState)(() => new LocalRuntime(adapter, options));
-  (0, import_react54.useInsertionEffect)(() => {
+  const [runtime] = (0, import_react55.useState)(() => new LocalRuntime(adapter, options));
+  (0, import_react55.useInsertionEffect)(() => {
     runtime.adapter = adapter;
   });
   return runtime;
 };
 
 // src/runtimes/external-store/ExternalStoreThreadRuntime.tsx
-var import_zustand14 = require("zustand");
+var import_zustand15 = require("zustand");
 
 // src/runtimes/external-store/getExternalStoreMessage.tsx
 var symbolInnerMessage = Symbol("innerMessage");
@@ -3692,7 +3751,7 @@ var getExternalStoreMessage = (message) => {
 };
 
 // src/runtimes/external-store/useExternalStoreSync.tsx
-var import_react55 = require("react");
+var import_react56 = require("react");
 
 // src/runtimes/external-store/ThreadMessageConverter.ts
 var ThreadMessageConverter = class {
@@ -3786,11 +3845,11 @@ var fromThreadMessageLike = (like, fallbackId, fallbackStatus) => {
 
 // src/runtimes/external-store/useExternalStoreSync.tsx
 var useExternalStoreSync = (adapter, updateData) => {
-  const adapterRef = (0, import_react55.useRef)(adapter);
-  (0, import_react55.useInsertionEffect)(() => {
+  const adapterRef = (0, import_react56.useRef)(adapter);
+  (0, import_react56.useInsertionEffect)(() => {
     adapterRef.current = adapter;
   });
-  const [converter, convertCallback] = (0, import_react55.useMemo)(() => {
+  const [converter, convertCallback] = (0, import_react56.useMemo)(() => {
     const converter2 = adapter.convertMessage ?? ((m) => m);
     const convertCallback2 = (cache, m, idx) => {
       const autoStatus = getAutoStatus(
@@ -3809,7 +3868,7 @@ var useExternalStoreSync = (adapter, updateData) => {
     };
     return [new ThreadMessageConverter(), convertCallback2];
   }, [adapter.convertMessage]);
-  (0, import_react55.useEffect)(() => {
+  (0, import_react56.useEffect)(() => {
     updateData(
       adapter.isDisabled ?? false,
       adapter.isRunning ?? false,
@@ -3837,7 +3896,7 @@ var ExternalStoreThreadRuntime = class {
       store.isRunning ?? false,
       store.messages
     );
-    this.useStore = (0, import_zustand14.create)(() => ({
+    this.useStore = (0, import_zustand15.create)(() => ({
       store
     }));
   }
@@ -3978,45 +4037,45 @@ var ExternalStoreRuntime = class extends BaseAssistantRuntime {
 };
 
 // src/runtimes/external-store/useExternalStoreRuntime.tsx
-var import_react56 = require("react");
+var import_react57 = require("react");
 var useExternalStoreRuntime = (store) => {
-  const [runtime] = (0, import_react56.useState)(() => new ExternalStoreRuntime(store));
-  (0, import_react56.useInsertionEffect)(() => {
+  const [runtime] = (0, import_react57.useState)(() => new ExternalStoreRuntime(store));
+  (0, import_react57.useInsertionEffect)(() => {
     runtime.store = store;
   });
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     runtime.onStoreUpdated();
   });
   return runtime;
 };
 
 // src/ui/thread-config.tsx
-var import_react57 = require("react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
-var ThreadConfigContext = (0, import_react57.createContext)({});
+var import_react58 = require("react");
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var ThreadConfigContext = (0, import_react58.createContext)({});
 var useThreadConfig = () => {
-  return (0, import_react57.useContext)(ThreadConfigContext);
+  return (0, import_react58.useContext)(ThreadConfigContext);
 };
 var ThreadConfigProvider = ({
   children,
   config
 }) => {
   const assistant = useAssistantContext({ optional: true });
-  const configProvider = config && Object.keys(config ?? {}).length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ThreadConfigContext.Provider, { value: config, children }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children });
+  const configProvider = config && Object.keys(config ?? {}).length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ThreadConfigContext.Provider, { value: config, children }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { 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__ */ (0, import_jsx_runtime29.jsx)(AssistantRuntimeProvider, { runtime: config.runtime, children: configProvider });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AssistantRuntimeProvider, { runtime: config.runtime, children: configProvider });
 };
 ThreadConfigProvider.displayName = "ThreadConfigProvider";
 
 // src/ui/assistant-action-bar.tsx
-var import_react58 = require("react");
+var import_react59 = require("react");
 var import_lucide_react = require("lucide-react");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var useAllowCopy = () => {
   const { assistantMessage: { allowCopy = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -4033,15 +4092,15 @@ var AssistantActionBar = () => {
   const allowCopy = useAllowCopy();
   const allowReload = useAllowReload();
   if (!allowCopy && !allowReload) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
     AssistantActionBarRoot,
     {
       hideWhenRunning: true,
       autohide: "not-last",
       autohideFloat: "single-branch",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AssistantActionBarCopy, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AssistantActionBarReload, {})
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(AssistantActionBarCopy, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(AssistantActionBarReload, {})
       ]
     }
   );
@@ -4051,7 +4110,7 @@ var AssistantActionBarRoot = withDefaults(actionBar_exports.Root, {
   className: "aui-assistant-action-bar-root"
 });
 AssistantActionBarRoot.displayName = "AssistantActionBarRoot";
-var AssistantActionBarCopy = (0, import_react58.forwardRef)((props, ref) => {
+var AssistantActionBarCopy = (0, import_react59.forwardRef)((props, ref) => {
   const {
     strings: {
       assistantMessage: { reload: { tooltip = "Copy" } = {} } = {}
@@ -4059,13 +4118,13 @@ var AssistantActionBarCopy = (0, import_react58.forwardRef)((props, ref) => {
   } = useThreadConfig();
   const allowCopy = useAllowCopy();
   if (!allowCopy) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(actionBar_exports.Copy, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(message_exports.If, { copied: true, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react.CheckIcon, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(message_exports.If, { copied: false, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react.CopyIcon, {}) })
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(actionBar_exports.Copy, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(message_exports.If, { copied: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react.CheckIcon, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(message_exports.If, { copied: false, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react.CopyIcon, {}) })
   ] }) }) });
 });
 AssistantActionBarCopy.displayName = "AssistantActionBarCopy";
-var AssistantActionBarReload = (0, import_react58.forwardRef)((props, ref) => {
+var AssistantActionBarReload = (0, import_react59.forwardRef)((props, ref) => {
   const {
     strings: {
       assistantMessage: { reload: { tooltip = "Refresh" } = {} } = {}
@@ -4073,7 +4132,7 @@ var AssistantActionBarReload = (0, import_react58.forwardRef)((props, ref) => {
   } = useThreadConfig();
   const allowReload = useAllowReload();
   if (!allowReload) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(actionBar_exports.Reload, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react.RefreshCwIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(actionBar_exports.Reload, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react.RefreshCwIcon, {}) }) });
 });
 AssistantActionBarReload.displayName = "AssistantActionBarReload";
 var exports2 = {
@@ -4087,12 +4146,12 @@ var assistant_action_bar_default = Object.assign(
 );
 
 // src/ui/assistant-message.tsx
-var import_react60 = require("react");
+var import_react61 = require("react");
 
 // src/ui/branch-picker.tsx
-var import_react59 = require("react");
+var import_react60 = require("react");
 var import_lucide_react2 = require("lucide-react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var useAllowBranchPicker = () => {
   const { branchPicker: { allowBranchPicker = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -4102,10 +4161,10 @@ var useAllowBranchPicker = () => {
 var BranchPicker = () => {
   const allowBranchPicker = useAllowBranchPicker();
   if (!allowBranchPicker) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(BranchPickerRoot, { hideWhenSingleBranch: true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(BranchPickerPrevious2, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(BranchPickerState, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(BranchPickerNext, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(BranchPickerRoot, { hideWhenSingleBranch: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(BranchPickerPrevious2, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(BranchPickerState, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(BranchPickerNext, {})
   ] });
 };
 BranchPicker.displayName = "BranchPicker";
@@ -4113,31 +4172,31 @@ var BranchPickerRoot = withDefaults(branchPicker_exports.Root, {
   className: "aui-branch-picker-root"
 });
 BranchPickerRoot.displayName = "BranchPickerRoot";
-var BranchPickerPrevious2 = (0, import_react59.forwardRef)((props, ref) => {
+var BranchPickerPrevious2 = (0, import_react60.forwardRef)((props, ref) => {
   const {
     strings: {
       branchPicker: { previous: { tooltip = "Previous" } = {} } = {}
     } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(branchPicker_exports.Previous, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react2.ChevronLeftIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(branchPicker_exports.Previous, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react2.ChevronLeftIcon, {}) }) });
 });
 BranchPickerPrevious2.displayName = "BranchPickerPrevious";
 var BranchPickerStateWrapper = withDefaults("span", {
   className: "aui-branch-picker-state"
 });
-var BranchPickerState = (0, import_react59.forwardRef)((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(BranchPickerStateWrapper, { ...props, ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(branchPicker_exports.Number, {}),
+var BranchPickerState = (0, import_react60.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(BranchPickerStateWrapper, { ...props, ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(branchPicker_exports.Number, {}),
     " / ",
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(branchPicker_exports.Count, {})
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(branchPicker_exports.Count, {})
   ] });
 });
 BranchPickerState.displayName = "BranchPickerState";
-var BranchPickerNext = (0, import_react59.forwardRef)((props, ref) => {
+var BranchPickerNext = (0, import_react60.forwardRef)((props, ref) => {
   const {
     strings: { branchPicker: { next: { tooltip = "Next" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(branchPicker_exports.Next, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react2.ChevronRightIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(branchPicker_exports.Next, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react2.ChevronRightIcon, {}) }) });
 });
 BranchPickerNext.displayName = "BranchPickerNext";
 var exports3 = {
@@ -4149,12 +4208,12 @@ var branch_picker_default = Object.assign(BranchPicker, exports3);
 
 // src/ui/base/avatar.tsx
 var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"));
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var Avatar = ({ src, alt, fallback }) => {
   if (src == null && fallback == null) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(AvatarRoot, { children: [
-    src != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AvatarImage, { src, alt }),
-    fallback != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AvatarFallback, { children: fallback })
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(AvatarRoot, { children: [
+    src != null && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AvatarImage, { src, alt }),
+    fallback != null && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AvatarFallback, { children: fallback })
   ] });
 };
 Avatar.displayName = "Avatar";
@@ -4173,36 +4232,37 @@ AvatarFallback.displayName = "AvatarFallback";
 
 // src/ui/content-part.tsx
 var import_classnames2 = __toESM(require("classnames"));
-var import_jsx_runtime33 = require("react/jsx-runtime");
-var Text = ({ status }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-    "p",
+var import_jsx_runtime34 = require("react/jsx-runtime");
+var Text = () => {
+  const status = useSmoothStatus();
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    contentPart_exports.Text,
     {
       className: (0, import_classnames2.default)(
         "aui-text",
-        status.type === "running" && "aui-text-in-progress"
+        status.type === "running" && "aui-text-running"
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(contentPart_exports.Text, {})
+      component: "p"
     }
   );
 };
-var exports4 = { Text };
+var exports4 = { Text: withSmoothContextProvider(Text) };
 var content_part_default = exports4;
 
 // src/ui/assistant-message.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var AssistantMessage = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(AssistantMessageRoot, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(AssistantMessageAvatar, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(AssistantMessageContent, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(branch_picker_default, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(assistant_action_bar_default, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(AssistantMessageRoot, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AssistantMessageAvatar, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AssistantMessageContent, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(branch_picker_default, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(assistant_action_bar_default, {})
   ] });
 };
 AssistantMessage.displayName = "AssistantMessage";
 var AssistantMessageAvatar = () => {
   const { assistantAvatar: avatar = { fallback: "A" } } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Avatar, { ...avatar });
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Avatar, { ...avatar });
 };
 var AssistantMessageRoot = withDefaults(message_exports.Root, {
   className: "aui-assistant-message-root"
@@ -4211,9 +4271,9 @@ AssistantMessageRoot.displayName = "AssistantMessageRoot";
 var AssistantMessageContentWrapper = withDefaults("div", {
   className: "aui-assistant-message-content"
 });
-var AssistantMessageContent = (0, import_react60.forwardRef)(({ components: componentsProp, ...rest }, ref) => {
+var AssistantMessageContent = (0, import_react61.forwardRef)(({ components: componentsProp, ...rest }, ref) => {
   const { assistantMessage: { components = {} } = {} } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(AssistantMessageContentWrapper, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AssistantMessageContentWrapper, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
     message_exports.Content,
     {
       components: {
@@ -4235,38 +4295,38 @@ var assistant_message_default = Object.assign(
 );
 
 // src/ui/assistant-modal.tsx
-var import_react67 = require("react");
+var import_react68 = require("react");
 var import_lucide_react6 = require("lucide-react");
 
 // src/ui/thread.tsx
-var import_react66 = require("react");
+var import_react67 = require("react");
 var import_lucide_react5 = require("lucide-react");
 
 // src/ui/composer.tsx
-var import_react61 = require("react");
+var import_react62 = require("react");
 var import_lucide_react3 = require("lucide-react");
 
 // src/ui/base/CircleStopIcon.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var CircleStopIcon = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 16 16",
       fill: "currentColor",
-      children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("rect", { width: "10", height: "10", x: "3", y: "3", rx: "2" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("rect", { width: "10", height: "10", x: "3", y: "3", rx: "2" })
     }
   );
 };
 CircleStopIcon.displayName = "CircleStopIcon";
 
 // src/ui/composer.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var Composer = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(ComposerRoot, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerInput, { autoFocus: true }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerAction, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(ComposerRoot, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerInput, { autoFocus: true }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerAction, {})
   ] });
 };
 Composer.displayName = "Composer";
@@ -4279,14 +4339,14 @@ var ComposerInputStyled = withDefaults(composer_exports.Input, {
   autoFocus: true,
   className: "aui-composer-input"
 });
-var ComposerInput = (0, import_react61.forwardRef)(
+var ComposerInput = (0, import_react62.forwardRef)(
   (props, ref) => {
     const {
       strings: {
         composer: { input: { placeholder = "Write a message..." } = {} } = {}
       } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerInputStyled, { placeholder, ...props, ref });
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerInputStyled, { placeholder, ...props, ref });
   }
 );
 ComposerInput.displayName = "ComposerInput";
@@ -4297,10 +4357,10 @@ var useAllowCancel = () => {
 };
 var ComposerAction = () => {
   const allowCancel = useAllowCancel();
-  if (!allowCancel) return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerSend, {});
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(thread_exports.If, { running: false, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerSend, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(thread_exports.If, { running: true, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerCancel, {}) })
+  if (!allowCancel) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerSend, {});
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(thread_exports.If, { running: false, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerSend, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(thread_exports.If, { running: true, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerCancel, {}) })
   ] });
 };
 ComposerAction.displayName = "ComposerAction";
@@ -4308,22 +4368,22 @@ var ComposerSendButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-send"
 });
-var ComposerSend = (0, import_react61.forwardRef)((props, ref) => {
+var ComposerSend = (0, import_react62.forwardRef)((props, ref) => {
   const {
     strings: { composer: { send: { tooltip = "Send" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react3.SendHorizontalIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react3.SendHorizontalIcon, {}) }) });
 });
 ComposerSend.displayName = "ComposerSend";
 var ComposerCancelButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-cancel"
 });
-var ComposerCancel = (0, import_react61.forwardRef)((props, ref) => {
+var ComposerCancel = (0, import_react62.forwardRef)((props, ref) => {
   const {
     strings: { composer: { cancel: { tooltip = "Cancel" } = {} } = {} } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(CircleStopIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(CircleStopIcon, {}) }) });
 });
 ComposerCancel.displayName = "ComposerCancel";
 var exports6 = {
@@ -4336,15 +4396,15 @@ var exports6 = {
 var composer_default = Object.assign(Composer, exports6);
 
 // src/ui/thread-welcome.tsx
-var import_react62 = require("react");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_react63 = require("react");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var ThreadWelcome = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(ThreadWelcomeRoot, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(ThreadWelcomeCenter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeAvatar, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeMessage, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(ThreadWelcomeRoot, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(ThreadWelcomeCenter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeAvatar, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeMessage, {})
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeSuggestions, {})
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeSuggestions, {})
   ] });
 };
 ThreadWelcome.displayName = "ThreadWelcome";
@@ -4354,22 +4414,22 @@ var ThreadWelcomeRootStyled = withDefaults("div", {
 var ThreadWelcomeCenter = withDefaults("div", {
   className: "aui-thread-welcome-center"
 });
-var ThreadWelcomeRoot = (0, import_react62.forwardRef)(
+var ThreadWelcomeRoot = (0, import_react63.forwardRef)(
   (props, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(thread_exports.Empty, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeRootStyled, { ...props, ref }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(thread_exports.Empty, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeRootStyled, { ...props, ref }) });
   }
 );
 ThreadWelcomeRoot.displayName = "ThreadWelcomeRoot";
 var ThreadWelcomeAvatar = () => {
   const { assistantAvatar: avatar = { fallback: "A" } } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Avatar, { ...avatar });
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Avatar, { ...avatar });
 };
 var ThreadWelcomeMessageStyled = withDefaults("p", {
   className: "aui-thread-welcome-message"
 });
-var ThreadWelcomeMessage = (0, import_react62.forwardRef)(({ message: messageProp, ...rest }, ref) => {
+var ThreadWelcomeMessage = (0, import_react63.forwardRef)(({ message: messageProp, ...rest }, ref) => {
   const { welcome: { message = "How can I help you today?" } = {} } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
 });
 ThreadWelcomeMessage.displayName = "ThreadWelcomeMessage";
 var ThreadWelcomeSuggestionContainer = withDefaults("div", {
@@ -4381,21 +4441,21 @@ var ThreadWelcomeSuggestionStyled = withDefaults(thread_exports.Suggestion, {
 var ThreadWelcomeSuggestion = ({
   suggestion: { text, prompt }
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     ThreadWelcomeSuggestionStyled,
     {
       prompt,
       method: "replace",
       autoSend: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt })
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt })
     }
   );
 };
 var ThreadWelcomeSuggestions = () => {
   const { welcome: { suggestions } = {} } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeSuggestionContainer, { children: suggestions?.map((suggestion, idx) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeSuggestionContainer, { children: suggestions?.map((suggestion, idx) => {
     const key = `${suggestion.prompt}-${idx}`;
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThreadWelcomeSuggestion, { suggestion }, key);
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThreadWelcomeSuggestion, { suggestion }, key);
   }) });
 };
 ThreadWelcomeSuggestions.displayName = "ThreadWelcomeSuggestions";
@@ -4410,12 +4470,12 @@ var exports7 = {
 var thread_welcome_default = Object.assign(ThreadWelcome, exports7);
 
 // src/ui/user-message.tsx
-var import_react64 = require("react");
+var import_react65 = require("react");
 
 // src/ui/user-action-bar.tsx
-var import_react63 = require("react");
+var import_react64 = require("react");
 var import_lucide_react4 = require("lucide-react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var useAllowEdit = () => {
   const { userMessage: { allowEdit = true } = {} } = useThreadConfig();
   const { useThreadActions } = useThreadContext();
@@ -4425,20 +4485,20 @@ var useAllowEdit = () => {
 var UserActionBar = () => {
   const allowEdit = useAllowEdit();
   if (!allowEdit) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(UserActionBarEdit, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(UserActionBarEdit, {}) });
 };
 UserActionBar.displayName = "UserActionBar";
 var UserActionBarRoot = withDefaults(actionBar_exports.Root, {
   className: "aui-user-action-bar-root"
 });
 UserActionBarRoot.displayName = "UserActionBarRoot";
-var UserActionBarEdit = (0, import_react63.forwardRef)((props, ref) => {
+var UserActionBarEdit = (0, import_react64.forwardRef)((props, ref) => {
   const {
     strings: { userMessage: { edit: { tooltip = "Edit" } = {} } = {} } = {}
   } = useThreadConfig();
   const allowEdit = useAllowEdit();
   if (!allowEdit) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(actionBar_exports.Edit, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react4.PencilIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(actionBar_exports.Edit, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react4.PencilIcon, {}) }) });
 });
 UserActionBarEdit.displayName = "UserActionBarEdit";
 var exports8 = {
@@ -4448,12 +4508,12 @@ var exports8 = {
 var user_action_bar_default = Object.assign(UserActionBar, exports8);
 
 // src/ui/user-message.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var UserMessage = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(UserMessageRoot, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(user_action_bar_default, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(UserMessageContent, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(branch_picker_default, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(UserMessageRoot, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(user_action_bar_default, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(UserMessageContent, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(branch_picker_default, {})
   ] });
 };
 UserMessage.displayName = "UserMessage";
@@ -4464,9 +4524,9 @@ UserMessageRoot.displayName = "UserMessageRoot";
 var UserMessageContentWrapper = withDefaults("div", {
   className: "aui-user-message-content"
 });
-var UserMessageContent = (0, import_react64.forwardRef)(
+var UserMessageContent = (0, import_react65.forwardRef)(
   ({ components, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(UserMessageContentWrapper, { ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(UserMessageContentWrapper, { ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
       message_exports.Content,
       {
         components: {
@@ -4485,14 +4545,14 @@ var exports9 = {
 var user_message_default = Object.assign(UserMessage, exports9);
 
 // src/ui/edit-composer.tsx
-var import_react65 = require("react");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_react66 = require("react");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var EditComposer = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(EditComposerRoot, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(EditComposerInput, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(EditComposerFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(EditComposerCancel, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(EditComposerSend, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(EditComposerRoot, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(EditComposerInput, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(EditComposerFooter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(EditComposerCancel, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(EditComposerSend, {})
     ] })
   ] });
 };
@@ -4509,23 +4569,23 @@ var EditComposerFooter = withDefaults("div", {
   className: "aui-edit-composer-footer"
 });
 EditComposerFooter.displayName = "EditComposerFooter";
-var EditComposerCancel = (0, import_react65.forwardRef)(
+var EditComposerCancel = (0, import_react66.forwardRef)(
   (props, ref) => {
     const {
       strings: {
         editComposer: { cancel: { label = "Cancel" } = {} } = {}
       } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Button, { variant: "ghost", ...props, ref, children: props.children ?? label }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { variant: "ghost", ...props, ref, children: props.children ?? label }) });
   }
 );
 EditComposerCancel.displayName = "EditComposerCancel";
-var EditComposerSend = (0, import_react65.forwardRef)(
+var EditComposerSend = (0, import_react66.forwardRef)(
   (props, ref) => {
     const {
       strings: { editComposer: { send: { label = "Send" } = {} } = {} } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Button, { ...props, ref, children: props.children ?? label }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { ...props, ref, children: props.children ?? label }) });
   }
 );
 EditComposerSend.displayName = "EditComposerSend";
@@ -4539,23 +4599,23 @@ var exports10 = {
 var edit_composer_default = Object.assign(EditComposer, exports10);
 
 // src/ui/thread.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var Thread = (config) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadRoot, { config, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(ThreadViewport, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(thread_welcome_default, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadMessages, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(ThreadViewportFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadScrollToBottom, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(composer_default, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadRoot, { config, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(ThreadViewport, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(thread_welcome_default, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadMessages, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(ThreadViewportFooter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadScrollToBottom, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(composer_default, {})
     ] })
   ] }) });
 };
 var ThreadRootStyled = withDefaults(thread_exports.Root, {
   className: "aui-root aui-thread-root"
 });
-var ThreadRoot = (0, import_react66.forwardRef)(
+var ThreadRoot = (0, import_react67.forwardRef)(
   ({ config, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadRootStyled, { ...props, ref }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadRootStyled, { ...props, ref }) });
   }
 );
 ThreadRoot.displayName = "ThreadRoot";
@@ -4569,7 +4629,7 @@ var ThreadViewportFooter = withDefaults("div", {
 ThreadViewportFooter.displayName = "ThreadViewportFooter";
 var SystemMessage = () => null;
 var ThreadMessages = ({ components, ...rest }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     thread_exports.Messages,
     {
       components: {
@@ -4587,13 +4647,13 @@ var ThreadScrollToBottomIconButton = withDefaults(TooltipIconButton, {
   variant: "outline",
   className: "aui-thread-scroll-to-bottom"
 });
-var ThreadScrollToBottom = (0, import_react66.forwardRef)((props, ref) => {
+var ThreadScrollToBottom = (0, import_react67.forwardRef)((props, ref) => {
   const {
     strings: {
       thread: { scrollToBottom: { tooltip = "Scroll to bottom" } = {} } = {}
     } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(thread_exports.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThreadScrollToBottomIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react5.ArrowDownIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(thread_exports.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadScrollToBottomIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react5.ArrowDownIcon, {}) }) });
 });
 ThreadScrollToBottom.displayName = "ThreadScrollToBottom";
 var exports11 = {
@@ -4606,20 +4666,20 @@ var exports11 = {
 var thread_default = Object.assign(Thread, exports11);
 
 // src/ui/assistant-modal.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var AssistantModal = (config) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(AssistantModalRoot, { config, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(AssistantModalTrigger, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(AssistantModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(thread_default, {}) })
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(AssistantModalRoot, { config, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(AssistantModalTrigger, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(AssistantModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(thread_default, {}) })
   ] });
 };
 AssistantModal.displayName = "AssistantModal";
 var AssistantModalRoot = ({ config, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ThreadConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(assistantModal_exports.Root, { ...props }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ThreadConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(assistantModal_exports.Root, { ...props }) });
 };
 AssistantModalRoot.displayName = "AssistantModalRoot";
-var AssistantModalTrigger = (0, import_react67.forwardRef)((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(AssistantModalAnchor, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(assistantModal_exports.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(AssistantModalButton, { ...props, ref }) }) });
+var AssistantModalTrigger = (0, import_react68.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(AssistantModalAnchor, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(assistantModal_exports.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(AssistantModalButton, { ...props, ref }) }) });
 });
 AssistantModalTrigger.displayName = "AssistantModalTrigger";
 var AssistantModalAnchor = withDefaults(assistantModal_exports.Anchor, {
@@ -4630,7 +4690,7 @@ var ModalButtonStyled = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-modal-button"
 });
-var AssistantModalButton = (0, import_react67.forwardRef)(({ "data-state": state, ...rest }, ref) => {
+var AssistantModalButton = (0, import_react68.forwardRef)(({ "data-state": state, ...rest }, ref) => {
   const {
     strings: {
       assistantModal: {
@@ -4644,7 +4704,7 @@ var AssistantModalButton = (0, import_react67.forwardRef)(({ "data-state": state
     } = {}
   } = useThreadConfig();
   const tooltip = state === "open" ? openTooltip : closedTooltip;
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
     ModalButtonStyled,
     {
       side: "left",
@@ -4652,15 +4712,15 @@ var AssistantModalButton = (0, import_react67.forwardRef)(({ "data-state": state
       "data-state": state,
       ...rest,
       ref,
-      children: rest.children ?? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      children: rest.children ?? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_lucide_react6.BotIcon,
           {
             "data-state": state,
             className: "aui-modal-button-closed-icon"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_lucide_react6.ChevronDownIcon,
           {
             "data-state": state,