ropav 0.4.0 → 0.6.0

package/dist/utils/flex-sizing.d.ts

@@ -0,0 +1,41 @@
+/** A size: pixels as a number or a `px` string, a percentage of the container, or a fraction of what is left. */
+export type FlexSize = number | string;
+export interface FlexSizeDefinition {
+    /** A size the caller controls. Set, it outranks everything below it. */
+    size?: FlexSize | null;
+    /** The size the item starts at, when the caller is not controlling it. */
+    defaultSize?: FlexSize | null;
+    minSize?: FlexSize | null;
+    maxSize?: FlexSize | null;
+}
+/**
+ * Pixels and percentages are fixed; `fr` units and anything unrecognised flex.
+ *
+ * A bare number, a `px` string and a numeric string all count as pixels. Accepting the string
+ * forms is not cosmetic: a template attribute is always a string, so `size="240px"` is the only
+ * way most callers can express a pixel size at all.
+ */
+export declare const isStaticSize: (size?: FlexSize | null) => boolean;
+/** The number in front of `fr`. Anything else counts as `1fr`, as React Aria has it. */
+export declare const parseFractionalUnit: (size?: FlexSize | null) => number;
+export declare const parseStaticSize: (size: FlexSize, availableSize: number) => number;
+export declare const getMaxSize: (maxSize: FlexSize | null | undefined, availableSize: number) => number;
+/**
+ * A minimum cannot be given in `fr`: knowing what a fraction comes to would need every other
+ * item's size, which is the very thing being solved for.
+ */
+export declare const getMinSize: (minSize: FlexSize | null | undefined, availableSize: number) => number;
+/**
+ * Sizes for one container size, ported from react-stately's `calculateColumnSizes`.
+ *
+ * This is the CSS flexbox layout algorithm, cut down to the shape a single track needs: one line,
+ * a flex basis of zero unless the item asked for a static size, and grow and shrink both equal to
+ * the item's `fr`. It is deliberately **not** plain pixel sizing — `1fr` items have to share what
+ * the static and percentage items leave over, and a minimum or maximum on any one of them
+ * redistributes the rest.
+ *
+ * Keyless on purpose: a caller with overriding sizes of its own resolves them into `size` before
+ * calling, which is the same precedence a lookup here would have given and leaves the solver with
+ * nothing to know about how the caller identifies its items.
+ */
+export declare const calculateFlexSizes: (availableSize: number, definitions: FlexSizeDefinition[], getDefaultSize?: (index: number) => FlexSize | null | undefined, getDefaultMinSize?: (index: number) => FlexSize | null | undefined) => number[];

package/dist/utils/flex-sizing.js

@@ -0,0 +1,140 @@
+//#region src/utils/flex-sizing.ts
+var PIXELS = /^(-?\d*\.?\d+)px$/;
+var PERCENT = /^(-?\d*\.?\d+)%$/;
+var NUMBER = /^-?\d*\.?\d+$/;
+var FRACTION = /^(-?\d*\.?\d+)fr$/;
+/**
+* Pixels and percentages are fixed; `fr` units and anything unrecognised flex.
+*
+* A bare number, a `px` string and a numeric string all count as pixels. Accepting the string
+* forms is not cosmetic: a template attribute is always a string, so `size="240px"` is the only
+* way most callers can express a pixel size at all.
+*/
+var isStaticSize = (size) => {
+	if (size == null) return false;
+	if (typeof size === "number") return !isNaN(size);
+	return PIXELS.test(size) || PERCENT.test(size) || NUMBER.test(size);
+};
+/** The number in front of `fr`. Anything else counts as `1fr`, as React Aria has it. */
+var parseFractionalUnit = (size) => {
+	if (!size || typeof size === "number") return 1;
+	const match = FRACTION.exec(size);
+	return match ? parseFloat(match[1]) : 1;
+};
+var parseStaticSize = (size, availableSize) => {
+	if (typeof size === "number") return size;
+	const percent = PERCENT.exec(size);
+	if (percent) return availableSize * (parseFloat(percent[1]) / 100);
+	const pixels = PIXELS.exec(size);
+	if (pixels) return parseFloat(pixels[1]);
+	if (NUMBER.test(size)) return parseFloat(size);
+	throw new Error("Only percentages or numbers are supported for static sizes");
+};
+var getMaxSize = (maxSize, availableSize) => maxSize != null ? parseStaticSize(maxSize, availableSize) : Number.MAX_SAFE_INTEGER;
+/**
+* A minimum cannot be given in `fr`: knowing what a fraction comes to would need every other
+* item's size, which is the very thing being solved for.
+*/
+var getMinSize = (minSize, availableSize) => minSize != null ? parseStaticSize(minSize, availableSize) : 0;
+/**
+* Round an array of floats that sums to an integer, keeping the sum.
+*
+* Each item has to come out a whole number of pixels, and rounding them one by one would drift:
+* the remainder is carried forward instead, so the total is preserved.
+*/
+var cascadeRounding = (items) => {
+	let floatTotal = 0;
+	let intTotal = 0;
+	return items.map((item) => {
+		const rounded = Math.round(item.targetMainSize + floatTotal) - intTotal;
+		floatTotal += item.targetMainSize;
+		intTotal += rounded;
+		return rounded;
+	});
+};
+/**
+* Sizes for one container size, ported from react-stately's `calculateColumnSizes`.
+*
+* This is the CSS flexbox layout algorithm, cut down to the shape a single track needs: one line,
+* a flex basis of zero unless the item asked for a static size, and grow and shrink both equal to
+* the item's `fr`. It is deliberately **not** plain pixel sizing — `1fr` items have to share what
+* the static and percentage items leave over, and a minimum or maximum on any one of them
+* redistributes the rest.
+*
+* Keyless on purpose: a caller with overriding sizes of its own resolves them into `size` before
+* calling, which is the same precedence a lookup here would have given and leaves the solver with
+* nothing to know about how the caller identifies its items.
+*/
+var calculateFlexSizes = (availableSize, definitions, getDefaultSize, getDefaultMinSize) => {
+	const originalSize = availableSize;
+	const flooredSize = Math.floor(availableSize);
+	const hasFractionalSize = availableSize - flooredSize > 0;
+	availableSize = flooredSize;
+	let hasNonFrozenItems = false;
+	const items = definitions.map((definition, index) => {
+		const size = definition.size ?? definition.defaultSize ?? getDefaultSize?.(index) ?? "1fr";
+		let frozen = false;
+		let baseSize = 0;
+		let flex = 0;
+		let targetMainSize = 0;
+		if (isStaticSize(size)) {
+			baseSize = parseStaticSize(size, availableSize);
+			frozen = true;
+		} else {
+			flex = parseFractionalUnit(size);
+			if (flex <= 0) frozen = true;
+		}
+		const min = getMinSize(definition.minSize ?? getDefaultMinSize?.(index) ?? 0, availableSize);
+		const max = getMaxSize(definition.maxSize, availableSize);
+		const hypotheticalMainSize = Math.max(min, Math.min(baseSize, max));
+		if (frozen) targetMainSize = hypotheticalMainSize;
+		else if (baseSize > hypotheticalMainSize) {
+			frozen = true;
+			targetMainSize = hypotheticalMainSize;
+		}
+		if (!frozen) hasNonFrozenItems = true;
+		return {
+			baseSize,
+			flex,
+			frozen,
+			hypotheticalMainSize,
+			max,
+			min,
+			targetMainSize,
+			violation: 0
+		};
+	});
+	while (hasNonFrozenItems) {
+		let usedSize = 0;
+		let flexFactors = 0;
+		for (const item of items) if (item.frozen) usedSize += item.targetMainSize;
+		else {
+			usedSize += item.baseSize;
+			flexFactors += item.flex;
+		}
+		const remainingFreeSpace = availableSize - usedSize;
+		if (remainingFreeSpace > 0) {
+			for (const item of items) if (!item.frozen) item.targetMainSize = item.baseSize + item.flex / flexFactors * remainingFreeSpace;
+		}
+		let totalViolation = 0;
+		for (const item of items) {
+			item.violation = 0;
+			if (item.frozen) continue;
+			const unclamped = item.targetMainSize;
+			item.targetMainSize = Math.max(item.min, Math.min(unclamped, item.max));
+			item.violation = item.targetMainSize - unclamped;
+			totalViolation += item.violation;
+		}
+		hasNonFrozenItems = false;
+		for (const item of items) if (totalViolation === 0 || Math.sign(totalViolation) === Math.sign(item.violation)) item.frozen = true;
+		else if (!item.frozen) hasNonFrozenItems = true;
+	}
+	const sizes = cascadeRounding(items);
+	if (hasFractionalSize && sizes.length > 0) {
+		const fraction = originalSize.toString().split(".")[1];
+		sizes[sizes.length - 1] = Number(`${sizes.at(-1)}.${fraction}`);
+	}
+	return sizes;
+};
+//#endregion
+export { calculateFlexSizes, getMaxSize, getMinSize, isStaticSize, parseFractionalUnit, parseStaticSize };

package/dist/utils/index.d.ts

@@ -22,6 +22,7 @@ export * from "./form-value.js";
 export * from "./incomplete-date.js";
 export * from "./locale.js";
 export * from "./number.js";
+export * from "./open-link.js";
 export * from "./platform.js";
 export * from "./position.js";
 export * from "./text-value.js";
@@ -30,6 +31,7 @@ export * from "./virtualizer-geometry.js";
 export * from "./virtualizer-layout.js";
 export * from "./virtualizer-layout-info.js";
 export * from "./virtualizer-list-layout.js";
+export * from "./virtualizer-offsets.js";
 export * from "./virtualizer-overscan.js";
 export * from "./virtualizer-table-layout.js";
 export * from "./visually-hidden.js";

package/dist/utils/open-link.d.ts

@@ -0,0 +1,31 @@
+import type { RouterContext } from "../components/router-provider/router-provider.context.js";
+/** The modifier keys a click carries, which is all `shouldClientNavigate` reads off the event. */
+export interface OpenLinkModifiers {
+    altKey: boolean;
+    ctrlKey: boolean;
+    metaKey: boolean;
+    shiftKey: boolean;
+}
+export interface OpenLinkOptions {
+    /** The href as the link declared it, before `resolveHref` rewrote it for the DOM. */
+    href?: string;
+    router: RouterContext | null;
+    /** Passed straight through to `navigate`, for whatever the application's router accepts. */
+    routerOptions?: unknown;
+}
+/**
+ * Whether the application's router should take this activation rather than the browser.
+ *
+ * Ported from React Aria's `shouldClientNavigate`. Every case below asks the browser for
+ * something a client-side router cannot do, so letting the event through is the whole point.
+ */
+export declare const shouldClientNavigate: (link: HTMLAnchorElement, modifiers: OpenLinkModifiers) => boolean;
+/**
+ * Give a click on an anchor to the application's router, when it is a click the router can serve.
+ *
+ * Called after the press machinery, from a link's own click handler. Every activation path
+ * converges there: a pointer press completes on the click, Enter on an anchor produces a native
+ * click because `usePress` carves anchors out of its keyboard default handling, and a screen
+ * reader arrives as a virtual click.
+ */
+export declare const openLink: (event: MouseEvent, options: OpenLinkOptions) => void;

package/dist/utils/open-link.js

@@ -0,0 +1,32 @@
+//#region src/utils/open-link.ts
+/**
+* Whether the application's router should take this activation rather than the browser.
+*
+* Ported from React Aria's `shouldClientNavigate`. Every case below asks the browser for
+* something a client-side router cannot do, so letting the event through is the whole point.
+*/
+var shouldClientNavigate = (link, modifiers) => {
+	const target = link.getAttribute("target");
+	return (!target || target === "_self") && link.origin === window.location.origin && !link.hasAttribute("download") && !modifiers.metaKey && !modifiers.ctrlKey && !modifiers.altKey && !modifiers.shiftKey;
+};
+/**
+* Give a click on an anchor to the application's router, when it is a click the router can serve.
+*
+* Called after the press machinery, from a link's own click handler. Every activation path
+* converges there: a pointer press completes on the click, Enter on an anchor produces a native
+* click because `usePress` carves anchors out of its keyboard default handling, and a screen
+* reader arrives as a virtual click.
+*/
+var openLink = (event, options) => {
+	const { href, router, routerOptions } = options;
+	if (!router || !href) return;
+	if (event.defaultPrevented) return;
+	if (event.button !== 0) return;
+	const link = event.currentTarget;
+	if (!(link instanceof HTMLAnchorElement)) return;
+	if (!shouldClientNavigate(link, event)) return;
+	event.preventDefault();
+	router.navigate(href, routerOptions);
+};
+//#endregion
+export { openLink, shouldClientNavigate };

package/dist/utils/story-truncation.d.ts

@@ -0,0 +1,20 @@
+import type { CollectionKey } from "../composables/use-collection.js";
+/**
+ * Which of a collection's labels are clipped, for the stories that pair truncation with a tooltip.
+ *
+ * A tooltip on every option is noise: the ones that fit already say everything they have to say, and
+ * a tooltip repeating a label the user can read is one more thing moving under the pointer. So the
+ * label reports whether it is actually clipped, and only those get one.
+ *
+ * `scrollWidth > clientWidth` is the only reliable read of that — CSS truncates without telling
+ * anyone, and the width a label wants depends on the font, the container and the text at once, none
+ * of which a story can know in advance. A `ResizeObserver` keeps the answer current: the popover is
+ * measured the moment it opens, and again whenever it is resized under a label that then fits, or
+ * stops fitting.
+ *
+ * Story-only, so it is deliberately not re-exported from `utils/index.ts`.
+ */
+export declare const useClippedLabels: () => {
+    clipped: import("vue").ShallowRef<ReadonlySet<CollectionKey>, ReadonlySet<CollectionKey>>;
+    measure: (key: CollectionKey, element: unknown) => void;
+};

package/dist/utils/story-users.d.ts

@@ -0,0 +1,11 @@
+/** Story-only, like the rest of the `story-*` helpers, so deliberately not re-exported. */
+export interface User {
+    id: number;
+    image_url: string;
+    name: string;
+    role: string;
+    status: "Active" | "Inactive" | "On Leave";
+    email: string;
+}
+/** The same rows in the same order as the React story, so the two can be compared row by row. */
+export declare const generateUsers: (count: number) => User[];

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

@@ -34,7 +34,12 @@ export interface VirtualizerTableCollection extends VirtualizerCollection {
     loaderKey: VirtualizerKey | null;
     /** The columns, in order. A cell's position among them is what pairs it with a width. */
     columnKeys: VirtualizerKey[];
-    /** The key of the cell where a row and a column meet. */
+    /**
+     * The key of the cell where a row and a column meet.
+     *
+     * A cell is not a node of this collection — this is what stands in for one, so the layout can
+     * name a cell it is about to place and a rendered cell can look its own geometry back up.
+     */
     cellKey: (rowKey: VirtualizerKey, columnKey: VirtualizerKey) => VirtualizerKey;
     /**
      * The same nodes seen as a flat list of rows.
@@ -65,12 +70,17 @@ export interface CreateTableCollectionOptions<T> {
 }
 /**
  * The two-dimensional collection a table layout walks: a header holding one row of columns, and a
- * body holding a row per item with a cell per column.
+ * body holding a row per item.
  *
  * React Aria gets this shape from its hidden render pass, where every cell a row rendered is a
  * node of the collection. There is no such pass here, so the cells are **derived**: a virtualized
- * table renders one cell per column, so the cell where row `r` meets column `c` is known without
- * anyone having rendered it. That is what lets the layout place a row that is nowhere in the DOM.
+ * table renders one cell per column, so the cell where row `r` meets column `c` is known from
+ * {@link VirtualizerTableCollection.cellKey} without anyone having rendered it. That is what lets
+ * the layout place a row that is nowhere in the DOM.
+ *
+ * Nothing here holds a cell, and deliberately: a cell per column per row is the one count that
+ * grows with the data rather than with the window, and it would be paid in full before the first
+ * paint. The layout builds the cells of the rows it places, and drops them with those rows.
  *
  * Consequently a `colSpan` is not expressible — every cell is exactly one column wide.
  */

package/dist/utils/virtualizer-collection.js

@@ -36,12 +36,17 @@ var createListCollection = (options) => {
 };
 /**
 * The two-dimensional collection a table layout walks: a header holding one row of columns, and a
-* body holding a row per item with a cell per column.
+* body holding a row per item.
 *
 * React Aria gets this shape from its hidden render pass, where every cell a row rendered is a
 * node of the collection. There is no such pass here, so the cells are **derived**: a virtualized
-* table renders one cell per column, so the cell where row `r` meets column `c` is known without
-* anyone having rendered it. That is what lets the layout place a row that is nowhere in the DOM.
+* table renders one cell per column, so the cell where row `r` meets column `c` is known from
+* {@link VirtualizerTableCollection.cellKey} without anyone having rendered it. That is what lets
+* the layout place a row that is nowhere in the DOM.
+*
+* Nothing here holds a cell, and deliberately: a cell per column per row is the one count that
+* grows with the data rather than with the window, and it would be paid in full before the first
+* paint. The layout builds the cells of the rows it places, and drops them with those rows.
 *
 * Consequently a `colSpan` is not expressible — every cell is exactly one column wide.
 */
@@ -93,11 +98,10 @@ var createTableCollection = (options) => {
 	});
 	items.forEach((item, index) => {
 		const rowKey = getKey(item, index);
-		const cellKeys = columnKeys.map((columnKey) => cellKey(rowKey, columnKey));
 		rowKeys.push(rowKey);
 		bodyChildKeys.push(rowKey);
 		add({
-			childKeys: cellKeys,
+			childKeys: [],
 			content: item,
 			index,
 			isDisabled: isDisabled?.(item) ?? false,
@@ -106,15 +110,6 @@ var createTableCollection = (options) => {
 			textValue: getTextValue?.(item),
 			type: "row"
 		});
-		cellKeys.forEach((key, columnIndex) => {
-			add({
-				childKeys: [],
-				index: columnIndex,
-				key,
-				parentKey: rowKey,
-				type: "cell"
-			});
-		});
 	});
 	if (loaderKey != null) {
 		bodyChildKeys.push(loaderKey);

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

@@ -68,10 +68,11 @@ var px = (value) => Number.isFinite(value) ? `${value}px` : void 0;
 */
 var layoutInfoToStyle = (layoutInfo, parent) => {
 	const offsetParent = Boolean(parent && !(parent.allowOverflow && layoutInfo.isSticky)) ? parent : null;
+	const isEstimated = layoutInfo.estimatedSize;
 	return {
-		contain: "size layout style",
+		contain: isEstimated ? "layout style" : "size layout style",
 		display: layoutInfo.isSticky ? "inline-block" : void 0,
-		height: px(layoutInfo.rect.height),
+		height: isEstimated ? "auto" : px(layoutInfo.rect.height),
 		left: px(layoutInfo.rect.x - (offsetParent?.rect.x ?? 0)),
 		opacity: layoutInfo.opacity,
 		overflow: layoutInfo.allowOverflow ? "visible" : "hidden",

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

@@ -4,6 +4,7 @@ import type { VirtualizerKey } from "./virtualizer-layout-info.js";
 import { Rect, Size } from "./virtualizer-geometry.js";
 import { Layout } from "./virtualizer-layout.js";
 import { LayoutInfo } from "./virtualizer-layout-info.js";
+import { RowOffsets } from "./virtualizer-offsets.js";
 export interface ListLayoutOptions {
     /** The fixed size of a row, in px. */
     rowSize?: number;
@@ -21,23 +22,11 @@ export interface ListLayoutOptions {
     padding?: number;
     /** How thick the line marking a gap between two items is, in px. @default 2 */
     dropIndicatorThickness?: number;
-    /** @deprecated Use `rowSize`. Accepted because React Aria still does. */
-    rowHeight?: number;
-    /** @deprecated Use `estimatedRowSize`. */
-    estimatedRowHeight?: number;
-    /** @deprecated Use `headingSize`. */
-    headingHeight?: number;
-    /** @deprecated Use `estimatedHeadingSize`. */
-    estimatedHeadingHeight?: number;
-    /** @deprecated Use `loaderSize`. */
-    loaderHeight?: number;
 }
 /** A layout info plus the hierarchy around it, which a table needs and a list does not. */
 export interface LayoutNode {
     layoutInfo: LayoutInfo;
     children: LayoutNode[];
-    /** The part of the layout info that has been computed against real data. */
-    validRect: Rect;
     node?: VirtualizerNode;
     index?: number;
 }
@@ -53,21 +42,27 @@ export declare class ListLayout<Options extends ListLayoutOptions = ListLayoutOp
     protected layoutNodes: Map<VirtualizerKey, LayoutNode>;
     protected rootNodes: LayoutNode[];
     protected contentSize: Size;
-    /** The region rows have been computed for. Everything outside it is only accounted for. */
-    protected requestedRect: Rect;
-    /** The part of `requestedRect` whose rows are known-good. */
-    protected validRect: Rect;
+    /** Where every root sits, whether or not it has ever been built. */
+    protected offsets: RowOffsets;
+    /** The window the rendered set was built for, in content coordinates. */
+    protected window: Rect;
     protected lastCollection: VirtualizerCollection | null;
     private invalidateEverything;
     constructor(options?: ListLayoutOptions);
     getContentSize(): Size;
     getLayoutInfo(key: VirtualizerKey): LayoutInfo | null;
+    /** Where every root sits, for a caller that needs an offset rather than a rendered node. */
+    getRowOffsets(): RowOffsets;
     /**
      * The rectangle grown to whole rows.
      *
      * Without this a one-pixel scroll would change which rows fall inside the rectangle, and the set
-     * of rendered elements would churn on every frame. A table snaps differently — its own row
-     * stride ignores the gap — so this is the one part of the walk a subclass replaces.
+     * of rendered elements would churn on every frame.
+     *
+     * The stride has to be the one rows are actually placed at, gap included, and the height has to
+     * absorb however far the top edge moved. Upstream's table snaps by the bare row height and lets
+     * the bottom edge fall wherever it lands, which costs a gap of coverage per screen — so a window
+     * arrived at by scrolling ends one gap short of where it was asked to reach.
      */
     protected snapVisibleRect(rect: Rect): Rect;
     /** Every layout info inside `rect`, snapped to whole rows, parents before children. */
@@ -77,21 +72,72 @@ export declare class ListLayout<Options extends ListLayoutOptions = ListLayoutOp
     /**
      * Records a row's measured size.
      *
-     * Returns whether anything moved, which is the virtualizer's cue to lay out again. The rows
-     * below this one are the ones that moved, so the valid region is cut off at this row's offset
-     * rather than thrown away entirely.
+     * Returns whether anything moved, which is the virtualizer's cue to lay out again. The size goes
+     * to the index rather than only onto the rendered node, so the rows below it move even though
+     * none of them is in the window, and so the row keeps its height when the window comes back.
      */
     updateItemSize(key: VirtualizerKey, size: Size): boolean;
+    /**
+     * Hands a measurement to the index, when it is a root that the index places.
+     *
+     * A table's cell is measured too, but a cell does not sit among the roots — its row does, and
+     * the row is measured by its tallest cell, so the row's own measurement is the one that lands.
+     */
+    protected recordMeasuredSize(layoutNode: LayoutNode, height: number): void;
     protected shouldInvalidateEverything(context: InvalidationContext<Options>): boolean;
-    /** Extends the computed region to cover `rect`, and to cover every persisted key. */
-    protected layoutIfNeeded(rect: Rect): void;
     /**
-     * Computes the whole layout when a key is asked about that the lazy pass never reached.
+     * The estimated size of a root, which is what the index places it at until it is measured.
+     */
+    protected estimatedSizeAt(index: number): number;
+    /** How many things the index places. The roots for a list; the body's children for a table. */
+    protected get placedCount(): number;
+    /** Points the index at the collection as it stands, which is what makes every offset answerable. */
+    protected configureOffsets(start?: number): void;
+    /**
+     * The roots that are rendered wherever the window is.
+     *
+     * Loaders, because a sentinel that is not in the DOM can never report that it came into view,
+     * so the next page would never be asked for. Persisted keys, because the roving tab stop lives
+     * on the focused row and losing its element drops focus to the document.
+     */
+    protected indicesPlacedOutsideTheWindow(): Set<number>;
+    /**
+     * Where the persisted keys sit among `keys`.
+     *
+     * A persisted key can be a cell as easily as a row — the roving tab stop lives on whichever
+     * element holds focus — and a cell needs its row placed or it has nowhere to live. So a key
+     * that is not one of these walks up until it finds the ancestor that is.
+     */
+    protected persistedIndices(keys: readonly VirtualizerKey[]): Set<number>;
+    /** Where the row at `index` sits. A lookup, for a row nobody has rendered as much as for one. */
+    protected rowOffset(index: number): number;
+    /**
+     * The root indices the pass places, in order.
+     *
+     * The window plus whatever has to exist outside it. There is nothing to walk to and nothing to
+     * account for afterwards: a row's offset is a lookup, so the rows above and below the window
+     * cost the pass nothing at all.
+     */
+    protected windowedIndices(rect: Rect): number[];
+    /** Builds the rendered set for a window, and drops what that window has left behind. */
+    protected layoutFor(rect: Rect): void;
+    /**
+     * Drops the rows the window has moved away from.
+     *
+     * Only rows and their cells: a table's header, its columns and its body are placed once and
+     * read by everything else, and a row that something still depends on — the one holding the
+     * roving tab stop — has to keep its element.
+     */
+    protected pruneLayoutNodes(): void;
+    /**
+     * Places a key the windowed pass never reached.
      *
-     * Pressing End, or restoring focus to a selected row, asks about a key at an arbitrary offset;
-     * there is no way to know where it sits without laying out everything above it.
+     * Pressing End, or restoring focus to a selected row, asks about a key at an arbitrary offset.
+     * That offset is a lookup whatever the rows are, so the one row is placed and nothing else is.
      */
     private ensureLayoutInfo;
+    /** Where the index puts a node, or `null` for one it does not place. */
+    protected indexedOffset(node: VirtualizerNode): number | null;
     private replaceLayoutInfo;
     protected buildCollection(offset?: number): LayoutNode[];
     protected buildChild(node: VirtualizerNode, x: number, y: number, parentKey: VirtualizerKey | null): LayoutNode;
@@ -100,9 +146,9 @@ export declare class ListLayout<Options extends ListLayoutOptions = ListLayoutOp
     /**
      * Whether a cached row can be reused as it stands.
      *
-     * Everything here has to hold: nothing global was invalidated, the datum is the same object,
-     * the row is at the same offset, it sits inside the known-good region, and the part of it that
-     * was computed covers the part now being asked about.
+     * Three things: nothing global was invalidated, the datum is the same object, and the row is
+     * still at the same offset. There is no region to be inside of any more — a row's offset comes
+     * from the index, so being at the offset the index gives it *is* the whole of being current.
      */
     protected isValid(node: VirtualizerNode, y: number): boolean;
     protected buildLoader(node: VirtualizerNode, x: number, y: number): LayoutNode;