pixelize-design-library 2.3.1-beta.6 → 2.3.1-beta.8

package/dist/Components/Table/Table.js

@@ -43,6 +43,15 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -139,22 +148,26 @@ function Table(_a) {
     (0, react_1.useEffect)(function () {
         if (!groupLoadMore)
             return;
-        if (pendingLoadMoreRef.current) {
-            pendingLoadMoreRef.current = false;
-            setAccumulatedRows(function (prev) {
-                var seen = new Set(prev.map(function (r) { return r.id; }));
-                var merged = prev.slice();
-                for (var _i = 0, tableData_1 = tableData; _i < tableData_1.length; _i++) {
-                    var r = tableData_1[_i];
-                    if (!seen.has(r.id))
-                        merged.push(r);
-                }
-                return merged;
-            });
-        }
-        else {
-            setAccumulatedRows(tableData);
-        }
+        setAccumulatedRows(function (prev) {
+            if (prev.length === 0)
+                return tableData.slice();
+            var accIds = new Set(prev.map(function (r) { return r.id; }));
+            if (pendingLoadMoreRef.current) {
+                // A "Load more" is in flight. The parent may re-emit the SAME page (new
+                // array reference) on intermediate re-renders before the next page arrives,
+                // so only append + consume the flag once genuinely new rows show up.
+                var newRows = tableData.filter(function (r) { return !accIds.has(r.id); });
+                if (newRows.length === 0)
+                    return prev; // same page re-emitted — keep waiting
+                pendingLoadMoreRef.current = false;
+                return __spreadArray(__spreadArray([], prev, true), newRows, true);
+            }
+            // Not a load-more: a re-emit of already-loaded rows keeps the accumulation
+            // (the parent re-renders the current page often). Genuinely new rows
+            // (search / filter / sort / page-size / reload) reset it.
+            var allKnown = tableData.length > 0 && tableData.every(function (r) { return accIds.has(r.id); });
+            return allKnown ? prev : tableData.slice();
+        });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [tableData, groupLoadMore]);
     (0, react_1.useEffect)(function () {
@@ -171,9 +184,11 @@ function Table(_a) {
         setDensityState(d);
         savePreferences === null || savePreferences === void 0 ? void 0 : savePreferences(__assign(__assign({}, tablePreferences), { columns: columnsList, groupBy: groupByState !== null && groupByState !== void 0 ? groupByState : null, density: d }));
     };
-    var handleGroupByChange = function (value) {
-        setGroupByState(value);
-        savePreferences === null || savePreferences === void 0 ? void 0 : savePreferences(__assign(__assign({}, tablePreferences), { columns: columnsList, density: densityState, groupBy: value !== null && value !== void 0 ? value : null }));
+    // Settings "Save": persist columns + group (+ current density) in ONE write so
+    // they don't clobber each other, and apply them locally.
+    var handleSettingsSave = function (cols, group) {
+        setGroupByState(group);
+        handleColumnPreferences(cols, { density: densityState, groupBy: group !== null && group !== void 0 ? group : null });
     };
     var _filteredData = (0, react_1.useMemo)(function () {
         return (0, table_1.searchAndSortData)(filteredData, columnsSearch);
@@ -359,7 +374,7 @@ function Table(_a) {
                     react_1.default.createElement(TableSearch_1.default, { onSearch: onGlobalSearch }),
                     isTableSettings && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(Divider_1.default, null),
-                        react_1.default.createElement(TableSettings_1.default, { columns: columnsList, onSave: function (cols) { return handleColumnPreferences(cols); }, tableSettings: tableSettings, density: densityState, onDensityChange: handleDensityChange, groupBy: groupByState, onGroupByChange: handleGroupByChange }))),
+                        react_1.default.createElement(TableSettings_1.default, { columns: columnsList, onSave: function (cols, group) { return handleSettingsSave(cols, group); }, tableSettings: tableSettings, density: densityState, onDensityChange: handleDensityChange, groupBy: groupByState }))),
                     headerActions && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(Divider_1.default, null),
                         react_1.default.createElement(HeaderActions_1.default, { actions: headerActions, selections: selection }))),

package/dist/Components/Table/hooks/useTable.d.ts

@@ -41,7 +41,7 @@ declare const useTable: ({ tableBorderColor, data, isPagination, selections, onS
     rowsPerPage: number;
     setCurrentPage: import("react").Dispatch<import("react").SetStateAction<number>>;
     columnsList: TableHeaderProps[];
-    handleColumnPreferences: (columns: any) => void;
+    handleColumnPreferences: (columns: any, extra?: Record<string, any>) => void;
     isSelecting: boolean;
 };
 export default useTable;

package/dist/Components/Table/hooks/useTable.js

@@ -187,10 +187,11 @@ var useTable = function (_a) {
             (_a = onSelectionRef.current) === null || _a === void 0 ? void 0 : _a.call(onSelectionRef, selectedItems);
         }
     }, [tableData]);
-    var handleColumnPreferences = function (columns) {
+    var handleColumnPreferences = function (columns, extra) {
+        if (extra === void 0) { extra = {}; }
         setColumnsList(columns);
         savePreferences &&
-            savePreferences(__assign(__assign({}, tablePreferences), { columns: columns }));
+            savePreferences(__assign(__assign(__assign({}, tablePreferences), { columns: columns }), extra));
     };
     return {
         tableData: tableData,

package/dist/Components/Table/settings/TableSettings.d.ts

@@ -1,12 +1,11 @@
 import React from "react";
 import { TableDensity, TableProps } from "../TableProps";
-declare const TableSettings: ({ columns, onSave, density, onDensityChange, groupBy, onGroupByChange, }: {
+declare const TableSettings: ({ columns, onSave, density, onDensityChange, groupBy, }: {
     columns: TableProps["columns"];
-    onSave: (updatedColumns: TableProps["columns"]) => void;
+    onSave: (updatedColumns: TableProps["columns"], groupBy: string | number | undefined) => void;
     tableSettings?: TableProps["tableSettings"];
     density?: TableDensity;
     onDensityChange?: (d: TableDensity) => void;
     groupBy?: string | number;
-    onGroupByChange?: (value: string | number | undefined) => void;
 }) => React.JSX.Element;
 export default TableSettings;

package/dist/Components/Table/settings/TableSettings.js

@@ -71,7 +71,7 @@ var DENSITY_OPTIONS = [
 ];
 var TableSettings = function (_a) {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-    var columns = _a.columns, onSave = _a.onSave, _p = _a.density, density = _p === void 0 ? "normal" : _p, onDensityChange = _a.onDensityChange, groupBy = _a.groupBy, onGroupByChange = _a.onGroupByChange;
+    var columns = _a.columns, onSave = _a.onSave, _p = _a.density, density = _p === void 0 ? "normal" : _p, onDensityChange = _a.onDensityChange, groupBy = _a.groupBy;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     var childInputMethodsRef = (0, react_2.useRef)({});
     var _q = (0, react_2.useState)(false), settingsOpen = _q[0], setSettingsOpen = _q[1];
@@ -80,10 +80,9 @@ var TableSettings = function (_a) {
     // Group selection is applied on Save (not live), per "click Apply to group".
     var _t = (0, react_2.useState)(groupBy), selectedGroup = _t[0], setSelectedGroup = _t[1];
     var handleSave = (0, react_2.useCallback)(function () {
-        onSave(items);
-        onGroupByChange === null || onGroupByChange === void 0 ? void 0 : onGroupByChange(selectedGroup);
+        onSave(items, selectedGroup);
         setSettingsOpen(false);
-    }, [onSave, items, onGroupByChange, selectedGroup]);
+    }, [onSave, items, selectedGroup]);
     var handleOpen = (0, react_2.useCallback)(function () {
         setItems(columns);
         setSelectedGroup(groupBy);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.3.1-beta.6",
+  "version": "2.3.1-beta.8",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",