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

package/scroll-area/presence.d.ts

@@ -0,0 +1,12 @@
+import { type Signal } from "@rivetjs/reactivity";
+export type PresenceState = "mounted" | "unmountSuspended" | "unmounted";
+export interface PresenceOptions {
+    /** Whether the part should be present (an accessor). */
+    present: () => boolean;
+    /** The part's element (a `ref()` signal). */
+    node: () => HTMLElement | undefined;
+}
+/** Radix `usePresence(present).isPresent`. */
+export declare const isPresent: (state: PresenceState) => boolean;
+/** Radix `usePresence`: the presence state of a part (render it while `isPresent(state())`). */
+export declare function createPresence(options: PresenceOptions): Signal<PresenceState>;

package/scroll-area/presence.jsx

@@ -0,0 +1,131 @@
+// Ported from @radix-ui/react-presence 1.1.11 (src/presence.tsx, src/use-state-machine.tsx), MIT, © 2022 WorkOS
+// (https://github.com/radix-ui/primitives packages/react/presence; read from the published tarball's source map).
+// Radix `Presence`: keeps a part mounted while its exit animation runs. State machine `mounted` / `unmountSuspended` /
+// `unmounted`; `present` turning false unmounts at once unless the node's computed `animation-name` changed (an exit
+// animation started: `unmountSuspended` until `animationend` / `animationcancel` of the current animation, which also
+// sets `animation-fill-mode: forwards` for a frame so the last keyframe does not flash); no node → `ANIMATION_END`.
+// Rivet:
+// - `createPresence({ present, node })` returns the state signal; the part renders `<Show when={() => isPresent(state())}>`.
+//   `node` is the part's element ref (Radix clones the child with its own ref); `present` is an object-literal accessor
+//   (resumable: an argument arrow would not serialize).
+// - React's ref callback (reads the computed style when the node attaches) + `[node]` layout effect = one `clientEffect`
+//   over `node()`; the `[present]` layout effect = a `clientEffect` over `present()` whose body runs in a microtask, after
+//   the bindings of the same change (`data-state`) have updated the DOM — React runs layout effects after the commit;
+//   the `[state]` passive effect waits for the node (React: the child mounts before passive effects run).
+// - Server / before the effects run: the state is `mounted` when `present` is true at creation, else `unmounted`.
+// - `useStableComposedRefs` / `getElementRef` (React 19 ref plumbing) not needed.
+import { _regionState, signal, untrack } from "@rivetjs/reactivity";
+import { clientEffect } from "@rivetjs/runtime/dom";
+import { cssEscape } from "../utils/dom.js";
+const MACHINE = {
+    mounted: { UNMOUNT: "unmounted", ANIMATION_OUT: "unmountSuspended" },
+    unmountSuspended: { MOUNT: "mounted", ANIMATION_END: "unmounted" },
+    unmounted: { MOUNT: "mounted" },
+};
+/** Radix `useStateMachine` reducer step: the next state, or the same state for an event it does not handle. */
+function send(state, event) {
+    const next = MACHINE[untrack(state)][event];
+    if (next)
+        state.set(next);
+}
+/** Radix `usePresence(present).isPresent`. */
+export const isPresent = (state) => state === "mounted" || state === "unmountSuspended";
+function getAnimationName(styles) {
+    return styles?.animationName || "none";
+}
+/** Radix `usePresence`: the presence state of a part (render it while `isPresent(state())`). */
+export function createPresence(options) {
+    const initial = untrack(options.present);
+    // Component-owned (`_regionState`): a part re-created on a resumed page continues from the server's values.
+    const state = _regionState(() => signal(initial ? "mounted" : "unmounted"));
+    // Radix refs: stylesRef, prevPresentRef, prevAnimationNameRef, mountAnimationNameRef (plain data: resumes as one object).
+    const memo = _regionState(() => ({ prevPresent: initial, prevAnimationName: "none", mountAnimationName: undefined }));
+    // `[state]` passive effect: the animation name at mount (captured when the node attached) becomes the previous one.
+    clientEffect(() => {
+        const current = state();
+        const node = options.node();
+        untrack(() => {
+            if (current === "mounted") {
+                if (!node)
+                    return;
+                memo.prevAnimationName = memo.mountAnimationName ?? getAnimationName(getComputedStyle(node));
+                memo.mountAnimationName = undefined;
+            }
+            else
+                memo.prevAnimationName = "none";
+        });
+    });
+    // `[present]` layout effect.
+    clientEffect(() => {
+        const present = options.present();
+        queueMicrotask(() => {
+            const wasPresent = memo.prevPresent;
+            if (wasPresent === present)
+                return;
+            const node = untrack(options.node);
+            const styles = node ? getComputedStyle(node) : null;
+            const prevAnimationName = memo.prevAnimationName;
+            const currentAnimationName = getAnimationName(styles);
+            if (present) {
+                memo.mountAnimationName = node ? currentAnimationName : undefined;
+                send(state, "MOUNT");
+            }
+            else if (currentAnimationName === "none" || styles?.display === "none") {
+                // No exit animation or the element is hidden: animations won't run, unmount at once.
+                send(state, "UNMOUNT");
+            }
+            else {
+                // An exit animation started when the animation name changed (there is no `animationrun` event and
+                // `animationstart` fires after `animation-delay`).
+                const isAnimating = prevAnimationName !== currentAnimationName;
+                send(state, wasPresent && isAnimating ? "ANIMATION_OUT" : "UNMOUNT");
+            }
+            memo.prevPresent = present;
+        });
+    });
+    // Ref callback + `[node]` layout effect: animation listeners on the node.
+    clientEffect(() => {
+        const node = options.node();
+        if (!node) {
+            // The node was removed prematurely.
+            untrack(() => send(state, "ANIMATION_END"));
+            return;
+        }
+        const styles = getComputedStyle(node);
+        memo.mountAnimationName = getAnimationName(styles);
+        let timeoutId = 0;
+        const ownerWindow = node.ownerDocument.defaultView ?? window;
+        // Triggering ANIMATION_OUT during an enter animation fires `animationcancel` for the enter animation after
+        // `unmountSuspended`: only the current animation ends the exit.
+        const handleAnimationEnd = (event) => {
+            const currentAnimationName = getAnimationName(styles);
+            const isCurrentAnimation = currentAnimationName.includes(cssEscape(event.animationName));
+            if (event.target === node && isCurrentAnimation) {
+                send(state, "ANIMATION_END");
+                if (!memo.prevPresent) {
+                    // Keep the last keyframe until the node is gone (no flash), then restore the fill mode.
+                    const currentFillMode = node.style.animationFillMode;
+                    node.style.animationFillMode = "forwards";
+                    timeoutId = ownerWindow.setTimeout(() => {
+                        if (node.style.animationFillMode === "forwards")
+                            node.style.animationFillMode = currentFillMode;
+                    });
+                }
+            }
+        };
+        const handleAnimationStart = (event) => {
+            if (event.target === node)
+                memo.prevAnimationName = getAnimationName(styles);
+        };
+        node.addEventListener("animationstart", handleAnimationStart);
+        node.addEventListener("animationcancel", handleAnimationEnd);
+        node.addEventListener("animationend", handleAnimationEnd);
+        return () => {
+            ownerWindow.clearTimeout(timeoutId);
+            node.removeEventListener("animationstart", handleAnimationStart);
+            node.removeEventListener("animationcancel", handleAnimationEnd);
+            node.removeEventListener("animationend", handleAnimationEnd);
+        };
+    });
+    return state;
+}

package/scrolling/auto-size-virtual-scroll.d.ts

@@ -0,0 +1,53 @@
+import { type Stream } from "./emitter.js";
+import type { ListRange, VirtualScrollStrategy, VirtualScrollStrategyViewport } from "./virtual-scroll-strategy.js";
+/** Tracks the size of items that have been seen and estimates the average item size. */
+export declare class ItemSizeAverager {
+    /** The total amount of weight behind the current average. */
+    private _totalWeight;
+    private _averageItemSize;
+    private _defaultItemSize;
+    /** @param defaultItemSize The default size to use for items when no data is available. */
+    constructor(defaultItemSize?: number);
+    getAverageItemSize(): number;
+    /** Adds a measurement sample: `size` pixels for `range`. */
+    addSample(range: ListRange, size: number): void;
+    reset(): void;
+}
+/** Virtual scrolling strategy for lists with items of unknown or dynamic size. */
+export declare class AutoSizeVirtualScrollStrategy implements VirtualScrollStrategy {
+    scrolledIndexChange: Stream<number>;
+    private _viewport;
+    private _minBufferPx;
+    private _maxBufferPx;
+    private _averager;
+    private _lastScrollOffset;
+    private _lastRenderedContentSize;
+    private _lastRenderedContentOffset;
+    /** Consecutive cycles where removing extra items failed (estimate too aggressive). */
+    private _removalFailures;
+    /**
+     * @param minBufferPx Minimum buffer beyond the viewport (px); below it more items render.
+     * @param maxBufferPx Buffer to shoot for when rendering new items (px).
+     * @param averager Estimates the size of unseen items.
+     */
+    constructor(minBufferPx: number, maxBufferPx: number, averager?: ItemSizeAverager);
+    attach(viewport: VirtualScrollStrategyViewport): void;
+    detach(): void;
+    onContentScrolled(): void;
+    onDataLengthChanged(): void;
+    onContentRendered(): void;
+    onRenderedOffsetChanged(): void;
+    scrollToIndex(): void;
+    /** Update the buffer parameters. */
+    updateBufferSize(minBufferPx: number, maxBufferPx: number): void;
+    private _updateRenderedContentAfterScroll;
+    /** Measure the rendered content, update the size estimate and the total content size. */
+    private _checkRenderedContentSize;
+    private _checkRenderedContentOffset;
+    /** Render what the estimate says belongs at the current scroll offset. */
+    private _renderContentForCurrentOffset;
+    /** Visible range starting at `startIndex`, backed up near the end so it fills the viewport. */
+    private _getVisibleRangeForIndex;
+    private _expandRange;
+    private _updateTotalContentSize;
+}

package/scrolling/auto-size-virtual-scroll.js

@@ -0,0 +1,213 @@
+// Ported from Angular Components (src/cdk-experimental/scrolling/auto-size-virtual-scroll.ts), MIT,
+// © Google LLC. Rivet: `CdkAutoSizeVirtualScroll` inputs (minBufferPx 100, maxBufferPx 200) are
+// `createVirtualScroll({ autosize: true })` options; strategy logic unchanged.
+import { stream } from "./emitter.js";
+/** Tracks the size of items that have been seen and estimates the average item size. */
+export class ItemSizeAverager {
+    /** The total amount of weight behind the current average. */
+    _totalWeight = 0;
+    _averageItemSize;
+    _defaultItemSize;
+    /** @param defaultItemSize The default size to use for items when no data is available. */
+    constructor(defaultItemSize = 50) {
+        this._defaultItemSize = defaultItemSize;
+        this._averageItemSize = defaultItemSize;
+    }
+    getAverageItemSize() {
+        return this._averageItemSize;
+    }
+    /** Adds a measurement sample: `size` pixels for `range`. */
+    addSample(range, size) {
+        const newTotalWeight = this._totalWeight + range.end - range.start;
+        if (newTotalWeight) {
+            const newAverageItemSize = (size + this._averageItemSize * this._totalWeight) / newTotalWeight;
+            if (newAverageItemSize) {
+                this._averageItemSize = newAverageItemSize;
+                this._totalWeight = newTotalWeight;
+            }
+        }
+    }
+    reset() {
+        this._averageItemSize = this._defaultItemSize;
+        this._totalWeight = 0;
+    }
+}
+/** Virtual scrolling strategy for lists with items of unknown or dynamic size. */
+export class AutoSizeVirtualScrollStrategy {
+    scrolledIndexChange = stream(() => {
+        throw Error("cdk-virtual-scroll: scrolledIndexChange is currently not supported for the autosize scroll strategy");
+    });
+    _viewport = null;
+    _minBufferPx;
+    _maxBufferPx;
+    _averager;
+    _lastScrollOffset;
+    _lastRenderedContentSize;
+    _lastRenderedContentOffset;
+    /** Consecutive cycles where removing extra items failed (estimate too aggressive). */
+    _removalFailures = 0;
+    /**
+     * @param minBufferPx Minimum buffer beyond the viewport (px); below it more items render.
+     * @param maxBufferPx Buffer to shoot for when rendering new items (px).
+     * @param averager Estimates the size of unseen items.
+     */
+    constructor(minBufferPx, maxBufferPx, averager = new ItemSizeAverager()) {
+        this._minBufferPx = minBufferPx;
+        this._maxBufferPx = maxBufferPx;
+        this._averager = averager;
+    }
+    attach(viewport) {
+        this._averager.reset();
+        this._viewport = viewport;
+        this._renderContentForCurrentOffset();
+    }
+    detach() {
+        this._viewport = null;
+    }
+    onContentScrolled() {
+        if (this._viewport)
+            this._updateRenderedContentAfterScroll();
+    }
+    onDataLengthChanged() {
+        if (this._viewport) {
+            this._renderContentForCurrentOffset();
+            this._checkRenderedContentSize();
+        }
+    }
+    onContentRendered() {
+        if (this._viewport)
+            this._checkRenderedContentSize();
+    }
+    onRenderedOffsetChanged() {
+        if (this._viewport)
+            this._checkRenderedContentOffset();
+    }
+    scrollToIndex() {
+        throw Error("cdk-virtual-scroll: scrollToIndex is currently not supported for the autosize scroll strategy");
+    }
+    /** Update the buffer parameters. */
+    updateBufferSize(minBufferPx, maxBufferPx) {
+        if (maxBufferPx < minBufferPx)
+            throw Error("CDK virtual scroll: maxBufferPx must be greater than or equal to minBufferPx");
+        this._minBufferPx = minBufferPx;
+        this._maxBufferPx = maxBufferPx;
+    }
+    _updateRenderedContentAfterScroll() {
+        const viewport = this._viewport;
+        const scrollOffset = viewport.measureScrollOffset();
+        let scrollDelta = scrollOffset - this._lastScrollOffset;
+        let scrollMagnitude = Math.abs(scrollDelta);
+        const renderedRange = viewport.getRenderedRange();
+        // Scrolling toward the top: the predicted size of the content above and the actual scrollable
+        // space may differ; correct the difference a little on each scroll event.
+        let offsetCorrection = 0;
+        if (scrollDelta < 0) {
+            const predictedOffset = renderedRange.start * this._averager.getAverageItemSize();
+            const offsetDifference = predictedOffset - this._lastRenderedContentOffset;
+            offsetCorrection = Math.round(offsetDifference * Math.max(0, Math.min(1, scrollMagnitude / (scrollOffset + scrollMagnitude))));
+            scrollDelta = scrollDelta - offsetCorrection;
+            scrollMagnitude = Math.abs(scrollDelta);
+        }
+        const startBuffer = this._lastScrollOffset - this._lastRenderedContentOffset;
+        const endBuffer = this._lastRenderedContentOffset + this._lastRenderedContentSize - (this._lastScrollOffset + viewport.getViewportSize());
+        // Unfilled space on the side the user scrolls toward.
+        const underscan = scrollMagnitude + this._minBufferPx - (scrollDelta < 0 ? startBuffer : endBuffer);
+        if (underscan > 0) {
+            // Larger jump than the viewport: the user won't notice a discontinuity, jump to the estimate.
+            if (scrollMagnitude >= viewport.getViewportSize())
+                this._renderContentForCurrentOffset();
+            else {
+                // Fill enough for a `maxBufferPx` buffer (wiggle room for a wrong estimate).
+                const addItems = Math.max(0, Math.ceil((underscan - this._minBufferPx + this._maxBufferPx) / this._averager.getAverageItemSize()));
+                // Extra filled space on the side the user scrolls away from.
+                const overscan = (scrollDelta < 0 ? endBuffer : startBuffer) - this._minBufferPx + scrollMagnitude;
+                // Less aggressive after failed removals.
+                const unboundedRemoveItems = Math.floor(overscan / this._averager.getAverageItemSize() / (this._removalFailures + 1));
+                const removeItems = Math.min(renderedRange.end - renderedRange.start, Math.max(0, unboundedRemoveItems));
+                const range = this._expandRange(renderedRange, scrollDelta < 0 ? addItems : 0, scrollDelta > 0 ? addItems : 0);
+                if (scrollDelta < 0)
+                    range.end = Math.max(range.start + 1, range.end - removeItems);
+                else
+                    range.start = Math.min(range.end - 1, range.start + removeItems);
+                // Offset from whichever end doesn't need the newly added items measured.
+                let contentOffset;
+                let contentOffsetTo;
+                if (scrollDelta < 0) {
+                    const removedSize = viewport.measureRangeSize({ start: range.end, end: renderedRange.end });
+                    if (removedSize <= overscan) {
+                        contentOffset = this._lastRenderedContentOffset + this._lastRenderedContentSize - removedSize;
+                        this._removalFailures = 0;
+                    }
+                    else {
+                        // Removal larger than the overscan can absorb: undo it, be less aggressive next time.
+                        range.end = renderedRange.end;
+                        contentOffset = this._lastRenderedContentOffset + this._lastRenderedContentSize;
+                        this._removalFailures++;
+                    }
+                    contentOffsetTo = "to-end";
+                }
+                else {
+                    const removedSize = viewport.measureRangeSize({ start: renderedRange.start, end: range.start });
+                    if (removedSize <= overscan) {
+                        contentOffset = this._lastRenderedContentOffset + removedSize;
+                        this._removalFailures = 0;
+                    }
+                    else {
+                        range.start = renderedRange.start;
+                        contentOffset = this._lastRenderedContentOffset;
+                        this._removalFailures++;
+                    }
+                    contentOffsetTo = "to-start";
+                }
+                viewport.setRenderedRange(range);
+                viewport.setRenderedContentOffset(contentOffset + offsetCorrection, contentOffsetTo);
+            }
+        }
+        else if (offsetCorrection) {
+            // Range unchanged, but simulate scrolling slightly slower / faster than the user did.
+            viewport.setRenderedContentOffset(this._lastRenderedContentOffset + offsetCorrection);
+        }
+        this._lastScrollOffset = scrollOffset;
+    }
+    /** Measure the rendered content, update the size estimate and the total content size. */
+    _checkRenderedContentSize() {
+        const viewport = this._viewport;
+        this._lastRenderedContentSize = viewport.measureRenderedContentSize();
+        this._averager.addSample(viewport.getRenderedRange(), this._lastRenderedContentSize);
+        this._updateTotalContentSize(this._lastRenderedContentSize);
+    }
+    _checkRenderedContentOffset() {
+        this._lastRenderedContentOffset = this._viewport.getOffsetToRenderedContentStart();
+    }
+    /** Render what the estimate says belongs at the current scroll offset. */
+    _renderContentForCurrentOffset() {
+        const viewport = this._viewport;
+        const scrollOffset = viewport.measureScrollOffset();
+        this._lastScrollOffset = scrollOffset;
+        this._removalFailures = 0;
+        const itemSize = this._averager.getAverageItemSize();
+        const firstVisibleIndex = Math.min(viewport.getDataLength() - 1, Math.floor(scrollOffset / itemSize));
+        const bufferSize = Math.ceil(this._maxBufferPx / itemSize);
+        const range = this._expandRange(this._getVisibleRangeForIndex(firstVisibleIndex), bufferSize, bufferSize);
+        viewport.setRenderedRange(range);
+        viewport.setRenderedContentOffset(itemSize * range.start);
+    }
+    /** Visible range starting at `startIndex`, backed up near the end so it fills the viewport. */
+    _getVisibleRangeForIndex(startIndex) {
+        const viewport = this._viewport;
+        const range = { start: startIndex, end: startIndex + Math.ceil(viewport.getViewportSize() / this._averager.getAverageItemSize()) };
+        const extra = range.end - viewport.getDataLength();
+        if (extra > 0)
+            range.start = Math.max(0, range.start - extra);
+        return range;
+    }
+    _expandRange(range, expandStart, expandEnd) {
+        const viewport = this._viewport;
+        return { start: Math.max(0, range.start - expandStart), end: Math.min(viewport.getDataLength(), range.end + expandEnd) };
+    }
+    _updateTotalContentSize(renderedContentSize) {
+        const viewport = this._viewport;
+        const renderedRange = viewport.getRenderedRange();
+        viewport.setTotalContentSize(renderedContentSize + (viewport.getDataLength() - (renderedRange.end - renderedRange.start)) * this._averager.getAverageItemSize());
+    }
+}

package/scrolling/behaviour.d.ts

@@ -0,0 +1,3 @@
+import type { VirtualScrollCallbacks, VirtualScrollState } from "./state.js";
+/** First scroll / wheel / pointer / focus / key on (or for) a viewport: create + attach its engine. */
+export declare function viewportInteract(state: VirtualScrollState<any>, _event?: Event, callbacks?: VirtualScrollCallbacks): void;

package/scrolling/behaviour.js

@@ -0,0 +1,5 @@
+import { virtualScrollViewport } from "./virtual-scroll-viewport.js";
+/** First scroll / wheel / pointer / focus / key on (or for) a viewport: create + attach its engine. */
+export function viewportInteract(state, _event, callbacks) {
+    virtualScrollViewport(state, undefined, callbacks);
+}

package/scrolling/emitter.d.ts

@@ -0,0 +1,34 @@
+export interface Subscription {
+    unsubscribe(): void;
+}
+export interface Observer<T> {
+    next?: (value: T) => void;
+    complete?: () => void;
+}
+/** Subscribe-only view of a stream (RxJS `Observable` subset). */
+export interface Stream<T> {
+    subscribe(observer: ((value: T) => void) | Observer<T>): Subscription;
+}
+/** Multicast subject: `next` pushes to current subscribers; `complete` notifies and drops them. */
+export declare class Emitter<T> implements Stream<T> {
+    private observers;
+    private closed;
+    private readonly onCount?;
+    /** `onCount`: called with the new subscriber count (lazy global listeners). */
+    constructor(onCount?: (count: number) => void);
+    get count(): number;
+    get isStopped(): boolean;
+    next(value: T): void;
+    subscribe(o: ((value: T) => void) | Observer<T>): Subscription;
+    complete(): void;
+}
+/** A cold stream from a subscribe function (`new Observable(subscriber => teardown)`). */
+export declare function stream<T>(subscribe: (observer: Required<Observer<T>>) => () => void): Stream<T>;
+/** `auditTime(ms)`: after a value, wait `ms` (`frame` + 0 → next animation frame), then emit the latest. */
+export declare function auditTime<T>(source: Stream<T>, ms: number, frame?: boolean): Stream<T>;
+/** `distinctUntilChanged()`. */
+export declare function distinct<T>(source: Stream<T>): Stream<T>;
+/** `filter(predicate)`. */
+export declare function filter<T>(source: Stream<T>, predicate: (value: T) => boolean): Stream<T>;
+/** A stream that completes at once (Angular's `of()` on the server). */
+export declare const EMPTY_STREAM: Stream<never>;

package/scrolling/emitter.js

@@ -0,0 +1,144 @@
+// Minimal push streams replacing the RxJS subjects of Angular CDK scrolling / drag-drop (no RxJS
+// dependency): `Emitter` (Subject), `auditTime`, `distinct` (distinctUntilChanged), `filter`.
+// Browser-only plumbing: nothing here is serialized or created at import time.
+const toObserver = (o) => (typeof o === "function" ? { next: o } : { ...o });
+/** Multicast subject: `next` pushes to current subscribers; `complete` notifies and drops them. */
+export class Emitter {
+    observers = new Set();
+    closed = false;
+    onCount;
+    /** `onCount`: called with the new subscriber count (lazy global listeners). */
+    constructor(onCount) {
+        this.onCount = onCount;
+    }
+    get count() {
+        return this.observers.size;
+    }
+    get isStopped() {
+        return this.closed;
+    }
+    next(value) {
+        if (this.closed)
+            return;
+        for (const observer of [...this.observers])
+            observer.next?.(value);
+    }
+    subscribe(o) {
+        const observer = toObserver(o);
+        if (this.closed) {
+            observer.complete?.();
+            return { unsubscribe() { } };
+        }
+        this.observers.add(observer);
+        this.onCount?.(this.observers.size);
+        return {
+            unsubscribe: () => {
+                if (this.observers.delete(observer))
+                    this.onCount?.(this.observers.size);
+            },
+        };
+    }
+    complete() {
+        if (this.closed)
+            return;
+        this.closed = true;
+        const observers = [...this.observers];
+        this.observers.clear();
+        for (const observer of observers)
+            observer.complete?.();
+        this.onCount?.(0);
+    }
+}
+/** A cold stream from a subscribe function (`new Observable(subscriber => teardown)`). */
+export function stream(subscribe) {
+    return {
+        subscribe(o) {
+            const observer = toObserver(o);
+            let done = false;
+            let teardown;
+            const stop = () => {
+                if (done)
+                    return;
+                done = true;
+                teardown?.();
+            };
+            teardown = subscribe({
+                next: (value) => !done && observer.next?.(value),
+                complete: () => {
+                    if (done)
+                        return;
+                    stop();
+                    observer.complete?.();
+                },
+            });
+            if (done)
+                teardown();
+            return { unsubscribe: stop };
+        },
+    };
+}
+/** `auditTime(ms)`: after a value, wait `ms` (`frame` + 0 → next animation frame), then emit the latest. */
+export function auditTime(source, ms, frame = false) {
+    return stream((out) => {
+        let timer, latest;
+        const raf = frame && ms === 0 && typeof requestAnimationFrame === "function";
+        const cancel = () => {
+            if (timer === undefined)
+                return;
+            if (raf)
+                cancelAnimationFrame(timer);
+            else
+                clearTimeout(timer);
+            timer = undefined;
+        };
+        const sub = source.subscribe({
+            next: (value) => {
+                latest = value;
+                if (timer !== undefined)
+                    return;
+                const fire = () => {
+                    timer = undefined;
+                    out.next(latest);
+                };
+                timer = raf ? requestAnimationFrame(fire) : setTimeout(fire, ms);
+            },
+            complete: () => {
+                cancel();
+                out.complete();
+            },
+        });
+        return () => {
+            sub.unsubscribe();
+            cancel();
+        };
+    });
+}
+/** `distinctUntilChanged()`. */
+export function distinct(source) {
+    return stream((out) => {
+        let has = false, last;
+        const sub = source.subscribe({
+            next: (value) => {
+                if (has && Object.is(value, last))
+                    return;
+                has = true;
+                last = value;
+                out.next(value);
+            },
+            complete: out.complete,
+        });
+        return () => sub.unsubscribe();
+    });
+}
+/** `filter(predicate)`. */
+export function filter(source, predicate) {
+    return stream((out) => {
+        const sub = source.subscribe({ next: (value) => predicate(value) && out.next(value), complete: out.complete });
+        return () => sub.unsubscribe();
+    });
+}
+/** A stream that completes at once (Angular's `of()` on the server). */
+export const EMPTY_STREAM = stream((out) => {
+    out.complete();
+    return () => { };
+});

package/scrolling/fixed-size-virtual-scroll.d.ts

@@ -0,0 +1,28 @@
+import { type Stream } from "./emitter.js";
+import type { VirtualScrollStrategy, VirtualScrollStrategyViewport } from "./virtual-scroll-strategy.js";
+/** Virtual scrolling strategy for lists with items of known fixed size. */
+export declare class FixedSizeVirtualScrollStrategy implements VirtualScrollStrategy {
+    private readonly _scrolledIndexChange;
+    scrolledIndexChange: Stream<number>;
+    private _viewport;
+    private _itemSize;
+    private _minBufferPx;
+    private _maxBufferPx;
+    /**
+     * @param itemSize The size of the items in the virtually scrolling list.
+     * @param minBufferPx The minimum amount of buffer (in pixels) before needing to render more
+     * @param maxBufferPx The amount of buffer (in pixels) to render when rendering more.
+     */
+    constructor(itemSize: number, minBufferPx: number, maxBufferPx: number);
+    attach(viewport: VirtualScrollStrategyViewport): void;
+    detach(): void;
+    /** Update the item size and buffer size. */
+    updateItemAndBufferSize(itemSize: number, minBufferPx: number, maxBufferPx: number): void;
+    onContentScrolled(): void;
+    onDataLengthChanged(): void;
+    onContentRendered(): void;
+    onRenderedOffsetChanged(): void;
+    scrollToIndex(index: number, behavior: ScrollBehavior): void;
+    private _updateTotalContentSize;
+    private _updateRenderedRange;
+}