Beta
Empty State
A dotted field, a hairline icon chip, one line of ink and one quiet action. The emptiness is the design.
Empty State
A dotted field, a hairline icon chip, one line of ink and one quiet action. The emptiness is the design.
When to use it
The first thing a new user sees in a feature they have not used yet, so it should explain and offer exactly one action. Use it anywhere a table or list could legitimately be empty on day one.
Install
Adds Empty State and its dependencies to your project through the shadcn CLI.
$ npx shadcn@latest add https://www.ssicevs.com/r/empty-state.jsonProps · EmptyState
| Prop | Type | Default |
|---|---|---|
| icon? | ReactNode | EnvelopeGlyph |
| title? | string | "No emails sent yet" |
| hint? | string | "your first send appears here in real ti |
| action? | string | null | "Send a test email" |
| onAction? | () => void className?: string | — |
Generated from the component source. Run npm run props:extract after changing a signature.