When I was using the library I had the need to hide a popup, once the trigger element was outside the boundary element.
I figured, that there is now built-in function for this in the library as of now. Hence, I decided to add this functionality by adding a new property onTriggerOutside where you can pass a callback function that will be triggered whenever a popover is open and the trigger is outside the boundary element.
This behaviour can be adjusted using the two additional properties intersectInset (similar to boundary inset when computing an intersection) and intersectThreshold (defines how much % of the element has to be outside the boundary element). See the README for more details.
To implement this behaviour, I added a new custom hook that handles all the intersection computation using the Intersection Observer API. To optimise the performance, I only recreate the observer if relevant properties change and I only listen to intersection events if the popover is open.
When I was using the library I had the need to hide a popup, once the trigger element was outside the boundary element.
I figured, that there is now built-in function for this in the library as of now. Hence, I decided to add this functionality by adding a new property
onTriggerOutside
where you can pass a callback function that will be triggered whenever a popover is open and the trigger is outside the boundary element.This behaviour can be adjusted using the two additional properties
intersectInset
(similar to boundary inset when computing an intersection) andintersectThreshold
(defines how much % of the element has to be outside the boundary element). See the README for more details.To implement this behaviour, I added a new custom hook that handles all the intersection computation using the Intersection Observer API. To optimise the performance, I only recreate the observer if relevant properties change and I only listen to intersection events if the popover is open.