@pega/dx-component-builder-sdk 0.24.2 → 0.24.3

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

@@ -1,132 +1,131 @@
 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'
+  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: 'A',
+      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'
+          }
+        }
+      ]
     },
-    children: [
-      {
-        name: 'A',
-        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'
-            }
+    {
+      name: 'B',
+      type: 'Region',
+      children: [
+        {
+          type: 'Email',
+          config: {
+            value: '@P .Email',
+            label: '@L Email'
           }
-        ]
-      },
-      {
-        name: 'B',
-        type: 'Region',
-        children: [
-          {
-            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: '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: 'Din',
-      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'
+        {
+          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: 'Din',
+    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
       },
-      hasSuggestions: false
+      source: [
+        {
+          value: '+1'
+        },
+        {
+          value: '+91'
+        },
+        {
+          value: '+48'
+        },
+        {
+          value: '+44'
+        }
+      ]
     },
-    {
-      readOnly: undefined,
-      value: '2023-01-25',
-      label: 'Service Date',
-      hasSuggestions: false
-    }
-  ];
-  
+    hasSuggestions: false
+  },
+  {
+    readOnly: undefined,
+    value: '2023-01-25',
+    label: 'Service Date',
+    hasSuggestions: false
+  }
+];

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyCaseWidget/config.json

@@ -11,13 +11,13 @@
   "subtype": "CASE",
   "icon": "OneColumnPage.svg",
   "properties": [
-   {
+    {
       "name": "label",
       "label": "Label value",
       "format": "TEXT"
     }
   ],
   "defaultConfig": {
-     "label": "@L My Case Widget"
+    "label": "@L My Case Widget"
   }
 }

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyCaseWidget/demo.stories.tsx

@@ -33,7 +33,6 @@ export default meta;
 type Story = StoryObj<typeof PegaDxilMyCaseWidget>;
 
 export const BasePegaDxilMyCaseWidget: Story = args => {
-
   const props = {
     label: 'Case history',
 

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyCaseWidget/index.tsx

@@ -151,9 +151,9 @@ export default function PegaDxilMyCaseWidget(props: PegaDxilMyCaseWidgetProps) {
         const theKey = `CaseHistory-${index}`;
         theDataRows.push(
           <TableRow key={theKey}>
-            <StyledTableCell>{dataRow[0] ? dataRow[0] as any : '---'}</StyledTableCell>
-            <StyledTableCell>{dataRow[1] ? dataRow[1] as any : '---'}</StyledTableCell>
-            <StyledTableCell>{dataRow[2] ? dataRow[2] as any : '---'}</StyledTableCell>
+            <StyledTableCell>{dataRow[0] ? (dataRow[0] as any) : '---'}</StyledTableCell>
+            <StyledTableCell>{dataRow[1] ? (dataRow[1] as any) : '---'}</StyledTableCell>
+            <StyledTableCell>{dataRow[2] ? (dataRow[2] as any) : '---'}</StyledTableCell>
           </TableRow>
         );
       });

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyPageCaseWidget/demo.stories.tsx

@@ -11,7 +11,7 @@ window.PCore = {
         return new Promise(resolve => {
           resolve(operatorDetails);
         });
-      },
+      }
     };
   },
   getLocaleUtils: (): any => {
@@ -33,7 +33,6 @@ export default meta;
 type Story = StoryObj<typeof PegaDxilMyPageCaseWidget>;
 
 export const BasePegaDxilMyPageCaseWidget: Story = args => {
-
   const props = {
     getPConnect: () => {
       return {

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyPageCaseWidget/index.tsx

@@ -10,7 +10,6 @@ import Utils from '@pega/react-sdk-components/lib/components/helpers/utils';
 import StyledPegaDxilMyPageCaseWidgetWrapper from './styles';
 import { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
-
 interface PegaDxilMyPageCaseWidgetProps extends PConnProps {
   // If any, enter additional props that only exist on this component
   label: string;

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyPageCaseWidget/mock.ts

@@ -1,4 +1,3 @@
-
 export const caseOpConfig = {
   label: 'Create operator',
   createLabel: 'Created',

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyPageWidget/config.json

@@ -11,49 +11,49 @@
   "subtype": "PAGE",
   "icon": "OneColumnPage.svg",
   "properties": [
-      {
-        "name": "description",
-        "label": "Description",
-        "format": "TEXT",
-        "defaultValue": "We've launched a brand new experience to accelerate your workflow. Check out the guides to help you get the most of Cosmos."
-      },
-      {
-        "name": "whatsnewlink",
-        "label": "What's new link",
-        "format": "TEXT",
-        "defaultValue": "https://design.pega.com"
-      },
-      {
-        "name": "image",
-        "label": "Image link",
-        "format": "TEXT",
-        "defaultValue": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzOSAxMSI+PHRpdGxlPlBlZ2EgdGV4dC1vbmx5IGxvZ288L3RpdGxlPjxwYXRoIHN0eWxlPSJmaWxsLW9wYWNpdHk6IC4yNTsiIGZpbGw9IiNmZmYiIGQ9Ik03LjcyIDMuODJjMCAyLjI1LTEuNzggMy40MS00IDMuNDFoLTEuNnYzSDBWLjQyaDMuOTRjMi4zNiAwIDMuNzggMS4zOSAzLjc4IDMuNHptLTQtMS40N2gtMS42djNoMS43QTEuNDcgMS40NyAwIDAgMCA1LjUgMy44MmMwLS45MS0uNjUtMS40Ny0xLjc1LTEuNDd6bTcuNjggNS45MWg1LjN2Mkg5LjI5Vi40Mmg3LjM4djEuOTNoLTUuMjR2Mmg0LjI0djEuOWgtNC4yNHpNMjMuMTggMGE1IDUgMCAwIDEgMy41NyAxLjI4TDI1LjYzIDIuOGEzLjc4IDMuNzggMCAwIDAtMS4wNS0uNjNBNC4zMiA0LjMyIDAgMCAwIDIzLjMxIDIgMy4xNyAzLjE3IDAgMCAwIDIwIDUuMjdhMy4xNiAzLjE2IDAgMCAwIDEgMi4zOSAzLjA3IDMuMDcgMCAwIDAgMi4xNy44NCA0LjYgNC42IDAgMCAwIDIuMDktLjVWNi4xOWgtMi4yVjQuMzhoNC4yNXY0LjU2YTUuNDEgNS40MSAwIDAgMS00LjA4IDEuNTdBNS4zNSA1LjM1IDAgMCAxIDE5LjQzIDlhNS4wNSA1LjA1IDAgMCAxLTEuNTYtMy43NCA1LjIxIDUuMjEgMCAwIDEgMS41Ni0zLjc2QTUuMzEgNS4zMSAwIDAgMSAyMy4xOCAwem0xMS4yOS40Mmw0LjEzIDkuNzloLTIuMjVMMzUuNDggOGgtNC4wNmwtLjkgMi4xOGgtMi4yTDMyLjUxLjQyem0uMjUgNS43MkwzMy40NCAzbC0xLjI5IDMuMTR6bTMtNWEuNzEuNzEgMCAwIDEtLjc0Ljc1LjcxLjcxIDAgMCAxLS43My0uNzUuNzMuNzMgMCAwIDEgLjc1LS43Mi43Mi43MiAwIDAgMSAuNzUuNzF6TTM3IC41M2EuNTkuNTkgMCAwIDAtLjYuNi42MS42MSAwIDEgMCAxLjIxIDAgLjYuNiAwIDAgMC0uNjEtLjZ6bS0uMjQgMVYuNzFIMzdjLjEyIDAgLjE4LjA2LjI1LjA2YS4yMS4yMSAwIDAgMSAuMDcuMTguMTkuMTkgMCAwIDEtLjA3LjE4cy0uMDcuMDgtLjEzLjA4bC4yNi4zNmgtLjJMMzcgMS4yOGgtLjF2LjI5em0uMTMtLjQ0aC4yM2EuMjYuMjYgMCAwIDAgLjA3LS4wOWgtLjA2Yy0uMDUtLjE3LS4wNS0uMTctLjEzLS4xN2gtLjF6Ii8+PC9zdmc+"
-      },
-      {
-        "name": "datasource",
-        "label": "Data source for details",
-        "defaultValue": "@DATASOURCE D_pyAnnouncements.pxResults",
-        "format": "DATASOURCE",
-        "required": true,
-        "properties": [
-          {
-            "name": "name",
-            "label": "Label",
-            "defaultValue": "@P .pyLabel"
-          }
-        ]
-      },
-      {
-        "label": "Conditions",
-        "format": "GROUP",
-        "properties": [
-          {
-            "name": "visibility",
-            "label": "Visibility",
-            "format": "VISIBILITY"
-          }
-        ]
-      }
+    {
+      "name": "description",
+      "label": "Description",
+      "format": "TEXT",
+      "defaultValue": "We've launched a brand new experience to accelerate your workflow. Check out the guides to help you get the most of Cosmos."
+    },
+    {
+      "name": "whatsnewlink",
+      "label": "What's new link",
+      "format": "TEXT",
+      "defaultValue": "https://design.pega.com"
+    },
+    {
+      "name": "image",
+      "label": "Image link",
+      "format": "TEXT",
+      "defaultValue": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzOSAxMSI+PHRpdGxlPlBlZ2EgdGV4dC1vbmx5IGxvZ288L3RpdGxlPjxwYXRoIHN0eWxlPSJmaWxsLW9wYWNpdHk6IC4yNTsiIGZpbGw9IiNmZmYiIGQ9Ik03LjcyIDMuODJjMCAyLjI1LTEuNzggMy40MS00IDMuNDFoLTEuNnYzSDBWLjQyaDMuOTRjMi4zNiAwIDMuNzggMS4zOSAzLjc4IDMuNHptLTQtMS40N2gtMS42djNoMS43QTEuNDcgMS40NyAwIDAgMCA1LjUgMy44MmMwLS45MS0uNjUtMS40Ny0xLjc1LTEuNDd6bTcuNjggNS45MWg1LjN2Mkg5LjI5Vi40Mmg3LjM4djEuOTNoLTUuMjR2Mmg0LjI0djEuOWgtNC4yNHpNMjMuMTggMGE1IDUgMCAwIDEgMy41NyAxLjI4TDI1LjYzIDIuOGEzLjc4IDMuNzggMCAwIDAtMS4wNS0uNjNBNC4zMiA0LjMyIDAgMCAwIDIzLjMxIDIgMy4xNyAzLjE3IDAgMCAwIDIwIDUuMjdhMy4xNiAzLjE2IDAgMCAwIDEgMi4zOSAzLjA3IDMuMDcgMCAwIDAgMi4xNy44NCA0LjYgNC42IDAgMCAwIDIuMDktLjVWNi4xOWgtMi4yVjQuMzhoNC4yNXY0LjU2YTUuNDEgNS40MSAwIDAgMS00LjA4IDEuNTdBNS4zNSA1LjM1IDAgMCAxIDE5LjQzIDlhNS4wNSA1LjA1IDAgMCAxLTEuNTYtMy43NCA1LjIxIDUuMjEgMCAwIDEgMS41Ni0zLjc2QTUuMzEgNS4zMSAwIDAgMSAyMy4xOCAwem0xMS4yOS40Mmw0LjEzIDkuNzloLTIuMjVMMzUuNDggOGgtNC4wNmwtLjkgMi4xOGgtMi4yTDMyLjUxLjQyem0uMjUgNS43MkwzMy40NCAzbC0xLjI5IDMuMTR6bTMtNWEuNzEuNzEgMCAwIDEtLjc0Ljc1LjcxLjcxIDAgMCAxLS43My0uNzUuNzMuNzMgMCAwIDEgLjc1LS43Mi43Mi43MiAwIDAgMSAuNzUuNzF6TTM3IC41M2EuNTkuNTkgMCAwIDAtLjYuNi42MS42MSAwIDEgMCAxLjIxIDAgLjYuNiAwIDAgMC0uNjEtLjZ6bS0uMjQgMVYuNzFIMzdjLjEyIDAgLjE4LjA2LjI1LjA2YS4yMS4yMSAwIDAgMSAuMDcuMTguMTkuMTkgMCAwIDEtLjA3LjE4cy0uMDcuMDgtLjEzLjA4bC4yNi4zNmgtLjJMMzcgMS4yOGgtLjF2LjI5em0uMTMtLjQ0aC4yM2EuMjYuMjYgMCAwIDAgLjA3LS4wOWgtLjA2Yy0uMDUtLjE3LS4wNS0uMTctLjEzLS4xN2gtLjF6Ii8+PC9zdmc+"
+    },
+    {
+      "name": "datasource",
+      "label": "Data source for details",
+      "defaultValue": "@DATASOURCE D_pyAnnouncements.pxResults",
+      "format": "DATASOURCE",
+      "required": true,
+      "properties": [
+        {
+          "name": "name",
+          "label": "Label",
+          "defaultValue": "@P .pyLabel"
+        }
+      ]
+    },
+    {
+      "label": "Conditions",
+      "format": "GROUP",
+      "properties": [
+        {
+          "name": "visibility",
+          "label": "Visibility",
+          "format": "VISIBILITY"
+        }
+      ]
+    }
   ],
   "defaultConfig": {}
 }

package/tests/assets/sdk-r/components/createAll/custom-sdk/widget/Pega_DXIL_MyPageWidget/mock.ts

@@ -20,4 +20,4 @@ export const configProps = {
     ],
     fields: {}
   }
-};
+};

package/tests/assets/sdk-r/components/createAll/override-sdk/designSystemExtension/CaseSummaryFields/CaseSummaryFields.tsx

@@ -109,9 +109,9 @@ export default function CaseSummaryFields(props: CaseSummaryFieldsProps) {
               label={field.config.label}
               InputProps={{
                 readOnly: true,
-                disableUnderline: true,
                 inputProps: {
-                  style: { cursor: 'pointer' }
+                  style: { cursor: 'pointer' },
+                  disableUnderline: true
                 }
               }}
             />

package/tests/assets/sdk-r/components/createAll/override-sdk/field/CancelAlert/CancelAlert.tsx

@@ -21,6 +21,7 @@ export default function CancelAlert(props: CancelAlertProps) {
   const actionsAPI = getPConnect().getActionsApi();
   const containerManagerAPI = getPConnect().getContainerManager();
   const isLocalAction = getPConnect().getValue(PCore.getConstants().CASE_INFO.IS_LOCAL_ACTION);
+  // @ts-ignore - Property 'options' is private and only accessible within class 'C11nEnv'.
   const isBulkAction = getPConnect()?.options?.isBulkAction;
   const localizedVal = PCore.getLocaleUtils().getLocaleValue;
   const broadCastUtils: any = PCore.getCoexistenceManager().getBroadcastUtils();
@@ -83,6 +84,7 @@ export default function CancelAlert(props: CancelAlertProps) {
       actionsAPI.cancelBulkAction(containerItemID);
     } else {
       dismiss(true);
+      // @ts-ignore - Argument of type '{ containerItemID: string; skipReleaseLockRequest: any; }' is not assignable to parameter of type 'ContainerInfo'.
       containerManagerAPI.removeContainerItem({ containerItemID, skipReleaseLockRequest });
     }
   }

package/tests/assets/sdk-r/components/createAll/override-sdk/field/Currency/Currency.tsx

@@ -1,18 +1,19 @@
-import CurrencyTextField from '@unicef/material-ui-currency-textfield';
-
+import { TextField } from '@material-ui/core';
+import { useState } from 'react';
+import { NumericFormat } from 'react-number-format';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 import { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import handleEvent from '@pega/react-sdk-components/lib/components/helpers/event-utils';
 import { format } from '@pega/react-sdk-components/lib/components/helpers/formatters';
 import { getCurrencyCharacters, getCurrencyOptions } from './currency-utils';
 
-/* Using @unicef/material-ui-currency-textfield component here, since it allows formatting decimal values,
+/* Using react-number-format component here, since it allows formatting decimal values,
 as per the locale.
 */
-
 interface CurrrencyProps extends PConnFieldProps {
   // If any, enter additional props that only exist on Currency here
   currencyISOCode?: string;
+  allowDecimals: boolean;
 }
 
 export default function Currency(props: CurrrencyProps) {
@@ -34,15 +35,15 @@ export default function Currency(props: CurrrencyProps) {
     displayMode,
     hideLabel,
     currencyISOCode = 'USD',
-    placeholder
+    placeholder,
+    allowDecimals
   } = props;
 
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
   const propName = (pConn.getStateProps() as any).value;
   const helperTextToDisplay = validatemessage || helperText;
-
-  // console.log(`Currency: label: ${label} value: ${value}`);
+  const [values, setValues] = useState(value.toString());
 
   const testProp = {
     'data-test-id': testId
@@ -57,6 +58,15 @@ export default function Currency(props: CurrrencyProps) {
   const theCurrencyOptions = getCurrencyOptions(currencyISOCode);
   const formattedValue = format(value, pConn.getComponentName().toLowerCase(), theCurrencyOptions);
 
+  let readOnlyProp = {}; // Note: empty if NOT ReadOnly
+
+  if (readOnly) {
+    readOnlyProp = { readOnly: true };
+  }
+
+  let currencyProp = {};
+  currencyProp = { prefix: theCurrSym, decimalSeparator: theCurrDec, thousandSeparator: theCurrSep };
+
   if (displayMode === 'LABELS_LEFT') {
     return <FieldValueList name={hideLabel ? '' : label} value={formattedValue} />;
   }
@@ -65,34 +75,34 @@ export default function Currency(props: CurrrencyProps) {
     return <FieldValueList name={hideLabel ? '' : label} value={formattedValue} variant='stacked' />;
   }
 
-  function currOnBlur(event, inValue) {
-    // console.log(`Currency currOnBlur inValue: ${inValue}`);
-    handleEvent(actions, 'changeNblur', propName, inValue !== '' ? Number(inValue) : inValue);
+  function currOnBlur() {
+    handleEvent(actions, 'changeNblur', propName, values);
   }
 
-  // console.log(`theCurrSym: ${theCurrSym} | theCurrDec: ${theCurrDec} | theCurrSep: ${theCurrSep}`);
+  const handleChange = val => {
+    setValues(val.value);
+  };
 
   return (
-    <CurrencyTextField
-      fullWidth
-      variant={readOnly ? 'standard' : 'outlined'}
+    <NumericFormat
+      valueIsNumericString
+      label={label}
       helperText={helperTextToDisplay}
       placeholder={placeholder ?? ''}
-      size='small'
       required={required}
       disabled={disabled}
-      readOnly={!!readOnly}
-      error={status === 'error'}
-      label={label}
-      value={value}
-      type='text'
-      outputFormat='number'
-      textAlign='left'
-      InputProps={{ inputProps: { ...testProp } }}
-      currencySymbol={theCurrSym}
-      decimalCharacter={theCurrDec}
-      digitGroupSeparator={theCurrSep}
+      onValueChange={val => {
+        handleChange(val);
+      }}
       onBlur={!readOnly ? currOnBlur : undefined}
+      error={status === 'error'}
+      name='numberformat'
+      value={values}
+      {...currencyProp}
+      decimalScale={allowDecimals !== false ? 2 : 0}
+      fixedDecimalScale={allowDecimals}
+      InputProps={{ ...readOnlyProp, inputProps: { ...testProp } }}
+      customInput={TextField}
     />
   );
 }