index.tsx 935 B

123456789101112131415161718192021222324252627282930313233343536
  1. import type { CSSProperties, FC } from 'react'
  2. import React from 'react'
  3. import { type VariantProps, cva } from 'class-variance-authority'
  4. import classNames from '@/utils/classnames'
  5. const dividerVariants = cva('',
  6. {
  7. variants: {
  8. type: {
  9. horizontal: 'w-full h-[0.5px] my-2 ',
  10. vertical: 'w-[1px] h-full mx-2',
  11. },
  12. bgStyle: {
  13. gradient: 'bg-gradient-to-r from-divider-regular to-background-gradient-mask-transparent',
  14. solid: 'bg-divider-regular',
  15. },
  16. },
  17. defaultVariants: {
  18. type: 'horizontal',
  19. bgStyle: 'solid',
  20. },
  21. },
  22. )
  23. type DividerProps = {
  24. className?: string
  25. style?: CSSProperties
  26. } & VariantProps<typeof dividerVariants>
  27. const Divider: FC<DividerProps> = ({ type, bgStyle, className = '', style }) => {
  28. return (
  29. <div className={classNames(dividerVariants({ type, bgStyle }), className)} style={style}></div>
  30. )
  31. }
  32. export default Divider