@laerdal/life-react-components 1.3.2-dev.9 → 1.4.1-dev.3
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/dist/esm/Accordion/ContentAccordion.js +102 -81
- package/dist/esm/Accordion/ContentAccordion.js.map +1 -1
- package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js +27 -27
- package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js.map +1 -1
- package/dist/esm/Button/DualFunctionButton.js +4 -0
- package/dist/esm/Button/DualFunctionButton.js.map +1 -1
- package/dist/esm/Button/Iconbutton.js +0 -1
- package/dist/esm/Button/Iconbutton.js.map +1 -1
- package/dist/esm/Dropdown/DropdownButton.js +5 -2
- package/dist/esm/Dropdown/DropdownButton.js.map +1 -1
- package/dist/esm/Dropdown/DropdownContent.js +6 -6
- package/dist/esm/Dropdown/DropdownContent.js.map +1 -1
- package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/esm/HyperLink/HyperLink.js +2 -1
- package/dist/esm/HyperLink/HyperLink.js.map +1 -1
- package/dist/esm/InputFields/Checkbox.js +23 -13
- package/dist/esm/InputFields/Checkbox.js.map +1 -1
- package/dist/esm/Modals/ModalDialog.js +14 -5
- package/dist/esm/Modals/ModalDialog.js.map +1 -1
- package/dist/esm/Modals/ModalNote.js +1 -1
- package/dist/esm/Modals/ModalNote.js.map +1 -1
- package/dist/esm/Table/Table.js +131 -181
- package/dist/esm/Table/Table.js.map +1 -1
- package/dist/esm/Table/TableBody.js +135 -0
- package/dist/esm/Table/TableBody.js.map +1 -0
- package/dist/esm/Table/TableFooter.js +68 -0
- package/dist/esm/Table/TableFooter.js.map +1 -0
- package/dist/esm/Table/TableHeaders.js +55 -0
- package/dist/esm/Table/TableHeaders.js.map +1 -0
- package/dist/esm/Table/TableStyles.js +181 -110
- package/dist/esm/Table/TableStyles.js.map +1 -1
- package/dist/esm/Table/__tests__/Table.test.js +162 -21
- package/dist/esm/Table/__tests__/Table.test.js.map +1 -1
- package/dist/js/Accordion/ContentAccordion.d.ts +0 -9
- package/dist/js/Accordion/ContentAccordion.js +21 -42
- package/dist/js/Accordion/ContentAccordion.js.map +1 -1
- package/dist/js/Accordion/__tests__/ContetnAccordion.test.js +27 -33
- package/dist/js/Accordion/__tests__/ContetnAccordion.test.js.map +1 -1
- package/dist/js/Button/DualFunctionButton.js +4 -0
- package/dist/js/Button/DualFunctionButton.js.map +1 -1
- package/dist/js/Button/Iconbutton.d.ts +2 -2
- package/dist/js/Button/Iconbutton.js +0 -1
- package/dist/js/Button/Iconbutton.js.map +1 -1
- package/dist/js/Dropdown/DropdownButton.d.ts +1 -1
- package/dist/js/Dropdown/DropdownButton.js +5 -2
- package/dist/js/Dropdown/DropdownButton.js.map +1 -1
- package/dist/js/Dropdown/DropdownButtonTypes.d.ts +1 -0
- package/dist/js/Dropdown/DropdownContent.js +8 -8
- package/dist/js/Dropdown/DropdownContent.js.map +1 -1
- package/dist/js/Dropdown/DropdownFilter.d.ts +1 -1
- package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/js/HyperLink/HyperLink.d.ts +1 -1
- package/dist/js/HyperLink/HyperLink.js +2 -2
- package/dist/js/HyperLink/HyperLink.js.map +1 -1
- package/dist/js/InputFields/Checkbox.d.ts +3 -2
- package/dist/js/InputFields/Checkbox.js +13 -11
- package/dist/js/InputFields/Checkbox.js.map +1 -1
- package/dist/js/Modals/ModalDialog.d.ts +2 -1
- package/dist/js/Modals/ModalDialog.js +14 -5
- package/dist/js/Modals/ModalDialog.js.map +1 -1
- package/dist/js/Modals/ModalNote.d.ts +1 -1
- package/dist/js/Modals/ModalNote.js +1 -1
- package/dist/js/Modals/ModalNote.js.map +1 -1
- package/dist/js/Table/Table.js +166 -209
- package/dist/js/Table/Table.js.map +1 -1
- package/dist/js/Table/TableBody.d.ts +9 -0
- package/dist/js/Table/TableBody.js +167 -0
- package/dist/js/Table/TableBody.js.map +1 -0
- package/dist/js/Table/TableFooter.d.ts +15 -0
- package/dist/js/Table/TableFooter.js +95 -0
- package/dist/js/Table/TableFooter.js.map +1 -0
- package/dist/js/Table/TableHeaders.d.ts +9 -0
- package/dist/js/Table/TableHeaders.js +77 -0
- package/dist/js/Table/TableHeaders.js.map +1 -0
- package/dist/js/Table/TableStyles.d.ts +19 -7
- package/dist/js/Table/TableStyles.js +66 -16
- package/dist/js/Table/TableStyles.js.map +1 -1
- package/dist/js/Table/TableTypes.d.ts +26 -16
- package/dist/js/Table/__tests__/Table.test.js +172 -30
- package/dist/js/Table/__tests__/Table.test.js.map +1 -1
- package/dist/umd/Accordion/ContentAccordion.js +103 -82
- package/dist/umd/Accordion/ContentAccordion.js.map +1 -1
- package/dist/umd/Accordion/__tests__/ContetnAccordion.test.js +26 -26
- package/dist/umd/Accordion/__tests__/ContetnAccordion.test.js.map +1 -1
- package/dist/umd/Button/DualFunctionButton.js +4 -0
- package/dist/umd/Button/DualFunctionButton.js.map +1 -1
- package/dist/umd/Button/Iconbutton.js +0 -1
- package/dist/umd/Button/Iconbutton.js.map +1 -1
- package/dist/umd/Dropdown/DropdownButton.js +5 -2
- package/dist/umd/Dropdown/DropdownButton.js.map +1 -1
- package/dist/umd/Dropdown/DropdownContent.js +6 -6
- package/dist/umd/Dropdown/DropdownContent.js.map +1 -1
- package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/umd/HyperLink/HyperLink.js +2 -1
- package/dist/umd/HyperLink/HyperLink.js.map +1 -1
- package/dist/umd/InputFields/Checkbox.js +23 -13
- package/dist/umd/InputFields/Checkbox.js.map +1 -1
- package/dist/umd/Modals/ModalDialog.js +14 -5
- package/dist/umd/Modals/ModalDialog.js.map +1 -1
- package/dist/umd/Modals/ModalNote.js +1 -1
- package/dist/umd/Modals/ModalNote.js.map +1 -1
- package/dist/umd/Table/Table.js +157 -188
- package/dist/umd/Table/Table.js.map +1 -1
- package/dist/umd/Table/TableBody.js +270 -0
- package/dist/umd/Table/TableBody.js.map +1 -0
- package/dist/umd/Table/TableFooter.js +89 -0
- package/dist/umd/Table/TableFooter.js.map +1 -0
- package/dist/umd/Table/TableHeaders.js +91 -0
- package/dist/umd/Table/TableHeaders.js.map +1 -0
- package/dist/umd/Table/TableStyles.js +185 -115
- package/dist/umd/Table/TableStyles.js.map +1 -1
- package/dist/umd/Table/__tests__/Table.test.js +164 -25
- package/dist/umd/Table/__tests__/Table.test.js.map +1 -1
- package/package.json +1 -1
package/dist/js/Table/Table.js
CHANGED
|
@@ -9,26 +9,34 @@ exports.default = void 0;
|
|
|
9
9
|
|
|
10
10
|
var React = _interopRequireWildcard(require("react"));
|
|
11
11
|
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
var _index = require("../icons/index");
|
|
12
|
+
var _types = require("../types");
|
|
15
13
|
|
|
16
|
-
var
|
|
14
|
+
var _TableStyles = require("./TableStyles");
|
|
17
15
|
|
|
18
|
-
var
|
|
16
|
+
var _LoadingIndicator = require("../LoadingIndicator");
|
|
19
17
|
|
|
20
|
-
var
|
|
18
|
+
var _TableHeaders = _interopRequireDefault(require("./TableHeaders"));
|
|
21
19
|
|
|
22
|
-
var
|
|
20
|
+
var _TableFooter = _interopRequireDefault(require("./TableFooter"));
|
|
23
21
|
|
|
24
|
-
var
|
|
22
|
+
var _TableBody = _interopRequireDefault(require("./TableBody"));
|
|
25
23
|
|
|
26
|
-
|
|
24
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
25
|
|
|
28
26
|
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); }
|
|
29
27
|
|
|
30
28
|
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; }
|
|
31
29
|
|
|
30
|
+
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); }
|
|
31
|
+
|
|
32
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
33
|
+
|
|
34
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
35
|
+
|
|
36
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
37
|
+
|
|
38
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
39
|
+
|
|
32
40
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
33
41
|
|
|
34
42
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
@@ -43,22 +51,24 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
|
43
51
|
|
|
44
52
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
45
53
|
|
|
46
|
-
var Table = function Table(
|
|
47
|
-
var
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
54
|
+
var Table = function Table(props) {
|
|
55
|
+
var onPreviousPageClick = props.onPreviousPageClick,
|
|
56
|
+
onNextPageClick = props.onNextPageClick,
|
|
57
|
+
onRowsPerPageChange = props.onRowsPerPageChange,
|
|
58
|
+
onTriggerSortingChange = props.onTriggerSortingChange,
|
|
59
|
+
columns = props.columns,
|
|
60
|
+
rows = props.rows,
|
|
61
|
+
remoteOperations = props.remoteOperations,
|
|
62
|
+
pagination = props.pagination,
|
|
63
|
+
showLoadingIndicator = props.showLoadingIndicator,
|
|
64
|
+
selectable = props.selectable,
|
|
65
|
+
multiSelect = props.multiSelect,
|
|
66
|
+
keyExpr = props.keyExpr,
|
|
67
|
+
accordion = props.accordion,
|
|
68
|
+
_props$collapsed = props.collapsed,
|
|
69
|
+
collapsed = _props$collapsed === void 0 ? true : _props$collapsed,
|
|
70
|
+
collapsedRows = props.collapsedRows; // States used within the component
|
|
71
|
+
|
|
62
72
|
var _React$useState = React.useState(10),
|
|
63
73
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
64
74
|
rowsPerPage = _React$useState2[0],
|
|
@@ -103,14 +113,47 @@ var Table = function Table(_ref) {
|
|
|
103
113
|
_React$useState18 = _slicedToArray(_React$useState17, 2),
|
|
104
114
|
total = _React$useState18[0],
|
|
105
115
|
setTotal = _React$useState18[1];
|
|
116
|
+
|
|
117
|
+
var _React$useState19 = React.useState(true),
|
|
118
|
+
_React$useState20 = _slicedToArray(_React$useState19, 2),
|
|
119
|
+
isCollapsed = _React$useState20[0],
|
|
120
|
+
setIsCollapsed = _React$useState20[1];
|
|
121
|
+
|
|
122
|
+
var _React$useState21 = React.useState('none'),
|
|
123
|
+
_React$useState22 = _slicedToArray(_React$useState21, 2),
|
|
124
|
+
selectAllState = _React$useState22[0],
|
|
125
|
+
setSelectAllState = _React$useState22[1];
|
|
126
|
+
|
|
127
|
+
var _React$useState23 = React.useState(multiSelect ? [] : undefined),
|
|
128
|
+
_React$useState24 = _slicedToArray(_React$useState23, 2),
|
|
129
|
+
selected = _React$useState24[0],
|
|
130
|
+
setSelected = _React$useState24[1];
|
|
131
|
+
|
|
132
|
+
React.useEffect(function () {
|
|
133
|
+
setSelected(props.selectedRows || (multiSelect ? [] : undefined));
|
|
134
|
+
}, [props.selectedRows, multiSelect]);
|
|
135
|
+
/**
|
|
136
|
+
* update select all checkbox state
|
|
137
|
+
*/
|
|
138
|
+
|
|
139
|
+
React.useEffect(function () {
|
|
140
|
+
if (multiSelect) {
|
|
141
|
+
var currentList = currentPageRows.map(function (row) {
|
|
142
|
+
return keyExpr ? row[keyExpr] : row;
|
|
143
|
+
});
|
|
144
|
+
var count = selected.filter(function (item) {
|
|
145
|
+
return currentList.includes(item);
|
|
146
|
+
}).length;
|
|
147
|
+
setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');
|
|
148
|
+
}
|
|
149
|
+
}, [currentPageRows, multiSelect, selected, keyExpr]);
|
|
106
150
|
/**
|
|
107
151
|
* Takes care of local pagination.
|
|
108
152
|
* Works only in case remote pagination is not defined or is set to false.
|
|
109
153
|
*/
|
|
110
154
|
|
|
111
|
-
|
|
112
155
|
React.useEffect(function () {
|
|
113
|
-
if (!
|
|
156
|
+
if (!remoteOperations) {
|
|
114
157
|
// Let's retrieve temporary filtered rows and update globally filtered rows
|
|
115
158
|
var tmpFilteredRows = filterAndSortRows();
|
|
116
159
|
setFilteredRows(tmpFilteredRows);
|
|
@@ -124,14 +167,14 @@ var Table = function Table(_ref) {
|
|
|
124
167
|
|
|
125
168
|
setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));
|
|
126
169
|
}
|
|
127
|
-
}, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection,
|
|
170
|
+
}, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remoteOperations]);
|
|
128
171
|
/**
|
|
129
172
|
* Takes care of remote pagination.
|
|
130
173
|
* Works only in case remote pagination is set to true.
|
|
131
174
|
*/
|
|
132
175
|
|
|
133
176
|
React.useEffect(function () {
|
|
134
|
-
if (
|
|
177
|
+
if (remoteOperations) {
|
|
135
178
|
setCurrentPageRows(rows); // Let's assign pagination values
|
|
136
179
|
|
|
137
180
|
setFrom(pagination === null || pagination === void 0 ? void 0 : pagination.from);
|
|
@@ -140,7 +183,19 @@ var Table = function Table(_ref) {
|
|
|
140
183
|
setCurrentPage(pagination === null || pagination === void 0 ? void 0 : pagination.currentPage);
|
|
141
184
|
setRowsPerPage(pagination === null || pagination === void 0 ? void 0 : pagination.rowsPerPage);
|
|
142
185
|
}
|
|
143
|
-
}, [
|
|
186
|
+
}, [remoteOperations, pagination, rows]);
|
|
187
|
+
/**
|
|
188
|
+
* Sets number of rows to display when accordion.
|
|
189
|
+
*/
|
|
190
|
+
|
|
191
|
+
React.useEffect(function () {
|
|
192
|
+
if (!accordion) return;
|
|
193
|
+
setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);
|
|
194
|
+
}, [rows, accordion, collapsedRows, isCollapsed]);
|
|
195
|
+
React.useEffect(function () {
|
|
196
|
+
if (!accordion) return;
|
|
197
|
+
setIsCollapsed(!!collapsed);
|
|
198
|
+
}, [accordion, collapsed]);
|
|
144
199
|
/**
|
|
145
200
|
* Filters out a rows by specific column filters and sorts them if any sorting is set.
|
|
146
201
|
* @returns Filtered and sorted rows.
|
|
@@ -224,8 +279,8 @@ var Table = function Table(_ref) {
|
|
|
224
279
|
setSortedColumn(column.key);
|
|
225
280
|
setSortedDirection('desc'); // Let's trigger remote sorting trigger function
|
|
226
281
|
|
|
227
|
-
if (
|
|
228
|
-
|
|
282
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
283
|
+
onTriggerSortingChange(column.key, 'desc');
|
|
229
284
|
}
|
|
230
285
|
} else {
|
|
231
286
|
tmpColumn.sortingDirection = 'asc'; // Update sorted column and direction
|
|
@@ -233,8 +288,8 @@ var Table = function Table(_ref) {
|
|
|
233
288
|
setSortedColumn(column.key);
|
|
234
289
|
setSortedDirection('asc'); // Let's trigger remote sorting trigger function
|
|
235
290
|
|
|
236
|
-
if (
|
|
237
|
-
|
|
291
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
292
|
+
onTriggerSortingChange(column.key, 'asc');
|
|
238
293
|
}
|
|
239
294
|
}
|
|
240
295
|
} else {
|
|
@@ -244,8 +299,8 @@ var Table = function Table(_ref) {
|
|
|
244
299
|
setSortedColumn(column.key);
|
|
245
300
|
setSortedDirection('asc'); // Let's trigger remote sorting trigger function
|
|
246
301
|
|
|
247
|
-
if (
|
|
248
|
-
|
|
302
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
303
|
+
onTriggerSortingChange(column.key, 'asc');
|
|
249
304
|
}
|
|
250
305
|
}
|
|
251
306
|
} else if (tmpColumn.sortingDirection !== undefined) {
|
|
@@ -262,10 +317,10 @@ var Table = function Table(_ref) {
|
|
|
262
317
|
|
|
263
318
|
|
|
264
319
|
var previousPage = function previousPage() {
|
|
265
|
-
if (
|
|
320
|
+
if (remoteOperations) {
|
|
266
321
|
// Let's inform parent component about page change
|
|
267
|
-
if (
|
|
268
|
-
|
|
322
|
+
if (onPreviousPageClick) {
|
|
323
|
+
onPreviousPageClick();
|
|
269
324
|
}
|
|
270
325
|
} else {
|
|
271
326
|
// Let's change the page within the component
|
|
@@ -278,10 +333,10 @@ var Table = function Table(_ref) {
|
|
|
278
333
|
|
|
279
334
|
|
|
280
335
|
var nextPage = function nextPage() {
|
|
281
|
-
if (
|
|
336
|
+
if (remoteOperations) {
|
|
282
337
|
// Let's inform parent component about page change
|
|
283
|
-
if (
|
|
284
|
-
|
|
338
|
+
if (onNextPageClick) {
|
|
339
|
+
onNextPageClick();
|
|
285
340
|
}
|
|
286
341
|
} else {
|
|
287
342
|
// Let's change the page within the component
|
|
@@ -296,10 +351,10 @@ var Table = function Table(_ref) {
|
|
|
296
351
|
|
|
297
352
|
var changeRowsPerPage = function changeRowsPerPage(value) {
|
|
298
353
|
// Let's check if we are using remote pagination
|
|
299
|
-
if (
|
|
354
|
+
if (remoteOperations) {
|
|
300
355
|
// Inform parent component about rows per page change
|
|
301
|
-
if (
|
|
302
|
-
|
|
356
|
+
if (onRowsPerPageChange) {
|
|
357
|
+
onRowsPerPageChange(value);
|
|
303
358
|
}
|
|
304
359
|
} else {
|
|
305
360
|
// Let's reset current page to 1
|
|
@@ -307,67 +362,7 @@ var Table = function Table(_ref) {
|
|
|
307
362
|
} // Let's set rows per page
|
|
308
363
|
|
|
309
364
|
|
|
310
|
-
setRowsPerPage(
|
|
311
|
-
};
|
|
312
|
-
/**
|
|
313
|
-
* Renders the table header.
|
|
314
|
-
*/
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
var renderHeader = function renderHeader() {
|
|
318
|
-
return /*#__PURE__*/React.createElement("thead", null, title && /*#__PURE__*/React.createElement("tr", {
|
|
319
|
-
"data-testid": "TestTableHeaderRow"
|
|
320
|
-
}, /*#__PURE__*/React.createElement(_TableStyles.TableHeaderRowCol, {
|
|
321
|
-
colSpan: columns.length
|
|
322
|
-
}, /*#__PURE__*/React.createElement("div", null, title, /*#__PURE__*/React.createElement(_SystemIcons.MoreVertical, {
|
|
323
|
-
size: "18px",
|
|
324
|
-
color: _styles.COLORS.neutral_600
|
|
325
|
-
})))), /*#__PURE__*/React.createElement("tr", {
|
|
326
|
-
"data-testid": "TestTableColumnHeaderRow"
|
|
327
|
-
}, columns.map(function (column) {
|
|
328
|
-
return /*#__PURE__*/React.createElement(_TableStyles.TableColumnHeaderCol, {
|
|
329
|
-
onClick: function onClick() {
|
|
330
|
-
return sortTableColumn(column);
|
|
331
|
-
},
|
|
332
|
-
key: column.key,
|
|
333
|
-
style: {
|
|
334
|
-
width: column.width
|
|
335
|
-
},
|
|
336
|
-
className: "".concat(column.sortable ? 'sortable' : '', " ").concat(!title ? 'no-border' : '', " ").concat(column.justify ? "justify-".concat(column.justify) : '')
|
|
337
|
-
}, column.name, column.sortingDirection === 'asc' ? /*#__PURE__*/React.createElement(_SystemIcons.ArrowLineUp, {
|
|
338
|
-
size: "20px"
|
|
339
|
-
}) : column.sortingDirection === 'desc' ? /*#__PURE__*/React.createElement(_SystemIcons.ArrowLineDown, {
|
|
340
|
-
size: "20px"
|
|
341
|
-
}) : '');
|
|
342
|
-
})));
|
|
343
|
-
};
|
|
344
|
-
/**
|
|
345
|
-
* Function which is called when a mouse click happens on a link to pass data to the parent component.
|
|
346
|
-
* @param row - Row in which the link is located.
|
|
347
|
-
* @param key - Key of the column for which the link is set.
|
|
348
|
-
* @param event - Click event handler.
|
|
349
|
-
*/
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
var onLinkClick = function onLinkClick(row, key, event) {
|
|
353
|
-
if (linkClick) {
|
|
354
|
-
event.stopPropagation();
|
|
355
|
-
linkClick(row, key);
|
|
356
|
-
}
|
|
357
|
-
};
|
|
358
|
-
/**
|
|
359
|
-
* Function which is called when a mouse click happens on an icon to pass data to the parent component.
|
|
360
|
-
* @param row - Row in which the icon is located.
|
|
361
|
-
* @param key - Key of the column for which the icon is set.
|
|
362
|
-
* @param event - Click event handler.
|
|
363
|
-
*/
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
var onIconClick = function onIconClick(row, key, event) {
|
|
367
|
-
if (iconClick) {
|
|
368
|
-
event.stopPropagation();
|
|
369
|
-
iconClick(row, key);
|
|
370
|
-
}
|
|
365
|
+
setRowsPerPage(value);
|
|
371
366
|
};
|
|
372
367
|
/**
|
|
373
368
|
* Function which is called when a mouse click happens on a row to pass data to the parent component.
|
|
@@ -378,125 +373,87 @@ var Table = function Table(_ref) {
|
|
|
378
373
|
var onRowClick = function onRowClick(row) {
|
|
379
374
|
var _window, _window$getSelection;
|
|
380
375
|
|
|
381
|
-
var selectedText = (_window = window) === null || _window === void 0 ? void 0 : (_window$getSelection = _window.getSelection()) === null || _window$getSelection === void 0 ? void 0 : _window$getSelection.toString();
|
|
376
|
+
var selectedText = (_window = window) === null || _window === void 0 ? void 0 : (_window$getSelection = _window.getSelection()) === null || _window$getSelection === void 0 ? void 0 : _window$getSelection.toString();
|
|
382
377
|
|
|
383
|
-
if ((selectedText === null || selectedText === void 0 ? void 0 : selectedText.length) === 0 &&
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
};
|
|
387
|
-
/**
|
|
388
|
-
* Renders the table body.
|
|
389
|
-
*/
|
|
378
|
+
if ((selectedText === null || selectedText === void 0 ? void 0 : selectedText.length) === 0 && selectable) {
|
|
379
|
+
var value = keyExpr ? row[keyExpr] : row;
|
|
380
|
+
var currentSelection = value;
|
|
390
381
|
|
|
382
|
+
if (!!multiSelect) {
|
|
383
|
+
var existing = selected === null || selected === void 0 ? void 0 : selected.indexOf(value);
|
|
391
384
|
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
style: column.colorFn ? {
|
|
404
|
-
color: column.colorFn(row, column.key),
|
|
405
|
-
maxWidth: column.width
|
|
406
|
-
} : {
|
|
407
|
-
maxWidth: column.width
|
|
408
|
-
},
|
|
409
|
-
className: "".concat(column.shortenText && "truncate-text", " ").concat(column.justify ? "justify-".concat(column.justify) : '', " "),
|
|
410
|
-
title: column.shortenText && row[column.key]
|
|
411
|
-
}, column.isLink && row[column.key] ? /*#__PURE__*/React.createElement(_index3.Button, {
|
|
412
|
-
size: _types.Size.Small,
|
|
413
|
-
variant: "tertiary",
|
|
414
|
-
onClick: function onClick(event) {
|
|
415
|
-
return onLinkClick(row, column.key, event);
|
|
416
|
-
},
|
|
417
|
-
style: column.colorFn && {
|
|
418
|
-
color: column.colorFn(row, column.key)
|
|
419
|
-
}
|
|
420
|
-
}, row[column.key]) : column.isIcon && column.icon ? /*#__PURE__*/React.createElement(_index3.IconButton, {
|
|
421
|
-
variant: "secondary",
|
|
422
|
-
shape: "circular",
|
|
423
|
-
useTransparentBackground: true,
|
|
424
|
-
action: function action(event) {
|
|
425
|
-
return onIconClick(row, column.key, event);
|
|
426
|
-
}
|
|
427
|
-
}, _index.SystemIcons[column.icon]({
|
|
428
|
-
size: '24',
|
|
429
|
-
className: 'icon'
|
|
430
|
-
})) : column.customContent ? column.customContent(row, column.key) : row[column.key]);
|
|
431
|
-
}));
|
|
432
|
-
}) : /*#__PURE__*/React.createElement(_TableStyles.TableDataRow, {
|
|
433
|
-
className: "no-rows",
|
|
434
|
-
"data-testid": "TestTableNoDataRow"
|
|
435
|
-
}, /*#__PURE__*/React.createElement(_TableStyles.TableDataCol, {
|
|
436
|
-
colSpan: columns.length,
|
|
437
|
-
className: "center"
|
|
438
|
-
}, "There are no rows to display")));
|
|
385
|
+
if (existing > -1) {
|
|
386
|
+
currentSelection = _toConsumableArray(selected);
|
|
387
|
+
currentSelection.splice(existing, 1);
|
|
388
|
+
} else {
|
|
389
|
+
currentSelection = [].concat(_toConsumableArray(selected), [currentSelection]);
|
|
390
|
+
}
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
setSelected(currentSelection);
|
|
394
|
+
props.onSelectionChange && props.onSelectionChange(currentSelection);
|
|
395
|
+
}
|
|
439
396
|
};
|
|
440
397
|
/**
|
|
441
|
-
*
|
|
398
|
+
* Function which is called when user clicks checkbox to select or deselect all rows.
|
|
442
399
|
*/
|
|
443
400
|
|
|
444
401
|
|
|
445
|
-
var
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
shape: "circular",
|
|
471
|
-
action: function action() {
|
|
472
|
-
return previousPage();
|
|
473
|
-
},
|
|
474
|
-
disabled: from === 1
|
|
475
|
-
}, /*#__PURE__*/React.createElement(_SystemIcons.ChevronLeft, {
|
|
476
|
-
size: "24",
|
|
477
|
-
color: _styles.COLORS.neutral_600
|
|
478
|
-
})), /*#__PURE__*/React.createElement(_index3.IconButton, {
|
|
479
|
-
variant: "secondary",
|
|
480
|
-
shape: "circular",
|
|
481
|
-
action: function action() {
|
|
482
|
-
return nextPage();
|
|
483
|
-
},
|
|
484
|
-
disabled: to === total
|
|
485
|
-
}, /*#__PURE__*/React.createElement(_SystemIcons.ChevronRight, {
|
|
486
|
-
size: "24",
|
|
487
|
-
color: _styles.COLORS.neutral_600
|
|
488
|
-
})))))));
|
|
402
|
+
var onSelectAllClick = function onSelectAllClick() {
|
|
403
|
+
var currentList = currentPageRows.map(function (row) {
|
|
404
|
+
return keyExpr ? row[keyExpr] : row;
|
|
405
|
+
});
|
|
406
|
+
|
|
407
|
+
switch (selectAllState) {
|
|
408
|
+
case 'all':
|
|
409
|
+
setSelected(_toConsumableArray(selected).filter(function (item) {
|
|
410
|
+
return !currentList.includes(item);
|
|
411
|
+
}));
|
|
412
|
+
setSelectAllState('none');
|
|
413
|
+
break;
|
|
414
|
+
|
|
415
|
+
case 'none':
|
|
416
|
+
setSelected([].concat(_toConsumableArray(selected), _toConsumableArray(currentList)));
|
|
417
|
+
setSelectAllState('all');
|
|
418
|
+
break;
|
|
419
|
+
|
|
420
|
+
case 'some':
|
|
421
|
+
setSelected([].concat(_toConsumableArray(selected), _toConsumableArray(currentList.filter(function (item) {
|
|
422
|
+
return !selected.includes(item);
|
|
423
|
+
}))));
|
|
424
|
+
setSelectAllState('all');
|
|
425
|
+
break;
|
|
426
|
+
}
|
|
489
427
|
};
|
|
490
428
|
/**
|
|
491
429
|
* Return Table component.
|
|
492
430
|
*/
|
|
493
431
|
|
|
494
432
|
|
|
495
|
-
return /*#__PURE__*/React.createElement(_TableStyles.TableWrapper, null, /*#__PURE__*/React.createElement(_TableStyles.
|
|
433
|
+
return /*#__PURE__*/React.createElement(_TableStyles.TableWrapper, null, /*#__PURE__*/React.createElement(_TableStyles.StyledTable, {
|
|
496
434
|
cellPadding: "0",
|
|
497
435
|
cellSpacing: "0",
|
|
498
|
-
"data-testid": "TestTable"
|
|
499
|
-
|
|
436
|
+
"data-testid": "TestTable",
|
|
437
|
+
className: 'table'
|
|
438
|
+
}, /*#__PURE__*/React.createElement(_TableHeaders.default, _extends({}, props, {
|
|
439
|
+
sortByColumn: sortTableColumn,
|
|
440
|
+
onSelectAllClick: onSelectAllClick,
|
|
441
|
+
selectAllState: selectAllState
|
|
442
|
+
})), /*#__PURE__*/React.createElement(_TableBody.default, _extends({}, props, {
|
|
443
|
+
currentPageRows: currentPageRows,
|
|
444
|
+
selected: selected,
|
|
445
|
+
onRowClick: onRowClick
|
|
446
|
+
})), /*#__PURE__*/React.createElement(_TableFooter.default, _extends({}, props, {
|
|
447
|
+
onRowsPerPageChange: changeRowsPerPage,
|
|
448
|
+
rowsPerPage: rowsPerPage,
|
|
449
|
+
setIsCollapsed: setIsCollapsed,
|
|
450
|
+
isCollapsed: isCollapsed,
|
|
451
|
+
from: from,
|
|
452
|
+
to: to,
|
|
453
|
+
total: total,
|
|
454
|
+
nextPage: nextPage,
|
|
455
|
+
prevPage: previousPage
|
|
456
|
+
}))), showLoadingIndicator && /*#__PURE__*/React.createElement(_TableStyles.StyledTableSpinner, null, /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
|
|
500
457
|
size: _types.Size.Medium,
|
|
501
458
|
color: "#ffffff"
|
|
502
459
|
})));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Table/Table.tsx"],"names":["Table","rowClick","linkClick","iconClick","previousPageClick","nextPageClick","rowsPerPageChange","triggerSortingChange","title","columns","rows","remotePagination","pagination","showLoadingIndicator","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","useEffect","tmpFilteredRows","filterAndSortRows","length","rowsFrom","rowsTo","slice","filter","row","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","some","sortingDirection","sortingColumn","find","sort","a","b","sortTableColumn","map","tmpColumn","sortable","undefined","previousPage","nextPage","changeRowsPerPage","value","parseInt","renderHeader","COLORS","neutral_600","width","justify","name","onLinkClick","event","stopPropagation","onIconClick","onRowClick","selectedText","window","getSelection","toString","renderBody","index","colorFn","color","maxWidth","shortenText","isLink","Size","Small","isIcon","icon","icons","size","className","customContent","renderFooter","rowsPerPageValues","x","label","Medium"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport { MoreVertical, ChevronRight, ChevronLeft, ArrowLineDown, ArrowLineUp } from '../icons/systemicons/SystemIcons';\nimport { SystemIcons as icons } from '../icons/index';\nimport { DropdownFilter } from '../Dropdown/index';\nimport { IconButton, Button } from '../Button/index';\nimport { Size } from '../types'\n\n/**\n * Import custom styles.\n */\nimport { COLORS } from '../styles';\nimport { TableHeaderRowCol, TableColumnHeaderCol, TableContainer, TableDataCol, TableDataRow, TableFooterCol, TableWrapper, TableLoadingIndicator } from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport { TableProps, TableColumn, TableSortingDirection } from './TableTypes';\nimport { LoadingIndicator } from '../LoadingIndicator';\n\nconst Table: React.FunctionComponent<TableProps> = ({\n rowClick,\n linkClick,\n iconClick,\n previousPageClick,\n nextPageClick,\n rowsPerPageChange,\n triggerSortingChange,\n title,\n columns,\n rows,\n remotePagination,\n pagination,\n showLoadingIndicator,\n}: TableProps) => {\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sortedColumn, setSortedColumn] = React.useState<string>('');\n const [sortedDirection, setSortedDirection] = React.useState<TableSortingDirection>('asc');\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remotePagination) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remotePagination]);\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remotePagination) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remotePagination, pagination, rows]);\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (columns.some((column) => column.sortingDirection)) {\n // Let's find the sorting column\n const sortingColumn = columns.find((column) => column.sortingDirection)!;\n\n // Update sorted column data\n setSortedDirection(sortingColumn.sortingDirection!);\n setSortedColumn(sortingColumn.key!);\n\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sortingColumn.key] > b[sortingColumn.key]) {\n return sortingColumn.sortingDirection === 'asc' ? 1 : -1;\n } else if (a[sortingColumn.key] < b[sortingColumn.key]) {\n return sortingColumn.sortingDirection === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n // Let's remove any active sorting\n columns = columns.map((tmpColumn: TableColumn) => {\n // Let's apply new sorting\n // Let's check if it is the column for which we have to apply sorting\n if (column.key === tmpColumn.key && tmpColumn.sortable) {\n // Let's check if sorting is not defined\n // If so, let's toggle the sorting direction\n if (tmpColumn.sortingDirection !== undefined) {\n if (tmpColumn.sortingDirection === 'asc') {\n tmpColumn.sortingDirection = 'desc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('desc');\n\n // Let's trigger remote sorting trigger function\n if (remotePagination && triggerSortingChange) {\n triggerSortingChange(column.key, 'desc');\n }\n } else {\n tmpColumn.sortingDirection = 'asc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('asc');\n\n // Let's trigger remote sorting trigger function\n if (remotePagination && triggerSortingChange) {\n triggerSortingChange(column.key, 'asc');\n }\n }\n } else {\n // Let's apply the initial sorting\n tmpColumn.sortingDirection = 'asc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('asc');\n\n // Let's trigger remote sorting trigger function\n if (remotePagination && triggerSortingChange) {\n triggerSortingChange(column.key, 'asc');\n }\n }\n } else if (tmpColumn.sortingDirection !== undefined) {\n // Let's remove sorting\n tmpColumn.sortingDirection = undefined;\n }\n\n return tmpColumn;\n });\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remotePagination) {\n // Let's inform parent component about page change\n if (previousPageClick) {\n previousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remotePagination) {\n // Let's inform parent component about page change\n if (nextPageClick) {\n nextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: string) => {\n // Let's check if we are using remote pagination\n if (remotePagination) {\n // Inform parent component about rows per page change\n if (rowsPerPageChange) {\n rowsPerPageChange(parseInt(value));\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(parseInt(value));\n };\n\n /**\n * Renders the table header.\n */\n const renderHeader = () => {\n return (\n <thead>\n {title && (\n <tr data-testid=\"TestTableHeaderRow\">\n <TableHeaderRowCol colSpan={columns.length}>\n <div>\n {title}\n <MoreVertical size=\"18px\" color={COLORS.neutral_600} />\n </div>\n </TableHeaderRowCol>\n </tr>\n )}\n <tr data-testid=\"TestTableColumnHeaderRow\">\n {columns.map((column: TableColumn) => (\n <TableColumnHeaderCol\n onClick={() => sortTableColumn(column)}\n key={column.key}\n style={{ width: column.width }}\n className={`${column.sortable ? 'sortable' : ''} ${!title ? 'no-border' : ''} ${column.justify ? `justify-${column.justify}` : ''}`}>\n {column.name}\n\n {column.sortingDirection === 'asc' ? <ArrowLineUp size=\"20px\" /> : column.sortingDirection === 'desc' ? <ArrowLineDown size=\"20px\" /> : ''}\n </TableColumnHeaderCol>\n ))}\n </tr>\n </thead>\n );\n };\n\n /**\n * Function which is called when a mouse click happens on a link to pass data to the parent component.\n * @param row - Row in which the link is located.\n * @param key - Key of the column for which the link is set.\n * @param event - Click event handler.\n */\n const onLinkClick = (row: any, key: string, event: React.MouseEvent) => {\n if (linkClick) {\n event.stopPropagation();\n\n linkClick(row, key);\n }\n };\n\n /**\n * Function which is called when a mouse click happens on an icon to pass data to the parent component.\n * @param row - Row in which the icon is located.\n * @param key - Key of the column for which the icon is set.\n * @param event - Click event handler.\n */\n const onIconClick = (row: any, key: string, event: React.MouseEvent<HTMLButtonElement>) => {\n if (iconClick) {\n event.stopPropagation();\n\n iconClick(row, key);\n }\n };\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n // Let's trigger row click only if we haven't selected any text and action exists\n if (selectedText?.length === 0 && rowClick) {\n rowClick(row);\n }\n };\n\n /**\n * Renders the table body.\n */\n const renderBody = () => {\n return (\n <tbody>\n {currentPageRows.length > 0 ? (\n currentPageRows.map((row: any, index: number) => (\n <TableDataRow key={`row_${index}`} onClick={() => onRowClick(row)} data-testid=\"TestTableDataRow\">\n {columns.map((column: TableColumn) => (\n <TableDataCol\n key={`row_${index}_${column.key}`}\n style={column.colorFn ? { color: column.colorFn(row, column.key), maxWidth: column.width } : { maxWidth: column.width }}\n className={`${column.shortenText && `truncate-text`} ${column.justify ? `justify-${column.justify}` : ''} `}\n title={column.shortenText && row[column.key]}>\n {column.isLink && row[column.key] ? (\n <Button\n size={Size.Small}\n variant=\"tertiary\"\n onClick={(event) => onLinkClick(row, column.key, event)}\n style={column.colorFn && { color: column.colorFn(row, column.key) }}>\n {row[column.key]}\n </Button>\n ) : column.isIcon && column.icon ? (\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground={true} action={(event) => onIconClick(row, column.key, event!)}>\n {icons[column.icon!]({ size: '24', className: 'icon' })}\n </IconButton>\n ) : column.customContent ? (\n column.customContent(row, column.key)\n ) : (\n row[column.key]\n )}\n </TableDataCol>\n ))}\n </TableDataRow>\n ))\n ) : (\n <TableDataRow className=\"no-rows\" data-testid=\"TestTableNoDataRow\">\n <TableDataCol colSpan={columns.length} className=\"center\">\n There are no rows to display\n </TableDataCol>\n </TableDataRow>\n )}\n </tbody>\n );\n };\n\n /**\n * Renders the table footer.\n */\n const renderFooter = () => {\n // Define local values used within the footer\n const rowsPerPageValues = ['10', '20', '50', '100'];\n\n return (\n <tfoot>\n <tr>\n <TableFooterCol colSpan={columns.length} data-testid=\"TestTableFooterRow\">\n <div>\n <span>Rows per page: </span>\n <DropdownFilter\n id=\"rows-per-page\"\n list={rowsPerPageValues.map(x => ({ label: x }))}\n disableSorting={true}\n onSelect={(value) => changeRowsPerPage(value)}\n initalValue={rowsPerPage.toString()}\n isButton={true}\n />\n <span className=\"current-page-info\">\n {total === 0 ? 0 : from}-{to} of {total}\n </span>\n <div className=\"controls\">\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => previousPage()} disabled={from === 1}>\n <ChevronLeft size=\"24\" color={COLORS.neutral_600} />\n </IconButton>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => nextPage()} disabled={to === total}>\n <ChevronRight size=\"24\" color={COLORS.neutral_600} />\n </IconButton>\n </div>\n </div>\n </TableFooterCol>\n </tr>\n </tfoot>\n );\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper>\n <TableContainer cellPadding=\"0\" cellSpacing=\"0\" data-testid=\"TestTable\">\n {renderHeader()}\n {renderBody()}\n {renderFooter()}\n </TableContainer>\n {showLoadingIndicator && (\n <TableLoadingIndicator>\n <LoadingIndicator size={Size.Medium} color=\"#ffffff\"></LoadingIndicator>\n </TableLoadingIndicator>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"file":"Table.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Table/Table.tsx"],"names":["Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","accordion","collapsed","collapsedRows","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","tmpFilteredRows","filterAndSortRows","rowsFrom","rowsTo","slice","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","some","sortingDirection","sortingColumn","find","sort","a","b","sortTableColumn","tmpColumn","sortable","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","Size","Medium"],"mappings":";;;;;;;;;AAGA;;AAKA;;AAKA;;AAMA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,KAA0C,GAAG,SAA7CA,KAA6C,CAACC,KAAD,EAAuB;AACxE,MACEC,mBADF,GAgBID,KAhBJ,CACEC,mBADF;AAAA,MAEEC,eAFF,GAgBIF,KAhBJ,CAEEE,eAFF;AAAA,MAGEC,mBAHF,GAgBIH,KAhBJ,CAGEG,mBAHF;AAAA,MAIEC,sBAJF,GAgBIJ,KAhBJ,CAIEI,sBAJF;AAAA,MAKEC,OALF,GAgBIL,KAhBJ,CAKEK,OALF;AAAA,MAMEC,IANF,GAgBIN,KAhBJ,CAMEM,IANF;AAAA,MAOEC,gBAPF,GAgBIP,KAhBJ,CAOEO,gBAPF;AAAA,MAQEC,UARF,GAgBIR,KAhBJ,CAQEQ,UARF;AAAA,MASEC,oBATF,GAgBIT,KAhBJ,CASES,oBATF;AAAA,MAUEC,UAVF,GAgBIV,KAhBJ,CAUEU,UAVF;AAAA,MAWEC,WAXF,GAgBIX,KAhBJ,CAWEW,WAXF;AAAA,MAYEC,OAZF,GAgBIZ,KAhBJ,CAYEY,OAZF;AAAA,MAaEC,SAbF,GAgBIb,KAhBJ,CAaEa,SAbF;AAAA,yBAgBIb,KAhBJ,CAcEc,SAdF;AAAA,MAcEA,SAdF,iCAcc,IAdd;AAAA,MAeEC,aAfF,GAgBIf,KAhBJ,CAeEe,aAfF,CADwE,CAmBxE;;AACA,wBAAsCC,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAtC;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AACA,yBAAwCH,KAAK,CAACC,QAAN,CAAsB,EAAtB,CAAxC;AAAA;AAAA,MAAOG,YAAP;AAAA,MAAqBC,eAArB;;AACA,yBAA8CL,KAAK,CAACC,QAAN,CAAsB,EAAtB,CAA9C;AAAA;AAAA,MAAOK,eAAP;AAAA,MAAwBC,kBAAxB;;AACA,yBAAsCP,KAAK,CAACC,QAAN,CAAuB,CAAvB,CAAtC;AAAA;AAAA,MAAOO,WAAP;AAAA,MAAoBC,cAApB;;AACA,yBAAwCT,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOS,YAAP;AAAA,MAAqBC,eAArB;;AACA,0BAA8CX,KAAK,CAACC,QAAN,CAAsC,KAAtC,CAA9C;AAAA;AAAA,MAAOW,eAAP;AAAA,MAAwBC,kBAAxB;;AACA,0BAAwBb,KAAK,CAACC,QAAN,EAAxB;AAAA;AAAA,MAAOa,IAAP;AAAA,MAAaC,OAAb;;AACA,0BAAoBf,KAAK,CAACC,QAAN,EAApB;AAAA;AAAA,MAAOe,EAAP;AAAA,MAAWC,KAAX;;AACA,0BAA0BjB,KAAK,CAACC,QAAN,EAA1B;AAAA;AAAA,MAAOiB,KAAP;AAAA,MAAcC,QAAd;;AAEA,0BAAsCnB,KAAK,CAACC,QAAN,CAAe,IAAf,CAAtC;AAAA;AAAA,MAAOmB,WAAP;AAAA,MAAoBC,cAApB;;AAEA,0BAA4CrB,KAAK,CAACC,QAAN,CAAwC,MAAxC,CAA5C;AAAA;AAAA,MAAOqB,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,0BAAgCvB,KAAK,CAACC,QAAN,CAA4BN,WAAW,GAAG,EAAH,GAAQ6B,SAA/C,CAAhC;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,WAAjB;;AAEA1B,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpBD,IAAAA,WAAW,CAAC1C,KAAK,CAAC4C,YAAN,KAAuBjC,WAAW,GAAG,EAAH,GAAQ6B,SAA1C,CAAD,CAAX;AACD,GAFD,EAEG,CAACxC,KAAK,CAAC4C,YAAP,EAAqBjC,WAArB,CAFH;AAIA;AACF;AACA;;AACEK,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,QAAIhC,WAAJ,EAAiB;AACf,UAAMkC,WAAW,GAAGvB,eAAe,CAACwB,GAAhB,CAAoB,UAAAC,GAAG;AAAA,eAAInC,OAAO,GAAGmC,GAAG,CAACnC,OAAD,CAAN,GAAkBmC,GAA7B;AAAA,OAAvB,CAApB;AACA,UAAMC,KAAK,GAAGP,QAAQ,CAACQ,MAAT,CAAgB,UAACC,IAAD;AAAA,eAAeL,WAAW,CAACM,QAAZ,CAAqBD,IAArB,CAAf;AAAA,OAAhB,EAA2DE,MAAzE;AAEAb,MAAAA,iBAAiB,CAACS,KAAK,KAAKH,WAAW,CAACO,MAAtB,GAA+B,KAA/B,GAAuCJ,KAAK,GAAG,CAAR,GAAY,MAAZ,GAAqB,MAA7D,CAAjB;AACD;AACF,GAPD,EAOG,CAAC1B,eAAD,EAAkBX,WAAlB,EAA+B8B,QAA/B,EAAyC7B,OAAzC,CAPH;AAUA;AACF;AACA;AACA;;AACEI,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,QAAI,CAACpC,gBAAL,EAAuB;AACrB;AACA,UAAM8C,eAAe,GAAGC,iBAAiB,EAAzC;AACAjC,MAAAA,eAAe,CAACgC,eAAD,CAAf;AACAlB,MAAAA,QAAQ,CAACkB,eAAe,CAACD,MAAjB,CAAR,CAJqB,CAMrB;;AACA,UAAMG,QAAQ,GAAG,CAAC/B,WAAW,GAAG,CAAf,IAAoBN,WAArC;AACA,UAAMsC,MAAM,GAAGD,QAAQ,GAAGrC,WAAX,IAA0BmC,eAAe,CAACD,MAA1C,GAAmDC,eAAe,CAACD,MAAnE,GAA4EG,QAAQ,GAAGrC,WAAtG,CARqB,CAUrB;;AACAa,MAAAA,OAAO,CAACwB,QAAQ,GAAG,CAAZ,CAAP;AACAtB,MAAAA,KAAK,CAACuB,MAAD,CAAL,CAZqB,CAcrB;;AACAjC,MAAAA,kBAAkB,CAAC8B,eAAe,CAACI,KAAhB,CAAsBF,QAAtB,EAAgCC,MAAhC,CAAD,CAAlB;AACD;AACF,GAlBD,EAkBG,CAACtC,WAAD,EAAcZ,IAAd,EAAoBkB,WAApB,EAAiCnB,OAAjC,EAA0CqB,YAA1C,EAAwDE,eAAxD,EAAyErB,gBAAzE,CAlBH;AAoBA;AACF;AACA;AACA;;AACES,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,QAAIpC,gBAAJ,EAAsB;AACpBgB,MAAAA,kBAAkB,CAACjB,IAAD,CAAlB,CADoB,CAGpB;;AACAyB,MAAAA,OAAO,CAACvB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEsB,IAAb,CAAP;AACAG,MAAAA,KAAK,CAACzB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEwB,EAAb,CAAL;AACAG,MAAAA,QAAQ,CAAC3B,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAE0B,KAAb,CAAR;AACAT,MAAAA,cAAc,CAACjB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEgB,WAAb,CAAd;AACAL,MAAAA,cAAc,CAACX,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEU,WAAb,CAAd;AACD;AACF,GAXD,EAWG,CAACX,gBAAD,EAAmBC,UAAnB,EAA+BF,IAA/B,CAXH;AAaA;AACF;AACA;;AACEU,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,QAAI,CAAC9B,SAAL,EAAgB;AAEhBM,IAAAA,cAAc,CAACiB,WAAW,GAAGrB,aAAa,IAAI,EAApB,GAA0BT,IAAI,CAAC8C,MAA3C,CAAd;AACD,GAJD,EAIG,CAAC9C,IAAD,EAAOO,SAAP,EAAkBE,aAAlB,EAAiCqB,WAAjC,CAJH;AAMApB,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,QAAI,CAAC9B,SAAL,EAAgB;AAEhBwB,IAAAA,cAAc,CAAC,CAAC,CAACvB,SAAH,CAAd;AACD,GAJD,EAIG,CAAED,SAAF,EAAaC,SAAb,CAJH;AAMA;AACF;AACA;AACA;;AACE,MAAMwC,iBAAiB,GAAG,SAApBA,iBAAoB,GAAa;AACrC,QAAID,eAAe,GAAG/C,IAAI,CAAC2C,MAAL,CAAY,UAACF,GAAD,EAAS;AACzC;AACA,UAAIW,mBAAmB,GAAG,IAA1B,CAFyC,CAIzC;;AAJyC,iDAKpBrD,OALoB;AAAA;;AAAA;AAKzC,4DAA8B;AAAA,cAAnBsD,MAAmB;;AAC5B;AACA;AACA;AACA,cAAIA,MAAM,CAACC,WAAP,IAAsBb,GAAG,CAACY,MAAM,CAACE,GAAR,CAAH,CAAgBC,WAAhB,GAA8BC,OAA9B,CAAsCJ,MAAM,CAACC,WAAP,CAAmBE,WAAnB,EAAtC,MAA4E,CAAC,CAAvG,EAA0G;AACxGJ,YAAAA,mBAAmB,GAAG,KAAtB;AACD;AACF,SAZwC,CAczC;;AAdyC;AAAA;AAAA;AAAA;AAAA;;AAezC,UAAIA,mBAAJ,EAAyB;AACvB,eAAOX,GAAP;AACD;AACF,KAlBqB,CAAtB,CADqC,CAqBrC;;AACA,QAAI1C,OAAO,CAAC2D,IAAR,CAAa,UAACL,MAAD;AAAA,aAAYA,MAAM,CAACM,gBAAnB;AAAA,KAAb,CAAJ,EAAuD;AACrD;AACA,UAAMC,aAAa,GAAG7D,OAAO,CAAC8D,IAAR,CAAa,UAACR,MAAD;AAAA,eAAYA,MAAM,CAACM,gBAAnB;AAAA,OAAb,CAAtB,CAFqD,CAIrD;;AACApC,MAAAA,kBAAkB,CAACqC,aAAa,CAACD,gBAAf,CAAlB;AACAtC,MAAAA,eAAe,CAACuC,aAAa,CAACL,GAAf,CAAf,CANqD,CAQrD;;AACAR,MAAAA,eAAe,CAACe,IAAhB,CAAqB,UAACC,CAAD,EAAIC,CAAJ,EAAU;AAC7B,YAAID,CAAC,CAACH,aAAa,CAACL,GAAf,CAAD,GAAuBS,CAAC,CAACJ,aAAa,CAACL,GAAf,CAA5B,EAAiD;AAC/C,iBAAOK,aAAa,CAACD,gBAAd,KAAmC,KAAnC,GAA2C,CAA3C,GAA+C,CAAC,CAAvD;AACD,SAFD,MAEO,IAAII,CAAC,CAACH,aAAa,CAACL,GAAf,CAAD,GAAuBS,CAAC,CAACJ,aAAa,CAACL,GAAf,CAA5B,EAAiD;AACtD,iBAAOK,aAAa,CAACD,gBAAd,KAAmC,KAAnC,GAA2C,CAAC,CAA5C,GAAgD,CAAvD;AACD,SAFM,MAEA;AACL,iBAAO,CAAP;AACD;AACF,OARD;AASD,KAxCoC,CA0CrC;;;AACA,WAAOZ,eAAP;AACD,GA5CD;AA8CA;AACF;AACA;AACA;AACA;;;AACE,MAAMkB,eAAe,GAAG,SAAlBA,eAAkB,CAACZ,MAAD,EAA+B;AACrD;AACAtD,IAAAA,OAAO,GAAGA,OAAO,CAACyC,GAAR,CAAY,UAAC0B,SAAD,EAA4B;AAChD;AACA;AACA,UAAIb,MAAM,CAACE,GAAP,KAAeW,SAAS,CAACX,GAAzB,IAAgCW,SAAS,CAACC,QAA9C,EAAwD;AACtD;AACA;AACA,YAAID,SAAS,CAACP,gBAAV,KAA+BzB,SAAnC,EAA8C;AAC5C,cAAIgC,SAAS,CAACP,gBAAV,KAA+B,KAAnC,EAA0C;AACxCO,YAAAA,SAAS,CAACP,gBAAV,GAA6B,MAA7B,CADwC,CAGxC;;AACAtC,YAAAA,eAAe,CAACgC,MAAM,CAACE,GAAR,CAAf;AACAhC,YAAAA,kBAAkB,CAAC,MAAD,CAAlB,CALwC,CAOxC;;AACA,gBAAItB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,cAAAA,sBAAsB,CAACuD,MAAM,CAACE,GAAR,EAAa,MAAb,CAAtB;AACD;AACF,WAXD,MAWO;AACLW,YAAAA,SAAS,CAACP,gBAAV,GAA6B,KAA7B,CADK,CAGL;;AACAtC,YAAAA,eAAe,CAACgC,MAAM,CAACE,GAAR,CAAf;AACAhC,YAAAA,kBAAkB,CAAC,KAAD,CAAlB,CALK,CAOL;;AACA,gBAAItB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,cAAAA,sBAAsB,CAACuD,MAAM,CAACE,GAAR,EAAa,KAAb,CAAtB;AACD;AACF;AACF,SAxBD,MAwBO;AACL;AACAW,UAAAA,SAAS,CAACP,gBAAV,GAA6B,KAA7B,CAFK,CAIL;;AACAtC,UAAAA,eAAe,CAACgC,MAAM,CAACE,GAAR,CAAf;AACAhC,UAAAA,kBAAkB,CAAC,KAAD,CAAlB,CANK,CAQL;;AACA,cAAItB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,YAAAA,sBAAsB,CAACuD,MAAM,CAACE,GAAR,EAAa,KAAb,CAAtB;AACD;AACF;AACF,OAxCD,MAwCO,IAAIW,SAAS,CAACP,gBAAV,KAA+BzB,SAAnC,EAA8C;AACnD;AACAgC,QAAAA,SAAS,CAACP,gBAAV,GAA6BzB,SAA7B;AACD;;AAED,aAAOgC,SAAP;AACD,KAjDS,CAAV;AAkDD,GApDD;AAsDA;AACF;AACA;;;AACE,MAAME,YAAY,GAAG,SAAfA,YAAe,GAAM;AACzB,QAAInE,gBAAJ,EAAsB;AACpB;AACA,UAAIN,mBAAJ,EAAyB;AACvBA,QAAAA,mBAAmB;AACpB;AACF,KALD,MAKO;AACL;AACAwB,MAAAA,cAAc,CAACD,WAAW,GAAG,CAAd,GAAkBA,WAAW,GAAG,CAAhC,GAAoC,CAArC,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;;;AACE,MAAMmD,QAAQ,GAAG,SAAXA,QAAW,GAAM;AACrB,QAAIpE,gBAAJ,EAAsB;AACpB;AACA,UAAIL,eAAJ,EAAqB;AACnBA,QAAAA,eAAe;AAChB;AACF,KALD,MAKO;AACL;AACAuB,MAAAA,cAAc,CAACD,WAAW,GAAGN,WAAd,IAA6BE,YAAY,CAACgC,MAA1C,GAAmD5B,WAAnD,GAAiEA,WAAW,GAAG,CAAhF,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;AACA;;;AACE,MAAMoD,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,KAAD,EAAmB;AAC3C;AACA,QAAItE,gBAAJ,EAAsB;AACpB;AACA,UAAIJ,mBAAJ,EAAyB;AACvBA,QAAAA,mBAAmB,CAAC0E,KAAD,CAAnB;AACD;AACF,KALD,MAKO;AACL;AACApD,MAAAA,cAAc,CAAC,CAAD,CAAd;AACD,KAV0C,CAY3C;;;AACAN,IAAAA,cAAc,CAAC0D,KAAD,CAAd;AACD,GAdD;AAiBA;AACF;AACA;AACA;;;AACE,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAAC/B,GAAD,EAAoB;AAAA;;AACrC,QAAMgC,YAAY,cAAGC,MAAH,oEAAG,QAAQC,YAAR,EAAH,yDAAG,qBAAwBC,QAAxB,EAArB;;AAEA,QAAI,CAAAH,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAE3B,MAAd,MAAyB,CAAzB,IAA8B1C,UAAlC,EAA8C;AAC5C,UAAMmE,KAAK,GAAGjE,OAAO,GAAGmC,GAAG,CAACnC,OAAD,CAAN,GAAkBmC,GAAvC;AACA,UAAIoC,gBAAgB,GAAGN,KAAvB;;AACA,UAAI,CAAC,CAAClE,WAAN,EAAmB;AACjB,YAAMyE,QAAQ,GAAG3C,QAAH,aAAGA,QAAH,uBAAGA,QAAQ,CAAEsB,OAAV,CAAkBc,KAAlB,CAAjB;;AACA,YAAIO,QAAQ,GAAG,CAAC,CAAhB,EAAmB;AACjBD,UAAAA,gBAAgB,sBAAO1C,QAAP,CAAhB;AACA0C,UAAAA,gBAAgB,CAACE,MAAjB,CAAwBD,QAAxB,EAAkC,CAAlC;AACD,SAHD,MAGO;AACLD,UAAAA,gBAAgB,gCAAO1C,QAAP,IAAiB0C,gBAAjB,EAAhB;AACD;AACF;;AAEDzC,MAAAA,WAAW,CAACyC,gBAAD,CAAX;AACAnF,MAAAA,KAAK,CAACsF,iBAAN,IAA2BtF,KAAK,CAACsF,iBAAN,CAAwBH,gBAAxB,CAA3B;AACD;AACF,GAnBD;AAqBA;AACF;AACA;;;AACE,MAAMI,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AAC7B,QAAM1C,WAAW,GAAGvB,eAAe,CAACwB,GAAhB,CAAoB,UAAAC,GAAG;AAAA,aAAInC,OAAO,GAAGmC,GAAG,CAACnC,OAAD,CAAN,GAAkBmC,GAA7B;AAAA,KAAvB,CAApB;;AAEA,YAAQT,cAAR;AACE,WAAK,KAAL;AACEI,QAAAA,WAAW,CAAC,mBAAID,QAAJ,EAAcQ,MAAd,CAAqB,UAAAC,IAAI;AAAA,iBAAI,CAACL,WAAW,CAACM,QAAZ,CAAqBD,IAArB,CAAL;AAAA,SAAzB,CAAD,CAAX;AACAX,QAAAA,iBAAiB,CAAC,MAAD,CAAjB;AACA;;AACF,WAAK,MAAL;AACEG,QAAAA,WAAW,8BAAKD,QAAL,sBAAkBI,WAAlB,GAAX;AACAN,QAAAA,iBAAiB,CAAC,KAAD,CAAjB;AACA;;AACF,WAAK,MAAL;AACEG,QAAAA,WAAW,8BAAKD,QAAL,sBAAkBI,WAAW,CAACI,MAAZ,CAAmB,UAAAC,IAAI;AAAA,iBAAI,CAACT,QAAQ,CAACU,QAAT,CAAkBD,IAAlB,CAAL;AAAA,SAAvB,CAAlB,GAAX;AACAX,QAAAA,iBAAiB,CAAC,KAAD,CAAjB;AACA;AAZJ;AAcD,GAjBD;AAmBA;AACF;AACA;;;AACE,sBACE,oBAAC,yBAAD,qBACE,oBAAC,wBAAD;AAAa,IAAA,WAAW,EAAC,GAAzB;AAA6B,IAAA,WAAW,EAAC,GAAzC;AAA6C,mBAAY,WAAzD;AAAqE,IAAA,SAAS,EAAE;AAAhF,kBACE,oBAAC,qBAAD,eAAiBvC,KAAjB;AACa,IAAA,YAAY,EAAEuE,eAD3B;AAEa,IAAA,gBAAgB,EAAEgB,gBAF/B;AAGa,IAAA,cAAc,EAAEjD;AAH7B,KADF,eAKE,oBAAC,kBAAD,eAAetC,KAAf;AACW,IAAA,eAAe,EAAEsB,eAD5B;AAEW,IAAA,QAAQ,EAAEmB,QAFrB;AAGW,IAAA,UAAU,EAAEqC;AAHvB,KALF,eASE,oBAAC,oBAAD,eAAiB9E,KAAjB;AACa,IAAA,mBAAmB,EAAE4E,iBADlC;AAEa,IAAA,WAAW,EAAE1D,WAF1B;AAGa,IAAA,cAAc,EAAEmB,cAH7B;AAIa,IAAA,WAAW,EAAED,WAJ1B;AAKa,IAAA,IAAI,EAAEN,IALnB;AAMa,IAAA,EAAE,EAAEE,EANjB;AAOa,IAAA,KAAK,EAAEE,KAPpB;AAQa,IAAA,QAAQ,EAAEyC,QARvB;AASa,IAAA,QAAQ,EAAED;AATvB,KATF,CADF,EAqBGjE,oBAAoB,iBACnB,oBAAC,+BAAD,qBACE,oBAAC,kCAAD;AAAkB,IAAA,IAAI,EAAE+E,YAAKC,MAA7B;AAAqC,IAAA,KAAK,EAAC;AAA3C,IADF,CAtBJ,CADF;AA6BD,CA5VD;;eA8Ve1F,K","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n accordion,\n collapsed = true,\n collapsedRows\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sortedColumn, setSortedColumn] = React.useState<string>('');\n const [sortedDirection, setSortedDirection] = React.useState<TableSortingDirection>('asc');\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remoteOperations]);\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length );\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [ accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (columns.some((column) => column.sortingDirection)) {\n // Let's find the sorting column\n const sortingColumn = columns.find((column) => column.sortingDirection)!;\n\n // Update sorted column data\n setSortedDirection(sortingColumn.sortingDirection!);\n setSortedColumn(sortingColumn.key!);\n\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sortingColumn.key] > b[sortingColumn.key]) {\n return sortingColumn.sortingDirection === 'asc' ? 1 : -1;\n } else if (a[sortingColumn.key] < b[sortingColumn.key]) {\n return sortingColumn.sortingDirection === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n // Let's remove any active sorting\n columns = columns.map((tmpColumn: TableColumn) => {\n // Let's apply new sorting\n // Let's check if it is the column for which we have to apply sorting\n if (column.key === tmpColumn.key && tmpColumn.sortable) {\n // Let's check if sorting is not defined\n // If so, let's toggle the sorting direction\n if (tmpColumn.sortingDirection !== undefined) {\n if (tmpColumn.sortingDirection === 'asc') {\n tmpColumn.sortingDirection = 'desc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('desc');\n\n // Let's trigger remote sorting trigger function\n if (remoteOperations && onTriggerSortingChange) {\n onTriggerSortingChange(column.key, 'desc');\n }\n } else {\n tmpColumn.sortingDirection = 'asc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('asc');\n\n // Let's trigger remote sorting trigger function\n if (remoteOperations && onTriggerSortingChange) {\n onTriggerSortingChange(column.key, 'asc');\n }\n }\n } else {\n // Let's apply the initial sorting\n tmpColumn.sortingDirection = 'asc';\n\n // Update sorted column and direction\n setSortedColumn(column.key);\n setSortedDirection('asc');\n\n // Let's trigger remote sorting trigger function\n if (remoteOperations && onTriggerSortingChange) {\n onTriggerSortingChange(column.key, 'asc');\n }\n }\n } else if (tmpColumn.sortingDirection !== undefined) {\n // Let's remove sorting\n tmpColumn.sortingDirection = undefined;\n }\n\n return tmpColumn;\n });\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper>\n <StyledTable cellPadding=\"0\" cellSpacing=\"0\" data-testid=\"TestTable\" className={'table'}>\n <TableHeader {...props}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n selectAllState={selectAllState}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n </StyledTable>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium} color=\"#ffffff\"/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"file":"Table.js"}
|