react-table-edit 0.5.4 → 0.5.5

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.
package/dist/index.js CHANGED
@@ -1493,13 +1493,16 @@ var import_jsx_runtime12 = require("react/jsx-runtime");
1493
1493
  var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOptions, onChangePageSize }) => {
1494
1494
  const { t } = (0, import_react_i18next8.useTranslation)();
1495
1495
  const [countPage, setCountPage] = (0, import_react12.useState)(0);
1496
+ const [currentPageNumber, setCurrentPageNumber] = (0, import_react12.useState)(1);
1496
1497
  (0, import_react12.useEffect)(() => {
1497
- const count = Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1);
1498
- setCountPage(count);
1498
+ setCountPage(Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1));
1499
1499
  }, [totalItem, pageSize]);
1500
- const renderPageNumber = () => {
1500
+ (0, import_react12.useEffect)(() => {
1501
+ setCurrentPageNumber(Math.floor(currentPage / 5) + (Math.floor(currentPage / 5) === currentPage / 5 ? 0 : 1));
1502
+ }, [currentPage]);
1503
+ const renderPageNumber = (number) => {
1501
1504
  const arr = [];
1502
- for (let index = 1; index <= Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1); index++) {
1505
+ for (let index = (number - 1) * 5 + 1; index <= number * 5 && index <= Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1); index++) {
1503
1506
  arr.push(
1504
1507
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1505
1508
  "div",
@@ -1519,7 +1522,31 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
1519
1522
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "r-pagercontainer", children: [
1520
1523
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage === 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronsLeft, { fontSize: 16 }) }),
1521
1524
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage === 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage - 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronLeft, { fontSize: 16 }) }),
1522
- renderPageNumber(),
1525
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1526
+ "button",
1527
+ {
1528
+ className: (0, import_classnames10.default)("r-button", { "d-none": currentPageNumber === 1 }),
1529
+ type: "button",
1530
+ onClick: () => {
1531
+ setCurrentPageNumber(currentPageNumber - 1);
1532
+ onChangePage({ totalItem, pageSize, currentPage: (currentPageNumber - 2) * 5 + 1, old: currentPage });
1533
+ },
1534
+ children: "..."
1535
+ }
1536
+ ),
1537
+ renderPageNumber(currentPageNumber),
1538
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1539
+ "button",
1540
+ {
1541
+ className: (0, import_classnames10.default)("r-button", { "d-none": currentPageNumber * 5 >= countPage }),
1542
+ type: "button",
1543
+ onClick: () => {
1544
+ setCurrentPageNumber(currentPageNumber + 1);
1545
+ onChangePage({ totalItem, pageSize, currentPage: currentPageNumber * 5 + 1, old: currentPage });
1546
+ },
1547
+ children: "..."
1548
+ }
1549
+ ),
1523
1550
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage === 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage + 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronRight, { fontSize: 16 }) }),
1524
1551
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage === 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1), old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronsRight, { fontSize: 16 }) }),
1525
1552
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "r-pagesize", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
package/dist/index.mjs CHANGED
@@ -1451,13 +1451,16 @@ import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
1451
1451
  var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOptions, onChangePageSize }) => {
1452
1452
  const { t } = useTranslation8();
1453
1453
  const [countPage, setCountPage] = useState5(0);
1454
+ const [currentPageNumber, setCurrentPageNumber] = useState5(1);
1454
1455
  useEffect6(() => {
1455
- const count = Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1);
1456
- setCountPage(count);
1456
+ setCountPage(Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1));
1457
1457
  }, [totalItem, pageSize]);
1458
- const renderPageNumber = () => {
1458
+ useEffect6(() => {
1459
+ setCurrentPageNumber(Math.floor(currentPage / 5) + (Math.floor(currentPage / 5) === currentPage / 5 ? 0 : 1));
1460
+ }, [currentPage]);
1461
+ const renderPageNumber = (number) => {
1459
1462
  const arr = [];
1460
- for (let index = 1; index <= Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1); index++) {
1463
+ for (let index = (number - 1) * 5 + 1; index <= number * 5 && index <= Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1); index++) {
1461
1464
  arr.push(
1462
1465
  /* @__PURE__ */ jsx12(
1463
1466
  "div",
@@ -1477,7 +1480,31 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
1477
1480
  /* @__PURE__ */ jsxs11("div", { className: "r-pagercontainer", children: [
1478
1481
  /* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage === 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronsLeft, { fontSize: 16 }) }),
1479
1482
  /* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage === 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage - 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronLeft2, { fontSize: 16 }) }),
1480
- renderPageNumber(),
1483
+ /* @__PURE__ */ jsx12(
1484
+ "button",
1485
+ {
1486
+ className: classNames5("r-button", { "d-none": currentPageNumber === 1 }),
1487
+ type: "button",
1488
+ onClick: () => {
1489
+ setCurrentPageNumber(currentPageNumber - 1);
1490
+ onChangePage({ totalItem, pageSize, currentPage: (currentPageNumber - 2) * 5 + 1, old: currentPage });
1491
+ },
1492
+ children: "..."
1493
+ }
1494
+ ),
1495
+ renderPageNumber(currentPageNumber),
1496
+ /* @__PURE__ */ jsx12(
1497
+ "button",
1498
+ {
1499
+ className: classNames5("r-button", { "d-none": currentPageNumber * 5 >= countPage }),
1500
+ type: "button",
1501
+ onClick: () => {
1502
+ setCurrentPageNumber(currentPageNumber + 1);
1503
+ onChangePage({ totalItem, pageSize, currentPage: currentPageNumber * 5 + 1, old: currentPage });
1504
+ },
1505
+ children: "..."
1506
+ }
1507
+ ),
1481
1508
  /* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage === 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage + 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronRight2, { fontSize: 16 }) }),
1482
1509
  /* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage === 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1), old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronsRight, { fontSize: 16 }) }),
1483
1510
  /* @__PURE__ */ jsx12("div", { className: "r-pagesize", children: /* @__PURE__ */ jsx12(
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-table-edit",
3
3
  "license": "MIT",
4
- "version": "0.5.4",
4
+ "version": "0.5.5",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
7
7
  "types": "dist/index.d.ts",