from browser import document, timer
from js_modules.tippy_js import tippy


def create_popup(
    target,
    content_elt,
    focus_class="has-popup-focus",
    focus_elt=None,
    **kwargs
):
    """Create a popup and show a popup below a target

    The popup is created and destroyed on each call, this can be used for dynamic content.
    @param target: element where the popup will appear, or a selector
    @param content_elt: HTML element to show in the popup
    @param focus_class: class added to target element when popup is shown
    @param focus_elt: element where focus_class is added. If None, target will be used.
    @param kwargs: arguments used to override tippy options
    """
    if focus_elt is None:
        focus_elt = target
    def on_hide(__):
        focus_elt.classList.remove(focus_class)
        timer.set_timeout(tippy_instance.destroy, 0)
    tippy_opts = {
        "trigger": "click",
        "content": content_elt,
        "appendTo": document.body,
        "placement": "bottom",
        "interactive": True,
        "trigger": "manual",
        "theme": "light",
        "onShow": lambda __: focus_elt.classList.add(focus_class),
        "onHide": on_hide
    }
    tippy_opts.update(kwargs)

    tippy_instance = tippy(
        target,
        tippy_opts
    )
    tippy_instance.show()
    return tippy_instance