Why does GroupFocus close when clicked outside of it

Questions
4

I think I figured out a piece of it

<style>
    #element_always_visible {
        visibility: visible !important;
        display: initial !important;
    }
</style>

This works so long as the page width doesn’t change as the groupfocus will remain open, but it does not track the reference element as the reference element moves with the page width changes.

EDIT

This works so far as the page width doesn’t change quickly. The group focus will remain open and doesn’t close when clicked outside and tracks the reference element as the position shifts

<style>
    #element_always_visible {
        visibility: visible !important;
        display: flex !important;
    }
</style>

One caveat to this is that the Bubble internal ‘is visible’ doesn’t work with it…what this means, is that when the custom CSS is applied and the groupfocus remains visible to the user on the screen, Bubble still interprets it as ‘invisible’ (can check debugger to confirm) which means any conditionals that reference the group focus is visible or is not visible will not work. To account for that, simply create a custom state that I call ‘is shown’ and use that instead of built in Bubble is visible/is not visible.