@pega/custom-dx-components 2.0.18 → 2.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/custom-dx-components",
-  "version": "2.0.18",
+  "version": "2.0.20",
   "description": "Utility for building custom UI components",
   "bin": "./bin/index.js",
   "scripts": {

package/src/tasks/create/index.js

@@ -175,15 +175,15 @@ const validateCompile = async (
 export default async options => {
   showVersion();
 
-  if (options.params[10]) {
-    const componentName = options.params[3];
-    const componentLabel = options.params[4];
-    const library = options.params[5];
-    const version = options.params[6];
-    const framework = options.params[7];
-    const type = options.params[8];
-    const subtype = options.params[9];
-    const description = options.params[10];
+  if (options.params[9]) {
+
+    const type = options.params[3];
+    const subtype = options.params[4];
+    const componentName = options.params[5];
+    const componentLabel = options.params[6];
+    const library = options.params[7];
+    const version = options.params[9];
+    const description = options.params[9];
 
     await validateCompile(
       {
@@ -201,6 +201,50 @@ export default async options => {
   } else {
     const componentDefaults = await getComponentDefaults();
     const questions = [
+      {
+        name: 'type',
+        type: 'rawlist',
+        message: 'Enter type of component',
+        default: componentDefaults.type,
+        choices: COMPONENT_SCHEMA.type
+      },
+      {
+        name: 'subtype',
+        type: 'rawlist',
+        message: 'Enter subtype of component',
+        default: componentDefaults.subtype,
+        choices: COMPONENT_SCHEMA.subtype.field,
+        when(answers) {
+          return answers.type === 'Field';
+        }
+      },
+      {
+        name: 'subtype',
+        type: 'rawlist',
+        message: 'Enter subtype of component',
+        default: componentDefaults.subtype,
+        choices: COMPONENT_SCHEMA.subtype.template,
+        when(answers) {
+          return answers.type === 'Template';
+        }
+      },
+      {
+        name: 'subtype',
+        type: 'rawlist',
+        message: 'Enter subtype of component',
+        default: [componentDefaults.subtype || COMPONENT_SCHEMA.subtype.widget[0]],
+        choices: COMPONENT_SCHEMA.subtype.widget,
+        when(answers) {
+          return answers.type === 'Widget';
+        },
+        validate: value => {
+          /* value should not be empty */
+          if (Array.isArray(value) && value.length) {
+            return true;
+          }
+          return 'Please select subtype';
+        }
+      },
       {
         name: 'componentName',
         message: 'Enter component name (required)',
@@ -258,57 +302,6 @@ export default async options => {
         message: 'Please enter the application names to be supported (comma-separated). ',
         suffix: 'Keep empty for all applications'
       },
-      // {
-      //   name: 'framework',
-      //   type: 'rawlist',
-      //   message: 'Enter framework a',
-      //   default: 'COSMOS_React',
-      //   choices: COMPONENT_SCHEMA.framework
-      // },
-      {
-        name: 'type',
-        type: 'rawlist',
-        message: 'Enter type of component',
-        default: componentDefaults.type,
-        choices: COMPONENT_SCHEMA.type
-      },
-      {
-        name: 'subtype',
-        type: 'rawlist',
-        message: 'Enter subtype of component',
-        default: componentDefaults.subtype,
-        choices: COMPONENT_SCHEMA.subtype.field,
-        when(answers) {
-          return answers.type === 'Field';
-        }
-      },
-      {
-        name: 'subtype',
-        type: 'rawlist',
-        message: 'Enter subtype of component',
-        default: componentDefaults.subtype,
-        choices: COMPONENT_SCHEMA.subtype.template,
-        when(answers) {
-          return answers.type === 'Template';
-        }
-      },
-      {
-        name: 'subtype',
-        type: 'rawlist',
-        message: 'Enter subtype of component',
-        default: [componentDefaults.subtype || COMPONENT_SCHEMA.subtype.widget[0]],
-        choices: COMPONENT_SCHEMA.subtype.widget,
-        when(answers) {
-          return answers.type === 'Widget';
-        },
-        validate: value => {
-          /* value should not be empty */
-          if (Array.isArray(value) && value.length) {
-            return true;
-          }
-          return 'Please select subtype';
-        }
-      },
       {
         name: 'description',
         message: 'Enter description for the component',

package/src/tasks/create/templates/Constellation/Field/Boolean/demo.stories.jsx.mustache

@@ -12,6 +12,7 @@ export default {
 };
 
 export const base{{COMPONENT_CLASS_NAME}} = () => {
+  // eslint-disable-next-line react-hooks/rules-of-hooks
   const [value, setValue] = useState(configProps.value);
 
   const props = {

package/src/tasks/create/templates/Constellation/Field/Date/demo.stories.jsx.mustache

@@ -1,4 +1,4 @@
-import { withKnobs, text, boolean } from '@storybook/addon-knobs';
+import { withKnobs } from '@storybook/addon-knobs';
 import { configProps, stateProps } from './mock.stories';
 import {{COMPONENT_CLASS_NAME}} from './index.jsx';
 
@@ -26,8 +26,13 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
       return {
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
+          };
+        },
+        getValidationApi: () => {
+          return {
+            validate: () => {/* nothing */}
           };
         },
         getStateProps: () => {
@@ -36,9 +41,9 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         getConfigProps: () => {
           return configProps;
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        clearErrorMessages: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        clearErrorMessages: () => {/* nothing */}
       };
     },
     value: configProps.value,

package/src/tasks/create/templates/Constellation/Field/DateTime/demo.stories.jsx.mustache

@@ -1,5 +1,4 @@
-import { useState } from 'react';
-import { withKnobs, text, boolean } from '@storybook/addon-knobs';
+import { withKnobs } from '@storybook/addon-knobs';
 import { configProps, stateProps } from './mock.stories';
 import {{COMPONENT_CLASS_NAME}} from './index.jsx';
 
@@ -27,8 +26,13 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
       return {
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
+          };
+        },
+        getValidationApi: () => {
+          return {
+            validate: () => {/* nothing */}
           };
         },
         getStateProps: () => {
@@ -37,9 +41,9 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         getConfigProps: () => {
           return configProps;
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        clearErrorMessages: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        clearErrorMessages: () => {/* nothing */}
       };
     },
     value: configProps.value,

package/src/tasks/create/templates/Constellation/Field/Decimal/demo.stories.jsx.mustache

@@ -20,7 +20,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     showGroupSeparators: configProps.showGroupSeparators,
     hasSuggestions: configProps.hasSuggestions,
     testId: configProps.testId,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -29,14 +29,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Decimal-Currency/demo.stories.jsx.mustache

@@ -13,7 +13,7 @@ export default {
 export const base{{COMPONENT_CLASS_NAME}} = () => {
 
   const props = {
-    value: configProps.value,
+    value: Number(configProps.value),
     placeholder: configProps.placeholder,
     label: configProps.label,
     helperText: configProps.helperText,
@@ -23,7 +23,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     alwaysShowISOCode: configProps.alwaysShowISOCode,
     hasSuggestions: configProps.hasSuggestions,
     testId: configProps.testId,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -32,14 +32,15 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */},
+        clearErrorMessages: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Decimal-Percentage/demo.stories.jsx.mustache

@@ -20,7 +20,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     showGroupSeparators: configProps.showGroupSeparators,
     hasSuggestions: configProps.hasSuggestions,
     testId: configProps.testId,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -29,14 +29,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Integer/demo.stories.jsx.mustache

@@ -20,7 +20,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     showGroupSeparators: configProps.showGroupSeparators,
     hasSuggestions: configProps.hasSuggestions,
     testId: configProps.testId,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -29,14 +29,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Picklist/demo.stories.jsx.mustache

@@ -12,6 +12,7 @@ export default {
 };
 
 export const base{{COMPONENT_CLASS_NAME}} = () => {
+  // eslint-disable-next-line react-hooks/rules-of-hooks
   const [value, setValue] = useState(configProps.value);
 
   const props = {
@@ -22,7 +23,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     datasource: configProps.datasource,
     testId: configProps.testId,
     hasSuggestions: configProps.hasSuggestions,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -32,8 +33,8 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         getStateProps: () => {
           return stateProps;
         },
-        getLocalizedValue: value => {
-          return value;
+        getLocalizedValue: val => {
+          return val;
         },
         getLocaleRuleNameFromKeys: (localeClass, localeContext, localeName) => {
           return `${localeClass}!${localeContext}!${localeName}`;
@@ -50,16 +51,21 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: (propName, value) => {
-              setValue(value);
+            updateFieldValue: (propName, theValue) => {
+              setValue(theValue);
             },
-            triggerFieldChange: () => {}
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        getValidationApi: () => {
+          return {
+            validate: () => {/* nothing */}
+          };
+        },
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text/demo.stories.jsx.mustache

@@ -12,7 +12,7 @@ export default {
 };
 
 export const base{{COMPONENT_CLASS_NAME}} = () => {
-
+  // eslint-disable-next-line react-hooks/rules-of-hooks
   const [value, setValue] = useState(configProps.value);
 
   const props = {
@@ -29,14 +29,16 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: (propName, theValue) => {
+              setValue(theValue);
+            },
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text-Email/demo.stories.jsx.mustache

@@ -1,4 +1,4 @@
-import { withKnobs, text, boolean } from '@storybook/addon-knobs';
+import { withKnobs } from '@storybook/addon-knobs';
 
 import {{COMPONENT_CLASS_NAME}} from './index.jsx';
 
@@ -19,7 +19,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     helperText: configProps.helperText,
     testId: configProps.testId,
     hasSuggestions: configProps.hasSuggestions,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -28,14 +28,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text-Input/demo.stories.jsx.mustache

@@ -19,7 +19,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     helperText: configProps.helperText,
     testId: configProps.testId,
     hasSuggestions: configProps.hasSuggestions,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -28,14 +28,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text-Paragraph/demo.stories.jsx.mustache

@@ -19,7 +19,7 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
     helperText: configProps.helperText,
     testId: configProps.testId,
     hasSuggestions: configProps.hasSuggestions,
-    fieldMetadata: fieldMetadata,
+    fieldMetadata,
 
     getPConnect: () => {
       return {
@@ -28,14 +28,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text-Phone/demo.stories.jsx.mustache

@@ -26,14 +26,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };

package/src/tasks/create/templates/Constellation/Field/Text-Phone/index.jsx.mustache

@@ -245,7 +245,7 @@ const {{COMPONENT_CLASS_NAME}} = props => {
 {{COMPONENT_CLASS_NAME}}.propTypes = {
   value: PropTypes.string,
   placeholder: PropTypes.string,
-  datasource: PropTypes.node,
+  datasource: PropTypes.objectOf(PropTypes.any),
   label: PropTypes.string.isRequired,
   hideLabel: PropTypes.bool,
   getPConnect: PropTypes.func.isRequired,

package/src/tasks/create/templates/Constellation/Field/Text-URL/demo.stories.jsx.mustache

@@ -26,14 +26,14 @@ export const base{{COMPONENT_CLASS_NAME}} = () => {
         },
         getActionsApi: () => {
           return {
-            updateFieldValue: () => {},
-            triggerFieldChange: () => {}
+            updateFieldValue: () => {/* nothing */},
+            triggerFieldChange: () => {/* nothing */}
           };
         },
-        ignoreSuggestion: () => {},
-        acceptSuggestion: () => {},
-        setInheritedProps: () => {},
-        resolveConfigProps: () => {}
+        ignoreSuggestion: () => {/* nothing */},
+        acceptSuggestion: () => {/* nothing */},
+        setInheritedProps: () => {/* nothing */},
+        resolveConfigProps: () => {/* nothing */}
       };
     }
   };