@pega/lists-react 9.36.0 → 9.37.0

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

@@ -55,12 +55,12 @@ export default function PersonalizationCreateEdit({ view, onFinish, editing = fa
     };
     const onSubmit = () => {
         if (error)
-            return;
+            return false;
         const trimmedName = viewName.trim();
         if (!trimmedName) {
             viewNameRef.current.focus();
             setError(viewNameEmptyError);
-            return;
+            return false;
         }
         if (editing) {
             view.type.editPersonalization(personalization.active, trimmedName, 
@@ -73,9 +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 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    if (error) return;\n\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  };\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/RowHeight.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RowHeight.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/RowHeight.jsx"],"names":[],"mappings":"AAOA;;;4CAiBC;;;;;;;;;;sBAxBqB,YAAY"}
+{"version":3,"file":"RowHeight.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/RowHeight.jsx"],"names":[],"mappings":"AAQA;;;4CAoBC;;;;;;;;;;sBA5BqB,YAAY"}

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

@@ -1,10 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import PropTypes from 'prop-types';
-import { Menu } from '@pega/cosmos-react-core';
+import { useRef } from 'react';
+import { isTouchDevice, Menu, useFocusTrap } from '@pega/cosmos-react-core';
 import { ROW_DENSITY } from 'pega-repeating-structures-core/lib/types/Meta.types';
 import useTranslate from '../../Hooks/useTranslate';
 export default function RowHeight({ view, onClose }) {
     const [translate] = useTranslate();
+    const menuRef = useRef(null);
     const actions = [
         view.meta.displayDensity
             .filter(option => option.id !== ROW_DENSITY.WRAP_CONTENT)
@@ -18,7 +20,8 @@ export default function RowHeight({ view, onClose }) {
             }
         }))
     ];
-    return _jsx(Menu, { items: actions.flat(), mode: 'single-select' });
+    useFocusTrap(isTouchDevice ? null : menuRef, false);
+    return _jsx(Menu, { items: actions.flat(), mode: 'single-select', ref: menuRef });
 }
 RowHeight.propTypes = {
     view: PropTypes.objectOf(PropTypes.any).isRequired,

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

@@ -1 +1 @@
-{"version":3,"file":"RowHeight.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/RowHeight.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,qDAAqD,CAAC;AAElF,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE;IACjD,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,OAAO,GAAG;QACd,IAAI,CAAC,IAAI,CAAC,cAAc;aACrB,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,WAAW,CAAC,YAAY,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YACd,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC;YAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,oBAAoB,KAAK,MAAM,CAAC,EAAE;YACvD,EAAE,EAAE,MAAM,CAAC,EAAE;YACb,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gBACpC,OAAO,EAAE,CAAC;YACZ,CAAC;SACF,CAAC,CAAC;KACN,CAAC;IAEF,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,IAAI,EAAC,eAAe,GAAG,CAAC;AAC9D,CAAC;AAED,SAAS,CAAC,SAAS,GAAG;IACpB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,OAAO,EAAE,SAAS,CAAC,IAAI;CACxB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { Menu } from '@pega/cosmos-react-core';\nimport { ROW_DENSITY } from 'pega-repeating-structures-core/lib/types/Meta.types';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function RowHeight({ view, onClose }) {\n  const [translate] = useTranslate();\n  const actions = [\n    view.meta.displayDensity\n      .filter(option => option.id !== ROW_DENSITY.WRAP_CONTENT)\n      .map(option => ({\n        primary: translate(option.name),\n        selected: view.state.selectedHeightOption === option.id,\n        id: option.id,\n        onClick: () => {\n          view.type.applyRowHeight(option.id);\n          onClose();\n        }\n      }))\n  ];\n\n  return <Menu items={actions.flat()} mode='single-select' />;\n}\n\nRowHeight.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  onClose: PropTypes.func\n};\n"]}
+{"version":3,"file":"RowHeight.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/RowHeight.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC5E,OAAO,EAAE,WAAW,EAAE,MAAM,qDAAqD,CAAC;AAElF,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE;IACjD,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC7B,MAAM,OAAO,GAAG;QACd,IAAI,CAAC,IAAI,CAAC,cAAc;aACrB,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,WAAW,CAAC,YAAY,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YACd,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC;YAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,oBAAoB,KAAK,MAAM,CAAC,EAAE;YACvD,EAAE,EAAE,MAAM,CAAC,EAAE;YACb,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gBACpC,OAAO,EAAE,CAAC;YACZ,CAAC;SACF,CAAC,CAAC;KACN,CAAC;IAEF,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAEpD,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,IAAI,EAAC,eAAe,EAAC,GAAG,EAAE,OAAO,GAAI,CAAC;AAC5E,CAAC;AAED,SAAS,CAAC,SAAS,GAAG;IACpB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,OAAO,EAAE,SAAS,CAAC,IAAI;CACxB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\nimport { useRef } from 'react';\n\nimport { isTouchDevice, Menu, useFocusTrap } from '@pega/cosmos-react-core';\nimport { ROW_DENSITY } from 'pega-repeating-structures-core/lib/types/Meta.types';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function RowHeight({ view, onClose }) {\n  const [translate] = useTranslate();\n  const menuRef = useRef(null);\n  const actions = [\n    view.meta.displayDensity\n      .filter(option => option.id !== ROW_DENSITY.WRAP_CONTENT)\n      .map(option => ({\n        primary: translate(option.name),\n        selected: view.state.selectedHeightOption === option.id,\n        id: option.id,\n        onClick: () => {\n          view.type.applyRowHeight(option.id);\n          onClose();\n        }\n      }))\n  ];\n\n  useFocusTrap(isTouchDevice ? null : menuRef, false);\n\n  return <Menu items={actions.flat()} mode='single-select' ref={menuRef} />;\n}\n\nRowHeight.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  onClose: PropTypes.func\n};\n"]}

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.js

@@ -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;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        {\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.js

@@ -87,7 +87,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 */
@@ -111,7 +111,7 @@ export default function SelectFilter({ column, finishPopOver, onFilter, popoverB
     const selectedValueSet = new Set(selectedValuesRef.current);
     if (!popoverButtonRef.current)
         return null;
-    return (_jsxs(StyledSelectFilterDialog, { 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', "data-testid": 'select-filter-values', 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.

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

@@ -1 +1 @@
-{"version":3,"file":"SelectFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/SelectFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  Checkbox,\n  CheckboxGroup,\n  Select,\n  Option,\n  FormDialog,\n  Progress\n} from '@pega/cosmos-react-core';\nimport {\n  addFilter,\n  getFilterInitializers,\n  comparatorMap,\n  FieldType,\n  isEmpty\n} from 'pega-repeating-structures-core';\nimport {\n  StyledChildrenWrap,\n  StyledDialogContent\n} from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst StyledSelectFilterDialog = styled(FormDialog)`\n  ${StyledDialogContent} {\n    /* Flex height chain so the checkbox list scrolls internally instead of the\n       dialog content. */\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    min-height: 0;\n\n    ${StyledChildrenWrap} {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n  }\n`;\n\nconst CheckboxGroupStyle = styled.div`\n  max-height: 11.719rem;\n  overflow: auto;\n  margin-top: 0.5rem;\n`;\n\nexport default function SelectFilter({ column, finishPopOver, onFilter, popoverButtonRef }) {\n  const [fInput, fValue, , filterExpression] = getFilterInitializers(column);\n  const [uniqueValues, setUniqueColumnValues] = useState([]);\n  const [uniqueValuesFetched, setUniqueValuesFetched] = useState(false);\n  // Prepopulate the select filter with values only when global filter condition matches with condition in select filter.\n  const prePopulateSelectFilter = column.field.filterParams.some(\n    filterParam => filterParam.key === fValue\n  );\n  const selectedValuesRef = useRef(prePopulateSelectFilter ? fInput : []);\n  const [comparator, setComparator] = useState(fValue);\n\n  const syncUniqueValues = useCallback(() => {\n    if (!uniqueValuesFetched)\n      column\n        .getUniqueValues()\n        .then(filteredData => {\n          setUniqueColumnValues(filteredData.filter(v => !isEmpty(v)));\n        })\n        .finally(() => {\n          setUniqueValuesFetched(true);\n        });\n  }, [column, uniqueValuesFetched]);\n  const [translate] = useTranslate();\n  useEffect(() => {\n    const resultSet = new Set();\n    column.data.forEach(d => {\n      if (d) resultSet.add(d);\n    });\n    setUniqueColumnValues([...resultSet]);\n  }, [column]);\n\n  // set the comparator as 1st option by default only if global filter criteria does not match with select filter (prepopulateSelectFilter)\n  useEffect(() => {\n    if (!prePopulateSelectFilter && column.field.filterParams?.[0]?.key)\n      setComparator(column.field.filterParams[0].key);\n    // Should be call only on initial load thats why empty dependencies\n  }, []);\n\n  useEffect(() => {\n    if (!column.field?.filterParams?.find(item => item.key !== 'select')) return;\n    syncUniqueValues();\n  }, [column, syncUniqueValues]);\n\n  const onFilterChange = useCallback(({ value: comparatorType }) => {\n    setComparator(comparatorType);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    const formattedComp = comparatorMap[comparator];\n    let localFilterExpression = null;\n    const input =\n      formattedComp === comparatorMap.isNull || formattedComp === comparatorMap.isNotNull\n        ? null\n        : selectedValuesRef.current;\n    localFilterExpression = addFilter({\n      // Ignore the initial filter expression if prePopulateSelectFilter is true as user has chosen to override it.\n      filterExpression: prePopulateSelectFilter ? null : filterExpression,\n      comparator: formattedComp,\n      column,\n      input\n    });\n    onFilter({\n      filterExp: localFilterExpression\n    });\n    finishPopOver();\n  }, [comparator, filterExpression, column, onFilter, prePopulateSelectFilter]);\n\n  const onSelectOrDeselect = useCallback(\n    event => {\n      /* Disabling operators like isAnyOf isNoneOf */\n      const { value, checked } = event.target;\n      const inputValue = column.field.type === FieldType.NUMBER ? parseFloat(value) : value;\n      const currentSelectedValues = selectedValuesRef.current;\n      /* collecting set of unique values to sent with different operators */\n      if (checked) {\n        selectedValuesRef.current = currentSelectedValues\n          ? [...new Set([inputValue, ...currentSelectedValues])]\n          : [...new Set([inputValue])];\n        return;\n      }\n\n      const index = currentSelectedValues.findIndex(val => val === inputValue);\n      selectedValuesRef.current = currentSelectedValues\n        .slice(0, index)\n        .concat(currentSelectedValues.slice(index + 1));\n    },\n    [column]\n  );\n\n  // show unique values checkboxes for selection only if comparator is other than 'IS_NULL' and 'IS_NOT_NULL'\n  const showUniqueValues = ![comparatorMap.isNull, comparatorMap.isNotNull].includes(\n    comparatorMap[comparator]\n  );\n  const selectedValueSet = new Set(selectedValuesRef.current);\n\n  if (!popoverButtonRef.current) return null;\n\n  return (\n    <StyledSelectFilterDialog\n      heading={translate('Filter column')}\n      onSubmit={submitFilter}\n      onCancel={finishPopOver}\n      target={popoverButtonRef.current}\n    >\n      <Select defaultValue={comparator} onChange={e => onFilterChange({ value: e.target.value })}>\n        {(column.field.filterParams || []).map(opt => (\n          <Option key={opt.key} value={opt.key}>\n            {translate(opt.value)}\n          </Option>\n        ))}\n      </Select>\n      {showUniqueValues && (\n        <CheckboxGroupStyle className='popup-menu' data-testid='select-filter-values'>\n          <CheckboxGroup>\n            {uniqueValues.map(item => {\n              const isItemSelected = selectedValueSet.has(item);\n              // Custom context prepared for Rendering engine should contain getExecutionContext\n              // otherwise the execution context will be populated wrongly from the previous table rendering cycle.\n              // For Select filter execution context should be derived from unique values that are displayed in the modal.\n              const context = {\n                getExecutionContext: () => {\n                  return {\n                    getValue: () => ({ [column.field.name]: item }),\n                    name: 'selectFilter'\n                  };\n                },\n                getValue: () => item\n              };\n              return (\n                <Checkbox\n                  key={item}\n                  id={item}\n                  defaultChecked={isItemSelected}\n                  name={item}\n                  onClick={onSelectOrDeselect}\n                  value={item}\n                  label={\n                    <RenderingEngine {...column.getRenderingEngineProps()} context={context} />\n                  }\n                />\n              );\n            })}\n          </CheckboxGroup>\n          {!uniqueValuesFetched && <Progress placement='block' />}\n        </CheckboxGroupStyle>\n      )}\n    </StyledSelectFilterDialog>\n  );\n}\n\nSelectFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}
+{"version":3,"file":"SelectFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/SelectFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  Checkbox,\n  CheckboxGroup,\n  Select,\n  Option,\n  FormDialog,\n  Progress\n} from '@pega/cosmos-react-core';\nimport {\n  addFilter,\n  getFilterInitializers,\n  comparatorMap,\n  FieldType,\n  isEmpty\n} from 'pega-repeating-structures-core';\nimport {\n  StyledChildrenWrap,\n  StyledDialogContent\n} from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst StyledSelectFilterDialog = styled(FormDialog)`\n  ${StyledDialogContent} {\n    /* Flex height chain so the checkbox list scrolls internally instead of the\n       dialog content. */\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    min-height: 0;\n\n    ${StyledChildrenWrap} {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n  }\n`;\n\nconst CheckboxGroupStyle = styled.div`\n  max-height: 11.719rem;\n  overflow: auto;\n  margin-top: 0.5rem;\n`;\n\nexport default function SelectFilter({ column, finishPopOver, onFilter, popoverButtonRef }) {\n  const [fInput, fValue, , filterExpression] = getFilterInitializers(column);\n  const [uniqueValues, setUniqueColumnValues] = useState([]);\n  const [uniqueValuesFetched, setUniqueValuesFetched] = useState(false);\n  // Prepopulate the select filter with values only when global filter condition matches with condition in select filter.\n  const prePopulateSelectFilter = column.field.filterParams.some(\n    filterParam => filterParam.key === fValue\n  );\n  const selectedValuesRef = useRef(prePopulateSelectFilter ? fInput : []);\n  const [comparator, setComparator] = useState(fValue);\n\n  const syncUniqueValues = useCallback(() => {\n    if (!uniqueValuesFetched)\n      column\n        .getUniqueValues()\n        .then(filteredData => {\n          setUniqueColumnValues(filteredData.filter(v => !isEmpty(v)));\n        })\n        .finally(() => {\n          setUniqueValuesFetched(true);\n        });\n  }, [column, uniqueValuesFetched]);\n  const [translate] = useTranslate();\n  useEffect(() => {\n    const resultSet = new Set();\n    column.data.forEach(d => {\n      if (d) resultSet.add(d);\n    });\n    setUniqueColumnValues([...resultSet]);\n  }, [column]);\n\n  // set the comparator as 1st option by default only if global filter criteria does not match with select filter (prepopulateSelectFilter)\n  useEffect(() => {\n    if (!prePopulateSelectFilter && column.field.filterParams?.[0]?.key)\n      setComparator(column.field.filterParams[0].key);\n    // Should be call only on initial load thats why empty dependencies\n  }, []);\n\n  useEffect(() => {\n    if (!column.field?.filterParams?.find(item => item.key !== 'select')) return;\n    syncUniqueValues();\n  }, [column, syncUniqueValues]);\n\n  const onFilterChange = useCallback(({ value: comparatorType }) => {\n    setComparator(comparatorType);\n  }, []);\n\n  const submitFilter = useCallback(() => {\n    const formattedComp = comparatorMap[comparator];\n    let localFilterExpression = null;\n    const input =\n      formattedComp === comparatorMap.isNull || formattedComp === comparatorMap.isNotNull\n        ? null\n        : selectedValuesRef.current;\n    localFilterExpression = addFilter({\n      // Ignore the initial filter expression if prePopulateSelectFilter is true as user has chosen to override it.\n      filterExpression: prePopulateSelectFilter ? null : filterExpression,\n      comparator: formattedComp,\n      column,\n      input\n    });\n    onFilter({\n      filterExp: localFilterExpression\n    });\n    return true;\n  }, [comparator, filterExpression, column, onFilter, prePopulateSelectFilter]);\n\n  const onSelectOrDeselect = useCallback(\n    event => {\n      /* Disabling operators like isAnyOf isNoneOf */\n      const { value, checked } = event.target;\n      const inputValue = column.field.type === FieldType.NUMBER ? parseFloat(value) : value;\n      const currentSelectedValues = selectedValuesRef.current;\n      /* collecting set of unique values to sent with different operators */\n      if (checked) {\n        selectedValuesRef.current = currentSelectedValues\n          ? [...new Set([inputValue, ...currentSelectedValues])]\n          : [...new Set([inputValue])];\n        return;\n      }\n\n      const index = currentSelectedValues.findIndex(val => val === inputValue);\n      selectedValuesRef.current = currentSelectedValues\n        .slice(0, index)\n        .concat(currentSelectedValues.slice(index + 1));\n    },\n    [column]\n  );\n\n  // show unique values checkboxes for selection only if comparator is other than 'IS_NULL' and 'IS_NOT_NULL'\n  const showUniqueValues = ![comparatorMap.isNull, comparatorMap.isNotNull].includes(\n    comparatorMap[comparator]\n  );\n  const selectedValueSet = new Set(selectedValuesRef.current);\n\n  if (!popoverButtonRef.current) return null;\n\n  return (\n    <StyledSelectFilterDialog\n      heading={translate('Filter column')}\n      onSubmit={submitFilter}\n      onAfterClose={finishPopOver}\n      target={popoverButtonRef.current}\n    >\n      <Select defaultValue={comparator} onChange={e => onFilterChange({ value: e.target.value })}>\n        {(column.field.filterParams || []).map(opt => (\n          <Option key={opt.key} value={opt.key}>\n            {translate(opt.value)}\n          </Option>\n        ))}\n      </Select>\n      {showUniqueValues && (\n        <CheckboxGroupStyle className='popup-menu' data-testid='select-filter-values'>\n          <CheckboxGroup>\n            {uniqueValues.map(item => {\n              const isItemSelected = selectedValueSet.has(item);\n              // Custom context prepared for Rendering engine should contain getExecutionContext\n              // otherwise the execution context will be populated wrongly from the previous table rendering cycle.\n              // For Select filter execution context should be derived from unique values that are displayed in the modal.\n              const context = {\n                getExecutionContext: () => {\n                  return {\n                    getValue: () => ({ [column.field.name]: item }),\n                    name: 'selectFilter'\n                  };\n                },\n                getValue: () => item\n              };\n              return (\n                <Checkbox\n                  key={item}\n                  id={item}\n                  defaultChecked={isItemSelected}\n                  name={item}\n                  onClick={onSelectOrDeselect}\n                  value={item}\n                  label={\n                    <RenderingEngine {...column.getRenderingEngineProps()} context={context} />\n                  }\n                />\n              );\n            })}\n          </CheckboxGroup>\n          {!uniqueValuesFetched && <Progress placement='block' />}\n        </CheckboxGroupStyle>\n      )}\n    </StyledSelectFilterDialog>\n  );\n}\n\nSelectFilter.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/SimpleFilter.d.ts.map

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

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

@@ -28,10 +28,9 @@ export default function SimpleFilter({ column, onFilter, finishPopOver, popoverB
             filterExp = { AND: [prevFilter, filterExp] };
         }
         onFilter({ filterExp });
-        finishPopOver();
         return true;
     }, [column, onFilter, prevConditionOnColumn]);
-    return popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: onSubmit, onCancel: finishPopOver, target: popoverButtonRef.current, children: _jsx(FieldCondition, { targetField: column.field.name, fields: formattedColumns, condition: prevConditionOnColumn, validRhsTypes: validRhsTypes, dateFunctions: view.meta.dateFunctions, handle: handle }) })) : null;
+    return popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Filter column'), onSubmit: onSubmit, onAfterClose: finishPopOver, target: popoverButtonRef.current, children: _jsx(FieldCondition, { targetField: column.field.name, fields: formattedColumns, condition: prevConditionOnColumn, validRhsTypes: validRhsTypes, dateFunctions: view.meta.dateFunctions, handle: handle }) })) : null;
 }
 SimpleFilter.propTypes = {
     column: PropTypes.objectOf(PropTypes.any).isRequired,

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

@@ -1 +1 @@
-{"version":3,"file":"SimpleFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/SimpleFilter.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useCallback, useRef } from 'react';\n\nimport { FormDialog } from '@pega/cosmos-react-core';\nimport { FieldCondition } from '@pega/cosmos-react-condition-builder';\nimport { getFilterInitializers } from 'pega-repeating-structures-core';\n\nimport getMenuItemsFromColumns from '../Toolbar/utils/utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport useValidRhsTypes from './Hooks/useValidRhsTypes';\n\nexport default function SimpleFilter({ column, onFilter, finishPopOver, popoverButtonRef }) {\n  const view = column.parent;\n  const formattedColumns = getMenuItemsFromColumns(\n    view.getFieldDefs()?.filter(f => f.filter),\n    'name'\n  );\n  const validRhsTypes = useValidRhsTypes(view);\n  const [translate] = useTranslate();\n  const [, , prevConditionOnColumn] = getFilterInitializers(column); // Any previous condition on this column\n  const handle = useRef(null);\n\n  const onSubmit = useCallback(() => {\n    if (!handle.current) return true;\n\n    const [isValid, condition] = handle.current.getCondition();\n    if (!isValid) return false;\n\n    // Apply the new condition on the view\n    let filterExp = { condition };\n\n    // If there was a previous filter but not on this column, combine the two filters\n    const prevFilter = column?.getFilterProperties()?.filterExpression;\n    if (prevFilter && Object.keys(prevFilter).length > 0 && !prevConditionOnColumn) {\n      filterExp = { AND: [prevFilter, filterExp] };\n    }\n\n    onFilter({ filterExp });\n    finishPopOver();\n    return true;\n  }, [column, onFilter, prevConditionOnColumn]);\n\n  return popoverButtonRef.current ? (\n    <FormDialog\n      heading={translate('Filter column')}\n      onSubmit={onSubmit}\n      onCancel={finishPopOver}\n      target={popoverButtonRef.current}\n    >\n      <FieldCondition\n        targetField={column.field.name}\n        fields={formattedColumns}\n        condition={prevConditionOnColumn}\n        validRhsTypes={validRhsTypes}\n        dateFunctions={view.meta.dateFunctions} // Could be undefined\n        handle={handle}\n      />\n    </FormDialog>\n  ) : null;\n}\n\nSimpleFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}
+{"version":3,"file":"SimpleFilter.js","sourceRoot":"","sources":["../../../../Core/Components/Filters/SimpleFilter.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,uBAAuB,MAAM,wBAAwB,CAAC;AAC7D,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,gBAAgB,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,gBAAgB,EAAE;IACxF,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC;IAC3B,MAAM,gBAAgB,GAAG,uBAAuB,CAC9C,IAAI,CAAC,YAAY,EAAE,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,EAC1C,MAAM,CACP,CAAC;IACF,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,CAAC,EAAE,AAAD,EAAG,qBAAqB,CAAC,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC,CAAC,wCAAwC;IAC3G,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAE5B,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,MAAM,CAAC,OAAO;YAAE,OAAO,IAAI,CAAC;QAEjC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;QAC3D,IAAI,CAAC,OAAO;YAAE,OAAO,KAAK,CAAC;QAE3B,sCAAsC;QACtC,IAAI,SAAS,GAAG,EAAE,SAAS,EAAE,CAAC;QAE9B,iFAAiF;QACjF,MAAM,UAAU,GAAG,MAAM,EAAE,mBAAmB,EAAE,EAAE,gBAAgB,CAAC;QACnE,IAAI,UAAU,IAAI,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC/E,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,EAAE,CAAC;QAC/C,CAAC;QAED,QAAQ,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;QACxB,OAAO,IAAI,CAAC;IACd,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAE9C,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChC,KAAC,UAAU,IACT,OAAO,EAAE,SAAS,CAAC,eAAe,CAAC,EACnC,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,aAAa,EAC3B,MAAM,EAAE,gBAAgB,CAAC,OAAO,YAEhC,KAAC,cAAc,IACb,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,EAC9B,MAAM,EAAE,gBAAgB,EACxB,SAAS,EAAE,qBAAqB,EAChC,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,EACtC,MAAM,EAAE,MAAM,GACd,GACS,CACd,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC;AAED,YAAY,CAAC,SAAS,GAAG;IACvB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACpD,aAAa,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IACxC,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CACpC,CAAC","sourcesContent":["import PropTypes from 'prop-types';\nimport { useCallback, useRef } from 'react';\n\nimport { FormDialog } from '@pega/cosmos-react-core';\nimport { FieldCondition } from '@pega/cosmos-react-condition-builder';\nimport { getFilterInitializers } from 'pega-repeating-structures-core';\n\nimport getMenuItemsFromColumns from '../Toolbar/utils/utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport useValidRhsTypes from './Hooks/useValidRhsTypes';\n\nexport default function SimpleFilter({ column, onFilter, finishPopOver, popoverButtonRef }) {\n  const view = column.parent;\n  const formattedColumns = getMenuItemsFromColumns(\n    view.getFieldDefs()?.filter(f => f.filter),\n    'name'\n  );\n  const validRhsTypes = useValidRhsTypes(view);\n  const [translate] = useTranslate();\n  const [, , prevConditionOnColumn] = getFilterInitializers(column); // Any previous condition on this column\n  const handle = useRef(null);\n\n  const onSubmit = useCallback(() => {\n    if (!handle.current) return true;\n\n    const [isValid, condition] = handle.current.getCondition();\n    if (!isValid) return false;\n\n    // Apply the new condition on the view\n    let filterExp = { condition };\n\n    // If there was a previous filter but not on this column, combine the two filters\n    const prevFilter = column?.getFilterProperties()?.filterExpression;\n    if (prevFilter && Object.keys(prevFilter).length > 0 && !prevConditionOnColumn) {\n      filterExp = { AND: [prevFilter, filterExp] };\n    }\n\n    onFilter({ filterExp });\n    return true;\n  }, [column, onFilter, prevConditionOnColumn]);\n\n  return popoverButtonRef.current ? (\n    <FormDialog\n      heading={translate('Filter column')}\n      onSubmit={onSubmit}\n      onAfterClose={finishPopOver}\n      target={popoverButtonRef.current}\n    >\n      <FieldCondition\n        targetField={column.field.name}\n        fields={formattedColumns}\n        condition={prevConditionOnColumn}\n        validRhsTypes={validRhsTypes}\n        dateFunctions={view.meta.dateFunctions} // Could be undefined\n        handle={handle}\n      />\n    </FormDialog>\n  ) : null;\n}\n\nSimpleFilter.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired,\n  finishPopOver: PropTypes.func.isRequired,\n  onFilter: PropTypes.func.isRequired\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/HeaderMenu/index.jsx"],"names":[],"mappings":"AAgFA;;;mDAmNC;;;;;;;;;;;;;;;;;;sBAnSqB,YAAY"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/HeaderMenu/index.jsx"],"names":[],"mappings":"AAgFA;;;mDAiNC;;;;;;;;;;;;;;;;;;sBAjSqB,YAAY"}

package/lib/Core/Components/HeaderMenu/index.js

@@ -112,14 +112,13 @@ export default function HeaderMenu({ column, popoverButtonRef }) {
             case DynamicColumnRight:
                 return (_jsx(DynamicFieldConfiguration, { column: column, onSubmit: (title, templateName, bHideColumns) => {
                         column.applyMerge(moreContent === DynamicColumnLeft ? 'left' : 'right', title, templateName, bHideColumns);
-                        finishPopOver();
                         if (templateName === 'multiline')
                             view.type.applyRowHeight('4');
-                    }, onCancel: finishPopOver, popoverButtonRef: popoverButtonRef, heading: `Combine with ${moreContent === DynamicColumnLeft ? 'left' : 'right'}` }));
+                    }, onAfterClose: finishPopOver, popoverButtonRef: popoverButtonRef, heading: `Combine with ${moreContent === DynamicColumnLeft ? 'left' : 'right'}` }));
             case CustomizeColumn:
                 return (_jsx(RFColumnConfigurator, { column: column, finishPopOver: finishPopOver, onSubmit: (rfConfig, columnAlias, displayMode) => {
                         customizeColumn(column, rfConfig, displayMode, columnAlias, column.alias);
-                    }, onCancel: finishPopOver, popoverButtonRef: popoverButtonRef }));
+                    }, popoverButtonRef: popoverButtonRef }));
             default:
                 return (_jsx(Menu, { scrollAt: '400', "data-test-id": 'action-menu', items: firstLevelActions.flat(), className: 'action-menu', focusControlEl: popoverButtonRef.current, onItemClick: id => {
                         // NVDA/JAWS reading out the stale sort order on sort action