qbs-react-grid 1.0.42 → 1.0.44

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.
@@ -67,13 +67,14 @@ var ToolBar = function ToolBar(_ref) {
67
67
  return onSelect === null || onSelect === void 0 ? void 0 : onSelect([]);
68
68
  }
69
69
  }, "Clear"), selectedRowActions === null || selectedRowActions === void 0 ? void 0 : selectedRowActions.map(function (actions, index) {
70
- return /*#__PURE__*/React.createElement("button", {
70
+ return /*#__PURE__*/React.createElement(React.Fragment, null, !actions.hidden && /*#__PURE__*/React.createElement("button", {
71
71
  key: index.toString(),
72
72
  className: "btn",
73
+ disabled: actions.disabled,
73
74
  onClick: function onClick() {
74
75
  return actions === null || actions === void 0 ? void 0 : actions.action(checkedKeys);
75
76
  }
76
- }, actions.actionTitle);
77
+ }, actions.actionTitle));
77
78
  }))) : /*#__PURE__*/React.createElement("div", null, pagination && paginationProps && /*#__PURE__*/React.createElement("div", {
78
79
  className: "rows-count"
79
80
  }, getRowDisplayRange((_paginationProps$tota = paginationProps.total) != null ? _paginationProps$tota : 0, (_paginationProps$rows = paginationProps.rowsPerPage) != null ? _paginationProps$rows : 0, (_paginationProps$curr = paginationProps.currentPage) != null ? _paginationProps$curr : 0)))));
@@ -87,6 +87,7 @@ export interface QbsTableProps {
87
87
  actionTitle?: string;
88
88
  action: (checked: (number | string)[]) => void;
89
89
  disabled?: boolean;
90
+ hidden?: boolean;
90
91
  }[];
91
92
  selectedRows?: (number | string)[];
92
93
  classes?: {
@@ -120,6 +121,7 @@ export interface QbsTableToolbarProps {
120
121
  actionTitle?: string;
121
122
  action: (checked: (number | string)[]) => void;
122
123
  disabled?: boolean;
124
+ hidden?: boolean;
123
125
  }[];
124
126
  }
125
127
  export {};
@@ -145,7 +145,7 @@ var ColumnToggle = function ColumnToggle(_ref) {
145
145
  onClick: function onClick() {
146
146
  return setIsOpen(!isOpen);
147
147
  }
148
- }, /*#__PURE__*/React.createElement(SettingsIcon, null)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
148
+ }, /*#__PURE__*/React.createElement(SettingsIcon, null)), isOpen && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
149
149
  className: "qbs-table-column-popup",
150
150
  ref: popupRef
151
151
  }, /*#__PURE__*/React.createElement("div", {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { Whisper, Tooltip } from 'rsuite';
2
+ import { Tooltip, Whisper } from 'rsuite';
3
3
  var tooltip = function tooltip(titleL) {
4
4
  return /*#__PURE__*/React.createElement(Tooltip, null, titleL);
5
5
  };
@@ -74,13 +74,14 @@ var ToolBar = function ToolBar(_ref) {
74
74
  return onSelect === null || onSelect === void 0 ? void 0 : onSelect([]);
75
75
  }
76
76
  }, "Clear"), selectedRowActions === null || selectedRowActions === void 0 ? void 0 : selectedRowActions.map(function (actions, index) {
77
- return /*#__PURE__*/_react["default"].createElement("button", {
77
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !actions.hidden && /*#__PURE__*/_react["default"].createElement("button", {
78
78
  key: index.toString(),
79
79
  className: "btn",
80
+ disabled: actions.disabled,
80
81
  onClick: function onClick() {
81
82
  return actions === null || actions === void 0 ? void 0 : actions.action(checkedKeys);
82
83
  }
83
- }, actions.actionTitle);
84
+ }, actions.actionTitle));
84
85
  }))) : /*#__PURE__*/_react["default"].createElement("div", null, pagination && paginationProps && /*#__PURE__*/_react["default"].createElement("div", {
85
86
  className: "rows-count"
86
87
  }, (0, _tablecalc.getRowDisplayRange)((_paginationProps$tota = paginationProps.total) != null ? _paginationProps$tota : 0, (_paginationProps$rows = paginationProps.rowsPerPage) != null ? _paginationProps$rows : 0, (_paginationProps$curr = paginationProps.currentPage) != null ? _paginationProps$curr : 0)))));
@@ -87,6 +87,7 @@ export interface QbsTableProps {
87
87
  actionTitle?: string;
88
88
  action: (checked: (number | string)[]) => void;
89
89
  disabled?: boolean;
90
+ hidden?: boolean;
90
91
  }[];
91
92
  selectedRows?: (number | string)[];
92
93
  classes?: {
@@ -120,6 +121,7 @@ export interface QbsTableToolbarProps {
120
121
  actionTitle?: string;
121
122
  action: (checked: (number | string)[]) => void;
122
123
  disabled?: boolean;
124
+ hidden?: boolean;
123
125
  }[];
124
126
  }
125
127
  export {};
@@ -151,7 +151,7 @@ var ColumnToggle = function ColumnToggle(_ref) {
151
151
  onClick: function onClick() {
152
152
  return setIsOpen(!isOpen);
153
153
  }
154
- }, /*#__PURE__*/_react["default"].createElement(_icons.SettingsIcon, null)), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
154
+ }, /*#__PURE__*/_react["default"].createElement(_icons.SettingsIcon, null)), isOpen && /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
155
155
  className: "qbs-table-column-popup",
156
156
  ref: popupRef
157
157
  }, /*#__PURE__*/_react["default"].createElement("div", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qbs-react-grid",
3
- "version": "1.0.42",
3
+ "version": "1.0.44",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
@@ -74,13 +74,18 @@ const ToolBar: React.FC<QbsTableToolbarProps> = ({
74
74
  Clear
75
75
  </button>
76
76
  {selectedRowActions?.map((actions, index: number) => (
77
- <button
78
- key={index.toString()}
79
- className="btn"
80
- onClick={() => actions?.action(checkedKeys)}
81
- >
82
- {actions.actionTitle}
83
- </button>
77
+ <>
78
+ {!actions.hidden && (
79
+ <button
80
+ key={index.toString()}
81
+ className="btn"
82
+ disabled={actions.disabled}
83
+ onClick={() => actions?.action(checkedKeys)}
84
+ >
85
+ {actions.actionTitle}
86
+ </button>
87
+ )}
88
+ </>
84
89
  ))}
85
90
  </div>
86
91
  </div>
@@ -92,6 +92,7 @@ export interface QbsTableProps {
92
92
  actionTitle?: string;
93
93
  action: (checked: (number | string)[]) => void;
94
94
  disabled?: boolean;
95
+ hidden?: boolean;
95
96
  }[];
96
97
  selectedRows?: (number | string)[];
97
98
  classes?: { [key: string]: any };
@@ -124,5 +125,6 @@ export interface QbsTableToolbarProps {
124
125
  actionTitle?: string;
125
126
  action: (checked: (number | string)[]) => void;
126
127
  disabled?: boolean;
128
+ hidden?: boolean;
127
129
  }[];
128
130
  }
@@ -166,60 +166,64 @@ const ColumnToggle: React.FC<ColumnToggleProps> = ({
166
166
  <button onClick={() => setIsOpen(!isOpen)}>
167
167
  <SettingsIcon />
168
168
  </button>
169
- {/* {isOpen && ( */}
170
- <div>
171
- <div className="qbs-table-column-popup" ref={popupRef}>
172
- <div className="qbs-table-popup-container">
173
- <div className="qbs-table-popup-item">
174
- <div className="qbs-table-popup-label">FIXED COLUMNS</div>
175
- <div className="qbs-table-columns-container">
176
- <div className="qbs-table-column">
177
- {columns.map((column, index) =>
178
- column.fixed ? renderFixedColumn(column, index) : ''
179
- )}
169
+ {isOpen && (
170
+ <div>
171
+ <div className="qbs-table-column-popup" ref={popupRef}>
172
+ <div className="qbs-table-popup-container">
173
+ <div className="qbs-table-popup-item">
174
+ <div className="qbs-table-popup-label">FIXED COLUMNS</div>
175
+ <div className="qbs-table-columns-container">
176
+ <div className="qbs-table-column">
177
+ {columns.map((column, index) =>
178
+ column.fixed ? renderFixedColumn(column, index) : ''
179
+ )}
180
+ </div>
180
181
  </div>
181
182
  </div>
182
- </div>
183
- <div className="qbs-table-divider"></div>
184
- <div className="qbs-table-popup-item">
185
- <div className="qbs-table-popup-label">VISIBLE COLUMNS</div>
186
- <div className="qbs-table-columns-container">
187
- <div className="qbs-table-column">
188
- {columns.map((column, index) =>
189
- column.isVisible && !column.fixed ? renderColumn(column, index) : ''
190
- )}
183
+ <div className="qbs-table-divider"></div>
184
+ <div className="qbs-table-popup-item">
185
+ <div className="qbs-table-popup-label">VISIBLE COLUMNS</div>
186
+ <div className="qbs-table-columns-container">
187
+ <div className="qbs-table-column">
188
+ {columns.map((column, index) =>
189
+ column.isVisible && !column.fixed ? renderColumn(column, index) : ''
190
+ )}
191
+ </div>
191
192
  </div>
192
193
  </div>
194
+ {handleAvailableColumns() && (
195
+ <>
196
+ <div className="qbs-table-divider"></div>
197
+ <div className="qbs-table-popup-item">
198
+ <div className="qbs-table-popup-label">AVAILABLE COLUMNS</div>
199
+ <div className="qbs-table-columns-container">
200
+ <div className="qbs-table-column">
201
+ {columns.map((column, index) =>
202
+ !column.isVisible && !column.fixed ? renderFixedColumn(column, index) : ''
203
+ )}
204
+ </div>
205
+ </div>
206
+ </div>
207
+ </>
208
+ )}
193
209
  </div>
194
- {handleAvailableColumns() && (
210
+ {handleResetColumns && (
195
211
  <>
196
212
  <div className="qbs-table-divider"></div>
197
213
  <div className="qbs-table-popup-item">
198
- <div className="qbs-table-popup-label">AVAILABLE COLUMNS</div>
199
- <div className="qbs-table-columns-container">
200
- <div className="qbs-table-column">
201
- {columns.map((column, index) =>
202
- !column.isVisible && !column.fixed ? renderFixedColumn(column, index) : ''
203
- )}
204
- </div>
205
- </div>
214
+ <a
215
+ className="qbs-table-reset-link"
216
+ href="#"
217
+ onClick={() => handleResetColumns?.()}
218
+ >
219
+ Reset to default
220
+ </a>
206
221
  </div>
207
222
  </>
208
223
  )}
209
224
  </div>
210
- {handleResetColumns && (
211
- <>
212
- <div className="qbs-table-divider"></div>
213
- <div className="qbs-table-popup-item">
214
- <a className="qbs-table-reset-link" href="#" onClick={() => handleResetColumns?.()}>
215
- Reset to default
216
- </a>
217
- </div>
218
- </>
219
- )}
220
225
  </div>
221
- </div>
222
- {/* )} */}
226
+ )}
223
227
  </div>
224
228
  );
225
229
  };
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
- import { Whisper, Tooltip } from 'rsuite';
2
+ import { Tooltip, Whisper } from 'rsuite';
3
+
3
4
  const tooltip = (titleL: string) => {
4
5
  return <Tooltip>{titleL}</Tooltip>;
5
6
  };