@assistant-ui/react 0.15.30 → 0.15.31

package/dist/utils/createActionButton.d.ts

@@ -5,7 +5,7 @@ type PrimitiveButtonProps = ComponentPropsWithoutRef<typeof Primitive.button>;
 export type ActionButtonProps<THook> = PrimitiveButtonProps & (THook extends (props: infer TProps) => unknown ? TProps : never);
 export type ActionButtonElement = ComponentRef<typeof Primitive.button>;
 export declare const createActionButton: <TProps>(displayName: string, useActionButton: ActionButtonCallback<TProps>, forwardProps?: (keyof NonNullable<TProps>)[]) => import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<Omit<Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
-    asChild?: boolean;
+    asChild?: boolean | undefined;
 }, "ref"> & {
     render?: import("react").ReactElement | undefined;
 } & import("react").RefAttributes<HTMLButtonElement>, "ref"> & TProps> & import("react").RefAttributes<HTMLButtonElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@assistant-ui/react",
-  "version": "0.15.30",
+  "version": "0.15.31",
   "description": "Open-source TypeScript/React library for building production-grade AI chat experiences",
   "keywords": [
     "ai",
@@ -55,15 +55,15 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@assistant-ui/core": "^0.3.30",
+    "@assistant-ui/core": "^0.3.31",
     "@assistant-ui/store": "^0.3.22",
     "@assistant-ui/tap": "^0.9.24",
-    "assistant-cloud": "^0.2.7",
-    "assistant-stream": "^0.3.53",
-    "radix-ui": "^1.7.0",
+    "assistant-cloud": "^0.2.8",
+    "assistant-stream": "^0.3.54",
+    "radix-ui": "^1.8.1",
     "react-textarea-autosize": "^8.5.9",
     "safe-content-frame": "^0.0.34",
-    "zod": "^4.6.5",
+    "zod": "^4.6.7",
     "zustand": "^5.0.15"
   },
   "peerDependencies": {
@@ -82,17 +82,17 @@
   },
   "devDependencies": {
     "@assistant-ui/vite": "0.0.21",
-    "@assistant-ui/x-buildutils": "0.0.30",
+    "@assistant-ui/x-buildutils": "0.0.31",
     "@assistant-ui/x-react18": "0.0.0",
     "@testing-library/react": "^16.3.3",
     "@types/json-schema": "^7.0.15",
-    "@types/node": "^26.6.4",
+    "@types/node": "^26.6.5",
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
-    "jsdom": "^30.1.2",
-    "react": "^19.3.0",
-    "react-dom": "^19.3.0",
-    "vitest": "^5.0.3"
+    "jsdom": "^30.1.3",
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
+    "vitest": "^5.0.5"
   },
   "publishConfig": {
     "access": "public",

package/src/adapters/OpenAIRealtimeVoiceAdapter.test.ts

@@ -435,6 +435,11 @@ describe("OpenAIRealtimeVoiceAdapter", () => {
     const accepted = vi.fn();
     session.onTranscript(onTranscript);
     channel.emit({ type: "response.created" });
+    channel.emit({
+      type: "response.output_audio_transcript.delta",
+      item_id: "old-reply",
+      delta: "Previous reply",
+    });
     channel.emit({ type: "output_audio_buffer.started" });
     const sent = Promise.resolve(session.sendText!("Change the topic"));
     void sent.then(accepted);
@@ -448,6 +453,11 @@ describe("OpenAIRealtimeVoiceAdapter", () => {
       role: "user",
       content: [{ type: "input_text", text: "Change the topic" }],
     });
+    channel.emit({ type: "response.done", response: { status: "cancelled" } });
+    expect(onTranscript.mock.calls.map(([item]) => item)).toEqual([
+      { role: "assistant", text: "Previous reply", isFinal: false },
+      { role: "assistant", text: "Previous reply", isFinal: true },
+    ]);
     expect(accepted).not.toHaveBeenCalled();
     channel.emit({
       type: "conversation.item.added",
@@ -475,7 +485,10 @@ describe("OpenAIRealtimeVoiceAdapter", () => {
       response: { metadata: response.response.metadata },
     });
     await sent;
-    expect(onTranscript).not.toHaveBeenCalled();
+    expect(onTranscript.mock.calls.map(([item]) => item)).toEqual([
+      { role: "assistant", text: "Previous reply", isFinal: false },
+      { role: "assistant", text: "Previous reply", isFinal: true },
+    ]);
   });
 
   it("rejects a typed send whose response request fails after the item was accepted", async () => {

package/src/cloud-renderer/CloudRendererHost.tsx

@@ -17,10 +17,12 @@ import {
   type AssistantClient,
 } from "@assistant-ui/store";
 import { resource } from "@assistant-ui/tap";
-import { ReadonlyThreadProvider } from "@assistant-ui/core/react";
+import {
+  ReadonlyThreadProvider,
+  useExternalStoreRuntime,
+} from "@assistant-ui/core/react";
 import type { ThreadMessage } from "@assistant-ui/core";
 import { AssistantRuntimeProvider } from "../legacy-runtime/AssistantRuntimeProvider";
-import { useExternalStoreRuntime } from "../legacy-runtime/runtime-cores/external-store/useExternalStoreRuntime";
 
 const CHANNEL = "assistant-ui/cloud-renderer";
 

package/src/index.ts

@@ -60,7 +60,7 @@ export {
   SimpleTextAttachmentAdapter,
   CompositeAttachmentAdapter,
 } from "@assistant-ui/core";
-export { CloudFileAttachmentAdapter } from "./legacy-runtime/runtime-cores/adapters/attachment/CloudFileAttachmentAdapter";
+export { CloudFileAttachmentAdapter } from "@assistant-ui/core/react";
 
 // --- adapters/voice ---
 export type { RealtimeVoiceAdapter } from "@assistant-ui/core";
@@ -164,7 +164,7 @@ export {
   type ExternalThreadQueueAdapter,
   type ExternalThreadBranchAdapter,
 } from "@assistant-ui/core";
-export { useExternalStoreRuntime } from "./legacy-runtime/runtime-cores/external-store/useExternalStoreRuntime";
+export { useExternalStoreRuntime } from "@assistant-ui/core/react";
 export { useExternalStoreSharedOptions } from "@assistant-ui/core/react";
 export {
   useExternalMessageConverter,
@@ -174,11 +174,11 @@ export {
   createExternalMessageConversionCache as unstable_createExternalMessageConversionCache,
   /** @deprecated Experimental since 2026-09-15. Not scheduled for removal; the API may change in any release. */
   type ExternalMessageConversionCache as Unstable_ExternalMessageConversionCache,
-} from "./legacy-runtime/runtime-cores/external-store/external-message-converter";
+} from "@assistant-ui/core/react";
 export {
   /** @deprecated Experimental since 2025-02-02. Not scheduled for removal; the API may change in any release. */
   createMessageConverter as unstable_createMessageConverter,
-} from "./legacy-runtime/runtime-cores/external-store/createMessageConverter";
+} from "@assistant-ui/core/react";
 
 // --- local ---
 export type {
@@ -188,12 +188,12 @@ export type {
   ChatModelRunUpdate,
   LocalRuntimeOptionsBase,
 } from "@assistant-ui/core";
-export { useLocalRuntime } from "./legacy-runtime/runtime-cores/local/useLocalRuntime";
-export type { LocalRuntimeOptions } from "./legacy-runtime/runtime-cores/local/LocalRuntimeOptions";
+export { useLocalRuntime } from "@assistant-ui/core/react";
+export type { LocalRuntimeOptions } from "@assistant-ui/core/react";
 
 // --- remote-thread-list ---
-export { useRemoteThreadListRuntime } from "./legacy-runtime/runtime-cores/remote-thread-list/useRemoteThreadListRuntime";
-export { useCloudThreadListAdapter } from "./legacy-runtime/runtime-cores/remote-thread-list/adapter/cloud";
+export { useRemoteThreadListRuntime } from "@assistant-ui/core/react";
+export { useCloudThreadListAdapter } from "@assistant-ui/core/react";
 export type {
   RemoteThreadListAdapter,
   RemoteThreadListProviderComponent,
@@ -303,6 +303,7 @@ export type {
   QueueItemMethods,
 } from "@assistant-ui/core/store";
 export type { ComposerSendOptions } from "@assistant-ui/core/store";
+export type { ComposerTextOrigin } from "@assistant-ui/core";
 
 export { makeAssistantVisible } from "./model-context/makeAssistantVisible";
 

package/src/internal.ts

@@ -20,7 +20,7 @@ export type {
 } from "@assistant-ui/core/internal";
 
 // React-specific (stay in react)
-export { splitLocalRuntimeOptions } from "./legacy-runtime/runtime-cores/local/LocalRuntimeOptions";
+export { splitLocalRuntimeOptions } from "@assistant-ui/core/react";
 export type { ToolExecutionStatus } from "@assistant-ui/core";
 
 export { useSmooth } from "./utils/smooth/useSmooth";

package/src/legacy-runtime/AssistantRuntimeProvider.tsx

@@ -6,7 +6,7 @@ import {
   type AuiConfig,
   useAui,
 } from "@assistant-ui/store";
-import type { AssistantRuntime } from "./runtime/AssistantRuntime";
+import type { AssistantRuntime } from "@assistant-ui/core";
 import { AssistantProviderBase } from "@assistant-ui/core/react";
 import { ThreadPrimitiveViewportProvider } from "../context/providers/ThreadViewportProvider";
 import { DevToolsProviderApi } from "../devtools/DevToolsHooks";

package/src/primitives/actionBar/ActionBarCopy.test.tsx

@@ -0,0 +1,57 @@
+// @vitest-environment jsdom
+
+import {
+  act,
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from "@testing-library/react";
+import { afterEach, expect, it, vi } from "vitest";
+import type { ChatModelAdapter, ThreadMessageLike } from "@assistant-ui/core";
+import {
+  AssistantRuntimeProvider,
+  useLocalRuntime,
+} from "@assistant-ui/core/react";
+import { ThreadPrimitiveMessages } from "../thread/ThreadMessages";
+import { ActionBarPrimitiveCopy } from "./ActionBarCopy";
+
+const model: ChatModelAdapter = { async *run() {} };
+const initialMessages: ThreadMessageLike[] = [
+  {
+    role: "assistant",
+    content: [{ type: "text", text: "Message to copy." }],
+    status: { type: "complete", reason: "stop" },
+  },
+];
+const Message = () => (
+  <ActionBarPrimitiveCopy>Copy message</ActionBarPrimitiveCopy>
+);
+const Example = () => {
+  const runtime = useLocalRuntime(model, { initialMessages });
+  return (
+    <AssistantRuntimeProvider runtime={runtime}>
+      <ThreadPrimitiveMessages components={{ Message }} />
+    </AssistantRuntimeProvider>
+  );
+};
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+});
+
+it("copies the scoped message through the browser clipboard", async () => {
+  const writeText = vi.fn().mockResolvedValue(undefined);
+  vi.stubGlobal("navigator", { ...navigator, clipboard: { writeText } });
+  render(<Example />);
+  const button = screen.getByRole("button", { name: "Copy message" });
+
+  await act(async () => {
+    fireEvent.click(button);
+  });
+
+  expect(writeText).toHaveBeenCalledExactlyOnceWith("Message to copy.");
+  await waitFor(() => expect(button.getAttribute("data-copied")).toBe("true"));
+});

package/src/primitives/actionBar/ActionBarExportMarkdown.test.tsx

@@ -41,16 +41,24 @@ describe("ActionBarPrimitiveExportMarkdown", () => {
     vi.restoreAllMocks();
   });
 
-  it("clicks a download anchor that is attached to the document", async () => {
+  it("downloads the message as Markdown through an attached anchor", async () => {
     const createObjectURL = vi
       .spyOn(URL, "createObjectURL")
       .mockReturnValue("blob:export");
     vi.spyOn(URL, "revokeObjectURL").mockImplementation(() => {});
-    const connectedAtClick: boolean[] = [];
+    const downloads: {
+      isConnected: boolean;
+      href: string;
+      download: string;
+    }[] = [];
     vi.spyOn(HTMLAnchorElement.prototype, "click").mockImplementation(function (
       this: HTMLAnchorElement,
     ) {
-      connectedAtClick.push(this.isConnected);
+      downloads.push({
+        isConnected: this.isConnected,
+        href: this.href,
+        download: this.download,
+      });
     });
 
     await act(async () => {
@@ -65,9 +73,20 @@ describe("ActionBarPrimitiveExportMarkdown", () => {
       container.querySelector("button")!.click();
     });
 
-    expect(createObjectURL).toHaveBeenCalled();
+    expect(createObjectURL).toHaveBeenCalledOnce();
+    const blob = createObjectURL.mock.calls[0]![0] as Blob;
+    expect(blob.type).toBe("text/markdown");
+    const content = await new Promise<string>((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = () => resolve(reader.result as string);
+      reader.onerror = () => reject(reader.error);
+      reader.readAsText(blob);
+    });
+    expect(content).toBe("# Exported message");
     // Firefox ignores a programmatic click on a detached anchor.
-    expect(connectedAtClick).toEqual([true]);
+    expect(downloads).toEqual([
+      { isConnected: true, href: "blob:export", download: "message.md" },
+    ]);
     expect(document.querySelector('a[download="message.md"]')).toBeNull();
   });
 

package/src/primitives/assistantModal/AssistantModalRoot.test.tsx

@@ -10,7 +10,7 @@ import {
 import { useState } from "react";
 import { afterEach, describe, expect, it, vi } from "vitest";
 import { AssistantRuntimeProvider } from "../../context";
-import { useLocalRuntime } from "../../legacy-runtime/runtime-cores/local/useLocalRuntime";
+import { useLocalRuntime } from "@assistant-ui/core/react";
 import { AssistantModalPrimitiveContent } from "./AssistantModalContent";
 import { AssistantModalPrimitiveRoot } from "./AssistantModalRoot";
 import { AssistantModalPrimitiveTrigger } from "./AssistantModalTrigger";

package/src/primitives/composer/ComposerInput.focus-on-run-start.test.tsx

@@ -3,7 +3,7 @@
 import { act, fireEvent, render, screen } from "@testing-library/react";
 import { describe, expect, it } from "vitest";
 import { AssistantRuntimeProvider } from "../../context";
-import { useLocalRuntime } from "../../legacy-runtime/runtime-cores/local/useLocalRuntime";
+import { useLocalRuntime } from "@assistant-ui/core/react";
 import { ThreadPrimitiveRoot } from "../thread/ThreadRoot";
 import { ComposerPrimitiveInput } from "./ComposerInput";
 import { ComposerPrimitiveRoot } from "./ComposerRoot";

package/src/primitives/composer/ComposerInput.test.tsx

@@ -40,6 +40,7 @@ let pluginRegistry: { getPlugins: () => (typeof plugin)[] } | null = null;
 
 vi.mock("@assistant-ui/store", () => {
   const aui = {
+    optional: { threads: {} },
     composer: {
       setText: (text: string) => setText(text),
       getState: () => composerState,

package/src/primitives/composer/ComposerInput.text-change.test.tsx

@@ -0,0 +1,68 @@
+// @vitest-environment jsdom
+
+import {
+  act,
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+} from "@testing-library/react";
+import type { FC } from "react";
+import { afterEach, expect, it } from "vitest";
+import { useAui } from "@assistant-ui/store";
+import { useLocalRuntime } from "@assistant-ui/core/react";
+import type { ChatModelAdapter } from "@assistant-ui/core";
+import { AssistantRuntimeProvider } from "../../context";
+import { ThreadPrimitiveViewportProvider } from "../../context/providers/ThreadViewportProvider";
+import { ComposerPrimitiveInput } from "./ComposerInput";
+
+const adapter: ChatModelAdapter = {
+  async *run() {
+    yield { content: [{ type: "text", text: "done" }] };
+  },
+};
+
+afterEach(cleanup);
+
+it("emits composer.textChange with the user origin for typing and the send origin for the clear", async () => {
+  let aui!: ReturnType<typeof useAui>;
+  const Capture: FC = () => {
+    aui = useAui();
+    return null;
+  };
+  const App: FC = () => (
+    <AssistantRuntimeProvider runtime={useLocalRuntime(adapter)}>
+      <Capture />
+      <ThreadPrimitiveViewportProvider>
+        <ComposerPrimitiveInput aria-label="Composer" />
+      </ThreadPrimitiveViewportProvider>
+    </AssistantRuntimeProvider>
+  );
+  render(<App />);
+  const changes: unknown[] = [];
+  aui.on({ scope: "*", event: "composer.textChange" }, (change) =>
+    changes.push(change),
+  );
+  const input = screen.getByRole("textbox", { name: "Composer" });
+
+  await act(async () => {
+    fireEvent.change(input, { target: { value: "hi" } });
+  });
+  await act(async () => {
+    fireEvent.change(input, { target: { value: "" } });
+  });
+  await act(async () => {
+    fireEvent.change(input, { target: { value: "hello" } });
+  });
+  await act(async () => {
+    aui.composer().send();
+  });
+
+  const threadId = aui.threads().getState().mainThreadId;
+  expect(changes).toEqual([
+    { threadId, text: "hi", origin: "user" },
+    { threadId, text: "", origin: "user" },
+    { threadId, text: "hello", origin: "user" },
+    { threadId, text: "", origin: "send" },
+  ]);
+});

package/src/primitives/composer/ComposerInput.thread-scope.test.tsx

@@ -0,0 +1,82 @@
+// @vitest-environment jsdom
+
+import {
+  act,
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from "@testing-library/react";
+import { afterEach, expect, it } from "vitest";
+import { AuiConfig, AuiProvider, Derived, useAui } from "@assistant-ui/store";
+import { ExternalThread, InMemoryThreadList } from "@assistant-ui/core/store";
+import { resource, useResource } from "@assistant-ui/tap";
+import { ThreadPrimitiveViewportProvider } from "../../context/providers/ThreadViewportProvider";
+import { ComposerPrimitiveInput } from "./ComposerInput";
+
+const StandaloneThread = resource(function useStandaloneThread() {
+  return useResource(ExternalThread({ messages: [] }));
+});
+const StandaloneApp = () => {
+  const config = AuiConfig({
+    thread: StandaloneThread(),
+    composer: Derived({
+      source: "thread",
+      query: {},
+      get: (aui) => aui.thread.composer(),
+    }),
+  });
+  return (
+    <AuiProvider config={config}>
+      <ThreadPrimitiveViewportProvider>
+        <ComposerPrimitiveInput aria-label="Composer" />
+      </ThreadPrimitiveViewportProvider>
+    </AuiProvider>
+  );
+};
+
+afterEach(cleanup);
+
+it("edits a draft without a thread-list scope", async () => {
+  render(<StandaloneApp />);
+  const input = screen.getByRole("textbox", {
+    name: "Composer",
+  }) as HTMLTextAreaElement;
+  await act(async () => {
+    fireEvent.change(input, { target: { value: "New question" } });
+  });
+  expect(input.value).toBe("New question");
+});
+
+it("restores composer focus when the thread switches", async () => {
+  let captured!: ReturnType<typeof useAui>;
+  const App = () => {
+    const aui = useAui({
+      threads: InMemoryThreadList({
+        thread: () => ExternalThread({ messages: [] }),
+      }),
+    });
+    captured = aui;
+    return (
+      <AuiProvider value={aui}>
+        <ThreadPrimitiveViewportProvider>
+          <button>Outside</button>
+          <ComposerPrimitiveInput aria-label="Composer" autoFocus />
+        </ThreadPrimitiveViewportProvider>
+      </AuiProvider>
+    );
+  };
+  render(<App />);
+  const input = screen.getByRole("textbox", { name: "Composer" });
+  expect(document.activeElement).toBe(input);
+  act(() => screen.getByRole("button", { name: "Outside" }).focus());
+  const oldId = captured.threads.getState().mainThreadId;
+  await act(async () => {
+    captured.threads.switchToNewThread();
+  });
+  await waitFor(() =>
+    expect(captured.threads.getState().mainThreadId).not.toBe(oldId),
+  );
+  expect(document.activeElement).toBe(input);
+});

package/src/primitives/composer/ComposerInput.tsx

@@ -393,7 +393,8 @@ export const ComposerPrimitiveInput = forwardRef<
     useEffect(() => {
       if (
         aui.composer.getState().type !== "thread" ||
-        !unstable_focusOnThreadSwitched
+        !unstable_focusOnThreadSwitched ||
+        !aui.optional.threads
       )
         return undefined;
 
@@ -426,7 +427,7 @@ export const ComposerPrimitiveInput = forwardRef<
           const isComposing = nativeIsComposing || compositionRef.current;
           // Standalone tap roots need a synchronous flush while the input is composing.
           flushTapSync(() => {
-            aui.composer.setText(e.target.value);
+            aui.composer.setText(e.target.value, { origin: "user" });
           });
           if (isComposing) return;
           const pos = e.target.selectionStart ?? e.target.value.length;
@@ -453,7 +454,7 @@ export const ComposerPrimitiveInput = forwardRef<
           if (!aui.composer.getState().isEditing) return;
           const target = e.target as HTMLTextAreaElement;
           flushTapSync(() => {
-            aui.composer.setText(target.value);
+            aui.composer.setText(target.value, { origin: "user" });
           });
           const pos = target.selectionStart ?? target.value.length;
           if (pluginRegistry) {

package/src/primitives/composer/trigger/triggerSelectionResource.test.ts

@@ -77,7 +77,7 @@ describe("TriggerSelectionResource", () => {
 
     root.getValue().selectItem(item);
 
-    expect(setText).toHaveBeenCalledWith("@file.txt tail");
+    expect(setText).toHaveBeenCalledWith("@file.txt tail", { origin: "user" });
     expect(setCursorPosition).toHaveBeenCalledWith("@file.txt".length + 1);
     expect(onSelected).toHaveBeenCalledOnce();
   });
@@ -120,7 +120,7 @@ describe("TriggerSelectionResource", () => {
 
     root.getValue().selectItem(item);
 
-    expect(setText).toHaveBeenCalledWith("before tail");
+    expect(setText).toHaveBeenCalledWith("before tail", { origin: "user" });
     expect(setCursorPosition).toHaveBeenCalledWith(7);
   });
 
@@ -153,7 +153,7 @@ describe("TriggerSelectionResource", () => {
     root.getValue().selectItem(item);
 
     expect(setText).toHaveBeenCalledOnce();
-    expect(setText).toHaveBeenCalledWith("@file.txt ");
+    expect(setText).toHaveBeenCalledWith("@file.txt ", { origin: "user" });
     expect(textRef.value).toBe("@file.txt ");
   });
 
@@ -166,6 +166,8 @@ describe("TriggerSelectionResource", () => {
 
     root.getValue().selectItem(item);
 
-    expect(setText).toHaveBeenCalledWith("hello @file.txt tail");
+    expect(setText).toHaveBeenCalledWith("hello @file.txt tail", {
+      origin: "user",
+    });
   });
 });

package/src/primitives/composer/trigger/triggerSelectionResource.ts

@@ -90,6 +90,7 @@ const useTriggerSelectionResource = ({
       const directive = behavior.formatter.serialize(item);
       aui.composer.setText(
         before + directive + (after.startsWith(" ") ? after : ` ${after}`),
+        { origin: "user" },
       );
       setCursorPosition(before.length + directive.length + 1);
     };
@@ -101,6 +102,7 @@ const useTriggerSelectionResource = ({
       if (behavior.removeOnExecute) {
         aui.composer.setText(
           before + (after.startsWith(" ") ? after.slice(1) : after),
+          { origin: "user" },
         );
         setCursorPosition(before.length);
       } else {

package/src/primitives/thread/ThreadRoot.test.tsx

@@ -4,7 +4,7 @@ import { act, render, screen, waitFor } from "@testing-library/react";
 import type { FC, PropsWithChildren } from "react";
 import { describe, expect, it, vi } from "vitest";
 import { AssistantRuntimeProvider } from "../../context";
-import { useLocalRuntime } from "../../legacy-runtime/runtime-cores/local/useLocalRuntime";
+import { useLocalRuntime } from "@assistant-ui/core/react";
 import type {
   ChatModelAdapter,
   SpeechSynthesisAdapter,

package/src/primitives/thread/ThreadViewport.thread-scope.test.tsx

@@ -0,0 +1,51 @@
+// @vitest-environment jsdom
+
+import { cleanup, render } from "@testing-library/react";
+import { afterEach, beforeEach, expect, it, vi } from "vitest";
+import { AuiConfig, AuiProvider } from "@assistant-ui/store";
+import { resource, useResource } from "@assistant-ui/tap";
+import { ExternalThread } from "@assistant-ui/core/store";
+import { ThreadPrimitiveViewport } from "./ThreadViewport";
+
+const StandaloneThread = resource(function useStandaloneThread() {
+  return useResource(ExternalThread({ messages: [] }));
+});
+
+const Harness = ({ standalone }: { standalone: boolean }) => {
+  const config = AuiConfig({
+    thread: standalone ? StandaloneThread() : ExternalThread({ messages: [] }),
+  });
+  return (
+    <AuiProvider config={config}>
+      <ThreadPrimitiveViewport role="region" aria-label="Conversation">
+        Conversation content
+      </ThreadPrimitiveViewport>
+    </AuiProvider>
+  );
+};
+
+beforeEach(() => {
+  vi.stubGlobal(
+    "ResizeObserver",
+    class {
+      observe() {}
+      unobserve() {}
+      disconnect() {}
+    },
+  );
+});
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+});
+
+it.each([true, false])(
+  "renders a thread viewport with standalone=%s",
+  (standalone) => {
+    const view = render(<Harness standalone={standalone} />);
+    expect(view.getByRole("region", { name: "Conversation" }).textContent).toBe(
+      "Conversation content",
+    );
+  },
+);

package/src/primitives/thread/useThreadViewportAutoScroll.ts

@@ -2,6 +2,7 @@
 
 import {
   useCallback,
+  useEffect,
   useInsertionEffect,
   useRef,
   type RefCallback,
@@ -56,7 +57,7 @@ export const useThreadViewportAutoScroll = <TElement extends HTMLElement>({
   const divRef = useRef<TElement>(null);
   const hasMessages = useAuiState((s) => s.thread.messages.length > 0);
   const firstMessageId = useAuiState((s) => s.thread.messages[0]?.id);
-  const threadId = useAuiState((s) => s.threadListItem.id);
+  const threadId = useAuiState((s) => s.optional.threadListItem?.id);
   const isRunning = useAuiState((s) => s.thread.isRunning);
   const threadViewportStore = useThreadViewportStore();
   const binding = getThreadViewportAutoScroll(threadViewportStore);
@@ -105,7 +106,12 @@ export const useThreadViewportAutoScroll = <TElement extends HTMLElement>({
 
   useOnScrollToBottom(({ behavior }) => controller.scrollToBottom(behavior));
   useAuiEvent("thread.runStart", () => controller.runStarted());
-  useAuiEvent("threads.selectionChanged", () => controller.threadSwitched());
+  useEffect(() => {
+    if (!aui.optional.threads) return;
+    return aui.on("threads.selectionChanged", () =>
+      controller.threadSwitched(),
+    );
+  }, [aui, controller]);
 
   return useManagedRef(
     useCallback(