import { cva } from 'class-variance-authority';
import { cn } from '#/lib/utils.js';

const badgeVariants = cva(
  'inline-flex items-center rounded-[4px] border px-1.5 py-px font-mono text-[10.5px] leading-4',
  {
    variants: {
      variant: {
        default: 'border-border bg-muted text-muted-foreground',
        scope: 'border-key/25 bg-key/10 text-key',
      },
    },
    defaultVariants: { variant: 'default' },
  },
);

export function Badge({ className, variant, ...props }) {
  return (
    <span className={cn(badgeVariants({ variant }), className)} {...props} />
  );
}