ng-inail-common 2.0.30-beta.8 → 2.0.31-beta.1

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

@@ -2962,7 +2962,7 @@
         __extends(FormElementComponent, _super);
         function FormElementComponent(formElementCdr, formElementLibConfig) {
             var _this = this;
-            var _a, _b, _c, _d;
+            var _a, _b, _c, _d, _e, _f;
             _this = _super.call(this, formElementCdr, formElementLibConfig) || this;
             _this.formElementCdr = formElementCdr;
             _this.formElementLibConfig = formElementLibConfig;
@@ -2977,6 +2977,7 @@
             _this.errorChange = new core.EventEmitter();
             _this.enterUp = new core.EventEmitter();
             _this.popover = false;
+            _this.cleanErrorOnChange = getConfigValue((_f = (_e = _this.formElementLibConfig) === null || _e === void 0 ? void 0 : _e.formElementComponent) === null || _f === void 0 ? void 0 : _f.cleanErrorOnChange, true);
             _this.getLabel = function () { return "" + ((_this.required && _this.requiredSimbolPosition === 'left') ? _this.requiredSimbol + " " : '') + _this.label + ((_this.required && _this.requiredSimbolPosition === 'right') ? " " + _this.requiredSimbol : ''); };
             _this.isThereError = function () { return _this.hasError || isNotBlankOrNull(_this.error); };
             _this.showError = function () { return _this.isThereError() && isNotBlankOrNull(_this.error); };
@@ -2991,6 +2992,7 @@
                 _super.prototype.overrideConfig.call(this, config);
                 this.requiredSimbol = getConfigValue(config.requiredSimbol, this.requiredSimbol);
                 this.requiredSimbolPosition = getConfigValue(config.requiredSimbolPosition, this.requiredSimbolPosition);
+                this.cleanErrorOnChange = getConfigValue(config.cleanErrorOnChange, this.cleanErrorOnChange);
             }
         };
         FormElementComponent.prototype.ngOnChanges = function (changes) {
@@ -3082,7 +3084,8 @@
         popoverButtonIcon: [{ type: core.Input }],
         popoverButtonTitle: [{ type: core.Input }],
         popoverHeader: [{ type: core.Input }],
-        popoverContent: [{ type: core.Input }]
+        popoverContent: [{ type: core.Input }],
+        cleanErrorOnChange: [{ type: core.Input }]
     };
 
     /**
@@ -3237,7 +3240,9 @@
                 this.cdr.detectChanges();
                 this.emitDebug("this.valueChange.emit(" + value + ")");
                 this.valueChange.emit(value);
-                this.cleanError();
+                if (this.cleanErrorOnChange) {
+                    this.cleanError();
+                }
                 if (this.onChange) {
                     this.onChange(value);
                 }
@@ -3354,7 +3359,9 @@
                     _this.emitDebug("this.valueChange.emit(" + _this.selectedValue + ")");
                     _this.valueChange.emit(_this.selectedValue);
                     _this.select.emit(_this.options.find(function (opt) { return (opt === null || opt === void 0 ? void 0 : opt.value) === _this.selectedValue; }));
-                    _this.cleanError();
+                    if (_this.cleanErrorOnChange) {
+                        _this.cleanError();
+                    }
                     if (_this.onChange) {
                         _this.onChange(_this.selectedValue);
                     }
@@ -4070,7 +4077,9 @@
                 this.cdr.detectChanges();
                 this.emitDebug("this.valueChange.emit(" + value + ")");
                 this.valueChange.emit(value);
-                this.cleanError();
+                if (this.cleanErrorOnChange) {
+                    this.cleanError();
+                }
                 if (this.onChange) {
                     this.onChange(value);
                 }
@@ -4121,11 +4130,12 @@
     var ɵ0$3 = isValidInputModel;
     var isLongTime = function (o) { return o && (typeof o === 'number'); };
     var ɵ1$2 = isLongTime;
+    var ACCEPTED_INPUTS = ['/', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'Backspace', 'Delete', "Tab", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
     var InputDateComponent = /** @class */ (function (_super) {
         __extends(InputDateComponent, _super);
         function InputDateComponent(cdr, libConfig) {
             var _this = this;
-            var _a, _b;
+            var _a, _b, _c, _d, _e, _f;
             _this = _super.call(this, cdr, libConfig) || this;
             _this.cdr = cdr;
             _this.libConfig = libConfig;
@@ -4134,10 +4144,12 @@
             // modelFormat: DateFormat;
             // https://bootstrap-datepicker.readthedocs.io/en/latest/options.html
             _this.options = getConfigValue((_b = (_a = _this.libConfig) === null || _a === void 0 ? void 0 : _a.inputDateComponent) === null || _b === void 0 ? void 0 : _b.options, undefined);
+            _this.selfValidation = getConfigValue((_d = (_c = _this.libConfig) === null || _c === void 0 ? void 0 : _c.inputDateComponent) === null || _d === void 0 ? void 0 : _d.selfValidation, true);
+            _this.selfValidationError = getConfigValue((_f = (_e = _this.libConfig) === null || _e === void 0 ? void 0 : _e.inputDateComponent) === null || _f === void 0 ? void 0 : _f.selfValidationError, 'La data inserita non è valida');
             _this.isValidInputValue = function () { return isBlankOrNull(_this.visibleData) || isInItalianFormat(_this.visibleData); };
-            _this.isThereDataError = function () { return _this.isThereError() || !_this.isValidInputValue(); };
+            _this.isThereDataError = function () { return _this.isThereError() || (!_this.isValidInputValue() && _this.selfValidation); };
             _this.showDataError = function () { return _this.isThereDataError() && isNotBlankOrNull(_this.getDescError()); };
-            _this.getDescError = function () { return (isBlankOrNull(_this.error) && !_this.isValidInputValue()) ? "La data inserita non è valida" : _this.error; };
+            _this.getDescError = function () { return (_this.selfValidation && isBlankOrNull(_this.error) && !_this.isValidInputValue()) ? _this.selfValidationError : _this.error; };
             _this.isEnabledDate = function (date) {
                 var dateString = dateToString(date, 'ISO8061');
                 return _this.isDataAbilitata(dateString) && !_this.isDataDisabilitata(dateString);
@@ -4145,6 +4157,9 @@
             _this.isDataAbilitata = function (data) { return _this.enabledDates == undefined || !_this.enabledDates.length || _this.enabledDates.some(function (regex) { return _this.match(data, regex) != undefined; }); };
             _this.isDataDisabilitata = function (data) { return _this.disabledDates != undefined && _this.disabledDates.some(function (regex) { return _this.match(data, regex) != undefined; }); };
             _this.match = function (date, regex) { return date != undefined && date.match(new RegExp('^'.concat(regex).concat('$'), 'i')); };
+            _this.isFirstDigitSlash = function (ev) { return ev.key == '/' && _this.visibleData == undefined; };
+            _this.isDoubleSlash = function (ev) { return ev.key == '/' && ev.key == _this.previousDigit; };
+            _this.isWrongDigit = function (ev) { return _this.isFirstDigitSlash(ev) || _this.isDoubleSlash(ev); };
             _this.logPrefix = "[inail-input-date]";
             _super.prototype.overrideConfig.call(_this, libConfig === null || libConfig === void 0 ? void 0 : libConfig.inputDateComponent);
             _this.detach();
@@ -4152,12 +4167,10 @@
         }
         InputDateComponent.prototype.ngOnChanges = function (changes) {
             _super.prototype.ngOnChanges.call(this, changes);
-            if (changes.value && !changes.value.firstChange) {
-                this.hasError = false;
-                this.error = undefined;
-                this.hasErrorChange.emit(this.hasError);
-                this.errorChange.emit(this.error);
-            }
+            // if (changes.value && !changes.value.firstChange && this.cleanErrorOnChange) {
+            //
+            //   this.cleanError();
+            // }
             // Se cambiano le options o gli array delle date abilitate/disabilitate
             // reinizializzo il componente
             if ((changes.options && !changes.options.firstChange)
@@ -4274,7 +4287,9 @@
                     _this.setDatepickerDate(_this.visibleData);
                 }
             });
-            this.cleanError();
+            if (this.cleanErrorOnChange) {
+                this.cleanError();
+            }
             this.cdr.detectChanges();
             if (this.onChange) {
                 this.onChange(value);
@@ -4287,12 +4302,22 @@
         InputDateComponent.prototype.setDatepickerDate = function (date) {
             window['$'](this.formControlElement.nativeElement).datepicker('setDate', date);
         };
+        InputDateComponent.prototype.onKeyDown = function (ev) {
+            // console.warn(ev)
+            // console.warn(this.visibleData, `${this.visibleData}`)
+            if ((!ACCEPTED_INPUTS.some(function (v) { return v === ev.key; }) || this.isWrongDigit(ev)) && ev.ctrlKey == false) {
+                ev.preventDefault();
+            }
+            else {
+                this.previousDigit = ev.key;
+            }
+        };
         return InputDateComponent;
     }(FormElementComponent));
     InputDateComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'inail-input-date',
-                    template: "<div class=\"date datePicker {{getResponsiveClass()}} noPaddingLeft {{class}}\"\n     [ngClass]=\"{'has-error': isThereDataError()}\">\n  <div class=\"form-group\">\n    <div class=\"input-relative\">\n      <label *ngIf=\"label\"\n             [ngClass]=\"{'sr-only': hiddenLabel}\"\n             class=\"control-label {{labelClass}}\"\n             title=\"{{labelTitle}}\"\n             for=\"{{id}}\" [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      <input id=\"{{id}}\"\n             #formControl\n             class=\"form-control\"\n             [ngClass]=\"inputClass\"\n             title=\"GG/MM/AAAA\"\n             placeholder=\"GG/MM/AAAA\"\n             type=\"text\"\n             (change)=\"onChangeHandler($event)\"\n             (paste)=\"onChangeHandler($event)\"\n             (keyup)=\"onChangeHandler($event)\"\n             [disabled]=\"this.disabled\"\n             [readonly]=\"this.readonly\"\n             [attr.aria-required]=\"required === true ? true : undefined\"\n             [attr.aria-invalid]=\"isThereDataError() === true ? true : undefined\"\n             [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n             (keyup.enter)=\"enterUp.emit()\"\n             [(ngModel)]=\"this.visibleData\">\n      <em class=\"fa fa-calendar\"\n          title=\"Calendario\"\n          (click)=\"formControl.focus()\"></em>\n    </div>\n    <div *ngIf=\"showDataError()\" [id]=\"id+'-description'\">\n      <div class=\"msg msg-errore\">\n        <strong [innerHTML]=\"'ERRORE: '+getDescError()\"></strong>\n      </div>\n      <div *ngIf=\"description\" [innerHTML]=\"description\"></div>\n    </div>\n    <div *ngIf=\"description && !showDataError()\"\n         [id]=\"id+'-description'\"\n         [innerHTML]=\"this.description\">\n    </div>\n  </div>\n</div>\n",
+                    template: "<div class=\"date datePicker {{getResponsiveClass()}} noPaddingLeft {{class}}\"\n     [ngClass]=\"{'has-error': isThereDataError()}\">\n  <div class=\"form-group\">\n    <div class=\"input-relative\">\n      <label *ngIf=\"label\"\n             [ngClass]=\"{'sr-only': hiddenLabel}\"\n             class=\"control-label {{labelClass}}\"\n             title=\"{{labelTitle}}\"\n             for=\"{{id}}\" [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      <input id=\"{{id}}\"\n             #formControl\n             class=\"form-control\"\n             [ngClass]=\"inputClass\"\n             title=\"GG/MM/AAAA\"\n             placeholder=\"GG/MM/AAAA\"\n             type=\"text\"\n             (change)=\"onChangeHandler($event)\"\n             (paste)=\"onChangeHandler($event)\"\n             (keyup)=\"onChangeHandler($event)\"\n             [disabled]=\"this.disabled\"\n             [readonly]=\"this.readonly\"\n             [attr.aria-required]=\"required === true ? true : undefined\"\n             [attr.aria-invalid]=\"isThereDataError() === true ? true : undefined\"\n             [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n             (keyup.enter)=\"enterUp.emit()\"\n             (keydown)=\"onKeyDown($event)\"\n             [(ngModel)]=\"this.visibleData\">\n      <em class=\"fa fa-calendar\"\n          title=\"Calendario\"\n          (click)=\"formControl.focus()\"></em>\n    </div>\n    <div *ngIf=\"showDataError()\" [id]=\"id+'-description'\">\n      <div class=\"msg msg-errore\">\n        <strong [innerHTML]=\"'ERRORE: '+getDescError()\"></strong>\n      </div>\n      <div *ngIf=\"description\" [innerHTML]=\"description\"></div>\n    </div>\n    <div *ngIf=\"description && !showDataError()\"\n         [id]=\"id+'-description'\"\n         [innerHTML]=\"this.description\">\n    </div>\n  </div>\n</div>\n",
                     changeDetection: CHANGE_DETECTION_STRATEGY,
                     encapsulation: core.ViewEncapsulation.None,
                     providers: [
@@ -4313,214 +4338,13 @@
         formControlElement: [{ type: core.ViewChild, args: ['formControl', { static: true },] }],
         valueChange: [{ type: core.Output }],
         options: [{ type: core.Input }],
+        selfValidation: [{ type: core.Input }],
+        selfValidationError: [{ type: core.Input }],
         enabledDates: [{ type: core.Input }],
         disabledDates: [{ type: core.Input }],
         reinit: [{ type: core.Input }],
         value: [{ type: core.Input }]
     };
-    // export class InputDateComponent extends FormElementComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
-    //
-    //   @ViewChild('formControl', {static: true})
-    //   formControlElement: ElementRef<HTMLElement>;
-    //
-    //   visibleData: string;
-    //
-    //   changed: boolean;
-    //
-    //   @Output()
-    //   valueChange = new EventEmitter<string>();
-    //
-    //   // @Input()
-    //   // modelFormat: DateFormat;
-    //
-    //   @Input()
-    //   datepickerOptions: any;
-    //
-    //   @Input()
-    //   enabledDates: string[];
-    //
-    //   @Input()
-    //   disabledDates: string[];
-    //
-    //   constructor(private cdr: ChangeDetectorRef) {
-    //     super(cdr);
-    //     this.detach();
-    //   }
-    //
-    //   ngOnChanges(changes: DatePickerChanges) {
-    //
-    //     super.ngOnChanges(changes);
-    //     this.emitDebug(`ngOnChanges:`);
-    //     this.emitDebug(changes);
-    //
-    //     if (changes.value && !changes.value.firstChange) {
-    //
-    //       this.hasError = false;
-    //       this.error = undefined;
-    //     }
-    //
-    //     this.cdr.detectChanges();
-    //   }
-    //
-    //   ngOnInit() {
-    //
-    //     this.logPrefix = `[inail-input-date][${this.label}]`;
-    //     super.ngOnInit();
-    //
-    //     if (!this.datepickerOptions) {
-    //
-    //       this.datepickerOptions = {
-    //         autoclose: true,
-    //         format: 'dd/mm/yyyy',
-    //         weekStart: 1,
-    //         todayBtn: 'linked',
-    //         language: 'it',
-    //         todayHighlight: true,
-    //         orientation: 'auto top',
-    //         enableOnReadonly: false
-    //       };
-    //     }
-    //
-    //     if (this.disabledDates != undefined || this.enabledDates != undefined) {
-    //
-    //       this.datepickerOptions.beforeShowDay = this.isEnabledDate
-    //     }
-    //
-    //     this.cdr.detectChanges();
-    //   }
-    //
-    //   private isEnabledDate = (date) => {
-    //
-    //     // @ts-ignore
-    //     var dateString = $.datepicker.formatDate('yy-mm-dd', date);
-    //     return this.isDataAbilitata(dateString) && !this.isDataDisabilitata(dateString);
-    //   };
-    //
-    //   private isDataAbilitata = (data: string) => this.enabledDates == undefined || this.enabledDates.some(regex => this.match(data, regex) != undefined);
-    //   private isDataDisabilitata = (data: string) => this.disabledDates != undefined && this.disabledDates.some(regex => this.match(data, regex) != undefined);
-    //
-    //   match = (date: string, regex: string) => date != undefined && date.match(new RegExp('^'.concat(regex).concat('$'), 'i'));
-    //
-    //   ngAfterViewInit(): void {
-    //
-    //     this.emitDebug('ngAfterViewInit');
-    //     this.emitDebug('nativeElement');
-    //     this.emitDebug(this.formControlElement?.nativeElement);
-    //
-    //     // Inizializzazione della libreria datepicker
-    //     window['$'](this.formControlElement.nativeElement).datepicker(this.datepickerOptions);
-    //
-    //     if (this.visibleData && isDate(this.visibleData)) {
-    //
-    //       this.setDatepickerDate(this.visibleData)
-    //     }
-    //
-    //     setTimeout(() => {
-    //
-    //       // @ts-ignore
-    //       $('#' + this.id).on("change", () => {
-    //
-    //         this.emitDebug('onChange');
-    //         this.emitDebug(`visibleData: ${this.visibleData}`);
-    //
-    //         // @ts-ignore
-    //         let elem = $('#' + this.id)[0]
-    //
-    //         this.emitDebug(`nativeElement value: ${elem?.value}`);
-    //
-    //         if (elem != undefined && elem.value != this.visibleData) {
-    //
-    //           this.emitDebug(`update value: ${this.value} -> ${elem.value}`);
-    //           this.value = elem.value;
-    //         }
-    //
-    //         this.cdr.detectChanges();
-    //       });
-    //     });
-    //
-    //     if (this.showPopover()) {
-    //
-    //       // @ts-ignore
-    //       $(`#${this.id}-popover`).popover();
-    //     }
-    //
-    //     this.cdr.detectChanges();
-    //   }
-    //
-    //   ngOnDestroy(): void {
-    //
-    //     super.ngOnDestroy();
-    //   }
-    //
-    //   @Input()
-    //   set value(val) {
-    //
-    //     // console.warn('val', val, this.visibleData)
-    //
-    //     let validFormat = isValidInputFormat(val);
-    //
-    //     // console.warn('validFormat', validFormat)
-    //
-    //     if (isNotBlankOrNull(val)) {
-    //
-    //       this.visibleData = validFormat ? toItalianFormat(val) : val;
-    //     } else {
-    //
-    //       this.visibleData = undefined
-    //     }
-    //
-    //     // console.warn('visibleData', this.visibleData)
-    //
-    //     setTimeout(() => {
-    //
-    //       let vChange = validFormat ? toISO8601Format(this.visibleData) : this.visibleData
-    //
-    //       // console.warn('vChange', vChange)
-    //
-    //       this.valueChange.emit(validFormat ? toISO8601Format(this.visibleData) : this.visibleData);
-    //
-    //       if (validFormat) {
-    //
-    //         // console.warn(this.visibleData)
-    //         this.setDatepickerDate(this.visibleData);
-    //       }
-    //     });
-    //   }
-    //
-    //   get isValid(): boolean {
-    //
-    //     return isBlankOrNull(this.visibleData) || isInItalianFormat(this.visibleData);
-    //   }
-    //
-    //   checkDescError(): boolean {
-    //
-    //     let descError: string = this.getDescError();
-    //     return this.checkError() && isNotBlankOrNull(descError);
-    //   }
-    //
-    //   checkError(): boolean {
-    //
-    //     return !this.isValid || this.hasError || isNotBlankOrNull(this.error);
-    //   }
-    //
-    //   getDescError(): string {
-    //
-    //     return (isNotBlankOrNull(this.error) && !this.isValid)
-    //       ? 'La data inserita non &egrave; valida'
-    //       : this.error;
-    //   }
-    //
-    //   onChangeHandler($event: any) {
-    //
-    //     // console.info('onChange', $event.target.value)
-    //     this.value = $event.target.value;
-    //   }
-    //
-    //   private setDatepickerDate(date: string) {
-    //
-    //     window['$'](this.formControlElement.nativeElement).datepicker('setDate', date);
-    //   }
-    // }
 
     var clone$1 = function (obj) { return obj ? JSON.parse(JSON.stringify(obj)) : obj; };
     var ɵ0$4 = clone$1;
@@ -4599,7 +4423,9 @@
                     _this.emitDebug("this.valueChange.emit(" + _this.selectedValue + ")");
                     _this.valueChange.emit(_this.selectedValue);
                     _this.select.emit(_this.options.find(function (opt) { return (opt === null || opt === void 0 ? void 0 : opt.value) === _this.selectedValue; }));
-                    _this.cleanError();
+                    if (_this.cleanErrorOnChange) {
+                        _this.cleanError();
+                    }
                     if (_this.onChange) {
                         _this.onChange(_this.selectedValue);
                     }
@@ -4721,7 +4547,9 @@
                     this.emitDebug("this.checkedChange.emit(" + value + ")");
                     this.checkedChange.emit(value);
                     this.emitState();
-                    this.cleanError();
+                    if (this.cleanErrorOnChange) {
+                        this.cleanError();
+                    }
                     if (this.onChange) {
                         this.onChange(value);
                     }
@@ -5436,7 +5264,7 @@
         __extends(TableComponent, _super);
         function TableComponent(cdr, renderer, libConfig) {
             var _this = this;
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
             _this = _super.call(this, cdr, libConfig) || this;
             _this.cdr = cdr;
             _this.renderer = renderer;
@@ -5456,7 +5284,9 @@
             _this.pagination = new core.EventEmitter();
             _this.tallRows = getConfigValue((_h = (_g = _this.libConfig) === null || _g === void 0 ? void 0 : _g.tableComponent) === null || _h === void 0 ? void 0 : _h.tallRows, false);
             _this.captionHidden = getConfigValue((_k = (_j = _this.libConfig) === null || _j === void 0 ? void 0 : _j.tableComponent) === null || _k === void 0 ? void 0 : _k.captionHidden, false);
-            _this.bgWhite = getConfigValue((_m = (_l = _this.libConfig) === null || _l === void 0 ? void 0 : _l.tableComponent) === null || _m === void 0 ? void 0 : _m.bgWhite, true);
+            _this.showFullListSize = getConfigValue((_m = (_l = _this.libConfig) === null || _l === void 0 ? void 0 : _l.tableComponent) === null || _m === void 0 ? void 0 : _m.showFullListSize, false);
+            _this.fullListSizeText = getConfigValue((_p = (_o = _this.libConfig) === null || _o === void 0 ? void 0 : _o.tableComponent) === null || _p === void 0 ? void 0 : _p.fullListSizeText, "Elementi totali:");
+            _this.bgWhite = getConfigValue((_r = (_q = _this.libConfig) === null || _q === void 0 ? void 0 : _q.tableComponent) === null || _r === void 0 ? void 0 : _r.bgWhite, true);
             _this.detailsClick = new core.EventEmitter();
             _this.checkedRowsChange = new core.EventEmitter();
             _this.visualizzaBaseFooter = true;
@@ -5469,6 +5299,7 @@
             _this.getPageSize = function () { return _this.externalPaginationSorting ? _this.paginationState.pageSize : _this.tableLength; };
             _this.getListSize = function () { return _this.externalPaginationSorting ? _this.paginationState.fullListSize : _this.dataSource.length; };
             _this.getCurrentPage = function () { return _this.externalPaginationSorting && _this.paginationState ? _this.paginationState.pageNumber : _this.currentPage; };
+            _this.getFullListSize = function () { var _a, _b; return _this.externalPaginationSorting ? (_a = _this.paginationState) === null || _a === void 0 ? void 0 : _a.fullListSize : (_b = _this.dataSource) === null || _b === void 0 ? void 0 : _b.length; };
             // Operatori per gestione selezione righe
             _this.isChecked = function (trcbValue) { return _this.righeSelezionate.some(function (value) { return value == trcbValue; }); };
             _this.isAllChecked = function () { return _this.righeSelezionabili.length > 0 && _this.righeSelezionabili.every(_this.isChecked); };
@@ -5949,10 +5780,10 @@
     TableComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'inail-table',
-                    template: "<div class=\"tabella table-responsive inail-table {{getResponsiveClass()}} noPaddingLeft {{class}} noPaddingRight\">\n\n  <h3 *ngIf=\"title\"\n      class=\"col-xs-9 table-title pull-left noPaddingLeft {{titleClass}}\"\n      [innerHTML]=\"title\">\n  </h3>\n\n  <a *ngIf=\"detailsLink\"\n     href=\"javascript:void(0)\"\n     (click)=\"detailsClick.emit()\"\n     class=\"col-xs-3 col-sm-2 linkDettagli pull-right\"\n     [innerHTML]=\"detailsLink\">\n  </a>\n\n  <div *ngIf=\"description\"\n       class=\"col-xs-12 caption marginBottom noPaddingLeft\"\n       [innerHTML]=\"description\">\n  </div>\n\n  <inail-table-page-length-selector *ngIf=\"visualizzaPaginazione()\"\n                                    [value]=\"getPageSize()\"\n                                    [tableId]=\"id\"\n                                    [options]=\"elementsPerPageOptions\"\n                                    (valueChange)=\"lengthOnChange($event)\"\n                                    [logOnConsole]=\"logOnConsole\"\n                                    (log)=\"log.emit($event)\">\n  </inail-table-page-length-selector>\n\n  <ng-container *ngIf=\"true\">\n\n    <table id=\"{{id}}\"\n           class=\"table display dataTable {{tableClass}}\"\n           [ngClass]=\"{'tabella-base': !tallRows, 'bg-white': bgWhite, 'bg-transparent': !bgWhite}\">\n\n      <caption *ngIf=\"caption\"\n               [ngClass]=\"{'sr-only': captionHidden}\"\n               [innerHTML]=\"caption\">\n      </caption>\n\n      <ng-content select=\"thead\"></ng-content>\n\n      <ng-container *ngIf=\"!noDataFound\">\n        <ng-content select=\"tbody\"></ng-content>\n      </ng-container>\n\n      <tbody *ngIf=\"noDataFound\">\n      <tr role=\"row\">\n        <td class=\"content-text\"\n            style=\"padding: 30px; text-align: center\"\n            [colSpan]=\"numeroColonne\"\n            [innerHTML]=\"noDataFoundText\">\n        </td>\n      </tr>\n      </tbody>\n    </table>\n\n    <div #baseFooter\n         class=\"col-xs-12 baseFooter noPaddingLeft\"\n         *ngIf=\"visualizzaBaseFooter\">\n      <ng-content select=\"[baseFooter]\"></ng-content>\n    </div>\n\n  </ng-container>\n\n  <inail-table-page-selector *ngIf=\"visualizzaPaginazione() && !this.noDataFound\"\n                             [listSize]=\"getListSize()\"\n                             [pageSize]=\"getPageSize()\"\n                             [currentPage]=\"getCurrentPage()\"\n                             [tableId]=\"id\"\n                             (select)=\"pageOnChange($event)\"\n                             [logOnConsole]=\"logOnConsole\"\n                             (log)=\"log.emit($event)\">\n  </inail-table-page-selector>\n\n</div>\n",
+                    template: "<div class=\"tabella table-responsive inail-table {{getResponsiveClass()}} noPaddingLeft {{class}} noPaddingRight\">\n\n  <h3 *ngIf=\"title\"\n      class=\"col-xs-9 table-title pull-left noPaddingLeft {{titleClass}}\"\n      [innerHTML]=\"title\">\n  </h3>\n\n  <a *ngIf=\"detailsLink\"\n     href=\"javascript:void(0)\"\n     (click)=\"detailsClick.emit()\"\n     class=\"col-xs-3 col-sm-2 linkDettagli pull-right\"\n     [innerHTML]=\"detailsLink\">\n  </a>\n\n  <div *ngIf=\"description\"\n       class=\"col-xs-12 caption marginBottom noPaddingLeft\"\n       [innerHTML]=\"description\">\n  </div>\n\n  <div>\n    <div *ngIf=\"showFullListSize\"\n         class=\"total-elements\">\n      <span [innerHTML]=\"fullListSizeText\"></span> {{getFullListSize() || 0}}\n    </div>\n\n    <inail-table-page-length-selector *ngIf=\"visualizzaPaginazione()\"\n                                      [value]=\"getPageSize()\"\n                                      [tableId]=\"id\"\n                                      [options]=\"elementsPerPageOptions\"\n                                      (valueChange)=\"lengthOnChange($event)\"\n                                      [logOnConsole]=\"logOnConsole\"\n                                      (log)=\"log.emit($event)\">\n    </inail-table-page-length-selector>\n  </div>\n\n  <ng-container *ngIf=\"true\">\n\n    <table id=\"{{id}}\"\n           class=\"table display dataTable {{tableClass}}\"\n           [ngClass]=\"{'tabella-base': !tallRows, 'bg-white': bgWhite, 'bg-transparent': !bgWhite}\">\n\n      <caption *ngIf=\"caption\"\n               [ngClass]=\"{'sr-only': captionHidden}\"\n               [innerHTML]=\"caption\">\n      </caption>\n\n      <ng-content select=\"thead\"></ng-content>\n\n      <ng-container *ngIf=\"!noDataFound\">\n        <ng-content select=\"tbody\"></ng-content>\n      </ng-container>\n\n      <tbody *ngIf=\"noDataFound\">\n      <tr role=\"row\">\n        <td class=\"content-text\"\n            style=\"padding: 30px; text-align: center\"\n            [colSpan]=\"numeroColonne\"\n            [innerHTML]=\"noDataFoundText\">\n        </td>\n      </tr>\n      </tbody>\n    </table>\n\n    <div #baseFooter\n         class=\"col-xs-12 baseFooter noPaddingLeft\"\n         *ngIf=\"visualizzaBaseFooter\">\n      <ng-content select=\"[baseFooter]\"></ng-content>\n    </div>\n\n  </ng-container>\n\n  <inail-table-page-selector *ngIf=\"visualizzaPaginazione() && !this.noDataFound\"\n                             [listSize]=\"getListSize()\"\n                             [pageSize]=\"getPageSize()\"\n                             [currentPage]=\"getCurrentPage()\"\n                             [tableId]=\"id\"\n                             (select)=\"pageOnChange($event)\"\n                             [logOnConsole]=\"logOnConsole\"\n                             (log)=\"log.emit($event)\">\n  </inail-table-page-selector>\n\n</div>\n",
                     changeDetection: CHANGE_DETECTION_STRATEGY,
                     encapsulation: core.ViewEncapsulation.None,
-                    styles: [".inail-table a.linkDettagli{color:#106cdb;-webkit-text-decoration-line:none;text-decoration-line:none}.inail-table a.linkDettagli:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.inail-table table.table.dataTable.bg-white>tbody>tr:not(:hover){background-color:#fff}.inail-table table.table.dataTable.bg-transparent>tbody>tr:not(:hover){background-color:initial}"]
+                    styles: [".inail-table a.linkDettagli{color:#106cdb;-webkit-text-decoration-line:none;text-decoration-line:none}.inail-table a.linkDettagli:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.inail-table table.table.dataTable.bg-white>tbody>tr:not(:hover){background-color:#fff}.inail-table table.table.dataTable.bg-transparent>tbody>tr:not(:hover){background-color:initial}.inail-table .total-elements{float:left;padding-top:12px}"]
                 },] }
     ];
     TableComponent.ctorParameters = function () { return [
@@ -5976,6 +5807,8 @@
         tallRows: [{ type: core.Input }],
         caption: [{ type: core.Input }],
         captionHidden: [{ type: core.Input }],
+        showFullListSize: [{ type: core.Input }],
+        fullListSizeText: [{ type: core.Input }],
         bgWhite: [{ type: core.Input }],
         description: [{ type: core.Input }],
         tableClass: [{ type: core.Input }],
@@ -6043,7 +5876,9 @@
             if (!this.addButton) {
                 this.fileChange.emit(this.fileModel);
             }
-            this.cleanError();
+            if (this.cleanErrorOnChange) {
+                this.cleanError();
+            }
             this.cdr.detectChanges();
         };
         InputFileComponent.prototype.reset = function () {
@@ -6076,6 +5911,7 @@
         inputText: [{ type: core.ViewChild, args: ['inputText', { static: true },] }]
     };
 
+    var ACCEPTED_INPUTS$1 = [',', '-', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'Backspace', 'Delete', "Tab", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
     var InputNumberComponent = /** @class */ (function (_super) {
         __extends(InputNumberComponent, _super);
         function InputNumberComponent(cdr, libConfig) {
@@ -6090,6 +5926,9 @@
             _this.numberOfDecimals = getConfigValue((_h = (_g = _this.libConfig) === null || _g === void 0 ? void 0 : _g.inputNumberComponent) === null || _h === void 0 ? void 0 : _h.numberOfDecimals, undefined);
             _this.hideArrows = getConfigValue((_k = (_j = _this.libConfig) === null || _j === void 0 ? void 0 : _j.inputNumberComponent) === null || _k === void 0 ? void 0 : _k.hideArrows, false);
             _this.valueChange = new core.EventEmitter();
+            _this.isFirstDigitComma = function (ev) { return ev.key == ',' && _this.inputValue == undefined; };
+            _this.isWrongMinus = function (ev) { return ev.key == '-' && ev.key == _this.previousDigit; };
+            _this.isWrongDigit = function (ev) { return _this.isFirstDigitComma(ev) || _this.isWrongMinus(ev); };
             _this.logPrefix = "[inail-input-number]";
             _super.prototype.overrideConfig.call(_this, libConfig === null || libConfig === void 0 ? void 0 : libConfig.inputNumberComponent);
             _this.detach();
@@ -6100,10 +5939,10 @@
             if (changes.value) {
                 this.previousValue = changes.value.previousValue;
                 this.normalizzaValore();
-                if (!changes.value.firstChange) {
-                    this.hasError = false;
-                    this.error = undefined;
-                }
+                // if (!changes.value.firstChange) {
+                //
+                //   this.cleanError()
+                // }
             }
             this.cdr.detectChanges();
         };
@@ -6147,7 +5986,9 @@
                 this.cdr.detectChanges();
                 this.emitDebug("this.valueChange.emit(" + value + ")");
                 this.valueChange.emit(value);
-                this.cleanError();
+                if (this.cleanErrorOnChange) {
+                    this.cleanError();
+                }
                 if (this.onChange) {
                     this.onChange(value);
                 }
@@ -6191,12 +6032,22 @@
             }
             return true;
         };
+        InputNumberComponent.prototype.onKeyDown = function (ev) {
+            // console.warn(ev)
+            // console.warn(`${this.inputValue}`)
+            if ((!ACCEPTED_INPUTS$1.some(function (v) { return v === ev.key; }) || this.isWrongDigit(ev)) && ev.ctrlKey == false) {
+                ev.preventDefault();
+            }
+            else {
+                this.previousDigit = ev.key;
+            }
+        };
         return InputNumberComponent;
     }(FormElementComponent));
     InputNumberComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'inail-input-number',
-                    template: "<div class=\"form-group {{getResponsiveClass()}} noPaddingLeft {{class}} inail-input-number\"\n     [ngClass]=\"{'has-error': isThereError(), 'no-arrows': hideArrows}\">\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  <input #formControl\n         type=\"number\"\n         [id]=\"id\"\n         class=\"form-control {{inputClass}}\"\n         [ngClass]=\"{'disabled': disabled}\"\n         [disabled]=\"disabled\"\n         [readonly]=\"readonly\"\n         [attr.name]=\"name\"\n         [attr.title]=\"title\"\n         [attr.max]=\"max\"\n         [attr.min]=\"min\"\n         [attr.step]=\"step\"\n         [attr.aria-required]=\"required === true ? true : undefined\"\n         [attr.aria-invalid]=\"isThereError() === true ? true : undefined\"\n         [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n         (keyup)=\"onKeyUp()\"\n         (blur)=\"onBlur()\"\n         (keyup.enter)=\"enterUp.emit()\"\n         [value]=\"inputValue\"\n         [(ngModel)]='value'>\n  <!--<input type=\"text\"\n         *ngIf=\"disabled\"\n         [id]=\"id\"\n         class=\"form-control disabled {{inputClass}}\"\n         [attr.name]=\"name\"\n         [attr.title]=\"title\"\n         [disabled]=\"disabled\"\n         [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n         [ngModel]='value'>-->\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",
+                    template: "<div class=\"form-group {{getResponsiveClass()}} noPaddingLeft {{class}} inail-input-number\"\n     [ngClass]=\"{'has-error': isThereError(), 'no-arrows': hideArrows}\">\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  <input #formControl\n         type=\"number\"\n         [id]=\"id\"\n         class=\"form-control {{inputClass}}\"\n         [ngClass]=\"{'disabled': disabled}\"\n         [disabled]=\"disabled\"\n         [readonly]=\"readonly\"\n         [attr.name]=\"name\"\n         [attr.title]=\"title\"\n         [attr.max]=\"max\"\n         [attr.min]=\"min\"\n         [attr.step]=\"step\"\n         [attr.aria-required]=\"required === true ? true : undefined\"\n         [attr.aria-invalid]=\"isThereError() === true ? true : undefined\"\n         [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n         (keyup)=\"onKeyUp()\"\n         (blur)=\"onBlur()\"\n         (keydown)=\"onKeyDown($event)\"\n         (keyup.enter)=\"enterUp.emit()\"\n         [value]=\"inputValue\"\n         [(ngModel)]='value'>\n  <!--<input type=\"text\"\n         *ngIf=\"disabled\"\n         [id]=\"id\"\n         class=\"form-control disabled {{inputClass}}\"\n         [attr.name]=\"name\"\n         [attr.title]=\"title\"\n         [disabled]=\"disabled\"\n         [attr.aria-describedBy]=\"getAriaDescribedBy()\"\n         [ngModel]='value'>-->\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,
                     providers: [
@@ -6721,11 +6572,15 @@
             if (!cb.firstChange) {
                 if (cb.checked && !this.isChecked(cb.value)) {
                     this.pushValue(cb.value);
-                    this.cleanError();
+                    if (this.cleanErrorOnChange) {
+                        this.cleanError();
+                    }
                 }
                 else if (!cb.checked && this.isChecked(cb.value)) {
                     this.values = this.values.filter(function (value) { return value != cb.value; });
-                    this.cleanError();
+                    if (this.cleanErrorOnChange) {
+                        this.cleanError();
+                    }
                 }
                 this.valuesChange.emit(this.values);
                 this.inputTextValue = this.getInputTextValue();
@@ -6760,7 +6615,7 @@
 
     var HM_PLACEHOLDER = 'HH:MM';
     var HMS_PLACEHOLDER = 'HH:MM:SS';
-    var ACCEPTED_INPUTS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'Backspace', 'Delete'];
+    var ACCEPTED_INPUTS$2 = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'Backspace', 'Delete', "Tab", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
     var InputTimeComponent = /** @class */ (function (_super) {
         __extends(InputTimeComponent, _super);
         function InputTimeComponent(cdr, libConfig) {
@@ -6846,12 +6701,16 @@
                         this.setDescError(this.selfValidationError);
                     }
                     else {
-                        this.cleanError();
+                        if (this.cleanErrorOnChange) {
+                            this.cleanError();
+                        }
                     }
                 }
                 else {
                     this.inputValue = value;
-                    this.cleanError();
+                    if (this.cleanErrorOnChange) {
+                        this.cleanError();
+                    }
                 }
                 this.cdr.detectChanges();
                 this.emitDebug("this.valueChange.emit(" + this.inputValue + ")");
@@ -6884,10 +6743,38 @@
             }
         };
         InputTimeComponent.prototype.onKeyDown = function (ev) {
-            if (!ACCEPTED_INPUTS.some(function (v) { return v === ev.key; }) && ev.ctrlKey == false) {
+            if (!ACCEPTED_INPUTS$2.some(function (v) { return v === ev.key; }) && ev.ctrlKey == false) {
                 ev.preventDefault();
             }
         };
+        InputTimeComponent.prototype.onFocusOut = function () {
+            this.completaValoreInInput();
+        };
+        InputTimeComponent.prototype.completaParteOrario = function (value) {
+            if (isBlankOrNull(value)) {
+                value = '00';
+            }
+            else if (value.length == 1) {
+                value = "0" + value;
+            }
+            return value;
+        };
+        InputTimeComponent.prototype.completaValoreInInput = function () {
+            if (isNotBlankOrNull(this.inputValue) && (this.inputValue.length < 5 || (this.withSeconds && this.inputValue.length < 8))) {
+                var partiOrario = this.inputValue.split(':');
+                var numeroParti = this.withSeconds ? 3 : 2;
+                for (var i = 0; i < numeroParti; i++) {
+                    partiOrario[i] = this.completaParteOrario(partiOrario[i]);
+                }
+                var value = partiOrario[0] + ":" + partiOrario[1];
+                if (partiOrario[2]) {
+                    value = value + ":" + partiOrario[2];
+                }
+                if (value && this.isValidValue(value)) {
+                    this.setValue(value);
+                }
+            }
+        };
         InputTimeComponent.prototype.ngOnDestroy = function () {
             _super.prototype.ngOnDestroy.call(this);
         };
@@ -6896,7 +6783,7 @@
     InputTimeComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'inail-input-time',
-                    template: "<div class=\"form-group {{getResponsiveClass()}} noPaddingLeft {{class}} inail-input-time\"\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           [id]=\"id\"\n           [attr.type]=\"getType()\"\n           [attr.step]=\"getStep()\"\n           class=\"form-control {{inputClass}}\"\n           [ngClass]=\"{'disabled': disabled}\"\n           [attr.name]=\"name\"\n           [attr.title]=\"title\"\n           [attr.maxlength]=\"getMaxLength()\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           [attr.placeholder]=\"placeholderVisualizzato\"\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           (keydown)=\"onKeyDown($event)\"\n           (paste)=\"onPaste($event)\"\n           (keyup.enter)=\"enterUp.emit()\"\n           [(ngModel)]=\"value\">\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  <debug-pre *ngIf=\"showState\">\n    <state-propertie [label]=\"'id'\" [propertie]=\"id\"></state-propertie>\n    <state-propertie [label]=\"'label'\" [propertie]=\"label\"></state-propertie>\n    <state-propertie [label]=\"'inputValue'\" [propertie]=\"inputValue\"></state-propertie>\n    <state-propertie [label]=\"'placeholder'\" [propertie]=\"placeholder\"></state-propertie>\n    <state-propertie [label]=\"'defaultPlaceholder'\" [propertie]=\"defaultPlaceholder\"></state-propertie>\n    <inail-form-element-state-properties [formElement]=\"this\"></inail-form-element-state-properties>\n  </debug-pre>\n</div>\n",
+                    template: "<div class=\"form-group {{getResponsiveClass()}} noPaddingLeft {{class}} inail-input-time\"\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           [id]=\"id\"\n           [attr.type]=\"getType()\"\n           [attr.step]=\"getStep()\"\n           class=\"form-control {{inputClass}}\"\n           [ngClass]=\"{'disabled': disabled}\"\n           [attr.name]=\"name\"\n           [attr.title]=\"title\"\n           [attr.maxlength]=\"getMaxLength()\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           [attr.placeholder]=\"placeholderVisualizzato\"\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           (focusout)=\"onFocusOut()\"\n           (keydown)=\"onKeyDown($event)\"\n           (paste)=\"onPaste($event)\"\n           (keyup.enter)=\"enterUp.emit()\"\n           [(ngModel)]=\"value\">\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  <debug-pre *ngIf=\"showState\">\n    <state-propertie [label]=\"'id'\" [propertie]=\"id\"></state-propertie>\n    <state-propertie [label]=\"'label'\" [propertie]=\"label\"></state-propertie>\n    <state-propertie [label]=\"'inputValue'\" [propertie]=\"inputValue\"></state-propertie>\n    <state-propertie [label]=\"'placeholder'\" [propertie]=\"placeholder\"></state-propertie>\n    <state-propertie [label]=\"'defaultPlaceholder'\" [propertie]=\"defaultPlaceholder\"></state-propertie>\n    <inail-form-element-state-properties [formElement]=\"this\"></inail-form-element-state-properties>\n  </debug-pre>\n</div>\n",
                     changeDetection: CHANGE_DETECTION_STRATEGY,
                     encapsulation: core.ViewEncapsulation.None,
                     providers: [