---
category: forms
---

# InputGroup

Source: `components/ui/input-group.tsx`.

`InputGroup` is a compound component. Its parts are exported **flat** (`InputGroupAddon`, not
`InputGroup.Addon`) and each is a separate top-level export of the bundle:

| Part | Props |
| --- | --- |
| `InputGroupAddon` | `React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>` |
| `InputGroupButton` | `Omit<React.ComponentProps<typeof Button>, 'size'> & VariantProps<typeof inputGroupButtonVariants>` |
| `InputGroupText` | `React.ComponentProps<'span'>` |
| `InputGroupInput` | `React.ComponentProps<'input'>` |
| `InputGroupTextarea` | `React.ComponentProps<'textarea'>` |

All parts accept `className` and are composed as children of `InputGroup`.