@mediusinc/mng-commons 0.12.2 → 0.13.0

package/fesm2020/mediusinc-mng-commons.mjs

@@ -547,6 +547,26 @@ class TableviewDataProvider extends EditorDataProvider {
     }
 }
 
+class TableviewCrudDataProvider extends TableviewDataProvider {
+    constructor(modelType, serviceType, idPropertyName, useGetAllForFetch = false) {
+        super(modelType, serviceType);
+        this.withGetAll((queryParam, service) => service.getAllPost(queryParam));
+        if (useGetAllForFetch) {
+            const selectedIdPropertyName = idPropertyName ?? ModelUtil.findIdAttribute(modelType) ?? 'id';
+            this.withFetch((id, service) => {
+                const qp = MediusQueryParamBuilder.create(10, 0).withFilter(selectedIdPropertyName, id, id, MediusFilterMatchType.Equals, true).build();
+                return service.getAllPost(qp).pipe(map(res => res.pageData[0]));
+            });
+        }
+        else {
+            this.withFetch((id, service) => service.getByIdGet(id));
+        }
+        this.withCreate((item, service) => service.createPost(item));
+        this.withUpdate((id, item, service) => service.updatePut(id, item));
+        this.withDelete((id, item, service) => service.removeDelete(id, item));
+    }
+}
+
 var AuthorizationTypeEnum;
 (function (AuthorizationTypeEnum) {
     AuthorizationTypeEnum["All"] = "ALL";
@@ -839,7 +859,7 @@ class StylesUtil {
         }
     }
     static getActionButtonRoundedWidth(action) {
-        switch (action.size) {
+        switch (action.buttonDescriptor.styleClass.size) {
             case ActionSizeEnum.ExtraSmall:
                 return StylesUtil.BUTTON_ROUNDED_WIDTH_XS;
             case ActionSizeEnum.Small:
@@ -863,17 +883,18 @@ StylesUtil.TABLE_CELL_PADDING_X_SM = 4;
 StylesUtil.TABLE_CELL_PADDING_X_LG = 12;
 
 class ButtonStyleBuilder {
-    constructor(level, customClass) {
+    constructor(level = ActionLevelEnum.Default, customClass) {
         this._size = ActionSizeEnum.Normal;
         this._textButton = false;
         this._outlineButton = false;
         this._raisedButton = false;
+        this._roundedStyle = ButtonStyleRoundedEnum.DEFAULT;
         this._actionLevel = level;
         this._customClass = customClass;
     }
     getButtonClass(hasNoTitle = false) {
         const styles = [this.convertActionLevelToStyleClass(), this.convertSizeToStyleClass(), this._customClass];
-        if (hasNoTitle) {
+        if (hasNoTitle && this._roundedStyle === ButtonStyleRoundedEnum.DEFAULT) {
             styles.push(`p-button-rounded mng-action-button-icon`);
         }
         if (this._textButton) {
@@ -885,37 +906,78 @@ class ButtonStyleBuilder {
         if (this._raisedButton) {
             styles.push(`p-button-raised`);
         }
+        if (this._roundedStyle === ButtonStyleRoundedEnum.ROUNDED) {
+            styles.push('p-button-rounded');
+        }
         return styles.join(' ');
     }
-    create(actionLevel, size, textButton, outlineButton, raisedButton, customClass) {
+    /**
+     * creates instance of style builder with custom properties
+     * @param actionLevel ActionLevelEnum
+     * @param size ActionSizeEnum
+     * @param textButton if true, text button will be applied
+     * @param outlineButton if true, outlined button will be applied
+     * @param raisedButton if true, raised button will be applied
+     * @param customClass additional custom classes (will be added at generating)
+     */
+    create(actionLevel, size, textButton, outlineButton, raisedButton, roundedButton, customClass) {
         this._actionLevel = actionLevel ?? this._actionLevel;
         this._size = size ?? this._size;
         this._textButton = textButton ?? this._textButton;
         this._outlineButton = outlineButton ?? this._outlineButton;
         this._raisedButton = raisedButton ?? this._raisedButton;
+        this._roundedStyle = roundedButton ?? this._roundedStyle;
         this._customClass = customClass;
         return this;
     }
+    /**
+     * sets custom action level and returns this object
+     * @param actionLevel
+     */
     withActionLevel(actionLevel) {
         this._actionLevel = actionLevel;
         return this;
     }
+    /**
+     * sets custom size and return this object
+     * @param size
+     */
     withSize(size) {
         this._size = size;
         return this;
     }
+    /**
+     * sets text button property
+     * @param withText default true
+     */
     withTextButton(withText = true) {
         this._textButton = withText;
         return this;
     }
+    /**
+     * sets outline button property
+     * @param withOutline default true
+     */
     withOutlineButton(withOutline = true) {
         this._outlineButton = withOutline;
         return this;
     }
+    /**
+     * sets raised button property
+     * @param withRaised default true
+     */
     withRaisedButton(withRaised = true) {
         this._raisedButton = withRaised;
         return this;
     }
+    withRoundedButton(roundedStyle = ButtonStyleRoundedEnum.ROUNDED) {
+        this._roundedStyle = roundedStyle;
+        return this;
+    }
+    /**
+     * sets custom style class
+     * @param customClass
+     */
     withCustomClass(customClass) {
         this._customClass = customClass;
         return this;
@@ -942,15 +1004,15 @@ class ButtonStyleBuilder {
     convertSizeToStyleClass() {
         switch (this._size) {
             case ActionSizeEnum.ExtraSmall:
-                return 'mng-button-xs';
+                return 'p-button-sm mng-button-xs';
             case ActionSizeEnum.Small:
-                return 'mng-button-sm';
+                return 'p-button-sm mng-button-sm';
             case ActionSizeEnum.Normal:
                 return '';
             case ActionSizeEnum.Large:
-                return 'mng-button-lg';
+                return 'p-button-lg mng-button-lg';
             case ActionSizeEnum.ExtraLarge:
-                return 'mng-button-xl';
+                return 'p-button-lg mng-button-xl';
         }
     }
     get actionLevel() {
@@ -968,10 +1030,123 @@ class ButtonStyleBuilder {
     get raisedButton() {
         return this._raisedButton;
     }
+    get roundedStyle() {
+        return this._roundedStyle;
+    }
     get customClass() {
         return this._customClass;
     }
 }
+var ButtonStyleRoundedEnum;
+(function (ButtonStyleRoundedEnum) {
+    ButtonStyleRoundedEnum[ButtonStyleRoundedEnum["DEFAULT"] = 0] = "DEFAULT";
+    ButtonStyleRoundedEnum[ButtonStyleRoundedEnum["ROUNDED"] = 1] = "ROUNDED";
+    ButtonStyleRoundedEnum[ButtonStyleRoundedEnum["SQUARE"] = 2] = "SQUARE";
+})(ButtonStyleRoundedEnum || (ButtonStyleRoundedEnum = {}));
+
+class ActionConfirmationDialogDescriptor {
+    constructor() {
+        this._closeOnEscape = true; // Defines if dialog closes when esc key is pressed.
+        this._closable = true; // Defines if dialog is closable.
+        this._acceptButtonStyle = new ButtonStyleBuilder(ActionLevelEnum.Default);
+        this._rejectButtonStyle = new ButtonStyleBuilder(ActionLevelEnum.Default).withTextButton();
+        this._icon = 'pi pi-exclamation-triangle';
+        this._acceptIcon = 'pi pi-check';
+        this._rejectIcon = 'pi pi-times';
+    }
+    withIcon(icon) {
+        this._icon = icon;
+        return this;
+    }
+    withTitle(title) {
+        this._title = title;
+        return this;
+    }
+    withMessage(message) {
+        this._message = message;
+        return this;
+    }
+    withAcceptLabel(acceptLabel) {
+        this._acceptLabel = acceptLabel;
+        return this;
+    }
+    withAcceptIcon(acceptIcon) {
+        this._acceptIcon = acceptIcon;
+        return this;
+    }
+    withAcceptButtonStyle(buttonStyle) {
+        this._acceptButtonStyle = buttonStyle;
+        return this;
+    }
+    withRejectLabel(rejectLabel) {
+        this._rejectLabel = rejectLabel;
+        return this;
+    }
+    withRejectIcon(rejectIcon) {
+        this._rejectIcon = rejectIcon;
+        return this;
+    }
+    withRejectButtonStyle(buttonStyle) {
+        this._rejectButtonStyle = buttonStyle;
+        return this;
+    }
+    /**
+     * set if dialog can be closed on escaped pressed
+     * if true, then closable is also set to true
+     * @param closeOnEscape
+     */
+    withCloseOnEscape(closeOnEscape) {
+        if (closeOnEscape) {
+            this._closable = true;
+        }
+        this._closeOnEscape = closeOnEscape;
+        return this;
+    }
+    withClosable(closable) {
+        this._closable = closable;
+        return this;
+    }
+    withRunConfirmationConfigMapFn(runConfirmationConfigMapFn) {
+        this._runConfirmationConfigMapFn = runConfirmationConfigMapFn;
+        return this;
+    }
+    get icon() {
+        return this._icon;
+    }
+    get title() {
+        return this._title;
+    }
+    get message() {
+        return this._message;
+    }
+    get acceptLabel() {
+        return this._acceptLabel;
+    }
+    get acceptIcon() {
+        return this._acceptIcon;
+    }
+    get acceptButtonStyle() {
+        return this._acceptButtonStyle;
+    }
+    get rejectLabel() {
+        return this._rejectLabel;
+    }
+    get rejectIcon() {
+        return this._rejectIcon;
+    }
+    get rejectButtonStyle() {
+        return this._rejectButtonStyle;
+    }
+    get closeOnEscape() {
+        return this._closeOnEscape;
+    }
+    get closable() {
+        return this._closable;
+    }
+    get runConfirmationConfigMapFn() {
+        return this._runConfirmationConfigMapFn;
+    }
+}
 
 class ActionDescriptor {
     constructor(model, actionName, parentType, parentProperty) {
@@ -980,10 +1155,10 @@ class ActionDescriptor {
         this._position = ActionPositionEnum.ToolbarRight;
         this._level = ActionLevelEnum.Default;
         this._routeUrl = null;
-        this._buttonStyle = new ButtonStyleBuilder(this._level);
-        this._hasRunConfirmation = false;
         this._hasRunNotificationSuccess = true;
         this._hasRunNotificationError = true;
+        //button
+        this._buttonDescriptor = new ButtonDescriptor();
         this._model = model;
         this._actionName = actionName;
         if ((parentType && !parentProperty) || (!parentProperty && parentProperty)) {
@@ -1032,15 +1207,6 @@ class ActionDescriptor {
     get routeUrl() {
         return this._routeUrl;
     }
-    get title() {
-        return this._title;
-    }
-    get icon() {
-        return this._icon;
-    }
-    get tooltip() {
-        return this._tooltip;
-    }
     get dataProvider() {
         return this._dataProvider;
     }
@@ -1065,83 +1231,14 @@ class ActionDescriptor {
     get actionNameLong() {
         return this._actionNameLong;
     }
-    get buttonStyle() {
-        return this._buttonStyle;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
     get className() {
-        return this._buttonStyle.customClass;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isStyleText() {
-        return this._buttonStyle.textButton;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isStyleOutlined() {
-        return this._buttonStyle.outlineButton;
+        return this.buttonDescriptor.styleClass.customClass;
     }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isStyleRaised() {
-        return this._buttonStyle.raisedButton;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get size() {
-        return this._buttonStyle.size;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isSizeExtraSmall() {
-        return this._buttonStyle.size === ActionSizeEnum.ExtraSmall;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isSizeSmall() {
-        return this._buttonStyle.size === ActionSizeEnum.Small;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isSizeLarge() {
-        return this._buttonStyle.size === ActionSizeEnum.Large;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isSizeExtraLarge() {
-        return this._buttonStyle.size === ActionSizeEnum.ExtraLarge;
+    get runConfirmationDialogDescriptor() {
+        return this._runConfirmationDialogDescriptor;
     }
     get hasRunConfirmation() {
-        return this._hasRunConfirmation;
-    }
-    get runConfirmationIcon() {
-        return this._runConfirmationIcon;
-    }
-    get runConfirmationTitle() {
-        return this._runConfirmationTitle;
-    }
-    get runConfirmationMessage() {
-        return this._runConfirmationMessage;
-    }
-    get runConfirmationAcceptTitle() {
-        return this._runConfirmationAcceptTitle;
-    }
-    get runConfirmationRejectTitle() {
-        return this._runConfirmationRejectTitle;
-    }
-    get runConfirmationConfigMapFn() {
-        return this._runConfirmationConfigMapFn;
+        return this._runConfirmationDialogDescriptor !== null && this._runConfirmationDialogDescriptor !== undefined;
     }
     get hasRunNotificationSuccess() {
         return this._hasRunNotificationSuccess;
@@ -1173,6 +1270,9 @@ class ActionDescriptor {
     get permissionsRouteType() {
         return this._permissionsRouteType;
     }
+    get buttonDescriptor() {
+        return this._buttonDescriptor;
+    }
     withDataProvider(dataProvider) {
         this._dataProvider = dataProvider;
         return this;
@@ -1201,70 +1301,25 @@ class ActionDescriptor {
         this._routeUrl = routeUrl;
         return this;
     }
-    withLevel(level) {
-        this._level = level;
-        this._buttonStyle = this._buttonStyle.withActionLevel(level);
-        return this;
-    }
-    /**
-     * Overrides default title key with model action key (${model.typeName}.actions.${actionName}). Not relevant if parentType name is provided.
-     */
-    withModelTitle() {
-        this._title = `${this._i18nModelActionBaseKey}.title`;
+    withPosition(position) {
+        this._position = position;
         return this;
     }
     /**
-     * Overrides default title key (${actionName}.title). If null, no title will be shown.
-     * @param title Title i18n key or title.
+     * creates confirmation action with default style based on action descriptor
      */
-    withTitle(title) {
-        this._title = title;
-        return this;
-    }
-    withIcon(icon) {
-        this._icon = icon;
-        return this;
-    }
-    withTooltip(tooltip) {
-        this._tooltip = tooltip;
-        return this;
-    }
-    withClassName(className) {
-        this._buttonStyle = this._buttonStyle.withCustomClass(className);
-        return this;
-    }
-    withSize(size = ActionSizeEnum.Normal) {
-        this._buttonStyle = this._buttonStyle.withSize(size);
-        return this;
-    }
-    withStyle(styleText = false, styleOutlined = false, styleRaised = false) {
-        this._buttonStyle = this._buttonStyle.withOutlineButton(styleOutlined);
-        this._buttonStyle = this._buttonStyle.withRaisedButton(styleRaised);
-        this._buttonStyle = this._buttonStyle.withTextButton(styleText);
-        return this;
-    }
-    withPosition(position) {
-        this._position = position;
-        return this;
+    withRunConfirmation() {
+        this._runConfirmationDialogDescriptor = new ActionConfirmationDialogDescriptor();
+        this._runConfirmationDialogDescriptor.acceptButtonStyle.withActionLevel(this._level);
+        this._runConfirmationDialogDescriptor.rejectButtonStyle.withActionLevel(this._level);
+        return this._runConfirmationDialogDescriptor;
     }
     /**
-     * Add a confirmation dialogue to the action
-     * @param icon the icon to display on the confirmation dialogue
-     * @param title the title of the confirmation dialogue
-     * @param message the message on the confirmation dialogue
-     * @param acceptTitle the title of the accepting button
-     * @param rejectTitle the title of the rejecting button
-     * @param runConfirmationConfigMapFn function used to generate the confirmation dialogue. **WARNING** changing the *accept* and *reject* methods of the *confirmConfig* parameter
-     * may lead to unexpected behaviour
+     * Add a configuration dialogue to action using ActionConfigurationDescriptor
+     * @param confirmationDescriptor descriptor with customizable information for dialog
      */
-    withRunConfirmation(icon = 'pi pi-exclamation-triangle', title, message, acceptTitle, rejectTitle, runConfirmationConfigMapFn) {
-        this._hasRunConfirmation = true;
-        this._runConfirmationIcon = icon;
-        this._runConfirmationTitle = title;
-        this._runConfirmationMessage = message;
-        this._runConfirmationAcceptTitle = acceptTitle;
-        this._runConfirmationRejectTitle = rejectTitle;
-        this._runConfirmationConfigMapFn = runConfirmationConfigMapFn;
+    withRunConfirmationDescriptor(runConfirmationDialogDescriptor) {
+        this._runConfirmationDialogDescriptor = runConfirmationDialogDescriptor;
         return this;
     }
     withRunNotificationSuccess(title, message, hasNotification = true) {
@@ -1298,6 +1353,10 @@ class ActionDescriptor {
         this._permissionsRouteType = permissionsRouteType;
         return this;
     }
+    withButtonDescriptor(buttonDescriptor) {
+        this._buttonDescriptor = buttonDescriptor;
+        return this;
+    }
 }
 class ActionSimpleDescriptor extends ActionDescriptor {
     constructor(actionName, modelType, idProperty, titleProperty) {
@@ -1314,7 +1373,7 @@ class ActionEditorDescriptor extends ActionDescriptor {
         this._dialogSize = ActionEditorDialogSizeEnum.Normal;
         this._type = ActionTypeEnum.Editor;
         this._editorDescriptor = editorDescriptor;
-        this._editorActions.push(new ActionEditorSubmitDescriptor(this), new ActionEditorSubmitDescriptor(this, ActionEditorSubmitTypeEnum.Cancel));
+        this._editorActions.push(ActionEditorSubmitDescriptor.forPrimary(this), ActionEditorSubmitDescriptor.forSecondary(this));
     }
     get editorTitle() {
         return this._editorTitle;
@@ -1420,7 +1479,23 @@ class ActionEditorSubmitDescriptor extends ActionDescriptor {
         this._editorAction = editorAction;
         this._submitType = submitType;
         this._position = ActionPositionEnum.FooterRight;
-        this._buttonStyle = this._buttonStyle.withActionLevel(editorAction.level).withTextButton();
+        this.buttonDescriptor.styleClass.withActionLevel(editorAction.level).withTextButton();
+    }
+    /**
+     * creates primary action with primary button style
+     * @param editorAction
+     * @param submitType
+     */
+    static forPrimary(editorAction, submitType = ActionEditorSubmitTypeEnum.Submit) {
+        return new ActionEditorSubmitDescriptor(editorAction, submitType).withButtonDescriptor(new ButtonDescriptor().withStyleClass(new ButtonStyleBuilder()));
+    }
+    /**
+     * creates secondary button with text button style
+     * @param editorAction
+     * @param submitType
+     */
+    static forSecondary(editorAction, submitType = ActionEditorSubmitTypeEnum.Cancel) {
+        return new ActionEditorSubmitDescriptor(editorAction, submitType).withButtonDescriptor(new ButtonDescriptor().withStyleClass(new ButtonStyleBuilder().withTextButton()));
     }
     get submitType() {
         return this._submitType;
@@ -1454,8 +1529,8 @@ class ActionEditorAddDescriptor extends ActionEditorDescriptor {
         this.withPosition(ActionPositionEnum.ToolbarLeft);
         this.withRouteTrigger('add');
         this.withSubmitFunction(ActionDataProviderUtil.runCreateOrFail);
-        this.withLevel(ActionLevelEnum.Success);
-        this.withIcon('pi pi-plus');
+        this.buttonDescriptor.styleClass.withActionLevel(ActionLevelEnum.Success);
+        this.buttonDescriptor.withIcon('pi pi-plus');
         this.withPermissionsRouteType(Permissions.ActionTypes.ADD);
     }
     withServiceType(serviceType) {
@@ -1478,12 +1553,11 @@ class ActionEditorEditDescriptor extends ActionEditorDescriptor {
     constructor(editorDescriptor) {
         super(editorDescriptor, ActionEditorEditDescriptor.ACTION_NAME);
         this.withPosition(ActionPositionEnum.RowInline);
-        this.withTitle(null);
         this.withRouteTrigger(':itemId/edit');
         this.withFetchFunction(ActionDataProviderUtil.runFetchOrFail);
         this.withSubmitFunction(ActionDataProviderUtil.runUpdateOrFail);
-        this.withIcon('pi pi-pencil');
         this.withPermissionsRouteType(Permissions.ActionTypes.EDIT);
+        this.buttonDescriptor.withLabel(null).withIcon('pi pi-pencil');
     }
     withServiceType(serviceType) {
         return this.withServiceSubmitFunction(serviceType);
@@ -1505,12 +1579,11 @@ class ActionDeleteDescriptor extends ActionDescriptor {
     constructor(model) {
         super(model, ActionDeleteDescriptor.ACTION_NAME);
         this.withPosition(ActionPositionEnum.RowInline);
-        this.withTitle(null);
         this.withRunFunction(ActionDataProviderUtil.runDeleteOrFail);
-        this.withLevel(ActionLevelEnum.Danger);
-        this.withIcon('pi pi-trash');
-        this.withRunConfirmation(undefined);
+        this.buttonDescriptor.styleClass.withActionLevel(ActionLevelEnum.Danger);
+        this.withRunConfirmation();
         this.withPermissionsRouteType(Permissions.ActionTypes.DELETE);
+        this.buttonDescriptor.withLabel(null).withIcon('pi pi-trash');
     }
     withServiceType(serviceType) {
         return this.withServiceDeleteFunction(serviceType);
@@ -1968,6 +2041,12 @@ class ColumnDescriptor {
     get hasCopyToClipboard() {
         return this._hasCopyToClipboard;
     }
+    get template() {
+        return this._template;
+    }
+    get getter() {
+        return this._getter;
+    }
     asType(type = ColumnTypeEnum.String) {
         this._columnType = type;
         return this;
@@ -2101,6 +2180,14 @@ class ColumnDescriptor {
         this._hasCopyToClipboard = hasCopyToCliboard;
         return this;
     }
+    withTemplate(template) {
+        this._template = template;
+        return this;
+    }
+    withGetter(getter) {
+        this._getter = getter;
+        return this;
+    }
     copy() {
         const descriptor = new ColumnDescriptor(this._table, this._property);
         descriptor._jsonPath = this._jsonPath;
@@ -2127,6 +2214,8 @@ class ColumnDescriptor {
         descriptor._minWidth = this._minWidth;
         descriptor._maxWidth = this._maxWidth;
         descriptor._hasCopyToClipboard = this._hasCopyToClipboard;
+        descriptor._template = this._template;
+        descriptor._getter = this._getter;
         return descriptor;
     }
 }
@@ -3503,6 +3592,116 @@ class TableviewDescriptor {
     }
 }
 
+class ButtonDescriptor {
+    constructor() {
+        this._disabled = false;
+        this._iconPosition = 'left';
+        this._styleClass = new ButtonStyleBuilder();
+        this._loading = false;
+        this._loadingIcon = 'pi pi-spinner pi-spin';
+    }
+    withLabel(label) {
+        this._label = label;
+        return this;
+    }
+    withDisabled(disabled = true) {
+        this._disabled = disabled;
+        return this;
+    }
+    withIcon(icon) {
+        this._icon = icon;
+        return this;
+    }
+    withIconPosition(iconPosition) {
+        this._iconPosition = iconPosition;
+        return this;
+    }
+    withStyleClass(style) {
+        this._styleClass = style;
+        return this;
+    }
+    withOnClick(onClick) {
+        this._onClick = onClick;
+        return this;
+    }
+    withOnFocus(onFocus) {
+        this._onFocus = onFocus;
+        return this;
+    }
+    withOnBlur(onBlur) {
+        this._onBlur = onBlur;
+        return this;
+    }
+    withLoading(loading = true) {
+        this._loading = loading;
+        return this;
+    }
+    withLoadingIcon(loadingIcon) {
+        this._loadingIcon = loadingIcon;
+        return this;
+    }
+    withBadge(badge) {
+        this._badge = badge;
+        return this;
+    }
+    withTooltip(tooltip) {
+        this._tooltip = tooltip;
+        return this;
+    }
+    get label() {
+        return this._label;
+    }
+    get disabled() {
+        return this._disabled;
+    }
+    get icon() {
+        return this._icon;
+    }
+    get iconPosition() {
+        return this._iconPosition;
+    }
+    get styleClass() {
+        return this._styleClass;
+    }
+    get onClick() {
+        return this._onClick;
+    }
+    get onFocus() {
+        return this._onFocus;
+    }
+    get onBlur() {
+        return this._onBlur;
+    }
+    get loading() {
+        return this._loading;
+    }
+    get loadingIcon() {
+        return this._loadingIcon;
+    }
+    get badge() {
+        return this._badge;
+    }
+    get tooltip() {
+        return this._tooltip;
+    }
+    copy() {
+        const descriptor = new ButtonDescriptor();
+        descriptor._label = this._label;
+        descriptor._disabled = this._disabled;
+        descriptor._icon = this._icon;
+        descriptor._iconPosition = this._iconPosition;
+        descriptor._styleClass = this._styleClass;
+        descriptor._onClick = this._onClick;
+        descriptor._onFocus = this._onFocus;
+        descriptor._onBlur = this._onBlur;
+        descriptor._loading = this._loading;
+        descriptor._loadingIcon = this._loadingIcon;
+        descriptor._badge = this._badge;
+        descriptor._tooltip = this._tooltip;
+        return descriptor;
+    }
+}
+
 class EditorFormlyUtil {
     static createFormlyConfigFromDescriptor(descriptor) {
         const fields = [];
@@ -4272,6 +4471,9 @@ class StringUtil {
                 else if (typeof value[key] === 'object') {
                     escapedValue[key] = StringUtil.escapeHtmlAny(value[key]);
                 }
+                else {
+                    escapedValue[key] = value[key];
+                }
             }
             return escapedValue;
         }
@@ -5168,43 +5370,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 }]
         }] });
 
-class MngLinkFormatterPipe {
-    parseUrl(s, itemId, itemAny, model, actionData) {
-        if (s === ':itemId') {
-            return itemId;
-        }
-        else if (model && s.startsWith(`:${model.typeName}.`)) {
-            return itemAny[s.substring(model.typeName.length + 2)] ?? '';
-        }
-        else if (s.startsWith(':')) {
-            return actionData?.[s.substring(1)] ?? '';
-        }
-        else {
-            return s;
-        }
-    }
-    transform(value, itemId, item, model, actionData) {
-        const itemAny = (item ?? {});
-        if (typeof value === 'string') {
-            return value.split('/').map(s => this.parseUrl(s, itemId, itemAny, model, actionData));
-        }
-        else {
-            const transformedItems = [];
-            value.forEach(val => transformedItems.push(...val.split('/').map(s => this.parseUrl(s, itemId, itemAny, model, actionData))));
-            return transformedItems;
-        }
-    }
-}
-MngLinkFormatterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngLinkFormatterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-MngLinkFormatterPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.0", ngImport: i0, type: MngLinkFormatterPipe, name: "linkFormatter" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngLinkFormatterPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'linkFormatter',
-                    pure: true
-                }]
-        }] });
-
 /**
  * Imitation of JSONPath Syntax. Supports:
  *  - Root object notation with '$'
@@ -5242,7 +5407,6 @@ class JsonPathPipe {
                     const arrayPath = p.substring(0, leftBracketIdx);
                     const arrayIdx = +p.substring(leftBracketIdx + 1, p.length - 1);
                     const array = currValue[arrayPath];
-                    console.log(arrayPath, arrayIdx, array);
                     if (Array.isArray(array)) {
                         if (arrayIdx >= 0 && arrayIdx < array.length) {
                             // valid index, continue on the path
@@ -5283,8 +5447,128 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 }]
         }] });
 
+class MngParametrizePipe {
+    constructor() {
+        this.jsonPath = new JsonPathPipe();
+    }
+    transform(value, itemId, item, actionData) {
+        let params = {};
+        if (actionData) {
+            params = {
+                ...params,
+                ...actionData
+            };
+        }
+        if (item) {
+            params = {
+                ...params,
+                item: StringUtil.escapeHtmlAny(item)
+            };
+        }
+        if (itemId) {
+            params = {
+                ...params,
+                itemId: itemId
+            };
+        }
+        if (typeof value === 'string') {
+            return this.transformString(value, params);
+        }
+        else if (Array.isArray(value) && value.length > 0 && typeof value[0] === 'string') {
+            return value.map((s) => this.transformString(s, params));
+        }
+        else if (typeof value === 'object') {
+            // process only first level citizens
+            const obj = { ...value };
+            for (const key in obj) {
+                const objProp = obj[key];
+                if (typeof objProp === 'string') {
+                    obj[key] = this.transformString(objProp, params);
+                }
+            }
+            return obj;
+        }
+        else {
+            return value;
+        }
+    }
+    transformString(s, params) {
+        if ((s.indexOf('/') >= 0 && s.indexOf(':') >= 0) || s.startsWith(':')) {
+            // this is url
+            return s
+                .split('/')
+                .map(s => this.parametrizeStringAsUrl(s, params))
+                .join('/');
+        }
+        else {
+            // parametrize normally
+            return this.parametrizeString(s, params);
+        }
+    }
+    parametrizeStringAsUrl(s, params) {
+        if (s.startsWith(':')) {
+            const itemProperty = s.substring(1);
+            return this.jsonPath.transform(params, itemProperty) ?? '';
+        }
+        else {
+            return s;
+        }
+    }
+    parametrizeString(s, params) {
+        return s.replace(/{{\s?([^{}\s]*)\s?}}/g, (subs, key) => this.jsonPath.transform(params, key) ?? subs);
+    }
+}
+MngParametrizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngParametrizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+MngParametrizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.0", ngImport: i0, type: MngParametrizePipe, name: "parametrize" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngParametrizePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'parametrize',
+                    pure: true
+                }]
+        }] });
+
+class MngGetterPipe {
+    transform(value, getterFunction) {
+        if (typeof getterFunction === 'function') {
+            return getterFunction(value);
+        }
+        return value;
+    }
+}
+MngGetterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngGetterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+MngGetterPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.0", ngImport: i0, type: MngGetterPipe, name: "getter" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngGetterPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'getter',
+                    pure: true
+                }]
+        }] });
+
+class MngTemplatePipe {
+    constructor(parametrizePipe) {
+        this.parametrizePipe = parametrizePipe;
+    }
+    transform(value, template) {
+        if (typeof template === 'string') {
+            return this.parametrizePipe.transform(template, undefined, value);
+        }
+        return value;
+    }
+}
+MngTemplatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTemplatePipe, deps: [{ token: MngParametrizePipe }], target: i0.ɵɵFactoryTarget.Pipe });
+MngTemplatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.0", ngImport: i0, type: MngTemplatePipe, name: "template" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTemplatePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'template',
+                    pure: true
+                }]
+        }], ctorParameters: function () { return [{ type: MngParametrizePipe }]; } });
+
 class MngActionExecutorService {
-    constructor(injector, router, dialogService, confirmationService, translate, configurationService, navigationService, errorMapper, linkFormatter, defaultEditorDialogComponent) {
+    constructor(injector, router, dialogService, confirmationService, translate, configurationService, navigationService, errorMapper, parametrize, defaultEditorDialogComponent) {
         this.injector = injector;
         this.router = router;
         this.dialogService = dialogService;
@@ -5293,7 +5577,7 @@ class MngActionExecutorService {
         this.configurationService = configurationService;
         this.navigationService = navigationService;
         this.errorMapper = errorMapper;
-        this.linkFormatter = linkFormatter;
+        this.parametrize = parametrize;
         this.defaultEditorDialogComponent = defaultEditorDialogComponent;
         this.debug = false;
         // this.debug = true;
@@ -5540,34 +5824,45 @@ class MngActionExecutorService {
         const context = this.prepareActionContext(instance, parameters, dataProvider, previousActionInstance);
         if (action.hasRunConfirmation) {
             const sourceComponent = parameters?.sourceComponent;
+            const confirmationDescriptor = action.runConfirmationDialogDescriptor;
             if (typeof sourceComponent?.getConfirmationService !== 'function' || typeof sourceComponent?.getConfirmationServiceInstanceKey !== 'function') {
                 throw new Error(`Source component ${sourceComponent} should be implementing IConfirmationService interface to be able to provide confirmation functionality.`);
             }
+            const item = parameters.item;
             const srcConfirmComponent = sourceComponent;
             let confirmParams = {
                 key: srcConfirmComponent.getConfirmationServiceInstanceKey(action),
-                acceptVisible: false,
-                rejectVisible: false
+                icon: confirmationDescriptor.icon,
+                acceptVisible: true,
+                acceptIcon: confirmationDescriptor.acceptIcon ?? undefined,
+                acceptButtonStyleClass: confirmationDescriptor.acceptButtonStyle.getButtonClass(),
+                rejectVisible: true,
+                rejectIcon: confirmationDescriptor.rejectIcon ?? undefined,
+                rejectButtonStyleClass: confirmationDescriptor.rejectButtonStyle.getButtonClass(),
+                closeOnEscape: confirmationDescriptor.closeOnEscape
             };
-            const item = parameters.item;
-            if (action.runConfirmationTitle !== null) {
-                confirmParams.header = I18nUtils.Action.get(this.translate, action, 'confirm.title', action.runConfirmationTitle, item, 'general.confirmation') ?? undefined;
+            if (confirmationDescriptor.title !== null) {
+                confirmParams.header = I18nUtils.Action.get(this.translate, action, 'confirm.title', confirmationDescriptor.title, item, 'general.confirmation') ?? undefined;
             }
-            if (action.runConfirmationMessage !== null) {
+            if (confirmationDescriptor.message !== null) {
                 confirmParams.message =
-                    I18nUtils.Action.get(this.translate, action, 'confirm.message', action.runConfirmationMessage, StringUtil.escapeHtmlAny(item), 'general.confirmation') ??
+                    I18nUtils.Action.get(this.translate, action, 'confirm.message', confirmationDescriptor.message, StringUtil.escapeHtmlAny(item), 'general.confirmation') ??
                         undefined;
             }
-            if (action.runConfirmationIcon !== null) {
-                confirmParams.icon = action.runConfirmationIcon === undefined ? 'pi pi-exclamation-triangle' : action.runConfirmationIcon;
+            if (confirmationDescriptor.acceptLabel !== null) {
+                confirmParams.acceptLabel = I18nUtils.Action.get(this.translate, action, 'confirm.accept', confirmationDescriptor.acceptLabel, item, 'general.yes') ?? undefined;
             }
-            if (action.runConfirmationAcceptTitle !== null) {
-                confirmParams.acceptLabel = I18nUtils.Action.get(this.translate, action, 'confirm.accept', action.runConfirmationAcceptTitle, item, 'general.yes') ?? undefined;
-                confirmParams.acceptVisible = true;
+            if (confirmationDescriptor.acceptIcon !== null) {
+                confirmParams.acceptIcon = confirmationDescriptor.acceptIcon;
             }
-            if (action.runConfirmationRejectTitle !== null) {
-                confirmParams.rejectLabel = I18nUtils.Action.get(this.translate, action, 'confirm.reject', action.runConfirmationRejectTitle, item, 'general.no') ?? undefined;
-                confirmParams.rejectVisible = true;
+            if (confirmationDescriptor.rejectIcon !== null) {
+                confirmParams.rejectIcon = confirmationDescriptor.rejectIcon;
+            }
+            if (confirmationDescriptor.rejectLabel !== null) {
+                confirmParams.rejectLabel = I18nUtils.Action.get(this.translate, action, 'confirm.reject', confirmationDescriptor.rejectLabel, item, 'general.no') ?? undefined;
+            }
+            if (confirmationDescriptor.rejectLabel === null && confirmationDescriptor.rejectIcon === null) {
+                confirmParams.rejectVisible = false;
             }
             confirmParams.accept = () => {
                 instance.state = ActionInstanceStateEnum.RunConfirmationEndAccept;
@@ -5577,8 +5872,8 @@ class MngActionExecutorService {
                 instance.state = ActionInstanceStateEnum.RunConfirmationEndReject;
                 this.deactivateAction(instance);
             };
-            if (action.runConfirmationConfigMapFn) {
-                confirmParams = action.runConfirmationConfigMapFn(context, confirmParams);
+            if (confirmationDescriptor.runConfirmationConfigMapFn) {
+                confirmParams = confirmationDescriptor.runConfirmationConfigMapFn(context, confirmParams);
             }
             context.confirmation = confirmParams;
             instance.state = ActionInstanceStateEnum.RunConfirmationStart;
@@ -5732,7 +6027,7 @@ class MngActionExecutorService {
             if (actionUrl.startsWith('/')) {
                 actionUrl = actionUrl.substring(1);
             }
-            const actionUrlSegments = this.linkFormatter.transform(actionUrl, parameters.itemId, parameters.item, action.model, parameters.actionData);
+            const actionUrlSegments = this.parametrize.transform(actionUrl, parameters.itemId, parameters.item, parameters.actionData).split('/');
             instance.triggerRouteNavigation = from(this.router.navigate([baseUrl, ...actionUrlSegments], { relativeTo: parameters.route, queryParams: parsedUrl.queryParams }));
             return instance;
         }
@@ -5794,11 +6089,11 @@ class MngActionExecutorService {
         return this.errorMapper.toMngError(error, actionError);
     }
 }
-MngActionExecutorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionExecutorService, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i3.DialogService }, { token: i2.ConfirmationService }, { token: i1$2.TranslateService }, { token: MngConfigurationService }, { token: MngNavigationService }, { token: MngErrorMapperService }, { token: MngLinkFormatterPipe }, { token: ACTION_EDITOR_DIALOG_COMPONENT_SETTING }], target: i0.ɵɵFactoryTarget.Injectable });
+MngActionExecutorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionExecutorService, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i3.DialogService }, { token: i2.ConfirmationService }, { token: i1$2.TranslateService }, { token: MngConfigurationService }, { token: MngNavigationService }, { token: MngErrorMapperService }, { token: MngParametrizePipe }, { token: ACTION_EDITOR_DIALOG_COMPONENT_SETTING }], target: i0.ɵɵFactoryTarget.Injectable });
 MngActionExecutorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionExecutorService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionExecutorService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i3.DialogService }, { type: i2.ConfirmationService }, { type: i1$2.TranslateService }, { type: MngConfigurationService }, { type: MngNavigationService }, { type: MngErrorMapperService }, { type: MngLinkFormatterPipe }, { type: i0.Type, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i3.DialogService }, { type: i2.ConfirmationService }, { type: i1$2.TranslateService }, { type: MngConfigurationService }, { type: MngNavigationService }, { type: MngErrorMapperService }, { type: MngParametrizePipe }, { type: i0.Type, decorators: [{
                     type: Inject,
                     args: [ACTION_EDITOR_DIALOG_COMPONENT_SETTING]
                 }] }]; } });
@@ -6259,7 +6554,7 @@ class MngActionComponent {
     }
     ngOnInit() {
         this.viewContainer = this.viewContainerInit ?? this.viewContainerService ?? undefined;
-        this.hasNoTitle = this.action.title === null;
+        this.hasNoTitle = this.action.buttonDescriptor.label === null;
         this.isEnabledSubject.next(true);
         this.isVisibleSubject.next(true);
         this.isPermittedSubject.next(true);
@@ -6282,7 +6577,7 @@ class MngActionComponent {
             this.isHostHidden = !isVisible || !isPermitted;
         });
         this.subscriptions.push(hostVisibilitySubscription);
-        this.buttonClass = this.action.buttonStyle.getButtonClass(this.hasNoTitle);
+        this.buttonClass = this.action.buttonDescriptor.styleClass.getButtonClass(this.hasNoTitle);
     }
     ngOnChanges(changes) {
         if (!(changes['item']?.firstChange ?? true) || !(changes['itemId']?.firstChange ?? true) || !(changes['actionData']?.firstChange ?? true)) {
@@ -6359,21 +6654,21 @@ class MngActionComponent {
         }
         if (!this.hasNoTitle) {
             this.labelSubscription?.unsubscribe();
-            this.labelSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'title', this.action?.title ?? undefined, this.item).subscribe({
+            this.labelSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'title', this.action.buttonDescriptor.label ?? undefined, this.item).subscribe({
                 next: i18n => this.labelSubject.next(i18n)
             });
         }
         this.tooltipSubscription?.unsubscribe();
-        this.tooltipSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'tooltip', this.action?.tooltip ?? undefined, this.item).subscribe({
+        this.tooltipSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'tooltip', this.action.buttonDescriptor.tooltip, this.item).subscribe({
             next: i18n => this.tooltipSubject.next(i18n)
         });
     }
 }
 MngActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1$2.TranslateService }, { token: MngAuthorizationService }, { token: MngActionExecutorService }, { token: i2.ConfirmationService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MngActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionComponent, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", inputDisabled: ["disabled", "inputDisabled"], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [icon]=\"$any(action.icon)\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : actionLink.url\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [class]=\"buttonClass\"\n        >{{ ($label | async) ?? '' }}</a\n    >\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.icon)\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"\n                ($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | linkFormatter: itemId:item:action.model:actionData)\n            \"\n            [queryParams]=\"actionLink.queryParams\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [class]=\"buttonClass\"\n            >{{ ($label | async) ?? '' }}</a\n        >\n    </ng-template>\n    <ng-template #button>\n        <button\n            type=\"button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.icon)\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"$any($tooltip | async)\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction($event)\"\n            [class]=\"buttonClass\"></button>\n    </ng-template>\n    <p-confirmDialog *ngIf=\"action.hasRunConfirmation\" [key]=\"action.actionName + '_' + cmpId\" [baseZIndex]=\"50\" appendTo=\"body\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "directive", type: i6.Ripple, selector: "[pRipple]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: MngLinkFormatterPipe, name: "linkFormatter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionComponent, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", inputDisabled: ["disabled", "inputDisabled"], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [icon]=\"$any(action.buttonDescriptor.icon)\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [class]=\"buttonClass\"\n        >{{ ($label | async) ?? '' }}</a\n    >\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.buttonDescriptor.icon)\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n            [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [class]=\"buttonClass\"\n            >{{ ($label | async) ?? '' }}</a\n        >\n    </ng-template>\n    <ng-template #button>\n        <button\n            type=\"button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.buttonDescriptor.icon)\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"$any($tooltip | async)\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction($event)\"\n            [class]=\"buttonClass\"></button>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"action.runConfirmationDialogDescriptor\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "directive", type: i6.Ripple, selector: "[pRipple]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: MngParametrizePipe, name: "parametrize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [icon]=\"$any(action.icon)\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : actionLink.url\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [class]=\"buttonClass\"\n        >{{ ($label | async) ?? '' }}</a\n    >\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.icon)\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"\n                ($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | linkFormatter: itemId:item:action.model:actionData)\n            \"\n            [queryParams]=\"actionLink.queryParams\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [class]=\"buttonClass\"\n            >{{ ($label | async) ?? '' }}</a\n        >\n    </ng-template>\n    <ng-template #button>\n        <button\n            type=\"button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.icon)\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"$any($tooltip | async)\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction($event)\"\n            [class]=\"buttonClass\"></button>\n    </ng-template>\n    <p-confirmDialog *ngIf=\"action.hasRunConfirmation\" [key]=\"action.actionName + '_' + cmpId\" [baseZIndex]=\"50\" appendTo=\"body\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
+            args: [{ selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [icon]=\"$any(action.buttonDescriptor.icon)\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [class]=\"buttonClass\"\n        >{{ ($label | async) ?? '' }}</a\n    >\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.buttonDescriptor.icon)\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n            [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [class]=\"buttonClass\"\n            >{{ ($label | async) ?? '' }}</a\n        >\n    </ng-template>\n    <ng-template #button>\n        <button\n            type=\"button\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.buttonDescriptor.icon)\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"$any($tooltip | async)\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction($event)\"\n            [class]=\"buttonClass\"></button>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"action.runConfirmationDialogDescriptor\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i1$2.TranslateService }, { type: MngAuthorizationService }, { type: MngActionExecutorService }, { type: i2.ConfirmationService }, { type: MngViewContainerComponentService, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { hostClass: [{
@@ -6654,13 +6949,14 @@ class MngFormEditorComponent {
             if (field && field.setter) {
                 const splitPath = field.property.split('.');
                 let fieldValue = formValue;
-                for (let i = 0; i < splitPath.length; i++) {
+                for (let i = 0; i < splitPath.length - 1; i++) {
                     const currentSubPath = splitPath[i];
                     if (typeof fieldValue[currentSubPath] !== 'object') {
                         fieldValue[currentSubPath] = {};
                     }
                     fieldValue = fieldValue[currentSubPath];
                 }
+                fieldValue = fieldValue[splitPath[splitPath.length - 1]];
                 field.setter(formValue, fieldValue);
             }
         });
@@ -7096,6 +7392,8 @@ class MngDropdownComponent {
         this.className = null;
         this.dropdownClassName = null;
         this.changeValueOnBlur = false;
+        this.loadingSubject = new ReplaySubject(1);
+        this.$loading = this.loadingSubject.asObservable();
         this.valueChangeEventEmitter = new EventEmitter();
         this.itemsSubject = new ReplaySubject(1);
         this.dataProviderService = null;
@@ -7105,6 +7403,7 @@ class MngDropdownComponent {
         this.onTouchedFn = () => { };
         this.dropdownFormControl = new FormControl();
         this.items$ = this.itemsSubject.asObservable();
+        this.loadingSubject.next(false);
     }
     ngOnInit() {
         this.itemsLabelProperty = this.itemsLabelPropertyInit;
@@ -7115,6 +7414,7 @@ class MngDropdownComponent {
             }
         });
         if (this.dataProvider) {
+            this.loadingSubject.next(true);
             this.dataProviderService = this.dataProvider.serviceType ? this.injector.get(this.dataProvider.serviceType) : null;
             const queryParamBuilder = MediusQueryParamBuilder.create();
             if (this.itemsLabelTranslate) {
@@ -7162,6 +7462,7 @@ class MngDropdownComponent {
             }))
                 .subscribe(res => {
                 this.itemsSubject.next(res);
+                this.loadingSubject.next(false);
             });
             if (this.selectFirstItem && !this.dropdownFormControl?.value) {
                 this.items$.pipe(first()).subscribe(res => {
@@ -7213,10 +7514,10 @@ class MngDropdownComponent {
     }
 }
 MngDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngDropdownComponent, deps: [{ token: i0.Injector }, { token: i1$2.TranslateService }, { token: MngFormlyFieldWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MngDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngDropdownComponent, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName", changeValueOnBlur: "changeValueOnBlur" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6$1.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngDropdownComponent, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName", changeValueOnBlur: "changeValueOnBlur" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    [dropdownIcon]=\"($loading | async) ?? false ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6$1.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-dropdown', providers: [MNG_DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n" }]
+            args: [{ selector: 'mng-dropdown', providers: [MNG_DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    [dropdownIcon]=\"($loading | async) ?? false ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1$2.TranslateService }, { type: MngFormlyFieldWrapperComponent, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { dataProvider: [{
@@ -7313,11 +7614,11 @@ class MngActionEditorComponent {
         this.setTitle();
         for (const action of this.action.editorActions) {
             if (action instanceof ActionEditorSubmitDescriptor) {
-                if (typeof action.icon === 'undefined') {
-                    action.withIcon(action.submitType === ActionEditorSubmitTypeEnum.Submit ? 'pi pi-check' : 'pi pi-times');
+                if (typeof action.buttonDescriptor.icon === 'undefined') {
+                    action.buttonDescriptor.withIcon(action.submitType === ActionEditorSubmitTypeEnum.Submit ? 'pi pi-check' : 'pi pi-times');
                 }
-                if (typeof action.title === 'undefined') {
-                    action.withTitle(action.submitType === ActionEditorSubmitTypeEnum.Submit ? 'general.save' : this.isDialog ? 'general.close' : 'general.cancel');
+                if (typeof action.buttonDescriptor.label === 'undefined') {
+                    action.buttonDescriptor.withLabel(action.submitType === ActionEditorSubmitTypeEnum.Submit ? 'general.save' : this.isDialog ? 'general.close' : 'general.cancel');
                 }
                 // assign run operations
                 action.withRunNotificationSuccess(undefined, undefined, false);
@@ -7484,6 +7785,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 args: [MngFormEditorComponent]
             }] } });
 
+class MngButtonComponent {
+    constructor() {
+        this.clickEmitter = new EventEmitter();
+        this.focusEmitter = new EventEmitter();
+        this.blurEmitter = new EventEmitter();
+        this.buttonClass = 'p-button';
+    }
+    ngOnInit() {
+        this.buttonClass = `${this.descriptor.styleClass.getButtonClass(this.descriptor.label == null)}`;
+    }
+    onClick(event) {
+        this.clickEmitter.next(event);
+        this.descriptor.onClick?.(event);
+    }
+    onFocus(event) {
+        this.focusEmitter.next(event);
+        this.descriptor.onFocus?.(event);
+    }
+    onBlur(event) {
+        this.blurEmitter.next(event);
+        this.descriptor.onBlur?.(event);
+    }
+}
+MngButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MngButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngButtonComponent, selector: "mng-button", inputs: { descriptor: "descriptor" }, outputs: { clickEmitter: "buttonClick", focusEmitter: "buttonFocus", blurEmitter: "buttonBlur" }, ngImport: i0, template: "<p-button\n    #button\n    type=\"button\"\n    [label]=\"$any(descriptor.label) | translate\"\n    [icon]=\"$any(descriptor.icon)\"\n    [iconPos]=\"$any(descriptor.iconPosition)\"\n    [loading]=\"$any(descriptor.loading)\"\n    [loadingIcon]=\"$any(descriptor.loadingIcon)\"\n    [disabled]=\"$any(descriptor.disabled)\"\n    [styleClass]=\"buttonClass\"\n    [pTooltip]=\"$any(descriptor.tooltip) | translate\"\n    [badge]=\"$any(descriptor.badge)\"\n    (onClick)=\"onClick($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onFocus)=\"onFocus($event)\"></p-button>\n", dependencies: [{ kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i4$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mng-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-button\n    #button\n    type=\"button\"\n    [label]=\"$any(descriptor.label) | translate\"\n    [icon]=\"$any(descriptor.icon)\"\n    [iconPos]=\"$any(descriptor.iconPosition)\"\n    [loading]=\"$any(descriptor.loading)\"\n    [loadingIcon]=\"$any(descriptor.loadingIcon)\"\n    [disabled]=\"$any(descriptor.disabled)\"\n    [styleClass]=\"buttonClass\"\n    [pTooltip]=\"$any(descriptor.tooltip) | translate\"\n    [badge]=\"$any(descriptor.badge)\"\n    (onClick)=\"onClick($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onFocus)=\"onFocus($event)\"></p-button>\n" }]
+        }], propDecorators: { descriptor: [{
+                type: Input
+            }], clickEmitter: [{
+                type: Output,
+                args: ['buttonClick']
+            }], focusEmitter: [{
+                type: Output,
+                args: ['buttonFocus']
+            }], blurEmitter: [{
+                type: Output,
+                args: ['buttonBlur']
+            }] } });
+
 class MngFormlyFieldAutocompleteComponent extends FieldType {
     constructor() {
         super(...arguments);
@@ -7721,10 +8063,10 @@ class MngTableColumnValueComponent {
     }
 }
 MngTableColumnValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnValueComponent, deps: [{ token: i0.ElementRef }, { token: i2.MessageService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-MngTableColumnValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n    <ng-container *ngSwitchCase=\"columnTypeString\">\n        {{ item | jsonPath: jsonPath }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeNumber\">\n        {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n        {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeDate\">\n        {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n        <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n        <ng-template #booleanText>\n            {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeEnum\">\n        {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCustom\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: item | jsonPath: jsonPath,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host:hover .help-buttons{display:block}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i6.Ripple, selector: "[pRipple]" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: JsonPathPipe, name: "jsonPath" }, { kind: "pipe", type: MngEnumPipe, name: "enum" }, { kind: "pipe", type: MngBooleanPipe, name: "boolean" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngTableColumnValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n    <ng-container *ngSwitchCase=\"columnTypeString\">\n        {{ item | jsonPath: jsonPath | getter: descriptor.getter | template: descriptor.template }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeNumber\">\n        {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n        {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeDate\">\n        {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n        <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n        <ng-template #booleanText>\n            {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeEnum\">\n        {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCustom\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: item | jsonPath: jsonPath,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host:hover .help-buttons{display:block}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i6.Ripple, selector: "[pRipple]" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: JsonPathPipe, name: "jsonPath" }, { kind: "pipe", type: MngEnumPipe, name: "enum" }, { kind: "pipe", type: MngBooleanPipe, name: "boolean" }, { kind: "pipe", type: MngGetterPipe, name: "getter" }, { kind: "pipe", type: MngTemplatePipe, name: "template" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnValueComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-table-column-value', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n    <ng-container *ngSwitchCase=\"columnTypeString\">\n        {{ item | jsonPath: jsonPath }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeNumber\">\n        {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n        {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeDate\">\n        {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n        <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n        <ng-template #booleanText>\n            {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeEnum\">\n        {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCustom\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: item | jsonPath: jsonPath,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host:hover .help-buttons{display:block}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"] }]
+            args: [{ selector: 'mng-table-column-value', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n    <ng-container *ngSwitchCase=\"columnTypeString\">\n        {{ item | jsonPath: jsonPath | getter: descriptor.getter | template: descriptor.template }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeNumber\">\n        {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n        {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeDate\">\n        {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n        <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n        <ng-template #booleanText>\n            {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeEnum\">\n        {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnTypeCustom\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: item | jsonPath: jsonPath,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host:hover .help-buttons{display:block}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.MessageService }, { type: i1$2.TranslateService }]; }, propDecorators: { descriptor: [{
                 type: Input
             }], item: [{
@@ -8396,13 +8738,14 @@ class AMngTableviewRouteComponent {
         this.actions = this.createActionDescriptors();
     }
     createActionDescriptors() {
-        const actions = [];
-        actions.push(this.createActionDescriptorForDetails());
-        actions.push(this.createActionDescriptorForAdd());
-        actions.push(this.createActionDescriptorForEdit());
-        actions.push(this.createActionDescriptorForDelete());
-        actions.push(this.createActionDescriptorForExport());
-        return actions;
+        return [
+            this.createActionDescriptorForDetails(),
+            this.createActionDescriptorForAdd(),
+            this.createActionDescriptorForEdit(),
+            this.createActionDescriptorForDelete(),
+            this.createActionDescriptorForRefresh(),
+            this.createActionDescriptorForExport()
+        ];
     }
     createActionDescriptorForDetails(descriptor = this.descriptor.viewEditor) {
         return new ActionEditorDetailsDescriptor(descriptor);
@@ -8417,7 +8760,7 @@ class AMngTableviewRouteComponent {
         return new ActionDeleteDescriptor(descriptor);
     }
     createActionDescriptorForExport(descriptor = this.descriptor.model) {
-        return new ActionDescriptor(descriptor, 'export')
+        const action = new ActionDescriptor(descriptor, 'export')
             .withRunFunction(ctx => {
             const queryParamBuilder = ctx.parameters.queryParam ? MediusQueryParamBuilder.createFromExisting(ctx.parameters.queryParam) : MediusQueryParamBuilder.create();
             queryParamBuilder.withItemsOffset(0).withItemsPerPage(1000);
@@ -8429,8 +8772,21 @@ class AMngTableviewRouteComponent {
                 return undefined;
             }));
         })
+            .withPosition(ActionPositionEnum.ToolbarRight);
+        action.buttonDescriptor.withIcon('pi pi-upload');
+        return action;
+    }
+    createActionDescriptorForRefresh(descriptor = this.descriptor.model) {
+        const action = new ActionDescriptor(descriptor, 'refresh')
             .withPosition(ActionPositionEnum.ToolbarRight)
-            .withIcon('pi pi-upload');
+            .withPermissionsRouteType(Permissions.ActionTypes.READ)
+            .withRunNotificationSuccess(undefined, undefined, false)
+            .withRunFunction(ctx => {
+            ctx.parameters.viewContainer.triggerTableReload({});
+            return of(null);
+        });
+        action.buttonDescriptor.withIcon('pi pi-refresh').styleClass.withActionLevel(ActionLevelEnum.Secondary);
+        return action;
     }
 }
 AMngTableviewRouteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AMngTableviewRouteComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -8675,20 +9031,18 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
         if (hasViewAction) {
             const viewAction = new ActionEditorDescriptor(this.descriptor.tableviewDescriptor.viewEditor, 'details', this.descriptor.editor.model.type, this.descriptor.property)
                 .withPosition(ActionPositionEnum.RowClick)
-                .withTitle(null)
                 .withDialogClassName('mng-field-dialog mng-action-editor-dialog')
                 .withDialogSize(ActionEditorDialogSizeEnum.Small);
             viewAction.withEditorActions([new ActionEditorSubmitDescriptor(viewAction, ActionEditorSubmitTypeEnum.Cancel)]);
+            viewAction.buttonDescriptor.withLabel(null);
             this.actions.push(viewAction);
         }
         if (hasAddAction) {
             const addAction = new ActionEditorDescriptor(this.descriptor.tableviewDescriptor.addEditor, 'add', this.descriptor.editor.model.type, this.descriptor.property)
                 .withPosition(ActionPositionEnum.ToolbarRight)
-                .withTitle(null)
-                .withIcon('pi pi-plus')
                 .withDialogClassName('mng-field-dialog mng-action-editor-dialog')
                 .withDialogSize(ActionEditorDialogSizeEnum.Small)
-                .withSize(ActionSizeEnum.ExtraSmall)
+                .withButtonDescriptor(new ButtonDescriptor().withStyleClass(new ButtonStyleBuilder().withSize(ActionSizeEnum.ExtraSmall)))
                 .withSubmitFunction(ctx => {
                 if (!ctx.parameters.item) {
                     return throwError(() => new Error(`No item was provided in context, edit cannot be done.`));
@@ -8701,16 +9055,15 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => of(!this.options?.formState.disabled))
                 .withIsEnabledFunction(() => this.isEnabled$);
+            addAction.buttonDescriptor.withLabel(null).withIcon('pi pi-plus');
             this.actions.push(addAction);
         }
         if (hasEditAction) {
             const editAction = new ActionEditorDescriptor(this.descriptor.tableviewDescriptor.editEditor, 'edit', this.descriptor.editor.model.type, this.descriptor.property)
                 .withPosition(ActionPositionEnum.RowInline)
-                .withTitle(null)
-                .withIcon('pi pi-pencil')
                 .withDialogClassName('mng-field-dialog mng-action-editor-dialog')
                 .withDialogSize(ActionEditorDialogSizeEnum.Small)
-                .withSize(ActionSizeEnum.ExtraSmall)
+                .withButtonDescriptor(new ButtonDescriptor().withStyleClass(new ButtonStyleBuilder().withSize(ActionSizeEnum.ExtraSmall)))
                 .withSubmitFunction(ctx => {
                 if (!ctx.parameters.item) {
                     return throwError(() => new Error(`No item was provided in context, edit cannot be done.`));
@@ -8723,15 +9076,13 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => of(!this.formControl?.disabled))
                 .withIsEnabledFunction(() => this.isEnabled$);
+            editAction.buttonDescriptor.withLabel(null).withIcon('pi pi-pencil');
             this.actions.push(editAction);
         }
         if (hasDeleteAction) {
             const deleteAction = new ActionDescriptor(this.descriptor.tableviewDescriptor.model, 'delete', this.descriptor.editor.model.type, this.descriptor.property)
                 .withPosition(ActionPositionEnum.RowInline)
-                .withLevel(ActionLevelEnum.Danger)
-                .withTitle(null)
-                .withIcon('pi pi-trash')
-                .withSize(ActionSizeEnum.ExtraSmall)
+                .withButtonDescriptor(new ButtonDescriptor().withStyleClass(new ButtonStyleBuilder(ActionLevelEnum.Danger).withSize(ActionSizeEnum.ExtraSmall)))
                 .withRunFunction(ctx => {
                 if (!ctx.parameters.item) {
                     return throwError(() => new Error(`No item was provided in context, delete cannot be done.`));
@@ -8756,6 +9107,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => of(!this.options?.formState.disabled))
                 .withIsEnabledFunction(() => this.isEnabled$);
+            deleteAction.buttonDescriptor.withLabel(null).withIcon('pi pi-trash');
             this.actions.push(deleteAction);
         }
         this.actions.push(...this.descriptor.actions);
@@ -9918,7 +10270,9 @@ const declarations = [
     MngEnumPipe,
     MngBooleanPipe,
     MngI18nPropertyPipe,
-    MngLinkFormatterPipe,
+    MngParametrizePipe,
+    MngGetterPipe,
+    MngTemplatePipe,
     // layout components
     MngBreadcrumbComponent,
     MngFooterComponent,
@@ -9953,7 +10307,9 @@ const declarations = [
     MngFormEditorComponent,
     MngActionComponent,
     MngActionEditorComponent,
-    MngActionRouteComponent
+    MngActionRouteComponent,
+    //button
+    MngButtonComponent
 ];
 class MngCommonsModule {
     static forRoot(config) {
@@ -9978,7 +10334,9 @@ class MngCommonsModule {
                 MngEnumPipe,
                 MngBooleanPipe,
                 MngI18nPropertyPipe,
-                MngLinkFormatterPipe,
+                MngParametrizePipe,
+                MngGetterPipe,
+                MngTemplatePipe,
                 // component service
                 MngMainLayoutComponentService,
                 MngViewContainerComponentService,
@@ -10035,7 +10393,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngEnumPipe,
         MngBooleanPipe,
         MngI18nPropertyPipe,
-        MngLinkFormatterPipe,
+        MngParametrizePipe,
+        MngGetterPipe,
+        MngTemplatePipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -10070,7 +10430,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngFormEditorComponent,
         MngActionComponent,
         MngActionEditorComponent,
-        MngActionRouteComponent], imports: [
+        MngActionRouteComponent,
+        //button
+        MngButtonComponent], imports: [
         // angular modules
         CommonModule,
         RouterModule,
@@ -10150,7 +10512,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngEnumPipe,
         MngBooleanPipe,
         MngI18nPropertyPipe,
-        MngLinkFormatterPipe,
+        MngParametrizePipe,
+        MngGetterPipe,
+        MngTemplatePipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -10185,7 +10549,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngFormEditorComponent,
         MngActionComponent,
         MngActionEditorComponent,
-        MngActionRouteComponent] });
+        MngActionRouteComponent,
+        //button
+        MngButtonComponent] });
 MngCommonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngCommonsModule, imports: [
         // angular modules
         CommonModule,
@@ -11001,5 +11367,5 @@ class TableviewRouteBuilder {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_EDITOR_DIALOG_COMPONENT_SETTING, AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngApiService, AMngBaseApiService, AMngCrudApiService, AMngGetAllApiService, AMngTableviewRouteComponent, APermissions, ActionActivationTriggerEnum, ActionContext, ActionContextValidation, ActionDataProviderUtil, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorDialogSizeEnum, ActionEditorEditDescriptor, ActionEditorSubmitDescriptor, ActionEditorSubmitTypeEnum, ActionError, ActionInstance, ActionInstanceStateEnum, ActionLevelEnum, ActionLinkDescriptor, ActionParameters, ActionPositionEnum, ActionSimpleDescriptor, ActionSizeEnum, ActionTypeEnum, AuthorizationTypeEnum, AuthorizationUtil, ButtonStyleBuilder, ColumnDescriptor, ColumnTypeEnum, DataProvider, DefaultMngErrorMapperService, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, EnumName, EnumUtil, FieldGroupDescriptor, FieldGroupTypeEnum, FieldInputDescriptor, FieldInputTypeEnum, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldManyEditorActionEnum, FieldManyEditorDescriptor, FieldManyEditorTypeEnum, FieldManyToManyEditorActionEnum, FieldManyToManyEditorDescriptor, FieldManyToManyEditorTypeEnum, FieldSizeEnum, FieldTabGroupDescriptor, FieldValidationDescriptor, FilterDescriptor, FilterLookupDescriptor, FilterLookupEnumDescriptor, FilterLookupTypeEnum, FilterMatchModeEnum, FilterTypeEnum, I18nUtils, JsonPathPipe, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_BROWSER_STORAGE_IT, MNG_COMMONS_INITIALIZER_IT, MNG_DROPDOWN_VALUE_ACCESSOR, MNG_MODULE_CONFIG_IT, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusRestUtil, MngActionComponent, MngActionEditorComponent, MngActionExecutorService, MngActionRouteComponent, MngAuthorizationGuard, MngAuthorizationService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDropdownComponent, MngEnumPipe, MngErrorMapperService, MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormFieldEvent, MngFormFieldEventComponentSubtype, MngFormFieldEventDialogSubtype, MngFormFieldEventTypeEnum, MngFormlyFieldAutocompleteComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldLabelComponent, MngFormlyFieldLookupDialogComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngFormlyTableWrapperComponent, MngI18nPropertyPipe, MngLinkFormatterPipe, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngTableCellClickEvent, MngTableColumnFilterComponent, MngTableColumnValueComponent, MngTableComponent, MngTableLoadEvent, MngTableReloadEvent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTopbarComponent, MngVersionComponent, MngViewContainerComponentService, ModelDescriptor, ModelUtil, NotificationUtil, ObjectSerializer, Permissions, RouteBuilder, RoutesBuilder, StringUtil, StylesUtil, TableDataProvider, TableDescriptor, TableFilterDisplayEnum, TablePaginationModeEnum, TableSizeEnum, TableviewDataProvider, TableviewDescriptor, TableviewRouteBuilder, TableviewTypeEnum, TypeName, TypeUtil, enumNameDecoratorPropertyName, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxLengthValidationMessage, getMinLengthValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngConfigJsonAppInitializerProvider, mngConfigurationServiceProvider, mngFormlyConfigProvider, primeNgModules, typeMapBase, typeNameDecoratorPropertyName };
+export { ACTION_EDITOR_DIALOG_COMPONENT_SETTING, AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngApiService, AMngBaseApiService, AMngCrudApiService, AMngGetAllApiService, AMngTableviewRouteComponent, APermissions, ActionActivationTriggerEnum, ActionConfirmationDialogDescriptor, ActionContext, ActionContextValidation, ActionDataProviderUtil, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorDialogSizeEnum, ActionEditorEditDescriptor, ActionEditorSubmitDescriptor, ActionEditorSubmitTypeEnum, ActionError, ActionInstance, ActionInstanceStateEnum, ActionLevelEnum, ActionLinkDescriptor, ActionParameters, ActionPositionEnum, ActionSimpleDescriptor, ActionSizeEnum, ActionTypeEnum, AuthorizationTypeEnum, AuthorizationUtil, ButtonDescriptor, ButtonStyleBuilder, ButtonStyleRoundedEnum, ColumnDescriptor, ColumnTypeEnum, DataProvider, DefaultMngErrorMapperService, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, EnumName, EnumUtil, FieldGroupDescriptor, FieldGroupTypeEnum, FieldInputDescriptor, FieldInputTypeEnum, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldManyEditorActionEnum, FieldManyEditorDescriptor, FieldManyEditorTypeEnum, FieldManyToManyEditorActionEnum, FieldManyToManyEditorDescriptor, FieldManyToManyEditorTypeEnum, FieldSizeEnum, FieldTabGroupDescriptor, FieldValidationDescriptor, FilterDescriptor, FilterLookupDescriptor, FilterLookupEnumDescriptor, FilterLookupTypeEnum, FilterMatchModeEnum, FilterTypeEnum, I18nUtils, JsonPathPipe, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_BROWSER_STORAGE_IT, MNG_COMMONS_INITIALIZER_IT, MNG_DROPDOWN_VALUE_ACCESSOR, MNG_MODULE_CONFIG_IT, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusRestUtil, MngActionComponent, MngActionEditorComponent, MngActionExecutorService, MngActionRouteComponent, MngAuthorizationGuard, MngAuthorizationService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngButtonComponent, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDropdownComponent, MngEnumPipe, MngErrorMapperService, MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormFieldEvent, MngFormFieldEventComponentSubtype, MngFormFieldEventDialogSubtype, MngFormFieldEventTypeEnum, MngFormlyFieldAutocompleteComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldLabelComponent, MngFormlyFieldLookupDialogComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngFormlyTableWrapperComponent, MngGetterPipe, MngI18nPropertyPipe, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngParametrizePipe, MngTableCellClickEvent, MngTableColumnFilterComponent, MngTableColumnValueComponent, MngTableComponent, MngTableLoadEvent, MngTableReloadEvent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTemplatePipe, MngTopbarComponent, MngVersionComponent, MngViewContainerComponentService, ModelDescriptor, ModelUtil, NotificationUtil, ObjectSerializer, Permissions, RouteBuilder, RoutesBuilder, StringUtil, StylesUtil, TableDataProvider, TableDescriptor, TableFilterDisplayEnum, TablePaginationModeEnum, TableSizeEnum, TableviewCrudDataProvider, TableviewDataProvider, TableviewDescriptor, TableviewRouteBuilder, TableviewTypeEnum, TypeName, TypeUtil, enumNameDecoratorPropertyName, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxLengthValidationMessage, getMinLengthValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngConfigJsonAppInitializerProvider, mngConfigurationServiceProvider, mngFormlyConfigProvider, primeNgModules, typeMapBase, typeNameDecoratorPropertyName };
 //# sourceMappingURL=mediusinc-mng-commons.mjs.map