Feedback

IEmptyState

What a list shows when it has nothing in it. Say why it is empty and what to do about it.

No invoices yet

Create your first invoice and it will show up here.

Nothing found, versus nothing yet

An empty search wants a way back out; an empty collection wants a way in.

No invoices match “northwind”

Try a different search, or clear the filters to see everything.

sm suits an empty panel inside a page that has other content; lg suits a page that is empty all the way through.

No attachments

Drop a file here to attach it.

No attachments

Drop a file here to attach it.

No attachments

Drop a file here to attach it.

An icon is drawn by default. Pass your own, or :icon="false" to drop it.

vue

<IEmptyState :icon="FolderIcon" title="No attachments" />
<IEmptyState :icon="false" title="No attachments" />

Prop	Type	Default	Description
`title`	`string`	—	The headline
`description`	`string`	—	What to do about it
`icon`	icon \| `false`	default glyph	Your own icon, or `false` for none
`size`	`'sm' \| 'md' \| 'lg'`	`'md'`	Overall scale
`as`	`string`	`'div'`	Element to render
`unstyled`	`boolean`	—	Drop built-in classes
`class`	`string`	—	Merged with the built-in classes
`ui`	`{ root?, icon?, title?, description?, actions? }`	—	Per-slot class overrides

Slot	When to use it
`icon`	Replaces the icon entirely
`title` / `description`	Either needs markup
`actions`	Buttons or links along the bottom

ITable has its own emptyText and #empty slot for the no-rows case.