@propellerads/table 2.0.2 → 4.2.0

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.
@@ -4,11 +4,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
6
 
7
- var React = _interopDefault(require('react'));
8
- var ReactTable = _interopDefault(require('react-table'));
9
- var styledComponents = require('styled-components');
7
+ var React = require('react');
8
+ var React__default = _interopDefault(React);
9
+ var reactTable = require('react-table');
10
+ var icon = require('@propellerads/icon');
11
+ var Checkbox = _interopDefault(require('@propellerads/input-checkbox'));
12
+ var styled = require('styled-components');
13
+ var styled__default = _interopDefault(styled);
10
14
  var stylevariables = require('@propellerads/stylevariables');
11
15
 
16
+ function _extends() {
17
+ _extends = Object.assign || function (target) {
18
+ for (var i = 1; i < arguments.length; i++) {
19
+ var source = arguments[i];
20
+
21
+ for (var key in source) {
22
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
23
+ target[key] = source[key];
24
+ }
25
+ }
26
+ }
27
+
28
+ return target;
29
+ };
30
+
31
+ return _extends.apply(this, arguments);
32
+ }
33
+
12
34
  function _objectWithoutPropertiesLoose(source, excluded) {
13
35
  if (source == null) return {};
14
36
  var target = {};
@@ -33,8 +55,390 @@ function _taggedTemplateLiteralLoose(strings, raw) {
33
55
  return strings;
34
56
  }
35
57
 
58
+ var useLoadingState = function useLoadingState(showLoadingState, loading, pageSize, columns, LoadingCellComponent) {
59
+ var loadingColumns = React.useMemo(function () {
60
+ return showLoadingState && loading ? columns.map(function (_ref, key) {
61
+ var maxWidth = _ref.maxWidth,
62
+ width = _ref.width,
63
+ Header = _ref.Header;
64
+ var column = {
65
+ Cell: LoadingCellComponent,
66
+ accessor: "empty_" + key
67
+ };
68
+
69
+ if (maxWidth) {
70
+ column.maxWidth = maxWidth;
71
+ }
72
+
73
+ if (width) {
74
+ column.width = width;
75
+ }
76
+
77
+ if (Header) {
78
+ column.Header = Header;
79
+ }
80
+
81
+ return column;
82
+ }) : [];
83
+ }, [columns, loading, showLoadingState]);
84
+ var loadingData = React.useMemo(function () {
85
+ if (showLoadingState && loading && columns && columns.length > 0) {
86
+ var dataObject = {};
87
+ var dataArray = [];
88
+
89
+ for (var i = 0; i < columns.length; i += 1) {
90
+ dataObject["empty_" + i] = '';
91
+ }
92
+
93
+ for (var _i = 0; _i < pageSize; _i += 1) {
94
+ dataArray.push(dataObject);
95
+ }
96
+
97
+ return dataArray;
98
+ }
99
+
100
+ return [];
101
+ }, [columns, loading, pageSize, showLoadingState]);
102
+ return {
103
+ loadingColumns: loadingColumns,
104
+ loadingData: loadingData
105
+ };
106
+ };
107
+
108
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
109
+ var TABLE_SHADOW_CLASS_NAME = {
110
+ LEFT: 'shadow_left',
111
+ RIGHT: 'shadow_right'
112
+ };
113
+
114
+ function changeClassName(tableWrapperNode, newClassNameList) {
115
+ var classList = tableWrapperNode.classList;
116
+ classList.remove(TABLE_SHADOW_CLASS_NAME.LEFT, TABLE_SHADOW_CLASS_NAME.RIGHT);
117
+ classList.add.apply(classList, newClassNameList);
118
+ }
119
+
120
+ function calculateNewClassNames(tableNode, tableWrapperNode) {
121
+ if (!tableNode || !tableWrapperNode) {
122
+ return;
123
+ }
124
+
125
+ var tableRect = tableNode.getBoundingClientRect();
126
+ var tableWrapperRect = tableWrapperNode.getBoundingClientRect();
127
+ var newClassName = [];
128
+ var tableRectLeft = Math.floor(tableRect.left);
129
+ var tableRectRight = Math.floor(tableRect.right);
130
+ var tableWrapperRectLeft = Math.floor(tableWrapperRect.left);
131
+ var tableWrapperRectRight = Math.floor(tableWrapperRect.right);
132
+
133
+ if (tableRectLeft < tableWrapperRectLeft) {
134
+ newClassName.push(TABLE_SHADOW_CLASS_NAME.LEFT);
135
+ }
136
+
137
+ if (tableRectRight > tableWrapperRectRight) {
138
+ newClassName.push(TABLE_SHADOW_CLASS_NAME.RIGHT);
139
+ }
140
+
141
+ changeClassName(tableWrapperNode, newClassName);
142
+ }
143
+
144
+ var useTableShadow = (function (tableRef, tableWrapperRef) {
145
+ React.useEffect(function () {
146
+ var _tableRef$current;
147
+
148
+ var ticking = false;
149
+
150
+ function onMousewheel() {
151
+ if (ticking) {
152
+ return;
153
+ }
154
+
155
+ window.requestAnimationFrame(function () {
156
+ calculateNewClassNames(tableRef.current, tableWrapperRef.current);
157
+ ticking = false;
158
+ });
159
+ ticking = true;
160
+ }
161
+
162
+ calculateNewClassNames(tableRef.current, tableWrapperRef.current);
163
+ tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$current = tableRef.current) === null || _tableRef$current === void 0 ? void 0 : _tableRef$current.addEventListener('mousewheel', onMousewheel);
164
+ window.addEventListener('resize', onMousewheel);
165
+ return function () {
166
+ var _tableRef$current2;
167
+
168
+ tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$current2 = tableRef.current) === null || _tableRef$current2 === void 0 ? void 0 : _tableRef$current2.removeEventListener('mousewheel', onMousewheel);
169
+ window.removeEventListener('resize', onMousewheel);
170
+ };
171
+ }, [tableRef.current, tableWrapperRef.current]);
172
+ });
173
+
174
+ var FOOTER_PLACEMENT;
175
+
176
+ (function (FOOTER_PLACEMENT) {
177
+ FOOTER_PLACEMENT["TOP"] = "top";
178
+ FOOTER_PLACEMENT["BOTTOM"] = "bottom";
179
+ })(FOOTER_PLACEMENT || (FOOTER_PLACEMENT = {}));
180
+
181
+ var defaultGetter = function defaultGetter(props) {
182
+ return props;
183
+ };
184
+ var cellGetter = function cellGetter(props, _ref) {
185
+ var _cell$column;
186
+
187
+ var cell = _ref.cell;
188
+ return _extends({}, props, {
189
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
190
+ // @ts-ignore
191
+ align: cell === null || cell === void 0 ? void 0 : (_cell$column = cell.column) === null || _cell$column === void 0 ? void 0 : _cell$column.align
192
+ });
193
+ };
194
+ var mainCellGetter = function mainCellGetter(props, _ref2) {
195
+ var column = _ref2.column;
196
+ return _extends({}, props, {
197
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
198
+ // @ts-ignore
199
+ align: column === null || column === void 0 ? void 0 : column.align
200
+ });
201
+ };
202
+ var getTableProps = function getTableProps(userGetter, getter) {
203
+ if (getter === void 0) {
204
+ getter = defaultGetter;
205
+ }
206
+
207
+ if (userGetter) {
208
+ return function (props) {
209
+ return _extends({}, getter(props), userGetter(props));
210
+ };
211
+ }
212
+
213
+ return getter;
214
+ };
215
+ var getTableElementProps = function getTableElementProps(userGetter, getter) {
216
+ if (getter === void 0) {
217
+ getter = defaultGetter;
218
+ }
219
+
220
+ if (userGetter) {
221
+ return function (props, meta) {
222
+ return _extends({}, getter(props, meta), userGetter(props, meta));
223
+ };
224
+ }
225
+
226
+ return getter;
227
+ };
228
+ var getTableRowProps = function getTableRowProps(userGetter, getter) {
229
+ if (getter === void 0) {
230
+ getter = defaultGetter;
231
+ }
232
+
233
+ if (userGetter) {
234
+ return function (props, meta) {
235
+ return _extends({}, getter(props, meta), userGetter(props, meta));
236
+ };
237
+ }
238
+
239
+ return getter;
240
+ };
241
+ var getTableCellProps = function getTableCellProps(userGetter, getter) {
242
+ if (getter === void 0) {
243
+ getter = defaultGetter;
244
+ }
245
+
246
+ if (userGetter) {
247
+ return function (props, meta) {
248
+ return _extends({}, getter(props, meta), userGetter(props, meta));
249
+ };
250
+ }
251
+
252
+ return getter;
253
+ };
254
+ var getTableElementInternalProps = function getTableElementInternalProps(internalProps, userGetter, getter) {
255
+ if (getter === void 0) {
256
+ getter = defaultGetter;
257
+ }
258
+
259
+ if (userGetter) {
260
+ return function (props, meta) {
261
+ return _extends({}, getter(_extends({}, props, internalProps), meta), userGetter(props, meta));
262
+ };
263
+ }
264
+
265
+ return function (props, meta) {
266
+ return getter(_extends({}, props, internalProps), meta);
267
+ };
268
+ };
269
+
270
+ function _templateObject18() {
271
+ var data = _taggedTemplateLiteralLoose(["\n background: ", ";\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n"]);
272
+
273
+ _templateObject18 = function _templateObject18() {
274
+ return data;
275
+ };
276
+
277
+ return data;
278
+ }
279
+
280
+ function _templateObject17() {
281
+ var data = _taggedTemplateLiteralLoose(["\n border-top: 1px solid ", ";\n margin-top: ", "px;\n"]);
282
+
283
+ _templateObject17 = function _templateObject17() {
284
+ return data;
285
+ };
286
+
287
+ return data;
288
+ }
289
+
290
+ function _templateObject16() {
291
+ var data = _taggedTemplateLiteralLoose(["\n flex: 1 0 auto;\n display: inline-flex;\n padding: 0;\n -webkit-box-align: center;\n align-items: center;\n"]);
292
+
293
+ _templateObject16 = function _templateObject16() {
294
+ return data;
295
+ };
296
+
297
+ return data;
298
+ }
299
+
300
+ function _templateObject15() {
301
+ var data = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 1 0 auto;\n box-shadow: inset 0 -1px 0 0 ", ";\n"]);
302
+
303
+ _templateObject15 = function _templateObject15() {
304
+ return data;
305
+ };
306
+
307
+ return data;
308
+ }
309
+
310
+ function _templateObject14() {
311
+ var data = _taggedTemplateLiteralLoose(["\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n user-select: none;\n \n ", ", ", " {\n padding: 0 4px;\n line-height: normal;\n position: relative;\n transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n color: ", ";\n font-weight: 500;\n outline: none;\n }\n"]);
312
+
313
+ _templateObject14 = function _templateObject14() {
314
+ return data;
315
+ };
316
+
317
+ return data;
318
+ }
319
+
320
+ function _templateObject13() {
321
+ var data = _taggedTemplateLiteralLoose(["\n padding: 0 4px;\n line-height: normal;\n position: relative;\n transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;\n color: rgb(0, 0, 0);\n font-weight: 500;\n outline: none;\n"]);
322
+
323
+ _templateObject13 = function _templateObject13() {
324
+ return data;
325
+ };
326
+
327
+ return data;
328
+ }
329
+
330
+ function _templateObject12() {
331
+ var data = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: ", "px;\n background: linear-gradient(to left, ", ", ", ", ", ");\n background-size: 200% 200%;\n animation: ", " 1.6s linear infinite;\n"]);
332
+
333
+ _templateObject12 = function _templateObject12() {
334
+ return data;
335
+ };
336
+
337
+ return data;
338
+ }
339
+
340
+ function _templateObject11() {
341
+ var data = _taggedTemplateLiteralLoose(["\n text-align: ", ""]);
342
+
343
+ _templateObject11 = function _templateObject11() {
344
+ return data;
345
+ };
346
+
347
+ return data;
348
+ }
349
+
350
+ function _templateObject10() {
351
+ var data = _taggedTemplateLiteralLoose(["\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 1.3rem;\n padding: 7px 4px;\n overflow: hidden;\n transition: width 0.3s ease 0s, min-width, padding, opacity;\n \n ", "\n"]);
352
+
353
+ _templateObject10 = function _templateObject10() {
354
+ return data;
355
+ };
356
+
357
+ return data;
358
+ }
359
+
360
+ function _templateObject9() {
361
+ var data = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n"]);
362
+
363
+ _templateObject9 = function _templateObject9() {
364
+ return data;
365
+ };
366
+
367
+ return data;
368
+ }
369
+
370
+ function _templateObject8() {
371
+ var data = _taggedTemplateLiteralLoose(["\n flex: auto 1;\n display: flex;\n flex-direction: column;\n align-items: stretch; \n border-collapse: collapse;\n width: max-content;\n"]);
372
+
373
+ _templateObject8 = function _templateObject8() {
374
+ return data;
375
+ };
376
+
377
+ return data;
378
+ }
379
+
380
+ function _templateObject7() {
381
+ var data = _taggedTemplateLiteralLoose(["\n display: block;\n max-width: 100%;\n overflow-x: scroll;\n overflow-y: hidden;\n"]);
382
+
383
+ _templateObject7 = function _templateObject7() {
384
+ return data;
385
+ };
386
+
387
+ return data;
388
+ }
389
+
390
+ function _templateObject6() {
391
+ var data = _taggedTemplateLiteralLoose(["\n font-size: ", "px;\n position: relative;\n display: flex;\n flex-direction: column;\n border: 0;\n"]);
392
+
393
+ _templateObject6 = function _templateObject6() {
394
+ return data;
395
+ };
396
+
397
+ return data;
398
+ }
399
+
400
+ function _templateObject5() {
401
+ var data = _taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n \n &::before {\n bottom: 10px;\n content: '';\n opacity: 0;\n pointer-events: none;\n position: absolute;\n width: 10px;\n height: 100%;\n top: 0;\n left: -10px;\n box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);\n transition: 0.3s opacity;\n }\n\n &::after {\n bottom: 10px;\n content: '';\n opacity: 0;\n pointer-events: none;\n width: 10px;\n height: 100%;\n position: absolute;\n top: 0;\n right: -10px;\n box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);\n transition: 0.3s opacity;\n }\n \n &.shadow_left {\n &::before {\n opacity: 1 !important;\n }\n }\n \n &.shadow_right {\n &::after {\n opacity: 1 !important;\n }\n }\n"]);
402
+
403
+ _templateObject5 = function _templateObject5() {
404
+ return data;
405
+ };
406
+
407
+ return data;
408
+ }
409
+
410
+ function _templateObject4() {
411
+ var data = _taggedTemplateLiteralLoose(["\n position: absolute;\n display: block;\n text-align: center;\n width: 100%;\n top: 50%;\n left: 0;\n color: rgba(0, 0, 0, 0.6);\n transform: translateY(-52%);\n transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n"]);
412
+
413
+ _templateObject4 = function _templateObject4() {
414
+ return data;
415
+ };
416
+
417
+ return data;
418
+ }
419
+
420
+ function _templateObject3() {
421
+ var data = _taggedTemplateLiteralLoose(["\n opacity: 1;\n z-index: 2;\n pointer-events: all;\n "]);
422
+
423
+ _templateObject3 = function _templateObject3() {
424
+ return data;
425
+ };
426
+
427
+ return data;
428
+ }
429
+
430
+ function _templateObject2() {
431
+ var data = _taggedTemplateLiteralLoose(["\n display: block;\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.8);\n transition: all 0.3s ease;\n z-index: -1;\n opacity: 0;\n pointer-events: none;\n \n ", "\n"]);
432
+
433
+ _templateObject2 = function _templateObject2() {
434
+ return data;
435
+ };
436
+
437
+ return data;
438
+ }
439
+
36
440
  function _templateObject() {
37
- var data = _taggedTemplateLiteralLoose(["\n\n.ReactTable {\n font-size: ", "px;\n position: relative;\n display: flex;\n flex-direction: column;\n border: 0;\n\n .pagination-bottom {\n padding: 24px 0;\n }\n\n &__header-cell_right {\n text-align: right !important;\n flex-direction: row !important;\n justify-content: flex-end !important;\n\n &:before {\n margin-left: 0 !important;\n margin-right: 4px !important;\n }\n }\n\n .rt-thead {\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n user-select: none;\n }\n\n .rt-table {\n flex: auto 1;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n width: 100%;\n border-collapse: collapse;\n overflow: auto;\n }\n}\n\n.ReactTable .rt-thead.-filters input,\n.ReactTable .rt-thead.-filters select {\n border: 1px solid rgba(0, 0, 0, 0.1);\n background: ", ";\n padding: 2px 7px;\n margin: 4px 0;\n font-size: inherit;\n border-radius: 3px;\n font-weight: normal;\n outline: none;\n}\n\n.ReactTable .rt-thead .rt-th,\n.ReactTable .rt-thead .rt-td {\n padding: 0 4px;\n line-height: normal;\n position: relative;\n transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n color: ", ";\n font-weight: 500;\n outline: none;\n}\n\n.ReactTable .rt-thead .rt-th {\n display: flex;\n}\n\n.ReactTable .rt-thead .rt-th.-cursor-pointer,\n.ReactTable .rt-thead .rt-td.-cursor-pointer {\n cursor: pointer;\n transition: 220ms ease;\n display: flex;\n flex-direction: row-reverse;\n justify-content: flex-end;\n align-items: center;\n\n\n &:before {\n transition: 220ms ease;\n content: '';\n min-width: 12px;\n width: 12px;\n height: 12px;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAAEEfUpiAAAABGdBTUEAALGPC/xhBQAAAlZJREFUWAntVklSwzAQtJ1ck/AYtpA78COKLEWoLHe+wx3C8hggOSehW7iNrMgb5gIVVblmNOrpGWuksYMgHv1+f0s1kkEyGg6HY00SSaNcEmO2YkMTnUoycX3dhZ28XAcD8KXlMhlHHzDF6PMql0OKxpkUMjQZNwzD3mw2e7SdB4PB23a7PQhpjEFdGBbz+TzE/B3mDnUDEIgSbEsA21zkPDXIxCdlzJuUcSh8y7wAXKtN0CQLU/VtJdeyBrcZPneGIIqi281m8wCioNFonE0mk0WWIzCmBNjpALUbp7aapw1EN3QGu6kbdbt2mlNypAi+TEFgE8lG6a2tDXD1wvPvOrjzv3EOah+k/0AQ13rpljBvjntwyBITE8VHtwVDKZLRaHSEe/BKZwaPrONZSILIx+v1+sVExgWcTqdjUwWbBKAPAtxBZ0R+pp23l85QvxuKSNgQXRKkfeJzJsHObdTmqLsSpGFHlm2HgAsiEYjS50y7l4ALNkmWM3G5gyQsVR4oM4M8J67ZGXKuIlCvMmpfxirBfNh9AvsdSHYAp/oaLaPnOyi/aUObYiu+EmfIe6q/idi4Qhu6dH8Z5SBZ9RqyjSPOPXrigTjYYCLTkqHICNkCiP9JSzh1LfuPVAYG1zs/A25wxk41Is9uMOgKP2wX7g9b0Q7En497+HdIouG21VQCAvkS4dcB6xcozRNxWQmUDaxY3gS0mJUI3uIcW2oSERa7dBrXuC0bpfvG9hr13AQE9iWitSxZFFh+pRIQuEwiZQOLs1ICcvIlUjWwuGpJJsKnDskn5F1o5Z7NGz4AAAAASUVORK5CYII=');\n background-size: contain;\n opacity: 0;\n margin-left: 4px;\n }\n}\n\n.ReactTable .rt-thead .rt-th.-sort-asc,\n.ReactTable .rt-thead .rt-td.-sort-asc {\n padding-left: 4px;\n\n &:before {\n transform: rotate(180deg);\n opacity: 1;\n }\n}\n\n.ReactTable .rt-thead .rt-th.-sort-desc,\n.ReactTable .rt-thead .rt-td.-sort-desc {\n padding-left: 4px;\n\n &:before {\n opacity: 1;\n }\n}\n\n.ReactTable .rt-thead .rt-th:last-child,\n.ReactTable .rt-thead .rt-td:last-child {\n border-right: 0;\n}\n\n.ReactTable .rt-thead .rt-resizable-header {\n overflow: visible;\n display: flex;\n align-items: center;\n}\n\n.ReactTable .rt-thead .rt-resizable-header:last-child {\n overflow: hidden;\n}\n\n.ReactTable .rt-thead .rt-resizable-header-content {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.ReactTable .rt-thead .rt-header-pivot {\n border-right-color: #f7f7f7;\n}\n\n.ReactTable .rt-thead .rt-header-pivot:after,\n.ReactTable .rt-thead .rt-header-pivot:before {\n left: 100%;\n top: 50%;\n border: solid transparent;\n content: ' ';\n height: 0;\n width: 0;\n position: absolute;\n pointer-events: none;\n}\n\n.ReactTable .rt-thead .rt-header-pivot:after {\n border-color: rgba(255, 255, 255, 0);\n border-left-color: ", ";\n border-width: 8px;\n margin-top: -8px;\n}\n\n.ReactTable .rt-thead .rt-header-pivot:before {\n border-color: rgba(102, 102, 102, 0);\n border-left-color: #f7f7f7;\n border-width: 10px;\n margin-top: -10px;\n}\n\n.ReactTable .rt-tbody {\n flex: 99999 1 auto;\n display: flex;\n flex-direction: column;\n overflow: auto;\n border-top: 1px solid ", ";\n margin-top: ", "px;\n}\n\n.ReactTable .rt-tbody .rt-tr-group {\n box-shadow: inset 0 -1px 0 0 ", ";\n}\n\n.ReactTable .rt-tbody .rt-tr-group:hover {\n background-color: ", ";\n transition: 0.2s ease-in-out;\n}\n\n.ReactTable .rt-tbody .rt-td:last-child {\n border-right: 0;\n}\n\n.ReactTable .rt-tbody .rt-expandable {\n cursor: pointer;\n text-overflow: clip;\n}\n\n.ReactTable .rt-tr-group {\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n}\n\n.ReactTable .rt-tr {\n flex: 1 0 auto;\n display: inline-flex;\n padding: 0;\n align-items: center;\n}\n\n.ReactTable .rt-th,\n.ReactTable .rt-td {\n flex: 1 0 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding: 7px 4px;\n overflow: hidden;\n transition: 0.3s ease;\n transition-property: width, min-width, padding, opacity;\n line-height: 1.3rem;\n}\n\n.ReactTable .rt-th.-hidden,\n.ReactTable .rt-td.-hidden {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n border: 0 !important;\n opacity: 0 !important;\n}\n\n.ReactTable .rt-expander {\n display: inline-block;\n position: relative;\n color: transparent;\n margin: 0 10px;\n}\n\n.ReactTable .rt-expander:after {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-90deg);\n border-left: 5.04px solid transparent;\n border-right: 5.04px solid transparent;\n border-top: 7px solid rgba(0, 0, 0, 0.8);\n transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n cursor: pointer;\n}\n\n.ReactTable .rt-expander.-open:after {\n transform: translate(-50%, -50%) rotate(0);\n}\n\n.ReactTable .rt-resizer {\n display: inline-block;\n position: absolute;\n width: 36px;\n top: 0;\n bottom: 0;\n right: -18px;\n cursor: col-resize;\n z-index: 10;\n}\n\n.ReactTable .rt-tfoot {\n background: ", ";\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n}\n\n.ReactTable .rt-tfoot .rt-td {\n}\n\n.ReactTable .rt-tfoot .rt-td:last-child {\n border-right: 0;\n}\n\n.ReactTable.-striped .rt-tr.-odd {\n background: rgba(0, 0, 0, 0.03);\n}\n\n.ReactTable.-highlight .rt-tbody .rt-tr:not(.-padRow):hover {\n background: rgba(0, 0, 0, 0.05);\n}\n\n.ReactTable .-pagination {\n z-index: 1;\n display: flex;\n justify-content: space-between;\n align-items: stretch;\n flex-wrap: wrap;\n padding: 3px;\n}\n\n.ReactTable .-pagination input,\n.ReactTable .-pagination select {\n border: 1px solid rgba(0, 0, 0, 0.1);\n background: ", ";\n padding: 5px 7px;\n font-size: inherit;\n border-radius: 3px;\n font-weight: normal;\n outline: none;\n}\n\n.ReactTable .-pagination .-btn {\n appearance: none;\n display: block;\n width: 100%;\n height: 100%;\n border: 0;\n border-radius: 3px;\n padding: 6px;\n font-size: 1em;\n color: rgba(0, 0, 0, 0.6);\n transition: all 0.1s ease;\n cursor: pointer;\n outline: none;\n background-color: white;\n color: #0080ff;\n box-shadow: inset 0 0 0 1px #0080ff;\n}\n\n.ReactTable .-pagination .-btn[disabled] {\n opacity: 0;\n cursor: default;\n}\n\n.ReactTable .-pagination .-btn:not([disabled]):hover {\n}\n\n.ReactTable .-pagination .-previous,\n.ReactTable .-pagination .-next {\n flex: 1;\n text-align: center;\n}\n\n.ReactTable .-pagination .-center {\n flex: 1.5;\n text-align: center;\n margin-bottom: 0;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-around;\n}\n\n.ReactTable .-pagination .-pageInfo {\n display: inline-block;\n margin: 3px 10px;\n white-space: nowrap;\n}\n\n.ReactTable .-pagination .-pageJump {\n display: inline-block;\n}\n\n.ReactTable .-pagination .-pageJump input {\n width: 70px;\n text-align: center;\n}\n\n.ReactTable .-pagination .-pageSizeOptions {\n margin: 3px 10px;\n}\n\n.ReactTable .rt-noData {\n display: flex;\n justify-content: center;\n background: transparent;\n transition: all 0.3s ease;\n z-index: 1;\n pointer-events: none;\n color: rgba(0, 0, 0, 0.5);\n}\n\n.ReactTable .-loading {\n display: block;\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.8);\n transition: all 0.3s ease;\n z-index: -1;\n opacity: 0;\n pointer-events: none;\n}\n\n.ReactTable .-loading > div {\n position: absolute;\n display: block;\n text-align: center;\n width: 100%;\n top: 50%;\n left: 0;\n font-size: 15px;\n color: rgba(0, 0, 0, 0.6);\n transform: translateY(-52%);\n transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n}\n\n.ReactTable .-loading.-active {\n opacity: 1;\n z-index: 2;\n pointer-events: all;\n}\n\n.ReactTable .-loading.-active > div {\n transform: translateY(50%);\n}\n\n.ReactTable .rt-resizing .rt-th,\n.ReactTable .rt-resizing .rt-td {\n transition: none !important;\n cursor: col-resize;\n user-select: none;\n}\n"]);
441
+ var data = _taggedTemplateLiteralLoose(["\n from {\n background-position-x: 0;\n }\n 50% {\n background-position-x: 100%;\n }\n 100% {\n background-position-x: 0;\n }\n"]);
38
442
 
39
443
  _templateObject = function _templateObject() {
40
444
  return data;
@@ -42,83 +446,341 @@ function _templateObject() {
42
446
 
43
447
  return data;
44
448
  }
45
- var CommonStyles = /*#__PURE__*/styledComponents.createGlobalStyle( /*#__PURE__*/_templateObject(), stylevariables.fontNormal, stylevariables.white, stylevariables.black, stylevariables.white, stylevariables.gray80, stylevariables.spacing * 2, stylevariables.gray95, stylevariables.semiWhite, stylevariables.gray95, stylevariables.white);
46
-
47
- var Table = function Table(_ref) {
48
- var data = _ref.data,
49
- columns = _ref.columns,
50
- _ref$defaultPageSize = _ref.defaultPageSize,
51
- defaultPageSize = _ref$defaultPageSize === void 0 ? 20 : _ref$defaultPageSize,
52
- _ref$loading = _ref.loading,
53
- loading = _ref$loading === void 0 ? false : _ref$loading,
54
- _ref$defaultSorted = _ref.defaultSorted,
55
- defaultSorted = _ref$defaultSorted === void 0 ? [] : _ref$defaultSorted,
56
- _ref$pageText = _ref.pageText,
57
- pageText = _ref$pageText === void 0 ? 'page' : _ref$pageText,
58
- _ref$ofText = _ref.ofText,
59
- ofText = _ref$ofText === void 0 ? 'of' : _ref$ofText,
60
- _ref$previousText = _ref.previousText,
61
- previousText = _ref$previousText === void 0 ? 'Previous page' : _ref$previousText,
62
- _ref$nextText = _ref.nextText,
63
- nextText = _ref$nextText === void 0 ? 'Next page' : _ref$nextText,
64
- _ref$loadingText = _ref.loadingText,
65
- loadingText = _ref$loadingText === void 0 ? 'Loading...' : _ref$loadingText,
66
- _ref$noDataText = _ref.noDataText,
67
- noDataText = _ref$noDataText === void 0 ? 'Woops, no data.' : _ref$noDataText,
68
- getTrProps = _ref.getTrProps,
69
- _ref$manual = _ref.manual,
70
- manual = _ref$manual === void 0 ? false : _ref$manual,
71
- _ref$filterable = _ref.filterable,
72
- filterable = _ref$filterable === void 0 ? true : _ref$filterable,
73
- _ref$showPageSizeOpti = _ref.showPageSizeOptions,
74
- showPageSizeOptions = _ref$showPageSizeOpti === void 0 ? false : _ref$showPageSizeOpti,
75
- _ref$showPageJump = _ref.showPageJump,
76
- showPageJump = _ref$showPageJump === void 0 ? false : _ref$showPageJump,
77
- _ref$style = _ref.style,
78
- style = _ref$style === void 0 ? {} : _ref$style,
79
- ExpanderComponent = _ref.ExpanderComponent,
80
- SubComponent = _ref.SubComponent,
81
- _ref$resizable = _ref.resizable,
82
- resizable = _ref$resizable === void 0 ? false : _ref$resizable,
83
- _ref$defaultFilterMet = _ref.defaultFilterMethod,
84
- defaultFilterMethod = _ref$defaultFilterMet === void 0 ? function (filter, row) {
85
- return String(row[filter.id]).toLowerCase().includes(filter.value.toLowerCase());
86
- } : _ref$defaultFilterMet,
87
- rest = _objectWithoutPropertiesLoose(_ref, ["data", "columns", "defaultPageSize", "loading", "defaultSorted", "pageText", "ofText", "previousText", "nextText", "loadingText", "noDataText", "getTrProps", "manual", "filterable", "showPageSizeOptions", "showPageJump", "style", "ExpanderComponent", "SubComponent", "resizable", "defaultFilterMethod"]);
88
-
89
- return React.createElement(React.Fragment, null, React.createElement(ReactTable, Object.assign({
90
- data: data,
91
- columns: columns,
92
- defaultPageSize: defaultPageSize,
93
- filterable: filterable,
94
- defaultSorted: defaultSorted,
95
- showPageSizeOptions: showPageSizeOptions,
96
- showPageJump: showPageJump,
97
- loading: loading,
98
- resizable: resizable,
99
- minRows: 0,
100
- pageText: pageText,
101
- ofText: ofText,
102
- previousText: previousText,
103
- nextText: nextText,
104
- loadingText: loadingText,
105
- noDataText: noDataText,
106
- defaultFilterMethod: defaultFilterMethod,
107
- getTrProps: getTrProps,
108
- manual: manual,
109
- style: style,
110
- ExpanderComponent: ExpanderComponent,
111
- SubComponent: SubComponent
112
- }, rest)), React.createElement(CommonStyles, null));
449
+ var loadingAnimation = /*#__PURE__*/styled.keyframes( /*#__PURE__*/_templateObject());
450
+ var TableLoading = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject2(), function (props) {
451
+ return props.isLoading && styled.css(_templateObject3());
452
+ });
453
+ var TableLoadingInner = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject4());
454
+ var TableWrapper = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject5());
455
+ var TableRoot = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject6(), stylevariables.fontNormal);
456
+ var TableContent = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject7());
457
+ var TableCore = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject8());
458
+ var HeadCell = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject9());
459
+ var TD = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject10(), function (_ref) {
460
+ var align = _ref.align;
461
+ return align && styled.css(_templateObject11(), align);
462
+ });
463
+ var EmptyStateCell = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject12(), stylevariables.spacing * 4, stylevariables.gray95, stylevariables.white, stylevariables.gray95, loadingAnimation);
464
+ var TH = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject13());
465
+ var THead = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject14(), TH, TD, stylevariables.black);
466
+ var TRGroup = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject15(), stylevariables.gray95);
467
+ var TR = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject16());
468
+ var TBody = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject17(), stylevariables.gray80, stylevariables.spacing * 2);
469
+ var TFoot = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject18(), stylevariables.gray95);
470
+
471
+ var defaultProps = {
472
+ hasDefaultPagination: false,
473
+ isLoading: false,
474
+ footerPlacement: [],
475
+ loadingMessage: 'loading...',
476
+ labelPerPage: 'Show rows',
477
+ parentElementId: 'parent-element',
478
+ tableContentId: '',
479
+ showLoadingState: false,
480
+ LoadingCellComponent: EmptyStateCell,
481
+ getRowPreProps: function getRowPreProps() {
482
+ return {};
483
+ }
113
484
  };
485
+ var disableSortRemove = true;
486
+ var disableMultiSort = true;
487
+ var disabledMultiRemove = true;
488
+ var DEFAULT_PAGE_INDEX = 0;
489
+ var DEFAULT_PAGE_SIZE = 10;
490
+
491
+ function isFunction(reference) {
492
+ return typeof reference === 'function';
493
+ }
494
+
495
+ function getHeadContent(column) {
496
+ if (column.isSorted && column.isSortedDesc) {
497
+ return React__default.createElement(HeadCell, null, column.render('Header'), React__default.createElement(icon.ArrowDownFull, {
498
+ size: icon.SIZE.SMALL,
499
+ color: icon.COLOR.GRAY_DARK
500
+ }));
501
+ }
502
+
503
+ if (column.isSorted && !column.isSortedDesc) {
504
+ return React__default.createElement(HeadCell, null, column.render('Header'), React__default.createElement(icon.ArrowUp, {
505
+ size: icon.SIZE.SMALL,
506
+ color: icon.COLOR.GRAY_DARK
507
+ }));
508
+ }
509
+
510
+ return column.render('Header');
511
+ }
512
+
513
+ var Table = function Table(props) {
514
+ var _controlledPagination;
515
+
516
+ var columns = props.columns,
517
+ data = props.data,
518
+ totalItems = props.totalItems,
519
+ fetchData = props.fetchData,
520
+ controlledPagination = props.controlledPagination,
521
+ initialState = props.initialState,
522
+ isLoading = props.isLoading,
523
+ loadingMessage = props.loadingMessage,
524
+ labelPerPage = props.labelPerPage,
525
+ footerPlacement = props.footerPlacement,
526
+ onSortedChange = props.onSortedChange,
527
+ hasDefaultPagination = props.hasDefaultPagination,
528
+ onSelectRowsChange = props.onSelectRowsChange,
529
+ parentElementId = props.parentElementId,
530
+ tableContentId = props.tableContentId,
531
+ LoadingCellComponent = props.LoadingCellComponent,
532
+ PaginationComponent = props.PaginationComponent,
533
+ getRowPreProps = props.getRowPreProps,
534
+ getTableProps$1 = props.getTableProps,
535
+ getHeaderGroupProps = props.getHeaderGroupProps,
536
+ getHeaderProps = props.getHeaderProps,
537
+ getRowProps = props.getRowProps,
538
+ getCellProps = props.getCellProps,
539
+ getFooterProps = props.getFooterProps,
540
+ getFooterGroupProps = props.getFooterGroupProps,
541
+ showLoadingState = props.showLoadingState;
542
+ var memoColumns = React.useMemo(function () {
543
+ return columns;
544
+ }, [columns]);
545
+
546
+ var _useLoadingState = useLoadingState(showLoadingState, isLoading, (_controlledPagination = controlledPagination === null || controlledPagination === void 0 ? void 0 : controlledPagination.pageSize) !== null && _controlledPagination !== void 0 ? _controlledPagination : DEFAULT_PAGE_SIZE, memoColumns, LoadingCellComponent),
547
+ loadingColumns = _useLoadingState.loadingColumns,
548
+ loadingData = _useLoadingState.loadingData;
549
+
550
+ var showLoading = showLoadingState && isLoading;
551
+ var hasSelectedRowsAbility = onSelectRowsChange && isFunction(onSelectRowsChange);
552
+ var hasManualSortBy = onSortedChange && isFunction(onSortedChange);
553
+ var hasControlledPagination = fetchData && controlledPagination && Object.keys(controlledPagination).length > 0;
554
+ var options = {
555
+ columns: showLoading ? loadingColumns : memoColumns,
556
+ data: showLoading ? loadingData : data,
557
+ initialState: initialState,
558
+ disableSortRemove: disableSortRemove,
559
+ disableMultiSort: disableMultiSort,
560
+ disabledMultiRemove: disabledMultiRemove
561
+ };
562
+
563
+ if (hasManualSortBy) {
564
+ options.manualSortBy = true;
565
+ }
114
566
 
115
- Table.defaultProps = {
116
- getTrProps: undefined,
117
- onSortedChange: undefined,
118
- expanderComponent: undefined,
119
- subComponent: undefined,
120
- onPageChange: undefined
567
+ if (hasControlledPagination) {
568
+ var _controlledPagination2, _controlledPagination3;
569
+
570
+ if (typeof (controlledPagination === null || controlledPagination === void 0 ? void 0 : controlledPagination.pageCount) === 'undefined') {
571
+ throw new Error('You have to pass pageCount in controlledPagination data');
572
+ }
573
+
574
+ options.initialState = _extends({}, options.initialState, {
575
+ pageIndex: (_controlledPagination2 = controlledPagination.pageIndex) !== null && _controlledPagination2 !== void 0 ? _controlledPagination2 : DEFAULT_PAGE_INDEX,
576
+ pageSize: (_controlledPagination3 = controlledPagination.pageSize) !== null && _controlledPagination3 !== void 0 ? _controlledPagination3 : DEFAULT_PAGE_SIZE
577
+ });
578
+ options.autoResetPage = true;
579
+ options.manualPagination = true;
580
+ options.pageCount = controlledPagination.pageCount;
581
+ }
582
+
583
+ var useSelect = function useSelect(hooks) {
584
+ if (!hasSelectedRowsAbility) {
585
+ return;
586
+ }
587
+
588
+ var newColumn = {
589
+ id: 'selection',
590
+ disableSortBy: true,
591
+ Header: function Header(instance) {
592
+ var getToggleAllRowsSelectedProps = instance.getToggleAllRowsSelectedProps,
593
+ toggleAllRowsSelected = instance.toggleAllRowsSelected;
594
+ return React__default.createElement(Checkbox, {
595
+ elementId: "all",
596
+ onChange: toggleAllRowsSelected,
597
+ isChecked: getToggleAllRowsSelectedProps().checked
598
+ });
599
+ },
600
+ Cell: function Cell(_ref) {
601
+ var row = _ref.row;
602
+ var id = row.id,
603
+ original = row.original,
604
+ toggleRowSelected = row.toggleRowSelected,
605
+ getToggleRowSelectedProps = row.getToggleRowSelectedProps;
606
+ var elementId = Number.isInteger(original.id) ? original.id : id;
607
+ return React__default.createElement(Checkbox, {
608
+ elementId: elementId,
609
+ onChange: toggleRowSelected,
610
+ isChecked: getToggleRowSelectedProps().checked
611
+ });
612
+ }
613
+ };
614
+ hooks.visibleColumns.push(function (tableColumns) {
615
+ return [newColumn].concat(tableColumns);
616
+ });
617
+ };
618
+
619
+ var _useTable = reactTable.useTable(options, reactTable.useBlockLayout, reactTable.useSortBy, reactTable.usePagination, reactTable.useRowSelect, useSelect),
620
+ _getTableProps = _useTable.getTableProps,
621
+ headerGroups = _useTable.headerGroups,
622
+ footerGroups = _useTable.footerGroups,
623
+ setHiddenColumns = _useTable.setHiddenColumns,
624
+ rows = _useTable.rows,
625
+ prepareRow = _useTable.prepareRow,
626
+ visibleColumns = _useTable.visibleColumns,
627
+ rest = _objectWithoutPropertiesLoose(_useTable, ["getTableProps", "headerGroups", "footerGroups", "setHiddenColumns", "rows", "prepareRow", "visibleColumns"]);
628
+
629
+ var selectedFlatRows = rest.selectedFlatRows,
630
+ setSortBy = rest.setSortBy,
631
+ page = rest.page,
632
+ canPreviousPage = rest.canPreviousPage,
633
+ canNextPage = rest.canNextPage,
634
+ pageCount = rest.pageCount,
635
+ gotoPage = rest.gotoPage,
636
+ nextPage = rest.nextPage,
637
+ previousPage = rest.previousPage,
638
+ setPageSize = rest.setPageSize,
639
+ _rest$state = rest.state,
640
+ selectedRowIds = _rest$state.selectedRowIds,
641
+ pageIndex = _rest$state.pageIndex,
642
+ pageSize = _rest$state.pageSize;
643
+ var tableRef = React.useRef(null);
644
+ var tableWrapperRef = React.useRef(null);
645
+ useTableShadow(tableRef, tableWrapperRef);
646
+ React.useEffect(function () {
647
+ if (!(initialState === null || initialState === void 0 ? void 0 : initialState.hiddenColumns)) {
648
+ return;
649
+ }
650
+
651
+ setHiddenColumns(initialState.hiddenColumns);
652
+ }, [initialState === null || initialState === void 0 ? void 0 : initialState.hiddenColumns]);
653
+ React.useEffect(function () {
654
+ if (hasSelectedRowsAbility) {
655
+ onSelectRowsChange === null || onSelectRowsChange === void 0 ? void 0 : onSelectRowsChange(selectedFlatRows === null || selectedFlatRows === void 0 ? void 0 : selectedFlatRows.map(function (row) {
656
+ return row.original;
657
+ }));
658
+ }
659
+ }, [selectedRowIds]);
660
+ var pagination = null;
661
+
662
+ if (hasDefaultPagination && hasControlledPagination) {
663
+ // eslint-disable-next-line max-len
664
+ throw new Error('You have to pass either hasDefaultPagination true boolean prop or pass fetchData callback and controlledPagination data');
665
+ }
666
+
667
+ if (hasControlledPagination || hasDefaultPagination) {
668
+ var paginationData = {
669
+ setPageSize: setPageSize,
670
+ gotoPage: gotoPage,
671
+ canNextPage: canNextPage,
672
+ canPreviousPage: canPreviousPage,
673
+ parentElementId: parentElementId,
674
+ labelPerPage: labelPerPage,
675
+ pageIndex: pageIndex,
676
+ previousPageHandler: previousPage,
677
+ nextPageHandler: nextPage,
678
+ totalPages: pageCount,
679
+ perPage: pageSize,
680
+ totalItems: totalItems !== null && totalItems !== void 0 ? totalItems : data.length
681
+ };
682
+
683
+ if (hasControlledPagination && controlledPagination) {
684
+ paginationData.canNextPage = controlledPagination.pageIndex + 1 !== paginationData.totalPages;
685
+ paginationData.canPreviousPage = controlledPagination.pageIndex !== 0;
686
+ paginationData.pageIndex = controlledPagination.pageIndex;
687
+ paginationData.perPage = controlledPagination.pageSize;
688
+
689
+ paginationData.setPageSize = function (newPageSize) {
690
+ fetchData === null || fetchData === void 0 ? void 0 : fetchData({
691
+ pageIndex: paginationData.pageIndex,
692
+ pageSize: newPageSize
693
+ });
694
+ };
695
+
696
+ paginationData.gotoPage = function (newPageIndex) {
697
+ fetchData === null || fetchData === void 0 ? void 0 : fetchData({
698
+ pageIndex: newPageIndex,
699
+ pageSize: paginationData.perPage
700
+ });
701
+ };
702
+
703
+ paginationData.nextPageHandler = function () {
704
+ var newPageIndex = paginationData.pageIndex + 1;
705
+ paginationData.gotoPage(newPageIndex);
706
+ };
707
+
708
+ paginationData.previousPageHandler = function () {
709
+ var newPageIndex = paginationData.pageIndex - 1;
710
+ paginationData.gotoPage(newPageIndex);
711
+ };
712
+
713
+ if (controlledPagination === null || controlledPagination === void 0 ? void 0 : controlledPagination.paginationAmount) {
714
+ paginationData.paginationAmount = controlledPagination.paginationAmount;
715
+ }
716
+ }
717
+
718
+ pagination = React__default.createElement(PaginationComponent, Object.assign({}, paginationData));
719
+ }
720
+
721
+ function extendSortByProps(column) {
722
+ var headerProps = column.getSortByToggleProps && column.getSortByToggleProps();
723
+ headerProps === null || headerProps === void 0 ? true : delete headerProps.style;
724
+
725
+ if (hasManualSortBy && !column.canSort && headerProps) {
726
+ headerProps.onClick = function () {
727
+ onSortedChange === null || onSortedChange === void 0 ? void 0 : onSortedChange(column.id, Boolean(column.isSortedDesc));
728
+ setSortBy([{
729
+ id: column.id,
730
+ desc: !column.isSortedDesc
731
+ }]);
732
+ };
733
+ }
734
+
735
+ return headerProps;
736
+ }
737
+
738
+ var tBodyTr = hasControlledPagination || hasDefaultPagination ? page : rows;
739
+ return React__default.createElement(TableRoot, null, React__default.createElement(TableLoading, {
740
+ isLoading: !showLoadingState && isLoading
741
+ }, React__default.createElement(TableLoadingInner, null, loadingMessage)), React__default.createElement(TableWrapper, {
742
+ ref: tableWrapperRef
743
+ }, React__default.createElement(TableContent, {
744
+ id: tableContentId
745
+ }, React__default.createElement(TableCore, Object.assign({}, _getTableProps(getTableProps(getTableProps$1)), {
746
+ ref: tableRef
747
+ }), React__default.createElement(THead, null, headerGroups.map(function (headerGroup) {
748
+ return React__default.createElement(TR, Object.assign({}, headerGroup.getHeaderGroupProps(getTableElementProps(getHeaderGroupProps))), headerGroup.headers.map(function (column) {
749
+ var headerProps = extendSortByProps(column);
750
+ return React__default.createElement(TH, Object.assign({}, column.getHeaderProps(getTableElementInternalProps(headerProps, getHeaderProps, mainCellGetter))), getHeadContent(column));
751
+ }));
752
+ })), footerPlacement.includes(FOOTER_PLACEMENT.TOP) && React__default.createElement(TFoot, null, footerGroups.map(function (group) {
753
+ return React__default.createElement(TR, Object.assign({}, group.getFooterGroupProps(getTableElementProps(getFooterGroupProps))), group.headers.map(function (column) {
754
+ return React__default.createElement(TD, Object.assign({}, column.getFooterProps(getTableElementProps(getFooterProps, mainCellGetter))), column.render('Footer'));
755
+ }));
756
+ })), React__default.createElement(TBody, null, tBodyTr.map(function (row) {
757
+ prepareRow(row);
758
+
759
+ var _getRowPreProps = getRowPreProps(row),
760
+ isDelimiterTd = _getRowPreProps.isDelimiterTd;
761
+
762
+ if (isDelimiterTd) {
763
+ return React__default.createElement(TRGroup, {
764
+ key: "group_" + row.index
765
+ }, React__default.createElement(TR, Object.assign({}, row.getRowProps(getTableRowProps(getRowProps))), React__default.createElement(TD, Object.assign({
766
+ colSpan: visibleColumns.length
767
+ }, row.cells[0].getCellProps(getTableCellProps(getCellProps, cellGetter))), React__default.createElement("strong", null, row.cells[0].render('Cell')))));
768
+ }
769
+
770
+ return React__default.createElement(TRGroup, {
771
+ key: "group_" + row.index
772
+ }, React__default.createElement(TR, Object.assign({}, row.getRowProps(getTableRowProps(getRowProps))), row.cells.map(function (cell) {
773
+ return React__default.createElement(TD, Object.assign({}, cell.getCellProps(getTableCellProps(getCellProps, cellGetter))), cell.render('Cell'));
774
+ })));
775
+ })), footerPlacement.includes(FOOTER_PLACEMENT.BOTTOM) && React__default.createElement(TFoot, null, footerGroups.map(function (group) {
776
+ return React__default.createElement(TR, Object.assign({}, group.getFooterGroupProps(getTableElementProps(getFooterGroupProps))), group.headers.map(function (column) {
777
+ return React__default.createElement(TD, Object.assign({}, column.getFooterProps(getTableElementProps(getFooterProps, mainCellGetter))), column.render('Footer'));
778
+ }));
779
+ }))))), pagination);
121
780
  };
122
781
 
782
+ Table.defaultProps = defaultProps;
783
+
123
784
  exports.Table = Table;
785
+ exports.defaultProps = defaultProps;
124
786
  //# sourceMappingURL=table.cjs.development.js.map