Form
Overview
The provided Form component is a wrapper around an HTML <form /> element. It provides form width styling and accessibility features when using form controls within.
When to use:
- Any usage of a form control.
Implementation
Form fields are essential to any website or web application. Unique id's' will be auto-generated for the form fields and labels for attribute, unless manually specified.
Edit the code below to see your changes live!
Props
Supports all native <form /> element attributes.
Prop name | Type | Default | Description |
|---|---|---|---|
fullWidth | boolean | false | Sets the form width to 100% |
Props ending with * are required
Inherited
Margin Props
Do's and Don'ts
Do |
|---|
Use max-width form for most scenarios. fullWidth prop should be used non-traditional forms. |
Use type="submit" on the button you want as your submit button (HTML defaults the first button as the submit action) |
Validate form fields before the user submits the form. |
Don't |
|---|
Use forms for immediate actions (i.e. toggling a setting) |