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

package/tests/assets/sdk-r/components/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnDetails/mock.ts

@@ -0,0 +1,443 @@
+const operatorDetails = {
+  data: {
+    pzLoadTime: "January 18, 2023 10:33:19 AM EST",
+    pzPageNameHash: "_pa1519192551088960pz",
+    pyOperatorInfo: {
+      pyUserName: "french DigV2",
+      pyPosition: "",
+      pyImageInsKey: "",
+      pySkills: [
+        {
+          pySkillName: "",
+          pzIndexOwnerKey: "DATA-ADMIN-OPERATOR-ID FRENCHTEST.DIGV2",
+          pySkillRating: 0,
+        },
+      ],
+      pyReportToUserName: "",
+      pyReportTo: "",
+      pyOrganization: "DXIL",
+      pyTitle: "",
+      pyLabel: "frenchTest.DigV2",
+      pyEmailAddress: "User@DigV2",
+      pyTelephone: "",
+    },
+  },
+  status: 200,
+  statusText: "",
+  headers: {
+    "content-length": "435",
+    "content-type": "application/json;charset=UTF-8",
+  },
+  request: {},
+};
+
+export default operatorDetails;
+
+export const pyReviewRaw = {
+  name: "pyReview",
+  type: "View",
+  config: {
+    template: "Details",
+    ruleClass: "MyCo-MyCompon-Work-MyComponents",
+    showLabel: true,
+    label: "@L Details",
+    localeReference: "@LR MYCO-MYCOMPON-WORK-MYCOMPONENTS!VIEW!PYREVIEW",
+    showHighlightedData: true,
+    highlightedData: [
+      {
+        type: "TextInput",
+        config: {
+          value: "@P .pyStatusWork",
+          label: "@L Work Status",
+          displayMode: "STACKED_LARGE_VAL",
+          displayAsStatus: true,
+        },
+      },
+      {
+        type: "TextInput",
+        config: {
+          value: "@P .pyID",
+          label: "@L Case ID",
+          displayMode: "STACKED_LARGE_VAL",
+        },
+      },
+      {
+        type: "DateTime",
+        config: {
+          value: "@P .pxCreateDateTime",
+          label: "@L Create date/time",
+          displayMode: "STACKED_LARGE_VAL",
+        },
+      },
+      {
+        type: "UserReference",
+        config: {
+          label: "@L Create Operator",
+          value: "@USER .pxCreateOperator",
+          placeholder: "Select...",
+          displayMode: "STACKED_LARGE_VAL",
+        },
+      },
+    ],
+    inheritedProps: [
+      {
+        prop: "label",
+        value: "@L Details",
+      },
+      {
+        prop: "showLabel",
+        value: true,
+      },
+    ],
+  },
+  children: [
+    {
+      name: "A",
+      type: "Region",
+      getPConnect: () => {
+        return {
+          getRawMetadata: () => {
+            return pyReviewRaw.children[0];
+          },
+        };
+      },
+      children: [
+        {
+          readOnly: undefined,
+          placeholder: "First Name",
+          value: "John",
+          label: "First Name",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.firstname' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Middle Name",
+          value: "",
+          label: "Middle Name",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Last Name",
+          value: "Doe",
+          label: "Last Name",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.lastname' };
+              }
+            };
+          }
+        },
+        {
+          value: "john@doe.com",
+          label: "Email",
+          required: true,
+          testId: "CE8AE9DA5B7CD6C3DF2929543A9AF92D",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          value: "+16397975093",
+          label: "Phone",
+          displayMode: "LABELS_LEFT",
+          hasSuggestions: false,
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Price",
+          value: "90.99",
+          label: "Price",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {/* nothing */},
+              getStateProps: () => {
+                return {
+                  value: "",
+                };
+              },
+              getComponentName: () => {
+                return "currency";
+              },
+            };
+          },
+        },
+        {
+          readOnly: undefined,
+          value: "100 Mbps",
+          label: "Internet Plan",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {/* nothing */},
+              getStateProps: () => {
+                return {
+                  value: "",
+                };
+              },
+              getComponentName: () => {
+                return "radio";
+              },
+              getContextName: () => {
+                return 'app/primary_1';
+              },
+              getConfigProps: () => {
+                return {};
+              },
+              getDataObject: () => {
+                return {};
+              },
+              getLocaleRuleNameFromKeys: (localeClass, localeContext, localeName) => {
+                return `${localeClass}!${localeContext}!${localeName}`;
+              },
+              getCaseInfo: () => {
+                return {
+                  getClassName: () => {
+                    return 'DIXL-MediaCo-Work-NewService';
+                  }
+                };
+              },
+              getRawMetadata: () => {
+                return {};
+              },
+              getLocalizedValue: val => {
+                return val;
+              },
+            };
+          },
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Middle Name",
+          value: "",
+          label: "Middle Name",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Last Name",
+          value: "Doe",
+          label: "Last Name",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.lastname' };
+              }
+            };
+          }
+        },
+        {
+          value: "john@doe.com",
+          label: "Email",
+          required: true,
+          testId: "CE8AE9DA5B7CD6C3DF2929543A9AF92D",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          value: "+16397975093",
+          label: "Phone",
+          displayMode: "LABELS_LEFT",
+          hasSuggestions: false,
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {
+                return {
+                  updateFieldValue: () => {/* nothing */},
+                  triggerFieldChange: () => {/* nothing */}
+                };
+              },
+              getStateProps: () => {
+                return { value: '.middlename' };
+              }
+            };
+          }
+        },
+        {
+          readOnly: undefined,
+          placeholder: "Price",
+          value: "90.99",
+          label: "Price",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {/* nothing */},
+              getStateProps: () => {
+                return {
+                  value: "",
+                };
+              },
+              getComponentName: () => {
+                return "currency";
+              },
+            };
+          },
+        },
+        {
+          readOnly: undefined,
+          value: "100 Mbps",
+          label: "Internet Plan",
+          hasSuggestions: false,
+          displayMode: "LABELS_LEFT",
+          getPConnect: () => {
+            return {
+              getActionsApi: () => {/* nothing */},
+              getStateProps: () => {
+                return {
+                  value: "",
+                };
+              },
+              getComponentName: () => {
+                return "radio";
+              },
+              getContextName: () => {
+                return 'app/primary_1';
+              },
+              getConfigProps: () => {
+                return {};
+              },
+              getDataObject: () => {
+                return {};
+              },
+              getLocaleRuleNameFromKeys: (localeClass, localeContext, localeName) => {
+                return `${localeClass}!${localeContext}!${localeName}`;
+              },
+              getCaseInfo: () => {
+                return {
+                  getClassName: () => {
+                    return 'DIXL-MediaCo-Work-NewService';
+                  }
+                };
+              },
+              getRawMetadata: () => {
+                return {};
+              },
+              getLocalizedValue: val => {
+                return val;
+              },
+            };
+          },
+        },
+        {
+            label: "Update operator",
+            createLabel: "Created",
+            updateLabel: "Updated",
+            updateDateTime: "2023-03-10T12:53:04.670Z",
+            createDateTime: "2023-03-10T12:52:20.054Z",
+            updateOperator: {
+              userId: "User.DigV2",
+              userName: "User DigV2",
+            },
+            createOperator: {
+              userId: "User.DigV2",
+              userName: "User DigV2",
+            },
+        },
+      ],
+    },
+  ],
+  classID: "MyCo-MyCompon-Work-MyComponents",
+};

package/tests/assets/sdk-r/components/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnDetails/styles.js

@@ -0,0 +1,7 @@
+import styled, { css } from 'styled-components';
+
+export default styled.div(() => {
+  return css`
+    margin: 0px 0;
+  `;
+});

package/tests/assets/sdk-r/components/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnForm/TwoColumn.svg

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="100px" height="70px" viewBox="0 0 100 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>2-col  icon</title>
+    <g id="Views" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Artboard-Copy-2" transform="translate(-198.000000, -207.000000)">
+            <g id="2-col--icon" transform="translate(198.000000, 207.000000)">
+                <rect id="bg" stroke="#A5A8BC" stroke-width="0.5" fill="#E7E9EB" x="0.25" y="0.25" width="99.5" height="69.5"></rect>
+                <g id="white" transform="translate(3.000000, 3.000000)" fill="#FFFFFF">
+                    <rect id="Rectangle" x="0" y="0" width="94" height="66.5"></rect>
+                </g>
+                <g id="gray" transform="translate(6.000000, 6.000000)" fill="#8084A7">
+                    <rect id="Rectangle" x="0" y="0" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-18" x="0" y="11.7" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-19" x="0" y="23.4" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-20" x="0" y="35.1" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-21" x="0" y="46.8" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-22" x="0" y="58.5" width="42" height="5"></rect>
+                    <rect id="Rectangle-Copy" x="46" y="2.66453526e-15" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-27" x="46" y="11.7" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-26" x="46" y="23.4" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-25" x="46" y="35.1" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-24" x="46" y="46.8" width="42" height="7.8"></rect>
+                    <rect id="Rectangle-Copy-23" x="46" y="58.5" width="42" height="5"></rect>
+                </g>
+                <g id="labels" transform="translate(16.000000, 11.000000)">
+                    <circle id="Oval-Copy-3" fill="#FFFFFF" cx="10.5" cy="10.8076923" r="10.5"></circle>
+                    <text id="A" font-family="OpenSans-Semibold, Open Sans" font-size="11" font-weight="500" fill="#56566F">
+                        <tspan x="6.75" y="14">A</tspan>
+                    </text>
+                    <circle id="Oval-Copy-4" fill="#FFFFFF" cx="56.5" cy="10.8076923" r="10.5"></circle>
+                    <text id="B" font-family="OpenSans-Semibold, Open Sans" font-size="11" font-weight="500" fill="#56566F">
+                        <tspan x="52.75" y="14">B</tspan>
+                    </text>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/tests/assets/sdk-r/components/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnForm/config.json

@@ -0,0 +1,49 @@
+{
+  "name": "Pega_DXIL_MyTwoColumnForm",
+  "label": "My Two Column Form",
+  "description": "My Two Column Form",
+  "organization": "Pega",
+  "version": "0.0.1",
+  "library": "DXIL",
+  "allowedApplications": [],
+  "componentKey": "Pega_DXIL_MyTwoColumnForm",
+  "type": "Template",
+  "subtype": "FORM",
+  "icon": "TwoColumn.svg",
+  "properties": [
+    {
+      "name": "A",
+      "label": "Region A",
+      "format": "CONTENTPICKER"
+    },
+    {
+      "name": "B",
+      "label": "Region B",
+      "format": "CONTENTPICKER"
+    },
+    {
+      "label": "Conditions",
+      "format": "GROUP",
+      "properties": [
+        {
+          "name": "required",
+          "label": "Required",
+          "format": "REQUIRED",
+          "saveToReference": true
+        },
+        {
+          "name": "disabled",
+          "label": "Disabled",
+          "format": "DISABLED",
+          "saveToReference": true
+        },
+        {
+          "name": "visibility",
+          "label": "Visibility",
+          "format": "VISIBILITY",
+          "saveToReference": true
+        }
+      ]
+    }
+  ]
+}