import { Meta, ArgsTable } from '@storybook/addon-docs';
import FormControl from '../FormControl';

<Meta title="Components/Forms/FormControl" component={FormControl} />

# FormControl API

The API documentation of the FormControl React component. Learn more about the props and the CSS customization points.

## Props

<ArgsTable of="." />

## CSS

| Global class                               | Description                                         |
| ------------------------------------------ | --------------------------------------------------- |
| .ods-form-control\_\_root                  | Styles applied to the div element.                  |
| .ods-form-control\_\_header                | Styles applied to the div element parent to label.  |
| .ods-form-control\_\_label                 | Styles applied to the label.                        |
| .ods-form-control\_\_icon                  | Styles applied to the icon.                         |
| .ods-form-control_iconper-text             | Styles applied to the p element.                    |
| .ods-form-control\_\_helper-text--error    | Styles applied to the p element if error={true}.    |
| .ods-form-control\_\_helper-text--disabled | Styles applied to the p element if disabled={true}. |

If that's not sufficient, you can check the [implementation of the component](https://github.com/ocean-ds/ocean-web/blob/master/packages/ocean-react/src/FormControl/FormControl.tsx) for more detail.

## Inheritance

The props of the [FormLabel](?path=/docs/components-formlabel--page) component are also available.
