import type { ReactNode } from 'react';

export interface LoadingSkeletonProps {
  rows?: number;
  className?: string;
}

export function LoadingSkeleton({ rows = 3, className = '' }: LoadingSkeletonProps): ReactNode {
  return (
    <div className={`space-y-3 ${className}`} role="status" aria-label="Loading content">
      {Array.from({ length: rows }).map((_, i) => (
        <div
          key={i}
          className="h-12 rounded animate-pulse"
          style={{ backgroundColor: 'var(--color-muted, #e5e7eb)' }}
        />
      ))}
    </div>
  );
}