themelia-ui 1.0.0

package/dist/combobox-DtElGhBC.js

@@ -0,0 +1,679 @@
+import "./css/combobox2.css";
+import { t as e } from "./cx--CBrhWH0.js";
+import { i as t, o as n } from "./typography-vC_wwEBm.js";
+import { t as r } from "./feedback-DHdvxang.js";
+import { c as i } from "./buttons-CabBjPap.js";
+import { m as a } from "./display-DTWjv_bB.js";
+import { t as o } from "./use-debounced-callback-BcKYwxqp.js";
+import { S as s, _ as c, a as l, b as u, c as d, d as f, g as p, i as m, l as h, m as g, o as _, p as v, u as y, v as b, y as x } from "./combobox-CpbPl8He.js";
+import { t as S } from "./spinner-4Z1vjSiH.js";
+import { PlusIcon as C } from "lucide-react";
+import { useCallback as w, useEffect 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";
+var M = {
+	root: "combobox-module__root___MRFfw",
+	error: "combobox-module__error___sjowi",
+	errorState: "combobox-module__errorState___HVpfT",
+	positioner: "combobox-module__positioner___XdeoK",
+	popup: "combobox-module__popup___dMF8X",
+	status: "combobox-module__status___ROfZI",
+	empty: "combobox-module__empty___XTTms",
+	scroller: "combobox-module__scroller___c26Ns",
+	list: "combobox-module__list___odfqn",
+	item: "combobox-module__item___PeH4Q",
+	group: "combobox-module__group___yEKSk",
+	groupLabel: "combobox-module__groupLabel___fjHNc",
+	createRow: "combobox-module__createRow___TaNsO",
+	mark: "combobox-module__mark___q7-1L",
+	loadingMore: "combobox-module__loadingMore___UfWKl",
+	footer: "combobox-module__footer___3hnAA",
+	option: "combobox-module__option___2qucx",
+	optionLabel: "combobox-module__optionLabel___iUvry",
+	optionMeta: "combobox-module__optionMeta___rn1BI",
+	optionQuiet: "combobox-module__optionQuiet___hhGlk"
+};
+//#endregion
+//#region src/components/features/combobox/combobox-dropdown.tsx
+function N({ loading: e, trimmedSearch: t, minSearchLength: r, strings: i }) {
+	return e ? /* @__PURE__ */ A(S, { label: i.searching }) : t === "" ? /* @__PURE__ */ A(n, {
+		size: "xs",
+		type: "secondary",
+		children: i.formatTypeToSearch(r)
+	}) : t.length < r ? /* @__PURE__ */ A(n, {
+		size: "xs",
+		type: "secondary",
+		children: i.formatTypeMore(r - t.length)
+	}) : null;
+}
+function P({ loading: e, showStatus: r, showEmpty: o, trimmedSearch: l, minSearchLength: u, items: m, groupedItems: _, createOptionItem: v, renderItemContent: C, getItemReactKey: w, getItemDisabled: T, renderGroupLabel: E, loadingMore: D, strings: O, portalContainer: P, listRef: F, anchor: I, applyFooter: L, errorSlot: R }) {
+	let z = !!R || r || o || m.length > 0 || !!D || !!L, B = (e) => /* @__PURE__ */ A(g, {
+		value: e,
+		disabled: T?.(e),
+		className: M.item,
+		children: C(e)
+	}, w(e)), V = /* @__PURE__ */ A(x, {
+		anchor: I,
+		className: P ? M.positioner : void 0,
+		children: /* @__PURE__ */ A(c, {
+			"aria-busy": e || void 0,
+			"data-empty": !z || void 0,
+			className: M.popup,
+			children: R ?? /* @__PURE__ */ j(k, { children: [
+				r && /* @__PURE__ */ A(s, {
+					className: M.status,
+					children: /* @__PURE__ */ A(N, {
+						loading: e,
+						trimmedSearch: l,
+						minSearchLength: u,
+						strings: O
+					})
+				}),
+				o && /* @__PURE__ */ A(h, {
+					className: M.empty,
+					children: /* @__PURE__ */ A(n, {
+						size: "sm",
+						type: "secondary",
+						children: O.noResults
+					})
+				}),
+				/* @__PURE__ */ A(a, {
+					ref: F,
+					className: M.scroller,
+					children: /* @__PURE__ */ A(p, {
+						className: M.list,
+						children: _ ? /* @__PURE__ */ j(k, { children: [Array.from(_.entries()).map(([e, n]) => {
+							let r = E ? E(e) : e;
+							return /* @__PURE__ */ j(y, {
+								items: n,
+								className: M.group,
+								children: [/* @__PURE__ */ A(f, {
+									className: M.groupLabel,
+									children: typeof r == "string" || typeof r == "number" ? /* @__PURE__ */ A(t, { children: r }) : r
+								}), /* @__PURE__ */ A(d, { children: B })]
+							}, e);
+						}), v !== null && B(v)] }) : /* @__PURE__ */ A(d, { children: B })
+					})
+				}),
+				!!D && /* @__PURE__ */ A("div", {
+					role: "status",
+					"aria-live": "polite",
+					className: M.loadingMore,
+					children: /* @__PURE__ */ A(S, { label: O.loadingMore })
+				}),
+				!!L && /* @__PURE__ */ j("div", {
+					className: M.footer,
+					children: [/* @__PURE__ */ A(i, {
+						type: "button",
+						tone: "neutral",
+						buttonStyle: "ghost",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), L.onCancel();
+						},
+						children: L.cancelLabel
+					}), /* @__PURE__ */ A(i, {
+						type: "button",
+						onClick: (e) => {
+							e.preventDefault(), e.stopPropagation(), L.onApply();
+						},
+						children: L.applyLabel
+					})]
+				})
+			] })
+		})
+	});
+	return /* @__PURE__ */ A(b, {
+		container: P,
+		children: V
+	});
+}
+//#endregion
+//#region src/components/features/combobox/combobox.strings.ts
+var F = {
+	placeholder: "Search…",
+	clear: "Clear selection",
+	toggle: "Show options",
+	searching: "Searching…",
+	noResults: "No results found.",
+	formatTypeToSearch: (e) => `Type at least ${e} characters to search…`,
+	formatTypeMore: (e) => `Type ${e} more character${e === 1 ? "" : "s"} to search…`,
+	formatCreate: (e) => `Create “${e}”`,
+	loadingMore: "Loading…",
+	apply: "Apply",
+	cancel: "Cancel",
+	errorTitle: "Could not load results",
+	retry: "Retry"
+};
+//#endregion
+//#region src/components/features/combobox/highlighted-text.tsx
+function I(e) {
+	return e.replace(/[$()*+.?[\\\]^{|}]/g, "\\$&");
+}
+function L({ text: e, highlight: t }) {
+	if (!t.trim()) return /* @__PURE__ */ A(n, {
+		tag: "span",
+		size: "inherit",
+		type: "inherit",
+		lineHeight: "tight",
+		className: "highlighted-text--component",
+		children: e
+	});
+	let r = e.split(RegExp(`(${I(t)})`, "gi")), i = r.reduce((e, t, n) => [...e, (e[n] ?? 0) + t.length], [0]);
+	return /* @__PURE__ */ A(n, {
+		tag: "span",
+		size: "inherit",
+		type: "inherit",
+		lineHeight: "tight",
+		children: r.map((e, t) => {
+			let n = String(i[t]);
+			return t % 2 == 1 ? /* @__PURE__ */ A("mark", {
+				className: M.mark,
+				children: e
+			}, n) : /* @__PURE__ */ A("span", { children: e }, n);
+		})
+	});
+}
+//#endregion
+//#region src/components/features/combobox/use-combobox-core.tsx
+var R = 3, z = .8, B = 100, V = 500, H = Symbol("combobox-create-option");
+function U(e) {
+	return typeof e == "object" && !!e && H in e;
+}
+function W(e) {
+	if (!U(e)) throw Error("That item is not a create option.");
+	return e[H];
+}
+function G(e) {
+	return { [H]: e };
+}
+function K({ searchValue: e, onSearch: t, debounceMs: n = 300, minSearchLength: r = 3 }) {
+	let i = o((e) => t?.(e), n);
+	T(() => {
+		let t = e.trim();
+		if (!(t.length < r)) return i(t), i.cancel;
+	}, [
+		i,
+		r,
+		e
+	]);
+}
+function q({ hasMore: e, onLoadMore: t, loadingMore: n }) {
+	let r = D(!1), i = D(null), a = o(() => {
+		r.current = !0, t?.(), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
+			r.current = !1, i.current = null;
+		}, V);
+	}, B);
+	return T(() => () => {
+		i.current && clearTimeout(i.current);
+	}, []), { handleScroll: w((i) => {
+		if (!e || !t || n || r.current) return;
+		let { scrollHeight: o, scrollTop: s, clientHeight: c } = i.target;
+		(s + c) / o >= z && a();
+	}, [
+		e,
+		n,
+		t,
+		a
+	]) };
+}
+function ee({ items: e, searchValue: t, 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,
+		...c
+	}, { formatCreate: x } = b, S = i ?? r, O = D(null), k = t.trim(), N = o && (a || k.length < s);
+	K({
+		searchValue: t,
+		onSearch: u,
+		debounceMs: d,
+		minSearchLength: s
+	});
+	let { handleScroll: P } = q({
+		hasMore: o && !N ? h : !1,
+		onLoadMore: g,
+		loadingMore: _
+	});
+	T(() => {
+		let e = O.current;
+		if (!(!o || N || !e || !h || !g)) return e.addEventListener("scroll", P), () => e.removeEventListener("scroll", P);
+	}, [
+		P,
+		h,
+		g,
+		o,
+		N
+	]);
+	let I = E(() => {
+		if (!o || N) return [];
+		if (y.length === 0) return e;
+		let t = [...y];
+		for (let n of e) y.some((e) => S(e) === S(n)) || t.push(n);
+		return t;
+	}, [
+		y,
+		S,
+		e,
+		o,
+		N
+	]), R = E(() => {
+		if (!m) return null;
+		let e = /* @__PURE__ */ new Map();
+		for (let t of I) {
+			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.length < s) return !1;
+		let e = k.toLowerCase();
+		return !I.some((t) => r(t).toLowerCase() === e);
+	}, [
+		I,
+		f,
+		r,
+		s,
+		p,
+		o,
+		N,
+		k
+	]), B = E(() => z ? G(k) : null, [z, k]);
+	return {
+		strings: b,
+		getKey: S,
+		trimmedSearch: k,
+		listRef: O,
+		baseItems: I,
+		allItems: E(() => B ? [...I, B] : I, [I, B]),
+		groupedItems: R,
+		createOptionItem: B,
+		showStatus: N,
+		showEmpty: o && !a && k.length >= s && e.length === 0 && !z,
+		showCreateOption: z,
+		renderItemContent: w((e) => {
+			if (U(e)) return /* @__PURE__ */ j("span", {
+				className: M.createRow,
+				children: [/* @__PURE__ */ A(C, { "aria-hidden": !0 }), /* @__PURE__ */ A(n, {
+					tag: "span",
+					size: "inherit",
+					type: "inherit",
+					weight: "medium",
+					lineHeight: "tight",
+					children: x(W(e))
+				})]
+			});
+			if (l) return l(e);
+			let t = r(e);
+			return v && k ? /* @__PURE__ */ A(L, {
+				text: t,
+				highlight: k
+			}) : /* @__PURE__ */ A(n, {
+				tag: "span",
+				size: "inherit",
+				type: "inherit",
+				weight: "medium",
+				lineHeight: "tight",
+				children: t
+			});
+		}, [
+			x,
+			r,
+			v,
+			l,
+			k
+		]),
+		itemToStringLabel: w((e) => U(e) ? W(e) : r(e), [r]),
+		getItemReactKey: w((e) => U(e) ? `__create__:${W(e)}` : String(S(e)), [S]),
+		handleScroll: P
+	};
+}
+//#endregion
+//#region src/components/features/combobox/async-combobox.tsx
+function te({ error: e }) {
+	return e ? /* @__PURE__ */ A(n, {
+		tag: "p",
+		size: "xs",
+		type: "error",
+		role: "alert",
+		"aria-live": "polite",
+		className: M.error,
+		children: e
+	}) : null;
+}
+function J({ id: t, items: n, selectedValue: r, onSelectedValueChange: i, clearSearchOnClose: a = !0, searchValue: o, onSearchValueChange: s, getItemLabel: c, getItemKey: l, loading: d = !1, showListContent: f = !0, minSearchLength: p = 3, strings: m, disabled: h = !1, className: g, clearable: _ = !0, renderItem: y, portalContainer: b, name: x, invalid: S, error: C, required: T, onBlur: E, onSearch: D, debounceMs: k, creatable: N, onCreate: F, getItemGroup: I, renderGroupLabel: L, hasMore: R, onLoadMore: z, loadingMore: B, getItemDisabled: V, highlightMatch: H, open: G, onOpenChange: K }) {
+	let q = ee({
+		items: n,
+		searchValue: o,
+		onSearchValueChange: s,
+		getItemLabel: c,
+		getItemKey: l,
+		loading: d,
+		showListContent: f,
+		minSearchLength: p,
+		strings: m,
+		renderItem: y,
+		onSearch: D,
+		debounceMs: k,
+		creatable: N,
+		onCreate: F,
+		getItemGroup: I,
+		hasMore: R,
+		onLoadMore: z,
+		loadingMore: B,
+		highlightMatch: H,
+		ensuredItems: r ? [r] : []
+	}), [J, Y] = O(!1), X = w((e) => {
+		Y(e), !e && a && s(""), K?.(e);
+	}, [
+		a,
+		K,
+		s
+	]), ne = J ? o : r ? q.itemToStringLabel(r) : "", Z = w((e) => {
+		if (e && U(e)) {
+			F?.(W(e));
+			return;
+		}
+		i(e);
+	}, [F, i]);
+	return /* @__PURE__ */ j("div", {
+		className: e("async-combobox--component", M.root),
+		children: [/* @__PURE__ */ j(u, {
+			items: q.allItems,
+			value: r,
+			onValueChange: Z,
+			inputValue: ne,
+			onInputValueChange: (e, { reason: t }) => {
+				if (t === "item-press") {
+					s("");
+					return;
+				}
+				s(e);
+			},
+			itemToStringLabel: q.itemToStringLabel,
+			disabled: h,
+			filter: null,
+			name: x,
+			required: T,
+			open: G,
+			onOpenChange: X,
+			children: [/* @__PURE__ */ A(v, {
+				id: t,
+				placeholder: q.strings.placeholder,
+				showClear: _,
+				invalid: S || !!C,
+				"aria-required": T,
+				disabled: h,
+				onBlur: E,
+				className: g
+			}), /* @__PURE__ */ A(P, {
+				loading: d,
+				showStatus: q.showStatus,
+				showEmpty: q.showEmpty,
+				trimmedSearch: q.trimmedSearch,
+				minSearchLength: p,
+				items: q.allItems,
+				groupedItems: q.groupedItems,
+				createOptionItem: q.createOptionItem,
+				renderItemContent: q.renderItemContent,
+				getItemReactKey: q.getItemReactKey,
+				getItemDisabled: V,
+				renderGroupLabel: L,
+				loadingMore: f && !q.showStatus ? B : !1,
+				strings: q.strings,
+				portalContainer: b,
+				listRef: q.listRef
+			})]
+		}), /* @__PURE__ */ A(te, { error: C })]
+	});
+}
+function Y({ id: t, items: r, selectedValues: i, onSelectedValuesChange: a, searchValue: o, onSearchValueChange: s, getItemLabel: c, getItemKey: d, loading: f = !1, showListContent: p = !0, minSearchLength: h = 3, strings: g, disabled: v = !1, className: y, renderItem: b, portalContainer: x, name: S, invalid: C, error: T, required: E, onBlur: k, onSearch: N, debounceMs: F, creatable: I, onCreate: L, getItemGroup: R, renderGroupLabel: z, hasMore: B, onLoadMore: V, loadingMore: H, getItemDisabled: G, highlightMatch: K, open: q, onOpenChange: J, closeOnSelect: Y = !1, applyButton: X = !1, onApply: ne, onCancel: Z }) {
+	let re = D(null), ie = d ?? c, [ae, oe] = O(i), [se, ce] = O(!1), le = q !== void 0, ue = le ? q : se, [de, fe] = O(i);
+	X && i !== de && (fe(i), oe(i));
+	let Q = w((e) => {
+		le || ce(e), J?.(e);
+	}, [le, J]), $ = ee({
+		items: r,
+		searchValue: o,
+		onSearchValueChange: s,
+		getItemLabel: c,
+		getItemKey: d,
+		loading: f,
+		showListContent: p,
+		minSearchLength: h,
+		strings: g,
+		renderItem: b,
+		onSearch: N,
+		debounceMs: F,
+		creatable: I,
+		onCreate: L,
+		getItemGroup: R,
+		hasMore: B,
+		onLoadMore: V,
+		loadingMore: H,
+		highlightMatch: K,
+		ensuredItems: i
+	}), pe = w((e) => {
+		let t = [], n = null;
+		for (let r of e) U(r) ? n = W(r) : t.push(r);
+		n !== null && L?.(n), (n === null || t.length !== e.length - 1) && (X ? oe(t) : a(t)), Y && Q(!1);
+	}, [
+		X,
+		Y,
+		L,
+		a,
+		Q
+	]), me = w(() => {
+		X && a(ae), ne?.(), Q(!1);
+	}, [
+		X,
+		ae,
+		ne,
+		a,
+		Q
+	]), he = w(() => {
+		X && oe(i), Z?.(), Q(!1);
+	}, [
+		X,
+		Z,
+		i,
+		Q
+	]), ge = X ? ae : i;
+	return /* @__PURE__ */ j("div", {
+		className: e("async-multi-combobox--component", M.root),
+		children: [/* @__PURE__ */ j(u, {
+			items: $.allItems,
+			multiple: !0,
+			value: ge,
+			onValueChange: pe,
+			inputValue: o,
+			onInputValueChange: (e, { reason: t }) => {
+				if (t === "item-press") {
+					s("");
+					return;
+				}
+				s(e);
+			},
+			itemToStringLabel: $.itemToStringLabel,
+			disabled: v,
+			filter: null,
+			name: S,
+			required: E,
+			open: ue,
+			onOpenChange: (e) => {
+				!e && X && oe(i), Q(e);
+			},
+			children: [/* @__PURE__ */ j(l, {
+				ref: re,
+				invalid: C || !!T,
+				className: y,
+				children: [ge.map((e) => /* @__PURE__ */ A(m, { children: /* @__PURE__ */ A(n, {
+					tag: "span",
+					size: "inherit",
+					type: "inherit",
+					weight: "medium",
+					lineHeight: "tight",
+					children: c(e)
+				}) }, ie(e))), /* @__PURE__ */ A(_, {
+					id: t,
+					placeholder: ge.length > 0 ? void 0 : $.strings.placeholder,
+					"aria-invalid": C || !!T || void 0,
+					"aria-required": E,
+					onBlur: k
+				})]
+			}), /* @__PURE__ */ A(P, {
+				loading: f,
+				showStatus: $.showStatus,
+				showEmpty: $.showEmpty,
+				trimmedSearch: $.trimmedSearch,
+				minSearchLength: h,
+				items: $.allItems,
+				groupedItems: $.groupedItems,
+				createOptionItem: $.createOptionItem,
+				renderItemContent: $.renderItemContent,
+				getItemReactKey: $.getItemReactKey,
+				getItemDisabled: G,
+				renderGroupLabel: z,
+				loadingMore: p && !$.showStatus ? H : !1,
+				strings: $.strings,
+				portalContainer: x,
+				listRef: $.listRef,
+				anchor: re,
+				applyFooter: p && X ? {
+					applyLabel: $.strings.apply,
+					cancelLabel: $.strings.cancel,
+					onApply: me,
+					onCancel: he
+				} : void 0
+			})]
+		}), /* @__PURE__ */ A(te, { error: T })]
+	});
+}
+//#endregion
+//#region src/components/features/combobox/resource-combobox.tsx
+function X(e) {
+	return typeof e == "string" || typeof e == "number";
+}
+function ne({ fetcher: t, value: i, defaultValue: a = null, onValueChange: s, onAfterFetch: c, onError: l, getKey: u, getLabel: d, getDescription: f, getMeta: p, renderOption: m, limit: h = 10, debounceMs: g = 300, preload: _ = !0, minSearchLength: v = 0, errorMessage: y, renderError: b, strings: x, disabled: S, className: C, ...k }) {
+	let N = {
+		...F,
+		...x
+	}, P = i !== void 0, [I, L] = O(a), R = P ? i : I, [z, B] = O(""), [V, H] = O([]), [U, W] = O(!1), [G, K] = O(null), [q, ee] = O(0), te = D(0), Y = z.trim(), ne = w((e) => {
+		P || L(e), s?.(e);
+	}, [P, s]), Z = o((e, n) => {
+		W(!0), K(null);
+		let r = () => !n.signal?.aborted && te.current === e;
+		t(n).then((e) => {
+			r() && (H(e), c?.(e, n));
+		}).catch((e) => {
+			r() && (H([]), K({
+				error: e,
+				query: n.query
+			}), l?.(e, n));
+		}).finally(() => {
+			r() && W(!1);
+		});
+	}, g);
+	T(() => {
+		if (S) return;
+		if (!(Y.length > 0 ? Y.length >= v : _)) {
+			H([]), W(!1), K(null);
+			return;
+		}
+		let e = ++te.current, t = new AbortController();
+		return Z(e, {
+			query: Y,
+			limit: h,
+			signal: t.signal
+		}), () => {
+			Z.cancel(), t.abort();
+		};
+	}, [
+		S,
+		h,
+		v,
+		_,
+		q,
+		Z,
+		Y
+	]);
+	let re = w(() => {
+		G && (B(G.query), ee((e) => e + 1));
+	}, [G]), ie = w((e) => {
+		if (m) return m(e, {
+			query: Y,
+			isSelected: R ? u(R) === u(e) : !1
+		});
+		let t = f?.(e), r = p?.(e);
+		return /* @__PURE__ */ j("span", {
+			className: M.option,
+			children: [/* @__PURE__ */ A(n, {
+				tag: "span",
+				size: "inherit",
+				type: "inherit",
+				weight: "medium",
+				lineHeight: "tight",
+				truncate: !0,
+				className: M.optionLabel,
+				children: d(e)
+			}), (!!t || !!r) && /* @__PURE__ */ j("span", {
+				className: M.optionMeta,
+				children: [!!t && (X(t) ? /* @__PURE__ */ A(n, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					truncate: !0,
+					children: t
+				}) : t), !!r && (X(r) ? /* @__PURE__ */ A(n, {
+					tag: "span",
+					size: "xs",
+					type: "secondary",
+					truncate: !0,
+					className: M.optionQuiet,
+					children: r
+				}) : r)]
+			})]
+		});
+	}, [
+		f,
+		u,
+		d,
+		p,
+		m,
+		R,
+		Y
+	]), ae = E(() => G ? y ?? N.errorTitle : void 0, [
+		N.errorTitle,
+		y,
+		G
+	]), oe = G ? b?.({
+		error: G.error,
+		query: G.query,
+		retry: re
+	}) ?? /* @__PURE__ */ A(r, {
+		title: ae,
+		onRetry: re,
+		strings: { retry: N.retry },
+		className: M.errorState
+	}) : null;
+	return /* @__PURE__ */ j("div", {
+		"data-slot": "resource-combobox",
+		className: e("resource-combobox--component", C),
+		children: [/* @__PURE__ */ A(J, {
+			...k,
+			disabled: S,
+			items: V,
+			selectedValue: R ?? null,
+			onSelectedValueChange: ne,
+			clearSearchOnClose: !1,
+			searchValue: z,
+			onSearchValueChange: B,
+			getItemLabel: d,
+			getItemKey: u,
+			loading: !G && U,
+			showListContent: !G,
+			minSearchLength: v,
+			debounceMs: g,
+			strings: x,
+			renderItem: ie
+		}), oe]
+	});
+}
+//#endregion
+export { ee as a, P as c, R as i, J as n, L as o, Y as r, F as s, ne as t };

package/dist/combobox-yxVK4MN-.cjs

@@ -0,0 +1 @@
+const e=require("./typography-kBzTy-jM.cjs"),t=require("./feedback-lBKIc2cQ.cjs"),n=require("./buttons-CQc0AVpb.cjs"),r=require("./display-BPuD0OAo.cjs"),i=require("./use-debounced-callback-BiZB-QB2.cjs"),a=require("./combobox-BBMDtymi.cjs"),o=require("./spinner-Bc_A0cRc.cjs");let s=require("lucide-react"),c=require("react"),l=require("react/jsx-runtime"),u=require("clsx");var d={root:`combobox-module__root___MRFfw`,error:`combobox-module__error___sjowi`,errorState:`combobox-module__errorState___HVpfT`,positioner:`combobox-module__positioner___XdeoK`,popup:`combobox-module__popup___dMF8X`,status:`combobox-module__status___ROfZI`,empty:`combobox-module__empty___XTTms`,scroller:`combobox-module__scroller___c26Ns`,list:`combobox-module__list___odfqn`,item:`combobox-module__item___PeH4Q`,group:`combobox-module__group___yEKSk`,groupLabel:`combobox-module__groupLabel___fjHNc`,createRow:`combobox-module__createRow___TaNsO`,mark:`combobox-module__mark___q7-1L`,loadingMore:`combobox-module__loadingMore___UfWKl`,footer:`combobox-module__footer___3hnAA`,option:`combobox-module__option___2qucx`,optionLabel:`combobox-module__optionLabel___iUvry`,optionMeta:`combobox-module__optionMeta___rn1BI`,optionQuiet:`combobox-module__optionQuiet___hhGlk`};function f({loading:t,trimmedSearch:n,minSearchLength:r,strings:i}){return t?(0,l.jsx)(o.t,{label:i.searching}):n===``?(0,l.jsx)(e.o,{size:`xs`,type:`secondary`,children:i.formatTypeToSearch(r)}):n.length<r?(0,l.jsx)(e.o,{size:`xs`,type:`secondary`,children:i.formatTypeMore(r-n.length)}):null}function p({loading:t,showStatus:i,showEmpty:s,trimmedSearch:c,minSearchLength:u,items:p,groupedItems:m,createOptionItem:h,renderItemContent:g,getItemReactKey:_,getItemDisabled:v,renderGroupLabel:y,loadingMore:b,strings:x,portalContainer:S,listRef:C,anchor:w,applyFooter:T,errorSlot:E}){let D=!!E||i||s||p.length>0||!!b||!!T,O=e=>(0,l.jsx)(a.m,{value:e,disabled:v?.(e),className:d.item,children:g(e)},_(e)),k=(0,l.jsx)(a.y,{anchor:w,className:S?d.positioner:void 0,children:(0,l.jsx)(a._,{"aria-busy":t||void 0,"data-empty":!D||void 0,className:d.popup,children:E??(0,l.jsxs)(l.Fragment,{children:[i&&(0,l.jsx)(a.S,{className:d.status,children:(0,l.jsx)(f,{loading:t,trimmedSearch:c,minSearchLength:u,strings:x})}),s&&(0,l.jsx)(a.l,{className:d.empty,children:(0,l.jsx)(e.o,{size:`sm`,type:`secondary`,children:x.noResults})}),(0,l.jsx)(r.m,{ref:C,className:d.scroller,children:(0,l.jsx)(a.g,{className:d.list,children:m?(0,l.jsxs)(l.Fragment,{children:[Array.from(m.entries()).map(([t,n])=>{let r=y?y(t):t;return(0,l.jsxs)(a.u,{items:n,className:d.group,children:[(0,l.jsx)(a.d,{className:d.groupLabel,children:typeof r==`string`||typeof r==`number`?(0,l.jsx)(e.i,{children:r}):r}),(0,l.jsx)(a.c,{children:O})]},t)}),h!==null&&O(h)]}):(0,l.jsx)(a.c,{children:O})})}),!!b&&(0,l.jsx)(`div`,{role:`status`,"aria-live":`polite`,className:d.loadingMore,children:(0,l.jsx)(o.t,{label:x.loadingMore})}),!!T&&(0,l.jsxs)(`div`,{className:d.footer,children:[(0,l.jsx)(n.c,{type:`button`,tone:`neutral`,buttonStyle:`ghost`,onClick:e=>{e.preventDefault(),e.stopPropagation(),T.onCancel()},children:T.cancelLabel}),(0,l.jsx)(n.c,{type:`button`,onClick:e=>{e.preventDefault(),e.stopPropagation(),T.onApply()},children:T.applyLabel})]})]})})});return(0,l.jsx)(a.v,{container:S,children:k})}var m={placeholder:`Search…`,clear:`Clear selection`,toggle:`Show options`,searching:`Searching…`,noResults:`No results found.`,formatTypeToSearch:e=>`Type at least ${e} characters to search…`,formatTypeMore:e=>`Type ${e} more character${e===1?``:`s`} to search…`,formatCreate:e=>`Create “${e}”`,loadingMore:`Loading…`,apply:`Apply`,cancel:`Cancel`,errorTitle:`Could not load results`,retry:`Retry`};function h(e){return e.replace(/[$()*+.?[\\\]^{|}]/g,`\\$&`)}function g({text:t,highlight:n}){if(!n.trim())return(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,lineHeight:`tight`,className:`highlighted-text--component`,children:t});let r=t.split(RegExp(`(${h(n)})`,`gi`)),i=r.reduce((e,t,n)=>[...e,(e[n]??0)+t.length],[0]);return(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,lineHeight:`tight`,children:r.map((e,t)=>{let n=String(i[t]);return t%2==1?(0,l.jsx)(`mark`,{className:d.mark,children:e},n):(0,l.jsx)(`span`,{children:e},n)})})}var _=3,v=.8,y=100,b=500,x=Symbol(`combobox-create-option`);function S(e){return typeof e==`object`&&!!e&&x in e}function C(e){if(!S(e))throw Error(`That item is not a create option.`);return e[x]}function w(e){return{[x]:e}}function T({searchValue:e,onSearch:t,debounceMs:n=300,minSearchLength:r=3}){let a=i.t(e=>t?.(e),n);(0,c.useEffect)(()=>{let t=e.trim();if(!(t.length<r))return a(t),a.cancel},[a,r,e])}function E({hasMore:e,onLoadMore:t,loadingMore:n}){let r=(0,c.useRef)(!1),a=(0,c.useRef)(null),o=i.t(()=>{r.current=!0,t?.(),a.current&&clearTimeout(a.current),a.current=setTimeout(()=>{r.current=!1,a.current=null},b)},y);return(0,c.useEffect)(()=>()=>{a.current&&clearTimeout(a.current)},[]),{handleScroll:(0,c.useCallback)(i=>{if(!e||!t||n||r.current)return;let{scrollHeight:a,scrollTop:s,clientHeight:c}=i.target;(s+c)/a>=v&&o()},[e,n,t,o])}}function D({items:t,searchValue:n,getItemLabel:r,getItemKey:i,loading:a=!1,showListContent:o=!0,minSearchLength:u=3,strings:f,renderItem:p,onSearch:h,debounceMs:_=300,creatable:v,onCreate:y,getItemGroup:b,hasMore:x,onLoadMore:D,loadingMore:O,highlightMatch:k,ensuredItems:A=[]}){let j={...m,...f},{formatCreate:M}=j,N=i??r,P=(0,c.useRef)(null),F=n.trim(),I=o&&(a||F.length<u);T({searchValue:n,onSearch:h,debounceMs:_,minSearchLength:u});let{handleScroll:L}=E({hasMore:o&&!I?x:!1,onLoadMore:D,loadingMore:O});(0,c.useEffect)(()=>{let e=P.current;if(!(!o||I||!e||!x||!D))return e.addEventListener(`scroll`,L),()=>e.removeEventListener(`scroll`,L)},[L,x,D,o,I]);let R=(0,c.useMemo)(()=>{if(!o||I)return[];if(A.length===0)return t;let e=[...A];for(let n of t)A.some(e=>N(e)===N(n))||e.push(n);return e},[A,N,t,o,I]),z=(0,c.useMemo)(()=>{if(!b)return null;let e=new Map;for(let t of R){let n=b(t),r=e.get(n);r?r.push(t):e.set(n,[t])}return e},[R,b]),B=(0,c.useMemo)(()=>{if(!o||I||!v||!y||F.length<u)return!1;let e=F.toLowerCase();return!R.some(t=>r(t).toLowerCase()===e)},[R,v,r,u,y,o,I,F]),V=(0,c.useMemo)(()=>B?w(F):null,[B,F]);return{strings:j,getKey:N,trimmedSearch:F,listRef:P,baseItems:R,allItems:(0,c.useMemo)(()=>V?[...R,V]:R,[R,V]),groupedItems:z,createOptionItem:V,showStatus:I,showEmpty:o&&!a&&F.length>=u&&t.length===0&&!B,showCreateOption:B,renderItemContent:(0,c.useCallback)(t=>{if(S(t))return(0,l.jsxs)(`span`,{className:d.createRow,children:[(0,l.jsx)(s.PlusIcon,{"aria-hidden":!0}),(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,weight:`medium`,lineHeight:`tight`,children:M(C(t))})]});if(p)return p(t);let n=r(t);return k&&F?(0,l.jsx)(g,{text:n,highlight:F}):(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,weight:`medium`,lineHeight:`tight`,children:n})},[M,r,k,p,F]),itemToStringLabel:(0,c.useCallback)(e=>S(e)?C(e):r(e),[r]),getItemReactKey:(0,c.useCallback)(e=>S(e)?`__create__:${C(e)}`:String(N(e)),[N]),handleScroll:L}}function O({error:t}){return t?(0,l.jsx)(e.o,{tag:`p`,size:`xs`,type:`error`,role:`alert`,"aria-live":`polite`,className:d.error,children:t}):null}function k({id:e,items:t,selectedValue:n,onSelectedValueChange:r,clearSearchOnClose:i=!0,searchValue:o,onSearchValueChange:s,getItemLabel:f,getItemKey:m,loading:h=!1,showListContent:g=!0,minSearchLength:_=3,strings:v,disabled:y=!1,className:b,clearable:x=!0,renderItem:w,portalContainer:T,name:E,invalid:k,error:A,required:j,onBlur:M,onSearch:N,debounceMs:P,creatable:F,onCreate:I,getItemGroup:L,renderGroupLabel:R,hasMore:z,onLoadMore:B,loadingMore:V,getItemDisabled:H,highlightMatch:U,open:W,onOpenChange:G}){let K=D({items:t,searchValue:o,onSearchValueChange:s,getItemLabel:f,getItemKey:m,loading:h,showListContent:g,minSearchLength:_,strings:v,renderItem:w,onSearch:N,debounceMs:P,creatable:F,onCreate:I,getItemGroup:L,hasMore:z,onLoadMore:B,loadingMore:V,highlightMatch:U,ensuredItems:n?[n]:[]}),[q,J]=(0,c.useState)(!1),Y=(0,c.useCallback)(e=>{J(e),!e&&i&&s(``),G?.(e)},[i,G,s]),ee=q?o:n?K.itemToStringLabel(n):``,X=(0,c.useCallback)(e=>{if(e&&S(e)){I?.(C(e));return}r(e)},[I,r]);return(0,l.jsxs)(`div`,{className:(0,u.clsx)(`async-combobox--component`,d.root),children:[(0,l.jsxs)(a.b,{items:K.allItems,value:n,onValueChange:X,inputValue:ee,onInputValueChange:(e,{reason:t})=>{if(t===`item-press`){s(``);return}s(e)},itemToStringLabel:K.itemToStringLabel,disabled:y,filter:null,name:E,required:j,open:W,onOpenChange:Y,children:[(0,l.jsx)(a.p,{id:e,placeholder:K.strings.placeholder,showClear:x,invalid:k||!!A,"aria-required":j,disabled:y,onBlur:M,className:b}),(0,l.jsx)(p,{loading:h,showStatus:K.showStatus,showEmpty:K.showEmpty,trimmedSearch:K.trimmedSearch,minSearchLength:_,items:K.allItems,groupedItems:K.groupedItems,createOptionItem:K.createOptionItem,renderItemContent:K.renderItemContent,getItemReactKey:K.getItemReactKey,getItemDisabled:H,renderGroupLabel:R,loadingMore:g&&!K.showStatus?V:!1,strings:K.strings,portalContainer:T,listRef:K.listRef})]}),(0,l.jsx)(O,{error:A})]})}function A({id:t,items:n,selectedValues:r,onSelectedValuesChange:i,searchValue:o,onSearchValueChange:s,getItemLabel:f,getItemKey:m,loading:h=!1,showListContent:g=!0,minSearchLength:_=3,strings:v,disabled:y=!1,className:b,renderItem:x,portalContainer:w,name:T,invalid:E,error:k,required:A,onBlur:j,onSearch:M,debounceMs:N,creatable:P,onCreate:F,getItemGroup:I,renderGroupLabel:L,hasMore:R,onLoadMore:z,loadingMore:B,getItemDisabled:V,highlightMatch:H,open:U,onOpenChange:W,closeOnSelect:G=!1,applyButton:K=!1,onApply:q,onCancel:J}){let Y=(0,c.useRef)(null),ee=m??f,[X,Z]=(0,c.useState)(r),[te,ne]=(0,c.useState)(!1),re=U!==void 0,ie=re?U:te,[ae,oe]=(0,c.useState)(r);K&&r!==ae&&(oe(r),Z(r));let Q=(0,c.useCallback)(e=>{re||ne(e),W?.(e)},[re,W]),$=D({items:n,searchValue:o,onSearchValueChange:s,getItemLabel:f,getItemKey:m,loading:h,showListContent:g,minSearchLength:_,strings:v,renderItem:x,onSearch:M,debounceMs:N,creatable:P,onCreate:F,getItemGroup:I,hasMore:R,onLoadMore:z,loadingMore:B,highlightMatch:H,ensuredItems:r}),se=(0,c.useCallback)(e=>{let t=[],n=null;for(let r of e)S(r)?n=C(r):t.push(r);n!==null&&F?.(n),(n===null||t.length!==e.length-1)&&(K?Z(t):i(t)),G&&Q(!1)},[K,G,F,i,Q]),ce=(0,c.useCallback)(()=>{K&&i(X),q?.(),Q(!1)},[K,X,q,i,Q]),le=(0,c.useCallback)(()=>{K&&Z(r),J?.(),Q(!1)},[K,J,r,Q]),ue=K?X:r;return(0,l.jsxs)(`div`,{className:(0,u.clsx)(`async-multi-combobox--component`,d.root),children:[(0,l.jsxs)(a.b,{items:$.allItems,multiple:!0,value:ue,onValueChange:se,inputValue:o,onInputValueChange:(e,{reason:t})=>{if(t===`item-press`){s(``);return}s(e)},itemToStringLabel:$.itemToStringLabel,disabled:y,filter:null,name:T,required:A,open:ie,onOpenChange:e=>{!e&&K&&Z(r),Q(e)},children:[(0,l.jsxs)(a.a,{ref:Y,invalid:E||!!k,className:b,children:[ue.map(t=>(0,l.jsx)(a.i,{children:(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,weight:`medium`,lineHeight:`tight`,children:f(t)})},ee(t))),(0,l.jsx)(a.o,{id:t,placeholder:ue.length>0?void 0:$.strings.placeholder,"aria-invalid":E||!!k||void 0,"aria-required":A,onBlur:j})]}),(0,l.jsx)(p,{loading:h,showStatus:$.showStatus,showEmpty:$.showEmpty,trimmedSearch:$.trimmedSearch,minSearchLength:_,items:$.allItems,groupedItems:$.groupedItems,createOptionItem:$.createOptionItem,renderItemContent:$.renderItemContent,getItemReactKey:$.getItemReactKey,getItemDisabled:V,renderGroupLabel:L,loadingMore:g&&!$.showStatus?B:!1,strings:$.strings,portalContainer:w,listRef:$.listRef,anchor:Y,applyFooter:g&&K?{applyLabel:$.strings.apply,cancelLabel:$.strings.cancel,onApply:ce,onCancel:le}:void 0})]}),(0,l.jsx)(O,{error:k})]})}function j(e){return typeof e==`string`||typeof e==`number`}function M({fetcher:n,value:r,defaultValue:a=null,onValueChange:o,onAfterFetch:s,onError:f,getKey:p,getLabel:h,getDescription:g,getMeta:_,renderOption:v,limit:y=10,debounceMs:b=300,preload:x=!0,minSearchLength:S=0,errorMessage:C,renderError:w,strings:T,disabled:E,className:D,...O}){let A={...m,...T},M=r!==void 0,[N,P]=(0,c.useState)(a),F=M?r:N,[I,L]=(0,c.useState)(``),[R,z]=(0,c.useState)([]),[B,V]=(0,c.useState)(!1),[H,U]=(0,c.useState)(null),[W,G]=(0,c.useState)(0),K=(0,c.useRef)(0),q=I.trim(),J=(0,c.useCallback)(e=>{M||P(e),o?.(e)},[M,o]),Y=i.t((e,t)=>{V(!0),U(null);let r=()=>!t.signal?.aborted&&K.current===e;n(t).then(e=>{r()&&(z(e),s?.(e,t))}).catch(e=>{r()&&(z([]),U({error:e,query:t.query}),f?.(e,t))}).finally(()=>{r()&&V(!1)})},b);(0,c.useEffect)(()=>{if(E)return;if(!(q.length>0?q.length>=S:x)){z([]),V(!1),U(null);return}let e=++K.current,t=new AbortController;return Y(e,{query:q,limit:y,signal:t.signal}),()=>{Y.cancel(),t.abort()}},[E,y,S,x,W,Y,q]);let ee=(0,c.useCallback)(()=>{H&&(L(H.query),G(e=>e+1))},[H]),X=(0,c.useCallback)(t=>{if(v)return v(t,{query:q,isSelected:F?p(F)===p(t):!1});let n=g?.(t),r=_?.(t);return(0,l.jsxs)(`span`,{className:d.option,children:[(0,l.jsx)(e.o,{tag:`span`,size:`inherit`,type:`inherit`,weight:`medium`,lineHeight:`tight`,truncate:!0,className:d.optionLabel,children:h(t)}),(!!n||!!r)&&(0,l.jsxs)(`span`,{className:d.optionMeta,children:[!!n&&(j(n)?(0,l.jsx)(e.o,{tag:`span`,size:`xs`,type:`secondary`,truncate:!0,children:n}):n),!!r&&(j(r)?(0,l.jsx)(e.o,{tag:`span`,size:`xs`,type:`secondary`,truncate:!0,className:d.optionQuiet,children:r}):r)]})]})},[g,p,h,_,v,F,q]),Z=(0,c.useMemo)(()=>H?C??A.errorTitle:void 0,[A.errorTitle,C,H]),te=H?w?.({error:H.error,query:H.query,retry:ee})??(0,l.jsx)(t.t,{title:Z,onRetry:ee,strings:{retry:A.retry},className:d.errorState}):null;return(0,l.jsxs)(`div`,{"data-slot":`resource-combobox`,className:(0,u.clsx)(`resource-combobox--component`,D),children:[(0,l.jsx)(k,{...O,disabled:E,items:R,selectedValue:F??null,onSelectedValueChange:J,clearSearchOnClose:!1,searchValue:I,onSearchValueChange:L,getItemLabel:h,getItemKey:p,loading:!H&&B,showListContent:!H,minSearchLength:S,debounceMs:b,strings:T,renderItem:X}),te]})}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return D}}),Object.defineProperty(exports,"c",{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return k}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return A}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return M}});