import React from 'react';
import "./Icons.scss"

export interface IconProps {
  name: string;
  onClick?: () => void;
  color?: string;
  className?: string;
}

export const Icon = ({ name, color, onClick, className }: IconProps) => {
  const classes=`bi bi-${name} ${color? `text-${color}` : ''} ${className}`;
  return (
    <i className={classes} onClick={onClick}></i>
  );
};

export const FlagIcon = ({ name, onClick, className }: IconProps) => {
  const classes=`fi fi-${name.toLowerCase()} ${className}`;
  return (
    <i className={classes} onClick={onClick}></i>
  );
};