@pega/dx-component-builder-sdk 0.23.11 → 0.23.12

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-phone/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyPhoneComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyPhoneComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-phone ${argsToTemplate(args)}></app-pega-dxil-my-phone>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyPhoneComponent>;
-
-export const PegaDxilMyPhone: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getConfigProps: () => {
         return configProps;
@@ -43,5 +32,21 @@ export const PegaDxilMyPhone: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyPhoneComponent>;
+
+export const PegaDxilMyPhone: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    testId: configProps.testId,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-picklist/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyPicklistComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyPicklistComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-picklist ${argsToTemplate(args)}></app-pega-dxil-my-picklist>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyPicklistComponent>;
-
-export const PegaDxilMyPicklist: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getConfigProps: () => {
         return configProps;
@@ -59,5 +48,21 @@ export const PegaDxilMyPicklist: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyPicklistComponent>;
+
+export const PegaDxilMyPicklist: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    testId: configProps.testId,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-picklist/mock.ts

@@ -19,7 +19,11 @@ export const configProps = {
   ],
   helperText: 'Picklist Helper Text',
   testId: 'picklist-12345678',
-  hasSuggestions: false
+  hasSuggestions: false,
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-picklist/pega-dxil-my-picklist.component.ts

@@ -160,7 +160,7 @@ export class PegaDxilMyPicklistComponent implements OnInit, OnDestroy {
     this.componentReference = (this.pConn$.getStateProps() as any).value;
 
     // @ts-ignore - parameter “contextName” for getDataObject method should be optional
-    const optionsList = this.utils.getOptionList(this.configProps$, this.pConn$.getDataObject());
+    const optionsList = [...this.utils.getOptionList(this.configProps$, this.pConn$.getDataObject())];
     optionsList?.unshift({ key: 'Select', value: this.pConn$.getLocalizedValue('Select...', '', '') });
     this.options$ = optionsList;
     if (this.value$ === '' && !this.bReadonly$) {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-radiobuttons/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 import { configProps, stateProps } from './mock';
 
@@ -11,18 +10,8 @@ const meta: Meta<PegaDxilMyRadiobuttonsComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyRadiobuttonsComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-radiobuttons ${argsToTemplate(args)}></app-pega-dxil-my-radiobuttons>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyRadiobuttonsComponent>;
-
-export const PegaDxilMyRadiobuttons: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: props => props,
       getConfigProps: () => {
         return configProps;
@@ -61,5 +50,21 @@ export const PegaDxilMyRadiobuttons: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyRadiobuttonsComponent>;
+
+export const PegaDxilMyRadiobuttons: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    testId: configProps.testId,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-radiobuttons/mock.ts

@@ -18,12 +18,17 @@ export const configProps = {
     }
   ],
   hasSuggestions: false,
-  label: 'TV Option',
+  label: 'Picklist-RadioButtons Sample',
+  helperText: 'Picklist-RadioButtons Helper Text',
   listType: 'associated',
   readonly: undefined,
   testId: '81DC52353BC235FE78F52FA873E0EF56',
   value: '',
-  visibility: true
+  visibility: true,
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-searchbox/demo.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
+import { moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 import { DatapageService } from '@pega/angular-sdk-components';
 import { configProps, stateProps } from './mock';
@@ -21,18 +21,8 @@ const meta: Meta<PegaDxilMySearchboxComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMySearchboxComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-searchbox ${argsToTemplate(args)}></app-pega-dxil-my-searchbox>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMySearchboxComponent>;
-
-export const PegaDxilMySearchbox: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: props => props,
       getConfigProps: () => {
         return configProps;
@@ -58,5 +48,21 @@ export const PegaDxilMySearchbox: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMySearchboxComponent>;
+
+export const PegaDxilMySearchbox: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    testId: configProps.testId,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-searchbox/mock.ts

@@ -24,12 +24,16 @@ export const configProps = {
   },
   deferDatasource: true,
   hasSuggestions: false,
-  label: 'Suffix',
+  helperText: 'Picklist-Autocomplete Helper Text',
+  label: 'Picklist-Autocomplete Sample',
   listType: 'associated',
   placeholder: 'Select...',
-  readOnly: undefined,
   testId: '56E6DDD1CB6CEC596B433440DFB21C17',
-  value: undefined
+  value: undefined,
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-text/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyTextComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyTextComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-text ${argsToTemplate(args)}></app-pega-dxil-my-text>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyTextComponent>;
-
-export const PegaDxilMyText: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: props => props,
       getConfigProps: () => {
         return configProps;
@@ -33,5 +22,22 @@ export const PegaDxilMyText: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyTextComponent>;
+
+export const PegaDxilMyText: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    testId: configProps.testId,
+    placeholder: configProps.placeholder,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    bHideLabel$: configProps.hideLabel,
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-text/mock.ts

@@ -1,7 +1,14 @@
 export const configProps = {
   value: 'John',
-  label: 'First Name',
-  testId: 'test-123'
+  label: 'Text Sample',
+  placeholder: 'Text Placeholder',
+  testId: 'Text-12345678',
+  helperText: 'Text Helper Text',
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  hideLabel: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-text-input/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyTextInputComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyTextInputComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-text-input ${argsToTemplate(args)}></app-pega-dxil-my-text-input>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyTextInputComponent>;
-
-export const PegaDxilMyTextInput: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getConfigProps: () => {
         return configProps;
@@ -33,5 +22,22 @@ export const PegaDxilMyTextInput: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyTextInputComponent>;
+
+export const PegaDxilMyTextInput: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    placeholder: configProps.placeholder,
+    testId: configProps.testId,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-text-input/mock.ts

@@ -1,7 +1,13 @@
 export const configProps = {
   value: 'John',
-  label: 'First Name',
-  testId: 'test-123'
+  label: 'TextInput Sample',
+  placeholder: 'TextInput Placeholder',
+  helperText: 'TextInput Helper Text',
+  testId: 'TextInput-12345678',
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-time-of-day/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyTimeOfDayComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyTimeOfDayComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-time-of-day ${argsToTemplate(args)}></app-pega-dxil-my-time-of-day>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyTimeOfDayComponent>;
-
-export const PegaDxilMyTimeOfDay: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getConfigProps: () => {
         return configProps;
@@ -33,5 +22,21 @@ export const PegaDxilMyTimeOfDay: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyTimeOfDayComponent>;
+
+export const PegaDxilMyTimeOfDay: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    placeholder: configProps.placeholder,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-time-of-day/mock.ts

@@ -3,7 +3,12 @@ export const configProps = {
   label: 'Time Sample',
   helperText: 'Time Helper Text',
   testId: 'time-12345678',
-  hasSuggestions: false
+  hasSuggestions: false,
+  placeholder: 'Time Placeholder',
+  displayMode: '',
+  readOnly: false,
+  disabled: false,
+  required: true
 };
 
 export const stateProps = {

package/tests/assets/sdk-a/components/createAll/custom-sdk/field/pega-dxil-my-url/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 
 import { configProps, stateProps } from './mock';
@@ -12,18 +11,8 @@ const meta: Meta<PegaDxilMyUrlComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyUrlComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-url ${argsToTemplate(args)}></app-pega-dxil-my-url>`
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyUrlComponent>;
-
-export const PegaDxilMyUrl: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getConfigProps: () => {
         return configProps;
@@ -33,5 +22,21 @@ export const PegaDxilMyUrl: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyUrlComponent>;
+
+export const PegaDxilMyUrl: Story = {
+  args: {
+    label$: configProps.label,
+    helperText: configProps.helperText,
+    placeholder: configProps.placeholder,
+    bReadonly$: configProps.readOnly,
+    bDisabled$: configProps.disabled,
+    bRequired$: configProps.required,
+    displayMode$: configProps.displayMode
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/template/pega-dxil-my-details/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
 
 import { pyReviewRaw } from './mock';
 
@@ -11,18 +10,8 @@ const meta: Meta<PegaDxilMyDetailsComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyDetailsComponent) => ({
     props: {
-      ...args
-    },
-   template: `<app-pega-dxil-my-details ${argsToTemplate(args)}></app-pega-dxil-my-details>`,
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyDetailsComponent>;
-
-export const PegaDxilMyDetails: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       resolveConfigProps: (props) => props,
       getRawMetadata: () => {
         return pyReviewRaw.config;
@@ -47,5 +36,15 @@ export const PegaDxilMyDetails: Story = {
         /* nothing */
       }
     } as any
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyDetailsComponent>;
+
+export const PegaDxilMyDetails: Story = {
+  args: {
+    showHighlightedData: false
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/template/pega-dxil-my-form/demo.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate, moduleMetadata } from '@storybook/angular';
+import { moduleMetadata } from '@storybook/angular';
 import { FormBuilder } from '@angular/forms';
 import { DatapageService } from '@pega/angular-sdk-components';
 import { children } from './mock';
@@ -38,18 +38,8 @@ const meta: Meta<PegaDxilMyFormComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyFormComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-form ${argsToTemplate(args)}></app-pega-dxil-my-form>`,
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyFormComponent>;
-
-export const PegaDxilMyForm: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       getChildren: () => {
         return [
           {
@@ -95,5 +85,16 @@ export const PegaDxilMyForm: Story = {
       }
     } as any,
     formGroup$: new FormBuilder().group({})
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyFormComponent>;
+
+export const PegaDxilMyForm: Story = {
+  args: {
+    label: 'Form',
+    showLabel: false
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/template/pega-dxil-my-form/pega-dxil-my-form.component.scss

@@ -1,5 +1,3 @@
-@import '@pega/angular-sdk-components/_shared/styles.scss';
-
 .psdk-default-form-one-column {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));

package/tests/assets/sdk-a/components/createAll/custom-sdk/template/pega-dxil-my-page/demo.stories.tsx

@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/angular';
-import { argsToTemplate } from '@storybook/angular';
 import { children } from './mock';
 
 import { PegaDxilMyPageComponent } from './pega-dxil-my-page.component';
@@ -10,18 +9,8 @@ const meta: Meta<PegaDxilMyPageComponent> = {
   excludeStories: /.*Data$/,
   render: (args: PegaDxilMyPageComponent) => ({
     props: {
-      ...args
-    },
-    template: `<app-pega-dxil-my-page ${argsToTemplate(args)}></app-pega-dxil-my-page>`,
-  })
-};
-
-export default meta;
-type Story = StoryObj<PegaDxilMyPageComponent>;
-
-export const PegaDxilMyPage: Story = {
-  args: {
-    pConn$: {
+      ...args,
+      pConn$: {
       getChildren: () => {
         return [
           {
@@ -40,16 +29,26 @@ export const PegaDxilMyPage: Story = {
       },
       getConfigProps: () => {
         return {
-          title: '',
+          title: 'Annoucements',
           operator: ''
         };
       },
       resolveConfigProps: () => {
         return {
-          title: '',
+          title: 'Annoucements',
           operator: ''
         };
       }
     } as any
+    }
+  })
+};
+
+export default meta;
+type Story = StoryObj<PegaDxilMyPageComponent>;
+
+export const PegaDxilMyPage: Story = {
+  args: {
+    title$: 'Announcements'
   }
 };

package/tests/assets/sdk-a/components/createAll/custom-sdk/template/pega-dxil-my-page/mock.ts

@@ -40,9 +40,6 @@ export const children = [
                 {
                   name: 'New Angular based UI rendering'
                 },
-                {
-                  name: 'Support for followers and recents'
-                },
                 {
                   name: 'New authoring experience'
                 }
@@ -66,9 +63,6 @@ export const children = [
                 {
                   name: 'New Angular based UI rendering'
                 },
-                {
-                  name: 'Support for followers and recents'
-                },
                 {
                   name: 'New authoring experience'
                 }