Skeleton
A skeleton component displays a placeholder for content that is still loading.
A skeleton component displays a placeholder for content that is still loading.
Follow these simple steps to add the Skeleton component to your project:
Create a new file: components/ui/skeleton.tsx and copy the code below:
import { cn } from "@/lib/utils"
function Skeleton({
className,
...props
}: React.HTMLAttributes<HTMLDivElement>) {
return (
<div
className={cn("animate-pulse rounded-md bg-primary/10", className)}
{...props}
/>
)
}
export { Skeleton }Adjust the import paths in both files according to your project's structure.