@douyinfe/semi-foundation 2.38.3-alpha.2-patch-select-max → 2.38.3-alpha.2-3117
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.
|
@@ -6,10 +6,17 @@ export interface OverflowListAdapter extends DefaultAdapter {
|
|
|
6
6
|
getItemSizeMap: () => Map<string, number>;
|
|
7
7
|
}
|
|
8
8
|
declare class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
|
|
9
|
+
previousOverflowResult: Array<Array<Record<string, any>>>;
|
|
10
|
+
stateChangeHistory: Map<string, number[]>;
|
|
11
|
+
lastStableUpdateTimestamp: number;
|
|
9
12
|
constructor(adapter: OverflowListAdapter);
|
|
10
13
|
previousY: any;
|
|
11
14
|
isScrollMode: () => boolean;
|
|
12
15
|
getOverflowItem(): Array<Array<Record<string, any>>>;
|
|
16
|
+
/**
|
|
17
|
+
* 检查 overflow 结果是否发生变化
|
|
18
|
+
*/
|
|
19
|
+
isOverflowResultChanged(newResult: Array<Array<Record<string, any>>>): boolean;
|
|
13
20
|
handleIntersect(entries: Array<IntersectionObserverEntry>): void;
|
|
14
21
|
getReversedItems: () => any;
|
|
15
22
|
handleCollapseOverflow(): void;
|
|
@@ -11,9 +11,17 @@ var _constants = require("./constants");
|
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
12
|
const Boundary = _constants.strings.BOUNDARY_MAP;
|
|
13
13
|
const OverflowDirection = _constants.strings.OVERFLOW_DIR;
|
|
14
|
+
// 防抖稳定性检测的时间阈值（毫秒）
|
|
15
|
+
const STABILITY_THRESHOLD_MS = 150;
|
|
14
16
|
class OverflowListFoundation extends _foundation.default {
|
|
15
17
|
constructor(adapter) {
|
|
16
18
|
super(Object.assign({}, adapter));
|
|
19
|
+
// 记录上次的 overflow 结果，用于稳定性检测
|
|
20
|
+
this.previousOverflowResult = [[], []];
|
|
21
|
+
// 记录每个 item 的状态变化历史（时间戳）
|
|
22
|
+
this.stateChangeHistory = new Map();
|
|
23
|
+
// 最后一次稳定更新的时间戳
|
|
24
|
+
this.lastStableUpdateTimestamp = 0;
|
|
17
25
|
this.previousY = undefined;
|
|
18
26
|
this.isScrollMode = () => {
|
|
19
27
|
const {
|
|
@@ -50,8 +58,39 @@ class OverflowListFoundation extends _foundation.default {
|
|
|
50
58
|
const overflowList = [];
|
|
51
59
|
overflowList[0] = visibleStart >= 0 ? items.slice(0, visibleStart) : [];
|
|
52
60
|
overflowList[1] = visibleEnd >= 0 ? items.slice(visibleEnd + 1, items.length) : items;
|
|
61
|
+
// 稳定性检测：比较新旧 overflow 结果
|
|
62
|
+
const isResultChanged = this.isOverflowResultChanged(overflowList);
|
|
63
|
+
if (isResultChanged) {
|
|
64
|
+
const now = Date.now();
|
|
65
|
+
const timeSinceLastUpdate = now - this.lastStableUpdateTimestamp;
|
|
66
|
+
// 如果距离上次稳定更新时间太短，说明可能在抖动，返回上次稳定结果
|
|
67
|
+
if (timeSinceLastUpdate < STABILITY_THRESHOLD_MS && this.previousOverflowResult[0].length + this.previousOverflowResult[1].length > 0) {
|
|
68
|
+
return this.previousOverflowResult;
|
|
69
|
+
}
|
|
70
|
+
// 更新稳定状态
|
|
71
|
+
this.lastStableUpdateTimestamp = now;
|
|
72
|
+
this.previousOverflowResult = overflowList;
|
|
73
|
+
}
|
|
53
74
|
return overflowList;
|
|
54
75
|
}
|
|
76
|
+
/**
|
|
77
|
+
* 检查 overflow 结果是否发生变化
|
|
78
|
+
*/
|
|
79
|
+
isOverflowResultChanged(newResult) {
|
|
80
|
+
const prevLeft = this.previousOverflowResult[0];
|
|
81
|
+
const prevRight = this.previousOverflowResult[1];
|
|
82
|
+
const newLeft = newResult[0];
|
|
83
|
+
const newRight = newResult[1];
|
|
84
|
+
if (prevLeft.length !== newLeft.length || prevRight.length !== newRight.length) {
|
|
85
|
+
return true;
|
|
86
|
+
}
|
|
87
|
+
// 比较 key 是否一致
|
|
88
|
+
const prevLeftKeys = prevLeft.map(item => item.key).join(',');
|
|
89
|
+
const prevRightKeys = prevRight.map(item => item.key).join(',');
|
|
90
|
+
const newLeftKeys = newLeft.map(item => item.key).join(',');
|
|
91
|
+
const newRightKeys = newRight.map(item => item.key).join(',');
|
|
92
|
+
return prevLeftKeys !== newLeftKeys || prevRightKeys !== newRightKeys;
|
|
93
|
+
}
|
|
55
94
|
handleIntersect(entries) {
|
|
56
95
|
const visibleState = (0, _cloneDeep2.default)(this.getState('visibleState'));
|
|
57
96
|
const res = {};
|
|
@@ -6,10 +6,17 @@ export interface OverflowListAdapter extends DefaultAdapter {
|
|
|
6
6
|
getItemSizeMap: () => Map<string, number>;
|
|
7
7
|
}
|
|
8
8
|
declare class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
|
|
9
|
+
previousOverflowResult: Array<Array<Record<string, any>>>;
|
|
10
|
+
stateChangeHistory: Map<string, number[]>;
|
|
11
|
+
lastStableUpdateTimestamp: number;
|
|
9
12
|
constructor(adapter: OverflowListAdapter);
|
|
10
13
|
previousY: any;
|
|
11
14
|
isScrollMode: () => boolean;
|
|
12
15
|
getOverflowItem(): Array<Array<Record<string, any>>>;
|
|
16
|
+
/**
|
|
17
|
+
* 检查 overflow 结果是否发生变化
|
|
18
|
+
*/
|
|
19
|
+
isOverflowResultChanged(newResult: Array<Array<Record<string, any>>>): boolean;
|
|
13
20
|
handleIntersect(entries: Array<IntersectionObserverEntry>): void;
|
|
14
21
|
getReversedItems: () => any;
|
|
15
22
|
handleCollapseOverflow(): void;
|
|
@@ -4,9 +4,17 @@ import BaseFoundation from '../base/foundation';
|
|
|
4
4
|
import { strings } from './constants';
|
|
5
5
|
const Boundary = strings.BOUNDARY_MAP;
|
|
6
6
|
const OverflowDirection = strings.OVERFLOW_DIR;
|
|
7
|
+
// 防抖稳定性检测的时间阈值（毫秒）
|
|
8
|
+
const STABILITY_THRESHOLD_MS = 150;
|
|
7
9
|
class OverflowListFoundation extends BaseFoundation {
|
|
8
10
|
constructor(adapter) {
|
|
9
11
|
super(Object.assign({}, adapter));
|
|
12
|
+
// 记录上次的 overflow 结果，用于稳定性检测
|
|
13
|
+
this.previousOverflowResult = [[], []];
|
|
14
|
+
// 记录每个 item 的状态变化历史（时间戳）
|
|
15
|
+
this.stateChangeHistory = new Map();
|
|
16
|
+
// 最后一次稳定更新的时间戳
|
|
17
|
+
this.lastStableUpdateTimestamp = 0;
|
|
10
18
|
this.previousY = undefined;
|
|
11
19
|
this.isScrollMode = () => {
|
|
12
20
|
const {
|
|
@@ -43,8 +51,39 @@ class OverflowListFoundation extends BaseFoundation {
|
|
|
43
51
|
const overflowList = [];
|
|
44
52
|
overflowList[0] = visibleStart >= 0 ? items.slice(0, visibleStart) : [];
|
|
45
53
|
overflowList[1] = visibleEnd >= 0 ? items.slice(visibleEnd + 1, items.length) : items;
|
|
54
|
+
// 稳定性检测：比较新旧 overflow 结果
|
|
55
|
+
const isResultChanged = this.isOverflowResultChanged(overflowList);
|
|
56
|
+
if (isResultChanged) {
|
|
57
|
+
const now = Date.now();
|
|
58
|
+
const timeSinceLastUpdate = now - this.lastStableUpdateTimestamp;
|
|
59
|
+
// 如果距离上次稳定更新时间太短，说明可能在抖动，返回上次稳定结果
|
|
60
|
+
if (timeSinceLastUpdate < STABILITY_THRESHOLD_MS && this.previousOverflowResult[0].length + this.previousOverflowResult[1].length > 0) {
|
|
61
|
+
return this.previousOverflowResult;
|
|
62
|
+
}
|
|
63
|
+
// 更新稳定状态
|
|
64
|
+
this.lastStableUpdateTimestamp = now;
|
|
65
|
+
this.previousOverflowResult = overflowList;
|
|
66
|
+
}
|
|
46
67
|
return overflowList;
|
|
47
68
|
}
|
|
69
|
+
/**
|
|
70
|
+
* 检查 overflow 结果是否发生变化
|
|
71
|
+
*/
|
|
72
|
+
isOverflowResultChanged(newResult) {
|
|
73
|
+
const prevLeft = this.previousOverflowResult[0];
|
|
74
|
+
const prevRight = this.previousOverflowResult[1];
|
|
75
|
+
const newLeft = newResult[0];
|
|
76
|
+
const newRight = newResult[1];
|
|
77
|
+
if (prevLeft.length !== newLeft.length || prevRight.length !== newRight.length) {
|
|
78
|
+
return true;
|
|
79
|
+
}
|
|
80
|
+
// 比较 key 是否一致
|
|
81
|
+
const prevLeftKeys = prevLeft.map(item => item.key).join(',');
|
|
82
|
+
const prevRightKeys = prevRight.map(item => item.key).join(',');
|
|
83
|
+
const newLeftKeys = newLeft.map(item => item.key).join(',');
|
|
84
|
+
const newRightKeys = newRight.map(item => item.key).join(',');
|
|
85
|
+
return prevLeftKeys !== newLeftKeys || prevRightKeys !== newRightKeys;
|
|
86
|
+
}
|
|
48
87
|
handleIntersect(entries) {
|
|
49
88
|
const visibleState = _cloneDeep(this.getState('visibleState'));
|
|
50
89
|
const res = {};
|
|
@@ -11,7 +11,18 @@ export interface OverflowListAdapter extends DefaultAdapter {
|
|
|
11
11
|
getItemSizeMap: () => Map<string, number>
|
|
12
12
|
}
|
|
13
13
|
|
|
14
|
+
// 防抖稳定性检测的时间阈值（毫秒）
|
|
15
|
+
const STABILITY_THRESHOLD_MS = 150;
|
|
16
|
+
|
|
14
17
|
class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
|
|
18
|
+
// 记录上次的 overflow 结果，用于稳定性检测
|
|
19
|
+
previousOverflowResult: Array<Array<Record<string, any>>> = [[], []];
|
|
20
|
+
|
|
21
|
+
// 记录每个 item 的状态变化历史（时间戳）
|
|
22
|
+
stateChangeHistory: Map<string, number[]> = new Map();
|
|
23
|
+
|
|
24
|
+
// 最后一次稳定更新的时间戳
|
|
25
|
+
lastStableUpdateTimestamp: number = 0;
|
|
15
26
|
|
|
16
27
|
constructor(adapter: OverflowListAdapter) {
|
|
17
28
|
super({ ...adapter });
|
|
@@ -35,11 +46,51 @@ class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
|
|
|
35
46
|
const visibleStart = visibleStateArr.indexOf(true);
|
|
36
47
|
const visibleEnd = visibleStateArr.lastIndexOf(true);
|
|
37
48
|
|
|
38
|
-
const overflowList = [];
|
|
49
|
+
const overflowList: Array<Array<Record<string, any>>> = [];
|
|
39
50
|
overflowList[0] = visibleStart >= 0 ? items.slice(0, visibleStart) : [];
|
|
40
51
|
overflowList[1] = visibleEnd >= 0 ? items.slice(visibleEnd + 1, items.length) : items;
|
|
52
|
+
|
|
53
|
+
// 稳定性检测：比较新旧 overflow 结果
|
|
54
|
+
const isResultChanged = this.isOverflowResultChanged(overflowList);
|
|
55
|
+
|
|
56
|
+
if (isResultChanged) {
|
|
57
|
+
const now = Date.now();
|
|
58
|
+
const timeSinceLastUpdate = now - this.lastStableUpdateTimestamp;
|
|
59
|
+
|
|
60
|
+
// 如果距离上次稳定更新时间太短，说明可能在抖动，返回上次稳定结果
|
|
61
|
+
if (timeSinceLastUpdate < STABILITY_THRESHOLD_MS && this.previousOverflowResult[0].length + this.previousOverflowResult[1].length > 0) {
|
|
62
|
+
return this.previousOverflowResult;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
// 更新稳定状态
|
|
66
|
+
this.lastStableUpdateTimestamp = now;
|
|
67
|
+
this.previousOverflowResult = overflowList;
|
|
68
|
+
}
|
|
69
|
+
|
|
41
70
|
return overflowList;
|
|
42
71
|
}
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
* 检查 overflow 结果是否发生变化
|
|
75
|
+
*/
|
|
76
|
+
isOverflowResultChanged(newResult: Array<Array<Record<string, any>>>): boolean {
|
|
77
|
+
const prevLeft = this.previousOverflowResult[0];
|
|
78
|
+
const prevRight = this.previousOverflowResult[1];
|
|
79
|
+
const newLeft = newResult[0];
|
|
80
|
+
const newRight = newResult[1];
|
|
81
|
+
|
|
82
|
+
if (prevLeft.length !== newLeft.length || prevRight.length !== newRight.length) {
|
|
83
|
+
return true;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
// 比较 key 是否一致
|
|
87
|
+
const prevLeftKeys = prevLeft.map(item => item.key).join(',');
|
|
88
|
+
const prevRightKeys = prevRight.map(item => item.key).join(',');
|
|
89
|
+
const newLeftKeys = newLeft.map(item => item.key).join(',');
|
|
90
|
+
const newRightKeys = newRight.map(item => item.key).join(',');
|
|
91
|
+
|
|
92
|
+
return prevLeftKeys !== newLeftKeys || prevRightKeys !== newRightKeys;
|
|
93
|
+
}
|
|
43
94
|
|
|
44
95
|
handleIntersect(entries: Array<IntersectionObserverEntry>): void {
|
|
45
96
|
const visibleState = cloneDeep(this.getState('visibleState'));
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@douyinfe/semi-foundation",
|
|
3
|
-
"version": "2.38.3-alpha.2-
|
|
3
|
+
"version": "2.38.3-alpha.2-3117",
|
|
4
4
|
"description": "",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build:lib": "node ./scripts/compileLib.js",
|
|
7
7
|
"prepublishOnly": "npm run build:lib"
|
|
8
8
|
},
|
|
9
9
|
"dependencies": {
|
|
10
|
-
"@douyinfe/semi-animation": "2.38.3-alpha.2-
|
|
10
|
+
"@douyinfe/semi-animation": "2.38.3-alpha.2-3117",
|
|
11
11
|
"async-validator": "^3.5.0",
|
|
12
12
|
"classnames": "^2.2.6",
|
|
13
13
|
"date-fns": "^2.29.3",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"*.scss",
|
|
24
24
|
"*.css"
|
|
25
25
|
],
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "78704d1814b34a77efdbd62742b288204e056733",
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@babel/plugin-transform-runtime": "^7.15.8",
|
|
29
29
|
"@babel/preset-env": "^7.15.8",
|