@pega/dx-component-builder-sdk 24.2.10 → 24.2.12

package/src/tasks/create/templates/SDK-Angular/template/FORM/demo.stories.tsx.mustache

@@ -10,21 +10,12 @@ class MockingDatapageService {
   getDataPageData = () => Promise.resolve({});
 }
 
-window.PCore = {
-  ...window.PCore,
-  getConstants: (): any => {
-    return {
-      CASE_INFO: {
-        INSTRUCTIONS: 'caseInfo.assignments[0].instructions'
-      }
-    };
-  },
-  setBehaviorOverride: () => {},
-  getStore: () => {
-    return {
-      subscribe: () => {}
-    };
-  }
+window.PCore.getContextTreeManager = (): any => {
+  return {
+    removeContextTreeNode: () => {
+      /* nothing */
+    }
+  };
 };
 
 const meta: Meta<{{COMPONENT_CLASS_NAME}}Component> = {
@@ -36,55 +27,57 @@ const meta: Meta<{{COMPONENT_CLASS_NAME}}Component> = {
   ],
   component: {{COMPONENT_CLASS_NAME}}Component,
   excludeStories: /.*Data$/,
-  render: (args: {{COMPONENT_CLASS_NAME}}Component) => ({
+  render: (args) => ({
     props: {
       ...args,
       pConn$: {
-      getChildren: () => {
-        return [
-          {
-            getPConnect: () => {
-              return {
-                getChildren: () => {
-                  return children;
-                }
-              };
+        getChildren: () => {
+          return [
+            {
+              getPConnect: () => {
+                return {
+                  getChildren: () => {
+                    return children;
+                  }
+                };
+              }
             }
-          }
-        ];
-      },
-      getValue: (): any => {
-        /* nothing */
-      },
-      getCurrentView: (): any => {
-        /* nothing */
-      },
-      getCurrentClassID: (): any => {
-        /* nothing */
-      },
-      isEditable: () => true,
-      setAction: () => {
-        /* nothing */
-      },
-      getActions: () => {
-        return {
-          onChange: () => {},
-          onBlur: () => {}
-        };
-      },
-      populateAdditionalProps: () => {
-        /* nothing */
-      },
-      getConfigProps: () => {
-        return {
-          NumCols: '1'
-        };
-      },
-      getInheritedProps: (): any => {
-        /* nothing */
-      }
-    } as any,
-    formGroup$: new FormBuilder().group({})
+          ];
+        },
+        getValue: (): any => {
+          /* nothing */
+        },
+        getCurrentView: (): any => {
+          /* nothing */
+        },
+        getCurrentClassID: (): any => {
+          /* nothing */
+        },
+        isEditable: () => true,
+        setAction: () => {
+          /* nothing */
+        },
+        getActions: () => {
+          return {
+            onChange: () => {},
+            onBlur: () => {}
+          };
+        },
+        populateAdditionalProps: () => {
+          /* nothing */
+        },
+        getConfigProps: () => {
+          return {
+            NumCols: '1'
+          };
+        },
+        getInheritedProps: (): any => {
+          /* nothing */
+        },
+        getContextName: () => '',
+        clearErrorMessages: () => {/* nothing */}
+      } as any,
+      formGroup$: new FormBuilder().group({})
     }
   })
 };
@@ -93,8 +86,5 @@ export default meta;
 type Story = StoryObj<{{COMPONENT_CLASS_NAME}}Component>;
 
 export const {{COMPONENT_CLASS_NAME}}: Story = {
-  args: {
-    label: 'Form',
-    showLabel: false
-  }
+  args: {}
 };

package/src/tasks/create/templates/SDK-Angular/template/FORM/form.component.html.mustache

@@ -1,9 +1,5 @@
-<!-- When adding a component here, add the same component in 'region' template as well -->
 {{! pick new delimiters for mustache }}
 {{=<% %>=}}
-<div *ngIf="!NO_HEADER_TEMPLATES.includes(template) && showLabel">
-  <div class="template-title-container">{{ label }}</div>
-</div>
 <div *ngIf="instructions" class="psdk-default-form-instruction-text">
   <div key="instructions" id="instruction-text" [innerHTML]="instructions"></div>
 </div>

package/src/tasks/create/templates/SDK-Angular/template/FORM/form.component.spec.ts.mustache

@@ -8,9 +8,8 @@ describe('{{COMPONENT_CLASS_NAME}}Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ {{COMPONENT_CLASS_NAME}}Component ]
-    })
-    .compileComponents();
+      declarations: [{{COMPONENT_CLASS_NAME}}Component]
+    }).compileComponents();
   }));
 
   beforeEach(() => {

package/src/tasks/create/templates/SDK-Angular/template/FORM/form.component.ts.mustache

@@ -4,11 +4,11 @@ import { FormGroup } from '@angular/forms';
 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';
 
 interface {{COMPONENT_CLASS_NAME}}Props {
   // If any, enter additional props that only exist on this component
   NumCols: string;
-  template: string;
   instructions: string;
 }
 
@@ -19,37 +19,21 @@ interface {{COMPONENT_CLASS_NAME}}Props {
   standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class {{COMPONENT_CLASS_NAME}}Component implements OnInit {
-  @Input() pConn$: typeof PConnect;
+export class {{COMPONENT_CLASS_NAME}}Component extends FormTemplateBase implements OnInit {
+  @Input() override pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
   arChildren$: any[];
   divClass$: string;
-  template: any;
-  showLabel: any;
-  label: any;
   instructions: string;
 
-  NO_HEADER_TEMPLATES = [
-    'SubTabs',
-    'SimpleTable',
-    'Details',
-    'DetailsTwoColumn',
-    'DetailsThreeColumn',
-    'NarrowWideDetails',
-    'WideNarrowDetails',
-    'Confirmation'
-  ];
-
-  constructor(private templateUtils: TemplateUtils) {}
+  constructor(private templateUtils: TemplateUtils) {
+    super();
+  }
 
   ngOnInit(): void {
     const configProps = this.pConn$.getConfigProps() as {{COMPONENT_CLASS_NAME}}Props;
-    this.template = configProps?.template;
-    const propToUse: any = { ...this.pConn$.getInheritedProps() };
-    this.showLabel = propToUse?.showLabel;
-    this.label = propToUse?.label;
-    const kids = this.pConn$.getChildren() as any[];
+    const kids = this.pConn$.getChildren();
     this.instructions = this.templateUtils.getInstructions(this.pConn$, configProps?.instructions);
 
     const numCols = configProps.NumCols ? configProps.NumCols : '1';