@laerdal/life-react-components 1.3.1-dev.4 → 1.3.2-dev.11.full
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/AuthPage/AuthPage.js +1 -1
- package/dist/esm/AuthPage/AuthPage.js.map +1 -1
- package/dist/esm/AuthPage/Information.js +1 -1
- package/dist/esm/AuthPage/Information.js.map +1 -1
- package/dist/esm/Banners/Banner.js +16 -16
- package/dist/esm/Banners/Banner.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/ChipDropdownInput.js +2 -2
- package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/esm/Dropdown/CommonStyling.js +4 -0
- package/dist/esm/Dropdown/CommonStyling.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/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/__tests__/Modal.test.js +154 -0
- package/dist/esm/Modals/__tests__/Modal.test.js.map +1 -0
- package/dist/esm/Table/Table.js +113 -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 +60 -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 +130 -117
- package/dist/esm/Table/TableStyles.js.map +1 -1
- package/dist/esm/Table/__tests__/Table.test.js +0 -21
- package/dist/esm/Table/__tests__/Table.test.js.map +1 -1
- package/dist/esm/Tabs/TabLink.js +1 -0
- package/dist/esm/Tabs/TabLink.js.map +1 -1
- package/dist/esm/styles/typography.js +66 -66
- package/dist/esm/styles/typography.js.map +1 -1
- package/dist/js/AuthPage/AuthPage.js +1 -1
- package/dist/js/AuthPage/AuthPage.js.map +1 -1
- package/dist/js/AuthPage/Information.d.ts +1 -1
- package/dist/js/AuthPage/Information.js +1 -1
- package/dist/js/AuthPage/Information.js.map +1 -1
- package/dist/js/Banners/Banner.js +16 -19
- package/dist/js/Banners/Banner.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/ChipDropdownInput.js +3 -1
- package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/js/Dropdown/CommonStyling.js +1 -1
- package/dist/js/Dropdown/CommonStyling.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/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/__tests__/Modal.test.js +231 -0
- package/dist/js/Modals/__tests__/Modal.test.js.map +1 -0
- package/dist/js/Table/Table.js +143 -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 +13 -0
- package/dist/js/Table/TableFooter.js +82 -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 +17 -7
- package/dist/js/Table/TableStyles.js +58 -16
- package/dist/js/Table/TableStyles.js.map +1 -1
- package/dist/js/Table/TableTypes.d.ts +23 -16
- package/dist/js/Table/__tests__/Table.test.js +8 -30
- package/dist/js/Table/__tests__/Table.test.js.map +1 -1
- package/dist/js/Tabs/TabLink.js +1 -1
- package/dist/js/Tabs/TabLink.js.map +1 -1
- package/dist/js/styles/typography.d.ts +6 -6
- package/dist/js/styles/typography.js +66 -66
- package/dist/js/styles/typography.js.map +1 -1
- package/dist/umd/AuthPage/AuthPage.js +1 -1
- package/dist/umd/AuthPage/AuthPage.js.map +1 -1
- package/dist/umd/AuthPage/Information.js +1 -1
- package/dist/umd/AuthPage/Information.js.map +1 -1
- package/dist/umd/Banners/Banner.js +16 -16
- package/dist/umd/Banners/Banner.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/ChipDropdownInput.js +2 -2
- package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/umd/Dropdown/CommonStyling.js +4 -0
- package/dist/umd/Dropdown/CommonStyling.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/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/__tests__/Modal.test.js +173 -0
- package/dist/umd/Modals/__tests__/Modal.test.js.map +1 -0
- package/dist/umd/Table/Table.js +139 -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 +82 -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 +134 -122
- package/dist/umd/Table/TableStyles.js.map +1 -1
- package/dist/umd/Table/__tests__/Table.test.js +0 -21
- package/dist/umd/Table/__tests__/Table.test.js.map +1 -1
- package/dist/umd/Tabs/TabLink.js +1 -0
- package/dist/umd/Tabs/TabLink.js.map +1 -1
- package/dist/umd/styles/typography.js +66 -66
- package/dist/umd/styles/typography.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
|
|
12
|
+
var _types = require("../types");
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var _TableStyles = require("./TableStyles");
|
|
15
15
|
|
|
16
|
-
var
|
|
16
|
+
var _LoadingIndicator = require("../LoadingIndicator");
|
|
17
17
|
|
|
18
|
-
var
|
|
18
|
+
var _TableHeaders = _interopRequireDefault(require("./TableHeaders"));
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _TableFooter = _interopRequireDefault(require("./TableFooter"));
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var _TableBody = _interopRequireDefault(require("./TableBody"));
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
var _LoadingIndicator = require("../LoadingIndicator");
|
|
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,20 @@ 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
|
-
// States used within the component
|
|
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; // States used within the component
|
|
67
|
+
|
|
62
68
|
var _React$useState = React.useState(10),
|
|
63
69
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
64
70
|
rowsPerPage = _React$useState2[0],
|
|
@@ -103,14 +109,42 @@ var Table = function Table(_ref) {
|
|
|
103
109
|
_React$useState18 = _slicedToArray(_React$useState17, 2),
|
|
104
110
|
total = _React$useState18[0],
|
|
105
111
|
setTotal = _React$useState18[1];
|
|
112
|
+
|
|
113
|
+
var _React$useState19 = React.useState('none'),
|
|
114
|
+
_React$useState20 = _slicedToArray(_React$useState19, 2),
|
|
115
|
+
selectAllState = _React$useState20[0],
|
|
116
|
+
setSelectAllState = _React$useState20[1];
|
|
117
|
+
|
|
118
|
+
var _React$useState21 = React.useState(multiSelect ? [] : undefined),
|
|
119
|
+
_React$useState22 = _slicedToArray(_React$useState21, 2),
|
|
120
|
+
selected = _React$useState22[0],
|
|
121
|
+
setSelected = _React$useState22[1];
|
|
122
|
+
|
|
123
|
+
React.useEffect(function () {
|
|
124
|
+
setSelected(props.selectedRows || (multiSelect ? [] : undefined));
|
|
125
|
+
}, [props.selectedRows, multiSelect]);
|
|
126
|
+
/**
|
|
127
|
+
* update select all checkbox state
|
|
128
|
+
*/
|
|
129
|
+
|
|
130
|
+
React.useEffect(function () {
|
|
131
|
+
if (multiSelect) {
|
|
132
|
+
var currentList = currentPageRows.map(function (row) {
|
|
133
|
+
return keyExpr ? row[keyExpr] : row;
|
|
134
|
+
});
|
|
135
|
+
var count = selected.filter(function (item) {
|
|
136
|
+
return currentList.includes(item);
|
|
137
|
+
}).length;
|
|
138
|
+
setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');
|
|
139
|
+
}
|
|
140
|
+
}, [currentPageRows, multiSelect, selected, keyExpr]);
|
|
106
141
|
/**
|
|
107
142
|
* Takes care of local pagination.
|
|
108
143
|
* Works only in case remote pagination is not defined or is set to false.
|
|
109
144
|
*/
|
|
110
145
|
|
|
111
|
-
|
|
112
146
|
React.useEffect(function () {
|
|
113
|
-
if (!
|
|
147
|
+
if (!remoteOperations) {
|
|
114
148
|
// Let's retrieve temporary filtered rows and update globally filtered rows
|
|
115
149
|
var tmpFilteredRows = filterAndSortRows();
|
|
116
150
|
setFilteredRows(tmpFilteredRows);
|
|
@@ -124,14 +158,14 @@ var Table = function Table(_ref) {
|
|
|
124
158
|
|
|
125
159
|
setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));
|
|
126
160
|
}
|
|
127
|
-
}, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection,
|
|
161
|
+
}, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remoteOperations]);
|
|
128
162
|
/**
|
|
129
163
|
* Takes care of remote pagination.
|
|
130
164
|
* Works only in case remote pagination is set to true.
|
|
131
165
|
*/
|
|
132
166
|
|
|
133
167
|
React.useEffect(function () {
|
|
134
|
-
if (
|
|
168
|
+
if (remoteOperations) {
|
|
135
169
|
setCurrentPageRows(rows); // Let's assign pagination values
|
|
136
170
|
|
|
137
171
|
setFrom(pagination === null || pagination === void 0 ? void 0 : pagination.from);
|
|
@@ -140,7 +174,7 @@ var Table = function Table(_ref) {
|
|
|
140
174
|
setCurrentPage(pagination === null || pagination === void 0 ? void 0 : pagination.currentPage);
|
|
141
175
|
setRowsPerPage(pagination === null || pagination === void 0 ? void 0 : pagination.rowsPerPage);
|
|
142
176
|
}
|
|
143
|
-
}, [
|
|
177
|
+
}, [remoteOperations, pagination, rows]);
|
|
144
178
|
/**
|
|
145
179
|
* Filters out a rows by specific column filters and sorts them if any sorting is set.
|
|
146
180
|
* @returns Filtered and sorted rows.
|
|
@@ -224,8 +258,8 @@ var Table = function Table(_ref) {
|
|
|
224
258
|
setSortedColumn(column.key);
|
|
225
259
|
setSortedDirection('desc'); // Let's trigger remote sorting trigger function
|
|
226
260
|
|
|
227
|
-
if (
|
|
228
|
-
|
|
261
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
262
|
+
onTriggerSortingChange(column.key, 'desc');
|
|
229
263
|
}
|
|
230
264
|
} else {
|
|
231
265
|
tmpColumn.sortingDirection = 'asc'; // Update sorted column and direction
|
|
@@ -233,8 +267,8 @@ var Table = function Table(_ref) {
|
|
|
233
267
|
setSortedColumn(column.key);
|
|
234
268
|
setSortedDirection('asc'); // Let's trigger remote sorting trigger function
|
|
235
269
|
|
|
236
|
-
if (
|
|
237
|
-
|
|
270
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
271
|
+
onTriggerSortingChange(column.key, 'asc');
|
|
238
272
|
}
|
|
239
273
|
}
|
|
240
274
|
} else {
|
|
@@ -244,8 +278,8 @@ var Table = function Table(_ref) {
|
|
|
244
278
|
setSortedColumn(column.key);
|
|
245
279
|
setSortedDirection('asc'); // Let's trigger remote sorting trigger function
|
|
246
280
|
|
|
247
|
-
if (
|
|
248
|
-
|
|
281
|
+
if (remoteOperations && onTriggerSortingChange) {
|
|
282
|
+
onTriggerSortingChange(column.key, 'asc');
|
|
249
283
|
}
|
|
250
284
|
}
|
|
251
285
|
} else if (tmpColumn.sortingDirection !== undefined) {
|
|
@@ -262,10 +296,10 @@ var Table = function Table(_ref) {
|
|
|
262
296
|
|
|
263
297
|
|
|
264
298
|
var previousPage = function previousPage() {
|
|
265
|
-
if (
|
|
299
|
+
if (remoteOperations) {
|
|
266
300
|
// Let's inform parent component about page change
|
|
267
|
-
if (
|
|
268
|
-
|
|
301
|
+
if (onPreviousPageClick) {
|
|
302
|
+
onPreviousPageClick();
|
|
269
303
|
}
|
|
270
304
|
} else {
|
|
271
305
|
// Let's change the page within the component
|
|
@@ -278,10 +312,10 @@ var Table = function Table(_ref) {
|
|
|
278
312
|
|
|
279
313
|
|
|
280
314
|
var nextPage = function nextPage() {
|
|
281
|
-
if (
|
|
315
|
+
if (remoteOperations) {
|
|
282
316
|
// Let's inform parent component about page change
|
|
283
|
-
if (
|
|
284
|
-
|
|
317
|
+
if (onNextPageClick) {
|
|
318
|
+
onNextPageClick();
|
|
285
319
|
}
|
|
286
320
|
} else {
|
|
287
321
|
// Let's change the page within the component
|
|
@@ -296,10 +330,10 @@ var Table = function Table(_ref) {
|
|
|
296
330
|
|
|
297
331
|
var changeRowsPerPage = function changeRowsPerPage(value) {
|
|
298
332
|
// Let's check if we are using remote pagination
|
|
299
|
-
if (
|
|
333
|
+
if (remoteOperations) {
|
|
300
334
|
// Inform parent component about rows per page change
|
|
301
|
-
if (
|
|
302
|
-
|
|
335
|
+
if (onRowsPerPageChange) {
|
|
336
|
+
onRowsPerPageChange(value);
|
|
303
337
|
}
|
|
304
338
|
} else {
|
|
305
339
|
// Let's reset current page to 1
|
|
@@ -307,67 +341,7 @@ var Table = function Table(_ref) {
|
|
|
307
341
|
} // Let's set rows per page
|
|
308
342
|
|
|
309
343
|
|
|
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
|
-
}
|
|
344
|
+
setRowsPerPage(value);
|
|
371
345
|
};
|
|
372
346
|
/**
|
|
373
347
|
* Function which is called when a mouse click happens on a row to pass data to the parent component.
|
|
@@ -378,125 +352,85 @@ var Table = function Table(_ref) {
|
|
|
378
352
|
var onRowClick = function onRowClick(row) {
|
|
379
353
|
var _window, _window$getSelection;
|
|
380
354
|
|
|
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();
|
|
355
|
+
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
356
|
|
|
383
|
-
if ((selectedText === null || selectedText === void 0 ? void 0 : selectedText.length) === 0 &&
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
};
|
|
387
|
-
/**
|
|
388
|
-
* Renders the table body.
|
|
389
|
-
*/
|
|
357
|
+
if ((selectedText === null || selectedText === void 0 ? void 0 : selectedText.length) === 0 && selectable) {
|
|
358
|
+
var value = keyExpr ? row[keyExpr] : row;
|
|
359
|
+
var currentSelection = value;
|
|
390
360
|
|
|
361
|
+
if (!!multiSelect) {
|
|
362
|
+
var existing = selected === null || selected === void 0 ? void 0 : selected.indexOf(value);
|
|
391
363
|
|
|
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")));
|
|
364
|
+
if (existing > -1) {
|
|
365
|
+
currentSelection = _toConsumableArray(selected);
|
|
366
|
+
currentSelection.splice(existing, 1);
|
|
367
|
+
} else {
|
|
368
|
+
currentSelection = [].concat(_toConsumableArray(selected), [currentSelection]);
|
|
369
|
+
}
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
setSelected(currentSelection);
|
|
373
|
+
props.onSelectionChange && props.onSelectionChange(currentSelection);
|
|
374
|
+
}
|
|
439
375
|
};
|
|
440
376
|
/**
|
|
441
|
-
*
|
|
377
|
+
* Function which is called when user clicks checkbox to select or deselect all rows.
|
|
442
378
|
*/
|
|
443
379
|
|
|
444
380
|
|
|
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
|
-
})))))));
|
|
381
|
+
var onSelectAllClick = function onSelectAllClick() {
|
|
382
|
+
var currentList = currentPageRows.map(function (row) {
|
|
383
|
+
return keyExpr ? row[keyExpr] : row;
|
|
384
|
+
});
|
|
385
|
+
|
|
386
|
+
switch (selectAllState) {
|
|
387
|
+
case 'all':
|
|
388
|
+
setSelected(_toConsumableArray(selected).filter(function (item) {
|
|
389
|
+
return !currentList.includes(item);
|
|
390
|
+
}));
|
|
391
|
+
setSelectAllState('none');
|
|
392
|
+
break;
|
|
393
|
+
|
|
394
|
+
case 'none':
|
|
395
|
+
setSelected([].concat(_toConsumableArray(selected), _toConsumableArray(currentList)));
|
|
396
|
+
setSelectAllState('all');
|
|
397
|
+
break;
|
|
398
|
+
|
|
399
|
+
case 'some':
|
|
400
|
+
setSelected([].concat(_toConsumableArray(selected), _toConsumableArray(currentList.filter(function (item) {
|
|
401
|
+
return !selected.includes(item);
|
|
402
|
+
}))));
|
|
403
|
+
setSelectAllState('all');
|
|
404
|
+
break;
|
|
405
|
+
}
|
|
489
406
|
};
|
|
490
407
|
/**
|
|
491
408
|
* Return Table component.
|
|
492
409
|
*/
|
|
493
410
|
|
|
494
411
|
|
|
495
|
-
return /*#__PURE__*/React.createElement(_TableStyles.TableWrapper, null, /*#__PURE__*/React.createElement(_TableStyles.
|
|
412
|
+
return /*#__PURE__*/React.createElement(_TableStyles.TableWrapper, null, /*#__PURE__*/React.createElement(_TableStyles.StyledTable, {
|
|
496
413
|
cellPadding: "0",
|
|
497
414
|
cellSpacing: "0",
|
|
498
|
-
"data-testid": "TestTable"
|
|
499
|
-
|
|
415
|
+
"data-testid": "TestTable",
|
|
416
|
+
className: 'table'
|
|
417
|
+
}, /*#__PURE__*/React.createElement(_TableHeaders.default, _extends({}, props, {
|
|
418
|
+
sortByColumn: sortTableColumn,
|
|
419
|
+
onSelectAllClick: onSelectAllClick,
|
|
420
|
+
selectAllState: selectAllState
|
|
421
|
+
})), /*#__PURE__*/React.createElement(_TableBody.default, _extends({}, props, {
|
|
422
|
+
currentPageRows: currentPageRows,
|
|
423
|
+
selected: selected,
|
|
424
|
+
onRowClick: onRowClick
|
|
425
|
+
})), /*#__PURE__*/React.createElement(_TableFooter.default, _extends({}, props, {
|
|
426
|
+
onRowsPerPageChange: changeRowsPerPage,
|
|
427
|
+
rowsPerPage: rowsPerPage,
|
|
428
|
+
from: from,
|
|
429
|
+
to: to,
|
|
430
|
+
total: total,
|
|
431
|
+
nextPage: nextPage,
|
|
432
|
+
prevPage: previousPage
|
|
433
|
+
}))), showLoadingIndicator && /*#__PURE__*/React.createElement(_TableStyles.StyledTableSpinner, null, /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
|
|
500
434
|
size: _types.Size.Medium,
|
|
501
435
|
color: "#ffffff"
|
|
502
436
|
})));
|
|
@@ -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","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","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,GAaID,KAbJ,CACEC,mBADF;AAAA,MAEEC,eAFF,GAaIF,KAbJ,CAEEE,eAFF;AAAA,MAGEC,mBAHF,GAaIH,KAbJ,CAGEG,mBAHF;AAAA,MAIEC,sBAJF,GAaIJ,KAbJ,CAIEI,sBAJF;AAAA,MAKEC,OALF,GAaIL,KAbJ,CAKEK,OALF;AAAA,MAMEC,IANF,GAaIN,KAbJ,CAMEM,IANF;AAAA,MAOEC,gBAPF,GAaIP,KAbJ,CAOEO,gBAPF;AAAA,MAQEC,UARF,GAaIR,KAbJ,CAQEQ,UARF;AAAA,MASEC,oBATF,GAaIT,KAbJ,CASES,oBATF;AAAA,MAUEC,UAVF,GAaIV,KAbJ,CAUEU,UAVF;AAAA,MAWEC,WAXF,GAaIX,KAbJ,CAWEW,WAXF;AAAA,MAYEC,OAZF,GAaIZ,KAbJ,CAYEY,OAZF,CADwE,CAgBxE;;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,0BAA4CnB,KAAK,CAACC,QAAN,CAAwC,MAAxC,CAA5C;AAAA;AAAA,MAAOmB,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,0BAAgCrB,KAAK,CAACC,QAAN,CAA4BH,WAAW,GAAG,EAAH,GAAQwB,SAA/C,CAAhC;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,WAAjB;;AAEAxB,EAAAA,KAAK,CAACyB,SAAN,CAAgB,YAAM;AACpBD,IAAAA,WAAW,CAACrC,KAAK,CAACuC,YAAN,KAAuB5B,WAAW,GAAG,EAAH,GAAQwB,SAA1C,CAAD,CAAX;AACD,GAFD,EAEG,CAACnC,KAAK,CAACuC,YAAP,EAAqB5B,WAArB,CAFH;AAIA;AACF;AACA;;AACEE,EAAAA,KAAK,CAACyB,SAAN,CAAgB,YAAM;AACpB,QAAI3B,WAAJ,EAAiB;AACf,UAAM6B,WAAW,GAAGrB,eAAe,CAACsB,GAAhB,CAAoB,UAAAC,GAAG;AAAA,eAAI9B,OAAO,GAAG8B,GAAG,CAAC9B,OAAD,CAAN,GAAkB8B,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,CAACxB,eAAD,EAAkBR,WAAlB,EAA+ByB,QAA/B,EAAyCxB,OAAzC,CAPH;AAUA;AACF;AACA;AACA;;AACEC,EAAAA,KAAK,CAACyB,SAAN,CAAgB,YAAM;AACpB,QAAI,CAAC/B,gBAAL,EAAuB;AACrB;AACA,UAAMyC,eAAe,GAAGC,iBAAiB,EAAzC;AACA/B,MAAAA,eAAe,CAAC8B,eAAD,CAAf;AACAhB,MAAAA,QAAQ,CAACgB,eAAe,CAACD,MAAjB,CAAR,CAJqB,CAMrB;;AACA,UAAMG,QAAQ,GAAG,CAAC7B,WAAW,GAAG,CAAf,IAAoBN,WAArC;AACA,UAAMoC,MAAM,GAAGD,QAAQ,GAAGnC,WAAX,IAA0BiC,eAAe,CAACD,MAA1C,GAAmDC,eAAe,CAACD,MAAnE,GAA4EG,QAAQ,GAAGnC,WAAtG,CARqB,CAUrB;;AACAa,MAAAA,OAAO,CAACsB,QAAQ,GAAG,CAAZ,CAAP;AACApB,MAAAA,KAAK,CAACqB,MAAD,CAAL,CAZqB,CAcrB;;AACA/B,MAAAA,kBAAkB,CAAC4B,eAAe,CAACI,KAAhB,CAAsBF,QAAtB,EAAgCC,MAAhC,CAAD,CAAlB;AACD;AACF,GAlBD,EAkBG,CAACpC,WAAD,EAAcT,IAAd,EAAoBe,WAApB,EAAiChB,OAAjC,EAA0CkB,YAA1C,EAAwDE,eAAxD,EAAyElB,gBAAzE,CAlBH;AAoBA;AACF;AACA;AACA;;AACEM,EAAAA,KAAK,CAACyB,SAAN,CAAgB,YAAM;AACpB,QAAI/B,gBAAJ,EAAsB;AACpBa,MAAAA,kBAAkB,CAACd,IAAD,CAAlB,CADoB,CAGpB;;AACAsB,MAAAA,OAAO,CAACpB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEmB,IAAb,CAAP;AACAG,MAAAA,KAAK,CAACtB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEqB,EAAb,CAAL;AACAG,MAAAA,QAAQ,CAACxB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEuB,KAAb,CAAR;AACAT,MAAAA,cAAc,CAACd,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEa,WAAb,CAAd;AACAL,MAAAA,cAAc,CAACR,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEO,WAAb,CAAd;AACD;AACF,GAXD,EAWG,CAACR,gBAAD,EAAmBC,UAAnB,EAA+BF,IAA/B,CAXH;AAaA;AACF;AACA;AACA;;AACE,MAAM2C,iBAAiB,GAAG,SAApBA,iBAAoB,GAAa;AACrC,QAAID,eAAe,GAAG1C,IAAI,CAACsC,MAAL,CAAY,UAACF,GAAD,EAAS;AACzC;AACA,UAAIW,mBAAmB,GAAG,IAA1B,CAFyC,CAIzC;;AAJyC,iDAKpBhD,OALoB;AAAA;;AAAA;AAKzC,4DAA8B;AAAA,cAAnBiD,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,QAAIrC,OAAO,CAACsD,IAAR,CAAa,UAACL,MAAD;AAAA,aAAYA,MAAM,CAACM,gBAAnB;AAAA,KAAb,CAAJ,EAAuD;AACrD;AACA,UAAMC,aAAa,GAAGxD,OAAO,CAACyD,IAAR,CAAa,UAACR,MAAD;AAAA,eAAYA,MAAM,CAACM,gBAAnB;AAAA,OAAb,CAAtB,CAFqD,CAIrD;;AACAlC,MAAAA,kBAAkB,CAACmC,aAAa,CAACD,gBAAf,CAAlB;AACApC,MAAAA,eAAe,CAACqC,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;AACAjD,IAAAA,OAAO,GAAGA,OAAO,CAACoC,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;;AACApC,YAAAA,eAAe,CAAC8B,MAAM,CAACE,GAAR,CAAf;AACA9B,YAAAA,kBAAkB,CAAC,MAAD,CAAlB,CALwC,CAOxC;;AACA,gBAAInB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,cAAAA,sBAAsB,CAACkD,MAAM,CAACE,GAAR,EAAa,MAAb,CAAtB;AACD;AACF,WAXD,MAWO;AACLW,YAAAA,SAAS,CAACP,gBAAV,GAA6B,KAA7B,CADK,CAGL;;AACApC,YAAAA,eAAe,CAAC8B,MAAM,CAACE,GAAR,CAAf;AACA9B,YAAAA,kBAAkB,CAAC,KAAD,CAAlB,CALK,CAOL;;AACA,gBAAInB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,cAAAA,sBAAsB,CAACkD,MAAM,CAACE,GAAR,EAAa,KAAb,CAAtB;AACD;AACF;AACF,SAxBD,MAwBO;AACL;AACAW,UAAAA,SAAS,CAACP,gBAAV,GAA6B,KAA7B,CAFK,CAIL;;AACApC,UAAAA,eAAe,CAAC8B,MAAM,CAACE,GAAR,CAAf;AACA9B,UAAAA,kBAAkB,CAAC,KAAD,CAAlB,CANK,CAQL;;AACA,cAAInB,gBAAgB,IAAIH,sBAAxB,EAAgD;AAC9CA,YAAAA,sBAAsB,CAACkD,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,QAAI9D,gBAAJ,EAAsB;AACpB;AACA,UAAIN,mBAAJ,EAAyB;AACvBA,QAAAA,mBAAmB;AACpB;AACF,KALD,MAKO;AACL;AACAqB,MAAAA,cAAc,CAACD,WAAW,GAAG,CAAd,GAAkBA,WAAW,GAAG,CAAhC,GAAoC,CAArC,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;;;AACE,MAAMiD,QAAQ,GAAG,SAAXA,QAAW,GAAM;AACrB,QAAI/D,gBAAJ,EAAsB;AACpB;AACA,UAAIL,eAAJ,EAAqB;AACnBA,QAAAA,eAAe;AAChB;AACF,KALD,MAKO;AACL;AACAoB,MAAAA,cAAc,CAACD,WAAW,GAAGN,WAAd,IAA6BE,YAAY,CAAC8B,MAA1C,GAAmD1B,WAAnD,GAAiEA,WAAW,GAAG,CAAhF,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;AACA;;;AACE,MAAMkD,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,KAAD,EAAmB;AAC3C;AACA,QAAIjE,gBAAJ,EAAsB;AACpB;AACA,UAAIJ,mBAAJ,EAAyB;AACvBA,QAAAA,mBAAmB,CAACqE,KAAD,CAAnB;AACD;AACF,KALD,MAKO;AACL;AACAlD,MAAAA,cAAc,CAAC,CAAD,CAAd;AACD,KAV0C,CAY3C;;;AACAN,IAAAA,cAAc,CAACwD,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,IAA8BrC,UAAlC,EAA8C;AAC5C,UAAM8D,KAAK,GAAG5D,OAAO,GAAG8B,GAAG,CAAC9B,OAAD,CAAN,GAAkB8B,GAAvC;AACA,UAAIoC,gBAAgB,GAAGN,KAAvB;;AACA,UAAI,CAAC,CAAC7D,WAAN,EAAmB;AACjB,YAAMoE,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;AACA9E,MAAAA,KAAK,CAACiF,iBAAN,IAA2BjF,KAAK,CAACiF,iBAAN,CAAwBH,gBAAxB,CAA3B;AACD;AACF,GAnBD;AAqBA;AACF;AACA;;;AACE,MAAMI,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AAC7B,QAAM1C,WAAW,GAAGrB,eAAe,CAACsB,GAAhB,CAAoB,UAAAC,GAAG;AAAA,aAAI9B,OAAO,GAAG8B,GAAG,CAAC9B,OAAD,CAAN,GAAkB8B,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,eAAiBlC,KAAjB;AACa,IAAA,YAAY,EAAEkE,eAD3B;AAEa,IAAA,gBAAgB,EAAEgB,gBAF/B;AAGa,IAAA,cAAc,EAAEjD;AAH7B,KADF,eAKE,oBAAC,kBAAD,eAAejC,KAAf;AACW,IAAA,eAAe,EAAEmB,eAD5B;AAEW,IAAA,QAAQ,EAAEiB,QAFrB;AAGW,IAAA,UAAU,EAAEqC;AAHvB,KALF,eASE,oBAAC,oBAAD,eAAiBzE,KAAjB;AACa,IAAA,mBAAmB,EAAEuE,iBADlC;AAEa,IAAA,WAAW,EAAExD,WAF1B;AAGa,IAAA,IAAI,EAAEY,IAHnB;AAIa,IAAA,EAAE,EAAEE,EAJjB;AAKa,IAAA,KAAK,EAAEE,KALpB;AAMa,IAAA,QAAQ,EAAEuC,QANvB;AAOa,IAAA,QAAQ,EAAED;AAPvB,KATF,CADF,EAmBG5D,oBAAoB,iBACnB,oBAAC,+BAAD,qBACE,oBAAC,kCAAD;AAAkB,IAAA,IAAI,EAAE0E,YAAKC,MAA7B;AAAqC,IAAA,KAAK,EAAC;AAA3C,IADF,CApBJ,CADF;AA2BD,CAtUD;;eAwUerF,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 } = 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 [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 * 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 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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { TableProps } from './TableTypes';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
interface TableBodyProps extends TableProps {
|
|
4
|
+
currentPageRows: any[];
|
|
5
|
+
onRowClick?: (row: any) => void;
|
|
6
|
+
selected?: any | any[];
|
|
7
|
+
}
|
|
8
|
+
declare const TableBody: React.FC<TableBodyProps>;
|
|
9
|
+
export default TableBody;
|