import * as i0 from '@angular/core';
import { EventEmitter, Directive, ViewChild, Input, Output } from '@angular/core';
import { PopupLocation, DEFAULT_POPUP_OFFSET } from '@ironsource/fusion-ui/components/popup/common/entities';
import * as i1 from '@ironsource/fusion-ui/components/popup/common/services';
import { isNullOrUndefined } from '@ironsource/fusion-ui/utils';

const _c0 = ["dynamicContent"];
const _c1 = ["popupContainer"];
class PopupBaseComponent {
    set popupData(value) {
        this._popupData = value;
        this.resetPopup();
    }
    get popupData() {
        return this._popupData || {};
    }
    get isOpened() {
        return (this.dynamicContent ||
            (this.popupContainer &&
                (this.popupContainer.nativeElement.innerText ||
                    (this.popupContainer.nativeElement.style.width && this.popupContainer.nativeElement.style.height))));
    }
    get isHostElement() {
        return this.popupData.location === PopupLocation.ElementRelated && !isNullOrUndefined(this.popupData.hostElement);
    }
    get isNativeElement() {
        return isNullOrUndefined(this.popupData.hostElement.nativeElement);
    }
    get elementHostOffset() {
        return this.popupData.hostElementPositionOffset ? this.popupData.hostElementPositionOffset : DEFAULT_POPUP_OFFSET;
    }
    onResize() {
        if (this.isOpened) {
            this._setPosition();
        }
    }
    constructor(renderer, popupService) {
        this.renderer = renderer;
        this.popupService = popupService;
        this.clickedOutside = new EventEmitter();
        this.isOnInit = true;
    }
    ngOnInit() {
        if (!isNullOrUndefined(this.popupData.hostElement) && isNullOrUndefined(this.popupData.location)) {
            this.popupData.location = PopupLocation.ElementRelated;
        }
        this.popupContainer.nativeElement.style.setProperty('--background-color', !!this._popupData && !!this.popupData.backgroundColor ? this.popupData.backgroundColor : 'transparent');
    }
    ngAfterViewInit() {
        this._setPosition();
    }
    _setPosition() {
        let topPosition;
        let leftPosition;
        if (this.isHostElement) {
            const hostEl = !this.isNativeElement ? this.popupData.hostElement.nativeElement : this.popupData.hostElement;
            const popupEl = this.popupContainer.nativeElement;
            const offsetPosition = this.elementHostOffset;
            const hostElClientRect = hostEl.getBoundingClientRect();
            const popupElClientRect = popupEl.getBoundingClientRect();
            topPosition = hostElClientRect.bottom + offsetPosition.top;
            leftPosition = hostElClientRect.left + (hostElClientRect.width - popupElClientRect.width) / 2 + offsetPosition.left;
        }
        if (this.popupData.newInstance) {
            topPosition = this.elementHostOffset.top;
            leftPosition = this.elementHostOffset.left;
        }
        if (!isNullOrUndefined(topPosition) && !isNullOrUndefined(leftPosition)) {
            this.renderer.setStyle(this.popupContainer.nativeElement, 'top', topPosition + 'px');
            this.renderer.setStyle(this.popupContainer.nativeElement, 'left', leftPosition + 'px');
        }
    }
    resetPopup() {
        if (this.isHostElement) {
            this._setPosition();
        }
        else if (this.popupContainer && this.popupContainer.nativeElement) {
            this.renderer.removeStyle(this.popupContainer.nativeElement, 'top');
            this.renderer.removeStyle(this.popupContainer.nativeElement, 'left');
        }
    }
    /**
     * in first detect changes function been invoked so we set it to work only from second and above
     */
    onClickOutside(targetElement) {
        const isSuppressed = !isNullOrUndefined(this.popupData.suppressCloseElementSelector) &&
            (!!targetElement.getAttribute(this.popupData.suppressCloseElementSelector) ||
                !!targetElement.closest(this.popupData.suppressCloseElementSelector));
        if (!this.isOnInit && this.isOpened && !isSuppressed) {
            this.popupService.closePopUp();
            if (!this.popupData.component || this.popupData.newInstance) {
                this.clickedOutside.emit(targetElement);
            }
        }
        this.isOnInit = false;
    }
    static { this.ɵfac = function PopupBaseComponent_Factory(t) { return new (t || PopupBaseComponent)(i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i1.PopupService)); }; }
    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PopupBaseComponent, viewQuery: function PopupBaseComponent_Query(rf, ctx) { if (rf & 1) {
            i0.ɵɵviewQuery(_c0, 5);
            i0.ɵɵviewQuery(_c1, 7);
        } if (rf & 2) {
            let _t;
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.dynamicContent = _t.first);
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.popupContainer = _t.first);
        } }, inputs: { popupData: "popupData" }, outputs: { clickedOutside: "clickedOutside" } }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PopupBaseComponent, [{
        type: Directive
    }], () => [{ type: i0.Renderer2 }, { type: i1.PopupService }], { dynamicContent: [{
            type: ViewChild,
            args: ['dynamicContent']
        }], popupContainer: [{
            type: ViewChild,
            args: ['popupContainer', { static: true }]
        }], popupData: [{
            type: Input
        }], clickedOutside: [{
            type: Output
        }] }); })();

/**
 * Generated bundle index. Do not edit.
 */

export { PopupBaseComponent };
//# sourceMappingURL=ironsource-fusion-ui-components-popup-common-base.mjs.map
