@ixfx/components 0.15.5 → 0.16.1

package/dist/ac-token.js

@@ -4,7 +4,7 @@ import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
 import "./icon-1gpwtPx8.js";
 import { t as DataController } from "./data-controller-DOlmqNKb.js";
-import { m as createAcCompletionProvider } from "./incr-search-JIhwB49y.js";
+import { m as createAcCompletionProvider } from "./incr-search-CgbL-OlS.js";
 import { LitElement, css, html, nothing } from "lit";
 import { property, state } from "lit/decorators.js";
 import { styleMap } from "lit/directives/style-map.js";

package/dist/crumb-navigation-BbqfmkYs.d.ts

@@ -0,0 +1,147 @@
+import { M as TreeDataModel, a as TreeComponent, j as TreeTickleEvent, k as TreeSelectEvent, n as TreeActivateEvent, o as TreeComponentEventMap, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-DgfkxmVY.js";
+import { n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-Jky6oNAp.js";
+import { a as ViewStateBase, t as GetViewStateOptions } from "./types-LU1u0CB8.js";
+import "./index-9ttcdwlL.js";
+import "./menu-item-bF6narIz.js";
+import "./index-o-CWDt11.js";
+import { LitElement, PropertyValues } from "lit";
+//#region src/crumbs/crumb-view-state.d.ts
+/**
+ * Pure view-state helpers for `ixfx-crumb-navigation` (also used by
+ * `ixfx-flat-list`, whose location is the same kind of key path).
+ * See docs/infra-view-state.md.
+ */
+/**
+ * `ixfx-crumb-navigation` view state. The location *is* the selection (one
+ * node), so it is stored once, as the key path that reaches it — a path, not
+ * a lone key, so a saved location deep in a lazy tree can be loaded down to.
+ */
+type CrumbNavigationViewState = ViewStateBase & {
+  /** Keys from the root (excluded) down to the current location. `[]` = the root. */
+  readonly path?: readonly string[];
+};
+//#endregion
+//#region src/crumbs/crumb-navigation.d.ts
+/** @deprecated Use TreeSelectDetail from src/common/tree-component.ts */
+type CrumbNavigationChangeDetail = {
+  readonly selected: TreeNode;
+  readonly previous: TreeNode | undefined;
+};
+type CrumbNavigationChangeEvent = CustomEvent<CrumbNavigationChangeDetail>;
+type CrumbNavigationItemClickDetail = {
+  node: TreeNode;
+  depth: number;
+};
+type CrumbNavigationItemClickEvent = CustomEvent<CrumbNavigationItemClickDetail>;
+type CrumbNavigationExpandDetail = {
+  node: TreeNode;
+  depth: number;
+};
+type CrumbNavigationExpandEvent = CustomEvent<CrumbNavigationExpandDetail>;
+/**
+ * Breadcrumb navigation with lazy-loading support.
+ *
+ * Uses the same `TreeNode` / `TreeItem` data model as `ixfx-tree-list`,
+ * so the two components can be swapped with minimal code changes.
+ *
+ * Events
+ * - `navigate`: fired when user clicks a breadcrumb label. detail: `{ node: TreeNode }`
+ * - `change`: fired when selected node changes. detail: `{ selected: TreeNode, previous: TreeNode | undefined }`
+ * - `expand`: fired when user clicks a caret whose node has no children yet.
+ *             detail: `{ node: TreeNode, depth: number, signal: AbortSignal }`
+ *             Populate `node.children` then call `requestUpdate()` on the element.
+ *
+ * CSS variables
+ * --crumb-item-bg: var(--item-bg, transparent); // item background
+ * --crumb-item-bg-tickled: var(--item-bg-tickled); // item background on hover
+ * --crumb-item-text-tickled: var(--item-text-tickled); // text color on hover
+ * --crumb-item-border: var(--item-border); // item border
+ * --crumb-item-border-tickled: var(--item-border-tickled); // border color on hover
+ * --crumb-item-padding: var(--item-padding, var(--space-xs)); // item padding
+ * --crumb-item-border-radius: var(--item-border-radius); // item border radius
+ * --crumb-item-gap: var(--item-gap, var(--space-xs)); // gap between items
+ * --crumb-separator: var(--surface-muted-text); // separator/caret color
+ * --crumb-truncate-min-width: 5ch; // minimum width for truncatable segments
+ */
+declare class CrumbNavigationElement extends LitElement implements TreeComponent {
+  #private;
+  root: TreeNode | undefined;
+  model: TreeDataModel | undefined;
+  selectedNode: TreeNode | undefined;
+  private _selectedNodes;
+  get selectedNodes(): ReadonlySet<TreeNode>;
+  /** Callback to lazily load children for a node. When set, replaces event-based lazy loading. */
+  loadChildren: LoadChildrenCallback | undefined;
+  filterPredicate: TreeFilterPredicate | undefined;
+  exclusivity: TreeExclusivity;
+  selectionFilter: TreeSelectionFilter;
+  private _openIdx;
+  private _isFocused;
+  private _menuOpen;
+  private _focusOnNarrowedText;
+  inputMode: string;
+  noTruncate: boolean;
+  showSuggestions: boolean;
+  leadingCaret: boolean;
+  caretEmbedded: boolean;
+  hideRoot: boolean;
+  padEnding: boolean;
+  withUp: boolean;
+  /**
+   * Whether restoring view state may call `loadChildren` to reach a saved
+   * location through unloaded branches (one load at a time). Default `true`.
+   */
+  restoreLoads: boolean;
+  private tickled;
+  select(node: TreeNode): void;
+  deselect(_node: TreeNode): void;
+  clearSelection(): void;
+  /** Not implemented on crumb-navigation. */
+  selectAll(): void;
+  /** Not implemented on crumb-navigation. */
+  deselectAll(): void;
+  getNodes(): ReadonlyArray<{
+    node: TreeNode;
+    depth: number;
+  }>;
+  /** Snapshot the location as a key path. Includes a saved location not reached yet. */
+  getViewState(options?: GetViewStateOptions<CrumbNavigationViewState>): CrumbNavigationViewState;
+  /**
+   * Go to a saved location. Keys not loaded yet are reached as they appear —
+   * via `loadChildren` when `restoreLoads` — moving through each loaded ancestor.
+   */
+  setViewState(state: Partial<CrumbNavigationViewState>): void;
+  clearPendingViewState(): void;
+  willUpdate(changedProps: PropertyValues): void;
+  updated(changedProps: PropertyValues): void;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  firstUpdated(): void;
+  /** Navigate to a node by key path. Returns false if any key is not found in already-loaded children. */
+  navigateTo(keys: readonly string[]): boolean;
+  /** Navigate to the first node matching the predicate. Returns false if not found. */
+  navigateToNode(predicate: (node: TreeNode) => boolean): boolean;
+  /** `TreeComponent` parity — a crumb path always follows the selection, so this just navigates to `key`. */
+  revealKey(key: string): boolean;
+  /** `TreeComponent` parity — a crumb path is a single selection, so only the last node is kept. */
+  selectMany(nodes: Iterable<TreeNode>): void;
+  render(): import("lit").TemplateResult<1>;
+  static styles: import("lit").CSSResult[];
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    "ixfx-crumb-navigation": CrumbNavigationElement;
+  }
+}
+interface CrumbNavigationElementEventMap extends TreeComponentEventMap {
+  'item-click': TreeItemClickEvent;
+  'expand': TreeExpandEvent;
+  'select': TreeSelectEvent;
+  'tickle': TreeTickleEvent;
+  'activate': TreeActivateEvent;
+}
+interface CrumbNavigationElement {
+  addEventListener: (<K extends keyof CrumbNavigationElementEventMap>(type: K, listener: (this: CrumbNavigationElement, event: CrumbNavigationElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+}
+//#endregion
+export { CrumbNavigationExpandDetail as a, CrumbNavigationItemClickEvent as c, CrumbNavigationElementEventMap as i, CrumbNavigationViewState as l, CrumbNavigationChangeEvent as n, CrumbNavigationExpandEvent as o, CrumbNavigationElement as r, CrumbNavigationItemClickDetail as s, CrumbNavigationChangeDetail as t };