@kdcloudjs/table 1.2.0-canary.16 → 1.2.0-canary.16-hotfix
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +2047 -3489
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +16 -16
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/es/_utils/arrayUtil.js +0 -3
- package/es/_utils/devwarning.js +0 -1
- package/es/_utils/formatUtil.js +35 -96
- package/es/_utils/hooks.js +18 -42
- package/es/_utils/index.js +0 -2
- package/es/_utils/numberUtil.js +32 -55
- package/es/_utils/omit.js +0 -2
- package/es/_utils/type.js +0 -2
- package/es/_utils/usePopper.js +74 -137
- package/es/config-provider/compDefaultProps.js +0 -1
- package/es/config-provider/configProvider.js +2 -7
- package/es/config-provider/defaultConfig.js +0 -1
- package/es/index.js +0 -2
- package/es/locale/locale.js +5 -43
- package/es/table/base/calculations.js +22 -72
- package/es/table/base/colgroup.js +0 -1
- package/es/table/base/empty.js +4 -4
- package/es/table/base/header.js +14 -67
- package/es/table/base/helpers/SpanManager.js +3 -9
- package/es/table/base/helpers/TableDOMUtils.js +4 -27
- package/es/table/base/helpers/__test__/SpanManager.test.js +2 -2
- package/es/table/base/helpers/__test__/TableDOMUtils.test.js +0 -1
- package/es/table/base/helpers/getRichVisibleRectsStream.js +11 -44
- package/es/table/base/helpers/rowHeightManager.js +0 -28
- package/es/table/base/html-table.js +14 -35
- package/es/table/base/loading.js +6 -8
- package/es/table/base/renderTemplates.js +26 -44
- package/es/table/base/styles.js +0 -9
- package/es/table/base/table.js +95 -181
- package/es/table/base/utils.js +14 -54
- package/es/table/common-views.js +0 -7
- package/es/table/internals.js +0 -13
- package/es/table/pipeline/features/autoFill.js +11 -40
- package/es/table/pipeline/features/autoRowSpan.js +1 -14
- package/es/table/pipeline/features/colGroupExtendable.js +4 -19
- package/es/table/pipeline/features/columnDrag.d.ts +1 -0
- package/es/table/pipeline/features/columnDrag.js +236 -303
- package/es/table/pipeline/features/columnFilter.js +11 -48
- package/es/table/pipeline/features/columnHover.js +1 -7
- package/es/table/pipeline/features/columnRangeHover.js +1 -8
- package/es/table/pipeline/features/columnResizeWidth.js +51 -42
- package/es/table/pipeline/features/contextMenu.js +18 -89
- package/es/table/pipeline/features/filter/DefaultFilterContent.js +10 -25
- package/es/table/pipeline/features/filter/DefaultFilterIcon.js +1 -1
- package/es/table/pipeline/features/filter/Filter.js +25 -48
- package/es/table/pipeline/features/filter/FilterPanel.js +11 -25
- package/es/table/pipeline/features/filter/util.js +0 -4
- package/es/table/pipeline/features/footerDataSource.js +0 -3
- package/es/table/pipeline/features/mergeCellHover.js +0 -1
- package/es/table/pipeline/features/multiSelect.js +15 -57
- package/es/table/pipeline/features/rangeSelection.js +63 -142
- package/es/table/pipeline/features/rowDetail.js +2 -41
- package/es/table/pipeline/features/rowDrag.js +36 -71
- package/es/table/pipeline/features/rowGrouping.js +2 -35
- package/es/table/pipeline/features/singleSelect.js +0 -24
- package/es/table/pipeline/features/sort.js +31 -83
- package/es/table/pipeline/features/tips.js +0 -6
- package/es/table/pipeline/features/treeMode.js +9 -44
- package/es/table/pipeline/features/treeSelect.js +0 -26
- package/es/table/pipeline/features/utils/touchEventUtils.d.ts +15 -0
- package/es/table/pipeline/features/utils/touchEventUtils.js +65 -0
- package/es/table/pipeline/pipeline.js +11 -51
- package/es/table/pivot/cross-table/buildCrossTable.js +15 -64
- package/es/table/pivot/cross-table/cross-table.js +22 -28
- package/es/table/pivot/cross-tree-table/buildCrossTreeTable.js +14 -47
- package/es/table/pivot/cross-tree-table/cross-tree-table.js +28 -50
- package/es/table/pivot/pivot-utils/buildDrillTree.js +10 -23
- package/es/table/pivot/pivot-utils/builders.js +31 -71
- package/es/table/pivot/pivot-utils/convert-utils.js +13 -39
- package/es/table/pivot/pivot-utils/simpleEncode.js +0 -1
- package/es/table/transforms/autoRowSpan.js +1 -15
- package/es/table/transforms/autoWidth.js +10 -32
- package/es/table/transforms/buildTree.js +1 -2
- package/es/table/transforms/columnHover.js +9 -15
- package/es/table/transforms/columnRangeHover.js +12 -19
- package/es/table/transforms/columnResize.js +15 -37
- package/es/table/transforms/flatten.js +0 -3
- package/es/table/transforms/orderField.js +0 -3
- package/es/table/transforms/sort.js +36 -88
- package/es/table/transforms/tips.js +1 -6
- package/es/table/transforms/treeMode.js +30 -69
- package/es/table/transforms/visible.js +0 -2
- package/es/table/use/useResizeObserver.js +1 -4
- package/es/table/utils/applyTransforms.js +0 -1
- package/es/table/utils/buildTree.js +4 -19
- package/es/table/utils/collectNodes.js +1 -10
- package/es/table/utils/console.js +0 -14
- package/es/table/utils/copyToClipboard.js +0 -4
- package/es/table/utils/element.js +14 -41
- package/es/table/utils/exportTableAsExcel.js +4 -40
- package/es/table/utils/getTreeDepth.js +1 -9
- package/es/table/utils/groupBy.js +1 -10
- package/es/table/utils/layeredFilter.js +0 -4
- package/es/table/utils/layeredSort.js +0 -5
- package/es/table/utils/makeRecursiveMapper.js +1 -12
- package/es/table/utils/mergeCellProps.js +6 -13
- package/es/table/utils/others.js +3 -16
- package/es/table/utils/proto.js +2 -30
- package/es/table/utils/smartCompare.js +4 -12
- package/es/table/utils/traverseColumn.js +2 -15
- package/es/table/utils/tree-data-helpers/StrictTreeDataHelper.js +1 -22
- package/es/table/utils/tree-data-helpers/TreeDataHelper.js +15 -69
- package/lib/_utils/arrayUtil.js +0 -5
- package/lib/_utils/devwarning.js +0 -5
- package/lib/_utils/formatUtil.js +35 -100
- package/lib/_utils/hooks.js +18 -53
- package/lib/_utils/index.js +0 -6
- package/lib/_utils/numberUtil.js +32 -63
- package/lib/_utils/omit.js +0 -5
- package/lib/_utils/react-children.js +0 -5
- package/lib/_utils/type.js +0 -6
- package/lib/_utils/usePopper.js +74 -158
- package/lib/config-provider/ConfigContext.js +1 -4
- package/lib/config-provider/compDefaultProps.js +0 -1
- package/lib/config-provider/configProvider.js +3 -18
- package/lib/config-provider/defaultConfig.js +0 -5
- package/lib/config-provider/index.js +0 -6
- package/lib/index.js +2 -8
- package/lib/locale/index.js +0 -7
- package/lib/locale/locale.js +5 -57
- package/lib/table/base/calculations.js +22 -83
- package/lib/table/base/colgroup.js +0 -5
- package/lib/table/base/empty.js +4 -16
- package/lib/table/base/header.js +14 -77
- package/lib/table/base/helpers/SpanManager.js +3 -11
- package/lib/table/base/helpers/TableDOMUtils.js +2 -27
- package/lib/table/base/helpers/__test__/SpanManager.test.js +2 -4
- package/lib/table/base/helpers/__test__/TableDOMUtils.test.js +0 -5
- package/lib/table/base/helpers/__test__/rowHeightManager.test.js +0 -1
- package/lib/table/base/helpers/getRichVisibleRectsStream.js +11 -62
- package/lib/table/base/helpers/rowHeightManager.js +0 -33
- package/lib/table/base/html-table.js +14 -45
- package/lib/table/base/index.js +0 -2
- package/lib/table/base/loading.js +6 -12
- package/lib/table/base/renderTemplates.js +27 -58
- package/lib/table/base/styles.js +0 -21
- package/lib/table/base/table.js +95 -214
- package/lib/table/base/utils.js +14 -89
- package/lib/table/common-views.js +0 -16
- package/lib/table/index.js +0 -13
- package/lib/table/internals.js +0 -14
- package/lib/table/pipeline/features/autoFill.js +11 -47
- package/lib/table/pipeline/features/autoRowSpan.js +1 -19
- package/lib/table/pipeline/features/buildTree.js +0 -2
- package/lib/table/pipeline/features/colGroupExtendable.js +4 -32
- package/lib/table/pipeline/features/columnDrag.d.ts +1 -0
- package/lib/table/pipeline/features/columnDrag.js +236 -309
- package/lib/table/pipeline/features/columnFilter.js +11 -62
- package/lib/table/pipeline/features/columnHover.js +1 -11
- package/lib/table/pipeline/features/columnRangeHover.js +1 -13
- package/lib/table/pipeline/features/columnResizeWidth.js +51 -58
- package/lib/table/pipeline/features/contextMenu.js +18 -113
- package/lib/table/pipeline/features/filter/DefaultFilterContent.js +10 -43
- package/lib/table/pipeline/features/filter/DefaultFilterIcon.js +1 -4
- package/lib/table/pipeline/features/filter/Filter.js +25 -70
- package/lib/table/pipeline/features/filter/FilterPanel.js +11 -40
- package/lib/table/pipeline/features/filter/index.js +0 -5
- package/lib/table/pipeline/features/filter/util.js +0 -7
- package/lib/table/pipeline/features/footerDataSource.js +0 -10
- package/lib/table/pipeline/features/index.js +0 -23
- package/lib/table/pipeline/features/mergeCellHover.js +0 -5
- package/lib/table/pipeline/features/multiSelect.js +15 -71
- package/lib/table/pipeline/features/rangeSelection.js +63 -159
- package/lib/table/pipeline/features/rowDetail.js +2 -65
- package/lib/table/pipeline/features/rowDrag.js +36 -81
- package/lib/table/pipeline/features/rowGrouping.js +2 -55
- package/lib/table/pipeline/features/singleSelect.js +0 -34
- package/lib/table/pipeline/features/sort.js +31 -103
- package/lib/table/pipeline/features/tips.js +0 -15
- package/lib/table/pipeline/features/treeMode.js +9 -65
- package/lib/table/pipeline/features/treeSelect.js +0 -34
- package/lib/table/pipeline/features/utils/touchEventUtils.d.ts +15 -0
- package/lib/table/pipeline/features/utils/touchEventUtils.js +76 -0
- package/lib/table/pipeline/index.js +0 -8
- package/lib/table/pipeline/pipeline.js +11 -60
- package/lib/table/pivot/cross-table/buildCrossTable.js +15 -75
- package/lib/table/pivot/cross-table/cross-table.js +22 -36
- package/lib/table/pivot/cross-table/index.js +0 -4
- package/lib/table/pivot/cross-tree-table/buildCrossTreeTable.js +14 -60
- package/lib/table/pivot/cross-tree-table/cross-tree-table.js +28 -60
- package/lib/table/pivot/cross-tree-table/index.js +0 -3
- package/lib/table/pivot/pivot-utils/buildDrillTree.js +10 -29
- package/lib/table/pivot/pivot-utils/builders.js +31 -82
- package/lib/table/pivot/pivot-utils/convert-utils.js +13 -57
- package/lib/table/pivot/pivot-utils/index.js +0 -7
- package/lib/table/pivot/pivot-utils/simpleEncode.js +0 -2
- package/lib/table/style/css.js +0 -1
- package/lib/table/style/index.js +0 -1
- package/lib/table/transforms/autoRowSpan.js +1 -21
- package/lib/table/transforms/autoWidth.js +10 -53
- package/lib/table/transforms/buildTree.js +1 -4
- package/lib/table/transforms/columnHover.js +9 -22
- package/lib/table/transforms/columnRangeHover.js +12 -27
- package/lib/table/transforms/columnResize.js +15 -56
- package/lib/table/transforms/flatten.js +0 -5
- package/lib/table/transforms/index.js +0 -12
- package/lib/table/transforms/orderField.js +0 -7
- package/lib/table/transforms/sort.js +36 -112
- package/lib/table/transforms/tips.js +1 -16
- package/lib/table/transforms/treeMode.js +30 -96
- package/lib/table/transforms/visible.js +0 -7
- package/lib/table/transforms/warnTransformsDeprecated.js +0 -4
- package/lib/table/use/useResizeObserver.js +1 -8
- package/lib/table/utils/applyTransforms.js +0 -2
- package/lib/table/utils/buildTree.js +4 -30
- package/lib/table/utils/collectNodes.js +1 -15
- package/lib/table/utils/console.js +0 -16
- package/lib/table/utils/copyToClipboard.js +0 -6
- package/lib/table/utils/element.js +14 -46
- package/lib/table/utils/exportTableAsExcel.js +4 -49
- package/lib/table/utils/getTreeDepth.js +1 -14
- package/lib/table/utils/groupBy.js +1 -14
- package/lib/table/utils/index.js +0 -21
- package/lib/table/utils/isGroupColumn.js +0 -3
- package/lib/table/utils/isLeafNode.js +0 -1
- package/lib/table/utils/layeredFilter.js +0 -10
- package/lib/table/utils/layeredSort.js +0 -10
- package/lib/table/utils/makeRecursiveMapper.js +1 -21
- package/lib/table/utils/mergeCellProps.js +6 -17
- package/lib/table/utils/others.js +3 -31
- package/lib/table/utils/proto.js +2 -33
- package/lib/table/utils/selectColumn.js +0 -1
- package/lib/table/utils/smartCompare.js +4 -13
- package/lib/table/utils/traverseColumn.js +2 -22
- package/lib/table/utils/tree-data-helpers/StrictTreeDataHelper.js +1 -30
- package/lib/table/utils/tree-data-helpers/TreeDataHelper.js +15 -82
- package/package.json +2 -1
package/es/table/base/header.js
CHANGED
|
@@ -8,48 +8,34 @@ import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instan
|
|
|
8
8
|
import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
|
|
9
9
|
import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
|
|
10
10
|
import _getIteratorMethod from "@babel/runtime-corejs3/core-js/get-iterator-method";
|
|
11
|
-
|
|
12
11
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof _Symbol !== "undefined" && _getIteratorMethod(o) || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
13
|
-
|
|
14
12
|
function _unsupportedIterableToArray(o, minLen) { var _context6; if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = _sliceInstanceProperty(_context6 = Object.prototype.toString.call(o)).call(_context6, 8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return _Array$from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
15
|
-
|
|
16
13
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
17
|
-
|
|
18
14
|
import cx from 'classnames';
|
|
19
15
|
import React from 'react';
|
|
20
16
|
import { getTreeDepth, isLeafNode } from '../utils';
|
|
21
17
|
import { Classes } from './styles';
|
|
22
|
-
|
|
23
18
|
function range(n) {
|
|
24
19
|
var array = [];
|
|
25
|
-
|
|
26
20
|
for (var i = 0; i < n; i++) {
|
|
27
21
|
array.push(i);
|
|
28
22
|
}
|
|
29
|
-
|
|
30
23
|
return array;
|
|
31
24
|
}
|
|
32
25
|
/** 根据当前横向虚拟滚动 对 nested.center 进行过滤,结果只保留当前视野内可见的那些列配置 */
|
|
33
|
-
|
|
34
|
-
|
|
35
26
|
function filterNestedCenter(centerNested, hoz, leftFlatCount) {
|
|
36
27
|
return dfs(centerNested, leftFlatCount).filtered;
|
|
37
|
-
|
|
38
28
|
function dfs(cols, startColIndex) {
|
|
39
29
|
var leafCount = 0;
|
|
40
30
|
var filtered = [];
|
|
41
|
-
|
|
42
31
|
var _iterator = _createForOfIteratorHelper(cols),
|
|
43
|
-
|
|
44
|
-
|
|
32
|
+
_step;
|
|
45
33
|
try {
|
|
46
34
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
47
35
|
var col = _step.value;
|
|
48
36
|
var colIndex = startColIndex + leafCount;
|
|
49
|
-
|
|
50
37
|
if (isLeafNode(col)) {
|
|
51
38
|
leafCount += 1;
|
|
52
|
-
|
|
53
39
|
if (leftFlatCount + hoz.leftIndex <= colIndex && colIndex < leftFlatCount + hoz.rightIndex) {
|
|
54
40
|
filtered.push({
|
|
55
41
|
colIndex: colIndex,
|
|
@@ -59,7 +45,6 @@ function filterNestedCenter(centerNested, hoz, leftFlatCount) {
|
|
|
59
45
|
} else {
|
|
60
46
|
var dfsRes = dfs(col.children, colIndex);
|
|
61
47
|
leafCount += dfsRes.leafCount;
|
|
62
|
-
|
|
63
48
|
if (dfsRes.filtered.length > 0) {
|
|
64
49
|
filtered.push({
|
|
65
50
|
colIndex: colIndex,
|
|
@@ -74,7 +59,6 @@ function filterNestedCenter(centerNested, hoz, leftFlatCount) {
|
|
|
74
59
|
} finally {
|
|
75
60
|
_iterator.f();
|
|
76
61
|
}
|
|
77
|
-
|
|
78
62
|
return {
|
|
79
63
|
filtered: filtered,
|
|
80
64
|
leafCount: leafCount
|
|
@@ -82,28 +66,21 @@ function filterNestedCenter(centerNested, hoz, leftFlatCount) {
|
|
|
82
66
|
}
|
|
83
67
|
}
|
|
84
68
|
/** 根据输入的 nested 列配置,算出相应的 leveled & flat 配置方便渲染 */
|
|
85
|
-
|
|
86
|
-
|
|
87
69
|
function calculateLeveledAndFlat(inputNested, rowCount) {
|
|
88
70
|
var leveled = [];
|
|
89
|
-
|
|
90
71
|
for (var depth = 0; depth < rowCount; depth++) {
|
|
91
72
|
leveled.push([]);
|
|
92
73
|
}
|
|
93
|
-
|
|
94
74
|
var flat = [];
|
|
95
75
|
dfs(inputNested, 0);
|
|
96
76
|
return {
|
|
97
77
|
flat: flat,
|
|
98
78
|
leveled: leveled
|
|
99
79
|
};
|
|
100
|
-
|
|
101
80
|
function dfs(input, depth) {
|
|
102
81
|
var leafCount = 0;
|
|
103
|
-
|
|
104
82
|
for (var i = 0; i < input.length; i++) {
|
|
105
83
|
var indexedCol = input[i];
|
|
106
|
-
|
|
107
84
|
if (isLeafNode(indexedCol)) {
|
|
108
85
|
leafCount += 1;
|
|
109
86
|
var wrapped = {
|
|
@@ -119,7 +96,6 @@ function calculateLeveledAndFlat(inputNested, rowCount) {
|
|
|
119
96
|
} else {
|
|
120
97
|
var dfsRes = dfs(indexedCol.children, depth + 1);
|
|
121
98
|
leafCount += dfsRes.leafCount;
|
|
122
|
-
|
|
123
99
|
if (dfsRes.leafCount > 0) {
|
|
124
100
|
leveled[depth].push({
|
|
125
101
|
type: 'normal',
|
|
@@ -132,26 +108,20 @@ function calculateLeveledAndFlat(inputNested, rowCount) {
|
|
|
132
108
|
}
|
|
133
109
|
}
|
|
134
110
|
}
|
|
135
|
-
|
|
136
111
|
return {
|
|
137
112
|
leafCount: leafCount
|
|
138
113
|
};
|
|
139
114
|
}
|
|
140
115
|
}
|
|
141
116
|
/** 包装列配置,附加上 colIndex 属性 */
|
|
142
|
-
|
|
143
|
-
|
|
144
117
|
function attachColIndex(inputNested, colIndexOffset) {
|
|
145
118
|
return dfs(inputNested, colIndexOffset).result;
|
|
146
|
-
|
|
147
119
|
function dfs(input, startColIndex) {
|
|
148
120
|
var result = [];
|
|
149
121
|
var leafCount = 0;
|
|
150
|
-
|
|
151
122
|
for (var i = 0; i < input.length; i++) {
|
|
152
123
|
var col = input[i];
|
|
153
124
|
var colIndex = startColIndex + leafCount;
|
|
154
|
-
|
|
155
125
|
if (isLeafNode(col)) {
|
|
156
126
|
leafCount += 1;
|
|
157
127
|
result.push({
|
|
@@ -161,7 +131,6 @@ function attachColIndex(inputNested, colIndexOffset) {
|
|
|
161
131
|
} else {
|
|
162
132
|
var sub = dfs(col.children, colIndex);
|
|
163
133
|
leafCount += sub.leafCount;
|
|
164
|
-
|
|
165
134
|
if (sub.leafCount > 0) {
|
|
166
135
|
result.push({
|
|
167
136
|
col: col,
|
|
@@ -171,7 +140,6 @@ function attachColIndex(inputNested, colIndexOffset) {
|
|
|
171
140
|
}
|
|
172
141
|
}
|
|
173
142
|
}
|
|
174
|
-
|
|
175
143
|
return {
|
|
176
144
|
result: result,
|
|
177
145
|
leafCount: leafCount
|
|
@@ -179,17 +147,13 @@ function attachColIndex(inputNested, colIndexOffset) {
|
|
|
179
147
|
}
|
|
180
148
|
}
|
|
181
149
|
/** 计算用于渲染表头的数据结构 */
|
|
182
|
-
|
|
183
|
-
|
|
184
150
|
function calculateHeaderRenderInfo(_ref, rowCount) {
|
|
185
151
|
var flat = _flatInstanceProperty(_ref),
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
152
|
+
nested = _ref.nested,
|
|
153
|
+
hoz = _ref.horizontalRenderRange,
|
|
154
|
+
useVirtual = _ref.useVirtual;
|
|
190
155
|
if (useVirtual.header) {
|
|
191
156
|
var _context, _context2;
|
|
192
|
-
|
|
193
157
|
var leftPart = calculateLeveledAndFlat(attachColIndex(nested.left, 0), rowCount);
|
|
194
158
|
var filtered = filterNestedCenter(nested.center, hoz, flat.left.length);
|
|
195
159
|
var centerPart = calculateLeveledAndFlat(filtered, rowCount);
|
|
@@ -206,7 +170,6 @@ function calculateHeaderRenderInfo(_ref, rowCount) {
|
|
|
206
170
|
}], _toConsumableArray(_flatInstanceProperty(rightPart))),
|
|
207
171
|
leveled: _mapInstanceProperty(_context2 = range(rowCount)).call(_context2, function (depth) {
|
|
208
172
|
var _context3;
|
|
209
|
-
|
|
210
173
|
return _concatInstanceProperty(_context3 = []).call(_context3, _toConsumableArray(leftPart.leveled[depth]), [{
|
|
211
174
|
type: 'blank',
|
|
212
175
|
width: hoz.leftBlank,
|
|
@@ -219,35 +182,27 @@ function calculateHeaderRenderInfo(_ref, rowCount) {
|
|
|
219
182
|
})
|
|
220
183
|
};
|
|
221
184
|
}
|
|
222
|
-
|
|
223
185
|
return calculateLeveledAndFlat(attachColIndex(nested.full, 0), rowCount);
|
|
224
186
|
}
|
|
225
|
-
|
|
226
187
|
export default function TableHeader(_ref2) {
|
|
227
188
|
var _context4, _context5;
|
|
228
|
-
|
|
229
189
|
var info = _ref2.info,
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
190
|
+
theaderPosition = _ref2.theaderPosition,
|
|
191
|
+
_rowCount = _ref2.rowCount;
|
|
233
192
|
var nested = info.nested,
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
193
|
+
flat = _flatInstanceProperty(info),
|
|
194
|
+
stickyLeftMap = info.stickyLeftMap,
|
|
195
|
+
stickyRightMap = info.stickyRightMap;
|
|
238
196
|
var rowCount = _rowCount !== null && _rowCount !== void 0 ? _rowCount : getTreeDepth(nested.full) + 1;
|
|
239
197
|
var headerRenderInfo = calculateHeaderRenderInfo(info, rowCount);
|
|
240
198
|
var fullFlatCount = flat.full.length;
|
|
241
199
|
var leftFlatCount = flat.left.length;
|
|
242
200
|
var rightFlatCount = flat.right.length;
|
|
243
|
-
|
|
244
201
|
var thead = _mapInstanceProperty(_context4 = headerRenderInfo.leveled).call(_context4, function (wrappedCols, level) {
|
|
245
202
|
var _cx2;
|
|
246
|
-
|
|
247
|
-
|
|
203
|
+
var _wrappedCols = _concatInstanceProperty(wrappedCols).call(wrappedCols);
|
|
204
|
+
// 左中右区域渲染,分组列可能单独位于一个区域,此时其他区域也需要适配分组的高度
|
|
248
205
|
// rowspan 需要空白的列头去占位, 需要补充额外的空白列头
|
|
249
|
-
|
|
250
|
-
|
|
251
206
|
if (rowCount > 1 && ['left', 'right'].indexOf(theaderPosition) > -1) {
|
|
252
207
|
_wrappedCols.push({
|
|
253
208
|
type: 'blank',
|
|
@@ -256,20 +211,16 @@ export default function TableHeader(_ref2) {
|
|
|
256
211
|
isPlacehoder: true
|
|
257
212
|
});
|
|
258
213
|
}
|
|
259
|
-
|
|
260
214
|
var headerCells = _mapInstanceProperty(_wrappedCols).call(_wrappedCols, function (wrapped, index) {
|
|
261
215
|
var _a, _b, _c;
|
|
262
|
-
|
|
263
216
|
if (wrapped.type === 'normal') {
|
|
264
217
|
var _cx;
|
|
265
|
-
|
|
266
218
|
var colIndex = wrapped.colIndex,
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
219
|
+
colSpan = wrapped.colSpan,
|
|
220
|
+
isLeaf = wrapped.isLeaf,
|
|
221
|
+
col = wrapped.col;
|
|
270
222
|
var headerCellProps = (_a = col.headerCellProps) !== null && _a !== void 0 ? _a : {};
|
|
271
223
|
var positionStyle = {};
|
|
272
|
-
|
|
273
224
|
if (colIndex < leftFlatCount) {
|
|
274
225
|
positionStyle.position = 'sticky';
|
|
275
226
|
positionStyle.left = stickyLeftMap.get(colIndex);
|
|
@@ -277,7 +228,6 @@ export default function TableHeader(_ref2) {
|
|
|
277
228
|
positionStyle.position = 'sticky';
|
|
278
229
|
positionStyle.right = stickyRightMap.get(colIndex);
|
|
279
230
|
}
|
|
280
|
-
|
|
281
231
|
var justifyContent = col.align === 'right' ? 'flex-end' : col.align === 'center' ? 'center' : 'flex-start';
|
|
282
232
|
var cell = /*#__PURE__*/React.createElement("th", _extends({
|
|
283
233
|
key: colIndex
|
|
@@ -310,13 +260,11 @@ export default function TableHeader(_ref2) {
|
|
|
310
260
|
}
|
|
311
261
|
}
|
|
312
262
|
});
|
|
313
|
-
|
|
314
263
|
return /*#__PURE__*/React.createElement("tr", {
|
|
315
264
|
key: level,
|
|
316
265
|
className: cx(Classes.tableHeaderRow, (_cx2 = {}, _defineProperty(_cx2, Classes.first, level === 0), _defineProperty(_cx2, Classes.last, level === rowCount - 1), _cx2))
|
|
317
266
|
}, headerCells);
|
|
318
267
|
});
|
|
319
|
-
|
|
320
268
|
var colgroup = _mapInstanceProperty(_context5 = _flatInstanceProperty(headerRenderInfo)).call(_context5, function (wrapped) {
|
|
321
269
|
if (wrapped.type === 'blank') {
|
|
322
270
|
if (wrapped.width > 0) {
|
|
@@ -338,6 +286,5 @@ export default function TableHeader(_ref2) {
|
|
|
338
286
|
});
|
|
339
287
|
}
|
|
340
288
|
});
|
|
341
|
-
|
|
342
289
|
return /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("colgroup", null, colgroup), /*#__PURE__*/React.createElement("thead", null, thead));
|
|
343
290
|
}
|
|
@@ -1,25 +1,22 @@
|
|
|
1
1
|
import _classCallCheck from "@babel/runtime-corejs3/helpers/classCallCheck";
|
|
2
2
|
import _createClass from "@babel/runtime-corejs3/helpers/createClass";
|
|
3
3
|
import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
|
|
4
|
-
|
|
5
4
|
/** 在表格的单元格的渲染过程中,先渲染的单元格的 colSpan/rowSpan 会影响到后续单元格是否被渲染
|
|
6
5
|
* `SpanManager` 会在内部维护一份状态来记录最近渲染单元格的 colSpan/rowSpan,
|
|
7
6
|
* 方便后续的单元格快速判断 "是否需要跳过渲染" */
|
|
8
7
|
var SpanManager = /*#__PURE__*/function () {
|
|
9
8
|
function SpanManager() {
|
|
10
9
|
_classCallCheck(this, SpanManager);
|
|
11
|
-
|
|
12
10
|
this.rects = [];
|
|
13
11
|
}
|
|
14
|
-
|
|
15
12
|
_createClass(SpanManager, [{
|
|
16
13
|
key: "testSkip",
|
|
17
14
|
value: function testSkip(rowIndex, colIndex) {
|
|
18
15
|
return this.rects.some(function (_ref) {
|
|
19
16
|
var left = _ref.left,
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
17
|
+
right = _ref.right,
|
|
18
|
+
top = _ref.top,
|
|
19
|
+
bottom = _ref.bottom;
|
|
23
20
|
return left <= colIndex && colIndex < right && top <= rowIndex && rowIndex < bottom;
|
|
24
21
|
});
|
|
25
22
|
}
|
|
@@ -27,7 +24,6 @@ var SpanManager = /*#__PURE__*/function () {
|
|
|
27
24
|
key: "stripUpwards",
|
|
28
25
|
value: function stripUpwards(rowIndex) {
|
|
29
26
|
var _context;
|
|
30
|
-
|
|
31
27
|
this.rects = _filterInstanceProperty(_context = this.rects).call(_context, function (rect) {
|
|
32
28
|
return rect.bottom > rowIndex;
|
|
33
29
|
});
|
|
@@ -43,8 +39,6 @@ var SpanManager = /*#__PURE__*/function () {
|
|
|
43
39
|
});
|
|
44
40
|
}
|
|
45
41
|
}]);
|
|
46
|
-
|
|
47
42
|
return SpanManager;
|
|
48
43
|
}();
|
|
49
|
-
|
|
50
44
|
export { SpanManager as default };
|
|
@@ -3,7 +3,8 @@ import _createClass from "@babel/runtime-corejs3/helpers/createClass";
|
|
|
3
3
|
import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
|
|
4
4
|
import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
|
|
5
5
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
6
|
-
import { Classes } from '../styles';
|
|
6
|
+
import { Classes } from '../styles';
|
|
7
|
+
// 表格 DOM 结构
|
|
7
8
|
// div.art-table-wrapper
|
|
8
9
|
// └── div.art-loading-wrapper
|
|
9
10
|
// ├── div.art-loading-indicator-wrapper
|
|
@@ -40,40 +41,30 @@ import { Classes } from '../styles'; // 表格 DOM 结构
|
|
|
40
41
|
// 在「可能存在嵌套表格」的情况下,我们可以采用以下的方式来避免「querySelector 不小心获取到了的嵌套表格上的元素」:
|
|
41
42
|
// artTable.querySelector('.art-lock-shadow-mask .art-left-lock-shadow')
|
|
42
43
|
// 表格 DOM 结构辅助工具
|
|
43
|
-
|
|
44
44
|
export var TableDOMHelper = /*#__PURE__*/function () {
|
|
45
45
|
function TableDOMHelper(artTableWrapper) {
|
|
46
46
|
var _this = this,
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
47
|
+
_context2,
|
|
48
|
+
_context3;
|
|
50
49
|
_classCallCheck(this, TableDOMHelper);
|
|
51
|
-
|
|
52
50
|
this.getRowNodeListByEvent = function (e) {
|
|
53
51
|
var nodeList = null;
|
|
54
52
|
var rowIndex = e.currentTarget.dataset.rowindex;
|
|
55
|
-
|
|
56
53
|
if (rowIndex !== undefined) {
|
|
57
54
|
var targetParent = _this.tableBody.contains(e.currentTarget) ? _this.tableBody : _this.tableFooter;
|
|
58
55
|
nodeList = targetParent.querySelectorAll("tr[data-rowindex=\"".concat(rowIndex, "\"]"));
|
|
59
56
|
}
|
|
60
|
-
|
|
61
57
|
return nodeList;
|
|
62
58
|
};
|
|
63
|
-
|
|
64
59
|
this.getInRangeRowByCellEvent = function (e) {
|
|
65
60
|
var _context;
|
|
66
|
-
|
|
67
61
|
var _a;
|
|
68
|
-
|
|
69
62
|
var getParentNode = function getParentNode(ele, target) {
|
|
70
63
|
if (ele.parentNode.nodeName === target) {
|
|
71
64
|
return ele.parentNode;
|
|
72
65
|
}
|
|
73
|
-
|
|
74
66
|
return getParentNode(ele.parentNode, target);
|
|
75
67
|
};
|
|
76
|
-
|
|
77
68
|
e = e instanceof Array ? e[0] : e;
|
|
78
69
|
var curCell = e === null || e === void 0 ? void 0 : e.currentTarget;
|
|
79
70
|
var curRow = getParentNode(curCell, 'TR');
|
|
@@ -81,7 +72,6 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
81
72
|
var rows = (_a = getParentNode(curCell, 'TABLE')) === null || _a === void 0 ? void 0 : _a.rows;
|
|
82
73
|
return _sliceInstanceProperty(_context = _Array$from(rows)).call(_context, curRow.rowIndex, curRow.rowIndex + curRowSpan);
|
|
83
74
|
};
|
|
84
|
-
|
|
85
75
|
this.artTableWrapper = artTableWrapper;
|
|
86
76
|
this.artTable = artTableWrapper.querySelector(".".concat(Classes.artTable));
|
|
87
77
|
this.tableHeader = this.artTable.querySelector(".".concat(Classes.tableHeader));
|
|
@@ -91,13 +81,10 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
91
81
|
this.tableElement = this.artTable.querySelector(".".concat(Classes.tableBody, " table"));
|
|
92
82
|
this.tableFooter = this.artTable.querySelector(".".concat(Classes.tableFooter));
|
|
93
83
|
this.tableFooterMain = this.artTable.querySelector(".".concat(Classes.tableFooterMain));
|
|
94
|
-
|
|
95
84
|
var stickyScrollSelector = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = ".".concat(Classes.artTable, " + .")).call(_context3, Classes.horizontalStickyScrollContainer, " .")).call(_context2, Classes.stickyScroll);
|
|
96
|
-
|
|
97
85
|
this.stickyScroll = artTableWrapper.querySelector(stickyScrollSelector);
|
|
98
86
|
this.stickyScrollItem = this.stickyScroll.querySelector(".".concat(Classes.stickyScrollItem));
|
|
99
87
|
}
|
|
100
|
-
|
|
101
88
|
_createClass(TableDOMHelper, [{
|
|
102
89
|
key: "getVirtualTop",
|
|
103
90
|
value: function getVirtualTop() {
|
|
@@ -107,7 +94,6 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
107
94
|
key: "getTableRows",
|
|
108
95
|
value: function getTableRows() {
|
|
109
96
|
var _context4;
|
|
110
|
-
|
|
111
97
|
var tbody = this.artTable.querySelector(_concatInstanceProperty(_context4 = ".".concat(Classes.tableBody, " .")).call(_context4, Classes.virtual, " table tbody"));
|
|
112
98
|
return tbody.childNodes;
|
|
113
99
|
}
|
|
@@ -115,16 +101,13 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
115
101
|
key: "getTableBodyHtmlTable",
|
|
116
102
|
value: function getTableBodyHtmlTable() {
|
|
117
103
|
var _context5;
|
|
118
|
-
|
|
119
104
|
return this.artTable.querySelector(_concatInstanceProperty(_context5 = ".".concat(Classes.tableBody, " .")).call(_context5, Classes.virtual, " table"));
|
|
120
105
|
}
|
|
121
106
|
}, {
|
|
122
107
|
key: "getLeftLockShadow",
|
|
123
108
|
value: function getLeftLockShadow() {
|
|
124
109
|
var _context6;
|
|
125
|
-
|
|
126
110
|
var selector = _concatInstanceProperty(_context6 = ".".concat(Classes.lockShadowMask, " .")).call(_context6, Classes.leftLockShadow);
|
|
127
|
-
|
|
128
111
|
var allLeftLockShadow = this.artTable.querySelectorAll(selector);
|
|
129
112
|
return allLeftLockShadow[allLeftLockShadow.length - 1]; // 当table-body、table-footer嵌套多层表格时,需要查找最后一个,否则会查找到嵌套表格的
|
|
130
113
|
}
|
|
@@ -132,9 +115,7 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
132
115
|
key: "getRightLockShadow",
|
|
133
116
|
value: function getRightLockShadow() {
|
|
134
117
|
var _context7;
|
|
135
|
-
|
|
136
118
|
var selector = _concatInstanceProperty(_context7 = ".".concat(Classes.lockShadowMask, " .")).call(_context7, Classes.rightLockShadow);
|
|
137
|
-
|
|
138
119
|
var allRightLockShadow = this.artTable.querySelectorAll(selector);
|
|
139
120
|
return allRightLockShadow[allRightLockShadow.length - 1]; // 当table-body、table-footer嵌套多层表格时,需要查找最后一个,否则会查找到嵌套表格的
|
|
140
121
|
}
|
|
@@ -147,17 +128,13 @@ export var TableDOMHelper = /*#__PURE__*/function () {
|
|
|
147
128
|
key: "getRowTop",
|
|
148
129
|
value: function getRowTop(rowIndex) {
|
|
149
130
|
var _context8, _context9;
|
|
150
|
-
|
|
151
131
|
if (rowIndex === 0) return 0;
|
|
152
|
-
|
|
153
132
|
var selector = _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = ".".concat(Classes.tableBody, " .")).call(_context9, Classes.tableRow, "[data-rowindex=\"")).call(_context8, rowIndex, "\"]");
|
|
154
|
-
|
|
155
133
|
var row = this.artTable.querySelector(selector);
|
|
156
134
|
var rowOffsetTop = row && row.offsetTop || 0;
|
|
157
135
|
var tableOffsetTop = this.tableElement.offsetTop || 0;
|
|
158
136
|
return rowOffsetTop + tableOffsetTop;
|
|
159
137
|
}
|
|
160
138
|
}]);
|
|
161
|
-
|
|
162
139
|
return TableDOMHelper;
|
|
163
140
|
}();
|
|
@@ -8,8 +8,8 @@ describe("".concat(NAME), function () {
|
|
|
8
8
|
});
|
|
9
9
|
it('test skip', function () {
|
|
10
10
|
// 第二行,第一列跳过渲染
|
|
11
|
-
expect(spanManager.testSkip(1, 0)).toBe(true);
|
|
12
|
-
|
|
11
|
+
expect(spanManager.testSkip(1, 0)).toBe(true);
|
|
12
|
+
// 第四行,第一列不跳过渲染
|
|
13
13
|
expect(spanManager.testSkip(3, 0)).toBe(false);
|
|
14
14
|
});
|
|
15
15
|
it('strip upwards span info', function () {
|
|
@@ -7,7 +7,6 @@ describe("".concat(NAME), function () {
|
|
|
7
7
|
var container;
|
|
8
8
|
beforeAll(function () {
|
|
9
9
|
var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13, _context14, _context15, _context16, _context17;
|
|
10
|
-
|
|
11
10
|
container = document.createElement('div');
|
|
12
11
|
container.innerHTML = _concatInstanceProperty(_context = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = _concatInstanceProperty(_context5 = _concatInstanceProperty(_context6 = _concatInstanceProperty(_context7 = _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = _concatInstanceProperty(_context10 = _concatInstanceProperty(_context11 = _concatInstanceProperty(_context12 = _concatInstanceProperty(_context13 = _concatInstanceProperty(_context14 = _concatInstanceProperty(_context15 = _concatInstanceProperty(_context16 = _concatInstanceProperty(_context17 = "<div class='".concat(Classes.artTableWrapper, "'>\n <div class='")).call(_context17, Classes.loadingWrapper, "'>\n <div class='")).call(_context16, Classes.loadingIndicatorWrapper, "'>\n <div class='")).call(_context15, Classes.loadingIndicator, "'></div>\n </div> \n <div class='")).call(_context14, Classes.loadingContentWrapper, "'>\n <div class='")).call(_context13, Classes.artTable, "'>\n <div class='")).call(_context12, Classes.tableHeader, "'>\n \n </div>\n <div class='")).call(_context11, Classes.tableBody, "'>\n <div class='")).call(_context10, Classes.virtual, "'>\n <div class='")).call(_context9, Classes.virtualBlank, " top'></div>\n <table></table>\n <div class='")).call(_context8, Classes.virtualBlank, " bottom'></div>\n </div> \n </div>\n <div class='")).call(_context7, Classes.tableFooter, "'>\n </div>\n <div class='")).call(_context6, Classes.lockShadowMask, "'>\n <div class='")).call(_context5, Classes.leftLockShadow, "'></div>\n </div>\n <div class='")).call(_context4, Classes.lockShadowMask, "'>\n <div class='")).call(_context3, Classes.rightLockShadow, "'></div>\n </div>\n </div>\n <div class='")).call(_context2, Classes.stickyScroll, "'>\n <div class='")).call(_context, Classes.stickyScrollItem, "'></div>\n </div>\n </div> \n </div> \n </div>");
|
|
13
12
|
tableDOMHelper = new TableDOMHelper(container.querySelector(".".concat(Classes.artTableWrapper)));
|
|
@@ -10,51 +10,39 @@ import ResizeObserver from 'resize-observer-polyfill';
|
|
|
10
10
|
import { fromEvent, merge, Observable } from 'rxjs';
|
|
11
11
|
import * as op from 'rxjs/operators';
|
|
12
12
|
import { shallowEqual } from '../utils';
|
|
13
|
-
|
|
14
13
|
function isWindow(arg) {
|
|
15
14
|
return arg.toString() === '[object Window]' || arg.toString() === '[object global]';
|
|
16
15
|
}
|
|
17
|
-
|
|
18
16
|
function isBody(arg) {
|
|
19
17
|
return getNodeName(arg) === 'body';
|
|
20
18
|
}
|
|
21
|
-
|
|
22
19
|
function isHtml(arg) {
|
|
23
20
|
return getNodeName(arg) === 'html';
|
|
24
21
|
}
|
|
25
|
-
|
|
26
22
|
function isHtmlOrBody(arg) {
|
|
27
23
|
return isHtml(arg) || isBody(arg);
|
|
28
|
-
}
|
|
24
|
+
}
|
|
25
|
+
// 计算从 start(子元素)到 stop(祖先元素)之间所有元素的 scrollTop 或 scrollLeft 的和
|
|
29
26
|
// 注意 start 和 stop 都是 INCLUSIVE 的,即两者的 scrollTop 或 scrollLeft 都会统计在内
|
|
30
|
-
|
|
31
|
-
|
|
32
27
|
function accumulateScrollOffset(start, stop, scrollOffsetKey) {
|
|
33
28
|
var result = 0;
|
|
34
29
|
var elem = start;
|
|
35
|
-
|
|
36
30
|
while (elem != null) {
|
|
37
31
|
result += elem[scrollOffsetKey];
|
|
38
|
-
|
|
39
32
|
if (elem === stop || isWindow(stop) && isHtmlOrBody(elem)) {
|
|
40
33
|
break;
|
|
41
34
|
}
|
|
42
|
-
|
|
43
35
|
elem = elem.parentElement;
|
|
44
36
|
}
|
|
45
|
-
|
|
46
37
|
if (isWindow(stop)) {
|
|
47
38
|
result += getWindowScroll(elem)[scrollOffsetKey];
|
|
48
39
|
}
|
|
49
|
-
|
|
50
40
|
return result;
|
|
51
41
|
}
|
|
52
42
|
/**
|
|
53
43
|
* 获取 target 相对于 base 的布局大小和相对位置。
|
|
54
44
|
* 注意该方法会考虑滚动所带来的影响
|
|
55
45
|
*/
|
|
56
|
-
|
|
57
|
-
|
|
58
46
|
function getRelativeLayoutRect(base, target) {
|
|
59
47
|
if (isWindow(target) || isHtmlOrBody(target)) {
|
|
60
48
|
return {
|
|
@@ -64,27 +52,22 @@ function getRelativeLayoutRect(base, target) {
|
|
|
64
52
|
bottom: window.innerHeight
|
|
65
53
|
};
|
|
66
54
|
}
|
|
67
|
-
|
|
68
55
|
var deltaX = 0;
|
|
69
56
|
var deltaY = 0;
|
|
70
57
|
var elem = target;
|
|
71
|
-
|
|
72
58
|
while (elem != null && elem != base) {
|
|
73
59
|
deltaY += elem.offsetTop;
|
|
74
60
|
deltaX += elem.offsetLeft;
|
|
75
61
|
var offsetParent = getOffsetParent(elem);
|
|
76
62
|
deltaY -= accumulateScrollOffset(elem.parentElement, offsetParent, 'scrollTop');
|
|
77
63
|
deltaX -= accumulateScrollOffset(elem.parentElement, offsetParent, 'scrollLeft');
|
|
78
|
-
|
|
79
64
|
if (isWindow(offsetParent)) {
|
|
80
65
|
break;
|
|
81
66
|
}
|
|
82
|
-
|
|
83
67
|
deltaY += offsetParent.clientTop;
|
|
84
68
|
deltaX += offsetParent.clientLeft;
|
|
85
69
|
elem = offsetParent;
|
|
86
70
|
}
|
|
87
|
-
|
|
88
71
|
return {
|
|
89
72
|
top: deltaY,
|
|
90
73
|
bottom: deltaY + target.offsetHeight,
|
|
@@ -92,51 +75,40 @@ function getRelativeLayoutRect(base, target) {
|
|
|
92
75
|
right: deltaX + target.offsetWidth
|
|
93
76
|
};
|
|
94
77
|
}
|
|
95
|
-
|
|
96
78
|
function findCommonOffsetAncestor(target, scrollParent) {
|
|
97
79
|
if (isWindow(scrollParent)) {
|
|
98
80
|
return scrollParent;
|
|
99
81
|
}
|
|
100
|
-
|
|
101
82
|
var offsetParents = listOffsetParents(target);
|
|
102
|
-
|
|
103
83
|
if (_includesInstanceProperty(offsetParents).call(offsetParents, scrollParent)) {
|
|
104
84
|
return scrollParent;
|
|
105
85
|
}
|
|
106
|
-
|
|
107
86
|
return getOffsetParent(scrollParent);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
|
|
87
|
+
}
|
|
88
|
+
// 列出 target 元素上层的所有 offset parents
|
|
111
89
|
function listOffsetParents(target) {
|
|
112
90
|
var result = [];
|
|
113
91
|
var elem = target;
|
|
114
|
-
|
|
115
92
|
while (true) {
|
|
116
93
|
if (isWindow(elem)) {
|
|
117
94
|
break;
|
|
118
95
|
}
|
|
119
|
-
|
|
120
96
|
elem = getOffsetParent(elem);
|
|
121
97
|
result.push(elem);
|
|
122
98
|
}
|
|
123
|
-
|
|
124
99
|
return result;
|
|
125
100
|
}
|
|
126
|
-
|
|
127
101
|
function fromScrollEvent(element) {
|
|
128
102
|
return fromEvent(element, 'scroll', {
|
|
129
103
|
passive: true
|
|
130
104
|
});
|
|
131
105
|
}
|
|
132
|
-
|
|
133
106
|
function fromResizeEvent(element) {
|
|
134
107
|
if (isWindow(element)) {
|
|
135
108
|
return fromEvent(element, 'resize', {
|
|
136
109
|
passive: true
|
|
137
110
|
});
|
|
138
111
|
}
|
|
139
|
-
|
|
140
112
|
return new Observable(function (subscriber) {
|
|
141
113
|
var resizeObserver = new ResizeObserver(function (entries) {
|
|
142
114
|
subscriber.next(entries);
|
|
@@ -147,29 +119,24 @@ function fromResizeEvent(element) {
|
|
|
147
119
|
};
|
|
148
120
|
});
|
|
149
121
|
}
|
|
150
|
-
|
|
151
122
|
function getScrollParent(elem) {
|
|
152
123
|
var _context;
|
|
153
|
-
|
|
154
124
|
if (_includesInstanceProperty(_context = ['html', 'body', '#document']).call(_context, getNodeName(elem))) {
|
|
155
125
|
return getWindow(elem);
|
|
156
126
|
}
|
|
157
|
-
|
|
158
127
|
if (isHTMLElement(elem) && isScrollParent(elem)) {
|
|
159
128
|
return elem;
|
|
160
129
|
}
|
|
161
|
-
|
|
162
130
|
return getScrollParent(getParentNode(elem));
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
|
|
131
|
+
}
|
|
132
|
+
// 获取 target 相对于「它的滚动父元素」的可见部分的大小与位置
|
|
166
133
|
export function getRichVisibleRectsStream(target, structureMayChange$, virtualDebugLabel) {
|
|
167
134
|
return structureMayChange$.pipe(op.startWith('init'), op.map(function () {
|
|
168
135
|
// target 的第一个滚动父元素,我们认为这就是虚拟滚动发生的地方
|
|
169
136
|
// 即虚拟滚动不考虑「更上层元素发生滚动」的情况
|
|
170
137
|
// 直接从父元素开始查找,防止自身设置overflow属性导致是同一个元素
|
|
171
|
-
var scrollParent = getScrollParent(getParentNode(target));
|
|
172
|
-
|
|
138
|
+
var scrollParent = getScrollParent(getParentNode(target));
|
|
139
|
+
// target 和 scrollParent 的共同 offset 祖先,作为布局尺寸计算时的参照元素
|
|
173
140
|
var commonOffsetAncestor = findCommonOffsetAncestor(target, scrollParent);
|
|
174
141
|
return {
|
|
175
142
|
scrollParent: scrollParent,
|
|
@@ -181,7 +148,7 @@ export function getRichVisibleRectsStream(target, structureMayChange$, virtualDe
|
|
|
181
148
|
}
|
|
182
149
|
}), op.switchMap(function (_ref) {
|
|
183
150
|
var scrollParent = _ref.scrollParent,
|
|
184
|
-
|
|
151
|
+
commonOffsetAncestor = _ref.commonOffsetAncestor;
|
|
185
152
|
var events$ = merge(fromScrollEvent(scrollParent), fromResizeEvent(scrollParent), fromResizeEvent(target));
|
|
186
153
|
return events$.pipe(op.map(function (event) {
|
|
187
154
|
return {
|
|
@@ -191,8 +158,8 @@ export function getRichVisibleRectsStream(target, structureMayChange$, virtualDe
|
|
|
191
158
|
};
|
|
192
159
|
}), op.map(function (_ref2) {
|
|
193
160
|
var event = _ref2.event,
|
|
194
|
-
|
|
195
|
-
|
|
161
|
+
scrollParentRect = _ref2.scrollParentRect,
|
|
162
|
+
targetRect = _ref2.targetRect;
|
|
196
163
|
return {
|
|
197
164
|
event: event,
|
|
198
165
|
targetRect: targetRect,
|