EmptyPanel takes title?, message, and optional action with DemoTooltip. Replaces duplicate inline empty-state markup in pbi-list and story-panel. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
35 lines
909 B
TypeScript
35 lines
909 B
TypeScript
'use client'
|
|
|
|
import { Button } from '@/components/ui/button'
|
|
import { DemoTooltip } from '@/components/shared/demo-tooltip'
|
|
|
|
interface EmptyPanelProps {
|
|
title?: string
|
|
message: string
|
|
action?: {
|
|
label: string
|
|
onClick: () => void
|
|
disabled?: boolean
|
|
}
|
|
}
|
|
|
|
export function EmptyPanel({ title, message, action }: EmptyPanelProps) {
|
|
return (
|
|
<div className="p-8 text-center text-muted-foreground space-y-3">
|
|
{title && <p className="text-sm font-medium text-foreground">{title}</p>}
|
|
<p className="text-sm">{message}</p>
|
|
{action && (
|
|
<DemoTooltip show={action.disabled ?? false}>
|
|
<Button
|
|
size="sm"
|
|
variant="outline"
|
|
disabled={action.disabled}
|
|
onClick={action.disabled ? undefined : action.onClick}
|
|
>
|
|
{action.label}
|
|
</Button>
|
|
</DemoTooltip>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|