@monolith-forensics/monolith-ui 1.4.0 → 1.4.2

package/dist/Table/TableProvider.js

@@ -17,10 +17,28 @@ import TableDefaults from "./TableDefaults";
 import shortUUID from "short-uuid";
 import { SelectionStatus } from "./enums";
 import moment from "moment";
+import { useControlled } from "../Utilities";
+const calculateSelectionTotal = (selectionState, totalRecords, dataLength = 0) => {
+    if (!selectionState) {
+        return 0;
+    }
+    switch (selectionState.selectionStatus) {
+        case SelectionStatus.All:
+            return totalRecords || dataLength;
+        case SelectionStatus.SomeIncluded:
+            return selectionState.selectedRowKeys.length;
+        case SelectionStatus.SomeExcluded:
+            return totalRecords
+                ? totalRecords - selectionState.excludedRowKeys.length
+                : dataLength - selectionState.excludedRowKeys.length;
+        default:
+            return 0;
+    }
+};
 export const TableContext = createContext(null);
 const TableProvider = (_a) => {
-    var { children, columns, tableInstanceRef, stateStorage, height, maxHeight, minHeight, focusedRowId } = _a, props = __rest(_a, ["children", "columns", "tableInstanceRef", "stateStorage", "height", "maxHeight", "minHeight", "focusedRowId"]);
-    const _columns = columns
+    var { children, columns, data, keyField, tableInstanceRef, stateStorage, tableMenuOptions, manualSorting, manualFiltering, manualSearch, height, maxHeight, minHeight, focusedRowId, enableColumnResize, enableSorting, compact, totalRecords, onColumnStateChange, onColumnReorder, onColumnHeaderClick, onSort, onRowUpdated, tableElement, headerRowElm, tableDimensions, targetElm, listElm, defaultSelectionState, selectionState, onSelectionChange, defaultFilterState, filterState, onFilterChange } = _a, props = __rest(_a, ["children", "columns", "data", "keyField", "tableInstanceRef", "stateStorage", "tableMenuOptions", "manualSorting", "manualFiltering", "manualSearch", "height", "maxHeight", "minHeight", "focusedRowId", "enableColumnResize", "enableSorting", "compact", "totalRecords", "onColumnStateChange", "onColumnReorder", "onColumnHeaderClick", "onSort", "onRowUpdated", "tableElement", "headerRowElm", "tableDimensions", "targetElm", "listElm", "defaultSelectionState", "selectionState", "onSelectionChange", "defaultFilterState", "filterState", "onFilterChange"]);
+    const _columns = useMemo(() => columns
         .map((child, index) => {
         if (child.dataField === "__key") {
             throw new Error("dataField cannot be __key");
@@ -34,36 +52,47 @@ const TableProvider = (_a) => {
                 ? child.width < TableDefaults.td.minWidth
                     ? child.width
                     : TableDefaults.td.minWidth
-                : TableDefaults.td.minWidth, columnId: shortUUID.generate(), enableResize: resolveColumnResize(child, props.enableColumnResize) });
+                : TableDefaults.td.minWidth, columnId: shortUUID.generate(), enableResize: resolveColumnResize(child, enableColumnResize) });
     })
-        .sort((a, b) => a.orderValue - b.orderValue);
+        .sort((a, b) => a.orderValue - b.orderValue), [columns, enableColumnResize]);
     const savedTableState = useMemo(() => {
         return (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled)
             ? StateStorage.getTableState(stateStorage.key)
             : undefined;
     }, [stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.key]);
     const { columnState: savedColumnState, selectionState: savedSelectionState, sortState: savedSortState, searchState: savedSearchState, filterState: savedFilterState, } = savedTableState || {};
-    const [compactState, setCompactState] = useState(props.compact || false);
+    const [compactState, setCompactState] = useState(compact || false);
     const [columnState, setColumnState] = useState(syncColumnState(_columns, savedColumnState));
     const [search, setSearch] = useState(savedSearchState || "");
-    const [filterState, setFilterState] = useState(savedFilterState);
+    const [_filterState, _setFilterState] = useControlled(filterState, defaultFilterState ||
+        savedFilterState || {
+        combinator: "and",
+        rules: [],
+    });
     const [sortState, setSortState] = useState(savedSortState);
-    const [selectionStatus, setSelectionStatus] = useState((savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.selectionStatus) || SelectionStatus.None);
-    const [excludedRowKeys, setExcludedRowKeys] = useState((savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.excludedRowKeys) || []);
-    const [selectedRowKeys, setSelectedRowKeys] = useState((savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.selectedRowKeys) || []);
-    const calculateSelectionTotal = (selectionState, totalRecords, dataLength = 0) => {
-        switch (selectionState.selectionStatus) {
-            case SelectionStatus.All:
-                return totalRecords || dataLength;
-            case SelectionStatus.SomeIncluded:
-                return selectionState.selectedRowKeys.length;
-            case SelectionStatus.SomeExcluded:
-                return totalRecords
-                    ? totalRecords - selectionState.excludedRowKeys.length
-                    : dataLength - selectionState.excludedRowKeys.length;
-            default:
-                return 0;
-        }
+    const [_selectionState, _setSelectionState] = useControlled(selectionState, defaultSelectionState || {
+        selectedRowKeys: (savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.selectedRowKeys) || [],
+        excludedRowKeys: (savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.excludedRowKeys) || [],
+        selectionStatus: (savedSelectionState === null || savedSelectionState === void 0 ? void 0 : savedSelectionState.selectionStatus) || SelectionStatus.None,
+        totalSelected: calculateSelectionTotal(savedSelectionState, totalRecords, data.length),
+    });
+    const selectionStatus = _selectionState.selectionStatus;
+    const excludedRowKeys = _selectionState.excludedRowKeys;
+    const selectedRowKeys = _selectionState.selectedRowKeys;
+    const setSelectionStatus = (selectionStatus) => {
+        _setSelectionState((prev) => {
+            return Object.assign(Object.assign({}, prev), { selectionStatus });
+        });
+    };
+    const setExcludedRowKeys = (excludedRowKeys) => {
+        _setSelectionState((prev) => {
+            return Object.assign(Object.assign({}, prev), { excludedRowKeys });
+        });
+    };
+    const setSelectedRowKeys = (selectedRowKeys) => {
+        _setSelectionState((prev) => {
+            return Object.assign(Object.assign({}, prev), { selectedRowKeys });
+        });
     };
     const getCalculatedSelectionTotal = () => {
         return calculateSelectionTotal({
@@ -71,15 +100,14 @@ const TableProvider = (_a) => {
             excludedRowKeys,
             selectionStatus,
             totalSelected: 0,
-        }, props === null || props === void 0 ? void 0 : props.totalRecords, props.data.length);
+        }, totalRecords, data.length);
     };
     const getColumnState = (dataField) => {
         return columnState.find((col) => col.dataField === dataField);
     };
     const updateColumnState = (columnState) => {
-        var _a;
         setColumnState(columnState);
-        (_a = props.onColumnStateChange) === null || _a === void 0 ? void 0 : _a.call(props, columnState);
+        onColumnStateChange === null || onColumnStateChange === void 0 ? void 0 : onColumnStateChange(columnState);
         if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
             if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
                 StateStorage.setColumnState(stateStorage.key, columnState);
@@ -87,7 +115,7 @@ const TableProvider = (_a) => {
         }
     };
     const handleColumnReorder = (dragColumn, dropColumn) => {
-        var _a, _b, _c;
+        var _a, _b;
         if (!dragColumn || !dropColumn)
             return;
         const dropColumnOrder = (_a = columnState.find((col) => col.dataField === dropColumn.dataField)) === null || _a === void 0 ? void 0 : _a.orderValue;
@@ -110,14 +138,13 @@ const TableProvider = (_a) => {
         })
             .sort((a, b) => a.orderValue - b.orderValue);
         updateColumnState(newColumnState);
-        (_c = props.onColumnReorder) === null || _c === void 0 ? void 0 : _c.call(props, {
+        onColumnReorder === null || onColumnReorder === void 0 ? void 0 : onColumnReorder({
             columnState: newColumnState,
             column: dragColumn,
         });
     };
     const handleColumnHeaderClick = (column) => {
-        var _a, _b;
-        if (props.enableSorting === true || column.enableSorting === true) {
+        if (enableSorting === true || column.enableSorting === true) {
             let newSortState = {
                 dataField: column.dataField,
                 dir: "asc",
@@ -132,16 +159,17 @@ const TableProvider = (_a) => {
                     }
                 }
             }
-            (_a = props.onColumnHeaderClick) === null || _a === void 0 ? void 0 : _a.call(props, { column, sort: newSortState });
+            onColumnHeaderClick === null || onColumnHeaderClick === void 0 ? void 0 : onColumnHeaderClick({ column, sort: newSortState });
             updateSortState(newSortState);
         }
         else {
-            (_b = props.onColumnHeaderClick) === null || _b === void 0 ? void 0 : _b.call(props, { column, sort: undefined });
+            onColumnHeaderClick === null || onColumnHeaderClick === void 0 ? void 0 : onColumnHeaderClick({ column, sort: undefined });
             updateSortState(undefined);
         }
     };
     const handleFilterChange = (query) => {
-        setFilterState(query);
+        _setFilterState(query);
+        onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange(query);
         if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
             if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
                 StateStorage.setFilterState(stateStorage.key, query);
@@ -149,9 +177,9 @@ const TableProvider = (_a) => {
         }
     };
     const updateSearchState = (searchState) => {
-        var _a, _b, _c;
+        var _a, _b;
         setSearch(searchState);
-        (_c = (_b = (_a = props.tableMenuOptions) === null || _a === void 0 ? void 0 : _a.searchOptions) === null || _b === void 0 ? void 0 : _b.onSearch) === null || _c === void 0 ? void 0 : _c.call(_b, searchState);
+        (_b = (_a = tableMenuOptions === null || tableMenuOptions === void 0 ? void 0 : tableMenuOptions.searchOptions) === null || _a === void 0 ? void 0 : _a.onSearch) === null || _b === void 0 ? void 0 : _b.call(_a, searchState);
         if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
             if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
                 StateStorage.setSearchState(stateStorage.key, searchState);
@@ -165,10 +193,10 @@ const TableProvider = (_a) => {
         updateSearchState("");
     };
     const updateSortState = (sortState) => {
-        var _a, _b;
+        var _a;
         setSortState(sortState);
-        (_a = props.onSort) === null || _a === void 0 ? void 0 : _a.call(props, {
-            column: (_b = columnState.find((col) => col.dataField === (sortState === null || sortState === void 0 ? void 0 : sortState.dataField))) !== null && _b !== void 0 ? _b : {},
+        onSort === null || onSort === void 0 ? void 0 : onSort({
+            column: (_a = columnState.find((col) => col.dataField === (sortState === null || sortState === void 0 ? void 0 : sortState.dataField))) !== null && _a !== void 0 ? _a : {},
             sort: sortState,
         });
         if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
@@ -179,7 +207,7 @@ const TableProvider = (_a) => {
     };
     const sortData = (sortState) => {
         // sort data
-        return props.data.sort((a, b) => {
+        return data.sort((a, b) => {
             if (sortState) {
                 if (sortState.dir === "asc") {
                     if (a[sortState.dataField] < b[sortState.dataField]) {
@@ -212,7 +240,7 @@ const TableProvider = (_a) => {
     };
     const searchData = (searchText) => {
         const columnKeys = columnState.map((col) => col.dataField);
-        return props.data.filter((row) => {
+        return data.filter((row) => {
             return columnKeys.some((key) => {
                 if (typeof row[key] === "string") {
                     return row[key].toLowerCase().includes(searchText.toLowerCase());
@@ -221,157 +249,114 @@ const TableProvider = (_a) => {
             });
         });
     };
+    const rowMatchesRule = (row, rule) => {
+        var _a, _b, _c, _d;
+        const column = columnState.find((col) => col.dataField === rule.dataField);
+        const { value, operator, dataField } = rule;
+        if (operator.value === "isEmpty") {
+            return !row[dataField];
+        }
+        if (operator.value === "isNotEmpty") {
+            return !!row[dataField];
+        }
+        if (!value || value.length === 0) {
+            return true;
+        }
+        switch (operator.value) {
+            case "=":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isSame(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isSame(moment(value[0]));
+                }
+                return row[dataField] == value[0];
+            case "!=":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return !moment(row[dataField]).isSame(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return !moment(row[dataField]).isSame(moment(value[0]));
+                }
+                return row[dataField] != value[0];
+            case ">":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isAfter(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isAfter(moment(value[0]));
+                }
+                return row[dataField] > value[0];
+            case "<":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isBefore(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isBefore(moment(value[0]));
+                }
+                return row[dataField] < value[0];
+            case ">=":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isSameOrAfter(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isSameOrAfter(moment(value[0]));
+                }
+                return row[dataField] >= value[0];
+            case "<=":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isSameOrBefore(moment(value[0]), "day");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isSameOrBefore(moment(value[0]));
+                }
+                return row[dataField] <= value[0];
+            case "between":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), "day", "[]");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), undefined, "[]");
+                }
+                return (row[dataField] >= value[0] &&
+                    row[dataField] <= value[1]);
+            case "notBetween":
+                if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
+                    return !moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), "day", "[]");
+                }
+                else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
+                    return !moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), undefined, "[]");
+                }
+                return (row[dataField] < value[0] ||
+                    row[dataField] > value[1]);
+            case "contains":
+                return (_a = row[dataField]) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes((_b = value[0]) === null || _b === void 0 ? void 0 : _b.toString().toLowerCase());
+            case "doesNotContain":
+                return !((_c = row[dataField]) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes((_d = value[0]) === null || _d === void 0 ? void 0 : _d.toString().toLowerCase()));
+            case "in":
+                if (!Array.isArray(value) || value.length === 0) {
+                    return true;
+                }
+                return !!value.find((v) => v == row[dataField]);
+            case "nin":
+                if (!Array.isArray(value) || value.length === 0) {
+                    return true;
+                }
+                return !value.find((v) => v == row[dataField]);
+            default:
+                return true;
+        }
+    };
     const filterData = (filter) => {
-        if (!props.data)
+        if (!data)
             return [];
-        // create copy of data
-        let processedData = props.data.map((row) => row);
         const { combinator, rules } = filter;
         if (!combinator || !rules)
-            return props.data;
-        for (const rule of rules) {
-            const column = columnState.find((col) => col.dataField === rule.dataField);
-            const { value, operator, dataField } = rule;
-            if (operator.value === "isEmpty" || operator.value === "isNotEmpty") {
-                processedData = processedData.filter((row) => {
-                    return operator.value === "isEmpty"
-                        ? !row[dataField]
-                        : row[dataField];
-                });
-            }
-            if (!value || value.length === 0) {
-                continue;
-            }
-            switch (operator.value) {
-                case "=":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isSame(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isSame(moment(value[0]));
-                        }
-                        return row[dataField] == value[0];
-                    });
-                    break;
-                case "!=":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return !moment(row[dataField]).isSame(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return !moment(row[dataField]).isSame(moment(value[0]));
-                        }
-                        return row[dataField] != value[0];
-                    });
-                    break;
-                case ">":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isAfter(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isAfter(moment(value[0]));
-                        }
-                        return row[dataField] > value[0];
-                    });
-                    break;
-                case "<":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isBefore(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isBefore(moment(value[0]));
-                        }
-                        return row[dataField] < value[0];
-                    });
-                    break;
-                case ">=":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isSameOrAfter(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isSameOrAfter(moment(value[0]));
-                        }
-                        return row[dataField] >= value[0];
-                    });
-                    break;
-                case "<=":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isSameOrBefore(moment(value[0]), "day");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isSameOrBefore(moment(value[0]));
-                        }
-                        return row[dataField] <= value[0];
-                    });
-                    break;
-                case "between":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), "day", "[]");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), undefined, "[]");
-                        }
-                        return (row[dataField] >= value[0] &&
-                            row[dataField] <= value[1]);
-                    });
-                    break;
-                case "notBetween":
-                    processedData = processedData.filter((row) => {
-                        if ((column === null || column === void 0 ? void 0 : column.dataType) === "date") {
-                            return !moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), "day", "[]");
-                        }
-                        else if ((column === null || column === void 0 ? void 0 : column.dataType) === "datetime") {
-                            return !moment(row[dataField]).isBetween(moment(value === null || value === void 0 ? void 0 : value[0]), moment(value === null || value === void 0 ? void 0 : value[1]), undefined, "[]");
-                        }
-                        return (row[dataField] < value[0] ||
-                            row[dataField] > value[1]);
-                    });
-                    break;
-                case "contains":
-                    processedData = processedData.filter((row) => {
-                        var _a, _b;
-                        return (_a = row[dataField]) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes((_b = value[0]) === null || _b === void 0 ? void 0 : _b.toString().toLowerCase());
-                    });
-                    break;
-                case "doesNotContain":
-                    processedData = processedData.filter((row) => {
-                        var _a, _b;
-                        return !((_a = row[dataField]) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes((_b = value[0]) === null || _b === void 0 ? void 0 : _b.toString().toLowerCase()));
-                    });
-                    break;
-                case "in":
-                    if (!Array.isArray(value)) {
-                        break;
-                    }
-                    else if (value.length === 0) {
-                        break;
-                    }
-                    processedData = processedData.filter((row) => {
-                        return value.find((v) => v == row[dataField]);
-                    });
-                    break;
-                case "nin":
-                    if (!Array.isArray(value)) {
-                        break;
-                    }
-                    else if (value.length === 0) {
-                        break;
-                    }
-                    processedData = processedData.filter((row) => {
-                        return !value.find((v) => v == row[dataField]);
-                    });
-                    break;
-                default:
-                    break;
-            }
+            return data;
+        if (combinator === "or") {
+            return data.filter((row) => rules.some((rule) => rowMatchesRule(row, rule)));
         }
-        return processedData;
+        return data.filter((row) => rules.every((rule) => rowMatchesRule(row, rule)));
     };
     const toggleColumnVisibility = (dataField) => {
         const newColumnState = columnState.map((col) => {
@@ -386,8 +371,8 @@ const TableProvider = (_a) => {
         setCompactState((prev) => !prev);
     };
     const getColumnVisibility = (dataField) => {
-        var _a;
-        return (((_a = columnState.find((col) => col.dataField === dataField)) === null || _a === void 0 ? void 0 : _a.visible) || true);
+        var _a, _b;
+        return ((_b = (_a = columnState.find((col) => col.dataField === dataField)) === null || _a === void 0 ? void 0 : _a.visible) !== null && _b !== void 0 ? _b : true);
     };
     const saveSelectionState = (selectionState) => {
         if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
@@ -396,38 +381,50 @@ const TableProvider = (_a) => {
             }
         }
     };
+    const getRowKey = (row) => {
+        const key = !!keyField ? row[keyField] : row.__key;
+        return String(key);
+    };
     const selectRow = (row) => {
-        var _a;
-        const key = !!props.keyField ? row[props.keyField] : row.__key;
-        const keyField = !!props.keyField ? props.keyField : "__key";
+        const key = getRowKey(row);
         const newSelectionState = {
             selectedRowKeys,
             excludedRowKeys,
             selectionStatus,
             totalSelected: 0,
         };
-        if (props.data.length === selectedRowKeys.length + 1) {
-            newSelectionState.selectionStatus = SelectionStatus.All;
+        if (selectionStatus === SelectionStatus.All ||
+            selectionStatus === SelectionStatus.SomeExcluded) {
+            const nextExcluded = excludedRowKeys.filter((k) => k !== key);
+            newSelectionState.excludedRowKeys = nextExcluded;
+            newSelectionState.selectedRowKeys = [];
+            newSelectionState.selectionStatus =
+                nextExcluded.length === 0
+                    ? SelectionStatus.All
+                    : SelectionStatus.SomeExcluded;
         }
         else {
-            newSelectionState.selectionStatus = SelectionStatus.SomeIncluded;
+            const nextSelected = selectedRowKeys.includes(key)
+                ? selectedRowKeys
+                : [...selectedRowKeys, key];
+            newSelectionState.selectedRowKeys = nextSelected;
+            newSelectionState.excludedRowKeys = excludedRowKeys.filter((k) => k !== key);
+            newSelectionState.selectionStatus =
+                nextSelected.length === 0
+                    ? SelectionStatus.None
+                    : nextSelected.length === data.length
+                        ? SelectionStatus.All
+                        : SelectionStatus.SomeIncluded;
         }
-        newSelectionState.selectedRowKeys = [
-            ...newSelectionState.selectedRowKeys,
-            key,
-        ];
-        newSelectionState.excludedRowKeys =
-            newSelectionState.excludedRowKeys.filter((k) => k !== key);
-        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, props === null || props === void 0 ? void 0 : props.totalRecords, props.data.length);
+        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, totalRecords, data.length);
         setSelectionStatus(newSelectionState.selectionStatus);
         setSelectedRowKeys(newSelectionState.selectedRowKeys);
         setExcludedRowKeys(newSelectionState.excludedRowKeys);
         saveSelectionState(newSelectionState);
-        (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
+        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(newSelectionState);
     };
     const deselectRow = (row) => {
-        var _a;
-        const key = !!props.keyField ? props.keyField : "__key";
+        const key = getRowKey(row);
         const newSelectionState = {
             selectedRowKeys,
             excludedRowKeys,
@@ -436,27 +433,34 @@ const TableProvider = (_a) => {
         };
         if (selectionStatus === SelectionStatus.All ||
             selectionStatus === SelectionStatus.SomeExcluded) {
-            newSelectionState.selectionStatus = SelectionStatus.SomeExcluded;
-            newSelectionState.excludedRowKeys = [
-                ...newSelectionState.excludedRowKeys,
-                row[key],
-            ];
+            const nextExcluded = excludedRowKeys.includes(key)
+                ? excludedRowKeys
+                : [...excludedRowKeys, key];
+            const totalSelectableRows = totalRecords || data.length;
+            newSelectionState.selectedRowKeys = [];
+            newSelectionState.excludedRowKeys = nextExcluded;
+            newSelectionState.selectionStatus =
+                nextExcluded.length >= totalSelectableRows
+                    ? SelectionStatus.None
+                    : SelectionStatus.SomeExcluded;
         }
-        if (selectedRowKeys.length === 1) {
-            newSelectionState.selectionStatus = SelectionStatus.None;
+        else {
+            const nextSelected = selectedRowKeys.filter((k) => k !== key);
+            newSelectionState.selectedRowKeys = nextSelected;
+            newSelectionState.selectionStatus =
+                nextSelected.length === 0
+                    ? SelectionStatus.None
+                    : SelectionStatus.SomeIncluded;
         }
-        newSelectionState.selectedRowKeys =
-            newSelectionState.selectedRowKeys.filter((k) => k !== row[key]);
-        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, props === null || props === void 0 ? void 0 : props.totalRecords, props.data.length);
+        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, totalRecords, data.length);
         setSelectionStatus(newSelectionState.selectionStatus);
         setSelectedRowKeys(newSelectionState.selectedRowKeys);
         setExcludedRowKeys(newSelectionState.excludedRowKeys);
         saveSelectionState(newSelectionState);
-        (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
+        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(newSelectionState);
     };
     const selectAllRows = () => {
-        var _a, _b;
-        const keys = ((_a = props.data) === null || _a === void 0 ? void 0 : _a.map((row) => !!props.keyField ? row[props.keyField] : row.__key)) || [];
+        const keys = (data === null || data === void 0 ? void 0 : data.map((row) => getRowKey(row))) || [];
         const newSelectionState = {
             selectedRowKeys,
             excludedRowKeys,
@@ -466,15 +470,14 @@ const TableProvider = (_a) => {
         newSelectionState.selectedRowKeys = keys;
         newSelectionState.excludedRowKeys = [];
         newSelectionState.selectionStatus = SelectionStatus.All;
-        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, props === null || props === void 0 ? void 0 : props.totalRecords, props.data.length);
+        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, totalRecords, data.length);
         setSelectionStatus(newSelectionState.selectionStatus);
         setSelectedRowKeys(newSelectionState.selectedRowKeys);
         setExcludedRowKeys(newSelectionState.excludedRowKeys);
         saveSelectionState(newSelectionState);
-        (_b = props.onSelectionChange) === null || _b === void 0 ? void 0 : _b.call(props, newSelectionState);
+        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(newSelectionState);
     };
     const clearSelections = () => {
-        var _a;
         const newSelectionState = {
             selectedRowKeys,
             excludedRowKeys,
@@ -484,16 +487,16 @@ const TableProvider = (_a) => {
         newSelectionState.selectedRowKeys = [];
         newSelectionState.excludedRowKeys = [];
         newSelectionState.selectionStatus = SelectionStatus.None;
-        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, props === null || props === void 0 ? void 0 : props.totalRecords, props.data.length);
+        newSelectionState.totalSelected = calculateSelectionTotal(newSelectionState, totalRecords, data.length);
         setSelectionStatus(newSelectionState.selectionStatus);
         setSelectedRowKeys(newSelectionState.selectedRowKeys);
         setExcludedRowKeys(newSelectionState.excludedRowKeys);
-        (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
+        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(newSelectionState);
         saveSelectionState(newSelectionState);
     };
     const getSelectedRows = () => {
-        return props.data.filter((row) => {
-            const key = !!props.keyField ? row[props.keyField] : row.__key;
+        return data.filter((row) => {
+            const key = getRowKey(row);
             return selectedRowKeys.includes(key);
         });
     };
@@ -501,7 +504,7 @@ const TableProvider = (_a) => {
         return selectedRowKeys;
     };
     const isRowSelected = (row) => {
-        const key = !!props.keyField ? row[props.keyField] : row.__key;
+        const key = getRowKey(row);
         switch (selectionStatus) {
             case SelectionStatus.All:
                 return true;
@@ -516,7 +519,7 @@ const TableProvider = (_a) => {
         }
     };
     const isRowFocused = (row) => {
-        const key = !!props.keyField ? row[props.keyField] : row.__key;
+        const key = getRowKey(row);
         return focusedRowId === key;
     };
     if (tableInstanceRef) {
@@ -546,33 +549,30 @@ const TableProvider = (_a) => {
                     },
                     sortState,
                     searchState: search,
-                    filterState,
+                    _filterState,
                 };
             },
         };
     }
     const _data = useMemo(() => {
-        let processedData = props.data;
-        if (props.manualSorting !== true) {
+        let processedData = data; // create a new array to avoid mutating the original data
+        if (manualSorting !== true) {
             processedData = sortData(sortState);
         }
-        if (props.manualFiltering !== true && filterState) {
-            processedData = filterData(filterState);
+        if (manualFiltering !== true && _filterState) {
+            processedData = filterData(_filterState);
         }
-        if (props.manualSearch !== true && search) {
+        if (manualSearch !== true && search) {
             processedData = searchData(search);
         }
         return processedData;
-    }, [props.data, columnState, search, sortState, filterState]);
-    return (_jsx(TableContext.Provider, { value: Object.assign(Object.assign({ columnState,
+    }, [data, columnState, search, sortState, _filterState]);
+    return (_jsx(TableContext.Provider, { value: Object.assign({ columnState,
             setColumnState,
-            sortState, searchState: search, handleColumnReorder,
-            handleColumnHeaderClick, selectionState: {
-                selectedRowKeys,
-                excludedRowKeys,
-                selectionStatus,
-                totalSelected: getCalculatedSelectionTotal(),
-            }, selectRow,
+            sortState, searchState: search, totalRecords,
+            keyField,
+            handleColumnReorder,
+            handleColumnHeaderClick, selectionState: _selectionState, selectRow,
             deselectRow,
             isRowSelected,
             isRowFocused,
@@ -583,10 +583,15 @@ const TableProvider = (_a) => {
             toggleColumnVisibility,
             runSearch,
             clearSearch,
-            handleFilterChange,
-            filterState,
-            compactState,
+            handleFilterChange, filterState: _filterState, compactState,
             toggleCompact,
-            getCalculatedSelectionTotal, tableHeight: height, tableMaxHeight: maxHeight, tableMinHeight: minHeight }, props), { onRowUpdated: (props === null || props === void 0 ? void 0 : props.onRowUpdated) || (() => { }), data: _data }), children: children }));
+            getCalculatedSelectionTotal,
+            focusedRowId,
+            manualSorting,
+            manualSearch,
+            stateStorage, tableHeight: height, tableMaxHeight: maxHeight, tableMinHeight: minHeight, compact, tableElement: tableElement, headerRowElm: headerRowElm, tableDimensions: tableDimensions, targetElm: targetElm, listElm: listElm, enableColumnResize,
+            onSelectionChange,
+            onColumnStateChange,
+            onColumnReorder, onRowUpdated: onRowUpdated || (() => { }), tableMenuOptions, data: _data }, props), children: children }));
 };
 export default TableProvider;