```meta category: Forms ``` `import { Form } from 'auth0-cosmos'` --- Form is a compound component that ships with extra props for elements that take care of layout, styling and accessibility. ```jsx
{} }} /> ``` ## Examples ### Form Fields Form is composed of Form Fields, read more about them [here](/docs/Form%20Field). ```js
alert(value)} /> {} }} /> ``` ### Grouping fields Long forms should be divided into smaller groups using a `Form.FieldSet`. Read the docs [here](/docs/Form%20Fieldset). ```js
{} }} /> ``` ### Multiple forms in a page If a page has multiple forms, use a [FormGroup](/docs/FormGroup) to separate each form. Use a `Form.FieldSet` to add meaningful titles. ### Form actions At the end of the forms, you need actions that the user can take. Read how to add them [here](/docs/Form%20Actions). ```js
{} }} /> ``` ### Form layouts `Form` also supports an alternate layout which can be used for narrow environments: ```js
{} }} /> ```