Form System

Comprehensive form components with React Hook Form integration

📚 See docs/FORM_SYSTEM_DOCUMENTATION.md for full documentation

React Hook Form - Comprehensive Example

Text Inputs

We'll never share your email with anyone else

Must be at least 8 characters (with show/hide toggle)

OTP & Text Areas

Enter the 6-digit code sent to your email

Maximum 500 characters

HTML Editor

Use the rich text editor to format your content

Select Dropdowns

Select the country where you reside

Select up to 4 skills

Checkboxes

Receive updates about new features and products

Choose the types of emails you'd like to receive

0 selected

Search and select programming languages you know

Radio Buttons

Pay with your credit or debit card

Pay with your PayPal account

Direct bank transfer

File Uploads

Click to upload or drag and drop

Accepted: image/* • Max size: 5 MB per file

Upload a profile picture (max 5MB)

image/* • Max 5 MB

Upload a profile picture (max 5MB)

Upload a profile picture (max 5MB)

Click to upload or drag and drop

Accepted: .pdf,.doc,.docx • Max size: 10 MB per file • Max 3 files

Upload up to 3 documents (PDF, DOC, or DOCX)

Debug: Current Form Values
{
  "firstName": "",
  "lastName": "",
  "email": "",
  "password": "",
  "phone": "",
  "website": "",
  "age": 18,
  "birthDate": "",
  "verificationCode": "",
  "bio": "",
  "description": "",
  "country": "",
  "skills": [],
  "acceptTerms": false,
  "newsletter": false,
  "preferences": [],
  "languages": [],
  "gender": "",
  "paymentMethod": "",
  "avatar": null,
  "documents": null
}