@mediusinc/mng-commons 0.9.1 → 0.9.2

package/fesm2020/mediusinc-mng-commons.mjs

@@ -3,7 +3,7 @@ import { CommonModule } from '@angular/common';
 import * as i1$6 from '@angular/common/http';
 import { HttpErrorResponse, HttpClient, HttpClientModule } from '@angular/common/http';
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Pipe, Inject, EventEmitter, Component, ChangeDetectionStrategy, Optional, HostBinding, Input, Output, Directive, ContentChildren, ViewChild, forwardRef, ViewChildren, HostListener, APP_INITIALIZER, NgModule } from '@angular/core';
+import { InjectionToken, Injectable, Pipe, Inject, EventEmitter, Component, ChangeDetectionStrategy, Optional, HostBinding, Input, Output, Directive, ContentChildren, ViewChild, forwardRef, LOCALE_ID, ViewChildren, HostListener, APP_INITIALIZER, NgModule } from '@angular/core';
 import * as i4$1 from '@angular/forms';
 import { Validators, FormGroup, FormArray, NG_VALUE_ACCESSOR, FormControl, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@angular/router';
@@ -6151,7 +6151,16 @@ class MngFormEditorComponent {
         const formValue = this.form.getRawValue();
         this.descriptor.fields.forEach(field => {
             if (field && field.setter) {
-                field.setter(formValue, this.form.value[field.property]);
+                const splitPath = field.property.split('.');
+                let fieldValue = formValue;
+                for (let i = 0; i < splitPath.length; i++) {
+                    const currentSubPath = splitPath[i];
+                    if (typeof fieldValue[currentSubPath] !== 'object') {
+                        fieldValue[currentSubPath] = {};
+                    }
+                    fieldValue = fieldValue[currentSubPath];
+                }
+                field.setter(formValue, fieldValue);
             }
         });
         return formValue;
@@ -6229,7 +6238,20 @@ class MngFormEditorComponent {
         const formModel = JSON.parse(JSON.stringify(item ?? {}));
         this.descriptor.fields.forEach(field => {
             if (field.getter && item) {
-                formModel[field.property] = field.getter(item);
+                const splitPath = field.property.split('.');
+                let currentObject = formModel;
+                for (let i = 0; i < splitPath.length; i++) {
+                    const currentSubPath = splitPath[i];
+                    if (i === splitPath.length - 1) {
+                        currentObject[currentSubPath] = field.getter(item);
+                    }
+                    else {
+                        if (typeof currentObject[currentSubPath] !== 'object') {
+                            currentObject[currentSubPath] = {};
+                        }
+                        currentObject = currentObject[currentSubPath];
+                    }
+                }
             }
         });
         if (typeof this.formOptions.resetModel === 'function') {
@@ -6905,21 +6927,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImpor
             }] } });
 
 class MngFormlyFieldAutocompleteComponent extends FieldType {
+    constructor() {
+        super(...arguments);
+        this.subscriptions = [];
+    }
     ngOnInit() {
         this.aFormControl = this.formControl;
         this.descriptor = this.to['descriptor'];
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldAutocompleteComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_INIT
+        });
+        const subscription = this.aFormControl.valueChanges.pipe(startWith(this.formControl.value), distinctUntilChanged()).subscribe(v => {
+            this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ValueChange, MngFormlyFieldAutocompleteComponent, this, {
+                value: v
+            });
+        });
+        this.subscriptions.push(subscription);
+    }
+    ngAfterViewInit() {
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldAutocompleteComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_VIEW_INIT
+        });
+    }
+    ngOnDestroy() {
+        this.subscriptions.forEach(value => value.unsubscribe());
+        // emit lifecycle event
+        this.descriptor?.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldAutocompleteComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_DESTROY
+        });
     }
 }
 MngFormlyFieldAutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldAutocompleteComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldAutocompleteComponent, selector: "mng-formly-field-autocomplete", usesInheritance: true, ngImport: i0, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"$any(descriptor.dataProvider)\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [className]=\"descriptor.inputClassName\">\n</mng-autocomplete>\n", components: [{ type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldAutocompleteComponent, selector: "mng-formly-field-autocomplete", usesInheritance: true, ngImport: i0, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"$any(descriptor.dataProvider)\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [className]=\"descriptor.inputClassName\">\n</mng-autocomplete>\n", components: [{ type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldAutocompleteComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-formly-field-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"$any(descriptor.dataProvider)\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [className]=\"descriptor.inputClassName\">\n</mng-autocomplete>\n" }]
+            args: [{ selector: 'mng-formly-field-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"$any(descriptor.dataProvider)\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [className]=\"descriptor.inputClassName\">\n</mng-autocomplete>\n" }]
         }] });
 
 class MngFormlyFieldInputComponent extends FieldType {
-    constructor() {
-        super(...arguments);
+    constructor(applicationLocale) {
+        super();
+        this.applicationLocale = applicationLocale;
         this.numberFieldMode = 'decimal';
         this.files = [];
         this.subscriptions = [];
@@ -6987,12 +7036,15 @@ class MngFormlyFieldInputComponent extends FieldType {
         }
     }
 }
-MngFormlyFieldInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i2$3.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i4$3.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i6$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown"] }, { type: i7.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler"] }], directives: [{ type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i11.InputText, selector: "[pInputText]" }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldInputComponent, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
+MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i2$3.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i4$3.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i6$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown"] }, { type: i7.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler"] }], directives: [{ type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i11.InputText, selector: "[pInputText]" }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
-        }] });
+            args: [{ selector: 'mng-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [LOCALE_ID]
+                }] }]; } });
 
 class MngFormlyFieldLabelComponent {
     constructor() {
@@ -8111,8 +8163,16 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
         if (typeof this.formControl.value === 'undefined' || this.formControl.value === null) {
             this.formControl.patchValue([]);
         }
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogFormComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_INIT
+        });
         let subscription = this.formControl.valueChanges.pipe(startWith(this.formControl.value)).subscribe(v => {
             this.itemsSubject.next(v);
+            // emit lifecycle event
+            this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ValueChange, MngFormlyFieldTableDialogFormComponent, this, {
+                value: v
+            });
         });
         this.subscriptions.push(subscription);
         this.isDisabledSubject.next(this.formControl.disabled);
@@ -8126,8 +8186,17 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
         });
         this.subscriptions.push(subscription);
     }
+    ngAfterViewInit() {
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogFormComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_VIEW_INIT
+        });
+    }
     ngOnDestroy() {
         this.subscriptions.forEach(s => s.unsubscribe());
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogFormComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_DESTROY
+        });
     }
 }
 MngFormlyFieldTableDialogFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldTableDialogFormComponent, deps: [{ token: MngActionExecutorService }], target: i0.ɵɵFactoryTarget.Component });
@@ -8169,14 +8238,32 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
         if (typeof this.formControl.value === 'undefined' || this.formControl.value === null) {
             this.formControl.patchValue([]);
         }
-        const subscription = this.formControl.valueChanges.pipe(startWith(this.formControl.value)).subscribe(v => {
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogMultiselectComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_INIT
+        });
+        const subscription = this.formControl.valueChanges.pipe(startWith(this.formControl.value), distinctUntilChanged()).subscribe(v => {
             this.itemsSubject.next(v);
+            // emit lifecycle event
+            this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ValueChange, MngFormlyFieldTableDialogMultiselectComponent, this, {
+                value: v
+            });
         });
         this.subscriptions.push(subscription);
     }
+    ngAfterViewInit() {
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogMultiselectComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_VIEW_INIT
+        });
+    }
     ngOnDestroy() {
         this.lookupDataProviderSubscription?.unsubscribe();
         this.subscriptions.forEach(s => s.unsubscribe());
+        // emit lifecycle event
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.ComponentLifecycle, MngFormlyFieldTableDialogMultiselectComponent, this, {
+            eventSubtype: MngFormFieldEventComponentSubtype.ON_DESTROY
+        });
     }
     openAddDialog() {
         if (!this.dialogAreItemsLoaded && this.dialogUseDataProvider) {
@@ -8202,12 +8289,20 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
         }
         this.dialogSelectedAddItems = [];
         this.isDialogVisible = true;
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.DialogLifecycle, MngFormlyFieldTableDialogMultiselectComponent, this, {
+            eventSubtype: MngFormFieldEventDialogSubtype.VISIBILITY,
+            dialogVisible: true
+        });
     }
     onSelectionChange(items) {
         this.dialogSelectedAddItems = items;
     }
     hideDialog() {
         this.isDialogVisible = false;
+        this.descriptor.nextEvent(MngFormFieldEventTypeEnum.DialogLifecycle, MngFormlyFieldTableDialogMultiselectComponent, this, {
+            eventSubtype: MngFormFieldEventDialogSubtype.VISIBILITY,
+            dialogVisible: false
+        });
     }
     addItems() {
         let value = this.formControl.value;