[BUG] - Popover closes on scroll

[monster99d2]

NextUI Version

2.4

Describe the bug

I have a popover filled with a lot of content usually requiring me to scroll down to see the rest. I've found a stable version to be 2.3, but on anything 2.4 and higher the moment I begin scrolling the popover immediately closes.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Make a popover
2. Click it so it opens
3. Scroll

Expected behavior

I expected it to stay open as I'm scrolling until I either click out of the popover or click the button to trigger it again.

Screenshots or Videos

No response

Operating System Version

macOS

Browser

Chrome

[linear[bot]]

ENG-1237 [BUG] - Popover closes on scroll

[awesome-pro]

@monster99d2 this is not bug, but rather a newly added feature by #3414

[monster99d2]

How do I stop this from happening?

On Friday, Aug 02, 2024 at 3:09 PM, Abhinandan @. @.)> wrote:

@monster99d2 (https://github.com/monster99d2) this is not bug, but rather a newly added feature by #3414 (https://github.com/nextui-org/nextui/pull/3414)

— Reply to this email directly, view it on GitHub (https://github.com/nextui-org/nextui/issues/3594#issuecomment-2265983187), or unsubscribe (https://github.com/notifications/unsubscribe-auth/ASCQENWY6NOJPOYEG6CCSQ3ZPPKQBAVCNFSM6AAAAABL477WROVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENRVHE4DGMJYG4). You are receiving this because you were mentioned.Message ID: @.***>

[wingkwong]

If you scroll inside the popover, it won't close. It only closes when you scroll outside.

[AnYiEE]

If you scroll inside the popover, it won't close. It only closes when you scroll outside.

@wingkwong It seems not to be the case. I use NextUI 2.4.6, on my website, it always gets closed when scrolling.

Reproduction steps:

1. Visit my website.
2. Click on any avatar on the left side.
3. Click on the gear icon at the newly appeared card on the right side.
4. Move the mouse over the popover card and scroll.

The actual effect is that the popover is still closed.

The source code link of that component. It is worth noting that the popover itself does not have any additional states for controlling open and close, only specifying the props showArrow offset={10} placement="bottom-end".

[wingkwong]

@AnYiEE The popover card is not scrollable so it is actually scrolling outside. Therefore it will close. Abhinandan has made a PR to introduce a new prop to disable the scroll. I think that would cover your case.

[AnYiEE]

@AnYiEE The popover card is not scrollable so it is actually scrolling outside. Therefore it will close. Abhinandan has made a PR to introduce a new prop to disable the scroll. I think that would cover your case.

@wingkwong Your mean that this behavior is only related to whether the content in the card can scroll, not the position of the mouse? But when there is a lot of content in the card, like in my example, clicking on the first accordion in the popover card, which has a lot of content that exceeds the screen. I think it is not very easy to determine the maximum height of the popover itself in this case. It would be more intuitive to scroll by moving the mouse over or touch, instead of directly prohibiting closing the popover while scrolling.