@pega/lists-react 9.0.0-build.17.1 → 9.0.0-build.17.11
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/PersonalizationSelector.d.ts +0 -2
- package/lib/Core/Components/DefaultComponents/PersonalizationSelector.d.ts.map +1 -1
- package/lib/Core/Components/DefaultComponents/PersonalizationSelector.js +1 -5
- package/lib/Core/Components/DefaultComponents/PersonalizationSelector.js.map +1 -1
- package/lib/Core/Components/Grouping/GroupingMenu.d.ts.map +1 -1
- package/lib/Core/Components/Grouping/GroupingMenu.js +2 -1
- package/lib/Core/Components/Grouping/GroupingMenu.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.js +5 -3
- package/lib/Core/Components/Toolbar/hooks/useGroup/GroupRenderer.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/utils.d.ts +6 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/utils.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/utils.js +8 -1
- package/lib/Core/Components/Toolbar/hooks/useGroup/utils.js.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/usePersonalization.d.ts +0 -2
- package/lib/Core/Components/Toolbar/hooks/usePersonalization.d.ts.map +1 -1
- package/lib/Core/Components/Toolbar/hooks/usePersonalization.js +2 -2
- package/lib/Core/Components/Toolbar/hooks/usePersonalization.js.map +1 -1
- package/lib/Core/Views/Table/CellWrapper.d.ts.map +1 -1
- package/lib/Core/Views/Table/CellWrapper.js +4 -2
- package/lib/Core/Views/Table/CellWrapper.js.map +1 -1
- package/lib/Core/Views/Table/HeaderWrapper.d.ts.map +1 -1
- package/lib/Core/Views/Table/HeaderWrapper.js +4 -2
- package/lib/Core/Views/Table/HeaderWrapper.js.map +1 -1
- package/lib/Core/Views/Table/StyledTableContainer.d.ts.map +1 -1
- package/lib/Core/Views/Table/StyledTableContainer.js +12 -10
- package/lib/Core/Views/Table/StyledTableContainer.js.map +1 -1
- package/package.json +7 -7
|
@@ -18,8 +18,6 @@ export function usePersonalizationSelector({ personalization, nonPersonalization
|
|
|
18
18
|
}): {
|
|
19
19
|
actions: never[][];
|
|
20
20
|
activePersonalizationName: any;
|
|
21
|
-
defaultId: undefined;
|
|
22
|
-
appDefaultId: undefined;
|
|
23
21
|
};
|
|
24
22
|
import PropTypes from 'prop-types';
|
|
25
23
|
//# sourceMappingURL=PersonalizationSelector.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PersonalizationSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationSelector.jsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PersonalizationSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationSelector.jsx"],"names":[],"mappings":"AAwGA;;4CAYC;;;;;;;;;AA/EM;;;;;;;;;EAiEN;sBAtGqB,YAAY"}
|
|
@@ -36,16 +36,12 @@ export const usePersonalizationSelector = ({ personalization, nonPersonalization
|
|
|
36
36
|
name: personalizations[key]?.name,
|
|
37
37
|
isPreset: personalizations[key]?.isPreset
|
|
38
38
|
}));
|
|
39
|
-
let defaultId;
|
|
40
|
-
let appDefaultId;
|
|
41
39
|
const primaryName = option => {
|
|
42
40
|
if (option.id === 'APP_DEFAULT') {
|
|
43
|
-
appDefaultId = option.id;
|
|
44
41
|
return `${option.name} (app default)`;
|
|
45
42
|
// eslint-disable-next-line no-else-return
|
|
46
43
|
}
|
|
47
44
|
else if (option.id === defaultPersonalization) {
|
|
48
|
-
defaultId = option.id;
|
|
49
45
|
return `${option.name} (default)`;
|
|
50
46
|
}
|
|
51
47
|
else {
|
|
@@ -68,7 +64,7 @@ export const usePersonalizationSelector = ({ personalization, nonPersonalization
|
|
|
68
64
|
acc[1].push(obj);
|
|
69
65
|
return acc;
|
|
70
66
|
}, [[], []]);
|
|
71
|
-
return { actions, activePersonalizationName
|
|
67
|
+
return { actions, activePersonalizationName };
|
|
72
68
|
};
|
|
73
69
|
export default function PersonalizationSelector({ view }) {
|
|
74
70
|
const { state: { personalization }, meta: { nonPersonalizationViewName } } = view;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PersonalizationSelector.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationSelector.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAEhE,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,6BAA6B,MAAM,iCAAiC,CAAC;AAE5E,MAAM,sBAAsB,GAAG,CAC7B,MAAM,EACN,eAAe,EACf,8BAA8B,EAC9B,yBAAyB,EACzB,MAAM,EACN,SAAS,EACT,EAAE;IACF,IAAI,MAAM,CAAC,EAAE,KAAK,eAAe,CAAC,MAAM,EAAE,CAAC;QACzC,OAAO;IACT,CAAC;IACD,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,CAAC;QAC5B,8BAA8B,CAAC,MAAM,CAAC,CAAC;QACvC,OAAO;IACT,CAAC;IAED,MAAM,CACJ,6BAA6B,EAC7B;QACE,QAAQ,EAAE,GAAG,EAAE;YACb,8BAA8B,CAAC,MAAM,CAAC,CAAC;QACzC,CAAC;QACD,yBAAyB;QACzB,SAAS;KACV,EACD,EAAE,KAAK,EAAE,IAAI,EAAE,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,EACzC,eAAe,EACf,0BAA0B,EAC1B,8BAA8B,EAC9B,IAAI,EACJ,eAAe,EAChB,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,EAAE,MAAM,EAAE,GAAG,eAAe,EAAE,CAAC;IACrC,MAAM,gBAAgB,GAAG,eAAe,EAAE,mBAAmB,IAAI,EAAE,CAAC;IACpE,MAAM,qBAAqB,GAAG,eAAe,EAAE,MAAM,IAAI,eAAe,CAAC;IACzE,IAAI,yBAAyB,GAC3B,eAAe,EAAE,mBAAmB,EAAE,CAAC,qBAAqB,CAAC,EAAE,IAAI,CAAC;IACtE,IAAI,qBAAqB,KAAK,eAAe,EAAE,CAAC;QAC9C,yBAAyB,GAAG,IAAI,IAAI,0BAA0B,CAAC;IACjE,CAAC;IACD,MAAM,iBAAiB,GAAG,gBAAgB,EAAE,WAAW,EAAE,oBAAoB,EAAE,QAAQ,CAAC;IAExF,MAAM,sBAAsB,GAAG,eAAe,EAAE,sBAAsB,CAAC;IAEvE,MAAM,EAAE,CAAC,iBAAiB,CAAC,EAAE,CAAC,EAAE,GAAG,wBAAwB,EAAE,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAEvF,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAChE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,gBAAgB,CAAC,GAAG,CAAC,EAAE,IAAI;QACjC,QAAQ,EAAE,gBAAgB,CAAC,GAAG,CAAC,EAAE,QAAQ;KAC1C,CAAC,CAAC,CAAC;IAEJ,
|
|
1
|
+
{"version":3,"file":"PersonalizationSelector.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { Menu, useModalManager } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport PersonalizationUnsavedWarning from './PersonalizationUnsavedWarning';\n\nconst personalisationClicked = (\n option,\n personalization,\n actionPersonalizationSetActive,\n activePersonalizationName,\n create,\n translate\n) => {\n if (option.id === personalization.active) {\n return;\n }\n if (!personalization?.dirty) {\n actionPersonalizationSetActive(option);\n return;\n }\n\n create(\n PersonalizationUnsavedWarning,\n {\n onSubmit: () => {\n actionPersonalizationSetActive(option);\n },\n activePersonalizationName,\n translate\n },\n { alert: true }\n );\n};\n\nexport const usePersonalizationSelector = ({\n personalization,\n nonPersonalizationViewName,\n actionPersonalizationSetActive,\n name,\n defaultPresetId\n}) => {\n const [translate] = useTranslate();\n const { create } = useModalManager();\n const personalizations = personalization?.allPersonalizations || {};\n const activePersonalization = personalization?.active || defaultPresetId;\n let activePersonalizationName =\n personalization?.allPersonalizations?.[activePersonalization]?.name;\n if (activePersonalization === defaultPresetId) {\n activePersonalizationName = name ?? nonPersonalizationViewName;\n }\n const dependentPresetId = personalizations?.APP_DEFAULT?.personalizationState?.presetId;\n\n const defaultPersonalization = personalization?.defaultPersonalization;\n\n const { [dependentPresetId]: _, ...filteredPersonalizations } = personalizations ?? {};\n\n const options = Object.keys(filteredPersonalizations).map(key => ({\n id: key,\n name: personalizations[key]?.name,\n isPreset: personalizations[key]?.isPreset\n }));\n\n const primaryName = option => {\n if (option.id === 'APP_DEFAULT') {\n return `${option.name} (app default)`;\n // eslint-disable-next-line no-else-return\n } else if (option.id === defaultPersonalization) {\n return `${option.name} (default)`;\n } else {\n return option.name;\n }\n };\n\n const actions = options.reduce(\n (acc, option) => {\n const obj = {\n id: option.id,\n primary: primaryName(option),\n text: option.name,\n selected: option.id === activePersonalization,\n onClick: () => {\n personalisationClicked(\n option,\n personalization,\n actionPersonalizationSetActive,\n activePersonalizationName,\n create,\n translate\n );\n }\n };\n if (option.isPreset) acc[0].push(obj);\n else acc[1].push(obj);\n return acc;\n },\n [[], []]\n );\n\n return { actions, activePersonalizationName };\n};\n\nexport default function PersonalizationSelector({ view }) {\n const {\n state: { personalization },\n meta: { nonPersonalizationViewName }\n } = view;\n const { actions } = usePersonalizationSelector({\n personalization,\n nonPersonalizationViewName,\n actionPersonalizationSetActive: view.type.applyActivePersonalization\n });\n\n return <Menu className='action-menu' items={actions} mode='single-select' />;\n}\n\nPersonalizationSelector.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupingMenu.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Grouping/GroupingMenu.jsx"],"names":[],"mappings":"AA0BA;;;
|
|
1
|
+
{"version":3,"file":"GroupingMenu.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Grouping/GroupingMenu.jsx"],"names":[],"mappings":"AA0BA;;;mDAsEC;;;;;;;;;;sBAhGqB,YAAY"}
|
|
@@ -52,7 +52,8 @@ export default function GroupingMenu({ column, finishPopOver }) {
|
|
|
52
52
|
columnId: column.field.id,
|
|
53
53
|
dateFunction: selectedDateFunction,
|
|
54
54
|
level: groups.length,
|
|
55
|
-
order
|
|
55
|
+
// Set sort order from column else default to 'asc'
|
|
56
|
+
order: column.sortOrder ?? 'asc'
|
|
56
57
|
};
|
|
57
58
|
applyGrouping([...groups, newGroup]);
|
|
58
59
|
finishPopOver();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupingMenu.js","sourceRoot":"","sources":["../../../../Core/Components/Grouping/GroupingMenu.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE/E,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAA;;;;;CAKjC,CAAC;AAEF,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;aAC1B,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO;;;;eAI1C,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;oBACxC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;;CAGhE,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE;IAC5D,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;IAC5E,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC;IAC3B,MAAM,EACJ,IAAI,EAAE,EAAE,aAAa,EAAE,EACvB,KAAK,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,EACtB,IAAI,EAAE,EAAE,aAAa,EAAE,EACxB,GAAG,IAAI,CAAC;IAET,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;IACpC,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,6EAA6E;QAC7E,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC;YACjF,OAAO,EAAE,CAAC;QACZ,CAAC;QAED,OAAO;YACL,qDAAqD;YACrD,GAAG,aAAa,CAAC,SAAS,KAAK,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;gBACnF,GAAG,EAAE,CAAC;gBACN,YAAY,EAAE,CAAC;gBACf,KAAK,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;aACxC,CAAC,CAAC;YAEH,mDAAmD;YACnD,6DAA6D;YAC7D,EAAE,GAAG,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;SAC3D,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAE1C,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC5B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,MAAM,QAAQ,GAAG;YACf,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE;YACzB,YAAY,EAAE,oBAAoB;YAClC,KAAK,EAAE,MAAM,CAAC,MAAM;YACpB,KAAK,EAAE,KAAK;
|
|
1
|
+
{"version":3,"file":"GroupingMenu.js","sourceRoot":"","sources":["../../../../Core/Components/Grouping/GroupingMenu.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useMemo, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Button, Flex, Option, Select } from '@pega/cosmos-react-core';\nimport { dateFunctionLabels, FieldType } from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst StyledFooter = styled.footer`\n margin-top: 0.625rem;\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n`;\n\nconst StyledGroupingMenu = styled(Flex)`\n z-index: ${props => props.theme.base['z-index'].popover};\n max-height: 35.156rem;\n padding: 0.625rem;\n overflow: auto;\n max-width: ${props => props.theme.base['content-width'].lg};\n min-width: calc(${props => props.theme.base['content-width'].lg} * 0.3125);\n display: flex;\n flex-direction: column;\n`;\nexport default function GroupingMenu({ column, finishPopOver }) {\n const [translate] = useTranslate();\n const [selectedDateFunction, setSelectedDateFunction] = useState(undefined);\n const view = column.parent;\n const {\n meta: { dateFunctions },\n state: { groups = [] },\n type: { applyGrouping }\n } = view;\n\n const fieldType = column.field.type;\n const allOptions = useMemo(() => {\n // If date functions are disabled or not applicable to the current field type\n if (!dateFunctions || ![FieldType.DATE, FieldType.DATE_TIME].includes(fieldType)) {\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 if (allOptions.length === 0) {\n return null;\n }\n\n const onSubmit = () => {\n const newGroup = {\n columnId: column.field.id,\n dateFunction: selectedDateFunction,\n level: groups.length,\n // Set sort order from column else default to 'asc'\n order: column.sortOrder ?? 'asc'\n };\n applyGrouping([...groups, newGroup]);\n finishPopOver();\n };\n\n return (\n <StyledGroupingMenu>\n <Select\n label='Date function'\n labelHidden\n data-test-id='GroupingDateFuncSelector'\n value={selectedDateFunction || 'NONE'} // Can't set up `undefined` as value\n onChange={e => setSelectedDateFunction(e.target.value)}\n >\n {allOptions.map(o => (\n <Option key={o.key} value={o.key}>\n {translate(o.label)}\n </Option>\n ))}\n </Select>\n <StyledFooter>\n <Button onClick={finishPopOver}>{translate('Cancel')}</Button>\n <Button variant='primary' onClick={onSubmit}>\n {translate('Submit')}\n </Button>\n </StyledFooter>\n </StyledGroupingMenu>\n );\n}\n\nGroupingMenu.propTypes = {\n column: PropTypes.objectOf(PropTypes.any).isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7E,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;CAClD;AAED,QAAA,MAAM,aAAa,GAAI,uEAMpB,kBAAkB,
|
|
1
|
+
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7E,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;CAClD;AAED,QAAA,MAAM,aAAa,GAAI,uEAMpB,kBAAkB,4CA4LpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -7,7 +7,7 @@ import { FieldType } from 'pega-repeating-structures-core';
|
|
|
7
7
|
import useRowFocus from '../useRowFocus';
|
|
8
8
|
import useDragDrop from '../../../../Hooks/useDragDrop';
|
|
9
9
|
import FieldSelector from '../../FieldSelector';
|
|
10
|
-
import {
|
|
10
|
+
import { getColumnById } from './utils';
|
|
11
11
|
import DateFunctionSelector from './DateFunctionSelector';
|
|
12
12
|
const DropSelector = '[data-drop]';
|
|
13
13
|
const StyledDragHandle = styled(Button) `
|
|
@@ -47,13 +47,15 @@ const GroupRenderer = ({ appliedGroups, groupingOptions, setGroups, columns, dat
|
|
|
47
47
|
const handleColumnChange = useCallback((group, index, newID) => {
|
|
48
48
|
if (newID === group.columnId)
|
|
49
49
|
return; // Ignore re-selecting the same
|
|
50
|
+
const groupedColumn = getColumnById(newID, columns);
|
|
50
51
|
const updatedGroup = {
|
|
51
52
|
...group,
|
|
52
53
|
columnId: newID,
|
|
53
|
-
dateFunction: undefined // Reset for non-date/time fields
|
|
54
|
+
dateFunction: undefined, // Reset for non-date/time fields,
|
|
55
|
+
order: groupedColumn?.sortOrder || 'asc' // Set sort order from column else default to 'asc'
|
|
54
56
|
};
|
|
55
57
|
// For date/datetime field, pick a date function by default (if enabled)
|
|
56
|
-
const fieldType =
|
|
58
|
+
const fieldType = groupedColumn?.field.type;
|
|
57
59
|
if (dateFunctions && (fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {
|
|
58
60
|
updatedGroup.dateFunction = groupingOptions.dateFuncs[newID]
|
|
59
61
|
? groupingOptions.dateFuncs[newID].available[0] // If the field is already picked before
|
|
@@ -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 { getFieldType } 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 updatedGroup: Group = {\n ...group,\n columnId: newID,\n dateFunction: undefined // Reset for non-date/time fields\n };\n\n // For date/datetime field, pick a date function by default (if enabled)\n const fieldType = getFieldType(newID, columns);\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":"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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,11 +1,16 @@
|
|
|
1
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
|
+
/**
|
|
5
|
+
* Finds the matching column for the given id.
|
|
6
|
+
* Returns `undefined` if no match found
|
|
7
|
+
*/
|
|
8
|
+
export declare function getColumnById(id: string, columns: RsCoreTypes.Column[]): import("pega-repeating-structures-core/lib/src/core/generators/ColumnGenerator").default | undefined;
|
|
4
9
|
/**
|
|
5
10
|
* Finds the matching column for the given columnId and returns its field type.
|
|
6
11
|
* Returns `undefined` if no match found
|
|
7
12
|
*/
|
|
8
|
-
export declare function getFieldType(columnId:
|
|
13
|
+
export declare function getFieldType(columnId: string, columns: RsCoreTypes.Column[]): "number" | "boolean" | "object" | "text" | "time" | "action" | "date" | "custom" | "currency" | "datetime" | "URL" | "Date" | "Date only" | undefined;
|
|
9
14
|
/** Returns metadata to identify which fields and which date functions are/aren't available for selection */
|
|
10
15
|
export declare function getGroupingOptions(groups: Group[], columns: RsCoreTypes.Column[], dateFunctions: RsCoreTypes.Meta['dateFunctions']): GroupingOptions;
|
|
11
16
|
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAE9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D;;;GAGG;AACH,wBAAgB,
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAE9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,wGAEtE;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,yJAE3E;AAED,4GAA4G;AAC5G,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,KAAK,EAAE,EACf,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,EAC7B,aAAa,EAAE,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,GAC/C,eAAe,CA2DjB"}
|
|
@@ -1,10 +1,17 @@
|
|
|
1
1
|
import { FieldType } from 'pega-repeating-structures-core';
|
|
2
|
+
/**
|
|
3
|
+
* Finds the matching column for the given id.
|
|
4
|
+
* Returns `undefined` if no match found
|
|
5
|
+
*/
|
|
6
|
+
export function getColumnById(id, columns) {
|
|
7
|
+
return columns.find(c => c.field.id === id);
|
|
8
|
+
}
|
|
2
9
|
/**
|
|
3
10
|
* Finds the matching column for the given columnId and returns its field type.
|
|
4
11
|
* Returns `undefined` if no match found
|
|
5
12
|
*/
|
|
6
13
|
export function getFieldType(columnId, columns) {
|
|
7
|
-
return
|
|
14
|
+
return getColumnById(columnId, columns)?.field.type;
|
|
8
15
|
}
|
|
9
16
|
/** Returns metadata to identify which fields and which date functions are/aren't available for selection */
|
|
10
17
|
export function getGroupingOptions(groups, columns, dateFunctions) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoB,MAAM,gCAAgC,CAAC;AAK7E;;;GAGG;AACH,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport type { GroupingOptions } from '../../Grouping.types';\n\n/**\n * Finds the matching column for the given id.\n * Returns `undefined` if no match found\n */\nexport function getColumnById(id: string, columns: RsCoreTypes.Column[]) {\n return columns.find(c => c.field.id === id);\n}\n\n/**\n * Finds the matching column for the given columnId and returns its field type.\n * Returns `undefined` if no match found\n */\nexport function getFieldType(columnId: string, columns: RsCoreTypes.Column[]) {\n return getColumnById(columnId, columns)?.field.type;\n}\n\n/** Returns metadata to identify which fields and which date functions are/aren't available for selection */\nexport function getGroupingOptions(\n groups: Group[],\n columns: RsCoreTypes.Column[],\n dateFunctions: RsCoreTypes.Meta['dateFunctions']\n): GroupingOptions {\n const groupingOptions: GroupingOptions = {\n // Set of fields that are already exhausted in grouping\n // NOTE: For date/datetime fields, when dateFunctions are enabled, it doesn't mark a field as exhausted until all the date-function variants are used against that field\n exhaustedFields: new Set(),\n\n // Contains field-wise lookups with values of structure { exhausted, available }\n dateFuncs: {},\n\n // Possible `dateFunction` choices by field type\n dateGroupVariants: {\n date: [],\n datetime: []\n }\n };\n\n // Traverse all the groups and mark which all fields and date functions are exhausted already\n groups.forEach(({ columnId, dateFunction }) => {\n if (columnId === '') return; // Ignore empty groups\n const fieldType = getFieldType(columnId, columns);\n\n // If date functions are enabled, and it's a date/datetime field, track the functions used\n if (dateFunctions && (fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME)) {\n groupingOptions.dateFuncs[columnId] = groupingOptions.dateFuncs[columnId] || {\n exhausted: [],\n available: []\n };\n groupingOptions.dateFuncs[columnId].exhausted.push(dateFunction); // `dateFunction` could be undefined\n } else {\n // Otherwise, simply mark the columns as exhausted\n groupingOptions.exhaustedFields.add(columnId);\n }\n });\n\n // When dateFunctions are enabled, determine which date/datetime fields are fully exhausted and also note which functions are available for each field\n if (dateFunctions) {\n // Identify all possible variants for a given field type\n // The `undefined` variant is applied when we group data directly by a field's values without any date function\n groupingOptions.dateGroupVariants = {\n date: [...dateFunctions.DATE_ONLY, undefined],\n datetime: [...dateFunctions.DATE_TIME, undefined]\n };\n\n // For each date/datetime field, set up which variants are yet to be used. Also determine if all the variants are exhausted\n Object.entries(groupingOptions.dateFuncs).forEach(([columnId, obj]) => {\n const fieldType = getFieldType(columnId, columns);\n if (fieldType === FieldType.DATE || fieldType === FieldType.DATE_TIME) {\n obj.available = groupingOptions.dateGroupVariants[fieldType].filter(\n v => !obj.exhausted.includes(v)\n );\n }\n\n if (obj.available.length === 0) {\n groupingOptions.exhaustedFields.add(columnId);\n }\n });\n }\n\n return groupingOptions;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePersonalization.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/hooks/usePersonalization.js"],"names":[],"mappings":";AAEA
|
|
1
|
+
{"version":3,"file":"usePersonalization.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/hooks/usePersonalization.js"],"names":[],"mappings":";AAEA;;;;;;;;EAoBC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { usePersonalizationSelector } from '../../DefaultComponents/PersonalizationSelector';
|
|
2
2
|
const usePersonalization = ({ view }) => {
|
|
3
3
|
const { state: { personalization } = {}, meta: { nonPersonalizationViewName, name }, defaultPresetId } = view;
|
|
4
|
-
const { actions
|
|
4
|
+
const { actions } = usePersonalizationSelector({
|
|
5
5
|
personalization,
|
|
6
6
|
nonPersonalizationViewName,
|
|
7
7
|
actionPersonalizationSetActive: view.type.applyActivePersonalization,
|
|
@@ -11,7 +11,7 @@ const usePersonalization = ({ view }) => {
|
|
|
11
11
|
if (!personalization) {
|
|
12
12
|
return {};
|
|
13
13
|
}
|
|
14
|
-
return { viewSelector: { views: actions.flat()
|
|
14
|
+
return { viewSelector: { views: actions.flat() } };
|
|
15
15
|
};
|
|
16
16
|
export default usePersonalization;
|
|
17
17
|
//# sourceMappingURL=usePersonalization.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePersonalization.js","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/hooks/usePersonalization.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iDAAiD,CAAC;AAE7F,MAAM,kBAAkB,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IACtC,MAAM,EACJ,KAAK,EAAE,EAAE,eAAe,EAAE,GAAG,EAAE,EAC/B,IAAI,EAAE,EAAE,0BAA0B,EAAE,IAAI,EAAE,EAC1C,eAAe,EAChB,GAAG,IAAI,CAAC;IAET,MAAM,EAAE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"usePersonalization.js","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/hooks/usePersonalization.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iDAAiD,CAAC;AAE7F,MAAM,kBAAkB,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IACtC,MAAM,EACJ,KAAK,EAAE,EAAE,eAAe,EAAE,GAAG,EAAE,EAC/B,IAAI,EAAE,EAAE,0BAA0B,EAAE,IAAI,EAAE,EAC1C,eAAe,EAChB,GAAG,IAAI,CAAC;IAET,MAAM,EAAE,OAAO,EAAE,GAAG,0BAA0B,CAAC;QAC7C,eAAe;QACf,0BAA0B;QAC1B,8BAA8B,EAAE,IAAI,CAAC,IAAI,CAAC,0BAA0B;QACpE,IAAI;QACJ,eAAe;KAChB,CAAC,CAAC;IAEH,IAAI,CAAC,eAAe,EAAE,CAAC;QACrB,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,CAAC;AACrD,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { usePersonalizationSelector } from '../../DefaultComponents/PersonalizationSelector';\n\nconst usePersonalization = ({ view }) => {\n const {\n state: { personalization } = {},\n meta: { nonPersonalizationViewName, name },\n defaultPresetId\n } = view;\n\n const { actions } = usePersonalizationSelector({\n personalization,\n nonPersonalizationViewName,\n actionPersonalizationSetActive: view.type.applyActivePersonalization,\n name,\n defaultPresetId\n });\n\n if (!personalization) {\n return {};\n }\n\n return { viewSelector: { views: actions.flat() } };\n};\n\nexport default usePersonalization;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CellWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":"AAyCA,gNAkBG;;;AAEH;;;4CAyDC;;;;;;;;;sBAtHqB,YAAY"}
|
|
@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { memo, useCallback, useRef } from 'react';
|
|
4
4
|
import styled, { css } from 'styled-components';
|
|
5
|
+
import { FieldType } from 'pega-repeating-structures-core';
|
|
5
6
|
import { Icon, VisuallyHiddenText } from '@pega/cosmos-react-core';
|
|
6
7
|
import { createClassName as cx } from '../../Utils';
|
|
7
8
|
import RenderingEngine from '../../Components/RenderingEngine/RenderCell';
|
|
@@ -49,7 +50,7 @@ export const CellIcon = styled(Icon)(({ cellAlign }) => {
|
|
|
49
50
|
});
|
|
50
51
|
function CellWrapper({ column, level = 0 }) {
|
|
51
52
|
const ref = useRef();
|
|
52
|
-
const { field: { cellAlign }, isCustomColumn, isLastColumn, isFirstVisualColumn, getCellStyleFormat } = column;
|
|
53
|
+
const { field: { cellAlign, type: fieldType }, isCustomColumn, isLastColumn, isFirstVisualColumn, getCellStyleFormat } = column;
|
|
53
54
|
const { classList, style: cellStyle, ...restProps } = column.getUIProps();
|
|
54
55
|
const { config: styleFormatConfig = {}, label: styleFormatLabel, id: styleFormatId } = getCellStyleFormat() ?? {};
|
|
55
56
|
const { foregroundColor, icon: cellIconProps } = styleFormatConfig;
|
|
@@ -63,7 +64,8 @@ function CellWrapper({ column, level = 0 }) {
|
|
|
63
64
|
'cell-fixed': column.frozen,
|
|
64
65
|
'cell-last': isLastColumn,
|
|
65
66
|
'cell-first': isFirstVisualColumn,
|
|
66
|
-
'cell-last-frozen': column.lastFrozen
|
|
67
|
+
'cell-last-frozen': column.lastFrozen,
|
|
68
|
+
'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE
|
|
67
69
|
}, !isCustomColumn && cellAlign && CELL_ALIGN_CLASSES[cellAlign]), style: cellStyles, ref: ref, tabIndex: -1, "data-style-format": styleFormatId, children: [_jsx(RenderingEngine, { style: renderingEngineStyles, highlighter: true, ...column.getRenderingEngineProps(), context: context }), cellIconProps && _jsx(CellIcon, { ...cellIconProps, cellAlign: cellAlign, set: 'budicon' }), styleFormatId && (_jsx(VisuallyHiddenText, { id: styleFormatId, children: `,${translate('state')}: ${styleFormatLabel},` }))] }));
|
|
68
70
|
}
|
|
69
71
|
CellWrapper.propTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAEnE,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAC1E,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,uCAAuC,EAAE,MAAM,4CAA4C,CAAC;AACrG,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,MAAM,SAAS,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAAE;IACrD,MAAM,EACJ,iBAAiB,EACjB,MAAM,EACN,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC7B,GAAG,MAAM,CAAC;IACX,MAAM,EAAE,eAAe,EAAE,IAAI,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,iBAAiB,CAAC;IAEpF,MAAM,UAAU,GAAG;QACjB,IAAI,EAAE,kBAAkB,MAAM,GAAG;QACjC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,GAAG,CAAC,eAAe,IAAI,EAAE,eAAe,EAAE,CAAC;QAC3C,GAAG,CAAC,iBAAiB,IAAI,MAAM,EAAE,wBAAwB,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC;KACjF,CAAC;IAEF,MAAM,qBAAqB,GAAG;QAC5B,GAAG,CAAC,iBAAiB;YACnB,MAAM,EAAE,wBAAwB,IAAI;YAClC,WAAW,EAAE,uCAAuC,CAAC,KAAK,CAAC;SAC5D,CAAC;QACJ,GAAG,CAAC,aAAa,IAAI,EAAE,KAAK,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9D,GAAG,CAAC,eAAe,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,CAAC;KACnD,CAAC;IAEF,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,CAAC;AAC/C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;IACrD,iBAAiB;IACjB,OAAO,GAAG,CAAA;;;;;;;;;;2BAUe,SAAS,KAAK,OAAO,IAAI,QAAQ;6BAC/B,SAAS,KAAK,OAAO,IAAI,QAAQ;eAC/C,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;GAGzC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,SAAS,WAAW,CAAC,EAAE,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE;IACxC,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,KAAK,EAAE,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"CellWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { memo, useCallback, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { FieldType } from 'pega-repeating-structures-core';\nimport { Icon, VisuallyHiddenText } from '@pega/cosmos-react-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport RenderingEngine from '../../Components/RenderingEngine/RenderCell';\nimport { CELL_ALIGN_CLASSES } from '../../constants';\nimport { hierarchicalgroupheaderleftdisplacement } from '../../Components/HierarchicalGroupRenderer';\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst getStyles = (column, level, styleFormatConfig) => {\n const {\n isFirstDataColumn,\n parent,\n field: { idHash, cellAlign }\n } = column;\n const { backgroundColor, icon: cellIconProps, foregroundColor } = styleFormatConfig;\n\n const cellStyles = {\n left: `var(--col-left-${idHash})`,\n order: `var(--col-order-${idHash})`,\n width: `var(--col-width-${idHash})`,\n ...(backgroundColor && { backgroundColor }),\n ...(isFirstDataColumn && parent?.hierarchicalGroupEnabled && { paddingLeft: 0 })\n };\n\n const renderingEngineStyles = {\n ...(isFirstDataColumn &&\n parent?.hierarchicalGroupEnabled && {\n paddingLeft: hierarchicalgroupheaderleftdisplacement(level)\n }),\n ...(cellIconProps && { order: cellAlign === 'right' ? 2 : 1 }),\n ...(foregroundColor && { color: foregroundColor })\n };\n\n return { cellStyles, renderingEngineStyles };\n};\n\nexport const CellIcon = styled(Icon)(({ cellAlign }) => {\n // icon size 12px\n return css`\n /*\n * Icon styles sometimes fail to override correctly. Increasing specificity ensures consistent override behavior.\n * https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity\n */\n &&& {\n height: 0.75rem;\n width: 0.75rem;\n min-width: 0.75rem;\n min-height: 0.75rem;\n margin-inline-end: ${cellAlign !== 'right' && '0.5rem'};\n margin-inline-start: ${cellAlign === 'right' && '0.5rem'};\n order: ${cellAlign === 'right' ? 1 : 2};\n flex-shrink: 0;\n }\n `;\n});\n\nfunction CellWrapper({ column, level = 0 }) {\n const ref = useRef();\n const {\n field: { cellAlign, type: fieldType },\n isCustomColumn,\n isLastColumn,\n isFirstVisualColumn,\n getCellStyleFormat\n } = column;\n const { classList, style: cellStyle, ...restProps } = column.getUIProps();\n const {\n config: styleFormatConfig = {},\n label: styleFormatLabel,\n id: styleFormatId\n } = getCellStyleFormat() ?? {};\n const { foregroundColor, icon: cellIconProps } = styleFormatConfig;\n const context = {\n getElement: () => ref.current,\n getStyles: useCallback(() => ({ foregroundColor }), [foregroundColor])\n };\n const { cellStyles, renderingEngineStyles } = getStyles(column, level, styleFormatConfig);\n const [translate] = useTranslate();\n\n return (\n <div\n {...restProps}\n className={cx(\n 'cell',\n ...classList,\n {\n 'cell-fixed': column.frozen,\n 'cell-last': isLastColumn,\n 'cell-first': isFirstVisualColumn,\n 'cell-last-frozen': column.lastFrozen,\n 'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE\n },\n !isCustomColumn && cellAlign && CELL_ALIGN_CLASSES[cellAlign]\n )}\n style={cellStyles}\n ref={ref}\n tabIndex={-1}\n data-style-format={styleFormatId}\n >\n <RenderingEngine\n style={renderingEngineStyles}\n highlighter\n {...column.getRenderingEngineProps()}\n context={context}\n />\n {cellIconProps && <CellIcon {...cellIconProps} cellAlign={cellAlign} set='budicon' />}\n {styleFormatId && (\n <VisuallyHiddenText\n id={styleFormatId}\n >{`,${translate('state')}: ${styleFormatLabel},`}</VisuallyHiddenText>\n )}\n </div>\n );\n}\n\nCellWrapper.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n level: PropTypes.number\n};\n\nexport default memo(CellWrapper);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"HeaderWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAUA;;4CA0CC;;;;;;;;sBAnDqB,YAAY"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useRef } from 'react';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
|
+
import { FieldType } from 'pega-repeating-structures-core';
|
|
4
5
|
import { createClassName as cx } from '../../Utils';
|
|
5
6
|
import TableHeaderCell from '../../Components/HeaderCell';
|
|
6
7
|
import useSort from './UseSort';
|
|
7
8
|
function HeaderWrapper({ column }) {
|
|
8
|
-
const { field: { id, idHash, cellAlign }, isCustomColumn, isLastColumn, isFirstVisualColumn, label } = column;
|
|
9
|
+
const { field: { id, idHash, cellAlign, type: fieldType }, isCustomColumn, isLastColumn, isFirstVisualColumn, label } = column;
|
|
9
10
|
const { classList } = column.getUIProps();
|
|
10
11
|
const header = useRef();
|
|
11
12
|
const popoverButtonRef = useRef();
|
|
@@ -22,7 +23,8 @@ function HeaderWrapper({ column }) {
|
|
|
22
23
|
'cell-right-align': !isCustomColumn && cellAlign === 'right',
|
|
23
24
|
'cell-last': isLastColumn,
|
|
24
25
|
'cell-first': isFirstVisualColumn,
|
|
25
|
-
'cell-last-frozen': column.lastFrozen
|
|
26
|
+
'cell-last-frozen': column.lastFrozen,
|
|
27
|
+
'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE
|
|
26
28
|
}), role: 'columnheader', style: styles, ref: header, "aria-label": label, "aria-colindex": column.order + 1, tabIndex: -1, "data-col-id": id, ...column.getHeaderUIProps(), children: _jsx(TableHeaderCell, { column: column, popoverButtonRef: popoverButtonRef }) }));
|
|
27
29
|
}
|
|
28
30
|
HeaderWrapper.propTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAE1D,OAAO,OAAO,MAAM,WAAW,CAAC;AAEhC,SAAS,aAAa,CAAC,EAAE,MAAM,EAAE;IAC/B,MAAM,EACJ,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"HeaderWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAE1D,OAAO,OAAO,MAAM,WAAW,CAAC;AAEhC,SAAS,aAAa,CAAC,EAAE,MAAM,EAAE;IAC/B,MAAM,EACJ,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,EACjD,cAAc,EACd,YAAY,EACZ,mBAAmB,EACnB,KAAK,EACN,GAAG,MAAM,CAAC;IACX,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,UAAU,EAAE,CAAC;IAC1C,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB,MAAM,gBAAgB,GAAG,MAAM,EAAE,CAAC;IAClC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAExB,MAAM,MAAM,GAAG;QACb,IAAI,EAAE,kBAAkB,MAAM,GAAG;QACjC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,MAAM,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EAAE;KACpD,CAAC;IACF,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,GAAG,SAAS,EAAE;YAClC,YAAY,EAAE,MAAM,CAAC,MAAM;YAC3B,wGAAwG;YACxG,kBAAkB,EAAE,CAAC,cAAc,IAAI,SAAS,KAAK,OAAO;YAC5D,WAAW,EAAE,YAAY;YACzB,YAAY,EAAE,mBAAmB;YACjC,kBAAkB,EAAE,MAAM,CAAC,UAAU;YACrC,oBAAoB,EAAE,SAAS,KAAK,SAAS,CAAC,iBAAiB;SAChE,CAAC,EACF,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,gBACC,KAAK,mBACF,MAAM,CAAC,KAAK,GAAG,CAAC,EAC/B,QAAQ,EAAE,CAAC,CAAC,iBACC,EAAE,KACX,MAAM,CAAC,gBAAgB,EAAE,YAE7B,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,GAAI,GACnE,CACP,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,SAAS,GAAG;IACxB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACrD,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FieldType } from 'pega-repeating-structures-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport TableHeaderCell from '../../Components/HeaderCell';\n\nimport useSort from './UseSort';\n\nfunction HeaderWrapper({ column }) {\n const {\n field: { id, idHash, cellAlign, type: fieldType },\n isCustomColumn,\n isLastColumn,\n isFirstVisualColumn,\n label\n } = column;\n const { classList } = column.getUIProps();\n const header = useRef();\n const popoverButtonRef = useRef();\n useSort(header, column);\n\n const styles = {\n left: `var(--col-left-${idHash})`,\n order: `var(--col-order-${idHash})`,\n width: `var(--col-width-${idHash})`,\n cursor: `${column.field.sort ? 'pointer' : 'auto'}`\n };\n return (\n <div\n className={cx('cell', ...classList, {\n 'cell-fixed': column.frozen,\n // For now going with align right handling only as we don't have requirement of align center for header.\n 'cell-right-align': !isCustomColumn && cellAlign === 'right',\n 'cell-last': isLastColumn,\n 'cell-first': isFirstVisualColumn,\n 'cell-last-frozen': column.lastFrozen,\n 'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE\n })}\n role='columnheader'\n style={styles}\n ref={header}\n aria-label={label}\n aria-colindex={column.order + 1}\n tabIndex={-1}\n data-col-id={id}\n {...column.getHeaderUIProps()}\n >\n <TableHeaderCell column={column} popoverButtonRef={popoverButtonRef} />\n </div>\n );\n}\n\nHeaderWrapper.propTypes = {\n column: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport default HeaderWrapper;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAwBA,
|
|
1
|
+
{"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAwBA,oNAy4BG"}
|
|
@@ -175,11 +175,8 @@ const StyledTableContainer = styled(forwardRef((props, ref) => _jsx("div", { ref
|
|
|
175
175
|
}
|
|
176
176
|
|
|
177
177
|
.cell:focus {
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
.cell.selection-border:focus {
|
|
182
|
-
outline: none 0;
|
|
178
|
+
box-shadow: ${theme.base.shadow['focus-inset']};
|
|
179
|
+
outline: none;
|
|
183
180
|
}
|
|
184
181
|
|
|
185
182
|
.row {
|
|
@@ -304,7 +301,9 @@ const StyledTableContainer = styled(forwardRef((props, ref) => _jsx("div", { ref
|
|
|
304
301
|
css `
|
|
305
302
|
&.cell-last-frozen {
|
|
306
303
|
border-right: solid 1px var(--border-color-freeze);
|
|
307
|
-
|
|
304
|
+
filter: drop-shadow(
|
|
305
|
+
calc(${theme.base.spacing} * 0.25) 0 0 ${freezeLineShadowTransparent}
|
|
306
|
+
);
|
|
308
307
|
transition: 0.5s;
|
|
309
308
|
}
|
|
310
309
|
`}
|
|
@@ -630,10 +629,6 @@ const StyledTableContainer = styled(forwardRef((props, ref) => _jsx("div", { ref
|
|
|
630
629
|
* Vertical alignment is done using flex and max-height below even though the .cell-content might overflow due to padding + content size.
|
|
631
630
|
*/
|
|
632
631
|
box-sizing: content-box;
|
|
633
|
-
white-space: nowrap;
|
|
634
|
-
text-overflow: ellipsis;
|
|
635
|
-
overflow: hidden;
|
|
636
|
-
word-break: break-all;
|
|
637
632
|
flex-grow: 1;
|
|
638
633
|
|
|
639
634
|
/* Adding padding on .cell-content so that focus rings can appear properly and doesn't clip due to overflow: hidden */
|
|
@@ -656,6 +651,13 @@ const StyledTableContainer = styled(forwardRef((props, ref) => _jsx("div", { ref
|
|
|
656
651
|
}
|
|
657
652
|
}
|
|
658
653
|
}
|
|
654
|
+
|
|
655
|
+
& > .row .cell:not(.column-type-action) .cell-content {
|
|
656
|
+
white-space: nowrap;
|
|
657
|
+
text-overflow: ellipsis;
|
|
658
|
+
overflow: hidden;
|
|
659
|
+
word-break: break-all;
|
|
660
|
+
}
|
|
659
661
|
}
|
|
660
662
|
|
|
661
663
|
.row .aggregateCell .cell-content {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StyledTableContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n getLuminance,\n meetsContrastGuidelines,\n mix,\n readableColor,\n transparentize\n} from 'polished';\n\nimport { StyledStatus } from '@pega/cosmos-react-core/lib/components/Badges/Status';\nimport { StyledRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\nimport {\n StyledLabel,\n StyledProgressBackdrop,\n calculateFontSize,\n tryCatch\n} from '@pega/cosmos-react-core';\nimport { StyledTabPanel } from '@pega/cosmos-react-core/lib/components/Tabs/TabPanel';\n\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\n\nimport { CellIcon } from './CellWrapper';\n\nconst StyledTableContainer = styled(forwardRef((props, ref) => <div ref={ref} {...props} />))(({\n theme,\n view,\n isFullscreen\n}) => {\n let colIdToFillRemainingSpace;\n let isAggregationApplied = false;\n\n (view.columns ?? [])\n .filter(c => !c.hidden)\n .forEach(c => {\n if (!colIdToFillRemainingSpace && c.field.fillAvailableSpace) {\n colIdToFillRemainingSpace = c.field.id;\n }\n if (c.aggregated) {\n isAggregationApplied = true;\n }\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n const showFreezeLine =\n view.state.responsive?.sm &&\n !(view.hasNoRecords || view.hasNoFrozenColumns || view.bHideFreezeLine);\n const selectedRowColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n const lightGreyColor = theme.base.colors.gray['extra-light'];\n const freezeLineShadowTransparent = transparentize(\n 0.9,\n theme.components.table.header['foreground-color']\n );\n const oddRowBackgroundColor =\n getLuminance(theme.components.table.body['secondary-background-color']) > 0.5\n ? theme.components.table.body['secondary-background-color']\n : mix(\n 0.75,\n theme.components.table.body['background-color'],\n theme.components.table.body['secondary-background-color']\n );\n\n const headerForegroundContrast = meetsContrastGuidelines(\n theme.components.table.header['foreground-color'],\n theme.components.table.header['background-color']\n ).AA;\n const usableHeaderForeground = headerForegroundContrast\n ? theme.components.table.header['foreground-color']\n : readableColor(\n theme.components.table.header['foreground-color'],\n theme.components.table.header['background-color']\n );\n const oddRowContrast = meetsContrastGuidelines(\n theme.components.table.body['foreground-color'],\n oddRowBackgroundColor\n ).AA;\n const useableOddRowForeground = oddRowContrast\n ? theme.components.table.body['foreground-color']\n : readableColor(theme.components.table.body['foreground-color'], oddRowBackgroundColor);\n\n return css`\n --primary-background: ${theme.base.palette['primary-background']};\n --secondary-background: ${theme.components.table.header['background-color']};\n --forground-color: ${theme.base.palette['foreground-color']};\n --interactive: ${theme.base.palette.interactive};\n --medium-blue: ${theme.base.colors.blue.medium};\n --border-color: ${theme.base.palette['border-line']};\n --border-color-freeze: #a5a5a5;\n --border-width: 0.062rem;\n --border-style: var(--border-width) solid var(--border-color);\n --font-stretch: ${theme.components.table.typography['font-stretch']};\n --letter-spacing: ${theme.components.table.typography['letter-spacing']};\n --cell-padding: ${theme.base.spacing};\n --cell-vertical-padding: calc(${theme.base.spacing} * 0.5);\n --header-cell-padding: 0 0.44rem 0 var(--cell-padding);\n --header-bg-color: var(--secondary-background);\n --header-fg-color: ${usableHeaderForeground};\n --default-group-header-height: 1.5rem;\n --group-header-height: var(--default-group-header-height);\n --box-sizing: content-box;\n --animation-ease: ${theme.base.animation.timing.ease};\n --font-weight-semi-bold: ${theme.base['font-weight']['semi-bold']};\n --row-height-multiplier: 1.125;\n --cell-fixed-position: sticky;\n position: relative;\n ${() => generateRSHeightStyles({ view, isFullscreen })}\n\n .small-screen-table {\n --cell-fixed-position: static;\n }\n\n .container {\n ${() => generateRSDataContainerHeightStyles()};\n border: var(--border-style);\n border-radius: var(--border-radius, ${theme.base['border-radius']});\n position: relative;\n letter-spacing: var(--letter-spacing);\n font-stretch: var(--font-stretch);\n ${StyledTabPanel} & ${StyledProgressBackdrop} {\n border-radius: var(--border-radius, ${theme.base['border-radius']});\n }\n }\n\n .hide-rows-till-ready .row[aria-rowindex] {\n visibility: hidden;\n }\n\n .table-drag-proxy {\n background: rgba(0, 0, 0, 0.21);\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: 6;\n pointer-events: none;\n display: none;\n }\n\n .table-drag-line {\n background: #999999;\n position: absolute;\n top: 0;\n bottom: 0;\n width: 0.12rem;\n z-index: 6;\n pointer-events: none;\n display: none;\n }\n\n .cell-fixed {\n z-index: 1;\n }\n\n .group-wrapper {\n overflow: hidden;\n display: inline-flex;\n line-height: var(--group-header-height);\n\n .group-context-count {\n display: inline-flex;\n overflow: hidden;\n }\n }\n\n /* In review mode(Ex: Tabs) cosmos components are rendered and mark up is not compatible with\n group-wrapper cell. Overridden css in group-header when dl exists inside that class which indicates\n mark up is generated from cosmos which differentiates from normal table cell markup */\n .group-wrapper .group-context-count dl {\n grid-template-columns: auto;\n }\n\n .fallback,\n .fallback-footer {\n height: var(--row-height);\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n position: absolute;\n width: 100%;\n z-index: -1;\n box-sizing: var(--box-sizing);\n }\n\n .fallback {\n /* stylelint-disable unit-allowed-list */\n top: -1px;\n border-bottom: var(--border-style);\n }\n\n .fallback-footer {\n top: 0;\n border-top: var(--border-style);\n }\n\n .sticky-header {\n display: grid;\n position: sticky;\n top: 0;\n z-index: 6;\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n }\n\n .cell {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n\n .icons-ph {\n /* Maintaining action button aspect ratio of 1:1 with 24*24px width and height */\n min-width: 1.5rem;\n }\n\n &.custom-item {\n width: 10em;\n }\n }\n\n .cell:focus {\n outline: 0.125rem auto var(--medium-blue);\n }\n\n .cell.selection-border:focus {\n outline: none 0;\n }\n\n .row {\n display: inline-flex;\n height: var(--row-height);\n outline: none 0;\n transition: transform 0.5s var(--animation-ease);\n box-sizing: var(--box-sizing);\n position: relative;\n\n > .row-select-handle {\n display: flex;\n justify-content: center;\n &:active {\n outline: none;\n }\n\n > .header-lable-container {\n min-width: 20px;\n }\n /* stylelint-disable selector-max-class */\n &.cell-fixed > .cell-content {\n flex-grow: unset;\n }\n }\n\n > .cell,\n .group-header-aggregation-row > .cell {\n transition: transform 0.5s var(--animation-ease);\n border-right: var(--border-style);\n position: relative;\n ${!theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n display: flex;\n align-items: center;\n\n &::after {\n opacity: 1;\n transition: opacity 0.1s var(--animation-ease);\n }\n\n .row-action-menu {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &.cell-action {\n position: sticky;\n z-index: 4;\n right: 0;\n border-right: 0;\n justify-content: center;\n border-left: var(--border-style);\n\n /* The below styles are needed to avoid ellipses in safari when no text is present\n and to hide the 'Actions' label */\n\n /* stylelint-disable max-nesting-depth */\n\n div.header-label {\n text-overflow: unset;\n }\n }\n &.aggregateCell {\n background-color: var(--header-bg-color);\n }\n }\n\n /** Adds bottom border to the last row of a group, when striped-rows are enabled */\n &:has(+ .group-header-row) > .cell {\n ${theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n }\n &.header > .cell {\n border-bottom: var(--border-style);\n }\n .group-header-aggregation-row {\n > .cell {\n &.cell-action {\n overflow: initial;\n\n /* extending border on the top left of row action cell as we need to show border for at the end group label value when row actions are present */\n &::before {\n content: '';\n position: absolute;\n inline-size: 0;\n inset-inline-start: calc(var(--border-width) * -1);\n inset-block-start: calc(var(--group-header-height) * -1);\n block-size: var(--group-header-height);\n border-inline-start: var(--border-style);\n }\n }\n }\n }\n\n > .cell-action {\n background-color: var(--primary-background);\n }\n\n > .row-reorder-handle {\n padding: 0;\n border-right: 0 !important;\n justify-content: center;\n cursor: move;\n }\n\n .aggregateCell.cell {\n border-right: none;\n }\n\n > .cell.cell-fixed,\n .group-header-aggregation-row > .cell-fixed {\n position: var(--cell-fixed-position);\n z-index: 4;\n\n ${showFreezeLine &&\n css`\n &.cell-last-frozen {\n border-right: solid 1px var(--border-color-freeze);\n box-shadow: calc(${theme.base.spacing} * 0.25) 0 0 0 ${freezeLineShadowTransparent};\n transition: 0.5s;\n }\n `}\n\n /* As the row select column and row dragDrop column always have to be frozen */\n &[data-col-id='RowSelect'],\n &[data-col-id='RowDragDrop'],\n &[data-col-id='RowError'] {\n position: sticky;\n flex-shrink: 0;\n z-index: 5;\n }\n }\n\n > .cell.cell-fixed:focus-within,\n .group-header-aggregation-row > .cell-fixed {\n z-index: 6;\n }\n\n &.click {\n cursor: pointer;\n }\n\n &:last-child {\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n\n > .cell {\n &:first-child {\n border-end-start-radius: inherit;\n }\n\n &:last-child {\n border-end-end-radius: inherit;\n }\n\n ${theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n }\n }\n }\n .row:not(.row-error):not(.group-header-row):not(.header) {\n .cell-fixed {\n background: var(--primary-background);\n }\n .cell-fixed.aggregateCell {\n background: var(--header-bg-color);\n }\n }\n ${theme.components.table['striped-rows'] &&\n css`\n /* Targets rows with an odd data-index attribute, excluding group header rows */\n .row[data-index$='1']:not(.group-header-row):not(.header),\n .row[data-index$='3']:not(.group-header-row):not(.header),\n .row[data-index$='5']:not(.group-header-row):not(.header),\n .row[data-index$='7']:not(.group-header-row):not(.header),\n .row[data-index$='9']:not(.group-header-row):not(.header) {\n background: ${oddRowBackgroundColor};\n color: ${useableOddRowForeground};\n .cell-fixed {\n background: ${oddRowBackgroundColor};\n color: ${useableOddRowForeground};\n }\n > .cell-action {\n background: ${oddRowBackgroundColor};\n }\n }\n .row[data-index$='0']:not(.group-header-row):not(.header),\n .row[data-index$='2']:not(.group-header-row):not(.header),\n .row[data-index$='4']:not(.group-header-row):not(.header),\n .row[data-index$='6']:not(.group-header-row):not(.header),\n .row[data-index$='8']:not(.group-header-row):not(.header) {\n background: var(--primary-background);\n .cell-fixed {\n background: var(--primary-background);\n }\n > .cell-action {\n background: var(--primary-background);\n }\n }\n `}\n\n .row-error {\n background: ${mix(\n 0.1,\n theme.components['form-field'].error['status-color'],\n theme.base.palette['primary-background']\n )};\n\n /* stylelint-disable no-descending-specificity */\n .cell-fixed,\n .cell-action {\n background: inherit;\n }\n\n > .cell:not(.cell-fixed):not(.cell-action) {\n background: none;\n }\n }\n\n .sort-info-container {\n .sort-sequence {\n font-size: 0.625rem;\n color: ${theme.base.colors.gray['extra-dark']};\n }\n }\n\n .filter-info-container {\n display: flex;\n justify-content: center;\n align-items: center;\n\n svg {\n width: 14px;\n height: 14px;\n }\n }\n\n .cell.row-error-column {\n padding: 0;\n border-right: 0;\n text-align: right;\n outline: none;\n\n /* Focus handling will be done as part of interation 2: EPIC-88751 */\n\n svg {\n color: ${theme.base.colors.red.medium};\n }\n }\n\n .cell-right-align .filter-info-container svg {\n margin: 0 0.312rem 0 0;\n }\n\n &.show-expand-collapse-all {\n .row > .cell-first {\n padding-left: calc(var(--expand-collapse-all-width) + var(--cell-padding) + 0.25rem);\n &.row-reorder-handle,\n &.row-error-column {\n padding: 0;\n }\n &.row-select-handle {\n padding-inline-start: var(--expand-collapse-all-width);\n }\n }\n\n .row-container .row > .cell-first {\n &.row-select-handle {\n /* Offset padding of 0.5rem added to SelectAllCheckbox in grouped views(getting pushed by margin),\n ensuring row select checkboxes align vertically in header and data rows */\n padding-inline-start: calc(\n var(--expand-collapse-all-width) - var(--cell-padding) + 0.5rem\n );\n }\n }\n\n /* stylelint-enable selector-max-class */\n .expand-collapse-all {\n position: absolute;\n width: var(--expand-collapse-all-width);\n z-index: 10;\n height: var(--row-height);\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n border-right: var(--border-style);\n border-bottom: var(--border-style);\n border-start-start-radius: ${theme.base['border-radius']};\n padding-inline-start: 0.125rem;\n margin-inline-start: 0.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: -0.25rem;\n width: 0.25rem;\n height: 100%;\n background-color: var(--header-bg-color);\n z-index: 12;\n }\n\n > button {\n color: var(--forground-color);\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n .no-border-right {\n border-right: 0;\n }\n }\n\n /* stylelint-disable selector-max-class */\n\n .scroll-end {\n &.row-container > .row:last-child {\n & > .cell,\n & .group-header-aggregation-row > .cell {\n border-bottom: 0;\n }\n }\n }\n\n /* stylelint-enable selector-max-class */\n .header {\n font-weight: var(--font-weight-semi-bold);\n position: relative; /* This is required to position .border-fix element */\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n\n > .cell.row-error-column {\n border-right: 0;\n }\n > .cell {\n display: flex;\n justify-content: space-between;\n align-items: center;\n z-index: 2;\n position: relative;\n cursor: pointer;\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n font-weight: ${theme.base['font-weight'].bold};\n font-size: ${fontSize.xxs};\n border-right: var(--border-style);\n padding: var(--header-cell-padding);\n\n &:first-child {\n border-start-start-radius: inherit;\n }\n\n &:last-child {\n border-start-end-radius: inherit;\n }\n\n .header-lable-container {\n display: inline-flex;\n overflow: hidden;\n text-overflow: ellipsis;\n font-size: ${fontSize.xs};\n font-weight: var(--font-weight-semi-bold);\n align-items: center;\n gap: 0.125rem;\n }\n\n .header-label {\n overflow: hidden;\n text-overflow: ellipsis;\n\n /* To avoid browser tooltip when we get ellipsis in safari */\n &::after {\n content: '';\n display: block;\n }\n\n /* To utilize smart tooltip making it as a non-box element */\n /* stylelint-disable selector-max-class */\n .cell-content {\n display: contents;\n }\n }\n }\n\n > .row-reorder-handle {\n padding: 0;\n }\n\n > .row-select-handle {\n /* Nullifying padding applied from .header > .cell */\n padding: 0;\n justify-content: center;\n }\n .row {\n border-bottom: none;\n }\n }\n\n /* 4 selectors required as aggregateCell of only footer need this effect */\n\n .pContainer:not(.pContainerScroll) .footer .aggregateCell.cell {\n border-bottom: none;\n }\n\n .row .cell.cell-last {\n border-right: 0;\n }\n\n ${!colIdToFillRemainingSpace\n ? css`\n .row .cell.cell-last {\n flex-grow: 1;\n }\n `\n : css`\n .row .cell[data-col-id='${colIdToFillRemainingSpace}'] {\n flex-grow: 1;\n }\n `}\n\n .row-container {\n --data-row-height: calc(\n var(--hit-area) * var(--row-height-multiplier) + var(--cell-vertical-padding)\n );\n --group-header-height: ${isAggregationApplied\n ? 'var(--default-group-header-height)'\n : 'var(--data-row-height)'};\n &:not(.wrap-content-height) > .row:not(.group-header-row) {\n height: var(--data-row-height);\n }\n\n & > .row:not(.group-header-row) {\n min-width: 100%;\n }\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n\n & > .row .cell-content {\n /*\n * Using box sizing content-box so that the padding is not considered for the alignment of the cell content.\n * Vertical alignment is done using flex and max-height below even though the .cell-content might overflow due to padding + content size.\n */\n box-sizing: content-box;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n word-break: break-all;\n flex-grow: 1;\n\n /* Adding padding on .cell-content so that focus rings can appear properly and doesn't clip due to overflow: hidden */\n padding: var(--cell-vertical-padding) var(--cell-padding);\n\n /* setting max-height so that the elements with more height like RTL, align with the row density height */\n max-height: var(--data-row-height);\n\n /* hiding scroll bar in case the cell render introduces scrollbar based on its implementation */\n & * {\n scrollbar-width: none;\n }\n\n /* in case of combine columns, removing padding from parent cell-content as children already have the padding */\n &:has(.combined-cell) {\n padding: 0;\n\n .cell-content {\n flex-grow: unset;\n }\n }\n }\n }\n\n .row .aggregateCell .cell-content {\n line-height: initial;\n padding: 0;\n }\n\n .short-height,\n .medium-height {\n ${StyledStatus} {\n white-space: nowrap;\n }\n }\n\n .short-height {\n ${StyledRadioCheck} ${StyledLabel} {\n min-height: auto;\n }\n }\n\n .medium-height {\n --row-height-multiplier: 4 / 3;\n }\n\n .tall-height {\n --row-height-multiplier: calc(4 / 3 + 0.5);\n > .row:not(.group-header-row) {\n > .cell {\n display: inline-grid;\n align-items: start;\n white-space: normal;\n word-break: break-all;\n grid-auto-flow: column;\n\n :has(> ${CellIcon}) {\n /* Adds spacing between children when icons are rendered alongside cell content in the cell container. */\n justify-content: space-between;\n }\n\n /* stylelint-disable-next-line selector-max-compound-selectors */\n > .cell-content > .combined-cell > .combined-cell-content,\n > .cell-content {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: inherit;\n word-break: inherit;\n }\n\n ${CellIcon} {\n margin-block-start: 0.375rem;\n }\n }\n }\n }\n\n .wrap-content-height {\n --row-height-multiplier: 4 / 3;\n --row-min-height: calc(\n var(--hit-area) * var(--row-height-multiplier) + var(--cell-vertical-padding) * 2\n );\n --group-header-height: ${isAggregationApplied\n ? 'var(--default-group-header-height)'\n : 'var(--row-min-height)'};\n\n > .row:not(.group-header-row) {\n height: auto;\n min-height: var(--row-min-height);\n > .cell {\n white-space: normal;\n\n /* -- For BUG-625508 -- */\n word-break: break-word;\n display: inline-grid;\n align-items: start;\n padding-top: var(--cell-vertical-padding);\n padding-bottom: var(--cell-vertical-padding);\n grid-auto-flow: column;\n\n :has(> ${CellIcon}) {\n /* Adds spacing between children when icons are rendered alongside cell content in the cell container. */\n justify-content: space-between;\n }\n\n /* stylelint-disable-next-line selector-max-compound-selectors */\n > .cell-content > .combined-cell > .combined-cell-content,\n > .cell-content {\n /* for full-content, the row cells should adjust according to content */\n max-height: none;\n white-space: inherit;\n word-break: inherit;\n }\n\n ${CellIcon} {\n margin-block-start: 0.375rem;\n }\n }\n }\n }\n\n .footer {\n .row {\n .cell {\n padding: 0;\n }\n }\n }\n\n /* stylelint-disable no-duplicate-selectors */\n .row-container {\n position: absolute;\n display: grid;\n width: 100%;\n font-size: ${fontSize.s};\n\n > .group-header-row,\n .hierarchical-group-footer-row {\n height: var(--group-header-height);\n .cell {\n padding: 0;\n border-right-width: 0;\n }\n }\n\n > .hierarchical-group-header-row {\n height: var(--group-header-height);\n }\n input.checkbox-on-hover + label {\n opacity: 0;\n }\n input.checkbox-on-hover:checked + label {\n opacity: 1;\n }\n .row.selected-row {\n background-color: ${selectedRowColor};\n\n > .cell,\n .cell-fixed,\n .cell-action {\n background-color: ${selectedRowColor};\n }\n }\n .row-on-hover:hover {\n background-color: ${lightGreyColor};\n input.checkbox-on-hover + label {\n opacity: 1;\n }\n\n > .cell,\n .cell-fixed,\n .cell-action {\n background-color: ${lightGreyColor};\n }\n }\n .row.hierarchical-group-footer-row {\n .cell-fixed {\n background: ${lightGreyColor};\n }\n }\n }\n\n /* stylelint-enable selector-max-class */\n\n .toolbar-button-applied {\n padding: 0 8px;\n margin: 0 calc(${theme.base.spacing} / 4);\n }\n\n .toolbar-button {\n padding: 0 8px;\n margin: 0 calc(${theme.base.spacing} / 4);\n }\n\n .column-resizer {\n cursor: col-resize;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n width: 0.25rem;\n height: 100%;\n }\n\n .column-resizer:hover,\n .column-resizer:active {\n background: var(--interactive);\n }\n\n .align-right {\n justify-content: right;\n\n .cell-content {\n text-align: right;\n }\n }\n\n .align-left {\n justify-content: left;\n\n .cell-content {\n text-align: left;\n }\n }\n\n .align-center {\n justify-content: center;\n\n .cell-content {\n text-align: center;\n }\n }\n\n .popper {\n div.row {\n display: flex;\n vertical-align: middle;\n line-height: unset;\n border-bottom: none;\n outline: none 0;\n height: auto;\n }\n }\n `;\n});\n\nexport default StyledTableContainer;\n"]}
|
|
1
|
+
{"version":3,"file":"StyledTableContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n getLuminance,\n meetsContrastGuidelines,\n mix,\n readableColor,\n transparentize\n} from 'polished';\n\nimport { StyledStatus } from '@pega/cosmos-react-core/lib/components/Badges/Status';\nimport { StyledRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\nimport {\n StyledLabel,\n StyledProgressBackdrop,\n calculateFontSize,\n tryCatch\n} from '@pega/cosmos-react-core';\nimport { StyledTabPanel } from '@pega/cosmos-react-core/lib/components/Tabs/TabPanel';\n\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\n\nimport { CellIcon } from './CellWrapper';\n\nconst StyledTableContainer = styled(forwardRef((props, ref) => <div ref={ref} {...props} />))(({\n theme,\n view,\n isFullscreen\n}) => {\n let colIdToFillRemainingSpace;\n let isAggregationApplied = false;\n\n (view.columns ?? [])\n .filter(c => !c.hidden)\n .forEach(c => {\n if (!colIdToFillRemainingSpace && c.field.fillAvailableSpace) {\n colIdToFillRemainingSpace = c.field.id;\n }\n if (c.aggregated) {\n isAggregationApplied = true;\n }\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n const showFreezeLine =\n view.state.responsive?.sm &&\n !(view.hasNoRecords || view.hasNoFrozenColumns || view.bHideFreezeLine);\n const selectedRowColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n const lightGreyColor = theme.base.colors.gray['extra-light'];\n const freezeLineShadowTransparent = transparentize(\n 0.9,\n theme.components.table.header['foreground-color']\n );\n const oddRowBackgroundColor =\n getLuminance(theme.components.table.body['secondary-background-color']) > 0.5\n ? theme.components.table.body['secondary-background-color']\n : mix(\n 0.75,\n theme.components.table.body['background-color'],\n theme.components.table.body['secondary-background-color']\n );\n\n const headerForegroundContrast = meetsContrastGuidelines(\n theme.components.table.header['foreground-color'],\n theme.components.table.header['background-color']\n ).AA;\n const usableHeaderForeground = headerForegroundContrast\n ? theme.components.table.header['foreground-color']\n : readableColor(\n theme.components.table.header['foreground-color'],\n theme.components.table.header['background-color']\n );\n const oddRowContrast = meetsContrastGuidelines(\n theme.components.table.body['foreground-color'],\n oddRowBackgroundColor\n ).AA;\n const useableOddRowForeground = oddRowContrast\n ? theme.components.table.body['foreground-color']\n : readableColor(theme.components.table.body['foreground-color'], oddRowBackgroundColor);\n\n return css`\n --primary-background: ${theme.base.palette['primary-background']};\n --secondary-background: ${theme.components.table.header['background-color']};\n --forground-color: ${theme.base.palette['foreground-color']};\n --interactive: ${theme.base.palette.interactive};\n --medium-blue: ${theme.base.colors.blue.medium};\n --border-color: ${theme.base.palette['border-line']};\n --border-color-freeze: #a5a5a5;\n --border-width: 0.062rem;\n --border-style: var(--border-width) solid var(--border-color);\n --font-stretch: ${theme.components.table.typography['font-stretch']};\n --letter-spacing: ${theme.components.table.typography['letter-spacing']};\n --cell-padding: ${theme.base.spacing};\n --cell-vertical-padding: calc(${theme.base.spacing} * 0.5);\n --header-cell-padding: 0 0.44rem 0 var(--cell-padding);\n --header-bg-color: var(--secondary-background);\n --header-fg-color: ${usableHeaderForeground};\n --default-group-header-height: 1.5rem;\n --group-header-height: var(--default-group-header-height);\n --box-sizing: content-box;\n --animation-ease: ${theme.base.animation.timing.ease};\n --font-weight-semi-bold: ${theme.base['font-weight']['semi-bold']};\n --row-height-multiplier: 1.125;\n --cell-fixed-position: sticky;\n position: relative;\n ${() => generateRSHeightStyles({ view, isFullscreen })}\n\n .small-screen-table {\n --cell-fixed-position: static;\n }\n\n .container {\n ${() => generateRSDataContainerHeightStyles()};\n border: var(--border-style);\n border-radius: var(--border-radius, ${theme.base['border-radius']});\n position: relative;\n letter-spacing: var(--letter-spacing);\n font-stretch: var(--font-stretch);\n ${StyledTabPanel} & ${StyledProgressBackdrop} {\n border-radius: var(--border-radius, ${theme.base['border-radius']});\n }\n }\n\n .hide-rows-till-ready .row[aria-rowindex] {\n visibility: hidden;\n }\n\n .table-drag-proxy {\n background: rgba(0, 0, 0, 0.21);\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: 6;\n pointer-events: none;\n display: none;\n }\n\n .table-drag-line {\n background: #999999;\n position: absolute;\n top: 0;\n bottom: 0;\n width: 0.12rem;\n z-index: 6;\n pointer-events: none;\n display: none;\n }\n\n .cell-fixed {\n z-index: 1;\n }\n\n .group-wrapper {\n overflow: hidden;\n display: inline-flex;\n line-height: var(--group-header-height);\n\n .group-context-count {\n display: inline-flex;\n overflow: hidden;\n }\n }\n\n /* In review mode(Ex: Tabs) cosmos components are rendered and mark up is not compatible with\n group-wrapper cell. Overridden css in group-header when dl exists inside that class which indicates\n mark up is generated from cosmos which differentiates from normal table cell markup */\n .group-wrapper .group-context-count dl {\n grid-template-columns: auto;\n }\n\n .fallback,\n .fallback-footer {\n height: var(--row-height);\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n position: absolute;\n width: 100%;\n z-index: -1;\n box-sizing: var(--box-sizing);\n }\n\n .fallback {\n /* stylelint-disable unit-allowed-list */\n top: -1px;\n border-bottom: var(--border-style);\n }\n\n .fallback-footer {\n top: 0;\n border-top: var(--border-style);\n }\n\n .sticky-header {\n display: grid;\n position: sticky;\n top: 0;\n z-index: 6;\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n }\n\n .cell {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n\n .icons-ph {\n /* Maintaining action button aspect ratio of 1:1 with 24*24px width and height */\n min-width: 1.5rem;\n }\n\n &.custom-item {\n width: 10em;\n }\n }\n\n .cell:focus {\n box-shadow: ${theme.base.shadow['focus-inset']};\n outline: none;\n }\n\n .row {\n display: inline-flex;\n height: var(--row-height);\n outline: none 0;\n transition: transform 0.5s var(--animation-ease);\n box-sizing: var(--box-sizing);\n position: relative;\n\n > .row-select-handle {\n display: flex;\n justify-content: center;\n &:active {\n outline: none;\n }\n\n > .header-lable-container {\n min-width: 20px;\n }\n /* stylelint-disable selector-max-class */\n &.cell-fixed > .cell-content {\n flex-grow: unset;\n }\n }\n\n > .cell,\n .group-header-aggregation-row > .cell {\n transition: transform 0.5s var(--animation-ease);\n border-right: var(--border-style);\n position: relative;\n ${!theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n display: flex;\n align-items: center;\n\n &::after {\n opacity: 1;\n transition: opacity 0.1s var(--animation-ease);\n }\n\n .row-action-menu {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &.cell-action {\n position: sticky;\n z-index: 4;\n right: 0;\n border-right: 0;\n justify-content: center;\n border-left: var(--border-style);\n\n /* The below styles are needed to avoid ellipses in safari when no text is present\n and to hide the 'Actions' label */\n\n /* stylelint-disable max-nesting-depth */\n\n div.header-label {\n text-overflow: unset;\n }\n }\n &.aggregateCell {\n background-color: var(--header-bg-color);\n }\n }\n\n /** Adds bottom border to the last row of a group, when striped-rows are enabled */\n &:has(+ .group-header-row) > .cell {\n ${theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n }\n &.header > .cell {\n border-bottom: var(--border-style);\n }\n .group-header-aggregation-row {\n > .cell {\n &.cell-action {\n overflow: initial;\n\n /* extending border on the top left of row action cell as we need to show border for at the end group label value when row actions are present */\n &::before {\n content: '';\n position: absolute;\n inline-size: 0;\n inset-inline-start: calc(var(--border-width) * -1);\n inset-block-start: calc(var(--group-header-height) * -1);\n block-size: var(--group-header-height);\n border-inline-start: var(--border-style);\n }\n }\n }\n }\n\n > .cell-action {\n background-color: var(--primary-background);\n }\n\n > .row-reorder-handle {\n padding: 0;\n border-right: 0 !important;\n justify-content: center;\n cursor: move;\n }\n\n .aggregateCell.cell {\n border-right: none;\n }\n\n > .cell.cell-fixed,\n .group-header-aggregation-row > .cell-fixed {\n position: var(--cell-fixed-position);\n z-index: 4;\n\n ${showFreezeLine &&\n css`\n &.cell-last-frozen {\n border-right: solid 1px var(--border-color-freeze);\n filter: drop-shadow(\n calc(${theme.base.spacing} * 0.25) 0 0 ${freezeLineShadowTransparent}\n );\n transition: 0.5s;\n }\n `}\n\n /* As the row select column and row dragDrop column always have to be frozen */\n &[data-col-id='RowSelect'],\n &[data-col-id='RowDragDrop'],\n &[data-col-id='RowError'] {\n position: sticky;\n flex-shrink: 0;\n z-index: 5;\n }\n }\n\n > .cell.cell-fixed:focus-within,\n .group-header-aggregation-row > .cell-fixed {\n z-index: 6;\n }\n\n &.click {\n cursor: pointer;\n }\n\n &:last-child {\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n\n > .cell {\n &:first-child {\n border-end-start-radius: inherit;\n }\n\n &:last-child {\n border-end-end-radius: inherit;\n }\n\n ${theme.components.table['striped-rows'] &&\n css`\n border-bottom: var(--border-style);\n `}\n }\n }\n }\n .row:not(.row-error):not(.group-header-row):not(.header) {\n .cell-fixed {\n background: var(--primary-background);\n }\n .cell-fixed.aggregateCell {\n background: var(--header-bg-color);\n }\n }\n ${theme.components.table['striped-rows'] &&\n css`\n /* Targets rows with an odd data-index attribute, excluding group header rows */\n .row[data-index$='1']:not(.group-header-row):not(.header),\n .row[data-index$='3']:not(.group-header-row):not(.header),\n .row[data-index$='5']:not(.group-header-row):not(.header),\n .row[data-index$='7']:not(.group-header-row):not(.header),\n .row[data-index$='9']:not(.group-header-row):not(.header) {\n background: ${oddRowBackgroundColor};\n color: ${useableOddRowForeground};\n .cell-fixed {\n background: ${oddRowBackgroundColor};\n color: ${useableOddRowForeground};\n }\n > .cell-action {\n background: ${oddRowBackgroundColor};\n }\n }\n .row[data-index$='0']:not(.group-header-row):not(.header),\n .row[data-index$='2']:not(.group-header-row):not(.header),\n .row[data-index$='4']:not(.group-header-row):not(.header),\n .row[data-index$='6']:not(.group-header-row):not(.header),\n .row[data-index$='8']:not(.group-header-row):not(.header) {\n background: var(--primary-background);\n .cell-fixed {\n background: var(--primary-background);\n }\n > .cell-action {\n background: var(--primary-background);\n }\n }\n `}\n\n .row-error {\n background: ${mix(\n 0.1,\n theme.components['form-field'].error['status-color'],\n theme.base.palette['primary-background']\n )};\n\n /* stylelint-disable no-descending-specificity */\n .cell-fixed,\n .cell-action {\n background: inherit;\n }\n\n > .cell:not(.cell-fixed):not(.cell-action) {\n background: none;\n }\n }\n\n .sort-info-container {\n .sort-sequence {\n font-size: 0.625rem;\n color: ${theme.base.colors.gray['extra-dark']};\n }\n }\n\n .filter-info-container {\n display: flex;\n justify-content: center;\n align-items: center;\n\n svg {\n width: 14px;\n height: 14px;\n }\n }\n\n .cell.row-error-column {\n padding: 0;\n border-right: 0;\n text-align: right;\n outline: none;\n\n /* Focus handling will be done as part of interation 2: EPIC-88751 */\n\n svg {\n color: ${theme.base.colors.red.medium};\n }\n }\n\n .cell-right-align .filter-info-container svg {\n margin: 0 0.312rem 0 0;\n }\n\n &.show-expand-collapse-all {\n .row > .cell-first {\n padding-left: calc(var(--expand-collapse-all-width) + var(--cell-padding) + 0.25rem);\n &.row-reorder-handle,\n &.row-error-column {\n padding: 0;\n }\n &.row-select-handle {\n padding-inline-start: var(--expand-collapse-all-width);\n }\n }\n\n .row-container .row > .cell-first {\n &.row-select-handle {\n /* Offset padding of 0.5rem added to SelectAllCheckbox in grouped views(getting pushed by margin),\n ensuring row select checkboxes align vertically in header and data rows */\n padding-inline-start: calc(\n var(--expand-collapse-all-width) - var(--cell-padding) + 0.5rem\n );\n }\n }\n\n /* stylelint-enable selector-max-class */\n .expand-collapse-all {\n position: absolute;\n width: var(--expand-collapse-all-width);\n z-index: 10;\n height: var(--row-height);\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n border-right: var(--border-style);\n border-bottom: var(--border-style);\n border-start-start-radius: ${theme.base['border-radius']};\n padding-inline-start: 0.125rem;\n margin-inline-start: 0.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &::before {\n content: '';\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: -0.25rem;\n width: 0.25rem;\n height: 100%;\n background-color: var(--header-bg-color);\n z-index: 12;\n }\n\n > button {\n color: var(--forground-color);\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n .no-border-right {\n border-right: 0;\n }\n }\n\n /* stylelint-disable selector-max-class */\n\n .scroll-end {\n &.row-container > .row:last-child {\n & > .cell,\n & .group-header-aggregation-row > .cell {\n border-bottom: 0;\n }\n }\n }\n\n /* stylelint-enable selector-max-class */\n .header {\n font-weight: var(--font-weight-semi-bold);\n position: relative; /* This is required to position .border-fix element */\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n\n > .cell.row-error-column {\n border-right: 0;\n }\n > .cell {\n display: flex;\n justify-content: space-between;\n align-items: center;\n z-index: 2;\n position: relative;\n cursor: pointer;\n background-color: var(--header-bg-color);\n color: var(--header-fg-color);\n font-weight: ${theme.base['font-weight'].bold};\n font-size: ${fontSize.xxs};\n border-right: var(--border-style);\n padding: var(--header-cell-padding);\n\n &:first-child {\n border-start-start-radius: inherit;\n }\n\n &:last-child {\n border-start-end-radius: inherit;\n }\n\n .header-lable-container {\n display: inline-flex;\n overflow: hidden;\n text-overflow: ellipsis;\n font-size: ${fontSize.xs};\n font-weight: var(--font-weight-semi-bold);\n align-items: center;\n gap: 0.125rem;\n }\n\n .header-label {\n overflow: hidden;\n text-overflow: ellipsis;\n\n /* To avoid browser tooltip when we get ellipsis in safari */\n &::after {\n content: '';\n display: block;\n }\n\n /* To utilize smart tooltip making it as a non-box element */\n /* stylelint-disable selector-max-class */\n .cell-content {\n display: contents;\n }\n }\n }\n\n > .row-reorder-handle {\n padding: 0;\n }\n\n > .row-select-handle {\n /* Nullifying padding applied from .header > .cell */\n padding: 0;\n justify-content: center;\n }\n .row {\n border-bottom: none;\n }\n }\n\n /* 4 selectors required as aggregateCell of only footer need this effect */\n\n .pContainer:not(.pContainerScroll) .footer .aggregateCell.cell {\n border-bottom: none;\n }\n\n .row .cell.cell-last {\n border-right: 0;\n }\n\n ${!colIdToFillRemainingSpace\n ? css`\n .row .cell.cell-last {\n flex-grow: 1;\n }\n `\n : css`\n .row .cell[data-col-id='${colIdToFillRemainingSpace}'] {\n flex-grow: 1;\n }\n `}\n\n .row-container {\n --data-row-height: calc(\n var(--hit-area) * var(--row-height-multiplier) + var(--cell-vertical-padding)\n );\n --group-header-height: ${isAggregationApplied\n ? 'var(--default-group-header-height)'\n : 'var(--data-row-height)'};\n &:not(.wrap-content-height) > .row:not(.group-header-row) {\n height: var(--data-row-height);\n }\n\n & > .row:not(.group-header-row) {\n min-width: 100%;\n }\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n\n & > .row .cell-content {\n /*\n * Using box sizing content-box so that the padding is not considered for the alignment of the cell content.\n * Vertical alignment is done using flex and max-height below even though the .cell-content might overflow due to padding + content size.\n */\n box-sizing: content-box;\n flex-grow: 1;\n\n /* Adding padding on .cell-content so that focus rings can appear properly and doesn't clip due to overflow: hidden */\n padding: var(--cell-vertical-padding) var(--cell-padding);\n\n /* setting max-height so that the elements with more height like RTL, align with the row density height */\n max-height: var(--data-row-height);\n\n /* hiding scroll bar in case the cell render introduces scrollbar based on its implementation */\n & * {\n scrollbar-width: none;\n }\n\n /* in case of combine columns, removing padding from parent cell-content as children already have the padding */\n &:has(.combined-cell) {\n padding: 0;\n\n .cell-content {\n flex-grow: unset;\n }\n }\n }\n\n & > .row .cell:not(.column-type-action) .cell-content {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n word-break: break-all;\n }\n }\n\n .row .aggregateCell .cell-content {\n line-height: initial;\n padding: 0;\n }\n\n .short-height,\n .medium-height {\n ${StyledStatus} {\n white-space: nowrap;\n }\n }\n\n .short-height {\n ${StyledRadioCheck} ${StyledLabel} {\n min-height: auto;\n }\n }\n\n .medium-height {\n --row-height-multiplier: 4 / 3;\n }\n\n .tall-height {\n --row-height-multiplier: calc(4 / 3 + 0.5);\n > .row:not(.group-header-row) {\n > .cell {\n display: inline-grid;\n align-items: start;\n white-space: normal;\n word-break: break-all;\n grid-auto-flow: column;\n\n :has(> ${CellIcon}) {\n /* Adds spacing between children when icons are rendered alongside cell content in the cell container. */\n justify-content: space-between;\n }\n\n /* stylelint-disable-next-line selector-max-compound-selectors */\n > .cell-content > .combined-cell > .combined-cell-content,\n > .cell-content {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: inherit;\n word-break: inherit;\n }\n\n ${CellIcon} {\n margin-block-start: 0.375rem;\n }\n }\n }\n }\n\n .wrap-content-height {\n --row-height-multiplier: 4 / 3;\n --row-min-height: calc(\n var(--hit-area) * var(--row-height-multiplier) + var(--cell-vertical-padding) * 2\n );\n --group-header-height: ${isAggregationApplied\n ? 'var(--default-group-header-height)'\n : 'var(--row-min-height)'};\n\n > .row:not(.group-header-row) {\n height: auto;\n min-height: var(--row-min-height);\n > .cell {\n white-space: normal;\n\n /* -- For BUG-625508 -- */\n word-break: break-word;\n display: inline-grid;\n align-items: start;\n padding-top: var(--cell-vertical-padding);\n padding-bottom: var(--cell-vertical-padding);\n grid-auto-flow: column;\n\n :has(> ${CellIcon}) {\n /* Adds spacing between children when icons are rendered alongside cell content in the cell container. */\n justify-content: space-between;\n }\n\n /* stylelint-disable-next-line selector-max-compound-selectors */\n > .cell-content > .combined-cell > .combined-cell-content,\n > .cell-content {\n /* for full-content, the row cells should adjust according to content */\n max-height: none;\n white-space: inherit;\n word-break: inherit;\n }\n\n ${CellIcon} {\n margin-block-start: 0.375rem;\n }\n }\n }\n }\n\n .footer {\n .row {\n .cell {\n padding: 0;\n }\n }\n }\n\n /* stylelint-disable no-duplicate-selectors */\n .row-container {\n position: absolute;\n display: grid;\n width: 100%;\n font-size: ${fontSize.s};\n\n > .group-header-row,\n .hierarchical-group-footer-row {\n height: var(--group-header-height);\n .cell {\n padding: 0;\n border-right-width: 0;\n }\n }\n\n > .hierarchical-group-header-row {\n height: var(--group-header-height);\n }\n input.checkbox-on-hover + label {\n opacity: 0;\n }\n input.checkbox-on-hover:checked + label {\n opacity: 1;\n }\n .row.selected-row {\n background-color: ${selectedRowColor};\n\n > .cell,\n .cell-fixed,\n .cell-action {\n background-color: ${selectedRowColor};\n }\n }\n .row-on-hover:hover {\n background-color: ${lightGreyColor};\n input.checkbox-on-hover + label {\n opacity: 1;\n }\n\n > .cell,\n .cell-fixed,\n .cell-action {\n background-color: ${lightGreyColor};\n }\n }\n .row.hierarchical-group-footer-row {\n .cell-fixed {\n background: ${lightGreyColor};\n }\n }\n }\n\n /* stylelint-enable selector-max-class */\n\n .toolbar-button-applied {\n padding: 0 8px;\n margin: 0 calc(${theme.base.spacing} / 4);\n }\n\n .toolbar-button {\n padding: 0 8px;\n margin: 0 calc(${theme.base.spacing} / 4);\n }\n\n .column-resizer {\n cursor: col-resize;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n width: 0.25rem;\n height: 100%;\n }\n\n .column-resizer:hover,\n .column-resizer:active {\n background: var(--interactive);\n }\n\n .align-right {\n justify-content: right;\n\n .cell-content {\n text-align: right;\n }\n }\n\n .align-left {\n justify-content: left;\n\n .cell-content {\n text-align: left;\n }\n }\n\n .align-center {\n justify-content: center;\n\n .cell-content {\n text-align: center;\n }\n }\n\n .popper {\n div.row {\n display: flex;\n vertical-align: middle;\n line-height: unset;\n border-bottom: none;\n outline: none 0;\n height: auto;\n }\n }\n `;\n});\n\nexport default StyledTableContainer;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/lists-react",
|
|
3
|
-
"version": "9.0.0-build.17.
|
|
3
|
+
"version": "9.0.0-build.17.11",
|
|
4
4
|
"description": "Repeating view structures such as Table, Gallery(Repeating layouts), Kanban etc.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"build": "tsc -b tsconfig.build.json"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@pega/cosmos-react-condition-builder": "9.0.0-build.17.
|
|
18
|
-
"@pega/cosmos-react-core": "9.0.0-build.17.
|
|
19
|
-
"@pega/cosmos-react-rte": "9.0.0-build.17.
|
|
17
|
+
"@pega/cosmos-react-condition-builder": "9.0.0-build.17.11",
|
|
18
|
+
"@pega/cosmos-react-core": "9.0.0-build.17.11",
|
|
19
|
+
"@pega/cosmos-react-rte": "9.0.0-build.17.11",
|
|
20
20
|
"@types/lodash-es": "^4.17.12",
|
|
21
21
|
"@types/react": "^17.0.62 || ^18.3.3",
|
|
22
22
|
"@types/react-dom": "^17.0.20 || ^18.3.0",
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
"dayjs": "^1.11.13",
|
|
25
25
|
"fast-deep-equal": "^3.1.3",
|
|
26
26
|
"lodash-es": "^4.17.21",
|
|
27
|
-
"pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.17.
|
|
28
|
-
"pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.17.
|
|
27
|
+
"pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.17.11",
|
|
28
|
+
"pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.17.11",
|
|
29
29
|
"polished": "^4.1.0",
|
|
30
30
|
"prop-types": "^15.8.1",
|
|
31
31
|
"react": "^17.0.0 || ^18.0.0",
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"@testing-library/react": "^16.0.0",
|
|
45
45
|
"@testing-library/user-event": "^14.6.1",
|
|
46
46
|
"jest-axe": "^8.0.0",
|
|
47
|
-
"srs-utils": "9.0.0-build.17.
|
|
47
|
+
"srs-utils": "9.0.0-build.17.11",
|
|
48
48
|
"typescript": "~5.9.3"
|
|
49
49
|
}
|
|
50
50
|
}
|