mirror of
https://github.com/langgenius/dify.git
synced 2026-09-08 11:04:27 +08:00
refactor(tooltip): support per-instance delay and apply in compliance menu
This commit is contained in:
parent
5c278d99d4
commit
f83f84afac
@ -14,6 +14,8 @@ export type TooltipProps = {
|
|||||||
popupClassName?: string
|
popupClassName?: string
|
||||||
noDecoration?: boolean
|
noDecoration?: boolean
|
||||||
offset?: number
|
offset?: number
|
||||||
|
delay?: number
|
||||||
|
closeDelay?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
const Tooltip = React.memo(({
|
const Tooltip = React.memo(({
|
||||||
@ -24,6 +26,8 @@ const Tooltip = React.memo(({
|
|||||||
popupClassName,
|
popupClassName,
|
||||||
noDecoration,
|
noDecoration,
|
||||||
offset = 8,
|
offset = 8,
|
||||||
|
delay,
|
||||||
|
closeDelay,
|
||||||
}: TooltipProps) => {
|
}: TooltipProps) => {
|
||||||
const { side, align } = parsePlacement(position)
|
const { side, align } = parsePlacement(position)
|
||||||
|
|
||||||
@ -33,8 +37,8 @@ const Tooltip = React.memo(({
|
|||||||
return (
|
return (
|
||||||
<BaseTooltip.Root>
|
<BaseTooltip.Root>
|
||||||
{React.isValidElement(children)
|
{React.isValidElement(children)
|
||||||
? <BaseTooltip.Trigger render={children} />
|
? <BaseTooltip.Trigger delay={delay} closeDelay={closeDelay} render={children} />
|
||||||
: <BaseTooltip.Trigger render={<span className="inline-flex" />}>{children}</BaseTooltip.Trigger>}
|
: <BaseTooltip.Trigger delay={delay} closeDelay={closeDelay} render={<span className="inline-flex" />}>{children}</BaseTooltip.Trigger>}
|
||||||
<BaseTooltip.Portal>
|
<BaseTooltip.Portal>
|
||||||
<BaseTooltip.Positioner
|
<BaseTooltip.Positioner
|
||||||
side={side}
|
side={side}
|
||||||
|
|||||||
@ -3,6 +3,7 @@ import { useMutation } from '@tanstack/react-query'
|
|||||||
import { useCallback } from 'react'
|
import { useCallback } from 'react'
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import { DropdownMenuGroup, DropdownMenuItem, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger } from '@/app/components/base/ui/dropdown-menu'
|
import { DropdownMenuGroup, DropdownMenuItem, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger } from '@/app/components/base/ui/dropdown-menu'
|
||||||
|
import Tooltip from '@/app/components/base/ui/tooltip'
|
||||||
import { Plan } from '@/app/components/billing/type'
|
import { Plan } from '@/app/components/billing/type'
|
||||||
import { ACCOUNT_SETTING_TAB } from '@/app/components/header/account-setting/constants'
|
import { ACCOUNT_SETTING_TAB } from '@/app/components/header/account-setting/constants'
|
||||||
import { useModalContext } from '@/context/modal-context'
|
import { useModalContext } from '@/context/modal-context'
|
||||||
@ -17,7 +18,6 @@ import SparklesSoft from '../../base/icons/src/public/common/SparklesSoft'
|
|||||||
import PremiumBadge from '../../base/premium-badge'
|
import PremiumBadge from '../../base/premium-badge'
|
||||||
import Spinner from '../../base/spinner'
|
import Spinner from '../../base/spinner'
|
||||||
import Toast from '../../base/toast'
|
import Toast from '../../base/toast'
|
||||||
import Tooltip from '../../base/tooltip'
|
|
||||||
|
|
||||||
const submenuTriggerClassName = '!mx-0 !h-8 !rounded-lg !px-3 data-[highlighted]:!bg-state-base-hover'
|
const submenuTriggerClassName = '!mx-0 !h-8 !rounded-lg !px-3 data-[highlighted]:!bg-state-base-hover'
|
||||||
const submenuItemClassName = '!mx-0 !h-10 !rounded-lg !py-1 !pl-1 !pr-2 data-[highlighted]:!bg-state-base-hover'
|
const submenuItemClassName = '!mx-0 !h-10 !rounded-lg !py-1 !pl-1 !pr-2 data-[highlighted]:!bg-state-base-hover'
|
||||||
@ -84,7 +84,7 @@ function ComplianceDocActionVisual({
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Tooltip asChild={false} popupContent={tooltipText}>
|
<Tooltip popupContent={tooltipText} delay={0}>
|
||||||
<PremiumBadge color="blue" allowHover={true}>
|
<PremiumBadge color="blue" allowHover={true}>
|
||||||
<SparklesSoft className="flex h-3.5 w-3.5 items-center py-[1px] pl-[3px] text-components-premium-badge-indigo-text-stop-0" />
|
<SparklesSoft className="flex h-3.5 w-3.5 items-center py-[1px] pl-[3px] text-components-premium-badge-indigo-text-stop-0" />
|
||||||
<div className="px-1 system-xs-medium">
|
<div className="px-1 system-xs-medium">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user