@ercioko/meblotex-api 0.1.0

package/dist/components/Table/Table.js

@@ -0,0 +1,330 @@
+"use strict";
+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 __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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MARGIN_FOR_SPINNER = void 0;
+var antd_1 = require("antd");
+var react_1 = __importStar(require("react"));
+var react_redux_1 = require("react-redux");
+var react_virtualized_1 = require("react-virtualized");
+var config_1 = __importDefault(require("../../config"));
+var Spinner_1 = __importDefault(require("./Spinner"));
+var useGetRowCheckbox_1 = __importDefault(require("./hooks/useGetRowCheckbox"));
+var useGetCellRenderer_1 = __importDefault(require("./hooks/useGetCellRenderer"));
+var useGetResizeColumn_1 = __importDefault(require("./hooks/useGetResizeColumn"));
+var useRenderRowActions_1 = __importDefault(require("./hooks/useRenderRowActions"));
+var addIndexToObject_1 = __importDefault(require("./addIndexToObject"));
+var useGetColumnsWithCheckbox_1 = __importDefault(require("./hooks/useGetColumnsWithCheckbox"));
+var useGetDeleteRow_1 = __importDefault(require("./hooks/useGetDeleteRow"));
+var useResizeColumns_1 = __importDefault(require("./hooks/useResizeColumns"));
+var useLoadDataSource_1 = __importDefault(require("./hooks/useLoadDataSource"));
+var areProvidedColumnsDifferent_1 = __importDefault(require("./areProvidedColumnsDifferent"));
+var useFetchPage_1 = __importDefault(require("./hooks/useFetchPage"));
+var FloatingActions_1 = __importDefault(require("./FloatingActions"));
+var DataTableWrapper_1 = __importDefault(require("./DataTableWrapper"));
+var styles_1 = require("./styles");
+var usePageSize_1 = require("./hooks/usePageSize");
+var OrderProvider_1 = require("./providers/OrderProvider");
+var ROW_SIZE = config_1.default.ROW_SIZE, ROW_SIZE_MOBILE = config_1.default.ROW_SIZE_MOBILE, MOBILE_BREAKPOINT = config_1.default.MOBILE_BREAKPOINT;
+var getSearchBarCollapsed = function (s) { return s.searchBarCollapsed; };
+exports.MARGIN_FOR_SPINNER = 55;
+function BaseTable(_a) {
+    var _b, _c;
+    var style = _a.style, providedColumns = _a.columns, filters = _a.filters, actions = _a.actions, loadPage = _a.loadPage, onDelete = _a.onDelete, added = _a.added, dataSource = _a.dataSource, withCheckbox = _a.withCheckbox, checked = _a.checked, setChecked = _a.setChecked, selected = _a.selected, _d = _a.loadingDataSource, loadingDataSource = _d === void 0 ? false : _d, floatingActions = _a.floatingActions, suspend = _a.suspend, pinned = _a.pinned, _e = _a.useData, useData = _e === void 0 ? (react_1.useState) : _e, responsive = _a.responsive, deleteMessage = _a.deleteMessage, idKey = _a.idKey;
+    var order = (0, OrderProvider_1.useOrder)().order;
+    var _f = (0, react_1.useState)(ROW_SIZE), rowSize = _f[0], setRowSize = _f[1];
+    var main = (0, react_1.useRef)(null);
+    var table = (0, react_1.useRef)(null);
+    var grid = (0, react_1.useRef)(null);
+    var _g = (0, react_1.useState)(((_b = main.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) || 0), listWidth = _g[0], setListWidth = _g[1];
+    var _h = (0, react_1.useState)((((_c = main.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0) - rowSize), listHeight = _h[0], setListHeight = _h[1];
+    var _j = (0, react_1.useState)(), hoveredRow = _j[0], setHoveredRow = _j[1]; // TODO: is it used anywhere?
+    var _k = useData((dataSource === null || dataSource === void 0 ? void 0 : dataSource.map((addIndexToObject_1.default))) || undefined), data = _k[0], setData = _k[1];
+    var _l = (0, react_1.useState)(), total = _l[0], setTotal = _l[1];
+    var _m = (0, react_1.useState)(providedColumns), columns = _m[0], setColumns = _m[1];
+    var _o = (0, react_1.useState)(false), loading = _o[0], setLoading = _o[1];
+    var _p = (0, react_1.useState)(), actionsFor = _p[0], setActionsFor = _p[1];
+    var _q = (0, react_1.useState)({
+        top: -20,
+        width: 0,
+        transition: '',
+    }), actionsDimensions = _q[0], setActionsDimensions = _q[1];
+    var collapsed = (0, react_redux_1.useSelector)(getSearchBarCollapsed);
+    var menuCollapsed = (0, react_redux_1.useSelector)(function (state) { return state.menuCollapsed; });
+    (0, react_1.useEffect)(function () {
+        setLoading(loadingDataSource);
+    }, [loadingDataSource]);
+    var deleteRow = (0, useGetDeleteRow_1.default)({
+        deleteMessage: deleteMessage,
+        onDelete: onDelete,
+        setData: setData,
+        data: data,
+    });
+    var resizeCol = (0, useGetResizeColumn_1.default)({ columns: columns, setColumns: setColumns });
+    var CellRenderer = (0, useGetCellRenderer_1.default)({
+        idKey: idKey,
+        columns: columns,
+        // TODO: improve
+        data: data,
+        actions: actions,
+        resizeCol: resizeCol,
+        setHoveredRow: setHoveredRow,
+        hoveredRow: hoveredRow,
+        selected: typeof selected === 'object'
+            ? selected === null || selected === void 0 ? void 0 : selected.id
+            : selected,
+        checked: checked,
+    });
+    var RowActions = (0, useRenderRowActions_1.default)({ data: data, actions: actions, deleteRow: deleteRow });
+    var getColumnsWithActions = (0, react_1.useCallback)(function (updatedColumns) {
+        var newUpdatedColumns = __spreadArray([], updatedColumns, true);
+        if (newUpdatedColumns[newUpdatedColumns.length - 1].key === 'akcje') {
+            newUpdatedColumns[newUpdatedColumns.length - 1] = __assign(__assign({}, newUpdatedColumns[newUpdatedColumns.length - 1]), { render: RowActions });
+        }
+        else if (actions.width) {
+            newUpdatedColumns.push({
+                title: 'Akcja',
+                width: actions.width,
+                key: 'akcje',
+                render: RowActions,
+            });
+        }
+        return newUpdatedColumns;
+    }, [RowActions, actions]);
+    var RowCheckbox = (0, useGetRowCheckbox_1.default)({
+        checked: checked,
+        setChecked: setChecked,
+    });
+    var getColumnsWithCheckbox = (0, useGetColumnsWithCheckbox_1.default)({
+        data: data,
+        checked: checked,
+        RowCheckbox: RowCheckbox,
+    });
+    var addCheckboxAndActions = (0, react_1.useCallback)(function () {
+        var updatedColumns = __spreadArray([], columns, true);
+        if (withCheckbox) {
+            updatedColumns = getColumnsWithCheckbox(updatedColumns);
+        }
+        if (!floatingActions && actions && actions.width) {
+            updatedColumns = getColumnsWithActions(updatedColumns);
+        }
+        if (withCheckbox || (!floatingActions && actions && actions.width)) {
+            // if (JSON.stringify(updatedColumns) !== JSON.stringify(columns)) {
+            setColumns(updatedColumns);
+            // }
+        }
+    }, [
+        getColumnsWithCheckbox,
+        getColumnsWithActions,
+        // columns,
+        withCheckbox,
+        actions,
+        floatingActions,
+    ]);
+    (0, react_1.useEffect)(function () {
+        addCheckboxAndActions();
+    }, [addCheckboxAndActions, checked, data]);
+    var resizeColumns = (0, useResizeColumns_1.default)({
+        providedColumns: providedColumns,
+        columns: columns,
+        main: main,
+        floatingActions: floatingActions,
+        actions: actions,
+        setColumns: setColumns,
+        grid: grid,
+    });
+    (0, react_1.useEffect)(function () {
+        resizeColumns();
+    }, [resizeColumns, columns, collapsed, menuCollapsed, listWidth, listHeight]);
+    (0, react_1.useEffect)(function () {
+        var _a;
+        setListHeight(((_a = main.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0 - rowSize);
+    }, [collapsed]);
+    var pageSize = (0, usePageSize_1.usePageSize)({ mainRef: main, rowSize: rowSize });
+    var handleResize = (0, react_1.useCallback)(function () {
+        if (main.current) {
+            if (responsive) {
+                setRowSize(main.current.offsetWidth < MOBILE_BREAKPOINT
+                    ? ROW_SIZE_MOBILE
+                    : ROW_SIZE);
+            }
+            setListWidth(main.current.offsetWidth);
+            setListHeight(main.current.offsetHeight - rowSize);
+        }
+    }, [main]);
+    (0, react_1.useEffect)(function () {
+        handleResize();
+    }, [handleResize, menuCollapsed]);
+    (0, react_1.useEffect)(function () {
+        if (main.current) {
+            if (responsive) {
+                setRowSize(main.current.offsetWidth < MOBILE_BREAKPOINT
+                    ? ROW_SIZE_MOBILE
+                    : ROW_SIZE);
+            }
+            setListWidth(main.current.offsetWidth);
+            setListHeight(main.current.offsetHeight - rowSize);
+        }
+        window.removeEventListener('resize', handleResize);
+        window.addEventListener('resize', handleResize);
+        return function () { return window.removeEventListener('resize', handleResize); };
+    }, [handleResize]);
+    (0, react_1.useEffect)(function () {
+        if ((0, areProvidedColumnsDifferent_1.default)(providedColumns, columns)) {
+            setColumns(providedColumns);
+        }
+    }, [providedColumns, columns]);
+    var floatingButtons = (0, react_1.useMemo)(function () {
+        if (actions) {
+            return __spreadArray(__spreadArray([], (actions.floatingOnly || []), true), (actions.buttons || []), true);
+        }
+        return undefined;
+    }, [actions]);
+    var fetchPage = (0, useFetchPage_1.default)({
+        suspend: suspend,
+        setLoading: setLoading,
+        pageSize: pageSize,
+        loadPage: loadPage,
+        filters: filters,
+        // TODO: improve
+        data: data,
+        pinned: pinned,
+        setData: setData,
+        setTotal: setTotal,
+    });
+    (0, useLoadDataSource_1.default)({
+        filters: filters,
+        added: added,
+        data: data,
+        dataSource: dataSource,
+        setData: setData,
+        fetchPage: fetchPage,
+        pageSize: pageSize,
+        loadPage: loadPage,
+    });
+    var hide = (0, react_1.useCallback)(function (e) {
+        if (!actionsFor) {
+            return;
+        }
+        if (e) {
+            e.stopPropagation();
+        }
+        setActionsFor(undefined);
+        setActionsDimensions(__assign(__assign({}, actionsDimensions), { width: 0, transition: '' }));
+    }, [actionsFor, actionsDimensions]);
+    var scrolled = (0, react_1.useCallback)(function (_a) {
+        var scrollTop = _a.scrollTop, clientHeight = _a.clientHeight;
+        if (actionsFor) {
+            hide();
+        }
+        if (dataSource !== undefined || loading || data.length === total) {
+            return;
+        }
+        var page = Math.ceil((data.length - ((pinned === null || pinned === void 0 ? void 0 : pinned.length) || 0)) / pageSize());
+        if (scrollTop < clientHeight * (page - 1)) {
+            return;
+        }
+        fetchPage(page);
+    }, [
+        fetchPage,
+        actionsFor,
+        dataSource,
+        data,
+        loading,
+        total,
+        pageSize,
+        hide,
+        pinned === null || pinned === void 0 ? void 0 : pinned.length,
+    ]);
+    (0, react_1.useEffect)(function () {
+        if (loadPage !== undefined) {
+            fetchPage(0);
+        }
+    }, [order]);
+    (0, react_1.useEffect)(function () {
+        window.addEventListener('click', hide);
+        return function () { return window.removeEventListener('click', hide); };
+    }, [hide, actionsFor, actionsDimensions]);
+    var actionHover = (0, react_1.useCallback)(function () {
+        if (Array.isArray(floatingButtons)) {
+            setActionsDimensions(__assign(__assign({}, actionsDimensions), { width: floatingButtons.length * 24 +
+                    (floatingButtons.length - 1) * 28 +
+                    (actions.delete ? 53 : 0) +
+                    98 +
+                    (actions.additionalWidth || 0), transition: 'width 150ms ease-in-out' }));
+        }
+    }, [actionsDimensions, floatingButtons, actions]);
+    var actionLeave = (0, react_1.useCallback)(function () {
+        if (Array.isArray(floatingButtons) && actionsFor) {
+            setActionsDimensions(__assign(__assign({}, actionsDimensions), { width: floatingButtons.length * 24 +
+                    (floatingButtons.length - 1) * 28 +
+                    (actions.delete ? 53 : 0) +
+                    74 }));
+        }
+    }, [actionsFor, actionsDimensions, floatingButtons, actions]);
+    var isVisibleCellRenderer = (0, react_1.useCallback)(function (_a) {
+        var columnIndex = _a.columnIndex, key = _a.key, rowIndex = _a.rowIndex, cellStyle = _a.style, isVisible = _a.isVisible, isScrolling = _a.isScrolling;
+        if (isVisible) {
+            return (react_1.default.createElement(CellRenderer, { isVisible: isVisible, columnIndex: columnIndex, key: key, rowKey: key, rowIndex: rowIndex, isScrolling: isScrolling, style: cellStyle }));
+        }
+        return null;
+    }, [CellRenderer]);
+    return (react_1.default.createElement(styles_1.DataTable, { style: style, className: "data-table", ref: main },
+        ((actions === null || actions === void 0 ? void 0 : actions.both) || floatingActions) && actions ? (react_1.default.createElement(FloatingActions_1.default, { actionsDimensions: actionsDimensions, actionsFor: actionsFor, floatingButtons: floatingButtons, actionHover: actionHover, actionLeave: actionLeave, hide: hide, actions: actions })) : undefined,
+        react_1.default.createElement(DataTableWrapper_1.default, null,
+            react_1.default.createElement(styles_1.StyledTable, { className: "table", ref: table }, data && (react_1.default.createElement(react_virtualized_1.MultiGrid, { cellRenderer: isVisibleCellRenderer, height: listHeight, width: listWidth, columnWidth: function (_a) {
+                    var index = _a.index;
+                    return columns[index].width;
+                }, rowHeight: rowSize, fixedRowCount: 1, columnCount: columns.length, rowCount: data.length + 1, overscanRowCount: 22, styleBottomLeftGrid: { outline: 'none' }, styleBottomRightGrid: { outline: 'none' }, onScroll: scrolled, ref: grid }))),
+            data && loading ? react_1.default.createElement(Spinner_1.default, null) : undefined),
+        !data ? (react_1.default.createElement("div", { className: "data-table-no-data" }, loading ? react_1.default.createElement(antd_1.Spin, null) : react_1.default.createElement(antd_1.Empty, { description: "Brak danych" }))) : undefined));
+}
+function Table(props) {
+    return (react_1.default.createElement(OrderProvider_1.OrderProvider, null,
+        react_1.default.createElement(BaseTable, __assign({}, props))));
+}
+exports.default = Table;

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

@@ -0,0 +1,3 @@
+export default function addIndexToObject<DataType = Record<string, unknown>>(e: DataType, i: number): DataType & {
+    index: number;
+};

package/dist/components/Table/addIndexToObject.js

@@ -0,0 +1,17 @@
+"use strict";
+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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+function addIndexToObject(e, i) {
+    return __assign(__assign({}, e), { index: i + 1 });
+}
+exports.default = addIndexToObject;

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

@@ -0,0 +1,2 @@
+import { DataRow, TableColumn } from '../../app_types';
+export default function areProvidedColumnsDifferent<DataType = DataRow>(providedColumns: TableColumn<DataType>[], currentColumns: TableColumn<DataType>[]): boolean;

package/dist/components/Table/areProvidedColumnsDifferent.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function areProvidedColumnsDifferent(providedColumns, currentColumns) {
+    var providedKeys = providedColumns.map(function (c) { return String(c.key).toLowerCase(); });
+    var currentKeys = currentColumns.map(function (c) { return String(c.key).toLowerCase(); });
+    var currentHasActions = currentKeys.includes('akcje');
+    var providedHasActions = providedKeys.includes('akcje');
+    var currentHasCheckbox = currentKeys.includes('checkbox');
+    var providedHasCheckbox = providedKeys.includes('checkbox');
+    var providedKeysWithAdditional = providedKeys.concat(currentHasActions && !providedHasActions ? ['akcje'] : []);
+    if (currentHasCheckbox && !providedHasCheckbox) {
+        providedKeysWithAdditional.unshift('checkbox');
+    }
+    return (JSON.stringify(providedKeysWithAdditional) !== JSON.stringify(currentKeys));
+}
+exports.default = areProvidedColumnsDifferent;

package/dist/components/Table/clicked.js

@@ -0,0 +1,11 @@
+import { displayActions } from "./displayActions";
+var clicked = function(e, row, type) {
+    if (type === 0) {
+        // Left-click
+        if (actionsFor) hide();
+        else if (withCheckbox) onChecked(row, checked.indexOf(row) === -1);
+    } else if (type === 1) {
+        // Right-click
+        if ((actions === null || actions === void 0 ? void 0 : actions.both) || floatingActions) displayActions(e, row);
+    }
+};

package/dist/components/Table/displayActions.js

@@ -0,0 +1,11 @@
+// TODO: remove?
+import { ROW_SIZE } from "./index";
+export default function displayActions(e, row) {
+    if (actionsFor) e.stopPropagation();
+    setActionsFor(row);
+    setActionsDimensions({
+        top: (data ? (ROW_SIZE + 1) * data.indexOf(row) - 50 : -50) - wrapper.current.scrollTop,
+        width: floatingButtons.length * 24 + (floatingButtons.length - 1) * 28 + (actions.delete ? 53 : 0) + 74,
+        transition: actionsFor ? "top 150ms ease-in-out" : undefined
+    });
+};

package/dist/components/Table/hooks/useFetchPage.d.ts

@@ -0,0 +1,18 @@
+import { loadPage as loadPageType } from '../../../app_types';
+type Props<DataType extends object> = {
+    suspend?: boolean;
+    setLoading?: (v: boolean) => void;
+    pageSize: () => number;
+    loadPage?: loadPageType<DataType>;
+    filters: any;
+    data: (DataType & {
+        index: number;
+    })[];
+    pinned: DataType[];
+    setData: (rows: (DataType & {
+        index: number;
+    })[]) => void;
+    setTotal: (total: number) => void;
+};
+export default function useFetchPage<DataType extends object>({ suspend, setLoading, pageSize, loadPage, filters, data, pinned, setData, setTotal, }: Props<DataType>): (page: number, size?: number) => Promise<void>;
+export {};

package/dist/components/Table/hooks/useFetchPage.js

@@ -0,0 +1,123 @@
+"use strict";
+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;
+    return g = { next: verb(0), "throw": verb(1), "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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var antd_1 = require("antd");
+var react_1 = require("react");
+var addIndexToObject_1 = __importDefault(require("../addIndexToObject"));
+var OrderProvider_1 = require("../providers/OrderProvider");
+function useFetchPage(_a) {
+    var _this = this;
+    var suspend = _a.suspend, setLoading = _a.setLoading, pageSize = _a.pageSize, loadPage = _a.loadPage, filters = _a.filters, data = _a.data, pinned = _a.pinned, setData = _a.setData, setTotal = _a.setTotal;
+    var order = (0, OrderProvider_1.useOrder)().order;
+    return (0, react_1.useCallback)(function (page, size) { return __awaiter(_this, void 0, void 0, function () {
+        var loaded, newData_1, e_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (typeof suspend === 'boolean' && suspend) {
+                        setLoading(false);
+                        return [2 /*return*/];
+                    }
+                    if (size === undefined) {
+                        size = pageSize();
+                    }
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, 4, 5]);
+                    setLoading(true);
+                    return [4 /*yield*/, loadPage(page, size, filters, order)];
+                case 2:
+                    loaded = _a.sent();
+                    if (page !== 0) {
+                        newData_1 = __spreadArray(__spreadArray([], (data || []), true), loaded.data, true);
+                    }
+                    else {
+                        newData_1 = loaded.data || [];
+                    }
+                    if (Array.isArray(pinned)) {
+                        pinned.forEach(function (pinnedEl, pinnedIdx) {
+                            var indexes = newData_1
+                                .map(function (_a, index) {
+                                var id = _a.id;
+                                return ({ id: id, index: index });
+                            })
+                                // TODO fix
+                                // @ts-ignore
+                                .filter(function (el) { return el.id === pinnedEl.id; })
+                                .map(function (_a) {
+                                var index = _a.index;
+                                return index;
+                            });
+                            indexes.forEach(function (index) {
+                                if (index !== pinnedIdx) {
+                                    newData_1.splice(index, 1);
+                                }
+                            });
+                            if (!indexes.includes(pinnedIdx)) {
+                                newData_1.unshift(pinnedEl);
+                            }
+                        });
+                    }
+                    setData(newData_1.map(addIndexToObject_1.default));
+                    setTotal(loaded.total);
+                    return [3 /*break*/, 5];
+                case 3:
+                    e_1 = _a.sent();
+                    antd_1.message.error("".concat(e_1));
+                    return [3 /*break*/, 5];
+                case 4:
+                    setLoading(false);
+                    return [7 /*endfinally*/];
+                case 5: return [2 /*return*/];
+            }
+        });
+    }); }, [suspend, pageSize, loadPage, filters, data, order]);
+}
+exports.default = useFetchPage;

package/dist/components/Table/hooks/useGetCellRenderer.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Actions, DataRow, TableColumn } from '../../../app_types';
+import { ResizeColumnType } from './useGetResizeColumn';
+type Props<DataType = DataRow> = {
+    idKey?: keyof DataType;
+    columns: TableColumn<DataType>[];
+    data?: (DataType & {
+        index: number;
+    })[];
+    actions: Actions<DataType>;
+    resizeCol: ResizeColumnType;
+    setHoveredRow: (prev: unknown) => void;
+    hoveredRow: undefined;
+    selected: number | DataType;
+    checked: number[];
+};
+export default function useGetCellRenderer<DataType extends object>({ columns, data, actions, resizeCol, setHoveredRow, hoveredRow, selected, checked, idKey, }: Props<DataType>): ({ columnIndex, rowIndex, rowKey, style, isScrolling, isVisible }: any) => React.JSX.Element;
+export {};