minutemailer / react-popup

React popup component
http://minutemailer.github.io/react-popup/
MIT License
208 stars 71 forks source link

Should the popup close when a click occurs outside? #14

Closed GRardB closed 7 years ago

GRardB commented 7 years ago

Hey, I just started playing around with this component. It seems to work flawlessly, but I'm not sure how to get the popup to close when the user clicks outside of it. It seems like I can't get the popup to go away unless I explicitly call Popup.close().

Should this be default behavior? If not, how did you accomplish it in the demo page? Is there a "best practice" for this sort of thing?

Thanks!

tbleckert commented 7 years ago

Short answer: Yes, it should close when you click outside.

Long answer: The popup container is supposed to cover the whole area of a page with the actual popup floating inside of it. The outside click handler is attached to the container. The main reason why the container should cover the whole page is because you can have a transparent background on it that acts as an overlay. You can make a transparent overlay by setting "noOverlay" to true.

We should definitely add documentation regarding styling of the component. In the next release we will also add inline css as a feature to make things easier and more in line with the "react way" of styling components.

Hope that answers your question and thanks for using it. Let me know if you find any other bugs or maybe have som feature requests. And as always, PRs are always welcome and appreciated.

GRardB commented 7 years ago

Gotcha, that makes sense. Thanks! It appears that the problem I have is that there are no styles on the container, so it has a height/width of 0.

Either way, I think that for my use case, I'll need to go a different route. I'm using the component purely for popovers (like the example on the demo page), and having the container cover the whole page prevents users from doing other things, such as selecting text or clicking links; they would need to first click outside of the popup in order to do anything else.

I've been meaning to try to contribute to more OSS, so if I have something I'd like to add to this, I'll be sure to do it :grin: