@ixfx/components 0.15.4 → 0.16.0

package/dist/sunbursttree-list-D6j5BxVQ.d.ts

@@ -0,0 +1,303 @@
+import { C as TreeItemDblClickEvent, E as TreeSearchHost, M as TreeDataModel, a as TreeComponent, i as TreeCollapseEvent, j as TreeTickleEvent, k as TreeSelectEvent, n as TreeActivateEvent, o as TreeComponentEventMap, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-DgfkxmVY.js";
+import { a as TreeItem, 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 { S as ListSearchController } from "./index-Dr80Zdl6.js";
+import { LitElement, PropertyValues } from "lit";
+import { CommandRegistry } from "@clinth/ui-commands";
+//#region src/sunburst-tree/types.d.ts
+/**
+ * Value accessor — returns the magnitude of a node, branches included.
+ *
+ * A child's arc is its share of its parent's value:
+ * `child / max(parent, Σ siblings)`. When children sum to less than their
+ * parent, the remainder shows as an unfilled gap — which is what makes
+ * progressively-arriving data fill in visibly. When they sum to more, they're
+ * scaled to fit.
+ *
+ * Return `undefined` (or a negative / non-finite number) for "unknown": the
+ * node then uses the sum of its loaded children's values, or `1` for a leaf
+ * or not-yet-loaded node.
+ *
+ * Default: `item => item.weight`.
+ */
+type SunburstValueAccessor = (item: TreeItem, node: TreeNode) => number | undefined;
+/** Formats a node's value for the centre readout. */
+type SunburstValueFormatter = (value: number, node: TreeNode) => string;
+/**
+ * Pointer/keyboard gesture mapping (subset of `TreeInteractionMode`).
+ * - `'implicit'` — click selects + zooms; single selection follows the pointer.
+ * - `'standard'` — click selects + zooms; Ctrl/Cmd+click toggles, Shift+click range-selects.
+ * - `'manual'` — click only zooms; selection is driven via `select()`/`deselect()`/`clearSelection()`.
+ *
+ * `checked` is deliberately unsupported — a checkbox per arc does not hold up
+ * at small arc sizes.
+ */
+type SunburstInteractionMode = `implicit` | `standard` | `manual`;
+/**
+ * A node positioned in the absolute (unzoomed) layout produced by
+ * `computeSunburstLayout()`. Angles are fractions of a full turn, clockwise
+ * from 12 o'clock; the true root spans `0..1`.
+ */
+type SunburstLayoutNode = {
+  /** Key path from the true root, joined with {@link SUNBURST_PATH_SEPARATOR}. */
+  readonly id: string;
+  readonly node: TreeNode;
+  readonly parentId: string | undefined;
+  /** Depth from the true root (root is `0`). */
+  readonly depth: number;
+  /** Start angle, fraction of a turn (0–1). */
+  readonly x0: number;
+  /** End angle, fraction of a turn (0–1). */
+  readonly x1: number;
+  /** Resolved value (accessor result, or fallback). */
+  readonly value: number;
+  /** 0-based position among siblings. */
+  readonly index: number;
+  /** Number of siblings (for `aria-setsize`). */
+  readonly setSize: number;
+  readonly hasChildren: boolean;
+};
+/** Absolute layout, keyed by id, in ring-major (breadth-first) order. */
+type SunburstLayout = ReadonlyMap<string, SunburstLayoutNode>;
+type ComputeSunburstLayoutOptions = {
+  valueAccessor?: SunburstValueAccessor;
+  /**
+   * Deepest absolute depth (root is `0`) to lay out. Nodes below it get no
+   * position. Defaults to no limit.
+   */
+  maxDepth?: number;
+};
+/**
+ * The zoom window the absolute layout is projected through: the zoom node's
+ * angular span becomes the full circle, and its depth becomes the centre.
+ */
+type SunburstView = {
+  readonly x0: number;
+  readonly x1: number;
+  /** Absolute depth of the zoom node. */
+  readonly depth: number;
+};
+/**
+ * Everything that's animated about one arc, in screen terms. Interpolated
+ * per frame between the displayed state and the target state.
+ */
+type SunburstArcVisual = {
+  /** Start angle, fraction of a turn (0–1) of the zoomed view. */
+  readonly a0: number;
+  /** End angle, fraction of a turn (0–1) of the zoomed view. */
+  readonly a1: number;
+  /**
+   * Ring index relative to the zoom node: `0` is the first ring, `-1` the
+   * centre disc, `≤ -2` collapsed into the centre. Fractional mid-animation.
+   */
+  readonly depth: number;
+  /** Hue offset in degrees (added to `--sunbursttree-hue-start`). */
+  readonly hue: number;
+  /** Sibling-position tone offset, `-0.5..0.5`. */
+  readonly shade: number;
+  readonly opacity: number;
+};
+/** Ring geometry in SVG user units (CSS px). */
+type SunburstRings = {
+  /** Radius of the centre disc. */
+  readonly center: number;
+  /** Width of each ring. */
+  readonly ring: number;
+};
+/** Where to draw an arc's label, if it fits. */
+type SunburstLabelPlacement = {
+  readonly kind: `straight`;
+  readonly x: number;
+  readonly y: number;
+  /** Rotation in degrees, applied about (x, y). */
+  readonly rotate: number;
+  readonly text: string;
+} | {
+  readonly kind: `curved`;
+  /** Guide path for `<textPath>`: an arc along the ring's middle, drawn so text reads upright. */
+  readonly path: string;
+  readonly text: string;
+};
+/** Ids are key paths; keys only need to be unique among siblings. */
+declare const SUNBURST_PATH_SEPARATOR = "";
+//#endregion
+//#region src/sunburst-tree/sunburst-view-state.d.ts
+/**
+ * Pure helpers behind `ixfx-sunbursttree-list` view state. Arcs are
+ * identified by key *path* (keys need only be unique among siblings), so live
+ * selection follows its path across data changes; saved keys — which are
+ * bare `item.key`s — resolve to the first node, depth-first, carrying them.
+ * See `docs/infra-view-state.md`.
+ */
+/** `ixfx-sunbursttree-list` view state: `selected`, `focus`, plus the zoom path. */
+type SunburstViewState = ViewStateBase & {
+  /**
+   * Keys from the root's children down to the centre node; `[]` = the full
+   * tree. A path because keys are only unique among siblings, and so a
+   * lazily-loaded tree can be opened down to it, one load at a time.
+   */
+  readonly zoom?: readonly string[];
+};
+//#endregion
+//#region src/sunburst-tree/sunbursttree-list.d.ts
+/** Fired when the zoom root changes. `node` is `undefined` on zoom-out to the full tree. */
+type SunburstZoomDetail = {
+  readonly node: TreeNode | undefined;
+  /** Absolute depth of the zoom node (root's children are depth 0); `-1` when fully zoomed out. */
+  readonly depth: number;
+};
+type SunburstZoomEvent = CustomEvent<SunburstZoomDetail>;
+interface SunburstTreeListElementEventMap extends TreeComponentEventMap {
+  'select': TreeSelectEvent;
+  'tickle': TreeTickleEvent;
+  'activate': TreeActivateEvent;
+  'item-click': TreeItemClickEvent;
+  'item-dblclick': TreeItemDblClickEvent;
+  'expand': TreeExpandEvent;
+  'collapse': TreeCollapseEvent;
+  'zoom': SunburstZoomEvent;
+}
+/**
+ * `ixfx-sunbursttree-list` — a zoomable sunburst over weighted tree data.
+ *
+ * The zoom node is the centre disc; each ring outward is one generation,
+ * each arc's angle its share of its parent's value. Every data, weighting or
+ * zoom change animates from what's on screen to the new layout. Hues come
+ * from the ring around the centre; descendants take tones of their
+ * first-ring ancestor's hue.
+ *
+ * Implements `TreeComponent`. Deliberate differences from `ixfx-tree-list`:
+ * - **Expand/collapse is reinterpreted as zoom.** `expand` fires on zoom-in,
+ *   `collapse` on zoom-out.
+ * - **`interactionMode` drops `checked`**; **`exclusivity` is ignored**.
+ * - **`filterPredicate` dims** non-matching arcs instead of hiding them.
+ * - **Reassigning `root` keeps zoom and selection** where the same key paths
+ *   still exist, so streamed or immutably-rebuilt data animates in place.
+ */
+declare class SunburstTreeListElement extends LitElement implements TreeComponent, TreeSearchHost {
+  #private;
+  static shadowRootOptions: {
+    delegatesFocus: boolean;
+    clonable?: boolean;
+    customElementRegistry?: CustomElementRegistry | null;
+    mode: ShadowRootMode;
+    serializable?: boolean;
+    slotAssignment?: SlotAssignmentMode;
+  };
+  root: TreeNode | undefined;
+  model: TreeDataModel | undefined;
+  /** Callback to lazily load children for a node. Superseded by `model` when both are set. */
+  loadChildren: LoadChildrenCallback | undefined;
+  /** Accepted for `TreeComponent` compatibility but ignored. */
+  exclusivity: TreeExclusivity;
+  selectionFilter: TreeSelectionFilter;
+  /** Gesture mapping. `checked` is unsupported. */
+  interactionMode: SunburstInteractionMode;
+  /** How many rings render around the centre. */
+  maxDepth: number;
+  /** Radius of the centre disc as a fraction of the overall radius (0–0.9). */
+  centerRatio: number;
+  /** Arcs whose outer edge is shorter than this (px) aren't drawn. */
+  minArcLength: number;
+  /** Hide in-arc labels (the centre readout still shows). */
+  disableLabels: boolean;
+  /**
+   * Curve labels to follow their ring (`<textPath>`) instead of drawing them
+   * straight. Arcs too narrow for that still get straight radial labels.
+   */
+  curvedLabels: boolean;
+  /** Duration (ms) of data, weighting and zoom transitions. `0` snaps. Respects `prefers-reduced-motion`. */
+  animationDuration: number;
+  /**
+   * Node value. Swap it to change weighting scheme — the chart animates to
+   * the new layout without rebuilding anything. Default: `item.weight`.
+   * See `SunburstValueAccessor` for how missing values fall back.
+   */
+  valueAccessor: SunburstValueAccessor;
+  /** Formats values for the centre readout. */
+  valueFormatter: SunburstValueFormatter;
+  selectedNode: TreeNode | undefined;
+  private _selectedNodes;
+  get selectedNodes(): ReadonlySet<TreeNode>;
+  filterPredicate: TreeFilterPredicate | undefined;
+  disableKeyboardNavigation: boolean;
+  registry: CommandRegistry<unknown> | undefined;
+  /** Space-separated subset of `navigate select filter`. See `docs/infra-incremental.md`. */
+  searchModes: string | undefined;
+  /** Current zoom root. `undefined` when showing the full tree. Pure view-state. */
+  get focusedNode(): TreeNode | undefined;
+  /** Id (key path) of the zoom node; `undefined` = the true root. */
+  private _zoomId;
+  /**
+   * Whether restoring a saved zoom may call `loadChildren` / `model` to load
+   * the nodes along its path (one at a time). Default `true`.
+   */
+  restoreLoads: boolean;
+  private _size;
+  readonly search: ListSearchController<{
+    node: TreeNode;
+    depth: number;
+  }>;
+  private tickled;
+  /** Set by every update request except animation frames — triggers a re-layout. */
+  private _layoutDirty;
+  private _ticking;
+  requestUpdate(...args: Parameters<LitElement[`requestUpdate`]>): void;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  protected willUpdate(changed: PropertyValues): void;
+  protected updated(changed: PropertyValues): void;
+  /**
+   * Snapshot selection, zoom path and keyboard cursor as plain JSON, keyed by
+   * `item.key`. Includes pending state for keys not currently loaded.
+   */
+  getViewState(options?: GetViewStateOptions<SunburstViewState>): SunburstViewState;
+  /**
+   * Apply saved view state. Fields present replace the current ones; keys
+   * that aren't loaded yet are applied as they appear — including via
+   * `loadChildren` / `model` down a saved zoom path when `restoreLoads`.
+   */
+  setViewState(state: Partial<SunburstViewState>): void;
+  clearPendingViewState(): void;
+  select(node: TreeNode): void;
+  deselect(node: TreeNode): void;
+  clearSelection(): void;
+  selectAll(): void;
+  deselectAll(): void;
+  selectMany(nodes: Iterable<TreeNode>): void;
+  /**
+   * Zoom so `node` becomes the centre, its children the first ring. Fires
+   * `zoom` and `expand` (or `collapse` when `node` is an ancestor of the
+   * current centre). Pure view-state — `root` is never mutated.
+   */
+  zoomTo(node: TreeNode): void;
+  /** Zoom out one level: the centre's parent becomes the centre. */
+  zoomUp(): void;
+  /** Zoom all the way out to the full tree. */
+  zoomOut(): void;
+  /** Zoom to reveal the node at `keys` (path from the root's children), then select it. */
+  navigateTo(keys: readonly string[]): boolean;
+  /** Zoom + select the first node (depth-first) matching `predicate`. */
+  navigateToNode(predicate: (node: TreeNode) => boolean): boolean;
+  /** Zoom to reveal the first node with `key` and move the cursor to it, without selecting. */
+  revealKey(key: string): boolean;
+  /** Arcs currently drawn (centre excluded), ring-major, depth from the root's children. */
+  getNodes(): ReadonlyArray<{
+    node: TreeNode;
+    depth: number;
+  }>;
+  protected render(): import("lit").TemplateResult<1>;
+  static styles: import("lit").CSSResult[];
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-sunbursttree-list': SunburstTreeListElement;
+  }
+}
+interface SunburstTreeListElement {
+  addEventListener: (<K extends keyof SunburstTreeListElementEventMap>(type: K, listener: (this: SunburstTreeListElement, event: SunburstTreeListElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+  removeEventListener: (<K extends keyof SunburstTreeListElementEventMap>(type: K, listener: (this: SunburstTreeListElement, event: SunburstTreeListElementEventMap[K]) => void, options?: boolean | EventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void);
+}
+//#endregion
+export { SunburstViewState as a, SunburstArcVisual as c, SunburstLayout as d, SunburstLayoutNode as f, SunburstView as g, SunburstValueFormatter as h, SunburstZoomEvent as i, SunburstInteractionMode as l, SunburstValueAccessor as m, SunburstTreeListElementEventMap as n, ComputeSunburstLayoutOptions as o, SunburstRings as p, SunburstZoomDetail as r, SUNBURST_PATH_SEPARATOR as s, SunburstTreeListElement as t, SunburstLabelPlacement as u };

package/dist/{tab-list-wC0xNz1b.d.ts → tab-list-Df371rqw.d.ts}

@@ -1,4 +1,4 @@
-import "./icon-DR_3rSyZ.js";
+import "./icon-CDGprSdE.js";
 import { LitElement, PropertyValues } from "lit";
 import { CommandRegistry } from "@clinth/ui-commands";
 //#region src/tabs/tab-list-item.d.ts

package/dist/tabs.d.ts

@@ -1,2 +1,2 @@
-import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-wC0xNz1b.js";
+import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-Df371rqw.js";
 export { TabListChangeDetail, TabListChangeEvent, TabListDragMode, TabListElement, TabListReorderDetail, TabListReorderEvent };

package/dist/{titlebar-B5zSTZnF.d.ts → titlebar-Tqu-VvMU.d.ts}

@@ -1,4 +1,4 @@
-import "./icon-DR_3rSyZ.js";
+import "./icon-CDGprSdE.js";
 import { LitElement } from "lit";
 //#region src/titlebar/titlebar.d.ts
 type TitlebarOrientation = `horizontal` | `vertical`;

package/dist/titlebar.d.ts

@@ -1,2 +1,2 @@
-import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-B5zSTZnF.js";
+import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-Tqu-VvMU.js";
 export { TitlebarCloseEvent, TitlebarElement, TitlebarElementEventMap, TitlebarOrientation, TitlebarToggleDetail, TitlebarToggleEvent, TitlebarToggleInteraction, TitlebarVariant };

package/dist/tree-CftHwtEb.js

@@ -0,0 +1,146 @@
+import { a as capKeys, i as capFlags, n as EMPTY_KEYS } from "./pending-BGidHppL.js";
+//#region src/common/view-state/tree.ts
+/**
+* - live expanded keys that are no longer loaded → pending `true`
+* - pending keys that are now loaded → applied (`true` opens, `false` closes)
+* - pending-open keys whose node can't open yet (`canOpen` false: children
+*   unloaded) stay pending and are listed in `needsLoad`
+*/
+function reconcileExpansion(live, pending, has, canOpen) {
+	let nextLive;
+	let nextPending;
+	const needsLoad = [];
+	for (const key of live) {
+		if (has(key)) continue;
+		nextLive ??= new Set(live);
+		nextLive.delete(key);
+		nextPending ??= new Map(pending);
+		nextPending.set(key, true);
+	}
+	for (const [key, open] of pending) {
+		if (!has(key)) continue;
+		if (open && !canOpen(key)) {
+			needsLoad.push(key);
+			continue;
+		}
+		nextPending ??= new Map(pending);
+		nextPending.delete(key);
+		if (open !== (nextLive ?? live).has(key)) {
+			nextLive ??= new Set(live);
+			if (open) nextLive.add(key);
+			else nextLive.delete(key);
+		}
+	}
+	return {
+		live: nextLive ?? live,
+		pending: nextPending ? capFlags(nextPending) : pending,
+		needsLoad,
+		changed: nextLive !== void 0 || nextPending !== void 0
+	};
+}
+/**
+* Re-key the node selection onto the current tree: selected nodes are swapped
+* for the loaded node with the same key, or go pending when the key is gone;
+* pending keys that resolve (and pass `canSelect`) are selected. With
+* `single`, at most one node stays selected (a restored key wins).
+*/
+function reconcileSelection(selected, pending, nodeByKey, canSelect, single) {
+	if (selected.size === 0 && pending.size === 0) return {
+		selected,
+		pending,
+		restored: false,
+		changed: false
+	};
+	const next = /* @__PURE__ */ new Set();
+	const nextPending = /* @__PURE__ */ new Set();
+	let changed = false;
+	for (const node of selected) {
+		const current = nodeByKey(node.item.key);
+		if (current) {
+			next.add(current);
+			if (current !== node) changed = true;
+		} else {
+			nextPending.add(node.item.key);
+			changed = true;
+		}
+	}
+	let restored;
+	for (const key of pending) {
+		const node = nodeByKey(key);
+		if (node && canSelect(node)) {
+			next.add(node);
+			restored = node;
+			changed = true;
+		} else nextPending.add(key);
+	}
+	if (!changed) return {
+		selected,
+		pending,
+		restored: false,
+		changed: false
+	};
+	let finalSelected = next;
+	let finalPending = nextPending;
+	if (single && next.size > 0) {
+		finalSelected = /* @__PURE__ */ new Set([restored ?? [...next].at(-1)]);
+		finalPending = EMPTY_KEYS;
+	}
+	return {
+		selected: finalSelected,
+		pending: capKeys(finalPending),
+		restored: restored !== void 0,
+		changed: true
+	};
+}
+/**
+* Keyboard cursor: a cursor key that left the data goes pending (`clear`);
+* a pending key that is now visible is applied (`apply`).
+*/
+function reconcileCursor(cursor, pending, has, isVisible) {
+	let nextPending = pending;
+	let clear = false;
+	if (cursor !== void 0 && !has(cursor)) {
+		nextPending ??= cursor;
+		clear = true;
+	}
+	if (nextPending !== void 0 && isVisible(nextPending)) return {
+		clear,
+		apply: nextPending,
+		pending: void 0
+	};
+	return {
+		clear,
+		apply: void 0,
+		pending: nextPending
+	};
+}
+/** Sanitise a JSON zoom / centre path: strings only, `undefined` when not an array. */
+function pathFromJson(value) {
+	return Array.isArray(value) ? value.filter((k) => typeof k === `string`) : void 0;
+}
+/**
+* Follow `keys` from the children of `root`. When the walk reaches a node
+* whose children aren't loaded, reports it as `load` if `canLoad` allows.
+*/
+function resolveKeyPath(root, keys, canLoad) {
+	if (!root) return { status: `missing` };
+	const nodes = [];
+	let current = root;
+	for (const key of keys) {
+		if (current.children === void 0) return canLoad(current) ? {
+			status: `load`,
+			node: current,
+			depth: nodes.length - 1
+		} : { status: `missing` };
+		const next = current.children.find((c) => c.item.key === key);
+		if (!next) return { status: `missing` };
+		nodes.push(next);
+		current = next;
+	}
+	return {
+		status: `found`,
+		nodes
+	};
+}
+//#endregion
+export { resolveKeyPath as a, reconcileSelection as i, reconcileCursor as n, reconcileExpansion as r, pathFromJson as t };