@pega/angular-sdk-overrides 0.25.12 → 0.25.14

package/lib/designSystemExtension/material-details-fields/material-details-fields.component.html

@@ -5,7 +5,7 @@
     </div>
     <ng-template #noGroup>
       <div *ngIf="field.type === 'reference'; else showDetails">
-        <component-mapper name="View" [props]="{ pConn$: field.pConn }"></component-mapper>
+        <component-mapper name="reference" [props]="{ pConn$: field.pConn }"></component-mapper>
       </div>
     </ng-template>
 

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

@@ -1,7 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { Component, forwardRef, Input, OnInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { PConnFieldProps } from '@pega/angular-sdk-components';
@@ -64,7 +63,7 @@ export class GroupComponent implements OnInit {
    */
   updateSelf(): void {
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as GroupProps;
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
     this.visibility$ = this.configProps$.visibility;
     this.showHeading$ = this.configProps$.showHeading;
     this.heading$ = this.configProps$.heading;

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

@@ -39,6 +39,6 @@
     </mat-card>
   </div>
   <div *ngIf="bShowBanner && bShowConfirm && confirm_pconn">
-    <component-mapper name="View" [props]="{ formGroup$, pConn$: confirm_pconn }"></component-mapper>
+    <component-mapper name="reference" [props]="{ formGroup$, pConn$: confirm_pconn }"></component-mapper>
   </div>
 </div>

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

@@ -4,7 +4,6 @@ import { FormBuilder, FormGroup } from '@angular/forms';
 import { MatCardModule } from '@angular/material/card';
 import { publicConstants } from '@pega/pcore-pconnect-typedefs/constants';
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { getToDoAssignments, hasAssignments, showBanner } from './helpers';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
@@ -415,7 +414,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
         // let kid = this.pConn$.getChildren()[0];
 
         // kid.getPConnect() can be a Reference component. So normalize it just in case
-        //        let todoKid = ReferenceComponent.normalizePConn(kid.getPConnect()).getChildren()[0];
+        //        let todoKid = kid.getPConnect().getChildren()[0];
 
         //        this.todo_pConn$ = todoKid.getPConnect();
 
@@ -528,7 +527,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
     //  the View if it is a Reference component. And need to pass in the getPConnect
     //  to have normalize do a c11Env createComponent (that makes sure options.hasForm
     //  is passed along to all the component's children)
-    const normalizedConfigObject = ReferenceComponent.normalizePConn(configObject.getPConnect());
+    const normalizedConfigObject = configObject.getPConnect();
     // We want the children to be the PConnect itself, not the result of calling getPConnect(),
     //  So need to get the PConnect of the normalized component we just created...
     const normalizedConfigObjectAsPConnect = normalizedConfigObject.getComponent();

package/lib/infra/Containers/modal-view-container/modal-view-container.component.ts

@@ -6,7 +6,6 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { getBanners } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 
 /**
  * WARNING: This file is part of the infrastructure component responsible for working with Redux and managing the creation and update of Redux containers and PConnect.
@@ -238,8 +237,7 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
         const bIsRefComponent = this.checkIfRefComponent(newComp);
 
         if (bIsRefComponent) {
-          const newPConn = ReferenceComponent.normalizePConn(newComp);
-          this.arChildren$ = ReferenceComponent.normalizePConnArray(newPConn.getChildren());
+          this.arChildren$ = [newComp.getComponent()];
         } else {
           // update children with new view's children
           this.arChildren$ = newComp.getChildren();

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

@@ -26,6 +26,6 @@
     </ng-template>
   </div>
   <ng-template #isReference>
-    <component-mapper name="View" [props]="{ pConn$: viewPConn$, displayOnlyFA$ }"></component-mapper>
+    <component-mapper name="reference" [props]="{ pConn$: viewPConn$, formGroup$, displayOnlyFA$ }"></component-mapper>
   </ng-template>
 </div>

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

@@ -3,7 +3,6 @@ import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { configureBrowserBookmark } from './helper';
 
@@ -73,8 +72,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
     // Then, continue on with other initialization
 
     //    this.configProps$ = this.pConn$.getConfigProps();
-    // children may have a 'reference' so normalize the children array
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
 
     this.buildName$ = this.buildName();
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as ViewContainerProps;
@@ -146,8 +144,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
     //   *** DON'T call updateSelf in ngInit!!  ***
 
     if (this.arChildren$ == null) {
-      // children may have a 'reference' so normalize the children array
-      this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+      this.arChildren$ = this.pConn$.getChildren();
     }
 
     // routingInfo was added as component prop in populateAdditionalProps
@@ -222,12 +219,12 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
 
               /*
 
-              const theDereferencedView = ReferenceComponent.normalizePConn(newComp);
+              const theDereferencedView = newComp;
               const newConfigProps = theDereferencedView.getConfigProps();
 
               // children may have a 'reference' so normalize the children arra
 
-              const theDereferencedViewChildren = ReferenceComponent.normalizePConnArray(theDereferencedView.getChildren());
+              const theDereferencedViewChildren = theDereferencedView.getChildren();
               this.templateName$ = ('template' in newConfigProps) ? newConfigProps["template"] : "";
               this.title$ = ('title' in newConfigProps) ? newConfigProps["title"] : "";
               this.arChildren$ = theDereferencedViewChildren;
@@ -244,8 +241,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
               this.templateName$ = newConfigProps.template || '';
               this.title$ = newConfigProps.title || '';
               // update children with new view's children
-              // children may have a 'reference' so normalize the children array
-              this.arChildren$ = ReferenceComponent.normalizePConnArray(newComp.getChildren());
+              this.arChildren$ = newComp.getChildren();
             }
           });
         }

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

@@ -7,7 +7,6 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { ErrorMessagesService } from '@pega/angular-sdk-components';
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
 import { BannerService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 function getRefreshProps(refreshConditions) {
@@ -149,8 +148,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
     this.registerForRefresh();
 
-    // pConn$ may be a 'reference' component, so normalize it
-    this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
+    this.newPConn$ = this.pConn$;
 
     if (this.arChildren$) {
       this.createButtons();
@@ -158,9 +156,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   initComponent() {
-    // pConn$ may be a 'reference' component, so normalize it
-    // this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-    this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
+    this.newPConn$ = this.pConn$;
 
     // prevent re-intializing with flowContainer update unless an action is taken
     this.bReInit = false;
@@ -203,7 +199,6 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
     this.cancelCreateStageAssignment = actionsAPI.cancelCreateStageAssignment.bind(actionsAPI);
     this.approveCase = actionsAPI.approveCase?.bind(actionsAPI);
     this.rejectCase = actionsAPI.rejectCase?.bind(actionsAPI);
-
     if (this.arChildren$) {
       this.createButtons();
     }

package/lib/infra/assignment-card/assignment-card.component.html

@@ -2,6 +2,7 @@
   <div *ngFor="let kid of childrenArray" class="psdk-assignment-card-child">
     <div [ngSwitch]="kid.getPConnect().getComponentName()">
       <component-mapper *ngSwitchCase="'View'" name="View" [props]="{ formGroup$, pConn$: kid.getPConnect() }"></component-mapper>
+      <component-mapper *ngSwitchCase="'reference'" name="reference" [props]="{ formGroup$, pConn$: kid.getPConnect() }"></component-mapper>
       <component-mapper
         *ngSwitchCase="'CaseCreateStage'"
         name="CaseCreateStage"

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

@@ -1,7 +1,6 @@
 import { Component, OnInit, Input, Output, EventEmitter, forwardRef, OnChanges, SimpleChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup, ReactiveFormsModule } from '@angular/forms';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 function isChildrenUpdated(children) {
@@ -34,18 +33,13 @@ export class AssignmentCardComponent implements OnInit, OnChanges {
   @Output() actionButtonClick: EventEmitter<any> = new EventEmitter();
 
   ngOnInit(): void {
-    // Children may contain 'reference' component, so we need to
-    //  normalize them
-    this.childrenArray = ReferenceComponent.normalizePConnArray(this.arChildren$);
+    this.childrenArray = this.arChildren$;
   }
 
   ngOnChanges(changes: SimpleChanges) {
-    // Children may contain 'reference' component, so we need to
-    //  normalize them
-
     const { arChildren$ } = changes;
     if (isChildrenUpdated(arChildren$)) {
-      this.childrenArray = ReferenceComponent.normalizePConnArray(this.arChildren$);
+      this.childrenArray = this.arChildren$;
     }
   }
 

package/lib/infra/defer-load/defer-load.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { publicConstants } from '@pega/pcore-pconnect-typedefs/constants';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 
@@ -127,7 +126,7 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
       const configObject = PCore.createPConnect(config);
       configObject.getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');
 
-      this.childComponentPConnect = ReferenceComponent.normalizePConn(configObject.getPConnect());
+      this.childComponentPConnect = configObject.getPConnect();
 
       if (this.deferLoadId) {
         PCore.getDeferLoadManager().stop(this.deferLoadId, this.pConn$.getContextName());

package/lib/infra/reference/reference.component.html

@@ -1 +1,7 @@
-<!-- Reference component is all static methods so .html not used -->
+<div *ngIf="viewComponentPConnect">
+  <component-mapper
+    [name]="viewComponentPConnect.getComponentName()"
+    [props]="{ pConn$: viewComponentPConnect, formGroup$ }"
+    errorMsg="Reference Missing: {{ viewComponentPConnect.getComponentName() }}"
+  ></component-mapper>
+</div>

package/lib/infra/reference/reference.component.ts

@@ -1,4 +1,7 @@
-import { Component } from '@angular/core';
+import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
+import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 /**
  * WARNING: This file is part of the infrastructure component responsible for working with Redux and managing the creation and update of Redux containers and PConnect.
@@ -9,45 +12,74 @@ import { Component } from '@angular/core';
   selector: 'app-reference',
   templateUrl: './reference.component.html',
   styleUrls: ['./reference.component.scss'],
-  standalone: true
+  imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class ReferenceComponent {
-  /* Used to toggle some class-wide logging */
-  private static bLogging = false;
-
-  /**
-   * Creates a normalized PConn from a reference component.
-   * Resolves the reference to its fully realized View with proper configuration.
-   *
-   * @param inPConn - The PConn object that represents a reference component
-   * @returns The dereferenced PConnect object, or null if reference can't be resolved
-   */
-  static createFullReferencedViewFromRef(inPConn: any): any {
-    // Validate that inPConn is a reference component
-    if (inPConn.getComponentName() !== 'reference') {
-      console.error(`Reference component: createFullReferencedViewFromRef inPConn is NOT a reference! ${inPConn.getComponentName()}`);
-      return null;
+export class ReferenceComponent implements OnInit, OnDestroy, OnChanges {
+  @Input() pConn$: typeof PConnect;
+  @Input() formGroup$: any;
+
+  angularPConnectData: AngularPConnectData = {};
+  viewComponentPConnect: typeof PConnect | null = null;
+
+  constructor(private angularPConnect: AngularPConnectService) {}
+
+  ngOnInit(): void {
+    this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
+    this.updateSelf();
+  }
+
+  ngOnDestroy(): void {
+    if (this.angularPConnectData.unsubscribeFn) {
+      this.angularPConnectData.unsubscribeFn();
+    }
+  }
+
+  ngOnChanges(changes: SimpleChanges) {
+    const { pConn$ } = changes;
+    if (!pConn$.firstChange && pConn$.previousValue !== pConn$.currentValue) {
+      this.checkAndUpdate();
+    }
+  }
+
+  onStateChange() {
+    this.checkAndUpdate();
+  }
+
+  // Should always check the bridge to see if the component should update itself (re-render)
+  checkAndUpdate() {
+    const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
+
+    // ONLY call updateSelf when the component should update
+    if (bUpdateSelf) {
+      this.updateSelf();
     }
+  }
 
-    // Get reference configuration and make a copy
-    const referenceConfig = { ...inPConn.getComponentConfig() };
+  updateSelf() {
+    const pConnect = this.pConn$;
+
+    const resolvedConfigProps = pConnect.resolveConfigProps(pConnect.getConfigProps()) as {
+      visibility?: boolean;
+      context?: string;
+      readOnly?: boolean;
+      displayMode?: string;
+    };
+
+    const { visibility = true, context = '', readOnly = false, displayMode = '' } = resolvedConfigProps;
+
+    const referenceConfig = { ...pConnect.getComponentConfig() };
 
-    // Remove properties that should not be inherited by the referenced view
-    // (Maintained from React SDK implementation)
     delete referenceConfig?.name;
     delete referenceConfig?.type;
     delete referenceConfig?.visibility;
 
-    // Get the metadata for the referenced view
-    const viewMetadata = inPConn.getReferencedView();
+    const viewMetadata: any = pConnect.getReferencedView();
 
-    // Return null if view metadata is not found
     if (!viewMetadata) {
-      console.log('View not found ', inPConn.getComponentConfig());
-      return null;
+      this.viewComponentPConnect = null;
+      return;
     }
 
-    // Create the view object by merging metadata with reference config
     const viewObject = {
       ...viewMetadata,
       config: {
@@ -56,101 +88,24 @@ export class ReferenceComponent {
       }
     };
 
-    // Resolve configuration properties
-    const resolvedConfigProps = inPConn.resolveConfigProps(inPConn.getConfigProps());
-    const { visibility = true, context, readOnly = false, displayMode = '' } = resolvedConfigProps;
-
-    // Log debug information if logging is enabled
-    if (ReferenceComponent.bLogging) {
-      console.log(`Reference: about to call createComponent with pageReference: context: ${inPConn.getContextName()}`);
-    }
-
-    // Create the component with the right context
-    const viewComponent = inPConn.createComponent(viewObject, null, null, {
+    // @ts-expect-error - createComponent expects string but null is passed for unused parameters (matches React SDK pattern)
+    const viewComponent: any = pConnect.createComponent(viewObject, null, null, {
       pageReference: context && context.startsWith('@CLASS') ? '' : context
     });
 
     if (referenceConfig.inheritedProps && referenceConfig.inheritedProps.length > 0) {
-      const inheritedProps = inPConn.getInheritedProps();
+      const inheritedProps = pConnect.getInheritedProps();
       referenceConfig.inheritedProps = Object.keys(inheritedProps).map(prop => ({ prop, value: inheritedProps[prop] }));
     }
 
-    // Get the PConnect object from the created component
     const newCompPConnect = viewComponent.getPConnect();
 
-    // Set inherited configuration on the new component
     newCompPConnect.setInheritedConfig({
       ...referenceConfig,
       readOnly,
       displayMode
     });
 
-    // Log debug information if logging is enabled
-    if (ReferenceComponent.bLogging) {
-      console.log(
-        `Angular Reference component: createFullReferencedViewFromRef -> newCompPConnect configProps: ${JSON.stringify(
-          newCompPConnect.getConfigProps()
-        )}`
-      );
-    }
-
-    // Return the component if it should be visible, otherwise null
-    return visibility !== false ? newCompPConnect : null;
-  }
-
-  /**
-   * Normalizes a PConn object that might be a 'reference'.
-   * If the incoming PConn is a reference, returns its dereferenced View.
-   * Otherwise, returns the passed in PConn unchanged.
-   *
-   * @param inPConn - A PConn object (ex: { getPConnect() } or direct PConnect)
-   * @returns The normalized PConn object with references resolved
-   */
-  static normalizePConn(inPConn: any): any {
-    // Early return for null or undefined input
-    if (!inPConn) {
-      return inPConn;
-    }
-
-    // Determine if we have an object with getPConnect method or direct PConnect
-    const hasGetPConnectMethod = !!inPConn.getPConnect;
-
-    // Get the component name in the appropriate way based on the object type
-    const componentName = hasGetPConnectMethod ? inPConn.getPConnect().getComponentName() : inPConn.getComponentName();
-
-    // Only process if this is a reference component
-    if (componentName === 'reference') {
-      if (hasGetPConnectMethod) {
-        // For objects with getPConnect method, get the referenced view and its component
-        const refViewPConn = this.createFullReferencedViewFromRef(inPConn.getPConnect());
-        return refViewPConn?.getComponent();
-      }
-
-      // For direct PConnect objects, just create the referenced view
-      return this.createFullReferencedViewFromRef(inPConn);
-    }
-
-    // Not a reference component, return unchanged
-    return inPConn;
-  }
-
-  /**
-   * Normalizes an array of PConn objects by replacing any 'reference' components
-   * with their referenced views.
-   *
-   * @param inPConnArray - Array of PConn objects to normalize
-   * @returns Normalized array with references resolved, or empty array if input is invalid
-   */
-  static normalizePConnArray(inPConnArray: any[]): any[] {
-    // Handle null, undefined, or empty array case
-    if (!inPConnArray?.length) {
-      return inPConnArray || [];
-    }
-
-    // Process array: normalize each item and filter out any null/undefined results
-    const normalizedArray = inPConnArray.map(child => ReferenceComponent.normalizePConn(child)).filter(Boolean);
-
-    // Ensure we always return an array (even if filter removes all items)
-    return normalizedArray || [];
+    this.viewComponentPConnect = visibility !== false ? newCompPConnect : null;
   }
 }

package/lib/infra/region/region.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit, Input, forwardRef, OnChanges, SimpleChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 @Component({
@@ -30,7 +29,6 @@ export class RegionComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    // The children may contain 'reference' components, so normalize the children...
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/lib/infra/root-container/root-container.component.html

@@ -10,6 +10,7 @@
       name="ViewContainer"
       [props]="{ pConn$: viewContainerPConn$, displayOnlyFA$ }"
     ></component-mapper>
+    <component-mapper *ngSwitchCase="'reference'" name="reference" [props]="{ pConn$ }"></component-mapper>
     <div *ngSwitchDefault>{{ localizedVal('RootContainer Missing: ' + componentName$, localeCategory) }}.</div>
   </div>
 </div>

package/lib/infra/root-container/root-container.component.ts

@@ -5,7 +5,6 @@ import { interval, Subscription } from 'rxjs';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { ServerConfigService } from '@pega/angular-sdk-components';
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { PreviewViewContainerComponent } from '@pega/angular-sdk-components';
 import { ModalViewContainerComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
@@ -39,7 +38,7 @@ export class RootContainerComponent implements OnInit, OnDestroy {
   // For interaction with AngularPConnect
   angularPConnectData: AngularPConnectData = {};
 
-  componentName$ = '';
+  componentName$: any;
   bIsProgress$ = false;
 
   // preview and modalview pConn
@@ -140,9 +139,7 @@ export class RootContainerComponent implements OnInit, OnDestroy {
           setTimeout(() => {
             // makes sure Angular tracks these changes
             this.ngZone.run(() => {
-              // the new rootObject may be a 'reference'. So,
-              //  normalize it to get the referencedView if that's the case
-              const theNewPConn = ReferenceComponent.normalizePConn(rootObject.getPConnect());
+              const theNewPConn = rootObject.getPConnect();
               // update ComponentName$ before we update pConn$ to make sure they're in sync
               //  when rendering...
               this.componentName$ = theNewPConn.getComponentName();

package/lib/infra/view/view.component.ts

@@ -4,7 +4,6 @@ import { FormGroup } from '@angular/forms';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { getAllFields } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 const NO_HEADER_TEMPLATES = ['SubTabs', 'SimpleTable', 'Confirmation', 'DynamicTabs', 'DetailsSubTabs', 'ListView'];
@@ -145,9 +144,6 @@ export class ViewComponent implements OnInit, OnDestroy, OnChanges {
 
     // debugger;
 
-    // normalize this.pConn$ in case it contains a 'reference'
-    this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as ViewProps;
     this.inheritedProps$ = this.pConn$.getInheritedProps();
 
@@ -160,8 +156,7 @@ export class ViewComponent implements OnInit, OnDestroy, OnChanges {
     // label & showLabel within inheritedProps takes precedence over configProps
     this.label$ = this.inheritedProps$.label || this.configProps$.label || '';
     this.showLabel$ = this.inheritedProps$.showLabel || this.configProps$.showLabel || isDetailsTemplate(this.templateName$);
-    // children may have a 'reference' so normalize the children array
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
     this.visibility$ = this.configProps$.visibility ?? this.visibility$;
 
     /**

package/lib/template/banner-page/banner-page.component.ts

@@ -1,6 +1,5 @@
 import { Component, Input, OnChanges, OnInit, SimpleChanges, forwardRef } from '@angular/core';
 
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { CommonModule } from '@angular/common';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
@@ -59,6 +58,6 @@ export class BannerPageComponent implements OnInit, OnChanges {
     this.backgroundImage = this.configProps$.backgroundImage;
 
     // The children may contain 'reference' components, so normalize the children...
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/lib/template/base/form-template-base.ts

@@ -7,8 +7,6 @@ export class FormTemplateBase implements OnDestroy {
   angularPConnectData: AngularPConnectData;
 
   ngOnDestroy(): void {
-    PCore.getContextTreeManager().removeContextTreeNode(this.pConn$.getContextName());
-
     if (this.angularPConnectData?.unsubscribeFn) {
       this.angularPConnectData.unsubscribeFn();
     }

package/lib/template/case-summary/case-summary.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 
@@ -52,11 +51,6 @@ export class CaseSummaryComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   initComponent() {
-    // dereference the View in case the incoming pConn$ is a 'reference'
-    this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-
-    // Then, continue on with other initialization
-
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as CaseSummaryProps;
     this.arChildren$ = this.pConn$.getChildren();
 

package/lib/template/case-view/case-view.component.html

@@ -35,7 +35,7 @@
     <div class="psdk-case-view-divider"></div>
 
     <div class="psdk-case-view-summary">
-      <component-mapper name="CaseSummary" [props]="{ pConn$: caseSummaryPConn$ }"></component-mapper>
+      <component-mapper name="reference" [props]="{ pConn$: caseSummaryPConn$ }"></component-mapper>
     </div>
 
     <component-mapper

package/lib/template/default-form/default-form.component.html

@@ -2,7 +2,7 @@
   <div key="instructions" id="instruction-text" [innerHTML]="instructions"></div>
 </div>
 <div [className]="divClass$">
-  <div *ngFor="let kid of arChildren$" [ngClass]="{ 'grid-column': kid.getPConnect().getComponentName() === 'View' }">
+  <div *ngFor="let kid of arChildren$" [ngClass]="{ 'grid-column': kid.getPConnect().getComponentName() === 'reference' }">
     <component-mapper
       [name]="kid.getPConnect().getComponentName()"
       [props]="{

package/lib/template/default-form/default-form.component.ts

@@ -2,7 +2,6 @@ import { Component, OnInit, Input, forwardRef, OnChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { TemplateUtils } from '@pega/angular-sdk-components';
 import { FormTemplateBase } from '@pega/angular-sdk-components';
@@ -91,7 +90,7 @@ export class DefaultFormComponent extends FormTemplateBase implements OnInit, On
     // repoint children before getting templateArray
     // Children may contain 'reference' component, so we need to
     //  normalize them
-    const children = ReferenceComponent.normalizePConnArray(kids[0].getPConnect().getChildren());
+    const children = kids[0].getPConnect().getChildren();
 
     if (areViewsChanged(this.arChildren$, children)) {
       this.arChildren$ = children;

package/lib/template/default-page/default-page.component.ts

@@ -1,6 +1,5 @@
 import { Component, OnInit, Input, forwardRef, OnChanges, SimpleChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
 interface DefaultPageProps {
@@ -59,6 +58,6 @@ export class DefaultPageComponent implements OnInit, OnChanges {
     this.backgroundImage = this.configProps$.backgroundImage;
     this.enableBanner$ = this.configProps$.enableBanner;
 
-    this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/lib/template/dynamic-tabs/dynamic-tabs.component.html

@@ -4,5 +4,6 @@
 <mat-tab-group id="dynamic-tabs" mat-stretch-tabs="false" animationDuration="0">
   <mat-tab *ngFor="let tab of tabsItems" [label]="tab.name">
     <component-mapper name="View" [props]="{ pConn$: tab.content.getPConnect() }"></component-mapper>
+    <component-mapper name="reference" [props]="{ pConn$: tab.content.getPConnect() }"></component-mapper>
   </mat-tab>
 </mat-tab-group>

package/lib/template/inline-dashboard-page/inline-dashboard-page.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input, forwardRef, SimpleChanges, OnChanges } from '@angular/core';
+import { Component, OnInit, Input, forwardRef } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup, FormBuilder } from '@angular/forms';
 import { buildFilterComponents } from '@pega/angular-sdk-components';
@@ -17,7 +17,7 @@ interface InlineDashboardPageProps {
   styleUrls: ['./inline-dashboard-page.component.scss'],
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class InlineDashboardPageComponent implements OnInit, OnChanges {
+export class InlineDashboardPageComponent implements OnInit {
   @Input() pConn$: typeof PConnect;
 
   configProps$: InlineDashboardPageProps;
@@ -34,14 +34,6 @@ export class InlineDashboardPageComponent implements OnInit, OnChanges {
     this.updateSelf();
   }
 
-  ngOnChanges(changes: SimpleChanges): void {
-    const { pConn$ } = changes;
-
-    if (pConn$.previousValue && pConn$.previousValue !== pConn$.currentValue) {
-      this.updateSelf();
-    }
-  }
-
   updateSelf() {
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as InlineDashboardPageProps;
     const arChildren$ = this.pConn$.getChildren();

package/lib/template/one-column/one-column.component.html

@@ -5,6 +5,9 @@
   <div *ngIf="kid.getPConnect().getRawMetadata()['type'] === 'View'">
     <component-mapper name="View" [props]="{ pConn$: kid.getPConnect(), formGroup$ }"></component-mapper>
   </div>
+  <div *ngIf="kid.getPConnect().getRawMetadata()['type'] === 'reference'">
+    <component-mapper name="reference" [props]="{ pConn$: kid.getPConnect(), formGroup$ }"></component-mapper>
+  </div>
   <div *ngIf="kid.getPConnect().getRawMetadata()['type'] === 'CaseCreateStage'">
     <component-mapper name="CaseCreateStage" [props]="{ pConn$: kid.getPConnect(), formGroup$ }"></component-mapper>
   </div>

package/lib/template/one-column-tab/one-column-tab.component.html

@@ -2,6 +2,7 @@
   <div *ngFor="let kid of arChildren$">
     <div [ngSwitch]="kid.getPConnect().getComponentName()">
       <component-mapper *ngSwitchCase="'View'" name="View" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
+      <component-mapper *ngSwitchCase="'reference'" name="reference" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
       <component-mapper *ngSwitchCase="'Region'" name="Region" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
       <div *ngSwitchDefault>Page Missing: {{ kid.getPConnect().getComponentName() }}</div>
     </div>

package/lib/template/page/page.component.html

@@ -5,6 +5,7 @@
   <div *ngFor="let kid of arChildren$">
     <div [ngSwitch]="kid.getPConnect().getComponentName()">
       <component-mapper *ngSwitchCase="'View'" name="View" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
+      <component-mapper *ngSwitchCase="'reference'" name="reference" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
       <component-mapper *ngSwitchCase="'Region'" name="Region" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
       <div *ngSwitchDefault>Page Missing: {{ kid.getPConnect().getComponentName() }}</div>
     </div>

package/lib/template/simple-table/simple-table.component.ts

@@ -5,6 +5,7 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { Utils } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { buildMetaForListView, getContext } from '@pega/angular-sdk-components';
+import { getReferenceList } from '@pega/angular-sdk-components';
 
 interface SimpleTableProps {
   // If any, enter additional props that only exist on this component
@@ -66,9 +67,12 @@ export class SimpleTableComponent implements OnInit, OnDestroy {
     // Should always check the bridge to see if the component should
     // update itself (re-render)
     const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
-
+    const resolvedList = getReferenceList(this.pConn$);
+    this.pConn$.setReferenceList(resolvedList);
     // ONLY call updateSelf when the component should update
     if (bUpdateSelf) {
+      const resolvedList = getReferenceList(this.pConn$);
+      this.pConn$.setReferenceList(resolvedList);
       this.updateSelf();
     }
   }

package/lib/template/simple-table-manual/simple-table-manual.component.ts

@@ -159,12 +159,15 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   referenceListStr: any;
   bUseSeparateViewForEdit: any;
   editView: any;
+  defaultActionId: any;
+  editActionId: any;
   settingsSvgIcon$: string;
 
   isInitialized = false;
   targetClassLabel: string;
   localizedVal = PCore.getLocaleUtils().getLocaleValue;
   localeCategory = 'SimpleTable';
+  editType: any;
   constructor(
     private angularPConnect: AngularPConnectService,
     public utils: Utils,
@@ -308,6 +311,10 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     this.defaultView = editModeConfig ? editModeConfig.defaultView : viewForAddAndEditModal;
     this.bUseSeparateViewForEdit = editModeConfig ? editModeConfig.useSeparateViewForEdit : useSeparateViewForEdit;
     this.editView = editModeConfig ? editModeConfig.editView : viewForEditModal;
+    this.editType = editModeConfig?.editType;
+    this.defaultActionId = this.editType === 'action' ? editModeConfig?.defaultAction : undefined;
+    this.editActionId =
+      this.editType === 'action' && editModeConfig?.useSeparateActionForEdit ? editModeConfig?.editAction : editModeConfig?.defaultAction;
     const primaryFieldsViewIndex = resolvedFields.findIndex(field => field.config.value === 'pyPrimaryFields');
     // const showDeleteButton = !this.readOnlyMode && !hideDeleteRow;
 
@@ -958,17 +965,18 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   }
 
   addRecord() {
-    if (this.allowEditingInModal && this.defaultView) {
+    if (this.allowEditingInModal && (this.defaultView || this.defaultActionId)) {
       this.pConn$
         .getActionsApi()
-        // @ts-expect-error
         .openEmbeddedDataModal(
           this.defaultView,
           this.pConn$ as any,
           this.referenceListStr,
           this.referenceList.length,
           PCore.getConstants().RESOURCE_STATUS.CREATE,
-          this.targetClassLabel
+          this.targetClassLabel,
+          this.editType,
+          this.defaultActionId
         );
     } else {
       this.pConn$.getListActions().insert({ classID: this.contextClass }, this.referenceList.length);
@@ -1018,7 +1026,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
           const isDatapage = referenceListData.startsWith('D_');
           const pageReferenceValue = isDatapage
             ? `${referenceListData}[${index}]`
-            : `${this.pConn$.getPageReference()}${referenceListData}[${index}]`;
+            : `${this.pConn$.getPageReference()}${referenceListData.substring(referenceListData.lastIndexOf('.'))}[${index}]`;
           const config = {
             meta: item,
             options: {

package/lib/template/wide-narrow-page/wide-narrow-page.component.ts

@@ -22,9 +22,6 @@ export class WideNarrowPageComponent implements OnInit, OnDestroy {
   constructor(private angularPConnect: AngularPConnectService) {}
 
   ngOnInit(): void {
-    // normalize the pConn$ in case the incoming pConn$ is a 'reference'
-    // this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
 
     // this.updateSelf();

package/package.json

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