react-webmcp 0.2.0 → 0.2.1

package/README.md

@@ -4,17 +4,33 @@ React hooks and components for the [WebMCP](https://github.com/webmachinelearnin
 
 WebMCP is a W3C-proposed web standard (Chrome 146+) that allows websites to register tools that AI agents can discover and invoke directly, replacing unreliable screen-scraping with robust, schema-driven interaction.
 
-**react-webmcp** provides idiomatic React primitives for both the Imperative and Declarative WebMCP APIs.
+**react-webmcp** provides idiomatic React primitives for three API styles: **Imperative** (hooks), **Declarative** (HTML-attributed components), and **Adapter** (framework-agnostic wrappers for Material UI, Ant Design, and custom components).
 
 ## Features
 
+### Imperative API
+
 - **`useWebMCPTool`** — Register a single tool with automatic lifecycle management (mount/unmount)
 - **`useWebMCPContext`** — Register multiple tools at once via `provideContext()`
 - **`useToolEvent`** — Listen for `toolactivated` and `toolcancel` browser events
+
+### Declarative API
+
 - **`<WebMCPForm>`** — Declarative form component with `toolname` / `tooldescription` attributes
 - **`<WebMCPInput>`, `<WebMCPSelect>`, `<WebMCPTextarea>`** — Form controls with `toolparam*` attributes
+
+### Adapter API (third-party UI libraries)
+
+- **`<WebMCP.Tool>`** — Wrapper that auto-detects fields from children, merges with `fields` prop, and registers via context
+- **`<WebMCP.Field>`** — Zero-UI wrapper for custom components that can't be auto-detected
+- **`useRegisterField`** — Hook to register field metadata from inside any component
+- **`extractFields`**, **`buildInputSchema`**, **`validateSchema`** — Utilities for schema generation and dev-mode validation
+
+### General
+
 - **`<WebMCPProvider>`** — Context provider for availability detection
 - Full TypeScript support with `navigator.modelContext` type augmentation
+- SSR-safe tool registration and schema collection
 - Works with the [Model Context Tool Inspector](https://chromewebstore.google.com/detail/model-context-tool-inspec/gbpdfapgefenggkahomfgkhfehlcenpd) extension
 
 ## Requirements
@@ -115,6 +131,49 @@ function ReservationForm() {
 }
 ```
 
+### Adapter API (WebMCP.Tool + useRegisterField)
+
+Integrate with third-party UI libraries (Material UI, Ant Design) or custom components. The Adapter API auto-detects fields from children, or lets you declare them explicitly:
+
+```tsx
+import { WebMCP, WebMCPProvider } from "react-webmcp";
+
+// Auto-detection: fields inferred from input/select props
+<WebMCP.Tool
+  name="submit_contact"
+  description="Submit a contact form"
+  onExecute={(input) => console.log(input)}
+>
+  <input name="email" type="email" required />
+  <select name="subject">
+    <option value="general">General</option>
+    <option value="support">Support</option>
+  </select>
+</WebMCP.Tool>
+
+// Explicit registration: for custom components without standard props
+<WebMCP.Tool name="rate_feedback" description="Rate our product" onExecute={handler}>
+  <WebMCP.Field name="rating" type="number" required min={1} max={5}>
+    <StarRating value={rating} onChange={setRating} />
+  </WebMCP.Field>
+</WebMCP.Tool>
+```
+
+For components you control, use `useRegisterField` inside a wrapper:
+
+```tsx
+function RatingField({ value, onChange }) {
+  useRegisterField({
+    name: "rating",
+    type: "number",
+    required: true,
+    min: 1,
+    max: 5,
+  });
+  return <StarRating value={value} onChange={onChange} />;
+}
+```
+
 ## API Reference
 
 ### Hooks
@@ -193,6 +252,66 @@ All standard HTML attributes are also supported.
 
 Context provider that makes WebMCP availability info accessible via `useWebMCPStatus()`.
 
+### Adapter API
+
+#### `<WebMCP.Tool>` / `<WebMCPTool>`
+
+Wrapper component that collects field definitions from children (auto-detection), the `fields` prop, and context-registered fields via `useRegisterField`, then registers the tool with the generated JSON Schema.
+
+| Prop | Type | Description |
+|------|------|-------------|
+| `name` | `string` | Unique tool identifier |
+| `description` | `string` | Human-readable description for agents |
+| `onExecute` | `(input) => any` | Handler called on invocation |
+| `fields` | `Record<string, Partial<FieldDefinition>>` | *(optional)* Override or enrich field metadata |
+| `strict` | `boolean` | *(optional)* Throw on schema validation errors in dev (default: `false`) |
+| `autoSubmit` | `boolean` | *(optional)* Submit when invoked by agent |
+| `annotations` | `ToolAnnotations` | *(optional)* Tool hints |
+| `onToolActivated` | `(name) => void` | *(optional)* Activation callback |
+| `onToolCancel` | `(name) => void` | *(optional)* Cancel callback |
+
+#### `<WebMCP.Field>` / `<WebMCPField>`
+
+Zero-UI wrapper that registers a field via context. Renders a Fragment. Use when child components don't expose `name` or other form props.
+
+| Prop | Type | Description |
+|------|------|-------------|
+| `name` | `string` | Field name |
+| `type` | `string` | *(optional)* HTML input type, default `"string"` |
+| `required` | `boolean` | *(optional)* Whether required |
+| `description` | `string` | *(optional)* Description for agents |
+| `min`, `max` | `number` | *(optional)* Numeric constraints |
+| `minLength`, `maxLength` | `number` | *(optional)* String length constraints |
+| `pattern` | `string` | *(optional)* Regex for string validation |
+| `enumValues` | `Array` of string/number/boolean | *(optional)* Allowed values |
+| `oneOf` | `{ value, label }[]` | *(optional)* Labelled options (auto-detected from `<option>` children if omitted) |
+
+#### `useRegisterField(field)`
+
+Registers field metadata with the nearest `WebMCP.Tool` context. Call from inside custom components that don't render standard form elements. SSR-safe.
+
+```tsx
+useRegisterField({
+  name: "rating",
+  type: "number",
+  required: true,
+  min: 1,
+  max: 5,
+  description: "Star rating from 1 to 5",
+});
+```
+
+#### `FieldDefinition`
+
+Type for field metadata. See `src/adapters/types.ts` for the full interface.
+
+#### Utilities (schema building)
+
+- **`extractFields(children)`** — Traverse React children and extract `FieldDefinition[]` from `name`, `type`, `required`, etc.
+- **`extractOptions(children)`** — Extract `{ value, label }[]` from `<option>` or `MenuItem`-like children.
+- **`buildInputSchema(fields)`** — Convert `FieldDefinition[]` to JSON Schema.
+- **`validateSchema(fields, { strict? })`** — Dev-mode validation; warns (or throws if `strict`) on conflicts.
+
 ### Utilities
 
 #### `isWebMCPAvailable()`
@@ -231,22 +350,17 @@ useWebMCPTool({
 
 ## Demos
 
-### Flight Search (Imperative API)
-
-Replicates Google's [react-flightsearch](https://googlechromelabs.github.io/webmcp-tools/demos/react-flightsearch/) demo using `useWebMCPTool` hooks. Exposes 4 tools: `searchFlights`, `listFlights`, `setFilters`, `resetFilters`.
-
-```bash
-cd demos/flight-search
-npm install
-npm run dev
-```
-
-### French Bistro (Declarative API)
+Four demo apps showcase the different API styles. See [demos/README.md](./demos/README.md) for a detailed comparison and quick-start guide.
 
-Replicates Google's [french-bistro](https://googlechromelabs.github.io/webmcp-tools/demos/french-bistro/) demo using `<WebMCPForm>` and `<WebMCPInput>` components. Exposes the `book_table_le_petit_bistro` tool.
+| Demo | API | Description |
+|------|-----|-------------|
+| [french-bistro](./demos/french-bistro) | Declarative | Restaurant reservation form — `WebMCPForm`, `WebMCPInput`, `WebMCPSelect`, `WebMCPTextarea` |
+| [flight-search](./demos/flight-search) | Imperative | Flight search with `useWebMCPTool` — `searchFlights`, `listFlights`, `setFilters`, `resetFilters` |
+| [contact-form](./demos/contact-form) | All four | Same form implemented four ways side-by-side for comparison |
+| [custom-components](./demos/custom-components) | Adapter | Custom UI (`StarRating`, `TagInput`, `ColorPicker`) with `useRegisterField` and `WebMCP.Field` |
 
 ```bash
-cd demos/french-bistro
+cd demos/<demo-name>
 npm install
 npm run dev
 ```
@@ -264,8 +378,10 @@ npm run dev
 ```
 Your React App
     │
-    ├─ useWebMCPTool()  ──► navigator.modelContext.registerTool()
-    ├─ <WebMCPForm>     ──► <form toolname="..." tooldescription="...">
+    ├─ useWebMCPTool()   ──► navigator.modelContext.registerTool()
+    ├─ <WebMCPForm>      ──► <form toolname="..." tooldescription="...">
+    ├─ <WebMCP.Tool>     ──► Collects fields (children + fields + useRegisterField)
+    │                         → buildInputSchema() → registerTool()
     │
     └─ Browser (Chrome 146+)
          │
@@ -285,6 +401,9 @@ import type {
   JSONSchema,
   ToolAnnotations,
   WebMCPFormSubmitEvent,
+  WebMCPToolProps,
+  WebMCPFieldProps,
+  FieldDefinition,
   ModelContext,
 } from "react-webmcp";
 ```

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import React from 'react';
+import React$1 from 'react';
 
 /**
  * WebMCP type definitions for the W3C navigator.modelContext API.
@@ -270,7 +270,7 @@ declare function useWebMCPContext(config: {
  */
 declare function useToolEvent(event: "toolactivated" | "toolcancel", callback: (toolName: string) => void, toolNameFilter?: string): void;
 
-interface WebMCPFormProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit"> {
+interface WebMCPFormProps extends Omit<React$1.FormHTMLAttributes<HTMLFormElement>, "onSubmit"> {
     /** The tool name exposed to AI agents. Maps to the `toolname` HTML attribute. */
     toolName: string;
     /** Description of what this tool does. Maps to `tooldescription`. */
@@ -286,7 +286,7 @@ interface WebMCPFormProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>
     onToolActivated?: (toolName: string) => void;
     /** Called when a tool cancel event fires for this form's tool. */
     onToolCancel?: (toolName: string) => void;
-    children: React.ReactNode;
+    children: React$1.ReactNode;
 }
 /**
  * A React wrapper for the WebMCP declarative API.
@@ -314,7 +314,7 @@ interface WebMCPFormProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>
  */
 declare function WebMCPForm({ toolName, toolDescription, toolAutoSubmit, onSubmit, onToolActivated, onToolCancel, children, ...rest }: WebMCPFormProps): react_jsx_runtime.JSX.Element;
 
-interface WebMCPInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+interface WebMCPInputProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
     /** Maps to the `toolparamtitle` attribute (overrides the JSON Schema property key). */
     toolParamTitle?: string;
     /** Maps to the `toolparamdescription` attribute (describes this parameter to agents). */
@@ -337,14 +337,14 @@ interface WebMCPInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
  * />
  * ```
  */
-declare const WebMCPInput: React.ForwardRefExoticComponent<WebMCPInputProps & React.RefAttributes<HTMLInputElement>>;
+declare const WebMCPInput: React$1.ForwardRefExoticComponent<WebMCPInputProps & React$1.RefAttributes<HTMLInputElement>>;
 
-interface WebMCPSelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
+interface WebMCPSelectProps extends React$1.SelectHTMLAttributes<HTMLSelectElement> {
     /** Maps to the `toolparamtitle` attribute (overrides the JSON Schema property key). */
     toolParamTitle?: string;
     /** Maps to the `toolparamdescription` attribute (describes this parameter to agents). */
     toolParamDescription?: string;
-    children: React.ReactNode;
+    children: React$1.ReactNode;
 }
 /**
  * A `<select>` element enhanced with WebMCP declarative attributes.
@@ -364,9 +364,9 @@ interface WebMCPSelectProps extends React.SelectHTMLAttributes<HTMLSelectElement
  * </WebMCPSelect>
  * ```
  */
-declare const WebMCPSelect: React.ForwardRefExoticComponent<WebMCPSelectProps & React.RefAttributes<HTMLSelectElement>>;
+declare const WebMCPSelect: React$1.ForwardRefExoticComponent<WebMCPSelectProps & React$1.RefAttributes<HTMLSelectElement>>;
 
-interface WebMCPTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+interface WebMCPTextareaProps extends React$1.TextareaHTMLAttributes<HTMLTextAreaElement> {
     /** Maps to the `toolparamtitle` attribute (overrides the JSON Schema property key). */
     toolParamTitle?: string;
     /** Maps to the `toolparamdescription` attribute (describes this parameter to agents). */
@@ -386,7 +386,7 @@ interface WebMCPTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaE
  * />
  * ```
  */
-declare const WebMCPTextarea: React.ForwardRefExoticComponent<WebMCPTextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+declare const WebMCPTextarea: React$1.ForwardRefExoticComponent<WebMCPTextareaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
 
 interface WebMCPContextValue {
     /** Whether navigator.modelContext is available in this browser. */
@@ -412,7 +412,7 @@ interface WebMCPContextValue {
  * ```
  */
 declare function WebMCPProvider({ children }: {
-    children: React.ReactNode;
+    children: React$1.ReactNode;
 }): react_jsx_runtime.JSX.Element;
 /**
  * Returns the current WebMCP availability status.
@@ -445,4 +445,284 @@ declare function isWebMCPAvailable(): boolean;
  */
 declare function isWebMCPTestingAvailable(): boolean;
 
-export { type JSONSchema, type JSONSchemaProperty, type ModelContext, type ModelContextTesting, type ToolActivatedEvent, type ToolAnnotations, type ToolCancelEvent, type ToolContent, type ToolContentJSON, type ToolContentText, type UseWebMCPToolConfig, type WebMCPContextConfig, WebMCPForm, type WebMCPFormProps, type WebMCPFormSubmitEvent, WebMCPInput, type WebMCPInputProps, WebMCPProvider, WebMCPSelect, type WebMCPSelectProps, WebMCPTextarea, type WebMCPTextareaProps, type WebMCPToolDefinition, getModelContext, isWebMCPAvailable, isWebMCPTestingAvailable, useToolEvent, useWebMCPContext, useWebMCPStatus, useWebMCPTool };
+/**
+ * Type definitions for the WebMCP adapter layer.
+ *
+ * These types support the runtime schema collector engine that enables
+ * third-party UI component libraries (e.g. Material UI) to work with
+ * the WebMCP tool registration API.
+ */
+/**
+ * Describes a single field (tool parameter) collected from React children,
+ * the `fields` prop, or via `useRegisterField`.
+ *
+ * @example
+ * ```ts
+ * const field: FieldDefinition = {
+ *   name: "email",
+ *   type: "email",
+ *   required: true,
+ *   description: "Recipient's email address",
+ * };
+ * ```
+ */
+interface FieldDefinition {
+    /** Field name — must be unique within a tool. */
+    name: string;
+    /** HTML input type (e.g. "text", "email", "number"). Defaults to "string". */
+    type?: string;
+    /** Whether the field is required. */
+    required?: boolean;
+    /** Human-readable title for agents. */
+    title?: string;
+    /** Human-readable description for agents. */
+    description?: string;
+    /** Minimum numeric value (maps to JSON Schema `minimum`). */
+    min?: number;
+    /** Maximum numeric value (maps to JSON Schema `maximum`). */
+    max?: number;
+    /** Minimum string length (maps to JSON Schema `minLength`). */
+    minLength?: number;
+    /** Maximum string length (maps to JSON Schema `maxLength`). */
+    maxLength?: number;
+    /** Regex pattern for string validation (maps to JSON Schema `pattern`). */
+    pattern?: string;
+    /** Allowed values — mapped to JSON Schema `enum`. */
+    enumValues?: (string | number | boolean)[];
+    /** Labelled options — mapped to JSON Schema `oneOf`. */
+    oneOf?: {
+        value: string | number | boolean;
+        label: string;
+    }[];
+}
+
+/**
+ * Props for the `WebMCP.Tool` component.
+ */
+interface WebMCPToolProps {
+    /** Unique tool name exposed to AI agents. */
+    name: string;
+    /** Human-readable description of what this tool does. */
+    description: string;
+    /** Handler called when an AI agent invokes this tool. */
+    onExecute: (input: Record<string, unknown>) => unknown | Promise<unknown>;
+    /** Optional field overrides / enrichment keyed by field name. */
+    fields?: Record<string, Partial<FieldDefinition>>;
+    /** When true, schema validation issues throw instead of warn. */
+    strict?: boolean;
+    /** If true, the tool auto-submits when filled by an agent. */
+    autoSubmit?: boolean;
+    /** Optional metadata hints for agents. */
+    annotations?: ToolAnnotations;
+    /** Called when a `toolactivated` event fires for this tool. */
+    onToolActivated?: (toolName: string) => void;
+    /** Called when a `toolcancel` event fires for this tool. */
+    onToolCancel?: (toolName: string) => void;
+    children: React$1.ReactNode;
+}
+/**
+ * Framework-agnostic tool wrapper that collects a JSON Schema from its
+ * React children and registers it as a WebMCP tool.
+ *
+ * Fields are auto-detected from child components (e.g. `<Input name="email" />`),
+ * enriched via the `fields` prop, and can be overridden by descendant
+ * components using `useRegisterField`.
+ *
+ * @example
+ * ```tsx
+ * <WebMCPTool
+ *   name="send_email"
+ *   description="Send an email to a user"
+ *   onExecute={async ({ email, priority }) => {
+ *     await sendEmail(email, priority);
+ *     return { content: [{ type: "text", text: "Sent!" }] };
+ *   }}
+ *   fields={{ email: { description: "Recipient's email" } }}
+ * >
+ *   <FormControl>
+ *     <Input name="email" type="email" required />
+ *   </FormControl>
+ * </WebMCPTool>
+ * ```
+ */
+declare function WebMCPTool({ name, description, onExecute, fields: fieldsProp, strict, autoSubmit, annotations, onToolActivated, onToolCancel, children, }: WebMCPToolProps): react_jsx_runtime.JSX.Element;
+declare namespace WebMCPTool {
+    var displayName: string;
+}
+
+/**
+ * Props for the `WebMCP.Field` component.
+ */
+interface WebMCPFieldProps extends Omit<FieldDefinition, "name"> {
+    /** Field name — must be unique within the parent `WebMCP.Tool`. */
+    name: string;
+    children: React$1.ReactNode;
+}
+/**
+ * Zero-UI wrapper that registers a field with the nearest `WebMCP.Tool`.
+ *
+ * Use this as an escape hatch for custom components that cannot be
+ * auto-detected by the children traversal engine. Enum values are
+ * automatically detected from children that have a `value` prop
+ * (e.g. `<MenuItem value="low">Low</MenuItem>`).
+ *
+ * Renders a React Fragment — no extra DOM elements are introduced.
+ *
+ * @example
+ * ```tsx
+ * <WebMCP.Field name="priority" description="Email priority">
+ *   <Select>
+ *     <MenuItem value="low">Low</MenuItem>
+ *     <MenuItem value="high">High</MenuItem>
+ *   </Select>
+ * </WebMCP.Field>
+ * ```
+ */
+declare function WebMCPField({ children, name, ...rest }: WebMCPFieldProps): react_jsx_runtime.JSX.Element;
+declare namespace WebMCPField {
+    var displayName: string;
+}
+
+/**
+ * Register a field definition with the nearest `WebMCP.Tool` ancestor.
+ *
+ * Uses `useEffect` (SSR-safe) so registration only happens on the client.
+ * The field is automatically unregistered on unmount. Re-registration
+ * only occurs when the field definition changes (compared by fingerprint).
+ *
+ * If no `WebMCP.Tool` ancestor exists, a dev-mode warning is logged.
+ *
+ * @example
+ * ```tsx
+ * function MyField() {
+ *   useRegisterField({ name: "email", type: "email", required: true });
+ *   return <input name="email" type="email" required />;
+ * }
+ * ```
+ */
+declare function useRegisterField(field: FieldDefinition): void;
+
+interface UseSchemaCollectorOptions {
+    /** React children to traverse for auto-detected fields. */
+    children: React.ReactNode;
+    /** Optional field overrides keyed by field name. */
+    fields?: Record<string, Partial<FieldDefinition>>;
+    /** When true, validation issues throw instead of warn. */
+    strict?: boolean;
+}
+/**
+ * Core engine hook that collects field definitions from three sources,
+ * merges them, validates in dev, and builds a deterministic JSON Schema.
+ *
+ * **Sources** (lowest to highest priority):
+ * 1. Children traversal (auto-detected from React tree)
+ * 2. `fields` prop (enrichment / override)
+ * 3. Context-registered fields (via `useRegisterField`)
+ *
+ * @example
+ * ```tsx
+ * const { schema, registerField, unregisterField } = useSchemaCollector({
+ *   children,
+ *   fields: { email: { description: "Recipient" } },
+ * });
+ * ```
+ */
+declare function useSchemaCollector({ children, fields: fieldsProp, strict, }: UseSchemaCollectorOptions): {
+    schema: JSONSchema;
+    registerField: (field: FieldDefinition) => void;
+    unregisterField: (name: string) => void;
+};
+
+/**
+ * Recursively extract option values from React children.
+ *
+ * Detects elements that have a `value` prop (e.g. `<MenuItem value="low">Low</MenuItem>`)
+ * and collects `{ value, label }` pairs. The label is derived from string children
+ * or falls back to `String(value)`.
+ *
+ * @example
+ * ```tsx
+ * const options = extractOptions(
+ *   <>
+ *     <MenuItem value="low">Low</MenuItem>
+ *     <MenuItem value="high">High</MenuItem>
+ *   </>
+ * );
+ * // [{ value: "low", label: "Low" }, { value: "high", label: "High" }]
+ * ```
+ */
+declare function extractOptions(children: React$1.ReactNode): {
+    value: string | number | boolean;
+    label: string;
+}[];
+/**
+ * Recursively extract field definitions from a React children tree.
+ *
+ * Walks the tree using `React.Children.toArray` (safe, pure traversal).
+ * Detects field names from `props.name`, `props.inputProps.name`, or
+ * `props.slotProps.input.name`. When a named element is found, it builds
+ * a `FieldDefinition` from its props and auto-detects enum values from
+ * its children. Elements without a name are recursed into.
+ *
+ * @example
+ * ```tsx
+ * const fields = extractFields(
+ *   <>
+ *     <Input name="email" type="email" required />
+ *     <Select name="priority">
+ *       <MenuItem value="low">Low</MenuItem>
+ *       <MenuItem value="high">High</MenuItem>
+ *     </Select>
+ *   </>
+ * );
+ * ```
+ */
+declare function extractFields(children: React$1.ReactNode): FieldDefinition[];
+
+/**
+ * Build a deterministic JSON Schema from an array of field definitions.
+ *
+ * Property names are sorted alphabetically and the `required` array is
+ * also sorted, ensuring identical output regardless of field insertion
+ * order.
+ *
+ * @example
+ * ```ts
+ * const schema = buildInputSchema([
+ *   { name: "email", type: "email", required: true },
+ *   { name: "age", type: "number", min: 0, max: 120 },
+ * ]);
+ * ```
+ */
+declare function buildInputSchema(fields: FieldDefinition[]): JSONSchema;
+
+/**
+ * Validate an array of field definitions for common schema issues.
+ *
+ * In production this is a no-op. In development it checks for:
+ * - Duplicate field names
+ * - `pattern` used on non-string types
+ * - `min`/`max` used on non-number types
+ * - `minLength`/`maxLength` used on non-string types
+ * - Enum values whose types don't match the declared field type
+ *
+ * By default warnings are logged via `console.warn` with the
+ * `[react-webmcp]` prefix. When `strict` is `true`, an `Error` is
+ * thrown instead.
+ *
+ * @example
+ * ```ts
+ * validateSchema(fields); // warns in dev
+ * validateSchema(fields, { strict: true }); // throws in dev
+ * ```
+ */
+declare function validateSchema(fields: FieldDefinition[], options?: {
+    strict?: boolean;
+}): void;
+
+declare const WebMCP: {
+    readonly Tool: typeof WebMCPTool;
+    readonly Field: typeof WebMCPField;
+};
+
+export { type FieldDefinition, type JSONSchema, type JSONSchemaProperty, type ModelContext, type ModelContextTesting, type ToolActivatedEvent, type ToolAnnotations, type ToolCancelEvent, type ToolContent, type ToolContentJSON, type ToolContentText, type UseWebMCPToolConfig, WebMCP, type WebMCPContextConfig, WebMCPField, type WebMCPFieldProps, WebMCPForm, type WebMCPFormProps, type WebMCPFormSubmitEvent, WebMCPInput, type WebMCPInputProps, WebMCPProvider, WebMCPSelect, type WebMCPSelectProps, WebMCPTextarea, type WebMCPTextareaProps, WebMCPTool, type WebMCPToolDefinition, type WebMCPToolProps, buildInputSchema, extractFields, extractOptions, getModelContext, isWebMCPAvailable, isWebMCPTestingAvailable, useRegisterField, useSchemaCollector, useToolEvent, useWebMCPContext, useWebMCPStatus, useWebMCPTool, validateSchema };