---
category: layout
---

# Item

Source: `components/ui/item.tsx`.

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

| Part | Props |
| --- | --- |
| `ItemMedia` | `React.ComponentProps<'div'> & VariantProps<typeof itemMediaVariants>` |
| `ItemContent` | `React.ComponentProps<'div'>` |
| `ItemActions` | `React.ComponentProps<'div'>` |
| `ItemGroup` | `React.ComponentProps<'div'>` |
| `ItemSeparator` | `React.ComponentProps<typeof Separator>` |
| `ItemTitle` | `React.ComponentProps<'div'>` |
| `ItemDescription` | `React.ComponentProps<'p'>` |
| `ItemHeader` | `React.ComponentProps<'div'>` |
| `ItemFooter` | `React.ComponentProps<'div'>` |

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