aevgarik/paperclip
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): enable scroll wheel in selectors inside dialogs

Browse Source 
Radix Dialog wraps content in react-remove-scroll, which blocks wheel
events on portaled Popover content (rendered outside the Dialog DOM
tree). Add a disablePortal option to PopoverContent and use it for all
InlineEntitySelector instances inside NewIssueDialog so the Popover
stays in the Dialog's DOM tree and scrolling works.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dotta
2026-03-06 08:04:35 -06:00
parent d4eb502389
commit 9d570b3ed7
3 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
ui/src/components/ui/popover.tsx
View File

@@ -19,22 +19,23 @@ function PopoverContent({
className,
align = "center",
sideOffset = 4,
disablePortal = false,
...props
}: React.ComponentProps<typeof PopoverPrimitive.Content>) {
return (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
data-slot="popover-content"
align={align}
sideOffset={sideOffset}
className={cn(
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
className
)}
{...props}
/>
</PopoverPrimitive.Portal>
}: React.ComponentProps<typeof PopoverPrimitive.Content> & { disablePortal?: boolean }) {
const content = (
<PopoverPrimitive.Content
data-slot="popover-content"
align={align}
sideOffset={sideOffset}
className={cn(
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
className
)}
{...props}
/>
)
if (disablePortal) return content
return <PopoverPrimitive.Portal>{content}</PopoverPrimitive.Portal>
}
function PopoverAnchor({