themelia-react-ui 2.0.2 → 2.0.3

package/dist/{combobox-C0EQW6dr.js → combobox-Dxo2fAYQ.js}

@@ -9,16 +9,62 @@ import { n as c } from "./tone-recipes-BPsRAvhu.js";
 import { t as l } from "./feedback-BYIhtitP.js";
 import { t as u } from "./layer-recipes-CCpklYME.js";
 import { n as d, r as f } from "./field-affordance-recipes-DZhnIL_Y.js";
-import { C as p, S as m, _ as h, a as g, b as _, g as ee, h as v, m as y, o as b, p as x, t as S, u as C, v as w, x as T } from "./combobox-xCQ2RMNE.js";
-import { l as E, u as D } from "./form-sizing-BdP_Mf5p.js";
-import { t as O } from "./input-DQdEd0YD.js";
-import { t as k } from "./scroll-area-DcI-M1UT.js";
-import { t as A } from "./use-debounced-callback-Cx1h-hdv.js";
-import * as j from "react";
-import { useCallback as M, useEffect as N, useMemo as P, useRef as F, useState as I } from "react";
-import { Fragment as L, jsx as R, jsxs as z } from "react/jsx-runtime";
-import { ChevronDownIcon as B, Loader2 as V, PlusIcon as te, XIcon as H } from "lucide-react";
+import { C as p, S as m, _ as h, a as g, b as _, g as v, h as y, m as b, o as x, p as S, t as C, u as w, v as T, w as E, x as D } from "./combobox-DaHESuiL.js";
+import { l as O, u as k } from "./form-sizing-BdP_Mf5p.js";
+import { t as A } from "./input-DQdEd0YD.js";
+import { t as ee } from "./scroll-area-DcI-M1UT.js";
+import { t as j } from "./use-debounced-callback-Cx1h-hdv.js";
+import * as M from "react";
+import { useCallback as N, useEffect as P, useMemo as F, useRef as I, useState as L } from "react";
+import { Fragment as te, jsx as R, jsxs as z } from "react/jsx-runtime";
+import { ChevronDownIcon as B, Loader2 as ne, PlusIcon as V, XIcon as H } from "lucide-react";
 import { Combobox as U } from "@base-ui/react/combobox";
+//#region src/components/base/combobox/combobox-field.tsx
+function re({ placeholder: e, clearLabel: t, toggleLabel: n, size: a, error: o, required: s, disabled: c, clearable: l = !0, className: u, onBlur: p }) {
+	return /* @__PURE__ */ z("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ R(D, {
+			render: /* @__PURE__ */ R(A, {
+				size: a,
+				invalid: o,
+				className: r(l ? f.clearPadding[a] : f.padding[a], u)
+			}),
+			placeholder: e,
+			"aria-invalid": o || void 0,
+			"aria-required": s,
+			disabled: c,
+			onBlur: p
+		}), /* @__PURE__ */ z("div", {
+			className: r("absolute inset-y-0 flex items-center gap-space-xs text-muted-foreground", f.track[a]),
+			children: [l ? /* @__PURE__ */ R(U.Clear, { render: /* @__PURE__ */ R(i, {
+				type: "button",
+				tone: "secondary",
+				buttonStyle: "ghost",
+				size: "sm",
+				iconOnly: !0,
+				className: r(d.target, d.focus, d.clear),
+				"aria-label": t,
+				children: /* @__PURE__ */ R(H, {
+					className: d.icon,
+					"aria-hidden": "true"
+				})
+			}) }) : null, /* @__PURE__ */ R(U.Trigger, { render: /* @__PURE__ */ R(i, {
+				type: "button",
+				tone: "secondary",
+				buttonStyle: "ghost",
+				size: "sm",
+				iconOnly: !0,
+				className: r(d.target, d.focus, d.toggle),
+				"aria-label": n,
+				children: /* @__PURE__ */ R(B, {
+					className: r("shrink-0", f.icon[a]),
+					"aria-hidden": "true"
+				})
+			}) })]
+		})]
+	});
+}
+//#endregion
 //#region src/components/features/combobox/combobox.strings.ts
 var W = {
 	placeholder: "Search...",
@@ -47,7 +93,7 @@ function J(e) {
 }
 //#endregion
 //#region src/components/features/combobox/components/loading-more.tsx
-function ne({ loading: e, text: t, className: n }) {
+function Y({ loading: e, text: t, className: n }) {
 	return e ? /* @__PURE__ */ z(s, {
 		direction: "horizontal",
 		gap: "sm",
@@ -56,7 +102,7 @@ function ne({ loading: e, text: t, className: n }) {
 		className: r("loading-more--component", "px-control py-space-xs text-xs text-muted-foreground", n),
 		role: "status",
 		"aria-live": "polite",
-		children: [/* @__PURE__ */ R(V, {
+		children: [/* @__PURE__ */ R(ne, {
 			className: "size-icon-sm animate-spin",
 			"aria-hidden": "true"
 		}), /* @__PURE__ */ R(a, {
@@ -68,10 +114,10 @@ function ne({ loading: e, text: t, className: n }) {
 		})]
 	}) : null;
 }
-ne.displayName = "LoadingMore";
+Y.displayName = "LoadingMore";
 //#endregion
 //#region src/components/features/combobox/components/status-content.tsx
-function Y({ children: e }) {
+function X({ children: e }) {
 	return /* @__PURE__ */ R(a, {
 		tag: "span",
 		size: "inherit",
@@ -80,90 +126,90 @@ function Y({ children: e }) {
 		children: e
 	});
 }
-function X({ loading: e, searchValue: t, minSearchLength: n, itemCount: r, strings: i }) {
+function ie({ loading: e, searchValue: t, minSearchLength: n, itemCount: r, strings: i }) {
 	let a = t.trim();
-	if (e) return /* @__PURE__ */ z(L, { children: [/* @__PURE__ */ R(V, { className: "size-icon-sm animate-spin" }), /* @__PURE__ */ R(Y, { children: i.searching })] });
-	if (a === "") return i.typeToSearch.includes("{min}") ? /* @__PURE__ */ R(Y, { children: i.typeToSearch.replace("{min}", String(n)) }) : /* @__PURE__ */ R(Y, { children: i.typeToSearch });
+	if (e) return /* @__PURE__ */ z(te, { children: [/* @__PURE__ */ R(ne, { className: "size-icon-sm animate-spin" }), /* @__PURE__ */ R(X, { children: i.searching })] });
+	if (a === "") return i.typeToSearch.includes("{min}") ? /* @__PURE__ */ R(X, { children: i.typeToSearch.replace("{min}", String(n)) }) : /* @__PURE__ */ R(X, { children: i.typeToSearch });
 	if (a.length < n) {
 		let e = n - a.length;
-		return i.typeMore.includes("{remaining}") || i.typeMore.includes("{s}") ? /* @__PURE__ */ R(Y, { children: i.typeMore.replace("{remaining}", String(e)).replace("{s}", e === 1 ? "" : "s") }) : /* @__PURE__ */ R(Y, { children: i.typeMore });
+		return i.typeMore.includes("{remaining}") || i.typeMore.includes("{s}") ? /* @__PURE__ */ R(X, { children: i.typeMore.replace("{remaining}", String(e)).replace("{s}", e === 1 ? "" : "s") }) : /* @__PURE__ */ R(X, { children: i.typeMore });
 	}
 	return null;
 }
-X.displayName = "StatusContent";
+ie.displayName = "StatusContent";
 //#endregion
 //#region src/components/features/combobox/components/combobox-dropdown.tsx
-var Z = {
+var ae = {
 	sm: "sm",
 	md: "md",
 	lg: "lg"
-}, re = {
+}, oe = {
 	sm: "flex min-h-control-sm items-center justify-center px-row-x py-row-y text-center text-pxs leading-tight text-muted-foreground",
 	md: "flex min-h-control items-center justify-center px-row-x py-row-y text-center text-sm leading-tight text-muted-foreground",
 	lg: "flex min-h-control-lg items-center justify-center px-row-x py-row-y-lg text-center text-sm leading-tight text-muted-foreground"
 };
-function ie({ loading: e, showStatus: t, showEmpty: n, searchValue: c, minSearchLength: l, items: d, groupedItems: f, createOptionItem: y, renderItemContent: x, getItemReactKey: S, getItemDisabled: C, renderGroupLabel: E, loadingMore: D, strings: O, size: A = "md", portalContainer: j, listRef: M, anchor: N, applyFooter: P }) {
-	let F = j == null ? void 0 : u.nestedOverlay, I = Z[A];
-	if (!(t || n || d.length > 0 || D || P)) return null;
-	let B = /* @__PURE__ */ R(m, {
+function se({ loading: e, showStatus: t, showEmpty: n, searchValue: c, minSearchLength: l, items: d, groupedItems: f, createOptionItem: b, renderItemContent: S, getItemReactKey: C, getItemDisabled: w, renderGroupLabel: D, loadingMore: O, strings: k, size: A = "md", portalContainer: j, listRef: M, anchor: N, applyFooter: P }) {
+	let F = j == null ? void 0 : u.nestedOverlay, I = ae[A];
+	if (!(t || n || d.length > 0 || O || P)) return null;
+	let L = /* @__PURE__ */ R(p, {
 		anchor: N,
 		className: F,
-		children: /* @__PURE__ */ z(b, {
+		children: /* @__PURE__ */ z(x, {
 			"aria-busy": e || void 0,
 			className: r("combobox-dropdown--popup"),
 			children: [
-				!!t && /* @__PURE__ */ R(p, {
+				!!t && /* @__PURE__ */ R(E, {
 					className: "gap-space-sm px-control py-space-xs text-xs text-muted-foreground",
-					children: /* @__PURE__ */ R(X, {
+					children: /* @__PURE__ */ R(ie, {
 						loading: e,
 						searchValue: c,
 						minSearchLength: l,
 						itemCount: d.length,
-						strings: O
+						strings: k
 					})
 				}),
-				!!n && /* @__PURE__ */ R(ee, {
-					className: re[A],
+				!!n && /* @__PURE__ */ R(v, {
+					className: oe[A],
 					children: /* @__PURE__ */ R(a, {
 						tag: "span",
 						size: "inherit",
 						type: "secondary",
 						className: "text-inherit",
-						children: O.noResults
+						children: k.noResults
 					})
 				}),
-				/* @__PURE__ */ R(k, {
+				/* @__PURE__ */ R(ee, {
 					viewportRef: M,
 					className: "max-h-[min(20rem,var(--available-height))]",
 					children: /* @__PURE__ */ R(_, {
 						className: "combobox-dropdown--list max-h-none overflow-visible",
-						children: f ? /* @__PURE__ */ z(L, { children: [Array.from(f.entries()).map(([e, t]) => {
-							let n = typeof E == "function" ? E(e) : e;
+						children: f ? /* @__PURE__ */ z(te, { children: [Array.from(f.entries()).map(([e, t]) => {
+							let n = typeof D == "function" ? D(e) : e;
 							return /* @__PURE__ */ z(h, {
 								className: "combobox-dropdown--group p-0",
 								items: t,
-								children: [/* @__PURE__ */ R(w, { children: typeof n == "string" || typeof n == "number" || typeof n == "bigint" ? /* @__PURE__ */ R(o, { children: n }) : n }), /* @__PURE__ */ R(v, { children: (e) => /* @__PURE__ */ R(g, {
+								children: [/* @__PURE__ */ R(T, { children: typeof n == "string" || typeof n == "number" || typeof n == "bigint" ? /* @__PURE__ */ R(o, { children: n }) : n }), /* @__PURE__ */ R(y, { children: (e) => /* @__PURE__ */ R(g, {
 									value: e,
 									size: I,
-									disabled: C?.(e),
-									children: x(e)
-								}, S(e)) })]
+									disabled: w?.(e),
+									children: S(e)
+								}, C(e)) })]
 							}, e);
-						}), y != null && /* @__PURE__ */ R(g, {
-							value: y,
+						}), b != null && /* @__PURE__ */ R(g, {
+							value: b,
 							size: I,
-							children: x(y)
-						}, S(y))] }) : /* @__PURE__ */ R(v, { children: (e) => /* @__PURE__ */ R(g, {
+							children: S(b)
+						}, C(b))] }) : /* @__PURE__ */ R(y, { children: (e) => /* @__PURE__ */ R(g, {
 							value: e,
 							size: I,
-							disabled: C?.(e),
-							children: x(e)
-						}, S(e)) })
+							disabled: w?.(e),
+							children: S(e)
+						}, C(e)) })
 					})
 				}),
-				/* @__PURE__ */ R(ne, {
-					loading: !!D,
-					text: O.loadingMore
+				/* @__PURE__ */ R(Y, {
+					loading: !!O,
+					text: k.loadingMore
 				}),
 				!!P && /* @__PURE__ */ z(s, {
 					direction: "horizontal",
@@ -191,15 +237,15 @@ function ie({ loading: e, showStatus: t, showEmpty: n, searchValue: c, minSearch
 			]
 		})
 	});
-	return j ? /* @__PURE__ */ R(T, {
+	return j ? /* @__PURE__ */ R(m, {
 		container: j,
-		children: B
-	}) : /* @__PURE__ */ R(T, { children: B });
+		children: L
+	}) : /* @__PURE__ */ R(m, { children: L });
 }
-ie.displayName = "ComboboxDropdown";
+se.displayName = "ComboboxDropdown";
 //#endregion
 //#region src/components/features/combobox/components/error-message.tsx
-function ae({ error: e, size: t, className: n }) {
+function ce({ error: e, size: t, className: n }) {
 	return e ? /* @__PURE__ */ R(a, {
 		tag: "p",
 		size: "xs",
@@ -210,13 +256,13 @@ function ae({ error: e, size: t, className: n }) {
 		children: e
 	}) : null;
 }
-ae.displayName = "ErrorMessage";
+ce.displayName = "ErrorMessage";
 //#endregion
 //#region src/components/features/combobox/components/highlighted-text.tsx
-function oe(e) {
+function le(e) {
 	return e.replace(/[$()*+.?[\\\]^{|}]/g, "\\$&");
 }
-function se({ text: e, highlight: t, highlightClassName: n = c.match }) {
+function ue({ text: e, highlight: t, highlightClassName: n = c.match }) {
 	if (!t.trim()) return /* @__PURE__ */ R(a, {
 		tag: "span",
 		size: "inherit",
@@ -224,7 +270,7 @@ function se({ text: e, highlight: t, highlightClassName: n = c.match }) {
 		className: "text-inherit",
 		children: e
 	});
-	let r = RegExp(`(${oe(t)})`, "gi"), i = e.split(r), o = 0;
+	let r = RegExp(`(${le(t)})`, "gi"), i = e.split(r), o = 0;
 	return /* @__PURE__ */ R(a, {
 		tag: "span",
 		size: "inherit",
@@ -235,18 +281,18 @@ function se({ text: e, highlight: t, highlightClassName: n = c.match }) {
 			return o += e.length, r ? /* @__PURE__ */ R("mark", {
 				className: n,
 				children: e
-			}, i) : /* @__PURE__ */ R(j.Fragment, { children: e }, i);
+			}, i) : /* @__PURE__ */ R(M.Fragment, { children: e }, i);
 		})
 	});
 }
-se.displayName = "HighlightedText";
+ue.displayName = "HighlightedText";
 //#endregion
 //#region src/components/features/combobox/hooks/use-debounced-search.ts
-function ce({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
-	let i = A((e) => {
+function de({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
+	let i = j((e) => {
 		t?.(e);
 	}, n);
-	N(() => {
+	P(() => {
 		let t = e.trim();
 		if (!(t.length < r)) return i(t), i.cancel;
 	}, [
@@ -257,8 +303,8 @@ function ce({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength:
 }
 //#endregion
 //#region src/components/features/combobox/hooks/use-grouped-items.ts
-function le({ items: e, getItemGroup: t }) {
-	return P(() => {
+function fe({ items: e, getItemGroup: t }) {
+	return F(() => {
 		if (!t) return null;
 		let n = /* @__PURE__ */ new Map();
 		for (let r of e) {
@@ -270,15 +316,15 @@ function le({ items: e, getItemGroup: t }) {
 }
 //#endregion
 //#region src/components/features/combobox/hooks/use-load-more.ts
-function ue({ hasMore: e, onLoadMore: t, loadingMore: n }) {
-	let r = F(!1), i = F(null), a = A(() => {
+function pe({ hasMore: e, onLoadMore: t, loadingMore: n }) {
+	let r = I(!1), i = I(null), a = j(() => {
 		r.current = !0, t?.(), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
 			r.current = !1, i.current = null;
 		}, 500);
 	}, 100);
-	return N(() => () => {
+	return P(() => () => {
 		i.current && clearTimeout(i.current);
-	}, []), { handleScroll: M((i) => {
+	}, []), { handleScroll: N((i) => {
 		if (!e || !t || n || r.current) return;
 		let { scrollHeight: o, scrollTop: s, clientHeight: c } = i.target;
 		(s + c) / o >= .8 && a();
@@ -291,87 +337,87 @@ function ue({ hasMore: e, onLoadMore: t, loadingMore: n }) {
 }
 //#endregion
 //#region src/components/features/combobox/hooks/use-combobox-core.tsx
-function de(e) {
+function me(e) {
 	return n(W, e);
 }
-function fe(e, t, n) {
+function he(e, t, n) {
 	let r = t.toLowerCase();
 	return e.some((e) => n(e).toLowerCase() === r);
 }
-function pe({ items: e, searchValue: t, getItemLabel: n, getItemKey: i, loading: o = !1, showListContent: s = !0, minSearchLength: c = 3, strings: l, renderItem: u, onSearch: d, debounceMs: f = 300, creatable: p, onCreate: m, getItemGroup: h, hasMore: g, onLoadMore: _, loadingMore: ee, highlightMatch: v, ensuredItems: y = [] }) {
-	let b = de(l), x = i ?? n, S = F(null), C = t.trim(), w = s && (o || C.length < c);
-	ce({
+function ge({ items: e, searchValue: t, getItemLabel: n, getItemKey: i, loading: o = !1, showListContent: s = !0, minSearchLength: c = 3, strings: l, renderItem: u, onSearch: d, debounceMs: f = 300, creatable: p, onCreate: m, getItemGroup: h, hasMore: g, onLoadMore: _, loadingMore: v, highlightMatch: y, ensuredItems: b = [] }) {
+	let x = me(l), S = i ?? n, C = I(null), w = t.trim(), T = s && (o || w.length < c);
+	de({
 		searchValue: t,
 		onSearch: d,
 		debounceMs: f,
 		minSearchLength: c
 	});
-	let { handleScroll: T } = ue({
-		hasMore: s && !w ? g : !1,
+	let { handleScroll: E } = pe({
+		hasMore: s && !T ? g : !1,
 		onLoadMore: _,
-		loadingMore: ee
+		loadingMore: v
 	});
-	N(() => {
-		let e = S.current;
-		if (s && !w && e && g && _) return e.addEventListener("scroll", T), () => e.removeEventListener("scroll", T);
+	P(() => {
+		let e = C.current;
+		if (s && !T && e && g && _) return e.addEventListener("scroll", E), () => e.removeEventListener("scroll", E);
 	}, [
-		T,
+		E,
 		g,
 		_,
 		s,
-		w
+		T
 	]);
-	let E = P(() => {
-		if (!s || w) return [];
-		if (y.length === 0) return e;
-		let t = [...y];
+	let D = F(() => {
+		if (!s || T) return [];
+		if (b.length === 0) return e;
+		let t = [...b];
 		return e.forEach((e) => {
-			let n = x(e);
-			y.some((e) => x(e) === n) || t.push(e);
+			let n = S(e);
+			b.some((e) => S(e) === n) || t.push(e);
 		}), t;
 	}, [
 		e,
-		y,
-		x,
+		b,
+		S,
 		s,
-		w
-	]), D = le({
-		items: E,
+		T
+	]), O = fe({
+		items: D,
 		getItemGroup: h
-	}), O = P(() => !s || w || !p || !m || C.length < c ? !1 : !fe(E, C, n), [
+	}), k = F(() => !s || T || !p || !m || w.length < c ? !1 : !he(D, w, n), [
 		p,
 		m,
-		C,
+		w,
 		c,
-		E,
+		D,
 		n,
 		s,
-		w
-	]), k = P(() => O ? J(C) : null, [O, C]);
+		T
+	]), A = F(() => k ? J(w) : null, [k, w]);
 	return {
-		strings: b,
-		getKey: x,
-		trimmedSearch: C,
-		listRef: S,
-		baseItems: E,
-		allItems: P(() => k ? [...E, k] : E, [E, k]),
-		groupedItems: D,
-		createOptionItem: k,
-		showStatus: w,
-		showEmpty: s && !o && C.length >= c && e.length === 0 && !O,
-		showCreateOption: O,
-		renderItemContent: M((e) => {
+		strings: x,
+		getKey: S,
+		trimmedSearch: w,
+		listRef: C,
+		baseItems: D,
+		allItems: F(() => A ? [...D, A] : D, [D, A]),
+		groupedItems: O,
+		createOptionItem: A,
+		showStatus: T,
+		showEmpty: s && !o && w.length >= c && e.length === 0 && !k,
+		showCreateOption: k,
+		renderItemContent: N((e) => {
 			if (K(e)) {
 				let t = q(e);
 				return /* @__PURE__ */ z("span", {
 					className: r("combobox-core--component", "flex items-center gap-space-sm"),
-					children: [/* @__PURE__ */ R(te, { className: "size-icon-sm" }), b.createNew.includes("{value}") ? /* @__PURE__ */ R(a, {
+					children: [/* @__PURE__ */ R(V, { className: "size-icon-sm" }), x.createNew.includes("{value}") ? /* @__PURE__ */ R(a, {
 						tag: "span",
 						size: "inherit",
 						weight: "medium",
 						lineHeight: "tight",
 						className: "text-inherit",
-						children: b.createNew.replace("{value}", t)
+						children: x.createNew.replace("{value}", t)
 					}) : /* @__PURE__ */ z("span", {
 						className: "inline-flex items-center gap-space-sm",
 						children: [/* @__PURE__ */ R(a, {
@@ -380,7 +426,7 @@ function pe({ items: e, searchValue: t, getItemLabel: n, getItemKey: i, loading:
 							weight: "medium",
 							lineHeight: "tight",
 							className: "text-inherit",
-							children: b.createNew
+							children: x.createNew
 						}), /* @__PURE__ */ R(a, {
 							tag: "span",
 							size: "inherit",
@@ -394,9 +440,9 @@ function pe({ items: e, searchValue: t, getItemLabel: n, getItemKey: i, loading:
 			}
 			if (u) return u(e);
 			let t = n(e);
-			return v && C ? /* @__PURE__ */ R(se, {
+			return y && w ? /* @__PURE__ */ R(ue, {
 				text: t,
-				highlight: C
+				highlight: w
 			}) : /* @__PURE__ */ R(a, {
 				tag: "span",
 				size: "inherit",
@@ -406,76 +452,32 @@ function pe({ items: e, searchValue: t, getItemLabel: n, getItemKey: i, loading:
 				children: t
 			});
 		}, [
-			b.createNew,
+			x.createNew,
 			u,
 			n,
-			v,
-			C
+			y,
+			w
 		]),
-		itemToStringLabel: M((e) => K(e) ? q(e) : n(e), [n]),
-		getItemReactKey: M((e) => K(e) ? `__create__:${q(e)}` : String(x(e)), [x]),
-		handleScroll: T
+		itemToStringLabel: N((e) => K(e) ? q(e) : n(e), [n]),
+		getItemReactKey: N((e) => K(e) ? `__create__:${q(e)}` : String(S(e)), [S]),
+		handleScroll: E
 	};
 }
 //#endregion
 //#region src/components/features/combobox/combobox.tsx
-function me(e, n) {
+function _e(e, n) {
 	return t(e, n, "md");
 }
-var he = {
+var ve = {
 	sm: "sm",
 	md: "md",
 	lg: "lg"
 };
-function ge(e) {
+function ye(e) {
 	return e;
 }
-function _e({ placeholder: e, clearLabel: t, toggleLabel: n, size: a, error: o, required: s, disabled: c, clearable: l = !0, className: u, onBlur: p }) {
-	return /* @__PURE__ */ z("div", {
-		className: "relative",
-		children: [/* @__PURE__ */ R(U.Input, {
-			render: /* @__PURE__ */ R(O, {
-				size: a,
-				invalid: o,
-				className: r(l ? f.clearPadding[a] : f.padding[a], u)
-			}),
-			placeholder: e,
-			"aria-invalid": o || void 0,
-			"aria-required": s,
-			disabled: c,
-			onBlur: p
-		}), /* @__PURE__ */ z("div", {
-			className: r("absolute inset-y-0 flex items-center gap-space-xs text-muted-foreground", f.track[a]),
-			children: [l ? /* @__PURE__ */ R(U.Clear, { render: /* @__PURE__ */ R(i, {
-				type: "button",
-				tone: "secondary",
-				buttonStyle: "ghost",
-				size: "sm",
-				iconOnly: !0,
-				className: r(d.target, d.focus, d.clear),
-				"aria-label": t,
-				children: /* @__PURE__ */ R(H, {
-					className: d.icon,
-					"aria-hidden": "true"
-				})
-			}) }) : null, /* @__PURE__ */ R(U.Trigger, { render: /* @__PURE__ */ R(i, {
-				type: "button",
-				tone: "secondary",
-				buttonStyle: "ghost",
-				size: "sm",
-				iconOnly: !0,
-				className: r(d.target, d.focus, d.toggle),
-				"aria-label": n,
-				children: /* @__PURE__ */ R(B, {
-					className: r("shrink-0", f.icon[a]),
-					"aria-hidden": "true"
-				})
-			}) })]
-		})]
-	});
-}
-function ve({ items: t, selectedValue: n, onSelectedValueChange: r, clearSearchOnClose: i = !0, searchValue: a, onSearchValueChange: o, getItemLabel: c, getItemKey: l, loading: u = !1, showListContent: d = !0, minSearchLength: f = 3, strings: p, disabled: m = !1, className: h, clearable: g = !0, renderItem: _, portalContainer: ee, name: v, invalid: y, error: b, required: x, onBlur: S, onSearch: w, debounceMs: T, creatable: E, onCreate: D, getItemGroup: O, renderGroupLabel: k, hasMore: A, onLoadMore: j, loadingMore: N, getItemDisabled: P, highlightMatch: F, size: L, open: B, onOpenChange: V }) {
-	let { defaultScale: te } = e(), H = me(L, te), U = ge(H), W = y || !!b, G = pe({
+function Z({ items: t, selectedValue: n, onSelectedValueChange: r, clearSearchOnClose: i = !0, searchValue: a, onSearchValueChange: o, getItemLabel: c, getItemKey: l, loading: u = !1, showListContent: d = !0, minSearchLength: f = 3, strings: p, disabled: m = !1, className: h, clearable: g = !0, renderItem: _, portalContainer: v, name: y, invalid: b, error: x, required: S, onBlur: C, onSearch: T, debounceMs: E, creatable: D, onCreate: O, getItemGroup: k, renderGroupLabel: A, hasMore: ee, onLoadMore: j, loadingMore: M, getItemDisabled: P, highlightMatch: F, size: I, open: te, onOpenChange: B }) {
+	let { defaultScale: ne } = e(), V = _e(I, ne), H = ye(V), U = b || !!x, W = ge({
 		items: t,
 		searchValue: a,
 		onSearchValueChange: o,
@@ -486,44 +488,44 @@ function ve({ items: t, selectedValue: n, onSelectedValueChange: r, clearSearchO
 		minSearchLength: f,
 		strings: p,
 		renderItem: _,
-		onSearch: w,
-		debounceMs: T,
-		creatable: E,
-		onCreate: D,
-		getItemGroup: O,
-		hasMore: A,
+		onSearch: T,
+		debounceMs: E,
+		creatable: D,
+		onCreate: O,
+		getItemGroup: k,
+		hasMore: ee,
 		onLoadMore: j,
-		loadingMore: N,
+		loadingMore: M,
 		highlightMatch: F,
-		size: H,
+		size: V,
 		ensuredItems: n ? [n] : []
-	}), [J, ne] = I(!1), Y = M((e) => {
-		ne(e), !e && i && o(""), V?.(e);
+	}), [G, J] = L(!1), Y = N((e) => {
+		J(e), !e && i && o(""), B?.(e);
 	}, [
 		i,
-		V,
+		B,
 		o
-	]), X = J ? a : n ? G.itemToStringLabel(n) : "", Z = M((e) => {
+	]), X = G ? a : n ? W.itemToStringLabel(n) : "", ie = N((e) => {
 		if (e && K(e)) {
 			let t = q(e);
-			D?.(t);
+			O?.(t);
 			return;
 		}
 		r(e);
-	}, [r, D]);
+	}, [r, O]);
 	return /* @__PURE__ */ z(s, {
 		gap: "dense",
 		className: "combobox--component",
-		children: [/* @__PURE__ */ z(C, {
-			dismissLabel: G.strings.dismiss,
-			items: G.allItems,
+		children: [/* @__PURE__ */ z(w, {
+			dismissLabel: W.strings.dismiss,
+			items: W.allItems,
 			value: n,
 			onValueChange: (e, t) => {
 				if (t.reason === "escape-key") {
 					t.allowPropagation();
 					return;
 				}
-				Z(e);
+				ie(e);
 			},
 			inputValue: X,
 			onInputValueChange: (e, t) => {
@@ -538,57 +540,57 @@ function ve({ items: t, selectedValue: n, onSelectedValueChange: r, clearSearchO
 				}
 				o(e);
 			},
-			itemToStringLabel: G.itemToStringLabel,
+			itemToStringLabel: W.itemToStringLabel,
 			disabled: m,
 			filter: null,
-			name: v,
-			required: x,
-			open: B,
+			name: y,
+			required: S,
+			open: te,
 			onOpenChange: Y,
-			children: [/* @__PURE__ */ R(_e, {
-				placeholder: G.strings.placeholder,
-				clearLabel: G.strings.clear,
-				toggleLabel: G.strings.toggle,
+			children: [/* @__PURE__ */ R(re, {
+				placeholder: W.strings.placeholder,
+				clearLabel: W.strings.clear,
+				toggleLabel: W.strings.toggle,
 				className: h,
-				size: U,
-				error: W,
-				required: x,
+				size: H,
+				error: U,
+				required: S,
 				disabled: m,
 				clearable: g,
-				onBlur: S
-			}), /* @__PURE__ */ R(ie, {
+				onBlur: C
+			}), /* @__PURE__ */ R(se, {
 				loading: u,
-				showStatus: G.showStatus,
-				showEmpty: G.showEmpty,
+				showStatus: W.showStatus,
+				showEmpty: W.showEmpty,
 				searchValue: a,
 				minSearchLength: f,
-				items: G.allItems,
-				groupedItems: G.groupedItems,
-				createOptionItem: G.createOptionItem,
-				renderItemContent: G.renderItemContent,
-				getItemReactKey: G.getItemReactKey,
+				items: W.allItems,
+				groupedItems: W.groupedItems,
+				createOptionItem: W.createOptionItem,
+				renderItemContent: W.renderItemContent,
+				getItemReactKey: W.getItemReactKey,
 				getItemDisabled: P,
-				renderGroupLabel: k,
-				loadingMore: d && !G.showStatus ? N : !1,
-				strings: G.strings,
-				size: H,
-				portalContainer: ee,
-				listRef: G.listRef
+				renderGroupLabel: A,
+				loadingMore: d && !W.showStatus ? M : !1,
+				strings: W.strings,
+				size: V,
+				portalContainer: v,
+				listRef: W.listRef
 			})]
-		}), /* @__PURE__ */ R(ae, {
-			error: b,
-			size: H
+		}), /* @__PURE__ */ R(ce, {
+			error: x,
+			size: V
 		})]
 	});
 }
-function ye({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValue: o, onSearchValueChange: c, getItemLabel: l, getItemKey: u, loading: d = !1, showListContent: f = !0, minSearchLength: p = 3, strings: m, disabled: h = !1, className: g, renderItem: _, portalContainer: ee, name: v, invalid: b, error: w, required: T, onBlur: O, onSearch: k, debounceMs: A, creatable: j, onCreate: P, getItemGroup: L, renderGroupLabel: B, hasMore: V, onLoadMore: te, loadingMore: H, getItemDisabled: U, highlightMatch: G, size: J, open: ne, onOpenChange: Y, closeOnSelect: X = !1, applyButton: Z = !1, onApply: re, onCancel: oe }) {
-	let { defaultScale: se } = e(), ce = me(J, se), le = ge(ce), ue = he[ce], de = b || !!w, fe = F(null), _e = u ?? l, [ve, ye] = I(n), [be, xe] = I(!1), Se = ne !== void 0, Ce = Se ? ne : be;
-	N(() => {
-		Z && ye(n);
-	}, [Z, n]);
-	let Q = M((e) => {
-		Se || xe(e), Y?.(e);
-	}, [Se, Y]), $ = pe({
+function be({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValue: o, onSearchValueChange: c, getItemLabel: l, getItemKey: u, loading: d = !1, showListContent: f = !0, minSearchLength: p = 3, strings: m, disabled: h = !1, className: g, renderItem: _, portalContainer: v, name: y, invalid: x, error: T, required: E, onBlur: D, onSearch: A, debounceMs: ee, creatable: j, onCreate: M, getItemGroup: F, renderGroupLabel: te, hasMore: B, onLoadMore: ne, loadingMore: V, getItemDisabled: H, highlightMatch: U, size: re, open: G, onOpenChange: J, closeOnSelect: Y = !1, applyButton: X = !1, onApply: ie, onCancel: ae }) {
+	let { defaultScale: oe } = e(), le = _e(re, oe), ue = ye(le), de = ve[le], fe = x || !!T, pe = I(null), me = u ?? l, [he, Z] = L(n), [be, xe] = L(!1), Se = G !== void 0, Ce = Se ? G : be;
+	P(() => {
+		X && Z(n);
+	}, [X, n]);
+	let Q = N((e) => {
+		Se || xe(e), J?.(e);
+	}, [Se, J]), $ = ge({
 		items: t,
 		searchValue: o,
 		onSearchValueChange: c,
@@ -599,49 +601,49 @@ function ye({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValu
 		minSearchLength: p,
 		strings: m,
 		renderItem: _,
-		onSearch: k,
-		debounceMs: A,
+		onSearch: A,
+		debounceMs: ee,
 		creatable: j,
-		onCreate: P,
-		getItemGroup: L,
-		hasMore: V,
-		onLoadMore: te,
-		loadingMore: H,
-		highlightMatch: G,
-		size: ce,
+		onCreate: M,
+		getItemGroup: F,
+		hasMore: B,
+		onLoadMore: ne,
+		loadingMore: V,
+		highlightMatch: U,
+		size: le,
 		ensuredItems: n
-	}), we = M((e) => {
+	}), we = N((e) => {
 		let t = [], n = null;
 		for (let r of e) K(r) ? n = q(r) : t.push(r);
-		n && P?.(n);
+		n && M?.(n);
 		let r = t.length !== e.length || !n ? t : null;
-		r && (Z ? ye(r) : i(r)), X && Q(!1);
+		r && (X ? Z(r) : i(r)), Y && Q(!1);
 	}, [
 		i,
-		P,
-		Z,
+		M,
 		X,
+		Y,
 		Q
-	]), Te = M(() => {
-		Z && i(ve), re?.(), Q(!1);
+	]), Te = N(() => {
+		X && i(he), ie?.(), Q(!1);
 	}, [
-		Z,
-		ve,
-		re,
+		X,
+		he,
+		ie,
 		i,
 		Q
-	]), Ee = M(() => {
-		Z && ye(n), oe?.(), Q(!1);
+	]), Ee = N(() => {
+		X && Z(n), ae?.(), Q(!1);
 	}, [
-		Z,
+		X,
 		n,
-		oe,
+		ae,
 		Q
-	]), De = Z ? ve : n, Oe = De.length > 0 ? void 0 : $.strings.placeholder;
+	]), De = X ? he : n, Oe = De.length > 0 ? void 0 : $.strings.placeholder;
 	return /* @__PURE__ */ z(s, {
 		gap: "dense",
 		className: "combobox--component",
-		children: [/* @__PURE__ */ z(C, {
+		children: [/* @__PURE__ */ z(w, {
 			dismissLabel: $.strings.dismiss,
 			items: $.allItems,
 			multiple: !0,
@@ -669,18 +671,18 @@ function ye({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValu
 			itemToStringLabel: $.itemToStringLabel,
 			disabled: h,
 			filter: null,
-			name: v,
-			required: T,
+			name: y,
+			required: E,
 			open: Ce,
 			onOpenChange: (e) => {
-				!e && Z && ye(n), Q(e);
+				!e && X && Z(n), Q(e);
 			},
-			children: [/* @__PURE__ */ z(x, {
-				ref: fe,
-				className: r(E[le], D[le], le === "sm" ? "text-pxs" : "text-sm", "bg-transparent !shadow-none", g),
-				size: ue,
-				error: de,
-				children: [De.map((e) => /* @__PURE__ */ R(S, {
+			children: [/* @__PURE__ */ z(S, {
+				ref: pe,
+				className: r(O[ue], k[ue], ue === "sm" ? "text-pxs" : "text-sm", "bg-transparent !shadow-none", g),
+				size: de,
+				error: fe,
+				children: [De.map((e) => /* @__PURE__ */ R(C, {
 					strings: { remove: ($.strings.removeSelection ?? W.removeSelection)(l(e)) },
 					children: /* @__PURE__ */ R(a, {
 						tag: "span",
@@ -690,13 +692,13 @@ function ye({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValu
 						className: "combobox--chip-label text-inherit",
 						children: l(e)
 					})
-				}, _e(e))), /* @__PURE__ */ R(y, {
+				}, me(e))), /* @__PURE__ */ R(b, {
 					placeholder: Oe,
-					"aria-invalid": de || void 0,
-					"aria-required": T,
-					onBlur: O
+					"aria-invalid": fe || void 0,
+					"aria-required": E,
+					onBlur: D
 				})]
-			}), /* @__PURE__ */ R(ie, {
+			}), /* @__PURE__ */ R(se, {
 				loading: d,
 				showStatus: $.showStatus,
 				showEmpty: $.showEmpty,
@@ -707,84 +709,84 @@ function ye({ items: t, selectedValues: n, onSelectedValuesChange: i, searchValu
 				createOptionItem: $.createOptionItem,
 				renderItemContent: $.renderItemContent,
 				getItemReactKey: $.getItemReactKey,
-				getItemDisabled: U,
-				renderGroupLabel: B,
-				loadingMore: f && !$.showStatus ? H : !1,
+				getItemDisabled: H,
+				renderGroupLabel: te,
+				loadingMore: f && !$.showStatus ? V : !1,
 				strings: $.strings,
-				size: ce,
-				portalContainer: ee,
+				size: le,
+				portalContainer: v,
 				listRef: $.listRef,
-				anchor: fe,
-				applyFooter: f && Z ? {
+				anchor: pe,
+				applyFooter: f && X ? {
 					applyLabel: $.strings.apply,
 					cancelLabel: $.strings.cancel,
 					onApply: Te,
 					onCancel: Ee
 				} : void 0
 			})]
-		}), /* @__PURE__ */ R(ae, {
-			error: w,
-			size: ce
+		}), /* @__PURE__ */ R(ce, {
+			error: T,
+			size: le
 		})]
 	});
 }
-ve.displayName = "Combobox", ye.displayName = "MultiCombobox";
+Z.displayName = "Combobox", be.displayName = "MultiCombobox";
 //#endregion
 //#region src/components/features/combobox/async-resource-combobox.tsx
-var be = {
+var xe = {
 	...W,
 	error: "Unable to load options.",
 	retry: "Retry"
 };
-function xe(e) {
+function Se(e) {
 	return typeof e == "string" || typeof e == "number" || typeof e == "bigint";
 }
-function Se({ fetcher: e, value: t, defaultValue: i = null, onValueChange: o, onAfterFetch: c, onError: u, getKey: d, getLabel: f, getDescription: p, getMeta: m, renderOption: h, limit: g = 10, debounceMs: _ = 300, preload: ee = !0, minSearchLength: v = 0, errorMessage: y, renderError: b, strings: x, disabled: S, size: C, ...w }) {
-	let T = n(be, x), E = t !== void 0, [D, O] = I(i), k = E ? t : D, [j, L] = I(""), [B, V] = I([]), [te, H] = I(!1), [U, W] = I(null), [G, K] = I(0), q = F(0), J = j.trim(), ne = M((e) => {
-		E || O(e), o?.(e);
-	}, [E, o]), Y = A((t, n) => {
-		H(!0), W(null), e(n).then((e) => {
-			n.signal?.aborted || q.current !== t || (V(e), c?.(e, n));
+function Ce({ fetcher: e, value: t, defaultValue: i = null, onValueChange: o, onAfterFetch: c, onError: u, getKey: d, getLabel: f, getDescription: p, getMeta: m, renderOption: h, limit: g = 10, debounceMs: _ = 300, preload: v = !0, minSearchLength: y = 0, errorMessage: b, renderError: x, strings: S, disabled: C, size: w, ...T }) {
+	let E = n(xe, S), D = t !== void 0, [O, k] = L(i), A = D ? t : O, [ee, M] = L(""), [te, B] = L([]), [ne, V] = L(!1), [H, U] = L(null), [re, W] = L(0), G = I(0), K = ee.trim(), q = N((e) => {
+		D || k(e), o?.(e);
+	}, [D, o]), J = j((t, n) => {
+		V(!0), U(null), e(n).then((e) => {
+			n.signal?.aborted || G.current !== t || (B(e), c?.(e, n));
 		}).catch((e) => {
-			n.signal?.aborted || q.current !== t || (V([]), W({
+			n.signal?.aborted || G.current !== t || (B([]), U({
 				error: e,
 				query: n.query
 			}), u?.(e, n));
 		}).finally(() => {
-			!n.signal?.aborted && q.current === t && H(!1);
+			!n.signal?.aborted && G.current === t && V(!1);
 		});
 	}, _);
-	N(() => {
-		if (S) return;
-		if (!(J.length > 0 ? J.length >= v : ee)) {
-			V([]), H(!1), W(null);
+	P(() => {
+		if (C) return;
+		if (!(K.length > 0 ? K.length >= y : v)) {
+			B([]), V(!1), U(null);
 			return;
 		}
-		let e = q.current + 1;
-		q.current = e;
+		let e = G.current + 1;
+		G.current = e;
 		let t = new AbortController();
-		return Y(e, {
-			query: J,
+		return J(e, {
+			query: K,
 			limit: g,
 			signal: t.signal
 		}), () => {
-			Y.cancel(), t.abort();
+			J.cancel(), t.abort();
 		};
 	}, [
-		S,
+		C,
 		g,
+		y,
 		v,
-		ee,
-		G,
-		Y,
-		J
+		re,
+		J,
+		K
 	]);
-	let X = M(() => {
-		U && (L(U.query), K((e) => e + 1));
-	}, [U]), Z = M((e) => {
+	let Y = N(() => {
+		H && (M(H.query), W((e) => e + 1));
+	}, [H]), X = N((e) => {
 		if (h) return h(e, {
-			query: J,
-			isSelected: k ? d(k) === d(e) : !1
+			query: K,
+			isSelected: A ? d(A) === d(e) : !1
 		});
 		let t = p?.(e), n = m?.(e);
 		return /* @__PURE__ */ z(s, {
@@ -796,19 +798,19 @@ function Se({ fetcher: e, value: t, defaultValue: i = null, onValueChange: o, on
 			children: [/* @__PURE__ */ R(a, {
 				type: "inherit",
 				tag: "span",
-				size: C === "sm" ? "pxs" : void 0,
+				size: w === "sm" ? "pxs" : void 0,
 				weight: "medium",
 				className: "min-w-0 shrink truncate",
 				children: f(e)
 			}), (!!t || !!n) && /* @__PURE__ */ z("span", {
 				className: "inline-flex min-w-0 flex-1 items-center gap-space-sm overflow-hidden text-muted-foreground",
-				children: [!!t && (xe(t) ? /* @__PURE__ */ R(a, {
+				children: [!!t && (Se(t) ? /* @__PURE__ */ R(a, {
 					tag: "span",
 					size: "xs",
 					type: "secondary",
 					className: "min-w-0 truncate",
 					children: t
-				}) : t), !!n && (xe(n) ? /* @__PURE__ */ R(a, {
+				}) : t), !!n && (Se(n) ? /* @__PURE__ */ R(a, {
 					tag: "span",
 					size: "xs",
 					type: "secondary",
@@ -823,53 +825,53 @@ function Se({ fetcher: e, value: t, defaultValue: i = null, onValueChange: o, on
 		f,
 		m,
 		h,
-		k,
-		C,
-		J
-	]), re = P(() => {
-		if (U) return y ?? T.error;
+		A,
+		w,
+		K
+	]), ie = F(() => {
+		if (H) return b ?? E.error;
 	}, [
-		y,
-		U,
-		T.error
-	]), ie = U !== null, ae = U ? b?.({
-		error: U.error,
-		query: U.query,
-		retry: X
+		b,
+		H,
+		E.error
+	]), ae = H !== null, oe = H ? x?.({
+		error: H.error,
+		query: H.query,
+		retry: Y
 	}) ?? /* @__PURE__ */ R(l, {
 		variant: "inline",
-		title: re,
-		onRetry: X,
-		retryLabel: T.retry,
+		title: ie,
+		onRetry: Y,
+		retryLabel: E.retry,
 		className: "async-resource-combobox--error mt-space-sm"
 	}) : null;
 	return /* @__PURE__ */ z("div", {
 		"data-component": "async-resource-combobox",
 		"data-slot": "async-resource-combobox",
-		className: r("async-resource-combobox--component", w.className),
-		children: [/* @__PURE__ */ R(ve, {
-			...w,
+		className: r("async-resource-combobox--component", T.className),
+		children: [/* @__PURE__ */ R(Z, {
+			...T,
 			className: void 0,
-			disabled: S,
-			size: C,
-			items: B,
-			selectedValue: k ?? null,
-			onSelectedValueChange: ne,
+			disabled: C,
+			size: w,
+			items: te,
+			selectedValue: A ?? null,
+			onSelectedValueChange: q,
 			clearSearchOnClose: !1,
-			searchValue: j,
-			onSearchValueChange: L,
+			searchValue: ee,
+			onSearchValueChange: M,
 			getItemLabel: f,
 			getItemKey: d,
-			loading: !ie && te,
-			showListContent: !ie,
-			minSearchLength: v,
-			strings: T,
-			renderItem: Z
-		}), ae]
+			loading: !ae && ne,
+			showListContent: !ae,
+			minSearchLength: y,
+			strings: E,
+			renderItem: X
+		}), oe]
 	});
 }
-Se.displayName = "AsyncResourceCombobox";
+Ce.displayName = "AsyncResourceCombobox";
 //#endregion
-export { pe as a, ye as i, be as n, W as o, ve as r, Se as t };
+export { ge as a, be as i, xe as n, W as o, Z as r, Ce as t };
 
-//# sourceMappingURL=combobox-C0EQW6dr.js.map
+//# sourceMappingURL=combobox-Dxo2fAYQ.js.map