Anex UI logoAnex UI
npm install anexui
Documentation

Documentation

EmptyState

Centered placeholder with an optional icon, title, description, and action slot.

Preview

No messages yet

When you receive a message it will appear here.

Nothing to show

Usage

import { EmptyState } from "anexui";

<EmptyState
  title="No results found"
  description="Try adjusting your search or filters."
/>
Copy code

With action

import { EmptyState, Button } from "anexui";

<EmptyState
  title="No projects yet"
  description="Create your first project to get started."
  action={
    <Button variant="primary" size="sm">
      New project
    </Button>
  }
/>
Copy code

Without icon

<EmptyState
  title="Nothing here"
  description="This section is empty."
/>
Copy code

Props

| Prop | Type | Default | Description | |---|---|---|---| | icon | ReactNode | — | Decorative icon rendered above the title | | title | string | — | Required. Short heading | | description | string | — | Longer explanatory text below the title | | action | ReactNode | — | CTA button or link rendered below the description | | className | string | — | Extra class names on the root element |