Skeleton
A placeholder loading state component shaped as elements to outline UI containers during data fetching lifecycle phases.
components/ui/skeleton.tsx
import { cn } from "cn"
function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="skeleton"
className={cn("animate-pulse rounded-2xl bg-muted", className)}
{...props}
/>
)
}
export { Skeleton }
- Where it goes
- stats
- Interaction
- animated-counter