@pega/dx-component-builder-sdk 8.23.18 → 23.1.11

package/tests/assets/components/SDK-React/createAll/custom-constellation/field/Pega_DXIL_MyTimeOfDay/index.jsx

@@ -31,13 +31,15 @@ const PegaDxilMyTimeOfDay = props => {
     additionalProps,
     displayMode,
     variant,
-    hasSuggestions
+    hasSuggestions,
+    fieldMetadata,
+    enableAdditionalInformation
   } = props;
   let { formatter } = props;
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
   const propName = pConn.getStateProps().value;
-
+  const fieldDescription = fieldMetadata?.description;
 
   // BUG-547602: Temporary type coercion for 8.5 until DXAPIs are enhanced to pass original pxViewMetadata JSON, respecting boolean primitives
   let { readOnly, required, disabled } = props;
@@ -167,6 +169,14 @@ const PegaDxilMyTimeOfDay = props => {
       onChange={handleChange}
       onBlur={handleBlur}
       onResolveSuggestion={onResolveSuggestionHandler}
+      {...(enableAdditionalInformation && fieldDescription
+        ? {
+            additionalInfo: {
+              heading: label,
+              content: fieldDescription
+            }
+          }
+        : {})}
     />
     </StyledPegaDxilMyTimeOfDayWrapper>
   );
@@ -187,7 +197,10 @@ PegaDxilMyTimeOfDay.defaultProps = {
   additionalProps: {},
   displayMode: null,
   variant: "inline",
-  formatter:"defaultTime"
+  formatter:"defaultTime",
+  hasSuggestions: false,
+  fieldMetadata: {},
+  enableAdditionalInformation: false
 };
 
 PegaDxilMyTimeOfDay.propTypes = {
@@ -207,7 +220,10 @@ PegaDxilMyTimeOfDay.propTypes = {
   additionalProps: PropTypes.objectOf(PropTypes.any),
   displayMode: PropTypes.string,
   variant: PropTypes.string,
-  formatter : PropTypes.string
+  formatter : PropTypes.string,
+  hasSuggestions: PropTypes.bool,
+  fieldMetadata: PropTypes.objectOf(PropTypes.any),
+  enableAdditionalInformation: PropTypes.bool
 };
 
 export default PegaDxilMyTimeOfDay;

package/tests/assets/components/SDK-React/createAll/custom-constellation/field/Pega_DXIL_MyURL/index.jsx

@@ -38,12 +38,15 @@ const PegaDxilMyUrl = props => {
     propUrlLabel,
     urlLabelSelection,
     tableDisplayAs,
-    hasSuggestions
+    hasSuggestions,
+    fieldMetadata,
+    enableAdditionalInformation
   } = props;
   const { formatter } = props;
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
   const propName = pConn.getStateProps().value;
+  const fieldDescription = fieldMetadata?.description;
   const hasValueChange = useRef(false);
 
 
@@ -166,6 +169,14 @@ const PegaDxilMyUrl = props => {
       }}
       onFocus={actions.onFocus}
       onResolveSuggestion={onResolveSuggestionHandler}
+      {...(enableAdditionalInformation && fieldDescription
+        ? {
+            additionalInfo: {
+              heading: label,
+              content: fieldDescription
+            }
+          }
+        : {})}
     />
     </StyledPegaDxilMyUrlWrapper>
   );
@@ -196,7 +207,9 @@ PegaDxilMyUrl.defaultProps = {
   propUrlLabel: '',
   urlLabelSelection: 'constant',
   tableDisplayAs: 'link',
-  hasSuggestions: false
+  hasSuggestions: false,
+  fieldMetadata: {},
+  enableAdditionalInformation: false
 };
 
 PegaDxilMyUrl.propTypes = {
@@ -226,7 +239,9 @@ PegaDxilMyUrl.propTypes = {
   propUrlLabel: PropTypes.string,
   urlLabelSelection: PropTypes.string,
   tableDisplayAs: PropTypes.string,
-  hasSuggestions: PropTypes.bool
+  hasSuggestions: PropTypes.bool,
+  fieldMetadata: PropTypes.objectOf(PropTypes.any),
+  enableAdditionalInformation: PropTypes.bool
 };
 
 export default PegaDxilMyUrl;

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyBoolean/index.tsx

@@ -84,6 +84,7 @@ export default function PegaDxilMyBoolean(props: PegaDxilMyBooleanProps) {
   };
 
   const handleBlur = event => {
+    // @ts-ignore
     thePConn.getValidationApi().validate(event.target.checked, '');   // 2nd arg empty string until typedef marked correctly as optional
   };
 

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyCurrency/demo.stories.jsx

@@ -66,4 +66,4 @@ export const BasePegaDxilMyCurrency = () => {
       <PegaDxilMyCurrency {...props} />
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyCurrency/index.tsx

@@ -6,6 +6,7 @@ import { getCurrencyCharacters, getCurrencyOptions } from '@pega/react-sdk-compo
 import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
+
 import StyledPegaDxilMyCurrencyWrapper from './styles';
 
 interface PegaDxilMyCurrencyProps extends PConnFieldProps {
@@ -44,7 +45,7 @@ export default function PegaDxilMyCurrency(props: PegaDxilMyCurrencyProps) {
 
   const FieldValueList = getComponentFromMap("FieldValueList");
 
-  let readOnlyProp = {}; // Note: empty if NOT ReadOnly
+ let readOnlyProp = {}; // Note: empty if NOT ReadOnly
 
   if (readOnly) {
     readOnlyProp = { readOnly: true };
@@ -125,4 +126,3 @@ export default function PegaDxilMyCurrency(props: PegaDxilMyCurrencyProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyDate/demo.stories.jsx

@@ -61,4 +61,4 @@ export const BasePegaDxilMyDate = () => {
       <PegaDxilMyDate {...props} />
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyDate/index.tsx

@@ -113,4 +113,3 @@ export default function PegaDxilMyDate(props: PegaDxilMyDateProps) {
     </StyledPegaDxilMyDateWrapper>
   );
 }
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyDateTime/demo.stories.jsx

@@ -59,4 +59,4 @@ export const BasePegaDxilMyDateTime = () => {
       <PegaDxilMyDateTime {...props} />
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyDecimal/demo.stories.jsx

@@ -52,3 +52,4 @@ export const BasePegaDxilMyDecimal = () => {
     </>
   );
 };
+

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyDecimal/index.tsx

@@ -6,6 +6,7 @@ import { format } from "@pega/react-sdk-components/lib/components/helpers/format
 import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
+
 import StyledPegaDxilMyDecimalWrapper from './styles';
 
 interface PegaDxilMyDecimalProps extends PConnFieldProps {

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyEmail/index.tsx

@@ -13,6 +13,7 @@ interface PegaDxilMyEmailProps extends PConnFieldProps {
 }
 
 
+
 // Duplicated runtime code from React SDK
 
 // props passed in combination of props from property panel (config.json) and run time props from Constellation
@@ -84,5 +85,3 @@ export default function PegaDxilMyEmail(props: PegaDxilMyEmailProps) {
     </StyledPegaDxilMyEmailWrapper>
   );
 }
-
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyInteger/index.tsx

@@ -4,6 +4,7 @@ import { TextField } from '@material-ui/core';
 import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
+
 import StyledPegaDxilMyIntegerWrapper from './styles';
 
 interface PegaDxilMyIntegerProps extends PConnFieldProps {
@@ -56,8 +57,6 @@ export default function PegaDxilMyInteger(props: PegaDxilMyIntegerProps) {
   };
 
   function intOnChange(event) {
-    // console.log(`Integer intOnChange inValue: ${event.target.value}`);
-
     // Disallow "." and "," (separators) since this is an integer field
     //  Mimics Pega Integer behavior (where separator characters are "eaten" if they're typed)
     const disallowedChars = ['.', ','];
@@ -94,4 +93,3 @@ export default function PegaDxilMyInteger(props: PegaDxilMyIntegerProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyParagraph/index.tsx

@@ -85,4 +85,3 @@ export default function PegaDxilMyParagraph(props: PegaDxilMyParagraphProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyPercentage/index.tsx

@@ -5,6 +5,7 @@ import { TextField } from '@material-ui/core';
 import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
+
 import StyledPegaDxilMyPercentageWrapper from './styles';
 
 interface PegaDxilMyPercentageProps extends PConnFieldProps {
@@ -98,4 +99,3 @@ export default function PegaDxilMyPercentage(props: PegaDxilMyPercentageProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyPhone/index.tsx

@@ -3,7 +3,6 @@ import MuiPhoneNumber from 'material-ui-phone-number';
 import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
-
 import StyledPegaDxilMyPhoneWrapper from './styles';
 
 interface PegaDxilMyPhoneProps extends PConnFieldProps {
@@ -110,4 +109,3 @@ export default function PegaDxilMyPhone(props: PegaDxilMyPhoneProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyPicklist/index.tsx

@@ -135,4 +135,3 @@ export default function PegaDxilMyPicklist(props /* : PegaDxilMyPicklistProps */
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyText/index.tsx

@@ -81,4 +81,3 @@ export default function PegaDxilMyText(props: PegaDxilMyTextProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyTextInput/index.tsx

@@ -82,4 +82,3 @@ export default function PegaDxilMyTextInput(props: PegaDxilMyTextInputProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyTimeOfDay/index.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+// import TextInput from '@pega/react-sdk-components/lib/components/field/TextInput';
 import { KeyboardTimePicker, MuiPickersUtilsProvider } from '@material-ui/pickers';
 import DayjsUtils from '@date-io/dayjs';
 import dayjs from 'dayjs';
@@ -100,4 +101,3 @@ export default function PegaDxilMyTimeOfDay(props: PegaDxilMyTimeOfDayProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/field/Pega_DXIL_MyURL/index.tsx

@@ -77,4 +77,3 @@ export default function PegaDxilMyUrl(props: PegaDxilMyUrlProps) {
   );
 }
 
-

package/tests/assets/components/SDK-React/createAll/custom-sdk/template/Pega_DXIL_MyDetails/index.tsx

@@ -3,7 +3,6 @@ import Grid from "@material-ui/core/Grid";
 import createPConnectComponent from "@pega/react-sdk-components/lib/bridge/react_pconnect";
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
-
 import StyledPegaDxilMyDetailsWrapper from "./styles";
 
 // Can't use PConnProps until getPConnect().getChildren() types are ok

package/tests/assets/components/SDK-React/createAll/custom-sdk/template/Pega_DXIL_MyForm/demo.stories.jsx

@@ -251,4 +251,4 @@ export const BasePegaDxilMyForm = () => {
       <PegaDxilMyForm {...props}></PegaDxilMyForm>
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/custom-sdk/template/Pega_DXIL_MyForm/index.tsx

@@ -2,26 +2,26 @@ import React, { createElement } from 'react';
 
 import { getInstructions } from './utils';
 import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react_pconnect';
+import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
 import './DefaultForm.css';
 
 import StyledPegaDxilMyFormWrapper from "./styles";
 
-//  Can't use PegaDxilMyFormProps until getPConnect().getChildren()[0] is fixed
-// interface PegaDxilMyFormProps extends PConnProps {
-//   // If any, enter additional props that only exist on this componentName
-//   NumCols?: string,
-//   instructions?: string,
-//   // eslint-disable-next-line react/no-unused-prop-types
-//   children: Array<any>
-// }
+interface PegaDxilMyFormProps extends PConnProps {
+  // If any, enter additional props that only exist on this componentName
+  NumCols?: string,
+  instructions?: string,
+  // eslint-disable-next-line react/no-unused-prop-types
+  children: Array<any>
+}
 
 
 // Duplicated runtime code from React SDK
 
 // 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
-export default function PegaDxilMyForm(props /* : PegaDxilMyFormProps */) {
+export default function PegaDxilMyForm(props: PegaDxilMyFormProps) {
   const { getPConnect, NumCols = '1' } = props;
   const instructions = getInstructions(getPConnect(), props.instructions);
 

package/tests/assets/components/SDK-React/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnDetails/index.tsx

@@ -3,7 +3,6 @@ import Grid from "@material-ui/core/Grid";
 import createPConnectComponent from "@pega/react-sdk-components/lib/bridge/react_pconnect";
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
-
 import StyledPegaDxilMyTwoColumnDetailsWrapper from "./styles";
 
 // Can't use PConnProps until getPConnect().getChildren() types are ok
@@ -22,9 +21,9 @@ import StyledPegaDxilMyTwoColumnDetailsWrapper from "./styles";
 // any default values in config.pros should be set in defaultProps at bottom of this file
 export default function PegaDxilMyTwoColumnDetails(props /* : PegaDxilMyTwoColumnDetailsProps */) {
   const { label = '', showLabel = true, getPConnect, showHighlightedData = false } = props;
-  
-  const FieldGroup = getComponentFromMap("FieldGroup");
 
+  const FieldGroup = getComponentFromMap("FieldGroup");
+  
   // Get the inherited props from the parent to determine label settings
   const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };
 

package/tests/assets/components/SDK-React/createAll/custom-sdk/template/Pega_DXIL_MyTwoColumnForm/demo.stories.jsx

@@ -177,4 +177,4 @@ export const BasePegaDxilMyTwoColumnForm = () => {
       </PegaDxilMyTwoColumnForm>
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/custom-sdk/widget/Pega_DXIL_MyPageCaseWidget/demo.stories.jsx

@@ -49,4 +49,4 @@ export const BasePegaDxilMyPageCaseWidget = () => {
       <PegaDxilMyPageCaseWidget {...props} />
     </>
   );
-};
+};

package/tests/assets/components/SDK-React/createAll/override-sdk/field/AutoComplete/AutoComplete.tsx

@@ -83,7 +83,7 @@ export default function AutoComplete(props: AutoCompleteProps) {
 
   const thePConn = getPConnect();
   const actionsApi = thePConn.getActionsApi();
-  const propName = thePConn.getStateProps().value;
+  const propName = thePConn.getStateProps()["value"];
 
   if (!isDeepEqual(datasource, theDatasource)) {
     // inbound datasource is different, so update theDatasource (to trigger useEffect)
@@ -130,7 +130,7 @@ export default function AutoComplete(props: AutoCompleteProps) {
 
   useEffect(() => {
     if (listType === 'associated') {
-      setOptions(Utils.getOptionList(props, getPConnect().getDataObject(context)));
+      setOptions(Utils.getOptionList(props, getPConnect().getDataObject('')));
     }
   }, [theDatasource]);
 

package/tests/assets/components/SDK-React/createAll/override-sdk/field/Checkbox/Checkbox.tsx

@@ -1,35 +1,42 @@
 import React, { useState, useEffect } from 'react';
-import { Checkbox, FormControl, FormControlLabel, FormGroup, FormHelperText } from '@material-ui/core';
+import {
+  Checkbox,
+  FormControl,
+  FormControlLabel,
+  FormGroup,
+  FormHelperText
+} from '@material-ui/core';
 import handleEvent from '@pega/react-sdk-components/lib/components/helpers/event-utils';
-import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+// import type { PConnProps } from '../../../types/PConnProps';
 
 // Checkbox passes in 'value' as a boolean. So can't use the default
 //  PConnFieldProps since it expects value to be a string.
-interface CheckboxProps extends PConnProps {
-  // If any, enter additional props that only exist on Checkbox here
-  // Everything from PConnFieldProps except value and change type of value to boolean
+// But can't use CheckBoxProps until getValidationApi() knows about validate method
+//  Currently just thinks that returns an "object"
+// interface CheckboxProps extends PConnProps {
+//   // If any, enter additional props that only exist on Checkbox here
+//   // Everything from PConnFieldProps except value and change type of value to boolean
 
-  value?: boolean;
-  label: string;
-  required: boolean;
-  disabled: boolean;
-  validatemessage: string;
-  status?: string;
-  // eslint-disable-next-line react/no-unused-prop-types
-  onChange: any;
-  // eslint-disable-next-line react/no-unused-prop-types
-  onBlur?: any;
-  readOnly: boolean;
-  testId: string;
-  helperText: string;
-  displayMode?: string;
-  hideLabel: boolean;
-  // eslint-disable-next-line react/no-unused-prop-types
-  placeholder?: string;
-}
-
-export default function CheckboxComponent(props: CheckboxProps) {
+//   value?: boolean,
+//   label: string,
+//   required: boolean,
+//   disabled: boolean,
+//   validatemessage: string,
+//   status?: string,
+//   // eslint-disable-next-line react/no-unused-prop-types
+//   onChange: any,
+//   // eslint-disable-next-line react/no-unused-prop-types
+//   onBlur?: any,
+//   readOnly: boolean,
+//   testId: string,
+//   helperText: string,
+//   displayMode?: string,
+//   hideLabel: boolean,
+//   // eslint-disable-next-line react/no-unused-prop-types
+//   placeholder?: string
+// }
+export default function CheckboxComponent(props /* : CheckboxProps */) {
   // Get emitted components from map (so we can get any override that may exist)
   const FieldValueList = getComponentFromMap('FieldValueList');
 
@@ -51,9 +58,9 @@ export default function CheckboxComponent(props: CheckboxProps) {
 
   const thePConn = getPConnect();
   const theConfigProps = thePConn.getConfigProps();
-  const { caption } = theConfigProps;
+  const caption = theConfigProps['caption'];
   const actionsApi = thePConn.getActionsApi();
-  const propName = thePConn.getStateProps().value;
+  const propName = thePConn.getStateProps()['value'];
 
   const [checked, setChecked] = useState(false);
   useEffect(() => {
@@ -66,18 +73,20 @@ export default function CheckboxComponent(props: CheckboxProps) {
   }
 
   if (displayMode === 'STACKED_LARGE_VAL') {
-    return <FieldValueList name={hideLabel ? '' : label} value={value.toString()} variant="stacked" />;
+    return (
+      <FieldValueList name={hideLabel ? '' : label} value={value.toString()} variant='stacked' />
+    );
   }
 
-  const handleChange = (event) => {
+  const handleChange = event => {
     handleEvent(actionsApi, 'changeNblur', propName, event.target.checked);
   };
 
-  const handleBlur = (event) => {
+  const handleBlur = event => {
     thePConn.getValidationApi().validate(event.target.checked, ''); // 2nd arg empty string until typedef marked correctly as optional
   };
 
-  let theCheckbox = <Checkbox color="primary" disabled={disabled} />;
+  let theCheckbox = <Checkbox color='primary' disabled={disabled} />;
 
   if (readOnly) {
     // Workaround for lack of InputProps readOnly from https://github.com/mui-org/material-ui/issues/17043
@@ -94,7 +103,7 @@ export default function CheckboxComponent(props: CheckboxProps) {
           onChange={!readOnly ? handleChange : undefined}
           onBlur={!readOnly ? handleBlur : undefined}
           label={caption}
-          labelPlacement="end"
+          labelPlacement='end'
           data-test-id={testId}
         />
       </FormGroup>

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

@@ -36,7 +36,7 @@ export default function Currency(props: CurrrencyProps) {
 
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
-  const propName = pConn.getStateProps().value;
+  const propName = pConn.getStateProps()["value"];
   const helperTextToDisplay = validatemessage || helperText;
 
   // console.log(`Currency: label: ${label} value: ${value}`);

package/tests/assets/components/SDK-React/createAll/override-sdk/field/Date/Date.tsx

@@ -39,7 +39,7 @@ export default function Date(props: DateProps) {
 
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
-  const propName = pConn.getStateProps().value;
+  const propName = pConn.getStateProps()["value"];
   const helperTextToDisplay = validatemessage || helperText;
 
   // Start with default dateFormatInfo

package/tests/assets/components/SDK-React/createAll/override-sdk/field/DateTime/DateTime.tsx

@@ -33,7 +33,7 @@ export default function DateTime(props: DateTimeProps) {
 
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
-  const propName = pConn.getStateProps().value;
+  const propName = pConn.getStateProps()["value"];
   const helperTextToDisplay = validatemessage || helperText;
 
   // Start with default dateFormatInfo

package/tests/assets/components/SDK-React/createAll/override-sdk/field/Decimal/Decimal.tsx

@@ -40,7 +40,7 @@ export default function Decimal(props: DecimalProps) {
 
   const pConn = getPConnect();
   const actions = pConn.getActionsApi();
-  const propName = pConn.getStateProps().value;
+  const propName = pConn.getStateProps()["value"];
   const helperTextToDisplay = validatemessage || helperText;
 
   const [decValue, setDecimalvalue] = useState('');

package/tests/assets/components/SDK-React/createAll/override-sdk/field/Dropdown/Dropdown.tsx

@@ -4,25 +4,27 @@ import MenuItem from '@material-ui/core/MenuItem';
 import Utils from '@pega/react-sdk-components/lib/components/helpers/utils';
 import handleEvent from '@pega/react-sdk-components/lib/components/helpers/event-utils';
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
-import type { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
+// import type { PConnFieldProps } from '../../../types/PConnProps';
 
 interface IOption {
   key: string;
   value: string;
 }
 
-interface DropdownProps extends PConnFieldProps {
-  // If any, enter additional props that only exist on Dropdown here
-  datasource?: Array<any>;
-  onRecordChange?: any;
-  fieldMetadata?: any;
-  // eslint-disable-next-line react/no-unused-prop-types
-  listType: string;
-  // eslint-disable-next-line react/no-unused-prop-types
-  additionalProps?: object;
-}
+// Can't use DropdownProps with 8.23 until getLocaleRuleNameFromKeys is NOT private
+// interface DropdownProps extends PConnFieldProps {
+//   // If any, enter additional props that only exist on Dropdown here
+//   datasource?: Array<any>,
+//   onRecordChange?: any,
+//   fieldMetadata?: any,
+//   // eslint-disable-next-line react/no-unused-prop-types
+//   listType: string,
+//   // eslint-disable-next-line react/no-unused-prop-types
+//   additionalProps?: object
+// }
+
 
-export default function Dropdown(props: DropdownProps) {
+export default function Dropdown(props /* : DropdownProps */) {
   // Get emitted components from map (so we can get any override that may exist)
   const FieldValueList = getComponentFromMap('FieldValueList');
 
@@ -43,19 +45,19 @@ export default function Dropdown(props: DropdownProps) {
     onRecordChange,
     fieldMetadata
   } = props;
-  let { placeholder } = props;
+  let { placeholder = "" } = props;
   placeholder = placeholder || 'Select...';
   const [options, setOptions] = useState<Array<IOption>>([]);
   const helperTextToDisplay = validatemessage || helperText;
 
   const thePConn = getPConnect();
   const actionsApi = thePConn.getActionsApi();
-  const propName = thePConn.getStateProps().value;
+  const propName = thePConn.getStateProps()["value"];
   const className = thePConn.getCaseInfo().getClassName();
   const refName = propName?.slice(propName.lastIndexOf('.') + 1);
 
   useEffect(() => {
-    const list = Utils.getOptionList(props, getPConnect().getDataObject(thePConn.getContextName()));
+    const list = Utils.getOptionList(props, getPConnect().getDataObject('')); // 1st arg empty string until typedef marked correctly
     const optionsList = [...list];
     optionsList.unshift({
       key: placeholder,