@hi-ui/table 4.3.1 → 4.3.2
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 +40 -0
- package/lib/cjs/BaseTable.js +136 -189
- package/lib/cjs/ColGroupContent.js +5 -28
- package/lib/cjs/SettingDrawer.js +76 -127
- package/lib/cjs/Table.js +107 -171
- package/lib/cjs/TableAdvancedFilter.js +49 -85
- package/lib/cjs/TableBody.js +33 -69
- package/lib/cjs/TableCell.js +56 -102
- package/lib/cjs/TableColumnMenu.js +39 -77
- package/lib/cjs/TableEmbedRow.js +11 -38
- package/lib/cjs/TableHeader.js +8 -33
- package/lib/cjs/TableRow.js +48 -88
- package/lib/cjs/TableSettingMenu.js +48 -94
- package/lib/cjs/TbodyContent.js +28 -56
- package/lib/cjs/TheadContent.js +20 -49
- package/lib/cjs/_virtual/index.js +0 -3
- package/lib/cjs/_virtual/index2.js +0 -3
- package/lib/cjs/_virtual/react-is.development.js +0 -3
- package/lib/cjs/_virtual/react-is.production.min.js +0 -3
- package/lib/cjs/context.js +0 -9
- package/lib/cjs/hooks/use-async-switch.js +13 -51
- package/lib/cjs/hooks/use-check.js +47 -77
- package/lib/cjs/hooks/use-col-hidden.js +16 -28
- package/lib/cjs/hooks/use-col-set.js +5 -18
- package/lib/cjs/hooks/use-col-sorter.js +18 -32
- package/lib/cjs/hooks/use-col-width.js +21 -57
- package/lib/cjs/hooks/use-colgroup.js +63 -85
- package/lib/cjs/hooks/use-drag.js +10 -31
- package/lib/cjs/hooks/use-embed-expand.js +23 -68
- package/lib/cjs/hooks/use-expand.js +32 -64
- package/lib/cjs/hooks/use-pagination.js +19 -50
- package/lib/cjs/hooks/use-queue.js +2 -14
- package/lib/cjs/icons/index.js +4 -21
- package/lib/cjs/index.js +0 -4
- package/lib/cjs/node_modules/classnames/index.js +2 -11
- package/lib/cjs/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -227
- package/lib/cjs/node_modules/rc-resize-observer/es/index.js +10 -68
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +1 -17
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +1 -25
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +1 -5
- package/lib/cjs/node_modules/rc-util/es/Dom/canUseDom.js +0 -2
- package/lib/cjs/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
- package/lib/cjs/node_modules/rc-util/es/hooks/useLayoutEffect.js +2 -9
- package/lib/cjs/node_modules/rc-util/es/raf.js +0 -11
- package/lib/cjs/node_modules/rc-virtual-list/es/Filler.js +6 -25
- package/lib/cjs/node_modules/rc-virtual-list/es/Item.js +3 -14
- package/lib/cjs/node_modules/rc-virtual-list/es/List.js +103 -194
- package/lib/cjs/node_modules/rc-virtual-list/es/ScrollBar.js +16 -96
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useChildren.js +2 -11
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +8 -34
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -10
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useHeights.js +6 -39
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -16
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -9
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +3 -28
- package/lib/cjs/node_modules/rc-virtual-list/es/index.js +0 -2
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -9
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +0 -15
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -2
- package/lib/cjs/node_modules/react-is/cjs/react-is.development.js +3 -29
- package/lib/cjs/node_modules/react-is/cjs/react-is.production.min.js +19 -45
- package/lib/cjs/node_modules/react-is/index.js +0 -5
- package/lib/cjs/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +83 -248
- package/lib/cjs/packages/hooks/use-merge-refs/lib/esm/index.js +3 -14
- package/lib/cjs/packages/ui/scrollbar/lib/esm/Scrollbar.js +48 -86
- package/lib/cjs/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -15
- package/lib/cjs/packages/ui/scrollbar/lib/esm/utils/index.js +0 -13
- package/lib/cjs/styles/index.scss.js +1 -4
- package/lib/cjs/use-table.js +268 -355
- package/lib/cjs/utils/index.js +11 -45
- package/lib/esm/BaseTable.js +117 -138
- package/lib/esm/ColGroupContent.js +3 -9
- package/lib/esm/SettingDrawer.js +64 -83
- package/lib/esm/Table.js +97 -124
- package/lib/esm/TableAdvancedFilter.js +37 -47
- package/lib/esm/TableBody.js +24 -34
- package/lib/esm/TableCell.js +48 -72
- package/lib/esm/TableColumnMenu.js +24 -38
- package/lib/esm/TableEmbedRow.js +8 -15
- package/lib/esm/TableHeader.js +5 -11
- package/lib/esm/TableRow.js +36 -51
- package/lib/esm/TableSettingMenu.js +33 -49
- package/lib/esm/TbodyContent.js +20 -27
- package/lib/esm/TheadContent.js +14 -21
- package/lib/esm/context.js +0 -4
- package/lib/esm/hooks/use-async-switch.js +9 -28
- package/lib/esm/hooks/use-check.js +42 -55
- package/lib/esm/hooks/use-col-hidden.js +16 -21
- package/lib/esm/hooks/use-col-set.js +5 -13
- package/lib/esm/hooks/use-col-sorter.js +18 -23
- package/lib/esm/hooks/use-col-width.js +14 -34
- package/lib/esm/hooks/use-colgroup.js +60 -66
- package/lib/esm/hooks/use-drag.js +9 -13
- package/lib/esm/hooks/use-embed-expand.js +20 -42
- package/lib/esm/hooks/use-expand.js +32 -56
- package/lib/esm/hooks/use-pagination.js +13 -25
- package/lib/esm/hooks/use-queue.js +2 -10
- package/lib/esm/node_modules/classnames/index.js +2 -9
- package/lib/esm/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -228
- package/lib/esm/node_modules/rc-resize-observer/es/index.js +3 -26
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +0 -3
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +0 -8
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +0 -5
- package/lib/esm/node_modules/rc-util/es/Dom/canUseDom.js +0 -1
- package/lib/esm/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
- package/lib/esm/node_modules/rc-util/es/hooks/useLayoutEffect.js +1 -0
- package/lib/esm/node_modules/rc-util/es/raf.js +0 -10
- package/lib/esm/node_modules/rc-virtual-list/es/Filler.js +4 -15
- package/lib/esm/node_modules/rc-virtual-list/es/Item.js +1 -3
- package/lib/esm/node_modules/rc-virtual-list/es/List.js +101 -174
- package/lib/esm/node_modules/rc-virtual-list/es/ScrollBar.js +14 -86
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useChildren.js +0 -2
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +6 -25
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -6
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useHeights.js +4 -28
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -13
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -8
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +1 -19
- package/lib/esm/node_modules/rc-virtual-list/es/index.js +1 -1
- package/lib/esm/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -8
- package/lib/esm/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +1 -12
- package/lib/esm/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -1
- package/lib/esm/node_modules/react-is/cjs/react-is.development.js +4 -27
- package/lib/esm/node_modules/react-is/cjs/react-is.production.min.js +20 -44
- package/lib/esm/node_modules/react-is/index.js +0 -1
- package/lib/esm/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +82 -248
- package/lib/esm/packages/hooks/use-merge-refs/lib/esm/index.js +3 -9
- package/lib/esm/packages/ui/scrollbar/lib/esm/Scrollbar.js +47 -64
- package/lib/esm/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -3
- package/lib/esm/packages/ui/scrollbar/lib/esm/utils/index.js +0 -10
- package/lib/esm/styles/index.scss.js +1 -3
- package/lib/esm/use-table.js +261 -318
- package/lib/esm/utils/index.js +11 -41
- package/lib/types/BaseTable.d.ts +2 -2
- package/package.json +33 -33
|
@@ -16,17 +16,16 @@ import { CaretUpFilled, CaretDownFilled } from '@hi-ui/icons';
|
|
|
16
16
|
import Popper from '@hi-ui/popper';
|
|
17
17
|
import { useUncontrolledToggle } from '@hi-ui/use-toggle';
|
|
18
18
|
import { isFunction } from '@hi-ui/type-assertion';
|
|
19
|
-
|
|
20
19
|
var renderFilter = function renderFilter(_ref) {
|
|
21
20
|
var prefixCls = _ref.prefixCls,
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
column = _ref.column,
|
|
22
|
+
showColMenu = _ref.showColMenu,
|
|
23
|
+
onOpen = _ref.onOpen,
|
|
24
|
+
onClose = _ref.onClose;
|
|
26
25
|
var _column$raw = column.raw,
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
sorter = _column$raw.sorter,
|
|
27
|
+
filterIcon = _column$raw.filterIcon,
|
|
28
|
+
selectFilters = _column$raw.selectFilters;
|
|
30
29
|
return [showColMenu && /*#__PURE__*/React__default.createElement(TableColumnMenu, {
|
|
31
30
|
prefixCls: prefixCls + "-dropdown",
|
|
32
31
|
key: "0",
|
|
@@ -48,20 +47,16 @@ var renderFilter = function renderFilter(_ref) {
|
|
|
48
47
|
onClose: onClose
|
|
49
48
|
})].filter(Boolean);
|
|
50
49
|
};
|
|
51
|
-
|
|
52
50
|
var SorterMenu = function SorterMenu(_ref2) {
|
|
53
51
|
var _cx, _cx2;
|
|
54
|
-
|
|
55
52
|
var prefixCls = _ref2.prefixCls,
|
|
56
|
-
|
|
53
|
+
column = _ref2.column;
|
|
57
54
|
var columnKey = column.dataKey;
|
|
58
|
-
|
|
59
55
|
var _useTableContext = useTableContext(),
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
56
|
+
activeSorterColumn = _useTableContext.activeSorterColumn,
|
|
57
|
+
activeSorterType = _useTableContext.activeSorterType,
|
|
58
|
+
setActiveSorterColumn = _useTableContext.setActiveSorterColumn,
|
|
59
|
+
setActiveSorterType = _useTableContext.setActiveSorterType;
|
|
65
60
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
66
61
|
className: prefixCls
|
|
67
62
|
}, /*#__PURE__*/React__default.createElement("span", {
|
|
@@ -88,40 +83,36 @@ var SorterMenu = function SorterMenu(_ref2) {
|
|
|
88
83
|
}
|
|
89
84
|
}, /*#__PURE__*/React__default.createElement(CaretDownFilled, null)));
|
|
90
85
|
};
|
|
91
|
-
|
|
92
86
|
var FilterDropdown = function FilterDropdown(_ref3) {
|
|
93
87
|
var prefixCls = _ref3.prefixCls,
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
88
|
+
column = _ref3.column,
|
|
89
|
+
_onOpen = _ref3.onOpen,
|
|
90
|
+
_onClose = _ref3.onClose;
|
|
97
91
|
var _column$raw2 = column.raw,
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
92
|
+
filterIcon = _column$raw2.filterIcon,
|
|
93
|
+
filterDropdown = _column$raw2.filterDropdown,
|
|
94
|
+
filterDropdownWidth = _column$raw2.filterDropdownWidth,
|
|
95
|
+
filterDropdownVisible = _column$raw2.filterDropdownVisible,
|
|
96
|
+
filterDropdownOverlay = _column$raw2.filterDropdownOverlay,
|
|
97
|
+
onFilterDropdownVisibleChange = _column$raw2.onFilterDropdownVisibleChange,
|
|
98
|
+
filterDropdownClassName = _column$raw2.filterDropdownClassName;
|
|
106
99
|
var _useUncontrolledToggl = useUncontrolledToggle({
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
100
|
+
defaultVisible: false,
|
|
101
|
+
visible: filterDropdownVisible,
|
|
102
|
+
onOpen: function onOpen() {
|
|
103
|
+
_onOpen === null || _onOpen === void 0 ? void 0 : _onOpen();
|
|
104
|
+
onFilterDropdownVisibleChange === null || onFilterDropdownVisibleChange === void 0 ? void 0 : onFilterDropdownVisibleChange(true, column.raw);
|
|
105
|
+
},
|
|
106
|
+
onClose: function onClose() {
|
|
107
|
+
_onClose === null || _onClose === void 0 ? void 0 : _onClose();
|
|
108
|
+
onFilterDropdownVisibleChange === null || onFilterDropdownVisibleChange === void 0 ? void 0 : onFilterDropdownVisibleChange(false, column.raw);
|
|
109
|
+
}
|
|
110
|
+
}),
|
|
111
|
+
menuVisible = _useUncontrolledToggl[0],
|
|
112
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
|
121
113
|
var _React$useState = React__default.useState(null),
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
114
|
+
menuTrigger = _React$useState[0],
|
|
115
|
+
setMenuTrigger = _React$useState[1];
|
|
125
116
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
|
|
126
117
|
className: prefixCls + "__trigger",
|
|
127
118
|
ref: setMenuTrigger,
|
|
@@ -144,5 +135,4 @@ var FilterDropdown = function FilterDropdown(_ref3) {
|
|
|
144
135
|
setFilterDropdownVisible: menuVisibleAction.set
|
|
145
136
|
}) : null)));
|
|
146
137
|
};
|
|
147
|
-
|
|
148
138
|
export { FilterDropdown, SorterMenu, renderFilter };
|
package/lib/esm/TableBody.js
CHANGED
|
@@ -20,49 +20,43 @@ import { useTableContext } from './context.js';
|
|
|
20
20
|
import { ColGroupContent } from './ColGroupContent.js';
|
|
21
21
|
import { renderEmptyContent, TbodyContent } from './TbodyContent.js';
|
|
22
22
|
var _role = 'table';
|
|
23
|
-
|
|
24
23
|
var _prefix = getPrefixCls(_role);
|
|
25
|
-
|
|
26
24
|
var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
25
|
var _ref$prefixCls = _ref.prefixCls,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
|
|
27
|
+
emptyContent = _ref.emptyContent;
|
|
31
28
|
var _a;
|
|
32
|
-
|
|
33
29
|
var _useTableContext = useTableContext(),
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
30
|
+
columns = _useTableContext.columns,
|
|
31
|
+
isExpandTreeRows = _useTableContext.isExpandTreeRows,
|
|
32
|
+
transitionData = _useTableContext.transitionData,
|
|
33
|
+
bodyTableRef = _useTableContext.bodyTableRef,
|
|
34
|
+
scrollBodyElementRef = _useTableContext.scrollBodyElementRef,
|
|
35
|
+
onTableBodyScroll = _useTableContext.onTableBodyScroll,
|
|
36
|
+
onTableBodyScrollMock = _useTableContext.onTableBodyScrollMock,
|
|
37
|
+
maxHeight = _useTableContext.maxHeight,
|
|
38
|
+
canScroll = _useTableContext.canScroll,
|
|
39
|
+
scrollWidth = _useTableContext.scrollWidth,
|
|
40
|
+
colWidths = _useTableContext.colWidths,
|
|
41
|
+
virtual = _useTableContext.virtual,
|
|
42
|
+
measureRowElementRef = _useTableContext.measureRowElementRef,
|
|
43
|
+
scrollbar = _useTableContext.scrollbar;
|
|
49
44
|
var cls = cx(prefixCls + "-body");
|
|
50
45
|
var getRequiredProps = useLatestCallback(function (id) {
|
|
51
46
|
return {
|
|
52
47
|
// @ts-ignore
|
|
53
|
-
expandedTree: isExpandTreeRows(id)
|
|
48
|
+
expandedTree: isExpandTreeRows(id)
|
|
49
|
+
// checked: isCheckedId(id),
|
|
54
50
|
// semiChecked: isSemiCheckedId(id),
|
|
55
51
|
// selected: selectedId === id,
|
|
56
52
|
// loading: isLoadingId(id),
|
|
57
53
|
// focused: focusedId === id,
|
|
58
|
-
|
|
59
54
|
};
|
|
60
55
|
});
|
|
61
56
|
|
|
62
57
|
var _useState = useState(0),
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
58
|
+
scrollLeft = _useState[0],
|
|
59
|
+
setScrollLeft = _useState[1];
|
|
66
60
|
var rowWidth = useMemo(function () {
|
|
67
61
|
var tmpWidth = 0;
|
|
68
62
|
colWidths.forEach(function (width) {
|
|
@@ -72,11 +66,9 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
72
66
|
}, [colWidths]);
|
|
73
67
|
var onVirtualContainerScroll = useCallback(function (evt) {
|
|
74
68
|
var _a;
|
|
75
|
-
|
|
76
69
|
setScrollLeft(((_a = scrollBodyElementRef === null || scrollBodyElementRef === void 0 ? void 0 : scrollBodyElementRef.current) === null || _a === void 0 ? void 0 : _a.scrollLeft) || 0);
|
|
77
70
|
onTableBodyScroll(evt);
|
|
78
71
|
}, [scrollBodyElementRef, onTableBodyScroll]);
|
|
79
|
-
|
|
80
72
|
if (virtual) {
|
|
81
73
|
// TODO: avg和summay row的逻辑
|
|
82
74
|
var realHeight = (_a = scrollBodyElementRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height;
|
|
@@ -121,7 +113,8 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
121
113
|
position: 'relative',
|
|
122
114
|
left: -scrollLeft
|
|
123
115
|
}
|
|
124
|
-
}, /*#__PURE__*/React__default.createElement(TableRow
|
|
116
|
+
}, /*#__PURE__*/React__default.createElement(TableRow
|
|
117
|
+
// key={depth + index}
|
|
125
118
|
, Object.assign({
|
|
126
119
|
// key={depth + index}
|
|
127
120
|
key: row.id,
|
|
@@ -138,7 +131,6 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
138
131
|
scrollBodyWidth: window.getComputedStyle(scrollBodyElementRef.current).getPropertyValue('width')
|
|
139
132
|
} : {})));
|
|
140
133
|
}
|
|
141
|
-
|
|
142
134
|
var bodyContent = /*#__PURE__*/React__default.createElement("table", {
|
|
143
135
|
ref: bodyTableRef,
|
|
144
136
|
style: {
|
|
@@ -152,13 +144,11 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
152
144
|
style: {
|
|
153
145
|
maxHeight: maxHeight
|
|
154
146
|
}
|
|
155
|
-
};
|
|
156
|
-
|
|
147
|
+
};
|
|
148
|
+
// 外层增加 div 作为滚动容器
|
|
157
149
|
return !scrollbar ? /*#__PURE__*/React__default.createElement("div", Object.assign({}, scrollBodyProps), bodyContent) : /*#__PURE__*/React__default.createElement(Scrollbar, Object.assign({}, scrollBodyProps, isObject(scrollbar) ? scrollbar : null), bodyContent);
|
|
158
150
|
});
|
|
159
|
-
|
|
160
151
|
if (__DEV__) {
|
|
161
152
|
TableBody.displayName = 'TableBody';
|
|
162
153
|
}
|
|
163
|
-
|
|
164
154
|
export { TableBody };
|
package/lib/esm/TableCell.js
CHANGED
|
@@ -16,75 +16,65 @@ import { IconButton } from '@hi-ui/icon-button';
|
|
|
16
16
|
import { useTableContext } from './context.js';
|
|
17
17
|
import { defaultLoadingIcon, defaultExpandIcon, defaultCollapseIcon, defaultLeafIcon } from './icons/index.js';
|
|
18
18
|
import { EMBED_DATA_KEY } from './BaseTable.js';
|
|
19
|
-
|
|
20
19
|
var _prefix = getPrefixCls('table-cell');
|
|
21
20
|
/**
|
|
22
21
|
* 表格 body 单元格渲染
|
|
23
22
|
*/
|
|
24
|
-
|
|
25
|
-
|
|
26
23
|
var TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
24
|
var _ref$prefixCls = _ref.prefixCls,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
25
|
+
prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
|
|
26
|
+
className = _ref.className,
|
|
27
|
+
column = _ref.column,
|
|
28
|
+
rowData = _ref.rowData,
|
|
29
|
+
rowIndex = _ref.rowIndex,
|
|
30
|
+
colIndex = _ref.colIndex,
|
|
31
|
+
_ref$isSwitcherCol = _ref.isSwitcherCol,
|
|
32
|
+
isSwitcherCol = _ref$isSwitcherCol === void 0 ? false : _ref$isSwitcherCol,
|
|
33
|
+
_ref$expandedTree = _ref.expandedTree,
|
|
34
|
+
expandedTree = _ref$expandedTree === void 0 ? false : _ref$expandedTree,
|
|
35
|
+
_ref$expandedIcon = _ref.expandedIcon,
|
|
36
|
+
expandedIcon = _ref$expandedIcon === void 0 ? defaultExpandIcon : _ref$expandedIcon,
|
|
37
|
+
_ref$collapsedIcon = _ref.collapsedIcon,
|
|
38
|
+
collapsedIcon = _ref$collapsedIcon === void 0 ? defaultCollapseIcon : _ref$collapsedIcon,
|
|
39
|
+
_ref$leafIcon = _ref.leafIcon,
|
|
40
|
+
leafIcon = _ref$leafIcon === void 0 ? defaultLeafIcon : _ref$leafIcon;
|
|
45
41
|
var _useTableContext = useTableContext(),
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
42
|
+
isHighlightedCol = _useTableContext.isHighlightedCol,
|
|
43
|
+
onLoadChildren = _useTableContext.onLoadChildren,
|
|
44
|
+
isHoveredHighlightCol = _useTableContext.isHoveredHighlightCol,
|
|
45
|
+
showColHighlight = _useTableContext.showColHighlight,
|
|
46
|
+
onHoveredColChange = _useTableContext.onHoveredColChange,
|
|
47
|
+
onTreeNodeSwitch = _useTableContext.onTreeNodeSwitch,
|
|
48
|
+
getStickyColProps = _useTableContext.getStickyColProps,
|
|
49
|
+
canScroll = _useTableContext.canScroll,
|
|
50
|
+
isTree = _useTableContext.isTree,
|
|
51
|
+
cellRender = _useTableContext.cellRender,
|
|
52
|
+
isLoadingTreeNodeId = _useTableContext.isLoadingTreeNodeId,
|
|
53
|
+
colWidths = _useTableContext.colWidths,
|
|
54
|
+
virtual = _useTableContext.virtual;
|
|
60
55
|
var dataKey = column.id,
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
56
|
+
leftStickyWidth = column.leftStickyWidth,
|
|
57
|
+
rightStickyWidth = column.rightStickyWidth,
|
|
58
|
+
rawRender = column.render,
|
|
59
|
+
raw = column.raw;
|
|
65
60
|
var depth = rowData.depth,
|
|
66
|
-
|
|
61
|
+
rowId = rowData.id;
|
|
67
62
|
/**
|
|
68
63
|
* normalize 单元格渲染内容,支持自定义 render
|
|
69
64
|
*/
|
|
70
|
-
|
|
71
65
|
var cellContent = React__default.useMemo(function () {
|
|
72
66
|
var row = rowData.raw;
|
|
73
67
|
var content = row[dataKey];
|
|
74
|
-
|
|
75
68
|
if (isFunction(rawRender)) {
|
|
76
69
|
content = rawRender(content, EMBED_DATA_KEY === dataKey ? rowData : row, rowIndex, dataKey);
|
|
77
70
|
} else if (isFunction(cellRender)) {
|
|
78
71
|
content = cellRender(content);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
|
|
72
|
+
}
|
|
73
|
+
// 处理单元格内容,重载支持配置式合并单元格
|
|
82
74
|
var childrenMaybePropsReturn = isObject(content) && ! /*#__PURE__*/React__default.isValidElement(content);
|
|
83
|
-
|
|
84
75
|
if (childrenMaybePropsReturn) {
|
|
85
76
|
return content;
|
|
86
77
|
}
|
|
87
|
-
|
|
88
78
|
return {
|
|
89
79
|
children: content,
|
|
90
80
|
props: {
|
|
@@ -92,16 +82,14 @@ var TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
92
82
|
rowSpan: undefined
|
|
93
83
|
}
|
|
94
84
|
};
|
|
95
|
-
}, [rawRender, dataKey, rowData, rowIndex, cellRender]);
|
|
96
|
-
|
|
85
|
+
}, [rawRender, dataKey, rowData, rowIndex, cellRender]);
|
|
86
|
+
// 将被其它单元格(用户配置)合并,不进行渲染
|
|
97
87
|
if (cellContent.props.colSpan === 0 || cellContent.props.rowSpan === 0) {
|
|
98
88
|
return null;
|
|
99
89
|
}
|
|
100
|
-
|
|
101
90
|
var loading = isLoadingTreeNodeId(rowId);
|
|
102
91
|
var sticky = typeof rightStickyWidth !== 'undefined' || typeof leftStickyWidth !== 'undefined';
|
|
103
92
|
var cls = cx(prefixCls, className, raw.className, canScroll && sticky && prefixCls + "__col--sticky", isHighlightedCol(dataKey) && prefixCls + "__col--highlight", isHoveredHighlightCol(dataKey) && prefixCls + "__col--hovered-highlight");
|
|
104
|
-
|
|
105
93
|
if (virtual) {
|
|
106
94
|
var width = colWidths[colIndex];
|
|
107
95
|
var colProps = getStickyColProps(column);
|
|
@@ -138,7 +126,6 @@ var TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
138
126
|
}
|
|
139
127
|
}) : null, cellContent.children);
|
|
140
128
|
}
|
|
141
|
-
|
|
142
129
|
return /*#__PURE__*/React__default.createElement("td", Object.assign({
|
|
143
130
|
ref: ref,
|
|
144
131
|
key: dataKey,
|
|
@@ -171,18 +158,15 @@ var TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
171
158
|
}
|
|
172
159
|
}) : null, cellContent.children);
|
|
173
160
|
});
|
|
174
|
-
|
|
175
161
|
if (__DEV__) {
|
|
176
162
|
TableCell.displayName = 'TableCell';
|
|
177
163
|
}
|
|
178
164
|
/**
|
|
179
165
|
* 渲染空白占位
|
|
180
166
|
*/
|
|
181
|
-
|
|
182
|
-
|
|
183
167
|
var renderIndent = function renderIndent(_ref2) {
|
|
184
168
|
var prefixCls = _ref2.prefixCls,
|
|
185
|
-
|
|
169
|
+
depth = _ref2.depth;
|
|
186
170
|
return times(depth, function (index) {
|
|
187
171
|
return /*#__PURE__*/React__default.createElement("span", {
|
|
188
172
|
className: prefixCls + "__indent",
|
|
@@ -193,30 +177,25 @@ var renderIndent = function renderIndent(_ref2) {
|
|
|
193
177
|
/**
|
|
194
178
|
* 渲染子树折叠切换器
|
|
195
179
|
*/
|
|
196
|
-
|
|
197
|
-
|
|
198
180
|
var renderSwitcher = function renderSwitcher(_ref3) {
|
|
199
181
|
var prefixCls = _ref3.prefixCls,
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
182
|
+
node = _ref3.node,
|
|
183
|
+
loading = _ref3.loading,
|
|
184
|
+
expanded = _ref3.expanded,
|
|
185
|
+
expandedIcon = _ref3.expandedIcon,
|
|
186
|
+
collapsedIcon = _ref3.collapsedIcon,
|
|
187
|
+
leafIcon = _ref3.leafIcon,
|
|
188
|
+
onNodeExpand = _ref3.onNodeExpand,
|
|
189
|
+
onLoadChildren = _ref3.onLoadChildren,
|
|
190
|
+
isTree = _ref3.isTree;
|
|
210
191
|
if (loading) {
|
|
211
192
|
return /*#__PURE__*/React__default.createElement(IconButton, {
|
|
212
193
|
className: cx(prefixCls + "__switcher", prefixCls + "__switcher--loading"),
|
|
213
194
|
icon: defaultLoadingIcon
|
|
214
195
|
});
|
|
215
196
|
}
|
|
216
|
-
|
|
217
197
|
var hasChildren = node.children && node.children.length > 0;
|
|
218
198
|
var canLoadChildren = onLoadChildren && !node.children && !node.isLeaf;
|
|
219
|
-
|
|
220
199
|
if (hasChildren || canLoadChildren) {
|
|
221
200
|
return /*#__PURE__*/React__default.createElement(IconButton, {
|
|
222
201
|
tabIndex: -1,
|
|
@@ -228,7 +207,6 @@ var renderSwitcher = function renderSwitcher(_ref3) {
|
|
|
228
207
|
}
|
|
229
208
|
});
|
|
230
209
|
}
|
|
231
|
-
|
|
232
210
|
if (isTree) {
|
|
233
211
|
return /*#__PURE__*/React__default.createElement(IconButton, {
|
|
234
212
|
tabIndex: -1,
|
|
@@ -236,8 +214,6 @@ var renderSwitcher = function renderSwitcher(_ref3) {
|
|
|
236
214
|
icon: leafIcon
|
|
237
215
|
});
|
|
238
216
|
}
|
|
239
|
-
|
|
240
217
|
return null;
|
|
241
218
|
};
|
|
242
|
-
|
|
243
219
|
export { TableCell };
|
|
@@ -16,46 +16,38 @@ import Popper from '@hi-ui/popper';
|
|
|
16
16
|
import { useUncontrolledToggle } from '@hi-ui/use-toggle';
|
|
17
17
|
import { useTableContext } from './context.js';
|
|
18
18
|
import { useLocaleContext } from '@hi-ui/core';
|
|
19
|
-
|
|
20
19
|
var _prefix = getPrefixCls('table-column-menu');
|
|
21
20
|
/**
|
|
22
21
|
* 表头每列下拉式菜单,包含冻结、高亮、递增、递减操作
|
|
23
22
|
*/
|
|
24
|
-
|
|
25
|
-
|
|
26
23
|
var TableColumnMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
24
|
var _ref$prefixCls = _ref.prefixCls,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
25
|
+
prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
|
|
26
|
+
column = _ref.column,
|
|
27
|
+
onOpen = _ref.onOpen,
|
|
28
|
+
onClose = _ref.onClose;
|
|
32
29
|
var i18n = useLocaleContext();
|
|
33
|
-
|
|
34
30
|
var _useTableContext = useTableContext(),
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
31
|
+
activeSorterType = _useTableContext.activeSorterType,
|
|
32
|
+
activeSorterColumn = _useTableContext.activeSorterColumn,
|
|
33
|
+
setActiveSorterType = _useTableContext.setActiveSorterType,
|
|
34
|
+
setActiveSorterColumn = _useTableContext.setActiveSorterColumn,
|
|
35
|
+
leftFreezeColumn = _useTableContext.leftFreezeColumn,
|
|
36
|
+
setLeftFreezeColumn = _useTableContext.setLeftFreezeColumn,
|
|
37
|
+
isHighlightedCol = _useTableContext.isHighlightedCol,
|
|
38
|
+
onHighlightedColChange = _useTableContext.onHighlightedColChange;
|
|
44
39
|
var dataKey = column.id,
|
|
45
|
-
|
|
40
|
+
columnRaw = column.raw;
|
|
46
41
|
var canSort = !!columnRaw.sorter;
|
|
47
|
-
|
|
48
42
|
var _useUncontrolledToggl = useUncontrolledToggle({
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
43
|
+
onOpen: onOpen,
|
|
44
|
+
onClose: onClose
|
|
45
|
+
}),
|
|
46
|
+
menuVisible = _useUncontrolledToggl[0],
|
|
47
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
|
55
48
|
var _React$useState = React__default.useState(null),
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
49
|
+
menuTrigger = _React$useState[0],
|
|
50
|
+
setMenuTrigger = _React$useState[1];
|
|
59
51
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IconButton, {
|
|
60
52
|
className: prefixCls + "__trigger",
|
|
61
53
|
ref: setMenuTrigger,
|
|
@@ -83,7 +75,6 @@ var TableColumnMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
83
75
|
setActiveSorterType(null);
|
|
84
76
|
setActiveSorterColumn(null);
|
|
85
77
|
}
|
|
86
|
-
|
|
87
78
|
menuVisibleAction.off();
|
|
88
79
|
}
|
|
89
80
|
}) : null, canSort ? /*#__PURE__*/React__default.createElement(TableColumnMenuItem, {
|
|
@@ -99,7 +90,6 @@ var TableColumnMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
99
90
|
setActiveSorterType(null);
|
|
100
91
|
setActiveSorterColumn(null);
|
|
101
92
|
}
|
|
102
|
-
|
|
103
93
|
menuVisibleAction.off();
|
|
104
94
|
}
|
|
105
95
|
}) : null, /*#__PURE__*/React__default.createElement(TableColumnMenuItem, {
|
|
@@ -122,22 +112,19 @@ var TableColumnMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
122
112
|
} else {
|
|
123
113
|
setLeftFreezeColumn('');
|
|
124
114
|
}
|
|
125
|
-
|
|
126
115
|
menuVisibleAction.off();
|
|
127
116
|
}
|
|
128
117
|
}))));
|
|
129
118
|
});
|
|
130
|
-
|
|
131
119
|
if (__DEV__) {
|
|
132
120
|
TableColumnMenu.displayName = 'TableColumnMenu';
|
|
133
121
|
}
|
|
134
|
-
|
|
135
122
|
var TableColumnMenuItem = function TableColumnMenuItem(_ref2) {
|
|
136
123
|
var prefixCls = _ref2.prefixCls,
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
124
|
+
active = _ref2.active,
|
|
125
|
+
onSwitch = _ref2.onSwitch,
|
|
126
|
+
content = _ref2.content,
|
|
127
|
+
icon = _ref2.icon;
|
|
141
128
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
142
129
|
className: cx(prefixCls + "__item", active && prefixCls + "__item--active"),
|
|
143
130
|
onClick: function onClick() {
|
|
@@ -145,5 +132,4 @@ var TableColumnMenuItem = function TableColumnMenuItem(_ref2) {
|
|
|
145
132
|
}
|
|
146
133
|
}, /*#__PURE__*/React__default.createElement("span", null, content), icon);
|
|
147
134
|
};
|
|
148
|
-
|
|
149
135
|
export { TableColumnMenu, TableColumnMenuItem };
|
package/lib/esm/TableEmbedRow.js
CHANGED
|
@@ -12,26 +12,21 @@ import { getPrefixCls } from '@hi-ui/classname';
|
|
|
12
12
|
import { __DEV__ } from '@hi-ui/env';
|
|
13
13
|
import { useTableContext } from './context.js';
|
|
14
14
|
import Loading from '@hi-ui/loading';
|
|
15
|
-
|
|
16
15
|
var _prefix = getPrefixCls('table-embed-row');
|
|
17
16
|
/**
|
|
18
17
|
* 可展开的内嵌面板
|
|
19
18
|
*/
|
|
20
|
-
|
|
21
|
-
|
|
22
19
|
var TableEmbedRow = function TableEmbedRow(_ref) {
|
|
23
20
|
var _ref$prefixCls = _ref.prefixCls,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
21
|
+
prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
|
|
22
|
+
colSpan = _ref.colSpan,
|
|
23
|
+
rowIndex = _ref.rowIndex,
|
|
24
|
+
rowData = _ref.rowData;
|
|
29
25
|
var _useTableContext = useTableContext(),
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
26
|
+
isExpandEmbedRows = _useTableContext.isExpandEmbedRows,
|
|
27
|
+
getEmbedPanelById = _useTableContext.getEmbedPanelById,
|
|
28
|
+
isEmbedLoadingId = _useTableContext.isEmbedLoadingId,
|
|
29
|
+
onEmbedSwitch = _useTableContext.onEmbedSwitch;
|
|
35
30
|
var loading = isEmbedLoadingId(rowData.id);
|
|
36
31
|
var expanded = isExpandEmbedRows(rowData.id);
|
|
37
32
|
useEffect(function () {
|
|
@@ -51,9 +46,7 @@ var TableEmbedRow = function TableEmbedRow(_ref) {
|
|
|
51
46
|
part: true
|
|
52
47
|
}, getEmbedPanelById(rowData.id)))) : null;
|
|
53
48
|
};
|
|
54
|
-
|
|
55
49
|
if (__DEV__) {
|
|
56
50
|
TableEmbedRow.displayName = 'TableEmbedRow';
|
|
57
51
|
}
|
|
58
|
-
|
|
59
52
|
export { TableEmbedRow };
|
package/lib/esm/TableHeader.js
CHANGED
|
@@ -13,19 +13,15 @@ import { __DEV__ } from '@hi-ui/env';
|
|
|
13
13
|
import { useTableContext } from './context.js';
|
|
14
14
|
import { ColGroupContent } from './ColGroupContent.js';
|
|
15
15
|
import { TheadContent } from './TheadContent.js';
|
|
16
|
-
|
|
17
16
|
var _prefix = getPrefixCls('table-header');
|
|
18
|
-
|
|
19
17
|
var TableHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
20
18
|
var _ref$prefixCls = _ref.prefixCls,
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
|
|
20
|
+
className = _ref.className;
|
|
24
21
|
var _useTableContext = useTableContext(),
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
22
|
+
onTableBodyScrollMock = _useTableContext.onTableBodyScrollMock,
|
|
23
|
+
scrollHeaderElementRef = _useTableContext.scrollHeaderElementRef,
|
|
24
|
+
getTableHeaderProps = _useTableContext.getTableHeaderProps;
|
|
29
25
|
var cls = cx(prefixCls, className);
|
|
30
26
|
return /*#__PURE__*/React__default.createElement("div", Object.assign({
|
|
31
27
|
className: cls,
|
|
@@ -39,9 +35,7 @@ var TableHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
39
35
|
onWheel: onTableBodyScrollMock
|
|
40
36
|
})));
|
|
41
37
|
});
|
|
42
|
-
|
|
43
38
|
if (__DEV__) {
|
|
44
39
|
TableHeader.displayName = 'TableHeader';
|
|
45
40
|
}
|
|
46
|
-
|
|
47
41
|
export { TableHeader };
|