Empty State
FeedbackWeb + NativeMITIllustration + heading + call-to-action for empty data views.
bun add @otfdashkit/ui
Preview
Empty StateFeedback
Loading Storybook preview…
Code
@otfdashkit/uiimport { EmptyState } from '@otfdashkit/ui'
import { Inbox } from 'lucide-react'
export function Example() {
return (
<EmptyState
icon={<Inbox className="h-10 w-10" />}
title="No messages yet"
description="When you receive messages, they will appear here."
action={{ label: 'Compose', onClick: () => {} }}
/>
)
}
Free with the SDK. This component ships in @otfdashkit/ui under the MIT license.
Props
Props declared in the EmptyState source. Inherited HTML attributes are not listed.
| Prop | Type | Default | Description |
|---|---|---|---|
| titlerequired | string | ||
| action | { label: string; onClick: () => void; } | ||
| className | string | ||
| description | string | ||
| icon | ReactNode | ||
| secondaryAction | { label: string; onClick: () => void; } | ||
| size | 'sm' | 'default' | 'lg' | 'default' |