qbs-react-grid 1.0.39 → 1.0.41

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 (7) hide show
  1. package/es/Pagination.js +34 -32
  2. package/es/qbsTable/QbsTable.js +2 -2
  3. package/lib/Pagination.js +34 -32
  4. package/lib/qbsTable/QbsTable.js +2 -2
  5. package/package.json +1 -1
  6. package/src/Pagination.tsx +33 -24
  7. package/src/qbsTable/QbsTable.tsx +3 -2
package/es/Pagination.js CHANGED
@@ -1,22 +1,24 @@
1
1
  import React, { useEffect, useState } from 'react';
2
2
  import { getRowDisplayRange } from './qbsTable/utilities/tablecalc';
3
3
  var PageIndex = function PageIndex(_ref) {
4
- var currentIndex = _ref.currentIndex,
4
+ var currentPage = _ref.currentPage,
5
5
  handleFirst = _ref.handleFirst,
6
6
  pageCount = _ref.pageCount;
7
+ console.log(currentPage, 'insdie subfunction');
7
8
  var renderPageNumbers = function renderPageNumbers() {
9
+ console.log(currentPage, 'insdie last function');
8
10
  var pageNumbers = [];
9
11
 
10
12
  // Add ellipsis if necessary
11
- if (currentIndex > 3) {
13
+ if (currentPage > 3) {
12
14
  pageNumbers.push('...');
13
15
  }
14
- for (var i = Math.max(1, currentIndex - 2); i <= Math.min(pageCount, currentIndex + 2); i++) {
16
+ for (var i = Math.max(1, currentPage - 2); i <= Math.min(pageCount, currentPage + 2); i++) {
15
17
  pageNumbers.push(i);
16
18
  }
17
19
 
18
20
  // Add ellipsis if necessary
19
- if (currentIndex < pageCount - 2) {
21
+ if (currentPage < pageCount - 2) {
20
22
  pageNumbers.push('...');
21
23
  }
22
24
  return pageNumbers.map(function (pageNumber) {
@@ -25,10 +27,10 @@ var PageIndex = function PageIndex(_ref) {
25
27
  onClick: function onClick() {
26
28
  return handleFirst(pageNumber);
27
29
  },
28
- className: "block-item " + (pageNumber === currentIndex ? 'selected' : '')
30
+ className: "block-item " + (pageNumber === currentPage ? 'selected' : '')
29
31
  }, pageNumber) : /*#__PURE__*/React.createElement("span", {
30
32
  key: pageNumber,
31
- className: "block-item " + (pageNumber === currentIndex ? 'selected' : '')
33
+ className: "block-item " + (pageNumber === currentPage ? 'selected' : '')
32
34
  }, pageNumber));
33
35
  });
34
36
  };
@@ -47,45 +49,44 @@ var Pagination = function Pagination(_ref2) {
47
49
  _paginationProps$rows = paginationProps.rowsPerPage,
48
50
  rowsPerPage = _paginationProps$rows === void 0 ? 10 : _paginationProps$rows,
49
51
  onPagination = paginationProps.onPagination;
50
- var _useState = useState(currentPage != null ? currentPage : 1),
51
- currentIndex = _useState[0],
52
- setCurrenIndex = _useState[1];
53
- var _useState2 = useState(rowsPerPage),
54
- rowsPerPageState = _useState2[0],
55
- setRowsPerPageState = _useState2[1];
52
+ var _useState = useState(rowsPerPage),
53
+ rowsPerPageState = _useState[0],
54
+ setRowsPerPageState = _useState[1];
56
55
  var dropData = dropOptions != null ? dropOptions : [10, 20, 50, 100, 200];
57
- var _useState3 = useState(1),
58
- pageCount = _useState3[0],
59
- setPageCount = _useState3[1];
56
+ var _useState2 = useState(1),
57
+ pageCount = _useState2[0],
58
+ setPageCount = _useState2[1];
60
59
  var handleRowsPerPage = function handleRowsPerPage(e) {
61
60
  var value = parseInt(e.target.value);
62
61
  setRowsPerPageState(value);
63
- onRowsPerPage === null || onRowsPerPage === void 0 ? void 0 : onRowsPerPage(value, currentIndex);
62
+ onRowsPerPage === null || onRowsPerPage === void 0 ? void 0 : onRowsPerPage(value, currentPage);
64
63
  };
65
64
  var handleFirst = function handleFirst(index) {
66
- setCurrenIndex(index);
67
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(index, currentIndex);
65
+ // setCurrenIndex(index);
66
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(index, currentPage);
68
67
  };
69
68
  var handleLast = function handleLast() {
70
69
  var value = pageCount != null ? pageCount : 0;
71
- setCurrenIndex(value);
72
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(value, currentIndex);
70
+ // setCurrenIndex(value);
71
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(value, currentPage);
73
72
  };
74
- useEffect(function () {
75
- setCurrenIndex(currentIndex);
76
- }, [currentPage]);
73
+ // useEffect(() => {
74
+ // setCurrenIndex(currentPage);
75
+ // }, [currentPage]);
76
+
77
77
  useEffect(function () {
78
78
  var calculatedPageCount = Math.ceil(total / rowsPerPageState);
79
79
  setPageCount(calculatedPageCount);
80
80
  }, [total, rowsPerPageState]);
81
81
  var handlePrevious = function handlePrevious() {
82
- setCurrenIndex(currentIndex - 1);
83
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentIndex - 1, currentIndex);
82
+ // setCurrenIndex(currentPage - 1);
83
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentPage - 1, currentPage);
84
84
  };
85
85
  var handleNext = function handleNext() {
86
- setCurrenIndex(currentIndex + 1);
87
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentIndex + 1, currentIndex);
86
+ // setCurrenIndex(currentPage + 1);
87
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentPage + 1, currentPage);
88
88
  };
89
+ console.log(currentPage, 'outside function');
89
90
  return /*#__PURE__*/React.createElement("div", {
90
91
  className: 'qbs-table-custom-pagination',
91
92
  style: {
@@ -98,7 +99,7 @@ var Pagination = function Pagination(_ref2) {
98
99
  className: "qbs-table-pagination-right-block"
99
100
  }, /*#__PURE__*/React.createElement("button", {
100
101
  className: "qbs-table-icon-container",
101
- disabled: currentIndex == 1,
102
+ disabled: currentPage == 1,
102
103
  onClick: function onClick() {
103
104
  return handleFirst(1);
104
105
  }
@@ -116,7 +117,7 @@ var Pagination = function Pagination(_ref2) {
116
117
  "stroke-linejoin": "round"
117
118
  }))), /*#__PURE__*/React.createElement("button", {
118
119
  className: "qbs-table-icon-container",
119
- disabled: currentIndex < 2,
120
+ disabled: currentPage < 2,
120
121
  onClick: function onClick() {
121
122
  return handlePrevious();
122
123
  }
@@ -135,12 +136,13 @@ var Pagination = function Pagination(_ref2) {
135
136
  }))), /*#__PURE__*/React.createElement("div", {
136
137
  className: "block-container"
137
138
  }, /*#__PURE__*/React.createElement(PageIndex, {
138
- currentIndex: currentIndex,
139
+ key: currentPage,
140
+ currentPage: currentPage,
139
141
  handleFirst: handleFirst,
140
142
  pageCount: pageCount
141
143
  })), /*#__PURE__*/React.createElement("button", {
142
144
  className: "qbs-table-icon-container",
143
- disabled: currentIndex >= pageCount - 1,
145
+ disabled: currentPage >= pageCount - 1,
144
146
  onClick: function onClick() {
145
147
  return handleNext();
146
148
  }
@@ -158,7 +160,7 @@ var Pagination = function Pagination(_ref2) {
158
160
  "stroke-linejoin": "round"
159
161
  }))), /*#__PURE__*/React.createElement("button", {
160
162
  className: "qbs-table-icon-container",
161
- disabled: currentIndex == pageCount,
163
+ disabled: currentPage == pageCount,
162
164
  onClick: function onClick() {
163
165
  return handleLast();
164
166
  }
package/es/qbsTable/QbsTable.js CHANGED
@@ -152,7 +152,7 @@ var QbsTable = function QbsTable(_ref) {
152
152
  }, []);
153
153
  useEffect(function () {
154
154
  handleColumnToggle === null || handleColumnToggle === void 0 ? void 0 : handleColumnToggle(columns);
155
- }, [columns, handleColumnToggle]);
155
+ }, [columns]);
156
156
  var handleClear = function handleClear(_ref2) {
157
157
  setCheckedKeys([]);
158
158
  handleChecked([]);
@@ -365,7 +365,7 @@ var QbsTable = function QbsTable(_ref) {
365
365
  onChange: handleCheckAll,
366
366
  id: "checkbox-all",
367
367
  className: "qbs-table-checkbox-input " + classes.tableCheckBoxClass,
368
- checked: data.every(function (item) {
368
+ checked: (data === null || data === void 0 ? void 0 : data.length) > 0 && data.every(function (item) {
369
369
  return checkedKeys === null || checkedKeys === void 0 ? void 0 : checkedKeys.includes(item.id);
370
370
  })
371
371
  }), /*#__PURE__*/React.createElement("label", {
package/lib/Pagination.js CHANGED
@@ -7,22 +7,24 @@ var _tablecalc = require("./qbsTable/utilities/tablecalc");
7
7
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
8
8
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
9
9
  var PageIndex = function PageIndex(_ref) {
10
- var currentIndex = _ref.currentIndex,
10
+ var currentPage = _ref.currentPage,
11
11
  handleFirst = _ref.handleFirst,
12
12
  pageCount = _ref.pageCount;
13
+ console.log(currentPage, 'insdie subfunction');
13
14
  var renderPageNumbers = function renderPageNumbers() {
15
+ console.log(currentPage, 'insdie last function');
14
16
  var pageNumbers = [];
15
17
 
16
18
  // Add ellipsis if necessary
17
- if (currentIndex > 3) {
19
+ if (currentPage > 3) {
18
20
  pageNumbers.push('...');
19
21
  }
20
- for (var i = Math.max(1, currentIndex - 2); i <= Math.min(pageCount, currentIndex + 2); i++) {
22
+ for (var i = Math.max(1, currentPage - 2); i <= Math.min(pageCount, currentPage + 2); i++) {
21
23
  pageNumbers.push(i);
22
24
  }
23
25
 
24
26
  // Add ellipsis if necessary
25
- if (currentIndex < pageCount - 2) {
27
+ if (currentPage < pageCount - 2) {
26
28
  pageNumbers.push('...');
27
29
  }
28
30
  return pageNumbers.map(function (pageNumber) {
@@ -31,10 +33,10 @@ var PageIndex = function PageIndex(_ref) {
31
33
  onClick: function onClick() {
32
34
  return handleFirst(pageNumber);
33
35
  },
34
- className: "block-item " + (pageNumber === currentIndex ? 'selected' : '')
36
+ className: "block-item " + (pageNumber === currentPage ? 'selected' : '')
35
37
  }, pageNumber) : /*#__PURE__*/_react["default"].createElement("span", {
36
38
  key: pageNumber,
37
- className: "block-item " + (pageNumber === currentIndex ? 'selected' : '')
39
+ className: "block-item " + (pageNumber === currentPage ? 'selected' : '')
38
40
  }, pageNumber));
39
41
  });
40
42
  };
@@ -53,45 +55,44 @@ var Pagination = function Pagination(_ref2) {
53
55
  _paginationProps$rows = paginationProps.rowsPerPage,
54
56
  rowsPerPage = _paginationProps$rows === void 0 ? 10 : _paginationProps$rows,
55
57
  onPagination = paginationProps.onPagination;
56
- var _useState = (0, _react.useState)(currentPage != null ? currentPage : 1),
57
- currentIndex = _useState[0],
58
- setCurrenIndex = _useState[1];
59
- var _useState2 = (0, _react.useState)(rowsPerPage),
60
- rowsPerPageState = _useState2[0],
61
- setRowsPerPageState = _useState2[1];
58
+ var _useState = (0, _react.useState)(rowsPerPage),
59
+ rowsPerPageState = _useState[0],
60
+ setRowsPerPageState = _useState[1];
62
61
  var dropData = dropOptions != null ? dropOptions : [10, 20, 50, 100, 200];
63
- var _useState3 = (0, _react.useState)(1),
64
- pageCount = _useState3[0],
65
- setPageCount = _useState3[1];
62
+ var _useState2 = (0, _react.useState)(1),
63
+ pageCount = _useState2[0],
64
+ setPageCount = _useState2[1];
66
65
  var handleRowsPerPage = function handleRowsPerPage(e) {
67
66
  var value = parseInt(e.target.value);
68
67
  setRowsPerPageState(value);
69
- onRowsPerPage === null || onRowsPerPage === void 0 ? void 0 : onRowsPerPage(value, currentIndex);
68
+ onRowsPerPage === null || onRowsPerPage === void 0 ? void 0 : onRowsPerPage(value, currentPage);
70
69
  };
71
70
  var handleFirst = function handleFirst(index) {
72
- setCurrenIndex(index);
73
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(index, currentIndex);
71
+ // setCurrenIndex(index);
72
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(index, currentPage);
74
73
  };
75
74
  var handleLast = function handleLast() {
76
75
  var value = pageCount != null ? pageCount : 0;
77
- setCurrenIndex(value);
78
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(value, currentIndex);
76
+ // setCurrenIndex(value);
77
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(value, currentPage);
79
78
  };
80
- (0, _react.useEffect)(function () {
81
- setCurrenIndex(currentIndex);
82
- }, [currentPage]);
79
+ // useEffect(() => {
80
+ // setCurrenIndex(currentPage);
81
+ // }, [currentPage]);
82
+
83
83
  (0, _react.useEffect)(function () {
84
84
  var calculatedPageCount = Math.ceil(total / rowsPerPageState);
85
85
  setPageCount(calculatedPageCount);
86
86
  }, [total, rowsPerPageState]);
87
87
  var handlePrevious = function handlePrevious() {
88
- setCurrenIndex(currentIndex - 1);
89
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentIndex - 1, currentIndex);
88
+ // setCurrenIndex(currentPage - 1);
89
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentPage - 1, currentPage);
90
90
  };
91
91
  var handleNext = function handleNext() {
92
- setCurrenIndex(currentIndex + 1);
93
- onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentIndex + 1, currentIndex);
92
+ // setCurrenIndex(currentPage + 1);
93
+ onPagination === null || onPagination === void 0 ? void 0 : onPagination(currentPage + 1, currentPage);
94
94
  };
95
+ console.log(currentPage, 'outside function');
95
96
  return /*#__PURE__*/_react["default"].createElement("div", {
96
97
  className: 'qbs-table-custom-pagination',
97
98
  style: {
@@ -104,7 +105,7 @@ var Pagination = function Pagination(_ref2) {
104
105
  className: "qbs-table-pagination-right-block"
105
106
  }, /*#__PURE__*/_react["default"].createElement("button", {
106
107
  className: "qbs-table-icon-container",
107
- disabled: currentIndex == 1,
108
+ disabled: currentPage == 1,
108
109
  onClick: function onClick() {
109
110
  return handleFirst(1);
110
111
  }
@@ -122,7 +123,7 @@ var Pagination = function Pagination(_ref2) {
122
123
  "stroke-linejoin": "round"
123
124
  }))), /*#__PURE__*/_react["default"].createElement("button", {
124
125
  className: "qbs-table-icon-container",
125
- disabled: currentIndex < 2,
126
+ disabled: currentPage < 2,
126
127
  onClick: function onClick() {
127
128
  return handlePrevious();
128
129
  }
@@ -141,12 +142,13 @@ var Pagination = function Pagination(_ref2) {
141
142
  }))), /*#__PURE__*/_react["default"].createElement("div", {
142
143
  className: "block-container"
143
144
  }, /*#__PURE__*/_react["default"].createElement(PageIndex, {
144
- currentIndex: currentIndex,
145
+ key: currentPage,
146
+ currentPage: currentPage,
145
147
  handleFirst: handleFirst,
146
148
  pageCount: pageCount
147
149
  })), /*#__PURE__*/_react["default"].createElement("button", {
148
150
  className: "qbs-table-icon-container",
149
- disabled: currentIndex >= pageCount - 1,
151
+ disabled: currentPage >= pageCount - 1,
150
152
  onClick: function onClick() {
151
153
  return handleNext();
152
154
  }
@@ -164,7 +166,7 @@ var Pagination = function Pagination(_ref2) {
164
166
  "stroke-linejoin": "round"
165
167
  }))), /*#__PURE__*/_react["default"].createElement("button", {
166
168
  className: "qbs-table-icon-container",
167
- disabled: currentIndex == pageCount,
169
+ disabled: currentPage == pageCount,
168
170
  onClick: function onClick() {
169
171
  return handleLast();
170
172
  }
package/lib/qbsTable/QbsTable.js CHANGED
@@ -159,7 +159,7 @@ var QbsTable = function QbsTable(_ref) {
159
159
  }, []);
160
160
  (0, _react.useEffect)(function () {
161
161
  handleColumnToggle === null || handleColumnToggle === void 0 ? void 0 : handleColumnToggle(columns);
162
- }, [columns, handleColumnToggle]);
162
+ }, [columns]);
163
163
  var handleClear = function handleClear(_ref2) {
164
164
  setCheckedKeys([]);
165
165
  handleChecked([]);
@@ -372,7 +372,7 @@ var QbsTable = function QbsTable(_ref) {
372
372
  onChange: handleCheckAll,
373
373
  id: "checkbox-all",
374
374
  className: "qbs-table-checkbox-input " + classes.tableCheckBoxClass,
375
- checked: data.every(function (item) {
375
+ checked: (data === null || data === void 0 ? void 0 : data.length) > 0 && data.every(function (item) {
376
376
  return checkedKeys === null || checkedKeys === void 0 ? void 0 : checkedKeys.includes(item.id);
377
377
  })
378
378
  }), /*#__PURE__*/_react["default"].createElement("label", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qbs-react-grid",
3
- "version": "1.0.39",
3
+ "version": "1.0.41",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
package/src/Pagination.tsx CHANGED
@@ -13,21 +13,24 @@ type PageProps = {
13
13
  onPagination?: (row: number, page: number) => void;
14
14
  };
15
15
  };
16
- const PageIndex = ({ currentIndex, handleFirst, pageCount }) => {
16
+ const PageIndex = ({ currentPage, handleFirst, pageCount }) => {
17
+ console.log(currentPage, 'insdie subfunction');
17
18
  const renderPageNumbers = () => {
19
+ console.log(currentPage, 'insdie last function');
20
+
18
21
  const pageNumbers: any = [];
19
22
 
20
23
  // Add ellipsis if necessary
21
- if (currentIndex > 3) {
24
+ if (currentPage > 3) {
22
25
  pageNumbers.push('...');
23
26
  }
24
27
 
25
- for (let i = Math.max(1, currentIndex - 2); i <= Math.min(pageCount, currentIndex + 2); i++) {
28
+ for (let i = Math.max(1, currentPage - 2); i <= Math.min(pageCount, currentPage + 2); i++) {
26
29
  pageNumbers.push(i);
27
30
  }
28
31
 
29
32
  // Add ellipsis if necessary
30
- if (currentIndex < pageCount - 2) {
33
+ if (currentPage < pageCount - 2) {
31
34
  pageNumbers.push('...');
32
35
  }
33
36
 
@@ -37,14 +40,14 @@ const PageIndex = ({ currentIndex, handleFirst, pageCount }) => {
37
40
  <span
38
41
  key={pageNumber}
39
42
  onClick={() => handleFirst(pageNumber)}
40
- className={`block-item ${pageNumber === currentIndex ? 'selected' : ''}`}
43
+ className={`block-item ${pageNumber === currentPage ? 'selected' : ''}`}
41
44
  >
42
45
  {pageNumber}
43
46
  </span>
44
47
  ) : (
45
48
  <span
46
49
  key={pageNumber}
47
- className={`block-item ${pageNumber === currentIndex ? 'selected' : ''}`}
50
+ className={`block-item ${pageNumber === currentPage ? 'selected' : ''}`}
48
51
  >
49
52
  {pageNumber}
50
53
  </span>
@@ -65,7 +68,6 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
65
68
  onPagination
66
69
  } = paginationProps;
67
70
 
68
- const [currentIndex, setCurrenIndex] = useState<number>(currentPage ?? 1);
69
71
  const [rowsPerPageState, setRowsPerPageState] = useState(rowsPerPage);
70
72
 
71
73
  const dropData = dropOptions ?? [10, 20, 50, 100, 200];
@@ -73,21 +75,21 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
73
75
  const handleRowsPerPage = (e: React.ChangeEvent<HTMLSelectElement>) => {
74
76
  const value = parseInt(e.target.value);
75
77
  setRowsPerPageState(value);
76
- onRowsPerPage?.(value, currentIndex);
78
+ onRowsPerPage?.(value, currentPage);
77
79
  };
78
80
  const handleFirst = (index: number) => {
79
- setCurrenIndex(index);
80
- onPagination?.(index, currentIndex);
81
+ // setCurrenIndex(index);
82
+ onPagination?.(index, currentPage);
81
83
  };
82
84
 
83
85
  const handleLast = () => {
84
86
  const value = pageCount ?? 0;
85
- setCurrenIndex(value);
86
- onPagination?.(value, currentIndex);
87
+ // setCurrenIndex(value);
88
+ onPagination?.(value, currentPage);
87
89
  };
88
- useEffect(() => {
89
- setCurrenIndex(currentIndex);
90
- }, [currentPage]);
90
+ // useEffect(() => {
91
+ // setCurrenIndex(currentPage);
92
+ // }, [currentPage]);
91
93
 
92
94
  useEffect(() => {
93
95
  const calculatedPageCount = Math.ceil(total / rowsPerPageState);
@@ -95,13 +97,15 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
95
97
  }, [total, rowsPerPageState]);
96
98
 
97
99
  const handlePrevious = () => {
98
- setCurrenIndex(currentIndex - 1);
99
- onPagination?.(currentIndex - 1, currentIndex);
100
+ // setCurrenIndex(currentPage - 1);
101
+ onPagination?.(currentPage - 1, currentPage);
100
102
  };
101
103
  const handleNext = () => {
102
- setCurrenIndex(currentIndex + 1);
103
- onPagination?.(currentIndex + 1, currentIndex);
104
+ // setCurrenIndex(currentPage + 1);
105
+ onPagination?.(currentPage + 1, currentPage);
104
106
  };
107
+ console.log(currentPage, 'outside function');
108
+
105
109
  return (
106
110
  <div
107
111
  className={'qbs-table-custom-pagination'}
@@ -117,7 +121,7 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
117
121
  <div className="qbs-table-pagination-right-block">
118
122
  <button
119
123
  className="qbs-table-icon-container"
120
- disabled={currentIndex == 1}
124
+ disabled={currentPage == 1}
121
125
  onClick={() => handleFirst(1)}
122
126
  >
123
127
  <svg
@@ -138,7 +142,7 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
138
142
  </button>
139
143
  <button
140
144
  className="qbs-table-icon-container"
141
- disabled={currentIndex < 2}
145
+ disabled={currentPage < 2}
142
146
  onClick={() => handlePrevious()}
143
147
  >
144
148
  <svg
@@ -158,11 +162,16 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
158
162
  </svg>
159
163
  </button>
160
164
  <div className="block-container">
161
- <PageIndex currentIndex={currentIndex} handleFirst={handleFirst} pageCount={pageCount} />
165
+ <PageIndex
166
+ key={currentPage}
167
+ currentPage={currentPage}
168
+ handleFirst={handleFirst}
169
+ pageCount={pageCount}
170
+ />
162
171
  </div>
163
172
  <button
164
173
  className="qbs-table-icon-container"
165
- disabled={currentIndex >= pageCount - 1}
174
+ disabled={currentPage >= pageCount - 1}
166
175
  onClick={() => handleNext()}
167
176
  >
168
177
  <svg
@@ -183,7 +192,7 @@ const Pagination: FC<PageProps> = ({ paginationProps }) => {
183
192
  </button>
184
193
  <button
185
194
  className="qbs-table-icon-container"
186
- disabled={currentIndex == pageCount}
195
+ disabled={currentPage == pageCount}
187
196
  onClick={() => handleLast()}
188
197
  >
189
198
  <svg
package/src/qbsTable/QbsTable.tsx CHANGED
@@ -140,7 +140,8 @@ const QbsTable: React.FC<QbsTableProps> = ({
140
140
 
141
141
  useEffect(() => {
142
142
  handleColumnToggle?.(columns);
143
- }, [columns, handleColumnToggle]);
143
+ }, [columns]);
144
+
144
145
  const handleClear = ([]) => {
145
146
  setCheckedKeys([]);
146
147
  handleChecked([]);
@@ -390,7 +391,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
390
391
  onChange={handleCheckAll}
391
392
  id={`checkbox-all`}
392
393
  className={`qbs-table-checkbox-input ${classes.tableCheckBoxClass}`}
393
- checked={data.every(item => checkedKeys?.includes(item.id))}
394
+ checked={data?.length > 0 && data.every(item => checkedKeys?.includes(item.id))}
394
395
  />
395
396
  <label htmlFor={`checkbox-all`}>
396
397
  <svg