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

Controlled mode: cannot close popover from overlay click #36

Open
hypervillain opened this issue Mar 13, 2021 · 1 comment
Open

Controlled mode: cannot close popover from overlay click #36

hypervillain opened this issue Mar 13, 2021 · 1 comment

Comments

@hypervillain
Copy link

hypervillain commented Mar 13, 2021

I would like to use the popover in controlled mode.
Although simple cases (handle state from inside popover) work, there is no idiomatic way to close the popover by clicking on the overlay.

Adding a onOverlayClick would work for me.

I also noted that closing from the overlay in uncontrolled mode does not trigger the onClose event, as you're only toggling the internal state of the popover in this case

@alexpreynolds
Copy link

I ran into this same issue for a project I'm working on, where I am using a managed Popover but the overlay does not responds to click events. I put a fork/branch over here that works for me:

https://github.com/alexpreynolds/react-awesome-popover/tree/methylation

From the managing/controlling component:

<Popover
  action="null"
  open={this.state.isPopoverOpen}
  updatePopoverState={(flag) => this.handlePopoverOpenStateChange(flag)}
  >
  ...

The callback handlePopoverOpenStateChange changes isPopoverOpen to whatever flag happens to be.

In the case of clicking on the Overlay, its onClose calls the parent popover's onClose, which in turn calls updatePopoverState to update the managing/controlling component.

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

No branches or pull requests

2 participants