@ixfx/components 0.7.4 → 0.8.0

package/dist/index.js

@@ -8,22 +8,21 @@ import { a as iconBus, c as setIconFont, i as hasIcon, l as svgToDataUri, n as g
 import { t as IxfxIconElement } from "./icon-DcEEGQa_.js";
 import { AcTextElement } from "./ac-text.js";
 import { t as DataController } from "./data-controller-DOlmqNKb.js";
-import { n as createIncrSearch, r as createFuzzySearch, t as createElementIncrSearch } from "./element-search-Y8SRfPGM.js";
-import { n as createAcCompletionProvider, t as IncrSearchTreeController } from "./incr-search-vCzuao-2.js";
+import { a as LIST_SEARCH_COMMAND_IDS, c as createElementListSearchAdapter, d as createDataListSearchAdapter, f as IncrSearchTreeController, h as createFuzzySearch, i as ListSearchController, l as KeyedElementIndex, m as createAcCompletionProvider, n as listSearchStyles, o as registerListSearchCommands, p as createIncrSearch, r as LIST_SEARCH_MODES, s as createElementIncrSearch, t as createTreeListSearchAdapter, u as keyForElement } from "./incr-search-C05WjbZh.js";
 import { AcTokenElement } from "./ac-token.js";
 import { i as ICON_CLOSE, n as ICON_CHECK, r as ICON_CHEVRON_DOWN, t as ICON_CARET_RIGHT } from "./defaults-BJwDsMH4.js";
 import "./icons.js";
 import { t as prominenceStyles } from "./prominence-DlFShic3.js";
 import { n as buttonStyles, t as ButtonElement } from "./button-DsFbV4XD.js";
-import { i as keyForElement, n as isMultiMode, r as KeyedElementIndex, t as ListSelectionController } from "./list-selection-controller-CUo-Hhcm.js";
 import { a as prefersReducedMotion, i as listItemFadeKeyframes, n as animateListItemIn, r as animateListItemOut, t as LIST_ITEM_MOTION_MS } from "./list-item-animation-DuiwgN3l.js";
+import { n as isMultiMode, t as ListSelectionController } from "./list-selection-controller-DTFI40li.js";
 import "./interaction-Cr13azbM.js";
 import "./menu-item-Bx-Fs7jq.js";
 import { Checkbox } from "./checkbox.js";
 import { n as ColourPicker, t as ColourPickerPopup } from "./colour-picker-Ddsk-7E_.js";
 import { LabelledRangeInput } from "./labelled-range-input.js";
 import { t as collectDataResult } from "./data-provider-35TyWclX.js";
-import { i as TreeDataModel, n as TreeListElement, r as TreeBaseElement, t as TreeController } from "./tree-B74zdI60.js";
+import { i as TreeDataModel, n as TreeListElement, r as TreeBaseElement, t as TreeController } from "./tree-Chptss7I.js";
 import { t as scrollFadeStyles } from "./scroll-fade-CAs1EabA.js";
 import { NarrowedTextElement } from "./narrowed-text.js";
 import { CrumbNavigationElement } from "./crumbs.js";
@@ -38,7 +37,7 @@ import { TitlebarElement } from "./titlebar.js";
 import { EditableLabel } from "./editable-label.js";
 import { n as EditableNumber, t as LabelledSliderInput } from "./labelled-slider-input-BInB5GKL.js";
 import { t as FormElement } from "./form-CsXJX15p.js";
-import { GridListElement } from "./grid-list.js";
+import { t as GridListElement } from "./grid-list-nRUQOcEL.js";
 import { PanelElement } from "./panel.js";
 import { GroupedItemListerElement } from "./grouped-item-lister.js";
 import { VerticalListElement } from "./vertical-list.js";
@@ -49,7 +48,7 @@ import { t as SliderInputElement } from "./slider-input-Bl1hFE89.js";
 import { LedElement } from "./led.js";
 import { MillerBaseElement, MillerListElement, MillerTreeController } from "./miller.js";
 import { NotificationPillElement } from "./notifier.js";
-import { a as TooltipElement, c as computeColour, i as PlotMultiAxis, l as parseColourScaleAttr, n as PlotSingleAxis, o as PlotDataSeries, r as PlotHistogram, s as applyAgeModification, t as PlotXyAxis, u as readBaseColour } from "./xy-axis-VrX8dmvS.js";
+import { a as TooltipElement, c as computeColour, i as PlotMultiAxis, l as parseColourScaleAttr, n as PlotSingleAxis, o as PlotDataSeries, r as PlotHistogram, s as applyAgeModification, t as PlotXyAxis, u as readBaseColour } from "./xy-axis-DzM1brBZ.js";
 import { PolarPad } from "./polar-pad.js";
 import { t as tooltipValueStyles } from "./tooltip-CJt3WLmN.js";
 import { RangeInput } from "./range-input.js";
@@ -2944,7 +2943,7 @@ TabListItemElement = __decorate([safeCustomElement(`ixfx-tab-list-item`)], TabLi
 //#endregion
 //#region src/dock/dock-panel.ts
 /** Pointer movement threshold before a titlebar press becomes a dock drag. */
-const DRAG_THRESHOLD_PX$1 = 5;
+const DRAG_THRESHOLD_PX$2 = 5;
 let DockPanelElement = class DockPanelElement extends LitElement {
 	constructor(..._args) {
 		super(..._args);
@@ -2976,7 +2975,7 @@ let DockPanelElement = class DockPanelElement extends LitElement {
 		this._onPointerMove = (event) => {
 			if (this._dragPointerId === null || event.pointerId !== this._dragPointerId) return;
 			if (!this._dragStarted) {
-				if (Math.hypot(event.clientX - this._dragStartX, event.clientY - this._dragStartY) < DRAG_THRESHOLD_PX$1) return;
+				if (Math.hypot(event.clientX - this._dragStartX, event.clientY - this._dragStartY) < DRAG_THRESHOLD_PX$2) return;
 				this._dragStarted = true;
 				const pointerId = this._dragPointerId;
 				this._teardownDragListeners();
@@ -3131,7 +3130,7 @@ DockPanelElement = __decorate([safeCustomElement(`ixfx-dock-panel`)], DockPanelE
 /** Fraction of the leaf rect (from each edge) that forms the split bands. */
 const BAND = .25;
 /** Pointer movement threshold before a press becomes a dock drag (matches tab-list). */
-const DRAG_THRESHOLD_PX = 5;
+const DRAG_THRESHOLD_PX$1 = 5;
 /** Tolerance (px) when matching a child gutter endpoint to a parent gutter line. */
 const JUNCTION_TOL_PX = 6;
 /** Junction points closer than this merge into one handle (a 4-way cross yields one per side). */
@@ -3246,7 +3245,7 @@ let DockHostElement = class DockHostElement extends LitElement {
 		this._onTabDragMove = (event) => {
 			const pending = this._tabDragPending;
 			if (pending === null || event.pointerId !== pending.pointerId) return;
-			if (Math.hypot(event.clientX - pending.startX, event.clientY - pending.startY) < DRAG_THRESHOLD_PX) return;
+			if (Math.hypot(event.clientX - pending.startX, event.clientY - pending.startY) < DRAG_THRESHOLD_PX$1) return;
 			this._tabDragPending = null;
 			this._teardownTabDragListeners();
 			this._suppressNextClick();
@@ -5292,6 +5291,66 @@ __decorate([query(`.text`)], PanTextElement.prototype, "_textEl", void 0);
 PanTextElement = __decorate([safeCustomElement(`ixfx-pan-text`)], PanTextElement);
 //#endregion
 //#region src/panel/panel-group.ts
+/** Pointer movement threshold (px) before a press becomes a drag. */
+const DRAG_THRESHOLD_PX = 5;
+/**
+* Pure helper: nearest gap index for a pointer position along one axis.
+* `edges` are the [start, end] of each sibling (excluding the drag source),
+* in DOM order. Returns 0..edges.length.
+*/
+function panelGapIndex(edges, pos) {
+	let bestGap = 0;
+	let bestDist = Number.POSITIVE_INFINITY;
+	for (let i = 0; i < edges.length; i++) {
+		const [start, end] = edges[i];
+		if (pos < (start + end) / 2) {
+			const d = Math.abs(pos - start);
+			if (d < bestDist) {
+				bestDist = d;
+				bestGap = i;
+			}
+		} else {
+			const d = Math.abs(pos - end);
+			if (d < bestDist) {
+				bestDist = d;
+				bestGap = i + 1;
+			}
+		}
+	}
+	return bestGap;
+}
+let panelGhostStylesInjected = false;
+/**
+* Global ghost styling so the drag preview matches `ixfx-titlebar` chrome
+* (font, colours, padding). Injected once; the ghost lives outside shadow DOM
+* (body/theme container) so component styles cannot reach it.
+*/
+function injectPanelGhostStyles() {
+	if (panelGhostStylesInjected) return;
+	panelGhostStylesInjected = true;
+	const style = document.createElement(`style`);
+	style.textContent = `
+    .ixfx-drag-ghost.ixfx-panel-group-ghost {
+      padding: var(--space-s, 8px) var(--space-m, 16px);
+      background: var(--surface-4);
+      color: var(--surface-3-text);
+      border: none;
+      border-radius: var(--radius-s, 4px);
+      font-family: var(--font-family);
+      font-size: var(--text-m);
+      font-weight: var(--font-weight-bold, 600);
+      min-height: 2em;
+      user-select: none;
+      -webkit-user-select: none;
+    }
+    .ixfx-drag-ghost.ixfx-panel-group-ghost ixfx-icon {
+      width: 1.25em;
+      height: 1.25em;
+      flex-shrink: 0;
+    }
+  `;
+	document.head.appendChild(style);
+}
 let PanelGroupElement = class PanelGroupElement extends LitElement {
 	constructor(..._args) {
 		super(..._args);
@@ -5299,22 +5358,105 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
 		this.variant = `titlebar`;
 		this.toggleInteraction = `implicit`;
 		this.collapsible = true;
-		this.allowMultiple = false;
-		this.gap = `var(--space-m)`;
+		this.accordion = false;
+		this.allowReorder = false;
+		this._dragState = null;
+		this._suppressNextClick = false;
+		this._onClickCapture = (event) => {
+			if (!this._suppressNextClick) return;
+			this._suppressNextClick = false;
+			event.preventDefault();
+			event.stopPropagation();
+		};
+		this._onKeyDown = (event) => {
+			const state = this._dragState;
+			if (event.key !== `Escape` || !state?.active) return;
+			event.preventDefault();
+			const pointerId = state.pointerId;
+			this._abortDrag();
+			this._endDrag(pointerId);
+		};
+		this._onPointerDown = (event) => {
+			if (!this.allowReorder || event.button !== 0) return;
+			const target = this._findDragTarget(event);
+			if (!target?.parentNode) return;
+			const fromIndex = Array.prototype.indexOf.call(target.parentNode.children, target);
+			if (fromIndex < 0) return;
+			this._dragState = {
+				pointerId: event.pointerId,
+				source: target,
+				fromIndex,
+				startX: event.clientX,
+				startY: event.clientY,
+				active: false,
+				ghost: null,
+				gapIndex: void 0
+			};
+			window.addEventListener(`pointermove`, this._onPointerMove);
+			window.addEventListener(`pointerup`, this._onPointerUp);
+			window.addEventListener(`pointercancel`, this._onPointerCancel);
+		};
+		this._onPointerMove = (event) => {
+			const state = this._dragState;
+			if (!state || event.pointerId !== state.pointerId) return;
+			const distance = Math.hypot(event.clientX - state.startX, event.clientY - state.startY);
+			if (!state.active) {
+				if (distance < DRAG_THRESHOLD_PX) return;
+				this._beginDrag(event);
+			}
+			state.ghost?.move(event.clientX, event.clientY);
+			const gap = this._computeGapIndex(event.clientX, event.clientY);
+			if (gap !== state.gapIndex) {
+				state.gapIndex = gap;
+				this.requestUpdate();
+			}
+		};
+		this._onPointerUp = (event) => {
+			const state = this._dragState;
+			if (!state || event.pointerId !== state.pointerId) return;
+			if (state.active) {
+				const gap = this._computeGapIndex(event.clientX, event.clientY);
+				this._commitDrag(state.source, state.fromIndex, gap);
+			}
+			this._endDrag(event.pointerId);
+		};
+		this._onPointerCancel = (event) => {
+			const state = this._dragState;
+			if (!state || event.pointerId !== state.pointerId) return;
+			this._abortDrag();
+			this._endDrag(event.pointerId);
+		};
 	}
 	_onPanelToggle(e) {
 		const panel = e.target;
 		if (panel.collapsed) return;
-		if (this.allowMultiple) return;
+		if (!this.accordion) return;
 		for (const p of this._panels) if (p !== panel) p.collapsed = true;
 	}
+	connectedCallback() {
+		super.connectedCallback();
+		this.addEventListener(`click`, this._onClickCapture, true);
+	}
+	disconnectedCallback() {
+		this.removeEventListener(`click`, this._onClickCapture, true);
+		if (this._dragState) {
+			this._abortDrag();
+			this._endDrag(this._dragState.pointerId);
+		}
+		super.disconnectedCallback();
+	}
 	firstUpdated() {
+		if (this.gap !== void 0) this.style.setProperty(`--group-gap`, this.gap);
 		this.updateComplete.then(() => {
 			this._propagateAll();
 		});
 	}
 	updated(changed) {
 		super.updated(changed);
+		if (changed.has(`gap`)) {
+			if (this.gap !== void 0) this.style.setProperty(`--group-gap`, this.gap);
+			else this.style.removeProperty(`--group-gap`);
+		}
 		if (changed.has(`variant`) || changed.has(`toggleInteraction`) || changed.has(`orientation`) || changed.has(`collapsible`)) this.updateComplete.then(() => {
 			this._propagateAll();
 		});
@@ -5329,19 +5471,167 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
 			else panel.removeAttribute(`collapsible`);
 		}
 	}
+	_onSlotChange() {
+		this.updateComplete.then(() => {
+			this._propagateAll();
+		});
+	}
+	/**
+	* Walk composedPath for the nearest ixfx-panel, requiring the press to have
+	* gone through an ixfx-titlebar (titlebar-anywhere drag). Bails when the
+	* path crosses interactive chrome (buttons/links/inputs/toolbar/caret/close)
+	* so those controls always win over dragging.
+	*/
+	_findDragTarget(event) {
+		if (!this.allowReorder) return null;
+		const path = event.composedPath();
+		let panel = null;
+		let viaTitlebar = false;
+		for (const node of path) {
+			if (!(node instanceof HTMLElement)) continue;
+			const tag = node.tagName;
+			if (tag === `BUTTON` || tag === `A` || tag === `INPUT` || tag === `SELECT` || tag === `TEXTAREA`) return null;
+			if (node.classList.contains(`toolbar`) || node.classList.contains(`close-btn`) || node.classList.contains(`caret-btn`)) return null;
+			if (node.hasAttribute?.(`slot`) && node.getAttribute(`slot`) === `toolbar`) return null;
+			if (tag === `IXFX-TITLEBAR`) viaTitlebar = true;
+			if (!panel && tag === `IXFX-PANEL`) panel = node;
+		}
+		if (!panel || !viaTitlebar) return null;
+		return panel;
+	}
+	_beginDrag(event) {
+		const state = this._dragState;
+		if (!state || state.active) return;
+		try {
+			this.setPointerCapture(event.pointerId);
+		} catch {}
+		state.active = true;
+		this.setAttribute(`dragging`, ``);
+		state.source.setAttribute(`drag-source`, ``);
+		state.ghost = this._createGhost(state.source);
+		state.ghost?.move(event.clientX, event.clientY);
+	}
+	_abortDrag() {
+		const state = this._dragState;
+		if (!state) return;
+		state.source.removeAttribute(`drag-source`);
+		if (state.gapIndex !== void 0) {
+			state.gapIndex = void 0;
+			this.requestUpdate();
+		}
+	}
+	_endDrag(pointerId) {
+		const state = this._dragState;
+		if (!state) return;
+		state.ghost?.destroy();
+		state.ghost = null;
+		this.removeAttribute(`dragging`);
+		this._dragState = null;
+		window.removeEventListener(`pointermove`, this._onPointerMove);
+		window.removeEventListener(`pointerup`, this._onPointerUp);
+		window.removeEventListener(`pointercancel`, this._onPointerCancel);
+		try {
+			this.releasePointerCapture(pointerId);
+		} catch {}
+		this.requestUpdate();
+	}
+	_commitDrag(source, fromIndex, gapIndex) {
+		source.removeAttribute(`drag-source`);
+		const siblings = (this._panels ?? []).filter((el) => el !== source);
+		const target = gapIndex === void 0 ? siblings.length : Math.max(0, Math.min(gapIndex, siblings.length));
+		const parent = source.parentNode;
+		if (!parent) return;
+		const ref = siblings[target] ?? null;
+		parent.insertBefore(source, ref);
+		const toIndex = Array.prototype.indexOf.call(parent.children, source);
+		if (toIndex === fromIndex) return;
+		this._suppressNextClick = true;
+		this.dispatchEvent(new CustomEvent(`reorder`, {
+			bubbles: true,
+			composed: true,
+			detail: {
+				fromIndex,
+				toIndex,
+				panel: source
+			}
+		}));
+	}
+	_createGhost(source) {
+		const content = document.createElement(`span`);
+		content.style.display = `inline-flex`;
+		content.style.alignItems = `center`;
+		content.style.padding = `0 var(--space-s, 8px)`;
+		content.style.minWidth = `0`;
+		if (source.iconName) {
+			const icon = document.createElement(`ixfx-icon`);
+			icon.name = source.iconName;
+			content.appendChild(icon);
+		}
+		const label = document.createElement(`span`);
+		label.textContent = (source.title || (source.textContent ?? ``).trim()).slice(0, 60);
+		label.style.paddingLeft = `1ch`;
+		label.style.overflow = `hidden`;
+		label.style.textOverflow = `ellipsis`;
+		label.style.whiteSpace = `nowrap`;
+		content.appendChild(label);
+		try {
+			injectPanelGhostStyles();
+			return createDragGhost({
+				anchor: source,
+				content,
+				className: `ixfx-panel-group-ghost`
+			});
+		} catch {
+			return null;
+		}
+	}
+	/**
+	* Nearest panel gap to the pointer, ignoring the drag source.
+	* The perpendicular axis is ignored — the pointer always resolves to a gap.
+	*/
+	_computeGapIndex(clientX, clientY) {
+		const state = this._dragState;
+		if (!state) return;
+		const siblings = (this._panels ?? []).filter((el) => el !== state.source);
+		if (siblings.length === 0) return 0;
+		const useX = this.orientation === `horizontal`;
+		const pos = useX ? clientX : clientY;
+		return panelGapIndex(siblings.map((el) => {
+			const rect = el.getBoundingClientRect();
+			return [useX ? rect.left : rect.top, useX ? rect.right : rect.bottom];
+		}), pos);
+	}
+	_computeCaretStyle() {
+		const state = this._dragState;
+		if (!state?.active || state.gapIndex === void 0) return;
+		const siblings = (this._panels ?? []).filter((el) => el !== state.source);
+		if (siblings.length === 0) return;
+		const hostRect = this.getBoundingClientRect();
+		if (!hostRect) return;
+		const gap = Math.max(0, Math.min(state.gapIndex, siblings.length));
+		const rect = gap < siblings.length ? siblings[gap].getBoundingClientRect() : siblings[siblings.length - 1].getBoundingClientRect();
+		if (this.orientation === `horizontal`) return `transform: translate(${(gap < siblings.length ? rect.left : rect.right) - hostRect.left - 1}px, 0); width: 2px; height: ${hostRect.height}px;`;
+		return `transform: translate(0, ${(gap < siblings.length ? rect.top : rect.bottom) - hostRect.top - 1}px); width: ${hostRect.width}px; height: 2px;`;
+	}
 	render() {
+		const caretStyle = this._computeCaretStyle();
 		return html`
       <slot
         @toggle=${this._onPanelToggle}
+        @slotchange=${this._onSlotChange}
+        @pointerdown=${this._onPointerDown}
+        @keydown=${this._onKeyDown}
       ></slot>
+      ${caretStyle ? html`<div class="drop-caret" style=${caretStyle}></div>` : nothing}
     `;
 	}
 	static {
 		this.styles = css`
     :host {
+      position: relative;
       display: flex;
       flex-direction: column;
-      gap: var(--group-gap, var(--space-m));
+      gap: var(--group-gap, var(--space-l));
     }
 
     :host([orientation="horizontal"]) {
@@ -5362,6 +5652,36 @@ let PanelGroupElement = class PanelGroupElement extends LitElement {
       flex-basis: content;
       min-width: 0;
     }
+
+    :host([allow-reorder]) ::slotted(ixfx-panel) {
+      cursor: grab;
+    }
+
+    :host([allow-reorder]) ::slotted(ixfx-panel[drag-source]) {
+      cursor: grabbing;
+      opacity: 0.4;
+    }
+
+    /* While dragging, suppress text selection inside the panels. */
+    :host([dragging]),
+    :host([dragging]) ::slotted(*) {
+      user-select: none;
+      -webkit-user-select: none;
+    }
+
+    :host([dragging]) ::slotted(ixfx-panel) {
+      cursor: grabbing;
+    }
+
+    .drop-caret {
+      position: absolute;
+      top: 0;
+      left: 0;
+      background: var(--accent);
+      border-radius: 1px;
+      pointer-events: none;
+      z-index: 1;
+    }
   `;
 	}
 };
@@ -5377,8 +5697,14 @@ __decorate([property({
 __decorate([property({ type: Boolean })], PanelGroupElement.prototype, "collapsible", void 0);
 __decorate([property({
 	type: Boolean,
-	attribute: `allow-multiple`
-})], PanelGroupElement.prototype, "allowMultiple", void 0);
+	attribute: `accordion`,
+	reflect: true
+})], PanelGroupElement.prototype, "accordion", void 0);
+__decorate([property({
+	type: Boolean,
+	attribute: `allow-reorder`,
+	reflect: true
+})], PanelGroupElement.prototype, "allowReorder", void 0);
 __decorate([property()], PanelGroupElement.prototype, "gap", void 0);
 __decorate([queryAssignedElements({ slot: `` })], PanelGroupElement.prototype, "_panels", void 0);
 PanelGroupElement = __decorate([safeCustomElement(`ixfx-panel-group`)], PanelGroupElement);
@@ -7981,6 +8307,6 @@ function init() {
 	console.log(`Init`);
 }
 //#endregion
-export { AcTextElement, AcTokenElement, ButtonElement, Checkbox, ColourPicker, ColourPickerPopup, CrumbNavigationElement, CrumbPathController, CrumbPathElement, DataController, DataDisplayComponent, DataGridElement, DataTableElement, DetailListElement, DockHostElement, DockPanelElement, EditableLabel, EditableNumber, FormElement, FormGroupElement, FormPartElement, GridListElement, GroupedItemListerElement, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, KeyedElementIndex, LIST_ITEM_MOTION_MS, LabelledRadialInput, LabelledRangeInput, LabelledSliderInput, LedElement, ListSelectionController, menu_exports as Menu, MillerBaseElement, MillerListElement, MillerTreeController, NarrowedTextElement, NotificationManager, NotificationPillElement, PanTextElement, PanelElement, PanelGroupElement, PlotDataSeries, PlotHistogram, PlotMultiAxis, PlotSingleAxis, PlotXyAxis, PolarPad, RadialInputElement, RadioGroup, RangeElement, RangeInput, RangeMultiElement, RatingElement, SelectHorizElement, SliderInputElement, SlidingNumberElement, SnackbarElement, SnapContainer, SplitButton, SplitLayoutElement, SplitPanelElement, SwipeElement, TabController, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TextShimmerElement, TickledController, TimelineController, TimelineTrackTabElement, TitlebarElement, ToolbarElement, ToolbarGroupElement, TooltipElement, TransitoryLabelElement, TreeBaseElement, TreeController, TreeDataModel, TreeKeyboardNavController, TreeListElement, TwoSplitLayoutElement, VerticalListElement, XyPad, addPanelToStack, animateListItemIn, animateListItemOut, applyAgeModification, applyHighlights, applySnapshot, attachTimelineInteractions, buildHighlightTargets, buildModel, clearHighlights, collectContainerNames, collectDataResult, collectPanelIds, collectStackPaths, computeColour, computeLeafGeoms, createAcCompletionProvider, createElementIncrSearch, createEmptyLayout, createEmptyStack, createFuzzySearch, createIncrSearch, createPillRenderer, createSplit, createStack, createTreeListAdapter, createVerticalListAdapter, distribute, extractStack, findNode, findParentOf, findStackOf, findStackPathByName, getActiveDragPanelId, getIcon, getIconEntry, getIconFont, getLeafNeighbours, hasIcon, iconBus, init, insertBeside, isDragging, isMultiMode, isSplit, isStack, keyForElement, listItemFadeKeyframes, monitorIndeterminate, moveLeafNodeToEdge, moveLeafStep, normalise, normalize, parseColourScaleAttr, parseLayout, pointerOverAnyHost, prefersReducedMotion, readBaseColour, registerFontIcon, registerIcon, removePanelFromStack, resolveCssVars, resolveGrid, resolveLeafPath, resolveTracks, serializeLayout, setActive, setIconFont, svgToDataUri, swapLeaves, tickledItemStyles, tickledStyles, timelineStyles, toSnapshot, walk, wrapRoot };
+export { AcTextElement, AcTokenElement, ButtonElement, Checkbox, ColourPicker, ColourPickerPopup, CrumbNavigationElement, CrumbPathController, CrumbPathElement, DataController, DataDisplayComponent, DataGridElement, DataTableElement, DetailListElement, DockHostElement, DockPanelElement, EditableLabel, EditableNumber, FormElement, FormGroupElement, FormPartElement, GridListElement, GroupedItemListerElement, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, KeyedElementIndex, LIST_ITEM_MOTION_MS, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, LabelledRadialInput, LabelledRangeInput, LabelledSliderInput, LedElement, ListSearchController, ListSelectionController, menu_exports as Menu, MillerBaseElement, MillerListElement, MillerTreeController, NarrowedTextElement, NotificationManager, NotificationPillElement, PanTextElement, PanelElement, PanelGroupElement, PlotDataSeries, PlotHistogram, PlotMultiAxis, PlotSingleAxis, PlotXyAxis, PolarPad, RadialInputElement, RadioGroup, RangeElement, RangeInput, RangeMultiElement, RatingElement, SelectHorizElement, SliderInputElement, SlidingNumberElement, SnackbarElement, SnapContainer, SplitButton, SplitLayoutElement, SplitPanelElement, SwipeElement, TabController, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TextShimmerElement, TickledController, TimelineController, TimelineTrackTabElement, TitlebarElement, ToolbarElement, ToolbarGroupElement, TooltipElement, TransitoryLabelElement, TreeBaseElement, TreeController, TreeDataModel, TreeKeyboardNavController, TreeListElement, TwoSplitLayoutElement, VerticalListElement, XyPad, addPanelToStack, animateListItemIn, animateListItemOut, applyAgeModification, applyHighlights, applySnapshot, attachTimelineInteractions, buildHighlightTargets, buildModel, clearHighlights, collectContainerNames, collectDataResult, collectPanelIds, collectStackPaths, computeColour, computeLeafGeoms, createAcCompletionProvider, createDataListSearchAdapter, createElementIncrSearch, createElementListSearchAdapter, createEmptyLayout, createEmptyStack, createFuzzySearch, createIncrSearch, createPillRenderer, createSplit, createStack, createTreeListAdapter, createTreeListSearchAdapter, createVerticalListAdapter, distribute, extractStack, findNode, findParentOf, findStackOf, findStackPathByName, getActiveDragPanelId, getIcon, getIconEntry, getIconFont, getLeafNeighbours, hasIcon, iconBus, init, insertBeside, isDragging, isMultiMode, isSplit, isStack, keyForElement, listItemFadeKeyframes, listSearchStyles, monitorIndeterminate, moveLeafNodeToEdge, moveLeafStep, normalise, normalize, panelGapIndex, parseColourScaleAttr, parseLayout, pointerOverAnyHost, prefersReducedMotion, readBaseColour, registerFontIcon, registerIcon, registerListSearchCommands, removePanelFromStack, resolveCssVars, resolveGrid, resolveLeafPath, resolveTracks, serializeLayout, setActive, setIconFont, svgToDataUri, swapLeaves, tickledItemStyles, tickledStyles, timelineStyles, toSnapshot, walk, wrapRoot };
 
 //# sourceMappingURL=index.js.map