@pega/lists-react 9.36.0 → 9.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js +4 -4
  2. package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js.map +1 -1
  3. package/lib/Core/Components/DefaultComponents/RowHeight.d.ts.map +1 -1
  4. package/lib/Core/Components/DefaultComponents/RowHeight.js +5 -2
  5. package/lib/Core/Components/DefaultComponents/RowHeight.js.map +1 -1
  6. package/lib/Core/Components/DynamicFieldConfiguration.d.ts +3 -1
  7. package/lib/Core/Components/DynamicFieldConfiguration.d.ts.map +1 -1
  8. package/lib/Core/Components/DynamicFieldConfiguration.js +7 -4
  9. package/lib/Core/Components/DynamicFieldConfiguration.js.map +1 -1
  10. package/lib/Core/Components/Filters/AdvanceFilter.js +4 -4
  11. package/lib/Core/Components/Filters/AdvanceFilter.js.map +1 -1
  12. package/lib/Core/Components/Filters/BooleanFilter.js +2 -2
  13. package/lib/Core/Components/Filters/BooleanFilter.js.map +1 -1
  14. package/lib/Core/Components/Filters/CommonFilter.js +1 -1
  15. package/lib/Core/Components/Filters/CommonFilter.js.map +1 -1
  16. package/lib/Core/Components/Filters/SelectFilter.js +2 -2
  17. package/lib/Core/Components/Filters/SelectFilter.js.map +1 -1
  18. package/lib/Core/Components/Filters/SimpleFilter.d.ts.map +1 -1
  19. package/lib/Core/Components/Filters/SimpleFilter.js +1 -2
  20. package/lib/Core/Components/Filters/SimpleFilter.js.map +1 -1
  21. package/lib/Core/Components/HeaderMenu/index.d.ts.map +1 -1
  22. package/lib/Core/Components/HeaderMenu/index.js +2 -3
  23. package/lib/Core/Components/HeaderMenu/index.js.map +1 -1
  24. package/lib/Core/Components/RFColumnConfigurator.d.ts +1 -1
  25. package/lib/Core/Components/RFColumnConfigurator.d.ts.map +1 -1
  26. package/lib/Core/Components/RFColumnConfigurator.js +8 -5
  27. package/lib/Core/Components/RFColumnConfigurator.js.map +1 -1
  28. package/lib/Core/Components/Toolbar/ColumnSelector.d.ts.map +1 -1
  29. package/lib/Core/Components/Toolbar/ColumnSelector.js +5 -3
  30. package/lib/Core/Components/Toolbar/ColumnSelector.js.map +1 -1
  31. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.d.ts.map +1 -1
  32. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.js +2 -1
  33. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.js.map +1 -1
  34. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.d.ts +2 -2
  35. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.d.ts.map +1 -1
  36. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.js +22 -5
  37. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.js.map +1 -1
  38. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/utils.d.ts +2 -1
  39. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/utils.d.ts.map +1 -1
  40. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/utils.js +7 -3
  41. package/lib/Core/Components/Virtualise/VariableHeightVirtualizer/utils.js.map +1 -1
  42. package/package.json +8 -8
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/HeaderMenu/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useCallback, useMemo, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n Icon,\n Popover,\n Menu,\n useElement,\n Button,\n VisuallyHiddenText,\n createUID,\n getActiveElement,\n useOuterEvent\n} from '@pega/cosmos-react-core';\nimport { removeEmptyValues, FieldType } from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\nimport DynamicFieldConfiguration from '../DynamicFieldConfiguration';\nimport FilterComponent from '../Filters/Filter';\nimport RFColumnConfigurator from '../RFColumnConfigurator';\nimport GroupingMenu from '../Grouping/GroupingMenu';\n\nimport { getActions, customizeColumn } from './actions';\n\nconst Default = 'default';\nconst Filter = 'Filter';\nconst Grouping = 'Grouping';\nconst DynamicColumnLeft = 'Combine with left';\nconst DynamicColumnRight = 'Combine with right';\nconst CustomizeColumn = 'Format';\nconst sortActionStates = ['Sort-ascending', 'Sort-descending', 'Remove-sort'];\n\nconst ariaSort = {\n asc: 'Ascending',\n desc: 'Descending'\n};\n\nfunction getFirstLevelActions(actions) {\n return removeEmptyValues(\n actions.map(function mapper(s) {\n if (Array.isArray(s)) {\n return s.map(mapper);\n }\n const { id, icon, label, show = true, onClick, disabled } = s;\n if (!show) {\n return null;\n }\n return {\n 'data-test-id': id,\n primary: label,\n visual: <Icon name={icon} />,\n id: id.replaceAll(' ', '-'), // eg: Combine with right -> Combine-with-right\n onClick,\n disabled\n };\n })\n );\n}\n\nfunction getFocusables(elementRef) {\n return elementRef.querySelectorAll(\n 'a[href]:not([disabled]), button:not([disabled]), textarea:not([disabled]):not([readonly]), input:not([disabled]):not([readonly]), select:not([disabled]):not([readonly])'\n );\n}\n\nfunction headerMenuTabHandler(e, popperRef) {\n const focusables = getFocusables(popperRef);\n const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n const activeEl = getActiveElement();\n\n if (!e.shiftKey && (activeEl === popperRef || activeEl === lastFocusable)) {\n firstFocusable?.focus();\n e.preventDefault();\n } else if (e.shiftKey && (activeEl === popperRef || activeEl === firstFocusable)) {\n lastFocusable?.focus();\n e.preventDefault();\n }\n}\n\nexport default function HeaderMenu({ column, popoverButtonRef }) {\n const view = column.parent;\n const {\n state: { clearColFilter }\n } = view;\n const [translate] = useTranslate();\n const { field } = column;\n const uid = createUID();\n const sortDescriptionId = `${uid}_description`;\n const isClearColFilter = clearColFilter === field.id;\n const sort = ariaSort[column?.getSortProperties()?.sortOrder];\n const sortSequence = column?.getSortProperties()?.sortSequence;\n const filtered = column?.filtered;\n\n const [moreContent, setMoreContent] = useState(Default);\n const [forceShowMenu, setForceShowMenu] = useState(false);\n const [sortDescription, setSortDescription] = useState('');\n const [popperRef, setPopperRef] = useElement();\n\n const finishPopOver = useCallback(() => {\n if (moreContent === Filter && isClearColFilter) {\n view.type.clearFilter(null);\n }\n if (popperRef && popoverButtonRef.current) {\n popoverButtonRef.current.focus();\n }\n setForceShowMenu(false);\n }, [moreContent, isClearColFilter, view, popperRef, popoverButtonRef]);\n\n const onUndoHierarchy = useCallback(() => {\n column.parent?.type.clearHierarchicalGroup();\n finishPopOver();\n }, [column, finishPopOver]);\n\n useEffect(() => {\n let sortStr = '';\n if (sort) sortStr = `${translate('Sorted')} ${translate(sort)}`;\n if (sortSequence) sortStr += ` ${translate('Sort priority')} ${sortSequence}`;\n if (filtered) sortStr += ` ${translate('Filtered column')}`;\n setSortDescription(sortStr);\n }, [sort, sortSequence, filtered, translate]);\n\n const actions = useMemo(\n () =>\n getActions({\n column,\n setMoreContent,\n onUndoHierarchy,\n translate,\n finishPopOver\n }),\n [column, onUndoHierarchy, translate, finishPopOver]\n );\n\n const firstLevelActions = useMemo(() => getFirstLevelActions(actions), [actions]);\n\n const content = useMemo(() => {\n switch (moreContent) {\n case Filter:\n return (\n <FilterComponent\n column={column}\n finishPopOver={finishPopOver}\n popoverButtonRef={popoverButtonRef}\n />\n );\n case Grouping:\n return <GroupingMenu column={column} finishPopOver={finishPopOver} />;\n case DynamicColumnLeft:\n case DynamicColumnRight:\n return (\n <DynamicFieldConfiguration\n column={column}\n onSubmit={(title, templateName, bHideColumns) => {\n column.applyMerge(\n moreContent === DynamicColumnLeft ? 'left' : 'right',\n title,\n templateName,\n bHideColumns\n );\n finishPopOver();\n if (templateName === 'multiline') view.type.applyRowHeight('4');\n }}\n onCancel={finishPopOver}\n popoverButtonRef={popoverButtonRef}\n heading={`Combine with ${moreContent === DynamicColumnLeft ? 'left' : 'right'}`}\n />\n );\n case CustomizeColumn:\n return (\n <RFColumnConfigurator\n column={column}\n finishPopOver={finishPopOver}\n onSubmit={(rfConfig, columnAlias, displayMode) => {\n customizeColumn(column, rfConfig, displayMode, columnAlias, column.alias);\n }}\n onCancel={finishPopOver}\n popoverButtonRef={popoverButtonRef}\n />\n );\n default:\n return (\n <Menu\n scrollAt='400'\n data-test-id='action-menu'\n items={firstLevelActions.flat()}\n className='action-menu'\n focusControlEl={popoverButtonRef.current}\n onItemClick={id => {\n // NVDA/JAWS reading out the stale sort order on sort action\n // Removing intermediate sort state and adding back when we receive it from column prop\n if (sortActionStates.includes(id)) {\n setSortDescription('');\n }\n }}\n />\n );\n }\n }, [moreContent, column, finishPopOver, popoverButtonRef, firstLevelActions, view.type]);\n\n useOuterEvent('mousedown', [popperRef], () => {\n if (\n moreContent !== Filter &&\n moreContent !== 'Format' &&\n moreContent !== 'Combine with left' &&\n moreContent !== 'Combine with right'\n ) {\n finishPopOver();\n }\n });\n\n useEffect(() => {\n if (isClearColFilter) {\n setMoreContent(Filter);\n setForceShowMenu(true);\n }\n }, [isClearColFilter]);\n\n useEffect(() => {\n // Focus the first focusable element in nested menu content eg: filter,customize column etc\n if (moreContent && popperRef && moreContent !== 'default') {\n getFocusables(popperRef)?.[0]?.focus();\n }\n }, [forceShowMenu, popperRef, moreContent]);\n\n // Don't show the menu for columns which are of action type eg: rowActionMenu, rowDragDrop etc\n if (firstLevelActions.flat().length === 0 || field.type === FieldType.ACTION_FIELD_TYPE)\n return null;\n\n return (\n <div className='header-menu'>\n <Button\n data-testid='column-header-menu-button'\n variant='simple'\n className='button-more'\n compact\n icon\n aria-expanded={forceShowMenu}\n aria-label={`${translate('Actions')} - ${column.categorizedHeaderLabel}`}\n label={!forceShowMenu ? `${translate('Actions')}` : undefined}\n ref={popoverButtonRef}\n aria-describedby={sortDescriptionId}\n onClick={() => {\n setMoreContent('default');\n setForceShowMenu(true);\n }}\n onKeyDown={e => {\n if (forceShowMenu && e.key !== 'Enter') {\n // TODO remove preventDefault when popover steals the focus into its content\n e.preventDefault();\n }\n if (e.key === 'Escape' && forceShowMenu) {\n e.stopPropagation();\n setForceShowMenu(false);\n setPopperRef(null);\n }\n }}\n >\n <Icon name='more' />\n </Button>\n {forceShowMenu &&\n createPortal(\n <Popover\n className='popper'\n ref={setPopperRef}\n arrow\n target={popoverButtonRef.current}\n placement='bottom-start'\n hideOnTargetHidden\n // TODO: Consume FormDialog cosmos component in nested menu option renderers filter, group etc\n onKeyDown={e => {\n if (e.key === 'Escape' && forceShowMenu) {\n setForceShowMenu(false);\n setPopperRef(null);\n popoverButtonRef.current.focus();\n }\n if (e.key === 'Tab') {\n headerMenuTabHandler(e, popperRef);\n }\n }}\n >\n {content}\n </Popover>,\n column.parent.getDomContainer()\n )}\n\n <VisuallyHiddenText id={sortDescriptionId} aria-hidden>\n {sortDescription}\n </VisuallyHiddenText>\n </div>\n );\n}\n\nHeaderMenu.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n popoverButtonRef: PropTypes.objectOf(PropTypes.any)\n};\n\nHeaderMenu.defaultProps = {\n column: {},\n popoverButtonRef: {}\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/HeaderMenu/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { useCallback, useMemo, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n Icon,\n Popover,\n Menu,\n useElement,\n Button,\n VisuallyHiddenText,\n createUID,\n getActiveElement,\n useOuterEvent\n} from '@pega/cosmos-react-core';\nimport { removeEmptyValues, FieldType } from 'pega-repeating-structures-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\nimport DynamicFieldConfiguration from '../DynamicFieldConfiguration';\nimport FilterComponent from '../Filters/Filter';\nimport RFColumnConfigurator from '../RFColumnConfigurator';\nimport GroupingMenu from '../Grouping/GroupingMenu';\n\nimport { getActions, customizeColumn } from './actions';\n\nconst Default = 'default';\nconst Filter = 'Filter';\nconst Grouping = 'Grouping';\nconst DynamicColumnLeft = 'Combine with left';\nconst DynamicColumnRight = 'Combine with right';\nconst CustomizeColumn = 'Format';\nconst sortActionStates = ['Sort-ascending', 'Sort-descending', 'Remove-sort'];\n\nconst ariaSort = {\n asc: 'Ascending',\n desc: 'Descending'\n};\n\nfunction getFirstLevelActions(actions) {\n return removeEmptyValues(\n actions.map(function mapper(s) {\n if (Array.isArray(s)) {\n return s.map(mapper);\n }\n const { id, icon, label, show = true, onClick, disabled } = s;\n if (!show) {\n return null;\n }\n return {\n 'data-test-id': id,\n primary: label,\n visual: <Icon name={icon} />,\n id: id.replaceAll(' ', '-'), // eg: Combine with right -> Combine-with-right\n onClick,\n disabled\n };\n })\n );\n}\n\nfunction getFocusables(elementRef) {\n return elementRef.querySelectorAll(\n 'a[href]:not([disabled]), button:not([disabled]), textarea:not([disabled]):not([readonly]), input:not([disabled]):not([readonly]), select:not([disabled]):not([readonly])'\n );\n}\n\nfunction headerMenuTabHandler(e, popperRef) {\n const focusables = getFocusables(popperRef);\n const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n const activeEl = getActiveElement();\n\n if (!e.shiftKey && (activeEl === popperRef || activeEl === lastFocusable)) {\n firstFocusable?.focus();\n e.preventDefault();\n } else if (e.shiftKey && (activeEl === popperRef || activeEl === firstFocusable)) {\n lastFocusable?.focus();\n e.preventDefault();\n }\n}\n\nexport default function HeaderMenu({ column, popoverButtonRef }) {\n const view = column.parent;\n const {\n state: { clearColFilter }\n } = view;\n const [translate] = useTranslate();\n const { field } = column;\n const uid = createUID();\n const sortDescriptionId = `${uid}_description`;\n const isClearColFilter = clearColFilter === field.id;\n const sort = ariaSort[column?.getSortProperties()?.sortOrder];\n const sortSequence = column?.getSortProperties()?.sortSequence;\n const filtered = column?.filtered;\n\n const [moreContent, setMoreContent] = useState(Default);\n const [forceShowMenu, setForceShowMenu] = useState(false);\n const [sortDescription, setSortDescription] = useState('');\n const [popperRef, setPopperRef] = useElement();\n\n const finishPopOver = useCallback(() => {\n if (moreContent === Filter && isClearColFilter) {\n view.type.clearFilter(null);\n }\n if (popperRef && popoverButtonRef.current) {\n popoverButtonRef.current.focus();\n }\n setForceShowMenu(false);\n }, [moreContent, isClearColFilter, view, popperRef, popoverButtonRef]);\n\n const onUndoHierarchy = useCallback(() => {\n column.parent?.type.clearHierarchicalGroup();\n finishPopOver();\n }, [column, finishPopOver]);\n\n useEffect(() => {\n let sortStr = '';\n if (sort) sortStr = `${translate('Sorted')} ${translate(sort)}`;\n if (sortSequence) sortStr += ` ${translate('Sort priority')} ${sortSequence}`;\n if (filtered) sortStr += ` ${translate('Filtered column')}`;\n setSortDescription(sortStr);\n }, [sort, sortSequence, filtered, translate]);\n\n const actions = useMemo(\n () =>\n getActions({\n column,\n setMoreContent,\n onUndoHierarchy,\n translate,\n finishPopOver\n }),\n [column, onUndoHierarchy, translate, finishPopOver]\n );\n\n const firstLevelActions = useMemo(() => getFirstLevelActions(actions), [actions]);\n\n const content = useMemo(() => {\n switch (moreContent) {\n case Filter:\n return (\n <FilterComponent\n column={column}\n finishPopOver={finishPopOver}\n popoverButtonRef={popoverButtonRef}\n />\n );\n case Grouping:\n return <GroupingMenu column={column} finishPopOver={finishPopOver} />;\n case DynamicColumnLeft:\n case DynamicColumnRight:\n return (\n <DynamicFieldConfiguration\n column={column}\n onSubmit={(title, templateName, bHideColumns) => {\n column.applyMerge(\n moreContent === DynamicColumnLeft ? 'left' : 'right',\n title,\n templateName,\n bHideColumns\n );\n if (templateName === 'multiline') view.type.applyRowHeight('4');\n }}\n onAfterClose={finishPopOver}\n popoverButtonRef={popoverButtonRef}\n heading={`Combine with ${moreContent === DynamicColumnLeft ? 'left' : 'right'}`}\n />\n );\n case CustomizeColumn:\n return (\n <RFColumnConfigurator\n column={column}\n finishPopOver={finishPopOver}\n onSubmit={(rfConfig, columnAlias, displayMode) => {\n customizeColumn(column, rfConfig, displayMode, columnAlias, column.alias);\n }}\n popoverButtonRef={popoverButtonRef}\n />\n );\n default:\n return (\n <Menu\n scrollAt='400'\n data-test-id='action-menu'\n items={firstLevelActions.flat()}\n className='action-menu'\n focusControlEl={popoverButtonRef.current}\n onItemClick={id => {\n // NVDA/JAWS reading out the stale sort order on sort action\n // Removing intermediate sort state and adding back when we receive it from column prop\n if (sortActionStates.includes(id)) {\n setSortDescription('');\n }\n }}\n />\n );\n }\n }, [moreContent, column, finishPopOver, popoverButtonRef, firstLevelActions, view.type]);\n\n useOuterEvent('mousedown', [popperRef], () => {\n if (\n moreContent !== Filter &&\n moreContent !== 'Format' &&\n moreContent !== 'Combine with left' &&\n moreContent !== 'Combine with right'\n ) {\n finishPopOver();\n }\n });\n\n useEffect(() => {\n if (isClearColFilter) {\n setMoreContent(Filter);\n setForceShowMenu(true);\n }\n }, [isClearColFilter]);\n\n useEffect(() => {\n // Focus the first focusable element in nested menu content eg: filter,customize column etc\n if (moreContent && popperRef && moreContent !== 'default') {\n getFocusables(popperRef)?.[0]?.focus();\n }\n }, [forceShowMenu, popperRef, moreContent]);\n\n // Don't show the menu for columns which are of action type eg: rowActionMenu, rowDragDrop etc\n if (firstLevelActions.flat().length === 0 || field.type === FieldType.ACTION_FIELD_TYPE)\n return null;\n\n return (\n <div className='header-menu'>\n <Button\n data-testid='column-header-menu-button'\n variant='simple'\n className='button-more'\n compact\n icon\n aria-expanded={forceShowMenu}\n aria-label={`${translate('Actions')} - ${column.categorizedHeaderLabel}`}\n label={!forceShowMenu ? `${translate('Actions')}` : undefined}\n ref={popoverButtonRef}\n aria-describedby={sortDescriptionId}\n onClick={() => {\n setMoreContent('default');\n setForceShowMenu(true);\n }}\n onKeyDown={e => {\n if (forceShowMenu && e.key !== 'Enter') {\n // TODO remove preventDefault when popover steals the focus into its content\n e.preventDefault();\n }\n if (e.key === 'Escape' && forceShowMenu) {\n e.stopPropagation();\n setForceShowMenu(false);\n setPopperRef(null);\n }\n }}\n >\n <Icon name='more' />\n </Button>\n {forceShowMenu &&\n createPortal(\n <Popover\n className='popper'\n ref={setPopperRef}\n arrow\n target={popoverButtonRef.current}\n placement='bottom-start'\n hideOnTargetHidden\n // TODO: Consume FormDialog cosmos component in nested menu option renderers filter, group etc\n onKeyDown={e => {\n if (e.key === 'Escape' && forceShowMenu) {\n setForceShowMenu(false);\n setPopperRef(null);\n popoverButtonRef.current.focus();\n }\n if (e.key === 'Tab') {\n headerMenuTabHandler(e, popperRef);\n }\n }}\n >\n {content}\n </Popover>,\n column.parent.getDomContainer()\n )}\n\n <VisuallyHiddenText id={sortDescriptionId} aria-hidden>\n {sortDescription}\n </VisuallyHiddenText>\n </div>\n );\n}\n\nHeaderMenu.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n popoverButtonRef: PropTypes.objectOf(PropTypes.any)\n};\n\nHeaderMenu.defaultProps = {\n column: {},\n popoverButtonRef: {}\n};\n"]}
@@ -10,7 +10,7 @@ declare namespace RFColumnConfigurator {
10
10
  let column: PropTypes.Validator<{
11
11
  [x: string]: any;
12
12
  }>;
13
- let onCancel: PropTypes.Validator<(...args: any[]) => any>;
13
+ let onCancel: PropTypes.Requireable<(...args: any[]) => any>;
14
14
  let onSubmit: PropTypes.Validator<(...args: any[]) => any>;
15
15
  let finishPopOver: PropTypes.Validator<(...args: any[]) => any>;
16
16
  }
@@ -1 +1 @@
1
- {"version":3,"file":"RFColumnConfigurator.d.ts","sourceRoot":"","sources":["../../../Core/Components/RFColumnConfigurator.jsx"],"names":[],"mappings":"AAqKA;;;;;;4CA4EC;;;;;;;;;;;;sBAhPqB,YAAY"}
1
+ {"version":3,"file":"RFColumnConfigurator.d.ts","sourceRoot":"","sources":["../../../Core/Components/RFColumnConfigurator.jsx"],"names":[],"mappings":"AAqKA;;;;;;4CAgFC;;;;;;;;;;;;sBApPqB,YAAY"}
@@ -76,7 +76,7 @@ export default function RFColumnConfigurator({ column, onCancel, onSubmit, finis
76
76
  const onSubmitChanges = useCallback(() => {
77
77
  // Validating whether formatter settings are valid or not
78
78
  if (formatterRef.current?.validate && !formatterRef.current.validate())
79
- return;
79
+ return false;
80
80
  const isRFNameChanged = rfName !==
81
81
  (typeof column.formatterConfig === 'string'
82
82
  ? column.formatterConfig
@@ -90,16 +90,19 @@ export default function RFColumnConfigurator({ column, onCancel, onSubmit, finis
90
90
  // eslint-disable-next-line no-nested-ternary
91
91
  isRFChanged ? (rfConfig ? { type: rfName, config: rfConfig } : rfName) : undefined, columnAlias, isDisplayChanged ? displayMode : undefined);
92
92
  }
93
- finishPopOver();
94
- }, [column, onSubmit, rfName, columnAlias, finishPopOver, displayMode, rfConfig]);
95
- return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Format'), onSubmit: onSubmitChanges, onCancel: onCancel, target: popoverButtonRef.current, children: _jsx(Body, { column: column, rfName: rfName, columnAlias: columnAlias, displayMode: displayMode, onRFChange: e => {
93
+ return true;
94
+ }, [column, onSubmit, rfName, columnAlias, displayMode, rfConfig]);
95
+ return (_jsx(_Fragment, { children: popoverButtonRef.current ? (_jsx(FormDialog, { heading: translate('Format'), onSubmit: onSubmitChanges, onCancel: () => {
96
+ onCancel?.();
97
+ return true;
98
+ }, onAfterClose: finishPopOver, target: popoverButtonRef.current, children: _jsx(Body, { column: column, rfName: rfName, columnAlias: columnAlias, displayMode: displayMode, onRFChange: e => {
96
99
  setRFName(e.target.value);
97
100
  setRFConfig(renderFormatters?.find(f => f.value === e.target.value)?.defaultConfig);
98
101
  }, setRFConfig: setRFConfig, rfConfig: rfConfig, oncolumnAliasChange: e => setColumnAlias(e.target.value), onDisplayModeChange: e => setDisplayMode(e.target.value), formatterRef: formatterRef }) })) : null }));
99
102
  }
100
103
  RFColumnConfigurator.propTypes = {
101
104
  column: PropTypes.objectOf(PropTypes.any).isRequired,
102
- onCancel: PropTypes.func.isRequired,
105
+ onCancel: PropTypes.func,
103
106
  onSubmit: PropTypes.func.isRequired,
104
107
  finishPopOver: PropTypes.func.isRequired
105
108
  };
@@ -1 +1 @@
1
- {"version":3,"file":"RFColumnConfigurator.js","sourceRoot":"","sources":["../../../Core/Components/RFColumnConfigurator.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useState, useCallback, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\nimport { Input, Button, Select, Option, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../Hooks/useTranslate';\nimport { DEFAULT_FORMAT } from '../constants';\n\nconst StyledRow = styled.div`\n margin: 0.625rem 0;\n`;\n\n// Returns user friendly label from field information\nfunction getFieldLabel(field) {\n // Add category information (if applicable)\n if (field.category && field.category.length) {\n const combinedCategories = field.category\n .map(currentCategory => currentCategory.label)\n .join('.');\n return `${combinedCategories}.${field.label}`;\n }\n\n return `${field.label}`;\n}\n\nconst Footer = memo(({ cancel, submit }) => {\n const [translate] = useTranslate();\n return (\n <footer>\n <Button onClick={cancel} data-test-id='cancel'>\n {translate('Cancel')}\n </Button>\n <Button variant='primary' onClick={submit} data-test-id='submit'>\n {translate('Submit')}\n </Button>\n </footer>\n );\n});\n\nFooter.displayName = 'Footer';\n\nFooter.propTypes = {\n cancel: PropTypes.func.isRequired,\n submit: PropTypes.func.isRequired\n};\n\nconst defaultDisplayMode = 'Normal';\nconst displayModes = [defaultDisplayMode, 'Hierarchical'];\n\nconst Body = memo(\n ({\n column,\n rfName,\n columnAlias,\n displayMode,\n onRFChange,\n setRFConfig,\n rfConfig,\n oncolumnAliasChange,\n onDisplayModeChange,\n formatterRef\n }) => {\n const renderFormatters = column.getRenderFormatters();\n const componentName = renderFormatters?.find(f => f.value === rfName)?.component;\n const Component = componentName && column.renderFactory?.(componentName);\n const isDefaultFormatterExist = renderFormatters?.find(\n formatter => formatter.isDefault || formatter.label === DEFAULT_FORMAT\n );\n const renderDisplayMode = column.renderDisplayMode();\n const [translate] = useTranslate();\n const label = getFieldLabel(column.field);\n const showFormatter =\n column.formatterName !== 'UserReference' && !column.field.disableFormatting;\n return (\n <>\n <StyledRow>\n <Input type='text' label={translate('Field')} value={label} readOnly />\n </StyledRow>\n <StyledRow>\n <Input\n id='customise-label'\n type='text'\n label={translate('Alias')}\n onChange={oncolumnAliasChange}\n placeholder={translate('Enter alias')}\n value={columnAlias}\n data-test-id='Customise label'\n />\n </StyledRow>\n\n {showFormatter && renderFormatters && (\n <StyledRow>\n <Select\n id='select-customised-format'\n label={translate('Format')}\n onChange={onRFChange}\n value={rfName || ''}\n data-test-id='Customise format'\n >\n {!isDefaultFormatterExist && (\n <Option key={DEFAULT_FORMAT} value={DEFAULT_FORMAT}>\n {translate(DEFAULT_FORMAT)}\n </Option>\n )}\n {renderFormatters?.map(v => (\n <Option key={v.value} value={v.value}>\n {translate(v.label)}\n </Option>\n ))}\n </Select>\n </StyledRow>\n )}\n {Component && (\n <Component\n ref={formatterRef}\n formatting={{ type: rfName, config: rfConfig }}\n onChange={setRFConfig}\n />\n )}\n {renderDisplayMode && (\n <StyledRow>\n <Select\n id='select-customised-display'\n label={translate('Display')}\n onChange={onDisplayModeChange}\n value={displayMode || defaultDisplayMode}\n data-test-id='Customise display'\n >\n {displayModes.map(mode => (\n <Option key={mode} value={mode}>\n {translate(mode)}\n </Option>\n ))}\n </Select>\n </StyledRow>\n )}\n </>\n );\n }\n);\n\nBody.displayName = 'Body';\n\nBody.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n rfName: PropTypes.string,\n columnAlias: PropTypes.string,\n onRFChange: PropTypes.func,\n oncolumnAliasChange: PropTypes.func,\n displayMode: PropTypes.string,\n onDisplayModeChange: PropTypes.func\n};\n\nBody.defaultProps = {\n column: {},\n rfName: '',\n columnAlias: '',\n onRFChange: () => {},\n oncolumnAliasChange: () => {},\n displayMode: defaultDisplayMode,\n onDisplayModeChange: () => {}\n};\n\nexport default function RFColumnConfigurator({\n column,\n onCancel,\n onSubmit,\n finishPopOver,\n popoverButtonRef\n}) {\n const [columnAlias, setColumnAlias] = useState(column.alias || '');\n const renderFormatters = column.getRenderFormatters();\n const [rfName, setRFName] = useState(\n (typeof column.formatterConfig === 'string'\n ? column.formatterConfig\n : column.formatterConfig?.type) || DEFAULT_FORMAT\n );\n const [rfConfig, setRFConfig] = useState(\n column.formatterConfig?.config !== undefined\n ? column.formatterConfig?.config\n : renderFormatters?.find(f => f.value === rfName)?.defaultConfig\n );\n const formatterRef = useRef(null);\n\n const [displayMode, setDisplayMode] = useState(column.displayMode);\n const [translate] = useTranslate();\n const onSubmitChanges = useCallback(() => {\n // Validating whether formatter settings are valid or not\n if (formatterRef.current?.validate && !formatterRef.current.validate()) return;\n\n const isRFNameChanged =\n rfName !==\n (typeof column.formatterConfig === 'string'\n ? column.formatterConfig\n : column.formatterConfig?.type);\n const isRFConfigChanged = !fastDeepEqual(rfConfig, column.formatterConfig?.config); // can be undefined\n const isRFChanged = isRFNameChanged || isRFConfigChanged;\n const isLableChanged = columnAlias.trim() !== column.alias?.trim(); // can be undefined\n const isDisplayChanged = displayMode !== column.displayMode;\n\n if (isRFChanged || isLableChanged || isDisplayChanged) {\n onSubmit(\n // eslint-disable-next-line no-nested-ternary\n isRFChanged ? (rfConfig ? { type: rfName, config: rfConfig } : rfName) : undefined,\n columnAlias,\n isDisplayChanged ? displayMode : undefined\n );\n }\n finishPopOver();\n }, [column, onSubmit, rfName, columnAlias, finishPopOver, displayMode, rfConfig]);\n\n return (\n <>\n {popoverButtonRef.current ? (\n <FormDialog\n heading={translate('Format')}\n onSubmit={onSubmitChanges}\n onCancel={onCancel}\n target={popoverButtonRef.current}\n >\n <Body\n column={column}\n rfName={rfName}\n columnAlias={columnAlias}\n displayMode={displayMode}\n onRFChange={e => {\n setRFName(e.target.value);\n setRFConfig(renderFormatters?.find(f => f.value === e.target.value)?.defaultConfig);\n }}\n setRFConfig={setRFConfig}\n rfConfig={rfConfig}\n oncolumnAliasChange={e => setColumnAlias(e.target.value)}\n onDisplayModeChange={e => setDisplayMode(e.target.value)}\n formatterRef={formatterRef}\n />\n </FormDialog>\n ) : null}\n </>\n );\n}\n\nRFColumnConfigurator.propTypes = {\n column: PropTypes.objectOf(PropTypes.any).isRequired,\n onCancel: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n"]}
1
+ {"version":3,"file":"RFColumnConfigurator.js","sourceRoot":"","sources":["../../../Core/Components/RFColumnConfigurator.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useState, useCallback, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\nimport { Input, Button, Select, Option, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../Hooks/useTranslate';\nimport { DEFAULT_FORMAT } from '../constants';\n\nconst StyledRow = styled.div`\n margin: 0.625rem 0;\n`;\n\n// Returns user friendly label from field information\nfunction getFieldLabel(field) {\n // Add category information (if applicable)\n if (field.category && field.category.length) {\n const combinedCategories = field.category\n .map(currentCategory => currentCategory.label)\n .join('.');\n return `${combinedCategories}.${field.label}`;\n }\n\n return `${field.label}`;\n}\n\nconst Footer = memo(({ cancel, submit }) => {\n const [translate] = useTranslate();\n return (\n <footer>\n <Button onClick={cancel} data-test-id='cancel'>\n {translate('Cancel')}\n </Button>\n <Button variant='primary' onClick={submit} data-test-id='submit'>\n {translate('Submit')}\n </Button>\n </footer>\n );\n});\n\nFooter.displayName = 'Footer';\n\nFooter.propTypes = {\n cancel: PropTypes.func.isRequired,\n submit: PropTypes.func.isRequired\n};\n\nconst defaultDisplayMode = 'Normal';\nconst displayModes = [defaultDisplayMode, 'Hierarchical'];\n\nconst Body = memo(\n ({\n column,\n rfName,\n columnAlias,\n displayMode,\n onRFChange,\n setRFConfig,\n rfConfig,\n oncolumnAliasChange,\n onDisplayModeChange,\n formatterRef\n }) => {\n const renderFormatters = column.getRenderFormatters();\n const componentName = renderFormatters?.find(f => f.value === rfName)?.component;\n const Component = componentName && column.renderFactory?.(componentName);\n const isDefaultFormatterExist = renderFormatters?.find(\n formatter => formatter.isDefault || formatter.label === DEFAULT_FORMAT\n );\n const renderDisplayMode = column.renderDisplayMode();\n const [translate] = useTranslate();\n const label = getFieldLabel(column.field);\n const showFormatter =\n column.formatterName !== 'UserReference' && !column.field.disableFormatting;\n return (\n <>\n <StyledRow>\n <Input type='text' label={translate('Field')} value={label} readOnly />\n </StyledRow>\n <StyledRow>\n <Input\n id='customise-label'\n type='text'\n label={translate('Alias')}\n onChange={oncolumnAliasChange}\n placeholder={translate('Enter alias')}\n value={columnAlias}\n data-test-id='Customise label'\n />\n </StyledRow>\n\n {showFormatter && renderFormatters && (\n <StyledRow>\n <Select\n id='select-customised-format'\n label={translate('Format')}\n onChange={onRFChange}\n value={rfName || ''}\n data-test-id='Customise format'\n >\n {!isDefaultFormatterExist && (\n <Option key={DEFAULT_FORMAT} value={DEFAULT_FORMAT}>\n {translate(DEFAULT_FORMAT)}\n </Option>\n )}\n {renderFormatters?.map(v => (\n <Option key={v.value} value={v.value}>\n {translate(v.label)}\n </Option>\n ))}\n </Select>\n </StyledRow>\n )}\n {Component && (\n <Component\n ref={formatterRef}\n formatting={{ type: rfName, config: rfConfig }}\n onChange={setRFConfig}\n />\n )}\n {renderDisplayMode && (\n <StyledRow>\n <Select\n id='select-customised-display'\n label={translate('Display')}\n onChange={onDisplayModeChange}\n value={displayMode || defaultDisplayMode}\n data-test-id='Customise display'\n >\n {displayModes.map(mode => (\n <Option key={mode} value={mode}>\n {translate(mode)}\n </Option>\n ))}\n </Select>\n </StyledRow>\n )}\n </>\n );\n }\n);\n\nBody.displayName = 'Body';\n\nBody.propTypes = {\n column: PropTypes.objectOf(PropTypes.any),\n rfName: PropTypes.string,\n columnAlias: PropTypes.string,\n onRFChange: PropTypes.func,\n oncolumnAliasChange: PropTypes.func,\n displayMode: PropTypes.string,\n onDisplayModeChange: PropTypes.func\n};\n\nBody.defaultProps = {\n column: {},\n rfName: '',\n columnAlias: '',\n onRFChange: () => {},\n oncolumnAliasChange: () => {},\n displayMode: defaultDisplayMode,\n onDisplayModeChange: () => {}\n};\n\nexport default function RFColumnConfigurator({\n column,\n onCancel,\n onSubmit,\n finishPopOver,\n popoverButtonRef\n}) {\n const [columnAlias, setColumnAlias] = useState(column.alias || '');\n const renderFormatters = column.getRenderFormatters();\n const [rfName, setRFName] = useState(\n (typeof column.formatterConfig === 'string'\n ? column.formatterConfig\n : column.formatterConfig?.type) || DEFAULT_FORMAT\n );\n const [rfConfig, setRFConfig] = useState(\n column.formatterConfig?.config !== undefined\n ? column.formatterConfig?.config\n : renderFormatters?.find(f => f.value === rfName)?.defaultConfig\n );\n const formatterRef = useRef(null);\n\n const [displayMode, setDisplayMode] = useState(column.displayMode);\n const [translate] = useTranslate();\n const onSubmitChanges = useCallback(() => {\n // Validating whether formatter settings are valid or not\n if (formatterRef.current?.validate && !formatterRef.current.validate()) return false;\n\n const isRFNameChanged =\n rfName !==\n (typeof column.formatterConfig === 'string'\n ? column.formatterConfig\n : column.formatterConfig?.type);\n const isRFConfigChanged = !fastDeepEqual(rfConfig, column.formatterConfig?.config); // can be undefined\n const isRFChanged = isRFNameChanged || isRFConfigChanged;\n const isLableChanged = columnAlias.trim() !== column.alias?.trim(); // can be undefined\n const isDisplayChanged = displayMode !== column.displayMode;\n\n if (isRFChanged || isLableChanged || isDisplayChanged) {\n onSubmit(\n // eslint-disable-next-line no-nested-ternary\n isRFChanged ? (rfConfig ? { type: rfName, config: rfConfig } : rfName) : undefined,\n columnAlias,\n isDisplayChanged ? displayMode : undefined\n );\n }\n return true;\n }, [column, onSubmit, rfName, columnAlias, displayMode, rfConfig]);\n\n return (\n <>\n {popoverButtonRef.current ? (\n <FormDialog\n heading={translate('Format')}\n onSubmit={onSubmitChanges}\n onCancel={() => {\n onCancel?.();\n return true;\n }}\n onAfterClose={finishPopOver}\n target={popoverButtonRef.current}\n >\n <Body\n column={column}\n rfName={rfName}\n columnAlias={columnAlias}\n displayMode={displayMode}\n onRFChange={e => {\n setRFName(e.target.value);\n setRFConfig(renderFormatters?.find(f => f.value === e.target.value)?.defaultConfig);\n }}\n setRFConfig={setRFConfig}\n rfConfig={rfConfig}\n oncolumnAliasChange={e => setColumnAlias(e.target.value)}\n onDisplayModeChange={e => setDisplayMode(e.target.value)}\n formatterRef={formatterRef}\n />\n </FormDialog>\n ) : null}\n </>\n );\n}\n\nRFColumnConfigurator.propTypes = {\n column: PropTypes.objectOf(PropTypes.any).isRequired,\n onCancel: PropTypes.func,\n onSubmit: PropTypes.func.isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"AAsBA;;;;;GAKG;AACH,yCAHW,MAAM,GACJ,GAAG,CAAC,OAAO,CAKvB;AAeD;;;;;GAKG;AACH,kEAHW,MAAM,SAsDhB;AAqCD,2FA0EC;;;;;;;;;AAnMD,6BAA8B,mBAAmB,CAAC;AAClD,sBAAuB,gBAAgB,CAAC;;;sBAnBlB,YAAY;AA8NlC;;;;;;4CAwBC"}
1
+ {"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"AAuBA;;;;;GAKG;AACH,yCAHW,MAAM,GACJ,GAAG,CAAC,OAAO,CAKvB;AAeD;;;;;GAKG;AACH,kEAHW,MAAM,SAsDhB;AAqCD,2FA6EC;;;;;;;;;AAtMD,6BAA8B,mBAAmB,CAAC;AAClD,sBAAuB,gBAAgB,CAAC;;;sBApBlB,YAAY;AAkOlC;;;;;;4CAwBC"}
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { memo, useCallback, useEffect, useState, useMemo } from 'react';
2
+ import { memo, useCallback, useEffect, useState, useMemo, useRef } from 'react';
3
3
  import PropTypes from 'prop-types';
4
4
  import styled from 'styled-components';
5
- import { Icon, isTouchDevice, SearchInput, Menu, menuHelpers, useElement, Flex, Button, useI18n } from '@pega/cosmos-react-core';
5
+ import { Icon, isTouchDevice, SearchInput, Menu, menuHelpers, useElement, Flex, Button, useI18n, useFocusTrap } from '@pega/cosmos-react-core';
6
6
  import { getFieldIcon } from '../../Utils';
7
7
  import useTranslate from '../../Hooks/useTranslate';
8
8
  export const colsVisibility = 'Show/hide columns';
@@ -117,6 +117,7 @@ export function ColumnSelectorControl(props) {
117
117
  .map(item => item.id)), [data]);
118
118
  const [searchText, setSearchText] = useState('');
119
119
  const [searchRef, setSearchRef] = useElement(null);
120
+ const menuRef = useRef(null);
120
121
  const [items, setItems] = useState(data);
121
122
  const selectedColumns = useMemo(() => new Set(menuHelpers.getSelected(items).map(item => item.id)), [items]);
122
123
  useEffect(() => {
@@ -124,6 +125,7 @@ export function ColumnSelectorControl(props) {
124
125
  searchRef.focus();
125
126
  }
126
127
  }, [searchRef]);
128
+ useFocusTrap(isTouchDevice ? null : menuRef, false);
127
129
  const itemsToRender = useMemo(() => {
128
130
  return menuHelpers.mapTree(searchText
129
131
  ? menuHelpers
@@ -142,7 +144,7 @@ export function ColumnSelectorControl(props) {
142
144
  const isSubmitEnabled = !(action === colsVisibility && selectedColumns.size === 0) && modifiedColumns.length > 0;
143
145
  return (_jsx(StyledMenu, { "aria-label": t('columns'), items: itemsToRender, mode: 'multi-select', onItemClick: (id, args) => {
144
146
  setItems(cur => menuHelpers.toggleSelected(cur, id, args.mode));
145
- }, role: 'listbox', focusControlEl: searchRef || undefined, header: _jsx(SearchInput, { value: searchText, onSearchChange: setSearchText, ref: setSearchRef }), footer: _jsx(Footer, { onCancel: onCancel, onSubmit: () => onSubmit(modifiedColumns), disabled: !isSubmitEnabled }) }));
147
+ }, role: 'listbox', focusControlEl: searchRef || undefined, ref: menuRef, header: _jsx(SearchInput, { value: searchText, onSearchChange: setSearchText, ref: setSearchRef }), footer: _jsx(Footer, { onCancel: onCancel, onSubmit: () => onSubmit(modifiedColumns), disabled: !isSubmitEnabled }) }));
146
148
  }
147
149
  ColumnSelectorControl.propTypes = {
148
150
  data: PropTypes.arrayOf(PropTypes.object).isRequired,
@@ -1 +1 @@
1
- {"version":3,"file":"ColumnSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useCallback, useEffect, useState, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nimport {\n Icon,\n isTouchDevice,\n SearchInput,\n Menu,\n menuHelpers,\n useElement,\n Flex,\n Button,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport { getFieldIcon } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport const colsVisibility = 'Show/hide columns';\nexport const pinning = 'Freeze columns';\n\n/**\n * Returns an Icon component based on the field type.\n *\n * @param {string} type - The type of the field for which the icon is required.\n * @returns {JSX.Element} - A React Icon component with the appropriate icon name.\n */\nexport function getIconByFieldType(type) {\n const iconName = getFieldIcon(type);\n return <Icon data-test-id={iconName} data-testid={iconName} name={iconName} />;\n}\n\n/**\n * Determines the list of changed column IDs.\n *\n * @param {Set<string>} initialSelectedColumns - The initial set of selected column IDs.\n * @param {Set<string>} currentSelectedColumns - The current set of selected column IDs.\n * @returns {string[]} - Array of modified column IDs.\n */\nfunction getModifiedColumns(initialSelectedColumns, currentSelectedColumns) {\n const addedColumns = [...currentSelectedColumns].filter(id => !initialSelectedColumns.has(id));\n const removedColumns = [...initialSelectedColumns].filter(id => !currentSelectedColumns.has(id));\n return [...addedColumns, ...removedColumns];\n}\n\n/**\n * Transforms the columns array into array of columns grouped by category\n * @param {Array} columns - The array of column objects to be transformed.\n * @param {string} action - The action to perform, either 'Show/hide columns' or 'Freeze columns'.\n * @returns Arrays of columns nested by category\n */\nexport function transformData(fieldDefs, state, action) {\n const result = [];\n if (!fieldDefs?.length) return result;\n\n const categoryObj = {};\n\n fieldDefs\n ?.filter(c => c.toggle)\n .forEach(field => {\n const { id, category = [], type, label } = field;\n const visible = state.visibleColumns?.includes(id);\n const frozen = state.freezeColumns?.includes(id);\n const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;\n if (categoryObj[lastCategoryLabel])\n categoryObj[lastCategoryLabel].items.push({\n id,\n primary: label,\n label,\n selected: action === colsVisibility ? visible : frozen,\n type,\n visual: getIconByFieldType(type)\n });\n else {\n categoryObj[lastCategoryLabel] = {\n id: `category:${lastCategoryLabel}`,\n primary: lastCategoryLabel,\n items: [\n {\n id,\n primary: label,\n selected: action === colsVisibility ? visible : frozen,\n label,\n type,\n visual: getIconByFieldType(type)\n }\n ]\n };\n }\n });\n // Items with no category attribute are set in the root of returned array\n if (categoryObj[undefined] && categoryObj[undefined].items) {\n result.push(...categoryObj[undefined].items);\n delete categoryObj[undefined];\n }\n const keys = Object.keys(categoryObj);\n // Items with category attribute are grouped inside the nested category object\n keys.forEach(key => {\n result.push(categoryObj[key]);\n });\n\n return result;\n}\n\nconst Footer = memo(({ onCancel, onSubmit, disabled }) => {\n const [translate] = useTranslate();\n return (\n <Flex container={{ justify: 'between' }}>\n <Button onClick={onCancel} data-testid='cancel'>\n {translate('Cancel')}\n </Button>\n <Button variant='primary' onClick={onSubmit} disabled={disabled} data-testid='submit'>\n {translate('Submit')}\n </Button>\n </Flex>\n );\n});\n\nFooter.displayName = 'Footer';\n\nFooter.propTypes = {\n onCancel: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n disabled: PropTypes.bool.isRequired\n};\n\nconst StyledMenu = styled(Menu)`\n width: ${isTouchDevice ? 'auto' : '16rem'};\n\n ${isTouchDevice &&\n `\n height: 100%;\n\n > div {\n flex: 1;\n min-height: 0;\n }\n `}\n`;\nexport function ColumnSelectorControl(props) {\n const { data, onSubmit, onCancel, action } = props;\n const t = useI18n();\n\n const initialSelectedColumns = useMemo(\n () =>\n new Set(\n menuHelpers\n .flatten(data)\n .filter(item => item.selected)\n .map(item => item.id)\n ),\n [data]\n );\n\n const [searchText, setSearchText] = useState('');\n const [searchRef, setSearchRef] = useElement(null);\n const [items, setItems] = useState(data);\n const selectedColumns = useMemo(\n () => new Set(menuHelpers.getSelected(items).map(item => item.id)),\n [items]\n );\n\n useEffect(() => {\n if (!isTouchDevice && searchRef) {\n searchRef.focus();\n }\n }, [searchRef]);\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(\n searchText\n ? menuHelpers\n .flatten(items)\n .filter(({ primary }) => primary.toLowerCase().includes(searchText.toLowerCase()))\n : items,\n item => {\n return {\n ...item,\n visual: item.visual,\n selected: item.items ? undefined : item.selected,\n disabled: item.selected && action === colsVisibility && selectedColumns.size <= 1\n };\n }\n );\n }, [searchText, items]);\n\n const modifiedColumns = useMemo(\n () => getModifiedColumns(initialSelectedColumns, selectedColumns),\n [initialSelectedColumns, selectedColumns, action]\n );\n\n const isSubmitEnabled =\n !(action === colsVisibility && selectedColumns.size === 0) && modifiedColumns.length > 0;\n return (\n <StyledMenu\n aria-label={t('columns')}\n items={itemsToRender}\n mode='multi-select'\n onItemClick={(id, args) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, args.mode));\n }}\n role='listbox'\n focusControlEl={searchRef || undefined}\n header={<SearchInput value={searchText} onSearchChange={setSearchText} ref={setSearchRef} />}\n footer={\n <Footer\n onCancel={onCancel}\n onSubmit={() => onSubmit(modifiedColumns)}\n disabled={!isSubmitEnabled}\n />\n }\n />\n );\n}\n\nColumnSelectorControl.propTypes = {\n data: PropTypes.arrayOf(PropTypes.object).isRequired,\n onSubmit: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired,\n action: PropTypes.string.isRequired\n};\n\nfunction ColumnSelector({ dispatch, fieldDefs, state, action, finishPopOver }) {\n const transformed = useMemo(\n () => transformData(fieldDefs, state, action),\n [fieldDefs, state, action]\n );\n\n const onSubmitHandler = useCallback(\n changedCols => {\n if (changedCols.length > 0) {\n dispatch(changedCols);\n }\n finishPopOver();\n },\n [dispatch]\n );\n\n return (\n <ColumnSelectorControl\n data={transformed}\n onSubmit={onSubmitHandler}\n onCancel={finishPopOver}\n action={action}\n />\n );\n}\n\nColumnSelector.propTypes = {\n dispatch: PropTypes.func.isRequired,\n fieldDefs: PropTypes.arrayOf(PropTypes.object).isRequired,\n state: PropTypes.arrayOf(PropTypes.object).isRequired,\n action: PropTypes.string.isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n\nexport default memo(ColumnSelector);\n"]}
1
+ {"version":3,"file":"ColumnSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useCallback, useEffect, useState, useMemo, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nimport {\n Icon,\n isTouchDevice,\n SearchInput,\n Menu,\n menuHelpers,\n useElement,\n Flex,\n Button,\n useI18n,\n useFocusTrap\n} from '@pega/cosmos-react-core';\n\nimport { getFieldIcon } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport const colsVisibility = 'Show/hide columns';\nexport const pinning = 'Freeze columns';\n\n/**\n * Returns an Icon component based on the field type.\n *\n * @param {string} type - The type of the field for which the icon is required.\n * @returns {JSX.Element} - A React Icon component with the appropriate icon name.\n */\nexport function getIconByFieldType(type) {\n const iconName = getFieldIcon(type);\n return <Icon data-test-id={iconName} data-testid={iconName} name={iconName} />;\n}\n\n/**\n * Determines the list of changed column IDs.\n *\n * @param {Set<string>} initialSelectedColumns - The initial set of selected column IDs.\n * @param {Set<string>} currentSelectedColumns - The current set of selected column IDs.\n * @returns {string[]} - Array of modified column IDs.\n */\nfunction getModifiedColumns(initialSelectedColumns, currentSelectedColumns) {\n const addedColumns = [...currentSelectedColumns].filter(id => !initialSelectedColumns.has(id));\n const removedColumns = [...initialSelectedColumns].filter(id => !currentSelectedColumns.has(id));\n return [...addedColumns, ...removedColumns];\n}\n\n/**\n * Transforms the columns array into array of columns grouped by category\n * @param {Array} columns - The array of column objects to be transformed.\n * @param {string} action - The action to perform, either 'Show/hide columns' or 'Freeze columns'.\n * @returns Arrays of columns nested by category\n */\nexport function transformData(fieldDefs, state, action) {\n const result = [];\n if (!fieldDefs?.length) return result;\n\n const categoryObj = {};\n\n fieldDefs\n ?.filter(c => c.toggle)\n .forEach(field => {\n const { id, category = [], type, label } = field;\n const visible = state.visibleColumns?.includes(id);\n const frozen = state.freezeColumns?.includes(id);\n const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;\n if (categoryObj[lastCategoryLabel])\n categoryObj[lastCategoryLabel].items.push({\n id,\n primary: label,\n label,\n selected: action === colsVisibility ? visible : frozen,\n type,\n visual: getIconByFieldType(type)\n });\n else {\n categoryObj[lastCategoryLabel] = {\n id: `category:${lastCategoryLabel}`,\n primary: lastCategoryLabel,\n items: [\n {\n id,\n primary: label,\n selected: action === colsVisibility ? visible : frozen,\n label,\n type,\n visual: getIconByFieldType(type)\n }\n ]\n };\n }\n });\n // Items with no category attribute are set in the root of returned array\n if (categoryObj[undefined] && categoryObj[undefined].items) {\n result.push(...categoryObj[undefined].items);\n delete categoryObj[undefined];\n }\n const keys = Object.keys(categoryObj);\n // Items with category attribute are grouped inside the nested category object\n keys.forEach(key => {\n result.push(categoryObj[key]);\n });\n\n return result;\n}\n\nconst Footer = memo(({ onCancel, onSubmit, disabled }) => {\n const [translate] = useTranslate();\n return (\n <Flex container={{ justify: 'between' }}>\n <Button onClick={onCancel} data-testid='cancel'>\n {translate('Cancel')}\n </Button>\n <Button variant='primary' onClick={onSubmit} disabled={disabled} data-testid='submit'>\n {translate('Submit')}\n </Button>\n </Flex>\n );\n});\n\nFooter.displayName = 'Footer';\n\nFooter.propTypes = {\n onCancel: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n disabled: PropTypes.bool.isRequired\n};\n\nconst StyledMenu = styled(Menu)`\n width: ${isTouchDevice ? 'auto' : '16rem'};\n\n ${isTouchDevice &&\n `\n height: 100%;\n\n > div {\n flex: 1;\n min-height: 0;\n }\n `}\n`;\nexport function ColumnSelectorControl(props) {\n const { data, onSubmit, onCancel, action } = props;\n const t = useI18n();\n\n const initialSelectedColumns = useMemo(\n () =>\n new Set(\n menuHelpers\n .flatten(data)\n .filter(item => item.selected)\n .map(item => item.id)\n ),\n [data]\n );\n\n const [searchText, setSearchText] = useState('');\n const [searchRef, setSearchRef] = useElement(null);\n const menuRef = useRef(null);\n const [items, setItems] = useState(data);\n const selectedColumns = useMemo(\n () => new Set(menuHelpers.getSelected(items).map(item => item.id)),\n [items]\n );\n\n useEffect(() => {\n if (!isTouchDevice && searchRef) {\n searchRef.focus();\n }\n }, [searchRef]);\n\n useFocusTrap(isTouchDevice ? null : menuRef, false);\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(\n searchText\n ? menuHelpers\n .flatten(items)\n .filter(({ primary }) => primary.toLowerCase().includes(searchText.toLowerCase()))\n : items,\n item => {\n return {\n ...item,\n visual: item.visual,\n selected: item.items ? undefined : item.selected,\n disabled: item.selected && action === colsVisibility && selectedColumns.size <= 1\n };\n }\n );\n }, [searchText, items]);\n\n const modifiedColumns = useMemo(\n () => getModifiedColumns(initialSelectedColumns, selectedColumns),\n [initialSelectedColumns, selectedColumns, action]\n );\n\n const isSubmitEnabled =\n !(action === colsVisibility && selectedColumns.size === 0) && modifiedColumns.length > 0;\n return (\n <StyledMenu\n aria-label={t('columns')}\n items={itemsToRender}\n mode='multi-select'\n onItemClick={(id, args) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, args.mode));\n }}\n role='listbox'\n focusControlEl={searchRef || undefined}\n ref={menuRef}\n header={<SearchInput value={searchText} onSearchChange={setSearchText} ref={setSearchRef} />}\n footer={\n <Footer\n onCancel={onCancel}\n onSubmit={() => onSubmit(modifiedColumns)}\n disabled={!isSubmitEnabled}\n />\n }\n />\n );\n}\n\nColumnSelectorControl.propTypes = {\n data: PropTypes.arrayOf(PropTypes.object).isRequired,\n onSubmit: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired,\n action: PropTypes.string.isRequired\n};\n\nfunction ColumnSelector({ dispatch, fieldDefs, state, action, finishPopOver }) {\n const transformed = useMemo(\n () => transformData(fieldDefs, state, action),\n [fieldDefs, state, action]\n );\n\n const onSubmitHandler = useCallback(\n changedCols => {\n if (changedCols.length > 0) {\n dispatch(changedCols);\n }\n finishPopOver();\n },\n [dispatch]\n );\n\n return (\n <ColumnSelectorControl\n data={transformed}\n onSubmit={onSubmitHandler}\n onCancel={finishPopOver}\n action={action}\n />\n );\n}\n\nColumnSelector.propTypes = {\n dispatch: PropTypes.func.isRequired,\n fieldDefs: PropTypes.arrayOf(PropTypes.object).isRequired,\n state: PropTypes.arrayOf(PropTypes.object).isRequired,\n action: PropTypes.string.isRequired,\n finishPopOver: PropTypes.func.isRequired\n};\n\nexport default memo(ColumnSelector);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"VariableHeightVirtualizer.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,OAAO,CAAC;AAsBrD,MAAM,WAAW,WAAW;IAC1B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AASD,MAAM,WAAW,8BAA8B;IAC7C,sDAAsD;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,oEAAoE;IACpE,QAAQ,EAAE,SAAS,CAAC;IACpB,wCAAwC;IACxC,WAAW,EAAE,CACX,MAAM,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAC5D,OAAO,EAAE;QAAE,gBAAgB,EAAE,OAAO,CAAA;KAAE,KACnC,IAAI,CAAC;IACV,oDAAoD;IACpD,cAAc,EAAE,OAAO,CAAC;IACxB,4CAA4C;IAC5C,eAAe,EAAE,eAAe,CAAC;IACjC,gDAAgD;IAChD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,gEAAgE;IAChE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iDAAiD;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IACxC,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IACxC,8CAA8C;IAC9C,kBAAkB,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IAC9C,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACvC,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,iDAAiD;IACjD,4BAA4B,CAAC,EAAE,MAAM,CAAC;CACvC;AAED,UAAU,cAAc;IACtB,+CAA+C;IAC/C,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,4CAA4C;IAC5C,kBAAkB,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IAC7C,4CAA4C;IAC5C,kBAAkB,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IAC7C,4CAA4C;IAC5C,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAaD;;;;;;;;;;GAUG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,QAAA,MAAM,yBAAyB,2HA6T9B,CAAC;AAIF,eAAe,yBAAyB,CAAC"}
1
+ {"version":3,"file":"VariableHeightVirtualizer.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,OAAO,CAAC;AAsBrD,MAAM,WAAW,WAAW;IAC1B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AASD,MAAM,WAAW,8BAA8B;IAC7C,sDAAsD;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,oEAAoE;IACpE,QAAQ,EAAE,SAAS,CAAC;IACpB,wCAAwC;IACxC,WAAW,EAAE,CACX,MAAM,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAC5D,OAAO,EAAE;QAAE,gBAAgB,EAAE,OAAO,CAAA;KAAE,KACnC,IAAI,CAAC;IACV,oDAAoD;IACpD,cAAc,EAAE,OAAO,CAAC;IACxB,4CAA4C;IAC5C,eAAe,EAAE,eAAe,CAAC;IACjC,gDAAgD;IAChD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,gEAAgE;IAChE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iDAAiD;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IACxC,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IACxC,8CAA8C;IAC9C,kBAAkB,CAAC,EAAE,CAAC,MAAM,SAAS,CAAC,GAAG,IAAI,CAAC;IAC9C,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACvC,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,iDAAiD;IACjD,4BAA4B,CAAC,EAAE,MAAM,CAAC;CACvC;AAED,UAAU,cAAc;IACtB,+CAA+C;IAC/C,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,4CAA4C;IAC5C,kBAAkB,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IAC7C,4CAA4C;IAC5C,kBAAkB,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IAC7C,4CAA4C;IAC5C,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAaD;;;;;;;;;;GAUG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,QAAA,MAAM,yBAAyB,2HA+T9B,CAAC;AAIF,eAAe,yBAAyB,CAAC"}
@@ -200,13 +200,14 @@ const VariableHeightVirtualizer = forwardRef(({ id, children, buffer = 15, apiCa
200
200
  (!endIndex ||
201
201
  (itemContainerRef.current &&
202
202
  parentContainerRef.current &&
203
- isViewNotFilled(virtualizedCount, itemContainerRef.current, parentContainerRef.current, !!renderHeader)))) {
203
+ isViewNotFilled(virtualizedCount, itemContainerRef.current, parentContainerRef.current, !!renderHeader, startIndex)))) {
204
204
  triggerPagination(scrollTop);
205
205
  }
206
206
  }, [
207
207
  loadedDataRange,
208
208
  scrollTop,
209
209
  virtualizedCount,
210
+ startIndex,
210
211
  endIndex,
211
212
  triggerPagination,
212
213
  parentContainerDimensionChangeTrigger,
@@ -1 +1 @@
1
- {"version":3,"file":"VariableHeightVirtualizer.js","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useRef,\n useEffect,\n useState,\n useCallback,\n useLayoutEffect,\n forwardRef,\n useImperativeHandle,\n useMemo\n} from 'react';\nimport type { ReactNode, ForwardedRef } from 'react';\nimport Styled from 'styled-components';\n\nimport { Progress } from '@pega/cosmos-react-core';\n\nimport useResizeObserver from '../UseResizeObserver';\nimport useTranslate from '../../../Hooks/useTranslate';\n\nimport useChildrenHeightResizeObserver from './useChildrenHeightResizeObserver';\nimport useLoaderPositioning from './useLoaderPositioning';\nimport usePagination from './usePagination';\nimport useScroll from './useScroll';\nimport useVirtualizerItemCount from './useVirtualizerItemCount';\nimport {\n calculateCumulativeItemSizeChange,\n getMaxHeight,\n isViewNotFilled,\n calculateTotalBufferHeight,\n getChangedItemsHeight,\n updateItemPositionStyles\n} from './utils';\n\nexport interface ItemsHeight {\n [index: number]: number;\n}\n\nexport interface LoadedDataRange {\n startIndex?: number;\n endIndex?: number;\n}\n\ninterface StyledLoaderProps {\n $style: {\n top: string;\n left: string;\n };\n}\n\nexport interface VariableHeightVirtualizerProps {\n /** Unique identifier for the virtualizer instance. */\n id: string;\n /** The React children elements to render inside the virtualizer. */\n children: ReactNode;\n /** Callback to fetch paginated data. */\n apiCallback: (\n params: { startIndex: number; endIndex: number; id: string },\n options: { takeLatestAction: boolean }\n ) => void;\n /** Indicates if data is currently being fetched. */\n isDataFetching: boolean;\n /** Range of data that is already loaded. */\n loadedDataRange: LoadedDataRange;\n /** Default height for items if not measured. */\n defaultItemHeight?: number;\n /** Total number of items in the list. */\n totalItemCount?: number | null;\n /** Number of items to buffer before/after the visible range. */\n buffer?: number;\n /** Maximum number of items to render at once. */\n maxItemsToPaint?: number;\n /** Function to render the header. */\n renderHeader?: (() => ReactNode) | null;\n /** Function to render the footer. */\n renderFooter?: (() => ReactNode) | null;\n /** Function to render the no-result state. */\n renderEmptyRecords?: (() => ReactNode) | null;\n /** CSS class for the item container. */\n itemContainerClass?: string;\n /** Maximum height for the view container. */\n viewMaxHeight?: string | number | null;\n /** Minimum height for the view container. */\n minHeight?: string | number;\n /** Minimum height when no items are rendered. */\n minHeightWhenNoItemsRendered?: string;\n}\n\ninterface VirtualizerRef {\n /** Scrolls the parent container to the top. */\n scrollToTop: () => void;\n /** Returns the parent container element. */\n getParentContainer: () => HTMLElement | null;\n /** Returns the buffer container element. */\n getBufferContainer: () => HTMLElement | null;\n /** Triggers a count change notification. */\n notifyCountChange: () => void;\n}\n\nconst StyledLoader = Styled.div<StyledLoaderProps>`\n display: flex;\n justify-content: center;\n padding: 0.5rem;\n position: absolute;\n width: var(--container-width);\n left: ${props => `var(${props.$style.left})`};\n top: ${props => `var(${props.$style.top})`};\n width: 100%;\n`;\n\n/**\n * Flow:\n * 1. First load/user scrolls/screen size change/column resize\n * 2. Calculate new pagination range based on scroll position or if view not filled\n * 3. Consumer executes API call to fetch new data\n * 4. New items are prepared and rendered\n * 5. Update cache of item heights\n * 6. Update buffer height\n * 7. Adjust itemContainer top\n * 8. Adjust scrollTop (if needed) to keep the items at same position visually\n */\n\n/**\n * VariableHeightVirtualizer is a React component that efficiently renders large lists with items of variable heights,\n * using virtualization techniques to minimize DOM nodes and improve performance.\n *\n * @param props - {@link VariableHeightVirtualizerProps}\n * @param ref - Forwarded ref exposing imperative APIs: scrollToTop, getParentContainer, getBufferContainer, notifyCountChange.\n *\n * @example\n * ```tsx\n * <VariableHeightVirtualizer\n * id=\"my-list\"\n * totalItemCount={10000}\n * loadedDataRange={{ startIndex: 0, endIndex: 49 }}\n * isDataFetching={isLoading}\n * apiCallback={fetchData}\n * defaultItemHeight={40}\n * buffer={10}\n * renderHeader={() => <Header />}\n * renderFooter={() => <Footer />}\n * renderEmptyRecords={() => <NoResults />}\n * >\n * {items.map(item => <ListItem key={item.id} {...item} />)}\n * </VariableHeightVirtualizer>\n * ```\n */\nconst VariableHeightVirtualizer = forwardRef<VirtualizerRef, VariableHeightVirtualizerProps>(\n (\n {\n id,\n children,\n buffer = 15,\n apiCallback,\n loadedDataRange = {},\n defaultItemHeight = 30,\n totalItemCount,\n maxItemsToPaint = 5000,\n renderHeader = null,\n renderFooter = null,\n renderEmptyRecords = null,\n itemContainerClass = '',\n viewMaxHeight = null,\n minHeight = 'auto',\n isDataFetching = false,\n minHeightWhenNoItemsRendered = 'auto'\n },\n ref: ForwardedRef<VirtualizerRef>\n ) => {\n const [startIndex, setStartIndex] = useState<number>(0);\n const [endIndex, setEndIndex] = useState<number>(0);\n const [scrollTop, setScrollTop] = useState<number>(0);\n const [totalBufferHeight, setTotalBufferHeight] = useState<number>(0);\n const [itemsHeight, setItemsHeight] = useState<ItemsHeight>({});\n const [itemContainerHeight, setItemContainerHeight] = useState<number>(0);\n\n const [countChangeTrigger, setCountChangeTrigger] = useState<number>(0);\n const [itemHeightChangeTrigger, setItemHeightChangeTrigger] = useState<number>(0);\n const [parentContainerDimensionChangeTrigger, setParentContainerDimensionChangeTrigger] =\n useState<number>(0);\n\n const parentContainerRef = useRef<HTMLDivElement>(null);\n const bufferContainerRef = useRef<HTMLDivElement>(null);\n const itemContainerRef = useRef<HTMLDivElement>(null);\n const previousItemsHeightRef = useRef<ItemsHeight>({});\n const previousFirstItemDataIndexRef = useRef<number | null>(null);\n\n const [translate] = useTranslate();\n\n const onParentContainerDimensionUpdate = useCallback(() => {\n const { height: parentContainerHeight, width: parentContainerWidth } =\n parentContainerRef.current?.getBoundingClientRect() ?? {};\n // trigger virtualizer operations only when the container has some height and width\n if (parentContainerHeight && parentContainerWidth) {\n setParentContainerDimensionChangeTrigger(value => value + 1);\n }\n }, []);\n\n const getParentContainer = useCallback(\n (): HTMLDivElement | null => parentContainerRef.current,\n []\n );\n useResizeObserver(getParentContainer, onParentContainerDimensionUpdate);\n\n const { isInfiniteMode, virtualizedCount } = useVirtualizerItemCount({\n totalItemCount,\n startIndex,\n endIndex,\n loadedDataRange,\n isDataFetching,\n itemContainerRef,\n children,\n buffer,\n countResetSignal: countChangeTrigger\n });\n\n const { triggerPagination, isForceRefreshedPagination } = usePagination({\n apiCallback,\n id,\n buffer,\n maxItemsToPaint,\n startIndex,\n endIndex,\n virtualizedCount,\n isInfiniteMode,\n itemsHeight,\n defaultItemHeight,\n parentContainerRef,\n itemContainerRef,\n setStartIndex,\n setEndIndex,\n previousFirstItemDataIndexRef\n });\n\n // Listens to the scroll events and trigger pagination when more records are needed to enable smooth scrolling\n useScroll({\n parentContainerRef,\n itemContainerRef,\n onThresholdBreach: (sTop: number) => {\n setScrollTop(sTop);\n triggerPagination(sTop);\n },\n delay: 150\n });\n\n // Expose APIs to the consumer\n useImperativeHandle(\n ref,\n (): VirtualizerRef => ({\n scrollToTop: () => {\n if (parentContainerRef.current) {\n parentContainerRef.current.scrollTop = 0;\n setScrollTop(0);\n\n triggerPagination(0, true);\n }\n },\n getParentContainer: () => parentContainerRef.current,\n getBufferContainer: () => itemContainerRef.current,\n notifyCountChange: () => setCountChangeTrigger(value => value + 1)\n })\n );\n\n // Measure height of rendered items and cache the heights\n useLayoutEffect(() => {\n if (!itemContainerRef.current) return;\n\n const newHeights = getChangedItemsHeight(\n itemContainerRef.current,\n itemsHeight,\n defaultItemHeight\n );\n if (Object.keys(newHeights).length > 0) {\n setItemsHeight((prev: ItemsHeight) => ({ ...prev, ...newHeights }));\n }\n }, [\n startIndex,\n itemsHeight,\n children,\n isDataFetching,\n defaultItemHeight,\n itemHeightChangeTrigger\n ]);\n\n // buffer height calculation\n useLayoutEffect(() => {\n const newBufferHeight = calculateTotalBufferHeight(\n virtualizedCount,\n itemsHeight,\n defaultItemHeight\n );\n\n if (newBufferHeight !== totalBufferHeight) {\n setTotalBufferHeight(newBufferHeight);\n }\n }, [itemsHeight, virtualizedCount, defaultItemHeight, totalBufferHeight]);\n\n // itemContainer size and position adjustments\n useLayoutEffect(() => {\n if (!itemContainerRef.current) return;\n\n setItemContainerHeight(\n updateItemPositionStyles(itemContainerRef.current, itemsHeight, defaultItemHeight)\n );\n }, [children, itemsHeight, defaultItemHeight]);\n\n // scroll position adjustment if rendered height is different than estimated height\n useLayoutEffect(() => {\n if (!parentContainerRef.current) return;\n\n const atTop = parentContainerRef.current.scrollTop === 0;\n if (!atTop) {\n const delta = calculateCumulativeItemSizeChange(\n startIndex,\n previousFirstItemDataIndexRef.current,\n itemsHeight,\n previousItemsHeightRef.current,\n defaultItemHeight\n );\n\n if (delta !== 0) {\n parentContainerRef.current.scrollTop += delta;\n }\n }\n\n previousItemsHeightRef.current = { ...itemsHeight };\n }, [startIndex, itemsHeight, defaultItemHeight]);\n\n // Adjust loader positions\n useLoaderPositioning({\n isDataFetching,\n parentContainerRef,\n itemContainerRef,\n children,\n itemsHeight,\n defaultItemHeight\n });\n\n // Initial pagination trigger and subsequent triggers if the view is not completely filled\n useEffect(() => {\n // If consumer already has data for initial items, then no need to trigger pagination. Just hydrate the internal state in sync with existing data.\n if (\n !endIndex &&\n loadedDataRange.startIndex !== undefined &&\n loadedDataRange.startIndex >= 0 &&\n loadedDataRange.endIndex !== undefined &&\n loadedDataRange.endIndex >= 0\n ) {\n setStartIndex(loadedDataRange.startIndex);\n setEndIndex(loadedDataRange.endIndex);\n return;\n }\n\n // If the consumer doesn't have data or view not filled then trigger pagination\n if (\n !isDataFetching &&\n (!endIndex ||\n (itemContainerRef.current &&\n parentContainerRef.current &&\n isViewNotFilled(\n virtualizedCount,\n itemContainerRef.current,\n parentContainerRef.current,\n !!renderHeader\n )))\n ) {\n triggerPagination(scrollTop);\n }\n }, [\n loadedDataRange,\n scrollTop,\n virtualizedCount,\n endIndex,\n triggerPagination,\n parentContainerDimensionChangeTrigger,\n isDataFetching,\n renderHeader\n ]);\n\n // Resize observer on items to track height changes\n const onItemsHeightUpdate = useCallback(() => {\n setItemHeightChangeTrigger(value => value + 1);\n }, []);\n useChildrenHeightResizeObserver({\n childrenContainerRef: itemContainerRef,\n children,\n itemsHeight,\n defaultItemHeight,\n onItemsHeightUpdate\n });\n\n const maxHeight = useMemo((): string => getMaxHeight(viewMaxHeight), [viewMaxHeight]);\n\n return (\n <div\n ref={parentContainerRef}\n style={{\n maxHeight,\n minHeight: virtualizedCount === 0 ? minHeightWhenNoItemsRendered : minHeight,\n overflowY: 'auto',\n position: 'relative',\n width: '100%'\n }}\n className='pContainer variableHeightVirtualizer'\n data-total-records={totalItemCount}\n >\n {renderHeader && renderHeader()}\n <div\n className='bContainer'\n ref={bufferContainerRef}\n style={{ height: totalBufferHeight, position: 'relative' }}\n >\n {isDataFetching && !isForceRefreshedPagination && (\n <StyledLoader\n $style={{\n top: '--above-loader-top',\n left: '--loader-left'\n }}\n >\n <Progress\n className='above-loader'\n placement='block'\n tabIndex={0}\n aria-label={translate('Loading more results')}\n />\n </StyledLoader>\n )}\n\n <div\n ref={itemContainerRef}\n style={{\n position: 'absolute',\n left: 0,\n width: '100%',\n height: `${itemContainerHeight}px`\n }}\n className={`${itemContainerClass} row-container`}\n >\n {totalItemCount === 0 && !isDataFetching ? null : children}\n </div>\n\n {isDataFetching && !isForceRefreshedPagination && (\n <StyledLoader\n $style={{\n top: '--below-loader-top',\n left: '--loader-left'\n }}\n >\n <Progress\n className='below-loader'\n placement='block'\n tabIndex={0}\n aria-label={translate('Loading more results')}\n />\n </StyledLoader>\n )}\n </div>\n {virtualizedCount === 0 && !isDataFetching && renderEmptyRecords\n ? renderEmptyRecords()\n : null}\n {renderFooter && renderFooter()}\n </div>\n );\n }\n);\n\nVariableHeightVirtualizer.displayName = 'VariableHeightVirtualizer';\n\nexport default VariableHeightVirtualizer;\n"]}
1
+ {"version":3,"file":"VariableHeightVirtualizer.js","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/VariableHeightVirtualizer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useRef,\n useEffect,\n useState,\n useCallback,\n useLayoutEffect,\n forwardRef,\n useImperativeHandle,\n useMemo\n} from 'react';\nimport type { ReactNode, ForwardedRef } from 'react';\nimport Styled from 'styled-components';\n\nimport { Progress } from '@pega/cosmos-react-core';\n\nimport useResizeObserver from '../UseResizeObserver';\nimport useTranslate from '../../../Hooks/useTranslate';\n\nimport useChildrenHeightResizeObserver from './useChildrenHeightResizeObserver';\nimport useLoaderPositioning from './useLoaderPositioning';\nimport usePagination from './usePagination';\nimport useScroll from './useScroll';\nimport useVirtualizerItemCount from './useVirtualizerItemCount';\nimport {\n calculateCumulativeItemSizeChange,\n getMaxHeight,\n isViewNotFilled,\n calculateTotalBufferHeight,\n getChangedItemsHeight,\n updateItemPositionStyles\n} from './utils';\n\nexport interface ItemsHeight {\n [index: number]: number;\n}\n\nexport interface LoadedDataRange {\n startIndex?: number;\n endIndex?: number;\n}\n\ninterface StyledLoaderProps {\n $style: {\n top: string;\n left: string;\n };\n}\n\nexport interface VariableHeightVirtualizerProps {\n /** Unique identifier for the virtualizer instance. */\n id: string;\n /** The React children elements to render inside the virtualizer. */\n children: ReactNode;\n /** Callback to fetch paginated data. */\n apiCallback: (\n params: { startIndex: number; endIndex: number; id: string },\n options: { takeLatestAction: boolean }\n ) => void;\n /** Indicates if data is currently being fetched. */\n isDataFetching: boolean;\n /** Range of data that is already loaded. */\n loadedDataRange: LoadedDataRange;\n /** Default height for items if not measured. */\n defaultItemHeight?: number;\n /** Total number of items in the list. */\n totalItemCount?: number | null;\n /** Number of items to buffer before/after the visible range. */\n buffer?: number;\n /** Maximum number of items to render at once. */\n maxItemsToPaint?: number;\n /** Function to render the header. */\n renderHeader?: (() => ReactNode) | null;\n /** Function to render the footer. */\n renderFooter?: (() => ReactNode) | null;\n /** Function to render the no-result state. */\n renderEmptyRecords?: (() => ReactNode) | null;\n /** CSS class for the item container. */\n itemContainerClass?: string;\n /** Maximum height for the view container. */\n viewMaxHeight?: string | number | null;\n /** Minimum height for the view container. */\n minHeight?: string | number;\n /** Minimum height when no items are rendered. */\n minHeightWhenNoItemsRendered?: string;\n}\n\ninterface VirtualizerRef {\n /** Scrolls the parent container to the top. */\n scrollToTop: () => void;\n /** Returns the parent container element. */\n getParentContainer: () => HTMLElement | null;\n /** Returns the buffer container element. */\n getBufferContainer: () => HTMLElement | null;\n /** Triggers a count change notification. */\n notifyCountChange: () => void;\n}\n\nconst StyledLoader = Styled.div<StyledLoaderProps>`\n display: flex;\n justify-content: center;\n padding: 0.5rem;\n position: absolute;\n width: var(--container-width);\n left: ${props => `var(${props.$style.left})`};\n top: ${props => `var(${props.$style.top})`};\n width: 100%;\n`;\n\n/**\n * Flow:\n * 1. First load/user scrolls/screen size change/column resize\n * 2. Calculate new pagination range based on scroll position or if view not filled\n * 3. Consumer executes API call to fetch new data\n * 4. New items are prepared and rendered\n * 5. Update cache of item heights\n * 6. Update buffer height\n * 7. Adjust itemContainer top\n * 8. Adjust scrollTop (if needed) to keep the items at same position visually\n */\n\n/**\n * VariableHeightVirtualizer is a React component that efficiently renders large lists with items of variable heights,\n * using virtualization techniques to minimize DOM nodes and improve performance.\n *\n * @param props - {@link VariableHeightVirtualizerProps}\n * @param ref - Forwarded ref exposing imperative APIs: scrollToTop, getParentContainer, getBufferContainer, notifyCountChange.\n *\n * @example\n * ```tsx\n * <VariableHeightVirtualizer\n * id=\"my-list\"\n * totalItemCount={10000}\n * loadedDataRange={{ startIndex: 0, endIndex: 49 }}\n * isDataFetching={isLoading}\n * apiCallback={fetchData}\n * defaultItemHeight={40}\n * buffer={10}\n * renderHeader={() => <Header />}\n * renderFooter={() => <Footer />}\n * renderEmptyRecords={() => <NoResults />}\n * >\n * {items.map(item => <ListItem key={item.id} {...item} />)}\n * </VariableHeightVirtualizer>\n * ```\n */\nconst VariableHeightVirtualizer = forwardRef<VirtualizerRef, VariableHeightVirtualizerProps>(\n (\n {\n id,\n children,\n buffer = 15,\n apiCallback,\n loadedDataRange = {},\n defaultItemHeight = 30,\n totalItemCount,\n maxItemsToPaint = 5000,\n renderHeader = null,\n renderFooter = null,\n renderEmptyRecords = null,\n itemContainerClass = '',\n viewMaxHeight = null,\n minHeight = 'auto',\n isDataFetching = false,\n minHeightWhenNoItemsRendered = 'auto'\n },\n ref: ForwardedRef<VirtualizerRef>\n ) => {\n const [startIndex, setStartIndex] = useState<number>(0);\n const [endIndex, setEndIndex] = useState<number>(0);\n const [scrollTop, setScrollTop] = useState<number>(0);\n const [totalBufferHeight, setTotalBufferHeight] = useState<number>(0);\n const [itemsHeight, setItemsHeight] = useState<ItemsHeight>({});\n const [itemContainerHeight, setItemContainerHeight] = useState<number>(0);\n\n const [countChangeTrigger, setCountChangeTrigger] = useState<number>(0);\n const [itemHeightChangeTrigger, setItemHeightChangeTrigger] = useState<number>(0);\n const [parentContainerDimensionChangeTrigger, setParentContainerDimensionChangeTrigger] =\n useState<number>(0);\n\n const parentContainerRef = useRef<HTMLDivElement>(null);\n const bufferContainerRef = useRef<HTMLDivElement>(null);\n const itemContainerRef = useRef<HTMLDivElement>(null);\n const previousItemsHeightRef = useRef<ItemsHeight>({});\n const previousFirstItemDataIndexRef = useRef<number | null>(null);\n\n const [translate] = useTranslate();\n\n const onParentContainerDimensionUpdate = useCallback(() => {\n const { height: parentContainerHeight, width: parentContainerWidth } =\n parentContainerRef.current?.getBoundingClientRect() ?? {};\n // trigger virtualizer operations only when the container has some height and width\n if (parentContainerHeight && parentContainerWidth) {\n setParentContainerDimensionChangeTrigger(value => value + 1);\n }\n }, []);\n\n const getParentContainer = useCallback(\n (): HTMLDivElement | null => parentContainerRef.current,\n []\n );\n useResizeObserver(getParentContainer, onParentContainerDimensionUpdate);\n\n const { isInfiniteMode, virtualizedCount } = useVirtualizerItemCount({\n totalItemCount,\n startIndex,\n endIndex,\n loadedDataRange,\n isDataFetching,\n itemContainerRef,\n children,\n buffer,\n countResetSignal: countChangeTrigger\n });\n\n const { triggerPagination, isForceRefreshedPagination } = usePagination({\n apiCallback,\n id,\n buffer,\n maxItemsToPaint,\n startIndex,\n endIndex,\n virtualizedCount,\n isInfiniteMode,\n itemsHeight,\n defaultItemHeight,\n parentContainerRef,\n itemContainerRef,\n setStartIndex,\n setEndIndex,\n previousFirstItemDataIndexRef\n });\n\n // Listens to the scroll events and trigger pagination when more records are needed to enable smooth scrolling\n useScroll({\n parentContainerRef,\n itemContainerRef,\n onThresholdBreach: (sTop: number) => {\n setScrollTop(sTop);\n triggerPagination(sTop);\n },\n delay: 150\n });\n\n // Expose APIs to the consumer\n useImperativeHandle(\n ref,\n (): VirtualizerRef => ({\n scrollToTop: () => {\n if (parentContainerRef.current) {\n parentContainerRef.current.scrollTop = 0;\n setScrollTop(0);\n\n triggerPagination(0, true);\n }\n },\n getParentContainer: () => parentContainerRef.current,\n getBufferContainer: () => itemContainerRef.current,\n notifyCountChange: () => setCountChangeTrigger(value => value + 1)\n })\n );\n\n // Measure height of rendered items and cache the heights\n useLayoutEffect(() => {\n if (!itemContainerRef.current) return;\n\n const newHeights = getChangedItemsHeight(\n itemContainerRef.current,\n itemsHeight,\n defaultItemHeight\n );\n if (Object.keys(newHeights).length > 0) {\n setItemsHeight((prev: ItemsHeight) => ({ ...prev, ...newHeights }));\n }\n }, [\n startIndex,\n itemsHeight,\n children,\n isDataFetching,\n defaultItemHeight,\n itemHeightChangeTrigger\n ]);\n\n // buffer height calculation\n useLayoutEffect(() => {\n const newBufferHeight = calculateTotalBufferHeight(\n virtualizedCount,\n itemsHeight,\n defaultItemHeight\n );\n\n if (newBufferHeight !== totalBufferHeight) {\n setTotalBufferHeight(newBufferHeight);\n }\n }, [itemsHeight, virtualizedCount, defaultItemHeight, totalBufferHeight]);\n\n // itemContainer size and position adjustments\n useLayoutEffect(() => {\n if (!itemContainerRef.current) return;\n\n setItemContainerHeight(\n updateItemPositionStyles(itemContainerRef.current, itemsHeight, defaultItemHeight)\n );\n }, [children, itemsHeight, defaultItemHeight]);\n\n // scroll position adjustment if rendered height is different than estimated height\n useLayoutEffect(() => {\n if (!parentContainerRef.current) return;\n\n const atTop = parentContainerRef.current.scrollTop === 0;\n if (!atTop) {\n const delta = calculateCumulativeItemSizeChange(\n startIndex,\n previousFirstItemDataIndexRef.current,\n itemsHeight,\n previousItemsHeightRef.current,\n defaultItemHeight\n );\n\n if (delta !== 0) {\n parentContainerRef.current.scrollTop += delta;\n }\n }\n\n previousItemsHeightRef.current = { ...itemsHeight };\n }, [startIndex, itemsHeight, defaultItemHeight]);\n\n // Adjust loader positions\n useLoaderPositioning({\n isDataFetching,\n parentContainerRef,\n itemContainerRef,\n children,\n itemsHeight,\n defaultItemHeight\n });\n\n // Initial pagination trigger and subsequent triggers if the view is not completely filled\n useEffect(() => {\n // If consumer already has data for initial items, then no need to trigger pagination. Just hydrate the internal state in sync with existing data.\n if (\n !endIndex &&\n loadedDataRange.startIndex !== undefined &&\n loadedDataRange.startIndex >= 0 &&\n loadedDataRange.endIndex !== undefined &&\n loadedDataRange.endIndex >= 0\n ) {\n setStartIndex(loadedDataRange.startIndex);\n setEndIndex(loadedDataRange.endIndex);\n return;\n }\n\n // If the consumer doesn't have data or view not filled then trigger pagination\n if (\n !isDataFetching &&\n (!endIndex ||\n (itemContainerRef.current &&\n parentContainerRef.current &&\n isViewNotFilled(\n virtualizedCount,\n itemContainerRef.current,\n parentContainerRef.current,\n !!renderHeader,\n startIndex\n )))\n ) {\n triggerPagination(scrollTop);\n }\n }, [\n loadedDataRange,\n scrollTop,\n virtualizedCount,\n startIndex,\n endIndex,\n triggerPagination,\n parentContainerDimensionChangeTrigger,\n isDataFetching,\n renderHeader\n ]);\n\n // Resize observer on items to track height changes\n const onItemsHeightUpdate = useCallback(() => {\n setItemHeightChangeTrigger(value => value + 1);\n }, []);\n useChildrenHeightResizeObserver({\n childrenContainerRef: itemContainerRef,\n children,\n itemsHeight,\n defaultItemHeight,\n onItemsHeightUpdate\n });\n\n const maxHeight = useMemo((): string => getMaxHeight(viewMaxHeight), [viewMaxHeight]);\n\n return (\n <div\n ref={parentContainerRef}\n style={{\n maxHeight,\n minHeight: virtualizedCount === 0 ? minHeightWhenNoItemsRendered : minHeight,\n overflowY: 'auto',\n position: 'relative',\n width: '100%'\n }}\n className='pContainer variableHeightVirtualizer'\n data-total-records={totalItemCount}\n >\n {renderHeader && renderHeader()}\n <div\n className='bContainer'\n ref={bufferContainerRef}\n style={{ height: totalBufferHeight, position: 'relative' }}\n >\n {isDataFetching && !isForceRefreshedPagination && (\n <StyledLoader\n $style={{\n top: '--above-loader-top',\n left: '--loader-left'\n }}\n >\n <Progress\n className='above-loader'\n placement='block'\n tabIndex={0}\n aria-label={translate('Loading more results')}\n />\n </StyledLoader>\n )}\n\n <div\n ref={itemContainerRef}\n style={{\n position: 'absolute',\n left: 0,\n width: '100%',\n height: `${itemContainerHeight}px`\n }}\n className={`${itemContainerClass} row-container`}\n >\n {totalItemCount === 0 && !isDataFetching ? null : children}\n </div>\n\n {isDataFetching && !isForceRefreshedPagination && (\n <StyledLoader\n $style={{\n top: '--below-loader-top',\n left: '--loader-left'\n }}\n >\n <Progress\n className='below-loader'\n placement='block'\n tabIndex={0}\n aria-label={translate('Loading more results')}\n />\n </StyledLoader>\n )}\n </div>\n {virtualizedCount === 0 && !isDataFetching && renderEmptyRecords\n ? renderEmptyRecords()\n : null}\n {renderFooter && renderFooter()}\n </div>\n );\n }\n);\n\nVariableHeightVirtualizer.displayName = 'VariableHeightVirtualizer';\n\nexport default VariableHeightVirtualizer;\n"]}
@@ -17,7 +17,7 @@ interface VirtualizerItemCountParams {
17
17
  totalItemCount?: number | null;
18
18
  /** Optional buffer to add to the count in infinite mode. */
19
19
  buffer?: number;
20
- /** Signal to reset the count in infinite mode. */
20
+ /** Signal to reset the count when the list data changes. */
21
21
  countResetSignal?: number;
22
22
  }
23
23
  /**
@@ -27,7 +27,7 @@ interface VirtualizerItemCountParams {
27
27
  * - `isInfiniteMode`: Whether the list is in infinite scrolling mode.
28
28
  * - `virtualizedCount`: The current count of virtualized items.
29
29
  *
30
- * NOTE: In finite mode, the count is based on `totalItemCount`.
30
+ * NOTE: In finite mode, the count is based on `totalItemCount` and can shrink on a short page.
31
31
  * NOTE: In infinite mode, the count is dynamically calculated based on loaded items and buffer.
32
32
  */
33
33
  export default function useVirtualizerItemCount(params: VirtualizerItemCountParams): {
@@ -1 +1 @@
1
- {"version":3,"file":"useVirtualizerItemCount.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGnE,UAAU,0BAA0B;IAClC,mDAAmD;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,QAAQ,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,eAAe,EAAE,eAAe,CAAC;IACjC,wDAAwD;IACxD,cAAc,EAAE,OAAO,CAAC;IAExB,mDAAmD;IACnD,gBAAgB,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,gDAAgD;IAChD,QAAQ,EAAE,SAAS,CAAC;IAEpB,mFAAmF;IACnF,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,MAAM,EAAE,0BAA0B,GAAG;IACnF,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,CAwEA"}
1
+ {"version":3,"file":"useVirtualizerItemCount.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGnE,UAAU,0BAA0B;IAClC,mDAAmD;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,QAAQ,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,eAAe,EAAE,eAAe,CAAC;IACjC,wDAAwD;IACxD,cAAc,EAAE,OAAO,CAAC;IAExB,mDAAmD;IACnD,gBAAgB,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,gDAAgD;IAChD,QAAQ,EAAE,SAAS,CAAC;IAEpB,mFAAmF;IACnF,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4DAA4D;IAC5D,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,MAAM,EAAE,0BAA0B,GAAG;IACnF,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,CAiGA"}
@@ -7,7 +7,7 @@ import { getDataIndex } from './utils';
7
7
  * - `isInfiniteMode`: Whether the list is in infinite scrolling mode.
8
8
  * - `virtualizedCount`: The current count of virtualized items.
9
9
  *
10
- * NOTE: In finite mode, the count is based on `totalItemCount`.
10
+ * NOTE: In finite mode, the count is based on `totalItemCount` and can shrink on a short page.
11
11
  * NOTE: In infinite mode, the count is dynamically calculated based on loaded items and buffer.
12
12
  */
13
13
  export default function useVirtualizerItemCount(params) {
@@ -18,17 +18,33 @@ export default function useVirtualizerItemCount(params) {
18
18
  if (!isInfiniteMode) {
19
19
  setVirtualizedCount(totalItemCount ?? 0);
20
20
  }
21
- }, [totalItemCount, isInfiniteMode]);
21
+ }, [totalItemCount, isInfiniteMode, countResetSignal]);
22
22
  useLayoutEffect(() => {
23
23
  if (isInfiniteMode) {
24
24
  setVirtualizedCount(0);
25
25
  }
26
26
  }, [countResetSignal, isInfiniteMode]);
27
- // Calculating count based on loaded items for infinite scrolling
27
+ // Check completed short pages in finite mode; grow the count only in infinite mode.
28
28
  useEffect(() => {
29
- if (!isInfiniteMode || !endIndex || !loadedDataRange.endIndex || isDataFetching)
29
+ if (!endIndex || !loadedDataRange.endIndex || isDataFetching)
30
30
  return;
31
31
  const items = itemContainerRef.current?.children;
32
+ if (!isInfiniteMode) {
33
+ // Wait for the requested page's results before reducing the finite count.
34
+ // Otherwise, rows from the previous page could be mistaken for a short response.
35
+ if (loadedDataRange.startIndex !== startIndex ||
36
+ loadedDataRange.endIndex !== endIndex ||
37
+ !items?.length) {
38
+ return;
39
+ }
40
+ const lastItemDataIndex = getDataIndex(items[items.length - 1]);
41
+ // If results end before the requested end index, reduce the count to the last returned index + 1.
42
+ if (lastItemDataIndex !== null && lastItemDataIndex < endIndex) {
43
+ setVirtualizedCount(count => Math.min(count, lastItemDataIndex + 1));
44
+ }
45
+ return;
46
+ }
47
+ // Infinite mode logic
32
48
  if (!items?.length) {
33
49
  setVirtualizedCount(0);
34
50
  return;
@@ -52,7 +68,8 @@ export default function useVirtualizerItemCount(params) {
52
68
  loadedDataRange,
53
69
  virtualizedCount,
54
70
  itemContainerRef,
55
- endIndex
71
+ endIndex,
72
+ startIndex
56
73
  ]);
57
74
  return {
58
75
  isInfiniteMode,
@@ -1 +1 @@
1
- {"version":3,"file":"useVirtualizerItemCount.js","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,eAAe,EACf,OAAO,EACP,QAAQ,EAGT,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAyBvC;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,MAAkC;IAIhF,MAAM,EACJ,UAAU,EACV,QAAQ,EACR,eAAe,EACf,cAAc,EACd,cAAc,EACd,MAAM,GAAG,EAAE,EACX,gBAAgB,EAChB,gBAAgB,EAChB,QAAQ,EACT,GAAG,MAAM,CAAC;IAEX,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC;IAE9E,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,SAAS,EAC7D,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,mBAAmB,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC;IAErC,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,EAAE,CAAC;YACnB,mBAAmB,CAAC,CAAC,CAAC,CAAC;QACzB,CAAC;IACH,CAAC,EAAE,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,iEAAiE;IACjE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,cAAc,IAAI,CAAC,QAAQ,IAAI,CAAC,eAAe,CAAC,QAAQ,IAAI,cAAc;YAAE,OAAO;QAExF,MAAM,KAAK,GAAG,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC;QACjD,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC;YACnB,mBAAmB,CAAC,CAAC,CAAC,CAAC;YACvB,OAAO;QACT,CAAC;QAED,MAAM,iBAAiB,GAAG,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;QAEtE,MAAM,cAAc,GAClB,eAAe,CAAC,UAAU,KAAK,UAAU;YACzC,eAAe,CAAC,QAAQ,KAAK,QAAQ;YACrC,iBAAiB,KAAK,QAAQ,CAAC;QAEjC,IAAI,CAAC,cAAc,IAAI,MAAM,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,CAAC;YAC3D,mBAAmB,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC;YAC3C,OAAO;QACT,CAAC;QAED,MAAM,eAAe,GAAG,eAAe,CAAC,QAAQ,GAAG,CAAC,GAAG,MAAM,CAAC;QAC9D,IAAI,cAAc,IAAI,eAAe,GAAG,gBAAgB,EAAE,CAAC;YACzD,mBAAmB,CAAC,eAAe,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,EAAE;QACD,cAAc;QACd,QAAQ;QACR,cAAc;QACd,eAAe;QACf,gBAAgB;QAChB,gBAAgB;QAChB,QAAQ;KACT,CAAC,CAAC;IAEH,OAAO;QACL,cAAc;QACd,gBAAgB;KACjB,CAAC;AACJ,CAAC","sourcesContent":["import {\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n type ReactNode,\n type RefObject\n} from 'react';\n\nimport type { LoadedDataRange } from './VariableHeightVirtualizer';\nimport { getDataIndex } from './utils';\n\ninterface VirtualizerItemCountParams {\n /** The starting index requested by virtualizer. */\n startIndex: number;\n /** The ending index requested by virtualizer. */\n endIndex: number;\n /** The range of items currently loaded. */\n loadedDataRange: LoadedDataRange;\n /** Indicates if the data is currently being fetched. */\n isDataFetching: boolean;\n\n /** Ref to the container holding rendered items. */\n itemContainerRef: RefObject<HTMLElement>;\n /** The rendered children items as ReactNode. */\n children: ReactNode;\n\n /** The total number of items if known, or `null`/`undefined` for infinite mode. */\n totalItemCount?: number | null;\n /** Optional buffer to add to the count in infinite mode. */\n buffer?: number;\n /** Signal to reset the count in infinite mode. */\n countResetSignal?: number;\n}\n\n/**\n * Determines the count of virtualized items in a list and whether the list is in infinite scrolling mode or not.\n *\n * @returns An object containing:\n * - `isInfiniteMode`: Whether the list is in infinite scrolling mode.\n * - `virtualizedCount`: The current count of virtualized items.\n *\n * NOTE: In finite mode, the count is based on `totalItemCount`.\n * NOTE: In infinite mode, the count is dynamically calculated based on loaded items and buffer.\n */\nexport default function useVirtualizerItemCount(params: VirtualizerItemCountParams): {\n isInfiniteMode: boolean;\n virtualizedCount: number;\n} {\n const {\n startIndex,\n endIndex,\n loadedDataRange,\n isDataFetching,\n totalItemCount,\n buffer = 10,\n countResetSignal,\n itemContainerRef,\n children\n } = params;\n\n const [virtualizedCount, setVirtualizedCount] = useState(totalItemCount || 0);\n\n const isInfiniteMode = useMemo(\n () => totalItemCount === null || totalItemCount === undefined,\n [totalItemCount]\n );\n\n useLayoutEffect(() => {\n if (!isInfiniteMode) {\n setVirtualizedCount(totalItemCount ?? 0);\n }\n }, [totalItemCount, isInfiniteMode]);\n\n useLayoutEffect(() => {\n if (isInfiniteMode) {\n setVirtualizedCount(0);\n }\n }, [countResetSignal, isInfiniteMode]);\n\n // Calculating count based on loaded items for infinite scrolling\n useEffect(() => {\n if (!isInfiniteMode || !endIndex || !loadedDataRange.endIndex || isDataFetching) return;\n\n const items = itemContainerRef.current?.children;\n if (!items?.length) {\n setVirtualizedCount(0);\n return;\n }\n\n const lastItemDataIndex = getDataIndex(items[items.length - 1]) ?? -1;\n\n const hasMoreResults =\n loadedDataRange.startIndex === startIndex &&\n loadedDataRange.endIndex === endIndex &&\n lastItemDataIndex === endIndex;\n\n if (!hasMoreResults && Number.isInteger(lastItemDataIndex)) {\n setVirtualizedCount(lastItemDataIndex + 1);\n return;\n }\n\n const countWithBuffer = loadedDataRange.endIndex + 1 + buffer;\n if (hasMoreResults && countWithBuffer > virtualizedCount) {\n setVirtualizedCount(countWithBuffer);\n }\n }, [\n isDataFetching,\n children,\n isInfiniteMode,\n loadedDataRange,\n virtualizedCount,\n itemContainerRef,\n endIndex\n ]);\n\n return {\n isInfiniteMode,\n virtualizedCount\n };\n}\n"]}
1
+ {"version":3,"file":"useVirtualizerItemCount.js","sourceRoot":"","sources":["../../../../../Core/Components/Virtualise/VariableHeightVirtualizer/useVirtualizerItemCount.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n type ReactNode,\n type RefObject\n} from 'react';\n\nimport type { LoadedDataRange } from './VariableHeightVirtualizer';\nimport { getDataIndex } from './utils';\n\ninterface VirtualizerItemCountParams {\n /** The starting index requested by virtualizer. */\n startIndex: number;\n /** The ending index requested by virtualizer. */\n endIndex: number;\n /** The range of items currently loaded. */\n loadedDataRange: LoadedDataRange;\n /** Indicates if the data is currently being fetched. */\n isDataFetching: boolean;\n\n /** Ref to the container holding rendered items. */\n itemContainerRef: RefObject<HTMLElement>;\n /** The rendered children items as ReactNode. */\n children: ReactNode;\n\n /** The total number of items if known, or `null`/`undefined` for infinite mode. */\n totalItemCount?: number | null;\n /** Optional buffer to add to the count in infinite mode. */\n buffer?: number;\n /** Signal to reset the count when the list data changes. */\n countResetSignal?: number;\n}\n\n/**\n * Determines the count of virtualized items in a list and whether the list is in infinite scrolling mode or not.\n *\n * @returns An object containing:\n * - `isInfiniteMode`: Whether the list is in infinite scrolling mode.\n * - `virtualizedCount`: The current count of virtualized items.\n *\n * NOTE: In finite mode, the count is based on `totalItemCount` and can shrink on a short page.\n * NOTE: In infinite mode, the count is dynamically calculated based on loaded items and buffer.\n */\nexport default function useVirtualizerItemCount(params: VirtualizerItemCountParams): {\n isInfiniteMode: boolean;\n virtualizedCount: number;\n} {\n const {\n startIndex,\n endIndex,\n loadedDataRange,\n isDataFetching,\n totalItemCount,\n buffer = 10,\n countResetSignal,\n itemContainerRef,\n children\n } = params;\n\n const [virtualizedCount, setVirtualizedCount] = useState(totalItemCount || 0);\n\n const isInfiniteMode = useMemo(\n () => totalItemCount === null || totalItemCount === undefined,\n [totalItemCount]\n );\n\n useLayoutEffect(() => {\n if (!isInfiniteMode) {\n setVirtualizedCount(totalItemCount ?? 0);\n }\n }, [totalItemCount, isInfiniteMode, countResetSignal]);\n\n useLayoutEffect(() => {\n if (isInfiniteMode) {\n setVirtualizedCount(0);\n }\n }, [countResetSignal, isInfiniteMode]);\n\n // Check completed short pages in finite mode; grow the count only in infinite mode.\n useEffect(() => {\n if (!endIndex || !loadedDataRange.endIndex || isDataFetching) return;\n\n const items = itemContainerRef.current?.children;\n\n if (!isInfiniteMode) {\n // Wait for the requested page's results before reducing the finite count.\n // Otherwise, rows from the previous page could be mistaken for a short response.\n if (\n loadedDataRange.startIndex !== startIndex ||\n loadedDataRange.endIndex !== endIndex ||\n !items?.length\n ) {\n return;\n }\n\n const lastItemDataIndex = getDataIndex(items[items.length - 1]);\n\n // If results end before the requested end index, reduce the count to the last returned index + 1.\n if (lastItemDataIndex !== null && lastItemDataIndex < endIndex) {\n setVirtualizedCount(count => Math.min(count, lastItemDataIndex + 1));\n }\n\n return;\n }\n\n // Infinite mode logic\n\n if (!items?.length) {\n setVirtualizedCount(0);\n return;\n }\n\n const lastItemDataIndex = getDataIndex(items[items.length - 1]) ?? -1;\n\n const hasMoreResults =\n loadedDataRange.startIndex === startIndex &&\n loadedDataRange.endIndex === endIndex &&\n lastItemDataIndex === endIndex;\n\n if (!hasMoreResults && Number.isInteger(lastItemDataIndex)) {\n setVirtualizedCount(lastItemDataIndex + 1);\n return;\n }\n\n const countWithBuffer = loadedDataRange.endIndex + 1 + buffer;\n if (hasMoreResults && countWithBuffer > virtualizedCount) {\n setVirtualizedCount(countWithBuffer);\n }\n }, [\n isDataFetching,\n children,\n isInfiniteMode,\n loadedDataRange,\n virtualizedCount,\n itemContainerRef,\n endIndex,\n startIndex\n ]);\n\n return {\n isInfiniteMode,\n virtualizedCount\n };\n}\n"]}