import { r as registerInstance, h, c as getElement } from './core-3f33e631.js';
import { e as debounce } from './utils-3aef1637.js';

const Popover = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.scrollListener = () => this.onScroll(window);
        /**
         * Render the arrow
         */
        this.arrow = true;
        /**
         * The strategy for dismissing the popover
         * Options are: `"explicit"`and `"auto"`. Defaults to "explicit".
         */
        this.dismiss = 'explicit';
        /**
         * The preferred placement
         * Options are: `"botton"`, `"left"`, `"right"`, and "top" which is the default
         */
        this.placement = 'top';
    }
    componentWillLoad() {
        this.onScroll = debounce(this.onScroll.bind(this), 50);
    }
    async disconnectedCallback() {
        if (this.dismiss === 'auto') {
            this.target = undefined;
            window.removeEventListener('scroll', this.scrollListener);
        }
        if (this.overlay) {
            const popper = await this.overlay.popper();
            if (popper) {
                this.overlay.remove();
            }
        }
    }
    /**
     * Display the popover
     */
    async display(target) {
        const popper = await this.overlay.popper();
        if (popper) {
            popper.reference = target;
            popper.scheduleUpdate();
        }
        else {
            if (this.dismiss === 'auto') {
                this.target = target;
                window.addEventListener('scroll', this.scrollListener);
            }
            return this.overlay.open(target);
        }
    }
    /**
     * Hide the popover
     */
    async hide() {
        this.disconnectedCallback();
        await this.overlay.close();
    }
    /**
     * Alternate hiding and showing
     */
    async toggle(target) {
        const popper = await this.overlay.popper();
        if (popper) {
            return this.hide();
        }
        else {
            return this.display(target);
        }
    }
    async showing() {
        const popper = await this.overlay.popper();
        return !!popper;
    }
    async onScroll(win) {
        if (win.scrollY > (this.target.offsetTop + this.target.offsetHeight) || win.scrollY < (this.target.offsetTop - this.target.offsetHeight)) {
            return this.hide();
        }
    }
    render() {
        return (h("anj-overlay", { class: "anj-popover", dismiss: this.dismiss, scrollable: true, placement: this.placement, offset: this.arrow ? '0, 15' : '0, 5', ref: (ref) => this.overlay = ref }, this.arrow ? h("anj-arrow", null) : '', h("div", { class: "anj-popover-content" }, h("slot", null))));
    }
    get element() { return getElement(this); }
    static get style() { return ".sc-anj-popover-h {\n  display: none;\n}"; }
};

export { Popover as anj_popover };
