@pega/angular-sdk-components 0.23.14 → 0.23.16

package/fesm2022/pega-angular-sdk-components.mjs

@@ -1215,6 +1215,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: ProgressSpinnerService }, { type: ErrorMessagesService }, { type: Utils }]; } });
 
+class BannerService {
+    constructor() {
+        this.banners = [];
+    }
+    clearBanners() {
+        this.banners = [];
+    }
+    updateBanners(itemKey) {
+        const localizedVal = PCore.getLocaleUtils().getLocaleValue;
+        let validationErrors = PCore.getMessageManager().getValidationErrorMessages(itemKey) || [];
+        // const completeProps = this.angularPConnect.getCurrentCompleteProps(this) as FlowContainerProps;
+        validationErrors = validationErrors.map(item => ({ message: typeof item === 'string' ? item : `${item.label}: ${item.description}` }));
+        // this.showPageMessages(completeProps);
+        if (validationErrors.length) {
+            this.banners = [{ messages: validationErrors?.map(msg => localizedVal(msg.message, 'Messages')), variant: 'urgent' }];
+        }
+        else {
+            this.banners = [];
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BannerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BannerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BannerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 /* eslint-disable no-case-declarations */
 function getRefreshProps(refreshConditions) {
     // refreshConditions cuurently supports only "Changes" event
@@ -1224,12 +1254,13 @@ function getRefreshProps(refreshConditions) {
     return refreshConditions.filter(item => item.event && item.event === 'Changes').map(item => [item.field, item.field?.substring(1)]) || [];
 }
 class AssignmentComponent {
-    constructor(angularPConnect, psService, erService, ngZone, snackBar) {
+    constructor(angularPConnect, psService, erService, ngZone, snackBar, bannerService) {
         this.angularPConnect = angularPConnect;
         this.psService = psService;
         this.erService = erService;
         this.ngZone = ngZone;
         this.snackBar = snackBar;
+        this.bannerService = bannerService;
         this.isInModal$ = false;
         // For interaction with AngularPConnect
         this.angularPConnectData = {};
@@ -1263,6 +1294,7 @@ class AssignmentComponent {
     checkAndUpdate() {
         // Should always check the bridge to see if the component should update itself (re-render)
         const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
+        this.bannerService.updateBanners(this.itemKey$);
         // ONLY call updateSelf when the component should update
         //    AND removing the "gate" that was put there since shouldComponentUpdate
         //      should be the real "gate"
@@ -1421,6 +1453,10 @@ class AssignmentComponent {
         this.buttonClick(oData.action, oData.buttonType);
     }
     buttonClick(sAction, sButtonType) {
+        this.snackBarRef?.dismiss();
+        this.bannerService.clearBanners();
+        // @ts-ignore
+        PCore.getPubSubUtils().publish('clearBannerMessages');
         // right now, done on an individual basis, setting bReInit to true
         // upon the next flow container state change, will cause the flow container
         // to re-initialize
@@ -1451,7 +1487,7 @@ class AssignmentComponent {
                         })
                             .catch(() => {
                             this.psService.sendMessage(false);
-                            this.snackBar.open(`${this.localizedVal('Navigation failed!', this.localeCategory)}`, 'Ok');
+                            this.snackBarRef = this.snackBar.open(`${this.localizedVal('Navigation failed!', this.localeCategory)}`, 'Ok');
                         });
                     }
                     break;
@@ -1468,7 +1504,7 @@ class AssignmentComponent {
                     })
                         .catch(() => {
                         this.psService.sendMessage(false);
-                        this.snackBar.open(`${this.localizedVal('Save failed', this.localeCategory)}`, 'Ok');
+                        this.snackBarRef = this.snackBar.open(`${this.localizedVal('Save failed', this.localeCategory)}`, 'Ok');
                     });
                     break;
                 }
@@ -1493,7 +1529,7 @@ class AssignmentComponent {
                         })
                             .catch(() => {
                             this.psService.sendMessage(false);
-                            this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
+                            this.snackBarRef = this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
                         });
                     }
                     else {
@@ -1511,7 +1547,7 @@ class AssignmentComponent {
                         })
                             .catch(() => {
                             this.psService.sendMessage(false);
-                            this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
+                            this.snackBarRef = this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
                         });
                     }
                     break;
@@ -1524,24 +1560,18 @@ class AssignmentComponent {
             switch (sAction) {
                 case 'finishAssignment':
                     this.erService.sendMessage('publish', '');
-                    if (this.formValid()) {
-                        this.bReInit = true;
-                        this.psService.sendMessage(true);
-                        const finishPromise = this.finishAssignment(this.itemKey$); // JA - was itemID but Nebula/Constellation uses itemKey
-                        finishPromise
-                            .then(() => {
-                            this.psService.sendMessage(false);
-                            this.updateChanges();
-                        })
-                            .catch(() => {
-                            this.psService.sendMessage(false);
-                            this.snackBar.open(`${this.localizedVal('Submit failed!', this.localeCategory)}`, 'Ok');
-                        });
-                    }
-                    else {
-                        // let snackBarRef = this.snackBar.open("Please fix errors on form.",  "Ok");
-                        this.erService.sendMessage('show', this.localizedVal('Please fix errors on form.', this.localeCategory));
-                    }
+                    this.bReInit = true;
+                    this.psService.sendMessage(true);
+                    const finishPromise = this.finishAssignment(this.itemKey$); // JA - was itemID but Nebula/Constellation uses itemKey
+                    finishPromise
+                        .then(() => {
+                        this.psService.sendMessage(false);
+                        this.updateChanges();
+                    })
+                        .catch(() => {
+                        this.psService.sendMessage(false);
+                        this.snackBarRef = this.snackBar.open(`${this.localizedVal('Submit failed!', this.localeCategory)}`, 'Ok');
+                    });
                     break;
                 default:
                     break;
@@ -1586,13 +1616,13 @@ class AssignmentComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AssignmentComponent, deps: [{ token: AngularPConnectService }, { token: ProgressSpinnerService }, { token: ErrorMessagesService }, { token: i0.NgZone }, { token: i4$1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AssignmentComponent, isStandalone: true, selector: "app-assignment", inputs: { pConn$: "pConn$", formGroup$: "formGroup$", arChildren$: "arChildren$", itemKey$: "itemKey$", isCreateStage$: "isCreateStage$", updateToken$: "updateToken$", isInModal$: "isInModal$", banners: "banners" }, usesOnChanges: true, ngImport: i0, template: "<div>\n  <div><component-mapper name=\"AlertBanner\" [props]=\"{ banners }\" [parent]=\"this\"></component-mapper></div>\n  <div *ngIf=\"bHasNavigation$\" class=\"psdk-stepper\">\n    <component-mapper\n      name=\"MultiStep\"\n      [props]=\"{\n        pConn$: newPConn$,\n        formGroup$,\n        arChildren$,\n        arMainButtons$,\n        arSecondaryButtons$,\n        bIsVertical$,\n        arCurrentStepIndicies$,\n        arNavigationSteps$\n      }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n  <div *ngIf=\"!bHasNavigation$\">\n    <component-mapper\n      name=\"AssignmentCard\"\n      [props]=\"{ pConn$: newPConn$, formGroup$, arChildren$, arMainButtons$, arSecondaryButtons$, updateToken$ }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(function () { return CommonModule; }) }, { kind: "directive", type: i0.forwardRef(function () { return i3.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: i0.forwardRef(function () { return MatSnackBarModule; }) }, { kind: "component", type: i0.forwardRef(function () { return ComponentMapperComponent; }), selector: "component-mapper", inputs: ["name", "props", "errorMsg", "outputEvents", "parent"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AssignmentComponent, deps: [{ token: AngularPConnectService }, { token: ProgressSpinnerService }, { token: ErrorMessagesService }, { token: i0.NgZone }, { token: i4$1.MatSnackBar }, { token: BannerService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AssignmentComponent, isStandalone: true, selector: "app-assignment", inputs: { pConn$: "pConn$", formGroup$: "formGroup$", arChildren$: "arChildren$", itemKey$: "itemKey$", isCreateStage$: "isCreateStage$", updateToken$: "updateToken$", isInModal$: "isInModal$" }, usesOnChanges: true, ngImport: i0, template: "<div>\n  <div><component-mapper name=\"AlertBanner\" [props]=\"{ banners: bannerService.banners }\" [parent]=\"this\"></component-mapper></div>\n  <div *ngIf=\"bHasNavigation$\" class=\"psdk-stepper\">\n    <component-mapper\n      name=\"MultiStep\"\n      [props]=\"{\n        pConn$: newPConn$,\n        formGroup$,\n        arChildren$,\n        arMainButtons$,\n        arSecondaryButtons$,\n        bIsVertical$,\n        arCurrentStepIndicies$,\n        arNavigationSteps$\n      }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n  <div *ngIf=\"!bHasNavigation$\">\n    <component-mapper\n      name=\"AssignmentCard\"\n      [props]=\"{ pConn$: newPConn$, formGroup$, arChildren$, arMainButtons$, arSecondaryButtons$, updateToken$ }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(function () { return CommonModule; }) }, { kind: "directive", type: i0.forwardRef(function () { return i3.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: i0.forwardRef(function () { return MatSnackBarModule; }) }, { kind: "component", type: i0.forwardRef(function () { return ComponentMapperComponent; }), selector: "component-mapper", inputs: ["name", "props", "errorMsg", "outputEvents", "parent"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AssignmentComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-assignment', standalone: true, imports: [CommonModule, MatSnackBarModule, forwardRef(() => ComponentMapperComponent)], template: "<div>\n  <div><component-mapper name=\"AlertBanner\" [props]=\"{ banners }\" [parent]=\"this\"></component-mapper></div>\n  <div *ngIf=\"bHasNavigation$\" class=\"psdk-stepper\">\n    <component-mapper\n      name=\"MultiStep\"\n      [props]=\"{\n        pConn$: newPConn$,\n        formGroup$,\n        arChildren$,\n        arMainButtons$,\n        arSecondaryButtons$,\n        bIsVertical$,\n        arCurrentStepIndicies$,\n        arNavigationSteps$\n      }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n  <div *ngIf=\"!bHasNavigation$\">\n    <component-mapper\n      name=\"AssignmentCard\"\n      [props]=\"{ pConn$: newPConn$, formGroup$, arChildren$, arMainButtons$, arSecondaryButtons$, updateToken$ }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: AngularPConnectService }, { type: ProgressSpinnerService }, { type: ErrorMessagesService }, { type: i0.NgZone }, { type: i4$1.MatSnackBar }]; }, propDecorators: { pConn$: [{
+            args: [{ selector: 'app-assignment', standalone: true, imports: [CommonModule, MatSnackBarModule, forwardRef(() => ComponentMapperComponent)], template: "<div>\n  <div><component-mapper name=\"AlertBanner\" [props]=\"{ banners: bannerService.banners }\" [parent]=\"this\"></component-mapper></div>\n  <div *ngIf=\"bHasNavigation$\" class=\"psdk-stepper\">\n    <component-mapper\n      name=\"MultiStep\"\n      [props]=\"{\n        pConn$: newPConn$,\n        formGroup$,\n        arChildren$,\n        arMainButtons$,\n        arSecondaryButtons$,\n        bIsVertical$,\n        arCurrentStepIndicies$,\n        arNavigationSteps$\n      }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n  <div *ngIf=\"!bHasNavigation$\">\n    <component-mapper\n      name=\"AssignmentCard\"\n      [props]=\"{ pConn$: newPConn$, formGroup$, arChildren$, arMainButtons$, arSecondaryButtons$, updateToken$ }\"\n      [parent]=\"this\"\n      [outputEvents]=\"{ actionButtonClick: onActionButtonClick }\"\n    ></component-mapper>\n  </div>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: AngularPConnectService }, { type: ProgressSpinnerService }, { type: ErrorMessagesService }, { type: i0.NgZone }, { type: i4$1.MatSnackBar }, { type: BannerService }]; }, propDecorators: { pConn$: [{
                 type: Input
             }], formGroup$: [{
                 type: Input
@@ -1606,8 +1636,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], isInModal$: [{
                 type: Input
-            }], banners: [{
-                type: Input
             }] } });
 
 /** This file contains various utility methods to generate filter components, regionLayout data, filter expressions, etc.  */
@@ -2133,6 +2161,9 @@ class FlowContainerComponent extends FlowContainerBaseComponent {
         PCore.getPubSubUtils().subscribe('cancelPressed', () => {
             this.handleCancelPressed();
         }, 'cancelPressed');
+        PCore.getPubSubUtils().subscribe('clearBannerMessages', () => {
+            this.banners = [];
+        }, 'CLEAR_BANNER_MESSAGES');
     }
     ngOnDestroy() {
         if (this.angularPConnectData.unsubscribeFn) {
@@ -2140,6 +2171,7 @@ class FlowContainerComponent extends FlowContainerBaseComponent {
         }
         PCore.getPubSubUtils().unsubscribe(PCore.getConstants().PUB_SUB_EVENTS.EVENT_CANCEL, 'cancelAssignment');
         PCore.getPubSubUtils().unsubscribe('cancelPressed', 'cancelPressed');
+        PCore.getPubSubUtils().unsubscribe('clearBannerMessages', 'CLEAR_BANNER_MESSAGES');
     }
     handleCancel() {
         // cancel happened, so ok to initialize the flow container
@@ -2158,13 +2190,14 @@ class FlowContainerComponent extends FlowContainerBaseComponent {
         const pConn = this.pConnectOfActiveContainerItem || this.pConn$;
         const caseViewModeFromProps = this.angularPConnect.getComponentProp(this, 'caseViewMode');
         const caseViewModeFromRedux = pConn.getValue('context_data.caseViewMode', '');
+        const completeProps = this.angularPConnect.getCurrentCompleteProps(this);
         // ONLY call updateSelf when the component should update
         //    AND removing the "gate" that was put there since shouldComponentUpdate
         //      should be the real "gate"
+        // eslint-disable-next-line sonarjs/no-collapsible-if
         if (bUpdateSelf || caseViewModeFromProps !== caseViewModeFromRedux) {
             // don't want to redraw the flow container when there are page messages, because
             // the redraw causes us to loose the errors on the elements
-            const completeProps = this.angularPConnect.getCurrentCompleteProps(this);
             if (!completeProps.pageMessages || completeProps.pageMessages.length == 0) {
                 // with a cancel, need to timeout so todo will update correctly
                 if (this.bHasCancel) {
@@ -2177,10 +2210,8 @@ class FlowContainerComponent extends FlowContainerBaseComponent {
                     this.updateSelf();
                 }
             }
-            else {
-                this.showPageMessages(completeProps);
-            }
         }
+        this.showPageMessages(completeProps);
     }
     showPageMessages(completeProps) {
         this.ngZone.run(() => {
@@ -5854,13 +5885,21 @@ class CurrencyComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = Number(event.target.value).toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
         // PConnect wants to use eventHandler for onBlur
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = Number(event.target.value).toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         let errMessage = '';
@@ -6739,12 +6778,16 @@ class DecimalComponent {
         this.componentReference = this.pConn$.getStateProps().value;
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
         let value = event?.target?.value;
         value = value.replace(/,/g, '');
         value = value !== '' ? Number(value) : value;
-        handleEvent(actionsApi, 'changeNblur', propName, value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, value);
+        }
     }
     getErrorMessage() {
         let errMessage = '';
@@ -7159,12 +7202,20 @@ class EmailComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         let errMessage = '';
@@ -7357,12 +7408,20 @@ class IntegerComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         // field control gets error message from here
@@ -7536,12 +7595,20 @@ class PercentageComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         // field control gets error message from here
@@ -7678,26 +7745,17 @@ class PhoneComponent {
             });
         }
     }
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    fieldOnBlur(event) { }
     fieldOnChange() {
         if (this.formGroup$.controls[this.controlName$].value) {
-            const actionsApi = this.pConn$?.getActionsApi();
-            const propName = (this.pConn$?.getStateProps()).value;
             const value = this.formGroup$.controls[this.controlName$].value;
-            const eventObj = {
-                target: {
-                    value
-                }
-            };
             this.afterBlur = true;
-            this.angularPConnectData.actions?.onChange(this, eventObj);
-            handleEvent(actionsApi, 'blur', propName, value);
+            const actionsApi = this.pConn$.getActionsApi();
+            const propName = this.pConn$.getStateProps().value;
+            handleEvent(actionsApi, 'changeNblur', propName, value);
         }
     }
-    fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
-    }
     getErrorMessage() {
         let errMessage = '';
         // look for validation messages for json, pre-defined or just an error pushed from workitem (400)
@@ -8051,9 +8109,13 @@ class TextAreaComponent {
         }
     }
     fieldOnChange(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         // field control gets error message from here
@@ -8382,12 +8444,20 @@ class TextInputComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         let errMessage = '';
@@ -8660,12 +8730,20 @@ class UrlComponent {
         }
     }
     fieldOnChange(event) {
-        this.angularPConnectData.actions?.onChange(this, event);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            this.angularPConnectData.actions?.onChange(this, event);
+        }
     }
     fieldOnBlur(event) {
-        const actionsApi = this.pConn$?.getActionsApi();
-        const propName = (this.pConn$?.getStateProps()).value;
-        handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        const oldVal = this.value$ ?? '';
+        const isValueChanged = event.target.value.toString() !== oldVal.toString();
+        if (isValueChanged) {
+            const actionsApi = this.pConn$?.getActionsApi();
+            const propName = (this.pConn$?.getStateProps()).value;
+            handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
+        }
     }
     getErrorMessage() {
         let errMessage = '';
@@ -18636,5 +18714,5 @@ const localSdkComponentMap = {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionButtonsComponent, AlertBannerComponent, AlertComponent, AngularPConnectService, AppAnnouncementComponent, AppShellComponent, AssignmentCardComponent, AssignmentComponent, AttachmentComponent, AutoCompleteComponent, CancelAlertComponent, CaseCreateStageComponent, CaseHistoryComponent, CaseService, CaseSummaryComponent, CaseViewComponent, CheckBoxComponent, ComponentMapperComponent, ConfirmationComponent, CurrencyComponent, DELETE_ICON, DashboardFilterComponent, DataReferenceComponent, DatapageService, DateComponent, DateTimeComponent, DecimalComponent, DefaultFormComponent, DeferLoadComponent, DetailsComponent, DetailsNarrowWideComponent, DetailsOneColumnComponent, DetailsSubTabsComponent, DetailsThreeColumnComponent, DetailsTwoColumnComponent, DetailsWideNarrowComponent, DropdownComponent, EmailComponent, ErrorBoundaryComponent, ErrorMessagesService, FeedContainerComponent, FieldGroupListComponent, FieldGroupTemplateComponent, FieldValueListComponent, FileUtilityComponent, FlowContainerBaseComponent, FlowContainerComponent, GetLoginStatusService, Group$1 as Group, HybridViewContainerComponent, IdleDetectionService, InlineDashboardComponent, InlineDashboardPageComponent, IntegerComponent, ListPageComponent, ListUtilityComponent, ListViewComponent, MaterialCaseSummaryComponent, MaterialDetailsComponent, MaterialDetailsFieldsComponent, MaterialSummaryItemComponent, MaterialSummaryListComponent, MaterialUtilityComponent, MaterialVerticalTabsComponent, ModalViewContainerComponent, MultiReferenceReadonlyComponent, MultiStepComponent, NarrowWideFormComponent, NavbarComponent, OAuthResponseService, OneColumnComponent, OneColumnPageComponent, OneColumnTabComponent, OperatorComponent, PageComponent, PercentageComponent, PhoneComponent, PreviewViewContainerComponent, ProgressSpinnerService, PromotedFiltersComponent, PulseComponent, RadioButtonsComponent, ReferenceComponent, RegionComponent, RepeatingStructuresComponent, ResetPConnectService, RichTextComponent, RichTextEditorComponent, RootContainerComponent, SdkComponentMap, SemanticLinkComponent, ServerConfigService, SimpleTableComponent, SimpleTableManualComponent, SimpleTableSelectComponent, SingleReferenceReadonlyComponent, StagesComponent, SubTabsComponent, TABLE_CELL, TemplateUtils, TextAreaComponent, TextComponent, TextContentComponent, TextInputComponent, ThousandSeparatorDirective, ThreeColumnComponent, ThreeColumnPageComponent, TimeComponent, TodoComponent, TwoColumnComponent, TwoColumnPageComponent, TwoColumnTabComponent, UpdateWorklistService, UrlComponent, UserReferenceComponent, UtilityComponent, Utils, ViewComponent, ViewContainerComponent, WideNarrowFormComponent, WideNarrowPageComponent, buildFieldsForTable, buildFilterComponents, buildMetaForListView, buildView, combineFilters, compareSdkPCoreVersions, createFilter, createFilterComponent, createMetaForTable, createPConnect, currencyMap, dateFormatInfoDefault, deleteInstruction, endpoints, filterDataByCommonFields, filterDataByDate, filterForFieldValueList, format, formatters, getAddRowCallback, getAllFields, getApiContext, getBanners, getComponentFromMap, getContext, getCurrencyCharacters, getCurrencyOptions, getCurrentTimezone$1 as getCurrentTimezone, getDateFormatInfo, getDeferFriendlyTabs, getFilterExpression, getFormattedDate, getLocale$1 as getLocale, getMessagesGrouped, getReferenceList, getSdkComponentMap, getSeconds, getToDoAssignments, getTransientTabs, getVisibleTabs, handleEvent, hasAssignments, insertInstruction, loginBoxType, populateRowKey, sdkVersion, showBanner, tabClick, updateNewInstructions };
+export { ActionButtonsComponent, AlertBannerComponent, AlertComponent, AngularPConnectService, AppAnnouncementComponent, AppShellComponent, AssignmentCardComponent, AssignmentComponent, AttachmentComponent, AutoCompleteComponent, BannerService, CancelAlertComponent, CaseCreateStageComponent, CaseHistoryComponent, CaseService, CaseSummaryComponent, CaseViewComponent, CheckBoxComponent, ComponentMapperComponent, ConfirmationComponent, CurrencyComponent, DELETE_ICON, DashboardFilterComponent, DataReferenceComponent, DatapageService, DateComponent, DateTimeComponent, DecimalComponent, DefaultFormComponent, DeferLoadComponent, DetailsComponent, DetailsNarrowWideComponent, DetailsOneColumnComponent, DetailsSubTabsComponent, DetailsThreeColumnComponent, DetailsTwoColumnComponent, DetailsWideNarrowComponent, DropdownComponent, EmailComponent, ErrorBoundaryComponent, ErrorMessagesService, FeedContainerComponent, FieldGroupListComponent, FieldGroupTemplateComponent, FieldValueListComponent, FileUtilityComponent, FlowContainerBaseComponent, FlowContainerComponent, GetLoginStatusService, Group$1 as Group, HybridViewContainerComponent, IdleDetectionService, InlineDashboardComponent, InlineDashboardPageComponent, IntegerComponent, ListPageComponent, ListUtilityComponent, ListViewComponent, MaterialCaseSummaryComponent, MaterialDetailsComponent, MaterialDetailsFieldsComponent, MaterialSummaryItemComponent, MaterialSummaryListComponent, MaterialUtilityComponent, MaterialVerticalTabsComponent, ModalViewContainerComponent, MultiReferenceReadonlyComponent, MultiStepComponent, NarrowWideFormComponent, NavbarComponent, OAuthResponseService, OneColumnComponent, OneColumnPageComponent, OneColumnTabComponent, OperatorComponent, PageComponent, PercentageComponent, PhoneComponent, PreviewViewContainerComponent, ProgressSpinnerService, PromotedFiltersComponent, PulseComponent, RadioButtonsComponent, ReferenceComponent, RegionComponent, RepeatingStructuresComponent, ResetPConnectService, RichTextComponent, RichTextEditorComponent, RootContainerComponent, SdkComponentMap, SemanticLinkComponent, ServerConfigService, SimpleTableComponent, SimpleTableManualComponent, SimpleTableSelectComponent, SingleReferenceReadonlyComponent, StagesComponent, SubTabsComponent, TABLE_CELL, TemplateUtils, TextAreaComponent, TextComponent, TextContentComponent, TextInputComponent, ThousandSeparatorDirective, ThreeColumnComponent, ThreeColumnPageComponent, TimeComponent, TodoComponent, TwoColumnComponent, TwoColumnPageComponent, TwoColumnTabComponent, UpdateWorklistService, UrlComponent, UserReferenceComponent, UtilityComponent, Utils, ViewComponent, ViewContainerComponent, WideNarrowFormComponent, WideNarrowPageComponent, buildFieldsForTable, buildFilterComponents, buildMetaForListView, buildView, combineFilters, compareSdkPCoreVersions, createFilter, createFilterComponent, createMetaForTable, createPConnect, currencyMap, dateFormatInfoDefault, deleteInstruction, endpoints, filterDataByCommonFields, filterDataByDate, filterForFieldValueList, format, formatters, getAddRowCallback, getAllFields, getApiContext, getBanners, getComponentFromMap, getContext, getCurrencyCharacters, getCurrencyOptions, getCurrentTimezone$1 as getCurrentTimezone, getDateFormatInfo, getDeferFriendlyTabs, getFilterExpression, getFormattedDate, getLocale$1 as getLocale, getMessagesGrouped, getReferenceList, getSdkComponentMap, getSeconds, getToDoAssignments, getTransientTabs, getVisibleTabs, handleEvent, hasAssignments, insertInstruction, loginBoxType, populateRowKey, sdkVersion, showBanner, tabClick, updateNewInstructions };
 //# sourceMappingURL=pega-angular-sdk-components.mjs.map