@fusion.dev/helix-core 0.211.0 → 0.211.1

package/dist/controllers/virtualize-controller/heights.d.ts

@@ -68,6 +68,15 @@ export declare class Heights {
      * one of them back at the estimate at the moment the reader is looking at them.
      */
     shift(by: number): void;
+    /**
+     * Adds `by` to every height that has been seen, for a gap that changed.
+     *
+     * Each item counts the gap after it as part of its own height, so a gap that
+     * grows by twelve pixels grows every measured item by twelve, the ones no
+     * longer drawn included. The unmeasured ones follow the estimate, which
+     * carries the gap already.
+     */
+    pad(by: number): void;
     /**
      * Drops everything, for a set that is no longer the same set.
      *

package/dist/controllers/virtualize-controller/heights.js

@@ -70,6 +70,16 @@ export class Heights {
         this.dirty = 0;
         this.changes += 1;
     }
+    pad(by) {
+        if (by === 0 || this.seen.size === 0) {
+            return;
+        }
+        for (const [index, size] of this.seen) {
+            this.seen.set(index, Math.max(1, Math.round((size + by) * 64) / 64));
+        }
+        this.dirty = 0;
+        this.changes += 1;
+    }
     forget() {
         this.seen.clear();
         this.dirty = 0;

package/dist/controllers/virtualize-controller/virtualize-controller.d.ts

@@ -172,12 +172,18 @@ export declare class VirtualizeController implements ReactiveController {
     /** Room `shift` added above the window, owed to the scroll offset once drawn. */
     private owed;
     /**
-     * The drawn rows' height on the straight line, read once per estimate.
+     * The drawn rows' own height on the straight line, read once per estimate,
+     * and without the gap, which `line` adds as it is now.
      *
      * Undefined until a host that offers `rows` has drawn some on the uniform
      * path, and again after `forget`.
      */
     private sample;
+    /**
+     * The gap the heights and the line were last squared with, which `line`
+     * reads, so the gap the host has now is taken up in `respace` alone.
+     */
+    private spaced;
     /** The length of the set when `endInSight` last answered true. */
     private askedAt;
     /**
@@ -317,6 +323,24 @@ export declare class VirtualizeController implements ReactiveController {
      * Reading the drawn rows once corrects the slope, and it is still a line.
      */
     private line;
+    /** How tall one item's own row is on the straight line, without the gap. */
+    private row;
+    /**
+     * Moves everything to a gap that changed, and keeps the reader on the item
+     * they were on.
+     *
+     * **Each item counts the gap after it as part of its own height**, so a gap
+     * that changes changes every item. The straight line reads the gap as it is
+     * now, and every height measured with the old one moves by the difference,
+     * drawn or not. Left alone, both kept the old gap while the rows drawn
+     * between the spacers took the new one, so the set grew or shrank as the
+     * window did: in WebKit, End on 1,000 rows whose gap went from 0 to 12 left
+     * the last row 72 pixels below the box once the window lost six rows.
+     *
+     * The reader's place is owed to the scroll offset and written after the
+     * render, as `shift` does, because a gap that grows has no room for it yet.
+     */
+    private respace;
     /** The space the host draws between two items, which each item counts. */
     private gap;
     /**

package/dist/controllers/virtualize-controller/virtualize-controller.js

@@ -154,6 +154,7 @@ export class VirtualizeController {
         this.watch();
         const box = this.options.container();
         const total = Math.max(0, this.options.count());
+        this.respace(box, total);
         const size = this.line();
         if (!box) {
             return;
@@ -196,8 +197,35 @@ export class VirtualizeController {
         return { after: Math.max(0, (total - last) * size), before: first * size, first, last };
     }
     line() {
+        return this.row() + (this.spaced ?? this.gap());
+    }
+    row() {
         const estimate = Math.max(1, this.options.estimate());
-        return this.sample?.estimate === estimate ? this.sample.size : estimate + this.gap();
+        return this.sample?.estimate === estimate ? this.sample.size : estimate;
+    }
+    respace(box, total) {
+        const gap = this.gap();
+        const was = this.spaced;
+        if (was === undefined) {
+            this.spaced = gap;
+            return;
+        }
+        if (was === gap) {
+            return;
+        }
+        const top = box ? this.offset(box) : 0;
+        const anchor = this.measuring() ? (this.target ?? this.indexAt(top, total)) : 0;
+        const from = this.measuring() ? this.startOf(anchor, total) : this.line();
+        this.heights.pad(gap - was);
+        this.spaced = gap;
+        const moved = this.measuring()
+            ? this.startOf(anchor, total) - from
+            : (top / from) * this.line() - top;
+        this.settling = 0;
+        if (box && top > 0 && moved !== 0 && (this.options.anchor?.() ?? true)) {
+            this.owed += moved;
+            this.host.requestUpdate();
+        }
     }
     gap() {
         return Math.max(0, this.options.gap?.() ?? 0);
@@ -215,8 +243,11 @@ export class VirtualizeController {
         const uneven = Math.max(...seen) - Math.min(...seen) > 1;
         if (this.sample?.estimate !== estimate) {
             const was = this.line();
-            const size = Math.max(1, seen.reduce((sum, height) => sum + height, 0) / seen.length) + this.gap();
-            this.sample = { estimate, size };
+            this.sample = {
+                estimate,
+                size: Math.max(1, seen.reduce((sum, height) => sum + height, 0) / seen.length),
+            };
+            const size = this.line();
             if (Math.abs(size - was) >= 0.5) {
                 const box = this.options.container();
                 if (box && this.scrolled(box) > 0) {
@@ -337,6 +368,7 @@ export class VirtualizeController {
         this.settle();
     }
     settle() {
+        this.respace(this.options.container(), Math.max(0, this.options.count()));
         if (!this.measuring()) {
             this.sampleRows();
             return;

package/dist/version.d.ts

@@ -6,4 +6,4 @@
  * release, so the two never disagree; a spec beside this holds them to it.
  * Nothing else in the running code knows which release it is.
  */
-export declare const VERSION = "0.211.0";
+export declare const VERSION = "0.211.1";

package/dist/version.js

@@ -1 +1 @@
-export const VERSION = '0.211.0';
+export const VERSION = '0.211.1';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-core",
   "description": "Helix element primitives: base classes, mixins, decorators, utilities.",
-  "version": "0.211.0",
+  "version": "0.211.1",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -81,12 +81,12 @@
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
-    "@fusion.dev/helix-icons": "0.211.0",
+    "@fusion.dev/helix-icons": "0.211.1",
     "tslib": "^2.8.1"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.211.0",
-    "@fusion.dev/helix-testing": "0.211.0",
+    "@fusion.dev/helix-cem": "0.211.1",
+    "@fusion.dev/helix-testing": "0.211.1",
     "@lit-labs/ssr": "^4.1.0",
     "lit": "^3.2.1"
   },