import { View } from '@tarojs/components'
import type { FC, ReactNode } from 'react'
import classname from 'classnames'
import type { IconNames } from '../iconfont/iconfont'
import IconFont from '../iconfont/iconfont'
import styles from './index.module.scss'

interface PropsType {
  iconName: IconNames
  title: string
  children?: ReactNode
  onClick?: Function
  customClass?: string
  iconSize?: number
}
const IconCard: FC<PropsType> = (props) => {
  const { iconName, title, onClick, customClass = '', iconSize = 72 } = props
  const handleClick = (event) => {
    console.log(event)
    onClick && onClick(event)
  }
  return (
    <View className={classname(styles.iconCard, customClass)} onClick={handleClick}>
      <IconFont name={iconName} size={iconSize}></IconFont>
      <View className={styles['iconCard-name']}>{title}</View>
    </View>
  )
}
export default IconCard