@tanstack/virtual-core 3.0.0-beta.30 → 3.0.0-beta.33

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];
93
- cb(Math.max(0, offset - instance.options.scrollMargin));
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];
98
+ cb(offset);
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,407 @@ 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 _ref$adjustments = _ref.adjustments,
128
+ adjustments = _ref$adjustments === void 0 ? 0 : _ref$adjustments,
129
+ behavior = _ref.behavior;
130
+ var toOffset = offset + adjustments;
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 _ref2$adjustments = _ref2.adjustments,
136
+ adjustments = _ref2$adjustments === void 0 ? 0 : _ref2$adjustments,
137
+ behavior = _ref2.behavior;
138
+ var toOffset = offset + adjustments;
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.itemSizeCache = {};
149
+ this.pendingMeasuredCacheIndexes = [];
150
+ this.scrollDirection = null;
151
+ this.scrollAdjustments = 0;
152
+ this.measureElementCache = {};
153
+ this.pendingScrollToIndexCallback = null;
154
+ this.getResizeObserver = function () {
155
+ var _ro = null;
156
+ return function () {
157
+ if (_ro) {
158
+ return _ro;
159
+ } else if (typeof ResizeObserver !== 'undefined') {
160
+ return _ro = new ResizeObserver(function (entries) {
161
+ entries.forEach(function (entry) {
162
+ _this._measureElement(entry.target, false);
169
163
  });
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
164
  });
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();
165
+ } else {
166
+ return null;
264
167
  }
265
168
  };
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
169
+ }();
170
+ this.range = {
171
+ startIndex: 0,
172
+ endIndex: 0
173
+ };
174
+ this.setOptions = function (opts) {
175
+ Object.entries(opts).forEach(function (_ref3) {
176
+ var key = _ref3[0],
177
+ value = _ref3[1];
178
+ if (typeof value === 'undefined') delete opts[key];
292
179
  });
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
180
+ _this.options = _rollupPluginBabelHelpers["extends"]({
181
+ debug: false,
182
+ initialOffset: 0,
183
+ overscan: 1,
184
+ paddingStart: 0,
185
+ paddingEnd: 0,
186
+ scrollPaddingStart: 0,
187
+ scrollPaddingEnd: 0,
188
+ horizontal: false,
189
+ getItemKey: defaultKeyExtractor,
190
+ rangeExtractor: defaultRangeExtractor,
191
+ onChange: function onChange() {},
192
+ measureElement: measureElement,
193
+ initialRect: {
194
+ width: 0,
195
+ height: 0
196
+ },
197
+ scrollMargin: 0,
198
+ scrollingDelay: 150,
199
+ indexAttribute: 'data-index',
200
+ initialMeasurementsCache: []
201
+ }, opts);
202
+ };
203
+ this.notify = function () {
204
+ _this.options.onChange == null ? void 0 : _this.options.onChange(_this);
205
+ };
206
+ this.cleanup = function () {
207
+ _this.unsubs.filter(Boolean).forEach(function (d) {
208
+ return d();
307
209
  });
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
210
+ _this.unsubs = [];
211
+ _this.scrollElement = null;
212
+ };
213
+ this._didMount = function () {
214
+ var ro = _this.getResizeObserver();
215
+ Object.values(_this.measureElementCache).forEach(function (node) {
216
+ return ro == null ? void 0 : ro.observe(node);
317
217
  });
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);
218
+ return function () {
219
+ ro == null ? void 0 : ro.disconnect();
220
+ _this.cleanup();
326
221
  };
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];
222
+ };
223
+ this._willUpdate = function () {
224
+ _this.pendingScrollToIndexCallback == null ? void 0 : _this.pendingScrollToIndexCallback();
225
+ var scrollElement = _this.options.getScrollElement();
226
+ if (_this.scrollElement !== scrollElement) {
227
+ _this.cleanup();
228
+ _this.scrollElement = scrollElement;
229
+ _this._scrollToOffset(_this.scrollOffset, {
230
+ adjustments: undefined,
231
+ behavior: undefined
232
+ });
233
+ _this.unsubs.push(_this.options.observeElementRect(_this, function (rect) {
234
+ _this.scrollRect = rect;
235
+ _this.calculateRange();
236
+ }));
237
+ _this.unsubs.push(_this.options.observeElementOffset(_this, function (offset) {
238
+ _this.scrollAdjustments = 0;
239
+ if (_this.scrollOffset === offset) {
240
+ return;
339
241
  }
340
- return;
341
- }
342
- if (!prevNode || prevNode !== node) {
343
- if (prevNode) {
344
- ro == null ? void 0 : ro.unobserve(prevNode);
242
+ if (_this.isScrollingTimeoutId !== null) {
243
+ clearTimeout(_this.isScrollingTimeoutId);
244
+ _this.isScrollingTimeoutId = null;
345
245
  }
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);
246
+ var onIsScrollingChange = function onIsScrollingChange(isScrolling) {
247
+ if (_this.isScrolling !== isScrolling) {
248
+ _this.isScrolling = isScrolling;
249
+ _this.notify();
356
250
  }
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
251
  };
368
- this.notify();
369
- }
370
- };
371
- this.measureElement = node => {
372
- if (!node) {
373
- return;
252
+ _this.scrollDirection = _this.scrollOffset < offset ? 'forward' : 'backward';
253
+ _this.scrollOffset = offset;
254
+ _this.calculateRange();
255
+ onIsScrollingChange(true);
256
+ _this.isScrollingTimeoutId = setTimeout(function () {
257
+ _this.isScrollingTimeoutId = null;
258
+ _this.scrollDirection = null;
259
+ onIsScrollingChange(false);
260
+ }, _this.options.scrollingDelay);
261
+ }));
262
+ } else if (!_this.isScrolling) {
263
+ _this.calculateRange();
264
+ }
265
+ };
266
+ this.getSize = function () {
267
+ return _this.scrollRect[_this.options.horizontal ? 'width' : 'height'];
268
+ };
269
+ this.getMeasurements = utils.memo(function () {
270
+ return [_this.options.count, _this.options.paddingStart, _this.options.scrollMargin, _this.options.getItemKey, _this.itemSizeCache];
271
+ }, function (count, paddingStart, scrollMargin, getItemKey, itemSizeCache) {
272
+ var min = _this.pendingMeasuredCacheIndexes.length > 0 ? Math.min.apply(Math, _this.pendingMeasuredCacheIndexes) : 0;
273
+ _this.pendingMeasuredCacheIndexes = [];
274
+ var measurements = _this.measurementsCache.slice(0, min);
275
+ for (var _i2 = min; _i2 < count; _i2++) {
276
+ var key = getItemKey(_i2);
277
+ var measuredSize = itemSizeCache[key];
278
+ var start = measurements[_i2 - 1] ? measurements[_i2 - 1].end : paddingStart + scrollMargin;
279
+ var size = typeof measuredSize === 'number' ? measuredSize : _this.options.estimateSize(_i2);
280
+ var end = start + size;
281
+ measurements[_i2] = {
282
+ index: _i2,
283
+ start: start,
284
+ size: size,
285
+ end: end,
286
+ key: key
287
+ };
288
+ }
289
+ _this.measurementsCache = measurements;
290
+ return measurements;
291
+ }, {
292
+ key: process.env.NODE_ENV !== 'production' && 'getMeasurements',
293
+ debug: function debug() {
294
+ return _this.options.debug;
295
+ }
296
+ });
297
+ this.calculateRange = utils.memo(function () {
298
+ return [_this.getMeasurements(), _this.getSize(), _this.scrollOffset];
299
+ }, function (measurements, outerSize, scrollOffset) {
300
+ var range = calculateRange({
301
+ measurements: measurements,
302
+ outerSize: outerSize,
303
+ scrollOffset: scrollOffset
304
+ });
305
+ if (range.startIndex !== _this.range.startIndex || range.endIndex !== _this.range.endIndex) {
306
+ _this.range = range;
307
+ _this.notify();
308
+ }
309
+ return _this.range;
310
+ }, {
311
+ key: process.env.NODE_ENV !== 'production' && 'calculateRange',
312
+ debug: function debug() {
313
+ return _this.options.debug;
314
+ }
315
+ });
316
+ this.getIndexes = utils.memo(function () {
317
+ return [_this.options.rangeExtractor, _this.range, _this.options.overscan, _this.options.count];
318
+ }, function (rangeExtractor, range, overscan, count) {
319
+ return rangeExtractor(_rollupPluginBabelHelpers["extends"]({}, range, {
320
+ overscan: overscan,
321
+ count: count
322
+ }));
323
+ }, {
324
+ key: process.env.NODE_ENV !== 'production' && 'getIndexes',
325
+ debug: function debug() {
326
+ return _this.options.debug;
327
+ }
328
+ });
329
+ this.indexFromElement = function (node) {
330
+ var attributeName = _this.options.indexAttribute;
331
+ var indexStr = node.getAttribute(attributeName);
332
+ if (!indexStr) {
333
+ console.warn("Missing attribute name '" + attributeName + "={index}' on measured element.");
334
+ return -1;
335
+ }
336
+ return parseInt(indexStr, 10);
337
+ };
338
+ this._measureElement = function (node, _sync) {
339
+ var _this$itemSizeCache$i;
340
+ var index = _this.indexFromElement(node);
341
+ var item = _this.measurementsCache[index];
342
+ if (!item) {
343
+ return;
344
+ }
345
+ var prevNode = _this.measureElementCache[item.key];
346
+ var ro = _this.getResizeObserver();
347
+ if (!node.isConnected) {
348
+ if (prevNode) {
349
+ ro == null ? void 0 : ro.unobserve(prevNode);
350
+ delete _this.measureElementCache[item.key];
374
351
  }
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);
352
+ return;
353
+ }
354
+ if (!prevNode || prevNode !== node) {
355
+ if (prevNode) {
356
+ ro == null ? void 0 : ro.unobserve(prevNode);
383
357
  }
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';
358
+ _this.measureElementCache[item.key] = node;
359
+ ro == null ? void 0 : ro.observe(node);
360
+ }
361
+ var measuredItemSize = _this.options.measureElement(node, _this);
362
+ var itemSize = (_this$itemSizeCache$i = _this.itemSizeCache[item.key]) != null ? _this$itemSizeCache$i : item.size;
363
+ var delta = measuredItemSize - itemSize;
364
+ if (delta !== 0) {
365
+ var _extends2;
366
+ if (item.start < _this.scrollOffset && _this.isScrolling && _this.scrollDirection === 'backward') {
367
+ if (process.env.NODE_ENV !== 'production' && _this.options.debug) {
368
+ console.info('correction', delta);
403
369
  }
370
+ _this._scrollToOffset(_this.scrollOffset, {
371
+ adjustments: _this.scrollAdjustments += delta,
372
+ behavior: undefined
373
+ });
404
374
  }
405
- const options = {
406
- adjustments: undefined,
407
- behavior,
408
- sync: false
409
- };
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);
375
+ _this.pendingMeasuredCacheIndexes.push(index);
376
+ _this.itemSizeCache = _rollupPluginBabelHelpers["extends"]({}, _this.itemSizeCache, (_extends2 = {}, _extends2[item.key] = measuredItemSize, _extends2));
377
+ _this.notify();
378
+ }
379
+ };
380
+ this.measureElement = function (node) {
381
+ if (!node) {
382
+ return;
383
+ }
384
+ _this._measureElement(node, true);
385
+ };
386
+ this.getVirtualItems = utils.memo(function () {
387
+ return [_this.getIndexes(), _this.getMeasurements()];
388
+ }, function (indexes, measurements) {
389
+ var virtualItems = [];
390
+ for (var k = 0, len = indexes.length; k < len; k++) {
391
+ var _i3 = indexes[k];
392
+ var measurement = measurements[_i3];
393
+ virtualItems.push(measurement);
394
+ }
395
+ return virtualItems;
396
+ }, {
397
+ key: process.env.NODE_ENV !== 'production' && 'getIndexes',
398
+ debug: function debug() {
399
+ return _this.options.debug;
400
+ }
401
+ });
402
+ this.getOffsetForAlignment = function (toOffset, align) {
403
+ var offset = _this.scrollOffset;
404
+ var size = _this.getSize();
405
+ if (align === 'auto') {
406
+ if (toOffset <= offset) {
407
+ align = 'start';
408
+ } else if (toOffset >= offset + size) {
409
+ align = 'end';
410
+ } else {
411
+ align = 'start';
416
412
  }
413
+ }
414
+ if (align === 'start') {
415
+ return toOffset;
416
+ } else if (align === 'end') {
417
+ return toOffset - size;
418
+ } else if (align === 'center') {
419
+ return toOffset - size / 2;
420
+ }
421
+ return toOffset;
422
+ };
423
+ this.scrollToOffset = function (toOffset, _temp) {
424
+ var _ref4 = _temp === void 0 ? {} : _temp,
425
+ _ref4$align = _ref4.align,
426
+ align = _ref4$align === void 0 ? 'start' : _ref4$align,
427
+ behavior = _ref4.behavior;
428
+ var options = {
429
+ adjustments: undefined,
430
+ behavior: behavior,
431
+ sync: false
417
432
  };
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) {
433
+ _this._scrollToOffset(_this.getOffsetForAlignment(toOffset, align), options);
434
+ };
435
+ this.scrollToIndex = function (index, _temp2) {
436
+ var _ref5 = _temp2 === void 0 ? {} : _temp2,
437
+ _ref5$align = _ref5.align,
438
+ align = _ref5$align === void 0 ? 'auto' : _ref5$align,
439
+ behavior = _ref5.behavior;
440
+ _this.pendingScrollToIndexCallback = null;
441
+ var offset = _this.scrollOffset;
442
+ var size = _this.getSize();
443
+ var count = _this.options.count;
444
+ var measurements = _this.getMeasurements();
445
+ var measurement = measurements[Math.max(0, Math.min(index, count - 1))];
446
+ if (!measurement) {
447
+ throw new Error("VirtualItem not found for index = " + index);
448
+ }
449
+ if (align === 'auto') {
450
+ if (measurement.end >= offset + size - _this.options.scrollPaddingEnd) {
451
+ align = 'end';
452
+ } else if (measurement.start <= offset + _this.options.scrollPaddingStart) {
453
+ align = 'start';
454
+ } else {
432
455
  return;
433
456
  }
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;
441
- }
442
- }
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
- }
462
- }
463
- };
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);
457
+ }
458
+ var getOffsetForIndexAndAlignment = function getOffsetForIndexAndAlignment(measurement) {
459
+ var toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
460
+ return _this.getOffsetForAlignment(toOffset, align);
479
461
  };
480
- this.measure = () => {
481
- this.itemMeasurementsCache = {};
482
- this.notify();
462
+ var toOffset = getOffsetForIndexAndAlignment(measurement);
463
+ if (toOffset === offset) {
464
+ return;
465
+ }
466
+ var options = {
467
+ adjustments: undefined,
468
+ behavior: behavior
483
469
  };
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) => {
470
+ _this._scrollToOffset(toOffset, options);
471
+ var isDynamic = Object.keys(_this.measureElementCache).length > 0;
472
+ if (isDynamic) {
473
+ _this.pendingScrollToIndexCallback = function () {
474
+ _this.scrollToIndex(index, {
475
+ align: align,
476
+ behavior: behavior
477
+ });
478
+ };
479
+ }
480
+ };
481
+ this.scrollBy = function (adjustments, options) {
482
+ _this._scrollToOffset(_this.scrollOffset, {
483
+ adjustments: adjustments,
484
+ behavior: options == null ? void 0 : options.behavior
485
+ });
486
+ };
487
+ this.getTotalSize = function () {
488
+ var _this$getMeasurements;
489
+ return (((_this$getMeasurements = _this.getMeasurements()[_this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || _this.options.paddingStart) - _this.options.scrollMargin + _this.options.paddingEnd;
490
+ };
491
+ this._scrollToOffset = function (offset, _ref6) {
492
+ var adjustments = _ref6.adjustments,
493
+ behavior = _ref6.behavior;
494
+ _this.options.scrollToFn(offset, {
495
+ behavior: behavior,
496
+ adjustments: adjustments
497
+ }, _this);
498
+ };
499
+ this.measure = function () {
500
+ _this.itemSizeCache = {};
501
+ _this.notify();
502
+ };
503
+ this.setOptions(_opts);
504
+ this.scrollRect = this.options.initialRect;
505
+ this.scrollOffset = this.options.initialOffset;
506
+ this.measurementsCache = this.options.initialMeasurementsCache;
507
+ this.measurementsCache.forEach(function (item) {
508
+ _this.itemSizeCache[item.key] = item.size;
509
+ });
510
+ this.calculateRange();
511
+ };
512
+ var findNearestBinarySearch = function findNearestBinarySearch(low, high, getCurrentValue, value) {
491
513
  while (low <= high) {
492
- const middle = (low + high) / 2 | 0;
493
- const currentValue = getCurrentValue(middle);
514
+ var middle = (low + high) / 2 | 0;
515
+ var currentValue = getCurrentValue(middle);
494
516
  if (currentValue < value) {
495
517
  low = middle + 1;
496
518
  } else if (currentValue > value) {
@@ -505,22 +527,22 @@ const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
505
527
  return 0;
506
528
  }
507
529
  };
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;
530
+ function calculateRange(_ref7) {
531
+ var measurements = _ref7.measurements,
532
+ outerSize = _ref7.outerSize,
533
+ scrollOffset = _ref7.scrollOffset;
534
+ var count = measurements.length - 1;
535
+ var getOffset = function getOffset(index) {
536
+ return measurements[index].start;
537
+ };
538
+ var startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
539
+ var endIndex = startIndex;
518
540
  while (endIndex < count && measurements[endIndex].end < scrollOffset + outerSize) {
519
541
  endIndex++;
520
542
  }
521
543
  return {
522
- startIndex,
523
- endIndex
544
+ startIndex: startIndex,
545
+ endIndex: endIndex
524
546
  };
525
547
  }
526
548