npm - pixelize-design-library - Versions diffs - 1.1.58 → 1.1.59 - Mend

pixelize-design-library 1.1.58 → 1.1.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/Components/Table/Components/useTable.d.ts +2 -1
package/dist/Components/Table/Components/useTable.js +14 -2
package/dist/Components/Table/Table.d.ts +1 -1
package/dist/Components/Table/Table.js +5 -3
package/dist/Components/Table/TableProps.d.ts +1 -1
package/package.json +1 -1

package/dist/Components/Table/Components/useTable.d.ts CHANGED Viewed

@@ -11,8 +11,9 @@ type UseTableProps = {
     savePreferences?: (data: Record<string, any>) => void;
     noOfRowsPerPage?: number;
     isServerPagination: boolean;
+    totalRecords: number;
 };
-declare const useTable: ({ tableBorderColor, data, isPagination, selections, columns, onSelection, tablePreferences, savePreferences, noOfRowsPerPage, isServerPagination, }: UseTableProps) => {
+declare const useTable: ({ tableBorderColor, data, isPagination, selections, columns, onSelection, tablePreferences, savePreferences, noOfRowsPerPage, isServerPagination, totalRecords, }: UseTableProps) => {
     tableData: DataObject[];
     tableContainerStyles: {
         borderRadius: string;

package/dist/Components/Table/Components/useTable.js CHANGED Viewed

@@ -25,7 +25,7 @@ var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
 var table_1 = require("../../../Utils/table");
 var defaultPageSize = 50;
 var useTable = function (_a) {
-    var tableBorderColor = _a.tableBorderColor, data = _a.data, isPagination = _a.isPagination, selections = _a.selections, columns = _a.columns, onSelection = _a.onSelection, tablePreferences = _a.tablePreferences, savePreferences = _a.savePreferences, noOfRowsPerPage = _a.noOfRowsPerPage, isServerPagination = _a.isServerPagination;
+    var tableBorderColor = _a.tableBorderColor, data = _a.data, isPagination = _a.isPagination, selections = _a.selections, columns = _a.columns, onSelection = _a.onSelection, tablePreferences = _a.tablePreferences, savePreferences = _a.savePreferences, noOfRowsPerPage = _a.noOfRowsPerPage, isServerPagination = _a.isServerPagination, totalRecords = _a.totalRecords;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     var headerRefs = (0, react_1.useRef)([]);
     var _b = (0, react_1.useState)([]), columnWidths = _b[0], setColumnWidths = _b[1];
@@ -66,7 +66,19 @@ var useTable = function (_a) {
         var widths = headerRefs.current.map(function (ref) { return (ref === null || ref === void 0 ? void 0 : ref.offsetWidth) || 0; });
         setColumnWidths(widths);
     }, []);
-    var pages = (0, react_1.useMemo)(function () { return (isPagination ? Math.ceil(tableData.length / rowsPerPage) : 0); }, [isPagination, rowsPerPage, tableData.length]);
+    var pages = (0, react_1.useMemo)(function () {
+        if (isServerPagination) {
+            return Math.ceil(totalRecords / (noOfRowsPerPage !== null && noOfRowsPerPage !== void 0 ? noOfRowsPerPage : 1));
+        }
+        return isPagination ? Math.ceil(tableData.length / rowsPerPage) : 0;
+    }, [
+        isPagination,
+        rowsPerPage,
+        tableData.length,
+        totalRecords,
+        isServerPagination,
+        noOfRowsPerPage,
+    ]);
     var startRow = (0, react_1.useMemo)(function () { return (!isPagination ? 0 : currentPage * rowsPerPage); }, [currentPage, isPagination, rowsPerPage]);
     var endRow = (0, react_1.useMemo)(function () { return (!isPagination ? tableData.length : startRow + rowsPerPage); }, [isPagination, rowsPerPage, startRow, tableData.length]);
     (0, react_1.useEffect)(function () {

package/dist/Components/Table/Table.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 import React from "react";
 import { TableProps } from "./TableProps";
 import "./Table.css";
-export default function Table({ data, columns, onSelection, isLoading, isCheckbox, headerBgColor, freezedBgColor, headerTextColor, freezedTextColor, tableBorderColor, noBorders, isPagination, onRowClick, selections, isActionFreeze, preferencesUrl, preferencesKey, preferencesName, preferencesPage, authToken, paginationMode, noOfRowsPerPage, totalPages, onPagination, }: TableProps): React.JSX.Element;
+export default function Table({ data, columns, onSelection, isLoading, isCheckbox, headerBgColor, freezedBgColor, headerTextColor, freezedTextColor, tableBorderColor, noBorders, isPagination, onRowClick, selections, isActionFreeze, preferencesUrl, preferencesKey, preferencesName, preferencesPage, authToken, paginationMode, noOfRowsPerPage, totalRecords, onPagination, }: TableProps): React.JSX.Element;

package/dist/Components/Table/Table.js CHANGED Viewed

@@ -39,9 +39,10 @@ var table_1 = require("../../Utils/table");
 var usePreferences_1 = require("../../Hooks/usePreferences");
 function Table(_a) {
     var _b, _c, _d;
-    var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _e = _a.isCheckbox, isCheckbox = _e === void 0 ? false : _e, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _f = _a.noBorders, noBorders = _f === void 0 ? false : _f, _g = _a.isPagination, isPagination = _g === void 0 ? true : _g, onRowClick = _a.onRowClick, selections = _a.selections, _h = _a.isActionFreeze, isActionFreeze = _h === void 0 ? true : _h, _j = _a.preferencesUrl, preferencesUrl = _j === void 0 ? "https://pixelize.memron.net:5001/api/UserPreference" : _j, _k = _a.preferencesKey, preferencesKey = _k === void 0 ? "" : _k, _l = _a.preferencesName, preferencesName = _l === void 0 ? "" : _l, _m = _a.preferencesPage, preferencesPage = _m === void 0 ? "" : _m, _o = _a.authToken, authToken = _o === void 0 ? "" : _o, _p = _a.paginationMode, paginationMode = _p === void 0 ? "client" : _p, _q = _a.noOfRowsPerPage, noOfRowsPerPage = _q === void 0 ? 50 : _q, _r = _a.totalPages, totalPages = _r === void 0 ? 0 : _r, onPagination = _a.onPagination;
+    var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _e = _a.isCheckbox, isCheckbox = _e === void 0 ? false : _e, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _f = _a.noBorders, noBorders = _f === void 0 ? false : _f, _g = _a.isPagination, isPagination = _g === void 0 ? true : _g, onRowClick = _a.onRowClick, selections = _a.selections, _h = _a.isActionFreeze, isActionFreeze = _h === void 0 ? true : _h, _j = _a.preferencesUrl, preferencesUrl = _j === void 0 ? "https://pixelize.memron.net:5001/api/UserPreference" : _j, _k = _a.preferencesKey, preferencesKey = _k === void 0 ? "" : _k, _l = _a.preferencesName, preferencesName = _l === void 0 ? "" : _l, _m = _a.preferencesPage, preferencesPage = _m === void 0 ? "" : _m, _o = _a.authToken, authToken = _o === void 0 ? "" : _o, _p = _a.paginationMode, paginationMode = _p === void 0 ? "client" : _p, _q = _a.noOfRowsPerPage, noOfRowsPerPage = _q === void 0 ? 50 : _q, _r = _a.totalRecords, totalRecords = _r === void 0 ? 0 : _r, onPagination = _a.onPagination;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     var _s = (0, react_1.useState)({}), columnsSearch = _s[0], setColumnsSearch = _s[1];
+    var isServerPagination = paginationMode === "server";
     var _t = (0, usePreferences_1.useGetPreferences)({
         baseUrl: preferencesUrl,
         page: preferencesPage,
@@ -75,7 +76,8 @@ function Table(_a) {
         tablePreferences: tablePreferences,
         savePreferences: savePreferences,
         noOfRowsPerPage: noOfRowsPerPage,
-        isServerPagination: paginationMode === "server",
+        totalRecords: totalRecords,
+        isServerPagination: isServerPagination,
     }), tableData = _u.tableData, tableContainerStyles = _u.tableContainerStyles, isContent = _u.isContent, isLink = _u.isLink, headerRefs = _u.headerRefs, columnWidths = _u.columnWidths, visibleColumns = _u.visibleColumns, handleSort = _u.handleSort, handleCheckbox = _u.handleCheckbox, filteredData = _u.filteredData, startRow = _u.startRow, endRow = _u.endRow, selection = _u.selection, columnsSort = _u.columnsSort, currentPage = _u.currentPage, pages = _u.pages, rowsPerPage = _u.rowsPerPage, handleColumnVisibilityChange = _u.handleColumnVisibilityChange, handlePageSizeChange = _u.handlePageSizeChange, setCurrentPage = _u.setCurrentPage;
     var _filteredData = (0, react_1.useMemo)(function () {
         return (0, table_1.searchAndSortData)(filteredData, columnsSearch);
@@ -96,6 +98,6 @@ function Table(_a) {
                                 : "indeterminate", isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze, setColumnsSearch: setColumnsSearch, columnsSearch: columnsSearch })),
                 react_1.default.createElement(react_3.Tbody, null,
                     react_1.default.createElement(TableBody_1.default, { data: _filteredData, columns: columns, startRow: startRow, endRow: endRow, visibleColumns: visibleColumns, isCheckbox: isCheckbox, columnWidths: columnWidths, noBorders: noBorders, freezedBgColor: freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : theme.colors.backgroundColor.secondary, freezedTextColor: freezedTextColor !== null && freezedTextColor !== void 0 ? freezedTextColor : (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.gray[600], handleCheckbox: handleCheckbox, selections: selection, isLoading: isTableLoading, onRowClick: onRowClick, isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze })))),
-        isPagination && (react_1.default.createElement(Pagination_1.default, { columns: columns, currentPage: currentPage, setCurrentPage: setCurrentPage, rowsPerPage: rowsPerPage, pages: paginationMode === "server" ? totalPages : pages, paginationText: "".concat(startRow + 1, " to ").concat(endRow, " of ").concat(tableData.length), handlePageSizeChange: handlePageSizeChange, dataLength: tableData.length, isServerPagination: paginationMode === "server", visibleColumns: visibleColumns, handleColumnVisibilityChange: handleColumnVisibilityChange, isVisiblity: true }))));
+        (isPagination || isServerPagination) && (react_1.default.createElement(Pagination_1.default, { columns: columns, currentPage: currentPage, setCurrentPage: setCurrentPage, rowsPerPage: rowsPerPage, pages: pages, paginationText: "".concat(startRow + 1, " to ").concat(endRow, " of ").concat(isServerPagination ? totalRecords : tableData.length), handlePageSizeChange: handlePageSizeChange, dataLength: tableData.length, isServerPagination: isServerPagination, visibleColumns: visibleColumns, handleColumnVisibilityChange: handleColumnVisibilityChange, isVisiblity: true }))));
 }
 exports.default = Table;

package/dist/Components/Table/TableProps.d.ts CHANGED Viewed

@@ -26,7 +26,7 @@ export type TableProps = {
     authToken?: string;
     paginationMode?: "client" | "server";
     noOfRowsPerPage?: number;
-    totalPages?: number;
+    totalRecords?: number;
     onPagination?: (page: number, noOfRecords: number) => void;
 };
 export type DataObject = {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "1.1.58",
+  "version": "1.1.59",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",