{"owner":"TanStack","repo":"form","hasSkills":true,"totalSkillsCount":15,"totalTokensCount":12504,"categories":["root-instruction","plugin-manifest","cursor-rule"],"hasMcp":false,"mcpConfig":null,"found":["AGENTS.md","examples/react/devtools/README.md","examples/solid/devtools/README.md","packages/angular-form/README.md","packages/form-devtools/README.md","packages/lit-form/README.md","packages/preact-form/README.md","packages/react-form-devtools/README.md","packages/react-form-nextjs/README.md","packages/react-form-remix/README.md","packages/react-form-start/README.md","packages/react-form/README.md","packages/solid-form/README.md","packages/vue-form/README.md",".cursorrules (react-formengine-ai-form-builder-cursorrules-prompt-file.mdc)"],"skills":{"AGENTS.md":"# Agent Instructions\n\nBefore analyzing or changing this repository, read and follow\n[`CONTRIBUTING.md`](./CONTRIBUTING.md). Its contribution, development, testing,\npull request, and changeset requirements apply to AI-assisted work as well as\nhuman-authored work.\n\nKeep every change focused on one topic. Understand and verify all generated\ncode, run the required checks, and provide a concise pull request description\nthat follows the repository template.\n","examples/react/devtools/README.md":"# Example\n\nTo run this example:\n\n- `npm install`\n- `npm run dev`\n","examples/solid/devtools/README.md":"## Usage\n\n```bash\n$ npm install # or pnpm install or yarn install\n```\n\n### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm run dev`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:5173](http://localhost:5173) to view it in the browser.\n\n### `npm run build`\n\nBuilds the app for production to the `dist` folder.<br>\nIt correctly bundles Solid in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\n## Deployment\n\nLearn more about deploying your application with the [documentations](https://vitejs.dev/guide/static-deploy.html)\n","packages/angular-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n    alt=\"TanStack Angular Form\"\n    width=\"900\"\n  />\n</picture>\n\nDirectives for managing form state in Angular\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22angular-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/angular-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/angular-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/angular-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/form-devtools/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png\"\n    alt=\"TanStack Form\"\n    width=\"900\"\n  />\n</picture>\n\nDevtools for the TanStack form library.\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/lit-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n    alt=\"TanStack Lit Form\"\n    width=\"900\"\n  />\n</picture>\n\nControllers for managing form state in Lit\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22lit-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/lit-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/lit-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/lit-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/preact-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n    alt=\"TanStack Preact Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in Preact\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22preact-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/preact-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/preact-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/preact-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-devtools/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-nextjs/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-remix/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-start/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/solid-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n    alt=\"TanStack Solid Form\"\n    width=\"900\"\n  />\n</picture>\n\nSignals for managing form state in Solid\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/vue-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n    alt=\"TanStack Vue Form\"\n    width=\"900\"\n  />\n</picture>\n\nCompositions for managing form state in Vue\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22vue-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/vue-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/vue-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/vue-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n",".cursorrules (react-formengine-ai-form-builder-cursorrules-prompt-file.mdc)":"---\ndescription: \"Cursor rules for generating React forms from screenshots, PDFs, HTML, or text descriptions with validated FormEngine JSON schema. Renders through RSuite, Material UI, or Mantine.\"\nglobs: **/*\nalwaysApply: false\n---\n# FormEngine — AI Form Builder for React\n\nGenerate production-ready React forms from a screenshot, PDF, HTML, or\ntext description. The output is a validated FormEngine JSON schema plus\na runnable App.tsx — portable data, not throwaway JSX.\n\nDefault target: FormEngine Core (MIT, free) via `@react-form-builder/core`\n+ `@react-form-builder/components-rsuite` (or Material UI / Mantine).\n\nSource repo: https://github.com/lukinov/ai-form-builder\n\n## What you produce — every time\n\n1. `form.json` — a normalized FormEngine schema, validated against the\n   real list of component types from the target UI library.\n2. `App.tsx` — a runnable React file that imports the schema and renders\n   it through `<FormViewer>`.\n3. A short validation report (Screen root, unique keys, layout-only\n   `css`, no smuggled HTML markup, valid validation rule keys).\n4. Install command + a link to the free Online FormBuilder\n   (https://formbuilder.formengine.io) so the user can tweak visually.\n\n## Hard rules — never violate\n\n### Schema invariants\n\n- Root is `type: \"Screen\"` (NOT `\"Form\"`).\n- Every component node has `key` (unique within the tree), `type` (must\n  exist in the chosen library), and usually `props`.\n- **Every prop value is wrapped:** `\"label\": { \"value\": \"Email\" }` —\n  never `\"label\": \"Email\"`.\n- Validations live under `schema.validations` on the field component\n  that owns the data — never on the Screen root.\n- Use the correct tooltip/error types:\n  - RSuite: `RsTooltip` / `RsErrorMessage`\n  - MUI: `MuiTooltip` / `MuiErrorWrapper`\n  - Mantine: `MtTooltip` / `MtErrorWrapper`\n\n### Layout vs. styling\n\n- `css` and `wrapperCss` are **layout-only** — flex, grid, box-model,\n  margin, padding, gap, width/height, alignment. **Never** color, font,\n  background, border, shadow, radius, opacity, transform.\n- Visual styling belongs in the UI library's theme provider in\n  `App.tsx` (`<CustomProvider>` / `<ThemeProvider>` / `<MantineProvider>`).\n- The legacy `style` field is **forbidden** — use `css` / `wrapperCss`.\n- The shape is `{ \"any\": { \"object\": { \"<layout-key>\": \"<value>\" } } }`,\n  never a plain CSS string.\n- No companion `.css` file alongside `App.tsx`. No root `className`. No\n  `<style>` blocks. No `styled-components`.\n\n### Plain-text strings only\n\nEvery string inside any prop is plain text. **No HTML markup of any\nkind**, anywhere — no `<h1>`, `<p>`, `<strong>`, `<small>`, `<br>`, no\n`style=\"...\"`, no `class=\"...\"`, no `<style>` block. Express section\nheadings and structure with components (`RsCard` with `header` prop,\n`RsHeader`, `RsDivider`) — not embedded HTML.\n\n### Validation rule keys — Zod set only\n\nValid keys: `required`, `nonEmpty`, `min`, `max`, `length`, `email`,\n`url`, `uuid`, `ip`, `datetime`, `regex`, `includes`, `startsWith`,\n`endsWith`, `lessThan`, `moreThan`, `integer`, `multipleOf`, `truthy`,\n`falsy`. There is **no `minLength` / `maxLength`** — use `min` / `max`\nwith `args.limit`.\n\n## UI library defaults\n\n- **Default to RSuite.** Reference library; widest component set\n  including `RsWizard` for multi-step forms.\n- **Material UI** when the user mentions MUI, Material, or their project\n  is on MUI.\n- **Mantine** when the user mentions Mantine or needs a component that's\n  Mantine-only (color picker, rich date pickers, segmented control).\n\nState the choice explicitly in the first sentence of the response.\n\n## Common renames — always emit the right name\n\n| Wrong | Right |\n|---|---|\n| `Form` | `Screen` |\n| `RsForm` | `RsCard` or `RsContainer` |\n| `RsSelectPicker` | `RsDropdown` |\n| `RsRadio` | `RsRadioGroup` |\n| `RsTextarea` | `RsTextArea` (capital A) |\n| `RsInputNumber` | `RsNumberFormat` |\n| `RsUpload` | `RsUploader` |\n| `MtDatePickerSingle` | `MtDatePicker` |\n| `MtTextField` | `MtTextInput` |\n\n## Side-by-side fields\n\nUse `RsContainer` with `display: flex` and children with\n`wrapperCss.any.object.flex: \"1\"`. RSuite has no FlexboxGrid/Stack\nadapter — flex on `RsContainer` is the mechanism.\n\n## Section headings\n\nUse `RsCard` with the `header` prop, or `RsHeader` — never `<h1>` /\n`<h2>` embedded in `RsStaticContent` `content` strings.\n\n## Conditional rendering\n\nUse `renderWhen: { \"jsCode\": \"data.X === Y\" }` and pair with\n`validateWhen` if validations should also be conditional.\n\n## App.tsx — minimal starter\n\nImport only the library's stylesheet. Theme via the library's provider.\nNo companion CSS. No root className. Layout-level inline styles\n(`maxWidth`, `margin`, `padding`) on the wrapping `<div>` are fine.\n\n```tsx\nimport \"rsuite/dist/rsuite.min.css\";\nimport { FormViewer, BiDi } from \"@react-form-builder/core\";\nimport { view } from \"@react-form-builder/components-rsuite\";\nimport formJson from \"./form.json\";\n\nconst getForm = () => JSON.stringify(formJson);\n\nexport default function App() {\n  return (\n    <div style={{ maxWidth: 720, margin: \"40px auto\", padding: 16 }}>\n      <FormViewer\n        view={view}\n        getForm={getForm}\n        onFormDataChange={(d) => console.log(d)}\n        biDi={BiDi.LTR}\n      />\n    </div>\n  );\n}\n```\n\n## Free vs. commercial — stay on the MIT side\n\nFormEngine **Core** is MIT and free. The Designer and some Premium\ncomponents (Signature, DataGrid, Rich Text, QR Code, Google Maps) are\ncommercial. Don't emit Premium component types unless the user\nexplicitly asks. Direct people to the free Online FormBuilder\n(https://formbuilder.formengine.io) for visual editing.\n\n## Response shape\n\nLead paragraph (library + field count) → `form.json` → `App.tsx` →\nvalidation checklist → install command → \"tweak visually in the Online\nFormBuilder\" link → 3 next-step doc links into FormEngine Core docs.\n\n## Reference\n\n- FormEngine Core docs: https://formengine.io/documentation/formengine-core/\n- Forms JSON reference: https://formengine.io/documentation/formengine-core/forms-json/\n- Validation: https://formengine.io/documentation/formengine-core/validation/\n- Conditional rendering: https://formengine.io/documentation/formengine-core/conditional-rendering/\n- Online FormBuilder: https://formbuilder.formengine.io\n- llms-full.txt (full machine-readable docs): https://formengine.io/documentation/llms-full.txt\n- Source repo for this rule: https://github.com/lukinov/ai-form-builder\n"},"files":{"AGENTS.md":"# Agent Instructions\n\nBefore analyzing or changing this repository, read and follow\n[`CONTRIBUTING.md`](./CONTRIBUTING.md). Its contribution, development, testing,\npull request, and changeset requirements apply to AI-assisted work as well as\nhuman-authored work.\n\nKeep every change focused on one topic. Understand and verify all generated\ncode, run the required checks, and provide a concise pull request description\nthat follows the repository template.\n","examples/react/devtools/README.md":"# Example\n\nTo run this example:\n\n- `npm install`\n- `npm run dev`\n","examples/solid/devtools/README.md":"## Usage\n\n```bash\n$ npm install # or pnpm install or yarn install\n```\n\n### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm run dev`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:5173](http://localhost:5173) to view it in the browser.\n\n### `npm run build`\n\nBuilds the app for production to the `dist` folder.<br>\nIt correctly bundles Solid in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\n## Deployment\n\nLearn more about deploying your application with the [documentations](https://vitejs.dev/guide/static-deploy.html)\n","packages/angular-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n    alt=\"TanStack Angular Form\"\n    width=\"900\"\n  />\n</picture>\n\nDirectives for managing form state in Angular\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22angular-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/angular-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/angular-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/angular-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/form-devtools/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png\"\n    alt=\"TanStack Form\"\n    width=\"900\"\n  />\n</picture>\n\nDevtools for the TanStack form library.\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/lit-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n    alt=\"TanStack Lit Form\"\n    width=\"900\"\n  />\n</picture>\n\nControllers for managing form state in Lit\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22lit-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/lit-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/lit-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/lit-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/preact-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n    alt=\"TanStack Preact Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in Preact\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22preact-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/preact-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/preact-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/preact-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-devtools/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-nextjs/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-remix/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form-start/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/react-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/solid-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n    alt=\"TanStack Solid Form\"\n    width=\"900\"\n  />\n</picture>\n\nSignals for managing form state in Solid\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","packages/vue-form/README.md":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n    alt=\"TanStack Vue Form\"\n    width=\"900\"\n  />\n</picture>\n\nCompositions for managing form state in Vue\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22vue-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/vue-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/vue-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/vue-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n",".cursorrules (react-formengine-ai-form-builder-cursorrules-prompt-file.mdc)":"---\ndescription: \"Cursor rules for generating React forms from screenshots, PDFs, HTML, or text descriptions with validated FormEngine JSON schema. Renders through RSuite, Material UI, or Mantine.\"\nglobs: **/*\nalwaysApply: false\n---\n# FormEngine — AI Form Builder for React\n\nGenerate production-ready React forms from a screenshot, PDF, HTML, or\ntext description. The output is a validated FormEngine JSON schema plus\na runnable App.tsx — portable data, not throwaway JSX.\n\nDefault target: FormEngine Core (MIT, free) via `@react-form-builder/core`\n+ `@react-form-builder/components-rsuite` (or Material UI / Mantine).\n\nSource repo: https://github.com/lukinov/ai-form-builder\n\n## What you produce — every time\n\n1. `form.json` — a normalized FormEngine schema, validated against the\n   real list of component types from the target UI library.\n2. `App.tsx` — a runnable React file that imports the schema and renders\n   it through `<FormViewer>`.\n3. A short validation report (Screen root, unique keys, layout-only\n   `css`, no smuggled HTML markup, valid validation rule keys).\n4. Install command + a link to the free Online FormBuilder\n   (https://formbuilder.formengine.io) so the user can tweak visually.\n\n## Hard rules — never violate\n\n### Schema invariants\n\n- Root is `type: \"Screen\"` (NOT `\"Form\"`).\n- Every component node has `key` (unique within the tree), `type` (must\n  exist in the chosen library), and usually `props`.\n- **Every prop value is wrapped:** `\"label\": { \"value\": \"Email\" }` —\n  never `\"label\": \"Email\"`.\n- Validations live under `schema.validations` on the field component\n  that owns the data — never on the Screen root.\n- Use the correct tooltip/error types:\n  - RSuite: `RsTooltip` / `RsErrorMessage`\n  - MUI: `MuiTooltip` / `MuiErrorWrapper`\n  - Mantine: `MtTooltip` / `MtErrorWrapper`\n\n### Layout vs. styling\n\n- `css` and `wrapperCss` are **layout-only** — flex, grid, box-model,\n  margin, padding, gap, width/height, alignment. **Never** color, font,\n  background, border, shadow, radius, opacity, transform.\n- Visual styling belongs in the UI library's theme provider in\n  `App.tsx` (`<CustomProvider>` / `<ThemeProvider>` / `<MantineProvider>`).\n- The legacy `style` field is **forbidden** — use `css` / `wrapperCss`.\n- The shape is `{ \"any\": { \"object\": { \"<layout-key>\": \"<value>\" } } }`,\n  never a plain CSS string.\n- No companion `.css` file alongside `App.tsx`. No root `className`. No\n  `<style>` blocks. No `styled-components`.\n\n### Plain-text strings only\n\nEvery string inside any prop is plain text. **No HTML markup of any\nkind**, anywhere — no `<h1>`, `<p>`, `<strong>`, `<small>`, `<br>`, no\n`style=\"...\"`, no `class=\"...\"`, no `<style>` block. Express section\nheadings and structure with components (`RsCard` with `header` prop,\n`RsHeader`, `RsDivider`) — not embedded HTML.\n\n### Validation rule keys — Zod set only\n\nValid keys: `required`, `nonEmpty`, `min`, `max`, `length`, `email`,\n`url`, `uuid`, `ip`, `datetime`, `regex`, `includes`, `startsWith`,\n`endsWith`, `lessThan`, `moreThan`, `integer`, `multipleOf`, `truthy`,\n`falsy`. There is **no `minLength` / `maxLength`** — use `min` / `max`\nwith `args.limit`.\n\n## UI library defaults\n\n- **Default to RSuite.** Reference library; widest component set\n  including `RsWizard` for multi-step forms.\n- **Material UI** when the user mentions MUI, Material, or their project\n  is on MUI.\n- **Mantine** when the user mentions Mantine or needs a component that's\n  Mantine-only (color picker, rich date pickers, segmented control).\n\nState the choice explicitly in the first sentence of the response.\n\n## Common renames — always emit the right name\n\n| Wrong | Right |\n|---|---|\n| `Form` | `Screen` |\n| `RsForm` | `RsCard` or `RsContainer` |\n| `RsSelectPicker` | `RsDropdown` |\n| `RsRadio` | `RsRadioGroup` |\n| `RsTextarea` | `RsTextArea` (capital A) |\n| `RsInputNumber` | `RsNumberFormat` |\n| `RsUpload` | `RsUploader` |\n| `MtDatePickerSingle` | `MtDatePicker` |\n| `MtTextField` | `MtTextInput` |\n\n## Side-by-side fields\n\nUse `RsContainer` with `display: flex` and children with\n`wrapperCss.any.object.flex: \"1\"`. RSuite has no FlexboxGrid/Stack\nadapter — flex on `RsContainer` is the mechanism.\n\n## Section headings\n\nUse `RsCard` with the `header` prop, or `RsHeader` — never `<h1>` /\n`<h2>` embedded in `RsStaticContent` `content` strings.\n\n## Conditional rendering\n\nUse `renderWhen: { \"jsCode\": \"data.X === Y\" }` and pair with\n`validateWhen` if validations should also be conditional.\n\n## App.tsx — minimal starter\n\nImport only the library's stylesheet. Theme via the library's provider.\nNo companion CSS. No root className. Layout-level inline styles\n(`maxWidth`, `margin`, `padding`) on the wrapping `<div>` are fine.\n\n```tsx\nimport \"rsuite/dist/rsuite.min.css\";\nimport { FormViewer, BiDi } from \"@react-form-builder/core\";\nimport { view } from \"@react-form-builder/components-rsuite\";\nimport formJson from \"./form.json\";\n\nconst getForm = () => JSON.stringify(formJson);\n\nexport default function App() {\n  return (\n    <div style={{ maxWidth: 720, margin: \"40px auto\", padding: 16 }}>\n      <FormViewer\n        view={view}\n        getForm={getForm}\n        onFormDataChange={(d) => console.log(d)}\n        biDi={BiDi.LTR}\n      />\n    </div>\n  );\n}\n```\n\n## Free vs. commercial — stay on the MIT side\n\nFormEngine **Core** is MIT and free. The Designer and some Premium\ncomponents (Signature, DataGrid, Rich Text, QR Code, Google Maps) are\ncommercial. Don't emit Premium component types unless the user\nexplicitly asks. Direct people to the free Online FormBuilder\n(https://formbuilder.formengine.io) for visual editing.\n\n## Response shape\n\nLead paragraph (library + field count) → `form.json` → `App.tsx` →\nvalidation checklist → install command → \"tweak visually in the Online\nFormBuilder\" link → 3 next-step doc links into FormEngine Core docs.\n\n## Reference\n\n- FormEngine Core docs: https://formengine.io/documentation/formengine-core/\n- Forms JSON reference: https://formengine.io/documentation/formengine-core/forms-json/\n- Validation: https://formengine.io/documentation/formengine-core/validation/\n- Conditional rendering: https://formengine.io/documentation/formengine-core/conditional-rendering/\n- Online FormBuilder: https://formbuilder.formengine.io\n- llms-full.txt (full machine-readable docs): https://formengine.io/documentation/llms-full.txt\n- Source repo for this rule: https://github.com/lukinov/ai-form-builder\n"},"items":[{"name":"AGENTS.md","path":"AGENTS.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/AGENTS.md","title":"AI Agent Protocol & Instructions","category":"root-instruction","format":"markdown","content":"# Agent Instructions\n\nBefore analyzing or changing this repository, read and follow\n[`CONTRIBUTING.md`](./CONTRIBUTING.md). Its contribution, development, testing,\npull request, and changeset requirements apply to AI-assisted work as well as\nhuman-authored work.\n\nKeep every change focused on one topic. Understand and verify all generated\ncode, run the required checks, and provide a concise pull request description\nthat follows the repository template.\n","isInternal":false,"tokens":92,"sizeBytes":456},{"name":"README.md","path":"examples/react/devtools/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/examples/react/devtools/README.md","title":"devtools Documentation","category":"plugin-manifest","format":"markdown","content":"# Example\n\nTo run this example:\n\n- `npm install`\n- `npm run dev`\n","isInternal":false,"tokens":19,"sizeBytes":65},{"name":"README.md","path":"examples/solid/devtools/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/examples/solid/devtools/README.md","title":"devtools Documentation","category":"plugin-manifest","format":"markdown","content":"## Usage\n\n```bash\n$ npm install # or pnpm install or yarn install\n```\n\n### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm run dev`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:5173](http://localhost:5173) to view it in the browser.\n\n### `npm run build`\n\nBuilds the app for production to the `dist` folder.<br>\nIt correctly bundles Solid in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\n## Deployment\n\nLearn more about deploying your application with the [documentations](https://vitejs.dev/guide/static-deploy.html)\n","isInternal":false,"tokens":196,"sizeBytes":812},{"name":"README.md","path":"packages/angular-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/angular-form/README.md","title":"angular-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n    alt=\"TanStack Angular Form\"\n    width=\"900\"\n  />\n</picture>\n\nDirectives for managing form state in Angular\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22angular-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/angular-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/angular-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/angular-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":958,"sizeBytes":3100},{"name":"README.md","path":"packages/form-devtools/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/form-devtools/README.md","title":"form-devtools Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png\"\n    alt=\"TanStack Form\"\n    width=\"900\"\n  />\n</picture>\n\nDevtools for the TanStack form library.\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":948,"sizeBytes":3024},{"name":"README.md","path":"packages/lit-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/lit-form/README.md","title":"lit-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n    alt=\"TanStack Lit Form\"\n    width=\"900\"\n  />\n</picture>\n\nControllers for managing form state in Lit\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22lit-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/lit-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/lit-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/lit-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":960,"sizeBytes":3065},{"name":"README.md","path":"packages/preact-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/preact-form/README.md","title":"preact-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n    alt=\"TanStack Preact Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in Preact\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22preact-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/preact-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/preact-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/preact-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":966,"sizeBytes":3086},{"name":"README.md","path":"packages/react-form-devtools/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/react-form-devtools/README.md","title":"react-form-devtools Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":957,"sizeBytes":3077},{"name":"README.md","path":"packages/react-form-nextjs/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/react-form-nextjs/README.md","title":"react-form-nextjs Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":957,"sizeBytes":3077},{"name":"README.md","path":"packages/react-form-remix/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/react-form-remix/README.md","title":"react-form-remix Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":957,"sizeBytes":3077},{"name":"README.md","path":"packages/react-form-start/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/react-form-start/README.md","title":"react-form-start Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":957,"sizeBytes":3077},{"name":"README.md","path":"packages/react-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/react-form/README.md","title":"react-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":957,"sizeBytes":3077},{"name":"README.md","path":"packages/solid-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/solid-form/README.md","title":"solid-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n    alt=\"TanStack Solid Form\"\n    width=\"900\"\n  />\n</picture>\n\nSignals for managing form state in Solid\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":960,"sizeBytes":3079},{"name":"README.md","path":"packages/vue-form/README.md","rawUrl":"https://raw.githubusercontent.com/TanStack/form/HEAD/packages/vue-form/README.md","title":"vue-form Documentation","category":"plugin-manifest","format":"markdown","content":"<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n    alt=\"TanStack Vue Form\"\n    width=\"900\"\n  />\n</picture>\n\nCompositions for managing form state in Vue\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22vue-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/vue-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/vue-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/vue-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n","isInternal":false,"tokens":958,"sizeBytes":3066},{"name":".cursorrules","path":".cursorrules (react-formengine-ai-form-builder-cursorrules-prompt-file.mdc)","rawUrl":"https://raw.githubusercontent.com/PatrickJS/awesome-cursorrules/main/rules/react-formengine-ai-form-builder-cursorrules-prompt-file.mdc","title":"Awesome Cursorrules: react formengine ai form builder","category":"cursor-rule","format":"markdown","content":"---\ndescription: \"Cursor rules for generating React forms from screenshots, PDFs, HTML, or text descriptions with validated FormEngine JSON schema. Renders through RSuite, Material UI, or Mantine.\"\nglobs: **/*\nalwaysApply: false\n---\n# FormEngine — AI Form Builder for React\n\nGenerate production-ready React forms from a screenshot, PDF, HTML, or\ntext description. The output is a validated FormEngine JSON schema plus\na runnable App.tsx — portable data, not throwaway JSX.\n\nDefault target: FormEngine Core (MIT, free) via `@react-form-builder/core`\n+ `@react-form-builder/components-rsuite` (or Material UI / Mantine).\n\nSource repo: https://github.com/lukinov/ai-form-builder\n\n## What you produce — every time\n\n1. `form.json` — a normalized FormEngine schema, validated against the\n   real list of component types from the target UI library.\n2. `App.tsx` — a runnable React file that imports the schema and renders\n   it through `<FormViewer>`.\n3. A short validation report (Screen root, unique keys, layout-only\n   `css`, no smuggled HTML markup, valid validation rule keys).\n4. Install command + a link to the free Online FormBuilder\n   (https://formbuilder.formengine.io) so the user can tweak visually.\n\n## Hard rules — never violate\n\n### Schema invariants\n\n- Root is `type: \"Screen\"` (NOT `\"Form\"`).\n- Every component node has `key` (unique within the tree), `type` (must\n  exist in the chosen library), and usually `props`.\n- **Every prop value is wrapped:** `\"label\": { \"value\": \"Email\" }` —\n  never `\"label\": \"Email\"`.\n- Validations live under `schema.validations` on the field component\n  that owns the data — never on the Screen root.\n- Use the correct tooltip/error types:\n  - RSuite: `RsTooltip` / `RsErrorMessage`\n  - MUI: `MuiTooltip` / `MuiErrorWrapper`\n  - Mantine: `MtTooltip` / `MtErrorWrapper`\n\n### Layout vs. styling\n\n- `css` and `wrapperCss` are **layout-only** — flex, grid, box-model,\n  margin, padding, gap, width/height, alignment. **Never** color, font,\n  background, border, shadow, radius, opacity, transform.\n- Visual styling belongs in the UI library's theme provider in\n  `App.tsx` (`<CustomProvider>` / `<ThemeProvider>` / `<MantineProvider>`).\n- The legacy `style` field is **forbidden** — use `css` / `wrapperCss`.\n- The shape is `{ \"any\": { \"object\": { \"<layout-key>\": \"<value>\" } } }`,\n  never a plain CSS string.\n- No companion `.css` file alongside `App.tsx`. No root `className`. No\n  `<style>` blocks. No `styled-components`.\n\n### Plain-text strings only\n\nEvery string inside any prop is plain text. **No HTML markup of any\nkind**, anywhere — no `<h1>`, `<p>`, `<strong>`, `<small>`, `<br>`, no\n`style=\"...\"`, no `class=\"...\"`, no `<style>` block. Express section\nheadings and structure with components (`RsCard` with `header` prop,\n`RsHeader`, `RsDivider`) — not embedded HTML.\n\n### Validation rule keys — Zod set only\n\nValid keys: `required`, `nonEmpty`, `min`, `max`, `length`, `email`,\n`url`, `uuid`, `ip`, `datetime`, `regex`, `includes`, `startsWith`,\n`endsWith`, `lessThan`, `moreThan`, `integer`, `multipleOf`, `truthy`,\n`falsy`. There is **no `minLength` / `maxLength`** — use `min` / `max`\nwith `args.limit`.\n\n## UI library defaults\n\n- **Default to RSuite.** Reference library; widest component set\n  including `RsWizard` for multi-step forms.\n- **Material UI** when the user mentions MUI, Material, or their project\n  is on MUI.\n- **Mantine** when the user mentions Mantine or needs a component that's\n  Mantine-only (color picker, rich date pickers, segmented control).\n\nState the choice explicitly in the first sentence of the response.\n\n## Common renames — always emit the right name\n\n| Wrong | Right |\n|---|---|\n| `Form` | `Screen` |\n| `RsForm` | `RsCard` or `RsContainer` |\n| `RsSelectPicker` | `RsDropdown` |\n| `RsRadio` | `RsRadioGroup` |\n| `RsTextarea` | `RsTextArea` (capital A) |\n| `RsInputNumber` | `RsNumberFormat` |\n| `RsUpload` | `RsUploader` |\n| `MtDatePickerSingle` | `MtDatePicker` |\n| `MtTextField` | `MtTextInput` |\n\n## Side-by-side fields\n\nUse `RsContainer` with `display: flex` and children with\n`wrapperCss.any.object.flex: \"1\"`. RSuite has no FlexboxGrid/Stack\nadapter — flex on `RsContainer` is the mechanism.\n\n## Section headings\n\nUse `RsCard` with the `header` prop, or `RsHeader` — never `<h1>` /\n`<h2>` embedded in `RsStaticContent` `content` strings.\n\n## Conditional rendering\n\nUse `renderWhen: { \"jsCode\": \"data.X === Y\" }` and pair with\n`validateWhen` if validations should also be conditional.\n\n## App.tsx — minimal starter\n\nImport only the library's stylesheet. Theme via the library's provider.\nNo companion CSS. No root className. Layout-level inline styles\n(`maxWidth`, `margin`, `padding`) on the wrapping `<div>` are fine.\n\n```tsx\nimport \"rsuite/dist/rsuite.min.css\";\nimport { FormViewer, BiDi } from \"@react-form-builder/core\";\nimport { view } from \"@react-form-builder/components-rsuite\";\nimport formJson from \"./form.json\";\n\nconst getForm = () => JSON.stringify(formJson);\n\nexport default function App() {\n  return (\n    <div style={{ maxWidth: 720, margin: \"40px auto\", padding: 16 }}>\n      <FormViewer\n        view={view}\n        getForm={getForm}\n        onFormDataChange={(d) => console.log(d)}\n        biDi={BiDi.LTR}\n      />\n    </div>\n  );\n}\n```\n\n## Free vs. commercial — stay on the MIT side\n\nFormEngine **Core** is MIT and free. The Designer and some Premium\ncomponents (Signature, DataGrid, Rich Text, QR Code, Google Maps) are\ncommercial. Don't emit Premium component types unless the user\nexplicitly asks. Direct people to the free Online FormBuilder\n(https://formbuilder.formengine.io) for visual editing.\n\n## Response shape\n\nLead paragraph (library + field count) → `form.json` → `App.tsx` →\nvalidation checklist → install command → \"tweak visually in the Online\nFormBuilder\" link → 3 next-step doc links into FormEngine Core docs.\n\n## Reference\n\n- FormEngine Core docs: https://formengine.io/documentation/formengine-core/\n- Forms JSON reference: https://formengine.io/documentation/formengine-core/forms-json/\n- Validation: https://formengine.io/documentation/formengine-core/validation/\n- Conditional rendering: https://formengine.io/documentation/formengine-core/conditional-rendering/\n- Online FormBuilder: https://formbuilder.formengine.io\n- llms-full.txt (full machine-readable docs): https://formengine.io/documentation/llms-full.txt\n- Source repo for this rule: https://github.com/lukinov/ai-form-builder\n","tokens":1662,"sizeBytes":6472}],"systemPromptSnippet":"<yakaai_skills repo=\"TanStack/form\">\n<!-- File: AGENTS.md (Tokens: ~92 | Category: root-instruction) -->\n# Agent Instructions\n\nBefore analyzing or changing this repository, read and follow\n[`CONTRIBUTING.md`](./CONTRIBUTING.md). Its contribution, development, testing,\npull request, and changeset requirements apply to AI-assisted work as well as\nhuman-authored work.\n\nKeep every change focused on one topic. Understand and verify all generated\ncode, run the required checks, and provide a concise pull request description\nthat follows the repository template.\n\n<!-- File: examples/react/devtools/README.md (Tokens: ~19 | Category: plugin-manifest) -->\n# Example\n\nTo run this example:\n\n- `npm install`\n- `npm run dev`\n\n<!-- File: examples/solid/devtools/README.md (Tokens: ~196 | Category: plugin-manifest) -->\n## Usage\n\n```bash\n$ npm install # or pnpm install or yarn install\n```\n\n### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm run dev`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:5173](http://localhost:5173) to view it in the browser.\n\n### `npm run build`\n\nBuilds the app for production to the `dist` folder.<br>\nIt correctly bundles Solid in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\n## Deployment\n\nLearn more about deploying your application with the [documentations](https://vitejs.dev/guide/static-deploy.html)\n\n<!-- File: packages/angular-form/README.md (Tokens: ~958 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=angular\"\n    alt=\"TanStack Angular Form\"\n    width=\"900\"\n  />\n</picture>\n\nDirectives for managing form state in Angular\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22angular-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/angular-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/angular-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/angular-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/form-devtools/README.md (Tokens: ~948 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png\"\n    alt=\"TanStack Form\"\n    width=\"900\"\n  />\n</picture>\n\nDevtools for the TanStack form library.\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/lit-form/README.md (Tokens: ~960 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=lit\"\n    alt=\"TanStack Lit Form\"\n    width=\"900\"\n  />\n</picture>\n\nControllers for managing form state in Lit\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22lit-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/lit-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/lit-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/lit-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/preact-form/README.md (Tokens: ~966 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=preact\"\n    alt=\"TanStack Preact Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in Preact\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22preact-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/preact-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/preact-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/preact-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/react-form-devtools/README.md (Tokens: ~957 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/react-form-nextjs/README.md (Tokens: ~957 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/react-form-remix/README.md (Tokens: ~957 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/react-form-start/README.md (Tokens: ~957 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/react-form/README.md (Tokens: ~957 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=react\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=react\"\n    alt=\"TanStack React Form\"\n    width=\"900\"\n  />\n</picture>\n\nHooks for managing form state in React\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22react-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/react-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/react-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/react-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/solid-form/README.md (Tokens: ~960 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=solid\"\n    alt=\"TanStack Solid Form\"\n    width=\"900\"\n  />\n</picture>\n\nSignals for managing form state in Solid\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22solid-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/solid-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/solid-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/solid-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: packages/vue-form/README.md (Tokens: ~958 | Category: plugin-manifest) -->\n<img src=\"https://static.scarf.sh/a.png?x-pxid=be2d8a11-9712-4c1d-9963-580b2d4fb133\" />\n\n<picture>\n  <source\n    media=\"(prefers-color-scheme: dark)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue&theme=dark\"\n  />\n  <source\n    media=\"(prefers-color-scheme: light)\"\n    srcset=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n  />\n  <img\n    src=\"https://tanstack.com/api/readme/form.png?framework=vue\"\n    alt=\"TanStack Vue Form\"\n    width=\"900\"\n  />\n</picture>\n\nCompositions for managing form state in Vue\n\n<a href=\"https://twitter.com/intent/tweet?button_hashtag=TanStack\" target=\"\\_parent\">\n  <img alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\">\n</a><a href=\"https://discord.com/invite/WrRKjPJ\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" />\n</a><a href=\"https://github.com/TanStack/form/actions?query=workflow%3A%22vue-form+tests%22\">\n<img src=\"https://github.com/TanStack/form/workflows/vue-form%20tests/badge.svg\" />\n</a><a href=\"https://www.npmjs.com/package/@tanstack/form-core\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/form-core.svg\" />\n</a><a href=\"https://bundlephobia.com/package/@tanstack/vue-form@latest\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://badgen.net/bundlephobia/minzip/@tanstack/vue-form\" />\n</a><a href=\"#badge\">\n    <img alt=\"semantic-release\" src=\"https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg\">\n  </a><a href=\"https://github.com/TanStack/form/discussions\">\n  <img alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue\" />\n</a><a href=\"https://bestofjs.org/projects/tanstack-form\"><img alt=\"Best of JS\" src=\"https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=TanStack%form%26since=daily\" /></a><a href=\"https://github.com/TanStack/form/\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/github/stars/TanStack/form.svg?style=social&label=Star\" />\n</a><a href=\"https://twitter.com/tannerlinsley\" target=\"\\_parent\">\n  <img alt=\"\" src=\"https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow\" />\n</a> <a href=\"https://gitpod.io/from-referrer/\">\n  <img src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"/>\n</a>\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com)! [TanStack Table](https://github.com/TanStack/table), [TanStack Router](https://github.com/tanstack/router), [TanStack Virtual](https://github.com/tanstack/virtual), [React Charts](https://github.com/TanStack/react-charts), [React Ranger](https://github.com/TanStack/ranger)\n\n## Visit [tanstack.com/form](https://tanstack.com/form) for docs, guides, API and more!\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n<!-- Use the force, Luke -->\n\n<!-- File: .cursorrules (react-formengine-ai-form-builder-cursorrules-prompt-file.mdc) (Tokens: ~1662 | Category: cursor-rule) -->\n---\ndescription: \"Cursor rules for generating React forms from screenshots, PDFs, HTML, or text descriptions with validated FormEngine JSON schema. Renders through RSuite, Material UI, or Mantine.\"\nglobs: **/*\nalwaysApply: false\n---\n# FormEngine — AI Form Builder for React\n\nGenerate production-ready React forms from a screenshot, PDF, HTML, or\ntext description. The output is a validated FormEngine JSON schema plus\na runnable App.tsx — portable data, not throwaway JSX.\n\nDefault target: FormEngine Core (MIT, free) via `@react-form-builder/core`\n+ `@react-form-builder/components-rsuite` (or Material UI / Mantine).\n\nSource repo: https://github.com/lukinov/ai-form-builder\n\n## What you produce — every time\n\n1. `form.json` — a normalized FormEngine schema, validated against the\n   real list of component types from the target UI library.\n2. `App.tsx` — a runnable React file that imports the schema and renders\n   it through `<FormViewer>`.\n3. A short validation report (Screen root, unique keys, layout-only\n   `css`, no smuggled HTML markup, valid validation rule keys).\n4. Install command + a link to the free Online FormBuilder\n   (https://formbuilder.formengine.io) so the user can tweak visually.\n\n## Hard rules — never violate\n\n### Schema invariants\n\n- Root is `type: \"Screen\"` (NOT `\"Form\"`).\n- Every component node has `key` (unique within the tree), `type` (must\n  exist in the chosen library), and usually `props`.\n- **Every prop value is wrapped:** `\"label\": { \"value\": \"Email\" }` —\n  never `\"label\": \"Email\"`.\n- Validations live under `schema.validations` on the field component\n  that owns the data — never on the Screen root.\n- Use the correct tooltip/error types:\n  - RSuite: `RsTooltip` / `RsErrorMessage`\n  - MUI: `MuiTooltip` / `MuiErrorWrapper`\n  - Mantine: `MtTooltip` / `MtErrorWrapper`\n\n### Layout vs. styling\n\n- `css` and `wrapperCss` are **layout-only** — flex, grid, box-model,\n  margin, padding, gap, width/height, alignment. **Never** color, font,\n  background, border, shadow, radius, opacity, transform.\n- Visual styling belongs in the UI library's theme provider in\n  `App.tsx` (`<CustomProvider>` / `<ThemeProvider>` / `<MantineProvider>`).\n- The legacy `style` field is **forbidden** — use `css` / `wrapperCss`.\n- The shape is `{ \"any\": { \"object\": { \"<layout-key>\": \"<value>\" } } }`,\n  never a plain CSS string.\n- No companion `.css` file alongside `App.tsx`. No root `className`. No\n  `<style>` blocks. No `styled-components`.\n\n### Plain-text strings only\n\nEvery string inside any prop is plain text. **No HTML markup of any\nkind**, anywhere — no `<h1>`, `<p>`, `<strong>`, `<small>`, `<br>`, no\n`style=\"...\"`, no `class=\"...\"`, no `<style>` block. Express section\nheadings and structure with components (`RsCard` with `header` prop,\n`RsHeader`, `RsDivider`) — not embedded HTML.\n\n### Validation rule keys — Zod set only\n\nValid keys: `required`, `nonEmpty`, `min`, `max`, `length`, `email`,\n`url`, `uuid`, `ip`, `datetime`, `regex`, `includes`, `startsWith`,\n`endsWith`, `lessThan`, `moreThan`, `integer`, `multipleOf`, `truthy`,\n`falsy`. There is **no `minLength` / `maxLength`** — use `min` / `max`\nwith `args.limit`.\n\n## UI library defaults\n\n- **Default to RSuite.** Reference library; widest component set\n  including `RsWizard` for multi-step forms.\n- **Material UI** when the user mentions MUI, Material, or their project\n  is on MUI.\n- **Mantine** when the user mentions Mantine or needs a component that's\n  Mantine-only (color picker, rich date pickers, segmented control).\n\nState the choice explicitly in the first sentence of the response.\n\n## Common renames — always emit the right name\n\n| Wrong | Right |\n|---|---|\n| `Form` | `Screen` |\n| `RsForm` | `RsCard` or `RsContainer` |\n| `RsSelectPicker` | `RsDropdown` |\n| `RsRadio` | `RsRadioGroup` |\n| `RsTextarea` | `RsTextArea` (capital A) |\n| `RsInputNumber` | `RsNumberFormat` |\n| `RsUpload` | `RsUploader` |\n| `MtDatePickerSingle` | `MtDatePicker` |\n| `MtTextField` | `MtTextInput` |\n\n## Side-by-side fields\n\nUse `RsContainer` with `display: flex` and children with\n`wrapperCss.any.object.flex: \"1\"`. RSuite has no FlexboxGrid/Stack\nadapter — flex on `RsContainer` is the mechanism.\n\n## Section headings\n\nUse `RsCard` with the `header` prop, or `RsHeader` — never `<h1>` /\n`<h2>` embedded in `RsStaticContent` `content` strings.\n\n## Conditional rendering\n\nUse `renderWhen: { \"jsCode\": \"data.X === Y\" }` and pair with\n`validateWhen` if validations should also be conditional.\n\n## App.tsx — minimal starter\n\nImport only the library's stylesheet. Theme via the library's provider.\nNo companion CSS. No root className. Layout-level inline styles\n(`maxWidth`, `margin`, `padding`) on the wrapping `<div>` are fine.\n\n```tsx\nimport \"rsuite/dist/rsuite.min.css\";\nimport { FormViewer, BiDi } from \"@react-form-builder/core\";\nimport { view } from \"@react-form-builder/components-rsuite\";\nimport formJson from \"./form.json\";\n\nconst getForm = () => JSON.stringify(formJson);\n\nexport default function App() {\n  return (\n    <div style={{ maxWidth: 720, margin: \"40px auto\", padding: 16 }}>\n      <FormViewer\n        view={view}\n        getForm={getForm}\n        onFormDataChange={(d) => console.log(d)}\n        biDi={BiDi.LTR}\n      />\n    </div>\n  );\n}\n```\n\n## Free vs. commercial — stay on the MIT side\n\nFormEngine **Core** is MIT and free. The Designer and some Premium\ncomponents (Signature, DataGrid, Rich Text, QR Code, Google Maps) are\ncommercial. Don't emit Premium component types unless the user\nexplicitly asks. Direct people to the free Online FormBuilder\n(https://formbuilder.formengine.io) for visual editing.\n\n## Response shape\n\nLead paragraph (library + field count) → `form.json` → `App.tsx` →\nvalidation checklist → install command → \"tweak visually in the Online\nFormBuilder\" link → 3 next-step doc links into FormEngine Core docs.\n\n## Reference\n\n- FormEngine Core docs: https://formengine.io/documentation/formengine-core/\n- Forms JSON reference: https://formengine.io/documentation/formengine-core/forms-json/\n- Validation: https://formengine.io/documentation/formengine-core/validation/\n- Conditional rendering: https://formengine.io/documentation/formengine-core/conditional-rendering/\n- Online FormBuilder: https://formbuilder.formengine.io\n- llms-full.txt (full machine-readable docs): https://formengine.io/documentation/llms-full.txt\n- Source repo for this rule: https://github.com/lukinov/ai-form-builder\n</yakaai_skills>"}