@tanstack/ai-preact 0.15.0 → 0.16.1

package/README.md

@@ -202,19 +202,20 @@ Learn more in the
 
 Official adapters include:
 
-| Package                                                                              | Use it for                                                                     |
-| ------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------ |
-| [`@tanstack/ai-openrouter`](https://tanstack.com/ai/latest/docs/adapters/openrouter) | 300+ models through one OpenRouter API, with per-request cost tracking         |
-| [`@tanstack/ai-openai`](https://tanstack.com/ai/latest/docs/adapters/openai)         | OpenAI chat, image, video, speech, transcription, realtime, and provider tools |
-| [`@tanstack/ai-anthropic`](https://tanstack.com/ai/latest/docs/adapters/anthropic)   | Anthropic Claude chat, thinking, tools, structured outputs, and Vertex Claude  |
-| [`@tanstack/ai-gemini`](https://tanstack.com/ai/latest/docs/adapters/gemini)         | Google Gemini chat, image, speech, and audio generation                        |
-| [`@tanstack/ai-vertex`](https://tanstack.com/ai/latest/docs/adapters/vertex)         | Gemini on Vertex AI with regional endpoints and Google Cloud credentials       |
-| [`@tanstack/ai-ollama`](https://tanstack.com/ai/latest/docs/adapters/ollama)         | Local Ollama models                                                            |
-| [`@tanstack/ai-grok`](https://tanstack.com/ai/latest/docs/adapters/grok)             | xAI Grok chat, images, and realtime                                            |
-| [`@tanstack/ai-groq`](https://tanstack.com/ai/latest/docs/adapters/groq)             | Groq low-latency inference                                                     |
-| [`@tanstack/ai-elevenlabs`](https://tanstack.com/ai/latest/docs/adapters/elevenlabs) | ElevenLabs realtime voice, speech, transcription, music, and sound effects     |
-| [`@tanstack/ai-byteplus`](https://tanstack.com/ai/latest/docs/adapters/byteplus)     | BytePlus Seed chat, Seedance video, Seedream image, and Seed Speech TTS/ASR    |
-| [`@tanstack/ai-fal`](https://tanstack.com/ai/latest/docs/adapters/fal)               | fal.ai image, video, audio, speech, and transcription models                   |
+| Package                                                                              | Use it for                                                                           |
+| ------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------ |
+| [`@tanstack/ai-openrouter`](https://tanstack.com/ai/latest/docs/adapters/openrouter) | 300+ models through one OpenRouter API, with per-request cost tracking               |
+| [`@tanstack/ai-openai`](https://tanstack.com/ai/latest/docs/adapters/openai)         | OpenAI chat, image, video, speech, transcription, realtime, and provider tools       |
+| [`@tanstack/ai-anthropic`](https://tanstack.com/ai/latest/docs/adapters/anthropic)   | Anthropic Claude chat, thinking, tools, structured outputs, and Vertex Claude        |
+| [`@tanstack/ai-gemini`](https://tanstack.com/ai/latest/docs/adapters/gemini)         | Google Gemini chat, image, speech, and audio generation                              |
+| [`@tanstack/ai-vertex`](https://tanstack.com/ai/latest/docs/adapters/vertex)         | Gemini on Vertex AI with regional endpoints and Google Cloud credentials             |
+| [`@tanstack/ai-ollama`](https://tanstack.com/ai/latest/docs/adapters/ollama)         | Local Ollama models                                                                  |
+| [`@tanstack/ai-grok`](https://tanstack.com/ai/latest/docs/adapters/grok)             | xAI Grok chat, images, and realtime                                                  |
+| [`@tanstack/ai-groq`](https://tanstack.com/ai/latest/docs/adapters/groq)             | Groq low-latency inference                                                           |
+| [`@tanstack/ai-elevenlabs`](https://tanstack.com/ai/latest/docs/adapters/elevenlabs) | ElevenLabs realtime voice, speech, transcription, music, and sound effects           |
+| [`@tanstack/ai-byteplus`](https://tanstack.com/ai/latest/docs/adapters/byteplus)     | BytePlus Seed chat, Seedance video, Seedream image, and Seed Speech TTS/ASR          |
+| [`@tanstack/ai-fal`](https://tanstack.com/ai/latest/docs/adapters/fal)               | fal.ai image, video, audio, speech, and transcription models                         |
+| [`@tanstack/ai-cloudflare`](https://tanstack.com/ai/latest/docs/adapters/cloudflare) | Cloudflare Workers AI chat, embeddings, image, speech, transcription, and AI Gateway |
 
 The adapter system is tree-shakeable by activity. Import `openaiText` for chat,
 `openaiImage` for images, `falVideo` for video, `geminiSpeech` for TTS, and so

package/dist/esm/index.d.ts

@@ -3,5 +3,7 @@ export { createChatHook } from './create-chat-hook.js';
 export { useByok } from './use-byok.js';
 export { useMcpAppBridge } from './use-mcp-app-bridge.js';
 export type { UseMcpAppBridgeOptions } from './use-mcp-app-bridge.js';
+export { useWebMCPTools } from './use-web-mcp-tools.js';
+export type { UseWebMCPToolsOptions } from './use-web-mcp-tools.js';
 export type { UseChatOptions, UseChatReturn, UIMessage, ChatRequestBody, QueuedMessage, SendMessageOptions, WhenBusy, QueueConfig, QueueStrategy, QueueOption, } from './types.js';
 export { fetchServerSentEvents, localStoragePersistence, sessionStoragePersistence, indexedDBPersistence, StorageUnavailableError, type ChatClientPersistence, type ChatPersistedState, type ChatPersistenceOption, type ChatStorageAdapter, type WebStoragePersistenceOptions, type IndexedDBPersistenceOptions, fetchHttpStream, xhrServerSentEvents, xhrHttpStream, stream, rpcStream, createChatClientOptions, createMcpAppBridge, type McpAppBridge, type CreateMcpAppBridgeOptions, type ConnectionAdapter, type ConnectConnectionAdapter, type SubscribeConnectionAdapter, type RunAgentInputContext, type FetchConnectionOptions, type XhrConnectionOptions, type InferChatMessages, } from '@tanstack/ai-client';

package/dist/esm/index.js

@@ -2,5 +2,6 @@ import { useChat } from "./use-chat.js";
 import { createChatHook } from "./create-chat-hook.js";
 import { useByok } from "./use-byok.js";
 import { useMcpAppBridge } from "./use-mcp-app-bridge.js";
+import { useWebMCPTools } from "./use-web-mcp-tools.js";
 import { StorageUnavailableError, createChatClientOptions, createMcpAppBridge, fetchHttpStream, fetchServerSentEvents, indexedDBPersistence, localStoragePersistence, rpcStream, sessionStoragePersistence, stream, xhrHttpStream, xhrServerSentEvents } from "@tanstack/ai-client";
-export { StorageUnavailableError, createChatClientOptions, createChatHook, createMcpAppBridge, fetchHttpStream, fetchServerSentEvents, indexedDBPersistence, localStoragePersistence, rpcStream, sessionStoragePersistence, stream, useByok, useChat, useMcpAppBridge, xhrHttpStream, xhrServerSentEvents };
+export { StorageUnavailableError, createChatClientOptions, createChatHook, createMcpAppBridge, fetchHttpStream, fetchServerSentEvents, indexedDBPersistence, localStoragePersistence, rpcStream, sessionStoragePersistence, stream, useByok, useChat, useMcpAppBridge, useWebMCPTools, xhrHttpStream, xhrServerSentEvents };

package/dist/esm/use-web-mcp-tools.d.ts

@@ -0,0 +1,27 @@
+import { AnyClientTool, InferredClientContext, RegisterWebMCPToolsOptions } from '@tanstack/ai-client';
+/** Options for the Preact {@link useWebMCPTools} lifecycle hook. */
+export type UseWebMCPToolsOptions<TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>> = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {
+    /** Receives an asynchronous registration failure. */
+    onError?: (error: unknown) => void;
+};
+type UseWebMCPToolsArguments<TTools extends ReadonlyArray<AnyClientTool>, TContext> = RegisterWebMCPToolsOptions<TTools, TContext> extends {
+    context: unknown;
+} ? [options: UseWebMCPToolsOptions<TTools, TContext>] : [options?: UseWebMCPToolsOptions<TTools, TContext>];
+/**
+ * Registers client tools with WebMCP for the lifetime of a Preact component.
+ *
+ * The hook replaces the registration when `tools` or `options` changes.
+ * Unsupported browsers and server rendering do not register tools.
+ *
+ * @param tools - The executable client tools to expose through WebMCP.
+ * @param options - Runtime context, per-tool options, and an error callback.
+ *
+ * @example
+ * ```tsx
+ * useWebMCPTools([searchProducts], {
+ *   toolOptions: { searchProducts: { title: 'Search products' } },
+ * })
+ * ```
+ */
+export declare function useWebMCPTools<const TTools extends ReadonlyArray<AnyClientTool>, TContext = InferredClientContext<TTools>>(tools: TTools, ...[options]: UseWebMCPToolsArguments<TTools, TContext>): void;
+export {};

package/dist/esm/use-web-mcp-tools.js

@@ -0,0 +1,36 @@
+import { registerWebMCPTools } from "@tanstack/ai-client";
+import { useEffect } from "preact/hooks";
+//#region src/use-web-mcp-tools.ts
+/**
+* Registers client tools with WebMCP for the lifetime of a Preact component.
+*
+* The hook replaces the registration when `tools` or `options` changes.
+* Unsupported browsers and server rendering do not register tools.
+*
+* @param tools - The executable client tools to expose through WebMCP.
+* @param options - Runtime context, per-tool options, and an error callback.
+*
+* @example
+* ```tsx
+* useWebMCPTools([searchProducts], {
+*   toolOptions: { searchProducts: { title: 'Search products' } },
+* })
+* ```
+*/
+function useWebMCPTools(tools, ...[options]) {
+	useEffect(() => {
+		const controller = new AbortController();
+		const { onError, ...registrationOptions } = options ?? {};
+		registerWebMCPTools(tools, {
+			...registrationOptions,
+			signal: controller.signal
+		}).catch((error) => {
+			if (!controller.signal.aborted) onError?.(error);
+		});
+		return () => controller.abort();
+	}, [tools, options]);
+}
+//#endregion
+export { useWebMCPTools };
+
+//# sourceMappingURL=use-web-mcp-tools.js.map

package/dist/esm/use-web-mcp-tools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-web-mcp-tools.js","names":[],"sources":["../../src/use-web-mcp-tools.ts"],"sourcesContent":["import { useEffect } from 'preact/hooks'\nimport { registerWebMCPTools } from '@tanstack/ai-client'\nimport type {\n  AnyClientTool,\n  InferredClientContext,\n  RegisterWebMCPToolsOptions,\n} from '@tanstack/ai-client'\n\n/** Options for the Preact {@link useWebMCPTools} lifecycle hook. */\nexport type UseWebMCPToolsOptions<\n  TTools extends ReadonlyArray<AnyClientTool>,\n  TContext = InferredClientContext<TTools>,\n> = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {\n  /** Receives an asynchronous registration failure. */\n  onError?: (error: unknown) => void\n}\n\ntype UseWebMCPToolsArguments<\n  TTools extends ReadonlyArray<AnyClientTool>,\n  TContext,\n> =\n  RegisterWebMCPToolsOptions<TTools, TContext> extends { context: unknown }\n    ? [options: UseWebMCPToolsOptions<TTools, TContext>]\n    : [options?: UseWebMCPToolsOptions<TTools, TContext>]\n\n/**\n * Registers client tools with WebMCP for the lifetime of a Preact component.\n *\n * The hook replaces the registration when `tools` or `options` changes.\n * Unsupported browsers and server rendering do not register tools.\n *\n * @param tools - The executable client tools to expose through WebMCP.\n * @param options - Runtime context, per-tool options, and an error callback.\n *\n * @example\n * ```tsx\n * useWebMCPTools([searchProducts], {\n *   toolOptions: { searchProducts: { title: 'Search products' } },\n * })\n * ```\n */\nexport function useWebMCPTools<\n  const TTools extends ReadonlyArray<AnyClientTool>,\n  TContext = InferredClientContext<TTools>,\n>(tools: TTools, ...[options]: UseWebMCPToolsArguments<TTools, TContext>) {\n  useEffect(() => {\n    const controller = new AbortController()\n    const { onError, ...registrationOptions } = options ?? {}\n\n    registerWebMCPTools(tools, {\n      ...registrationOptions,\n      signal: controller.signal,\n    }).catch((error) => {\n      if (!controller.signal.aborted) onError?.(error)\n    })\n\n    return () => controller.abort()\n  }, [tools, options])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAyCA,SAAgB,eAGd,OAAe,GAAG,CAAC,UAAqD;CACxE,gBAAgB;EACd,MAAM,aAAa,IAAI,gBAAgB;EACvC,MAAM,EAAE,SAAS,GAAG,wBAAwB,WAAW,CAAC;EAExD,oBAAoB,OAAO;GACzB,GAAG;GACH,QAAQ,WAAW;EACrB,CAAC,CAAC,CAAC,OAAO,UAAU;GAClB,IAAI,CAAC,WAAW,OAAO,SAAS,UAAU,KAAK;EACjD,CAAC;EAED,aAAa,WAAW,MAAM;CAChC,GAAG,CAAC,OAAO,OAAO,CAAC;AACrB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/ai-preact",
-  "version": "0.15.0",
+  "version": "0.16.1",
   "description": "Preact hooks for TanStack AI streaming chat and typed messages.",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -50,7 +50,7 @@
     "tool-calling"
   ],
   "dependencies": {
-    "@tanstack/ai-client": "^0.30.0"
+    "@tanstack/ai-client": "^0.31.1"
   },
   "devDependencies": {
     "@mcp-ui/client": "^7.1.1",
@@ -59,12 +59,12 @@
     "jsdom": "^27.4.0",
     "preact": "^10.26.9",
     "vite": "^8.2.1",
-    "@tanstack/ai": "0.52.1"
+    "@tanstack/ai": "0.54.0"
   },
   "peerDependencies": {
     "@mcp-ui/client": "^7",
     "preact": ">=10.11.0",
-    "@tanstack/ai": "^0.52.1"
+    "@tanstack/ai": "^0.54.0"
   },
   "peerDependenciesMeta": {
     "@mcp-ui/client": {

package/src/index.ts

@@ -3,6 +3,8 @@ export { createChatHook } from './create-chat-hook'
 export { useByok } from './use-byok'
 export { useMcpAppBridge } from './use-mcp-app-bridge'
 export type { UseMcpAppBridgeOptions } from './use-mcp-app-bridge'
+export { useWebMCPTools } from './use-web-mcp-tools'
+export type { UseWebMCPToolsOptions } from './use-web-mcp-tools'
 export type {
   UseChatOptions,
   UseChatReturn,

package/src/use-web-mcp-tools.ts

@@ -0,0 +1,59 @@
+import { useEffect } from 'preact/hooks'
+import { registerWebMCPTools } from '@tanstack/ai-client'
+import type {
+  AnyClientTool,
+  InferredClientContext,
+  RegisterWebMCPToolsOptions,
+} from '@tanstack/ai-client'
+
+/** Options for the Preact {@link useWebMCPTools} lifecycle hook. */
+export type UseWebMCPToolsOptions<
+  TTools extends ReadonlyArray<AnyClientTool>,
+  TContext = InferredClientContext<TTools>,
+> = Omit<RegisterWebMCPToolsOptions<TTools, TContext>, 'signal'> & {
+  /** Receives an asynchronous registration failure. */
+  onError?: (error: unknown) => void
+}
+
+type UseWebMCPToolsArguments<
+  TTools extends ReadonlyArray<AnyClientTool>,
+  TContext,
+> =
+  RegisterWebMCPToolsOptions<TTools, TContext> extends { context: unknown }
+    ? [options: UseWebMCPToolsOptions<TTools, TContext>]
+    : [options?: UseWebMCPToolsOptions<TTools, TContext>]
+
+/**
+ * Registers client tools with WebMCP for the lifetime of a Preact component.
+ *
+ * The hook replaces the registration when `tools` or `options` changes.
+ * Unsupported browsers and server rendering do not register tools.
+ *
+ * @param tools - The executable client tools to expose through WebMCP.
+ * @param options - Runtime context, per-tool options, and an error callback.
+ *
+ * @example
+ * ```tsx
+ * useWebMCPTools([searchProducts], {
+ *   toolOptions: { searchProducts: { title: 'Search products' } },
+ * })
+ * ```
+ */
+export function useWebMCPTools<
+  const TTools extends ReadonlyArray<AnyClientTool>,
+  TContext = InferredClientContext<TTools>,
+>(tools: TTools, ...[options]: UseWebMCPToolsArguments<TTools, TContext>) {
+  useEffect(() => {
+    const controller = new AbortController()
+    const { onError, ...registrationOptions } = options ?? {}
+
+    registerWebMCPTools(tools, {
+      ...registrationOptions,
+      signal: controller.signal,
+    }).catch((error) => {
+      if (!controller.signal.aborted) onError?.(error)
+    })
+
+    return () => controller.abort()
+  }, [tools, options])
+}