Form
FormControl
Storybook
FormControl
Storybook
The FormControl component is used to provide a label to a form control, such as an input or checkbox.
Import
1import { FormControlLabel } from 'dd360-ds'1import FormControlLabel from 'dd360-ds/FormControlLabel'Usage
The prop label is required and specifies the text to be displayed next to the form control. The control property is also required and must contain the form control component.
1import { FormControlLabel } from 'dd360-ds'
2
3<FormControlLabel label='form-control' control={<Checkbox checked size='2xl' />} />FormControl labelPlacement
You can use the labelPlacement property to specify the position of the label relative to the control
1import { FormControlLabel } from 'dd360-ds'
2
3<FormControlLabel labelPlacement='end' label='form-control' control={<Checkbox checked size='2xl' />} />FormControl disabled
The disabled prop can be used to disable the form control
1import { FormControlLabel } from 'dd360-ds'
2
3<FormControlLabel disabled label='form-control' control={<Checkbox checked size='2xl' />} />API Reference
| Name | Types | Default |
|---|---|---|
| "label"* | string | - |
| "control"* | ReactNode | - |
| "labelPlacement" | start end top bottom | start |
| "disabled" | boolean | false |