EmptyState
Empty states turn blank space into guidance. When a list, table, or section has no data yet, this component explains why it is empty and what the user can do about it. A well-designed empty state reduces confusion and drives engagement.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| icon | LucideIcon | — | Lucide icon component to display |
| title* | string | — | Main heading text |
| description | string | — | Supporting description text |
| action | { label: string; onClick: () => void } | — | Optional action button |
| className | string | — | Additional CSS classes |