@mediusinc/mng-commons 0.12.5 → 0.13.0

package/fesm2015/mediusinc-mng-commons.mjs

@@ -871,7 +871,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:
@@ -895,17 +895,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) {
@@ -917,37 +918,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 !== null && actionLevel !== void 0 ? actionLevel : this._actionLevel;
         this._size = size !== null && size !== void 0 ? size : this._size;
         this._textButton = textButton !== null && textButton !== void 0 ? textButton : this._textButton;
         this._outlineButton = outlineButton !== null && outlineButton !== void 0 ? outlineButton : this._outlineButton;
         this._raisedButton = raisedButton !== null && raisedButton !== void 0 ? raisedButton : this._raisedButton;
+        this._roundedStyle = roundedButton !== null && roundedButton !== void 0 ? 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;
@@ -974,15 +1016,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() {
@@ -1000,10 +1042,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) {
@@ -1012,10 +1167,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)) {
@@ -1064,15 +1219,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;
     }
@@ -1097,83 +1243,14 @@ class ActionDescriptor {
     get actionNameLong() {
         return this._actionNameLong;
     }
-    get buttonStyle() {
-        return this._buttonStyle;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
     get className() {
-        return this._buttonStyle.customClass;
+        return this.buttonDescriptor.styleClass.customClass;
     }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isStyleText() {
-        return this._buttonStyle.textButton;
-    }
-    /**
-     * @deprecated use _buttonStyle instead
-     */
-    get isStyleOutlined() {
-        return this._buttonStyle.outlineButton;
-    }
-    /**
-     * @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;
@@ -1205,6 +1282,9 @@ class ActionDescriptor {
     get permissionsRouteType() {
         return this._permissionsRouteType;
     }
+    get buttonDescriptor() {
+        return this._buttonDescriptor;
+    }
     withDataProvider(dataProvider) {
         this._dataProvider = dataProvider;
         return this;
@@ -1233,70 +1313,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) {
@@ -1330,6 +1365,10 @@ class ActionDescriptor {
         this._permissionsRouteType = permissionsRouteType;
         return this;
     }
+    withButtonDescriptor(buttonDescriptor) {
+        this._buttonDescriptor = buttonDescriptor;
+        return this;
+    }
 }
 class ActionSimpleDescriptor extends ActionDescriptor {
     constructor(actionName, modelType, idProperty, titleProperty) {
@@ -1346,7 +1385,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;
@@ -1453,7 +1492,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;
@@ -1487,8 +1542,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) {
@@ -1511,12 +1566,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);
@@ -1538,12 +1592,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);
@@ -2001,6 +2054,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;
@@ -2136,6 +2195,14 @@ class ColumnDescriptor {
         this._hasCopyToClipboard = hasCopyToCliboard;
         return this;
     }
+    withTemplate(template) {
+        this._template = template;
+        return this;
+    }
+    withGetter(getter) {
+        this._getter = getter;
+        return this;
+    }
     copy() {
         var _a;
         const descriptor = new ColumnDescriptor(this._table, this._property);
@@ -2163,6 +2230,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;
     }
 }
@@ -3546,6 +3615,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 = [];
@@ -5379,6 +5558,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 }]
         }] });
 
+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, parametrize, defaultEditorDialogComponent) {
         this.injector = injector;
@@ -5634,7 +5852,7 @@ class MngActionExecutorService {
      * @return Action context for run function.
      */
     runAction(action, parameters, dataProvider, instance, previousActionInstance) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         if (!instance) {
             // create new instance if non provided
             instance = new ActionInstance(action, ActionInstanceStateEnum.ActivationEnd, this.debug);
@@ -5642,33 +5860,44 @@ class MngActionExecutorService {
         const context = this.prepareActionContext(instance, parameters, dataProvider, previousActionInstance);
         if (action.hasRunConfirmation) {
             const sourceComponent = parameters === null || parameters === void 0 ? void 0 : parameters.sourceComponent;
+            const confirmationDescriptor = action.runConfirmationDialogDescriptor;
             if (typeof (sourceComponent === null || sourceComponent === void 0 ? void 0 : sourceComponent.getConfirmationService) !== 'function' || typeof (sourceComponent === null || sourceComponent === void 0 ? void 0 : 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: (_a = confirmationDescriptor.acceptIcon) !== null && _a !== void 0 ? _a : undefined,
+                acceptButtonStyleClass: confirmationDescriptor.acceptButtonStyle.getButtonClass(),
+                rejectVisible: true,
+                rejectIcon: (_b = confirmationDescriptor.rejectIcon) !== null && _b !== void 0 ? _b : undefined,
+                rejectButtonStyleClass: confirmationDescriptor.rejectButtonStyle.getButtonClass(),
+                closeOnEscape: confirmationDescriptor.closeOnEscape
             };
-            const item = parameters.item;
-            if (action.runConfirmationTitle !== null) {
-                confirmParams.header = (_a = I18nUtils.Action.get(this.translate, action, 'confirm.title', action.runConfirmationTitle, item, 'general.confirmation')) !== null && _a !== void 0 ? _a : undefined;
+            if (confirmationDescriptor.title !== null) {
+                confirmParams.header = (_c = I18nUtils.Action.get(this.translate, action, 'confirm.title', confirmationDescriptor.title, item, 'general.confirmation')) !== null && _c !== void 0 ? _c : undefined;
             }
-            if (action.runConfirmationMessage !== null) {
+            if (confirmationDescriptor.message !== null) {
                 confirmParams.message =
-                    (_b = I18nUtils.Action.get(this.translate, action, 'confirm.message', action.runConfirmationMessage, StringUtil.escapeHtmlAny(item), 'general.confirmation')) !== null && _b !== void 0 ? _b : undefined;
+                    (_d = I18nUtils.Action.get(this.translate, action, 'confirm.message', confirmationDescriptor.message, StringUtil.escapeHtmlAny(item), 'general.confirmation')) !== null && _d !== void 0 ? _d : undefined;
+            }
+            if (confirmationDescriptor.acceptLabel !== null) {
+                confirmParams.acceptLabel = (_e = I18nUtils.Action.get(this.translate, action, 'confirm.accept', confirmationDescriptor.acceptLabel, item, 'general.yes')) !== null && _e !== void 0 ? _e : undefined;
             }
-            if (action.runConfirmationIcon !== null) {
-                confirmParams.icon = action.runConfirmationIcon === undefined ? 'pi pi-exclamation-triangle' : action.runConfirmationIcon;
+            if (confirmationDescriptor.acceptIcon !== null) {
+                confirmParams.acceptIcon = confirmationDescriptor.acceptIcon;
             }
-            if (action.runConfirmationAcceptTitle !== null) {
-                confirmParams.acceptLabel = (_c = I18nUtils.Action.get(this.translate, action, 'confirm.accept', action.runConfirmationAcceptTitle, item, 'general.yes')) !== null && _c !== void 0 ? _c : undefined;
-                confirmParams.acceptVisible = true;
+            if (confirmationDescriptor.rejectIcon !== null) {
+                confirmParams.rejectIcon = confirmationDescriptor.rejectIcon;
             }
-            if (action.runConfirmationRejectTitle !== null) {
-                confirmParams.rejectLabel = (_d = I18nUtils.Action.get(this.translate, action, 'confirm.reject', action.runConfirmationRejectTitle, item, 'general.no')) !== null && _d !== void 0 ? _d : undefined;
-                confirmParams.rejectVisible = true;
+            if (confirmationDescriptor.rejectLabel !== null) {
+                confirmParams.rejectLabel = (_f = I18nUtils.Action.get(this.translate, action, 'confirm.reject', confirmationDescriptor.rejectLabel, item, 'general.no')) !== null && _f !== void 0 ? _f : undefined;
+            }
+            if (confirmationDescriptor.rejectLabel === null && confirmationDescriptor.rejectIcon === null) {
+                confirmParams.rejectVisible = false;
             }
             confirmParams.accept = () => {
                 instance.state = ActionInstanceStateEnum.RunConfirmationEndAccept;
@@ -5678,8 +5907,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;
@@ -5836,7 +6065,7 @@ class MngActionExecutorService {
             if (actionUrl.startsWith('/')) {
                 actionUrl = actionUrl.substring(1);
             }
-            const actionUrlSegments = this.parametrize.transform(actionUrl, parameters.itemId, parameters.item, 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;
         }
@@ -6380,7 +6609,7 @@ class MngActionComponent {
     ngOnInit() {
         var _a, _b;
         this.viewContainer = (_b = (_a = this.viewContainerInit) !== null && _a !== void 0 ? _a : this.viewContainerService) !== null && _b !== void 0 ? _b : 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);
@@ -6403,7 +6632,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) {
         var _a, _b, _c, _d, _e, _f;
@@ -6454,7 +6683,7 @@ class MngActionComponent {
         return `${action.actionName}_${this.cmpId}`;
     }
     processSubscriptions() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const parameters = new ActionParameters(this.itemId, this.item)
             .withActionData(this.actionData)
             .withViewContainer((_a = this.viewContainer) !== null && _a !== void 0 ? _a : undefined)
@@ -6483,21 +6712,21 @@ class MngActionComponent {
         }
         if (!this.hasNoTitle) {
             (_f = this.labelSubscription) === null || _f === void 0 ? void 0 : _f.unsubscribe();
-            this.labelSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'title', (_h = (_g = this.action) === null || _g === void 0 ? void 0 : _g.title) !== null && _h !== void 0 ? _h : undefined, this.item).subscribe({
+            this.labelSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'title', (_g = this.action.buttonDescriptor.label) !== null && _g !== void 0 ? _g : undefined, this.item).subscribe({
                 next: i18n => this.labelSubject.next(i18n)
             });
         }
-        (_j = this.tooltipSubscription) === null || _j === void 0 ? void 0 : _j.unsubscribe();
-        this.tooltipSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'tooltip', (_l = (_k = this.action) === null || _k === void 0 ? void 0 : _k.tooltip) !== null && _l !== void 0 ? _l : undefined, this.item).subscribe({
+        (_h = this.tooltipSubscription) === null || _h === void 0 ? void 0 : _h.unsubscribe();
+        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 | 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.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.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: MngParametrizePipe, name: "parametrize" }], 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 | 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.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.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
@@ -6787,13 +7016,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);
             }
         });
@@ -7466,11 +7696,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);
@@ -7640,6 +7870,50 @@ 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) {
+        var _a, _b;
+        this.clickEmitter.next(event);
+        (_b = (_a = this.descriptor).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
+    }
+    onFocus(event) {
+        var _a, _b;
+        this.focusEmitter.next(event);
+        (_b = (_a = this.descriptor).onFocus) === null || _b === void 0 ? void 0 : _b.call(_a, event);
+    }
+    onBlur(event) {
+        var _a, _b;
+        this.blurEmitter.next(event);
+        (_b = (_a = this.descriptor).onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, 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);
@@ -7885,10 +8159,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: [{
@@ -8574,13 +8848,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);
@@ -8595,7 +8870,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);
@@ -8608,8 +8883,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 });
@@ -8863,20 +9151,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.`));
@@ -8889,16 +9175,15 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => { var _a; return of(!((_a = this.options) === null || _a === void 0 ? void 0 : _a.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 => {
                 var _a;
                 if (!ctx.parameters.item) {
@@ -8912,15 +9197,13 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => { var _a; return of(!((_a = this.formControl) === null || _a === void 0 ? void 0 : _a.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 => {
                 var _a;
                 if (!ctx.parameters.item) {
@@ -8946,6 +9229,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withIsVisibleFunction(() => { var _a; return of(!((_a = this.options) === null || _a === void 0 ? void 0 : _a.formState.disabled)); })
                 .withIsEnabledFunction(() => this.isEnabled$);
+            deleteAction.buttonDescriptor.withLabel(null).withIcon('pi pi-trash');
             this.actions.push(deleteAction);
         }
         this.actions.push(...this.descriptor.actions);
@@ -10126,6 +10410,8 @@ const declarations = [
     MngBooleanPipe,
     MngI18nPropertyPipe,
     MngParametrizePipe,
+    MngGetterPipe,
+    MngTemplatePipe,
     // layout components
     MngBreadcrumbComponent,
     MngFooterComponent,
@@ -10160,7 +10446,9 @@ const declarations = [
     MngFormEditorComponent,
     MngActionComponent,
     MngActionEditorComponent,
-    MngActionRouteComponent
+    MngActionRouteComponent,
+    //button
+    MngButtonComponent
 ];
 class MngCommonsModule {
     static forRoot(config) {
@@ -10186,6 +10474,8 @@ class MngCommonsModule {
                 MngBooleanPipe,
                 MngI18nPropertyPipe,
                 MngParametrizePipe,
+                MngGetterPipe,
+                MngTemplatePipe,
                 // component service
                 MngMainLayoutComponentService,
                 MngViewContainerComponentService,
@@ -10243,6 +10533,8 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngBooleanPipe,
         MngI18nPropertyPipe,
         MngParametrizePipe,
+        MngGetterPipe,
+        MngTemplatePipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -10277,7 +10569,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngFormEditorComponent,
         MngActionComponent,
         MngActionEditorComponent,
-        MngActionRouteComponent
+        MngActionRouteComponent,
+        //button
+        MngButtonComponent
     ], imports: [
         // angular modules
         CommonModule,
@@ -10360,6 +10654,8 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         MngBooleanPipe,
         MngI18nPropertyPipe,
         MngParametrizePipe,
+        MngGetterPipe,
+        MngTemplatePipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -10394,7 +10690,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,
@@ -11211,5 +11509,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, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngParametrizePipe, 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, TableviewCrudDataProvider, 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