qbs-react-grid 1.1.5 → 1.1.6

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/HeaderCell.js +1 -1
  2. package/es/qbsTable/QbsTable.js +10 -1
  3. package/lib/HeaderCell.js +1 -1
  4. package/lib/qbsTable/QbsTable.js +10 -1
  5. package/package.json +1 -1
  6. package/src/HeaderCell.tsx +1 -1
  7. package/src/qbsTable/QbsTable.tsx +17 -4
package/es/HeaderCell.js CHANGED
@@ -106,7 +106,7 @@ var HeaderCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
106
106
  headerHeight: headerHeight,
107
107
  isHeaderCell: true,
108
108
  align: !groupHeader ? align : undefined,
109
- verticalAlign: !groupHeader ? 'middle' : undefined,
109
+ verticalAlign: !groupHeader ? verticalAlign : undefined,
110
110
  onClick: !groupHeader ? handleClick : undefined
111
111
  }), children, renderSortColumn()), resizable ? /*#__PURE__*/React.createElement(ColumnResizeHandler, {
112
112
  defaultColumnWidth: columnWidth,
package/es/qbsTable/QbsTable.js CHANGED
@@ -271,6 +271,11 @@ var QbsTable = function QbsTable(_ref) {
271
271
  }
272
272
  prevColumns.current = columns;
273
273
  }, [columns, handleColumnsResizable]);
274
+ var findGrouped = function findGrouped() {
275
+ return columns !== null && columns !== void 0 && columns.find(function (item) {
276
+ return item.grouped;
277
+ }) ? true : false;
278
+ };
274
279
  var columnsRendered = useMemo(function () {
275
280
  return (columns != null ? columns : []).map(function (_ref3) {
276
281
  var title = _ref3.title,
@@ -308,7 +313,7 @@ var QbsTable = function QbsTable(_ref) {
308
313
  fixed: child.fixed
309
314
  }, /*#__PURE__*/React.createElement(HeaderCell, {
310
315
  dataTheme: dataTheme,
311
- verticalAlign: "middle",
316
+ verticalAlign: 'middle',
312
317
  className: " " + classes.headerClass,
313
318
  sortKey: child.sortKey
314
319
  }, child.title), customCell || child.link ? /*#__PURE__*/React.createElement(CustomTableCell, {
@@ -332,6 +337,7 @@ var QbsTable = function QbsTable(_ref) {
332
337
  onResize: handleColumnWidth
333
338
  }, /*#__PURE__*/React.createElement(HeaderCell, {
334
339
  dataTheme: dataTheme,
340
+ verticalAlign: findGrouped() ? 'middle' : undefined,
335
341
  className: " " + classes.headerClass,
336
342
  sortKey: sortKey
337
343
  }, title), customCell || link ? /*#__PURE__*/React.createElement(CustomTableCell, {
@@ -383,6 +389,7 @@ var QbsTable = function QbsTable(_ref) {
383
389
  align: "center",
384
390
  fixed: "left"
385
391
  }, /*#__PURE__*/React.createElement(HeaderCell, {
392
+ verticalAlign: findGrouped() ? 'middle' : undefined,
386
393
  className: " " + classes.headerlClass
387
394
  }, "#"), /*#__PURE__*/React.createElement(ExpandCell, {
388
395
  dataKey: dataRowKey,
@@ -396,6 +403,7 @@ var QbsTable = function QbsTable(_ref) {
396
403
  style: {
397
404
  padding: 0
398
405
  },
406
+ verticalAlign: findGrouped() ? 'middle' : undefined,
399
407
  dataTheme: dataTheme,
400
408
  className: "qbs-checkbox-border-none " + classes.headerlClass
401
409
  }, /*#__PURE__*/React.createElement("div", {
@@ -432,6 +440,7 @@ var QbsTable = function QbsTable(_ref) {
432
440
  width: 40,
433
441
  fixed: "right"
434
442
  }, /*#__PURE__*/React.createElement(HeaderCell, {
443
+ verticalAlign: findGrouped() ? 'middle' : undefined,
435
444
  className: " " + classes.headerlClass,
436
445
  dataTheme: dataTheme
437
446
  }, !columnToggle ? /*#__PURE__*/React.createElement(SettingsIcon, null) : /*#__PURE__*/React.createElement(ColumToggle, {
package/lib/HeaderCell.js CHANGED
@@ -113,7 +113,7 @@ var HeaderCell = /*#__PURE__*/_react["default"].forwardRef(function (props, ref)
113
113
  headerHeight: headerHeight,
114
114
  isHeaderCell: true,
115
115
  align: !groupHeader ? align : undefined,
116
- verticalAlign: !groupHeader ? 'middle' : undefined,
116
+ verticalAlign: !groupHeader ? verticalAlign : undefined,
117
117
  onClick: !groupHeader ? handleClick : undefined
118
118
  }), children, renderSortColumn()), resizable ? /*#__PURE__*/_react["default"].createElement(_ColumnResizeHandler["default"], {
119
119
  defaultColumnWidth: columnWidth,
package/lib/qbsTable/QbsTable.js CHANGED
@@ -278,6 +278,11 @@ var QbsTable = function QbsTable(_ref) {
278
278
  }
279
279
  prevColumns.current = columns;
280
280
  }, [columns, handleColumnsResizable]);
281
+ var findGrouped = function findGrouped() {
282
+ return columns !== null && columns !== void 0 && columns.find(function (item) {
283
+ return item.grouped;
284
+ }) ? true : false;
285
+ };
281
286
  var columnsRendered = (0, _react.useMemo)(function () {
282
287
  return (columns != null ? columns : []).map(function (_ref3) {
283
288
  var title = _ref3.title,
@@ -315,7 +320,7 @@ var QbsTable = function QbsTable(_ref) {
315
320
  fixed: child.fixed
316
321
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
317
322
  dataTheme: dataTheme,
318
- verticalAlign: "middle",
323
+ verticalAlign: 'middle',
319
324
  className: " " + classes.headerClass,
320
325
  sortKey: child.sortKey
321
326
  }, child.title), customCell || child.link ? /*#__PURE__*/_react["default"].createElement(_CustomTableCell.CustomTableCell, {
@@ -339,6 +344,7 @@ var QbsTable = function QbsTable(_ref) {
339
344
  onResize: handleColumnWidth
340
345
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
341
346
  dataTheme: dataTheme,
347
+ verticalAlign: findGrouped() ? 'middle' : undefined,
342
348
  className: " " + classes.headerClass,
343
349
  sortKey: sortKey
344
350
  }, title), customCell || link ? /*#__PURE__*/_react["default"].createElement(_CustomTableCell.CustomTableCell, {
@@ -390,6 +396,7 @@ var QbsTable = function QbsTable(_ref) {
390
396
  align: "center",
391
397
  fixed: "left"
392
398
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
399
+ verticalAlign: findGrouped() ? 'middle' : undefined,
393
400
  className: " " + classes.headerlClass
394
401
  }, "#"), /*#__PURE__*/_react["default"].createElement(_CustomTableCell.ExpandCell, {
395
402
  dataKey: dataRowKey,
@@ -403,6 +410,7 @@ var QbsTable = function QbsTable(_ref) {
403
410
  style: {
404
411
  padding: 0
405
412
  },
413
+ verticalAlign: findGrouped() ? 'middle' : undefined,
406
414
  dataTheme: dataTheme,
407
415
  className: "qbs-checkbox-border-none " + classes.headerlClass
408
416
  }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -439,6 +447,7 @@ var QbsTable = function QbsTable(_ref) {
439
447
  width: 40,
440
448
  fixed: "right"
441
449
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
450
+ verticalAlign: findGrouped() ? 'middle' : undefined,
442
451
  className: " " + classes.headerlClass,
443
452
  dataTheme: dataTheme
444
453
  }, !columnToggle ? /*#__PURE__*/_react["default"].createElement(_icons.SettingsIcon, null) : /*#__PURE__*/_react["default"].createElement(_ColumShowHide["default"], {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qbs-react-grid",
3
- "version": "1.1.5",
3
+ "version": "1.1.6",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
package/src/HeaderCell.tsx CHANGED
@@ -144,7 +144,7 @@ const HeaderCell = React.forwardRef((props: HeaderCellProps, ref: React.Ref<HTML
144
144
  headerHeight={headerHeight}
145
145
  isHeaderCell={true}
146
146
  align={!groupHeader ? align : undefined}
147
- verticalAlign={!groupHeader ? 'middle' : undefined}
147
+ verticalAlign={!groupHeader ? verticalAlign : undefined}
148
148
  onClick={!groupHeader ? handleClick : undefined}
149
149
  >
150
150
  {children}
package/src/qbsTable/QbsTable.tsx CHANGED
@@ -259,7 +259,9 @@ const QbsTable: React.FC<QbsTableProps> = ({
259
259
  }
260
260
  prevColumns.current = columns;
261
261
  }, [columns, handleColumnsResizable]);
262
-
262
+ const findGrouped = () => {
263
+ return columns?.find(item => item.grouped) ? true : false;
264
+ };
263
265
  const columnsRendered: React.ReactElement[] = useMemo(
264
266
  () =>
265
267
  (columns ?? []).map(
@@ -306,7 +308,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
306
308
  >
307
309
  <HeaderCell
308
310
  dataTheme={dataTheme}
309
- verticalAlign="middle"
311
+ verticalAlign={'middle'}
310
312
  className={` ${classes.headerClass}`}
311
313
  sortKey={child.sortKey}
312
314
  >
@@ -343,6 +345,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
343
345
  >
344
346
  <HeaderCell
345
347
  dataTheme={dataTheme}
348
+ verticalAlign={findGrouped() ? 'middle' : undefined}
346
349
  className={` ${classes.headerClass}`}
347
350
  sortKey={sortKey}
348
351
  >
@@ -405,7 +408,12 @@ const QbsTable: React.FC<QbsTableProps> = ({
405
408
  >
406
409
  {rowExpand && (
407
410
  <Column width={70} align="center" fixed="left">
408
- <HeaderCell className={` ${classes.headerlClass}`}>#</HeaderCell>
411
+ <HeaderCell
412
+ verticalAlign={findGrouped() ? 'middle' : undefined}
413
+ className={` ${classes.headerlClass}`}
414
+ >
415
+ #
416
+ </HeaderCell>
409
417
  <ExpandCell
410
418
  dataKey={dataRowKey}
411
419
  expandedRowKeys={expandedRowKeys}
@@ -417,6 +425,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
417
425
  <Column width={50} align="center" fixed="left">
418
426
  <HeaderCell
419
427
  style={{ padding: 0 }}
428
+ verticalAlign={findGrouped() ? 'middle' : undefined}
420
429
  dataTheme={dataTheme}
421
430
  className={`qbs-checkbox-border-none ${classes.headerlClass}`}
422
431
  >
@@ -460,7 +469,11 @@ const QbsTable: React.FC<QbsTableProps> = ({
460
469
 
461
470
  {actionProps && actionProps?.length > 0 && (
462
471
  <Column width={40} fixed="right">
463
- <HeaderCell className={` ${classes.headerlClass}`} dataTheme={dataTheme}>
472
+ <HeaderCell
473
+ verticalAlign={findGrouped() ? 'middle' : undefined}
474
+ className={` ${classes.headerlClass}`}
475
+ dataTheme={dataTheme}
476
+ >
464
477
  {!columnToggle ? (
465
478
  <SettingsIcon />
466
479
  ) : (