@pega/custom-dx-components 2.0.14 → 2.0.16

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/StatusWork.jsx.mustache

@@ -1,26 +0,0 @@
-import { Status } from "@pega/cosmos-react-core";
-
-export default function StatusWorkRenderer({ value }) {
-  let variant = "info";
-
-  const warnStrings = ["fail", "cancel", "reject", "revoke", "stopped", "warn"];
-  const infoStrings = ["open", "hold", "info", "new"];
-  const successStrings = ["resolved", "completed", "success"];
-  const pendingStrings = ["pending"];
-
-  if (new RegExp(warnStrings.join("|"), "i").test(value)) {
-    variant = "warn";
-  } else if (new RegExp(infoStrings.join("|"), "i").test(value)) {
-    variant = "info";
-  } else if (new RegExp(successStrings.join("|"), "i").test(value)) {
-    variant = "success";
-  } else if (new RegExp(pendingStrings.join("|"), "i").test(value)) {
-    variant = "pending";
-  }
-
-  return (
-    <Status type="rectangle" variant={variant}>
-      {value}
-    </Status>
-  );
-}

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/demo.stories.jsx.mustache

@@ -1,118 +0,0 @@
-import { Text, FieldValueList, Button, DateTimeDisplay, useTheme } from '@pega/cosmos-react-core';
-import {{COMPONENT_CLASS_NAME}} from './index';
-import { pyReviewRaw, pyReviewResolved, regionChildrenResolved } from './mock.stories';
-import StatusWorkRenderer from './StatusWork.jsx';
-
-export default {
-  title: '{{COMPONENT_CLASS_NAME}}',
-  component: {{COMPONENT_CLASS_NAME}}
-};
-
-const Template = args => {
-  const regionAChildren = pyReviewRaw.children[0].children.map(child => {
-    return Primary.args.getPConnect().createComponent(child);
-  });
-  const regionBChildren = pyReviewRaw.children[1].children.map(child => {
-    return Primary.args.getPConnect().createComponent(child);
-  });
-
-  return (
-    <{{COMPONENT_CLASS_NAME}} {...args}>
-      {regionAChildren}
-      {regionBChildren}
-    </{{COMPONENT_CLASS_NAME}}>
-  );
-};
-
-export const Primary = Template.bind({});
-
-Primary.args = {
-  template: 'MyCo_MyComponents_NewDetailsTemplate',
-  showHighlightedData: true,
-  label: 'Test Details',
-  showLabel: true,
-  getPConnect: () => {
-    return {
-      getChildren: () => {
-        return pyReviewRaw.children;
-      },
-      getRawMetadata: () => {
-        return pyReviewRaw;
-      },
-      getInheritedProps: () => {
-        return pyReviewRaw.config.inheritedProps;
-      },
-      createComponent: config => {
-        switch (config.config.value) {
-          case '@P .pyStatusWork':
-            return renderField(pyReviewResolved.highlightedData[0].config);
-          case '@P .pyID':
-            return renderField(pyReviewResolved.highlightedData[1].config);
-          case '@P .pxCreateDateTime':
-            return renderField(pyReviewResolved.highlightedData[2].config);
-          case '@USER .pxCreateOperator':
-            return renderField(pyReviewResolved.highlightedData[3].config);
-          case '@P .pySLADeadline':
-            return renderField(regionChildrenResolved[0]);
-          case '@P .pySLAGoal':
-            return renderField(regionChildrenResolved[1]);
-          case '@P .pySLAStartTime':
-            return renderField(regionChildrenResolved[2]);
-        }
-      },
-      setInheritedProp: () => {},
-      resolveConfigProps: () => {}
-    };
-  }
-};
-
-const renderField = resolvedProps => {
-  const {
-    displayAsStatus = false,
-    displayMode,
-    value = '',
-    label = '',
-    theme = useTheme()
-  } = resolvedProps;
-
-  const variant = displayMode === 'LABELS_LEFT' ? 'inline' : 'stacked';
-
-  let val =
-    value != '' ? (
-      <Text variant='h1' as='span'>
-        {value}
-      </Text>
-    ) : (
-      ''
-    );
-
-  if (label === 'Create date/time')
-    val = <DateTimeDisplay value={value} variant='datetime' format='long' clockFormat={null} />;
-
-  if (displayAsStatus === true) val = <StatusWorkRenderer value={value} />;
-
-  if (label === 'Create Operator')
-    val = (
-      <Button
-        variant='link'
-        style={
-          label !== null
-            ? { width: 'max-content', height: theme.components.input.height }
-            : undefined
-        }
-      >
-        {value.userName}
-      </Button>
-    );
-
-  if (variant === 'inline') {
-    val = value || <span aria-hidden='true'>&ndash;&ndash;</span>;
-  } else {
-    val = (
-      <Text variant='h1' as='span'>
-        {val}
-      </Text>
-    );
-  }
-  return <FieldValueList variant={variant} fields={[{ name: label, value: val }]} />;
-};

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/mock.stories.js.mustache

@@ -1,215 +0,0 @@
-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: [
-        {
-          type: 'DateTime',
-          config: {
-            value: '@P .pySLADeadline',
-            label: '@L SLA Deadline'
-          }
-        },
-        {
-          type: 'DateTime',
-          config: {
-            value: '@P .pySLAGoal',
-            label: '@L SLA Goal'
-          }
-        },
-        {
-          type: 'RadioButtons',
-          config: {
-            value: '@P .pySLAStartTime',
-            label: '@L SLA Start Time',
-            listType: 'associated',
-            datasource: '@ASSOCIATED .pySLAStartTime'
-          }
-        }
-      ]
-    },
-    {
-      name: 'B',
-      type: 'Region',
-      getPConnect: () => {
-        return {
-          getRawMetadata: () => {
-            return pyReviewRaw.children[0];
-          }
-        };
-      },
-      children: [
-        {
-          type: 'DateTime',
-          config: {
-            value: '@P .pySLADeadline',
-            label: '@L SLA Deadline'
-          }
-        },
-        {
-          type: 'DateTime',
-          config: {
-            value: '@P .pySLAGoal',
-            label: '@L SLA Goal'
-          }
-        },
-        {
-          type: 'RadioButtons',
-          config: {
-            value: '@P .pySLAStartTime',
-            label: '@L SLA Start Time',
-            listType: 'associated',
-            datasource: '@ASSOCIATED .pySLAStartTime'
-          }
-        }
-      ]
-    }
-  ],
-  classID: 'MyCo-MyCompon-Work-MyComponents'
-};
-
-export const pyReviewResolved = {
-  readOnly: true,
-  template: 'Details',
-  ruleClass: 'MyCo-MyCompon-Work-MyComponents',
-  showLabel: true,
-  label: 'Details',
-  localeReference: 'MYCO-MYCOMPON-WORK-MYCOMPONENTS!VIEW!PYREVIEW',
-  showHighlightedData: true,
-  highlightedData: [
-    {
-      type: 'TextInput',
-      config: {
-        value: 'New',
-        label: 'Work Status',
-        displayMode: 'STACKED_LARGE_VAL',
-        displayAsStatus: true
-      }
-    },
-    {
-      type: 'TextInput',
-      config: {
-        value: 'M-1002',
-        label: 'Case ID',
-        displayMode: 'STACKED_LARGE_VAL'
-      }
-    },
-    {
-      type: 'DateTime',
-      config: {
-        value: '2022-12-11T20:06:27.232Z',
-        label: 'Create date/time',
-        displayMode: 'STACKED_LARGE_VAL'
-      }
-    },
-    {
-      type: 'UserReference',
-      config: {
-        label: 'Create Operator',
-        value: {
-          userId: 'riddn',
-          userName: 'Niall Riddell'
-        },
-        placeholder: 'Select...',
-        displayMode: 'STACKED_LARGE_VAL'
-      }
-    }
-  ],
-  displayMode: 'LABELS_LEFT'
-};
-
-export const regionChildrenResolved = [
-  {
-    readOnly: true,
-    value: '',
-    label: 'SLA Deadline',
-    displayMode: 'LABELS_LEFT'
-  },
-  {
-    readOnly: true,
-    value: '',
-    label: 'SLA Goal',
-    displayMode: 'LABELS_LEFT'
-  },
-  {
-    readOnly: true,
-    value: '',
-    label: 'SLA Start Time',
-    listType: 'associated',
-    datasource: [
-      {
-        key: 'AssignmentCreation',
-        value: 'The creation time of the Assignment'
-      },
-      {
-        key: 'CurrentTime',
-        value: 'Current Date Time'
-      }
-    ],
-    displayMode: 'LABELS_LEFT'
-  }
-];

package/src/tasks/create/templates/Constellation/Template/FORM/demo.stories.jsx.mustache

@@ -1,89 +0,0 @@
-import { withKnobs } from '@storybook/addon-knobs';
-
-import {{COMPONENT_CLASS_NAME}} from './index.jsx';
-import { DateInput, Input, FieldValueList, Text } from '@pega/cosmos-react-core';
-import { PhoneInput as CosmosPhone } from '@pega/cosmos-react-core';
-import { pyReviewRaw, regionChildrenResolved } from './mock.stories';
-
-export default {
-  title: '{{COMPONENT_CLASS_NAME}}',
-  decorators: [withKnobs],
-  component: {{COMPONENT_CLASS_NAME}}
-};
-
-const Template = args => {
-  const regionAChildren = pyReviewRaw.children[0].children.map(child => {
-    return Primary.args.getPConnect().createComponent(child);
-  });
-
-  return <{{COMPONENT_CLASS_NAME}} {...args}>{regionAChildren}</{{COMPONENT_CLASS_NAME}}>;
-};
-
-export const Primary = Template.bind({});
-
-Primary.args = {
-  NumCols: 1,
-  template: 'DefaultForm',
-  getPConnect: () => {
-    return {
-      getChildren: () => {
-        return pyReviewRaw.children;
-      },
-      createComponent: config => {
-        switch (config.config.value) {
-          case '@P .FirstName':
-            return renderField(regionChildrenResolved[0]);
-          case '@P .MiddleName':
-            return renderField(regionChildrenResolved[1]);
-          case '@P .LastName':
-            return renderField(regionChildrenResolved[2]);
-          case '@P .Email':
-            return renderField(regionChildrenResolved[3]);
-          case '@P .PhoneNumber':
-            return renderField(regionChildrenResolved[4]);
-          case '@P .ServiceDate':
-            return renderField(regionChildrenResolved[5]);
-        }
-      }
-    };
-  }
-};
-
-const renderField = resolvedProps => {
-  const { displayMode, value = '', label = '' } = resolvedProps;
-
-  const variant = displayMode === 'LABELS_LEFT' ? 'inline' : 'stacked';
-
-  let val =
-    value != '' ? (
-      <Text variant='h1' as='span'>
-        {value}
-      </Text>
-    ) : (
-      ''
-    );
-
-{{! pick new delimiteres for mustache }}
-{{=<% %>=}}
-
-  if (label === 'Service Date') val = <DateInput value={value} style={{ fontSize: '14px' }}></DateInput>;
-
-  if (label === 'Email') val = <Input type='email' value={value} style={{ fontSize: '14px' }}></Input>;
-
-  if (label === 'First Name' || label === 'Last Name' || label === 'Middle Name')
-    val = <Input value={value} style={{ fontSize: '14px' }}></Input>;
-
-  if (label === 'Phone Number') val = <CosmosPhone value={value} style={{ fontSize: '14px' }}></CosmosPhone>;
-<%={{ }}=%>     {{! revert delimiteres for mustache }}
-
-  if (variant === 'inline') {
-    val = value || <span aria-hidden='true'>&ndash;&ndash;</span>;
-  } else {
-    val = (
-      <Text variant='h1' as='span'>
-        {val}
-      </Text>
-    );
-  }
-  return <FieldValueList variant={variant} fields={[{ name: label, value: val }]} />;
-};

package/src/tasks/create/templates/Constellation/Template/FORM/mock.stories.js.mustache

@@ -1,125 +0,0 @@
-export const pyReviewRaw = {
-  name: 'CollectInformation',
-  type: 'View',
-  config: {
-    template: 'DefaultForm',
-    ruleClass: 'OM5W9U-SampleApp-Work-Test',
-    localeReference: '@LR OM5W9U-SAMPLEAPP-WORK-TEST!VIEW!COLLECTINFORMATION',
-    context: '@P .pyViewContext'
-  },
-  children: [
-    {
-      name: 'Fields',
-      type: 'Region',
-      children: [
-        {
-          type: 'TextInput',
-          config: {
-            value: '@P .FirstName',
-            label: '@L First Name'
-          }
-        },
-        {
-          type: 'TextInput',
-          config: {
-            value: '@P .MiddleName',
-            label: '@L Middle Name'
-          }
-        },
-        {
-          type: 'TextInput',
-          config: {
-            value: '@P .LastName',
-            label: '@L Last Name'
-          }
-        },
-        {
-          type: 'Email',
-          config: {
-            value: '@P .Email',
-            label: '@L Email'
-          }
-        },
-        {
-          type: 'Phone',
-          config: {
-            value: '@P .PhoneNumber',
-            label: '@L Phone Number',
-            datasource: {
-              source: '@DATASOURCE D_pyCountryCallingCodeList.pxResults',
-              fields: {
-                value: '@P .pyCallingCode'
-              }
-            }
-          }
-        },
-        {
-          type: 'Date',
-          config: {
-            value: '@P .ServiceDate',
-            label: '@L Service Date'
-          }
-        }
-      ]
-    }
-  ],
-  classID: 'OM5W9U-SampleApp-Work-Test'
-};
-
-export const regionChildrenResolved = [
-  {
-    readOnly: undefined,
-    value: 'John',
-    label: 'First Name',
-    hasSuggestions: false
-  },
-  {
-    readOnly: undefined,
-    value: '',
-    label: 'Middle Name',
-    hasSuggestions: false
-  },
-  {
-    readOnly: undefined,
-    value: 'Doe',
-    label: 'Last Name',
-    hasSuggestions: false
-  },
-  {
-    readOnly: undefined,
-    value: 'John@doe.com',
-    label: 'Email',
-    hasSuggestions: false
-  },
-  {
-    readOnly: undefined,
-    value: '+16397975093',
-    label: 'Phone Number',
-    datasource: {
-      fields: {
-        value: undefined
-      },
-      source: [
-        {
-          value: '+1'
-        },
-        {
-          value: '+91'
-        },
-        {
-          value: '+48'
-        },
-        {
-          value: '+44'
-        }
-      ]
-    },
-    hasSuggestions: false
-  },
-  {
-    readOnly: undefined,
-    value: '2023-01-25',
-    label: 'Service Date',
-    hasSuggestions: false
-  }
-];

package/src/tasks/create/templates/Constellation/Template/FORM-region/demo.stories.jsx.mustache

@@ -1,92 +0,0 @@
-import { withKnobs } from '@storybook/addon-knobs';
-
-import {{COMPONENT_CLASS_NAME}} from './index.jsx';
-import { DateInput, Input, FieldValueList, Text } from '@pega/cosmos-react-core';
-import { PhoneInput as CosmosPhone } from '@pega/cosmos-react-core';
-import { pyReviewRaw, regionChildrenResolved } from './mock.stories';
-
-export default {
-  title: '{{COMPONENT_CLASS_NAME}}',
-  decorators: [withKnobs],
-  component: {{COMPONENT_CLASS_NAME}}
-};
-
-const Template = args => {
-  const regionAChildren = pyReviewRaw.children[0].children.map(child => {
-    return Primary.args.getPConnect().createComponent(child);
-  });
-
-  return <{{COMPONENT_CLASS_NAME}} {...args}>{regionAChildren}</{{COMPONENT_CLASS_NAME}}>;
-};
-
-export const Primary = Template.bind({});
-
-Primary.args = {
-  template: 'DefaultForm',
-  getPConnect: () => {
-    return {
-      getChildren: () => {
-        return pyReviewRaw.children;
-      },
-      createComponent: config => {
-        switch (config.config.value) {
-          case '@P .FirstName':
-            return renderField(regionChildrenResolved[0]);
-          case '@P .MiddleName':
-            return renderField(regionChildrenResolved[1]);
-          case '@P .LastName':
-            return renderField(regionChildrenResolved[2]);
-          case '@P .Email':
-            return renderField(regionChildrenResolved[3]);
-          case '@P .PhoneNumber':
-            return renderField(regionChildrenResolved[4]);
-          case '@P .ServiceDate':
-            return renderField(regionChildrenResolved[5]);
-        }
-      }
-    };
-  }
-};
-
-const renderField = resolvedProps => {
-  const { displayMode, value = '', label = '' } = resolvedProps;
-
-  const variant = displayMode === 'LABELS_LEFT' ? 'inline' : 'stacked';
-
-  let val =
-    value != '' ? (
-      <Text variant='h1' as='span'>
-        {value}
-      </Text>
-    ) : (
-      ''
-    );
-
-{{! pick new delimiteres for mustache }}
-{{=<% %>=}}
-
-  if (label === 'Service Date')
-    val = <DateInput value={value} style={{ fontSize: '14px' }}></DateInput>;
-
-  if (label === 'Email')
-    val = <Input type='email' value={value} style={{ fontSize: '14px' }}></Input>;
-
-  if (label === 'First Name' || label === 'Last Name' || label === 'Middle Name')
-    val = <Input value={value} style={{ fontSize: '14px' }}></Input>;
-
-  if (label === 'Phone Number')
-    val = <CosmosPhone value={value} style={{ fontSize: '14px' }}></CosmosPhone>;
-
-<%={{ }}=%>     {{! revert delimiteres for mustache }}
-
-  if (variant === 'inline') {
-    val = value || <span aria-hidden='true'>&ndash;&ndash;</span>;
-  } else {
-    val = (
-      <Text variant='h1' as='span'>
-        {val}
-      </Text>
-    );
-  }
-  return <FieldValueList variant={variant} fields={[{ name: label, value: val }]} />;
-};