@pega/lists-react 8.0.0-build.27.14

package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.js

@@ -0,0 +1,81 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef } from 'react';
+import { Button, createUID, Flex, Icon, useI18n } from '@pega/cosmos-react-core';
+import useRowFocus from '../useRowFocus';
+import useDragDrop from '../../../../Hooks/useDragDrop';
+import { getValidSortColumnsInRow } from './utils';
+import Row from './Row';
+const DropSelector = '[data-drop]';
+const SortRenderer = ({ sortItems, columns, updateSortItems }) => {
+    const t = useI18n();
+    const { focusRowRef, focusRowId, setFocusRowId } = useRowFocus();
+    const dragDropRef = useRef(null);
+    const getAnimationSelector = useCallback((target) => target.closest(DropSelector), []);
+    const updateSortItemSequence = useCallback((srcSequence, destSequence) => {
+        const items = sortItems.slice().sort((a, b) => a.sequence - b.sequence);
+        items.splice(destSequence - 1, 0, items.splice(srcSequence - 1, 1)[0]);
+        items.forEach((item, index) => {
+            item.sequence = index + 1;
+        });
+        updateSortItems(items);
+    }, [sortItems]);
+    const onDrop = useCallback((dest, src) => {
+        updateSortItemSequence(parseInt(src.getAttribute('data-sequence') ?? '', 10), parseInt(dest.getAttribute('data-sequence') ?? '', 10));
+    }, [updateSortItemSequence]);
+    const { dragProps, dropProps } = useDragDrop({
+        context: dragDropRef,
+        getAnimationSelector,
+        getGhostImageSelector: getAnimationSelector,
+        getDraggedObject: getAnimationSelector,
+        onDrop
+    });
+    const addSortItem = useCallback(() => {
+        const validSortColumnsInRow = getValidSortColumnsInRow(columns, sortItems);
+        if (validSortColumnsInRow && validSortColumnsInRow.length) {
+            const newRow = {
+                id: createUID(),
+                columnId: '',
+                order: '',
+                sequence: sortItems.length + 1
+            };
+            const newSortItems = [...sortItems, newRow];
+            updateSortItems(newSortItems);
+            setFocusRowId(newRow.id);
+        }
+    }, [sortItems, columns, setFocusRowId]);
+    const updateSortItemId = useCallback((id, sequence) => {
+        const index = sortItems.findIndex(s => s.sequence === sequence);
+        const items = [...sortItems];
+        items[index].columnId = id;
+        updateSortItems(items);
+    }, [sortItems]);
+    const updateSortItemOrder = useCallback((e, sequence, o) => {
+        const index = sortItems.findIndex(s => s.sequence === sequence);
+        const items = [...sortItems];
+        items[index].order = o;
+        updateSortItems(items);
+    }, [sortItems]);
+    const removeSortItem = useCallback((index) => {
+        const items = sortItems.map(v => ({ ...v }));
+        const { sequence } = items[index];
+        items.splice(index, 1);
+        items.forEach(item => {
+            if (item.sequence > sequence)
+                item.sequence -= 1;
+        });
+        updateSortItems(items);
+        if (items.length > 0)
+            setFocusRowId(index === sortItems.length - 1 ? items[index - 1].id : items[index].id);
+    }, [sortItems, setFocusRowId]);
+    useEffect(() => {
+        if (!sortItems.length) {
+            addSortItem();
+        }
+    }, [sortItems, addSortItem]);
+    return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Flex, { container: { direction: 'column', gap: 1 }, ref: dragDropRef, children: sortItems
+                    .slice()
+                    .sort((a, b) => a.sequence - b.sequence)
+                    .map((s, i) => (_jsx(Row, { updateSortItemId: updateSortItemId, updateSortItemOrder: updateSortItemOrder, columns: columns, removeSortItem: removeSortItem, sortItems: sortItems, index: i, id: s.columnId, order: s.order, sequence: s.sequence, dragProps: dragProps, dropProps: dropProps, focusRowRef: sortItems[i].id === focusRowId ? focusRowRef : null }, s.id))) }), _jsx("div", { children: _jsx(Button, { variant: 'link', "aria-label": t('add_sort'), onClick: addSortItem, children: _jsxs(Flex, { container: { inline: true, alignItems: 'start', gap: 1 }, as: 'span', children: [_jsx(Icon, { name: 'plus' }), _jsx("span", { children: t('add') })] }) }) })] }));
+};
+export default SortRenderer;
+//# sourceMappingURL=SortRenderer.js.map

package/lib/Core/Components/Toolbar/hooks/useSort/SortRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortRenderer.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/SortRenderer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport { Button, createUID, Flex, Icon, useI18n } from '@pega/cosmos-react-core';\nimport type { Sort } from 'pega-repeating-structures-core/types/State.types';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport useRowFocus from '../useRowFocus';\nimport useDragDrop from '../../../../Hooks/useDragDrop';\n\nimport { getValidSortColumnsInRow } from './utils';\nimport Row from './Row';\nimport type { SortItem } from './useSort';\n\nconst DropSelector = '[data-drop]';\n\ninterface SortRendererProps {\n  sortItems: SortItem[];\n  columns: RsCoreTypes.Column[];\n  updateSortItems: (sortItems: (Sort | { order: string })[]) => void;\n}\n\nconst SortRenderer = ({ sortItems, columns, updateSortItems }: SortRendererProps) => {\n  const t = useI18n();\n  const { focusRowRef, focusRowId, setFocusRowId } = useRowFocus();\n\n  const dragDropRef = useRef<HTMLDivElement>(null);\n  const getAnimationSelector = useCallback((target: Element) => target.closest(DropSelector), []);\n\n  const updateSortItemSequence = useCallback(\n    (srcSequence: Sort['sequence'], destSequence: Sort['sequence']) => {\n      const items = sortItems.slice().sort((a, b) => a.sequence - b.sequence);\n      items.splice(destSequence - 1, 0, items.splice(srcSequence - 1, 1)[0]);\n      items.forEach((item, index) => {\n        item.sequence = index + 1;\n      });\n      updateSortItems(items);\n    },\n    [sortItems]\n  );\n\n  const onDrop = useCallback(\n    (dest: Element, src: Element) => {\n      updateSortItemSequence(\n        parseInt(src.getAttribute('data-sequence') ?? '', 10),\n        parseInt(dest.getAttribute('data-sequence') ?? '', 10)\n      );\n    },\n    [updateSortItemSequence]\n  );\n  const { dragProps, dropProps } = useDragDrop({\n    context: dragDropRef,\n    getAnimationSelector,\n    getGhostImageSelector: getAnimationSelector,\n    getDraggedObject: getAnimationSelector,\n    onDrop\n  });\n\n  const addSortItem = useCallback(() => {\n    const validSortColumnsInRow = getValidSortColumnsInRow(columns, sortItems);\n    if (validSortColumnsInRow && validSortColumnsInRow.length) {\n      const newRow = {\n        id: createUID(),\n        columnId: '',\n        order: '',\n        sequence: sortItems.length + 1\n      };\n      const newSortItems = [...sortItems, newRow];\n      updateSortItems(newSortItems);\n      setFocusRowId(newRow.id);\n    }\n  }, [sortItems, columns, setFocusRowId]);\n\n  const updateSortItemId = useCallback(\n    (id: Sort['columnId'], sequence: Sort['sequence']) => {\n      const index = sortItems.findIndex(s => s.sequence === sequence);\n      const items = [...sortItems];\n      items[index].columnId = id;\n      updateSortItems(items);\n    },\n    [sortItems]\n  );\n\n  const updateSortItemOrder = useCallback(\n    (e: ChangeEvent, sequence: Sort['sequence'], o: Sort['order']) => {\n      const index = sortItems.findIndex(s => s.sequence === sequence);\n      const items = [...sortItems];\n      items[index].order = o;\n      updateSortItems(items);\n    },\n    [sortItems]\n  );\n\n  const removeSortItem = useCallback(\n    (index: number) => {\n      const items = sortItems.map(v => ({ ...v }));\n      const { sequence } = items[index];\n      items.splice(index, 1);\n      items.forEach(item => {\n        if (item.sequence > sequence) item.sequence -= 1;\n      });\n      updateSortItems(items);\n\n      if (items.length > 0)\n        setFocusRowId(index === sortItems.length - 1 ? items[index - 1].id : items[index].id);\n    },\n    [sortItems, setFocusRowId]\n  );\n\n  useEffect(() => {\n    if (!sortItems.length) {\n      addSortItem();\n    }\n  }, [sortItems, addSortItem]);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Flex container={{ direction: 'column', gap: 1 }} ref={dragDropRef}>\n        {sortItems\n          .slice()\n          .sort((a, b) => a.sequence - b.sequence)\n          .map((s, i) => (\n            <Row\n              key={s.id}\n              updateSortItemId={updateSortItemId}\n              updateSortItemOrder={updateSortItemOrder}\n              columns={columns}\n              removeSortItem={removeSortItem}\n              sortItems={sortItems}\n              index={i}\n              id={s.columnId}\n              order={s.order}\n              sequence={s.sequence}\n              dragProps={dragProps}\n              dropProps={dropProps}\n              focusRowRef={sortItems[i].id === focusRowId ? focusRowRef : null}\n            />\n          ))}\n      </Flex>\n      <div>\n        <Button variant='link' aria-label={t('add_sort')} onClick={addSortItem}>\n          <Flex container={{ inline: true, alignItems: 'start', gap: 1 }} as='span'>\n            <Icon name='plus' />\n            <span>{t('add')}</span>\n          </Flex>\n        </Button>\n      </div>\n    </Flex>\n  );\n};\n\nexport default SortRenderer;\n"]}

package/lib/Core/Components/Toolbar/hooks/useSort/useSort.d.ts

@@ -0,0 +1,11 @@
+import { type ListToolbarProps } from '@pega/cosmos-react-core';
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+import type { Sort } from 'pega-repeating-structures-core/types/State.types';
+export interface SortItem extends Sort {
+    id: string;
+}
+declare const useSort: ({ view }: {
+    view: RsCoreTypes.View;
+}) => ListToolbarProps["sort"];
+export default useSort;
+//# sourceMappingURL=useSort.d.ts.map

package/lib/Core/Components/Toolbar/hooks/useSort/useSort.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSort.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/useSort.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,gBAAgB,EAAe,MAAM,yBAAyB,CAAC;AACxF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kDAAkD,CAAC;AAO7E,MAAM,WAAW,QAAS,SAAQ,IAAI;IACpC,EAAE,EAAE,MAAM,CAAC;CACZ;AAKD,QAAA,MAAM,OAAO,aAAc;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,KAAG,gBAAgB,CAAC,MAAM,CAwC9E,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/Core/Components/Toolbar/hooks/useSort/useSort.js

@@ -0,0 +1,41 @@
+import { useCallback, useEffect, useState } from 'react';
+import { createUID, usePrevious } from '@pega/cosmos-react-core';
+import { TOOLBAR_FEATURES } from '../../../../constants';
+import { deepCopy, deepEqual } from '../../../../Utils/index';
+import SortRenderer from './SortRenderer';
+const convertSortingOrderToSortItems = (sortingOrder) => sortingOrder.map(sort => ({ ...sort, id: createUID() }));
+const useSort = ({ view }) => {
+    const { columns = [], state: { sortingOrder = [] } = {}, type: { applySorting } } = view;
+    const displaySort = view.shouldDisplayFeature(TOOLBAR_FEATURES.SORT);
+    const [sortItems, updateSortItems] = useState([]);
+    const onSubmit = useCallback(() => {
+        const finalSortItems = sortItems
+            .sort((a, b) => a.sequence - b.sequence)
+            .filter(ele => ele.columnId && ele.order)
+            .map((item, index) => {
+            const { id, ...rest } = item;
+            return { ...rest, sequence: index + 1 };
+        });
+        applySorting(finalSortItems);
+    }, [sortItems, applySorting]);
+    const onCancel = useCallback(() => {
+        applySorting(deepCopy(sortingOrder));
+    }, [applySorting, sortingOrder]);
+    const prevSortingOrder = usePrevious(sortingOrder);
+    useEffect(() => {
+        if (!deepEqual(sortingOrder, prevSortingOrder)) {
+            updateSortItems(deepCopy(convertSortingOrderToSortItems(sortingOrder)));
+        }
+    }, [sortingOrder, prevSortingOrder]);
+    if (!displaySort)
+        return;
+    return {
+        count: sortingOrder.length > 0 ? sortingOrder.length : undefined,
+        renderer: SortRenderer,
+        rendererProps: { sortItems, columns, updateSortItems },
+        onSubmit,
+        onCancel
+    };
+};
+export default useSort;
+//# sourceMappingURL=useSort.js.map

package/lib/Core/Components/Toolbar/hooks/useSort/useSort.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSort.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/useSort.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,SAAS,EAAyB,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAIxF,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE9D,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAM1C,MAAM,8BAA8B,GAAG,CAAC,YAAoB,EAAE,EAAE,CAC9D,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC;AAE3D,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAA8B,EAA4B,EAAE;IACjF,MAAM,EACJ,OAAO,GAAG,EAAE,EACZ,KAAK,EAAE,EAAE,YAAY,GAAG,EAAE,EAAE,GAAG,EAAE,EACjC,IAAI,EAAE,EAAE,YAAY,EAAE,EACvB,GAAG,IAAI,CAAC;IACT,MAAM,WAAW,GAAG,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACrE,MAAM,CAAC,SAAS,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC,CAAC;IAE9D,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,MAAM,cAAc,GAAG,SAAS;aAC7B,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;aACvC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,KAAK,CAAC;aACxC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACnB,MAAM,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;YAC7B,OAAO,EAAE,GAAG,IAAI,EAAE,QAAQ,EAAE,KAAK,GAAG,CAAC,EAAE,CAAC;QAC1C,CAAC,CAAC,CAAC;QACL,YAAY,CAAC,cAAc,CAAC,CAAC;IAC/B,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9B,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,YAAY,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC;IACvC,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjC,MAAM,gBAAgB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACnD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE,gBAAgB,CAAC,EAAE,CAAC;YAC/C,eAAe,CAAC,QAAQ,CAAC,8BAA8B,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAC1E,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAErC,IAAI,CAAC,WAAW;QAAE,OAAO;IAEzB,OAAO;QACL,KAAK,EAAE,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAChE,QAAQ,EAAE,YAAY;QACtB,aAAa,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE;QACtD,QAAQ;QACR,QAAQ;KACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { useCallback, useEffect, useState } from 'react';\n\nimport { createUID, type ListToolbarProps, usePrevious } from '@pega/cosmos-react-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Sort } from 'pega-repeating-structures-core/types/State.types';\n\nimport { TOOLBAR_FEATURES } from '../../../../constants';\nimport { deepCopy, deepEqual } from '../../../../Utils/index';\n\nimport SortRenderer from './SortRenderer';\n\nexport interface SortItem extends Sort {\n  id: string;\n}\n\nconst convertSortingOrderToSortItems = (sortingOrder: Sort[]) =>\n  sortingOrder.map(sort => ({ ...sort, id: createUID() }));\n\nconst useSort = ({ view }: { view: RsCoreTypes.View }): ListToolbarProps['sort'] => {\n  const {\n    columns = [],\n    state: { sortingOrder = [] } = {},\n    type: { applySorting }\n  } = view;\n  const displaySort = view.shouldDisplayFeature(TOOLBAR_FEATURES.SORT);\n  const [sortItems, updateSortItems] = useState<SortItem[]>([]);\n\n  const onSubmit = useCallback(() => {\n    const finalSortItems = sortItems\n      .sort((a, b) => a.sequence - b.sequence)\n      .filter(ele => ele.columnId && ele.order)\n      .map((item, index) => {\n        const { id, ...rest } = item;\n        return { ...rest, sequence: index + 1 };\n      });\n    applySorting(finalSortItems);\n  }, [sortItems, applySorting]);\n\n  const onCancel = useCallback(() => {\n    applySorting(deepCopy(sortingOrder));\n  }, [applySorting, sortingOrder]);\n\n  const prevSortingOrder = usePrevious(sortingOrder);\n  useEffect(() => {\n    if (!deepEqual(sortingOrder, prevSortingOrder)) {\n      updateSortItems(deepCopy(convertSortingOrderToSortItems(sortingOrder)));\n    }\n  }, [sortingOrder, prevSortingOrder]);\n\n  if (!displaySort) return;\n\n  return {\n    count: sortingOrder.length > 0 ? sortingOrder.length : undefined,\n    renderer: SortRenderer,\n    rendererProps: { sortItems, columns, updateSortItems },\n    onSubmit,\n    onCancel\n  };\n};\n\nexport default useSort;\n"]}

package/lib/Core/Components/Toolbar/hooks/useSort/utils.d.ts

@@ -0,0 +1,8 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+import type { Sort } from 'pega-repeating-structures-core/types/State.types';
+export declare const getValidSortColumnsInRow: (columns: RsCoreTypes.Column[], sortItems: Sort[], id?: Sort["columnId"]) => import("pega-repeating-structures-core/lib/src/core/generators/ColumnGenerator").default[];
+export declare const getValidSortOrders: () => {
+    id: string;
+    label: string;
+}[];
+//# sourceMappingURL=utils.d.ts.map

package/lib/Core/Components/Toolbar/hooks/useSort/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kDAAkD,CAAC;AAS7E,eAAO,MAAM,wBAAwB,YAC1B,WAAW,CAAC,MAAM,EAAE,aAClB,IAAI,EAAE,OACZ,IAAI,CAAC,UAAU,CAAC,+FAMtB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;GAK9B,CAAC"}

package/lib/Core/Components/Toolbar/hooks/useSort/utils.js

@@ -0,0 +1,19 @@
+import { NonNullSortActions } from '../../../../constants';
+const sortLabels = {
+    asc: 'Ascending',
+    desc: 'Descending'
+};
+export const getValidSortColumnsInRow = (columns, sortItems, id) => {
+    const existingSortItemsId = sortItems.map(s => s.columnId);
+    const index = id ? existingSortItemsId.indexOf(id) : -1;
+    if (index !== -1)
+        existingSortItemsId.splice(index, 1);
+    return columns.filter(c => c.field.sort && !existingSortItemsId.includes(c.field.id));
+};
+export const getValidSortOrders = () => {
+    return NonNullSortActions.map(o => ({
+        id: o.actionId,
+        label: sortLabels[o.actionId]
+    }));
+};
+//# sourceMappingURL=utils.js.map

package/lib/Core/Components/Toolbar/hooks/useSort/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../Core/Components/Toolbar/hooks/useSort/utils.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,MAAM,UAAU,GAA8B;IAC5C,GAAG,EAAE,WAAW;IAChB,IAAI,EAAE,YAAY;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG,CACtC,OAA6B,EAC7B,SAAiB,EACjB,EAAqB,EACrB,EAAE;IACF,MAAM,mBAAmB,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACxD,IAAI,KAAK,KAAK,CAAC,CAAC;QAAE,mBAAmB,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACvD,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;AACxF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,EAAE;IACrC,OAAO,kBAAkB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QAClC,EAAE,EAAE,CAAC,CAAC,QAAQ;QACd,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC;KAC9B,CAAC,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Sort } from 'pega-repeating-structures-core/types/State.types';\n\nimport { NonNullSortActions } from '../../../../constants';\n\nconst sortLabels: { [key: string]: string } = {\n  asc: 'Ascending',\n  desc: 'Descending'\n};\n\nexport const getValidSortColumnsInRow = (\n  columns: RsCoreTypes.Column[],\n  sortItems: Sort[],\n  id?: Sort['columnId']\n) => {\n  const existingSortItemsId = sortItems.map(s => s.columnId);\n  const index = id ? existingSortItemsId.indexOf(id) : -1;\n  if (index !== -1) existingSortItemsId.splice(index, 1);\n  return columns.filter(c => c.field.sort && !existingSortItemsId.includes(c.field.id));\n};\n\nexport const getValidSortOrders = () => {\n  return NonNullSortActions.map(o => ({\n    id: o.actionId,\n    label: sortLabels[o.actionId]\n  }));\n};\n"]}

package/lib/Core/Components/Toolbar/index.d.ts

@@ -0,0 +1,14 @@
+declare function Toolbar({ view }: {
+    view: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace Toolbar {
+    namespace propTypes {
+        let view: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+    }
+    let defaultProps: {};
+}
+export default Toolbar;
+import PropTypes from 'prop-types';
+//# sourceMappingURL=index.d.ts.map

package/lib/Core/Components/Toolbar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/index.jsx"],"names":[],"mappings":"AAKA;;4CAUC;;;;;;;;;;sBAfqB,YAAY"}

package/lib/Core/Components/Toolbar/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import PropTypes from 'prop-types';
+import AdvanceToolbar from './AdvanceToolbar';
+import SimpleToolbar from './SimpleToolbar';
+export default function Toolbar({ view }) {
+    const { meta: { toolbar } } = view;
+    return (_jsxs(_Fragment, { children: [!toolbar && _jsx(SimpleToolbar, { view: view }), toolbar && _jsx(AdvanceToolbar, { view: view })] }));
+}
+Toolbar.propTypes = {
+    view: PropTypes.objectOf(PropTypes.any).isRequired
+};
+Toolbar.defaultProps = {};
+//# sourceMappingURL=index.js.map

package/lib/Core/Components/Toolbar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/index.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAAE,IAAI,EAAE;IACtC,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,IAAI,CAAC;IACT,OAAO,CACL,8BACG,CAAC,OAAO,IAAI,KAAC,aAAa,IAAC,IAAI,EAAE,IAAI,GAAI,EACzC,OAAO,IAAI,KAAC,cAAc,IAAC,IAAI,EAAE,IAAI,GAAI,IACzC,CACJ,CAAC;AACJ,CAAC;AAED,OAAO,CAAC,SAAS,GAAG;IAClB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACnD,CAAC;AAEF,OAAO,CAAC,YAAY,GAAG,EAAE,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport AdvanceToolbar from './AdvanceToolbar';\nimport SimpleToolbar from './SimpleToolbar';\n\nexport default function Toolbar({ view }) {\n  const {\n    meta: { toolbar }\n  } = view;\n  return (\n    <>\n      {!toolbar && <SimpleToolbar view={view} />}\n      {toolbar && <AdvanceToolbar view={view} />}\n    </>\n  );\n}\n\nToolbar.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nToolbar.defaultProps = {};\n"]}

package/lib/Core/Components/Toolbar/utils/getCount.d.ts

@@ -0,0 +1,9 @@
+export default getCount;
+declare function getCount({ view }: {
+    view: any;
+}): {
+    total: any;
+    totalHasMore: boolean;
+    selected: any;
+};
+//# sourceMappingURL=getCount.d.ts.map

package/lib/Core/Components/Toolbar/utils/getCount.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCount.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/utils/getCount.js"],"names":[],"mappings":";AAEA;;;;;;EA4BC"}

package/lib/Core/Components/Toolbar/utils/getCount.js

@@ -0,0 +1,22 @@
+import { SELECTION_MODES } from '../../../constants';
+const getCount = ({ view }) => {
+    const { filteredRecordCount, totalRecordCount, isFilterApplied, selectedRecordsCount, hasMoreTotalRecords, hasMoreFilteredRecords, meta } = view;
+    let total;
+    let totalHasMore = false;
+    if (isFilterApplied && filteredRecordCount !== -1) {
+        total = filteredRecordCount;
+        totalHasMore = !!hasMoreFilteredRecords;
+    }
+    else if (totalRecordCount !== -1) {
+        total = totalRecordCount;
+        totalHasMore = !!hasMoreTotalRecords;
+    }
+    let selected;
+    // do not display {0 selected} for multi_on_hover mode
+    if (meta?.selectionMode === SELECTION_MODES.multi) {
+        selected = selectedRecordsCount || 0;
+    }
+    return { total, totalHasMore, selected };
+};
+export default getCount;
+//# sourceMappingURL=getCount.js.map

package/lib/Core/Components/Toolbar/utils/getCount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCount.js","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/utils/getCount.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IAC5B,MAAM,EACJ,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,mBAAmB,EACnB,sBAAsB,EACtB,IAAI,EACL,GAAG,IAAI,CAAC;IAET,IAAI,KAAK,CAAC;IACV,IAAI,YAAY,GAAG,KAAK,CAAC;IACzB,IAAI,eAAe,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE,CAAC;QAClD,KAAK,GAAG,mBAAmB,CAAC;QAC5B,YAAY,GAAG,CAAC,CAAC,sBAAsB,CAAC;IAC1C,CAAC;SAAM,IAAI,gBAAgB,KAAK,CAAC,CAAC,EAAE,CAAC;QACnC,KAAK,GAAG,gBAAgB,CAAC;QACzB,YAAY,GAAG,CAAC,CAAC,mBAAmB,CAAC;IACvC,CAAC;IAED,IAAI,QAAQ,CAAC;IACb,sDAAsD;IACtD,IAAI,IAAI,EAAE,aAAa,KAAK,eAAe,CAAC,KAAK,EAAE,CAAC;QAClD,QAAQ,GAAG,oBAAoB,IAAI,CAAC,CAAC;IACvC,CAAC;IAED,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC;AAC3C,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { SELECTION_MODES } from '../../../constants';\n\nconst getCount = ({ view }) => {\n  const {\n    filteredRecordCount,\n    totalRecordCount,\n    isFilterApplied,\n    selectedRecordsCount,\n    hasMoreTotalRecords,\n    hasMoreFilteredRecords,\n    meta\n  } = view;\n\n  let total;\n  let totalHasMore = false;\n  if (isFilterApplied && filteredRecordCount !== -1) {\n    total = filteredRecordCount;\n    totalHasMore = !!hasMoreFilteredRecords;\n  } else if (totalRecordCount !== -1) {\n    total = totalRecordCount;\n    totalHasMore = !!hasMoreTotalRecords;\n  }\n\n  let selected;\n  // do not display {0 selected} for multi_on_hover mode\n  if (meta?.selectionMode === SELECTION_MODES.multi) {\n    selected = selectedRecordsCount || 0;\n  }\n\n  return { total, totalHasMore, selected };\n};\n\nexport default getCount;\n"]}

package/lib/Core/Components/Toolbar/utils/utils.d.ts

@@ -0,0 +1,51 @@
+export default getMenuItemsFromColumns;
+/**
+ * returns copy of embedded property's leafNode model from store or null
+ * @function getMenuItemsFromColumns
+ * @param {array} columns columns array containing each column object
+ * @param {string} fieldProp value for id prop(either 'name' of 'id')
+ * @param {string} selectedField field which is already selected as part of sort/group/filter action
+ * @returns {array} returns an array of objects where each object is one category
+ *
+ * @example <caption>Example for getMenuItemsFromColumns.</caption>
+ * We have two fields named ID and Priority where ID does not belong to any category and priority belongs to Bugs class category
+ *
+ * columns example(fieldDefs) :
+ * [
+ *  {
+      filter: true,
+      type: 'text',
+      name: 'pyID',
+      label: 'ID',
+      id: '2',
+      category: [{ label: 'Profile' }],
+      sort: true
+    },
+    {
+      type: 'text',
+      name: 'pyLabel',
+      label: 'Name',
+      id: '3',
+      category: [{ label: 'Profile' }],
+      sort: true
+    }
+  ]
+ *
+ * getMenuItemsFromColumns(columns) returns :
+ * [
+    {
+      id: 'ID',
+      primary: ID,
+      items: undefined,
+      selected: undefined
+    },
+    {
+      id: ‘Bugs Class’,
+      primary: ‘Bugs Class’,
+      selected: undefined,
+      items: [ {id: ‘Priority', primary: ‘Priority’, selected: true, items: undefined}]
+    }
+  ]
+*/
+declare function getMenuItemsFromColumns(columns: array, fieldProp: string, selectedField: string, defaultType?: string): array;
+//# sourceMappingURL=utils.d.ts.map

package/lib/Core/Components/Toolbar/utils/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/utils/utils.js"],"names":[],"mappings":";AAgCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AAEF,kDA9CW,KAAK,aACL,MAAM,iBACN,MAAM,yBACJ,KAAK,CAmEjB"}

package/lib/Core/Components/Toolbar/utils/utils.js

@@ -0,0 +1,100 @@
+import { typeMap } from '../../Filters/config';
+const getCategoryItems = (id, arr) => {
+    for (const obj of arr) {
+        if (obj.id === id && obj.items) {
+            return obj.items;
+        }
+    }
+};
+const prepareCategoryInfo = (id, label, arr) => {
+    const items = [];
+    arr.push({ id, primary: label, items });
+    return items;
+};
+const prepareCategoryItems = (categories, items) => {
+    let curPath = '';
+    let leafCategoryArr = items;
+    for (let i = 0; i < categories.length; i += 1) {
+        curPath = i > 0 ? `${curPath}.${categories[i].label}-${i}` : `${categories[i].label}-${i}`;
+        const existingCategoryArr = getCategoryItems(curPath, leafCategoryArr);
+        if (!existingCategoryArr) {
+            leafCategoryArr = prepareCategoryInfo(curPath, categories[i].label, leafCategoryArr);
+        }
+        else {
+            leafCategoryArr = existingCategoryArr;
+        }
+    }
+    return leafCategoryArr;
+};
+/**
+ * returns copy of embedded property's leafNode model from store or null
+ * @function getMenuItemsFromColumns
+ * @param {array} columns columns array containing each column object
+ * @param {string} fieldProp value for id prop(either 'name' of 'id')
+ * @param {string} selectedField field which is already selected as part of sort/group/filter action
+ * @returns {array} returns an array of objects where each object is one category
+ *
+ * @example <caption>Example for getMenuItemsFromColumns.</caption>
+ * We have two fields named ID and Priority where ID does not belong to any category and priority belongs to Bugs class category
+ *
+ * columns example(fieldDefs) :
+ * [
+ *  {
+      filter: true,
+      type: 'text',
+      name: 'pyID',
+      label: 'ID',
+      id: '2',
+      category: [{ label: 'Profile' }],
+      sort: true
+    },
+    {
+      type: 'text',
+      name: 'pyLabel',
+      label: 'Name',
+      id: '3',
+      category: [{ label: 'Profile' }],
+      sort: true
+    }
+  ]
+ *
+ * getMenuItemsFromColumns(columns) returns :
+ * [
+    {
+      id: 'ID',
+      primary: ID,
+      items: undefined,
+      selected: undefined
+    },
+    {
+      id: ‘Bugs Class’,
+      primary: ‘Bugs Class’,
+      selected: undefined,
+      items: [ {id: ‘Priority', primary: ‘Priority’, selected: true, items: undefined}]
+    }
+  ]
+*/
+function getMenuItemsFromColumns(columns, fieldProp, selectedField, defaultType = 'text') {
+    const items = [];
+    let categoryArr = [];
+    if (!columns) {
+        return items;
+    }
+    columns.forEach(column => {
+        const { field } = column;
+        const leafCategoryItem = {
+            id: field[fieldProp],
+            primary: field.label,
+            type: typeMap[field.type?.toLowerCase()] || typeMap[defaultType],
+            selected: field.id === selectedField
+        };
+        categoryArr = items;
+        if (field.category) {
+            categoryArr = prepareCategoryItems(field.category, categoryArr);
+        }
+        categoryArr.push(leafCategoryItem);
+    });
+    return items;
+}
+export default getMenuItemsFromColumns;
+//# sourceMappingURL=utils.js.map

package/lib/Core/Components/Toolbar/utils/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../Core/Components/Toolbar/utils/utils.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,MAAM,gBAAgB,GAAG,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE;IACnC,KAAK,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACtB,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,GAAG,CAAC,KAAK,EAAE,CAAC;YAC/B,OAAO,GAAG,CAAC,KAAK,CAAC;QACnB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE;IAC7C,MAAM,KAAK,GAAG,EAAE,CAAC;IACjB,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IACxC,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,oBAAoB,GAAG,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE;IACjD,IAAI,OAAO,GAAG,EAAE,CAAC;IACjB,IAAI,eAAe,GAAG,KAAK,CAAC;IAC5B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC;QAC9C,OAAO,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,EAAE,CAAC;QAE3F,MAAM,mBAAmB,GAAG,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;QACvE,IAAI,CAAC,mBAAmB,EAAE,CAAC;YACzB,eAAe,GAAG,mBAAmB,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;QACvF,CAAC;aAAM,CAAC;YACN,eAAe,GAAG,mBAAmB,CAAC;QACxC,CAAC;IACH,CAAC;IACD,OAAO,eAAe,CAAC;AACzB,CAAC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AAEF,SAAS,uBAAuB,CAAC,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,WAAW,GAAG,MAAM;IACtF,MAAM,KAAK,GAAG,EAAE,CAAC;IACjB,IAAI,WAAW,GAAG,EAAE,CAAC;IAErB,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;QACvB,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;QACzB,MAAM,gBAAgB,GAAG;YACvB,EAAE,EAAE,KAAK,CAAC,SAAS,CAAC;YACpB,OAAO,EAAE,KAAK,CAAC,KAAK;YACpB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,WAAW,EAAE,CAAC,IAAI,OAAO,CAAC,WAAW,CAAC;YAChE,QAAQ,EAAE,KAAK,CAAC,EAAE,KAAK,aAAa;SACrC,CAAC;QAEF,WAAW,GAAG,KAAK,CAAC;QACpB,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;YACnB,WAAW,GAAG,oBAAoB,CAAC,KAAK,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAClE,CAAC;QACD,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC;AACD,eAAe,uBAAuB,CAAC","sourcesContent":["import { typeMap } from '../../Filters/config';\n\nconst getCategoryItems = (id, arr) => {\n  for (const obj of arr) {\n    if (obj.id === id && obj.items) {\n      return obj.items;\n    }\n  }\n};\n\nconst prepareCategoryInfo = (id, label, arr) => {\n  const items = [];\n  arr.push({ id, primary: label, items });\n  return items;\n};\n\nconst prepareCategoryItems = (categories, items) => {\n  let curPath = '';\n  let leafCategoryArr = items;\n  for (let i = 0; i < categories.length; i += 1) {\n    curPath = i > 0 ? `${curPath}.${categories[i].label}-${i}` : `${categories[i].label}-${i}`;\n\n    const existingCategoryArr = getCategoryItems(curPath, leafCategoryArr);\n    if (!existingCategoryArr) {\n      leafCategoryArr = prepareCategoryInfo(curPath, categories[i].label, leafCategoryArr);\n    } else {\n      leafCategoryArr = existingCategoryArr;\n    }\n  }\n  return leafCategoryArr;\n};\n\n/**\n * returns copy of embedded property's leafNode model from store or null\n * @function getMenuItemsFromColumns\n * @param {array} columns columns array containing each column object\n * @param {string} fieldProp value for id prop(either 'name' of 'id')\n * @param {string} selectedField field which is already selected as part of sort/group/filter action\n * @returns {array} returns an array of objects where each object is one category\n *\n * @example <caption>Example for getMenuItemsFromColumns.</caption>\n * We have two fields named ID and Priority where ID does not belong to any category and priority belongs to Bugs class category\n *\n * columns example(fieldDefs) :\n * [\n *  {\n      filter: true,\n      type: 'text',\n      name: 'pyID',\n      label: 'ID',\n      id: '2',\n      category: [{ label: 'Profile' }],\n      sort: true\n    },\n    {\n      type: 'text',\n      name: 'pyLabel',\n      label: 'Name',\n      id: '3',\n      category: [{ label: 'Profile' }],\n      sort: true\n    }\n  ]\n *\n * getMenuItemsFromColumns(columns) returns :\n * [\n    {\n      id: 'ID',\n      primary: ID,\n      items: undefined,\n      selected: undefined\n    },\n    {\n      id: ‘Bugs Class’,\n      primary: ‘Bugs Class’,\n      selected: undefined,\n      items: [ {id: ‘Priority', primary: ‘Priority’, selected: true, items: undefined}]\n    }\n  ]\n*/\n\nfunction getMenuItemsFromColumns(columns, fieldProp, selectedField, defaultType = 'text') {\n  const items = [];\n  let categoryArr = [];\n\n  if (!columns) {\n    return items;\n  }\n  columns.forEach(column => {\n    const { field } = column;\n    const leafCategoryItem = {\n      id: field[fieldProp],\n      primary: field.label,\n      type: typeMap[field.type?.toLowerCase()] || typeMap[defaultType],\n      selected: field.id === selectedField\n    };\n\n    categoryArr = items;\n    if (field.category) {\n      categoryArr = prepareCategoryItems(field.category, categoryArr);\n    }\n    categoryArr.push(leafCategoryItem);\n  });\n\n  return items;\n}\nexport default getMenuItemsFromColumns;\n"]}

package/lib/Core/Components/Virtualise/Pagination.d.ts

@@ -0,0 +1,13 @@
+export default function getPaginationInfo(target: any, totalRecords: any, vi: any, isRefresh?: boolean, isInfiniteScroll?: boolean): {
+    existingItemBoundingBox: any;
+    currentRowIndex: number | undefined;
+    topRowIndex: number;
+    bufferOldCords: any;
+    bufferNewCords: any;
+    view: {
+        startIndex: number;
+        endIndex: number;
+    };
+};
+export const StickyGroupHeader: "sticky-group-header";
+//# sourceMappingURL=Pagination.d.ts.map

package/lib/Core/Components/Virtualise/Pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Virtualise/Pagination.js"],"names":[],"mappings":"AAuQA;;;;;;;;;;EAsBC;AA5RD,sDAAuD"}