19 lines
682 B
TypeScript
19 lines
682 B
TypeScript
import { Skeleton } from '../ui/Skeleton.tsx'
|
|
import { cn } from '../../lib/cn.ts'
|
|
|
|
export function LoadingBlock({ rows = 5, className }: { rows?: number; className?: string }) {
|
|
const count = Math.max(1, Math.min(rows, 50))
|
|
return (
|
|
<div className={cn('flex w-full flex-col gap-2', className)} aria-busy="true" aria-live="polite">
|
|
<span className="sr-only">Loading…</span>
|
|
{Array.from({ length: count }, (_, index) => (
|
|
<div key={index} className="flex items-center gap-3">
|
|
<Skeleton className="h-4 w-1/4" />
|
|
<Skeleton className="h-4 flex-1" />
|
|
<Skeleton className="h-4 w-16" />
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|