@assistant-ui/react 0.7.60 → 0.7.62

package/package.json

@@ -29,7 +29,7 @@
     "conversational-ui",
     "conversational-ai"
   ],
-  "version": "0.7.60",
+  "version": "0.7.62",
   "license": "MIT",
   "exports": {
     ".": {

package/src/cloud/auiV0.ts

@@ -4,7 +4,10 @@ import { MessageStatus } from "../types/AssistantTypes";
 import { fromThreadMessageLike } from "../runtimes/external-store/ThreadMessageLike";
 import { CloudMessage } from "./AssistantCloudThreadMessages";
 import { isJSONValue } from "../utils/json/is-json";
-import { ReadonlyJSONValue } from "../utils/json/json-value";
+import {
+  ReadonlyJSONObject,
+  ReadonlyJSONValue,
+} from "../utils/json/json-value";
 import { ExportedMessageRepositoryItem } from "../runtimes/utils/MessageRepository";
 
 type AuiV0MessageContentPart =
@@ -16,7 +19,7 @@ type AuiV0MessageContentPart =
       readonly type: "tool-call";
       readonly toolCallId: string;
       readonly toolName: string;
-      readonly args: ReadonlyJSONValue;
+      readonly args: ReadonlyJSONObject;
       readonly result?: ReadonlyJSONValue;
       readonly isError?: true;
     }

package/src/primitives/threadList/ThreadListRoot.tsx

@@ -0,0 +1,18 @@
+import { Primitive } from "@radix-ui/react-primitive";
+import { ComponentPropsWithoutRef, ComponentRef, forwardRef } from "react";
+
+type PrimitiveDivProps = ComponentPropsWithoutRef<typeof Primitive.div>;
+
+export namespace ThreadListPrimitiveRoot {
+  export type Element = ComponentRef<typeof Primitive.div>;
+  export type Props = PrimitiveDivProps;
+}
+
+export const ThreadListPrimitiveRoot = forwardRef<
+  ThreadListPrimitiveRoot.Element,
+  ThreadListPrimitiveRoot.Props
+>((props, ref) => {
+  return <Primitive.div {...props} ref={ref} />;
+});
+
+ThreadListPrimitiveRoot.displayName = "ThreadListPrimitive.Root";

package/src/primitives/threadList/index.ts

@@ -1,2 +1,3 @@
 export { ThreadListPrimitiveNew as New } from "./ThreadListNew";
 export { ThreadListPrimitiveItems as Items } from "./ThreadListItems";
+export { ThreadListPrimitiveRoot as Root } from "./ThreadListRoot";

package/src/runtimes/external-store/ThreadMessageLike.tsx

@@ -1,8 +1,8 @@
+import { generateId } from "../../internal";
 import {
   MessageStatus,
   TextContentPart,
   ImageContentPart,
-  ToolCallContentPart,
   UIContentPart,
   ThreadMessage,
   ThreadAssistantContentPart,
@@ -14,11 +14,11 @@ import {
   FileContentPart,
   Unstable_AudioContentPart,
 } from "../../types";
+import { ThreadStep } from "../../types/AssistantTypes";
 import {
-  CoreToolCallContentPart,
-  ThreadStep,
-} from "../../types/AssistantTypes";
-import { ReadonlyJSONValue } from "../../utils/json/json-value";
+  ReadonlyJSONObject,
+  ReadonlyJSONValue,
+} from "../../utils/json/json-value";
 import { parsePartialJson } from "../../utils/json/parse-partial-json";
 
 export type ThreadMessageLike = {
@@ -30,15 +30,14 @@ export type ThreadMessageLike = {
         | ImageContentPart
         | FileContentPart
         | Unstable_AudioContentPart
-        | ToolCallContentPart<any, any>
-        | CoreToolCallContentPart<any, any>
         | {
-            type: "tool-call";
-            toolCallId: string;
-            toolName: string;
-            argsText: string;
-            result?: unknown | undefined;
-            isError?: boolean | undefined;
+            readonly type: "tool-call";
+            readonly toolCallId?: string;
+            readonly toolName: string;
+            readonly args?: ReadonlyJSONObject;
+            readonly argsText?: string;
+            readonly result?: any | undefined;
+            readonly isError?: boolean | undefined;
           }
         | UIContentPart
       )[];
@@ -100,19 +99,19 @@ export const fromThreadMessageLike = (
                 return part;
 
               case "tool-call": {
-                if ("argsText" in part) {
-                  if ("args" in part) {
-                    return part;
-                  }
-
+                if (part.args) {
                   return {
                     ...part,
-                    args: parsePartialJson(part.argsText),
+                    toolCallId: part.toolCallId ?? "tool-" + generateId(),
+                    args: part.args,
+                    argsText: JSON.stringify(part.args),
                   };
                 }
                 return {
                   ...part,
-                  argsText: JSON.stringify(part.args),
+                  toolCallId: part.toolCallId ?? "tool-" + generateId(),
+                  args: part.args ?? parsePartialJson(part.argsText ?? ""),
+                  argsText: part.argsText ?? "",
                 };
               }
 

package/src/styles/tailwindcss/thread.css

@@ -38,7 +38,7 @@
   @apply mt-4 font-medium;
 }
 
-.aui-thread-welcome-suggestion-container {
+.aui-thread-welcome-suggestions {
   @apply mt-3 flex w-full items-stretch justify-center gap-4;
 }
 

package/src/ui/thread-list.tsx

@@ -18,7 +18,7 @@ const ThreadList: FC = () => {
   );
 };
 
-const ThreadListRoot = withDefaults("div", {
+const ThreadListRoot = withDefaults(ThreadListPrimitive.Root, {
   className: "aui-root aui-thread-list-root",
 });
 ThreadListRoot.displayName = "ThreadListRoot";

package/src/ui/thread-welcome.tsx

@@ -84,7 +84,7 @@ const ThreadWelcomeMessage = forwardRef<
 ThreadWelcomeMessage.displayName = "ThreadWelcomeMessage";
 
 const ThreadWelcomeSuggestionContainer = withDefaults("div", {
-  className: "aui-thread-welcome-suggestion-container",
+  className: "aui-thread-welcome-suggestions",
 });
 
 const ThreadWelcomeSuggestionStyled = withDefaults(ThreadPrimitive.Suggestion, {

package/src/utils/smooth/useSmooth.tsx

@@ -83,20 +83,24 @@ export const useSmooth = (
   const setText = useCallbackRef((text: string) => {
     setDisplayedText(text);
     if (smoothStatusStore) {
-      writableStore(smoothStatusStore).setState(
-        text !== state.text ? SMOOTH_STATUS : state.status,
-      );
+      const target =
+        displayedText !== text || state.status.type === "running"
+          ? SMOOTH_STATUS
+          : state.status;
+      writableStore(smoothStatusStore).setState(target, true);
     }
   });
 
   // TODO this is hacky
   useEffect(() => {
     if (smoothStatusStore) {
-      writableStore(smoothStatusStore).setState(
-        text !== state.text ? SMOOTH_STATUS : state.status,
-      );
+      const target =
+        displayedText !== text || state.status.type === "running"
+          ? SMOOTH_STATUS
+          : state.status;
+      writableStore(smoothStatusStore).setState(target, true);
     }
-  }, [smoothStatusStore, text, displayedText, state.status, state.text]);
+  }, [smoothStatusStore, text, displayedText, state.status]);
 
   const [animatorRef] = useState<TextStreamAnimator>(
     new TextStreamAnimator(text, setText),