@humanspeak/svelte-virtual-list 0.3.11 → 0.3.13

package/dist/SvelteVirtualList.svelte

@@ -647,8 +647,15 @@
             lastMeasuredIndex,
             heightManager.averageHeight,
             (result) => {
-                // Critical updates that must trigger reactive effects immediately
-                heightManager.itemHeight = result.newHeight
+                // Only update the estimated item height from statistically meaningful
+                // samples. With _measuredCount === 0 (browser path), the formula
+                // _totalHeight = _itemLength × _itemHeight means a single expanded
+                // accordion item (e.g., 117px) would balloon _totalHeight from
+                // 49,000 to 117,000px — a visible flash. Requiring ≥ 2 valid
+                // measurements prevents single-item outliers from swinging the estimate.
+                if (result.newValidCount !== 1) {
+                    heightManager.itemHeight = result.newHeight
+                }
                 lastMeasuredIndex = result.newLastMeasuredIndex
 
                 // Update manager totals/cache before any scroll correction logic relies on them
@@ -697,7 +704,7 @@
                 })
                 heightManager.endDynamicUpdate()
             },
-            lastMeasuredIndex < 0 ? 0 : 100, // debounceTime (no debounce on first pass)
+            lastMeasuredIndex < 0 || dirtyItems.size > 0 ? 0 : 100, // debounceTime (no debounce on first pass or when dirty items exist)
             dirtyItems, // Pass dirty items for processing
             0, // Don't pass ReactiveListManager state - let each system manage its own totals
             0, // Don't pass ReactiveListManager state - let each system manage its own totals
@@ -1616,6 +1623,7 @@
         class={viewportClass ?? 'virtual-list-viewport'}
         bind:this={heightManager.viewportElement}
         onscroll={handleScroll}
+        style:overflow-anchor="none"
     >
         <!-- Content provides full scrollable height -->
         <div

package/dist/reactive-list-manager/ReactiveListManager.svelte.d.ts

@@ -126,20 +126,24 @@ export declare class ReactiveListManager {
      */
     get isDynamicUpdateInProgress(): boolean;
     /**
-     * Begin a dynamic update. Handles nested calls: the first call disables UA scroll anchoring,
-     * subsequent calls just increment depth. Safe to call when not wired; styles are only toggled
-     * when both container and viewport are ready.
+     * Begin a dynamic update. Handles nested calls: the first call ensures UA scroll anchoring
+     * is disabled, subsequent calls just increment depth. Safe to call when not wired; styles
+     * are only set when both container and viewport are ready.
+     *
+     * Note: overflow-anchor is kept permanently as 'none' to prevent browser scroll anchoring
+     * from interfering with the virtual list's own scroll correction logic.
      */
     startDynamicUpdate(): void;
     /**
      * End a dynamic update started by `startDynamicUpdate`. Handles nesting: only the final
-     * corresponding end call re-enables UA scroll anchoring. Guards against underflow.
+     * corresponding end call completes the update. overflow-anchor remains 'none' permanently.
+     * Guards against underflow.
      */
     endDynamicUpdate(): void;
     /**
-     * Run a dynamic update with UA scroll anchoring disabled, then restore it.
-     * Accepts a sync or async function and ensures `overflow-anchor` is toggled
-     * around the operation. If the manager isn't ready yet, it simply executes `fn`.
+     * Run a dynamic update with UA scroll anchoring disabled.
+     * Accepts a sync or async function and ensures `overflow-anchor` stays 'none'
+     * throughout. If the manager isn't ready yet, it simply executes `fn`.
      */
     runDynamicUpdate<T>(fn: () => T | Promise<T>): Promise<T>;
     /**

package/dist/reactive-list-manager/ReactiveListManager.svelte.js

@@ -241,9 +241,12 @@ export class ReactiveListManager {
         return this._dynamicUpdateDepth > 0;
     }
     /**
-     * Begin a dynamic update. Handles nested calls: the first call disables UA scroll anchoring,
-     * subsequent calls just increment depth. Safe to call when not wired; styles are only toggled
-     * when both container and viewport are ready.
+     * Begin a dynamic update. Handles nested calls: the first call ensures UA scroll anchoring
+     * is disabled, subsequent calls just increment depth. Safe to call when not wired; styles
+     * are only set when both container and viewport are ready.
+     *
+     * Note: overflow-anchor is kept permanently as 'none' to prevent browser scroll anchoring
+     * from interfering with the virtual list's own scroll correction logic.
      */
     startDynamicUpdate() {
         const isOuter = this._dynamicUpdateDepth === 0;
@@ -257,7 +260,8 @@ export class ReactiveListManager {
     }
     /**
      * End a dynamic update started by `startDynamicUpdate`. Handles nesting: only the final
-     * corresponding end call re-enables UA scroll anchoring. Guards against underflow.
+     * corresponding end call completes the update. overflow-anchor remains 'none' permanently.
+     * Guards against underflow.
      */
     endDynamicUpdate() {
         if (this._dynamicUpdateDepth <= 0) {
@@ -266,16 +270,16 @@ export class ReactiveListManager {
         this._dynamicUpdateDepth -= 1;
         if (this._dynamicUpdateDepth === 0) {
             if (this._isReady && this._viewportElement) {
-                this._viewportElement.style.setProperty('overflow-anchor', 'auto');
+                this._viewportElement.style.setProperty('overflow-anchor', 'none');
             }
             this._dynamicUpdateInProgress = false;
             this._scheduler.unblock();
         }
     }
     /**
-     * Run a dynamic update with UA scroll anchoring disabled, then restore it.
-     * Accepts a sync or async function and ensures `overflow-anchor` is toggled
-     * around the operation. If the manager isn't ready yet, it simply executes `fn`.
+     * Run a dynamic update with UA scroll anchoring disabled.
+     * Accepts a sync or async function and ensures `overflow-anchor` stays 'none'
+     * throughout. If the manager isn't ready yet, it simply executes `fn`.
      */
     async runDynamicUpdate(fn) {
         this.startDynamicUpdate();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@humanspeak/svelte-virtual-list",
-  "version": "0.3.11",
+  "version": "0.3.13",
   "description": "A lightweight, high-performance virtual list component for Svelte 5 that renders large datasets with minimal memory usage. Features include dynamic height support, smooth scrolling, TypeScript support, and efficient DOM recycling. Ideal for infinite scrolling lists, data tables, chat interfaces, and any application requiring the rendering of thousands of items without compromising performance. Zero dependencies and fully customizable.",
   "keywords": [
     "svelte",
@@ -62,6 +62,7 @@
     "@eslint/compat": "^2.0.2",
     "@eslint/js": "^10.0.1",
     "@faker-js/faker": "^10.3.0",
+    "@playwright/cli": "^0.1.1",
     "@playwright/test": "^1.58.2",
     "@sveltejs/adapter-auto": "^7.0.1",
     "@sveltejs/kit": "^2.52.0",
@@ -72,8 +73,8 @@
     "@testing-library/svelte": "^5.3.1",
     "@testing-library/user-event": "^14.6.1",
     "@types/node": "^25.2.3",
-    "@typescript-eslint/eslint-plugin": "^8.55.0",
-    "@typescript-eslint/parser": "^8.55.0",
+    "@typescript-eslint/eslint-plugin": "^8.56.0",
+    "@typescript-eslint/parser": "^8.56.0",
     "@vitest/coverage-v8": "^4.0.18",
     "concurrently": "^9.2.1",
     "eslint": "^10.0.0",
@@ -95,7 +96,7 @@
     "tailwindcss": "^4.1.18",
     "tw-animate-css": "^1.4.0",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.55.0",
+    "typescript-eslint": "^8.56.0",
     "vite": "^7.3.1",
     "vitest": "^4.0.18"
   },