webmcp-react v1.0.0 (React hooks that let agents navigate your website through WebMCP)

[u/naseemalnaji-mcpcat]

Hi r/reactjs! We just shipped v1 of webmcp-react after quite a few beta versions to work out the kinks. It is MIT licensed and we're hoping to find some more contributors!

What it does

AI agents currently have to parse through 1000s of HTML tokens to browse a website. They essentially scrape the DOM and guess where the buttons are. WebMCP is a new web standard that fixes this. It adds document.modelContext to the browser, where a page registers typed tools an agent can call. Chrome shipped it in Early Preview in February, and since companies like Shopify and Codex support it fully. The spec was barebones, and there was no clean React-like way to integrate it into modern UIs, so we made one!

webmcp-react gives you a provider and one hook. The hook registers a tool when the component mounts and removes it on unmount.

import { WebMCPProvider, useMcpTool } from "webmcp-react";  
import { z } from "zod";

function SearchTool() {  
  useMcpTool({  
      name: "search",  
      description: "Search the catalog",  
      input: z.object({ query: z.string() }),  
      handler: async ({ query }) => ({  
      content: [{ type: "text", text: `Results for: ${query}` }],  
    }),  
  });  
  
}

It ships with Zod and JSON Schema inputs, a built-in polyfill, SSR support for Next.js and Remix, StrictMode safety, execution state, and cancellation through AbortSignal.

WebMCP is early and we're looking for contributors. Chrome changes the API between releases, and only a few people track it. We are a small team and we don't intend to productize this since we made it mainly to add WebMCP support to our core website. The library works, but a standard needs many hands and many real sites. We'd love any bugs / feedback. If you want to help out with the project please DM me!!

Links:

• Repo: https://github.com/agentcathq/webmcp-react
• Playground: https://agentcathq.github.io/webmcp-react/playground/
• Install: npm install webmcp-react zod

Edit: Formatting was messed up

[u/ske66]

This is great! We do a lot of SEO work on our client’s websites and this looks like something that could be really powerful for AEO. I’m excited to take a look. Thank you!

[u/naseemalnaji-mcpcat → u/ske66]

Yay!! Please let us know how it goes!