@esfaenza/parameters 16.2.28 → 17.3.16

package/fesm2022/esfaenza-parameters.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, forwardRef, Component, ViewEncapsulation, Input, NgModule } from '@angular/core';
+import { Injectable, forwardRef, Input, ViewEncapsulation, Component, NgModule } from '@angular/core';
 import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i4 from '@angular/forms';
@@ -11,504 +11,504 @@ import { LocalizationService, LocalizationModule } from '@esfaenza/localizations
 import { of } from 'rxjs';
 import * as i1 from '@esfaenza/extensions';
 
-/**
- * Classe di localizzazione per il componente **EsParametersComponent**
- */
-class EsParametersLoc extends LocalizationService {
-    /**
-     * Costruttore
-     *
-     * @ignore
-     */
-    constructor(injector) {
-        super(injector);
-        super.set("it->en", "Seleziona", ["Select"]);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersLoc, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersLoc }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersLoc, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
+/**
+ * Classe di localizzazione per il componente **EsParametersComponent**
+ */
+class EsParametersLoc extends LocalizationService {
+    /**
+     * Costruttore
+     *
+     * @ignore
+     */
+    constructor(injector) {
+        super(injector);
+        super.set("it->en", "Seleziona", ["Select"]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersLoc, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersLoc }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersLoc, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: i0.Injector }] });
 
-/**
- * Classe che rappresenta un gruppo di parametri generico
- */
-class GenericParameterGroup {
-    /**
-    * Costruttore
-    * @param {string} groupName Descrizione del gruppo che fa anche da id
-    * @param {number} order ordine del gruppo
-    */
-    constructor(groupName, order) {
-        this.groupName = groupName;
-        this.order = order;
-        this.parameters = [];
-        this.subgroups = [];
-    }
+/**
+ * Classe che rappresenta un gruppo di parametri generico
+ */
+class GenericParameterGroup {
+    /**
+    * Costruttore
+    * @param {string} groupName Descrizione del gruppo che fa anche da id
+    * @param {number} order ordine del gruppo
+    */
+    constructor(groupName, order) {
+        this.groupName = groupName;
+        this.order = order;
+        this.parameters = [];
+        this.subgroups = [];
+    }
 }
 
-// Angular
-/** Componente che permette di graficare una lista di **GenericParameter** come Input in base al loro tipo specifico */
-class EsParametersComponent {
-    /** Permette di settare in una volta solo gli input **LabelColWidth** e **InputColWidth**, basta scriverlo con la sintassi "X Y" */
-    set LabelInputRatio(input) {
-        var ratio = input.split(/\s/);
-        this.LabelColWidth = parseInt(ratio[0]);
-        this.InputColWidth = parseInt(ratio[1]);
-    }
-    /**
-     * Costruttore
-     *
-     * @ignore
-     */
-    constructor(utiExts, lc, cdr, inj, dates) {
-        this.utiExts = utiExts;
-        this.lc = lc;
-        this.cdr = cdr;
-        this.inj = inj;
-        this.dates = dates;
-        /** Indica se si lavora a singolo parametro forzato dentro un array for the glory of satan */
-        this.SingleParameterMode = false;
-        /**
-         * Pipeline di Angular
-         *
-         * @ignore
-         */
-        this.propagateChange = (_) => { };
-        /** Indica che il parametro deve essere in modalità display */
-        this.DisplayMode = false;
-        /** Indica che il parametro (In Display mode!!) non appare se vuoto. In più, se tutti sono vuoti, fa vedere una bella card "non ci sono parametri presenti" */
-        this.HideEmpty = false;
-        /** Indica che l'ultimo parametro non deve avere margine in fondo */
-        this.LastParameterNoMargin = false;
-        /** col-md-X per la label */
-        this.LabelColWidth = 4;
-        /** col-md-X per l'input */
-        this.InputColWidth = 8;
-        /** Input a cui collegare la variabile **submitted** del form all'interno del quale viene utilizzato questo componente */
-        this.submitted = false;
-        /** Valore da mostrare qualora non fossero ancora ricevuti i **Parameters** da mostrare */
-        this.EmptyMessage = "";
-        /** Permette di rimuovere i parametri dalla lista cliccando sulla X davanti alla Label */
-        this.Removal = false;
-        /** Indica se i componenti di Input generati sono Readonly o no */
-        this.Readonly = false;
-        /** Indica il formato lista che dev'essere utilizzato */
-        this.ListFormat = 'Array';
-        /** Form che utilizza il componente. Fondamentale collegarlo se si vogliono le validazioni sul submit */
-        this.Form = null;
-        /** Quando utilizza un sottocomponente autocomplete abilita o disabilita il reset dell'input per ogni selezione */
-        this.AutocompleteHideChoicesOnSelection = false;
-        /** Indica come deve funzionare la multiselect */
-        this.MultiselectMode = 'CommaSeparated';
-        this.AllParametersEmpty = false;
-        this.Initialized = false;
-    }
-    ngOnInit() {
-        // Qui gli input dovrebbero essere settati. Alcuni form-roba non prendono bene i cambi di input
-        // Non sta funzionando come speravo... da rivedere
-        this.Initialized = true;
-    }
-    /**
-     * Pipeline di Angular
-     *
-     * @ignore
-     */
-    writeValue(obj) {
-        if (!obj)
-            return;
-        if (!Array.isArray(obj))
-            this.SingleParameterMode = true;
-        this.Parameters = Array.isArray(obj) ? obj : [obj];
-        this.ParametersCache = {};
-        this.Parameters.forEach(t => {
-            this.ParametersCache[t.id] = t;
-            if (!t.typecode && !t.type)
-                console.warn("Non è stato specificato né un type né un typecode");
-            if (t.typecode && !t.type)
-                t.type = this.utiExts.getJsTypeFromTypeCode(t.typecode);
-            if (t.typecode && t.type != this.utiExts.getJsTypeFromTypeCode(t.typecode))
-                console.warn(`Rilevate inconsistenze fra il Tipo ${t.type} e il Tipo ${this.utiExts.getJsTypeFromTypeCode(t.typecode)} calcolato da TypeCode ${t.typecode} per il parametro ${t.id}`);
-            if (t.type == "boolean")
-                t.value = t.value?.toString()?.toLowerCase() === "true";
-            if (t.enumtype || t.dicttype)
-                t.type = 'enum';
-            // Valore valido ma modalità di utilizzo a CommaSeparated, devo assicurarmi di riemettere la versione con la stringa
-            if (t.type == 'enum' && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && Array.isArray(t.value))
-                this.changed();
-            // Aggiusto le modalità di funzionamento dei parametri lista. Che internamente funzionano sempre con una lista di valori
-            if (t.type == 'enum' && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && !Array.isArray(t.value))
-                t.value = t.value ? t.value.split(',').map(t => t.trim()) : [];
-        });
-        this.AllParametersEmpty = this.Parameters.every(t => !t.value);
-        this.reviewParametersBindings();
-        this.generateGroups();
-    }
-    /**
-    * Metodo che si occupa di creare e ordinare i gruppi dei parametri
-    */
-    generateGroups() {
-        this.Groups = [];
-        if (this.Parameters?.length > 0) {
-            this.Parameters.sort((a, b) => a.order < b.order ? -1 : 1);
-            // Ciclo tutti i parametri
-            for (let i = 0; this.Parameters.length > i; i++) {
-                let par = this.Parameters[i];
-                let parGroupName = par.group ?? "";
-                let groupOrder = par.group ? par.order : -1;
-                // Se il gruppo non esiste, lo aggiungo
-                if (!this.Groups.some(x => x.groupName == parGroupName)) {
-                    this.Groups.push(new GenericParameterGroup(parGroupName, groupOrder));
-                }
-                // Inserisco il parametro dentro al suo gruppo
-                this.Groups.find(g => g.groupName == parGroupName).parameters.push(par);
-            }
-            // Gestione sottogruppi
-            let subgroups = this.Groups.filter(group => group.groupName.includes('§'));
-            for (let _; subgroups.length > 0; () => { }) {
-                // Recupero la lista di gruppi che hanno sottogruppi
-                // Per convenzione, nel nome contengono "§"
-                this.tryToAddSubgroups(subgroups);
-                subgroups = this.Groups.filter(group => group.groupName.includes('§'));
-            }
-            this.Groups.sort((a, b) => a.order < b.order ? -1 : 1);
-        }
-    }
-    /**
-    * Metodo che si occupa di creare e ordinare i sottogruppi dei parametri
-    */
-    tryToAddSubgroups(subgroups) {
-        for (let i = 0; subgroups.length > i; i++) {
-            let sub = subgroups[i];
-            // Ottengo un lista con la gerarchia dei gruppi, in ordine
-            let groupsParentHierarchy = sub.groupName.split('§') ?? [];
-            // Recupero il gruppo padre
-            let parentGroupName = sub.groupName.replace(`§${groupsParentHierarchy[groupsParentHierarchy.length - 1]}`, ``);
-            // Se il gruppo padre non esiste, lo aggiungo
-            if (!this.Groups.some(x => x.groupName == parentGroupName)) {
-                this.Groups.push(new GenericParameterGroup(parentGroupName, sub.order));
-            }
-            // Rimuovo dal nome del gruppo l'informazione sul padre (Sistemando anche l'etichetta)
-            // e lo aggiungo ai sottogruppi del padre
-            sub.groupName = sub.groupName.replace(`${parentGroupName}§`, '');
-            let parentGroup = this.Groups.find(x => x.groupName == parentGroupName);
-            if (parentGroup?.subgroups.some(s => s.groupName == sub.groupName)) {
-                let target = parentGroup.subgroups.find(f => f.groupName == sub.groupName);
-                sub.parameters.map(p => target.parameters.push(p));
-                sub.subgroups.map(s => target.subgroups.push(s));
-                target.order = sub.order < target.order ? sub.order : target.order;
-            }
-            else {
-                parentGroup?.subgroups.push(sub);
-            }
-            // Rimuovo il sottogruppo gruppo dalla lista
-            this.Groups.splice(this.Groups.indexOf(sub), 1);
-        }
-    }
-    /**
-     * Pipeline di Angular
-     *
-     * @ignore
-     */
-    registerOnChange(fn) { this.propagateChange = fn; }
-    /**
-     * Pipeline di Angular
-     *
-     * @ignore
-     */
-    registerOnTouched(fn) { }
-    /**
-     * Metodo che si occupa di gestire il modello in uscita e propagarlo sul binding ngModel
-     */
-    changed() {
-        if (!this.Parameters)
-            return;
-        if (!this.Groups)
-            this.generateGroups();
-        // Se ci sono delle modifiche ai binding potrebbero essere cambiati i required. Ricreo tutti i componenti e ri-idrato la cache dei parametri
-        var changes = this.reviewParametersBindings();
-        if (changes.length > 0) {
-            // In base ai binding cambiati devo trovare tutti i parametri che han subito modifiche strutturali (visibilità, obbligatorietà)
-            // distruggerli e ricrearli in modo che i binding lato html si aggiornino di conseguenza.
-            // 1: Faccio una copia del parametro corrente
-            // 2: Trovo la sua posizione all'interno dei gruppi e lo sostituisco con la copia
-            // 3: Aggiorno la lista dei parametri e la sua cache in modo da puntare all'oggetto nuovo
-            changes.forEach(ch => {
-                let index = this.Parameters.findIndex(t => t.id == ch);
-                let parameterCopy = this.utiExts.deepClone(this.Parameters[index]);
-                let parameterRefFixed = false;
-                for (let ig = 0; ig < this.Groups.length; ig++) {
-                    var g = this.Groups[ig];
-                    for (let ip = 0; ip < g.parameters.length; ip++) {
-                        var p = g.parameters[ip];
-                        if (p === this.Parameters[index]) {
-                            this.Groups[ig].parameters[ip] = parameterCopy;
-                            parameterRefFixed = true;
-                            break;
-                        }
-                    }
-                    if (parameterRefFixed)
-                        break;
-                }
-                this.Parameters[index] = parameterCopy;
-                this.ParametersCache[ch] = this.Parameters[index];
-                this.cdr.markForCheck();
-            });
-        }
-        var ParametersClone = this.utiExts.deepClone(this.Parameters);
-        // Aggiusto le modalità di funzionamento dei parametri lista. Che internamente funzionano sempre con una lista di valori
-        ParametersClone?.forEach(t => {
-            if (t.type == "enum" && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && Array.isArray(t.value))
-                t.value = t.value.join(',');
-        });
-        this.propagateChange(this.SingleParameterMode ? ParametersClone[0] : ParametersClone);
-    }
-    /**
-     * Rimuove il parametro selezionato e propaga il modello
-     *
-     * @param {GenericParameter} par Parametro da rimuovere
-     */
-    removeParameter(par) {
-        this.Parameters.splice(this.Parameters.indexOf(par), 1);
-        this.changed();
-    }
-    GenerateParameterGroups() {
-        let Groups = [];
-        this.Parameters.forEach(param => {
-            Groups.push({ id: param.id, groups: param.group.split("§"), order: param.order });
-        });
-        let GroupedGroups = Groups.reduce((r, a) => {
-            let firstGroupId = a.groups?.length > 0 ? a.groups[0] : "";
-            r[firstGroupId] = [...r[firstGroupId] || [], a];
-            return r;
-        }, {});
-        console.log(GroupedGroups);
-        // Ciclo del risultato, aggiungendo i gruppi al modello
-        // Per ogni gruppo che aggiungo, assegno i parametri in ordine
-    }
-    /**
-     * Rivede i bindings dei parametri in base a loro eventuali espressioni di controllo
-     *
-     * @returns {string[]} lista con gli id dei parametri che sono stati modificati
-     */
-    reviewParametersBindings() {
-        let changes = [];
-        for (let i = 0; i < this.Parameters.length; i++) {
-            var p = this.Parameters[i];
-            if (p.requiredexp) {
-                let prevReq = p.required;
-                p.required = this.evaluate(p.requiredexp);
-                if (prevReq != p.required)
-                    changes.push(p.id);
-            }
-            if (p.visibleexp) {
-                let prevVisi = p.visible;
-                p.visible = this.evaluate(p.visibleexp);
-                if (prevVisi != p.visible)
-                    changes.push(p.id);
-            }
-        }
-        return changes;
-    }
-    /**
-     * Valuta un'espressione in base ai parametri presenti nel modello attuale
-     *
-     * @param expr Espressione da valutare scritta nel formato (ripetibile) "ID (==|!=|<|>|>=|<=) (`valore` | null | true | false | XXX,XXX)" separato eventualmente da && ed ||
-     *
-     * @returns **true** se la condizione è verificata, **false** altrimenti
-     */
-    evaluate(expr) {
-        var regex = /\s?([a-zA-Z0-9_-]+)\s?(!=|==|<|>|<=|>=)\s?(`[^`]+`|``|null|[0-9,]+|true|false)/gm;
-        var matches = [];
-        var finalExpr = expr;
-        while (matches = regex.exec(expr)) {
-            var fullMatch = matches[0].trim();
-            var id = matches[1].trim();
-            var operation = matches[2].trim();
-            let bValue = matches[3].trim().trim();
-            var value = matches[3].trim().trim().replace('`', '').replace('`', '');
-            finalExpr = finalExpr.replace(fullMatch, `this.checkValue('${id}', '${operation}', ${bValue == 'null' ? 'null' : `'${value}'`})`);
-        }
-        return eval(finalExpr);
-    }
-    /**
-     * Restituisce l'operazione di comparazione fra un singolo valore di un parametro e un suo valore di confronto in base ad un operatore
-     * Richiamata da EVAL
-     *
-     * @param {string} key Chiave del parametro di cui verificare il valore
-     * @param {string} operator Operatore con cui verificare il valore: ==, !=, >, <, >=, <=
-     * @param {string} value Valore di confronto da utilizzare
-     *
-     * @returns **true** se la condizione è verificata, **false** altrimenti
-     */
-    checkValue(key, operator, value) {
-        var rPar = this.ParametersCache[key];
-        try {
-            switch (rPar.type) {
-                case "string":
-                case "enum":
-                    return eval(`"${this.defaultIfnullOrUndefined(rPar.value, ``)}" ${operator} "${this.defaultIfnullOrUndefined(value, ``)}"`);
-                case "boolean":
-                    return eval(`${this.defaultIfnullOrUndefined(rPar.value, ``).toString()} ${operator} ${this.defaultIfnullOrUndefined(value, ``)}`);
-                case "number":
-                    return eval(`${this.defaultIfnullOrUndefined(rPar.value, '""', true).replace(',', '.')} ${operator} ${this.defaultIfnullOrUndefined(value, '""', true).replace(',', '.')}`);
-                case "date":
-                    let parDateConv = `this.dates.getDateConvertion("${rPar.value}")`;
-                    let valDateConv = `this.dates.getDateConvertion("${value}")`;
-                    switch (operator) {
-                        case "==": return eval(`${parDateConv} == ${valDateConv} || (${parDateConv} != null && ${parDateConv}.isSame(${valDateConv}))`);
-                        case "!=": return eval(`${parDateConv} != ${valDateConv} && ${parDateConv} != null && !${parDateConv}.isSame(${valDateConv})`);
-                        case ">": return eval(`${parDateConv} != null && ${valDateConv} != null && ${parDateConv}.isAfter(${valDateConv})`);
-                        case "<": return eval(`${parDateConv} != null && ${valDateConv} != null && ${parDateConv}.isBefore(${valDateConv})`);
-                        case ">=": return eval(`${parDateConv} != null && ${valDateConv} != null && (${parDateConv}.isAfter(${valDateConv}) || ${parDateConv}?.isSame(${valDateConv}))`);
-                        case "<=": return eval(`${parDateConv} != null && ${valDateConv} != null && (${parDateConv}.isBefore(${valDateConv}) || ${parDateConv}?.isSame(${valDateConv}))`);
-                    }
-            }
-        }
-        catch (error) {
-            console.error(error);
-            console.warn("Errori nella valutazione dell'espressione. Fallback a false");
-            return false;
-        }
-        throw `@esfaenza/parameters: Tipo parametro ${key} non riconosciuto: ${rPar.type}`;
-    }
-    /** @ignore */
-    defaultIfnullOrUndefined(item, dflt, emptyStringIsNull = false) {
-        if (item == null || item == undefined || item.toString() == 'null' || (emptyStringIsNull && item.toString() == ""))
-            return dflt;
-        return item;
-    }
-    /** @ignore */
-    getSource(parameter, search, byid) {
-        if (!this.AutoCompleteDataRetrieve) {
-            console.error("@forms-and-validations: funzione di dataretrieve non impostata per un parametro autocomplete");
-            return of([]);
-        }
-        else
-            return this.AutoCompleteDataRetrieve(parameter, search, byid);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersComponent, deps: [{ token: i1.UtilityService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i1.DateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EsParametersComponent, selector: "es-parameters", inputs: { DisplayMode: "DisplayMode", HideEmpty: "HideEmpty", LastParameterNoMargin: "LastParameterNoMargin", LabelColWidth: "LabelColWidth", InputColWidth: "InputColWidth", submitted: "submitted", EmptyMessage: "EmptyMessage", Removal: "Removal", Readonly: "Readonly", ListFormat: "ListFormat", Form: "Form", AutocompleteHideChoicesOnSelection: "AutocompleteHideChoicesOnSelection", AutoCompleteDataRetrieve: "AutoCompleteDataRetrieve", MultiselectMode: "MultiselectMode", LabelInputRatio: "LabelInputRatio" }, providers: [
-            { provide: LocalizationService, useClass: EsParametersLoc },
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => EsParametersComponent),
-                multi: true
-            }
-        ], ngImport: i0, template: "<div *ngIf=\"(!Parameters || Parameters.length == 0) && EmptyMessage\">\r\n    <em>{{EmptyMessage}}</em>\r\n</div>\r\n\r\n<div *ngIf=\"Groups && Initialized\">\r\n    <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: Groups, isSubgroup: false }}\"></ng-container>\r\n</div>\r\n\r\n<ng-template #Temp let-item=\"item\">\r\n    <ng-container *ngFor=\"let group of item.groups; let k = index\">\r\n        <div [class.pars-subgroup]=\"item.isSubgroup\" [class.pars-group]=\"!item.isSubgroup\">\r\n            <ng-container *ngTemplateOutlet=\"GroupsOrSubgroupsDisplay; context: { item: { group: group, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: item.isSubgroup }}\"></ng-container>\r\n            <ng-container *ngIf=\"group.subgroups.length > 0\">\r\n                <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: group.subgroups, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: true }};\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #GroupsOrSubgroupsDisplay let-item=\"item\">\r\n    <div *ngIf=\"item.group && Initialized\">\r\n        <div *ngIf=\"item.group.groupName\" [class.pars-group-title]=\"!item.isSubgroup\" [class.pars-subgroup-title]=\"item.isSubgroup\">\r\n            {{item.group.groupName}}\r\n        </div>\r\n        <div *ngIf=\"item.group.parameters && item.group.parameters.length > 0\">\r\n            <ng-container *ngFor=\"let par of item.group.parameters; let i= index; let last = last;\">\r\n                <ng-container *ngIf=\"!DisplayMode || (!HideEmpty || (par.value))\">\r\n                    <div class=\"row form-group\" *ngIf=\"par.visible\" [class.app-margin-bottom-0]=\"LastParameterNoMargin && last\">\r\n                        <label class=\"col-md-{{LabelColWidth}} m-t-5\"><span *ngIf=\"Removal\" class=\"fa fa-remove text-danger\" (click)=\"removeParameter(par)\">&nbsp;</span>{{par.description}}{{par.required ? '*' : ''}}:</label>\r\n                        <!--Se Data-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'date'\">\r\n                            <form-date [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-date>\r\n                        </div>\r\n                        <!--Se stringa-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'string'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-input>\r\n                        </div>\r\n                        <!--Se numero-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'number'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator pattern=\"{{par.pattern || '^[+-]?[0-9]*[,]?[0-9]+$'}}\"></form-input>\r\n                        </div>\r\n                        <!--Se boolean-->\r\n                        <div class=\"col-md-{{InputColWidth}} m-t-5\" *ngIf=\"par.type == 'boolean'\">\r\n                            <form-checkbox [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-checkbox>\r\n                        </div>\r\n                        <!--Se enum single select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && !par.sourceapi\">\r\n                            <form-select [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator [Source]=\"par.enumvalues\"></form-select>\r\n                        </div>\r\n                        <!--Se enum multi select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi\">\r\n                            <form-multiselect [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [UseJsonList]=\"MultiselectMode == 'JsonArray'\" [UseCommaSeparatedList]=\"MultiselectMode == 'CommaSeparated'\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [Source]=\"par.enumvalues\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-multiselect>\r\n                        </div>\r\n                        <!--Se enum multiselect senza sorgente-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi && !par.enumvalues\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [HideChoicesOnSelection]=\"true\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [UnboundMode]=\"true\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>                    \r\n                        </div>\r\n                        <!--Se enum autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se enum multiselect autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [HideChoicesOnSelection]=\"AutocompleteHideChoicesOnSelection\" [Multi]=\"true\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se file-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'file'\">\r\n                            <form-file [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [ReadFile]=\"true\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.file\" name=\"{{item.index}}par{{i}}_{{par.id}}\" #validator></form-file>\r\n                        </div>\r\n                    </div>\r\n                <div class=\"clearfix\"></div>\r\n                </ng-container>\r\n            </ng-container>\r\n            <div *ngIf=\"DisplayMode && AllParametersEmpty && HideEmpty\" class=\"card card-info app-padding-10 app-no-margin app-white-text\">\r\n                Non &egrave; presente nulla da visualizzare\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".list-area{position:fixed}.pars-group-title{background:#ddd;margin-bottom:7px;padding:5px;text-transform:uppercase;font-weight:700;text-align:center;color:#333;font-size:13px}.pars-subgroup-title{font-weight:700;color:#333;font-size:16px}.pars-group{margin-left:0}.pars-subgroup{margin-left:15px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.FormCheckboxComponent, selector: "form-checkbox", inputs: ["SliderMode"] }, { kind: "component", type: i5.FormDateComponent, selector: "form-date", inputs: ["JsDates"] }, { kind: "component", type: i5.FormInputComponent, selector: "form-input", inputs: ["Password"], outputs: ["onSuffixAction", "onPrefixAction"] }, { kind: "component", type: i5.FormSelectComponent, selector: "form-select", inputs: ["SelectLabel", "PlaceholderValue", "RequiredPlaceholder", "EmptyFieldValue", "ShowValidationSymbol", "OptionTemplate"] }, { kind: "component", type: i5.FormMultiSelectComponent, selector: "form-multiselect", inputs: ["SelectLabel", "UseKeyValues", "UseCommaSeparatedList", "UseJsonList"] }, { kind: "component", type: i5.FormFileComponent, selector: "form-file", inputs: ["Multiple", "AllowDownload", "MaxSize", "FancyMode", "ReadFile"] }, { kind: "component", type: i5.FormAutocompleteComponent, selector: "form-autocomplete", inputs: ["SelectLabel", "SearchFunctionContext", "SearchFunction", "MinChars", "HideChoicesOnSelection", "RequiredPlaceholder", "CaseSensitive", "Multi", "MultiElementsThreshold", "UnboundMode"] }, { kind: "pipe", type: i2.LocalizePipe, name: "localize" }], encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "es-parameters", providers: [
-                        { provide: LocalizationService, useClass: EsParametersLoc },
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => EsParametersComponent),
-                            multi: true
-                        }
-                    ], encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"(!Parameters || Parameters.length == 0) && EmptyMessage\">\r\n    <em>{{EmptyMessage}}</em>\r\n</div>\r\n\r\n<div *ngIf=\"Groups && Initialized\">\r\n    <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: Groups, isSubgroup: false }}\"></ng-container>\r\n</div>\r\n\r\n<ng-template #Temp let-item=\"item\">\r\n    <ng-container *ngFor=\"let group of item.groups; let k = index\">\r\n        <div [class.pars-subgroup]=\"item.isSubgroup\" [class.pars-group]=\"!item.isSubgroup\">\r\n            <ng-container *ngTemplateOutlet=\"GroupsOrSubgroupsDisplay; context: { item: { group: group, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: item.isSubgroup }}\"></ng-container>\r\n            <ng-container *ngIf=\"group.subgroups.length > 0\">\r\n                <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: group.subgroups, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: true }};\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #GroupsOrSubgroupsDisplay let-item=\"item\">\r\n    <div *ngIf=\"item.group && Initialized\">\r\n        <div *ngIf=\"item.group.groupName\" [class.pars-group-title]=\"!item.isSubgroup\" [class.pars-subgroup-title]=\"item.isSubgroup\">\r\n            {{item.group.groupName}}\r\n        </div>\r\n        <div *ngIf=\"item.group.parameters && item.group.parameters.length > 0\">\r\n            <ng-container *ngFor=\"let par of item.group.parameters; let i= index; let last = last;\">\r\n                <ng-container *ngIf=\"!DisplayMode || (!HideEmpty || (par.value))\">\r\n                    <div class=\"row form-group\" *ngIf=\"par.visible\" [class.app-margin-bottom-0]=\"LastParameterNoMargin && last\">\r\n                        <label class=\"col-md-{{LabelColWidth}} m-t-5\"><span *ngIf=\"Removal\" class=\"fa fa-remove text-danger\" (click)=\"removeParameter(par)\">&nbsp;</span>{{par.description}}{{par.required ? '*' : ''}}:</label>\r\n                        <!--Se Data-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'date'\">\r\n                            <form-date [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-date>\r\n                        </div>\r\n                        <!--Se stringa-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'string'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-input>\r\n                        </div>\r\n                        <!--Se numero-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'number'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator pattern=\"{{par.pattern || '^[+-]?[0-9]*[,]?[0-9]+$'}}\"></form-input>\r\n                        </div>\r\n                        <!--Se boolean-->\r\n                        <div class=\"col-md-{{InputColWidth}} m-t-5\" *ngIf=\"par.type == 'boolean'\">\r\n                            <form-checkbox [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-checkbox>\r\n                        </div>\r\n                        <!--Se enum single select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && !par.sourceapi\">\r\n                            <form-select [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator [Source]=\"par.enumvalues\"></form-select>\r\n                        </div>\r\n                        <!--Se enum multi select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi\">\r\n                            <form-multiselect [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [UseJsonList]=\"MultiselectMode == 'JsonArray'\" [UseCommaSeparatedList]=\"MultiselectMode == 'CommaSeparated'\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [Source]=\"par.enumvalues\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-multiselect>\r\n                        </div>\r\n                        <!--Se enum multiselect senza sorgente-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi && !par.enumvalues\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [HideChoicesOnSelection]=\"true\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [UnboundMode]=\"true\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>                    \r\n                        </div>\r\n                        <!--Se enum autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se enum multiselect autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [HideChoicesOnSelection]=\"AutocompleteHideChoicesOnSelection\" [Multi]=\"true\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se file-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'file'\">\r\n                            <form-file [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [ReadFile]=\"true\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.file\" name=\"{{item.index}}par{{i}}_{{par.id}}\" #validator></form-file>\r\n                        </div>\r\n                    </div>\r\n                <div class=\"clearfix\"></div>\r\n                </ng-container>\r\n            </ng-container>\r\n            <div *ngIf=\"DisplayMode && AllParametersEmpty && HideEmpty\" class=\"card card-info app-padding-10 app-no-margin app-white-text\">\r\n                Non &egrave; presente nulla da visualizzare\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".list-area{position:fixed}.pars-group-title{background:#ddd;margin-bottom:7px;padding:5px;text-transform:uppercase;font-weight:700;text-align:center;color:#333;font-size:13px}.pars-subgroup-title{font-weight:700;color:#333;font-size:16px}.pars-group{margin-left:0}.pars-subgroup{margin-left:15px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.UtilityService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }, { type: i1.DateService }]; }, propDecorators: { DisplayMode: [{
-                type: Input
-            }], HideEmpty: [{
-                type: Input
-            }], LastParameterNoMargin: [{
-                type: Input
-            }], LabelColWidth: [{
-                type: Input
-            }], InputColWidth: [{
-                type: Input
-            }], submitted: [{
-                type: Input
-            }], EmptyMessage: [{
-                type: Input
-            }], Removal: [{
-                type: Input
-            }], Readonly: [{
-                type: Input
-            }], ListFormat: [{
-                type: Input
-            }], Form: [{
-                type: Input
-            }], AutocompleteHideChoicesOnSelection: [{
-                type: Input
-            }], AutoCompleteDataRetrieve: [{
-                type: Input
-            }], MultiselectMode: [{
-                type: Input
-            }], LabelInputRatio: [{
-                type: Input
+// Angular
+/** Componente che permette di graficare una lista di **GenericParameter** come Input in base al loro tipo specifico */
+class EsParametersComponent {
+    /** Permette di settare in una volta solo gli input **LabelColWidth** e **InputColWidth**, basta scriverlo con la sintassi "X Y" */
+    set LabelInputRatio(input) {
+        var ratio = input.split(/\s/);
+        this.LabelColWidth = parseInt(ratio[0]);
+        this.InputColWidth = parseInt(ratio[1]);
+    }
+    /**
+     * Costruttore
+     *
+     * @ignore
+     */
+    constructor(utiExts, lc, cdr, inj, dates) {
+        this.utiExts = utiExts;
+        this.lc = lc;
+        this.cdr = cdr;
+        this.inj = inj;
+        this.dates = dates;
+        /** Indica se si lavora a singolo parametro forzato dentro un array for the glory of satan */
+        this.SingleParameterMode = false;
+        /**
+         * Pipeline di Angular
+         *
+         * @ignore
+         */
+        this.propagateChange = (_) => { };
+        /** Indica che il parametro deve essere in modalità display */
+        this.DisplayMode = false;
+        /** Indica che il parametro (In Display mode!!) non appare se vuoto. In più, se tutti sono vuoti, fa vedere una bella card "non ci sono parametri presenti" */
+        this.HideEmpty = false;
+        /** Indica che l'ultimo parametro non deve avere margine in fondo */
+        this.LastParameterNoMargin = false;
+        /** col-md-X per la label */
+        this.LabelColWidth = 4;
+        /** col-md-X per l'input */
+        this.InputColWidth = 8;
+        /** Input a cui collegare la variabile **submitted** del form all'interno del quale viene utilizzato questo componente */
+        this.submitted = false;
+        /** Valore da mostrare qualora non fossero ancora ricevuti i **Parameters** da mostrare */
+        this.EmptyMessage = "";
+        /** Permette di rimuovere i parametri dalla lista cliccando sulla X davanti alla Label */
+        this.Removal = false;
+        /** Indica se i componenti di Input generati sono Readonly o no */
+        this.Readonly = false;
+        /** Indica il formato lista che dev'essere utilizzato */
+        this.ListFormat = 'Array';
+        /** Form che utilizza il componente. Fondamentale collegarlo se si vogliono le validazioni sul submit */
+        this.Form = null;
+        /** Quando utilizza un sottocomponente autocomplete abilita o disabilita il reset dell'input per ogni selezione */
+        this.AutocompleteHideChoicesOnSelection = false;
+        /** Indica come deve funzionare la multiselect */
+        this.MultiselectMode = 'CommaSeparated';
+        this.AllParametersEmpty = false;
+        this.Initialized = false;
+    }
+    ngOnInit() {
+        // Qui gli input dovrebbero essere settati. Alcuni form-roba non prendono bene i cambi di input
+        // Non sta funzionando come speravo... da rivedere
+        this.Initialized = true;
+    }
+    /**
+     * Pipeline di Angular
+     *
+     * @ignore
+     */
+    writeValue(obj) {
+        if (!obj)
+            return;
+        if (!Array.isArray(obj))
+            this.SingleParameterMode = true;
+        this.Parameters = Array.isArray(obj) ? obj : [obj];
+        this.ParametersCache = {};
+        this.Parameters.forEach(t => {
+            this.ParametersCache[t.id] = t;
+            if (!t.typecode && !t.type)
+                console.warn("Non è stato specificato né un type né un typecode");
+            if (t.typecode && !t.type)
+                t.type = this.utiExts.getJsTypeFromTypeCode(t.typecode);
+            if (t.typecode && t.type != this.utiExts.getJsTypeFromTypeCode(t.typecode))
+                console.warn(`Rilevate inconsistenze fra il Tipo ${t.type} e il Tipo ${this.utiExts.getJsTypeFromTypeCode(t.typecode)} calcolato da TypeCode ${t.typecode} per il parametro ${t.id}`);
+            if (t.type == "boolean")
+                t.value = t.value?.toString()?.toLowerCase() === "true";
+            if (t.enumtype || t.dicttype)
+                t.type = 'enum';
+            // Valore valido ma modalità di utilizzo a CommaSeparated, devo assicurarmi di riemettere la versione con la stringa
+            if (t.type == 'enum' && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && Array.isArray(t.value))
+                this.changed();
+            // Aggiusto le modalità di funzionamento dei parametri lista. Che internamente funzionano sempre con una lista di valori
+            if (t.type == 'enum' && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && !Array.isArray(t.value))
+                t.value = t.value ? t.value.split(',').map(t => t.trim()) : [];
+        });
+        this.AllParametersEmpty = this.Parameters.every(t => !t.value);
+        this.reviewParametersBindings();
+        this.generateGroups();
+    }
+    /**
+    * Metodo che si occupa di creare e ordinare i gruppi dei parametri
+    */
+    generateGroups() {
+        this.Groups = [];
+        if (this.Parameters?.length > 0) {
+            this.Parameters.sort((a, b) => a.order < b.order ? -1 : 1);
+            // Ciclo tutti i parametri
+            for (let i = 0; this.Parameters.length > i; i++) {
+                let par = this.Parameters[i];
+                let parGroupName = par.group ?? "";
+                let groupOrder = par.group ? par.order : -1;
+                // Se il gruppo non esiste, lo aggiungo
+                if (!this.Groups.some(x => x.groupName == parGroupName)) {
+                    this.Groups.push(new GenericParameterGroup(parGroupName, groupOrder));
+                }
+                // Inserisco il parametro dentro al suo gruppo
+                this.Groups.find(g => g.groupName == parGroupName).parameters.push(par);
+            }
+            // Gestione sottogruppi
+            let subgroups = this.Groups.filter(group => group.groupName.includes('§'));
+            for (let _; subgroups.length > 0; () => { }) {
+                // Recupero la lista di gruppi che hanno sottogruppi
+                // Per convenzione, nel nome contengono "§"
+                this.tryToAddSubgroups(subgroups);
+                subgroups = this.Groups.filter(group => group.groupName.includes('§'));
+            }
+            this.Groups.sort((a, b) => a.order < b.order ? -1 : 1);
+        }
+    }
+    /**
+    * Metodo che si occupa di creare e ordinare i sottogruppi dei parametri
+    */
+    tryToAddSubgroups(subgroups) {
+        for (let i = 0; subgroups.length > i; i++) {
+            let sub = subgroups[i];
+            // Ottengo un lista con la gerarchia dei gruppi, in ordine
+            let groupsParentHierarchy = sub.groupName.split('§') ?? [];
+            // Recupero il gruppo padre
+            let parentGroupName = sub.groupName.replace(`§${groupsParentHierarchy[groupsParentHierarchy.length - 1]}`, ``);
+            // Se il gruppo padre non esiste, lo aggiungo
+            if (!this.Groups.some(x => x.groupName == parentGroupName)) {
+                this.Groups.push(new GenericParameterGroup(parentGroupName, sub.order));
+            }
+            // Rimuovo dal nome del gruppo l'informazione sul padre (Sistemando anche l'etichetta)
+            // e lo aggiungo ai sottogruppi del padre
+            sub.groupName = sub.groupName.replace(`${parentGroupName}§`, '');
+            let parentGroup = this.Groups.find(x => x.groupName == parentGroupName);
+            if (parentGroup?.subgroups.some(s => s.groupName == sub.groupName)) {
+                let target = parentGroup.subgroups.find(f => f.groupName == sub.groupName);
+                sub.parameters.map(p => target.parameters.push(p));
+                sub.subgroups.map(s => target.subgroups.push(s));
+                target.order = sub.order < target.order ? sub.order : target.order;
+            }
+            else {
+                parentGroup?.subgroups.push(sub);
+            }
+            // Rimuovo il sottogruppo gruppo dalla lista
+            this.Groups.splice(this.Groups.indexOf(sub), 1);
+        }
+    }
+    /**
+     * Pipeline di Angular
+     *
+     * @ignore
+     */
+    registerOnChange(fn) { this.propagateChange = fn; }
+    /**
+     * Pipeline di Angular
+     *
+     * @ignore
+     */
+    registerOnTouched(fn) { }
+    /**
+     * Metodo che si occupa di gestire il modello in uscita e propagarlo sul binding ngModel
+     */
+    changed() {
+        if (!this.Parameters)
+            return;
+        if (!this.Groups)
+            this.generateGroups();
+        // Se ci sono delle modifiche ai binding potrebbero essere cambiati i required. Ricreo tutti i componenti e ri-idrato la cache dei parametri
+        var changes = this.reviewParametersBindings();
+        if (changes.length > 0) {
+            // In base ai binding cambiati devo trovare tutti i parametri che han subito modifiche strutturali (visibilità, obbligatorietà)
+            // distruggerli e ricrearli in modo che i binding lato html si aggiornino di conseguenza.
+            // 1: Faccio una copia del parametro corrente
+            // 2: Trovo la sua posizione all'interno dei gruppi e lo sostituisco con la copia
+            // 3: Aggiorno la lista dei parametri e la sua cache in modo da puntare all'oggetto nuovo
+            changes.forEach(ch => {
+                let index = this.Parameters.findIndex(t => t.id == ch);
+                let parameterCopy = this.utiExts.deepClone(this.Parameters[index]);
+                let parameterRefFixed = false;
+                for (let ig = 0; ig < this.Groups.length; ig++) {
+                    var g = this.Groups[ig];
+                    for (let ip = 0; ip < g.parameters.length; ip++) {
+                        var p = g.parameters[ip];
+                        if (p === this.Parameters[index]) {
+                            this.Groups[ig].parameters[ip] = parameterCopy;
+                            parameterRefFixed = true;
+                            break;
+                        }
+                    }
+                    if (parameterRefFixed)
+                        break;
+                }
+                this.Parameters[index] = parameterCopy;
+                this.ParametersCache[ch] = this.Parameters[index];
+                this.cdr.markForCheck();
+            });
+        }
+        var ParametersClone = this.utiExts.deepClone(this.Parameters);
+        // Aggiusto le modalità di funzionamento dei parametri lista. Che internamente funzionano sempre con una lista di valori
+        ParametersClone?.forEach(t => {
+            if (t.type == "enum" && this.ListFormat == 'CommaSeparated' && t.multienum && t.value && Array.isArray(t.value))
+                t.value = t.value.join(',');
+        });
+        this.propagateChange(this.SingleParameterMode ? ParametersClone[0] : ParametersClone);
+    }
+    /**
+     * Rimuove il parametro selezionato e propaga il modello
+     *
+     * @param {GenericParameter} par Parametro da rimuovere
+     */
+    removeParameter(par) {
+        this.Parameters.splice(this.Parameters.indexOf(par), 1);
+        this.changed();
+    }
+    GenerateParameterGroups() {
+        let Groups = [];
+        this.Parameters.forEach(param => {
+            Groups.push({ id: param.id, groups: param.group.split("§"), order: param.order });
+        });
+        let GroupedGroups = Groups.reduce((r, a) => {
+            let firstGroupId = a.groups?.length > 0 ? a.groups[0] : "";
+            r[firstGroupId] = [...r[firstGroupId] || [], a];
+            return r;
+        }, {});
+        console.log(GroupedGroups);
+        // Ciclo del risultato, aggiungendo i gruppi al modello
+        // Per ogni gruppo che aggiungo, assegno i parametri in ordine
+    }
+    /**
+     * Rivede i bindings dei parametri in base a loro eventuali espressioni di controllo
+     *
+     * @returns {string[]} lista con gli id dei parametri che sono stati modificati
+     */
+    reviewParametersBindings() {
+        let changes = [];
+        for (let i = 0; i < this.Parameters.length; i++) {
+            var p = this.Parameters[i];
+            if (p.requiredexp) {
+                let prevReq = p.required;
+                p.required = this.evaluate(p.requiredexp);
+                if (prevReq != p.required)
+                    changes.push(p.id);
+            }
+            if (p.visibleexp) {
+                let prevVisi = p.visible;
+                p.visible = this.evaluate(p.visibleexp);
+                if (prevVisi != p.visible)
+                    changes.push(p.id);
+            }
+        }
+        return changes;
+    }
+    /**
+     * Valuta un'espressione in base ai parametri presenti nel modello attuale
+     *
+     * @param expr Espressione da valutare scritta nel formato (ripetibile) "ID (==|!=|<|>|>=|<=) (`valore` | null | true | false | XXX,XXX)" separato eventualmente da && ed ||
+     *
+     * @returns **true** se la condizione è verificata, **false** altrimenti
+     */
+    evaluate(expr) {
+        var regex = /\s?([a-zA-Z0-9_-]+)\s?(!=|==|<|>|<=|>=)\s?(`[^`]+`|``|null|[0-9,]+|true|false)/gm;
+        var matches = [];
+        var finalExpr = expr;
+        while (matches = regex.exec(expr)) {
+            var fullMatch = matches[0].trim();
+            var id = matches[1].trim();
+            var operation = matches[2].trim();
+            let bValue = matches[3].trim().trim();
+            var value = matches[3].trim().trim().replace('`', '').replace('`', '');
+            finalExpr = finalExpr.replace(fullMatch, `this.checkValue('${id}', '${operation}', ${bValue == 'null' ? 'null' : `'${value}'`})`);
+        }
+        return eval(finalExpr);
+    }
+    /**
+     * Restituisce l'operazione di comparazione fra un singolo valore di un parametro e un suo valore di confronto in base ad un operatore
+     * Richiamata da EVAL
+     *
+     * @param {string} key Chiave del parametro di cui verificare il valore
+     * @param {string} operator Operatore con cui verificare il valore: ==, !=, >, <, >=, <=
+     * @param {string} value Valore di confronto da utilizzare
+     *
+     * @returns **true** se la condizione è verificata, **false** altrimenti
+     */
+    checkValue(key, operator, value) {
+        var rPar = this.ParametersCache[key];
+        try {
+            switch (rPar.type) {
+                case "string":
+                case "enum":
+                    return eval(`"${this.defaultIfnullOrUndefined(rPar.value, ``)}" ${operator} "${this.defaultIfnullOrUndefined(value, ``)}"`);
+                case "boolean":
+                    return eval(`${this.defaultIfnullOrUndefined(rPar.value, ``).toString()} ${operator} ${this.defaultIfnullOrUndefined(value, ``)}`);
+                case "number":
+                    return eval(`${this.defaultIfnullOrUndefined(rPar.value, '""', true).replace(',', '.')} ${operator} ${this.defaultIfnullOrUndefined(value, '""', true).replace(',', '.')}`);
+                case "date":
+                    let parDateConv = `this.dates.getDateConvertion("${rPar.value}")`;
+                    let valDateConv = `this.dates.getDateConvertion("${value}")`;
+                    switch (operator) {
+                        case "==": return eval(`${parDateConv} == ${valDateConv} || (${parDateConv} != null && ${parDateConv}.isSame(${valDateConv}))`);
+                        case "!=": return eval(`${parDateConv} != ${valDateConv} && ${parDateConv} != null && !${parDateConv}.isSame(${valDateConv})`);
+                        case ">": return eval(`${parDateConv} != null && ${valDateConv} != null && ${parDateConv}.isAfter(${valDateConv})`);
+                        case "<": return eval(`${parDateConv} != null && ${valDateConv} != null && ${parDateConv}.isBefore(${valDateConv})`);
+                        case ">=": return eval(`${parDateConv} != null && ${valDateConv} != null && (${parDateConv}.isAfter(${valDateConv}) || ${parDateConv}?.isSame(${valDateConv}))`);
+                        case "<=": return eval(`${parDateConv} != null && ${valDateConv} != null && (${parDateConv}.isBefore(${valDateConv}) || ${parDateConv}?.isSame(${valDateConv}))`);
+                    }
+            }
+        }
+        catch (error) {
+            console.error(error);
+            console.warn("Errori nella valutazione dell'espressione. Fallback a false");
+            return false;
+        }
+        throw `@esfaenza/parameters: Tipo parametro ${key} non riconosciuto: ${rPar.type}`;
+    }
+    /** @ignore */
+    defaultIfnullOrUndefined(item, dflt, emptyStringIsNull = false) {
+        if (item == null || item == undefined || item.toString() == 'null' || (emptyStringIsNull && item.toString() == ""))
+            return dflt;
+        return item;
+    }
+    /** @ignore */
+    getSource(parameter, search, byid) {
+        if (!this.AutoCompleteDataRetrieve) {
+            console.error("@forms-and-validations: funzione di dataretrieve non impostata per un parametro autocomplete");
+            return of([]);
+        }
+        else
+            return this.AutoCompleteDataRetrieve(parameter, search, byid);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersComponent, deps: [{ token: i1.UtilityService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i1.DateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: EsParametersComponent, selector: "es-parameters", inputs: { DisplayMode: "DisplayMode", HideEmpty: "HideEmpty", LastParameterNoMargin: "LastParameterNoMargin", LabelColWidth: "LabelColWidth", InputColWidth: "InputColWidth", submitted: "submitted", EmptyMessage: "EmptyMessage", Removal: "Removal", Readonly: "Readonly", ListFormat: "ListFormat", Form: "Form", AutocompleteHideChoicesOnSelection: "AutocompleteHideChoicesOnSelection", AutoCompleteDataRetrieve: "AutoCompleteDataRetrieve", MultiselectMode: "MultiselectMode", LabelInputRatio: "LabelInputRatio" }, providers: [
+            { provide: LocalizationService, useClass: EsParametersLoc },
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => EsParametersComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: "<div *ngIf=\"(!Parameters || Parameters.length == 0) && EmptyMessage\">\r\n    <em>{{EmptyMessage}}</em>\r\n</div>\r\n\r\n<div *ngIf=\"Groups && Initialized\">\r\n    <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: Groups, isSubgroup: false }}\"></ng-container>\r\n</div>\r\n\r\n<ng-template #Temp let-item=\"item\">\r\n    <ng-container *ngFor=\"let group of item.groups; let k = index\">\r\n        <div [class.pars-subgroup]=\"item.isSubgroup\" [class.pars-group]=\"!item.isSubgroup\">\r\n            <ng-container *ngTemplateOutlet=\"GroupsOrSubgroupsDisplay; context: { item: { group: group, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: item.isSubgroup }}\"></ng-container>\r\n            <ng-container *ngIf=\"group.subgroups.length > 0\">\r\n                <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: group.subgroups, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: true }};\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #GroupsOrSubgroupsDisplay let-item=\"item\">\r\n    <div *ngIf=\"item.group && Initialized\">\r\n        <div *ngIf=\"item.group.groupName\" [class.pars-group-title]=\"!item.isSubgroup\" [class.pars-subgroup-title]=\"item.isSubgroup\">\r\n            {{item.group.groupName}}\r\n        </div>\r\n        <div *ngIf=\"item.group.parameters && item.group.parameters.length > 0\">\r\n            <ng-container *ngFor=\"let par of item.group.parameters; let i= index; let last = last;\">\r\n                <ng-container *ngIf=\"!DisplayMode || (!HideEmpty || (par.value))\">\r\n                    <div class=\"row form-group\" *ngIf=\"par.visible\" [class.app-margin-bottom-0]=\"LastParameterNoMargin && last\">\r\n                        <label class=\"col-md-{{LabelColWidth}} m-t-5\"><span *ngIf=\"Removal\" class=\"fa fa-remove text-danger\" (click)=\"removeParameter(par)\">&nbsp;</span>{{par.description}}{{par.required ? '*' : ''}}:</label>\r\n                        <!--Se Data-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'date'\">\r\n                            <form-date [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-date>\r\n                        </div>\r\n                        <!--Se stringa-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'string'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-input>\r\n                        </div>\r\n                        <!--Se numero-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'number'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator pattern=\"{{par.pattern || '^[+-]?[0-9]*[,]?[0-9]+$'}}\"></form-input>\r\n                        </div>\r\n                        <!--Se boolean-->\r\n                        <div class=\"col-md-{{InputColWidth}} m-t-5\" *ngIf=\"par.type == 'boolean'\">\r\n                            <form-checkbox [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-checkbox>\r\n                        </div>\r\n                        <!--Se enum single select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && !par.sourceapi\">\r\n                            <form-select [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator [Source]=\"par.enumvalues\"></form-select>\r\n                        </div>\r\n                        <!--Se enum multi select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi\">\r\n                            <form-multiselect [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [UseJsonList]=\"MultiselectMode == 'JsonArray'\" [UseCommaSeparatedList]=\"MultiselectMode == 'CommaSeparated'\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [Source]=\"par.enumvalues\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-multiselect>\r\n                        </div>\r\n                        <!--Se enum multiselect senza sorgente-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi && !par.enumvalues\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [HideChoicesOnSelection]=\"true\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [UnboundMode]=\"true\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>                    \r\n                        </div>\r\n                        <!--Se enum autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se enum multiselect autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [HideChoicesOnSelection]=\"AutocompleteHideChoicesOnSelection\" [Multi]=\"true\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se file-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'file'\">\r\n                            <form-file [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [ReadFile]=\"true\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.file\" name=\"{{item.index}}par{{i}}_{{par.id}}\" #validator></form-file>\r\n                        </div>\r\n                    </div>\r\n                <div class=\"clearfix\"></div>\r\n                </ng-container>\r\n            </ng-container>\r\n            <div *ngIf=\"DisplayMode && AllParametersEmpty && HideEmpty\" class=\"card card-info app-padding-10 app-no-margin app-white-text\">\r\n                Non &egrave; presente nulla da visualizzare\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".list-area{position:fixed}.pars-group-title{background:#ddd;margin-bottom:7px;padding:5px;text-transform:uppercase;font-weight:700;text-align:center;color:#333;font-size:13px}.pars-subgroup-title{font-weight:700;color:#333;font-size:16px}.pars-group{margin-left:0}.pars-subgroup{margin-left:15px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.FormCheckboxComponent, selector: "form-checkbox", inputs: ["SliderMode"] }, { kind: "component", type: i5.FormDateComponent, selector: "form-date", inputs: ["JsDates"] }, { kind: "component", type: i5.FormInputComponent, selector: "form-input", inputs: ["Password"], outputs: ["onSuffixAction", "onPrefixAction"] }, { kind: "component", type: i5.FormSelectComponent, selector: "form-select", inputs: ["SelectLabel", "PlaceholderValue", "RequiredPlaceholder", "EmptyFieldValue", "ShowValidationSymbol", "OptionTemplate"] }, { kind: "component", type: i5.FormMultiSelectComponent, selector: "form-multiselect", inputs: ["SelectLabel", "UseKeyValues", "UseCommaSeparatedList", "UseJsonList"] }, { kind: "component", type: i5.FormFileComponent, selector: "form-file", inputs: ["Multiple", "AllowDownload", "MaxSize", "FancyMode", "ReadFile"] }, { kind: "component", type: i5.FormAutocompleteComponent, selector: "form-autocomplete", inputs: ["SelectLabel", "SearchFunctionContext", "SearchFunction", "MinChars", "HideChoicesOnSelection", "RequiredPlaceholder", "CaseSensitive", "Multi", "MultiElementsThreshold", "UnboundMode"] }, { kind: "pipe", type: i2.LocalizePipe, name: "localize" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "es-parameters", providers: [
+                        { provide: LocalizationService, useClass: EsParametersLoc },
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => EsParametersComponent),
+                            multi: true
+                        }
+                    ], encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"(!Parameters || Parameters.length == 0) && EmptyMessage\">\r\n    <em>{{EmptyMessage}}</em>\r\n</div>\r\n\r\n<div *ngIf=\"Groups && Initialized\">\r\n    <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: Groups, isSubgroup: false }}\"></ng-container>\r\n</div>\r\n\r\n<ng-template #Temp let-item=\"item\">\r\n    <ng-container *ngFor=\"let group of item.groups; let k = index\">\r\n        <div [class.pars-subgroup]=\"item.isSubgroup\" [class.pars-group]=\"!item.isSubgroup\">\r\n            <ng-container *ngTemplateOutlet=\"GroupsOrSubgroupsDisplay; context: { item: { group: group, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: item.isSubgroup }}\"></ng-container>\r\n            <ng-container *ngIf=\"group.subgroups.length > 0\">\r\n                <ng-container *ngTemplateOutlet=\"Temp; context: {item: { groups: group.subgroups, index: k + (item.index ? ('_' + item.index) : ''), isSubgroup: true }};\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #GroupsOrSubgroupsDisplay let-item=\"item\">\r\n    <div *ngIf=\"item.group && Initialized\">\r\n        <div *ngIf=\"item.group.groupName\" [class.pars-group-title]=\"!item.isSubgroup\" [class.pars-subgroup-title]=\"item.isSubgroup\">\r\n            {{item.group.groupName}}\r\n        </div>\r\n        <div *ngIf=\"item.group.parameters && item.group.parameters.length > 0\">\r\n            <ng-container *ngFor=\"let par of item.group.parameters; let i= index; let last = last;\">\r\n                <ng-container *ngIf=\"!DisplayMode || (!HideEmpty || (par.value))\">\r\n                    <div class=\"row form-group\" *ngIf=\"par.visible\" [class.app-margin-bottom-0]=\"LastParameterNoMargin && last\">\r\n                        <label class=\"col-md-{{LabelColWidth}} m-t-5\"><span *ngIf=\"Removal\" class=\"fa fa-remove text-danger\" (click)=\"removeParameter(par)\">&nbsp;</span>{{par.description}}{{par.required ? '*' : ''}}:</label>\r\n                        <!--Se Data-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'date'\">\r\n                            <form-date [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-date>\r\n                        </div>\r\n                        <!--Se stringa-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'string'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-input>\r\n                        </div>\r\n                        <!--Se numero-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'number'\">\r\n                            <form-input [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator pattern=\"{{par.pattern || '^[+-]?[0-9]*[,]?[0-9]+$'}}\"></form-input>\r\n                        </div>\r\n                        <!--Se boolean-->\r\n                        <div class=\"col-md-{{InputColWidth}} m-t-5\" *ngIf=\"par.type == 'boolean'\">\r\n                            <form-checkbox [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator></form-checkbox>\r\n                        </div>\r\n                        <!--Se enum single select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && !par.sourceapi\">\r\n                            <form-select [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" (inputChange)=\"changed();\" #validator [Source]=\"par.enumvalues\"></form-select>\r\n                        </div>\r\n                        <!--Se enum multi select-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi\">\r\n                            <form-multiselect [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [UseJsonList]=\"MultiselectMode == 'JsonArray'\" [UseCommaSeparatedList]=\"MultiselectMode == 'CommaSeparated'\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [Source]=\"par.enumvalues\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-multiselect>\r\n                        </div>\r\n                        <!--Se enum multiselect senza sorgente-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && !par.sourceapi && !par.enumvalues\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [HideChoicesOnSelection]=\"true\" [SelectLabel]=\"('Seleziona' | localize : lc) + '...'\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [UnboundMode]=\"true\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>                    \r\n                        </div>\r\n                        <!--Se enum autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && !par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se enum multiselect autocomplete-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'enum' && par.multienum && par.sourceapi\">\r\n                            <form-autocomplete [DisplayMode]=\"DisplayMode\"  [Form]=\"Form\" [HideChoicesOnSelection]=\"AutocompleteHideChoicesOnSelection\" [Multi]=\"true\" [FormLayout]=\"false\" [(ngModel)]=\"par.value\" name=\"{{item.index}}par{{i}}_{{par.id}}\" [Readonly]=\"Readonly || par.isreadonly\" [SearchFunction]=\"getSource.bind(this, par)\" [required]=\"par.required\" (inputChange)=\"changed();\" #validator></form-autocomplete>\r\n                        </div>\r\n                        <!--Se file-->\r\n                        <div class=\"col-md-{{InputColWidth}}\" *ngIf=\"par.type == 'file'\">\r\n                            <form-file [DisplayMode]=\"DisplayMode\" [Form]=\"Form\" [ReadFile]=\"true\" [FormLayout]=\"false\" [Readonly]=\"Readonly || par.isreadonly\" [required]=\"par.required\" [(ngModel)]=\"par.file\" name=\"{{item.index}}par{{i}}_{{par.id}}\" #validator></form-file>\r\n                        </div>\r\n                    </div>\r\n                <div class=\"clearfix\"></div>\r\n                </ng-container>\r\n            </ng-container>\r\n            <div *ngIf=\"DisplayMode && AllParametersEmpty && HideEmpty\" class=\"card card-info app-padding-10 app-no-margin app-white-text\">\r\n                Non &egrave; presente nulla da visualizzare\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".list-area{position:fixed}.pars-group-title{background:#ddd;margin-bottom:7px;padding:5px;text-transform:uppercase;font-weight:700;text-align:center;color:#333;font-size:13px}.pars-subgroup-title{font-weight:700;color:#333;font-size:16px}.pars-group{margin-left:0}.pars-subgroup{margin-left:15px}\n"] }]
+        }], ctorParameters: () => [{ type: i1.UtilityService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }, { type: i1.DateService }], propDecorators: { DisplayMode: [{
+                type: Input
+            }], HideEmpty: [{
+                type: Input
+            }], LastParameterNoMargin: [{
+                type: Input
+            }], LabelColWidth: [{
+                type: Input
+            }], InputColWidth: [{
+                type: Input
+            }], submitted: [{
+                type: Input
+            }], EmptyMessage: [{
+                type: Input
+            }], Removal: [{
+                type: Input
+            }], Readonly: [{
+                type: Input
+            }], ListFormat: [{
+                type: Input
+            }], Form: [{
+                type: Input
+            }], AutocompleteHideChoicesOnSelection: [{
+                type: Input
+            }], AutoCompleteDataRetrieve: [{
+                type: Input
+            }], MultiselectMode: [{
+                type: Input
+            }], LabelInputRatio: [{
+                type: Input
             }] } });
 
-class EsParametersModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: EsParametersModule, declarations: [EsParametersComponent], imports: [CommonModule,
-            LocalizationModule,
-            FormsModule,
-            FormsAndValidationsModule], exports: [EsParametersComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersModule, imports: [CommonModule,
-            LocalizationModule,
-            FormsModule,
-            FormsAndValidationsModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EsParametersModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [EsParametersComponent],
-                    imports: [
-                        CommonModule,
-                        LocalizationModule,
-                        FormsModule,
-                        FormsAndValidationsModule,
-                    ],
-                    exports: [EsParametersComponent]
-                }]
+class EsParametersModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: EsParametersModule, declarations: [EsParametersComponent], imports: [CommonModule,
+            LocalizationModule,
+            FormsModule,
+            FormsAndValidationsModule], exports: [EsParametersComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersModule, imports: [CommonModule,
+            LocalizationModule,
+            FormsModule,
+            FormsAndValidationsModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EsParametersModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [EsParametersComponent],
+                    imports: [
+                        CommonModule,
+                        LocalizationModule,
+                        FormsModule,
+                        FormsAndValidationsModule,
+                    ],
+                    exports: [EsParametersComponent]
+                }]
         }] });
 
-/**
- * Classe che rappresenta un parametro generico
- */
-class GenericParameter {
-    /**
-     * Costruttore
-     *
-     * @param {string} id Codice del parametro
-     * @param {string} description Descrizione del parametro
-     * @param {string} pattern Pattern di validazione
-     * @param {'date' | 'string' | 'number' | 'boolean' | 'enum'} type Tipo di input
-     * @param {boolean} required Indica se il valore è obbligatorio o meno
-     * @param {any} v_default Valore di default per questo Parametro
-     * @param {{ id: string, description: string }[]} enumvalues Qualora il **type** fosse di tipo **enum**, qui devono esserci tutti i valori che può assumere
-     * @param {boolean} multienum Qualora il **type** fosse di tipo **enum**, indica se è possibile selezionare più valori (multiselect)
-     * @param {string} sourceapi Nei casi in cui il **type** è **enum** indica l'api da cui recuperare i valori da bindare alla select o alla multiselect
-     * @param {boolean} pageddata Nei casi in cui il **type** è **enum** indica che l'api specificata eventualmetne da **sourceapi** è paginata
-     */
-    constructor(id, description, pattern, type, required, v_default = null, enumvalues = [], multienum, sourceapi, pageddata) {
-        this.id = id;
-        this.description = description;
-        this.pattern = pattern;
-        this.required = required;
-        this.enumvalues = enumvalues;
-        this.multienum = multienum;
-        this.sourceapi = sourceapi;
-        this.pageddata = pageddata;
-        this.type = type == 'enum' ? null : type;
-        this.visible = true;
-        this.enumtype = type == 'enum' ? type : "";
-        this.isreadonly = false;
-        if (!this.enumtype && enumvalues.length != 0)
-            console.error("impossibile gestire valori di dizionario per un parametro non di tipo enum");
-        if (v_default != null)
-            this.value = v_default;
-    }
+/**
+ * Classe che rappresenta un parametro generico
+ */
+class GenericParameter {
+    /**
+     * Costruttore
+     *
+     * @param {string} id Codice del parametro
+     * @param {string} description Descrizione del parametro
+     * @param {string} pattern Pattern di validazione
+     * @param {'date' | 'string' | 'number' | 'boolean' | 'enum'} type Tipo di input
+     * @param {boolean} required Indica se il valore è obbligatorio o meno
+     * @param {any} v_default Valore di default per questo Parametro
+     * @param {{ id: string, description: string }[]} enumvalues Qualora il **type** fosse di tipo **enum**, qui devono esserci tutti i valori che può assumere
+     * @param {boolean} multienum Qualora il **type** fosse di tipo **enum**, indica se è possibile selezionare più valori (multiselect)
+     * @param {string} sourceapi Nei casi in cui il **type** è **enum** indica l'api da cui recuperare i valori da bindare alla select o alla multiselect
+     * @param {boolean} pageddata Nei casi in cui il **type** è **enum** indica che l'api specificata eventualmetne da **sourceapi** è paginata
+     */
+    constructor(id, description, pattern, type, required, v_default = null, enumvalues = [], multienum, sourceapi, pageddata) {
+        this.id = id;
+        this.description = description;
+        this.pattern = pattern;
+        this.required = required;
+        this.enumvalues = enumvalues;
+        this.multienum = multienum;
+        this.sourceapi = sourceapi;
+        this.pageddata = pageddata;
+        this.type = type == 'enum' ? null : type;
+        this.visible = true;
+        this.enumtype = type == 'enum' ? type : "";
+        this.isreadonly = false;
+        if (!this.enumtype && enumvalues.length != 0)
+            console.error("impossibile gestire valori di dizionario per un parametro non di tipo enum");
+        if (v_default != null)
+            this.value = v_default;
+    }
 }
 
-/*
- * Public API Surface of parameters
+/*
+ * Public API Surface of parameters
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { EsParametersComponent, EsParametersModule, GenericParameter };