empty-trigger.tsx 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. import type { FC } from 'react'
  2. import { RiArrowDownSLine } from '@remixicon/react'
  3. import { CubeOutline } from '@/app/components/base/icons/src/vender/line/shapes'
  4. type ModelTriggerProps = {
  5. open: boolean
  6. className?: string
  7. }
  8. const ModelTrigger: FC<ModelTriggerProps> = ({
  9. open,
  10. className,
  11. }) => {
  12. return (
  13. <div
  14. className={`
  15. flex items-center px-2 h-8 rounded-lg bg-gray-100 hover:bg-gray-200 cursor-pointer
  16. ${className}
  17. ${open && '!bg-gray-200'}
  18. `}
  19. >
  20. <div className='grow flex items-center'>
  21. <div className='mr-1.5 flex items-center justify-center w-4 h-4 rounded-[5px] border border-dashed border-black/5'>
  22. <CubeOutline className='w-3 h-3 text-gray-400' />
  23. </div>
  24. <div
  25. className='text-[13px] text-gray-500 truncate'
  26. title='Select model'
  27. >
  28. Select model
  29. </div>
  30. </div>
  31. <div className='shrink-0 flex items-center justify-center w-4 h-4'>
  32. <RiArrowDownSLine className='w-3.5 h-3.5 text-gray-500' />
  33. </div>
  34. </div>
  35. )
  36. }
  37. export default ModelTrigger