For Popovers that utilize an open onClick, clicking outside the content does not close it.
https://codesandbox.io/s/popover-opens-on-click-u0ybm?file=/example.js
Once the content is opened via onClick, the content does not close when you click outside of it.
Expected behavior should be similar to this: https://baseweb.design/components/popover/#popover-opens-on-click
Content should close when you click outside the content. Currently, it opens on click and closes on click only.
The prop dismissOnClickOutside doesn't work either.
| Tech | Version |
| ------- | ------- |
| Base UI | v9.67.2 |
| React | 16.13.0 |
| browser | chrome |
@candycanetrain I think this is an issue with codesandbox. I tried it locally as well as in the popover sandbox on the doc site and the it works as expected. Are you seeing this issue in your app?
@sandgraham Yeah, I'm seeing it in my app.
Are you using the same versions of baseUI? Is the triggerType = click? The popover closes if triggerType is set to 'hover' (as opposed to 'click').
Also, dismissOnClickOutside didn't seem to work for me.
Changing BaseProvider to esm import on codesandbox fixed it https://codesandbox.io/s/popover-opens-on-click-z8ze1?file=/index.js I wonder if codesandbox changed their module resolution? CC @tajo did you hear back about the bug you filed?
@sandgraham Yeah, I'm seeing it in my app.
Are you using the same versions of baseUI? Is the triggerType = click? The popover closes if triggerType is set to 'hover' (as opposed to 'click').Also,
dismissOnClickOutsidedidn't seem to work for me.
Please make sure you use BaseProvider in your application as it adds LayersManager that handles actions like clickOutside for the layers (Popover creates a new Layer internally).
Please make sure you use BaseProvider in your application as it adds LayersManager that handles actions like clickOutside for the layers (Popover creates a new Layer internally).
馃憤
@chasestarr Oh no, this again. It seems that they did some es module resolution rewrite in January: https://github.com/codesandbox/codesandbox-client/pull/3370
Hard to tell when it was released or what it's doing. Welp, creating a ticket.
Changing
BaseProviderto esm import on codesandbox fixed it https://codesandbox.io/s/popover-opens-on-click-z8ze1?file=/index.js I wonder if codesandbox changed their module resolution? CC @tajo did you hear back about the bug you filed?
@sandgraham Yeah, I'm seeing it in my app.
Are you using the same versions of baseUI? Is the triggerType = click? The popover closes if triggerType is set to 'hover' (as opposed to 'click').
Also,dismissOnClickOutsidedidn't seem to work for me.Please make sure you use
BaseProviderin your application as it addsLayersManagerthat handles actions like clickOutside for the layers (Popover creates a new Layer internally).
Thank you @chasestarr and @nadiia. That fixed the issue! Will be closing this issue.
Most helpful comment
Thank you @chasestarr and @nadiia. That fixed the issue! Will be closing this issue.