@assistant-ui/core 0.3.19 → 0.3.20

package/src/react/model-context/useInteractable.test.tsx

@@ -2,6 +2,20 @@
 
 import { cleanup, renderHook, waitFor } from "@testing-library/react";
 import { afterEach, describe, expect, it, vi } from "vitest";
+import type { Unstable_InteractableStateSchema } from "../types/scopes/interactables";
+
+type JsonSchema = Exclude<
+  Unstable_InteractableStateSchema,
+  { "~standard": unknown }
+>;
+type StandardSchemaWithJsonSchema = Extract<
+  Unstable_InteractableStateSchema,
+  { "~standard": unknown }
+> & {
+  "~standard": {
+    jsonSchema: { input: () => JsonSchema; output: () => JsonSchema };
+  };
+};
 
 const mocks = vi.hoisted(() => {
   const unregister = vi.fn();
@@ -42,17 +56,20 @@ afterEach(() => {
 describe("unstable_useInteractable", () => {
   it("refreshes the registration when its JSON schema changes", async () => {
     const schemaA = {
-      type: "object" as const,
+      type: "object",
       properties: { first: { type: "string" } },
-    };
+    } satisfies Unstable_InteractableStateSchema;
     const schemaB = {
-      type: "object" as const,
+      type: "object",
       properties: { second: { type: "number" } },
-    };
+    } satisfies Unstable_InteractableStateSchema;
     const initialA = { first: "one" };
     const initialB = { second: 2 };
 
-    const hook = renderHook(
+    const hook = renderHook<
+      unknown,
+      { stateSchema: Unstable_InteractableStateSchema; initialState: unknown }
+    >(
       ({ stateSchema, initialState }) =>
         unstable_useInteractable("panel", {
           id: "panel-1",
@@ -83,20 +100,26 @@ describe("unstable_useInteractable", () => {
   });
 
   it("stabilizes equivalent rebuilt standard schemas", async () => {
-    const createSchema = (property: string) => ({
+    const createSchema = (property: string): StandardSchemaWithJsonSchema => ({
       "~standard": {
-        version: 1 as const,
+        version: 1,
         vendor: "test",
-        validate: (value: unknown) => ({ value }),
-        toJSONSchema: () => ({
-          type: "object" as const,
-          properties: { [property]: { type: "string" as const } },
-        }),
+        validate: () => ({ value: {} }),
+        jsonSchema: {
+          input: () => ({
+            type: "object",
+            properties: { [property]: { type: "string" } },
+          }),
+          output: () => ({ type: "object" }),
+        },
       },
     });
     const firstSchema = createSchema("value");
 
-    const hook = renderHook(
+    const hook = renderHook<
+      unknown,
+      { stateSchema: Unstable_InteractableStateSchema }
+    >(
       ({ stateSchema }) =>
         unstable_useInteractable("panel", {
           id: "panel-1",
@@ -120,15 +143,19 @@ describe("unstable_useInteractable", () => {
   });
 
   it("keeps unsupported standard schemas from failing during render", async () => {
-    const createSchema = () => ({
-      "~standard": {
-        version: 1 as const,
-        vendor: "test",
-        validate: (value: unknown) => ({ value }),
-      },
-    });
-
-    const hook = renderHook(
+    const createSchema = () =>
+      ({
+        "~standard": {
+          version: 1 as const,
+          vendor: "test",
+          validate: () => ({ value: {} }),
+        },
+      }) satisfies Unstable_InteractableStateSchema;
+
+    const hook = renderHook<
+      unknown,
+      { stateSchema: Unstable_InteractableStateSchema }
+    >(
       ({ stateSchema }) =>
         unstable_useInteractable("panel", {
           id: "panel-1",
@@ -145,20 +172,20 @@ describe("unstable_useInteractable", () => {
   });
 
   it("converts a referentially stable schema only once", async () => {
-    const toJSONSchema = vi.fn(() => ({
+    const convert = vi.fn(() => ({
       type: "object" as const,
       properties: { value: { type: "string" as const } },
     }));
-    const stateSchema = {
+    const stateSchema: StandardSchemaWithJsonSchema = {
       "~standard": {
-        version: 1 as const,
+        version: 1,
         vendor: "test",
-        validate: (value: unknown) => ({ value }),
-        toJSONSchema,
+        validate: () => ({ value: {} }),
+        jsonSchema: { input: convert, output: convert },
       },
     };
 
-    const hook = renderHook(
+    const hook = renderHook<unknown, { initialState: Record<string, unknown> }>(
       ({ initialState }) =>
         unstable_useInteractable("panel", {
           id: "panel-1",
@@ -171,7 +198,7 @@ describe("unstable_useInteractable", () => {
     await waitFor(() => expect(mocks.register).toHaveBeenCalledTimes(1));
 
     hook.rerender({ initialState: { value: "second" } });
-    expect(toJSONSchema).toHaveBeenCalledTimes(1);
+    expect(convert).toHaveBeenCalledTimes(1);
     expect(mocks.register).toHaveBeenCalledTimes(1);
   });
 });

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

@@ -21,13 +21,13 @@ const mocks = vi.hoisted(() => {
     },
     aui: {
       message: {
-        getCopyText: () => "Hello",
+        getCopyText: (): string => "Hello",
         setIsCopied,
       },
     },
     currentAui: {
       message: {
-        getCopyText: () => "Hello",
+        getCopyText: (): string => "Hello",
         setIsCopied,
       },
     },
@@ -37,8 +37,8 @@ const mocks = vi.hoisted(() => {
 vi.mock("@assistant-ui/store", async (importOriginal) => ({
   ...(await importOriginal<typeof import("@assistant-ui/store")>()),
   useAui: () => mocks.currentAui,
-  useAuiState: ((selector: (state: typeof mocks.state) => unknown) =>
-    selector(mocks.state)) as typeof import("@assistant-ui/store").useAuiState,
+  useAuiState: (selector: (state: typeof mocks.state) => unknown) =>
+    selector(mocks.state),
 }));
 
 import { useActionBarCopy } from "./useActionBarCopy";
@@ -175,7 +175,7 @@ describe("useActionBarCopy", () => {
 
     mocks.currentAui = {
       message: {
-        getCopyText: () => "Next message",
+        getCopyText: (): string => "Next message",
         setIsCopied: nextSetIsCopied,
       },
     };

package/src/react/primitives/generativeUI/GenerativeUI.test.tsx

@@ -0,0 +1,54 @@
+/** @vitest-environment jsdom */
+import { render } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type { GenerativeUISpec } from "../../../types/message";
+import { GenerativeUIRender } from "./GenerativeUI";
+
+const Card = ({ children }: { children?: ReactNode }) => (
+  <section>{children}</section>
+);
+
+const renderRoot = (root: unknown) =>
+  render(
+    <GenerativeUIRender
+      spec={{ root } as GenerativeUISpec}
+      components={{ Card }}
+    />,
+  ).container.innerHTML;
+
+describe("GenerativeUIRender", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("renders a string children value as the only child", () => {
+    expect(renderRoot({ component: "Card", children: "Sunny" })).toBe(
+      "<section>Sunny</section>",
+    );
+  });
+
+  it("renders a node children value as the only child", () => {
+    expect(
+      renderRoot({
+        component: "Card",
+        children: { component: "Card", children: ["Sunny"] },
+      }),
+    ).toBe("<section><section>Sunny</section></section>");
+  });
+
+  it.each([
+    ["a number", 42],
+    ["an array-like object", { length: 1 }],
+  ])("skips %s children value as a malformed node", (_label, children) => {
+    const warn = vi.spyOn(console, "warn").mockImplementation(() => {});
+
+    expect(renderRoot({ component: "Card", children })).toBe(
+      "<section></section>",
+    );
+    expect(warn).toHaveBeenCalledWith(
+      "[generative-ui] Skipping malformed node at 0/0:",
+      children,
+    );
+  });
+});

package/src/react/primitives/generativeUI/GenerativeUI.tsx

@@ -41,6 +41,15 @@ const isObjectNode = (
 ): node is Exclude<GenerativeUINode, string> =>
   typeof node === "object" && node !== null;
 
+const toNodeList = (
+  value: GenerativeUINode | readonly GenerativeUINode[] | null | undefined,
+): readonly GenerativeUINode[] => {
+  if (value === undefined || value === null) return [];
+  return Array.isArray(value)
+    ? (value as readonly GenerativeUINode[])
+    : [value as GenerativeUINode];
+};
+
 const renderNode = (
   node: GenerativeUINode | undefined,
   components: GenerativeUIComponentRegistry,
@@ -75,29 +84,15 @@ const renderNode = (
     throw new GenerativeUIRenderError(component);
   }
 
-  const renderedChildren = children?.length
-    ? children.map((child, i) =>
-        renderNode(child, components, Fallback, `${path}/${i}`),
-      )
-    : undefined;
-
   return createElement(
     Resolved,
     { ...(props ?? {}), key: key ?? path },
-    ...(renderedChildren ?? []),
+    ...toNodeList(children).map((child, i) =>
+      renderNode(child, components, Fallback, `${path}/${i}`),
+    ),
   );
 };
 
-const normalizeRoot = (
-  spec: GenerativeUISpec | undefined,
-): readonly GenerativeUINode[] => {
-  if (!spec || spec.root === undefined || spec.root === null) return [];
-  const root = spec.root;
-  return Array.isArray(root)
-    ? (root as readonly GenerativeUINode[])
-    : [root as GenerativeUINode];
-};
-
 /**
  * Internal renderer. Resolves a {@link GenerativeUISpec} against the consumer
  * allowlist. Used by `MessagePrimitive.GenerativeUI` and by
@@ -108,7 +103,7 @@ export const GenerativeUIRender: FC<GenerativeUIRenderProps> = ({
   components,
   Fallback,
 }) => {
-  const nodes = useMemo(() => normalizeRoot(spec), [spec]);
+  const nodes = useMemo(() => toNodeList(spec?.root), [spec]);
 
   return (
     <>

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

@@ -19,7 +19,10 @@ type Msg = {
   }[];
 };
 
-const task = (toolCallId: string, hasResult: boolean) => ({
+const task = (
+  toolCallId: string,
+  hasResult: boolean,
+): Msg["content"][number] => ({
   type: "tool-call" as const,
   toolCallId,
   toolName: "task",

package/src/react/primitives/thread/ThreadMessages.test.tsx

@@ -13,18 +13,36 @@ import { AssistantRuntimeProvider } from "../../AssistantRuntimeProvider";
 import { useExternalStoreRuntime } from "../../runtimes/useExternalStoreRuntime";
 import { ThreadPrimitiveMessages } from "./ThreadMessages";
 
-const message = (id: string, role: "user" | "assistant") =>
-  ({
+const message = (
+  id: string,
+  role: "user" | "assistant",
+): ExternalThreadProps["messages"][number] => {
+  if (role === "assistant") {
+    return {
+      id,
+      createdAt: new Date(0),
+      role,
+      content: [{ type: "text", text: id }],
+      status: { type: "complete", reason: "stop" },
+      metadata: {
+        unstable_state: {},
+        unstable_annotations: [],
+        unstable_data: [],
+        steps: [],
+        custom: {},
+      },
+    };
+  }
+
+  return {
     id,
     createdAt: new Date(0),
     role,
     content: [{ type: "text", text: id }],
     attachments: [],
-    metadata: {
-      custom: {},
-    },
-    ...(role === "assistant" ? { status: { type: "complete" } } : undefined),
-  }) as ExternalThreadProps["messages"][number];
+    metadata: { custom: {} },
+  };
+};
 
 const StatefulMessage = ({ message }: { message: MessageState }) => {
   const [initialId] = useState(message.id);

package/src/react/runtimes/RemoteThreadListHookInstanceManager.layout.test.tsx

@@ -0,0 +1,62 @@
+// @vitest-environment jsdom
+
+import { act, render } from "@testing-library/react";
+import { StrictMode, useLayoutEffect, useState, type ReactNode } from "react";
+import { expect, it } from "vitest";
+import { makeAdapter } from "../../tests/remote-thread-list-test-helpers";
+import type { ThreadMessage } from "../../types/message";
+import { AssistantRuntimeProvider } from "../AssistantRuntimeProvider";
+import { useExternalStoreRuntime } from "./useExternalStoreRuntime";
+import { useRemoteThreadListRuntime } from "./useRemoteThreadListRuntime";
+
+const EMPTY_MESSAGES: readonly ThreadMessage[] = [];
+
+const renderCounterThread = async (wrap: (app: ReactNode) => ReactNode) => {
+  const adapter = makeAdapter();
+  let bump: (() => void) | undefined;
+  let count: number | undefined;
+  const bumpOnLayout = () => bump!();
+
+  const LayoutProbe = ({ onLayout }: { onLayout: () => void }) => {
+    useLayoutEffect(() => {
+      onLayout();
+    }, [onLayout]);
+    return null;
+  };
+  const App = () => {
+    const runtime = useRemoteThreadListRuntime({
+      adapter,
+      runtimeHook: function useCounterThreadRuntime() {
+        const [value, setValue] = useState(0);
+        bump = () => setValue((current) => current + 1);
+        count = value;
+        return useExternalStoreRuntime<ThreadMessage>({
+          messages: EMPTY_MESSAGES,
+          onNew: async () => {},
+        });
+      },
+    });
+    return (
+      <AssistantRuntimeProvider runtime={runtime}>
+        <LayoutProbe onLayout={bumpOnLayout} />
+      </AssistantRuntimeProvider>
+    );
+  };
+
+  await act(async () => {
+    render(wrap(<App />));
+  });
+
+  return count;
+};
+
+it("lets a descendant layout effect update a hosted thread on the mount commit", async () => {
+  expect(await renderCounterThread((app) => app)).toBe(1);
+});
+
+it("keeps the hosted thread committed through StrictMode's effect replay", async () => {
+  const count = await renderCounterThread((app) => (
+    <StrictMode>{app}</StrictMode>
+  ));
+  expect(count).toBe(2);
+});

package/src/react/runtimes/RemoteThreadListHookInstanceManager.retry.test.tsx

@@ -7,7 +7,7 @@ import { useExternalStoreRuntime } from "./useExternalStoreRuntime";
 import { useLocalRuntime } from "./useLocalRuntime";
 import { useRemoteThreadListRuntime } from "./useRemoteThreadListRuntime";
 import type { AssistantRuntime } from "../../runtime/api/assistant-runtime";
-import type { AppendMessage } from "../../types/message";
+import type { AppendMessage, ThreadMessage } from "../../types/message";
 import { makeAdapter } from "../../tests/remote-thread-list-test-helpers";
 
 const userMessage = (text: string): AppendMessage => ({
@@ -109,7 +109,7 @@ describe("RemoteThreadListHookInstanceManager initialization retry", () => {
   it("retries a rejected initialization for external-store runtimes", async () => {
     const onNew = vi.fn(async () => {});
     await testInitializationRetry(
-      () => useExternalStoreRuntime({ messages: [], onNew }),
+      () => useExternalStoreRuntime<ThreadMessage>({ messages: [], onNew }),
       onNew,
     );
   });

package/src/react/runtimes/RemoteThreadListHookInstanceManager.test.tsx

@@ -4,6 +4,13 @@ import { RemoteThreadListHookInstanceManager } from "./RemoteThreadListHookInsta
 import { ExternalStoreThreadRuntimeCore } from "../../runtimes/external-store/external-store-thread-runtime-core";
 import type { ExternalStoreAdapter } from "../../runtimes/external-store/external-store-adapter";
 import type { ModelContextProvider } from "../../model-context/types";
+import type { ThreadRuntimeCore } from "../../runtime/interfaces/thread-runtime-core";
+
+const createExternalStoreRuntime = () =>
+  new ExternalStoreThreadRuntimeCore(
+    { getModelContext: () => ({}) } satisfies ModelContextProvider,
+    { messages: [], onNew: async () => {} } satisfies ExternalStoreAdapter,
+  );
 
 describe("RemoteThreadListHookInstanceManager", () => {
   it("rejects a pending start when the thread runtime is stopped", async () => {
@@ -97,7 +104,7 @@ describe("RemoteThreadListHookInstanceManager.__internal_restartThreadRuntime",
     instances: Map<
       string,
       {
-        runtime?: unknown;
+        runtime?: ThreadRuntimeCore;
         publishedGeneration?: number;
         generation: number;
       }
@@ -161,7 +168,7 @@ describe("RemoteThreadListHookInstanceManager.__internal_restartThreadRuntime",
   const publish = (
     manager: RemoteThreadListHookInstanceManager,
     id: string,
-    runtime: unknown,
+    runtime: ThreadRuntimeCore,
     options?: { generation?: number },
   ) => {
     const instance = internalsOf(manager).instances.get(id)!;
@@ -173,24 +180,24 @@ describe("RemoteThreadListHookInstanceManager.__internal_restartThreadRuntime",
   it("does not settle with the pre-restart runtime; only the incoming binder's publication resolves it", async () => {
     const manager = makeManager();
     start(manager, "thread-1");
-    publish(manager, "thread-1", { tag: "pre-reload-runtime" });
+    const preReloadRuntime = createExternalStoreRuntime();
+    const postReloadRuntime = createExternalStoreRuntime();
+    publish(manager, "thread-1", preReloadRuntime);
 
     let settledWith = "NOT_SETTLED";
-    manager.__internal_restartThreadRuntime("thread-1").then((r) => {
-      settledWith = (r as { tag: string }).tag;
+    manager.__internal_restartThreadRuntime("thread-1").then((runtime) => {
+      settledWith = runtime === postReloadRuntime ? "post-reload-runtime" : "";
     });
 
     // the outgoing runtime rides across the restart (stays readable)…
-    expect(manager.getThreadRuntimeCore("thread-1")).toEqual({
-      tag: "pre-reload-runtime",
-    });
+    expect(manager.getThreadRuntimeCore("thread-1")).toBe(preReloadRuntime);
     // …but must not count as attached
     await Promise.resolve();
     await Promise.resolve();
     await Promise.resolve();
     expect(settledWith).toBe("NOT_SETTLED");
 
-    publish(manager, "thread-1", { tag: "post-reload-runtime" });
+    publish(manager, "thread-1", postReloadRuntime);
     await Promise.resolve();
     expect(settledWith).toBe("post-reload-runtime");
   });
@@ -198,19 +205,20 @@ describe("RemoteThreadListHookInstanceManager.__internal_restartThreadRuntime",
   it("keeps the outgoing runtime readable while the restart promise is pending", () => {
     const manager = makeManager();
     start(manager, "thread-1");
-    publish(manager, "thread-1", { tag: "pre-reload-runtime" });
+    const preReloadRuntime = createExternalStoreRuntime();
+    publish(manager, "thread-1", preReloadRuntime);
 
     restart(manager, "thread-1");
 
-    expect(manager.getThreadRuntimeCore("thread-1")).toEqual({
-      tag: "pre-reload-runtime",
-    });
+    expect(manager.getThreadRuntimeCore("thread-1")).toBe(preReloadRuntime);
   });
 
   it("a stale-generation publication does not resolve the restart promise", async () => {
     const manager = makeManager();
     start(manager, "thread-1");
-    publish(manager, "thread-1", { tag: "pre-reload-runtime" });
+    const preReloadRuntime = createExternalStoreRuntime();
+    const staleRuntime = createExternalStoreRuntime();
+    publish(manager, "thread-1", preReloadRuntime);
 
     let settled = false;
     manager.__internal_restartThreadRuntime("thread-1").then(() => {
@@ -221,12 +229,7 @@ describe("RemoteThreadListHookInstanceManager.__internal_restartThreadRuntime",
     // outerSubscribe callback) must not count as the new attachment
     const staleGeneration =
       internalsOf(manager).instances.get("thread-1")!.generation - 1;
-    publish(
-      manager,
-      "thread-1",
-      { tag: "stale-publication" },
-      { generation: staleGeneration },
-    );
+    publish(manager, "thread-1", staleRuntime, { generation: staleGeneration });
 
     await Promise.resolve();
     await Promise.resolve();

package/src/react/runtimes/RemoteThreadListHookInstanceManager.title.test.tsx

@@ -8,7 +8,9 @@ import { useExternalStoreRuntime } from "./useExternalStoreRuntime";
 import { useLocalRuntime } from "./useLocalRuntime";
 import { useRemoteThreadListRuntime } from "./useRemoteThreadListRuntime";
 import type { AssistantRuntime } from "../../runtime/api/assistant-runtime";
-import type { AppendMessage, ThreadMessageLike } from "../../types/message";
+import type { AppendMessage } from "../../types/message";
+import type { ThreadMessageLike } from "../../runtime/utils/thread-message-like";
+import type { RemoteThreadListAdapter } from "../../runtimes/remote-thread-list/types";
 import {
   deferred,
   makeAdapter,
@@ -41,7 +43,9 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
       remoteId: string;
       externalId: string;
     }>();
-    const generateTitle = vi.fn(async () => new ReadableStream());
+    const generateTitle = vi.fn<RemoteThreadListAdapter["generateTitle"]>(
+      async () => new ReadableStream(),
+    );
     const adapter = makeAdapter({
       initialize: vi.fn(() => initialization.promise),
       generateTitle,
@@ -95,7 +99,9 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
       remoteId: string;
       externalId: string;
     }>();
-    const generateTitle = vi.fn(async () => new ReadableStream());
+    const generateTitle = vi.fn<RemoteThreadListAdapter["generateTitle"]>(
+      async () => new ReadableStream(),
+    );
     const adapter = makeAdapter({
       initialize: vi.fn(() => initialization.promise),
       generateTitle,
@@ -136,10 +142,9 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
     await waitFor(() => {
       expect(generateTitle).toHaveBeenCalledTimes(1);
     });
-    const [, titledMessages] = generateTitle.mock.calls[0] as [
-      string,
-      readonly { role: string }[],
-    ];
+    const titleCall = generateTitle.mock.calls[0];
+    if (titleCall === undefined) throw new Error("Expected title generation");
+    const [, titledMessages] = titleCall;
     expect(titledMessages.map((message) => message.role)).toEqual(["user"]);
   });
 
@@ -149,7 +154,9 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
       externalId: string;
     }>();
     const run = deferred<{ content: { type: "text"; text: string }[] }>();
-    const generateTitle = vi.fn(async () => new ReadableStream());
+    const generateTitle = vi.fn<RemoteThreadListAdapter["generateTitle"]>(
+      async () => new ReadableStream(),
+    );
     const adapter = makeAdapter({
       initialize: vi.fn(() => initialization.promise),
       generateTitle,
@@ -193,17 +200,18 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
     await waitFor(() => {
       expect(generateTitle).toHaveBeenCalledTimes(1);
     });
-    const [, titledMessages] = generateTitle.mock.calls[0] as [
-      string,
-      readonly { role: string }[],
-    ];
+    const titleCall = generateTitle.mock.calls[0];
+    if (titleCall === undefined) throw new Error("Expected title generation");
+    const [, titledMessages] = titleCall;
     expect(titledMessages.map((message) => message.role)).toEqual([
       "assistant",
     ]);
   });
 
   it("waits for the first message when initialization resolves before the store lands it", async () => {
-    const generateTitle = vi.fn(async () => new ReadableStream());
+    const generateTitle = vi.fn<RemoteThreadListAdapter["generateTitle"]>(
+      async () => new ReadableStream(),
+    );
     const adapter = makeAdapter({ generateTitle });
     const store = {
       messages: [] as readonly ThreadMessageLike[],
@@ -262,10 +270,9 @@ describe("RemoteThreadListHookInstanceManager title generation", () => {
     await waitFor(() => {
       expect(generateTitle).toHaveBeenCalledTimes(1);
     });
-    const [, titledMessages] = generateTitle.mock.calls[0] as [
-      string,
-      readonly { role: string }[],
-    ];
+    const titleCall = generateTitle.mock.calls[0];
+    if (titleCall === undefined) throw new Error("Expected title generation");
+    const [, titledMessages] = titleCall;
     expect(titledMessages).toHaveLength(1);
     expect(titledMessages[0]).toMatchObject({ role: "user" });
   });