description.tsx 683 B

12345678910111213141516171819202122232425262728293031
  1. import type { FC } from 'react'
  2. import React, { useMemo } from 'react'
  3. import cn from '@/utils/classnames'
  4. type Props = {
  5. className?: string
  6. text: string
  7. descriptionLineRows: number
  8. }
  9. const Description: FC<Props> = ({
  10. className,
  11. text,
  12. descriptionLineRows,
  13. }) => {
  14. const lineClassName = useMemo(() => {
  15. if (descriptionLineRows === 1)
  16. return 'h-4 truncate'
  17. else if (descriptionLineRows === 2)
  18. return 'h-8 line-clamp-2'
  19. else
  20. return 'h-12 line-clamp-3'
  21. }, [descriptionLineRows])
  22. return (
  23. <div className={cn('system-xs-regular text-text-tertiary', lineClassName, className)}>
  24. {text}
  25. </div>
  26. )
  27. }
  28. export default Description