@evoja-web/react-form

Flexible and extensible React form components with built-in validation and state management. Designed for performance and accessibility.

Features

• Zero Dependencies: Lightweight and fast, keeping your bundle size small.
• Validation: Built-in support for email, required fields, and custom regex patterns.
• Hooks Support: Includes the useForm hook for modern functional components.
• Accessible: Fully follows WAI-ARIA guidelines for all form inputs and error states.
• Extensible: Easily create custom input components that integrate with the form state.

Installation

Install the package via npm:

npm install @evoja-web/react-form

Usage

Integrating @evoja-web/react-form into your project is straightforward. Here is a basic example:

import React from 'react';
import { Form, Field, validateEmail } from '@evoja-web/react-form';

const MyForm = () => {
  const handleSubmit = (data) => {
    console.log('Form Submitted:', data);
  };

  return (
    <Form onSubmit={handleSubmit}>
      <div className="form-group">
        <label>Email Address</label>
        <Field
          name="email"
          type="email"
          validate={validateEmail}
          placeholder="[email protected]"
        />
      </div>
      <button type="submit">Submit</button>
    </Form>
  );
};

export default MyForm;

API Reference

| Component | Description | |---|---| | Form | The wrapper component that manages form state. | | Field | Individual input component linked to the form state. | | useForm | Hook to access form state and validation methods. |

Support

For issues, bug reports, or feature requests, please contact the maintainers through the official repository channels.

License

MIT © Evoja Web Contributors