qbs-react-grid 1.0.42 → 1.0.43

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 (6) hide show
  1. package/es/qbsTable/utilities/ColumShowHide.js +1 -1
  2. package/es/qbsTable/utilities/ToolTip.js +1 -1
  3. package/lib/qbsTable/utilities/ColumShowHide.js +1 -1
  4. package/package.json +1 -1
  5. package/src/qbsTable/utilities/ColumShowHide.tsx +45 -41
  6. package/src/qbsTable/utilities/ToolTip.tsx +2 -1
package/es/qbsTable/utilities/ColumShowHide.js CHANGED
@@ -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", {
package/es/qbsTable/utilities/ToolTip.js CHANGED
@@ -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
  };
package/lib/qbsTable/utilities/ColumShowHide.js CHANGED
@@ -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.43",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
package/src/qbsTable/utilities/ColumShowHide.tsx CHANGED
@@ -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
  };
package/src/qbsTable/utilities/ToolTip.tsx CHANGED
@@ -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
  };