fix: Dialog/Select 在 drag 区域内点击无响应
Electron 的 WebkitAppRegion: drag 会拦截鼠标事件, Portal 渲染到 body 的弹出层同样受影响。 给 DialogOverlay、DialogContent、SelectContent 加 no-drag 确保弹出层内的按钮、下拉等控件可正常交互。
This commit is contained in:
1 parent
dcde9f8f71
commit
3ffba998f5
2 files changed
+4
No files matched your search
@@ -25,6 +25,7 @@ function DialogClose({ ...props }: DialogPrimitive.Close.Props) {
|
|||||||
|
|
||||||
function DialogOverlay({
|
function DialogOverlay({
|
||||||
className,
|
className,
|
||||||
|
style,
|
||||||
...props
|
...props
|
||||||
}: DialogPrimitive.Backdrop.Props) {
|
}: DialogPrimitive.Backdrop.Props) {
|
||||||
return (
|
return (
|
||||||
@@ -34,6 +35,7 @@ function DialogOverlay({
|
|||||||
"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
|
"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
|
||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
|
style={{ WebkitAppRegion: "no-drag", ...style } as React.CSSProperties}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
@@ -56,6 +58,7 @@ function DialogContent({
|
|||||||
"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 text-sm ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 text-sm ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
|
style={{ WebkitAppRegion: "no-drag" } as React.CSSProperties}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
|
|||||||
@@ -100,6 +100,7 @@ function SelectContent({
|
|||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
position={position}
|
position={position}
|
||||||
|
style={{ WebkitAppRegion: "no-drag" } as React.CSSProperties}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<SelectScrollUpButton />
|
<SelectScrollUpButton />
|
||||||
|
|||||||
Reference in new issue
Block a user