Formwerk

Formwerk is a Vue.js framework that simplifies forms by providing a comprehensive suite of composables for building accessible, high-quality, and scalable form components.

Unlike other libraries, Formwerk deliberately excludes UI components, recognizing that design needs vary across projects. Instead, it provides a rock-solid foundation of accessibility, validation, state management, and interaction patterns that work seamlessly with your custom styling. This separation allows you to maintain complete creative control while ensuring your forms meet the highest standards of functionality and user experience.

With Formwerk as your foundation, you get high-quality form capabilities without compromising on flexibility. Whether you're creating a design system or a standalone application, Formwerk handles the intricate details of forms, empowering you to create forms that are delightful to use.

✨ Features

• 📦 Comprehensive: Ready-made composables for all common form elements.
• ♿ Accessible: ARIA compliant with full keyboard navigation and semantic markup.
• 🌐 i18n Ready: Built-in internationalization with RTL and number formatting support.
• 🔌 Headless Architecture: Build form components with complete control over markup and styling.
• ✅ Form Validation: Native HTML5 and Standard Schema libraries support.
• 🎨 Styling Agnostic: Works with any CSS framework or plain CSS.
• 🎮 Built-in Behaviors: Native-like keyboard interactions and focus management.
• 🏗 Organization: Form groups and repeatable field arrays.
• ⚡ SSR Ready: Full support for Server Side Rendering environments.
• 🔄 State Management: Automatic form state and value tracking.
• 🌳 Tree-shakable: Only include the composables you actually use.
• 🎯 Type Safe: Full TypeScript support with generic typing.

📚 Documentation

You can find the documentation and demos here.

🤝 Contributing

You can contribute to Formwerk by reporting bugs, suggesting features, or submitting code changes. If you wish to submit code changes, please first discuss the change you wish to make via GitHub issues, Discord, or any other method.

You can visit the contributing guide for more information on how to contribute to Formwerk and how to get started.

📝 Credits

Formwerk takes great inspiration from multiple projects in the ecosystem, most notably:

• React Aria
• VeeValidate

⚖️ License

Formwerk is licensed under the MIT License. See the LICENSE file for details.