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

package/src/index.ts

@@ -289,7 +289,7 @@ export class Virtualizer<
   private itemMeasurementsCache: Record<Key, number> = {}
   private pendingMeasuredCacheIndexes: number[] = []
   private scrollRect: Rect
-  private scrollOffset: number
+  scrollOffset: number
   private scrollAdjustments: number = 0
   private measureElementCache: Record<Key, TItemElement> = {}
   private pendingScrollToIndexCallback: (() => void) | null = null
@@ -400,23 +400,26 @@ export class Virtualizer<
             this.isScrollingTimeoutId = null
           }
 
-          if (this.scrollOffset !== offset) {
-            this.scrollOffset = offset
-            this.isScrolling = true
-            this.scrollAdjustments = 0
+          const onIsScrollingChange = (isScrolling: boolean) => {
+            if (this.isScrolling !== isScrolling) {
+              this.isScrolling = isScrolling
+              this.notify()
+            }
+          }
 
-            this.isScrollingTimeoutId = setTimeout(() => {
-              this.isScrollingTimeoutId = null
-              this.isScrolling = false
+          this.scrollAdjustments = 0
 
-              this.notify()
-            }, this.options.scrollingDelay)
-          } else {
-            this.isScrolling = false
-            this.scrollAdjustments = 0
+          if (this.scrollOffset !== offset) {
+            this.scrollOffset = offset
+            onIsScrollingChange(true)
           }
 
           this.calculateRange()
+
+          this.isScrollingTimeoutId = setTimeout(() => {
+            this.isScrollingTimeoutId = null
+            onIsScrollingChange(false)
+          }, this.options.scrollingDelay)
         }),
       )
     } else if (!this.isScrolling) {
@@ -608,10 +611,7 @@ export class Virtualizer<
     },
   )
 
-  scrollToOffset = (
-    toOffset: number,
-    { align = 'start', behavior }: ScrollToOffsetOptions = {},
-  ) => {
+  getOffsetForAlignment = (toOffset: number, align: ScrollAlignment) => {
     const offset = this.scrollOffset
     const size = this.getSize()
 
@@ -625,35 +625,43 @@ export class Virtualizer<
       }
     }
 
+    if (align === 'start') {
+      return toOffset
+    } else if (align === 'end') {
+      return toOffset - size
+    } else if (align === 'center') {
+      return toOffset - size / 2
+    }
+    return toOffset
+  }
+
+  scrollToOffset = (
+    toOffset: number,
+    { align = 'start', behavior }: ScrollToOffsetOptions = {},
+  ) => {
     const options = {
       adjustments: undefined,
       behavior,
       sync: false,
     }
-    if (align === 'start') {
-      this._scrollToOffset(toOffset, options)
-    } else if (align === 'end') {
-      this._scrollToOffset(toOffset - size, options)
-    } else if (align === 'center') {
-      this._scrollToOffset(toOffset - size / 2, options)
-    }
+    this._scrollToOffset(this.getOffsetForAlignment(toOffset, align), options)
   }
 
   scrollToIndex = (
     index: number,
-    { align = 'auto', ...rest }: ScrollToIndexOptions = {},
+    { align = 'auto', behavior }: ScrollToIndexOptions = {},
   ) => {
     this.pendingScrollToIndexCallback = null
 
-    const measurements = this.getMeasurements()
     const offset = this.scrollOffset
     const size = this.getSize()
     const { count } = this.options
 
+    const measurements = this.getMeasurements()
     const measurement = measurements[Math.max(0, Math.min(index, count - 1))]
 
     if (!measurement) {
-      return
+      throw new Error(`VirtualItem not found for index = ${index}`)
     }
 
     if (align === 'auto') {
@@ -669,31 +677,45 @@ export class Virtualizer<
       }
     }
 
-    const toOffset =
-      align === 'end'
-        ? measurement.end + this.options.scrollPaddingEnd
-        : measurement.start - this.options.scrollPaddingStart
+    const getOffsetForIndexAndAlignment = (measurement: VirtualItem) => {
+      const toOffset =
+        align === 'end'
+          ? measurement.end + this.options.scrollPaddingEnd
+          : measurement.start - this.options.scrollPaddingStart
+
+      return this.getOffsetForAlignment(toOffset, align)
+    }
+
+    const toOffset = getOffsetForIndexAndAlignment(measurement)
+
+    if (toOffset === offset) {
+      return
+    }
 
-    this.scrollToOffset(toOffset, { align, ...rest })
+    const options = {
+      adjustments: undefined,
+      behavior,
+      sync: false,
+    }
+    this._scrollToOffset(toOffset, options)
 
     const isDynamic = Object.keys(this.measureElementCache).length > 0
 
     if (isDynamic) {
-      const didSeen = () =>
-        typeof this.itemMeasurementsCache[this.options.getItemKey(index)] ===
-        'number'
-
-      if (!didSeen()) {
-        this.pendingScrollToIndexCallback = () => {
-          if (didSeen()) {
-            this.pendingScrollToIndexCallback = null
-            this.scrollToIndex(index, { align, ...rest })
-          }
-        }
+      this.pendingScrollToIndexCallback = () => {
+        this.scrollToIndex(index, { align, behavior })
       }
     }
   }
 
+  scrollBy = (adjustments: number, options?: { behavior: ScrollBehavior }) => {
+    this._scrollToOffset(this.scrollOffset, {
+      adjustments,
+      behavior: options?.behavior,
+      sync: false,
+    })
+  }
+
   getTotalSize = () =>
     (this.getMeasurements()[this.options.count - 1]?.end ||
       this.options.paddingStart) + this.options.paddingEnd