@ixfx/components 0.2.6 → 0.3.1

package/bundle/index.d.ts

@@ -1154,6 +1154,98 @@ declare global {
   }
 } //# sourceMappingURL=ac-text.d.ts.map
 //#endregion
+//#region src/ac-token/types.d.ts
+type AcTokenItem = {
+  readonly label: string;
+  readonly subLabel?: string;
+  readonly icon?: string;
+  readonly key?: string;
+  readonly data?: unknown;
+  readonly positions?: ReadonlySet<number>;
+};
+type AcTokenCompletionProvider = (token: string, signal: AbortSignal) => Promise<AcTokenItem[]> | AcTokenItem[];
+type AcTokenizerFn = (text: string) => string[];
+type AcTokensChangeDetail = {
+  readonly tokens: readonly AcTokenItem[];
+};
+type AcTokensChangeEvent = CustomEvent<AcTokensChangeDetail>;
+type AcTokenAddDetail = {
+  readonly item: AcTokenItem;
+  readonly index: number;
+};
+type AcTokenAddEvent = CustomEvent<AcTokenAddDetail>;
+type AcTokenRemoveDetail = {
+  readonly item: AcTokenItem;
+  readonly index: number;
+};
+type AcTokenRemoveEvent = CustomEvent<AcTokenRemoveDetail>;
+interface AcTokenElementEventMap {
+  'ac-token-change': AcTokensChangeEvent;
+  'ac-token-add': AcTokenAddEvent;
+  'ac-token-remove': AcTokenRemoveEvent;
+}
+//#endregion
+//#region src/ac-token/ac-token.d.ts
+/**
+ * Token/tag input with per-token autocomplete suggestions.
+ *
+ * Users type tokens separated by space, comma or semicolon (default). Each
+ * committed token appears as a chip inline with the text cursor. The
+ * suggestion popup follows the input cursor position.
+ *
+ * @fires {AcTokensChangeEvent} ac-token-change — any time the token list changes
+ * @fires {AcTokenAddEvent}     ac-token-add    — when a token is added
+ * @fires {AcTokenRemoveEvent}  ac-token-remove — when a token is removed
+ *
+ * @example
+ * ```html
+ * <ixfx-ac-token placeholder="Add tags…" data-tokens="one two three"></ixfx-ac-token>
+ * ```
+ */
+declare class AcTokenElement extends LitElement {
+  #private;
+  /** Provides completion results for the current draft token. */
+  completionProvider: AcTokenCompletionProvider | undefined;
+  /** Custom tokenizer — defaults to splitting on space, comma, semicolon. */
+  tokenizer: AcTokenizerFn | undefined;
+  /** Placeholder text shown when no tokens or draft text are present. */
+  placeholder: string;
+  /** Maximum number of query results to cache (LRU). */
+  cacheSize: number;
+  /** Debounce delay in ms before invoking the provider after keystroke. */
+  debounceMs: number;
+  /**
+   * When true, only suggestions from the popup can be committed.
+   * When false (default), typing text and pressing Enter commits it as-is.
+   */
+  strict: boolean;
+  private _tokens;
+  private _draft;
+  private _selectedTokenIndex;
+  private _suggestions;
+  private _isOpen;
+  private _isLoading;
+  private _tickled;
+  constructor();
+  get tokens(): readonly AcTokenItem[];
+  set tokens(value: readonly AcTokenItem[]);
+  /** All committed token labels joined with commas. */
+  get value(): string;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  protected updated(changedProps: PropertyValues): void;
+  protected render(): TemplateResult<1>;
+  static styles: CSSResult[];
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-ac-token': AcTokenElement;
+  }
+}
+interface AcTokenElement {
+  addEventListener: (<K extends keyof AcTokenElementEventMap>(type: K, listener: (this: AcTokenElement, event: AcTokenElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+}
+//#endregion
 //#region src/button/button.d.ts
 declare class ButtonElement extends LitElement {
   disabled: boolean;
@@ -1428,11 +1520,10 @@ declare global {
   }
 }
 interface CheckboxEventMap {
-  'change': CheckboxChangeEvent;
+  change: CheckboxChangeEvent;
 }
 interface Checkbox {
-  addEventListener<K extends keyof CheckboxEventMap>(type: K, listener: (this: Checkbox, event: CheckboxEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
-  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+  addEventListener: (<K extends keyof CheckboxEventMap>(type: K, listener: (this: Checkbox, event: CheckboxEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
 //#region src/colour-picker/types.d.ts
@@ -2795,7 +2886,7 @@ type TreeFilterPredicate = (node: TreeNode, depth: number) => boolean;
  * - `'depth'`  — only one sibling at the same depth may be expanded at a time (accordion)
  * - `'global'` — only one node anywhere in the tree may be expanded at a time
  */
-type TreeExclusivity = 'none' | 'depth' | 'global';
+type TreeExclusivity = `none` | `depth` | `global`;
 /**
  * Restricts which kinds of nodes may enter the selection.
  * Applied as a guard in all interaction modes.
@@ -2804,7 +2895,7 @@ type TreeExclusivity = 'none' | 'depth' | 'global';
  * - `'branch'` — only branch nodes (nodes with children) are selectable
  * - `'all'`    — both leaf and branch nodes are selectable
  */
-type TreeSelectionFilter = 'none' | 'leaf' | 'branch' | 'all';
+type TreeSelectionFilter = `none` | `leaf` | `branch` | `all`;
 /**
  * Controls how pointer and keyboard gestures map to selection changes.
  * - `'implicit'`  — single selection that follows the click; clicking always selects + toggles expand
@@ -2813,15 +2904,15 @@ type TreeSelectionFilter = 'none' | 'leaf' | 'branch' | 'all';
  * - `'checked'`   — checkboxes on every item; checkbox click toggles selection recursively; row click only expands/collapses
  * - `'vscode'`    — like `standard` for clicks; Shift+arrow uses snapshot-based toggle-range
  */
-type TreeInteractionMode = 'implicit' | 'standard' | 'manual' | 'checked' | 'vscode';
+type TreeInteractionMode = `implicit` | `standard` | `manual` | `checked` | `vscode`;
 //#endregion
 //#region src/common/tree-data-model.d.ts
 type InvalidateEvent = {
-  type: 'invalidate';
+  type: `invalidate`;
   key: string;
 };
 type RootEvent = {
-  type: 'root';
+  type: `root`;
   root: TreeNode;
 };
 type ModelEvent = InvalidateEvent | RootEvent;
@@ -3039,26 +3130,26 @@ interface TreeComponent extends EventTarget {
    */
   exclusivity: TreeExclusivity;
   /** Select `node`, replacing any current selection. Respects `selectionFilter` — no-op if the node is not selectable. */
-  select(node: TreeNode): void;
+  select: (node: TreeNode) => void;
   /** Remove `node` from the selection. */
-  deselect(node: TreeNode): void;
+  deselect: (node: TreeNode) => void;
   /** Clear the entire selection. */
-  clearSelection(): void;
+  clearSelection: () => void;
   /**
    * Expand ancestors and select the node reached by following `keys` from the root's children.
    * Returns `true` if the path was found and applied.
    */
-  navigateTo(keys: readonly string[]): boolean;
+  navigateTo: (keys: readonly string[]) => boolean;
   /**
    * Expand ancestors and select the first node for which `predicate` returns `true`.
    * Returns `true` if a matching node was found.
    */
-  navigateToNode(predicate: (node: TreeNode) => boolean): boolean;
+  navigateToNode: (predicate: (node: TreeNode) => boolean) => boolean;
   /**
    * Returns all nodes currently visible in the rendered output, in render order,
    * with their depth (0-based, root's children are depth 0).
    */
-  getNodes(): ReadonlyArray<{
+  getNodes: () => ReadonlyArray<{
     node: TreeNode;
     depth: number;
   }>;
@@ -3231,8 +3322,7 @@ interface CrumbNavigationElementEventMap extends TreeComponentEventMap {
   'activate': TreeActivateEvent;
 }
 interface CrumbNavigationElement {
-  addEventListener<K extends keyof CrumbNavigationElementEventMap>(type: K, listener: (this: CrumbNavigationElement, event: CrumbNavigationElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
-  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+  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
 //#region src/crumbs/crumb-path.d.ts
@@ -3289,13 +3379,12 @@ declare global {
   }
 }
 interface CrumbPathElementEventMap {
-  'navigate': CrumbNavNavigateEvent;
-  'change': CrumbNavChangeEvent;
-  'expand': CrumbNavExpandEvent;
+  navigate: CrumbNavNavigateEvent;
+  change: CrumbNavChangeEvent;
+  expand: CrumbNavExpandEvent;
 }
 interface CrumbPathElement {
-  addEventListener<K extends keyof CrumbPathElementEventMap>(type: K, listener: (this: CrumbPathElement, event: CrumbPathElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
-  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+  addEventListener: (<K extends keyof CrumbPathElementEventMap>(type: K, listener: (this: CrumbPathElement, event: CrumbPathElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
 //#region src/crumbs/crumb-path-controller.d.ts
@@ -3374,6 +3463,8 @@ declare class EditableLabel extends LitElement {
   protected get _contentEl(): HTMLElement | undefined;
   /** Snapshot of value taken when editing begins; restored on cancel. */
   protected _prevValue: string;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
   protected _hovering: boolean;
   protected _transientShowingValue: boolean;
   protected _transientTimer: number | undefined;
@@ -3385,6 +3476,7 @@ declare class EditableLabel extends LitElement {
   protected _requestDisplayUpdate(): void;
   /** Called by subclasses when user interacts (drag, keyboard, etc) to temporarily show value in transient mode */
   protected _onUserInteraction(): void;
+  protected _handleClick: () => void;
   protected _handleFocus: () => void;
   protected _handleBlur: () => void;
   protected _handleKeydown: (e: KeyboardEvent) => void;
@@ -3397,6 +3489,8 @@ declare class EditableLabel extends LitElement {
   protected _shouldUseDisplayText(): boolean;
   protected _isAllowedInput(char: string): boolean;
   private _defaultValidator;
+  render(): TemplateResult<1>;
+  updated(changed: PropertyValues): void;
   static styles: CSSResult[];
 }
 declare global {
@@ -3469,16 +3563,16 @@ declare global {
 //#region src/hex/types.d.ts
 type BytePos = number;
 type SingleSelection = {
-  readonly kind: 'single';
+  readonly kind: `single`;
   readonly pos: BytePos;
 };
 type ContiguousSelection = {
-  readonly kind: 'contiguous';
+  readonly kind: `contiguous`;
   readonly start: BytePos;
   readonly end: BytePos;
 };
 type RectangularSelection = {
-  readonly kind: 'rectangular';
+  readonly kind: `rectangular`;
   readonly x: number;
   readonly y: number;
   readonly width: number;
@@ -3490,7 +3584,7 @@ type DiffEntry = {
   readonly after: number;
 };
 type Diff = ReadonlyMap<BytePos, DiffEntry>;
-type ColourScheme = 'ascii' | 'shade';
+type ColourScheme = `ascii` | `shade`;
 //#endregion
 //#region src/hex/hex-editor.d.ts
 declare class IxfxHexEditorElement extends LitElement {
@@ -3634,7 +3728,7 @@ type IncrSearchResult<T> = {
 };
 type IncrSearchState<T> = {
   readonly query: string;
-  readonly results: readonly IncrSearchResult<T>[];
+  readonly results: ReadonlyArray<IncrSearchResult<T>>;
   readonly positionsByItem: ReadonlyMap<T, ReadonlySet<number>>;
 };
 type IncrSearchChangeCallback<T> = (state: IncrSearchState<T>) => void;
@@ -3657,7 +3751,7 @@ type FuzzySearchOptions<T> = {
   readonly fzf?: Partial<FzfOptions<T>>;
 };
 type FuzzySearch<T> = {
-  readonly find: (query: string) => readonly IncrSearchResult<T>[];
+  readonly find: (query: string) => ReadonlyArray<IncrSearchResult<T>>;
   readonly items: readonly T[];
 };
 type HighlightTarget = {
@@ -3954,18 +4048,6 @@ declare class MenuCommandController {
   private handleCommand;
 }
 //#endregion
-//#region src/menu/menu-header.d.ts
-declare class MenuHeader extends LitElement {
-  label: string;
-  static styles: CSSResult;
-  render(): TemplateResult<1>;
-}
-declare global {
-  interface HTMLElementTagNameMap {
-    'ixfx-menu-header': MenuHeader;
-  }
-} //# sourceMappingURL=menu-header.d.ts.map
-//#endregion
 //#region src/menu/menu-sub-trigger.d.ts
 declare class MenuSubTrigger extends LitElement {
   command: string;
@@ -4021,6 +4103,18 @@ declare global {
   }
 } //# sourceMappingURL=menu-separator.d.ts.map
 //#endregion
+//#region src/menu/menu-header.d.ts
+declare class MenuHeader extends LitElement {
+  label: string;
+  static styles: CSSResult;
+  render(): TemplateResult<1>;
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    'ixfx-menu-header': MenuHeader;
+  }
+} //# sourceMappingURL=menu-header.d.ts.map
+//#endregion
 //#region src/menu/menu-from-tree.d.ts
 type MenuFromTreeOptions = {
   onCommand?: (detail: MenuTriggerCommandDetail) => void;
@@ -4084,7 +4178,7 @@ type MillerHeaderClickDetail = {
    * - depth 1 → [root, selectedAtDepth0]
    * - depth d → [root, sel[0], …, sel[d-1]]
    */
-  path: TreeNode[];
+  path: Array<TreeNode>;
 };
 /** Detail for the `item-dblclick` event. */
 type MillerItemDblClickDetail = {
@@ -4101,7 +4195,7 @@ type MillerItemRightClickDetail = {
 type MillerHeaderRightClickDetail = {
   depth: number;
   label: string;
-  path: TreeNode[];
+  path: Array<TreeNode>;
   mouseEvent: MouseEvent;
 };
 type MillerHeaderClickEvent = CustomEvent<MillerHeaderClickDetail>;
@@ -4481,10 +4575,8 @@ interface MillerBaseElementEventMap extends TreeComponentEventMap {
   'header-rightclick': CustomEvent<MillerHeaderRightClickDetail>;
 }
 interface MillerBaseElement {
-  addEventListener<K extends keyof MillerBaseElementEventMap>(type: K, listener: (this: MillerBaseElement, event: MillerBaseElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
-  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-  removeEventListener<K extends keyof MillerBaseElementEventMap>(type: K, listener: (this: MillerBaseElement, event: MillerBaseElementEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
-  removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+  addEventListener: (<K extends keyof MillerBaseElementEventMap>(type: K, listener: (this: MillerBaseElement, event: MillerBaseElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
+  removeEventListener: (<K extends keyof MillerBaseElementEventMap>(type: K, listener: (this: MillerBaseElement, event: MillerBaseElementEventMap[K]) => void, options?: boolean | EventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void);
 }
 //#endregion
 //#region src/miller/miller-list.d.ts
@@ -5086,8 +5178,7 @@ interface SwipeElementEventMap {
   input: SwipeInputEvent;
 }
 interface SwipeElement {
-  addEventListener<K extends keyof SwipeElementEventMap>(type: K, listener: (this: SwipeElement, event: SwipeElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
-  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+  addEventListener: (<K extends keyof SwipeElementEventMap>(type: K, listener: (this: SwipeElement, event: SwipeElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 declare global {
   interface HTMLElementTagNameMap {
@@ -5241,51 +5332,51 @@ type ViewRange = {
   min: number;
   max: number;
 };
-type GridMode = 'adaptive' | 'fixed';
+type GridMode = `adaptive` | `fixed`;
 type GridResolution = {
   majorStep: number;
   minorDivisions: number;
   minorStep: number;
 };
-type TrackHeightMode = 'none' | 'fixed' | 'free';
-type UserScale = 'x-wide' | 'wide' | 'normal' | 'slim' | 'x-slim' | string;
+type TrackHeightMode = `none` | `fixed` | `free`;
+type UserScale = `x-wide` | `wide` | `normal` | `slim` | `x-slim` | string;
 type TrackLayout = {
   trackKey: string;
   y: number;
   height: number;
 };
 type DragTarget = {
-  kind: 'none';
+  kind: `none`;
 } | {
-  kind: 'event-move';
+  kind: `event-move`;
   eventId: string;
   originTrackKey: string;
   offsetX: number;
 } | {
-  kind: 'event-start';
+  kind: `event-start`;
   eventId: string;
 } | {
-  kind: 'event-end';
+  kind: `event-end`;
   eventId: string;
 } | {
-  kind: 'marquee';
+  kind: `marquee`;
   startLogicalX: number;
   startY: number;
   currentLogicalX: number;
   currentY: number;
 } | {
-  kind: 'track-reorder';
+  kind: `track-reorder`;
   trackKey: string;
   ghostY: number;
 } | {
-  kind: 'axis-zoom';
+  kind: `axis-zoom`;
   anchorUnit: number;
   startScreenX: number;
   startScreenY: number;
   startViewMin: number;
   startPpu: number;
 } | {
-  kind: 'v-axis-zoom';
+  kind: `v-axis-zoom`;
   anchorBaseY: number;
   startScreenX: number;
   startScreenY: number;
@@ -5365,6 +5456,53 @@ interface TimelineElementEventMap {
   'dragging': TimelineDraggingEvent;
 }
 //#endregion
+//#region src/timeline/timeline-controller.d.ts
+/**
+ * Configuration for the TimelineController external adapter.
+ */
+type TimelineControllerConfig = {
+  readonly logicalMin: number;
+  readonly logicalMax: number;
+  readonly labelFormatter?: (value: number) => string;
+  readonly gridResolver?: (viewRange: ViewRange, userScale: UserScale) => GridResolution;
+};
+/**
+ * Minimal interface the controller expects from the timeline element.
+ * Avoids coupling to the concrete element class.
+ */
+type TimelineHost = {
+  formatLabel: (v: number) => string;
+  setViewRange: (r: ViewRange) => void;
+  min: number;
+  max: number;
+  userScale: string;
+  getTrackEvents: (trackKey: string) => TimelineEvent[];
+  get selectedIds(): readonly string[];
+  set selectedIds(ids: readonly string[]);
+  addEventListener: (type: string, listener: EventListener) => void;
+  removeEventListener: (type: string, listener: EventListener) => void;
+};
+/**
+ * External adapter class that can configure a timeline element
+ * with musical time, custom label formatting, etc.
+ *
+ * The controller has no import of any timeline element type.
+ * Users create a controller, pass it the component instance,
+ * and the controller calls the component's public API.
+ */
+declare class TimelineController {
+  #private;
+  constructor(timeline: TimelineHost, config: TimelineControllerConfig);
+  /** Update the tempo (BPM) for musical time calculations. */
+  setTempo(bpm: number): void;
+  /** Update the time signature for musical time calculations. */
+  setTimeSignature(numerator: number, denominator: number): void;
+  /** Set the visible view range on the timeline. */
+  setViewRange(range: ViewRange): void;
+  /** Clean up any resources held by the controller. */
+  dispose(): void;
+}
+//#endregion
 //#region src/timeline/timeline-draw.d.ts
 type CssVars = Record<string, string>;
 type Rect = {
@@ -5376,8 +5514,8 @@ type Rect = {
 /**
  * Dispatch to adaptive or fixed grid mode.
  */
-declare const resolveGrid: (viewRange: ViewRange, userScale: UserScale, viewportWidth: number, mode?: GridMode, fixedMinorStep?: number, ppu?: number) => GridResolution;
-declare const resolveCssVars: (host: HTMLElement) => CssVars;
+declare function resolveGrid(viewRange: ViewRange, userScale: UserScale, viewportWidth: number, mode?: GridMode, fixedMinorStep?: number, ppu?: number): GridResolution;
+declare function resolveCssVars(host: HTMLElement): CssVars;
 //#endregion
 //#region src/timeline/timeline-track-tabs.d.ts
 /**
@@ -5543,74 +5681,27 @@ interface IxfxTimelineElement {
   addEventListener: (<K extends keyof TimelineElementEventMap>(type: K, listener: (this: IxfxTimelineElement, event: TimelineElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => void) & ((type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void);
 }
 //#endregion
-//#region src/timeline/timeline-styles.d.ts
-declare const timelineStyles: CSSResult;
-//#endregion
-//#region src/timeline/timeline-controller.d.ts
-/**
- * Configuration for the TimelineController external adapter.
- */
-type TimelineControllerConfig = {
-  readonly logicalMin: number;
-  readonly logicalMax: number;
-  readonly labelFormatter?: (value: number) => string;
-  readonly gridResolver?: (viewRange: ViewRange, userScale: UserScale) => GridResolution;
-};
-/**
- * Minimal interface the controller expects from the timeline element.
- * Avoids coupling to the concrete element class.
- */
-type TimelineHost = {
-  formatLabel: (v: number) => string;
-  setViewRange(r: ViewRange): void;
-  min: number;
-  max: number;
-  userScale: string;
-  getTrackEvents(trackKey: string): TimelineEvent[];
-  get selectedIds(): readonly string[];
-  set selectedIds(ids: readonly string[]);
-  addEventListener(type: string, listener: EventListener): void;
-  removeEventListener(type: string, listener: EventListener): void;
-};
-/**
- * External adapter class that can configure a timeline element
- * with musical time, custom label formatting, etc.
- *
- * The controller has no import of any timeline element type.
- * Users create a controller, pass it the component instance,
- * and the controller calls the component's public API.
- */
-declare class TimelineController {
-  #private;
-  constructor(timeline: TimelineHost, config: TimelineControllerConfig);
-  /** Update the tempo (BPM) for musical time calculations. */
-  setTempo(bpm: number): void;
-  /** Update the time signature for musical time calculations. */
-  setTimeSignature(numerator: number, denominator: number): void;
-  /** Set the visible view range on the timeline. */
-  setViewRange(range: ViewRange): void;
-  /** Clean up any resources held by the controller. */
-  dispose(): void;
-}
-//#endregion
 //#region src/timeline/timeline-interactions.d.ts
 type VCanvasElement = HTMLElement & {
-  convertFromViewportToCanvas(x: number, y: number): {
+  convertFromViewportToCanvas: (x: number, y: number) => {
     x: number;
     y: number;
   };
   viewportWidth: number;
   viewportHeight: number;
   logicalScrollTop: number;
-  invalidateAll(): void;
-  invalidateRegion(x: number, y: number, w: number, h: number): void;
+  invalidateAll: () => void;
+  invalidateRegion: (x: number, y: number, w: number, h: number) => void;
 };
 /** Total pointer movement (px) before an axis drag activates */
 /**
  * Attaches pointer and keyboard interaction handlers to the timeline.
  * Returns a cleanup function.
  */
-declare const attachTimelineInteractions: (host: IxfxTimelineElement, vcanvasEl: VCanvasElement) => (() => void);
+declare function attachTimelineInteractions(host: IxfxTimelineElement, vcanvasEl: VCanvasElement): (() => void);
+//#endregion
+//#region src/timeline/timeline-styles.d.ts
+declare const timelineStyles: CSSResult;
 //#endregion
 //#region src/transitory-label/transitory-label.d.ts
 type Effect = `slide-right` | `slide-left` | `slide-up` | `slide-down` | `fade` | `character-swap`;
@@ -5735,7 +5826,7 @@ interface TreeListElement {
 declare function monitorIndeterminate(targetElOrQuery: string | HTMLElement, watchedElsOrQueries: Array<string | HTMLElement>): () => void;
 //#endregion
 //#region src/vertical-list/types.d.ts
-type ListSelectionMode = 'none' | 'single' | 'multiple';
+type ListSelectionMode = `none` | `single` | `multiple`;
 /**
  * Controls how pointer and keyboard gestures map to selection changes.
  *
@@ -5747,7 +5838,7 @@ type ListSelectionMode = 'none' | 'single' | 'multiple';
  *
  * Switching interactionMode clears the current selection.
  */
-type ListInteractionMode = 'implicit' | 'standard' | 'manual' | 'checked' | 'vscode';
+type ListInteractionMode = `implicit` | `standard` | `manual` | `checked` | `vscode`;
 type ListSelectDetail = {
   readonly selected: ReadonlySet<Element>;
   readonly previous: ReadonlySet<Element>;
@@ -5787,10 +5878,15 @@ declare class VerticalListElement extends LitElement {
   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): void;
   removeItem(item: Element): void;
   clearItems(): void;
   select(item: Element): void;
+  selectMany(items: Iterable<Element>): void;
   deselect(item: Element): void;
   clearSelection(): void;
   selectAll(): void;
@@ -5905,5 +6001,5 @@ interface XyPad {
 //#region src/index.d.ts
 declare function init(): void;
 //#endregion
-export { AcTextChangeDetail, AcTextChangeEvent, AcTextCompletionProvider, AcTextElement, AcTextItem, AcTextSelectDetail, AcTextSelectEvent, ButtonElement, Checkbox, CheckboxChangeDetail, CheckboxChangeEvent, CheckboxEventMap, ClickSnapMode, ColourMapConfig, ColourMode, ColourPicker, type ColourPickerChangeEvent, type ColourPickerEventDetail, type ColourPickerInputEvent, ColourPickerPopup, ColourResult, ContiguousSelectEventDetail, CrossoverBehaviour, CrumbNavChangeDetail, CrumbNavChangeEvent, CrumbNavExpandDetail, CrumbNavExpandEvent, CrumbNavNavigateDetail, CrumbNavNavigateEvent, CrumbNavigationChangeDetail, CrumbNavigationChangeEvent, CrumbNavigationElement, CrumbNavigationElementEventMap, CrumbNavigationExpandDetail, CrumbNavigationExpandEvent, CrumbNavigationItemClickDetail, CrumbNavigationItemClickEvent, CrumbPathController, CrumbPathControllerOptions, CrumbPathElement, CrumbPathElementEventMap, CrumbSegment, CrumbSiblingLookupFn, type CssVars, DataDisplayComponent, DisplayTextLogic, DragSnappingFn, DragTarget, EditableLabel, EditableLabelChangeDetail, EditableLabelChangeEvent, EditableMode, EditableNumber, Effect, type ElementIncrSearch, type ElementIncrSearchOptions, Endpoints, EntryMode, FormatValueForHuman, FormattingOptions, type FuzzySearch, type FuzzySearchOptions, FuzzySearchResult, GridMode, GridResolution, HexChangeDetail, HexChangeEvent, type HighlightOptions, type HighlightTarget, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, type IconChangedDetail, type IconChangedEvent, type IncrSearch, type IncrSearchChangeCallback, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, type IncrSearchTreeOptions as IncrSearchMillerOptions, type IncrSearchTreeOptions, type IncrSearchOptions, type IncrSearchResult, type IncrSearchState, ItemsProvider, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, LabelledRadialInput, LabelledRangeInput, LaneData, LaneType, LedElement, type ListActivateDetail, type ListActivateEvent, type ListElementEventMap, type ListInteractionMode, type ListItemClickDetail, type ListItemClickEvent, type ListSelectDetail, type ListSelectEvent, type ListSelectionMode, type ListTickleDetail, type ListTickleEvent, LoadChildrenCallback, MarkerStyle, index_d_exports as Menu, type TreeActivateDetail as MillerActivateDetail, TreeActivateDetail, type TreeActivateEvent as MillerActivateEvent, TreeActivateEvent, MillerBaseElement, MillerBaseElementEventMap, type TreeCollapseDetail as MillerCollapseDetail, TreeCollapseDetail, type TreeCollapseEvent as MillerCollapseEvent, TreeCollapseEvent, MillerConfig, type TreeExpandDetail as MillerExpandDetail, TreeExpandDetail, type TreeExpandEvent as MillerExpandEvent, TreeExpandEvent, MillerHeaderClickDetail, MillerHeaderClickEvent, MillerHeaderRightClickDetail, MillerHeaderRightClickEvent, type TreeItem as MillerItem, TreeItem, type TreeItemClickDetail as MillerItemClickDetail, TreeItemClickDetail, type TreeItemClickEvent as MillerItemClickEvent, TreeItemClickEvent, MillerItemDblClickDetail, MillerItemDblClickEvent, MillerItemRightClickDetail, MillerItemRightClickEvent, MillerItemState, MillerListElement, type TreeNode as MillerNode, TreeNode, type TreeSelectDetail as MillerSelectDetail, TreeSelectDetail, type TreeSelectEvent as MillerSelectEvent, TreeSelectEvent, MillerSelectionMode, type TreeTickleDetail as MillerTickleDetail, TreeTickleDetail, type TreeTickleEvent as MillerTickleEvent, TreeTickleEvent, MillerTreeController, MillerTreeControllerOptions, NarrowedTextChangeDetail, NarrowedTextChangeEvent, NarrowedTextElement, NarrowedTextItem, NoneSelectEventDetail, type OklchValue, Orientation, PanelCloseEvent, PanelElement, PanelElementEventMap, PanelGroupElement, PanelGroupOrientation, PanelOrientation, PanelToggleDetail, PanelToggleEvent, PanelToggleInteraction, PanelVariant, PlotDataSeries, PlotDataSeriesOptions, PlotSingleAxis, PlotXyAxis, PolarPad, PolarPadInputDetail, PolarPadInputEvent, PopupItem, RadialInputChangeDetail, RadialInputChangeEvent, RadialInputElement, RadialInputInputDetail, RadialInputInputEvent, RadioGroup, RadioGroupChangeDetail, RadioGroupChangeEvent, RadioGroupMode, RadioItem, RangeElement, RangeInput, RangeMultiElement, RangeMultiInputDetail, RangeMultiInputEvent, type Rect, RectangularSelectEventDetail, ResizeMode, SelectEventDetail, SelectHorizontalElement, SelectionMode, SingleAxisAgeStyle, SingleAxisDrawStyle, SingleSelectEventDetail, SnapChangeDetail, SnapChangeEvent, SnapContainer, SnapInputDetail, SnapInputEvent, SnapLogic, SplitButton, SplitButtonMode, SplitButtonSelectDetail, SplitButtonSelectEvent, SplitLayoutElement, SwipeElement, SwipeElementEventMap, SwipeInputDetail, SwipeInputEvent, SwitcherItem, TabListChangeDetail, TabListChangeEvent, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TimelineController, TimelineControllerConfig, TimelineDraggingCallbackDetail, TimelineDraggingDetail, TimelineDraggingEvent, TimelineElementEventMap, TimelineEvent, TimelineEventMoveDetail, TimelineEventMoveEvent, TimelineEventResizeDetail, TimelineEventResizeEvent, TimelineSelectionChangeDetail, TimelineSelectionChangeEvent, TimelineTickleChangeDetail, TimelineTickleChangeEvent, TimelineTrack, TimelineTrackReorderDetail, TimelineTrackReorderEvent, TimelineTrackResizeDetail, TimelineTrackResizeEvent, TimelineTrackSelectDetail, TimelineTrackSelectEvent, TimelineTrackTabElement, TooltipElement, TooltipOrientations, TrackHeightMode, TrackLayout, TransitoryLabelElement, TreeBaseElement, TreeBaseElementEventMap, TreeComponent, TreeComponentEventMap, TreeConfig, TreeController, TreeControllerOptions, TreeDataModel, TreeDataModelOptions, TreeExclusivity, TreeFilterPredicate, TreeInteractionMode, TreeListElement, TreeSearchHost, TreeSelectionFilter, UserScale, ValueMode, VerticalListElement, ViewRange, XyAgeStyle, XyDrawStyle, XyPad, XyPadEventMap, XyPadInputDetail, XyPadInputEvent, applyAgeModification, applyHighlights, attachTimelineInteractions, buildHighlightTargets, clearHighlights, computeColour, createAcCompletionProvider, createElementIncrSearch, createFuzzySearch, createIncrSearch, getIcon, hasIcon, iconBus, init, monitorIndeterminate, parseColourScaleAttr, readBaseColour, registerIcon, resolveCssVars, resolveGrid, svgToDataUri, timelineStyles };
+export { AcTextChangeDetail, AcTextChangeEvent, AcTextCompletionProvider, AcTextElement, AcTextItem, AcTextSelectDetail, AcTextSelectEvent, type AcTokenAddDetail, type AcTokenAddEvent, type AcTokenCompletionProvider, AcTokenElement, type AcTokenElementEventMap, type AcTokenItem, type AcTokenRemoveDetail, type AcTokenRemoveEvent, type AcTokenizerFn, type AcTokensChangeDetail, type AcTokensChangeEvent, ButtonElement, Checkbox, CheckboxChangeDetail, CheckboxChangeEvent, CheckboxEventMap, ClickSnapMode, ColourMapConfig, ColourMode, ColourPicker, type ColourPickerChangeEvent, type ColourPickerEventDetail, type ColourPickerInputEvent, ColourPickerPopup, ColourResult, ContiguousSelectEventDetail, CrossoverBehaviour, CrumbNavChangeDetail, CrumbNavChangeEvent, CrumbNavExpandDetail, CrumbNavExpandEvent, CrumbNavNavigateDetail, CrumbNavNavigateEvent, CrumbNavigationChangeDetail, CrumbNavigationChangeEvent, CrumbNavigationElement, CrumbNavigationElementEventMap, CrumbNavigationExpandDetail, CrumbNavigationExpandEvent, CrumbNavigationItemClickDetail, CrumbNavigationItemClickEvent, CrumbPathController, CrumbPathControllerOptions, CrumbPathElement, CrumbPathElementEventMap, CrumbSegment, CrumbSiblingLookupFn, type CssVars, DataDisplayComponent, DisplayTextLogic, DragSnappingFn, DragTarget, EditableLabel, EditableLabelChangeDetail, EditableLabelChangeEvent, EditableMode, EditableNumber, Effect, type ElementIncrSearch, type ElementIncrSearchOptions, Endpoints, EntryMode, FormatValueForHuman, FormattingOptions, type FuzzySearch, type FuzzySearchOptions, FuzzySearchResult, GridMode, GridResolution, HexChangeDetail, HexChangeEvent, type HighlightOptions, type HighlightTarget, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, type IconChangedDetail, type IconChangedEvent, type IncrSearch, type IncrSearchChangeCallback, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, type IncrSearchTreeOptions as IncrSearchMillerOptions, type IncrSearchTreeOptions, type IncrSearchOptions, type IncrSearchResult, type IncrSearchState, ItemsProvider, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, LabelledRadialInput, LabelledRangeInput, LaneData, LaneType, LedElement, type ListActivateDetail, type ListActivateEvent, type ListElementEventMap, type ListInteractionMode, type ListItemClickDetail, type ListItemClickEvent, type ListSelectDetail, type ListSelectEvent, type ListSelectionMode, type ListTickleDetail, type ListTickleEvent, LoadChildrenCallback, MarkerStyle, index_d_exports as Menu, type TreeActivateDetail as MillerActivateDetail, TreeActivateDetail, type TreeActivateEvent as MillerActivateEvent, TreeActivateEvent, MillerBaseElement, MillerBaseElementEventMap, type TreeCollapseDetail as MillerCollapseDetail, TreeCollapseDetail, type TreeCollapseEvent as MillerCollapseEvent, TreeCollapseEvent, MillerConfig, type TreeExpandDetail as MillerExpandDetail, TreeExpandDetail, type TreeExpandEvent as MillerExpandEvent, TreeExpandEvent, MillerHeaderClickDetail, MillerHeaderClickEvent, MillerHeaderRightClickDetail, MillerHeaderRightClickEvent, type TreeItem as MillerItem, TreeItem, type TreeItemClickDetail as MillerItemClickDetail, TreeItemClickDetail, type TreeItemClickEvent as MillerItemClickEvent, TreeItemClickEvent, MillerItemDblClickDetail, MillerItemDblClickEvent, MillerItemRightClickDetail, MillerItemRightClickEvent, MillerItemState, MillerListElement, type TreeNode as MillerNode, TreeNode, type TreeSelectDetail as MillerSelectDetail, TreeSelectDetail, type TreeSelectEvent as MillerSelectEvent, TreeSelectEvent, MillerSelectionMode, type TreeTickleDetail as MillerTickleDetail, TreeTickleDetail, type TreeTickleEvent as MillerTickleEvent, TreeTickleEvent, MillerTreeController, MillerTreeControllerOptions, NarrowedTextChangeDetail, NarrowedTextChangeEvent, NarrowedTextElement, NarrowedTextItem, NoneSelectEventDetail, type OklchValue, Orientation, PanelCloseEvent, PanelElement, PanelElementEventMap, PanelGroupElement, PanelGroupOrientation, PanelOrientation, PanelToggleDetail, PanelToggleEvent, PanelToggleInteraction, PanelVariant, PlotDataSeries, PlotDataSeriesOptions, PlotSingleAxis, PlotXyAxis, PolarPad, PolarPadInputDetail, PolarPadInputEvent, PopupItem, RadialInputChangeDetail, RadialInputChangeEvent, RadialInputElement, RadialInputInputDetail, RadialInputInputEvent, RadioGroup, RadioGroupChangeDetail, RadioGroupChangeEvent, RadioGroupMode, RadioItem, RangeElement, RangeInput, RangeMultiElement, RangeMultiInputDetail, RangeMultiInputEvent, type Rect, RectangularSelectEventDetail, ResizeMode, SelectEventDetail, SelectHorizontalElement, SelectionMode, SingleAxisAgeStyle, SingleAxisDrawStyle, SingleSelectEventDetail, SnapChangeDetail, SnapChangeEvent, SnapContainer, SnapInputDetail, SnapInputEvent, SnapLogic, SplitButton, SplitButtonMode, SplitButtonSelectDetail, SplitButtonSelectEvent, SplitLayoutElement, SwipeElement, SwipeElementEventMap, SwipeInputDetail, SwipeInputEvent, SwitcherItem, TabListChangeDetail, TabListChangeEvent, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TimelineController, TimelineControllerConfig, TimelineDraggingCallbackDetail, TimelineDraggingDetail, TimelineDraggingEvent, TimelineElementEventMap, TimelineEvent, TimelineEventMoveDetail, TimelineEventMoveEvent, TimelineEventResizeDetail, TimelineEventResizeEvent, TimelineSelectionChangeDetail, TimelineSelectionChangeEvent, TimelineTickleChangeDetail, TimelineTickleChangeEvent, TimelineTrack, TimelineTrackReorderDetail, TimelineTrackReorderEvent, TimelineTrackResizeDetail, TimelineTrackResizeEvent, TimelineTrackSelectDetail, TimelineTrackSelectEvent, TimelineTrackTabElement, TooltipElement, TooltipOrientations, TrackHeightMode, TrackLayout, TransitoryLabelElement, TreeBaseElement, TreeBaseElementEventMap, TreeComponent, TreeComponentEventMap, TreeConfig, TreeController, TreeControllerOptions, TreeDataModel, TreeDataModelOptions, TreeExclusivity, TreeFilterPredicate, TreeInteractionMode, TreeListElement, TreeSearchHost, TreeSelectionFilter, UserScale, ValueMode, VerticalListElement, ViewRange, XyAgeStyle, XyDrawStyle, XyPad, XyPadEventMap, XyPadInputDetail, XyPadInputEvent, applyAgeModification, applyHighlights, attachTimelineInteractions, buildHighlightTargets, clearHighlights, computeColour, createAcCompletionProvider, createElementIncrSearch, createFuzzySearch, createIncrSearch, getIcon, hasIcon, iconBus, init, monitorIndeterminate, parseColourScaleAttr, readBaseColour, registerIcon, resolveCssVars, resolveGrid, svgToDataUri, timelineStyles };
 //# sourceMappingURL=index.d.ts.map