@ixfx/components 0.8.1 → 0.8.3

package/dist/vertical-list.js

@@ -1,9 +1,9 @@
-import { t as TickledController } from "./tickled-controller-C66DgJHl.js";
-import { t as themeFallbacks } from "./fallbacks-DNI9xt0F.js";
+import { t as TickledController } from "./tickled-controller-Dh1Uh_vG.js";
+import { t as themeFallbacks } from "./fallbacks-BcKGq-2F.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
 import { c as createElementListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-C05WjbZh.js";
+import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-SA4piSBi.js";
 import { n as animateListItemIn, r as animateListItemOut } from "./list-item-animation-DuiwgN3l.js";
-import { t as ListSelectionController } from "./list-selection-controller-DTFI40li.js";
 import { LitElement, css, html, render } from "lit";
 import { property } from "lit/decorators.js";
 import { createCommandRegistry } from "@clinth/ui-commands";
@@ -44,7 +44,29 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 				if (id !== void 0) this._dispatch(`list-tickle`, { item: id });
 			},
 			onStateChange: () => this._syncItemStates(),
-			itemWrap: this.itemWrap
+			itemWrap: this.itemWrap,
+			hoverDisabled: () => this.#dragSelect.isDragging
+		});
+		this.#dragSelect = new ListDragSelectController(this, {
+			getSurface: () => this.renderRoot.querySelector(`.container`),
+			isEnabled: () => this.selection.canDragSelect() && this._getVisibleItems().length > 0 && !this.hasAttribute(`disable-drag-select`),
+			hitTest: (rect) => this.#marqueeHitTest(rect),
+			getBaseSelection: () => this.selection.selected,
+			onPreview: (preview, rect) => {
+				this.#marqueeRect = rect;
+				for (const el of this._getVisibleItems()) el.toggleAttribute(`data-marquee`, preview.has(el));
+				this.requestUpdate();
+			},
+			onCommit: (finalSet) => {
+				this.selection.applyDragSelection(finalSet);
+				for (const el of this._getVisibleItems()) el.removeAttribute(`data-marquee`);
+				this.#marqueeRect = void 0;
+				this.requestUpdate();
+			},
+			autoScroll: (_dx, dy) => {
+				const list = this.renderRoot.querySelector(`ul`);
+				if (list) list.scrollTop += dy;
+			}
 		});
 		this.search = new ListSearchController(this, { adapter: createElementListSearchAdapter(this, {
 			itemSelector: ITEM_SELECTOR,
@@ -105,6 +127,7 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 			}
 		};
 		this._onClick = (e) => {
+			if (this.#dragSelect.isDragging) return;
 			const item = this._findListItem(e.composedPath());
 			if (!item) return;
 			this._dispatch(`list-item-click`, { item });
@@ -121,6 +144,30 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 	#itemObserver;
 	/** Items that have already played (or been skipped for) their enter animation. */
 	#animatedItems;
+	/** Live drag-select preview rect (surface-relative); the covered items carry `data-marquee`. */
+	#marqueeRect;
+	#dragSelect;
+	/** Collect visible items whose surface-relative box intersects `rect`. */
+	#marqueeHitTest(rect) {
+		const surface = this.renderRoot.querySelector(`.container`);
+		if (!surface) return [];
+		const box = surface.getBoundingClientRect();
+		const rx0 = rect.x;
+		const ry0 = rect.y;
+		const rx1 = rect.x + rect.width;
+		const ry1 = rect.y + rect.height;
+		const out = [];
+		for (const el of this._getVisibleItems()) {
+			const r = el.getBoundingClientRect();
+			const left = r.left - box.left;
+			const top = r.top - box.top;
+			if (left <= rx1 && left + r.width >= rx0 && top <= ry1 && top + r.height >= ry0) out.push(el);
+		}
+		return out;
+	}
+	#marqueeStyle(rect) {
+		return `left:${rect.x}px;top:${rect.y}px;width:${Math.max(0, rect.width)}px;height:${Math.max(0, rect.height)}px`;
+	}
 	#searchRegistry;
 	#unregisterSearchCommands;
 	/** Command registry carrying this list's `list.search.*` commands. */
@@ -591,6 +638,22 @@ let VerticalListElement = class VerticalListElement extends LitElement {
       outline-offset: -2px;
     }
 
+    /* Drag-select (marquee) rectangle + covered-row preview.
+       Style hooks: part="marquee", --vertical-list-marquee-border,
+       --vertical-list-marquee-fill. */
+    .marquee {
+      position: absolute;
+      pointer-events: none;
+      z-index: 5;
+      border: 1px solid var(--vertical-list-marquee-border, var(--accent));
+      background: var(--vertical-list-marquee-fill, color-mix(in srgb, var(--accent) 15%, transparent));
+    }
+
+    ::slotted([data-marquee]) {
+      background: var(--item-bg-selected);
+      color: var(--item-text-selected);
+    }
+
     /* checked mode: checkbox (injected into li) communicates selection — suppress bg highlight */
     :host([interaction-mode="checked"]) ::slotted([data-selected]) {
       background: transparent;
@@ -612,6 +675,7 @@ let VerticalListElement = class VerticalListElement extends LitElement {
         <ul part="list">
           <slot></slot>
         </ul>
+        ${this.#marqueeRect ? html`<div class="marquee" part="marquee" style=${this.#marqueeStyle(this.#marqueeRect)}></div>` : ``}
         ${this.search.renderField()}
       </div>
     `;

package/dist/vertical-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"vertical-list.js","names":["#searchRegistry","#effectiveSearchModes","#unregisterSearchCommands","#animatedItems","#itemObserver","#onItemsMutated","#syncSearchCommands","#customWrappers","#wrappedElements","#itemForKey","customElement"],"sources":["../src/vertical-list/vertical-list.ts"],"sourcesContent":["import type { CommandId, CommandRegistry } from '@clinth/ui-commands';\nimport type { PropertyValues } from 'lit';\nimport type { ListSearchMode } from '../incr-search/index.js';\nimport type {\n  ListActivateDetail,\n  ListElementEventMap,\n  ListInteractionMode,\n  ListItemClickDetail,\n  ListSelectDetail,\n  ListSelectionMode,\n  ListTickleDetail,\n} from '../interaction/list-selection-types.js';\nimport { createCommandRegistry } from '@clinth/ui-commands';\nimport { css, html, LitElement, render } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport {\n  createElementListSearchAdapter,\n  LIST_SEARCH_MODES,\n  ListSearchController,\n  listSearchStyles,\n  registerListSearchCommands,\n} from '../incr-search/index.js';\nimport { keyForElement } from '../interaction/keyed-list.js';\nimport { animateListItemIn, animateListItemOut } from '../interaction/list-item-animation.js';\nimport { ListSelectionController } from '../interaction/list-selection-controller.js';\nimport { TickledController } from '../interaction/tickled-controller.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nexport type {\n  ListActivateDetail,\n  ListActivateEvent,\n  ListElementEventMap,\n  ListInteractionMode,\n  ListItemClickDetail,\n  ListItemClickEvent,\n  ListSelectDetail,\n  ListSelectEvent,\n  ListSelectionMode,\n  ListTickleDetail,\n  ListTickleEvent,\n} from './types.js';\n\nexport interface CustomCheckboxOptions {\n  renderer: (checked: boolean) => unknown;\n  margin?: string;\n  width?: string;\n}\n\nexport interface AddItemOptions {\n  /**\n   * In `checked` interaction mode, adds the item without a checkbox column and\n   * without the ability to be checked/selected. Equivalent to setting the\n   * `not-checked` attribute on the item. Ignored outside `checked` mode.\n   */\n  notChecked?: boolean;\n}\n\nconst ITEM_SELECTOR = `li, [data-list-item]`;\n\n@customElement(`ixfx-vertical-list`)\nexport class VerticalListElement extends LitElement {\n  @property({ type: String, attribute: `selection-mode` })\n  selectionMode: ListSelectionMode = `single`;\n\n  @property({ type: String, attribute: `interaction-mode` })\n  interactionMode: ListInteractionMode = `standard`;\n\n  @property({ attribute: false })\n  filterPredicate: ((el: Element) => boolean) | undefined;\n\n  /**\n   * Whether keyboard navigation wraps from last to first and vice versa.\n   * - 'stop' (default): navigation stops at the boundary\n   * - 'wrap': navigation wraps around\n   */\n  @property({ type: String, attribute: `item-wrap` })\n  itemWrap: `stop` | `wrap` = `stop`;\n\n  /**\n   * Optional renderer for the checkbox shown in `checked` interactionMode.\n   * Receives the current `checked` state and returns a Lit template result.\n   *\n   * When set, the per-row checkbox becomes a `<span role=\"checkbox\">` whose\n   * contents are whatever this returns (rendered with `lit`'s `render()`).\n   * When unset, a native `<input type=\"checkbox\">` is used.\n   *\n   * @example\n   *   list.checkboxRenderer = (checked) => checked\n   *     ? html`<svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\"\n   *           fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n   *           stroke-linecap=\"round\" stroke-linejoin=\"round\"\n   *           style=\"opacity:0.5\">\n   *         <polyline points=\"3,8 7,12 13,4\" />\n   *       </svg>`\n   *     : html``;\n   */\n  @property({ attribute: false })\n  checkboxRenderer: ((checked: boolean) => unknown) | CustomCheckboxOptions | undefined;\n\n  /**\n   * Space-separated subset of `navigate select filter` — limits which\n   * incremental-search modes are offered. Unset ⇒ all three; empty ⇒ search\n   * disabled. See `docs/infra-incremental.md`.\n   */\n  @property({ type: String, attribute: `search-modes`, reflect: true })\n  searchModes: string | undefined;\n\n  #customWrappers = new Map<HTMLLIElement, Element>();\n  #wrappedElements = new Set<Element>();\n\n  /** Watches for items added to the light DOM so they can be animated in. */\n  #itemObserver: MutationObserver | undefined;\n  /** Items that have already played (or been skipped for) their enter animation. */\n  #animatedItems = new WeakSet<Element>();\n\n  private readonly selection = new ListSelectionController<Element>({\n    getOrderedItems: () => this._getVisibleItems(),\n    isSelectable: el => this._isCheckable(el),\n    getModes: () => ({ selectionMode: this.selectionMode, interactionMode: this.interactionMode }),\n    getKey: keyForElement,\n    onChange: (selected, previous) => {\n      this._syncItemStates();\n      this._dispatch<ListSelectDetail>(`list-select`, {\n        selected,\n        previous,\n        selectedKeys: this.selection.selectedKeys,\n      });\n    },\n  });\n\n  private tickled = new TickledController<Element>(this, {\n    getItems: () => this._getVisibleItems().map(el => ({\n      id: el,\n      enabled: !el.hasAttribute(`not-checked`),\n    })),\n    onTickle: (id) => {\n      if (id !== undefined) {\n        this._dispatch<ListTickleDetail>(`list-tickle`, { item: id });\n      }\n    },\n    onStateChange: () => this._syncItemStates(),\n    itemWrap: this.itemWrap,\n  });\n\n  /** Incremental search (navigate / select / filter). See `docs/infra-incremental.md`. */\n  readonly search = new ListSearchController<Element>(this, {\n    adapter: createElementListSearchAdapter(this, {\n      itemSelector: ITEM_SELECTOR,\n      getLabel: el => el.getAttribute(`data-search-label`) ?? el.textContent?.trim() ?? ``,\n      highlightKey: `vertical-list-search`,\n    }),\n  });\n\n  #searchRegistry: CommandRegistry<unknown> | undefined;\n  #unregisterSearchCommands: (() => void) | undefined;\n\n  /** Command registry carrying this list's `list.search.*` commands. */\n  get registry(): CommandRegistry<unknown> | undefined {\n    return this.#searchRegistry;\n  }\n\n  #effectiveSearchModes(): ListSearchMode[] {\n    const raw = this.searchModes?.trim();\n    if (raw === undefined)\n      return [...LIST_SEARCH_MODES];\n    const requested = new Set(raw.split(/\\s+/));\n    return LIST_SEARCH_MODES.filter(m => requested.has(m));\n  }\n\n  #syncSearchCommands(): void {\n    if (!this.#searchRegistry)\n      return;\n    this.search.setModes(this.#effectiveSearchModes());\n    this.#unregisterSearchCommands?.();\n    this.#unregisterSearchCommands = registerListSearchCommands(this.#searchRegistry, this.search);\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (!this.hasAttribute(`tabindex`))\n      this.tabIndex = 0;\n    this.addEventListener(`pointerover`, this._onPointerOver);\n    this.addEventListener(`pointerleave`, this._onPointerLeave);\n    this.addEventListener(`keydown`, this._onKeyDown);\n    this.addEventListener(`click`, this._onClick);\n    this.addEventListener(`dblclick`, this._onDblClick);\n    // Mark whatever's already here as \"known\" so the first populate doesn't\n    // animate; anything added later collapses in.\n    for (const el of this.querySelectorAll(ITEM_SELECTOR))\n      this.#animatedItems.add(el);\n    this.#itemObserver ??= new MutationObserver(records => this.#onItemsMutated(records));\n    this.#itemObserver.observe(this, { childList: true });\n    this.#searchRegistry ??= createCommandRegistry();\n    this.#syncSearchCommands();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener(`pointerover`, this._onPointerOver);\n    this.removeEventListener(`pointerleave`, this._onPointerLeave);\n    this.removeEventListener(`keydown`, this._onKeyDown);\n    this.removeEventListener(`click`, this._onClick);\n    this.removeEventListener(`dblclick`, this._onDblClick);\n    this.#itemObserver?.disconnect();\n    this.#unregisterSearchCommands?.();\n    this.#unregisterSearchCommands = undefined;\n    this.#searchRegistry = undefined;\n  }\n\n  /**\n   * Animate in items appended to the light DOM (however they got there —\n   * {@link addItem}, direct `appendChild`, a framework binding). A bulk populate\n   * (roughly everything at once) is left alone, as are the wrapper `<li>`s the\n   * checked-mode plumbing shuffles around.\n   */\n  #onItemsMutated(records: MutationRecord[]): void {\n    if (!this.isConnected)\n      return;\n    const fresh: HTMLElement[] = [];\n    for (const record of records) {\n      for (const node of record.addedNodes) {\n        if (!(node instanceof HTMLElement) || node.parentElement !== this)\n          continue;\n        if (!node.matches(ITEM_SELECTOR))\n          continue;\n        if (this.#animatedItems.has(node) || this.#customWrappers.has(node as HTMLLIElement) || this.#wrappedElements.has(node))\n          continue;\n        this.#animatedItems.add(node);\n        fresh.push(node);\n      }\n    }\n    if (fresh.length === 0)\n      return;\n    const total = this.querySelectorAll(ITEM_SELECTOR).length;\n    if (fresh.length >= total)\n      return; // first populate / wholesale replace — don't animate\n    for (const el of fresh)\n      animateListItemIn(el);\n  }\n\n  override updated(changed: PropertyValues): void {\n    super.updated(changed);\n    if (changed.has(`searchModes`)) {\n      this.#syncSearchCommands();\n    }\n    if (changed.has(`interactionMode`)) {\n      this.selection.clearAnchor();\n      const previousSelected = this.selection.selected;\n      // Save wrapper→inner map before _syncCheckboxes() clears it on unwrap\n      const leavingChecked = (changed.get(`interactionMode`) as ListInteractionMode) === `checked`;\n      const savedWrappers = leavingChecked ? new Map(this.#customWrappers) : null;\n\n      this._syncCheckboxes();\n\n      // Remap the selection across the wrap/unwrap element-reference boundary\n      if (previousSelected.size > 0) {\n        if (savedWrappers && savedWrappers.size > 0) {\n          // Leaving checked: wrapper refs → inner element refs\n          this.selection.remap(el => savedWrappers.get(el as HTMLLIElement) ?? el);\n        } else if (this.#customWrappers.size > 0) {\n          // Entering checked: inner element refs → wrapper refs\n          const innerToWrapper = new Map([...this.#customWrappers].map(([w, i]) => [i, w]));\n          this.selection.remap(el => innerToWrapper.get(el) ?? el);\n        }\n      }\n\n      this._syncItemStates();\n    } else if (changed.has(`checkboxRenderer`) && this.interactionMode === `checked`) {\n      this._syncCheckboxes();\n    }\n  }\n\n  // --- Public API ---\n\n  /** The most recently selected item, or `undefined` if nothing is selected. */\n  get selectedItem(): Element | undefined {\n    return [...this.selection.selected].at(-1);\n  }\n\n  /** The full current selection set (read-only). */\n  get selectedItems(): ReadonlySet<Element> {\n    return this.selection.selected;\n  }\n\n  addItem(item: Element | string, options?: AddItemOptions): void {\n    let el: Element;\n    if (typeof item === `string`) {\n      const li = document.createElement(`li`);\n      li.textContent = item;\n      el = li;\n    } else {\n      el = item;\n    }\n    if (options?.notChecked)\n      el.setAttribute(`not-checked`, ``);\n    this.appendChild(el);\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Collapse + fade `item` out, then detach it. The rows below slide up to\n   * close the gap. Resolves once the element has actually been removed.\n   * Under `prefers-reduced-motion: reduce` it's removed immediately.\n   */\n  removeItem(item: Element): Promise<void> {\n    this.selection.deselect(item);\n    const done = animateListItemOut(item as HTMLElement).then(() => {\n      item.remove();\n      if (this.interactionMode === `checked`)\n        this._syncCheckboxes();\n    });\n    return done;\n  }\n\n  /** {@link removeItem} for several items at once. */\n  removeItems(items: Iterable<Element>): Promise<void> {\n    return Promise.all([...items].map(item => this.removeItem(item))).then(() => undefined);\n  }\n\n  clearItems(): void {\n    this.#customWrappers.clear();\n    this.replaceChildren();\n    this.selection.reset();\n    this._syncItemStates();\n  }\n\n  /**\n   * Replace the entire item list in one call.\n   * Equivalent to `clearItems()` followed by `addItem()` for each element.\n   * Preserves `interactionMode` checkbox wrapping.\n   */\n  setItems(items: readonly Element[]): void {\n    this.clearItems();\n    for (const item of items) {\n      this.appendChild(item);\n    }\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Dispatch a command to this list — used by `ixfx-grouped-item-lister` to\n   * forward commands to all sub-components. Routes through the command registry\n   * (so `list.search.*` and any other registered commands work).\n   */\n  dispatch(commandId: CommandId, args?: Record<string, unknown>): void {\n    this.#searchRegistry?.invoke(commandId, args);\n  }\n\n  select(item: Element): void {\n    this.selection.replace(item);\n  }\n\n  selectMany(items: Iterable<Element>): void {\n    this.selection.selectMany(items);\n  }\n\n  deselect(item: Element): void {\n    this.selection.deselect(item);\n  }\n\n  clearSelection(): void {\n    this.selection.clear();\n  }\n\n  selectAll(): void {\n    if (this.selection.canSelectAll())\n      this.selection.selectAll();\n  }\n\n  // --- Key-based selection & cursor ---\n\n  /** The selection as stable `data-key` / `data-value` strings. */\n  get selectedKeys(): ReadonlySet<string> {\n    return this.selection.selectedKeys;\n  }\n\n  /** The key of the item under the cursor, or `undefined`. */\n  get tickledKey(): string | undefined {\n    const id = this.tickled.tickledId;\n    return id ? keyForElement(id) : undefined;\n  }\n\n  /** Replace the selection with the items carrying these keys (unknown keys ignored). */\n  selectKeys(keys: Iterable<string>): void {\n    this.selection.selectKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Add items by key to the selection (multi-select modes only). */\n  addSelectedKeys(keys: Iterable<string>): void {\n    this.selection.addKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Remove items by key from the selection. */\n  removeSelectedKeys(keys: Iterable<string>): void {\n    this.selection.removeKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Move the cursor to the item with this key and scroll it into view. */\n  focusKey(key: string): void {\n    const el = this.#itemForKey(key);\n    if (!el)\n      return;\n    this.tickled.focus(el);\n    el.scrollIntoView({ block: `nearest`, inline: `nearest` });\n  }\n\n  #itemForKey(key: string): Element | undefined {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      if (keyForElement(el) === key)\n        return el;\n    }\n    return undefined;\n  }\n\n  * selectedFilter(kind: `selected` | `checked` | `either`): Generator<Element> {\n    const wanted = (el: Element) => {\n      switch (kind) {\n        case `selected`: return el.hasAttribute(`data-selected`);\n        case `checked`: return el.hasAttribute(`data-checked`);\n        case `either`: return el.hasAttribute(`data-selected`) || el.hasAttribute(`data-checked`);\n      }\n    };\n\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      if ((el as HTMLElement).hidden)\n        continue;\n      if (wanted(el))\n        yield el;\n    }\n  }\n\n  // --- Helpers ---\n\n  private _getVisibleItems(): Element[] {\n    return Array.from(this.querySelectorAll(ITEM_SELECTOR)).filter((el) => {\n      if (this.#wrappedElements.has(el))\n        return false;\n      if ((el as HTMLElement).hidden)\n        return false;\n      if (this.filterPredicate && !this.filterPredicate(el))\n        return false;\n      return true;\n    });\n  }\n\n  // Whether an item participates in checked-mode selection. Items carrying the\n  // `not-checked` attribute are skipped; outside `checked` mode it has no effect.\n  // For wrapped custom elements the flag lives on the inner element, so resolve\n  // through the wrapper map.\n  private _isCheckable(item: Element): boolean {\n    if (this.interactionMode !== `checked`)\n      return true;\n    const real = this.#customWrappers.get(item as HTMLLIElement) ?? item;\n    return !real.hasAttribute(`not-checked`);\n  }\n\n  private _syncItemStates(): void {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      const item = this.#customWrappers.get(el as HTMLLIElement) ?? el;\n      el.toggleAttribute(`data-tickled`, this.tickled.isTickled(el));\n      el.toggleAttribute(`data-selected`, this.selection.selected.has(el));\n      if (this.interactionMode === `checked`) {\n        el.toggleAttribute(`data-checked`, !item.hasAttribute(`not-checked`) && this.selection.selected.has(el));\n      } else {\n        el.removeAttribute(`data-checked`);\n      }\n    }\n    this.dataset.inputMode = this.tickled.inputMode;\n    this._syncCheckboxes();\n  }\n\n  private _syncCheckboxes(): void {\n    const inCheckedMode = this.interactionMode === `checked`;\n    const wantsCustom = typeof this.checkboxRenderer === `function`;\n\n    if (inCheckedMode) {\n      for (const inner of Array.from(this.children)) {\n        if (!inner.hasAttribute(`data-list-item`))\n          continue;\n        if (inner.parentElement !== this)\n          continue; // idempotency: already wrapped\n        const wrapper = document.createElement(`li`);\n        wrapper.className = `ixfx-custom-row`;\n        const key = inner.getAttribute(`data-key`);\n        const label = inner.getAttribute(`data-search-label`);\n        if (key !== null)\n          wrapper.setAttribute(`data-key`, key);\n        if (label !== null)\n          wrapper.setAttribute(`data-search-label`, label);\n        inner.removeAttribute(`data-list-item`);\n        this.insertBefore(wrapper, inner);\n        wrapper.appendChild(inner);\n        this.#customWrappers.set(wrapper, inner);\n        this.#wrappedElements.add(inner);\n      }\n    } else {\n      for (const [wrapper, inner] of this.#customWrappers) {\n        if (wrapper.parentElement !== this)\n          continue;\n        inner.setAttribute(`data-list-item`, ``);\n        this.insertBefore(inner, wrapper);\n        wrapper.remove();\n      }\n      this.#customWrappers.clear();\n      this.#wrappedElements.clear();\n    }\n\n    for (const el of this.querySelectorAll<HTMLElement>(`li`)) {\n      const existing = el.querySelector<HTMLElement>(`.ixfx-list-checkbox`);\n      if (!inCheckedMode) {\n        if (existing)\n          existing.remove();\n        continue;\n      }\n      // Rows marked `not-checked` get no checkbox column and can't be checked\n      const itemEl = this.#customWrappers.get(el as HTMLLIElement) ?? el;\n      if (itemEl.hasAttribute(`not-checked`)) {\n        if (existing)\n          existing.remove();\n        continue;\n      }\n\n      // In checked mode: if the existing checkbox is the wrong variant, drop it.\n      const existingIsCustom = existing?.classList.contains(`ixfx-list-checkbox-custom`) ?? false;\n      if (existing && existingIsCustom !== wantsCustom)\n        existing.remove();\n\n      let cb: HTMLElement | null = el.querySelector<HTMLElement>(`.ixfx-list-checkbox`);\n      if (!cb) {\n        if (wantsCustom) {\n          const opts = this.checkboxRenderer as CustomCheckboxOptions;\n          const margin = opts.margin ?? `0`;\n          const width = opts.width ?? `24px`;\n          cb = this._createCustomCheckbox(el, margin, width);\n        } else {\n          cb = this._createNativeCheckboxCell(el);\n        }\n        el.prepend(cb);\n      }\n\n      const checked = this.selection.selected.has(el);\n      if (wantsCustom) {\n        cb.setAttribute(`aria-checked`, String(checked));\n        cb.toggleAttribute(`data-checked`, checked);\n        if (this.checkboxRenderer) {\n          const renderer = typeof this.checkboxRenderer === `function`\n            ? this.checkboxRenderer\n            : (this.checkboxRenderer as CustomCheckboxOptions).renderer;\n          render(renderer(checked), cb);\n        }\n      } else {\n        const input = cb.querySelector<HTMLInputElement>(`input.ixfx-list-checkbox`);\n        if (input)\n          input.checked = checked;\n      }\n    }\n  }\n\n  /**\n   * Native checkbox cell: a span that stretches to the row's full cross-axis\n   * (so the entire column height is a click target) with a real `<input>`\n   * centred inside. The span owns the click; the input is purely visual and\n   * has `pointer-events:none` so a single click produces one toggle.\n   */\n  private _createNativeCheckboxCell(el: HTMLElement): HTMLSpanElement {\n    const cell = document.createElement(`span`);\n    cell.className = `ixfx-list-checkbox ixfx-list-checkbox-native`;\n    cell.style.cssText = `display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;align-self:stretch;width:18px;margin:0 6px 0 0;cursor:pointer;pointer-events:auto`;\n    cell.tabIndex = -1;\n    cell.setAttribute(`role`, `checkbox`);\n    cell.setAttribute(`part`, `checkbox`);\n    cell.addEventListener(`click`, (e) => {\n      e.stopPropagation();\n      this.selection.toggle(el);\n    });\n    const input = document.createElement(`input`);\n    input.type = `checkbox`;\n    input.className = `ixfx-list-checkbox`;\n    input.style.cssText = `pointer-events:none;cursor:pointer;margin:0`;\n    cell.appendChild(input);\n    return cell;\n  }\n\n  /**\n   * Custom checkbox cell: same shape as the native cell (a stretching span)\n   * so behaviour is identical. The renderer's content goes inside.\n   */\n  private _createCustomCheckbox(el: HTMLElement, margin: string, width: string): HTMLSpanElement {\n    const span = document.createElement(`span`);\n    span.className = `ixfx-list-checkbox ixfx-list-checkbox-custom`;\n    span.style.cssText = `display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;align-self:stretch;width:${width};margin:${margin};cursor:pointer;pointer-events:auto`;\n    span.tabIndex = -1;\n    span.setAttribute(`role`, `checkbox`);\n    span.setAttribute(`part`, `checkbox`);\n    span.addEventListener(`click`, (e) => {\n      e.stopPropagation();\n      this.selection.toggle(el);\n    });\n    return span;\n  }\n\n  private _findListItem(path: EventTarget[]): Element | undefined {\n    for (const target of path) {\n      if (!(target instanceof Element))\n        continue;\n      if (target === this)\n        break;\n      if (target.parentElement === this && target.matches(ITEM_SELECTOR))\n        return target;\n    }\n    return undefined;\n  }\n\n  private _dispatch<T>(name: keyof ListElementEventMap, detail: T): void {\n    this.dispatchEvent(new CustomEvent<T>(name as string, {\n      detail,\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  // --- Event handlers ---\n\n  private _onPointerOver = (e: PointerEvent): void => {\n    const item = this._findListItem(e.composedPath());\n    if (item)\n      this.tickled.handlePointerEnter(item);\n  };\n\n  private _onPointerLeave = (e: PointerEvent): void => {\n    this.tickled.handlePointerLeave(e);\n  };\n\n  private _onKeyDown = (e: KeyboardEvent): void => {\n    if (this.search.isOpen)\n      return;\n    if ((e.ctrlKey || e.metaKey) && e.key === `a`) {\n      if (this.selection.canSelectAll()) {\n        e.preventDefault();\n        this.selection.selectAll();\n      }\n      return;\n    }\n\n    switch (e.key) {\n      case `ArrowDown`: {\n        e.preventDefault();\n        this.tickled.handleKeyboardNavigation(`next`);\n        // vscode: Shift+Arrow extends range from anchor\n        if (e.shiftKey && this.interactionMode === `vscode`) {\n          const cur = this.tickled.tickledId;\n          if (cur)\n            this.selection.rangeTo(cur);\n        }\n        break;\n      }\n      case `ArrowUp`: {\n        e.preventDefault();\n        this.tickled.handleKeyboardNavigation(`previous`);\n        if (e.shiftKey && this.interactionMode === `vscode`) {\n          const cur = this.tickled.tickledId;\n          if (cur)\n            this.selection.rangeTo(cur);\n        }\n        break;\n      }\n      case `Enter`: {\n        const id = this.tickled.tickledId;\n        if (id) {\n          e.preventDefault();\n          this._dispatch<ListItemClickDetail>(`list-item-click`, { item: id });\n          this._activateItem(id);\n        }\n        break;\n      }\n      case ` `: {\n        const id = this.tickled.tickledId;\n        if (id) {\n          e.preventDefault();\n          this.selection.handleSpace(id);\n        }\n        break;\n      }\n      case `Escape`:\n        this.selection.clear();\n        break;\n    }\n  };\n\n  private _onClick = (e: MouseEvent): void => {\n    const item = this._findListItem(e.composedPath());\n    if (!item)\n      return;\n    this._dispatch<ListItemClickDetail>(`list-item-click`, { item });\n    this.selection.handleClick(item, e);\n  };\n\n  private _onDblClick = (e: MouseEvent): void => {\n    const item = this._findListItem(e.composedPath());\n    if (item)\n      this._activateItem(item);\n  };\n\n  private _activateItem(item: Element): void {\n    // manual mode: never auto-select; just fire the event\n    if (this.interactionMode !== `manual`) {\n      this.selection.replace(item);\n    }\n    this._dispatch<ListActivateDetail>(`list-activate`, { item });\n  }\n\n  // --- Styles ---\n\n  static override styles = [themeFallbacks, listSearchStyles, css`\n    :host {\n      display: block;\n      position: relative;\n      background: var(--list-bg, var(--surface-3));\n      color: var(--list-text, var(--surface-3-text));\n      border-radius: var(--list-radius, var(--radius-s));\n      border: 1px solid var(--list-border, var(--border));\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n      box-sizing: border-box;\n      outline: none;\n      --ixfx-list-item-padding: var(--ixfx-list-item-padding, var(--list-item-padding, 4px var(--space-m, 8px)));\n    }\n\n    :host(:focus-visible) {\n      outline: 2px solid var(--accent);\n      outline-offset: 2px;\n    }\n\n    .container {\n      position: relative;\n      width: 100%;\n      height: 100%;\n    }\n\n    ul {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      width: 100%;\n      height: 100%;\n      overflow-x: hidden;\n      overflow-y: auto;\n      box-sizing: border-box;\n      /* Scrollbar theming: end users override these CSS variables to control\n         the native scrollbar (scrollbar-width, scrollbar-gutter, scrollbar-color). */\n      scrollbar-width: var(--list-scrollbar-width, auto);\n      scrollbar-gutter: var(--list-scrollbar-gutter, auto);\n      scrollbar-color: var(--list-scrollbar-color, auto);\n    }\n\n    ::slotted([hidden]) {\n      display: none !important;\n    }\n\n    ::slotted(li) {\n      display: flex;\n      align-items: center;\n      padding: var(--ixfx-list-item-padding);\n      /* Inset each row from the scroll container's edges (margin, not padding:\n         padding is inside the border box, so the tickle/selection outlines\n         would still sit flush against the edge and be clipped). */\n      margin: 0 var(--list-gutter, 4px);\n      min-height: var(--list-item-height, 28px);\n      cursor: pointer;\n      user-select: none;\n      transition: background var(--transition, 0.1s ease-out),\n                  outline-color var(--transition, 0.1s ease-out);\n      box-sizing: border-box;\n      outline: 1px solid transparent;\n    }\n\n    /* Custom shadow-DOM components handle their own internal layout/padding */\n    ::slotted([data-list-item]) {\n      display: block;\n      margin: 0 var(--list-gutter, 4px);\n      cursor: pointer;\n      user-select: none;\n      transition: background var(--transition, 0.1s ease-out),\n                  outline-color var(--transition, 0.1s ease-out);\n      outline: 1px solid transparent;\n    }\n\n    /* In checked mode, only the checkbox column is clickable; the row body\n       gets a default cursor so it doesn't suggest otherwise. */\n    :host([interaction-mode=\"checked\"]) ::slotted(li),\n    :host([interaction-mode=\"checked\"]) ::slotted([data-list-item]) {\n      cursor: default;\n    }\n\n    /* Wrapper inserted around custom [data-list-item] elements in checked mode.\n       Provides the flex layout so the injected checkbox can stretch to the\n       row's full height via align-self:stretch. */\n    .ixfx-custom-row {\n      display: flex;\n      align-items: center;\n      min-height: var(--list-item-height, 28px);\n      box-sizing: border-box;\n      cursor: default;\n      user-select: none;\n    }\n\n    ::slotted([data-tickled]) {\n      background: var(--item-bg-tickled);\n      outline: var(--item-border-tickled);\n    }\n\n    ::slotted([data-selected]) {\n      background: var(--item-bg-selected);\n      color: var(--item-text-selected);\n      outline: 1px solid transparent;\n    }\n\n    ::slotted([data-selected][data-tickled]) {\n      background: var(--item-bg-selected-tickled);\n      outline: 2px dashed var(--surface-3);\n      outline-offset: -2px;\n    }\n\n    /* checked mode: checkbox (injected into li) communicates selection — suppress bg highlight */\n    :host([interaction-mode=\"checked\"]) ::slotted([data-selected]) {\n      background: transparent;\n      color: inherit;\n      outline: 1px solid transparent;\n    }\n\n    :host([interaction-mode=\"checked\"]) ::slotted([data-selected][data-tickled]) {\n      background: var(--item-bg-tickled);\n      color: inherit;\n      outline: var(--item-border-tickled);\n    }\n  `];\n\n  // --- Render ---\n\n  override render() {\n    return html`\n      <div class=\"container\">\n        <ul part=\"list\">\n          <slot></slot>\n        </ul>\n        ${this.search.renderField()}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-vertical-list': VerticalListElement;\n  }\n\n  interface HTMLElementEventMap extends ListElementEventMap {}\n}\n"],"mappings":"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"}
+{"version":3,"file":"vertical-list.js","names":["#dragSelect","#marqueeHitTest","#marqueeRect","#searchRegistry","#effectiveSearchModes","#unregisterSearchCommands","#animatedItems","#itemObserver","#onItemsMutated","#syncSearchCommands","#customWrappers","#wrappedElements","#itemForKey","#marqueeStyle","customElement"],"sources":["../src/vertical-list/vertical-list.ts"],"sourcesContent":["import type { CommandId, CommandRegistry } from '@clinth/ui-commands';\nimport type { PropertyValues } from 'lit';\nimport type { ListSearchMode } from '../incr-search/index.js';\nimport type { DragSelectRect } from '../interaction/list-drag-select-controller.js';\nimport type {\n  ListActivateDetail,\n  ListElementEventMap,\n  ListInteractionMode,\n  ListItemClickDetail,\n  ListSelectDetail,\n  ListSelectionMode,\n  ListTickleDetail,\n} from '../interaction/list-selection-types.js';\nimport { createCommandRegistry } from '@clinth/ui-commands';\nimport { css, html, LitElement, render } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport {\n  createElementListSearchAdapter,\n  LIST_SEARCH_MODES,\n  ListSearchController,\n  listSearchStyles,\n  registerListSearchCommands,\n} from '../incr-search/index.js';\nimport { keyForElement } from '../interaction/keyed-list.js';\nimport { ListDragSelectController } from '../interaction/list-drag-select-controller.js';\nimport { animateListItemIn, animateListItemOut } from '../interaction/list-item-animation.js';\nimport { ListSelectionController } from '../interaction/list-selection-controller.js';\nimport { TickledController } from '../interaction/tickled-controller.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nexport type {\n  ListActivateDetail,\n  ListActivateEvent,\n  ListElementEventMap,\n  ListInteractionMode,\n  ListItemClickDetail,\n  ListItemClickEvent,\n  ListSelectDetail,\n  ListSelectEvent,\n  ListSelectionMode,\n  ListTickleDetail,\n  ListTickleEvent,\n} from './types.js';\n\nexport interface CustomCheckboxOptions {\n  renderer: (checked: boolean) => unknown;\n  margin?: string;\n  width?: string;\n}\n\nexport interface AddItemOptions {\n  /**\n   * In `checked` interaction mode, adds the item without a checkbox column and\n   * without the ability to be checked/selected. Equivalent to setting the\n   * `not-checked` attribute on the item. Ignored outside `checked` mode.\n   */\n  notChecked?: boolean;\n}\n\nconst ITEM_SELECTOR = `li, [data-list-item]`;\n\n@customElement(`ixfx-vertical-list`)\nexport class VerticalListElement extends LitElement {\n  @property({ type: String, attribute: `selection-mode` })\n  selectionMode: ListSelectionMode = `single`;\n\n  @property({ type: String, attribute: `interaction-mode` })\n  interactionMode: ListInteractionMode = `standard`;\n\n  @property({ attribute: false })\n  filterPredicate: ((el: Element) => boolean) | undefined;\n\n  /**\n   * Whether keyboard navigation wraps from last to first and vice versa.\n   * - 'stop' (default): navigation stops at the boundary\n   * - 'wrap': navigation wraps around\n   */\n  @property({ type: String, attribute: `item-wrap` })\n  itemWrap: `stop` | `wrap` = `stop`;\n\n  /**\n   * Optional renderer for the checkbox shown in `checked` interactionMode.\n   * Receives the current `checked` state and returns a Lit template result.\n   *\n   * When set, the per-row checkbox becomes a `<span role=\"checkbox\">` whose\n   * contents are whatever this returns (rendered with `lit`'s `render()`).\n   * When unset, a native `<input type=\"checkbox\">` is used.\n   *\n   * @example\n   *   list.checkboxRenderer = (checked) => checked\n   *     ? html`<svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\"\n   *           fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n   *           stroke-linecap=\"round\" stroke-linejoin=\"round\"\n   *           style=\"opacity:0.5\">\n   *         <polyline points=\"3,8 7,12 13,4\" />\n   *       </svg>`\n   *     : html``;\n   */\n  @property({ attribute: false })\n  checkboxRenderer: ((checked: boolean) => unknown) | CustomCheckboxOptions | undefined;\n\n  /**\n   * Space-separated subset of `navigate select filter` — limits which\n   * incremental-search modes are offered. Unset ⇒ all three; empty ⇒ search\n   * disabled. See `docs/infra-incremental.md`.\n   */\n  @property({ type: String, attribute: `search-modes`, reflect: true })\n  searchModes: string | undefined;\n\n  #customWrappers = new Map<HTMLLIElement, Element>();\n  #wrappedElements = new Set<Element>();\n\n  /** Watches for items added to the light DOM so they can be animated in. */\n  #itemObserver: MutationObserver | undefined;\n  /** Items that have already played (or been skipped for) their enter animation. */\n  #animatedItems = new WeakSet<Element>();\n\n  private readonly selection = new ListSelectionController<Element>({\n    getOrderedItems: () => this._getVisibleItems(),\n    isSelectable: el => this._isCheckable(el),\n    getModes: () => ({ selectionMode: this.selectionMode, interactionMode: this.interactionMode }),\n    getKey: keyForElement,\n    onChange: (selected, previous) => {\n      this._syncItemStates();\n      this._dispatch<ListSelectDetail>(`list-select`, {\n        selected,\n        previous,\n        selectedKeys: this.selection.selectedKeys,\n      });\n    },\n  });\n\n  private tickled = new TickledController<Element>(this, {\n    getItems: () => this._getVisibleItems().map(el => ({\n      id: el,\n      enabled: !el.hasAttribute(`not-checked`),\n    })),\n    onTickle: (id) => {\n      if (id !== undefined) {\n        this._dispatch<ListTickleDetail>(`list-tickle`, { item: id });\n      }\n    },\n    onStateChange: () => this._syncItemStates(),\n    itemWrap: this.itemWrap,\n    hoverDisabled: () => this.#dragSelect.isDragging,\n  });\n\n  /** Live drag-select preview rect (surface-relative); the covered items carry `data-marquee`. */\n  #marqueeRect: DragSelectRect | undefined;\n\n  readonly #dragSelect = new ListDragSelectController<Element>(this, {\n    getSurface: () => this.renderRoot.querySelector(`.container`) as HTMLElement | undefined,\n    isEnabled: () =>\n      this.selection.canDragSelect()\n      && this._getVisibleItems().length > 0\n      && !this.hasAttribute(`disable-drag-select`),\n    hitTest: rect => this.#marqueeHitTest(rect),\n    getBaseSelection: () => this.selection.selected,\n    onPreview: (preview, rect) => {\n      this.#marqueeRect = rect;\n      for (const el of this._getVisibleItems())\n        el.toggleAttribute(`data-marquee`, preview.has(el));\n      this.requestUpdate();\n    },\n    onCommit: (finalSet) => {\n      this.selection.applyDragSelection(finalSet);\n      for (const el of this._getVisibleItems())\n        el.removeAttribute(`data-marquee`);\n      this.#marqueeRect = undefined;\n      this.requestUpdate();\n    },\n    autoScroll: (_dx, dy) => {\n      const list = this.renderRoot.querySelector(`ul`);\n      if (list)\n        list.scrollTop += dy;\n    },\n  });\n\n  /** Collect visible items whose surface-relative box intersects `rect`. */\n  #marqueeHitTest(rect: DragSelectRect): Element[] {\n    const surface = this.renderRoot.querySelector(`.container`);\n    if (!surface)\n      return [];\n    const box = surface.getBoundingClientRect();\n    const rx0 = rect.x;\n    const ry0 = rect.y;\n    const rx1 = rect.x + rect.width;\n    const ry1 = rect.y + rect.height;\n    const out: Element[] = [];\n    for (const el of this._getVisibleItems()) {\n      const r = el.getBoundingClientRect();\n      const left = r.left - box.left;\n      const top = r.top - box.top;\n      if (left <= rx1 && left + r.width >= rx0 && top <= ry1 && top + r.height >= ry0)\n        out.push(el);\n    }\n    return out;\n  }\n\n  #marqueeStyle(rect: DragSelectRect): string {\n    return `left:${rect.x}px;top:${rect.y}px;width:${Math.max(0, rect.width)}px;height:${Math.max(0, rect.height)}px`;\n  }\n\n  /** Incremental search (navigate / select / filter). See `docs/infra-incremental.md`. */\n  readonly search = new ListSearchController<Element>(this, {\n    adapter: createElementListSearchAdapter(this, {\n      itemSelector: ITEM_SELECTOR,\n      getLabel: el => el.getAttribute(`data-search-label`) ?? el.textContent?.trim() ?? ``,\n      highlightKey: `vertical-list-search`,\n    }),\n  });\n\n  #searchRegistry: CommandRegistry<unknown> | undefined;\n  #unregisterSearchCommands: (() => void) | undefined;\n\n  /** Command registry carrying this list's `list.search.*` commands. */\n  get registry(): CommandRegistry<unknown> | undefined {\n    return this.#searchRegistry;\n  }\n\n  #effectiveSearchModes(): ListSearchMode[] {\n    const raw = this.searchModes?.trim();\n    if (raw === undefined)\n      return [...LIST_SEARCH_MODES];\n    const requested = new Set(raw.split(/\\s+/));\n    return LIST_SEARCH_MODES.filter(m => requested.has(m));\n  }\n\n  #syncSearchCommands(): void {\n    if (!this.#searchRegistry)\n      return;\n    this.search.setModes(this.#effectiveSearchModes());\n    this.#unregisterSearchCommands?.();\n    this.#unregisterSearchCommands = registerListSearchCommands(this.#searchRegistry, this.search);\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (!this.hasAttribute(`tabindex`))\n      this.tabIndex = 0;\n    this.addEventListener(`pointerover`, this._onPointerOver);\n    this.addEventListener(`pointerleave`, this._onPointerLeave);\n    this.addEventListener(`keydown`, this._onKeyDown);\n    this.addEventListener(`click`, this._onClick);\n    this.addEventListener(`dblclick`, this._onDblClick);\n    // Mark whatever's already here as \"known\" so the first populate doesn't\n    // animate; anything added later collapses in.\n    for (const el of this.querySelectorAll(ITEM_SELECTOR))\n      this.#animatedItems.add(el);\n    this.#itemObserver ??= new MutationObserver(records => this.#onItemsMutated(records));\n    this.#itemObserver.observe(this, { childList: true });\n    this.#searchRegistry ??= createCommandRegistry();\n    this.#syncSearchCommands();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener(`pointerover`, this._onPointerOver);\n    this.removeEventListener(`pointerleave`, this._onPointerLeave);\n    this.removeEventListener(`keydown`, this._onKeyDown);\n    this.removeEventListener(`click`, this._onClick);\n    this.removeEventListener(`dblclick`, this._onDblClick);\n    this.#itemObserver?.disconnect();\n    this.#unregisterSearchCommands?.();\n    this.#unregisterSearchCommands = undefined;\n    this.#searchRegistry = undefined;\n  }\n\n  /**\n   * Animate in items appended to the light DOM (however they got there —\n   * {@link addItem}, direct `appendChild`, a framework binding). A bulk populate\n   * (roughly everything at once) is left alone, as are the wrapper `<li>`s the\n   * checked-mode plumbing shuffles around.\n   */\n  #onItemsMutated(records: MutationRecord[]): void {\n    if (!this.isConnected)\n      return;\n    const fresh: HTMLElement[] = [];\n    for (const record of records) {\n      for (const node of record.addedNodes) {\n        if (!(node instanceof HTMLElement) || node.parentElement !== this)\n          continue;\n        if (!node.matches(ITEM_SELECTOR))\n          continue;\n        if (this.#animatedItems.has(node) || this.#customWrappers.has(node as HTMLLIElement) || this.#wrappedElements.has(node))\n          continue;\n        this.#animatedItems.add(node);\n        fresh.push(node);\n      }\n    }\n    if (fresh.length === 0)\n      return;\n    const total = this.querySelectorAll(ITEM_SELECTOR).length;\n    if (fresh.length >= total)\n      return; // first populate / wholesale replace — don't animate\n    for (const el of fresh)\n      animateListItemIn(el);\n  }\n\n  override updated(changed: PropertyValues): void {\n    super.updated(changed);\n    if (changed.has(`searchModes`)) {\n      this.#syncSearchCommands();\n    }\n    if (changed.has(`interactionMode`)) {\n      this.selection.clearAnchor();\n      const previousSelected = this.selection.selected;\n      // Save wrapper→inner map before _syncCheckboxes() clears it on unwrap\n      const leavingChecked = (changed.get(`interactionMode`) as ListInteractionMode) === `checked`;\n      const savedWrappers = leavingChecked ? new Map(this.#customWrappers) : null;\n\n      this._syncCheckboxes();\n\n      // Remap the selection across the wrap/unwrap element-reference boundary\n      if (previousSelected.size > 0) {\n        if (savedWrappers && savedWrappers.size > 0) {\n          // Leaving checked: wrapper refs → inner element refs\n          this.selection.remap(el => savedWrappers.get(el as HTMLLIElement) ?? el);\n        } else if (this.#customWrappers.size > 0) {\n          // Entering checked: inner element refs → wrapper refs\n          const innerToWrapper = new Map([...this.#customWrappers].map(([w, i]) => [i, w]));\n          this.selection.remap(el => innerToWrapper.get(el) ?? el);\n        }\n      }\n\n      this._syncItemStates();\n    } else if (changed.has(`checkboxRenderer`) && this.interactionMode === `checked`) {\n      this._syncCheckboxes();\n    }\n  }\n\n  // --- Public API ---\n\n  /** The most recently selected item, or `undefined` if nothing is selected. */\n  get selectedItem(): Element | undefined {\n    return [...this.selection.selected].at(-1);\n  }\n\n  /** The full current selection set (read-only). */\n  get selectedItems(): ReadonlySet<Element> {\n    return this.selection.selected;\n  }\n\n  addItem(item: Element | string, options?: AddItemOptions): void {\n    let el: Element;\n    if (typeof item === `string`) {\n      const li = document.createElement(`li`);\n      li.textContent = item;\n      el = li;\n    } else {\n      el = item;\n    }\n    if (options?.notChecked)\n      el.setAttribute(`not-checked`, ``);\n    this.appendChild(el);\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Collapse + fade `item` out, then detach it. The rows below slide up to\n   * close the gap. Resolves once the element has actually been removed.\n   * Under `prefers-reduced-motion: reduce` it's removed immediately.\n   */\n  removeItem(item: Element): Promise<void> {\n    this.selection.deselect(item);\n    const done = animateListItemOut(item as HTMLElement).then(() => {\n      item.remove();\n      if (this.interactionMode === `checked`)\n        this._syncCheckboxes();\n    });\n    return done;\n  }\n\n  /** {@link removeItem} for several items at once. */\n  removeItems(items: Iterable<Element>): Promise<void> {\n    return Promise.all([...items].map(item => this.removeItem(item))).then(() => undefined);\n  }\n\n  clearItems(): void {\n    this.#customWrappers.clear();\n    this.replaceChildren();\n    this.selection.reset();\n    this._syncItemStates();\n  }\n\n  /**\n   * Replace the entire item list in one call.\n   * Equivalent to `clearItems()` followed by `addItem()` for each element.\n   * Preserves `interactionMode` checkbox wrapping.\n   */\n  setItems(items: readonly Element[]): void {\n    this.clearItems();\n    for (const item of items) {\n      this.appendChild(item);\n    }\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Dispatch a command to this list — used by `ixfx-grouped-item-lister` to\n   * forward commands to all sub-components. Routes through the command registry\n   * (so `list.search.*` and any other registered commands work).\n   */\n  dispatch(commandId: CommandId, args?: Record<string, unknown>): void {\n    this.#searchRegistry?.invoke(commandId, args);\n  }\n\n  select(item: Element): void {\n    this.selection.replace(item);\n  }\n\n  selectMany(items: Iterable<Element>): void {\n    this.selection.selectMany(items);\n  }\n\n  deselect(item: Element): void {\n    this.selection.deselect(item);\n  }\n\n  clearSelection(): void {\n    this.selection.clear();\n  }\n\n  selectAll(): void {\n    if (this.selection.canSelectAll())\n      this.selection.selectAll();\n  }\n\n  // --- Key-based selection & cursor ---\n\n  /** The selection as stable `data-key` / `data-value` strings. */\n  get selectedKeys(): ReadonlySet<string> {\n    return this.selection.selectedKeys;\n  }\n\n  /** The key of the item under the cursor, or `undefined`. */\n  get tickledKey(): string | undefined {\n    const id = this.tickled.tickledId;\n    return id ? keyForElement(id) : undefined;\n  }\n\n  /** Replace the selection with the items carrying these keys (unknown keys ignored). */\n  selectKeys(keys: Iterable<string>): void {\n    this.selection.selectKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Add items by key to the selection (multi-select modes only). */\n  addSelectedKeys(keys: Iterable<string>): void {\n    this.selection.addKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Remove items by key from the selection. */\n  removeSelectedKeys(keys: Iterable<string>): void {\n    this.selection.removeKeys(keys, key => this.#itemForKey(key));\n  }\n\n  /** Move the cursor to the item with this key and scroll it into view. */\n  focusKey(key: string): void {\n    const el = this.#itemForKey(key);\n    if (!el)\n      return;\n    this.tickled.focus(el);\n    el.scrollIntoView({ block: `nearest`, inline: `nearest` });\n  }\n\n  #itemForKey(key: string): Element | undefined {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      if (keyForElement(el) === key)\n        return el;\n    }\n    return undefined;\n  }\n\n  * selectedFilter(kind: `selected` | `checked` | `either`): Generator<Element> {\n    const wanted = (el: Element) => {\n      switch (kind) {\n        case `selected`: return el.hasAttribute(`data-selected`);\n        case `checked`: return el.hasAttribute(`data-checked`);\n        case `either`: return el.hasAttribute(`data-selected`) || el.hasAttribute(`data-checked`);\n      }\n    };\n\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      if ((el as HTMLElement).hidden)\n        continue;\n      if (wanted(el))\n        yield el;\n    }\n  }\n\n  // --- Helpers ---\n\n  private _getVisibleItems(): Element[] {\n    return Array.from(this.querySelectorAll(ITEM_SELECTOR)).filter((el) => {\n      if (this.#wrappedElements.has(el))\n        return false;\n      if ((el as HTMLElement).hidden)\n        return false;\n      if (this.filterPredicate && !this.filterPredicate(el))\n        return false;\n      return true;\n    });\n  }\n\n  // Whether an item participates in checked-mode selection. Items carrying the\n  // `not-checked` attribute are skipped; outside `checked` mode it has no effect.\n  // For wrapped custom elements the flag lives on the inner element, so resolve\n  // through the wrapper map.\n  private _isCheckable(item: Element): boolean {\n    if (this.interactionMode !== `checked`)\n      return true;\n    const real = this.#customWrappers.get(item as HTMLLIElement) ?? item;\n    return !real.hasAttribute(`not-checked`);\n  }\n\n  private _syncItemStates(): void {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.#wrappedElements.has(el))\n        continue;\n      const item = this.#customWrappers.get(el as HTMLLIElement) ?? el;\n      el.toggleAttribute(`data-tickled`, this.tickled.isTickled(el));\n      el.toggleAttribute(`data-selected`, this.selection.selected.has(el));\n      if (this.interactionMode === `checked`) {\n        el.toggleAttribute(`data-checked`, !item.hasAttribute(`not-checked`) && this.selection.selected.has(el));\n      } else {\n        el.removeAttribute(`data-checked`);\n      }\n    }\n    this.dataset.inputMode = this.tickled.inputMode;\n    this._syncCheckboxes();\n  }\n\n  private _syncCheckboxes(): void {\n    const inCheckedMode = this.interactionMode === `checked`;\n    const wantsCustom = typeof this.checkboxRenderer === `function`;\n\n    if (inCheckedMode) {\n      for (const inner of Array.from(this.children)) {\n        if (!inner.hasAttribute(`data-list-item`))\n          continue;\n        if (inner.parentElement !== this)\n          continue; // idempotency: already wrapped\n        const wrapper = document.createElement(`li`);\n        wrapper.className = `ixfx-custom-row`;\n        const key = inner.getAttribute(`data-key`);\n        const label = inner.getAttribute(`data-search-label`);\n        if (key !== null)\n          wrapper.setAttribute(`data-key`, key);\n        if (label !== null)\n          wrapper.setAttribute(`data-search-label`, label);\n        inner.removeAttribute(`data-list-item`);\n        this.insertBefore(wrapper, inner);\n        wrapper.appendChild(inner);\n        this.#customWrappers.set(wrapper, inner);\n        this.#wrappedElements.add(inner);\n      }\n    } else {\n      for (const [wrapper, inner] of this.#customWrappers) {\n        if (wrapper.parentElement !== this)\n          continue;\n        inner.setAttribute(`data-list-item`, ``);\n        this.insertBefore(inner, wrapper);\n        wrapper.remove();\n      }\n      this.#customWrappers.clear();\n      this.#wrappedElements.clear();\n    }\n\n    for (const el of this.querySelectorAll<HTMLElement>(`li`)) {\n      const existing = el.querySelector<HTMLElement>(`.ixfx-list-checkbox`);\n      if (!inCheckedMode) {\n        if (existing)\n          existing.remove();\n        continue;\n      }\n      // Rows marked `not-checked` get no checkbox column and can't be checked\n      const itemEl = this.#customWrappers.get(el as HTMLLIElement) ?? el;\n      if (itemEl.hasAttribute(`not-checked`)) {\n        if (existing)\n          existing.remove();\n        continue;\n      }\n\n      // In checked mode: if the existing checkbox is the wrong variant, drop it.\n      const existingIsCustom = existing?.classList.contains(`ixfx-list-checkbox-custom`) ?? false;\n      if (existing && existingIsCustom !== wantsCustom)\n        existing.remove();\n\n      let cb: HTMLElement | null = el.querySelector<HTMLElement>(`.ixfx-list-checkbox`);\n      if (!cb) {\n        if (wantsCustom) {\n          const opts = this.checkboxRenderer as CustomCheckboxOptions;\n          const margin = opts.margin ?? `0`;\n          const width = opts.width ?? `24px`;\n          cb = this._createCustomCheckbox(el, margin, width);\n        } else {\n          cb = this._createNativeCheckboxCell(el);\n        }\n        el.prepend(cb);\n      }\n\n      const checked = this.selection.selected.has(el);\n      if (wantsCustom) {\n        cb.setAttribute(`aria-checked`, String(checked));\n        cb.toggleAttribute(`data-checked`, checked);\n        if (this.checkboxRenderer) {\n          const renderer = typeof this.checkboxRenderer === `function`\n            ? this.checkboxRenderer\n            : (this.checkboxRenderer as CustomCheckboxOptions).renderer;\n          render(renderer(checked), cb);\n        }\n      } else {\n        const input = cb.querySelector<HTMLInputElement>(`input.ixfx-list-checkbox`);\n        if (input)\n          input.checked = checked;\n      }\n    }\n  }\n\n  /**\n   * Native checkbox cell: a span that stretches to the row's full cross-axis\n   * (so the entire column height is a click target) with a real `<input>`\n   * centred inside. The span owns the click; the input is purely visual and\n   * has `pointer-events:none` so a single click produces one toggle.\n   */\n  private _createNativeCheckboxCell(el: HTMLElement): HTMLSpanElement {\n    const cell = document.createElement(`span`);\n    cell.className = `ixfx-list-checkbox ixfx-list-checkbox-native`;\n    cell.style.cssText = `display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;align-self:stretch;width:18px;margin:0 6px 0 0;cursor:pointer;pointer-events:auto`;\n    cell.tabIndex = -1;\n    cell.setAttribute(`role`, `checkbox`);\n    cell.setAttribute(`part`, `checkbox`);\n    cell.addEventListener(`click`, (e) => {\n      e.stopPropagation();\n      this.selection.toggle(el);\n    });\n    const input = document.createElement(`input`);\n    input.type = `checkbox`;\n    input.className = `ixfx-list-checkbox`;\n    input.style.cssText = `pointer-events:none;cursor:pointer;margin:0`;\n    cell.appendChild(input);\n    return cell;\n  }\n\n  /**\n   * Custom checkbox cell: same shape as the native cell (a stretching span)\n   * so behaviour is identical. The renderer's content goes inside.\n   */\n  private _createCustomCheckbox(el: HTMLElement, margin: string, width: string): HTMLSpanElement {\n    const span = document.createElement(`span`);\n    span.className = `ixfx-list-checkbox ixfx-list-checkbox-custom`;\n    span.style.cssText = `display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;align-self:stretch;width:${width};margin:${margin};cursor:pointer;pointer-events:auto`;\n    span.tabIndex = -1;\n    span.setAttribute(`role`, `checkbox`);\n    span.setAttribute(`part`, `checkbox`);\n    span.addEventListener(`click`, (e) => {\n      e.stopPropagation();\n      this.selection.toggle(el);\n    });\n    return span;\n  }\n\n  private _findListItem(path: EventTarget[]): Element | undefined {\n    for (const target of path) {\n      if (!(target instanceof Element))\n        continue;\n      if (target === this)\n        break;\n      if (target.parentElement === this && target.matches(ITEM_SELECTOR))\n        return target;\n    }\n    return undefined;\n  }\n\n  private _dispatch<T>(name: keyof ListElementEventMap, detail: T): void {\n    this.dispatchEvent(new CustomEvent<T>(name as string, {\n      detail,\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  // --- Event handlers ---\n\n  private _onPointerOver = (e: PointerEvent): void => {\n    const item = this._findListItem(e.composedPath());\n    if (item)\n      this.tickled.handlePointerEnter(item);\n  };\n\n  private _onPointerLeave = (e: PointerEvent): void => {\n    this.tickled.handlePointerLeave(e);\n  };\n\n  private _onKeyDown = (e: KeyboardEvent): void => {\n    if (this.search.isOpen)\n      return;\n    if ((e.ctrlKey || e.metaKey) && e.key === `a`) {\n      if (this.selection.canSelectAll()) {\n        e.preventDefault();\n        this.selection.selectAll();\n      }\n      return;\n    }\n\n    switch (e.key) {\n      case `ArrowDown`: {\n        e.preventDefault();\n        this.tickled.handleKeyboardNavigation(`next`);\n        // vscode: Shift+Arrow extends range from anchor\n        if (e.shiftKey && this.interactionMode === `vscode`) {\n          const cur = this.tickled.tickledId;\n          if (cur)\n            this.selection.rangeTo(cur);\n        }\n        break;\n      }\n      case `ArrowUp`: {\n        e.preventDefault();\n        this.tickled.handleKeyboardNavigation(`previous`);\n        if (e.shiftKey && this.interactionMode === `vscode`) {\n          const cur = this.tickled.tickledId;\n          if (cur)\n            this.selection.rangeTo(cur);\n        }\n        break;\n      }\n      case `Enter`: {\n        const id = this.tickled.tickledId;\n        if (id) {\n          e.preventDefault();\n          this._dispatch<ListItemClickDetail>(`list-item-click`, { item: id });\n          this._activateItem(id);\n        }\n        break;\n      }\n      case ` `: {\n        const id = this.tickled.tickledId;\n        if (id) {\n          e.preventDefault();\n          this.selection.handleSpace(id);\n        }\n        break;\n      }\n      case `Escape`:\n        this.selection.clear();\n        break;\n    }\n  };\n\n  private _onClick = (e: MouseEvent): void => {\n    if (this.#dragSelect.isDragging)\n      return;\n    const item = this._findListItem(e.composedPath());\n    if (!item)\n      return;\n    this._dispatch<ListItemClickDetail>(`list-item-click`, { item });\n    this.selection.handleClick(item, e);\n  };\n\n  private _onDblClick = (e: MouseEvent): void => {\n    const item = this._findListItem(e.composedPath());\n    if (item)\n      this._activateItem(item);\n  };\n\n  private _activateItem(item: Element): void {\n    // manual mode: never auto-select; just fire the event\n    if (this.interactionMode !== `manual`) {\n      this.selection.replace(item);\n    }\n    this._dispatch<ListActivateDetail>(`list-activate`, { item });\n  }\n\n  // --- Styles ---\n\n  static override styles = [themeFallbacks, listSearchStyles, css`\n    :host {\n      display: block;\n      position: relative;\n      background: var(--list-bg, var(--surface-3));\n      color: var(--list-text, var(--surface-3-text));\n      border-radius: var(--list-radius, var(--radius-s));\n      border: 1px solid var(--list-border, var(--border));\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n      box-sizing: border-box;\n      outline: none;\n      --ixfx-list-item-padding: var(--ixfx-list-item-padding, var(--list-item-padding, 4px var(--space-m, 8px)));\n    }\n\n    :host(:focus-visible) {\n      outline: 2px solid var(--accent);\n      outline-offset: 2px;\n    }\n\n    .container {\n      position: relative;\n      width: 100%;\n      height: 100%;\n    }\n\n    ul {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      width: 100%;\n      height: 100%;\n      overflow-x: hidden;\n      overflow-y: auto;\n      box-sizing: border-box;\n      /* Scrollbar theming: end users override these CSS variables to control\n         the native scrollbar (scrollbar-width, scrollbar-gutter, scrollbar-color). */\n      scrollbar-width: var(--list-scrollbar-width, auto);\n      scrollbar-gutter: var(--list-scrollbar-gutter, auto);\n      scrollbar-color: var(--list-scrollbar-color, auto);\n    }\n\n    ::slotted([hidden]) {\n      display: none !important;\n    }\n\n    ::slotted(li) {\n      display: flex;\n      align-items: center;\n      padding: var(--ixfx-list-item-padding);\n      /* Inset each row from the scroll container's edges (margin, not padding:\n         padding is inside the border box, so the tickle/selection outlines\n         would still sit flush against the edge and be clipped). */\n      margin: 0 var(--list-gutter, 4px);\n      min-height: var(--list-item-height, 28px);\n      cursor: pointer;\n      user-select: none;\n      transition: background var(--transition, 0.1s ease-out),\n                  outline-color var(--transition, 0.1s ease-out);\n      box-sizing: border-box;\n      outline: 1px solid transparent;\n    }\n\n    /* Custom shadow-DOM components handle their own internal layout/padding */\n    ::slotted([data-list-item]) {\n      display: block;\n      margin: 0 var(--list-gutter, 4px);\n      cursor: pointer;\n      user-select: none;\n      transition: background var(--transition, 0.1s ease-out),\n                  outline-color var(--transition, 0.1s ease-out);\n      outline: 1px solid transparent;\n    }\n\n    /* In checked mode, only the checkbox column is clickable; the row body\n       gets a default cursor so it doesn't suggest otherwise. */\n    :host([interaction-mode=\"checked\"]) ::slotted(li),\n    :host([interaction-mode=\"checked\"]) ::slotted([data-list-item]) {\n      cursor: default;\n    }\n\n    /* Wrapper inserted around custom [data-list-item] elements in checked mode.\n       Provides the flex layout so the injected checkbox can stretch to the\n       row's full height via align-self:stretch. */\n    .ixfx-custom-row {\n      display: flex;\n      align-items: center;\n      min-height: var(--list-item-height, 28px);\n      box-sizing: border-box;\n      cursor: default;\n      user-select: none;\n    }\n\n    ::slotted([data-tickled]) {\n      background: var(--item-bg-tickled);\n      outline: var(--item-border-tickled);\n    }\n\n    ::slotted([data-selected]) {\n      background: var(--item-bg-selected);\n      color: var(--item-text-selected);\n      outline: 1px solid transparent;\n    }\n\n    ::slotted([data-selected][data-tickled]) {\n      background: var(--item-bg-selected-tickled);\n      outline: 2px dashed var(--surface-3);\n      outline-offset: -2px;\n    }\n\n    /* Drag-select (marquee) rectangle + covered-row preview.\n       Style hooks: part=\"marquee\", --vertical-list-marquee-border,\n       --vertical-list-marquee-fill. */\n    .marquee {\n      position: absolute;\n      pointer-events: none;\n      z-index: 5;\n      border: 1px solid var(--vertical-list-marquee-border, var(--accent));\n      background: var(--vertical-list-marquee-fill, color-mix(in srgb, var(--accent) 15%, transparent));\n    }\n\n    ::slotted([data-marquee]) {\n      background: var(--item-bg-selected);\n      color: var(--item-text-selected);\n    }\n\n    /* checked mode: checkbox (injected into li) communicates selection — suppress bg highlight */\n    :host([interaction-mode=\"checked\"]) ::slotted([data-selected]) {\n      background: transparent;\n      color: inherit;\n      outline: 1px solid transparent;\n    }\n\n    :host([interaction-mode=\"checked\"]) ::slotted([data-selected][data-tickled]) {\n      background: var(--item-bg-tickled);\n      color: inherit;\n      outline: var(--item-border-tickled);\n    }\n  `];\n\n  // --- Render ---\n\n  override render() {\n    return html`\n      <div class=\"container\">\n        <ul part=\"list\">\n          <slot></slot>\n        </ul>\n        ${this.#marqueeRect\n          ? html`<div class=\"marquee\" part=\"marquee\" style=${this.#marqueeStyle(this.#marqueeRect)}></div>`\n          : ``}\n        ${this.search.renderField()}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-vertical-list': VerticalListElement;\n  }\n\n  interface HTMLElementEventMap extends ListElementEventMap {}\n}\n"],"mappings":"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"}

package/dist/{xy-axis-DzM1brBZ.js → xy-axis-CrrVdDFe.js}

@@ -743,6 +743,7 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 		this.#onPointerMove = (e) => {
 			if (this.interactionMode === `select` && this._isDragging) {
 				const index = this.#bucketIndexFromPosition(e.clientX, e.clientY);
+				if (index === this._selectionEnd) return;
 				this._selectionEnd = index;
 				const start = Math.min(this._selectionStart, this._selectionEnd);
 				const end = Math.max(this._selectionStart, this._selectionEnd);
@@ -754,6 +755,7 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 					this._selectionOverlayText = `Select: ${startBar.valueMin.toFixed(2)} – ${endBar.valueMax.toFixed(2)}`;
 				}
 				this.requestUpdate();
+				this.#emitSelectionChange(false);
 				return;
 			}
 			if (this.interactionMode === `select`) return;
@@ -769,6 +771,7 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 					this._isDragging = false;
 					this._selectionOverlayText = null;
 					this.requestUpdate();
+					this.#emitSelectionChange(true);
 				}
 				return;
 			}
@@ -788,9 +791,13 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 			this.setColoredRange(startBar.valueMin, endBar.valueMax);
 			this._selectionOverlayText = `Select: ${startBar.valueMin.toFixed(2)} – ${endBar.valueMax.toFixed(2)}`;
 			this.requestUpdate();
+			this.#emitSelectionChange(false);
 		};
 		this.#onPointerUp = () => {
-			if (this.interactionMode === `select`) this._isDragging = false;
+			if (this.interactionMode === `select` && this._isDragging) {
+				this._isDragging = false;
+				this.#emitSelectionChange(true);
+			}
 		};
 	}
 	#series;
@@ -839,11 +846,14 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 			this.setColoredRange(startBar.valueMin, endBar.valueMax);
 		}
 		this.requestUpdate();
+		this.#emitSelectionChange(true);
 	}
 	clearSelection() {
+		const had = this._selectionStart !== null || this._selectionEnd !== null;
 		this._selectionStart = null;
 		this._selectionEnd = null;
 		this.requestUpdate();
+		if (had) this.#emitSelectionChange(true);
 	}
 	getSelectedRange() {
 		if (this._selectionStart === null || this._selectionEnd === null) return {
@@ -928,6 +938,21 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 			composed: true
 		}));
 	}
+	/**
+	* Fire `plot-selection-change` with the current bar-range selection (indices +
+	* data span). `committed` is `false` mid-drag, `true` on release / programmatic
+	* change.
+	*/
+	#emitSelectionChange(committed) {
+		this.dispatchEvent(new CustomEvent(`plot-selection-change`, {
+			detail: {
+				...this.getSelectedRange(),
+				committed
+			},
+			bubbles: true,
+			composed: true
+		}));
+	}
 	/** Bucket layout + counts, shared by render() and pointer hit-testing. */
 	#computeGeometry() {
 		const { values, range } = this.#series;
@@ -1015,7 +1040,7 @@ let PlotHistogram = class PlotHistogram extends LitElement {
 	}
 	/** Gets bucket index from position, clamping to valid range (0 to bucketCount-1). */
 	#bucketIndexFromPosition(clientX, clientY) {
-		const { w, h, isHorizontal, padding, dataMin, dataSpan, bucketCount, availableMain } = this.#computeGeometry();
+		const { isHorizontal, padding, bucketCount, availableMain } = this.#computeGeometry();
 		const rect = this.getBoundingClientRect();
 		const x = clientX - rect.left;
 		const y = clientY - rect.top;
@@ -1979,4 +2004,4 @@ PlotXyAxis = __decorate([safeCustomElement(`ixfx-plot-xy-axis`)], PlotXyAxis);
 //#endregion
 export { TooltipElement as a, computeColour as c, PlotMultiAxis as i, parseColourScaleAttr as l, PlotSingleAxis as n, PlotDataSeries as o, PlotHistogram as r, applyAgeModification as s, PlotXyAxis as t, readBaseColour as u };
 
-//# sourceMappingURL=xy-axis-DzM1brBZ.js.map
+//# sourceMappingURL=xy-axis-CrrVdDFe.js.map