@tanstack/virtual-core - npm Package Compare versions

Comparing version 3.5.0 to 3.5.1

dist/esm/index.d.ts

@@ -79,2 +79,3 @@ export * from './utils.js';
     scrollElement: TScrollElement | null;
+    targetWindow: (Window & typeof globalThis) | null;
     isScrolling: boolean;
@@ -81,0 +82,0 @@ private scrollToIndexTimeoutId;

dist/esm/index.js

@@ -17,2 +17,6 @@ import { debounce, memo, notUndefined, approxEqual } from "./utils.js";
   }
+  const targetWindow = instance.targetWindow;
+  if (!targetWindow) {
+    return;
+  }
   const handler = (rect) => {
@@ -23,7 +27,7 @@ const { width, height } = rect;
   handler(element.getBoundingClientRect());
-  if (typeof ResizeObserver === "undefined") {
+  if (!targetWindow.ResizeObserver) {
     return () => {
     };
   }
-  const observer = new ResizeObserver((entries) => {
+  const observer = new targetWindow.ResizeObserver((entries) => {
     const entry = entries[0];
@@ -67,6 +71,14 @@ if (entry == null ? void 0 : entry.borderBoxSize) {
   }
+  const targetWindow = instance.targetWindow;
+  if (!targetWindow) {
+    return;
+  }
   let offset = 0;
-  const fallback = supportsScrollend ? () => void 0 : debounce(() => {
-    cb(offset, false);
-  }, instance.options.isScrollingResetDelay);
+  const fallback = supportsScrollend ? () => void 0 : debounce(
+    targetWindow,
+    () => {
+      cb(offset, false);
+    },
+    instance.options.isScrollingResetDelay
+  );
   const createHandler = (isScrolling) => () => {
@@ -92,6 +104,14 @@ offset = element[instance.options.horizontal ? "scrollLeft" : "scrollTop"];
   }
+  const targetWindow = instance.targetWindow;
+  if (!targetWindow) {
+    return;
+  }
   let offset = 0;
-  const fallback = supportsScrollend ? () => void 0 : debounce(() => {
-    cb(offset, false);
-  }, instance.options.isScrollingResetDelay);
+  const fallback = supportsScrollend ? () => void 0 : debounce(
+    targetWindow,
+    () => {
+      cb(offset, false);
+    },
+    instance.options.isScrollingResetDelay
+  );
   const createHandler = (isScrolling) => () => {
@@ -152,2 +172,3 @@ offset = element[instance.options.horizontal ? "scrollX" : "scrollY"];
     this.scrollElement = null;
+    this.targetWindow = null;
     this.isScrolling = false;
@@ -166,11 +187,11 @@ this.scrollToIndexTimeoutId = null;
           return _ro;
-        } else if (typeof ResizeObserver !== "undefined") {
-          return _ro = new ResizeObserver((entries) => {
-            entries.forEach((entry) => {
-              this._measureElement(entry.target, entry);
-            });
-          });
-        } else {
+        }
+        if (!this.targetWindow || !this.targetWindow.ResizeObserver) {
           return null;
         }
+        return _ro = new this.targetWindow.ResizeObserver((entries) => {
+          entries.forEach((entry) => {
+            this._measureElement(entry.target, entry);
+          });
+        });
       };
@@ -246,2 +267,3 @@ return {
     this._willUpdate = () => {
+      var _a;
       const scrollElement = this.options.getScrollElement();
@@ -251,2 +273,7 @@ if (this.scrollElement !== scrollElement) {
         this.scrollElement = scrollElement;
+        if (this.scrollElement && "ownerDocument" in this.scrollElement) {
+          this.targetWindow = this.scrollElement.ownerDocument.defaultView;
+        } else {
+          this.targetWindow = ((_a = this.scrollElement) == null ? void 0 : _a.window) ?? null;
+        }
         this._scrollToOffset(this.scrollOffset, {
@@ -513,4 +540,4 @@ adjustments: void 0,
     this.cancelScrollToIndex = () => {
-      if (this.scrollToIndexTimeoutId !== null) {
-        clearTimeout(this.scrollToIndexTimeoutId);
+      if (this.scrollToIndexTimeoutId !== null && this.targetWindow) {
+        this.targetWindow.clearTimeout(this.scrollToIndexTimeoutId);
         this.scrollToIndexTimeoutId = null;
@@ -541,4 +568,4 @@ }
       this._scrollToOffset(toOffset, { adjustments: void 0, behavior });
-      if (behavior !== "smooth" && this.isDynamicMode()) {
-        this.scrollToIndexTimeoutId = setTimeout(() => {
+      if (behavior !== "smooth" && this.isDynamicMode() && this.targetWindow) {
+        this.scrollToIndexTimeoutId = this.targetWindow.setTimeout(() => {
           this.scrollToIndexTimeoutId = null;
@@ -545,0 +572,0 @@ const elementInDOM = this.measureElementCache.has(

dist/esm/utils.d.ts

@@ -11,2 +11,2 @@ export type NoInfer<A extends any> = [A][A extends any ? 0 : never];
 export declare const approxEqual: (a: number, b: number) => boolean;
-export declare const debounce: (fn: Function, ms: number) => (this: any, ...args: any[]) => void;
+export declare const debounce: (targetWindow: Window & typeof globalThis, fn: Function, ms: number) => (this: any, ...args: any[]) => void;

dist/esm/utils.js

@@ -54,7 +54,7 @@ function memo(getDeps, fn, opts) {
 const approxEqual = (a, b) => Math.abs(a - b) < 1;
-const debounce = (fn, ms) => {
+const debounce = (targetWindow, fn, ms) => {
   let timeoutId;
   return function(...args) {
-    clearTimeout(timeoutId);
-    timeoutId = setTimeout(() => fn.apply(this, args), ms);
+    targetWindow.clearTimeout(timeoutId);
+    timeoutId = targetWindow.setTimeout(() => fn.apply(this, args), ms);
   };
@@ -61,0 +61,0 @@ };

package.json

 {
   "name": "@tanstack/virtual-core",
-  "version": "3.5.0",
+  "version": "3.5.1",
   "description": "Headless UI for virtualizing scrollable elements in TS/JS + Frameworks",
@@ -5,0 +5,0 @@ "author": "Tanner Linsley",

src/index.ts

@@ -70,2 +70,6 @@ import { approxEqual, memo, notUndefined, debounce } from './utils'
   }
+  const targetWindow = instance.targetWindow
+  if (!targetWindow) {
+    return
+  }
 
@@ -79,7 +83,7 @@ const handler = (rect: Rect) => {
 
-  if (typeof ResizeObserver === 'undefined') {
+  if (!targetWindow.ResizeObserver) {
     return () => {}
   }
 
-  const observer = new ResizeObserver((entries) => {
+  const observer = new targetWindow.ResizeObserver((entries) => {
     const entry = entries[0]
@@ -139,2 +143,6 @@ if (entry?.borderBoxSize) {
   }
+  const targetWindow = instance.targetWindow
+  if (!targetWindow) {
+    return
+  }
 
@@ -144,5 +152,9 @@ let offset = 0
     ? () => undefined
-    : debounce(() => {
-        cb(offset, false)
-      }, instance.options.isScrollingResetDelay)
+    : debounce(
+        targetWindow,
+        () => {
+          cb(offset, false)
+        },
+        instance.options.isScrollingResetDelay,
+      )
 
@@ -175,2 +187,6 @@ const createHandler = (isScrolling: boolean) => () => {
   }
+  const targetWindow = instance.targetWindow
+  if (!targetWindow) {
+    return
+  }
 
@@ -180,5 +196,9 @@ let offset = 0
     ? () => undefined
-    : debounce(() => {
-        cb(offset, false)
-      }, instance.options.isScrollingResetDelay)
+    : debounce(
+        targetWindow,
+        () => {
+          cb(offset, false)
+        },
+        instance.options.isScrollingResetDelay,
+      )
 
@@ -316,4 +336,5 @@ const createHandler = (isScrolling: boolean) => () => {
   scrollElement: TScrollElement | null = null
+  targetWindow: (Window & typeof globalThis) | null = null
   isScrolling: boolean = false
-  private scrollToIndexTimeoutId: ReturnType<typeof setTimeout> | null = null
+  private scrollToIndexTimeoutId: number | null = null
   measurementsCache: VirtualItem[] = []
@@ -340,11 +361,13 @@ private itemSizeCache = new Map<Key, number>()
         return _ro
-      } else if (typeof ResizeObserver !== 'undefined') {
-        return (_ro = new ResizeObserver((entries) => {
-          entries.forEach((entry) => {
-            this._measureElement(entry.target as TItemElement, entry)
-          })
-        }))
-      } else {
+      }
+
+      if (!this.targetWindow || !this.targetWindow.ResizeObserver) {
         return null
       }
+
+      return (_ro = new this.targetWindow.ResizeObserver((entries) => {
+        entries.forEach((entry) => {
+          this._measureElement(entry.target as TItemElement, entry)
+        })
+      }))
     }
@@ -443,2 +466,8 @@
 
+      if (this.scrollElement && 'ownerDocument' in this.scrollElement) {
+        this.targetWindow = this.scrollElement.ownerDocument.defaultView
+      } else {
+        this.targetWindow = this.scrollElement?.window ?? null
+      }
+
       this._scrollToOffset(this.scrollOffset, {
@@ -819,4 +848,4 @@ adjustments: undefined,
   private cancelScrollToIndex = () => {
-    if (this.scrollToIndexTimeoutId !== null) {
-      clearTimeout(this.scrollToIndexTimeoutId)
+    if (this.scrollToIndexTimeoutId !== null && this.targetWindow) {
+      this.targetWindow.clearTimeout(this.scrollToIndexTimeoutId)
       this.scrollToIndexTimeoutId = null
@@ -862,4 +891,4 @@ }
 
-    if (behavior !== 'smooth' && this.isDynamicMode()) {
-      this.scrollToIndexTimeoutId = setTimeout(() => {
+    if (behavior !== 'smooth' && this.isDynamicMode() && this.targetWindow) {
+      this.scrollToIndexTimeoutId = this.targetWindow.setTimeout(() => {
         this.scrollToIndexTimeoutId = null
@@ -866,0 +895,0 @@

src/utils.ts

@@ -81,8 +81,12 @@ export type NoInfer<A extends any> = [A][A extends any ? 0 : never]
 
-export const debounce = (fn: Function, ms: number) => {
-  let timeoutId: ReturnType<typeof setTimeout>
+export const debounce = (
+  targetWindow: Window & typeof globalThis,
+  fn: Function,
+  ms: number,
+) => {
+  let timeoutId: number
   return function (this: any, ...args: any[]) {
-    clearTimeout(timeoutId)
-    timeoutId = setTimeout(() => fn.apply(this, args), ms)
+    targetWindow.clearTimeout(timeoutId)
+    timeoutId = targetWindow.setTimeout(() => fn.apply(this, args), ms)
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

184453

increased by2.8%

Lines of code

2537

increased by3.47%

No dependency changes