themelia-ui 3.1.0 → 3.2.0

package/dist/features/combobox.js

@@ -4,15 +4,15 @@ import { s as e } from "../typography-DmeR05Er.js";
 import { t } from "../cx--CBrhWH0.js";
 import { c as n } from "../buttons-BX2JfL5X.js";
 import { t as r } from "../feedback-D4qVsKlD.js";
-import { m as i } from "../display-BGN834xV.js";
-import { C as a, E as o, _ as s, a as c, b as l, c as u, d, g as f, i as p, m, o as h, p as g, u as _, x as v, y } from "../combobox-Byu8N-Oe.js";
+import { m as i } from "../display-a7AoX_u7.js";
+import { C as a, E as o, _ as s, a as c, b as l, c as u, d, g as f, i as p, m, o as h, p as g, u as _, x as v, y } from "../combobox-519ubijc.js";
 import { t as b } from "../use-debounced-callback-BcKYwxqp.js";
 import { t as x } from "../spinner-Tc1QCnxM.js";
 import { PlusIcon as S } from "lucide-react";
-import { useCallback as C, useEffect as w, useId as T, useMemo as E, useRef as D, useState as O } from "react";
-import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
+import { useCallback as C, useEffect as w, useId as T, useLayoutEffect as E, useMemo as D, useRef as O, useState as k } from "react";
+import { Fragment as A, jsx as j, jsxs as M } from "react/jsx-runtime";
 import "#css/combobox.css";
-var M = {
+var N = {
 	root: "combobox__root___FdCB-",
 	error: "combobox__error___2R4DY",
 	errorState: "combobox__errorState___0HPSR",
@@ -30,66 +30,66 @@ var M = {
 };
 //#endregion
 //#region src/components/features/combobox/combobox-dropdown.tsx
-function N({ loading: t, trimmedSearch: n, minSearchLength: r, strings: i }) {
-	return t ? /* @__PURE__ */ A(x, { label: i.searching }) : n === "" ? /* @__PURE__ */ A(e, {
+function P({ loading: t, trimmedSearch: n, minSearchLength: r, strings: i }) {
+	return t ? /* @__PURE__ */ j(x, { label: i.searching }) : n === "" ? /* @__PURE__ */ j(e, {
 		size: "xs",
 		type: "secondary",
 		children: i.formatTypeToSearch(r)
-	}) : n.length < r ? /* @__PURE__ */ A(e, {
+	}) : n.length < r ? /* @__PURE__ */ j(e, {
 		size: "xs",
 		type: "secondary",
 		children: i.formatTypeMore(r - n.length)
 	}) : null;
 }
-function P({ loading: t, showStatus: r, showEmpty: o, trimmedSearch: c, minSearchLength: p, items: h, groupedItems: g, createOptionItem: v, renderItemContent: b, getItemReactKey: S, getItemDisabled: C, renderGroupLabel: w, loadingMore: T, strings: E, portalContainer: D, listRef: O, anchor: P, applyFooter: F, errorSlot: I }) {
-	let L = !!I || r || o || h.length > 0 || !!T || !!F, R = (e) => /* @__PURE__ */ A(m, {
+function F({ loading: t, showStatus: r, showEmpty: o, trimmedSearch: c, minSearchLength: p, items: h, groupedItems: g, createOptionItem: v, renderItemContent: b, getItemReactKey: S, getItemDisabled: C, renderGroupLabel: w, loadingMore: T, strings: E, portalContainer: D, listRef: O, anchor: k, applyFooter: F, errorSlot: I }) {
+	let L = !!I || r || o || h.length > 0 || !!T || !!F, R = (e) => /* @__PURE__ */ j(m, {
 		value: e,
 		disabled: C?.(e),
 		children: b(e)
-	}, S(e)), z = /* @__PURE__ */ A(l, {
-		anchor: P,
-		className: D ? M.positioner : void 0,
-		children: /* @__PURE__ */ A(s, {
+	}, S(e)), z = /* @__PURE__ */ j(l, {
+		anchor: k,
+		className: D ? N.positioner : void 0,
+		children: /* @__PURE__ */ j(s, {
 			"aria-busy": t || void 0,
 			"data-empty": !L || void 0,
-			className: M.popup,
-			children: I ?? /* @__PURE__ */ j(k, { children: [
-				r && /* @__PURE__ */ A(a, {
-					className: M.status,
-					children: /* @__PURE__ */ A(N, {
+			className: N.popup,
+			children: I ?? /* @__PURE__ */ M(A, { children: [
+				r && /* @__PURE__ */ j(a, {
+					className: N.status,
+					children: /* @__PURE__ */ j(P, {
 						loading: t,
 						trimmedSearch: c,
 						minSearchLength: p,
 						strings: E
 					})
 				}),
-				o && /* @__PURE__ */ A(a, {
-					className: M.empty,
-					children: /* @__PURE__ */ A(e, {
+				o && /* @__PURE__ */ j(a, {
+					className: N.empty,
+					children: /* @__PURE__ */ j(e, {
 						type: "secondary",
 						children: E.noResults
 					})
 				}),
-				/* @__PURE__ */ A(i, {
+				/* @__PURE__ */ j(i, {
 					ref: O,
-					className: M.scroller,
-					children: /* @__PURE__ */ A(f, {
-						className: M.list,
-						children: g ? /* @__PURE__ */ j(k, { children: [Array.from(g.entries()).map(([e, t]) => /* @__PURE__ */ j(_, {
+					className: N.scroller,
+					children: /* @__PURE__ */ j(f, {
+						className: N.list,
+						children: g ? /* @__PURE__ */ M(A, { children: [Array.from(g.entries()).map(([e, t]) => /* @__PURE__ */ M(_, {
 							items: t,
-							children: [/* @__PURE__ */ A(d, { children: w ? w(e) : e }), /* @__PURE__ */ A(u, { children: R })]
-						}, e)), v !== null && R(v)] }) : /* @__PURE__ */ A(u, { children: R })
+							children: [/* @__PURE__ */ j(d, { children: w ? w(e) : e }), /* @__PURE__ */ j(u, { children: R })]
+						}, e)), v !== null && R(v)] }) : /* @__PURE__ */ j(u, { children: R })
 					})
 				}),
-				!!T && /* @__PURE__ */ A("div", {
+				!!T && /* @__PURE__ */ j("div", {
 					role: "status",
 					"aria-live": "polite",
-					className: M.loadingMore,
-					children: /* @__PURE__ */ A(x, { label: E.loadingMore })
+					className: N.loadingMore,
+					children: /* @__PURE__ */ j(x, { label: E.loadingMore })
 				}),
-				!!F && /* @__PURE__ */ j("div", {
-					className: M.footer,
-					children: [/* @__PURE__ */ A(n, {
+				!!F && /* @__PURE__ */ M("div", {
+					className: N.footer,
+					children: [/* @__PURE__ */ j(n, {
 						type: "button",
 						tone: "neutral",
 						appearance: "ghost",
@@ -97,7 +97,7 @@ function P({ loading: t, showStatus: r, showEmpty: o, trimmedSearch: c, minSearc
 							e.preventDefault(), e.stopPropagation(), F.onCancel();
 						},
 						children: F.cancelLabel
-					}), /* @__PURE__ */ A(n, {
+					}), /* @__PURE__ */ j(n, {
 						type: "button",
 						onClick: (e) => {
 							e.preventDefault(), e.stopPropagation(), F.onApply();
@@ -108,14 +108,14 @@ function P({ loading: t, showStatus: r, showEmpty: o, trimmedSearch: c, minSearc
 			] })
 		})
 	});
-	return /* @__PURE__ */ A(y, {
+	return /* @__PURE__ */ j(y, {
 		container: D,
 		children: z
 	});
 }
 //#endregion
 //#region src/components/features/combobox/combobox.strings.ts
-var F = {
+var I = {
 	placeholder: "Search…",
 	clear: "Clear selection",
 	toggle: "Show options",
@@ -130,22 +130,22 @@ var F = {
 	errorTitle: "Could not load results",
 	retry: "Retry",
 	removeChip: (e) => `Remove ${e}`
-}, I = {
+}, L = {
 	placeholder: "Search…",
 	emptyMessage: "No results found.",
 	loadingMessage: "Searching…",
 	startTypingMessage: "Type to search.",
-	formatTypeMore: F.formatTypeMore,
+	formatTypeMore: I.formatTypeMore,
 	errorMessage: "Could not load suggestions.",
 	retry: "Retry"
 };
 //#endregion
 //#region src/components/features/combobox/highlighted-text.tsx
-function L(e) {
+function R(e) {
 	return e.replace(/[$()*+.?[\\\]^{|}]/g, "\\$&");
 }
-function R({ text: t, highlight: n }) {
-	if (!n.trim()) return /* @__PURE__ */ A(e, {
+function z({ text: t, highlight: n }) {
+	if (!n.trim()) return /* @__PURE__ */ j(e, {
 		tag: "span",
 		size: "inherit",
 		type: "inherit",
@@ -153,8 +153,8 @@ function R({ text: t, highlight: n }) {
 		className: "highlighted-text--component",
 		children: t
 	});
-	let r = t.split(RegExp(`(${L(n)})`, "gi")), i = r.reduce((e, t, n) => [...e, (e[n] ?? 0) + t.length], [0]);
-	return /* @__PURE__ */ A(e, {
+	let r = t.split(RegExp(`(${R(n)})`, "gi")), i = r.reduce((e, t, n) => [...e, (e[n] ?? 0) + t.length], [0]);
+	return /* @__PURE__ */ j(e, {
 		tag: "span",
 		size: "inherit",
 		type: "inherit",
@@ -164,24 +164,24 @@ function R({ text: t, highlight: n }) {
 			let n = t % 2 == 1;
 			if (!n && e === "") return null;
 			let r = `${i[t]}:${n ? "match" : "text"}`;
-			return A(n ? "mark" : "span", { children: e }, r);
+			return j(n ? "mark" : "span", { children: e }, r);
 		})
 	});
 }
 //#endregion
 //#region src/components/features/combobox/use-combobox-core.tsx
-var z = 3, B = .8, V = 100, H = 500, U = Symbol("combobox-create-option");
-function W(e) {
-	return typeof e == "object" && !!e && U in e;
-}
+var B = 3, V = .8, H = 100, U = 500, W = Symbol("combobox-create-option");
 function G(e) {
-	if (!W(e)) throw Error("That item is not a create option.");
-	return e[U];
+	return typeof e == "object" && !!e && W in e;
 }
 function K(e) {
-	return { [U]: e };
+	if (!G(e)) throw Error("That item is not a create option.");
+	return e[W];
+}
+function q(e) {
+	return { [W]: e };
 }
-function q({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
+function J({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
 	let i = b((e) => t?.(e), n);
 	w(() => {
 		let t = e.trim();
@@ -192,18 +192,18 @@ function q({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength:
 		e
 	]);
 }
-function J({ hasMore: e, onLoadMore: t, loadingMore: n }) {
-	let r = D(!1), i = D(null), a = b(() => {
+function ee({ hasMore: e, onLoadMore: t, loadingMore: n }) {
+	let r = O(!1), i = O(null), a = b(() => {
 		r.current = !0, t?.(), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
 			r.current = !1, i.current = null;
-		}, H);
-	}, V);
+		}, U);
+	}, H);
 	return w(() => () => {
 		i.current && clearTimeout(i.current);
 	}, []), { handleScroll: C((i) => {
 		if (!e || !t || n || r.current) return;
 		let { scrollHeight: o, scrollTop: s, clientHeight: c } = i.target;
-		(s + c) / o >= B && a();
+		(s + c) / o >= V && a();
 	}, [
 		e,
 		n,
@@ -213,32 +213,32 @@ function J({ hasMore: e, onLoadMore: t, loadingMore: n }) {
 }
 function Y({ items: t, searchValue: n, getItemLabel: r, getItemKey: i, loading: a = !1, showListContent: o = !0, minSearchLength: s = 3, strings: c, renderItem: l, onSearch: u, debounceMs: d = 300, creatable: f, onCreate: p, getItemGroup: m, hasMore: h, onLoadMore: g, loadingMore: _, highlightMatch: v, ensuredItems: y = [] }) {
 	let b = {
-		...F,
+		...I,
 		...c
-	}, { formatCreate: x } = b, T = i ?? r, O = D(null), k = n.trim(), N = o && (a || k.length < s);
-	q({
+	}, { formatCreate: x } = b, T = i ?? r, E = O(null), k = n.trim(), A = o && (a || k.length < s);
+	J({
 		searchValue: n,
 		onSearch: u,
 		debounceMs: d,
 		minSearchLength: s
 	});
-	let { handleScroll: P } = J({
-		hasMore: o && !N ? h : !1,
+	let { handleScroll: P } = ee({
+		hasMore: o && !A ? h : !1,
 		onLoadMore: g,
 		loadingMore: _
 	});
 	w(() => {
-		let e = O.current;
-		if (!(!o || N || !e || !h || !g)) return e.addEventListener("scroll", P), () => e.removeEventListener("scroll", P);
+		let e = E.current;
+		if (!(!o || A || !e || !h || !g)) return e.addEventListener("scroll", P), () => e.removeEventListener("scroll", P);
 	}, [
 		P,
 		h,
 		g,
 		o,
-		N
+		A
 	]);
-	let I = E(() => {
-		if (!o || N) return [];
+	let F = D(() => {
+		if (!o || A) return [];
 		if (y.length === 0) return t;
 		let e = [...y];
 		for (let n of t) y.some((e) => T(e) === T(n)) || e.push(n);
@@ -248,59 +248,59 @@ function Y({ items: t, searchValue: n, getItemLabel: r, getItemKey: i, loading:
 		T,
 		t,
 		o,
-		N
-	]), L = E(() => {
+		A
+	]), L = D(() => {
 		if (!m) return null;
 		let e = /* @__PURE__ */ new Map();
-		for (let t of I) {
+		for (let t of F) {
 			let n = m(t), r = e.get(n);
 			r ? r.push(t) : e.set(n, [t]);
 		}
 		return e;
-	}, [I, m]), z = E(() => {
-		if (!o || N || !f || !p || k === "" || k.length < s) return !1;
+	}, [F, m]), R = D(() => {
+		if (!o || A || !f || !p || k === "" || k.length < s) return !1;
 		let e = k.toLowerCase();
-		return !I.some((t) => r(t).toLowerCase() === e);
+		return !F.some((t) => r(t).toLowerCase() === e);
 	}, [
-		I,
+		F,
 		f,
 		r,
 		s,
 		p,
 		o,
-		N,
+		A,
 		k
-	]), B = E(() => z ? K(k) : null, [z, k]);
+	]), B = D(() => R ? q(k) : null, [R, k]);
 	return {
 		strings: b,
 		getKey: T,
 		trimmedSearch: k,
-		listRef: O,
-		baseItems: I,
-		allItems: E(() => B ? [...I, B] : I, [I, B]),
+		listRef: E,
+		baseItems: F,
+		allItems: D(() => B ? [...F, B] : F, [F, B]),
 		groupedItems: L,
 		createOptionItem: B,
-		showStatus: N,
-		showEmpty: o && !a && k.length >= s && t.length === 0 && !z,
-		showCreateOption: z,
+		showStatus: A,
+		showEmpty: o && !a && k.length >= s && t.length === 0 && !R,
+		showCreateOption: R,
 		renderItemContent: C((t) => {
-			if (W(t)) return /* @__PURE__ */ j("span", {
-				className: M.createRow,
-				children: [/* @__PURE__ */ A(S, { "aria-hidden": !0 }), /* @__PURE__ */ A(e, {
+			if (G(t)) return /* @__PURE__ */ M("span", {
+				className: N.createRow,
+				children: [/* @__PURE__ */ j(S, { "aria-hidden": !0 }), /* @__PURE__ */ j(e, {
 					tag: "span",
 					size: "inherit",
 					type: "inherit",
 					weight: "medium",
 					lineHeight: "tight",
-					children: x(G(t))
+					children: x(K(t))
 				})]
 			});
 			if (l) return l(t);
 			let n = r(t);
-			return v && k ? /* @__PURE__ */ A(R, {
+			return v && k ? /* @__PURE__ */ j(z, {
 				text: n,
 				highlight: k
-			}) : /* @__PURE__ */ A(e, {
+			}) : /* @__PURE__ */ j(e, {
 				tag: "span",
 				size: "inherit",
 				type: "inherit",
@@ -314,22 +314,22 @@ function Y({ items: t, searchValue: n, getItemLabel: r, getItemKey: i, loading:
 			l,
 			k
 		]),
-		itemToStringLabel: C((e) => W(e) ? G(e) : r(e), [r]),
-		getItemReactKey: C((e) => W(e) ? `__create__:${G(e)}` : String(T(e)), [T]),
+		itemToStringLabel: C((e) => G(e) ? K(e) : r(e), [r]),
+		getItemReactKey: C((e) => G(e) ? `__create__:${K(e)}` : String(T(e)), [T]),
 		handleScroll: P
 	};
 }
 //#endregion
 //#region src/components/features/combobox/async-combobox.tsx
 function X({ error: t, id: n }) {
-	return t ? /* @__PURE__ */ A(e, {
+	return t ? /* @__PURE__ */ j(e, {
 		id: n,
 		tag: "p",
 		size: "xs",
 		type: "error",
 		role: "alert",
 		"aria-live": "polite",
-		className: M.error,
+		className: N.error,
 		children: t
 	}) : null;
 }
@@ -375,41 +375,41 @@ function Z(e, t) {
 		describedBy: d ? g : void 0
 	};
 }
-function Q({ selectedValue: e, onSelectedValueChange: n, clearSearchOnClose: r = !0, minSearchLength: i = 3, loading: a = !1, showListContent: o = !0, disabled: s = !1, clearable: c = !0, ...l }) {
-	let { id: u, searchValue: d, onSearchValueChange: f, className: p, error: m, required: h, onBlur: _, onCreate: y, open: b, onOpenChange: x } = l, S = E(() => e ? [e] : [], [e]), { core: w, dropdown: T, root: D, invalid: k, errorId: N, describedBy: F } = Z({
+function te({ selectedValue: e, onSelectedValueChange: n, clearSearchOnClose: r = !0, minSearchLength: i = 3, loading: a = !1, showListContent: o = !0, disabled: s = !1, clearable: c = !0, ...l }) {
+	let { id: u, searchValue: d, onSearchValueChange: f, className: p, error: m, required: h, onBlur: _, onCreate: y, open: b, onOpenChange: x } = l, S = D(() => e ? [e] : [], [e]), { core: w, dropdown: T, root: E, invalid: O, errorId: A, describedBy: P } = Z({
 		...l,
 		minSearchLength: i,
 		loading: a,
 		showListContent: o,
 		disabled: s
-	}, S), [I, L] = O(!1), R = C((e) => {
+	}, S), [I, L] = k(!1), R = C((e) => {
 		L(e), !e && r && f(""), x?.(e);
 	}, [
 		r,
 		x,
 		f
 	]), z = b ?? I ? d : e ? w.itemToStringLabel(e) : "", B = C((e) => {
-		if (e && W(e)) {
-			y?.(G(e));
+		if (e && G(e)) {
+			y?.(K(e));
 			return;
 		}
 		n(e);
 	}, [y, n]);
-	return /* @__PURE__ */ j("div", {
-		className: t("async-combobox--component", M.root),
-		children: [/* @__PURE__ */ j(v, {
-			...D,
+	return /* @__PURE__ */ M("div", {
+		className: t("async-combobox--component", N.root),
+		children: [/* @__PURE__ */ M(v, {
+			...E,
 			value: e,
 			onValueChange: B,
 			inputValue: z,
 			open: b,
 			onOpenChange: R,
-			children: [/* @__PURE__ */ A(g, {
+			children: [/* @__PURE__ */ j(g, {
 				id: u,
 				placeholder: w.strings.placeholder,
 				showClear: c,
-				invalid: k,
-				"aria-describedby": F,
+				invalid: O,
+				"aria-describedby": P,
 				"aria-required": h,
 				disabled: s,
 				onBlur: _,
@@ -418,19 +418,19 @@ function Q({ selectedValue: e, onSelectedValueChange: n, clearSearchOnClose: r =
 					clear: w.strings.clear,
 					toggle: w.strings.toggle
 				}
-			}), /* @__PURE__ */ A(P, { ...T })]
-		}), /* @__PURE__ */ A(X, {
+			}), /* @__PURE__ */ j(F, { ...T })]
+		}), /* @__PURE__ */ j(X, {
 			error: m,
-			id: N
+			id: A
 		})]
 	});
 }
-function ee({ selectedValues: e, onSelectedValuesChange: n, minSearchLength: r = 3, loading: i = !1, showListContent: a = !0, disabled: s = !1, closeOnSelect: l = !1, applyButton: u = !1, onApply: d, onCancel: f, open: m, onOpenChange: g, ..._ }) {
-	let { id: y, searchValue: b, className: x, error: S, required: w, onBlur: T, onCreate: E } = _, k = D(null), [N, F] = O(e), [I, L] = O(!1), R = m !== void 0, z = R ? m : I, [B, V] = O(e);
-	u && e !== B && (V(e), F(e));
-	let [H, U] = O(z);
-	H !== z && (U(z), !z && u && F(e));
-	let K = u ? N : e, { core: q, dropdown: J, root: Y, invalid: Q, errorId: ee, describedBy: te } = Z({
+function ne({ selectedValues: e, onSelectedValuesChange: n, minSearchLength: r = 3, loading: i = !1, showListContent: a = !0, disabled: s = !1, closeOnSelect: l = !1, applyButton: u = !1, onApply: d, onCancel: f, open: m, onOpenChange: g, ..._ }) {
+	let { id: y, searchValue: b, className: x, error: S, required: w, onBlur: T, onCreate: E } = _, D = O(null), [A, P] = k(e), [I, L] = k(!1), R = m !== void 0, z = R ? m : I, [B, V] = k(e);
+	u && e !== B && (V(e), P(e));
+	let [H, U] = k(z);
+	H !== z && (U(z), !z && u && P(e));
+	let W = u ? A : e, { core: q, dropdown: J, root: ee, invalid: Y, errorId: te, describedBy: ne } = Z({
 		..._,
 		open: m,
 		onOpenChange: g,
@@ -438,83 +438,83 @@ function ee({ selectedValues: e, onSelectedValuesChange: n, minSearchLength: r =
 		loading: i,
 		showListContent: a,
 		disabled: s
-	}, K), ne = q.strings.removeChip ?? o.removeChip, $ = C((e) => {
+	}, W), re = q.strings.removeChip ?? o.removeChip, Q = C((e) => {
 		R || L(e), g?.(e);
-	}, [R, g]), re = C((e) => {
+	}, [R, g]), ie = C((e) => {
 		let t = [], r = null;
-		for (let n of e) W(n) ? r = G(n) : t.push(n);
-		r === null ? u ? F(t) : n(t) : E?.(r), l && !u && $(!1);
+		for (let n of e) G(n) ? r = K(n) : t.push(n);
+		r === null ? u ? P(t) : n(t) : E?.(r), l && !u && Q(!1);
 	}, [
 		u,
 		l,
 		E,
 		n,
-		$
-	]), ie = C(() => {
-		u && n(N), d?.(), $(!1);
+		Q
+	]), ae = C(() => {
+		u && n(A), d?.(), Q(!1);
 	}, [
 		u,
-		N,
+		A,
 		d,
 		n,
-		$
-	]), ae = C(() => {
-		u && F(e), f?.(), $(!1);
+		Q
+	]), oe = C(() => {
+		u && P(e), f?.(), Q(!1);
 	}, [
 		u,
 		f,
 		e,
-		$
+		Q
 	]);
-	return /* @__PURE__ */ j("div", {
-		className: t("async-multi-combobox--component", M.root),
-		children: [/* @__PURE__ */ j(v, {
-			...Y,
+	return /* @__PURE__ */ M("div", {
+		className: t("async-multi-combobox--component", N.root),
+		children: [/* @__PURE__ */ M(v, {
+			...ee,
 			multiple: !0,
-			value: K,
-			onValueChange: re,
+			value: W,
+			onValueChange: ie,
 			inputValue: b,
 			open: z,
 			onOpenChange: (t) => {
-				!t && u && F(e), $(t);
+				!t && u && P(e), Q(t);
 			},
-			children: [/* @__PURE__ */ j(c, {
-				ref: k,
-				invalid: Q,
+			children: [/* @__PURE__ */ M(c, {
+				ref: D,
+				invalid: Y,
 				className: x,
-				children: [K.map((e) => /* @__PURE__ */ A(p, {
-					strings: { removeChip: ne },
+				children: [W.map((e) => /* @__PURE__ */ j(p, {
+					strings: { removeChip: re },
 					children: q.itemToStringLabel(e)
-				}, q.getKey(e))), /* @__PURE__ */ A(h, {
+				}, q.getKey(e))), /* @__PURE__ */ j(h, {
 					id: y,
-					placeholder: K.length > 0 ? void 0 : q.strings.placeholder,
-					"aria-invalid": Q || void 0,
-					"aria-describedby": te,
+					placeholder: W.length > 0 ? void 0 : q.strings.placeholder,
+					"aria-invalid": Y || void 0,
+					"aria-describedby": ne,
 					"aria-required": w,
 					onBlur: T
 				})]
-			}), /* @__PURE__ */ A(P, {
+			}), /* @__PURE__ */ j(F, {
 				...J,
-				anchor: k,
+				anchor: D,
 				applyFooter: a && u ? {
 					applyLabel: q.strings.apply,
 					cancelLabel: q.strings.cancel,
-					onApply: ie,
-					onCancel: ae
+					onApply: ae,
+					onCancel: oe
 				} : void 0
 			})]
-		}), /* @__PURE__ */ A(X, {
+		}), /* @__PURE__ */ j(X, {
 			error: S,
-			id: ee
+			id: te
 		})]
 	});
 }
 //#endregion
 //#region src/components/features/combobox/use-suggestions.ts
-function te(e) {
+function re(e) {
 	return !!(e && e.name === "AbortError");
 }
-function ne(e, t) {
+function Q(e, t) {
 	return new Promise((n, r) => {
 		if (t.aborted) {
 			r(new DOMException("Aborted", "AbortError"));
@@ -526,77 +526,88 @@ function ne(e, t) {
 		});
 	});
 }
-var $ = [];
-function re(e) {
-	let { fetchData: t, minQueryLength: n = 1, debounceMs: r = 300, requestDelay: i = 0, preload: a = !1, query: o, defaultQuery: s = "", onQueryChange: c, value: l, defaultValue: u = null, onValueChange: d, open: f, defaultOpen: p = !1, onOpenChange: m, onError: h } = e, [g, _] = O(null), [v, y] = O(null), [x, S] = O(!1), [T, E] = O(s), [k, A] = O(u), [j, M] = O(p), [N, P] = O(0), F = D(!1), I = D(t), L = D(h);
+var ie = [];
+function ae(e) {
+	let { fetchData: t, scopeKey: n, minQueryLength: r = 1, debounceMs: i = 300, requestDelay: a = 0, preload: o = !1, query: s, defaultQuery: c = "", onQueryChange: l, value: u, defaultValue: d = null, onValueChange: f, open: p, defaultOpen: m = !1, onOpenChange: h, onError: g } = e, [_, v] = k({ key: n });
+	Object.is(_.key, n) || v({ key: n });
+	let [y, x] = k(null), [S, T] = k(null), [D, A] = k(null), j = O(_), M = O(null);
+	E(() => () => {
+		M.current?.abort();
+	}, [_]);
+	let [N, P] = k(c), [F, I] = k(d), [L, R] = k(m), [z, B] = k(0), V = O(!1), H = O(t), U = O(g);
 	w(() => {
-		I.current = t, L.current = h;
+		H.current = t, U.current = g;
 	});
-	let R = o ?? T, z = l === void 0 ? k : l, B = f ?? j, V = C((e) => {
-		o === void 0 && E(e), c?.(e);
-	}, [o, c]), H = C((e) => {
-		l === void 0 && A(e), d?.(e);
-	}, [l, d]), U = C((e) => {
-		f === void 0 && M(e), m?.(e);
-	}, [f, m]), W = C(() => {
-		F.current = !0, P((e) => e + 1);
-	}, []), G = R.trim().length, K = G >= n || a && G === 0, q = g?.query === R || v?.query === R, J = K && g ? g.items : $, Y = K && (x || !q), X = K && v?.query === R ? v.error : null, Z = b((e, t, n) => {
+	let W = s ?? N, G = u === void 0 ? F : u, K = p ?? L, q = C((e) => {
+		s === void 0 && P(e), l?.(e);
+	}, [s, l]), J = C((e) => {
+		u === void 0 && I(e), f?.(e);
+	}, [u, f]), ee = C((e) => {
+		p === void 0 && R(e), h?.(e);
+	}, [p, h]), Y = C(() => {
+		V.current = !0, B((e) => e + 1);
+	}, []), X = W.trim().length, Z = X >= r || o && X === 0, te = y?.scope === _ && y.query === W || S?.scope === _ && S.query === W, ne = Z && y?.scope === _ ? y.items : ie, ae = Z && (D === _ || !te), oe = Z && S?.scope === _ && S.query === W ? S.error : null, $ = b((e, t, n, r) => {
 		(async () => {
-			S(!0), y(null);
+			A(r), T(null);
 			try {
-				if (t > 0 && await ne(t, n), n.aborted) return;
-				let r = await I.current(e, { signal: n });
-				n.aborted || _({
+				if (t > 0 && await Q(t, n), n.aborted) return;
+				let i = await H.current(e, { signal: n });
+				n.aborted || x({
+					scope: r,
 					query: e,
-					items: Array.isArray(r) ? r : []
+					items: Array.isArray(i) ? i : []
 				});
 			} catch (t) {
-				if (n.aborted || te(t)) return;
-				_({
+				if (n.aborted || re(t)) return;
+				x({
+					scope: r,
 					query: e,
 					items: []
-				}), y({
+				}), T({
+					scope: r,
 					query: e,
 					error: t
-				}), L.current?.(t, e);
+				}), U.current?.(t, e);
 			} finally {
-				n.aborted || S(!1);
+				n.aborted || A(null);
 			}
 		})();
-	}, r);
+	}, i);
 	return w(() => {
-		if (!K) return;
-		let e = new AbortController();
-		return Z(R, i, e.signal), (F.current || R.trim() === "") && Z.flush(), F.current = !1, () => {
-			Z.cancel(), e.abort();
+		let e = j.current !== _;
+		if (j.current = _, !Z) return;
+		let t = new AbortController();
+		return M.current = t, $(W, a, t.signal, _), (e || V.current || W.trim() === "") && $.flush(), V.current = !1, () => {
+			$.cancel(), t.abort();
 		};
 	}, [
-		R,
-		i,
-		N,
+		W,
+		a,
+		z,
+		$,
 		Z,
-		K
+		_
 	]), {
-		items: J,
-		isLoading: Y,
-		error: X,
-		isError: X !== null,
-		retry: W,
-		query: R,
-		setQuery: V,
-		value: z,
-		setValue: H,
-		open: B,
-		setOpen: U
+		items: ne,
+		isLoading: ae,
+		error: oe,
+		isError: oe !== null,
+		retry: Y,
+		query: W,
+		setQuery: q,
+		value: G,
+		setValue: J,
+		open: K,
+		setOpen: ee
 	};
 }
 //#endregion
 //#region src/components/features/combobox/fetching-combobox.tsx
-function ie(e) {
+function oe(e) {
 	return typeof e == "string" || typeof e == "number";
 }
-function ae({ children: t }) {
-	return ie(t) ? /* @__PURE__ */ A(e, {
+function $({ children: t }) {
+	return oe(t) ? /* @__PURE__ */ j(e, {
 		tag: "span",
 		size: "xs",
 		type: "secondary",
@@ -604,110 +615,111 @@ function ae({ children: t }) {
 		children: t
 	}) : t;
 }
-function oe({ hook: n, slot: i, fetchData: a, onError: o, preload: s, requestDelay: c, minSearchLength: l = 0, debounceMs: u, searchValue: d, defaultSearchValue: f, onSearchValueChange: p, value: m, defaultValue: h, onValueChange: g, open: _, defaultOpen: v, onOpenChange: y, clearSearchOnClose: b = !1, getItemLabel: x, getItemKey: S, getDescription: w, getMeta: T, renderOption: E, highlightMatch: D, errorTitle: O, renderError: k, strings: N, disabled: P = !1, className: I, ...L }) {
-	let z = {
-		...F,
-		...N
-	}, B = S ?? x, V = re({
+function se({ hook: n, slot: i, fetchData: a, onError: o, preload: s, scopeKey: c, requestDelay: l, minSearchLength: u = 0, debounceMs: d, searchValue: f, defaultSearchValue: p, onSearchValueChange: m, value: h, defaultValue: g, onValueChange: _, open: v, defaultOpen: y, onOpenChange: b, clearSearchOnClose: x = !1, getItemLabel: S, getItemKey: w, getDescription: T, getMeta: E, renderOption: D, highlightMatch: O, errorTitle: k, renderError: A, strings: P, disabled: F = !1, className: L, ...R }) {
+	let B = {
+		...I,
+		...P
+	}, V = w ?? S, H = ae({
+		scopeKey: c,
 		fetchData: (e, t) => a(e.trim(), t ?? {}),
 		onError: (e, t) => o?.(e, t.trim()),
-		minQueryLength: P ? Infinity : Math.max(1, l),
-		preload: s && !P,
-		debounceMs: u,
-		requestDelay: c,
-		query: d,
-		defaultQuery: f,
-		onQueryChange: p,
-		value: m,
-		defaultValue: h,
-		onValueChange: g,
-		open: _,
-		defaultOpen: v,
-		onOpenChange: y
-	}), H = V.query.trim(), U = V.isError, { setOpen: W, setQuery: G, retry: K } = V, q = H === "" ? s && !P ? 0 : Math.max(1, l) : l, J = C((e) => {
-		W(e), !e && b && !U && G("");
+		minQueryLength: F ? Infinity : Math.max(1, u),
+		preload: s && !F,
+		debounceMs: d,
+		requestDelay: l,
+		query: f,
+		defaultQuery: p,
+		onQueryChange: m,
+		value: h,
+		defaultValue: g,
+		onValueChange: _,
+		open: v,
+		defaultOpen: y,
+		onOpenChange: b
+	}), U = H.query.trim(), W = H.isError, { setOpen: G, setQuery: K, retry: q } = H, J = U === "" ? s && !F ? 0 : Math.max(1, u) : u, ee = C((e) => {
+		G(e), !e && x && !W && K("");
 	}, [
-		b,
-		U,
+		x,
 		W,
-		G
-	]), Y = V.value ? B(V.value) : null, X = C((t) => {
-		if (E) return E(t, {
-			query: H,
-			isSelected: Y !== null && B(t) === Y
+		G,
+		K
+	]), Y = H.value ? V(H.value) : null, X = C((t) => {
+		if (D) return D(t, {
+			query: U,
+			isSelected: Y !== null && V(t) === Y
 		});
-		let n = x(t), r = w?.(t), i = T?.(t), a = !!r || !!i;
-		return /* @__PURE__ */ j("span", {
-			className: M.option,
-			children: [/* @__PURE__ */ A(e, {
+		let n = S(t), r = T?.(t), i = E?.(t), a = !!r || !!i;
+		return /* @__PURE__ */ M("span", {
+			className: N.option,
+			children: [/* @__PURE__ */ j(e, {
 				tag: "span",
 				size: "inherit",
 				type: "inherit",
 				weight: a ? "medium" : void 0,
 				lineHeight: "tight",
 				truncate: !0,
-				children: D && H ? /* @__PURE__ */ A(R, {
+				children: O && U ? /* @__PURE__ */ j(z, {
 					text: n,
-					highlight: H
+					highlight: U
 				}) : n
-			}), a && /* @__PURE__ */ j("span", {
-				className: M.optionMeta,
-				children: [!!r && /* @__PURE__ */ A(ae, { children: r }), !!i && /* @__PURE__ */ A(ae, { children: i })]
+			}), a && /* @__PURE__ */ M("span", {
+				className: N.optionMeta,
+				children: [!!r && /* @__PURE__ */ j($, { children: r }), !!i && /* @__PURE__ */ j($, { children: i })]
 			})]
 		});
 	}, [
-		w,
-		x,
-		B,
 		T,
-		D,
-		H,
+		S,
+		V,
 		E,
+		O,
+		U,
+		D,
 		Y
-	]), Z = U ? k?.({
-		error: V.error,
-		query: H,
-		retry: K
-	}) ?? /* @__PURE__ */ A(r, {
-		title: O ?? z.errorTitle,
-		onRetry: K,
-		strings: { retry: z.retry },
-		className: M.errorState
+	]), Z = W ? A?.({
+		error: H.error,
+		query: U,
+		retry: q
+	}) ?? /* @__PURE__ */ j(r, {
+		title: k ?? B.errorTitle,
+		onRetry: q,
+		strings: { retry: B.retry },
+		className: N.errorState
 	}) : null;
-	return /* @__PURE__ */ j("div", {
+	return /* @__PURE__ */ M("div", {
 		"data-slot": i,
-		className: t(n, I),
-		children: [/* @__PURE__ */ A(Q, {
-			...L,
-			disabled: P,
-			items: V.items,
-			selectedValue: V.value,
-			onSelectedValueChange: V.setValue,
+		className: t(n, L),
+		children: [/* @__PURE__ */ j(te, {
+			...R,
+			disabled: F,
+			items: H.items,
+			selectedValue: H.value,
+			onSelectedValueChange: H.setValue,
 			clearSearchOnClose: !1,
-			searchValue: V.query,
-			onSearchValueChange: G,
-			getItemLabel: x,
-			getItemKey: S,
-			loading: !U && V.isLoading,
-			showListContent: !U,
-			minSearchLength: q,
-			debounceMs: u,
-			strings: N,
+			searchValue: H.query,
+			onSearchValueChange: K,
+			getItemLabel: S,
+			getItemKey: w,
+			loading: !W && H.isLoading,
+			showListContent: !W,
+			minSearchLength: J,
+			debounceMs: d,
+			strings: P,
 			renderItem: X,
-			open: V.open,
-			onOpenChange: J
+			open: H.open,
+			onOpenChange: ee
 		}), Z]
 	});
 }
 //#endregion
 //#region src/components/features/combobox/resource-combobox.tsx
-function se({ fetcher: e, onAfterFetch: t, onError: n, getKey: r, getLabel: i, limit: a = 10, debounceMs: o = 300, preload: s = !0, minSearchLength: c = 0, defaultValue: l = null, errorMessage: u, ...d }) {
+function ce({ fetcher: e, onAfterFetch: t, onError: n, getKey: r, getLabel: i, limit: a = 10, debounceMs: o = 300, preload: s = !0, minSearchLength: c = 0, defaultValue: l = null, errorMessage: u, ...d }) {
 	let f = (e, t) => ({
 		query: e,
 		limit: a,
 		signal: t
 	});
-	return /* @__PURE__ */ A(oe, {
+	return /* @__PURE__ */ j(se, {
 		...d,
 		hook: "resource-combobox--component",
 		slot: "resource-combobox",
@@ -727,12 +739,12 @@ function se({ fetcher: e, onAfterFetch: t, onError: n, getKey: r, getLabel: i, l
 }
 //#endregion
 //#region src/components/features/combobox/suggestions-combobox.tsx
-function ce({ fetchData: e, itemKey: t, itemText: n, renderItem: r, minQueryLength: i = 1, preload: a = !1, query: o, defaultQuery: s, onQueryChange: c, allowClear: l = !0, clearInputOnClose: u = !1, disabled: d = !1, strings: f, ...p }) {
+function le({ fetchData: e, itemKey: t, itemText: n, renderItem: r, minQueryLength: i = 1, preload: a = !1, query: o, defaultQuery: s, onQueryChange: c, allowClear: l = !0, clearInputOnClose: u = !1, disabled: d = !1, strings: f, ...p }) {
 	let m = {
-		...I,
+		...L,
 		...f
-	}, h = f?.formatTypeMore ?? (f?.startTypingMessage === void 0 ? F.formatTypeMore : () => m.startTypingMessage);
-	return /* @__PURE__ */ A(oe, {
+	}, h = f?.formatTypeMore ?? (f?.startTypingMessage === void 0 ? I.formatTypeMore : () => m.startTypingMessage);
+	return /* @__PURE__ */ j(se, {
 		...p,
 		hook: "suggestions-combobox--component",
 		slot: "suggestions",
@@ -760,4 +772,4 @@ function ce({ fetchData: e, itemKey: t, itemText: n, renderItem: r, minQueryLeng
 	});
 }
 //#endregion
-export { Q as AsyncCombobox, ee as AsyncMultiCombobox, P as ComboboxDropdown, z as DEFAULT_MIN_SEARCH_LENGTH, R as HighlightedText, se as ResourceCombobox, ce as SuggestionsCombobox, F as defaultAsyncComboboxStrings, I as defaultSuggestionsStrings, Y as useComboboxCore, re as useSuggestions };
+export { te as AsyncCombobox, ne as AsyncMultiCombobox, F as ComboboxDropdown, B as DEFAULT_MIN_SEARCH_LENGTH, z as HighlightedText, ce as ResourceCombobox, le as SuggestionsCombobox, I as defaultAsyncComboboxStrings, L as defaultSuggestionsStrings, Y as useComboboxCore, ae as useSuggestions };