@pega/lists-react 9.0.0-build.19.0 → 9.0.0-build.19.10
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.
- package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts +3 -1
- package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts.map +1 -1
- package/lib/Core/Components/DefaultComponents/EmptyContainer.js +11 -2
- package/lib/Core/Components/DefaultComponents/EmptyContainer.js.map +1 -1
- package/lib/Core/Components/DefaultComponents/index.d.ts +3 -1
- package/lib/Core/Components/DefaultComponents/index.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/AdvanceToolbar.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/AdvanceToolbar.js +3 -13
- package/lib/Core/Components/Toolbar/AdvanceToolbar.js.map +1 -1
- package/lib/Core/Components/Toolbar/FieldSelector.d.ts +1 -0
- package/lib/Core/Components/Toolbar/FieldSelector.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/FieldSelector.js +3 -2
- package/lib/Core/Components/Toolbar/FieldSelector.js.map +1 -1
- package/lib/Core/Components/Toolbar/Grouping.types.d.ts +0 -6
- package/lib/Core/Components/Toolbar/Grouping.types.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/Grouping.types.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.d.ts +14 -18
- package/lib/Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.js +14 -15
- package/lib/Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.d.ts +3 -2
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.js +4 -4
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/useGroup.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/useGroup.js +6 -3
- package/lib/Core/Components/Toolbar/hooks/useGroup/useGroup.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useMore.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useMore.js +32 -23
- package/lib/Core/Components/Toolbar/hooks/useMore.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/Row.d.ts +4 -4
- package/lib/Core/Components/Toolbar/hooks/useSort/Row.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/Row.js +6 -6
- package/lib/Core/Components/Toolbar/hooks/useSort/Row.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.d.ts +2 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.js +8 -2
- package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/useSort.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useSort/useSort.js +2 -2
- package/lib/Core/Components/Toolbar/hooks/useSort/useSort.js.map +1 -1
- package/lib/Core/Components/Virtualise/Pagination.d.ts.map +1 -1
- package/lib/Core/Components/Virtualise/Pagination.js +2 -1
- package/lib/Core/Components/Virtualise/Pagination.js.map +1 -1
- package/lib/Core/Components/Virtualise/UseScroll.d.ts +4 -1
- package/lib/Core/Components/Virtualise/UseScroll.d.ts.map +1 -1
- package/lib/Core/Components/Virtualise/UseScroll.js +16 -3
- package/lib/Core/Components/Virtualise/UseScroll.js.map +1 -1
- package/lib/Core/Components/Virtualise/VirtualizeInfinite.js +13 -3
- package/lib/Core/Components/Virtualise/VirtualizeInfinite.js.map +1 -1
- package/lib/Core/Components/Virtualise/index.js +12 -3
- package/lib/Core/Components/Virtualise/index.js.map +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryCard.d.ts +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryCard.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryCard.js +8 -6
- package/lib/Core/Views/Gallery/Components/GalleryCard.js.map +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.d.ts +8 -0
- package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.d.ts.map +1 -0
- package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.js +25 -0
- package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.js.map +1 -0
- package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts +1 -2
- package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryHeader.js +4 -8
- package/lib/Core/Views/Gallery/Components/GalleryHeader.js.map +1 -1
- package/lib/Core/Views/Gallery/Gallery.types.d.ts +0 -1
- package/lib/Core/Views/Gallery/Gallery.types.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/Gallery.types.js.map +1 -1
- package/lib/Core/Views/Gallery/hooks/useRowActions.d.ts +9 -0
- package/lib/Core/Views/Gallery/hooks/useRowActions.d.ts.map +1 -0
- package/lib/Core/Views/Gallery/hooks/useRowActions.js +25 -0
- package/lib/Core/Views/Gallery/hooks/useRowActions.js.map +1 -0
- package/lib/Core/Views/Gallery/index.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/index.js +10 -7
- package/lib/Core/Views/Gallery/index.js.map +1 -1
- package/lib/Core/Views/Gallery/utils.d.ts +15 -2
- package/lib/Core/Views/Gallery/utils.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/utils.js +23 -5
- package/lib/Core/Views/Gallery/utils.js.map +1 -1
- package/lib/Core/Views/Map/index.d.ts.map +1 -1
- package/lib/Core/Views/Map/index.js +2 -2
- package/lib/Core/Views/Map/index.js.map +1 -1
- package/lib/Core/Views/Table/TableA11y.d.ts +10 -0
- package/lib/Core/Views/Table/TableA11y.d.ts.map +1 -1
- package/lib/Core/Views/Table/TableA11y.js +185 -0
- package/lib/Core/Views/Table/TableA11y.js.map +1 -1
- package/lib/Core/Views/Table/VirtualizeWrapper.d.ts.map +1 -1
- package/lib/Core/Views/Table/VirtualizeWrapper.js +12 -13
- package/lib/Core/Views/Table/VirtualizeWrapper.js.map +1 -1
- package/lib/Core/Views/Table/index.d.ts.map +1 -1
- package/lib/Core/Views/Table/index.js +5 -3
- package/lib/Core/Views/Table/index.js.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.js +11 -11
- package/lib/Core/Views/Timeline/Timeline.js.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.styles.d.ts +1 -1
- package/lib/Core/Views/Timeline/Timeline.styles.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.styles.js +7 -10
- package/lib/Core/Views/Timeline/Timeline.styles.js.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.types.d.ts +7 -9
- package/lib/Core/Views/Timeline/Timeline.types.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/Timeline.types.js.map +1 -1
- package/lib/Core/Views/Timeline/__tests__/Timeline.mocks.d.ts +2 -2
- package/lib/Core/Views/Timeline/__tests__/Timeline.mocks.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/__tests__/Timeline.mocks.js.map +1 -1
- package/lib/Core/Views/Timeline/index.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/index.js +4 -4
- package/lib/Core/Views/Timeline/index.js.map +1 -1
- package/lib/Core/Views/Timeline/utils.d.ts +8 -10
- package/lib/Core/Views/Timeline/utils.d.ts.map +1 -1
- package/lib/Core/Views/Timeline/utils.js +136 -58
- package/lib/Core/Views/Timeline/utils.js.map +1 -1
- package/lib/Core/templateFeatureSupport.d.ts +17 -0
- package/lib/Core/templateFeatureSupport.d.ts.map +1 -0
- package/lib/Core/templateFeatureSupport.js +30 -0
- package/lib/Core/templateFeatureSupport.js.map +1 -0
- package/package.json +7 -7
- package/lib/Core/Components/Toolbar/Timeline/TimelineToolbar.d.ts +0 -7
- package/lib/Core/Components/Toolbar/Timeline/TimelineToolbar.d.ts.map +0 -1
- package/lib/Core/Components/Toolbar/Timeline/TimelineToolbar.js +0 -109
- package/lib/Core/Components/Toolbar/Timeline/TimelineToolbar.js.map +0 -1
- package/lib/Core/Views/Timeline/utility.d.ts +0 -8
- package/lib/Core/Views/Timeline/utility.d.ts.map +0 -1
- package/lib/Core/Views/Timeline/utility.js +0 -120
- package/lib/Core/Views/Timeline/utility.js.map +0 -1
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
export default EmptyContainer;
|
|
2
|
-
declare function EmptyContainer({ message }: {
|
|
2
|
+
declare function EmptyContainer({ message, shouldAnnounce, domContainer }: {
|
|
3
3
|
message: any;
|
|
4
|
+
shouldAnnounce: any;
|
|
5
|
+
domContainer: any;
|
|
4
6
|
}): import("react/jsx-runtime").JSX.Element;
|
|
5
7
|
//# sourceMappingURL=EmptyContainer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAuBA;;;;4CAqBC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import styled from 'styled-components';
|
|
3
|
-
import {
|
|
3
|
+
import { useEffect } from 'react';
|
|
4
|
+
import { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';
|
|
4
5
|
import TestIdConstants from '../TestIdConstants';
|
|
5
6
|
const EmptyContainerStyle = styled.div `
|
|
6
7
|
position: absolute;
|
|
@@ -16,7 +17,15 @@ const EmptyContainerStyle = styled.div `
|
|
|
16
17
|
overflow: hidden;
|
|
17
18
|
`;
|
|
18
19
|
EmptyContainerStyle.defaultProps = defaultThemeProp;
|
|
19
|
-
const EmptyContainer = ({ message }) => {
|
|
20
|
+
const EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {
|
|
21
|
+
const { announcePolite } = useLiveLog();
|
|
22
|
+
useEffect(() => {
|
|
23
|
+
if (shouldAnnounce &&
|
|
24
|
+
typeof document !== 'undefined' &&
|
|
25
|
+
domContainer?.contains(document.activeElement)) {
|
|
26
|
+
announcePolite({ message });
|
|
27
|
+
}
|
|
28
|
+
}, [shouldAnnounce, message, announcePolite, domContainer]);
|
|
20
29
|
return (_jsx(EmptyContainerStyle, { "data-test-id": TestIdConstants.noRecords, "data-testid": TestIdConstants.noRecords, children: _jsx(EmptyState, { message: message }) }));
|
|
21
30
|
};
|
|
22
31
|
export default EmptyContainer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEnF,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;gBAUtB,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;CAEtE,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,EAAE;IACnE,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IACE,cAAc;YACd,OAAO,QAAQ,KAAK,WAAW;YAC/B,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAC9C,CAAC;YACD,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,OAAO,CACL,KAAC,mBAAmB,oBACJ,eAAe,CAAC,SAAS,iBAC1B,eAAe,CAAC,SAAS,YAEtC,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,GACZ,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useEffect } from 'react';\n\nimport { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';\n\nimport TestIdConstants from '../TestIdConstants';\n\nconst EmptyContainerStyle = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n top: var(--row-height, 0);\n left: 0;\n right: 0;\n bottom: 0;\n background: ${props => props.theme.base.palette['primary-background']};\n overflow: hidden;\n`;\n\nEmptyContainerStyle.defaultProps = defaultThemeProp;\n\nconst EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {\n const { announcePolite } = useLiveLog();\n\n useEffect(() => {\n if (\n shouldAnnounce &&\n typeof document !== 'undefined' &&\n domContainer?.contains(document.activeElement)\n ) {\n announcePolite({ message });\n }\n }, [shouldAnnounce, message, announcePolite, domContainer]);\n\n return (\n <EmptyContainerStyle\n data-test-id={TestIdConstants.noRecords}\n data-testid={TestIdConstants.noRecords}\n >\n <EmptyState message={message} />\n </EmptyContainerStyle>\n );\n};\n\nexport default EmptyContainer;\n"]}
|
|
@@ -62,8 +62,10 @@ declare const _default: {
|
|
|
62
62
|
sortRenderer: typeof sort;
|
|
63
63
|
filterRenderer: typeof Filter;
|
|
64
64
|
headerCellRenderer: typeof HeaderCell;
|
|
65
|
-
emptyContainerRenderer: ({ message }: {
|
|
65
|
+
emptyContainerRenderer: ({ message, shouldAnnounce, domContainer }: {
|
|
66
66
|
message: any;
|
|
67
|
+
shouldAnnounce: any;
|
|
68
|
+
domContainer: any;
|
|
67
69
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
68
70
|
loadingIndicator: typeof LoadingIndicator;
|
|
69
71
|
rowHeightRenderer: typeof RowHeightRenderer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBApDqB,YAAY;iBAEjB,QAAQ;mBACN,UAAU;uBAEN,cAAc;6BAER,oBAAoB;8BACnB,aAAa;4CAEC,2BAA2B;8CACzB,6BAA6B;8BAC7C,qBAAqB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdvanceToolbar.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"AAwBA;;
|
|
1
|
+
{"version":3,"file":"AdvanceToolbar.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"AAwBA;;4CAyGC;;;;;;;;;sBAjIqB,YAAY"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { ListToolbar } from '@pega/cosmos-react-core';
|
|
4
|
-
import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core
|
|
4
|
+
import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
|
|
5
5
|
import { SELECTION_MODES } from '../../constants';
|
|
6
|
+
import showFeatureForTemplate from '../../templateFeatureSupport';
|
|
6
7
|
import ActionsMenu from './ActionsMenu';
|
|
7
8
|
import MapToolbar from './Map/MapToolbar';
|
|
8
9
|
import ToolbarActions from './ToolbarActions';
|
|
9
|
-
import TimelineToolbar from './Timeline/TimelineToolbar';
|
|
10
10
|
import useSearch from './hooks/useSearch';
|
|
11
11
|
import useFilter from './hooks/useFilter';
|
|
12
12
|
import usePersonalization from './hooks/usePersonalization';
|
|
@@ -41,17 +41,7 @@ export default function AdvanceToolbar({ view }) {
|
|
|
41
41
|
onClick: createNewAction.onClick
|
|
42
42
|
}
|
|
43
43
|
: undefined;
|
|
44
|
-
|
|
45
|
-
switch (template) {
|
|
46
|
-
case REPEATING_STRUCTURE_TEMPLATES.TIMELINE:
|
|
47
|
-
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 }), selectedActionContent, createEditViewContent] }));
|
|
48
|
-
break;
|
|
49
|
-
case REPEATING_STRUCTURE_TEMPLATES.MAP:
|
|
50
|
-
Toolbar = (_jsx(MapToolbar, { locationFieldId: mapFieldIds?.location, name: title, formControlProps: formControlProps, rows: rows, count: count, createNew: createNew, additionalActions: additionalActions }));
|
|
51
|
-
break;
|
|
52
|
-
default:
|
|
53
|
-
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 }), selectedActionContent, createEditViewContent] }));
|
|
54
|
-
}
|
|
44
|
+
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] }));
|
|
55
45
|
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 }))] }));
|
|
56
46
|
}
|
|
57
47
|
AdvanceToolbar.propTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdvanceToolbar.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,6BAA6B,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"AdvanceToolbar.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAE/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,sBAAsB,MAAM,8BAA8B,CAAC;AAElE,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAC1C,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,SAAS,MAAM,mBAAmB,CAAC;AAC1C,OAAO,SAAS,MAAM,mBAAmB,CAAC;AAC1C,OAAO,kBAAkB,MAAM,4BAA4B,CAAC;AAC5D,OAAO,OAAO,MAAM,iBAAiB,CAAC;AACtC,OAAO,QAAQ,MAAM,2BAA2B,CAAC;AACjD,OAAO,OAAO,MAAM,yBAAyB,CAAC;AAC9C,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AACxC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AACpD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,mBAAmB,MAAM,6BAA6B,CAAC;AAC9D,OAAO,aAAa,MAAM,uBAAuB,CAAC;AAElD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,IAAI,EAAE;IAC7C,MAAM,EACJ,oBAAoB,EACpB,IAAI,EAAE,EACJ,SAAS,EACT,aAAa,EACb,KAAK,EACL,cAAc,EACd,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACZ,GAAG,EAAE,EACN,IAAI,EACJ,KAAK,EACL,UAAU,EACV,SAAS,EACT,SAAS,EACT,mBAAmB,EACnB,IAAI,EAAE,EAAE,YAAY,EAAE,EACtB,aAAa,EACd,GAAG,IAAI,CAAC;IACT,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IACxC,MAAM,EAAE,eAAe,EAAE,GAAG,cAAc,EAAE,IAAI,EAAE,CAAC;IACnD,MAAM,EAAE,YAAY,EAAE,qBAAqB,EAAE,GAAG,kBAAkB,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC7E,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IACnC,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IACnC,MAAM,KAAK,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IACjC,MAAM,IAAI,GAAG,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC/B,MAAM,EAAE,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,GAAG,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC/E,MAAM,iBAAiB,GAAG,aAAa,KAAK,eAAe,CAAC,KAAK,IAAI,oBAAoB,KAAK,CAAC,CAAC;IAChG,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,UAAU,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAEvC,MAAM,iBAAiB,GAAG,CACxB,8BACG,SAAS,IAAI,CACZ,KAAC,cAAc,IACb,cAAc,EAAE,cAAc,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,GAC9E,CACH,EACA,gBAAgB,IAAI,QAAQ,KAAK,6BAA6B,CAAC,QAAQ,IAAI,CAC1E,KAAC,WAAW,IAAC,iBAAiB,EAAE,iBAAiB,EAAE,IAAI,EAAE,IAAI,GAAI,CAClE,IACA,CACJ,CAAC;IAEF,MAAM,eAAe,GAAG,cAAc,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC;IACpF,MAAM,SAAS,GACb,eAAe,IAAI,SAAS;QAC1B,CAAC,CAAC;YACE,KAAK,EAAE,eAAe,EAAE,IAAI;YAC5B,OAAO,EAAE,eAAe,CAAC,OAAO;SACjC;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,OAAO,GACX,QAAQ,KAAK,6BAA6B,CAAC,GAAG,CAAC,CAAC,CAAC,CAC/C,KAAC,UAAU,IACT,eAAe,EAAE,WAAW,EAAE,QAAQ,EACtC,IAAI,EAAE,KAAK,EACX,gBAAgB,EAAE,gBAAgB,EAClC,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,iBAAiB,EAAE,iBAAiB,GACpC,CACH,CAAC,CAAC,CAAC,CACF,8BACE,KAAC,WAAW,IACV,IAAI,EAAE,KAAK,EACX,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,YAAY,EAC1B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,sBAAsB,CAAC,QAAQ,EAAE,OAAO,CAAC,IAAI,KAAK,EACzD,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,sBAAsB,CAAC,QAAQ,EAAE,MAAM,CAAC,IAAI,UAAU,GAC5D,EACD,qBAAqB,EACrB,qBAAqB,IACrB,CACJ,CAAC;IAEJ,OAAO,CACL,MAAC,iBAAiB,IAChB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,aAAa,aAE5B,KAAC,eAAe,IAAC,OAAO,EAAE,eAAe,YACtC,OAAO,GAEQ,EACjB,mBAAmB,IAAI,CACtB,KAAC,aAAa,IAAC,mBAAmB,EAAE,mBAAmB,EAAE,YAAY,EAAE,YAAY,GAAI,CACxF,IACiB,CACrB,CAAC;AACJ,CAAC;AAED,cAAc,CAAC,SAAS,GAAG;IACzB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACnD,CAAC","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"]}
|
|
@@ -6,6 +6,7 @@ declare namespace FieldSelector {
|
|
|
6
6
|
let columns: PropTypes.Validator<any[]>;
|
|
7
7
|
let onChange: PropTypes.Validator<(...args: any[]) => any>;
|
|
8
8
|
let disabled: PropTypes.Requireable<boolean>;
|
|
9
|
+
let readOnly: PropTypes.Requireable<boolean>;
|
|
9
10
|
let fieldProp: PropTypes.Requireable<string>;
|
|
10
11
|
let label: PropTypes.Validator<string>;
|
|
11
12
|
let labelHidden: PropTypes.Requireable<boolean>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":";AASA,
|
|
1
|
+
{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":";AASA,oFAiEC;;;;;;;;;;;;;sBAzEqB,YAAY"}
|
|
@@ -5,7 +5,7 @@ import { ComboBox, menuHelpers } from '@pega/cosmos-react-core';
|
|
|
5
5
|
import useTranslate from '../../Hooks/useTranslate';
|
|
6
6
|
import getMenuItemsFromColumns from './utils/utils';
|
|
7
7
|
function FieldSelector(props) {
|
|
8
|
-
const { value, onChange, columns, disabled = false, fieldProp, label, labelHidden } = props;
|
|
8
|
+
const { value, onChange, columns, disabled = false, readOnly, fieldProp, label, labelHidden } = props;
|
|
9
9
|
const [translate] = useTranslate();
|
|
10
10
|
const items = useMemo(() => getMenuItemsFromColumns(columns, fieldProp, value), [columns, value, fieldProp]);
|
|
11
11
|
const selected = useMemo(() => {
|
|
@@ -25,7 +25,7 @@ function FieldSelector(props) {
|
|
|
25
25
|
? menuHelpers.flatten(items).filter(({ primary }) => filterRegex.test(primary))
|
|
26
26
|
: items;
|
|
27
27
|
}, [filterRegex, items]);
|
|
28
|
-
return (_jsx(ComboBox, { label: label, labelHidden: labelHidden, disabled: disabled, placeholder: translate('Select field'), mode: 'single-select', value: filterValue, testId: 'FieldSelector', onChange: ev => {
|
|
28
|
+
return (_jsx(ComboBox, { label: label, labelHidden: labelHidden, disabled: disabled, readOnly: readOnly, placeholder: translate('Select field'), mode: 'single-select', value: filterValue, testId: 'FieldSelector', onChange: ev => {
|
|
29
29
|
setFilterValue(ev.target.value);
|
|
30
30
|
}, selected: { items: selected }, menu: {
|
|
31
31
|
items: filteredItems,
|
|
@@ -45,6 +45,7 @@ FieldSelector.propTypes = {
|
|
|
45
45
|
columns: PropTypes.arrayOf(PropTypes.any).isRequired,
|
|
46
46
|
onChange: PropTypes.func.isRequired,
|
|
47
47
|
disabled: PropTypes.bool,
|
|
48
|
+
readOnly: PropTypes.bool,
|
|
48
49
|
fieldProp: PropTypes.string,
|
|
49
50
|
label: PropTypes.string.isRequired,
|
|
50
51
|
labelHidden: PropTypes.bool
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEhE,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,uBAAuB,MAAM,eAAe,CAAC;AAEpD,SAAS,aAAa,CAAC,KAAK;IAC1B,MAAM,
|
|
1
|
+
{"version":3,"file":"FieldSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/FieldSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { ComboBox, menuHelpers } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport getMenuItemsFromColumns from './utils/utils';\n\nfunction FieldSelector(props) {\n const {\n value,\n onChange,\n columns,\n disabled = false,\n readOnly,\n fieldProp,\n label,\n labelHidden\n } = props;\n const [translate] = useTranslate();\n\n const items = useMemo(\n () => getMenuItemsFromColumns(columns, fieldProp, value),\n [columns, value, fieldProp]\n );\n const selected = useMemo(() => {\n const selectedItem = menuHelpers.getItem(items, value);\n return selectedItem ? { id: selectedItem.id, text: selectedItem.primary } : undefined;\n }, [items, value]);\n\n const [filterValue, setFilterValue] = useState(undefined); // NOTE: `undefined` is needed to show the current selection\n const filterRegex = useMemo(() => {\n // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions#Escaping\n // Literal string match from input, not user regex input.\n return filterValue\n ? new RegExp(filterValue.replace(/[.*+\\-?^${}()|[\\]\\\\]/g, '\\\\$&'), 'i')\n : undefined;\n }, [filterValue]);\n\n const filteredItems = useMemo(() => {\n return filterRegex\n ? menuHelpers.flatten(items).filter(({ primary }) => filterRegex.test(primary))\n : items;\n }, [filterRegex, items]);\n\n return (\n <ComboBox\n label={label}\n labelHidden={labelHidden}\n disabled={disabled}\n readOnly={readOnly}\n placeholder={translate('Select field')}\n mode='single-select'\n value={filterValue}\n testId='FieldSelector'\n onChange={ev => {\n setFilterValue(ev.target.value);\n }}\n selected={{ items: selected }}\n menu={{\n items: filteredItems,\n mode: 'single-select',\n accent: filterRegex,\n emptyText: 'No items',\n onItemClick: id => {\n if (disabled) return;\n onChange(id);\n setFilterValue(undefined); // To show the selected value in the input\n }\n }}\n onDropdownButtonClick={() => {}}\n />\n );\n}\n\nFieldSelector.propTypes = {\n value: PropTypes.string,\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n onChange: PropTypes.func.isRequired,\n disabled: PropTypes.bool,\n readOnly: PropTypes.bool,\n fieldProp: PropTypes.string,\n label: PropTypes.string.isRequired,\n labelHidden: PropTypes.bool\n};\n\nexport default FieldSelector;\n"]}
|
|
@@ -13,10 +13,4 @@ export interface GroupingOptions {
|
|
|
13
13
|
datetime: (DateFunction | undefined)[];
|
|
14
14
|
};
|
|
15
15
|
}
|
|
16
|
-
/** Option object in the DateFunctionSelector component */
|
|
17
|
-
export interface DateSelectorOption {
|
|
18
|
-
key: DateFunction | 'NONE';
|
|
19
|
-
dateFunction: DateFunction | undefined;
|
|
20
|
-
label: string;
|
|
21
|
-
}
|
|
22
16
|
//# sourceMappingURL=Grouping.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grouping.types.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/Grouping.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iFAAiF,CAAC;AAEpH,8HAA8H;AAC9H,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B,SAAS,EAAE;QACT,CAAC,QAAQ,EAAE,MAAM,GAAG;YAClB,SAAS,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;YACxC,SAAS,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;SACzC,CAAC;KACH,CAAC;IACF,iBAAiB,EAAE;QACjB,IAAI,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;QACnC,QAAQ,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;KACxC,CAAC;CACH
|
|
1
|
+
{"version":3,"file":"Grouping.types.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/Grouping.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iFAAiF,CAAC;AAEpH,8HAA8H;AAC9H,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B,SAAS,EAAE;QACT,CAAC,QAAQ,EAAE,MAAM,GAAG;YAClB,SAAS,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;YACxC,SAAS,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;SACzC,CAAC;KACH,CAAC;IACF,iBAAiB,EAAE;QACjB,IAAI,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;QACnC,QAAQ,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;KACxC,CAAC;CACH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grouping.types.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/Grouping.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { DateFunction } from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/core/types';\n\n/** Metadata used to identify which fields and which date functions are/aren't available for selection in the Grouping menu */\nexport interface GroupingOptions {\n exhaustedFields: Set<string>;\n dateFuncs: {\n [columnId: string]: {\n exhausted: (DateFunction | undefined)[];\n available: (DateFunction | undefined)[];\n };\n };\n dateGroupVariants: {\n date: (DateFunction | undefined)[];\n datetime: (DateFunction | undefined)[];\n };\n}\n
|
|
1
|
+
{"version":3,"file":"Grouping.types.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/Grouping.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { DateFunction } from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/core/types';\n\n/** Metadata used to identify which fields and which date functions are/aren't available for selection in the Grouping menu */\nexport interface GroupingOptions {\n exhaustedFields: Set<string>;\n dateFuncs: {\n [columnId: string]: {\n exhausted: (DateFunction | undefined)[];\n available: (DateFunction | undefined)[];\n };\n };\n dateGroupVariants: {\n date: (DateFunction | undefined)[];\n datetime: (DateFunction | undefined)[];\n };\n}\n"]}
|
|
@@ -1,20 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
let groupingOptions: PropTypes.Validator<{
|
|
13
|
-
[x: string]: any;
|
|
14
|
-
}>;
|
|
15
|
-
let columns: PropTypes.Validator<any[]>;
|
|
16
|
-
let onChange: PropTypes.Validator<(...args: any[]) => any>;
|
|
17
|
-
}
|
|
1
|
+
import type { Group } from 'pega-repeating-structures-core/lib/types/State.types';
|
|
2
|
+
import type { RsCoreTypes } from 'pega-repeating-structures-core';
|
|
3
|
+
import type { GroupingOptions } from '../../Grouping.types';
|
|
4
|
+
import type { AppliedGroup } from './useGroup';
|
|
5
|
+
interface DateFunctionSelectorProps {
|
|
6
|
+
template: RsCoreTypes.Meta['template'];
|
|
7
|
+
group: AppliedGroup;
|
|
8
|
+
groupingOptions: GroupingOptions;
|
|
9
|
+
dateFunctions: RsCoreTypes.Meta['dateFunctions'];
|
|
10
|
+
columns: RsCoreTypes.Column[];
|
|
11
|
+
onChange: (newFunc: Group['dateFunction']) => void;
|
|
18
12
|
}
|
|
19
|
-
|
|
13
|
+
/** Renders a Date-function selector in a grouping row if applicable */
|
|
14
|
+
declare const DateFunctionSelector: ({ template, group, groupingOptions, dateFunctions, columns, onChange }: DateFunctionSelectorProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
15
|
+
export default DateFunctionSelector;
|
|
20
16
|
//# sourceMappingURL=DateFunctionSelector.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateFunctionSelector.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.
|
|
1
|
+
{"version":3,"file":"DateFunctionSelector.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sDAAsD,CAAC;AAOlF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAGlE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAS/C,UAAU,yBAAyB;IACjC,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACvC,KAAK,EAAE,YAAY,CAAC;IACpB,eAAe,EAAE,eAAe,CAAC;IACjC,aAAa,EAAE,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACjD,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IAC9B,QAAQ,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,uEAAuE;AACvE,QAAA,MAAM,oBAAoB,GAAI,wEAO3B,yBAAyB,mDAmE3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
|
|
@@ -1,26 +1,24 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
3
|
import styled from 'styled-components';
|
|
5
4
|
import { Option, Select } from '@pega/cosmos-react-core';
|
|
6
|
-
import { dateFunctionLabels, FieldType } from 'pega-repeating-structures-core';
|
|
5
|
+
import { dateFunctionLabels, FieldType, REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
|
|
7
6
|
import useTranslate from '../../../../Hooks/useTranslate';
|
|
8
7
|
import { getFieldType } from './utils';
|
|
9
8
|
const StyledDateFuncWrapper = styled.div `
|
|
10
9
|
width: 9rem;
|
|
11
10
|
`;
|
|
11
|
+
const timelineAllowedDateFunctions = ['YEARS', 'QUARTERS', 'MONTHS', 'DAYS'];
|
|
12
12
|
/** Renders a Date-function selector in a grouping row if applicable */
|
|
13
|
-
const DateFunctionSelector =
|
|
14
|
-
const { group, groupingOptions, dateFunctions, columns, onChange } = props;
|
|
13
|
+
const DateFunctionSelector = ({ template, group, groupingOptions, dateFunctions, columns, onChange }) => {
|
|
15
14
|
const [translate] = useTranslate();
|
|
16
15
|
const fieldType = getFieldType(group.columnId, columns);
|
|
17
16
|
/**
|
|
18
17
|
* Determine what all date functions (if any) can be used for the given fieldType
|
|
19
|
-
* @type { import("./Grouping.types").DateSelectorOption[] }
|
|
20
18
|
*/
|
|
21
19
|
const allOptions = useMemo(() => {
|
|
22
20
|
// If date functions are disabled or not applicable to the current field type
|
|
23
|
-
if (!dateFunctions || !
|
|
21
|
+
if (!dateFunctions || !(fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {
|
|
24
22
|
return [];
|
|
25
23
|
}
|
|
26
24
|
return [
|
|
@@ -43,15 +41,16 @@ const DateFunctionSelector = props => {
|
|
|
43
41
|
// NOTE: Doing it this way to preserve the order of options.
|
|
44
42
|
// If we instead appended `group.dateFunction` to `available`, the order or options will change on further selections.
|
|
45
43
|
const { available } = groupingOptions.dateFuncs[group.columnId];
|
|
46
|
-
const optionsToUse = allOptions.filter(o =>
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
44
|
+
const optionsToUse = allOptions.filter(o => {
|
|
45
|
+
if (template === REPEATING_STRUCTURE_TEMPLATES.TIMELINE &&
|
|
46
|
+
(!o.dateFunction || !timelineAllowedDateFunctions.includes(o.dateFunction))) {
|
|
47
|
+
return false;
|
|
48
|
+
}
|
|
49
|
+
return available.includes(o.dateFunction) || o.dateFunction === group.dateFunction;
|
|
50
|
+
});
|
|
51
|
+
return (_jsx(StyledDateFuncWrapper, { children: _jsx(Select, { label: 'Date function', labelHidden: true, "data-testid": 'GroupingDateFuncSelector', value: group.dateFunction || 'NONE', onChange: e => {
|
|
52
|
+
onChange(e.target.value === 'NONE' ? undefined : e.target.value);
|
|
53
|
+
}, children: optionsToUse.map(o => (_jsx(Option, { value: o.key, children: translate(o.label) }, o.key))) }) }));
|
|
55
54
|
};
|
|
56
55
|
export default DateFunctionSelector;
|
|
57
56
|
//# sourceMappingURL=DateFunctionSelector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateFunctionSelector.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.
|
|
1
|
+
{"version":3,"file":"DateFunctionSelector.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/DateFunctionSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\nimport styled from 'styled-components';\n\nimport type { Group } from 'pega-repeating-structures-core/lib/types/State.types';\nimport { Option, Select } from '@pega/cosmos-react-core';\nimport {\n dateFunctionLabels,\n FieldType,\n REPEATING_STRUCTURE_TEMPLATES\n} from 'pega-repeating-structures-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../../../Hooks/useTranslate';\nimport type { GroupingOptions } from '../../Grouping.types';\n\nimport type { AppliedGroup } from './useGroup';\nimport { getFieldType } from './utils';\n\nconst StyledDateFuncWrapper = styled.div`\n width: 9rem;\n`;\n\nconst timelineAllowedDateFunctions = ['YEARS', 'QUARTERS', 'MONTHS', 'DAYS'];\n\ninterface DateFunctionSelectorProps {\n template: RsCoreTypes.Meta['template'];\n group: AppliedGroup;\n groupingOptions: GroupingOptions;\n dateFunctions: RsCoreTypes.Meta['dateFunctions'];\n columns: RsCoreTypes.Column[];\n onChange: (newFunc: Group['dateFunction']) => void;\n}\n\n/** Renders a Date-function selector in a grouping row if applicable */\nconst DateFunctionSelector = ({\n template,\n group,\n groupingOptions,\n dateFunctions,\n columns,\n onChange\n}: DateFunctionSelectorProps) => {\n const [translate] = useTranslate();\n const fieldType = getFieldType(group.columnId, columns);\n\n /**\n * Determine what all date functions (if any) can be used for the given fieldType\n */\n const allOptions = useMemo(() => {\n // If date functions are disabled or not applicable to the current field type\n if (!dateFunctions || !(fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {\n return [];\n }\n\n return [\n // Date functions applicable for the given field type\n ...dateFunctions[fieldType === FieldType.DATE ? 'DATE_ONLY' : 'DATE_TIME'].map(f => ({\n key: f,\n dateFunction: f,\n label: translate(dateFunctionLabels[f])\n })),\n\n // Option for grouping directly by the field values\n // The key 'NONE' is needed to work with the Select component\n { key: 'NONE', dateFunction: undefined, label: 'Default' }\n ];\n }, [dateFunctions, fieldType, translate]);\n\n // Skip if no options are available\n // i.e. date functions are disabled or not applicable to current field type\n if (allOptions.length === 0) {\n return null;\n }\n\n // NOTE: Doing it this way to preserve the order of options.\n // If we instead appended `group.dateFunction` to `available`, the order or options will change on further selections.\n const { available } = groupingOptions.dateFuncs[group.columnId];\n const optionsToUse = allOptions.filter(o => {\n if (\n template === REPEATING_STRUCTURE_TEMPLATES.TIMELINE &&\n (!o.dateFunction || !timelineAllowedDateFunctions.includes(o.dateFunction))\n ) {\n return false;\n }\n return available.includes(o.dateFunction) || o.dateFunction === group.dateFunction;\n });\n\n return (\n <StyledDateFuncWrapper>\n <Select\n label='Date function'\n labelHidden\n data-testid='GroupingDateFuncSelector'\n value={group.dateFunction || 'NONE'} // Can't set up `undefined` as a value\n onChange={e => {\n onChange(\n e.target.value === 'NONE' ? undefined : (e.target.value as Group['dateFunction'])\n );\n }}\n >\n {optionsToUse.map(o => (\n <Option key={o.key} value={o.key}>\n {translate(o.label)}\n </Option>\n ))}\n </Select>\n </StyledDateFuncWrapper>\n );\n};\n\nexport default DateFunctionSelector;\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type { RsCoreTypes } from 'pega-repeating-structures-core';
|
|
2
2
|
import type { Group } from 'pega-repeating-structures-core/types/State.types';
|
|
3
3
|
import type { GroupingOptions } from '../../Grouping.types';
|
|
4
4
|
import type { AppliedGroup } from './useGroup';
|
|
@@ -10,7 +10,8 @@ interface GroupRendererProps {
|
|
|
10
10
|
})[]) => void;
|
|
11
11
|
columns: RsCoreTypes.Column[];
|
|
12
12
|
dateFunctions: RsCoreTypes.Meta['dateFunctions'];
|
|
13
|
+
template: RsCoreTypes.Meta['template'];
|
|
13
14
|
}
|
|
14
|
-
declare const GroupRenderer: ({ appliedGroups, groupingOptions, setGroups, columns, dateFunctions }: GroupRendererProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
declare const GroupRenderer: ({ appliedGroups, groupingOptions, setGroups, columns, dateFunctions, template }: GroupRendererProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
16
|
export default GroupRenderer;
|
|
16
17
|
//# sourceMappingURL=GroupRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAK9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAQ/C,UAAU,kBAAkB;IAC1B,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,GAAG;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IACxD,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IAC9B,aAAa,EAAE,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACjD,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;CACxC;AAED,QAAA,MAAM,aAAa,GAAI,iFAOpB,kBAAkB,4CA+LpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { createElement as _createElement } from "react";
|
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import { useCallback, useEffect, useRef } from 'react';
|
|
5
5
|
import { Button, createUID, Flex, Icon, useI18n } from '@pega/cosmos-react-core';
|
|
6
|
-
import { FieldType } from 'pega-repeating-structures-core';
|
|
6
|
+
import { FieldType, REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
|
|
7
7
|
import useRowFocus from '../useRowFocus';
|
|
8
8
|
import useDragDrop from '../../../../Hooks/useDragDrop';
|
|
9
9
|
import FieldSelector from '../../FieldSelector';
|
|
@@ -13,7 +13,7 @@ const DropSelector = '[data-drop]';
|
|
|
13
13
|
const StyledDragHandle = styled(Button) `
|
|
14
14
|
cursor: grab;
|
|
15
15
|
`;
|
|
16
|
-
const GroupRenderer = ({ appliedGroups, groupingOptions, setGroups, columns, dateFunctions }) => {
|
|
16
|
+
const GroupRenderer = ({ appliedGroups, groupingOptions, setGroups, columns, dateFunctions, template }) => {
|
|
17
17
|
const t = useI18n();
|
|
18
18
|
const { focusRowRef, focusRowId, setFocusRowId } = useRowFocus();
|
|
19
19
|
const dragDropRef = useRef(null);
|
|
@@ -103,11 +103,11 @@ const GroupRenderer = ({ appliedGroups, groupingOptions, setGroups, columns, dat
|
|
|
103
103
|
itemGap: 0.5
|
|
104
104
|
}, children: [_jsx(StyledDragHandle, { forwardedAs: 'div', role: 'button', icon: true, variant: 'simple', compact: true, ...dragProps, children: _jsx(Icon, { name: 'drag' }) }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { label: t('field'), labelHidden: true, columns: columns?.filter(c => c.field.grouping &&
|
|
105
105
|
(c.field.id.toString() === group.columnId.toString() ||
|
|
106
|
-
!groupingOptions.exhaustedFields.has(c.field.id))), value: group.columnId, disabled: !!group.customFunction, onChange: (newID) => handleColumnChange(group, index, newID), fieldProp: 'id' }) }), _jsx(DateFunctionSelector, { group: group, groupingOptions: groupingOptions, dateFunctions: dateFunctions, columns: columns, onChange: (newFunc) => handleDateFuncChange(group, index, newFunc) })] }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeGroup(index), label: t('delete_group'), children: _jsx(Icon, { name: 'trash' }) })] })))) }), _jsx("div", { children: _jsx(Button, { variant: 'link', "aria-label": t('add_group'), onClick: addRow, children: _jsxs(Flex, { container: {
|
|
106
|
+
!groupingOptions.exhaustedFields.has(c.field.id))), value: group.columnId, disabled: !!group.customFunction, onChange: (newID) => handleColumnChange(group, index, newID), fieldProp: 'id' }) }), _jsx(DateFunctionSelector, { template: template, group: group, groupingOptions: groupingOptions, dateFunctions: dateFunctions, columns: columns, onChange: (newFunc) => handleDateFuncChange(group, index, newFunc) })] }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeGroup(index), label: t('delete_group'), children: _jsx(Icon, { name: 'trash' }) })] })))) }), template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (_jsx("div", { children: _jsx(Button, { variant: 'link', "aria-label": t('add_group'), onClick: addRow, children: _jsxs(Flex, { container: {
|
|
107
107
|
inline: true,
|
|
108
108
|
alignItems: 'start',
|
|
109
109
|
gap: 1
|
|
110
|
-
}, as: 'span', children: [_jsx(Icon, { name: 'plus' }), _jsx("span", { children: t('add') })] }) }) })] }, 'grouping'));
|
|
110
|
+
}, as: 'span', children: [_jsx(Icon, { name: 'plus' }), _jsx("span", { children: t('add') })] }) }) }))] }, 'grouping'));
|
|
111
111
|
};
|
|
112
112
|
export default GroupRenderer;
|
|
113
113
|
//# sourceMappingURL=GroupRenderer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupRenderer.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled from 'styled-components';\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { Button, createUID, Flex, Icon, useI18n } from '@pega/cosmos-react-core';\nimport { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport useRowFocus from '../useRowFocus';\nimport useDragDrop from '../../../../Hooks/useDragDrop';\nimport FieldSelector from '../../FieldSelector';\nimport type { GroupingOptions } from '../../Grouping.types';\n\nimport { getColumnById } from './utils';\nimport DateFunctionSelector from './DateFunctionSelector';\nimport type { AppliedGroup } from './useGroup';\n\nconst DropSelector = '[data-drop]';\n\nconst StyledDragHandle = styled(Button)`\n cursor: grab;\n`;\n\ninterface GroupRendererProps {\n appliedGroups: AppliedGroup[];\n groupingOptions: GroupingOptions;\n setGroups: (groups: (Group | { id: string })[]) => void;\n columns: RsCoreTypes.Column[];\n dateFunctions: RsCoreTypes.Meta['dateFunctions'];\n}\n\nconst GroupRenderer = ({\n appliedGroups,\n groupingOptions,\n setGroups,\n columns,\n dateFunctions\n}: GroupRendererProps) => {\n const t = useI18n();\n const { focusRowRef, focusRowId, setFocusRowId } = useRowFocus();\n\n const dragDropRef = useRef<HTMLDivElement>(null);\n const getAnimationSelector = useCallback((target: Element) => target.closest(DropSelector), []);\n const onDrop = useCallback(\n (dest: Element, src: Element) => {\n const dropIndex = Number(dest.getAttribute('data-index'));\n const dragIndex = Number(src.getAttribute('data-index'));\n if (dragIndex !== dropIndex) {\n const existingGroups = appliedGroups.map(v => ({ ...v }));\n const dragGroup = existingGroups.splice(dragIndex, 1)[0];\n existingGroups.splice(dropIndex, 0, dragGroup);\n setGroups(existingGroups);\n }\n },\n [appliedGroups, setGroups]\n );\n const { dragProps, dropProps } = useDragDrop({\n context: dragDropRef,\n getAnimationSelector,\n getGhostImageSelector: getAnimationSelector,\n getDraggedObject: getAnimationSelector,\n onDrop\n });\n\n const removeGroup = useCallback(\n (index: number) => {\n const existingGroups = appliedGroups.map(v => ({ ...v }));\n existingGroups.splice(index, 1);\n setGroups(existingGroups);\n\n if (existingGroups.length > 0)\n setFocusRowId(\n index === appliedGroups.length - 1\n ? existingGroups[index - 1].id\n : existingGroups[index].id\n );\n },\n [appliedGroups, setGroups, setFocusRowId]\n );\n\n const handleColumnChange = useCallback(\n (group: Group, index: number, newID: string) => {\n if (newID === group.columnId) return; // Ignore re-selecting the same\n const groupedColumn = getColumnById(newID, columns);\n const updatedGroup: Group = {\n ...group,\n columnId: newID,\n dateFunction: undefined, // Reset for non-date/time fields,\n order: groupedColumn?.sortOrder || 'asc' // Set sort order from column else default to 'asc'\n };\n\n // For date/datetime field, pick a date function by default (if enabled)\n const fieldType = groupedColumn?.field.type;\n if (dateFunctions && (fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {\n updatedGroup.dateFunction = groupingOptions.dateFuncs[newID]\n ? groupingOptions.dateFuncs[newID].available[0] // If the field is already picked before\n : groupingOptions.dateGroupVariants[fieldType][0]; // When picking the field for the first time\n }\n\n setGroups([\n ...appliedGroups.slice(0, index),\n updatedGroup,\n ...appliedGroups.slice(index + 1)\n ]);\n },\n [appliedGroups, groupingOptions, setGroups, dateFunctions, columns]\n );\n\n const handleDateFuncChange = useCallback(\n (group: Group, index: number, newFunc: Group['dateFunction']) => {\n if (newFunc === group.dateFunction) return; // Ignore re-selecting the same\n const updatedGroup = { ...group, dateFunction: newFunc };\n setGroups([\n ...appliedGroups.slice(0, index),\n updatedGroup,\n ...appliedGroups.slice(index + 1)\n ]);\n },\n [setGroups, appliedGroups]\n );\n\n const addRow = useCallback(() => {\n const newRow = { id: createUID(), columnId: '', order: 'asc' };\n const existingGroups = [...appliedGroups, newRow];\n setGroups(existingGroups);\n setFocusRowId(newRow.id);\n }, [appliedGroups, setGroups, setFocusRowId]);\n\n useEffect(() => {\n if (!appliedGroups.length) {\n addRow();\n }\n }, [appliedGroups, addRow]);\n\n return (\n <Flex container={{ direction: 'column', gap: 2 }} key='grouping'>\n <Flex container={{ direction: 'column', gap: 1 }} className='group-content' ref={dragDropRef}>\n {appliedGroups.map((group, index) => (\n <div {...dropProps} data-index={index} key={group.id}>\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n ref={appliedGroups[index].id === focusRowId ? focusRowRef : null}\n >\n <Flex item={{ grow: 1 }}>\n <Flex\n container={{\n justify: 'start',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n >\n <StyledDragHandle\n forwardedAs='div'\n role='button'\n icon\n variant='simple'\n compact\n {...dragProps}\n >\n <Icon name='drag' />\n </StyledDragHandle>\n <Flex item={{ grow: 1 }}>\n <FieldSelector\n label={t('field')}\n labelHidden\n columns={columns?.filter(\n c =>\n c.field.grouping &&\n (c.field.id.toString() === group.columnId.toString() ||\n !groupingOptions.exhaustedFields.has(c.field.id))\n )}\n value={group.columnId}\n disabled={!!group.customFunction}\n onChange={(newID: string) => handleColumnChange(group, index, newID)}\n fieldProp='id'\n />\n </Flex>\n <DateFunctionSelector\n group={group}\n groupingOptions={groupingOptions}\n dateFunctions={dateFunctions}\n columns={columns}\n onChange={(newFunc: Group['dateFunction']) =>\n handleDateFuncChange(group, index, newFunc)\n }\n />\n </Flex>\n </Flex>\n <Button\n icon\n variant='simple'\n onClick={() => removeGroup(index)}\n label={t('delete_group')}\n >\n <Icon name='trash' />\n </Button>\n </Flex>\n </div>\n ))}\n </Flex>\n <div>\n <Button variant='link' aria-label={t('add_group')} onClick={addRow}>\n <Flex\n container={{\n inline: true,\n alignItems: 'start',\n gap: 1\n }}\n as='span'\n >\n <Icon name='plus' />\n <span>{t('add')}</span>\n </Flex>\n </Button>\n </div>\n </Flex>\n );\n};\n\nexport default GroupRenderer;\n"]}
|
|
1
|
+
{"version":3,"file":"GroupRenderer.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":";;AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACjF,OAAO,EAAE,SAAS,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAI1F,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,WAAW,MAAM,+BAA+B,CAAC;AACxD,OAAO,aAAa,MAAM,qBAAqB,CAAC;AAGhD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;AAG1D,MAAM,YAAY,GAAG,aAAa,CAAC;AAEnC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;CAEtC,CAAC;AAWF,MAAM,aAAa,GAAG,CAAC,EACrB,aAAa,EACb,eAAe,EACf,SAAS,EACT,OAAO,EACP,aAAa,EACb,QAAQ,EACW,EAAE,EAAE;IACvB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,WAAW,EAAE,CAAC;IAEjE,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,oBAAoB,GAAG,WAAW,CAAC,CAAC,MAAe,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC,CAAC;IAChG,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,IAAa,EAAE,GAAY,EAAE,EAAE;QAC9B,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC,CAAC;QAC1D,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC,CAAC;QACzD,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC5B,MAAM,cAAc,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;YAC1D,MAAM,SAAS,GAAG,cAAc,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACzD,cAAc,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC;YAC/C,SAAS,CAAC,cAAc,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC,EACD,CAAC,aAAa,EAAE,SAAS,CAAC,CAC3B,CAAC;IACF,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,WAAW,CAAC;QAC3C,OAAO,EAAE,WAAW;QACpB,oBAAoB;QACpB,qBAAqB,EAAE,oBAAoB;QAC3C,gBAAgB,EAAE,oBAAoB;QACtC,MAAM;KACP,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAAa,EAAE,EAAE;QAChB,MAAM,cAAc,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;QAC1D,cAAc,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAChC,SAAS,CAAC,cAAc,CAAC,CAAC;QAE1B,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC;YAC3B,aAAa,CACX,KAAK,KAAK,aAAa,CAAC,MAAM,GAAG,CAAC;gBAChC,CAAC,CAAC,cAAc,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,EAAE;gBAC9B,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,EAAE,CAC7B,CAAC;IACN,CAAC,EACD,CAAC,aAAa,EAAE,SAAS,EAAE,aAAa,CAAC,CAC1C,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,KAAY,EAAE,KAAa,EAAE,KAAa,EAAE,EAAE;QAC7C,IAAI,KAAK,KAAK,KAAK,CAAC,QAAQ;YAAE,OAAO,CAAC,+BAA+B;QACrE,MAAM,aAAa,GAAG,aAAa,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QACpD,MAAM,YAAY,GAAU;YAC1B,GAAG,KAAK;YACR,QAAQ,EAAE,KAAK;YACf,YAAY,EAAE,SAAS,EAAE,kCAAkC;YAC3D,KAAK,EAAE,aAAa,EAAE,SAAS,IAAI,KAAK,CAAC,mDAAmD;SAC7F,CAAC;QAEF,wEAAwE;QACxE,MAAM,SAAS,GAAG,aAAa,EAAE,KAAK,CAAC,IAAI,CAAC;QAC5C,IAAI,aAAa,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC,IAAI,IAAI,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,EAAE,CAAC;YACzF,YAAY,CAAC,YAAY,GAAG,eAAe,CAAC,SAAS,CAAC,KAAK,CAAC;gBAC1D,CAAC,CAAC,eAAe,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,wCAAwC;gBACxF,CAAC,CAAC,eAAe,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,4CAA4C;QACnG,CAAC;QAED,SAAS,CAAC;YACR,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC;YAChC,YAAY;YACZ,GAAG,aAAa,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC;SAClC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,aAAa,EAAE,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,CAAC,CACpE,CAAC;IAEF,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,KAAY,EAAE,KAAa,EAAE,OAA8B,EAAE,EAAE;QAC9D,IAAI,OAAO,KAAK,KAAK,CAAC,YAAY;YAAE,OAAO,CAAC,+BAA+B;QAC3E,MAAM,YAAY,GAAG,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,CAAC;QACzD,SAAS,CAAC;YACR,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC;YAChC,YAAY;YACZ,GAAG,aAAa,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC;SAClC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,SAAS,EAAE,aAAa,CAAC,CAC3B,CAAC;IAEF,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,MAAM,MAAM,GAAG,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC;QAC/D,MAAM,cAAc,GAAG,CAAC,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC;QAClD,SAAS,CAAC,cAAc,CAAC,CAAC;QAC1B,aAAa,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC;IAE9C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;YAC1B,MAAM,EAAE,CAAC;QACX,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAE5B,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,SAAS,EAAC,eAAe,EAAC,GAAG,EAAE,WAAW,YACzF,aAAa,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CACnC,2BAAS,SAAS,gBAAc,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE;oBAClD,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,OAAO,EAAE,SAAS;4BAClB,UAAU,EAAE,QAAQ;4BACpB,SAAS,EAAE,KAAK;4BAChB,IAAI,EAAE,QAAQ;4BACd,OAAO,EAAE,GAAG;yBACb,EACD,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,aAEhE,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACrB,MAAC,IAAI,IACH,SAAS,EAAE;wCACT,OAAO,EAAE,OAAO;wCAChB,UAAU,EAAE,QAAQ;wCACpB,SAAS,EAAE,KAAK;wCAChB,IAAI,EAAE,QAAQ;wCACd,OAAO,EAAE,GAAG;qCACb,aAED,KAAC,gBAAgB,IACf,WAAW,EAAC,KAAK,EACjB,IAAI,EAAC,QAAQ,EACb,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,WACH,SAAS,YAEb,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACH,EACnB,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACrB,KAAC,aAAa,IACZ,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,EACjB,WAAW,QACX,OAAO,EAAE,OAAO,EAAE,MAAM,CACtB,CAAC,CAAC,EAAE,CACF,CAAC,CAAC,KAAK,CAAC,QAAQ;oDAChB,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,KAAK,CAAC,QAAQ,CAAC,QAAQ,EAAE;wDAClD,CAAC,eAAe,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CACtD,EACD,KAAK,EAAE,KAAK,CAAC,QAAQ,EACrB,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,cAAc,EAChC,QAAQ,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,kBAAkB,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EACpE,SAAS,EAAC,IAAI,GACd,GACG,EACP,KAAC,oBAAoB,IACnB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,OAA8B,EAAE,EAAE,CAC3C,oBAAoB,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,GAE7C,IACG,GACF,EACP,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACjC,KAAK,EAAE,CAAC,CAAC,cAAc,CAAC,YAExB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,IACJ,CACH,CACP,CAAC,GACG,EACN,QAAQ,KAAK,6BAA6B,CAAC,QAAQ,IAAI,CACtD,wBACE,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,gBAAa,CAAC,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,MAAM,YAChE,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,MAAM,EAAE,IAAI;4BACZ,UAAU,EAAE,OAAO;4BACnB,GAAG,EAAE,CAAC;yBACP,EACD,EAAE,EAAC,MAAM,aAET,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACpB,yBAAO,CAAC,CAAC,KAAK,CAAC,GAAQ,IAClB,GACA,GACL,CACP,KA1FmD,UAAU,CA2FzD,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { Button, createUID, Flex, Icon, useI18n } from '@pega/cosmos-react-core';\nimport { FieldType, REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport useRowFocus from '../useRowFocus';\nimport useDragDrop from '../../../../Hooks/useDragDrop';\nimport FieldSelector from '../../FieldSelector';\nimport type { GroupingOptions } from '../../Grouping.types';\n\nimport { getColumnById } from './utils';\nimport DateFunctionSelector from './DateFunctionSelector';\nimport type { AppliedGroup } from './useGroup';\n\nconst DropSelector = '[data-drop]';\n\nconst StyledDragHandle = styled(Button)`\n cursor: grab;\n`;\n\ninterface GroupRendererProps {\n appliedGroups: AppliedGroup[];\n groupingOptions: GroupingOptions;\n setGroups: (groups: (Group | { id: string })[]) => void;\n columns: RsCoreTypes.Column[];\n dateFunctions: RsCoreTypes.Meta['dateFunctions'];\n template: RsCoreTypes.Meta['template'];\n}\n\nconst GroupRenderer = ({\n appliedGroups,\n groupingOptions,\n setGroups,\n columns,\n dateFunctions,\n template\n}: GroupRendererProps) => {\n const t = useI18n();\n const { focusRowRef, focusRowId, setFocusRowId } = useRowFocus();\n\n const dragDropRef = useRef<HTMLDivElement>(null);\n const getAnimationSelector = useCallback((target: Element) => target.closest(DropSelector), []);\n const onDrop = useCallback(\n (dest: Element, src: Element) => {\n const dropIndex = Number(dest.getAttribute('data-index'));\n const dragIndex = Number(src.getAttribute('data-index'));\n if (dragIndex !== dropIndex) {\n const existingGroups = appliedGroups.map(v => ({ ...v }));\n const dragGroup = existingGroups.splice(dragIndex, 1)[0];\n existingGroups.splice(dropIndex, 0, dragGroup);\n setGroups(existingGroups);\n }\n },\n [appliedGroups, setGroups]\n );\n const { dragProps, dropProps } = useDragDrop({\n context: dragDropRef,\n getAnimationSelector,\n getGhostImageSelector: getAnimationSelector,\n getDraggedObject: getAnimationSelector,\n onDrop\n });\n\n const removeGroup = useCallback(\n (index: number) => {\n const existingGroups = appliedGroups.map(v => ({ ...v }));\n existingGroups.splice(index, 1);\n setGroups(existingGroups);\n\n if (existingGroups.length > 0)\n setFocusRowId(\n index === appliedGroups.length - 1\n ? existingGroups[index - 1].id\n : existingGroups[index].id\n );\n },\n [appliedGroups, setGroups, setFocusRowId]\n );\n\n const handleColumnChange = useCallback(\n (group: Group, index: number, newID: string) => {\n if (newID === group.columnId) return; // Ignore re-selecting the same\n const groupedColumn = getColumnById(newID, columns);\n const updatedGroup: Group = {\n ...group,\n columnId: newID,\n dateFunction: undefined, // Reset for non-date/time fields,\n order: groupedColumn?.sortOrder || 'asc' // Set sort order from column else default to 'asc'\n };\n\n // For date/datetime field, pick a date function by default (if enabled)\n const fieldType = groupedColumn?.field.type;\n if (dateFunctions && (fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {\n updatedGroup.dateFunction = groupingOptions.dateFuncs[newID]\n ? groupingOptions.dateFuncs[newID].available[0] // If the field is already picked before\n : groupingOptions.dateGroupVariants[fieldType][0]; // When picking the field for the first time\n }\n\n setGroups([\n ...appliedGroups.slice(0, index),\n updatedGroup,\n ...appliedGroups.slice(index + 1)\n ]);\n },\n [appliedGroups, groupingOptions, setGroups, dateFunctions, columns]\n );\n\n const handleDateFuncChange = useCallback(\n (group: Group, index: number, newFunc: Group['dateFunction']) => {\n if (newFunc === group.dateFunction) return; // Ignore re-selecting the same\n const updatedGroup = { ...group, dateFunction: newFunc };\n setGroups([\n ...appliedGroups.slice(0, index),\n updatedGroup,\n ...appliedGroups.slice(index + 1)\n ]);\n },\n [setGroups, appliedGroups]\n );\n\n const addRow = useCallback(() => {\n const newRow = { id: createUID(), columnId: '', order: 'asc' };\n const existingGroups = [...appliedGroups, newRow];\n setGroups(existingGroups);\n setFocusRowId(newRow.id);\n }, [appliedGroups, setGroups, setFocusRowId]);\n\n useEffect(() => {\n if (!appliedGroups.length) {\n addRow();\n }\n }, [appliedGroups, addRow]);\n\n return (\n <Flex container={{ direction: 'column', gap: 2 }} key='grouping'>\n <Flex container={{ direction: 'column', gap: 1 }} className='group-content' ref={dragDropRef}>\n {appliedGroups.map((group, index) => (\n <div {...dropProps} data-index={index} key={group.id}>\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n ref={appliedGroups[index].id === focusRowId ? focusRowRef : null}\n >\n <Flex item={{ grow: 1 }}>\n <Flex\n container={{\n justify: 'start',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n >\n <StyledDragHandle\n forwardedAs='div'\n role='button'\n icon\n variant='simple'\n compact\n {...dragProps}\n >\n <Icon name='drag' />\n </StyledDragHandle>\n <Flex item={{ grow: 1 }}>\n <FieldSelector\n label={t('field')}\n labelHidden\n columns={columns?.filter(\n c =>\n c.field.grouping &&\n (c.field.id.toString() === group.columnId.toString() ||\n !groupingOptions.exhaustedFields.has(c.field.id))\n )}\n value={group.columnId}\n disabled={!!group.customFunction}\n onChange={(newID: string) => handleColumnChange(group, index, newID)}\n fieldProp='id'\n />\n </Flex>\n <DateFunctionSelector\n template={template}\n group={group}\n groupingOptions={groupingOptions}\n dateFunctions={dateFunctions}\n columns={columns}\n onChange={(newFunc: Group['dateFunction']) =>\n handleDateFuncChange(group, index, newFunc)\n }\n />\n </Flex>\n </Flex>\n <Button\n icon\n variant='simple'\n onClick={() => removeGroup(index)}\n label={t('delete_group')}\n >\n <Icon name='trash' />\n </Button>\n </Flex>\n </div>\n ))}\n </Flex>\n {template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (\n <div>\n <Button variant='link' aria-label={t('add_group')} onClick={addRow}>\n <Flex\n container={{\n inline: true,\n alignItems: 'start',\n gap: 1\n }}\n as='span'\n >\n <Icon name='plus' />\n <span>{t('add')}</span>\n </Flex>\n </Button>\n </div>\n )}\n </Flex>\n );\n};\n\nexport default GroupRenderer;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGroup.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/useGroup.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGroup.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/useGroup.ts"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,gBAAgB,EAAe,MAAM,yBAAyB,CAAC;AACxF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAQ9E,MAAM,WAAW,YAAa,SAAQ,KAAK;IACzC,EAAE,EAAE,MAAM,CAAC;CACZ;AAKD,QAAA,MAAM,QAAQ,GAAI,UAAU;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,KAAG,gBAAgB,CAAC,OAAO,CA2FhF,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useCallback, useEffect, useState } from 'react';
|
|
2
|
+
import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
|
|
2
3
|
import { createUID, usePrevious } from '@pega/cosmos-react-core';
|
|
3
4
|
import { TOOLBAR_FEATURES } from '../../../../constants';
|
|
4
5
|
import { deepEqual } from '../../../../Utils';
|
|
@@ -6,7 +7,7 @@ import { getGroupingOptions } from './utils';
|
|
|
6
7
|
import GroupRenderer from './GroupRenderer';
|
|
7
8
|
const convertGroupsToAppliedGroups = (groups) => groups.map(group => ({ ...group, id: createUID() }));
|
|
8
9
|
const useGroup = ({ view }) => {
|
|
9
|
-
const { state: { groups = [] } = {}, meta: { grouping, dateFunctions }, type: { applyGrouping }, columns = [] } = view;
|
|
10
|
+
const { state: { groups = [] } = {}, meta: { grouping, dateFunctions, template }, type: { applyGrouping }, columns = [] } = view;
|
|
10
11
|
const displayGrouping = view.shouldDisplayFeature(TOOLBAR_FEATURES.GROUPING);
|
|
11
12
|
const [appliedGroups, setAppliedGroups] = useState([]);
|
|
12
13
|
const [groupingOptions, setGroupingOptions] = useState(() => getGroupingOptions(groups, columns, dateFunctions));
|
|
@@ -61,12 +62,14 @@ const useGroup = ({ view }) => {
|
|
|
61
62
|
setGroups(convertGroupsToAppliedGroups(groups));
|
|
62
63
|
}
|
|
63
64
|
}, [groups, prevGroups, setGroups, view.columns]);
|
|
64
|
-
if (!grouping ||
|
|
65
|
+
if (!grouping ||
|
|
66
|
+
(view.hierarchicalGroupEnabled && template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE) ||
|
|
67
|
+
!displayGrouping)
|
|
65
68
|
return;
|
|
66
69
|
return {
|
|
67
70
|
count: groups.length > 0 ? groups.length : undefined,
|
|
68
71
|
renderer: GroupRenderer,
|
|
69
|
-
rendererProps: { appliedGroups, columns, dateFunctions, groupingOptions, setGroups },
|
|
72
|
+
rendererProps: { appliedGroups, columns, dateFunctions, groupingOptions, setGroups, template },
|
|
70
73
|
onSubmit,
|
|
71
74
|
onCancel
|
|
72
75
|
};
|