Skip to content

Latest commit

 

History

History
70 lines (49 loc) · 3.93 KB

File metadata and controls

70 lines (49 loc) · 3.93 KB

API Reference

<WebMCPProvider>

Recommended root wrapper for apps using this library.

Prop Type Description
name string Your app's name
version string Your app's version
children ReactNode React children

On mount, the provider checks for native navigator.modelContext. If absent, it installs a minimal in-memory polyfill. It cleans up the polyfill when the last provider unmounts.

useMcpTool can still run outside the provider (with a warning), but registration depends on navigator.modelContext already being present.

useWebMCPStatus()

Returns the current availability of the WebMCP API.

const { available } = useWebMCPStatus();
Field Type Description
available boolean true once navigator.modelContext is ready (always false on the server or outside provider)

useMcpTool(config)

Registers a tool on navigator.modelContext. Automatically unregisters on unmount.

Zod config

Field Type Description
name string Tool name (must be unique)
description string Human-readable description
input z.ZodObject Zod schema for inputs. Handler receives typed args
output z.ZodObject Optional Zod schema for outputs
handler (args, client) => CallToolResult | Promise<CallToolResult> Tool implementation
annotations ToolAnnotations Optional hints (title, readOnlyHint, destructiveHint, idempotentHint, openWorldHint)
onSuccess (result) => void Optional callback on success
onError (error) => void Optional callback on error

The client argument provides requestUserInteraction(callback) for prompting the user during tool execution. When you call execute() directly, this simply invokes the callback.

JSON Schema config

Same as above, but replace input with inputSchema: InputSchema and output with outputSchema: OutputSchema. The handler receives Record<string, unknown> instead of typed args.

Return value

const { state, execute, reset } = useMcpTool({ ... });
Field Type Description
state.isExecuting boolean true while the handler is running
state.lastResult CallToolResult | null Most recent result
state.error Error | null Most recent error
state.executionCount number Total successful executions
execute(input?) (input?) => Promise<CallToolResult> Manually invoke the tool
reset() () => void Reset state to initial values

execute() throws if validation or handler logic fails.

The polyfill installs both navigator.modelContext (registration API) and navigator.modelContextTesting (consumer API with executeTool(), listTools()). Browser extensions and tests use modelContextTesting to discover and invoke tools.