Empty State
Empty states communicate when there is no content, helping users understand what happened and what action they can take next.
Import
import { EmptyState } from "@shivms/ui";Sizes
Extra Small
No Results
Try another search.
Small
No Results
Try another search.
Medium
No Results
Try another search.
Large
No Results
Try another search.
Extra Large
No Results
Try another search.
Variants
Default
Nothing Found
There is no data available.
Primary
Nothing Found
There is no data available.
Secondary
Nothing Found
There is no data available.
Success
Nothing Found
There is no data available.
Warning
Nothing Found
There is no data available.
Danger
Nothing Found
There is no data available.
Info
Nothing Found
There is no data available.
Alignment
Left
Inbox Empty
You have no messages.
Center
Inbox Empty
You have no messages.
Right
Inbox Empty
You have no messages.
Orientation
Vertical
No Uploads
Upload your first file.
Horizontal
No Uploads
Upload your first file.
Image Fit
Contain
No Images
Upload an image to continue.
Cover
No Images
Upload an image to continue.
States
Default
Gallery Empty
No media available.
Loading
Loading
Fetching data...
Disabled
Unavailable
Content is disabled.
Actions
Primary Action
No Files
Upload your first file.
Primary & Secondary
No Files
Upload your first file.
Footer
Footer
Inbox Empty
You're all caught up.
Examples
Search
No Results Found
Try adjusting your filters or search terms.
Uploads
No Uploads Yet
Upload files to get started.