fix(ui): restore mobile touch scroll in popover dropdowns inside dialogs
Radix Dialog's modal DismissableLayer calls preventDefault() on pointerdown events originating outside the Dialog DOM tree. Popover portals render at the body level (outside the Dialog), so touch events on popover content were treated as 'outside' — killing scroll gesture recognition on mobile. Fix: add onPointerDownOutside to NewIssueDialog's DialogContent that detects events from Radix popper wrappers and calls event.preventDefault() on the Radix event (not the native event), which skips the Dialog's native preventDefault and restores touch scrolling. Also cleans up previous CSS-only workarounds (-webkit-overflow-scrolling, touch-pan-y on individual buttons) that couldn't override JS preventDefault.
This commit is contained in:
@@ -158,10 +158,7 @@ export const InlineEntitySelector = forwardRef<HTMLButtonElement, InlineEntitySe
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
className="max-h-56 overflow-y-auto overscroll-contain py-1 touch-pan-y"
|
||||
style={{ WebkitOverflowScrolling: "touch" }}
|
||||
>
|
||||
<div className="max-h-56 overflow-y-auto overscroll-contain py-1 touch-pan-y">
|
||||
{filteredOptions.length === 0 ? (
|
||||
<p className="px-2 py-2 text-xs text-muted-foreground">{emptyMessage}</p>
|
||||
) : (
|
||||
@@ -173,7 +170,7 @@ export const InlineEntitySelector = forwardRef<HTMLButtonElement, InlineEntitySe
|
||||
key={option.id || "__none__"}
|
||||
type="button"
|
||||
className={cn(
|
||||
"flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm touch-pan-y",
|
||||
"flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm",
|
||||
isHighlighted && "bg-accent",
|
||||
)}
|
||||
onMouseEnter={() => setHighlightedIndex(index)}
|
||||
|
||||
Reference in New Issue
Block a user