@pega/react-sdk-components 0.24.4 → 0.25.2

package/lib/components/template/DataReference/DataReferenceAdvancedSearchContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataReferenceAdvancedSearchContext.d.ts","sourceRoot":"","sources":["../../../../src/components/template/DataReference/DataReferenceAdvancedSearchContext.js"],"names":[],"mappings":";AAEA;;;;;GAKG"}

package/lib/components/template/DataReference/DataReferenceAdvancedSearchContext.js

@@ -0,0 +1,9 @@
+import { createContext } from 'react';
+const DataReferenceAdvancedSearchContext = createContext({
+    disableStartingFieldsForReference: true,
+    dataReferenceConfigToChild: {
+        selectionMode: 'single'
+    }
+});
+export default DataReferenceAdvancedSearchContext;
+//# sourceMappingURL=DataReferenceAdvancedSearchContext.js.map

package/lib/components/template/DataReference/DataReferenceAdvancedSearchContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataReferenceAdvancedSearchContext.js","sourceRoot":"","sources":["../../../../src/components/template/DataReference/DataReferenceAdvancedSearchContext.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,kCAAkC,GAAG,aAAa,CAAC;IACvD,iCAAiC,EAAE,IAAI;IACvC,0BAA0B,EAAE;QAC1B,aAAa,EAAE,QAAQ;KACxB;CACF,CAAC,CAAC;AAEH,eAAe,kCAAkC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nconst DataReferenceAdvancedSearchContext = createContext({\n  disableStartingFieldsForReference: true,\n  dataReferenceConfigToChild: {\n    selectionMode: 'single'\n  }\n});\n\nexport default DataReferenceAdvancedSearchContext;\n"]}

package/lib/components/template/DataReference/SearchForm.d.ts

@@ -0,0 +1,3 @@
+declare const SearchForm: (props: any) => import("react/jsx-runtime").JSX.Element;
+export default SearchForm;
+//# sourceMappingURL=SearchForm.d.ts.map

package/lib/components/template/DataReference/SearchForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchForm.d.ts","sourceRoot":"","sources":["../../../../src/components/template/DataReference/SearchForm.tsx"],"names":[],"mappings":"AAyCA,QAAA,MAAM,UAAU,GAAG,UAAK,4CAwGvB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/template/DataReference/SearchForm.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Tab, Tabs, Typography, RadioGroup, FormControlLabel, Radio, Select, MenuItem, Grid, Box } from '@mui/material';
+import { TabContext, TabPanel } from '@mui/lab';
+import { Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';
+import useGetTabsCount from '../../../hooks/useGetTabsCount';
+import { searchtabsClick, getActiveTabId, getFirstVisibleTabId } from '../../template/SubTabs/tabUtils';
+import { getFieldMeta } from './utils';
+const publishEvent = ({ clearSelections, viewName }) => {
+    const payload = {};
+    if (clearSelections) {
+        payload.clearSelections = clearSelections;
+    }
+    if (viewName) {
+        payload.viewName = viewName;
+    }
+    PCore.getPubSubUtils().publish('update-advanced-search-selections', payload);
+};
+const checkIfSelectionsExist = getPConnect => {
+    const { MULTI } = PCore.getConstants().LIST_SELECTION_MODE;
+    const { selectionMode, readonlyContextList, contextPage, contextClass, name } = getPConnect().getConfigProps();
+    const isMultiSelectMode = selectionMode === MULTI;
+    const dataRelationshipContext = contextClass && name ? name : null;
+    const { compositeKeys } = getFieldMeta(getPConnect, dataRelationshipContext);
+    let selectionsExist = false;
+    if (isMultiSelectMode) {
+        selectionsExist = readonlyContextList?.length > 0;
+    }
+    else if (contextPage) {
+        selectionsExist = compositeKeys?.filter(key => !['', null, undefined].includes(contextPage[key]))?.length > 0;
+    }
+    return selectionsExist;
+};
+const SearchForm = props => {
+    const { children, getPConnect, searchSelectCacheKey } = props;
+    const deferLoadedTabs = children[2];
+    const cache = PCore.getNavigationUtils().getComponentCache(searchSelectCacheKey) ?? {};
+    const { selectedCategory } = cache;
+    const firstTabId = getFirstVisibleTabId(deferLoadedTabs, selectedCategory);
+    const [open, setOpen] = useState(false);
+    const [currentTabId, setCurrentTabId] = useState(getActiveTabId(deferLoadedTabs.props.getPConnect().getChildren(), firstTabId));
+    const [nextTabId, setNextTabId] = useState(null); // State to store the next tab ID
+    const { getLocaleValue } = PCore.getLocaleUtils();
+    // @ts-ignore
+    const { data: tabData } = useGetTabsCount(deferLoadedTabs, 'searchForm', currentTabId);
+    const handleTabClick = event => {
+        const tabId = event.target.value;
+        const viewName = tabData
+            .find(tab => tab.id === currentTabId)
+            .getPConnect()
+            .getConfigProps().name;
+        if (checkIfSelectionsExist(getPConnect)) {
+            setNextTabId(tabId); // Store the next tab ID
+            setOpen(true); // Open the dialog
+        }
+        else {
+            // @ts-ignore
+            publishEvent({ viewName, tabId });
+            searchtabsClick(tabId, tabData, currentTabId, setCurrentTabId);
+        }
+    };
+    const clearSelectionAndSwitchTab = () => {
+        const viewName = tabData
+            .find(tab => tab.id === currentTabId)
+            .getPConnect()
+            .getConfigProps().name;
+        publishEvent({ clearSelections: true, viewName });
+        searchtabsClick(nextTabId, tabData, currentTabId, setCurrentTabId);
+        setOpen(false);
+    };
+    const onDialogClose = () => {
+        setOpen(false); // Close the dialog
+    };
+    const tabItems = tabData?.filter(tab => tab.visibility()) || [];
+    const propsToUse = { ...getPConnect().getInheritedProps() };
+    let searchCategoriesComp;
+    if (tabItems.length > 3) {
+        searchCategoriesComp = (_jsx(Grid, { container: true, spacing: 2, children: _jsx(Select, { value: currentTabId, onChange: handleTabClick, fullWidth: true, children: tabItems.map(tab => (_jsx(MenuItem, { value: tab.id, children: tab.name }, tab.id))) }) }));
+    }
+    else if (tabItems.length > 1) {
+        searchCategoriesComp = (_jsx(RadioGroup, { row: true, value: currentTabId, onChange: handleTabClick, children: tabItems.map(tab => (_jsx(FormControlLabel, { value: tab.id, control: _jsx(Radio, {}), label: tab.name }, tab.id))) }));
+    }
+    return (_jsxs(Box, { display: 'flex', flexDirection: 'column', gap: 2, children: [_jsx(Typography, { variant: 'h5', children: propsToUse.label }), searchCategoriesComp, _jsxs(TabContext, { value: currentTabId, children: [_jsx(Tabs, { style: { display: 'none' }, value: currentTabId, onChange: (e, newValue) => setCurrentTabId(newValue), children: tabItems.map(tab => (_jsx(Tab, { label: tab.name, value: tab.id }, tab.id))) }), tabItems.map(tab => (_jsx(TabPanel, { style: { padding: '0px' }, value: tab.id, children: _jsx("div", { className: 'search-form', children: tab.content }) }, tab.id)))] }), _jsxs(Dialog, { open: open, onClose: onDialogClose, children: [_jsx(DialogTitle, { children: getLocaleValue('Discard selections?', 'DataReference') }), _jsx(DialogContent, { children: _jsx("div", { children: getLocaleValue('When changing search categories, any previous selections will be lost.', 'DataReference') }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: onDialogClose, variant: 'outlined', color: 'primary', children: getLocaleValue('Go back', 'ModalContainer') }), _jsx(Button, { onClick: clearSelectionAndSwitchTab, variant: 'contained', color: 'primary', children: getLocaleValue('Discard', 'ModalContainer') })] })] })] }));
+};
+export default SearchForm;
+//# sourceMappingURL=SearchForm.js.map

package/lib/components/template/DataReference/SearchForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchForm.js","sourceRoot":"","sources":["../../../../src/components/template/DataReference/SearchForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport { Tab, Tabs, Typography, RadioGroup, FormControlLabel, Radio, Select, MenuItem, Grid, Box } from '@mui/material';\nimport { TabContext, TabPanel } from '@mui/lab';\nimport { Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\n\nimport useGetTabsCount from '../../../hooks/useGetTabsCount';\nimport { searchtabsClick, getActiveTabId, getFirstVisibleTabId } from '../../template/SubTabs/tabUtils';\nimport { getFieldMeta } from './utils';\n\nconst publishEvent = ({ clearSelections, viewName }) => {\n  const payload: any = {};\n\n  if (clearSelections) {\n    payload.clearSelections = clearSelections;\n  }\n\n  if (viewName) {\n    payload.viewName = viewName;\n  }\n\n  PCore.getPubSubUtils().publish('update-advanced-search-selections', payload);\n};\n\nconst checkIfSelectionsExist = getPConnect => {\n  const { MULTI } = PCore.getConstants().LIST_SELECTION_MODE;\n  const { selectionMode, readonlyContextList, contextPage, contextClass, name } = getPConnect().getConfigProps();\n  const isMultiSelectMode = selectionMode === MULTI;\n\n  const dataRelationshipContext = contextClass && name ? name : null;\n\n  const { compositeKeys } = getFieldMeta(getPConnect, dataRelationshipContext);\n\n  let selectionsExist = false;\n  if (isMultiSelectMode) {\n    selectionsExist = readonlyContextList?.length > 0;\n  } else if (contextPage) {\n    selectionsExist = compositeKeys?.filter(key => !['', null, undefined].includes(contextPage[key]))?.length > 0;\n  }\n  return selectionsExist;\n};\n\nconst SearchForm = props => {\n  const { children, getPConnect, searchSelectCacheKey } = props;\n\n  const deferLoadedTabs = children[2];\n  const cache: any = PCore.getNavigationUtils().getComponentCache(searchSelectCacheKey) ?? {};\n  const { selectedCategory } = cache;\n  const firstTabId = getFirstVisibleTabId(deferLoadedTabs, selectedCategory);\n  const [open, setOpen] = useState(false);\n  const [currentTabId, setCurrentTabId] = useState(getActiveTabId(deferLoadedTabs.props.getPConnect().getChildren(), firstTabId));\n  const [nextTabId, setNextTabId] = useState(null); // State to store the next tab ID\n  const { getLocaleValue } = PCore.getLocaleUtils();\n\n  // @ts-ignore\n  const { data: tabData } = useGetTabsCount(deferLoadedTabs, 'searchForm', currentTabId);\n\n  const handleTabClick = event => {\n    const tabId: any = event.target.value;\n    const viewName = tabData\n      .find(tab => tab.id === currentTabId)\n      .getPConnect()\n      .getConfigProps().name;\n\n    if (checkIfSelectionsExist(getPConnect)) {\n      setNextTabId(tabId); // Store the next tab ID\n      setOpen(true); // Open the dialog\n    } else {\n      // @ts-ignore\n      publishEvent({ viewName, tabId });\n      searchtabsClick(tabId, tabData, currentTabId, setCurrentTabId);\n    }\n  };\n\n  const clearSelectionAndSwitchTab = () => {\n    const viewName = tabData\n      .find(tab => tab.id === currentTabId)\n      .getPConnect()\n      .getConfigProps().name;\n    publishEvent({ clearSelections: true, viewName });\n    searchtabsClick(nextTabId, tabData, currentTabId, setCurrentTabId);\n    setOpen(false);\n  };\n\n  const onDialogClose = () => {\n    setOpen(false); // Close the dialog\n  };\n\n  const tabItems = tabData?.filter(tab => tab.visibility()) || [];\n  const propsToUse = { ...getPConnect().getInheritedProps() };\n\n  let searchCategoriesComp;\n  if (tabItems.length > 3) {\n    searchCategoriesComp = (\n      <Grid container spacing={2}>\n        <Select value={currentTabId} onChange={handleTabClick} fullWidth>\n          {tabItems.map(tab => (\n            <MenuItem key={tab.id} value={tab.id}>\n              {tab.name}\n            </MenuItem>\n          ))}\n        </Select>\n      </Grid>\n    );\n  } else if (tabItems.length > 1) {\n    searchCategoriesComp = (\n      <RadioGroup row value={currentTabId} onChange={handleTabClick}>\n        {tabItems.map(tab => (\n          <FormControlLabel key={tab.id} value={tab.id} control={<Radio />} label={tab.name} />\n        ))}\n      </RadioGroup>\n    );\n  }\n\n  return (\n    <Box display='flex' flexDirection='column' gap={2}>\n      <Typography variant='h5'>{propsToUse.label}</Typography>\n      {searchCategoriesComp}\n      <TabContext value={currentTabId}>\n        <Tabs style={{ display: 'none' }} value={currentTabId} onChange={(e, newValue) => setCurrentTabId(newValue)}>\n          {tabItems.map(tab => (\n            <Tab key={tab.id} label={tab.name} value={tab.id} />\n          ))}\n        </Tabs>\n        {tabItems.map(tab => (\n          <TabPanel style={{ padding: '0px' }} key={tab.id} value={tab.id}>\n            <div className='search-form'>{tab.content}</div>\n          </TabPanel>\n        ))}\n      </TabContext>\n      <Dialog open={open} onClose={onDialogClose}>\n        <DialogTitle>{getLocaleValue('Discard selections?', 'DataReference')}</DialogTitle>\n        <DialogContent>\n          <div>{getLocaleValue('When changing search categories, any previous selections will be lost.', 'DataReference')}</div>\n        </DialogContent>\n        <DialogActions>\n          <Button onClick={onDialogClose} variant='outlined' color='primary'>\n            {getLocaleValue('Go back', 'ModalContainer')}\n          </Button>\n          <Button onClick={clearSelectionAndSwitchTab} variant='contained' color='primary'>\n            {getLocaleValue('Discard', 'ModalContainer')}\n          </Button>\n        </DialogActions>\n      </Dialog>\n    </Box>\n  );\n};\n\nexport default SearchForm;\n"]}

package/lib/components/template/DataReference/utils.d.ts

@@ -0,0 +1,15 @@
+export function getFieldMeta(getPConnect: any, dataRelationshipContext: any): {
+    compositeKeys: any[];
+    fieldMetadata: any;
+};
+export function getFirstChildConfig({ firstChildMeta, getPConnect, rawViewMetadata, contextClass, dataReferenceConfigToChild, isCreateNewReferenceEnabled, disableStartingFieldsForReference, pyID }: {
+    firstChildMeta: any;
+    getPConnect: any;
+    rawViewMetadata: any;
+    contextClass: any;
+    dataReferenceConfigToChild: any;
+    isCreateNewReferenceEnabled: any;
+    disableStartingFieldsForReference: any;
+    pyID: any;
+}): any;
+//# sourceMappingURL=utils.d.ts.map

package/lib/components/template/DataReference/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/template/DataReference/utils.js"],"names":[],"mappings":"AAMA;;;EAyBC;AAkBM;;;;;;;;;QAwCN"}

package/lib/components/template/DataReference/utils.js

@@ -0,0 +1,75 @@
+const isSelfReferencedProperty = (param, referenceProp) => {
+    const [, parentPropName] = param.split('.');
+    const referencePropParent = referenceProp?.split('.').pop();
+    return parentPropName === referencePropParent;
+};
+export function getFieldMeta(getPConnect, dataRelationshipContext) {
+    const pConn = getPConnect();
+    const { selectionMode, selectionList } = pConn.getConfigProps();
+    const { MULTI } = PCore.getConstants().LIST_SELECTION_MODE;
+    const isMultiSelectMode = selectionMode === MULTI;
+    const pageReference = pConn.getPageReference();
+    let referenceProp = isMultiSelectMode ? selectionList.substring(1) : pageReference.substring(pageReference.lastIndexOf('.') + 1);
+    // Replace here to use the context name instead
+    let contextPageReference = null;
+    if (dataRelationshipContext !== null && selectionMode === 'single') {
+        referenceProp = dataRelationshipContext;
+        contextPageReference = pageReference.concat('.').concat(referenceProp);
+    }
+    const fieldMetadata = (isMultiSelectMode ? pConn.getFieldMetadata(`${referenceProp}`) : pConn.getCurrentPageFieldMetadata(contextPageReference)) ?? {};
+    const { datasource: { parameters: fieldParameters = {} } = {} } = fieldMetadata;
+    const compositeKeys = [];
+    Object.values(fieldParameters).forEach(param => {
+        if (isSelfReferencedProperty(param, referenceProp))
+            compositeKeys.push(param.substring(param.lastIndexOf('.') + 1));
+    });
+    return { compositeKeys, fieldMetadata };
+}
+/**
+ * returns array of self-referenced properties of the datasource
+ * Ex: returns ["@P .DataRef.pyGUID", "@P .DataRef.customerID"]
+ */
+const getCompositeKeys = (pConnect, property) => {
+    const fieldMetadata = pConnect.getFieldMetadata(property) || {};
+    const { datasource: { parameters: fieldParameters = {} } = {} } = fieldMetadata;
+    const compositeKeys = [];
+    Object.values(fieldParameters).forEach(param => {
+        if (isSelfReferencedProperty(param, property)) {
+            compositeKeys.push(param);
+        }
+    });
+    return compositeKeys;
+};
+export const getFirstChildConfig = ({ firstChildMeta, getPConnect, rawViewMetadata, contextClass, dataReferenceConfigToChild, isCreateNewReferenceEnabled, disableStartingFieldsForReference, pyID }) => {
+    const config = {
+        ...firstChildMeta.config,
+        ...dataReferenceConfigToChild
+    };
+    const compositeKeys = getCompositeKeys(getPConnect(), dataReferenceConfigToChild?.dataRelationshipContext);
+    return {
+        ...config,
+        viewName: getPConnect().getCurrentView(),
+        referenceList: config.referenceList ?? rawViewMetadata.config.referenceList,
+        parameters: rawViewMetadata.config.parameters,
+        localeReference: rawViewMetadata.config.localeReference,
+        contextClass: config.contextClass || rawViewMetadata?.config?.contextClass || rawViewMetadata?.config?.targetObjectClass,
+        allowAddingNewRecords: firstChildMeta.type === 'SimpleTableSelect' && isCreateNewReferenceEnabled ? true : undefined,
+        actions: firstChildMeta.type === 'SimpleTableSelect' &&
+            isCreateNewReferenceEnabled && [
+            {
+                action: 'ADD_CASE',
+                config: {
+                    label: '@L Add',
+                    caseType: contextClass,
+                    inputFields: disableStartingFieldsForReference
+                        ? {}
+                        : {
+                            [`.pyAddCaseContextPage.${pyID}`]: `@P .${pyID}`
+                        }
+                }
+            }
+        ],
+        compositeKeys
+    };
+};
+//# sourceMappingURL=utils.js.map

package/lib/components/template/DataReference/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/components/template/DataReference/utils.js"],"names":[],"mappings":"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","sourcesContent":["const isSelfReferencedProperty = (param, referenceProp) => {\n  const [, parentPropName] = param.split('.');\n  const referencePropParent = referenceProp?.split('.').pop();\n  return parentPropName === referencePropParent;\n};\n\nexport function getFieldMeta(getPConnect, dataRelationshipContext) {\n  const pConn = getPConnect();\n  const { selectionMode, selectionList } = pConn.getConfigProps();\n  const { MULTI } = PCore.getConstants().LIST_SELECTION_MODE;\n\n  const isMultiSelectMode = selectionMode === MULTI;\n\n  const pageReference = pConn.getPageReference();\n  let referenceProp = isMultiSelectMode ? selectionList.substring(1) : pageReference.substring(pageReference.lastIndexOf('.') + 1);\n  // Replace here to use the context name instead\n  let contextPageReference = null;\n  if (dataRelationshipContext !== null && selectionMode === 'single') {\n    referenceProp = dataRelationshipContext;\n    contextPageReference = pageReference.concat('.').concat(referenceProp);\n  }\n\n  const fieldMetadata =\n    (isMultiSelectMode ? pConn.getFieldMetadata(`${referenceProp}`) : pConn.getCurrentPageFieldMetadata(contextPageReference)) ?? {};\n  const { datasource: { parameters: fieldParameters = {} } = {} } = fieldMetadata;\n  const compositeKeys = [];\n  Object.values(fieldParameters).forEach(param => {\n    if (isSelfReferencedProperty(param, referenceProp)) compositeKeys.push(param.substring(param.lastIndexOf('.') + 1));\n  });\n\n  return { compositeKeys, fieldMetadata };\n}\n\n/**\n * returns array of self-referenced properties of the datasource\n * Ex: returns [\"@P .DataRef.pyGUID\", \"@P .DataRef.customerID\"]\n */\nconst getCompositeKeys = (pConnect, property) => {\n  const fieldMetadata = pConnect.getFieldMetadata(property) || {};\n  const { datasource: { parameters: fieldParameters = {} } = {} } = fieldMetadata;\n  const compositeKeys = [];\n  Object.values(fieldParameters).forEach(param => {\n    if (isSelfReferencedProperty(param, property)) {\n      compositeKeys.push(param);\n    }\n  });\n  return compositeKeys;\n};\n\nexport const getFirstChildConfig = ({\n  firstChildMeta,\n  getPConnect,\n  rawViewMetadata,\n  contextClass,\n  dataReferenceConfigToChild,\n  isCreateNewReferenceEnabled,\n  disableStartingFieldsForReference,\n  pyID\n}) => {\n  const config = {\n    ...firstChildMeta.config,\n    ...dataReferenceConfigToChild\n  };\n  const compositeKeys = getCompositeKeys(getPConnect(), dataReferenceConfigToChild?.dataRelationshipContext);\n  return {\n    ...config,\n    viewName: getPConnect().getCurrentView(),\n    referenceList: config.referenceList ?? rawViewMetadata.config.referenceList,\n    parameters: rawViewMetadata.config.parameters,\n    localeReference: rawViewMetadata.config.localeReference,\n    contextClass: config.contextClass || rawViewMetadata?.config?.contextClass || rawViewMetadata?.config?.targetObjectClass,\n    allowAddingNewRecords: firstChildMeta.type === 'SimpleTableSelect' && isCreateNewReferenceEnabled ? true : undefined,\n    actions: firstChildMeta.type === 'SimpleTableSelect' &&\n      isCreateNewReferenceEnabled && [\n        {\n          action: 'ADD_CASE',\n          config: {\n            label: '@L Add',\n            caseType: contextClass,\n            inputFields: disableStartingFieldsForReference\n              ? {}\n              : {\n                  [`.pyAddCaseContextPage.${pyID}`]: `@P .${pyID}`\n                }\n          }\n        }\n      ],\n    compositeKeys\n  };\n};\n"]}

package/lib/components/template/DefaultForm/DefaultForm.d.ts

@@ -1,5 +1,5 @@
-import { PropsWithChildren } from 'react';
-import { PConnProps } from '../../../types/PConnProps';
+import { type PropsWithChildren } from 'react';
+import type { PConnProps } from '../../../types/PConnProps';
 import './DefaultForm.css';
 interface DefaultFormProps extends PConnProps {
     NumCols: string;

package/lib/components/template/DefaultForm/DefaultForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultForm.d.ts","sourceRoot":"","sources":["../../../../src/components/template/DefaultForm/DefaultForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAOzD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,OAAO,mBAAmB,CAAC;AAE3B,UAAU,gBAAiB,SAAQ,UAAU;IAE3C,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;CACtB;AAQD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,2CA0C7E"}
+{"version":3,"file":"DefaultForm.d.ts","sourceRoot":"","sources":["../../../../src/components/template/DefaultForm/DefaultForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAO9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAE5D,OAAO,mBAAmB,CAAC;AAE3B,UAAU,gBAAiB,SAAQ,UAAU;IAE3C,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;CACtB;AAQD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,2CA0C7E"}

package/lib/components/template/DefaultForm/DefaultForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultForm.js","sourceRoot":"","sources":["../../../../src/components/template/DefaultForm/DefaultForm.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAqB,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,uBAAuB,MAAM,gCAAgC,CAAC;AACrE,OAAO,cAAc,MAAM,2BAA2B,CAAC;AAEvD,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAGhE,OAAO,mBAAmB,CAAC;AAQ3B,MAAM,KAAK,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC,KAAK,CAAC,EAAE;IACpD,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAE3C,OAAO,aAAa,CAAC,uBAAuB,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAChF,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAA0C;IAC5E,MAAM,EAAE,WAAW,EAAE,OAAO,GAAG,GAAG,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,YAAY,GAAG,eAAe,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAExE,IAAI,QAAgB,CAAC;IAErB,MAAM,OAAO,GAAG,OAAO,IAAI,GAAG,CAAC;IAC/B,QAAQ,OAAO,EAAE;QACf,KAAK,GAAG;YACN,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;QACR,KAAK,GAAG;YACN,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;QACR,KAAK,GAAG;YACN,QAAQ,GAAG,gCAAgC,CAAC;YAC5C,MAAM;QACR;YACE,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;KACT;IAED,YAAY;IAEZ,yFAAyF;IACzF,uFAAuF;IACvF,mBAAmB;IACnB,MAAM,UAAU,GAAG,WAAW,EAAE,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,WAAW,EAAE,CAAC;IAC9E,MAAM,UAAU,GAAG,UAAU,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,KAAC,KAAK,OAAqC,GAAG,IAAlC,oBAAoB,CAAC,GAAG,CAAC,CAAa,CAAC,CAAC;IAE9F,OAAO,CACL,8BACG,YAAY,IAAI,CACf,cAAK,SAAS,EAAC,oCAAoC,YAGjD,cAAwB,EAAE,EAAC,kBAAkB,EAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,IAAtF,cAAc,CAA4E,GAC/F,CACP,EACD,cAAK,SAAS,EAAE,QAAQ,YAAG,UAAU,GAAO,IAC3C,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { createElement, PropsWithChildren } from 'react';\n\nimport { getInstructions } from '../../helpers/template-utils';\nimport createPConnectComponent from '../../../bridge/react_pconnect';\nimport connectToState from '../../helpers/state-utils';\n\nimport { getKeyForMappedField, mapStateToProps } from './utils';\nimport { PConnProps } from '../../../types/PConnProps';\n\nimport './DefaultForm.css';\n\ninterface DefaultFormProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  NumCols: string;\n  instructions: string;\n}\n\nconst Child = connectToState(mapStateToProps)(props => {\n  const { key, visibility, ...rest } = props;\n\n  return createElement(createPConnectComponent(), { ...rest, key, visibility });\n});\n\nexport default function DefaultForm(props: PropsWithChildren<DefaultFormProps>) {\n  const { getPConnect, NumCols = '1' } = props;\n  const instructions = getInstructions(getPConnect(), props.instructions);\n\n  let divClass: string;\n\n  const numCols = NumCols || '1';\n  switch (numCols) {\n    case '1':\n      divClass = 'psdk-default-form-one-column';\n      break;\n    case '2':\n      divClass = 'psdk-default-form-two-column';\n      break;\n    case '3':\n      divClass = 'psdk-default-form-three-column';\n      break;\n    default:\n      divClass = 'psdk-default-form-one-column';\n      break;\n  }\n\n  // debugger;\n\n  // repoint the children because they are in a region and we need to not render the region\n  // to take the children and create components for them, put in an array and pass as the\n  // defaultForm kids\n  const arChildren = getPConnect().getChildren()[0].getPConnect().getChildren();\n  const dfChildren = arChildren?.map(kid => <Child key={getKeyForMappedField(kid)} {...kid} />);\n\n  return (\n    <>\n      {instructions && (\n        <div className='psdk-default-form-instruction-text'>\n          {/* server performs sanitization method for instructions html content */}\n          {/* eslint-disable react/no-danger */}\n          <div key='instructions' id='instruction-text' dangerouslySetInnerHTML={{ __html: instructions }} />\n        </div>\n      )}\n      <div className={divClass}>{dfChildren}</div>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"DefaultForm.js","sourceRoot":"","sources":["../../../../src/components/template/DefaultForm/DefaultForm.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAA0B,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,uBAAuB,MAAM,gCAAgC,CAAC;AACrE,OAAO,cAAc,MAAM,2BAA2B,CAAC;AAEvD,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAGhE,OAAO,mBAAmB,CAAC;AAQ3B,MAAM,KAAK,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC,KAAK,CAAC,EAAE;IACpD,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAE3C,OAAO,aAAa,CAAC,uBAAuB,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAChF,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAA0C;IAC5E,MAAM,EAAE,WAAW,EAAE,OAAO,GAAG,GAAG,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,YAAY,GAAG,eAAe,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAExE,IAAI,QAAgB,CAAC;IAErB,MAAM,OAAO,GAAG,OAAO,IAAI,GAAG,CAAC;IAC/B,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,GAAG;YACN,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;QACR,KAAK,GAAG;YACN,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;QACR,KAAK,GAAG;YACN,QAAQ,GAAG,gCAAgC,CAAC;YAC5C,MAAM;QACR;YACE,QAAQ,GAAG,8BAA8B,CAAC;YAC1C,MAAM;IACV,CAAC;IAED,YAAY;IAEZ,yFAAyF;IACzF,uFAAuF;IACvF,mBAAmB;IACnB,MAAM,UAAU,GAAG,WAAW,EAAE,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,WAAW,EAAE,CAAC;IAC9E,MAAM,UAAU,GAAG,UAAU,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,KAAC,KAAK,OAAqC,GAAG,IAAlC,oBAAoB,CAAC,GAAG,CAAC,CAAa,CAAC,CAAC;IAE9F,OAAO,CACL,8BACG,YAAY,IAAI,CACf,cAAK,SAAS,EAAC,oCAAoC,YAGjD,cAAwB,EAAE,EAAC,kBAAkB,EAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,IAAtF,cAAc,CAA4E,GAC/F,CACP,EACD,cAAK,SAAS,EAAE,QAAQ,YAAG,UAAU,GAAO,IAC3C,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { createElement, type PropsWithChildren } from 'react';\n\nimport { getInstructions } from '../../helpers/template-utils';\nimport createPConnectComponent from '../../../bridge/react_pconnect';\nimport connectToState from '../../helpers/state-utils';\n\nimport { getKeyForMappedField, mapStateToProps } from './utils';\nimport type { PConnProps } from '../../../types/PConnProps';\n\nimport './DefaultForm.css';\n\ninterface DefaultFormProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  NumCols: string;\n  instructions: string;\n}\n\nconst Child = connectToState(mapStateToProps)(props => {\n  const { key, visibility, ...rest } = props;\n\n  return createElement(createPConnectComponent(), { ...rest, key, visibility });\n});\n\nexport default function DefaultForm(props: PropsWithChildren<DefaultFormProps>) {\n  const { getPConnect, NumCols = '1' } = props;\n  const instructions = getInstructions(getPConnect(), props.instructions);\n\n  let divClass: string;\n\n  const numCols = NumCols || '1';\n  switch (numCols) {\n    case '1':\n      divClass = 'psdk-default-form-one-column';\n      break;\n    case '2':\n      divClass = 'psdk-default-form-two-column';\n      break;\n    case '3':\n      divClass = 'psdk-default-form-three-column';\n      break;\n    default:\n      divClass = 'psdk-default-form-one-column';\n      break;\n  }\n\n  // debugger;\n\n  // repoint the children because they are in a region and we need to not render the region\n  // to take the children and create components for them, put in an array and pass as the\n  // defaultForm kids\n  const arChildren = getPConnect().getChildren()[0].getPConnect().getChildren();\n  const dfChildren = arChildren?.map(kid => <Child key={getKeyForMappedField(kid)} {...kid} />);\n\n  return (\n    <>\n      {instructions && (\n        <div className='psdk-default-form-instruction-text'>\n          {/* server performs sanitization method for instructions html content */}\n          {/* eslint-disable react/no-danger */}\n          <div key='instructions' id='instruction-text' dangerouslySetInnerHTML={{ __html: instructions }} />\n        </div>\n      )}\n      <div className={divClass}>{dfChildren}</div>\n    </>\n  );\n}\n"]}

package/lib/components/template/DefaultForm/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/DefaultForm/utils/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,EAAE,GAO7B,CAAC;AAEF,eAAO,MAAM,oBAAoB,qBAgBhC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/DefaultForm/utils/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,EAAE,GAO7B,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAG,UAAK,QAgBxC,CAAC"}

package/lib/components/template/DefaultForm/utils/index.js

@@ -1,4 +1,3 @@
-import { v4 as uuidv4 } from 'uuid';
 export const mapStateToProps = (_, ownProps) => {
     const { getPConnect } = ownProps;
     return {
@@ -18,6 +17,6 @@ export const getKeyForMappedField = field => {
     if (pConnect?.meta) {
         return JSON.stringify(pConnect.meta);
     }
-    return uuidv4();
+    return crypto.randomUUID();
 };
 //# sourceMappingURL=index.js.map

package/lib/components/template/DefaultForm/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/template/DefaultForm/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,IAAI,MAAM,EAAE,MAAM,MAAM,CAAC;AAEpC,MAAM,CAAC,MAAM,eAAe,GAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE;IAClD,MAAM,EAAE,WAAW,EAAE,GAAG,QAAQ,CAAC;IAEjC,OAAO;QACL,UAAU,EAAE,WAAW,EAAE,CAAC,qBAAqB,EAAE;QACjD,WAAW;KACZ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,CAAC,EAAE;IAC1C,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QACxB,OAAO,KAAK;aACT,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO,oBAAoB,CAAC,IAAI,CAAC,CAAC;QACpC,CAAC,CAAC;aACD,IAAI,CAAC,IAAI,CAAC,CAAC;KACf;IAED,MAAM,QAAQ,GAAG,KAAK,EAAE,WAAW,EAAE,EAAE,CAAC;IAExC,IAAI,QAAQ,EAAE,IAAI,EAAE;QAClB,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;KACtC;IAED,OAAO,MAAM,EAAE,CAAC;AAClB,CAAC,CAAC","sourcesContent":["import { v4 as uuidv4 } from 'uuid';\n\nexport const mapStateToProps: any = (_, ownProps) => {\n  const { getPConnect } = ownProps;\n\n  return {\n    visibility: getPConnect().getComputedVisibility(),\n    getPConnect\n  };\n};\n\nexport const getKeyForMappedField = field => {\n  if (Array.isArray(field)) {\n    return field\n      .map(item => {\n        return getKeyForMappedField(item);\n      })\n      .join('__');\n  }\n\n  const pConnect = field?.getPConnect?.();\n\n  if (pConnect?.meta) {\n    return JSON.stringify(pConnect.meta);\n  }\n\n  return uuidv4();\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/template/DefaultForm/utils/index.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,eAAe,GAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE;IAClD,MAAM,EAAE,WAAW,EAAE,GAAG,QAAQ,CAAC;IAEjC,OAAO;QACL,UAAU,EAAE,WAAW,EAAE,CAAC,qBAAqB,EAAE;QACjD,WAAW;KACZ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,CAAC,EAAE;IAC1C,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACzB,OAAO,KAAK;aACT,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO,oBAAoB,CAAC,IAAI,CAAC,CAAC;QACpC,CAAC,CAAC;aACD,IAAI,CAAC,IAAI,CAAC,CAAC;IAChB,CAAC;IAED,MAAM,QAAQ,GAAG,KAAK,EAAE,WAAW,EAAE,EAAE,CAAC;IAExC,IAAI,QAAQ,EAAE,IAAI,EAAE,CAAC;QACnB,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;IAED,OAAO,MAAM,CAAC,UAAU,EAAE,CAAC;AAC7B,CAAC,CAAC","sourcesContent":["export const mapStateToProps: any = (_, ownProps) => {\n  const { getPConnect } = ownProps;\n\n  return {\n    visibility: getPConnect().getComputedVisibility(),\n    getPConnect\n  };\n};\n\nexport const getKeyForMappedField = field => {\n  if (Array.isArray(field)) {\n    return field\n      .map(item => {\n        return getKeyForMappedField(item);\n      })\n      .join('__');\n  }\n\n  const pConnect = field?.getPConnect?.();\n\n  if (pConnect?.meta) {\n    return JSON.stringify(pConnect.meta);\n  }\n\n  return crypto.randomUUID();\n};\n"]}

package/lib/components/template/Details/Details/Details.d.ts

@@ -1,4 +1,4 @@
-import { PConnProps } from '../../../../types/PConnProps';
+import type { PConnProps } from '../../../../types/PConnProps';
 interface DetailsProps extends PConnProps {
     label: string;
     showLabel: boolean;

package/lib/components/template/Details/Details/Details.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/Details/Details.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE1D,UAAU,YAAa,SAAQ,UAAU;IAEvC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAK,EAAE,YAAY,2CA0DlD"}
+{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/Details/Details.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE/D,UAAU,YAAa,SAAQ,UAAU;IAEvC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAK,EAAE,YAAY,2CA0DlD"}

package/lib/components/template/Details/Details/Details.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement } from 'react';
-import Grid from '@material-ui/core/Grid';
+import Grid from '@mui/material/Grid';
 import createPConnectComponent from '../../../../bridge/react_pconnect';
 import { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';
 export default function Details(props) {
@@ -11,7 +11,7 @@ export default function Details(props) {
     const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };
     // Set display mode prop and re-create the children so this part of the dom tree renders
     // in a readonly (display) mode instead of a editable
-    getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');
+    getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');
     getPConnect().setInheritedProp('readOnly', true);
     const children = getPConnect().getChildren().map((configObject, index) => createElement(createPConnectComponent(), {
         ...configObject,

package/lib/components/template/Details/Details/Details.js.map

@@ -1 +1 @@
-{"version":3,"file":"Details.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/Details/Details.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAE1C,OAAO,uBAAuB,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA8C,CAAC;AAUnF,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAmB;IACjD,8EAA8E;IAC9E,MAAM,UAAU,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC;IAErE,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,wFAAwF;IACxF,qDAAqD;IACrD,WAAW,EAAE,CAAC,gBAAgB,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;IAC7D,WAAW,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAI,WAAW,EAAE,CAAC,WAAW,EAAY,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE,CAClF,aAAa,CAAC,uBAAuB,EAAE,EAAE;QACvC,GAAG,YAAY;QACf,oDAAoD;QACpD,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE;KACtB,CAAC,CACH,CAAC;IAEF,4GAA4G;IAC5G,IAAI,kBAAkB,GAAG,EAAE,CAAC;IAC5B,IAAI,mBAAmB,EAAE;QACvB,MAAM,EAAE,eAAe,GAAG,EAAE,EAAE,GAAI,WAAW,EAAE,CAAC,cAAc,EAAU,CAAC,MAAM,CAAC;QAChF,kBAAkB,GAAG,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YAC/C,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,mBAAmB,CAAC;YAE/C,iDAAiD;YACjD,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,KAAK,kBAAkB,EAAE;gBAC7C,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;gBACzB,KAAK,CAAC,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;aACrC;YAED,OAAO,WAAW,EAAE,CAAC,eAAe,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,6FAA6F;QACvJ,CAAC,CAAC,CAAC;KACJ;IAED,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,aAC3D,mBAAmB,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC,IAAI,CACvD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,YACtD,kBAAkB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,EAAE,YACd,KAAK,IADgB,MAAM,CAAC,GAAG,CAAC,EAAE,CAE9B,CACR,CAAC,GACG,CACR,EACD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,YACvB,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAC1B,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,EAAE,YACd,KAAK,IADgB,KAAK,CAAC,GAAG,CAAC,EAAE,CAE7B,CACR,CAAC,GACG,IACI,CACd,CAAC;AACJ,CAAC","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@material-ui/core/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  label: string;\n  showLabel: boolean;\n  showHighlightedData: boolean;\n}\n\nexport default function Details(props: DetailsProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel, getPConnect, showHighlightedData } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={12} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={12} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}
+{"version":3,"file":"Details.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/Details/Details.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,oBAAoB,CAAC;AAEtC,OAAO,uBAAuB,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA8C,CAAC;AAUnF,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAmB;IACjD,8EAA8E;IAC9E,MAAM,UAAU,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC;IAErE,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,wFAAwF;IACxF,qDAAqD;IACrD,WAAW,EAAE,CAAC,gBAAgB,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC;IAC9D,WAAW,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAI,WAAW,EAAE,CAAC,WAAW,EAAY,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE,CAClF,aAAa,CAAC,uBAAuB,EAAE,EAAE;QACvC,GAAG,YAAY;QACf,oDAAoD;QACpD,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE;KACtB,CAAC,CACH,CAAC;IAEF,4GAA4G;IAC5G,IAAI,kBAAkB,GAAG,EAAE,CAAC;IAC5B,IAAI,mBAAmB,EAAE,CAAC;QACxB,MAAM,EAAE,eAAe,GAAG,EAAE,EAAE,GAAI,WAAW,EAAE,CAAC,cAAc,EAAU,CAAC,MAAM,CAAC;QAChF,kBAAkB,GAAG,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YAC/C,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,mBAAmB,CAAC;YAE/C,iDAAiD;YACjD,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,KAAK,kBAAkB,EAAE,CAAC;gBAC9C,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;gBACzB,KAAK,CAAC,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;YACtC,CAAC;YAED,OAAO,WAAW,EAAE,CAAC,eAAe,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,6FAA6F;QACvJ,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,aAC3D,mBAAmB,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC,IAAI,CACvD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,YACtD,kBAAkB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,EAAE,YACd,KAAK,IADgB,MAAM,CAAC,GAAG,CAAC,EAAE,CAE9B,CACR,CAAC,GACG,CACR,EACD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,YACvB,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAC1B,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,EAAE,YACd,KAAK,IADgB,KAAK,CAAC,GAAG,CAAC,EAAE,CAE7B,CACR,CAAC,GACG,IACI,CACd,CAAC;AACJ,CAAC","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@mui/material/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport type { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  label: string;\n  showLabel: boolean;\n  showHighlightedData: boolean;\n}\n\nexport default function Details(props: DetailsProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel, getPConnect, showHighlightedData } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={12} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={12} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}

package/lib/components/template/Details/DetailsSubTabs/DetailsSubTabs.d.ts

@@ -1,5 +1,5 @@
-import { PropsWithChildren } from 'react';
-import { PConnProps } from '../../../../types/PConnProps';
+import { type PropsWithChildren } from 'react';
+import type { PConnProps } from '../../../../types/PConnProps';
 interface DetailsSubTabsProps extends PConnProps {
     showLabel: boolean;
     label: string;

package/lib/components/template/Details/DetailsSubTabs/DetailsSubTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsSubTabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsSubTabs/DetailsSubTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAKzE,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE1D,UAAU,mBAAoB,SAAQ,UAAU;IAE9C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,iBAAiB,CAAC,mBAAmB,CAAC,2CA4CnF"}
+{"version":3,"file":"DetailsSubTabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsSubTabs/DetailsSubTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAK9E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE/D,UAAU,mBAAoB,SAAQ,UAAU;IAE9C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,iBAAiB,CAAC,mBAAmB,CAAC,2CA4CnF"}

package/lib/components/template/Details/DetailsSubTabs/DetailsSubTabs.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Children, useEffect, useState } from 'react';
-import { Tab, Tabs, TextField } from '@material-ui/core';
-import { TabContext, TabPanel } from '@material-ui/lab';
+import { Tab, Tabs } from '@mui/material';
+import { TabContext, TabPanel } from '@mui/lab';
 import { getTransientTabs, getVisibleTabs, tabClick } from '../../SubTabs/tabUtils';
 export default function DetailsSubTabs(props) {
     const { children = [], label, showLabel = true, getPConnect } = props;
@@ -23,6 +23,6 @@ export default function DetailsSubTabs(props) {
         setCurrentTabId(index);
         tabClick(index, availableTabs, currentTabId, setCurrentTabId, tabItems);
     };
-    return (_jsxs(_Fragment, { children: [propsToUse.showLabel && _jsx(TextField, { children: propsToUse.label }), _jsxs(TabContext, { value: currentTabId.toString(), children: [_jsx(Tabs, { onChange: handleTabClick, value: currentTabId, children: tabItems.map((tab) => (_jsx(Tab, { label: tab.name, value: tab.id }, tab.id))) }), tabItems.map((tab) => (_jsx(TabPanel, { value: tab.id, tabIndex: +tab.id, children: _jsx("div", { children: tab.content ? tab.content : 'No content exists' }) }, tab.id)))] })] }));
+    return (_jsxs(_Fragment, { children: [propsToUse.showLabel && _jsx("h3", { children: propsToUse.label }), _jsxs(TabContext, { value: currentTabId.toString(), children: [_jsx(Tabs, { onChange: handleTabClick, value: currentTabId, children: tabItems.map((tab) => (_jsx(Tab, { label: tab.name, value: tab.id }, tab.id))) }), tabItems.map((tab) => (_jsx(TabPanel, { value: tab.id, tabIndex: +tab.id, children: _jsx("div", { children: tab.content ? tab.content : 'No content exists' }) }, tab.id)))] })] }));
 }
 //# sourceMappingURL=DetailsSubTabs.js.map

package/lib/components/template/Details/DetailsSubTabs/DetailsSubTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsSubTabs.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsSubTabs/DetailsSubTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAqB,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AASpF,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAA6C;IAClF,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACtE,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,MAAM,eAAe,GAAG,CAAC,CAAC;IAC1B,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IACtD,IAAI,aAAa,GAAG,EAAE,CAAC;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,GAAG,cAAc,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,CAAC,CAAC;IAE7E,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,gBAAgB,CAAC,aAAa,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;QAC7E,UAAU,CAAC,YAAY,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,cAAc,GAAG,CAAC,EAAE,EAAE,KAAa,EAAE,EAAE;QAC3C,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,QAAQ,CAAC,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC;IAC1E,CAAC,CAAC;IAEF,OAAO,CACL,8BACG,UAAU,CAAC,SAAS,IAAI,KAAC,SAAS,cAAE,UAAU,CAAC,KAAK,GAAa,EAClE,MAAC,UAAU,IAAC,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,aACxC,KAAC,IAAI,IAAC,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,YAAY,YAChD,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,EAAE,CAAC,CAC1B,KAAC,GAAG,IAAc,KAAK,EAAE,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,CAAC,EAAE,IAAtC,GAAG,CAAC,EAAE,CAAoC,CACrD,CAAC,GACG,EAEN,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,EAAE,CAAC,CAC1B,KAAC,QAAQ,IAAc,KAAK,EAAE,GAAG,CAAC,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,YACrD,wBAAM,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAmB,GAAO,IAD/C,GAAG,CAAC,EAAE,CAEV,CACZ,CAAC,IACS,IACZ,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { Children, PropsWithChildren, useEffect, useState } from 'react';\nimport { Tab, Tabs, TextField } from '@material-ui/core';\nimport { TabContext, TabPanel } from '@material-ui/lab';\n\nimport { getTransientTabs, getVisibleTabs, tabClick } from '../../SubTabs/tabUtils';\nimport { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsSubTabsProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n}\n\nexport default function DetailsSubTabs(props: PropsWithChildren<DetailsSubTabsProps>) {\n  const { children = [], label, showLabel = true, getPConnect } = props;\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  const defaultTabIndex = 0;\n  const deferLoadedTabs = Children.toArray(children)[0];\n  let availableTabs = [];\n\n  useEffect(() => {\n    availableTabs = getVisibleTabs(deferLoadedTabs, 'detailsSubTabs');\n  }, [availableTabs]);\n\n  const [currentTabId, setCurrentTabId] = useState(defaultTabIndex.toString());\n\n  const [tabItems, setTabitem] = useState([]);\n  useEffect(() => {\n    const tempTabItems = getTransientTabs(availableTabs, currentTabId, tabItems);\n    setTabitem(tempTabItems);\n  }, [currentTabId]);\n\n  const handleTabClick = (id, index: string) => {\n    setCurrentTabId(index);\n    tabClick(index, availableTabs, currentTabId, setCurrentTabId, tabItems);\n  };\n\n  return (\n    <>\n      {propsToUse.showLabel && <TextField>{propsToUse.label}</TextField>}\n      <TabContext value={currentTabId.toString()}>\n        <Tabs onChange={handleTabClick} value={currentTabId}>\n          {tabItems.map((tab: any) => (\n            <Tab key={tab.id} label={tab.name} value={tab.id} />\n          ))}\n        </Tabs>\n\n        {tabItems.map((tab: any) => (\n          <TabPanel key={tab.id} value={tab.id} tabIndex={+tab.id}>\n            <div>{tab.content ? tab.content : 'No content exists'}</div>\n          </TabPanel>\n        ))}\n      </TabContext>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"DetailsSubTabs.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsSubTabs/DetailsSubTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAA0B,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AASpF,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAA6C;IAClF,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACtE,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,MAAM,eAAe,GAAG,CAAC,CAAC;IAC1B,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IACtD,IAAI,aAAa,GAAG,EAAE,CAAC;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,GAAG,cAAc,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,CAAC,CAAC;IAE7E,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,gBAAgB,CAAC,aAAa,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;QAC7E,UAAU,CAAC,YAAY,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,cAAc,GAAG,CAAC,EAAE,EAAE,KAAa,EAAE,EAAE;QAC3C,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,QAAQ,CAAC,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC;IAC1E,CAAC,CAAC;IAEF,OAAO,CACL,8BACG,UAAU,CAAC,SAAS,IAAI,uBAAK,UAAU,CAAC,KAAK,GAAM,EACpD,MAAC,UAAU,IAAC,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,aACxC,KAAC,IAAI,IAAC,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,YAAY,YAChD,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,EAAE,CAAC,CAC1B,KAAC,GAAG,IAAc,KAAK,EAAE,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,CAAC,EAAE,IAAtC,GAAG,CAAC,EAAE,CAAoC,CACrD,CAAC,GACG,EAEN,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,EAAE,CAAC,CAC1B,KAAC,QAAQ,IAAc,KAAK,EAAE,GAAG,CAAC,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,YACrD,wBAAM,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAmB,GAAO,IAD/C,GAAG,CAAC,EAAE,CAEV,CACZ,CAAC,IACS,IACZ,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { Children, type PropsWithChildren, useEffect, useState } from 'react';\nimport { Tab, Tabs } from '@mui/material';\nimport { TabContext, TabPanel } from '@mui/lab';\n\nimport { getTransientTabs, getVisibleTabs, tabClick } from '../../SubTabs/tabUtils';\nimport type { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsSubTabsProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n}\n\nexport default function DetailsSubTabs(props: PropsWithChildren<DetailsSubTabsProps>) {\n  const { children = [], label, showLabel = true, getPConnect } = props;\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  const defaultTabIndex = 0;\n  const deferLoadedTabs = Children.toArray(children)[0];\n  let availableTabs = [];\n\n  useEffect(() => {\n    availableTabs = getVisibleTabs(deferLoadedTabs, 'detailsSubTabs');\n  }, [availableTabs]);\n\n  const [currentTabId, setCurrentTabId] = useState(defaultTabIndex.toString());\n\n  const [tabItems, setTabitem] = useState([]);\n  useEffect(() => {\n    const tempTabItems = getTransientTabs(availableTabs, currentTabId, tabItems);\n    setTabitem(tempTabItems);\n  }, [currentTabId]);\n\n  const handleTabClick = (id, index: string) => {\n    setCurrentTabId(index);\n    tabClick(index, availableTabs, currentTabId, setCurrentTabId, tabItems);\n  };\n\n  return (\n    <>\n      {propsToUse.showLabel && <h3>{propsToUse.label}</h3>}\n      <TabContext value={currentTabId.toString()}>\n        <Tabs onChange={handleTabClick} value={currentTabId}>\n          {tabItems.map((tab: any) => (\n            <Tab key={tab.id} label={tab.name} value={tab.id} />\n          ))}\n        </Tabs>\n\n        {tabItems.map((tab: any) => (\n          <TabPanel key={tab.id} value={tab.id} tabIndex={+tab.id}>\n            <div>{tab.content ? tab.content : 'No content exists'}</div>\n          </TabPanel>\n        ))}\n      </TabContext>\n    </>\n  );\n}\n"]}

package/lib/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.d.ts

@@ -1,4 +1,4 @@
-import { PConnProps } from '../../../../types/PConnProps';
+import type { PConnProps } from '../../../../types/PConnProps';
 interface DetailsThreeColumnProps extends PConnProps {
     showLabel: boolean;
     label: string;

package/lib/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsThreeColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE1D,UAAU,uBAAwB,SAAQ,UAAU;IAElD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA0DxE"}
+{"version":3,"file":"DetailsThreeColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE/D,UAAU,uBAAwB,SAAQ,UAAU;IAElD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA0DxE"}

package/lib/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement } from 'react';
-import Grid from '@material-ui/core/Grid';
+import Grid from '@mui/material/Grid';
 import createPConnectComponent from '../../../../bridge/react_pconnect';
 import { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';
 export default function DetailsThreeColumn(props) {
@@ -11,7 +11,7 @@ export default function DetailsThreeColumn(props) {
     const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };
     // Set display mode prop and re-create the children so this part of the dom tree renders
     // in a readonly (display) mode instead of a editable
-    getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');
+    getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');
     getPConnect().setInheritedProp('readOnly', true);
     const children = getPConnect().getChildren().map((configObject, index) => createElement(createPConnectComponent(), {
         ...configObject,

package/lib/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsThreeColumn.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAE1C,OAAO,uBAAuB,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA8C,CAAC;AAUnF,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAA8B;IACvE,8EAA8E;IAC9E,MAAM,UAAU,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,WAAW,EAAE,mBAAmB,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAEpF,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,wFAAwF;IACxF,qDAAqD;IACrD,WAAW,EAAE,CAAC,gBAAgB,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;IAC7D,WAAW,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAI,WAAW,EAAE,CAAC,WAAW,EAAY,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE,CAClF,aAAa,CAAC,uBAAuB,EAAE,EAAE;QACvC,GAAG,YAAY;QACf,oDAAoD;QACpD,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE;KACtB,CAAC,CACH,CAAC;IAEF,4GAA4G;IAC5G,IAAI,kBAAkB,GAAG,EAAE,CAAC;IAC5B,IAAI,mBAAmB,EAAE;QACvB,MAAM,EAAE,eAAe,GAAG,EAAE,EAAE,GAAI,WAAW,EAAE,CAAC,cAAc,EAAU,CAAC,MAAM,CAAC;QAChF,kBAAkB,GAAG,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YAC/C,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,mBAAmB,CAAC;YAE/C,iDAAiD;YACjD,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,KAAK,kBAAkB,EAAE;gBAC7C,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;gBACzB,KAAK,CAAC,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;aACrC;YAED,OAAO,WAAW,EAAE,CAAC,eAAe,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,+FAA+F;QACzJ,CAAC,CAAC,CAAC;KACJ;IAED,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,aAC3D,mBAAmB,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC,IAAI,CACvD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,YACtD,kBAAkB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,CAAC,YACb,KAAK,IADe,MAAM,CAAC,GAAG,CAAC,EAAE,CAE7B,CACR,CAAC,GACG,CACR,EACD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,YACvB,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAC1B,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,CAAC,YACb,KAAK,IADe,KAAK,CAAC,GAAG,CAAC,EAAE,CAE5B,CACR,CAAC,GACG,IACI,CACd,CAAC;AACJ,CAAC","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@material-ui/core/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsThreeColumnProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n  showHighlightedData: boolean;\n}\n\nexport default function DetailsThreeColumn(props: DetailsThreeColumnProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional);\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={4} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={4} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}
+{"version":3,"file":"DetailsThreeColumn.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsThreeColumn/DetailsThreeColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@mui/material/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport type { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsThreeColumnProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n  showHighlightedData: boolean;\n}\n\nexport default function DetailsThreeColumn(props: DetailsThreeColumnProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional);\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={4} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={4} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}

package/lib/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.d.ts

@@ -1,4 +1,4 @@
-import { PConnProps } from '../../../../types/PConnProps';
+import type { PConnProps } from '../../../../types/PConnProps';
 interface DetailsTwoColumnProps extends PConnProps {
     showLabel: boolean;
     label: string;

package/lib/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsTwoColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE1D,UAAU,qBAAsB,SAAQ,UAAU;IAEhD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CA0DpE"}
+{"version":3,"file":"DetailsTwoColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE/D,UAAU,qBAAsB,SAAQ,UAAU;IAEhD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CA0DpE"}

package/lib/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement } from 'react';
-import Grid from '@material-ui/core/Grid';
+import Grid from '@mui/material/Grid';
 import createPConnectComponent from '../../../../bridge/react_pconnect';
 import { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';
 export default function DetailsTwoColumn(props) {
@@ -11,7 +11,7 @@ export default function DetailsTwoColumn(props) {
     const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };
     // Set display mode prop and re-create the children so this part of the dom tree renders
     // in a readonly (display) mode instead of a editable
-    getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');
+    getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');
     getPConnect().setInheritedProp('readOnly', true);
     const children = getPConnect().getChildren().map((configObject, index) => createElement(createPConnectComponent(), {
         ...configObject,

package/lib/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsTwoColumn.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAE1C,OAAO,uBAAuB,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA8C,CAAC;AAUnF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,KAA4B;IACnE,8EAA8E;IAC9E,MAAM,UAAU,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,WAAW,EAAE,mBAAmB,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAEpF,sEAAsE;IACtE,MAAM,UAAU,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC;IAE9E,wFAAwF;IACxF,qDAAqD;IACrD,WAAW,EAAE,CAAC,gBAAgB,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;IAC7D,WAAW,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAI,WAAW,EAAE,CAAC,WAAW,EAAY,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE,CAClF,aAAa,CAAC,uBAAuB,EAAE,EAAE;QACvC,GAAG,YAAY;QACf,oDAAoD;QACpD,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE;KACtB,CAAC,CACH,CAAC;IAEF,4GAA4G;IAC5G,IAAI,kBAAkB,GAAG,EAAE,CAAC;IAC5B,IAAI,mBAAmB,EAAE;QACvB,MAAM,EAAE,eAAe,GAAG,EAAE,EAAE,GAAI,WAAW,EAAE,CAAC,cAAc,EAAU,CAAC,MAAM,CAAC;QAChF,kBAAkB,GAAG,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YAC/C,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,mBAAmB,CAAC;YAE/C,iDAAiD;YACjD,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,KAAK,kBAAkB,EAAE;gBAC7C,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;gBACzB,KAAK,CAAC,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;aACrC;YAED,OAAO,WAAW,EAAE,CAAC,eAAe,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,6FAA6F;QACvJ,CAAC,CAAC,CAAC;KACJ;IAED,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,aAC3D,mBAAmB,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC,IAAI,CACvD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,YACtD,kBAAkB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,CAAC,YACb,KAAK,IADe,MAAM,CAAC,GAAG,CAAC,EAAE,CAE7B,CACR,CAAC,GACG,CACR,EACD,KAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,YACvB,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAC1B,KAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAE,CAAC,YACb,KAAK,IADe,KAAK,CAAC,GAAG,CAAC,EAAE,CAE5B,CACR,CAAC,GACG,IACI,CACd,CAAC;AACJ,CAAC","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@material-ui/core/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsTwoColumnProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n  showHighlightedData: boolean;\n}\n\nexport default function DetailsTwoColumn(props: DetailsTwoColumnProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'LABELS_LEFT');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={6} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={6} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}
+{"version":3,"file":"DetailsTwoColumn.js","sourceRoot":"","sources":["../../../../../src/components/template/Details/DetailsTwoColumn/DetailsTwoColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from 'react';\nimport Grid from '@mui/material/Grid';\n\nimport createPConnectComponent from '../../../../bridge/react_pconnect';\nimport { getComponentFromMap } from '../../../../bridge/helpers/sdk_component_map';\nimport type { PConnProps } from '../../../../types/PConnProps';\n\ninterface DetailsTwoColumnProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  showLabel: boolean;\n  label: string;\n  showHighlightedData: boolean;\n}\n\nexport default function DetailsTwoColumn(props: DetailsTwoColumnProps) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const FieldGroup = getComponentFromMap('FieldGroup');\n\n  const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;\n\n  // Get the inherited props from the parent to determine label settings\n  const propsToUse = { label, showLabel, ...getPConnect().getInheritedProps() };\n\n  // Set display mode prop and re-create the children so this part of the dom tree renders\n  // in a readonly (display) mode instead of a editable\n  getPConnect().setInheritedProp('displayMode', 'DISPLAY_ONLY');\n  getPConnect().setInheritedProp('readOnly', true);\n  const children = (getPConnect().getChildren() as any[]).map((configObject, index) =>\n    createElement(createPConnectComponent(), {\n      ...configObject,\n      // eslint-disable-next-line react/no-array-index-key\n      key: index.toString()\n    })\n  );\n\n  // Set up highlighted data to pass in return if is set to show, need raw metadata to pass to createComponent\n  let highlightedDataArr = [];\n  if (showHighlightedData) {\n    const { highlightedData = [] } = (getPConnect().getRawMetadata() as any).config;\n    highlightedDataArr = highlightedData.map(field => {\n      field.config.displayMode = 'STACKED_LARGE_VAL';\n\n      // Mark as status display when using pyStatusWork\n      if (field.config.value === '@P .pyStatusWork') {\n        field.type = 'TextInput';\n        field.config.displayAsStatus = true;\n      }\n\n      return getPConnect().createComponent(field, '', 0, {}); // 2nd, 3rd, and 4th args empty string/object/null until typedef marked correctly as optional\n    });\n  }\n\n  return (\n    <FieldGroup name={propsToUse.showLabel ? propsToUse.label : ''}>\n      {showHighlightedData && highlightedDataArr.length > 0 && (\n        <Grid container spacing={1} style={{ padding: '0 0 1em' }}>\n          {highlightedDataArr.map((child, i) => (\n            <Grid item xs={6} key={`hf-${i + 1}`}>\n              {child}\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      <Grid container spacing={1}>\n        {children.map((child, i) => (\n          <Grid item xs={6} key={`r-${i + 1}`}>\n            {child}\n          </Grid>\n        ))}\n      </Grid>\n    </FieldGroup>\n  );\n}\n"]}

package/lib/components/template/Details/DynamicTabs/DynamicTabs.d.ts

@@ -1,4 +1,4 @@
-import { PConnProps } from '../../../../types/PConnProps';
+import type { PConnProps } from '../../../../types/PConnProps';
 interface DynamicTabsProps extends PConnProps {
     showLabel: boolean;
     label: string;

package/lib/components/template/Details/DynamicTabs/DynamicTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicTabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DynamicTabs/DynamicTabs.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAQ1D,UAAU,gBAAiB,SAAQ,UAAU;IAE3C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,GAAG,EAAE,CAAC;CACvB;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAwD3C;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"DynamicTabs.d.ts","sourceRoot":"","sources":["../../../../../src/components/template/Details/DynamicTabs/DynamicTabs.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAQ/D,UAAU,gBAAiB,SAAQ,UAAU;IAE3C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,GAAG,EAAE,CAAC;CACvB;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAuD3C;AAED,eAAe,WAAW,CAAC"}