@assistant-ui/core 0.2.0 → 0.2.3

package/src/react/model-context/useAssistantDataUI.ts

@@ -2,11 +2,20 @@ import { useEffect } from "react";
 import { useAui } from "@assistant-ui/store";
 import type { DataMessagePartComponent } from "../types/MessagePartComponentTypes";
 
+/** Props used to register a renderer for `data` message parts. */
 export type AssistantDataUIProps<T = any> = {
+  /** Data part name this renderer handles. */
   name: string;
+  /** Component rendered for matching data message parts. */
   render: DataMessagePartComponent<T>;
 };
 
+/**
+ * Registers a renderer for named `data` message parts while the component is
+ * mounted.
+ *
+ * @param dataUI - Data renderer registration, or `null` to skip registration.
+ */
 export const useAssistantDataUI = (dataUI: AssistantDataUIProps | null) => {
   const aui = useAui();
   useEffect(() => {

package/src/react/model-context/useAssistantTool.ts

@@ -3,13 +3,47 @@ import { useAui } from "@assistant-ui/store";
 import type { ToolCallMessagePartComponent } from "../types/MessagePartComponentTypes";
 import type { AssistantToolProps as CoreAssistantToolProps } from "../..";
 
+/**
+ * Props used to register a tool from React.
+ */
 export type AssistantToolProps<
   TArgs extends Record<string, unknown>,
   TResult,
 > = CoreAssistantToolProps<TArgs, TResult> & {
+  /** Component used to render calls to this tool in assistant messages. */
   render?: ToolCallMessagePartComponent<TArgs, TResult> | undefined;
 };
 
+/**
+ * Registers a tool with the assistant model context while the component is
+ * mounted.
+ *
+ * If `render` is provided, it is also installed as the renderer for matching
+ * tool-call message parts. The registration is removed automatically when the
+ * component unmounts or the tool definition changes.
+ *
+ * Pass a referentially stable tool object, such as one declared at module
+ * scope or memoized with `useMemo`, to avoid re-registering on every render.
+ *
+ * @param tool - Tool definition and name to register.
+ *
+ * @example
+ * ```tsx
+ * const weatherTool = {
+ *   toolName: "get_weather",
+ *   type: "frontend",
+ *   description: "Get the weather for a city.",
+ *   parameters: weatherSchema,
+ *   execute: async ({ city }: { city: string }) => fetchWeather(city),
+ *   render: WeatherToolUI,
+ * } satisfies AssistantToolProps<{ city: string }, Weather>;
+ *
+ * function WeatherToolRegistration() {
+ *   useAssistantTool(weatherTool);
+ *   return null;
+ * }
+ * ```
+ */
 export const useAssistantTool = <
   TArgs extends Record<string, unknown>,
   TResult,

package/src/react/model-context/useAssistantToolUI.ts

@@ -2,11 +2,23 @@ import { useEffect } from "react";
 import { useAui } from "@assistant-ui/store";
 import type { ToolCallMessagePartComponent } from "../types/MessagePartComponentTypes";
 
+/** Props used to register a renderer for tool-call message parts. */
 export type AssistantToolUIProps<TArgs, TResult> = {
+  /** Name of the tool whose calls should use this renderer. */
   toolName: string;
+  /** Component rendered for matching tool-call message parts. */
   render: ToolCallMessagePartComponent<TArgs, TResult>;
 };
 
+/**
+ * Registers a tool-call renderer while the component is mounted.
+ *
+ * This only affects rendering. Pair it with {@link useAssistantTool},
+ * {@link Tools}, or a backend tool registry to expose the actual tool
+ * definition to the model.
+ *
+ * @param tool - Tool renderer registration, or `null` to skip registration.
+ */
 export const useAssistantToolUI = (
   tool: AssistantToolUIProps<any, any> | null,
 ) => {

package/src/react/model-context/useToolArgsStatus.ts

@@ -7,13 +7,42 @@ import {
 
 type PropFieldStatus = "streaming" | "complete";
 
+/**
+ * Streaming completion status for the arguments of the current tool call.
+ */
 export type ToolArgsStatus<
   TArgs extends Record<string, unknown> = Record<string, unknown>,
 > = {
+  /** Overall lifecycle state of the tool-call part. */
   status: "running" | "complete" | "incomplete" | "requires-action";
+  /** Per-argument status keyed by argument name. */
   propStatus: Partial<Record<keyof TArgs, PropFieldStatus>>;
 };
 
+/**
+ * Reads whether each argument field for the current tool-call message part is
+ * still streaming or complete.
+ *
+ * Use inside a tool-call renderer to avoid showing incomplete argument values
+ * as final.
+ *
+ * @throws If called outside a tool-call message part.
+ *
+ * @example
+ * ```tsx
+ * function WeatherToolUI({
+ *   args,
+ * }: ToolCallMessagePartProps<{ city: string }>) {
+ *   const { propStatus } = useToolArgsStatus<{ city: string }>();
+ *
+ *   return (
+ *     <span>
+ *       {propStatus.city === "streaming" ? "Reading city..." : args.city}
+ *     </span>
+ *   );
+ * }
+ * ```
+ */
 export const useToolArgsStatus = <
   TArgs extends Record<string, unknown> = Record<string, unknown>,
 >(): ToolArgsStatus<TArgs> => {

package/src/react/primitive-hooks/useActionBarCopy.ts

@@ -27,11 +27,15 @@ export const useActionBarCopy = ({
     if (!valueToCopy) return;
 
     const write = copyToClipboard ?? (() => {});
-    const result = write(valueToCopy);
-    Promise.resolve(result).then(() => {
-      aui.message().setIsCopied(true);
-      setTimeout(() => aui.message().setIsCopied(false), copiedDuration);
-    });
+    // The rejection handler swallows clipboard write failures (permission denied,
+    // API unavailable) so they don't surface as unhandled promise rejections.
+    Promise.resolve(write(valueToCopy)).then(
+      () => {
+        aui.message().setIsCopied(true);
+        setTimeout(() => aui.message().setIsCopied(false), copiedDuration);
+      },
+      () => {},
+    );
   }, [aui, isEditing, composerValue, copiedDuration, copyToClipboard]);
 
   return { copy, disabled, isCopied };

package/src/react/primitive-hooks/useComposerSend.ts

@@ -6,9 +6,8 @@ export const useComposerSend = () => {
   const aui = useAui();
   const disabled = useAuiState(
     (s) =>
-      (s.thread.isRunning && !s.thread.capabilities.queue) ||
-      !s.composer.isEditing ||
-      s.composer.isEmpty,
+      !s.composer.canSend ||
+      (s.thread.isRunning && !s.thread.capabilities.queue),
   );
 
   const send = useCallback(

package/src/react/primitives/message/MessageAttachments.test.tsx

@@ -0,0 +1,50 @@
+import { describe, expect, it, vi } from "vitest";
+import type { ReactElement } from "react";
+import { MessagePrimitiveAttachments } from "./MessageAttachments";
+
+const mockUseAuiState = vi.fn();
+type UseAuiStateSelector = Parameters<
+  typeof import("@assistant-ui/store")["useAuiState"]
+>[0];
+type AttachmentsElement = ReactElement<{ children: () => null }>;
+
+vi.mock("react", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("react")>();
+  return {
+    ...actual,
+    useMemo: (factory: () => unknown) => factory(),
+  };
+});
+
+vi.mock("@assistant-ui/store", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("@assistant-ui/store")>();
+  return {
+    ...actual,
+    useAuiState: (selector: UseAuiStateSelector) => mockUseAuiState(selector),
+  };
+});
+
+const renderAttachmentsInner = () => {
+  const element = MessagePrimitiveAttachments({
+    children: () => null,
+  }) as AttachmentsElement;
+
+  const Inner = element.type as (props: typeof element.props) => unknown;
+  return Inner(element.props);
+};
+
+describe("MessagePrimitiveAttachments", () => {
+  it("treats missing user message attachments as empty", () => {
+    mockUseAuiState.mockImplementation((selector: UseAuiStateSelector) =>
+      selector({
+        message: {
+          role: "user",
+          attachments: undefined,
+        },
+      } as never),
+    );
+
+    expect(() => renderAttachmentsInner()).not.toThrow();
+    expect(renderAttachmentsInner()).toEqual([]);
+  });
+});

package/src/react/primitives/message/MessageAttachments.tsx

@@ -93,7 +93,7 @@ const MessagePrimitiveAttachmentsInner: FC<{
 }> = ({ children }) => {
   const attachmentsCount = useAuiState((s) => {
     if (s.message.role !== "user") return 0;
-    return s.message.attachments.length;
+    return (s.message.attachments ?? []).length;
   });
 
   return useMemo(

package/src/react/primitives/message/MessageParts.tsx

@@ -31,8 +31,9 @@ import type {
   ReasoningGroupComponent,
   QuoteMessagePartComponent,
 } from "../../types/MessagePartComponentTypes";
-import type { MessagePartStatus } from "../../../types/message";
+import { isMcpAppUri, type MessagePartStatus } from "../../../types/message";
 import type { DataRenderersState } from "../../types/scopes/dataRenderers";
+import type { ToolsState } from "../../types/scopes/tools";
 import { useShallow } from "zustand/shallow";
 
 type MessagePartRange =
@@ -511,6 +512,19 @@ const QuoteRendererImpl: FC<{ Quote: QuoteMessagePartComponent }> = ({
 
 const QuoteRenderer = memo(QuoteRendererImpl);
 
+function resolveToolRender(
+  toolsState: ToolsState,
+  part: Extract<PartState, { type: "tool-call" }>,
+): ToolCallMessagePartComponent | null {
+  const entry = toolsState.tools[part.toolName];
+  const named = Array.isArray(entry) ? (entry[0] ?? null) : (entry ?? null);
+  if (named) return named;
+  if (isMcpAppUri(part.mcp?.app?.resourceUri) && toolsState.mcpApp) {
+    return toolsState.mcpApp.render;
+  }
+  return null;
+}
+
 /**
  * Stable propless component that renders the registered tool UI for the
  * current part context. Reads tool registry and part state from context.
@@ -518,12 +532,9 @@ const QuoteRenderer = memo(QuoteRendererImpl);
 const RegisteredToolUI: FC = () => {
   const aui = useAui();
   const part = useAuiState((s) => s.part);
-  const Render = useAuiState((s) => {
-    if (s.part.type !== "tool-call") return null;
-    const entry = s.tools.tools[s.part.toolName];
-    if (Array.isArray(entry)) return entry[0] ?? null;
-    return entry ?? null;
-  });
+  const Render = useAuiState((s) =>
+    s.part.type === "tool-call" ? resolveToolRender(s.tools, s.part) : null,
+  );
 
   if (!Render || part.type !== "tool-call") return null;
 
@@ -638,8 +649,8 @@ export const MessagePartChildren: FC<{
             get part() {
               const state = getItem();
               if (state.type === "tool-call") {
-                const entry = aui.tools().getState().tools[state.toolName];
-                const hasUI = Array.isArray(entry) ? !!entry[0] : !!entry;
+                const toolsState = aui.tools().getState();
+                const hasUI = resolveToolRender(toolsState, state) !== null;
                 const partMethods = aui.message().part({ index });
                 return {
                   ...state,

package/src/react/primitives/messagePart/MessagePartInProgress.ts

@@ -0,0 +1,15 @@
+import type { FC, PropsWithChildren } from "react";
+import { useAuiState } from "@assistant-ui/store";
+
+export namespace MessagePartPrimitiveInProgress {
+  export type Props = PropsWithChildren;
+}
+
+export const MessagePartPrimitiveInProgress: FC<
+  MessagePartPrimitiveInProgress.Props
+> = ({ children }) => {
+  const isInProgress = useAuiState((s) => s.part.status.type === "running");
+  return isInProgress ? children : null;
+};
+
+MessagePartPrimitiveInProgress.displayName = "MessagePartPrimitive.InProgress";

package/src/react/runtimes/cloud/auiV0.ts

@@ -1,4 +1,8 @@
-import type { MessageStatus, ThreadMessage } from "../../../types/message";
+import type {
+  MessageStatus,
+  SourceProviderMetadata,
+  ThreadMessage,
+} from "../../../types/message";
 import { fromThreadMessageLike } from "../../../runtime/utils/thread-message-like";
 import type { CloudMessage } from "assistant-cloud";
 import { isJSONValue } from "../../../utils/json/is-json";
@@ -23,6 +27,16 @@ type AuiV0MessagePart =
       readonly id: string;
       readonly url: string;
       readonly title?: string;
+      readonly providerMetadata?: SourceProviderMetadata;
+    }
+  | {
+      readonly type: "source";
+      readonly sourceType: "document";
+      readonly id: string;
+      readonly title: string;
+      readonly mediaType: string;
+      readonly filename?: string;
+      readonly providerMetadata?: SourceProviderMetadata;
     }
   | {
       readonly type: "tool-call";
@@ -90,12 +104,31 @@ export function auiV0Encode(message: ThreadMessage): AuiV0Message {
           return { type: "reasoning", text: part.text };
 
         case "source":
+          if (part.sourceType === "url") {
+            return {
+              type: "source",
+              sourceType: "url",
+              id: part.id,
+              url: part.url,
+              ...(part.title != null ? { title: part.title } : undefined),
+              ...(part.providerMetadata != null
+                ? { providerMetadata: part.providerMetadata }
+                : undefined),
+            };
+          }
+
           return {
             type: "source",
-            sourceType: part.sourceType,
+            sourceType: "document",
             id: part.id,
-            url: part.url,
-            ...(part.title ? { title: part.title } : undefined),
+            title: part.title,
+            mediaType: part.mediaType,
+            ...(part.filename != null
+              ? { filename: part.filename }
+              : undefined),
+            ...(part.providerMetadata != null
+              ? { providerMetadata: part.providerMetadata }
+              : undefined),
           };
 
         case "tool-call": {