@esfaenza/forms-and-validations 11.2.49 → 11.2.52

package/bundles/esfaenza-forms-and-validations.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/datepicker'), require('@angular/material/autocomplete'), require('@angular/material/input'), require('@esfaenza/localizations'), require('@esfaenza/material-dayjs-adapter'), require('@esfaenza/ngx-currency-mask'), require('angular2-multiselect-dropdown'), require('@angular-material-components/datetime-picker'), require('ngx-bootstrap/tooltip'), require('@angular/material/core'), require('@esfaenza/extensions'), require('@esfaenza/access-control')) :
-    typeof define === 'function' && define.amd ? define('@esfaenza/forms-and-validations', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/datepicker', '@angular/material/autocomplete', '@angular/material/input', '@esfaenza/localizations', '@esfaenza/material-dayjs-adapter', '@esfaenza/ngx-currency-mask', 'angular2-multiselect-dropdown', '@angular-material-components/datetime-picker', 'ngx-bootstrap/tooltip', '@angular/material/core', '@esfaenza/extensions', '@esfaenza/access-control'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.esfaenza = global.esfaenza || {}, global.esfaenza['forms-and-validations'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.datepicker, global.ng.material.autocomplete, global.ng.material.input, global.localizations, global.materialDayjsAdapter, global.ngxCurrencyMask, global.angular2MultiselectDropdown, global.datetimePicker, global.tooltip, global.ng.material.core, global.extensions, global.accessControl));
-}(this, (function (exports, core, common, forms, datepicker, autocomplete, input, localizations, materialDayjsAdapter, ngxCurrencyMask, angular2MultiselectDropdown, datetimePicker, tooltip, core$1, extensions, accessControl) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/core'), require('@esfaenza/material-dayjs-adapter'), require('@angular/common'), require('@angular/forms'), require('@angular/material/datepicker'), require('@angular/material/autocomplete'), require('@angular/material/input'), require('@esfaenza/localizations'), require('@esfaenza/ngx-currency-mask'), require('angular2-multiselect-dropdown'), require('@angular-material-components/datetime-picker'), require('ngx-bootstrap/tooltip'), require('@esfaenza/extensions'), require('@esfaenza/access-control')) :
+    typeof define === 'function' && define.amd ? define('@esfaenza/forms-and-validations', ['exports', '@angular/core', '@angular/material/core', '@esfaenza/material-dayjs-adapter', '@angular/common', '@angular/forms', '@angular/material/datepicker', '@angular/material/autocomplete', '@angular/material/input', '@esfaenza/localizations', '@esfaenza/ngx-currency-mask', 'angular2-multiselect-dropdown', '@angular-material-components/datetime-picker', 'ngx-bootstrap/tooltip', '@esfaenza/extensions', '@esfaenza/access-control'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.esfaenza = global.esfaenza || {}, global.esfaenza['forms-and-validations'] = {}), global.ng.core, global.ng.material.core, global.materialDayjsAdapter, global.ng.common, global.ng.forms, global.ng.material.datepicker, global.ng.material.autocomplete, global.ng.material.input, global.localizations, global.ngxCurrencyMask, global.angular2MultiselectDropdown, global.datetimePicker, global.tooltip, global.extensions, global.accessControl));
+}(this, (function (exports, core, core$1, materialDayjsAdapter, common, forms, datepicker, autocomplete, input, localizations, ngxCurrencyMask, angular2MultiselectDropdown, datetimePicker, tooltip, extensions, accessControl) { 'use strict';
 
     /**
      * Classe che identifica un file
@@ -337,49 +337,6 @@
         return value;
     }
 
-    /**
-     * Token che indica la lingua da utilizzare, sono supportate "it-IT" ed "en-US"
-     */
-    var FAV_LOCALE = new core.InjectionToken('FAV_LOCALE');
-    /**
-     * Chiave che indica il prefisso dei Contesti Applicativi per permettere l'abilitazione/disabilitazione di input in maniera contestuale
-     */
-    var ACO_CUSTOMKEY = new core.InjectionToken('ACO_CUSTOMKEY');
-
-    // Angular
-    /**
-     * Direttiva utilizzata per validazioni "required" custom, in modo da poter dire che anche se c'è un valore selezionato, ma quel valore lo considero null
-     * allora la validazione fallisce. Attualmente usato nell'unico punto sensato: validation-select
-     */
-    var CustomRequiredDirective = /** @class */ (function () {
-        function CustomRequiredDirective() {
-            /**
-             * Lista di valori che vengono considerati "vuoti" seppur presenti
-             */
-            this.NullValues = [];
-        }
-        /**
-         * @ignore
-         */
-        CustomRequiredDirective.prototype.validate = function (c) {
-            // Controllo solo per custom required a true, altrimenti qualsiasi valore mi va bene
-            if (this.customRequired != "true")
-                return null;
-            return !c.value || this.NullValues.includes(c.value) ? { required: true } : null;
-        };
-        return CustomRequiredDirective;
-    }());
-    CustomRequiredDirective.decorators = [
-        { type: core.Directive, args: [{
-                    selector: '[customRequired]',
-                    providers: [{ provide: forms.NG_VALIDATORS, useExisting: CustomRequiredDirective, multi: true }]
-                },] }
-    ];
-    CustomRequiredDirective.propDecorators = {
-        NullValues: [{ type: core.Input, args: ["CustomNullValues",] }],
-        customRequired: [{ type: core.Input, args: ['customRequired',] }]
-    };
-
     /**
      * Espansione dell'adapter di default di DayJs già utilizzato per i bind base su Material.
      *
@@ -461,6 +418,49 @@
         { type: String, decorators: [{ type: core.Inject, args: [core$1.MAT_DATE_LOCALE,] }] }
     ]; };
 
+    /**
+     * Token che indica la lingua da utilizzare, sono supportate "it-IT" ed "en-US"
+     */
+    var FAV_LOCALE = new core.InjectionToken('FAV_LOCALE');
+    /**
+     * Chiave che indica il prefisso dei Contesti Applicativi per permettere l'abilitazione/disabilitazione di input in maniera contestuale
+     */
+    var ACO_CUSTOMKEY = new core.InjectionToken('ACO_CUSTOMKEY');
+
+    // Angular
+    /**
+     * Direttiva utilizzata per validazioni "required" custom, in modo da poter dire che anche se c'è un valore selezionato, ma quel valore lo considero null
+     * allora la validazione fallisce. Attualmente usato nell'unico punto sensato: validation-select
+     */
+    var CustomRequiredDirective = /** @class */ (function () {
+        function CustomRequiredDirective() {
+            /**
+             * Lista di valori che vengono considerati "vuoti" seppur presenti
+             */
+            this.NullValues = [];
+        }
+        /**
+         * @ignore
+         */
+        CustomRequiredDirective.prototype.validate = function (c) {
+            // Controllo solo per custom required a true, altrimenti qualsiasi valore mi va bene
+            if (this.customRequired != "true")
+                return null;
+            return !c.value || this.NullValues.includes(c.value) ? { required: true } : null;
+        };
+        return CustomRequiredDirective;
+    }());
+    CustomRequiredDirective.decorators = [
+        { type: core.Directive, args: [{
+                    selector: '[customRequired]',
+                    providers: [{ provide: forms.NG_VALIDATORS, useExisting: CustomRequiredDirective, multi: true }]
+                },] }
+    ];
+    CustomRequiredDirective.propDecorators = {
+        NullValues: [{ type: core.Input, args: ["CustomNullValues",] }],
+        customRequired: [{ type: core.Input, args: ['customRequired',] }]
+    };
+
     // Angular
     /**
      * Classe astratta base che contiene le logiche / proprietà in comune a tutti i validatori
@@ -534,6 +534,14 @@
              * Evento che sostituisce l'ngModelChange facendolo funzionare in maniera un po' più consistente
              */
             this.inputChange = new core.EventEmitter();
+            /**
+             * Evento che indica il focus avvenuto su un controllo
+             */
+            this.inputFocus = new core.EventEmitter();
+            /**
+             * Evento che indica la finalizzazione del valore avvenuta su un controllo
+             */
+            this.inputFinalized = new core.EventEmitter();
             /**
              * @ignore
              */
@@ -663,6 +671,20 @@
             isDisabled ? this.baseInput.control.disable() : this.baseInput.control.enable();
             this.readonly = isDisabled;
         };
+        /**
+         * L'emit del focus dell'elemento
+         *
+         * @param {any} toEmit valore da propagare all'esterno
+         */
+        BaseValidation.prototype.onFocus = function (toEmit) {
+            this.inputFocus.emit(toEmit);
+        };
+        /**
+         * Finalizzazione Input
+         */
+        BaseValidation.prototype.onFinalize = function () {
+            this.inputFinalized.emit();
+        };
         return BaseValidation;
     }());
     BaseValidation.decorators = [
@@ -686,6 +708,8 @@
         autocomplete: [{ type: core.Input }],
         id: [{ type: core.Input }],
         inputChange: [{ type: core.Output }],
+        inputFocus: [{ type: core.Output }],
+        inputFinalized: [{ type: core.Output }],
         submitted: [{ type: core.Input, args: ["submitted",] }],
         forceInvalid: [{ type: core.Input }]
     };
@@ -845,7 +869,7 @@
     ValidationSelectComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-select",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n    <select matNativeControl\r\n            #baseInput=\"ngModel\"\r\n            name=\"val-select\"\r\n            class=\"form-control\"\r\n            triggers=\"\"\r\n            placement=\"top\"\r\n            id=\"{{id}}\"\r\n            [customRequired]=\"required ? 'true' : 'false'\"\r\n            [CustomNullValues]=\"[placeHolderValue,emptyFieldValue]\"\r\n            [(ngModel)]=\"value\"\r\n            [tooltip]=\"tolTemplate\"\r\n            [class.checking-combo]=\"!noValidate\"\r\n            [class.app-option-placeholder]=\"baseInput.value === placeHolderValue\"\r\n            [class.no-bg-img]=\"!showValidationSymbol\"\r\n            [disabled]=\"readonly\"\r\n            (focus)=\"checkTooltip()\"\r\n            (blur)=\"closeTooltip(); onBlur.emit(true);\"\r\n            (ngModelChange)=\"onModelChange($event)\">\r\n\r\n        <option *ngIf=\"placeholder\" [value]=\"placeHolderValue\" disabled selected hidden>{{placeholder}}</option>\r\n        <option *ngIf=\"required == false && emptyValue\" [value]=\"emptyFieldValue\"></option>\r\n        <ng-content></ng-content>\r\n    </select>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n    <select matNativeControl\r\n            #baseInput=\"ngModel\"\r\n            name=\"val-select\"\r\n            class=\"form-control\"\r\n            triggers=\"\"\r\n            placement=\"top\"\r\n            id=\"{{id}}\"\r\n            [customRequired]=\"required ? 'true' : 'false'\"\r\n            [CustomNullValues]=\"[placeHolderValue,emptyFieldValue]\"\r\n            [(ngModel)]=\"value\"\r\n            [tooltip]=\"tolTemplate\"\r\n            [class.checking-combo]=\"!noValidate\"\r\n            [class.app-option-placeholder]=\"baseInput.value === placeHolderValue\"\r\n            [class.no-bg-img]=\"!showValidationSymbol\"\r\n            [disabled]=\"readonly\"\r\n            (click)=\"onFocus($event)\"\r\n            (focus)=\"checkTooltip();\"\r\n            (blur)=\"closeTooltip(); onBlur.emit(true);\"\r\n            (ngModelChange)=\"onModelChange($event); onFinalize()\">\r\n\r\n        <option *ngIf=\"placeholder\" [value]=\"placeHolderValue\" disabled selected hidden>{{placeholder}}</option>\r\n        <option *ngIf=\"required == false && emptyValue\" [value]=\"emptyFieldValue\"></option>\r\n        <ng-content></ng-content>\r\n    </select>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
@@ -1009,7 +1033,7 @@
     ValidationDateComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-date",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <input matInput\r\n           [matDatepicker]=\"datepicker\"\r\n           #baseInput=\"ngModel\"\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           name=\"val-date\"\r\n           class=\"form-control {{class}}\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           id=\"{{id}}\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [placeholder]=\"placeholder ? '' : _format\"\r\n           [disabled]=\"readonly || disabled\"\r\n           [isDisabled]=\"readonly || disabled\"\r\n           (dateChange)=\"outputValue($event)\" />\r\n    <mat-datepicker-toggle matSuffix [for]=\"datepicker\"></mat-datepicker-toggle>\r\n    <mat-datepicker #datepicker></mat-datepicker>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <input matInput\r\n           [matDatepicker]=\"datepicker\"\r\n           #baseInput=\"ngModel\"\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           name=\"val-date\"\r\n           class=\"form-control {{class}}\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           id=\"{{id}}\"\r\n           (click)=\"onFocus($event)\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [placeholder]=\"placeholder ? '' : _format\"\r\n           [disabled]=\"readonly || disabled\"\r\n           [isDisabled]=\"readonly || disabled\"\r\n           (dateChange)=\"outputValue($event)\" \r\n           (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n           (blur)=\"closeTooltip(); onFinalize();\"\r\n           />\r\n    <mat-datepicker-toggle matSuffix [for]=\"datepicker\"></mat-datepicker-toggle>\r\n    <mat-datepicker #datepicker></mat-datepicker>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
@@ -1186,7 +1210,7 @@
     ValidationInputComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-input",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label [class.app-margin-left-25]=\"HasPrefix\" *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <ng-container *ngIf=\"HasPrefix\">\r\n        <ng-container *ngTemplateOutlet=\"prefix_internal\"></ng-container>\r\n    </ng-container>\r\n\r\n    <input matInput\r\n           #baseInput='ngModel'\r\n           type=\"{{type}}\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           name=\"val-input\"\r\n           class=\"form-control {{class}}\"\r\n           id=\"{{id}}\"\r\n           [class.app-margin-left-25]=\"HasPrefix\"\r\n           [class.mat-input-with-suffix]=\"HasSuffix || Password || showWarning\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate && !showWarning\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [disabled]=\"readonly || disabled\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           (focus)=\"checkTooltip();\"\r\n           (blur)=\"closeTooltip();\">\r\n    <ng-container *ngIf=\"HasSuffix || Password || showWarning\">\r\n        <ng-container *ngIf=\"!Password && !showWarning\">\r\n            <ng-container *ngTemplateOutlet=\"suffix_internal\"></ng-container>\r\n        </ng-container>\r\n\r\n        <span class=\"form-input-suffix\" *ngIf=\"Password || showWarning\">\r\n            <ng-container *ngIf=\"Password\" matSuffix>\r\n                <a *ngIf=\"passShown\" class=\"fa fa-eye-slash app-fs-16 app-pointer\" (click)=\"type = 'password'; passShown = !passShown; $event.preventDefault()\"></a>\r\n                <a *ngIf=\"!passShown\" class=\"fa fa-eye app-fs-16 app-pointer\" (click)=\"type = 'text'; passShown = !passShown; $event.preventDefault()\"></a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"showWarning\" matSuffix>\r\n                <span title=\"{{warningTitle}}\" class=\"{{warningClass}} text-warning app-fs-16\"></span>\r\n            </ng-container>\r\n        </span>\r\n    </ng-container>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label [class.app-margin-left-25]=\"HasPrefix\" *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <ng-container *ngIf=\"HasPrefix\">\r\n        <ng-container *ngTemplateOutlet=\"prefix_internal\"></ng-container>\r\n    </ng-container>\r\n\r\n    <input matInput\r\n           #baseInput='ngModel'\r\n           type=\"{{type}}\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           name=\"val-input\"\r\n           class=\"form-control {{class}}\"\r\n           id=\"{{id}}\"\r\n           [class.app-margin-left-25]=\"HasPrefix\"\r\n           [class.mat-input-with-suffix]=\"HasSuffix || Password || showWarning\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate && !showWarning\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [disabled]=\"readonly || disabled\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           (click)=\"onFocus($event)\"\r\n           (focus)=\"checkTooltip();\"\r\n           (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n           (blur)=\"closeTooltip(); onFinalize();\"\r\n           >\r\n    <ng-container *ngIf=\"HasSuffix || Password || showWarning\">\r\n        <ng-container *ngIf=\"!Password && !showWarning\">\r\n            <ng-container *ngTemplateOutlet=\"suffix_internal\"></ng-container>\r\n        </ng-container>\r\n\r\n        <span class=\"form-input-suffix\" *ngIf=\"Password || showWarning\">\r\n            <ng-container *ngIf=\"Password\" matSuffix>\r\n                <a *ngIf=\"passShown\" class=\"fa fa-eye-slash app-fs-16 app-pointer\" (click)=\"type = 'password'; passShown = !passShown; $event.preventDefault()\"></a>\r\n                <a *ngIf=\"!passShown\" class=\"fa fa-eye app-fs-16 app-pointer\" (click)=\"type = 'text'; passShown = !passShown; $event.preventDefault()\"></a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"showWarning\" matSuffix>\r\n                <span title=\"{{warningTitle}}\" class=\"{{warningClass}} text-warning app-fs-16\"></span>\r\n            </ng-container>\r\n        </span>\r\n    </ng-container>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
                         { provide: localizations.LocalizationService, useClass: BaseValidationLoc },
@@ -1235,7 +1259,7 @@
     ValidationCurrencyComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-currency",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <input #baseInput='ngModel'\r\n           currencyMask\r\n           matInput\r\n           [readonly]=\"readonly\"\r\n           [options]='CurrencyOptions'\r\n           [(ngModel)]=\"value\"\r\n           name=\"val-input\"\r\n           id=\"{{id}}\"\r\n           (focus)=\"checkTooltip()\"\r\n           (blur)=\"closeTooltip()\"\r\n           class=\"form-control {{class}}\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           type=\"{{type}}\"\r\n           [tooltip]=\"tolTemplate\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           autocomplete=\"{{autocomplete}}\" />\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div>\r\n        <span class=\"close-button pull-right\" (click)=\"closeTooltip()\" aria-label=\"Close\">\r\n            <span aria-hidden=\"true\">&times;</span>\r\n        </span>\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <input #baseInput='ngModel'\r\n           currencyMask\r\n           matInput\r\n           [readonly]=\"readonly\"\r\n           [options]='CurrencyOptions'\r\n           [(ngModel)]=\"value\"\r\n           name=\"val-input\"\r\n           id=\"{{id}}\"\r\n           (click)=\"onFocus($event)\"\r\n           (focus)=\"checkTooltip();\"\r\n           (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n           (blur)=\"closeTooltip(); onFinalize();\"\r\n           class=\"form-control {{class}}\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           type=\"{{type}}\"\r\n           [tooltip]=\"tolTemplate\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           autocomplete=\"{{autocomplete}}\" />\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div>\r\n        <span class=\"close-button pull-right\" (click)=\"closeTooltip()\" aria-label=\"Close\">\r\n            <span aria-hidden=\"true\">&times;</span>\r\n        </span>\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
                         { provide: localizations.LocalizationService, useClass: BaseValidationLoc },
@@ -1282,7 +1306,7 @@
     ValidationTextAreaComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-textarea",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-full-height mat-no-border-top mat-height-auto\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <textarea #baseInput=\"ngModel\"\r\n              matInput\r\n              [(ngModel)]=\"value\"\r\n              name=\"val-textarea\"\r\n              triggers=\"\"\r\n              class=\"app-no-resize form-control {{class}}\"\r\n              id=\"{{id}}\"\r\n              [class.checking-field]=\"!noValidate\"\r\n              rows=\"{{rows}}\"\r\n              [tooltip]=\"tolTemplate\"\r\n              placement=\"top\"\r\n              (focus)=\"checkTooltip()\"\r\n              (blur)=\"closeTooltip()\"\r\n              (ngModelChange)=\"onModelChange($event)\">\r\n    </textarea>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-full-height mat-no-border-top mat-height-auto\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n    <textarea #baseInput=\"ngModel\"\r\n              matInput\r\n              [(ngModel)]=\"value\"\r\n              name=\"val-textarea\"\r\n              triggers=\"\"\r\n              class=\"app-no-resize form-control {{class}}\"\r\n              id=\"{{id}}\"\r\n              [class.checking-field]=\"!noValidate\"\r\n              rows=\"{{rows}}\"\r\n              [tooltip]=\"tolTemplate\"\r\n              placement=\"top\"\r\n              (click)=\"onFocus($event)\"\r\n              (focus)=\"checkTooltip();\"\r\n              (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n              (blur)=\"closeTooltip(); onFinalize();\"\r\n              (ngModelChange)=\"onModelChange($event)\">\r\n    </textarea>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     providers: [
                         { provide: localizations.LocalizationService, useClass: BaseValidationLoc },
                         {
@@ -1469,7 +1493,7 @@
     ValidationDateTimeComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-datetime",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n\r\n    <input matInput \r\n           [ngxMatDatetimePicker]=\"datepicker\" \r\n           #baseInput=\"ngModel\"\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           name=\"val-date\"\r\n           id=\"{{id}}\"\r\n           class=\"form-control {{class}}\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [placeholder]=\"placeholder ? '' : _format\"\r\n           [disabled]=\"readonly || disabled\"\r\n           [isDisabled]=\"readonly || disabled\"\r\n           (dateChange)=\"outputValue($event)\"/>\r\n\r\n  <mat-datepicker-toggle matSuffix [for]=\"datepicker\"></mat-datepicker-toggle>\r\n\r\n  <ngx-mat-datetime-picker #datepicker \r\n            [showSpinners]=\"showSpinners\" \r\n            [showSeconds]=\"showSeconds\" \r\n            [stepHour]=\"stepHour\" \r\n            [stepMinute]=\"stepMinute\" \r\n            [stepSecond]=\"stepSecond\" \r\n            [touchUi]=\"false\" \r\n            [color]=\"'primary'\">\r\n  </ngx-mat-datetime-picker>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"placeholder\">{{placeholder}}</mat-label>\r\n\r\n    <input matInput \r\n           [ngxMatDatetimePicker]=\"datepicker\" \r\n           #baseInput=\"ngModel\"\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           name=\"val-date\"\r\n           id=\"{{id}}\"\r\n           (click)=\"onFocus($event)\"\r\n           class=\"form-control {{class}}\"\r\n           autocomplete=\"{{autocomplete}}\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [placeholder]=\"placeholder ? '' : _format\"\r\n           [disabled]=\"readonly || disabled\"\r\n           [isDisabled]=\"readonly || disabled\"\r\n           (dateChange)=\"outputValue($event)\"\r\n           (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n           (blur)=\"closeTooltip(); onFinalize();\"\r\n           />\r\n\r\n  <mat-datepicker-toggle matSuffix [for]=\"datepicker\"></mat-datepicker-toggle>\r\n\r\n  <ngx-mat-datetime-picker #datepicker \r\n            [showSpinners]=\"showSpinners\" \r\n            [showSeconds]=\"showSeconds\" \r\n            [stepHour]=\"stepHour\" \r\n            [stepMinute]=\"stepMinute\" \r\n            [stepSecond]=\"stepSecond\" \r\n            [touchUi]=\"false\" \r\n            [color]=\"'primary'\">\r\n  </ngx-mat-datetime-picker>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
@@ -1614,7 +1638,7 @@
     ValidationAutocompleteComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "val-autocomplete",
-                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n    <input matInput\r\n           #baseInput='ngModel'\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           placeholder=\"{{placeholder}}\"\r\n           [matAutocomplete]=\"auto\"\r\n           name=\"val-input\"\r\n           id=\"{{id}}\"\r\n           class=\"form-control {{class}}\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [disabled]=\"readonly || disabled\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           (focus)=\"checkTooltip();\"\r\n           (blur)=\"closeTooltip();\">\r\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\">\r\n        <mat-option *ngFor=\"let option of FilteredSource\" [value]=\"option.id\">\r\n            {{option.description}}\r\n        </mat-option>\r\n    </mat-autocomplete>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
+                    template: "<mat-form-field appearance=\"outline\" class=\"mat-full-width mat-no-border-top mat-height-fixed\" [style.width.px]=\"widthPx\">\r\n    <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n    <input matInput\r\n           #baseInput='ngModel'\r\n           type=\"text\"\r\n           triggers=\"\"\r\n           placement=\"top\"\r\n           placeholder=\"{{placeholder}}\"\r\n           [matAutocomplete]=\"auto\"\r\n           name=\"val-input\"\r\n           id=\"{{id}}\"\r\n           class=\"form-control {{class}}\"\r\n           [(ngModel)]=\"value\"\r\n           [class.checking-field]=\"!noValidate\"\r\n           [tooltip]=\"tolTemplate\"\r\n           [disabled]=\"readonly || disabled\"\r\n           (ngModelChange)=\"onModelChange($event)\"\r\n           (click)=\"onFocus($event)\"\r\n           (focus)=\"checkTooltip();\"\r\n           (keyup)=\"$event.keyCode == 13 && onFinalize();\"\r\n           (blur)=\"closeTooltip(); onFinalize();\"\r\n           >\r\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\">\r\n        <mat-option *ngFor=\"let option of FilteredSource\" [value]=\"option.id\">\r\n            {{option.description}}\r\n        </mat-option>\r\n    </mat-autocomplete>\r\n</mat-form-field>\r\n\r\n<ng-template #tolTemplate>\r\n    <div (click)=\"closeTooltip()\">\r\n        <span>{{validationFailed}}</span>\r\n    </div>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     providers: [
                         { provide: localizations.LocalizationService, useClass: BaseValidationLoc },
@@ -1704,6 +1728,10 @@
              * Utilizza o meno il Layout di un form (Label con input di fianco), se false mostra solo l'input
              */
             this.FormLayout = true;
+            /**
+             * Definisce se richiamare l'EventEmitter **inputChange** in maniera classica (true) o solo per la change considerate definitive come tasto invio / blur / ecc... (false)
+             */
+            this.EmitPendingChanges = true;
             /**
              * Attiva o disattiva la validazione per questo componente
              */
@@ -1767,6 +1795,14 @@
              * Evento chiamato alla modifica del valore collegato a questo campo
              */
             this.inputChange = new core.EventEmitter();
+            /**
+             * Evento chiamato al focus del campo di testo/combo/quelcheè, riemitta l'evento originale Javascript
+             */
+            this.inputFocus = new core.EventEmitter();
+            /**
+             * Evento chiamato al finalize del campo di testo/combo/quelcheè
+             */
+            this.inputFinalized = new core.EventEmitter();
             /**
              * Cache delle condizioni scritte tipo :prop?(Roba con {prop})
              */
@@ -2094,6 +2130,26 @@
             if (markForCheck)
                 this.cdr.markForCheck();
         };
+        /**
+         * @ignore
+         * Classico "spara fuori" sul focus. Mantengo lo stesso nome dell'evento dei <val-*> (inputChange) per retrocompatibilità.
+         *
+         * Non posso tenerlo protected altrimenti posso eseguirlo solo dal .ts e non dall' .html
+         */
+        BaseFormControl.prototype.focused = function (event) {
+            this.inputFocus.emit(event);
+            console.log("Control Focused: " + this.GeneratedName);
+        };
+        /**
+         * @ignore
+         * Classico "spara fuori" sulla finalizzazione del valore dell'input (blur / tasto invio, ecc...). Mantengo lo stesso nome dell'evento dei <val-*> (inputChange) per retrocompatibilità.
+         *
+         * Non posso tenerlo protected altrimenti posso eseguirlo solo dal .ts e non dall' .html
+         */
+        BaseFormControl.prototype.finalized = function () {
+            this.inputFinalized.emit();
+            console.log("Control Value Finalized: " + this.GeneratedName);
+        };
         return BaseFormControl;
     }());
     BaseFormControl.decorators = [
@@ -2110,6 +2166,7 @@
     ]; };
     BaseFormControl.propDecorators = {
         FormLayout: [{ type: core.Input }],
+        EmitPendingChanges: [{ type: core.Input }],
         Validation: [{ type: core.Input }],
         Placeholder: [{ type: core.Input }],
         FormGroupClass: [{ type: core.Input }],
@@ -2127,7 +2184,9 @@
         LabelInputRatio: [{ type: core.Input }],
         _validationControl: [{ type: core.ViewChild, args: ["validationControl", { static: false },] }],
         validationControl_static: [{ type: core.ViewChild, args: ["validationControl", { static: true },] }],
-        inputChange: [{ type: core.Output }]
+        inputChange: [{ type: core.Output }],
+        inputFocus: [{ type: core.Output }],
+        inputFinalized: [{ type: core.Output }]
     };
 
     /**
@@ -2279,7 +2338,7 @@
     FormDateTimeComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-datetime",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-datetime  [noValidate]=\"!Validation\"\r\n                   [submitted]=\"Form?.submitted\"\r\n                   [forceInvalid]=\"ForcedError\"\r\n                   [readonly]=\"Readonly\"\r\n                   [id]=\"GeneratedName\"\r\n                   [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n                   [useJsDates]=\"JsDates\"\r\n                   [(ngModel)]=\"Model\"\r\n                   name=\"{{GeneratedName}}\"\r\n                   #validationControl=\"ngModel\"\r\n                   (inputChange)=\"changed();\"\r\n                   [placeholder]=\"Placeholder\"\r\n                   [validationFailed]=\"FailedValidationMessage\">\r\n    </val-datetime>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-datetime  [noValidate]=\"!Validation\"\r\n                   [submitted]=\"Form?.submitted\"\r\n                   [forceInvalid]=\"ForcedError\"\r\n                   [readonly]=\"Readonly\"\r\n                   [id]=\"GeneratedName\"\r\n                   [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n                   [useJsDates]=\"JsDates\"\r\n                   [(ngModel)]=\"Model\"\r\n                   name=\"{{GeneratedName}}\"\r\n                   #validationControl=\"ngModel\"\r\n                   (inputChange)=\"changed();\"\r\n                   (inputFocus)=\"focused($event);\"\r\n                   (inputFinalized)=\"finalized()\"\r\n                   [placeholder]=\"Placeholder\"\r\n                   [validationFailed]=\"FailedValidationMessage\">\r\n    </val-datetime>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -2497,6 +2556,25 @@
          * Metodo richiamato quando viene modificato il modello del campo di input
          */
         FormAdaptiveComponent.prototype.changed = function () {
+            var toEmit = this.getModelToEmit();
+            if (this.Type == "autocomplete")
+                this.ignoreNextWriteValue = true;
+            if (this.EmitPendingChanges)
+                _super.prototype.changed.call(this, toEmit);
+        };
+        FormAdaptiveComponent.prototype.finalized = function () {
+            _super.prototype.finalized.call(this);
+        };
+        /**
+         * Metodo richiamato quando viene selezionato il campo col mouse
+         */
+        FormAdaptiveComponent.prototype.focused = function (event) {
+            _super.prototype.focused.call(this, event);
+        };
+        /**
+         * Effettua gli aggiustamenti dati del caso ed emette il modello corretto
+         */
+        FormAdaptiveComponent.prototype.getModelToEmit = function () {
             var toEmit = this.Model ? JSON.parse(JSON.stringify(this.Model)) : null;
             if ((this.Type == "float" || this.Type == "number") && toEmit)
                 toEmit = toEmit.replace(".", "").replace(",", ".");
@@ -2506,9 +2584,7 @@
                 var toEmit = this.dateAdapter.clone(this.Model);
                 toEmit = toEmit.format("HH:mm:ss");
             }
-            if (this.Type == "autocomplete")
-                this.ignoreNextWriteValue = true;
-            _super.prototype.changed.call(this, toEmit);
+            return toEmit;
         };
         /**
          * Helper per gestire la modifica del file attualmente bindato. Ovviamente funziona solo qualora il **Type** fosse **file**
@@ -2562,7 +2638,7 @@
         { type: core.Component, args: [{
                     selector: "form-adaptive",
                     providers: [{ provide: localizations.LocalizationService, useClass: FormAdaptiveComponentLoc }],
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <div *ngIf=\"!Type\" class=\"app-margin-top-5\">\r\n        <em>{{TypeMissingMessage}}</em>\r\n    </div>\r\n   \r\n     <!--Se currency-->\r\n     <div *ngIf=\"Type == 'currency'\">\r\n        <val-currency [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: Alignment }\" [noValidate]=\"!Validation\"\r\n        #validationControl=\"ngModel\" type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se boolean-->\r\n    <div class=\"m-t-5\" *ngIf=\"Type == 'boolean'\">\r\n        <input #validationControl=\"ngModel\" [readonly]=\"Readonly\" type=\"checkbox\" class=\"app-pointer\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed();\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\">\r\n            <option *ngFor=\"let val of BoundSource\" [value]=\"val.id\">{{val.description}}</option>\r\n        </val-select>\r\n    </div>\r\n    <!--Se autocomplete-->\r\n    <div *ngIf=\"Type == 'autocomplete'\">\r\n        <val-autocomplete #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" [FilteredSource]=\"FilteredBoundSource\" (inputChange)=\"filterSource($event); changed();\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-datetime>\r\n    </div>\r\n    <!--Se time-->\r\n    <div *ngIf=\"Type == 'time'\">\r\n        <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"false\" [stepHour]=\"2\" [stepMinute]=\"5\" [stepSecond]=\"30\"\r\n        [showSeconds]=\"true\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n        </ngx-mat-timepicker>\r\n    </div>\r\n    <!--Se file-->\r\n    <div *ngIf=\"Type == 'file'\">\r\n        <div class=\"input-group file-upload\">\r\n            <input type=\"file\" (change)=\"fileChange()\" #fileInput id=\"{{GeneratedName}}\" class=\"file-upload-btn app-pointer\" [multiple]=\"null\"/>\r\n            <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"ModelFile.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required\"/>\r\n    \r\n            <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n            <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"ModelFile.filename\"></i>\r\n            <span class=\"input-group-btn\">\r\n                <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n            </span>\r\n        </div>\r\n    </div>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <div *ngIf=\"!Type\" class=\"app-margin-top-5\">\r\n        <em>{{TypeMissingMessage}}</em>\r\n    </div>\r\n   \r\n     <!--Se currency-->\r\n     <div *ngIf=\"Type == 'currency'\">\r\n        <val-currency [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: Alignment }\" [noValidate]=\"!Validation\"\r\n        #validationControl=\"ngModel\" type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se boolean-->\r\n    <div class=\"m-t-5\" *ngIf=\"Type == 'boolean'\">\r\n        <input #validationControl=\"ngModel\" [readonly]=\"Readonly\" type=\"checkbox\" class=\"app-pointer\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed(); finalized();\" (click)=\"focused($event);\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\">\r\n            <option *ngFor=\"let val of BoundSource\" [value]=\"val.id\">{{val.description}}</option>\r\n        </val-select>\r\n    </div>\r\n    <!--Se autocomplete-->\r\n    <div *ngIf=\"Type == 'autocomplete'\">\r\n        <val-autocomplete #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" [FilteredSource]=\"FilteredBoundSource\" (inputChange)=\"filterSource($event); changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-datetime>\r\n    </div>\r\n    <!--Se time-->\r\n    <div *ngIf=\"Type == 'time'\">\r\n        <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"false\" [stepHour]=\"2\" [stepMinute]=\"5\" [stepSecond]=\"30\"\r\n        [showSeconds]=\"true\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n        </ngx-mat-timepicker>\r\n    </div>\r\n    <!--Se file-->\r\n    <div *ngIf=\"Type == 'file'\">\r\n        <div class=\"input-group file-upload\">\r\n            <input type=\"file\" (change)=\"fileChange()\" #fileInput id=\"{{GeneratedName}}\" class=\"file-upload-btn app-pointer\" [multiple]=\"null\"/>\r\n            <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"ModelFile.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required\"/>\r\n    \r\n            <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n            <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"ModelFile.filename\"></i>\r\n            <span class=\"input-group-btn\">\r\n                <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n            </span>\r\n        </div>\r\n    </div>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     styles: [".frm-padding-left-22{padding-left:22px}"]
                 },] }
@@ -2821,7 +2897,7 @@
     FormCheckboxComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-checkbox",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}} m-t-5\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <input class=\"app-pointer\" [disabled]=\"Readonly ? true : null\" type=\"checkbox\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" #validationControl=\"ngModel\" (ngModelChange)=\"changed();\" />\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}} m-t-5\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <input class=\"app-pointer\" [disabled]=\"Readonly ? true : null\" type=\"checkbox\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" #validationControl=\"ngModel\" (ngModelChange)=\"changed(); finalized()\" (click)=\"focused($event)\" />\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -2861,7 +2937,7 @@
     FormDateComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-date",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-date [noValidate]=\"!Validation\"\r\n              [submitted]=\"Form?.submitted\"\r\n              [forceInvalid]=\"ForcedError\"\r\n              [id]=\"GeneratedName\"\r\n              [readonly]=\"Readonly\"\r\n              [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n              [useJsDates]=\"JsDates\"\r\n              [(ngModel)]=\"Model\"\r\n              name=\"{{GeneratedName}}\"\r\n              #validationControl=\"ngModel\"\r\n              (inputChange)=\"changed();\"\r\n              [placeholder]=\"Placeholder\"\r\n              [validationFailed]=\"FailedValidationMessage\">\r\n    </val-date>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-date [noValidate]=\"!Validation\"\r\n              [submitted]=\"Form?.submitted\"\r\n              [forceInvalid]=\"ForcedError\"\r\n              [id]=\"GeneratedName\"\r\n              [readonly]=\"Readonly\"\r\n              [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n              [useJsDates]=\"JsDates\"\r\n              [(ngModel)]=\"Model\"\r\n              name=\"{{GeneratedName}}\"\r\n              #validationControl=\"ngModel\"\r\n              (inputChange)=\"changed();\"\r\n              (inputFocus)=\"focused($event);\"\r\n              (inputFinalized)=\"finalized()\"\r\n              [placeholder]=\"Placeholder\"\r\n              [validationFailed]=\"FailedValidationMessage\">\r\n    </val-date>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -2927,7 +3003,7 @@
     FormInputComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-input",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-input [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [readonly]=\"Readonly\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               autocomplete=\"off\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"changed();\"\r\n               [placeholder]=\"Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [Password]=\"Password\">\r\n        <ng-container *ngIf=\"HasSuffix\">\r\n            <ng-template #suffix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-suffix\"\r\n                        matSuffix (click)=\"onSuffixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"HasPrefix\">\r\n            <ng-template #prefix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-prefix\"\r\n                        matPrefix (click)=\"onPrefixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n    </val-input>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-input [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [readonly]=\"Readonly\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               autocomplete=\"off\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"changed();\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               [placeholder]=\"Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [Password]=\"Password\">\r\n        <ng-container *ngIf=\"HasSuffix\">\r\n            <ng-template #suffix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-suffix\"\r\n                        matSuffix (click)=\"onSuffixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"HasPrefix\">\r\n            <ng-template #prefix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-prefix\"\r\n                        matPrefix (click)=\"onPrefixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n    </val-input>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -3054,7 +3130,7 @@
         { type: core.Component, args: [{
                     selector: "form-select",
                     providers: [{ provide: localizations.LocalizationService, useClass: FormSelectComponentLoc }],
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n\r\n    <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n    Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n    <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...'))  : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                #validationControl=\"ngModel\">\r\n    </val-select>\r\n\r\n    <!-- Select vera e propria per quando arrivano i dati -->\r\n    <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                #validationControl=\"ngModel\">\r\n        <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n    </val-select>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n\r\n    <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n    Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n    <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...'))  : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                #validationControl=\"ngModel\">\r\n    </val-select>\r\n\r\n    <!-- Select vera e propria per quando arrivano i dati -->\r\n    <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                (inputFinalized)=\"finalized()\"\r\n                #validationControl=\"ngModel\">\r\n        <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n    </val-select>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -3222,6 +3298,7 @@
             else
                 toEmit = this.Model.map(function (m) { return ({ id: m.id, description: m.itemName }); });
             _super.prototype.changed.call(this, toEmit);
+            _super.prototype.finalized.call(this);
         };
         return FormMultiSelectComponent;
     }(BaseFormControl));
@@ -3229,7 +3306,7 @@
         { type: core.Component, args: [{
                     selector: "form-multiselect",
                     viewProviders: [{ provide: localizations.LocalizationService, useClass: FormMultiSelectComponentLoc }],
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <div [class.ms-placeholder]=\"!Model || Model.length == 0\">\r\n        <angular2-multiselect #validationControl=\"ngModel\" type=\"text\"\r\n            [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\"\r\n            [settings]=\"Settings\" [data]=\"BoundSource\"\r\n            (onSelect)=\"changed();\" \r\n            (onDeSelect)=\"changed();\" \r\n            (onSelectAll)=\"changed();\"\r\n            (onDeSelectAll)=\"changed();\" \r\n            (onDeSelectAll)=\"Model = []; changed();\">\r\n        </angular2-multiselect>\r\n    </div>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <div [class.ms-placeholder]=\"!Model || Model.length == 0\" (click)=\"focused($event)\">\r\n        <angular2-multiselect #validationControl=\"ngModel\" type=\"text\"\r\n            [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\"\r\n            [settings]=\"Settings\" [data]=\"BoundSource\"\r\n            (onSelect)=\"changed();\" \r\n            (onDeSelect)=\"changed();\" \r\n            (onSelectAll)=\"changed();\"\r\n            (onDeSelectAll)=\"changed();\" \r\n            (onDeSelectAll)=\"Model = []; changed();\">\r\n        </angular2-multiselect>\r\n    </div>\r\n</ng-template>",
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.Default,
                     styles: [".c-btn{background:#fff;border:1px solid #ccc;color:#333}.selected-list .c-list .c-token{background:#415269}.selected-list .c-list .c-token .c-label{color:#fff}.selected-list .c-list .c-token .c-remove svg{fill:#fff}.selected-list .c-angle-down svg,.selected-list .c-angle-up svg{fill:#333}.dropdown-list ul li:hover{background:#f5f5f5}.arrow-down,.arrow-up{border-bottom:15px solid #fff}.arrow-2{border-bottom:15px solid #ccc}.list-area{border:1px solid #ccc;background:#fff;box-shadow:0 1px 5px #959595}.list-filter,.select-all{border-bottom:1px solid #ccc}.list-filter .c-clear svg,.list-filter .c-search svg{fill:#888}.pure-checkbox input[type=checkbox]:focus+label:before,.pure-checkbox input[type=checkbox]:hover+label:before{border-color:#415269;background-color:#f2f2f2}.pure-checkbox input[type=checkbox]+label{color:#000}.pure-checkbox input[type=checkbox]+label:before{color:#415269;border:1px solid #415269}.pure-checkbox input[type=checkbox]+label:after{background-color:#415269}.pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.pure-checkbox input[type=checkbox]+label:after{border-color:#fff}.pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.pure-checkbox input[type=checkbox]:checked+label:before{background:#415269}.single-select-mode .pure-checkbox input[type=checkbox]:focus+label:before,.single-select-mode .pure-checkbox input[type=checkbox]:hover+label:before{border-color:#415269;background-color:#f2f2f2}.single-select-mode .pure-checkbox input[type=checkbox]+label{color:#000}.single-select-mode .pure-checkbox input[type=checkbox]+label:before{color:transparent!important;border:0 solid #415269}.single-select-mode .pure-checkbox input[type=checkbox]+label:after{background-color:transparent!important}.single-select-mode .pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.single-select-mode .pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.single-select-mode .pure-checkbox input[type=checkbox]+label:after{border-color:#415269}.single-select-mode .pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.single-select-mode .pure-checkbox input[type=checkbox]:checked+label:before{background:none!important}.selected-item{background:#e9f4ff}.btn-iceblue{background:#415269;border:1px solid #ccc;color:#fff}.cuppa-dropdown{margin-top:2px;min-width:200px}.cuppa-dropdown .c-btn{min-height:34px}.cuppa-dropdown .c-angle-down,.cuppa-dropdown .c-angle-up{margin-top:-2px}.selected-list .c-list{width:auto!important;padding-right:35px!important;margin-top:-2px!important}.selected-list .c-list .c-token{padding:3px 22px 3px 8px!important}.ms-placeholder .cuppa-dropdown .selected-list>div>span{color:#aaa}"]
@@ -3271,7 +3348,7 @@
     FormTextareaComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-textarea",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-textarea \r\n        [noValidate]=\"!Validation\" \r\n        [submitted]=\"Form?.submitted\" \r\n        [forceInvalid]=\"ForcedError\"\r\n        [id]=\"GeneratedName\" \r\n        [rows]=\"Rows\" \r\n        [readonly]=\"Readonly\"\r\n        [class]=\"Readonly ? 'app-bg-lightgrey app-no-resize' : 'app-no-resize'\" \r\n        [(ngModel)]=\"Model\"\r\n        name=\"{{GeneratedName}}\" \r\n        autocomplete=\"off\" \r\n        [placeholder]=\"Placeholder\"\r\n        [validationFailed]=\"FailedValidationMessage\" \r\n        #validationControl=\"ngModel\" \r\n        (inputChange)=\"changed();\">\r\n    </val-textarea>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-textarea \r\n        [noValidate]=\"!Validation\" \r\n        [submitted]=\"Form?.submitted\" \r\n        [forceInvalid]=\"ForcedError\"\r\n        [id]=\"GeneratedName\" \r\n        [rows]=\"Rows\" \r\n        [readonly]=\"Readonly\"\r\n        [class]=\"Readonly ? 'app-bg-lightgrey app-no-resize' : 'app-no-resize'\" \r\n        [(ngModel)]=\"Model\"\r\n        name=\"{{GeneratedName}}\" \r\n        autocomplete=\"off\" \r\n        [placeholder]=\"Placeholder\"\r\n        [validationFailed]=\"FailedValidationMessage\" \r\n        #validationControl=\"ngModel\" \r\n        (inputChange)=\"changed();\"\r\n        (inputFocus)=\"focused($event);\"\r\n        (inputFinalized)=\"finalized()\"\r\n        >\r\n    </val-textarea>\r\n</ng-template>",
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -3469,7 +3546,7 @@
     FormAutocompleteComponent.decorators = [
         { type: core.Component, args: [{
                     selector: "form-autocomplete",
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-autocomplete [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\"\r\n               >\r\n    </val-autocomplete>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<ng-template #controlTemplate>\r\n    <val-autocomplete [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\"\r\n               >\r\n    </val-autocomplete>\r\n</ng-template>",
                     providers: [{ provide: localizations.LocalizationService, useClass: FormAutocompleteComponentLoc }],
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] }
@@ -3715,6 +3792,7 @@
     exports.FormTimeComponent = FormTimeComponent;
     exports.FormsAndValidationsModule = FormsAndValidationsModule;
     exports.FormsAndValidationsModuleConfig = FormsAndValidationsModuleConfig;
+    exports.NgxExpandedDayJsDateAdapter = NgxExpandedDayJsDateAdapter;
     exports.ValidationAutocompleteComponent = ValidationAutocompleteComponent;
     exports.ValidationCurrencyComponent = ValidationCurrencyComponent;
     exports.ValidationDateComponent = ValidationDateComponent;
@@ -3734,7 +3812,6 @@
     exports.ɵj = FormMultiSelectComponentLoc;
     exports.ɵk = FormFileComponentLoc;
     exports.ɵl = FormAutocompleteComponentLoc;
-    exports.ɵm = NgxExpandedDayJsDateAdapter;
 
     Object.defineProperty(exports, '__esModule', { value: true });