var _zuiPopover, _popoverClose$, _event$, _timeout, _destroy, _checkToDisabledScroll, _destroyScroll, _getPositions, _getBackdropClass, _getPanelClass, _showOverlay;
import { __classPrivateFieldGet, __classPrivateFieldSet } from "tslib";
import { Overlay } from '@angular/cdk/overlay';
import { TemplatePortal } from '@angular/cdk/portal';
import { Directive, ElementRef, Input, ViewContainerRef } from '@angular/core';
import * as $ from 'jquery';
import { fromEvent, Subscription } from 'rxjs';
import { ZuiEventService } from '../../event';
import { ZuiPopoverComponent } from '../index.component';
import { POSITION, POSITION_WITH_CLASS } from './data';
export class ZuiPopoverDirective {
    constructor(elementRef, overlay, viewContainerRef, zuiEventService) {
        this.elementRef = elementRef;
        this.overlay = overlay;
        this.viewContainerRef = viewContainerRef;
        this.zuiEventService = zuiEventService;
        _zuiPopover.set(this, void 0);
        _popoverClose$.set(this, Subscription.EMPTY);
        _event$.set(this, Subscription.EMPTY);
        _timeout.set(this, void 0);
        _destroy.set(this, () => {
            var _a;
            clearTimeout(__classPrivateFieldGet(this, _timeout));
            (_a = this.overlayRef) === null || _a === void 0 ? void 0 : _a.dispose();
            __classPrivateFieldGet(this, _destroyScroll).call(this);
        });
        _checkToDisabledScroll.set(this, () => {
            const { disabledScroll, hasBackdrop } = __classPrivateFieldGet(this, _zuiPopover);
            if (disabledScroll && !hasBackdrop)
                this.zuiEventService.disabledScroll.start();
        });
        _destroyScroll.set(this, () => {
            const { disabledScroll, hasBackdrop } = __classPrivateFieldGet(this, _zuiPopover);
            if (disabledScroll && !hasBackdrop)
                this.zuiEventService.disabledScroll.destroy();
        });
        _getPositions.set(this, () => {
            const { showArrow, placement } = __classPrivateFieldGet(this, _zuiPopover);
            const mapPosition = showArrow ? POSITION_WITH_CLASS : POSITION;
            const topLeft = mapPosition.get('topLeft');
            const topCenter = mapPosition.get('topCenter');
            const topRight = mapPosition.get('topRight');
            let top;
            switch (placement) {
                case 'topLeft':
                    top = [topLeft, topCenter, topRight];
                    break;
                case 'topRight':
                    top = [topRight, topCenter, topLeft];
                    break;
                default:
                    top = [topCenter, topLeft, topRight];
            }
            const bottomLeft = mapPosition.get('bottomLeft');
            const bottomCenter = mapPosition.get('bottomCenter');
            const bottomRight = mapPosition.get('bottomRight');
            let bottom;
            switch (placement) {
                case 'bottomLeft':
                    bottom = [bottomLeft, bottomCenter, bottomRight];
                    break;
                case 'bottomRight':
                    bottom = [bottomRight, bottomCenter, bottomLeft];
                    break;
                default:
                    bottom = [bottomCenter, bottomLeft, bottomRight];
            }
            const leftTop = mapPosition.get('leftTop');
            const leftCenter = mapPosition.get('leftCenter');
            const leftBottom = mapPosition.get('leftBottom');
            let left;
            switch (placement) {
                case 'leftTop':
                    left = [leftTop, leftCenter, leftBottom];
                    break;
                case 'leftBottom':
                    left = [leftBottom, leftCenter, leftTop];
                    break;
                default:
                    left = [leftCenter, leftTop, leftBottom];
            }
            const rightTop = mapPosition.get('rightTop');
            const rightCenter = mapPosition.get('rightCenter');
            const rightBottom = mapPosition.get('rightBottom');
            let right;
            switch (placement) {
                case 'rightTop':
                    right = [rightTop, rightCenter, rightBottom];
                    break;
                case 'rightBottom':
                    right = [rightBottom, rightCenter, rightTop];
                    break;
                default:
                    right = [rightCenter, rightTop, rightBottom];
            }
            switch (placement) {
                case 'topLeft':
                case 'topCenter':
                case 'topRight':
                    return [...top, ...bottom, ...left, ...right];
                case 'leftTop':
                case 'leftCenter':
                case 'leftBottom':
                    return [...left, ...right, ...bottom, ...top];
                case 'rightTop':
                case 'rightCenter':
                case 'rightBottom':
                    return [...right, ...left, ...bottom, ...top];
                default:
                    return [...bottom, ...top, ...left, ...right];
            }
        });
        _getBackdropClass.set(this, () => {
            const { showBackdropShadow } = __classPrivateFieldGet(this, _zuiPopover);
            let { backdropClass: bgClass } = __classPrivateFieldGet(this, _zuiPopover);
            const addClass = showBackdropShadow ? [] : ['cdk-overlay-transparent-backdrop'];
            if (Array.isArray(bgClass)) {
                bgClass = [...addClass, ...bgClass];
            }
            else {
                bgClass = [...addClass, bgClass];
            }
            const backdropClass = bgClass.filter(Boolean);
            return backdropClass.length ? backdropClass : null;
        });
        _getPanelClass.set(this, () => {
            const { panelClass } = __classPrivateFieldGet(this, _zuiPopover);
            const defaultClass = ['d-block', 'zui-popover__max-width'];
            return Array.isArray(panelClass) ? [...defaultClass, ...panelClass] : [...defaultClass, panelClass];
        });
        _showOverlay.set(this, () => {
            const { hasBackdrop } = __classPrivateFieldGet(this, _zuiPopover);
            const positions = __classPrivateFieldGet(this, _getPositions).call(this);
            const backdropClass = __classPrivateFieldGet(this, _getBackdropClass).call(this);
            const panelClass = __classPrivateFieldGet(this, _getPanelClass).call(this);
            this.overlayRef = this.overlay.create(Object.assign(Object.assign({ hasBackdrop }, (backdropClass && { backdropClass })), { panelClass, scrollStrategy: this.overlay.scrollStrategies.block(), positionStrategy: this.overlay.position().flexibleConnectedTo(this.elementRef.nativeElement).withPositions(positions) }));
            this.overlayRef.attach(new TemplatePortal(__classPrivateFieldGet(this, _zuiPopover).templateRef, this.viewContainerRef, {
                data: this.popoverData,
            }));
            this.overlayRef.backdropClick().subscribe(() => {
                __classPrivateFieldGet(this, _destroy).call(this);
                this.overlayRef.detach();
            });
        });
    }
    get popover() {
        return __classPrivateFieldGet(this, _zuiPopover);
    }
    set popover(zuiPopover) {
        if (!zuiPopover || zuiPopover === __classPrivateFieldGet(this, _zuiPopover)) {
            return;
        }
        __classPrivateFieldSet(this, _zuiPopover, zuiPopover);
        __classPrivateFieldGet(this, _popoverClose$).unsubscribe();
        __classPrivateFieldSet(this, _popoverClose$, zuiPopover.closed.subscribe(__classPrivateFieldGet(this, _destroy)));
    }
    ngAfterViewInit() {
        var _a, _b;
        (_b = (_a = __classPrivateFieldGet(this, _zuiPopover)) === null || _a === void 0 ? void 0 : _a.optionChange) === null || _b === void 0 ? void 0 : _b.subscribe(() => {
            const nativeElement = this.elementRef.nativeElement;
            const { showPointer, trigger, hasBackdrop, opened, closed, maxWidth } = __classPrivateFieldGet(this, _zuiPopover);
            const startEvent = trigger === 'hover' ? 'mouseenter' : 'click';
            const subscription = new Subscription().add(fromEvent(nativeElement, startEvent).subscribe(() => {
                __classPrivateFieldGet(this, _destroy).call(this);
                __classPrivateFieldGet(this, _showOverlay).call(this);
                __classPrivateFieldGet(this, _checkToDisabledScroll).call(this);
                if (opened)
                    opened.emit(this.popoverData);
                $('body')
                    .css('--zp_3c296368_width', `${nativeElement.clientWidth / 2 - 10}px`)
                    .css('--zp_3c296368_height', `${nativeElement.clientHeight / 2 - 10}px`)
                    .css('--zp_3c296368_panel_max-width', maxWidth);
            }));
            if (showPointer)
                nativeElement.classList.add('zui-pointer');
            if (!hasBackdrop)
                subscription.add(fromEvent(nativeElement, 'mouseleave').subscribe(() => {
                    __classPrivateFieldSet(this, _timeout, setTimeout(() => {
                        if (__classPrivateFieldGet(this, _zuiPopover).isLeave)
                            closed.emit();
                    }));
                }));
            __classPrivateFieldGet(this, _event$).unsubscribe();
            __classPrivateFieldSet(this, _event$, subscription);
        });
    }
    ngOnDestroy() {
        __classPrivateFieldGet(this, _event$).unsubscribe();
        __classPrivateFieldGet(this, _destroy).call(this);
    }
}
_zuiPopover = new WeakMap(), _popoverClose$ = new WeakMap(), _event$ = new WeakMap(), _timeout = new WeakMap(), _destroy = new WeakMap(), _checkToDisabledScroll = new WeakMap(), _destroyScroll = new WeakMap(), _getPositions = new WeakMap(), _getBackdropClass = new WeakMap(), _getPanelClass = new WeakMap(), _showOverlay = new WeakMap();
ZuiPopoverDirective.decorators = [
    { type: Directive, args: [{ selector: '[zuiPopover]' },] }
];
ZuiPopoverDirective.ctorParameters = () => [
    { type: ElementRef },
    { type: Overlay },
    { type: ViewContainerRef },
    { type: ZuiEventService }
];
ZuiPopoverDirective.propDecorators = {
    popover: [{ type: Input, args: ['zuiPopover',] }],
    popoverData: [{ type: Input, args: ['zuiPopoverData',] }]
};
//# sourceMappingURL=zui-popover.directive.js.map