From a430284aa21e3ae1f0d5654e55b2ad2852519cc2 Mon Sep 17 00:00:00 2001
From: wwf <yearningwang@iqtogether.com>
Date: 星期三, 04 六月 2025 15:17:49 +0800
Subject: [PATCH] 初始化
---
app/components/base/popover/index.tsx | 30 +++++++++++++++---------------
1 files changed, 15 insertions(+), 15 deletions(-)
diff --git a/app/components/base/popover/index.tsx b/app/components/base/popover/index.tsx
index 2a831e0..8fd9906 100644
--- a/app/components/base/popover/index.tsx
+++ b/app/components/base/popover/index.tsx
@@ -1,4 +1,4 @@
-import { Popover, PopoverButton, PopoverPanel, Transition } from '@headlessui/react'
+import { Popover, Transition } from '@headlessui/react'
import { Fragment, cloneElement, useRef } from 'react'
import cn from '@/utils/classnames'
@@ -9,7 +9,7 @@
type IPopover = {
className?: string
- htmlContent: React.ReactNode
+ htmlContent: React.ReactElement<HtmlContentProps>
popupClassName?: string
trigger?: 'click' | 'hover'
position?: 'bottom' | 'br' | 'bl'
@@ -33,15 +33,15 @@
disabled = false,
}: IPopover) {
const buttonRef = useRef<HTMLButtonElement>(null)
- const timeOutRef = useRef<number | null>(null)
+ const timeOutRef = useRef<NodeJS.Timeout | null>(null)
const onMouseEnter = (isOpen: boolean) => {
- timeOutRef.current && window.clearTimeout(timeOutRef.current)
+ timeOutRef.current && clearTimeout(timeOutRef.current)
!isOpen && buttonRef.current?.click()
}
const onMouseLeave = (isOpen: boolean) => {
- timeOutRef.current = window.setTimeout(() => {
+ timeOutRef.current = setTimeout(() => {
isOpen && buttonRef.current?.click()
}, timeoutDuration)
}
@@ -59,23 +59,23 @@
onMouseEnter: () => onMouseEnter(open),
})}
>
- <PopoverButton
+ <Popover.Button
ref={buttonRef}
disabled={disabled}
className={cn(
- 'group inline-flex items-center rounded-lg border border-components-button-secondary-border bg-components-button-secondary-bg px-3 py-2 text-base font-medium hover:border-components-button-secondary-border-hover hover:bg-components-button-secondary-bg-hover focus:outline-none',
- open && 'border-components-button-secondary-border bg-components-button-secondary-bg-hover',
+ 'group inline-flex items-center bg-components-button-secondary-bg px-3 py-2 rounded-lg text-base border border-components-button-secondary-border font-medium hover:bg-components-button-secondary-bg-hover hover:border-components-button-secondary-border-hover focus:outline-none',
+ open && 'bg-components-button-secondary-bg-hover border-components-button-secondary-border',
(btnClassName && typeof btnClassName === 'string') && btnClassName,
(btnClassName && typeof btnClassName !== 'string') && btnClassName?.(open),
)}
>
{btnElement}
- </PopoverButton>
+ </Popover.Button>
<Transition as={Fragment}>
- <PopoverPanel
+ <Popover.Panel
className={cn(
- 'absolute z-10 mt-1 w-full max-w-sm px-4 sm:px-0 lg:max-w-3xl',
- position === 'bottom' && 'left-1/2 -translate-x-1/2',
+ 'absolute z-10 w-full max-w-sm px-4 mt-1 sm:px-0 lg:max-w-3xl',
+ position === 'bottom' && '-translate-x-1/2 left-1/2',
position === 'bl' && 'left-0',
position === 'br' && 'right-0',
className,
@@ -90,7 +90,7 @@
>
{({ close }) => (
<div
- className={cn('w-fit min-w-[130px] overflow-hidden rounded-lg bg-components-panel-bg shadow-lg ring-1 ring-black/5', popupClassName)}
+ className={cn('overflow-hidden bg-components-panel-bg w-fit min-w-[130px] rounded-lg shadow-lg ring-1 ring-black ring-opacity-5', popupClassName)}
{...(trigger !== 'hover'
? {}
: {
@@ -99,7 +99,7 @@
})
}
>
- {cloneElement(htmlContent as React.ReactElement, {
+ {cloneElement(htmlContent as React.ReactElement<HtmlContentProps>, {
onClose: () => onMouseLeave(open),
...(manualClose
? {
@@ -109,7 +109,7 @@
})}
</div>
)}
- </PopoverPanel>
+ </Popover.Panel>
</Transition>
</div>
</>
--
Gitblit v1.8.0