@assistant-ui/react 0.10.10 → 0.10.12

package/package.json

@@ -28,7 +28,7 @@
     "conversational-ui",
     "conversational-ai"
   ],
-  "version": "0.10.10",
+  "version": "0.10.12",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -51,18 +51,18 @@
     "@radix-ui/primitive": "^1.1.2",
     "@radix-ui/react-compose-refs": "^1.1.2",
     "@radix-ui/react-context": "^1.1.2",
-    "@radix-ui/react-popover": "^1.1.13",
-    "@radix-ui/react-primitive": "^2.1.2",
-    "@radix-ui/react-slot": "^1.2.2",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-primitive": "^2.1.3",
+    "@radix-ui/react-slot": "^1.2.3",
     "@radix-ui/react-use-callback-ref": "^1.1.1",
     "@radix-ui/react-use-escape-keydown": "^1.1.1",
     "@standard-schema/spec": "^1.0.0",
-    "assistant-stream": "^0.2.7",
+    "assistant-stream": "^0.2.10",
     "json-schema": "^0.4.0",
     "nanoid": "5.1.5",
     "react-textarea-autosize": "^8.5.9",
-    "zod": "^3.24.4",
-    "zustand": "^5.0.4"
+    "zod": "^3.25.28",
+    "zustand": "^5.0.5"
   },
   "peerDependencies": {
     "@types/react": "*",
@@ -82,11 +82,11 @@
     "@stryker-mutator/core": "^9.0.1",
     "@stryker-mutator/vitest-runner": "^9.0.1",
     "@types/json-schema": "^7.0.15",
-    "@types/node": "^22.15.18",
+    "@types/node": "^22.15.21",
     "eslint": "^9",
     "eslint-config-next": "15.3.2",
     "tsx": "^4.19.4",
-    "vitest": "^3.1.3",
+    "vitest": "^3.1.4",
     "@assistant-ui/x-buildutils": "0.0.1"
   },
   "publishConfig": {

package/src/primitives/composer/ComposerAttachmentDropzone.tsx

@@ -0,0 +1,70 @@
+import { forwardRef, useCallback, useState } from "react";
+
+import { Slot } from "@radix-ui/react-slot";
+import React from "react";
+import { useComposerRuntime } from "../../context";
+
+export namespace ComposerAttachmentDropzonePrimitive {
+  export type Element = HTMLDivElement;
+  export type Props = React.HTMLAttributes<HTMLDivElement> & {
+    asChild?: boolean | undefined;
+    disabled?: boolean | undefined;
+  };
+}
+
+export const ComposerAttachmentDropzone = forwardRef<
+  HTMLDivElement,
+  ComposerAttachmentDropzonePrimitive.Props
+>(({ disabled, asChild = false, children, ...rest }, ref) => {
+  const [isDragging, setIsDragging] = useState(false);
+  const composerRuntime = useComposerRuntime();
+
+  const handleDrag = useCallback(
+    (e: React.DragEvent) => {
+      if (disabled) return;
+      e.preventDefault();
+      e.stopPropagation();
+      setIsDragging(e.type === "dragenter" || e.type === "dragover");
+    },
+    [disabled],
+  );
+
+  const handleDrop = useCallback(
+    async (e: React.DragEvent) => {
+      if (disabled) return;
+      e.preventDefault();
+      e.stopPropagation();
+      setIsDragging(false);
+      for (const file of e.dataTransfer.files) {
+        try {
+          await composerRuntime.addAttachment(file);
+        } catch (error) {
+          console.error("Failed to add attachment:", error);
+        }
+      }
+    },
+    [disabled, composerRuntime],
+  );
+
+  const dragProps = {
+    onDragEnter: handleDrag,
+    onDragOver: handleDrag,
+    onDragLeave: handleDrag,
+    onDrop: handleDrop,
+  };
+
+  const Comp = asChild ? Slot : "div";
+
+  return (
+    <Comp
+      {...(isDragging ? { "data-dragging": "true" } : null)}
+      ref={ref}
+      {...dragProps}
+      {...rest}
+    >
+      {children}
+    </Comp>
+  );
+});
+
+ComposerAttachmentDropzone.displayName = "ComposerPrimitive.AttachmentDropzone";

package/src/primitives/thread/useThreadViewportAutoScroll.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useComposedRefs } from "@radix-ui/react-compose-refs";
-import { RefCallback, useEffect, useRef } from "react";
+import { RefCallback, useCallback, useEffect, useRef } from "react";
 import { useThreadRuntime } from "../../context/react/ThreadContext";
 import { useOnResizeContent } from "../../utils/hooks/useOnResizeContent";
 import { useOnScrollToBottom } from "../../utils/hooks/useOnScrollToBottom";
@@ -28,13 +28,16 @@ export const useThreadViewportAutoScroll = <TElement extends HTMLElement>({
   // fix: delay the state change until the scroll is done
   const isScrollingToBottomRef = useRef(false);
 
-  const scrollToBottom = (behavior: ScrollBehavior) => {
-    const div = divRef.current;
-    if (!div || !autoScroll) return;
+  const scrollToBottom = useCallback(
+    (behavior: ScrollBehavior) => {
+      const div = divRef.current;
+      if (!div || !autoScroll) return;
 
-    isScrollingToBottomRef.current = true;
-    div.scrollTo({ top: div.scrollHeight, behavior });
-  };
+      isScrollingToBottomRef.current = true;
+      div.scrollTo({ top: div.scrollHeight, behavior });
+    },
+    [autoScroll],
+  );
 
   const handleScroll = () => {
     const div = divRef.current;
@@ -90,5 +93,5 @@ export const useThreadViewportAutoScroll = <TElement extends HTMLElement>({
   }, [scrollToBottom, threadRuntime]);
 
   const autoScrollRef = useComposedRefs<TElement>(resizeRef, scrollRef, divRef);
-  return autoScrollRef;
+  return autoScrollRef as RefCallback<TElement>;
 };