const Badge = ({ 
  children, 
  type, 
  ...props 
}) => {
  return (
    <div 
      { ...props }
      className={`${badgeStyle(type)} ${props?.className}`}
    >
      { children }
    </div>
  )
}

Badge.defaultProps = {
  className: ''
}

const badgeStyle = (type) => {
  let className = ['rounded px-1 text-[11px]']
  switch (type) {
    case 'solid-red':
      className.push('bg-red_r-11 text-white')
      break
    case 'light':
      className.push('bg-gray_r-4 text-gray_r-11')
      break
  }
  return className.join(' ')
}

export default Badge