themelia-react-ui 1.0.1 → 2.0.0

package/dist/combobox-CB7039j7.js

@@ -0,0 +1,865 @@
+"use client";
+import { _ as e, s as t } from "./ui-provider-D2_TeLqw.js";
+import { useStrings as n } from "./lib/strings.js";
+import { t as r } from "./utils-Cospvlj1.js";
+import { a as i, s as a } from "./typography-CAr3dQhX.js";
+import { t as o } from "./button-BS3KDg00.js";
+import { t as s } from "./structure-hzCW-XsV.js";
+import { t as c } from "./feedback-C7nR0UtT.js";
+import { n as l, t as u } from "./field-affordance-recipes-CkOCdE2y.js";
+import { S as d, b as f, d as p, g as m, h, l as g, m as _, n as v, o as y, p as b, r as x, u as S, x as C, y as w } from "./combobox-6dvVny2q.js";
+import { c as T, l as E } from "./form-sizing-uWP4lzVh.js";
+import { t as D } from "./input-DhQdBnV3.js";
+import { t as O } from "./scroll-area-DRdr16Pt.js";
+import { t as k } from "./use-debounced-callback-Cx1h-hdv.js";
+import * as A from "react";
+import { useCallback as j, useEffect as M, useMemo as N, useRef as P, useState as F } from "react";
+import { Fragment as I, jsx as L, jsxs as R } from "react/jsx-runtime";
+import { ChevronDownIcon as z, Loader2 as B, PlusIcon as ee, XIcon as V } from "lucide-react";
+import { Combobox as H } from "@base-ui/react/combobox";
+//#region src/components/features/combobox/combobox.strings.ts
+var U = {
+	placeholder: "Search...",
+	clear: "Clear selection",
+	toggle: "Open options",
+	searching: "Loading...",
+	noResults: "No results found.",
+	typeToSearch: "Type at least {min} characters to search...",
+	typeMore: "Type {remaining} more character{s} to search...",
+	createNew: "Create {value}",
+	loadingMore: "Loading...",
+	apply: "Apply",
+	cancel: "Cancel"
+}, W = Symbol("combobox-create-option");
+function G(e) {
+	return typeof e == "object" && !!e && W in e;
+}
+function K(e) {
+	if (!G(e)) throw Error("Item is not a create option");
+	return e[W];
+}
+function te(e) {
+	return { [W]: e };
+}
+//#endregion
+//#region src/components/features/combobox/components/loading-more.tsx
+function q({ loading: e, text: t, className: n }) {
+	return e ? /* @__PURE__ */ R(s, {
+		direction: "horizontal",
+		gap: "sm",
+		justify: "center",
+		wrap: !1,
+		className: r("loading-more--component", "px-control py-space-xs text-xs text-muted-foreground", n),
+		role: "status",
+		"aria-live": "polite",
+		children: [/* @__PURE__ */ L(B, {
+			className: "size-icon-sm animate-spin",
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ L(a, {
+			tag: "span",
+			size: "xs",
+			type: "secondary",
+			className: "text-inherit",
+			children: t
+		})]
+	}) : null;
+}
+q.displayName = "LoadingMore";
+//#endregion
+//#region src/components/features/combobox/components/status-content.tsx
+function J({ children: e }) {
+	return /* @__PURE__ */ L(a, {
+		tag: "span",
+		size: "inherit",
+		type: "secondary",
+		className: "text-inherit",
+		children: e
+	});
+}
+function Y({ loading: e, searchValue: t, minSearchLength: n, itemCount: r, strings: i }) {
+	let a = t.trim();
+	if (e) return /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L(B, { className: "size-icon-sm animate-spin" }), /* @__PURE__ */ L(J, { children: i.searching })] });
+	if (a === "") return i.typeToSearch.includes("{min}") ? /* @__PURE__ */ L(J, { children: i.typeToSearch.replace("{min}", String(n)) }) : /* @__PURE__ */ L(J, { children: i.typeToSearch });
+	if (a.length < n) {
+		let e = n - a.length;
+		return i.typeMore.includes("{remaining}") || i.typeMore.includes("{s}") ? /* @__PURE__ */ L(J, { children: i.typeMore.replace("{remaining}", String(e)).replace("{s}", e === 1 ? "" : "s") }) : /* @__PURE__ */ L(J, { children: i.typeMore });
+	}
+	return null;
+}
+Y.displayName = "StatusContent";
+//#endregion
+//#region src/components/features/combobox/components/combobox-dropdown.tsx
+var X = {
+	sm: "sm",
+	md: "md",
+	lg: "lg"
+}, Z = {
+	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 ne({ loading: e, showStatus: t, showEmpty: n, searchValue: c, minSearchLength: l, items: u, groupedItems: p, createOptionItem: g, renderItemContent: y, getItemReactKey: S, getItemDisabled: T, renderGroupLabel: E, loadingMore: D, strings: k, size: A = "md", portalContainer: j, listRef: M, anchor: N, applyFooter: P }) {
+	let F = j == null ? void 0 : "z-[100]", z = X[A];
+	if (!(t || n || u.length > 0 || D || P)) return null;
+	let B = /* @__PURE__ */ L(C, {
+		anchor: N,
+		className: F,
+		children: /* @__PURE__ */ R(x, {
+			"aria-busy": e || void 0,
+			className: r("combobox-dropdown--popup"),
+			children: [
+				!!t && /* @__PURE__ */ L(d, {
+					className: "gap-space-sm px-control py-space-xs text-xs text-muted-foreground",
+					children: /* @__PURE__ */ L(Y, {
+						loading: e,
+						searchValue: c,
+						minSearchLength: l,
+						itemCount: u.length,
+						strings: k
+					})
+				}),
+				!!n && /* @__PURE__ */ L(_, {
+					className: Z[A],
+					children: /* @__PURE__ */ L(a, {
+						tag: "span",
+						size: "inherit",
+						type: "secondary",
+						className: "text-inherit",
+						children: k.noResults
+					})
+				}),
+				/* @__PURE__ */ L(O, {
+					viewportRef: M,
+					className: "max-h-[min(20rem,var(--available-height))]",
+					children: /* @__PURE__ */ L(w, {
+						className: "combobox-dropdown--list max-h-none overflow-visible",
+						children: p ? /* @__PURE__ */ R(I, { children: [Array.from(p.entries()).map(([e, t]) => {
+							let n = typeof E == "function" ? E(e) : e;
+							return /* @__PURE__ */ R(h, {
+								className: "combobox-dropdown--group p-0",
+								items: t,
+								children: [/* @__PURE__ */ L(m, { children: typeof n == "string" || typeof n == "number" || typeof n == "bigint" ? /* @__PURE__ */ L(i, { children: n }) : n }), /* @__PURE__ */ L(b, { children: (e) => /* @__PURE__ */ L(v, {
+									value: e,
+									size: z,
+									disabled: T?.(e),
+									children: y(e)
+								}, S(e)) })]
+							}, e);
+						}), g != null && /* @__PURE__ */ L(v, {
+							value: g,
+							size: z,
+							children: y(g)
+						}, S(g))] }) : /* @__PURE__ */ L(b, { children: (e) => /* @__PURE__ */ L(v, {
+							value: e,
+							size: z,
+							disabled: T?.(e),
+							children: y(e)
+						}, S(e)) })
+					})
+				}),
+				/* @__PURE__ */ L(q, {
+					loading: !!D,
+					text: k.loadingMore
+				}),
+				!!P && /* @__PURE__ */ R(s, {
+					direction: "horizontal",
+					gap: "md",
+					justify: "end",
+					wrap: !1,
+					className: "border-t border-border/60 px-control py-space-xs",
+					children: [/* @__PURE__ */ L(o, {
+						type: "button",
+						tone: "secondary",
+						buttonStyle: "ghost",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), P.onCancel();
+						},
+						children: P.cancelLabel
+					}), /* @__PURE__ */ L(o, {
+						type: "button",
+						tone: "primary",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), P.onApply();
+						},
+						children: P.applyLabel
+					})]
+				})
+			]
+		})
+	});
+	return j ? /* @__PURE__ */ L(f, {
+		container: j,
+		children: B
+	}) : /* @__PURE__ */ L(f, { children: B });
+}
+ne.displayName = "ComboboxDropdown";
+//#endregion
+//#region src/components/features/combobox/components/error-message.tsx
+function re({ error: e, size: t, className: n }) {
+	return e ? /* @__PURE__ */ L(a, {
+		tag: "p",
+		size: "xs",
+		type: "error",
+		className: r("error-message--component", n),
+		role: "alert",
+		"aria-live": "polite",
+		children: e
+	}) : null;
+}
+re.displayName = "ErrorMessage";
+//#endregion
+//#region src/components/features/combobox/components/highlighted-text.tsx
+function ie(e) {
+	return e.replace(/[$()*+.?[\\\]^{|}]/g, "\\$&");
+}
+function ae({ text: e, highlight: t, highlightClassName: n = "rounded-radius-sm bg-warning/20 px-space-2xs text-warning-accent dark:bg-warning/25" }) {
+	if (!t.trim()) return /* @__PURE__ */ L(a, {
+		tag: "span",
+		size: "inherit",
+		lineHeight: "tight",
+		className: "text-inherit",
+		children: e
+	});
+	let r = RegExp(`(${ie(t)})`, "gi"), i = e.split(r), o = 0;
+	return /* @__PURE__ */ L(a, {
+		tag: "span",
+		size: "inherit",
+		lineHeight: "tight",
+		className: "text-inherit",
+		children: i.map((e, t) => {
+			let r = t % 2 == 1, i = String(o);
+			return o += e.length, r ? /* @__PURE__ */ L("mark", {
+				className: n,
+				children: e
+			}, i) : /* @__PURE__ */ L(A.Fragment, { children: e }, i);
+		})
+	});
+}
+ae.displayName = "HighlightedText";
+//#endregion
+//#region src/components/features/combobox/hooks/use-debounced-search.ts
+function oe({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
+	let i = k((e) => {
+		t?.(e);
+	}, n);
+	M(() => {
+		let t = e.trim();
+		if (!(t.length < r)) return i(t), i.cancel;
+	}, [
+		e,
+		r,
+		i
+	]);
+}
+//#endregion
+//#region src/components/features/combobox/hooks/use-grouped-items.ts
+function se({ items: e, getItemGroup: t }) {
+	return N(() => {
+		if (!t) return null;
+		let n = /* @__PURE__ */ new Map();
+		for (let r of e) {
+			let e = t(r), i = n.get(e);
+			i ? i.push(r) : n.set(e, [r]);
+		}
+		return n;
+	}, [e, t]);
+}
+//#endregion
+//#region src/components/features/combobox/hooks/use-load-more.ts
+function ce({ hasMore: e, onLoadMore: t, loadingMore: n }) {
+	let r = P(!1), i = P(null), a = k(() => {
+		r.current = !0, t?.(), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
+			r.current = !1, i.current = null;
+		}, 500);
+	}, 100);
+	return M(() => () => {
+		i.current && clearTimeout(i.current);
+	}, []), { handleScroll: j((i) => {
+		if (!e || !t || n || r.current) return;
+		let { scrollHeight: o, scrollTop: s, clientHeight: c } = i.target;
+		(s + c) / o >= .8 && a();
+	}, [
+		e,
+		t,
+		n,
+		a
+	]) };
+}
+//#endregion
+//#region src/components/features/combobox/hooks/use-combobox-core.tsx
+function le(e) {
+	return n(U, e);
+}
+function ue(e, t, n) {
+	let r = t.toLowerCase();
+	return e.some((e) => n(e).toLowerCase() === r);
+}
+function de({ 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 = le(l), S = i ?? n, C = P(null), w = t.trim(), T = s && (o || w.length < c);
+	oe({
+		searchValue: t,
+		onSearch: d,
+		debounceMs: f,
+		minSearchLength: c
+	});
+	let { handleScroll: E } = ce({
+		hasMore: s && !T ? g : !1,
+		onLoadMore: _,
+		loadingMore: v
+	});
+	M(() => {
+		let e = C.current;
+		if (s && !T && e && g && _) return e.addEventListener("scroll", E), () => e.removeEventListener("scroll", E);
+	}, [
+		E,
+		g,
+		_,
+		s,
+		T
+	]);
+	let D = N(() => {
+		if (!s || T) return [];
+		if (b.length === 0) return e;
+		let t = [...b];
+		return e.forEach((e) => {
+			let n = S(e);
+			b.some((e) => S(e) === n) || t.push(e);
+		}), t;
+	}, [
+		e,
+		b,
+		S,
+		s,
+		T
+	]), O = se({
+		items: D,
+		getItemGroup: h
+	}), k = N(() => !s || T || !p || !m || w.length < c ? !1 : !ue(D, w, n), [
+		p,
+		m,
+		w,
+		c,
+		D,
+		n,
+		s,
+		T
+	]), A = N(() => k ? te(w) : null, [k, w]);
+	return {
+		strings: x,
+		getKey: S,
+		trimmedSearch: w,
+		listRef: C,
+		baseItems: D,
+		allItems: N(() => 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: j((e) => {
+			if (G(e)) {
+				let t = K(e);
+				return /* @__PURE__ */ R("span", {
+					className: r("combobox-core--component", "flex items-center gap-space-sm"),
+					children: [/* @__PURE__ */ L(ee, { className: "size-icon-sm" }), x.createNew.includes("{value}") ? /* @__PURE__ */ L(a, {
+						tag: "span",
+						size: "inherit",
+						weight: "medium",
+						lineHeight: "tight",
+						className: "text-inherit",
+						children: x.createNew.replace("{value}", t)
+					}) : /* @__PURE__ */ R("span", {
+						className: "inline-flex items-center gap-space-sm",
+						children: [/* @__PURE__ */ L(a, {
+							tag: "span",
+							size: "inherit",
+							weight: "medium",
+							lineHeight: "tight",
+							className: "text-inherit",
+							children: x.createNew
+						}), /* @__PURE__ */ L(a, {
+							tag: "span",
+							size: "inherit",
+							weight: "medium",
+							lineHeight: "tight",
+							className: "text-inherit",
+							children: t
+						})]
+					})]
+				});
+			}
+			if (u) return u(e);
+			let t = n(e);
+			return y && w ? /* @__PURE__ */ L(ae, {
+				text: t,
+				highlight: w
+			}) : /* @__PURE__ */ L(a, {
+				tag: "span",
+				size: "inherit",
+				weight: "medium",
+				lineHeight: "tight",
+				className: "text-inherit",
+				children: t
+			});
+		}, [
+			x.createNew,
+			u,
+			n,
+			y,
+			w
+		]),
+		itemToStringLabel: j((e) => G(e) ? K(e) : n(e), [n]),
+		getItemReactKey: j((e) => G(e) ? `__create__:${K(e)}` : String(S(e)), [S]),
+		handleScroll: E
+	};
+}
+//#endregion
+//#region src/components/features/combobox/combobox.tsx
+function fe(t, n) {
+	return e(t, n, "md");
+}
+var pe = {
+	sm: "sm",
+	md: "md",
+	lg: "lg"
+};
+function me(e) {
+	return e;
+}
+function he({ placeholder: e, clearLabel: t, toggleLabel: n, size: i, error: a, required: s, disabled: c, clearable: d = !0, className: f, onBlur: p }) {
+	return /* @__PURE__ */ R("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ L(H.Input, {
+			render: /* @__PURE__ */ L(D, {
+				size: i,
+				invalid: a,
+				className: r(d ? l.clearPadding[i] : l.padding[i], f)
+			}),
+			placeholder: e,
+			"aria-invalid": a || void 0,
+			"aria-required": s,
+			disabled: c,
+			onBlur: p
+		}), /* @__PURE__ */ R("div", {
+			className: r("absolute inset-y-0 flex items-center gap-space-xs text-muted-foreground", l.track[i]),
+			children: [d ? /* @__PURE__ */ L(H.Clear, { render: /* @__PURE__ */ L(o, {
+				type: "button",
+				tone: "secondary",
+				buttonStyle: "ghost",
+				size: "sm",
+				iconOnly: !0,
+				className: r(u.target, u.focus, u.clear),
+				"aria-label": t,
+				children: /* @__PURE__ */ L(V, {
+					className: u.icon,
+					"aria-hidden": "true"
+				})
+			}) }) : null, /* @__PURE__ */ L(H.Trigger, { render: /* @__PURE__ */ L(o, {
+				type: "button",
+				tone: "secondary",
+				buttonStyle: "ghost",
+				size: "sm",
+				iconOnly: !0,
+				className: r(u.target, u.focus, u.toggle),
+				"aria-label": n,
+				children: /* @__PURE__ */ L(z, {
+					className: r("shrink-0", l.icon[i]),
+					"aria-hidden": "true"
+				})
+			}) })]
+		})]
+	});
+}
+function ge({ items: e, 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: b, invalid: x, error: S, required: C, onBlur: w, onSearch: T, debounceMs: E, creatable: D, onCreate: O, getItemGroup: k, renderGroupLabel: A, hasMore: M, onLoadMore: N, loadingMore: P, getItemDisabled: I, highlightMatch: z, size: B, open: ee, onOpenChange: V }) {
+	let { defaultScale: H } = t(), U = fe(B, H), W = me(U), te = x || !!S, q = de({
+		items: e,
+		searchValue: a,
+		onSearchValueChange: o,
+		getItemLabel: c,
+		getItemKey: l,
+		loading: u,
+		showListContent: d,
+		minSearchLength: f,
+		strings: p,
+		renderItem: _,
+		onSearch: T,
+		debounceMs: E,
+		creatable: D,
+		onCreate: O,
+		getItemGroup: k,
+		hasMore: M,
+		onLoadMore: N,
+		loadingMore: P,
+		highlightMatch: z,
+		size: U,
+		ensuredItems: n ? [n] : []
+	}), [J, Y] = F(!1), X = j((e) => {
+		Y(e), !e && i && o(""), V?.(e);
+	}, [
+		i,
+		V,
+		o
+	]), Z = J ? a : n ? q.itemToStringLabel(n) : "", ie = j((e) => {
+		if (e && G(e)) {
+			let t = K(e);
+			O?.(t);
+			return;
+		}
+		r(e);
+	}, [r, O]);
+	return /* @__PURE__ */ R(s, {
+		gap: "dense",
+		className: "combobox--component",
+		children: [/* @__PURE__ */ R(y, {
+			items: q.allItems,
+			value: n,
+			onValueChange: (e, t) => {
+				if (t.reason === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				ie(e);
+			},
+			inputValue: Z,
+			onInputValueChange: (e, t) => {
+				let { reason: n } = t;
+				if (n === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				if (n === "item-press") {
+					o("");
+					return;
+				}
+				o(e);
+			},
+			itemToStringLabel: q.itemToStringLabel,
+			disabled: m,
+			filter: null,
+			name: b,
+			required: C,
+			open: ee,
+			onOpenChange: X,
+			children: [/* @__PURE__ */ L(he, {
+				placeholder: q.strings.placeholder,
+				clearLabel: q.strings.clear,
+				toggleLabel: q.strings.toggle,
+				className: h,
+				size: W,
+				error: te,
+				required: C,
+				disabled: m,
+				clearable: g,
+				onBlur: w
+			}), /* @__PURE__ */ L(ne, {
+				loading: u,
+				showStatus: q.showStatus,
+				showEmpty: q.showEmpty,
+				searchValue: a,
+				minSearchLength: f,
+				items: q.allItems,
+				groupedItems: q.groupedItems,
+				createOptionItem: q.createOptionItem,
+				renderItemContent: q.renderItemContent,
+				getItemReactKey: q.getItemReactKey,
+				getItemDisabled: I,
+				renderGroupLabel: A,
+				loadingMore: d && !q.showStatus ? P : !1,
+				strings: q.strings,
+				size: U,
+				portalContainer: v,
+				listRef: q.listRef
+			})]
+		}), /* @__PURE__ */ L(re, {
+			error: S,
+			size: U
+		})]
+	});
+}
+function _e({ items: e, selectedValues: n, onSelectedValuesChange: i, searchValue: o, onSearchValueChange: c, getItemLabel: l, getItemKey: u, loading: d = !1, showListContent: f = !0, minSearchLength: m = 3, strings: h, disabled: _ = !1, className: v, renderItem: b, portalContainer: x, name: C, invalid: w, error: D, required: O, onBlur: k, onSearch: A, debounceMs: N, creatable: I, onCreate: z, getItemGroup: B, renderGroupLabel: ee, hasMore: V, onLoadMore: H, loadingMore: U, getItemDisabled: W, highlightMatch: te, size: q, open: J, onOpenChange: Y, closeOnSelect: X = !1, applyButton: Z = !1, onApply: ie, onCancel: ae }) {
+	let { defaultScale: oe } = t(), se = fe(q, oe), ce = me(se), le = pe[se], ue = w || !!D, he = P(null), ge = u ?? l, [_e, ve] = F(n), [ye, be] = F(!1), xe = J !== void 0, Se = xe ? J : ye;
+	M(() => {
+		Z && ve(n);
+	}, [Z, n]);
+	let Q = j((e) => {
+		xe || be(e), Y?.(e);
+	}, [xe, Y]), $ = de({
+		items: e,
+		searchValue: o,
+		onSearchValueChange: c,
+		getItemLabel: l,
+		getItemKey: u,
+		loading: d,
+		showListContent: f,
+		minSearchLength: m,
+		strings: h,
+		renderItem: b,
+		onSearch: A,
+		debounceMs: N,
+		creatable: I,
+		onCreate: z,
+		getItemGroup: B,
+		hasMore: V,
+		onLoadMore: H,
+		loadingMore: U,
+		highlightMatch: te,
+		size: se,
+		ensuredItems: n
+	}), Ce = j((e) => {
+		let t = [], n = null;
+		for (let r of e) G(r) ? n = K(r) : t.push(r);
+		n && z?.(n);
+		let r = t.length !== e.length || !n ? t : null;
+		r && (Z ? ve(r) : i(r)), X && Q(!1);
+	}, [
+		i,
+		z,
+		Z,
+		X,
+		Q
+	]), we = j(() => {
+		Z && i(_e), ie?.(), Q(!1);
+	}, [
+		Z,
+		_e,
+		ie,
+		i,
+		Q
+	]), Te = j(() => {
+		Z && ve(n), ae?.(), Q(!1);
+	}, [
+		Z,
+		n,
+		ae,
+		Q
+	]), Ee = Z ? _e : n, De = Ee.length > 0 ? void 0 : $.strings.placeholder;
+	return /* @__PURE__ */ R(s, {
+		gap: "dense",
+		className: "combobox--component",
+		children: [/* @__PURE__ */ R(y, {
+			items: $.allItems,
+			multiple: !0,
+			value: Ee,
+			onValueChange: (e, t) => {
+				if (t.reason === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				Ce(e);
+			},
+			inputValue: o,
+			onInputValueChange: (e, t) => {
+				let { reason: n } = t;
+				if (n === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				if (n === "item-press") {
+					c("");
+					return;
+				}
+				c(e);
+			},
+			itemToStringLabel: $.itemToStringLabel,
+			disabled: _,
+			filter: null,
+			name: C,
+			required: O,
+			open: Se,
+			onOpenChange: (e) => {
+				!e && Z && ve(n), Q(e);
+			},
+			children: [/* @__PURE__ */ R(S, {
+				ref: he,
+				className: r(T[ce], E[ce], ce === "sm" ? "text-pxs" : "text-sm", "bg-transparent !shadow-none", v),
+				size: le,
+				error: ue,
+				children: [Ee.map((e) => /* @__PURE__ */ L(g, { children: /* @__PURE__ */ L(a, {
+					tag: "span",
+					size: "inherit",
+					weight: "medium",
+					lineHeight: "tight",
+					className: "combobox--chip-label text-inherit",
+					children: l(e)
+				}) }, ge(e))), /* @__PURE__ */ L(p, {
+					placeholder: De,
+					"aria-invalid": ue || void 0,
+					"aria-required": O,
+					onBlur: k
+				})]
+			}), /* @__PURE__ */ L(ne, {
+				loading: d,
+				showStatus: $.showStatus,
+				showEmpty: $.showEmpty,
+				searchValue: o,
+				minSearchLength: m,
+				items: $.allItems,
+				groupedItems: $.groupedItems,
+				createOptionItem: $.createOptionItem,
+				renderItemContent: $.renderItemContent,
+				getItemReactKey: $.getItemReactKey,
+				getItemDisabled: W,
+				renderGroupLabel: ee,
+				loadingMore: f && !$.showStatus ? U : !1,
+				strings: $.strings,
+				size: se,
+				portalContainer: x,
+				listRef: $.listRef,
+				anchor: he,
+				applyFooter: f && Z ? {
+					applyLabel: $.strings.apply,
+					cancelLabel: $.strings.cancel,
+					onApply: we,
+					onCancel: Te
+				} : void 0
+			})]
+		}), /* @__PURE__ */ L(re, {
+			error: D,
+			size: se
+		})]
+	});
+}
+ge.displayName = "Combobox", _e.displayName = "MultiCombobox";
+//#endregion
+//#region src/components/features/combobox/async-resource-combobox.tsx
+var ve = {
+	...U,
+	error: "Unable to load options.",
+	retry: "Retry"
+};
+function ye(e) {
+	return typeof e == "string" || typeof e == "number" || typeof e == "bigint";
+}
+function be({ fetcher: e, value: t, defaultValue: i = null, onValueChange: o, onAfterFetch: l, 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(ve, S), D = t !== void 0, [O, A] = F(i), I = D ? t : O, [z, B] = F(""), [ee, V] = F([]), [H, U] = F(!1), [W, G] = F(null), [K, te] = F(0), q = P(0), J = z.trim(), Y = j((e) => {
+		D || A(e), o?.(e);
+	}, [D, o]), X = k((t, n) => {
+		U(!0), G(null), e(n).then((e) => {
+			n.signal?.aborted || q.current !== t || (V(e), l?.(e, n));
+		}).catch((e) => {
+			n.signal?.aborted || q.current !== t || (V([]), G({
+				error: e,
+				query: n.query
+			}), u?.(e, n));
+		}).finally(() => {
+			!n.signal?.aborted && q.current === t && U(!1);
+		});
+	}, _);
+	M(() => {
+		if (C) return;
+		if (!(J.length > 0 ? J.length >= y : v)) {
+			V([]), U(!1), G(null);
+			return;
+		}
+		let e = q.current + 1;
+		q.current = e;
+		let t = new AbortController();
+		return X(e, {
+			query: J,
+			limit: g,
+			signal: t.signal
+		}), () => {
+			X.cancel(), t.abort();
+		};
+	}, [
+		C,
+		g,
+		y,
+		v,
+		K,
+		X,
+		J
+	]);
+	let Z = j(() => {
+		W && (B(W.query), te((e) => e + 1));
+	}, [W]), ne = j((e) => {
+		if (h) return h(e, {
+			query: J,
+			isSelected: I ? d(I) === d(e) : !1
+		});
+		let t = p?.(e), n = m?.(e);
+		return /* @__PURE__ */ R(s, {
+			render: /* @__PURE__ */ L("span", {}),
+			direction: "horizontal",
+			gap: "md",
+			wrap: !1,
+			className: "async-resource-combobox--option leading-tight",
+			children: [/* @__PURE__ */ L(a, {
+				tag: "span",
+				size: w === "sm" ? "pxs" : void 0,
+				weight: "medium",
+				className: "min-w-0 shrink truncate",
+				children: f(e)
+			}), (!!t || !!n) && /* @__PURE__ */ R("span", {
+				className: "inline-flex min-w-0 flex-1 items-center gap-space-sm overflow-hidden text-muted-foreground",
+				children: [!!t && (ye(t) ? /* @__PURE__ */ L(a, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					className: "min-w-0 truncate",
+					children: t
+				}) : t), !!n && (ye(n) ? /* @__PURE__ */ L(a, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					className: "min-w-0 truncate opacity-75",
+					children: n
+				}) : n)]
+			})]
+		});
+	}, [
+		p,
+		d,
+		f,
+		m,
+		h,
+		I,
+		w,
+		J
+	]), re = N(() => {
+		if (W) return b ?? E.error;
+	}, [
+		b,
+		W,
+		E.error
+	]), ie = W !== null, ae = W ? x?.({
+		error: W.error,
+		query: W.query,
+		retry: Z
+	}) ?? /* @__PURE__ */ L(c, {
+		variant: "inline",
+		title: re,
+		onRetry: Z,
+		retryLabel: E.retry,
+		className: "async-resource-combobox--error mt-space-sm"
+	}) : null;
+	return /* @__PURE__ */ R("div", {
+		"data-component": "async-resource-combobox",
+		"data-slot": "async-resource-combobox",
+		className: r("async-resource-combobox--component", T.className),
+		children: [/* @__PURE__ */ L(ge, {
+			...T,
+			className: void 0,
+			disabled: C,
+			size: w,
+			items: ee,
+			selectedValue: I ?? null,
+			onSelectedValueChange: Y,
+			clearSearchOnClose: !1,
+			searchValue: z,
+			onSearchValueChange: B,
+			getItemLabel: f,
+			getItemKey: d,
+			loading: !ie && H,
+			showListContent: !ie,
+			minSearchLength: y,
+			strings: E,
+			renderItem: ne
+		}), ae]
+	});
+}
+be.displayName = "AsyncResourceCombobox";
+//#endregion
+export { de as a, _e as i, ve as n, U as o, ge as r, be as t };
+
+//# sourceMappingURL=combobox-CB7039j7.js.map