import { Slot } from '@radix-ui/react-slot';
import { type VariantProps, cva } from 'class-variance-authority';
import * as React from 'react';
import { cn } from '../..';

import styles from './BaseBadge.module.css';

export const baseBadgeVariants = cva(styles.BaseBadge, {
  variants: {
    variant: {
      default: styles.default,
      destructive: styles.destructive,
      muted: styles.muted,
      outline: styles.outline,
      primary: styles.primary,
      secondary: styles.secondary,
      solid: styles.solid,
      address: styles.address,
    },
    size: {
      medium: styles.default,
      small: styles.small,
      large: styles.large,
    },
  },
  defaultVariants: {
    variant: 'default',
    size: 'medium',
  },
});

export interface BaseBadgeProps
  extends React.HTMLAttributes<HTMLDivElement>,
    VariantProps<typeof baseBadgeVariants> {
  asChild?: boolean;
}

export const BaseBadge = React.forwardRef<HTMLDivElement, BaseBadgeProps>(
  ({ className, size, variant, asChild = false, ...props }, ref) => {
    const Comp = asChild ? Slot : 'div';
    return (
      <Comp
        className={cn(
          styles.BaseBadge,
          baseBadgeVariants({ variant, size, className }),
        )}
        ref={ref}
        {...props}
      />
    );
  },
);
BaseBadge.displayName = 'BaseBadge';
