npm - @pega/lists-react - Versions diffs - 9.0.0-build.2.8 → 9.0.0-build.20.0 - Mend

@pega/lists-react 9.0.0-build.2.8 → 9.0.0-build.20.0

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

Files changed (404) hide show

package/lib/Core/Components/TestIdConstants.d.ts CHANGED Viewed

@@ -10,6 +10,7 @@ declare namespace _default {
     let groupHeaderCount: string;
     let groupHeaderGroupBy: string;
     let hierarchicalCell: string;
+    let contextMenu: string;
 }
 export default _default;
 //# sourceMappingURL=TestIdConstants.d.ts.map

package/lib/Core/Components/TestIdConstants.js CHANGED Viewed

@@ -9,6 +9,7 @@ export default {
     groupHeader: 'group-header',
     groupHeaderCount: 'group-header-count',
     groupHeaderGroupBy: 'group-header-group-by',
-    hierarchicalCell: 'hierarchical-cell'
+    hierarchicalCell: 'hierarchical-cell',
+    contextMenu: 'repeat-context-menu'
 };
 //# sourceMappingURL=TestIdConstants.js.map

package/lib/Core/Components/TestIdConstants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TestIdConstants.js","sourceRoot":"","sources":["../../../Core/Components/TestIdConstants.js"],"names":[],"mappings":"AAAA,eAAe;IACb,YAAY,EAAE,sBAAsB;IACpC,WAAW,EAAE,qBAAqB;IAClC,UAAU,EAAE,oBAAoB;IAChC,iBAAiB,EAAE,4BAA4B;IAC/C,SAAS,EAAE,mBAAmB;IAC9B,qBAAqB,EAAE,yBAAyB;IAChD,gBAAgB,EAAE,oBAAoB;IACtC,WAAW,EAAE,cAAc;IAC3B,gBAAgB,EAAE,oBAAoB;IACtC,kBAAkB,EAAE,uBAAuB;IAC3C,gBAAgB,EAAE,mBAAmB;~~CACtC~~,CAAC","sourcesContent":["export default {\n filterButton: 'repeat-filter-button',\n groupButton: 'repeat-group-button',\n sortButton: 'repeat-sort-button',\n moreOptionsButton: 'repeat-more-options-button',\n noRecords: 'repeat-no-records',\n aggregateDisplayValue: 'aggregate-display-value',\n columnFilterIcon: 'column-filter-icon',\n groupHeader: 'group-header',\n groupHeaderCount: 'group-header-count',\n groupHeaderGroupBy: 'group-header-group-by',\n hierarchicalCell: 'hierarchical-cell'\n};\n"]}
1	+ {"version":3,"file":"TestIdConstants.js","sourceRoot":"","sources":["../../../Core/Components/TestIdConstants.js"],"names":[],"mappings":"AAAA,eAAe;IACb,YAAY,EAAE,sBAAsB;IACpC,WAAW,EAAE,qBAAqB;IAClC,UAAU,EAAE,oBAAoB;IAChC,iBAAiB,EAAE,4BAA4B;IAC/C,SAAS,EAAE,mBAAmB;IAC9B,qBAAqB,EAAE,yBAAyB;IAChD,gBAAgB,EAAE,oBAAoB;IACtC,WAAW,EAAE,cAAc;IAC3B,gBAAgB,EAAE,oBAAoB;IACtC,kBAAkB,EAAE,uBAAuB;IAC3C,gBAAgB,EAAE,mBAAmB;IACrC,WAAW,EAAE,qBAAqB;CACnC,CAAC","sourcesContent":["export default {\n filterButton: 'repeat-filter-button',\n groupButton: 'repeat-group-button',\n sortButton: 'repeat-sort-button',\n moreOptionsButton: 'repeat-more-options-button',\n noRecords: 'repeat-no-records',\n aggregateDisplayValue: 'aggregate-display-value',\n columnFilterIcon: 'column-filter-icon',\n groupHeader: 'group-header',\n groupHeaderCount: 'group-header-count',\n groupHeaderGroupBy: 'group-header-group-by',\n hierarchicalCell: 'hierarchical-cell',\n contextMenu: 'repeat-context-menu'\n};\n"]}

package/lib/Core/Components/Toolbar/AdvanceToolbar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AdvanceToolbar.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"~~AA4BA~~;;~~4CAkJC~~;;;;;;;;;~~sBA7KqB~~,YAAY"}
1	+ {"version":3,"file":"AdvanceToolbar.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"AAwBA;;4CAyGC;;;;;;;;;sBAjIqB,YAAY"}

package/lib/Core/Components/Toolbar/AdvanceToolbar.js CHANGED Viewed

@@ -1,13 +1,12 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { ListToolbar } from '@pega/cosmos-react-core';
-import { REPEATING_STRUCTURE_TEMPLATES, ROW_DENSITY } from 'pega-repeating-structures-core/lib/types/Meta.types';
+import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
 import { SELECTION_MODES } from '../../constants';
+import showFeatureForTemplate from '../../templateFeatureSupport';
 import ActionsMenu from './ActionsMenu';
 import MapToolbar from './Map/MapToolbar';
 import ToolbarActions from './ToolbarActions';
-import TimelineToolbar from './Timeline/TimelineToolbar';
 import useSearch from './hooks/useSearch';
 import useFilter from './hooks/useFilter';
 import usePersonalization from './hooks/usePersonalization';
@@ -19,22 +18,22 @@ import RefreshBanner from './RefreshBanner';
 import AnnounceRowsCount from './AnnounceRowsCount';
 import ValidateMessage from './ValidateMessage';
 import useFormControlProps from './hooks/useFormControlProps';
-import KeyboardInstructions from './KeyboardInstructions';
+import useWrapAction from './hooks/useWrapAction';
 export default function AdvanceToolbar({ view }) {
     const { selectedRecordsCount, meta: { basicMode, selectionMode, title, toolbarActions, template, allowBulkActions, mapFieldIds } = {}, rows, state, getContext, isLoading, showCount, refreshNotification, type: { forceRefresh }, announceCount } = view;
-    const { selectedHeightOption } = state;
     const { getRequiredDef } = getContext();
     const { validatemessage } = getRequiredDef() || {};
-    const { viewSelector } = usePersonalization({ view });
+    const { viewSelector, createEditViewContent } = usePersonalization({ view });
     const search = useSearch({ view });
-    const count = showCount ? getCount({ view }) : {};
+    const count = showCount ? getCount({ view }) : undefined;
     const filter = useFilter({ view });
     const group = useGroup({ view });
     const sort = useSort({ view });
-    const { actions, actionsButtonRef, popover } = useMore({ view });
+    const { actions, actionsButtonRef, selectedActionContent } = useMore({ view });
     const enableActionsMenu = selectionMode === SELECTION_MODES.multi && selectedRecordsCount !== 0;
     const formControlProps = useFormControlProps(view);
-    const additionalActions = (_jsxs(_Fragment, { children: [basicMode && (_jsx(ToolbarActions, { toolbarActions: toolbarActions?.filter(action => !action.id.startsWith('Add')) })), allowBulkActions && _jsx(ActionsMenu, { enableActionsMenu: enableActionsMenu, view: view })] }));
+    const wrapAction = useWrapAction(view);
+    const additionalActions = (_jsxs(_Fragment, { children: [basicMode && (_jsx(ToolbarActions, { toolbarActions: toolbarActions?.filter(action => !action.id.startsWith('Add')) })), allowBulkActions && template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (_jsx(ActionsMenu, { enableActionsMenu: enableActionsMenu, view: view }))] }));
     const createNewAction = toolbarActions?.find(action => action.id.startsWith('Add'));
     const createNew = createNewAction && basicMode
         ? {
@@ -42,30 +41,7 @@ export default function AdvanceToolbar({ view }) {
             onClick: createNewAction.onClick
         }
         : undefined;
-    const wrapAction = useMemo(() => {
-        return {
-            enabled: selectedHeightOption === ROW_DENSITY.WRAP_CONTENT,
-            onClick: () => {
-                if (selectedHeightOption !== ROW_DENSITY.WRAP_CONTENT) {
-                    view.type.applyRowHeight(ROW_DENSITY.WRAP_CONTENT);
-                }
-                else {
-                    view.type.applyRowHeight(ROW_DENSITY.SHORT);
-                }
-            }
-        };
-    }, [selectedHeightOption]);
-    let Toolbar;
-    switch (template) {
-        case REPEATING_STRUCTURE_TEMPLATES.TIMELINE:
-            Toolbar = (_jsxs(_Fragment, { children: [_jsx(TimelineToolbar, { name: title, formControlProps: formControlProps, viewSelector: viewSelector, search: search, count: count, additionalActions: additionalActions, filter: filter, createNew: createNew, view: view, actions: actions, actionsButtonRef: actionsButtonRef }), popover] }));
-            break;
-        case REPEATING_STRUCTURE_TEMPLATES.MAP:
-            Toolbar = (_jsx(MapToolbar, { locationFieldId: mapFieldIds?.location, name: title, formControlProps: formControlProps, rows: rows, count: count, createNew: createNew, additionalActions: additionalActions }));
-            break;
-        default:
-            Toolbar = (_jsxs(_Fragment, { children: [_jsx(ListToolbar, { name: title, formControlProps: formControlProps, viewSelector: viewSelector, search: search, count: count, additionalActions: additionalActions, filter: filter, group: group, sort: sort, actions: actions, actionsButtonRef: actionsButtonRef, createNew: createNew, wrap: template === REPEATING_STRUCTURE_TEMPLATES.TABLE && wrapAction, keyboardInstructions: template === REPEATING_STRUCTURE_TEMPLATES.TABLE ? (_jsx(KeyboardInstructions, { template: template })) : undefined }), popover] }));
-    }
+    const Toolbar = template === REPEATING_STRUCTURE_TEMPLATES.MAP ? (_jsx(MapToolbar, { locationFieldId: mapFieldIds?.location, name: title, formControlProps: formControlProps, rows: rows, count: count, createNew: createNew, additionalActions: additionalActions })) : (_jsxs(_Fragment, { children: [_jsx(ListToolbar, { name: title, formControlProps: formControlProps, viewSelector: viewSelector, search: search, count: count, additionalActions: additionalActions, filter: filter, group: showFeatureForTemplate(template, 'group') && group, sort: sort, actions: actions, actionsButtonRef: actionsButtonRef, createNew: createNew, wrap: showFeatureForTemplate(template, 'wrap') && wrapAction }), selectedActionContent, createEditViewContent] }));
     return (_jsxs(AnnounceRowsCount, { state: state, count: count, isLoading: isLoading, announceCount: announceCount, children: [_jsx(ValidateMessage, { message: validatemessage, children: Toolbar }), refreshNotification && (_jsx(RefreshBanner, { refreshNotification: refreshNotification, forceRefresh: forceRefresh }))] }));
 }
 AdvanceToolbar.propTypes = {

package/lib/Core/Components/Toolbar/AdvanceToolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AdvanceToolbar.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { ListToolbar } from '@pega/cosmos-react-core';\nimport {\n REPEATING_STRUCTURE_TEMPLATES,\n ROW_DENSITY\n} from 'pega-repeating-structures-core/lib/types/Meta.types';\n\nimport { SELECTION_MODES } from '../../constants';\n\nimport ActionsMenu from './ActionsMenu';\nimport MapToolbar from './Map/MapToolbar';\nimport ToolbarActions from './ToolbarActions';\nimport TimelineToolbar from './Timeline/TimelineToolbar';\nimport useSearch from './hooks/useSearch';\nimport useFilter from './hooks/useFilter';\nimport usePersonalization from './hooks/usePersonalization';\nimport useMore from './hooks/useMore';\nimport useGroup from './hooks/useGroup/useGroup';\nimport useSort from './hooks/useSort/useSort';\nimport getCount from './utils/getCount';\nimport RefreshBanner from './RefreshBanner';\nimport AnnounceRowsCount from './AnnounceRowsCount';\nimport ValidateMessage from './ValidateMessage';\nimport useFormControlProps from './hooks/useFormControlProps';\nimport KeyboardInstructions from './KeyboardInstructions';\n\nexport default function AdvanceToolbar({ view }) {\n const {\n selectedRecordsCount,\n meta: {\n basicMode,\n selectionMode,\n title,\n toolbarActions,\n template,\n allowBulkActions,\n mapFieldIds\n } = {},\n rows,\n state,\n getContext,\n isLoading,\n showCount,\n refreshNotification,\n type: { forceRefresh },\n announceCount\n } = view;\n const { selectedHeightOption } = state;\n const { getRequiredDef } = getContext();\n const { validatemessage } = getRequiredDef() \|\| {};\n const { viewSelector } = usePersonalization({ view });\n const search = useSearch({ view });\n const count = showCount ? getCount({ view }) : {};\n const filter = useFilter({ view });\n const group = useGroup({ view });\n const sort = useSort({ view });\n const { actions, actionsButtonRef, popover } = useMore({ view });\n const enableActionsMenu = selectionMode === SELECTION_MODES.multi && selectedRecordsCount !== 0;\n const formControlProps = useFormControlProps(view);\n\n const additionalActions = (\n <>\n {basicMode && (\n <ToolbarActions\n toolbarActions={toolbarActions?.filter(action => !action.id.startsWith('Add'))}\n />\n )}\n {allowBulkActions && <ActionsMenu enableActionsMenu={enableActionsMenu} view={view} />}\n </>\n );\n\n const createNewAction = toolbarActions?.find(action => action.id.startsWith('Add'));\n const createNew =\n createNewAction && basicMode\n ? {\n label: createNewAction?.text,\n onClick: createNewAction.onClick\n }\n : undefined;\n\n const wrapAction = useMemo(() => {\n return {\n enabled: selectedHeightOption === ROW_DENSITY.WRAP_CONTENT,\n onClick: () => {\n if (selectedHeightOption !== ROW_DENSITY.WRAP_CONTENT) {\n view.type.applyRowHeight(ROW_DENSITY.WRAP_CONTENT);\n } else {\n view.type.applyRowHeight(ROW_DENSITY.SHORT);\n }\n }\n };\n }, [selectedHeightOption]);\n\n let Toolbar;\n switch (template) {\n case REPEATING_STRUCTURE_TEMPLATES.TIMELINE:\n Toolbar = (\n <>\n <TimelineToolbar\n name={title}\n formControlProps={formControlProps}\n viewSelector={viewSelector}\n search={search}\n count={count}\n additionalActions={additionalActions}\n filter={filter}\n createNew={createNew}\n view={view}\n actions={actions}\n actionsButtonRef={actionsButtonRef}\n />\n {popover}\n </>\n );\n break;\n case REPEATING_STRUCTURE_TEMPLATES.MAP:\n Toolbar = (\n <MapToolbar\n locationFieldId={mapFieldIds?.location}\n name={title}\n formControlProps={formControlProps}\n rows={rows}\n count={count}\n createNew={createNew}\n additionalActions={additionalActions}\n />\n );\n break;\n default:\n Toolbar = (\n <>\n <ListToolbar\n name={title}\n formControlProps={formControlProps}\n viewSelector={viewSelector}\n search={search}\n count={count}\n additionalActions={additionalActions}\n filter={filter}\n group={group}\n sort={sort}\n actions={actions}\n actionsButtonRef={actionsButtonRef}\n createNew={createNew}\n wrap={template === REPEATING_STRUCTURE_TEMPLATES.TABLE && wrapAction}\n keyboardInstructions={\n template === REPEATING_STRUCTURE_TEMPLATES.TABLE ? (\n <KeyboardInstructions template={template} />\n ) : undefined\n }\n />\n {popover}\n </>\n );\n }\n\n return (\n <AnnounceRowsCount\n state={state}\n count={count}\n isLoading={isLoading}\n announceCount={announceCount}\n >\n <ValidateMessage message={validatemessage}>\n {Toolbar}\n {/* FIXME: This implementation of error status should be considered temporary until an official, and properly accessible, spec is determined. */}\n </ValidateMessage>\n {refreshNotification && (\n <RefreshBanner refreshNotification={refreshNotification} forceRefresh={forceRefresh} />\n )}\n </AnnounceRowsCount>\n );\n}\n\nAdvanceToolbar.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
1	+ {"version":3,"file":"AdvanceToolbar.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { ListToolbar } from '@pega/cosmos-react-core';\nimport { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\n\nimport { SELECTION_MODES } from '../../constants';\nimport showFeatureForTemplate from '../../templateFeatureSupport';\n\nimport ActionsMenu from './ActionsMenu';\nimport MapToolbar from './Map/MapToolbar';\nimport ToolbarActions from './ToolbarActions';\nimport useSearch from './hooks/useSearch';\nimport useFilter from './hooks/useFilter';\nimport usePersonalization from './hooks/usePersonalization';\nimport useMore from './hooks/useMore';\nimport useGroup from './hooks/useGroup/useGroup';\nimport useSort from './hooks/useSort/useSort';\nimport getCount from './utils/getCount';\nimport RefreshBanner from './RefreshBanner';\nimport AnnounceRowsCount from './AnnounceRowsCount';\nimport ValidateMessage from './ValidateMessage';\nimport useFormControlProps from './hooks/useFormControlProps';\nimport useWrapAction from './hooks/useWrapAction';\n\nexport default function AdvanceToolbar({ view }) {\n const {\n selectedRecordsCount,\n meta: {\n basicMode,\n selectionMode,\n title,\n toolbarActions,\n template,\n allowBulkActions,\n mapFieldIds\n } = {},\n rows,\n state,\n getContext,\n isLoading,\n showCount,\n refreshNotification,\n type: { forceRefresh },\n announceCount\n } = view;\n const { getRequiredDef } = getContext();\n const { validatemessage } = getRequiredDef() \|\| {};\n const { viewSelector, createEditViewContent } = usePersonalization({ view });\n const search = useSearch({ view });\n const count = showCount ? getCount({ view }) : undefined;\n const filter = useFilter({ view });\n const group = useGroup({ view });\n const sort = useSort({ view });\n const { actions, actionsButtonRef, selectedActionContent } = useMore({ view });\n const enableActionsMenu = selectionMode === SELECTION_MODES.multi && selectedRecordsCount !== 0;\n const formControlProps = useFormControlProps(view);\n const wrapAction = useWrapAction(view);\n\n const additionalActions = (\n <>\n {basicMode && (\n <ToolbarActions\n toolbarActions={toolbarActions?.filter(action => !action.id.startsWith('Add'))}\n />\n )}\n {allowBulkActions && template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (\n <ActionsMenu enableActionsMenu={enableActionsMenu} view={view} />\n )}\n </>\n );\n\n const createNewAction = toolbarActions?.find(action => action.id.startsWith('Add'));\n const createNew =\n createNewAction && basicMode\n ? {\n label: createNewAction?.text,\n onClick: createNewAction.onClick\n }\n : undefined;\n\n const Toolbar =\n template === REPEATING_STRUCTURE_TEMPLATES.MAP ? (\n <MapToolbar\n locationFieldId={mapFieldIds?.location}\n name={title}\n formControlProps={formControlProps}\n rows={rows}\n count={count}\n createNew={createNew}\n additionalActions={additionalActions}\n />\n ) : (\n <>\n <ListToolbar\n name={title}\n formControlProps={formControlProps}\n viewSelector={viewSelector}\n search={search}\n count={count}\n additionalActions={additionalActions}\n filter={filter}\n group={showFeatureForTemplate(template, 'group') && group}\n sort={sort}\n actions={actions}\n actionsButtonRef={actionsButtonRef}\n createNew={createNew}\n wrap={showFeatureForTemplate(template, 'wrap') && wrapAction}\n />\n {selectedActionContent}\n {createEditViewContent}\n </>\n );\n\n return (\n <AnnounceRowsCount\n state={state}\n count={count}\n isLoading={isLoading}\n announceCount={announceCount}\n >\n <ValidateMessage message={validatemessage}>\n {Toolbar}\n {/* FIXME: This implementation of error status should be considered temporary until an official, and properly accessible, spec is determined. */}\n </ValidateMessage>\n {refreshNotification && (\n <RefreshBanner refreshNotification={refreshNotification} forceRefresh={forceRefresh} />\n )}\n </AnnounceRowsCount>\n );\n}\n\nAdvanceToolbar.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}

package/lib/Core/Components/Toolbar/AnnounceRowsCount.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 export default AnnounceRowsCount;
 declare function AnnounceRowsCount({ state, count, isLoading, children, announceCount }: {
     state: any;
-    count: any;
+    count?: {} | undefined;
     isLoading: any;
     children: any;
     announceCount: any;

package/lib/Core/Components/Toolbar/AnnounceRowsCount.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import PropTypes from 'prop-types';
 import useAnnounceRowsCount from './hooks/useAnnounceRowsCount';
-const AnnounceRowsCount = ({ state, count, isLoading, children, announceCount }) => {
+const AnnounceRowsCount = ({ state, count = {}, isLoading, children, announceCount }) => {
     useAnnounceRowsCount(state, count, isLoading, announceCount);
     return _jsx(_Fragment, { children: children });
 };

package/lib/Core/Components/Toolbar/AnnounceRowsCount.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnnounceRowsCount.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AnnounceRowsCount.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,oBAAoB,MAAM,8BAA8B,CAAC;AAEhE,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;~~IACjF~~,oBAAoB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC;IAC7D,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC,CAAC;AAEF,iBAAiB,CAAC,SAAS,GAAG;IAC5B,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,QAAQ,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU;CAC9E,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport useAnnounceRowsCount from './hooks/useAnnounceRowsCount';\n\nconst AnnounceRowsCount = ({ state, count, isLoading, children, announceCount }) => {\n useAnnounceRowsCount(state, count, isLoading, announceCount);\n return <>{children}</>;\n};\n\nAnnounceRowsCount.propTypes = {\n state: PropTypes.objectOf(PropTypes.any).isRequired,\n count: PropTypes.objectOf(PropTypes.any).isRequired,\n children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired\n};\n\nexport default AnnounceRowsCount;\n"]}
1	+ {"version":3,"file":"AnnounceRowsCount.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AnnounceRowsCount.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,oBAAoB,MAAM,8BAA8B,CAAC;AAEhE,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,GAAG,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;IACtF,oBAAoB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC;IAC7D,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC,CAAC;AAEF,iBAAiB,CAAC,SAAS,GAAG;IAC5B,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,QAAQ,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU;CAC9E,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport useAnnounceRowsCount from './hooks/useAnnounceRowsCount';\n\nconst AnnounceRowsCount = ({ state, count = {}, isLoading, children, announceCount }) => {\n useAnnounceRowsCount(state, count, isLoading, announceCount);\n return <>{children}</>;\n};\n\nAnnounceRowsCount.propTypes = {\n state: PropTypes.objectOf(PropTypes.any).isRequired,\n count: PropTypes.objectOf(PropTypes.any).isRequired,\n children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired\n};\n\nexport default AnnounceRowsCount;\n"]}

package/lib/Core/Components/Toolbar/ColumnSelector.d.ts CHANGED Viewed

@@ -1,16 +1,24 @@
-export function getIconByFieldType(type: any): import("react/jsx-runtime").JSX.Element;
+/**
+ * Returns an Icon component based on the field type.
+ *
+ * @param {string} type - The type of the field for which the icon is required.
+ * @returns {JSX.Element} - A React Icon component with the appropriate icon name.
+ */
+export function getIconByFieldType(type: string): JSX.Element;
 /**
  * Transforms the columns array into array of columns grouped by category
- * @param {Array} columns : ;
+ * @param {Array} columns - The array of column objects to be transformed.
+ * @param {string} action - The action to perform, either 'Show/hide columns' or 'Freeze columns'.
  * @returns Arrays of columns nested by category
  */
-export function transformData(columns: any[], action: any): any[];
+export function transformData(columns: any[], action: string): any[];
 export function ColumnSelectorControl(props: any): import("react/jsx-runtime").JSX.Element;
 export namespace ColumnSelectorControl {
     namespace propTypes {
         let data: PropTypes.Validator<(object | null | undefined)[]>;
-        let onSelect: PropTypes.Validator<(...args: any[]) => any>;
-        let forceShowPopup: PropTypes.Validator<boolean>;
+        let onSubmit: PropTypes.Validator<(...args: any[]) => any>;
+        let onCancel: PropTypes.Validator<(...args: any[]) => any>;
+        let action: PropTypes.Validator<string>;
     }
 }
 export const colsVisibility: "Show/hide columns";
@@ -18,16 +26,19 @@ export const pinning: "Freeze columns";
 declare const _default: import("react").MemoExoticComponent<typeof ColumnSelector>;
 export default _default;
 import PropTypes from 'prop-types';
-declare function ColumnSelector({ dispatch, columns, action }: {
+declare function ColumnSelector({ dispatch, columns, action, finishPopOver }: {
     dispatch: any;
     columns: any;
     action: any;
+    finishPopOver: any;
 }): import("react/jsx-runtime").JSX.Element;
 declare namespace ColumnSelector {
     export namespace propTypes_1 {
-        let dispatch: PropTypes.Validator<(...args: any[]) => any>;
-        let columns: PropTypes.Validator<(object | null | undefined)[]>;
-        let action: PropTypes.Validator<string>;
+        export let dispatch: PropTypes.Validator<(...args: any[]) => any>;
+        export let columns: PropTypes.Validator<(object | null | undefined)[]>;
+        let action_1: PropTypes.Validator<string>;
+        export { action_1 as action };
+        export let finishPopOver: PropTypes.Validator<(...args: any[]) => any>;
     }
     export { propTypes_1 as propTypes };
 }

package/lib/Core/Components/Toolbar/ColumnSelector.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"~~AAWA~~,~~uFAGC~~;~~AACD;;;;GAIG~~;AACH,~~kEA4DC~~;~~AAED~~,~~2FA8DC;;;;;;;;AAxID~~,6BAA8B,mBAAmB,CAAC;AAClD,sBAAuB,gBAAgB,CAAC;;;~~sBARlB~~,YAAY;~~AAuJlC;;;;4CAwBC~~"}
1	+ {"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"AAoBA;;;;;GAKG;AACH,yCAHW,MAAM,GACJ,GAAG,CAAC,OAAO,CAKvB;AAeD;;;;;GAKG;AACH,sDAHW,MAAM,SAgEhB;AA2BD,2FAwEC;;;;;;;;;AAjMD,6BAA8B,mBAAmB,CAAC;AAClD,sBAAuB,gBAAgB,CAAC;;;sBAjBlB,YAAY;AA0NlC;;;;;4CAqBC"}

package/lib/Core/Components/Toolbar/ColumnSelector.js CHANGED Viewed

@@ -1,18 +1,38 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { memo, useCallback, useEffect, useRef, useState, useMemo } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useEffect, useState, useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { Icon, SearchInput, Menu, menuHelpers, useElement } from '@pega/cosmos-react-core';
-import useSelect from '../../Hooks/useSelect';
+import styled from 'styled-components';
+import { Icon, SearchInput, Menu, menuHelpers, useElement, Flex, Button } from '@pega/cosmos-react-core';
 import { allowToggle, getFieldIcon } from '../../Utils';
+import useTranslate from '../../Hooks/useTranslate';
 export const colsVisibility = 'Show/hide columns';
 export const pinning = 'Freeze columns';
+/**
+ * Returns an Icon component based on the field type.
+ *
+ * @param {string} type - The type of the field for which the icon is required.
+ * @returns {JSX.Element} - A React Icon component with the appropriate icon name.
+ */
 export function getIconByFieldType(type) {
     const iconName = getFieldIcon(type);
     return _jsx(Icon, { "data-test-id": iconName, "data-testid": iconName, name: iconName });
 }
+/**
+ * Determines the list of changed column IDs.
+ *
+ * @param {Set<string>} initialSelectedColumns - The initial set of selected column IDs.
+ * @param {Set<string>} currentSelectedColumns - The current set of selected column IDs.
+ * @returns {string[]} - Array of modified column IDs.
+ */
+function getModifiedColumns(initialSelectedColumns, currentSelectedColumns) {
+    const addedColumns = [...currentSelectedColumns].filter(id => !initialSelectedColumns.has(id));
+    const removedColumns = [...initialSelectedColumns].filter(id => !currentSelectedColumns.has(id));
+    return [...addedColumns, ...removedColumns];
+}
 /**
  * Transforms the columns array into array of columns grouped by category
- * @param {Array} columns : ;
+ * @param {Array} columns - The array of column objects to be transformed.
+ * @param {string} action - The action to perform, either 'Show/hide columns' or 'Freeze columns'.
  * @returns Arrays of columns nested by category
  */
 export function transformData(columns, action) {
@@ -26,35 +46,33 @@ export function transformData(columns, action) {
         .forEach(column => {
         const { field: { id, category = [], type }, label, hidden, frozen } = column;
         const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;
-        let selectAction;
         let disabled;
         if (action === colsVisibility) {
-            selectAction = !hidden;
             disabled = !allowColumnToggle && !hidden;
         }
-        else if (action === pinning)
-            selectAction = frozen;
         if (categoryObj[lastCategoryLabel])
             categoryObj[lastCategoryLabel].items.push({
                 id,
                 primary: label,
                 label,
-                selected: selectAction,
+                selected: action === colsVisibility ? !hidden : frozen,
                 type,
-                disabled
+                disabled,
+                visual: getIconByFieldType(type)
             });
         else {
             categoryObj[lastCategoryLabel] = {
                 id: `category:${lastCategoryLabel}`,
-                label: lastCategoryLabel,
+                primary: lastCategoryLabel,
                 items: [
                     {
                         id,
                         primary: label,
-                        selected: selectAction,
+                        selected: action === colsVisibility ? !hidden : frozen,
                         label,
                         type,
-                        disabled
+                        disabled,
+                        visual: getIconByFieldType(type)
                     }
                 ]
             };
@@ -72,69 +90,75 @@ export function transformData(columns, action) {
     });
     return result;
 }
+const Footer = memo(({ onCancel, onSubmit, disabled }) => {
+    const [translate] = useTranslate();
+    return (_jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { onClick: onCancel, "data-testid": 'cancel', children: translate('Cancel') }), _jsx(Button, { variant: 'primary', onClick: onSubmit, disabled: disabled, "data-testid": 'submit', children: translate('Submit') })] }));
+});
+Footer.displayName = 'Footer';
+Footer.propTypes = {
+    onCancel: PropTypes.func.isRequired,
+    onSubmit: PropTypes.func.isRequired,
+    disabled: PropTypes.bool.isRequired
+};
+const StyledMenu = styled(Menu) `
+  width: 16rem;
+`;
 export function ColumnSelectorControl(props) {
-    const { data, onSelect, forceShowPopup } = props;
-    const flatData = menuHelpers.flatten(data);
-    data.forEach(d => {
-        if (d.items)
-            d.items.forEach(item => {
-                item.visual = getIconByFieldType(item.type);
-            });
-        else {
-            d.visual = getIconByFieldType(d.type);
-        }
-    });
-    const selectedData = flatData.filter(o => o.selected).map(obj => obj.id);
-    const [visibleColumns, onChecked] = useSelect(selectedData);
-    const onChange = useCallback(id => onChecked(id), [onChecked]);
-    const [searchQuery, onSearch] = useState('');
-    const [searchEl, setSearchEl] = useElement(null);
-    const hasMountedRef = useRef(false);
-    const onSearchTriggered = useCallback(searchString => {
-        onSearch(searchString);
-    }, [onSearch]);
-    useEffect(() => {
-        if (forceShowPopup && searchEl)
-            searchEl.focus();
-    }, [forceShowPopup, searchEl]);
+    const { data, onSubmit, onCancel, action } = props;
+    const initialSelectedColumns = useMemo(() => new Set(menuHelpers
+        .flatten(data)
+        .filter(item => item.selected)
+        .map(item => item.id)), [data]);
+    const [searchText, setSearchText] = useState('');
+    const [searchRef, setSearchRef] = useElement(null);
+    const [items, setItems] = useState(data);
+    const selectedColumns = useMemo(() => new Set(menuHelpers.getSelected(items).map(item => item.id)), [items]);
     useEffect(() => {
-        if (hasMountedRef.current) {
-            const previousVisibleColumns = flatData.filter(o => o.selected).map(o => o.id);
-            const currentVisibleColumns = [...visibleColumns];
-            const toggledColumns = [
-                ...currentVisibleColumns.filter(id => !previousVisibleColumns.includes(id)),
-                ...previousVisibleColumns.filter(id => !visibleColumns.has(id))
-            ];
-            onSelect(toggledColumns);
+        if (searchRef) {
+            searchRef.focus();
         }
-        hasMountedRef.current = true;
-    }, [visibleColumns]);
-    const itemsToRender = searchQuery
-        ? flatData.filter(item => item.label.toLowerCase().includes(searchQuery.toLowerCase()))
-        : data;
-    return (_jsx(Menu, { items: itemsToRender, mode: 'multi-select', onItemClick: onChange, role: 'listbox', focusControlEl: searchEl || undefined, header: _jsx(SearchInput, { value: searchQuery, onSearchChange: onSearchTriggered, ref: setSearchEl }) }));
+    }, [searchRef]);
+    const itemsToRender = useMemo(() => {
+        return menuHelpers.mapTree(searchText
+            ? menuHelpers
+                .flatten(items)
+                .filter(({ primary }) => primary.toLowerCase().includes(searchText.toLowerCase()))
+            : items, item => {
+            return {
+                ...item,
+                visual: item.visual,
+                selected: item.items ? undefined : item.selected,
+                disabled: item.selected && action === colsVisibility && selectedColumns.size <= 1
+            };
+        });
+    }, [searchText, items]);
+    const modifiedColumns = useMemo(() => getModifiedColumns(initialSelectedColumns, selectedColumns), [initialSelectedColumns, selectedColumns, action]);
+    const isSubmitEnabled = !(action === colsVisibility && selectedColumns.size === 0) && modifiedColumns.length > 0;
+    return (_jsx(StyledMenu, { items: itemsToRender, mode: 'multi-select', onItemClick: (id, args) => {
+            setItems(cur => menuHelpers.toggleSelected(cur, id, args.mode));
+        }, role: 'listbox', focusControlEl: searchRef || undefined, header: _jsx(SearchInput, { value: searchText, onSearchChange: setSearchText, ref: setSearchRef }), footer: _jsx(Footer, { onCancel: onCancel, onSubmit: () => onSubmit(modifiedColumns), disabled: !isSubmitEnabled }) }));
 }
 ColumnSelectorControl.propTypes = {
     data: PropTypes.arrayOf(PropTypes.object).isRequired,
-    onSelect: PropTypes.func.isRequired,
-    forceShowPopup: PropTypes.bool.isRequired
+    onSubmit: PropTypes.func.isRequired,
+    onCancel: PropTypes.func.isRequired,
+    action: PropTypes.string.isRequired
 };
-function ColumnSelector({ dispatch, columns, action }) {
-    const data = useMemo(() => transformData(columns, action), [columns, action]);
-    const [forceShowPopup, setForceShowPopup] = useState(true);
-    const onSelectHandler = useCallback(cols => {
-        if (columns.length > 100) {
-            setForceShowPopup(false);
+function ColumnSelector({ dispatch, columns, action, finishPopOver }) {
+    const transformed = useMemo(() => transformData(columns, action), [columns, action]);
+    const onSubmitHandler = useCallback(changedCols => {
+        if (changedCols.length > 0) {
+            dispatch(changedCols);
         }
-        if (cols.length > 0)
-            dispatch(cols);
-    }, [dispatch, columns.length]);
-    return (_jsx(_Fragment, { children: forceShowPopup && (_jsx(ColumnSelectorControl, { data: data, onSelect: onSelectHandler, forceShowPopup: forceShowPopup })) }));
+        finishPopOver();
+    }, [dispatch]);
+    return (_jsx(ColumnSelectorControl, { data: transformed, onSubmit: onSubmitHandler, onCancel: finishPopOver, action: action }));
 }
 ColumnSelector.propTypes = {
     dispatch: PropTypes.func.isRequired,
     columns: PropTypes.arrayOf(PropTypes.object).isRequired,
-    action: PropTypes.string.isRequired
+    action: PropTypes.string.isRequired,
+    finishPopOver: PropTypes.func.isRequired
 };
 export default memo(ColumnSelector);
 //# sourceMappingURL=ColumnSelector.js.map

package/lib/Core/Components/Toolbar/ColumnSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColumnSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Icon, SearchInput, Menu, menuHelpers, useElement } from '@pega/cosmos-react-core';\n\nimport useSelect from '../../Hooks/useSelect';\nimport { allowToggle, getFieldIcon } from '../../Utils';\n\nexport const colsVisibility = 'Show/hide columns';\nexport const pinning = 'Freeze columns';\n\nexport function getIconByFieldType(type) {\n const iconName = getFieldIcon(type);\n return <Icon data-test-id={iconName} data-testid={iconName} name={iconName} />;\n}\n/*\n Transforms the columns array into array of columns grouped by category\n * @param {Array} columns : ;\n * @returns Arrays of columns nested by category\n */\nexport function transformData(columns, action) {\n const result = [];\n if (!columns?.length) return result;\n\n const categoryObj = {};\n const allowColumnToggle = allowToggle(columns[0].parent.getVisibleColumns());\n\n columns\n ?.filter(c => c.field.toggle)\n .forEach(column => {\n const {\n field: { id, category = [], type },\n label,\n hidden,\n frozen\n } = column;\n const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;\n let selectAction;\n let disabled;\n if (action === colsVisibility) {\n selectAction = !hidden;\n disabled = !allowColumnToggle && !hidden;\n } else if (action === pinning) selectAction = frozen;\n if (categoryObj[lastCategoryLabel])\n categoryObj[lastCategoryLabel].items.push({\n id,\n primary: label,\n label,\n selected: selectAction,\n type,\n disabled\n });\n else {\n categoryObj[lastCategoryLabel] = {\n id: `category:${lastCategoryLabel}`,\n label: lastCategoryLabel,\n items: [\n {\n id,\n primary: label,\n selected: selectAction,\n label,\n type,\n disabled\n }\n ]\n };\n }\n });\n // Items with no category attribute are set in the root of returned array\n if (categoryObj[undefined] && categoryObj[undefined].items) {\n result.push(...categoryObj[undefined].items);\n delete categoryObj[undefined];\n }\n const keys = Object.keys(categoryObj);\n // Items with category attribute are grouped inside the nested category object\n keys.forEach(key => {\n result.push(categoryObj[key]);\n });\n return result;\n}\n\nexport function ColumnSelectorControl(props) {\n const { data, onSelect, forceShowPopup } = props;\n const flatData = menuHelpers.flatten(data);\n\n data.forEach(d => {\n if (d.items)\n d.items.forEach(item => {\n item.visual = getIconByFieldType(item.type);\n });\n else {\n d.visual = getIconByFieldType(d.type);\n }\n });\n\n const selectedData = flatData.filter(o => o.selected).map(obj => obj.id);\n const [visibleColumns, onChecked] = useSelect(selectedData);\n const onChange = useCallback(id => onChecked(id), [onChecked]);\n const [searchQuery, onSearch] = useState('');\n const [searchEl, setSearchEl] = useElement(null);\n\n const hasMountedRef = useRef(false);\n\n const onSearchTriggered = useCallback(\n searchString => {\n onSearch(searchString);\n },\n [onSearch]\n );\n\n useEffect(() => {\n if (forceShowPopup && searchEl) searchEl.focus();\n }, [forceShowPopup, searchEl]);\n\n useEffect(() => {\n if (hasMountedRef.current) {\n const previousVisibleColumns = flatData.filter(o => o.selected).map(o => o.id);\n const currentVisibleColumns = [...visibleColumns];\n const toggledColumns = [\n ...currentVisibleColumns.filter(id => !previousVisibleColumns.includes(id)),\n ...previousVisibleColumns.filter(id => !visibleColumns.has(id))\n ];\n onSelect(toggledColumns);\n }\n hasMountedRef.current = true;\n }, [visibleColumns]);\n\n const itemsToRender = searchQuery\n ? flatData.filter(item => item.label.toLowerCase().includes(searchQuery.toLowerCase()))\n : data;\n\n return (\n <Menu\n items={itemsToRender}\n mode='multi-select'\n onItemClick={onChange}\n role='listbox'\n focusControlEl={searchEl \|\| undefined}\n header={\n <SearchInput value={searchQuery} onSearchChange={onSearchTriggered} ref={setSearchEl} />\n }\n />\n );\n}\n\nColumnSelectorControl.propTypes = {\n data: PropTypes.arrayOf(PropTypes.object).isRequired,\n onSelect: PropTypes.func.isRequired,\n forceShowPopup: PropTypes.bool.isRequired\n};\n\nfunction ColumnSelector({ dispatch, columns, action }) {\n const data = useMemo(() => transformData(columns, action), [columns, action]);\n const [forceShowPopup, setForceShowPopup] = useState(true);\n const onSelectHandler = useCallback(\n cols => {\n if (columns.length > 100) {\n setForceShowPopup(false);\n }\n if (cols.length > 0) dispatch(cols);\n },\n [dispatch, columns.length]\n );\n\n return (\n <>\n {forceShowPopup && (\n <ColumnSelectorControl\n data={data}\n onSelect={onSelectHandler}\n forceShowPopup={forceShowPopup}\n />\n )}\n </>\n );\n}\n\nColumnSelector.propTypes = {\n dispatch: PropTypes.func.isRequired,\n columns: PropTypes.arrayOf(PropTypes.object).isRequired,\n action: PropTypes.string.isRequired\n};\n\nexport default memo(ColumnSelector);\n"]}
1	+ {"version":3,"file":"ColumnSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useCallback, useEffect, useState, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nimport {\n Icon,\n SearchInput,\n Menu,\n menuHelpers,\n useElement,\n Flex,\n Button\n} from '@pega/cosmos-react-core';\n\nimport { allowToggle, getFieldIcon } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport const colsVisibility = 'Show/hide columns';\nexport const pinning = 'Freeze columns';\n\n/*\n Returns an Icon component based on the field type.\n \n @param {string} type - The type of the field for which the icon is required.\n * @returns {JSX.Element} - A React Icon component with the appropriate icon name.\n /\nexport function getIconByFieldType(type) {\n const iconName = getFieldIcon(type);\n return <Icon data-test-id={iconName} data-testid={iconName} name={iconName} />;\n}\n\n/\n Determines the list of changed column IDs.\n \n @param {Set<string>} initialSelectedColumns - The initial set of selected column IDs.\n * @param {Set<string>} currentSelectedColumns - The current set of selected column IDs.\n * @returns {string[]} - Array of modified column IDs.\n /\nfunction getModifiedColumns(initialSelectedColumns, currentSelectedColumns) {\n const addedColumns = [...currentSelectedColumns].filter(id => !initialSelectedColumns.has(id));\n const removedColumns = [...initialSelectedColumns].filter(id => !currentSelectedColumns.has(id));\n return [...addedColumns, ...removedColumns];\n}\n\n/\n Transforms the columns array into array of columns grouped by category\n * @param {Array} columns - The array of column objects to be transformed.\n * @param {string} action - The action to perform, either 'Show/hide columns' or 'Freeze columns'.\n * @returns Arrays of columns nested by category\n */\nexport function transformData(columns, action) {\n const result = [];\n if (!columns?.length) return result;\n\n const categoryObj = {};\n const allowColumnToggle = allowToggle(columns[0].parent.getVisibleColumns());\n\n columns\n ?.filter(c => c.field.toggle)\n .forEach(column => {\n const {\n field: { id, category = [], type },\n label,\n hidden,\n frozen\n } = column;\n const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;\n let disabled;\n if (action === colsVisibility) {\n disabled = !allowColumnToggle && !hidden;\n }\n if (categoryObj[lastCategoryLabel])\n categoryObj[lastCategoryLabel].items.push({\n id,\n primary: label,\n label,\n selected: action === colsVisibility ? !hidden : frozen,\n type,\n disabled,\n visual: getIconByFieldType(type)\n });\n else {\n categoryObj[lastCategoryLabel] = {\n id: `category:${lastCategoryLabel}`,\n primary: lastCategoryLabel,\n items: [\n {\n id,\n primary: label,\n selected: action === colsVisibility ? !hidden : frozen,\n label,\n type,\n disabled,\n visual: getIconByFieldType(type)\n }\n ]\n };\n }\n });\n // Items with no category attribute are set in the root of returned array\n if (categoryObj[undefined] && categoryObj[undefined].items) {\n result.push(...categoryObj[undefined].items);\n delete categoryObj[undefined];\n }\n const keys = Object.keys(categoryObj);\n // Items with category attribute are grouped inside the nested category object\n keys.forEach(key => {\n result.push(categoryObj[key]);\n });\n\n return result;\n}\n\nconst Footer = memo(({ onCancel, onSubmit, disabled }) => {\n const [translate] = useTranslate();\n return (\n <Flex container={{ justify: 'between' }}>\n <Button onClick={onCancel} data-testid='cancel'>\n {translate('Cancel')}\n </Button>\n <Button variant='primary' onClick={onSubmit} disabled={disabled} data-testid='submit'>\n {translate('Submit')}\n </Button>\n </Flex>\n );\n});\n\nFooter.displayName = 'Footer';\n\nFooter.propTypes = {\n onCancel: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n disabled: PropTypes.bool.isRequired\n};\n\nconst StyledMenu = styled(Menu)`\n width: 16rem;\n`;\nexport function ColumnSelectorControl(props) {\n const { data, onSubmit, onCancel, action } = props;\n\n const initialSelectedColumns = useMemo(\n () =>\n new Set(\n menuHelpers\n .flatten(data)\n .filter(item => item.selected)\n .map(item => item.id)\n ),\n [data]\n );\n\n const [searchText, setSearchText] = useState('');\n const [searchRef, setSearchRef] = useElement(null);\n const [items, setItems] = useState(data);\n const selectedColumns = useMemo(\n () => new Set(menuHelpers.getSelected(items).map(item => item.id)),\n [items]\n );\n\n useEffect(() => {\n if (searchRef) {\n searchRef.focus();\n }\n }, [searchRef]);\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(\n searchText\n ? menuHelpers\n .flatten(items)\n .filter(({ primary }) => primary.toLowerCase().includes(searchText.toLowerCase()))\n : items,\n item => {\n return {\n ...item,\n visual: item.visual,\n selected: item.items ? undefined : item.selected,\n disabled: item.selected && action === colsVisibility && selectedColumns.size <= 1\n };\n }\n );\n }, [searchText, items]);\n\n const modifiedColumns = useMemo(\n () => getModifiedColumns(initialSelectedColumns, selectedColumns),\n [initialSelectedColumns, selectedColumns, action]\n );\n\n const isSubmitEnabled =\n !(action === colsVisibility && selectedColumns.size === 0) && modifiedColumns.length > 0;\n return (\n <StyledMenu\n items={itemsToRender}\n mode='multi-select'\n onItemClick={(id, args) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, args.mode));\n }}\n role='listbox'\n focusControlEl={searchRef \|\| undefined}\n header={<SearchInput value={searchText} onSearchChange={setSearchText} ref={setSearchRef} />}\n footer={\n <Footer\n onCancel={onCancel}\n onSubmit={() => onSubmit(modifiedColumns)}\n disabled={!isSubmitEnabled}\n />\n }\n />\n );\n}\n\nColumnSelectorControl.propTypes = {\n data: PropTypes.arrayOf(PropTypes.object).isRequired,\n onSubmit: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired,\n action: PropTypes.string.isRequired\n};\n\nfunction ColumnSelector({ dispatch, columns, action, finishPopOver }) {\n const transformed = useMemo(() => transformData(columns, action), [columns, action]);\n\n const onSubmitHandler = useCallback(\n changedCols => {\n if (changedCols.length > 0) {\n dispatch(changedCols);\n }\n finishPopOver();\n },\n [dispatch]\n );\n\n return (\n <ColumnSelectorControl\n data={transformed}\n onSubmit={onSubmitHandler}\n onCancel={finishPopOver}\n action={action}\n />\n );\n}\n\nColumnSelector.propTypes = {\n dispatch: PropTypes.func.isRequired,\n columns: PropTypes.arrayOf(PropTypes.object).isRequired,\n action: PropTypes.string.isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n\nexport default memo(ColumnSelector);\n"]}

package/lib/Core/Components/Toolbar/DebugInfo.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 declare const _default: import("react").MemoExoticComponent<typeof DebugInfo>;
 export default _default;
-declare function DebugInfo({ view, targetRef, onClose }: {
+declare function DebugInfo({ view, target, onClose }: {
     view: any;
-    targetRef: any;
+    target: any;
     onClose: any;
 }): import("react/jsx-runtime").JSX.Element;
 declare namespace DebugInfo {
@@ -10,9 +10,7 @@ declare namespace DebugInfo {
         let view: PropTypes.Validator<{
             [x: string]: any;
         }>;
-        let targetRef: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            current: PropTypes.Requireable<Element>;
-        }>>>;
+        let target: PropTypes.Requireable<Element>;
         let onClose: PropTypes.Requireable<(...args: any[]) => any>;
     }
 }

package/lib/Core/Components/Toolbar/DebugInfo.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DebugInfo.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/DebugInfo.jsx"],"names":[],"mappings":";;AAgBA;;;;4CAwCC~~;;;;;;;;;;;;~~sBAvDqB,YAAY"}
1	+ {"version":3,"file":"DebugInfo.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/DebugInfo.jsx"],"names":[],"mappings":";;AAgBA;;;;4CAwCC;;;;;;;;;;sBAvDqB,YAAY"}

package/lib/Core/Components/Toolbar/DebugInfo.js CHANGED Viewed

@@ -11,7 +11,7 @@ const fieldsConfiguration = [
     { field: debugInfoFields.timeTaken, defaultLabel: 'Time taken' },
     { field: debugInfoFields.insightId, defaultLabel: 'Insight ID', hideIfNotAvailable: true }
 ];
-function DebugInfo({ view, targetRef, onClose }) {
+function DebugInfo({ view, target, onClose }) {
     const [translate] = useTranslate();
     const debugInfoList = view.debugInfo.length === 0 ? [{}] : view.debugInfo;
     const headingRef = useRef(null);
@@ -30,11 +30,11 @@ function DebugInfo({ view, targetRef, onClose }) {
         });
         return result;
     }, []));
-    return (_jsx(InfoDialog, { target: targetRef.current, heading: translate('Query info'), onDismiss: onClose, children: formattedData.map((debugInfoEntry, index) => (_jsx(FieldValueList, { className: 'debug-record', variant: 'inline', fields: debugInfoEntry }, index))) }));
+    return (_jsx(InfoDialog, { target: target, heading: translate('Query info'), onDismiss: onClose, children: formattedData.map((debugInfoEntry, index) => (_jsx(FieldValueList, { className: 'debug-record', variant: 'inline', fields: debugInfoEntry }, index))) }));
 }
 DebugInfo.propTypes = {
     view: PropTypes.objectOf(PropTypes.any).isRequired,
-    targetRef: PropTypes.shape({ current: PropTypes.instanceOf(Element) }).isRequired,
+    target: PropTypes.instanceOf(Element),
     onClose: PropTypes.func
 };
 export default memo(DebugInfo);

package/lib/Core/Components/Toolbar/DebugInfo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DebugInfo.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/DebugInfo.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,mBAAmB,GAAG;IAC1B,EAAE,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE;IAC3D,EAAE,KAAK,EAAE,eAAe,CAAC,QAAQ,EAAE,YAAY,EAAE,WAAW,EAAE;IAC9D,EAAE,KAAK,EAAE,eAAe,CAAC,UAAU,EAAE,YAAY,EAAE,aAAa,EAAE;IAClE,EAAE,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE;IAChE,EAAE,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,IAAI,EAAE;CAC3F,CAAC;AAEF,SAAS,SAAS,CAAC,EAAE,IAAI,EAAE,~~SAAS~~,EAAE,OAAO,EAAE;~~IAC7C~~,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;IAC1E,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEhC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,CAAC,OAAO;YAAE,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACrD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,aAAa,CAAC,GAAG,CAAC,cAAc,CAAC,EAAE,CACvD,mBAAmB,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,kBAAkB,EAAE,EAAE,EAAE;QACjF,IAAI,kBAAkB,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;YACjD,OAAO,MAAM,CAAC;QAChB,CAAC;QACD,MAAM,CAAC,IAAI,CAAC;YACV,EAAE,EAAE,KAAK;YACT,IAAI,EAAE,SAAS,CAAC,YAAY,CAAC;YAC7B,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAC7B,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,iBAAc,SAAS,KAAK,EAAE,YAC7C,cAAc,CAAC,KAAK,CAAC,GACjB,CACR,CAAC,CAAC,CAAC,SAAS;SACd,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC,EAAE,EAAE,CAAC,CACP,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,IAAC,MAAM,EAAE,~~SAAS~~,~~CAAC,OAAO,~~EAAE,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,EAAE,SAAS,EAAE,OAAO,~~YACxF~~,aAAa,CAAC,GAAG,CAAC,CAAC,cAAc,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,KAAC,cAAc,IACb,SAAS,EAAC,cAAc,EACxB,OAAO,EAAC,QAAQ,EAGhB,MAAM,EAAE,cAAc,IADjB,KAAK,CAEV,CACH,CAAC,GACS,CACd,CAAC;AACJ,CAAC;AAED,SAAS,CAAC,SAAS,GAAG;IACpB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,~~SAAS~~,EAAE,SAAS,CAAC,~~KAAK,CAAC,EAAE,OAAO,EAAE,SAAS,CAAC,~~UAAU,CAAC,OAAO,CAAC~~,EAAE,CAAC,CAAC,UAAU~~;~~IACjF~~,OAAO,EAAE,SAAS,CAAC,IAAI;CACxB,CAAC;AAEF,eAAe,IAAI,CAAC,SAAS,CAAC,CAAC","sourcesContent":["import { memo, useRef, useEffect } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FieldValueList, Text, InfoDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\nimport { debugInfoFields } from '../../constants';\n\nconst fieldsConfiguration = [\n { field: debugInfoFields.className, defaultLabel: 'Class' },\n { field: debugInfoFields.dataPage, defaultLabel: 'Data page' },\n { field: debugInfoFields.dataSource, defaultLabel: 'Data source' },\n { field: debugInfoFields.timeTaken, defaultLabel: 'Time taken' },\n { field: debugInfoFields.insightId, defaultLabel: 'Insight ID', hideIfNotAvailable: true }\n];\n\nfunction DebugInfo({ view, ~~targetRef~~, onClose }) {\n const [translate] = useTranslate();\n const debugInfoList = view.debugInfo.length === 0 ? [{}] : view.debugInfo;\n const headingRef = useRef(null);\n\n useEffect(() => {\n if (headingRef.current) headingRef.current.focus();\n }, []);\n\n const formattedData = debugInfoList.map(debugInfoEntry =>\n fieldsConfiguration.reduce((result, { field, defaultLabel, hideIfNotAvailable }) => {\n if (hideIfNotAvailable && !debugInfoEntry[field]) {\n return result;\n }\n result.push({\n id: field,\n name: translate(defaultLabel),\n value: debugInfoEntry[field] ? (\n <Text variant='h5' data-testid={`field-${field}`}>\n {debugInfoEntry[field]}\n </Text>\n ) : undefined\n });\n return result;\n }, [])\n );\n\n return (\n <InfoDialog target={~~targetRef.current~~} heading={translate('Query info')} onDismiss={onClose}>\n {formattedData.map((debugInfoEntry, index) => (\n <FieldValueList\n className='debug-record'\n variant='inline'\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n fields={debugInfoEntry}\n />\n ))}\n </InfoDialog>\n );\n}\n\nDebugInfo.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired,\n ~~targetRef~~: PropTypes.~~shape({ current: PropTypes.~~instanceOf(Element) ~~}).isRequired~~,\n onClose: PropTypes.func\n};\n\nexport default memo(DebugInfo);\n"]}
1	+ {"version":3,"file":"DebugInfo.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/DebugInfo.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useRef, useEffect } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FieldValueList, Text, InfoDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\nimport { debugInfoFields } from '../../constants';\n\nconst fieldsConfiguration = [\n { field: debugInfoFields.className, defaultLabel: 'Class' },\n { field: debugInfoFields.dataPage, defaultLabel: 'Data page' },\n { field: debugInfoFields.dataSource, defaultLabel: 'Data source' },\n { field: debugInfoFields.timeTaken, defaultLabel: 'Time taken' },\n { field: debugInfoFields.insightId, defaultLabel: 'Insight ID', hideIfNotAvailable: true }\n];\n\nfunction DebugInfo({ view, target, onClose }) {\n const [translate] = useTranslate();\n const debugInfoList = view.debugInfo.length === 0 ? [{}] : view.debugInfo;\n const headingRef = useRef(null);\n\n useEffect(() => {\n if (headingRef.current) headingRef.current.focus();\n }, []);\n\n const formattedData = debugInfoList.map(debugInfoEntry =>\n fieldsConfiguration.reduce((result, { field, defaultLabel, hideIfNotAvailable }) => {\n if (hideIfNotAvailable && !debugInfoEntry[field]) {\n return result;\n }\n result.push({\n id: field,\n name: translate(defaultLabel),\n value: debugInfoEntry[field] ? (\n <Text variant='h5' data-testid={`field-${field}`}>\n {debugInfoEntry[field]}\n </Text>\n ) : undefined\n });\n return result;\n }, [])\n );\n\n return (\n <InfoDialog target={target} heading={translate('Query info')} onDismiss={onClose}>\n {formattedData.map((debugInfoEntry, index) => (\n <FieldValueList\n className='debug-record'\n variant='inline'\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n fields={debugInfoEntry}\n />\n ))}\n </InfoDialog>\n );\n}\n\nDebugInfo.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired,\n target: PropTypes.instanceOf(Element),\n onClose: PropTypes.func\n};\n\nexport default memo(DebugInfo);\n"]}

package/lib/Core/Components/Toolbar/FieldSelector.d.ts CHANGED Viewed

@@ -6,6 +6,7 @@ declare namespace FieldSelector {
         let columns: PropTypes.Validator<any[]>;
         let onChange: PropTypes.Validator<(...args: any[]) => any>;
         let disabled: PropTypes.Requireable<boolean>;
+        let readOnly: PropTypes.Requireable<boolean>;
         let fieldProp: PropTypes.Requireable<string>;
         let label: PropTypes.Validator<string>;
         let labelHidden: PropTypes.Requireable<boolean>;

package/lib/Core/Components/Toolbar/FieldSelector.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":";AASA,~~oFAuDC;;;;;;;;;;;;sBA/DqB~~,YAAY"}
1	+ {"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":";AASA,oFAiEC;;;;;;;;;;;;;sBAzEqB,YAAY"}