@ixfx/components 0.16.0 → 0.16.2

package/dist/{grid-list-D6n7WH8l.d.ts → grid-list-DaeSHv9P.d.ts}

@@ -1,10 +1,10 @@
 import { L as ListDragPreviewRenderer, R as ListDragPreviewSourceResolver, V as ListNativeDragStartEvent } from "./tree-component-DgfkxmVY.js";
 import { a as ViewStateBase, t as GetViewStateOptions } from "./types-LU1u0CB8.js";
 import "./index-9ttcdwlL.js";
-import { S as ListSearchController } from "./index-Dr80Zdl6.js";
+import { f as ListSelectIntentSource, i as ListInteractionMode, l as ListSelectIntentDetail, m as ListSelectionMode } from "./list-selection-types-hj9Njei3.js";
+import { S as ListSearchController } from "./index-BjRoPrwj.js";
 import "./pan-text-CoYmt2qd.js";
 import { i as ListGroupChangeEvent, n as ListGroupBy, o as ListGroupInfo, s as ListGroupLabel, u as ListGroupToggleEvent } from "./grouping-CUKgmkMm.js";
-import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
 import "./list-group-header.js";
 import "./list-native-drag-controller-D_UrXipS.js";
 import { i as TickledItem, n as TickledController } from "./tickled-controller-DodxD3eQ.js";
@@ -86,10 +86,12 @@ type ListDragSelectControllerConfig<T> = {
   /**
    * Fired once on release with the final set. Host applies it to its
    * selection. `additive` is `true` when the drag ran with Shift (add) or
-   * Cmd / Ctrl (invert) held.
+   * Cmd / Ctrl (invert) held. `covered` is the set the marquee itself hit,
+   * before combining with the base selection.
    */
   onCommit: (finalSet: ReadonlySet<T>, info: {
     additive: boolean;
+    covered: ReadonlySet<T>;
   }) => void;
   /** Optional: scroll the surface when the pointer nears an edge during a drag. */
   autoScroll?: (dx: number, dy: number) => void;
@@ -133,7 +135,11 @@ type ListSelectionGesture = {
   readonly ctrlKey: boolean;
   readonly metaKey: boolean;
   readonly shiftKey: boolean;
+  /** `PointerEvent.pointerType`, when known; a `touch` tap reports source `touch`. */
+  readonly pointerType?: string;
 };
+/** Capture the modifier / pointer-type state of a click for `handleClick`. */
+declare function gestureOf(e: MouseEvent): ListSelectionGesture;
 type ListSelectionModes = {
   readonly selectionMode: ListSelectionMode;
   readonly interactionMode: ListInteractionMode;
@@ -157,6 +163,13 @@ type ListSelectionControllerConfig<T> = {
    * requests an update.
    */
   readonly onChange: (selected: ReadonlySet<T>, previous: ReadonlySet<T>) => void;
+  /**
+   * Optional: called with the intent behind a gesture (or `selectAll()`)
+   * before the selection changes. Return `true` when the caller took over
+   * (`preventDefault()`); the controller then leaves the selection alone but
+   * still moves the range anchor.
+   */
+  readonly onIntent?: (intent: ListSelectIntentDetail) => boolean;
   /**
    * Optional: derive a stable string key for an item. Enables `selectedKeys`
    * and `selectKeys()`. When omitted, `selectedKeys` is always empty.
@@ -225,8 +238,11 @@ declare class ListSelectionController<T> {
   rangeTo(item: T): void;
   /** Clear the selection. No change event when the selection is already empty. */
   clear(): void;
-  /** Select every ordered item that passes `isSelectable`. */
-  selectAll(): void;
+  /**
+   * Select every ordered item that passes `isSelectable`. Fires an `all`
+   * intent first; the caller may take over.
+   */
+  selectAll(source?: ListSelectIntentSource): void;
   /**
    * Replace the selection with many items at once. Requires
    * `selectionMode="multiple"`, throws otherwise. Updates the anchor.
@@ -248,24 +264,29 @@ declare class ListSelectionController<T> {
    * non-empty selection (e.g. a Cmd-drag that toggles everything off) but is
    * a no-op when nothing is selected.
    */
-  applyDragSelection(items: Iterable<T>): void;
+  applyDragSelection(items: Iterable<T>, info?: {
+    additive: boolean;
+    covered: Iterable<T>;
+  }): void;
   /** Remove a single item from the selection. */
   deselect(item: T): void;
   /**
    * Replace the selection with the items resolved from `keys`. Keys that
-   * `resolve` cannot map, or that resolve to a non-selectable item, are
-   * ignored. `selectionMode="none"` is a no-op. When multi-select is not
-   * available, only the last resolvable key is kept. `onChange` fires once.
+   * `resolve` cannot map yet are kept pending and selected when their items
+   * appear (see `resolvePending()`); keys that resolve to a non-selectable
+   * item are ignored. `selectionMode="none"` is a no-op. When multi-select is
+   * not available, only the last key is kept. `onChange` fires once.
    */
   selectKeys(keys: Iterable<string>, resolve: (key: string) => T | undefined): void;
   /**
    * Add the items resolved from `keys` to the selection (multi-select only;
-   * a no-op otherwise). `onChange` fires once if anything changed.
+   * a no-op otherwise). Keys not present yet are kept pending. `onChange`
+   * fires once if anything changed.
    */
   addKeys(keys: Iterable<string>, resolve: (key: string) => T | undefined): void;
   /**
-   * Remove the items resolved from `keys` from the selection. `onChange`
-   * fires once if anything changed.
+   * Remove the items resolved from `keys` from the selection, and drop them
+   * from the pending keys. `onChange` fires once if anything changed.
    */
   removeKeys(keys: Iterable<string>, resolve: (key: string) => T | undefined): void;
   /** Selected keys waiting for their items to appear. */
@@ -291,10 +312,25 @@ declare class ListSelectionController<T> {
   demote(items: Iterable<T>): boolean;
   /** Drop pending keys without touching the live selection. */
   clearPending(): void;
-  /** Route a click on `item` according to the current interaction mode. */
+  /**
+   * Route a click on `item` according to the current interaction mode. In
+   * `manual` mode nothing is selected, but the intent is still reported so
+   * the caller can apply it.
+   */
   handleClick(item: T, gesture: ListSelectionGesture): void;
   /** Route a Space keypress on `item` according to the current interaction mode. */
   handleSpace(item: T): void;
+  /** Route a checkbox (checked-mode) toggle on `item`. */
+  handleCheckbox(item: T, source?: ListSelectIntentSource): void;
+  /** Route a plain "select only this" gesture (Enter, double-click) on `item`. */
+  handleReplace(item: T, source?: ListSelectIntentSource): void;
+  /** Route Shift+Arrow: extend the range from the anchor to the cursor `item`. */
+  handleExtend(item: T): void;
+  /**
+   * Route Escape / empty-space click: clear the selection. `reportOnly`
+   * suppresses the default action in `manual` mode (the caller owns it).
+   */
+  handleClear(source?: ListSelectIntentSource, reportOnly?: boolean): void;
   /** Drop the range-selection anchor (e.g. when the interaction mode changes). */
   clearAnchor(): void;
   /**
@@ -773,6 +809,14 @@ declare class GridListElement<T = unknown> extends LitElement {
    * Auto-assigned keyless-item keys are omitted.
    */
   visibleKeys(): string[];
+  /**
+   * Cells shown as *partially* selected (a part of the resource is selected):
+   * `data-partial` / `part="item partial"` and an accessible description.
+   * Independent of `selectedKeys` — a key in both counts as selected.
+   * Replace-on-set; keys without a cell are kept for when it appears.
+   */
+  get partialKeys(): ReadonlySet<string>;
+  set partialKeys(keys: Iterable<string>);
   /**
    * Mirror cursor / selection onto the light-DOM items as `data-tickled` /
    * `data-selected`. Only the items whose state changed are touched, so a
@@ -795,4 +839,4 @@ interface GridListElement {
   addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
 }
 //#endregion
-export { isMultiMode as A, capKeys as B, TreeKeyboardNavController as C, ListSelectionControllerConfig as D, ListSelectionController as E, EMPTY_KEYS as F, partitionFlags as G, flagsToRecord as H, MAX_PENDING_KEYS as I, partitionKeys as K, PendingFlags as L, ListDragSelectController as M, ListDragSelectControllerConfig as N, ListSelectionGesture as O, EMPTY_FLAGS as P, PendingKeys as R, TreeKeyboardNavCallbacks as S, TreeKeyboardNavItemId as T, keysAsFlags as U, flagsFromRecord as V, keysToArray as W, GridListSelectEvent as _, GridListCaptionAlign as a, GridListViewportChangeDetail as b, GridListCaptionStyle as c, GridListFullElementEventMap as d, GridListItemClickDetail as f, GridListSelectDetail as g, GridListOrientation as h, GridListActivateEvent as i, DragSelectRect as j, ListSelectionModes as k, GridListDataAdapter as l, GridListItemEventDetail as m, GridListViewState as n, GridListCaptionBackdrop as o, GridListItemClickEvent as p, withoutFlag as q, GridListActivateDetail as r, GridListCaptionPosition as s, GridListElement as t, GridListElementEventMap as u, GridListTickleDetail as v, TreeKeyboardNavControllerConfig as w, GridListViewportChangeEvent as x, GridListTickleEvent as y, capFlags as z };
+export { gestureOf as A, capFlags as B, TreeKeyboardNavController as C, ListSelectionControllerConfig as D, ListSelectionController as E, EMPTY_FLAGS as F, keysToArray as G, flagsFromRecord as H, EMPTY_KEYS as I, withoutFlag as J, partitionFlags as K, MAX_PENDING_KEYS as L, DragSelectRect as M, ListDragSelectController as N, ListSelectionGesture as O, ListDragSelectControllerConfig as P, PendingFlags as R, TreeKeyboardNavCallbacks as S, TreeKeyboardNavItemId as T, flagsToRecord as U, capKeys as V, keysAsFlags as W, GridListSelectEvent as _, GridListCaptionAlign as a, GridListViewportChangeDetail as b, GridListCaptionStyle as c, GridListFullElementEventMap as d, GridListItemClickDetail as f, GridListSelectDetail as g, GridListOrientation as h, GridListActivateEvent as i, isMultiMode as j, ListSelectionModes as k, GridListDataAdapter as l, GridListItemEventDetail as m, GridListViewState as n, GridListCaptionBackdrop as o, GridListItemClickEvent as p, partitionKeys as q, GridListActivateDetail as r, GridListCaptionPosition as s, GridListElement as t, GridListElementEventMap as u, GridListTickleDetail as v, TreeKeyboardNavControllerConfig as w, GridListViewportChangeEvent as x, GridListTickleEvent as y, PendingKeys as z };

package/dist/grid-list.d.ts

@@ -1,5 +1,5 @@
 import { B as ListNativeDragStartDetail, F as ListDragPreview, I as ListDragPreviewContext, L as ListDragPreviewRenderer, P as ListDragEntry, V as ListNativeDragStartEvent, z as ListDragSource } from "./tree-component-DgfkxmVY.js";
-import { _ as GridListSelectEvent, a as GridListCaptionAlign, b as GridListViewportChangeDetail, c as GridListCaptionStyle, d as GridListFullElementEventMap, f as GridListItemClickDetail, g as GridListSelectDetail, h as GridListOrientation, i as GridListActivateEvent, l as GridListDataAdapter, m as GridListItemEventDetail, n as GridListViewState, o as GridListCaptionBackdrop, p as GridListItemClickEvent, r as GridListActivateDetail, s as GridListCaptionPosition, t as GridListElement, u as GridListElementEventMap, v as GridListTickleDetail, x as GridListViewportChangeEvent, y as GridListTickleEvent } from "./grid-list-D6n7WH8l.js";
+import { _ as GridListSelectEvent, a as GridListCaptionAlign, b as GridListViewportChangeDetail, c as GridListCaptionStyle, d as GridListFullElementEventMap, f as GridListItemClickDetail, g as GridListSelectDetail, h as GridListOrientation, i as GridListActivateEvent, l as GridListDataAdapter, m as GridListItemEventDetail, n as GridListViewState, o as GridListCaptionBackdrop, p as GridListItemClickEvent, r as GridListActivateDetail, s as GridListCaptionPosition, t as GridListElement, u as GridListElementEventMap, v as GridListTickleDetail, x as GridListViewportChangeEvent, y as GridListTickleEvent } from "./grid-list-DaeSHv9P.js";
+import { i as ListInteractionMode, m as ListSelectionMode } from "./list-selection-types-hj9Njei3.js";
 import { i as ListGroupChangeEvent, l as ListGroupToggleDetail, n as ListGroupBy, o as ListGroupInfo, r as ListGroupChangeDetail, s as ListGroupLabel, u as ListGroupToggleEvent } from "./grouping-CUKgmkMm.js";
-import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
 export { type GridListActivateDetail, type GridListActivateEvent, type GridListCaptionAlign, type GridListCaptionBackdrop, type GridListCaptionPosition, type GridListCaptionStyle, type GridListDataAdapter, GridListElement, type GridListElementEventMap, type GridListFullElementEventMap, type GridListItemClickDetail, type GridListItemClickEvent, type GridListItemEventDetail, type GridListOrientation, type GridListSelectDetail, type GridListSelectEvent, type GridListTickleDetail, type GridListTickleEvent, type GridListViewState, type GridListViewportChangeDetail, type GridListViewportChangeEvent, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListGroupBy, type ListGroupChangeDetail, type ListGroupChangeEvent, type ListGroupInfo, type ListGroupLabel, type ListGroupToggleDetail, type ListGroupToggleEvent, type ListInteractionMode, type ListNativeDragStartDetail, type ListNativeDragStartEvent, type ListSelectionMode };

package/dist/grid-list.js

@@ -1,3 +1,3 @@
 import "./list-group-header.js";
-import { t as GridListElement } from "./grid-list-CdEkScn-.js";
+import { t as GridListElement } from "./grid-list-51XsR2X2.js";
 export { GridListElement };

package/dist/{grouped-item-lister-DETte0Dh.d.ts → grouped-item-lister-DZIjo9nO.d.ts}

@@ -1,5 +1,5 @@
 import { r as IDataProvider } from "./data-provider-BAn_-oR1.js";
-import { l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
+import { m as ListSelectionMode } from "./list-selection-types-hj9Njei3.js";
 import "./panel.js";
 import { LitElement, PropertyValues, nothing } from "lit";
 import { CommandId } from "@clinth/ui-commands";
@@ -106,7 +106,7 @@ declare class GroupedItemListerElement<T = unknown> extends LitElement {
   connectedCallback(): void;
   disconnectedCallback(): void;
   protected updated(changed: PropertyValues): void;
-  protected render(): typeof nothing | import("lit").TemplateResult<1>;
+  protected render(): import("lit").TemplateResult<1> | typeof nothing;
 }
 declare global {
   interface HTMLElementTagNameMap {

package/dist/grouped-item-lister.d.ts

@@ -1,2 +1,2 @@
-import { a as IGroupedSubComponent, c as SubComponentActivateEvent, d as SubComponentItemClickEvent, f as SubComponentSelectDetail, h as SubComponentTickleEvent, i as GroupedSelectEvent, l as SubComponentFactory, m as SubComponentTickleDetail, n as GroupedItemListerElementEventMap, o as IGroupedSubComponentEventMap, p as SubComponentSelectEvent, r as GroupedSelectDetail, s as SubComponentActivateDetail, t as GroupedItemListerElement, u as SubComponentItemClickDetail } from "./grouped-item-lister-DETte0Dh.js";
+import { a as IGroupedSubComponent, c as SubComponentActivateEvent, d as SubComponentItemClickEvent, f as SubComponentSelectDetail, h as SubComponentTickleEvent, i as GroupedSelectEvent, l as SubComponentFactory, m as SubComponentTickleDetail, n as GroupedItemListerElementEventMap, o as IGroupedSubComponentEventMap, p as SubComponentSelectEvent, r as GroupedSelectDetail, s as SubComponentActivateDetail, t as GroupedItemListerElement, u as SubComponentItemClickDetail } from "./grouped-item-lister-DZIjo9nO.js";
 export { GroupedItemListerElement, type GroupedItemListerElementEventMap, type GroupedSelectDetail, type GroupedSelectEvent, type IGroupedSubComponent, type IGroupedSubComponentEventMap, type SubComponentActivateDetail, type SubComponentActivateEvent, type SubComponentFactory, type SubComponentItemClickDetail, type SubComponentItemClickEvent, type SubComponentSelectDetail, type SubComponentSelectEvent, type SubComponentTickleDetail, type SubComponentTickleEvent };

package/dist/{icon-CDGprSdE.d.ts → icon-DR_3rSyZ.d.ts}

@@ -9,7 +9,7 @@ declare class IxfxIconElement extends LitElement {
   rotate: string;
   connectedCallback(): void;
   disconnectedCallback(): void;
-  protected render(): typeof nothing | import("lit").TemplateResult<1>;
+  protected render(): import("lit").TemplateResult<1> | typeof nothing;
   protected updated(changed: Map<string, unknown>): void;
   static styles: import("lit").CSSResult[];
 }

package/dist/icons.d.ts

@@ -1,3 +1,3 @@
-import { t as IxfxIconElement } from "./icon-CDGprSdE.js";
-import { a as getIconEntry, c as iconBus, d as setIconFont, f as svgToDataUri, g as ICON_CLOSE, h as ICON_CHEVRON_DOWN, i as getIcon, l as registerFontIcon, m as ICON_CHECK, n as IconChangedEvent, o as getIconFont, p as ICON_CARET_RIGHT, r as IconEntry, s as hasIcon, t as IconChangedDetail, u as registerIcon } from "./index-CYndvTWH.js";
+import { t as IxfxIconElement } from "./icon-DR_3rSyZ.js";
+import { a as getIconEntry, c as iconBus, d as setIconFont, f as svgToDataUri, g as ICON_CLOSE, h as ICON_CHEVRON_DOWN, i as getIcon, l as registerFontIcon, m as ICON_CHECK, n as IconChangedEvent, o as getIconFont, p as ICON_CARET_RIGHT, r as IconEntry, s as hasIcon, t as IconChangedDetail, u as registerIcon } from "./index-garxxqgV.js";
 export { ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, type IconChangedDetail, type IconChangedEvent, type IconEntry, IxfxIconElement, getIcon, getIconEntry, getIconFont, hasIcon, iconBus, registerFontIcon, registerIcon, setIconFont, svgToDataUri };

package/dist/{incr-search-JIhwB49y.js → incr-search-2YaxUUA9.js}

@@ -288,6 +288,15 @@ function createDataListSearchAdapter(host, options) {
 function keyForElement(el) {
 	return el.getAttribute(`data-key`) ?? el.getAttribute(`data-value`) ?? void 0;
 }
+/** The stable keys of a set of item elements (items without a key are omitted). */
+function keysOfElements(els) {
+	const out = /* @__PURE__ */ new Set();
+	for (const el of els) {
+		const key = keyForElement(el);
+		if (key !== void 0) out.add(key);
+	}
+	return out;
+}
 /**
 * A lazily-built key → element index over a container. Rebuilt on first use
 * and after any child-list mutation under `root`; `invalidate()` forces a
@@ -572,6 +581,8 @@ var ListSearchController = class {
 	#matches = [];
 	/** Whether a filter has been pushed to the adapter and still needs undoing. */
 	#filterActive = false;
+	/** A filter committed with Enter (sticky) that stays applied while the popover is closed. */
+	#kept = false;
 	constructor(host, options) {
 		this.#host = host;
 		this.#adapter = options.adapter;
@@ -579,6 +590,7 @@ var ListSearchController = class {
 		this.#modes = LIST_SEARCH_MODES.filter((m) => requested.has(m));
 		this.#mode = this.#modes[0] ?? `filter`;
 		this.#placeholder = options.placeholder ?? `Search…`;
+		this.stickyFilter = options.stickyFilter ?? false;
 		this.#search = createIncrSearch({
 			selector: (i) => i.label,
 			fzf: options.fzf
@@ -605,6 +617,7 @@ var ListSearchController = class {
 		this.#modes = LIST_SEARCH_MODES.filter((m) => set.has(m));
 		if (!this.#modes.includes(this.#mode)) {
 			if (this.#open) this.close();
+			this.clearFilter();
 			this.#mode = this.#modes[0] ?? `filter`;
 		}
 		this.#host.requestUpdate();
@@ -624,6 +637,10 @@ var ListSearchController = class {
 	get matchIndex() {
 		return this.#matchIndex;
 	}
+	/** The query of a filter kept applied after the popover closed (see {@link stickyFilter}). */
+	get keptFilter() {
+		return this.#kept ? this.#query : void 0;
+	}
 	hostConnected() {
 		const container = this.#adapter.container?.();
 		if (container) {
@@ -633,29 +650,47 @@ var ListSearchController = class {
 				subtree: false
 			});
 		}
+		this.#host.addEventListener(`keydown`, this.#onHostKeydown);
 		this.refresh();
 	}
 	hostDisconnected() {
 		this.#observer?.disconnect();
 		this.#observer = void 0;
-		if (this.#open) this.#teardownEffects();
+		this.#host.removeEventListener(`keydown`, this.#onHostKeydown);
+		if (this.#open || this.#kept) this.#teardownEffects();
 		this.#open = false;
+		this.#kept = false;
 		this.#unsub?.();
 		this.#unsub = void 0;
 		this.#search.dispose();
 	}
-	/** Open the popover in `mode` (clamped to the available set). */
+	/**
+	* Open the popover in `mode` (clamped to the available set). When it is
+	* already open the query is kept: the mode switches if it differs and the
+	* input is refocused with its text selected.
+	*/
 	open(mode) {
 		if (!this.enabled) return;
+		if (this.#open) {
+			this.switchMode(this.#modes.includes(mode) ? mode : this.#mode);
+			this.focus();
+			return;
+		}
 		this.#mode = this.#modes.includes(mode) ? mode : this.#modes[0];
 		this.#open = true;
-		this.#query = ``;
+		const resume = this.#kept;
+		this.#kept = false;
+		if (!resume) this.#query = ``;
 		this.#matchIndex = 0;
 		this.#matches = [];
+		if (resume && this.#mode !== `filter` && this.#filterActive) {
+			this.#adapter.applyFilter(void 0);
+			this.#filterActive = false;
+		}
 		this.refresh();
-		this.#search.setQuery(``);
+		this.#search.setQuery(this.#query);
 		this.#host.requestUpdate();
-		this.#host.updateComplete.then(() => this.#focusInput());
+		this.#host.updateComplete.then(() => this.#focusInput(resume));
 	}
 	/** Close the popover, restoring any live filter. Selection / cursor stay put. */
 	close() {
@@ -668,6 +703,16 @@ var ListSearchController = class {
 		this.#host.requestUpdate();
 		this.#host.focus();
 	}
+	/** Remove a filter kept by {@link stickyFilter}. No-op when none is kept. */
+	clearFilter() {
+		if (!this.#kept) return;
+		this.#kept = false;
+		this.#teardownEffects();
+		this.#query = ``;
+		this.#matches = [];
+		this.#search.clearQuery();
+		this.#host.requestUpdate();
+	}
 	setQuery(query) {
 		this.#query = query;
 		this.#matchIndex = 0;
@@ -685,6 +730,21 @@ var ListSearchController = class {
 		this.#host.requestUpdate();
 		this.#host.updateComplete.then(() => this.#focusInput());
 	}
+	/**
+	* Step through {@link registeredModes} (wrapping) and switch to the result.
+	* Bound to Tab / Shift+Tab in the popover input.
+	*/
+	cycleMode(delta) {
+		const n = this.#modes.length;
+		if (n < 2) return;
+		const index = this.#modes.indexOf(this.#mode);
+		this.switchMode(this.#modes[(index + delta + n) % n]);
+	}
+	/** Refocus the popover input (text selected) without touching the query. No-op when closed. */
+	focus() {
+		if (!this.#open) return;
+		this.#host.updateComplete.then(() => this.#focusInput(true));
+	}
 	/** One-shot: turn the current match set into the selection, staying in the current mode. */
 	selectMatches() {
 		if (!this.#modes.includes(`select`)) return;
@@ -697,8 +757,19 @@ var ListSearchController = class {
 	prevMatch() {
 		this.#cycle(-1);
 	}
-	/** Enter: in `navigate` activate the current match; then close. */
+	/**
+	* Enter: in `navigate` activate the current match; then close. In `filter`
+	* with {@link stickyFilter} and a query, close but keep the filter.
+	*/
 	commit() {
+		if (this.#mode === `filter` && this.stickyFilter && this.#filterActive) {
+			this.#open = false;
+			this.#kept = true;
+			clearHighlights({ key: this.#highlightKey });
+			this.#host.requestUpdate();
+			this.#host.focus();
+			return;
+		}
 		if (this.#mode === `navigate`) {
 			const item = this.#itemFor(this.#matches[this.#matchIndex]);
 			if (item) {
@@ -729,6 +800,7 @@ var ListSearchController = class {
 	/** Popover markup. Pair with `listSearchStyles` in the host's `static styles`. */
 	renderField() {
 		if (!this.enabled) return nothing;
+		if (this.#kept) return this.#renderKeptFilter();
 		const hasQuery = this.#query.trim().length > 0;
 		const others = this.#modes.filter((m) => m !== this.#mode);
 		const showSelectMatches = this.#modes.includes(`select`) && this.#mode !== `select`;
@@ -754,15 +826,33 @@ var ListSearchController = class {
         </div>
         ${others.length > 0 || showSelectMatches ? html`
               <div class="list-search-switch">
-                ${others.map((m) => html`<button class="list-search-btn" @click=${() => this.switchMode(m)}>${m}</button>`)}
+                ${others.map((m) => html`<button class="list-search-btn" title=${this.#switchTitle(m)} @click=${() => this.switchMode(m)}>${m}</button>`)}
                 ${showSelectMatches ? html`<button class="list-search-btn" @click=${() => this.selectMatches()}>Select matches</button>` : nothing}
               </div>
             ` : nothing}
       </div>
     `;
 	}
-	#focusInput() {
-		this.#host.renderRoot?.querySelector(`.${INPUT_CLASS}`)?.focus();
+	#renderKeptFilter() {
+		return html`
+      <div class="list-search list-search-kept" part="search-kept">
+        <button class="list-search-kept-label" title="Edit filter" @click=${() => this.open(`filter`)}>
+          Filtered: <strong>${this.#query}</strong> <span class="list-search-count">(${this.#matches.length})</span>
+        </button>
+        <button class="list-search-icon-btn" title="Clear filter (Esc)" @click=${() => this.clearFilter()}><ixfx-icon name="close" size="14"></ixfx-icon></button>
+      </div>
+    `;
+	}
+	#focusInput(selectText = false) {
+		const input = this.#host.renderRoot?.querySelector(`.${INPUT_CLASS}`);
+		input?.focus();
+		if (selectText) input?.select();
+	}
+	/** Switch-row button title, naming the Tab chord that reaches `mode`. */
+	#switchTitle(mode) {
+		const n = this.#modes.length;
+		const index = this.#modes.indexOf(this.#mode);
+		return `Switch to ${mode} (${[this.#modes[(index + 1) % n] === mode ? `Tab` : void 0, this.#modes[(index - 1 + n) % n] === mode ? `Shift+Tab` : void 0].filter((k) => k !== void 0).join(` / `)})`;
 	}
 	#onInput = (e) => {
 		this.setQuery(e.target.value);
@@ -779,6 +869,13 @@ var ListSearchController = class {
 				e.stopPropagation();
 				this.commit();
 				break;
+			case `Tab`:
+				if (this.#modes.length > 1 && !e.ctrlKey && !e.metaKey && !e.altKey) {
+					e.preventDefault();
+					e.stopPropagation();
+					this.cycleMode(e.shiftKey ? -1 : 1);
+				}
+				break;
 			case `ArrowDown`:
 				if (this.#mode === `navigate`) {
 					e.preventDefault();
@@ -791,6 +888,13 @@ var ListSearchController = class {
 			}
 		}
 	};
+	/** Escape on the host clears a kept filter (the open popover's input handles its own Escape). */
+	#onHostKeydown = (e) => {
+		if (!this.#kept || this.#open || e.key !== `Escape` || e.defaultPrevented) return;
+		e.preventDefault();
+		e.stopPropagation();
+		this.clearFilter();
+	};
 	#cycle(delta) {
 		if (this.#matches.length === 0) return;
 		const n = this.#matches.length;
@@ -808,9 +912,14 @@ var ListSearchController = class {
 		return this.#adapter.highlightKey ?? DEFAULT_HIGHLIGHT_KEY;
 	}
 	#onState(state) {
-		if (!this.#open) return;
+		if (!this.#open && !this.#kept) return;
 		const hasQuery = state.query.trim().length > 0;
 		this.#matches = hasQuery ? [...state.results] : [];
+		if (!this.#open) {
+			this.#adapter.applyFilter(new Set(this.#matches.map((m) => m.item.key)));
+			this.#host.requestUpdate();
+			return;
+		}
 		if (this.#matchIndex >= this.#matches.length) this.#matchIndex = 0;
 		this.#applyMode();
 		this.#host.requestUpdate();
@@ -970,6 +1079,36 @@ const listSearchStyles = css`
   .list-search-icon-btn:hover {
     color: inherit;
   }
+
+  .list-search-kept {
+    flex-direction: row;
+    align-items: center;
+    padding: 2px 4px 2px 6px;
+  }
+
+  .list-search-kept-label {
+    padding: 0;
+    background: transparent;
+    border: none;
+    color: inherit;
+    cursor: pointer;
+    font: inherit;
+    white-space: nowrap;
+  }
+
+  .list-search-kept-label:hover strong {
+    text-decoration: underline;
+  }
+
+  /* Matched characters for hosts that paint highlights inside their own shadow
+     root, which a page-level ::highlight() rule cannot reach. Light-DOM items
+     (e.g. detail-list rows) still need a page-level rule. */
+  ::highlight(incr-search-highlight),
+  ::highlight(grid-list-search),
+  ::highlight(data-grid-search) {
+    background: var(--search-highlight-bg, var(--accent, #60a5fa));
+    color: var(--search-highlight-color, var(--accent-text, #000));
+  }
 `;
 //#endregion
 //#region src/incr-search/tree-list-search-adapter.ts
@@ -1017,4 +1156,4 @@ function createTreeListSearchAdapter(host, options = {}) {
 	};
 }
 //#endregion
-export { LIST_SEARCH_COMMAND_IDS as a, createElementListSearchAdapter as c, createDataListSearchAdapter as d, IncrSearchTreeController as f, createFuzzySearch as h, ListSearchController as i, KeyedElementIndex as l, createAcCompletionProvider as m, listSearchStyles as n, registerListSearchCommands as o, createIncrSearch as p, LIST_SEARCH_MODES as r, createElementIncrSearch as s, createTreeListSearchAdapter as t, keyForElement as u };
+export { LIST_SEARCH_COMMAND_IDS as a, createElementListSearchAdapter as c, keysOfElements as d, createDataListSearchAdapter as f, createFuzzySearch as g, createAcCompletionProvider as h, ListSearchController as i, KeyedElementIndex as l, createIncrSearch as m, listSearchStyles as n, registerListSearchCommands as o, IncrSearchTreeController as p, LIST_SEARCH_MODES as r, createElementIncrSearch as s, createTreeListSearchAdapter as t, keyForElement as u };

package/dist/incr-search.d.ts

@@ -1,2 +1,2 @@
-import { A as FuzzySearch, C as ListSearchControllerOptions, D as IncrSearchTreeOptions, E as IncrSearchTreeController, F as IncrSearchChangeCallback, I as IncrSearchOptions, L as IncrSearchResult, M as HighlightOptions, N as HighlightTarget, O as createAcCompletionProvider, P as IncrSearch, R as IncrSearchState, S as ListSearchController, T as ListSearchMode, _ as DataListSearchAdapterOptions, a as RegisterListSearchCommandsOptions, b as LIST_SEARCH_MODES, c as applyHighlights, d as createFuzzySearch, f as ElementIncrSearch, g as createElementListSearchAdapter, h as ElementListSearchHost, i as LIST_SEARCH_COMMAND_IDS, j as FuzzySearchOptions, k as ElementIncrSearchOptions, l as buildHighlightTargets, m as ElementListSearchAdapterOptions, n as createTreeListSearchAdapter, o as registerListSearchCommands, p as createElementIncrSearch, r as listSearchStyles, s as createIncrSearch, t as TreeListSearchAdapterOptions, u as clearHighlights, v as DataListSearchItem, w as ListSearchHost, x as ListSearchAdapter, y as createDataListSearchAdapter } from "./index-Dr80Zdl6.js";
+import { A as FuzzySearch, C as ListSearchControllerOptions, D as IncrSearchTreeOptions, E as IncrSearchTreeController, F as IncrSearchChangeCallback, I as IncrSearchOptions, L as IncrSearchResult, M as HighlightOptions, N as HighlightTarget, O as createAcCompletionProvider, P as IncrSearch, R as IncrSearchState, S as ListSearchController, T as ListSearchMode, _ as DataListSearchAdapterOptions, a as RegisterListSearchCommandsOptions, b as LIST_SEARCH_MODES, c as applyHighlights, d as createFuzzySearch, f as ElementIncrSearch, g as createElementListSearchAdapter, h as ElementListSearchHost, i as LIST_SEARCH_COMMAND_IDS, j as FuzzySearchOptions, k as ElementIncrSearchOptions, l as buildHighlightTargets, m as ElementListSearchAdapterOptions, n as createTreeListSearchAdapter, o as registerListSearchCommands, p as createElementIncrSearch, r as listSearchStyles, s as createIncrSearch, t as TreeListSearchAdapterOptions, u as clearHighlights, v as DataListSearchItem, w as ListSearchHost, x as ListSearchAdapter, y as createDataListSearchAdapter } from "./index-BjRoPrwj.js";
 export { type DataListSearchAdapterOptions, type DataListSearchItem, type ElementIncrSearch, type ElementIncrSearchOptions, type ElementListSearchAdapterOptions, type ElementListSearchHost, type FuzzySearch, type FuzzySearchOptions, type HighlightOptions, type HighlightTarget, type IncrSearch, type IncrSearchChangeCallback, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, type IncrSearchTreeOptions as IncrSearchMillerOptions, type IncrSearchTreeOptions, type IncrSearchOptions, type IncrSearchResult, type IncrSearchState, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, type ListSearchAdapter, ListSearchController, type ListSearchControllerOptions, type ListSearchHost, type ListSearchMode, type RegisterListSearchCommandsOptions, type TreeListSearchAdapterOptions, applyHighlights, buildHighlightTargets, clearHighlights, createAcCompletionProvider, createDataListSearchAdapter, createElementIncrSearch, createElementListSearchAdapter, createFuzzySearch, createIncrSearch, createTreeListSearchAdapter, listSearchStyles, registerListSearchCommands };

package/dist/incr-search.js

@@ -1,3 +1,3 @@
 import { n as buildHighlightTargets, r as clearHighlights, t as applyHighlights } from "./highlight-B-eQrhhb.js";
-import { a as LIST_SEARCH_COMMAND_IDS, c as createElementListSearchAdapter, d as createDataListSearchAdapter, f as IncrSearchTreeController, h as createFuzzySearch, i as ListSearchController, m as createAcCompletionProvider, n as listSearchStyles, o as registerListSearchCommands, p as createIncrSearch, r as LIST_SEARCH_MODES, s as createElementIncrSearch, t as createTreeListSearchAdapter } from "./incr-search-JIhwB49y.js";
+import { a as LIST_SEARCH_COMMAND_IDS, c as createElementListSearchAdapter, f as createDataListSearchAdapter, g as createFuzzySearch, h as createAcCompletionProvider, i as ListSearchController, m as createIncrSearch, n as listSearchStyles, o as registerListSearchCommands, p as IncrSearchTreeController, r as LIST_SEARCH_MODES, s as createElementIncrSearch, t as createTreeListSearchAdapter } from "./incr-search-2YaxUUA9.js";
 export { IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, ListSearchController, applyHighlights, buildHighlightTargets, clearHighlights, createAcCompletionProvider, createDataListSearchAdapter, createElementIncrSearch, createElementListSearchAdapter, createFuzzySearch, createIncrSearch, createTreeListSearchAdapter, listSearchStyles, registerListSearchCommands };

package/dist/{index-CoqtMSd9.d.ts → index-BUB5SICW.d.ts}

@@ -1,4 +1,4 @@
-import { t as LabelledInputBase } from "./labelled-input-base-DiTme1JO.js";
+import { t as LabelledInputBase } from "./labelled-input-base-Dp_9KP0G.js";
 import { CSSResultGroup } from "lit";
 //#region src/labelled-range-input/labelled-range-input.d.ts
 declare class LabelledRangeInput extends LabelledInputBase {

package/dist/{index-Dr80Zdl6.d.ts → index-BjRoPrwj.d.ts}

@@ -1,4 +1,4 @@
-import "./icon-CDGprSdE.js";
+import "./icon-DR_3rSyZ.js";
 import { E as TreeSearchHost } from "./tree-component-DgfkxmVY.js";
 import { o as TreeNode } from "./types-Jky6oNAp.js";
 import { ReactiveController, ReactiveControllerHost, TemplateResult, nothing } from "lit";
@@ -143,7 +143,8 @@ declare class IncrSearchTreeController {
  * - `navigate` — move the cursor to the best match; ↑/↓ cycle between matches;
  *   Enter activates the current match and closes.
  * - `select` — (re)select every item whose label matches, live as you type.
- * - `filter` — hide items that don't match; restored when the popover closes.
+ * - `filter` — hide items that don't match; restored when the popover closes
+ *   (unless `stickyFilter` keeps it on Enter).
  */
 type ListSearchMode = `navigate` | `select` | `filter`;
 /** Canonical order — used for the switch-row and to normalise a requested set. */
@@ -196,6 +197,8 @@ interface ListSearchControllerOptions<TItem> {
   modes?: readonly ListSearchMode[];
   fzf?: Partial<FzfOptions<SearchItem>>;
   placeholder?: string;
+  /** Initial {@link ListSearchController.stickyFilter}. Default false. */
+  stickyFilter?: boolean;
 }
 type ListSearchHost = ReactiveControllerHost & HTMLElement & {
   renderRoot?: DocumentFragment | HTMLElement;
@@ -208,6 +211,12 @@ type ListSearchHost = ReactiveControllerHost & HTMLElement & {
  */
 declare class ListSearchController<TItem> implements ReactiveController {
   #private;
+  /**
+   * When true, Enter in `filter` mode closes the popover but keeps the filter,
+   * shown as a "Filtered: …" chip. Clear it with the chip's ×, Escape on the
+   * host, or {@link clearFilter}; click the chip to edit the query.
+   */
+  stickyFilter: boolean;
   constructor(host: ListSearchHost, options: ListSearchControllerOptions<TItem>);
   /** `false` when no modes are available — the host should register no commands and render no field. */
   get enabled(): boolean;
@@ -225,20 +234,38 @@ declare class ListSearchController<TItem> implements ReactiveController {
   get query(): string;
   get matchCount(): number;
   get matchIndex(): number;
+  /** The query of a filter kept applied after the popover closed (see {@link stickyFilter}). */
+  get keptFilter(): string | undefined;
   hostConnected(): void;
   hostDisconnected(): void;
-  /** Open the popover in `mode` (clamped to the available set). */
+  /**
+   * Open the popover in `mode` (clamped to the available set). When it is
+   * already open the query is kept: the mode switches if it differs and the
+   * input is refocused with its text selected.
+   */
   open(mode: ListSearchMode): void;
   /** Close the popover, restoring any live filter. Selection / cursor stay put. */
   close(): void;
+  /** Remove a filter kept by {@link stickyFilter}. No-op when none is kept. */
+  clearFilter(): void;
   setQuery(query: string): void;
   /** Re-interpret the current query under a new mode (undoing the old mode's effect). */
   switchMode(next: ListSearchMode): void;
+  /**
+   * Step through {@link registeredModes} (wrapping) and switch to the result.
+   * Bound to Tab / Shift+Tab in the popover input.
+   */
+  cycleMode(delta: 1 | -1): void;
+  /** Refocus the popover input (text selected) without touching the query. No-op when closed. */
+  focus(): void;
   /** One-shot: turn the current match set into the selection, staying in the current mode. */
   selectMatches(): void;
   nextMatch(): void;
   prevMatch(): void;
-  /** Enter: in `navigate` activate the current match; then close. */
+  /**
+   * Enter: in `navigate` activate the current match; then close. In `filter`
+   * with {@link stickyFilter} and a query, close but keep the filter.
+   */
   commit(): void;
   /** Rebuild the searchable item set from the adapter. Called on open and on container mutation. */
   refresh(): void;

package/dist/{index-DN2BWctP.d.ts → index-Bz3loIAf.d.ts}

@@ -1,4 +1,4 @@
-import "./index-CoqtMSd9.js";
+import "./index-BUB5SICW.js";
 import { CSSResultGroup, LitElement, PropertyValues } from "lit";
 import { Colour } from "@ixfx/visual";
 //#region src/colour-picker/types.d.ts

package/dist/{index-UvnoZUAo.d.ts → index-CJ5fshD3.d.ts}

@@ -1,4 +1,4 @@
-import { t as LabelledInputBase } from "./labelled-input-base-DiTme1JO.js";
+import { t as LabelledInputBase } from "./labelled-input-base-Dp_9KP0G.js";
 import { n as EditableLabel } from "./editable-label-rzXkjf1H.js";
 import { n as WheelNudgeConsumer, t as WheelDirection } from "./wheel-nudge-By5s_ioH.js";
 import { f as SliderMarkerStyle, m as SliderSingleStyle } from "./slider-input-BxURAAmD.js";

package/dist/{index-DxyyVqzA.d.ts → index-DM9OLgTH.d.ts}

@@ -1,6 +1,6 @@
-import "./icon-CDGprSdE.js";
+import "./icon-DR_3rSyZ.js";
 import { o as TreeNode } from "./types-Jky6oNAp.js";
-import { i as MenuContainer, n as MenuTrigger, r as MenuTriggerCommandDetail, t as MenuItem } from "./menu-item-bF6narIz.js";
+import { i as MenuContainer, n as MenuTrigger, r as MenuTriggerCommandDetail, t as MenuItem } from "./menu-item-B0zqw2xp.js";
 import { LitElement, TemplateResult } from "lit";
 import { CommandRegistry, KeyboardManager } from "@clinth/ui-commands";
 //#region src/menu/menu-bar.d.ts
@@ -11,6 +11,7 @@ declare class MenuBar extends LitElement {
   disconnectedCallback(): void;
   private _setInputMode;
   private _handlePointerMove;
+  private _handlePointerOver;
   private _getTriggers;
   private _handleTriggerOpen;
   private _handleTriggerClose;