import React, { HTMLAttributes, DetailedHTMLProps } from 'react';
import cl from 'classnames';
import style from './icon.module.scss';

interface IconProps
  extends DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {
  icon: string;
}

const Icon = ({ icon, className, ...spanProps }: IconProps) => {

  const _className = cl(style.iconfont, {
    [style[icon]]: true,
    [style.cursorPointer]: spanProps.onClick,
    [className || '']: true
  })

  return (
    <span {...spanProps} className={_className}/>
  )
}

export default Icon;