themelia-react-ui 2.0.1 → 2.0.2

package/dist/combobox-C0EQW6dr.js

@@ -0,0 +1,875 @@
+"use client";
+import { s as e, v as t } from "./ui-provider-C_U0Xma4.js";
+import { useStrings as n } from "./lib/strings.js";
+import { t as r } from "./utils-BRhFDwuU.js";
+import { n as i } from "./buttons-DPZekJFu.js";
+import { c as a, o } from "./typography-UTnveOEy.js";
+import { t as s } from "./structure-BmisBK-3.js";
+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 { Combobox as U } from "@base-ui/react/combobox";
+//#region src/components/features/combobox/combobox.strings.ts
+var W = {
+	placeholder: "Search...",
+	clear: "Clear selection",
+	toggle: "Open options",
+	dismiss: "Dismiss",
+	removeSelection: (e) => `Remove ${e}`,
+	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"
+}, G = Symbol("combobox-create-option");
+function K(e) {
+	return typeof e == "object" && !!e && G in e;
+}
+function q(e) {
+	if (!K(e)) throw Error("Item is not a create option");
+	return e[G];
+}
+function J(e) {
+	return { [G]: e };
+}
+//#endregion
+//#region src/components/features/combobox/components/loading-more.tsx
+function ne({ loading: e, text: t, className: n }) {
+	return e ? /* @__PURE__ */ z(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__ */ R(V, {
+			className: "size-icon-sm animate-spin",
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ R(a, {
+			tag: "span",
+			size: "xs",
+			type: "secondary",
+			className: "text-inherit",
+			children: t
+		})]
+	}) : null;
+}
+ne.displayName = "LoadingMore";
+//#endregion
+//#region src/components/features/combobox/components/status-content.tsx
+function Y({ children: e }) {
+	return /* @__PURE__ */ R(a, {
+		tag: "span",
+		size: "inherit",
+		type: "secondary",
+		className: "text-inherit",
+		children: e
+	});
+}
+function X({ 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 (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 null;
+}
+X.displayName = "StatusContent";
+//#endregion
+//#region src/components/features/combobox/components/combobox-dropdown.tsx
+var Z = {
+	sm: "sm",
+	md: "md",
+	lg: "lg"
+}, re = {
+	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, {
+		anchor: N,
+		className: F,
+		children: /* @__PURE__ */ z(b, {
+			"aria-busy": e || void 0,
+			className: r("combobox-dropdown--popup"),
+			children: [
+				!!t && /* @__PURE__ */ R(p, {
+					className: "gap-space-sm px-control py-space-xs text-xs text-muted-foreground",
+					children: /* @__PURE__ */ R(X, {
+						loading: e,
+						searchValue: c,
+						minSearchLength: l,
+						itemCount: d.length,
+						strings: O
+					})
+				}),
+				!!n && /* @__PURE__ */ R(ee, {
+					className: re[A],
+					children: /* @__PURE__ */ R(a, {
+						tag: "span",
+						size: "inherit",
+						type: "secondary",
+						className: "text-inherit",
+						children: O.noResults
+					})
+				}),
+				/* @__PURE__ */ R(k, {
+					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;
+							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, {
+									value: e,
+									size: I,
+									disabled: C?.(e),
+									children: x(e)
+								}, S(e)) })]
+							}, e);
+						}), y != null && /* @__PURE__ */ R(g, {
+							value: y,
+							size: I,
+							children: x(y)
+						}, S(y))] }) : /* @__PURE__ */ R(v, { children: (e) => /* @__PURE__ */ R(g, {
+							value: e,
+							size: I,
+							disabled: C?.(e),
+							children: x(e)
+						}, S(e)) })
+					})
+				}),
+				/* @__PURE__ */ R(ne, {
+					loading: !!D,
+					text: O.loadingMore
+				}),
+				!!P && /* @__PURE__ */ z(s, {
+					direction: "horizontal",
+					gap: "md",
+					justify: "end",
+					wrap: !1,
+					className: "border-t border-border/60 px-control py-space-xs",
+					children: [/* @__PURE__ */ R(i, {
+						type: "button",
+						tone: "secondary",
+						buttonStyle: "ghost",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), P.onCancel();
+						},
+						children: P.cancelLabel
+					}), /* @__PURE__ */ R(i, {
+						type: "button",
+						tone: "primary",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), P.onApply();
+						},
+						children: P.applyLabel
+					})]
+				})
+			]
+		})
+	});
+	return j ? /* @__PURE__ */ R(T, {
+		container: j,
+		children: B
+	}) : /* @__PURE__ */ R(T, { children: B });
+}
+ie.displayName = "ComboboxDropdown";
+//#endregion
+//#region src/components/features/combobox/components/error-message.tsx
+function ae({ error: e, size: t, className: n }) {
+	return e ? /* @__PURE__ */ R(a, {
+		tag: "p",
+		size: "xs",
+		type: "error",
+		className: r("error-message--component", n),
+		role: "alert",
+		"aria-live": "polite",
+		children: e
+	}) : null;
+}
+ae.displayName = "ErrorMessage";
+//#endregion
+//#region src/components/features/combobox/components/highlighted-text.tsx
+function oe(e) {
+	return e.replace(/[$()*+.?[\\\]^{|}]/g, "\\$&");
+}
+function se({ text: e, highlight: t, highlightClassName: n = c.match }) {
+	if (!t.trim()) return /* @__PURE__ */ R(a, {
+		tag: "span",
+		size: "inherit",
+		lineHeight: "tight",
+		className: "text-inherit",
+		children: e
+	});
+	let r = RegExp(`(${oe(t)})`, "gi"), i = e.split(r), o = 0;
+	return /* @__PURE__ */ R(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__ */ R("mark", {
+				className: n,
+				children: e
+			}, i) : /* @__PURE__ */ R(j.Fragment, { children: e }, i);
+		})
+	});
+}
+se.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) => {
+		t?.(e);
+	}, n);
+	N(() => {
+		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 le({ items: e, getItemGroup: t }) {
+	return P(() => {
+		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 ue({ hasMore: e, onLoadMore: t, loadingMore: n }) {
+	let r = F(!1), i = F(null), a = A(() => {
+		r.current = !0, t?.(), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
+			r.current = !1, i.current = null;
+		}, 500);
+	}, 100);
+	return N(() => () => {
+		i.current && clearTimeout(i.current);
+	}, []), { handleScroll: M((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 de(e) {
+	return n(W, e);
+}
+function fe(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({
+		searchValue: t,
+		onSearch: d,
+		debounceMs: f,
+		minSearchLength: c
+	});
+	let { handleScroll: T } = ue({
+		hasMore: s && !w ? g : !1,
+		onLoadMore: _,
+		loadingMore: ee
+	});
+	N(() => {
+		let e = S.current;
+		if (s && !w && e && g && _) return e.addEventListener("scroll", T), () => e.removeEventListener("scroll", T);
+	}, [
+		T,
+		g,
+		_,
+		s,
+		w
+	]);
+	let E = P(() => {
+		if (!s || w) return [];
+		if (y.length === 0) return e;
+		let t = [...y];
+		return e.forEach((e) => {
+			let n = x(e);
+			y.some((e) => x(e) === n) || t.push(e);
+		}), t;
+	}, [
+		e,
+		y,
+		x,
+		s,
+		w
+	]), D = le({
+		items: E,
+		getItemGroup: h
+	}), O = P(() => !s || w || !p || !m || C.length < c ? !1 : !fe(E, C, n), [
+		p,
+		m,
+		C,
+		c,
+		E,
+		n,
+		s,
+		w
+	]), k = P(() => O ? J(C) : null, [O, C]);
+	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) => {
+			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, {
+						tag: "span",
+						size: "inherit",
+						weight: "medium",
+						lineHeight: "tight",
+						className: "text-inherit",
+						children: b.createNew.replace("{value}", t)
+					}) : /* @__PURE__ */ z("span", {
+						className: "inline-flex items-center gap-space-sm",
+						children: [/* @__PURE__ */ R(a, {
+							tag: "span",
+							size: "inherit",
+							weight: "medium",
+							lineHeight: "tight",
+							className: "text-inherit",
+							children: b.createNew
+						}), /* @__PURE__ */ R(a, {
+							tag: "span",
+							size: "inherit",
+							weight: "medium",
+							lineHeight: "tight",
+							className: "text-inherit",
+							children: t
+						})]
+					})]
+				});
+			}
+			if (u) return u(e);
+			let t = n(e);
+			return v && C ? /* @__PURE__ */ R(se, {
+				text: t,
+				highlight: C
+			}) : /* @__PURE__ */ R(a, {
+				tag: "span",
+				size: "inherit",
+				weight: "medium",
+				lineHeight: "tight",
+				className: "text-inherit",
+				children: t
+			});
+		}, [
+			b.createNew,
+			u,
+			n,
+			v,
+			C
+		]),
+		itemToStringLabel: M((e) => K(e) ? q(e) : n(e), [n]),
+		getItemReactKey: M((e) => K(e) ? `__create__:${q(e)}` : String(x(e)), [x]),
+		handleScroll: T
+	};
+}
+//#endregion
+//#region src/components/features/combobox/combobox.tsx
+function me(e, n) {
+	return t(e, n, "md");
+}
+var he = {
+	sm: "sm",
+	md: "md",
+	lg: "lg"
+};
+function ge(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({
+		items: t,
+		searchValue: a,
+		onSearchValueChange: o,
+		getItemLabel: c,
+		getItemKey: l,
+		loading: u,
+		showListContent: d,
+		minSearchLength: f,
+		strings: p,
+		renderItem: _,
+		onSearch: w,
+		debounceMs: T,
+		creatable: E,
+		onCreate: D,
+		getItemGroup: O,
+		hasMore: A,
+		onLoadMore: j,
+		loadingMore: N,
+		highlightMatch: F,
+		size: H,
+		ensuredItems: n ? [n] : []
+	}), [J, ne] = I(!1), Y = M((e) => {
+		ne(e), !e && i && o(""), V?.(e);
+	}, [
+		i,
+		V,
+		o
+	]), X = J ? a : n ? G.itemToStringLabel(n) : "", Z = M((e) => {
+		if (e && K(e)) {
+			let t = q(e);
+			D?.(t);
+			return;
+		}
+		r(e);
+	}, [r, D]);
+	return /* @__PURE__ */ z(s, {
+		gap: "dense",
+		className: "combobox--component",
+		children: [/* @__PURE__ */ z(C, {
+			dismissLabel: G.strings.dismiss,
+			items: G.allItems,
+			value: n,
+			onValueChange: (e, t) => {
+				if (t.reason === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				Z(e);
+			},
+			inputValue: X,
+			onInputValueChange: (e, t) => {
+				let { reason: n } = t;
+				if (n === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				if (n === "item-press") {
+					o("");
+					return;
+				}
+				o(e);
+			},
+			itemToStringLabel: G.itemToStringLabel,
+			disabled: m,
+			filter: null,
+			name: v,
+			required: x,
+			open: B,
+			onOpenChange: Y,
+			children: [/* @__PURE__ */ R(_e, {
+				placeholder: G.strings.placeholder,
+				clearLabel: G.strings.clear,
+				toggleLabel: G.strings.toggle,
+				className: h,
+				size: U,
+				error: W,
+				required: x,
+				disabled: m,
+				clearable: g,
+				onBlur: S
+			}), /* @__PURE__ */ R(ie, {
+				loading: u,
+				showStatus: G.showStatus,
+				showEmpty: G.showEmpty,
+				searchValue: a,
+				minSearchLength: f,
+				items: G.allItems,
+				groupedItems: G.groupedItems,
+				createOptionItem: G.createOptionItem,
+				renderItemContent: G.renderItemContent,
+				getItemReactKey: G.getItemReactKey,
+				getItemDisabled: P,
+				renderGroupLabel: k,
+				loadingMore: d && !G.showStatus ? N : !1,
+				strings: G.strings,
+				size: H,
+				portalContainer: ee,
+				listRef: G.listRef
+			})]
+		}), /* @__PURE__ */ R(ae, {
+			error: b,
+			size: H
+		})]
+	});
+}
+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({
+		items: t,
+		searchValue: o,
+		onSearchValueChange: c,
+		getItemLabel: l,
+		getItemKey: u,
+		loading: d,
+		showListContent: f,
+		minSearchLength: p,
+		strings: m,
+		renderItem: _,
+		onSearch: k,
+		debounceMs: A,
+		creatable: j,
+		onCreate: P,
+		getItemGroup: L,
+		hasMore: V,
+		onLoadMore: te,
+		loadingMore: H,
+		highlightMatch: G,
+		size: ce,
+		ensuredItems: n
+	}), we = M((e) => {
+		let t = [], n = null;
+		for (let r of e) K(r) ? n = q(r) : t.push(r);
+		n && P?.(n);
+		let r = t.length !== e.length || !n ? t : null;
+		r && (Z ? ye(r) : i(r)), X && Q(!1);
+	}, [
+		i,
+		P,
+		Z,
+		X,
+		Q
+	]), Te = M(() => {
+		Z && i(ve), re?.(), Q(!1);
+	}, [
+		Z,
+		ve,
+		re,
+		i,
+		Q
+	]), Ee = M(() => {
+		Z && ye(n), oe?.(), Q(!1);
+	}, [
+		Z,
+		n,
+		oe,
+		Q
+	]), De = Z ? ve : n, Oe = De.length > 0 ? void 0 : $.strings.placeholder;
+	return /* @__PURE__ */ z(s, {
+		gap: "dense",
+		className: "combobox--component",
+		children: [/* @__PURE__ */ z(C, {
+			dismissLabel: $.strings.dismiss,
+			items: $.allItems,
+			multiple: !0,
+			value: De,
+			onValueChange: (e, t) => {
+				if (t.reason === "escape-key") {
+					t.allowPropagation();
+					return;
+				}
+				we(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: h,
+			filter: null,
+			name: v,
+			required: T,
+			open: Ce,
+			onOpenChange: (e) => {
+				!e && Z && ye(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, {
+					strings: { remove: ($.strings.removeSelection ?? W.removeSelection)(l(e)) },
+					children: /* @__PURE__ */ R(a, {
+						tag: "span",
+						size: "inherit",
+						weight: "medium",
+						lineHeight: "tight",
+						className: "combobox--chip-label text-inherit",
+						children: l(e)
+					})
+				}, _e(e))), /* @__PURE__ */ R(y, {
+					placeholder: Oe,
+					"aria-invalid": de || void 0,
+					"aria-required": T,
+					onBlur: O
+				})]
+			}), /* @__PURE__ */ R(ie, {
+				loading: d,
+				showStatus: $.showStatus,
+				showEmpty: $.showEmpty,
+				searchValue: o,
+				minSearchLength: p,
+				items: $.allItems,
+				groupedItems: $.groupedItems,
+				createOptionItem: $.createOptionItem,
+				renderItemContent: $.renderItemContent,
+				getItemReactKey: $.getItemReactKey,
+				getItemDisabled: U,
+				renderGroupLabel: B,
+				loadingMore: f && !$.showStatus ? H : !1,
+				strings: $.strings,
+				size: ce,
+				portalContainer: ee,
+				listRef: $.listRef,
+				anchor: fe,
+				applyFooter: f && Z ? {
+					applyLabel: $.strings.apply,
+					cancelLabel: $.strings.cancel,
+					onApply: Te,
+					onCancel: Ee
+				} : void 0
+			})]
+		}), /* @__PURE__ */ R(ae, {
+			error: w,
+			size: ce
+		})]
+	});
+}
+ve.displayName = "Combobox", ye.displayName = "MultiCombobox";
+//#endregion
+//#region src/components/features/combobox/async-resource-combobox.tsx
+var be = {
+	...W,
+	error: "Unable to load options.",
+	retry: "Retry"
+};
+function xe(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));
+		}).catch((e) => {
+			n.signal?.aborted || q.current !== t || (V([]), W({
+				error: e,
+				query: n.query
+			}), u?.(e, n));
+		}).finally(() => {
+			!n.signal?.aborted && q.current === t && H(!1);
+		});
+	}, _);
+	N(() => {
+		if (S) return;
+		if (!(J.length > 0 ? J.length >= v : ee)) {
+			V([]), H(!1), W(null);
+			return;
+		}
+		let e = q.current + 1;
+		q.current = e;
+		let t = new AbortController();
+		return Y(e, {
+			query: J,
+			limit: g,
+			signal: t.signal
+		}), () => {
+			Y.cancel(), t.abort();
+		};
+	}, [
+		S,
+		g,
+		v,
+		ee,
+		G,
+		Y,
+		J
+	]);
+	let X = M(() => {
+		U && (L(U.query), K((e) => e + 1));
+	}, [U]), Z = M((e) => {
+		if (h) return h(e, {
+			query: J,
+			isSelected: k ? d(k) === d(e) : !1
+		});
+		let t = p?.(e), n = m?.(e);
+		return /* @__PURE__ */ z(s, {
+			render: /* @__PURE__ */ R("span", {}),
+			direction: "horizontal",
+			gap: "md",
+			wrap: !1,
+			className: "async-resource-combobox--option leading-tight",
+			children: [/* @__PURE__ */ R(a, {
+				type: "inherit",
+				tag: "span",
+				size: C === "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, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					className: "min-w-0 truncate",
+					children: t
+				}) : t), !!n && (xe(n) ? /* @__PURE__ */ R(a, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					className: "min-w-0 truncate",
+					children: n
+				}) : n)]
+			})]
+		});
+	}, [
+		p,
+		d,
+		f,
+		m,
+		h,
+		k,
+		C,
+		J
+	]), re = P(() => {
+		if (U) return y ?? T.error;
+	}, [
+		y,
+		U,
+		T.error
+	]), ie = U !== null, ae = U ? b?.({
+		error: U.error,
+		query: U.query,
+		retry: X
+	}) ?? /* @__PURE__ */ R(l, {
+		variant: "inline",
+		title: re,
+		onRetry: X,
+		retryLabel: T.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: void 0,
+			disabled: S,
+			size: C,
+			items: B,
+			selectedValue: k ?? null,
+			onSelectedValueChange: ne,
+			clearSearchOnClose: !1,
+			searchValue: j,
+			onSearchValueChange: L,
+			getItemLabel: f,
+			getItemKey: d,
+			loading: !ie && te,
+			showListContent: !ie,
+			minSearchLength: v,
+			strings: T,
+			renderItem: Z
+		}), ae]
+	});
+}
+Se.displayName = "AsyncResourceCombobox";
+//#endregion
+export { pe as a, ye as i, be as n, W as o, ve as r, Se as t };
+
+//# sourceMappingURL=combobox-C0EQW6dr.js.map