import Footnote from '../Footnote'

import { chipVariants } from './variants'

import type { VariantProps } from 'class-variance-authority'

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 (
    <Footnote asChild>
      <div className={classNames}>{children}</div>
    </Footnote>
  )
}