# FormFieldProps

**Kind:** Interface

Props for the `FormField` component. Also accepts:
* `FormFieldStyleProps`

## Properties

### `children?`

Type: `React.ReactNode`

The contents of the form field.

### `className?`

Type: `undefined | string`

Additional class names to apply to the form field.

### `description?`

Type: `React.ReactNode | string | null`

The description content for the form field. Displayed beneath the label and above the wrapped control field.

### `htmlFor?`

Type: `undefined | string`

The `for` attribute to be applied to the inner label. By default, the form field will automatically generate a random ID and set it on both the label and the wrapped input/select. Only use this property if you want to override the generated ID with your own custom ID.

### `id?`

Type: `undefined | string`

The `id` attribute.

### `label?`

Type: `React.ReactNode`

The label content for the form field.

### `style?`

Type: `React.CSSProperties`

Additional styles to apply to the form field.

---

## FormField

**Kind:** Component

A form field component that wraps any control field, supplying a provided label and optional
description.

[[ Story id="formfield--example" title="Form field example" ]]

This component will automatically set up the `for` attribute on the outputted label with the `id` attribute
on the wrapped control field for the following UI components: Label, Select, FieldPicker,
ModelPicker, and ViewPicker. If you'd like to manually override this behavior, you can provide an
`htmlFor` prop to this component and manually set the `id` attribute on your wrapped control to
the same value.

**Parameters:**
- `props` (`FormFieldProps`)
- `ref` (`React.Ref<HTMLDivElement>`)

**Returns:** `Element`