npm - @pega/react-sdk-components - Versions diffs - 0.23.17 → 0.23.18 - Mend

@pega/react-sdk-components 0.23.17 → 0.23.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (142) hide show

package/lib/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseSummaryFields.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;~~AAOnC~~,OAAO,yBAAyB,CAAC;AAIjC,iBAAwB,iBAAiB,CAAC,KAAK,KAAA,~~eAuL9C~~;~~kBAvLuB~~,iBAAiB;;;;;;;eAAjB,iBAAiB"}
1	+ {"version":3,"file":"CaseSummaryFields.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AASnC,OAAO,yBAAyB,CAAC;AAIjC,iBAAwB,iBAAiB,CAAC,KAAK,KAAA,eAuN9C;kBAvNuB,iBAAiB;;;;;;;eAAjB,iBAAiB"}

package/lib/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.js CHANGED Viewed

@@ -4,6 +4,8 @@ import isDeepEqual from 'fast-deep-equal/react';
 import Grid from '@material-ui/core/Grid';
 import TextField from '@material-ui/core/TextField';
 import Operator from '../Operator';
+import { getDateFormatInfo } from '../../helpers/date-format-utils';
+import { getCurrencyOptions } from '../../field/Currency/currency-utils';
 import './CaseSummaryFields.css';
 import { format } from '../../helpers/formatters';
 export default function CaseSummaryFields(props) {
@@ -67,16 +69,31 @@ export default function CaseSummaryFields(props) {
                         } })));
             }
             case 'date':
-            case 'datetime':
-            case 'currency':
+            case 'datetime': {
+                const theDateFormatInfo = getDateFormatInfo();
+                // eslint-disable-next-line no-console
+                console.log(`theDateFormatInfo: ${theDateFormatInfo}`);
+                const theFormat = (fieldTypeLower === 'datetime') ? `${theDateFormatInfo.dateFormatStringLong} hh:mm a` : theDateFormatInfo.dateFormatStringLong;
+                return (React.createElement(TextField, { value: format(field.config.value, field.type, { format: theFormat }), label: field.config.label, InputProps: {
+                        readOnly: true,
+                        disableUnderline: true
+                    } }));
+            }
+            case 'currency': {
+                const theCurrencyOptions = getCurrencyOptions(field.config?.currencyISOCode);
+                return (React.createElement(TextField, { value: format(field.config.value, field.type, theCurrencyOptions), label: field.config.label, InputProps: {
+                        readOnly: true,
+                        disableUnderline: true
+                    } }));
+            }
             case 'boolean':
+            case 'userreference':
                 return (React.createElement(TextField, { value: format(field.config.value, field.type), label: field.config.label, InputProps: {
                         readOnly: true,
                         disableUnderline: true
                     } }));
             case 'caseoperator':
                 return React.createElement(Operator, { caseOpConfig: field.config });
-                break;
             default:
                 return (React.createElement("span", null,
                     field.type.toLowerCase(),

package/lib/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseSummaryFields.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport isDeepEqual from 'fast-deep-equal/react';\n\nimport Grid from '@material-ui/core/Grid';\nimport TextField from '@material-ui/core/TextField';\nimport Operator from '../Operator';\n\nimport './CaseSummaryFields.css';\n\nimport { format } from '../../helpers/formatters';\n\nexport default function CaseSummaryFields(props) {\n const { status, showStatus, theFields } = props;\n\n const [theFieldsToRender, setFieldsToRender] = useState([]);\n const [theFieldsAsGridItems, setFieldsAsGridItems] = useState<Array<any>>([]);\n\n function getFieldValue(field: any): any {\n const fieldTypeLower = field.type.toLowerCase();\n\n if (field.config.value === null \|\| field.config.value === '') {\n // Special handling for missing value\n // eslint-disable-next-line sonarjs/no-small-switch\n switch (fieldTypeLower) {\n case 'caseoperator':\n return <Operator caseOpConfig={field.config} />;\n break;\n\n default:\n return (\n <TextField\n value='---'\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n }\n }\n\n switch (fieldTypeLower) {\n case 'textinput':\n case 'decimal':\n case 'integer':\n case 'dropdown':\n return (\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'checkbox': {\n const { caption, label, value, trueLabel, falseLabel } = field.config;\n const fieldLabel = label \|\| caption;\n const fieldValue = value ? trueLabel : falseLabel;\n\n return (\n <TextField\n value={fieldValue}\n label={fieldLabel}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n }\n\n case 'status':\n return (\n <TextField\n className='psdk-csf-status-style'\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'phone': {\n const displayPhone = field.config.value !== '' ? field.config.value : '---';\n return (\n <a href={`tel:${displayPhone}`}>\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n inputProps: { style: { cursor: 'pointer' }, disableUnderline: true }\n }}\n />\n </a>\n );\n }\n\n case 'email': {\n const displayEmail = format(field.config.value, field.type);\n return (\n <a href={`mailto:${displayEmail}`}>\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true,\n inputProps: { style: { cursor: 'pointer' } }\n }}\n />\n </a>\n );\n }\n\n case 'date':\n case 'datetime':\n case 'currency':\n case 'boolean':\n return (\n <TextField\n value={format(field.config.value, field.type)}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'caseoperator':\n return <Operator caseOpConfig={field.config} />;\n break;\n\n default:\n return (\n <span>\n {field.type.toLowerCase()} {field.config.value}\n </span>\n );\n }\n }\n\n // Whenever theFieldsToRender changes, update theFieldsAsGridItems that's used during render\n useEffect(() => {\n const arGridItems = theFieldsToRender.map((field: any) => {\n // display the field when either visibility property doesn't exist or is true(if exists)\n if (field.config.visibility === undefined \|\| field.config.visibility === true) {\n return (\n <Grid item xs={6} key={field.config.label}>\n {getFieldValue(field)}\n </Grid>\n );\n }\n\n return null;\n });\n setFieldsAsGridItems(arGridItems);\n }, [theFieldsToRender]);\n\n const theFieldsModifiable = theFields;\n\n // Special Case: if showStatus is true, splice the status value to be 2nd in theFields\n // if it's not already there\n if (showStatus && theFields?.[1].type !== 'status') {\n const oStatus = { type: 'status', config: { value: status, label: 'Status' } };\n\n const count = theFieldsModifiable.length;\n if (count < 2) {\n theFieldsModifiable.push(oStatus);\n } else {\n theFieldsModifiable.splice(1, 0, oStatus);\n }\n }\n\n // At this point, we know what fields we want to render...\n // So, update our state if it's changed\n if (!isDeepEqual(theFieldsToRender, theFieldsModifiable)) {\n setFieldsToRender(theFieldsModifiable);\n }\n\n return (\n <React.Fragment>\n <Grid container className='psdk-case-summary-fields'>\n {theFieldsAsGridItems}\n </Grid>\n </React.Fragment>\n );\n}\n\nCaseSummaryFields.propTypes = {\n status: PropTypes.string,\n showStatus: PropTypes.bool,\n theFields: PropTypes.arrayOf(PropTypes.object)\n};\n"]}
1	+ {"version":3,"file":"CaseSummaryFields.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/CaseSummaryFields/CaseSummaryFields.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport isDeepEqual from 'fast-deep-equal/react';\n\nimport Grid from '@material-ui/core/Grid';\nimport TextField from '@material-ui/core/TextField';\nimport Operator from '../Operator';\nimport { getDateFormatInfo } from '../../helpers/date-format-utils';\nimport { getCurrencyOptions } from '../../field/Currency/currency-utils';\n\nimport './CaseSummaryFields.css';\n\nimport { format } from '../../helpers/formatters';\n\nexport default function CaseSummaryFields(props) {\n const { status, showStatus, theFields } = props;\n\n const [theFieldsToRender, setFieldsToRender] = useState([]);\n const [theFieldsAsGridItems, setFieldsAsGridItems] = useState<Array<any>>([]);\n\n function getFieldValue(field: any): any {\n const fieldTypeLower = field.type.toLowerCase();\n\n if (field.config.value === null \|\| field.config.value === '') {\n // Special handling for missing value\n // eslint-disable-next-line sonarjs/no-small-switch\n switch (fieldTypeLower) {\n case 'caseoperator':\n return <Operator caseOpConfig={field.config} />;\n break;\n\n default:\n return (\n <TextField\n value='---'\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n }\n }\n\n switch (fieldTypeLower) {\n case 'textinput':\n case 'decimal':\n case 'integer':\n case 'dropdown':\n return (\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'checkbox': {\n const { caption, label, value, trueLabel, falseLabel } = field.config;\n const fieldLabel = label \|\| caption;\n const fieldValue = value ? trueLabel : falseLabel;\n\n return (\n <TextField\n value={fieldValue}\n label={fieldLabel}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n }\n\n case 'status':\n return (\n <TextField\n className='psdk-csf-status-style'\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'phone': {\n const displayPhone = field.config.value !== '' ? field.config.value : '---';\n return (\n <a href={`tel:${displayPhone}`}>\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n inputProps: { style: { cursor: 'pointer' }, disableUnderline: true }\n }}\n />\n </a>\n );\n }\n\n case 'email': {\n const displayEmail = format(field.config.value, field.type);\n return (\n <a href={`mailto:${displayEmail}`}>\n <TextField\n value={field.config.value}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true,\n inputProps: { style: { cursor: 'pointer' } }\n }}\n />\n </a>\n );\n }\n\n case 'date':\n case 'datetime': {\n const theDateFormatInfo = getDateFormatInfo();\n // eslint-disable-next-line no-console\n console.log(`theDateFormatInfo: ${theDateFormatInfo}`);\n const theFormat = (fieldTypeLower === 'datetime') ? `${theDateFormatInfo.dateFormatStringLong} hh:mm a` : theDateFormatInfo.dateFormatStringLong\n\n return (\n <TextField\n value={format(field.config.value, field.type, { format: theFormat })}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n }\n\n case 'currency': {\n const theCurrencyOptions = getCurrencyOptions(field.config?.currencyISOCode);\n return (\n <TextField\n value={format(field.config.value, field.type, theCurrencyOptions)}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n }\n\n\n case 'boolean':\n case 'userreference':\n return (\n <TextField\n value={format(field.config.value, field.type)}\n label={field.config.label}\n InputProps={{\n readOnly: true,\n disableUnderline: true\n }}\n />\n );\n\n case 'caseoperator':\n return <Operator caseOpConfig={field.config} />;\n\n default:\n return (\n <span>\n {field.type.toLowerCase()} {field.config.value}\n </span>\n );\n }\n }\n\n // Whenever theFieldsToRender changes, update theFieldsAsGridItems that's used during render\n useEffect(() => {\n const arGridItems = theFieldsToRender.map((field: any) => {\n // display the field when either visibility property doesn't exist or is true(if exists)\n if (field.config.visibility === undefined \|\| field.config.visibility === true) {\n return (\n <Grid item xs={6} key={field.config.label}>\n {getFieldValue(field)}\n </Grid>\n );\n }\n\n return null;\n });\n setFieldsAsGridItems(arGridItems);\n }, [theFieldsToRender]);\n\n const theFieldsModifiable = theFields;\n\n // Special Case: if showStatus is true, splice the status value to be 2nd in theFields\n // if it's not already there\n if (showStatus && theFields?.[1].type !== 'status') {\n const oStatus = { type: 'status', config: { value: status, label: 'Status' } };\n\n const count = theFieldsModifiable.length;\n if (count < 2) {\n theFieldsModifiable.push(oStatus);\n } else {\n theFieldsModifiable.splice(1, 0, oStatus);\n }\n }\n\n // At this point, we know what fields we want to render...\n // So, update our state if it's changed\n if (!isDeepEqual(theFieldsToRender, theFieldsModifiable)) {\n setFieldsToRender(theFieldsModifiable);\n }\n\n return (\n <React.Fragment>\n <Grid container className='psdk-case-summary-fields'>\n {theFieldsAsGridItems}\n </Grid>\n </React.Fragment>\n );\n}\n\nCaseSummaryFields.propTypes = {\n status: PropTypes.string,\n showStatus: PropTypes.bool,\n theFields: PropTypes.arrayOf(PropTypes.object)\n};\n"]}

package/lib/components/designSystemExtension/FieldGroup/FieldGroup.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":";~~AAsBA~~,QAAA,MAAM,UAAU,6BAwBf,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":";AAqBA,QAAA,MAAM,UAAU,6BAwBf,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/designSystemExtension/FieldGroup/FieldGroup.js CHANGED Viewed

@@ -11,8 +11,7 @@ const useStyles = makeStyles(theme => ({
     fieldMargin: {
         paddingTop: theme.spacing(1),
         paddingBottom: theme.spacing(1),
-        marginTop: theme.spacing(1),
-        marginBottom: theme.spacing(1)
+        marginTop: theme.spacing(1)
     },
     fullWidth: {
         width: '100%'

package/lib/components/designSystemExtension/FieldGroup/FieldGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrC,IAAI,EAAE;QACJ,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC7B,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC3B,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC/B;IACD,WAAW,EAAE;QACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC/B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;~~QAC3B,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC~~;~~KAC/B;~~IACD,SAAS,EAAE;QACT,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAC,CAAC;AAEJ,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE;IACzB,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IACjC,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,MAAM,eAAe,GAAG,CACtB,oBAAC,IAAI,IAAC,SAAS;QACb,6BAAK,SAAS,EAAE,OAAO,CAAC,SAAS,IAAG,QAAQ,CAAO,CAC9C,CACR,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,CAAC,QAAQ;QACb,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,cAAc,EAAC,eAAe;YACxD,oBAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;gBAChC,IAAI,IAAI,CACP,6BAAK,SAAS,EAAE,OAAO,CAAC,WAAW;oBACjC,+BAAI,KAAK,CAAC,IAAI,CAAK,CACf,CACP;gBACA,eAAe,CACX,CACF,CACQ,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import React from 'react';\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n marginRight: theme.spacing(1),\n marginLeft: theme.spacing(1),\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n fieldMargin: {\n paddingTop: theme.spacing(1),\n paddingBottom: theme.spacing(1),\n marginTop: theme.spacing(1)~~,\n marginBottom: theme.spacing(1)~~\n },\n fullWidth: {\n width: '100%'\n }\n}));\n\nconst FieldGroup = props => {\n const { children, name } = props;\n const classes = useStyles();\n\n const descAndChildren = (\n <Grid container>\n <div className={classes.fullWidth}>{children}</div>\n </Grid>\n );\n\n return (\n <React.Fragment>\n <Grid container spacing={4} justifyContent='space-between'>\n <Grid item style={{ width: '100%' }}>\n {name && (\n <div className={classes.fieldMargin}>\n <b>{props.name}</b>\n </div>\n )}\n {descAndChildren}\n </Grid>\n </Grid>\n </React.Fragment>\n );\n};\n\nexport default FieldGroup;\n"]}
1	+ {"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrC,IAAI,EAAE;QACJ,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC7B,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC3B,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC/B;IACD,WAAW,EAAE;QACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC/B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC5B;IACD,SAAS,EAAE;QACT,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAC,CAAC;AAEJ,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE;IACzB,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IACjC,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,MAAM,eAAe,GAAG,CACtB,oBAAC,IAAI,IAAC,SAAS;QACb,6BAAK,SAAS,EAAE,OAAO,CAAC,SAAS,IAAG,QAAQ,CAAO,CAC9C,CACR,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,CAAC,QAAQ;QACb,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,cAAc,EAAC,eAAe;YACxD,oBAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;gBAChC,IAAI,IAAI,CACP,6BAAK,SAAS,EAAE,OAAO,CAAC,WAAW;oBACjC,+BAAI,KAAK,CAAC,IAAI,CAAK,CACf,CACP;gBACA,eAAe,CACX,CACF,CACQ,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import React from 'react';\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n marginRight: theme.spacing(1),\n marginLeft: theme.spacing(1),\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n fieldMargin: {\n paddingTop: theme.spacing(1),\n paddingBottom: theme.spacing(1),\n marginTop: theme.spacing(1)\n },\n fullWidth: {\n width: '100%'\n }\n}));\n\nconst FieldGroup = props => {\n const { children, name } = props;\n const classes = useStyles();\n\n const descAndChildren = (\n <Grid container>\n <div className={classes.fullWidth}>{children}</div>\n </Grid>\n );\n\n return (\n <React.Fragment>\n <Grid container spacing={4} justifyContent='space-between'>\n <Grid item style={{ width: '100%' }}>\n {name && (\n <div className={classes.fieldMargin}>\n <b>{props.name}</b>\n </div>\n )}\n {descAndChildren}\n </Grid>\n </Grid>\n </React.Fragment>\n );\n};\n\nexport default FieldGroup;\n"]}

package/lib/components/designSystemExtension/FieldValueList/FieldValueList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldValueList.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":";~~AAiCA~~,QAAA,MAAM,cAAc,~~6BAsEnB~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"FieldValueList.d.ts","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":";AAuCA,QAAA,MAAM,cAAc,6BA8CnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/designSystemExtension/FieldValueList/FieldValueList.js CHANGED Viewed

@@ -9,61 +9,44 @@ const useStyles = makeStyles(theme => ({
         marginTop: theme.spacing(1),
         marginBottom: theme.spacing(1)
     },
-    fieldMargin: {
-    // paddingRight: theme.spacing(1),
-    // paddingLeft: theme.spacing(1),
-    // paddingTop: theme.spacing(1),
-    // paddingBottom: theme.spacing(1),
-    // marginRight: theme.spacing(1),
-    // marginLeft: theme.spacing(1),
-    // marginTop: theme.spacing(1),
-    // marginBottom: theme.spacing(1)
-    },
     fieldLabel: {
         fontWeight: 400,
         color: theme.palette.text.secondary
     },
     fieldValue: {
-        fontWeight: 400,
         color: theme.palette.text.primary
+    },
+    noPaddingTop: {
+        paddingTop: '0 !important'
+    },
+    noPaddingBottom: {
+        paddingBottom: '0 !important'
     }
 }));
+function formatItemValue(value) {
+    let formattedVal = value;
+    // if the value is undefined or an empty string, we want to display it as "---"
+    if (formattedVal === undefined || formattedVal === '') {
+        formattedVal = '---';
+    }
+    return formattedVal;
+}
 const FieldValueList = props => {
+    const { name, value, variant = 'inline' } = props;
     const classes = useStyles();
-    const fields = [];
-    // eslint-disable-next-line guard-for-in
-    for (const label in props.item) {
-        fields.push({ label, value: props.item[label] });
-    }
-    function getGridItemLabel(label) {
-        const dispValue = label;
-        return (React.createElement(Grid, { item: true, xs: 6 },
-            React.createElement(Typography, { variant: 'body2', component: 'span', className: `${classes.fieldLabel} ${classes.fieldMargin}` }, dispValue)));
+    function getGridItemLabel() {
+        return (React.createElement(Grid, { item: true, xs: variant === 'stacked' ? 12 : 6, className: variant === 'stacked' ? classes.noPaddingBottom : '' },
+            React.createElement(Typography, { variant: 'body2', component: 'span', className: `${classes.fieldLabel}` }, name)));
     }
-    function formatItemValue(value) {
-        let formattedVal = value;
-        // if the value is undefined or an empty string, we want to display it as "---"
-        if (formattedVal === undefined || formattedVal === '') {
-            formattedVal = '---';
-        }
-        return formattedVal;
-    }
-    function getGridItemValue(value) {
+    function getGridItemValue() {
         const formattedValue = formatItemValue(value);
-        return (React.createElement(Grid, { item: true, xs: 6 },
-            React.createElement(Typography, { variant: 'body2', component: 'span', className: classes.fieldValue }, formattedValue)));
-    }
-    function getGridItems() {
-        const gridItems = fields.map(item => {
-            return (React.createElement(Grid, { container: true, spacing: 1, key: item.label },
-                getGridItemLabel(item.label),
-                getGridItemValue(item.value)));
-        });
-        return gridItems;
+        return (React.createElement(Grid, { item: true, xs: variant === 'stacked' ? 12 : 6, className: variant === 'stacked' ? classes.noPaddingTop : '' },
+            React.createElement(Typography, { variant: variant === 'stacked' ? 'h6' : 'body2', component: 'span', className: classes.fieldValue }, formattedValue)));
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(Grid, { container: true, spacing: 4, justifyContent: 'space-between' },
-            React.createElement(Grid, { item: true, style: { width: '100%' } }, getGridItems()))));
+            getGridItemLabel(),
+            getGridItemValue())));
 };
 export default FieldValueList;
 //# sourceMappingURL=FieldValueList.js.map

package/lib/components/designSystemExtension/FieldValueList/FieldValueList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,UAAU,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrC,IAAI,EAAE;QACJ,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC7B,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC3B,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC/B;IACD,~~WAAW,EAAE;IACX,kCAAkC;IAClC,iCAAiC;IACjC,gCAAgC;IAChC,mCAAmC;IACnC,iCAAiC;IACjC,gCAAgC;IAChC,+BAA+B;IAC/B,iCAAiC;KAClC;IACD,~~UAAU,EAAE;QACV,UAAU,EAAE,GAAG;QACf,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS;KACpC;IACD,UAAU,EAAE;QACV,~~UAAU,EAAE,GAAG;QACf,~~KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;KAClC;~~CACF~~,~~CAAC~~,~~CAAC,CAAC~~;~~AAEJ~~,~~MAAM~~,cAAc,~~GAAG~~,~~KAAK~~,~~CAAC~~,EAAE;~~IAC7B~~,~~MAAM~~,~~OAAO~~,~~GAAG~~,SAAS,~~EAAE~~,CAAC;~~IAE5B~~,~~MAAM~~,~~MAAM~~,~~GAAQ~~,~~EAAE~~,CAAC;~~IAEvB,wCAAwC~~;~~IACxC~~,~~KAAK~~,~~MAAM~~,KAAK,IAAI,KAAK,~~CAAC~~,~~IAAI,~~EAAE;~~QAC9B~~,~~MAAM~~,CAAC,~~IAAI~~,CAAC,~~EAAE~~,~~KAAK~~,~~EAAE~~,KAAK,EAAE,~~KAAK~~,~~CAAC~~,IAAI,~~CAAC~~,KAAK,~~CAAC,~~EAAE,~~CAAC~~,~~CAAC;KAClD;IAED~~,~~SAAS~~,~~gBAAgB~~,~~CAAC~~,KAAK;~~QAC7B~~,MAAM,~~SAAS~~,GAAG,~~KAAK~~,CAAC;~~QAExB~~,OAAO,CACL,oBAAC,IAAI,~~IAAC~~,IAAI,~~QAAC~~,EAAE,EAAE,~~CAAC;YACd~~,~~oBAAC~~,~~UAAU~~,~~IACT~~,~~OAAO~~,~~EAAC~~,~~OAAO~~,~~EACf~~,~~SAAS~~,~~EAAC~~,~~MAAM~~,~~EAChB~~,SAAS,EAAE,~~GAAG,~~OAAO,CAAC,~~UAAU~~,~~IAAI~~,OAAO,CAAC,~~WAAW~~,~~EAAE~~,~~IAExD~~,~~SAAS,CACC,CACR,CACR,~~CAAC~~;IACJ~~,~~CAAC~~;~~IAED~~,~~SAAS~~,~~eAAe~~,~~CAAC~~,~~KAAK;QAC5B~~,~~IAAI~~,~~YAAY~~,~~GAAG~~,~~KAAK~~,~~CAAC;QAEzB,+EAA+E;QAC/E~~,~~IAAI~~,~~YAAY~~,~~KAAK,~~SAAS,~~IAAI~~,~~YAAY~~,~~KAAK~~,~~EAAE~~,EAAE~~;YACrD~~,~~YAAY~~,~~GAAG~~,~~KAAK~~,~~CAAC;SACtB;QAED~~,~~OAAO~~,~~YAAY,~~CAAC;~~IACtB~~,CAAC;IAED,SAAS,gBAAgB~~,CAAC,KAAK~~;~~QAC7B~~,MAAM,cAAc,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;QAE9C,OAAO,CACL,oBAAC,IAAI,~~IAAC~~,IAAI,~~QAAC~~,EAAE,EAAE,~~CAAC;YACd~~,~~oBAAC~~,~~UAAU~~,~~IAAC~~,~~OAAO~~,~~EAAC~~,~~OAAO~~,~~EAAC~~,~~SAAS~~,~~EAAC~~,~~MAAM~~,~~EAAC~~,SAAS,EAAE,OAAO,~~CAAC~~,~~UAAU~~,~~IACvE~~,~~cAAc~~,~~CACJ~~,~~CACR~~,~~CACR,~~CAAC~~;IACJ~~,~~CAAC;IAED,SAAS,~~YAAY~~;QACnB~~,~~MAAM,SAAS,GAAG,MAAM,~~CAAC,~~GAAG,~~CAAC,~~IAAI,~~CAAC,EAAE;~~YAClC~~,~~OAAO,CACL,~~oBAAC,~~IAAI~~,~~IAAC~~,~~SAAS,QAAC,~~OAAO,EAAE,~~CAAC~~,~~EAAE~~,~~GAAG~~,~~EAAE~~,~~IAAI,~~CAAC,~~KAAK;gBACxC,gBAAgB,~~CAAC,IAAI,CAAC,~~KAAK~~,CAAC~~;gBAC5B~~,~~gBAAgB~~,~~CAAC~~,~~IAAI~~,~~CAAC~~,~~KAAK~~,~~CAAC~~,~~CACxB~~,~~CACR~~,~~CAAC;QACJ~~,CAAC,~~CAAC~~,~~CAAC;QACH~~,~~OAAO~~,~~SAAS~~,CAAC;~~IACnB~~,CAAC;IAED,OAAO,CACL,oBAAC,KAAK,CAAC,QAAQ;QACb,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,cAAc,EAAC,eAAe;~~YACxD~~,~~oBAAC~~,~~IAAI,IAAC,IAAI,QAAC,KAAK,~~EAAE,~~EAAE~~,~~KAAK,~~EAAE,~~MAAM~~,~~EAAE,IAChC,YAAY,EAAE,CACV,CACF,~~CACQ,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import React from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n marginRight: theme.spacing(1),\n marginLeft: theme.spacing(1),\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n fieldMargin: {\n // paddingRight: theme.spacing(1),\n // paddingLeft: theme.spacing(1),\n // paddingTop: theme.spacing(1),\n // paddingBottom: theme.spacing(1),\n // marginRight: theme.spacing(1),\n // marginLeft: theme.spacing(1),\n // marginTop: theme.spacing(1),\n // marginBottom: theme.spacing(1)\n },\n fieldLabel: {\n fontWeight: 400,\n color: theme.palette.text.secondary\n },\n fieldValue: {\n ~~fontWeight: 400,\n~~ color: theme.palette.text.primary\n }\n~~}));\n\nconst FieldValueList = props => {\n~~ ~~const classes = useStyles();\n\n const fields~~: ~~any = [];\n\n // eslint-disable-next-line guard-for-in\n for (const label in props.item)~~ {\n ~~fields.push({ label, value~~: ~~props.item[label]~~ ~~});\~~n }\n\n ~~function~~ ~~getGridItemLabel(label)~~ {\n ~~const~~ ~~dispValue~~ ~~= label;\n\n return (\n <Grid item xs={6}>\n <Typography\n variant=~~'~~body2'~~\n ~~component='span'\n className={`${classes.fieldLabel~~} ~~${classes.fieldMargin}`}~~\n ~~>\n {dispValue~~}~~\n </Typography>\n </Grid>\n~~ );\n }\~~n\n function~~ formatItemValue(value) {\n let formattedVal = value;\n\n // if the value is undefined or an empty string, we want to display it as \"---\"\n if (formattedVal === undefined \|\| formattedVal === '') {\n formattedVal = '---';\n }\n\n return formattedVal;\n }\n\n ~~function~~ ~~getGridItemValue(~~value) {\n const ~~formattedValue~~ = ~~formatItemValue~~(~~value~~);\n\n return (\n <Grid item xs={6}>\n <Typography variant='body2' component='span' className={classes.~~fieldValue~~}>\n {~~formattedValue~~}\n </Typography>\n </Grid>\n );\n }\n\n function ~~getGridItems~~() {\n const ~~gridItems~~ = ~~fields.map~~(~~item => {~~\n return (\n <Grid ~~container~~ ~~spacing~~={1} ~~key={item~~.~~label~~}>\n {~~getGridItemLabel(item.label)~~}\n {~~getGridItemValue(item~~.~~value)~~}\n </~~Grid~~>\n ~~);\~~n });\n ~~return gridItems;\n~~ }\n\n return (\n <React.Fragment>\n <Grid container spacing={4} justifyContent='space-between'>\n ~~<Grid item style=~~{~~{ width: '100%'~~ }~~}>\~~n {~~getGridItems~~()}\n ~~</Grid>\n~~ </Grid>\n </React.Fragment>\n );\n};\n\nexport default FieldValueList;\n"]}
1	+ {"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../../src/components/designSystemExtension/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,UAAU,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrC,IAAI,EAAE;QACJ,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC7B,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5B,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC3B,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC/B;IACD,UAAU,EAAE;QACV,UAAU,EAAE,GAAG;QACf,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS;KACpC;IACD,UAAU,EAAE;QACV,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;KAClC;IACD,YAAY,EAAE;QACZ,UAAU,EAAE,cAAc;KAC3B;IACD,eAAe,EAAE;QACf,aAAa,EAAE,cAAc;KAC9B;CACF,CAAC,CAAC,CAAC;AAEJ,SAAS,eAAe,CAAC,KAAK;IAC5B,IAAI,YAAY,GAAG,KAAK,CAAC;IAEzB,+EAA+E;IAC/E,IAAI,YAAY,KAAK,SAAS,IAAI,YAAY,KAAK,EAAE,EAAE;QACrD,YAAY,GAAG,KAAK,CAAC;KACtB;IAED,OAAO,YAAY,CAAC;AACtB,CAAC;AAED,MAAM,cAAc,GAAG,KAAK,CAAC,EAAE;IAC7B,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,SAAS,gBAAgB;QACvB,OAAO,CACL,oBAAC,IAAI,IACH,IAAI,QACJ,EAAE,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAClC,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE;YAE/D,oBAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAC,MAAM,EAAC,SAAS,EAAE,GAAG,OAAO,CAAC,UAAU,EAAE,IAC5E,IAAI,CACM,CACR,CACR,CAAC;IACJ,CAAC;IAED,SAAS,gBAAgB;QACvB,MAAM,cAAc,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;QAE9C,OAAO,CACL,oBAAC,IAAI,IACH,IAAI,QACJ,EAAE,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAClC,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;YAE5D,oBAAC,UAAU,IACT,OAAO,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,EAC/C,SAAS,EAAC,MAAM,EAChB,SAAS,EAAE,OAAO,CAAC,UAAU,IAE5B,cAAc,CACJ,CACR,CACR,CAAC;IACJ,CAAC;IAED,OAAO,CACL,oBAAC,KAAK,CAAC,QAAQ;QACb,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,cAAc,EAAC,eAAe;YACvD,gBAAgB,EAAE;YAClB,gBAAgB,EAAE,CACd,CACQ,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import React from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n marginRight: theme.spacing(1),\n marginLeft: theme.spacing(1),\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n fieldLabel: {\n fontWeight: 400,\n color: theme.palette.text.secondary\n },\n fieldValue: {\n color: theme.palette.text.primary\n },\n noPaddingTop: {\n paddingTop: '0 !important'\n },\n noPaddingBottom: {\n paddingBottom: '0 !important'\n }\n}));\n\nfunction formatItemValue(value) {\n let formattedVal = value;\n\n // if the value is undefined or an empty string, we want to display it as \"---\"\n if (formattedVal === undefined \|\| formattedVal === '') {\n formattedVal = '---';\n }\n\n return formattedVal;\n}\n\nconst FieldValueList = props => {\n const { name, value, variant = 'inline' } = props;\n const classes = useStyles();\n\n function getGridItemLabel() {\n return (\n <Grid\n item\n xs={variant === 'stacked' ? 12 : 6}\n className={variant === 'stacked' ? classes.noPaddingBottom : ''}\n >\n <Typography variant='body2' component='span' className={`${classes.fieldLabel}`}>\n {name}\n </Typography>\n </Grid>\n );\n }\n\n function getGridItemValue() {\n const formattedValue = formatItemValue(value);\n\n return (\n <Grid\n item\n xs={variant === 'stacked' ? 12 : 6}\n className={variant === 'stacked' ? classes.noPaddingTop : ''}\n >\n <Typography\n variant={variant === 'stacked' ? 'h6' : 'body2'}\n component='span'\n className={classes.fieldValue}\n >\n {formattedValue}\n </Typography>\n </Grid>\n );\n }\n\n return (\n <React.Fragment>\n <Grid container spacing={4} justifyContent='space-between'>\n {getGridItemLabel()}\n {getGridItemValue()}\n </Grid>\n </React.Fragment>\n );\n};\n\nexport default FieldValueList;\n"]}

package/lib/components/field/AutoComplete/AutoComplete.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AutoComplete.d.ts","sourceRoot":"","sources":["../../../../src/components/field/AutoComplete/AutoComplete.tsx"],"names":[],"mappings":";AAsCA,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,KAAA,~~eAgKzC~~"}
1	+ {"version":3,"file":"AutoComplete.d.ts","sourceRoot":"","sources":["../../../../src/components/field/AutoComplete/AutoComplete.tsx"],"names":[],"mappings":";AAsCA,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,KAAA,eAkKzC"}

package/lib/components/field/AutoComplete/AutoComplete.js CHANGED Viewed

@@ -30,7 +30,7 @@ const getDisplayFieldsMetaData = columnList => {
     return metaDataObj;
 };
 export default function AutoComplete(props) {
-    const { getPConnect, label, required, placeholder, value = '', validatemessage, readOnly, testId, displayMode, deferDatasource, datasourceMetadata, status, helperText, onRecordChange } = props;
+    const { getPConnect, label, required, placeholder, value = '', validatemessage, readOnly, testId, displayMode, deferDatasource, datasourceMetadata, status, helperText, hideLabel, onRecordChange } = props;
     const context = getPConnect().getContextName();
     let { listType, parameters, datasource = [], columns = [] } = props;
     const [inputValue, setInputValue] = useState('');
@@ -103,10 +103,10 @@ export default function AutoComplete(props) {
         }
     }, []);
     if (displayMode === 'LABELS_LEFT') {
-        const field = {
-            [label]: value
-        };
-        return React.createElement(FieldValueList, { item: field });
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: value });
+    }
+    if (displayMode === 'STACKED_LARGE_VAL') {
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: value, variant: 'stacked' });
     }
     if (value) {
         const index = options?.findIndex(element => element.key === value);

package/lib/components/field/AutoComplete/AutoComplete.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AutoComplete.js","sourceRoot":"","sources":["../../../../src/components/field/AutoComplete/AutoComplete.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,YAAY,MAAM,+BAA+B,CAAC;AACzD,OAAO,KAAK,MAAM,qBAAqB,CAAC;AACxC,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,WAAW,MAAM,2BAA2B,CAAC;AACpD,OAAO,cAAc,MAAM,4CAA4C,CAAC;AAOxE,MAAM,iBAAiB,GAAG,UAAU,CAAC,EAAE;IACrC,OAAO,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;QAC1B,MAAM,UAAU,GAAG,EAAE,GAAG,GAAG,EAAE,CAAC;QAC9B,UAAU,CAAC,KAAK,GAAG,GAAG,CAAC,KAAK,IAAI,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC;QAC/F,OAAO,UAAU,CAAC;IACpB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,UAAU,CAAC,EAAE;IAC5C,MAAM,cAAc,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC;IACxE,MAAM,WAAW,GAAQ,EAAE,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;IACjE,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,MAAM,CAAC,CAAC;IAC5D,WAAW,CAAC,GAAG,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IAC/D,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,IAAI,CAAC,EAAE;QAC7D,IAAI,cAAc,CAAC,KAAK,CAAC,CAAC,OAAO,KAAK,MAAM,EAAE;YAC5C,WAAW,CAAC,OAAO,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;SACnD;aAAM;YACL,WAAW,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;SACzD;KACF;IACD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK;IACxC,MAAM,EACJ,WAAW,EACX,KAAK,EACL,QAAQ,EACR,WAAW,EACX,KAAK,GAAG,EAAE,EACV,eAAe,EACf,QAAQ,EACR,MAAM,EACN,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,UAAU,EACV,cAAc,EACf,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,WAAW,EAAE,CAAC,cAAc,EAAE,CAAC;IAC/C,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,KAAK,CAAC;IACpE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACjD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAiB,EAAE,CAAC,CAAC;IAC3D,MAAM,CAAC,aAAa,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACtD,IAAI,aAAa,GAAQ,EAAE,CAAC;IAC5B,MAAM,mBAAmB,GAAG,eAAe,IAAI,UAAU,CAAC;IAE1D,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,EAAE,CAAC;IAC5C,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC;IAEhD,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE,aAAa,CAAC,EAAE;QAC3C,kFAAkF;QAClF,aAAa,CAAC,UAAU,CAAC,CAAC;KAC3B;IAED,MAAM,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,EAAE,EAAE;QACxC,MAAM,UAAU,GAAG,EAAE,CAAC;QACtB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;YAChC,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;YAC5C,UAAU,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC;QAC5B,CAAC,CAAC,CAAC;QAEH,OAAO,UAAU,CAAC;IACpB,CAAC,CAAC;IAEF,8DAA8D;IAC9D,mGAAmG;IACnG,IAAI,eAAe,IAAI,kBAAkB,EAAE,UAAU,EAAE,IAAI,EAAE;QAC3D,QAAQ,GAAG,UAAU,CAAC;QACtB,UAAU,GAAG,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;QAChD,UAAU,GAAG,iBAAiB,CAAC,kBAAkB,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC;QAC3E,MAAM,WAAW,GAAG,kBAAkB,CAAC,UAAU,CAAC,sBAAsB,CAAC,UAAU,CAAC,IAAI,CAAC;YACvF,CAAC,CAAC,kBAAkB,CAAC,UAAU,CAAC,sBAAsB,CAAC,SAAS,CAAC,CAAC,CAAC;YACnE,CAAC,CAAC,kBAAkB,CAAC,UAAU,CAAC,sBAAsB,CAAC;QACzD,MAAM,SAAS,GAAG,kBAAkB,CAAC,UAAU,CAAC,gBAAgB,CAAC,UAAU,CAAC,IAAI,CAAC;YAC/E,CAAC,CAAC,kBAAkB,CAAC,UAAU,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC,CAAC;YAC7D,CAAC,CAAC,kBAAkB,CAAC,UAAU,CAAC,gBAAgB,CAAC;QACnD,OAAO,GAAG;YACR;gBACE,GAAG,EAAE,MAAM;gBACX,WAAW,EAAE,qBAAqB;gBAClC,KAAK,EAAE,SAAS;aACjB;YACD;gBACE,OAAO,EAAE,MAAM;gBACf,OAAO,EAAE,MAAM;gBACf,YAAY,EAAE,IAAI;gBAClB,KAAK,EAAE,WAAW;aACnB;SACF,CAAC;KACH;IACD,OAAO,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,QAAQ,KAAK,YAAY,EAAE;YAC7B,UAAU,CAAC,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC;SACvE;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,WAAW,IAAI,QAAQ,KAAK,YAAY,EAAE;YAC7C,WAAW,CAAC,UAAU,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,OAAY,EAAE,EAAE;gBACjE,MAAM,WAAW,GAAe,EAAE,CAAC;gBACnC,MAAM,aAAa,GAAG,wBAAwB,CAAC,OAAO,CAAC,CAAC;gBACxD,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC,EAAE;oBACzB,MAAM,GAAG,GAAG,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,CAAC;oBACvD,MAAM,GAAG,GAAG;wBACV,GAAG,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,OAAO,CAAC,MAAM;wBACjD,KAAK,EAAE,GAAG;qBACX,CAAC;oBACF,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;gBACxB,CAAC,CAAC,CAAC;gBACH,UAAU,CAAC,WAAW,CAAC,CAAC;YAC1B,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,WAAW,KAAK,aAAa,EAAE;QACjC,MAAM,KAAK,GAAG;YACZ,CAAC,KAAK,CAAC,EAAE,KAAK;SACf,CAAC;QACF,OAAO,oBAAC,cAAc,IAAC,IAAI,EAAE,KAAK,GAAI,CAAC;KACxC;IAED,IAAI,KAAK,EAAE;QACT,MAAM,KAAK,GAAG,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC;QACnE,IAAI,KAAK,GAAG,CAAC,CAAC,EAAE;YACd,aAAa,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;SACtC;aAAM;YACL,aAAa,GAAG,KAAK,CAAC;SACvB;KACF;IAED,MAAM,YAAY,GAAG,CAAC,KAAa,EAAE,QAAQ,EAAE,EAAE;QAC/C,MAAM,GAAG,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;QACzC,WAAW,CAAC,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC;QACtD,IAAI,cAAc,EAAE;YAClB,cAAc,CAAC,KAAK,CAAC,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE;QAChD,aAAa,CAAC,aAAa,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,IAAI,QAAQ,EAAE;QACZ,MAAM,cAAc,GAAG,OAAO,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,KAAK,CAAC,EAAE,KAAK,CAAC;QACtE,OAAO,oBAAC,SAAS,OAAK,KAAK,EAAE,KAAK,EAAE,cAAc,GAAI,CAAC;KACxD;IACD,mEAAmE;IACnE,oDAAoD;IACpD,OAAO,CACL,oBAAC,YAAY,IACX,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,CAAC,MAAe,EAAE,EAAE;YAClC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;QAC1C,CAAC,EACD,iBAAiB,EAAE,CAAC,MAAW,EAAE,EAAE;YACjC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;QAC1C,CAAC,EACD,SAAS,QACT,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,aAAa,EACpB,UAAU,EAAE,UAAU,IAAI,aAAa,EACvC,aAAa,EAAE,gBAAgB,EAC/B,WAAW,EAAE,MAAM,CAAC,EAAE,CAAC,CACrB,oBAAC,SAAS,OACJ,MAAM,EACV,SAAS,QACT,OAAO,EAAC,UAAU,EAClB,UAAU,EAAE,mBAAmB,EAC/B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,MAAM,KAAK,OAAO,EACzB,KAAK,EAAE,KAAK,kBACE,MAAM,GACpB,CACH,GACD,CACH,CAAC;AACJ,CAAC","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { TextField } from '@material-ui/core';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport Utils from '../../helpers/utils';\nimport TextInput from '../TextInput';\nimport isDeepEqual from 'fast-deep-equal/react';\nimport { getDataPage } from '../../helpers/data_page';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\n\ninterface IOption {\n key: string;\n value: string;\n}\n\nconst preProcessColumns = columnList => {\n return columnList.map(col => {\n const tempColObj = { ...col };\n tempColObj.value = col.value && col.value.startsWith('.') ? col.value.substring(1) : col.value;\n return tempColObj;\n });\n};\n\nconst getDisplayFieldsMetaData = columnList => {\n const displayColumns = columnList.filter(col => col.display === 'true');\n const metaDataObj: any = { key: '', primary: '', secondary: [] };\n const keyCol = columnList.filter(col => col.key === 'true');\n metaDataObj.key = keyCol.length > 0 ? keyCol[0].value : 'auto';\n for (let index = 0; index < displayColumns.length; index += 1) {\n if (displayColumns[index].primary === 'true') {\n metaDataObj.primary = displayColumns[index].value;\n } else {\n metaDataObj.secondary.push(displayColumns[index].value);\n }\n }\n return metaDataObj;\n};\n\nexport default function AutoComplete(props) {\n const {\n getPConnect,\n label,\n required,\n placeholder,\n value = '',\n validatemessage,\n readOnly,\n testId,\n displayMode,\n deferDatasource,\n datasourceMetadata,\n status,\n helperText,\n onRecordChange\n } = props;\n const context = getPConnect().getContextName();\n let { listType, parameters, datasource = [], columns = [] } = props;\n const [inputValue, setInputValue] = useState('');\n const [options, setOptions] = useState<Array<IOption>>([]);\n const [theDatasource, setDatasource] = useState(null);\n let selectedValue: any = '';\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n const thePConn = getPConnect();\n const actionsApi = thePConn.getActionsApi();\n const propName = thePConn.getStateProps().value;\n\n if (!isDeepEqual(datasource, theDatasource)) {\n // inbound datasource is different, so update theDatasource (to trigger useEffect)\n setDatasource(datasource);\n }\n\n const flattenParameters = (params = {}) => {\n const flatParams = {};\n Object.keys(params).forEach(key => {\n const { name, value: theVal } = params[key];\n flatParams[name] = theVal;\n });\n\n return flatParams;\n };\n\n // convert associated to datapage listtype and transform props\n // Process deferDatasource when datapage name is present. WHhen tableType is promptList / localList\n if (deferDatasource && datasourceMetadata?.datasource?.name) {\n listType = 'datapage';\n datasource = datasourceMetadata.datasource.name;\n parameters = flattenParameters(datasourceMetadata?.datasource?.parameters);\n const displayProp = datasourceMetadata.datasource.propertyForDisplayText.startsWith('@P')\n ? datasourceMetadata.datasource.propertyForDisplayText.substring(3)\n : datasourceMetadata.datasource.propertyForDisplayText;\n const valueProp = datasourceMetadata.datasource.propertyForValue.startsWith('@P')\n ? datasourceMetadata.datasource.propertyForValue.substring(3)\n : datasourceMetadata.datasource.propertyForValue;\n columns = [\n {\n key: 'true',\n setProperty: 'Associated property',\n value: valueProp\n },\n {\n display: 'true',\n primary: 'true',\n useForSearch: true,\n value: displayProp\n }\n ];\n }\n columns = preProcessColumns(columns);\n\n useEffect(() => {\n if (listType === 'associated') {\n setOptions(Utils.getOptionList(props, getPConnect().getDataObject()));\n }\n }, [theDatasource]);\n\n useEffect(() => {\n if (!displayMode && listType !== 'associated') {\n getDataPage(datasource, parameters, context).then((results: any) => {\n const optionsData: Array<any> = [];\n const displayColumn = getDisplayFieldsMetaData(columns);\n results?.forEach(element => {\n const val = element[displayColumn.primary]?.toString();\n const obj = {\n key: element[displayColumn.key] \|\| element.pyGUID,\n value: val\n };\n optionsData.push(obj);\n });\n setOptions(optionsData);\n });\n }\n }, []);\n\n if (displayMode === 'LABELS_LEFT') {\n const field = {\n [label]: value\n };\n return <FieldValueList item={field} />;\n }\n\n if (value) {\n const index = options?.findIndex(element => element.key === value);\n if (index > -1) {\n selectedValue = options[index].value;\n } else {\n selectedValue = value;\n }\n }\n\n const handleChange = (event: object, newValue) => {\n const val = newValue ? newValue.key : '';\n handleEvent(actionsApi, 'changeNblur', propName, val);\n if (onRecordChange) {\n onRecordChange(event);\n }\n };\n\n const handleInputValue = (event, newInputValue) => {\n setInputValue(newInputValue);\n };\n\n if (readOnly) {\n const theValAsString = options?.find(opt => opt.key === value)?.value;\n return <TextInput {...props} value={theValAsString} />;\n }\n // Need to use both getOptionLabel and getOptionSelected to map our\n // key/value structure to what Autocomplete expects\n return (\n <Autocomplete\n options={options}\n getOptionLabel={(option: IOption) => {\n return option.value ? option.value : '';\n }}\n getOptionSelected={(option: any) => {\n return option.value ? option.value : '';\n }}\n fullWidth\n onChange={handleChange}\n value={selectedValue}\n inputValue={inputValue \|\| selectedValue}\n onInputChange={handleInputValue}\n renderInput={params => (\n <TextField\n {...params}\n fullWidth\n variant='outlined'\n helperText={helperTextToDisplay}\n placeholder={placeholder}\n size='small'\n required={required}\n error={status === 'error'}\n label={label}\n data-test-id={testId}\n />\n )}\n />\n );\n}\n"]}
1	+ {"version":3,"file":"AutoComplete.js","sourceRoot":"","sources":["../../../../src/components/field/AutoComplete/AutoComplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { TextField } from '@material-ui/core';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport Utils from '../../helpers/utils';\nimport TextInput from '../TextInput';\nimport isDeepEqual from 'fast-deep-equal/react';\nimport { getDataPage } from '../../helpers/data_page';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\n\ninterface IOption {\n key: string;\n value: string;\n}\n\nconst preProcessColumns = columnList => {\n return columnList.map(col => {\n const tempColObj = { ...col };\n tempColObj.value = col.value && col.value.startsWith('.') ? col.value.substring(1) : col.value;\n return tempColObj;\n });\n};\n\nconst getDisplayFieldsMetaData = columnList => {\n const displayColumns = columnList.filter(col => col.display === 'true');\n const metaDataObj: any = { key: '', primary: '', secondary: [] };\n const keyCol = columnList.filter(col => col.key === 'true');\n metaDataObj.key = keyCol.length > 0 ? keyCol[0].value : 'auto';\n for (let index = 0; index < displayColumns.length; index += 1) {\n if (displayColumns[index].primary === 'true') {\n metaDataObj.primary = displayColumns[index].value;\n } else {\n metaDataObj.secondary.push(displayColumns[index].value);\n }\n }\n return metaDataObj;\n};\n\nexport default function AutoComplete(props) {\n const {\n getPConnect,\n label,\n required,\n placeholder,\n value = '',\n validatemessage,\n readOnly,\n testId,\n displayMode,\n deferDatasource,\n datasourceMetadata,\n status,\n helperText,\n hideLabel,\n onRecordChange\n } = props;\n const context = getPConnect().getContextName();\n let { listType, parameters, datasource = [], columns = [] } = props;\n const [inputValue, setInputValue] = useState('');\n const [options, setOptions] = useState<Array<IOption>>([]);\n const [theDatasource, setDatasource] = useState(null);\n let selectedValue: any = '';\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n const thePConn = getPConnect();\n const actionsApi = thePConn.getActionsApi();\n const propName = thePConn.getStateProps().value;\n\n if (!isDeepEqual(datasource, theDatasource)) {\n // inbound datasource is different, so update theDatasource (to trigger useEffect)\n setDatasource(datasource);\n }\n\n const flattenParameters = (params = {}) => {\n const flatParams = {};\n Object.keys(params).forEach(key => {\n const { name, value: theVal } = params[key];\n flatParams[name] = theVal;\n });\n\n return flatParams;\n };\n\n // convert associated to datapage listtype and transform props\n // Process deferDatasource when datapage name is present. WHhen tableType is promptList / localList\n if (deferDatasource && datasourceMetadata?.datasource?.name) {\n listType = 'datapage';\n datasource = datasourceMetadata.datasource.name;\n parameters = flattenParameters(datasourceMetadata?.datasource?.parameters);\n const displayProp = datasourceMetadata.datasource.propertyForDisplayText.startsWith('@P')\n ? datasourceMetadata.datasource.propertyForDisplayText.substring(3)\n : datasourceMetadata.datasource.propertyForDisplayText;\n const valueProp = datasourceMetadata.datasource.propertyForValue.startsWith('@P')\n ? datasourceMetadata.datasource.propertyForValue.substring(3)\n : datasourceMetadata.datasource.propertyForValue;\n columns = [\n {\n key: 'true',\n setProperty: 'Associated property',\n value: valueProp\n },\n {\n display: 'true',\n primary: 'true',\n useForSearch: true,\n value: displayProp\n }\n ];\n }\n columns = preProcessColumns(columns);\n\n useEffect(() => {\n if (listType === 'associated') {\n setOptions(Utils.getOptionList(props, getPConnect().getDataObject()));\n }\n }, [theDatasource]);\n\n useEffect(() => {\n if (!displayMode && listType !== 'associated') {\n getDataPage(datasource, parameters, context).then((results: any) => {\n const optionsData: Array<any> = [];\n const displayColumn = getDisplayFieldsMetaData(columns);\n results?.forEach(element => {\n const val = element[displayColumn.primary]?.toString();\n const obj = {\n key: element[displayColumn.key] \|\| element.pyGUID,\n value: val\n };\n optionsData.push(obj);\n });\n setOptions(optionsData);\n });\n }\n }, []);\n\n if (displayMode === 'LABELS_LEFT') {\n return <FieldValueList name={hideLabel ? '' : label} value={value} />;\n }\n\n if (displayMode === 'STACKED_LARGE_VAL') {\n return <FieldValueList name={hideLabel ? '' : label} value={value} variant='stacked' />;\n }\n\n if (value) {\n const index = options?.findIndex(element => element.key === value);\n if (index > -1) {\n selectedValue = options[index].value;\n } else {\n selectedValue = value;\n }\n }\n\n const handleChange = (event: object, newValue) => {\n const val = newValue ? newValue.key : '';\n handleEvent(actionsApi, 'changeNblur', propName, val);\n if (onRecordChange) {\n onRecordChange(event);\n }\n };\n\n const handleInputValue = (event, newInputValue) => {\n setInputValue(newInputValue);\n };\n\n if (readOnly) {\n const theValAsString = options?.find(opt => opt.key === value)?.value;\n return <TextInput {...props} value={theValAsString} />;\n }\n // Need to use both getOptionLabel and getOptionSelected to map our\n // key/value structure to what Autocomplete expects\n return (\n <Autocomplete\n options={options}\n getOptionLabel={(option: IOption) => {\n return option.value ? option.value : '';\n }}\n getOptionSelected={(option: any) => {\n return option.value ? option.value : '';\n }}\n fullWidth\n onChange={handleChange}\n value={selectedValue}\n inputValue={inputValue \|\| selectedValue}\n onInputChange={handleInputValue}\n renderInput={params => (\n <TextField\n {...params}\n fullWidth\n variant='outlined'\n helperText={helperTextToDisplay}\n placeholder={placeholder}\n size='small'\n required={required}\n error={status === 'error'}\n label={label}\n data-test-id={testId}\n />\n )}\n />\n );\n}\n"]}

package/lib/components/field/Checkbox/Checkbox.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/field/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAWA,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,KAAA,~~eAkE9C~~"}
1	+ {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/field/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAWA,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,KAAA,eAoE9C"}

package/lib/components/field/Checkbox/Checkbox.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { Checkbox, FormControl, FormControlLabel, FormGroup, FormHelperText } fr
 import handleEvent from '../../helpers/event-utils';
 import FieldValueList from '../../designSystemExtension/FieldValueList';
 export default function CheckboxComponent(props) {
-    const { getPConnect, label, value = false, readOnly, testId, required, status, helperText, validatemessage, displayMode } = props;
+    const { getPConnect, label, value = false, readOnly, testId, required, status, helperText, validatemessage, displayMode, hideLabel } = props;
     const helperTextToDisplay = validatemessage || helperText;
     const thePConn = getPConnect();
     const theConfigProps = thePConn.getConfigProps();
@@ -16,10 +16,10 @@ export default function CheckboxComponent(props) {
         setChecked(value);
     }, [value]);
     if (displayMode === 'LABELS_LEFT') {
-        const field = {
-            [label]: value
-        };
-        return React.createElement(FieldValueList, { item: field });
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: value });
+    }
+    if (displayMode === 'STACKED_LARGE_VAL') {
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: value, variant: 'stacked' });
     }
     const handleChange = event => {
         handleEvent(actionsApi, 'changeNblur', propName, event.target.checked);

package/lib/components/field/Checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/field/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EACL,QAAQ,EACR,WAAW,EACX,gBAAgB,EAChB,SAAS,EACT,cAAc,EACf,MAAM,mBAAmB,CAAC;AAC3B,OAAO,WAAW,MAAM,2BAA2B,CAAC;AACpD,OAAO,cAAc,MAAM,4CAA4C,CAAC;AAExE,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK;IAC7C,MAAM,EACJ,WAAW,EACX,KAAK,EACL,KAAK,GAAG,KAAK,EACb,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAM,EACN,UAAU,EACV,eAAe,EACf,WAAW,~~EACZ~~,GAAG,KAAK,CAAC;IACV,MAAM,mBAAmB,GAAG,eAAe,IAAI,UAAU,CAAC;IAE1D,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,cAAc,GAAG,QAAQ,CAAC,cAAc,EAAE,CAAC;IACjD,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,CAAC;IACnC,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,EAAE,CAAC;IAC5C,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC;IAEhD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,SAAS,CAAC,GAAG,EAAE;QACb,+FAA+F;QAC/F,UAAU,CAAC,KAAK,CAAC,CAAC;IACpB,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAI,WAAW,KAAK,aAAa,EAAE;QACjC,~~MAAM~~,~~KAAK~~,~~GAAG;YACZ~~,CAAC,~~KAAK~~,CAAC,EAAE,KAAK~~;SACf~~,CAAC;~~QACF~~,OAAO,oBAAC,cAAc,IAAC,IAAI,EAAE,KAAK,~~GAAI~~,CAAC;~~KACxC~~;IAED,MAAM,YAAY,GAAG,KAAK,CAAC,EAAE;QAC3B,WAAW,CAAC,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IACzE,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE;QACzB,QAAQ,CAAC,gBAAgB,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,IAAI,WAAW,GAAG,oBAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC;IAE/C,IAAI,QAAQ,EAAE;QACZ,sGAAsG;QACtG,yGAAyG;QACzG,WAAW,GAAG,oBAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAAI,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC;KAC/F;IAED,OAAO,CACL,oBAAC,WAAW,IAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO;QACxD,oBAAC,SAAS;YACR,oBAAC,gBAAgB,IACf,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EAC9C,MAAM,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EAC1C,KAAK,EAAE,OAAO,EACd,cAAc,EAAC,KAAK,kBACN,MAAM,GACpB,CACQ;QACZ,oBAAC,cAAc,QAAE,mBAAmB,CAAkB,CAC1C,CACf,CAAC;AACJ,CAAC","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport {\n Checkbox,\n FormControl,\n FormControlLabel,\n FormGroup,\n FormHelperText\n} from '@material-ui/core';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\n\nexport default function CheckboxComponent(props) {\n const {\n getPConnect,\n label,\n value = false,\n readOnly,\n testId,\n required,\n status,\n helperText,\n validatemessage,\n displayMode\n } = props;\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n const thePConn = getPConnect();\n const theConfigProps = thePConn.getConfigProps();\n const { caption } = theConfigProps;\n const actionsApi = thePConn.getActionsApi();\n const propName = thePConn.getStateProps().value;\n\n const [checked, setChecked] = useState(false);\n useEffect(() => {\n // This update theSelectedButton which will update the UI to show the selected button correctly\n setChecked(value);\n }, [value]);\n\n if (displayMode === 'LABELS_LEFT') {\n ~~const~~ ~~field~~ = {\n ~~[label]:~~ ~~value~~\n ~~};\n~~ return <FieldValueList ~~item~~={~~field~~} />;\n }\n\n const handleChange = event => {\n handleEvent(actionsApi, 'changeNblur', propName, event.target.checked);\n };\n\n const handleBlur = event => {\n thePConn.getValidationApi().validate(event.target.checked);\n };\n\n let theCheckbox = <Checkbox color='primary' />;\n\n if (readOnly) {\n // Workaround for lack of InputProps readOnly from https://github.com/mui-org/material-ui/issues/17043\n // Also note that we need to turn off the onChange call in the FormControlLabel wrapper, too. See below!\n theCheckbox = <Checkbox value={value \|\| false} onChange={handleChange} readOnly={readOnly} />;\n }\n\n return (\n <FormControl required={required} error={status === 'error'}>\n <FormGroup>\n <FormControlLabel\n control={theCheckbox}\n checked={checked}\n onChange={!readOnly ? handleChange : undefined}\n onBlur={!readOnly ? handleBlur : undefined}\n label={caption}\n labelPlacement='end'\n data-test-id={testId}\n />\n </FormGroup>\n <FormHelperText>{helperTextToDisplay}</FormHelperText>\n </FormControl>\n );\n}\n"]}
1	+ {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/field/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport {\n Checkbox,\n FormControl,\n FormControlLabel,\n FormGroup,\n FormHelperText\n} from '@material-ui/core';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\n\nexport default function CheckboxComponent(props) {\n const {\n getPConnect,\n label,\n value = false,\n readOnly,\n testId,\n required,\n status,\n helperText,\n validatemessage,\n displayMode,\n hideLabel\n } = props;\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n const thePConn = getPConnect();\n const theConfigProps = thePConn.getConfigProps();\n const { caption } = theConfigProps;\n const actionsApi = thePConn.getActionsApi();\n const propName = thePConn.getStateProps().value;\n\n const [checked, setChecked] = useState(false);\n useEffect(() => {\n // This update theSelectedButton which will update the UI to show the selected button correctly\n setChecked(value);\n }, [value]);\n\n if (displayMode === 'LABELS_LEFT') {\n return <FieldValueList name={hideLabel ? '' : label} value={value} />;\n }\n\n if (displayMode === 'STACKED_LARGE_VAL') {\n return <FieldValueList name={hideLabel ? '' : label} value={value} variant='stacked' />;\n }\n\n const handleChange = event => {\n handleEvent(actionsApi, 'changeNblur', propName, event.target.checked);\n };\n\n const handleBlur = event => {\n thePConn.getValidationApi().validate(event.target.checked);\n };\n\n let theCheckbox = <Checkbox color='primary' />;\n\n if (readOnly) {\n // Workaround for lack of InputProps readOnly from https://github.com/mui-org/material-ui/issues/17043\n // Also note that we need to turn off the onChange call in the FormControlLabel wrapper, too. See below!\n theCheckbox = <Checkbox value={value \|\| false} onChange={handleChange} readOnly={readOnly} />;\n }\n\n return (\n <FormControl required={required} error={status === 'error'}>\n <FormGroup>\n <FormControlLabel\n control={theCheckbox}\n checked={checked}\n onChange={!readOnly ? handleChange : undefined}\n onBlur={!readOnly ? handleBlur : undefined}\n label={caption}\n labelPlacement='end'\n data-test-id={testId}\n />\n </FormGroup>\n <FormHelperText>{helperTextToDisplay}</FormHelperText>\n </FormControl>\n );\n}\n"]}

package/lib/components/field/Currency/Currency.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Currency.d.ts","sourceRoot":"","sources":["../../../../src/components/field/Currency/Currency.tsx"],"names":[],"mappings":";~~AAQA~~,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,KAAA,~~eAgFrC~~"}
1	+ {"version":3,"file":"Currency.d.ts","sourceRoot":"","sources":["../../../../src/components/field/Currency/Currency.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,KAAA,eAuGrC"}

package/lib/components/field/Currency/Currency.js CHANGED Viewed

@@ -3,11 +3,13 @@ import React, { useState, useEffect } from 'react';
 import CurrencyTextField from '@unicef/material-ui-currency-textfield';
 import handleEvent from '../../helpers/event-utils';
 import FieldValueList from '../../designSystemExtension/FieldValueList';
+import { format } from "../../helpers/formatters";
+import { getCurrencyCharacters, getCurrencyOptions } from './currency-utils';
 // Using control from: https://github.com/unicef/material-ui-currency-textfield
 export default function Currency(props) {
     const { getPConnect, label, required, disabled, value = '', validatemessage, status,
     /* onChange, onBlur, */
-    readOnly, testId, helperText, displayMode } = props;
+    readOnly, testId, helperText, displayMode, hideLabel, currencyISOCode = "USD" } = props;
     const pConn = getPConnect();
     const actions = pConn.getActionsApi();
     const propName = pConn.getStateProps().value;
@@ -22,15 +24,27 @@ export default function Currency(props) {
         'data-test-id': testId
     };
     const [currValue, setCurrValue] = useState();
+    const [theCurrSym, setCurrSym] = useState("$");
+    const [theCurrDec, setCurrDec] = useState(".");
+    const [theCurrSep, setCurrSep] = useState(",");
+    useEffect(() => {
+        // currencySymbols looks like this: { theCurrencySymbol: '$', theDecimalIndicator: '.', theSeparator: ',' }
+        const theSymbols = getCurrencyCharacters(currencyISOCode);
+        setCurrSym(theSymbols.theCurrencySymbol);
+        setCurrDec(theSymbols.theDecimalIndicator);
+        setCurrSep(theSymbols.theDigitGroupSeparator);
+    }, [currencyISOCode]);
     useEffect(() => {
         // const testVal = value;
         setCurrValue(value.toString());
     }, [value]);
+    const theCurrencyOptions = getCurrencyOptions(currencyISOCode);
+    const formattedValue = format(value, pConn.getComponentName().toLowerCase(), theCurrencyOptions);
     if (displayMode === 'LABELS_LEFT') {
-        const field = {
-            [label]: value
-        };
-        return React.createElement(FieldValueList, { item: field });
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: formattedValue });
+    }
+    if (displayMode === 'STACKED_LARGE_VAL') {
+        return React.createElement(FieldValueList, { name: hideLabel ? '' : label, value: formattedValue, variant: 'stacked' });
     }
     function currOnChange(event, inValue) {
         // console.log(`Currency currOnChange inValue: ${inValue}`);
@@ -41,6 +55,7 @@ export default function Currency(props) {
         // console.log(`Currency currOnBlur inValue: ${inValue}`);
         handleEvent(actions, 'changeNblur', propName, inValue !== '' ? Number(inValue) : inValue);
     }
-    return (React.createElement(CurrencyTextField, { fullWidth: true, variant: readOnly ? 'standard' : 'outlined', helperText: helperTextToDisplay, placeholder: '', size: 'small', required: required, disabled: disabled, onChange: currOnChange, onBlur: !readOnly ? currOnBlur : undefined, error: status === 'error', label: label, value: currValue, type: 'text', outputFormat: 'number', textAlign: 'left', InputProps: { ...readOnlyProp, inputProps: { ...testProp, value: currValue } } }));
+    // console.log(`theCurrSym: ${theCurrSym} | theCurrDec: ${theCurrDec} | theCurrSep: ${theCurrSep}`);
+    return (React.createElement(CurrencyTextField, { fullWidth: true, variant: readOnly ? 'standard' : 'outlined', helperText: helperTextToDisplay, placeholder: '', size: 'small', required: required, disabled: disabled, onChange: currOnChange, onBlur: !readOnly ? currOnBlur : undefined, error: status === 'error', label: label, value: currValue, type: 'text', outputFormat: 'number', textAlign: 'left', InputProps: { ...readOnlyProp, inputProps: { ...testProp, value: currValue } }, currencySymbol: theCurrSym, decimalCharacter: theCurrDec, digitGroupSeparator: theCurrSep }));
 }
 //# sourceMappingURL=Currency.js.map

package/lib/components/field/Currency/Currency.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Currency.js","sourceRoot":"","sources":["../../../../src/components/field/Currency/Currency.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,iDAAiD;AACjD,OAAO,iBAAiB,MAAM,wCAAwC,CAAC;AACvE,OAAO,WAAW,MAAM,2BAA2B,CAAC;AACpD,OAAO,cAAc,MAAM,4CAA4C,CAAC;~~AAExE~~,+EAA+E;AAE/E,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK;IACpC,MAAM,EACJ,WAAW,EACX,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,KAAK,GAAG,EAAE,EACV,eAAe,EACf,MAAM;IACN,uBAAuB;IACvB,QAAQ,EACR,MAAM,EACN,UAAU,EACV,WAAW,~~EACZ~~,GAAG,KAAK,CAAC;~~IACV~~,MAAM,KAAK,GAAG,WAAW,EAAE,CAAC;IAC5B,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,EAAE,CAAC;IACtC,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC;IAC7C,MAAM,mBAAmB,GAAG,eAAe,IAAI,UAAU,CAAC;IAE1D,4DAA4D;IAE5D,IAAI,YAAY,GAAG,EAAE,CAAC,CAAC,8BAA8B;IAErD,IAAI,QAAQ,EAAE;QACZ,YAAY,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;KACnC;IAED,IAAI,QAAQ,GAAG,EAAE,CAAC;IAElB,QAAQ,GAAG;QACT,cAAc,EAAE,MAAM;KACvB,CAAC;IAEF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAE,CAAC;~~IAE7C~~,SAAS,CAAC,GAAG,EAAE;QACb,yBAAyB;QACzB,YAAY,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IACjC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,~~IAAG~~,~~WAAW~~,~~KAAK~~,~~aAAa~~,~~EAAE~~;~~QAChC~~,MAAM,~~KAAK~~,GAAG~~;YACZ~~,CAAC,KAAK,CAAC,EAAE,KAAK;~~SACf~~,CAAC;~~QACF~~,OAAO,oBAAC,cAAc,IAAC,IAAI,EAAE,KAAK,~~GAAI~~,~~CAAA~~;~~KACvC~~;IAED,SAAS,YAAY,CAAC,KAAK,EAAE,OAAO;QAClC,4DAA4D;QAE5D,wBAAwB;QACxB,YAAY,CAAC,OAAO,CAAC,CAAC;IACxB,CAAC;IAED,SAAS,UAAU,CAAC,KAAK,EAAE,OAAO;QAChC,0DAA0D;QAC1D,WAAW,CAAC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,KAAK,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC5F,CAAC;IAED,OAAO,CACL,oBAAC,iBAAiB,IAChB,SAAS,QACT,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,EAC3C,UAAU,EAAE,mBAAmB,EAC/B,WAAW,EAAC,EAAE,EACd,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EAC1C,KAAK,EAAE,MAAM,KAAK,OAAO,EACzB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,IAAI,EAAC,MAAM,EACX,YAAY,EAAC,QAAQ,EACrB,SAAS,EAAC,MAAM,EAChB,UAAU,EAAE,EAAE,GAAG,YAAY,EAAE,UAAU,EAAE,EAAE,GAAG,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,~~GAC9E~~,CACH,CAAC;AACJ,CAAC","sourcesContent":["import React, { useState, useEffect } from 'react';\n// import { TextField } from \"@material-ui/core\";\nimport CurrencyTextField from '@unicef/material-ui-currency-textfield';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\n\n// Using control from: https://github.com/unicef/material-ui-currency-textfield\n\nexport default function Currency(props) {\n const {\n getPConnect,\n label,\n required,\n disabled,\n value = '',\n validatemessage,\n status,\n /* onChange, onBlur, */\n readOnly,\n testId,\n helperText,\n displayMode\n } = props;\n const pConn = getPConnect();\n const actions = pConn.getActionsApi();\n const propName = pConn.getStateProps().value;\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n // console.log(`Currency: label: ${label} value: ${value}`);\n\n let readOnlyProp = {}; // Note: empty if NOT ReadOnly\n\n if (readOnly) {\n readOnlyProp = { readOnly: true };\n }\n\n let testProp = {};\n\n testProp = {\n 'data-test-id': testId\n };\n\n const [currValue, setCurrValue] = useState();\n\n useEffect(() => {\n // const testVal = value;\n setCurrValue(value.toString());\n }, [value]);\n\n if(displayMode === 'LABELS_LEFT') {\n ~~const~~ ~~field~~ = {\n ~~[label]:~~ ~~value~~\n ~~};\n~~ return <FieldValueList ~~item~~={~~field~~} ~~/>\~~n }\n\n function currOnChange(event, inValue) {\n // console.log(`Currency currOnChange inValue: ${inValue}`);\n\n // update internal value\n setCurrValue(inValue);\n }\n\n function currOnBlur(event, inValue) {\n // console.log(`Currency currOnBlur inValue: ${inValue}`);\n handleEvent(actions, 'changeNblur', propName, inValue !== '' ? Number(inValue) : inValue);\n }\n\n return (\n <CurrencyTextField\n fullWidth\n variant={readOnly ? 'standard' : 'outlined'}\n helperText={helperTextToDisplay}\n placeholder=''\n size='small'\n required={required}\n disabled={disabled}\n onChange={currOnChange}\n onBlur={!readOnly ? currOnBlur : undefined}\n error={status === 'error'}\n label={label}\n value={currValue}\n type='text'\n outputFormat='number'\n textAlign='left'\n InputProps={{ ...readOnlyProp, inputProps: { ...testProp, value: currValue } }}\n />\n );\n}\n"]}
1	+ {"version":3,"file":"Currency.js","sourceRoot":"","sources":["../../../../src/components/field/Currency/Currency.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\n// import { TextField } from \"@material-ui/core\";\nimport CurrencyTextField from '@unicef/material-ui-currency-textfield';\nimport handleEvent from '../../helpers/event-utils';\nimport FieldValueList from '../../designSystemExtension/FieldValueList';\nimport { format } from \"../../helpers/formatters\";\nimport { getCurrencyCharacters, getCurrencyOptions } from './currency-utils';\n\n// Using control from: https://github.com/unicef/material-ui-currency-textfield\n\nexport default function Currency(props) {\n const {\n getPConnect,\n label,\n required,\n disabled,\n value = '',\n validatemessage,\n status,\n /* onChange, onBlur, */\n readOnly,\n testId,\n helperText,\n displayMode,\n hideLabel,\n currencyISOCode = \"USD\"\n } = props;\n\n const pConn = getPConnect();\n const actions = pConn.getActionsApi();\n const propName = pConn.getStateProps().value;\n const helperTextToDisplay = validatemessage \|\| helperText;\n\n // console.log(`Currency: label: ${label} value: ${value}`);\n\n let readOnlyProp = {}; // Note: empty if NOT ReadOnly\n\n if (readOnly) {\n readOnlyProp = { readOnly: true };\n }\n\n let testProp = {};\n\n testProp = {\n 'data-test-id': testId\n };\n\n const [currValue, setCurrValue] = useState();\n const [theCurrSym, setCurrSym] = useState(\"$\");\n const [theCurrDec, setCurrDec] = useState(\".\");\n const [theCurrSep, setCurrSep] = useState(\",\");\n\n useEffect(() => {\n // currencySymbols looks like this: { theCurrencySymbol: '$', theDecimalIndicator: '.', theSeparator: ',' }\n const theSymbols = getCurrencyCharacters(currencyISOCode);\n setCurrSym(theSymbols.theCurrencySymbol);\n setCurrDec(theSymbols.theDecimalIndicator);\n setCurrSep(theSymbols.theDigitGroupSeparator);\n }, [currencyISOCode]);\n\n useEffect(() => {\n // const testVal = value;\n setCurrValue(value.toString());\n }, [value]);\n\n const theCurrencyOptions = getCurrencyOptions(currencyISOCode);\n const formattedValue = format(value, pConn.getComponentName().toLowerCase(), theCurrencyOptions);\n\n if (displayMode === 'LABELS_LEFT') {\n return <FieldValueList name={hideLabel ? '' : label} value={formattedValue} />;\n }\n\n if (displayMode === 'STACKED_LARGE_VAL') {\n return <FieldValueList name={hideLabel ? '' : label} value={formattedValue} variant='stacked' />;\n }\n\n function currOnChange(event, inValue) {\n // console.log(`Currency currOnChange inValue: ${inValue}`);\n\n // update internal value\n setCurrValue(inValue);\n }\n\n function currOnBlur(event, inValue) {\n // console.log(`Currency currOnBlur inValue: ${inValue}`);\n handleEvent(actions, 'changeNblur', propName, inValue !== '' ? Number(inValue) : inValue);\n }\n\n // console.log(`theCurrSym: ${theCurrSym} \| theCurrDec: ${theCurrDec} \| theCurrSep: ${theCurrSep}`);\n\n return (\n <CurrencyTextField\n fullWidth\n variant={readOnly ? 'standard' : 'outlined'}\n helperText={helperTextToDisplay}\n placeholder=''\n size='small'\n required={required}\n disabled={disabled}\n onChange={currOnChange}\n onBlur={!readOnly ? currOnBlur : undefined}\n error={status === 'error'}\n label={label}\n value={currValue}\n type='text'\n outputFormat='number'\n textAlign='left'\n InputProps={{ ...readOnlyProp, inputProps: { ...testProp, value: currValue } }}\n currencySymbol={theCurrSym}\n decimalCharacter={theCurrDec}\n digitGroupSeparator={theCurrSep}\n />\n );\n}\n"]}

package/lib/components/field/Currency/currency-utils.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+export declare const getCurrencyOptions: (inISOCode: string) => {
+    locale: any;
+    style: string;
+    currency: string;
+};
+export declare const getCurrencyCharacters: (inISOCode: string) => {
+    theCurrencySymbol: string;
+    theDecimalIndicator: string;
+    theDigitGroupSeparator: string;
+};
+//# sourceMappingURL=currency-utils.d.ts.map

package/lib/components/field/Currency/currency-utils.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"currency-utils.d.ts","sourceRoot":"","sources":["../../../../src/components/field/Currency/currency-utils.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,kBAAkB,cAAe,MAAM;;;;CAsCnD,CAAA;AAGD,eAAO,MAAM,qBAAqB,cAAe,MAAM;;;;CA2BtD,CAAA"}

package/lib/components/field/Currency/currency-utils.js ADDED Viewed

@@ -0,0 +1,60 @@
+// eslint-disable-next-line import/no-named-default
+import { default as CurrencyAlias } from '../../helpers/formatters/Currency';
+// eslint-disable-next-line import/no-named-default
+import { default as CurrencyMapAlias } from '../../helpers/formatters/CurrencyMap';
+export const getCurrencyOptions = (inISOCode) => {
+    const operatorLocale = PCore.getEnvironmentInfo().getUseLocale() || 'en-US';
+    let currMapToUse = CurrencyMapAlias.US;
+    let localeToUse = operatorLocale;
+    // Determine CurrencyMap lookup based on ISO code (if specified).
+    //  If no ISO code, use locale
+    //  If no locale, default to US
+    if (inISOCode) {
+        if (inISOCode === "EUR") {
+            currMapToUse = CurrencyMapAlias.NL;
+            localeToUse = "nl-NL";
+        }
+        else {
+            // For all other ISO codes, use first 2 characters as the lookup from CurrencyMap
+            const countryCode = inISOCode.substring(0, 2);
+            currMapToUse = CurrencyMapAlias[countryCode];
+        }
+    }
+    else if (operatorLocale) {
+        // No ISO Code so check for operator locale (and force upper case for lookup)
+        const countryCode = operatorLocale.substring(3).toUpperCase();
+        currMapToUse = CurrencyMapAlias[countryCode];
+    }
+    else {
+        // no ISO code and no operator locale, default to US
+        currMapToUse = CurrencyMapAlias.US;
+    }
+    // If no currMapToUse at this point, default to US as a failsafe
+    if (!currMapToUse) {
+        currMapToUse = CurrencyMapAlias['US'];
+    }
+    const theCode = currMapToUse.currencyCode.substring(0, 3);
+    const currencyOptions = { locale: localeToUse, style: "currency", currency: theCode };
+    return currencyOptions;
+};
+export const getCurrencyCharacters = (inISOCode) => {
+    const theCurrencyChars = {
+        theCurrencySymbol: '$',
+        theDecimalIndicator: '.',
+        theDigitGroupSeparator: ','
+    };
+    const theCurrencyOptions = getCurrencyOptions(inISOCode);
+    const testValue = 1234.56;
+    const formattedString = CurrencyAlias.Currency(testValue, theCurrencyOptions);
+    // console.log(`formattedString: ${formattedString}`);
+    // Here, we have the formatted string (ex: $1,234.56) where:
+    //  Currency symbol = formattedString[0]
+    //  Separator = formattedString[2]
+    //  DecimalIndicator = formattedString[6];
+    theCurrencyChars.theCurrencySymbol = formattedString[0];
+    theCurrencyChars.theDigitGroupSeparator = formattedString[2];
+    theCurrencyChars.theDecimalIndicator = formattedString[6];
+    // console.log(`theCurrencyChars: symbol: ${theCurrencyChars.theCurrencySymbol} | theDigitGroupSeparator: ${theCurrencyChars.theDigitGroupSeparator} | theDecimalIndicator: ${theCurrencyChars.theDecimalIndicator}`);
+    return theCurrencyChars;
+};
+//# sourceMappingURL=currency-utils.js.map