@synerise/ds-table 1.9.11 → 1.9.12
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 +4 -0
- package/dist/Cell/Action/ActionCell.d.ts +2 -2
- package/dist/Cell/Action/ActionCell.js +15 -18
- package/dist/Cell/Action/ActionCell.styles.d.ts +2 -2
- package/dist/Cell/Action/ActionCell.styles.js +10 -11
- package/dist/Cell/Action/ActionCell.types.d.ts +2 -2
- package/dist/Cell/Action/ActionCell.types.js +1 -1
- package/dist/Cell/AvatarLabel/AvatarLabel.d.ts +2 -2
- package/dist/Cell/AvatarLabel/AvatarLabel.js +32 -43
- package/dist/Cell/AvatarLabel/AvatarLabel.styles.d.ts +13 -13
- package/dist/Cell/AvatarLabel/AvatarLabel.styles.js +27 -28
- package/dist/Cell/AvatarLabel/AvatarLabel.types.d.ts +2 -2
- package/dist/Cell/AvatarLabel/AvatarLabel.types.js +1 -1
- package/dist/Cell/Copyable/Copyable.styles.d.ts +2 -2
- package/dist/Cell/Copyable/Copyable.styles.js +9 -15
- package/dist/Cell/Copyable/Copyable.types.d.ts +1 -1
- package/dist/Cell/Copyable/Copyable.types.js +1 -1
- package/dist/Cell/Copyable/CopyableCell.d.ts +2 -2
- package/dist/Cell/Copyable/CopyableCell.js +23 -27
- package/dist/Cell/Editable/EditableCell.d.ts +2 -2
- package/dist/Cell/Editable/EditableCell.js +26 -39
- package/dist/Cell/Editable/EditableCell.styles.d.ts +2 -2
- package/dist/Cell/Editable/EditableCell.styles.js +9 -7
- package/dist/Cell/Editable/EditableCell.types.d.ts +1 -1
- package/dist/Cell/Editable/EditableCell.types.js +1 -1
- package/dist/Cell/FlagLabel/FlagLabelCell.d.ts +2 -2
- package/dist/Cell/FlagLabel/FlagLabelCell.js +15 -14
- package/dist/Cell/FlagLabel/FlagLabelCell.styles.d.ts +1 -1
- package/dist/Cell/FlagLabel/FlagLabelCell.styles.js +6 -3
- package/dist/Cell/FlagLabel/FlagLabelCell.types.d.ts +2 -2
- package/dist/Cell/FlagLabel/FlagLabelCell.types.js +1 -1
- package/dist/Cell/IconLabel/IconLabel.d.ts +2 -2
- package/dist/Cell/IconLabel/IconLabel.js +14 -15
- package/dist/Cell/IconLabel/IconLabel.styles.d.ts +1 -1
- package/dist/Cell/IconLabel/IconLabel.styles.js +7 -6
- package/dist/Cell/IconLabel/IconLabel.types.d.ts +3 -3
- package/dist/Cell/IconLabel/IconLabel.types.js +1 -1
- package/dist/Cell/IconTooltipCell/IconTooltipCell.d.ts +2 -2
- package/dist/Cell/IconTooltipCell/IconTooltipCell.js +18 -23
- package/dist/Cell/IconTooltipCell/IconTooltipCell.styles.d.ts +2 -2
- package/dist/Cell/IconTooltipCell/IconTooltipCell.styles.js +9 -11
- package/dist/Cell/IconTooltipCell/IconTooltipCell.types.d.ts +4 -4
- package/dist/Cell/IconTooltipCell/IconTooltipCell.types.js +1 -1
- package/dist/Cell/InputNumber/InputNumberCell.d.ts +2 -2
- package/dist/Cell/InputNumber/InputNumberCell.js +10 -17
- package/dist/Cell/InputNumber/InputNumberCell.styles.d.ts +1 -1
- package/dist/Cell/InputNumber/InputNumberCell.styles.js +9 -5
- package/dist/Cell/InputNumber/InputNumberCell.types.d.ts +2 -2
- package/dist/Cell/InputNumber/InputNumberCell.types.js +1 -1
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.d.ts +3 -3
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.js +29 -40
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.styles.d.ts +3 -3
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.styles.js +11 -8
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.types.d.ts +2 -2
- package/dist/Cell/LabelsWithShowMore/LabelsWithShowMore.types.js +1 -1
- package/dist/Cell/LabelsWithShowMore/Modal/Modal.d.ts +2 -2
- package/dist/Cell/LabelsWithShowMore/Modal/Modal.js +35 -64
- package/dist/Cell/LabelsWithShowMore/Modal/Modal.types.d.ts +3 -3
- package/dist/Cell/LabelsWithShowMore/Modal/Modal.types.js +1 -1
- package/dist/Cell/Star/StarCell.d.ts +45 -45
- package/dist/Cell/Star/StarCell.js +25 -31
- package/dist/Cell/Star/StarCell.styles.d.ts +2 -2
- package/dist/Cell/Star/StarCell.styles.js +11 -9
- package/dist/Cell/Star/StarCell.types.d.ts +2 -2
- package/dist/Cell/Star/StarCell.types.js +1 -1
- package/dist/Cell/StatusLabel/StatusLabel.d.ts +2 -2
- package/dist/Cell/StatusLabel/StatusLabel.js +17 -19
- package/dist/Cell/StatusLabel/StatusLabel.styles.d.ts +2 -2
- package/dist/Cell/StatusLabel/StatusLabel.styles.js +9 -9
- package/dist/Cell/StatusLabel/StatusLabel.types.d.ts +3 -3
- package/dist/Cell/StatusLabel/StatusLabel.types.js +1 -1
- package/dist/Cell/TagIcon/TagIcon.d.ts +2 -2
- package/dist/Cell/TagIcon/TagIcon.js +9 -13
- package/dist/Cell/TagIcon/TagIcon.styles.d.ts +1 -1
- package/dist/Cell/TagIcon/TagIcon.styles.js +7 -6
- package/dist/Cell/TagIcon/TagIcon.types.d.ts +2 -2
- package/dist/Cell/TagIcon/TagIcon.types.js +1 -1
- package/dist/Cell/TagsGroup/TagsGroup.d.ts +2 -2
- package/dist/Cell/TagsGroup/TagsGroup.js +22 -39
- package/dist/Cell/TagsGroup/TagsGroup.styles.d.ts +2 -2
- package/dist/Cell/TagsGroup/TagsGroup.styles.js +30 -9
- package/dist/Cell/TagsGroup/TagsGroup.types.d.ts +2 -2
- package/dist/Cell/TagsGroup/TagsGroup.types.js +1 -1
- package/dist/Cell/index.d.ts +12 -12
- package/dist/Cell/index.js +28 -14
- package/dist/ColumnSortMenu/SortIcons.d.ts +2 -2
- package/dist/ColumnSortMenu/SortIcons.js +26 -38
- package/dist/ColumnSortMenu/SortRender.styles.d.ts +34 -34
- package/dist/ColumnSortMenu/SortRender.styles.js +13 -10
- package/dist/ColumnSortMenu/SortRenderer.d.ts +2 -2
- package/dist/ColumnSortMenu/SortRenderer.js +74 -108
- package/dist/ColumnSortMenu/TitleWithSort.d.ts +2 -2
- package/dist/ColumnSortMenu/TitleWithSort.js +19 -16
- package/dist/ColumnSortMenu/columnWithSortButtons.d.ts +1 -2
- package/dist/ColumnSortMenu/columnWithSortButtons.js +26 -43
- package/dist/ColumnSortMenu/groupedColumnsSort.d.ts +3 -3
- package/dist/ColumnSortMenu/groupedColumnsSort.js +33 -28
- package/dist/ColumnSortMenu/replaceSortButtons.d.ts +1 -1
- package/dist/ColumnSortMenu/replaceSortButtons.js +14 -15
- package/dist/ColumnSortMenu/useSortState.d.ts +1 -1
- package/dist/ColumnSortMenu/useSortState.js +95 -93
- package/dist/DefaultTable/DefaultTable.d.ts +2 -2
- package/dist/DefaultTable/DefaultTable.js +147 -148
- package/dist/FilterTrigger/FilterTrigger.d.ts +2 -2
- package/dist/FilterTrigger/FilterTrigger.js +42 -67
- package/dist/FilterTrigger/FilterTrigger.styles.d.ts +53 -53
- package/dist/FilterTrigger/FilterTrigger.styles.js +19 -32
- package/dist/FilterTrigger/FilterTrigger.types.d.ts +1 -1
- package/dist/FilterTrigger/FilterTrigger.types.js +1 -1
- package/dist/GroupTable/GroupTable.d.ts +3 -4
- package/dist/GroupTable/GroupTable.js +97 -118
- package/dist/GroupTable/GroupTable.styles.d.ts +25 -25
- package/dist/GroupTable/GroupTable.styles.js +40 -37
- package/dist/GroupTable/GroupTable.types.d.ts +1 -1
- package/dist/GroupTable/GroupTable.types.js +9 -6
- package/dist/GroupTable/GroupTableBody/GroupTableBody.d.ts +1 -1
- package/dist/GroupTable/GroupTableBody/GroupTableBody.js +83 -107
- package/dist/GroupTable/GroupTableBody/GroupTableBody.types.d.ts +3 -3
- package/dist/GroupTable/GroupTableBody/GroupTableBody.types.js +1 -1
- package/dist/GroupTable/GroupTableHeader/GroupTableHeader.d.ts +1 -1
- package/dist/GroupTable/GroupTableHeader/GroupTableHeader.js +25 -28
- package/dist/GroupTable/GroupTableHeader/GroupTableHeader.types.js +1 -1
- package/dist/InfiniteScroll/BackToTopButton.d.ts +2 -2
- package/dist/InfiniteScroll/BackToTopButton.js +7 -15
- package/dist/InfiniteScroll/BackToTopButton.styles.d.ts +34 -34
- package/dist/InfiniteScroll/BackToTopButton.styles.js +11 -9
- package/dist/InfiniteScroll/ErrorItem.d.ts +1 -1
- package/dist/InfiniteScroll/ErrorItem.js +19 -23
- package/dist/InfiniteScroll/ErrorItem.styles.d.ts +1 -1
- package/dist/InfiniteScroll/ErrorItem.styles.js +6 -3
- package/dist/InfiniteScroll/InfiniteLoaderItem.d.ts +2 -2
- package/dist/InfiniteScroll/InfiniteLoaderItem.js +33 -28
- package/dist/InfiniteScroll/InfiniteLoaderItem.styles.d.ts +1 -1
- package/dist/InfiniteScroll/InfiniteLoaderItem.styles.js +7 -4
- package/dist/InfiniteScroll/InfiniteLoaderItem.types.d.ts +1 -1
- package/dist/InfiniteScroll/InfiniteLoaderItem.types.js +1 -1
- package/dist/InfiniteScroll/LoadingItem.d.ts +1 -1
- package/dist/InfiniteScroll/LoadingItem.js +10 -10
- package/dist/InfiniteScroll/NoMoreItem.d.ts +1 -1
- package/dist/InfiniteScroll/NoMoreItem.js +10 -10
- package/dist/InfiniteScroll/OuterListElement.d.ts +1 -1
- package/dist/InfiniteScroll/OuterListElement.js +45 -58
- package/dist/InfiniteScroll/constants.js +4 -1
- package/dist/InfiniteScroll/utils.d.ts +1 -1
- package/dist/InfiniteScroll/utils.js +15 -12
- package/dist/ItemsMenu/ItemsMenu.d.ts +2 -2
- package/dist/ItemsMenu/ItemsMenu.js +7 -6
- package/dist/ItemsMenu/ItemsMenu.styles.d.ts +1 -1
- package/dist/ItemsMenu/ItemsMenu.styles.js +6 -3
- package/dist/ItemsMenu/ItemsMenu.types.d.ts +1 -1
- package/dist/ItemsMenu/ItemsMenu.types.js +1 -1
- package/dist/RowSelection/RowSelectionColumn.d.ts +3 -3
- package/dist/RowSelection/RowSelectionColumn.js +77 -81
- package/dist/RowSelection/RowSelectionColumn.types.d.ts +3 -3
- package/dist/RowSelection/RowSelectionColumn.types.js +1 -1
- package/dist/RowSelection/index.js +4 -1
- package/dist/Table.d.ts +2 -4
- package/dist/Table.js +94 -129
- package/dist/Table.styles.d.ts +23 -23
- package/dist/Table.styles.js +86 -110
- package/dist/Table.types.d.ts +7 -7
- package/dist/Table.types.js +1 -1
- package/dist/TableHeader/TableHeader.d.ts +2 -2
- package/dist/TableHeader/TableHeader.js +91 -129
- package/dist/TableHeader/TableHeader.types.d.ts +2 -2
- package/dist/TableHeader/TableHeader.types.js +1 -1
- package/dist/TableHeader/TableLimit/TableLimit.d.ts +2 -2
- package/dist/TableHeader/TableLimit/TableLimit.js +44 -36
- package/dist/TableHeader/TableLimit/TableLimit.styles.d.ts +4 -4
- package/dist/TableHeader/TableLimit/TableLimit.styles.js +15 -13
- package/dist/TableHeader/TableLimit/TableLimit.types.d.ts +3 -3
- package/dist/TableHeader/TableLimit/TableLimit.types.js +1 -1
- package/dist/TableHeader/TableLimit/index.js +4 -2
- package/dist/TableHeader/TableSelection.d.ts +2 -2
- package/dist/TableHeader/TableSelection.js +163 -180
- package/dist/TableHeader/TableSelection.types.d.ts +1 -1
- package/dist/TableHeader/TableSelection.types.js +1 -1
- package/dist/TreeTable/TreeTable.d.ts +2 -3
- package/dist/TreeTable/TreeTable.js +51 -78
- package/dist/TreeTable/TreeTable.styles.d.ts +5 -5
- package/dist/TreeTable/TreeTable.styles.js +21 -20
- package/dist/VirtualTable/VirtualTable.d.ts +3 -3
- package/dist/VirtualTable/VirtualTable.js +342 -411
- package/dist/VirtualTable/VirtualTable.styles.d.ts +8 -8
- package/dist/VirtualTable/VirtualTable.styles.js +30 -40
- package/dist/VirtualTable/VirtualTable.types.d.ts +4 -4
- package/dist/VirtualTable/VirtualTable.types.js +1 -1
- package/dist/VirtualTable/VirtualTableRow.d.ts +4 -4
- package/dist/VirtualTable/VirtualTableRow.js +103 -111
- package/dist/VirtualTable/constants.js +8 -3
- package/dist/assets/style/index-tn0RQdqM.css +0 -0
- package/dist/constants/Table.constants.js +11 -6
- package/dist/constants/TableSkeleton.constants.d.ts +1 -1
- package/dist/constants/TableSkeleton.constants.js +48 -100
- package/dist/hooks/useBulkSelection/index.js +4 -1
- package/dist/hooks/useBulkSelection/useBulkSelection.d.ts +1 -1
- package/dist/hooks/useBulkSelection/useBulkSelection.js +55 -40
- package/dist/hooks/useRowKey/index.js +4 -1
- package/dist/hooks/useRowKey/useRowKey.js +11 -11
- package/dist/hooks/useRowStar/index.js +4 -2
- package/dist/hooks/useRowStar/useRowStar.d.ts +1 -1
- package/dist/hooks/useRowStar/useRowStar.js +54 -62
- package/dist/hooks/useRowStar/useRowStar.types.d.ts +2 -2
- package/dist/hooks/useRowStar/useRowStar.types.js +1 -1
- package/dist/index.d.ts +4 -4
- package/dist/index.js +18 -9
- package/dist/modules.d.js +1 -1
- package/dist/modules.d.ts +0 -0
- package/dist/utils/calculateColumnWidths.d.ts +1 -1
- package/dist/utils/calculateColumnWidths.js +17 -16
- package/dist/utils/calculatePixels.js +11 -12
- package/dist/utils/columnWithCellTooltip.d.ts +1 -1
- package/dist/utils/columnWithCellTooltip.js +18 -15
- package/dist/utils/getChildrenColumnName.js +6 -3
- package/dist/utils/getRecordSelectionStatus.d.ts +1 -1
- package/dist/utils/getRecordSelectionStatus.js +11 -7
- package/dist/utils/getSkeletonProps.d.ts +1 -1
- package/dist/utils/getSkeletonProps.js +26 -36
- package/dist/utils/getValueFromPath.js +9 -6
- package/dist/utils/index.js +23 -9
- package/dist/utils/isGrouped.d.ts +1 -1
- package/dist/utils/isGrouped.js +6 -3
- package/dist/utils/isRecordSelectable.d.ts +1 -1
- package/dist/utils/isRecordSelectable.js +10 -6
- package/dist/utils/locale.d.ts +3 -3
- package/dist/utils/locale.js +115 -111
- package/package.json +31 -31
- package/dist/Cell/TagsGroup/TagsGroup.spec.d.ts +0 -1
- package/dist/ColumnSortMenu/__spec__/groupedColumnsSort.spec.d.ts +0 -1
- package/dist/VirtualTable/VirtualTable.spec.d.ts +0 -1
- package/dist/utils/__specs__/getValueFromPath.spec.d.ts +0 -1
|
@@ -1,22 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
1
|
+
import { useCallback, useMemo } from "react";
|
|
2
|
+
import "unit-to-px";
|
|
3
|
+
import "react/jsx-runtime";
|
|
4
|
+
import "../../Table.styles.js";
|
|
5
|
+
import "@synerise/ds-skeleton";
|
|
6
|
+
import "uuid";
|
|
7
|
+
import "styled-components";
|
|
8
|
+
import "@synerise/ds-typography";
|
|
9
|
+
import "ramda";
|
|
10
|
+
import { isRecordSelectable } from "../../utils/isRecordSelectable.js";
|
|
11
|
+
import "../../utils/locale.js";
|
|
12
|
+
import { useRowKey } from "../useRowKey/useRowKey.js";
|
|
13
|
+
const useBulkSelectionCount = ({
|
|
14
|
+
dataSource,
|
|
15
|
+
selection,
|
|
16
|
+
childrenColumnName,
|
|
17
|
+
rowKey
|
|
18
|
+
}) => {
|
|
19
|
+
const {
|
|
20
|
+
getRowKey
|
|
21
|
+
} = useRowKey(rowKey);
|
|
22
|
+
const getSelectableChildren = useCallback((children) => {
|
|
23
|
+
const selectionStatusValidator = selection?.checkRowSelectionStatus || void 0;
|
|
24
|
+
return children ? children.filter((child) => isRecordSelectable(child, selectionStatusValidator) && getRowKey(child) !== void 0) : [];
|
|
25
|
+
}, [getRowKey, selection?.checkRowSelectionStatus]);
|
|
26
|
+
const result = useMemo(() => {
|
|
27
|
+
const initialValue = {
|
|
20
28
|
selectableRecordsCount: 0,
|
|
21
29
|
selectableAndSelectedRecordsCount: 0,
|
|
22
30
|
selectedRecordsCount: 0
|
|
@@ -24,44 +32,51 @@ export var useBulkSelectionCount = function useBulkSelectionCount(_ref) {
|
|
|
24
32
|
if (!dataSource.length || !selection) {
|
|
25
33
|
return initialValue;
|
|
26
34
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
35
|
+
const {
|
|
36
|
+
selectedRowKeys,
|
|
37
|
+
independentSelectionExpandedRows,
|
|
38
|
+
checkRowSelectionStatus
|
|
39
|
+
} = selection;
|
|
40
|
+
return dataSource.reduce((count, record) => {
|
|
41
|
+
const isSelectable = +isRecordSelectable(record, checkRowSelectionStatus);
|
|
42
|
+
const rowChildren = record[childrenColumnName];
|
|
43
|
+
let {
|
|
44
|
+
selectableRecordsCount,
|
|
45
|
+
selectableAndSelectedRecordsCount,
|
|
46
|
+
selectedRecordsCount
|
|
47
|
+
} = count;
|
|
37
48
|
if (independentSelectionExpandedRows) {
|
|
38
49
|
Array.isArray(rowChildren) ? selectableRecordsCount += getSelectableChildren(rowChildren).length + isSelectable : selectableRecordsCount += isSelectable;
|
|
39
50
|
} else {
|
|
40
51
|
Array.isArray(rowChildren) ? selectableRecordsCount += getSelectableChildren(rowChildren).length : selectableRecordsCount += isSelectable;
|
|
41
52
|
}
|
|
42
53
|
if (Array.isArray(rowChildren)) {
|
|
43
|
-
selectedRecordsCount += rowChildren.reduce(
|
|
44
|
-
|
|
54
|
+
selectedRecordsCount += rowChildren.reduce((childCount, child) => {
|
|
55
|
+
const key = getRowKey(child);
|
|
45
56
|
return selectedRowKeys.includes(key) ? childCount + 1 : childCount;
|
|
46
57
|
}, 0);
|
|
47
|
-
selectableAndSelectedRecordsCount += rowChildren.reduce(
|
|
48
|
-
|
|
58
|
+
selectableAndSelectedRecordsCount += rowChildren.reduce((childCount, child) => {
|
|
59
|
+
const key = getRowKey(child);
|
|
49
60
|
return selectedRowKeys.includes(key) && isRecordSelectable(child, checkRowSelectionStatus) ? childCount + 1 : childCount;
|
|
50
61
|
}, 0);
|
|
51
62
|
}
|
|
52
63
|
if (!Array.isArray(rowChildren) || selection.independentSelectionExpandedRows) {
|
|
53
|
-
|
|
64
|
+
const key = getRowKey(record);
|
|
54
65
|
selectedRecordsCount += selectedRowKeys.includes(key) ? 1 : 0;
|
|
55
66
|
selectableAndSelectedRecordsCount += selectedRowKeys.includes(key) && isRecordSelectable(record, checkRowSelectionStatus) ? 1 : 0;
|
|
56
67
|
}
|
|
57
68
|
return {
|
|
58
|
-
selectableRecordsCount
|
|
59
|
-
selectableAndSelectedRecordsCount
|
|
60
|
-
selectedRecordsCount
|
|
69
|
+
selectableRecordsCount,
|
|
70
|
+
selectableAndSelectedRecordsCount,
|
|
71
|
+
selectedRecordsCount
|
|
61
72
|
};
|
|
62
73
|
}, initialValue);
|
|
63
74
|
}, [childrenColumnName, dataSource, getRowKey, getSelectableChildren, selection]);
|
|
64
|
-
return
|
|
75
|
+
return {
|
|
76
|
+
...result,
|
|
65
77
|
allRecordsCount: dataSource.length
|
|
66
|
-
}
|
|
67
|
-
};
|
|
78
|
+
};
|
|
79
|
+
};
|
|
80
|
+
export {
|
|
81
|
+
useBulkSelectionCount
|
|
82
|
+
};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export var useRowKey = function useRowKey(rowKey) {
|
|
6
|
-
var getRowKey = React.useCallback(function (row) {
|
|
7
|
-
if (typeof rowKey === 'function') {
|
|
1
|
+
import React from "react";
|
|
2
|
+
const useRowKey = (rowKey) => {
|
|
3
|
+
const getRowKey = React.useCallback((row) => {
|
|
4
|
+
if (typeof rowKey === "function") {
|
|
8
5
|
return rowKey(row);
|
|
9
6
|
}
|
|
10
|
-
if (typeof rowKey ===
|
|
7
|
+
if (typeof rowKey === "string") {
|
|
11
8
|
return row[rowKey];
|
|
12
9
|
}
|
|
13
|
-
return row.key ||
|
|
10
|
+
return row.key || void 0;
|
|
14
11
|
}, [rowKey]);
|
|
15
12
|
return {
|
|
16
|
-
getRowKey
|
|
13
|
+
getRowKey
|
|
17
14
|
};
|
|
18
|
-
};
|
|
15
|
+
};
|
|
16
|
+
export {
|
|
17
|
+
useRowKey
|
|
18
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UseStarredApi } from './useRowStar.types';
|
|
2
2
|
export declare const useRowStar: (initialStarredKeys: string[]) => UseStarredApi;
|
|
@@ -1,72 +1,64 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
if (typeof (rowStar == null ? void 0 : rowStar.onChange) === 'function') {
|
|
33
|
-
rowStar.onChange(newStarredRowKeys, keyString, isStarred(keyString));
|
|
34
|
-
}
|
|
35
|
-
if (typeof (rowStar == null ? void 0 : rowStar.onClick) === 'function') {
|
|
36
|
-
rowStar.onClick(e);
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
}));
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import Button from "@synerise/ds-button";
|
|
4
|
+
import Tooltip from "@synerise/ds-tooltip";
|
|
5
|
+
const STAR_COL_WIDTH_SINGLE = 64;
|
|
6
|
+
const STAR_COL_WIDTH_SELECTON = 40;
|
|
7
|
+
const createRowStarColumn = ({
|
|
8
|
+
isStarred,
|
|
9
|
+
toggleStarred
|
|
10
|
+
}) => ({
|
|
11
|
+
locale,
|
|
12
|
+
rowStar,
|
|
13
|
+
selection,
|
|
14
|
+
getRowKey,
|
|
15
|
+
loading
|
|
16
|
+
}) => ({
|
|
17
|
+
key: "_row-star",
|
|
18
|
+
className: `${rowStar?.className || ""} ds-table-star-column`,
|
|
19
|
+
width: !!selection && !!rowStar ? STAR_COL_WIDTH_SELECTON : STAR_COL_WIDTH_SINGLE,
|
|
20
|
+
render: rowStar?.renderCell || ((value, record) => {
|
|
21
|
+
const {
|
|
22
|
+
expandedChild
|
|
23
|
+
} = record;
|
|
24
|
+
const keyString = String(getRowKey(record));
|
|
25
|
+
if (loading || expandedChild && rowStar?.disableForExpandedRows) {
|
|
26
|
+
return null;
|
|
27
|
+
}
|
|
28
|
+
return /* @__PURE__ */ jsx(Tooltip, { title: locale?.starRowTooltip, children: /* @__PURE__ */ jsx(Button.Star, { "data-testid": "ds-table-star-button", active: isStarred(keyString), onClick: (e) => {
|
|
29
|
+
const newStarredRowKeys = toggleStarred(keyString);
|
|
30
|
+
if (typeof rowStar?.onChange === "function") {
|
|
31
|
+
rowStar.onChange(newStarredRowKeys, keyString, isStarred(keyString));
|
|
40
32
|
}
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
var toggleStarred = React.useCallback(function (key) {
|
|
33
|
+
if (typeof rowStar?.onClick === "function") {
|
|
34
|
+
rowStar.onClick(e);
|
|
35
|
+
}
|
|
36
|
+
} }) });
|
|
37
|
+
})
|
|
38
|
+
});
|
|
39
|
+
const useRowStar = (initialStarredKeys) => {
|
|
40
|
+
const starredKeys = React.useRef(new Set(initialStarredKeys));
|
|
41
|
+
const getStarredRowKeys = () => Array.from(starredKeys.current);
|
|
42
|
+
const isStarred = React.useCallback((key) => starredKeys.current.has(key), [starredKeys]);
|
|
43
|
+
const toggleStarred = React.useCallback((key) => {
|
|
53
44
|
if (starredKeys.current.has(key)) {
|
|
54
|
-
starredKeys.current
|
|
45
|
+
starredKeys.current.delete(key);
|
|
55
46
|
} else {
|
|
56
47
|
starredKeys.current.add(key);
|
|
57
48
|
}
|
|
58
49
|
return getStarredRowKeys();
|
|
59
50
|
}, [starredKeys]);
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
});
|
|
65
|
-
}, [isStarred, toggleStarred]);
|
|
51
|
+
const getRowStarColumn = React.useMemo(() => createRowStarColumn({
|
|
52
|
+
isStarred,
|
|
53
|
+
toggleStarred
|
|
54
|
+
}), [isStarred, toggleStarred]);
|
|
66
55
|
return {
|
|
67
56
|
getStarredKeys: getStarredRowKeys,
|
|
68
|
-
isStarred
|
|
69
|
-
toggleStarred
|
|
70
|
-
getRowStarColumn
|
|
57
|
+
isStarred,
|
|
58
|
+
toggleStarred,
|
|
59
|
+
getRowStarColumn
|
|
71
60
|
};
|
|
72
|
-
};
|
|
61
|
+
};
|
|
62
|
+
export {
|
|
63
|
+
useRowStar
|
|
64
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { DSColumnType, DSTableProps } from '../../Table.types';
|
|
3
3
|
export type AnyRecordType = any;
|
|
4
4
|
export interface UseStarredApi {
|
|
5
5
|
getStarredKeys: () => string[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
+
import { default as GroupedTable } from './GroupTable/GroupTable';
|
|
2
|
+
import { default as ItemsMenu } from './ItemsMenu/ItemsMenu';
|
|
3
|
+
import { default as TreeTable } from './TreeTable/TreeTable';
|
|
4
|
+
import { default as VirtualTable } from './VirtualTable/VirtualTable';
|
|
1
5
|
import * as TableCell from './Cell';
|
|
2
|
-
import GroupedTable from './GroupTable/GroupTable';
|
|
3
|
-
import ItemsMenu from './ItemsMenu/ItemsMenu';
|
|
4
|
-
import TreeTable from './TreeTable/TreeTable';
|
|
5
|
-
import VirtualTable from './VirtualTable/VirtualTable';
|
|
6
6
|
export { default } from './Table';
|
|
7
7
|
export { GroupedTable, VirtualTable, TableCell, ItemsMenu, TreeTable };
|
|
8
8
|
export { default as BackToTopButton } from './InfiniteScroll/BackToTopButton';
|
package/dist/index.js
CHANGED
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
export {
|
|
1
|
+
import * as Cell_index from "./Cell/index.js";
|
|
2
|
+
import { default as default2 } from "./GroupTable/GroupTable.js";
|
|
3
|
+
import { default as default3 } from "./ItemsMenu/ItemsMenu.js";
|
|
4
|
+
import { default as default4 } from "./TreeTable/TreeTable.js";
|
|
5
|
+
import { default as default5 } from "./VirtualTable/VirtualTable.js";
|
|
6
|
+
import { default as default6 } from "./Table.js";
|
|
7
|
+
import { BackToTopButton } from "./InfiniteScroll/BackToTopButton.js";
|
|
8
|
+
import { GROUP_BY } from "./GroupTable/GroupTable.types.js";
|
|
9
|
+
export {
|
|
10
|
+
BackToTopButton,
|
|
11
|
+
GROUP_BY,
|
|
12
|
+
default2 as GroupedTable,
|
|
13
|
+
default3 as ItemsMenu,
|
|
14
|
+
Cell_index as TableCell,
|
|
15
|
+
default4 as TreeTable,
|
|
16
|
+
default5 as VirtualTable,
|
|
17
|
+
default6 as default
|
|
18
|
+
};
|
package/dist/modules.d.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "@testing-library/jest-dom";
|
|
File without changes
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { VirtualColumnType } from '../VirtualTable/VirtualTable.types';
|
|
2
2
|
export declare const calculateColumnWidths: <T extends object>(columns: VirtualColumnType<T>[], availableSpace: number) => number[];
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { calculatePixels } from
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { calculatePixels } from "./calculatePixels.js";
|
|
2
|
+
const calculateColumnWidths = (columns, availableSpace) => {
|
|
3
|
+
let baseSum = 0;
|
|
4
|
+
let flexibleColumnCount = 0;
|
|
5
|
+
let noMaxColumnCount = 0;
|
|
6
|
+
const baseWidths = columns.map((column) => {
|
|
7
|
+
const baseWidth = calculatePixels(column.width || column.minWidth) || 0;
|
|
8
8
|
flexibleColumnCount += Number(!column.width);
|
|
9
9
|
noMaxColumnCount += Number(!column.width && !column.maxWidth);
|
|
10
10
|
baseSum += baseWidth;
|
|
@@ -14,20 +14,18 @@ export var calculateColumnWidths = function calculateColumnWidths(columns, avail
|
|
|
14
14
|
return baseWidths;
|
|
15
15
|
}
|
|
16
16
|
if (baseSum < availableSpace) {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
columns.forEach(function (column, index) {
|
|
17
|
+
const extraWidth = (availableSpace - baseSum) / flexibleColumnCount;
|
|
18
|
+
let interimSum = 0;
|
|
19
|
+
columns.forEach((column, index) => {
|
|
21
20
|
if (!column.width) {
|
|
22
|
-
|
|
21
|
+
const maxWidthAsNumber = calculatePixels(column.maxWidth);
|
|
23
22
|
baseWidths[index] = maxWidthAsNumber ? Math.min(maxWidthAsNumber, baseWidths[index] + extraWidth) : baseWidths[index] + extraWidth;
|
|
24
23
|
}
|
|
25
24
|
interimSum += baseWidths[index];
|
|
26
25
|
});
|
|
27
26
|
if (interimSum < availableSpace) {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
columns.forEach(function (column, index) {
|
|
27
|
+
const extraWidth2 = (availableSpace - interimSum) / noMaxColumnCount;
|
|
28
|
+
columns.forEach((column, index) => {
|
|
31
29
|
if (!column.width && !column.maxWidth) {
|
|
32
30
|
baseWidths[index] += extraWidth2;
|
|
33
31
|
}
|
|
@@ -35,4 +33,7 @@ export var calculateColumnWidths = function calculateColumnWidths(columns, avail
|
|
|
35
33
|
}
|
|
36
34
|
}
|
|
37
35
|
return baseWidths;
|
|
38
|
-
};
|
|
36
|
+
};
|
|
37
|
+
export {
|
|
38
|
+
calculateColumnWidths
|
|
39
|
+
};
|
|
@@ -1,22 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
};
|
|
6
|
-
export var calculatePixels = function calculatePixels(value) {
|
|
7
|
-
if (typeof value === 'number') {
|
|
1
|
+
import toPx from "unit-to-px";
|
|
2
|
+
const hasSameLength = (parsedValue, originalValue) => `${parsedValue}`.length === `${originalValue}`.length;
|
|
3
|
+
const calculatePixels = (value) => {
|
|
4
|
+
if (typeof value === "number") {
|
|
8
5
|
return value;
|
|
9
6
|
}
|
|
10
|
-
|
|
7
|
+
const isWhiteSpaceString = typeof value === "string" && !value.trim();
|
|
11
8
|
if (!value || isWhiteSpaceString) {
|
|
12
9
|
return 0;
|
|
13
10
|
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var parsedNumber = parseFloat(value);
|
|
11
|
+
if (typeof value !== "number" && !Number.isNaN(value) && !Number.isNaN(parseFloat(value))) {
|
|
12
|
+
const parsedNumber = parseFloat(value);
|
|
17
13
|
if (hasSameLength(parsedNumber, value)) {
|
|
18
14
|
return parsedNumber;
|
|
19
15
|
}
|
|
20
16
|
}
|
|
21
17
|
return toPx(value);
|
|
22
|
-
};
|
|
18
|
+
};
|
|
19
|
+
export {
|
|
20
|
+
calculatePixels
|
|
21
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DSColumnType } from '../Table.types';
|
|
2
2
|
export declare const columnWithCellTooltip: <T extends object>(column: DSColumnType<T>) => DSColumnType<T>;
|
|
@@ -1,22 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
export var columnWithCellTooltip = function columnWithCellTooltip(column) {
|
|
1
|
+
import { jsx, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import Tooltip from "@synerise/ds-tooltip";
|
|
3
|
+
import { EXPANDED_ROW_PROPERTY } from "../VirtualTable/constants.js";
|
|
4
|
+
import { getValueFromPath } from "./getValueFromPath.js";
|
|
5
|
+
const columnWithCellTooltip = (column) => {
|
|
7
6
|
if (!column.getCellTooltipProps) {
|
|
8
7
|
return column;
|
|
9
8
|
}
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
const renderColumn = (value, rowData, columnIndex) => {
|
|
10
|
+
const cellTooltip = column.getCellTooltipProps?.(rowData);
|
|
12
11
|
if (rowData[EXPANDED_ROW_PROPERTY] && column.childRender) {
|
|
13
|
-
|
|
14
|
-
return cellTooltip ?
|
|
12
|
+
const content2 = column.childRender(getValueFromPath(rowData, column.dataIndex), rowData, columnIndex);
|
|
13
|
+
return cellTooltip ? /* @__PURE__ */ jsx(Tooltip, { ...cellTooltip, children: content2 }) : content2;
|
|
15
14
|
}
|
|
16
|
-
|
|
17
|
-
return cellTooltip ?
|
|
15
|
+
const content = column.render ? column.render(getValueFromPath(rowData, column.dataIndex), rowData, columnIndex) : getValueFromPath(rowData, column.dataIndex);
|
|
16
|
+
return cellTooltip ? /* @__PURE__ */ jsx(Tooltip, { ...cellTooltip, children: /* @__PURE__ */ jsx(Fragment, { children: content }) }) : /* @__PURE__ */ jsx(Fragment, { children: content });
|
|
18
17
|
};
|
|
19
|
-
return
|
|
18
|
+
return {
|
|
19
|
+
...column,
|
|
20
20
|
render: renderColumn
|
|
21
|
-
}
|
|
22
|
-
};
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
export {
|
|
24
|
+
columnWithCellTooltip
|
|
25
|
+
};
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
const DEFAULT_CHILDREN_COLUMN_NAME = "children";
|
|
2
|
+
const getChildrenColumnName = (childrenColumnName) => {
|
|
3
3
|
return childrenColumnName || DEFAULT_CHILDREN_COLUMN_NAME;
|
|
4
|
-
};
|
|
4
|
+
};
|
|
5
|
+
export {
|
|
6
|
+
getChildrenColumnName
|
|
7
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { RowSelection } from '../Table.types';
|
|
2
2
|
export declare const getRecordSelectionStatus: <T>(checkRowSelectionStatus: RowSelection<T>["checkRowSelectionStatus"], record: T) => {
|
|
3
3
|
unavailable: boolean | undefined;
|
|
4
4
|
disabled: boolean | undefined;
|
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
unavailable
|
|
4
|
-
disabled
|
|
1
|
+
const getRecordSelectionStatus = (checkRowSelectionStatus, record) => {
|
|
2
|
+
const {
|
|
3
|
+
unavailable,
|
|
4
|
+
disabled
|
|
5
|
+
} = checkRowSelectionStatus && checkRowSelectionStatus(record) || {};
|
|
5
6
|
return {
|
|
6
|
-
unavailable
|
|
7
|
-
disabled
|
|
7
|
+
unavailable,
|
|
8
|
+
disabled
|
|
8
9
|
};
|
|
9
|
-
};
|
|
10
|
+
};
|
|
11
|
+
export {
|
|
12
|
+
getRecordSelectionStatus
|
|
13
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { DSColumnType, DSTableProps } from '../Table.types';
|
|
2
2
|
export declare const getSkeletonProps: <T extends object>(skeletonProps: DSTableProps<T>["skeletonProps"], columns?: DSColumnType<T>[]) => Partial<DSTableProps<T>>;
|