Skip to main content
@mcp-b/react-webmcp is the full React surface for MCP-B. It covers tool registration, prompt and resource hooks, sampling and elicitation helpers, and client/provider APIs for consuming MCP servers from a React tree.

​
Version

The 4.0 release line aligns with the document-first WebMCP API. Provider hooks register tools against document.modelContext while retaining a navigator.modelContext fallback for older preview runtimes.

​
When to use this package

  • You want the full MCP-B feature set from React (tools, prompts, resources, sampling, elicitation).
  • You want Zod v3 object-map support and Standard Schema v1 (e.g., Zod v4 ~standard) in hook configuration.
  • You need client/provider hooks (McpClientProvider, useMcpClient) in addition to browser-exposed tools.

​
When not to use this package

  • You only need strict-core registerTool behavior. Use usewebmcp.
  • You are not using a BrowserMcpServer-based runtime. Install @mcp-b/global first.

​
Where it sits in the package graph

This package sits above the full runtime stack. It expects document.modelContext to come from a browser-native implementation or from the MCP-B runtime that wraps the strict core with BrowserMcpServer. React peer dependency: ^17.0.0 || ^18.0.0 || ^19.0.0. Zod peer dependency (optional): ^3.25 || ^4.0.

​
First step

Initialize the runtime with @mcp-b/global, then add the hook or provider that matches your React use case. The reference page covers tool hooks, prompt/resource hooks, and client/provider APIs.

Reference

Hook APIs, provider APIs, Zod support, and return types.

Your first React tool

Guided tutorial for registering a React tool.

Register prompts and resources

Apply the full MCP-B React surface.

Strict core vs MCP-B extensions

Decide whether the full React surface is necessary.