@pega/angular-sdk-overrides 0.24.3 → 0.24.4

package/lib/field/currency/currency.component.html

@@ -2,23 +2,32 @@
   <component-mapper *ngIf="bVisible$ !== false" name="FieldValueList" [props]="{ label$, value$, displayMode$ }"></component-mapper>
 </div>
 <ng-template #noDisplayMode>
-  <div *ngIf="!bReadonly$ && bHasForm$; else noEdit">
+  <div *ngIf="bHasForm$; else noEdit">
     <div [formGroup]="formGroup$" *ngIf="bVisible$" class="psdk-currency-field">
       <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
         <mat-label>{{ label$ }}</mat-label>
         <div class="psdk-currency-input">
           <input
-            style="margin-left: 5px"
+            style="margin-left: 5px; margin-top: -1rem"
             type="text"
             matInput
             currencyMask
-            [options]="{ prefix: currSym, thousands: currSep, decimal: currDec, align: 'left', nullable: true }"
+            [options]="{
+              prefix: currSym,
+              thousands: currSep,
+              decimal: currDec,
+              align: 'left',
+              nullable: true,
+              precision: decimalPrecision,
+              inputMode: inputMode
+            }"
             [placeholder]="placeholder"
             [formControlName]="controlName$"
             [required]="bRequired$"
             [formControl]="fieldControl"
             [attr.data-test-id]="testId"
             (blur)="fieldOnBlur($event)"
+            [readonly]="bReadonly$"
           />
         </div>
         <mat-error *ngIf="fieldControl.invalid">{{ getErrorMessage() }}</mat-error>

package/lib/field/currency/currency.component.ts

@@ -4,7 +4,7 @@ import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import { MatInputModule } from '@angular/material/input';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { interval } from 'rxjs';
-import { NgxCurrencyDirective } from 'ngx-currency';
+import { NgxCurrencyDirective, NgxCurrencyInputMode } from 'ngx-currency';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
@@ -15,6 +15,7 @@ import { PConnFieldProps } from '@pega/angular-sdk-components';
 interface CurrrencyProps extends PConnFieldProps {
   // If any, enter additional props that only exist on Currency here
   currencyISOCode?: string;
+  allowDecimals: boolean;
 }
 
 @Component({
@@ -52,6 +53,8 @@ export class CurrencyComponent implements OnInit, OnDestroy {
   currSym: string;
   currSep: string;
   currDec: string;
+  inputMode: any;
+  decimalPrecision: number | undefined;
 
   constructor(
     private angularPConnect: AngularPConnectService,
@@ -116,6 +119,7 @@ export class CurrencyComponent implements OnInit, OnDestroy {
     this.testId = this.configProps$.testId;
     this.label$ = this.configProps$.label;
     this.displayMode$ = this.configProps$.displayMode;
+    this.inputMode = NgxCurrencyInputMode.Natural;
     let nValue: any = this.configProps$.value;
     if (nValue) {
       if (typeof nValue === 'string') {
@@ -163,6 +167,8 @@ export class CurrencyComponent implements OnInit, OnDestroy {
       this.currencyISOCode = this.configProps$.currencyISOCode;
     }
 
+    this.decimalPrecision = this.configProps$?.allowDecimals ? 2 : 0;
+
     this.componentReference = (this.pConn$.getStateProps() as any).value;
 
     // trigger display of error message with field control

package/lib/field/decimal/decimal.component.html

@@ -16,6 +16,7 @@
             decimal: currDec,
             align: 'left',
             nullable: true,
+            precision: decimalPrecision,
             inputMode: inputMode
           }"
           [placeholder]="placeholder"

package/lib/field/decimal/decimal.component.ts

@@ -187,6 +187,7 @@ export class DecimalComponent implements OnInit, OnDestroy {
     } else {
       this.currSym = '';
     }
+    this.decimalPrecision = this.configProps$?.decimalPrecision ?? 2;
 
     this.componentReference = (this.pConn$.getStateProps() as any).value;
   }

package/lib/field/percentage/percentage.component.html

@@ -2,7 +2,7 @@
   <component-mapper *ngIf="bVisible$ !== false" name="FieldValueList" [props]="{ label$, value$, displayMode$ }"></component-mapper>
 </div>
 <ng-template #noDisplayMode>
-  <div *ngIf="!bReadonly$ && bHasForm$; else noEdit">
+  <div *ngIf="bHasForm$; else noEdit">
     <div [formGroup]="formGroup$" *ngIf="bVisible$">
       <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
         <mat-label>{{ label$ }}</mat-label>
@@ -10,7 +10,16 @@
           type="text"
           matInput
           currencyMask
-          [options]="{ prefix: '', suffix: '%', thousands: currSep, decimal: currDec, align: 'left', nullable: true }"
+          [options]="{
+            prefix: '',
+            suffix: '%',
+            thousands: currSep,
+            decimal: currDec,
+            align: 'left',
+            nullable: true,
+            precision: decimalPrecision,
+            inputMode: inputMode
+          }"
           [placeholder]="placeholder"
           step=".01"
           [formControlName]="controlName$"
@@ -19,6 +28,7 @@
           [attr.data-test-id]="testId"
           (change)="fieldOnChange($event)"
           (blur)="fieldOnBlur($event)"
+          [readonly]="bReadonly$"
         />
         <mat-error *ngIf="fieldControl.invalid">{{ getErrorMessage() }}</mat-error>
       </mat-form-field>

package/lib/field/percentage/percentage.component.ts

@@ -4,7 +4,7 @@ import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import { MatInputModule } from '@angular/material/input';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { interval } from 'rxjs';
-import { NgxCurrencyDirective } from 'ngx-currency';
+import { NgxCurrencyDirective, NgxCurrencyInputMode } from 'ngx-currency';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
@@ -48,6 +48,8 @@ export class PercentageComponent implements OnInit, OnDestroy {
   placeholder: string;
   currDec: string;
   currSep: string;
+  inputMode: any;
+  decimalPrecision: number | undefined;
   fieldControl = new FormControl<number | null>(null, null);
 
   constructor(
@@ -110,6 +112,7 @@ export class PercentageComponent implements OnInit, OnDestroy {
     this.testId = this.configProps$.testId;
     this.label$ = this.configProps$.label;
     this.displayMode$ = this.configProps$.displayMode;
+    this.inputMode = NgxCurrencyInputMode.Natural;
     let nValue: any = this.configProps$.value;
     if (nValue) {
       if (typeof nValue === 'string') {
@@ -152,6 +155,8 @@ export class PercentageComponent implements OnInit, OnDestroy {
       this.bReadonly$ = this.utils.getBooleanValue(this.configProps$.readOnly);
     }
 
+    this.decimalPrecision = this.configProps$?.decimalPrecision ?? 2;
+
     this.componentReference = (this.pConn$.getStateProps() as any).value;
 
     // trigger display of error message with field control

package/lib/infra/Containers/flow-container/flow-container.component.html

@@ -17,7 +17,8 @@
           headerText$: todo_headerText$,
           type$: 'TODO',
           context$: todo_context$,
-          itemKey$: itemKey$
+          itemKey$: itemKey$,
+          isConfirm: true
         }"
       ></component-mapper>
     </div>

package/lib/widget/todo/todo.component.html

@@ -26,7 +26,7 @@
             </div>
           </div>
         </div>
-        <div class="psdk-todo-assignment-action">
+        <div class="psdk-todo-assignment-action" *ngIf="!isConfirm || canPerform">
           <button mat-flat-button color="primary" (click)="clickGo(assignment)">{{ localizedVal('Go', localeCategory) }}</button>
         </div>
       </div>

package/lib/widget/todo/todo.component.ts

@@ -48,6 +48,7 @@ export class TodoComponent implements OnInit, OnDestroy, OnChanges {
   localeCategory = 'Todo';
   showlessLocalizedValue = this.localizedVal('show_less', 'CosmosFields');
   showMoreLocalizedValue = this.localizedVal('show_more', 'CosmosFields');
+  canPerform: boolean;
 
   constructor(
     private psService: ProgressSpinnerService,
@@ -149,6 +150,8 @@ export class TodoComponent implements OnInit, OnDestroy, OnChanges {
       }
     }
 
+    this.canPerform = this.arAssignments$?.[0]?.canPerform === 'true' || this.arAssignments$?.[0]?.canPerform === true;
+
     this.currentUser$ = PCore.getEnvironmentInfo().getOperatorName();
     this.currentUserInitials$ = this.utils.getInitials(this.currentUser$);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/angular-sdk-overrides",
-  "version": "0.24.3",
+  "version": "0.24.4",
   "description": "Angular SDK - Code for overriding components",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"