import { PropsWithChildren } from 'react'
import { Text, View } from '@tarojs/components'
import './index.scss'

interface ChipProps {
  active?: boolean
  prefix?: string
  className?: string
  onClick?: () => void
}

export function Chip({ active = false, prefix, className = '', onClick, children }: PropsWithChildren<ChipProps>) {
  return (
    <View className={`chip ${active ? 'chip--active' : ''} ${className}`} onClick={onClick}>
      {prefix ? <Text className='chip__prefix'>{prefix}</Text> : null}
      <Text>{children}</Text>
    </View>
  )
}

export default Chip

