import { User } from 'lucide-react';
import { Box } from './Box';
import { Icon } from './Icon';

export interface PlaceholderImageProps {
  size?: number;
  className?: string;
}

export function PlaceholderImage({ size = 48, className = '' }: PlaceholderImageProps) {
  return (
    <Box
      className={`rounded-full bg-charcoal-outline flex items-center justify-center ${className}`}
      style={{ width: size, height: size }}
    >
      <Icon icon={User} size={6} color="#9ca3af" />
    </Box>
  );
}