import {
  MaterialSymbol,
  type MaterialSymbolProps,
} from 'react-material-symbols'

import { iconVariants } from '../variants'

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

export interface MaterialIconProps
  extends Omit<MaterialSymbolProps, 'color' | 'fill'>,
    VariantProps<typeof iconVariants> {
  isFilled?: boolean
}

export type MaterialIconSetIconProps = Omit<MaterialIconProps, 'icon'>

export function MaterialIcon({
  icon,
  color,
  size = 24,
  isFilled = false,
  className,
  ...props
}: MaterialIconProps) {
  const classNames = iconVariants({ className, color })
  return (
    <MaterialSymbol
      icon={icon}
      size={size}
      className={classNames}
      fill={isFilled}
      {...props}
    />
  )
}