@pega/lists-react 10.0.0-build.1.9 → 10.0.0-build.10.0

package/lib/Core/Components/DefaultComponents/CellRenderers/RowSelectHandle.js

@@ -16,13 +16,14 @@ const StyledDivWrapper = styled.div `
   }
 `;
 const RowSelectHandle = ({ getRsMeta, getExecutionContext, getDisableSelection }) => {
-    const { $selected, selectRow, getParentContext, getRowHeader } = getExecutionContext();
+    const { $selected, selectRow, getParentContext, getRowHeader, openMasterDetail } = getExecutionContext();
     const { selectionMode, disableSelectionOnLoad } = getRsMeta();
     const { getState } = getParentContext();
     const selectedRowsCount = getState().selectedRows?.length || 0;
     // in multi_on_hover mode, display all checkboxes when at least 1 row is selected
     const bDisplayOnHover = selectionMode === SELECTION_MODES.multi_on_hover && selectedRowsCount === 0;
     const rowHeaderValue = getRowHeader()?.getValue();
+    const onClick = event => event.stopPropagation();
     let component = null;
     const disableSelection = getDisableSelection() ?? disableSelectionOnLoad;
     if (selectionMode === SELECTION_MODES.single) {
@@ -31,6 +32,8 @@ const RowSelectHandle = ({ getRsMeta, getExecutionContext, getDisableSelection }
                 return;
             }
             selectRow();
+            // Upon selection, open the master detail if available
+            openMasterDetail?.();
         };
         component = (_jsx(RadioButton, { checked: $selected || false, disabled: disableSelection, onChange: handleChange, "aria-label": rowHeaderValue }));
     }
@@ -40,12 +43,16 @@ const RowSelectHandle = ({ getRsMeta, getExecutionContext, getDisableSelection }
                 return;
             }
             selectRow(event.target.checked);
+            if (event.target.checked) {
+                // Upon selection, open the master detail if available
+                openMasterDetail?.();
+            }
         };
         component = (_jsx(Checkbox, { className: cx({
                 'checkbox-on-hover': bDisplayOnHover
             }), checked: $selected || false, onChange: handleChange, disabled: disableSelection, "aria-label": rowHeaderValue }));
     }
-    return _jsx(StyledDivWrapper, { item: true, children: component });
+    return (_jsx(StyledDivWrapper, { item: true, onClick: onClick, children: component }));
 };
 RowSelectHandle.propTypes = {
     getExecutionContext: PropTypes.func.isRequired,

package/lib/Core/Components/DefaultComponents/CellRenderers/RowSelectHandle.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowSelectHandle.js","sourceRoot":"","sources":["../../../../../Core/Components/DefaultComponents/CellRenderers/RowSelectHandle.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAE7B,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,sBAAsB,EAAE,MAAM,8DAA8D,CAAC;AAEtG,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;IAK/B,sBAAsB;;;CAGzB,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,EAAE,EAAE;IAClF,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAEvF,MAAM,EAAE,aAAa,EAAE,sBAAsB,EAAE,GAAG,SAAS,EAAE,CAAC;IAC9D,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,iBAAiB,GAAG,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,IAAI,CAAC,CAAC;IAC/D,iFAAiF;IACjF,MAAM,eAAe,GACnB,aAAa,KAAK,eAAe,CAAC,cAAc,IAAI,iBAAiB,KAAK,CAAC,CAAC;IAE9E,MAAM,cAAc,GAAG,YAAY,EAAE,EAAE,QAAQ,EAAE,CAAC;IAElD,IAAI,SAAS,GAAG,IAAI,CAAC;IACrB,MAAM,gBAAgB,GAAG,mBAAmB,EAAE,IAAI,sBAAsB,CAAC;IACzE,IAAI,aAAa,KAAK,eAAe,CAAC,MAAM,EAAE,CAAC;QAC7C,MAAM,YAAY,GAAG,GAAG,EAAE;YACxB,IAAI,gBAAgB,EAAE,CAAC;gBACrB,OAAO;YACT,CAAC;YACD,SAAS,EAAE,CAAC;QACd,CAAC,CAAC;QACF,SAAS,GAAG,CACV,KAAC,WAAW,IACV,OAAO,EAAE,SAAS,IAAI,KAAK,EAC3B,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,YAAY,gBACV,cAAc,GAC1B,CACH,CAAC;IACJ,CAAC;SAAM,CAAC;QACN,MAAM,YAAY,GAAG,KAAK,CAAC,EAAE;YAC3B,IAAI,gBAAgB,EAAE,CAAC;gBACrB,OAAO;YACT,CAAC;YACD,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QAClC,CAAC,CAAC;QACF,SAAS,GAAG,CACV,KAAC,QAAQ,IACP,SAAS,EAAE,EAAE,CAAC;gBACZ,mBAAmB,EAAE,eAAe;aACrC,CAAC,EACF,OAAO,EAAE,SAAS,IAAI,KAAK,EAC3B,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,gBAAgB,gBACd,cAAc,GAC1B,CACH,CAAC;IACJ,CAAC;IACD,OAAO,KAAC,gBAAgB,IAAC,IAAI,kBAAE,SAAS,GAAoB,CAAC;AAC/D,CAAC,CAAC;AAEF,eAAe,CAAC,SAAS,GAAG;IAC1B,mBAAmB,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IAC9C,SAAS,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IACpC,mBAAmB,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CAC/C,CAAC;AAEF,+GAA+G;AAC/G,eAAe,IAAI,CAAC,eAAe,CAAC,CAAC","sourcesContent":["import styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { memo } from 'react';\n\nimport { RadioButton, Checkbox } from '@pega/cosmos-react-core';\nimport { StyledPseudoRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\n\nimport { createClassName as cx } from '../../../Utils';\nimport { SELECTION_MODES } from '../../../constants';\n\nconst StyledDivWrapper = styled.div`\n  height: 100%;\n  > div {\n    height: 100%;\n  }\n  ${StyledPseudoRadioCheck} {\n    margin-inline-end: 0;\n  }\n`;\n\nconst RowSelectHandle = ({ getRsMeta, getExecutionContext, getDisableSelection }) => {\n  const { $selected, selectRow, getParentContext, getRowHeader } = getExecutionContext();\n\n  const { selectionMode, disableSelectionOnLoad } = getRsMeta();\n  const { getState } = getParentContext();\n  const selectedRowsCount = getState().selectedRows?.length || 0;\n  // in multi_on_hover mode, display all checkboxes when at least 1 row is selected\n  const bDisplayOnHover =\n    selectionMode === SELECTION_MODES.multi_on_hover && selectedRowsCount === 0;\n\n  const rowHeaderValue = getRowHeader()?.getValue();\n\n  let component = null;\n  const disableSelection = getDisableSelection() ?? disableSelectionOnLoad;\n  if (selectionMode === SELECTION_MODES.single) {\n    const handleChange = () => {\n      if (disableSelection) {\n        return;\n      }\n      selectRow();\n    };\n    component = (\n      <RadioButton\n        checked={$selected || false}\n        disabled={disableSelection}\n        onChange={handleChange}\n        aria-label={rowHeaderValue}\n      />\n    );\n  } else {\n    const handleChange = event => {\n      if (disableSelection) {\n        return;\n      }\n      selectRow(event.target.checked);\n    };\n    component = (\n      <Checkbox\n        className={cx({\n          'checkbox-on-hover': bDisplayOnHover\n        })}\n        checked={$selected || false}\n        onChange={handleChange}\n        disabled={disableSelection}\n        aria-label={rowHeaderValue}\n      />\n    );\n  }\n  return <StyledDivWrapper item>{component}</StyledDivWrapper>;\n};\n\nRowSelectHandle.propTypes = {\n  getExecutionContext: PropTypes.func.isRequired,\n  getRsMeta: PropTypes.func.isRequired,\n  getDisableSelection: PropTypes.func.isRequired\n};\n\n// For a given column instance, getExecutionContext and getRsMeta functions will remain same between re-renders\nexport default memo(RowSelectHandle);\n"]}
+{"version":3,"file":"RowSelectHandle.js","sourceRoot":"","sources":["../../../../../Core/Components/DefaultComponents/CellRenderers/RowSelectHandle.jsx"],"names":[],"mappings":"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","sourcesContent":["import styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { memo } from 'react';\n\nimport { RadioButton, Checkbox } from '@pega/cosmos-react-core';\nimport { StyledPseudoRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\n\nimport { createClassName as cx } from '../../../Utils';\nimport { SELECTION_MODES } from '../../../constants';\n\nconst StyledDivWrapper = styled.div`\n  height: 100%;\n  > div {\n    height: 100%;\n  }\n  ${StyledPseudoRadioCheck} {\n    margin-inline-end: 0;\n  }\n`;\n\nconst RowSelectHandle = ({ getRsMeta, getExecutionContext, getDisableSelection }) => {\n  const { $selected, selectRow, getParentContext, getRowHeader, openMasterDetail } =\n    getExecutionContext();\n\n  const { selectionMode, disableSelectionOnLoad } = getRsMeta();\n  const { getState } = getParentContext();\n  const selectedRowsCount = getState().selectedRows?.length || 0;\n  // in multi_on_hover mode, display all checkboxes when at least 1 row is selected\n  const bDisplayOnHover =\n    selectionMode === SELECTION_MODES.multi_on_hover && selectedRowsCount === 0;\n\n  const rowHeaderValue = getRowHeader()?.getValue();\n  const onClick = event => event.stopPropagation();\n\n  let component = null;\n  const disableSelection = getDisableSelection() ?? disableSelectionOnLoad;\n  if (selectionMode === SELECTION_MODES.single) {\n    const handleChange = () => {\n      if (disableSelection) {\n        return;\n      }\n      selectRow();\n      // Upon selection, open the master detail if available\n      openMasterDetail?.();\n    };\n    component = (\n      <RadioButton\n        checked={$selected || false}\n        disabled={disableSelection}\n        onChange={handleChange}\n        aria-label={rowHeaderValue}\n      />\n    );\n  } else {\n    const handleChange = event => {\n      if (disableSelection) {\n        return;\n      }\n      selectRow(event.target.checked);\n      if (event.target.checked) {\n        // Upon selection, open the master detail if available\n        openMasterDetail?.();\n      }\n    };\n    component = (\n      <Checkbox\n        className={cx({\n          'checkbox-on-hover': bDisplayOnHover\n        })}\n        checked={$selected || false}\n        onChange={handleChange}\n        disabled={disableSelection}\n        aria-label={rowHeaderValue}\n      />\n    );\n  }\n  return (\n    <StyledDivWrapper item onClick={onClick}>\n      {component}\n    </StyledDivWrapper>\n  );\n};\n\nRowSelectHandle.propTypes = {\n  getExecutionContext: PropTypes.func.isRequired,\n  getRsMeta: PropTypes.func.isRequired,\n  getDisableSelection: PropTypes.func.isRequired\n};\n\n// For a given column instance, getExecutionContext and getRsMeta functions will remain same between re-renders\nexport default memo(RowSelectHandle);\n"]}

package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts

@@ -1,7 +1,8 @@
 export default EmptyContainer;
-declare function EmptyContainer({ message, shouldAnnounce, domContainer }: {
+declare function EmptyContainer({ message, shouldAnnounce, domContainer, transparent }: {
     message: any;
     shouldAnnounce: any;
     domContainer: any;
+    transparent?: boolean | undefined;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EmptyContainer.d.ts.map

package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAuBA;;;;4CAqBC"}
+{"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAwBA;;;;;4CAsBC"}

package/lib/Core/Components/DefaultComponents/EmptyContainer.js

@@ -13,11 +13,11 @@ const EmptyContainerStyle = styled.div `
   left: 0;
   right: 0;
   bottom: 0;
-  background: ${props => props.theme.base.palette['primary-background']};
+  background: ${({ theme, $transparent }) => $transparent ? 'transparent' : theme.base.palette['primary-background']};
   overflow: hidden;
 `;
 EmptyContainerStyle.defaultProps = defaultThemeProp;
-const EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {
+const EmptyContainer = ({ message, shouldAnnounce, domContainer, transparent = false }) => {
     const { announcePolite } = useLiveLog();
     useEffect(() => {
         if (shouldAnnounce &&
@@ -26,7 +26,7 @@ const EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {
             announcePolite({ message });
         }
     }, [shouldAnnounce, message, announcePolite, domContainer]);
-    return (_jsx(EmptyContainerStyle, { "data-test-id": TestIdConstants.noRecords, "data-testid": TestIdConstants.noRecords, children: _jsx(EmptyState, { message: message }) }));
+    return (_jsx(EmptyContainerStyle, { "$transparent": transparent, "data-test-id": TestIdConstants.noRecords, "data-testid": TestIdConstants.noRecords, children: _jsx(EmptyState, { message: message }) }));
 };
 export default EmptyContainer;
 //# sourceMappingURL=EmptyContainer.js.map

package/lib/Core/Components/DefaultComponents/EmptyContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEnF,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;gBAUtB,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;CAEtE,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,EAAE;IACnE,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IACE,cAAc;YACd,OAAO,QAAQ,KAAK,WAAW;YAC/B,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAC9C,CAAC;YACD,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,OAAO,CACL,KAAC,mBAAmB,oBACJ,eAAe,CAAC,SAAS,iBAC1B,eAAe,CAAC,SAAS,YAEtC,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,GACZ,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useEffect } from 'react';\n\nimport { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';\n\nimport TestIdConstants from '../TestIdConstants';\n\nconst EmptyContainerStyle = styled.div`\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  top: var(--row-height, 0);\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: ${props => props.theme.base.palette['primary-background']};\n  overflow: hidden;\n`;\n\nEmptyContainerStyle.defaultProps = defaultThemeProp;\n\nconst EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {\n  const { announcePolite } = useLiveLog();\n\n  useEffect(() => {\n    if (\n      shouldAnnounce &&\n      typeof document !== 'undefined' &&\n      domContainer?.contains(document.activeElement)\n    ) {\n      announcePolite({ message });\n    }\n  }, [shouldAnnounce, message, announcePolite, domContainer]);\n\n  return (\n    <EmptyContainerStyle\n      data-test-id={TestIdConstants.noRecords}\n      data-testid={TestIdConstants.noRecords}\n    >\n      <EmptyState message={message} />\n    </EmptyContainerStyle>\n  );\n};\n\nexport default EmptyContainer;\n"]}
+{"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEnF,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;gBAUtB,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,CACxC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;CAE1E,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,GAAG,KAAK,EAAE,EAAE,EAAE;IACxF,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IACE,cAAc;YACd,OAAO,QAAQ,KAAK,WAAW;YAC/B,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAC9C,CAAC;YACD,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,OAAO,CACL,KAAC,mBAAmB,oBACJ,WAAW,kBACX,eAAe,CAAC,SAAS,iBAC1B,eAAe,CAAC,SAAS,YAEtC,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,GACZ,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useEffect } from 'react';\n\nimport { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';\n\nimport TestIdConstants from '../TestIdConstants';\n\nconst EmptyContainerStyle = styled.div`\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  top: var(--row-height, 0);\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: ${({ theme, $transparent }) =>\n    $transparent ? 'transparent' : theme.base.palette['primary-background']};\n  overflow: hidden;\n`;\n\nEmptyContainerStyle.defaultProps = defaultThemeProp;\n\nconst EmptyContainer = ({ message, shouldAnnounce, domContainer, transparent = false }) => {\n  const { announcePolite } = useLiveLog();\n\n  useEffect(() => {\n    if (\n      shouldAnnounce &&\n      typeof document !== 'undefined' &&\n      domContainer?.contains(document.activeElement)\n    ) {\n      announcePolite({ message });\n    }\n  }, [shouldAnnounce, message, announcePolite, domContainer]);\n\n  return (\n    <EmptyContainerStyle\n      $transparent={transparent}\n      data-test-id={TestIdConstants.noRecords}\n      data-testid={TestIdConstants.noRecords}\n    >\n      <EmptyState message={message} />\n    </EmptyContainerStyle>\n  );\n};\n\nexport default EmptyContainer;\n"]}

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PersonalizationCreateEdit.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"AAOA;;;;;4CAqHC;;;;;;;;;;;QAUW,mCAAQ;;;;;;;sBArIE,YAAY"}
+{"version":3,"file":"PersonalizationCreateEdit.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"AAOA;;;;;4CAsHC;;;;;;;;;;;QAUW,mCAAQ;;;;;;;sBAtIE,YAAY"}

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js

@@ -54,11 +54,13 @@ export default function PersonalizationCreateEdit({ view, onFinish, editing = fa
         setViewName(e.target.value);
     };
     const onSubmit = () => {
+        if (error)
+            return false;
         const trimmedName = viewName.trim();
         if (!trimmedName) {
             viewNameRef.current.focus();
             setError(viewNameEmptyError);
-            return;
+            return false;
         }
         if (editing) {
             view.type.editPersonalization(personalization.active, trimmedName, 
@@ -71,10 +73,9 @@ export default function PersonalizationCreateEdit({ view, onFinish, editing = fa
             // but will be a no-op if undefined or null
             view.type.createPersonalization(trimmedName, markAsDefault || null);
         }
-        onFinish();
-        return undefined;
+        return true;
     };
-    return (_jsx(FormDialog, { heading: translate(editing ? 'Edit customized view' : 'Add customized view'), onCancel: onFinish, onSubmit: onSubmit, target: target, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Input, { ref: viewNameRef, name: 'viewName', required: true, label: translate('View name'), autoComplete: 'off', status: error ? 'error' : undefined, info: error, value: viewName, onChange: onChange }), !(editing && isAppDefaultView) && (_jsx(Checkbox, { checked: markAsDefault, label: translate('Always show this view first'), onChange: () => setMarkAsDefault(curState => !curState) }))] }) }));
+    return (_jsx(FormDialog, { heading: translate(editing ? 'Edit customized view' : 'Add customized view'), onSubmit: onSubmit, onAfterClose: onFinish, target: target, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Input, { ref: viewNameRef, name: 'viewName', required: true, label: translate('View name'), autoComplete: 'off', status: error ? 'error' : undefined, info: error, value: viewName, onChange: onChange }), !(editing && isAppDefaultView) && (_jsx(Checkbox, { checked: markAsDefault, label: translate('Always show this view first'), onChange: () => setMarkAsDefault(curState => !curState) }))] }) }));
 }
 PersonalizationCreateEdit.propTypes = {
     onFinish: PropTypes.func,

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonalizationCreateEdit.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useMemo, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Flex, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function PersonalizationCreateEdit({ view, onFinish, editing = false, target }) {\n  const {\n    state: { personalization },\n    meta: { nonPersonalizationViewName }\n  } = view;\n  const personalizationNames = useMemo(() => {\n    const personalizations = personalization?.allPersonalizations || {};\n    return Object.keys(personalizations).map(key => personalizations[key]?.name?.toLowerCase());\n  }, [personalization]);\n  const [translate] = useTranslate();\n  const currentPersonalization = personalization?.allPersonalizations?.[personalization.active];\n  const currentPersonalizationName = currentPersonalization?.name;\n  const isAppDefaultView = personalization.active === 'APP_DEFAULT';\n  const [viewName, setViewName] = useState(() => {\n    if (editing) return currentPersonalizationName;\n    return '';\n  });\n  const [error, setError] = useState();\n  const viewNameRef = useRef(null);\n  const defaultNameError = `${nonPersonalizationViewName} ${translate(\n    'name is reserved for non Personalized view and cannot be used.'\n  )}`;\n  const viewAlreadyPresentError = translate('This view is already present.');\n  const viewNameEmptyError = translate('This view name cannot be empty.');\n  const viewNameMaxLengthError = translate('View name must contain less than 65 characters.');\n  const [markAsDefault, setMarkAsDefault] = useState(\n    !!(editing && personalization.defaultPersonalization === personalization.active)\n  );\n\n  useEffect(() => {\n    if (viewName && viewName.toLowerCase() === nonPersonalizationViewName.toLowerCase()) {\n      setError(defaultNameError);\n      return;\n    }\n    if (\n      personalizationNames.includes(viewName?.trim().toLowerCase()) &&\n      !(editing && viewName.trim() === currentPersonalizationName)\n    ) {\n      setError(viewAlreadyPresentError);\n      return;\n    }\n    if (viewName?.length > 64) {\n      setError(viewNameMaxLengthError);\n      return;\n    }\n    setError(null);\n  }, [\n    defaultNameError,\n    currentPersonalizationName,\n    editing,\n    nonPersonalizationViewName,\n    personalizationNames,\n    viewName,\n    viewAlreadyPresentError,\n    viewNameMaxLengthError\n  ]);\n\n  const onChange = e => {\n    setViewName(e.target.value);\n  };\n\n  const onSubmit = () => {\n    const trimmedName = viewName.trim();\n    if (!trimmedName) {\n      viewNameRef.current.focus();\n      setError(viewNameEmptyError);\n      return;\n    }\n    if (editing) {\n      view.type.editPersonalization(\n        personalization.active,\n        trimmedName,\n        // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n        // but will be a no-op if undefined or null\n        markAsDefault || null,\n        isAppDefaultView\n      );\n    } else {\n      // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n      // but will be a no-op if undefined or null\n      view.type.createPersonalization(trimmedName, markAsDefault || null);\n    }\n\n    onFinish();\n    return undefined;\n  };\n\n  return (\n    <FormDialog\n      heading={translate(editing ? 'Edit customized view' : 'Add customized view')}\n      onCancel={onFinish}\n      onSubmit={onSubmit}\n      target={target}\n    >\n      <Flex container={{ direction: 'column', gap: 2 }}>\n        <Input\n          ref={viewNameRef}\n          name='viewName'\n          required\n          label={translate('View name')}\n          autoComplete='off'\n          status={error ? 'error' : undefined}\n          info={error}\n          value={viewName}\n          onChange={onChange}\n        />\n\n        {!(editing && isAppDefaultView) && (\n          <Checkbox\n            checked={markAsDefault}\n            label={translate('Always show this view first')}\n            onChange={() => setMarkAsDefault(curState => !curState)}\n          />\n        )}\n      </Flex>\n    </FormDialog>\n  );\n}\n\nPersonalizationCreateEdit.propTypes = {\n  onFinish: PropTypes.func,\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  editing: PropTypes.bool,\n  target: PropTypes.instanceOf(Element)\n};\n\nPersonalizationCreateEdit.defaultProps = {\n  onFinish: () => {},\n  editing: false\n};\n"]}
+{"version":3,"file":"PersonalizationCreateEdit.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useMemo, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Flex, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function PersonalizationCreateEdit({ view, onFinish, editing = false, target }) {\n  const {\n    state: { personalization },\n    meta: { nonPersonalizationViewName }\n  } = view;\n  const personalizationNames = useMemo(() => {\n    const personalizations = personalization?.allPersonalizations || {};\n    return Object.keys(personalizations).map(key => personalizations[key]?.name?.toLowerCase());\n  }, [personalization]);\n  const [translate] = useTranslate();\n  const currentPersonalization = personalization?.allPersonalizations?.[personalization.active];\n  const currentPersonalizationName = currentPersonalization?.name;\n  const isAppDefaultView = personalization.active === 'APP_DEFAULT';\n  const [viewName, setViewName] = useState(() => {\n    if (editing) return currentPersonalizationName;\n    return '';\n  });\n  const [error, setError] = useState();\n  const viewNameRef = useRef(null);\n  const defaultNameError = `${nonPersonalizationViewName} ${translate(\n    'name is reserved for non Personalized view and cannot be used.'\n  )}`;\n  const viewAlreadyPresentError = translate('This view is already present.');\n  const viewNameEmptyError = translate('This view name cannot be empty.');\n  const viewNameMaxLengthError = translate('View name must contain less than 65 characters.');\n  const [markAsDefault, setMarkAsDefault] = useState(\n    !!(editing && personalization.defaultPersonalization === personalization.active)\n  );\n\n  useEffect(() => {\n    if (viewName && viewName.toLowerCase() === nonPersonalizationViewName.toLowerCase()) {\n      setError(defaultNameError);\n      return;\n    }\n    if (\n      personalizationNames.includes(viewName?.trim().toLowerCase()) &&\n      !(editing && viewName.trim() === currentPersonalizationName)\n    ) {\n      setError(viewAlreadyPresentError);\n      return;\n    }\n    if (viewName?.length > 64) {\n      setError(viewNameMaxLengthError);\n      return;\n    }\n    setError(null);\n  }, [\n    defaultNameError,\n    currentPersonalizationName,\n    editing,\n    nonPersonalizationViewName,\n    personalizationNames,\n    viewName,\n    viewAlreadyPresentError,\n    viewNameMaxLengthError\n  ]);\n\n  const onChange = e => {\n    setViewName(e.target.value);\n  };\n\n  const onSubmit = () => {\n    if (error) return false;\n\n    const trimmedName = viewName.trim();\n    if (!trimmedName) {\n      viewNameRef.current.focus();\n      setError(viewNameEmptyError);\n      return false;\n    }\n    if (editing) {\n      view.type.editPersonalization(\n        personalization.active,\n        trimmedName,\n        // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n        // but will be a no-op if undefined or null\n        markAsDefault || null,\n        isAppDefaultView\n      );\n    } else {\n      // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n      // but will be a no-op if undefined or null\n      view.type.createPersonalization(trimmedName, markAsDefault || null);\n    }\n\n    return true;\n  };\n\n  return (\n    <FormDialog\n      heading={translate(editing ? 'Edit customized view' : 'Add customized view')}\n      onSubmit={onSubmit}\n      onAfterClose={onFinish}\n      target={target}\n    >\n      <Flex container={{ direction: 'column', gap: 2 }}>\n        <Input\n          ref={viewNameRef}\n          name='viewName'\n          required\n          label={translate('View name')}\n          autoComplete='off'\n          status={error ? 'error' : undefined}\n          info={error}\n          value={viewName}\n          onChange={onChange}\n        />\n\n        {!(editing && isAppDefaultView) && (\n          <Checkbox\n            checked={markAsDefault}\n            label={translate('Always show this view first')}\n            onChange={() => setMarkAsDefault(curState => !curState)}\n          />\n        )}\n      </Flex>\n    </FormDialog>\n  );\n}\n\nPersonalizationCreateEdit.propTypes = {\n  onFinish: PropTypes.func,\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  editing: PropTypes.bool,\n  target: PropTypes.instanceOf(Element)\n};\n\nPersonalizationCreateEdit.defaultProps = {\n  onFinish: () => {},\n  editing: false\n};\n"]}

package/lib/Core/Components/DefaultComponents/index.d.ts

@@ -63,10 +63,11 @@ declare const _default: {
     sortRenderer: typeof sort;
     filterRenderer: typeof Filter;
     headerCellRenderer: typeof HeaderCell;
-    emptyContainerRenderer: ({ message, shouldAnnounce, domContainer }: {
+    emptyContainerRenderer: ({ message, shouldAnnounce, domContainer, transparent }: {
         message: any;
         shouldAnnounce: any;
         domContainer: any;
+        transparent?: boolean | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     loadingIndicator: typeof LoadingIndicator;
     rowHeightRenderer: typeof RowHeightRenderer;

package/lib/Core/Components/DefaultComponents/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBApDqB,YAAY;iBAEjB,QAAQ;mBACN,UAAU;uBAEN,cAAc;6BAER,oBAAoB;8BACnB,aAAa;4CAEC,2BAA2B;8CACzB,6BAA6B;8BAC7C,qBAAqB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBApDqB,YAAY;iBAEjB,QAAQ;mBACN,UAAU;uBAEN,cAAc;6BAER,oBAAoB;8BACnB,aAAa;4CAEC,2BAA2B;8CACzB,6BAA6B;8BAC7C,qBAAqB"}

package/lib/Core/Components/DynamicFieldConfiguration.d.ts

@@ -1,7 +1,8 @@
-declare function DynamicFieldConfiguration({ column, onSubmit, onCancel, popoverButtonRef, heading }: {
+declare function DynamicFieldConfiguration({ column, onSubmit, onCancel, onAfterClose, popoverButtonRef, heading }: {
     column: any;
     onSubmit: any;
     onCancel: any;
+    onAfterClose: any;
     popoverButtonRef: any;
     heading: any;
 }): import("react/jsx-runtime").JSX.Element;
@@ -11,6 +12,7 @@ declare namespace DynamicFieldConfiguration {
             [x: string]: any;
         }>;
         let onCancel: PropTypes.Requireable<(...args: any[]) => any>;
+        let onAfterClose: PropTypes.Requireable<(...args: any[]) => any>;
         let onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
     }
     namespace defaultProps {

package/lib/Core/Components/DynamicFieldConfiguration.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFieldConfiguration.d.ts","sourceRoot":"","sources":["../../../Core/Components/DynamicFieldConfiguration.jsx"],"names":[],"mappings":"AAqGA;;;;;;4CA8EC;;;;;;;;;;QASW,mCAAQ;;QACR,mCAAQ;;;;;sBA7LE,YAAY"}
+{"version":3,"file":"DynamicFieldConfiguration.d.ts","sourceRoot":"","sources":["../../../Core/Components/DynamicFieldConfiguration.jsx"],"names":[],"mappings":"AAqGA;;;;;;;4CAkFC;;;;;;;;;;;QAUW,mCAAQ;;QACR,mCAAQ;;;;;sBAlME,YAAY"}

package/lib/Core/Components/DynamicFieldConfiguration.js

@@ -33,7 +33,7 @@ Body.propTypes = {
 Body.defaultProps = {
     error: null
 };
-export default function DynamicFieldConfiguration({ column, onSubmit, onCancel, popoverButtonRef, heading }) {
+export default function DynamicFieldConfiguration({ column, onSubmit, onCancel, onAfterClose, popoverButtonRef, heading }) {
     const [translate] = useTranslate();
     const { dynamicFieldTemplates } = column.parent.meta;
     const [templates, updateTemplates] = useState(dynamicFieldTemplates ? deepCopy(dynamicFieldTemplates) : []);
@@ -56,19 +56,22 @@ export default function DynamicFieldConfiguration({ column, onSubmit, onCancel,
     const submit = useCallback(() => {
         if (!fieldName.trim()) {
             setError(columnNameEmptyError);
-            return;
+            return false;
         }
         setError(null);
         onSubmit(fieldName, templates.find(t => t.selected).value, bHideColumns);
+        return true;
     }, [onSubmit, fieldName, templates, bHideColumns, columnNameEmptyError]);
     const cancel = useCallback(() => {
-        onCancel();
+        onCancel?.();
+        return true;
     }, [onCancel]);
-    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate(heading), onSubmit: submit, onCancel: cancel, target: popoverButtonRef.current, children: _jsx(Body, { templateNameEditHandler: templateNameEditHandler, templateChangeHandler: templateChangeHandler, hideColChangeHandler: hideColChangeHandler, templates: templates, fieldName: fieldName, bHideColumns: bHideColumns, error: error, translate: translate }) })) : null }));
+    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate(heading), onSubmit: submit, onCancel: cancel, onAfterClose: onAfterClose, target: popoverButtonRef.current, children: _jsx(Body, { templateNameEditHandler: templateNameEditHandler, templateChangeHandler: templateChangeHandler, hideColChangeHandler: hideColChangeHandler, templates: templates, fieldName: fieldName, bHideColumns: bHideColumns, error: error, translate: translate }) })) : null }));
 }
 DynamicFieldConfiguration.propTypes = {
     column: PropTypes.objectOf(PropTypes.any).isRequired,
     onCancel: PropTypes.func,
+    onAfterClose: PropTypes.func,
     onSubmit: PropTypes.func
 };
 DynamicFieldConfiguration.defaultProps = {

package/lib/Core/Components/DynamicFieldConfiguration.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFieldConfiguration.js","sourceRoot":"","sources":["../../../Core/Components/DynamicFieldConfiguration.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { memo, useCallback, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Select, Option, Button, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport { deepCopy } from '../Utils';\nimport useTranslate from '../Hooks/useTranslate';\n\nconst StyledRow = styled.div`\n  margin: 0.625rem 0;\n`;\n\nconst Footer = memo(({ cancel, submit, translate }) => {\n  return (\n    <footer>\n      <Button onClick={cancel}>{translate('Cancel')}</Button>\n      <Button variant='primary' onClick={submit}>\n        {translate('Submit')}\n      </Button>\n    </footer>\n  );\n});\n\nFooter.propTypes = {\n  cancel: PropTypes.func.isRequired,\n  submit: PropTypes.func.isRequired,\n  translate: PropTypes.func.isRequired\n};\n\nconst Body = memo(\n  ({\n    templateNameEditHandler,\n    templateChangeHandler,\n    hideColChangeHandler,\n    templates,\n    fieldName,\n    bHideColumns,\n    error,\n    translate\n  }) => {\n    const selectedTemplate = templates.find(t => t.selected).value;\n    return (\n      <>\n        <StyledRow>\n          <Input\n            id='column-name'\n            type='text'\n            onChange={templateNameEditHandler}\n            label={translate('Column name:')}\n            placeholder={translate('Enter a name')}\n            value={fieldName}\n            required\n            status={error ? 'error' : null}\n            info={error}\n          />\n        </StyledRow>\n        <StyledRow>\n          <Select\n            id='select-template'\n            value={selectedTemplate}\n            onChange={templateChangeHandler}\n            label={translate('Template:')}\n          >\n            {templates.map(v => (\n              <Option key={v.value} value={v.value}>\n                {translate(v.name)}\n              </Option>\n            ))}\n          </Select>\n        </StyledRow>\n        <StyledRow>\n          <Checkbox\n            checked={bHideColumns}\n            key='hideColumns'\n            id='hideColumns'\n            onChange={hideColChangeHandler}\n            label={translate('Hide columns')}\n            name='Hide columns'\n          />\n        </StyledRow>\n      </>\n    );\n  }\n);\n\nBody.propTypes = {\n  templateNameEditHandler: PropTypes.func.isRequired,\n  templateChangeHandler: PropTypes.func.isRequired,\n  hideColChangeHandler: PropTypes.func.isRequired,\n  templates: PropTypes.arrayOf(PropTypes.any).isRequired,\n  fieldName: PropTypes.string.isRequired,\n  bHideColumns: PropTypes.bool.isRequired,\n  error: PropTypes.string,\n  translate: PropTypes.func.isRequired\n};\n\nBody.defaultProps = {\n  error: null\n};\n\nexport default function DynamicFieldConfiguration({\n  column,\n  onSubmit,\n  onCancel,\n  popoverButtonRef,\n  heading\n}) {\n  const [translate] = useTranslate();\n\n  const { dynamicFieldTemplates } = column.parent.meta;\n\n  const [templates, updateTemplates] = useState(\n    dynamicFieldTemplates ? deepCopy(dynamicFieldTemplates) : []\n  );\n  const [fieldName, updateFieldName] = useState('');\n  const [bHideColumns, updateHideColumns] = useState(true);\n  const [error, setError] = useState();\n  const columnNameEmptyError = translate('Column name cannot be empty.');\n\n  const templateChangeHandler = useCallback(\n    e => {\n      const items = [...templates];\n      items.find(t => t.selected).selected = false;\n      items.find(t => t.value === e.target.value).selected = true;\n      updateTemplates(items);\n    },\n    [templates, updateTemplates]\n  );\n\n  const templateNameEditHandler = useCallback(\n    e => {\n      updateFieldName(e.target.value);\n    },\n    [updateFieldName]\n  );\n  const hideColChangeHandler = useCallback(\n    e => {\n      updateHideColumns(e.target.checked);\n    },\n    [updateHideColumns]\n  );\n\n  const submit = useCallback(() => {\n    if (!fieldName.trim()) {\n      setError(columnNameEmptyError);\n      return;\n    }\n    setError(null);\n\n    onSubmit(fieldName, templates.find(t => t.selected).value, bHideColumns);\n  }, [onSubmit, fieldName, templates, bHideColumns, columnNameEmptyError]);\n\n  const cancel = useCallback(() => {\n    onCancel();\n  }, [onCancel]);\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate(heading)}\n          onSubmit={submit}\n          onCancel={cancel}\n          target={popoverButtonRef.current}\n        >\n          <Body\n            templateNameEditHandler={templateNameEditHandler}\n            templateChangeHandler={templateChangeHandler}\n            hideColChangeHandler={hideColChangeHandler}\n            templates={templates}\n            fieldName={fieldName}\n            bHideColumns={bHideColumns}\n            error={error}\n            translate={translate}\n          />\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nDynamicFieldConfiguration.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  onCancel: PropTypes.func,\n  onSubmit: PropTypes.func\n};\n\nDynamicFieldConfiguration.defaultProps = {\n  onCancel: () => {},\n  onSubmit: () => {}\n};\n"]}
+{"version":3,"file":"DynamicFieldConfiguration.js","sourceRoot":"","sources":["../../../Core/Components/DynamicFieldConfiguration.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { memo, useCallback, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Select, Option, Button, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport { deepCopy } from '../Utils';\nimport useTranslate from '../Hooks/useTranslate';\n\nconst StyledRow = styled.div`\n  margin: 0.625rem 0;\n`;\n\nconst Footer = memo(({ cancel, submit, translate }) => {\n  return (\n    <footer>\n      <Button onClick={cancel}>{translate('Cancel')}</Button>\n      <Button variant='primary' onClick={submit}>\n        {translate('Submit')}\n      </Button>\n    </footer>\n  );\n});\n\nFooter.propTypes = {\n  cancel: PropTypes.func.isRequired,\n  submit: PropTypes.func.isRequired,\n  translate: PropTypes.func.isRequired\n};\n\nconst Body = memo(\n  ({\n    templateNameEditHandler,\n    templateChangeHandler,\n    hideColChangeHandler,\n    templates,\n    fieldName,\n    bHideColumns,\n    error,\n    translate\n  }) => {\n    const selectedTemplate = templates.find(t => t.selected).value;\n    return (\n      <>\n        <StyledRow>\n          <Input\n            id='column-name'\n            type='text'\n            onChange={templateNameEditHandler}\n            label={translate('Column name:')}\n            placeholder={translate('Enter a name')}\n            value={fieldName}\n            required\n            status={error ? 'error' : null}\n            info={error}\n          />\n        </StyledRow>\n        <StyledRow>\n          <Select\n            id='select-template'\n            value={selectedTemplate}\n            onChange={templateChangeHandler}\n            label={translate('Template:')}\n          >\n            {templates.map(v => (\n              <Option key={v.value} value={v.value}>\n                {translate(v.name)}\n              </Option>\n            ))}\n          </Select>\n        </StyledRow>\n        <StyledRow>\n          <Checkbox\n            checked={bHideColumns}\n            key='hideColumns'\n            id='hideColumns'\n            onChange={hideColChangeHandler}\n            label={translate('Hide columns')}\n            name='Hide columns'\n          />\n        </StyledRow>\n      </>\n    );\n  }\n);\n\nBody.propTypes = {\n  templateNameEditHandler: PropTypes.func.isRequired,\n  templateChangeHandler: PropTypes.func.isRequired,\n  hideColChangeHandler: PropTypes.func.isRequired,\n  templates: PropTypes.arrayOf(PropTypes.any).isRequired,\n  fieldName: PropTypes.string.isRequired,\n  bHideColumns: PropTypes.bool.isRequired,\n  error: PropTypes.string,\n  translate: PropTypes.func.isRequired\n};\n\nBody.defaultProps = {\n  error: null\n};\n\nexport default function DynamicFieldConfiguration({\n  column,\n  onSubmit,\n  onCancel,\n  onAfterClose,\n  popoverButtonRef,\n  heading\n}) {\n  const [translate] = useTranslate();\n\n  const { dynamicFieldTemplates } = column.parent.meta;\n\n  const [templates, updateTemplates] = useState(\n    dynamicFieldTemplates ? deepCopy(dynamicFieldTemplates) : []\n  );\n  const [fieldName, updateFieldName] = useState('');\n  const [bHideColumns, updateHideColumns] = useState(true);\n  const [error, setError] = useState();\n  const columnNameEmptyError = translate('Column name cannot be empty.');\n\n  const templateChangeHandler = useCallback(\n    e => {\n      const items = [...templates];\n      items.find(t => t.selected).selected = false;\n      items.find(t => t.value === e.target.value).selected = true;\n      updateTemplates(items);\n    },\n    [templates, updateTemplates]\n  );\n\n  const templateNameEditHandler = useCallback(\n    e => {\n      updateFieldName(e.target.value);\n    },\n    [updateFieldName]\n  );\n  const hideColChangeHandler = useCallback(\n    e => {\n      updateHideColumns(e.target.checked);\n    },\n    [updateHideColumns]\n  );\n\n  const submit = useCallback(() => {\n    if (!fieldName.trim()) {\n      setError(columnNameEmptyError);\n      return false;\n    }\n    setError(null);\n\n    onSubmit(fieldName, templates.find(t => t.selected).value, bHideColumns);\n    return true;\n  }, [onSubmit, fieldName, templates, bHideColumns, columnNameEmptyError]);\n\n  const cancel = useCallback(() => {\n    onCancel?.();\n    return true;\n  }, [onCancel]);\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate(heading)}\n          onSubmit={submit}\n          onCancel={cancel}\n          onAfterClose={onAfterClose}\n          target={popoverButtonRef.current}\n        >\n          <Body\n            templateNameEditHandler={templateNameEditHandler}\n            templateChangeHandler={templateChangeHandler}\n            hideColChangeHandler={hideColChangeHandler}\n            templates={templates}\n            fieldName={fieldName}\n            bHideColumns={bHideColumns}\n            error={error}\n            translate={translate}\n          />\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nDynamicFieldConfiguration.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  onCancel: PropTypes.func,\n  onAfterClose: PropTypes.func,\n  onSubmit: PropTypes.func\n};\n\nDynamicFieldConfiguration.defaultProps = {\n  onCancel: () => {},\n  onSubmit: () => {}\n};\n"]}

package/lib/Core/Components/Filters/AdvanceFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdvanceFilter.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Filters/AdvanceFilter.jsx"],"names":[],"mappings":"AAWA;;;;mDAgDC;;;;;;;;;;sBA3DqB,YAAY"}
+{"version":3,"file":"AdvanceFilter.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Filters/AdvanceFilter.jsx"],"names":[],"mappings":"AAWA;;;;mDAiDC;;;;;;;;;;sBA5DqB,YAAY"}

package/lib/Core/Components/Filters/AdvanceFilter.js

@@ -9,7 +9,7 @@ import useValidRhsTypes from './Hooks/useValidRhsTypes';
 export default function AdvanceFilter({ setShowFilter, view, popoverButtonRef }) {
     const filterExpression = view.state?.filterExpression;
     const viewFieldDefs = view.getFieldDefs();
-    const formattedColumns = useMemo(() => getMenuItemsFromColumns(viewFieldDefs.filter(fieldDef => fieldDef.filter), 'name', {
+    const formattedColumns = useMemo(() => getMenuItemsFromColumns(viewFieldDefs.filter(fieldDef => fieldDef.filter), 'name', view, {
         columns: view.columns
     }), [viewFieldDefs, view.columns]);
     const validRhsTypes = useValidRhsTypes(view);
@@ -17,14 +17,14 @@ export default function AdvanceFilter({ setShowFilter, view, popoverButtonRef })
     const [translate] = useTranslate();
     // FIXME: popoverButtonRef should be converted to a state since refs should not be read during render.
     // https://react.dev/learn/referencing-values-with-refs#differences-between-refs-and-state
-    return popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), target: popoverButtonRef.current, placement: 'bottom-start', onCancel: () => {
-            setShowFilter(false);
-        }, onSubmit: () => {
+    return popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), target: popoverButtonRef.current, placement: 'bottom-start', onSubmit: () => {
             const [valid, filterExp] = handle.current.getCondition();
             if (valid) {
-                setShowFilter(false);
                 view.type.applyFilter({ filterExp });
             }
+            return valid;
+        }, onAfterClose: () => {
+            setShowFilter(false);
         }, children: _jsx(ConditionBuilder, { fields: formattedColumns, condition: filterExpression || undefined, validRhsTypes: validRhsTypes, dateFunctions: view.meta.dateFunctions, disallowNOT: true, handle: handle }) })) : null;
 }
 AdvanceFilter.propTypes = {

package/lib/Core/Components/Filters/AdvanceFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdvanceFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/AdvanceFilter.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,uBAAuB,MAAM,wBAAwB,CAAC;AAC7D,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,gBAAgB,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,gBAAgB,EAAE;IAC7E,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,EAAE,gBAAgB,CAAC;IACtD,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;IAE1C,MAAM,gBAAgB,GAAG,OAAO,CAC9B,GAAG,EAAE,CACH,uBAAuB,CACrB,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EACjD,MAAM,EACN;QACE,OAAO,EAAE,IAAI,CAAC,OAAO;KACtB,CACF,EACH,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAC9B,CAAC;IAEF,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAE5B,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,sGAAsG;IACtG,0FAA0F;IAC1F,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChC,KAAC,UAAU,IACT,OAAO,EAAE,SAAS,CAAC,eAAe,CAAC,EACnC,MAAM,EAAE,gBAAgB,CAAC,OAAO,EAChC,SAAS,EAAC,cAAc,EACxB,QAAQ,EAAE,GAAG,EAAE;YACb,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;YACb,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;YACzD,IAAI,KAAK,EAAE,CAAC;gBACV,aAAa,CAAC,KAAK,CAAC,CAAC;gBACrB,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;YACvC,CAAC;QACH,CAAC,YAED,KAAC,gBAAgB,IACf,MAAM,EAAE,gBAAgB,EACxB,SAAS,EAAE,gBAAgB,IAAI,SAAS,EACxC,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,EACtC,WAAW,QACX,MAAM,EAAE,MAAM,GACd,GACS,CACd,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC;AAED,aAAa,CAAC,SAAS,GAAG;IACxB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,aAAa,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CACzC,CAAC","sourcesContent":["import PropTypes from 'prop-types';\nimport { useRef, useMemo } from 'react';\n\nimport { ConditionBuilder } from '@pega/cosmos-react-condition-builder';\nimport { FormDialog } from '@pega/cosmos-react-core';\n\nimport getMenuItemsFromColumns from '../Toolbar/utils/utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport useValidRhsTypes from './Hooks/useValidRhsTypes';\n\nexport default function AdvanceFilter({ setShowFilter, view, popoverButtonRef }) {\n  const filterExpression = view.state?.filterExpression;\n  const viewFieldDefs = view.getFieldDefs();\n\n  const formattedColumns = useMemo(\n    () =>\n      getMenuItemsFromColumns(\n        viewFieldDefs.filter(fieldDef => fieldDef.filter),\n        'name',\n        {\n          columns: view.columns\n        }\n      ),\n    [viewFieldDefs, view.columns]\n  );\n\n  const validRhsTypes = useValidRhsTypes(view);\n  const handle = useRef(null);\n\n  const [translate] = useTranslate();\n  // FIXME: popoverButtonRef should be converted to a state since refs should not be read during render.\n  // https://react.dev/learn/referencing-values-with-refs#differences-between-refs-and-state\n  return popoverButtonRef.current ? (\n    <FormDialog\n      heading={translate('Filter column')}\n      target={popoverButtonRef.current}\n      placement='bottom-start'\n      onCancel={() => {\n        setShowFilter(false);\n      }}\n      onSubmit={() => {\n        const [valid, filterExp] = handle.current.getCondition();\n        if (valid) {\n          setShowFilter(false);\n          view.type.applyFilter({ filterExp });\n        }\n      }}\n    >\n      <ConditionBuilder\n        fields={formattedColumns}\n        condition={filterExpression || undefined}\n        validRhsTypes={validRhsTypes}\n        dateFunctions={view.meta.dateFunctions} // Could be undefined\n        disallowNOT\n        handle={handle}\n      />\n    </FormDialog>\n  ) : null;\n}\n\nAdvanceFilter.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  setShowFilter: PropTypes.func.isRequired\n};\n"]}
+{"version":3,"file":"AdvanceFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/AdvanceFilter.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,uBAAuB,MAAM,wBAAwB,CAAC;AAC7D,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,gBAAgB,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,gBAAgB,EAAE;IAC7E,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,EAAE,gBAAgB,CAAC;IACtD,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;IAE1C,MAAM,gBAAgB,GAAG,OAAO,CAC9B,GAAG,EAAE,CACH,uBAAuB,CACrB,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EACjD,MAAM,EACN,IAAI,EACJ;QACE,OAAO,EAAE,IAAI,CAAC,OAAO;KACtB,CACF,EACH,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAC9B,CAAC;IAEF,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAE5B,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,sGAAsG;IACtG,0FAA0F;IAC1F,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChC,KAAC,UAAU,IACT,OAAO,EAAE,SAAS,CAAC,eAAe,CAAC,EACnC,MAAM,EAAE,gBAAgB,CAAC,OAAO,EAChC,SAAS,EAAC,cAAc,EACxB,QAAQ,EAAE,GAAG,EAAE;YACb,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;YACzD,IAAI,KAAK,EAAE,CAAC;gBACV,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;YACvC,CAAC;YACD,OAAO,KAAK,CAAC;QACf,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;YACjB,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,YAED,KAAC,gBAAgB,IACf,MAAM,EAAE,gBAAgB,EACxB,SAAS,EAAE,gBAAgB,IAAI,SAAS,EACxC,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,EACtC,WAAW,QACX,MAAM,EAAE,MAAM,GACd,GACS,CACd,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC;AAED,aAAa,CAAC,SAAS,GAAG;IACxB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,aAAa,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CACzC,CAAC","sourcesContent":["import PropTypes from 'prop-types';\nimport { useRef, useMemo } from 'react';\n\nimport { ConditionBuilder } from '@pega/cosmos-react-condition-builder';\nimport { FormDialog } from '@pega/cosmos-react-core';\n\nimport getMenuItemsFromColumns from '../Toolbar/utils/utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport useValidRhsTypes from './Hooks/useValidRhsTypes';\n\nexport default function AdvanceFilter({ setShowFilter, view, popoverButtonRef }) {\n  const filterExpression = view.state?.filterExpression;\n  const viewFieldDefs = view.getFieldDefs();\n\n  const formattedColumns = useMemo(\n    () =>\n      getMenuItemsFromColumns(\n        viewFieldDefs.filter(fieldDef => fieldDef.filter),\n        'name',\n        view,\n        {\n          columns: view.columns\n        }\n      ),\n    [viewFieldDefs, view.columns]\n  );\n\n  const validRhsTypes = useValidRhsTypes(view);\n  const handle = useRef(null);\n\n  const [translate] = useTranslate();\n  // FIXME: popoverButtonRef should be converted to a state since refs should not be read during render.\n  // https://react.dev/learn/referencing-values-with-refs#differences-between-refs-and-state\n  return popoverButtonRef.current ? (\n    <FormDialog\n      heading={translate('Filter column')}\n      target={popoverButtonRef.current}\n      placement='bottom-start'\n      onSubmit={() => {\n        const [valid, filterExp] = handle.current.getCondition();\n        if (valid) {\n          view.type.applyFilter({ filterExp });\n        }\n        return valid;\n      }}\n      onAfterClose={() => {\n        setShowFilter(false);\n      }}\n    >\n      <ConditionBuilder\n        fields={formattedColumns}\n        condition={filterExpression || undefined}\n        validRhsTypes={validRhsTypes}\n        dateFunctions={view.meta.dateFunctions} // Could be undefined\n        disallowNOT\n        handle={handle}\n      />\n    </FormDialog>\n  ) : null;\n}\n\nAdvanceFilter.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  setShowFilter: PropTypes.func.isRequired\n};\n"]}

package/lib/Core/Components/Filters/BooleanFilter.js

@@ -27,10 +27,10 @@ export default function BooleanFilter({ column, finishPopOver, onFilter, popover
         onFilter({
             filterExp: localFilterExpression
         });
-        finishPopOver();
+        return true;
     }, [comparator, filter, filterExpression, column, onFilter]);
     column.setExecutionContext(null); // re-setting executionContext to null
-    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: submitFilter, onCancel: finishPopOver, target: popoverButtonRef.current, children: _jsx(RadioCheckGroup, { name: column.field.name, children: filterParams.map(item => {
+    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: submitFilter, onAfterClose: finishPopOver, target: popoverButtonRef.current, children: _jsx(RadioCheckGroup, { name: column.field.name, children: filterParams.map(item => {
                     const context = {
                         getValue: () => 
                         // For boolean values(true/False), the display value should match with cell renderer value, We should not do any translations on it as those are not strings.

package/lib/Core/Components/Filters/BooleanFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"BooleanFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/BooleanFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useCallback } from 'react';\n\nimport { RadioButton, RadioCheckGroup, FormDialog } from '@pega/cosmos-react-core';\nimport { addFilter, getFilterInitializers, comparatorMap } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function BooleanFilter({ column, finishPopOver, onFilter, popoverButtonRef }) {\n  const [, fValue, filter, filterExpression] = getFilterInitializers(column);\n  const [comparator, setComparator] = useState(fValue);\n  const {\n    field: { filterParams }\n  } = column;\n  const [translate] = useTranslate();\n  const onFilterChange = useCallback(event => {\n    const { value } = event.target;\n    setComparator(value);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    // sending filter expression\n    const formattedComp = comparatorMap[comparator];\n    let localFilterExpression = null;\n    localFilterExpression = addFilter({\n      filterExpression: filter ? null : filterExpression,\n      column,\n      comparator: formattedComp,\n      input: null\n    });\n    onFilter({\n      filterExp: localFilterExpression\n    });\n    finishPopOver();\n  }, [comparator, filter, filterExpression, column, onFilter]);\n\n  column.setExecutionContext(null); // re-setting executionContext to null\n\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate('Filter column')}\n          onSubmit={submitFilter}\n          onCancel={finishPopOver}\n          target={popoverButtonRef.current}\n        >\n          <RadioCheckGroup name={column.field.name}>\n            {filterParams.map(item => {\n              const context = {\n                getValue: () =>\n                  // For boolean values(true/False), the display value should match with cell renderer value, We should not do any translations on it as those are not strings.\n                  typeof item.value === 'boolean' ? item.value : translate(item.value)\n              };\n              return (\n                <RadioButton\n                  key={item.key}\n                  id={item.key}\n                  name={item.key}\n                  onClick={onFilterChange}\n                  value={item.key}\n                  checked={comparator === item.key}\n                  label={\n                    <RenderingEngine {...column.getRenderingEngineProps()} context={context} />\n                  }\n                />\n              );\n            })}\n          </RadioCheckGroup>\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nBooleanFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}
+{"version":3,"file":"BooleanFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/BooleanFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useCallback } from 'react';\n\nimport { RadioButton, RadioCheckGroup, FormDialog } from '@pega/cosmos-react-core';\nimport { addFilter, getFilterInitializers, comparatorMap } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function BooleanFilter({ column, finishPopOver, onFilter, popoverButtonRef }) {\n  const [, fValue, filter, filterExpression] = getFilterInitializers(column);\n  const [comparator, setComparator] = useState(fValue);\n  const {\n    field: { filterParams }\n  } = column;\n  const [translate] = useTranslate();\n  const onFilterChange = useCallback(event => {\n    const { value } = event.target;\n    setComparator(value);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    // sending filter expression\n    const formattedComp = comparatorMap[comparator];\n    let localFilterExpression = null;\n    localFilterExpression = addFilter({\n      filterExpression: filter ? null : filterExpression,\n      column,\n      comparator: formattedComp,\n      input: null\n    });\n    onFilter({\n      filterExp: localFilterExpression\n    });\n    return true;\n  }, [comparator, filter, filterExpression, column, onFilter]);\n\n  column.setExecutionContext(null); // re-setting executionContext to null\n\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate('Filter column')}\n          onSubmit={submitFilter}\n          onAfterClose={finishPopOver}\n          target={popoverButtonRef.current}\n        >\n          <RadioCheckGroup name={column.field.name}>\n            {filterParams.map(item => {\n              const context = {\n                getValue: () =>\n                  // For boolean values(true/False), the display value should match with cell renderer value, We should not do any translations on it as those are not strings.\n                  typeof item.value === 'boolean' ? item.value : translate(item.value)\n              };\n              return (\n                <RadioButton\n                  key={item.key}\n                  id={item.key}\n                  name={item.key}\n                  onClick={onFilterChange}\n                  value={item.key}\n                  checked={comparator === item.key}\n                  label={\n                    <RenderingEngine {...column.getRenderingEngineProps()} context={context} />\n                  }\n                />\n              );\n            })}\n          </RadioCheckGroup>\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nBooleanFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}

package/lib/Core/Components/Filters/CommonFilter.js

@@ -56,7 +56,7 @@ export default function CommonFilter({ column, onFilter, finishPopOver, popoverB
             break;
         }
     }
-    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: applyFilter, onCancel: finishPopOver, target: popoverButtonRef.current, children: _jsxs(Flex, { container: { direction: 'column', wrap: 'no-wrap', itemGap: 1 }, children: [_jsx(Flex, { item: true, children: _jsx(Select, { defaultValue: comparator, onChange: e => onFilterChange({ value: e.target.value }), id: `select-${column.field.name}`, label: translate('Filter comparison'), children: params.map(opt => (_jsx(Option, { value: opt.key, children: translate(opt.value) }, opt.key))) }) }), _jsx(Flex, { item: true, children: content })] }) })) : null }));
+    return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: () => submitFilter() !== false, onAfterClose: finishPopOver, target: popoverButtonRef.current, children: _jsxs(Flex, { container: { direction: 'column', wrap: 'no-wrap', itemGap: 1 }, children: [_jsx(Flex, { item: true, children: _jsx(Select, { defaultValue: comparator, onChange: e => onFilterChange({ value: e.target.value }), id: `select-${column.field.name}`, label: translate('Filter comparison'), children: params.map(opt => (_jsx(Option, { value: opt.key, children: translate(opt.value) }, opt.key))) }) }), _jsx(Flex, { item: true, children: content })] }) })) : null }));
 }
 CommonFilter.propTypes = {
     column: PropTypes.objectOf(PropTypes.any).isRequired,

package/lib/Core/Components/Filters/CommonFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommonFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/CommonFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useCallback, useEffect } from 'react';\n\nimport { Select, Option, Flex, FormDialog } from '@pega/cosmos-react-core';\nimport {\n  addFilter,\n  getFilterInitializers,\n  comparatorMap,\n  FieldType\n} from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport InputWrapper from './InputWrapper';\nimport useFilterSubmit from './Hooks/useFilterSubmit';\n\nexport default function CommonFilter({ column, onFilter, finishPopOver, popoverButtonRef }) {\n  const params = column.field.filterParams || [];\n  const [fInput, fValue, filter, filterExpression] = getFilterInitializers(column);\n  const [filterInput, setFilterInput] = useState(fInput);\n  const [comparator, setComparator] = useState(fValue);\n  const [translate] = useTranslate();\n  let content = null;\n  useEffect(() => {\n    /* Safe check for params */\n    if (params?.[0]?.key && !comparator) setComparator(params[0].key);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    /* Sending filter expression */\n    const newFilterExpression = addFilter({\n      filterExpression: filter ? null : filterExpression,\n      column,\n      comparator: comparatorMap[comparator],\n      input: filterInput\n    });\n    onFilter({\n      filterExp: newFilterExpression\n    });\n  }, [filter, filterExpression, column, comparator, filterInput, onFilter]);\n\n  const onFilterChange = useCallback(({ value: comparatorType }) => {\n    setComparator(comparatorType);\n  }, []);\n\n  const applyFilter = useFilterSubmit({ finishPopOver, submitFilter });\n\n  const onTextChange = useCallback(value => {\n    setFilterInput(value);\n  }, []);\n\n  const onNumberChange = useCallback(value => {\n    setFilterInput(parseFloat(value));\n  }, []);\n\n  const handleSubmitHandler = e => {\n    if (e.key === 'Enter') {\n      applyFilter();\n    }\n  };\n\n  // eslint-disable-next-line sonarjs/no-small-switch\n  switch (column.field.type) {\n    case FieldType.NUMBER: {\n      content = (\n        <InputWrapper\n          id={`${column.field.name}`}\n          type='number'\n          onChange={onNumberChange}\n          onKeyDown={handleSubmitHandler}\n          style={{ width: '100%' }}\n          label={translate('Filter value')}\n          value={filterInput}\n        />\n      );\n      break;\n    }\n    default: {\n      content = (\n        <InputWrapper\n          id={`${column.field.name}`}\n          type='text'\n          onChange={onTextChange}\n          onKeyDown={handleSubmitHandler}\n          style={{ width: '100%' }}\n          label={translate('Filter value')}\n          value={filterInput}\n        />\n      );\n      break;\n    }\n  }\n\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate('Filter column')}\n          onSubmit={applyFilter}\n          onCancel={finishPopOver}\n          target={popoverButtonRef.current}\n        >\n          <Flex container={{ direction: 'column', wrap: 'no-wrap', itemGap: 1 }}>\n            <Flex item>\n              <Select\n                defaultValue={comparator}\n                onChange={e => onFilterChange({ value: e.target.value })}\n                id={`select-${column.field.name}`}\n                label={translate('Filter comparison')}\n              >\n                {params.map(opt => (\n                  <Option key={opt.key} value={opt.key}>\n                    {translate(opt.value)}\n                  </Option>\n                ))}\n              </Select>\n            </Flex>\n            <Flex item>{content}</Flex>\n          </Flex>\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nCommonFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}
+{"version":3,"file":"CommonFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/CommonFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useCallback, useEffect } from 'react';\n\nimport { Select, Option, Flex, FormDialog } from '@pega/cosmos-react-core';\nimport {\n  addFilter,\n  getFilterInitializers,\n  comparatorMap,\n  FieldType\n} from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport InputWrapper from './InputWrapper';\nimport useFilterSubmit from './Hooks/useFilterSubmit';\n\nexport default function CommonFilter({ column, onFilter, finishPopOver, popoverButtonRef }) {\n  const params = column.field.filterParams || [];\n  const [fInput, fValue, filter, filterExpression] = getFilterInitializers(column);\n  const [filterInput, setFilterInput] = useState(fInput);\n  const [comparator, setComparator] = useState(fValue);\n  const [translate] = useTranslate();\n  let content = null;\n  useEffect(() => {\n    /* Safe check for params */\n    if (params?.[0]?.key && !comparator) setComparator(params[0].key);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    /* Sending filter expression */\n    const newFilterExpression = addFilter({\n      filterExpression: filter ? null : filterExpression,\n      column,\n      comparator: comparatorMap[comparator],\n      input: filterInput\n    });\n    onFilter({\n      filterExp: newFilterExpression\n    });\n  }, [filter, filterExpression, column, comparator, filterInput, onFilter]);\n\n  const onFilterChange = useCallback(({ value: comparatorType }) => {\n    setComparator(comparatorType);\n  }, []);\n\n  const applyFilter = useFilterSubmit({ finishPopOver, submitFilter });\n\n  const onTextChange = useCallback(value => {\n    setFilterInput(value);\n  }, []);\n\n  const onNumberChange = useCallback(value => {\n    setFilterInput(parseFloat(value));\n  }, []);\n\n  const handleSubmitHandler = e => {\n    if (e.key === 'Enter') {\n      applyFilter();\n    }\n  };\n\n  // eslint-disable-next-line sonarjs/no-small-switch\n  switch (column.field.type) {\n    case FieldType.NUMBER: {\n      content = (\n        <InputWrapper\n          id={`${column.field.name}`}\n          type='number'\n          onChange={onNumberChange}\n          onKeyDown={handleSubmitHandler}\n          style={{ width: '100%' }}\n          label={translate('Filter value')}\n          value={filterInput}\n        />\n      );\n      break;\n    }\n    default: {\n      content = (\n        <InputWrapper\n          id={`${column.field.name}`}\n          type='text'\n          onChange={onTextChange}\n          onKeyDown={handleSubmitHandler}\n          style={{ width: '100%' }}\n          label={translate('Filter value')}\n          value={filterInput}\n        />\n      );\n      break;\n    }\n  }\n\n  return (\n    <>\n      {popoverButtonRef.current ? (\n        <FormDialog\n          heading={translate('Filter column')}\n          onSubmit={() => submitFilter() !== false}\n          onAfterClose={finishPopOver}\n          target={popoverButtonRef.current}\n        >\n          <Flex container={{ direction: 'column', wrap: 'no-wrap', itemGap: 1 }}>\n            <Flex item>\n              <Select\n                defaultValue={comparator}\n                onChange={e => onFilterChange({ value: e.target.value })}\n                id={`select-${column.field.name}`}\n                label={translate('Filter comparison')}\n              >\n                {params.map(opt => (\n                  <Option key={opt.key} value={opt.key}>\n                    {translate(opt.value)}\n                  </Option>\n                ))}\n              </Select>\n            </Flex>\n            <Flex item>{content}</Flex>\n          </Flex>\n        </FormDialog>\n      ) : null}\n    </>\n  );\n}\n\nCommonFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}

package/lib/Core/Components/Filters/SelectFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectFilter.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Filters/SelectFilter.jsx"],"names":[],"mappings":"AA6BA;;;;;mDAoJC;;;;;;;;;;;sBAjLqB,YAAY"}
+{"version":3,"file":"SelectFilter.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Filters/SelectFilter.jsx"],"names":[],"mappings":"AAmDA;;;;;mDAqJC;;;;;;;;;;;sBAxMqB,YAAY"}

package/lib/Core/Components/Filters/SelectFilter.js

@@ -4,14 +4,33 @@ import { useState, useEffect, useCallback, useRef } from 'react';
 import styled from 'styled-components';
 import { Checkbox, CheckboxGroup, Select, Option, FormDialog, Progress } from '@pega/cosmos-react-core';
 import { addFilter, getFilterInitializers, comparatorMap, FieldType, isEmpty } from 'pega-repeating-structures-core';
+import { StyledChildrenWrap, StyledDialogContent } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';
 import RenderingEngine from '../RenderingEngine/RenderCell';
 import useTranslate from '../../Hooks/useTranslate';
+const StyledSelectFilterDialog = styled(FormDialog) `
+  ${StyledDialogContent} {
+    /* Flex height chain so the checkbox list scrolls internally instead of the
+       dialog content. */
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+
+    ${StyledChildrenWrap} {
+      display: flex;
+      flex-direction: column;
+      flex: 1;
+      min-height: 0;
+    }
+  }
+`;
 const CheckboxGroupStyle = styled.div `
   max-height: 11.719rem;
   overflow: auto;
   margin-top: 0.5rem;
 `;
 export default function SelectFilter({ column, finishPopOver, onFilter, popoverButtonRef }) {
+    const view = column.parent;
     const [fInput, fValue, , filterExpression] = getFilterInitializers(column);
     const [uniqueValues, setUniqueColumnValues] = useState([]);
     const [uniqueValuesFetched, setUniqueValuesFetched] = useState(false);
@@ -21,15 +40,15 @@ export default function SelectFilter({ column, finishPopOver, onFilter, popoverB
     const [comparator, setComparator] = useState(fValue);
     const syncUniqueValues = useCallback(() => {
         if (!uniqueValuesFetched)
-            column
-                .getUniqueValues()
+            view
+                .getUniqueValues(column.field.id)
                 .then(filteredData => {
                 setUniqueColumnValues(filteredData.filter(v => !isEmpty(v)));
             })
                 .finally(() => {
                 setUniqueValuesFetched(true);
             });
-    }, [column, uniqueValuesFetched]);
+    }, [column, uniqueValuesFetched, view]);
     const [translate] = useTranslate();
     useEffect(() => {
         const resultSet = new Set();
@@ -69,7 +88,7 @@ export default function SelectFilter({ column, finishPopOver, onFilter, popoverB
         onFilter({
             filterExp: localFilterExpression
         });
-        finishPopOver();
+        return true;
     }, [comparator, filterExpression, column, onFilter, prePopulateSelectFilter]);
     const onSelectOrDeselect = useCallback(event => {
         /* Disabling operators like isAnyOf isNoneOf */
@@ -93,7 +112,7 @@ export default function SelectFilter({ column, finishPopOver, onFilter, popoverB
     const selectedValueSet = new Set(selectedValuesRef.current);
     if (!popoverButtonRef.current)
         return null;
-    return (_jsxs(FormDialog, { heading: translate('Filter column'), onSubmit: submitFilter, onCancel: finishPopOver, target: popoverButtonRef.current, children: [_jsx(Select, { defaultValue: comparator, onChange: e => onFilterChange({ value: e.target.value }), children: (column.field.filterParams || []).map(opt => (_jsx(Option, { value: opt.key, children: translate(opt.value) }, opt.key))) }), showUniqueValues && (_jsxs(CheckboxGroupStyle, { className: 'popup-menu', children: [_jsx(CheckboxGroup, { children: uniqueValues.map(item => {
+    return (_jsxs(StyledSelectFilterDialog, { heading: translate('Filter column'), onSubmit: submitFilter, onAfterClose: finishPopOver, target: popoverButtonRef.current, children: [_jsx(Select, { defaultValue: comparator, onChange: e => onFilterChange({ value: e.target.value }), children: (column.field.filterParams || []).map(opt => (_jsx(Option, { value: opt.key, children: translate(opt.value) }, opt.key))) }), showUniqueValues && (_jsxs(CheckboxGroupStyle, { className: 'popup-menu', "data-testid": 'select-filter-values', children: [_jsx(CheckboxGroup, { children: uniqueValues.map(item => {
                             const isItemSelected = selectedValueSet.has(item);
                             // Custom context prepared for Rendering engine should contain getExecutionContext
                             // otherwise the execution context will be populated wrongly from the previous table rendering cycle.