@pallasoft/ps-table-components 1.19.0 → 1.21.0

package/dist/components/ps-data-table.js

@@ -10,6 +10,8 @@ const ps_motion_components_1 = require("@pallasoft/ps-motion-components");
 const react_virtual_1 = require("@tanstack/react-virtual");
 const table_config_1 = require("../constants/table-config");
 const use_ps_incremental_count_1 = require("../hooks/use-ps-incremental-count");
+const use_ps_scroll_anchor_1 = require("../hooks/use-ps-scroll-anchor");
+const use_ps_table_stream_status_1 = require("../hooks/use-ps-table-stream-status");
 const ps_table_cell_tooltip_service_1 = require("../services/ps-table-cell-tooltip-service");
 const ps_table_column_size_service_1 = require("../services/ps-table-column-size-service");
 const ps_table_group_service_1 = require("../services/ps-table-group-service");
@@ -67,27 +69,21 @@ const PsDataTable = ({ caption, className, columns, defaultSort, density = 'norm
     const hasToolbar = isSearchable || hasFilters || Boolean(toolbarActions);
     const isSelectable = Boolean(getBulkActions);
     const columnCount = visibleColumns.length + (isSelectable ? 1 : 0);
-    const deferredRows = (0, react_1.useDeferredValue)(rows);
-    const deferredFilters = (0, react_1.useDeferredValue)(filters);
     const deferredSearch = (0, react_1.useDeferredValue)(search);
-    const deferredSort = (0, react_1.useDeferredValue)(sort);
     const queriedRows = (0, react_1.useMemo)(() => isServerPaginated
-        ? deferredRows
-        : ps_table_query_service_1.PsTableQueryService.apply(deferredRows, columns, deferredFilters, deferredSearch, getSearchText, deferredSort), [
-        columns,
-        deferredFilters,
-        deferredRows,
-        deferredSearch,
-        deferredSort,
-        getSearchText,
-        isServerPaginated,
-    ]);
-    const currentPage = page !== null && page !== undefined ? page : uncontrolledPage;
-    const rowCount = isServerPaginated ? totalRows : queriedRows.length;
-    const pageCount = pageSize ? Math.max(Math.ceil(rowCount / pageSize), 1) : 1;
-    const safePage = Math.min(Math.max(currentPage, 1), pageCount);
+        ? rows
+        : ps_table_query_service_1.PsTableQueryService.apply(rows, columns, filters, deferredSearch, getSearchText, sort), [columns, filters, rows, deferredSearch, sort, getSearchText, isServerPaginated]);
+    const streamStatus = (0, use_ps_table_stream_status_1.usePsTableStreamStatus)();
     const isQueried = search.trim() !== '' ||
         Object.values(filters).some((value) => ps_table_query_service_1.PsTableQueryService.isActive(value));
+    const currentPage = page !== null && page !== undefined ? page : uncontrolledPage;
+    const loadedRowCount = isServerPaginated ? totalRows : queriedRows.length;
+    const rowCount = streamStatus !== null && !isServerPaginated && !isQueried
+        ? Math.max(streamStatus.total, loadedRowCount)
+        : loadedRowCount;
+    const pageCountOf = (count) => (pageSize ? Math.max(Math.ceil(count / pageSize), 1) : 1);
+    const pageCount = pageCountOf(rowCount);
+    const safePage = Math.min(Math.max(currentPage, 1), pageCountOf(loadedRowCount));
     const groups = (0, react_1.useMemo)(() => (grouping ? ps_table_group_service_1.PsTableGroupService.group(queriedRows, grouping.getGroupKey) : []), [grouping, queriedRows]);
     const initialExpandedCount = grouping && grouping.initialExpandedCount !== undefined ? grouping.initialExpandedCount : 1;
     const isGroupExpanded = (groupKey, groupIndex) => isQueried || groupIndex < initialExpandedCount !== toggledGroupKeys.includes(groupKey);
@@ -200,6 +196,8 @@ const PsDataTable = ({ caption, className, columns, defaultSort, density = 'norm
     });
     const virtualizer = scrollParent === null ? windowVirtualizer : elementVirtualizer;
     const virtualItems = shouldVirtualize ? virtualizer.getVirtualItems() : [];
+    const visibleRowIds = (0, react_1.useMemo)(() => (shouldVirtualize ? visibleRows.map((row) => getRowId(row)) : []), [getRowId, shouldVirtualize, visibleRows]);
+    (0, use_ps_scroll_anchor_1.usePsScrollAnchor)(virtualizer, visibleRowIds, shouldVirtualize && streamStatus !== null);
     const virtualTop = virtualItems.length > 0 ? virtualItems[0].start - scrollMargin : 0;
     const virtualBottom = virtualItems.length > 0
         ? virtualizer.getTotalSize() - (virtualItems[virtualItems.length - 1].end - scrollMargin)
@@ -277,6 +275,6 @@ const PsDataTable = ({ caption, className, columns, defaultSort, density = 'norm
                                                 ]
                                                 : visibleRows.map((row) => renderRow(row))] }), hasFooter ? ((0, jsx_runtime_1.jsx)("tfoot", { className: 'border-t-2 border-line bg-mist/50 text-sm font-semibold text-ink', children: (0, jsx_runtime_1.jsxs)("tr", { children: [isSelectable ? (0, jsx_runtime_1.jsx)("td", {}) : null, visibleColumns.map((column) => ((0, jsx_runtime_1.jsx)("td", { className: ps_design_system_1.PallasoftClassNameService.merge(densityClassNames[density].cell, alignClassNames[column.align !== null && column.align !== undefined
                                                     ? column.align
-                                                    : 'left'], 'whitespace-nowrap'), children: column.footer }, column.id)))] }) })) : null] }) }), pageSize && (!grouping || isServerPaginated) ? ((0, jsx_runtime_1.jsx)(ps_table_pagination_1.PsTablePagination, { onPageChange: changePage, page: safePage, pageCount: pageCount, pageSize: pageSize, totalRows: rowCount })) : null] })] }));
+                                                    : 'left'], 'whitespace-nowrap'), children: column.footer }, column.id)))] }) })) : null] }) }), pageSize && (!grouping || isServerPaginated) ? ((0, jsx_runtime_1.jsx)(ps_table_pagination_1.PsTablePagination, { loadedPageCount: pageCountOf(loadedRowCount), onPageChange: changePage, page: safePage, pageCount: pageCount, pageSize: pageSize, totalRows: rowCount })) : null] })] }));
 };
 exports.PsDataTable = PsDataTable;

package/dist/components/ps-table-pagination.d.ts

@@ -1,9 +1,10 @@
 export interface PsTablePaginationProps {
     className?: string;
+    loadedPageCount?: number;
     onPageChange: (page: number) => void;
     page: number;
     pageCount: number;
     pageSize: number;
     totalRows: number;
 }
-export declare const PsTablePagination: ({ className, onPageChange, page, pageCount, pageSize, totalRows, }: PsTablePaginationProps) => import("react").JSX.Element;
+export declare const PsTablePagination: ({ className, loadedPageCount, onPageChange, page, pageCount, pageSize, totalRows, }: PsTablePaginationProps) => import("react").JSX.Element;

package/dist/components/ps-table-pagination.js

@@ -3,10 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsTablePagination = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ps_design_system_1 = require("@pallasoft/ps-design-system");
-const PsTablePagination = ({ className, onPageChange, page, pageCount, pageSize, totalRows, }) => {
+const PsTablePagination = ({ className, loadedPageCount, onPageChange, page, pageCount, pageSize, totalRows, }) => {
     const firstRow = totalRows === 0 ? 0 : (page - 1) * pageSize + 1;
     const lastRow = Math.min(page * pageSize, totalRows);
     const buttonClassName = 'ps-focus-ring inline-flex min-h-9 items-center rounded-full border border-line px-3.5 text-sm font-semibold text-ink transition-colors disabled:cursor-not-allowed disabled:opacity-40 enabled:hover:border-primary/40';
-    return ((0, jsx_runtime_1.jsxs)("nav", { "aria-label": 'Pagination', className: ps_design_system_1.PallasoftClassNameService.merge('flex flex-wrap items-center justify-between gap-3 border-t border-line px-4 py-3', className), children: [(0, jsx_runtime_1.jsx)("p", { className: 'text-sm text-ink/55', children: totalRows === 0 ? 'No rows' : `${firstRow}–${lastRow} of ${totalRows}` }), (0, jsx_runtime_1.jsxs)("div", { className: 'flex items-center gap-2', children: [(0, jsx_runtime_1.jsx)("button", { className: buttonClassName, disabled: page <= 1, onClick: () => onPageChange(page - 1), type: 'button', children: "Previous" }), (0, jsx_runtime_1.jsxs)("span", { className: 'hidden text-sm text-ink/65 sm:inline', children: ["Page ", Math.min(page, pageCount), " of ", pageCount] }), (0, jsx_runtime_1.jsx)("button", { className: buttonClassName, disabled: page >= pageCount, onClick: () => onPageChange(page + 1), type: 'button', children: "Next" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("nav", { "aria-label": 'Pagination', className: ps_design_system_1.PallasoftClassNameService.merge('flex flex-wrap items-center justify-between gap-3 border-t border-line px-4 py-3', className), children: [(0, jsx_runtime_1.jsx)("p", { className: 'text-sm text-ink/55', children: totalRows === 0 ? 'No rows' : `${firstRow}–${lastRow} of ${totalRows}` }), (0, jsx_runtime_1.jsxs)("div", { className: 'flex items-center gap-2', children: [(0, jsx_runtime_1.jsx)("button", { className: buttonClassName, disabled: page <= 1, onClick: () => onPageChange(page - 1), type: 'button', children: "Previous" }), (0, jsx_runtime_1.jsxs)("span", { className: 'hidden text-sm text-ink/65 sm:inline', children: ["Page ", Math.min(page, pageCount), " of ", pageCount] }), (0, jsx_runtime_1.jsx)("button", { className: buttonClassName, disabled: page >=
+                            (loadedPageCount === undefined ? pageCount : Math.min(loadedPageCount, pageCount)), onClick: () => onPageChange(page + 1), type: 'button', children: "Next" })] })] }));
 };
 exports.PsTablePagination = PsTablePagination;

package/dist/esm/components/ps-data-table.js

@@ -7,6 +7,8 @@ import { PsCollapse } from '@pallasoft/ps-motion-components';
 import { useVirtualizer, useWindowVirtualizer } from '@tanstack/react-virtual';
 import { PsTableConfig } from '../constants/table-config';
 import { usePsIncrementalCount } from '../hooks/use-ps-incremental-count';
+import { usePsScrollAnchor } from '../hooks/use-ps-scroll-anchor';
+import { usePsTableStreamStatus } from '../hooks/use-ps-table-stream-status';
 import { PsTableCellTooltipService } from '../services/ps-table-cell-tooltip-service';
 import { PsTableColumnSizeService } from '../services/ps-table-column-size-service';
 import { PsTableGroupService } from '../services/ps-table-group-service';
@@ -64,27 +66,21 @@ export const PsDataTable = ({ caption, className, columns, defaultSort, density
     const hasToolbar = isSearchable || hasFilters || Boolean(toolbarActions);
     const isSelectable = Boolean(getBulkActions);
     const columnCount = visibleColumns.length + (isSelectable ? 1 : 0);
-    const deferredRows = useDeferredValue(rows);
-    const deferredFilters = useDeferredValue(filters);
     const deferredSearch = useDeferredValue(search);
-    const deferredSort = useDeferredValue(sort);
     const queriedRows = useMemo(() => isServerPaginated
-        ? deferredRows
-        : PsTableQueryService.apply(deferredRows, columns, deferredFilters, deferredSearch, getSearchText, deferredSort), [
-        columns,
-        deferredFilters,
-        deferredRows,
-        deferredSearch,
-        deferredSort,
-        getSearchText,
-        isServerPaginated,
-    ]);
-    const currentPage = page !== null && page !== undefined ? page : uncontrolledPage;
-    const rowCount = isServerPaginated ? totalRows : queriedRows.length;
-    const pageCount = pageSize ? Math.max(Math.ceil(rowCount / pageSize), 1) : 1;
-    const safePage = Math.min(Math.max(currentPage, 1), pageCount);
+        ? rows
+        : PsTableQueryService.apply(rows, columns, filters, deferredSearch, getSearchText, sort), [columns, filters, rows, deferredSearch, sort, getSearchText, isServerPaginated]);
+    const streamStatus = usePsTableStreamStatus();
     const isQueried = search.trim() !== '' ||
         Object.values(filters).some((value) => PsTableQueryService.isActive(value));
+    const currentPage = page !== null && page !== undefined ? page : uncontrolledPage;
+    const loadedRowCount = isServerPaginated ? totalRows : queriedRows.length;
+    const rowCount = streamStatus !== null && !isServerPaginated && !isQueried
+        ? Math.max(streamStatus.total, loadedRowCount)
+        : loadedRowCount;
+    const pageCountOf = (count) => (pageSize ? Math.max(Math.ceil(count / pageSize), 1) : 1);
+    const pageCount = pageCountOf(rowCount);
+    const safePage = Math.min(Math.max(currentPage, 1), pageCountOf(loadedRowCount));
     const groups = useMemo(() => (grouping ? PsTableGroupService.group(queriedRows, grouping.getGroupKey) : []), [grouping, queriedRows]);
     const initialExpandedCount = grouping && grouping.initialExpandedCount !== undefined ? grouping.initialExpandedCount : 1;
     const isGroupExpanded = (groupKey, groupIndex) => isQueried || groupIndex < initialExpandedCount !== toggledGroupKeys.includes(groupKey);
@@ -197,6 +193,8 @@ export const PsDataTable = ({ caption, className, columns, defaultSort, density
     });
     const virtualizer = scrollParent === null ? windowVirtualizer : elementVirtualizer;
     const virtualItems = shouldVirtualize ? virtualizer.getVirtualItems() : [];
+    const visibleRowIds = useMemo(() => (shouldVirtualize ? visibleRows.map((row) => getRowId(row)) : []), [getRowId, shouldVirtualize, visibleRows]);
+    usePsScrollAnchor(virtualizer, visibleRowIds, shouldVirtualize && streamStatus !== null);
     const virtualTop = virtualItems.length > 0 ? virtualItems[0].start - scrollMargin : 0;
     const virtualBottom = virtualItems.length > 0
         ? virtualizer.getTotalSize() - (virtualItems[virtualItems.length - 1].end - scrollMargin)
@@ -274,5 +272,5 @@ export const PsDataTable = ({ caption, className, columns, defaultSort, density
                                                 ]
                                                 : visibleRows.map((row) => renderRow(row))] }), hasFooter ? (_jsx("tfoot", { className: 'border-t-2 border-line bg-mist/50 text-sm font-semibold text-ink', children: _jsxs("tr", { children: [isSelectable ? _jsx("td", {}) : null, visibleColumns.map((column) => (_jsx("td", { className: PallasoftClassNameService.merge(densityClassNames[density].cell, alignClassNames[column.align !== null && column.align !== undefined
                                                     ? column.align
-                                                    : 'left'], 'whitespace-nowrap'), children: column.footer }, column.id)))] }) })) : null] }) }), pageSize && (!grouping || isServerPaginated) ? (_jsx(PsTablePagination, { onPageChange: changePage, page: safePage, pageCount: pageCount, pageSize: pageSize, totalRows: rowCount })) : null] })] }));
+                                                    : 'left'], 'whitespace-nowrap'), children: column.footer }, column.id)))] }) })) : null] }) }), pageSize && (!grouping || isServerPaginated) ? (_jsx(PsTablePagination, { loadedPageCount: pageCountOf(loadedRowCount), onPageChange: changePage, page: safePage, pageCount: pageCount, pageSize: pageSize, totalRows: rowCount })) : null] })] }));
 };

package/dist/esm/components/ps-table-pagination.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
-export const PsTablePagination = ({ className, onPageChange, page, pageCount, pageSize, totalRows, }) => {
+export const PsTablePagination = ({ className, loadedPageCount, onPageChange, page, pageCount, pageSize, totalRows, }) => {
     const firstRow = totalRows === 0 ? 0 : (page - 1) * pageSize + 1;
     const lastRow = Math.min(page * pageSize, totalRows);
     const buttonClassName = 'ps-focus-ring inline-flex min-h-9 items-center rounded-full border border-line px-3.5 text-sm font-semibold text-ink transition-colors disabled:cursor-not-allowed disabled:opacity-40 enabled:hover:border-primary/40';
-    return (_jsxs("nav", { "aria-label": 'Pagination', className: PallasoftClassNameService.merge('flex flex-wrap items-center justify-between gap-3 border-t border-line px-4 py-3', className), children: [_jsx("p", { className: 'text-sm text-ink/55', children: totalRows === 0 ? 'No rows' : `${firstRow}–${lastRow} of ${totalRows}` }), _jsxs("div", { className: 'flex items-center gap-2', children: [_jsx("button", { className: buttonClassName, disabled: page <= 1, onClick: () => onPageChange(page - 1), type: 'button', children: "Previous" }), _jsxs("span", { className: 'hidden text-sm text-ink/65 sm:inline', children: ["Page ", Math.min(page, pageCount), " of ", pageCount] }), _jsx("button", { className: buttonClassName, disabled: page >= pageCount, onClick: () => onPageChange(page + 1), type: 'button', children: "Next" })] })] }));
+    return (_jsxs("nav", { "aria-label": 'Pagination', className: PallasoftClassNameService.merge('flex flex-wrap items-center justify-between gap-3 border-t border-line px-4 py-3', className), children: [_jsx("p", { className: 'text-sm text-ink/55', children: totalRows === 0 ? 'No rows' : `${firstRow}–${lastRow} of ${totalRows}` }), _jsxs("div", { className: 'flex items-center gap-2', children: [_jsx("button", { className: buttonClassName, disabled: page <= 1, onClick: () => onPageChange(page - 1), type: 'button', children: "Previous" }), _jsxs("span", { className: 'hidden text-sm text-ink/65 sm:inline', children: ["Page ", Math.min(page, pageCount), " of ", pageCount] }), _jsx("button", { className: buttonClassName, disabled: page >=
+                            (loadedPageCount === undefined ? pageCount : Math.min(loadedPageCount, pageCount)), onClick: () => onPageChange(page + 1), type: 'button', children: "Next" })] })] }));
 };

package/dist/esm/hooks/use-ps-scroll-anchor.js

@@ -0,0 +1,26 @@
+import { useLayoutEffect, useRef } from 'react';
+import { PsTableScrollAnchorService } from '../services/ps-table-scroll-anchor-service';
+export const usePsScrollAnchor = (target, rowIds, isActive) => {
+    const anchor = useRef(null);
+    const previousRowIds = useRef(rowIds);
+    useLayoutEffect(() => {
+        const offset = target.scrollOffset;
+        if (!isActive || offset === null || offset <= 0) {
+            anchor.current = null;
+            previousRowIds.current = rowIds;
+            return;
+        }
+        const previous = anchor.current;
+        if (previous !== null && previousRowIds.current !== rowIds) {
+            const index = PsTableScrollAnchorService.movedTo(previous, previousRowIds.current, rowIds);
+            const start = index === null ? undefined : target.getOffsetForIndex(index, 'start');
+            previousRowIds.current = rowIds;
+            if (start !== undefined) {
+                target.scrollToOffset(PsTableScrollAnchorService.offset(start[0], previous));
+                return;
+            }
+        }
+        previousRowIds.current = rowIds;
+        anchor.current = PsTableScrollAnchorService.capture(target.getVirtualItems(), rowIds, offset);
+    });
+};

package/dist/esm/hooks/use-ps-table-page.js

@@ -0,0 +1,5 @@
+import { useState } from 'react';
+export const usePsTablePage = () => {
+    const [page, setPage] = useState(1);
+    return { onPageChange: setPage, page };
+};

package/dist/esm/index.js

@@ -31,3 +31,6 @@ export * from './services/ps-table-stream-service';
 export * from './components/ps-table-export-button';
 export * from './constants/ps-table-download-config';
 export * from './services/ps-table-download-service';
+export * from './services/ps-table-scroll-anchor-service';
+export * from './hooks/use-ps-table-page';
+export * from './interfaces/ps-table-page-state';

package/dist/esm/interfaces/ps-table-page-state.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/interfaces/table-scroll-anchor-target.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/interfaces/table-scroll-anchor.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/services/ps-table-scroll-anchor-service.js

@@ -0,0 +1,17 @@
+export class PsTableScrollAnchorService {
+    static capture(items, rowIds, scrollOffset) {
+        const item = items.find((candidate) => candidate.start >= scrollOffset);
+        const anchored = item === undefined ? items[0] : item;
+        if (anchored === undefined || rowIds[anchored.index] === undefined)
+            return null;
+        return { distance: anchored.start - scrollOffset, id: rowIds[anchored.index] };
+    }
+    static movedTo(anchor, previousRowIds, rowIds) {
+        const previousIndex = previousRowIds.indexOf(anchor.id);
+        const index = rowIds.indexOf(anchor.id);
+        return index < 0 || previousIndex < 0 || index === previousIndex ? null : index;
+    }
+    static offset(rowStart, anchor) {
+        return Math.max(rowStart - anchor.distance, 0);
+    }
+}

package/dist/hooks/use-ps-scroll-anchor.d.ts

@@ -0,0 +1,2 @@
+import type { PsTableScrollAnchorTarget } from '../interfaces/table-scroll-anchor-target';
+export declare const usePsScrollAnchor: (target: PsTableScrollAnchorTarget, rowIds: string[], isActive: boolean) => void;

package/dist/hooks/use-ps-scroll-anchor.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsScrollAnchor = void 0;
+const react_1 = require("react");
+const ps_table_scroll_anchor_service_1 = require("../services/ps-table-scroll-anchor-service");
+const usePsScrollAnchor = (target, rowIds, isActive) => {
+    const anchor = (0, react_1.useRef)(null);
+    const previousRowIds = (0, react_1.useRef)(rowIds);
+    (0, react_1.useLayoutEffect)(() => {
+        const offset = target.scrollOffset;
+        if (!isActive || offset === null || offset <= 0) {
+            anchor.current = null;
+            previousRowIds.current = rowIds;
+            return;
+        }
+        const previous = anchor.current;
+        if (previous !== null && previousRowIds.current !== rowIds) {
+            const index = ps_table_scroll_anchor_service_1.PsTableScrollAnchorService.movedTo(previous, previousRowIds.current, rowIds);
+            const start = index === null ? undefined : target.getOffsetForIndex(index, 'start');
+            previousRowIds.current = rowIds;
+            if (start !== undefined) {
+                target.scrollToOffset(ps_table_scroll_anchor_service_1.PsTableScrollAnchorService.offset(start[0], previous));
+                return;
+            }
+        }
+        previousRowIds.current = rowIds;
+        anchor.current = ps_table_scroll_anchor_service_1.PsTableScrollAnchorService.capture(target.getVirtualItems(), rowIds, offset);
+    });
+};
+exports.usePsScrollAnchor = usePsScrollAnchor;

package/dist/hooks/use-ps-table-page.d.ts

@@ -0,0 +1,2 @@
+import type { PsTablePageState } from '../interfaces/ps-table-page-state';
+export declare const usePsTablePage: () => PsTablePageState;

package/dist/hooks/use-ps-table-page.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsTablePage = void 0;
+const react_1 = require("react");
+const usePsTablePage = () => {
+    const [page, setPage] = (0, react_1.useState)(1);
+    return { onPageChange: setPage, page };
+};
+exports.usePsTablePage = usePsTablePage;

package/dist/index.d.ts

@@ -31,3 +31,6 @@ export * from './services/ps-table-stream-service';
 export * from './components/ps-table-export-button';
 export * from './constants/ps-table-download-config';
 export * from './services/ps-table-download-service';
+export * from './services/ps-table-scroll-anchor-service';
+export * from './hooks/use-ps-table-page';
+export * from './interfaces/ps-table-page-state';

package/dist/index.js

@@ -47,3 +47,6 @@ __exportStar(require("./services/ps-table-stream-service"), exports);
 __exportStar(require("./components/ps-table-export-button"), exports);
 __exportStar(require("./constants/ps-table-download-config"), exports);
 __exportStar(require("./services/ps-table-download-service"), exports);
+__exportStar(require("./services/ps-table-scroll-anchor-service"), exports);
+__exportStar(require("./hooks/use-ps-table-page"), exports);
+__exportStar(require("./interfaces/ps-table-page-state"), exports);

package/dist/interfaces/ps-table-page-state.d.ts

@@ -0,0 +1,4 @@
+export interface PsTablePageState {
+    onPageChange: (page: number) => void;
+    page: number;
+}

package/dist/interfaces/ps-table-page-state.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/interfaces/table-scroll-anchor-target.d.ts

@@ -0,0 +1,10 @@
+export interface PsTableScrollAnchorItem {
+    index: number;
+    start: number;
+}
+export interface PsTableScrollAnchorTarget {
+    getOffsetForIndex: (index: number, align: 'start') => readonly [number, string] | undefined;
+    getVirtualItems: () => PsTableScrollAnchorItem[];
+    scrollOffset: number | null;
+    scrollToOffset: (offset: number) => void;
+}

package/dist/interfaces/table-scroll-anchor-target.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/interfaces/table-scroll-anchor.d.ts

@@ -0,0 +1,4 @@
+export interface PsTableScrollAnchor {
+    distance: number;
+    id: string;
+}

package/dist/interfaces/table-scroll-anchor.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/services/ps-table-scroll-anchor-service.d.ts

@@ -0,0 +1,7 @@
+import type { PsTableScrollAnchor } from '../interfaces/table-scroll-anchor';
+import type { PsTableScrollAnchorItem } from '../interfaces/table-scroll-anchor-target';
+export declare class PsTableScrollAnchorService {
+    static capture(items: PsTableScrollAnchorItem[], rowIds: string[], scrollOffset: number): PsTableScrollAnchor | null;
+    static movedTo(anchor: PsTableScrollAnchor, previousRowIds: string[], rowIds: string[]): number | null;
+    static offset(rowStart: number, anchor: PsTableScrollAnchor): number;
+}

package/dist/services/ps-table-scroll-anchor-service.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsTableScrollAnchorService = void 0;
+class PsTableScrollAnchorService {
+    static capture(items, rowIds, scrollOffset) {
+        const item = items.find((candidate) => candidate.start >= scrollOffset);
+        const anchored = item === undefined ? items[0] : item;
+        if (anchored === undefined || rowIds[anchored.index] === undefined)
+            return null;
+        return { distance: anchored.start - scrollOffset, id: rowIds[anchored.index] };
+    }
+    static movedTo(anchor, previousRowIds, rowIds) {
+        const previousIndex = previousRowIds.indexOf(anchor.id);
+        const index = rowIds.indexOf(anchor.id);
+        return index < 0 || previousIndex < 0 || index === previousIndex ? null : index;
+    }
+    static offset(rowStart, anchor) {
+        return Math.max(rowStart - anchor.distance, 0);
+    }
+}
+exports.PsTableScrollAnchorService = PsTableScrollAnchorService;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallasoft/ps-table-components",
-	"version": "1.19.0",
+	"version": "1.21.0",
 	"private": false,
 	"main": "./dist/index.js",
 	"module": "./dist/esm/index.js",
@@ -55,6 +55,7 @@
 		"eslint-plugin-import": "^2.32.0",
 		"eslint-plugin-prettier": "^5.5.4",
 		"husky": "^9.1.7",
+		"jsdom": "^30.1.1",
 		"lint-staged": "^16.2.7",
 		"prettier": "^3.6.2",
 		"react": "^19.3.0",