import type { VariantProps } from 'class-variance-authority'
import type { HTMLAttributes } from 'react'
import { cn } from '../../utils'
import { TagIcon } from './TagIcon'
import { tagVariants } from './variants'

export interface TagProps
  extends HTMLAttributes<HTMLDivElement>,
    VariantProps<typeof tagVariants> {
  hideIcon?: boolean
}

export const Tag = ({
  children,
  variant,
  size,
  className,
  hideIcon,
  ...props
}: TagProps) => {
  return (
    <div className={cn(tagVariants({ variant, size, className }))} {...props}>
      {!hideIcon && <TagIcon variant={variant} />}
      {children}
    </div>
  )
}