@pega/lists-react 9.0.0-build.18.1 → 9.0.0-build.18.3

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.
@@ -1 +1 @@
1
- {"version":3,"file":"AggregateMenu.d.ts","sourceRoot":"","sources":["../../../Core/Components/AggregateMenu.jsx"],"names":[],"mappings":"AAkEA;;;mDAwDC;;;;;;;;;;;;;;;;;;AA3EM,kEALI,MAAM,GAAC,MAAM,mBACb,MAAM,UACN,OAAO,gCAAgC,EAAE,WAAW,CAAC,MAAM,GACzD,MAAM,GAAC,MAAM,CAmBzB;sBA/DqB,YAAY"}
1
+ {"version":3,"file":"AggregateMenu.d.ts","sourceRoot":"","sources":["../../../Core/Components/AggregateMenu.jsx"],"names":[],"mappings":"AAqEA;;;mDA2DC;;;;;;;;;;;;;;;;;;AA9EM,kEALI,MAAM,GAAC,MAAM,mBACb,MAAM,UACN,OAAO,gCAAgC,EAAE,WAAW,CAAC,MAAM,GACzD,MAAM,GAAC,MAAM,CAmBzB;sBAlEqB,YAAY"}
@@ -12,6 +12,9 @@ const StyledMenuButton = styled(MenuButton) `
12
12
  }
13
13
  `;
14
14
  const StyledCell = styled.div `
15
+ &:not(:has(${StyledMenuButton})) {
16
+ gap: 0.25rem;
17
+ }
15
18
  display: flex;
16
19
  text-align: right;
17
20
  justify-content: flex-end;
@@ -54,6 +57,7 @@ export default function AggregateMenu({ column, context }) {
54
57
  const { aggregationType } = column;
55
58
  const uid = createUID();
56
59
  const [translate] = useTranslate();
60
+ const isFooterAggregate = context.getExecutionContext?.()?.name === 'footer';
57
61
  const actions = aggregateOptions[column.field.type]?.map(label => ({
58
62
  primary: translate(label),
59
63
  id: label,
@@ -65,12 +69,12 @@ export default function AggregateMenu({ column, context }) {
65
69
  const rawAggregationValue = context.getValue();
66
70
  const aggregationValue = getFormattedAggregationValue(rawAggregationValue, aggregationType, column);
67
71
  const buttonText = translate('Aggregate options');
68
- return (_jsxs(StyledCell, { children: [_jsx("span", { children: translate(aggregationType) }), _jsx(StyledMenuButton, { className: 'aggregate-button', menu: {
72
+ return (_jsxs(StyledCell, { children: [_jsx("span", { children: translate(aggregationType) }), isFooterAggregate && (_jsx(StyledMenuButton, { className: 'aggregate-button', menu: {
69
73
  items: actions,
70
74
  mode: 'single-select'
71
75
  }, popover: {
72
76
  portal: true
73
- }, icon: 'arrow-micro-down', iconOnly: true, variant: 'simple', compact: true, text: buttonText, "aria-labelledby": `${uid}_label` }), _jsx(Flex, { container: true, as: StyledAggregationValue, item: { shrink: 0 }, "data-testid": TestIdConstants.aggregateDisplayValue, children: aggregationValue }), _jsx(VisuallyHiddenText, { id: `${uid}_label`, "aria-hidden": true, children: `${translate(aggregationType)} ${context.getValue()} ${buttonText}` })] }));
77
+ }, icon: 'arrow-micro-down', iconOnly: true, variant: 'simple', compact: true, text: buttonText, "aria-labelledby": `${uid}_label` })), _jsx(Flex, { container: true, as: StyledAggregationValue, item: { shrink: 0 }, "data-testid": TestIdConstants.aggregateDisplayValue, children: aggregationValue }), _jsx(VisuallyHiddenText, { id: `${uid}_label`, "aria-hidden": true, children: `${translate(aggregationType)} ${context.getValue()} ${buttonText}` })] }));
74
78
  }
75
79
  AggregateMenu.propTypes = {
76
80
  column: PropTypes.objectOf(PropTypes.any),
@@ -1 +1 @@
1
- {"version":3,"file":"AggregateMenu.js","sourceRoot":"","sources":["../../../Core/Components/AggregateMenu.jsx"],"names":[],"mappings":"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","sourcesContent":["import styled from 'styled-components';\nimport PropTypes from 'prop-types';\n\nimport {\n Flex,\n MenuButton,\n VisuallyHiddenText,\n createUID,\n formatNumber\n} from '@pega/cosmos-react-core';\n\nimport useTranslate from '../Hooks/useTranslate';\n\nimport TestIdConstants from './TestIdConstants';\n\nconst StyledMenuButton = styled(MenuButton)`\n color: ${props => props.theme.base.palette['foreground-color']};\n svg {\n width: 1.5rem;\n height: 1.5rem;\n }\n`;\n\nconst StyledCell = styled.div`\n display: flex;\n text-align: right;\n justify-content: flex-end;\n align-items: center;\n margin-inline-end: var(--cell-padding);\n\n &:hover {\n background-clip: padding-box;\n }\n`;\n\nconst StyledAggregationValue = styled.div`\n font-weight: ${props => props.theme.base['font-weight']['semi-bold']};\n`;\n\n/**\n * Formats the aggregation value based on the aggregation type and column context.\n *\n * @param {number|string} rawAggregationValue - The raw aggregation value to format.\n * @param {string} aggregationType - The type of aggregation (e.g., 'Avg').\n * @param {import('pega-repeating-structures-core').RsCoreTypes.Column} column - The column object.\n * @returns {string|number} The formatted aggregation value or the raw value if no formatter is available.\n */\nexport const getFormattedAggregationValue = (rawAggregationValue, aggregationType, column) => {\n const formatter = column.getContext().getFormatter();\n const fieldDef = column.getContext().getField();\n const { fieldType } = fieldDef;\n const { locale, timezone } = column.parent.meta;\n\n if (!formatter) return rawAggregationValue;\n\n if (aggregationType === 'Avg' && fieldType === 'Integer') {\n return formatNumber(Number(rawAggregationValue), {\n locale,\n useGrouping: true,\n maximumFractionDigits: 2\n });\n }\n\n return formatter(rawAggregationValue, { locale, timezone, fieldDef });\n};\n\nexport default function AggregateMenu({ column, context }) {\n const { aggregateOptions } = column.parent.meta;\n const { aggregationType } = column;\n const uid = createUID();\n const [translate] = useTranslate();\n\n const actions = aggregateOptions[column.field.type]?.map(label => ({\n primary: translate(label),\n id: label,\n onClick: () => column.applyAggregation(label),\n selected: aggregationType === label\n }));\n if (!actions) return null;\n\n const rawAggregationValue = context.getValue();\n\n const aggregationValue = getFormattedAggregationValue(\n rawAggregationValue,\n aggregationType,\n column\n );\n\n const buttonText = translate('Aggregate options');\n\n return (\n <StyledCell>\n <span>{translate(aggregationType)}</span>\n <StyledMenuButton\n className='aggregate-button'\n menu={{\n items: actions,\n mode: 'single-select'\n }}\n popover={{\n portal: true\n }}\n icon='arrow-micro-down'\n iconOnly\n variant='simple'\n compact\n text={buttonText} // Text property to display tooltip on hover\n aria-labelledby={`${uid}_label`}\n />\n <Flex\n container\n as={StyledAggregationValue}\n item={{ shrink: 0 }}\n data-testid={TestIdConstants.aggregateDisplayValue}\n >\n {aggregationValue}\n </Flex>\n <VisuallyHiddenText id={`${uid}_label`} aria-hidden>\n {`${translate(aggregationType)} ${context.getValue()} ${buttonText}`}\n </VisuallyHiddenText>\n </StyledCell>\n );\n}\n\nAggregateMenu.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n context: PropTypes.objectOf(PropTypes.any)\n};\n\nAggregateMenu.defaultProps = {\n column: {},\n context: {}\n};\n"]}
1
+ {"version":3,"file":"AggregateMenu.js","sourceRoot":"","sources":["../../../Core/Components/AggregateMenu.jsx"],"names":[],"mappings":"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","sourcesContent":["import styled from 'styled-components';\nimport PropTypes from 'prop-types';\n\nimport {\n Flex,\n MenuButton,\n VisuallyHiddenText,\n createUID,\n formatNumber\n} from '@pega/cosmos-react-core';\n\nimport useTranslate from '../Hooks/useTranslate';\n\nimport TestIdConstants from './TestIdConstants';\n\nconst StyledMenuButton = styled(MenuButton)`\n color: ${props => props.theme.base.palette['foreground-color']};\n svg {\n width: 1.5rem;\n height: 1.5rem;\n }\n`;\n\nconst StyledCell = styled.div`\n &:not(:has(${StyledMenuButton})) {\n gap: 0.25rem;\n }\n display: flex;\n text-align: right;\n justify-content: flex-end;\n align-items: center;\n margin-inline-end: var(--cell-padding);\n\n &:hover {\n background-clip: padding-box;\n }\n`;\n\nconst StyledAggregationValue = styled.div`\n font-weight: ${props => props.theme.base['font-weight']['semi-bold']};\n`;\n\n/**\n * Formats the aggregation value based on the aggregation type and column context.\n *\n * @param {number|string} rawAggregationValue - The raw aggregation value to format.\n * @param {string} aggregationType - The type of aggregation (e.g., 'Avg').\n * @param {import('pega-repeating-structures-core').RsCoreTypes.Column} column - The column object.\n * @returns {string|number} The formatted aggregation value or the raw value if no formatter is available.\n */\nexport const getFormattedAggregationValue = (rawAggregationValue, aggregationType, column) => {\n const formatter = column.getContext().getFormatter();\n const fieldDef = column.getContext().getField();\n const { fieldType } = fieldDef;\n const { locale, timezone } = column.parent.meta;\n\n if (!formatter) return rawAggregationValue;\n\n if (aggregationType === 'Avg' && fieldType === 'Integer') {\n return formatNumber(Number(rawAggregationValue), {\n locale,\n useGrouping: true,\n maximumFractionDigits: 2\n });\n }\n\n return formatter(rawAggregationValue, { locale, timezone, fieldDef });\n};\n\nexport default function AggregateMenu({ column, context }) {\n const { aggregateOptions } = column.parent.meta;\n const { aggregationType } = column;\n const uid = createUID();\n const [translate] = useTranslate();\n const isFooterAggregate = context.getExecutionContext?.()?.name === 'footer';\n\n const actions = aggregateOptions[column.field.type]?.map(label => ({\n primary: translate(label),\n id: label,\n onClick: () => column.applyAggregation(label),\n selected: aggregationType === label\n }));\n if (!actions) return null;\n\n const rawAggregationValue = context.getValue();\n\n const aggregationValue = getFormattedAggregationValue(\n rawAggregationValue,\n aggregationType,\n column\n );\n\n const buttonText = translate('Aggregate options');\n\n return (\n <StyledCell>\n <span>{translate(aggregationType)}</span>\n {isFooterAggregate && (\n <StyledMenuButton\n className='aggregate-button'\n menu={{\n items: actions,\n mode: 'single-select'\n }}\n popover={{\n portal: true\n }}\n icon='arrow-micro-down'\n iconOnly\n variant='simple'\n compact\n text={buttonText} // Text property to display tooltip on hover\n aria-labelledby={`${uid}_label`}\n />\n )}\n <Flex\n container\n as={StyledAggregationValue}\n item={{ shrink: 0 }}\n data-testid={TestIdConstants.aggregateDisplayValue}\n >\n {aggregationValue}\n </Flex>\n <VisuallyHiddenText id={`${uid}_label`} aria-hidden>\n {`${translate(aggregationType)} ${context.getValue()} ${buttonText}`}\n </VisuallyHiddenText>\n </StyledCell>\n );\n}\n\nAggregateMenu.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n context: PropTypes.objectOf(PropTypes.any)\n};\n\nAggregateMenu.defaultProps = {\n column: {},\n context: {}\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"FooterAggregators.d.ts","sourceRoot":"","sources":["../../../Core/Components/FooterAggregators.jsx"],"names":[],"mappings":";;AAaA;;mDAaC;;;;;;;;;;sBAzBqB,YAAY"}
1
+ {"version":3,"file":"FooterAggregators.d.ts","sourceRoot":"","sources":["../../../Core/Components/FooterAggregators.jsx"],"names":[],"mappings":";;AAUA;;mDAcC;;;;;;;;;;sBAvBqB,YAAY"}
@@ -5,16 +5,14 @@ import styled from 'styled-components';
5
5
  import AggregatorCell from './AggregatorCell';
6
6
  const StyledAggregatorWrapper = styled.div `
7
7
  border-bottom: 0;
8
- .aggregateCell {
9
- border-top: var(--border-style);
10
- }
11
8
  `;
12
9
  function FooterAggregators({ columns }) {
13
10
  if (columns.filter(c => c.aggregated).length === 0)
14
11
  return null;
15
12
  return (_jsx(StyledAggregatorWrapper, { className: 'row', children: columns.map(column => {
16
13
  const context = {
17
- getValue: () => column.aggregateValue
14
+ getValue: () => column.aggregateValue,
15
+ getExecutionContext: () => ({ name: 'footer' })
18
16
  };
19
17
  return _jsx(AggregatorCell, { column: column, context: context }, column.field?.id);
20
18
  }) }));
@@ -1 +1 @@
1
- {"version":3,"file":"FooterAggregators.js","sourceRoot":"","sources":["../../../Core/Components/FooterAggregators.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKzC,CAAC;AAEF,SAAS,iBAAiB,CAAC,EAAE,OAAO,EAAE;IACpC,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEhE,OAAO,CACL,KAAC,uBAAuB,IAAC,SAAS,EAAC,KAAK,YACrC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACpB,MAAM,OAAO,GAAG;gBACd,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,cAAc;aACtC,CAAC;YACF,OAAO,KAAC,cAAc,IAAwB,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,IAAlD,MAAM,CAAC,KAAK,EAAE,EAAE,CAAsC,CAAC;QACrF,CAAC,CAAC,GACsB,CAC3B,CAAC;AACJ,CAAC;AAED,iBAAiB,CAAC,SAAS,GAAG;IAC5B,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;CAC1C,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG;IAC/B,OAAO,EAAE,EAAE;CACZ,CAAC;AAEF,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC","sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nimport AggregatorCell from './AggregatorCell';\n\nconst StyledAggregatorWrapper = styled.div`\n border-bottom: 0;\n .aggregateCell {\n border-top: var(--border-style);\n }\n`;\n\nfunction FooterAggregators({ columns }) {\n if (columns.filter(c => c.aggregated).length === 0) return null;\n\n return (\n <StyledAggregatorWrapper className='row'>\n {columns.map(column => {\n const context = {\n getValue: () => column.aggregateValue\n };\n return <AggregatorCell key={column.field?.id} column={column} context={context} />;\n })}\n </StyledAggregatorWrapper>\n );\n}\n\nFooterAggregators.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any)\n};\n\nFooterAggregators.defaultProps = {\n columns: []\n};\n\nexport default memo(FooterAggregators);\n"]}
1
+ {"version":3,"file":"FooterAggregators.js","sourceRoot":"","sources":["../../../Core/Components/FooterAggregators.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEzC,CAAC;AAEF,SAAS,iBAAiB,CAAC,EAAE,OAAO,EAAE;IACpC,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEhE,OAAO,CACL,KAAC,uBAAuB,IAAC,SAAS,EAAC,KAAK,YACrC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACpB,MAAM,OAAO,GAAG;gBACd,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,cAAc;gBACrC,mBAAmB,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;aAChD,CAAC;YACF,OAAO,KAAC,cAAc,IAAwB,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,IAAlD,MAAM,CAAC,KAAK,EAAE,EAAE,CAAsC,CAAC;QACrF,CAAC,CAAC,GACsB,CAC3B,CAAC;AACJ,CAAC;AAED,iBAAiB,CAAC,SAAS,GAAG;IAC5B,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;CAC1C,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG;IAC/B,OAAO,EAAE,EAAE;CACZ,CAAC;AAEF,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC","sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nimport AggregatorCell from './AggregatorCell';\n\nconst StyledAggregatorWrapper = styled.div`\n border-bottom: 0;\n`;\n\nfunction FooterAggregators({ columns }) {\n if (columns.filter(c => c.aggregated).length === 0) return null;\n\n return (\n <StyledAggregatorWrapper className='row'>\n {columns.map(column => {\n const context = {\n getValue: () => column.aggregateValue,\n getExecutionContext: () => ({ name: 'footer' })\n };\n return <AggregatorCell key={column.field?.id} column={column} context={context} />;\n })}\n </StyledAggregatorWrapper>\n );\n}\n\nFooterAggregators.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any)\n};\n\nFooterAggregators.defaultProps = {\n columns: []\n};\n\nexport default memo(FooterAggregators);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"AAoNA;;;;;;QAwCC;AA2GD;;;mDA6IC;;;;;;;;;;sBApfqB,YAAY"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"AAoOA;;;;;;QAwCC;AA2GD;;;mDAiJC;;;;;;;;;;sBAxgBqB,YAAY"}
@@ -14,6 +14,24 @@ import DateValueDisplay from '../DateValueDisplay';
14
14
  import TestIdConstants from '../TestIdConstants';
15
15
  import GroupAdditionalInfo from './GroupAdditionalInfo';
16
16
  const groupheaderleftdisplacement = headerLevel => `${(headerLevel.level + 1) * 0.5}rem`;
17
+ const ColorBadge = styled.div `
18
+ position: sticky;
19
+ inset-inline-start: 0;
20
+ z-index: 10;
21
+
22
+ &::before {
23
+ content: '';
24
+ position: absolute;
25
+ inset-block-start: 0;
26
+ inset-inline-start: 0;
27
+ width: 0.25rem;
28
+ height: 100%;
29
+ background-color: ${props => props.colorIndicator};
30
+ border-top-left-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);
31
+ border-bottom-left-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);
32
+ z-index: 12;
33
+ }
34
+ `;
17
35
  /**
18
36
  * TODO: remove currentColor style after cosmos fixes the issue
19
37
  * Cosmos yet to handle dark theme on BareButton
@@ -22,9 +40,7 @@ const StyledGroupHeader = styled.div `
22
40
  --group-left: ${props => groupheaderleftdisplacement(props.groupHeader)};
23
41
  --group-bg-color: ${props => props.theme.base.palette['secondary-background']};
24
42
  background-color: var(--group-bg-color);
25
- &:has(button[aria-expanded='true']) {
26
- filter: ${props => props.theme.base.shadow['low-filter']};
27
- }
43
+ filter: ${props => props.theme.base.shadow['low-filter']};
28
44
 
29
45
  &.row.sticky-group-header {
30
46
  position: sticky;
@@ -60,7 +76,6 @@ const StyledGroupHeader = styled.div `
60
76
 
61
77
  &.row.group-header-row {
62
78
  height: auto;
63
- border-bottom: ${props => (!props.isAggregationApplied ? 'var(--border-style)' : 'none')};
64
79
 
65
80
  .group-header-aggregation-row {
66
81
  display: flex;
@@ -70,6 +85,33 @@ const StyledGroupHeader = styled.div `
70
85
  }
71
86
  }
72
87
 
88
+ /* consider three group-header-rows stacked vertically, the first and second group headers have RULE 2 AND RULE 3 applied, the third group-header has only RULE 3 applied */
89
+ &.group-header-row {
90
+ /* RULE 1- if there are no adjacent group-headers, apply border-radius to all corners */
91
+ border-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);
92
+
93
+ /* RULE-2- if there is an adjacent group-header below, remove bottom border-radius */
94
+
95
+ &:has(+ .group-header-row) {
96
+ border-radius: 0;
97
+
98
+ & ${ColorBadge}::before {
99
+ border-radius: 0;
100
+ }
101
+ }
102
+
103
+ /*RULE 3- if there is an adjacent group-header, go to the adjacent group header and remove top border-radius */
104
+ &:has(+ .group-header-row) + .group-header-row {
105
+ border-top-left-radius: 0;
106
+ border-top-right-radius: 0;
107
+
108
+ & ${ColorBadge}::before {
109
+ border-top-left-radius: 0;
110
+ border-top-right-radius: 0;
111
+ }
112
+ }
113
+ }
114
+
73
115
  &.group-header-row .stickyGroupHeader {
74
116
  position: sticky;
75
117
  left: 0;
@@ -109,17 +151,6 @@ const StyledGroupHeader = styled.div `
109
151
  button:focus {
110
152
  box-shadow: ${({ theme }) => theme.base.shadow['focus-inset']};
111
153
  }
112
-
113
- &::before {
114
- content: '';
115
- position: absolute;
116
- inset-block-start: 0;
117
- inset-inline-start: 0;
118
- width: 0.25rem;
119
- height: 100%;
120
- background-color: ${props => props.groupHeader.colorIndicator};
121
- z-index: 12;
122
- }
123
154
  }
124
155
  .group-header.cell {
125
156
  left: 0;
@@ -140,22 +171,6 @@ const StyledMetaList = styled(MetaList) `
140
171
  const GroupAdditionalInfoSeparator = styled.span `
141
172
  margin-inline-start: 0.3rem;
142
173
  `;
143
- const ColorBadge = styled.div `
144
- position: sticky;
145
- inset-inline-start: 0;
146
- z-index: 10;
147
-
148
- &::before {
149
- content: '';
150
- position: absolute;
151
- inset-block-start: 0;
152
- inset-inline-start: 0;
153
- width: 0.25rem;
154
- height: 100%;
155
- background-color: ${props => props.colorIndicator};
156
- z-index: 12;
157
- }
158
- `;
159
174
  /**
160
175
  * Generates unique ARIA label IDs for accessibility.
161
176
  * - groupLabelId: for the group label (e.g., "Status:")
@@ -294,29 +309,29 @@ export default function GroupHeader({ groupHeader, columns }) {
294
309
  }, []);
295
310
  }
296
311
  // FIXME: Import rather than COPY, i would rather
297
- return (_jsxs(StyledGroupHeader, { groupHeader: groupHeader, className: cx('row group-header-row sticky-group-header'), "data-test-id": 'groupHeader', "data-testid": `${TestIdConstants.groupHeader}-${groupHeader.label}-${groupHeader.name}`, isAggregationApplied: isAggregationApplied, role: 'row', onFocus: e => {
312
+ return (_jsx(StyledGroupHeader, { groupHeader: groupHeader, className: cx('row group-header-row sticky-group-header'), "data-test-id": 'groupHeader', "data-testid": `${TestIdConstants.groupHeader}-${groupHeader.label}-${groupHeader.name}`, isAggregationApplied: isAggregationApplied, role: 'row', onFocus: e => {
298
313
  if (buttonRef.current && !e.currentTarget.contains(e.relatedTarget)) {
299
314
  e.preventDefault();
300
315
  buttonRef.current.focus();
301
316
  }
302
- }, children: [_jsxs("div", { className: 'stickyGroupHeader', children: [_jsxs(BareButton, { ref: buttonRef, "aria-labelledby": [groupLabelId, groupNameId, ...additionalInfoIds].join(' '), "aria-expanded": !!groupHeader.isExpanded, style: {
303
- paddingRight: 'var(--group-left)'
304
- }, onClick: () => toggleGroup(), onKeyDown: event => {
305
- if (event.key === 'Enter') {
306
- // Prevent capturing of group header toggle click to its child renderers.
307
- event.preventDefault();
308
- event.stopPropagation();
309
- toggleGroup();
310
- }
311
- }, tabIndex: -1, icon: true, children: [groupHeader.count > 0 &&
312
- (groupHeader.isExpanded ? _jsx(Icon, { name: 'caret-down' }) : _jsx(Icon, { name: 'caret-right' })), _jsxs("div", { className: 'group-wrapper', children: [_jsx(GroupHeaderLabel, { column: column, groupHeader: groupHeader }), groupAdditionalInfo && (_jsxs(_Fragment, { children: [_jsx(Text, { variant: 'secondary', as: GroupAdditionalInfoSeparator, children: "\u2022" }), _jsx(StyledMetaList, { wrapItems: false, items: groupAdditionalInfo })] }))] })] }), buttonRef.current && (_jsx(GroupHeaderToolTip, { target: buttonRef.current, column: column, groupHeader: groupHeader, columns: columns, additionalFields: additionalFields }))] }), _jsxs("div", { className: 'group-header-aggregation-row', children: [_jsx(ColorBadge, { colorIndicator: groupHeader.colorIndicator }), columns.map(c => {
313
- const cxt = {
314
- getValue: () => groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]
315
- };
316
- return (_jsx(AggregatorCell, { column: c, context: cxt, className: cx('cell', {
317
- 'cell-fixed': column.frozen
318
- }) }, c.field.id));
319
- })] })] }));
317
+ }, children: _jsxs(Flex, { container: true, children: [_jsx(ColorBadge, { colorIndicator: groupHeader.colorIndicator }), _jsxs("div", { children: [_jsxs("div", { className: 'stickyGroupHeader', children: [_jsxs(BareButton, { ref: buttonRef, "aria-labelledby": [groupLabelId, groupNameId, ...additionalInfoIds].join(' '), "aria-expanded": !!groupHeader.isExpanded, style: {
318
+ paddingRight: 'var(--group-left)'
319
+ }, onClick: () => toggleGroup(), onKeyDown: event => {
320
+ if (event.key === 'Enter') {
321
+ // Prevent capturing of group header toggle click to its child renderers.
322
+ event.preventDefault();
323
+ event.stopPropagation();
324
+ toggleGroup();
325
+ }
326
+ }, tabIndex: -1, icon: true, children: [groupHeader.count > 0 &&
327
+ (groupHeader.isExpanded ? _jsx(Icon, { name: 'caret-down' }) : _jsx(Icon, { name: 'caret-right' })), _jsxs("div", { className: 'group-wrapper', children: [_jsx(GroupHeaderLabel, { column: column, groupHeader: groupHeader }), groupAdditionalInfo && (_jsxs(_Fragment, { children: [_jsx(Text, { variant: 'secondary', as: GroupAdditionalInfoSeparator, children: "\u2022" }), _jsx(StyledMetaList, { wrapItems: false, items: groupAdditionalInfo })] }))] })] }), buttonRef.current && (_jsx(GroupHeaderToolTip, { target: buttonRef.current, column: column, groupHeader: groupHeader, columns: columns, additionalFields: additionalFields }))] }), _jsx("div", { className: 'group-header-aggregation-row', children: columns.map(c => {
328
+ const cxt = {
329
+ getValue: () => groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]
330
+ };
331
+ return (_jsx(AggregatorCell, { column: c, context: cxt, className: cx('cell', {
332
+ 'cell-fixed': column.frozen
333
+ }) }, c.field.id));
334
+ }) })] })] }) }));
320
335
  }
321
336
  GroupHeader.propTypes = {
322
337
  columns: PropTypes.arrayOf(PropTypes.any).isRequired,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useRef, useCallback } from 'react';\nimport styled from 'styled-components';\n\nimport { Icon, Text, MetaList, Tooltip, VisuallyHiddenText, Flex } from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { getGroupFromKey } from 'pega-ui-list-data-apis';\n\nimport { createClassName as cx } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\nimport { customFunctions, intervalGroupingBoundaries } from '../../constants';\nimport AggregatorCell from '../AggregatorCell';\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport DateValueDisplay from '../DateValueDisplay';\nimport TestIdConstants from '../TestIdConstants';\n\nimport GroupAdditionalInfo from './GroupAdditionalInfo';\n\nconst groupheaderleftdisplacement = headerLevel => `${(headerLevel.level + 1) * 0.5}rem`;\n/**\n * TODO: remove currentColor style after cosmos fixes the issue\n * Cosmos yet to handle dark theme on BareButton\n */\n\nconst StyledGroupHeader = styled.div`\n --group-left: ${props => groupheaderleftdisplacement(props.groupHeader)};\n --group-bg-color: ${props => props.theme.base.palette['secondary-background']};\n background-color: var(--group-bg-color);\n &:has(button[aria-expanded='true']) {\n filter: ${props => props.theme.base.shadow['low-filter']};\n }\n\n &.row.sticky-group-header {\n position: sticky;\n display: block;\n top: calc(\n ${props =>\n props.groupHeader.isLeafNode && props.groupHeader.level !== 0\n ? 'calc(var(--row-height) + var(--group-header-height))'\n : 'var(--row-height)'}\n );\n\n /* z-index starting from 8 because freeze-line has z-index 7 */\n z-index: ${props => `${8 + props.groupHeader.index}`};\n > .cell-action,\n .cell-fixed {\n background-color: var(--group-bg-color);\n }\n }\n\n .group-label {\n width: 0.437rem;\n display: inline-block;\n flex-shrink: 0;\n }\n\n .group-header-groupby {\n font-weight: ${props => props.theme.base['font-weight'].normal};\n }\n\n .group-context-count .group-count {\n font-weight: ${props => props.theme.base['font-weight'].bold};\n white-space: pre;\n }\n\n &.row.group-header-row {\n height: auto;\n border-bottom: ${props => (!props.isAggregationApplied ? 'var(--border-style)' : 'none')};\n\n .group-header-aggregation-row {\n display: flex;\n\n /* Using height 0 so that the aggregations aren't visible when not applied but the cells can take the width and stretch the group header to the full width */\n height: ${props => (props.isAggregationApplied ? 'var(--group-header-height)' : 0)};\n }\n }\n\n &.group-header-row .stickyGroupHeader {\n position: sticky;\n left: 0;\n width: 0;\n z-index: 10;\n height: var(--group-header-height);\n\n > button {\n color: currentColor;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: max-content;\n max-width: var(--container-width);\n display: flex;\n align-items: center;\n background-color: var(--group-bg-color);\n padding-left: var(--group-left);\n margin-inline-start: 0.25rem;\n z-index: 30;\n cursor: pointer;\n white-space: nowrap;\n text-align: inherit;\n font-stretch: inherit;\n\n > .group-wrapper {\n margin-inline-start: ${({ groupHeader, theme }) =>\n groupHeader.count === 0 ? `calc(${theme.base.spacing} * 2.25)` : 'unset'};\n align-items: baseline;\n }\n\n .cell-content {\n max-height: var(--group-header-height);\n padding: 0;\n }\n }\n button:focus {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inset']};\n }\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 0.25rem;\n height: 100%;\n background-color: ${props => props.groupHeader.colorIndicator};\n z-index: 12;\n }\n }\n .group-header.cell {\n left: 0;\n padding-left: var(--group-left);\n }\n\n div.group-header.cell-fixed {\n background-color: var(--group-bg-color);\n }\n`;\n\nconst StyledMetaList = styled(MetaList)`\n margin-inline-start: 0;\n\n /* Overrides default MetaList padding and margin which was causing text-overflow issues */\n margin: 0;\n padding: 0 0.3rem;\n`;\nconst GroupAdditionalInfoSeparator = styled.span`\n margin-inline-start: 0.3rem;\n`;\n\nconst ColorBadge = styled.div`\n position: sticky;\n inset-inline-start: 0;\n z-index: 10;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 0.25rem;\n height: 100%;\n background-color: ${props => props.colorIndicator};\n z-index: 12;\n }\n`;\n\n/**\n * Generates unique ARIA label IDs for accessibility.\n * - groupLabelId: for the group label (e.g., \"Status:\")\n * - groupNameId: for the group value (e.g., \"Open\")\n * - additionalInfoIds: for any additional fields shown in the group header\n * These IDs are used in aria-labelledby to improve screen reader support.\n */\nconst getAriaLabelIds = (uniqueId, additionalFields) => {\n const groupLabelId = `group-label-${uniqueId}`;\n const groupNameId = `group-name-${uniqueId}`;\n const additionalInfoIds = additionalFields?.map(\n additionalField =>\n `group-additional-info-${uniqueId}-${additionalField.id}` /* used in aria-labelledby */\n );\n return { groupLabelId, groupNameId, additionalInfoIds };\n};\n/**\n * Returns label for interval grouping based on interval and boundaries\n Response data depends on boundary settings.\n Ex: For sample data of profit\n profit --> cases(count)\n {'0': 10, 1': 100, '2':30, '10': 35, '15':45, '20':2}\n For Interval 10\n If the boundary is 'include-lower-only',\n and value is 10 then label -> 10 to 20\n\n If boundary is 'include-upper-only',\n and value is 10 then label -> 0 to 10\n * */\nfunction buildIntervalGroupingLabel(value, customFunction, translate) {\n const { interval, boundaries } = customFunction;\n // To restrict the decimals in labels\n const intervalDecimalLength = (interval.toString().split('.')[1] || '').length;\n value = Number(value);\n // In case of 'include-lower-only'\n let lowerValue = value.toFixed(intervalDecimalLength);\n let upperValue = (value + interval).toFixed(intervalDecimalLength);\n // In case of boundary 'include-upper-only'\n if (boundaries === intervalGroupingBoundaries.includeUpperOnly) {\n lowerValue = (value - interval).toFixed(intervalDecimalLength);\n upperValue = value.toFixed(intervalDecimalLength);\n }\n return `${lowerValue} ${translate('to')} ${upperValue}`;\n}\n\nexport function GroupName({ view, column, groupHeader, dateFunction, customFunction }) {\n const [translate] = useTranslate();\n const { locale, timezone } = view.meta;\n const isRangeGrouping = customFunction?.type === customFunctions.RANGE_GROUPING;\n const isIntervalGrouping = customFunction?.type === customFunctions.INTERVAL_GROUPING;\n\n if (dateFunction) {\n return (\n <DateValueDisplay\n value={groupHeader.name}\n dateFunction={dateFunction}\n locale={locale}\n timezone={timezone}\n />\n );\n }\n\n if (isRangeGrouping) {\n /** If custom range grouping applied on number field , we need to show group name as text instead of number */\n return groupHeader.name;\n }\n\n if (isIntervalGrouping) {\n /** If custom range grouping applied on number , we need to show group name based on value and custom function details like interval and boundaries */\n return buildIntervalGroupingLabel(groupHeader.name, customFunction, translate);\n }\n\n column.setExecutionContext(null); // If null is not set then it will execute on the previous row context and facing issues when cell is edited. Based on column.editMode and current context renderer varies (it can be cellEditRenderer)\n\n const columnRendererProps = {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => groupHeader.name,\n getExecutionContext: () => {\n return { getValue: () => groupHeader.data, name: 'groupHeader' };\n }\n }\n };\n\n return <RenderingEngine {...columnRendererProps} />;\n}\n\n/**\n * Tooltip content for the group header.\n * Shows the group label, value, and any additional fields.\n * Used for hover/focus tooltips on the group header button.\n */\nfunction GroupHeaderToolTip({ column, groupHeader, columns, additionalFields, target }) {\n const view = column.parent;\n const { dateFunction, customFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n\n return (\n <Tooltip smart target={target} showDelay='short' hideDelay='none' describeTarget={false}>\n <Text>{!column.field.hideGroupColumnNameLabel && groupHeader.label}: </Text>\n <Text>\n <GroupName\n view={view}\n column={column}\n groupHeader={groupHeader}\n dateFunction={dateFunction}\n customFunction={customFunction}\n />\n <Text>{` (${groupCountFormatted})`}</Text>\n </Text>\n {!!(groupHeader.additionalFieldsData?.length && additionalFields.length) && (\n <>\n {groupHeader.additionalFieldsData?.map(additionalFieldData => {\n return (\n <>\n {' • '}\n <GroupAdditionalInfo\n groupHeader={groupHeader}\n additionalField={additionalFields.find(\n additionalField => additionalField.id === additionalFieldData.id\n )}\n columns={columns}\n additionalFieldData={additionalFieldData}\n rendererContext='GroupHeaderTooltip'\n />\n </>\n );\n })}\n </>\n )}\n </Tooltip>\n );\n}\n\n/**\n * Renders the main group header label and count.\n * - Shows the group label (e.g., \"Status:\") unless hidden by column config.\n * - Shows the group value and item count.\n * - Uses ARIA IDs for accessibility.\n */\nfunction GroupHeaderLabel({ column, groupHeader }) {\n const view = column.parent;\n const { dateFunction, customFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n const { groupLabelId, groupNameId } = getAriaLabelIds(groupHeader.uniqueId);\n return (\n <>\n <div className='group-label' />\n {!column.field.hideGroupColumnNameLabel && (\n <span\n className='group-header-groupby'\n data-test-id={groupHeader.groupBy}\n data-testid={`${TestIdConstants.groupHeaderGroupBy}-${groupHeader.groupBy}`}\n id={groupLabelId}\n >\n {groupHeader.label}:\n </span>\n )}\n <div className='group-label' />\n <span\n className='group-context-count'\n style={{ display: 'inline-flex' }}\n data-test-id='groupHeader'\n data-testid={TestIdConstants.groupHeaderCount}\n id={groupNameId}\n >\n <GroupName\n view={view}\n column={column}\n groupHeader={groupHeader}\n dateFunction={dateFunction}\n customFunction={customFunction}\n />\n {/* adding whitespace pre to preserve the space at the begining of count text */}\n <span className='group-count'>{` (${groupCountFormatted})`}</span>\n <VisuallyHiddenText> items</VisuallyHiddenText>\n </span>\n </>\n );\n}\n// NOTE: While making any changes in GroupRenderer.jsx, also make similar changes in HierarchicalGroupRenderer.jsx file if applicable\n\nexport default function GroupHeader({ groupHeader, columns }) {\n const buttonRef = useRef();\n const view = columns[0].parent;\n const toggleGroup = useCallback(() => {\n if (groupHeader.count > 0) {\n view.type.toggleGroupExpansion({ groupHeader });\n }\n }, [groupHeader, view]);\n\n // TODO: This we are adding temporary to show freeze border until we make group header rendering change\n // when we will pick up aggregation.\n if (!groupHeader.isVisible) return null;\n\n // If grouping by a regular column (i.e. without a dateFunction), determine props for the renderer\n const { columnId, additionalFields = [] } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n // if state.groups is not yet prepared/updated, then getGroupFromKey will return undefined\n if (!columnId) {\n return null;\n }\n\n const column = columns.find(c => c.field.id === columnId);\n const isAggregationApplied = columns.filter(c => !c.hidden).some(c => c.aggregated);\n\n // Generate unique ARIA label IDs for accessibility\n const {\n groupLabelId,\n groupNameId,\n additionalInfoIds = []\n } = getAriaLabelIds(groupHeader.uniqueId, additionalFields);\n let groupAdditionalInfo;\n\n // Prepare additional info components if present\n if (groupHeader.additionalFieldsData?.length && additionalFields.length) {\n groupAdditionalInfo = groupHeader.additionalFieldsData.reduce(\n (acc, additionalFieldData, idx) => {\n const additionalField = additionalFields.find(field => field.id === additionalFieldData.id);\n if (additionalField) {\n acc.push(\n <Flex container={{ gap: 0.5 }} id={additionalInfoIds[idx]}>\n <GroupAdditionalInfo\n additionalFieldData={additionalFieldData}\n additionalField={additionalField}\n columns={columns}\n groupHeader={groupHeader}\n rendererContext='GroupHeader'\n />\n </Flex>\n );\n }\n return acc;\n },\n []\n );\n }\n\n // FIXME: Import rather than COPY, i would rather\n return (\n <StyledGroupHeader\n groupHeader={groupHeader}\n className={cx('row group-header-row sticky-group-header')}\n data-test-id='groupHeader'\n data-testid={`${TestIdConstants.groupHeader}-${groupHeader.label}-${groupHeader.name}`}\n isAggregationApplied={isAggregationApplied}\n role='row'\n onFocus={e => {\n if (buttonRef.current && !e.currentTarget.contains(e.relatedTarget)) {\n e.preventDefault();\n buttonRef.current.focus();\n }\n }}\n >\n <div className='stickyGroupHeader'>\n <BareButton\n ref={buttonRef}\n // ARIA labels for accessibility, includes additional info if present\n aria-labelledby={[groupLabelId, groupNameId, ...additionalInfoIds].join(' ')}\n aria-expanded={!!groupHeader.isExpanded}\n style={{\n paddingRight: 'var(--group-left)'\n }}\n onClick={() => toggleGroup()}\n onKeyDown={event => {\n if (event.key === 'Enter') {\n // Prevent capturing of group header toggle click to its child renderers.\n event.preventDefault();\n event.stopPropagation();\n toggleGroup();\n }\n }}\n tabIndex={-1}\n icon\n >\n {groupHeader.count > 0 &&\n (groupHeader.isExpanded ? <Icon name='caret-down' /> : <Icon name='caret-right' />)}\n <div className='group-wrapper'>\n {/* Main group label and count */}\n <GroupHeaderLabel column={column} groupHeader={groupHeader} />\n {/* Render additional info if present */}\n {groupAdditionalInfo && (\n <>\n <Text variant='secondary' as={GroupAdditionalInfoSeparator}>\n •\n </Text>\n <StyledMetaList wrapItems={false} items={groupAdditionalInfo} />\n </>\n )}\n </div>\n </BareButton>\n {/* Tooltip for group header, shown on hover/focus */}\n {buttonRef.current && (\n <GroupHeaderToolTip\n target={buttonRef.current}\n column={column}\n groupHeader={groupHeader}\n columns={columns}\n additionalFields={additionalFields}\n />\n )}\n </div>\n <div className='group-header-aggregation-row'>\n <ColorBadge colorIndicator={groupHeader.colorIndicator} />\n {columns.map(c => {\n const cxt = {\n getValue: () =>\n groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]\n };\n return (\n <AggregatorCell\n key={c.field.id}\n column={c}\n context={cxt}\n className={cx('cell', {\n 'cell-fixed': column.frozen\n })}\n />\n );\n })}\n </div>\n </StyledGroupHeader>\n );\n}\n\nGroupHeader.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useRef, useCallback } from 'react';\nimport styled from 'styled-components';\n\nimport { Icon, Text, MetaList, Tooltip, VisuallyHiddenText, Flex } from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { getGroupFromKey } from 'pega-ui-list-data-apis';\n\nimport { createClassName as cx } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\nimport { customFunctions, intervalGroupingBoundaries } from '../../constants';\nimport AggregatorCell from '../AggregatorCell';\nimport RenderingEngine from '../RenderingEngine/RenderCell';\nimport DateValueDisplay from '../DateValueDisplay';\nimport TestIdConstants from '../TestIdConstants';\n\nimport GroupAdditionalInfo from './GroupAdditionalInfo';\n\nconst groupheaderleftdisplacement = headerLevel => `${(headerLevel.level + 1) * 0.5}rem`;\n\nconst ColorBadge = styled.div`\n position: sticky;\n inset-inline-start: 0;\n z-index: 10;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 0.25rem;\n height: 100%;\n background-color: ${props => props.colorIndicator};\n border-top-left-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);\n border-bottom-left-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);\n z-index: 12;\n }\n`;\n\n/**\n * TODO: remove currentColor style after cosmos fixes the issue\n * Cosmos yet to handle dark theme on BareButton\n */\n\nconst StyledGroupHeader = styled.div`\n --group-left: ${props => groupheaderleftdisplacement(props.groupHeader)};\n --group-bg-color: ${props => props.theme.base.palette['secondary-background']};\n background-color: var(--group-bg-color);\n filter: ${props => props.theme.base.shadow['low-filter']};\n\n &.row.sticky-group-header {\n position: sticky;\n display: block;\n top: calc(\n ${props =>\n props.groupHeader.isLeafNode && props.groupHeader.level !== 0\n ? 'calc(var(--row-height) + var(--group-header-height))'\n : 'var(--row-height)'}\n );\n\n /* z-index starting from 8 because freeze-line has z-index 7 */\n z-index: ${props => `${8 + props.groupHeader.index}`};\n > .cell-action,\n .cell-fixed {\n background-color: var(--group-bg-color);\n }\n }\n\n .group-label {\n width: 0.437rem;\n display: inline-block;\n flex-shrink: 0;\n }\n\n .group-header-groupby {\n font-weight: ${props => props.theme.base['font-weight'].normal};\n }\n\n .group-context-count .group-count {\n font-weight: ${props => props.theme.base['font-weight'].bold};\n white-space: pre;\n }\n\n &.row.group-header-row {\n height: auto;\n\n .group-header-aggregation-row {\n display: flex;\n\n /* Using height 0 so that the aggregations aren't visible when not applied but the cells can take the width and stretch the group header to the full width */\n height: ${props => (props.isAggregationApplied ? 'var(--group-header-height)' : 0)};\n }\n }\n\n /* consider three group-header-rows stacked vertically, the first and second group headers have RULE 2 AND RULE 3 applied, the third group-header has only RULE 3 applied */\n &.group-header-row {\n /* RULE 1- if there are no adjacent group-headers, apply border-radius to all corners */\n border-radius: min(${props => props.theme.base['border-radius']}, 0.25rem);\n\n /* RULE-2- if there is an adjacent group-header below, remove bottom border-radius */\n\n &:has(+ .group-header-row) {\n border-radius: 0;\n\n & ${ColorBadge}::before {\n border-radius: 0;\n }\n }\n\n /*RULE 3- if there is an adjacent group-header, go to the adjacent group header and remove top border-radius */\n &:has(+ .group-header-row) + .group-header-row {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n & ${ColorBadge}::before {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n }\n\n &.group-header-row .stickyGroupHeader {\n position: sticky;\n left: 0;\n width: 0;\n z-index: 10;\n height: var(--group-header-height);\n\n > button {\n color: currentColor;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: max-content;\n max-width: var(--container-width);\n display: flex;\n align-items: center;\n background-color: var(--group-bg-color);\n padding-left: var(--group-left);\n margin-inline-start: 0.25rem;\n z-index: 30;\n cursor: pointer;\n white-space: nowrap;\n text-align: inherit;\n font-stretch: inherit;\n\n > .group-wrapper {\n margin-inline-start: ${({ groupHeader, theme }) =>\n groupHeader.count === 0 ? `calc(${theme.base.spacing} * 2.25)` : 'unset'};\n align-items: baseline;\n }\n\n .cell-content {\n max-height: var(--group-header-height);\n padding: 0;\n }\n }\n button:focus {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inset']};\n }\n }\n .group-header.cell {\n left: 0;\n padding-left: var(--group-left);\n }\n\n div.group-header.cell-fixed {\n background-color: var(--group-bg-color);\n }\n`;\n\nconst StyledMetaList = styled(MetaList)`\n margin-inline-start: 0;\n\n /* Overrides default MetaList padding and margin which was causing text-overflow issues */\n margin: 0;\n padding: 0 0.3rem;\n`;\nconst GroupAdditionalInfoSeparator = styled.span`\n margin-inline-start: 0.3rem;\n`;\n\n/**\n * Generates unique ARIA label IDs for accessibility.\n * - groupLabelId: for the group label (e.g., \"Status:\")\n * - groupNameId: for the group value (e.g., \"Open\")\n * - additionalInfoIds: for any additional fields shown in the group header\n * These IDs are used in aria-labelledby to improve screen reader support.\n */\nconst getAriaLabelIds = (uniqueId, additionalFields) => {\n const groupLabelId = `group-label-${uniqueId}`;\n const groupNameId = `group-name-${uniqueId}`;\n const additionalInfoIds = additionalFields?.map(\n additionalField =>\n `group-additional-info-${uniqueId}-${additionalField.id}` /* used in aria-labelledby */\n );\n return { groupLabelId, groupNameId, additionalInfoIds };\n};\n/**\n * Returns label for interval grouping based on interval and boundaries\n Response data depends on boundary settings.\n Ex: For sample data of profit\n profit --> cases(count)\n {'0': 10, 1': 100, '2':30, '10': 35, '15':45, '20':2}\n For Interval 10\n If the boundary is 'include-lower-only',\n and value is 10 then label -> 10 to 20\n\n If boundary is 'include-upper-only',\n and value is 10 then label -> 0 to 10\n * */\nfunction buildIntervalGroupingLabel(value, customFunction, translate) {\n const { interval, boundaries } = customFunction;\n // To restrict the decimals in labels\n const intervalDecimalLength = (interval.toString().split('.')[1] || '').length;\n value = Number(value);\n // In case of 'include-lower-only'\n let lowerValue = value.toFixed(intervalDecimalLength);\n let upperValue = (value + interval).toFixed(intervalDecimalLength);\n // In case of boundary 'include-upper-only'\n if (boundaries === intervalGroupingBoundaries.includeUpperOnly) {\n lowerValue = (value - interval).toFixed(intervalDecimalLength);\n upperValue = value.toFixed(intervalDecimalLength);\n }\n return `${lowerValue} ${translate('to')} ${upperValue}`;\n}\n\nexport function GroupName({ view, column, groupHeader, dateFunction, customFunction }) {\n const [translate] = useTranslate();\n const { locale, timezone } = view.meta;\n const isRangeGrouping = customFunction?.type === customFunctions.RANGE_GROUPING;\n const isIntervalGrouping = customFunction?.type === customFunctions.INTERVAL_GROUPING;\n\n if (dateFunction) {\n return (\n <DateValueDisplay\n value={groupHeader.name}\n dateFunction={dateFunction}\n locale={locale}\n timezone={timezone}\n />\n );\n }\n\n if (isRangeGrouping) {\n /** If custom range grouping applied on number field , we need to show group name as text instead of number */\n return groupHeader.name;\n }\n\n if (isIntervalGrouping) {\n /** If custom range grouping applied on number , we need to show group name based on value and custom function details like interval and boundaries */\n return buildIntervalGroupingLabel(groupHeader.name, customFunction, translate);\n }\n\n column.setExecutionContext(null); // If null is not set then it will execute on the previous row context and facing issues when cell is edited. Based on column.editMode and current context renderer varies (it can be cellEditRenderer)\n\n const columnRendererProps = {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => groupHeader.name,\n getExecutionContext: () => {\n return { getValue: () => groupHeader.data, name: 'groupHeader' };\n }\n }\n };\n\n return <RenderingEngine {...columnRendererProps} />;\n}\n\n/**\n * Tooltip content for the group header.\n * Shows the group label, value, and any additional fields.\n * Used for hover/focus tooltips on the group header button.\n */\nfunction GroupHeaderToolTip({ column, groupHeader, columns, additionalFields, target }) {\n const view = column.parent;\n const { dateFunction, customFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n\n return (\n <Tooltip smart target={target} showDelay='short' hideDelay='none' describeTarget={false}>\n <Text>{!column.field.hideGroupColumnNameLabel && groupHeader.label}: </Text>\n <Text>\n <GroupName\n view={view}\n column={column}\n groupHeader={groupHeader}\n dateFunction={dateFunction}\n customFunction={customFunction}\n />\n <Text>{` (${groupCountFormatted})`}</Text>\n </Text>\n {!!(groupHeader.additionalFieldsData?.length && additionalFields.length) && (\n <>\n {groupHeader.additionalFieldsData?.map(additionalFieldData => {\n return (\n <>\n {' • '}\n <GroupAdditionalInfo\n groupHeader={groupHeader}\n additionalField={additionalFields.find(\n additionalField => additionalField.id === additionalFieldData.id\n )}\n columns={columns}\n additionalFieldData={additionalFieldData}\n rendererContext='GroupHeaderTooltip'\n />\n </>\n );\n })}\n </>\n )}\n </Tooltip>\n );\n}\n\n/**\n * Renders the main group header label and count.\n * - Shows the group label (e.g., \"Status:\") unless hidden by column config.\n * - Shows the group value and item count.\n * - Uses ARIA IDs for accessibility.\n */\nfunction GroupHeaderLabel({ column, groupHeader }) {\n const view = column.parent;\n const { dateFunction, customFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n const { groupLabelId, groupNameId } = getAriaLabelIds(groupHeader.uniqueId);\n return (\n <>\n <div className='group-label' />\n {!column.field.hideGroupColumnNameLabel && (\n <span\n className='group-header-groupby'\n data-test-id={groupHeader.groupBy}\n data-testid={`${TestIdConstants.groupHeaderGroupBy}-${groupHeader.groupBy}`}\n id={groupLabelId}\n >\n {groupHeader.label}:\n </span>\n )}\n <div className='group-label' />\n <span\n className='group-context-count'\n style={{ display: 'inline-flex' }}\n data-test-id='groupHeader'\n data-testid={TestIdConstants.groupHeaderCount}\n id={groupNameId}\n >\n <GroupName\n view={view}\n column={column}\n groupHeader={groupHeader}\n dateFunction={dateFunction}\n customFunction={customFunction}\n />\n {/* adding whitespace pre to preserve the space at the begining of count text */}\n <span className='group-count'>{` (${groupCountFormatted})`}</span>\n <VisuallyHiddenText> items</VisuallyHiddenText>\n </span>\n </>\n );\n}\n// NOTE: While making any changes in GroupRenderer.jsx, also make similar changes in HierarchicalGroupRenderer.jsx file if applicable\n\nexport default function GroupHeader({ groupHeader, columns }) {\n const buttonRef = useRef();\n const view = columns[0].parent;\n const toggleGroup = useCallback(() => {\n if (groupHeader.count > 0) {\n view.type.toggleGroupExpansion({ groupHeader });\n }\n }, [groupHeader, view]);\n\n // TODO: This we are adding temporary to show freeze border until we make group header rendering change\n // when we will pick up aggregation.\n if (!groupHeader.isVisible) return null;\n\n // If grouping by a regular column (i.e. without a dateFunction), determine props for the renderer\n const { columnId, additionalFields = [] } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n // if state.groups is not yet prepared/updated, then getGroupFromKey will return undefined\n if (!columnId) {\n return null;\n }\n\n const column = columns.find(c => c.field.id === columnId);\n const isAggregationApplied = columns.filter(c => !c.hidden).some(c => c.aggregated);\n\n // Generate unique ARIA label IDs for accessibility\n const {\n groupLabelId,\n groupNameId,\n additionalInfoIds = []\n } = getAriaLabelIds(groupHeader.uniqueId, additionalFields);\n let groupAdditionalInfo;\n\n // Prepare additional info components if present\n if (groupHeader.additionalFieldsData?.length && additionalFields.length) {\n groupAdditionalInfo = groupHeader.additionalFieldsData.reduce(\n (acc, additionalFieldData, idx) => {\n const additionalField = additionalFields.find(field => field.id === additionalFieldData.id);\n if (additionalField) {\n acc.push(\n <Flex container={{ gap: 0.5 }} id={additionalInfoIds[idx]}>\n <GroupAdditionalInfo\n additionalFieldData={additionalFieldData}\n additionalField={additionalField}\n columns={columns}\n groupHeader={groupHeader}\n rendererContext='GroupHeader'\n />\n </Flex>\n );\n }\n return acc;\n },\n []\n );\n }\n\n // FIXME: Import rather than COPY, i would rather\n return (\n <StyledGroupHeader\n groupHeader={groupHeader}\n className={cx('row group-header-row sticky-group-header')}\n data-test-id='groupHeader'\n data-testid={`${TestIdConstants.groupHeader}-${groupHeader.label}-${groupHeader.name}`}\n isAggregationApplied={isAggregationApplied}\n role='row'\n onFocus={e => {\n if (buttonRef.current && !e.currentTarget.contains(e.relatedTarget)) {\n e.preventDefault();\n buttonRef.current.focus();\n }\n }}\n >\n <Flex container>\n <ColorBadge colorIndicator={groupHeader.colorIndicator} />\n <div>\n <div className='stickyGroupHeader'>\n <BareButton\n ref={buttonRef}\n // ARIA labels for accessibility, includes additional info if present\n aria-labelledby={[groupLabelId, groupNameId, ...additionalInfoIds].join(' ')}\n aria-expanded={!!groupHeader.isExpanded}\n style={{\n paddingRight: 'var(--group-left)'\n }}\n onClick={() => toggleGroup()}\n onKeyDown={event => {\n if (event.key === 'Enter') {\n // Prevent capturing of group header toggle click to its child renderers.\n event.preventDefault();\n event.stopPropagation();\n toggleGroup();\n }\n }}\n tabIndex={-1}\n icon\n >\n {groupHeader.count > 0 &&\n (groupHeader.isExpanded ? <Icon name='caret-down' /> : <Icon name='caret-right' />)}\n <div className='group-wrapper'>\n {/* Main group label and count */}\n <GroupHeaderLabel column={column} groupHeader={groupHeader} />\n {/* Render additional info if present */}\n {groupAdditionalInfo && (\n <>\n <Text variant='secondary' as={GroupAdditionalInfoSeparator}>\n •\n </Text>\n <StyledMetaList wrapItems={false} items={groupAdditionalInfo} />\n </>\n )}\n </div>\n </BareButton>\n {/* Tooltip for group header, shown on hover/focus */}\n {buttonRef.current && (\n <GroupHeaderToolTip\n target={buttonRef.current}\n column={column}\n groupHeader={groupHeader}\n columns={columns}\n additionalFields={additionalFields}\n />\n )}\n </div>\n <div className='group-header-aggregation-row'>\n {columns.map(c => {\n const cxt = {\n getValue: () =>\n groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]\n };\n return (\n <AggregatorCell\n key={c.field.id}\n column={c}\n context={cxt}\n className={cx('cell', {\n 'cell-fixed': column.frozen\n })}\n />\n );\n })}\n </div>\n </div>\n </Flex>\n </StyledGroupHeader>\n );\n}\n\nGroupHeader.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"HierarchicalGroupRenderer.d.ts","sourceRoot":"","sources":["../../../Core/Components/HierarchicalGroupRenderer.jsx"],"names":[],"mappings":"AAoIA;;;mDAyHC;;;;;;;;;AA/OM,kFAC0B;AAI1B,qCAEN;AA+OM;;;mDAqCN;;;;;;;;;;;;sBAzSqB,YAAY"}
1
+ {"version":3,"file":"HierarchicalGroupRenderer.d.ts","sourceRoot":"","sources":["../../../Core/Components/HierarchicalGroupRenderer.jsx"],"names":[],"mappings":"AAmIA;;;mDAyHC;;;;;;;;;AA9OM,kFAC0B;AAI1B,qCAEN;AA8OM;;;mDAqCN;;;;;;;;;;;;sBAxSqB,YAAY"}
@@ -58,7 +58,6 @@ const StyledHierarchicalGroupHeader = styled.div `
58
58
  left: 0;
59
59
  width: 0;
60
60
  z-index: 10;
61
- border-bottom: var(--border-style);
62
61
 
63
62
  > button {
64
63
  color: currentColor;
@@ -1 +1 @@
1
- {"version":3,"file":"HierarchicalGroupRenderer.js","sourceRoot":"","sources":["../../../Core/Components/HierarchicalGroupRenderer.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Icon } from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { getGroupFromKey } from 'pega-ui-list-data-apis';\n\nimport { createClassName as cx } from '../Utils';\n\nimport AggregatorCell from './AggregatorCell';\nimport RenderingEngine from './RenderingEngine/RenderCell';\nimport HierarchicalCell from './HierarchicalCell';\n\nexport const hierarchicalgroupheaderleftdisplacement = headerLevel =>\n `${(headerLevel + 1) * 1.5}rem`;\n\nlet counter = 0;\n\nexport const resetCounter = () => {\n counter = 0;\n};\n\nconst StyledHierarchicalGroupHeader = styled.div`\n --group-left: ${props => hierarchicalgroupheaderleftdisplacement(props.groupHeader.level)};\n --group-bg-color: ${props => {\n return props.theme.base.palette['primary-background'];\n }};\n background-color: var(--group-bg-color);\n\n &.row.sticky-group-header {\n position: sticky;\n top: calc(\n ${props =>\n props.groupHeader.isLeafNode && props.groupHeader.level !== 0\n ? 'calc(var(--row-height) + var(--group-header-height))'\n : 'var(--row-height)'}\n );\n z-index: ${props => {\n const zIndex = 5 + props.groupHeader.level + counter;\n if (props.groupHeader.isLeafNode) {\n counter += props.groupHeader.level;\n }\n return zIndex;\n }};\n > .cell-action {\n background-color: var(--group-bg-color);\n }\n }\n\n .group-label {\n width: 0.437rem;\n display: inline-block;\n }\n\n .group-context-count {\n font-weight: ${props => props.theme.base['font-weight'].bold};\n }\n\n .group-icon-spacer {\n padding-left: var(--icon-size);\n }\n\n .stickyGroupHeader {\n position: sticky;\n left: 0;\n width: 0;\n z-index: 10;\n border-bottom: var(--border-style);\n\n > button {\n color: currentColor;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n background-color: var(--group-bg-color);\n padding-left: var(--group-left);\n z-index: 30;\n cursor: pointer;\n white-space: nowrap;\n }\n button:focus {\n box-shadow: ${({ theme }) => theme.base.shadow.focus};\n }\n }\n .group-header.cell {\n width: ${props => props.groupWidth};\n left: 0;\n padding-left: var(--group-left);\n }\n\n div.group-header.cell-fixed {\n background-color: var(--group-bg-color);\n }\n`;\n\nconst StyledHierarchicalGroupFooter = styled.div`\n --group-bg-color: ${props => {\n return props.theme.base.palette['secondary-background'];\n }};\n background-color: var(--group-bg-color);\n\n &.row.hierarchical-group-footer-row {\n position: relative;\n > .cell-action {\n background-color: var(--group-bg-color);\n }\n }\n\n & .footer-label-container {\n position: sticky;\n top: 0;\n left: 0;\n width: 0;\n z-index: 5;\n & .label {\n position: absolute;\n background-color: var(--group-bg-color);\n height: calc(100% - var(--border-width));\n left: ${props => {\n return `${props.labelLeft}px`;\n }};\n width: max-content;\n /* stylelint-disable unit-allowed-list */\n padding: 0 5px;\n }\n }\n`;\n\nexport function HierarchicalGroupHeader({ groupHeader, columns }) {\n // TODO: This we are adding temporary to show freeze border until we make group header rendering change\n // when we will pick up aggregation.\n if (!groupHeader.isVisible) return null;\n let groupWidth = '';\n const view = columns[0].parent;\n let freezeColCount = 0;\n columns\n .filter(c => !c.hidden && c.frozen)\n .forEach(c => {\n groupWidth += `var(--col-width-${c.field.id}) + `;\n freezeColCount += 1;\n });\n if (freezeColCount > 0) groupWidth = `calc(${groupWidth.substr(0, groupWidth.length - 2)})`;\n\n const renderStickyHeader = () => {\n // If grouping by a regular column (i.e. without a dateFunction), determine props for the rendere\n const { columnId, dateFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n // if state.groups is not yet prepared/updated, then getGroupFromKey will return undefined\n if (!columnId) {\n return null;\n }\n let columnRendererProps;\n if (!dateFunction) {\n const column = columns.find(c => c.field.id === columnId);\n column.setExecutionContext(null); // If null is not set then it will execute on the previous row context and facing issues when cell is edited. Based on column.editMode and current context renderer varies (it can be cellEditRenderer)\n\n columnRendererProps = {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => groupHeader.name,\n getExecutionContext: () => {\n return { getValue: () => groupHeader.data, name: 'groupHeader' };\n }\n }\n };\n }\n\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n const expandCollapseIcon = groupHeader.isExpanded ? (\n <Icon name='caret-down' />\n ) : (\n <Icon name='caret-right' />\n );\n\n return (\n <div className='stickyGroupHeader'>\n <BareButton\n aria-label={`${groupHeader.label} ${groupCountFormatted} items`}\n style={{\n paddingRight: '3px',\n maxWidth: freezeColCount > 0 ? groupWidth : 'auto'\n }}\n onClick={() => view.type.toggleGroupExpansion({ groupHeader })}\n >\n {groupHeader.count > 0 ? expandCollapseIcon : <div className='group-icon-spacer' />}\n <div className='group-wrapper'>\n <div className='group-label' />\n <span className='group-context-count' style={{ display: 'inline-flex' }}>\n <RenderingEngine {...columnRendererProps} highlighter />\n </span>\n </div>\n </BareButton>\n </div>\n );\n };\n\n const getRenderingEnginePropsById = id => {\n const column = columns.find(c => c.field.id === id);\n const columnContext = column.getContext();\n const parentContext = columnContext.getParentContext();\n\n return {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => {\n return groupHeader.info[column.field?.name];\n },\n getExecutionContext: () => {\n return { getValue: () => groupHeader.info, name: 'groupHeader' };\n },\n getParentContext: () => {\n return {\n ...parentContext,\n getRenderingEnginePropsById\n };\n }\n }\n };\n };\n\n const renderHierarchicalCells = () => {\n return columns.map(column => {\n const columnRendererProps = getRenderingEnginePropsById(column.field.id);\n\n return (\n <HierarchicalCell\n key={column.field.id}\n column={column}\n columnRendererProps={columnRendererProps}\n />\n );\n });\n };\n\n return (\n <StyledHierarchicalGroupHeader\n groupHeader={groupHeader}\n groupWidth={groupWidth}\n className={cx('row hierarchical-group-header-row sticky-group-header')}\n data-test-id='hierarchicalGroupHeader'\n >\n {renderStickyHeader()}\n {renderHierarchicalCells()}\n </StyledHierarchicalGroupHeader>\n );\n}\n\nHierarchicalGroupHeader.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport const HierarchicalGroupFooter = ({ columns, groupHeader }) => {\n const labelRef = useRef(null);\n const [labelLeft, setLabelLeft] = useState(0);\n const view = columns[0].parent;\n const parentContainer = view.virtualizeElements.rootVirtualiser?.getParentContainer();\n const footerWidth = parentContainer?.clientWidth;\n\n useLayoutEffect(() => {\n if (labelRef.current) {\n const { width } = labelRef.current.getBoundingClientRect();\n setLabelLeft(footerWidth - width - 5);\n }\n }, [groupHeader.isVisible, footerWidth]);\n\n if (!groupHeader.isVisible) return null;\n\n return (\n <StyledHierarchicalGroupFooter\n groupHeader={groupHeader}\n className={cx('row hierarchical-group-footer-row')}\n labelLeft={labelLeft}\n data-test-id='hierarchicalGroupFooter'\n >\n <div className='footer-label-container'>\n <div ref={labelRef} className='label'>\n {groupHeader.name}\n </div>\n </div>\n {columns.map(c => {\n const cxt = {\n getValue: () =>\n groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]\n };\n return <AggregatorCell key={c.field.id} column={c} context={cxt} />;\n })}\n </StyledHierarchicalGroupFooter>\n );\n};\n\nHierarchicalGroupFooter.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
1
+ {"version":3,"file":"HierarchicalGroupRenderer.js","sourceRoot":"","sources":["../../../Core/Components/HierarchicalGroupRenderer.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Icon } from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { getGroupFromKey } from 'pega-ui-list-data-apis';\n\nimport { createClassName as cx } from '../Utils';\n\nimport AggregatorCell from './AggregatorCell';\nimport RenderingEngine from './RenderingEngine/RenderCell';\nimport HierarchicalCell from './HierarchicalCell';\n\nexport const hierarchicalgroupheaderleftdisplacement = headerLevel =>\n `${(headerLevel + 1) * 1.5}rem`;\n\nlet counter = 0;\n\nexport const resetCounter = () => {\n counter = 0;\n};\n\nconst StyledHierarchicalGroupHeader = styled.div`\n --group-left: ${props => hierarchicalgroupheaderleftdisplacement(props.groupHeader.level)};\n --group-bg-color: ${props => {\n return props.theme.base.palette['primary-background'];\n }};\n background-color: var(--group-bg-color);\n\n &.row.sticky-group-header {\n position: sticky;\n top: calc(\n ${props =>\n props.groupHeader.isLeafNode && props.groupHeader.level !== 0\n ? 'calc(var(--row-height) + var(--group-header-height))'\n : 'var(--row-height)'}\n );\n z-index: ${props => {\n const zIndex = 5 + props.groupHeader.level + counter;\n if (props.groupHeader.isLeafNode) {\n counter += props.groupHeader.level;\n }\n return zIndex;\n }};\n > .cell-action {\n background-color: var(--group-bg-color);\n }\n }\n\n .group-label {\n width: 0.437rem;\n display: inline-block;\n }\n\n .group-context-count {\n font-weight: ${props => props.theme.base['font-weight'].bold};\n }\n\n .group-icon-spacer {\n padding-left: var(--icon-size);\n }\n\n .stickyGroupHeader {\n position: sticky;\n left: 0;\n width: 0;\n z-index: 10;\n\n > button {\n color: currentColor;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n background-color: var(--group-bg-color);\n padding-left: var(--group-left);\n z-index: 30;\n cursor: pointer;\n white-space: nowrap;\n }\n button:focus {\n box-shadow: ${({ theme }) => theme.base.shadow.focus};\n }\n }\n .group-header.cell {\n width: ${props => props.groupWidth};\n left: 0;\n padding-left: var(--group-left);\n }\n\n div.group-header.cell-fixed {\n background-color: var(--group-bg-color);\n }\n`;\n\nconst StyledHierarchicalGroupFooter = styled.div`\n --group-bg-color: ${props => {\n return props.theme.base.palette['secondary-background'];\n }};\n background-color: var(--group-bg-color);\n\n &.row.hierarchical-group-footer-row {\n position: relative;\n > .cell-action {\n background-color: var(--group-bg-color);\n }\n }\n\n & .footer-label-container {\n position: sticky;\n top: 0;\n left: 0;\n width: 0;\n z-index: 5;\n & .label {\n position: absolute;\n background-color: var(--group-bg-color);\n height: calc(100% - var(--border-width));\n left: ${props => {\n return `${props.labelLeft}px`;\n }};\n width: max-content;\n /* stylelint-disable unit-allowed-list */\n padding: 0 5px;\n }\n }\n`;\n\nexport function HierarchicalGroupHeader({ groupHeader, columns }) {\n // TODO: This we are adding temporary to show freeze border until we make group header rendering change\n // when we will pick up aggregation.\n if (!groupHeader.isVisible) return null;\n let groupWidth = '';\n const view = columns[0].parent;\n let freezeColCount = 0;\n columns\n .filter(c => !c.hidden && c.frozen)\n .forEach(c => {\n groupWidth += `var(--col-width-${c.field.id}) + `;\n freezeColCount += 1;\n });\n if (freezeColCount > 0) groupWidth = `calc(${groupWidth.substr(0, groupWidth.length - 2)})`;\n\n const renderStickyHeader = () => {\n // If grouping by a regular column (i.e. without a dateFunction), determine props for the rendere\n const { columnId, dateFunction } =\n getGroupFromKey(groupHeader.groupBy, view.state.groups) ?? {};\n // if state.groups is not yet prepared/updated, then getGroupFromKey will return undefined\n if (!columnId) {\n return null;\n }\n let columnRendererProps;\n if (!dateFunction) {\n const column = columns.find(c => c.field.id === columnId);\n column.setExecutionContext(null); // If null is not set then it will execute on the previous row context and facing issues when cell is edited. Based on column.editMode and current context renderer varies (it can be cellEditRenderer)\n\n columnRendererProps = {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => groupHeader.name,\n getExecutionContext: () => {\n return { getValue: () => groupHeader.data, name: 'groupHeader' };\n }\n }\n };\n }\n\n const formatter = view.getFormatterByKey('Integer');\n const { locale } = view.meta;\n const groupCountFormatted = formatter\n ? formatter(groupHeader.count, { locale })\n : groupHeader.count;\n const expandCollapseIcon = groupHeader.isExpanded ? (\n <Icon name='caret-down' />\n ) : (\n <Icon name='caret-right' />\n );\n\n return (\n <div className='stickyGroupHeader'>\n <BareButton\n aria-label={`${groupHeader.label} ${groupCountFormatted} items`}\n style={{\n paddingRight: '3px',\n maxWidth: freezeColCount > 0 ? groupWidth : 'auto'\n }}\n onClick={() => view.type.toggleGroupExpansion({ groupHeader })}\n >\n {groupHeader.count > 0 ? expandCollapseIcon : <div className='group-icon-spacer' />}\n <div className='group-wrapper'>\n <div className='group-label' />\n <span className='group-context-count' style={{ display: 'inline-flex' }}>\n <RenderingEngine {...columnRendererProps} highlighter />\n </span>\n </div>\n </BareButton>\n </div>\n );\n };\n\n const getRenderingEnginePropsById = id => {\n const column = columns.find(c => c.field.id === id);\n const columnContext = column.getContext();\n const parentContext = columnContext.getParentContext();\n\n return {\n ...column.getRenderingEngineProps(),\n context: {\n getValue: () => {\n return groupHeader.info[column.field?.name];\n },\n getExecutionContext: () => {\n return { getValue: () => groupHeader.info, name: 'groupHeader' };\n },\n getParentContext: () => {\n return {\n ...parentContext,\n getRenderingEnginePropsById\n };\n }\n }\n };\n };\n\n const renderHierarchicalCells = () => {\n return columns.map(column => {\n const columnRendererProps = getRenderingEnginePropsById(column.field.id);\n\n return (\n <HierarchicalCell\n key={column.field.id}\n column={column}\n columnRendererProps={columnRendererProps}\n />\n );\n });\n };\n\n return (\n <StyledHierarchicalGroupHeader\n groupHeader={groupHeader}\n groupWidth={groupWidth}\n className={cx('row hierarchical-group-header-row sticky-group-header')}\n data-test-id='hierarchicalGroupHeader'\n >\n {renderStickyHeader()}\n {renderHierarchicalCells()}\n </StyledHierarchicalGroupHeader>\n );\n}\n\nHierarchicalGroupHeader.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport const HierarchicalGroupFooter = ({ columns, groupHeader }) => {\n const labelRef = useRef(null);\n const [labelLeft, setLabelLeft] = useState(0);\n const view = columns[0].parent;\n const parentContainer = view.virtualizeElements.rootVirtualiser?.getParentContainer();\n const footerWidth = parentContainer?.clientWidth;\n\n useLayoutEffect(() => {\n if (labelRef.current) {\n const { width } = labelRef.current.getBoundingClientRect();\n setLabelLeft(footerWidth - width - 5);\n }\n }, [groupHeader.isVisible, footerWidth]);\n\n if (!groupHeader.isVisible) return null;\n\n return (\n <StyledHierarchicalGroupFooter\n groupHeader={groupHeader}\n className={cx('row hierarchical-group-footer-row')}\n labelLeft={labelLeft}\n data-test-id='hierarchicalGroupFooter'\n >\n <div className='footer-label-container'>\n <div ref={labelRef} className='label'>\n {groupHeader.name}\n </div>\n </div>\n {columns.map(c => {\n const cxt = {\n getValue: () =>\n groupHeader?.aggregation?.[c.field.name]?.[c.aggregationType?.toLowerCase()]\n };\n return <AggregatorCell key={c.field.id} column={c} context={cxt} />;\n })}\n </StyledHierarchicalGroupFooter>\n );\n};\n\nHierarchicalGroupFooter.propTypes = {\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n groupHeader: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAwBA,oNAi5BG"}
1
+ {"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAwBA,oNAq6BG"}