@tanstack/ai-octane 0.2.0 → 0.3.1

package/README.md

@@ -1,3 +1,23 @@
+<div align="center">
+  <picture>
+    <source
+      media="(prefers-color-scheme: dark)"
+      srcset="https://tanstack.com/api/readme/ai.png?theme=dark"
+    />
+    <source
+      media="(prefers-color-scheme: light)"
+      srcset="https://tanstack.com/api/readme/ai.png"
+    />
+    <img
+      src="https://tanstack.com/api/readme/ai.png"
+      alt="TanStack AI"
+      width="900"
+    />
+  </picture>
+</div>
+
+<br />
+
 # @tanstack/ai-octane
 
 [TanStack AI](https://tanstack.com/ai) bindings for the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/ai-octane",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "description": "Octane bindings for TanStack AI streaming chat, structured outputs, and media generation.",
   "author": "Dominic Gannaway",
   "license": "MIT",
@@ -47,11 +47,11 @@
   ],
   "//lint": "The .tsrx.d.ts companions are generated declaration emits of the .tsrx implementations, so they are not hand-formatted and are excluded from lint rather than edited in place (a regeneration would undo any fix).",
   "dependencies": {
-    "@tanstack/ai-client": "0.30.0"
+    "@tanstack/ai-client": "0.31.1"
   },
   "peerDependencies": {
     "octane": "^0.1.17",
-    "@tanstack/ai": "^0.52.1"
+    "@tanstack/ai": "^0.54.0"
   },
   "devDependencies": {
     "@octanejs/testing-library": "0.1.14",
@@ -62,7 +62,7 @@
     "octane": "0.1.17",
     "vite": "^8.2.1",
     "zod": "^4.2.0",
-    "@tanstack/ai": "0.52.1"
+    "@tanstack/ai": "0.54.0"
   },
   "scripts": {
     "lint:fix": "oxlint src --type-aware --ignore-pattern '**/*.tsrx.d.ts' --fix",

package/src/index.ts

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

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

@@ -0,0 +1,61 @@
+import { useEffect } from 'octane'
+import { registerWebMCPTools } from '@tanstack/ai-client'
+import type {
+  AnyClientTool,
+  InferredClientContext,
+  RegisterWebMCPToolsOptions,
+} from '@tanstack/ai-client'
+
+/** Options for the Octane {@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 an Octane 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])
+}

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

@@ -0,0 +1,42 @@
+// Declaration companion generated from use-web-mcp-tools.tsrx.
+import type {
+  AnyClientTool,
+  InferredClientContext,
+  RegisterWebMCPToolsOptions,
+} from '@tanstack/ai-client'
+
+/** Options for the Octane {@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 an Octane 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