@mediusinc/mng-commons 3.0.0-rc.9 → 3.0.0

package/fesm2022/mediusinc-mng-commons.mjs

@@ -1,5 +1,5 @@
 import * as i2$1 from '@angular/common';
-import { DatePipe, AsyncPipe, NgIf, NgForOf, NgSwitch, NgSwitchCase, NgSwitchDefault, DecimalPipe, CurrencyPipe, NgClass, NgStyle, NgTemplateOutlet, CommonModule } from '@angular/common';
+import { DatePipe, AsyncPipe, NgIf, NgForOf, NgSwitch, NgSwitchCase, NgSwitchDefault, DecimalPipe, CurrencyPipe, NgClass, NgStyle, NgTemplateOutlet, JsonPipe, CommonModule } from '@angular/common';
 import * as i1$1 from '@angular/common/http';
 import { HttpErrorResponse, HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
 import * as i0 from '@angular/core';
@@ -82,11 +82,14 @@ import { PrimeNGConfig, FilterService, FilterMatchMode, ConfirmationService, Mes
 import * as i11 from 'primeng/menu';
 import { MenuModule } from 'primeng/menu';
 import { isObservable, throwError, BehaviorSubject, Subject, ReplaySubject, distinctUntilChanged, take, mergeMap, of, combineLatest, switchMap, from, timeout, tap, Observable, debounceTime, merge } from 'rxjs';
-import { filter, map, catchError, first, mergeMap as mergeMap$1, take as take$1, startWith } from 'rxjs/operators';
+import { filter, map, startWith, catchError, first, mergeMap as mergeMap$1, take as take$1 } from 'rxjs/operators';
+import { logger } from 'nx/src/utils/logger';
 import 'reflect-metadata';
 import { Title, DomSanitizer } from '@angular/platform-browser';
 import { ZIndexUtils } from 'primeng/utils';
 import { TimesIcon } from 'primeng/icons/times';
+import * as i5$2 from 'primeng/message';
+import { MessageModule } from 'primeng/message';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 
 /**
@@ -1214,67 +1217,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
  *  - Array notation (e.g.: [0])
  */
 class JsonPathPipe {
-    constructor() {
-        this.logger = MngLoggerService.get().create('JsonPathPipe');
-    }
     transform(value, path = '') {
-        if (path === '$') {
-            // only return the root
-            return value;
-        }
-        // Check for leading root object notation
-        if (path.startsWith('$')) {
-            path = path.substring(1);
-        }
-        // Check for leading .
-        if (path.startsWith('.')) {
-            path = path.substring(1);
-        }
-        if (path.indexOf('.') >= 0) {
-            const pathSplit = path.split('.');
-            let currValue = value;
-            for (const p of pathSplit) {
-                if (typeof currValue === 'undefined' || currValue === null) {
-                    return currValue;
-                }
-                if (!p.length) {
-                    // empty path, return current value
-                    return currValue;
-                }
-                const leftBracketIdx = p.indexOf('[');
-                if (leftBracketIdx >= 0 && p.endsWith(']')) {
-                    // should be reference to array
-                    const arrayPath = p.substring(0, leftBracketIdx);
-                    const arrayIdx = +p.substring(leftBracketIdx + 1, p.length - 1);
-                    const array = currValue[arrayPath];
-                    if (Array.isArray(array)) {
-                        if (arrayIdx >= 0 && arrayIdx < array.length) {
-                            // valid index, continue on the path
-                            currValue = array[arrayIdx];
-                            continue;
-                        }
-                        else {
-                            this.logger?.warn(`Path ${path} array index at ${p} is not within valid array range`, value);
-                        }
-                    }
-                    else {
-                        this.logger?.warn(`Path ${path} array at ${p} is not a valid array`, value);
-                    }
-                    return undefined;
-                }
-                else if (typeof currValue === 'object') {
-                    currValue = currValue[p];
-                }
-                else {
-                    this.logger?.warn(`Path ${path} is not valid for object`, value);
-                    return currValue;
-                }
-            }
-            return currValue;
-        }
-        else {
-            return value[path];
-        }
+        return ObjectUtil.getPropertyByPath(value, path);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: JsonPathPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: JsonPathPipe, isStandalone: true, name: "jsonPath" }); }
@@ -1666,7 +1610,7 @@ class MngLoggerService {
         else if (data?.length && data[0] instanceof Error) {
             // if first data is error, also consider as error
             logEntry.error = data[0];
-            data = data.splice(1);
+            logEntry.data = data.splice(1);
         }
         this._log(logEntry);
     }
@@ -2442,10 +2386,11 @@ class MngActionExecutorService {
                         .withActionData(ctx.parameters.actionData)
                         .withRoute(ctx.parameters.route)
                         .withSourceComponent(ctx.parameters.sourceComponent)
-                        .withViewContainer(ctx.parameters.viewContainer), undefined, ctx.instance);
+                        .withViewContainer(ctx.parameters.viewContainer), undefined, ctx.instance, true);
                     ctx.instance.nextActionInstance = nextActionInstance;
                     // finish current action when next action finishes
-                    return nextActionInstance.state$.pipe(filter(state => state >= ActionInstanceStateEnum.FinishSuccessFinal), map(() => {
+                    return nextActionInstance.state$.pipe(startWith(nextActionInstance.state), // provide first state cause it might be finished already
+                    filter(state => state >= ActionInstanceStateEnum.FinishSuccessFinal), take(1), map(() => {
                         ctx.instance.state = ActionInstanceStateEnum.NextActionEnd;
                         return runResult;
                     }));
@@ -2470,6 +2415,9 @@ class MngActionExecutorService {
             ctx.instance.state = isMainRunFn ? ActionInstanceStateEnum.RunError : ActionInstanceStateEnum.FetchError;
             // mark execution error on context
             ctx.executionError(actionError);
+            if (ctx.instance.action.hasRunNotificationError) {
+                NotificationUtil.actionNotificationError(this.translate, ctx.instance.action, actionError, 'fetch', ctx.parameters.viewContainer, ctx.parameters.item);
+            }
             let errorObs = of(void 0);
             if (isMainRunFn) {
                 ctx.instance.error = err;
@@ -2481,14 +2429,10 @@ class MngActionExecutorService {
                         .withActionData(ctx.parameters.actionData)
                         .withRoute(ctx.parameters.route)
                         .withSourceComponent(ctx.parameters.sourceComponent)
-                        .withViewContainer(ctx.parameters.viewContainer));
+                        .withViewContainer(ctx.parameters.viewContainer), undefined, undefined, true);
                     ctx.instance.errorActionInstance = errorActionInstance;
-                    errorObs = errorActionInstance.state$.pipe(filter(state => state >= ActionInstanceStateEnum.FinishSuccessFinal), map(() => void 0));
-                }
-            }
-            else {
-                if (ctx.instance.action.hasRunNotificationError) {
-                    NotificationUtil.actionNotificationError(this.translate, ctx.instance.action, actionError, 'fetch', ctx.parameters.viewContainer, ctx.parameters.item);
+                    errorObs = errorActionInstance.state$.pipe(startWith(errorActionInstance.state), // provide first state cause it might be finished already
+                    filter(state => state >= ActionInstanceStateEnum.FinishSuccessFinal), take(1), map(() => void 0));
                 }
             }
             // list and map only to mark instance state as finished error state
@@ -2742,7 +2686,7 @@ class MngActionExecutorService {
     finishAction(instance, onDestroy = false) {
         instance = this.getOrCreateInstance(instance);
         if (instance.state >= ActionInstanceStateEnum.FinishSuccessFinal) {
-            this.logger.debug(`ActionInstance ${instance.instanceLongName} already finished`);
+            this.logger.trace(`ActionInstance ${instance.instanceLongName} already finished`);
             return;
         }
         let finalState;
@@ -2789,6 +2733,15 @@ class MngActionExecutorService {
             instance.context?.parameters.viewContainer?.setActionRouteTriggeredInstance?.(newInstance);
             instance.reactivationInstance = newInstance;
         }
+        // finish related actions
+        if (instance.nextActionInstance) {
+            logger.debug(`Finishing instance ${instance.instanceLongName} related next action instance: ${instance.nextActionInstance.instanceLongName}`);
+            this.finishAction(instance.nextActionInstance, onDestroy);
+        }
+        if (instance.errorActionInstance) {
+            logger.debug(`Finishing instance ${instance.instanceLongName} related error action instance: ${instance.errorActionInstance.instanceLongName}`);
+            this.finishAction(instance.errorActionInstance, onDestroy);
+        }
     }
     /**
      * Triggers action with parameters.
@@ -6903,7 +6856,7 @@ class FieldInputDescriptor extends AFieldDescriptor {
         this._imageUrlInputHiddenOnDisabled = inputVisibleOnDisabled;
         return this;
     }
-    asCustomComponent(customComponent, useWrappers, componentInputs) {
+    asCustomComponent(customComponent, wrappers = ['field'], componentInputs) {
         this._fieldType = FieldInputTypeEnum.Custom;
         if (typeof customComponent === 'string') {
             this._customComponentName = customComponent;
@@ -6912,8 +6865,8 @@ class FieldInputDescriptor extends AFieldDescriptor {
             this._customComponentType = customComponent;
             this._customComponentInputs = componentInputs;
         }
-        if (useWrappers) {
-            this._customComponentWrappers = useWrappers;
+        if (wrappers) {
+            this._customComponentWrappers = wrappers;
         }
         return this;
     }
@@ -6996,6 +6949,7 @@ class FieldActionDescriptor extends AFieldDescriptor {
     constructor(editor, property) {
         super(editor, property);
         this._button = new ActionButtonDescriptor();
+        this._wrappers = ['field'];
         this._fieldActionName = property;
         let displayName = property;
         if (this._editor.model)
@@ -7008,6 +6962,9 @@ class FieldActionDescriptor extends AFieldDescriptor {
     get runFunction() {
         return this._runFunction;
     }
+    get wrappers() {
+        return this._wrappers;
+    }
     withButtonDescriptor(button) {
         this._button = button;
         return this;
@@ -7020,11 +6977,16 @@ class FieldActionDescriptor extends AFieldDescriptor {
         this._runFunction = fn;
         return this;
     }
+    withWrappers(wrappers) {
+        this._wrappers = wrappers;
+        return this;
+    }
     copy() {
         const field = new FieldActionDescriptor(this._editor, this._property);
         this.copyFieldsTo(field);
         field._button = this._button.copy();
         field._runFunction = this._runFunction?.bind(field);
+        field._wrappers = [...this._wrappers];
         return field;
     }
 }
@@ -7928,6 +7890,7 @@ class EditorFormlyUtil {
         }
         else if (descriptor instanceof FieldActionDescriptor) {
             field.type = 'action';
+            field.wrappers = descriptor.wrappers;
             delete field.key;
         }
         else if (descriptor instanceof FieldLookupEnumDescriptor) {
@@ -8215,6 +8178,55 @@ class ObjectUtil {
         }
         return Array.from(getterSet);
     }
+    static getPropertyByPath(value, path) {
+        if (path === '$') {
+            // only return the root
+            return value;
+        }
+        // Check for leading root object notation
+        if (path.startsWith('$')) {
+            path = path.substring(1);
+        }
+        // Check for leading .
+        if (path.startsWith('.')) {
+            path = path.substring(1);
+        }
+        if (path.indexOf('.') >= 0) {
+            const pathSplit = path.split('.');
+            let currValue = value;
+            for (const p of pathSplit) {
+                if (typeof currValue === 'undefined' || currValue === null) {
+                    return currValue;
+                }
+                if (!p.length) {
+                    // empty path, return current value
+                    return currValue;
+                }
+                const leftBracketIdx = p.indexOf('[');
+                if (leftBracketIdx >= 0 && p.endsWith(']')) {
+                    // should be reference to array
+                    const arrayPath = p.substring(0, leftBracketIdx);
+                    const arrayIdx = +p.substring(leftBracketIdx + 1, p.length - 1);
+                    const array = currValue[arrayPath];
+                    if (Array.isArray(array)) {
+                        if (arrayIdx >= 0 && arrayIdx < array.length) {
+                            // valid index, continue on the path
+                            currValue = array[arrayIdx];
+                            continue;
+                        }
+                    }
+                    return undefined;
+                }
+                else if (typeof currValue === 'object') {
+                    currValue = currValue[p];
+                }
+            }
+            return currValue;
+        }
+        else {
+            return value[path];
+        }
+    }
 }
 
 class StringUtil {
@@ -12537,52 +12549,11 @@ class MngTableComponent {
         // Used for configs within this method and is not dynamically set by TableDynamicDescriptor
         const baseConfigDescriptor = this.initialDescriptor;
         if (!(this.initialDescriptor instanceof TableDynamicDescriptor)) {
-            this.descriptor = this.initialDescriptor;
+            this.setMainAndRelatedDescriptors(this.initialDescriptor);
         }
         // map row settings
-        this.filterDescriptors = this.descriptor?.columns.filter(c => typeof c.filterDescriptor !== 'undefined').map(c => c.filterDescriptor) ?? [];
-        this.hasColumnFilters = this.filterDescriptors.length > 0;
         this.rows = baseConfigDescriptor?.defaultNumRows ?? 25;
         this.rowsPerPageOptions = baseConfigDescriptor?.rowsPerPageOptions ?? [25, 50, 100];
-        // get layout preferences if they exist
-        if (this.descriptor?.model.typeName) {
-            this.localstorageKey = TableviewUtil.generateTableLayoutPrefsKey(this.descriptor?.model.typeName, this.router.url, this.descriptor?.dataKey);
-            const preferences = this.localStorageService.getItem(this.cmpTypeName, this.localstorageKey);
-            if (preferences && typeof preferences === 'object') {
-                if (preferences.columnWidths) {
-                    this.layoutPreferences.columnWidths = preferences.columnWidths;
-                }
-                if (preferences.columnOrder && Array.isArray(preferences.columnOrder) && preferences.columnOrder.every((el) => typeof el === 'string')) {
-                    this.layoutPreferences.columnOrder = preferences.columnOrder;
-                }
-                if (preferences.columnVisibility && Array.isArray(preferences.columnVisibility) && preferences.columnVisibility.every((el) => typeof el === 'string')) {
-                    this.layoutPreferences.columnVisibility = preferences.columnVisibility;
-                }
-            }
-        }
-        // initialize columns with additional properties
-        if (this.descriptor?.columns) {
-            this.areColumnsReorderable = this.descriptor.columns.some(value => value.isReorderable);
-            this.areColumnsToggleable = this.descriptor.columns.some(value => value.isToggleable);
-            this.columns = this.descriptor.columns.map(col => ({
-                descriptor: col,
-                disabled: !col.isToggleable,
-                isVisible: this.layoutPreferences.columnVisibility ? this.layoutPreferences.columnVisibility.includes(col.property) : col.isVisible,
-                width: this.layoutPreferences.columnWidths?.[col.property]
-            }));
-            if (this.layoutPreferences.columnOrder) {
-                const newColumnOrder = [];
-                for (const colName of this.layoutPreferences.columnOrder) {
-                    const foundCol = this.columns.find(el => el.descriptor.property === colName);
-                    if (foundCol) {
-                        newColumnOrder.push(foundCol);
-                    }
-                }
-                if (newColumnOrder.length === this.columns.length)
-                    this.columns = newColumnOrder;
-            }
-            this.visibleColumns = this.columns.filter(el => el.isVisible);
-        }
         // process actions
         for (const action of this.actions) {
             switch (action.position) {
@@ -12845,13 +12816,7 @@ class MngTableComponent {
             .subscribe({
             next: res => {
                 if (this.initialDescriptor instanceof TableDynamicDescriptor) {
-                    this.descriptor = this.initialDescriptor.toTableDescriptorFromData(res);
-                    this.filterDescriptors = this.descriptor.columns.filter(c => typeof c.filterDescriptor !== 'undefined').map(c => c.filterDescriptor);
-                    this.hasColumnFilters = this.filterDescriptors.length > 0;
-                    this.isPagination = this.descriptor.paginationMode === TablePaginationModeEnum.Pagination;
-                    this.infiniteScroll = this.descriptor.paginationMode === TablePaginationModeEnum.InfiniteScroll;
-                    this.rows = this.initialDescriptor.defaultNumRows;
-                    this.rowsPerPageOptions = this.initialDescriptor.rowsPerPageOptions;
+                    this.setMainAndRelatedDescriptors(this.initialDescriptor.toTableDescriptorFromData(res));
                 }
                 if (this.infiniteScroll) {
                     if (this.isFilterChanged || this.isSortChanged) {
@@ -12897,6 +12862,50 @@ class MngTableComponent {
         this.useQueryParamsInitializedSubejct.next(true);
         this.loadTableWithDataProvider(mediusQueryParam);
     }
+    setMainAndRelatedDescriptors(descriptor) {
+        this.descriptor = descriptor;
+        this.filterDescriptors = this.descriptor?.columns.filter(c => typeof c.filterDescriptor !== 'undefined').map(c => c.filterDescriptor) ?? [];
+        this.hasColumnFilters = this.filterDescriptors.length > 0;
+        // get layout preferences if they exist
+        if (this.descriptor?.model.typeName) {
+            this.localstorageKey = TableviewUtil.generateTableLayoutPrefsKey(this.descriptor?.model.typeName, this.router.url, this.descriptor?.dataKey);
+            const preferences = this.localStorageService.getItem(this.cmpTypeName, this.localstorageKey);
+            if (preferences && typeof preferences === 'object') {
+                if (preferences.columnWidths) {
+                    this.layoutPreferences.columnWidths = preferences.columnWidths;
+                }
+                if (preferences.columnOrder && Array.isArray(preferences.columnOrder) && preferences.columnOrder.every((el) => typeof el === 'string')) {
+                    this.layoutPreferences.columnOrder = preferences.columnOrder;
+                }
+                if (preferences.columnVisibility && Array.isArray(preferences.columnVisibility) && preferences.columnVisibility.every((el) => typeof el === 'string')) {
+                    this.layoutPreferences.columnVisibility = preferences.columnVisibility;
+                }
+            }
+        }
+        // initialize columns with additional properties
+        if (this.descriptor?.columns) {
+            this.areColumnsReorderable = this.descriptor.columns.some(value => value.isReorderable);
+            this.areColumnsToggleable = this.descriptor.columns.some(value => value.isToggleable);
+            this.columns = this.descriptor.columns.map(col => ({
+                descriptor: col,
+                disabled: !col.isToggleable,
+                isVisible: this.layoutPreferences.columnVisibility ? this.layoutPreferences.columnVisibility.includes(col.property) : col.isVisible,
+                width: this.layoutPreferences.columnWidths?.[col.property]
+            }));
+            if (this.layoutPreferences.columnOrder) {
+                const newColumnOrder = [];
+                for (const colName of this.layoutPreferences.columnOrder) {
+                    const foundCol = this.columns.find(el => el.descriptor.property === colName);
+                    if (foundCol) {
+                        newColumnOrder.push(foundCol);
+                    }
+                }
+                if (newColumnOrder.length === this.columns.length)
+                    this.columns = newColumnOrder;
+            }
+            this.visibleColumns = this.columns.filter(el => el.isVisible);
+        }
+    }
     updatePrimeSortAndFilter(mediusQueryParam) {
         this.multiSortMeta = this.createSortMeta(mediusQueryParam);
         this.filterMetadata = this.createFilterMeta(mediusQueryParam);
@@ -13944,7 +13953,7 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
                     this.descriptor.lookupTableDescriptor.defaultSortProperty.forEach((p, idx) => queryParamBuilder.withSort(p, this.descriptor.lookupTableDescriptor.defaultSortAsc[idx]));
                 }
                 if (this.descriptor.hasLookupExcludeValues) {
-                    const filterValues = this.formControl.value.map((i) => i[this.descriptor.excludeValueProperty]);
+                    const filterValues = this.formControl.value.map((i) => ObjectUtil.getPropertyByPath(i, this.descriptor.excludeValueProperty));
                     queryParamBuilder.withFilter(this.descriptor.excludeFilterProperty, filterValues, undefined, MediusFilterMatchType.NotIn);
                 }
                 this.lookupDataProviderSubscription = this.descriptor.lookupTableDataProvider?.getAll(queryParamBuilder.build(), this.dialogDataProviderService).subscribe({
@@ -14005,7 +14014,7 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
                 name: 'FormlyFieldTableDialogMultiselectComponentError'
             });
         }
-        value = value.filter((i) => i[compareProperty] !== item[compareProperty]);
+        value = value.filter((i) => ObjectUtil.getPropertyByPath(i, compareProperty) !== ObjectUtil.getPropertyByPath(item, compareProperty));
         this.formControl.patchValue(value);
         this.formControl.markAsTouched();
         this.formControl.markAsDirty();
@@ -14064,7 +14073,8 @@ class MngFormlyFieldActionComponent extends FieldType {
         this.buttonClass = this.descriptor.button.styleClass.build();
     }
     onClick() {
-        this.descriptor.runFunction?.({
+        this.actionMessage = undefined;
+        const result = this.descriptor.runFunction?.({
             descriptor: this.descriptor,
             formEditorComponent: this.props.formEditorComponent,
             formly: {
@@ -14076,13 +14086,26 @@ class MngFormlyFieldActionComponent extends FieldType {
                 props: this.props
             }
         });
+        if (result) {
+            if (isObservable(result)) {
+                result.subscribe(res => this.processResult(res));
+            }
+            else {
+                this.processResult(result);
+            }
+        }
+    }
+    processResult(res) {
+        if (res.message) {
+            this.actionMessage = res.message;
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: MngFormlyFieldActionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: MngFormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<button\n    type=\"button\"\n    pButton\n    pRipple\n    [icon]=\"$any(descriptor.button.icon)\"\n    [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n    [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n    [disabled]=\"formControl.disabled\"\n    (click)=\"onClick()\"\n    [class]=\"buttonClass\"></button>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: MngFormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    <p-message *ngIf=\"actionMessage\" [text]=\"actionMessage!.content\" [severity]=\"actionMessage?.severity ?? 'success'\"></p-message>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5$2.UIMessage, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: MngFormlyFieldActionComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-formly-field-action', imports: [ButtonModule, RippleModule, TranslateModule, TooltipModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n    type=\"button\"\n    pButton\n    pRipple\n    [icon]=\"$any(descriptor.button.icon)\"\n    [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n    [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n    [disabled]=\"formControl.disabled\"\n    (click)=\"onClick()\"\n    [class]=\"buttonClass\"></button>\n" }]
+            args: [{ standalone: true, selector: 'mng-formly-field-action', imports: [ButtonModule, RippleModule, TranslateModule, TooltipModule, JsonPipe, MessageModule, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    <p-message *ngIf=\"actionMessage\" [text]=\"actionMessage!.content\" [severity]=\"actionMessage?.severity ?? 'success'\"></p-message>\n</div>\n" }]
         }] });
 
 class MngFormlyFieldCustomComponent extends FieldType {