baseui-cnEmpty State
A placeholder UI for when a section has no content.
components/ui/blocks.tsxexportEmptyState
blockfeedback
Loading preview...
Installation
npx baseui-cn add empty-stateUsage
import { EmptyState, EmptyStateIcons } from "@/components/ui/blocks"
import { Button } from "@/components/ui/button"
;<EmptyState
icon={EmptyStateIcons.folder}
title="No projects yet"
description="Create your first project to get started."
action={<Button>Create project</Button>}
/>Examples
With outline border
Use className="border border-dashed" for a dashed container style.
Loading preview...
API
EmptyStateMedia
| Prop | Type | Default | Description |
|---|---|---|---|
variant | "default" | "icon" | "default" | "icon" wraps content in a small muted rounded box; "default" is transparent |