react-table-edit 0.5.3 → 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)(
@@ -2201,7 +2228,7 @@ var TableEdit = (0, import_react13.forwardRef)((props, ref) => {
2201
2228
  },
2202
2229
  children: [
2203
2230
  item.icon && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(icon_default, { iconName: item.icon, size: 16 }),
2204
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.UncontrolledTooltip, { target: `command-item-${i}`, place: "top", children: t(item.tooltip ?? "") })
2231
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.UncontrolledTooltip, { className: "r-tooltip", target: `command-item-${i}`, place: "top", children: t(item.tooltip ?? "") })
2205
2232
  ]
2206
2233
  },
2207
2234
  `command-${index}`
@@ -2700,8 +2727,15 @@ var TableEdit = (0, import_react13.forwardRef)((props, ref) => {
2700
2727
  children: [
2701
2728
  typeDis === 1 && !refreshRow ? renderEdit(row, col, indexRow, indexCol) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { id: `content-${indexRow}-${indexCol}`, className: "r-cell-text", children: typeDis === 2 ? col.template(row, indexRow) : value }),
2702
2729
  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { id: `error-${indexRow}-${indexCol}`, className: (0, import_classnames11.default)("cursor-pointer text-primary icon-table", { "d-none": !errorMessage }), children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_becoxy_icons5.AlertCircle, { fontSize: 15.5 }) }),
2703
- !(typeDis === 1 && !refreshRow) && col.haveToolTip && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.UncontrolledTooltip, { style: { fontSize: 11 }, autohide: false, target: `content-${indexRow}-${indexCol}`, children: typeDis === 2 ? col.template(row, indexRow) : value }),
2704
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.UncontrolledTooltip, { target: `error-${indexRow}-${indexCol}`, children: errorMessage?.toString() ?? "" })
2730
+ !(typeDis === 1 && !refreshRow) && col.haveToolTip && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.UncontrolledTooltip, { className: "r-tooltip", autohide: false, target: `content-${indexRow}-${indexCol}`, children: typeDis === 2 ? col.template(row, indexRow) : value }),
2731
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
2732
+ import_reactstrap8.UncontrolledTooltip,
2733
+ {
2734
+ target: `error-${indexRow}-${indexCol}`,
2735
+ className: "r-tooltip tooltip-error",
2736
+ children: errorMessage?.toString() ?? ""
2737
+ }
2738
+ )
2705
2739
  ]
2706
2740
  }
2707
2741
  )
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(
@@ -2159,7 +2186,7 @@ var TableEdit = forwardRef2((props, ref) => {
2159
2186
  },
2160
2187
  children: [
2161
2188
  item.icon && /* @__PURE__ */ jsx13(icon_default, { iconName: item.icon, size: 16 }),
2162
- /* @__PURE__ */ jsx13(UncontrolledTooltip, { target: `command-item-${i}`, place: "top", children: t(item.tooltip ?? "") })
2189
+ /* @__PURE__ */ jsx13(UncontrolledTooltip, { className: "r-tooltip", target: `command-item-${i}`, place: "top", children: t(item.tooltip ?? "") })
2163
2190
  ]
2164
2191
  },
2165
2192
  `command-${index}`
@@ -2658,8 +2685,15 @@ var TableEdit = forwardRef2((props, ref) => {
2658
2685
  children: [
2659
2686
  typeDis === 1 && !refreshRow ? renderEdit(row, col, indexRow, indexCol) : /* @__PURE__ */ jsx13("div", { id: `content-${indexRow}-${indexCol}`, className: "r-cell-text", children: typeDis === 2 ? col.template(row, indexRow) : value }),
2660
2687
  /* @__PURE__ */ jsx13("span", { id: `error-${indexRow}-${indexCol}`, className: classnames6("cursor-pointer text-primary icon-table", { "d-none": !errorMessage }), children: /* @__PURE__ */ jsx13(AlertCircle, { fontSize: 15.5 }) }),
2661
- !(typeDis === 1 && !refreshRow) && col.haveToolTip && /* @__PURE__ */ jsx13(UncontrolledTooltip, { style: { fontSize: 11 }, autohide: false, target: `content-${indexRow}-${indexCol}`, children: typeDis === 2 ? col.template(row, indexRow) : value }),
2662
- /* @__PURE__ */ jsx13(UncontrolledTooltip, { target: `error-${indexRow}-${indexCol}`, children: errorMessage?.toString() ?? "" })
2688
+ !(typeDis === 1 && !refreshRow) && col.haveToolTip && /* @__PURE__ */ jsx13(UncontrolledTooltip, { className: "r-tooltip", autohide: false, target: `content-${indexRow}-${indexCol}`, children: typeDis === 2 ? col.template(row, indexRow) : value }),
2689
+ /* @__PURE__ */ jsx13(
2690
+ UncontrolledTooltip,
2691
+ {
2692
+ target: `error-${indexRow}-${indexCol}`,
2693
+ className: "r-tooltip tooltip-error",
2694
+ children: errorMessage?.toString() ?? ""
2695
+ }
2696
+ )
2663
2697
  ]
2664
2698
  }
2665
2699
  )
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-table-edit",
3
3
  "license": "MIT",
4
- "version": "0.5.3",
4
+ "version": "0.5.5",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
7
7
  "types": "dist/index.d.ts",