import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/cdk/overlay";
const _c0 = [[["", "trigger", ""]]];
const _c1 = ["[trigger]"];
function CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "div", 6);
    i0.ɵɵtext(2);
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(ctx_r1.title);
} }
function CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_img_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "img", 10);
} if (rf & 2) {
    const item_r4 = i0.ɵɵnextContext().$implicit;
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵpropertyInterpolate1("alt", "", ctx_r1.title, " icon'");
    i0.ɵɵproperty("src", item_r4.iconSrc, i0.ɵɵsanitizeUrl);
} }
function CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_Template(rf, ctx) { if (rf & 1) {
    const _r3 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "li", 7);
    i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_Template_li_click_1_listener() { const item_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); item_r4.actionFn(); return i0.ɵɵresetView(ctx_r1.closeOverlay()); })("keydown.enter", function CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_Template_li_keydown_enter_1_listener() { const item_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); item_r4.actionFn(); return i0.ɵɵresetView(ctx_r1.closeOverlay()); });
    i0.ɵɵtemplate(2, CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_img_2_Template, 1, 3, "img", 8);
    i0.ɵɵelementStart(3, "span", 9);
    i0.ɵɵtext(4);
    i0.ɵɵelementEnd()();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const item_r4 = ctx.$implicit;
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngIf", item_r4.iconSrc);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r4.actionText);
} }
function CaseFileViewOverlayMenuComponent_ng_template_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 3);
    i0.ɵɵtemplate(1, CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_1_Template, 3, 1, "ng-container", 4);
    i0.ɵɵelementStart(2, "ul");
    i0.ɵɵtemplate(3, CaseFileViewOverlayMenuComponent_ng_template_4_ng_container_3_Template, 5, 2, "ng-container", 5);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.title);
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngForOf", ctx_r1.menuItems);
} }
export class CaseFileViewOverlayMenuComponent {
    title = '';
    menuItems;
    isOpen = false;
    isOpenChange = new EventEmitter();
    closeOverlay() {
        const isOpen = false;
        this.isOpen = isOpen;
        this.isOpenChange.emit(isOpen);
    }
    setOpen() {
        this.isOpen = !this.isOpen;
        if (this.isOpen) {
            setTimeout(() => {
                const el = document.querySelector('.overlay-menu__item:first-of-type');
                if (el) {
                    el.focus();
                }
            }, 0);
        }
    }
    static ɵfac = function CaseFileViewOverlayMenuComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseFileViewOverlayMenuComponent)(); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewOverlayMenuComponent, selectors: [["ccd-case-file-view-overlay-menu"]], inputs: { title: "title", menuItems: "menuItems", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngContentSelectors: _c1, decls: 5, vars: 4, consts: [["trigger", "cdkOverlayOrigin"], ["type", "button", "cdkOverlayOrigin", "", 1, "overlay-toggle", 3, "click"], ["cdkConnectedOverlay", "", 3, "backdropClick", "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass"], [1, "overlay-menu"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "overlay-menu__title"], ["tabindex", "0", 1, "overlay-menu__item", 3, "click", "keydown.enter"], ["class", "overlay-menu__itemIcon", 3, "src", "alt", 4, "ngIf"], [1, "overlay-menu__actionText"], [1, "overlay-menu__itemIcon", 3, "src", "alt"]], template: function CaseFileViewOverlayMenuComponent_Template(rf, ctx) { if (rf & 1) {
            const _r1 = i0.ɵɵgetCurrentView();
            i0.ɵɵprojectionDef(_c0);
            i0.ɵɵelementStart(0, "div")(1, "button", 1, 0);
            i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.stopPropagation(); return i0.ɵɵresetView(ctx.setOpen()); });
            i0.ɵɵprojection(3);
            i0.ɵɵelementEnd();
            i0.ɵɵtemplate(4, CaseFileViewOverlayMenuComponent_ng_template_4_Template, 4, 2, "ng-template", 2);
            i0.ɵɵlistener("backdropClick", function CaseFileViewOverlayMenuComponent_Template_ng_template_backdropClick_4_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.closeOverlay()); });
            i0.ɵɵelementEnd();
        } if (rf & 2) {
            const trigger_r5 = i0.ɵɵreference(2);
            i0.ɵɵadvance(4);
            i0.ɵɵproperty("cdkConnectedOverlayOrigin", trigger_r5)("cdkConnectedOverlayOpen", ctx.isOpen)("cdkConnectedOverlayHasBackdrop", true)("cdkConnectedOverlayBackdropClass", "cdk-overlay-transparent-backdrop");
        } }, dependencies: [i1.NgForOf, i1.NgIf, i2.CdkConnectedOverlay, i2.CdkOverlayOrigin], styles: [".overlay-toggle[_ngcontent-%COMP%]{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu[_ngcontent-%COMP%]{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title[_ngcontent-%COMP%], .overlay-menu__item[_ngcontent-%COMP%]{padding:10px;border-bottom:1px solid grey}.overlay-menu__title[_ngcontent-%COMP%]:last-child, .overlay-menu__item[_ngcontent-%COMP%]:last-child{border:none}.overlay-menu__title[_ngcontent-%COMP%]{padding-left:6px;padding-right:6px}.overlay-menu__item[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item[_ngcontent-%COMP%]:hover{background-color:#fff2cc}.overlay-menu__item[_ngcontent-%COMP%]:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon[_ngcontent-%COMP%]{height:1.25em;width:1.25em;margin-right:6px}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewOverlayMenuComponent, [{
        type: Component,
        args: [{ selector: 'ccd-case-file-view-overlay-menu', template: "<div>\n  <button type=\"button\" class=\"overlay-toggle\"\n          (click)=\"$event.stopPropagation(); setOpen()\"\n          cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\n    <ng-content select=\"[trigger]\"></ng-content>\n  </button>\n\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen\"\n    [cdkConnectedOverlayHasBackdrop]=\"true\"\n    [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n    (backdropClick)=\"closeOverlay()\"\n  >\n    <div class=\"overlay-menu\">\n      <ng-container *ngIf=\"title\">\n        <div class=\"overlay-menu__title\">{{title}}</div>\n      </ng-container>\n\n      <ul>\n        <ng-container *ngFor=\"let item of menuItems;\">\n          <li class=\"overlay-menu__item\" tabindex=\"0\" (click)=\"item.actionFn(); closeOverlay();\" (keydown.enter)=\"item.actionFn(); closeOverlay();\">\n            <img *ngIf=\"item.iconSrc\" [src]=\"item.iconSrc\" class=\"overlay-menu__itemIcon\" alt=\"{{title}} icon'\" />\n            <span class=\"overlay-menu__actionText\">{{item.actionText}}</span>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n  </ng-template>\n</div>\n", styles: [".overlay-toggle{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title,.overlay-menu__item{padding:10px;border-bottom:1px solid grey}.overlay-menu__title:last-child,.overlay-menu__item:last-child{border:none}.overlay-menu__title{padding-left:6px;padding-right:6px}.overlay-menu__item{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item:hover{background-color:#fff2cc}.overlay-menu__item:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon{height:1.25em;width:1.25em;margin-right:6px}\n"] }]
    }], null, { title: [{
            type: Input
        }], menuItems: [{
            type: Input
        }], isOpen: [{
            type: Input
        }], isOpenChange: [{
            type: Output
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFileViewOverlayMenuComponent, { className: "CaseFileViewOverlayMenuComponent", filePath: "lib/shared/components/palette/case-file-view/components/shared/case-file-view-overlay-menu/case-file-view-overlay-menu.component.ts", lineNumber: 9 }); })();
//# sourceMappingURL=data:application/json;base64, 