Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] combination of openOnClick & globalCloseEvents with clickOutsideAnchor does not close on click outside anchor #1228

Closed
JMLexLExter opened this issue Oct 9, 2024 · 3 comments
Labels

Comments

@JMLexLExter
Copy link

Bug description
I have a Tooltip component that looks like this:

image

Tooltip component that has both the openOnClick (or openEvents={{ click: true }} ) and globalCloseEvents={{ clickOutsideAnchor: true }} props, does not combine their behavior.

Version of Package
v5.28.0

To Reproduce
Create a Tooltip with both openOnClick & globalCloseEvents.

Expected behavior
I expect the the tooltip to be shown on click on the #anchorSelect anchor and to be closed on another click. I also expect to close the tooltip on click outside the Tooltip. Instead the clickOutsideAnchor doesn't work and clicking outside the #anchorSelect does not work

Screenshots
If applicable, add screenshots to help explain your problem.

Additional context
"react": "^18.2.0",
"styled-components": "^5.3.6",
"typescript": "^5.5.4"

@JMLexLExter JMLexLExter added the Bug label Oct 9, 2024
@JMLexLExter JMLexLExter changed the title [BUG] [BUG] combination of openOnClick & globalCloseEvents with clickOutsideAnchor does not close on click outside anchor Oct 9, 2024
@gabrieljablonski
Copy link
Member

How are you using isOpen? You might be having issues with controlled/uncontrolled state for the tooltip. Please try providing a code sandbox reproducing the issue.

Also check #1220 and see if it relates to your issue.

@richhapal
Copy link

richhapal commented Oct 9, 2024

Hi @JMLexLExter you can use setIsOpen function that will trigger during clickOutsideAnchor so update your state inside setIsOpen callback function.

@JMLexLExter
Copy link
Author

JMLexLExter commented Oct 31, 2024

@richhapal @gabrieljablonski Thank you both for a quick response, sorry for the late reply, this issue priority changed.
I tried to create a sandbox where the issue was replicated, but Instead I find out that the reason was me incorrectly assuming how setIsOpen works. After setting it up correctly and checking that svg need pointer-events: none.

It worked for me, so thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants