[Feature Request] Make the v0 docs WebMCP-consumable (agent-navigable)

[johnleider]

Idea

Have the v0 docs site register WebMCP tools via navigator.modelContext.registerTool so an in-browser AI agent can drive the docs through structured, typed tool calls instead of screenshot-and-guess scraping.

Scope is deliberately the docs app only — not a first-party @vuetify/v0 API. Blast radius is one app, zero commitment in the shipped package.

Why the docs are the right place

• The data is already structured — search index, component/composable catalog, API metadata (the same schemas ApiPopover/Vuetify MCP already serve). Registering tools is a few registerTool calls, feature-detected so it's a no-op off supporting browsers.
• Real dogfood + a clean differentiator: "first Vue library docs a browser agent can actually navigate." Useful launch-narrative seasoning.
• Doubles as living documentation of WebMCP — the docs demonstrate the pattern by using it.

Candidate tools

• search-docs(query) — over the existing search index
• open-guide(name) — navigate to a component/composable page
• list-composables(category?) / list-components(category?) — the catalog behind the decision table
• get-api(name) — return the API schema already served via ApiPopover/MCP
• filter-by-skill-level(level) — the existing skill-level filter
• run-example(id, props) — drive an interactive example live

Two flavors (not exclusive)

1. Instrument the real docs (agent-navigable) — start with search-docs + open-guide, the highest-value pair.
2. Dedicated WebMCP demo/example page — teaches the pattern with a v0 example; safest sandbox, and the natural home for documenting the feature.

Folds in existing docs follow-ups — search, skill-level filter, bookmarks become the backing actions the tools call.

Recommendation

Start with flavor 2 (a demo/example page): proves the API, documents it, risks nothing. Graduate to instrumenting real search + navigate once it feels solid.

Reference — WebMCP API shape

const controller = new AbortController()
await navigator.modelContext.registerTool({
  name: 'search-docs',
  description: 'Search the v0 documentation',
  inputSchema: { type: 'object', properties: { query: { type: 'string' } }, required: ['query'] },
  async execute ({ query }) {
    const results = await searchIndex(query)
    return { content: [{ type: 'text', text: JSON.stringify(results) }] }
  },
}, { signal: controller.signal })   // controller.abort() unregisters

Caveats (as of 2026-07)

• Origin-trial only, Chrome-first (Angular has experimental support; Firefox/Safari uncommitted). Gate everything behind feature detection.
• API not finalized — sources disagree on document. vs navigator.modelContext; getTools/executeTool still TODO in the spec. Keep the integration thin and centralized so a rename is a one-line change.

Next step

Check what the docs search/router actually expose, then scope the demo page.