@tanstack/virtual-core 3.0.0-beta.29 → 3.0.0-beta.32

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.
@@ -12,36 +12,39 @@
12
12
 
13
13
  Object.defineProperty(exports, '__esModule', { value: true });
14
14
 
15
+ var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js');
15
16
  var utils = require('./utils.js');
16
17
 
17
18
  //
18
19
 
19
20
  //
20
21
 
21
- const defaultKeyExtractor = index => index;
22
- const defaultRangeExtractor = range => {
23
- const start = Math.max(range.startIndex - range.overscan, 0);
24
- const end = Math.min(range.endIndex + range.overscan, range.count - 1);
25
- const arr = [];
26
- for (let i = start; i <= end; i++) {
27
- arr.push(i);
22
+ var defaultKeyExtractor = function defaultKeyExtractor(index) {
23
+ return index;
24
+ };
25
+ var defaultRangeExtractor = function defaultRangeExtractor(range) {
26
+ var start = Math.max(range.startIndex - range.overscan, 0);
27
+ var end = Math.min(range.endIndex + range.overscan, range.count - 1);
28
+ var arr = [];
29
+ for (var _i = start; _i <= end; _i++) {
30
+ arr.push(_i);
28
31
  }
29
32
  return arr;
30
33
  };
31
- const memoRectCallback = (instance, cb) => {
32
- let prev = {
34
+ var memoRectCallback = function memoRectCallback(instance, cb) {
35
+ var prev = {
33
36
  height: -1,
34
37
  width: -1
35
38
  };
36
- return rect => {
39
+ return function (rect) {
37
40
  if (instance.options.horizontal ? rect.width !== prev.width : rect.height !== prev.height) {
38
41
  cb(rect);
39
42
  }
40
43
  prev = rect;
41
44
  };
42
45
  };
43
- const observeElementRect = (instance, cb) => {
44
- const observer = new ResizeObserver(entries => {
46
+ var observeElementRect = function observeElementRect(instance, cb) {
47
+ var observer = new ResizeObserver(function (entries) {
45
48
  var _entries$, _entries$2;
46
49
  cb({
47
50
  width: (_entries$ = entries[0]) == null ? void 0 : _entries$.contentRect.width,
@@ -53,16 +56,18 @@ const observeElementRect = (instance, cb) => {
53
56
  }
54
57
  cb(instance.scrollElement.getBoundingClientRect());
55
58
  observer.observe(instance.scrollElement);
56
- return () => {
59
+ return function () {
57
60
  observer.unobserve(instance.scrollElement);
58
61
  };
59
62
  };
60
- const observeWindowRect = (instance, cb) => {
61
- const memoizedCallback = memoRectCallback(instance, cb);
62
- const onResize = () => memoizedCallback({
63
- width: instance.scrollElement.innerWidth,
64
- height: instance.scrollElement.innerHeight
65
- });
63
+ var observeWindowRect = function observeWindowRect(instance, cb) {
64
+ var memoizedCallback = memoRectCallback(instance, cb);
65
+ var onResize = function onResize() {
66
+ return memoizedCallback({
67
+ width: instance.scrollElement.innerWidth,
68
+ height: instance.scrollElement.innerHeight
69
+ });
70
+ };
66
71
  if (!instance.scrollElement) {
67
72
  return;
68
73
  }
@@ -71,32 +76,32 @@ const observeWindowRect = (instance, cb) => {
71
76
  capture: false,
72
77
  passive: true
73
78
  });
74
- return () => {
79
+ return function () {
75
80
  instance.scrollElement.removeEventListener('resize', onResize);
76
81
  };
77
82
  };
78
- const scrollProps = {
83
+ var scrollProps = {
79
84
  element: ['scrollLeft', 'scrollTop'],
80
85
  window: ['scrollX', 'scrollY']
81
86
  };
82
- const createOffsetObserver = mode => {
83
- return (instance, cb) => {
87
+ var createOffsetObserver = function createOffsetObserver(mode) {
88
+ return function (instance, cb) {
84
89
  if (!instance.scrollElement) {
85
90
  return;
86
91
  }
87
- const propX = scrollProps[mode][0];
88
- const propY = scrollProps[mode][1];
89
- let prevX = instance.scrollElement[propX];
90
- let prevY = instance.scrollElement[propY];
91
- const scroll = () => {
92
- const offset = instance.scrollElement[instance.options.horizontal ? propX : propY];
92
+ var propX = scrollProps[mode][0];
93
+ var propY = scrollProps[mode][1];
94
+ var prevX = instance.scrollElement[propX];
95
+ var prevY = instance.scrollElement[propY];
96
+ var scroll = function scroll() {
97
+ var offset = instance.scrollElement[instance.options.horizontal ? propX : propY];
93
98
  cb(Math.max(0, offset - instance.options.scrollMargin));
94
99
  };
95
100
  scroll();
96
- const onScroll = e => {
97
- const target = e.currentTarget;
98
- const scrollX = target[propX];
99
- const scrollY = target[propY];
101
+ var onScroll = function onScroll(e) {
102
+ var target = e.currentTarget;
103
+ var scrollX = target[propX];
104
+ var scrollY = target[propY];
100
105
  if (instance.options.horizontal ? prevX - scrollX : prevY - scrollY) {
101
106
  scroll();
102
107
  }
@@ -107,388 +112,404 @@ const createOffsetObserver = mode => {
107
112
  capture: false,
108
113
  passive: true
109
114
  });
110
- return () => {
115
+ return function () {
111
116
  instance.scrollElement.removeEventListener('scroll', onScroll);
112
117
  };
113
118
  };
114
119
  };
115
- const observeElementOffset = createOffsetObserver('element');
116
- const observeWindowOffset = createOffsetObserver('window');
117
- const measureElement = (element, instance) => {
120
+ var observeElementOffset = createOffsetObserver('element');
121
+ var observeWindowOffset = createOffsetObserver('window');
122
+ var measureElement = function measureElement(element, instance) {
118
123
  return Math.round(element.getBoundingClientRect()[instance.options.horizontal ? 'width' : 'height']);
119
124
  };
120
- const windowScroll = (offset, _ref, instance) => {
121
- var _instance$scrollEleme;
122
- let {
123
- adjustments,
124
- behavior,
125
- sync
126
- } = _ref;
127
- const toOffset = (sync ? offset : offset + instance.options.scrollMargin) + (adjustments ?? 0);
128
- (_instance$scrollEleme = instance.scrollElement) == null ? void 0 : _instance$scrollEleme.scrollTo == null ? void 0 : _instance$scrollEleme.scrollTo({
129
- [instance.options.horizontal ? 'left' : 'top']: toOffset,
130
- behavior
131
- });
125
+ var windowScroll = function windowScroll(offset, _ref, instance) {
126
+ var _instance$scrollEleme, _instance$scrollEleme2;
127
+ var adjustments = _ref.adjustments,
128
+ behavior = _ref.behavior,
129
+ sync = _ref.sync;
130
+ var toOffset = (sync ? offset : offset + instance.options.scrollMargin) + (adjustments != null ? adjustments : 0);
131
+ (_instance$scrollEleme = instance.scrollElement) == null ? void 0 : _instance$scrollEleme.scrollTo == null ? void 0 : _instance$scrollEleme.scrollTo((_instance$scrollEleme2 = {}, _instance$scrollEleme2[instance.options.horizontal ? 'left' : 'top'] = toOffset, _instance$scrollEleme2.behavior = behavior, _instance$scrollEleme2));
132
132
  };
133
- const elementScroll = (offset, _ref2, instance) => {
134
- var _instance$scrollEleme2;
135
- let {
136
- adjustments,
137
- behavior,
138
- sync
139
- } = _ref2;
140
- const toOffset = (sync ? offset : offset + instance.options.scrollMargin) + (adjustments ?? 0);
141
- (_instance$scrollEleme2 = instance.scrollElement) == null ? void 0 : _instance$scrollEleme2.scrollTo == null ? void 0 : _instance$scrollEleme2.scrollTo({
142
- [instance.options.horizontal ? 'left' : 'top']: toOffset,
143
- behavior
144
- });
133
+ var elementScroll = function elementScroll(offset, _ref2, instance) {
134
+ var _instance$scrollEleme3, _instance$scrollEleme4;
135
+ var adjustments = _ref2.adjustments,
136
+ behavior = _ref2.behavior,
137
+ sync = _ref2.sync;
138
+ var toOffset = (sync ? offset : offset + instance.options.scrollMargin) + (adjustments != null ? adjustments : 0);
139
+ (_instance$scrollEleme3 = instance.scrollElement) == null ? void 0 : _instance$scrollEleme3.scrollTo == null ? void 0 : _instance$scrollEleme3.scrollTo((_instance$scrollEleme4 = {}, _instance$scrollEleme4[instance.options.horizontal ? 'left' : 'top'] = toOffset, _instance$scrollEleme4.behavior = behavior, _instance$scrollEleme4));
145
140
  };
146
- class Virtualizer {
147
- constructor(_opts) {
148
- var _this = this;
149
- this.unsubs = [];
150
- this.scrollElement = null;
151
- this.isScrolling = false;
152
- this.isScrollingTimeoutId = null;
153
- this.measurementsCache = [];
154
- this.itemMeasurementsCache = {};
155
- this.pendingMeasuredCacheIndexes = [];
156
- this.scrollAdjustments = 0;
157
- this.measureElementCache = {};
158
- this.pendingScrollToIndexCallback = null;
159
- this.getResizeObserver = (() => {
160
- let _ro = null;
161
- return () => {
162
- if (_ro) {
163
- return _ro;
164
- } else if (typeof ResizeObserver !== 'undefined') {
165
- return _ro = new ResizeObserver(entries => {
166
- entries.forEach(entry => {
167
- this._measureElement(entry.target, false);
168
- });
141
+ var Virtualizer = function Virtualizer(_opts) {
142
+ var _this = this;
143
+ this.unsubs = [];
144
+ this.scrollElement = null;
145
+ this.isScrolling = false;
146
+ this.isScrollingTimeoutId = null;
147
+ this.measurementsCache = [];
148
+ this.itemMeasurementsCache = {};
149
+ this.pendingMeasuredCacheIndexes = [];
150
+ this.scrollAdjustments = 0;
151
+ this.measureElementCache = {};
152
+ this.pendingScrollToIndexCallback = null;
153
+ this.getResizeObserver = function () {
154
+ var _ro = null;
155
+ return function () {
156
+ if (_ro) {
157
+ return _ro;
158
+ } else if (typeof ResizeObserver !== 'undefined') {
159
+ return _ro = new ResizeObserver(function (entries) {
160
+ entries.forEach(function (entry) {
161
+ _this._measureElement(entry.target, false);
169
162
  });
170
- } else {
171
- return null;
172
- }
173
- };
174
- })();
175
- this.range = {
176
- startIndex: 0,
177
- endIndex: 0
178
- };
179
- this.setOptions = opts => {
180
- Object.entries(opts).forEach(_ref3 => {
181
- let [key, value] = _ref3;
182
- if (typeof value === 'undefined') delete opts[key];
183
- });
184
- this.options = {
185
- debug: false,
186
- initialOffset: 0,
187
- overscan: 1,
188
- paddingStart: 0,
189
- paddingEnd: 0,
190
- scrollPaddingStart: 0,
191
- scrollPaddingEnd: 0,
192
- horizontal: false,
193
- getItemKey: defaultKeyExtractor,
194
- rangeExtractor: defaultRangeExtractor,
195
- onChange: () => {},
196
- measureElement,
197
- initialRect: {
198
- width: 0,
199
- height: 0
200
- },
201
- scrollMargin: 0,
202
- scrollingDelay: 150,
203
- indexAttribute: 'data-index',
204
- ...opts
205
- };
206
- };
207
- this.notify = () => {
208
- var _this$options$onChang, _this$options;
209
- (_this$options$onChang = (_this$options = this.options).onChange) == null ? void 0 : _this$options$onChang.call(_this$options, this);
210
- };
211
- this.cleanup = () => {
212
- this.unsubs.filter(Boolean).forEach(d => d());
213
- this.unsubs = [];
214
- this.scrollElement = null;
215
- };
216
- this._didMount = () => {
217
- const ro = this.getResizeObserver();
218
- Object.values(this.measureElementCache).forEach(node => ro == null ? void 0 : ro.observe(node));
219
- return () => {
220
- ro == null ? void 0 : ro.disconnect();
221
- this.cleanup();
222
- };
223
- };
224
- this._willUpdate = () => {
225
- var _this$pendingScrollTo;
226
- (_this$pendingScrollTo = this.pendingScrollToIndexCallback) == null ? void 0 : _this$pendingScrollTo.call(this);
227
- const scrollElement = this.options.getScrollElement();
228
- if (this.scrollElement !== scrollElement) {
229
- this.cleanup();
230
- this.scrollElement = scrollElement;
231
- this._scrollToOffset(this.scrollOffset, {
232
- adjustments: undefined,
233
- behavior: undefined,
234
- sync: true
235
163
  });
236
- this.unsubs.push(this.options.observeElementRect(this, rect => {
237
- this.scrollRect = rect;
238
- this.calculateRange();
239
- }));
240
- this.unsubs.push(this.options.observeElementOffset(this, offset => {
241
- if (this.isScrollingTimeoutId !== null) {
242
- clearTimeout(this.isScrollingTimeoutId);
243
- this.isScrollingTimeoutId = null;
244
- }
245
- if (this.scrollOffset !== offset) {
246
- this.scrollOffset = offset;
247
- this.isScrolling = true;
248
- this.scrollAdjustments = 0;
249
- this.isScrollingTimeoutId = setTimeout(() => {
250
- this.isScrollingTimeoutId = null;
251
- this.isScrolling = false;
252
- this.notify();
253
- }, this.options.scrollingDelay);
254
- } else {
255
- this.isScrolling = false;
256
- this.scrollAdjustments = 0;
257
- }
258
- this.calculateRange();
259
- }));
260
- } else if (!this.isScrolling) {
261
- this.calculateRange();
164
+ } else {
165
+ return null;
262
166
  }
263
167
  };
264
- this.getSize = () => {
265
- return this.scrollRect[this.options.horizontal ? 'width' : 'height'];
266
- };
267
- this.getMeasurements = utils.memo(() => [this.options.count, this.options.paddingStart, this.options.getItemKey, this.itemMeasurementsCache], (count, paddingStart, getItemKey, measurementsCache) => {
268
- const min = this.pendingMeasuredCacheIndexes.length > 0 ? Math.min(...this.pendingMeasuredCacheIndexes) : 0;
269
- this.pendingMeasuredCacheIndexes = [];
270
- const measurements = this.measurementsCache.slice(0, min);
271
- for (let i = min; i < count; i++) {
272
- const key = getItemKey(i);
273
- const measuredSize = measurementsCache[key];
274
- const start = measurements[i - 1] ? measurements[i - 1].end : paddingStart;
275
- const size = typeof measuredSize === 'number' ? measuredSize : this.options.estimateSize(i);
276
- const end = start + size;
277
- measurements[i] = {
278
- index: i,
279
- start,
280
- size,
281
- end,
282
- key
283
- };
284
- }
285
- this.measurementsCache = measurements;
286
- return measurements;
287
- }, {
288
- key: process.env.NODE_ENV !== 'production' && 'getMeasurements',
289
- debug: () => this.options.debug
168
+ }();
169
+ this.range = {
170
+ startIndex: 0,
171
+ endIndex: 0
172
+ };
173
+ this.setOptions = function (opts) {
174
+ Object.entries(opts).forEach(function (_ref3) {
175
+ var key = _ref3[0],
176
+ value = _ref3[1];
177
+ if (typeof value === 'undefined') delete opts[key];
290
178
  });
291
- this.calculateRange = utils.memo(() => [this.getMeasurements(), this.getSize(), this.scrollOffset], (measurements, outerSize, scrollOffset) => {
292
- const range = calculateRange({
293
- measurements,
294
- outerSize,
295
- scrollOffset
296
- });
297
- if (range.startIndex !== this.range.startIndex || range.endIndex !== this.range.endIndex) {
298
- this.range = range;
299
- this.notify();
300
- }
301
- return this.range;
302
- }, {
303
- key: process.env.NODE_ENV !== 'production' && 'calculateRange',
304
- debug: () => this.options.debug
179
+ _this.options = _rollupPluginBabelHelpers["extends"]({
180
+ debug: false,
181
+ initialOffset: 0,
182
+ overscan: 1,
183
+ paddingStart: 0,
184
+ paddingEnd: 0,
185
+ scrollPaddingStart: 0,
186
+ scrollPaddingEnd: 0,
187
+ horizontal: false,
188
+ getItemKey: defaultKeyExtractor,
189
+ rangeExtractor: defaultRangeExtractor,
190
+ onChange: function onChange() {},
191
+ measureElement: measureElement,
192
+ initialRect: {
193
+ width: 0,
194
+ height: 0
195
+ },
196
+ scrollMargin: 0,
197
+ scrollingDelay: 150,
198
+ indexAttribute: 'data-index'
199
+ }, opts);
200
+ };
201
+ this.notify = function () {
202
+ _this.options.onChange == null ? void 0 : _this.options.onChange(_this);
203
+ };
204
+ this.cleanup = function () {
205
+ _this.unsubs.filter(Boolean).forEach(function (d) {
206
+ return d();
305
207
  });
306
- this.getIndexes = utils.memo(() => [this.options.rangeExtractor, this.range, this.options.overscan, this.options.count], (rangeExtractor, range, overscan, count) => {
307
- return rangeExtractor({
308
- ...range,
309
- overscan,
310
- count: count
311
- });
312
- }, {
313
- key: process.env.NODE_ENV !== 'production' && 'getIndexes',
314
- debug: () => this.options.debug
208
+ _this.unsubs = [];
209
+ _this.scrollElement = null;
210
+ };
211
+ this._didMount = function () {
212
+ var ro = _this.getResizeObserver();
213
+ Object.values(_this.measureElementCache).forEach(function (node) {
214
+ return ro == null ? void 0 : ro.observe(node);
315
215
  });
316
- this.indexFromElement = node => {
317
- const attributeName = this.options.indexAttribute;
318
- const indexStr = node.getAttribute(attributeName);
319
- if (!indexStr) {
320
- console.warn(`Missing attribute name '${attributeName}={index}' on measured element.`);
321
- return -1;
322
- }
323
- return parseInt(indexStr, 10);
216
+ return function () {
217
+ ro == null ? void 0 : ro.disconnect();
218
+ _this.cleanup();
324
219
  };
325
- this._measureElement = (node, _sync) => {
326
- const index = this.indexFromElement(node);
327
- const item = this.measurementsCache[index];
328
- if (!item) {
329
- return;
330
- }
331
- const prevNode = this.measureElementCache[item.key];
332
- const ro = this.getResizeObserver();
333
- if (!node.isConnected) {
334
- if (prevNode) {
335
- ro == null ? void 0 : ro.unobserve(prevNode);
336
- delete this.measureElementCache[item.key];
337
- }
338
- return;
339
- }
340
- if (!prevNode || prevNode !== node) {
341
- if (prevNode) {
342
- ro == null ? void 0 : ro.unobserve(prevNode);
220
+ };
221
+ this._willUpdate = function () {
222
+ _this.pendingScrollToIndexCallback == null ? void 0 : _this.pendingScrollToIndexCallback();
223
+ var scrollElement = _this.options.getScrollElement();
224
+ if (_this.scrollElement !== scrollElement) {
225
+ _this.cleanup();
226
+ _this.scrollElement = scrollElement;
227
+ _this._scrollToOffset(_this.scrollOffset, {
228
+ adjustments: undefined,
229
+ behavior: undefined,
230
+ sync: true
231
+ });
232
+ _this.unsubs.push(_this.options.observeElementRect(_this, function (rect) {
233
+ _this.scrollRect = rect;
234
+ _this.calculateRange();
235
+ }));
236
+ _this.unsubs.push(_this.options.observeElementOffset(_this, function (offset) {
237
+ if (_this.isScrollingTimeoutId !== null) {
238
+ clearTimeout(_this.isScrollingTimeoutId);
239
+ _this.isScrollingTimeoutId = null;
343
240
  }
344
- this.measureElementCache[item.key] = node;
345
- ro == null ? void 0 : ro.observe(node);
346
- }
347
- const measuredItemSize = this.options.measureElement(node, this);
348
- const itemSize = this.itemMeasurementsCache[item.key] ?? item.size;
349
- const delta = measuredItemSize - itemSize;
350
- if (delta !== 0) {
351
- if (item.start < this.scrollOffset && this.isScrolling) {
352
- if (process.env.NODE_ENV !== 'production' && this.options.debug) {
353
- console.info('correction', delta);
241
+ var onIsScrollingChange = function onIsScrollingChange(isScrolling) {
242
+ if (_this.isScrolling !== isScrolling) {
243
+ _this.isScrolling = isScrolling;
244
+ _this.notify();
354
245
  }
355
- this._scrollToOffset(this.scrollOffset, {
356
- adjustments: this.scrollAdjustments += delta,
357
- behavior: undefined,
358
- sync: false
359
- });
360
- }
361
- this.pendingMeasuredCacheIndexes.push(index);
362
- this.itemMeasurementsCache = {
363
- ...this.itemMeasurementsCache,
364
- [item.key]: measuredItemSize
365
246
  };
366
- this.notify();
367
- }
368
- };
369
- this.measureElement = node => {
370
- if (!node) {
371
- return;
372
- }
373
- this._measureElement(node, true);
374
- };
375
- this.getVirtualItems = utils.memo(() => [this.getIndexes(), this.getMeasurements()], (indexes, measurements) => {
376
- const virtualItems = [];
377
- for (let k = 0, len = indexes.length; k < len; k++) {
378
- const i = indexes[k];
379
- const measurement = measurements[i];
380
- virtualItems.push(measurement);
381
- }
382
- return virtualItems;
383
- }, {
384
- key: process.env.NODE_ENV !== 'production' && 'getIndexes',
385
- debug: () => this.options.debug
386
- });
387
- this.scrollToOffset = function (toOffset, _temp) {
388
- let {
389
- align = 'start',
390
- behavior
391
- } = _temp === void 0 ? {} : _temp;
392
- const offset = _this.scrollOffset;
393
- const size = _this.getSize();
394
- if (align === 'auto') {
395
- if (toOffset <= offset) {
396
- align = 'start';
397
- } else if (toOffset >= offset + size) {
398
- align = 'end';
399
- } else {
400
- align = 'start';
247
+ _this.scrollAdjustments = 0;
248
+ if (_this.scrollOffset !== offset) {
249
+ _this.scrollOffset = offset;
250
+ onIsScrollingChange(true);
401
251
  }
402
- }
403
- const options = {
404
- adjustments: undefined,
405
- behavior,
406
- sync: false
252
+ _this.calculateRange();
253
+ _this.isScrollingTimeoutId = setTimeout(function () {
254
+ _this.isScrollingTimeoutId = null;
255
+ onIsScrollingChange(false);
256
+ }, _this.options.scrollingDelay);
257
+ }));
258
+ } else if (!_this.isScrolling) {
259
+ _this.calculateRange();
260
+ }
261
+ };
262
+ this.getSize = function () {
263
+ return _this.scrollRect[_this.options.horizontal ? 'width' : 'height'];
264
+ };
265
+ this.getMeasurements = utils.memo(function () {
266
+ return [_this.options.count, _this.options.paddingStart, _this.options.getItemKey, _this.itemMeasurementsCache];
267
+ }, function (count, paddingStart, getItemKey, measurementsCache) {
268
+ var min = _this.pendingMeasuredCacheIndexes.length > 0 ? Math.min.apply(Math, _this.pendingMeasuredCacheIndexes) : 0;
269
+ _this.pendingMeasuredCacheIndexes = [];
270
+ var measurements = _this.measurementsCache.slice(0, min);
271
+ for (var _i2 = min; _i2 < count; _i2++) {
272
+ var key = getItemKey(_i2);
273
+ var measuredSize = measurementsCache[key];
274
+ var start = measurements[_i2 - 1] ? measurements[_i2 - 1].end : paddingStart;
275
+ var size = typeof measuredSize === 'number' ? measuredSize : _this.options.estimateSize(_i2);
276
+ var end = start + size;
277
+ measurements[_i2] = {
278
+ index: _i2,
279
+ start: start,
280
+ size: size,
281
+ end: end,
282
+ key: key
407
283
  };
408
- if (align === 'start') {
409
- _this._scrollToOffset(toOffset, options);
410
- } else if (align === 'end') {
411
- _this._scrollToOffset(toOffset - size, options);
412
- } else if (align === 'center') {
413
- _this._scrollToOffset(toOffset - size / 2, options);
284
+ }
285
+ _this.measurementsCache = measurements;
286
+ return measurements;
287
+ }, {
288
+ key: process.env.NODE_ENV !== 'production' && 'getMeasurements',
289
+ debug: function debug() {
290
+ return _this.options.debug;
291
+ }
292
+ });
293
+ this.calculateRange = utils.memo(function () {
294
+ return [_this.getMeasurements(), _this.getSize(), _this.scrollOffset];
295
+ }, function (measurements, outerSize, scrollOffset) {
296
+ var range = calculateRange({
297
+ measurements: measurements,
298
+ outerSize: outerSize,
299
+ scrollOffset: scrollOffset
300
+ });
301
+ if (range.startIndex !== _this.range.startIndex || range.endIndex !== _this.range.endIndex) {
302
+ _this.range = range;
303
+ _this.notify();
304
+ }
305
+ return _this.range;
306
+ }, {
307
+ key: process.env.NODE_ENV !== 'production' && 'calculateRange',
308
+ debug: function debug() {
309
+ return _this.options.debug;
310
+ }
311
+ });
312
+ this.getIndexes = utils.memo(function () {
313
+ return [_this.options.rangeExtractor, _this.range, _this.options.overscan, _this.options.count];
314
+ }, function (rangeExtractor, range, overscan, count) {
315
+ return rangeExtractor(_rollupPluginBabelHelpers["extends"]({}, range, {
316
+ overscan: overscan,
317
+ count: count
318
+ }));
319
+ }, {
320
+ key: process.env.NODE_ENV !== 'production' && 'getIndexes',
321
+ debug: function debug() {
322
+ return _this.options.debug;
323
+ }
324
+ });
325
+ this.indexFromElement = function (node) {
326
+ var attributeName = _this.options.indexAttribute;
327
+ var indexStr = node.getAttribute(attributeName);
328
+ if (!indexStr) {
329
+ console.warn("Missing attribute name '" + attributeName + "={index}' on measured element.");
330
+ return -1;
331
+ }
332
+ return parseInt(indexStr, 10);
333
+ };
334
+ this._measureElement = function (node, _sync) {
335
+ var _this$itemMeasurement;
336
+ var index = _this.indexFromElement(node);
337
+ var item = _this.measurementsCache[index];
338
+ if (!item) {
339
+ return;
340
+ }
341
+ var prevNode = _this.measureElementCache[item.key];
342
+ var ro = _this.getResizeObserver();
343
+ if (!node.isConnected) {
344
+ if (prevNode) {
345
+ ro == null ? void 0 : ro.unobserve(prevNode);
346
+ delete _this.measureElementCache[item.key];
414
347
  }
415
- };
416
- this.scrollToIndex = function (index, _temp2) {
417
- let {
418
- align = 'auto',
419
- ...rest
420
- } = _temp2 === void 0 ? {} : _temp2;
421
- _this.pendingScrollToIndexCallback = null;
422
- const measurements = _this.getMeasurements();
423
- const offset = _this.scrollOffset;
424
- const size = _this.getSize();
425
- const {
426
- count
427
- } = _this.options;
428
- const measurement = measurements[Math.max(0, Math.min(index, count - 1))];
429
- if (!measurement) {
430
- return;
348
+ return;
349
+ }
350
+ if (!prevNode || prevNode !== node) {
351
+ if (prevNode) {
352
+ ro == null ? void 0 : ro.unobserve(prevNode);
431
353
  }
432
- if (align === 'auto') {
433
- if (measurement.end >= offset + size - _this.options.scrollPaddingEnd) {
434
- align = 'end';
435
- } else if (measurement.start <= offset + _this.options.scrollPaddingStart) {
436
- align = 'start';
437
- } else {
438
- return;
354
+ _this.measureElementCache[item.key] = node;
355
+ ro == null ? void 0 : ro.observe(node);
356
+ }
357
+ var measuredItemSize = _this.options.measureElement(node, _this);
358
+ var itemSize = (_this$itemMeasurement = _this.itemMeasurementsCache[item.key]) != null ? _this$itemMeasurement : item.size;
359
+ var delta = measuredItemSize - itemSize;
360
+ if (delta !== 0) {
361
+ var _extends2;
362
+ if (item.start < _this.scrollOffset && _this.isScrolling) {
363
+ if (process.env.NODE_ENV !== 'production' && _this.options.debug) {
364
+ console.info('correction', delta);
439
365
  }
366
+ _this._scrollToOffset(_this.scrollOffset, {
367
+ adjustments: _this.scrollAdjustments += delta,
368
+ behavior: undefined,
369
+ sync: false
370
+ });
440
371
  }
441
- const toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
442
- _this.scrollToOffset(toOffset, {
443
- align,
444
- ...rest
445
- });
446
- const isDynamic = Object.keys(_this.measureElementCache).length > 0;
447
- if (isDynamic) {
448
- const didSeen = () => typeof _this.itemMeasurementsCache[_this.options.getItemKey(index)] === 'number';
449
- if (!didSeen()) {
450
- _this.pendingScrollToIndexCallback = () => {
451
- if (didSeen()) {
452
- _this.pendingScrollToIndexCallback = null;
453
- _this.scrollToIndex(index, {
454
- align,
455
- ...rest
456
- });
457
- }
458
- };
459
- }
372
+ _this.pendingMeasuredCacheIndexes.push(index);
373
+ _this.itemMeasurementsCache = _rollupPluginBabelHelpers["extends"]({}, _this.itemMeasurementsCache, (_extends2 = {}, _extends2[item.key] = measuredItemSize, _extends2));
374
+ _this.notify();
375
+ }
376
+ };
377
+ this.measureElement = function (node) {
378
+ if (!node) {
379
+ return;
380
+ }
381
+ _this._measureElement(node, true);
382
+ };
383
+ this.getVirtualItems = utils.memo(function () {
384
+ return [_this.getIndexes(), _this.getMeasurements()];
385
+ }, function (indexes, measurements) {
386
+ var virtualItems = [];
387
+ for (var k = 0, len = indexes.length; k < len; k++) {
388
+ var _i3 = indexes[k];
389
+ var measurement = measurements[_i3];
390
+ virtualItems.push(measurement);
391
+ }
392
+ return virtualItems;
393
+ }, {
394
+ key: process.env.NODE_ENV !== 'production' && 'getIndexes',
395
+ debug: function debug() {
396
+ return _this.options.debug;
397
+ }
398
+ });
399
+ this.getOffsetForAlignment = function (toOffset, align) {
400
+ var offset = _this.scrollOffset;
401
+ var size = _this.getSize();
402
+ if (align === 'auto') {
403
+ if (toOffset <= offset) {
404
+ align = 'start';
405
+ } else if (toOffset >= offset + size) {
406
+ align = 'end';
407
+ } else {
408
+ align = 'start';
460
409
  }
410
+ }
411
+ if (align === 'start') {
412
+ return toOffset;
413
+ } else if (align === 'end') {
414
+ return toOffset - size;
415
+ } else if (align === 'center') {
416
+ return toOffset - size / 2;
417
+ }
418
+ return toOffset;
419
+ };
420
+ this.scrollToOffset = function (toOffset, _temp) {
421
+ var _ref4 = _temp === void 0 ? {} : _temp,
422
+ _ref4$align = _ref4.align,
423
+ align = _ref4$align === void 0 ? 'start' : _ref4$align,
424
+ behavior = _ref4.behavior;
425
+ var options = {
426
+ adjustments: undefined,
427
+ behavior: behavior,
428
+ sync: false
461
429
  };
462
- this.getTotalSize = () => {
463
- var _this$getMeasurements;
464
- return (((_this$getMeasurements = this.getMeasurements()[this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || this.options.paddingStart) + this.options.paddingEnd;
465
- };
466
- this._scrollToOffset = (offset, _ref4) => {
467
- let {
468
- adjustments,
469
- behavior,
470
- sync
471
- } = _ref4;
472
- this.options.scrollToFn(offset, {
473
- behavior,
474
- sync,
475
- adjustments
476
- }, this);
430
+ _this._scrollToOffset(_this.getOffsetForAlignment(toOffset, align), options);
431
+ };
432
+ this.scrollToIndex = function (index, _temp2) {
433
+ var _ref5 = _temp2 === void 0 ? {} : _temp2,
434
+ _ref5$align = _ref5.align,
435
+ align = _ref5$align === void 0 ? 'auto' : _ref5$align,
436
+ behavior = _ref5.behavior;
437
+ _this.pendingScrollToIndexCallback = null;
438
+ var offset = _this.scrollOffset;
439
+ var size = _this.getSize();
440
+ var count = _this.options.count;
441
+ var measurements = _this.getMeasurements();
442
+ var measurement = measurements[Math.max(0, Math.min(index, count - 1))];
443
+ if (!measurement) {
444
+ throw new Error("VirtualItem not found for index = " + index);
445
+ }
446
+ if (align === 'auto') {
447
+ if (measurement.end >= offset + size - _this.options.scrollPaddingEnd) {
448
+ align = 'end';
449
+ } else if (measurement.start <= offset + _this.options.scrollPaddingStart) {
450
+ align = 'start';
451
+ } else {
452
+ return;
453
+ }
454
+ }
455
+ var getOffsetForIndexAndAlignment = function getOffsetForIndexAndAlignment(measurement) {
456
+ var toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
457
+ return _this.getOffsetForAlignment(toOffset, align);
477
458
  };
478
- this.measure = () => {
479
- this.itemMeasurementsCache = {};
480
- this.notify();
459
+ var toOffset = getOffsetForIndexAndAlignment(measurement);
460
+ if (toOffset === offset) {
461
+ return;
462
+ }
463
+ var options = {
464
+ adjustments: undefined,
465
+ behavior: behavior,
466
+ sync: false
481
467
  };
482
- this.setOptions(_opts);
483
- this.scrollRect = this.options.initialRect;
484
- this.scrollOffset = this.options.initialOffset;
485
- this.calculateRange();
486
- }
487
- }
488
- const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
468
+ _this._scrollToOffset(toOffset, options);
469
+ var isDynamic = Object.keys(_this.measureElementCache).length > 0;
470
+ if (isDynamic) {
471
+ _this.pendingScrollToIndexCallback = function () {
472
+ _this.scrollToIndex(index, {
473
+ align: align,
474
+ behavior: behavior
475
+ });
476
+ };
477
+ }
478
+ };
479
+ this.scrollBy = function (adjustments, options) {
480
+ _this._scrollToOffset(_this.scrollOffset, {
481
+ adjustments: adjustments,
482
+ behavior: options == null ? void 0 : options.behavior,
483
+ sync: false
484
+ });
485
+ };
486
+ this.getTotalSize = function () {
487
+ var _this$getMeasurements;
488
+ return (((_this$getMeasurements = _this.getMeasurements()[_this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || _this.options.paddingStart) + _this.options.paddingEnd;
489
+ };
490
+ this._scrollToOffset = function (offset, _ref6) {
491
+ var adjustments = _ref6.adjustments,
492
+ behavior = _ref6.behavior,
493
+ sync = _ref6.sync;
494
+ _this.options.scrollToFn(offset, {
495
+ behavior: behavior,
496
+ sync: sync,
497
+ adjustments: adjustments
498
+ }, _this);
499
+ };
500
+ this.measure = function () {
501
+ _this.itemMeasurementsCache = {};
502
+ _this.notify();
503
+ };
504
+ this.setOptions(_opts);
505
+ this.scrollRect = this.options.initialRect;
506
+ this.scrollOffset = this.options.initialOffset;
507
+ this.calculateRange();
508
+ };
509
+ var findNearestBinarySearch = function findNearestBinarySearch(low, high, getCurrentValue, value) {
489
510
  while (low <= high) {
490
- const middle = (low + high) / 2 | 0;
491
- const currentValue = getCurrentValue(middle);
511
+ var middle = (low + high) / 2 | 0;
512
+ var currentValue = getCurrentValue(middle);
492
513
  if (currentValue < value) {
493
514
  low = middle + 1;
494
515
  } else if (currentValue > value) {
@@ -503,22 +524,22 @@ const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
503
524
  return 0;
504
525
  }
505
526
  };
506
- function calculateRange(_ref5) {
507
- let {
508
- measurements,
509
- outerSize,
510
- scrollOffset
511
- } = _ref5;
512
- const count = measurements.length - 1;
513
- const getOffset = index => measurements[index].start;
514
- const startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
515
- let endIndex = startIndex;
527
+ function calculateRange(_ref7) {
528
+ var measurements = _ref7.measurements,
529
+ outerSize = _ref7.outerSize,
530
+ scrollOffset = _ref7.scrollOffset;
531
+ var count = measurements.length - 1;
532
+ var getOffset = function getOffset(index) {
533
+ return measurements[index].start;
534
+ };
535
+ var startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
536
+ var endIndex = startIndex;
516
537
  while (endIndex < count && measurements[endIndex].end < scrollOffset + outerSize) {
517
538
  endIndex++;
518
539
  }
519
540
  return {
520
- startIndex,
521
- endIndex
541
+ startIndex: startIndex,
542
+ endIndex: endIndex
522
543
  };
523
544
  }
524
545