# React Bootstrap Form Control Group Component
> Learn how to compose Bootstrap-styled inputs with icons, static text and actions inside one shared frame using CoreUI's form control group.
## How to use React Bootstrap Form Control Group component
The `form-control-group` primitive puts an input together with icons, static text and actions inside one Bootstrap-styled frame — the same markup the PRO field components render internally.
```html
import React from 'react'
import { CFormControlGroup, CFormControlIcon, CFormInput } from '@coreui/react'
export const FormControlGroupExample = () => {
return (
)
}
```
### Parts
```html
import React from 'react'
import { CFormControlAction, CFormControlGroup, CFormControlIcon, CFormInput } from '@coreui/react'
export const FormControlGroupPartsExample = () => {
return (
)
}
```