@ixfx/components 0.15.4 → 0.16.0

package/dist/{grid-list-y6dWJYu3.js → grid-list-CdEkScn-.js}

@@ -5,8 +5,11 @@ import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js"
 import { c as createElementListSearchAdapter, d as createDataListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-JIhwB49y.js";
 import { i as resolveGroupKey, r as partitionByGroup } from "./grouping-RYPnHkrS.js";
 import { a as listItemFadeKeyframes, t as ListNativeDragController } from "./list-native-drag-controller-CcXoS0YX.js";
-import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-BeE70lbB.js";
+import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-5L0Nj9tR.js";
+import { c as keysAsFlags, f as withoutFlag, i as capFlags, l as keysToArray, o as flagsFromRecord, s as flagsToRecord, t as EMPTY_FLAGS } from "./pending-BGidHppL.js";
+import { n as createScrollHoverGuard } from "./scroll-hover-guard-Cjw6179Q.js";
 import "./interaction-E-uMGHkJ.js";
+import { t as ViewStateController } from "./view-state-controller-BdyXWUUM.js";
 import { t as scrollFadeStyles } from "./scroll-fade-Xx28D7mH.js";
 import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-BjcMyauw.js";
 import "./pan-text-CqtvjPyK.js";
@@ -669,6 +672,90 @@ var DataGridListSource = class {
 	}
 };
 //#endregion
+//#region src/grid-list/grid-list-view-state.ts
+/**
+* - live collapsed groups that no longer exist → pending `false`
+* - pending groups that now exist → applied (`false` collapses, `true` opens)
+*
+* Returns the inputs untouched (and `changed: false`) when nothing moved.
+*/
+function reconcileGroups(collapsed, pending, has) {
+	let nextCollapsed;
+	let nextPending;
+	for (const key of collapsed) {
+		if (has(key)) continue;
+		nextCollapsed ??= new Set(collapsed);
+		nextCollapsed.delete(key);
+		nextPending ??= new Map(pending);
+		nextPending.set(key, false);
+	}
+	for (const [key, open] of pending) {
+		if (!has(key)) continue;
+		nextPending ??= new Map(pending);
+		nextPending.delete(key);
+		if (open === (nextCollapsed ?? collapsed).has(key)) {
+			nextCollapsed ??= new Set(collapsed);
+			if (open) nextCollapsed.delete(key);
+			else nextCollapsed.add(key);
+		}
+	}
+	return {
+		collapsed: nextCollapsed ?? collapsed,
+		pending: nextPending ? capFlags(nextPending) : pending,
+		changed: nextCollapsed !== void 0 || nextPending !== void 0
+	};
+}
+/** `expanded` record: collapsed groups as `false`, plus pending choices when asked. */
+function expandedRecord(collapsed, pending, withPending) {
+	return flagsToRecord(withPending ? pending : [], keysAsFlags(collapsed, false));
+}
+/**
+* Capture the scroll position against the virtual layout. The anchor is the
+* first item of the first line intersecting the viewport, and the offset is
+* how far the viewport start sits past that line's start. `keyAt` returns
+* `undefined` for keys that can't anchor (auto-assigned keyless items).
+*/
+function captureGridScroll(layout, mainOffset, crossOffset, keyAt) {
+	const base = layout.horizontal ? {
+		top: crossOffset,
+		left: mainOffset
+	} : crossOffset === 0 ? { top: mainOffset } : {
+		top: mainOffset,
+		left: crossOffset
+	};
+	const win = layout.window(mainOffset, 0);
+	if (win.ranges.length === 0) return base;
+	const index = win.startIndex;
+	const key = keyAt(index);
+	if (key === void 0) return base;
+	const lineStart = layout.offsetOfAnchor(index, 0);
+	return {
+		...base,
+		anchor: {
+			key,
+			offset: Math.round(mainOffset - lineStart)
+		}
+	};
+}
+/**
+* Where to scroll for a saved {@link ScrollState}, or `undefined` while the
+* anchor key isn't in the effective order yet. `extent` is the viewport's
+* main-axis size.
+*/
+function gridScrollTarget(scroll, layout, indexOfKey, extent) {
+	let target = layout.horizontal ? scroll.left ?? 0 : scroll.top;
+	if (scroll.anchor) {
+		const index = indexOfKey(scroll.anchor.key);
+		if (index < 0) return void 0;
+		target = layout.offsetOfAnchor(index, 0) + scroll.anchor.offset;
+	}
+	const max = Math.max(0, layout.totalExtent - extent);
+	return {
+		offset: Math.max(0, Math.min(target, max)),
+		reached: target <= max + 1
+	};
+}
+//#endregion
 //#region src/grid-list/grid-list.ts
 const ITEM_SELECTOR = `:scope > *`;
 const MIN_ITEM_SIZE = 16;
@@ -707,7 +794,7 @@ let GridListElement = class GridListElement extends LitElement {
 		this.selectionMode = `single`;
 		this.interactionMode = `standard`;
 		this.disableHoverTickle = false;
-		this.disableScrollHoverTickle = false;
+		this.scrollHoverTickle = false;
 		this.itemSize = 160;
 		this.gap = 8;
 		this.orientation = `grid`;
@@ -730,6 +817,11 @@ let GridListElement = class GridListElement extends LitElement {
 		this._scrollLeft = 0;
 		this._viewportHeight = 0;
 		this._viewportWidth = 0;
+		this.#viewState = new ViewStateController(this, {
+			kind: `grid-list`,
+			capture: () => this.getViewState()
+		});
+		this.#pendingExpanded = EMPTY_FLAGS;
 		this.#viewportRef = createRef();
 		this.#scrollRaf = 0;
 		this.#snapTimer = 0;
@@ -775,14 +867,24 @@ let GridListElement = class GridListElement extends LitElement {
 			onTickle: (k) => {
 				this.#stopActiveCaptionPan();
 				if (k !== void 0) this.#emitItemEvent(`list-tickle`, k);
+				if (this.tickled.inputMode === `keyboard`) {
+					if (k !== void 0 && !this.#viewState.isRestoring) this.#pendingFocus = void 0;
+					this.#viewState.notify();
+				}
 			},
 			onStateChange: () => this._syncItemStates(),
 			itemWrap: this.#itemWrap,
 			hoverDisabled: () => this.disableHoverTickle || this.#dragSelect.isDragging || this.#nativeDrag.isDragging
 		});
-		this.#scrollHoverSuppress = false;
-		this.#lastPointerX = NaN;
-		this.#lastPointerY = NaN;
+		this.#scrollHover = createScrollHoverGuard({
+			host: this,
+			enabled: () => !this.scrollHoverTickle,
+			onResume: (x, y) => {
+				if (this.disableHoverTickle) return;
+				const key = this.shadowRoot?.elementFromPoint?.(x, y)?.closest(`.cell`)?.getAttribute(`data-key`);
+				if (key) this.tickled.handlePointerEnter(key);
+			}
+		});
 		this.#marqueePreview = /* @__PURE__ */ new Set();
 		this.#nativeDragging = false;
 		this.#dragOriginKey = void 0;
@@ -863,12 +965,13 @@ let GridListElement = class GridListElement extends LitElement {
 			}
 		});
 		this.#groupByChanged = false;
+		this.#resolveKey = (key) => this.#source.indexOfKey(key) >= 0 ? key : void 0;
 		this.#markedTickled = /* @__PURE__ */ new Set();
 		this.#markedSelected = /* @__PURE__ */ new Set();
 		this.#selectedSnapshot = /* @__PURE__ */ new Set();
 		this.#onScroll = (e) => {
 			const el = e.target;
-			this.#markScrollHoverSuppress();
+			this.#scrollHover.onScroll();
 			this.#cancelScrollRaf();
 			this.#scrollRaf = requestAnimationFrame(() => {
 				this.#scrollRaf = 0;
@@ -877,6 +980,10 @@ let GridListElement = class GridListElement extends LitElement {
 				this.#emitViewportChange();
 			});
 			this.#scheduleSnap();
+			const offset = this.orientation === `row` ? el.scrollLeft : el.scrollTop;
+			const echo = this.#restoredScrollOffset !== void 0 && Math.abs(offset - this.#restoredScrollOffset) <= 1;
+			this.#restoredScrollOffset = void 0;
+			if (!echo && !this.#viewState.pendingScroll) this.#viewState.notify();
 		};
 		this.#onWheel = (e) => {
 			if (this.orientation !== `row`) return;
@@ -885,23 +992,10 @@ let GridListElement = class GridListElement extends LitElement {
 			const vp = this.#viewportRef.value ?? e.currentTarget;
 			if (!vp) return;
 			if (vp.scrollWidth <= vp.clientWidth + 1) return;
-			this.#markScrollHoverSuppress();
+			this.#scrollHover.onScroll();
 			vp.scrollLeft += e.deltaX + e.deltaY;
 			e.preventDefault();
 		};
-		this.#onHostPointerMove = (e) => {
-			const moved = !Number.isNaN(this.#lastPointerX) && (e.clientX !== this.#lastPointerX || e.clientY !== this.#lastPointerY);
-			this.#lastPointerX = e.clientX;
-			this.#lastPointerY = e.clientY;
-			if (!moved || !this.#scrollHoverSuppress) return;
-			this.#endScrollHoverSuppress();
-			if (this.disableHoverTickle) return;
-			const key = this.shadowRoot?.elementFromPoint?.(e.clientX, e.clientY)?.closest(`.cell`)?.getAttribute(`data-key`);
-			if (key) this.tickled.handlePointerEnter(key);
-		};
-		this.#onHostPointerLeave = () => {
-			this.#endScrollHoverSuppress();
-		};
 		this._onKeyDown = (e) => {
 			if ((e.ctrlKey || e.metaKey) && e.key === `f`) return;
 			if ((e.ctrlKey || e.metaKey) && e.key === `a`) {
@@ -1210,7 +1304,7 @@ let GridListElement = class GridListElement extends LitElement {
       }
       :host(:not([caption-style="separate"])) .cell.tickled,
       /* [data-scroll-hover-suppress] is set while a scroll gesture moves
-         cells beneath a stationary pointer (see disable-scroll-hover-tickle):
+         cells beneath a stationary pointer (see scroll-hover-tickle):
          the :hover highlight is gated so the visual cursor holds still too. */
       :host(:not([caption-style="separate"]):not([disable-hover-tickle]):not([data-scroll-hover-suppress])) .cell:hover {
         background: var(--item-bg-tickled);
@@ -1390,6 +1484,13 @@ let GridListElement = class GridListElement extends LitElement {
     `
 		];
 	}
+	#viewState;
+	/** Saved open / closed choices for groups not currently present. */
+	#pendingExpanded;
+	/** Saved keyboard-cursor key, waiting for its item to appear. */
+	#pendingFocus;
+	/** Main-axis offset the last scroll restore wrote, so its `scroll` echo isn't reported as `user`. */
+	#restoredScrollOffset;
 	#viewportRef;
 	#resizeObserver;
 	#mutationObserver;
@@ -1449,16 +1550,8 @@ let GridListElement = class GridListElement extends LitElement {
 	*/
 	#sourceElement;
 	#source;
-	/**
-	* True while cell `pointerenter` tickling is suppressed by an active or
-	* just-finished scroll gesture (`disable-scroll-hover-tickle`). While set,
-	* the host carries `[data-scroll-hover-suppress]`, which gates the CSS
-	* `:hover` highlight so the visual cursor does not churn either.
-	*/
-	#scrollHoverSuppress;
-	/** Last pointer position seen over the host; real movement ends suppression. */
-	#lastPointerX;
-	#lastPointerY;
+	/** Holds the cursor still while a scroll gesture moves cells beneath a stationary pointer. */
+	#scrollHover;
 	/** Live drag-select preview: covered keys + the surface-relative rect. */
 	#marqueePreview;
 	#marqueeRect;
@@ -1610,8 +1703,9 @@ let GridListElement = class GridListElement extends LitElement {
 			[`caption-backdrop`, this.captionBackdrop]
 		]) if (!this.hasAttribute(attr)) this.setAttribute(attr, value);
 		this.addEventListener(`keydown`, this._onKeyDown);
-		this.addEventListener(`pointermove`, this.#onHostPointerMove, { passive: true });
-		this.addEventListener(`pointerleave`, this.#onHostPointerLeave);
+		this.addEventListener(`pointermove`, this.#scrollHover.onPointerMove, { passive: true });
+		this.addEventListener(`pointerleave`, this.#scrollHover.onPointerLeave);
+		this.#viewState.observeScrollTarget(this);
 		this.#mutationObserver ??= new MutationObserver((records) => this.#onChildrenChanged(records));
 		this.#mutationObserver.observe(this, { childList: true });
 		this.#itemAttrObserver ??= new MutationObserver((records) => this.#onItemAttributesChanged(records));
@@ -1631,9 +1725,9 @@ let GridListElement = class GridListElement extends LitElement {
 		super.disconnectedCallback();
 		this.#stopActiveCaptionPan();
 		this.removeEventListener(`keydown`, this._onKeyDown);
-		this.removeEventListener(`pointermove`, this.#onHostPointerMove);
-		this.removeEventListener(`pointerleave`, this.#onHostPointerLeave);
-		this.#endScrollHoverSuppress();
+		this.removeEventListener(`pointermove`, this.#scrollHover.onPointerMove);
+		this.removeEventListener(`pointerleave`, this.#scrollHover.onPointerLeave);
+		this.#scrollHover.end();
 		this.#resizeObserver?.disconnect();
 		this.#resizeObserver = void 0;
 		this.#mutationObserver?.disconnect();
@@ -1665,10 +1759,11 @@ let GridListElement = class GridListElement extends LitElement {
 		if (removedKeys.length > 0) {
 			const present = new Set(this.#source.keys());
 			const gone = removedKeys.filter((k) => !present.has(k));
-			if (gone.length > 0) this.selection.removeKeys(gone, (k) => k);
+			if (gone.length > 0) this.#demoteGone(gone);
 			const tickledId = this.tickled.tickledId;
-			if (tickledId && gone.includes(tickledId)) this.tickled.focus(void 0);
+			if (tickledId && gone.includes(tickledId)) this.#demoteFocus(tickledId);
 		}
+		this.#reconcileViewState();
 		this._syncItemStates(true);
 		this.#noteChildMutation(previousLength, records);
 		this.requestUpdate();
@@ -1753,6 +1848,7 @@ let GridListElement = class GridListElement extends LitElement {
 		this.#resizeObserver.observe(el);
 		this.#measureViewport(false);
 		this.#syncItems();
+		this.#reconcileViewState();
 		this.requestUpdate();
 		this.#nativeDrag.refreshDraggable();
 	}
@@ -1788,7 +1884,8 @@ let GridListElement = class GridListElement extends LitElement {
 			this.#applyFilters();
 			this.updateComplete.then(() => this.#emitViewportChange());
 		}
-		if (changed.has(`items`) || changed.has(`itemAdapter`)) {
+		const dataModeChanged = changed.has(`items`) || changed.has(`itemAdapter`);
+		if (dataModeChanged) {
 			this.#zoomAnchor = void 0;
 			const prevKeys = this.#source?.keys() ?? [];
 			const modeFlipped = this.itemAdapter !== void 0 !== this.#source instanceof DataGridListSource;
@@ -1796,9 +1893,9 @@ let GridListElement = class GridListElement extends LitElement {
 			const nextKeys = this.#source.keys();
 			const nextKeySet = new Set(nextKeys);
 			const removedKeys = prevKeys.filter((k) => !nextKeySet.has(k));
-			if (removedKeys.length > 0) this.selection.removeKeys(removedKeys, (k) => k);
+			if (removedKeys.length > 0) this.#demoteGone(removedKeys);
 			const tickledId = this.tickled.tickledId;
-			if (tickledId && !nextKeySet.has(tickledId)) this.tickled.focus(void 0);
+			if (tickledId && !nextKeySet.has(tickledId)) this.#demoteFocus(tickledId);
 			this._syncItemStates();
 			this.updateComplete.then(() => this.#emitViewportChange());
 			if (modeFlipped) {
@@ -1837,6 +1934,7 @@ let GridListElement = class GridListElement extends LitElement {
 				this.#captureCentreAnchor(prevOffset, prevExtent, prevItemSize, prevGap, prevCaptionStyle, prevCaptionHeight, prevOrientation);
 			}
 		}
+		if (dataModeChanged || groupsChanged || changed.has(`filterPredicate`) || changed.has(`itemFilterPredicate`)) this.#reconcileViewState();
 	}
 	#groupByChanged;
 	/** Grouping config for the active source, or `undefined` when ungrouped. */
@@ -1880,6 +1978,8 @@ let GridListElement = class GridListElement extends LitElement {
 		if (collapsed) next.add(groupKey);
 		else next.delete(groupKey);
 		this._collapsedGroups = next;
+		this.#pendingExpanded = withoutFlag(this.#pendingExpanded, groupKey);
+		this.#viewState.notify();
 		this._dispatch(`list-group-toggle`, {
 			groupKey,
 			collapsed
@@ -1916,7 +2016,7 @@ let GridListElement = class GridListElement extends LitElement {
 			this.selection.clearAnchor();
 			this.#syncAriaMultiselectable();
 		}
-		if (changed.has(`disableScrollHoverTickle`) && !this.disableScrollHoverTickle) this.#endScrollHoverSuppress();
+		if (changed.has(`scrollHoverTickle`) && this.scrollHoverTickle) this.#scrollHover.end();
 		if (changed.has(`itemsDraggable`)) this.#nativeDrag.refreshDraggable();
 		if (changed.has(`orientation`)) {
 			const vp = this.#viewportRef.value;
@@ -1936,6 +2036,7 @@ let GridListElement = class GridListElement extends LitElement {
 			if (Math.abs(vp.scrollLeft - this._scrollLeft) > .5) vp.scrollLeft = this._scrollLeft;
 		}
 		this.#applyZoomAnchor();
+		this.#viewState.applyPendingScroll((scroll) => this.#applyScroll(scroll));
 		this.#activateTickledPan();
 		if (this.#groupByChanged) {
 			this.#groupByChanged = false;
@@ -2099,8 +2200,9 @@ let GridListElement = class GridListElement extends LitElement {
 	}
 	/**
 	* Data mode: replace the whole item array. Selection and cursor keep any key
-	* that is still present; keys that vanish are dropped (one `list-select`).
-	* A no-op in element mode.
+	* that is still present; keys that vanish are deselected silently and held
+	* as pending view state, so they come back if the key reappears. A no-op in
+	* element mode.
 	*/
 	setItems(items) {
 		if (this.itemAdapter) this.items = items;
@@ -2128,8 +2230,9 @@ let GridListElement = class GridListElement extends LitElement {
 		this.items = next;
 	}
 	/**
-	* Data mode: remove the items carrying these keys. Removed keys are dropped
-	* from selection and cursor (via the `items` change). A no-op in element mode.
+	* Data mode: remove the items carrying these keys. Removed keys leave the
+	* selection and cursor silently (via the `items` change) and are held as
+	* pending view state. A no-op in element mode.
 	*/
 	removeItems(keys) {
 		if (!this.itemAdapter) return;
@@ -2139,18 +2242,22 @@ let GridListElement = class GridListElement extends LitElement {
 	}
 	/**
 	* Data mode: drop every item. Selection and cursor are reset and one
-	* `list-select` with empty sets is emitted. A no-op in element mode.
+	* `list-select` with empty sets is emitted; their keys are held as pending
+	* view state, so re-adding the same keys restores them. A no-op in element
+	* mode.
 	*/
 	clearItems() {
 		if (!this.itemAdapter) return;
 		this.selection.reset();
-		this.tickled.focus(void 0);
+		const tickled = this.tickled.tickledId;
+		if (tickled !== void 0) this.#demoteFocus(tickled);
 		this.items = [];
 		this.#emitSelect(/* @__PURE__ */ new Set(), /* @__PURE__ */ new Set());
 	}
 	/** Move the cursor to the item with this key and scroll it into view. */
 	focusKey(key) {
 		if (this.#source.indexOfKey(key) < 0) return;
+		this.#pendingFocus = void 0;
 		this.tickled.focus(key);
 		this.#scrollItemIntoView(key);
 	}
@@ -2158,6 +2265,121 @@ let GridListElement = class GridListElement extends LitElement {
 	get tickledKey() {
 		return this.tickled.tickledId;
 	}
+	/**
+	* Snapshot selection, collapsed groups, keyboard cursor and scroll as plain
+	* JSON, keyed by item / group key. Includes pending state for keys not
+	* currently present unless `includePending: false`.
+	*/
+	getViewState(options) {
+		const withPending = options?.includePending ?? true;
+		const tickled = this.tickled.tickledId;
+		const focus = this.tickled.inputMode === `keyboard` && tickled !== void 0 && !isSyntheticKey(tickled) ? tickled : void 0;
+		return this.#viewState.shape({
+			selected: keysToArray(this.selectedKeys, withPending ? [...this.selection.pendingKeys].filter((k) => !isSyntheticKey(k)) : []),
+			expanded: expandedRecord(this._collapsedGroups, this.#pendingExpanded, withPending),
+			focus: focus ?? (withPending ? this.#pendingFocus : void 0),
+			scroll: (withPending ? this.#viewState.pendingScroll : void 0) ?? this.#captureScroll()
+		}, options);
+	}
+	/**
+	* Apply saved view state. Fields present replace the current ones; keys
+	* (items or groups) that aren't present yet are applied as they appear.
+	* Restored selection fires `list-select`.
+	*/
+	setViewState(state) {
+		if (!this.#viewState.accepts(state)) return;
+		this.#viewState.restoring(() => {
+			if (state.expanded) {
+				this.#pendingExpanded = capFlags(flagsFromRecord(state.expanded));
+				if (this._collapsedGroups.size > 0) this._collapsedGroups = /* @__PURE__ */ new Set();
+			}
+			if (state.focus !== void 0) this.#pendingFocus = state.focus;
+			if (state.scroll) this.#viewState.pendingScroll = state.scroll;
+			this.#reconcileGroups();
+			if (state.selected) this.selection.restoreKeys(state.selected, this.#resolveKey);
+			this.#reconcileViewState();
+		});
+		this.requestUpdate();
+	}
+	/** Drop view state still waiting for its keys to appear. */
+	clearPendingViewState() {
+		this.selection.clearPending();
+		this.#pendingExpanded = EMPTY_FLAGS;
+		this.#pendingFocus = void 0;
+		this.#viewState.pendingScroll = void 0;
+	}
+	#resolveKey;
+	/** Move state for missing keys to pending; apply pending state for keys now present. */
+	#reconcileViewState() {
+		this.#viewState.restoring(() => {
+			this.#reconcileGroups();
+			this.selection.resolvePending(this.#resolveKey);
+			const focus = this.#pendingFocus;
+			if (focus !== void 0 && this.#source.indexOfKey(focus) >= 0) {
+				this.tickled.setInputMode(`keyboard`);
+				this.tickled.focus(focus);
+				this.#pendingFocus = void 0;
+			}
+		});
+	}
+	#reconcileGroups() {
+		if (this._collapsedGroups.size === 0 && this.#pendingExpanded.size === 0) return;
+		const present = this.groupBy === null ? /* @__PURE__ */ new Set() : new Set(this.#source.groups().map((g) => g.key));
+		const r = reconcileGroups(this._collapsedGroups, this.#pendingExpanded, (key) => present.has(key));
+		if (!r.changed) return;
+		this.#pendingExpanded = r.pending;
+		if (r.collapsed !== this._collapsedGroups) {
+			this._collapsedGroups = r.collapsed;
+			this.#applyGroupingToSource();
+			this.#dropUnreachableCursor();
+			this.#viewState.notify(`data`);
+		}
+	}
+	/** Items left the data: deselect them silently, keeping their keys pending. */
+	#demoteGone(keys) {
+		const synthetic = keys.filter(isSyntheticKey);
+		if (this.selection.demote(keys.filter((k) => !isSyntheticKey(k)))) {
+			this._syncItemStates();
+			this.#viewState.notify(`data`);
+		}
+		if (synthetic.length > 0) this.selection.removeKeys(synthetic, (k) => k);
+	}
+	/** The cursor's item left the data: clear it, remembering a keyboard cursor. */
+	#demoteFocus(key) {
+		if (this.tickled.inputMode === `keyboard` && !isSyntheticKey(key)) this.#pendingFocus ??= key;
+		this.tickled.focus(void 0);
+	}
+	#captureScroll() {
+		const vp = this.#viewportRef.value;
+		if (!vp) return void 0;
+		const horizontal = this.orientation === `row`;
+		const main = horizontal ? vp.scrollLeft : vp.scrollTop;
+		const cross = horizontal ? vp.scrollTop : vp.scrollLeft;
+		const keys = this.#source.keys();
+		return captureGridScroll(this.#layout(), main, cross, (i) => {
+			const key = keys[i];
+			return key === void 0 || isSyntheticKey(key) ? void 0 : key;
+		});
+	}
+	/** Returns `true` once the saved position is fully reached. */
+	#applyScroll(scroll) {
+		const vp = this.#viewportRef.value;
+		const horizontal = this.orientation === `row`;
+		const extent = horizontal ? this._viewportWidth : this._viewportHeight;
+		if (!vp || extent <= 0) return false;
+		const target = gridScrollTarget(scroll, this.#layout(), (key) => this.#source.indexOfKey(key), extent);
+		if (!target) return false;
+		if (horizontal) {
+			if (Math.abs(vp.scrollLeft - target.offset) > .5) this.#restoredScrollOffset = target.offset;
+			vp.scrollLeft = target.offset;
+			this._scrollLeft = target.offset;
+		} else {
+			if (Math.abs(vp.scrollTop - target.offset) > .5) this.#restoredScrollOffset = target.offset;
+			vp.scrollTop = target.offset;
+			this._scrollTop = target.offset;
+		}
+		return target.reached;
+	}
 	/** Element mode: the light-DOM element carrying `key`, or `undefined`. */
 	getItem(key) {
 		return this.#source.resolveKeyToElement(key);
@@ -2296,6 +2518,7 @@ let GridListElement = class GridListElement extends LitElement {
 		this.setAttribute(`data-input-mode`, this.tickled.inputMode);
 	}
 	#emitSelect(selected, previous) {
+		this.#viewState.notify();
 		const selectedEls = /* @__PURE__ */ new Set();
 		const previousEls = /* @__PURE__ */ new Set();
 		for (const key of selected) {
@@ -2592,35 +2815,13 @@ let GridListElement = class GridListElement extends LitElement {
 	#onWheel;
 	/**
 	* Cell `pointerenter` funnel. While a scroll gesture moves cells beneath a
-	* stationary pointer (`disable-scroll-hover-tickle`), the freshly
-	* virtualised cell's enter event is ignored so the cursor holds still.
+	* stationary pointer (see `scrollHoverTickle`), the freshly virtualised
+	* cell's enter event is ignored so the cursor holds still.
 	*/
 	#handleCellPointerEnter(key) {
-		if (this.#scrollHoverSuppress) return;
+		if (this.#scrollHover.suppressed()) return;
 		this.tickled.handlePointerEnter(key);
 	}
-	/** Open the scroll-hover suppression window (no-op unless opted in and not already open). */
-	#markScrollHoverSuppress() {
-		if (!this.disableScrollHoverTickle || this.#scrollHoverSuppress) return;
-		this.#scrollHoverSuppress = true;
-		this.toggleAttribute(`data-scroll-hover-suppress`, true);
-	}
-	#endScrollHoverSuppress() {
-		if (!this.#scrollHoverSuppress) return;
-		this.#scrollHoverSuppress = false;
-		this.toggleAttribute(`data-scroll-hover-suppress`, false);
-	}
-	/**
-	* A real pointer movement ends scroll-hover suppression. The first
-	* `pointerenter` on a real move is swallowed by design (it can be
-	* indistinguishable from a virtualisation enter), so the cell already under
-	* the pointer is re-tickled here — otherwise the cursor would lag one cell
-	* boundary behind the pointer. The very first tracked `pointermove` only
-	* establishes the baseline; it cannot know the pointer moved.
-	*/
-	#onHostPointerMove;
-	/** The pointer leaving the list ends suppression, so re-entry hovers normally. */
-	#onHostPointerLeave;
 	#cancelScrollRaf() {
 		if (this.#scrollRaf !== 0) {
 			cancelAnimationFrame(this.#scrollRaf);
@@ -2718,9 +2919,9 @@ __decorate([property({
 })], GridListElement.prototype, "disableHoverTickle", void 0);
 __decorate([property({
 	type: Boolean,
-	attribute: `disable-scroll-hover-tickle`,
+	attribute: `scroll-hover-tickle`,
 	reflect: true
-})], GridListElement.prototype, "disableScrollHoverTickle", void 0);
+})], GridListElement.prototype, "scrollHoverTickle", void 0);
 __decorate([property({
 	type: Number,
 	attribute: `item-size`