BillTracker/client/components/ui/Skeleton.jsx

import { cn } from '@/lib/utils';

function Skeleton({ className, variant = 'line', ref, ...props }) {
  const variants = {
    line: 'h-4 w-full rounded-md',
    circle: 'h-10 w-10 rounded-full',
    card: 'h-24 w-full rounded-xl',
    button: 'h-9 w-24 rounded-md',
    input: 'h-9 w-full rounded-md',
  };

  return (
    <div
      ref={ref}
      className={cn(
        'animate-pulse bg-muted',
        variants[variant],
        className
      )}
      {...props}
    />
  );
}

export { Skeleton };