@pega/custom-dx-components 0.23.41 → 0.23.43

package/package.json

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

package/src/tasks/create/templates/Constellation/Field/Date/index.tsx.mustache

@@ -4,7 +4,7 @@ import FormattedText from "./FormattedText";
 
 import type { PConnFieldProps } from './PConnProps';
 
-import StyledPegaDxilMyDateWrapper from './styles';
+import Styled{{COMPONENT_CLASS_NAME}}Wrapper from './styles';
 
 // includes in bundle
 import {
@@ -20,7 +20,7 @@ import { suggestionsHandler } from './suggestions-handler';
 import type { DateTimeFormat, DateTimeVariant } from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types.js';
 
 // interface for props
-interface PegaDxilMyDateProps extends PConnFieldProps {
+interface {{COMPONENT_CLASS_NAME}}Props extends PConnFieldProps {
   // If any, enter additional props that only exist on TextInput here
   displayAsStatus?: boolean;
   isTableFormatter?: boolean;
@@ -52,7 +52,7 @@ interface ActionsProps {
 
 // props passed in combination of props from property panel (config.json) and run time props from Constellation
 // any default values in config.pros should be set in defaultProps at bottom of this file
-function PegaDxilMyDate (props: PegaDxilMyDateProps)  {
+function {{COMPONENT_CLASS_NAME}} (props: {{COMPONENT_CLASS_NAME}}Props)  {
   const {
     getPConnect,
     value,
@@ -175,29 +175,29 @@ function PegaDxilMyDate (props: PegaDxilMyDateProps)  {
     );
     switch(displayMode){
       case 'DISPLAY_ONLY': {
-        return ( <StyledPegaDxilMyDateWrapper> displayComp </StyledPegaDxilMyDateWrapper>);
+        return ( <Styled{{COMPONENT_CLASS_NAME}}Wrapper> displayComp </Styled{{COMPONENT_CLASS_NAME}}Wrapper>);
       }
       case "LABELS_LEFT" : {
         return (
-          <StyledPegaDxilMyDateWrapper>
+          <Styled{{COMPONENT_CLASS_NAME}}Wrapper>
           <FieldValueList
             variant={hideLabel ? "stacked" : variant}
             data-testid={testId}
             fields={[{ id: '1', name: hideLabel ? "" :label, value: displayComp }]}
           />
-          </StyledPegaDxilMyDateWrapper>
+          </Styled{{COMPONENT_CLASS_NAME}}Wrapper>
 
         );
       }
       case "STACKED_LARGE_VAL" : {
         return (
-          <StyledPegaDxilMyDateWrapper>
+          <Styled{{COMPONENT_CLASS_NAME}}Wrapper>
           <FieldValueList
             variant='stacked'
             data-testid={testId}
             fields={[{ id: '2', name: hideLabel ? "" :label, value: <Text variant='h1' as='span'>{displayComp}</Text> }]}
           />
-          </StyledPegaDxilMyDateWrapper>
+          </Styled{{COMPONENT_CLASS_NAME}}Wrapper>
 
         );
       }
@@ -216,7 +216,7 @@ function PegaDxilMyDate (props: PegaDxilMyDateProps)  {
       fieldType: 'Date'
     };
     dateComponent = (
-      <StyledPegaDxilMyDateWrapper>
+      <Styled{{COMPONENT_CLASS_NAME}}Wrapper>
         <FormattedText
           formatType='date'
           value={value}
@@ -227,12 +227,12 @@ function PegaDxilMyDate (props: PegaDxilMyDateProps)  {
           // @ts-ignore
           customFormat={getDateFormat(locale)}
         />
-      </StyledPegaDxilMyDateWrapper>
+      </Styled{{COMPONENT_CLASS_NAME}}Wrapper>
     );
   } else {
 
     dateComponent = (
-      <StyledPegaDxilMyDateWrapper>
+      <Styled{{COMPONENT_CLASS_NAME}}Wrapper>
       <DateInput
         {...additionalProps}
         label={label}
@@ -252,11 +252,11 @@ function PegaDxilMyDate (props: PegaDxilMyDateProps)  {
         onBlur={handleBlur}
         onResolveSuggestion={onResolveSuggestionHandler}
       />
-      </StyledPegaDxilMyDateWrapper>
+      </Styled{{COMPONENT_CLASS_NAME}}Wrapper>
     );
   }
   return dateComponent;
 }
 
 
-export default withConfiguration(PegaDxilMyDate);
+export default withConfiguration({{COMPONENT_CLASS_NAME}});

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

@@ -1,7 +1,7 @@
 
 /* eslint-disable react/jsx-no-useless-fragment */
 // @ts-nocheck
-import { withKnobs } from '@storybook/addon-knobs';
+import type { Meta, StoryObj } from '@storybook/react';
 
 import {{COMPONENT_CLASS_NAME}} from './index';
 

package/src/tasks/create/templates/Constellation/Template/DETAILS/demo.stories.tsx.mustache

@@ -3,7 +3,7 @@
 // @ts-nocheck
 import type { Meta, StoryObj } from '@storybook/react';
 import { Text, FieldValueList, Button, DateTimeDisplay, useTheme } from '@pega/cosmos-react-core';
-import PegaDxilMyDetails from './index';
+import {{COMPONENT_CLASS_NAME}} from './index';
 import { pyReviewRaw, pyReviewResolved, regionChildrenResolved } from './mock';
 import StatusWorkRenderer from './StatusWork';
 

package/src/tasks/init/template/package.json.mustache

@@ -69,11 +69,10 @@
   },
   "devDependencies": {
     "@pega/configs": "^0.6.0",
-    "@pega/custom-dx-components": "0.23.41",
+    "@pega/custom-dx-components": "0.23.43",
     "@pega/pcore-pconnect-typedefs": "~2.1.1",
     "@storybook/addon-actions": "^7.6.7",
     "@storybook/addon-essentials": "^7.6.7",
-    "@storybook/addon-knobs": "^7.0.2",
     "@storybook/addon-links": "^7.6.7",
     "@storybook/addon-storysource": "^7.6.7",
     "@storybook/react": "^7.6.7",

package/tests/assets/components/createAll/Constellation/Pega_DXIL_MyTextInput/demo.stories.tsx

@@ -1,7 +1,7 @@
 
 /* eslint-disable react/jsx-no-useless-fragment */
 // @ts-nocheck
-import { withKnobs } from '@storybook/addon-knobs';
+import type { Meta, StoryObj } from '@storybook/react';
 
 import PegaDxilMyTextInput from './index';
 

package/tests/assets/components/createAll/Launchpad/Pega_DXIL_MyTextInput/demo.stories.tsx

@@ -1,7 +1,7 @@
 
 /* eslint-disable react/jsx-no-useless-fragment */
 // @ts-nocheck
-import { withKnobs } from '@storybook/addon-knobs';
+import type { Meta, StoryObj } from '@storybook/react';
 
 import PegaDxilMyTextInput from './index';