@aceshooting/lyra-ui 2.0.0 → 2.2.0

package/dist/components/virtual-list/virtual-list.d.ts

@@ -1,173 +1,2 @@
-import { type TemplateResult, type PropertyValues } from 'lit';
-import { LyraElement } from '../../internal/lyra-element.js';
-/** `lyra-visible-range-changed` detail -- the current visible (non-overscanned) item index range. */
-export interface VirtualListRange {
-    start: number;
-    end: number;
-}
-/** Placeholder for a later phase's sticky-header sectioning feature -- see the class doc. */
-export interface VirtualListGroup {
-    key: string | number;
-    label?: string;
-    startIndex: number;
-}
-/**
- * `<lyra-virtual-list>` — a generic windowed/virtualized list host. Renders
- * only the items within the current viewport (plus `overscan` padding rows
- * on each side) as real DOM, regardless of how large `items` is, so a
- * multi-thousand-row chat history sidebar (or, in a later phase, a long
- * message thread) stays cheap to scroll.
- *
- * Content is entirely caller-supplied: `renderItem(item, index)` returns
- * whatever `lit-html` value should represent that row (typically a
- * `TemplateResult`), and `keyFunction(item, index)` gives it a stable
- * identity for `repeat()`'s DOM-reconciliation key, so scroll position and
- * any per-row state (e.g. an `<audio>` element's playback position) survive
- * an `items` mutation instead of every row remounting from scratch.
- *
- * **Windowing math.** Every row — in both `row-height` modes — is positioned
- * by a `transform: translateY(offset)` computed from a single cumulative
- * `offsets` array (`offsets[i]` = the pixel top of row `i`), rather than by
- * page flow. This is what lets only a small DOM window exist while the
- * scrollbar still reflects the *true* total content height:
- * - **`row-height="auto"` (default).** Each currently-rendered row is
- *   watched by a `ResizeObserver`; its real height lands in a per-key
- *   `Map`, and any row not yet measured contributes `DEFAULT_ROW_ESTIMATE_PX`
- *   to the offsets array until it has been. `offsets` is *not* the same
- *   thing as a page-count-based `padding-top`/`padding-bottom` spacer pair —
- *   that approach reflows every unmeasured row's position on every new
- *   measurement, which is exactly what per-row transform offsets avoid: only
- *   the rows *after* a newly-measured one shift, and even that shift is a
- *   cheap style recompute, not a layout-affecting padding change.
- * - **Fixed numeric `row-height`.** No measurement needed — `offsets[i]` is
- *   just `i * rowHeightPx`, computed by the exact same cumulative-array code
- *   path (a dedicated "single spacer + start-index" special case was
- *   considered and would work too, but reusing one code path for both modes
- *   avoids maintaining two parallel rendering strategies for a difference
- *   that's otherwise just "how is row *i*'s height looked up").
- *
- * The `offsets` array is rebuilt on every update. For the list sizes this
- * component is meant for (a scrollable history sidebar, realistically
- * hundreds to a few thousand rows) that's a trivial `O(n)` arithmetic loop,
- * even at scroll-driven ~60fps; it is *not* the right approach for a
- * hundred-thousand-row list without further work (e.g. a Fenwick/segment
- * tree for `O(log n)` offset queries+updates), which is out of scope here.
- *
- * **Accessibility.** The scroll container is `role="list"` and each rendered
- * row is `role="listitem"`, deliberately *not* `listbox`/`option` — this
- * component only provides windowing, not the roving-tabindex/
- * `aria-activedescendant` keyboard-interaction contract ARIA requires
- * alongside a real `listbox`. A consumer that wants full single-select
- * listbox semantics on top of this should compose that behavior itself (see
- * `<lyra-select>`'s pattern), the same way this component's `active-id`
- * only *scrolls* the matching row into view and marks it `aria-current` —
- * it never claims to be a selection widget. `aria-setsize`/`aria-posinset`
- * are computed from the row's real index in the full `items` array (not its
- * position among the currently-rendered DOM window), so a screen reader
- * still announces e.g. "item 12 of 340" correctly. `[part="base"]` itself
- * carries `tabindex="0"` — `renderItem`'s content is caller-supplied and not
- * guaranteed to contain a focusable element, and a scrollable region with no
- * focusable content of its own is otherwise unreachable by keyboard (native
- * arrow/Page Up/Page Down scrolling included).
- *
- * **Grouping.** `groups` is accepted for forward API compatibility with a
- * later phase's sticky-header sectioning feature (paired with a
- * `groupByRecency()` helper that doesn't exist yet) but is not read or
- * rendered by this pass — every row still renders flat, in `items` order.
- *
- * @customElement lyra-virtual-list
- * @event lyra-load-more - Fired once per approach to the bottom of the list
- *   while `has-more` is true and `loading` is false. Deliberately does not
- *   refire on every scroll tick while still near the bottom (`loading`
- *   gates the in-flight case; scrolling back away from the bottom and
- *   returning, or `items` growing enough to move the window away from the
- *   end, re-arms it) — a consumer wanting an automatic retry after a failed
- *   fetch should surface its own retry affordance rather than relying on
- *   this firing again unprompted.
- * @event lyra-visible-range-changed - `detail: { start, end }` (see
- *   `VirtualListRange`) — the current visible (non-overscanned) item index
- *   range, fired only when it actually changes.
- * @csspart base - The scrollable container (`role="list"`).
- * @csspart spacer - The full-content-height inner element that gives the
- *   container its true scrollable extent.
- * @csspart row - One rendered row's absolutely-positioned wrapper
- *   (`role="listitem"`); `renderItem`'s return value renders inside it.
- */
-export declare class LyraVirtualList extends LyraElement {
-    static styles: import("lit").CSSResultGroup[];
-    /** The full (non-windowed) item collection. */
-    items: unknown[];
-    /** Renders one row's content — typically returns a `lit-html` `TemplateResult`. */
-    renderItem: (item: unknown, index: number) => unknown;
-    /** Derives a row's stable `repeat()` key. Falls back to the item's index
-     *  in `items` when omitted, which is only a safe identity while `items`
-     *  never reorders/inserts/removes — provide this whenever it can, or
-     *  scroll position and any per-row DOM state can attach to the wrong row
-     *  across a mutation (same caveat as `<lyra-table>`'s `rowKey`). */
-    keyFunction?: (item: unknown, index: number) => string | number;
-    /** Reserved for a later phase's sticky-header sectioning — accepted but not yet rendered. See the class doc. */
-    groups?: VirtualListGroup[];
-    /** `'auto'` (default) measures each row's real height via `ResizeObserver`;
-     *  a numeric string fixes every row to that many pixels. */
-    rowHeight: string;
-    /** Extra rows rendered beyond the visible viewport on each side, to reduce blank-frame risk during fast scrolling. */
-    overscan: number;
-    /** When set and it matches a row's `keyFunction` result, that row is smoothly scrolled into view whenever this changes. */
-    activeId: string;
-    loading: boolean;
-    /** When true, scrolling near the bottom fires `lyra-load-more`. */
-    hasMore: boolean;
-    private containerScrollTop;
-    private viewportHeight;
-    /** `offsets[i]` = row `i`'s pixel top; `offsets[items.length]` = total content height. Rebuilt every update. */
-    private offsets;
-    /** Parsed `rowHeight`: a positive pixel number, or `null` for `'auto'` (measured) mode. */
-    private fixedRowHeight;
-    /** `row-height="auto"` per-row measured heights, keyed by `String(keyFunction(item, index))`. */
-    private readonly measuredHeights;
-    private renderStart;
-    private renderEnd;
-    private visibleStart;
-    private visibleEnd;
-    private lastEmittedStart;
-    private lastEmittedEnd;
-    /** Re-armed whenever the window moves away from the end of `items` -- see the `lyra-load-more` event doc. */
-    private loadMoreArmed;
-    private isFirstUpdate;
-    private rowResizeObserver?;
-    private containerResizeObserver?;
-    private readonly observedRows;
-    private scrollRafId?;
-    private pendingScrollTop;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(): void;
-    protected willUpdate(changed: PropertyValues): void;
-    protected updated(changed: PropertyValues): void;
-    private parseRowHeight;
-    private keyOf;
-    private recomputeOffsets;
-    /** First item index whose bottom edge is at/after `offset`. */
-    private findIndexAtOrAfter;
-    /** Last item index whose top edge is at/before `offset`. */
-    private findIndexAtOrBefore;
-    private computeRange;
-    private attachContainerListeners;
-    private onScroll;
-    private onRowsResized;
-    /** Keeps the row `ResizeObserver` watching exactly the currently-rendered
-     *  rows in `row-height="auto"` mode -- rows that scroll out of the
-     *  rendered window are unobserved so the observer doesn't accumulate
-     *  references to detached elements it can never usefully report on again. */
-    private syncRowObservers;
-    private scrollActiveIntoView;
-    private emitRangeChangeIfNeeded;
-    private maybeFireLoadMore;
-    private renderRow;
-    render(): TemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'lyra-virtual-list': LyraVirtualList;
-    }
-}
+export * from './virtual-list.class.js';
+//# sourceMappingURL=virtual-list.d.ts.map

package/dist/components/virtual-list/virtual-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtual-list.d.ts","sourceRoot":"","sources":["../../../src/components/virtual-list/virtual-list.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC"}

package/dist/components/virtual-list/virtual-list.js

@@ -1,461 +1,5 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { html, nothing } from 'lit';
-import { property, state } from 'lit/decorators.js';
-import { repeat } from 'lit/directives/repeat.js';
-import { styleMap } from 'lit/directives/style-map.js';
-import { LyraElement } from '../../internal/lyra-element.js';
+export * from './virtual-list.class.js';
+import { LyraVirtualList } from './virtual-list.class.js';
 import { defineElement } from '../../internal/prefix.js';
-import { styles } from './virtual-list.styles.js';
-/** Fallback per-row height (px) used for any row that hasn't been measured
- *  yet in `row-height="auto"` mode -- close enough to a typical single-line
- *  chat-list row that the initial scrollbar/spacer size doesn't jump wildly
- *  once real measurements arrive. Irrelevant in fixed-`row-height` mode. */
-const DEFAULT_ROW_ESTIMATE_PX = 48;
-function prefersReducedMotion() {
-    return typeof window !== 'undefined' && !!window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
-}
-/**
- * `<lyra-virtual-list>` — a generic windowed/virtualized list host. Renders
- * only the items within the current viewport (plus `overscan` padding rows
- * on each side) as real DOM, regardless of how large `items` is, so a
- * multi-thousand-row chat history sidebar (or, in a later phase, a long
- * message thread) stays cheap to scroll.
- *
- * Content is entirely caller-supplied: `renderItem(item, index)` returns
- * whatever `lit-html` value should represent that row (typically a
- * `TemplateResult`), and `keyFunction(item, index)` gives it a stable
- * identity for `repeat()`'s DOM-reconciliation key, so scroll position and
- * any per-row state (e.g. an `<audio>` element's playback position) survive
- * an `items` mutation instead of every row remounting from scratch.
- *
- * **Windowing math.** Every row — in both `row-height` modes — is positioned
- * by a `transform: translateY(offset)` computed from a single cumulative
- * `offsets` array (`offsets[i]` = the pixel top of row `i`), rather than by
- * page flow. This is what lets only a small DOM window exist while the
- * scrollbar still reflects the *true* total content height:
- * - **`row-height="auto"` (default).** Each currently-rendered row is
- *   watched by a `ResizeObserver`; its real height lands in a per-key
- *   `Map`, and any row not yet measured contributes `DEFAULT_ROW_ESTIMATE_PX`
- *   to the offsets array until it has been. `offsets` is *not* the same
- *   thing as a page-count-based `padding-top`/`padding-bottom` spacer pair —
- *   that approach reflows every unmeasured row's position on every new
- *   measurement, which is exactly what per-row transform offsets avoid: only
- *   the rows *after* a newly-measured one shift, and even that shift is a
- *   cheap style recompute, not a layout-affecting padding change.
- * - **Fixed numeric `row-height`.** No measurement needed — `offsets[i]` is
- *   just `i * rowHeightPx`, computed by the exact same cumulative-array code
- *   path (a dedicated "single spacer + start-index" special case was
- *   considered and would work too, but reusing one code path for both modes
- *   avoids maintaining two parallel rendering strategies for a difference
- *   that's otherwise just "how is row *i*'s height looked up").
- *
- * The `offsets` array is rebuilt on every update. For the list sizes this
- * component is meant for (a scrollable history sidebar, realistically
- * hundreds to a few thousand rows) that's a trivial `O(n)` arithmetic loop,
- * even at scroll-driven ~60fps; it is *not* the right approach for a
- * hundred-thousand-row list without further work (e.g. a Fenwick/segment
- * tree for `O(log n)` offset queries+updates), which is out of scope here.
- *
- * **Accessibility.** The scroll container is `role="list"` and each rendered
- * row is `role="listitem"`, deliberately *not* `listbox`/`option` — this
- * component only provides windowing, not the roving-tabindex/
- * `aria-activedescendant` keyboard-interaction contract ARIA requires
- * alongside a real `listbox`. A consumer that wants full single-select
- * listbox semantics on top of this should compose that behavior itself (see
- * `<lyra-select>`'s pattern), the same way this component's `active-id`
- * only *scrolls* the matching row into view and marks it `aria-current` —
- * it never claims to be a selection widget. `aria-setsize`/`aria-posinset`
- * are computed from the row's real index in the full `items` array (not its
- * position among the currently-rendered DOM window), so a screen reader
- * still announces e.g. "item 12 of 340" correctly. `[part="base"]` itself
- * carries `tabindex="0"` — `renderItem`'s content is caller-supplied and not
- * guaranteed to contain a focusable element, and a scrollable region with no
- * focusable content of its own is otherwise unreachable by keyboard (native
- * arrow/Page Up/Page Down scrolling included).
- *
- * **Grouping.** `groups` is accepted for forward API compatibility with a
- * later phase's sticky-header sectioning feature (paired with a
- * `groupByRecency()` helper that doesn't exist yet) but is not read or
- * rendered by this pass — every row still renders flat, in `items` order.
- *
- * @customElement lyra-virtual-list
- * @event lyra-load-more - Fired once per approach to the bottom of the list
- *   while `has-more` is true and `loading` is false. Deliberately does not
- *   refire on every scroll tick while still near the bottom (`loading`
- *   gates the in-flight case; scrolling back away from the bottom and
- *   returning, or `items` growing enough to move the window away from the
- *   end, re-arms it) — a consumer wanting an automatic retry after a failed
- *   fetch should surface its own retry affordance rather than relying on
- *   this firing again unprompted.
- * @event lyra-visible-range-changed - `detail: { start, end }` (see
- *   `VirtualListRange`) — the current visible (non-overscanned) item index
- *   range, fired only when it actually changes.
- * @csspart base - The scrollable container (`role="list"`).
- * @csspart spacer - The full-content-height inner element that gives the
- *   container its true scrollable extent.
- * @csspart row - One rendered row's absolutely-positioned wrapper
- *   (`role="listitem"`); `renderItem`'s return value renders inside it.
- */
-export class LyraVirtualList extends LyraElement {
-    constructor() {
-        super(...arguments);
-        /** The full (non-windowed) item collection. */
-        this.items = [];
-        /** Renders one row's content — typically returns a `lit-html` `TemplateResult`. */
-        this.renderItem = () => nothing;
-        /** `'auto'` (default) measures each row's real height via `ResizeObserver`;
-         *  a numeric string fixes every row to that many pixels. */
-        this.rowHeight = 'auto';
-        /** Extra rows rendered beyond the visible viewport on each side, to reduce blank-frame risk during fast scrolling. */
-        this.overscan = 6;
-        /** When set and it matches a row's `keyFunction` result, that row is smoothly scrolled into view whenever this changes. */
-        this.activeId = '';
-        this.loading = false;
-        /** When true, scrolling near the bottom fires `lyra-load-more`. */
-        this.hasMore = false;
-        // Named distinctly from the inherited DOM `scrollTop` (a `HTMLElement`
-        // property this class would otherwise shadow) -- this tracks the *scroll
-        // container's* scrollTop, not the host element's own (the host never
-        // scrolls itself; [part="base"] does).
-        this.containerScrollTop = 0;
-        this.viewportHeight = 0;
-        /** `offsets[i]` = row `i`'s pixel top; `offsets[items.length]` = total content height. Rebuilt every update. */
-        this.offsets = [0];
-        /** Parsed `rowHeight`: a positive pixel number, or `null` for `'auto'` (measured) mode. */
-        this.fixedRowHeight = null;
-        /** `row-height="auto"` per-row measured heights, keyed by `String(keyFunction(item, index))`. */
-        this.measuredHeights = new Map();
-        this.renderStart = 0;
-        this.renderEnd = -1;
-        this.visibleStart = 0;
-        this.visibleEnd = -1;
-        this.lastEmittedStart = -1;
-        this.lastEmittedEnd = -1;
-        /** Re-armed whenever the window moves away from the end of `items` -- see the `lyra-load-more` event doc. */
-        this.loadMoreArmed = true;
-        this.isFirstUpdate = true;
-        this.observedRows = new Map();
-        this.pendingScrollTop = null;
-        this.onScroll = (e) => {
-            this.pendingScrollTop = e.currentTarget.scrollTop;
-            if (this.scrollRafId !== undefined)
-                return;
-            // Coalesce to one recompute per animation frame -- native `scroll`
-            // events can fire far faster than that under a fast trackpad/touch
-            // fling, and each recompute is a full Lit update.
-            this.scrollRafId = requestAnimationFrame(() => {
-                this.scrollRafId = undefined;
-                if (this.pendingScrollTop !== null) {
-                    this.containerScrollTop = this.pendingScrollTop;
-                    this.pendingScrollTop = null;
-                }
-            });
-        };
-        this.onRowsResized = (entries) => {
-            if (this.fixedRowHeight != null)
-                return;
-            let changed = false;
-            for (const entry of entries) {
-                const key = entry.target.dataset.rowKey;
-                if (key === undefined)
-                    continue;
-                const height = entry.borderBoxSize?.[0]?.blockSize ?? entry.target.getBoundingClientRect().height;
-                const prev = this.measuredHeights.get(key);
-                // A sub-pixel-only difference (common with fractional layout/zoom)
-                // isn't worth a full offsets rebuild + re-render.
-                if (prev === undefined || Math.abs(prev - height) > 0.5) {
-                    this.measuredHeights.set(key, height);
-                    changed = true;
-                }
-            }
-            if (changed)
-                this.requestUpdate();
-        };
-    }
-    static { this.styles = [LyraElement.styles, styles]; }
-    connectedCallback() {
-        super.connectedCallback();
-        this.rowResizeObserver = new ResizeObserver(this.onRowsResized);
-        // firstUpdated() only ever fires once per element instance -- a
-        // disconnect/reconnect (e.g. a reparenting drag) needs its own
-        // re-attach here, since the container observer/scroll listener were
-        // torn down in disconnectedCallback below.
-        if (this.hasUpdated)
-            this.attachContainerListeners();
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.rowResizeObserver?.disconnect();
-        this.rowResizeObserver = undefined;
-        this.observedRows.clear();
-        this.containerResizeObserver?.disconnect();
-        this.containerResizeObserver = undefined;
-        if (this.scrollRafId !== undefined) {
-            cancelAnimationFrame(this.scrollRafId);
-            this.scrollRafId = undefined;
-        }
-        this.renderRoot.querySelector('[part="base"]')?.removeEventListener('scroll', this.onScroll);
-    }
-    firstUpdated() {
-        this.attachContainerListeners();
-    }
-    willUpdate(changed) {
-        this.isFirstUpdate = !this.hasUpdated;
-        if (changed.has('rowHeight')) {
-            this.fixedRowHeight = this.parseRowHeight(this.rowHeight);
-        }
-        this.recomputeOffsets();
-        this.computeRange();
-    }
-    updated(changed) {
-        super.updated(changed);
-        this.syncRowObservers();
-        if (changed.has('activeId') && !this.isFirstUpdate)
-            this.scrollActiveIntoView();
-        this.emitRangeChangeIfNeeded();
-        this.maybeFireLoadMore();
-    }
-    parseRowHeight(value) {
-        if (value === 'auto')
-            return null;
-        const n = Number(value);
-        // Anything that isn't 'auto' or a positive finite number falls back to
-        // auto mode rather than throwing or producing a zero/negative-height
-        // row -- matches this library's generally-permissive attribute parsing.
-        return Number.isFinite(n) && n > 0 ? n : null;
-    }
-    keyOf(item, index) {
-        return this.keyFunction ? this.keyFunction(item, index) : index;
-    }
-    recomputeOffsets() {
-        const n = this.items.length;
-        const offsets = new Array(n + 1);
-        offsets[0] = 0;
-        for (let i = 0; i < n; i++) {
-            const h = this.fixedRowHeight ??
-                this.measuredHeights.get(String(this.keyOf(this.items[i], i))) ??
-                DEFAULT_ROW_ESTIMATE_PX;
-            offsets[i + 1] = offsets[i] + h;
-        }
-        this.offsets = offsets;
-    }
-    /** First item index whose bottom edge is at/after `offset`. */
-    findIndexAtOrAfter(offset) {
-        const offsets = this.offsets;
-        let lo = 0;
-        let hi = offsets.length - 2;
-        while (lo < hi) {
-            const mid = (lo + hi) >> 1;
-            if (offsets[mid + 1] <= offset)
-                lo = mid + 1;
-            else
-                hi = mid;
-        }
-        return lo;
-    }
-    /** Last item index whose top edge is at/before `offset`. */
-    findIndexAtOrBefore(offset) {
-        const offsets = this.offsets;
-        let lo = 0;
-        let hi = offsets.length - 2;
-        while (lo < hi) {
-            const mid = (lo + hi + 1) >> 1;
-            if (offsets[mid] < offset)
-                lo = mid;
-            else
-                hi = mid - 1;
-        }
-        return lo;
-    }
-    computeRange() {
-        const n = this.items.length;
-        if (n === 0 || this.viewportHeight <= 0) {
-            this.visibleStart = 0;
-            this.visibleEnd = -1;
-            this.renderStart = 0;
-            this.renderEnd = -1;
-            return;
-        }
-        const viewTop = this.containerScrollTop;
-        const viewBottom = viewTop + this.viewportHeight;
-        this.visibleStart = this.findIndexAtOrAfter(viewTop);
-        this.visibleEnd = this.findIndexAtOrBefore(viewBottom);
-        this.renderStart = Math.max(0, this.visibleStart - this.overscan);
-        this.renderEnd = Math.min(n - 1, this.visibleEnd + this.overscan);
-    }
-    attachContainerListeners() {
-        const base = this.renderRoot.querySelector('[part="base"]');
-        if (!base)
-            return;
-        this.containerResizeObserver = new ResizeObserver((entries) => {
-            const entry = entries[0];
-            if (!entry)
-                return;
-            this.viewportHeight = entry.borderBoxSize?.[0]?.blockSize ?? entry.contentRect.height;
-        });
-        this.containerResizeObserver.observe(base);
-        base.addEventListener('scroll', this.onScroll, { passive: true });
-        // Read synchronously too -- ResizeObserver's first callback is
-        // asynchronous, so without this the very first render would otherwise
-        // sit at viewportHeight=0 (rendering no rows at all) until that callback
-        // eventually fires. This is called from firstUpdated(), so setting a
-        // reactive property here schedules a second update on top of the one
-        // that just finished -- Lit's dev-mode console flags that pattern, but
-        // it's the documented exception ("the next update can only be scheduled
-        // as a side effect of the previous update"): the container's real size
-        // genuinely isn't knowable until after the first layout.
-        this.viewportHeight = base.clientHeight;
-        this.containerScrollTop = base.scrollTop;
-    }
-    /** Keeps the row `ResizeObserver` watching exactly the currently-rendered
-     *  rows in `row-height="auto"` mode -- rows that scroll out of the
-     *  rendered window are unobserved so the observer doesn't accumulate
-     *  references to detached elements it can never usefully report on again. */
-    syncRowObservers() {
-        const ro = this.rowResizeObserver;
-        if (!ro)
-            return;
-        if (this.fixedRowHeight != null) {
-            for (const el of this.observedRows.values())
-                ro.unobserve(el);
-            this.observedRows.clear();
-            return;
-        }
-        const current = new Map();
-        this.renderRoot.querySelectorAll('[part="row"]').forEach((el) => {
-            const key = el.dataset.rowKey;
-            if (key !== undefined)
-                current.set(key, el);
-        });
-        for (const [key, el] of this.observedRows) {
-            if (current.get(key) !== el) {
-                ro.unobserve(el);
-                this.observedRows.delete(key);
-            }
-        }
-        for (const [key, el] of current) {
-            if (!this.observedRows.has(key)) {
-                this.observedRows.set(key, el);
-                ro.observe(el);
-            }
-        }
-    }
-    scrollActiveIntoView() {
-        if (!this.activeId)
-            return;
-        const index = this.items.findIndex((item, i) => String(this.keyOf(item, i)) === this.activeId);
-        if (index < 0)
-            return;
-        const base = this.renderRoot.querySelector('[part="base"]');
-        if (!base)
-            return;
-        const top = this.offsets[index] ?? 0;
-        const bottom = this.offsets[index + 1] ?? top;
-        const viewTop = base.scrollTop;
-        const viewBottom = viewTop + base.clientHeight;
-        let target = null;
-        if (top < viewTop)
-            target = top;
-        else if (bottom > viewBottom)
-            target = bottom - base.clientHeight;
-        if (target === null)
-            return;
-        base.scrollTo({ top: Math.max(0, target), behavior: prefersReducedMotion() ? 'auto' : 'smooth' });
-    }
-    emitRangeChangeIfNeeded() {
-        if (this.visibleEnd < this.visibleStart)
-            return;
-        if (this.visibleStart === this.lastEmittedStart && this.visibleEnd === this.lastEmittedEnd)
-            return;
-        this.lastEmittedStart = this.visibleStart;
-        this.lastEmittedEnd = this.visibleEnd;
-        this.emit('lyra-visible-range-changed', {
-            start: this.visibleStart,
-            end: this.visibleEnd,
-        });
-    }
-    maybeFireLoadMore() {
-        const n = this.items.length;
-        const nearBottom = n > 0 && this.visibleEnd >= n - 1;
-        if (!nearBottom) {
-            this.loadMoreArmed = true;
-            return;
-        }
-        if (!this.hasMore || this.loading || !this.loadMoreArmed)
-            return;
-        this.loadMoreArmed = false;
-        this.emit('lyra-load-more');
-    }
-    renderRow(item, index, total) {
-        const key = String(this.keyOf(item, index));
-        const top = this.offsets[index] ?? 0;
-        const isActive = this.activeId !== '' && key === this.activeId;
-        return html `
-      <div
-        part="row"
-        role="listitem"
-        data-row-key=${key}
-        aria-setsize=${total}
-        aria-posinset=${index + 1}
-        aria-current=${isActive ? 'true' : nothing}
-        style=${styleMap({ transform: `translateY(${top}px)` })}
-      >
-        ${this.renderItem(item, index)}
-      </div>
-    `;
-    }
-    render() {
-        const n = this.items.length;
-        const totalHeight = this.offsets[n] ?? 0;
-        const windowed = [];
-        for (let i = this.renderStart; i <= this.renderEnd; i++) {
-            windowed.push({ item: this.items[i], index: i });
-        }
-        return html `
-      <div part="base" role="list" tabindex="0" aria-busy=${this.loading ? 'true' : nothing}>
-        <div part="spacer" style=${styleMap({ height: `${totalHeight}px` })}>
-          ${repeat(windowed, (w) => this.keyOf(w.item, w.index), (w) => this.renderRow(w.item, w.index, n))}
-        </div>
-      </div>
-    `;
-    }
-}
-__decorate([
-    property({ attribute: false })
-], LyraVirtualList.prototype, "items", void 0);
-__decorate([
-    property({ attribute: false })
-], LyraVirtualList.prototype, "renderItem", void 0);
-__decorate([
-    property({ attribute: false })
-], LyraVirtualList.prototype, "keyFunction", void 0);
-__decorate([
-    property({ attribute: false })
-], LyraVirtualList.prototype, "groups", void 0);
-__decorate([
-    property({ attribute: 'row-height' })
-], LyraVirtualList.prototype, "rowHeight", void 0);
-__decorate([
-    property({ type: Number })
-], LyraVirtualList.prototype, "overscan", void 0);
-__decorate([
-    property({ attribute: 'active-id' })
-], LyraVirtualList.prototype, "activeId", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], LyraVirtualList.prototype, "loading", void 0);
-__decorate([
-    property({ type: Boolean, attribute: 'has-more', reflect: true })
-], LyraVirtualList.prototype, "hasMore", void 0);
-__decorate([
-    state()
-], LyraVirtualList.prototype, "containerScrollTop", void 0);
-__decorate([
-    state()
-], LyraVirtualList.prototype, "viewportHeight", void 0);
 defineElement('virtual-list', LyraVirtualList);
+//# sourceMappingURL=virtual-list.js.map

package/dist/components/virtual-list/virtual-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtual-list.js","sourceRoot":"","sources":["../../../src/components/virtual-list/virtual-list.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,aAAa,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC"}

package/dist/components/virtual-list/virtual-list.styles.d.ts

@@ -1 +1,2 @@
 export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=virtual-list.styles.d.ts.map

package/dist/components/virtual-list/virtual-list.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtual-list.styles.d.ts","sourceRoot":"","sources":["../../../src/components/virtual-list/virtual-list.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAsDlB,CAAC"}