@tarojs/components-advanced 3.6.0-beta.1 → 3.6.0-beta.3
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/components/index.d.ts +1 -1
- package/dist/components/index.js +2 -1
- package/dist/components/index.js.map +1 -0
- package/dist/components/virtual-list/constants.d.ts +2 -1
- package/dist/components/virtual-list/constants.js +4 -1
- package/dist/components/virtual-list/constants.js.map +1 -0
- package/dist/components/virtual-list/dom-helpers.d.ts +2 -1
- package/dist/components/virtual-list/dom-helpers.js +33 -30
- package/dist/components/virtual-list/dom-helpers.js.map +1 -0
- package/dist/components/virtual-list/index.d.ts +3 -4
- package/dist/components/virtual-list/index.js +5 -102
- package/dist/components/virtual-list/index.js.map +1 -0
- package/dist/components/virtual-list/list-set.d.ts +4 -4
- package/dist/components/virtual-list/list-set.js +178 -223
- package/dist/components/virtual-list/list-set.js.map +1 -0
- package/dist/components/virtual-list/preset.d.ts +7 -6
- package/dist/components/virtual-list/preset.js +117 -148
- package/dist/components/virtual-list/preset.js.map +1 -0
- package/dist/components/virtual-list/react/index.d.ts +2 -2
- package/dist/components/virtual-list/react/index.js +31 -59
- package/dist/components/virtual-list/react/index.js.map +1 -0
- package/dist/components/virtual-list/react/list.d.ts +10 -5
- package/dist/components/virtual-list/react/list.js +347 -451
- package/dist/components/virtual-list/react/list.js.map +1 -0
- package/dist/components/virtual-list/react/validate.d.ts +4 -3
- package/dist/components/virtual-list/react/validate.js +60 -66
- package/dist/components/virtual-list/react/validate.js.map +1 -0
- package/dist/components/virtual-list/utils.d.ts +5 -5
- package/dist/components/virtual-list/utils.js +27 -28
- package/dist/components/virtual-list/utils.js.map +1 -0
- package/dist/components/virtual-list/vue/index.d.ts +6 -6
- package/dist/components/virtual-list/vue/index.js +10 -6
- package/dist/components/virtual-list/vue/index.js.map +1 -0
- package/dist/components/virtual-list/vue/list.d.ts +2 -2
- package/dist/components/virtual-list/vue/list.js +435 -475
- package/dist/components/virtual-list/vue/list.js.map +1 -0
- package/dist/components/virtual-list/vue/render.d.ts +2 -1
- package/dist/components/virtual-list/vue/render.js +17 -24
- package/dist/components/virtual-list/vue/render.js.map +1 -0
- package/dist/index.d.ts +2 -2
- package/dist/index.js +8 -2
- package/dist/index.js.map +1 -0
- package/dist/utils/convert.d.ts +3 -2
- package/dist/utils/convert.js +15 -11
- package/dist/utils/convert.js.map +1 -0
- package/dist/utils/index.d.ts +4 -5
- package/dist/utils/index.js +5 -5
- package/dist/utils/index.js.map +1 -0
- package/dist/utils/lodash.d.ts +2 -1
- package/dist/utils/lodash.js +10 -10
- package/dist/utils/lodash.js.map +1 -0
- package/dist/utils/math.d.ts +3 -2
- package/dist/utils/math.js +13 -16
- package/dist/utils/math.js.map +1 -0
- package/dist/utils/timer.d.ts +3 -3
- package/dist/utils/timer.js +21 -17
- package/dist/utils/timer.js.map +1 -0
- package/package.json +16 -8
- package/dist/utils/constants.d.ts +0 -4
- package/dist/utils/constants.js +0 -4
|
@@ -1,228 +1,183 @@
|
|
|
1
|
-
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
-
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
3
|
-
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
4
|
-
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
5
|
-
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
6
1
|
import { isFunction } from '@tarojs/shared';
|
|
7
|
-
import {
|
|
8
|
-
import { isHorizontalFunc } from './utils';
|
|
9
|
-
var ListSet = /*#__PURE__*/function () {
|
|
10
|
-
function ListSet(props, refresh) {
|
|
11
|
-
_classCallCheck(this, ListSet);
|
|
12
|
-
this.props = props;
|
|
13
|
-
this.refresh = refresh;
|
|
14
|
-
_defineProperty(this, "list", []);
|
|
15
|
-
_defineProperty(this, "mode", void 0);
|
|
16
|
-
_defineProperty(this, "defaultSize", 1);
|
|
17
|
-
this.update(props);
|
|
2
|
+
import { isHorizontalFunc } from './utils.js';
|
|
18
3
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
this.list = new Array(this.length).fill(-1);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
_createClass(ListSet, [{
|
|
33
|
-
key: "isNormalMode",
|
|
34
|
-
get: function get() {
|
|
35
|
-
return this.mode === 'normal';
|
|
36
|
-
}
|
|
37
|
-
}, {
|
|
38
|
-
key: "isFunctionMode",
|
|
39
|
-
get: function get() {
|
|
40
|
-
return this.mode === 'function';
|
|
41
|
-
}
|
|
42
|
-
}, {
|
|
43
|
-
key: "isUnlimitedMode",
|
|
44
|
-
get: function get() {
|
|
45
|
-
return this.mode === 'unlimited';
|
|
46
|
-
}
|
|
47
|
-
}, {
|
|
48
|
-
key: "length",
|
|
49
|
-
get: function get() {
|
|
50
|
-
return this.props.itemCount || 100;
|
|
51
|
-
}
|
|
52
|
-
}, {
|
|
53
|
-
key: "overscan",
|
|
54
|
-
get: function get() {
|
|
55
|
-
return this.props.overscanCount || 0;
|
|
56
|
-
}
|
|
57
|
-
}, {
|
|
58
|
-
key: "wrapperSize",
|
|
59
|
-
get: function get() {
|
|
60
|
-
var _this$props = this.props,
|
|
61
|
-
height = _this$props.height,
|
|
62
|
-
width = _this$props.width;
|
|
63
|
-
var isHorizontal = isHorizontalFunc(this.props);
|
|
64
|
-
var size = isHorizontal ? width : height;
|
|
65
|
-
if (!IS_PROD && typeof size !== 'number') {
|
|
66
|
-
console.warn("In mode ".concat(isHorizontal ? 'horizontal, width' : 'vertical, height', " parameter should be a number, but got ").concat(_typeof(size), "."));
|
|
67
|
-
}
|
|
68
|
-
return size;
|
|
69
|
-
}
|
|
70
|
-
}, {
|
|
71
|
-
key: "update",
|
|
72
|
-
value: function update(props) {
|
|
73
|
-
this.props = props;
|
|
74
|
-
if (this.length > this.list.length) {
|
|
75
|
-
var _this$list;
|
|
76
|
-
var arr = new Array(this.length - this.list.length).fill(-1);
|
|
77
|
-
(_this$list = this.list).push.apply(_this$list, _toConsumableArray(arr));
|
|
78
|
-
} else if (this.length < this.list.length) {
|
|
79
|
-
this.list.length = this.length;
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
}, {
|
|
83
|
-
key: "setSize",
|
|
84
|
-
value: function setSize() {
|
|
85
|
-
var _this$refresh;
|
|
86
|
-
var i = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
87
|
-
var size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.defaultSize;
|
|
88
|
-
this.list[i] = size;
|
|
89
|
-
(_this$refresh = this.refresh) === null || _this$refresh === void 0 ? void 0 : _this$refresh.call(this);
|
|
90
|
-
}
|
|
91
|
-
}, {
|
|
92
|
-
key: "getSize",
|
|
93
|
-
value: function getSize() {
|
|
94
|
-
var i = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
95
|
-
var size = this.props.itemSize;
|
|
96
|
-
var item = this.list[i];
|
|
97
|
-
if (item >= 0) return item;
|
|
98
|
-
if (this.isFunctionMode && isFunction(size)) {
|
|
99
|
-
var itemSize = size(i, this.props.itemData);
|
|
100
|
-
this.setSize(i, itemSize);
|
|
101
|
-
return itemSize;
|
|
102
|
-
}
|
|
103
|
-
return this.defaultSize;
|
|
104
|
-
}
|
|
105
|
-
}, {
|
|
106
|
-
key: "getOffsetSize",
|
|
107
|
-
value: function getOffsetSize() {
|
|
108
|
-
var _this = this;
|
|
109
|
-
var i = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.list.length;
|
|
110
|
-
if (this.isNormalMode) return i * this.defaultSize;
|
|
111
|
-
return this.list.slice(0, i).reduce(function (sum, _, idx) {
|
|
112
|
-
return sum + _this.getSize(idx);
|
|
113
|
-
}, 0);
|
|
114
|
-
}
|
|
115
|
-
}, {
|
|
116
|
-
key: "getSizeCount",
|
|
117
|
-
value: function getSizeCount() {
|
|
118
|
-
var _this2 = this;
|
|
119
|
-
var offset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
120
|
-
if (offset === 0) {
|
|
121
|
-
return 0;
|
|
122
|
-
}
|
|
123
|
-
// if (this.isNormalMode) {
|
|
124
|
-
// return Math.min(this.length - 1, Math.floor(offset / this.length))
|
|
125
|
-
// }
|
|
126
|
-
var offsetSize = 0;
|
|
127
|
-
var count = this.list.reduce(function (sum, _, idx) {
|
|
128
|
-
if (offsetSize < offset) {
|
|
129
|
-
offsetSize += _this2.getSize(idx);
|
|
130
|
-
return ++sum;
|
|
4
|
+
class ListSet {
|
|
5
|
+
constructor(props, refresh) {
|
|
6
|
+
this.props = props;
|
|
7
|
+
this.refresh = refresh;
|
|
8
|
+
this.list = [];
|
|
9
|
+
this.defaultSize = 1;
|
|
10
|
+
this.update(props);
|
|
11
|
+
// Note: 不考虑列表模式切换情况,可能会导致列表抖动体验过差
|
|
12
|
+
if (this.props.unlimitedSize) {
|
|
13
|
+
this.mode = 'unlimited';
|
|
131
14
|
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
value: function getOffsetForIndexAndAlignment(index, align, scrollOffset) {
|
|
176
|
-
var wrapperSize = this.wrapperSize;
|
|
177
|
-
var itemSize = this.getSize(index);
|
|
178
|
-
var lastItemOffset = Math.max(0, this.getOffsetSize(this.props.itemCount) - wrapperSize);
|
|
179
|
-
var maxOffset = Math.min(lastItemOffset, this.getOffsetSize(index));
|
|
180
|
-
var minOffset = Math.max(0, this.getOffsetSize(index) - wrapperSize + itemSize);
|
|
181
|
-
if (align === 'smart') {
|
|
182
|
-
if (scrollOffset >= minOffset - wrapperSize && scrollOffset <= maxOffset + wrapperSize) {
|
|
183
|
-
align = 'auto';
|
|
184
|
-
} else {
|
|
185
|
-
align = 'center';
|
|
15
|
+
else if (isFunction(this.props.itemSize)) {
|
|
16
|
+
this.mode = 'function';
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
this.mode = 'normal';
|
|
20
|
+
}
|
|
21
|
+
this.defaultSize = (isFunction(this.props.itemSize) ? this.props.itemSize() : this.props.itemSize) || 1;
|
|
22
|
+
if (!this.isNormalMode) {
|
|
23
|
+
this.list = new Array(this.length).fill(-1);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
get isNormalMode() {
|
|
27
|
+
return this.mode === 'normal';
|
|
28
|
+
}
|
|
29
|
+
get isFunctionMode() {
|
|
30
|
+
return this.mode === 'function';
|
|
31
|
+
}
|
|
32
|
+
get isUnlimitedMode() {
|
|
33
|
+
return this.mode === 'unlimited';
|
|
34
|
+
}
|
|
35
|
+
get length() {
|
|
36
|
+
return this.props.itemCount || 100;
|
|
37
|
+
}
|
|
38
|
+
get overscan() {
|
|
39
|
+
return this.props.overscanCount || 0;
|
|
40
|
+
}
|
|
41
|
+
get wrapperSize() {
|
|
42
|
+
const { height, width } = this.props;
|
|
43
|
+
const isHorizontal = isHorizontalFunc(this.props);
|
|
44
|
+
const size = (isHorizontal ? width : height);
|
|
45
|
+
if (process.env.NODE_ENV !== 'production' && typeof size !== 'number') {
|
|
46
|
+
console.warn(`In mode ${isHorizontal ? 'horizontal, width' : 'vertical, height'} parameter should be a number, but got ${typeof size}.`);
|
|
47
|
+
}
|
|
48
|
+
return size;
|
|
49
|
+
}
|
|
50
|
+
update(props) {
|
|
51
|
+
this.props = props;
|
|
52
|
+
if (this.length > this.list.length) {
|
|
53
|
+
const arr = new Array(this.length - this.list.length).fill(-1);
|
|
54
|
+
this.list.push(...arr);
|
|
55
|
+
}
|
|
56
|
+
else if (this.length < this.list.length) {
|
|
57
|
+
this.list.length = this.length;
|
|
186
58
|
}
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
59
|
+
}
|
|
60
|
+
setSize(i = 0, size = this.defaultSize) {
|
|
61
|
+
var _a;
|
|
62
|
+
this.list[i] = size;
|
|
63
|
+
(_a = this.refresh) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
64
|
+
}
|
|
65
|
+
getSize(i = 0) {
|
|
66
|
+
const size = this.props.itemSize;
|
|
67
|
+
const item = this.list[i];
|
|
68
|
+
if (item >= 0)
|
|
69
|
+
return item;
|
|
70
|
+
if (this.isFunctionMode && isFunction(size)) {
|
|
71
|
+
const itemSize = size(i, this.props.itemData);
|
|
72
|
+
this.setSize(i, itemSize);
|
|
73
|
+
return itemSize;
|
|
74
|
+
}
|
|
75
|
+
return this.defaultSize;
|
|
76
|
+
}
|
|
77
|
+
getOffsetSize(i = this.list.length) {
|
|
78
|
+
if (this.isNormalMode)
|
|
79
|
+
return i * this.defaultSize;
|
|
80
|
+
return this.list.slice(0, i).reduce((sum, _, idx) => sum + this.getSize(idx), 0);
|
|
81
|
+
}
|
|
82
|
+
getSizeCount(offset = 0) {
|
|
83
|
+
if (offset === 0) {
|
|
84
|
+
return 0;
|
|
85
|
+
}
|
|
86
|
+
// if (this.isNormalMode) {
|
|
87
|
+
// return Math.min(this.length - 1, Math.floor(offset / this.length))
|
|
88
|
+
// }
|
|
89
|
+
let offsetSize = 0;
|
|
90
|
+
const count = this.list.reduce((sum, _, idx) => {
|
|
91
|
+
if (offsetSize < offset) {
|
|
92
|
+
offsetSize += this.getSize(idx);
|
|
93
|
+
return ++sum;
|
|
94
|
+
}
|
|
95
|
+
return sum;
|
|
96
|
+
}, 0);
|
|
97
|
+
return count - 1;
|
|
98
|
+
}
|
|
99
|
+
getStartIndex(scrollOffset = 0) {
|
|
100
|
+
return Math.max(0, this.getSizeCount(scrollOffset) - 1);
|
|
101
|
+
}
|
|
102
|
+
getStopIndex(wrapperSize = 0, scrollOffset = 0, startIndex = 0) {
|
|
103
|
+
// const visibleOffset = this.getOffsetSize(startIndex)
|
|
104
|
+
// if (this.isNormalMode) {
|
|
105
|
+
// const numVisibleItems = Math.ceil((wrapperSize + scrollOffset - visibleOffset) / this.length)
|
|
106
|
+
// /** -1 is because stop index is inclusive */
|
|
107
|
+
// return Math.max(startIndex, Math.min(this.length - 1, startIndex + numVisibleItems - 1))
|
|
108
|
+
// }
|
|
109
|
+
return Math.max(startIndex, Math.min(this.length - 1, this.getSizeCount(wrapperSize + scrollOffset)));
|
|
110
|
+
}
|
|
111
|
+
getRangeToRender(direction, scrollOffset = 0, block = false) {
|
|
112
|
+
if (this.length === 0) {
|
|
113
|
+
return [0, 0, 0, 0];
|
|
114
|
+
}
|
|
115
|
+
const wrapperSize = this.wrapperSize;
|
|
116
|
+
const startIndex = this.getStartIndex(scrollOffset);
|
|
117
|
+
const stopIndex = this.getStopIndex(wrapperSize, scrollOffset, startIndex);
|
|
118
|
+
// Overscan by one item in each direction so that tab/focus works. If there isn't at least one extra item, tab loops back around.
|
|
119
|
+
const overscanBackward = !block || direction === 'backward' ? Math.max(1, this.overscan) : 1;
|
|
120
|
+
const overscanForward = !block || direction === 'forward' ? Math.max(1, this.overscan) : 1;
|
|
121
|
+
return [
|
|
122
|
+
Math.max(0, startIndex - overscanBackward),
|
|
123
|
+
Math.max(0, Math.min(this.length - 1, stopIndex + overscanForward)),
|
|
124
|
+
startIndex,
|
|
125
|
+
stopIndex
|
|
126
|
+
];
|
|
127
|
+
}
|
|
128
|
+
getOffsetForIndexAndAlignment(index, align, scrollOffset) {
|
|
129
|
+
const wrapperSize = this.wrapperSize;
|
|
130
|
+
const itemSize = this.getSize(index);
|
|
131
|
+
const lastItemOffset = Math.max(0, this.getOffsetSize(this.props.itemCount) - wrapperSize);
|
|
132
|
+
const maxOffset = Math.min(lastItemOffset, this.getOffsetSize(index));
|
|
133
|
+
const minOffset = Math.max(0, this.getOffsetSize(index) - wrapperSize + itemSize);
|
|
134
|
+
if (align === 'smart') {
|
|
135
|
+
if (scrollOffset >= minOffset - wrapperSize && scrollOffset <= maxOffset + wrapperSize) {
|
|
136
|
+
align = 'auto';
|
|
204
137
|
}
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
}
|
|
228
|
-
|
|
138
|
+
else {
|
|
139
|
+
align = 'center';
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
switch (align) {
|
|
143
|
+
case 'start':
|
|
144
|
+
return maxOffset;
|
|
145
|
+
case 'end':
|
|
146
|
+
return minOffset;
|
|
147
|
+
case 'center':
|
|
148
|
+
{
|
|
149
|
+
// "Centered" offset is usually the average of the min and max.
|
|
150
|
+
// But near the edges of the list, this doesn't hold true.
|
|
151
|
+
const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
|
|
152
|
+
if (middleOffset < Math.ceil(wrapperSize / 2)) {
|
|
153
|
+
return 0; // near the beginning
|
|
154
|
+
}
|
|
155
|
+
else if (middleOffset > lastItemOffset + Math.floor(wrapperSize / 2)) {
|
|
156
|
+
return lastItemOffset; // near the end
|
|
157
|
+
}
|
|
158
|
+
else {
|
|
159
|
+
return middleOffset;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
case 'auto':
|
|
163
|
+
default:
|
|
164
|
+
if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
|
|
165
|
+
return scrollOffset;
|
|
166
|
+
}
|
|
167
|
+
else if (scrollOffset < minOffset) {
|
|
168
|
+
return minOffset;
|
|
169
|
+
}
|
|
170
|
+
else {
|
|
171
|
+
return maxOffset;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
compareSize(i = 0, size = 0) {
|
|
176
|
+
if (this.isNormalMode)
|
|
177
|
+
return true;
|
|
178
|
+
return this.getSize(i) === size;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
export { ListSet as default };
|
|
183
|
+
//# sourceMappingURL=list-set.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list-set.js","sources":["../../../src/components/virtual-list/list-set.ts"],"sourcesContent":["import { isFunction } from '@tarojs/shared'\n\nimport { isHorizontalFunc } from './utils'\n\nimport type { IProps } from './preset'\n\ntype TProps = Pick<IProps, 'width' | 'height' | 'unlimitedSize' | 'itemCount' | 'itemData' | 'itemSize' | 'overscanCount' | 'direction' | 'layout'>\n\nexport default class ListSet {\n list: number[] = []\n mode?: 'normal' | 'function' | 'unlimited'\n defaultSize = 1\n\n constructor (protected props: TProps, protected refresh?: TFunc) {\n this.update(props)\n\n // Note: 不考虑列表模式切换情况,可能会导致列表抖动体验过差\n if (this.props.unlimitedSize) {\n this.mode = 'unlimited'\n } else if (isFunction(this.props.itemSize)) {\n this.mode = 'function'\n } else {\n this.mode = 'normal'\n }\n\n this.defaultSize = (isFunction(this.props.itemSize) ? this.props.itemSize() : this.props.itemSize) || 1\n\n if (!this.isNormalMode) {\n this.list = new Array(this.length).fill(-1)\n }\n }\n\n get isNormalMode () {\n return this.mode === 'normal'\n }\n\n get isFunctionMode () {\n return this.mode === 'function'\n }\n\n get isUnlimitedMode () {\n return this.mode === 'unlimited'\n }\n\n get length () {\n return this.props.itemCount || 100\n }\n\n get overscan () {\n return this.props.overscanCount || 0\n }\n\n get wrapperSize () {\n const { height, width } = this.props\n const isHorizontal = isHorizontalFunc(this.props)\n const size = (isHorizontal ? width : height) as number\n if (process.env.NODE_ENV !== 'production' && typeof size !== 'number') {\n console.warn(`In mode ${isHorizontal ? 'horizontal, width' : 'vertical, height'} parameter should be a number, but got ${typeof size}.`)\n }\n return size\n }\n\n update (props: TProps) {\n this.props = props\n\n if (this.length > this.list.length) {\n const arr = new Array(this.length - this.list.length).fill(-1)\n this.list.push(...arr)\n } else if (this.length < this.list.length) {\n this.list.length = this.length\n }\n }\n\n setSize (i = 0, size = this.defaultSize) {\n this.list[i] = size\n this.refresh?.()\n }\n\n getSize (i = 0) {\n const size = this.props.itemSize\n const item = this.list[i]\n if (item >= 0) return item\n\n if (this.isFunctionMode && isFunction(size)) {\n const itemSize = size(i, this.props.itemData)\n this.setSize(i, itemSize)\n return itemSize\n }\n return this.defaultSize\n }\n\n getOffsetSize (i = this.list.length) {\n if (this.isNormalMode) return i * this.defaultSize\n return this.list.slice(0, i).reduce((sum, _, idx) => sum + this.getSize(idx), 0)\n }\n\n getSizeCount (offset = 0) {\n if (offset === 0) {\n return 0\n }\n // if (this.isNormalMode) {\n // return Math.min(this.length - 1, Math.floor(offset / this.length))\n // }\n let offsetSize = 0\n const count = this.list.reduce((sum, _, idx) => {\n if (offsetSize < offset) {\n offsetSize += this.getSize(idx)\n return ++sum\n }\n return sum\n }, 0)\n return count - 1\n }\n\n getStartIndex (scrollOffset = 0) {\n return Math.max(0, this.getSizeCount(scrollOffset) - 1)\n }\n\n getStopIndex (wrapperSize = 0, scrollOffset = 0, startIndex = 0) {\n // const visibleOffset = this.getOffsetSize(startIndex)\n // if (this.isNormalMode) {\n // const numVisibleItems = Math.ceil((wrapperSize + scrollOffset - visibleOffset) / this.length)\n // /** -1 is because stop index is inclusive */\n // return Math.max(startIndex, Math.min(this.length - 1, startIndex + numVisibleItems - 1))\n // }\n return Math.max(startIndex, Math.min(this.length - 1, this.getSizeCount(wrapperSize + scrollOffset)))\n }\n\n getRangeToRender (direction: 'forward' | 'backward', scrollOffset = 0, block = false) {\n if (this.length === 0) {\n return [0, 0, 0, 0]\n }\n\n const wrapperSize = this.wrapperSize\n const startIndex = this.getStartIndex(scrollOffset)\n const stopIndex = this.getStopIndex(wrapperSize, scrollOffset, startIndex)\n\n // Overscan by one item in each direction so that tab/focus works. If there isn't at least one extra item, tab loops back around.\n const overscanBackward = !block || direction === 'backward' ? Math.max(1, this.overscan) : 1\n const overscanForward = !block || direction === 'forward' ? Math.max(1, this.overscan) : 1\n return [\n Math.max(0, startIndex - overscanBackward),\n Math.max(0, Math.min(this.length - 1, stopIndex + overscanForward)),\n startIndex,\n stopIndex\n ]\n }\n\n getOffsetForIndexAndAlignment (index: number, align: string, scrollOffset: number) {\n const wrapperSize = this.wrapperSize\n const itemSize = this.getSize(index)\n const lastItemOffset = Math.max(0, this.getOffsetSize(this.props.itemCount) - wrapperSize)\n const maxOffset = Math.min(lastItemOffset, this.getOffsetSize(index))\n const minOffset = Math.max(0, this.getOffsetSize(index) - wrapperSize + itemSize)\n\n if (align === 'smart') {\n if (scrollOffset >= minOffset - wrapperSize && scrollOffset <= maxOffset + wrapperSize) {\n align = 'auto'\n } else {\n align = 'center'\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset\n\n case 'end':\n return minOffset\n\n case 'center':\n {\n // \"Centered\" offset is usually the average of the min and max.\n // But near the edges of the list, this doesn't hold true.\n const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2)\n\n if (middleOffset < Math.ceil(wrapperSize / 2)) {\n return 0 // near the beginning\n } else if (middleOffset > lastItemOffset + Math.floor(wrapperSize / 2)) {\n return lastItemOffset // near the end\n } else {\n return middleOffset\n }\n }\n\n case 'auto':\n default:\n if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {\n return scrollOffset\n } else if (scrollOffset < minOffset) {\n return minOffset\n } else {\n return maxOffset\n }\n }\n }\n\n compareSize (i = 0, size = 0) {\n if (this.isNormalMode) return true\n return this.getSize(i) === size\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import ListSet from "./list-set";
|
|
2
|
+
import { defaultItemKey } from "./utils";
|
|
3
|
+
import { VirtualListProps } from "./index";
|
|
4
|
+
interface IProps extends Partial<VirtualListProps> {
|
|
5
|
+
children?: VirtualListProps['item'];
|
|
6
6
|
direction?: 'ltr' | 'rtl' | 'horizontal' | 'vertical';
|
|
7
7
|
itemKey?: typeof defaultItemKey;
|
|
8
8
|
itemTagName?: string;
|
|
@@ -15,7 +15,7 @@ export interface IProps extends Partial<VirtualListProps> {
|
|
|
15
15
|
onItemsRendered?: TFunc;
|
|
16
16
|
shouldResetStyleCacheOnItemSizeChange?: boolean;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
declare class Preset {
|
|
19
19
|
protected props: IProps;
|
|
20
20
|
protected refresh?: TFunc;
|
|
21
21
|
itemList: ListSet;
|
|
@@ -46,3 +46,4 @@ export default class Preset {
|
|
|
46
46
|
getItemStyleCache: import("memoize-one").MemoizedFn<(_itemSize?: IProps['itemSize'] | false, _layout?: IProps['layout'] | false, _direction?: IProps['direction'] | false) => {}>;
|
|
47
47
|
getItemStyle(index: number): any;
|
|
48
48
|
}
|
|
49
|
+
export { IProps, Preset as default };
|