ropav 0.3.1 → 0.5.0

package/dist/utils/virtualizer-offsets.js

@@ -0,0 +1,159 @@
+//#region src/utils/virtualizer-offsets.ts
+/** Reads a start out of the flat array, which holds a `[start, size]` pair per row. */
+var START = 0;
+var SIZE = 1;
+var RowOffsets = class {
+	count = 0;
+	keyAt = (index) => index;
+	estimate = () => 0;
+	start = 0;
+	gap = 0;
+	/** The measured sizes, by key rather than by index so a reorder keeps them. */
+	sizes = /* @__PURE__ */ new Map();
+	/** `[start, size]` per row. Longer than `count` when the collection has shrunk. */
+	flat = /* @__PURE__ */ new Float64Array(0);
+	/** The lowest index whose start may have moved, or `count` when nothing has. */
+	dirtyFrom = 0;
+	collection = null;
+	/**
+	* Takes the shape of the collection.
+	*
+	* The measurements survive as long as the keys can still be asked for — a row that scrolled out
+	* of the window and back in is the same row, and re-measuring it would place it at an estimate
+	* for a frame first.
+	*/
+	configure(options) {
+		const start = options.start ?? 0;
+		const gap = options.gap ?? 0;
+		if (this.count === options.count && this.start === start && this.gap === gap && this.collection === options.collection) {
+			this.keyAt = options.keyAt;
+			this.estimate = options.estimate;
+			return;
+		}
+		this.count = options.count;
+		this.keyAt = options.keyAt;
+		this.estimate = options.estimate;
+		this.collection = options.collection;
+		this.start = start;
+		this.gap = gap;
+		this.dirtyFrom = 0;
+	}
+	/** Forgets every measurement, which is what a resize does — a row's height follows its width. */
+	reset() {
+		this.sizes.clear();
+		this.dirtyFrom = 0;
+	}
+	/**
+	* Records a measured size.
+	*
+	* Returns whether anything moved, which is the caller's cue to lay out again. Measuring the same
+	* height twice moves nothing, and that is what keeps measurement from looping.
+	*/
+	measure(key, size, index) {
+		if (this.sizes.get(key) === size) return false;
+		this.sizes.set(key, size);
+		this.invalidateFrom(index ?? 0);
+		return true;
+	}
+	/** Whether the row at an index has been measured, rather than placed at its estimate. */
+	isMeasured(index) {
+		return this.sizes.has(this.keyAt(index));
+	}
+	/** Marks the row at an index, and everything below it, as sitting somewhere new. */
+	invalidateFrom(index) {
+		this.dirtyFrom = Math.min(this.dirtyFrom, Math.max(0, index));
+	}
+	size(index) {
+		this.build();
+		return index >= 0 && index < this.count ? this.flat[index * 2 + SIZE] : 0;
+	}
+	/** Where the row at an index starts. Answers for a row nobody has rendered. */
+	startOf(index) {
+		this.build();
+		if (this.count === 0) return this.start;
+		const clamped = Math.max(0, Math.min(index, this.count - 1));
+		const start = this.flat[clamped * 2 + START];
+		return index > clamped ? start + this.flat[clamped * 2 + SIZE] + this.gap : start;
+	}
+	endOf(index) {
+		return this.startOf(index) + this.size(index);
+	}
+	/** How tall every row together comes to, the gaps between them included. */
+	total() {
+		this.build();
+		if (this.count === 0) return this.start;
+		const last = this.count - 1;
+		return this.flat[last * 2 + START] + this.flat[last * 2 + SIZE];
+	}
+	/**
+	* The row whose band contains an offset, clamped to the collection.
+	*
+	* A row ending exactly on the offset counts as being above it, which is the edge rule the whole
+	* window turns on: a rectangle snapped to a row boundary would otherwise take in the row above.
+	*/
+	indexAt(offset) {
+		this.build();
+		if (this.count === 0) return 0;
+		let low = 0;
+		let high = this.count - 1;
+		while (low <= high) {
+			const middle = low + high >> 1;
+			const start = this.flat[middle * 2 + START];
+			if (start + this.flat[middle * 2 + SIZE] <= offset) low = middle + 1;
+			else if (start > offset) high = middle - 1;
+			else return middle;
+		}
+		return Math.max(0, Math.min(low, this.count - 1));
+	}
+	/**
+	* The rows a window covers, plus `overscan` of them either side.
+	*
+	* Closed at both ends: `last` is a row, not the one past it.
+	*
+	* Both ends are clamped into the collection, so a window that outran the data comes back with
+	* the rows nearest to it rather than with nothing. That is the property the whole thing turns
+	* on: there is no offset a scrollbar can reach that has no rows to answer with.
+	*
+	* An empty collection is the one range that holds nothing, and it says so with `last` below
+	* `first` rather than by naming a row that is not there.
+	*/
+	rangeFor(offset, length, overscan = 0) {
+		this.build();
+		if (this.count === 0) return {
+			first: 0,
+			last: -1
+		};
+		const first = this.indexAt(offset);
+		const last = this.indexAt(offset + length);
+		return {
+			first: Math.max(0, first - overscan),
+			last: Math.min(this.count - 1, last + overscan)
+		};
+	}
+	/**
+	* Fills in the starts from the lowest one a measurement disturbed.
+	*
+	* Every row below a size that changed sits somewhere new, so there is no shortcut past them —
+	* but this is a loop over a typed array with no allocation in it, which is why a hundred thousand
+	* rows can afford to be re-added on the frame a row is measured.
+	*/
+	build() {
+		if (this.dirtyFrom >= this.count) return;
+		const needed = this.count * 2;
+		if (this.flat.length < needed) {
+			const grown = new Float64Array(needed);
+			grown.set(this.flat.subarray(0, Math.min(this.flat.length, this.dirtyFrom * 2)));
+			this.flat = grown;
+		}
+		let running = this.dirtyFrom === 0 ? this.start : this.flat[(this.dirtyFrom - 1) * 2 + START] + this.flat[(this.dirtyFrom - 1) * 2 + SIZE] + this.gap;
+		for (let index = this.dirtyFrom; index < this.count; index += 1) {
+			const size = this.sizes.get(this.keyAt(index)) ?? this.estimate(index);
+			this.flat[index * 2 + START] = running;
+			this.flat[index * 2 + SIZE] = size;
+			running += size + this.gap;
+		}
+		this.dirtyFrom = this.count;
+	}
+};
+//#endregion
+export { RowOffsets };

package/dist/utils/virtualizer-overscan.d.ts

@@ -1,20 +1,14 @@
 import { Rect } from "./virtualizer-geometry.js";
 /**
- * How much beyond the viewport the virtualizer renders, ported from React Aria's
- * `OverscanManager`.
+ * How much beyond the viewport the virtualizer renders.
  *
- * A third of the viewport is added past the scroll direction, so a fast scroll has something to
- * land on rather than a gap. The extra is added in the direction of travel only, which is why the
- * rendered set depends on how the scroll position was arrived at and not only on where it is.
+ * A third of the viewport either side, so a scroll has something to land on rather than a gap.
  *
- * Velocity is never reset, exactly as upstream: after a scroll upward it stays negative while the
- * list sits still, and the window keeps its extra rows above. Anything comparing rendered sets
- * has to pin the direction of arrival, not just the offset.
+ * React Aria adds it in the direction of travel only, from a velocity it samples on every move and
+ * never resets — so the rendered set depends on how an offset was arrived at rather than on the
+ * offset, a collection sitting still keeps whichever side it was last moving towards, and the
+ * other side has nothing to land on when the scroll reverses. Both sides here: an extra third of a
+ * screen of rows is cheap, and a rendered set that is a function of where the window *is* costs
+ * nothing to reason about.
  */
-export declare class OverscanManager {
-    private startTime;
-    private velocity;
-    private visibleRect;
-    setVisibleRect(rect: Rect): void;
-    getOverscannedRect(): Rect;
-}
+export declare const overscannedRect: (visibleRect: Rect) => Rect;

package/dist/utils/virtualizer-overscan.js

@@ -1,40 +1,21 @@
-import { Point, Rect } from "./virtualizer-geometry.js";
+import { Rect } from "./virtualizer-geometry.js";
 //#region src/utils/virtualizer-overscan.ts
 /**
-* How much beyond the viewport the virtualizer renders, ported from React Aria's
-* `OverscanManager`.
+* How much beyond the viewport the virtualizer renders.
 *
-* A third of the viewport is added past the scroll direction, so a fast scroll has something to
-* land on rather than a gap. The extra is added in the direction of travel only, which is why the
-* rendered set depends on how the scroll position was arrived at and not only on where it is.
+* A third of the viewport either side, so a scroll has something to land on rather than a gap.
 *
-* Velocity is never reset, exactly as upstream: after a scroll upward it stays negative while the
-* list sits still, and the window keeps its extra rows above. Anything comparing rendered sets
-* has to pin the direction of arrival, not just the offset.
+* React Aria adds it in the direction of travel only, from a velocity it samples on every move and
+* never resets — so the rendered set depends on how an offset was arrived at rather than on the
+* offset, a collection sitting still keeps whichever side it was last moving towards, and the
+* other side has nothing to land on when the scroll reverses. Both sides here: an extra third of a
+* screen of rows is cheap, and a rendered set that is a function of where the window *is* costs
+* nothing to reason about.
 */
-var OverscanManager = class {
-	startTime = 0;
-	velocity = new Point(0, 0);
-	visibleRect = new Rect();
-	setVisibleRect(rect) {
-		const time = performance.now() - this.startTime;
-		if (time < 500) {
-			if (rect.x !== this.visibleRect.x && time > 0) this.velocity.x = (rect.x - this.visibleRect.x) / time;
-			if (rect.y !== this.visibleRect.y && time > 0) this.velocity.y = (rect.y - this.visibleRect.y) / time;
-		}
-		this.startTime = performance.now();
-		this.visibleRect = rect;
-	}
-	getOverscannedRect() {
-		const overscanned = this.visibleRect.copy();
-		const overscanY = this.visibleRect.height / 3;
-		const overscanX = this.visibleRect.width / 3;
-		overscanned.height += overscanY;
-		if (this.velocity.y < 0) overscanned.y -= overscanY;
-		overscanned.width += overscanX;
-		if (this.velocity.x < 0) overscanned.x -= overscanX;
-		return overscanned;
-	}
+var overscannedRect = (visibleRect) => {
+	const overscanY = visibleRect.height / 3;
+	const overscanX = visibleRect.width / 3;
+	return new Rect(visibleRect.x - overscanX, visibleRect.y - overscanY, visibleRect.width + overscanX * 2, visibleRect.height + overscanY * 2);
 };
 //#endregion
-export { OverscanManager };
+export { overscannedRect };

package/dist/utils/virtualizer-table-layout.d.ts

@@ -21,39 +21,68 @@ export declare class TableLayout<Options extends TableLayoutOptions = TableLayou
     shouldInvalidateLayoutOptions(newOptions: Options, oldOptions: Options): boolean;
     update(context: InvalidationContext<Options>): void;
     private widthsChanged;
-    /**
-     * The rectangle grown to whole rows.
-     *
-     * The table's own stride, which ignores the gap and does not compensate for how far the top edge
-     * moved — the list layout does both. Kept as upstream has it, because one extra row rendered is
-     * one row of difference against the React build.
-     */
-    protected snapVisibleRect(rect: Rect): Rect;
     /**
      * Every layout info to render, parents before children.
      *
-     * The rows are found by a binary search rather than by testing each one against the rectangle,
-     * and the two do not agree at the edges: the search treats a row whose bottom edge is exactly the
-     * rectangle's top edge as **above** the window, while an intersection test counts a shared edge
-     * as an overlap. Since the rectangle is snapped to whole rows, its top edge lands on a row
-     * boundary nearly always — so the difference is a whole extra row, every time. That is what makes
-     * this a port and not a simplification.
+     * Everything a pass built is reported. The body's children *are* the window — the index decided
+     * which rows those were before any of them was placed — so there is nothing left to search over
+     * and nothing to clamp against.
      */
     getVisibleLayoutInfos(rect: Rect): LayoutInfo[];
     private addVisibleLayoutInfos;
-    /**
-     * The child whose band contains `y`, clamped to the ends.
-     *
-     * A row ending exactly on `y` counts as being before it, which is the edge rule the whole window
-     * turns on.
-     */
-    private binarySearch;
     protected getEstimatedRowHeight(): number;
     protected buildCollection(): LayoutNode[];
     protected buildTableHeader(): LayoutNode;
     protected buildHeaderRow(node: VirtualizerNode, x: number, y: number): LayoutNode;
     protected buildColumn(node: VirtualizerNode, x: number, y: number): LayoutNode;
+    /**
+     * How many things the body places: a row per item, and the sentinel after them.
+     *
+     * The sentinel is one of them rather than a special case bolted on after, so the index knows
+     * where it sits and the rows around it do not have to be walked to find out.
+     */
+    protected get placedCount(): number;
+    /**
+     * Where the index puts a body child.
+     *
+     * A row is not a root here — the body is — so what the index places is a child of the body, and
+     * the offset it gives is what lets a row nobody scrolled to be placed on its own. Pressing End
+     * asks for exactly that.
+     */
+    protected indexedOffset(node: VirtualizerNode): number | null;
+    /**
+     * Hands a measurement to the index, or to the row that owns it.
+     *
+     * A cell's measurement is not a row's: a row is as tall as its **tallest** cell, so a cell that
+     * measured means the row has to be built again from all of them. `buildRow` is what works the
+     * height out, and what tells the index.
+     */
+    protected recordMeasuredSize(layoutNode: LayoutNode, height: number): void;
+    /** The key of the body child at `index`, which is a row until it is the sentinel. */
+    private bodyChildKey;
+    protected estimatedSizeAt(index: number): number;
+    protected configureOffsets(start?: number): void;
+    /**
+     * The body children placed wherever the window is.
+     *
+     * The sentinel, because one that is not in the DOM can never report that it came into view, so
+     * the next page would never be asked for. A persisted row, because the roving tab stop lives on
+     * it and losing its element drops focus to the document.
+     */
+    protected indicesPlacedOutsideTheWindow(): Set<number>;
     protected buildRowGroup(y: number, node: VirtualizerNode): LayoutNode;
+    /** A row sits below the header, not at the top of the table. */
+    protected rowOffset(index: number): number;
+    /**
+     * The cells of one row, derived rather than looked up.
+     *
+     * A virtualized table renders one cell per column, so the cell where this row meets each column
+     * is known without anyone having rendered it — and building them here rather than holding them
+     * in the collection is what keeps the node count proportional to the window instead of to the
+     * data. A cell that has been placed before keeps the node it was placed from, so a rebuilt row
+     * does not have to measure its cells again.
+     */
+    private buildCellNodes;
     protected buildRow(node: VirtualizerNode, x: number, y: number): LayoutNode;
     protected buildCell(node: VirtualizerNode, x: number, y: number): LayoutNode;
     protected buildLoader(node: VirtualizerNode, x: number, y: number): LayoutNode;

package/dist/utils/virtualizer-table-layout.js

@@ -11,7 +11,7 @@ import { ListLayout } from "./virtualizer-list-layout.js";
 * that the widths a browser lays a plain table out with and the widths this places cells at are
 * the same numbers.
 *
-* Two departures from upstream, both deliberate:
+* Departures from upstream, all deliberate:
 *
 * **No horizontal windowing.** Upstream drops cells and columns that are scrolled off to the side
 * and keeps a list of sticky indices — the selection column, and every row header column, so a row
@@ -25,8 +25,11 @@ import { ListLayout } from "./virtualizer-list-layout.js";
 * visible range in three passes. Asking the virtualizer about each candidate instead gives the same
 * set in the same order, because the children are already in order.
 *
-* **The visible rectangle is copied before it is snapped**, where upstream writes through the
-* argument. The caller hands over a throwaway rectangle either way, so the result is the same.
+* **The body's children are the window.** Upstream builds a region and then binary searches inside
+* it for the rows the rectangle covers, clamping to the ends when it finds none — which renders a
+* single off-screen row whenever the region and the rectangle have come apart. The index decides
+* which rows those are before any of them is placed, so there is nothing left to search and no
+* clamp to land on.
 */
 /** The height React Aria falls back to when neither a fixed nor an estimated height is given. */
 var DEFAULT_ROW_HEIGHT = 48;
@@ -51,74 +54,26 @@ var TableLayout = class extends ListLayout {
 		return false;
 	}
 	/**
-	* The rectangle grown to whole rows.
-	*
-	* The table's own stride, which ignores the gap and does not compensate for how far the top edge
-	* moved — the list layout does both. Kept as upstream has it, because one extra row rendered is
-	* one row of difference against the React build.
-	*/
-	snapVisibleRect(rect) {
-		if (rect.height <= 1) return rect;
-		const rowHeight = this.getEstimatedRowHeight();
-		const snapped = rect.copy();
-		snapped.y = Math.floor(snapped.y / rowHeight) * rowHeight;
-		snapped.height = Math.ceil(snapped.height / rowHeight) * rowHeight;
-		return snapped;
-	}
-	/**
 	* Every layout info to render, parents before children.
 	*
-	* The rows are found by a binary search rather than by testing each one against the rectangle,
-	* and the two do not agree at the edges: the search treats a row whose bottom edge is exactly the
-	* rectangle's top edge as **above** the window, while an intersection test counts a shared edge
-	* as an overlap. Since the rectangle is snapped to whole rows, its top edge lands on a row
-	* boundary nearly always — so the difference is a whole extra row, every time. That is what makes
-	* this a port and not a simplification.
+	* Everything a pass built is reported. The body's children *are* the window — the index decided
+	* which rows those were before any of them was placed — so there is nothing left to search over
+	* and nothing to clamp against.
 	*/
 	getVisibleLayoutInfos(rect) {
-		const searchRect = this.snapVisibleRect(rect);
-		this.layoutIfNeeded(searchRect);
+		this.layoutFor(this.snapVisibleRect(rect));
 		const result = [];
 		for (const node of this.rootNodes) {
 			result.push(node.layoutInfo);
-			this.addVisibleLayoutInfos(result, node, searchRect);
+			this.addVisibleLayoutInfos(result, node);
 		}
 		return result;
 	}
-	addVisibleLayoutInfos(result, node, rect) {
-		if (node.children.length === 0) return;
-		if (node.layoutInfo.type === "rowgroup") {
-			const first = this.binarySearch(node.children, rect.y);
-			const last = this.binarySearch(node.children, rect.maxY);
-			for (const [index, child] of node.children.entries()) {
-				if (!(index >= first && index <= last || child.layoutInfo.type === "loader" || this.host.isPersistedKey(child.layoutInfo.key))) continue;
-				result.push(child.layoutInfo);
-				this.addVisibleLayoutInfos(result, child, rect);
-			}
-			return;
-		}
+	addVisibleLayoutInfos(result, node) {
 		for (const child of node.children) {
 			result.push(child.layoutInfo);
-			this.addVisibleLayoutInfos(result, child, rect);
-		}
-	}
-	/**
-	* The child whose band contains `y`, clamped to the ends.
-	*
-	* A row ending exactly on `y` counts as being before it, which is the edge rule the whole window
-	* turns on.
-	*/
-	binarySearch(items, y) {
-		let low = 0;
-		let high = items.length - 1;
-		while (low <= high) {
-			const mid = low + high >> 1;
-			const rect = items[mid].layoutInfo.rect;
-			if (rect.maxY <= y) low = mid + 1;
-			else if (rect.y > y) high = mid - 1;
-			else return mid;
+			this.addVisibleLayoutInfos(result, child);
 		}
-		return Math.max(0, Math.min(items.length - 1, low));
 	}
 	getEstimatedRowHeight() {
 		return this.rowSize ?? this.estimatedRowSize ?? DEFAULT_ROW_HEIGHT;
@@ -172,8 +127,7 @@ var TableLayout = class extends ListLayout {
 		return {
 			children,
 			layoutInfo,
-			node: collection.getNode(collection.headerKey),
-			validRect: rect
+			node: collection.getNode(collection.headerKey)
 		};
 	}
 	buildHeaderRow(node, x, y) {
@@ -196,8 +150,7 @@ var TableLayout = class extends ListLayout {
 		return {
 			children: columns,
 			layoutInfo,
-			node,
-			validRect: rect
+			node
 		};
 	}
 	buildColumn(node, x, y) {
@@ -209,49 +162,139 @@ var TableLayout = class extends ListLayout {
 		return {
 			children: [],
 			layoutInfo,
-			node,
-			validRect: layoutInfo.rect
+			node
 		};
 	}
+	/**
+	* How many things the body places: a row per item, and the sentinel after them.
+	*
+	* The sentinel is one of them rather than a special case bolted on after, so the index knows
+	* where it sits and the rows around it do not have to be walked to find out.
+	*/
+	get placedCount() {
+		const collection = this.tableCollection;
+		return collection.rows.keys.length + (collection.loaderKey == null ? 0 : 1);
+	}
+	/**
+	* Where the index puts a body child.
+	*
+	* A row is not a root here — the body is — so what the index places is a child of the body, and
+	* the offset it gives is what lets a row nobody scrolled to be placed on its own. Pressing End
+	* asks for exactly that.
+	*/
+	indexedOffset(node) {
+		if (node.parentKey !== this.tableCollection.bodyKey) return null;
+		return this.offsets.startOf(node.index);
+	}
+	/**
+	* Hands a measurement to the index, or to the row that owns it.
+	*
+	* A cell's measurement is not a row's: a row is as tall as its **tallest** cell, so a cell that
+	* measured means the row has to be built again from all of them. `buildRow` is what works the
+	* height out, and what tells the index.
+	*/
+	recordMeasuredSize(layoutNode, height) {
+		const node = layoutNode.node;
+		if (!node) return;
+		if (node.type === "cell") {
+			if (node.parentKey != null) this.layoutNodes.delete(node.parentKey);
+			return;
+		}
+		if (node.parentKey === this.tableCollection.bodyKey) this.offsets.measure(node.key, height, node.index);
+	}
+	/** The key of the body child at `index`, which is a row until it is the sentinel. */
+	bodyChildKey(index) {
+		const collection = this.tableCollection;
+		const rowKeys = collection.rows.keys;
+		return index < rowKeys.length ? rowKeys[index] : collection.loaderKey;
+	}
+	estimatedSizeAt(index) {
+		if (index >= this.tableCollection.rows.keys.length) return this.loaderSize ?? this.getEstimatedRowHeight();
+		return this.getEstimatedRowHeight();
+	}
+	configureOffsets(start = this.padding) {
+		this.offsets.configure({
+			collection: this.tableCollection,
+			count: this.placedCount,
+			estimate: (index) => this.estimatedSizeAt(index),
+			gap: this.gap,
+			keyAt: (index) => this.bodyChildKey(index) ?? index,
+			start
+		});
+	}
+	/**
+	* The body children placed wherever the window is.
+	*
+	* The sentinel, because one that is not in the DOM can never report that it came into view, so
+	* the next page would never be asked for. A persisted row, because the roving tab stop lives on
+	* it and losing its element drops focus to the document.
+	*/
+	indicesPlacedOutsideTheWindow() {
+		const collection = this.tableCollection;
+		const indices = this.persistedIndices(collection.rows.keys);
+		if (collection.loaderKey != null) indices.add(collection.rows.keys.length);
+		return indices;
+	}
 	buildRowGroup(y, node) {
 		const collection = this.tableCollection;
 		const rect = new Rect(this.padding, y, 0, 0);
 		const layoutInfo = new LayoutInfo("rowgroup", node.key, rect);
 		const children = [];
-		const rowHeight = this.getEstimatedRowHeight() + this.gap;
 		const startY = y;
-		const hasWindow = this.requestedRect.area > 0;
+		this.configureOffsets(startY);
 		let width = 0;
-		for (const child of collection.getChildNodes(node.key)) {
-			if (!hasWindow && child.type !== "loader" || y + rowHeight < this.requestedRect.y && !this.isValid(child, y) || y > this.requestedRect.maxY && child.type !== "loader") {
-				y += rowHeight;
-				continue;
-			}
-			const row = this.buildChild(child, this.padding, y, layoutInfo.key);
-			row.layoutInfo.parentKey = layoutInfo.key;
-			row.index = children.length;
-			y = row.layoutInfo.rect.maxY + this.gap;
-			width = Math.max(width, row.layoutInfo.rect.width);
-			children.push(row);
+		for (const index of this.windowedIndices(this.window)) {
+			const key = this.bodyChildKey(index);
+			const child = key == null ? void 0 : collection.getNode(key);
+			if (!child) continue;
+			const placed = this.buildChild(child, this.padding, this.offsets.startOf(index), layoutInfo.key);
+			placed.layoutInfo.parentKey = layoutInfo.key;
+			placed.index = children.length;
+			width = Math.max(width, placed.layoutInfo.rect.width);
+			children.push(placed);
 		}
-		if (collection.itemCount === 0) y = this.host.size.height;
-		else y -= this.gap;
 		rect.width = width;
-		rect.height = y - startY;
+		rect.height = collection.itemCount === 0 ? this.host.size.height - startY : this.offsets.total() - startY;
 		return {
 			children,
 			layoutInfo,
-			node,
-			validRect: rect.intersection(this.requestedRect)
+			node
 		};
 	}
+	/** A row sits below the header, not at the top of the table. */
+	rowOffset(index) {
+		const header = this.layoutNodes.get(this.tableCollection.headerKey);
+		return (header == null ? this.padding : header.layoutInfo.rect.maxY + this.gap) + index * (this.getEstimatedRowHeight() + this.gap);
+	}
+	/**
+	* The cells of one row, derived rather than looked up.
+	*
+	* A virtualized table renders one cell per column, so the cell where this row meets each column
+	* is known without anyone having rendered it — and building them here rather than holding them
+	* in the collection is what keeps the node count proportional to the window instead of to the
+	* data. A cell that has been placed before keeps the node it was placed from, so a rebuilt row
+	* does not have to measure its cells again.
+	*/
+	buildCellNodes(rowKey) {
+		const collection = this.tableCollection;
+		return collection.columnKeys.map((columnKey, index) => {
+			const key = collection.cellKey(rowKey, columnKey);
+			const placed = this.layoutNodes.get(key)?.node;
+			return placed?.index === index ? placed : {
+				childKeys: [],
+				index,
+				key,
+				parentKey: rowKey,
+				type: "cell"
+			};
+		});
+	}
 	buildRow(node, x, y) {
 		const rect = new Rect(x, y, 0, 0);
 		const layoutInfo = new LayoutInfo("row", node.key, rect);
 		const children = [];
 		let height = 0;
-		for (const child of this.tableCollection.getChildNodes(node.key)) {
-			if (child.type !== "cell") continue;
+		for (const child of this.buildCellNodes(node.key)) {
 			const cell = this.buildChild(child, x, y, layoutInfo.key);
 			cell.index = children.length;
 			x = cell.layoutInfo.rect.maxX;
@@ -261,11 +304,11 @@ var TableLayout = class extends ListLayout {
 		this.setChildHeights(children, height);
 		rect.width = this.headerWidth();
 		rect.height = height;
+		if (this.rowSize == null) this.offsets.measure(node.key, height, node.index);
 		return {
 			children,
 			layoutInfo,
-			node,
-			validRect: rect.intersection(this.requestedRect)
+			node
 		};
 	}
 	buildCell(node, x, y) {
@@ -277,14 +320,12 @@ var TableLayout = class extends ListLayout {
 		return {
 			children: [],
 			layoutInfo,
-			node,
-			validRect: layoutInfo.rect
+			node
 		};
 	}
 	buildLoader(node, x, y) {
 		const layoutNode = super.buildLoader(node, x, y);
 		layoutNode.layoutInfo.rect.width = this.headerWidth();
-		layoutNode.validRect = layoutNode.layoutInfo.rect.intersection(this.requestedRect);
 		return layoutNode;
 	}
 	buildNode(node, x, y) {

package/dist/version.js

@@ -1,4 +1,4 @@
 //#region src/version.ts
-var ROPAV_VERSION = "0.3.0";
+var ROPAV_VERSION = "0.5.0";
 //#endregion
 export { ROPAV_VERSION };