@assistant-ui/react 0.4.1 → 0.4.3

package/dist/index.mjs

@@ -831,21 +831,30 @@ var ActionBarPrimitiveRoot = forwardRef(({ hideWhenRunning, autohide, autohideFl
 ActionBarPrimitiveRoot.displayName = "ActionBarPrimitive.Root";
 
 // src/utils/createActionButton.tsx
-import { composeEventHandlers } from "@radix-ui/primitive";
-import { Primitive as Primitive2 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef2 } from "react";
+import { Primitive as Primitive2 } from "@radix-ui/react-primitive";
+import { composeEventHandlers } from "@radix-ui/primitive";
 import { jsx as jsx5 } from "react/jsx-runtime";
-var createActionButton = (displayName, useActionButton) => {
+var createActionButton = (displayName, useActionButton, forwardProps = []) => {
   const ActionButton = forwardRef2((props, forwardedRef) => {
-    const callback = useActionButton(props);
+    const forwardedProps = {};
+    const primitiveProps = {};
+    Object.keys(props).forEach((key) => {
+      if (forwardProps.includes(key)) {
+        forwardedProps[key] = props[key];
+      } else {
+        primitiveProps[key] = props[key];
+      }
+    });
+    const callback = useActionButton(forwardedProps);
     return /* @__PURE__ */ jsx5(
       Primitive2.button,
       {
         type: "button",
         disabled: !callback,
-        ...props,
+        ...primitiveProps,
         ref: forwardedRef,
-        onClick: composeEventHandlers(props.onClick, () => {
+        onClick: composeEventHandlers(primitiveProps.onClick, () => {
           callback?.();
         })
       }
@@ -858,7 +867,8 @@ var createActionButton = (displayName, useActionButton) => {
 // src/primitives/actionBar/ActionBarCopy.tsx
 var ActionBarPrimitiveCopy = createActionButton(
   "ActionBarPrimitive.Copy",
-  useActionBarCopy
+  useActionBarCopy,
+  ["copiedDuration"]
 );
 
 // src/primitives/actionBar/ActionBarReload.tsx
@@ -1169,7 +1179,7 @@ import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef7 } from "react";
 
 // src/utils/hooks/useSmooth.tsx
-import { useEffect as useEffect8, useState as useState5 } from "react";
+import { useEffect as useEffect8, useRef as useRef4, useState as useState5 } from "react";
 var TextStreamAnimator = class {
   constructor(currentText, setText) {
     this.currentText = currentText;
@@ -1215,6 +1225,9 @@ var TextStreamAnimator = class {
   };
 };
 var useSmooth = (text, smooth = false) => {
+  const { useMessage } = useMessageContext();
+  const id = useMessage((m) => m.message.id);
+  const idRef = useRef4(id);
   const [displayedText, setDisplayedText] = useState5(text);
   const [animatorRef] = useState5(
     new TextStreamAnimator(text, setDisplayedText)
@@ -1224,7 +1237,8 @@ var useSmooth = (text, smooth = false) => {
       animatorRef.stop();
       return;
     }
-    if (!text.startsWith(animatorRef.targetText)) {
+    if (idRef.current !== id || !text.startsWith(animatorRef.targetText)) {
+      idRef.current = id;
       setDisplayedText(text);
       animatorRef.currentText = text;
       animatorRef.targetText = text;
@@ -1233,7 +1247,7 @@ var useSmooth = (text, smooth = false) => {
     }
     animatorRef.targetText = text;
     animatorRef.start();
-  }, [animatorRef, smooth, text]);
+  }, [animatorRef, id, smooth, text]);
   useEffect8(() => {
     return () => {
       animatorRef.stop();
@@ -1421,7 +1435,7 @@ import {
   forwardRef as forwardRef11,
   useCallback as useCallback15,
   useEffect as useEffect9,
-  useRef as useRef4
+  useRef as useRef5
 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
 import { useEscapeKeydown } from "@radix-ui/react-use-escape-keydown";
@@ -1435,7 +1449,7 @@ var ComposerPrimitiveInput = forwardRef11(
       return c.value;
     });
     const Component = asChild ? Slot : TextareaAutosize;
-    const textareaRef = useRef4(null);
+    const textareaRef = useRef5(null);
     const ref = useComposedRefs2(forwardedRef, textareaRef);
     useEscapeKeydown((e) => {
       const composer = useComposer.getState();
@@ -1581,7 +1595,7 @@ import { forwardRef as forwardRef14 } from "react";
 
 // src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
 import { useComposedRefs as useComposedRefs3 } from "@radix-ui/react-compose-refs";
-import { useRef as useRef5 } from "react";
+import { useRef as useRef6 } from "react";
 
 // src/utils/hooks/useOnResizeContent.tsx
 import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
@@ -1640,16 +1654,13 @@ var useOnScrollToBottom = (callback) => {
 var useThreadViewportAutoScroll = ({
   autoScroll = true
 }) => {
-  const divRef = useRef5(null);
+  const divRef = useRef6(null);
   const { useViewport } = useThreadContext();
-  const firstRenderRef = useRef5(true);
-  const lastScrollTop = useRef5(0);
-  const isScrollingToBottomRef = useRef5(false);
-  const scrollToBottom = () => {
+  const lastScrollTop = useRef6(0);
+  const isScrollingToBottomRef = useRef6(false);
+  const scrollToBottom = (behavior) => {
     const div = divRef.current;
     if (!div || !autoScroll) return;
-    const behavior = firstRenderRef.current ? "instant" : "auto";
-    firstRenderRef.current = false;
     isScrollingToBottomRef.current = true;
     div.scrollTo({ top: div.scrollHeight, behavior });
   };
@@ -1660,7 +1671,9 @@ var useThreadViewportAutoScroll = ({
     const newIsAtBottom = div.scrollHeight - div.scrollTop <= div.clientHeight;
     if (!newIsAtBottom && lastScrollTop.current < div.scrollTop) {
     } else {
-      isScrollingToBottomRef.current = newIsAtBottom;
+      if (newIsAtBottom) {
+        isScrollingToBottomRef.current = false;
+      }
       if (newIsAtBottom !== isAtBottom) {
         useViewport.setState({
           isAtBottom: newIsAtBottom
@@ -1670,11 +1683,10 @@ var useThreadViewportAutoScroll = ({
     lastScrollTop.current = div.scrollTop;
   };
   const resizeRef = useOnResizeContent(() => {
-    if (!isScrollingToBottomRef.current && !useViewport.getState().isAtBottom && !firstRenderRef.current) {
-      handleScroll();
-    } else {
-      scrollToBottom();
+    if (isScrollingToBottomRef.current || useViewport.getState().isAtBottom) {
+      scrollToBottom("instant");
     }
+    handleScroll();
   });
   const scrollRef = useManagedRef((el) => {
     el.addEventListener("scroll", handleScroll);
@@ -1684,7 +1696,7 @@ var useThreadViewportAutoScroll = ({
   });
   const autoScrollRef = useComposedRefs3(resizeRef, scrollRef, divRef);
   useOnScrollToBottom(() => {
-    scrollToBottom();
+    scrollToBottom("auto");
   });
   return autoScrollRef;
 };
@@ -1885,7 +1897,8 @@ var ThreadPrimitiveScrollToBottom = createActionButton(
 // src/primitives/thread/ThreadSuggestion.tsx
 var ThreadPrimitiveSuggestion = createActionButton(
   "ThreadPrimitive.Suggestion",
-  useThreadSuggestion
+  useThreadSuggestion,
+  ["prompt", "autoSend", "method"]
 );
 
 // src/runtimes/local/useLocalRuntime.tsx
@@ -2278,7 +2291,7 @@ function assistantDecoderStream() {
   let currentToolCall;
   return new TransformStream({
     transform(chunk, controller) {
-      const [code, valueJson] = chunk.split(":");
+      const [code, valueJson] = parseStreamPart(chunk);
       const value = JSON.parse(valueJson);
       if (currentToolCall && code !== "2" /* ToolCallArgsTextDelta */ && code !== "E" /* Error */) {
         controller.enqueue({
@@ -2337,6 +2350,14 @@ function assistantDecoderStream() {
     }
   });
 }
+var parseStreamPart = (part) => {
+  const index = part.indexOf(":");
+  if (index === -1) throw new Error("Invalid stream part");
+  return [
+    part.slice(0, index),
+    part.slice(index + 1)
+  ];
+};
 
 // src/runtimes/edge/streams/chunkByLineStream.ts
 function chunkByLineStream() {