haze-ui 1.34.0 → 1.35.0

package/dist/components/Tree/Tree.js

@@ -8,9 +8,9 @@ import i from "../VirtualList/VirtualList.js";
 import { filterTreeByQuery as a, findNodeByKey as o, flattenVisibleTree as s, getChildKeys as c, getParentKey as l, mergeLoadedChildren as u, pruneLoadedChildren as d } from "./utils.js";
 import ee from "./TreeItem.js";
 /* empty css               */
-import { useCallback as f, useEffect as p, useMemo as m, useRef as h, useState as g } from "react";
-import { jsx as _, jsxs as te } from "react/jsx-runtime";
-import { useControl as v } from "react-use-control";
+import { useCallback as f, useEffect as p, useImperativeHandle as m, useMemo as h, useRef as g, useState as _ } from "react";
+import { jsx as v, jsxs as te } from "react/jsx-runtime";
+import { useControl as y } from "react-use-control";
 //#region src/lib/components/Tree/Tree.tsx
 var ne = "haze-Tree__base", re = "haze-Tree__virtualTree", ie = 320, ae = 32, oe = "haze-Tree__group", se = "haze-Tree__emptyBlock";
 function ce(e, t) {
@@ -36,275 +36,297 @@ function le(e, t, n) {
 		halfChecked: Array.from(i)
 	};
 }
-function y({ treeData: y, multiple: ue = !1, checkable: b = !1, checkStrictly: x = !1, selectable: S = !0, disabled: C = !1, blockNode: de = !1, showLine: fe = !1, showIcon: pe = !1, switcherIcon: me, loadingIcon: he, titleRender: ge, iconRender: _e, virtualized: w, loadData: T, searchValue: E, rowWrap: D, keyboardNavigation: ve = !0, expandedKeys: ye, selectedKeys: be, checkedKeys: xe, ref: Se, className: O, onExpand: Ce, onSelect: we, onCheck: Te }) {
-	let Ee = n("tree"), [k, De] = v(ye, []), [A, Oe] = v(be, []), [ke, Ae] = v(xe, []), je = ke, j = !!T, [M, Me] = g({}), [N, P] = g({}), F = h(/* @__PURE__ */ new Set()), I = m(() => d(M, y), [M, y]);
+function b({ treeData: b, multiple: ue = !1, checkable: x = !1, checkStrictly: S = !1, selectable: C = !0, disabled: w = !1, blockNode: de = !1, showLine: fe = !1, showIcon: pe = !1, switcherIcon: me, loadingIcon: he, titleRender: ge, iconRender: _e, virtualized: T, loadData: E, searchValue: D, rowWrap: O, keyboardNavigation: ve = !0, scrollHandleRef: ye, expandedKeys: be, selectedKeys: xe, checkedKeys: Se, ref: Ce, className: k, onExpand: we, onSelect: Te, onCheck: Ee }) {
+	let De = n("tree"), [A, Oe] = y(be, []), [j, ke] = y(xe, []), [Ae, je] = y(Se, []), Me = Ae, M = !!E, [N, Ne] = _({}), [P, F] = _({}), I = g(/* @__PURE__ */ new Set()), L = h(() => d(N, b), [N, b]);
 	p(() => {
-		I !== M && Me(I);
-	}, [I, M]);
-	let L = m(() => u(y, I), [y, I]), R = f((e, t) => {
-		T && !F.current.has(e) && (F.current.add(e), P((t) => ({
+		L !== N && Ne(L);
+	}, [L, N]);
+	let R = h(() => u(b, L), [b, L]), z = f((e, t) => {
+		E && !I.current.has(e) && (I.current.add(e), F((t) => ({
 			...t,
 			[e]: "loading"
-		})), T(t).then((t) => {
-			F.current.delete(e), Me((n) => ({
+		})), E(t).then((t) => {
+			I.current.delete(e), Ne((n) => ({
 				...n,
 				[e]: t
-			})), P((t) => ce(t, e));
+			})), F((t) => ce(t, e));
 		}).catch(() => {
-			F.current.delete(e), P((t) => ({
+			I.current.delete(e), F((t) => ({
 				...t,
 				[e]: "error"
 			}));
 		}));
-	}, [T]);
-	function Ne(e) {
-		let t = o(L, e);
-		t && R(e, t);
+	}, [E]);
+	function Pe(e) {
+		let t = o(R, e);
+		t && z(e, t);
 	}
-	let z = m(() => a(L, E), [L, E]), Pe = z !== null, B = z ? z.tree : L, V = m(() => !z || z.ancestorKeys.length === 0 ? k : Array.from(/* @__PURE__ */ new Set([...k, ...z.ancestorKeys])), [k, z]);
+	let B = h(() => a(R, D), [R, D]), Fe = B !== null, V = B ? B.tree : R, H = h(() => !B || B.ancestorKeys.length === 0 ? A : Array.from(/* @__PURE__ */ new Set([...A, ...B.ancestorKeys])), [A, B]);
 	p(() => {
-		if (T) for (let e of V) {
-			let t = o(L, e);
-			t && !t.children?.length && t.isLeaf !== !0 && I[e] === void 0 && N[e] === void 0 && R(e, t);
+		if (E) for (let e of H) {
+			let t = o(R, e);
+			t && !t.children?.length && t.isLeaf !== !0 && L[e] === void 0 && P[e] === void 0 && z(e, t);
 		}
 	}, [
-		T,
+		E,
+		z,
 		R,
+		H,
 		L,
-		V,
-		I,
-		N
+		P
 	]);
-	let Fe = m(() => le(je, L, x), [
-		je,
-		L,
-		x
-	]), H = Fe.checked, Ie = Fe.halfChecked, Le = w !== void 0 && w !== !1, U = typeof w == "object" ? w : void 0, [Re, ze] = g(null), [W, Be] = g(null), Ve = h(null), He = h(null), G = f((e) => r(Ve, Se)(e), [Se]), K = m(() => s(B, V, C), [
-		B,
+	let Ie = h(() => le(Me, R, S), [
+		Me,
+		R,
+		S
+	]), U = Ie.checked, Le = Ie.halfChecked, W = T !== void 0 && T !== !1, G = typeof T == "object" ? T : void 0, [Re, ze] = _(null), [K, Be] = _(null), q = g(null), Ve = g(null), He = f((e) => r(q, Ce)(e), [Ce]), J = h(() => s(V, H, w), [
 		V,
-		C
+		H,
+		w
 	]), Ue = (() => {
-		let e = K.find((e) => e.key === Re && !e.disabled);
-		return e ? e.key : K.find((e) => !e.disabled)?.key ?? null;
+		let e = J.find((e) => e.key === Re && !e.disabled);
+		return e ? e.key : J.find((e) => !e.disabled)?.key ?? null;
 	})();
-	function q(e) {
-		let t = K[e];
-		t && !t.disabled && (Le && He.current?.scrollToIndex(e, "auto"), ze(t.key), Be(t.key));
+	function Y(e) {
+		let t = J[e];
+		t && !t.disabled && (W && Ve.current?.scrollToIndex(e, "auto"), ze(t.key), Be(t.key));
 	}
-	function J(e, t) {
-		for (let n = e + t; n >= 0 && n < K.length; n += t) {
-			let e = K[n];
+	function X(e, t) {
+		for (let n = e + t; n >= 0 && n < J.length; n += t) {
+			let e = J[n];
 			if (e && !e.disabled) return n;
 		}
 		return -1;
 	}
-	function Y(e) {
+	function Z(e) {
 		let t = e.target;
 		if (t.getAttribute("role") !== "treeitem") return;
 		let n = t.dataset.treeKey;
 		n && ze(n);
 	}
-	function X(e) {
+	function We(e) {
 		if (!ve) return;
-		let n = K;
+		let n = J;
 		if (n.length === 0) return;
 		let r = e.target;
 		if (r.getAttribute("role") !== "treeitem") return;
 		let i = r.dataset.treeKey, a = i ? n.findIndex((e) => e.key === i) : -1, o = a >= 0 ? n[a] : void 0;
 		if (!o || o.disabled) return;
-		let s = o.node.isLeaf ?? (!o.node.children?.length && !j), c = t(e.currentTarget) === "rtl", l = c ? "ArrowLeft" : "ArrowRight", u = c ? "ArrowRight" : "ArrowLeft";
+		let s = o.node.isLeaf ?? (!o.node.children?.length && !M), c = t(e.currentTarget) === "rtl", l = c ? "ArrowLeft" : "ArrowRight", u = c ? "ArrowRight" : "ArrowLeft";
 		switch (e.key) {
 			case "ArrowDown":
-				e.preventDefault(), q(J(a, 1));
+				e.preventDefault(), Y(X(a, 1));
 				return;
 			case "ArrowUp":
-				e.preventDefault(), q(J(a, -1));
+				e.preventDefault(), Y(X(a, -1));
 				return;
 			case l:
 				if (e.preventDefault(), s) return;
-				V.includes(o.key) ? q(J(a, 1)) : Z(o.key);
+				H.includes(o.key) ? Y(X(a, 1)) : $(o.key);
 				return;
 			case u: {
-				if (e.preventDefault(), !s && V.includes(o.key)) {
-					Z(o.key);
+				if (e.preventDefault(), !s && H.includes(o.key)) {
+					$(o.key);
 					return;
 				}
 				let t = o.parentKey === null ? -1 : n.findIndex((e) => e.key === o.parentKey);
-				t >= 0 && q(t);
+				t >= 0 && Y(t);
 				return;
 			}
 			case "Home":
-				e.preventDefault(), q(J(-1, 1));
+				e.preventDefault(), Y(X(-1, 1));
 				return;
 			case "End":
-				e.preventDefault(), q(J(n.length, -1));
+				e.preventDefault(), Y(X(n.length, -1));
 				return;
 			case "Enter":
-				e.preventDefault(), Q(o.key);
+				e.preventDefault(), qe(o.key);
 				return;
 			case " ":
 			case "Space":
-				if (!b) return;
-				e.preventDefault(), $(o.key);
+				if (!x) return;
+				e.preventDefault(), Je(o.key);
 				return;
 		}
 	}
 	p(() => {
-		if (W === null) return;
-		let e = Ve.current;
+		if (K === null) return;
+		let e = q.current;
 		if (!e) return;
-		let t = Array.from(e.querySelectorAll("[role=\"treeitem\"]")).find((e) => e.dataset.treeKey === W);
+		let t = Array.from(e.querySelectorAll("[role=\"treeitem\"]")).find((e) => e.dataset.treeKey === K);
 		t && (t.focus(), Be(null));
-	}, [W, K]);
-	function Z(e) {
-		let t = k.includes(e), n = t ? k.filter((t) => t !== e) : [...k, e];
-		De(n), !t && N[e] === "error" && P((t) => ce(t, e)), Ce?.(n, {
+	}, [K, J]);
+	let [Q, Ge] = _(null), Ke = f((e, t = "auto") => {
+		Ge({
+			key: e,
+			align: t
+		});
+	}, []);
+	m(ye, () => ({ scrollToKey: Ke }), [Ke]), p(() => {
+		if (!Q) return;
+		let e = J.findIndex((e) => e.key === Q.key);
+		if (!(e < 0)) {
+			if (W) Ve.current?.scrollToIndex(e, Q.align);
+			else {
+				let e = Array.from(q.current?.querySelectorAll("[role=\"treeitem\"]") ?? []).find((e) => e.dataset.treeKey === Q.key), t = Q.align === "start" ? "start" : Q.align === "end" ? "end" : Q.align === "center" ? "center" : "nearest";
+				e?.scrollIntoView({ block: t });
+			}
+			Ge(null);
+		}
+	}, [
+		Q,
+		J,
+		W
+	]);
+	function $(e) {
+		let t = A.includes(e), n = t ? A.filter((t) => t !== e) : [...A, e];
+		Oe(n), !t && P[e] === "error" && F((t) => ce(t, e)), we?.(n, {
 			expanded: !t,
-			node: o(L, e)
+			node: o(R, e)
 		});
 	}
-	function Q(e) {
-		let t = o(L, e);
-		if (!t?.selectable && t?.selectable !== void 0 || !S) return;
+	function qe(e) {
+		let t = o(R, e);
+		if (!t?.selectable && t?.selectable !== void 0 || !C) return;
 		let n;
-		n = ue ? A.indexOf(e) >= 0 ? A.filter((t) => t !== e) : [...A, e] : A.includes(e) ? [] : [e], Oe(n), we?.(n, {
+		n = ue ? j.indexOf(e) >= 0 ? j.filter((t) => t !== e) : [...j, e] : j.includes(e) ? [] : [e], ke(n), Te?.(n, {
 			selected: n.includes(e),
-			selectedNodes: n.map((e) => o(L, e)).filter(Boolean),
+			selectedNodes: n.map((e) => o(R, e)).filter(Boolean),
 			node: t
 		});
 	}
-	function $(e) {
-		if (!b || o(L, e)?.disableCheckbox) return;
-		let t = H.includes(e), n;
-		if (x) n = t ? H.filter((t) => t !== e) : [...H, e];
+	function Je(e) {
+		if (!x || o(R, e)?.disableCheckbox) return;
+		let t = U.includes(e), n;
+		if (S) n = t ? U.filter((t) => t !== e) : [...U, e];
 		else {
-			let r = c(L, e);
+			let r = c(R, e);
 			if (t) {
-				n = H.filter((t) => t !== e && !r.includes(t));
-				let t = l(L, e);
-				for (; t;) n = n.filter((e) => e !== t), t = l(L, t);
+				n = U.filter((t) => t !== e && !r.includes(t));
+				let t = l(R, e);
+				for (; t;) n = n.filter((e) => e !== t), t = l(R, t);
 			} else {
-				let t = [e, ...r].filter((e) => !H.includes(e));
-				n = [...H, ...t];
-				let i = l(L, e);
-				for (; i;) c(L, i).every((e) => n.includes(e)) && !n.includes(i) && n.push(i), i = l(L, i);
+				let t = [e, ...r].filter((e) => !U.includes(e));
+				n = [...U, ...t];
+				let i = l(R, e);
+				for (; i;) c(R, i).every((e) => n.includes(e)) && !n.includes(i) && n.push(i), i = l(R, i);
 			}
 		}
-		let r = le(n, L, x);
-		Ae(x ? n : r.checked), Te?.(x ? n : r, {
+		let r = le(n, R, S);
+		je(S ? n : r.checked), Ee?.(S ? n : r, {
 			checked: !t,
-			checkedNodes: n.map((e) => o(L, e)).filter(Boolean),
-			node: o(L, e),
+			checkedNodes: n.map((e) => o(R, e)).filter(Boolean),
+			node: o(R, e),
 			halfCheckedKeys: r.halfChecked
 		});
 	}
-	function We(t, n, r) {
+	function Ye(t, n, r) {
 		return t.map((i, a) => {
-			let o = !!i.children?.length, s = V.includes(i.key), c = A.includes(i.key), l = H.includes(i.key), u = Ie.includes(i.key), d = N[i.key], f = l ? "checked" : u ? "halfChecked" : "unchecked", p = a === t.length - 1, m = [...r, p], h = /* @__PURE__ */ _(ee, {
+			let o = !!i.children?.length, s = H.includes(i.key), c = j.includes(i.key), l = U.includes(i.key), u = Le.includes(i.key), d = P[i.key], f = l ? "checked" : u ? "halfChecked" : "unchecked", p = a === t.length - 1, m = [...r, p], h = /* @__PURE__ */ v(ee, {
 				node: i,
 				level: n,
 				expanded: s,
 				selected: c,
 				checked: f,
-				disabled: C,
-				checkable: b,
-				selectable: S,
+				disabled: w,
+				checkable: x,
+				selectable: C,
 				blockNode: de,
 				showLine: fe,
 				showIcon: pe,
 				switcherIcon: me,
 				loadingIcon: he,
 				loading: d === "loading",
-				loadable: j,
+				loadable: M,
 				loadFailed: d === "error",
-				searchValue: E,
+				searchValue: D,
 				titleRender: ge,
 				iconRender: _e,
 				isLast: m,
 				tabIndex: i.key === Ue ? 0 : -1,
-				onToggle: () => Z(i.key),
-				onSelect: () => Q(i.key),
-				onCheck: () => $(i.key),
-				onRetry: () => Ne(i.key)
+				onToggle: () => $(i.key),
+				onSelect: () => qe(i.key),
+				onCheck: () => Je(i.key),
+				onRetry: () => Pe(i.key)
 			});
 			return /* @__PURE__ */ te("div", {
 				role: "group",
 				"data-slot": "group",
 				className: e(oe),
-				children: [D ? D(h, i) : h, o && s && /* @__PURE__ */ _("div", {
+				children: [O ? O(h, i) : h, o && s && /* @__PURE__ */ v("div", {
 					"data-slot": "list",
-					children: We(i.children, n + 1, m)
+					children: Ye(i.children, n + 1, m)
 				})]
 			}, i.key);
 		});
 	}
-	function Ge(e) {
-		let t = H.includes(e.key), n = Ie.includes(e.key), r = N[e.key], i = t ? "checked" : n ? "halfChecked" : "unchecked", a = /* @__PURE__ */ _(ee, {
+	function Xe(e) {
+		let t = U.includes(e.key), n = Le.includes(e.key), r = P[e.key], i = t ? "checked" : n ? "halfChecked" : "unchecked", a = /* @__PURE__ */ v(ee, {
 			node: e.node,
 			level: e.level,
-			expanded: V.includes(e.key),
-			selected: A.includes(e.key),
+			expanded: H.includes(e.key),
+			selected: j.includes(e.key),
 			checked: i,
-			disabled: C,
-			checkable: b,
-			selectable: S,
+			disabled: w,
+			checkable: x,
+			selectable: C,
 			blockNode: de,
 			showLine: fe,
 			showIcon: pe,
 			switcherIcon: me,
 			loadingIcon: he,
 			loading: r === "loading",
-			loadable: j,
+			loadable: M,
 			loadFailed: r === "error",
-			searchValue: E,
+			searchValue: D,
 			titleRender: ge,
 			iconRender: _e,
 			isLast: e.isLast,
 			tabIndex: e.key === Ue ? 0 : -1,
-			onToggle: () => Z(e.key),
-			onSelect: () => Q(e.key),
-			onCheck: () => $(e.key),
-			onRetry: () => Ne(e.key)
+			onToggle: () => $(e.key),
+			onSelect: () => qe(e.key),
+			onCheck: () => Je(e.key),
+			onRetry: () => Pe(e.key)
 		});
-		return D ? D(a, e.node) : a;
+		return O ? O(a, e.node) : a;
 	}
-	return Pe && B.length === 0 ? /* @__PURE__ */ _("div", {
+	return Fe && V.length === 0 ? /* @__PURE__ */ v("div", {
 		role: "tree",
 		"data-slot": "tree",
-		ref: G,
-		onKeyDown: X,
-		onFocus: Y,
-		className: e([ne, O]),
-		children: _("div", {
+		ref: He,
+		onKeyDown: We,
+		onFocus: Z,
+		className: e([ne, k]),
+		children: v("div", {
 			"data-slot": "empty",
 			className: e(se),
-			children: Ee.noMatch
+			children: De.noMatch
 		})
-	}) : Le ? /* @__PURE__ */ _("div", {
+	}) : W ? /* @__PURE__ */ v("div", {
 		role: "tree",
 		"data-slot": "tree",
-		ref: G,
-		onKeyDown: X,
-		onFocus: Y,
-		className: e([re, O]),
-		children: _(i, {
-			ref: He,
+		ref: He,
+		onKeyDown: We,
+		onFocus: Z,
+		className: e([re, k]),
+		children: v(i, {
+			ref: Ve,
 			"data-virtualized": !0,
-			items: K,
-			height: U?.height ?? ie,
-			itemHeight: U?.itemHeight ?? ae,
-			overscan: U?.overscan,
-			renderItem: Ge
+			items: J,
+			height: G?.height ?? ie,
+			itemHeight: G?.itemHeight ?? ae,
+			overscan: G?.overscan,
+			renderItem: Xe
 		})
-	}) : /* @__PURE__ */ _("div", {
+	}) : /* @__PURE__ */ v("div", {
 		role: "tree",
 		"data-slot": "tree",
-		ref: G,
-		onKeyDown: X,
-		onFocus: Y,
-		className: e([ne, O]),
-		children: We(B, 0, [])
+		ref: He,
+		onKeyDown: We,
+		onFocus: Z,
+		className: e([ne, k]),
+		children: Ye(V, 0, [])
 	});
 }
 //#endregion
-export { y as default };
+export { b as default };

package/dist/components/Tree/index.js

@@ -1,4 +1,5 @@
 "use client";
 import e from "./Tree.js";
 import t from "./SortableTree.js";
-export { t as SortableTree, e as Tree };
+import { useTree as n } from "./useTree.js";
+export { t as SortableTree, e as Tree, n as useTree };

package/dist/components/Tree/useTree.js

@@ -0,0 +1,32 @@
+"use client";
+import { flattenVisibleTree as e, getNodePath as t } from "./utils.js";
+import { useCallback as n, useRef as r } from "react";
+import { useControl as i } from "react-use-control";
+//#region src/lib/components/Tree/useTree.ts
+function a(a) {
+	let { treeData: o, expandedKeys: s } = a, [c, l, u] = i(s, []), d = r(null), f = n((e) => t(o, e), [o]), p = n(() => e(o, c, !1), [o, c]), m = n((e, n) => {
+		let { autoExpand: r = !1, align: i = "auto" } = n ?? {};
+		if (r) {
+			let n = t(o, e).slice(0, -1).map((e) => e.key);
+			n.length > 0 && l((e) => {
+				let t = n.filter((t) => !e.includes(t));
+				return t.length === 0 ? e : [...e, ...t];
+			});
+		}
+		d.current?.scrollToKey(e, i);
+	}, [o, l]);
+	return {
+		treeProps: {
+			treeData: o,
+			expandedKeys: u,
+			scrollHandleRef: d
+		},
+		expandedKeys: c,
+		setExpandedKeys: l,
+		getPath: f,
+		flattenVisible: p,
+		scrollTo: m
+	};
+}
+//#endregion
+export { a as useTree };

package/dist/components/Tree/utils.js

@@ -45,26 +45,36 @@ function r(e, t, n) {
 	return null;
 }
 function i(e, t) {
+	for (let n of e) {
+		if (n.key === t) return [n];
+		if (n.children?.length) {
+			let e = i(n.children, t);
+			if (e.length > 0) return [n, ...e];
+		}
+	}
+	return [];
+}
+function a(e, t) {
 	if (!t) return [];
 	let n = e.toLowerCase(), r = t.toLowerCase(), i = [], a = n.indexOf(r);
 	for (; a !== -1;) i.push([a, a + r.length]), a = n.indexOf(r, a + r.length);
 	return i;
 }
-function a(e, t) {
-	return typeof e.title == "string" && i(e.title, t).length > 0;
-}
 function o(e, t) {
+	return typeof e.title == "string" && a(e.title, t).length > 0;
+}
+function s(e, t) {
 	if (!t) return null;
 	let n = [], r = [], i = (e) => {
-		let o = [];
+		let a = [];
 		for (let s of e) {
-			let e = s.children?.length ? i(s.children) : [], c = a(s, t);
-			c && n.push(s.key), (c || e.length !== 0) && (e.length > 0 ? (r.push(s.key), o.push({
+			let e = s.children?.length ? i(s.children) : [], c = o(s, t);
+			c && n.push(s.key), (c || e.length !== 0) && (e.length > 0 ? (r.push(s.key), a.push({
 				...s,
 				children: e
-			})) : o.push(s));
+			})) : a.push(s));
 		}
-		return o;
+		return a;
 	};
 	return {
 		tree: i(e),
@@ -72,7 +82,7 @@ function o(e, t) {
 		ancestorKeys: r
 	};
 }
-function s(e, t) {
+function c(e, t) {
 	if (Object.keys(t).length === 0) return e;
 	let n = (e) => e.map((e) => {
 		if (e.children?.length) return {
@@ -90,7 +100,7 @@ function s(e, t) {
 	});
 	return n(e);
 }
-function c(e, n) {
+function l(e, n) {
 	let r = Object.entries(e);
 	if (r.length === 0) return e;
 	let i = {}, a = !1;
@@ -101,4 +111,4 @@ function c(e, n) {
 	return a ? i : e;
 }
 //#endregion
-export { o as filterTreeByQuery, t as findNodeByKey, e as flattenVisibleTree, n as getChildKeys, r as getParentKey, i as matchRanges, s as mergeLoadedChildren, a as nodeTitleMatches, c as pruneLoadedChildren };
+export { s as filterTreeByQuery, t as findNodeByKey, e as flattenVisibleTree, n as getChildKeys, i as getNodePath, r as getParentKey, a as matchRanges, c as mergeLoadedChildren, o as nodeTitleMatches, l as pruneLoadedChildren };

package/dist/css/anchor.css

@@ -1,4 +1,4 @@
 /* haze-ui anchor — generated by scripts/split-css.mjs, do not edit */
 @layer haze {
-.haze-Anchor__nav{font-size:var(--haze-text-sm);position:sticky;top:0}.haze-Anchor__list{gap:var(--haze-space-1);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.haze-Anchor__link{padding:var(--haze-space-1) var(--haze-space-2);border-inline-start:var(--haze-space-1) solid transparent;border-radius:0 var(--haze-radius-sm) var(--haze-radius-sm) 0;color:var(--haze-color-text-muted);-webkit-transition:color var(--haze-duration-fast) var(--haze-ease),border-color var(--haze-duration-fast) var(--haze-ease);transition:color var(--haze-duration-fast) var(--haze-ease),border-color var(--haze-duration-fast) var(--haze-ease);-webkit-text-decoration:none;text-decoration:none;display:block}.haze-Anchor__link:hover{color:var(--haze-color-text)}.haze-Anchor__linkActive{border-inline-start-color:var(--haze-color-primary);color:var(--haze-color-primary);font-weight:var(--haze-weight-medium)}
+.haze-Anchor__nav{font-size:var(--haze-text-sm);position:sticky;top:0}.haze-Anchor__list{gap:var(--haze-space-1);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.haze-Anchor__sublist{gap:var(--haze-space-1);margin:var(--haze-space-1) 0 0;-webkit-padding-start:var(--haze-space-4);flex-direction:column;padding-inline-start:var(--haze-space-4);list-style:none;display:flex}.haze-Anchor__link{padding:var(--haze-space-1) var(--haze-space-2);border-inline-start:var(--haze-space-1) solid transparent;border-radius:0 var(--haze-radius-sm) var(--haze-radius-sm) 0;color:var(--haze-color-text-muted);-webkit-transition:color var(--haze-duration-fast) var(--haze-ease),border-color var(--haze-duration-fast) var(--haze-ease);transition:color var(--haze-duration-fast) var(--haze-ease),border-color var(--haze-duration-fast) var(--haze-ease);-webkit-text-decoration:none;text-decoration:none;display:block}.haze-Anchor__link:hover{color:var(--haze-color-text)}.haze-Anchor__linkActive{color:var(--haze-color-primary);font-weight:var(--haze-weight-medium)}.haze-Anchor__linkActiveBar{border-inline-start-color:var(--haze-color-primary)}.haze-Anchor__indicatorBar{inset-inline-start:0;width:var(--haze-space-1);border-radius:var(--haze-radius-sm);background:var(--haze-color-primary);pointer-events:none;-webkit-transition:-webkit-transform var(--haze-duration-normal) var(--haze-ease),height var(--haze-duration-normal) var(--haze-ease),opacity var(--haze-duration-fast) var(--haze-ease);transition:transform var(--haze-duration-normal) var(--haze-ease),height var(--haze-duration-normal) var(--haze-ease),opacity var(--haze-duration-fast) var(--haze-ease);position:absolute;top:0}@media (prefers-reduced-motion:reduce){.haze-Anchor__indicatorBar{transition:none}}.haze-Anchor__indicatorHidden{opacity:0}
 }

package/dist/css/combobox.css

@@ -1,6 +1,6 @@
 /* haze-ui combobox — generated by scripts/split-css.mjs, do not edit */
 @layer haze {
-.haze-Combobox__wrapper{width:100%;display:inline-block;position:relative}.haze-Combobox__input{border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);width:100%;color:var(--haze-color-text);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);padding:var(--haze-space-2) var(--haze-space-3);line-height:var(--haze-leading-normal);-webkit-transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);box-sizing:border-box;display:block}.haze-Combobox__input:focus{border-color:var(--haze-color-primary);box-shadow:0 0 0 3px var(--haze-color-focus-ring);outline:none}.haze-Combobox__multiBox{-webkit-box-flex-wrap:wrap;align-items:center;gap:var(--haze-space-1);box-sizing:border-box;border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);cursor:text;width:100%;padding:var(--haze-space-1) var(--haze-space-2);-webkit-transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);flex-wrap:wrap;display:flex}.haze-Combobox__multiBox:focus-within{border-color:var(--haze-color-primary);box-shadow:0 0 0 3px var(--haze-color-focus-ring)}.haze-Combobox__multiInput{min-width:4rem;padding:var(--haze-space-1) 0;color:var(--haze-color-text);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);line-height:var(--haze-leading-normal);background:0 0;border:none;outline:none;flex:1}.haze-Combobox__multiInput::-webkit-input-placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput::placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput:-ms-placeholder-shown{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput::placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__matchMark{background:var(--haze-color-primary-subtle);color:var(--haze-color-primary);border-radius:var(--haze-radius-sm);padding:0}.haze-Combobox__stateRow{justify-content:center;align-items:center;gap:var(--haze-space-2);padding:var(--haze-space-2) var(--haze-space-3);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);color:var(--haze-color-text-muted);cursor:default;display:flex}.haze-Combobox__groupHeadingText{font-family:var(--haze-font-sans);font-size:var(--haze-text-xs);color:var(--haze-color-text-muted)}.haze-Combobox__listbox{box-sizing:border-box;min-width:100%;min-width:anchor-size(width);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);max-height:200px;box-shadow:var(--haze-shadow-lg);overflow-y:auto}.haze-Combobox__listboxVirtual{box-sizing:border-box;min-width:100%;min-width:anchor-size(width);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);box-shadow:var(--haze-shadow-lg)}.haze-Combobox__virtualRow{box-sizing:border-box;height:100%}
+.haze-Combobox__wrapper{width:100%;display:inline-block;position:relative}.haze-Combobox__input{border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);width:100%;color:var(--haze-color-text);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);padding:var(--haze-space-2) var(--haze-space-3);line-height:var(--haze-leading-normal);-webkit-transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);box-sizing:border-box;display:block}.haze-Combobox__input:focus{border-color:var(--haze-color-primary);box-shadow:0 0 0 3px var(--haze-color-focus-ring);outline:none}.haze-Combobox__multiBox{-webkit-box-flex-wrap:wrap;align-items:center;gap:var(--haze-space-1);box-sizing:border-box;border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);cursor:text;width:100%;padding:var(--haze-space-1) var(--haze-space-2);-webkit-transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);transition:border-color var(--haze-duration-fast),box-shadow var(--haze-duration-fast);flex-wrap:wrap;display:flex}.haze-Combobox__multiBox:focus-within{border-color:var(--haze-color-primary);box-shadow:0 0 0 3px var(--haze-color-focus-ring)}.haze-Combobox__multiInput{min-width:4rem;padding:var(--haze-space-1) 0;color:var(--haze-color-text);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);line-height:var(--haze-leading-normal);background:0 0;border:none;outline:none;flex:1}.haze-Combobox__multiInput::-webkit-input-placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput::placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput:-ms-placeholder-shown{color:var(--haze-color-text-muted)}.haze-Combobox__multiInput::placeholder{color:var(--haze-color-text-muted)}.haze-Combobox__overflowBadge{border-radius:var(--haze-radius-full);background:var(--haze-color-bg-muted);color:var(--haze-color-text-secondary);font-family:var(--haze-font-sans);font-size:var(--haze-text-xs);font-weight:var(--haze-weight-medium);white-space:nowrap;padding:var(--haze-space-1) var(--haze-space-2);cursor:default;align-items:center;line-height:1;display:inline-flex}.haze-Combobox__matchMark{background:var(--haze-color-primary-subtle);color:var(--haze-color-primary);border-radius:var(--haze-radius-sm);padding:0}.haze-Combobox__stateRow{justify-content:center;align-items:center;gap:var(--haze-space-2);padding:var(--haze-space-2) var(--haze-space-3);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);color:var(--haze-color-text-muted);cursor:default;display:flex}.haze-Combobox__groupHeadingText{font-family:var(--haze-font-sans);font-size:var(--haze-text-xs);color:var(--haze-color-text-muted)}.haze-Combobox__listbox{box-sizing:border-box;min-width:100%;min-width:anchor-size(width);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);max-height:200px;box-shadow:var(--haze-shadow-lg);overflow-y:auto}.haze-Combobox__listboxVirtual{box-sizing:border-box;min-width:100%;min-width:anchor-size(width);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);background:var(--haze-color-bg);box-shadow:var(--haze-shadow-lg)}.haze-Combobox__virtualRow{box-sizing:border-box;height:100%}
 .haze-ComboboxGroup__groupHeading{z-index:var(--haze-z-local-1);box-sizing:border-box;background:var(--haze-color-bg);border-bottom:1px solid var(--haze-color-border);padding:var(--haze-space-1) var(--haze-space-3);font-family:var(--haze-font-sans);font-size:var(--haze-text-xs);color:var(--haze-color-text-muted);position:sticky;top:0}
 .haze-ComboboxOption__option{padding:var(--haze-space-2) var(--haze-space-3);font-family:var(--haze-font-sans);font-size:var(--haze-text-sm);color:var(--haze-color-text);cursor:pointer;-webkit-transition:background var(--haze-duration-fast);transition:background var(--haze-duration-fast);align-items:center;display:flex}.haze-ComboboxOption__option:hover:not([data-disabled]){background:var(--haze-color-bg-subtle)}.haze-ComboboxOption__option:active:not([data-disabled]){background:var(--haze-color-bg-muted)}.haze-ComboboxOption__option[data-disabled]{opacity:.5;cursor:not-allowed}.haze-ComboboxOption__highlightedStyle{background:var(--haze-color-bg-subtle)}.haze-ComboboxOption__selectedStyle{font-weight:var(--haze-weight-medium);color:var(--haze-color-primary)}
 .haze-floating__floatingNative{margin:0;inset:auto}.haze-floating__floatingAnchored{position-anchor:var(--haze-floating-anchor)}.haze-floating__floatingFixed{position:fixed}.haze-floating__floatingHidden{display:none}.haze-floating__floatingAnimated[data-state=open]{-webkit-animation:haze-floating-in-haze-floating__floatingAnimated var(--haze-duration-fast) var(--haze-ease);animation:haze-floating-in-haze-floating__floatingAnimated var(--haze-duration-fast) var(--haze-ease)}.haze-floating__floatingAnimated[data-state=closed]{-webkit-animation:haze-floating-out-haze-floating__floatingAnimated var(--haze-duration-fast) var(--haze-ease) forwards;animation:haze-floating-out-haze-floating__floatingAnimated var(--haze-duration-fast) var(--haze-ease) forwards}@keyframes haze-floating-in-haze-floating__floatingAnimated{0%{opacity:0}}@keyframes haze-floating-out-haze-floating__floatingAnimated{to{opacity:0}}.haze-floating__anchoredBottom,.haze-floating__anchoredBottomSpan{position-area:bottom span-right;margin-top:var(--haze-space-1);position-try-fallbacks:flip-block}.haze-floating__anchoredBottomCenter{position-area:bottom center;margin-top:var(--haze-space-1);position-try-fallbacks:flip-block}.haze-floating__anchoredBottomEnd{position-area:bottom span-left;margin-top:var(--haze-space-1);position-try-fallbacks:flip-block}.haze-floating__anchoredTop{position-area:top center;margin-bottom:var(--haze-space-1);position-try-fallbacks:flip-block}.haze-floating__anchoredLeft{position-area:left center;margin-right:var(--haze-space-1);position-try-fallbacks:flip-inline}.haze-floating__anchoredRight{position-area:right center;margin-left:var(--haze-space-1);position-try-fallbacks:flip-inline}.haze-floating__anchoredLogicalBottom{position-area:span-inline-end block-end;position-try-fallbacks:flip-block;margin-block-start:var(--haze-space-1)}.haze-floating__anchoredLogicalBottomCenter{position-area:block-end center;position-try-fallbacks:flip-block;margin-block-start:var(--haze-space-1)}.haze-floating__anchoredLogicalBottomEnd{position-area:span-inline-start block-end;position-try-fallbacks:flip-block;margin-block-start:var(--haze-space-1)}.haze-floating__anchoredLogicalTop{position-area:block-start center;position-try-fallbacks:flip-block;margin-block-end:var(--haze-space-1)}.haze-floating__anchoredLogicalLeft{position-area:inline-start center;-webkit-margin-end:var(--haze-space-1);position-try-fallbacks:flip-inline;margin-inline-end:var(--haze-space-1)}.haze-floating__anchoredLogicalRight{position-area:inline-end center;-webkit-margin-start:var(--haze-space-1);position-try-fallbacks:flip-inline;margin-inline-start:var(--haze-space-1)}.haze-floating__fallbackBottom{z-index:var(--haze-z-overlay-fallback);margin-top:var(--haze-space-1);position:absolute;top:100%;left:0}.haze-floating__fallbackBottomCenter{z-index:var(--haze-z-overlay-fallback);margin-top:var(--haze-space-1);position:absolute;top:100%;left:50%;transform:translate(-50%)}.haze-floating__fallbackBottomEnd{z-index:var(--haze-z-overlay-fallback);margin-top:var(--haze-space-1);position:absolute;top:100%;right:0}.haze-floating__fallbackTop{z-index:var(--haze-z-overlay-fallback);margin-bottom:var(--haze-space-1);position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.haze-floating__fallbackLeft{z-index:var(--haze-z-overlay-fallback);margin-right:var(--haze-space-1);position:absolute;top:50%;right:100%;transform:translateY(-50%)}.haze-floating__fallbackRight{z-index:var(--haze-z-overlay-fallback);margin-left:var(--haze-space-1);position:absolute;top:50%;left:100%;transform:translateY(-50%)}.haze-floating__gapBelow{margin-top:var(--haze-space-1)}.haze-floating__gapAbove{margin-bottom:var(--haze-space-1)}.haze-floating__gapBefore{margin-right:var(--haze-space-1)}.haze-floating__gapAfter{margin-left:var(--haze-space-1)}

package/dist/css/copy-button.css

@@ -1,5 +1,5 @@
 /* haze-ui copy-button — generated by scripts/split-css.mjs, do not edit */
 @layer haze {
 .haze-copy-button-styles__sm{width:var(--haze-space-3);height:var(--haze-space-3)}.haze-copy-button-styles__md{width:var(--haze-space-4);height:var(--haze-space-4)}.haze-copy-button-styles__lg{width:var(--haze-space-5);height:var(--haze-space-5)}.haze-copy-button-styles__copiedSkin[data-copied]{color:var(--haze-color-success)}
-.haze-snippet-styles__snippet{align-items:center;gap:var(--haze-space-1);max-width:100%;padding-inline:var(--haze-space-3) var(--haze-space-1);padding-block:var(--haze-space-1);background:var(--haze-color-bg-muted);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);font-family:var(--haze-font-mono);display:inline-flex}.haze-snippet-styles__content{text-overflow:ellipsis;white-space:nowrap;font-size:var(--haze-text-sm);line-height:var(--haze-leading-relaxed);color:var(--haze-color-text);overflow:hidden}
+.haze-snippet-styles__snippet{align-items:center;gap:var(--haze-space-1);max-width:100%;padding-inline:var(--haze-space-3) var(--haze-space-1);padding-block:var(--haze-space-1);background:var(--haze-color-bg-muted);border:1px solid var(--haze-color-border);border-radius:var(--haze-radius-md);font-family:var(--haze-font-mono);display:inline-flex}.haze-snippet-styles__content{text-overflow:ellipsis;white-space:nowrap;font-family:inherit;font-size:var(--haze-text-sm);line-height:var(--haze-leading-relaxed);color:var(--haze-color-text);overflow:hidden}
 }