@esfaenza/forms-and-validations 11.2.103 → 11.2.104
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/esfaenza-forms-and-validations.umd.js +17 -3
- package/bundles/esfaenza-forms-and-validations.umd.js.map +1 -1
- package/esfaenza-forms-and-validations.metadata.json +1 -1
- package/esm2015/lib/forms/form-autocomplete/form-autocomplete.component.js +5 -2
- package/esm2015/lib/validations/validation-autocomplete-multi/validation-autocomplete-multi.component.js +14 -4
- package/fesm2015/esfaenza-forms-and-validations.js +16 -3
- package/fesm2015/esfaenza-forms-and-validations.js.map +1 -1
- package/lib/forms/form-autocomplete/form-autocomplete.component.d.ts +2 -0
- package/lib/validations/validation-autocomplete-multi/validation-autocomplete-multi.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -1735,6 +1735,8 @@
|
|
|
1735
1735
|
_this.FilteredSource = [];
|
|
1736
1736
|
/** Contenuto della label Floattante Material-Style */
|
|
1737
1737
|
_this.label = "";
|
|
1738
|
+
/** Definisce che ad ogni selezione deve chiudere la tendina */
|
|
1739
|
+
_this.HideChoicesOnSelection = false;
|
|
1738
1740
|
/** Evento che indica l'opzione selezionata dal componente. Il valore finale della selezione dovrà essere questo */
|
|
1739
1741
|
_this.optionChange = new core.EventEmitter();
|
|
1740
1742
|
/** Elementi selezionati */
|
|
@@ -1845,6 +1847,7 @@
|
|
|
1845
1847
|
;
|
|
1846
1848
|
/** Seleziona o deseleziona un oggetto */
|
|
1847
1849
|
ValidationAutocompleteMultiComponent.prototype.toggleSelection = function (data) {
|
|
1850
|
+
var _this = this;
|
|
1848
1851
|
data.selected = !data.selected;
|
|
1849
1852
|
if (data.selected === true) {
|
|
1850
1853
|
this.selectData.push(data);
|
|
@@ -1853,8 +1856,15 @@
|
|
|
1853
1856
|
var i = this.selectData.findIndex(function (value) { return value.id === data.id; });
|
|
1854
1857
|
this.selectData.splice(i, 1);
|
|
1855
1858
|
}
|
|
1856
|
-
this.value = null;
|
|
1857
1859
|
this.onModelChange(this.selectData.map(function (t) { return t.id; }).join(','), true);
|
|
1860
|
+
if (this.HideChoicesOnSelection)
|
|
1861
|
+
this.htmlInput.nativeElement.value = "";
|
|
1862
|
+
else {
|
|
1863
|
+
this.autoTrigger.closePanel();
|
|
1864
|
+
requestAnimationFrame(function () {
|
|
1865
|
+
_this.autoTrigger.openPanel();
|
|
1866
|
+
});
|
|
1867
|
+
}
|
|
1858
1868
|
this.onFinalize();
|
|
1859
1869
|
};
|
|
1860
1870
|
;
|
|
@@ -1863,7 +1873,7 @@
|
|
|
1863
1873
|
ValidationAutocompleteMultiComponent.decorators = [
|
|
1864
1874
|
{ type: core.Component, args: [{
|
|
1865
1875
|
selector: "val-autocomplete-multi",
|
|
1866
|
-
template: "<mat-form-field appearance=\"{{FieldAppearence}}\" class=\"mat-full-width mat-no-border-top\" [style.width.px]=\"widthPx\">\r\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n <mat-chip-list #chipList>\r\n <ng-container *ngIf=\"selectData.length < ChipThreshold\" >\r\n <mat-chip *ngFor=\"let select of selectData\" class=\"cardinal-colors\" (click)=\"!(readonly || disabled) && removeChip(select)\">\r\n {{ select.description }}\r\n <mat-icon class=\"mat-chip-remove\">cancel</mat-icon>\r\n </mat-chip>\r\n </ng-container>\r\n\r\n <mat-chip *ngIf=\"selectData.length >= ChipThreshold\" class=\"cardinal-colors\" (click)=\"!(readonly || disabled) && removeChip(null)\">\r\n {{ selectData.length }} {{ 'Elements selected' | localize: lc }}\r\n <mat-icon class=\"mat-chip-remove\">cancel</mat-icon>\r\n </mat-chip>\r\n
|
|
1876
|
+
template: "<mat-form-field appearance=\"{{FieldAppearence}}\" class=\"mat-full-width mat-no-border-top\" [style.width.px]=\"widthPx\">\r\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n <mat-chip-list #chipList>\r\n <ng-container *ngIf=\"selectData.length < ChipThreshold\" >\r\n <mat-chip *ngFor=\"let select of selectData\" class=\"cardinal-colors\" (click)=\"!(readonly || disabled) && removeChip(select)\">\r\n {{ select.description }}\r\n <mat-icon class=\"mat-chip-remove\">cancel</mat-icon>\r\n </mat-chip>\r\n </ng-container>\r\n\r\n <mat-chip *ngIf=\"selectData.length >= ChipThreshold\" class=\"cardinal-colors\" (click)=\"!(readonly || disabled) && removeChip(null)\">\r\n {{ selectData.length }} {{ 'Elements selected' | localize: lc }}\r\n <mat-icon class=\"mat-chip-remove\">cancel</mat-icon>\r\n </mat-chip>\r\n\r\n <input matInput\r\n [matChipInputFor]=\"chipList\"\r\n #htmlInput\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 [(ngModel)]=\"value\"\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 (blur)=\"closeTooltip();\">\r\n </mat-chip-list>\r\n\r\n <mat-autocomplete #auto=\"matAutocomplete\" [displayWith]=\"displayFn\">\r\n <mat-option *ngFor=\"let data of FilteredSource\">\r\n <div (click)=\"toggleSelection(data); !HideChoicesOnSelection && $event.stopPropagation()\">\r\n <mat-checkbox [checked]=\"data.selected\" (change)=\"toggleSelection(data);\" (click)=\"!HideChoicesOnSelection && $event.stopPropagation()\">\r\n {{ data.description }}\r\n </mat-checkbox>\r\n </div>\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>",
|
|
1867
1877
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
1868
1878
|
providers: [
|
|
1869
1879
|
{ provide: localizations.LocalizationService, useClass: BaseValidationLoc },
|
|
@@ -1888,6 +1898,7 @@
|
|
|
1888
1898
|
FilteredSource: [{ type: core.Input }],
|
|
1889
1899
|
value: [{ type: core.Input }],
|
|
1890
1900
|
label: [{ type: core.Input }],
|
|
1901
|
+
HideChoicesOnSelection: [{ type: core.Input }],
|
|
1891
1902
|
optionChange: [{ type: core.Output }],
|
|
1892
1903
|
autoTrigger: [{ type: core.ViewChild, args: [autocomplete.MatAutocompleteTrigger,] }]
|
|
1893
1904
|
};
|
|
@@ -3577,6 +3588,8 @@
|
|
|
3577
3588
|
_this.SearchFunction = null;
|
|
3578
3589
|
/** Numero minimo di caratteri con cui cercare */
|
|
3579
3590
|
_this.MinChars = 3;
|
|
3591
|
+
/** Definisce che ad ogni selezione deve chiudere la tendina */
|
|
3592
|
+
_this.HideChoicesOnSelection = false;
|
|
3580
3593
|
/** Override del placeholder per select requried */
|
|
3581
3594
|
_this.RequiredPlaceholder = null;
|
|
3582
3595
|
/** Indica se i controlli devono essere effettuati tenendo conto del Case o meno. Vale solo qualora la **Source** fosse fornita */
|
|
@@ -3740,7 +3753,7 @@
|
|
|
3740
3753
|
FormAutocompleteComponent.decorators = [
|
|
3741
3754
|
{ type: core.Component, args: [{
|
|
3742
3755
|
selector: "form-autocomplete",
|
|
3743
|
-
template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\"> </span>\r\n <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n <val-autocomplete *ngIf=\"!Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [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 (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\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 </val-autocomplete>\r\n\r\n <val-autocomplete-multi *ngIf=\"Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n [submitted]=\"Form?.submitted\"\r\n [forceInvalid]=\"ForcedError\"\r\n [readonly]=\"Readonly\"\r\n [label]=\"SelectLabel\"\r\n [ChipThreshold]=\"MultiElementsThreshold\"\r\n type=\"text\"\r\n [ngModel]=\"Model\"\r\n (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\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-multi>\r\n</ng-template>",
|
|
3756
|
+
template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\"> </span>\r\n <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n <val-autocomplete *ngIf=\"!Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [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 (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\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 </val-autocomplete>\r\n\r\n <val-autocomplete-multi *ngIf=\"Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n [submitted]=\"Form?.submitted\"\r\n [forceInvalid]=\"ForcedError\"\r\n [readonly]=\"Readonly\"\r\n [label]=\"SelectLabel\"\r\n [ChipThreshold]=\"MultiElementsThreshold\"\r\n [HideChoicesOnSelection]=\"HideChoicesOnSelection\"\r\n type=\"text\"\r\n [ngModel]=\"Model\"\r\n (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\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-multi>\r\n</ng-template>",
|
|
3744
3757
|
providers: [{ provide: localizations.LocalizationService, useClass: FormAutocompleteComponentLoc }],
|
|
3745
3758
|
changeDetection: core.ChangeDetectionStrategy.OnPush
|
|
3746
3759
|
},] }
|
|
@@ -3759,6 +3772,7 @@
|
|
|
3759
3772
|
SelectLabel: [{ type: core.Input }],
|
|
3760
3773
|
SearchFunction: [{ type: core.Input }],
|
|
3761
3774
|
MinChars: [{ type: core.Input }],
|
|
3775
|
+
HideChoicesOnSelection: [{ type: core.Input }],
|
|
3762
3776
|
RequiredPlaceholder: [{ type: core.Input }],
|
|
3763
3777
|
CaseSensitive: [{ type: core.Input }],
|
|
3764
3778
|
Multi: [{ type: core.Input }],
|