@ixfx/components 0.5.19 → 0.6.0

package/dist/vertical-list.d.ts

@@ -0,0 +1,122 @@
+import { a as ListItemClickDetail, c as ListSelectEvent, d as ListTickleEvent, i as ListInteractionMode, l as ListSelectionMode, n as ListActivateEvent, o as ListItemClickEvent, r as ListElementEventMap, s as ListSelectDetail, t as ListActivateDetail, u as ListTickleDetail } from "./types-DlVNJez_.js";
+import { LitElement, PropertyValues } from "lit";
+import { CommandId } from "@clinth/ui-commands";
+//#region src/vertical-list/vertical-list.d.ts
+interface CustomCheckboxOptions {
+  renderer: (checked: boolean) => unknown;
+  margin?: string;
+  width?: string;
+}
+interface AddItemOptions {
+  /**
+   * In `checked` interaction mode, adds the item without a checkbox column and
+   * without the ability to be checked/selected. Equivalent to setting the
+   * `not-checked` attribute on the item. Ignored outside `checked` mode.
+   */
+  notChecked?: boolean;
+}
+declare class VerticalListElement extends LitElement {
+  #private;
+  selectionMode: ListSelectionMode;
+  interactionMode: ListInteractionMode;
+  filterPredicate: ((el: Element) => boolean) | undefined;
+  /**
+   * Optional renderer for the checkbox shown in `checked` interactionMode.
+   * Receives the current `checked` state and returns a Lit template result.
+   *
+   * When set, the per-row checkbox becomes a `<span role="checkbox">` whose
+   * contents are whatever this returns (rendered with `lit`'s `render()`).
+   * When unset, a native `<input type="checkbox">` is used.
+   *
+   * @example
+   *   list.checkboxRenderer = (checked) => checked
+   *     ? html`<svg viewBox="0 0 16 16" width="14" height="14"
+   *           fill="none" stroke="currentColor" stroke-width="2"
+   *           stroke-linecap="round" stroke-linejoin="round"
+   *           style="opacity:0.5">
+   *         <polyline points="3,8 7,12 13,4" />
+   *       </svg>`
+   *     : html``;
+   */
+  checkboxRenderer: ((checked: boolean) => unknown) | CustomCheckboxOptions | undefined;
+  private _selectedItems;
+  private _searchVisible;
+  private _searchQuery;
+  private _searchInputEl;
+  private tickled;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  firstUpdated(): void;
+  updated(changed: PropertyValues): void;
+  /** The most recently selected item, or `undefined` if nothing is selected. */
+  get selectedItem(): Element | undefined;
+  /** The full current selection set (read-only). */
+  get selectedItems(): ReadonlySet<Element>;
+  addItem(item: Element | string, options?: AddItemOptions): void;
+  removeItem(item: Element): void;
+  clearItems(): void;
+  /**
+   * Replace the entire item list in one call.
+   * Equivalent to `clearItems()` followed by `addItem()` for each element.
+   * Preserves `interactionMode` checkbox wrapping.
+   */
+  setItems(items: readonly Element[]): void;
+  /**
+   * Dispatch a command to this list. No-op by default.
+   * Intended for use with `ixfx-grouped-item-lister`'s `dispatch()` method,
+   * which forwards commands to all sub-components.
+   */
+  dispatch(_commandId: CommandId, _args?: Record<string, unknown>): void;
+  select(item: Element): void;
+  selectMany(items: Iterable<Element>): void;
+  deselect(item: Element): void;
+  clearSelection(): void;
+  selectAll(): void;
+  selectedFilter(kind: `selected` | `checked` | `either`): Generator<Element>;
+  private _replaceSelection;
+  private _toggleItem;
+  private _rangeSelectTo;
+  private _clearSelection;
+  private _selectAll;
+  private _handleClickSelection;
+  private _handleSpaceKey;
+  private _getVisibleItems;
+  private _isCheckable;
+  private _syncItemStates;
+  private _syncCheckboxes;
+  /**
+   * Native checkbox cell: a span that stretches to the row's full cross-axis
+   * (so the entire column height is a click target) with a real `<input>`
+   * centred inside. The span owns the click; the input is purely visual and
+   * has `pointer-events:none` so a single click produces one toggle.
+   */
+  private _createNativeCheckboxCell;
+  /**
+   * Custom checkbox cell: same shape as the native cell (a stretching span)
+   * so behaviour is identical. The renderer's content goes inside.
+   */
+  private _createCustomCheckbox;
+  private _findListItem;
+  private _dispatch;
+  private _openSearch;
+  private _closeSearch;
+  private _onPointerOver;
+  private _onPointerLeave;
+  private _onKeyDown;
+  private _onClick;
+  private _onDblClick;
+  private _activateItem;
+  private _onSearchInput;
+  private _onSearchKeydown;
+  static styles: import("lit").CSSResult[];
+  render(): import("lit").TemplateResult<1>;
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-vertical-list': VerticalListElement;
+  }
+  interface HTMLElementEventMap extends ListElementEventMap {}
+}
+//#endregion
+export { AddItemOptions, CustomCheckboxOptions, type ListActivateDetail, type ListActivateEvent, type ListElementEventMap, type ListInteractionMode, type ListItemClickDetail, type ListItemClickEvent, type ListSelectDetail, type ListSelectEvent, type ListSelectionMode, type ListTickleDetail, type ListTickleEvent, VerticalListElement };
+//# sourceMappingURL=vertical-list.d.ts.map

package/dist/vertical-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vertical-list.d.ts","names":[],"sources":["../src/vertical-list/vertical-list.ts"],"mappings":";;;;UAiCiB;EACf,WAAW;EACX;EACA;;UAGe;;;;;;EAMf;;cAWW,4BAA4B;;EAEvC,eAAe;EAGf,iBAAiB;EAGjB,mBAAmB,IAAI;;;;;;;;;;;;;;;;;;;EAqBvB,oBAAoB,gCAAgC;UAEnC;UACA;UACA;UAGT;UAQA;EAUC;EAWA;EAWA;EAcA,QAAQ,SAAS;;MAoCtB,gBAAgB;;MAKhB,iBAAiB,YAAY;EAIjC,QAAQ,MAAM,kBAAkB,UAAU;EAgB1C,WAAW,MAAM;EAIjB;;;;;;EAaA,SAAS,gBAAgB;;;;;;EAczB,SAAS,YAAY,WAAW,QAAQ;EAExC,OAAO,MAAM;EAIb,WAAW,OAAO,SAAS;EAc3B,SAAS,MAAM;EAWf;EAIA;EAME,eAAe,0CAA0C,UAAU;UAsB7D;UAcA;UAwBA;UAuBA;UASA;UAeA;UA0CA;UAeA;UAgBA;UAOA;UAiBA;;;;;;;UA6FA;;;;;UAuBA;UAcA;UAYA;UAQA;UAKA;UASA;UAMA;UAIA;UA+DA;UAQA;UAMA;UAQA;UAMA;SAwBQ,sBAAM;EAoKb,wBAAM;;QA0BT;YACI;IACR,sBAAsB;;YAGd,4BAA4B"}