@assistant-ui/react 0.14.13 → 0.14.15

package/src/mcp-apps/bridge.test.ts

@@ -1,6 +1,10 @@
 // @vitest-environment jsdom
 import { describe, expect, it, vi } from "vitest";
-import { createMcpAppBridge, type McpAppBridgeFrame } from "./bridge";
+import {
+  createMcpAppBridge,
+  type McpAppBridge,
+  type McpAppBridgeFrame,
+} from "./bridge";
 import type {
   McpAppJsonRpcMessage,
   McpAppJsonRpcRequest,
@@ -24,13 +28,8 @@ function makeFrame() {
   return { frame, captured };
 }
 
-function dispatch(frame: McpAppBridgeFrame, message: McpAppJsonRpcMessage) {
-  const event = new MessageEvent("message", {
-    data: message,
-    origin: frame.origin,
-    source: frame.iframe.contentWindow,
-  });
-  window.dispatchEvent(event);
+function deliver(bridge: McpAppBridge, message: McpAppJsonRpcMessage) {
+  bridge.onMessage(new MessageEvent("message", { data: message }));
 }
 
 async function flush() {
@@ -55,7 +54,7 @@ describe("createMcpAppBridge", () => {
       id: 1,
       method: "ui/initialize",
     };
-    dispatch(frame, req);
+    deliver(bridge, req);
     await flush();
 
     expect(captured).toHaveLength(1);
@@ -69,6 +68,34 @@ describe("createMcpAppBridge", () => {
     expect(result["capabilities"]["ui"]["sendMessage"]).toBe(true);
     expect(result["capabilities"]["ui"]["openLink"]).toBe(false);
 
+    expect(result["hostInfo"]).toEqual({ name: "test-host", version: "9.9.9" });
+    expect(result["hostCapabilities"]).toEqual({
+      serverTools: {},
+      message: { text: {} },
+    });
+
+    bridge.dispose();
+  });
+
+  it("echoes the requested protocolVersion in the ui/initialize result", async () => {
+    const { frame, captured } = makeFrame();
+    const bridge = createMcpAppBridge({ frame });
+
+    deliver(bridge, {
+      jsonrpc: "2.0",
+      id: 1,
+      method: "ui/initialize",
+      params: { protocolVersion: "2026-01-26" },
+    });
+    await flush();
+
+    const result = (captured[0] as McpAppJsonRpcResponse).result as Record<
+      string,
+      any
+    >;
+    expect(result["protocolVersion"]).toBe("2026-01-26");
+    expect(result["hostCapabilities"]).toEqual({});
+
     bridge.dispose();
   });
 
@@ -77,7 +104,7 @@ describe("createMcpAppBridge", () => {
     const callTool = vi.fn().mockResolvedValue({ ok: true });
     const bridge = createMcpAppBridge({ frame, handlers: { callTool } });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 7,
       method: "tools/call",
@@ -105,7 +132,7 @@ describe("createMcpAppBridge", () => {
       handlers: { callTool, allowedTools: ["search"] },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 2,
       method: "tools/call",
@@ -123,7 +150,7 @@ describe("createMcpAppBridge", () => {
     const { frame, captured } = makeFrame();
     const bridge = createMcpAppBridge({ frame });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 3,
       method: "tools/call",
@@ -141,7 +168,7 @@ describe("createMcpAppBridge", () => {
     const callTool = vi.fn();
     const bridge = createMcpAppBridge({ frame, handlers: { callTool } });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 11,
       method: "tools/call",
@@ -162,7 +189,7 @@ describe("createMcpAppBridge", () => {
       handlers: { requestDisplayMode },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 13,
       method: "requestDisplayMode",
@@ -180,7 +207,7 @@ describe("createMcpAppBridge", () => {
     const openLink = vi.fn();
     const bridge = createMcpAppBridge({ frame, handlers: { openLink } });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 12,
       method: "openLink",
@@ -202,12 +229,12 @@ describe("createMcpAppBridge", () => {
       handlers: { onSizeChange, onInitialized },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       method: "notifications/size_changed",
       params: { width: 320, height: 240 },
     });
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       method: "notifications/initialized",
     });
@@ -217,7 +244,7 @@ describe("createMcpAppBridge", () => {
     bridge.dispose();
   });
 
-  it("notifyToolInput / notifyToolResult / notifyHostContextChanged post correct notifications", () => {
+  it("notifyToolInput / notifyToolResult / notifyHostContextChanged post both legacy and 2026-01-26 notifications", () => {
     const { frame, captured } = makeFrame();
     const bridge = createMcpAppBridge({ frame });
 
@@ -231,16 +258,62 @@ describe("createMcpAppBridge", () => {
         method: "notifications/tools/call/input",
         params: { input: { a: 1 } },
       },
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-input",
+        params: { arguments: { a: 1 } },
+      },
       {
         jsonrpc: "2.0",
         method: "notifications/tools/call/result",
         params: { result: { ok: 1 } },
       },
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-result",
+        params: { ok: 1 },
+      },
       {
         jsonrpc: "2.0",
         method: "notifications/host_context/changed",
         params: { theme: "light" },
       },
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/host-context-changed",
+        params: { theme: "light" },
+      },
+    ]);
+    bridge.dispose();
+  });
+
+  it("wraps non-object and array tool results in a valid content block for the spec dialect", () => {
+    const { frame, captured } = makeFrame();
+    const bridge = createMcpAppBridge({ frame });
+
+    bridge.notifyToolResult("done");
+    bridge.notifyToolResult([1, 2]);
+    bridge.notifyToolInput(null);
+
+    const spec = captured.filter((c) =>
+      (c as { method?: string }).method?.startsWith("ui/notifications/"),
+    );
+    expect(spec).toEqual([
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-result",
+        params: { content: [{ type: "text", text: "done" }] },
+      },
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-result",
+        params: { content: [{ type: "text", text: "1,2" }] },
+      },
+      {
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-input",
+        params: {},
+      },
     ]);
     bridge.dispose();
   });
@@ -254,13 +327,13 @@ describe("createMcpAppBridge", () => {
       handlers: { readResource, listResources },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 20,
       method: "resources/read",
       params: { uri: "ui://app/x" },
     });
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 21,
       method: "resources/list",
@@ -279,13 +352,13 @@ describe("createMcpAppBridge", () => {
     const { frame, captured } = makeFrame();
     const bridge = createMcpAppBridge({ frame });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 22,
       method: "resources/read",
       params: { uri: "ui://x" },
     });
-    dispatch(frame, { jsonrpc: "2.0", id: 23, method: "resources/list" });
+    deliver(bridge, { jsonrpc: "2.0", id: 23, method: "resources/list" });
     await flush();
 
     expect((captured[0] as McpAppJsonRpcResponse).error?.code).toBe(-32601);
@@ -302,13 +375,13 @@ describe("createMcpAppBridge", () => {
       handlers: { sendMessage, updateModelContext },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 30,
       method: "sendMessage",
       params: { text: "hi" },
     });
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       id: 31,
       method: "updateModelContext",
@@ -334,17 +407,17 @@ describe("createMcpAppBridge", () => {
       handlers: { onLog, onError, onRequestTeardown },
     });
 
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       method: "notifications/log",
       params: { level: "info", message: "hello" },
     });
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       method: "notifications/error",
       params: { message: "kaboom" },
     });
-    dispatch(frame, {
+    deliver(bridge, {
       jsonrpc: "2.0",
       method: "notifications/request_teardown",
       params: { reason: "done" },
@@ -355,37 +428,4 @@ describe("createMcpAppBridge", () => {
     expect(onRequestTeardown).toHaveBeenCalledWith({ reason: "done" });
     bridge.dispose();
   });
-
-  it("ignores messages from wrong origin or wrong source", async () => {
-    const { frame, captured } = makeFrame();
-    const callTool = vi.fn();
-    const bridge = createMcpAppBridge({ frame, handlers: { callTool } });
-
-    const msg: McpAppJsonRpcMessage = {
-      jsonrpc: "2.0",
-      id: 1,
-      method: "tools/call",
-      params: { name: "search" },
-    };
-
-    window.dispatchEvent(
-      new MessageEvent("message", {
-        data: msg,
-        origin: "https://attacker.example",
-        source: frame.iframe.contentWindow,
-      }),
-    );
-    window.dispatchEvent(
-      new MessageEvent("message", {
-        data: msg,
-        origin: frame.origin,
-        source: window,
-      }),
-    );
-    await flush();
-
-    expect(callTool).not.toHaveBeenCalled();
-    expect(captured).toHaveLength(0);
-    bridge.dispose();
-  });
 });

package/src/mcp-apps/bridge.ts

@@ -1,4 +1,4 @@
-import type { RenderedFrame } from "safe-content-frame";
+import type { SandboxHostFrame } from "../sandbox-host/SandboxHost";
 import {
   MCP_APP_PROTOCOL_VERSION,
   type McpAppBridgeHandlers,
@@ -10,6 +10,7 @@ import {
   type McpAppJsonRpcRequest,
   type McpAppJsonRpcResponse,
 } from "./types";
+import { isRecord } from "../utils/json/is-json";
 
 const VALID_DISPLAY_MODES = [
   "inline",
@@ -17,20 +18,17 @@ const VALID_DISPLAY_MODES = [
   "pip",
 ] as const satisfies readonly McpAppDisplayMode[];
 
-export type McpAppBridgeFrame = Pick<
-  RenderedFrame,
-  "iframe" | "origin" | "sendMessage"
->;
+export type McpAppBridgeFrame = SandboxHostFrame;
 
 export type CreateMcpAppBridgeOptions = {
   frame: McpAppBridgeFrame;
   handlers?: McpAppBridgeHandlers | undefined;
   hostInfo?: McpAppHostInfo | undefined;
   hostContext?: McpAppHostContext | undefined;
-  targetWindow?: Window | undefined;
 };
 
 export type McpAppBridge = {
+  onMessage: (event: MessageEvent) => void;
   dispose: () => void;
   notifyToolInput: (input: unknown) => void;
   notifyToolResult: (result: unknown) => void;
@@ -90,13 +88,8 @@ export function createMcpAppBridge(
     handlers = {},
     hostInfo = DEFAULT_HOST_INFO,
     hostContext = {},
-    targetWindow = typeof window !== "undefined" ? window : undefined,
   } = opts;
 
-  if (!targetWindow) {
-    throw new Error("createMcpAppBridge requires a window context");
-  }
-
   const post = (msg: McpAppJsonRpcMessage) => {
     frame.sendMessage(msg);
   };
@@ -136,10 +129,15 @@ export function createMcpAppBridge(
 
       switch (normalizeMethod(req.method)) {
         case "ui/initialize": {
+          const requestedProtocolVersion =
+            isRecord(params) && typeof params.protocolVersion === "string"
+              ? params.protocolVersion
+              : MCP_APP_PROTOCOL_VERSION;
           respond(req.id, {
             result: {
-              protocolVersion: MCP_APP_PROTOCOL_VERSION,
+              protocolVersion: requestedProtocolVersion,
               host: hostInfo,
+              hostInfo,
               hostContext,
               capabilities: {
                 tools: handlers.callTool ? {} : undefined,
@@ -154,6 +152,18 @@ export function createMcpAppBridge(
                   updateModelContext: !!handlers.updateModelContext,
                 },
               },
+              hostCapabilities: {
+                ...(handlers.openLink ? { openLinks: {} } : {}),
+                ...(handlers.callTool ? { serverTools: {} } : {}),
+                ...(handlers.readResource || handlers.listResources
+                  ? { serverResources: {} }
+                  : {}),
+                ...(handlers.updateModelContext
+                  ? { updateModelContext: { text: {} } }
+                  : {}),
+                ...(handlers.sendMessage ? { message: { text: {} } } : {}),
+                ...(handlers.onLog ? { logging: {} } : {}),
+              },
             },
           });
           return;
@@ -405,11 +415,9 @@ export function createMcpAppBridge(
     }
   };
 
-  // Cross-origin guard: ignore any postMessage not originating from this
-  // app's iframe contentWindow at the SafeContentFrame-issued origin.
+  // The host applies the cross-origin guard before delegating; this only
+  // validates the JSON-RPC envelope.
   const onMessage = (event: MessageEvent) => {
-    if (event.source !== frame.iframe.contentWindow) return;
-    if (event.origin !== frame.origin) return;
     if (!isJsonRpcMessage(event.data)) return;
 
     const msg = event.data;
@@ -420,18 +428,20 @@ export function createMcpAppBridge(
     }
   };
 
-  targetWindow.addEventListener("message", onMessage);
-
   return {
-    dispose: () => {
-      targetWindow.removeEventListener("message", onMessage);
-    },
+    onMessage,
+    dispose: () => {},
     notifyToolInput: (input: unknown) => {
       post({
         jsonrpc: "2.0",
         method: "notifications/tools/call/input",
         params: { input },
       });
+      post({
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-input",
+        params: isRecord(input) ? { arguments: input } : {},
+      });
     },
     notifyToolResult: (result: unknown) => {
       post({
@@ -439,6 +449,13 @@ export function createMcpAppBridge(
         method: "notifications/tools/call/result",
         params: { result },
       });
+      post({
+        jsonrpc: "2.0",
+        method: "ui/notifications/tool-result",
+        params: isRecord(result)
+          ? result
+          : { content: [{ type: "text", text: String(result) }] },
+      });
     },
     notifyHostContextChanged: (ctx: McpAppHostContext) => {
       post({
@@ -446,6 +463,11 @@ export function createMcpAppBridge(
         method: "notifications/host_context/changed",
         params: ctx,
       });
+      post({
+        jsonrpc: "2.0",
+        method: "ui/notifications/host-context-changed",
+        params: ctx,
+      });
     },
   };
 }

package/src/mcp-apps/types.ts

@@ -1,9 +1,8 @@
-import type { CSSProperties } from "react";
 import type {
   McpAppMetadata,
   ToolCallMessagePartMcpMetadata,
 } from "@assistant-ui/core";
-import type { SandboxOption } from "safe-content-frame";
+import type { SandboxHostConfig } from "../sandbox-host/SandboxHost";
 
 export type { McpAppMetadata, ToolCallMessagePartMcpMetadata };
 
@@ -97,16 +96,7 @@ export type McpAppBridgeHandlers = {
   onError?: (error: Error) => void;
 };
 
-export type McpAppSandboxConfig = {
-  sandbox?: SandboxOption[];
-  useShadowDom?: boolean;
-  enableBrowserCaching?: boolean;
-  salt?: string;
-  product?: string;
-  className?: string;
-  style?: CSSProperties;
-  unsafeDocumentWrite?: boolean;
-};
+export type McpAppSandboxConfig = SandboxHostConfig;
 
 export type McpAppFrameProps = {
   app: McpAppMetadata;

package/src/primitives/composer/trigger/TriggerPopover.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useAui, useAuiState } from "@assistant-ui/store";
-import { useResource } from "@assistant-ui/tap/react";
+import { useResource } from "@assistant-ui/tap";
 import type { Unstable_TriggerAdapter } from "@assistant-ui/core";
 import {
   createContext,

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

@@ -1,4 +1,5 @@
-import { resource, tapEffectEvent, tapResource } from "@assistant-ui/tap";
+import { useEffectEvent } from "react";
+import { useResource, resource } from "@assistant-ui/tap";
 import type {
   Unstable_TriggerAdapter,
   Unstable_TriggerCategory,
@@ -50,88 +51,86 @@ export type TriggerPopoverResourceOutput = {
 };
 
 /** Composes detection, navigation, keyboard, and selection sub-resources. */
-export const TriggerPopoverResource = resource(
-  ({
-    adapter,
-    text,
-    triggerChar,
-    behavior,
-    aui,
-    popoverId,
-  }: {
-    adapter: Unstable_TriggerAdapter | undefined;
-    text: string;
-    triggerChar: string;
-    behavior: TriggerBehavior | undefined;
-    aui: AssistantClient;
-    /** Stable ID for accessible element IDs (pass React's useId() from component layer). */
-    popoverId: string;
-  }): TriggerPopoverResourceOutput => {
-    const detection = tapResource(
-      TriggerDetectionResource({ text, triggerChar }),
-    );
-
-    const open =
-      detection.trigger !== null &&
-      adapter !== undefined &&
-      behavior !== undefined;
+export const TriggerPopoverResource = resource(function TriggerPopoverResource({
+  adapter,
+  text,
+  triggerChar,
+  behavior,
+  aui,
+  popoverId,
+}: {
+  adapter: Unstable_TriggerAdapter | undefined;
+  text: string;
+  triggerChar: string;
+  behavior: TriggerBehavior | undefined;
+  aui: AssistantClient;
+  /** Stable ID for accessible element IDs (pass React's useId() from component layer). */
+  popoverId: string;
+}): TriggerPopoverResourceOutput {
+  const detection = useResource(
+    TriggerDetectionResource({ text, triggerChar }),
+  );
 
-    const navigation = tapResource(
-      TriggerNavigationResource({
-        adapter,
-        query: detection.query,
-        open,
-      }),
-    );
+  const open =
+    detection.trigger !== null &&
+    adapter !== undefined &&
+    behavior !== undefined;
 
-    const onSelected = tapEffectEvent(() => {
-      navigation.goBack();
-    });
+  const navigation = useResource(
+    TriggerNavigationResource({
+      adapter,
+      query: detection.query,
+      open,
+    }),
+  );
 
-    const selection = tapResource(
-      TriggerSelectionResource({
-        behavior,
-        trigger: detection.trigger,
-        aui,
-        triggerChar,
-        setCursorPosition: detection.setCursorPosition,
-        onSelected,
-      }),
-    );
+  const onSelected = useEffectEvent(() => {
+    navigation.goBack();
+  });
 
-    const keyboard = tapResource(
-      TriggerKeyboardResource({
-        navigableList: navigation.navigableList,
-        isSearchMode: navigation.isSearchMode,
-        activeCategoryId: navigation.activeCategoryId,
-        query: detection.query,
-        popoverId,
-        open,
-        selectItem: selection.selectItem,
-        selectCategory: navigation.selectCategory,
-        goBack: navigation.goBack,
-        close: selection.close,
-      }),
-    );
+  const selection = useResource(
+    TriggerSelectionResource({
+      behavior,
+      trigger: detection.trigger,
+      aui,
+      triggerChar,
+      setCursorPosition: detection.setCursorPosition,
+      onSelected,
+    }),
+  );
 
-    return {
-      open,
-      query: detection.query,
-      activeCategoryId: navigation.activeCategoryId,
-      categories: navigation.categories,
-      items: navigation.items,
-      highlightedIndex: keyboard.highlightedIndex,
+  const keyboard = useResource(
+    TriggerKeyboardResource({
+      navigableList: navigation.navigableList,
       isSearchMode: navigation.isSearchMode,
+      activeCategoryId: navigation.activeCategoryId,
+      query: detection.query,
       popoverId,
-      highlightedItemId: keyboard.highlightedItemId,
+      open,
+      selectItem: selection.selectItem,
       selectCategory: navigation.selectCategory,
       goBack: navigation.goBack,
-      selectItem: selection.selectItem,
       close: selection.close,
-      highlightIndex: keyboard.highlightIndex,
-      handleKeyDown: keyboard.handleKeyDown,
-      setCursorPosition: detection.setCursorPosition,
-      registerSelectItemOverride: selection.registerSelectItemOverride,
-    };
-  },
-);
+    }),
+  );
+
+  return {
+    open,
+    query: detection.query,
+    activeCategoryId: navigation.activeCategoryId,
+    categories: navigation.categories,
+    items: navigation.items,
+    highlightedIndex: keyboard.highlightedIndex,
+    isSearchMode: navigation.isSearchMode,
+    popoverId,
+    highlightedItemId: keyboard.highlightedItemId,
+    selectCategory: navigation.selectCategory,
+    goBack: navigation.goBack,
+    selectItem: selection.selectItem,
+    close: selection.close,
+    highlightIndex: keyboard.highlightIndex,
+    handleKeyDown: keyboard.handleKeyDown,
+    setCursorPosition: detection.setCursorPosition,
+    registerSelectItemOverride: selection.registerSelectItemOverride,
+  };
+});