@synerise/ds-table 0.60.2 → 0.60.4
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/CHANGELOG.md +16 -0
- package/dist/Cell/Action/ActionCell.js +5 -11
- package/dist/Cell/Action/ActionCell.styles.js +2 -1
- package/dist/Cell/AvatarLabel/AvatarLabel.js +10 -18
- package/dist/Cell/Copyable/Copyable.styles.js +2 -1
- package/dist/Cell/Copyable/CopyableCell.js +6 -12
- package/dist/Cell/Editable/EditableCell.js +7 -14
- package/dist/Cell/FlagLabel/FlagLabelCell.js +2 -7
- package/dist/Cell/FlagLabel/FlagLabelCell.styles.js +2 -1
- package/dist/Cell/IconLabel/IconLabel.js +2 -7
- package/dist/Cell/IconLabel/IconLabel.styles.js +2 -1
- package/dist/Cell/IconTooltipCell/IconTooltipCell.js +7 -13
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.js +8 -14
- package/dist/Cell/LabelsWithShowMore/Modal/Modal.js +8 -12
- package/dist/Cell/Star/StarCell.d.ts +4 -3
- package/dist/Cell/Star/StarCell.js +5 -10
- package/dist/Cell/StatusLabel/StatusLabel.js +3 -8
- package/dist/Cell/TagIcon/TagIcon.js +1 -6
- package/dist/Cell/TagIcon/TagIcon.styles.js +2 -1
- package/dist/ColumnSortMenu/SortIcons.js +3 -15
- package/dist/ColumnSortMenu/SortRenderer.d.ts +2 -2
- package/dist/ColumnSortMenu/SortRenderer.js +40 -38
- package/dist/ColumnSortMenu/TitleWithSort.js +3 -7
- package/dist/ColumnSortMenu/columnWithSortButtons.js +0 -10
- package/dist/ColumnSortMenu/groupedColumnsSort.js +2 -15
- package/dist/ColumnSortMenu/replaceSortButtons.js +0 -7
- package/dist/ColumnSortMenu/useSortState.js +4 -40
- package/dist/DefaultTable/DefaultTable.js +26 -50
- package/dist/FilterTrigger/FilterTrigger.js +16 -20
- package/dist/GroupTable/GroupTable.js +24 -40
- package/dist/GroupTable/GroupTable.styles.js +2 -2
- package/dist/GroupTable/GroupTableBody/GroupTableBody.js +12 -17
- package/dist/GroupTable/GroupTableHeader/GroupTableHeader.js +6 -7
- package/dist/InfiniteScroll/BackToTopButton.js +0 -1
- package/dist/InfiniteScroll/InfiniteLoaderItem.js +9 -12
- package/dist/InfiniteScroll/OuterListElement.js +7 -25
- package/dist/InfiniteScroll/utils.js +2 -2
- package/dist/ItemsMenu/ItemsMenu.js +0 -2
- package/dist/ItemsMenu/ItemsMenu.styles.js +2 -1
- package/dist/RowSelection/RowSelectionColumn.js +12 -22
- package/dist/Table.js +26 -40
- package/dist/TableHeader/TableHeader.js +21 -28
- package/dist/TableHeader/TableLimit/TableLimit.js +4 -7
- package/dist/TableHeader/TableSelection.d.ts +6 -5
- package/dist/TableHeader/TableSelection.js +53 -68
- package/dist/TreeTable/TreeTable.js +9 -11
- package/dist/TreeTable/TreeTable.styles.js +0 -2
- package/dist/VirtualTable/VirtualTable.js +101 -178
- package/dist/VirtualTable/VirtualTable.styles.js +0 -3
- package/dist/VirtualTable/VirtualTableRow.js +10 -26
- package/dist/constants/TableSkeleton.constants.js +0 -1
- package/dist/hooks/useRowKey/useRowKey.js +3 -1
- package/dist/hooks/useRowStar/useRowStar.js +6 -12
- package/dist/utils/calculateColumnWidths.js +0 -5
- package/dist/utils/calculatePixels.js +4 -10
- package/dist/utils/getRecordSelectionStatus.js +2 -3
- package/dist/utils/getSkeletonProps.js +7 -15
- package/dist/utils/getValueFromPath.js +2 -1
- package/dist/utils/isRecordSelectable.js +2 -4
- package/dist/utils/locale.js +0 -5
- package/package.json +23 -23
|
@@ -1,19 +1,11 @@
|
|
|
1
1
|
var _excluded = ["rows"];
|
|
2
|
-
|
|
3
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
4
|
-
|
|
5
3
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
6
|
-
|
|
7
4
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
8
|
-
|
|
9
5
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
10
|
-
|
|
11
6
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
12
|
-
|
|
13
7
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
14
|
-
|
|
15
8
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
16
|
-
|
|
17
9
|
import React from 'react';
|
|
18
10
|
import { flow } from 'lodash';
|
|
19
11
|
import Table from 'antd/lib/table';
|
|
@@ -22,7 +14,6 @@ import { columnWithSortButtons } from '../ColumnSortMenu/columnWithSortButtons';
|
|
|
22
14
|
import GroupTableBody from './GroupTableBody/GroupTableBody';
|
|
23
15
|
import "../style/index.css";
|
|
24
16
|
import { getColumnsWithActiveSorting, sortDataSourceRows } from '../ColumnSortMenu/groupedColumnsSort';
|
|
25
|
-
|
|
26
17
|
var addActiveColumnClass = function addActiveColumnClass(activeColumn) {
|
|
27
18
|
return function (column) {
|
|
28
19
|
return column.key === activeColumn ? _objectSpread({}, column, {
|
|
@@ -34,13 +25,11 @@ var addActiveColumnClass = function addActiveColumnClass(activeColumn) {
|
|
|
34
25
|
}) : column;
|
|
35
26
|
};
|
|
36
27
|
};
|
|
37
|
-
|
|
38
28
|
var clearDefaultColumnSortOrder = function clearDefaultColumnSortOrder(column) {
|
|
39
29
|
return _objectSpread({}, column, {
|
|
40
30
|
sortOrder: null
|
|
41
31
|
});
|
|
42
32
|
};
|
|
43
|
-
|
|
44
33
|
var addSortClassByState = function addSortClassByState(sortStateApi) {
|
|
45
34
|
return function (column) {
|
|
46
35
|
return sortStateApi.getColumnSortOrder(String(column.key)) ? _objectSpread({}, column, {
|
|
@@ -51,33 +40,29 @@ var addSortClassByState = function addSortClassByState(sortStateApi) {
|
|
|
51
40
|
}
|
|
52
41
|
}) : column;
|
|
53
42
|
};
|
|
54
|
-
};
|
|
55
|
-
|
|
43
|
+
};
|
|
56
44
|
|
|
45
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
57
46
|
function GroupTable(props) {
|
|
58
47
|
var selection = props.selection,
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
48
|
+
rowKey = props.rowKey,
|
|
49
|
+
dataSource = props.dataSource,
|
|
50
|
+
columns = props.columns,
|
|
51
|
+
cellSize = props.cellSize,
|
|
52
|
+
roundedHeader = props.roundedHeader,
|
|
53
|
+
addItem = props.addItem,
|
|
54
|
+
hideGroupExpander = props.hideGroupExpander,
|
|
55
|
+
initialGroupsCollapsed = props.initialGroupsCollapsed,
|
|
56
|
+
onSort = props.onSort;
|
|
69
57
|
var _React$useState = React.useState(initialGroupsCollapsed || !dataSource ? [] : dataSource.map(function (group) {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
58
|
+
return group.key;
|
|
59
|
+
})),
|
|
60
|
+
expandedGroups = _React$useState[0],
|
|
61
|
+
setExpandedGroups = _React$useState[1];
|
|
75
62
|
var sortStateApi = useSortState(columnsToSortState(columns), onSort);
|
|
76
|
-
|
|
77
63
|
var _React$useState2 = React.useState(dataSource || []),
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
64
|
+
data = _React$useState2[0],
|
|
65
|
+
setData = _React$useState2[1];
|
|
81
66
|
React.useEffect(function () {
|
|
82
67
|
setData(dataSource || []);
|
|
83
68
|
setExpandedGroups(initialGroupsCollapsed || !dataSource ? [] : dataSource.map(function (group) {
|
|
@@ -109,14 +94,11 @@ function GroupTable(props) {
|
|
|
109
94
|
var active = data.find(function (row) {
|
|
110
95
|
return row.key === key;
|
|
111
96
|
});
|
|
112
|
-
|
|
113
97
|
if (active) {
|
|
114
98
|
var rows = active.rows,
|
|
115
|
-
|
|
116
|
-
|
|
99
|
+
activeGroup = _objectWithoutPropertiesLoose(active, _excluded);
|
|
117
100
|
return activeGroup;
|
|
118
101
|
}
|
|
119
|
-
|
|
120
102
|
return undefined;
|
|
121
103
|
}, [data]);
|
|
122
104
|
var groupTableColumnDecorator = flow(addActiveColumnClass(activeColumn), addSortClassByState(sortStateApi), clearDefaultColumnSortOrder);
|
|
@@ -127,7 +109,8 @@ function GroupTable(props) {
|
|
|
127
109
|
return /*#__PURE__*/React.createElement("div", {
|
|
128
110
|
className: "ds-table ds-table-cell-size-" + cellSize + " " + (roundedHeader ? 'ds-table-rounded' : '')
|
|
129
111
|
}, /*#__PURE__*/React.createElement(Table, _extends({}, props, {
|
|
130
|
-
dataSource: sortedRowsData
|
|
112
|
+
dataSource: sortedRowsData
|
|
113
|
+
// @ts-ignore: FIXME: antd table columns type is not compatible with DS
|
|
131
114
|
,
|
|
132
115
|
columns: decoratedColumns,
|
|
133
116
|
components: {
|
|
@@ -141,7 +124,8 @@ function GroupTable(props) {
|
|
|
141
124
|
rowKey: rowKey,
|
|
142
125
|
allItems: allItems,
|
|
143
126
|
expanded: expandedGroups.indexOf(record['data-row-key']) >= 0,
|
|
144
|
-
expandGroup: toggleExpand
|
|
127
|
+
expandGroup: toggleExpand
|
|
128
|
+
// @ts-ignore: FIXME: Type 'DSColumnType<T>[]' is not assignable to type 'GroupColumnsType<T>[]'.
|
|
145
129
|
,
|
|
146
130
|
columns: columnsWithCustomSorting,
|
|
147
131
|
addItem: addItem,
|
|
@@ -150,12 +134,12 @@ function GroupTable(props) {
|
|
|
150
134
|
});
|
|
151
135
|
}
|
|
152
136
|
}
|
|
153
|
-
}
|
|
137
|
+
}
|
|
138
|
+
// @ts-ignore
|
|
154
139
|
,
|
|
155
140
|
rowSelection: selection && _objectSpread({}, selection, {
|
|
156
141
|
columnWidth: 64
|
|
157
142
|
})
|
|
158
143
|
})));
|
|
159
144
|
}
|
|
160
|
-
|
|
161
145
|
export default GroupTable;
|
|
@@ -46,8 +46,8 @@ export var SubRow = styled.td.withConfig({
|
|
|
46
46
|
return theme.palette['grey-050'];
|
|
47
47
|
}, function (_ref2) {
|
|
48
48
|
var theme = _ref2.theme,
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
selected = _ref2.selected,
|
|
50
|
+
sorted = _ref2.sorted;
|
|
51
51
|
if (selected) return theme.palette['yellow-050'] + ";";
|
|
52
52
|
if (sorted) return theme.palette['blue-050'] + ";";
|
|
53
53
|
return "";
|
|
@@ -6,22 +6,19 @@ import Icon, { AddS } from '@synerise/ds-icon';
|
|
|
6
6
|
import { GROUP_BY } from '@synerise/ds-column-manager/dist/ColumnManagerGroupSettings/ColumnManagerGroupSettings.types';
|
|
7
7
|
import * as S from '../GroupTable.styles';
|
|
8
8
|
import { useRowKey } from '../../hooks/useRowKey';
|
|
9
|
-
|
|
10
9
|
function GroupTableBody(_ref) {
|
|
11
10
|
var group = _ref.group,
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
11
|
+
columns = _ref.columns,
|
|
12
|
+
rowKey = _ref.rowKey,
|
|
13
|
+
selection = _ref.selection,
|
|
14
|
+
allItems = _ref.allItems,
|
|
15
|
+
expanded = _ref.expanded,
|
|
16
|
+
expandGroup = _ref.expandGroup,
|
|
17
|
+
addItem = _ref.addItem,
|
|
18
|
+
activeGroup = _ref.activeGroup,
|
|
19
|
+
hideGroupExpander = _ref.hideGroupExpander;
|
|
22
20
|
var _useRowKey = useRowKey(rowKey),
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
getRowKey = _useRowKey.getRowKey;
|
|
25
22
|
var allRowKeys = React.useMemo(function () {
|
|
26
23
|
return group.children.length ? group.children[0].props.record.rows.map(function (row) {
|
|
27
24
|
return getRowKey(row);
|
|
@@ -29,7 +26,6 @@ function GroupTableBody(_ref) {
|
|
|
29
26
|
}, [group, getRowKey]);
|
|
30
27
|
var selectedRowsNumber = React.useMemo(function () {
|
|
31
28
|
var _selection$selectedRo;
|
|
32
|
-
|
|
33
29
|
return (selection == null || (_selection$selectedRo = selection.selectedRowKeys) == null ? void 0 : _selection$selectedRo.filter(function (key) {
|
|
34
30
|
return allRowKeys.includes(key);
|
|
35
31
|
}).length) || 0;
|
|
@@ -65,7 +61,6 @@ function GroupTableBody(_ref) {
|
|
|
65
61
|
var _selectedKeys = selection == null ? void 0 : selection.selectedRowKeys.filter(function (selected) {
|
|
66
62
|
return allRowKeys.indexOf(selected) < 0;
|
|
67
63
|
});
|
|
68
|
-
|
|
69
64
|
selection.onChange(_selectedKeys, allItems.filter(function (item) {
|
|
70
65
|
var key = getRowKey(item);
|
|
71
66
|
return key && (_selectedKeys == null ? void 0 : _selectedKeys.indexOf(key)) < 0;
|
|
@@ -85,7 +80,8 @@ function GroupTableBody(_ref) {
|
|
|
85
80
|
}
|
|
86
81
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
87
82
|
component: /*#__PURE__*/React.createElement(AddS, null)
|
|
88
|
-
}), "Add item"), groupExpander)))), expanded && group.children[0].props.record.rows.map(
|
|
83
|
+
}), "Add item"), groupExpander)))), expanded && group.children[0].props.record.rows.map(
|
|
84
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
89
85
|
function (rowRecord) {
|
|
90
86
|
var key = getRowKey(rowRecord);
|
|
91
87
|
return /*#__PURE__*/React.createElement("tr", {
|
|
@@ -114,5 +110,4 @@ function GroupTableBody(_ref) {
|
|
|
114
110
|
}));
|
|
115
111
|
}));
|
|
116
112
|
}
|
|
117
|
-
|
|
118
113
|
export default GroupTableBody;
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
2
|
function GroupTableHeader(_ref) {
|
|
4
3
|
var header = _ref.header,
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var clickHandle = React.useCallback(
|
|
4
|
+
activeColumnKey = _ref.activeColumnKey,
|
|
5
|
+
sortColumn = _ref.sortColumn;
|
|
6
|
+
var clickHandle = React.useCallback(
|
|
7
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8
8
|
function (child) {
|
|
9
9
|
if (child.props.column.sorter) {
|
|
10
10
|
sortColumn(child);
|
|
11
11
|
}
|
|
12
12
|
}, [sortColumn]);
|
|
13
|
-
return /*#__PURE__*/React.createElement("tr", null, header.children.map(
|
|
13
|
+
return /*#__PURE__*/React.createElement("tr", null, header.children.map(
|
|
14
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14
15
|
function (child) {
|
|
15
16
|
var _child$props$addition;
|
|
16
|
-
|
|
17
17
|
var isColumnActive = activeColumnKey === child.key;
|
|
18
18
|
return /*#__PURE__*/React.createElement("th", {
|
|
19
19
|
key: child.key,
|
|
@@ -27,5 +27,4 @@ function GroupTableHeader(_ref) {
|
|
|
27
27
|
}, child.props.children);
|
|
28
28
|
}));
|
|
29
29
|
}
|
|
30
|
-
|
|
31
30
|
export default GroupTableHeader;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
2
|
-
|
|
3
2
|
import React from 'react';
|
|
4
3
|
import Icon, { ArrowUpCircleM } from '@synerise/ds-icon';
|
|
5
4
|
import * as S from './BackToTopButton.styles';
|
|
@@ -3,21 +3,21 @@ import { infiniteScrollPropsToState } from './utils';
|
|
|
3
3
|
import { ErrorItem } from './ErrorItem';
|
|
4
4
|
import { LoadingItem } from './LoadingItem';
|
|
5
5
|
import { NoMoreItem } from './NoMoreItem';
|
|
6
|
-
|
|
7
6
|
var InfiniteLoaderItem = function InfiniteLoaderItem(_ref) {
|
|
8
7
|
var infiniteScroll = _ref.infiniteScroll,
|
|
9
|
-
|
|
8
|
+
position = _ref.position;
|
|
10
9
|
var hasMore = infiniteScroll.hasMore,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
10
|
+
isLoading = infiniteScroll.isLoading,
|
|
11
|
+
onScrollEndReach = infiniteScroll.onScrollEndReach,
|
|
12
|
+
hasError = infiniteScroll.hasError,
|
|
13
|
+
onRetryButtonClick = infiniteScroll.onRetryButtonClick,
|
|
14
|
+
render = infiniteScroll.render;
|
|
16
15
|
var handleRetryClick = onRetryButtonClick ? function () {
|
|
17
16
|
onRetryButtonClick(position);
|
|
18
|
-
} : undefined;
|
|
19
|
-
// eslint-disable-next-line consistent-return
|
|
17
|
+
} : undefined;
|
|
20
18
|
|
|
19
|
+
// @ts-expect-error TS7030: Not all code paths return a value
|
|
20
|
+
// eslint-disable-next-line consistent-return
|
|
21
21
|
useEffect(function () {
|
|
22
22
|
if (!isLoading && hasMore) {
|
|
23
23
|
if ((!position || position === 'BOTTOM') && typeof onScrollEndReach === 'function') {
|
|
@@ -28,14 +28,11 @@ var InfiniteLoaderItem = function InfiniteLoaderItem(_ref) {
|
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
}, [hasMore, isLoading, onScrollEndReach, position]);
|
|
31
|
-
|
|
32
31
|
if (typeof render === 'function') {
|
|
33
32
|
return render(infiniteScrollPropsToState(infiniteScroll));
|
|
34
33
|
}
|
|
35
|
-
|
|
36
34
|
return /*#__PURE__*/React.createElement(React.Fragment, null, isLoading && /*#__PURE__*/React.createElement(LoadingItem, null), !isLoading && !hasMore && /*#__PURE__*/React.createElement(NoMoreItem, null), !isLoading && hasError && /*#__PURE__*/React.createElement(ErrorItem, {
|
|
37
35
|
onRetryClick: handleRetryClick
|
|
38
36
|
}));
|
|
39
37
|
};
|
|
40
|
-
|
|
41
38
|
export default InfiniteLoaderItem;
|
|
@@ -1,31 +1,21 @@
|
|
|
1
1
|
var _excluded = ["height"];
|
|
2
|
-
|
|
3
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
-
|
|
7
4
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
-
|
|
9
5
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
10
|
-
|
|
11
6
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
12
|
-
|
|
13
7
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
14
|
-
|
|
15
8
|
import React, { useCallback, useState, forwardRef, useEffect } from 'react';
|
|
16
9
|
import Scrollbar from '@synerise/ds-scrollbar';
|
|
17
|
-
|
|
18
10
|
var OuterListElement = function OuterListElement(containerRef, isSticky) {
|
|
19
11
|
return forwardRef(function (_ref, ref) {
|
|
20
12
|
var onWheel = _ref.onWheel,
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
13
|
+
onScroll = _ref.onScroll,
|
|
14
|
+
children = _ref.children,
|
|
15
|
+
style = _ref.style;
|
|
25
16
|
var _useState = useState(null),
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
17
|
+
header = _useState[0],
|
|
18
|
+
setHeader = _useState[1];
|
|
29
19
|
useEffect(function () {
|
|
30
20
|
if (containerRef != null && containerRef.current) {
|
|
31
21
|
var headerElement = containerRef.current.querySelector('.ant-table-header');
|
|
@@ -38,28 +28,22 @@ var OuterListElement = function OuterListElement(containerRef, isSticky) {
|
|
|
38
28
|
left: event.currentTarget.scrollLeft
|
|
39
29
|
});
|
|
40
30
|
}
|
|
41
|
-
|
|
42
31
|
onScroll && onScroll(event);
|
|
43
32
|
}, [onScroll, header]);
|
|
44
|
-
|
|
45
33
|
var onWheelHandler = function onWheelHandler(event) {
|
|
46
34
|
if (header) {
|
|
47
35
|
var _event$currentTarget;
|
|
48
|
-
|
|
49
36
|
header.scrollTo({
|
|
50
37
|
left: (_event$currentTarget = event.currentTarget) == null || (_event$currentTarget = _event$currentTarget.parentElement) == null ? void 0 : _event$currentTarget.scrollLeft
|
|
51
38
|
});
|
|
52
39
|
}
|
|
53
|
-
|
|
54
40
|
onWheel && onWheel(event);
|
|
55
41
|
};
|
|
56
|
-
|
|
57
42
|
if (isSticky) {
|
|
58
43
|
// uses native browser scroll
|
|
59
44
|
var _ref2 = style || {},
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
45
|
+
height = _ref2.height,
|
|
46
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
63
47
|
return /*#__PURE__*/React.createElement("div", {
|
|
64
48
|
ref: ref,
|
|
65
49
|
onWheel: onWheelHandler,
|
|
@@ -69,7 +53,6 @@ var OuterListElement = function OuterListElement(containerRef, isSticky) {
|
|
|
69
53
|
})
|
|
70
54
|
}, children);
|
|
71
55
|
}
|
|
72
|
-
|
|
73
56
|
return /*#__PURE__*/React.createElement(Scrollbar, {
|
|
74
57
|
ref: ref,
|
|
75
58
|
onScroll: onScrollHandler,
|
|
@@ -78,5 +61,4 @@ var OuterListElement = function OuterListElement(containerRef, isSticky) {
|
|
|
78
61
|
}, children);
|
|
79
62
|
});
|
|
80
63
|
};
|
|
81
|
-
|
|
82
64
|
export default OuterListElement;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export var infiniteScrollPropsToState = function infiniteScrollPropsToState(_ref) {
|
|
2
2
|
var hasError = _ref.hasError,
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
hasMore = _ref.hasMore,
|
|
4
|
+
isLoading = _ref.isLoading;
|
|
5
5
|
return {
|
|
6
6
|
hasError: hasError,
|
|
7
7
|
hasMore: hasMore,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
1
|
+
import styled from 'styled-components';
|
|
2
2
|
|
|
3
|
+
// eslint-disable-next-line import/prefer-default-export
|
|
3
4
|
export var ItemsMenu = styled.div.withConfig({
|
|
4
5
|
displayName: "ItemsMenustyles__ItemsMenu",
|
|
5
6
|
componentId: "zmeifj-0"
|
|
@@ -5,19 +5,17 @@ import { useRowKey } from '../hooks/useRowKey';
|
|
|
5
5
|
import { getRecordSelectionStatus, isRecordSelectable } from '../utils';
|
|
6
6
|
export function RowSelectionColumn(_ref) {
|
|
7
7
|
var rowKey = _ref.rowKey,
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
8
|
+
record = _ref.record,
|
|
9
|
+
limit = _ref.limit,
|
|
10
|
+
independentSelectionExpandedRows = _ref.independentSelectionExpandedRows,
|
|
11
|
+
selectedRowKeys = _ref.selectedRowKeys,
|
|
12
|
+
selectedRecords = _ref.selectedRecords,
|
|
13
|
+
tableLocale = _ref.tableLocale,
|
|
14
|
+
onChange = _ref.onChange,
|
|
15
|
+
checkRowSelectionStatus = _ref.checkRowSelectionStatus,
|
|
16
|
+
childrenColumnName = _ref.childrenColumnName;
|
|
18
17
|
var _useRowKey = useRowKey(rowKey),
|
|
19
|
-
|
|
20
|
-
|
|
18
|
+
getRowKey = _useRowKey.getRowKey;
|
|
21
19
|
var recordKey = getRowKey(record);
|
|
22
20
|
var rowChildren = record[childrenColumnName];
|
|
23
21
|
var isSelectable = useCallback(function (item) {
|
|
@@ -40,20 +38,17 @@ export function RowSelectionColumn(_ref) {
|
|
|
40
38
|
var clickableChildren = rowChildren == null ? void 0 : rowChildren.filter(isSelectable);
|
|
41
39
|
return checkedChildren.length > 0 && checkedChildren.length < (clickableChildren.length || 0);
|
|
42
40
|
}
|
|
43
|
-
|
|
44
41
|
return false;
|
|
45
42
|
}, [checkedChildren.length, independentSelectionExpandedRows, isSelectable, rowChildren]);
|
|
46
43
|
var isChecked = useMemo(function () {
|
|
47
44
|
if (Array.isArray(rowChildren) && !independentSelectionExpandedRows) {
|
|
48
45
|
return isChecked || allChildrenSelected;
|
|
49
46
|
}
|
|
50
|
-
|
|
51
47
|
return recordKey !== undefined && selectedRowKeys && selectedRowKeys.indexOf(recordKey) >= 0;
|
|
52
48
|
}, [allChildrenSelected, independentSelectionExpandedRows, rowChildren, recordKey, selectedRowKeys]);
|
|
53
49
|
var handleSelectionChange = useCallback(function (isCheckedNext, changedRecord) {
|
|
54
50
|
var selectedRows = selectedRecords;
|
|
55
51
|
var changedRecordChildren = changedRecord[childrenColumnName];
|
|
56
|
-
|
|
57
52
|
if (isCheckedNext) {
|
|
58
53
|
if (Array.isArray(changedRecordChildren) && !independentSelectionExpandedRows) {
|
|
59
54
|
var clickableChildren = changedRecordChildren.filter(isSelectable);
|
|
@@ -73,23 +68,18 @@ export function RowSelectionColumn(_ref) {
|
|
|
73
68
|
return getRowKey(row) !== recordKey;
|
|
74
69
|
});
|
|
75
70
|
}
|
|
76
|
-
|
|
77
71
|
selectedRows = Array.from(new Set(selectedRows));
|
|
78
72
|
onChange && onChange(selectedRows.reduce(function (acc, current) {
|
|
79
73
|
var key = getRowKey(current);
|
|
80
|
-
|
|
81
74
|
if (key !== undefined) {
|
|
82
75
|
return [].concat(acc, [key]);
|
|
83
76
|
}
|
|
84
|
-
|
|
85
77
|
return acc;
|
|
86
78
|
}, []), selectedRows);
|
|
87
79
|
}, [getRowKey, independentSelectionExpandedRows, isSelectable, onChange, recordKey, selectedRecords, childrenColumnName]);
|
|
88
|
-
|
|
89
80
|
var _getRecordSelectionSt = getRecordSelectionStatus(checkRowSelectionStatus, record),
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
81
|
+
unavailable = _getRecordSelectionSt.unavailable,
|
|
82
|
+
disabled = _getRecordSelectionSt.disabled;
|
|
93
83
|
return recordKey !== undefined && !unavailable ? /*#__PURE__*/React.createElement(Tooltip, {
|
|
94
84
|
title: tableLocale == null ? void 0 : tableLocale.selectRowTooltip,
|
|
95
85
|
mouseLeaveDelay: 0
|
package/dist/Table.js
CHANGED
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
2
|
-
|
|
3
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
-
|
|
7
4
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
-
|
|
9
5
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
10
|
-
|
|
11
6
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
12
|
-
|
|
13
7
|
import React, { useCallback, useMemo } from 'react';
|
|
14
8
|
import { useIntl } from 'react-intl';
|
|
15
9
|
import '@synerise/ds-core/dist/js/style';
|
|
@@ -31,40 +25,37 @@ var ITEM_RENDER_TYPE = {
|
|
|
31
25
|
prev: 'prev',
|
|
32
26
|
next: 'next'
|
|
33
27
|
};
|
|
34
|
-
|
|
35
28
|
var DSTable = function DSTable(props) {
|
|
36
29
|
var intl = useIntl();
|
|
37
30
|
var title = props.title,
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
31
|
+
loading = props.loading,
|
|
32
|
+
selection = props.selection,
|
|
33
|
+
itemsMenu = props.itemsMenu,
|
|
34
|
+
cellSize = props.cellSize,
|
|
35
|
+
dataSource = props.dataSource,
|
|
36
|
+
dataSourceFull = props.dataSourceFull,
|
|
37
|
+
dataSourceTotalCount = props.dataSourceTotalCount,
|
|
38
|
+
roundedHeader = props.roundedHeader,
|
|
39
|
+
filters = props.filters,
|
|
40
|
+
searchComponent = props.searchComponent,
|
|
41
|
+
filterComponent = props.filterComponent,
|
|
42
|
+
rowKey = props.rowKey,
|
|
43
|
+
headerWithBorderTop = props.headerWithBorderTop,
|
|
44
|
+
hideTitleBar = props.hideTitleBar,
|
|
45
|
+
grouped = props.grouped,
|
|
46
|
+
pagination = props.pagination,
|
|
47
|
+
locale = props.locale,
|
|
48
|
+
headerButton = props.headerButton,
|
|
49
|
+
hideColumnNames = props.hideColumnNames,
|
|
50
|
+
renderSelectionTitle = props.renderSelectionTitle,
|
|
51
|
+
hideTitlePart = props.hideTitlePart,
|
|
52
|
+
disableColumnNamesLineBreak = props.disableColumnNamesLineBreak,
|
|
53
|
+
expandable = props.expandable,
|
|
54
|
+
columns = props.columns,
|
|
55
|
+
skeletonProps = props.skeletonProps;
|
|
63
56
|
var tableLocale = useTableLocale(intl, locale);
|
|
64
|
-
|
|
65
57
|
var _useDataFormat = useDataFormat(),
|
|
66
|
-
|
|
67
|
-
|
|
58
|
+
formatValue = _useDataFormat.formatValue;
|
|
68
59
|
var renderHeader = useCallback(function () {
|
|
69
60
|
var size = selection && (selection == null ? void 0 : selection.selectedRowKeys) && (selection == null ? void 0 : selection.selectedRowKeys.length);
|
|
70
61
|
var data = grouped ? // @ts-ignore
|
|
@@ -72,7 +63,6 @@ var DSTable = function DSTable(props) {
|
|
|
72
63
|
if (group.rows) {
|
|
73
64
|
return [].concat(items, group.rows);
|
|
74
65
|
}
|
|
75
|
-
|
|
76
66
|
return [].concat(items);
|
|
77
67
|
}, []) : dataSource;
|
|
78
68
|
var totalCount = dataSourceTotalCount || (dataSource == null ? void 0 : dataSource.length) || (dataSourceFull == null ? void 0 : dataSourceFull.length);
|
|
@@ -101,7 +91,6 @@ var DSTable = function DSTable(props) {
|
|
|
101
91
|
return _objectSpread({
|
|
102
92
|
showTotal: function showTotal(total, range) {
|
|
103
93
|
var _tableLocale$paginati, _tableLocale$paginati2;
|
|
104
|
-
|
|
105
94
|
return !hideTitlePart ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("strong", null, formatValue(range[0])), "-", /*#__PURE__*/React.createElement("strong", null, formatValue(range[1])), " of", ' ', /*#__PURE__*/React.createElement("strong", null, formatValue(total)), ' ', grouped ? tableLocale == null || (_tableLocale$paginati = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati.groups : tableLocale == null || (_tableLocale$paginati2 = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati2.items) : /*#__PURE__*/React.createElement("div", {
|
|
106
95
|
style: {
|
|
107
96
|
width: '150px'
|
|
@@ -120,7 +109,6 @@ var DSTable = function DSTable(props) {
|
|
|
120
109
|
component: /*#__PURE__*/React.createElement(AngleLeftS, null)
|
|
121
110
|
}));
|
|
122
111
|
}
|
|
123
|
-
|
|
124
112
|
if (type === ITEM_RENDER_TYPE.next) {
|
|
125
113
|
return /*#__PURE__*/React.createElement(Button, {
|
|
126
114
|
mode: "single-icon",
|
|
@@ -129,7 +117,6 @@ var DSTable = function DSTable(props) {
|
|
|
129
117
|
component: /*#__PURE__*/React.createElement(AngleRightS, null)
|
|
130
118
|
}));
|
|
131
119
|
}
|
|
132
|
-
|
|
133
120
|
return originalElement;
|
|
134
121
|
}
|
|
135
122
|
}, pagination);
|
|
@@ -163,7 +150,6 @@ var DSTable = function DSTable(props) {
|
|
|
163
150
|
pagination: dataSource != null && dataSource.length && pagination ? footerPagination : false
|
|
164
151
|
})) : tableContent));
|
|
165
152
|
};
|
|
166
|
-
|
|
167
153
|
DSTable.SELECTION_ALL = SELECTION_ALL;
|
|
168
154
|
DSTable.SELECTION_INVERT = SELECTION_INVERT;
|
|
169
155
|
export default DSTable;
|