badge.tsx 603 B

12345678910111213141516171819202122232425262728293031
  1. import { memo } from 'react'
  2. import cn from '@/utils/classnames'
  3. type BadgeProps = {
  4. className?: string
  5. text?: string
  6. children?: React.ReactNode
  7. uppercase?: boolean
  8. }
  9. const Badge = ({
  10. className,
  11. text,
  12. children,
  13. uppercase = true,
  14. }: BadgeProps) => {
  15. return (
  16. <div
  17. className={cn(
  18. 'inline-flex items-center px-[5px] h-5 rounded-[5px] border border-divider-deep leading-3 text-text-tertiary',
  19. uppercase ? 'system-2xs-medium-uppercase' : 'system-xs-medium',
  20. className,
  21. )}
  22. >
  23. {children || text}
  24. </div>
  25. )
  26. }
  27. export default memo(Badge)