import { Typography } from '../Typography'

import { VariantProps } from 'class-variance-authority'
import { chipVariants } from './variants'

export interface ChipProps
  extends React.HtmlHTMLAttributes<HTMLDivElement>,
    VariantProps<typeof chipVariants> {}

export default function Chip({
  children,
  className,
  size,
  variant,
}: ChipProps) {
  const classNames = chipVariants({
    className,
    size,
    variant,
  })
  return (
    <Typography variant="Tag/sm">
      <span className={classNames}>{children}</span>
    </Typography>
  )
}