linear-react-components-ui 0.4.76-beta.26 → 0.4.76-beta.29
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.
- package/lib/assets/styles/effects.scss +0 -20
- package/lib/assets/styles/panel.scss +1 -4
- package/lib/assets/styles/table.scss +0 -13
- package/lib/assets/styles/tabs.scss +44 -49
- package/lib/assets/styles/treeview.scss +9 -0
- package/lib/icons/helper.js +0 -4
- package/lib/inputs/base/InputTextBase.js +3 -23
- package/lib/inputs/select/Dropdown.js +2 -5
- package/lib/inputs/select/multiple/index.js +3 -3
- package/lib/inputs/select/simple/index.js +2 -2
- package/lib/internals/constants.js +3 -4
- package/lib/internals/withTooltip.js +2 -2
- package/lib/list/Item.js +7 -25
- package/lib/list/index.js +10 -88
- package/lib/list/list.spec.js +102 -230
- package/lib/menus/sidenav/NavMenuItem.js +4 -12
- package/lib/menus/sidenav/index.js +3 -23
- package/lib/menus/sidenav/popup_menu_search/index.js +9 -13
- package/lib/menus/sidenav/sidenav.spec.js +19 -78
- package/lib/skeleton/SkeletonContainer.js +1 -1
- package/lib/table/Body.js +7 -41
- package/lib/table/Header.js +1 -12
- package/lib/table/HeaderColumn.js +2 -4
- package/lib/table/Row.js +7 -14
- package/lib/table/RowColumn.js +3 -4
- package/lib/table/helpers.js +1 -11
- package/lib/table/index.js +8 -32
- package/lib/tabs/Menu.js +11 -1
- package/lib/tabs/index.js +1 -1
- package/lib/treeview/Node.js +17 -5
- package/lib/treeview/index.js +23 -29
- package/lib/treeview/treeview.spec.js +9 -0
- package/package.json +1 -1
- package/lib/assets/styles/uitour.scss +0 -112
- package/lib/inputs/date/helper.js +0 -16
- package/lib/uitour/helpers.js +0 -15
- package/lib/uitour/index.js +0 -271
- package/lib/uitour/uitour.spec.js +0 -176
|
@@ -19,8 +19,6 @@ var _helpers = require("./helpers");
|
|
|
19
19
|
|
|
20
20
|
var _permissionValidations = require("../../permissionValidations");
|
|
21
21
|
|
|
22
|
-
var _withTooltip = _interopRequireDefault(require("../../internals/withTooltip"));
|
|
23
|
-
|
|
24
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
25
23
|
|
|
26
24
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -51,8 +49,7 @@ var NavMenuItem = function NavMenuItem(props) {
|
|
|
51
49
|
permissionAttr = props.permissionAttr,
|
|
52
50
|
maxWidth = props.maxWidth,
|
|
53
51
|
minWidth = props.minWidth,
|
|
54
|
-
columnsQtty = props.columnsQtty
|
|
55
|
-
targetRef = props.targetRef;
|
|
52
|
+
columnsQtty = props.columnsQtty;
|
|
56
53
|
|
|
57
54
|
var _useState = (0, _react.useState)(false),
|
|
58
55
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -96,7 +93,6 @@ var NavMenuItem = function NavMenuItem(props) {
|
|
|
96
93
|
return /*#__PURE__*/_react["default"].createElement(_helpers.SubMenuContext.Provider, {
|
|
97
94
|
value: contextValues()
|
|
98
95
|
}, /*#__PURE__*/_react["default"].createElement("li", {
|
|
99
|
-
ref: targetRef,
|
|
100
96
|
className: "item ".concat(url && !disabled && '-withlink', " ").concat(customClass, " ").concat(disabled && '-disabled'),
|
|
101
97
|
onMouseEnter: function onMouseEnter(e) {
|
|
102
98
|
_onMouseEnter(e);
|
|
@@ -140,8 +136,7 @@ NavMenuItem.propTypes = {
|
|
|
140
136
|
permissionAttr: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].arrayOf(_propTypes["default"].object)]),
|
|
141
137
|
minWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
|
|
142
138
|
maxWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
|
|
143
|
-
columnsQtty: _propTypes["default"].number
|
|
144
|
-
targetRef: _propTypes["default"].func
|
|
139
|
+
columnsQtty: _propTypes["default"].number
|
|
145
140
|
};
|
|
146
141
|
NavMenuItem.defaultProps = {
|
|
147
142
|
childrenIsSubMenu: true,
|
|
@@ -153,10 +148,7 @@ NavMenuItem.defaultProps = {
|
|
|
153
148
|
permissionAttr: undefined,
|
|
154
149
|
minWidth: 500,
|
|
155
150
|
maxWidth: '90%',
|
|
156
|
-
columnsQtty: 2
|
|
157
|
-
targetRef: undefined
|
|
151
|
+
columnsQtty: 2
|
|
158
152
|
};
|
|
159
|
-
|
|
160
|
-
var _default = (0, _withTooltip["default"])(NavMenuItem);
|
|
161
|
-
|
|
153
|
+
var _default = NavMenuItem;
|
|
162
154
|
exports["default"] = _default;
|
|
@@ -53,8 +53,6 @@ var _helpers = require("./helpers");
|
|
|
53
53
|
|
|
54
54
|
var _icons = _interopRequireDefault(require("../../icons"));
|
|
55
55
|
|
|
56
|
-
var constants = _interopRequireWildcard(require("../../internals/constants"));
|
|
57
|
-
|
|
58
56
|
var _popup_menu_search = _interopRequireDefault(require("./popup_menu_search"));
|
|
59
57
|
|
|
60
58
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -196,7 +194,6 @@ var SideNav = function SideNav(props) {
|
|
|
196
194
|
|
|
197
195
|
if ((type === _NavMenuItem["default"] || type === _NavSubMenuItem["default"]) && !child.props.children) {
|
|
198
196
|
menuItemsContent.push({
|
|
199
|
-
id: "".concat(child.props.title, "-").concat(_uuid["default"].v1()),
|
|
200
197
|
content: child.props.title,
|
|
201
198
|
url: child.props.url
|
|
202
199
|
});
|
|
@@ -220,20 +217,6 @@ var SideNav = function SideNav(props) {
|
|
|
220
217
|
}
|
|
221
218
|
};
|
|
222
219
|
|
|
223
|
-
var onKeyDown = function onKeyDown(e) {
|
|
224
|
-
if ([constants.keyCodes.F].includes(e.keyCode) && e.ctrlKey && e.shiftKey) {
|
|
225
|
-
e.preventDefault();
|
|
226
|
-
setSearchFieldHasNoFocus(false);
|
|
227
|
-
if (searchFieldRef.current) searchFieldRef.current.focus();
|
|
228
|
-
}
|
|
229
|
-
};
|
|
230
|
-
|
|
231
|
-
(0, _react.useEffect)(function () {
|
|
232
|
-
document.addEventListener('keydown', onKeyDown);
|
|
233
|
-
return function () {
|
|
234
|
-
document.removeEventListener('keydown', onKeyDown);
|
|
235
|
-
};
|
|
236
|
-
}, []);
|
|
237
220
|
(0, _react.useEffect)(function () {
|
|
238
221
|
if (enableMenuSearch && sideNavRef && sideNavRef.current) {
|
|
239
222
|
setSideNavDimensions(sideNavRef.current.getBoundingClientRect());
|
|
@@ -256,14 +239,14 @@ var SideNav = function SideNav(props) {
|
|
|
256
239
|
key: "popup-menusearch-".concat(_uuid["default"].v1())
|
|
257
240
|
}, /*#__PURE__*/_react["default"].createElement(_NavMenuItem["default"], {
|
|
258
241
|
childrenIsSubMenu: false,
|
|
259
|
-
customClass: "-customsidenavitem"
|
|
260
|
-
tooltip: "Pesquisar funcionalidades (CTRL+SHIFT+F)",
|
|
261
|
-
tooltipPosition: "right"
|
|
242
|
+
customClass: "-customsidenavitem"
|
|
262
243
|
}, /*#__PURE__*/_react["default"].createElement(_text["default"], _extends({
|
|
263
244
|
value: searchContent,
|
|
264
245
|
customClassForWrapper: "-customsizes",
|
|
265
246
|
customClass: "-customsizes",
|
|
266
247
|
customClassForSideButtons: "-iconcenter",
|
|
248
|
+
tooltip: "Pesquisar funcionalidades",
|
|
249
|
+
tooltipPosition: "right",
|
|
267
250
|
customClassForInputContent: searchFieldHasNoFocus ? '-hidden' : '',
|
|
268
251
|
onFocus: function onFocus() {
|
|
269
252
|
return setSearchFieldHasNoFocus(false);
|
|
@@ -280,9 +263,6 @@ var SideNav = function SideNav(props) {
|
|
|
280
263
|
}, returnLeftElements())), openSearchMenuPopup && /*#__PURE__*/_react["default"].createElement(_popup_menu_search["default"], _extends({}, props, {
|
|
281
264
|
style: getPopupMenuSearchStyle(),
|
|
282
265
|
searchContent: searchContent,
|
|
283
|
-
handleSetSearchContent: function handleSetSearchContent(searchValue) {
|
|
284
|
-
return setSearchContent(searchValue);
|
|
285
|
-
},
|
|
286
266
|
handlerClose: closeSearchMenuPopup,
|
|
287
267
|
menuItemsContent: menuItemsContent && returnMenuItems()
|
|
288
268
|
}))));
|
|
@@ -9,6 +9,8 @@ exports["default"] = void 0;
|
|
|
9
9
|
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
|
|
12
|
+
var _uuid = _interopRequireDefault(require("uuid"));
|
|
13
|
+
|
|
12
14
|
var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
13
15
|
|
|
14
16
|
var _search = _interopRequireDefault(require("../../../inputs/search"));
|
|
@@ -44,8 +46,7 @@ var PopupMenuSearch = function PopupMenuSearch(props) {
|
|
|
44
46
|
searchContent = props.searchContent,
|
|
45
47
|
menuItemsContent = props.menuItemsContent,
|
|
46
48
|
handlerClose = props.handlerClose,
|
|
47
|
-
menuSearchEmptyMessage = props.menuSearchEmptyMessage
|
|
48
|
-
handleSetSearchContent = props.handleSetSearchContent;
|
|
49
|
+
menuSearchEmptyMessage = props.menuSearchEmptyMessage;
|
|
49
50
|
|
|
50
51
|
var _useState = (0, _react.useState)(searchContent),
|
|
51
52
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -87,7 +88,6 @@ var PopupMenuSearch = function PopupMenuSearch(props) {
|
|
|
87
88
|
return item.content.toLowerCase().includes(filter);
|
|
88
89
|
});
|
|
89
90
|
setSearchFieldContent(value);
|
|
90
|
-
handleSetSearchContent(value);
|
|
91
91
|
setSearchResult(result);
|
|
92
92
|
};
|
|
93
93
|
|
|
@@ -101,19 +101,15 @@ var PopupMenuSearch = function PopupMenuSearch(props) {
|
|
|
101
101
|
return /*#__PURE__*/_react["default"].createElement(_list["default"], {
|
|
102
102
|
condensed: true,
|
|
103
103
|
transparent: true,
|
|
104
|
-
selectable: true,
|
|
105
|
-
onSelectItem: handlerClose,
|
|
106
104
|
style: {
|
|
107
|
-
margin: '25px 0px'
|
|
108
|
-
border: 'none',
|
|
109
|
-
boxShadow: 'none'
|
|
105
|
+
margin: '25px 0px'
|
|
110
106
|
}
|
|
111
|
-
}, searchResult.map(function (item) {
|
|
107
|
+
}, searchResult && searchResult.map(function (item) {
|
|
112
108
|
return /*#__PURE__*/_react["default"].createElement(_list.ListItem, {
|
|
113
|
-
key: item.
|
|
114
|
-
itemId: item.id,
|
|
109
|
+
key: "".concat(item.content, "-").concat(_uuid["default"].v1()),
|
|
115
110
|
url: item.url,
|
|
116
|
-
text: item.content
|
|
111
|
+
text: item.content,
|
|
112
|
+
onClick: handlerClose
|
|
117
113
|
});
|
|
118
114
|
}));
|
|
119
115
|
}
|
|
@@ -141,7 +137,7 @@ var PopupMenuSearch = function PopupMenuSearch(props) {
|
|
|
141
137
|
inputRef: searchFieldRef,
|
|
142
138
|
value: searchFieldContent,
|
|
143
139
|
onReset: function onReset() {
|
|
144
|
-
|
|
140
|
+
setSearchFieldContent('');
|
|
145
141
|
}
|
|
146
142
|
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
147
143
|
style: {
|
|
@@ -206,30 +206,38 @@ describe('SideNav Menu', function () {
|
|
|
206
206
|
|
|
207
207
|
expect(container.querySelector('.openclosemenu')).toBeInTheDocument();
|
|
208
208
|
});
|
|
209
|
-
it('should
|
|
210
|
-
var _render4 = (0, _react2.render)(sidebarNavMockRender(
|
|
209
|
+
it('should enable menu search', function () {
|
|
210
|
+
var _render4 = (0, _react2.render)(sidebarNavMockRender({
|
|
211
|
+
enableMenuSearch: true
|
|
212
|
+
})),
|
|
211
213
|
container = _render4.container;
|
|
214
|
+
|
|
215
|
+
expect(container.querySelector('.inputwrapper')).toBeInTheDocument();
|
|
216
|
+
});
|
|
217
|
+
it('should render all items', function () {
|
|
218
|
+
var _render5 = (0, _react2.render)(sidebarNavMockRender()),
|
|
219
|
+
container = _render5.container;
|
|
212
220
|
/* primeiro item é o float menu */
|
|
213
221
|
|
|
214
222
|
|
|
215
223
|
expect(container.querySelectorAll('li.item').length - 1).toBe(menuDataMock.length);
|
|
216
224
|
});
|
|
217
225
|
it('should be rendering 3 items SVGs', function () {
|
|
218
|
-
var
|
|
219
|
-
container =
|
|
226
|
+
var _render6 = (0, _react2.render)(sidebarNavMockRender()),
|
|
227
|
+
container = _render6.container;
|
|
220
228
|
|
|
221
229
|
expect(container.querySelectorAll('li.item .icon-component').length).toBe(3);
|
|
222
230
|
});
|
|
223
231
|
it('should open submenu on over', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
|
|
224
|
-
var
|
|
232
|
+
var _render7, container;
|
|
225
233
|
|
|
226
234
|
return regeneratorRuntime.wrap(function _callee$(_context) {
|
|
227
235
|
while (1) {
|
|
228
236
|
switch (_context.prev = _context.next) {
|
|
229
237
|
case 0:
|
|
230
|
-
|
|
238
|
+
_render7 = (0, _react2.render)(sidebarNavMockRender({
|
|
231
239
|
menuSize: 'large'
|
|
232
|
-
})), container =
|
|
240
|
+
})), container = _render7.container;
|
|
233
241
|
|
|
234
242
|
_react2.fireEvent.mouseOver(container.querySelector('.customscroll .item'));
|
|
235
243
|
|
|
@@ -249,13 +257,13 @@ describe('SideNav Menu', function () {
|
|
|
249
257
|
}, _callee);
|
|
250
258
|
})));
|
|
251
259
|
it('submenu should render all items', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
|
|
252
|
-
var
|
|
260
|
+
var _render8, container;
|
|
253
261
|
|
|
254
262
|
return regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
255
263
|
while (1) {
|
|
256
264
|
switch (_context2.prev = _context2.next) {
|
|
257
265
|
case 0:
|
|
258
|
-
|
|
266
|
+
_render8 = (0, _react2.render)(sidebarNavMockRender()), container = _render8.container;
|
|
259
267
|
|
|
260
268
|
_react2.fireEvent.mouseOver(container.querySelector('.customscroll .item'));
|
|
261
269
|
|
|
@@ -275,13 +283,13 @@ describe('SideNav Menu', function () {
|
|
|
275
283
|
}, _callee2);
|
|
276
284
|
})));
|
|
277
285
|
it('submenu should have title', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
|
|
278
|
-
var
|
|
286
|
+
var _render9, container;
|
|
279
287
|
|
|
280
288
|
return regeneratorRuntime.wrap(function _callee3$(_context3) {
|
|
281
289
|
while (1) {
|
|
282
290
|
switch (_context3.prev = _context3.next) {
|
|
283
291
|
case 0:
|
|
284
|
-
|
|
292
|
+
_render9 = (0, _react2.render)(sidebarNavMockRender()), container = _render9.container;
|
|
285
293
|
|
|
286
294
|
_react2.fireEvent.mouseOver(container.querySelector('.customscroll .item'));
|
|
287
295
|
|
|
@@ -300,72 +308,5 @@ describe('SideNav Menu', function () {
|
|
|
300
308
|
}
|
|
301
309
|
}, _callee3);
|
|
302
310
|
})));
|
|
303
|
-
describe('Popup Search Menu', function () {
|
|
304
|
-
it('should enable menu search', function () {
|
|
305
|
-
var _render9 = (0, _react2.render)(sidebarNavMockRender({
|
|
306
|
-
enableMenuSearch: true
|
|
307
|
-
})),
|
|
308
|
-
container = _render9.container;
|
|
309
|
-
|
|
310
|
-
expect(container.querySelector('.inputwrapper')).toBeInTheDocument();
|
|
311
|
-
});
|
|
312
|
-
it('should render tooltip on over menu search item', function () {
|
|
313
|
-
var _render10 = (0, _react2.render)(sidebarNavMockRender({
|
|
314
|
-
enableMenuSearch: true
|
|
315
|
-
})),
|
|
316
|
-
container = _render10.container;
|
|
317
|
-
|
|
318
|
-
var navitem = container.querySelector('.-customsidenavitem');
|
|
319
|
-
|
|
320
|
-
_react2.fireEvent.mouseOver(navitem);
|
|
321
|
-
|
|
322
|
-
expect(document.querySelector('.tooltip-component')).toBeInTheDocument();
|
|
323
|
-
});
|
|
324
|
-
it('should focus input when pressed HotKey', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
|
|
325
|
-
var _render11, container;
|
|
326
|
-
|
|
327
|
-
return regeneratorRuntime.wrap(function _callee4$(_context4) {
|
|
328
|
-
while (1) {
|
|
329
|
-
switch (_context4.prev = _context4.next) {
|
|
330
|
-
case 0:
|
|
331
|
-
_render11 = (0, _react2.render)(sidebarNavMockRender({
|
|
332
|
-
enableMenuSearch: true
|
|
333
|
-
})), container = _render11.container;
|
|
334
|
-
|
|
335
|
-
_react2.fireEvent.keyDown(container, {
|
|
336
|
-
key: 'F',
|
|
337
|
-
code: 'keyF',
|
|
338
|
-
keyCode: 70,
|
|
339
|
-
ctrlKey: true,
|
|
340
|
-
shiftKey: true
|
|
341
|
-
});
|
|
342
|
-
|
|
343
|
-
expect(container.querySelector('.inputwrapper .sidebuttons')).not.toBeInTheDocument();
|
|
344
|
-
|
|
345
|
-
case 3:
|
|
346
|
-
case "end":
|
|
347
|
-
return _context4.stop();
|
|
348
|
-
}
|
|
349
|
-
}
|
|
350
|
-
}, _callee4);
|
|
351
|
-
})));
|
|
352
|
-
it('should render menu search on input change', function () {
|
|
353
|
-
var _render12 = (0, _react2.render)(sidebarNavMockRender({
|
|
354
|
-
enableMenuSearch: true
|
|
355
|
-
})),
|
|
356
|
-
container = _render12.container;
|
|
357
|
-
|
|
358
|
-
var input = container.querySelector('.inputwrapper .inputcontent .textinput');
|
|
359
|
-
|
|
360
|
-
_react2.fireEvent.change(input, {
|
|
361
|
-
target: {
|
|
362
|
-
value: 'A'
|
|
363
|
-
}
|
|
364
|
-
});
|
|
365
|
-
|
|
366
|
-
expect(document.querySelector('.searchmenu')).toBeInTheDocument();
|
|
367
|
-
expect(document.querySelectorAll('.list-component .item').length).toBe(5);
|
|
368
|
-
});
|
|
369
|
-
});
|
|
370
311
|
});
|
|
371
312
|
});
|
|
@@ -28,7 +28,7 @@ var SkeletonContainer = function SkeletonContainer(_ref) {
|
|
|
28
28
|
};
|
|
29
29
|
|
|
30
30
|
SkeletonContainer.propTypes = {
|
|
31
|
-
children: _propTypes["default"].
|
|
31
|
+
children: _propTypes["default"].element.isRequired,
|
|
32
32
|
row: _propTypes["default"].bool,
|
|
33
33
|
customClass: _propTypes["default"].string,
|
|
34
34
|
style: _propTypes["default"].object
|
package/lib/table/Body.js
CHANGED
|
@@ -11,11 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
|
|
12
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
13
|
|
|
14
|
-
var _helpers =
|
|
15
|
-
|
|
16
|
-
var _skeleton = _interopRequireDefault(require("../skeleton"));
|
|
17
|
-
|
|
18
|
-
var _index = require("./index");
|
|
14
|
+
var _helpers = _interopRequireDefault(require("./helpers"));
|
|
19
15
|
|
|
20
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
17
|
|
|
@@ -23,42 +19,13 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
23
19
|
|
|
24
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
21
|
|
|
26
|
-
var renderChildren = function renderChildren(children, columnsCount, skeletonize, skeletonInRows) {
|
|
27
|
-
if (skeletonize && columnsCount) {
|
|
28
|
-
var rows = (0, _helpers.getArrayFromNumber)(skeletonInRows);
|
|
29
|
-
var columns = (0, _helpers.getArrayFromNumber)(columnsCount);
|
|
30
|
-
var skeletonChildrens = rows.map(function (index) {
|
|
31
|
-
return /*#__PURE__*/_react["default"].createElement(_index.TRow, {
|
|
32
|
-
key: index
|
|
33
|
-
}, columns.map(function (id) {
|
|
34
|
-
return /*#__PURE__*/_react["default"].createElement(_index.Td, {
|
|
35
|
-
key: id
|
|
36
|
-
}, /*#__PURE__*/_react["default"].createElement(_skeleton["default"], {
|
|
37
|
-
height: 16,
|
|
38
|
-
style: {
|
|
39
|
-
marginBottom: 0,
|
|
40
|
-
opacity: 1
|
|
41
|
-
}
|
|
42
|
-
}));
|
|
43
|
-
}));
|
|
44
|
-
});
|
|
45
|
-
return skeletonChildrens;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
return children;
|
|
49
|
-
};
|
|
50
|
-
|
|
51
22
|
var TableBody = function TableBody(_ref) {
|
|
52
23
|
var children = _ref.children,
|
|
53
24
|
customClass = _ref.customClass;
|
|
54
25
|
|
|
55
26
|
var _useContext = (0, _react.useContext)(_helpers["default"]),
|
|
56
27
|
bodyScrollable = _useContext.bodyScrollable,
|
|
57
|
-
bodyContainerRef = _useContext.bodyContainerRef
|
|
58
|
-
columnsCount = _useContext.columnsCount,
|
|
59
|
-
skeletonize = _useContext.skeletonize,
|
|
60
|
-
skeletonInRows = _useContext.skeletonInRows,
|
|
61
|
-
strict = _useContext.strict;
|
|
28
|
+
bodyContainerRef = _useContext.bodyContainerRef;
|
|
62
29
|
|
|
63
30
|
return bodyScrollable ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
64
31
|
className: "bodycontainer",
|
|
@@ -66,14 +33,13 @@ var TableBody = function TableBody(_ref) {
|
|
|
66
33
|
}, /*#__PURE__*/_react["default"].createElement("table", {
|
|
67
34
|
className: "innertable",
|
|
68
35
|
style: {
|
|
69
|
-
tableLayout: 'fixed'
|
|
70
|
-
contain: strict ? 'strict' : 'size layout style'
|
|
36
|
+
tableLayout: 'fixed'
|
|
71
37
|
}
|
|
72
38
|
}, /*#__PURE__*/_react["default"].createElement("tbody", {
|
|
73
|
-
className: "tbody ".concat(
|
|
74
|
-
},
|
|
75
|
-
className: "tbody ".concat(
|
|
76
|
-
},
|
|
39
|
+
className: "tbody ".concat(customClass)
|
|
40
|
+
}, children))) : /*#__PURE__*/_react["default"].createElement("tbody", {
|
|
41
|
+
className: "tbody ".concat(customClass)
|
|
42
|
+
}, children);
|
|
77
43
|
};
|
|
78
44
|
|
|
79
45
|
TableBody.propTypes = {
|
package/lib/table/Header.js
CHANGED
|
@@ -41,15 +41,6 @@ var getColumnsWidth = function getColumnsWidth(children) {
|
|
|
41
41
|
return columnsWidth;
|
|
42
42
|
};
|
|
43
43
|
|
|
44
|
-
var getColumnsCount = function getColumnsCount(children) {
|
|
45
|
-
if (children && children.props) {
|
|
46
|
-
var columnsChildren = children.props.children;
|
|
47
|
-
return columnsChildren.length;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
return undefined;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
44
|
var Header = function Header(_ref) {
|
|
54
45
|
var customClass = _ref.customClass,
|
|
55
46
|
children = _ref.children;
|
|
@@ -57,12 +48,10 @@ var Header = function Header(_ref) {
|
|
|
57
48
|
var _useContext = (0, _react.useContext)(_helpers["default"]),
|
|
58
49
|
bodyScrollWidth = _useContext.bodyScrollWidth,
|
|
59
50
|
bodyScrollable = _useContext.bodyScrollable,
|
|
60
|
-
handlerSetColumnsWidth = _useContext.handlerSetColumnsWidth
|
|
61
|
-
handlerSetColumnsCount = _useContext.handlerSetColumnsCount;
|
|
51
|
+
handlerSetColumnsWidth = _useContext.handlerSetColumnsWidth;
|
|
62
52
|
|
|
63
53
|
(0, _react.useEffect)(function () {
|
|
64
54
|
handlerSetColumnsWidth(getColumnsWidth(children));
|
|
65
|
-
handlerSetColumnsCount(getColumnsCount(children));
|
|
66
55
|
}, []);
|
|
67
56
|
return bodyScrollable ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
68
57
|
className: "headercontainer",
|
|
@@ -30,15 +30,13 @@ var HeaderColumn = function HeaderColumn(_ref) {
|
|
|
30
30
|
|
|
31
31
|
var _useContext = (0, _react.useContext)(_helpers["default"]),
|
|
32
32
|
skeletonize = _useContext.skeletonize,
|
|
33
|
-
vertical = _useContext.vertical
|
|
34
|
-
skeletonInHeader = _useContext.skeletonInHeader,
|
|
35
|
-
skeletonInRows = _useContext.skeletonInRows;
|
|
33
|
+
vertical = _useContext.vertical;
|
|
36
34
|
|
|
37
35
|
if (!visible) return null;
|
|
38
36
|
return /*#__PURE__*/_react["default"].createElement("th", {
|
|
39
37
|
className: "headercolumn ".concat(customClass, " text-align-").concat(textAlign),
|
|
40
38
|
style: style
|
|
41
|
-
}, skeletonize &&
|
|
39
|
+
}, skeletonize && !vertical ? /*#__PURE__*/_react["default"].createElement(_skeleton["default"], {
|
|
42
40
|
height: style.height ? null : 16,
|
|
43
41
|
style: {
|
|
44
42
|
marginBottom: 0
|
package/lib/table/Row.js
CHANGED
|
@@ -19,8 +19,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
19
19
|
|
|
20
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
21
|
|
|
22
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
23
|
-
|
|
24
22
|
var Row = function Row(props) {
|
|
25
23
|
var customClass = props.customClass,
|
|
26
24
|
children = props.children,
|
|
@@ -28,8 +26,7 @@ var Row = function Row(props) {
|
|
|
28
26
|
dataId = props.dataId,
|
|
29
27
|
_onClick = props.onClick,
|
|
30
28
|
height = props.height,
|
|
31
|
-
rowBorder = props.rowBorder
|
|
32
|
-
style = props.style;
|
|
29
|
+
rowBorder = props.rowBorder;
|
|
33
30
|
|
|
34
31
|
var _useContext = (0, _react.useContext)(_helpers["default"]),
|
|
35
32
|
selectedRowId = _useContext.selectedRowId,
|
|
@@ -37,16 +34,14 @@ var Row = function Row(props) {
|
|
|
37
34
|
handleTableRowClick = _useContext.handleTableRowClick,
|
|
38
35
|
handleTableColClick = _useContext.handleTableColClick,
|
|
39
36
|
vertical = _useContext.vertical,
|
|
40
|
-
skeletonize = _useContext.skeletonize
|
|
41
|
-
skeletonInRows = _useContext.skeletonInRows;
|
|
37
|
+
skeletonize = _useContext.skeletonize;
|
|
42
38
|
|
|
43
39
|
var contextValues = {
|
|
44
40
|
dataId: dataId,
|
|
45
41
|
rowBorder: rowBorder,
|
|
46
42
|
handleTableColClick: handleTableColClick,
|
|
47
43
|
vertical: vertical,
|
|
48
|
-
skeletonize: skeletonize
|
|
49
|
-
skeletonInRows: skeletonInRows
|
|
44
|
+
skeletonize: skeletonize
|
|
50
45
|
};
|
|
51
46
|
return /*#__PURE__*/_react["default"].createElement(_helpers.RowContext.Provider, {
|
|
52
47
|
value: contextValues
|
|
@@ -58,9 +53,9 @@ var Row = function Row(props) {
|
|
|
58
53
|
if (_onClick) _onClick(e, dataId);
|
|
59
54
|
},
|
|
60
55
|
id: rowId,
|
|
61
|
-
style:
|
|
56
|
+
style: {
|
|
62
57
|
height: height
|
|
63
|
-
}
|
|
58
|
+
}
|
|
64
59
|
}, children));
|
|
65
60
|
};
|
|
66
61
|
|
|
@@ -71,8 +66,7 @@ Row.propTypes = {
|
|
|
71
66
|
dataId: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
|
|
72
67
|
onClick: _propTypes["default"].func,
|
|
73
68
|
rowBorder: _propTypes["default"].bool,
|
|
74
|
-
height: _propTypes["default"].string
|
|
75
|
-
style: _propTypes["default"].object
|
|
69
|
+
height: _propTypes["default"].string
|
|
76
70
|
};
|
|
77
71
|
Row.defaultProps = {
|
|
78
72
|
customClass: '',
|
|
@@ -80,8 +74,7 @@ Row.defaultProps = {
|
|
|
80
74
|
onClick: undefined,
|
|
81
75
|
rowId: undefined,
|
|
82
76
|
rowBorder: true,
|
|
83
|
-
height: undefined
|
|
84
|
-
style: null
|
|
77
|
+
height: undefined
|
|
85
78
|
};
|
|
86
79
|
var _default = Row;
|
|
87
80
|
exports["default"] = _default;
|
package/lib/table/RowColumn.js
CHANGED
|
@@ -52,12 +52,11 @@ var RowColumn = function RowColumn(props) {
|
|
|
52
52
|
visible = props.visible;
|
|
53
53
|
var context = (0, _react.useContext)(_helpers.RowContext);
|
|
54
54
|
var skeletonize = context.skeletonize,
|
|
55
|
-
vertical = context.vertical
|
|
56
|
-
skeletonInRows = context.skeletonInRows;
|
|
55
|
+
vertical = context.vertical;
|
|
57
56
|
var hiddenContent = displayContent !== 'always';
|
|
58
57
|
|
|
59
58
|
var renderContent = function renderContent() {
|
|
60
|
-
if (skeletonize
|
|
59
|
+
if (skeletonize) {
|
|
61
60
|
return /*#__PURE__*/_react["default"].createElement(_skeleton["default"], {
|
|
62
61
|
height: 16,
|
|
63
62
|
style: {
|
|
@@ -72,7 +71,7 @@ var RowColumn = function RowColumn(props) {
|
|
|
72
71
|
};
|
|
73
72
|
|
|
74
73
|
if (!visible) return null;
|
|
75
|
-
if (skeletonize && !
|
|
74
|
+
if (skeletonize && !vertical) return null;
|
|
76
75
|
return /*#__PURE__*/_react["default"].createElement("td", {
|
|
77
76
|
className: "rowcolumn ".concat(customClass, " text-align-").concat(textAlign, " ").concat(!context.rowBorder && ' -noborder'),
|
|
78
77
|
style: style,
|
package/lib/table/helpers.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.RowContext = exports["default"] = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
@@ -14,15 +14,5 @@ var TableContext = /*#__PURE__*/_react["default"].createContext();
|
|
|
14
14
|
var RowContext = /*#__PURE__*/_react["default"].createContext();
|
|
15
15
|
|
|
16
16
|
exports.RowContext = RowContext;
|
|
17
|
-
|
|
18
|
-
var getArrayFromNumber = function getArrayFromNumber(number) {
|
|
19
|
-
return Array.from({
|
|
20
|
-
length: number
|
|
21
|
-
}, function (_, i) {
|
|
22
|
-
return i + 1;
|
|
23
|
-
});
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
exports.getArrayFromNumber = getArrayFromNumber;
|
|
27
17
|
var _default = TableContext;
|
|
28
18
|
exports["default"] = _default;
|