@pega/lists-react 9.0.0-build.23.4 → 9.0.0-build.23.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/RSWrapper/index.jsx"],"names":[],"mappings":"AAgCO;;4CAEN"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/RSWrapper/index.jsx"],"names":[],"mappings":"AA+BO;;4CAEN"}
@@ -10,7 +10,6 @@ import Gallery from '../../Views/Gallery';
10
10
  import Timeline from '../../Views/Timeline';
11
11
  import Map from '../../Views/Map';
12
12
  import repeatComponent from '../../index';
13
- import { rowDensityClasses } from '../../constants';
14
13
  import useConfirmationModal from '../../Hooks/useConfirmationModal';
15
14
  import useSmallScreen from '../../Hooks/useSmallScreen';
16
15
  import { LocalizationProvider } from '../../Context/LocalizationContext';
@@ -63,13 +62,6 @@ const RSWrapper = ({ view }) => {
63
62
  });
64
63
  return acc;
65
64
  }, {});
66
- const visibleColumns = view.getVisibleColumns();
67
- if (visibleColumns.length === 1 &&
68
- view.getRowDensity() === rowDensityClasses[4].id &&
69
- visibleColumns[0].field.width === undefined) {
70
- // If table has only one column then make column width as auto. flex-grow on cell-last will stretch the column to available width.
71
- delete columnStyles[`--col-width-${visibleColumns[0].field.idHash}`];
72
- }
73
65
  const domContainerRef = useRef();
74
66
  useSmallScreen(view, domContainerRef);
75
67
  return (_jsx(CosmosProviders, { children: _jsx(StyledRSContainer, { ref: r => {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/RSWrapper/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, memo, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled, { css } from 'styled-components';\n\nimport { Fullscreen, useFullscreenContext } from '@pega/cosmos-react-core';\nimport { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\n\nimport styles from '../../Views/rs-styles';\nimport Table from '../../Views/Table';\nimport Gallery from '../../Views/Gallery';\nimport Timeline from '../../Views/Timeline';\nimport Map from '../../Views/Map';\nimport repeatComponent from '../../index';\nimport { rowDensityClasses } from '../../constants';\nimport useConfirmationModal from '../../Hooks/useConfirmationModal';\nimport useSmallScreen from '../../Hooks/useSmallScreen';\nimport { LocalizationProvider } from '../../Context/LocalizationContext';\n\nconst StyledRSContainer = styled(forwardRef((props, ref) => <div ref={ref} {...props} />))(() => {\n const fullscreen = useFullscreenContext();\n\n return css`\n ${styles}\n\n ${fullscreen &&\n fullscreen[0] &&\n css`\n height: 100%;\n `}\n `;\n});\n\nexport const CosmosProviders = ({ children }) => {\n return <Fullscreen>{children}</Fullscreen>;\n};\n\nconst RSWrapper = ({ view }) => {\n const { meta: { template } = {}, setDomContainer, columns } = view;\n\n let Component;\n switch (template) {\n case REPEATING_STRUCTURE_TEMPLATES.GALLERY:\n Component = Gallery;\n break;\n case REPEATING_STRUCTURE_TEMPLATES.TIMELINE:\n Component = Timeline;\n break;\n case REPEATING_STRUCTURE_TEMPLATES.MAP:\n Component = Map;\n break;\n default:\n Component = Table;\n }\n\n useConfirmationModal({ view });\n\n /**\n * Adding all column level styles into columnStyles on DOMContainer.\n * Since domContainer is the only ref available across the features.\n * If some feature want to override something (say Resize the width), that only refelects if we add styles here.\n * Other wise fall into specificity/precedence of local CSS variables.\n * This won't effect other RS views, since these styles are generated through features.\n * If a feature is not applicable it won't add styles to this object.\n */\n const columnStyles = columns?.reduce((acc, column) => {\n const { style, field, hidden } = column;\n if (hidden) return acc;\n Object.entries(style).forEach(([s, v]) => {\n acc[`--col-${s}-${field.idHash}`] = v;\n });\n return acc;\n }, {});\n const visibleColumns = view.getVisibleColumns();\n if (\n visibleColumns.length === 1 &&\n view.getRowDensity() === rowDensityClasses[4].id &&\n visibleColumns[0].field.width === undefined\n ) {\n // If table has only one column then make column width as auto. flex-grow on cell-last will stretch the column to available width.\n delete columnStyles[`--col-width-${visibleColumns[0].field.idHash}`];\n }\n\n const domContainerRef = useRef();\n useSmallScreen(view, domContainerRef);\n\n return (\n <CosmosProviders>\n <StyledRSContainer\n ref={r => {\n setDomContainer(r);\n domContainerRef.current = r;\n }}\n style={columnStyles}\n className='rs-wrapper'\n >\n <Component view={view} />\n </StyledRSContainer>\n </CosmosProviders>\n );\n};\n\nRSWrapper.displayName = 'RSWrapper';\n\nRSWrapper.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nconst RepeatComponent = memo(forwardRef(repeatComponent(RSWrapper)));\n\nconst WithLocalization = (props, ref) => {\n return (\n <LocalizationProvider>\n <RepeatComponent {...props} ref={ref} />\n </LocalizationProvider>\n );\n};\n\nexport default memo(forwardRef(WithLocalization));\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/RSWrapper/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, memo, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled, { css } from 'styled-components';\n\nimport { Fullscreen, useFullscreenContext } from '@pega/cosmos-react-core';\nimport { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\n\nimport styles from '../../Views/rs-styles';\nimport Table from '../../Views/Table';\nimport Gallery from '../../Views/Gallery';\nimport Timeline from '../../Views/Timeline';\nimport Map from '../../Views/Map';\nimport repeatComponent from '../../index';\nimport useConfirmationModal from '../../Hooks/useConfirmationModal';\nimport useSmallScreen from '../../Hooks/useSmallScreen';\nimport { LocalizationProvider } from '../../Context/LocalizationContext';\n\nconst StyledRSContainer = styled(forwardRef((props, ref) => <div ref={ref} {...props} />))(() => {\n const fullscreen = useFullscreenContext();\n\n return css`\n ${styles}\n\n ${fullscreen &&\n fullscreen[0] &&\n css`\n height: 100%;\n `}\n `;\n});\n\nexport const CosmosProviders = ({ children }) => {\n return <Fullscreen>{children}</Fullscreen>;\n};\n\nconst RSWrapper = ({ view }) => {\n const { meta: { template } = {}, setDomContainer, columns } = view;\n\n let Component;\n switch (template) {\n case REPEATING_STRUCTURE_TEMPLATES.GALLERY:\n Component = Gallery;\n break;\n case REPEATING_STRUCTURE_TEMPLATES.TIMELINE:\n Component = Timeline;\n break;\n case REPEATING_STRUCTURE_TEMPLATES.MAP:\n Component = Map;\n break;\n default:\n Component = Table;\n }\n\n useConfirmationModal({ view });\n\n /**\n * Adding all column level styles into columnStyles on DOMContainer.\n * Since domContainer is the only ref available across the features.\n * If some feature want to override something (say Resize the width), that only refelects if we add styles here.\n * Other wise fall into specificity/precedence of local CSS variables.\n * This won't effect other RS views, since these styles are generated through features.\n * If a feature is not applicable it won't add styles to this object.\n */\n const columnStyles = columns?.reduce((acc, column) => {\n const { style, field, hidden } = column;\n if (hidden) return acc;\n Object.entries(style).forEach(([s, v]) => {\n acc[`--col-${s}-${field.idHash}`] = v;\n });\n return acc;\n }, {});\n\n const domContainerRef = useRef();\n useSmallScreen(view, domContainerRef);\n\n return (\n <CosmosProviders>\n <StyledRSContainer\n ref={r => {\n setDomContainer(r);\n domContainerRef.current = r;\n }}\n style={columnStyles}\n className='rs-wrapper'\n >\n <Component view={view} />\n </StyledRSContainer>\n </CosmosProviders>\n );\n};\n\nRSWrapper.displayName = 'RSWrapper';\n\nRSWrapper.propTypes = {\n view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nconst RepeatComponent = memo(forwardRef(repeatComponent(RSWrapper)));\n\nconst WithLocalization = (props, ref) => {\n return (\n <LocalizationProvider>\n <RepeatComponent {...props} ref={ref} />\n </LocalizationProvider>\n );\n};\n\nexport default memo(forwardRef(WithLocalization));\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAK9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAQ/C,UAAU,kBAAkB;IAC1B,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,GAAG;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IACxD,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IAC9B,aAAa,EAAE,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACjD,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACvC,SAAS,EAAE,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,QAAA,MAAM,aAAa,GAAI,4FAQpB,kBAAkB,4CA+LpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useGroup/GroupRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAK9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAQ/C,UAAU,kBAAkB;IAC1B,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,GAAG;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IACxD,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IAC9B,aAAa,EAAE,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACjD,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACvC,SAAS,EAAE,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,QAAA,MAAM,aAAa,GAAI,4FAQpB,kBAAkB,4CAuMpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -88,22 +88,28 @@ const GroupRenderer = ({ appliedGroups, groupingOptions, setGroups, columns, dat
88
88
  addRow();
89
89
  }
90
90
  }, [appliedGroups, addRow]);
91
- return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Flex, { container: { direction: 'column', gap: 1 }, className: 'group-content', ref: dragDropRef, children: appliedGroups.map((group, index) => (_createElement("div", { ...dropProps, "data-index": index, key: group.id },
92
- _jsxs(Flex, { container: {
93
- justify: 'between',
94
- alignItems: 'center',
95
- direction: 'row',
96
- wrap: 'nowrap',
97
- itemGap: 0.5
98
- }, ref: appliedGroups[index].id === focusRowId ? focusRowRef : null, children: [_jsx(Flex, { item: { grow: 1 }, children: _jsxs(Flex, { container: {
99
- justify: 'start',
100
- alignItems: 'center',
101
- direction: 'row',
102
- wrap: 'nowrap',
103
- itemGap: 0.5
104
- }, children: [_jsx(StyledDragHandle, { forwardedAs: 'div', role: 'button', icon: true, variant: 'simple', compact: true, ...dragProps, children: _jsx(Icon, { name: 'drag' }) }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { label: t('field'), labelHidden: true, value: group.columnId, disabled: !!group.customFunction, onChange: (newID) => handleColumnChange(group, index, newID), fieldProp: 'id', fieldDefs: fieldDefs?.filter(fieldDef => fieldDef.grouping &&
105
- (fieldDef.id.toString() === group.columnId.toString() ||
106
- !groupingOptions.exhaustedFields.has(fieldDef.id))) }) }), _jsx(DateFunctionSelector, { template: template, group: group, groupingOptions: groupingOptions, dateFunctions: dateFunctions, fieldDefs: fieldDefs, onChange: (newFunc) => handleDateFuncChange(group, index, newFunc) })] }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeGroup(index), label: t('delete_group'), children: _jsx(Icon, { name: 'trash' }) })] })))) }), template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (_jsx("div", { children: _jsx(Button, { variant: 'link', "aria-label": t('add_group'), onClick: addRow, children: _jsxs(Flex, { container: {
91
+ return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Flex, { container: { direction: 'column', gap: 1 }, className: 'group-content', ref: dragDropRef, children: appliedGroups.map((group, index) => {
92
+ const fieldLabel = columns?.find(f => f.field.id === group.columnId)?.label;
93
+ const dragHandleLabel = fieldLabel
94
+ ? t('drag_to_reorder_field', [fieldLabel])
95
+ : t('drag_to_reorder');
96
+ return (_createElement("div", { ...dropProps, "data-index": index, key: group.id },
97
+ _jsxs(Flex, { container: {
98
+ justify: 'between',
99
+ alignItems: 'center',
100
+ direction: 'row',
101
+ wrap: 'nowrap',
102
+ itemGap: 0.5
103
+ }, ref: appliedGroups[index].id === focusRowId ? focusRowRef : null, children: [_jsx(Flex, { item: { grow: 1 }, children: _jsxs(Flex, { container: {
104
+ justify: 'start',
105
+ alignItems: 'center',
106
+ direction: 'row',
107
+ wrap: 'nowrap',
108
+ itemGap: 0.5
109
+ }, children: [_jsx(StyledDragHandle, { forwardedAs: 'div', role: 'button', icon: true, variant: 'simple', compact: true, "aria-label": dragHandleLabel, ...dragProps, children: _jsx(Icon, { name: 'drag' }) }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { label: t('field'), labelHidden: true, value: group.columnId, disabled: !!group.customFunction, onChange: (newID) => handleColumnChange(group, index, newID), fieldProp: 'id', fieldDefs: fieldDefs?.filter(fieldDef => fieldDef.grouping &&
110
+ (fieldDef.id.toString() === group.columnId.toString() ||
111
+ !groupingOptions.exhaustedFields.has(fieldDef.id))) }) }), _jsx(DateFunctionSelector, { template: template, group: group, groupingOptions: groupingOptions, dateFunctions: dateFunctions, fieldDefs: fieldDefs, onChange: (newFunc) => handleDateFuncChange(group, index, newFunc) })] }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeGroup(index), label: t('delete_group'), children: _jsx(Icon, { name: 'trash' }) })] })));
112
+ }) }), template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (_jsx("div", { children: _jsx(Button, { variant: 'link', "aria-label": t('add_group'), onClick: addRow, children: _jsxs(Flex, { container: {
107
113
  inline: true,
108
114
  alignItems: 'start',
109
115
  gap: 1
@@ -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, REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport useRowFocus from '../useRowFocus';\nimport useDragDrop from '../../../../Hooks/useDragDrop';\nimport FieldSelector from '../../FieldSelector';\nimport type { GroupingOptions } from '../../Grouping.types';\n\nimport { getColumnById } from './utils';\nimport DateFunctionSelector from './DateFunctionSelector';\nimport type { AppliedGroup } from './useGroup';\n\nconst DropSelector = '[data-drop]';\n\nconst StyledDragHandle = styled(Button)`\n cursor: grab;\n`;\n\ninterface GroupRendererProps {\n appliedGroups: AppliedGroup[];\n groupingOptions: GroupingOptions;\n setGroups: (groups: (Group | { id: string })[]) => void;\n columns: RsCoreTypes.Column[];\n dateFunctions: RsCoreTypes.Meta['dateFunctions'];\n template: RsCoreTypes.Meta['template'];\n fieldDefs: RsCoreTypes.Meta['fieldDefs'];\n}\n\nconst GroupRenderer = ({\n appliedGroups,\n groupingOptions,\n setGroups,\n columns,\n dateFunctions,\n template,\n fieldDefs\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 value={group.columnId}\n disabled={!!group.customFunction}\n onChange={(newID: string) => handleColumnChange(group, index, newID)}\n fieldProp='id'\n fieldDefs={fieldDefs?.filter(\n fieldDef =>\n fieldDef.grouping &&\n (fieldDef.id.toString() === group.columnId.toString() ||\n !groupingOptions.exhaustedFields.has(fieldDef.id))\n )}\n />\n </Flex>\n <DateFunctionSelector\n template={template}\n group={group}\n groupingOptions={groupingOptions}\n dateFunctions={dateFunctions}\n fieldDefs={fieldDefs}\n onChange={(newFunc: Group['dateFunction']) =>\n handleDateFuncChange(group, index, newFunc)\n }\n />\n </Flex>\n </Flex>\n <Button\n icon\n variant='simple'\n onClick={() => removeGroup(index)}\n label={t('delete_group')}\n >\n <Icon name='trash' />\n </Button>\n </Flex>\n </div>\n ))}\n </Flex>\n {template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (\n <div>\n <Button variant='link' aria-label={t('add_group')} onClick={addRow}>\n <Flex\n container={{\n inline: true,\n alignItems: 'start',\n gap: 1\n }}\n as='span'\n >\n <Icon name='plus' />\n <span>{t('add')}</span>\n </Flex>\n </Button>\n </div>\n )}\n </Flex>\n );\n};\n\nexport default GroupRenderer;\n"]}
1
+ {"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, REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport useRowFocus from '../useRowFocus';\nimport useDragDrop from '../../../../Hooks/useDragDrop';\nimport FieldSelector from '../../FieldSelector';\nimport type { GroupingOptions } from '../../Grouping.types';\n\nimport { getColumnById } from './utils';\nimport DateFunctionSelector from './DateFunctionSelector';\nimport type { AppliedGroup } from './useGroup';\n\nconst DropSelector = '[data-drop]';\n\nconst StyledDragHandle = styled(Button)`\n cursor: grab;\n`;\n\ninterface GroupRendererProps {\n appliedGroups: AppliedGroup[];\n groupingOptions: GroupingOptions;\n setGroups: (groups: (Group | { id: string })[]) => void;\n columns: RsCoreTypes.Column[];\n dateFunctions: RsCoreTypes.Meta['dateFunctions'];\n template: RsCoreTypes.Meta['template'];\n fieldDefs: RsCoreTypes.Meta['fieldDefs'];\n}\n\nconst GroupRenderer = ({\n appliedGroups,\n groupingOptions,\n setGroups,\n columns,\n dateFunctions,\n template,\n fieldDefs\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 const fieldLabel = columns?.find(f => f.field.id === group.columnId)?.label;\n const dragHandleLabel = fieldLabel\n ? t('drag_to_reorder_field', [fieldLabel])\n : t('drag_to_reorder');\n\n return (\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 aria-label={dragHandleLabel}\n {...dragProps}\n >\n <Icon name='drag' />\n </StyledDragHandle>\n <Flex item={{ grow: 1 }}>\n <FieldSelector\n label={t('field')}\n labelHidden\n value={group.columnId}\n disabled={!!group.customFunction}\n onChange={(newID: string) => handleColumnChange(group, index, newID)}\n fieldProp='id'\n fieldDefs={fieldDefs?.filter(\n fieldDef =>\n fieldDef.grouping &&\n (fieldDef.id.toString() === group.columnId.toString() ||\n !groupingOptions.exhaustedFields.has(fieldDef.id))\n )}\n />\n </Flex>\n <DateFunctionSelector\n template={template}\n group={group}\n groupingOptions={groupingOptions}\n dateFunctions={dateFunctions}\n fieldDefs={fieldDefs}\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 })}\n </Flex>\n {template !== REPEATING_STRUCTURE_TEMPLATES.TIMELINE && (\n <div>\n <Button variant='link' aria-label={t('add_group')} onClick={addRow}>\n <Flex\n container={{\n inline: true,\n alignItems: 'start',\n gap: 1\n }}\n as='span'\n >\n <Icon name='plus' />\n <span>{t('add')}</span>\n </Flex>\n </Button>\n </div>\n )}\n </Flex>\n );\n};\n\nexport default GroupRenderer;\n"]}
@@ -1,5 +1,5 @@
1
1
  export default Row;
2
- declare function Row({ updateSortItemId, updateSortItemOrder, removeSortItem, sortItems, index, id, order, sequence, dragProps, dropProps, focusRowRef, fieldDefs }: {
2
+ declare function Row({ updateSortItemId, updateSortItemOrder, removeSortItem, sortItems, index, id, order, sequence, dragProps, dropProps, focusRowRef, fieldDefs, columns }: {
3
3
  updateSortItemId: any;
4
4
  updateSortItemOrder: any;
5
5
  removeSortItem: any;
@@ -12,6 +12,7 @@ declare function Row({ updateSortItemId, updateSortItemOrder, removeSortItem, so
12
12
  dropProps: any;
13
13
  focusRowRef: any;
14
14
  fieldDefs: any;
15
+ columns: any;
15
16
  }): import("react/jsx-runtime").JSX.Element | null;
16
17
  declare namespace Row {
17
18
  namespace propTypes {
@@ -1 +1 @@
1
- {"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/Row.jsx"],"names":[],"mappings":";AAwBA;;;;;;;;;;;;;mDAwFC;;;;;;;;;;;;;;;;;;;;;;;;;sBAhHqB,YAAY"}
1
+ {"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/Row.jsx"],"names":[],"mappings":";AAgCA;;;;;;;;;;;;;;mDA+FC;;;;;;;;;;;;;;;;;;;;;;;;;sBA/HqB,YAAY"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import PropTypes from 'prop-types';
3
3
  import styled, { css } from 'styled-components';
4
- import { Button, defaultThemeProp, Flex, Icon, Option, Select } from '@pega/cosmos-react-core';
4
+ import { Button, defaultThemeProp, Flex, Icon, Option, Select, useI18n } from '@pega/cosmos-react-core';
5
5
  import FieldSelector from '../../FieldSelector';
6
6
  import { keyFrom } from '../../../../Utils';
7
7
  import useTranslate from '../../../../Hooks/useTranslate';
@@ -17,20 +17,25 @@ const StyledDragHandle = styled(Button)(({ theme }) => {
17
17
  `;
18
18
  });
19
19
  StyledDragHandle.defaultProps = defaultThemeProp;
20
- const Row = ({ updateSortItemId, updateSortItemOrder, removeSortItem, sortItems, index, id, order, sequence, dragProps, dropProps, focusRowRef, fieldDefs }) => {
20
+ const Row = ({ updateSortItemId, updateSortItemOrder, removeSortItem, sortItems, index, id, order, sequence, dragProps, dropProps, focusRowRef, fieldDefs, columns }) => {
21
21
  const [translate] = useTranslate();
22
+ const t = useI18n();
22
23
  const validSortColumnsInRow = getValidSortColumnsInRow(fieldDefs, sortItems, id);
23
24
  if (!validSortColumnsInRow || !validSortColumnsInRow.length)
24
25
  return null;
25
26
  const validSortOrders = getValidSortOrders();
26
27
  const { label } = validSortOrders.find(v => v.id === order) || {};
28
+ const fieldLabel = columns?.find(f => f.field.id === id)?.label;
29
+ const dragHandleLabel = fieldLabel
30
+ ? t('drag_to_reorder_field', [fieldLabel])
31
+ : t('drag_to_reorder');
27
32
  return (_jsx("div", { ...dropProps, "data-sequence": sequence, children: _jsxs(Flex, { container: {
28
33
  justify: 'between',
29
34
  alignItems: 'end',
30
35
  direction: 'row',
31
36
  wrap: 'no-wrap',
32
37
  itemGap: 0.5
33
- }, ref: focusRowRef, children: [_jsx(StyledDragHandle, { forwardedAs: 'div', role: 'button', icon: true, variant: 'simple', compact: true, disabled: !dragProps, ...dragProps, children: _jsx(Icon, { name: 'drag' }) }), _jsx(Flex, { item: { grow: 1, basis: '0' }, children: _jsx(FieldSelector, { label: translate('Field'), fieldDefs: fieldDefs, value: id, onChange: newID => updateSortItemId(newID, sequence), fieldProp: 'id', readOnly: !updateSortItemId }) }), _jsx(Flex, { item: { grow: 1, basis: '0' }, children: _jsxs(Select, { label: translate('Sort order'), className: 'select-sorts', "data-testid": 'SortSelector', value: label, onChange: e => {
38
+ }, ref: focusRowRef, children: [_jsx(StyledDragHandle, { forwardedAs: 'div', role: 'button', icon: true, variant: 'simple', compact: true, disabled: !dragProps, "aria-label": dragHandleLabel, ...dragProps, children: _jsx(Icon, { name: 'drag' }) }), _jsx(Flex, { item: { grow: 1, basis: '0' }, children: _jsx(FieldSelector, { label: translate('Field'), fieldDefs: fieldDefs, value: id, onChange: newID => updateSortItemId(newID, sequence), fieldProp: 'id', readOnly: !updateSortItemId }) }), _jsx(Flex, { item: { grow: 1, basis: '0' }, children: _jsxs(Select, { label: translate('Sort order'), className: 'select-sorts', "data-testid": 'SortSelector', value: label, onChange: e => {
34
39
  const o = validSortOrders.find(v => v.label === e.target.value);
35
40
  if (o) {
36
41
  updateSortItemOrder(e, sequence, o.id);
@@ -1 +1 @@
1
- {"version":3,"file":"Row.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/Row.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport styled, { css } from 'styled-components';\n\nimport { Button, defaultThemeProp, Flex, Icon, Option, Select } from '@pega/cosmos-react-core';\n\nimport FieldSelector from '../../FieldSelector';\nimport { keyFrom } from '../../../../Utils';\nimport useTranslate from '../../../../Hooks/useTranslate';\n\nimport { getValidSortColumnsInRow, getValidSortOrders } from './utils';\n\nconst StyledDragHandle = styled(Button)(({ theme }) => {\n return css`\n cursor: grab;\n margin-block: calc(${theme.base.spacing} * 0.5);\n\n @media (pointer: coarse) {\n margin-block: calc(${theme.base.spacing} * 1.25);\n }\n `;\n});\n\nStyledDragHandle.defaultProps = defaultThemeProp;\n\nconst Row = ({\n updateSortItemId,\n updateSortItemOrder,\n removeSortItem,\n sortItems,\n index,\n id,\n order,\n sequence,\n dragProps,\n dropProps,\n focusRowRef,\n fieldDefs\n}) => {\n const [translate] = useTranslate();\n const validSortColumnsInRow = getValidSortColumnsInRow(fieldDefs, sortItems, id);\n if (!validSortColumnsInRow || !validSortColumnsInRow.length) return null;\n const validSortOrders = getValidSortOrders();\n const { label } = validSortOrders.find(v => v.id === order) || {};\n\n return (\n <div {...dropProps} data-sequence={sequence}>\n <Flex\n container={{\n justify: 'between',\n alignItems: 'end',\n direction: 'row',\n wrap: 'no-wrap',\n itemGap: 0.5\n }}\n ref={focusRowRef}\n >\n <StyledDragHandle\n forwardedAs='div'\n role='button'\n icon\n variant='simple'\n compact\n disabled={!dragProps}\n {...dragProps}\n >\n <Icon name='drag' />\n </StyledDragHandle>\n <Flex item={{ grow: 1, basis: '0' }}>\n <FieldSelector\n label={translate('Field')}\n fieldDefs={fieldDefs}\n value={id}\n onChange={newID => updateSortItemId(newID, sequence)}\n fieldProp='id'\n readOnly={!updateSortItemId}\n />\n </Flex>\n <Flex item={{ grow: 1, basis: '0' }}>\n <Select\n label={translate('Sort order')}\n className='select-sorts'\n data-testid='SortSelector'\n value={label}\n onChange={e => {\n const o = validSortOrders.find(v => v.label === e.target.value);\n if (o) {\n updateSortItemOrder(e, sequence, o.id);\n }\n }}\n >\n <option value=''>{translate('Select...')}</option>\n {validSortOrders.map((v, i) => (\n <Option key={keyFrom(v.label, i)} value={v.label}>\n {translate(v.label)}\n </Option>\n ))}\n </Select>\n </Flex>\n <Flex item>\n <Button\n icon\n variant='simple'\n onClick={() => removeSortItem(index, order)}\n label={translate('Remove sort')}\n disabled={!removeSortItem}\n >\n <Icon name='trash' />\n </Button>\n </Flex>\n </Flex>\n </div>\n );\n};\n\nRow.propTypes = {\n updateSortItemId: PropTypes.func,\n updateSortItemOrder: PropTypes.func.isRequired,\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n removeSortItem: PropTypes.func,\n sortItems: PropTypes.arrayOf(PropTypes.any).isRequired,\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n index: PropTypes.number.isRequired,\n order: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n sequence: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n dragProps: PropTypes.objectOf(PropTypes.any),\n dropProps: PropTypes.objectOf(PropTypes.any),\n focusRowRef: PropTypes.objectOf(PropTypes.any),\n fieldDefs: PropTypes.arrayOf(PropTypes.any).isRequired\n};\n\nRow.displayName = 'Row';\n\nexport default Row;\n"]}
1
+ {"version":3,"file":"Row.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/Row.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n Icon,\n Option,\n Select,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport FieldSelector from '../../FieldSelector';\nimport { keyFrom } from '../../../../Utils';\nimport useTranslate from '../../../../Hooks/useTranslate';\n\nimport { getValidSortColumnsInRow, getValidSortOrders } from './utils';\n\nconst StyledDragHandle = styled(Button)(({ theme }) => {\n return css`\n cursor: grab;\n margin-block: calc(${theme.base.spacing} * 0.5);\n\n @media (pointer: coarse) {\n margin-block: calc(${theme.base.spacing} * 1.25);\n }\n `;\n});\n\nStyledDragHandle.defaultProps = defaultThemeProp;\n\nconst Row = ({\n updateSortItemId,\n updateSortItemOrder,\n removeSortItem,\n sortItems,\n index,\n id,\n order,\n sequence,\n dragProps,\n dropProps,\n focusRowRef,\n fieldDefs,\n columns\n}) => {\n const [translate] = useTranslate();\n const t = useI18n();\n const validSortColumnsInRow = getValidSortColumnsInRow(fieldDefs, sortItems, id);\n if (!validSortColumnsInRow || !validSortColumnsInRow.length) return null;\n const validSortOrders = getValidSortOrders();\n const { label } = validSortOrders.find(v => v.id === order) || {};\n const fieldLabel = columns?.find(f => f.field.id === id)?.label;\n const dragHandleLabel = fieldLabel\n ? t('drag_to_reorder_field', [fieldLabel])\n : t('drag_to_reorder');\n\n return (\n <div {...dropProps} data-sequence={sequence}>\n <Flex\n container={{\n justify: 'between',\n alignItems: 'end',\n direction: 'row',\n wrap: 'no-wrap',\n itemGap: 0.5\n }}\n ref={focusRowRef}\n >\n <StyledDragHandle\n forwardedAs='div'\n role='button'\n icon\n variant='simple'\n compact\n disabled={!dragProps}\n aria-label={dragHandleLabel}\n {...dragProps}\n >\n <Icon name='drag' />\n </StyledDragHandle>\n <Flex item={{ grow: 1, basis: '0' }}>\n <FieldSelector\n label={translate('Field')}\n fieldDefs={fieldDefs}\n value={id}\n onChange={newID => updateSortItemId(newID, sequence)}\n fieldProp='id'\n readOnly={!updateSortItemId}\n />\n </Flex>\n <Flex item={{ grow: 1, basis: '0' }}>\n <Select\n label={translate('Sort order')}\n className='select-sorts'\n data-testid='SortSelector'\n value={label}\n onChange={e => {\n const o = validSortOrders.find(v => v.label === e.target.value);\n if (o) {\n updateSortItemOrder(e, sequence, o.id);\n }\n }}\n >\n <option value=''>{translate('Select...')}</option>\n {validSortOrders.map((v, i) => (\n <Option key={keyFrom(v.label, i)} value={v.label}>\n {translate(v.label)}\n </Option>\n ))}\n </Select>\n </Flex>\n <Flex item>\n <Button\n icon\n variant='simple'\n onClick={() => removeSortItem(index, order)}\n label={translate('Remove sort')}\n disabled={!removeSortItem}\n >\n <Icon name='trash' />\n </Button>\n </Flex>\n </Flex>\n </div>\n );\n};\n\nRow.propTypes = {\n updateSortItemId: PropTypes.func,\n updateSortItemOrder: PropTypes.func.isRequired,\n columns: PropTypes.arrayOf(PropTypes.any).isRequired,\n removeSortItem: PropTypes.func,\n sortItems: PropTypes.arrayOf(PropTypes.any).isRequired,\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n index: PropTypes.number.isRequired,\n order: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n sequence: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n dragProps: PropTypes.objectOf(PropTypes.any),\n dropProps: PropTypes.objectOf(PropTypes.any),\n focusRowRef: PropTypes.objectOf(PropTypes.any),\n fieldDefs: PropTypes.arrayOf(PropTypes.any).isRequired\n};\n\nRow.displayName = 'Row';\n\nexport default Row;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Timeline/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAkElE,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,QAAQ,GAAI,UAAU,iBAAiB,4CA6F5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Timeline/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAqElE,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,QAAQ,GAAI,UAAU,iBAAiB,4CA6F5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -30,15 +30,22 @@ const StyledTimelineContainer = styled.div(({ view, isFullscreen }) => {
30
30
  `;
31
31
  });
32
32
  const StyledRowContainer = styled.div(({ isFullscreen, view }) => {
33
- const { bodyHeight, totalItemCount, meta: { basicMode } } = view;
33
+ const { bodyHeight, totalItemCount } = view;
34
34
  return css `
35
35
  ${() => generateRSDataContainerHeightStyles()};
36
36
  position: relative;
37
- min-height: ${basicMode && totalItemCount === 0 ? '100px' : 'auto'};
37
+ min-height: auto;
38
38
  flex-grow: 0;
39
39
 
40
40
  /* Adjust height based on number of rows configured */
41
41
  height: ${bodyHeight && !isFullscreen ? `${bodyHeight}px` : 'auto'};
42
+
43
+ ${totalItemCount === 0 &&
44
+ css `
45
+ /* stylelint-disable-next-line unit-allowed-list */
46
+ min-height: 100px;
47
+ height: inherit;
48
+ `}
42
49
  `;
43
50
  });
44
51
  const INITIAL_DEFAULT_CHUNK_SIZE = 40;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useCallback, useMemo, useState, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, useFullscreenContext } from '@pega/cosmos-react-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\n// TODO remove ts-ignore once Toolbar migrated to TS\n// @ts-ignore\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport getCount from '../../Components/Toolbar/utils/getCount';\nimport { EXTERNAL_FILTERS } from '../../constants';\nimport RsCardWrapper from '../RsCardWrapper';\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\nimport EmptyContainer from '../../Components/DefaultComponents/EmptyContainer';\nimport { isFilterApplied } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport TimelineInner from './Timeline';\nimport getActivities from './utils';\n\nconst StyledTimeline = styled(TimelineInner)(({ theme }) => {\n return css`\n flex: 1;\n padding-inline-end: ${theme.base.spacing};\n overflow: auto;\n `;\n});\n\nStyledTimeline.defaultProps = defaultThemeProp;\n\ninterface StyledTimelineContainerProps {\n view: RsCoreTypes.View;\n isFullscreen: boolean;\n}\n\nconst StyledTimelineContainer = styled.div<StyledTimelineContainerProps>(\n ({ view, isFullscreen }) => {\n return css`\n position: relative;\n ${() => generateRSHeightStyles({ view, isFullscreen })}\n `;\n }\n);\n\ninterface StyledRowContainerProps {\n isFullscreen: boolean;\n view: RsCoreTypes.View;\n}\n\nconst StyledRowContainer = styled.div<StyledRowContainerProps>(({ isFullscreen, view }) => {\n const {\n bodyHeight,\n totalItemCount,\n meta: { basicMode }\n } = view;\n return css`\n ${() => generateRSDataContainerHeightStyles()};\n position: relative;\n min-height: ${basicMode && totalItemCount === 0 ? '100px' : 'auto'};\n flex-grow: 0;\n\n /* Adjust height based on number of rows configured */\n height: ${bodyHeight && !isFullscreen ? `${bodyHeight}px` : 'auto'};\n `;\n});\n\nconst INITIAL_DEFAULT_CHUNK_SIZE = 40;\nconst APPEND_DEFAULT_CHUNK_SIZE = 25;\n\nexport interface TimelineViewProps {\n view: RsCoreTypes.View;\n}\n\nconst Timeline = ({ view }: TimelineViewProps) => {\n const isFullscreen = !!useFullscreenContext()?.[0];\n const [translate] = useTranslate();\n const {\n rows,\n meta = { fieldDefs: [] as RsCoreTypes.FieldDef[], itemKey: '' } as RsCoreTypes.Meta,\n columns,\n groupHeaders,\n state,\n domContainer,\n hasNoRecords\n } = view;\n const { filterExpression, externalState, searchText, paginationOptions, groups } = state;\n const ref = useRef<HTMLTableElement>(null);\n const [loading, setLoading] = useState(false);\n const [hasMore, setHasMore] = useState(true);\n\n const count = getCount({ view });\n const visibleGroupHeaders = groupHeaders?.filter(({ isVisible }) => isVisible)?.length ?? 0;\n const paginationEndIndex = paginationOptions?.rootVirtualiser?.endIndex ?? 0;\n\n const onLoadMore = useCallback(() => {\n if (!loading) {\n setLoading(true);\n const endIndex =\n rows!.length + visibleGroupHeaders + (meta.numberOfRows || APPEND_DEFAULT_CHUNK_SIZE);\n view.type.onPaginate({ startIndex: 0, endIndex, id: 'rootVirtualiser' });\n }\n }, [loading, view.type, meta.numberOfRows, rows!.length, visibleGroupHeaders]);\n\n useEffect(() => {\n view.type.onPaginate({\n startIndex: 0,\n endIndex: meta.numberOfRows || INITIAL_DEFAULT_CHUNK_SIZE,\n id: 'rootVirtualiser'\n });\n }, [view.type, meta.numberOfRows]);\n\n useEffect(() => {\n setHasMore(rows!.length !== count.total);\n if (paginationEndIndex <= rows!.length + visibleGroupHeaders || rows!.length === count.total) {\n setLoading(false);\n }\n }, [count.total, rows!.length, paginationEndIndex, visibleGroupHeaders]);\n\n const activities = useMemo(\n () => getActivities(groupHeaders, columns, meta, groups?.[0]),\n [groupHeaders, columns, meta, groups?.[0]]\n );\n\n let loadMore;\n if (hasMore) {\n loadMore = onLoadMore;\n }\n\n return (\n <RsCardWrapper>\n <StyledTimelineContainer view={view} isFullscreen={isFullscreen}>\n <Toolbar view={view} />\n <RenderView view={view} type={EXTERNAL_FILTERS} />\n\n <StyledRowContainer\n className='container row-container'\n isFullscreen={isFullscreen}\n view={view}\n >\n <StyledTimeline\n activities={activities}\n currentTime={new Date()}\n groupBy={groups?.[0]}\n loading={loading || !rows || !!view.isLoading}\n loadMore={loadMore}\n data-test-id='Timeline'\n ref={ref}\n />\n {domContainer && hasNoRecords && (\n <EmptyContainer\n message={\n isFilterApplied(\n { filterExpression, searchText, externalState },\n meta.externalFilters\n )\n ? translate('No records found')\n : translate('No records')\n }\n domContainer={domContainer}\n shouldAnnounce={false}\n />\n )}\n </StyledRowContainer>\n </StyledTimelineContainer>\n </RsCardWrapper>\n );\n};\n\nexport default Timeline;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useCallback, useMemo, useState, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, useFullscreenContext } from '@pega/cosmos-react-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\n// TODO remove ts-ignore once Toolbar migrated to TS\n// @ts-ignore\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport getCount from '../../Components/Toolbar/utils/getCount';\nimport { EXTERNAL_FILTERS } from '../../constants';\nimport RsCardWrapper from '../RsCardWrapper';\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\nimport EmptyContainer from '../../Components/DefaultComponents/EmptyContainer';\nimport { isFilterApplied } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport TimelineInner from './Timeline';\nimport getActivities from './utils';\n\nconst StyledTimeline = styled(TimelineInner)(({ theme }) => {\n return css`\n flex: 1;\n padding-inline-end: ${theme.base.spacing};\n overflow: auto;\n `;\n});\n\nStyledTimeline.defaultProps = defaultThemeProp;\n\ninterface StyledTimelineContainerProps {\n view: RsCoreTypes.View;\n isFullscreen: boolean;\n}\n\nconst StyledTimelineContainer = styled.div<StyledTimelineContainerProps>(\n ({ view, isFullscreen }) => {\n return css`\n position: relative;\n ${() => generateRSHeightStyles({ view, isFullscreen })}\n `;\n }\n);\n\ninterface StyledRowContainerProps {\n isFullscreen: boolean;\n view: RsCoreTypes.View;\n}\n\nconst StyledRowContainer = styled.div<StyledRowContainerProps>(({ isFullscreen, view }) => {\n const { bodyHeight, totalItemCount } = view;\n return css`\n ${() => generateRSDataContainerHeightStyles()};\n position: relative;\n min-height: auto;\n flex-grow: 0;\n\n /* Adjust height based on number of rows configured */\n height: ${bodyHeight && !isFullscreen ? `${bodyHeight}px` : 'auto'};\n\n ${totalItemCount === 0 &&\n css`\n /* stylelint-disable-next-line unit-allowed-list */\n min-height: 100px;\n height: inherit;\n `}\n `;\n});\n\nconst INITIAL_DEFAULT_CHUNK_SIZE = 40;\nconst APPEND_DEFAULT_CHUNK_SIZE = 25;\n\nexport interface TimelineViewProps {\n view: RsCoreTypes.View;\n}\n\nconst Timeline = ({ view }: TimelineViewProps) => {\n const isFullscreen = !!useFullscreenContext()?.[0];\n const [translate] = useTranslate();\n const {\n rows,\n meta = { fieldDefs: [] as RsCoreTypes.FieldDef[], itemKey: '' } as RsCoreTypes.Meta,\n columns,\n groupHeaders,\n state,\n domContainer,\n hasNoRecords\n } = view;\n const { filterExpression, externalState, searchText, paginationOptions, groups } = state;\n const ref = useRef<HTMLTableElement>(null);\n const [loading, setLoading] = useState(false);\n const [hasMore, setHasMore] = useState(true);\n\n const count = getCount({ view });\n const visibleGroupHeaders = groupHeaders?.filter(({ isVisible }) => isVisible)?.length ?? 0;\n const paginationEndIndex = paginationOptions?.rootVirtualiser?.endIndex ?? 0;\n\n const onLoadMore = useCallback(() => {\n if (!loading) {\n setLoading(true);\n const endIndex =\n rows!.length + visibleGroupHeaders + (meta.numberOfRows || APPEND_DEFAULT_CHUNK_SIZE);\n view.type.onPaginate({ startIndex: 0, endIndex, id: 'rootVirtualiser' });\n }\n }, [loading, view.type, meta.numberOfRows, rows!.length, visibleGroupHeaders]);\n\n useEffect(() => {\n view.type.onPaginate({\n startIndex: 0,\n endIndex: meta.numberOfRows || INITIAL_DEFAULT_CHUNK_SIZE,\n id: 'rootVirtualiser'\n });\n }, [view.type, meta.numberOfRows]);\n\n useEffect(() => {\n setHasMore(rows!.length !== count.total);\n if (paginationEndIndex <= rows!.length + visibleGroupHeaders || rows!.length === count.total) {\n setLoading(false);\n }\n }, [count.total, rows!.length, paginationEndIndex, visibleGroupHeaders]);\n\n const activities = useMemo(\n () => getActivities(groupHeaders, columns, meta, groups?.[0]),\n [groupHeaders, columns, meta, groups?.[0]]\n );\n\n let loadMore;\n if (hasMore) {\n loadMore = onLoadMore;\n }\n\n return (\n <RsCardWrapper>\n <StyledTimelineContainer view={view} isFullscreen={isFullscreen}>\n <Toolbar view={view} />\n <RenderView view={view} type={EXTERNAL_FILTERS} />\n\n <StyledRowContainer\n className='container row-container'\n isFullscreen={isFullscreen}\n view={view}\n >\n <StyledTimeline\n activities={activities}\n currentTime={new Date()}\n groupBy={groups?.[0]}\n loading={loading || !rows || !!view.isLoading}\n loadMore={loadMore}\n data-test-id='Timeline'\n ref={ref}\n />\n {domContainer && hasNoRecords && (\n <EmptyContainer\n message={\n isFilterApplied(\n { filterExpression, searchText, externalState },\n meta.externalFilters\n )\n ? translate('No records found')\n : translate('No records')\n }\n domContainer={domContainer}\n shouldAnnounce={false}\n />\n )}\n </StyledRowContainer>\n </StyledTimelineContainer>\n </RsCardWrapper>\n );\n};\n\nexport default Timeline;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/lists-react",
3
- "version": "9.0.0-build.23.4",
3
+ "version": "9.0.0-build.23.5",
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.23.4",
18
- "@pega/cosmos-react-core": "9.0.0-build.23.4",
19
- "@pega/cosmos-react-rte": "9.0.0-build.23.4",
17
+ "@pega/cosmos-react-condition-builder": "9.0.0-build.23.5",
18
+ "@pega/cosmos-react-core": "9.0.0-build.23.5",
19
+ "@pega/cosmos-react-rte": "9.0.0-build.23.5",
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.23",
27
- "pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.23.4",
28
- "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.23.4",
27
+ "pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.23.5",
28
+ "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.23.5",
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.23.4",
47
+ "srs-utils": "9.0.0-build.23.5",
48
48
  "typescript": "~5.9.3"
49
49
  }
50
50
  }