DS0
Components

EmptyState

A placeholder component displayed when a view has no content to show.

Overview

EmptyState provides a visual placeholder for empty tables, lists, search results, or inbox views. Includes an icon, heading, description, and optional call-to-action.

Usage

<EmptyState
  icon={<Inbox className="h-12 w-12" />}
  heading="No messages yet"
  description="Start a new conversation to see messages here."
  action={<Button>New Message</Button>}
/>

API Reference

PropTypeDefaultDescription
iconReactNodeDecorative icon
headingstringEmpty state title
descriptionstringDescriptive text
actionReactNodeCTA button or link
ComponentWhen to Use Instead
SkeletonLoading placeholder
SpinnerLoading state
ErrorBoundaryError fallback

On this page