linkmore-design 1.1.11 → 1.1.13-alpha.0
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 +34 -0
- package/dist/Cascader/demos/formItem.d.ts +2 -0
- package/dist/LmEditTable/DndContainer.d.ts +4 -3
- package/dist/LmEditTable/EditTable.d.ts +2 -0
- package/dist/LmEditTable/components/DraggableContainer.d.ts +7 -0
- package/dist/LmEditTable/components/index.d.ts +11 -0
- package/dist/LmEditTable/sortableItem.d.ts +3 -2
- package/dist/LmEditTable/util.d.ts +2 -0
- package/dist/LmEditTable/virtual/VirtualRow.d.ts +6 -0
- package/dist/LmEditTable/virtual/VirtualRowBack.d.ts +6 -0
- package/dist/LmEditTable/virtual/VirtualTable.d.ts +3 -0
- package/dist/LmEditTable/virtual/VirtualWrapper.d.ts +3 -0
- package/dist/LmEditTable/virtual/context.d.ts +13 -0
- package/dist/LmEditTable/virtual/index.d.ts +4 -0
- package/dist/Select/demos/formItem.d.ts +2 -0
- package/dist/Select/index.d.ts +1 -0
- package/dist/TreeSelect/demos/formItem.d.ts +2 -0
- package/dist/TreeSelect/index.d.ts +8 -3
- package/dist/index.umd.js +629 -226
- package/dist/index.umd.min.js +5 -5
- package/dist/variables.css +47 -0
- package/es/IconFont/index.js +1 -1
- package/es/LmEditTable/DndContainer.d.ts +4 -3
- package/es/LmEditTable/DndContainer.js +2 -2
- package/es/LmEditTable/EditTable.d.ts +2 -0
- package/es/LmEditTable/EditTable.js +200 -158
- package/es/LmEditTable/components/DraggableContainer.d.ts +7 -0
- package/es/LmEditTable/components/DraggableContainer.js +32 -0
- package/es/LmEditTable/components/index.d.ts +11 -0
- package/es/LmEditTable/components/index.js +5 -0
- package/es/LmEditTable/sortableItem.d.ts +3 -2
- package/es/LmEditTable/sortableItem.js +15 -4
- package/es/LmEditTable/style/index.css +47 -0
- package/es/LmEditTable/style/variables.css +47 -0
- package/es/LmEditTable/util.d.ts +2 -0
- package/es/LmEditTable/util.js +37 -1
- package/es/LmEditTable/virtual/VirtualRow.d.ts +6 -0
- package/es/LmEditTable/virtual/VirtualRow.js +60 -0
- package/es/LmEditTable/virtual/VirtualRowBack.d.ts +6 -0
- package/es/LmEditTable/virtual/VirtualRowBack.js +102 -0
- package/es/LmEditTable/virtual/VirtualTable.d.ts +3 -0
- package/es/LmEditTable/virtual/VirtualTable.js +54 -0
- package/es/LmEditTable/virtual/VirtualWrapper.d.ts +3 -0
- package/es/LmEditTable/virtual/VirtualWrapper.js +60 -0
- package/es/LmEditTable/virtual/context.d.ts +13 -0
- package/es/LmEditTable/virtual/context.js +54 -0
- package/es/LmEditTable/virtual/index.d.ts +4 -0
- package/es/LmEditTable/virtual/index.js +4 -0
- package/es/Select/index.d.ts +1 -0
- package/es/Select/index.js +38 -4
- package/es/TreeSelect/index.d.ts +8 -3
- package/es/TreeSelect/index.js +74 -1
- package/es/hooks/useEvent/index.js +1 -1
- package/es/styles/variables.css +47 -0
- package/lib/IconFont/index.js +1 -1
- package/lib/LmEditTable/DndContainer.d.ts +4 -3
- package/lib/LmEditTable/DndContainer.js +4 -3
- package/lib/LmEditTable/EditTable.d.ts +2 -0
- package/lib/LmEditTable/EditTable.js +195 -153
- package/lib/LmEditTable/components/DraggableContainer.d.ts +7 -0
- package/lib/LmEditTable/components/DraggableContainer.js +45 -0
- package/lib/LmEditTable/components/index.d.ts +11 -0
- package/lib/LmEditTable/components/index.js +21 -0
- package/lib/LmEditTable/sortableItem.d.ts +3 -2
- package/lib/LmEditTable/sortableItem.js +18 -5
- package/lib/LmEditTable/style/index.css +47 -0
- package/lib/LmEditTable/style/variables.css +47 -0
- package/lib/LmEditTable/util.d.ts +2 -0
- package/lib/LmEditTable/util.js +40 -0
- package/lib/LmEditTable/virtual/VirtualRow.d.ts +6 -0
- package/lib/LmEditTable/virtual/VirtualRow.js +73 -0
- package/lib/LmEditTable/virtual/VirtualRowBack.d.ts +6 -0
- package/lib/LmEditTable/virtual/VirtualRowBack.js +115 -0
- package/lib/LmEditTable/virtual/VirtualTable.d.ts +3 -0
- package/lib/LmEditTable/virtual/VirtualTable.js +71 -0
- package/lib/LmEditTable/virtual/VirtualWrapper.d.ts +3 -0
- package/lib/LmEditTable/virtual/VirtualWrapper.js +73 -0
- package/lib/LmEditTable/virtual/context.d.ts +13 -0
- package/lib/LmEditTable/virtual/context.js +64 -0
- package/lib/LmEditTable/virtual/index.d.ts +4 -0
- package/lib/LmEditTable/virtual/index.js +31 -0
- package/lib/Select/index.d.ts +1 -0
- package/lib/Select/index.js +37 -3
- package/lib/TreeSelect/index.d.ts +8 -3
- package/lib/TreeSelect/index.js +78 -1
- package/lib/hooks/useEvent/index.js +1 -1
- package/lib/styles/variables.css +47 -0
- package/package.json +1 -1
|
@@ -11,15 +11,17 @@ var __rest = this && this.__rest || function (s, e) {
|
|
|
11
11
|
return t;
|
|
12
12
|
};
|
|
13
13
|
|
|
14
|
-
import React from 'react';
|
|
14
|
+
import React, { memo } from 'react';
|
|
15
15
|
import { useSortable } from '@dnd-kit/sortable';
|
|
16
16
|
import { CSS } from '@dnd-kit/utilities';
|
|
17
|
+
import { VirtualRow } from './virtual';
|
|
17
18
|
|
|
18
19
|
var SortableItem = function SortableItem(props) {
|
|
19
20
|
var key = props['data-row-key'],
|
|
20
21
|
children = props.children,
|
|
21
22
|
className = props.className,
|
|
22
|
-
|
|
23
|
+
virtual = props.virtual,
|
|
24
|
+
resetField = __rest(props, ['data-row-key', "children", "className", "virtual"]);
|
|
23
25
|
|
|
24
26
|
var _useSortable = useSortable({
|
|
25
27
|
id: key
|
|
@@ -33,11 +35,20 @@ var SortableItem = function SortableItem(props) {
|
|
|
33
35
|
transform: CSS.Transform.toString(transform),
|
|
34
36
|
transition: transition
|
|
35
37
|
};
|
|
36
|
-
|
|
38
|
+
|
|
39
|
+
if (!virtual) {
|
|
40
|
+
return /*#__PURE__*/React.createElement("tr", Object.assign({}, resetField, {
|
|
41
|
+
ref: setNodeRef,
|
|
42
|
+
key: key,
|
|
43
|
+
style: style
|
|
44
|
+
}, attributes), children);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
return /*#__PURE__*/React.createElement(VirtualRow, Object.assign({}, resetField, {
|
|
37
48
|
ref: setNodeRef,
|
|
38
49
|
key: key,
|
|
39
50
|
style: style
|
|
40
51
|
}, attributes), children);
|
|
41
52
|
};
|
|
42
53
|
|
|
43
|
-
export default SortableItem;
|
|
54
|
+
export default /*#__PURE__*/memo(SortableItem);
|
|
@@ -549,6 +549,9 @@ p {
|
|
|
549
549
|
letter-spacing: 0px;
|
|
550
550
|
color: var(--color-85);
|
|
551
551
|
}
|
|
552
|
+
.lm_editTable_warpper .lm_custom_cell_td {
|
|
553
|
+
position: relative;
|
|
554
|
+
}
|
|
552
555
|
.lm_editTable_warpper .lm_custom_cell_td .ant-form-item-control-input-content {
|
|
553
556
|
display: flex;
|
|
554
557
|
flex-direction: row;
|
|
@@ -560,6 +563,32 @@ p {
|
|
|
560
563
|
.lm_editTable_warpper .lm_custom_cell_td .ant-table-row-expand-icon {
|
|
561
564
|
margin-top: 6px;
|
|
562
565
|
}
|
|
566
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp {
|
|
567
|
+
font-size: 8px;
|
|
568
|
+
position: absolute;
|
|
569
|
+
left: calc(50% - 10px);
|
|
570
|
+
z-index: 100;
|
|
571
|
+
width: 20px;
|
|
572
|
+
height: 10px;
|
|
573
|
+
background-color: var(--color-6);
|
|
574
|
+
display: flex;
|
|
575
|
+
align-items: center;
|
|
576
|
+
justify-content: center;
|
|
577
|
+
color: #D8D8D8;
|
|
578
|
+
}
|
|
579
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp:hover {
|
|
580
|
+
cursor: pointer;
|
|
581
|
+
background-color: var(--primary-color);
|
|
582
|
+
color: #fff;
|
|
583
|
+
}
|
|
584
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_up {
|
|
585
|
+
top: -4px;
|
|
586
|
+
left: calc(50% - 10px);
|
|
587
|
+
}
|
|
588
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_down {
|
|
589
|
+
bottom: -6px;
|
|
590
|
+
left: calc(50% - 10px);
|
|
591
|
+
}
|
|
563
592
|
.lm_editTable_warpper .lm_editTable_cell_edit {
|
|
564
593
|
height: 40px;
|
|
565
594
|
padding: 8px 8px !important;
|
|
@@ -609,3 +638,21 @@ p {
|
|
|
609
638
|
color: var(--color-85);
|
|
610
639
|
margin-left: 0 !important;
|
|
611
640
|
}
|
|
641
|
+
.lm_table_append_add_popover .ant-popover-inner-content {
|
|
642
|
+
padding: 0px;
|
|
643
|
+
}
|
|
644
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul {
|
|
645
|
+
margin: 0;
|
|
646
|
+
}
|
|
647
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul li {
|
|
648
|
+
font-size: 12px;
|
|
649
|
+
padding: 4px 8px;
|
|
650
|
+
height: 24px;
|
|
651
|
+
display: flex;
|
|
652
|
+
align-items: center;
|
|
653
|
+
justify-content: center;
|
|
654
|
+
cursor: pointer;
|
|
655
|
+
}
|
|
656
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul li:hover {
|
|
657
|
+
background-color: var(--color-15);
|
|
658
|
+
}
|
|
@@ -37,6 +37,9 @@
|
|
|
37
37
|
letter-spacing: 0px;
|
|
38
38
|
color: var(--color-85);
|
|
39
39
|
}
|
|
40
|
+
.lm_editTable_warpper .lm_custom_cell_td {
|
|
41
|
+
position: relative;
|
|
42
|
+
}
|
|
40
43
|
.lm_editTable_warpper .lm_custom_cell_td .ant-form-item-control-input-content {
|
|
41
44
|
display: flex;
|
|
42
45
|
flex-direction: row;
|
|
@@ -48,6 +51,32 @@
|
|
|
48
51
|
.lm_editTable_warpper .lm_custom_cell_td .ant-table-row-expand-icon {
|
|
49
52
|
margin-top: 6px;
|
|
50
53
|
}
|
|
54
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp {
|
|
55
|
+
font-size: 8px;
|
|
56
|
+
position: absolute;
|
|
57
|
+
left: calc(50% - 10px);
|
|
58
|
+
z-index: 100;
|
|
59
|
+
width: 20px;
|
|
60
|
+
height: 10px;
|
|
61
|
+
background-color: var(--color-6);
|
|
62
|
+
display: flex;
|
|
63
|
+
align-items: center;
|
|
64
|
+
justify-content: center;
|
|
65
|
+
color: #D8D8D8;
|
|
66
|
+
}
|
|
67
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp:hover {
|
|
68
|
+
cursor: pointer;
|
|
69
|
+
background-color: var(--primary-color);
|
|
70
|
+
color: #fff;
|
|
71
|
+
}
|
|
72
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_up {
|
|
73
|
+
top: -4px;
|
|
74
|
+
left: calc(50% - 10px);
|
|
75
|
+
}
|
|
76
|
+
.lm_editTable_warpper .lm_custom_cell_td .quick_copy_down {
|
|
77
|
+
bottom: -6px;
|
|
78
|
+
left: calc(50% - 10px);
|
|
79
|
+
}
|
|
51
80
|
.lm_editTable_warpper .lm_editTable_cell_edit {
|
|
52
81
|
height: 40px;
|
|
53
82
|
padding: 8px 8px !important;
|
|
@@ -97,3 +126,21 @@
|
|
|
97
126
|
color: var(--color-85);
|
|
98
127
|
margin-left: 0 !important;
|
|
99
128
|
}
|
|
129
|
+
.lm_table_append_add_popover .ant-popover-inner-content {
|
|
130
|
+
padding: 0px;
|
|
131
|
+
}
|
|
132
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul {
|
|
133
|
+
margin: 0;
|
|
134
|
+
}
|
|
135
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul li {
|
|
136
|
+
font-size: 12px;
|
|
137
|
+
padding: 4px 8px;
|
|
138
|
+
height: 24px;
|
|
139
|
+
display: flex;
|
|
140
|
+
align-items: center;
|
|
141
|
+
justify-content: center;
|
|
142
|
+
cursor: pointer;
|
|
143
|
+
}
|
|
144
|
+
.lm_table_append_add_popover .ant-popover-inner-content ul li:hover {
|
|
145
|
+
background-color: var(--color-15);
|
|
146
|
+
}
|
package/es/LmEditTable/util.d.ts
CHANGED
|
@@ -2,6 +2,8 @@ export declare function isObjEmpty(obj: Record<string, any>): boolean;
|
|
|
2
2
|
export declare function deepDataSourcePreKeys(dataSource: any[], rowKey: string): any;
|
|
3
3
|
export declare function isExpandRow(children: any): boolean;
|
|
4
4
|
export declare function checkRowKeyByDataSource(dataSource: any, rowKey: any): any;
|
|
5
|
+
export declare function getExpandStatus(children: any): any;
|
|
6
|
+
export declare function checkMemoShouldUploadSpecialFun(prev: any, next: any): any;
|
|
5
7
|
declare const _default: {
|
|
6
8
|
isObjEmpty: typeof isObjEmpty;
|
|
7
9
|
};
|
package/es/LmEditTable/util.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
3
|
-
import { keyBy } from 'lodash';
|
|
3
|
+
import { keyBy, isEqual, pick } from 'lodash';
|
|
4
4
|
export function isObjEmpty(obj) {
|
|
5
5
|
var _a;
|
|
6
6
|
|
|
@@ -55,6 +55,42 @@ export function checkRowKeyByDataSource(dataSource, rowKey) {
|
|
|
55
55
|
});
|
|
56
56
|
return res;
|
|
57
57
|
}
|
|
58
|
+
export function getExpandStatus(children) {
|
|
59
|
+
var _a, _b, _c, _d, _e;
|
|
60
|
+
|
|
61
|
+
return isExpandRow(children) ? (_e = (_d = (_c = (_b = (_a = children === null || children === void 0 ? void 0 : children[0]) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.children) === null || _c === void 0 ? void 0 : _c[1]) === null || _d === void 0 ? void 0 : _d.props) === null || _e === void 0 ? void 0 : _e['aria-label'] : '';
|
|
62
|
+
}
|
|
63
|
+
export function checkMemoShouldUploadSpecialFun(prev, next) {
|
|
64
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
65
|
+
|
|
66
|
+
var checkExpandStatus = getExpandStatus(prev.children) === getExpandStatus(next.children);
|
|
67
|
+
|
|
68
|
+
if (!checkExpandStatus) {
|
|
69
|
+
return false;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
var prevCol = prev === null || prev === void 0 ? void 0 : prev.col;
|
|
73
|
+
var nextCol = next === null || next === void 0 ? void 0 : next.col;
|
|
74
|
+
|
|
75
|
+
if (((_a = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _a === void 0 ? void 0 : _a.optionOnly) || ((_b = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _b === void 0 ? void 0 : _b.optionOnly)) {
|
|
76
|
+
return isEqual((_c = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _c === void 0 ? void 0 : _c.options, (_d = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _d === void 0 ? void 0 : _d.options);
|
|
77
|
+
}
|
|
78
|
+
/** 如果启用了快速复制功能,需要实时判断rowIndex与getLength */
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
if (((_e = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _e === void 0 ? void 0 : _e.quickcopy) || ((_f = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _f === void 0 ? void 0 : _f.quickcopy)) {
|
|
82
|
+
var pickProps = ['record', 'colIndex', 'rowIndex', 'getLength'];
|
|
83
|
+
var p = pick(prev, pickProps);
|
|
84
|
+
var n = pick(next, pickProps);
|
|
85
|
+
return isEqual(p, n);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
if (next.className.indexOf('ant-table-selection-column') > -1) {
|
|
89
|
+
return isEqual((_h = (_g = prev.children) === null || _g === void 0 ? void 0 : _g[1]) === null || _h === void 0 ? void 0 : _h.props, (_k = (_j = next.children) === null || _j === void 0 ? void 0 : _j[1]) === null || _k === void 0 ? void 0 : _k.props);
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
return true;
|
|
93
|
+
}
|
|
58
94
|
export default {
|
|
59
95
|
isObjEmpty: isObjEmpty
|
|
60
96
|
};
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
var __rest = this && this.__rest || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
|
|
4
|
+
for (var p in s) {
|
|
5
|
+
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
import React, { useRef, useMemo, useEffect } from 'react';
|
|
15
|
+
import { useStore } from './context';
|
|
16
|
+
var VirtualRow = /*#__PURE__*/React.memo(function (_a, ref) {
|
|
17
|
+
var children = _a.children,
|
|
18
|
+
resetProps = __rest(_a, ["children"]);
|
|
19
|
+
|
|
20
|
+
var _useStore = useStore(),
|
|
21
|
+
state = _useStore.state,
|
|
22
|
+
dispatch = _useStore.dispatch;
|
|
23
|
+
|
|
24
|
+
var rowHeight = state.rowHeight,
|
|
25
|
+
totalLen = state.totalLen;
|
|
26
|
+
var trRef = useRef(null); // 列长度
|
|
27
|
+
|
|
28
|
+
var columnsLen = useMemo(function () {
|
|
29
|
+
var _a;
|
|
30
|
+
|
|
31
|
+
return (_a = children === null || children === void 0 ? void 0 : children.length) !== null && _a !== void 0 ? _a : 0;
|
|
32
|
+
}, [children]);
|
|
33
|
+
useEffect(function () {
|
|
34
|
+
if (state.columnsLen !== columnsLen) {
|
|
35
|
+
dispatch({
|
|
36
|
+
type: 'changeColumnsLen',
|
|
37
|
+
columnsLen: columnsLen !== null && columnsLen !== void 0 ? columnsLen : 0
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
}, [columnsLen, dispatch, state.columnsLen]);
|
|
41
|
+
useEffect(function () {
|
|
42
|
+
var initHeight = function initHeight(tempRef) {
|
|
43
|
+
var _a, _b, _c;
|
|
44
|
+
|
|
45
|
+
if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
|
|
46
|
+
var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
|
|
47
|
+
dispatch({
|
|
48
|
+
type: 'initHeight',
|
|
49
|
+
rowHeight: tempRowHeight
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
initHeight(Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef);
|
|
55
|
+
}, [trRef, dispatch, rowHeight, totalLen, ref]);
|
|
56
|
+
return /*#__PURE__*/React.createElement("tr", Object.assign({}, resetProps, {
|
|
57
|
+
ref: Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef
|
|
58
|
+
}), children);
|
|
59
|
+
});
|
|
60
|
+
export default VirtualRow;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
var __rest = this && this.__rest || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
|
|
4
|
+
for (var p in s) {
|
|
5
|
+
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
import React, { useRef, useMemo, useEffect } from 'react';
|
|
15
|
+
import { useStore } from './context';
|
|
16
|
+
var VirtualRow = /*#__PURE__*/React.memo(function (_a, ref) {
|
|
17
|
+
var children = _a.children,
|
|
18
|
+
resetProps = __rest(_a, ["children"]);
|
|
19
|
+
|
|
20
|
+
var _useStore = useStore(),
|
|
21
|
+
state = _useStore.state,
|
|
22
|
+
dispatch = _useStore.dispatch,
|
|
23
|
+
instance = _useStore.instance;
|
|
24
|
+
|
|
25
|
+
var rowHeight = state.rowHeight,
|
|
26
|
+
totalLen = state.totalLen;
|
|
27
|
+
var virtualItems = instance.columnVirtual.virtualItems;
|
|
28
|
+
var trRef = useRef(null); // 列长度
|
|
29
|
+
|
|
30
|
+
var columnsLen = useMemo(function () {
|
|
31
|
+
var _a;
|
|
32
|
+
|
|
33
|
+
return (_a = children === null || children === void 0 ? void 0 : children.length) !== null && _a !== void 0 ? _a : 0;
|
|
34
|
+
}, [children]);
|
|
35
|
+
useEffect(function () {
|
|
36
|
+
if (state.columnsLen !== columnsLen) {
|
|
37
|
+
dispatch({
|
|
38
|
+
type: 'changeColumnsLen',
|
|
39
|
+
columnsLen: columnsLen !== null && columnsLen !== void 0 ? columnsLen : 0
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
}, [columnsLen, dispatch, state.columnsLen]);
|
|
43
|
+
useEffect(function () {
|
|
44
|
+
var initHeight = function initHeight(tempRef) {
|
|
45
|
+
var _a, _b, _c;
|
|
46
|
+
|
|
47
|
+
if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
|
|
48
|
+
var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
|
|
49
|
+
dispatch({
|
|
50
|
+
type: 'initHeight',
|
|
51
|
+
rowHeight: tempRowHeight
|
|
52
|
+
});
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
initHeight(Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef);
|
|
57
|
+
}, [trRef, dispatch, rowHeight, totalLen, ref]); // return {fixedLeft: [], fixedRight: [], columns: []}
|
|
58
|
+
|
|
59
|
+
var fixedColumns = useMemo(function () {
|
|
60
|
+
return children === null || children === void 0 ? void 0 : children.reduce(function (pre, cur) {
|
|
61
|
+
var _a, _b;
|
|
62
|
+
|
|
63
|
+
if (typeof ((_a = cur.props) === null || _a === void 0 ? void 0 : _a.fixLeft) === 'number') {
|
|
64
|
+
pre.fixedLeft.push(cur);
|
|
65
|
+
return pre;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
if (typeof ((_b = cur.props) === null || _b === void 0 ? void 0 : _b.fixRight) === 'number') {
|
|
69
|
+
pre.fixedRight.push(cur);
|
|
70
|
+
return pre;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
pre.columns.push(cur);
|
|
74
|
+
return pre;
|
|
75
|
+
}, {
|
|
76
|
+
fixedLeft: [],
|
|
77
|
+
fixedRight: [],
|
|
78
|
+
columns: []
|
|
79
|
+
});
|
|
80
|
+
}, [children]); // 截取非固定列
|
|
81
|
+
|
|
82
|
+
var resetVirtualItems = useMemo(function () {
|
|
83
|
+
var fixedLeft = fixedColumns.fixedLeft,
|
|
84
|
+
columns = fixedColumns.columns;
|
|
85
|
+
return virtualItems.slice(fixedLeft.length, fixedLeft.length + columns.length);
|
|
86
|
+
}, [fixedColumns, virtualItems]); // 横向单元格合并
|
|
87
|
+
|
|
88
|
+
var colSpan = useMemo(function () {
|
|
89
|
+
var _a;
|
|
90
|
+
|
|
91
|
+
var startIndex = ((_a = resetVirtualItems === null || resetVirtualItems === void 0 ? void 0 : resetVirtualItems[0]) === null || _a === void 0 ? void 0 : _a.index) || 0;
|
|
92
|
+
return startIndex ? startIndex - fixedColumns.fixedLeft.length : startIndex;
|
|
93
|
+
}, [fixedColumns, resetVirtualItems]);
|
|
94
|
+
return /*#__PURE__*/React.createElement("tr", Object.assign({}, resetProps, {
|
|
95
|
+
ref: Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef
|
|
96
|
+
}), fixedColumns.fixedLeft, !!colSpan && /*#__PURE__*/React.createElement("td", {
|
|
97
|
+
colSpan: colSpan
|
|
98
|
+
}), resetVirtualItems.map(function (virtualCol) {
|
|
99
|
+
return children[virtualCol.index];
|
|
100
|
+
}), fixedColumns.fixedRight);
|
|
101
|
+
});
|
|
102
|
+
export default VirtualRow;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import React, { useRef } from 'react';
|
|
3
|
+
import { useVirtual } from 'react-virtual';
|
|
4
|
+
import { TableContext, useRealive } from './context';
|
|
5
|
+
var VirtualTable = /*#__PURE__*/React.memo(function (tableProps) {
|
|
6
|
+
var _a, _b, _c, _d;
|
|
7
|
+
|
|
8
|
+
var bodyRef = useRef(null);
|
|
9
|
+
|
|
10
|
+
var _useRealive = useRealive(),
|
|
11
|
+
_useRealive2 = _slicedToArray(_useRealive, 2),
|
|
12
|
+
state = _useRealive2[0],
|
|
13
|
+
dispatch = _useRealive2[1]; // { totalSize, virtualItems }
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
var rowVirtual = useVirtual({
|
|
17
|
+
size: state.totalLen,
|
|
18
|
+
// 绑定父节点
|
|
19
|
+
parentRef: {
|
|
20
|
+
current: (_a = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _a === void 0 ? void 0 : _a.parentNode
|
|
21
|
+
},
|
|
22
|
+
estimateSize: React.useCallback(function () {
|
|
23
|
+
return state.rowHeight;
|
|
24
|
+
}, [state.rowHeight]),
|
|
25
|
+
overscan: 5
|
|
26
|
+
});
|
|
27
|
+
var columnVirtual = useVirtual({
|
|
28
|
+
horizontal: true,
|
|
29
|
+
size: state.columnsLen,
|
|
30
|
+
parentRef: {
|
|
31
|
+
current: (_b = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _b === void 0 ? void 0 : _b.parentNode
|
|
32
|
+
},
|
|
33
|
+
estimateSize: React.useCallback(function (i) {
|
|
34
|
+
var _a, _b;
|
|
35
|
+
|
|
36
|
+
return (_b = (_a = tableProps === null || tableProps === void 0 ? void 0 : tableProps.children[0]) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.colWidths[i];
|
|
37
|
+
}, [(_d = (_c = tableProps.children[0]) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.colWidths]),
|
|
38
|
+
overscan: 5
|
|
39
|
+
});
|
|
40
|
+
var instance = {
|
|
41
|
+
rowVirtual: rowVirtual,
|
|
42
|
+
columnVirtual: columnVirtual
|
|
43
|
+
};
|
|
44
|
+
return /*#__PURE__*/React.createElement(TableContext.Provider, {
|
|
45
|
+
value: {
|
|
46
|
+
state: state,
|
|
47
|
+
dispatch: dispatch,
|
|
48
|
+
instance: instance
|
|
49
|
+
}
|
|
50
|
+
}, /*#__PURE__*/React.createElement("table", Object.assign({
|
|
51
|
+
ref: bodyRef
|
|
52
|
+
}, tableProps)));
|
|
53
|
+
});
|
|
54
|
+
export default VirtualTable;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
var __rest = this && this.__rest || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
|
|
4
|
+
for (var p in s) {
|
|
5
|
+
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
import React, { useEffect, useMemo } from 'react';
|
|
15
|
+
import { useStore } from './context';
|
|
16
|
+
var VirtualWrapper = /*#__PURE__*/React.memo(function (wrapperProps) {
|
|
17
|
+
var _a, _b;
|
|
18
|
+
|
|
19
|
+
var children = wrapperProps.children,
|
|
20
|
+
resetProps = __rest(wrapperProps, ["children"]);
|
|
21
|
+
|
|
22
|
+
var _useStore = useStore(),
|
|
23
|
+
state = _useStore.state,
|
|
24
|
+
dispatch = _useStore.dispatch,
|
|
25
|
+
instance = _useStore.instance;
|
|
26
|
+
|
|
27
|
+
var _instance$rowVirtual = instance.rowVirtual,
|
|
28
|
+
virtualItems = _instance$rowVirtual.virtualItems,
|
|
29
|
+
totalSize = _instance$rowVirtual.totalSize;
|
|
30
|
+
var contents = useMemo(function () {
|
|
31
|
+
return children[1];
|
|
32
|
+
}, [children]);
|
|
33
|
+
var contentsLen = useMemo(function () {
|
|
34
|
+
var _a;
|
|
35
|
+
|
|
36
|
+
return (_a = contents === null || contents === void 0 ? void 0 : contents.length) !== null && _a !== void 0 ? _a : 0;
|
|
37
|
+
}, [contents]);
|
|
38
|
+
useEffect(function () {
|
|
39
|
+
if (state.totalLen !== contentsLen) {
|
|
40
|
+
dispatch({
|
|
41
|
+
type: 'changeTotalLen',
|
|
42
|
+
totalLen: contentsLen !== null && contentsLen !== void 0 ? contentsLen : 0
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
}, [contentsLen, dispatch, state.totalLen]);
|
|
46
|
+
var paddingTop = virtualItems.length > 0 ? ((_a = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[0]) === null || _a === void 0 ? void 0 : _a.start) || 0 : 0;
|
|
47
|
+
var paddingBottom = virtualItems.length > 0 ? totalSize - (((_b = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[virtualItems.length - 1]) === null || _b === void 0 ? void 0 : _b.end) || 0) : 0;
|
|
48
|
+
return /*#__PURE__*/React.createElement("tbody", Object.assign({}, resetProps), paddingTop > 0 && /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
|
|
49
|
+
style: {
|
|
50
|
+
height: "".concat(paddingTop, "px")
|
|
51
|
+
}
|
|
52
|
+
})), children[0], virtualItems.map(function (virtualRow) {
|
|
53
|
+
return contents[virtualRow.index];
|
|
54
|
+
}), paddingBottom > 0 && /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
|
|
55
|
+
style: {
|
|
56
|
+
height: "".concat(paddingBottom, "px")
|
|
57
|
+
}
|
|
58
|
+
})));
|
|
59
|
+
});
|
|
60
|
+
export default VirtualWrapper;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const TableContext: import("react").Context<{
|
|
3
|
+
state: any;
|
|
4
|
+
dispatch: any;
|
|
5
|
+
instance: any;
|
|
6
|
+
}>;
|
|
7
|
+
declare const useStore: () => {
|
|
8
|
+
state: any;
|
|
9
|
+
dispatch: any;
|
|
10
|
+
instance: any;
|
|
11
|
+
};
|
|
12
|
+
declare const useRealive: () => [any, import("react").Dispatch<any>];
|
|
13
|
+
export { TableContext, useStore, useRealive };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { createContext, useContext, useReducer } from 'react'; // =============== context ============== //
|
|
2
|
+
|
|
3
|
+
var TableContext = /*#__PURE__*/createContext({
|
|
4
|
+
state: null,
|
|
5
|
+
dispatch: null,
|
|
6
|
+
instance: {}
|
|
7
|
+
});
|
|
8
|
+
|
|
9
|
+
var useStore = function useStore() {
|
|
10
|
+
return useContext(TableContext);
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
var initialState = {
|
|
14
|
+
// 行高度
|
|
15
|
+
rowHeight: 0,
|
|
16
|
+
columnsLen: 0,
|
|
17
|
+
// 总行数
|
|
18
|
+
totalLen: 0
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
var reducer = function reducer(state, action) {
|
|
22
|
+
var totalLen = action.totalLen,
|
|
23
|
+
columnsLen = action.columnsLen,
|
|
24
|
+
rowHeight = action.rowHeight;
|
|
25
|
+
|
|
26
|
+
switch (action.type) {
|
|
27
|
+
// 数据数量
|
|
28
|
+
case 'changeTotalLen':
|
|
29
|
+
return Object.assign(Object.assign({}, state), {
|
|
30
|
+
totalLen: totalLen
|
|
31
|
+
});
|
|
32
|
+
// 列数量
|
|
33
|
+
|
|
34
|
+
case 'changeColumnsLen':
|
|
35
|
+
return Object.assign(Object.assign({}, state), {
|
|
36
|
+
columnsLen: columnsLen
|
|
37
|
+
});
|
|
38
|
+
// 初始化行高度
|
|
39
|
+
|
|
40
|
+
case 'initHeight':
|
|
41
|
+
return Object.assign(Object.assign({}, state), {
|
|
42
|
+
rowHeight: rowHeight
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
default:
|
|
46
|
+
throw new Error();
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
var useRealive = function useRealive() {
|
|
51
|
+
return useReducer(reducer, initialState);
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
export { TableContext, useStore, useRealive };
|
package/es/Select/index.d.ts
CHANGED
|
@@ -5,6 +5,7 @@ export interface ISelectProps extends SelectProps {
|
|
|
5
5
|
style?: React.CSSProperties;
|
|
6
6
|
Option?: typeof Select.Option;
|
|
7
7
|
OptGroup?: typeof Select.OptGroup;
|
|
8
|
+
defaultLabel?: string;
|
|
8
9
|
}
|
|
9
10
|
declare type SelectType = typeof Select & typeof Select.Option & typeof Select.OptGroup;
|
|
10
11
|
declare const LMSelect: SelectType;
|