qbs-react-grid 1.1.44 → 1.1.45

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.
@@ -83,7 +83,8 @@ var QbsTable = function QbsTable(_ref) {
83
83
  customRowStatus = _ref.customRowStatus,
84
84
  searchPlaceholder = _ref.searchPlaceholder,
85
85
  _ref$rowExpandedHeigh = _ref.rowExpandedHeight,
86
- rowExpandedHeight = _ref$rowExpandedHeigh === void 0 ? 517 : _ref$rowExpandedHeigh;
86
+ rowExpandedHeight = _ref$rowExpandedHeigh === void 0 ? 517 : _ref$rowExpandedHeigh,
87
+ renderSortIcon = _ref.renderSortIcon;
87
88
  var _useState = useState(false),
88
89
  loading = _useState[0],
89
90
  setLoading = _useState[1];
@@ -347,7 +348,8 @@ var QbsTable = function QbsTable(_ref) {
347
348
  dataTheme: dataTheme,
348
349
  verticalAlign: 'middle',
349
350
  className: " " + classes.headerClass,
350
- sortKey: child.sortKey
351
+ sortKey: child.sortKey,
352
+ renderSortIcon: renderSortIcon
351
353
  }, child.title), child.customCell || child.link ? /*#__PURE__*/React.createElement(CustomTableCell, {
352
354
  renderCell: child.renderCell,
353
355
  dataKey: child.field,
@@ -372,7 +374,8 @@ var QbsTable = function QbsTable(_ref) {
372
374
  dataTheme: dataTheme,
373
375
  verticalAlign: findGrouped() ? 'middle' : undefined,
374
376
  className: " " + classes.headerClass,
375
- sortKey: sortKey
377
+ sortKey: sortKey,
378
+ renderSortIcon: renderSortIcon
376
379
  }, title), customCell || link ? /*#__PURE__*/React.createElement(CustomTableCell, {
377
380
  renderCell: renderCell,
378
381
  dataKey: field,
@@ -431,7 +434,8 @@ var QbsTable = function QbsTable(_ref) {
431
434
  fixed: "left"
432
435
  }, /*#__PURE__*/React.createElement(HeaderCell, {
433
436
  verticalAlign: findGrouped() ? 'middle' : undefined,
434
- className: " " + classes.headerlClass
437
+ className: " " + classes.headerlClass,
438
+ renderSortIcon: renderSortIcon
435
439
  }, "#"), /*#__PURE__*/React.createElement(ExpandCell, {
436
440
  dataKey: dataRowKey,
437
441
  expandedRowKeys: expandedRowKeys,
@@ -446,6 +450,7 @@ var QbsTable = function QbsTable(_ref) {
446
450
  },
447
451
  verticalAlign: findGrouped() ? 'middle' : undefined,
448
452
  dataTheme: dataTheme,
453
+ renderSortIcon: renderSortIcon,
449
454
  className: "qbs-checkbox-border-none " + classes.headerlClass
450
455
  }, /*#__PURE__*/React.createElement("div", {
451
456
  style: {
@@ -483,7 +488,8 @@ var QbsTable = function QbsTable(_ref) {
483
488
  fixed: "left"
484
489
  }, /*#__PURE__*/React.createElement(HeaderCell, {
485
490
  verticalAlign: findGrouped() ? 'middle' : undefined,
486
- className: " " + classes.headerlClass
491
+ className: " " + classes.headerlClass,
492
+ renderSortIcon: renderSortIcon
487
493
  }, ' '), /*#__PURE__*/React.createElement(CustomRowStatus, {
488
494
  getIcon: customRowStatus.getIcon,
489
495
  dataKey: customRowStatus.field,
@@ -497,7 +503,8 @@ var QbsTable = function QbsTable(_ref) {
497
503
  }, /*#__PURE__*/React.createElement(HeaderCell, {
498
504
  verticalAlign: findGrouped() ? 'middle' : undefined,
499
505
  className: " " + classes.headerlClass,
500
- dataTheme: dataTheme
506
+ dataTheme: dataTheme,
507
+ renderSortIcon: renderSortIcon
501
508
  }, /*#__PURE__*/React.createElement(ColumToggle, {
502
509
  columns: columns,
503
510
  onToggle: handleToggle,
@@ -513,7 +520,8 @@ var QbsTable = function QbsTable(_ref) {
513
520
  }, /*#__PURE__*/React.createElement(HeaderCell, {
514
521
  verticalAlign: findGrouped() ? 'middle' : undefined,
515
522
  className: " " + classes.headerlClass,
516
- dataTheme: dataTheme
523
+ dataTheme: dataTheme,
524
+ renderSortIcon: renderSortIcon
517
525
  }, !columnToggle ? /*#__PURE__*/React.createElement(SettingsIcon, null) : /*#__PURE__*/React.createElement(ColumToggle, {
518
526
  columns: columns,
519
527
  onToggle: handleToggle,
@@ -110,6 +110,7 @@ export interface QbsTableProps {
110
110
  getPath?: (data: any) => string;
111
111
  };
112
112
  rowExpandedHeight?: number;
113
+ renderSortIcon?: (sortType?: 'desc' | 'asc') => React.ReactNode;
113
114
  }
114
115
  export interface QbsTableToolbarProps {
115
116
  title?: string;
@@ -89,7 +89,8 @@ var QbsTable = function QbsTable(_ref) {
89
89
  customRowStatus = _ref.customRowStatus,
90
90
  searchPlaceholder = _ref.searchPlaceholder,
91
91
  _ref$rowExpandedHeigh = _ref.rowExpandedHeight,
92
- rowExpandedHeight = _ref$rowExpandedHeigh === void 0 ? 517 : _ref$rowExpandedHeigh;
92
+ rowExpandedHeight = _ref$rowExpandedHeigh === void 0 ? 517 : _ref$rowExpandedHeigh,
93
+ renderSortIcon = _ref.renderSortIcon;
93
94
  var _useState = (0, _react.useState)(false),
94
95
  loading = _useState[0],
95
96
  setLoading = _useState[1];
@@ -353,7 +354,8 @@ var QbsTable = function QbsTable(_ref) {
353
354
  dataTheme: dataTheme,
354
355
  verticalAlign: 'middle',
355
356
  className: " " + classes.headerClass,
356
- sortKey: child.sortKey
357
+ sortKey: child.sortKey,
358
+ renderSortIcon: renderSortIcon
357
359
  }, child.title), child.customCell || child.link ? /*#__PURE__*/_react["default"].createElement(_CustomTableCell.CustomTableCell, {
358
360
  renderCell: child.renderCell,
359
361
  dataKey: child.field,
@@ -378,7 +380,8 @@ var QbsTable = function QbsTable(_ref) {
378
380
  dataTheme: dataTheme,
379
381
  verticalAlign: findGrouped() ? 'middle' : undefined,
380
382
  className: " " + classes.headerClass,
381
- sortKey: sortKey
383
+ sortKey: sortKey,
384
+ renderSortIcon: renderSortIcon
382
385
  }, title), customCell || link ? /*#__PURE__*/_react["default"].createElement(_CustomTableCell.CustomTableCell, {
383
386
  renderCell: renderCell,
384
387
  dataKey: field,
@@ -437,7 +440,8 @@ var QbsTable = function QbsTable(_ref) {
437
440
  fixed: "left"
438
441
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
439
442
  verticalAlign: findGrouped() ? 'middle' : undefined,
440
- className: " " + classes.headerlClass
443
+ className: " " + classes.headerlClass,
444
+ renderSortIcon: renderSortIcon
441
445
  }, "#"), /*#__PURE__*/_react["default"].createElement(_CustomTableCell.ExpandCell, {
442
446
  dataKey: dataRowKey,
443
447
  expandedRowKeys: expandedRowKeys,
@@ -452,6 +456,7 @@ var QbsTable = function QbsTable(_ref) {
452
456
  },
453
457
  verticalAlign: findGrouped() ? 'middle' : undefined,
454
458
  dataTheme: dataTheme,
459
+ renderSortIcon: renderSortIcon,
455
460
  className: "qbs-checkbox-border-none " + classes.headerlClass
456
461
  }, /*#__PURE__*/_react["default"].createElement("div", {
457
462
  style: {
@@ -489,7 +494,8 @@ var QbsTable = function QbsTable(_ref) {
489
494
  fixed: "left"
490
495
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
491
496
  verticalAlign: findGrouped() ? 'middle' : undefined,
492
- className: " " + classes.headerlClass
497
+ className: " " + classes.headerlClass,
498
+ renderSortIcon: renderSortIcon
493
499
  }, ' '), /*#__PURE__*/_react["default"].createElement(_CustomTableCell.CustomRowStatus, {
494
500
  getIcon: customRowStatus.getIcon,
495
501
  dataKey: customRowStatus.field,
@@ -503,7 +509,8 @@ var QbsTable = function QbsTable(_ref) {
503
509
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
504
510
  verticalAlign: findGrouped() ? 'middle' : undefined,
505
511
  className: " " + classes.headerlClass,
506
- dataTheme: dataTheme
512
+ dataTheme: dataTheme,
513
+ renderSortIcon: renderSortIcon
507
514
  }, /*#__PURE__*/_react["default"].createElement(_ColumShowHide["default"], {
508
515
  columns: columns,
509
516
  onToggle: handleToggle,
@@ -519,7 +526,8 @@ var QbsTable = function QbsTable(_ref) {
519
526
  }, /*#__PURE__*/_react["default"].createElement(_HeaderCell["default"], {
520
527
  verticalAlign: findGrouped() ? 'middle' : undefined,
521
528
  className: " " + classes.headerlClass,
522
- dataTheme: dataTheme
529
+ dataTheme: dataTheme,
530
+ renderSortIcon: renderSortIcon
523
531
  }, !columnToggle ? /*#__PURE__*/_react["default"].createElement(_icons.SettingsIcon, null) : /*#__PURE__*/_react["default"].createElement(_ColumShowHide["default"], {
524
532
  columns: columns,
525
533
  onToggle: handleToggle,
@@ -110,6 +110,7 @@ export interface QbsTableProps {
110
110
  getPath?: (data: any) => string;
111
111
  };
112
112
  rowExpandedHeight?: number;
113
+ renderSortIcon?: (sortType?: 'desc' | 'asc') => React.ReactNode;
113
114
  }
114
115
  export interface QbsTableToolbarProps {
115
116
  title?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qbs-react-grid",
3
- "version": "1.1.44",
3
+ "version": "1.1.45",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
@@ -74,7 +74,8 @@ const QbsTable: React.FC<QbsTableProps> = ({
74
74
  tableBodyHeight,
75
75
  customRowStatus,
76
76
  searchPlaceholder,
77
- rowExpandedHeight=517,
77
+ rowExpandedHeight = 517,
78
+ renderSortIcon
78
79
  }) => {
79
80
  const [loading, setLoading] = useState(false);
80
81
  const [columns, setColumns] = useState(propColumn);
@@ -355,6 +356,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
355
356
  verticalAlign={'middle'}
356
357
  className={` ${classes.headerClass}`}
357
358
  sortKey={child.sortKey}
359
+ renderSortIcon={renderSortIcon}
358
360
  >
359
361
  {child.title}
360
362
  </HeaderCell>
@@ -393,6 +395,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
393
395
  verticalAlign={findGrouped() ? 'middle' : undefined}
394
396
  className={` ${classes.headerClass}`}
395
397
  sortKey={sortKey}
398
+ renderSortIcon={renderSortIcon}
396
399
  >
397
400
  {title}
398
401
  </HeaderCell>
@@ -463,6 +466,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
463
466
  <HeaderCell
464
467
  verticalAlign={findGrouped() ? 'middle' : undefined}
465
468
  className={` ${classes.headerlClass}`}
469
+ renderSortIcon={renderSortIcon}
466
470
  >
467
471
  #
468
472
  </HeaderCell>
@@ -479,6 +483,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
479
483
  style={{ padding: 0 }}
480
484
  verticalAlign={findGrouped() ? 'middle' : undefined}
481
485
  dataTheme={dataTheme}
486
+ renderSortIcon={renderSortIcon}
482
487
  className={`qbs-checkbox-border-none ${classes.headerlClass}`}
483
488
  >
484
489
  <div
@@ -522,6 +527,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
522
527
  <HeaderCell
523
528
  verticalAlign={findGrouped() ? 'middle' : undefined}
524
529
  className={` ${classes.headerlClass}`}
530
+ renderSortIcon={renderSortIcon}
525
531
  >
526
532
  {' '}
527
533
  </HeaderCell>
@@ -543,6 +549,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
543
549
  verticalAlign={findGrouped() ? 'middle' : undefined}
544
550
  className={` ${classes.headerlClass}`}
545
551
  dataTheme={dataTheme}
552
+ renderSortIcon={renderSortIcon}
546
553
  >
547
554
  <ColumToggle
548
555
  columns={columns}
@@ -564,6 +571,7 @@ const QbsTable: React.FC<QbsTableProps> = ({
564
571
  verticalAlign={findGrouped() ? 'middle' : undefined}
565
572
  className={` ${classes.headerlClass}`}
566
573
  dataTheme={dataTheme}
574
+ renderSortIcon={renderSortIcon}
567
575
  >
568
576
  {!columnToggle ? (
569
577
  <SettingsIcon />
@@ -113,6 +113,7 @@ export interface QbsTableProps {
113
113
  getPath?: (data: any) => string;
114
114
  };
115
115
  rowExpandedHeight?: number;
116
+ renderSortIcon?: (sortType?: 'desc' | 'asc') => React.ReactNode;
116
117
  }
117
118
 
118
119
  export interface QbsTableToolbarProps {