@rivetjs/cdk 0.0.0-stage → 0.1.0-alpha.1

package/virtualizer/collection-renderer.d.ts

@@ -0,0 +1,62 @@
+import { type CollectionBranchProps, type CollectionRenderer, type CollectionRootProps } from "../collections/components.jsx";
+import type { Key } from "../collections/types.js";
+import { type LayoutInput, type VirtualizerModel } from "./behaviour.js";
+import { Rect } from "./rect.js";
+import { Size } from "./size.js";
+import type { Direction } from "./types.js";
+/** What the renderer's functions capture (plain data + the root's model, set when the host renders its root). */
+export interface VirtualizerLink<O = unknown> {
+    layout: LayoutInput<O>;
+    layoutOptions: O | undefined;
+    initialSize: {
+        width: number;
+        height: number;
+    };
+    dir: Direction | undefined;
+    /** The model of the host's `CollectionRoot` (one collection per Virtualizer). */
+    model: VirtualizerModel<unknown, O> | null;
+}
+/**
+ * The virtualized `CollectionRenderer` of `link` (one per link). Not read from `CollectionRendererContext` below the
+ * host: a resumed page re-creates a part's branch (a binding re-run) without the server's providers, where the
+ * context is the default renderer; the renderer object resumes from `link` instead.
+ */
+export declare function rendererOf(link: VirtualizerLink<any>): CollectionRenderer;
+/** The scroll handler hosts forward their scroll container's `scroll` events to (the engine starts on the first). */
+export declare function virtualizerLinkScroll(link: VirtualizerLink<any>, event: Event): void;
+/** RAC: the layout is the collection's layout delegate (keyboard Page Up / Down, range selection). */
+export declare function layoutRect(link: VirtualizerLink<any>, key: Key): Rect | null;
+export declare function layoutVisibleRect(link: VirtualizerLink<any>): Rect;
+export declare function layoutContentSize(link: VirtualizerLink<any>): Size;
+/** `CollectionRoot` of the virtualizer renderer: the sized content element and the root views. */
+export declare function VirtualizerRoot(props: {
+    link: VirtualizerLink<any>;
+    root: CollectionRootProps;
+}): import("@rivetjs/runtime/jsx-runtime").CompiledElement;
+/** `CollectionBranch` of the virtualizer renderer: the rendered child views of `parentKey`'s view. */
+export declare function VirtualizerBranch(props: {
+    link: VirtualizerLink<any>;
+    branch: CollectionBranchProps;
+}): unknown;
+/**
+ * RAC `Virtualizer` for a collection component: wraps one `ListBox` / `GridList` / `Menu` / `Tree` / `Table` and renders its collection with
+ * `layout` — only the views in the visible rect (plus overscan and the focused item) are in the DOM. The component's
+ * own element is the scroll container (give it a height and `overflow: auto`).
+ */
+export interface CollectionVirtualizerProps<O> {
+    /** The collection component (`<ListBox>`, `<GridList>`, `<Menu>`, `<Tree>`, `<Table>`). */
+    children: unknown;
+    /** Layout class (`ListLayout`, `TableLayout`, `GridLayout`, `WaterfallLayout`) or factory (`() => new ListLayout()`). */
+    layout: LayoutInput<O>;
+    /** Options for the layout (JSON: `{ rowHeight: 48 }`). */
+    layoutOptions?: O;
+    /** Rivet: viewport size of the server-rendered window: the scroll container's client size (inside the borders, padding included; a resumed page keeps it until its first interaction). Default 800 x 600. */
+    initialSize?: {
+        width: number;
+        height: number;
+    };
+    /** Rivet: text direction of view positions (`left` / `right`); default: logical `inset-inline-start`. */
+    dir?: Direction;
+}
+/** Provides the virtualized `CollectionRenderer` (layout = layout delegate) to its child collection. */
+export declare function CollectionVirtualizer<O = unknown>(props: CollectionVirtualizerProps<O>): import("@rivetjs/runtime/jsx-runtime").CompiledElement;

package/virtualizer/collection-renderer.jsx

@@ -0,0 +1,190 @@
+// `<CollectionVirtualizer>`: the react-aria-components `Virtualizer` (src/Virtualizer.tsx: the
+// `CollectionRenderer` with `CollectionRoot` / `CollectionBranch` over useVirtualizerState + useScrollView, and
+// VirtualizerItem / useVirtualizerItem; React Spectrum, Apache-2.0, © Adobe) for the cdk collection components:
+// `<CollectionVirtualizer layout={ListLayout}><ListBox …/></CollectionVirtualizer>`, `<CollectionVirtualizer layout={TableLayout}><Table …/></CollectionVirtualizer>`.
+// Hosts: ListBox (+ sections), GridList (ListLayout / GridLayout), Menu, Tree (flattened rows), Table.
+// A separate component from the standalone `<Virtualizer items>` (`./virtualizer.tsx`) so items users (Masonry) ship none of this.
+// Rivet:
+// - The host (ListBox, GridList, Menu, Tree, Table) builds its collection and passes an accessor of it to `CollectionRoot` with its
+//   scroll container (`scrollRef`, the host element) and its focused key (`focusedKey`, persisted); the engine
+//   is the standalone component's driver (`./behaviour.ts`): the server renders the first window at `initialSize`,
+//   the browser starts the engine on the first scroll (the host forwards its `scroll` events to `onScroll`), focus
+//   move (a persisted key) or layout delegate call (keyboard Page Up / Down).
+// - Every view renders in a wrapper `div[role=presentation]` (VirtualizerItem: `data-rv-view`, `data-rv-type`,
+//   absolute / sticky position from the layout); the node's part renders inside it (`node.render(node)`) with this
+//   renderer provided, so a part rendering its children (`CollectionBranch`: sections, table rows / cells) gets
+//   the child views of its own view.
+// - Resume: the renderer object's functions capture only `link` (layout factory, options, the root's model);
+//   the model holds signals, the host's collection accessor, its focused key signal and its scroll ref.
+// Deviations: no drop indicators (DnD); no window scrolling; rows are keyed by collection key (no DOM recycling
+// across items, as the standalone component); a layout instance is not accepted (a class or a factory: the
+// instance would be serialized).
+import { computed, signal, untrack } from "@rivetjs/reactivity";
+import { For, Provider } from "@rivetjs/runtime/dom";
+import { CollectionRendererContext, DefaultCollectionRenderer, resumedKeys, sameRender, serverRows, } from "../collections/components.jsx";
+import { rowKey } from "../collections/row-stamps.js";
+import { childViews, contentStyle, driverOf, initialWindow, ROOT_VIEW, rowOrder, viewOf, visibleViews, } from "./behaviour.js";
+import { Rect } from "./rect.js";
+import { Size } from "./size.js";
+const engineOf = (link) => (link.model ? (driverOf(link.model)?.state.virtualizer ?? null) : null);
+let renderers;
+/**
+ * The virtualized `CollectionRenderer` of `link` (one per link). Not read from `CollectionRendererContext` below the
+ * host: a resumed page re-creates a part's branch (a binding re-run) without the server's providers, where the
+ * context is the default renderer; the renderer object resumes from `link` instead.
+ */
+export function rendererOf(link) {
+    let renderer = (renderers ??= new WeakMap()).get(link);
+    if (!renderer)
+        renderers.set(link, (renderer = VirtualizerRenderer(link)));
+    return renderer;
+}
+/** A PascalCase factory: its object-literal arrows are resumable closures over `link` only. */
+function VirtualizerRenderer(link) {
+    return {
+        isVirtualized: true,
+        // RAC: the layout is the collection's layout delegate (keyboard Page Up / Down, range selection).
+        layoutDelegate: {
+            getItemRect: (key) => layoutRect(link, key),
+            getVisibleRect: () => layoutVisibleRect(link),
+            getContentSize: () => layoutContentSize(link),
+        },
+        CollectionRoot: (root) => <VirtualizerRoot link={link} root={root}/>,
+        CollectionBranch: (branch) => <VirtualizerBranch link={link} branch={branch}/>,
+        onScroll: (event) => virtualizerLinkScroll(link, event),
+    };
+}
+/** The scroll handler hosts forward their scroll container's `scroll` events to (the engine starts on the first). */
+export function virtualizerLinkScroll(link, event) {
+    const model = link.model;
+    if (!model)
+        return;
+    const driver = driverOf(model, event.currentTarget);
+    driver?.scrollView.onScroll(event);
+}
+/** RAC: the layout is the collection's layout delegate (keyboard Page Up / Down, range selection). */
+export function layoutRect(link, key) {
+    return engineOf(link)?.layout.getLayoutInfo(key)?.rect ?? null;
+}
+export function layoutVisibleRect(link) {
+    return engineOf(link)?.visibleRect ?? new Rect();
+}
+export function layoutContentSize(link) {
+    return engineOf(link)?.layout.getContentSize() ?? new Size();
+}
+const isServer = typeof document === "undefined";
+/**
+ * The node at `key` of the host's collection. As `renderNodeAt`: server once, untracked; browser a region that keeps
+ * the part while the node renders the same (`sameRender`).
+ */
+function renderNode(model, key) {
+    const at = () => model.source?.()?.getItem(key) ?? null;
+    if (isServer)
+        return untrack(() => {
+            const n = at();
+            return n?.render ? n.render(n) : null;
+        });
+    const node = computed(at, { equals: sameRender });
+    return () => {
+        node();
+        const n = untrack(at);
+        return n?.render ? untrack(() => n.render(n)) : null;
+    };
+}
+/**
+ * VirtualizerItem: one view's wrapper (position + size of its layout info) and its node's part, rendered with this
+ * renderer provided (a `Provider` binding: a part's lazily evaluated content still sees it) — a part rendering its
+ * children (`CollectionBranch`: sections, table rows / cells) gets the child views of its own view.
+ */
+function VirtualizerView(props) {
+    const { model, renderer, viewKey, views } = props;
+    const view = () => viewOf(model, views(), viewKey);
+    return (<div role="presentation" class="rv-Virtualizer-item" data-rv-view={String(viewKey)} data-rv-type={view().type} style={view().style}>
+      <Provider token={CollectionRendererContext} value={renderer}>
+        {renderNode(model, viewKey)}
+      </Provider>
+    </div>);
+}
+/**
+ * Lazy collection rows (`resume.lazyRows`, LAZY-T6): a loop over container views — a section, a table's header / body
+ * (views whose children have children) — is not the lazy `For`; the collection's rows below it are (a lazy row is one
+ * option / table row, not the whole table). Read by the server's lazy rows only.
+ */
+const leafViews = (views) => !views.some((view) => view.type === "section" || view.children.some((child) => child.children.length > 0));
+/**
+ * The keyed `For` of the rendered views below `parent` (the root / a section / a table body). Resumed page: an adopted view
+ * whose node changed since the server render is re-created (ROW-RERENDER, `resumedKeys`) — called in the region read that
+ * creates the For, so its `serverRows` baseline is recorded with (and adopted by) the For's region.
+ */
+function viewRows(model, parent, views, renderer, parentType) {
+    const order = () => rowOrder(model, parent, views());
+    const source = model.source, each = resumedKeys(source, serverRows(source, order, parentType), order);
+    return (<For each={each} by={(key) => key} lazy={() => leafViews(views())}>
+      {(key) => <VirtualizerView model={model} renderer={renderer} viewKey={rowKey(untrack(key))} views={views}/>}
+    </For>);
+}
+/** `CollectionRoot` of the virtualizer renderer: the sized content element and the root views. */
+export function VirtualizerRoot(props) {
+    const { link, root } = props;
+    const renderer = rendererOf(link);
+    const collection = root.collection;
+    const scrollRef = root.scrollRef;
+    const model = {
+        id: "",
+        items: [],
+        source: typeof collection === "function" ? collection : undefined,
+        focus: root.focusedKey,
+        scrollRef: typeof scrollRef === "function" ? scrollRef : undefined,
+        // The class / factory itself (a module reference or a resumable function), never a closure over `link`.
+        layout: link.layout,
+        layoutOptions: link.layoutOptions,
+        collection: {},
+        initialSize: link.initialSize,
+        dir: link.dir,
+        loadMoreOffset: 1,
+        shouldObserveItemSize: false,
+        persistedKeys: [],
+        focusedKey: signal(null),
+        views: signal([]),
+        contentSize: signal({ width: 0, height: 0 }),
+        isScrolling: signal(false),
+    };
+    if (!model.source)
+        throw new Error("Virtualizer: the collection component must pass its built collection (an accessor) to CollectionRoot.");
+    link.model = model;
+    // Untracked: the body must not depend on the collection / focused key (a resumed page would re-create the
+    // root, its content element and the focused option on the first focus move).
+    const first = untrack(() => initialWindow(model));
+    model.views.set(first.views);
+    model.contentSize.set(first.contentSize);
+    const rootViews = () => visibleViews(model);
+    return (<div role="presentation" class="rv-Virtualizer-content" style={contentStyle(model)}>
+      {viewRows(model, ROOT_VIEW, rootViews, renderer)}
+    </div>);
+}
+/** `CollectionBranch` of the virtualizer renderer: the rendered child views of `parentKey`'s view. */
+export function VirtualizerBranch(props) {
+    const link = props.link;
+    const model = link.model;
+    const renderer = rendererOf(link);
+    // A part rendered outside the window (no root yet): render its children as the default renderer would.
+    if (!model)
+        return DefaultCollectionRenderer.CollectionBranch(props.branch);
+    const parentKey = props.branch.parent.key;
+    const parentType = untrack(() => model.source?.()?.getItem(parentKey)?.type);
+    return viewRows(model, parentKey, () => childViews(model, parentKey), renderer, parentType);
+}
+/** Provides the virtualized `CollectionRenderer` (layout = layout delegate) to its child collection. */
+export function CollectionVirtualizer(props) {
+    const link = {
+        layout: props.layout,
+        layoutOptions: props.layoutOptions,
+        initialSize: props.initialSize ?? { width: 800, height: 600 },
+        dir: props.dir,
+        model: null,
+    };
+    const renderer = rendererOf(link);
+    return (<Provider token={CollectionRendererContext} value={renderer}>
+      {props.children}
+    </Provider>);
+}

package/virtualizer/collection.d.ts

@@ -0,0 +1,103 @@
+import type { Key } from "../collections/index.js";
+export interface Node<T> {
+    /** The type of item this node represents (`item`, `section`, `header`, `loader`, `separator`, …). */
+    type: string;
+    /** A unique key for the node. */
+    key: Key;
+    /** The object value the node was created from. */
+    value: T | null;
+    /** The level of depth this node is at in the hierarchy. */
+    level: number;
+    /** Whether this item has children, even if not loaded yet. */
+    hasChildNodes: boolean;
+    /** The loaded children of this node (prefer `collection.getChildren(node.key)`). */
+    childNodes: Iterable<Node<T>>;
+    /** Rendered contents marker; layouts only test it for truthiness (headers). */
+    rendered: unknown;
+    /** A string value for this node, used for features like typeahead. */
+    textValue: string;
+    /** An accessibility label for this node. */
+    "aria-label"?: string;
+    /** The index of this node within its parent. */
+    index: number;
+    /** The key of the parent node. */
+    parentKey?: Key | null;
+    /** The key of the node before this node. */
+    prevKey?: Key | null;
+    /** The key of the node after this node. */
+    nextKey?: Key | null;
+    /** The first child key of this node. */
+    firstChildKey?: Key | null;
+    /** The last child key of this node. */
+    lastChildKey?: Key | null;
+    /** Additional properties specific to a particular node type (loaders: `isLoading`; columns: widths). */
+    props?: any;
+}
+/** A readonly sequential collection of unique keyed items (iterates the top-level nodes). */
+export interface Collection<T> extends Iterable<T> {
+    /** The number of items (and sections) in the collection. */
+    readonly size: number;
+    /** Iterate over all keys in the collection. */
+    getKeys(): Iterable<Key>;
+    /** Get an item by its key. */
+    getItem(key: Key): T | null;
+    /** Get an item by the index of its key. */
+    at(idx: number): T | null;
+    /** Get the key that comes before the given key in the collection. */
+    getKeyBefore(key: Key): Key | null;
+    /** Get the key that comes after the given key in the collection. */
+    getKeyAfter(key: Key): Key | null;
+    /** Get the first key in the collection. */
+    getFirstKey(): Key | null;
+    /** Get the last key in the collection. */
+    getLastKey(): Key | null;
+    /** Iterate over the child items of the given key. */
+    getChildren?(key: Key): Iterable<T>;
+    /** Returns a string representation of the item's contents. */
+    getTextValue?(key: Key): string;
+}
+/** Collection over nodes: sections are flattened into the key map, `size` counts items and sections. */
+export declare class ListCollection<T> implements Collection<Node<T>> {
+    private keyMap;
+    private iterable;
+    private firstKey;
+    private lastKey;
+    private _size;
+    constructor(nodes: Iterable<Node<T>>);
+    [Symbol.iterator](): IterableIterator<Node<T>>;
+    get size(): number;
+    getKeys(): IterableIterator<Key>;
+    getKeyBefore(key: Key): Key | null;
+    getKeyAfter(key: Key): Key | null;
+    getFirstKey(): Key | null;
+    getLastKey(): Key | null;
+    getItem(key: Key): Node<T> | null;
+    at(idx: number): Node<T> | null;
+    getChildren(key: Key): Iterable<Node<T>>;
+    getTextValue(key: Key): string;
+}
+export interface CollectionOptions<T> {
+    /** Item key (default: `item.key ?? item.id`, or the item itself for strings / numbers). */
+    getKey?: (item: T, index: number) => Key;
+    /** Node type (default: `item.type ?? "item"`). Sections (`"section"`) hold `getChildren(item)` nodes. */
+    getType?: (item: T) => string;
+    /** Children of a section (default `item.children`). */
+    getChildren?: (item: T) => Iterable<T> | null | undefined;
+    /** Typeahead text (default `item.textValue ?? item.label ?? String(item)`). */
+    getTextValue?: (item: T) => string;
+    /** Extra node props (default `item.props ?? {}`; columns read `width` / `minWidth` / `maxWidth` there). */
+    getProps?: (item: T) => any;
+}
+/** Default key of an item: `key`, else `id`, else the primitive itself. */
+export declare function itemKey(item: unknown, index: number): Key;
+/** Nodes of `items` (sections recurse into their children; `level` / `parentKey` / `index` set). */
+export declare function buildNodes<T>(items: Iterable<T>, options?: CollectionOptions<T>, parentKey?: Key | null, level?: number): Node<T>[];
+/** A loader sentinel node ("load more"), rendered after the items; `isLoading` reserves the loader size. */
+export declare function loaderNode<T>(key: Key, isLoading: boolean, parentKey?: Key | null): Node<T>;
+/** A collection from plain items (see `CollectionOptions`); `extra` nodes (e.g. a loader) are appended. */
+export declare function createCollection<T>(items: Iterable<T>, options?: CollectionOptions<T>, extra?: Node<T>[]): ListCollection<T>;
+/** Children of `node` (`collection.getChildren` when available, else `node.childNodes`). */
+export declare function getChildNodes<T>(node: Node<T>, collection: Collection<Node<T>>): Iterable<Node<T>>;
+export declare function getFirstItem<T>(iterable: Iterable<T>): T | undefined;
+export declare function getNthItem<T>(iterable: Iterable<T>, index: number): T | undefined;
+export declare function getLastItem<T>(iterable: Iterable<T>): T | undefined;

package/virtualizer/collection.js

@@ -0,0 +1,155 @@
+/** Collection over nodes: sections are flattened into the key map, `size` counts items and sections. */
+export class ListCollection {
+    keyMap = new Map();
+    iterable;
+    firstKey = null;
+    lastKey;
+    _size;
+    constructor(nodes) {
+        this.iterable = nodes;
+        const visit = (node) => {
+            this.keyMap.set(node.key, node);
+            if (node.childNodes && node.type === "section")
+                for (const child of node.childNodes)
+                    visit(child);
+        };
+        for (const node of nodes)
+            visit(node);
+        let last = null;
+        let index = 0;
+        let size = 0;
+        for (const [key, node] of this.keyMap) {
+            if (last) {
+                last.nextKey = key;
+                node.prevKey = last.key;
+            }
+            else {
+                this.firstKey = key;
+                node.prevKey = undefined;
+            }
+            if (node.type === "item")
+                node.index = index++;
+            // Only sections and items count, so loaders and separators don't influence the empty state.
+            if (node.type === "section" || node.type === "item")
+                size++;
+            last = node;
+            last.nextKey = undefined;
+        }
+        this._size = size;
+        this.lastKey = last?.key ?? null;
+    }
+    *[Symbol.iterator]() {
+        yield* this.iterable;
+    }
+    get size() {
+        return this._size;
+    }
+    getKeys() {
+        return this.keyMap.keys();
+    }
+    getKeyBefore(key) {
+        return this.keyMap.get(key)?.prevKey ?? null;
+    }
+    getKeyAfter(key) {
+        return this.keyMap.get(key)?.nextKey ?? null;
+    }
+    getFirstKey() {
+        return this.firstKey;
+    }
+    getLastKey() {
+        return this.lastKey;
+    }
+    getItem(key) {
+        return this.keyMap.get(key) ?? null;
+    }
+    at(idx) {
+        const keys = [...this.getKeys()];
+        return keys[idx] === undefined ? null : this.getItem(keys[idx]);
+    }
+    getChildren(key) {
+        return this.keyMap.get(key)?.childNodes || [];
+    }
+    getTextValue(key) {
+        return this.keyMap.get(key)?.textValue ?? "";
+    }
+}
+const field = (item, name) => (item != null && typeof item === "object" ? item[name] : undefined);
+/** Default key of an item: `key`, else `id`, else the primitive itself. */
+export function itemKey(item, index) {
+    if (item == null || typeof item !== "object")
+        return typeof item === "number" || typeof item === "string" ? item : index;
+    return field(item, "key") ?? field(item, "id") ?? index;
+}
+/** Nodes of `items` (sections recurse into their children; `level` / `parentKey` / `index` set). */
+export function buildNodes(items, options = {}, parentKey = null, level = 0) {
+    const nodes = [];
+    let index = 0;
+    for (const item of items) {
+        const key = options.getKey ? options.getKey(item, index) : itemKey(item, index);
+        const type = options.getType?.(item) ?? field(item, "type") ?? "item";
+        const children = type === "section" ? (options.getChildren?.(item) ?? field(item, "children")) : null;
+        const childNodes = children ? buildNodes(children, options, key, level + 1) : [];
+        const text = options.getTextValue?.(item) ?? field(item, "textValue") ?? field(item, "label") ?? (typeof item === "object" ? "" : String(item));
+        nodes.push({
+            type,
+            key,
+            value: item,
+            level,
+            hasChildNodes: childNodes.length > 0,
+            childNodes,
+            rendered: true,
+            textValue: String(text),
+            index: index++,
+            parentKey,
+            firstChildKey: childNodes[0]?.key ?? null,
+            lastChildKey: childNodes.at(-1)?.key ?? null,
+            props: options.getProps?.(item) ?? field(item, "props") ?? {},
+        });
+    }
+    return nodes;
+}
+/** A loader sentinel node ("load more"), rendered after the items; `isLoading` reserves the loader size. */
+export function loaderNode(key, isLoading, parentKey = null) {
+    return {
+        type: "loader",
+        key,
+        value: null,
+        level: 0,
+        hasChildNodes: false,
+        childNodes: [],
+        rendered: true,
+        textValue: "",
+        index: 0,
+        parentKey,
+        props: { isLoading },
+    };
+}
+/** A collection from plain items (see `CollectionOptions`); `extra` nodes (e.g. a loader) are appended. */
+export function createCollection(items, options = {}, extra = []) {
+    return new ListCollection([...buildNodes(items, options), ...extra]);
+}
+/** Children of `node` (`collection.getChildren` when available, else `node.childNodes`). */
+export function getChildNodes(node, collection) {
+    if (typeof collection.getChildren === "function")
+        return collection.getChildren(node.key);
+    return node.childNodes;
+}
+export function getFirstItem(iterable) {
+    return getNthItem(iterable, 0);
+}
+export function getNthItem(iterable, index) {
+    if (index < 0)
+        return undefined;
+    let i = 0;
+    for (const item of iterable) {
+        if (i === index)
+            return item;
+        i++;
+    }
+}
+export function getLastItem(iterable) {
+    let lastItem = undefined;
+    for (const value of iterable)
+        lastItem = value;
+    return lastItem;
+}

package/virtualizer/dom.d.ts

@@ -0,0 +1,50 @@
+import type { StyleObject } from "@rivetjs/runtime/style";
+import type { Key } from "../collections/index.js";
+import type { LayoutInfo } from "./layout-info.js";
+import { Rect } from "./rect.js";
+import { Size } from "./size.js";
+import type { Direction } from "./types.js";
+export type RTLOffsetType = "negative" | "positive-descending" | "positive-ascending";
+/**
+ * How the browser reports `scrollLeft` of RTL elements (spec: negative; old Chrome: positive from the left;
+ * old WebKit/IE: positive from the right). Detected once by scrolling a probe element.
+ */
+export declare function getRTLOffsetType(recalculate?: boolean): RTLOffsetType;
+/** `scrollLeft` normalized to a distance from the inline start (RTL-safe). */
+export declare function getScrollLeft(node: Element, direction: Direction): number;
+/** Set `scrollLeft` from a distance from the inline start (RTL-safe). */
+export declare function setScrollLeft(node: Element, direction: Direction, scrollLeft: number): void;
+/**
+ * Absolute (or sticky) position style of a view, relative to its parent view. `dir` picks `left` / `right`;
+ * without `dir` the inline-start offset is the logical `inset-inline-start` (RTL without JS).
+ */
+export declare function layoutInfoToStyle(layoutInfo: LayoutInfo, dir?: Direction | null, parent?: LayoutInfo | null): StyleObject;
+/** Intrinsic size of a view element (its fixed height reset while measuring). */
+export declare function getSize(node: HTMLElement): Size;
+/** Whether `element` is rendered and visible (hidden virtualizers must not report 0 sizes). */
+export declare function isElementVisible(element: Element): boolean;
+/** useVirtualizerItem's measurement: report the view's measured size (only while visible). */
+export declare function measureItem(virtualizer: {
+    updateItemSize(key: Key, size: Size): void;
+}, key: Key, element: HTMLElement): void;
+export interface ScrollViewOptions {
+    /** Current content size (scroll position is clamped to it). */
+    contentSize(): Size;
+    onVisibleRectChange(rect: Rect): void;
+    onSizeChange?(size: Size): void;
+    onScrollStart?(): void;
+    onScrollEnd?(): void;
+    allowsWindowScrolling?: boolean;
+    /** Text direction of the scroller (scrollLeft normalization). */
+    direction(): Direction;
+}
+export interface ScrollView {
+    /** Handle a scroll event (of the scroller, an ancestor or the window). */
+    onScroll(event: Event): void;
+    /** Re-measure the scroller (resize observer / window resize / content size change). */
+    updateSize(): void;
+    readonly isScrolling: boolean;
+    dispose(): void;
+}
+/** useScrollView as a controller for `element`: visible rect from scroll position + size, scroll start / end (300 ms). */
+export declare function createScrollView(element: HTMLElement, options: ScrollViewOptions): ScrollView;