A generic centered placeholder for empty lists, grids, or search results: an optional icon, a description, and an optional action. Modeled on AntD's `Empty` — reusable anywhere something has nothing to show yet.

pnpm add @behivetech/molecules.empty-state

This is the snapshot of v0.3.5, the current version, as recorded on 2026-11-10. The live page runs its examples →

Examples of v0.3.5 are shown as code; only the latest version runs live. Open the live examples →

Basic Empty State
1const BasicEmptyState = () => (
2 <EmptyState description="No blocks yet." />
3);
4
5render(<BasicEmptyState />);
Empty State With Icon
1const EmptyStateWithIcon = () => (
2 <EmptyState icon="🧩" description="No blocks yet. Add one to get started." />
3);
4
5render(<EmptyStateWithIcon />);
Empty State With Action
1const EmptyStateWithAction = () => (
2 <EmptyState icon="🧩" description="No blocks yet. Add one to get started.">
3 <button onClick={() => {}}>+ Add Block</button>
4 </EmptyState>
5);
6
7render(<EmptyStateWithAction />);