@ixfx/components 0.12.0 → 0.13.1

package/dist/flat-list-DEDG6epz.d.ts

@@ -0,0 +1,181 @@
+import "./icon-DR_3rSyZ.js";
+import { k as TreeDataModel } from "./tree-component-Cj8V3uar.js";
+import { o as TreeNode, r as TreeFilterPredicate, t as LoadChildrenCallback } from "./types-DQ7KOUIj.js";
+import "./crumbs.js";
+import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
+import { r as VerticalListElement } from "./vertical-list-CqBc-t8w.js";
+import { LitElement, PropertyValues } from "lit";
+//#region src/flat-list/types.d.ts
+/** How branches and leaves are ordered within one level. */
+type FlatListBranchOrder = `first` | `mixed`;
+type FlatListNavigateDetail = {
+  /** Key path (excluding the root) of the level now shown. */
+  readonly path: readonly string[];
+  /** Key path of the level shown before. */
+  readonly previousPath: readonly string[];
+  /** The node whose children are now listed (the root when `path` is empty). */
+  readonly node: TreeNode;
+  /** `into` = descended, `up` = moved to an ancestor, `jump` = anything else (crumb, API). */
+  readonly direction: `into` | `up` | `jump`;
+};
+type FlatListSelectDetail = {
+  readonly selected: ReadonlySet<TreeNode>;
+  readonly selectedKeys: ReadonlySet<string>;
+  readonly previous: ReadonlySet<TreeNode>;
+};
+type FlatListActivateDetail = {
+  readonly node: TreeNode;
+};
+type FlatListDropDetail = {
+  /** The row dropped on — a branch is *not* entered — or the current level's node for empty space. */
+  readonly node: TreeNode;
+  readonly dataTransfer: DataTransfer;
+};
+type FlatListContextMenuDetail = {
+  /** The row the menu was requested on (already selected). */
+  readonly node: TreeNode;
+  /** The whole selection, `node` included. */
+  readonly nodes: readonly TreeNode[];
+  readonly x: number;
+  readonly y: number;
+};
+type FlatListEditCommitDetail = {
+  readonly node: TreeNode;
+  readonly value: string;
+};
+type FlatListEditCancelDetail = {
+  readonly node: TreeNode;
+};
+type FlatListNavigateEvent = CustomEvent<FlatListNavigateDetail>;
+type FlatListSelectEvent = CustomEvent<FlatListSelectDetail>;
+type FlatListActivateEvent = CustomEvent<FlatListActivateDetail>;
+type FlatListDropEvent = CustomEvent<FlatListDropDetail>;
+type FlatListContextMenuEvent = CustomEvent<FlatListContextMenuDetail>;
+type FlatListEditCommitEvent = CustomEvent<FlatListEditCommitDetail>;
+type FlatListEditCancelEvent = CustomEvent<FlatListEditCancelDetail>;
+interface FlatListElementEventMap {
+  'flat-list-navigate': FlatListNavigateEvent;
+  'flat-list-select': FlatListSelectEvent;
+  'flat-list-activate': FlatListActivateEvent;
+  'flat-list-drop': FlatListDropEvent;
+  'flat-list-context-menu': FlatListContextMenuEvent;
+  'flat-list-edit-commit': FlatListEditCommitEvent;
+  'flat-list-edit-cancel': FlatListEditCancelEvent;
+}
+//#endregion
+//#region src/flat-list/flat-list.d.ts
+/**
+ * Navigates a tree inside one flat list. Each level shows its branches and
+ * leaves together in an `ixfx-vertical-list`; entering a branch swaps the list
+ * for that branch's children, and an `ixfx-crumb-navigation` pinned above the
+ * scroll area shows the path and jumps back up.
+ *
+ * Uses the same `TreeNode` / `TreeDataModel` data as `ixfx-crumb-navigation`
+ * and `ixfx-tree-list`. As in crumb-navigation, lazily loaded children are
+ * written back to `node.children`.
+ *
+ * Selection and keyboard behaviour is the inner list's. On top of that:
+ * double-click / Enter / ArrowRight enter the cursor branch;
+ * ArrowLeft / Backspace go up. Selection is cleared on every level change.
+ *
+ * Events (all bubble, composed)
+ * - `flat-list-navigate`  `{ path, previousPath, node, direction }`
+ * - `flat-list-select`    `{ selected: Set<TreeNode>, selectedKeys, previous }`
+ * - `flat-list-activate`  `{ node }` — a leaf was double-clicked / Enter pressed
+ * The inner list's own `list-*` events also cross the shadow boundary.
+ *
+ * CSS variables (others, e.g. `--list-item-height`, pass through to the list)
+ * --flat-list-bg: var(--list-bg, var(--surface-3));
+ * --flat-list-text: var(--list-text, var(--surface-3-text));
+ * --flat-list-border: var(--list-border, var(--border));
+ * --flat-list-radius: var(--list-radius, var(--radius-s));
+ * --flat-list-crumb-padding: var(--space-xs);
+ * --flat-list-crumb-font-size: var(--text-s);
+ * --flat-list-chevron-gap: 0.4em; // space after the branch chevron
+ * --flat-list-marked-bg / --flat-list-marked-bar: the `marked-key` row
+ * --flat-list-empty-text: var(--surface-muted-text);
+ */
+declare class FlatListElement extends LitElement {
+  #private;
+  root: TreeNode | undefined;
+  model: TreeDataModel | undefined;
+  /** Keys from the root (excluded) to the level being shown. */
+  path: readonly string[];
+  /** Lazily loads a branch's children when `node.children` is `undefined`. */
+  loadChildren: LoadChildrenCallback | undefined;
+  filterPredicate: TreeFilterPredicate | undefined;
+  /** Orders nodes within the level (within each half when `branchOrder` is `first`). */
+  sort: ((a: TreeNode, b: TreeNode) => number) | undefined;
+  branchOrder: FlatListBranchOrder;
+  selectionMode: ListSelectionMode;
+  interactionMode: ListInteractionMode;
+  itemWrap: `stop` | `wrap`;
+  searchModes: string | undefined;
+  itemsDraggable: boolean;
+  /** Rows (and empty space) accept native drops. See `flat-list-drop`. */
+  itemsDroppable: boolean;
+  /**
+   * Refuse a drop before it is highlighted or reported. `node` is the row under
+   * the drag, or the current level's node over empty space.
+   */
+  canDrop: ((node: TreeNode, dataTransfer: DataTransfer) => boolean) | undefined;
+  /**
+   * Opt in to in-place rename. Called with the typed text and the node when
+   * the user commits; return `false` to reject it. Without it nothing can be
+   * renamed and rows are plain text. Rows must also have `item.editable`.
+   */
+  validateEdit: ((value: string, node: TreeNode) => boolean) | undefined;
+  /** Key of a node to keep visibly marked across level changes (unlike selection). */
+  markedKey: string | undefined;
+  /** Only render the visible rows. Needs `itemHeight`. See `ixfx-vertical-list`. */
+  virtualize: boolean;
+  /** Fixed row height in px, required for `virtualize`. */
+  itemHeight: number;
+  withUp: boolean;
+  hideRoot: boolean;
+  /** Shown when the current level has no children. */
+  emptyText: string;
+  /** Mirrors the inner list's `:focus-visible`, so the ring can go round the whole component. */
+  private _focusVisible;
+  private _rows;
+  private _loading;
+  /** The inner list, for registry / search commands and other advanced use. */
+  get list(): VerticalListElement | undefined;
+  /** Command registry carrying the inner list's `list.search.*` commands. */
+  get registry(): VerticalListElement[`registry`];
+  /** Run a command on the inner list, e.g. `dispatch('list.search.filter')`. */
+  dispatch(commandId: string, args?: Record<string, unknown>): void;
+  /**
+   * Rename a row in place. Needs `validateEdit`, and only rows whose
+   * `item.editable` is true can be edited. Ends with `flat-list-edit-commit` or `flat-list-edit-cancel`; the
+   * label is not rewritten — update the tree in response. Returns false if
+   * the row is unknown, not editable, or not on screen.
+   */
+  beginEdit(key: string): boolean;
+  /** The node whose children are listed. */
+  get currentNode(): TreeNode | undefined;
+  get selectedNodes(): ReadonlySet<TreeNode>;
+  /** Show the children of the node at this key path. Returns false if the path does not resolve. */
+  navigateTo(keys: readonly string[]): boolean;
+  /** Enter the child branch with this key. */
+  navigateInto(key: string): boolean;
+  /** Move to the parent level. Returns false at the root. */
+  navigateUp(): boolean;
+  disconnectedCallback(): void;
+  protected willUpdate(changed: PropertyValues): void;
+  protected updated(changed: PropertyValues): void;
+  protected render(): import("lit").TemplateResult<1>;
+  static styles: import("lit").CSSResult[];
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-flat-list': FlatListElement;
+  }
+}
+interface FlatListElement {
+  addEventListener<K extends keyof FlatListElementEventMap>(type: K, listener: (this: FlatListElement, event: FlatListElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+}
+//#endregion
+export { FlatListSelectEvent as _, FlatListContextMenuDetail as a, FlatListDropEvent as c, FlatListEditCommitDetail as d, FlatListEditCommitEvent as f, FlatListSelectDetail as g, FlatListNavigateEvent as h, FlatListBranchOrder as i, FlatListEditCancelDetail as l, FlatListNavigateDetail as m, FlatListActivateDetail as n, FlatListContextMenuEvent as o, FlatListElementEventMap as p, FlatListActivateEvent as r, FlatListDropDetail as s, FlatListElement as t, FlatListEditCancelEvent as u };
+//# sourceMappingURL=flat-list-DEDG6epz.d.ts.map

package/dist/flat-list-DEDG6epz.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flat-list-DEDG6epz.d.ts","names":[],"sources":["../src/flat-list/types.ts","../src/flat-list/flat-list.ts"],"mappings":";;;;;;;;;KAGY;KAEA;;WAED;;WAEA;;WAEA,MAAM;;WAEN;;KAGC;WACD,UAAU,YAAY;WACtB,cAAc;WACd,UAAU,YAAY;;KAGrB;WACD,MAAM;;KAGL;;WAED,MAAM;WACN,cAAc;;KAGb;;WAED,MAAM;;WAEN,gBAAgB;WAChB;WACA;;KAGC;WACD,MAAM;WACN;;KAGC;WACD,MAAM;;KAGL,wBAAwB,YAAY;KACpC,sBAAsB,YAAY;KAClC,wBAAwB,YAAY;KAEpC,oBAAoB,YAAY;KAChC,2BAA2B,YAAY;KACvC,0BAA0B,YAAY;KACtC,0BAA0B,YAAY;UAEjC;EACf,sBAAsB;EACtB,oBAAoB;EACpB,sBAAsB;EACtB,kBAAkB;EAClB,0BAA0B;EAC1B,yBAAyB;EACzB,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cCiFd,wBAAwB;;EAEnC,MAAM;EAGN,OAAO;;EAIP;;EAIA,cAAc;EAGd,iBAAiB;;EAIjB,QAAQ,GAAG,UAAU,GAAG;EAGxB,aAAa;EAGb,eAAe;EAGf,iBAAiB;EAGjB;EAGA;EAGA;;EAIA;;;;;EAOA,WAAW,MAAM,UAAU,cAAc;;;;;;EAQzC,gBAAgB,eAAe,MAAM;;EAIrC;;EAIA;;EAIA;EAGA;EAGA;;EAIA;;UAIQ;UAES;UACA;;MAcb,QAAQ;;MAKR,YAAY;;EAKhB,SAAS,mBAAmB,OAAO;;;;;;;EAUnC,UAAU;;MAQN,eAAe;MAIf,iBAAiB,YAAY;;EAWjC,WAAW;;EASX,aAAa;;EASb;EAqBS;YAQU,WAAW,SAAS;YAyBpB,QAAQ,SAAS;YAqSjB,wBAAM;SAoDT,sBAAM;;QAkFhB;YACI;IACR,kBAAkB;;;UAIL;EACf,iBAAiB,gBAAgB,yBAC/B,MAAM,GACN,WAAW,MAAM,iBAAiB,OAAO,wBAAwB,aACjE,oBAAoB;EAEtB,iBACE,cACA,UAAU,oCACV,oBAAoB"}

package/dist/flat-list.d.ts

@@ -0,0 +1,2 @@
+import { _ as FlatListSelectEvent, a as FlatListContextMenuDetail, c as FlatListDropEvent, d as FlatListEditCommitDetail, f as FlatListEditCommitEvent, g as FlatListSelectDetail, h as FlatListNavigateEvent, i as FlatListBranchOrder, l as FlatListEditCancelDetail, m as FlatListNavigateDetail, n as FlatListActivateDetail, o as FlatListContextMenuEvent, p as FlatListElementEventMap, r as FlatListActivateEvent, s as FlatListDropDetail, t as FlatListElement, u as FlatListEditCancelEvent } from "./flat-list-DEDG6epz.js";
+export { type FlatListActivateDetail, type FlatListActivateEvent, type FlatListBranchOrder, type FlatListContextMenuDetail, type FlatListContextMenuEvent, type FlatListDropDetail, type FlatListDropEvent, type FlatListEditCancelDetail, type FlatListEditCancelEvent, type FlatListEditCommitDetail, type FlatListEditCommitEvent, FlatListElement, type FlatListElementEventMap, type FlatListNavigateDetail, type FlatListNavigateEvent, type FlatListSelectDetail, type FlatListSelectEvent };