@tanstack/ai-svelte 0.23.3 → 0.24.1

package/dist/chat-ui/create-ui.d.ts

@@ -83,7 +83,7 @@ export declare function getUIContext<TOptions>(ui: UIDescriptor<TOptions>): {
     chat: ChatUIHost<TOptions>;
     components: ChatUIComponents<TOptions>;
 };
-export declare function readMessages<TOptions>(chat: ChatUIHost<TOptions>): UIMessage<ChatUIToolsOf<TOptions>, ChatUISchemaOf<TOptions> extends infer T ? T extends ChatUISchemaOf<TOptions> ? T extends import("@tanstack/ai").SchemaInput ? import("@tanstack/ai").InferSchemaType<T> : unknown : never : never>[];
+export declare function readMessages<TOptions>(chat: ChatUIHost<TOptions>): UIMessage<ChatUIToolsOf<TOptions>, ChatUISchemaOf<TOptions> extends infer T ? T extends ChatUISchemaOf<TOptions> ? T extends import("@tanstack/ai").SchemaInput ? import("@tanstack/ai").InferSchemaType<T> : unknown : never : never, undefined>[];
 export declare function readInterrupts<TOptions>(chat: ChatUIHost<TOptions>): import("@tanstack/ai-client").BoundInterrupts<ChatUIToolsOf<TOptions>, ChatUIInterruptsOf<TOptions>>;
 export declare function readQueue<TOptions>(chat: ChatUIHost<TOptions>): {
     cancelQueued: () => void;

package/dist/create-chat.svelte.js

@@ -173,6 +173,18 @@ export function createChat(options) {
     }
     client.mountDevtools();
     if (typeof window !== 'undefined') {
+        try {
+            // Sync tools, so a getter such as `get tools() { return page.tools }`
+            // updates the client.
+            $effect.pre(() => {
+                const tools = options.tools;
+                if (tools !== undefined)
+                    client.updateOptions({ tools });
+            });
+        }
+        catch {
+            // Effects are only valid during component initialization.
+        }
         try {
             onMount(() => {
                 // Delivery-durability resume is transparent: the resumable SSE

package/dist/create-web-mcp-tools.svelte.d.ts

@@ -1,10 +1,12 @@
-import type { AnyClientTool, InferredClientContext, RegisterWebMCPToolsOptions } from '@tanstack/ai-client';
-/** Options for {@link createWebMCPTools}. */
-export type CreateWebMCPToolsOptions<TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>> = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {
+import type { AnyClientTool, InferredClientContext, RegisterWebMCPToolsOptions, SubscribeWebMCPToolsOptions } from '@tanstack/ai-client';
+/** Options for {@link createRegisterWebMCPTools}. */
+export type CreateRegisterWebMCPToolsOptions<TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>> = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {
     /** Receives an asynchronous registration error. */
     onError?: (error: unknown) => void;
 };
-type CreateWebMCPToolsArguments<TTools extends ReadonlyArray<AnyClientTool>, TContext> = {} extends CreateWebMCPToolsOptions<TTools, TContext> ? [options?: CreateWebMCPToolsOptions<TTools, TContext>] : [options: CreateWebMCPToolsOptions<TTools, TContext>];
+/** @deprecated Use `CreateRegisterWebMCPToolsOptions`. Removed in 1.0.0. */
+export type CreateWebMCPToolsOptions<TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>> = CreateRegisterWebMCPToolsOptions<TTools, TContext>;
+type CreateRegisterWebMCPToolsArguments<TTools extends ReadonlyArray<AnyClientTool>, TContext> = {} extends CreateRegisterWebMCPToolsOptions<TTools, TContext> ? [options?: CreateRegisterWebMCPToolsOptions<TTools, TContext>] : [options: CreateRegisterWebMCPToolsOptions<TTools, TContext>];
 /**
  * Registers executable client tools with WebMCP for the current Svelte component.
  *
@@ -16,9 +18,44 @@ type CreateWebMCPToolsArguments<TTools extends ReadonlyArray<AnyClientTool>, TCo
  * @example
  * ```svelte
  * <script lang="ts">
- *   createWebMCPTools([searchProducts])
+ *   createRegisterWebMCPTools([searchProducts])
  * </script>
  * ```
  */
-export declare function createWebMCPTools<const TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>>(tools: TTools, ...[options]: CreateWebMCPToolsArguments<TTools, TContext>): void;
+export declare function createRegisterWebMCPTools<const TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>>(tools: TTools, ...[options]: CreateRegisterWebMCPToolsArguments<TTools, TContext>): void;
+/**
+ * @deprecated Use `createRegisterWebMCPTools`. Removed in 1.0.0.
+ * @alias
+ */
+export declare const createWebMCPTools: typeof createRegisterWebMCPTools;
+/** Options for {@link createPageWebMCPTools}. */
+export type CreatePageWebMCPToolsOptions = Omit<SubscribeWebMCPToolsOptions, 'signal'>;
+/**
+ * Reads the WebMCP tools on the page as client tools for `createChat`.
+ *
+ * `tools` starts empty and updates when the page registers or removes a tool.
+ * Component destruction stops the updates. Unsupported browsers and server
+ * rendering keep an empty array.
+ *
+ * @param options - A filter that skips tools, and an error callback.
+ *
+ * @example
+ * ```svelte
+ * <script lang="ts">
+ *   const page = createPageWebMCPTools({
+ *     filter: (tool) => tool.origin === location.origin,
+ *   })
+ *   const chat = createChat({
+ *     connection,
+ *     get tools() {
+ *       return page.tools
+ *     },
+ *   })
+ * </script>
+ * ```
+ */
+export declare function createPageWebMCPTools(options?: CreatePageWebMCPToolsOptions): {
+    /** The current page tools. */
+    readonly tools: AnyClientTool[];
+};
 export {};

package/dist/create-web-mcp-tools.svelte.js

@@ -1,5 +1,5 @@
 import { onDestroy } from 'svelte';
-import { registerWebMCPTools } from '@tanstack/ai-client';
+import { registerWebMCPTools, subscribeWebMCPTools } from '@tanstack/ai-client';
 /**
  * Registers executable client tools with WebMCP for the current Svelte component.
  *
@@ -11,11 +11,11 @@ import { registerWebMCPTools } from '@tanstack/ai-client';
  * @example
  * ```svelte
  * <script lang="ts">
- *   createWebMCPTools([searchProducts])
+ *   createRegisterWebMCPTools([searchProducts])
  * </script>
  * ```
  */
-export function createWebMCPTools(tools, ...[options]) {
+export function createRegisterWebMCPTools(tools, ...[options]) {
     const controller = new AbortController();
     void registerWebMCPTools(tools, {
         ...options,
@@ -27,3 +27,48 @@ export function createWebMCPTools(tools, ...[options]) {
     });
     onDestroy(() => controller.abort());
 }
+/**
+ * @deprecated Use `createRegisterWebMCPTools`. Removed in 1.0.0.
+ * @alias
+ */
+export const createWebMCPTools = createRegisterWebMCPTools;
+/**
+ * Reads the WebMCP tools on the page as client tools for `createChat`.
+ *
+ * `tools` starts empty and updates when the page registers or removes a tool.
+ * Component destruction stops the updates. Unsupported browsers and server
+ * rendering keep an empty array.
+ *
+ * @param options - A filter that skips tools, and an error callback.
+ *
+ * @example
+ * ```svelte
+ * <script lang="ts">
+ *   const page = createPageWebMCPTools({
+ *     filter: (tool) => tool.origin === location.origin,
+ *   })
+ *   const chat = createChat({
+ *     connection,
+ *     get tools() {
+ *       return page.tools
+ *     },
+ *   })
+ * </script>
+ * ```
+ */
+export function createPageWebMCPTools(options) {
+    let tools = $state.raw([]);
+    const controller = new AbortController();
+    subscribeWebMCPTools((nextTools) => (tools = nextTools), {
+        signal: controller.signal,
+        filter: (tool) => options?.filter?.(tool) ?? true,
+        onError: (error) => options?.onError?.(error),
+    });
+    onDestroy(() => controller.abort());
+    return {
+        /** The current page tools. */
+        get tools() {
+            return tools;
+        },
+    };
+}

package/dist/index.d.ts

@@ -1,8 +1,8 @@
 export { createChat } from './create-chat.svelte';
 export { createChatHook } from './create-chat-hook';
 export { createByok } from './create-byok.svelte';
-export { createWebMCPTools } from './create-web-mcp-tools.svelte';
-export type { CreateWebMCPToolsOptions } from './create-web-mcp-tools.svelte';
+export { createPageWebMCPTools, createRegisterWebMCPTools, createWebMCPTools, } from './create-web-mcp-tools.svelte';
+export type { CreatePageWebMCPToolsOptions, CreateRegisterWebMCPToolsOptions, CreateWebMCPToolsOptions, } from './create-web-mcp-tools.svelte';
 export type { CreateChatOptions, CreateChatReturn, DeepPartial, UIMessage, ChatRequestBody, QueuedMessage, SendMessageOptions, WhenBusy, QueueConfig, QueueStrategy, QueueOption, } from './types';
 export { createGeneration } from './create-generation.svelte';
 export type { CreateGenerationOptions, CreateGenerationReturn, } from './create-generation.svelte';
@@ -20,4 +20,4 @@ export { createGenerateVideo } from './create-generate-video.svelte';
 export type { CreateGenerateVideoOptions, CreateGenerateVideoReturn, } from './create-generate-video.svelte';
 export { createAudioRecorder } from './create-audio-recorder.svelte';
 export type { CreateAudioRecorderOptions, CreateAudioRecorderReturn, } from './create-audio-recorder.svelte';
-export { AudioRecorder, ChatClient, InterruptManager, RealtimeClient, GenerationClient, VideoGenerationClient, GENERATION_EVENTS, reconstructImageResult, reconstructAudioResult, reconstructSpeechResult, reconstructTranscriptionResult, reconstructSummarizeResult, UnsupportedResponseStreamError, createAIDevtoolsGenerationPreview, StreamTruncatedError, DurableStreamIncompleteError, StreamReconnectLimitError, uiMessageToModelMessages, modelMessageToUIMessage, modelMessagesToUIMessages, convertMessagesToModelMessages, normalizeToUIMessage, generateMessageId, StreamProcessor, ImmediateStrategy, PunctuationStrategy, BatchStrategy, WordBoundaryStrategy, CompositeStrategy, parsePartialJSON, PartialJSONParser, defaultJSONParser, registerWebMCPTools, createMcpAppBridge, type McpAppBridge, type CreateMcpAppBridgeOptions, fetchServerSentEvents, localStoragePersistence, sessionStoragePersistence, indexedDBPersistence, StorageUnavailableError, type ChatClientPersistence, type ChatPersistedState, type ChatPersistenceOption, type ChatStorageAdapter, type WebStoragePersistenceOptions, type IndexedDBPersistenceOptions, fetchHttpStream, xhrServerSentEvents, xhrHttpStream, stream, rpcStream, webSocket, createChatClientOptions, clientTools, type ConnectionAdapter, type ConnectConnectionAdapter, type SubscribeConnectionAdapter, type RunAgentInputContext, type FetchConnectionOptions, type XhrConnectionOptions, type WebSocketConnectionOptions, type InferChatMessages, type GenerationClientState, type ImageGenerateInput, type AudioGenerateInput, type SpeechGenerateInput, type TranscriptionGenerateInput, type SummarizeGenerateInput, type VideoGenerateInput, type VideoGenerateResult, type VideoStatusInfo, } from '@tanstack/ai-client';
+export { AudioRecorder, ChatClient, InterruptManager, RealtimeClient, GenerationClient, VideoGenerationClient, GENERATION_EVENTS, reconstructImageResult, reconstructAudioResult, reconstructSpeechResult, reconstructTranscriptionResult, reconstructSummarizeResult, UnsupportedResponseStreamError, createAIDevtoolsGenerationPreview, StreamTruncatedError, DurableStreamIncompleteError, StreamReconnectLimitError, uiMessageToModelMessages, modelMessageToUIMessage, modelMessagesToUIMessages, convertMessagesToModelMessages, normalizeToUIMessage, generateMessageId, StreamProcessor, ImmediateStrategy, PunctuationStrategy, BatchStrategy, WordBoundaryStrategy, CompositeStrategy, parsePartialJSON, PartialJSONParser, defaultJSONParser, registerWebMCPTools, getWebMCPTools, subscribeWebMCPTools, type GetWebMCPToolsOptions, type SubscribeWebMCPToolsOptions, type WebMCPPageTool, createMcpAppBridge, type McpAppBridge, type CreateMcpAppBridgeOptions, fetchServerSentEvents, localStoragePersistence, sessionStoragePersistence, indexedDBPersistence, StorageUnavailableError, type ChatClientPersistence, type ChatPersistedState, type ChatPersistenceOption, type ChatStorageAdapter, type WebStoragePersistenceOptions, type IndexedDBPersistenceOptions, fetchHttpStream, xhrServerSentEvents, xhrHttpStream, stream, rpcStream, webSocket, createChatClientOptions, clientTools, type ConnectionAdapter, type ConnectConnectionAdapter, type SubscribeConnectionAdapter, type RunAgentInputContext, type FetchConnectionOptions, type XhrConnectionOptions, type WebSocketConnectionOptions, type InferChatMessages, type GenerationClientState, type ImageGenerateInput, type AudioGenerateInput, type SpeechGenerateInput, type TranscriptionGenerateInput, type SummarizeGenerateInput, type VideoGenerateInput, type VideoGenerateResult, type VideoStatusInfo, } from '@tanstack/ai-client';

package/dist/index.js

@@ -1,7 +1,7 @@
 export { createChat } from './create-chat.svelte';
 export { createChatHook } from './create-chat-hook';
 export { createByok } from './create-byok.svelte';
-export { createWebMCPTools } from './create-web-mcp-tools.svelte';
+export { createPageWebMCPTools, createRegisterWebMCPTools, createWebMCPTools, } from './create-web-mcp-tools.svelte';
 // Generation hooks
 export { createGeneration } from './create-generation.svelte';
 export { createGenerateImage } from './create-generate-image.svelte';
@@ -12,4 +12,4 @@ export { createSummarize } from './create-summarize.svelte';
 export { createGenerateVideo } from './create-generate-video.svelte';
 export { createAudioRecorder } from './create-audio-recorder.svelte';
 // Re-export from ai-client for convenience
-export { AudioRecorder, ChatClient, InterruptManager, RealtimeClient, GenerationClient, VideoGenerationClient, GENERATION_EVENTS, reconstructImageResult, reconstructAudioResult, reconstructSpeechResult, reconstructTranscriptionResult, reconstructSummarizeResult, UnsupportedResponseStreamError, createAIDevtoolsGenerationPreview, StreamTruncatedError, DurableStreamIncompleteError, StreamReconnectLimitError, uiMessageToModelMessages, modelMessageToUIMessage, modelMessagesToUIMessages, convertMessagesToModelMessages, normalizeToUIMessage, generateMessageId, StreamProcessor, ImmediateStrategy, PunctuationStrategy, BatchStrategy, WordBoundaryStrategy, CompositeStrategy, parsePartialJSON, PartialJSONParser, defaultJSONParser, registerWebMCPTools, createMcpAppBridge, fetchServerSentEvents, localStoragePersistence, sessionStoragePersistence, indexedDBPersistence, StorageUnavailableError, fetchHttpStream, xhrServerSentEvents, xhrHttpStream, stream, rpcStream, webSocket, createChatClientOptions, clientTools, } from '@tanstack/ai-client';
+export { AudioRecorder, ChatClient, InterruptManager, RealtimeClient, GenerationClient, VideoGenerationClient, GENERATION_EVENTS, reconstructImageResult, reconstructAudioResult, reconstructSpeechResult, reconstructTranscriptionResult, reconstructSummarizeResult, UnsupportedResponseStreamError, createAIDevtoolsGenerationPreview, StreamTruncatedError, DurableStreamIncompleteError, StreamReconnectLimitError, uiMessageToModelMessages, modelMessageToUIMessage, modelMessagesToUIMessages, convertMessagesToModelMessages, normalizeToUIMessage, generateMessageId, StreamProcessor, ImmediateStrategy, PunctuationStrategy, BatchStrategy, WordBoundaryStrategy, CompositeStrategy, parsePartialJSON, PartialJSONParser, defaultJSONParser, registerWebMCPTools, getWebMCPTools, subscribeWebMCPTools, createMcpAppBridge, fetchServerSentEvents, localStoragePersistence, sessionStoragePersistence, indexedDBPersistence, StorageUnavailableError, fetchHttpStream, xhrServerSentEvents, xhrHttpStream, stream, rpcStream, webSocket, createChatClientOptions, clientTools, } from '@tanstack/ai-client';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/ai-svelte",
-  "version": "0.23.3",
+  "version": "0.24.1",
   "description": "Svelte 5 bindings for TanStack AI streaming chat, structured outputs, and media generation.",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -56,11 +56,11 @@
     "media-generation"
   ],
   "dependencies": {
-    "@tanstack/ai-client": "^0.33.2"
+    "@tanstack/ai-client": "^0.35.1"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",
-    "@tanstack/ai": "^0.58.0"
+    "@tanstack/ai": "^0.61.0"
   },
   "devDependencies": {
     "@standard-schema/spec": "^1.1.0",
@@ -73,7 +73,7 @@
     "svelte-check": "^4.2.0",
     "typescript": "5.9.3",
     "vite": "^8.2.1",
-    "@tanstack/ai": "0.58.0"
+    "@tanstack/ai": "0.61.0"
   },
   "scripts": {
     "clean": "rm -rf ./dist",

package/src/create-chat.svelte.ts

@@ -225,6 +225,16 @@ export function createChat<
   client.mountDevtools()
 
   if (typeof window !== 'undefined') {
+    try {
+      // Sync tools, so a getter such as `get tools() { return page.tools }`
+      // updates the client.
+      $effect.pre(() => {
+        const tools = options.tools
+        if (tools !== undefined) client.updateOptions({ tools })
+      })
+    } catch {
+      // Effects are only valid during component initialization.
+    }
     try {
       onMount(() => {
         // Delivery-durability resume is transparent: the resumable SSE

package/src/create-web-mcp-tools.svelte.ts

@@ -1,13 +1,14 @@
 import { onDestroy } from 'svelte'
-import { registerWebMCPTools } from '@tanstack/ai-client'
+import { registerWebMCPTools, subscribeWebMCPTools } from '@tanstack/ai-client'
 import type {
   AnyClientTool,
   InferredClientContext,
   RegisterWebMCPToolsOptions,
+  SubscribeWebMCPToolsOptions,
 } from '@tanstack/ai-client'
 
-/** Options for {@link createWebMCPTools}. */
-export type CreateWebMCPToolsOptions<
+/** Options for {@link createRegisterWebMCPTools}. */
+export type CreateRegisterWebMCPToolsOptions<
   TTools extends ReadonlyArray<AnyClientTool>,
   TContext = InferredClientContext<TTools>,
 > = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {
@@ -15,13 +16,19 @@ export type CreateWebMCPToolsOptions<
   onError?: (error: unknown) => void
 }
 
-type CreateWebMCPToolsArguments<
+/** @deprecated Use `CreateRegisterWebMCPToolsOptions`. Removed in 1.0.0. */
+export type CreateWebMCPToolsOptions<
+  TTools extends ReadonlyArray<AnyClientTool>,
+  TContext = InferredClientContext<TTools>,
+> = CreateRegisterWebMCPToolsOptions<TTools, TContext>
+
+type CreateRegisterWebMCPToolsArguments<
   TTools extends ReadonlyArray<AnyClientTool>,
   TContext,
 > =
-  {} extends CreateWebMCPToolsOptions<TTools, TContext>
-    ? [options?: CreateWebMCPToolsOptions<TTools, TContext>]
-    : [options: CreateWebMCPToolsOptions<TTools, TContext>]
+  {} extends CreateRegisterWebMCPToolsOptions<TTools, TContext>
+    ? [options?: CreateRegisterWebMCPToolsOptions<TTools, TContext>]
+    : [options: CreateRegisterWebMCPToolsOptions<TTools, TContext>]
 
 /**
  * Registers executable client tools with WebMCP for the current Svelte component.
@@ -34,14 +41,17 @@ type CreateWebMCPToolsArguments<
  * @example
  * ```svelte
  * <script lang="ts">
- *   createWebMCPTools([searchProducts])
+ *   createRegisterWebMCPTools([searchProducts])
  * </script>
  * ```
  */
-export function createWebMCPTools<
+export function createRegisterWebMCPTools<
   const TTools extends ReadonlyArray<AnyClientTool>,
   TContext = InferredClientContext<TTools>,
->(tools: TTools, ...[options]: CreateWebMCPToolsArguments<TTools, TContext>) {
+>(
+  tools: TTools,
+  ...[options]: CreateRegisterWebMCPToolsArguments<TTools, TContext>
+) {
   const controller = new AbortController()
 
   void registerWebMCPTools(tools, {
@@ -55,3 +65,58 @@ export function createWebMCPTools<
 
   onDestroy(() => controller.abort())
 }
+
+/**
+ * @deprecated Use `createRegisterWebMCPTools`. Removed in 1.0.0.
+ * @alias
+ */
+export const createWebMCPTools = createRegisterWebMCPTools
+
+/** Options for {@link createPageWebMCPTools}. */
+export type CreatePageWebMCPToolsOptions = Omit<
+  SubscribeWebMCPToolsOptions,
+  'signal'
+>
+
+/**
+ * Reads the WebMCP tools on the page as client tools for `createChat`.
+ *
+ * `tools` starts empty and updates when the page registers or removes a tool.
+ * Component destruction stops the updates. Unsupported browsers and server
+ * rendering keep an empty array.
+ *
+ * @param options - A filter that skips tools, and an error callback.
+ *
+ * @example
+ * ```svelte
+ * <script lang="ts">
+ *   const page = createPageWebMCPTools({
+ *     filter: (tool) => tool.origin === location.origin,
+ *   })
+ *   const chat = createChat({
+ *     connection,
+ *     get tools() {
+ *       return page.tools
+ *     },
+ *   })
+ * </script>
+ * ```
+ */
+export function createPageWebMCPTools(options?: CreatePageWebMCPToolsOptions) {
+  let tools = $state.raw<Array<AnyClientTool>>([])
+  const controller = new AbortController()
+
+  subscribeWebMCPTools((nextTools) => (tools = nextTools), {
+    signal: controller.signal,
+    filter: (tool) => options?.filter?.(tool) ?? true,
+    onError: (error) => options?.onError?.(error),
+  })
+
+  onDestroy(() => controller.abort())
+  return {
+    /** The current page tools. */
+    get tools() {
+      return tools
+    },
+  }
+}

package/src/index.ts

@@ -1,8 +1,16 @@
 export { createChat } from './create-chat.svelte'
 export { createChatHook } from './create-chat-hook'
 export { createByok } from './create-byok.svelte'
-export { createWebMCPTools } from './create-web-mcp-tools.svelte'
-export type { CreateWebMCPToolsOptions } from './create-web-mcp-tools.svelte'
+export {
+  createPageWebMCPTools,
+  createRegisterWebMCPTools,
+  createWebMCPTools,
+} from './create-web-mcp-tools.svelte'
+export type {
+  CreatePageWebMCPToolsOptions,
+  CreateRegisterWebMCPToolsOptions,
+  CreateWebMCPToolsOptions,
+} from './create-web-mcp-tools.svelte'
 export type {
   CreateChatOptions,
   CreateChatReturn,
@@ -101,6 +109,11 @@ export {
   PartialJSONParser,
   defaultJSONParser,
   registerWebMCPTools,
+  getWebMCPTools,
+  subscribeWebMCPTools,
+  type GetWebMCPToolsOptions,
+  type SubscribeWebMCPToolsOptions,
+  type WebMCPPageTool,
   createMcpAppBridge,
   type McpAppBridge,
   type CreateMcpAppBridgeOptions,