import { Directive, EventEmitter, HostListener, Input, Output, } from '@angular/core';
import { TemplatePortal } from '@angular/cdk/portal';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { debounceTime, fromEvent } from 'rxjs';
import * as i0 from "@angular/core";
import * as i1 from "@angular/cdk/overlay";
export class OverlayDirective {
    constructor(overlay, elementRef, viewContainerRef, destroyRef) {
        this.overlay = overlay;
        this.elementRef = elementRef;
        this.viewContainerRef = viewContainerRef;
        this.destroyRef = destroyRef;
        this.verticalPositions = {
            bottomStart: {
                originX: 'start',
                originY: 'bottom',
                overlayX: 'start',
                overlayY: 'top',
                panelClass: 'vertical-overlay',
            },
            topStart: {
                originX: 'start',
                originY: 'top',
                overlayX: 'start',
                overlayY: 'bottom',
                panelClass: 'vertical-overlay',
            },
            bottomEnd: {
                originX: 'end',
                originY: 'bottom',
                overlayX: 'end',
                overlayY: 'top',
                panelClass: 'vertical-overlay',
            },
            topEnd: {
                originX: 'end',
                originY: 'top',
                overlayX: 'end',
                overlayY: 'bottom',
                panelClass: 'vertical-overlay',
            },
        };
        this.horizontalPositions = {
            bottomStart: {
                originX: 'end',
                originY: 'bottom',
                overlayX: 'start',
                overlayY: 'bottom',
                offsetY: 7,
            },
            topStart: {
                originX: 'start',
                originY: 'bottom',
                overlayX: 'end',
                overlayY: 'bottom',
            },
        };
        this.overlayRef = null;
        this.position = 'horizontal';
        this.closeOnClick = false;
        this.opened = new EventEmitter();
        this.closed = new EventEmitter();
    }
    show() {
        this.openDropdown();
        this.opened.emit();
    }
    openDropdown() {
        if (!this.overlayRef) {
            this.overlayRef = this.overlay.create({
                positionStrategy: this.getOverlayPosition(),
            });
            this.overlayRef
                .outsidePointerEvents()
                .pipe(takeUntilDestroyed(this.destroyRef), debounceTime(100))
                .subscribe(() => {
                this.closeDropdown();
                this.closed.emit();
            });
            fromEvent(this.overlayRef.hostElement, 'click')
                .pipe(takeUntilDestroyed(this.destroyRef))
                .subscribe(() => {
                if (this.closeOnClick)
                    this.closeDropdown();
            });
        }
        if (this.contentTemplate && !this.overlayRef.hasAttached()) {
            const portal = new TemplatePortal(this.contentTemplate, this.viewContainerRef);
            this.overlayRef.attach(portal);
        }
    }
    closeDropdown() {
        if (this.overlayRef?.hasAttached()) {
            this.overlayRef.detach();
        }
    }
    getOverlayPosition() {
        const positions = this.position === 'horizontal' ? this.horizontalPositions : this.verticalPositions;
        return this.overlay
            .position()
            .flexibleConnectedTo(this.elementRef)
            .withPositions(Object.keys(positions).map(positionKey => positions[positionKey]));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OverlayDirective, deps: [{ token: i1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: OverlayDirective, isStandalone: true, selector: "[ctOverlay]", inputs: { contentTemplate: ["ctOverlay", "contentTemplate"], position: ["ctOverlayPosition", "position"], closeOnClick: ["ctOverlayCloseOnClick", "closeOnClick"] }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "click": "show()" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OverlayDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ctOverlay]',
                    standalone: true,
                }]
        }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.DestroyRef }], propDecorators: { contentTemplate: [{
                type: Input,
                args: ['ctOverlay']
            }], position: [{
                type: Input,
                args: ['ctOverlayPosition']
            }], closeOnClick: [{
                type: Input,
                args: ['ctOverlayCloseOnClick']
            }], opened: [{
                type: Output
            }], closed: [{
                type: Output
            }], show: [{
                type: HostListener,
                args: ['click']
            }] } });
//# sourceMappingURL=data:application/json;base64,[encoded data, 9300 characters]