@snack-uikit/table 0.36.8 → 0.36.9

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.36.9 (2025-06-16)
+
+
+### Bug Fixes
+
+* **FF-0000:** rowSelection.onChange callback ([e5f537d](https://github.com/cloud-ru-tech/snack-uikit/commit/e5f537d8dcc26cda4bde8afd59b4ef334006f4af))
+
+
+
+
+
 ## 0.36.8 (2025-06-16)
 
 ### Only dependencies have been changed

package/dist/cjs/components/Table/Table.js

@@ -224,7 +224,13 @@ function Table(_a) {
     globalFilterFn: enableFuzzySearch ? utils_2.fuzzyFilter : 'includesString',
     onGlobalFilterChange,
     getRowId,
-    onRowSelectionChange,
+    onRowSelectionChange: updater => {
+      if (typeof updater === 'function') {
+        onRowSelectionChange(updater(rowSelection));
+      } else {
+        onRowSelectionChange(updater);
+      }
+    },
     enableGrouping: true,
     enableRowSelection,
     enableMultiRowSelection: rowSelectionProp === null || rowSelectionProp === void 0 ? void 0 : rowSelectionProp.multiRow,

package/dist/cjs/components/Table/hooks/useStateControl.js

@@ -4,14 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useStateControl = useStateControl;
-const react_1 = require("react");
 const uncontrollable_1 = require("uncontrollable");
 function useStateControl(control, defaultState) {
   var _a, _b;
-  const state = control === null || control === void 0 ? void 0 : control.state;
-  const onChange = control === null || control === void 0 ? void 0 : control.onChange;
-  return (0, uncontrollable_1.useUncontrolledProp)(control === null || control === void 0 ? void 0 : control.state, (_b = (_a = control === null || control === void 0 ? void 0 : control.state) !== null && _a !== void 0 ? _a : control === null || control === void 0 ? void 0 : control.initialState) !== null && _b !== void 0 ? _b : defaultState, (0, react_1.useCallback)(controlState => {
-    const newState = typeof controlState === 'function' ? controlState(state || defaultState) : controlState;
-    onChange === null || onChange === void 0 ? void 0 : onChange(newState);
-  }, [state, defaultState, onChange]));
+  return (0, uncontrollable_1.useUncontrolledProp)(control === null || control === void 0 ? void 0 : control.state, (_b = (_a = control === null || control === void 0 ? void 0 : control.state) !== null && _a !== void 0 ? _a : control === null || control === void 0 ? void 0 : control.initialState) !== null && _b !== void 0 ? _b : defaultState, control === null || control === void 0 ? void 0 : control.onChange);
 }

package/dist/cjs/helperComponents/Cells/SelectionCell/SelectionCell.js

@@ -69,7 +69,11 @@ function getSelectionCellColumnDef(enableSelectPinned) {
           } = table.getRowModel();
           const rowsToToggle = getRowsToToggle(rows, row.id, rows.map(r => r.id).includes(previousClickedRowId) ? previousClickedRowId : '');
           const isSelected = !((_b = rowsById[row.id]) === null || _b === void 0 ? void 0 : _b.getIsSelected()) || false;
-          rowsToToggle.forEach(row => row.toggleSelected(isSelected));
+          const newSelected = rowsToToggle.reduce((acc, row) => {
+            acc[row.index] = isSelected;
+            return acc;
+          }, {});
+          table.setRowSelection(oldState => Object.assign(Object.assign({}, oldState), newSelected));
         } else {
           row.toggleSelected(!checked);
         }

package/dist/esm/components/Table/Table.js

@@ -138,7 +138,14 @@ export function Table(_a) {
         globalFilterFn: enableFuzzySearch ? fuzzyFilter : 'includesString',
         onGlobalFilterChange,
         getRowId,
-        onRowSelectionChange,
+        onRowSelectionChange: updater => {
+            if (typeof updater === 'function') {
+                onRowSelectionChange(updater(rowSelection));
+            }
+            else {
+                onRowSelectionChange(updater);
+            }
+        },
         enableGrouping: true,
         enableRowSelection,
         enableMultiRowSelection: rowSelectionProp === null || rowSelectionProp === void 0 ? void 0 : rowSelectionProp.multiRow,

package/dist/esm/components/Table/hooks/useStateControl.js

@@ -1,11 +1,5 @@
-import { useCallback } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
 export function useStateControl(control, defaultState) {
     var _a, _b;
-    const state = control === null || control === void 0 ? void 0 : control.state;
-    const onChange = control === null || control === void 0 ? void 0 : control.onChange;
-    return useUncontrolledProp(control === null || control === void 0 ? void 0 : control.state, (_b = (_a = control === null || control === void 0 ? void 0 : control.state) !== null && _a !== void 0 ? _a : control === null || control === void 0 ? void 0 : control.initialState) !== null && _b !== void 0 ? _b : defaultState, useCallback((controlState) => {
-        const newState = typeof controlState === 'function' ? controlState(state || defaultState) : controlState;
-        onChange === null || onChange === void 0 ? void 0 : onChange(newState);
-    }, [state, defaultState, onChange]));
+    return useUncontrolledProp(control === null || control === void 0 ? void 0 : control.state, (_b = (_a = control === null || control === void 0 ? void 0 : control.state) !== null && _a !== void 0 ? _a : control === null || control === void 0 ? void 0 : control.initialState) !== null && _b !== void 0 ? _b : defaultState, control === null || control === void 0 ? void 0 : control.onChange);
 }

package/dist/esm/helperComponents/Cells/SelectionCell/SelectionCell.js

@@ -50,7 +50,11 @@ export function getSelectionCellColumnDef(enableSelectPinned) {
                     const { rows, rowsById } = table.getRowModel();
                     const rowsToToggle = getRowsToToggle(rows, row.id, rows.map(r => r.id).includes(previousClickedRowId) ? previousClickedRowId : '');
                     const isSelected = !((_b = rowsById[row.id]) === null || _b === void 0 ? void 0 : _b.getIsSelected()) || false;
-                    rowsToToggle.forEach(row => row.toggleSelected(isSelected));
+                    const newSelected = rowsToToggle.reduce((acc, row) => {
+                        acc[row.index] = isSelected;
+                        return acc;
+                    }, {});
+                    table.setRowSelection(oldState => (Object.assign(Object.assign({}, oldState), newSelected)));
                 }
                 else {
                     row.toggleSelected(!checked);

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Table",
-  "version": "0.36.8",
+  "version": "0.36.9",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -66,5 +66,5 @@
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "32ca67614118aeb02c9e69b8d4491f76cf5fe282"
+  "gitHead": "4898ffc6db1c53aa9998f54b1e41741b80cb01cd"
 }

package/src/components/Table/Table.tsx

@@ -257,7 +257,13 @@ export function Table<TData extends object, TFilters extends FiltersState = Reco
     onGlobalFilterChange,
 
     getRowId,
-    onRowSelectionChange,
+    onRowSelectionChange: updater => {
+      if (typeof updater === 'function') {
+        onRowSelectionChange(updater(rowSelection));
+      } else {
+        onRowSelectionChange(updater);
+      }
+    },
     enableGrouping: true,
     enableRowSelection,
     enableMultiRowSelection: rowSelectionProp?.multiRow,

package/src/components/Table/hooks/useStateControl.ts

@@ -1,23 +1,12 @@
-import { useCallback } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
 
 export function useStateControl<TState>(
   control: { initialState?: TState; state?: TState; onChange?(state: TState): void } | undefined,
   defaultState: TState,
 ) {
-  const state = control?.state;
-  const onChange = control?.onChange;
-
   return useUncontrolledProp<TState>(
     control?.state,
     control?.state ?? control?.initialState ?? defaultState,
-    useCallback(
-      (controlState: TState) => {
-        const newState = typeof controlState === 'function' ? controlState(state || defaultState) : controlState;
-
-        onChange?.(newState);
-      },
-      [state, defaultState, onChange],
-    ),
+    control?.onChange,
   );
 }

package/src/helperComponents/Cells/SelectionCell/SelectionCell.tsx

@@ -72,7 +72,16 @@ export function getSelectionCellColumnDef<TData>(enableSelectPinned: boolean): C
             rows.map(r => r.id).includes(previousClickedRowId) ? previousClickedRowId : '',
           );
           const isSelected = !rowsById[row.id]?.getIsSelected() || false;
-          rowsToToggle.forEach(row => row.toggleSelected(isSelected));
+
+          const newSelected = rowsToToggle.reduce<Record<string, boolean>>((acc, row) => {
+            acc[row.index] = isSelected;
+            return acc;
+          }, {});
+
+          table.setRowSelection(oldState => ({
+            ...oldState,
+            ...newSelected,
+          }));
         } else {
           row.toggleSelected(!checked);
         }