@ixfx/components 0.13.2 → 0.13.4

package/dist/miller.js

@@ -2,7 +2,7 @@ import { t as TickledController } from "./tickled-controller-D-HZymaZ.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrAHEj1q.js";
 import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
-import { i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, t as createTreeListSearchAdapter } from "./incr-search-D91M4Ozq.js";
+import { i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, t as createTreeListSearchAdapter } from "./incr-search-JIhwB49y.js";
 import "./interaction-ZTh4htzr.js";
 import { t as collectDataResult } from "./data-provider-35TyWclX.js";
 import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-BjcMyauw.js";
@@ -52,86 +52,30 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 				return;
 			}
 			switch (event.key) {
-				case `ArrowDown`: {
+				case `ArrowDown`:
 					event.preventDefault();
-					const current = this.#getTickledNodeAndDepth();
-					let targetIndex = 0;
-					if (current && current.depth === currentDepth) targetIndex = Math.min(current.index + 1, col.length - 1);
-					const targetNode = col[targetIndex];
-					if (!targetNode) break;
-					this.#setTickledNode(targetNode, currentDepth);
-					if (this.interactionMode === `standard` || this.interactionMode === `vscode`) {
-						const prevIndex = current?.index ?? 0;
-						if (event.shiftKey) {
-							if (!this.#anchor || this.#anchor.depth !== currentDepth) {
-								const anchorNode = col[prevIndex];
-								if (anchorNode) this.#anchor = {
-									key: anchorNode.item.key,
-									depth: currentDepth,
-									index: prevIndex,
-									selectionSnapshot: this.interactionMode === `vscode` ? new Set(this._selectedKeys) : void 0
-								};
-							}
-							if (this.#anchor) {
-								const from = Math.min(this.#anchor.index, targetIndex);
-								const to = Math.max(this.#anchor.index, targetIndex);
-								const rangeKeys = col.slice(from, to + 1).map((n) => n.item.key);
-								if (this.interactionMode === `vscode`) {
-									const snap = this.#anchor.selectionSnapshot;
-									for (const k of rangeKeys) if (snap.has(k)) this._selectedKeys.delete(k);
-									else this._selectedKeys.add(k);
-								} else this._selectedKeys = new Set(rangeKeys);
-							}
-						} else if (this.interactionMode === `standard`) this.#anchor = {
-							key: targetNode.item.key,
-							depth: currentDepth,
-							index: targetIndex
-						};
-						else this.#anchor = void 0;
-					}
-					this.requestUpdate();
+					this.#moveCursor(col, currentDepth, event, (current) => Math.min(current + 1, col.length - 1));
 					break;
-				}
-				case `ArrowUp`: {
+				case `ArrowUp`:
 					event.preventDefault();
-					const current = this.#getTickledNodeAndDepth();
-					let targetIndex = 0;
-					if (current && current.depth === currentDepth) targetIndex = Math.max(current.index - 1, 0);
-					const targetNode = col[targetIndex];
-					if (!targetNode) break;
-					this.#setTickledNode(targetNode, currentDepth);
-					if (this.interactionMode === `standard` || this.interactionMode === `vscode`) {
-						const prevIndex = current?.index ?? 0;
-						if (event.shiftKey) {
-							if (!this.#anchor || this.#anchor.depth !== currentDepth) {
-								const anchorNode = col[prevIndex];
-								if (anchorNode) this.#anchor = {
-									key: anchorNode.item.key,
-									depth: currentDepth,
-									index: prevIndex,
-									selectionSnapshot: this.interactionMode === `vscode` ? new Set(this._selectedKeys) : void 0
-								};
-							}
-							if (this.#anchor) {
-								const from = Math.min(this.#anchor.index, targetIndex);
-								const to = Math.max(this.#anchor.index, targetIndex);
-								const rangeKeys = col.slice(from, to + 1).map((n) => n.item.key);
-								if (this.interactionMode === `vscode`) {
-									const snap = this.#anchor.selectionSnapshot;
-									for (const k of rangeKeys) if (snap.has(k)) this._selectedKeys.delete(k);
-									else this._selectedKeys.add(k);
-								} else this._selectedKeys = new Set(rangeKeys);
-							}
-						} else if (this.interactionMode === `standard`) this.#anchor = {
-							key: targetNode.item.key,
-							depth: currentDepth,
-							index: targetIndex
-						};
-						else this.#anchor = void 0;
-					}
-					this.requestUpdate();
+					this.#moveCursor(col, currentDepth, event, (current) => Math.max(current - 1, 0));
+					break;
+				case `Home`:
+					event.preventDefault();
+					this.#moveCursor(col, currentDepth, event, () => 0, true);
+					break;
+				case `End`:
+					event.preventDefault();
+					this.#moveCursor(col, currentDepth, event, () => col.length - 1, true);
+					break;
+				case `PageUp`:
+					event.preventDefault();
+					this.#moveCursor(col, currentDepth, event, (current) => Math.max(current - this.#pageSize(currentDepth), 0), true);
+					break;
+				case `PageDown`:
+					event.preventDefault();
+					this.#moveCursor(col, currentDepth, event, (current) => Math.min(current + this.#pageSize(currentDepth), col.length - 1), true);
 					break;
-				}
 				case `ArrowRight`: {
 					event.preventDefault();
 					const tickled = this.#getTickledNodeAndDepth();
@@ -224,14 +168,28 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 			window.addEventListener(`pointermove`, this.#onResizeMove);
 			window.addEventListener(`pointerup`, this.#onResizeEnd);
 		};
+		this.#resizeRaf = null;
+		this.#resizePendingWidth = 0;
 		this.#onResizeMove = (event) => {
 			if (this.#resizingDepth < 0) return;
-			const delta = event.clientX - this.#resizeStartX;
-			const newWidth = Math.max(32, this.#resizeStartWidth + delta);
-			this.#columnWidths.set(this.#resizingDepth, newWidth);
-			this.requestUpdate();
+			this.#resizePendingWidth = Math.max(32, this.#resizeStartWidth + (event.clientX - this.#resizeStartX));
+			this.#resizeRaf ??= requestAnimationFrame(this.#applyResizeWidth);
+		};
+		this.#applyResizeWidth = () => {
+			this.#resizeRaf = null;
+			if (this.#resizingDepth < 0) return;
+			(this.shadowRoot?.querySelectorAll(`.column`)[this.#resizingDepth])?.setAttribute(`style`, this.#explicitWidthStyle(this.#resizePendingWidth));
 		};
 		this.#onResizeEnd = () => {
+			if (this.#resizeRaf !== null) {
+				cancelAnimationFrame(this.#resizeRaf);
+				this.#resizeRaf = null;
+			}
+			if (this.#resizingDepth >= 0 && this.#resizePendingWidth > 0) {
+				this.#columnWidths.set(this.#resizingDepth, this.#resizePendingWidth);
+				this.requestUpdate();
+			}
+			this.#resizePendingWidth = 0;
 			this.#resizingDepth = -1;
 			window.removeEventListener(`pointermove`, this.#onResizeMove);
 			window.removeEventListener(`pointerup`, this.#onResizeEnd);
@@ -838,7 +796,7 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 				this.#handleStandardClick(node, depth, event);
 				break;
 			case `manual`: break;
-			case `checked`: this.#expandNode(node, depth);
+			case `checked`: this.#expandNode(node, depth, true);
 		}
 	}
 	#handleImplicitClick(node, depth) {
@@ -848,7 +806,7 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 		this._selectedKeys = /* @__PURE__ */ new Set([node.item.key]);
 		this._selectedNodes.clear();
 		this._selectedNodes.add(node);
-		this.#expandNode(node, depth);
+		this.#expandNode(node, depth, true);
 		if (!previous.has(node)) this.#dispatchSelectEvent(previous);
 	}
 	#handleStandardClick(node, depth, event) {
@@ -891,16 +849,22 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 		} : void 0;
 		this._selectedByDepth.set(depth, node);
 		this.#lastSelectedNode = node;
-		this.#expandNode(node, depth);
+		this.#expandNode(node, depth, true);
 		if (!previous.has(node) || previous.size !== 1) this.#dispatchSelectEvent(previous);
 	}
-	#expandNode(node, depth) {
+	/**
+	* Open the column for `node`. `immediate` skips the lazy-load debounce: use
+	* it for deliberate clicks, where the user has committed to this node. The
+	* debounce is kept for keyboard navigation, which can sweep over many
+	* branches in quick succession.
+	*/
+	#expandNode(node, depth, immediate = false) {
 		if (node.item.isLeaf) {
 			this._columns = this._columns.slice(0, depth + 1);
 			this.requestUpdate();
 			return;
 		}
-		if (node.children === void 0) this.#loadUnloadedChildren(node, depth, true);
+		if (node.children === void 0) this.#loadUnloadedChildren(node, depth, true, immediate);
 		else {
 			const newColumns = this._columns.slice(0, depth + 1);
 			newColumns.push(node.children);
@@ -925,10 +889,11 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 	* own depth: its column for expansions, -1 for a view root (it sits above
 	* column 0, so loaders computing child depth as `depth + 1` stay correct).
 	*/
-	#loadUnloadedChildren(node, parentDepth, fireExpandEvent) {
+	#loadUnloadedChildren(node, parentDepth, fireExpandEvent, immediate = false) {
 		const nodeDepth = parentDepth + 1;
 		this._columns = this._columns.slice(0, nodeDepth);
 		this._loadingDepth = nodeDepth;
+		this.#pendingController?.abort();
 		this.#pendingNode = node;
 		const controller = new AbortController();
 		this.#pendingController = controller;
@@ -959,15 +924,20 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 			this.requestUpdate();
 		};
 		if (this.model || this.loadChildren) {
-			if (this.#expandTimer !== void 0) clearTimeout(this.#expandTimer);
-			this.#expandTimer = setTimeout(() => {
+			if (this.#expandTimer !== void 0) {
+				clearTimeout(this.#expandTimer);
+				this.#expandTimer = void 0;
+			}
+			const load = () => {
 				this.#expandTimer = void 0;
 				if (this.#pendingNode !== node) return;
 				(this.model ? this.model.getChildren(node, nodeDepth - 1, controller.signal) : collectDataResult(this.loadChildren({
 					node,
 					depth: nodeDepth - 1
 				}, controller.signal), controller.signal)).then((children) => applyChildren([...children])).catch(handleError);
-			}, EXPAND_DEBOUNCE_MS);
+			};
+			if (immediate) load();
+			else this.#expandTimer = setTimeout(load, EXPAND_DEBOUNCE_MS);
 		} else {
 			this._loadingDepth = void 0;
 			this.#pendingNode = void 0;
@@ -978,10 +948,12 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 		}
 	}
 	#onCheckboxClick(node) {
+		const previous = new Set(this._selectedNodes);
 		const currentlySelected = this._selectedKeys.has(node.item.key);
 		if (!!node.children?.length ? this.#allDescendantsSelected(node) : currentlySelected) this.#applyCheckedToggle(node, false);
 		else this.#applyCheckedToggle(node, true);
 		this.requestUpdate();
+		this.#dispatchSelectEvent(previous);
 	}
 	#allDescendantsSelected(node) {
 		if (!this._selectedKeys.has(node.item.key)) return false;
@@ -1018,7 +990,7 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 			index
 		};
 	}
-	#scrollNavigatedItemIntoView() {
+	#scrollNavigatedItemIntoView(behavior = `smooth`) {
 		requestAnimationFrame(() => {
 			const tickled = this.#getTickledNodeAndDepth();
 			if (!tickled) return;
@@ -1026,7 +998,7 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 			if (!container) return;
 			container.querySelectorAll(`.item`)[tickled.index]?.scrollIntoView({
 				block: `nearest`,
-				behavior: `smooth`
+				behavior
 			});
 		});
 	}
@@ -1041,9 +1013,67 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 			composed: true
 		}));
 	}
+	/**
+	* Number of items a PageUp/PageDown moves: how many rows fit in the column's
+	* visible area, less one so the previous page's last row stays in view.
+	*/
+	#pageSize(depth) {
+		const content = this.shadowRoot?.querySelectorAll(`.column`)[depth]?.querySelector(`.column-content`);
+		const item = content?.querySelector(`.item`);
+		if (!content || !item || item.offsetHeight === 0) return 10;
+		return Math.max(1, Math.floor(content.clientHeight / item.offsetHeight) - 1);
+	}
+	/**
+	* Move the cursor within column `col` to the index returned by `target`
+	* (given the current cursor index, or -1 when the cursor isn't in this
+	* column, which behaves as "before the first item"). Handles Shift range
+	* extension and anchor seating for `standard` / `vscode` modes.
+	* `scroll` brings the new item into view (for jumps larger than one row).
+	*/
+	#moveCursor(col, currentDepth, event, target, scroll = false) {
+		const current = this.#getTickledNodeAndDepth();
+		const targetIndex = target(current !== void 0 && current.depth === currentDepth ? current.index : -1);
+		const targetNode = col[targetIndex];
+		if (!targetNode) return;
+		this.#setTickledNode(targetNode, currentDepth);
+		if (this.interactionMode === `standard` || this.interactionMode === `vscode`) {
+			const prevIndex = current?.index ?? 0;
+			if (event.shiftKey) {
+				if (!this.#anchor || this.#anchor.depth !== currentDepth) {
+					const anchorNode = col[prevIndex];
+					if (anchorNode) this.#anchor = {
+						key: anchorNode.item.key,
+						depth: currentDepth,
+						index: prevIndex,
+						selectionSnapshot: this.interactionMode === `vscode` ? new Set(this._selectedKeys) : void 0
+					};
+				}
+				if (this.#anchor) {
+					const from = Math.min(this.#anchor.index, targetIndex);
+					const to = Math.max(this.#anchor.index, targetIndex);
+					const rangeKeys = col.slice(from, to + 1).map((n) => n.item.key);
+					if (this.interactionMode === `vscode`) {
+						const snap = this.#anchor.selectionSnapshot;
+						for (const k of rangeKeys) if (snap.has(k)) this._selectedKeys.delete(k);
+						else this._selectedKeys.add(k);
+					} else this._selectedKeys = new Set(rangeKeys);
+				}
+			} else if (this.interactionMode === `standard`) this.#anchor = {
+				key: targetNode.item.key,
+				depth: currentDepth,
+				index: targetIndex
+			};
+			else this.#anchor = void 0;
+		}
+		this.requestUpdate();
+		if (scroll) this.#scrollNavigatedItemIntoView(`auto`);
+	}
 	#onKeyDown;
 	#onResizeStart;
+	#resizeRaf;
+	#resizePendingWidth;
 	#onResizeMove;
+	#applyResizeWidth;
 	#onResizeEnd;
 	#getColumnHeader(depth) {
 		if (depth === 0) return this.#displayRoot?.item.label ?? ``;
@@ -1057,9 +1087,12 @@ let MillerBaseElement = class MillerBaseElement extends LitElement {
 		}
 		return ``;
 	}
+	#explicitWidthStyle(width) {
+		return `width:${width}px;flex-grow:0;flex-shrink:0;flex-basis:auto;max-width:none`;
+	}
 	#columnStyle(depth, isLast) {
 		const w = this.#columnWidths.get(depth);
-		if (w !== void 0) return `width:${w}px;flex-grow:0;flex-shrink:0;flex-basis:auto;max-width:none`;
+		if (w !== void 0) return this.#explicitWidthStyle(w);
 		if (this.stretchLastColumn && isLast) return `width:max-content;flex-grow:1;flex-shrink:0;flex-basis:auto;min-width:0`;
 		return `width:max-content;flex-grow:0;flex-shrink:0;flex-basis:auto`;
 	}
@@ -1309,8 +1342,24 @@ __decorate([state()], MillerBaseElement.prototype, "_selectedNodes", void 0);
 MillerBaseElement = __decorate([safeCustomElement(`ixfx-miller-base`)], MillerBaseElement);
 //#endregion
 //#region src/miller/miller-list.ts
+const HAS_CHECKED = 1;
+const HAS_UNCHECKED = 2;
 /**
-* Recursively compute the checkbox state for a node based on `selectedKeys`.
+* Walk the loaded subtree under `node`, returning which kinds of leaf were
+* seen (`HAS_CHECKED` | `HAS_UNCHECKED`). Stops as soon as both have been
+* seen, since the result can no longer change.
+*/
+function scanCheckState(node, selectedKeys) {
+	if (node.item.isLeaf || !node.children?.length) return selectedKeys.has(node.item.key) ? HAS_CHECKED : HAS_UNCHECKED;
+	let seen = 0;
+	for (const child of node.children) {
+		seen |= scanCheckState(child, selectedKeys);
+		if (seen === 3) break;
+	}
+	return seen;
+}
+/**
+* Compute the checkbox state for a node based on `selectedKeys`.
 *
 * - Unloaded branch (`children === undefined`): treated as a leaf — we can only
 *   report on what is known.
@@ -1319,12 +1368,9 @@ MillerBaseElement = __decorate([safeCustomElement(`ixfx-miller-base`)], MillerBa
 *   indeterminate otherwise.
 */
 function computeCheckboxState(node, selectedKeys) {
-	if (node.item.isLeaf || !node.children?.length) return selectedKeys.has(node.item.key) ? `checked` : `unchecked`;
-	const childStates = node.children.map((c) => computeCheckboxState(c, selectedKeys));
-	const allChecked = childStates.every((s) => s === `checked`);
-	const allUnchecked = childStates.every((s) => s === `unchecked`);
-	if (allChecked) return `checked`;
-	if (allUnchecked) return `unchecked`;
+	const seen = scanCheckState(node, selectedKeys);
+	if (seen === HAS_CHECKED) return `checked`;
+	if (seen === HAS_UNCHECKED) return `unchecked`;
 	return `indeterminate`;
 }
 let MillerListElement = class MillerListElement extends MillerBaseElement {
@@ -1624,5 +1670,3 @@ var MillerTreeController = class {
 };
 //#endregion
 export { MillerBaseElement, MillerListElement, MillerTreeController };
-
-//# sourceMappingURL=miller.js.map

package/dist/narrowed-text.js

@@ -3,7 +3,7 @@ import { t as TickledController } from "./tickled-controller-D-HZymaZ.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrAHEj1q.js";
 import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
-import { p as createIncrSearch } from "./incr-search-D91M4Ozq.js";
+import { p as createIncrSearch } from "./incr-search-JIhwB49y.js";
 import "./interaction-ZTh4htzr.js";
 import { LitElement, css, html, nothing } from "lit";
 import { property, query, state } from "lit/decorators.js";
@@ -618,5 +618,3 @@ __decorate([query(`slot`)], NarrowedTextElement.prototype, "_slot", void 0);
 NarrowedTextElement = __decorate([safeCustomElement(`ixfx-narrowed-text`)], NarrowedTextElement);
 //#endregion
 export { NarrowedTextElement };
-
-//# sourceMappingURL=narrowed-text.js.map

package/dist/notification-pill-DyZydXoZ.d.ts

@@ -64,5 +64,4 @@ interface NotificationPillElement {
   addEventListener: (<K extends keyof NotificationPillElementEventMap>(type: K, listener: (this: NotificationPillElement, event: NotificationPillElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
-export { Notification as a, NotificationRendererHooks as c, PillTapEvent as i, NotificationType as l, NotificationPillElementEventMap as n, NotificationContent as o, PillTapDetail as r, NotificationRenderer as s, NotificationPillElement as t, NotifierOptions as u };
-//# sourceMappingURL=notification-pill-DyZydXoZ.d.ts.map
+export { Notification as a, NotificationRendererHooks as c, PillTapEvent as i, NotificationType as l, NotificationPillElementEventMap as n, NotificationContent as o, PillTapDetail as r, NotificationRenderer as s, NotificationPillElement as t, NotifierOptions as u };

package/dist/notifier.js

@@ -143,5 +143,3 @@ __decorate([property({
 NotificationPillElement = __decorate([safeCustomElement(`ixfx-notification-pill`)], NotificationPillElement);
 //#endregion
 export { NotificationPillElement };
-
-//# sourceMappingURL=notifier.js.map

package/dist/pan-text-CoYmt2qd.d.ts

@@ -63,5 +63,4 @@ declare global {
   }
 }
 //#endregion
-export { PanTextMode as n, PanTextElement as t };
-//# sourceMappingURL=pan-text-CoYmt2qd.d.ts.map
+export { PanTextMode as n, PanTextElement as t };

package/dist/pan-text-CqtvjPyK.js

@@ -231,5 +231,3 @@ __decorate([query(`.text`)], PanTextElement.prototype, "_textEl", void 0);
 PanTextElement = __decorate([safeCustomElement(`ixfx-pan-text`)], PanTextElement);
 //#endregion
 export { PanTextElement as t };
-
-//# sourceMappingURL=pan-text-CqtvjPyK.js.map

package/dist/panel.d.ts

@@ -1,4 +1,4 @@
-import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, o as TitlebarToggleEvent, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-B5zSTZnF.js";
+import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, o as TitlebarToggleEvent, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-Tqu-VvMU.js";
 import { LitElement } from "lit";
 //#region src/panel/panel.d.ts
 /** Backwards-compatible aliases: canonical types now live in `../titlebar/titlebar.js`. */
@@ -40,5 +40,4 @@ interface PanelElement {
   addEventListener: (<K extends keyof PanelElementEventMap>(type: K, listener: (this: PanelElement, event: PanelElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
-export { PanelCloseEvent, PanelElement, PanelElementEventMap, PanelOrientation, PanelToggleDetail, PanelToggleEvent, PanelToggleInteraction, PanelVariant };
-//# sourceMappingURL=panel.d.ts.map
+export { PanelCloseEvent, PanelElement, PanelElementEventMap, PanelOrientation, PanelToggleDetail, PanelToggleEvent, PanelToggleInteraction, PanelVariant };

package/dist/panel.js

@@ -217,5 +217,3 @@ __decorate([property({
 PanelElement = __decorate([safeCustomElement(`ixfx-panel`)], PanelElement);
 //#endregion
 export { PanelElement };
-
-//# sourceMappingURL=panel.js.map

package/dist/polar-pad.d.ts

@@ -74,5 +74,4 @@ declare global {
   }
 }
 //#endregion
-export { PolarPad, PolarPadInputDetail, PolarPadInputEvent };
-//# sourceMappingURL=polar-pad.d.ts.map
+export { PolarPad, PolarPadInputDetail, PolarPadInputEvent };

package/dist/polar-pad.js

@@ -592,5 +592,3 @@ __decorate([property({
 PolarPad = __decorate([safeCustomElement(`ixfx-polar-pad`)], PolarPad);
 //#endregion
 export { PolarPad };
-
-//# sourceMappingURL=polar-pad.js.map

package/dist/popup-D80sj2QC.js

@@ -22,5 +22,3 @@ const popupSurfaceStyles = css`
 `;
 //#endregion
 export { popupSurfaceStyles as t };
-
-//# sourceMappingURL=popup-D80sj2QC.js.map

package/dist/prominence-DlFShic3.js

@@ -100,5 +100,3 @@ css`
 `;
 //#endregion
 export { prominenceStyles as t };
-
-//# sourceMappingURL=prominence-DlFShic3.js.map

package/dist/radial-input-DU6t2hYO.d.ts

@@ -67,5 +67,4 @@ declare global {
   }
 }
 //#endregion
-export { RadialInputChangeDetail as a, RadialInputInputEvent as c, MarkerStyle as i, ValueMode as l, LaneData as n, RadialInputChangeEvent as o, LaneType as r, RadialInputInputDetail as s, RadialInputElement as t };
-//# sourceMappingURL=radial-input-DU6t2hYO.d.ts.map
+export { RadialInputChangeDetail as a, RadialInputInputEvent as c, MarkerStyle as i, ValueMode as l, LaneData as n, RadialInputChangeEvent as o, LaneType as r, RadialInputInputDetail as s, RadialInputElement as t };

package/dist/radial-input-KMVltQfe.js

@@ -872,5 +872,3 @@ __decorate([property({
 RadialInputElement = __decorate([safeCustomElement(`ixfx-radial-input`)], RadialInputElement);
 //#endregion
 export { RadialInputElement as t };
-
-//# sourceMappingURL=radial-input-KMVltQfe.js.map

package/dist/range-input.d.ts

@@ -49,5 +49,4 @@ declare global {
   }
 }
 //#endregion
-export { RangeInput };
-//# sourceMappingURL=range-input.d.ts.map
+export { RangeInput };

package/dist/range-input.js

@@ -487,5 +487,3 @@ __decorate([query(`ixfx-tooltip`)], RangeInput.prototype, "_tooltipEl", void 0);
 RangeInput = __decorate([safeCustomElement(`ixfx-range-input`)], RangeInput);
 //#endregion
 export { RangeInput };
-
-//# sourceMappingURL=range-input.js.map

package/dist/range.d.ts

@@ -34,5 +34,4 @@ declare global {
   }
 }
 //#endregion
-export { RangeElement };
-//# sourceMappingURL=range.d.ts.map
+export { RangeElement };

package/dist/range.js

@@ -155,5 +155,3 @@ __decorate([property({ type: Number })], RangeElement.prototype, "step", void 0)
 RangeElement = __decorate([safeCustomElement(`ixfx-range`)], RangeElement);
 //#endregion
 export { RangeElement };
-
-//# sourceMappingURL=range.js.map

package/dist/registry-BEtb8_wB.js

@@ -42,5 +42,3 @@ function svgToDataUri(svg) {
 }
 //#endregion
 export { iconBus as a, setIconFont as c, hasIcon as i, svgToDataUri as l, getIconEntry as n, registerFontIcon as o, getIconFont as r, registerIcon as s, getIcon as t };
-
-//# sourceMappingURL=registry-BEtb8_wB.js.map

package/dist/{scroll-fade-BrNUIYnm.js → scroll-fade-Xx28D7mH.js}

@@ -17,8 +17,7 @@ import { css, unsafeCSS } from "lit";
 * `mask-image`, so putting both on the same element makes the second
 * overwrite the first. An element that scrolls on both axes at once (e.g.
 * a grid viewport with `overflow: auto`) should use the vertical fade on
-* the viewport itself and handle the horizontal axis separately (e.g. a
-* synced header strip with its own `scroll-fade-x`).
+* the viewport itself and handle the horizontal axis separately.
 *
 * CSS variables:
 * - `--scroll-fade-width` (default `30px`): how far the fade extends from each edge.
@@ -28,6 +27,10 @@ import { css, unsafeCSS } from "lit";
 *   want something like `0.7`–`0.8` so the edge row stays partly readable.
 *   Deliberately *not* `@property`-registered, so it inherits normally and a
 *   consumer override on the host reaches the shadow-DOM scroller.
+* - `--scroll-fade-inset-start` / `--scroll-fade-inset-end` (default `0px`):
+*   move the fade edges inwards, leaving the inset strip unmasked. Use when
+*   something pinned overlays the scroller's edge (e.g. a sticky header row).
+*   These inherit, so reset them on nested faded elements.
 *
 * ```ts
 * import { scrollFadeStyles } from '../styles/scroll-fade.js';
@@ -70,14 +73,15 @@ function scrollFadeStyles(axis) {
       animation: ${unsafeCSS(keyframesName)};
       animation-timeline: ${unsafeCSS(timeline)};
       mask-image: linear-gradient(${unsafeCSS(gradientDirection)},
-        rgb(0 0 0 / calc(1 - var(--scroll-fade-strength, 1))),
-        black var(${unsafeCSS(start)}, 0px) calc(100% - var(${unsafeCSS(end)}, 0px)),
-        rgb(0 0 0 / calc(1 - var(--scroll-fade-strength, 1)))
+        black var(--scroll-fade-inset-start, 0px),
+        rgb(0 0 0 / calc(1 - var(--scroll-fade-strength, 1))) var(--scroll-fade-inset-start, 0px),
+        black calc(var(--scroll-fade-inset-start, 0px) + var(${unsafeCSS(start)}, 0px))
+          calc(100% - var(--scroll-fade-inset-end, 0px) - var(${unsafeCSS(end)}, 0px)),
+        rgb(0 0 0 / calc(1 - var(--scroll-fade-strength, 1))) calc(100% - var(--scroll-fade-inset-end, 0px)),
+        black calc(100% - var(--scroll-fade-inset-end, 0px))
       );
     }
   `;
 }
 //#endregion
 export { scrollFadeStyles as t };
-
-//# sourceMappingURL=scroll-fade-BrNUIYnm.js.map

package/dist/select-horiz.d.ts

@@ -46,5 +46,4 @@ declare class SelectHorizElement extends SelectHorizElement_base {
   private _emitChange;
 }
 //#endregion
-export { SelectHorizChangeDetail, SelectHorizChangeEvent, SelectHorizElement, SelectHorizEventMap };
-//# sourceMappingURL=select-horiz.d.ts.map
+export { SelectHorizChangeDetail, SelectHorizChangeEvent, SelectHorizElement, SelectHorizEventMap };

package/dist/select-horiz.js

@@ -3,7 +3,7 @@ import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrA
 import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
 import "./interaction-ZTh4htzr.js";
-import { t as scrollFadeStyles } from "./scroll-fade-BrNUIYnm.js";
+import { t as scrollFadeStyles } from "./scroll-fade-Xx28D7mH.js";
 import { t as WheelNudgeMixin } from "./wheel-nudge-D5rmht3v.js";
 import { LitElement, css, html } from "lit";
 import { property, state } from "lit/decorators.js";
@@ -260,5 +260,3 @@ __decorate([property({ type: String })], SelectHorizElement.prototype, "selected
 SelectHorizElement = __decorate([safeCustomElement(`ixfx-select-horiz`)], SelectHorizElement);
 //#endregion
 export { SelectHorizElement };
-
-//# sourceMappingURL=select-horiz.js.map

package/dist/slider-input-BxURAAmD.d.ts

@@ -169,5 +169,4 @@ interface SliderInputElement {
   addEventListener: (<K extends keyof SliderInputElementEventMap>(type: K, listener: (this: SliderInputElement, event: SliderInputElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
-export { SliderValueMode as _, SliderInputChangeDetail as a, SliderInputInputDetail as c, SliderLaneType as d, SliderMarkerStyle as f, SliderValueDrag as g, SliderValueCFollow as h, SliderHandleKey as i, SliderInputInputEvent as l, SliderSingleStyle as m, SliderChangedField as n, SliderInputChangeEvent as o, SliderOrientation as p, SliderCrossover as r, SliderInputElementEventMap as s, SliderInputElement as t, SliderLaneData as u };
-//# sourceMappingURL=slider-input-BxURAAmD.d.ts.map
+export { SliderValueMode as _, SliderInputChangeDetail as a, SliderInputInputDetail as c, SliderLaneType as d, SliderMarkerStyle as f, SliderValueDrag as g, SliderValueCFollow as h, SliderHandleKey as i, SliderInputInputEvent as l, SliderSingleStyle as m, SliderChangedField as n, SliderInputChangeEvent as o, SliderOrientation as p, SliderCrossover as r, SliderInputElementEventMap as s, SliderInputElement as t, SliderLaneData as u };

package/dist/slider-input-ByHdotzp.js

@@ -1970,5 +1970,3 @@ __decorate([property({
 SliderInputElement = __decorate([safeCustomElement(`ixfx-slider-input`)], SliderInputElement);
 //#endregion
 export { SliderInputElement as t };
-
-//# sourceMappingURL=slider-input-ByHdotzp.js.map

package/dist/snackbar.d.ts

@@ -54,5 +54,4 @@ declare global {
   }
 }
 //#endregion
-export { SnackbarDismiss, SnackbarElement, SnackbarMode, SnackbarPlacement };
-//# sourceMappingURL=snackbar.d.ts.map
+export { SnackbarDismiss, SnackbarElement, SnackbarMode, SnackbarPlacement };

package/dist/snackbar.js

@@ -261,5 +261,3 @@ __decorate([state()], SnackbarElement.prototype, "_isOpen", void 0);
 SnackbarElement = __decorate([safeCustomElement(`ixfx-snackbar`)], SnackbarElement);
 //#endregion
 export { SnackbarElement };
-
-//# sourceMappingURL=snackbar.js.map

package/dist/snap-container.d.ts

@@ -44,5 +44,4 @@ declare global {
   }
 }
 //#endregion
-export { ClickSnapMode, SnapChangeDetail, SnapChangeEvent, SnapContainer, SnapInputDetail, SnapInputEvent, SnapLogic };
-//# sourceMappingURL=snap-container.d.ts.map
+export { ClickSnapMode, SnapChangeDetail, SnapChangeEvent, SnapContainer, SnapInputDetail, SnapInputEvent, SnapLogic };

package/dist/snap-container.js

@@ -294,5 +294,3 @@ __decorate([state()], SnapContainer.prototype, "_dragging", void 0);
 SnapContainer = __decorate([safeCustomElement(`ixfx-snap-container`)], SnapContainer);
 //#endregion
 export { SnapContainer };
-
-//# sourceMappingURL=snap-container.js.map