@gobolt/genesis 0.3.21 → 0.3.22

package/dist/components/Table/TableControls/TableControls.js

@@ -1,12 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import PrimaryTableControlsRow from "./PrimaryTableControlsRow";
 import SecondaryTableControlsRow from "./SecondaryTableControlsRow";
-var TableControls = function (_a) {
-    var primaryTableRowData = _a.primaryTableRowData, secondaryTableRowData = _a.secondaryTableRowData, onChange = _a.onChange;
-    var onPrimaryChange = function (actionEvent) {
+const TableControls = ({ primaryTableRowData, secondaryTableRowData, onChange, }) => {
+    const onPrimaryChange = (actionEvent) => {
         onChange(actionEvent);
     };
-    var onSecondaryChange = function (actionEvent) {
+    const onSecondaryChange = (actionEvent) => {
         onChange(actionEvent);
     };
     return (_jsxs("div", { "data-testid": "TableControls", style: { margin: "16px 0px" }, children: [_jsx(PrimaryTableControlsRow, { sortOptions: primaryTableRowData.sortOptions, searchByPlaceholder: primaryTableRowData.searchByPlaceholder, isSortedAscending: primaryTableRowData.isSortedAscending, onChange: onPrimaryChange, searchValue: primaryTableRowData.searchValue, selectedSortOption: primaryTableRowData.selectedSortOption }), secondaryTableRowData ? (_jsx(SecondaryTableControlsRow, { groups: secondaryTableRowData.groups, totalRecords: secondaryTableRowData.totalRecords, onChange: onSecondaryChange })) : null] }));

package/dist/components/Table/TablePagination.js

@@ -1,28 +1,11 @@
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import Table from "./Table";
 import CustomPagination, { PaginationStyle, } from "./TableControls/CustomPagination";
-var TablePagination = function (_a) {
-    var columns = _a.columns, dataSource = _a.dataSource, rowSelection = _a.rowSelection, onChange = _a.onChange, _b = _a.paginationStyle, paginationStyle = _b === void 0 ? PaginationStyle.SIMPLE : _b, _c = _a.pageSize, pageSize = _c === void 0 ? 10 : _c, isMainContentCell = _a.isMainContentCell;
-    var _d = __read(useState(1), 2), current = _d[0], setCurrent = _d[1];
-    var total = dataSource.length;
-    var paginatedData = dataSource.slice((current - 1) * pageSize, current * pageSize);
+const TablePagination = ({ columns, dataSource, rowSelection, onChange, paginationStyle = PaginationStyle.SIMPLE, pageSize = 10, isMainContentCell, }) => {
+    const [current, setCurrent] = useState(1);
+    const total = dataSource.length;
+    const paginatedData = dataSource.slice((current - 1) * pageSize, current * pageSize);
     return (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0px" }, children: [_jsx(Table, { columns: columns, dataSource: paginatedData, rowSelection: rowSelection, onChange: onChange, pagination: false, isMainContentCell: isMainContentCell }), _jsx("div", { style: { display: "flex", justifyContent: "flex-end", marginTop: 16 }, children: _jsx(CustomPagination, { paginationStyle: paginationStyle, current: current, total: total, pageSize: pageSize, onChange: setCurrent }) })] }));
 };
 export default TablePagination;

package/dist/components/Table/__mocks__/table-mocks.js

@@ -1,26 +1,15 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { Badge } from "@gobolt/genesis/components";
 import React from "react";
 // Helper function for title case
-var startCase = function (string_) {
+const startCase = (string_) => {
     if (string_) {
         return string_
             .replaceAll(/([A-Z])/g, " $1")
-            .replace(/^./, function (s) { return s.toUpperCase(); });
+            .replace(/^./, (s) => s.toUpperCase());
     }
     return string_;
 };
-export var mockColumns = [
+export const mockColumns = [
     {
         key: "number",
         title: "Id",
@@ -35,13 +24,13 @@ export var mockColumns = [
         key: "status",
         title: "Status",
         dataIndex: "status",
-        render: function (status) {
-            var colorStateMap = {
+        render: (status) => {
+            const colorStateMap = {
                 in_progress: "warning",
                 scheduled: "generic",
                 completed: "success",
             };
-            var statusLabel = status === "in_progress" ? "in progress" : status;
+            const statusLabel = status === "in_progress" ? "in progress" : status;
             return React.createElement(Badge, {
                 label: startCase(statusLabel),
                 state: colorStateMap[status],
@@ -51,16 +40,16 @@ export var mockColumns = [
     {
         key: "address",
         title: "Address",
-        render: function (appointment) {
-            var _a = appointment.address, nickname = _a.nickname, address = _a.address;
-            return nickname ? "".concat(nickname, " (").concat(address, ")") : address;
+        render: (appointment) => {
+            const { address: { nickname, address }, } = appointment;
+            return nickname ? `${nickname} (${address})` : address;
         },
     },
     {
         title: "Type",
         dataIndex: "job_subtype",
-        render: function (jobSubtype) {
-            var colorStateMap = {
+        render: (jobSubtype) => {
+            const colorStateMap = {
                 delivery: "info",
                 pickup: "success",
             };
@@ -72,8 +61,10 @@ export var mockColumns = [
     },
 ];
 // Note: it's important that we don't show the Ant Design sorting since it controlled via the table controls
-export var mockColumnsWithSortDisabled = mockColumns.map(function (column) { return (__assign({}, column)); });
-export var mockDataSource = {
+export const mockColumnsWithSortDisabled = mockColumns.map((column) => ({
+    ...column,
+}));
+export const mockDataSource = {
     appointments: [
         {
             id: "1",

package/dist/components/Table/styles.d.ts

@@ -11,18 +11,4 @@ export declare const getGenesisClass: ({ colors, borderRadius, sizing, typograph
     typography: any;
     components: any;
 }, $isMainContentCell: any) => string;
-export declare const Table: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<TableProps<unknown> & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<import("rc-table").Reference>, "ref"> & {
-    ref?: ((instance: import("rc-table").Reference | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<import("rc-table").Reference> | null | undefined;
-}, StyledTableProps<any>>> & string & Omit<import("antd/es/table/interface").RefTable & {
-    displayName?: string;
-    SELECTION_COLUMN: typeof import("antd/es/table/hooks/useSelection").SELECTION_COLUMN;
-    EXPAND_COLUMN: typeof import("rc-table").EXPAND_COLUMN;
-    SELECTION_ALL: typeof import("antd/es/table/hooks/useSelection").SELECTION_ALL;
-    SELECTION_INVERT: typeof import("antd/es/table/hooks/useSelection").SELECTION_INVERT;
-    SELECTION_NONE: typeof import("antd/es/table/hooks/useSelection").SELECTION_NONE;
-    Column: <RecordType extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType>) => null;
-    ColumnGroup: <RecordType extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType>) => null;
-    Summary: typeof import("rc-table").Summary;
-}, keyof import("react").Component<any, {}, any>>;
+export declare const Table: any;

package/dist/components/Table/styles.js

@@ -1,20 +1,64 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import styled from "@gobolt/genesis/utils/styled";
 import { Table as AntTable } from "antd";
-export var getGenesisClass = function (_a, $isMainContentCell) {
+export const getGenesisClass = ({ colors, borderRadius, sizing, typography, components }, $isMainContentCell) => {
     // Log the hovered color and the entire tableCell object
-    var colors = _a.colors, borderRadius = _a.borderRadius, sizing = _a.sizing, typography = _a.typography, components = _a.components;
-    return "\n    &.ant-table-wrapper {\n      // Add your custom styles here\n    }\n\n    .ant-table {\n      // Add your custom table styles here\n    }\n\n    .ant-table-cell {\n      font-size: ".concat($isMainContentCell ? "16px" : "14px", " !important;\n      color: ").concat($isMainContentCell
+    return `
+    &.ant-table-wrapper {
+      // Add your custom styles here
+    }
+
+    .ant-table {
+      // Add your custom table styles here
+    }
+
+    .ant-table-cell {
+      font-size: ${$isMainContentCell ? "16px" : "14px"} !important;
+      color: ${$isMainContentCell
         ? colors.onsurface.copy
-        : colors.onsurface["copy-light"], " !important;\n      background-color: ").concat(components.tableCell.surface, " !important;\n      transition: background-color 0.2s ease;\n    }\n\n    .ant-table-tbody > tr:hover > td,\n    .ant-table-tbody > tr:hover > .ant-table-cell {\n      background-color: ").concat(components.tableCell.hover, " !important;\n    }\n\n    .ant-table-cell-selected {\n      background-color: ").concat(components.tableCell.selected, " !important;\n    }\n\n    .ant-table-thead > tr > th {\n      // Add your custom header styles here\n      font-family: 'Inter', sans-serif;\n      font-size: ").concat($isMainContentCell ? "16px" : "14px", " !important;\n      font-weight: 400;\n      color: ").concat($isMainContentCell
+        : colors.onsurface["copy-light"]} !important;
+      background-color: ${components.tableCell.surface} !important;
+      transition: background-color 0.2s ease;
+    }
+
+    .ant-table-tbody > tr:hover > td,
+    .ant-table-tbody > tr:hover > .ant-table-cell {
+      background-color: ${components.tableCell.hover} !important;
+    }
+
+    .ant-table-cell-selected {
+      background-color: ${components.tableCell.selected} !important;
+    }
+
+    .ant-table-thead > tr > th {
+      // Add your custom header styles here
+      font-family: 'Inter', sans-serif;
+      font-size: ${$isMainContentCell ? "16px" : "14px"} !important;
+      font-weight: 400;
+      color: ${$isMainContentCell
         ? colors.onsurface.copy
-        : colors.onsurface["copy-light"], " !important;\n    }\n\n    .ant-table-tbody > tr  {\n      // Add your custom row styles here\n    }\n\n    .ant-table-tbody > tr > td {\n      // Add your custom cell styles here\n      font-family: 'Inter', sans-serif;\n      font-size: 14px;\n      color: ").concat(colors.onsurface["copy-light"], ";\n    }\n\n    .ant-table-tbody > tr.ant-table-row-selected > td,\n    .ant-table-tbody > tr.ant-table-row-selected > .ant-table-cell {\n      background-color: ").concat(components.tableCell.selected, " !important;\n      color: #fff !important;\n    }\n  ");
+        : colors.onsurface["copy-light"]} !important;
+    }
+
+    .ant-table-tbody > tr  {
+      // Add your custom row styles here
+    }
+
+    .ant-table-tbody > tr > td {
+      // Add your custom cell styles here
+      font-family: 'Inter', sans-serif;
+      font-size: 14px;
+      color: ${colors.onsurface["copy-light"]};
+    }
+
+    .ant-table-tbody > tr.ant-table-row-selected > td,
+    .ant-table-tbody > tr.ant-table-row-selected > .ant-table-cell {
+      background-color: ${components.tableCell.selected} !important;
+      color: #fff !important;
+    }
+  `;
 };
-export var Table = styled(AntTable)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
-    var theme = _a.theme, $isMainContentCell = _a.$isMainContentCell;
+export const Table = styled(AntTable) `
+  ${({ theme, $isMainContentCell }) => {
     return getGenesisClass(theme, $isMainContentCell);
-});
-var templateObject_1;
+}}
+`;

package/dist/components/Table/useTable.js

@@ -1,127 +1,33 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-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 __values = (this && this.__values) || function(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-};
 import { useState, useEffect, useCallback } from "react";
 // Function to sort data by field and order
-var sortData = function (data, sorter) {
+const sortData = (data, sorter) => {
     // Handle case when no sorting is applied
     if (!sorter || (Array.isArray(sorter) && sorter.length === 0)) {
-        return __spreadArray([], __read(data), false);
+        return [...data];
     }
     // Handle multiple sorters
     if (Array.isArray(sorter)) {
-        return __spreadArray([], __read(data), false).sort(function (a, b) {
-            var e_1, _a;
-            try {
-                for (var sorter_1 = __values(sorter), sorter_1_1 = sorter_1.next(); !sorter_1_1.done; sorter_1_1 = sorter_1.next()) {
-                    var sort = sorter_1_1.value;
-                    if (!sort.field)
-                        continue;
-                    var field = sort.field;
-                    var aValue = a[field];
-                    var bValue = b[field];
-                    if (aValue < bValue)
-                        return sort.order === "ascend" ? -1 : 1;
-                    if (aValue > bValue)
-                        return sort.order === "ascend" ? 1 : -1;
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (sorter_1_1 && !sorter_1_1.done && (_a = sorter_1.return)) _a.call(sorter_1);
-                }
-                finally { if (e_1) throw e_1.error; }
+        return [...data].sort((a, b) => {
+            for (const sort of sorter) {
+                if (!sort.field)
+                    continue;
+                const field = sort.field;
+                const aValue = a[field];
+                const bValue = b[field];
+                if (aValue < bValue)
+                    return sort.order === "ascend" ? -1 : 1;
+                if (aValue > bValue)
+                    return sort.order === "ascend" ? 1 : -1;
             }
             return 0;
         });
     }
     // Handle single sorter
     if (sorter.field) {
-        var field_1 = sorter.field;
-        return __spreadArray([], __read(data), false).sort(function (a, b) {
-            var aValue = a[field_1];
-            var bValue = b[field_1];
+        const field = sorter.field;
+        return [...data].sort((a, b) => {
+            const aValue = a[field];
+            const bValue = b[field];
             if (sorter.order === "ascend") {
                 if (aValue < bValue)
                     return -1;
@@ -139,7 +45,7 @@ var sortData = function (data, sorter) {
             return 0;
         });
     }
-    return __spreadArray([], __read(data), false);
+    return [...data];
 };
 /*
 Example of disableRowSelection function which can be passed to the useTable hook
@@ -148,71 +54,59 @@ const disableRowSelection = (record: any) => ({
       name: record.status.toString(),
 });
 */
-var defaultRowSelection = function (record) { return ({
+const defaultRowSelection = (record) => ({
     disabled: false, // Add your disable logic here
     name: record.id,
-}); };
-export var useTable = function (useTableConfig) {
-    var _a = __read(useState(true), 2), isLoading = _a[0], setLoading = _a[1];
-    var _b = useTableConfig, columns = _b.columns, _c = _b.filters, filters = _c === void 0 ? null : _c, _d = _b.fetchUrl, fetchUrl = _d === void 0 ? "/table/data" : _d, _e = _b.fetchOptions, fetchOptions = _e === void 0 ? {
+});
+export const useTable = (useTableConfig) => {
+    const [isLoading, setLoading] = useState(true);
+    const { columns, filters = null, fetchUrl = "/table/data", fetchOptions = {
         method: "POST",
         headers: {
             "Content-Type": "application/json",
         },
         body: JSON.stringify(filters),
-    } : _e, _f = _b.selectionType, selectionType = _f === void 0 ? "checkbox" : _f, _g = _b.simulateDelay, simulateDelay = _g === void 0 ? 0 : _g, _h = _b.disableRowSelection, disableRowSelection = _h === void 0 ? defaultRowSelection : _h, _j = _b.disableAutoFetch, disableAutoFetch = _j === void 0 ? false : _j, _k = _b.dataSource, initialDataSource = _k === void 0 ? [] : _k;
+    }, selectionType = "checkbox", simulateDelay = 0, disableRowSelection = defaultRowSelection, disableAutoFetch = false, dataSource: initialDataSource = [], } = useTableConfig;
     // State to hold the original data and the current data
-    var _l = __read(useState(initialDataSource), 2), originalData = _l[0], setOriginalData = _l[1];
-    var _m = __read(useState({
+    const [originalData, setOriginalData] = useState(initialDataSource);
+    const [data, setData] = useState({
         dataSource: initialDataSource,
-        columns: columns,
+        columns,
         error: null,
-    }), 2), data = _m[0], setData = _m[1];
-    var _o = __read(useState([]), 2), selectedRows = _o[0], setSelectedRows = _o[1];
+    });
+    const [selectedRows, setSelectedRows] = useState([]);
     // Load initial data
-    useEffect(function () {
+    useEffect(() => {
         // If auto-fetch is disabled and we have initial data, skip fetching
         if (disableAutoFetch && initialDataSource.length > 0) {
             setLoading(false);
             return;
         }
-        var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var response, result, sourceData, error_1;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        _a.trys.push([0, 3, 4, 5]);
-                        return [4 /*yield*/, fetch(fetchUrl, fetchOptions)];
-                    case 1:
-                        response = _a.sent();
-                        return [4 /*yield*/, response.json()];
-                    case 2:
-                        result = _a.sent();
-                        sourceData = result.data || [];
-                        setOriginalData(sourceData);
-                        setData({
-                            dataSource: sourceData,
-                            columns: columns,
-                            error: null,
-                        });
-                        return [3 /*break*/, 5];
-                    case 3:
-                        error_1 = _a.sent();
-                        console.error("Error fetching table data:", error_1);
-                        // Fallback to static data
-                        setData({
-                            dataSource: [],
-                            columns: columns,
-                            error: error_1 instanceof Error ? error_1 : new Error(String(error_1)),
-                        });
-                        return [3 /*break*/, 5];
-                    case 4:
-                        setLoading(false);
-                        return [7 /*endfinally*/];
-                    case 5: return [2 /*return*/];
-                }
-            });
-        }); };
+        const fetchData = async () => {
+            try {
+                const response = await fetch(fetchUrl, fetchOptions);
+                const result = await response.json();
+                const sourceData = result.data || [];
+                setOriginalData(sourceData);
+                setData({
+                    dataSource: sourceData,
+                    columns,
+                    error: null,
+                });
+            }
+            catch (error) {
+                console.error("Error fetching table data:", error);
+                // Fallback to static data
+                setData({
+                    dataSource: [],
+                    columns,
+                    error: error instanceof Error ? error : new Error(String(error)),
+                });
+            }
+            finally {
+                setLoading(false);
+            }
+        };
         if (simulateDelay > 0) {
             setTimeout(fetchData, simulateDelay);
         }
@@ -220,19 +114,28 @@ export var useTable = function (useTableConfig) {
             fetchData();
         }
     }, [fetchOptions, disableAutoFetch, initialDataSource]);
-    var handleRowSelection = useCallback(function (selectedRowKeys, selectedRows) {
+    const handleRowSelection = useCallback((selectedRowKeys, selectedRows) => {
         console.log("Row Selected:", selectedRowKeys, selectedRows);
         setSelectedRows(selectedRows);
     }, []);
     // Function to manually update data source (for external data fetching)
-    var updateDataSource = useCallback(function (newDataSource) {
+    const updateDataSource = useCallback((newDataSource) => {
         setOriginalData(newDataSource);
-        setData(function (prev) { return (__assign(__assign({}, prev), { dataSource: newDataSource })); });
+        setData((prev) => ({
+            ...prev,
+            dataSource: newDataSource,
+        }));
     }, []);
-    var rowSelection = {
+    const rowSelection = {
         type: selectionType,
         onChange: handleRowSelection,
         getCheckboxProps: disableRowSelection,
     };
-    return __assign(__assign({}, data), { isLoading: isLoading, rowSelection: rowSelection, selectedRows: selectedRows, updateDataSource: updateDataSource });
+    return {
+        ...data,
+        isLoading,
+        rowSelection,
+        selectedRows,
+        updateDataSource,
+    };
 };

package/dist/components/TableWithControls/TableWithControls.js

@@ -1,19 +1,18 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import TableControls from "../Table/TableControls";
 import Table from "../Table";
-var TableWithControls = function (_a) {
-    var tableData = _a.tableData, tableControlsData = _a.tableControlsData, onChange = _a.onChange;
-    var primaryTableRowData = tableControlsData.primaryTableRowData, secondaryTableRowData = tableControlsData.secondaryTableRowData;
-    var dataSource = tableData.dataSource, columns = tableData.columns, rowSelection = tableData.rowSelection;
+const TableWithControls = ({ tableData, tableControlsData, onChange, }) => {
+    const { primaryTableRowData, secondaryTableRowData } = tableControlsData;
+    const { dataSource, columns, rowSelection } = tableData;
     // handle changes from the table controls
-    var onTableControlsChange = function (event) {
+    const onTableControlsChange = (event) => {
         onChange(event);
     };
     // handle changes from the table
-    var onTableChange = function (pagination, filters, sorter) {
+    const onTableChange = (pagination, filters, sorter) => {
         onChange({
             event: "tableChange",
-            payload: { pagination: pagination, filters: filters, sorter: sorter },
+            payload: { pagination, filters, sorter },
         });
     };
     return (_jsxs(_Fragment, { children: [_jsx(TableControls, { primaryTableRowData: primaryTableRowData, secondaryTableRowData: secondaryTableRowData, onChange: onTableControlsChange }), _jsx(Table, { dataSource: dataSource, columns: columns, rowSelection: rowSelection, onChange: onTableChange })] }));