EmptyState
What to show when a list has nothing in it yet, and what to do about it.
An empty list should say what would be here and how to put something in it. Give it an action whenever there is one — an empty state without a next step is a dead end.
Variants
card is the bordered treatment used by the builder's left panels; page is the full-surface treatment used by the CMS manager; plain is a bare stack for anywhere else.
No pages yet
Add a page to start building.
No results
Try a different search.
Props
EmptyState
| Prop | Type | Default | Description |
|---|---|---|---|
title | ReactNode | — | Required. What is missing. |
description | ReactNode | — | Why, or what to do about it. |
action | ReactNode | — | The next step — usually a Button. |
icon | ReactNode | — | Leading icon. |
variant | "plain" | "card" | "page" | "plain" | `card` for builder panels, `page` for a full surface. |
size | "default" | "spacious" | "default" | `spacious` adds vertical room for full-panel empties. |