/**
 * al-select
 *
 * @author Rob Parker <robert.parker@alertlogic.com>
 *
 * @copyright Alert Logic, Inc 2021
 *
 */
import { Component, Input, Output, EventEmitter, ElementRef } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "../al-input/al-input.component";
import * as i3 from "../al-checkbox/al-checkbox.component";
function AlMultiSelectComponent_span_6_i_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "i", 14);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const item_r4 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵproperty("ngClass", item_r4.data.icon.iconClass ? item_r4.data.icon.iconClass : "material-icons");
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(item_r4.data.icon.icon);
} }
function AlMultiSelectComponent_span_6_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 12);
    i0.ɵɵtemplate(1, AlMultiSelectComponent_span_6_i_1_Template, 2, 2, "i", 13);
    i0.ɵɵtext(2);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const item_r4 = ctx.$implicit;
    const isLast_r5 = ctx.last;
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", item_r4.data);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", !isLast_r5 ? item_r4.label + "," : item_r4.label, " ");
} }
function AlMultiSelectComponent_span_7_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span");
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(ctx_r1.default);
} }
function AlMultiSelectComponent_div_12_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 15);
    i0.ɵɵelement(1, "al2-input", 16);
    i0.ɵɵelementEnd();
} }
const _c0 = function (a0) { return { "hover:bg-smokeblue-100 cursor-pointer": a0 }; };
function AlMultiSelectComponent_div_15_Template(rf, ctx) { if (rf & 1) {
    const _r10 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 17);
    i0.ɵɵelementStart(1, "al2-checkbox", 18);
    i0.ɵɵlistener("checkboxChange", function AlMultiSelectComponent_div_15_Template_al2_checkbox_checkboxChange_1_listener($event) { i0.ɵɵrestoreView(_r10); const item_r8 = ctx.$implicit; const ctx_r9 = i0.ɵɵnextContext(); return ctx_r9.multiselectOption($event, item_r8); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const item_r8 = ctx.$implicit;
    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0, !item_r8.items));
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("label", item_r8.label)("checked", item_r8.selected);
} }
export class AlMultiSelectComponent {
    constructor(eref) {
        this.eref = eref;
        this.label = '';
        this.default = 'Select Options';
        this.options = [];
        this.inputModel = [];
        this.search = true;
        this.itemSelected = new EventEmitter();
        this.searchText = '';
        this.optionsVisible = false;
    }
    ngOnInit() {
    }
    clickOut(event) {
        if (!this.eref.nativeElement.contains(event.target)) {
            this.optionsVisible = false;
        }
    }
    closeOptions() {
        this.optionsVisible = !this.optionsVisible;
    }
    multiselectOption(checked, option) {
        // make the option selected = to the checkbox state
        option.selected = checked;
        // reset the input model
        this.inputModel = [];
        // add only the selected things to the inputmodel
        this.options.forEach(element => {
            if (element.selected) {
                this.inputModel.push(element);
            }
        });
    }
}
/** @nocollapse */ AlMultiSelectComponent.ɵfac = function AlMultiSelectComponent_Factory(t) { return new (t || AlMultiSelectComponent)(i0.ɵɵdirectiveInject(i0.ElementRef)); };
/** @nocollapse */ AlMultiSelectComponent.ɵcmp = i0.ɵɵdefineComponent({ type: AlMultiSelectComponent, selectors: [["al2-multiselect"]], hostBindings: function AlMultiSelectComponent_HostBindings(rf, ctx) { if (rf & 1) {
        i0.ɵɵlistener("click", function AlMultiSelectComponent_click_HostBindingHandler($event) { return ctx.clickOut($event); }, false, i0.ɵɵresolveDocument);
    } }, inputs: { label: "label", default: "default", options: "options", inputModel: "inputModel", search: "search" }, outputs: { itemSelected: "itemSelected" }, decls: 16, vars: 6, consts: [[1, "cursor-pointer", "relative"], [3, "click"], [1, "flex", "justify-between", "shadow-inner-bottom-gray-100"], ["class", "inline", 4, "ngFor", "ngForOf"], [4, "ngIf"], [1, "material-icons"], [1, "relative", 3, "hidden"], [1, "origin-top-left", "left-0", "right-0", "z-50", "bg-white", "border", "border-gray-100", "rounded-sm", "shadow-sm", "absolute"], ["class", "px-1 mt-2", 4, "ngIf"], [1, ""], [1, "divide-y", "divide-gray-100", "my-1", "overflow-scroll", 2, "max-height", "200px"], ["class", "py-1 px-2", 3, "ngClass", 4, "ngFor", "ngForOf"], [1, "inline"], ["class", "mr-1 text-base", 3, "ngClass", 4, "ngIf"], [1, "mr-1", "text-base", 3, "ngClass"], [1, "px-1", "mt-2"], ["placeholder", "search", "icon", "search"], [1, "py-1", "px-2", 3, "ngClass"], [3, "label", "checked", "checkboxChange"]], template: function AlMultiSelectComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵelementStart(0, "div", 0);
        i0.ɵɵelementStart(1, "div", 1);
        i0.ɵɵlistener("click", function AlMultiSelectComponent_Template_div_click_1_listener() { return ctx.optionsVisible = !ctx.optionsVisible; });
        i0.ɵɵelementStart(2, "label");
        i0.ɵɵtext(3);
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(4, "div", 2);
        i0.ɵɵelementStart(5, "div");
        i0.ɵɵtemplate(6, AlMultiSelectComponent_span_6_Template, 3, 2, "span", 3);
        i0.ɵɵtemplate(7, AlMultiSelectComponent_span_7_Template, 2, 1, "span", 4);
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(8, "i", 5);
        i0.ɵɵtext(9, "arrow_drop_down");
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(10, "div", 6);
        i0.ɵɵelementStart(11, "div", 7);
        i0.ɵɵtemplate(12, AlMultiSelectComponent_div_12_Template, 2, 0, "div", 8);
        i0.ɵɵelementStart(13, "div", 9);
        i0.ɵɵelementStart(14, "div", 10);
        i0.ɵɵtemplate(15, AlMultiSelectComponent_div_15_Template, 2, 5, "div", 11);
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
    } if (rf & 2) {
        i0.ɵɵadvance(3);
        i0.ɵɵtextInterpolate(ctx.label);
        i0.ɵɵadvance(3);
        i0.ɵɵproperty("ngForOf", ctx.inputModel);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", !ctx.inputModel);
        i0.ɵɵadvance(3);
        i0.ɵɵproperty("hidden", !ctx.optionsVisible);
        i0.ɵɵadvance(2);
        i0.ɵɵproperty("ngIf", ctx.search);
        i0.ɵɵadvance(3);
        i0.ɵɵproperty("ngForOf", ctx.options);
    } }, directives: [i1.NgForOf, i1.NgIf, i1.NgClass, i2.AlInputComponent, i3.AlChkboxComponent], encapsulation: 2 });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(AlMultiSelectComponent, [{
        type: Component,
        args: [{
                selector: 'al2-multiselect',
                templateUrl: './al-multiselect.component.html',
                host: {
                    '(document:click)': 'clickOut($event)'
                }
            }]
    }], function () { return [{ type: i0.ElementRef }]; }, { label: [{
            type: Input
        }], default: [{
            type: Input
        }], options: [{
            type: Input
        }], inputModel: [{
            type: Input
        }], search: [{
            type: Input
        }], itemSelected: [{
            type: Output
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 