EmptyState

pro

EmptyState centers an illustration over one of three SVG background patterns with a content slot below for titles, descriptions, and actions.

Get the code
No data available

Installation

Add this component with the NateUI CLI.

npx nateui@latest add EmptyState

Examples

Variants

Get the code

Wave

Grid

Dots

With Offset

Get the code
No documents uploaded

API

PropDescriptionTypeDefault
variantBackground pattern variant.'wave' | 'grid' | 'dots''wave'
sizeWidth and height of the background container in pixels.number300
illustrationIcon or illustration rendered centered on the background.ReactNode—
offsetVertical offset (negative margin) for the content below the illustration.number0
childrenContent to display below the background — title, description, actions.ReactNode—