ng-inail-common 2.0.21 → 2.0.25

package/bundles/ng-inail-common.umd.js

@@ -2975,6 +2975,7 @@
                     _this.error = undefined;
                     _this.errorChange.emit(undefined);
                 }
+                _this.formElementCdr.detectChanges();
             });
         };
         FormElementComponent.prototype.registerOnChange = function (fn) {
@@ -3503,6 +3504,7 @@
             _this.showIcon = true;
             _this.autoCatchFocus = false;
             _this.scrollToFocus = true;
+            _this.labelFeedback = false;
             // hasContent = () => this.feedbackContent?.nativeElement?.childElementCount > 0;
             _this.hasContent = function () { var _a, _b; return isNotBlankOrNull((_b = (_a = _this.feedbackContent) === null || _a === void 0 ? void 0 : _a.nativeElement) === null || _b === void 0 ? void 0 : _b.textContent); };
             _this.logPrefix = '[inail-feedback]';
@@ -3549,10 +3551,10 @@
     FeedbackComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'inail-feedback',
-                    template: "<div [id]='id'\n     class=\"row feedback-box inail-feedback {{class}}\"\n     [ngClass]=\"{'feedback-box-error': type==errorType, 'global-feedback': globalFeedback === true}\">\n  <div>\n    <div class=\"feedback-header\"\n         [ngClass]=\"{'feedback-header-error': type==errorType}\">\n        <span>\n            <span class=\"fa white-check\"\n                  [ngClass]=\"{'fa-times': showIcon && type==errorType,\n                    'fa-check':showIcon && (type==successType || !type)}\"></span>\n            <span tabindex=\"0\" [id]=\"id+'-message'\" class=\"feedback-focusable\" [innerHTML]=\"message\" #mainMessage></span>\n        </span>\n    </div>\n    <div [hidden]=\"!hasContent()\"\n         class=\"feedback-content\"\n         [ngClass]=\"contentClass\"\n         #feedbackContent>\n      <p *ngIf=\"contentTitle\">\n        <strong>{{contentTitle}}</strong>\n      </p>\n      <ng-container *ngIf=\"detailsAsList || detailsAsOrderedList\">\n        <ol *ngIf=\"detailsAsOrderedList\">\n          <li *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></li>\n        </ol>\n        <ul *ngIf=\"detailsAsList && !detailsAsOrderedList\">\n          <li *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></li>\n        </ul>\n      </ng-container>\n      <ng-container *ngIf=\"!(detailsAsList || detailsAsOrderedList)\">\n        <p *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></p>\n      </ng-container>\n      <p><ng-content></ng-content></p>\n    </div>\n  </div>\n</div>\n",
+                    template: "<div *ngIf=\"!labelFeedback\"\n     [id]='id'\n     class=\"row feedback-box inail-feedback {{class}}\"\n     [ngClass]=\"{'feedback-box-error': type==errorType, 'global-feedback': globalFeedback === true}\">\n  <div>\n    <div class=\"feedback-header\"\n         [ngClass]=\"{'feedback-header-error': type==errorType}\">\n        <span>\n            <span class=\"fa white-check\"\n                  [ngClass]=\"{'fa-times': showIcon && type==errorType,\n                    'fa-check':showIcon && (type==successType || !type)}\"></span>\n            <span tabindex=\"0\" [id]=\"id+'-message'\" class=\"feedback-focusable\" [innerHTML]=\"message\" #mainMessage></span>\n        </span>\n    </div>\n    <div [hidden]=\"!hasContent()\"\n         class=\"feedback-content\"\n         [ngClass]=\"contentClass\"\n         #feedbackContent>\n      <p *ngIf=\"contentTitle\">\n        <strong>{{contentTitle}}</strong>\n      </p>\n      <ng-container *ngIf=\"detailsAsList || detailsAsOrderedList\">\n        <ol *ngIf=\"detailsAsOrderedList\">\n          <li *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></li>\n        </ol>\n        <ul *ngIf=\"detailsAsList && !detailsAsOrderedList\">\n          <li *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></li>\n        </ul>\n      </ng-container>\n      <ng-container *ngIf=\"!(detailsAsList || detailsAsOrderedList)\">\n        <p *ngFor=\"let dettaglio of details\" [innerHTML]=\"dettaglio\"></p>\n      </ng-container>\n      <p><ng-content></ng-content></p>\n    </div>\n  </div>\n</div>\n<span *ngIf=\"labelFeedback\"\n      [id]='id'\n      class=\"inail-feedback col-xs-12 form-group {{class}}\"\n      [ngClass]=\"{'feedback-box-error': type==errorType, 'global-feedback': globalFeedback === true}\">\n  <span *ngIf=\"showIcon\"\n        class=\"green-check fa fa-check-circle\"\n        [ngClass]=\"{'green-check fa-check-circle': type==successType || !type, 'red-check fa-times-circle': type==errorType}\"></span>\n  <strong tabindex=\"0\"\n          [id]=\"id+'-message'\"\n          class=\"labelFeedback feedback-focusable\"\n          [innerHTML]=\"message\" #mainMessage>\n  </strong>\n</span>\n",
                     changeDetection: CHANGE_DETECTION_STRATEGY,
                     encapsulation: core.ViewEncapsulation.None,
-                    styles: [".inail-feedback.feedback-box{margin-bottom:15px!important}.inail-feedback .feedback-content{padding-top:30px!important}.inail-feedback .feedback-content p{padding-top:0!important}.inail-feedback .feedback-header .feedback-focusable:focus{outline:1px dotted #fff!important}"]
+                    styles: [".inail-feedback.feedback-box{margin-bottom:15px!important}.inail-feedback .feedback-content{padding-top:30px!important}.inail-feedback .feedback-content p{padding-top:0!important}.inail-feedback .feedback-header .feedback-focusable:focus{outline:1px dotted #fff!important}.inail-feedback .fa.fa-times-circle{color:#c9291b;margin-right:5px}"]
                 },] }
     ];
     FeedbackComponent.ctorParameters = function () { return [
@@ -3572,6 +3574,7 @@
         focus: [{ type: core.Input }],
         autoCatchFocus: [{ type: core.Input }],
         scrollToFocus: [{ type: core.Input }],
+        labelFeedback: [{ type: core.Input }],
         feedbackContent: [{ type: core.ViewChild, args: ['feedbackContent',] }]
     };
     var Feedback = /** @class */ (function () {
@@ -5230,11 +5233,6 @@
     var DEFAULT_TABLE_LENGTH$1 = 10;
     var ASC = 'asc';
     var DESC = 'desc';
-    var PaginationState = /** @class */ (function () {
-        function PaginationState() {
-        }
-        return PaginationState;
-    }());
     var TableComponent = /** @class */ (function (_super) {
         __extends(TableComponent, _super);
         function TableComponent(cdr, renderer) {
@@ -5280,7 +5278,7 @@
         }
         TableComponent.prototype.ngOnChanges = function (changes) {
             var _this = this;
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
             _super.prototype.ngOnChanges.call(this, changes);
             // Controllo se la paginazione richiesta e' interna o esterna
             if (!this.externalPaginationSorting
@@ -5288,6 +5286,16 @@
                 && ((_b = changes.paginationState) === null || _b === void 0 ? void 0 : _b.currentValue) != undefined) {
                 this.externalPaginationSorting = true;
             }
+            // Se per la paginazione esterna viene specificata una proprieta di sorting
+            // attivo il componente thLabel associato
+            if ((_d = (_c = changes.paginationState) === null || _c === void 0 ? void 0 : _c.currentValue) === null || _d === void 0 ? void 0 : _d.sortProperty) {
+                this.attivaThLabelOrdinamentoSpecificato();
+            }
+            // Se per la paginazione interna viene specificato un ordinamento iniziale
+            // attivo il componente thLabel associato
+            if ((_f = (_e = changes.initialSort) === null || _e === void 0 ? void 0 : _e.currentValue) === null || _f === void 0 ? void 0 : _f.sortProperty) {
+                this.attivaThLabelOrdinamentoSpecificato();
+            }
             // Verifico se e' cambiata la lista degli elementi in input.
             // Nel caso in cui si stia effettuando una paginazione interna
             // emetto il sottoinsieme inerente la prima pagina
@@ -5301,7 +5309,7 @@
             }
             // Richiesta di paginazione
             if (!this.externalPaginationSorting
-                && ((_c = changes.doPagination) === null || _c === void 0 ? void 0 : _c.currentValue)) {
+                && ((_g = changes.doPagination) === null || _g === void 0 ? void 0 : _g.currentValue)) {
                 this.push(changes.doPagination.currentValue.subscribe(function (info) {
                     _this.lengthOnChange(info.pageSize);
                     setTimeout(function () { return _this.doSorting(info.sortProperty, info.sortDirection); }, 100);
@@ -5315,12 +5323,12 @@
                 this.lengthOnChange(this.elementsPerPage);
             }
             // Calcolo il numero di colonne visibili
-            if (((_d = changes.noDataFound) === null || _d === void 0 ? void 0 : _d.currentValue) === true) {
+            if (((_h = changes.noDataFound) === null || _h === void 0 ? void 0 : _h.currentValue) === true) {
                 // setTimeout(() => this.numeroColonne = document.querySelectorAll(`#${this.id} th`).length);
                 this.numeroColonne = document.querySelectorAll("#" + this.id + " th").length;
             }
-            if ((_e = changes.selectableRowValues) === null || _e === void 0 ? void 0 : _e.currentValue) {
-                this.righeSelezionabili = __spread((_f = changes.selectableRowValues) === null || _f === void 0 ? void 0 : _f.currentValue);
+            if ((_j = changes.selectableRowValues) === null || _j === void 0 ? void 0 : _j.currentValue) {
+                this.righeSelezionabili = __spread((_k = changes.selectableRowValues) === null || _k === void 0 ? void 0 : _k.currentValue);
             }
             this.cdr.detectChanges();
         };
@@ -5339,6 +5347,7 @@
             var _this = this;
             this.inizializzaTabella(this.thLabelComponents);
             this.lookAtThLabel(this.thLabelComponents);
+            this.attivaThLabelOrdinamentoSpecificato();
             setTimeout(function () { var _a; return _this.visualizzaBaseFooter = ((_a = _this.baseFooter) === null || _a === void 0 ? void 0 : _a.nativeElement.childElementCount) > 0; });
             this.cdr.detectChanges();
         };
@@ -5654,6 +5663,43 @@
             return !this.disablePagination
                 && (this.dataSource != undefined || (this.externalPaginationSorting != undefined && this.paginationState != undefined));
         };
+        /**
+         * Attiva il th label inerente l'ordinamento specificato
+         */
+        TableComponent.prototype.attivaThLabelOrdinamentoSpecificato = function () {
+            var _this = this;
+            if (this.thLabelComponents) {
+                // Paginazione esterna
+                if (this.externalPaginationSorting && this.paginationState) {
+                    var thLabel = this.thLabelComponents.find(function (item) { return item.property == _this.paginationState.sortProperty; });
+                    this.setSortDirection(thLabel, this.paginationState.sortDirection);
+                }
+                // Ordinamento iniziale paginazione interna
+                else if (this.initialSort) {
+                    this.thLabelComponents.forEach(function (thLabel) {
+                        thLabel.property == _this.initialSort.sortProperty
+                            ? _this.setSortDirection(thLabel, _this.initialSort.sortDirection)
+                            : _this.setSortDirection(thLabel, undefined);
+                    });
+                }
+            }
+        };
+        TableComponent.prototype.setSortDirection = function (thLabel, direction) {
+            if (thLabel) {
+                switch (direction) {
+                    case "asc":
+                        thLabel.direction = ThLabelComponent.ASC;
+                        break;
+                    case "desc":
+                        thLabel.direction = ThLabelComponent.DESC;
+                        break;
+                    default:
+                        thLabel.direction = ThLabelComponent.UNSORTED;
+                        break;
+                }
+                this.modificaTh(thLabel);
+            }
+        };
         return TableComponent;
     }(ResponsiveElementComponent));
     TableComponent.decorators = [
@@ -5675,6 +5721,7 @@
         displayedDataChange: [{ type: core.Output }],
         doPagination: [{ type: core.Input }],
         elementsPerPage: [{ type: core.Input }],
+        initialSort: [{ type: core.Input }],
         paginationState: [{ type: core.Input }],
         elementsPerPageOptions: [{ type: core.Input }],
         noDataFound: [{ type: core.Input }],
@@ -5744,11 +5791,13 @@
             if (!this.addButton) {
                 this.fileChange.emit(this.fileModel);
             }
+            this.cleanError();
             this.cdr.detectChanges();
         };
         InputFileComponent.prototype.reset = function () {
             this.fileModel = undefined;
             this.fileChange.emit(undefined);
+            this.cleanError();
             this.cdr.detectChanges();
         };
         return InputFileComponent;
@@ -6253,6 +6302,181 @@
         selectorComponent: [{ type: core.ViewChild, args: [SelectorComponent,] }]
     };
 
+    var ProgressBarComponent = /** @class */ (function (_super) {
+        __extends(ProgressBarComponent, _super);
+        function ProgressBarComponent(cdr) {
+            var _this = _super.call(this, cdr) || this;
+            _this.cdr = cdr;
+            _this.valuenow = 0;
+            _this.logPrefix = "[inail-progress-bar]";
+            _this.detach();
+            return _this;
+        }
+        ProgressBarComponent.prototype.ngOnChanges = function (changes) {
+            var _a;
+            _super.prototype.ngOnChanges.call(this, changes);
+            if ((_a = changes === null || changes === void 0 ? void 0 : changes.valuenow) === null || _a === void 0 ? void 0 : _a.currentValue) {
+                if (this.valuenow < 0) {
+                    this.valuenow = 0;
+                }
+                else if (this.valuenow > 100) {
+                    this.valuenow = 100;
+                }
+            }
+            this.cdr.detectChanges();
+        };
+        ProgressBarComponent.prototype.ngOnInit = function () {
+            _super.prototype.ngOnInit.call(this);
+        };
+        ProgressBarComponent.prototype.ngAfterViewInit = function () {
+        };
+        ProgressBarComponent.prototype.ngOnDestroy = function () {
+            _super.prototype.ngOnDestroy.call(this);
+        };
+        return ProgressBarComponent;
+    }(ResponsiveElementComponent));
+    ProgressBarComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'inail-progress-bar',
+                    template: "<div [id]=\"id\"\n     class=\"inail-progress-bar {{getResponsiveClass()}} noPaddingLeft noPaddingRight {{class}}\">\n  <span *ngIf=\"label\" [innerHTML]=\"label\"></span>\n  <span class=\"progress\">\n    <span role=\"progressbar\"\n          aria-valuemin=\"0\"\n          aria-valuemax=\"100\"\n          title=\"Stato avanzamento: {{valuenow}}%\"\n          class=\"progress-bar\"\n          [ngClass]=\"{'progress-bar-25': valuenow <= 25, 'progress-bar-50': valuenow > 25 && valuenow <= 50, 'progress-bar-75': valuenow > 50 && valuenow <= 75, 'progress-bar-100': valuenow == 100}\"\n          [attr.aria-valuenow]=\"valuenow\"\n          [style.width.%]=\"valuenow\">\n    </span>\n  </span>\n</div>\n",
+                    changeDetection: CHANGE_DETECTION_STRATEGY,
+                    encapsulation: core.ViewEncapsulation.None,
+                    styles: [""]
+                },] }
+    ];
+    ProgressBarComponent.ctorParameters = function () { return [
+        { type: core.ChangeDetectorRef }
+    ]; };
+    ProgressBarComponent.propDecorators = {
+        label: [{ type: core.Input }],
+        valuenow: [{ type: core.Input }]
+    };
+
+    var MultiSelectComponent = /** @class */ (function (_super) {
+        __extends(MultiSelectComponent, _super);
+        function MultiSelectComponent(cdr) {
+            var _this = _super.call(this, cdr) || this;
+            _this.cdr = cdr;
+            _this.options = [];
+            _this.values = [];
+            _this.valuesChange = new core.EventEmitter();
+            _this.placeholder = '- seleziona opzioni -';
+            _this.toggle = function () { return window['$'](_this.formControlElement.nativeElement).dropdown('toggle'); };
+            _this.isExpanded = function () { return _this.formControlElement.nativeElement.getAttribute('aria-expanded') === 'true'; };
+            _this.hasFormControlFocus = function () { return _this.formControlElement.nativeElement.matches(':focus'); };
+            _this.hasDropdownMenuFocus = function () { return _this.dropdownMenu.nativeElement.matches(':focus-within'); };
+            _this.isChecked = function (value) { return _this.values.some(function (v) { return v === value; }); };
+            _this.getInputTextValue = function () { return _this.options.filter(function (opt) { return _this.isChecked(opt.value); }).map(function (opt) { return opt.label; }).join(', '); };
+            _this.pushValue = function (value) { return _this.values = _this.options.filter(function (opt) { return opt.value === value || _this.isChecked(opt.value); }).map(function (opt) { return opt.value; }); };
+            _this.isFocusOut = function () { return window['$'](_this.multiSelect.nativeElement).find(document.activeElement).length == 0; };
+            _this.logPrefix = "[inail-multi-select]";
+            _this.detach();
+            return _this;
+        }
+        MultiSelectComponent.prototype.ngOnChanges = function (changes) {
+            var _a, _b, _c;
+            _super.prototype.ngOnChanges.call(this, changes);
+            if ((((_a = changes === null || changes === void 0 ? void 0 : changes.options) === null || _a === void 0 ? void 0 : _a.currentValue) || ((_b = changes === null || changes === void 0 ? void 0 : changes.sort) === null || _b === void 0 ? void 0 : _b.currentValue)) && this.sort) {
+                var direction_1 = "ASC" == this.sort.toUpperCase() ? 1 : "DESC" == this.sort.toUpperCase() ? -1 : 0;
+                if (direction_1 != 0 && this.options != undefined) {
+                    this.options.sort(function (a, b) { return a.label < b.label ? -direction_1 : a.label > b.label ? direction_1 : 0; });
+                }
+            }
+            if ((_c = changes === null || changes === void 0 ? void 0 : changes.options) === null || _c === void 0 ? void 0 : _c.currentValue) {
+                this.inputTextValue = this.getInputTextValue();
+            }
+            this.cdr.detectChanges();
+        };
+        MultiSelectComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            _super.prototype.ngOnInit.call(this);
+            this.emitDebug("@ViewChild('formControl')");
+            this.emitDebug(this.formControlElement);
+            if (this.focus) {
+                this.push(this.focus.subscribe(function (scroll) {
+                    _this.emitDebug("Catch focus!");
+                    setFocus(_this.formControlElement.nativeElement, scroll);
+                }));
+            }
+        };
+        MultiSelectComponent.prototype.ngAfterViewInit = function () {
+        };
+        MultiSelectComponent.prototype.ngOnDestroy = function () {
+            _super.prototype.ngOnDestroy.call(this);
+        };
+        MultiSelectComponent.prototype.onKeypress = function ($event) {
+            $event.preventDefault();
+        };
+        MultiSelectComponent.prototype.onFocusIn = function () {
+            var _this = this;
+            setTimeout(function () {
+                _this.showDropdownMenu();
+            }, 250);
+        };
+        MultiSelectComponent.prototype.onFocusOut = function () {
+            var _this = this;
+            setTimeout(function () {
+                if (_this.isFocusOut()) {
+                    _this.closeDropdownMenu();
+                }
+            }, 150);
+        };
+        MultiSelectComponent.prototype.showDropdownMenu = function () {
+            var _this = this;
+            setTimeout(function () {
+                if (!_this.isExpanded()) {
+                    _this.toggle();
+                }
+            });
+        };
+        MultiSelectComponent.prototype.closeDropdownMenu = function () {
+            var _this = this;
+            setTimeout(function () {
+                if (_this.isExpanded()) {
+                    _this.toggle();
+                }
+            });
+        };
+        MultiSelectComponent.prototype.onCheck = function (cb) {
+            if (!cb.firstChange) {
+                if (cb.checked && !this.isChecked(cb.value)) {
+                    this.pushValue(cb.value);
+                    this.cleanError();
+                }
+                else if (!cb.checked && this.isChecked(cb.value)) {
+                    this.values = this.values.filter(function (value) { return value != cb.value; });
+                    this.cleanError();
+                }
+                this.valuesChange.emit(this.values);
+                this.inputTextValue = this.getInputTextValue();
+                this.cdr.detectChanges();
+            }
+        };
+        return MultiSelectComponent;
+    }(FormElementComponent));
+    MultiSelectComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'inail-multi-select',
+                    template: "<div #multiSelect\n     class=\"form-group {{getResponsiveClass()}} noPaddingLeft {{class}} inail-multi-select\"\n     [ngClass]=\"{'has-error': isThereError()}\">\n  <label *ngIf=\"label\"\n         class=\"control-label {{labelClass}}\"\n         [ngClass]=\"{'sr-only': hiddenLabel}\"\n         [attr.title]=\"labelTitle\"\n         [for]=\"id\"\n         [innerHTML]=\"getLabel()\"></label>\n  <span *ngIf=\"showPopover()\"\n        [style.padding-left.px]=\"5\">\n    <inail-popover [iconClass]=\"popoverButtonIcon\"\n                   [buttonTitle]=\"popoverButtonTitle\"\n                   [header]=\"popoverHeader\"\n                   [content]=\"popoverContent\">\n    </inail-popover>\n  </span>\n  <div class=\"form-control-wrapper\"\n       [ngClass]=\"{'no-label' : hiddenLabel || !label}\">\n    <input #formControl\n           type=\"text\"\n           [id]=\"id\"\n           class=\"form-control dropdown-toggle {{inputClass}}\"\n           data-toggle=\"dropdown\"\n           aria-haspopup=\"true\"\n           aria-expanded=\"false\"\n           [ngClass]=\"{'disabled': disabled}\"\n           [attr.name]=\"name\"\n           [attr.title]=\"title\"\n           [disabled]=\"disabled\"\n           [readonly]=\"true\"\n           [attr.placeholder]=\"placeholder\"\n           [attr.aria-required]=\"required === true ? true : undefined\"\n           [attr.aria-invalid]=\"isThereError() === true ? true : undefined\"\n           [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n           (blur)=\"onBlur()\"\n           (focusin)=\"onFocusIn()\"\n           (focusout)=\"onFocusOut()\"\n           (keypress)=\"onKeypress($event)\"\n           (keyup.enter)=\"enterUp.emit()\"\n           [ngModel]=\"inputTextValue\">\n    <div #dropdownMenu\n         class=\"dropdown-menu\"\n         (focusout)=\"onFocusOut()\"\n         [attr.aria-labelledby]=\"id\">\n      <ng-container *ngFor=\"let opt of options\">\n        <div *ngIf=\"opt.beforeDivider\" class=\"divider\"></div>\n        <div class=\"row\" [attr.tabIndex]=\"opt.disabled ? 0 : undefined\">\n          <inail-checkbox [label]=\"opt.label\"\n                          [value]=\"opt.value\"\n                          [title]=\"opt.title\"\n                          [checked]=\"isChecked(opt.value)\"\n                          [disabled]=\"opt.disabled\"\n                          (stateChange)=\"onCheck($event)\">\n          </inail-checkbox>\n        </div>\n        <div *ngIf=\"opt.afterDivider\" class=\"divider\"></div>\n      </ng-container>\n    </div>\n  </div>\n  <div *ngIf=\"showError()\" [id]=\"id+'-description'\">\n    <div class=\"msg msg-errore\">\n      <strong [innerHTML]=\"'ERRORE: '+this.error\"></strong>\n    </div>\n    <div *ngIf=\"description\" [innerHTML]=\"this.description\"></div>\n  </div>\n  <div *ngIf=\"description && !showError()\"\n       [id]=\"id+'-description'\"\n       [innerHTML]=\"this.description\">\n  </div>\n</div>\n",
+                    changeDetection: CHANGE_DETECTION_STRATEGY,
+                    encapsulation: core.ViewEncapsulation.None,
+                    styles: [".inail-multi-select .form-control-wrapper:after{font-family:FontAwesome;content:\"\\f078\";right:31px;position:absolute;top:35px;font-size:10px;color:#0083f5}.inail-multi-select .form-control-wrapper.no-label:after{top:11px}.inail-multi-select .form-control[readonly]:not([disabled]){background-color:#fff}.inail-multi-select .form-control:not([disabled]){cursor:pointer}.inail-multi-select .dropdown-menu .form-group{margin:0!important;padding-left:20px!important}.inail-multi-select .dropdown-menu .form-group:hover{background-color:#eaedf2}.inail-multi-select .dropdown-menu .form-group .checkbox{margin:0!important}.inail-multi-select .dropdown-menu .form-group .checkbox label{margin-top:5px!important;margin-bottom:5px!important;display:block!important}"]
+                },] }
+    ];
+    MultiSelectComponent.ctorParameters = function () { return [
+        { type: core.ChangeDetectorRef }
+    ]; };
+    MultiSelectComponent.propDecorators = {
+        multiSelect: [{ type: core.ViewChild, args: ['multiSelect', { static: true },] }],
+        formControlElement: [{ type: core.ViewChild, args: ['formControl', { static: true },] }],
+        dropdownMenu: [{ type: core.ViewChild, args: ['dropdownMenu', { static: true },] }],
+        options: [{ type: core.Input }],
+        values: [{ type: core.Input }],
+        valuesChange: [{ type: core.Output }],
+        placeholder: [{ type: core.Input }],
+        sort: [{ type: core.Input }]
+    };
+
     var NgInailCommonModule = /** @class */ (function () {
         function NgInailCommonModule() {
         }
@@ -6306,7 +6530,9 @@
                         SelectorComponent,
                         WizardComponent,
                         ContainerComponent,
-                        TrCheckboxComponent
+                        TrCheckboxComponent,
+                        ProgressBarComponent,
+                        MultiSelectComponent
                     ],
                     imports: [
                         common.CommonModule,
@@ -6354,7 +6580,9 @@
                         SelectorComponent,
                         WizardComponent,
                         ContainerComponent,
-                        TrCheckboxComponent
+                        TrCheckboxComponent,
+                        ProgressBarComponent,
+                        MultiSelectComponent
                     ],
                     providers: [common.DatePipe]
                 },] }
@@ -6396,6 +6624,7 @@
     exports.MenuIntranetComponent = MenuIntranetComponent;
     exports.MenuItem = MenuItem;
     exports.ModalComponent = ModalComponent;
+    exports.MultiSelectComponent = MultiSelectComponent;
     exports.NavigazioneInternaComponent = NavigazioneInternaComponent;
     exports.NavigazionePrincipaleComponent = NavigazionePrincipaleComponent;
     exports.NavigazioneSecondariaComponent = NavigazioneSecondariaComponent;
@@ -6403,8 +6632,8 @@
     exports.NavigazioneUtenteConfigurations = NavigazioneUtenteConfigurations;
     exports.NgInailCommonModule = NgInailCommonModule;
     exports.PageTitleComponent = PageTitleComponent;
-    exports.PaginationState = PaginationState;
     exports.PopoverComponent = PopoverComponent;
+    exports.ProgressBarComponent = ProgressBarComponent;
     exports.RadioSelectComponent = RadioSelectComponent;
     exports.ResponsiveElementComponent = ResponsiveElementComponent;
     exports.SelectComponent = SelectComponent;