@ixfx/components 0.7.3 → 0.7.4

package/dist/detail-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"detail-list.js","names":["#navigateDown","#navigateUp","#navigateRight","#navigateLeft","#navigateTo","#findFirstCheckable","#findLastCheckable","#search","#recomputeGeometry","#data","#resizeObserver","#scheduleGeometry","#mutationObserver","#processChildren","#animateChildMutations","#animatedItems","#applyFilterPredicate","#builtFromProvider","#providerBuilt","#rebuildFromObjects","#syncFromProvider","#applySort","#ensureIcon","#itemData","#itemForKey","#createItemEl","#propertyValue","#geometryScheduled","#grid","#positions","#gridSize","#itemAt","#positionOf","#findNextCheckable","customElement"],"sources":["../src/detail-list/detail-list.ts"],"sourcesContent":["import type { CommandId } from '@clinth/ui-commands';\nimport type { PropertyValues } from 'lit';\nimport type { IDataProvider } from '../common/data-provider.js';\nimport type { ElementIncrSearch } from '../incr-search/element-search.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 type {\n  AddItemOptions,\n  CustomCheckboxOptions,\n  DetailFormatter,\n  DetailSortComparator,\n  DetailSortItem,\n  DetailSortMode,\n} from './types.js';\nimport { css, html, LitElement, nothing, render } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { DataController } from '../common/data-controller.js';\nimport { createElementIncrSearch } from '../incr-search/element-search.js';\nimport { keyForElement } from '../interaction/keyed-list.js';\nimport { animateListItemIn, animateListItemOut, LIST_ITEM_MOTION_MS } 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 { scrollFadeStyles } from '../styles/scroll-fade.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport '../icons/icon.js';\n\nexport type {\n  AddItemOptions,\n  CustomCheckboxOptions,\n  DetailFormatter,\n  DetailSortComparator,\n  DetailSortItem,\n  DetailSortMode,\n} from './types.js';\n\nconst ITEM_SELECTOR = `:scope > li`;\nconst SEARCH_HIGHLIGHT_KEY = `detail-list-search`;\nconst LABEL_SPAN_CSS = `overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0`;\n\ntype GridPosition = { readonly col: number; readonly row: number };\n\n/**\n * A list that scales horizontally, not vertically.\n *\n * Items are laid out in equal-width columns; they flow top→bottom down a\n * column, then wrap to the top of the next column to the right. The\n * component has a fixed vertical extent and scrolls horizontally.\n *\n * Selection semantics match `ixfx-vertical-list` — same modes, same\n * `list-*` events, same keyboard gestures — but navigation is a 2-D grid\n * (Up/Down move within a column, Left/Right jump columns).\n *\n * Items come from any of three sources (later writes win):\n * 1. declarative `<li>` children in light DOM,\n * 2. `addItem()` / `setItems()`,\n * 3. an `items` array of objects rendered via `displayProperty` /\n *    `formatter`, optionally streamed in via a `provider`.\n */\n@customElement(`ixfx-detail-list`)\nexport class DetailListElement 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({ type: String })\n  sort: DetailSortMode = `none`;\n\n  @property({ type: String, attribute: `sort-by` })\n  sortBy = ``;\n\n  @property({ attribute: false })\n  sortComparator: DetailSortComparator | undefined;\n\n  @property({ attribute: false })\n  items: readonly unknown[] = [];\n\n  @property({ attribute: false })\n  provider: IDataProvider<void, unknown> | undefined;\n\n  @property({ type: String, attribute: `display-property` })\n  displayProperty = ``;\n\n  @property({ attribute: false })\n  formatter: DetailFormatter | undefined;\n\n  @property({ type: String, attribute: `icon-property` })\n  iconProperty = ``;\n\n  @property({ type: String, attribute: `key-property` })\n  keyProperty = ``;\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  /** Optional renderer for the checkbox shown in `checked` interactionMode. */\n  @property({ attribute: false })\n  checkboxRenderer: ((checked: boolean) => unknown) | CustomCheckboxOptions | undefined;\n\n  @state() private _searchVisible = false;\n  @state() private _searchQuery = ``;\n\n  @query(`.search-input`)\n  private _searchInputEl!: HTMLInputElement;\n\n  @query(`ul`)\n  private _listEl!: HTMLUListElement;\n\n  #search: ElementIncrSearch | undefined;\n  #itemData = new WeakMap<HTMLLIElement, unknown>();\n  #grid: Element[][] = [];\n  #positions = new Map<Element, GridPosition>();\n  #geometryScheduled = false;\n  #resizeObserver: ResizeObserver | undefined;\n  #mutationObserver: MutationObserver | undefined;\n  /** Items that have already played (or been skipped for) their enter animation. */\n  #animatedItems = new WeakSet<Element>();\n  #builtFromProvider: readonly unknown[] = [];\n  #providerBuilt = 0;\n\n  readonly #data = new DataController<void, unknown>(this);\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  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    this.addEventListener(`wheel`, this._onWheel);\n\n    this.#resizeObserver = new ResizeObserver(() => this.#scheduleGeometry());\n    this.#resizeObserver.observe(this);\n    this.#mutationObserver = new MutationObserver((records) => {\n      this.#processChildren();\n      this.#animateChildMutations(records);\n      this.#scheduleGeometry();\n    });\n    this.#mutationObserver.observe(this, {\n      childList: true,\n      subtree: false,\n      attributeFilter: [`hidden`],\n    });\n    for (const el of this.querySelectorAll(ITEM_SELECTOR))\n      this.#animatedItems.add(el);\n  }\n\n  /**\n   * Collapse-in items appended to the light DOM (however they got there). A bulk\n   * populate is left alone. Geometry is re-read once the animations settle so\n   * keyboard navigation lines back up with the final layout.\n   */\n  #animateChildMutations(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        // ITEM_SELECTOR is `:scope > li`, which can't be used with `.matches()`\n        // — every item here is a direct `<li>` child, so check that directly.\n        if (!(node instanceof HTMLElement) || node.parentElement !== this || node.localName !== `li`)\n          continue;\n        if (this.#animatedItems.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\n    for (const el of fresh)\n      animateListItemIn(el);\n    window.setTimeout(() => this.#scheduleGeometry(), LIST_ITEM_MOTION_MS + 30);\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.removeEventListener(`wheel`, this._onWheel);\n    this.#resizeObserver?.disconnect();\n    this.#resizeObserver = undefined;\n    this.#mutationObserver?.disconnect();\n    this.#mutationObserver = undefined;\n    this.#search?.dispose();\n    this.#search = undefined;\n  }\n\n  override firstUpdated(): void {\n    this.#processChildren();\n    if (this.filterPredicate) {\n      this.#applyFilterPredicate();\n    }\n    this.#search = createElementIncrSearch({\n      container: this,\n      itemSelector: ITEM_SELECTOR,\n      getLabel: el => el.getAttribute(`data-search-label`) ?? el.textContent?.trim() ?? ``,\n      getKey: el =>\n        el.getAttribute(`data-key`)\n        ?? el.getAttribute(`data-search-label`)\n        ?? el.textContent?.trim()\n        ?? ``,\n      highlightKey: SEARCH_HIGHLIGHT_KEY,\n    });\n    this.#recomputeGeometry();\n  }\n\n  override updated(changed: PropertyValues): void {\n    super.updated(changed);\n    if (changed.has(`provider`)) {\n      this.#builtFromProvider = [];\n      this.#providerBuilt = 0;\n      this.#data.provider = this.provider;\n      queueMicrotask(() => {\n        if (this.provider)\n          this.#data.request(undefined);\n      });\n      return;\n    }\n    if (changed.has(`items`) && this.provider === undefined && this.items.length > 0) {\n      this.#rebuildFromObjects(this.items);\n    }\n    this.#syncFromProvider();\n    if (changed.has(`sort`) || changed.has(`sortBy`) || changed.has(`sortComparator`)) {\n      this.#applySort();\n    }\n    if (changed.has(`filterPredicate`)) {\n      this.#applyFilterPredicate();\n      this.#scheduleGeometry();\n    }\n    if (changed.has(`interactionMode`)) {\n      this.selection.clearAnchor();\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  /**\n   * Force an immediate geometry recompute. Called automatically on resize,\n   * DOM changes, sort/filter/search changes — only needed when layout is\n   * changed by outside forces (e.g. an external font load).\n   */\n  refreshLayout(): void {\n    this.#recomputeGeometry();\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      this._setLabel(li, item);\n      el = li;\n    } else {\n      el = item;\n    }\n    if (options?.notChecked)\n      el.setAttribute(`not-checked`, ``);\n    this.appendChild(el);\n    this.#ensureIcon(el as HTMLLIElement);\n    if (this.sort !== `none`)\n      this.#applySort();\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Collapse + fade `item` out, then detach it; the rows after it slide up to\n   * close the gap. Resolves once removed. Immediate under reduced motion.\n   */\n  removeItem(item: Element): Promise<void> {\n    this.selection.deselect(item);\n    return animateListItemOut(item as HTMLElement).then(() => {\n      item.remove();\n      if (this.interactionMode === `checked`)\n        this._syncCheckboxes();\n      this.#recomputeGeometry();\n    });\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.replaceChildren();\n    this.selection.reset();\n    this.#builtFromProvider = [];\n    this.#providerBuilt = 0;\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   */\n  setItems(items: readonly Element[]): void {\n    this.clearItems();\n    for (const item of items) {\n      this.appendChild(item);\n      this.#ensureIcon(item as HTMLLIElement);\n    }\n    if (this.sort !== `none`)\n      this.#applySort();\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n  }\n\n  /**\n   * Get the source object behind an `<li>` built from an `items` array or\n   * provider. Returns `undefined` for declarative / programmatic elements.\n   */\n  getItemData(item: HTMLLIElement): unknown {\n    return this.#itemData.get(item);\n  }\n\n  /** Dispatch a command to this list. No-op by default (grouped-lister parity). */\n  dispatch(_commandId: CommandId, _args?: Record<string, unknown>): void {}\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 (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 ((el as HTMLElement).hidden)\n        continue;\n      if (wanted(el))\n        yield el;\n    }\n  }\n\n  // --- Object items ---\n\n  #rebuildFromObjects(items: readonly unknown[]): void {\n    const keyOf = (el: Element): string | null =>\n      el.getAttribute(`data-key`) ?? el.getAttribute(`data-search-label`) ?? null;\n    const previousKeys = new Set(\n      [...this.selection.selected].map(keyOf).filter((k): k is string => k !== null),\n    );\n    const anchorKey = this.selection.anchor ? keyOf(this.selection.anchor) : null;\n\n    this.replaceChildren(...items.map((item, index) => this.#createItemEl(item, index)));\n\n    // Re-select by key so selection survives the element-reference rebuild\n    if (previousKeys.size > 0 || anchorKey !== null) {\n      const next: Element[] = [];\n      let anchor: Element | undefined;\n      for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n        const key = keyOf(el);\n        if (key !== null && previousKeys.has(key))\n          next.push(el);\n        if (key !== null && key === anchorKey)\n          anchor = el;\n      }\n      this.selection.seed(next, anchor);\n    }\n\n    if (this.sort !== `none`)\n      this.#applySort();\n    if (this.interactionMode === `checked`)\n      this._syncCheckboxes();\n    this._syncItemStates();\n    this.#scheduleGeometry();\n  }\n\n  #createItemEl(item: unknown, index: number): HTMLLIElement {\n    const li = document.createElement(`li`);\n    this.#itemData.set(li, item);\n\n    const content = this.formatter\n      ? this.formatter(item, index)\n      : (this.displayProperty\n          ? this.#propertyValue(item, this.displayProperty)\n          : item);\n    if (typeof content === `string`) {\n      this._setLabel(li, content);\n      if (this.iconProperty) {\n        const icon = this.#propertyValue(item, this.iconProperty);\n        if (typeof icon === `string` && icon.length > 0)\n          li.setAttribute(`data-icon`, icon);\n      }\n    } else if (content instanceof Node) {\n      li.appendChild(content);\n    }\n\n    if (this.keyProperty) {\n      const key = this.#propertyValue(item, this.keyProperty);\n      if (key !== undefined && key !== null)\n        li.setAttribute(`data-key`, String(key));\n    }\n    this.#ensureIcon(li);\n    return li;\n  }\n\n  #propertyValue(item: unknown, prop: string): unknown {\n    if (typeof item !== `object` || item === null || !(prop in item))\n      return undefined;\n    return (item as Record<string, unknown>)[prop];\n  }\n\n  // --- Provider (async) items ---\n\n  #syncFromProvider(): void {\n    if (this.provider === undefined)\n      return;\n    const items = this.#data.items;\n    if (items === this.#builtFromProvider)\n      return;\n\n    // Longest common prefix by identity — pure appends extend the columns,\n    // anything else rebuilds.\n    let prefix = 0;\n    while (\n      prefix < this.#builtFromProvider.length\n      && prefix < items.length\n      && this.#builtFromProvider[prefix] === items[prefix]\n    ) {\n      prefix++;\n    }\n\n    if (prefix === this.#builtFromProvider.length && prefix <= items.length) {\n      const tail = items.slice(prefix);\n      for (const item of tail) {\n        this.appendChild(this.#createItemEl(item, this.#providerBuilt++));\n      }\n      if (this.sort !== `none`)\n        this.#applySort();\n      if (this.interactionMode === `checked`)\n        this._syncCheckboxes();\n      this._syncItemStates();\n      this.#scheduleGeometry();\n    } else {\n      this.#providerBuilt = 0;\n      this.#rebuildFromObjects(items);\n    }\n    this.#builtFromProvider = items;\n  }\n\n  // --- Filtering ---\n\n  #applyFilterPredicate(): void {\n    if (!this.filterPredicate) {\n      for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n        el.removeAttribute(`hidden`);\n      }\n      return;\n    }\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      if (this.filterPredicate(el)) {\n        el.removeAttribute(`hidden`);\n      } else {\n        el.setAttribute(`hidden`, ``);\n      }\n    }\n  }\n\n  // --- Sorting ---\n\n  #applySort(): void {\n    if (this.sort === `none`)\n      return;\n    const rows = [...this.querySelectorAll(ITEM_SELECTOR)] as HTMLLIElement[];\n    if (rows.length < 2)\n      return;\n\n    const dir = this.sort === `descending` ? -1 : 1;\n    const meta = (el: HTMLLIElement): DetailSortItem => ({\n      element: el,\n      data: this.getItemData(el),\n      label: el.getAttribute(`data-search-label`) ?? el.textContent?.trim() ?? ``,\n    });\n\n    let cmp: (a: HTMLLIElement, b: HTMLLIElement) => number;\n    if (this.sortComparator) {\n      const user = this.sortComparator;\n      cmp = (a, b) => user(meta(a), meta(b));\n    } else if (this.sortBy) {\n      const prop = this.sortBy;\n      const key = (el: HTMLLIElement): string | number => {\n        const v = this.#propertyValue(this.getItemData(el), prop);\n        if (typeof v === `number`)\n          return v;\n        return v === undefined || v === null ? `` : String(v);\n      };\n      cmp = (a, b) => {\n        const ka = key(a);\n        const kb = key(b);\n        if (typeof ka === `number` && typeof kb === `number`)\n          return ka - kb;\n        return String(ka).localeCompare(String(kb), undefined, { numeric: true });\n      };\n    } else {\n      cmp = (a, b) =>\n        meta(a).label.localeCompare(meta(b).label, undefined, { numeric: true });\n    }\n\n    const indexed = rows.map((el, i) => ({ el, i }));\n    indexed.sort((a, b) => cmp(a.el, b.el) * dir || a.i - b.i); // stable\n    for (const { el } of indexed)\n      this.appendChild(el); // moving reorders in place\n    this.#scheduleGeometry();\n  }\n\n  // --- Geometry (measured grid) ---\n\n  #scheduleGeometry(): void {\n    if (this.#geometryScheduled)\n      return;\n    this.#geometryScheduled = true;\n    requestAnimationFrame(() => {\n      this.#geometryScheduled = false;\n      this.#recomputeGeometry();\n    });\n  }\n\n  #recomputeGeometry(): void {\n    this.#grid = [];\n    this.#positions.clear();\n    if (!this.isConnected)\n      return;\n\n    const columns: Array<{ left: number; items: Element[] }> = [];\n    for (const el of this._getVisibleItems()) {\n      const rect = el.getBoundingClientRect();\n      if (rect.width === 0 && rect.height === 0)\n        continue;\n      let ci = columns.findIndex(c => Math.abs(c.left - rect.left) <= 1);\n      if (ci === -1) {\n        columns.push({ left: rect.left, items: [] });\n        ci = columns.length - 1;\n      }\n      columns[ci].items.push(el);\n    }\n    columns.sort((a, b) => a.left - b.left);\n    for (const col of columns)\n      col.items.sort((a, b) => a.getBoundingClientRect().top - b.getBoundingClientRect().top);\n\n    this.#grid = columns.map(c => c.items);\n    this.#grid.forEach((col, colIdx) =>\n      col.forEach((el, rowIdx) => this.#positions.set(el, { col: colIdx, row: rowIdx })),\n    );\n  }\n\n  #positionOf(el: Element): GridPosition | undefined {\n    let pos = this.#positions.get(el);\n    if (pos === undefined) {\n      this.#recomputeGeometry();\n      pos = this.#positions.get(el);\n    }\n    return pos;\n  }\n\n  #itemAt(col: number, row: number): Element | undefined {\n    return this.#grid[col]?.[row];\n  }\n\n  #gridSize(): { cols: number; rows: number } {\n    if (this.#grid.length === 0)\n      this.#recomputeGeometry();\n    return { cols: this.#grid.length, rows: Math.max(0, ...this.#grid.map(c => c.length)) };\n  }\n\n  // --- Keyboard navigation ---\n\n  #navigateTo(target: Element | undefined): void {\n    if (!target)\n      return;\n    this.tickled.handleKeyboardNavigation(target);\n    this.tickled.tickledId?.scrollIntoView({ block: `nearest`, inline: `nearest` });\n  }\n\n  #findNextCheckable(fromCol: number, fromRow: number, deltaCol: number, deltaRow: number): Element | undefined {\n    const { cols } = this.#gridSize();\n    const visibleItems = this._getVisibleItems();\n    const maxIterations = visibleItems.length + 1;\n\n    // Start from the next position\n    // For horizontal nav: move to next column first, keep same row\n    // For vertical nav: stay in same column, move row\n    // For diagonal nav: both change\n    let col = deltaCol !== 0 ? fromCol + deltaCol : fromCol;\n    let row = deltaRow !== 0 ? fromRow + deltaRow : fromRow;\n\n    // Track whether we've tried wrapping columns\n    let wrappedColumns = false;\n\n    for (let iterations = 0; iterations < maxIterations; iterations++) {\n      // Check bounds\n      const colLength = this.#grid[col]?.length ?? 0;\n\n      if (row < 0 || row >= colLength) {\n        // Need to move to another column\n        if (deltaCol !== 0 || wrappedColumns) {\n          // Already tried wrapping, or horizontal nav - stop or wrap\n          if (this.itemWrap === `wrap`) {\n            // Simple wrap: if deltaCol < 0, go to last column; if deltaCol > 0, go to first\n            if (deltaCol < 0) {\n              col = cols - 1;\n            } else if (deltaCol > 0) {\n              col = 0;\n            }\n            wrappedColumns = true;\n          } else {\n            return undefined;\n          }\n        }\n\n        // Try next/prev column\n        if (deltaRow > 0) {\n          // Going down - try next column at row 0\n          if (col + 1 < cols) {\n            col = col + 1;\n            row = 0;\n            wrappedColumns = true;\n          } else if (this.itemWrap === `wrap`) {\n            col = 0;\n            row = 0;\n            wrappedColumns = true;\n          } else {\n            return undefined;\n          }\n        } else if (deltaRow < 0) {\n          // Going up - try prev column at last row\n          if (col - 1 >= 0) {\n            col = col - 1;\n            row = (this.#grid[col]?.length ?? 1) - 1;\n            wrappedColumns = true;\n          } else if (this.itemWrap === `wrap`) {\n            col = cols - 1;\n            row = (this.#grid[col]?.length ?? 1) - 1;\n            wrappedColumns = true;\n          } else {\n            return undefined;\n          }\n        } else if (deltaCol !== 0) {\n          // Horizontal navigation - adjust row if target column is shorter\n          const targetColLength = this.#grid[col]?.length ?? 0;\n          if (row >= targetColLength && targetColLength > 0) {\n            row = targetColLength - 1;\n          }\n        }\n\n        // If we're now at same position as start, we've looped\n        if (col === fromCol && row === fromRow + deltaRow) {\n          return undefined;\n        }\n        continue;\n      }\n\n      const item = this.#itemAt(col, row);\n      if (item && this._isCheckable(item)) {\n        return item;\n      }\n\n      // Move to next position\n      row += deltaRow;\n    }\n\n    return undefined;\n  }\n\n  #findFirstCheckable(): Element | undefined {\n    const visibleItems = this._getVisibleItems();\n    return visibleItems.find(item => this._isCheckable(item));\n  }\n\n  #findLastCheckable(): Element | undefined {\n    const visibleItems = this._getVisibleItems();\n    for (let i = visibleItems.length - 1; i >= 0; i--) {\n      if (this._isCheckable(visibleItems[i])) {\n        return visibleItems[i];\n      }\n    }\n    return undefined;\n  }\n\n  #navigateDown(): void {\n    this.#recomputeGeometry();\n    const cur = this.tickled.tickledId ? this.#positionOf(this.tickled.tickledId) : undefined;\n    if (!cur) {\n      this.#navigateTo(this.#findFirstCheckable());\n      return;\n    }\n    const next = this.#findNextCheckable(cur.col, cur.row, 0, 1);\n    if (next) {\n      this.#navigateTo(next);\n    }\n  }\n\n  #navigateUp(): void {\n    this.#recomputeGeometry();\n    const cur = this.tickled.tickledId ? this.#positionOf(this.tickled.tickledId) : undefined;\n    if (!cur) {\n      this.#navigateTo(this.#findLastCheckable());\n      return;\n    }\n    const next = this.#findNextCheckable(cur.col, cur.row, 0, -1);\n    if (next) {\n      this.#navigateTo(next);\n    }\n  }\n\n  #navigateRight(): void {\n    this.#recomputeGeometry();\n    const cur = this.tickled.tickledId ? this.#positionOf(this.tickled.tickledId) : undefined;\n    if (!cur) {\n      this.#navigateTo(this.#findFirstCheckable());\n      return;\n    }\n    const next = this.#findNextCheckable(cur.col, cur.row, 1, 0);\n    if (next) {\n      this.#navigateTo(next);\n    } else if (this.itemWrap === `wrap`) {\n      this.#navigateTo(this.#findFirstCheckable());\n    }\n  }\n\n  #navigateLeft(): void {\n    this.#recomputeGeometry();\n    const cur = this.tickled.tickledId ? this.#positionOf(this.tickled.tickledId) : undefined;\n    if (!cur) {\n      this.#navigateTo(this.#findFirstCheckable());\n      return;\n    }\n    const next = this.#findNextCheckable(cur.col, cur.row, -1, 0);\n    if (next) {\n      this.#navigateTo(next);\n    } else if (this.itemWrap === `wrap`) {\n      this.#navigateTo(this.#findLastCheckable());\n    }\n  }\n\n  // --- Helpers ---\n\n  private _getVisibleItems(): Element[] {\n    return Array.from(this.querySelectorAll(ITEM_SELECTOR)).filter((el) => {\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  /**\n   * Set the column width to fit the widest visible item.\n   *\n   * This is opt-in; detail lists continue to use `--detail-list-column-width`\n   * (or its 220px fallback) until this method is called. The measured value is\n   * set directly on this element, so it takes precedence over an inherited\n   * value. Returns the applied width in pixels, or 0 when there are no items.\n   */\n  async fitColumnWidth(): Promise<number> {\n    await this.updateComplete;\n\n    const items = this._getVisibleItems();\n    if (items.length === 0)\n      return 0;\n\n    const previousWidth = this.style.getPropertyValue(`--detail-list-column-width`);\n    const previousPriority = this.style.getPropertyPriority(`--detail-list-column-width`);\n    this.style.setProperty(`--detail-list-column-width`, `max-content`);\n\n    // Reading the layout forces the temporary max-content width to resolve.\n    const width = Math.ceil(Math.max(...items.map(item => item.getBoundingClientRect().width)));\n\n    if (previousWidth) {\n      this.style.setProperty(`--detail-list-column-width`, previousWidth, previousPriority);\n    } else {\n      this.style.removeProperty(`--detail-list-column-width`);\n    }\n    this.style.setProperty(`--detail-list-column-width`, `${width}px`);\n    this.#scheduleGeometry();\n    return width;\n  }\n\n  private _isCheckable(item: Element): boolean {\n    if (this.interactionMode !== `checked`)\n      return true;\n    return !item.hasAttribute(`not-checked`);\n  }\n\n  private _setLabel(li: HTMLLIElement, label: string): void {\n    const span = document.createElement(`span`);\n    span.style.cssText = LABEL_SPAN_CSS;\n    span.textContent = label;\n    li.appendChild(span);\n    li.setAttribute(`data-search-label`, label);\n  }\n\n  /**\n   * Inject a leading `<ixfx-icon>` into an item carrying `data-icon`.\n   * Idempotent — skips when the item already starts with an icon.\n   */\n  #ensureIcon(li: HTMLLIElement): void {\n    const name = li.getAttribute(`data-icon`);\n    if (!name)\n      return;\n    if (li.firstElementChild?.tagName === `IXFX-ICON`)\n      return;\n    const icon = document.createElement(`ixfx-icon`);\n    icon.setAttribute(`name`, name);\n    icon.style.marginInlineEnd = `var(--detail-list-icon-gap, 6px)`;\n    icon.style.flexShrink = `0`;\n    li.prepend(icon);\n  }\n\n  /** Scan light-DOM children for unprocessed `data-icon` items. */\n  #processChildren(): void {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\n      this.#ensureIcon(el as HTMLLIElement);\n    }\n  }\n\n  private _syncItemStates(): void {\n    for (const el of this.querySelectorAll(ITEM_SELECTOR)) {\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(\n          `data-checked`,\n          !el.hasAttribute(`not-checked`) && this.selection.selected.has(el),\n        );\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    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      if (el.hasAttribute(`not-checked`)) {\n        if (existing)\n          existing.remove();\n        continue;\n      }\n\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  /** Custom checkbox cell: same shape as the native cell; renderer content inside. */\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(`li`))\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  private _openSearch(): void {\n    this._searchVisible = true;\n    void this.updateComplete.then(() => this._searchInputEl?.focus());\n  }\n\n  private _closeSearch(): void {\n    this._searchVisible = false;\n    this._searchQuery = ``;\n    void this.#search?.clearQuery().then(() => this.#recomputeGeometry());\n    this.focus();\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 ((e.ctrlKey || e.metaKey) && e.key === `f`) {\n      e.preventDefault();\n      this._openSearch();\n      return;\n    }\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    // When search is visible, handle Up/Down/Space for list navigation\n    // even when search input has focus\n    if (this._searchVisible && e.key === `Escape`) {\n      e.preventDefault();\n      this._closeSearch();\n      return;\n    }\n\n    switch (e.key) {\n      case `ArrowDown`: {\n        e.preventDefault();\n        this.#navigateDown();\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.#navigateUp();\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 `ArrowRight`: {\n        e.preventDefault();\n        this.#navigateRight();\n        break;\n      }\n      case `ArrowLeft`: {\n        e.preventDefault();\n        this.#navigateLeft();\n        break;\n      }\n      case `Home`: {\n        e.preventDefault();\n        this.#navigateTo(this.#findFirstCheckable());\n        break;\n      }\n      case `End`: {\n        e.preventDefault();\n        this.#navigateTo(this.#findLastCheckable());\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.focus();\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 _onWheel = (e: WheelEvent): void => {\n    e.preventDefault();\n    this._listEl.scrollLeft += e.deltaY;\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  private _onSearchInput = (e: Event): void => {\n    const input = e.target as HTMLInputElement;\n    this._searchQuery = input.value;\n    void this.#search?.setQuery(this._searchQuery).then(() => this.#recomputeGeometry());\n  };\n\n  private _onSearchKeydown = (e: KeyboardEvent): void => {\n    if (e.key === `Escape`) {\n      e.stopPropagation();\n      this._closeSearch();\n    } else if (e.key === `ArrowDown`) {\n      e.preventDefault();\n      // Move focus to the list host, then navigate\n      (this as HTMLElement).focus();\n      this.#navigateDown();\n    } else if (e.key === `ArrowUp`) {\n      e.preventDefault();\n      // Move focus to the list host, then navigate\n      (this as HTMLElement).focus();\n      this.#navigateUp();\n    } else if (e.key === `ArrowRight`) {\n      e.preventDefault();\n      // Let Right/Left pass through for cursor movement in search\n    } else if (e.key === `ArrowLeft`) {\n      e.preventDefault();\n      // Let Right/Left pass through for cursor movement in search\n    } else if (e.key === `Enter`) {\n      e.preventDefault();\n      e.stopPropagation();\n      const id = this.tickled.tickledId ?? this.#findFirstCheckable();\n      if (id) {\n        this._dispatch<ListItemClickDetail>(`list-item-click`, { item: id });\n        this._activateItem(id);\n        this._closeSearch();\n      }\n    } else if (e.key === ` `) {\n      // Space toggles selection - only if there's a tickled item\n      const id = this.tickled.tickledId;\n      if (id) {\n        e.preventDefault();\n        this.selection.handleSpace(id);\n      }\n      // Otherwise let Space pass through for search input\n    }\n  };\n\n  // --- Styles ---\n\n  static override styles = [themeFallbacks, scrollFadeStyles(`x`), css`\n    :host {\n      display: block;\n      position: relative;\n      background: var(--detail-list-bg, var(--surface-3));\n      color: var(--detail-list-text, var(--surface-3-text));\n      border-radius: var(--detail-list-radius, var(--radius-s));\n      border: 1px solid var(--detail-list-border, var(--border));\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n      box-sizing: border-box;\n      outline: none;\n      --_detail-list-item-padding:\n        var(--ixfx-detail-list-item-padding, var(--detail-list-item-padding, 0 var(--space-xs, 3px)));\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      /* keep the last column clear of the scrollbar / right edge */\n      padding-inline-end: calc(var(--detail-list-column-gap, 8px) + 4px);\n      width: 100%;\n      height: 100%;\n      display: flex;\n      flex-flow: column wrap;\n      align-content: flex-start;\n      column-gap: var(--detail-list-column-gap, 8px);\n      overflow-x: auto;\n      overflow-y: hidden;\n      box-sizing: border-box;\n      /* Scrollbar theming: consumers override these CSS variables to control\n         the native scrollbar (scrollbar-width, scrollbar-gutter, scrollbar-color). */\n      scrollbar-width: var(--detail-list-scrollbar-width, auto);\n      scrollbar-gutter: var(--detail-list-scrollbar-gutter, auto);\n      scrollbar-color: var(--detail-list-scrollbar-color, auto);\n    }\n\n    ::slotted([hidden]) {\n      display: none !important;\n    }\n\n    ::slotted(li) {\n      box-sizing: border-box;\n      display: flex;\n      align-items: center;\n      flex: none;\n      width: var(--detail-list-column-width, 220px);\n      height: var(--detail-list-item-height, 28px);\n      padding: var(--_detail-list-item-padding);\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      cursor: default;\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: the injected checkbox communicates selection — suppress bg */\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    .loading {\n      position: absolute;\n      bottom: 8px;\n      right: 8px;\n      z-index: 10;\n      background: var(--surface-4, #2a2a2a);\n      border: 1px solid var(--border, #444);\n      border-radius: var(--radius-m, 4px);\n      padding: 2px 8px;\n      font-size: var(--text-s, 11px);\n      color: var(--surface-muted-text, #888);\n    }\n\n    .loading[hidden] {\n      display: none;\n    }\n\n    .search-overlay {\n      position: absolute;\n      top: 8px;\n      right: 8px;\n      z-index: 10;\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      background: var(--surface-4, #2a2a2a);\n      border: 1px solid var(--border, #444);\n      border-radius: var(--radius-m, 4px);\n      padding: 4px 6px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);\n    }\n\n    .search-overlay[hidden] {\n      display: none;\n    }\n\n    .search-input {\n      background: transparent;\n      border: none;\n      outline: none;\n      color: inherit;\n      font-size: var(--text-m, 0.875em);\n      min-width: 140px;\n    }\n\n    .search-close {\n      background: transparent;\n      border: none;\n      color: var(--surface-muted-text, #888);\n      cursor: pointer;\n      font-size: 1.1em;\n      line-height: 1;\n      padding: 0 2px;\n    }\n\n    .search-close:hover {\n      color: inherit;\n    }\n  `];\n\n  // --- Render ---\n\n  override render() {\n    const loading = this.#data.loading;\n    const progress = this.#data.progress;\n    return html`\n      <div class=\"container\">\n        <ul part=\"list\" class=\"scroll-fade-x\">\n          <slot></slot>\n        </ul>\n        <div class=\"loading\" part=\"loading\" ?hidden=${!loading}>\n          ${loading\n            ? (progress !== undefined ? `${Math.round(progress * 100)}%` : `loading…`)\n            : nothing}\n        </div>\n        <div\n          class=\"search-overlay\"\n          part=\"search-overlay\"\n          ?hidden=${!this._searchVisible}\n        >\n          <input\n            type=\"text\"\n            class=\"search-input\"\n            placeholder=\"Search…\"\n            .value=${this._searchQuery}\n            @input=${this._onSearchInput}\n            @keydown=${this._onSearchKeydown}\n          />\n          <button class=\"search-close\" @click=${this._closeSearch} title=\"Close search (Esc)\">×</button>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-detail-list': DetailListElement;\n  }\n\n  interface HTMLElementEventMap extends ListElementEventMap {}\n}\n"],"mappings":"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"}

package/dist/grid-list-B_orPsot.d.ts

@@ -0,0 +1,304 @@
+import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-B5ioL-dG.js";
+import { n as TickledController } from "./tickled-controller-Bn3YdQsM.js";
+import { LitElement, PropertyValues, html } from "lit";
+//#region src/grid-list/types.d.ts
+/**
+ * How the caption relates to the cell's content.
+ * - `hidden`: no caption is rendered.
+ * - `separate`: content sits in a square; the caption is a detached label
+ *   below it. Square and caption are highlighted separately, like macOS
+ *   Finder icon view.
+ * - `under` (default): the whole cell is one box — content on top, caption in
+ *   its own strip below it, inside the same box. One selection outline.
+ * - `overlaid`: the caption floats on top of the content (see
+ *   `GridListCaptionPosition` / `GridListCaptionBackdrop`).
+ */
+type GridListCaptionStyle = `hidden` | `separate` | `under` | `overlaid`;
+/** Horizontal alignment of caption text (`middle` is the default). */
+type GridListCaptionAlign = `left` | `middle` | `right`;
+/** Vertical placement of an `overlaid` caption (`bottom` is the default). */
+type GridListCaptionPosition = `top` | `middle` | `bottom`;
+/**
+ * Backdrop behind an `overlaid` caption.
+ * - `scrim` (default): flat translucent panel.
+ * - `gradient`: translucent gradient fading away from the caption edge.
+ * - `blur`: frosted / backdrop-blurred panel.
+ * - `none`: no panel — caption text only, with a shadow for legibility.
+ */
+type GridListCaptionBackdrop = `scrim` | `gradient` | `blur` | `none`;
+/**
+ * Layout / scroll direction.
+ * - `grid` (default): items wrap across as many columns as fit and the list
+ *   scrolls vertically.
+ * - `row`: a single row of items that scrolls horizontally.
+ * - `column`: a single column of items that scrolls vertically.
+ */
+type GridListOrientation = `grid` | `row` | `column`;
+interface GridListSelectDetail {
+  readonly selected: ReadonlySet<Element>;
+  readonly previous: ReadonlySet<Element>;
+  /** The selection as stable `data-key` / `data-value` strings. */
+  readonly selectedKeys: ReadonlySet<string>;
+}
+type GridListSelectEvent = CustomEvent<GridListSelectDetail>;
+interface GridListActivateDetail {
+  readonly item: Element;
+}
+type GridListActivateEvent = CustomEvent<GridListActivateDetail>;
+interface GridListItemClickDetail {
+  readonly item: Element;
+}
+type GridListItemClickEvent = CustomEvent<GridListItemClickDetail>;
+interface GridListTickleDetail {
+  readonly item: Element;
+}
+type GridListTickleEvent = CustomEvent<GridListTickleDetail>;
+interface GridListElementEventMap {
+  'list-select': GridListSelectEvent;
+  'list-activate': GridListActivateEvent;
+  'list-item-click': GridListItemClickEvent;
+  'list-tickle': GridListTickleEvent;
+}
+type GridListViewportChangeDetail = {
+  readonly visibleKeys: string[];
+};
+type GridListViewportChangeEvent = CustomEvent<GridListViewportChangeDetail>;
+interface GridListFullElementEventMap extends GridListElementEventMap {
+  'grid-list-viewport-change': GridListViewportChangeEvent;
+}
+//#endregion
+//#region src/interaction/list-selection-controller.d.ts
+/** Modifier state needed to route a click gesture per interaction mode. */
+type ListSelectionGesture = {
+  readonly ctrlKey: boolean;
+  readonly metaKey: boolean;
+  readonly shiftKey: boolean;
+};
+type ListSelectionModes = {
+  readonly selectionMode: ListSelectionMode;
+  readonly interactionMode: ListInteractionMode;
+};
+/**
+ * Configuration supplied by the host component.
+ *
+ * The controller owns selection *state* only — everything DOM- or
+ * component-specific is expressed through these callbacks.
+ */
+type ListSelectionControllerConfig<T> = {
+  /** Visible items in navigation order — used for range selection and select-all. */
+  readonly getOrderedItems: () => readonly T[];
+  /** Whether an item may join the selection (e.g. reject `not-checked` rows). */
+  readonly isSelectable: (item: T) => boolean;
+  /** Current modes; read on every gesture so property changes apply immediately. */
+  readonly getModes: () => ListSelectionModes;
+  /**
+   * Fired after every selection change. The host syncs DOM state
+   * (`data-selected` / `data-checked`), dispatches `list-select`, and
+   * requests an update.
+   */
+  readonly onChange: (selected: ReadonlySet<T>, previous: ReadonlySet<T>) => void;
+  /**
+   * Optional: derive a stable string key for an item. Enables `selectedKeys`
+   * and `selectKeys()`. When omitted, `selectedKeys` is always empty.
+   */
+  readonly getKey?: (item: T) => string | undefined;
+};
+/** Whether the interaction mode allows building a multi-item selection. */
+declare function isMultiMode(mode: ListInteractionMode): boolean;
+/**
+ * Generic selection state machine shared by list components.
+ *
+ * Owns the selected set plus the range-selection anchor, the selection
+ * primitives (`replace` / `toggle` / `rangeTo` / `clear` / `selectAll` /
+ * `selectMany` / `deselect`) and the per-interactionMode gesture routers
+ * (`handleClick` / `handleSpace`).
+ *
+ * Identity is generic: both `ixfx-vertical-list` and `ixfx-detail-list` use
+ * `ListSelectionController<Element>`.
+ *
+ * @example
+ * ```ts
+ * const selection = new ListSelectionController<Element>({
+ *   getOrderedItems: () => this.getVisibleItems(),
+ *   isSelectable: el => !el.hasAttribute(`not-checked`),
+ *   getModes: () => ({ selectionMode: this.selectionMode, interactionMode: this.interactionMode }),
+ *   onChange: (selected, previous) => {
+ *     this.syncItemStates();
+ *     this.dispatchEvent(new CustomEvent(`list-select`, { detail: { selected, previous } }));
+ *   },
+ * });
+ * ```
+ */
+declare class ListSelectionController<T> {
+  #private;
+  constructor(config: ListSelectionControllerConfig<T>);
+  /** The current selection set (read-only). */
+  get selected(): ReadonlySet<T>;
+  /**
+   * The current selection as stable string keys (read-only). Empty unless a
+   * `getKey` was supplied in config. Items whose `getKey` returns `undefined`
+   * are omitted.
+   */
+  get selectedKeys(): ReadonlySet<string>;
+  /** Anchor for range (shift) selection — the last plainly-selected item. */
+  get anchor(): T | undefined;
+  /** Whether "select all" (Cmd/Ctrl+A) is currently permitted. */
+  canSelectAll(): boolean;
+  /** Whether a multi-item selection can be built in the current modes. */
+  canSelectMultiple(): boolean;
+  /** Replace the entire selection with a single item; updates the anchor. */
+  replace(item: T): void;
+  /** Toggle a single item in/out of the selection without replacing it. Anchor unchanged. */
+  toggle(item: T): void;
+  /** Select the contiguous ordered range from the anchor to `item`. Anchor unchanged. */
+  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;
+  /**
+   * Replace the selection with many items at once. Requires
+   * `selectionMode="multiple"`, throws otherwise. Updates the anchor.
+   */
+  selectMany(items: 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.
+   */
+  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.
+   */
+  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.
+   */
+  removeKeys(keys: Iterable<string>, resolve: (key: string) => T | undefined): void;
+  /** Route a click on `item` according to the current interaction mode. */
+  handleClick(item: T, gesture: ListSelectionGesture): void;
+  /** Route a Space keypress on `item` according to the current interaction mode. */
+  handleSpace(item: T): void;
+  /** Drop the range-selection anchor (e.g. when the interaction mode changes). */
+  clearAnchor(): void;
+  /**
+   * Re-key the selection across an identity boundary — e.g. when items are
+   * wrapped/unwrapped and the selected Element references change. Silent:
+   * no `onChange` is fired.
+   */
+  remap(fn: (item: T) => T): void;
+  /**
+   * Hard reset: empty the selection and clear the anchor without firing
+   * `onChange` (e.g. when all items are removed).
+   */
+  reset(): void;
+  /**
+   * Replace the selection and anchor silently (no `onChange`). Used to
+   * re-key the selection when items are rebuilt from data — e.g. matching
+   * new elements to previously selected keys.
+   */
+  seed(items: Iterable<T>, anchor?: T): void;
+}
+//#endregion
+//#region src/grid-list/grid-list.d.ts
+declare class GridListElement extends LitElement {
+  #private;
+  static styles: import("lit").CSSResult[];
+  selectionMode: ListSelectionMode;
+  interactionMode: ListInteractionMode;
+  itemSize: number;
+  gap: number;
+  /**
+   * Layout / scroll direction.
+   * - `grid` (default): items wrap across as many columns as fit, scrolls vertically.
+   * - `row`: a single row of items, scrolls horizontally.
+   * - `column`: a single column of items, scrolls vertically.
+   */
+  orientation: GridListOrientation;
+  /**
+   * How the caption relates to the content — see {@link GridListCaptionStyle}.
+   * - `hidden`: no caption.
+   * - `separate`: detached label below the square, each highlighted on its own.
+   * - `under` (default): one box, content on top, caption strip below it inside.
+   * - `overlaid`: caption floats over the content.
+   */
+  captionStyle: GridListCaptionStyle;
+  /** Horizontal alignment of the caption text: `left`, `middle` (default), `right`. */
+  captionAlign: GridListCaptionAlign;
+  /** `overlaid` only — vertical placement: `top`, `middle`, `bottom` (default). */
+  captionPosition: GridListCaptionPosition;
+  /** `overlaid` only — backdrop behind the caption: `scrim` (default), `gradient`, `blur`, `none`. */
+  captionBackdrop: GridListCaptionBackdrop;
+  /**
+   * Height reserved for the caption in `separate` / `under` styles, in pixels.
+   * Ignored by `overlaid` and `hidden`.
+   */
+  captionHeight: number;
+  itemWrap: `stop` | `wrap`;
+  private _scrollTop;
+  private _scrollLeft;
+  private _viewportHeight;
+  private _viewportWidth;
+  readonly selection: ListSelectionController<Element>;
+  readonly tickled: TickledController<Element>;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  protected firstUpdated(): void;
+  protected willUpdate(changed: PropertyValues<this>): void;
+  protected updated(changed: PropertyValues<this>): void;
+  private _getVisibleItems;
+  get count(): number;
+  /**
+   * Number of cells currently rendered in the shadow DOM. With virtualization
+   * this is roughly the visible rows plus overscan, regardless of how large
+   * `count` is — useful for demos/diagnostics.
+   */
+  get renderedCount(): number;
+  get selectedItems(): ReadonlySet<Element>;
+  /** The selection as stable `data-key` / `data-value` strings. */
+  get selectedKeys(): ReadonlySet<string>;
+  select(item: Element): void;
+  selectMany(items: Iterable<Element>): void;
+  deselect(item: Element): void;
+  clearSelection(): void;
+  selectAll(): void;
+  /**
+   * Replace the selection with the items carrying these keys. Unknown keys are
+   * ignored; survives the host rebuilding the item set. Requires each item to
+   * have a `data-key` (or `data-value`).
+   */
+  selectKeys(keys: Iterable<string>): void;
+  /** Add items by key to the selection (multi-select modes only). */
+  addSelectedKeys(keys: Iterable<string>): void;
+  /** Remove items by key from the selection. */
+  removeSelectedKeys(keys: Iterable<string>): void;
+  /** Move the cursor to the item with this key and scroll it into view. */
+  focusKey(key: string): void;
+  /** The key of the item under the cursor, or `undefined`. */
+  get tickledKey(): string | undefined;
+  getItem(key: string): Element | undefined;
+  getItemByIndex(index: number): Element | undefined;
+  getKey(item: Element): string | undefined;
+  visibleKeys(): string[];
+  private _syncItemStates;
+  private _dispatch;
+  protected render(): ReturnType<typeof html>;
+  private _onKeyDown;
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-grid-list': GridListElement;
+  }
+}
+interface GridListElement {
+  addEventListener<K extends keyof GridListFullElementEventMap>(type: K, listener: (this: GridListElement, ev: GridListFullElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+}
+//#endregion
+export { GridListViewportChangeEvent as C, GridListViewportChangeDetail as S, GridListOrientation as _, ListSelectionModes as a, GridListTickleDetail as b, GridListActivateEvent as c, GridListCaptionPosition as d, GridListCaptionStyle as f, GridListItemClickEvent as g, GridListItemClickDetail as h, ListSelectionGesture as i, GridListCaptionAlign as l, GridListFullElementEventMap as m, ListSelectionController as n, isMultiMode as o, GridListElementEventMap as p, ListSelectionControllerConfig as r, GridListActivateDetail as s, GridListElement as t, GridListCaptionBackdrop as u, GridListSelectDetail as v, GridListTickleEvent as x, GridListSelectEvent as y };
+//# sourceMappingURL=grid-list-B_orPsot.d.ts.map

package/dist/grid-list-B_orPsot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-list-B_orPsot.d.ts","names":[],"sources":["../src/grid-list/types.ts","../src/interaction/list-selection-controller.ts","../src/grid-list/grid-list.ts"],"mappings":";;;;;;;;;;;;;;;KA8BY;;KAGA;;KAGA;;;;;;;;KASA;;;;;;;;KASA;UAEK;WACN,UAAU,YAAY;WACtB,UAAU,YAAY;;WAEtB,cAAc;;KAGb,sBAAsB,YAAY;UAE7B;WACN,MAAM;;KAGL,wBAAwB,YAAY;UAE/B;WACN,MAAM;;KAGL,yBAAyB,YAAY;UAEhC;WACN,MAAM;;KAGL,sBAAsB,YAAY;UAE7B;EACf,eAAe;EACf,iBAAiB;EACjB,mBAAmB;EACnB,eAAe;;KAGL;WACD;;KAGC,8BAA8B,YAAY;UAErC,oCAAoC;EACnD,6BAA6B;;;;;KC9FnB;WACD;WACA;WACA;;KAGC;WACD,eAAe;WACf,iBAAiB;;;;;;;;KAShB,8BAA8B;;WAE/B,gCAAgC;;WAEhC,eAAe,MAAM;;WAErB,gBAAgB;;;;;;WAMhB,WAAW,UAAU,YAAY,IAAI,UAAU,YAAY;;;;;WAK3D,UAAU,MAAM;;;iBAIX,YAAY,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;cA4BrB,wBAAwB;;EAKvB,YAAA,QAAQ,8BAA8B;;MAK9C,YAAY,YAAY;;;;;;MASxB,gBAAgB;;MAehB,UAAU;;EAKd;;EAKA;;EAQA,QAAQ,MAAM;;EAUd,OAAO,MAAM;;EAoBb,QAAQ,MAAM;;EAoBd;;EAOA;;;;;EAcA,WAAW,OAAO,SAAS;;EAa3B,SAAS,MAAM;;;;;;;EA6Bf,WAAW,MAAM,kBAAkB,UAAU,gBAAgB;;;;;EAsB7D,QAAQ,MAAM,kBAAkB,UAAU,gBAAgB;;;;;EAqB1D,WAAW,MAAM,kBAAkB,UAAU,gBAAgB;;EAmB7D,YAAY,MAAM,GAAG,SAAS;;EAyC9B,YAAY,MAAM;;EAgBlB;;;;;;EASA,MAAM,KAAK,MAAM,MAAM;;;;;EAUvB;;;;;;EAUA,KAAK,OAAO,SAAS,IAAI,SAAS;;;;cCjOvB,wBAAwB;;SACnB,sBAAM;EA0PtB,eAAe;EAGf,iBAAiB;EAGjB;EAGA;;;;;;;EASA,aAAa;;;;;;;;EAUb,cAAc;;EAId,cAAc;;EAId,iBAAiB;;EAIjB,iBAAiB;;;;;EAOjB;EAGA;UAEiB;UACA;UACA;UACA;WAgCR,WAAS,wBAAA;WAkBT,SAAO,kBAAA;EAeP;EAsBA;YA8EU;YAiBA,WAAW,SAAS;YAiEpB,QAAQ,SAAS;UAgF5B;MAQJ;;;;;;MASA;MAIA,iBAAiB,YAAY;;MAK7B,gBAAgB;EAIpB,OAAO,MAAM;EAIb,WAAW,OAAO,SAAS;EAI3B,SAAS,MAAM;EAIf;EAIA;;;;;;EAWA,WAAW,MAAM;;EAKjB,gBAAgB,MAAM;;EAKtB,mBAAmB,MAAM;;EAKzB,SAAS;;MASL;EAKJ,QAAQ,cAAc;EAItB,eAAe,gBAAgB;EAI/B,OAAO,MAAM;EAIb;UA+CQ;UAQA;YAUW,UAAU,kBAAkB;UA8GvC;;QAsFF;YACI;IACR,kBAAkB;;;UAIL;EACf,iBAAiB,gBAAgB,6BAC/B,MAAM,GACN,WAAW,MAAM,iBAAiB,IAAI,4BAA4B,aAClE,oBAAoB;EAEtB,iBACE,cACA,UAAU,oCACV,oBAAoB"}

package/dist/grid-list.d.ts

@@ -0,0 +1,3 @@
+import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-B5ioL-dG.js";
+import { C as GridListViewportChangeEvent, S as GridListViewportChangeDetail, _ as GridListOrientation, b as GridListTickleDetail, c as GridListActivateEvent, d as GridListCaptionPosition, f as GridListCaptionStyle, g as GridListItemClickEvent, h as GridListItemClickDetail, l as GridListCaptionAlign, m as GridListFullElementEventMap, p as GridListElementEventMap, s as GridListActivateDetail, t as GridListElement, u as GridListCaptionBackdrop, v as GridListSelectDetail, x as GridListTickleEvent, y as GridListSelectEvent } from "./grid-list-B_orPsot.js";
+export { type GridListActivateDetail, type GridListActivateEvent, type GridListCaptionAlign, type GridListCaptionBackdrop, type GridListCaptionPosition, type GridListCaptionStyle, GridListElement, type GridListElementEventMap, type GridListFullElementEventMap, type GridListItemClickDetail, type GridListItemClickEvent, type GridListOrientation, type GridListSelectDetail, type GridListSelectEvent, type GridListTickleDetail, type GridListTickleEvent, type GridListViewportChangeDetail, type GridListViewportChangeEvent, type ListInteractionMode, type ListSelectionMode };