@tanstack/virtual-core 3.0.0-beta.30 → 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,390 +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
- const onIsScrollingChange = isScrolling => {
246
- if (this.isScrolling !== isScrolling) {
247
- this.isScrolling = isScrolling;
248
- this.notify();
249
- }
250
- };
251
- this.scrollAdjustments = 0;
252
- if (this.scrollOffset !== offset) {
253
- this.scrollOffset = offset;
254
- onIsScrollingChange(true);
255
- }
256
- this.calculateRange();
257
- this.isScrollingTimeoutId = setTimeout(() => {
258
- this.isScrollingTimeoutId = null;
259
- onIsScrollingChange(false);
260
- }, this.options.scrollingDelay);
261
- }));
262
- } else if (!this.isScrolling) {
263
- this.calculateRange();
164
+ } else {
165
+ return null;
264
166
  }
265
167
  };
266
- this.getSize = () => {
267
- return this.scrollRect[this.options.horizontal ? 'width' : 'height'];
268
- };
269
- this.getMeasurements = utils.memo(() => [this.options.count, this.options.paddingStart, this.options.getItemKey, this.itemMeasurementsCache], (count, paddingStart, getItemKey, measurementsCache) => {
270
- const min = this.pendingMeasuredCacheIndexes.length > 0 ? Math.min(...this.pendingMeasuredCacheIndexes) : 0;
271
- this.pendingMeasuredCacheIndexes = [];
272
- const measurements = this.measurementsCache.slice(0, min);
273
- for (let i = min; i < count; i++) {
274
- const key = getItemKey(i);
275
- const measuredSize = measurementsCache[key];
276
- const start = measurements[i - 1] ? measurements[i - 1].end : paddingStart;
277
- const size = typeof measuredSize === 'number' ? measuredSize : this.options.estimateSize(i);
278
- const end = start + size;
279
- measurements[i] = {
280
- index: i,
281
- start,
282
- size,
283
- end,
284
- key
285
- };
286
- }
287
- this.measurementsCache = measurements;
288
- return measurements;
289
- }, {
290
- key: process.env.NODE_ENV !== 'production' && 'getMeasurements',
291
- 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];
292
178
  });
293
- this.calculateRange = utils.memo(() => [this.getMeasurements(), this.getSize(), this.scrollOffset], (measurements, outerSize, scrollOffset) => {
294
- const range = calculateRange({
295
- measurements,
296
- outerSize,
297
- scrollOffset
298
- });
299
- if (range.startIndex !== this.range.startIndex || range.endIndex !== this.range.endIndex) {
300
- this.range = range;
301
- this.notify();
302
- }
303
- return this.range;
304
- }, {
305
- key: process.env.NODE_ENV !== 'production' && 'calculateRange',
306
- 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();
307
207
  });
308
- this.getIndexes = utils.memo(() => [this.options.rangeExtractor, this.range, this.options.overscan, this.options.count], (rangeExtractor, range, overscan, count) => {
309
- return rangeExtractor({
310
- ...range,
311
- overscan,
312
- count: count
313
- });
314
- }, {
315
- key: process.env.NODE_ENV !== 'production' && 'getIndexes',
316
- 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);
317
215
  });
318
- this.indexFromElement = node => {
319
- const attributeName = this.options.indexAttribute;
320
- const indexStr = node.getAttribute(attributeName);
321
- if (!indexStr) {
322
- console.warn(`Missing attribute name '${attributeName}={index}' on measured element.`);
323
- return -1;
324
- }
325
- return parseInt(indexStr, 10);
216
+ return function () {
217
+ ro == null ? void 0 : ro.disconnect();
218
+ _this.cleanup();
326
219
  };
327
- this._measureElement = (node, _sync) => {
328
- const index = this.indexFromElement(node);
329
- const item = this.measurementsCache[index];
330
- if (!item) {
331
- return;
332
- }
333
- const prevNode = this.measureElementCache[item.key];
334
- const ro = this.getResizeObserver();
335
- if (!node.isConnected) {
336
- if (prevNode) {
337
- ro == null ? void 0 : ro.unobserve(prevNode);
338
- delete this.measureElementCache[item.key];
339
- }
340
- return;
341
- }
342
- if (!prevNode || prevNode !== node) {
343
- if (prevNode) {
344
- 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;
345
240
  }
346
- this.measureElementCache[item.key] = node;
347
- ro == null ? void 0 : ro.observe(node);
348
- }
349
- const measuredItemSize = this.options.measureElement(node, this);
350
- const itemSize = this.itemMeasurementsCache[item.key] ?? item.size;
351
- const delta = measuredItemSize - itemSize;
352
- if (delta !== 0) {
353
- if (item.start < this.scrollOffset && this.isScrolling) {
354
- if (process.env.NODE_ENV !== 'production' && this.options.debug) {
355
- console.info('correction', delta);
241
+ var onIsScrollingChange = function onIsScrollingChange(isScrolling) {
242
+ if (_this.isScrolling !== isScrolling) {
243
+ _this.isScrolling = isScrolling;
244
+ _this.notify();
356
245
  }
357
- this._scrollToOffset(this.scrollOffset, {
358
- adjustments: this.scrollAdjustments += delta,
359
- behavior: undefined,
360
- sync: false
361
- });
362
- }
363
- this.pendingMeasuredCacheIndexes.push(index);
364
- this.itemMeasurementsCache = {
365
- ...this.itemMeasurementsCache,
366
- [item.key]: measuredItemSize
367
246
  };
368
- this.notify();
369
- }
370
- };
371
- this.measureElement = node => {
372
- if (!node) {
373
- return;
374
- }
375
- this._measureElement(node, true);
376
- };
377
- this.getVirtualItems = utils.memo(() => [this.getIndexes(), this.getMeasurements()], (indexes, measurements) => {
378
- const virtualItems = [];
379
- for (let k = 0, len = indexes.length; k < len; k++) {
380
- const i = indexes[k];
381
- const measurement = measurements[i];
382
- virtualItems.push(measurement);
383
- }
384
- return virtualItems;
385
- }, {
386
- key: process.env.NODE_ENV !== 'production' && 'getIndexes',
387
- debug: () => this.options.debug
388
- });
389
- this.scrollToOffset = function (toOffset, _temp) {
390
- let {
391
- align = 'start',
392
- behavior
393
- } = _temp === void 0 ? {} : _temp;
394
- const offset = _this.scrollOffset;
395
- const size = _this.getSize();
396
- if (align === 'auto') {
397
- if (toOffset <= offset) {
398
- align = 'start';
399
- } else if (toOffset >= offset + size) {
400
- align = 'end';
401
- } else {
402
- align = 'start';
247
+ _this.scrollAdjustments = 0;
248
+ if (_this.scrollOffset !== offset) {
249
+ _this.scrollOffset = offset;
250
+ onIsScrollingChange(true);
403
251
  }
404
- }
405
- const options = {
406
- adjustments: undefined,
407
- behavior,
408
- 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
409
283
  };
410
- if (align === 'start') {
411
- _this._scrollToOffset(toOffset, options);
412
- } else if (align === 'end') {
413
- _this._scrollToOffset(toOffset - size, options);
414
- } else if (align === 'center') {
415
- _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];
416
347
  }
417
- };
418
- this.scrollToIndex = function (index, _temp2) {
419
- let {
420
- align = 'auto',
421
- ...rest
422
- } = _temp2 === void 0 ? {} : _temp2;
423
- _this.pendingScrollToIndexCallback = null;
424
- const measurements = _this.getMeasurements();
425
- const offset = _this.scrollOffset;
426
- const size = _this.getSize();
427
- const {
428
- count
429
- } = _this.options;
430
- const measurement = measurements[Math.max(0, Math.min(index, count - 1))];
431
- if (!measurement) {
432
- return;
348
+ return;
349
+ }
350
+ if (!prevNode || prevNode !== node) {
351
+ if (prevNode) {
352
+ ro == null ? void 0 : ro.unobserve(prevNode);
433
353
  }
434
- if (align === 'auto') {
435
- if (measurement.end >= offset + size - _this.options.scrollPaddingEnd) {
436
- align = 'end';
437
- } else if (measurement.start <= offset + _this.options.scrollPaddingStart) {
438
- align = 'start';
439
- } else {
440
- 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);
441
365
  }
366
+ _this._scrollToOffset(_this.scrollOffset, {
367
+ adjustments: _this.scrollAdjustments += delta,
368
+ behavior: undefined,
369
+ sync: false
370
+ });
442
371
  }
443
- const toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
444
- _this.scrollToOffset(toOffset, {
445
- align,
446
- ...rest
447
- });
448
- const isDynamic = Object.keys(_this.measureElementCache).length > 0;
449
- if (isDynamic) {
450
- const didSeen = () => typeof _this.itemMeasurementsCache[_this.options.getItemKey(index)] === 'number';
451
- if (!didSeen()) {
452
- _this.pendingScrollToIndexCallback = () => {
453
- if (didSeen()) {
454
- _this.pendingScrollToIndexCallback = null;
455
- _this.scrollToIndex(index, {
456
- align,
457
- ...rest
458
- });
459
- }
460
- };
461
- }
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';
462
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
463
429
  };
464
- this.getTotalSize = () => {
465
- var _this$getMeasurements;
466
- return (((_this$getMeasurements = this.getMeasurements()[this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || this.options.paddingStart) + this.options.paddingEnd;
467
- };
468
- this._scrollToOffset = (offset, _ref4) => {
469
- let {
470
- adjustments,
471
- behavior,
472
- sync
473
- } = _ref4;
474
- this.options.scrollToFn(offset, {
475
- behavior,
476
- sync,
477
- adjustments
478
- }, 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);
479
458
  };
480
- this.measure = () => {
481
- this.itemMeasurementsCache = {};
482
- 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
483
467
  };
484
- this.setOptions(_opts);
485
- this.scrollRect = this.options.initialRect;
486
- this.scrollOffset = this.options.initialOffset;
487
- this.calculateRange();
488
- }
489
- }
490
- 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) {
491
510
  while (low <= high) {
492
- const middle = (low + high) / 2 | 0;
493
- const currentValue = getCurrentValue(middle);
511
+ var middle = (low + high) / 2 | 0;
512
+ var currentValue = getCurrentValue(middle);
494
513
  if (currentValue < value) {
495
514
  low = middle + 1;
496
515
  } else if (currentValue > value) {
@@ -505,22 +524,22 @@ const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
505
524
  return 0;
506
525
  }
507
526
  };
508
- function calculateRange(_ref5) {
509
- let {
510
- measurements,
511
- outerSize,
512
- scrollOffset
513
- } = _ref5;
514
- const count = measurements.length - 1;
515
- const getOffset = index => measurements[index].start;
516
- const startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
517
- 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;
518
537
  while (endIndex < count && measurements[endIndex].end < scrollOffset + outerSize) {
519
538
  endIndex++;
520
539
  }
521
540
  return {
522
- startIndex,
523
- endIndex
541
+ startIndex: startIndex,
542
+ endIndex: endIndex
524
543
  };
525
544
  }
526
545