{"id":17457741,"url":"https://github.com/vantezzen/autoform","last_synced_at":"2025-05-12T13:26:57.717Z","repository":{"id":182969754,"uuid":"669080455","full_name":"vantezzen/autoform","owner":"vantezzen","description":"🌟 Automatically render forms for your existing data schema","archived":false,"fork":false,"pushed_at":"2025-05-07T09:56:32.000Z","size":1754,"stargazers_count":3242,"open_issues_count":23,"forks_count":139,"subscribers_count":18,"default_branch":"main","last_synced_at":"2025-05-07T10:50:23.411Z","etag":null,"topics":["form-validation","react","react-component","shadcn-ui"],"latest_commit_sha":null,"homepage":"https://autoform.vantezzen.io","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vantezzen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-07-21T09:43:49.000Z","updated_at":"2025-05-07T09:56:35.000Z","dependencies_parsed_at":null,"dependency_job_id":"838be062-c6a2-475a-9a12-e117806cded3","html_url":"https://github.com/vantezzen/autoform","commit_stats":{"total_commits":109,"total_committers":20,"mean_commits":5.45,"dds":"0.35779816513761464","last_synced_commit":"dc2e801a8a7b01833e10cab0891fb42122eaeef1"},"previous_names":["vantezzen/auto-form"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vantezzen%2Fautoform","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vantezzen%2Fautoform/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vantezzen%2Fautoform/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vantezzen%2Fautoform/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vantezzen","download_url":"https://codeload.github.com/vantezzen/autoform/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253746955,"owners_count":21957661,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["form-validation","react","react-component","shadcn-ui"],"created_at":"2024-10-18T03:01:24.129Z","updated_at":"2025-05-12T13:26:57.697Z","avatar_url":"https://github.com/vantezzen.png","language":"TypeScript","readme":"# AutoForm\n\n\u003e Automatically render forms for your existing data schema.\n\n---\n\n\u003e [!NOTE]\n\u003e\n\u003e **Work in Progress** AutoForm as a standalone package is still work in progress. If you want to help out, please check out the [GitHub repository](https://github.com/vantezzen/autoform) and add your own integrations!\n\nFind the full documentation at [autoform.vantezzen.io](https://autoform.vantezzen.io).\n\n---\n\n\u003e AutoForm is now a full library!\n\nAutoForm quickly grew from a small component into a codebase larger than any shadcn component should be. To let AutoForm grow without bloating your shadcn/ui components, AutoForm is now a full library!\n\nDon't worry, you can still use AutoForm with your shadcn components and expand it with your own components - but it now also supports integration into other UI libraries like MUI and Mantine and we plan on adding support for other schema libraries than zod too.\n\nCheck out the new [AutoForm documentation](https://autoform.vantezzen.io) for more information.\n\nThe new AutoForm does not have full feature-parity with the old AutoForm as we look into what features actually make sense and which once just bloat the experience. If you're missing a feature or have problems with the new library, feel free to write your feedback in the welcome post!\n\nIf you want to continue using the pure shadcn/ui component, you can find the old codebase at \u003chttps://github.com/vantezzen/auto-form/tree/pure-shadcn\u003e - but write us what keeps you from migrating to the new library!\n\n---\n\nWhat is AutoForm? Let's say you have a zod schema that you already use for your backend:\n\n```ts\nimport { z } from \"zod\";\n\nconst userSchema = z.object({\n  name: z.string(),\n  birthday: z.coerce.date(),\n  email: z.string().email(),\n});\n```\n\nWith AutoForm, you can automatically render a form for this schema:\n\n```tsx\nimport { AutoForm } from \"@autoform/mui\";\nimport { ZodProvider } from \"@autoform/zod\";\n\nfunction MyForm() {\n  return (\n    \u003cAutoForm\n      schema={schemaProvider}\n      onSubmit={(data) =\u003e {\n        console.log(data);\n      }}\n      withSubmit\n    /\u003e\n  );\n}\n```\n\nAutoForm itself is agnostic to the schema library, rendering library and UI library you use, but it comes with a set of official packages that make it easy to use with popular libraries like Zod, React, Material UI, etc.\n\n## When to use AutoForm?\n\nAutoForm is mostly meant as a drop-in form builder for your internal and low-priority forms with existing schemas. For example, if you already have schemas for your API and want to create a simple admin panel to edit user profiles, simply pass the schema to AutoForm and you're done.\n\nAs forms almost always grow more complex, AutoForm gives you options to customize how forms are rendered (e.g. using the `fieldConfig` options) and gives you escape hatches to customize the form even further.\n\nHowever, AutoForm does not aim to be a full-featured form builder. It does not aim to support every edge case in your schema or allow building complex, multi-page forms. If you need more customization, feel free to customize AutoForm's renderer in your project or use more powerful form builders like [Formik](https://formik.org/) - though those require more specialized configuration instead of simple drop-in support for your zod schema. For an example on how AutoForm can be extended for more powerful, YAML-based, multi-page forms, see [AutoForm YAML](https://github.com/roeyazroel/auto-form).\n\n## shadcn/ui component\n\nAutoForm started out as a [shadcn/ui component](https://github.com/vantezzen/auto-form) but grew so large I decided it's best to split it into a package instead.\n\n`@autoform/react` does currently not have full feature-parity with the shadcn/ui component, but it's getting there. If you want to use the shadcn/ui component, you can still use it as a standalone package.\n\n## Development\n\nAutoForm uses a TurboRepo monorepo setup. To get started, run:\n\n```bash\nnpm install\nnpm run dev\n```\n\nThis will start the development server for the documentation website and the AutoForm package itself.\n\nFor releases, AutoForm uses changesets. To create a new release, run:\n\n```bash\nnpm run build\nnpm run cypress # Run the component tests\nnpx changeset\n```\n\nThis will guide you through creating a new changeset. To publish the changeset, run:\n\n```bash\nnpx changeset version\nnpx changeset publish\n```\n\n## License\n\nAll packages in the AutoForm monorepo are licensed under the MIT license.\n","funding_links":[],"categories":["TypeScript","Components","Tools"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvantezzen%2Fautoform","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvantezzen%2Fautoform","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvantezzen%2Fautoform/lists"}