feat: tooltip (#7634)

This commit is contained in:
Yi Xiao
2024-08-26 13:00:02 +08:00
committed by GitHub
parent 1ba3d3acd6
commit 3be756eaed
93 changed files with 640 additions and 758 deletions

View File

@@ -1,5 +1,6 @@
import { CheckCircleIcon } from '@heroicons/react/24/solid'
import { QuestionMarkCircleIcon, XMarkIcon } from '@heroicons/react/24/outline'
import { XMarkIcon } from '@heroicons/react/24/outline'
import { RiQuestionLine } from '@remixicon/react'
import { useTranslation } from 'react-i18next'
import { useMemo } from 'react'
import InvitationLink from './invitation-link'
@@ -64,12 +65,11 @@ const InvitedModal = ({
failedInvationResults.map(item =>
<div key={item.email} className='flex justify-center border border-red-300 rounded-md px-1 bg-orange-50'>
<Tooltip
selector={`invitation-tag-${item.email}`}
htmlContent={item.message}
popupContent={item.message}
>
<div className='flex justify-center items-center text-sm gap-1'>
{item.email}
<QuestionMarkCircleIcon className='w-4 h-4 text-red-300' />
<RiQuestionLine className='w-4 h-4 text-red-300' />
</div>
</Tooltip>
</div>,

View File

@@ -39,18 +39,14 @@ const InvitationLink = ({
<div className="flex items-center flex-grow h-5">
<div className='flex-grow bg-gray-100 text-[13px] relative h-full'>
<Tooltip
selector={selector.current}
content={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
className='z-10'
popupContent={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
>
<div className='absolute top-0 left-0 w-full pl-2 pr-2 truncate cursor-pointer r-0' onClick={copyHandle}>{value.url}</div>
</Tooltip>
</div>
<div className="flex-shrink-0 h-4 bg-gray-200 border" />
<Tooltip
selector={selector.current}
content={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
className='z-10'
popupContent={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
>
<div className="px-0.5 flex-shrink-0">
<div className={`box-border w-[30px] h-[30px] flex items-center justify-center rounded-lg hover:bg-gray-100 cursor-pointer ${s.copyIcon} ${isCopied ? s.copied : ''}`} onClick={copyHandle}>