Getting Started #

import { MCPForm, type MCPSchema } from "mcpform-react";

const schema: MCPSchema = {
  name: { type: "string", required: true, description: "Customer full name" },
  email: { type: "string", required: true, description: "Contact email" },
  priority: { type: "number", description: "Priority score" },
  urgent: { type: "boolean", description: "Requires immediate action" }
};

export function ContactForm(): JSX.Element {
  return (
    <MCPForm
      tool={{ name: "submit_contact", description: "Submit contact details" }}
      schema={schema}
      onSubmit={async (data) => {
        // Send validated data to your app logic.
      }}
      webMCP={{ mode: "both" }}
    />
  );
}