@google-psat/design-system 0.9.0-1

package/dist/components/table/useTable/provider.jsx

@@ -0,0 +1,138 @@
+"use strict";
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableProvider = void 0;
+/**
+ * External dependencies.
+ */
+const react_1 = __importStar(require("react"));
+const common_1 = require("@google-psat/common");
+/**
+ * Internal dependencies.
+ */
+const useColumnSorting_1 = __importDefault(require("./useColumnSorting"));
+const useColumnVisibility_1 = __importDefault(require("./useColumnVisibility"));
+const useColumnResizing_1 = __importDefault(require("./useColumnResizing"));
+const useFiltering_1 = __importDefault(require("./useFiltering"));
+const useSearch_1 = __importDefault(require("./useSearch"));
+const context_1 = require("./context");
+const TableProvider = ({ data, tableColumns, tableFilterData, tableSearchKeys, tablePersistentSettingsKey, onRowClick, onRowContextMenu, getRowObjectKey, conditionalTableRowClassesHandler, exportTableData, hasVerticalBar, isRowSelected, children, }) => {
+    const commonKey = (0, react_1.useMemo)(() => {
+        if (!tablePersistentSettingsKey) {
+            return undefined;
+        }
+        const keys = tablePersistentSettingsKey.split('#');
+        return keys[0];
+    }, [tablePersistentSettingsKey]);
+    const { visibleColumns, hideColumn, toggleVisibility, areAllColumnsVisible, showColumn, isColumnHidden, } = (0, useColumnVisibility_1.default)(tableColumns, commonKey);
+    const allTableColumnsKeys = (0, react_1.useMemo)(() => {
+        return tableColumns.map(({ accessorKey }) => accessorKey);
+    }, [tableColumns]);
+    const { columns, tableContainerRef, onMouseDown, isResizing } = (0, useColumnResizing_1.default)(visibleColumns, allTableColumnsKeys, commonKey);
+    const { sortedData, sortKey, sortOrder, setSortKey, setSortOrder } = (0, useColumnSorting_1.default)(data, commonKey);
+    const { filters, selectedFilters, filteredData, isFiltering, toggleFilterSelection, toggleSelectAllFilter, resetFilters, isSelectAllFilterSelected, } = (0, useFiltering_1.default)(sortedData, tableFilterData, tablePersistentSettingsKey, commonKey);
+    const { searchValue, setSearchValue, searchFilteredData } = (0, useSearch_1.default)(filteredData, tableSearchKeys, commonKey);
+    const [rows, setRows] = (0, react_1.useState)([]);
+    (0, react_1.useEffect)(() => {
+        const newRows = searchFilteredData.map((_data) => {
+            const row = {
+                originalData: _data,
+            };
+            columns.forEach((column) => {
+                const value = (0, common_1.getValueByKey)(column.accessorKey, _data);
+                row[column.accessorKey] = {
+                    value: () => column.cell(value, _data),
+                };
+            });
+            return row;
+        });
+        setRows(newRows);
+    }, [searchFilteredData, columns]);
+    const hideableColumns = (0, react_1.useMemo)(() => tableColumns.filter((column) => column.enableHiding !== false), [tableColumns]);
+    (0, react_1.useEffect)(() => {
+        const filteredRows = rows.filter((row) => { var _a; return (_a = isRowSelected === null || isRowSelected === void 0 ? void 0 : isRowSelected(row.originalData)) !== null && _a !== void 0 ? _a : true; });
+        if (filteredRows.length === 0) {
+            onRowClick(null);
+        }
+    }, [isRowSelected, onRowClick, rows]);
+    return (<context_1.TableContext.Provider value={{
+            state: {
+                columns,
+                hideableColumns,
+                rows,
+                sortKey,
+                sortOrder,
+                areAllColumnsVisible,
+                tableContainerRef,
+                isResizing,
+                filters,
+                selectedFilters,
+                isFiltering,
+                searchValue,
+            },
+            actions: {
+                setSortKey,
+                setSortOrder,
+                hideColumn,
+                toggleVisibility,
+                showColumn,
+                isColumnHidden,
+                onMouseDown,
+                toggleFilterSelection,
+                toggleSelectAllFilter,
+                resetFilters,
+                isSelectAllFilterSelected,
+                setSearchValue,
+                onRowClick,
+                onRowContextMenu,
+                getRowObjectKey,
+                conditionalTableRowClassesHandler,
+                exportTableData,
+                hasVerticalBar,
+            },
+        }}>
+      {children}
+    </context_1.TableContext.Provider>);
+};
+exports.TableProvider = TableProvider;
+//# sourceMappingURL=provider.jsx.map

package/dist/components/table/useTable/provider.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider.jsx","sourceRoot":"","sources":["../../../../src/components/table/useTable/provider.tsx"],"names":[],"mappings":"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"}

package/dist/components/table/useTable/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/components/table/useTable/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/table/useTable/types.ts"],"names":[],"mappings":""}

package/dist/components/table/useTable/useColumnResizing/handleResizeOnColumnsVisibilityChange.js

@@ -0,0 +1,61 @@
+"use strict";
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleResizeOnColumnsVisibilityChange = void 0;
+const resizeColumns_1 = require("./resizeColumns");
+const getInitialColumnSize = (widthWeightagePercentage, tableWidth, columnsCount) => {
+    if (widthWeightagePercentage) {
+        return (widthWeightagePercentage / 100) * tableWidth;
+    }
+    return tableWidth / columnsCount;
+};
+const handleResizeOnColumnsVisibilityChange = (prevColumnsState, newTableColumnsToRender, columnsSizing, tableWidth, isToggleAll) => {
+    // new columns are added and it's not the first render
+    if (prevColumnsState.length < newTableColumnsToRender.length &&
+        prevColumnsState.length) {
+        const incomingColumnsWidth = newTableColumnsToRender
+            .filter((column) => !prevColumnsState.find((prevColumn) => prevColumn.accessorKey === column.accessorKey))
+            .reduce((acc, column) => {
+            if (!columnsSizing[column.accessorKey]) {
+                const percentage = isToggleAll
+                    ? column.widthWeightagePercentage || 0
+                    : 0;
+                columnsSizing[column.accessorKey] = getInitialColumnSize(percentage, tableWidth, newTableColumnsToRender.length);
+            }
+            acc += columnsSizing[column.accessorKey];
+            return acc;
+        }, 0);
+        const resizedPrev = (0, resizeColumns_1.resizeColumns)(prevColumnsState, tableWidth - incomingColumnsWidth);
+        resizedPrev.forEach((column) => {
+            columnsSizing[column.accessorKey] = column.width || 0;
+        });
+    }
+    const newColumns = newTableColumnsToRender.map((column) => {
+        if (!columnsSizing[column.accessorKey]) {
+            columnsSizing[column.accessorKey] = getInitialColumnSize(column.widthWeightagePercentage || 0, tableWidth, newTableColumnsToRender.length);
+        }
+        return Object.assign(Object.assign({}, column), { width: columnsSizing === null || columnsSizing === void 0 ? void 0 : columnsSizing[column.accessorKey] });
+    });
+    // columns are removed or it's the first render
+    if (prevColumnsState.length > newTableColumnsToRender.length ||
+        !prevColumnsState.length) {
+        return (0, resizeColumns_1.resizeColumns)(newColumns, tableWidth);
+    }
+    return newColumns;
+};
+exports.handleResizeOnColumnsVisibilityChange = handleResizeOnColumnsVisibilityChange;
+//# sourceMappingURL=handleResizeOnColumnsVisibilityChange.js.map

package/dist/components/table/useTable/useColumnResizing/handleResizeOnColumnsVisibilityChange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handleResizeOnColumnsVisibilityChange.js","sourceRoot":"","sources":["../../../../../src/components/table/useTable/useColumnResizing/handleResizeOnColumnsVisibilityChange.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;GAcG;;;AAMH,mDAAgD;AAEhD,MAAM,oBAAoB,GAAG,CAC3B,wBAAgC,EAChC,UAAkB,EAClB,YAAoB,EACpB,EAAE;IACF,IAAI,wBAAwB,EAAE,CAAC;QAC7B,OAAO,CAAC,wBAAwB,GAAG,GAAG,CAAC,GAAG,UAAU,CAAC;IACvD,CAAC;IAED,OAAO,UAAU,GAAG,YAAY,CAAC;AACnC,CAAC,CAAC;AAEK,MAAM,qCAAqC,GAAG,CACnD,gBAA+B,EAC/B,uBAAsC,EACtC,aAAwC,EACxC,UAAkB,EAClB,WAAoB,EACpB,EAAE;IACF,sDAAsD;IACtD,IACE,gBAAgB,CAAC,MAAM,GAAG,uBAAuB,CAAC,MAAM;QACxD,gBAAgB,CAAC,MAAM,EACvB,CAAC;QACD,MAAM,oBAAoB,GAAG,uBAAuB;aACjD,MAAM,CACL,CAAC,MAAM,EAAE,EAAE,CACT,CAAC,gBAAgB,CAAC,IAAI,CACpB,CAAC,UAAU,EAAE,EAAE,CAAC,UAAU,CAAC,WAAW,KAAK,MAAM,CAAC,WAAW,CAC9D,CACJ;aACA,MAAM,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,EAAE;YACtB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;gBACvC,MAAM,UAAU,GAAG,WAAW;oBAC5B,CAAC,CAAC,MAAM,CAAC,wBAAwB,IAAI,CAAC;oBACtC,CAAC,CAAC,CAAC,CAAC;gBACN,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,oBAAoB,CACtD,UAAU,EACV,UAAU,EACV,uBAAuB,CAAC,MAAM,CAC/B,CAAC;YACJ,CAAC;YAED,GAAG,IAAI,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;YAEzC,OAAO,GAAG,CAAC;QACb,CAAC,EAAE,CAAC,CAAC,CAAC;QAER,MAAM,WAAW,GAAG,IAAA,6BAAa,EAC/B,gBAAgB,EAChB,UAAU,GAAG,oBAAoB,CAClC,CAAC;QAEF,WAAW,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YAC7B,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC,KAAK,IAAI,CAAC,CAAC;QACxD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,UAAU,GAAG,uBAAuB,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;QACxD,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;YACvC,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,oBAAoB,CACtD,MAAM,CAAC,wBAAwB,IAAI,CAAC,EACpC,UAAU,EACV,uBAAuB,CAAC,MAAM,CAC/B,CAAC;QACJ,CAAC;QAED,uCACK,MAAM,KACT,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,MAAM,CAAC,WAAW,CAAC,IAC1C;IACJ,CAAC,CAAC,CAAC;IAEH,+CAA+C;IAC/C,IACE,gBAAgB,CAAC,MAAM,GAAG,uBAAuB,CAAC,MAAM;QACxD,CAAC,gBAAgB,CAAC,MAAM,EACxB,CAAC;QACD,OAAO,IAAA,6BAAa,EAAC,UAAU,EAAE,UAAU,CAAC,CAAC;IAC/C,CAAC;IAED,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC;AAtEW,QAAA,qCAAqC,yCAsEhD"}

package/dist/components/table/useTable/useColumnResizing/index.jsx

@@ -0,0 +1,161 @@
+"use strict";
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * External dependencies.
+ */
+const react_1 = require("react");
+const persistentSettingsStore_1 = require("../../persistentSettingsStore");
+const resizeColumns_1 = require("./resizeColumns");
+const handleResizeOnColumnsVisibilityChange_1 = require("./handleResizeOnColumnsVisibilityChange");
+const useColumnResizing = (tableColumns, allTableColumnsKeys, tablePersistentSettingsKey) => {
+    const tableContainerRef = (0, react_1.useRef)(null);
+    const [columns, setColumns] = (0, react_1.useState)(tableColumns);
+    const [isResizing, setIsResizing] = (0, react_1.useState)(false);
+    const columnsSizingRef = (0, react_1.useRef)({});
+    (0, react_1.useEffect)(() => {
+        if (tableColumns.length === 1) {
+            columnsSizingRef.current = {};
+            columnsSizingRef.current[tableColumns[0].accessorKey] =
+                tableColumns[0].width || 0;
+        }
+    }, [tableColumns]);
+    (0, react_1.useEffect)(() => {
+        setColumns((prev) => {
+            var _a;
+            return (0, handleResizeOnColumnsVisibilityChange_1.handleResizeOnColumnsVisibilityChange)(prev, tableColumns, columnsSizingRef.current, ((_a = tableContainerRef.current) === null || _a === void 0 ? void 0 : _a.scrollWidth) || 0, allTableColumnsKeys.length === tableColumns.length);
+        });
+    }, [allTableColumnsKeys.length, tableColumns]);
+    const setColumnsCallback = (0, react_1.useCallback)((columnsSizing) => {
+        setColumns((prevColumns) => {
+            var _a;
+            const tableWidth = ((_a = tableContainerRef.current) === null || _a === void 0 ? void 0 : _a.scrollWidth) || 0;
+            const newColumns = prevColumns.map((column) => (Object.assign(Object.assign({}, column), { width: (columnsSizing === null || columnsSizing === void 0 ? void 0 : columnsSizing[column.accessorKey]) || column.width || 0 })));
+            return (0, resizeColumns_1.resizeColumns)(newColumns, tableWidth);
+        });
+    }, []);
+    (0, react_1.useEffect)(() => {
+        const _setColumnsCallback = () => setColumnsCallback();
+        globalThis === null || globalThis === void 0 ? void 0 : globalThis.addEventListener('resize', _setColumnsCallback);
+        return () => {
+            globalThis === null || globalThis === void 0 ? void 0 : globalThis.removeEventListener('resize', _setColumnsCallback);
+        };
+    }, [setColumnsCallback]);
+    const onMouseDown = (0, react_1.useCallback)((selectedColumnRef, index) => {
+        var _a, _b;
+        const onMove = (clientXPos) => {
+            setColumns((prev) => {
+                var _a;
+                setIsResizing(true);
+                const startOffset = ((_a = selectedColumnRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left) || 0;
+                const selectedColumn = index;
+                const column1 = prev[selectedColumn], column2 = prev[selectedColumn + 1];
+                if (selectedColumn + 1 === prev.length) {
+                    return prev;
+                }
+                const column1Width = column1.width || 0, column2Width = column2.width || 0;
+                const widthChange = clientXPos - (startOffset + column1Width);
+                let newColumn1Width = 40, newColumn2Width = 40;
+                if (widthChange > 0) {
+                    newColumn2Width = Math.max(40, column2Width - widthChange);
+                    newColumn1Width =
+                        newColumn2Width === 40
+                            ? column1Width + column2Width - 40
+                            : column1Width + widthChange;
+                }
+                else {
+                    newColumn1Width = Math.max(40, column1Width + widthChange);
+                    newColumn2Width =
+                        newColumn1Width === 40
+                            ? column1Width + column2Width - 40
+                            : column2Width - widthChange;
+                }
+                const newColumns = [...prev];
+                newColumns[selectedColumn] = Object.assign(Object.assign({}, column1), { width: newColumn1Width });
+                newColumns[selectedColumn + 1] = Object.assign(Object.assign({}, column2), { width: newColumn2Width });
+                return newColumns;
+            });
+        };
+        const mouseEvents = {
+            moveHandler: (e) => onMove(e.clientX),
+            upHandler: () => {
+                var _a, _b;
+                setTimeout(() => setIsResizing(false), 100);
+                (_a = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) === null || _a === void 0 ? void 0 : _a.removeEventListener('mousemove', mouseEvents.moveHandler);
+                (_b = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseup', mouseEvents.upHandler);
+            },
+        };
+        (_a = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) === null || _a === void 0 ? void 0 : _a.addEventListener('mousemove', mouseEvents.moveHandler);
+        (_b = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseup', mouseEvents.upHandler);
+    }, []);
+    (0, react_1.useEffect)(() => {
+        const resizer = new ResizeObserver(() => {
+            setColumnsCallback();
+        });
+        if (tableContainerRef.current) {
+            resizer.observe(tableContainerRef.current);
+        }
+        return () => resizer.disconnect();
+    }, [setColumnsCallback]);
+    const { getPreferences, setPreferences } = (0, persistentSettingsStore_1.useTablePersistentSettingsStore)(({ actions }) => ({
+        getPreferences: actions.getPreferences,
+        setPreferences: actions.setPreferences,
+    }));
+    (0, react_1.useEffect)(() => {
+        if (tablePersistentSettingsKey) {
+            const data = getPreferences(tablePersistentSettingsKey, 'columnsSizing');
+            if (data) {
+                columnsSizingRef.current =
+                    data || {};
+                setColumnsCallback(data || {});
+            }
+        }
+        return () => {
+            setColumns([]);
+        };
+    }, [getPreferences, setColumnsCallback, tablePersistentSettingsKey]);
+    (0, react_1.useEffect)(() => {
+        const _columns = columns.reduce((acc, { accessorKey, width }) => {
+            acc[accessorKey] = width || 0;
+            return acc;
+        }, {});
+        const _columnsSizing = (allTableColumnsKeys || []).reduce((acc, accessorKey) => {
+            acc[accessorKey] =
+                _columns[accessorKey] || columnsSizingRef.current[accessorKey] || 0;
+            return acc;
+        }, {});
+        columnsSizingRef.current = Object.assign(Object.assign({}, columnsSizingRef.current), _columnsSizing);
+        if (tablePersistentSettingsKey) {
+            setPreferences({
+                columnsSizing: _columnsSizing,
+            }, tablePersistentSettingsKey);
+        }
+    }, [
+        allTableColumnsKeys,
+        columns,
+        setPreferences,
+        tablePersistentSettingsKey,
+    ]);
+    return {
+        columns,
+        tableContainerRef,
+        onMouseDown,
+        isResizing,
+    };
+};
+exports.default = useColumnResizing;
+//# sourceMappingURL=index.jsx.map

package/dist/components/table/useTable/useColumnResizing/index.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.jsx","sourceRoot":"","sources":["../../../../../src/components/table/useTable/useColumnResizing/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/table/useTable/useColumnResizing/resizeColumns.js

@@ -0,0 +1,54 @@
+"use strict";
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resizeColumns = void 0;
+const resizeColumns = (columnsToResize, tableWidth) => {
+    const totalWidth = columnsToResize.reduce((acc, column) => acc + (column.width || 0), 0);
+    const diff = tableWidth - totalWidth;
+    // If the table is wider than the columns, we need to add the difference to the columns
+    if (diff > 0) {
+        const perColumnDiff = diff / columnsToResize.length;
+        columnsToResize.forEach((column) => {
+            if (!column.width) {
+                column.width = 0;
+            }
+            column.width += perColumnDiff;
+        });
+    }
+    // If the table is narrower than the columns, we need to remove the difference from the columns
+    else if (diff < 0) {
+        const sortedColumns = [...columnsToResize].sort(({ width: width1 }, { width: width2 }) => (width2 || 0) - (width1 || 0));
+        let columnsWithLowWidth = 0;
+        sortedColumns.forEach((column) => {
+            if (!column.width) {
+                column.width = 40;
+            }
+            const perColumnDiffPercentage = (column.width / totalWidth) * 100;
+            const diffCanApply = (perColumnDiffPercentage / 100) * (-diff + columnsWithLowWidth * 40);
+            if (column.width - diffCanApply >= 40) {
+                column.width -= diffCanApply;
+            }
+            else {
+                columnsWithLowWidth++;
+                column.width = 40;
+            }
+        });
+    }
+    return columnsToResize;
+};
+exports.resizeColumns = resizeColumns;
+//# sourceMappingURL=resizeColumns.js.map

package/dist/components/table/useTable/useColumnResizing/resizeColumns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizeColumns.js","sourceRoot":"","sources":["../../../../../src/components/table/useTable/useColumnResizing/resizeColumns.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;GAcG;;;AAOI,MAAM,aAAa,GAAG,CAC3B,eAA8B,EAC9B,UAAkB,EAClB,EAAE;IACF,MAAM,UAAU,GAAG,eAAe,CAAC,MAAM,CACvC,CAAC,GAAG,EAAE,MAAM,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,CAAC,EAC1C,CAAC,CACF,CAAC;IAEF,MAAM,IAAI,GAAG,UAAU,GAAG,UAAU,CAAC;IAErC,uFAAuF;IACvF,IAAI,IAAI,GAAG,CAAC,EAAE,CAAC;QACb,MAAM,aAAa,GAAG,IAAI,GAAG,eAAe,CAAC,MAAM,CAAC;QACpD,eAAe,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YACjC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;gBAClB,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC;YACnB,CAAC;YAED,MAAM,CAAC,KAAK,IAAI,aAAa,CAAC;QAChC,CAAC,CAAC,CAAC;IACL,CAAC;IACD,+FAA+F;SAC1F,IAAI,IAAI,GAAG,CAAC,EAAE,CAAC;QAClB,MAAM,aAAa,GAAG,CAAC,GAAG,eAAe,CAAC,CAAC,IAAI,CAC7C,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CACxE,CAAC;QAEF,IAAI,mBAAmB,GAAG,CAAC,CAAC;QAE5B,aAAa,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YAC/B,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;gBAClB,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC;YACpB,CAAC;YAED,MAAM,uBAAuB,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,UAAU,CAAC,GAAG,GAAG,CAAC;YAClE,MAAM,YAAY,GAChB,CAAC,uBAAuB,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,mBAAmB,GAAG,EAAE,CAAC,CAAC;YAEvE,IAAI,MAAM,CAAC,KAAK,GAAG,YAAY,IAAI,EAAE,EAAE,CAAC;gBACtC,MAAM,CAAC,KAAK,IAAI,YAAY,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,mBAAmB,EAAE,CAAC;gBACtB,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC;YACpB,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO,eAAe,CAAC;AACzB,CAAC,CAAC;AAjDW,QAAA,aAAa,iBAiDxB"}

package/dist/components/table/useTable/useColumnSorting/index.jsx

@@ -0,0 +1,90 @@
+"use strict";
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * External dependencies.
+ */
+const react_1 = require("react");
+const common_1 = require("@google-psat/common");
+const persistentSettingsStore_1 = require("../../persistentSettingsStore");
+const useColumnSorting = (data, tablePersistentSettingsKey) => {
+    const [sortKey, _setSortKey] = (0, react_1.useState)('');
+    const [ascending, setAscending] = (0, react_1.useState)(true);
+    const [isDataLoading, setIsDataLoading] = (0, react_1.useState)(true);
+    const setSortOrder = (0, react_1.useCallback)((sortOrder) => {
+        setAscending(sortOrder === 'asc');
+    }, []);
+    const setSortKey = (0, react_1.useCallback)((newSortKey) => {
+        if (newSortKey === sortKey) {
+            setAscending(!ascending);
+        }
+        else {
+            _setSortKey(newSortKey);
+            setAscending(true);
+        }
+    }, [ascending, sortKey]);
+    const sortedData = (0, react_1.useMemo)(() => {
+        if (isDataLoading) {
+            return [];
+        }
+        const _sortedData = [...data].sort((a, b) => {
+            const candidateA = (0, common_1.getValueByKey)(sortKey, a);
+            const candidateB = (0, common_1.getValueByKey)(sortKey, b);
+            return ((candidateA === candidateB ? 0 : candidateA > candidateB ? 1 : -1) *
+                (ascending ? 1 : -1));
+        });
+        return _sortedData;
+    }, [ascending, data, isDataLoading, sortKey]);
+    const { getPreferences, setPreferences } = (0, persistentSettingsStore_1.useTablePersistentSettingsStore)(({ actions }) => ({
+        getPreferences: actions.getPreferences,
+        setPreferences: actions.setPreferences,
+    }));
+    (0, react_1.useEffect)(() => {
+        if (tablePersistentSettingsKey) {
+            const sortByData = getPreferences(tablePersistentSettingsKey, 'sortBy');
+            const sortOrderData = getPreferences(tablePersistentSettingsKey, 'sortOrder');
+            if (sortByData) {
+                _setSortKey(sortByData);
+            }
+            if (sortOrderData) {
+                setAscending(sortOrderData === 'asc');
+            }
+        }
+        setIsDataLoading(false);
+        return () => {
+            _setSortKey('');
+            setAscending(true);
+        };
+    }, [getPreferences, tablePersistentSettingsKey]);
+    (0, react_1.useEffect)(() => {
+        if (tablePersistentSettingsKey && sortKey) {
+            setPreferences({
+                sortBy: sortKey,
+                sortOrder: ascending ? 'asc' : 'desc',
+            }, tablePersistentSettingsKey);
+        }
+    }, [sortKey, ascending, tablePersistentSettingsKey, setPreferences]);
+    return {
+        sortedData,
+        setSortKey,
+        setSortOrder,
+        sortKey,
+        sortOrder: ascending ? 'asc' : 'desc',
+    };
+};
+exports.default = useColumnSorting;
+//# sourceMappingURL=index.jsx.map

package/dist/components/table/useTable/useColumnSorting/index.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.jsx","sourceRoot":"","sources":["../../../../../src/components/table/useTable/useColumnSorting/index.tsx"],"names":[],"mappings":"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"}