@pega/angular-sdk-overrides 0.25.11 → 0.25.13

package/lib/field/phone/phone.component.html

@@ -4,7 +4,7 @@
 <ng-template #noDisplayMode>
   <div *ngIf="bHasForm$ && bVisible$; else noEdit">
     <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText" floatLabel="always">
-      <ngx-mat-input-tel
+      <mat-tel-input
         [attr.data-test-id]="testId"
         [formControl]="fieldControl"
         [preferredCountries]="preferredCountries"
@@ -16,7 +16,7 @@
         (change)="fieldOnChange()"
         (blur)="fieldOnBlur()"
       >
-      </ngx-mat-input-tel>
+      </mat-tel-input>
       <mat-label>{{ label$ }}</mat-label>
       <mat-error *ngIf="fieldControl.invalid">{{ getErrorMessage() }}</mat-error>
     </mat-form-field>

package/lib/field/phone/phone.component.ts

@@ -2,7 +2,7 @@ import { Component, forwardRef } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
-import { NgxMatInputTelComponent } from 'ngx-mat-input-tel';
+import { MatTelInput } from 'mat-tel-input';
 import { parsePhoneNumberFromString } from 'libphonenumber-js';
 
 import { FieldBase } from '@pega/angular-sdk-components';
@@ -18,7 +18,7 @@ interface PhoneProps extends PConnFieldProps {
   selector: 'app-phone',
   templateUrl: './phone.component.html',
   styleUrls: ['./phone.component.scss'],
-  imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, NgxMatInputTelComponent, forwardRef(() => ComponentMapperComponent)]
+  imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatTelInput, forwardRef(() => ComponentMapperComponent)]
 })
 export class PhoneComponent extends FieldBase {
   configProps$: PhoneProps;

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

@@ -546,7 +546,11 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
       const oWorkItem = configObject.getPConnect();
       const oWorkData: any = oWorkItem.getDataObject();
 
-      this.containerName$ = this.localizedVal(this.getActiveViewLabel() || oWorkData.caseInfo.assignments?.[0].name, undefined, this.localeReference);
+      this.containerName$ = this.localizedVal(
+        this.getActiveViewLabel() || oWorkData.caseInfo.assignments?.[0]?.name,
+        undefined,
+        this.localeReference
+      );
     });
   }
 

package/lib/infra/Containers/flow-container/helpers.ts

@@ -33,7 +33,7 @@ export function hasAssignments(pConnect) {
   const assignments = pConnect.getValue(CASE_INFO.D_CASE_ASSIGNMENTS_RESULTS);
   const childCasesAssignments = getChildCaseAssignments(pConnect);
 
-  return assignments || childCasesAssignments?.length || isCaseWideLocalAction(pConnect);
+  return assignments?.length || childCasesAssignments?.length || isCaseWideLocalAction(pConnect);
 }
 
 export const showBanner = getPConnect => {

package/lib/infra/assignment/assignment.component.ts

@@ -225,7 +225,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
       // this.containerName$ = oWorkMeta["name"];
 
       if (oWorkData.caseInfo && oWorkData.caseInfo.assignments !== null) {
-        this.containerName$ = oWorkData.caseInfo.assignments?.[0].name;
+        this.containerName$ = oWorkData.caseInfo.assignments?.[0]?.name;
 
         // get caseInfo
         const oCaseInfo = oData.caseInfo;

package/lib/template/field-group-template/field-group-template.component.html

@@ -28,6 +28,6 @@
         </div>
       </div>
     </div>
-    <button *ngIf="allowAdd" mat-button color="primary" style="font-size: 16px" (click)="addFieldGroupItem()">{{ getAddBtnLabel() }}</button>
+    <button *ngIf="allowAdd()" mat-button color="primary" style="font-size: 16px" (click)="addFieldGroupItem()">{{ getAddBtnLabel() }}</button>
   </ng-template>
 </div>

package/lib/template/field-group-template/field-group-template.component.scss

@@ -1,5 +1,6 @@
 .psdk-utility-card-action-svg-icon {
   width: 1.4rem;
+  filter: var(--app-primary-color-filter);
 }
 
 .header-div {

package/lib/template/field-group-template/field-group-template.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges, signal } from '@angular/core';
+import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges, signal, effect } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
@@ -48,32 +48,26 @@ export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges
   referenceListLength = signal<number | null>(null);
   fieldHeader: any;
 
-  allowAdd = true;
-  allowEdit = true;
+  allowAdd = signal(true);
+  allowEdit = signal(true);
   allowDelete = true;
 
   constructor(
     private angularPConnect: AngularPConnectService,
     private utils: Utils
-  ) {}
+  ) {
+    effect(() => {
+      const allowAdd = this.allowAdd();
+      const allowEdit = this.allowEdit();
+      const referenceList = this.configProps$?.referenceList;
+      if (referenceList?.length === 0 && (allowAdd || allowEdit)) {
+        this.pConn$.getListActions().insert({ classID: this.contextClass }, referenceList.length);
+      }
+    });
+  }
 
   ngOnInit(): void {
     this.menuIconOverride$ = this.utils.getImageSrc('trash', this.utils.getSDKStaticContentUrl());
-
-    const { allowActions, allowTableEdit, referenceList } = this.configProps$;
-
-    if (allowActions && Object.keys(allowActions).length > 0) {
-      this.allowAdd = allowActions.allowAdd ?? allowTableEdit ?? true;
-      this.allowEdit = allowActions.allowEdit ?? true;
-      this.allowDelete = allowActions.allowDelete ?? allowTableEdit ?? true;
-    } else {
-      this.allowAdd = allowTableEdit ?? true;
-      this.allowDelete = allowTableEdit ?? true;
-    }
-
-    if (referenceList?.length === 0 && (this.allowAdd || this.allowEdit)) {
-      this.pConn$.getListActions().insert({ classID: this.contextClass }, referenceList.length);
-    }
   }
 
   ngOnDestroy(): void {
@@ -121,6 +115,17 @@ export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges
     const resolvedList = getReferenceList(this.pConn$);
     this.pConn$.setReferenceList(resolvedList);
 
+    const { allowActions, allowTableEdit } = this.configProps$;
+
+    if (allowActions && Object.keys(allowActions).length > 0) {
+      this.allowAdd.set(allowActions.allowAdd ?? allowTableEdit ?? true);
+      this.allowEdit.set(allowActions.allowEdit ?? true);
+      this.allowDelete = allowActions.allowDelete ?? allowTableEdit ?? true;
+    } else {
+      this.allowAdd.set(allowTableEdit ?? true);
+      this.allowDelete = allowTableEdit ?? true;
+    }
+
     if (this.readonlyMode) {
       this.pConn$.setInheritedProp('displayMode', 'DISPLAY_ONLY');
     }

package/package.json

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