virtua 0.50.3 → 0.50.5
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/lib/angular/WindowVirtualizer.d.ts +5 -1
- package/lib/angular/index.js +377 -349
- package/lib/angular/index.js.map +1 -1
- package/lib/core/index.cjs +280 -277
- package/lib/core/index.cjs.map +1 -1
- package/lib/core/index.d.ts +2 -0
- package/lib/core/index.js +283 -280
- package/lib/core/index.js.map +1 -1
- package/lib/core/layouts/list.d.ts +1 -0
- package/lib/core/layouts/types.d.ts +1 -0
- package/lib/index.cjs +497 -494
- package/lib/index.cjs.map +1 -1
- package/lib/index.js +430 -427
- package/lib/index.js.map +1 -1
- package/lib/solid/VList.d.ts +1 -1
- package/lib/solid/Virtualizer.d.ts +4 -0
- package/lib/solid/WindowVirtualizer.d.ts +4 -0
- package/lib/solid/index.cjs +317 -303
- package/lib/solid/index.cjs.map +1 -1
- package/lib/solid/index.js +329 -316
- package/lib/solid/index.js.map +1 -1
- package/lib/solid/index.jsx +176 -167
- package/lib/solid/index.jsx.map +1 -1
- package/lib/svelte/Virtualizer.svelte +5 -9
- package/lib/svelte/WindowVirtualizer.svelte +11 -9
- package/lib/svelte/WindowVirtualizer.type.d.ts +4 -0
- package/lib/svelte/utils.js.map +1 -1
- package/lib/vue/WindowVirtualizer.d.ts +4 -0
- package/lib/vue/index.cjs +312 -304
- package/lib/vue/index.cjs.map +1 -1
- package/lib/vue/index.js +306 -298
- package/lib/vue/index.js.map +1 -1
- package/package.json +30 -29
package/lib/solid/index.jsx
CHANGED
|
@@ -30,112 +30,6 @@ var once = (fn) => {
|
|
|
30
30
|
};
|
|
31
31
|
};
|
|
32
32
|
|
|
33
|
-
//#endregion
|
|
34
|
-
//#region src/core/cache.ts
|
|
35
|
-
var UNCACHED = -1;
|
|
36
|
-
var fill = (array, length, prepend) => {
|
|
37
|
-
const key = prepend ? "unshift" : "push";
|
|
38
|
-
for (let i = 0; i < length; i++) {
|
|
39
|
-
array[key](-1);
|
|
40
|
-
}
|
|
41
|
-
return array;
|
|
42
|
-
};
|
|
43
|
-
var getItemSize = (cache, index) => {
|
|
44
|
-
const size = cache._sizes[index];
|
|
45
|
-
return size === -1 ? cache._defaultItemSize : size;
|
|
46
|
-
};
|
|
47
|
-
var setItemSize = (cache, index, size) => {
|
|
48
|
-
const isInitialMeasurement = cache._sizes[index] === -1;
|
|
49
|
-
cache._sizes[index] = size;
|
|
50
|
-
cache._computedOffsetIndex = min(index, cache._computedOffsetIndex);
|
|
51
|
-
return isInitialMeasurement;
|
|
52
|
-
};
|
|
53
|
-
var getItemOffset = (cache, index) => {
|
|
54
|
-
if (!cache._length) return 0;
|
|
55
|
-
if (cache._computedOffsetIndex >= index) {
|
|
56
|
-
return cache._offsets[index];
|
|
57
|
-
}
|
|
58
|
-
if (cache._computedOffsetIndex < 0) {
|
|
59
|
-
cache._offsets[0] = 0;
|
|
60
|
-
cache._computedOffsetIndex = 0;
|
|
61
|
-
}
|
|
62
|
-
let i = cache._computedOffsetIndex;
|
|
63
|
-
let top = cache._offsets[i];
|
|
64
|
-
while (i < index) {
|
|
65
|
-
top += getItemSize(cache, i);
|
|
66
|
-
cache._offsets[++i] = top;
|
|
67
|
-
}
|
|
68
|
-
cache._computedOffsetIndex = index;
|
|
69
|
-
return top;
|
|
70
|
-
};
|
|
71
|
-
var findIndex = (cache, offset, low = 0, high = cache._length - 1) => {
|
|
72
|
-
let found = low;
|
|
73
|
-
while (low <= high) {
|
|
74
|
-
const mid = floor((low + high) / 2);
|
|
75
|
-
if (getItemOffset(cache, mid) <= offset) {
|
|
76
|
-
found = mid;
|
|
77
|
-
low = mid + 1;
|
|
78
|
-
} else {
|
|
79
|
-
high = mid - 1;
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
return clamp(found, 0, cache._length - 1);
|
|
83
|
-
};
|
|
84
|
-
var computeRange = (cache, startOffset, endOffset, prevStartIndex) => {
|
|
85
|
-
prevStartIndex = min(prevStartIndex, cache._length - 1);
|
|
86
|
-
if (getItemOffset(cache, prevStartIndex) <= startOffset) {
|
|
87
|
-
const end = findIndex(cache, endOffset, prevStartIndex);
|
|
88
|
-
return [findIndex(cache, startOffset, prevStartIndex, end), end];
|
|
89
|
-
} else {
|
|
90
|
-
const start = findIndex(cache, startOffset, undefined, prevStartIndex);
|
|
91
|
-
return [start, findIndex(cache, endOffset, start)];
|
|
92
|
-
}
|
|
93
|
-
};
|
|
94
|
-
var estimateDefaultItemSize = (cache, startIndex) => {
|
|
95
|
-
let measuredCountBeforeStart = 0;
|
|
96
|
-
const measuredSizes = [];
|
|
97
|
-
cache._sizes.forEach((s, i) => {
|
|
98
|
-
if (s !== -1) {
|
|
99
|
-
measuredSizes.push(s);
|
|
100
|
-
if (i < startIndex) {
|
|
101
|
-
measuredCountBeforeStart++;
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
});
|
|
105
|
-
cache._computedOffsetIndex = -1;
|
|
106
|
-
const sorted = sort(measuredSizes);
|
|
107
|
-
const len = sorted.length;
|
|
108
|
-
const mid = len / 2 | 0;
|
|
109
|
-
const median = len % 2 === 0 ? (sorted[mid - 1] + sorted[mid]) / 2 : sorted[mid];
|
|
110
|
-
const prevDefaultItemSize = cache._defaultItemSize;
|
|
111
|
-
return ((cache._defaultItemSize = median) - prevDefaultItemSize) * max(startIndex - measuredCountBeforeStart, 0);
|
|
112
|
-
};
|
|
113
|
-
var initCache = (length, itemSize, sizes) => {
|
|
114
|
-
return {
|
|
115
|
-
_defaultItemSize: itemSize,
|
|
116
|
-
_sizes: sizes ? fill(sizes.slice(0, min(length, sizes.length)), max(0, length - sizes.length)) : fill([], length),
|
|
117
|
-
_length: length,
|
|
118
|
-
_computedOffsetIndex: -1,
|
|
119
|
-
_offsets: fill([], length + 1)
|
|
120
|
-
};
|
|
121
|
-
};
|
|
122
|
-
var takeCacheSnapshot = (cache) => {
|
|
123
|
-
return [cache._sizes.slice(), cache._defaultItemSize];
|
|
124
|
-
};
|
|
125
|
-
var updateCacheLength = (cache, length, isShift) => {
|
|
126
|
-
const diff = length - cache._length;
|
|
127
|
-
cache._computedOffsetIndex = isShift ? -1 : min(length - 1, cache._computedOffsetIndex);
|
|
128
|
-
cache._length = length;
|
|
129
|
-
if (diff > 0) {
|
|
130
|
-
fill(cache._offsets, diff);
|
|
131
|
-
fill(cache._sizes, diff, isShift);
|
|
132
|
-
return cache._defaultItemSize * diff;
|
|
133
|
-
} else {
|
|
134
|
-
cache._offsets.splice(diff);
|
|
135
|
-
return (isShift ? cache._sizes.splice(0, -diff) : cache._sizes.splice(diff)).reduce((acc, removed) => acc - (removed === -1 ? cache._defaultItemSize : removed), 0);
|
|
136
|
-
}
|
|
137
|
-
};
|
|
138
|
-
|
|
139
33
|
//#endregion
|
|
140
34
|
//#region src/core/environment.ts
|
|
141
35
|
var isBrowser = typeof window !== "undefined";
|
|
@@ -176,7 +70,8 @@ var UPDATE_SCROLL_END_EVENT = 8;
|
|
|
176
70
|
var getScrollSize = (store) => {
|
|
177
71
|
return max(store.$getTotalSize(), store.$getViewportSize());
|
|
178
72
|
};
|
|
179
|
-
var createVirtualStore = (
|
|
73
|
+
var createVirtualStore = ({ $getRange: getRange, $findIndex: findIndex, $getItemOffset: getOffset, $getItemSize: getItemSize, $setItemSize: setItemSize, $isSizeEqual: isSizeEqual, $getTotalSize: getTotalSize, $getLength: getLength, $setLength: setLength, $estimateDefaultSize: estimateDefaultSize }, ssrCount = 0) => {
|
|
74
|
+
let shouldAutoEstimateItemSize = !!estimateDefaultSize;
|
|
180
75
|
let isSSR = !!ssrCount;
|
|
181
76
|
let stateVersion = 1;
|
|
182
77
|
let viewportSize = 0;
|
|
@@ -191,27 +86,16 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
191
86
|
let _prevRange = [0, isSSR ? max(ssrCount - 1, 0) : -1];
|
|
192
87
|
let _totalMeasuredSize = 0;
|
|
193
88
|
let _isViewportMeasured = false;
|
|
194
|
-
const cache = initCache(elementsCount, cacheSnapshot && cacheSnapshot[1] || itemSize, cacheSnapshot && cacheSnapshot[0]);
|
|
195
89
|
const subscribers = new Set();
|
|
196
90
|
const getRelativeScrollOffset = () => scrollOffset - startSpacerSize;
|
|
197
91
|
const getVisibleOffset = () => getRelativeScrollOffset() + pendingJump + jump;
|
|
198
|
-
const
|
|
199
|
-
|
|
200
|
-
};
|
|
201
|
-
const getTotalSize = () => getItemOffset(cache, cache._length);
|
|
202
|
-
const getItemOffset$1 = (index, fromEnd) => {
|
|
203
|
-
const offset = getItemOffset(cache, index) - pendingJump;
|
|
92
|
+
const getItemOffset = (index, fromEnd) => {
|
|
93
|
+
const offset = getOffset(index) - pendingJump;
|
|
204
94
|
if (fromEnd) {
|
|
205
|
-
return getTotalSize() - offset - getItemSize
|
|
95
|
+
return getTotalSize() - offset - getItemSize(index);
|
|
206
96
|
}
|
|
207
97
|
return offset;
|
|
208
98
|
};
|
|
209
|
-
const getItemSize$1 = (index) => {
|
|
210
|
-
return getItemSize(cache, index);
|
|
211
|
-
};
|
|
212
|
-
const isSizeEqual = (index, value = -1) => {
|
|
213
|
-
return cache._sizes[index] === value;
|
|
214
|
-
};
|
|
215
99
|
const applyJump = (j) => {
|
|
216
100
|
if (j) {
|
|
217
101
|
if (isIOSWebKit() && _scrollDirection !== SCROLL_IDLE || _frozenRange && _scrollMode === SCROLL_BY_MANUAL_SCROLL) {
|
|
@@ -226,9 +110,6 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
226
110
|
subscribers.clear();
|
|
227
111
|
},
|
|
228
112
|
$getStateVersion: () => stateVersion,
|
|
229
|
-
$getCacheSnapshot: () => {
|
|
230
|
-
return takeCacheSnapshot(cache);
|
|
231
|
-
},
|
|
232
113
|
$getRange: (bufferSize = 200) => {
|
|
233
114
|
if (!_isViewportMeasured || isSSR) {
|
|
234
115
|
return _prevRange;
|
|
@@ -255,13 +136,13 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
255
136
|
endIndex = max(endIndex, _frozenRange[1]);
|
|
256
137
|
}
|
|
257
138
|
}
|
|
258
|
-
return [max(startIndex, 0), min(endIndex,
|
|
139
|
+
return [max(startIndex, 0), min(endIndex, getLength() - 1)];
|
|
259
140
|
},
|
|
260
|
-
$findItemIndex: (offset) => findIndex(
|
|
141
|
+
$findItemIndex: (offset) => findIndex(offset - startSpacerSize),
|
|
261
142
|
$isUnmeasuredItem: isSizeEqual,
|
|
262
|
-
$getItemOffset: getItemOffset
|
|
263
|
-
$getItemSize: getItemSize
|
|
264
|
-
$getItemsLength:
|
|
143
|
+
$getItemOffset: getItemOffset,
|
|
144
|
+
$getItemSize: getItemSize,
|
|
145
|
+
$getItemsLength: getLength,
|
|
265
146
|
$getScrollOffset: () => scrollOffset,
|
|
266
147
|
$isScrolling: () => _scrollDirection !== SCROLL_IDLE,
|
|
267
148
|
$getViewportSize: () => viewportSize,
|
|
@@ -332,24 +213,24 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
332
213
|
shouldKeep = index < _frozenRange[0];
|
|
333
214
|
} else {
|
|
334
215
|
const start = getRelativeScrollOffset();
|
|
335
|
-
const itemOffset = getItemOffset
|
|
336
|
-
const itemSize = getItemSize
|
|
216
|
+
const itemOffset = getItemOffset(index);
|
|
217
|
+
const itemSize = getItemSize(index);
|
|
337
218
|
shouldKeep = _scrollDirection !== SCROLL_DOWN && _scrollMode === SCROLL_BY_NATIVE ? itemOffset + itemSize <= start : itemOffset < start && itemOffset + itemSize < start + viewportSize;
|
|
338
219
|
}
|
|
339
220
|
if (shouldKeep) {
|
|
340
|
-
acc += size - getItemSize
|
|
221
|
+
acc += size - getItemSize(index);
|
|
341
222
|
}
|
|
342
223
|
return acc;
|
|
343
224
|
}, 0));
|
|
344
225
|
for (const [index, size] of updated) {
|
|
345
|
-
const prevSize = getItemSize
|
|
346
|
-
const isInitialMeasurement = setItemSize(
|
|
226
|
+
const prevSize = getItemSize(index);
|
|
227
|
+
const isInitialMeasurement = setItemSize(index, size);
|
|
347
228
|
if (shouldAutoEstimateItemSize) {
|
|
348
229
|
_totalMeasuredSize += isInitialMeasurement ? size : size - prevSize;
|
|
349
230
|
}
|
|
350
231
|
}
|
|
351
232
|
if (shouldAutoEstimateItemSize && viewportSize && _totalMeasuredSize > viewportSize) {
|
|
352
|
-
applyJump(
|
|
233
|
+
applyJump(estimateDefaultSize(findIndex(getVisibleOffset())));
|
|
353
234
|
shouldAutoEstimateItemSize = false;
|
|
354
235
|
}
|
|
355
236
|
mutated = 1 + 2;
|
|
@@ -368,11 +249,11 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
368
249
|
}
|
|
369
250
|
case 5: {
|
|
370
251
|
if (payload[1]) {
|
|
371
|
-
applyJump(
|
|
252
|
+
applyJump(setLength(payload[0], true));
|
|
372
253
|
_scrollMode = SCROLL_BY_SHIFT;
|
|
373
254
|
mutated = 1;
|
|
374
255
|
} else {
|
|
375
|
-
|
|
256
|
+
setLength(payload[0]);
|
|
376
257
|
mutated = 1;
|
|
377
258
|
}
|
|
378
259
|
break;
|
|
@@ -408,6 +289,126 @@ var createVirtualStore = (elementsCount, itemSize = 40, ssrCount = 0, cacheSnaps
|
|
|
408
289
|
};
|
|
409
290
|
};
|
|
410
291
|
|
|
292
|
+
//#endregion
|
|
293
|
+
//#region src/core/cache.ts
|
|
294
|
+
var UNCACHED = -1;
|
|
295
|
+
var findIndex = (getOffset, length, offset, low = 0, high = length - 1) => {
|
|
296
|
+
let found = low;
|
|
297
|
+
while (low <= high) {
|
|
298
|
+
const mid = floor((low + high) / 2);
|
|
299
|
+
if (getOffset(mid) <= offset) {
|
|
300
|
+
found = mid;
|
|
301
|
+
low = mid + 1;
|
|
302
|
+
} else {
|
|
303
|
+
high = mid - 1;
|
|
304
|
+
}
|
|
305
|
+
}
|
|
306
|
+
return clamp(found, 0, length - 1);
|
|
307
|
+
};
|
|
308
|
+
|
|
309
|
+
//#endregion
|
|
310
|
+
//#region src/core/layouts/list.ts
|
|
311
|
+
var fill = (array, length, prepend) => {
|
|
312
|
+
const key = prepend ? "unshift" : "push";
|
|
313
|
+
for (let i = 0; i < length; i++) {
|
|
314
|
+
array[key](-1);
|
|
315
|
+
}
|
|
316
|
+
return array;
|
|
317
|
+
};
|
|
318
|
+
var createListLayout = (length, itemSize, snapshot) => {
|
|
319
|
+
let defaultItemSize = snapshot && snapshot[1] || itemSize || 40;
|
|
320
|
+
let computedOffsetIndex = -1;
|
|
321
|
+
let prevStartIndex = 0;
|
|
322
|
+
const restoredSizes = snapshot && snapshot[0];
|
|
323
|
+
const sizes = restoredSizes ? fill(restoredSizes.slice(0, min(length, restoredSizes.length)), max(0, length - restoredSizes.length)) : fill([], length);
|
|
324
|
+
const offsets = fill([], length + 1);
|
|
325
|
+
const getSize = (index) => {
|
|
326
|
+
const size = sizes[index];
|
|
327
|
+
return size === -1 ? defaultItemSize : size;
|
|
328
|
+
};
|
|
329
|
+
const getOffset = (index) => {
|
|
330
|
+
if (!length) return 0;
|
|
331
|
+
if (computedOffsetIndex >= index) {
|
|
332
|
+
return offsets[index];
|
|
333
|
+
}
|
|
334
|
+
if (computedOffsetIndex < 0) {
|
|
335
|
+
offsets[0] = 0;
|
|
336
|
+
computedOffsetIndex = 0;
|
|
337
|
+
}
|
|
338
|
+
let i = computedOffsetIndex;
|
|
339
|
+
let top = offsets[i];
|
|
340
|
+
while (i < index) {
|
|
341
|
+
top += getSize(i);
|
|
342
|
+
offsets[++i] = top;
|
|
343
|
+
}
|
|
344
|
+
computedOffsetIndex = index;
|
|
345
|
+
return top;
|
|
346
|
+
};
|
|
347
|
+
return {
|
|
348
|
+
$getRange: (startOffset, endOffset) => {
|
|
349
|
+
prevStartIndex = min(prevStartIndex, length - 1);
|
|
350
|
+
let start;
|
|
351
|
+
let end;
|
|
352
|
+
if (getOffset(prevStartIndex) <= startOffset) {
|
|
353
|
+
end = findIndex(getOffset, length, endOffset, prevStartIndex);
|
|
354
|
+
start = findIndex(getOffset, length, startOffset, prevStartIndex, end);
|
|
355
|
+
} else {
|
|
356
|
+
start = findIndex(getOffset, length, startOffset, undefined, prevStartIndex);
|
|
357
|
+
end = findIndex(getOffset, length, endOffset, start);
|
|
358
|
+
}
|
|
359
|
+
prevStartIndex = start;
|
|
360
|
+
return [start, end];
|
|
361
|
+
},
|
|
362
|
+
$findIndex: (offset) => findIndex(getOffset, length, offset),
|
|
363
|
+
$getItemOffset: getOffset,
|
|
364
|
+
$getItemSize: getSize,
|
|
365
|
+
$setItemSize: (index, size) => {
|
|
366
|
+
const isInitialMeasurement = sizes[index] === -1;
|
|
367
|
+
sizes[index] = size;
|
|
368
|
+
computedOffsetIndex = min(index, computedOffsetIndex);
|
|
369
|
+
return isInitialMeasurement;
|
|
370
|
+
},
|
|
371
|
+
$isSizeEqual: (index, size = -1) => sizes[index] === size,
|
|
372
|
+
$getTotalSize: () => getOffset(length),
|
|
373
|
+
$getLength: () => length,
|
|
374
|
+
$setLength: (nextLength, isShift) => {
|
|
375
|
+
const diff = nextLength - length;
|
|
376
|
+
computedOffsetIndex = isShift ? -1 : min(nextLength - 1, computedOffsetIndex);
|
|
377
|
+
length = nextLength;
|
|
378
|
+
if (diff > 0) {
|
|
379
|
+
fill(offsets, diff);
|
|
380
|
+
fill(sizes, diff, isShift);
|
|
381
|
+
return defaultItemSize * diff;
|
|
382
|
+
} else {
|
|
383
|
+
offsets.splice(diff);
|
|
384
|
+
return (isShift ? sizes.splice(0, -diff) : sizes.splice(diff)).reduce((acc, removed) => acc - (removed === -1 ? defaultItemSize : removed), 0);
|
|
385
|
+
}
|
|
386
|
+
},
|
|
387
|
+
$estimateDefaultSize: itemSize ? undefined : (startIndex) => {
|
|
388
|
+
let measuredCountBeforeStart = 0;
|
|
389
|
+
const measuredSizes = [];
|
|
390
|
+
sizes.forEach((s, i) => {
|
|
391
|
+
if (s !== -1) {
|
|
392
|
+
if (s) {
|
|
393
|
+
measuredSizes.push(s);
|
|
394
|
+
}
|
|
395
|
+
if (i < startIndex) {
|
|
396
|
+
measuredCountBeforeStart++;
|
|
397
|
+
}
|
|
398
|
+
}
|
|
399
|
+
});
|
|
400
|
+
computedOffsetIndex = -1;
|
|
401
|
+
const sorted = sort(measuredSizes);
|
|
402
|
+
const len = sorted.length;
|
|
403
|
+
const mid = len / 2 | 0;
|
|
404
|
+
const median = len % 2 === 0 ? (sorted[mid - 1] + sorted[mid]) / 2 : sorted[mid];
|
|
405
|
+
const prevDefaultItemSize = defaultItemSize;
|
|
406
|
+
return ((defaultItemSize = median) - prevDefaultItemSize) * max(startIndex - measuredCountBeforeStart, 0);
|
|
407
|
+
},
|
|
408
|
+
$snapshot: () => [sizes.slice(), defaultItemSize]
|
|
409
|
+
};
|
|
410
|
+
};
|
|
411
|
+
|
|
411
412
|
//#endregion
|
|
412
413
|
//#region src/core/observer.ts
|
|
413
414
|
var createResizeObserver = (cb) => {
|
|
@@ -655,8 +656,8 @@ var createContainerDriver = (store, isHorizontal) => {
|
|
|
655
656
|
};
|
|
656
657
|
},
|
|
657
658
|
$isNegative: () => isNegative,
|
|
658
|
-
$
|
|
659
|
-
$
|
|
659
|
+
$scroll: scheduleScroll,
|
|
660
|
+
$effect() {
|
|
660
661
|
scrollObserver && scrollObserver._fixScrollJump();
|
|
661
662
|
},
|
|
662
663
|
$getBaseOffset: store.$getStartSpacerSize,
|
|
@@ -749,8 +750,8 @@ var createWindowDriver = (store, isHorizontal) => {
|
|
|
749
750
|
};
|
|
750
751
|
},
|
|
751
752
|
$isNegative: () => isNegative,
|
|
752
|
-
$
|
|
753
|
-
$
|
|
753
|
+
$scroll: scheduleScroll,
|
|
754
|
+
$effect() {
|
|
754
755
|
scrollObserver && scrollObserver._fixScrollJump();
|
|
755
756
|
},
|
|
756
757
|
$getBaseOffset() {
|
|
@@ -921,20 +922,19 @@ var createContainerGridDriver = (rowStore, colStore) => {
|
|
|
921
922
|
colStore.$update(3, cols);
|
|
922
923
|
},
|
|
923
924
|
$isNegative: () => isNegative,
|
|
924
|
-
$
|
|
925
|
-
$
|
|
926
|
-
$
|
|
925
|
+
$scrollX: scheduleScrollX,
|
|
926
|
+
$scrollY: scheduleScrollY,
|
|
927
|
+
$effect() {
|
|
927
928
|
rowScrollObserver && rowScrollObserver._fixScrollJump();
|
|
928
929
|
colScrollObserver && colScrollObserver._fixScrollJump();
|
|
929
|
-
}
|
|
930
|
-
$getBaseOffset: (isHorizontal) => (isHorizontal ? colStore : rowStore).$getStartSpacerSize()
|
|
930
|
+
}
|
|
931
931
|
};
|
|
932
932
|
};
|
|
933
933
|
|
|
934
934
|
//#endregion
|
|
935
935
|
//#region src/core/scroll-to.ts
|
|
936
936
|
var scrollTo = (driver, offset) => {
|
|
937
|
-
driver.$
|
|
937
|
+
driver.$scroll(() => offset);
|
|
938
938
|
};
|
|
939
939
|
var scrollBy = (driver, store, offset) => {
|
|
940
940
|
scrollTo(driver, offset + store.$getScrollOffset());
|
|
@@ -952,36 +952,36 @@ var scrollToIndex = (driver, store, index, { align, smooth, offset = 0 } = {}) =
|
|
|
952
952
|
return;
|
|
953
953
|
}
|
|
954
954
|
}
|
|
955
|
-
driver.$
|
|
955
|
+
driver.$scroll(() => {
|
|
956
956
|
return offset + driver.$getBaseOffset() + store.$getItemOffset(index) + (align === "end" ? store.$getItemSize(index) - (store.$getViewportSize() - driver.$getScrollbarSize()) : align === "center" ? (store.$getItemSize(index) - (store.$getViewportSize() - driver.$getScrollbarSize())) / 2 : 0);
|
|
957
957
|
}, smooth);
|
|
958
958
|
};
|
|
959
959
|
var gridScrollTo = (driver, row, col) => {
|
|
960
960
|
if (row != null) {
|
|
961
|
-
driver.$
|
|
961
|
+
driver.$scrollY(() => row);
|
|
962
962
|
}
|
|
963
963
|
if (col != null) {
|
|
964
|
-
driver.$
|
|
964
|
+
driver.$scrollX(() => col);
|
|
965
965
|
}
|
|
966
966
|
};
|
|
967
967
|
var gridScrollBy = (driver, rowStore, colStore, row, col) => {
|
|
968
968
|
if (row != null) {
|
|
969
969
|
const target = row + rowStore.$getScrollOffset();
|
|
970
|
-
driver.$
|
|
970
|
+
driver.$scrollY(() => target);
|
|
971
971
|
}
|
|
972
972
|
if (col != null) {
|
|
973
973
|
const target = col + colStore.$getScrollOffset();
|
|
974
|
-
driver.$
|
|
974
|
+
driver.$scrollX(() => target);
|
|
975
975
|
}
|
|
976
976
|
};
|
|
977
977
|
var gridScrollToIndex = (driver, rowStore, colStore, row, col) => {
|
|
978
978
|
if (row != null) {
|
|
979
979
|
const index = clamp(row, 0, rowStore.$getItemsLength() - 1);
|
|
980
|
-
driver.$
|
|
980
|
+
driver.$scrollY(() => rowStore.$getItemOffset(index));
|
|
981
981
|
}
|
|
982
982
|
if (col != null) {
|
|
983
983
|
const index = clamp(col, 0, colStore.$getItemsLength() - 1);
|
|
984
|
-
driver.$
|
|
984
|
+
driver.$scrollX(() => colStore.$getItemOffset(index));
|
|
985
985
|
}
|
|
986
986
|
};
|
|
987
987
|
|
|
@@ -996,13 +996,15 @@ var ListItem = (props) => {
|
|
|
996
996
|
});
|
|
997
997
|
const style = createMemo(() => {
|
|
998
998
|
const isHorizontal = props._isHorizontal;
|
|
999
|
+
const hide = props._hide;
|
|
1000
|
+
const isSSR = props._isSSR;
|
|
999
1001
|
const style = {
|
|
1000
1002
|
contain: "layout style",
|
|
1001
|
-
position: "absolute",
|
|
1003
|
+
position: hide && isSSR ? undefined : "absolute",
|
|
1002
1004
|
[isHorizontal ? "height" : "width"]: "100%",
|
|
1003
1005
|
[isHorizontal ? "top" : "left"]: "0px",
|
|
1004
1006
|
[isHorizontal ? "left" : "top"]: props._offset + "px",
|
|
1005
|
-
visibility:
|
|
1007
|
+
visibility: !hide || isSSR ? undefined : "hidden"
|
|
1006
1008
|
};
|
|
1007
1009
|
if (isHorizontal) {
|
|
1008
1010
|
style.display = "inline-flex";
|
|
@@ -1024,9 +1026,11 @@ var isSameRange = (prev, next) => {
|
|
|
1024
1026
|
//#region src/solid/Virtualizer.tsx
|
|
1025
1027
|
var Virtualizer = (props) => {
|
|
1026
1028
|
let containerRef;
|
|
1027
|
-
const { itemSize, horizontal = false, cache } = props;
|
|
1029
|
+
const { itemSize, horizontal = false, cache, ssrCount } = props;
|
|
1028
1030
|
props = mergeProps({ as: "div" }, props);
|
|
1029
|
-
const
|
|
1031
|
+
const [isSSR, setIsSSR] = createSignal(!!ssrCount);
|
|
1032
|
+
const layout = createListLayout(props.data.length, itemSize, cache);
|
|
1033
|
+
const store = createVirtualStore(layout, ssrCount);
|
|
1030
1034
|
const driver = createContainerDriver(store, horizontal);
|
|
1031
1035
|
const [stateVersion, setRerender] = createSignal(store.$getStateVersion());
|
|
1032
1036
|
store.$subscribe(1, () => {
|
|
@@ -1050,10 +1054,11 @@ var Virtualizer = (props) => {
|
|
|
1050
1054
|
const totalSize = createMemo(() => stateVersion() && store.$getTotalSize());
|
|
1051
1055
|
const isNegative = createMemo(() => stateVersion() && driver.$isNegative());
|
|
1052
1056
|
onMount(() => {
|
|
1057
|
+
setIsSSR(false);
|
|
1053
1058
|
if (props.ref) {
|
|
1054
1059
|
props.ref({
|
|
1055
1060
|
get cache() {
|
|
1056
|
-
return
|
|
1061
|
+
return layout.$snapshot();
|
|
1057
1062
|
},
|
|
1058
1063
|
get scrollOffset() {
|
|
1059
1064
|
return store.$getScrollOffset();
|
|
@@ -1087,7 +1092,7 @@ var Virtualizer = (props) => {
|
|
|
1087
1092
|
}
|
|
1088
1093
|
}));
|
|
1089
1094
|
createEffect(on(stateVersion, () => {
|
|
1090
|
-
driver.$
|
|
1095
|
+
driver.$effect();
|
|
1091
1096
|
}));
|
|
1092
1097
|
const dataSlice = createMemo(() => {
|
|
1093
1098
|
const count = props.data.length;
|
|
@@ -1130,7 +1135,7 @@ var Virtualizer = (props) => {
|
|
|
1130
1135
|
const children = createMemo(() => {
|
|
1131
1136
|
return untrack(() => props.children(data, index));
|
|
1132
1137
|
});
|
|
1133
|
-
return <ListItem _as={props.item} _index={index()} _resizer={driver.$observeItem} _offset={offset()} _hide={hide()} _children={children()} _isHorizontal={horizontal} />;
|
|
1138
|
+
return <ListItem _as={props.item} _index={index()} _resizer={driver.$observeItem} _offset={offset()} _hide={hide()} _children={children()} _isHorizontal={horizontal} _isSSR={isSSR()} />;
|
|
1134
1139
|
};
|
|
1135
1140
|
return <Dynamic component={props.as} ref={containerRef} style={{
|
|
1136
1141
|
contain: "size style",
|
|
@@ -1159,6 +1164,7 @@ var VList = (props) => {
|
|
|
1159
1164
|
"children",
|
|
1160
1165
|
"bufferSize",
|
|
1161
1166
|
"itemSize",
|
|
1167
|
+
"ssrCount",
|
|
1162
1168
|
"shift",
|
|
1163
1169
|
"horizontal",
|
|
1164
1170
|
"keepMounted",
|
|
@@ -1176,7 +1182,7 @@ var VList = (props) => {
|
|
|
1176
1182
|
height: "100%",
|
|
1177
1183
|
...local.style
|
|
1178
1184
|
}}>
|
|
1179
|
-
<Virtualizer ref={local.ref} data={local.data} bufferSize={local.bufferSize} itemSize={local.itemSize} shift={local.shift} horizontal={local.horizontal} keepMounted={local.keepMounted} cache={local.cache} item={local.item} onScroll={local.onScroll} onScrollEnd={local.onScrollEnd}>
|
|
1185
|
+
<Virtualizer ref={local.ref} data={local.data} bufferSize={local.bufferSize} itemSize={local.itemSize} ssrCount={local.ssrCount} shift={local.shift} horizontal={local.horizontal} keepMounted={local.keepMounted} cache={local.cache} item={local.item} onScroll={local.onScroll} onScrollEnd={local.onScrollEnd}>
|
|
1180
1186
|
{local.children}
|
|
1181
1187
|
</Virtualizer>
|
|
1182
1188
|
</div>;
|
|
@@ -1186,8 +1192,10 @@ var VList = (props) => {
|
|
|
1186
1192
|
//#region src/solid/WindowVirtualizer.tsx
|
|
1187
1193
|
var WindowVirtualizer = (props) => {
|
|
1188
1194
|
let containerRef;
|
|
1189
|
-
const { ref: _ref, data: _data, children: _children, itemSize, shift: _shift, horizontal = false, cache, onScrollEnd: _onScrollEnd } = props;
|
|
1190
|
-
const
|
|
1195
|
+
const { ref: _ref, data: _data, children: _children, itemSize, ssrCount, shift: _shift, horizontal = false, cache, onScrollEnd: _onScrollEnd } = props;
|
|
1196
|
+
const [isSSR, setIsSSR] = createSignal(!!ssrCount);
|
|
1197
|
+
const layout = createListLayout(props.data.length, itemSize, cache);
|
|
1198
|
+
const store = createVirtualStore(layout, ssrCount);
|
|
1191
1199
|
const driver = createWindowDriver(store, horizontal);
|
|
1192
1200
|
const [stateVersion, setRerender] = createSignal(store.$getStateVersion());
|
|
1193
1201
|
store.$subscribe(1, () => {
|
|
@@ -1211,10 +1219,11 @@ var WindowVirtualizer = (props) => {
|
|
|
1211
1219
|
const totalSize = createMemo(() => stateVersion() && store.$getTotalSize());
|
|
1212
1220
|
const isNegative = createMemo(() => stateVersion() && driver.$isNegative());
|
|
1213
1221
|
onMount(() => {
|
|
1222
|
+
setIsSSR(false);
|
|
1214
1223
|
if (props.ref) {
|
|
1215
1224
|
props.ref({
|
|
1216
1225
|
get cache() {
|
|
1217
|
-
return
|
|
1226
|
+
return layout.$snapshot();
|
|
1218
1227
|
},
|
|
1219
1228
|
get scrollOffset() {
|
|
1220
1229
|
return store.$getScrollOffset();
|
|
@@ -1238,7 +1247,7 @@ var WindowVirtualizer = (props) => {
|
|
|
1238
1247
|
});
|
|
1239
1248
|
});
|
|
1240
1249
|
createEffect(on(stateVersion, () => {
|
|
1241
|
-
driver.$
|
|
1250
|
+
driver.$effect();
|
|
1242
1251
|
}));
|
|
1243
1252
|
const dataSlice = createMemo(() => {
|
|
1244
1253
|
const count = props.data.length;
|
|
@@ -1276,7 +1285,7 @@ var WindowVirtualizer = (props) => {
|
|
|
1276
1285
|
const children = createMemo(() => {
|
|
1277
1286
|
return untrack(() => props.children(data, itemIndex));
|
|
1278
1287
|
});
|
|
1279
|
-
return <ListItem _index={itemIndex()} _resizer={driver.$observeItem} _offset={offset()} _hide={hide()} _children={children()} _isHorizontal={horizontal} />;
|
|
1288
|
+
return <ListItem _index={itemIndex()} _resizer={driver.$observeItem} _offset={offset()} _hide={hide()} _children={children()} _isHorizontal={horizontal} _isSSR={isSSR()} />;
|
|
1280
1289
|
}}
|
|
1281
1290
|
</For>
|
|
1282
1291
|
</div>;
|