import { Component, ContentChild, EventEmitter, Input, Output, TemplateRef, ViewChild } from '@angular/core';
import { ZuiB } from '@material-zui/core';
import { BehaviorSubject } from 'rxjs';
import { ZuiPopoverGetDataDirective } from './directive/zui-popover-get-data.directive';
export class ZuiPopoverV3Component {
    constructor() {
        /**
         * @default bottomCenter
         */
        this.placement = 'bottomCenter';
        /**
         * @default hover
         */
        this.trigger = 'hover';
        /**
         * @default 50%
         */
        this.maxWidth = '50%';
        this.hasBackdrop = false;
        this.showBackdropShadow = false;
        this.showPanelShadow = true;
        this.showArrow = true;
        this.showPointer = false;
        this.disabledScroll = true;
        this.opened = new EventEmitter();
        this.closed = new EventEmitter();
        this.isLeave = true;
        this.optionChange = new BehaviorSubject(null);
        this.mouseleave = () => {
            this.isLeave = true;
            if (!this.hasBackdrop)
                this.closed.emit();
        };
        this.mouseenter = () => {
            this.isLeave = false;
        };
    }
    /**
     * @default false
     */
    set setBackdrop(val) {
        this.hasBackdrop = ZuiB.toBool(val);
    }
    /**
     * @default false
     */
    set setBackdropShadow(val) {
        this.showBackdropShadow = ZuiB.toBool(val);
    }
    /**
     * @default true
     */
    set hidePanelShadow(val) {
        this.showPanelShadow = ZuiB.toBoolReverse(val);
    }
    /**
     * @default true
     */
    set hideArrow(val) {
        this.showArrow = ZuiB.toBoolReverse(val);
    }
    /**
     * @default false
     */
    set pointer(val) {
        this.showPointer = ZuiB.toBool(val);
    }
    /**
     * @default true
     */
    set allowScroll(val) {
        this.disabledScroll = ZuiB.toBoolReverse(val);
    }
    ngOnChanges() {
        this.optionChange.next();
    }
    ngOnDestroy() {
        this.opened.complete();
        this.closed.complete();
    }
}
ZuiPopoverV3Component.decorators = [
    { type: Component, args: [{
                selector: 'zui-popover-v3',
                template: "<ng-template let-data=\"data\" #templateRef>\n  <div (mouseenter)=\"mouseenter($event)\" (mouseleave)=\"mouseleave($event)\" class=\"zui-popover__container\">\n    <div class=\"zui-popover__panel\" [class.mat-elevation-z8]=\"showPanelShadow\">\n      <div class=\"zui-popover__content\" [ngStyle]=\"{maxHeight: maxHeight}\">\n        <ng-container *ngIf=\"zuiPopoverGetData?.templateRef\">\n          <ng-container *ngTemplateOutlet=\"zuiPopoverGetData.templateRef; context: {data: data}\"></ng-container>\n        </ng-container>\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>\n",
                styles: [".zui-popover__container{height:100%}.zui-popover__panel{position:relative;background-color:#fff}.zui-popover__content{overflow-y:auto}::ng-deep .zui-popover__max-width{max-width:var(--zp_3c296368_panel_max-width)}::ng-deep .zui-popover__top-left .zui-popover__container{padding-bottom:10px}::ng-deep .zui-popover__top-left .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;bottom:-10px;border-top:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;left:var(--zp_3c296368_width)}::ng-deep .zui-popover__top-center .zui-popover__container{padding-bottom:10px}::ng-deep .zui-popover__top-center .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;bottom:-10px;border-top:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;left:calc(50% - 10px)}::ng-deep .zui-popover__top-right .zui-popover__container{padding-bottom:10px}::ng-deep .zui-popover__top-right .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;bottom:-10px;border-top:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;right:var(--zp_3c296368_width)}::ng-deep .zui-popover__bottom-left .zui-popover__container{padding-top:10px}::ng-deep .zui-popover__bottom-left .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;top:-10px;border-bottom:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;left:var(--zp_3c296368_width)}::ng-deep .zui-popover__bottom-center .zui-popover__container{padding-top:10px}::ng-deep .zui-popover__bottom-center .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;top:-10px;border-bottom:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;left:calc(50% - 10px)}::ng-deep .zui-popover__bottom-right .zui-popover__container{padding-top:10px}::ng-deep .zui-popover__bottom-right .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;top:-10px;border-bottom:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent;right:var(--zp_3c296368_width)}::ng-deep .zui-popover__left-top .zui-popover__container{padding-right:10px}::ng-deep .zui-popover__left-top .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;right:-10px;border-left:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;top:var(--zp_3c296368_height)}::ng-deep .zui-popover__left-center .zui-popover__container{padding-right:10px}::ng-deep .zui-popover__left-center .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;right:-10px;border-left:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;top:calc(50% - 10px)}::ng-deep .zui-popover__left-bottom .zui-popover__container{padding-right:10px}::ng-deep .zui-popover__left-bottom .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;right:-10px;border-left:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;bottom:var(--zp_3c296368_height)}::ng-deep .zui-popover__right-top .zui-popover__container{padding-left:10px}::ng-deep .zui-popover__right-top .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;left:-10px;border-right:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;top:var(--zp_3c296368_height)}::ng-deep .zui-popover__right-center .zui-popover__container{padding-left:10px}::ng-deep .zui-popover__right-center .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;left:-10px;border-right:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;top:calc(50% - 10px)}::ng-deep .zui-popover__right-bottom .zui-popover__container{padding-left:10px}::ng-deep .zui-popover__right-bottom .zui-popover__container .zui-popover__panel:before{content:\"\";position:absolute;left:-10px;border-right:10px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;bottom:var(--zp_3c296368_height)}"]
            },] }
];
ZuiPopoverV3Component.propDecorators = {
    placement: [{ type: Input }],
    trigger: [{ type: Input }],
    panelClass: [{ type: Input }],
    backdropClass: [{ type: Input }],
    maxWidth: [{ type: Input }],
    maxHeight: [{ type: Input }],
    setBackdrop: [{ type: Input, args: ['hasBackdrop',] }],
    setBackdropShadow: [{ type: Input, args: ['showBackdropShadow',] }],
    hidePanelShadow: [{ type: Input }],
    hideArrow: [{ type: Input }],
    pointer: [{ type: Input }],
    allowScroll: [{ type: Input }],
    opened: [{ type: Output }],
    closed: [{ type: Output }],
    templateRef: [{ type: ViewChild, args: ['templateRef',] }],
    zuiPopoverGetData: [{ type: ContentChild, args: [ZuiPopoverGetDataDirective,] }]
};
//# sourceMappingURL=index.component.js.map