Item
shadcn/ui
v4 only
List item primitive with media, title, description, and actions slots. Compose any list row from it.
@/components/ui/itemMedia variants
| ItemMedia | Preview | Usage |
|---|---|---|
| (default — avatar) | DA Dragana V. Admin · 5 open tickets | Team members, users, assignees |
| variant="icon" | tickets/ 43 files · modified 2h ago | Files, categories, navigation items |
| (no media) | Fix login redirect T7A3763 · Open · High priority Open | Simple lists without icons — text-only rows |
In context — team member list
Team members
DA
Dragana V.
Admin · 5 open tickets
MK
Marko K.
Reviewer · 2 open tickets
JB
Jovana B.
Manager · 12 open tickets
SV
Stefan V.
Agent · 7 open tickets
In context — notification channels
Notification channels
Email
Send to dragana@thilo.app
In-app
Shown in notification center
Webhook
Not configured
Sub-components
| Component | Role |
|---|---|
| Item | Row wrapper — horizontal flex, hover state, padding |
| ItemMedia | Left slot for avatar, icon, or thumbnail. variant: default (avatar) | "icon" |
| ItemContent | Middle slot — grows to fill space, stacks title + description |
| ItemTitle | Primary line — text-sm font-medium |
| ItemDescription | Secondary line — text-xs text-muted-foreground |
| ItemActions | Right slot for action buttons — shrinks to content |
| ItemGroup | Wrapper for a list of Items — can include ItemSeparators |
| ItemSeparator | Thin horizontal divider between items |
On this page