@assistant-ui/core 0.1.17 → 0.2.2

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/runtimes/RemoteThreadListHookInstanceManager.tsx

@@ -94,7 +94,8 @@ export class RemoteThreadListHookInstanceManager extends BaseSubscribable {
     }
   }
 
-  // Rendered outside the user's Provider so deferred `children` cannot strand the binding.
+  // Rendered as a child of the user's Provider so the runtime hook can
+  // read context the Provider injects (e.g. RuntimeAdapterProvider).
   private _RuntimeBinder: FC<PropsWithChildren<{ threadId: string }>> = ({
     threadId,
     children,
@@ -172,7 +173,7 @@ export class RemoteThreadListHookInstanceManager extends BaseSubscribable {
             console.warn(
               "RemoteThreadListAdapter.unstable_Provider did not render its `children` synchronously. " +
                 "Render `children` on first commit; deferring them behind a loading state, Suspense boundary, " +
-                "or `useEffect` gate leaves thread context unavailable to downstream consumers.",
+                "or `useEffect` gate strands the runtime binder and leaves the thread without context.",
             );
           }
         }, 100);
@@ -183,11 +184,11 @@ export class RemoteThreadListHookInstanceManager extends BaseSubscribable {
 
     return (
       <ThreadListItemRuntimeProvider runtime={runtime}>
-        <this._RuntimeBinder threadId={threadId}>
-          <Provider>
+        <Provider>
+          <this._RuntimeBinder threadId={threadId}>
             <ProviderRenderDetector detectorRef={detectorRef} />
-          </Provider>
-        </this._RuntimeBinder>
+          </this._RuntimeBinder>
+        </Provider>
       </ThreadListItemRuntimeProvider>
     );
   });

package/src/react/runtimes/RemoteThreadListThreadListRuntimeCore.tsx

@@ -5,12 +5,13 @@ import { OptimisticState } from "../../runtimes/remote-thread-list/optimistic-st
 import { EMPTY_THREAD_CORE } from "../../runtimes/remote-thread-list/empty-thread-core";
 import type {
   RemoteThreadData,
-  THREAD_MAPPING_ID,
   RemoteThreadState,
 } from "../../runtimes/remote-thread-list/remote-thread-state";
 import {
+  classifyThreads,
   createThreadMappingId,
   getThreadData,
+  normalizeCursor,
   updateStatusReducer,
 } from "../../runtimes/remote-thread-list/remote-thread-state";
 import type { RemoteThreadListOptions } from "../../runtimes/remote-thread-list/types";
@@ -29,11 +30,14 @@ export class RemoteThreadListThreadListRuntimeCore
   private readonly _hookManager: RemoteThreadListHookInstanceManager;
 
   private _loadThreadsPromise: Promise<void> | undefined;
+  private _loadMorePromise: Promise<void> | undefined;
   private _loadGeneration = 0;
 
   private _mainThreadId!: string;
   private readonly _state = new OptimisticState<RemoteThreadState>({
     isLoading: true,
+    isLoadingMore: false,
+    cursor: undefined,
     newThreadId: undefined,
     threadIds: [],
     archivedThreadIds: [],
@@ -61,62 +65,33 @@ export class RemoteThreadListThreadListRuntimeCore
           // biome-ignore lint/suspicious/noThenProperty: OptimisticState reducer pattern
           then: (state, l) => {
             if (generation !== this._loadGeneration) return state;
-            const newThreadIds = [];
-            const newArchivedThreadIds = [];
-            const newThreadIdMap = {} as Record<string, THREAD_MAPPING_ID>;
-            const newThreadData = {} as Record<
-              THREAD_MAPPING_ID,
-              RemoteThreadData
-            >;
-
-            for (const thread of l.threads) {
-              switch (thread.status) {
-                case "regular":
-                  newThreadIds.push(thread.remoteId);
-                  break;
-                case "archived":
-                  newArchivedThreadIds.push(thread.remoteId);
-                  break;
-                default: {
-                  const _exhaustiveCheck: never = thread.status;
-                  throw new Error(`Unsupported state: ${_exhaustiveCheck}`);
-                }
-              }
-
-              const mappingId = createThreadMappingId(thread.remoteId);
-              newThreadIdMap[thread.remoteId] = mappingId;
-              newThreadData[mappingId] = {
-                id: thread.remoteId,
-                remoteId: thread.remoteId,
-                externalId: thread.externalId,
-                status: thread.status,
-                title: thread.title,
-                custom: thread.custom,
-                initializeTask: Promise.resolve({
-                  remoteId: thread.remoteId,
-                  externalId: thread.externalId,
-                }),
-              };
-            }
+            const fresh = classifyThreads(l.threads, {
+              threadIds: [],
+              archivedThreadIds: [],
+              threadIdMap: {},
+              threadData: {},
+            });
 
             return {
               ...state,
               isLoading: false,
-              threadIds: newThreadIds,
-              archivedThreadIds: newArchivedThreadIds,
+              cursor: normalizeCursor(l.nextCursor),
+              threadIds: fresh.threadIds,
+              archivedThreadIds: fresh.archivedThreadIds,
               threadIdMap: {
                 ...state.threadIdMap,
-                ...newThreadIdMap,
+                ...fresh.threadIdMap,
               },
               threadData: {
                 ...state.threadData,
-                ...newThreadData,
+                ...fresh.threadData,
               },
             };
           },
         })
-        .catch(() => {
+        .catch((error: unknown) => {
           if (generation !== this._loadGeneration) return;
+          console.error("[assistant-ui] thread list load failed:", error);
           this._loadThreadsPromise = undefined;
           this._state.update({
             ...this._state.baseValue,
@@ -129,6 +104,58 @@ export class RemoteThreadListThreadListRuntimeCore
     return this._loadThreadsPromise;
   }
 
+  public loadMore(): Promise<void> {
+    if (this._loadMorePromise) return this._loadMorePromise;
+
+    const initialState = this._state.value;
+    if (initialState.cursor === undefined || initialState.isLoading) {
+      return Promise.resolve();
+    }
+
+    const generation = this._loadGeneration;
+    const adapter = this._options.adapter;
+    const cursor = initialState.cursor;
+
+    const dedup = this._state
+      .optimisticUpdate({
+        execute: () => adapter.list({ after: cursor }),
+        loading: (state) => ({ ...state, isLoadingMore: true }),
+        // biome-ignore lint/suspicious/noThenProperty: OptimisticState reducer pattern
+        then: (state, l) => {
+          if (generation !== this._loadGeneration) return state;
+          if (adapter !== this._options.adapter) return state;
+
+          const appended = classifyThreads(l.threads, {
+            threadIds: [...state.threadIds],
+            archivedThreadIds: [...state.archivedThreadIds],
+            threadIdMap: { ...state.threadIdMap },
+            threadData: { ...state.threadData },
+          });
+
+          return {
+            ...state,
+            isLoadingMore: false,
+            cursor: normalizeCursor(l.nextCursor),
+            threadIds: appended.threadIds,
+            archivedThreadIds: appended.archivedThreadIds,
+            threadIdMap: appended.threadIdMap,
+            threadData: appended.threadData,
+          };
+        },
+      })
+      .catch((error: unknown) => {
+        console.error("[assistant-ui] thread list loadMore failed:", error);
+      })
+      .then(() => {
+        if (this._loadMorePromise === dedup) {
+          this._loadMorePromise = undefined;
+        }
+      });
+
+    this._loadMorePromise = dedup;
+    return dedup;
+  }
+
   private readonly contextProvider: ModelContextProvider;
 
   constructor(
@@ -156,6 +183,9 @@ export class RemoteThreadListThreadListRuntimeCore
   public __internal_setOptions(options: RemoteThreadListOptions) {
     if (this._options === options) return;
 
+    const adapterChanged =
+      this._options !== undefined && this._options.adapter !== options.adapter;
+
     this._options = options;
 
     const Provider = options.adapter.unstable_Provider ?? Fragment;
@@ -164,6 +194,16 @@ export class RemoteThreadListThreadListRuntimeCore
     }
 
     this._hookManager.setRuntimeHook(options.runtimeHook);
+
+    if (adapterChanged) {
+      this._loadGeneration++;
+      this._loadThreadsPromise = undefined;
+      this._loadMorePromise = undefined;
+      this._state.update({
+        ...this._state.baseValue,
+        cursor: undefined,
+      });
+    }
   }
 
   public __internal_load() {
@@ -179,6 +219,11 @@ export class RemoteThreadListThreadListRuntimeCore
   public reload() {
     this._loadGeneration++;
     this._loadThreadsPromise = undefined;
+    this._loadMorePromise = undefined;
+    this._state.update({
+      ...this._state.baseValue,
+      cursor: undefined,
+    });
     return this.getLoadThreadsPromise();
   }
 
@@ -186,6 +231,14 @@ export class RemoteThreadListThreadListRuntimeCore
     return this._state.value.isLoading;
   }
 
+  public get isLoadingMore() {
+    return this._state.value.isLoadingMore;
+  }
+
+  public get hasMore() {
+    return this._state.value.cursor !== undefined;
+  }
+
   public get threadIds() {
     return this._state.value.threadIds;
   }

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": {

package/src/react/runtimes/useToolInvocations.ts

@@ -7,6 +7,7 @@ import {
   ToolResponse,
   unstable_toolResultStream,
   type Tool,
+  type ToolModelContentPart,
 } from "assistant-stream";
 import {
   AssistantMetaTransformStream,
@@ -28,6 +29,7 @@ export type AddToolResultCommand = {
   readonly result: ReadonlyJSONValue;
   readonly isError: boolean;
   readonly artifact?: ReadonlyJSONValue;
+  readonly modelContent?: readonly ToolModelContentPart[];
 };
 
 const isArgsTextComplete = (argsText: string) => {
@@ -124,6 +126,7 @@ export function useToolInvocations({
       Object.entries(tools).map(([name, tool]) => {
         const execute = tool.execute;
         const streamCall = tool.streamCall;
+        const toModelOutput = tool.toModelOutput;
 
         const wrappedTool = {
           ...tool,
@@ -145,6 +148,15 @@ export function useToolInvocations({
                 toolCallId: getLogicalToolCallId(context.toolCallId),
               }),
           }),
+          ...(toModelOutput !== undefined && {
+            toModelOutput: (
+              options: Parameters<NonNullable<typeof toModelOutput>>[0],
+            ) =>
+              toModelOutput({
+                ...options,
+                toolCallId: getLogicalToolCallId(options.toolCallId),
+              }),
+          }),
         } as Tool;
         return [name, wrappedTool];
       }),
@@ -249,7 +261,12 @@ export function useToolInvocations({
                 toolName: chunk.meta.toolName,
                 result: chunk.result,
                 isError: chunk.isError,
-                ...(chunk.artifact && { artifact: chunk.artifact }),
+                ...(chunk.artifact !== undefined && {
+                  artifact: chunk.artifact,
+                }),
+                ...(chunk.modelContent !== undefined && {
+                  modelContent: chunk.modelContent,
+                }),
               });
             }
           },
@@ -533,6 +550,9 @@ export function useToolInvocations({
                     result: content.result as ReadonlyJSONValue,
                     artifact: content.artifact as ReadonlyJSONValue | undefined,
                     isError: content.isError,
+                    ...(content.modelContent !== undefined
+                      ? { modelContent: content.modelContent }
+                      : {}),
                   }),
                 );
                 lastState.controller.close();

package/src/react/types/scopes/tools.ts

@@ -1,8 +1,13 @@
 import type { ToolCallMessagePartComponent } from "../MessagePartComponentTypes";
 import type { Unsubscribe } from "../../..";
 
+export type McpAppResourceOutput = {
+  readonly render: ToolCallMessagePartComponent;
+};
+
 export type ToolsState = {
   tools: Record<string, ToolCallMessagePartComponent[]>;
+  mcpApp?: McpAppResourceOutput | undefined;
 };
 
 export type ToolsMethods = {

package/src/runtime/api/assistant-runtime.ts

@@ -6,8 +6,6 @@ import {
   type ThreadListRuntime,
   ThreadListRuntimeImpl,
 } from "./thread-list-runtime";
-import { ExportedMessageRepository } from "../utils/message-repository";
-import type { ThreadMessageLike } from "../utils/thread-message-like";
 
 export type AssistantRuntime = {
   /**
@@ -20,49 +18,16 @@ export type AssistantRuntime = {
    */
   readonly thread: ThreadRuntime;
 
-  /**
-   * @deprecated This field was renamed to `threads`.
-   */
-  readonly threadList: ThreadListRuntime;
-
-  /**
-   * Switch to a new thread.
-   *
-   * @deprecated This method was moved to `threads.switchToNewThread`.
-   */
-  switchToNewThread(): void;
-
-  /**
-   * Switch to a thread.
-   *
-   * @param threadId The thread ID to switch to.
-   * @deprecated This method was moved to `threads.switchToThread`.
-   */
-  switchToThread(threadId: string): void;
-
   /**
    * Register a model context provider. Model context providers are configuration such as system message, temperature, etc. that are set in the frontend.
    *
    * @param provider The model context provider to register.
    */
   registerModelContextProvider(provider: ModelContextProvider): Unsubscribe;
-
-  /**
-   * @deprecated This method was renamed to `registerModelContextProvider`.
-   */
-  registerModelConfigProvider(provider: ModelContextProvider): Unsubscribe;
-
-  /**
-   * @deprecated Use `runtime.thread.reset(initialMessages)`.
-   */
-  reset: unknown; // make it a type error
 };
 
 export class AssistantRuntimeImpl implements AssistantRuntime {
   public readonly threads;
-  public get threadList() {
-    return this.threads;
-  }
 
   public readonly _thread: ThreadRuntime;
 
@@ -74,42 +39,15 @@ export class AssistantRuntimeImpl implements AssistantRuntime {
   }
 
   protected __internal_bindMethods() {
-    this.switchToNewThread = this.switchToNewThread.bind(this);
-    this.switchToThread = this.switchToThread.bind(this);
     this.registerModelContextProvider =
       this.registerModelContextProvider.bind(this);
-    this.registerModelConfigProvider =
-      this.registerModelConfigProvider.bind(this);
-    this.reset = this.reset.bind(this);
   }
 
   public get thread() {
     return this._thread;
   }
 
-  public switchToNewThread() {
-    return this._core.threads.switchToNewThread();
-  }
-
-  public switchToThread(threadId: string) {
-    return this._core.threads.switchToThread(threadId);
-  }
-
   public registerModelContextProvider(provider: ModelContextProvider) {
     return this._core.registerModelContextProvider(provider);
   }
-
-  public registerModelConfigProvider(provider: ModelContextProvider) {
-    return this.registerModelContextProvider(provider);
-  }
-
-  public reset({
-    initialMessages,
-  }: {
-    initialMessages?: ThreadMessageLike[];
-  } = {}) {
-    return this._core.threads
-      .getMainThreadRuntimeCore()
-      .import(ExportedMessageRepository.fromArray(initialMessages ?? []));
-  }
 }

package/src/runtime/api/bindings.ts

@@ -5,10 +5,7 @@ import type {
   EditComposerRuntimeCore,
   ThreadComposerRuntimeCore,
 } from "../interfaces/composer-runtime-core";
-import type {
-  SpeechState,
-  SubmittedFeedback,
-} from "../interfaces/thread-runtime-core";
+import type { SpeechState } from "../interfaces/thread-runtime-core";
 import type { ComposerRuntimePath, MessageRuntimePath } from "./paths";
 
 export type ComposerRuntimeCoreBinding = SubscribableWithState<
@@ -34,8 +31,6 @@ export type MessageStateBinding = SubscribableWithState<
     readonly branchNumber: number;
     readonly branchCount: number;
     readonly speech: SpeechState | undefined;
-    /** @deprecated Use `message.metadata.submittedFeedback` instead. This will be removed in 0.12.0. */
-    readonly submittedFeedback: SubmittedFeedback | undefined;
   },
   MessageRuntimePath
 >;

package/src/runtime/api/composer-runtime.ts

@@ -41,6 +41,7 @@ export type {
 
 type BaseComposerState = {
   readonly canCancel: boolean;
+  readonly canSend: boolean;
   readonly isEditing: boolean;
   readonly isEmpty: boolean;
 
@@ -86,6 +87,7 @@ const getThreadComposerState = (
 
     isEditing: runtime?.isEditing ?? false,
     canCancel: runtime?.canCancel ?? false,
+    canSend: runtime?.canSend ?? false,
     isEmpty: runtime?.isEmpty ?? true,
 
     attachments: runtime?.attachments ?? EMPTY_ARRAY,
@@ -108,6 +110,7 @@ const getEditComposerState = (
 
     isEditing: runtime?.isEditing ?? false,
     canCancel: runtime?.canCancel ?? false,
+    canSend: runtime?.canSend ?? false,
     isEmpty: runtime?.isEmpty ?? true,
 
     text: runtime?.text ?? "",

package/src/runtime/api/message-runtime.ts

@@ -1,7 +1,4 @@
-import type {
-  SpeechState,
-  SubmittedFeedback,
-} from "../interfaces/thread-runtime-core";
+import type { SpeechState } from "../interfaces/thread-runtime-core";
 import { symbolInnerMessage } from "../utils/external-store-message";
 import type {
   ToolCallMessagePartStatus,
@@ -90,10 +87,6 @@ export type MessageState = ThreadMessage & {
    * @deprecated This API is still under active development and might change without notice.
    */
   readonly speech: SpeechState | undefined;
-  /**
-   * @deprecated Use `message.metadata.submittedFeedback` instead. This will be removed in 0.12.0.
-   */
-  readonly submittedFeedback: SubmittedFeedback | undefined;
 };
 
 export type { MessageStateBinding } from "./bindings";