qbs-react-grid 2.2.4 → 2.2.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.
Files changed (100) hide show
  1. package/dist/css/qbs-react-grid.css +1 -1
  2. package/dist/css/qbs-react-grid.min.css +1 -1
  3. package/dist/css/qbs-react-grid.min.css.map +1 -1
  4. package/es/Cell.js +1 -2
  5. package/es/Pagination.d.ts +0 -3
  6. package/es/Pagination.js +3 -8
  7. package/es/Table.d.ts +0 -3
  8. package/es/Table.js +12 -18
  9. package/es/index.d.ts +1 -1
  10. package/es/less/pagination.less +9 -9
  11. package/es/less/qbs-table.less +73 -205
  12. package/es/qbsTable/CustomTableCell.js +2 -13
  13. package/es/qbsTable/QbsTable.js +46 -124
  14. package/es/qbsTable/TableCardList.js +39 -52
  15. package/es/qbsTable/Toolbar.js +13 -62
  16. package/es/qbsTable/commontypes.d.ts +2 -30
  17. package/es/qbsTable/utilities/CardComponent.d.ts +0 -2
  18. package/es/qbsTable/utilities/CardComponent.js +3 -7
  19. package/es/qbsTable/utilities/CardMenuDropdown.d.ts +0 -2
  20. package/es/qbsTable/utilities/CardMenuDropdown.js +7 -7
  21. package/es/qbsTable/utilities/ColumShowHide.d.ts +0 -4
  22. package/es/qbsTable/utilities/ColumShowHide.js +6 -9
  23. package/es/qbsTable/utilities/SearchInput.d.ts +0 -1
  24. package/es/qbsTable/utilities/SearchInput.js +1 -3
  25. package/es/qbsTable/utilities/ToolTip.d.ts +1 -8
  26. package/es/qbsTable/utilities/ToolTip.js +31 -107
  27. package/es/qbsTable/utilities/empty.js +1 -1
  28. package/es/qbsTable/utilities/icons.d.ts +0 -3
  29. package/es/qbsTable/utilities/icons.js +1 -65
  30. package/es/qbsTable/utilities/tablecalc.d.ts +1 -1
  31. package/es/qbsTable/utilities/tablecalc.js +2 -7
  32. package/es/utils/useCellDescriptor.js +1 -0
  33. package/es/utils/useScrollListener.d.ts +0 -1
  34. package/es/utils/useScrollListener.js +3 -5
  35. package/lib/Cell.js +1 -2
  36. package/lib/Pagination.d.ts +0 -3
  37. package/lib/Pagination.js +3 -8
  38. package/lib/Table.d.ts +0 -3
  39. package/lib/Table.js +12 -18
  40. package/lib/index.d.ts +1 -1
  41. package/lib/less/pagination.less +9 -9
  42. package/lib/less/qbs-table.less +73 -205
  43. package/lib/qbsTable/CustomTableCell.js +2 -13
  44. package/lib/qbsTable/QbsTable.js +46 -124
  45. package/lib/qbsTable/TableCardList.js +39 -52
  46. package/lib/qbsTable/Toolbar.js +12 -61
  47. package/lib/qbsTable/commontypes.d.ts +2 -30
  48. package/lib/qbsTable/utilities/CardComponent.d.ts +0 -2
  49. package/lib/qbsTable/utilities/CardComponent.js +3 -7
  50. package/lib/qbsTable/utilities/CardMenuDropdown.d.ts +0 -2
  51. package/lib/qbsTable/utilities/CardMenuDropdown.js +5 -6
  52. package/lib/qbsTable/utilities/ColumShowHide.d.ts +0 -4
  53. package/lib/qbsTable/utilities/ColumShowHide.js +6 -9
  54. package/lib/qbsTable/utilities/SearchInput.d.ts +0 -1
  55. package/lib/qbsTable/utilities/SearchInput.js +1 -3
  56. package/lib/qbsTable/utilities/ToolTip.d.ts +1 -8
  57. package/lib/qbsTable/utilities/ToolTip.js +30 -107
  58. package/lib/qbsTable/utilities/empty.js +1 -1
  59. package/lib/qbsTable/utilities/icons.d.ts +0 -3
  60. package/lib/qbsTable/utilities/icons.js +3 -70
  61. package/lib/qbsTable/utilities/tablecalc.d.ts +1 -1
  62. package/lib/qbsTable/utilities/tablecalc.js +2 -7
  63. package/lib/utils/useCellDescriptor.js +1 -0
  64. package/lib/utils/useScrollListener.d.ts +0 -1
  65. package/lib/utils/useScrollListener.js +3 -5
  66. package/package.json +2 -2
  67. package/src/Cell.tsx +1 -3
  68. package/src/HeaderCell.tsx +1 -0
  69. package/src/Pagination.tsx +3 -10
  70. package/src/Table.tsx +10 -23
  71. package/src/customSelect.tsx +88 -88
  72. package/src/index.ts +1 -1
  73. package/src/less/pagination.less +9 -9
  74. package/src/less/qbs-table.less +73 -205
  75. package/src/qbsTable/CustomTableCell.tsx +9 -31
  76. package/src/qbsTable/QbsTable.tsx +25 -101
  77. package/src/qbsTable/TableCardList.tsx +19 -35
  78. package/src/qbsTable/Toolbar.tsx +11 -53
  79. package/src/qbsTable/commontypes.ts +1 -32
  80. package/src/qbsTable/utilities/CardComponent.tsx +2 -7
  81. package/src/qbsTable/utilities/CardMenuDropdown.tsx +6 -11
  82. package/src/qbsTable/utilities/ColumShowHide.tsx +6 -33
  83. package/src/qbsTable/utilities/SearchInput.tsx +1 -3
  84. package/src/qbsTable/utilities/ToolTip.tsx +27 -138
  85. package/src/qbsTable/utilities/empty.tsx +2 -2
  86. package/src/qbsTable/utilities/icons.tsx +1 -78
  87. package/src/qbsTable/utilities/tablecalc.ts +2 -8
  88. package/src/utils/useCellDescriptor.ts +1 -0
  89. package/src/utils/useScrollListener.ts +3 -13
  90. package/src/utils/useTableRows.ts +1 -1
  91. package/es/qbsTable/labels.d.ts +0 -48
  92. package/es/qbsTable/labels.js +0 -34
  93. package/es/qbsTable/utilities/VerticalDropDownMenu.d.ts +0 -13
  94. package/es/qbsTable/utilities/VerticalDropDownMenu.js +0 -157
  95. package/lib/qbsTable/labels.d.ts +0 -48
  96. package/lib/qbsTable/labels.js +0 -42
  97. package/lib/qbsTable/utilities/VerticalDropDownMenu.d.ts +0 -13
  98. package/lib/qbsTable/utilities/VerticalDropDownMenu.js +0 -165
  99. package/src/qbsTable/labels.ts +0 -58
  100. package/src/qbsTable/utilities/VerticalDropDownMenu.tsx +0 -178
@@ -8,7 +8,7 @@ export var ThreeDotIcon = function ThreeDotIcon() {
8
8
  xmlns: "http://www.w3.org/2000/svg"
9
9
  }, /*#__PURE__*/React.createElement("path", {
10
10
  d: "M2 2.16665L2 2.17498M2 7.99998L2 8.00831M2 13.8333L2 13.8416M2 2.99998C1.53976 2.99998 1.16667 2.62688 1.16667 2.16665C1.16667 1.70641 1.53976 1.33331 2 1.33331C2.46024 1.33331 2.83333 1.70641 2.83333 2.16665C2.83333 2.62688 2.46024 2.99998 2 2.99998ZM2 8.83331C1.53976 8.83331 1.16667 8.46022 1.16667 7.99998C1.16667 7.53974 1.53976 7.16665 2 7.16665C2.46024 7.16665 2.83333 7.53974 2.83333 7.99998C2.83333 8.46022 2.46024 8.83331 2 8.83331ZM2 14.6666C1.53976 14.6666 1.16666 14.2935 1.16666 13.8333C1.16666 13.3731 1.53976 13 2 13C2.46024 13 2.83333 13.3731 2.83333 13.8333C2.83333 14.2935 2.46024 14.6666 2 14.6666Z",
11
- stroke: "currentColor",
11
+ stroke: "#313131",
12
12
  strokeWidth: "1.5",
13
13
  strokeLinecap: "round",
14
14
  strokeLinejoin: "round"
@@ -125,68 +125,4 @@ export var TableView = function TableView(_ref5) {
125
125
  stroke: "currentColor",
126
126
  strokeWidth: "1.5"
127
127
  }));
128
- };
129
- export var ExpandIcon = function ExpandIcon(_ref6) {
130
- var className = _ref6.className;
131
- return /*#__PURE__*/React.createElement("svg", {
132
- width: "16",
133
- height: "16",
134
- className: className,
135
- viewBox: "0 0 16 16",
136
- fill: "none",
137
- xmlns: "http://www.w3.org/2000/svg"
138
- }, /*#__PURE__*/React.createElement("path", {
139
- d: "M2.66797 5.33073V2.66406M2.66797 2.66406H5.33464M2.66797 2.66406L6.0013 5.9974M13.3346 5.33073V2.66406M13.3346 2.66406H10.668M13.3346 2.66406L10.0013 5.9974M2.66797 10.6641V13.3307M2.66797 13.3307H5.33464M2.66797 13.3307L6.0013 9.9974M13.3346 13.3307L10.0013 9.9974M13.3346 13.3307V10.6641M13.3346 13.3307H10.668",
140
- stroke: "#585858",
141
- strokeWidth: "1.5",
142
- strokeLinecap: "round",
143
- strokeLinejoin: "round"
144
- }));
145
- };
146
- export var ContentView = function ContentView(_ref7) {
147
- var className = _ref7.className;
148
- return /*#__PURE__*/React.createElement("svg", {
149
- width: "16",
150
- height: "17",
151
- className: className,
152
- viewBox: "0 0 16 17",
153
- fill: "none",
154
- xmlns: "http://www.w3.org/2000/svg"
155
- }, /*#__PURE__*/React.createElement("path", {
156
- d: "M4.00344 9.48438C3.24485 9.48438 2.94141 9.80804 2.94141 10.6122V12.6553C2.94141 13.4594 3.24485 13.7831 4.00344 13.7831H11.994C12.7526 13.7831 13.056 13.4594 13.056 12.6553V10.6122C13.056 9.80804 12.7526 9.48438 11.994 9.48438H4.00344Z",
157
- stroke: "#585858",
158
- strokeLinecap: "round",
159
- strokeLinejoin: "round"
160
- }), /*#__PURE__*/React.createElement("path", {
161
- d: "M4.00344 3.66406C3.24485 3.66406 2.94141 3.98773 2.94141 4.79184V6.835C2.94141 7.63911 3.24485 7.96278 4.00344 7.96278H11.994C12.7526 7.96278 13.056 7.63911 13.056 6.835V4.79184C13.056 3.98773 12.7526 3.66406 11.994 3.66406H4.00344Z",
162
- stroke: "#585858",
163
- strokeLinecap: "round",
164
- strokeLinejoin: "round"
165
- }));
166
- };
167
- export var DefaultView = function DefaultView(_ref8) {
168
- var className = _ref8.className;
169
- return /*#__PURE__*/React.createElement("svg", {
170
- width: "16",
171
- height: "17",
172
- className: className,
173
- viewBox: "0 0 16 17",
174
- fill: "none",
175
- xmlns: "http://www.w3.org/2000/svg"
176
- }, /*#__PURE__*/React.createElement("path", {
177
- fillRule: "evenodd",
178
- clipRule: "evenodd",
179
- d: "M2.39844 4.72969C2.39844 4.28786 2.75661 3.92969 3.19844 3.92969H12.7984C13.2403 3.92969 13.5984 4.28786 13.5984 4.72969C13.5984 5.17152 13.2403 5.52969 12.7984 5.52969H3.19844C2.75661 5.52969 2.39844 5.17152 2.39844 4.72969Z",
180
- fill: "#585858"
181
- }), /*#__PURE__*/React.createElement("path", {
182
- fillRule: "evenodd",
183
- clipRule: "evenodd",
184
- d: "M2.39844 8.72969C2.39844 8.28786 2.75661 7.92969 3.19844 7.92969H12.7984C13.2403 7.92969 13.5984 8.28786 13.5984 8.72969C13.5984 9.17152 13.2403 9.52969 12.7984 9.52969H3.19844C2.75661 9.52969 2.39844 9.17152 2.39844 8.72969Z",
185
- fill: "#585858"
186
- }), /*#__PURE__*/React.createElement("path", {
187
- fillRule: "evenodd",
188
- clipRule: "evenodd",
189
- d: "M2.39844 12.7297C2.39844 12.2879 2.75661 11.9297 3.19844 11.9297H12.7984C13.2403 11.9297 13.5984 12.2879 13.5984 12.7297C13.5984 13.1715 13.2403 13.5297 12.7984 13.5297H3.19844C2.75661 13.5297 2.39844 13.1715 2.39844 12.7297Z",
190
- fill: "#585858"
191
- }));
192
128
  };
@@ -1 +1 @@
1
- export declare function getRowDisplayRange(totalRows: number, rowsPerPage: number, pageNumber: number, formatRange?: (start: number, end: number, total: number) => string): string;
1
+ export declare function getRowDisplayRange(totalRows: number, rowsPerPage: number, pageNumber: number): string;
@@ -1,10 +1,5 @@
1
- export function getRowDisplayRange(totalRows, rowsPerPage, pageNumber, formatRange) {
2
- if (formatRange === void 0) {
3
- formatRange = function formatRange(start, end, total) {
4
- return "Showing " + start + " to " + end + " of " + total;
5
- };
6
- }
1
+ export function getRowDisplayRange(totalRows, rowsPerPage, pageNumber) {
7
2
  var start = (pageNumber - 1) * rowsPerPage + 1;
8
3
  var end = Math.min(pageNumber * rowsPerPage, totalRows);
9
- return formatRange(start != null ? start : 0, end != null ? end : 0, totalRows != null ? totalRows : 0);
4
+ return "Showing " + (start != null ? start : 0) + " to " + (end != null ? end : 0) + " of " + (totalRows != null ? totalRows : 0);
10
5
  }
@@ -151,6 +151,7 @@ var useCellDescriptor = function useCellDescriptor(props) {
151
151
  if (treeCol) {
152
152
  hasCustomTreeCol = true;
153
153
  }
154
+ console.log(columns);
154
155
  if ((columnChildren === null || columnChildren === void 0 ? void 0 : columnChildren.length) !== 2) {
155
156
  throw new Error("Component <HeaderCell> and <Cell> is required, column index: " + index + " ");
156
157
  }
@@ -31,7 +31,6 @@ interface ScrollListenerProps {
31
31
  onTouchStart?: (event: React.TouchEvent) => void;
32
32
  onTouchMove?: (event: React.TouchEvent) => void;
33
33
  onTouchEnd?: (event: React.TouchEvent) => void;
34
- handleInfiniteScroll?: (value: number) => void;
35
34
  }
36
35
  /**
37
36
  * Add scroll, touch, and wheel monitoring events to the table,
@@ -68,8 +68,7 @@ var useScrollListener = function useScrollListener(props) {
68
68
  contentHeight = props.contentHeight,
69
69
  headerHeight = props.headerHeight,
70
70
  rtl = props.rtl,
71
- tableKey = props.tableKey,
72
- handleInfiniteScroll = props.handleInfiniteScroll;
71
+ tableKey = props.tableKey;
73
72
  var wheelListener = useRef(null);
74
73
  var touchStartListener = useRef(null);
75
74
  var touchMoveListener = useRef(null);
@@ -131,9 +130,6 @@ var useScrollListener = function useScrollListener(props) {
131
130
  var x = Math.min(0, nextScrollX < minScrollX.current ? minScrollX.current : nextScrollX);
132
131
  setScrollX(x);
133
132
  setScrollY(y);
134
- if (typeof handleInfiniteScroll === 'function' && deltaY !== 0 && !loading && Math.abs(y) + getTableHeight() >= contentHeight.current - 12) {
135
- handleInfiniteScroll(scrollY.current);
136
- }
137
133
  onScroll === null || onScroll === void 0 ? void 0 : onScroll(Math.abs(x), Math.abs(y));
138
134
  if (virtualized) {
139
135
  // Add a state to the table during virtualized scrolling.
@@ -211,6 +207,7 @@ var useScrollListener = function useScrollListener(props) {
211
207
  if (!isTouching.current) {
212
208
  return;
213
209
  }
210
+ console.log('handleTouchMove');
214
211
  var _event$touches$2 = event.touches[0],
215
212
  pageX = _event$touches$2.pageX,
216
213
  pageY = _event$touches$2.pageY;
@@ -244,6 +241,7 @@ var useScrollListener = function useScrollListener(props) {
244
241
  if (!isTouching.current) {
245
242
  return;
246
243
  }
244
+ console.log('handleTouchEnd');
247
245
  isTouching.current = false;
248
246
  var touchDuration = new Date().getTime() - momentumStartTime.current;
249
247
  var absDeltaY = Math.abs(scrollY.current - momentumStartY.current);
package/lib/Cell.js CHANGED
@@ -86,11 +86,10 @@ var Cell = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
86
86
  var nextHeight = isHeaderCell ? headerHeight : cellHeight;
87
87
  var styles = (0, _extends4["default"])({}, predefinedStyle, (_extends2 = {}, _extends2[fullText ? 'minWidth' : 'width'] = width, _extends2.height = nextHeight, _extends2.zIndex = depth, _extends2[rtl ? 'right' : 'left'] = left, _extends2));
88
88
  var paddingKey = rtl ? 'paddingRight' : 'paddingLeft';
89
- var resolvedAlign = rtl && align === 'left' ? 'right' : rtl && align === 'right' ? 'left' : align;
90
89
  var contentStyles = (0, _extends4["default"])({}, style, (_extends3 = {
91
90
  width: fullText ? width - 1 : width,
92
91
  height: nextHeight,
93
- textAlign: resolvedAlign
92
+ textAlign: align
94
93
  }, _extends3[paddingKey] = isTreeCol ? depth * _constants.LAYER_WIDTH + 10 : (style === null || style === void 0 ? void 0 : style[paddingKey]) || (style === null || style === void 0 ? void 0 : style.padding), _extends3));
95
94
  if (verticalAlign) {
96
95
  contentStyles.display = 'table-cell';
@@ -1,5 +1,4 @@
1
1
  import { FC } from 'react';
2
- import { type QbsTableLabels } from './qbsTable/labels';
3
2
  type PageProps = {
4
3
  paginationProps: {
5
4
  total?: number;
@@ -10,8 +9,6 @@ type PageProps = {
10
9
  onRowsPerPage?: (row: number, page: number) => void;
11
10
  onPagination?: (row: number, page: number) => void;
12
11
  };
13
- labels?: QbsTableLabels;
14
- dataTheme?: string;
15
12
  };
16
13
  declare const Pagination: FC<PageProps>;
17
14
  export default Pagination;
package/lib/Pagination.js CHANGED
@@ -5,7 +5,6 @@ exports.__esModule = true;
5
5
  exports["default"] = void 0;
6
6
  var _react = _interopRequireWildcard(require("react"));
7
7
  var _customSelect = _interopRequireDefault(require("./customSelect"));
8
- var _labels = require("./qbsTable/labels");
9
8
  var _tablecalc = require("./qbsTable/utilities/tablecalc");
10
9
  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); }
11
10
  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; }
@@ -42,10 +41,7 @@ var PageIndex = function PageIndex(_ref) {
42
41
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, renderPageNumbers());
43
42
  };
44
43
  var Pagination = function Pagination(_ref2) {
45
- var paginationProps = _ref2.paginationProps,
46
- labelsProp = _ref2.labels,
47
- dataTheme = _ref2.dataTheme;
48
- var labels = (0, _labels.mergeLabels)(labelsProp);
44
+ var paginationProps = _ref2.paginationProps;
49
45
  var _paginationProps$drop = paginationProps.dropOptions,
50
46
  dropOptions = _paginationProps$drop === void 0 ? [10, 20, 50, 100, 200] : _paginationProps$drop,
51
47
  _paginationProps$curr = paginationProps.currentPage,
@@ -86,14 +82,13 @@ var Pagination = function Pagination(_ref2) {
86
82
  };
87
83
  return /*#__PURE__*/_react["default"].createElement("div", {
88
84
  className: "qbs-table-custom-pagination",
89
- "data-theme": dataTheme,
90
85
  style: {
91
86
  display: 'flex',
92
87
  justifyContent: 'space-between'
93
88
  }
94
89
  }, /*#__PURE__*/_react["default"].createElement("div", {
95
90
  className: "rows-count"
96
- }, (0, _tablecalc.getRowDisplayRange)(total, rowsPerPageState, currentPage, labels.showingRange)), /*#__PURE__*/_react["default"].createElement("div", {
91
+ }, (0, _tablecalc.getRowDisplayRange)(total, rowsPerPageState, currentPage)), /*#__PURE__*/_react["default"].createElement("div", {
97
92
  className: "qbs-table-pagination-right-block"
98
93
  }, /*#__PURE__*/_react["default"].createElement("button", {
99
94
  className: "qbs-table-icon-container",
@@ -172,7 +167,7 @@ var Pagination = function Pagination(_ref2) {
172
167
  className: "qbs-table-pagination-flexBox"
173
168
  }, /*#__PURE__*/_react["default"].createElement("span", {
174
169
  className: "qbs-table-pagination-text"
175
- }, labels.itemsPerPage), /*#__PURE__*/_react["default"].createElement(_customSelect["default"], {
170
+ }, "Items per page"), /*#__PURE__*/_react["default"].createElement(_customSelect["default"], {
176
171
  options: dropData,
177
172
  selectedValue: rowsPerPageState,
178
173
  onChange: handleRowsPerPage
package/lib/Table.d.ts CHANGED
@@ -99,7 +99,6 @@ export interface TableProps<Row, Key> extends Omit<StandardProps, 'onScroll'> {
99
99
  /** Tree table, the callback function in the expanded node */
100
100
  renderTreeToggle?: (expandButton: React.ReactNode, rowData?: Row, expanded?: boolean) => React.ReactNode;
101
101
  tableKey?: string;
102
- infiniteLoading?: boolean;
103
102
  /** Customize what you can do to expand a zone */
104
103
  renderRowExpanded?: (rowData?: Row) => React.ReactNode;
105
104
  /** Custom row element */
@@ -124,7 +123,6 @@ export interface TableProps<Row, Key> extends Omit<StandardProps, 'onScroll'> {
124
123
  onTouchMove?: (event: React.TouchEvent) => void;
125
124
  /** Callback for the `touchend` event. */
126
125
  onTouchEnd?: (event: React.TouchEvent) => void;
127
- handleInfiniteScroll?: (value: number) => void;
128
126
  /**
129
127
  * Callback after table data update.
130
128
  * @deprecated use `shouldUpdateScroll` instead
@@ -134,7 +132,6 @@ export interface TableProps<Row, Key> extends Omit<StandardProps, 'onScroll'> {
134
132
  y: number;
135
133
  }) => void) => void;
136
134
  tableBodyRef: React.RefObject<HTMLDivElement>;
137
- wheelWrapperRef: React.RefObject<HTMLDivElement | null>;
138
135
  bodyRef?: (ref: HTMLElement) => void;
139
136
  }
140
137
  export interface TableInstance<Row, Key> extends React.FunctionComponent<TableProps<Row, Key>> {
package/lib/Table.js CHANGED
@@ -20,7 +20,7 @@ var _Row = _interopRequireDefault(require("./Row"));
20
20
  var _Scrollbar = _interopRequireDefault(require("./Scrollbar"));
21
21
  var _TableContext = _interopRequireDefault(require("./TableContext"));
22
22
  var _utils = require("./utils");
23
- var _excluded = ["affixHeader", "children", "classPrefix", "className", "data", "defaultSortType", "width", "expandedRowKeys", "defaultExpandAllRows", "defaultExpandedRowKeys", "style", "id", "isTree", "hover", "bordered", "cellBordered", "wordWrap", "loading", "locale", "showHeader", "sortColumn", "rowHeight", "sortType", "headerHeight", "minHeight", "height", "autoHeight", "fillHeight", "rtl", "translate3d", "rowKey", "virtualized", "rowClassName", "rowExpandedHeight", "disabledScroll", "affixHorizontalScrollbar", "loadAnimation", "shouldUpdateScroll", "renderRow", "renderRowExpanded", "renderLoading", "renderEmpty", "onSortColumn", "onScroll", "renderTreeToggle", "onRowClick", "onRowContextMenu", "onExpandChange", "onTouchStart", "onTouchMove", "onTouchEnd", "tableBodyHeight", "columns", "tableBodyRef", "tableKey", "handleInfiniteScroll", "infiniteLoading", "wheelWrapperRef"],
23
+ var _excluded = ["affixHeader", "children", "classPrefix", "className", "data", "defaultSortType", "width", "expandedRowKeys", "defaultExpandAllRows", "defaultExpandedRowKeys", "style", "id", "isTree", "hover", "bordered", "cellBordered", "wordWrap", "loading", "locale", "showHeader", "pagination", "paginationProps", "sortColumn", "rowHeight", "sortType", "headerHeight", "minHeight", "height", "autoHeight", "fillHeight", "rtl", "translate3d", "rowKey", "virtualized", "rowClassName", "rowExpandedHeight", "disabledScroll", "affixHorizontalScrollbar", "loadAnimation", "shouldUpdateScroll", "renderRow", "renderRowExpanded", "renderLoading", "renderEmpty", "onSortColumn", "onScroll", "renderTreeToggle", "onRowClick", "onRowContextMenu", "onExpandChange", "onTouchStart", "onTouchMove", "onTouchEnd", "dataTheme", "tableBodyHeight", "columns", "tableBodyRef", "tableKey"],
24
24
  _excluded2 = ["depth", "rowIndex"],
25
25
  _excluded3 = ["cellHeight"];
26
26
  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); }
@@ -77,6 +77,10 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
77
77
  } : _props$locale,
78
78
  _props$showHeader = props.showHeader,
79
79
  showHeader = _props$showHeader === void 0 ? true : _props$showHeader,
80
+ _props$pagination = props.pagination,
81
+ pagination = _props$pagination === void 0 ? true : _props$pagination,
82
+ _props$paginationProp = props.paginationProps,
83
+ paginationProps = _props$paginationProp === void 0 ? {} : _props$paginationProp,
80
84
  sortColumn = props.sortColumn,
81
85
  _props$rowHeight = props.rowHeight,
82
86
  rowHeight = _props$rowHeight === void 0 ? _constants.ROW_HEIGHT : _props$rowHeight,
@@ -114,19 +118,18 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
114
118
  onTouchStart = props.onTouchStart,
115
119
  onTouchMove = props.onTouchMove,
116
120
  onTouchEnd = props.onTouchEnd,
121
+ dataTheme = props.dataTheme,
117
122
  tableBodyHeight = props.tableBodyHeight,
118
123
  columns = props.columns,
119
124
  tableBodyRef = props.tableBodyRef,
120
125
  tableKey = props.tableKey,
121
- handleInfiniteScroll = props.handleInfiniteScroll,
122
- infiniteLoading = props.infiniteLoading,
123
- wheelWrapperRef = props.wheelWrapperRef,
124
126
  rest = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
125
127
  var _useClassNames = (0, _utils.useClassNames)(classPrefix, typeof classPrefix !== 'undefined'),
126
128
  withClassPrefix = _useClassNames.withClassPrefix,
127
129
  mergeCls = _useClassNames.merge,
128
130
  prefix = _useClassNames.prefix;
129
131
  var childTableRef = (0, _react.useRef)(null);
132
+
130
133
  // Use `forceUpdate` to force the component to re-render after manipulating the DOM.
131
134
  var _useReducer = (0, _react.useReducer)(function (x) {
132
135
  return x + 1;
@@ -185,6 +188,7 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
185
188
  var affixHeaderWrapperRef = (0, _react.useRef)(null);
186
189
  var headerWrapperRef = (0, _react.useRef)(null);
187
190
  // const tableBodyRef = useRef<HTMLDivElement>(null);
191
+ var wheelWrapperRef = (0, _react.useRef)(null);
188
192
  var scrollbarXRef = (0, _react.useRef)(null);
189
193
  var scrollbarYRef = (0, _react.useRef)(null);
190
194
  var handleTableResizeChange = function handleTableResizeChange(_prevSize, event) {
@@ -296,8 +300,7 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
296
300
  onScroll: onScroll,
297
301
  onTouchStart: onTouchStart,
298
302
  onTouchMove: onTouchMove,
299
- onTouchEnd: onTouchEnd,
300
- handleInfiniteScroll: handleInfiniteScroll
303
+ onTouchEnd: onTouchEnd
301
304
  }),
302
305
  isScrolling = _useScrollListener.isScrolling,
303
306
  isChildFocused = _useScrollListener.isChildFocused,
@@ -621,9 +624,7 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
621
624
  width: tableWidth.current
622
625
  },
623
626
  length: tableWidth.current,
624
- onScroll: function onScroll(delta) {
625
- onScrollHorizontal(delta);
626
- },
627
+ onScroll: onScrollHorizontal,
627
628
  scrollLength: contentWidth.current,
628
629
  ref: scrollbarXRef
629
630
  }));
@@ -787,9 +788,7 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
787
788
  role: "rowgroup",
788
789
  className: prefix('body-row-wrapper'),
789
790
  style: bodyStyles,
790
- onScroll: function onScroll(e) {
791
- onScrollBody === null || onScrollBody === void 0 ? void 0 : onScrollBody(e); // existing handler
792
- }
791
+ onScroll: onScrollBody
793
792
  }, !loading && /*#__PURE__*/_react["default"].createElement("div", {
794
793
  style: wheelStyles,
795
794
  className: prefix('body-wheel-area'),
@@ -800,12 +799,7 @@ var Table = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
800
799
  }) : null, visibleRows.current, bottomHideHeight ? /*#__PURE__*/_react["default"].createElement(_Row["default"], {
801
800
  style: bottomRowStyles,
802
801
  className: "virtualized"
803
- }) : null, infiniteLoading && /*#__PURE__*/_react["default"].createElement("div", {
804
- style: {
805
- padding: 12,
806
- textAlign: 'center'
807
- }
808
- }, /*#__PURE__*/_react["default"].createElement("span", null, "Loading more rows\u2026"))), /*#__PURE__*/_react["default"].createElement(_EmptyMessage["default"], {
802
+ }) : null), /*#__PURE__*/_react["default"].createElement(_EmptyMessage["default"], {
809
803
  locale: locale,
810
804
  renderEmpty: renderEmpty,
811
805
  addPrefix: prefix,
package/lib/index.d.ts CHANGED
@@ -11,5 +11,5 @@ export type { ColumnProps } from './Column';
11
11
  export type { CellProps } from './Cell';
12
12
  export type { HeaderCellProps } from './HeaderCell';
13
13
  export type { ColumnGroupProps } from './ColumnGroup';
14
- export type { QbsTableProps, QbsTableLabels } from './qbsTable/commontypes';
14
+ export type { QbsTableProps } from './qbsTable/commontypes';
15
15
  export type { StandardProps, SortType, RowDataType, RowKeyType, TableSizeChangeEventName } from './@types/common';
@@ -5,8 +5,8 @@
5
5
  min-height: 40px;
6
6
  align-items: center;
7
7
  border-radius: 0 0 4px 4px;
8
- border-top: 1px solid var(--base-gray-border, #d6d8dc);
9
- background: var(--table-bg, #fff);
8
+ border-top: 1px solid #d6d8dc;
9
+ background: #fff;
10
10
  &-header {
11
11
  border-bottom: 1px solid #eee;
12
12
  position: absolute;
@@ -27,8 +27,8 @@
27
27
  font-weight: 500;
28
28
  line-height: 20px;
29
29
  border-radius: 6px;
30
- border: 1px solid var(--base-gray-border, #d6d8dc);
31
- background: var(--gray-light-1, #fff);
30
+ border: 1px solid #d6d8dc;
31
+ background: #fff;
32
32
  }
33
33
  .qbs-table-icon-container {
34
34
  padding: 0;
@@ -109,7 +109,7 @@
109
109
  font-style: normal;
110
110
  font-weight: 500;
111
111
  line-height: 20px;
112
- color: var(--gray-dark-3, #313131);
112
+ color: #313131;
113
113
  }
114
114
  }
115
115
 
@@ -125,7 +125,7 @@
125
125
  .custom-select-trigger {
126
126
  padding: 2px 8px;
127
127
  cursor: pointer;
128
- border: 1px solid var(--base-gray-border, #d6d8dc);
128
+ border: 1px solid #d6d8dc;
129
129
  border-radius: 4px;
130
130
  min-width: 65px;
131
131
  position: relative;
@@ -140,7 +140,7 @@
140
140
  list-style: none;
141
141
  margin: 2px 0 0;
142
142
  padding: 0;
143
- background: var(--gray-light-1, #fff);
143
+ background: #fff;
144
144
  border-radius: 8px;
145
145
  box-shadow: 0 8px 20px 0 #00000026;
146
146
  }
@@ -158,7 +158,7 @@ ul.custom-select-options.top {
158
158
 
159
159
  .custom-select-option:hover,
160
160
  .custom-select-option.selected {
161
- background-color: var(--table-row-hover-bg, #f0f0f0);
161
+ background-color: #f0f0f0;
162
162
  }
163
163
 
164
164
  .custom-select-trigger:before {
@@ -167,7 +167,7 @@ ul.custom-select-options.top {
167
167
  right: 10px;
168
168
  top: 6px;
169
169
  font-weight: bold;
170
- border: solid var(--gray-dark-3, black);
170
+ border: solid black;
171
171
  border-width: 0 1px 1px 0;
172
172
  display: inline-block;
173
173
  padding: 3px;