Closing
The Popup provides events which facilitate common use cases such as closing the component after leaving the viewport and on document or Esc
click.
After Leaving the Viewport
The anchorViewportLeave
event is triggered when the anchor is scrolled outside the screen boundaries. When the anchor is not visible, use anchorViewportLeave
to close the Popup—otherwise, it will remain visible within the screen boundaries.
The control over the visibility of the Popup depends on you. As a result, when the container is scrolled, the Popup will not close automatically.
On Document Click or Escape
To close the Popup when the user clicks outside its boundaries, wire the document.click
event and determine whether the Popup was clicked. If clicked, the Popup remains open.
The control over the visibility of the Popup depends on you. As a result, upon a document click or
Esc
press, the Popup will not close automatically.