https://github.com/sikandarjodd/form-builder
Svelte Form Builder include various Input fields validated using ZOD + Superforms
https://github.com/sikandarjodd/form-builder
form-builder forms formsnap superforms svelte valibot validations zod
Last synced: 10 months ago
JSON representation
Svelte Form Builder include various Input fields validated using ZOD + Superforms
- Host: GitHub
- URL: https://github.com/sikandarjodd/form-builder
- Owner: SikandarJODD
- License: mit
- Created: 2025-01-24T01:09:28.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-03-11T01:09:47.000Z (11 months ago)
- Last Synced: 2025-04-06T07:07:44.419Z (10 months ago)
- Topics: form-builder, forms, formsnap, superforms, svelte, valibot, validations, zod
- Language: Svelte
- Homepage: https://svelte-form-builder.vercel.app
- Size: 1.78 MB
- Stars: 138
- Watchers: 3
- Forks: 3
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Svelte Form Builder
A dynamic form-building tool that allows users to create, customize, and validate forms seamlessly within web applications. Built with Sveltekit, [ZOD](https://zod.dev), [Valibot](https://valibot.dev) [Sveltekit-Superform](https://superforms.rocks), Form Builder provides an intuitive interface for developers and users alike.
## Features
- Dynamic Form Creation: Easily create forms with various input types including text, checkbox, radio buttons, and more.
- Form validations using [**Sveltekit Superforms**](https://superforms.rocks)
- Client & Server side validaitons.
- Real-Time Validation: Validate user inputs using the Zod library, ensuring data integrity and user-friendly feedback.
- Customizable Components: Leverage ShadCN-Svelte components for a consistent and modern UI experience.
### Live Demo
Check out the live demo of the Form Builder [here](https://svelte-form-builder.vercel.app).
### Usage
1. Simply select inputs from the list, can reorder them by dragging.
2. Copy `Schema` and paste it in your Sveltekit project.
3. Copy `Client` and `Server` side Code and paste it in your Sveltekit project.
### Components
1. Password Input : [Visit](https://github.com/SikandarJODD/form-builder/blob/master/src/lib/components/templates/comps/PasswordInput.svelte)
2. Location Input : [Visit](https://svelte-form-builder.vercel.app/docs/components/location-input)
Here are some of the features that are in the pipeline. you can also suggest features by creating an [issue](https://github.com/SikandarJODD/form-builder/issues).
## Support
For support, you can raise an issue or contact me at [Twitter](https://x.com/Sikandar_Bhide).
You can sponsor me on [Github](https://github.com/sponsors/SikandarJODD)
## License
Published under the [MIT](https://github.com/SikandarJODD/form-builder/blob/master/LICENSE) license.
Built by [@sikandarjodd](https://github.com/SikandarJODD), [Aidan Bleser](https://github.com/ieedan), [Cliff Njoroge](https://github.com/cliffordkleinsr) and [community](https://github.com/SikandarJODD/form-builder/graphs/contributors) 💛
## Acknowledgements
- [Sveltekit](https://svelte.dev) - web development for the rest of us.
- [Superforms](https://superforms.rocks) - Superforms is a SvelteKit f.orm library that brings you a comprehensive solution for server and client form validation.
- [Zod](https://zod.dev) - A TypeScript-first schema declaration and validation library.
- [Valibot](https://valibot.dev) - A simple and powerful form validation library.