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
@@ -11,9 +11,7 @@ var _ColumnGroup = _interopRequireDefault(require("../ColumnGroup"));
11
11
  var _HeaderCell = _interopRequireDefault(require("../HeaderCell"));
12
12
  var _Pagination = _interopRequireDefault(require("../Pagination"));
13
13
  var _Table = _interopRequireDefault(require("../Table"));
14
- var _isRTL = _interopRequireDefault(require("../utils/isRTL"));
15
14
  var _useResponsiveStore = _interopRequireDefault(require("../utils/useResponsiveStore"));
16
- var _labels = require("./labels");
17
15
  var _CustomTableCell = require("./CustomTableCell");
18
16
  var _Toolbar = _interopRequireDefault(require("./Toolbar"));
19
17
  var _CardComponent = _interopRequireDefault(require("./utilities/CardComponent"));
@@ -30,7 +28,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
30
28
 
31
29
  var CHECKBOX_LINE_HEIGHT = '36px';
32
30
  var COLUMN_WIDTH = 250;
33
- var REFRESH_KEY = 0;
34
31
  var QbsTable = function QbsTable(_ref) {
35
32
  var _Object$keys;
36
33
  var handleColumnSort = _ref.handleColumnSort,
@@ -61,7 +58,7 @@ var QbsTable = function QbsTable(_ref) {
61
58
  _ref$height = _ref.height,
62
59
  height = _ref$height === void 0 ? 630 : _ref$height,
63
60
  onExpandChange = _ref.onExpandChange,
64
- propsWordWrap = _ref.wordWrap,
61
+ wordWrap = _ref.wordWrap,
65
62
  _ref$dataRowKey = _ref.dataRowKey,
66
63
  dataRowKey = _ref$dataRowKey === void 0 ? 'id' : _ref$dataRowKey,
67
64
  defaultExpandAllRows = _ref.defaultExpandAllRows,
@@ -73,7 +70,6 @@ var QbsTable = function QbsTable(_ref) {
73
70
  _ref$actionProps = _ref.actionProps,
74
71
  actionProps = _ref$actionProps === void 0 ? [] : _ref$actionProps,
75
72
  theme = _ref.theme,
76
- rtlProp = _ref.rtl,
77
73
  handleMenuActions = _ref.handleMenuActions,
78
74
  onRowClick = _ref.onRowClick,
79
75
  expandedRowKeys = _ref.expandedRowKeys,
@@ -116,31 +112,7 @@ var QbsTable = function QbsTable(_ref) {
116
112
  _ref$isCustomTableCar = _ref.isCustomTableCardView,
117
113
  isCustomTableCardView = _ref$isCustomTableCar === void 0 ? false : _ref$isCustomTableCar,
118
114
  handleTableCardView = _ref.handleTableCardView,
119
- handleCustomCardLoader = _ref.handleCustomCardLoader,
120
- hasMoreData = _ref.hasMoreData,
121
- loadMoreData = _ref.loadMoreData,
122
- infiniteLoading = _ref.infiniteLoading,
123
- _ref$infiniteScroll = _ref.infiniteScroll,
124
- infiniteScroll = _ref$infiniteScroll === void 0 ? false : _ref$infiniteScroll,
125
- propsViewMode = _ref.viewMode,
126
- _ref$rowViewToggle = _ref.rowViewToggle,
127
- rowViewToggle = _ref$rowViewToggle === void 0 ? false : _ref$rowViewToggle,
128
- _ref$defaultRowView = _ref.defaultRowView,
129
- defaultRowView = _ref$defaultRowView === void 0 ? true : _ref$defaultRowView,
130
- _ref$fullWidthView = _ref.fullWidthView,
131
- fullWidthView = _ref$fullWidthView === void 0 ? false : _ref$fullWidthView,
132
- setTableFullView = _ref.setTableFullView,
133
- setRowViewToggle = _ref.setRowViewToggle,
134
- _ref$dropType = _ref.dropType,
135
- dropType = _ref$dropType === void 0 ? 'horizondal' : _ref$dropType,
136
- rowHeight = _ref.rowHeight,
137
- isFullScreen = _ref.isFullScreen,
138
- _ref$showHeader = _ref.showHeader,
139
- showHeader = _ref$showHeader === void 0 ? true : _ref$showHeader,
140
- labelsProp = _ref.labels;
141
- var labels = (0, _react.useMemo)(function () {
142
- return (0, _labels.mergeLabels)(labelsProp);
143
- }, [labelsProp]);
115
+ handleCustomCardLoader = _ref.handleCustomCardLoader;
144
116
  var _useState = (0, _react.useState)(false),
145
117
  loading = _useState[0],
146
118
  setLoading = _useState[1];
@@ -151,10 +123,9 @@ var QbsTable = function QbsTable(_ref) {
151
123
  checkedKeys = _useState3[0],
152
124
  setCheckedKeys = _useState3[1];
153
125
  var dataTheme = (0, _react.useMemo)(function () {
154
- var _ref2;
155
- return (_ref2 = theme != null ? theme : typeof localStorage !== 'undefined' ? localStorage.getItem('theme') : null) != null ? _ref2 : 'light';
126
+ var _localStorage$getItem;
127
+ return (_localStorage$getItem = localStorage.getItem('theme')) != null ? _localStorage$getItem : theme;
156
128
  }, [theme]);
157
- var rtl = rtlProp != null ? rtlProp : (0, _isRTL["default"])();
158
129
  var _useState4 = (0, _react.useState)(false),
159
130
  isOpen = _useState4[0],
160
131
  setIsOpen = _useState4[1];
@@ -164,13 +135,6 @@ var QbsTable = function QbsTable(_ref) {
164
135
  setTableViewToggle = _useState5[1];
165
136
  var isMobile = (0, _useResponsiveStore["default"])();
166
137
  var tableBodyRef = (0, _react.useRef)(null);
167
- var wheelWrapperRef = (0, _react.useRef)(null);
168
- var _useState6 = (0, _react.useState)(propsViewMode != null ? propsViewMode : 'expanded'),
169
- viewMode = _useState6[0],
170
- setViewMode = _useState6[1];
171
- var _useState7 = (0, _react.useState)(propsWordWrap != null ? propsWordWrap : false),
172
- wordWrap = _useState7[0],
173
- setWordWrap = _useState7[1];
174
138
  var handleSortColumn = (0, _react.useCallback)(function (sortColumn, sortType) {
175
139
  setLoading(true);
176
140
  setTimeout(function () {
@@ -210,6 +174,12 @@ var QbsTable = function QbsTable(_ref) {
210
174
  handleChecked(updatedKeys);
211
175
  }
212
176
  }, [checkedKeys]);
177
+ var rowKeyField = dataRowKey != null ? dataRowKey : 'id';
178
+ var getRowClassName = (0, _react.useCallback)(function (rowData) {
179
+ if (!selection) return '';
180
+ var key = rowData === null || rowData === void 0 ? void 0 : rowData[rowKeyField];
181
+ return key !== undefined && checkedKeys !== null && checkedKeys !== void 0 && checkedKeys.includes(key) ? 'qbs-table-row-checked' : '';
182
+ }, [selection, checkedKeys, rowKeyField]);
213
183
  var handleToggle = (0, _react.useCallback)(function (columnName) {
214
184
  var lastVisibleColumn = null;
215
185
  var visibleCount = 0;
@@ -240,7 +210,6 @@ var QbsTable = function QbsTable(_ref) {
240
210
  }, [columns]);
241
211
  var handleColumnWidth = (0, _react.useCallback)(function (newWidth, dataKey) {
242
212
  if (newWidth === undefined || dataKey === undefined) return;
243
- REFRESH_KEY = REFRESH_KEY + 1;
244
213
  setColumns(function (prevColumns) {
245
214
  return prevColumns.map(function (column) {
246
215
  return column.field === dataKey ? (0, _extends2["default"])({}, column, {
@@ -260,21 +229,14 @@ var QbsTable = function QbsTable(_ref) {
260
229
  });
261
230
  }
262
231
  }, [wordWrap]);
263
- (0, _react.useEffect)(function () {
264
- if (!defaultRowView) {
265
- setWordWrap('break-word');
266
- } else {
267
- setWordWrap(false);
268
- }
269
- REFRESH_KEY = REFRESH_KEY + 1;
270
- }, [defaultRowView]);
271
232
  var onReorder = (0, _react.useCallback)(function (columns) {
272
233
  setColumns(columns);
273
234
  }, []);
274
235
 
275
236
  // useEffect(() => {
276
237
  // }, [columns]);
277
- var handleClear = function handleClear(_ref3) {
238
+
239
+ var handleClear = function handleClear(_ref2) {
278
240
  setCheckedKeys([]);
279
241
  handleChecked([]);
280
242
  };
@@ -303,25 +265,12 @@ var QbsTable = function QbsTable(_ref) {
303
265
  searchPlaceholder: searchPlaceholder,
304
266
  setTableViewToggle: setTableViewToggle,
305
267
  tableViewToggle: tableViewToggle,
306
- enableTableToggle: enableTableToggle,
307
- rowViewToggle: rowViewToggle,
308
- defaultRowView: defaultRowView,
309
- fullWidthView: fullWidthView,
310
- setTableFullView: setTableFullView,
311
- setRowViewToggle: setRowViewToggle,
312
- isFullScreen: isFullScreen,
313
- labels: labels
268
+ enableTableToggle: enableTableToggle
314
269
  };
315
- (0, _react.useEffect)(function () {
316
- if (!dataTheme || typeof document === 'undefined') return;
317
- document.body.setAttribute('data-theme', dataTheme === 'dark' ? 'dark' : 'light');
318
- document.documentElement.dataset.theme = dataTheme;
319
- }, [dataTheme]);
320
270
  var themeToggle = (0, _react.useMemo)(function () {
321
- return typeof document !== 'undefined' ? document.getElementById('themeToggle') : null;
271
+ return document.getElementById('themeToggle');
322
272
  }, []);
323
273
  (0, _react.useEffect)(function () {
324
- if (theme || typeof document === 'undefined') return;
325
274
  var handleThemeToggle = function handleThemeToggle() {
326
275
  if (themeToggle !== null && themeToggle !== void 0 && themeToggle.checked) {
327
276
  document.body.setAttribute('data-theme', 'dark');
@@ -343,8 +292,9 @@ var QbsTable = function QbsTable(_ref) {
343
292
  themeToggle === null || themeToggle === void 0 ? void 0 : themeToggle.removeEventListener('change', handleThemeToggle);
344
293
  document.removeEventListener('DOMContentLoaded', handleDOMContentLoaded);
345
294
  };
346
- }, [theme, themeToggle]);
295
+ }, [themeToggle]);
347
296
  var handleExpanded = (0, _react.useCallback)(function (rowData) {
297
+ console.log(rowData);
348
298
  var keyValue = dataRowKey;
349
299
  var key = rowData[keyValue];
350
300
  var nextExpandedRowKeys = new Set(expandedRowKeys);
@@ -519,26 +469,26 @@ var QbsTable = function QbsTable(_ref) {
519
469
  // [columns, dataTheme]
520
470
  // );
521
471
  var columnsRendered = (0, _react.useMemo)(function () {
522
- return (columns != null ? columns : []).map(function (_ref4) {
523
- var title = _ref4.title,
524
- field = _ref4.field,
525
- resizable = _ref4.resizable,
526
- sortable = _ref4.sortable,
527
- colWidth = _ref4.colWidth,
528
- align = _ref4.align,
529
- grouped = _ref4.grouped,
530
- groupHeader = _ref4.groupHeader,
531
- fixed = _ref4.fixed,
532
- children = _ref4.children,
533
- customCell = _ref4.customCell,
534
- renderCell = _ref4.renderCell,
535
- isVisible = _ref4.isVisible,
536
- link = _ref4.link,
537
- getPath = _ref4.getPath,
538
- rowClick = _ref4.rowClick,
539
- sortKey = _ref4.sortKey,
540
- type = _ref4.type,
541
- hideLink = _ref4.hideLink;
472
+ return (columns != null ? columns : []).map(function (_ref3) {
473
+ var title = _ref3.title,
474
+ field = _ref3.field,
475
+ resizable = _ref3.resizable,
476
+ sortable = _ref3.sortable,
477
+ colWidth = _ref3.colWidth,
478
+ align = _ref3.align,
479
+ grouped = _ref3.grouped,
480
+ groupHeader = _ref3.groupHeader,
481
+ fixed = _ref3.fixed,
482
+ children = _ref3.children,
483
+ customCell = _ref3.customCell,
484
+ renderCell = _ref3.renderCell,
485
+ isVisible = _ref3.isVisible,
486
+ link = _ref3.link,
487
+ getPath = _ref3.getPath,
488
+ rowClick = _ref3.rowClick,
489
+ sortKey = _ref3.sortKey,
490
+ type = _ref3.type,
491
+ hideLink = _ref3.hideLink;
542
492
  return isVisible ? grouped ? /*#__PURE__*/_react["default"].createElement(_ColumnGroup["default"], {
543
493
  header: groupHeader,
544
494
  fixed: fixed,
@@ -606,51 +556,33 @@ var QbsTable = function QbsTable(_ref) {
606
556
  },
607
557
  // ✅ Fix: Type assertion to ReactElement[]
608
558
  [columns, dataTheme]);
609
- var handleInfiniteScroll = function handleInfiniteScroll(scroll) {
610
- if (!infiniteScroll) return;
611
- var wrapper = wheelWrapperRef.current;
612
- if (!wrapper || !hasMoreData || infiniteLoading) return;
613
- var scrollTop = wrapper.scrollTop,
614
- clientHeight = wrapper.clientHeight;
615
- var scrollHeight = Math.abs(scroll) + (height - headerHeight);
616
- // Trigger fetch when user scrolls within 100px of bottom
617
- if (scrollTop + clientHeight >= scrollHeight - 70) {
618
- loadMoreData === null || loadMoreData === void 0 ? void 0 : loadMoreData(); // fetch next page here
619
- }
620
- };
621
559
  return /*#__PURE__*/_react["default"].createElement("div", {
622
560
  className: "qbs-table " + classes.tableContainerClass,
623
- "data-theme": dataTheme,
624
- dir: rtl ? 'rtl' : 'ltr'
561
+ "data-theme": dataTheme
625
562
  }, toolbar && /*#__PURE__*/_react["default"].createElement(_Toolbar["default"], toolbarProps), /*#__PURE__*/_react["default"].createElement("div", {
626
563
  className: "qbs-table-border-wrap"
627
564
  }, tableViewToggle ? /*#__PURE__*/_react["default"].createElement(_Table["default"], {
628
565
  height: autoHeight ? undefined : height,
629
- key: tableKey + REFRESH_KEY,
566
+ key: tableKey,
630
567
  tableKey: tableKey,
631
568
  data: data,
632
- rtl: rtl,
633
569
  tableBodyRef: tableBodyRef,
634
570
  dataTheme: dataTheme,
635
571
  wordWrap: wordWrap,
636
- wheelWrapperRef: wheelWrapperRef,
637
- rowHeight: rowHeight,
638
572
  autoHeight: autoHeight,
639
- handleInfiniteScroll: handleInfiniteScroll,
640
573
  sortColumn: sortColumn,
641
574
  style: {
642
575
  position: 'relative'
643
576
  },
644
577
  sortType: sortType,
645
578
  onSortColumn: handleSortColumn,
646
- infiniteLoading: infiniteLoading,
647
579
  onRowClick: onRowClick,
648
580
  tableBodyHeight: tableBodyHeight,
649
581
  cellBordered: cellBordered,
650
582
  bordered: bordered,
651
583
  renderEmpty: function renderEmpty(info) {
652
584
  return _renderEmpty ? _renderEmpty(info) : /*#__PURE__*/_react["default"].createElement(_empty["default"], {
653
- title: emptyTitle != null ? emptyTitle : labels.noDataFound,
585
+ title: emptyTitle != null ? emptyTitle : 'No Data Found',
654
586
  subtitle: emptySubTitle
655
587
  });
656
588
  },
@@ -659,11 +591,12 @@ var QbsTable = function QbsTable(_ref) {
659
591
  headerHeight: headerHeight,
660
592
  rowExpandedHeight: rowExpandedHeight,
661
593
  loading: isLoading != null ? isLoading : loading,
662
- showHeader: showHeader,
594
+ showHeader: true,
663
595
  defaultChecked: true,
664
596
  expandedRowKeys: expandedRowKeys,
665
597
  onExpandChange: onExpandChange,
666
598
  rowKey: dataRowKey != null ? dataRowKey : 'id',
599
+ rowClassName: selection ? getRowClassName : undefined,
667
600
  defaultExpandAllRows: defaultExpandAllRows,
668
601
  shouldUpdateScroll: shouldUpdateScroll,
669
602
  renderRowExpanded: function renderRowExpanded(rowData) {
@@ -752,12 +685,9 @@ var QbsTable = function QbsTable(_ref) {
752
685
  onReorder: onReorder,
753
686
  isOpen: isOpen,
754
687
  tableHeight: height,
755
- viewMode: viewMode,
756
- setViewMode: setViewMode,
757
688
  setIsOpen: setIsOpen,
758
689
  handleResetColumns: handleResetColumns,
759
- handleColumnToggle: handleColumnToggle,
760
- labels: labels
690
+ handleColumnToggle: handleColumnToggle
761
691
  })), /*#__PURE__*/_react["default"].createElement(_Cell["default"], null)), actionProps && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.length) > 0 && /*#__PURE__*/_react["default"].createElement(_Column["default"], {
762
692
  width: 40,
763
693
  fixed: "right"
@@ -771,17 +701,12 @@ var QbsTable = function QbsTable(_ref) {
771
701
  onToggle: handleToggle,
772
702
  tableHeight: height,
773
703
  onReorder: onReorder,
774
- viewMode: viewMode,
775
- setViewMode: setViewMode,
776
704
  isOpen: isOpen,
777
705
  setIsOpen: setIsOpen,
778
706
  handleResetColumns: handleResetColumns,
779
- handleColumnToggle: handleColumnToggle,
780
- labels: labels
707
+ handleColumnToggle: handleColumnToggle
781
708
  })), /*#__PURE__*/_react["default"].createElement(_CustomTableCell.ActionCell, {
782
709
  tableBodyRef: tableBodyRef,
783
- dropType: dropType,
784
- wheelWrapperRef: wheelWrapperRef,
785
710
  actionProps: actionProps,
786
711
  className: classes.cellClass + " " + classes.actionCellClass,
787
712
  handleMenuActions: handleMenuActions,
@@ -796,7 +721,7 @@ var QbsTable = function QbsTable(_ref) {
796
721
  }, ((data === null || data === void 0 ? void 0 : data.length) === 0 || !data) && !isLoading && /*#__PURE__*/_react["default"].createElement("div", {
797
722
  className: "flex flex-col gap-2 p-2 mt-6 card-empty-container"
798
723
  }, /*#__PURE__*/_react["default"].createElement(_empty["default"], {
799
- title: emptyTitle != null ? emptyTitle : labels.noDataFound,
724
+ title: emptyTitle != null ? emptyTitle : 'No Data Found',
800
725
  subtitle: emptySubTitle
801
726
  })), isLoading ? handleCustomCardLoader ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, handleCustomCardLoader()) : /*#__PURE__*/_react["default"].createElement("div", {
802
727
  className: "flex flex-col gap-2 p-2"
@@ -811,13 +736,10 @@ var QbsTable = function QbsTable(_ref) {
811
736
  childDetailHeading: childDetailHeading,
812
737
  columns: columns,
813
738
  tableBodyRef: tableBodyRef,
814
- actionProps: actionProps,
815
- labels: labels
739
+ actionProps: actionProps
816
740
  }));
817
741
  })), /*#__PURE__*/_react["default"].createElement("div", null, pagination && (data === null || data === void 0 ? void 0 : data.length) > 0 && /*#__PURE__*/_react["default"].createElement(_Pagination["default"], {
818
- paginationProps: paginationProps,
819
- labels: labels,
820
- dataTheme: dataTheme
742
+ paginationProps: paginationProps
821
743
  }))));
822
744
  };
823
745
  var _default = QbsTable;
@@ -11,7 +11,6 @@ var _ColumnGroup = _interopRequireDefault(require("../ColumnGroup"));
11
11
  var _HeaderCell = _interopRequireDefault(require("../HeaderCell"));
12
12
  var _Pagination = _interopRequireDefault(require("../Pagination"));
13
13
  var _Table = _interopRequireDefault(require("../Table"));
14
- var _labels = require("./labels");
15
14
  var _CustomTableCell = require("./CustomTableCell");
16
15
  var _Toolbar = _interopRequireDefault(require("./Toolbar"));
17
16
  var _ColumShowHide = _interopRequireDefault(require("./utilities/ColumShowHide"));
@@ -98,13 +97,7 @@ var QbsTable = function QbsTable(_ref) {
98
97
  _renderEmpty = _ref.renderEmpty,
99
98
  autoHeight = _ref.autoHeight,
100
99
  emptySubTitle = _ref.emptySubTitle,
101
- emptyTitle = _ref.emptyTitle,
102
- _ref$dropType = _ref.dropType,
103
- dropType = _ref$dropType === void 0 ? 'horizontal' : _ref$dropType,
104
- labelsProp = _ref.labels;
105
- var labels = (0, _react.useMemo)(function () {
106
- return (0, _labels.mergeLabels)(labelsProp);
107
- }, [labelsProp]);
100
+ emptyTitle = _ref.emptyTitle;
108
101
  var _useState = (0, _react.useState)(false),
109
102
  loading = _useState[0],
110
103
  setLoading = _useState[1];
@@ -115,15 +108,14 @@ var QbsTable = function QbsTable(_ref) {
115
108
  checkedKeys = _useState3[0],
116
109
  setCheckedKeys = _useState3[1];
117
110
  var dataTheme = (0, _react.useMemo)(function () {
118
- var _ref2;
119
- return (_ref2 = theme != null ? theme : typeof localStorage !== 'undefined' ? localStorage.getItem('theme') : null) != null ? _ref2 : 'light';
111
+ var _localStorage$getItem;
112
+ return (_localStorage$getItem = localStorage.getItem('theme')) != null ? _localStorage$getItem : theme;
120
113
  }, [theme]);
121
114
  var _useState4 = (0, _react.useState)(false),
122
115
  isOpen = _useState4[0],
123
116
  setIsOpen = _useState4[1];
124
117
  var prevColumns = (0, _react.useRef)(null);
125
118
  var tableBodyRef = (0, _react.useRef)(null);
126
- var wheelWrapperRef = (0, _react.useRef)(null);
127
119
  var handleSortColumn = (0, _react.useCallback)(function (sortColumn, sortType) {
128
120
  setLoading(true);
129
121
  setTimeout(function () {
@@ -163,6 +155,12 @@ var QbsTable = function QbsTable(_ref) {
163
155
  handleChecked(updatedKeys);
164
156
  }
165
157
  }, [checkedKeys]);
158
+ var rowKeyField = dataRowKey != null ? dataRowKey : 'id';
159
+ var getRowClassName = (0, _react.useCallback)(function (rowData) {
160
+ if (!selection) return '';
161
+ var key = rowData === null || rowData === void 0 ? void 0 : rowData[rowKeyField];
162
+ return key !== undefined && checkedKeys !== null && checkedKeys !== void 0 && checkedKeys.includes(key) ? 'qbs-table-row-checked' : '';
163
+ }, [selection, checkedKeys, rowKeyField]);
166
164
  var handleToggle = (0, _react.useCallback)(function (columnName) {
167
165
  var lastVisibleColumn = null;
168
166
  var visibleCount = 0;
@@ -219,7 +217,7 @@ var QbsTable = function QbsTable(_ref) {
219
217
  // useEffect(() => {
220
218
  // }, [columns]);
221
219
 
222
- var handleClear = function handleClear(_ref3) {
220
+ var handleClear = function handleClear(_ref2) {
223
221
  setCheckedKeys([]);
224
222
  handleChecked([]);
225
223
  };
@@ -245,19 +243,12 @@ var QbsTable = function QbsTable(_ref) {
245
243
  onSelect: handleClear,
246
244
  handleColumnToggle: handleColumnToggle,
247
245
  dataLength: data === null || data === void 0 ? void 0 : data.length,
248
- searchPlaceholder: searchPlaceholder,
249
- labels: labels
246
+ searchPlaceholder: searchPlaceholder
250
247
  };
251
- (0, _react.useEffect)(function () {
252
- if (!dataTheme || typeof document === 'undefined') return;
253
- document.body.setAttribute('data-theme', dataTheme === 'dark' ? 'dark' : 'light');
254
- document.documentElement.dataset.theme = dataTheme;
255
- }, [dataTheme]);
256
248
  var themeToggle = (0, _react.useMemo)(function () {
257
- return typeof document !== 'undefined' ? document.getElementById('themeToggle') : null;
249
+ return document.getElementById('themeToggle');
258
250
  }, []);
259
251
  (0, _react.useEffect)(function () {
260
- if (theme || typeof document === 'undefined') return;
261
252
  var handleThemeToggle = function handleThemeToggle() {
262
253
  if (themeToggle !== null && themeToggle !== void 0 && themeToggle.checked) {
263
254
  document.body.setAttribute('data-theme', 'dark');
@@ -279,8 +270,9 @@ var QbsTable = function QbsTable(_ref) {
279
270
  themeToggle === null || themeToggle === void 0 ? void 0 : themeToggle.removeEventListener('change', handleThemeToggle);
280
271
  document.removeEventListener('DOMContentLoaded', handleDOMContentLoaded);
281
272
  };
282
- }, [theme, themeToggle]);
273
+ }, [themeToggle]);
283
274
  var handleExpanded = (0, _react.useCallback)(function (rowData) {
275
+ console.log(rowData);
284
276
  var keyValue = dataRowKey;
285
277
  var key = rowData[keyValue];
286
278
  var nextExpandedRowKeys = new Set(expandedRowKeys);
@@ -339,26 +331,26 @@ var QbsTable = function QbsTable(_ref) {
339
331
  }) ? true : false;
340
332
  };
341
333
  var columnsRendered = (0, _react.useMemo)(function () {
342
- return (columns != null ? columns : []).map(function (_ref4) {
343
- var title = _ref4.title,
344
- field = _ref4.field,
345
- resizable = _ref4.resizable,
346
- sortable = _ref4.sortable,
347
- colWidth = _ref4.colWidth,
348
- align = _ref4.align,
349
- grouped = _ref4.grouped,
350
- groupHeader = _ref4.groupHeader,
351
- fixed = _ref4.fixed,
352
- children = _ref4.children,
353
- customCell = _ref4.customCell,
354
- renderCell = _ref4.renderCell,
355
- isVisible = _ref4.isVisible,
356
- link = _ref4.link,
357
- getPath = _ref4.getPath,
358
- rowClick = _ref4.rowClick,
359
- sortKey = _ref4.sortKey,
360
- type = _ref4.type,
361
- hideLink = _ref4.hideLink;
334
+ return (columns != null ? columns : []).map(function (_ref3) {
335
+ var title = _ref3.title,
336
+ field = _ref3.field,
337
+ resizable = _ref3.resizable,
338
+ sortable = _ref3.sortable,
339
+ colWidth = _ref3.colWidth,
340
+ align = _ref3.align,
341
+ grouped = _ref3.grouped,
342
+ groupHeader = _ref3.groupHeader,
343
+ fixed = _ref3.fixed,
344
+ children = _ref3.children,
345
+ customCell = _ref3.customCell,
346
+ renderCell = _ref3.renderCell,
347
+ isVisible = _ref3.isVisible,
348
+ link = _ref3.link,
349
+ getPath = _ref3.getPath,
350
+ rowClick = _ref3.rowClick,
351
+ sortKey = _ref3.sortKey,
352
+ type = _ref3.type,
353
+ hideLink = _ref3.hideLink;
362
354
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isVisible && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, grouped ? /*#__PURE__*/_react["default"].createElement(_ColumnGroup["default"], {
363
355
  header: groupHeader,
364
356
  fixed: fixed,
@@ -438,7 +430,6 @@ var QbsTable = function QbsTable(_ref) {
438
430
  wordWrap: wordWrap,
439
431
  autoHeight: autoHeight,
440
432
  sortColumn: sortColumn,
441
- wheelWrapperRef: wheelWrapperRef,
442
433
  style: {
443
434
  position: 'relative'
444
435
  },
@@ -450,7 +441,7 @@ var QbsTable = function QbsTable(_ref) {
450
441
  bordered: bordered,
451
442
  renderEmpty: function renderEmpty(info) {
452
443
  return _renderEmpty ? _renderEmpty(info) : /*#__PURE__*/_react["default"].createElement(_empty["default"], {
453
- title: emptyTitle != null ? emptyTitle : labels.noDataFound,
444
+ title: emptyTitle != null ? emptyTitle : 'No Data Found',
454
445
  subtitle: emptySubTitle
455
446
  });
456
447
  },
@@ -464,6 +455,7 @@ var QbsTable = function QbsTable(_ref) {
464
455
  expandedRowKeys: expandedRowKeys,
465
456
  onExpandChange: onExpandChange,
466
457
  rowKey: dataRowKey != null ? dataRowKey : 'id',
458
+ rowClassName: selection ? getRowClassName : undefined,
467
459
  defaultExpandAllRows: defaultExpandAllRows,
468
460
  shouldUpdateScroll: shouldUpdateScroll,
469
461
  renderRowExpanded: function renderRowExpanded(rowData) {
@@ -554,8 +546,7 @@ var QbsTable = function QbsTable(_ref) {
554
546
  tableHeight: height,
555
547
  setIsOpen: setIsOpen,
556
548
  handleResetColumns: handleResetColumns,
557
- handleColumnToggle: handleColumnToggle,
558
- labels: labels
549
+ handleColumnToggle: handleColumnToggle
559
550
  })), /*#__PURE__*/_react["default"].createElement(_Cell["default"], null)), actionProps && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.length) > 0 && /*#__PURE__*/_react["default"].createElement(_Column["default"], {
560
551
  width: 40,
561
552
  fixed: "right"
@@ -572,19 +563,15 @@ var QbsTable = function QbsTable(_ref) {
572
563
  isOpen: isOpen,
573
564
  setIsOpen: setIsOpen,
574
565
  handleResetColumns: handleResetColumns,
575
- handleColumnToggle: handleColumnToggle,
576
- labels: labels
566
+ handleColumnToggle: handleColumnToggle
577
567
  })), /*#__PURE__*/_react["default"].createElement(_CustomTableCell.ActionCell, {
578
568
  tableBodyRef: tableBodyRef,
579
569
  actionProps: actionProps,
580
- dropType: dropType,
581
570
  className: classes.cellClass + " " + classes.actionCellClass,
582
571
  handleMenuActions: handleMenuActions,
583
572
  dataTheme: dataTheme
584
573
  }))), /*#__PURE__*/_react["default"].createElement("div", null, pagination && (data === null || data === void 0 ? void 0 : data.length) > 0 && /*#__PURE__*/_react["default"].createElement(_Pagination["default"], {
585
- paginationProps: paginationProps,
586
- labels: labels,
587
- dataTheme: dataTheme
574
+ paginationProps: paginationProps
588
575
  }))));
589
576
  };
590
577
  var _default = QbsTable;