Contact Form

Component

Usage Methods

1. Pass the form data as a prop to customise the form with different data.
2. Extract the form fields into an array or JSON file to make them dynamic and configurable.
3. Accept a submit callback to delegate the submission logic externally.
4. Allow an external validator to be passed in to validate form fields.
5. Passing select nationality options as a prop to make them editable.
6. Accept a prop to customise error messages and make them change dynamically.
7. Add the possibility of extending the form with additional fields via props or children.
8. Manage data submission via an external API and pass the URL as a prop.
9. Implement debounce on input fields to improve the user experience when typing.

Usage

import ContactForm from 'your-path';
 
export default function YourComponent() {
  return (
    <div>
      <ContactForm />
    </div>
  )
}