Forms

Overview

If you’re looking for a robust solution to streamline form handling in your React applications, the @omergulcicek/forms library presents a compelling option. This lightweight library focuses on type-safe masking and validation, making it a breeze to manage various input types while ensuring data integrity. Designed with React Hook Form users in mind, it not only simplifies the development process but enhances user experience through smart, real-time input handling.

The integration with shadcn/ui components means you won’t have to compromise on aesthetics or usability, as this library ensures that your forms look great and function seamlessly. Whether you’re dealing with numeric fields, pattern validations, or just want a simple way to handle user input, this library offers versatile tools to help you build efficient forms in a few easy steps.

Features

• Keyboard Input Validation: Restricts numeric fields to accept only numbers, reducing error entries.
• Smart Masking: Automatically formats commonly used input types like phone numbers and credit card numbers for a smoother user experience.
• Pattern Validation: Utilizes regex for built-in validation, ensuring data adheres to specified patterns.
• Value Access: Easily access both masked and unmasked values from each field object for handling in your application logic.
• TypeScript Support: Provides full type safety, making development more predictable and reducing errors.
• shadcn/ui Compatible: Works effortlessly with shadcn/ui components, ensuring integrated design and functionality.
• Automatic Styling: Inherits the beautiful design system of shadcn, providing an attractive UI with minimal effort.
• Accessibility Features: Maintains compliance with shadcn’s accessibility guidelines for a more inclusive application.