import React from 'react';

type BadgeVariant = 'success' | 'warning' | 'error' | 'info' | 'neutral' | 'brand';

interface BadgeProps {
  variant?: BadgeVariant;
  dot?: boolean;
  children: React.ReactNode;
  className?: string;
}

const variantClasses: Record<BadgeVariant, { badge: string; dot: string }> = {
  success: { badge: 'bg-emerald-500/10 text-emerald-400 border-emerald-500/20', dot: 'bg-emerald-400' },
  warning: { badge: 'bg-amber-500/10 text-amber-400 border-amber-500/20', dot: 'bg-amber-400' },
  error: { badge: 'bg-red-500/10 text-red-400 border-red-500/20', dot: 'bg-red-400' },
  info: { badge: 'bg-blue-500/10 text-blue-400 border-blue-500/20', dot: 'bg-blue-400' },
  brand: { badge: 'bg-brand-500/10 text-brand-400 border-brand-500/20', dot: 'bg-brand-400' },
  neutral: { badge: 'bg-white/5 text-slate-400 border-white/10', dot: 'bg-slate-400' },
};

export default function Badge({ variant = 'neutral', dot, children, className = '' }: BadgeProps) {
  const v = variantClasses[variant];
  return (
    <span className={`text-xs font-bold px-2.5 py-1 rounded-full border inline-flex items-center gap-1.5 ${v.badge} ${className}`}>
      {dot && <span className={`w-1.5 h-1.5 rounded-full animate-pulse-slow ${v.dot}`} />}
      {children}
    </span>
  );
}
