/**
 * An enhanced version of the primeng multiselect but with list.
 *
 * @author Gisler Garces <ggarces@alertlogic.com>
 * @author Fábio Miranda <fmiranda@alertlogic.com>
 * @author Andres Echeverri <andres.echeverri@alertlogic.com>
 * @copyright 2020 Alert Logic, Inc.
 */
import { Component, EventEmitter, Input, Optional, Output, Self, ViewChild } from '@angular/core';
import { NgControl, } from '@angular/forms';
import { MultiSelect } from 'primeng-lts/multiselect';
import { AlSelectableListComponent } from "../al-selectable-list/al-selectable-list.component";
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "primeng-lts/multiselect";
import * as i3 from "primeng-lts/api";
import * as i4 from "@angular/common";
import * as i5 from "../al-selectable-list/al-selectable-list.component";
import * as i6 from "../al-selectable-chips/al-selectable-chips.component";
function AlMultiSelectListComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 4);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(ctx_r0.placeholder);
} }
function AlMultiSelectListComponent_ng_template_2_div_0_i_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "i", 12);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_0_i_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i", 13);
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵproperty("ngClass", item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 7);
    i0.ɵɵelementStart(1, "div", 8);
    i0.ɵɵelementStart(2, "div", 9);
    i0.ɵɵtemplate(3, AlMultiSelectListComponent_ng_template_2_div_0_i_3_Template, 2, 1, "i", 10);
    i0.ɵɵtemplate(4, AlMultiSelectListComponent_ng_template_2_div_0_i_4_Template, 1, 1, "i", 11);
    i0.ɵɵtext(5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(3);
    i0.ɵɵproperty("ngIf", item_r5.isMaterialIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !item_r5.isMaterialIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", item_r5.title, " ");
} }
function AlMultiSelectListComponent_ng_template_2_div_1_i_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "i", 12);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_1_i_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i", 13);
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵproperty("ngClass", item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 14);
    i0.ɵɵelementStart(1, "div", 8);
    i0.ɵɵelementStart(2, "div", 9);
    i0.ɵɵtemplate(3, AlMultiSelectListComponent_ng_template_2_div_1_i_3_Template, 2, 1, "i", 10);
    i0.ɵɵtemplate(4, AlMultiSelectListComponent_ng_template_2_div_1_i_4_Template, 1, 1, "i", 11);
    i0.ɵɵtext(5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(6, "div", 15);
    i0.ɵɵelementStart(7, "strong");
    i0.ɵɵtext(8);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(3);
    i0.ɵɵproperty("ngIf", item_r5.isMaterialIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !item_r5.isMaterialIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", item_r5.title, " ");
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate(item_r5.subtitle);
} }
function AlMultiSelectListComponent_ng_template_2_div_2_i_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "i", 12);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_2_i_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i", 13);
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵproperty("ngClass", item_r5.icon);
} }
function AlMultiSelectListComponent_ng_template_2_div_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 14);
    i0.ɵɵelementStart(1, "div", 16);
    i0.ɵɵelementStart(2, "div", 9);
    i0.ɵɵtemplate(3, AlMultiSelectListComponent_ng_template_2_div_2_i_3_Template, 2, 1, "i", 10);
    i0.ɵɵtemplate(4, AlMultiSelectListComponent_ng_template_2_div_2_i_4_Template, 1, 1, "i", 11);
    i0.ɵɵelementStart(5, "b");
    i0.ɵɵtext(6);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(7, "div", 15);
    i0.ɵɵtext(8);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var item_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(3);
    i0.ɵɵproperty("ngIf", item_r5.isMaterialIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !item_r5.isMaterialIcon);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r5.title);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r5.subtitle);
} }
function AlMultiSelectListComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, AlMultiSelectListComponent_ng_template_2_div_0_Template, 6, 3, "div", 5);
    i0.ɵɵtemplate(1, AlMultiSelectListComponent_ng_template_2_div_1_Template, 9, 4, "div", 6);
    i0.ɵɵtemplate(2, AlMultiSelectListComponent_ng_template_2_div_2_Template, 9, 4, "div", 6);
} if (rf & 2) {
    var item_r5 = ctx.$implicit;
    var ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵproperty("ngIf", !item_r5.subtitle);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", item_r5.subtitle && !ctx_r1.inline);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", item_r5.subtitle && ctx_r1.inline);
} }
function AlMultiSelectListComponent_al_selectable_list_3_Template(rf, ctx) { if (rf & 1) {
    var _r25 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "al-selectable-list", 17);
    i0.ɵɵlistener("onSelectionChanged", function AlMultiSelectListComponent_al_selectable_list_3_Template_al_selectable_list_onSelectionChanged_0_listener($event) { i0.ɵɵrestoreView(_r25); var ctx_r24 = i0.ɵɵnextContext(); return ctx_r24.changeValue($event); });
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵproperty("options", ctx_r2.value)("readonly", ctx_r2.readonly);
} }
function AlMultiSelectListComponent_al_selectable_chips_4_Template(rf, ctx) { if (rf & 1) {
    var _r27 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "al-selectable-chips", 17);
    i0.ɵɵlistener("onSelectionChanged", function AlMultiSelectListComponent_al_selectable_chips_4_Template_al_selectable_chips_onSelectionChanged_0_listener($event) { i0.ɵɵrestoreView(_r27); var ctx_r26 = i0.ɵɵnextContext(); return ctx_r26.onChangeFn($event); });
    i0.ɵɵelementEnd();
} if (rf & 2) {
    var ctx_r3 = i0.ɵɵnextContext();
    i0.ɵɵproperty("options", ctx_r3.value)("readonly", ctx_r3.readonly);
} }
var AlMultiSelectListComponent = /** @class */ (function () {
    function AlMultiSelectListComponent(control) {
        this.control = control;
        // The default label placeholder to display on the dropdown selector
        this.placeholder = 'Choose';
        // The options to be displayed on the dropdown menu list
        this.options = [];
        // Read only mode
        this.readonly = false;
        // This tells the component how to render the selected options.
        this.selectableListMode = 'list';
        // Whether the filter should be displayed
        this.filter = true;
        // Whether the details should be displayed in the same line as the title
        this.inline = false;
        // Emitter which emits the selected items
        this.onSelectionChanged = new EventEmitter();
        this.onChangeFn = function (value) {
            // empty intentional
        };
        this.onTouchFn = function () {
            // empty intentional
        };
        this.control && (this.control.valueAccessor = this);
    }
    AlMultiSelectListComponent.prototype.ngOnInit = function () {
        function newGetVisible() {
            // @ts-ignore
            return this.visibleOptions || this.options;
        }
        var newGetVisibleOptions = (newGetVisible).bind(this.primeMultiSelect);
        this.primeMultiSelect.getVisibleOptions = newGetVisibleOptions;
    };
    /**
     * Function which triggers when an item is selected from the dropdown list
     * @param event The prime-ng event with the selected items and the last changed item
     **/
    AlMultiSelectListComponent.prototype.selectOption = function (event) {
        var _this = this;
        var selectedOptions = event.value;
        var changedItem = event.itemValue;
        if (changedItem && Array.isArray(this.options)) {
            // idk why it has to have any, i suspect its the type union of AlSelectItem | AlChipItem -jst
            var found = this.options.find(function (o) { return o.value === changedItem; });
            if (!found) {
                if ('checked' in found.value) {
                    (found.value).checked = false;
                }
            }
        }
        this.changeValue(selectedOptions);
        if (this.selectableListMode === 'list') {
            this.selectableList.allChecked = true;
            // have to set timeout so the selectable list can get the new values injested
            setTimeout(function () {
                _this.selectableList.toggleCheckAll();
            }, 1);
        }
    };
    AlMultiSelectListComponent.prototype.changeValue = function (selectedOptions) {
        this.onChangeFn(this.value);
        this.onSelectionChanged.emit(selectedOptions);
    };
    AlMultiSelectListComponent.prototype.writeValue = function (value) {
        if (value) {
            this.value = value || null;
        }
        else {
            this.value = null;
        }
    };
    AlMultiSelectListComponent.prototype.registerOnChange = function (fn) {
        this.onChangeFn = fn;
    };
    AlMultiSelectListComponent.prototype.registerOnTouched = function (fn) {
        this.onTouchFn = fn;
    };
    AlMultiSelectListComponent.prototype.setDisabledState = function (isDisabled) {
        this.isDisabled = isDisabled;
    };
    Object.defineProperty(AlMultiSelectListComponent.prototype, "invalid", {
        get: function () {
            return this.control ? !!this.control.invalid : false;
        },
        enumerable: true,
        configurable: true
    });
    /** @nocollapse */ AlMultiSelectListComponent.ɵfac = function AlMultiSelectListComponent_Factory(t) { return new (t || AlMultiSelectListComponent)(i0.ɵɵdirectiveInject(i1.NgControl, 10)); };
    /** @nocollapse */ AlMultiSelectListComponent.ɵcmp = i0.ɵɵdefineComponent({ type: AlMultiSelectListComponent, selectors: [["al-multiselect-list"]], viewQuery: function AlMultiSelectListComponent_Query(rf, ctx) { if (rf & 1) {
            i0.ɵɵstaticViewQuery(MultiSelect, true);
            i0.ɵɵviewQuery(AlSelectableListComponent, true);
        } if (rf & 2) {
            var _t;
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.primeMultiSelect = _t.first);
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.selectableList = _t.first);
        } }, inputs: { placeholder: "placeholder", options: "options", readonly: "readonly", selectableListMode: "selectableListMode", filter: "filter", inline: "inline" }, outputs: { onSelectionChanged: "onSelectionChanged" }, decls: 5, vars: 9, consts: [["itemSize", "50", "filterBy", "value.details,title,value.title,value.subtitle", "appendTo", "body", 3, "defaultLabel", "options", "disabled", "virtualScroll", "readonly", "filter", "ngModel", "ngModelChange", "onChange", "onFocus", "onBlur"], ["pTemplate", "selectedItems"], ["pTemplate", "item"], [3, "options", "readonly", "onSelectionChanged", 4, "ngIf"], [1, "ui-multiselected-empty-token", "ui-corner-all"], ["class", "option-container", 4, "ngIf"], ["class", "option-container-details", 4, "ngIf"], [1, "option-container"], [1, "option-inner-container"], [1, "option-label"], ["class", "material-icons font-size-material-icons", 4, "ngIf"], [3, "ngClass", 4, "ngIf"], [1, "material-icons", "font-size-material-icons"], [3, "ngClass"], [1, "option-container-details"], [1, "option-details"], [1, "option-inner-container-inline"], [3, "options", "readonly", "onSelectionChanged"]], template: function AlMultiSelectListComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "p-multiSelect", 0);
            i0.ɵɵlistener("ngModelChange", function AlMultiSelectListComponent_Template_p_multiSelect_ngModelChange_0_listener($event) { return ctx.value = $event; })("onChange", function AlMultiSelectListComponent_Template_p_multiSelect_onChange_0_listener($event) { return ctx.selectOption($event); })("onFocus", function AlMultiSelectListComponent_Template_p_multiSelect_onFocus_0_listener() { return ctx.onTouchFn(); })("onBlur", function AlMultiSelectListComponent_Template_p_multiSelect_onBlur_0_listener() { return ctx.onTouchFn(); });
            i0.ɵɵtemplate(1, AlMultiSelectListComponent_ng_template_1_Template, 2, 1, "ng-template", 1);
            i0.ɵɵtemplate(2, AlMultiSelectListComponent_ng_template_2_Template, 3, 3, "ng-template", 2);
            i0.ɵɵelementEnd();
            i0.ɵɵtemplate(3, AlMultiSelectListComponent_al_selectable_list_3_Template, 1, 2, "al-selectable-list", 3);
            i0.ɵɵtemplate(4, AlMultiSelectListComponent_al_selectable_chips_4_Template, 1, 2, "al-selectable-chips", 3);
        } if (rf & 2) {
            i0.ɵɵproperty("defaultLabel", ctx.placeholder)("options", ctx.options)("disabled", ctx.isDisabled)("virtualScroll", true)("readonly", ctx.readonly)("filter", ctx.filter)("ngModel", ctx.value);
            i0.ɵɵadvance(3);
            i0.ɵɵproperty("ngIf", ctx.selectableListMode === "list");
            i0.ɵɵadvance(1);
            i0.ɵɵproperty("ngIf", ctx.selectableListMode === "chips");
        } }, directives: [i2.MultiSelect, i1.NgControlStatus, i1.NgModel, i3.PrimeTemplate, i4.NgIf, i4.NgClass, i5.AlSelectableListComponent, i6.AlSelectableChipsComponent], styles: ["[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget .ui-multiselect-header{display:flex;align-items:center;padding:12px}[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget .ui-multiselect-header .ui-multiselect-filter-container{width:100%}[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget .ui-multiselect-header .ui-multiselect-filter-container .ui-inputtext{color:#535353}[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget .ui-multiselect-header .ui-multiselect-close span{color:#535353}[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget .ui-multiselect-header .ui-multiselect-close:hover{background-color:#ededed}[_nghost-%COMP%]     .ui-multiselect-panel.ui-widget.ui-widget-content.ui-corner-all.ui-shadow{box-shadow:none}[_nghost-%COMP%]     .ui-multiselect-panel .ui-multiselect-items-wrapper{overflow-x:hidden;box-shadow:0 1px 3px 0 rgba(0,0,0,.3)}[_nghost-%COMP%]     .ui-widget-header .pi{color:#535353}[_nghost-%COMP%]     .ui-multiselect{width:100%}[_nghost-%COMP%]     .ui-multiselect .ui-multiselect-label-container .ui-multiselect-label{color:#a8a8a8}[_nghost-%COMP%]     .ui-multiselect .ui-widget-header{color:#535353;background:#fff;border:none;border-bottom:2px solid #57a0d7}[_nghost-%COMP%]     .ui-multiselect-item span{vertical-align:inherit}[_nghost-%COMP%]     .ui-multiselect-panel{width:100%;top:-5px}[_nghost-%COMP%]     .ui-multiselect-panel .ui-multiselect-item{display:flex;align-items:center}[_nghost-%COMP%]     .ui-inputtext{background-image:none;background-size:0 0,100% 0}[_nghost-%COMP%]     .ui-chips-token{padding:0 30px 0 12px;color:#535353}[_nghost-%COMP%]     .option-container-details{display:inline-flex;margin-left:3px;vertical-align:middle;width:100%}[_nghost-%COMP%]     .option-container{width:98%;display:inline-flex;margin-left:3px}[_nghost-%COMP%]     .option-inner-container{width:100%;display:table}[_nghost-%COMP%]     .option-inner-container-inline{width:100%;display:flex;align-items:center;justify-content:flex-start}[_nghost-%COMP%]     .option-inner-container-inline .option-label{margin-right:5px;width:auto}[_nghost-%COMP%]     .option-label{text-overflow:ellipsis;overflow:hidden;width:99%}[_nghost-%COMP%]     .option-details{display:table-row;text-overflow:ellipsis}[_nghost-%COMP%]     .font-size-material-icons{font-size:14px}"] });
    return AlMultiSelectListComponent;
}());
export { AlMultiSelectListComponent };
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(AlMultiSelectListComponent, [{
        type: Component,
        args: [{
                selector: 'al-multiselect-list',
                templateUrl: './al-multiselect-list.component.html',
                styleUrls: ['./al-multiselect-list.component.scss']
            }]
    }], function () { return [{ type: i1.NgControl, decorators: [{
                type: Self
            }, {
                type: Optional
            }] }]; }, { placeholder: [{
            type: Input
        }], options: [{
            type: Input
        }], readonly: [{
            type: Input
        }], selectableListMode: [{
            type: Input
        }], filter: [{
            type: Input
        }], inline: [{
            type: Input
        }], primeMultiSelect: [{
            type: ViewChild,
            args: [MultiSelect, { static: true }]
        }], selectableList: [{
            type: ViewChild,
            args: [AlSelectableListComponent]
        }], onSelectionChanged: [{
            type: Output
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 