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

@@ -68,10 +68,9 @@ const Blocks = ({
return (
<Tooltip
key={tool.name}
selector={`workflow-block-tool-${tool.name}`}
position='bottom'
className='!p-0 !px-3 !py-2.5 !w-[210px] !leading-[18px] !text-xs !text-gray-700 !border-[0.5px] !border-black/5 !bg-transparent !rounded-xl !shadow-lg translate-x-[108px]'
htmlContent={(
popupClassName='!p-0 !px-3 !py-2.5 !w-[210px] !leading-[18px] !text-xs !text-gray-700 !border-[0.5px] !border-black/5 !bg-transparent !rounded-xl !shadow-lg translate-x-[108px]'
popupContent={(
<div>
<BlockIcon
size='md'
@@ -91,7 +90,7 @@ const Blocks = ({
)}
</div>
)}
noArrow
needsDelay
>
<div className='group/item flex items-center w-full pl-3 pr-1 h-8 rounded-lg hover:bg-gray-50 cursor-pointer'>
<BlockIcon

View File

@@ -2,10 +2,7 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiQuestionLine,
} from '@remixicon/react'
import Tooltip from '../../base/tooltip'
import Tooltip from '@/app/components/base/tooltip'
import cn from '@/utils/classnames'
import type { Credential } from '@/app/components/tools/types'
import Drawer from '@/app/components/base/drawer-plus'
@@ -112,15 +109,13 @@ const ConfigCredential: FC<Props> = ({
<div className='flex items-center h-8 text-[13px] font-medium text-gray-900'>
{t('tools.createTool.authMethod.key')}
<Tooltip
selector='model-page-system-reasoning-model-tip'
htmlContent={
popupContent={
<div className='w-[261px] text-gray-500'>
{t('tools.createTool.authMethod.keyTooltip')}
</div>
}
>
<RiQuestionLine className='ml-0.5 w-[14px] h-[14px] text-gray-400' />
</Tooltip>
triggerClassName='ml-0.5'
/>
</div>
<input
value={tempCredential.api_key_header}

View File

@@ -2,9 +2,6 @@
import type { FC } from 'react'
import React, { useState } from 'react'
import { useTranslation } from 'react-i18next'
import {
RiQuestionLine,
} from '@remixicon/react'
import produce from 'immer'
import type { Emoji, WorkflowToolProviderParameter, WorkflowToolProviderRequest } from '../types'
import cn from '@/utils/classnames'
@@ -148,15 +145,12 @@ const WorkflowToolAsModal: FC<Props> = ({
<div className='flex items-center py-2 leading-5 text-sm font-medium text-gray-900'>
{t('tools.createTool.nameForToolCall')} <span className='ml-1 text-red-500'>*</span>
<Tooltip
htmlContent={
popupContent={
<div className='w-[180px]'>
{t('tools.createTool.nameForToolCallPlaceHolder')}
</div>
}
selector='workflow-tool-modal-tooltip'
>
<RiQuestionLine className='ml-2 w-[14px] h-[14px] text-gray-400' />
</Tooltip>
/>
</div>
<input
type='text'