@box-kite/react 2.2.6 → 2.2.8

package/components/combobox.mjs

@@ -3,14 +3,15 @@ import { n as e } from "../effects.mjs";
 import t from "../box.mjs";
 import { a as n, i as r, r as i, t as a } from "../behavior.mjs";
 import { t as o } from "../identity.mjs";
-import { Path as s, Svg as c } from "./svg.mjs";
-import l from "./flex.mjs";
-import u from "./overlay.mjs";
-import d from "./presence.mjs";
-import { forwardRef as f, useCallback as p, useMemo as m, useRef as h, useState as g } from "react";
-import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { a as s } from "../reporting.mjs";
+import { Path as c, Svg as l } from "./svg.mjs";
+import u from "./flex.mjs";
+import d from "./overlay.mjs";
+import f from "./presence.mjs";
+import { forwardRef as p, useCallback as m, useMemo as h, useRef as g, useState as _ } from "react";
+import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
 //#region src/utils/combobox/comboboxUtils.ts
-var b;
+var x;
 (function(e) {
 	function t(e, t) {
 		return typeof e == "function" ? e(t) : t[e];
@@ -77,23 +78,23 @@ var b;
 		return (i === "last" ? s[s.length - 1] : s[0]) ?? -1;
 	}
 	e.activeIndexFor = m;
-})(b ||= {});
-var x = b;
+})(x ||= {});
+var S = x;
 //#endregion
 //#region src/components/combobox/comboboxChips.tsx
-function S(e) {
-	let { selection: t, def: n, display: r, removeLabel: i, onRemove: a, disabled: o, variant: u } = e;
-	return /* @__PURE__ */ v(_, { children: t.map((e) => {
-		let t = x.labelOf(n, e);
-		return /* @__PURE__ */ y(l, {
+function C(e) {
+	let { selection: t, def: n, display: r, removeLabel: i, onRemove: a, disabled: o, variant: s } = e;
+	return /* @__PURE__ */ y(v, { children: t.map((e) => {
+		let t = S.labelOf(n, e);
+		return /* @__PURE__ */ b(u, {
 			component: "combobox.chip",
-			variant: u,
+			variant: s,
 			ai: "center",
 			gap: 1,
-			children: [r?.(e) ?? t, !o && /* @__PURE__ */ v(l, {
+			children: [r?.(e) ?? t, !o && /* @__PURE__ */ y(u, {
 				tag: "button",
 				component: "combobox.remove",
-				variant: u,
+				variant: s,
 				ai: "center",
 				jc: "center",
 				props: {
@@ -105,11 +106,11 @@ function S(e) {
 						t.stopPropagation(), a(e, t);
 					}
 				},
-				children: /* @__PURE__ */ v(c, {
+				children: /* @__PURE__ */ y(l, {
 					viewBox: "0 0 24 24",
 					width: "0.625rem",
 					props: { fill: "none" },
-					children: /* @__PURE__ */ v(s, {
+					children: /* @__PURE__ */ y(c, {
 						d: "M6 6 18 18M18 6 6 18",
 						stroke: "currentColor",
 						strokeWidth: 3,
@@ -117,12 +118,12 @@ function S(e) {
 					})
 				})
 			})]
-		}, x.keyOf(n, e));
+		}, S.keyOf(n, e));
 	}) });
 }
 //#endregion
 //#region src/utils/virtual/virtualUtils.ts
-var C;
+var w;
 (function(e) {
 	let t = e.DEFAULT_OVERSCAN = 4, n = e.DEFAULT_THRESHOLD = 100;
 	e.DEFAULT_ITEM_HEIGHT = 36, e.DEFAULT_VIEW_HEIGHT = 248;
@@ -150,24 +151,24 @@ var C;
 		};
 	}
 	e.windowFor = a;
-})(C ||= {});
-var w = C;
+})(w ||= {});
+var T = w;
 //#endregion
 //#region src/react/hooks/useVirtualization.ts
 function ee(t) {
-	let { count: r, scrollerRef: i, itemHeight: a, viewHeight: o, overscan: s, threshold: c, enabled: l, activeIndex: u } = t, [d, f] = g({
+	let { count: r, scrollerRef: i, itemHeight: a, viewHeight: o, overscan: s, threshold: c, enabled: l, activeIndex: u } = t, [d, f] = _({
 		top: 0,
 		at: -1
-	}), [m, _] = g({
+	}), [p, h] = _({
 		itemHeight: 0,
 		viewHeight: 0
-	}), v = h(null), y = p((e) => {
+	}), v = g(null), y = m((e) => {
 		v.current = e;
-	}, []), b = w.shouldVirtualize(r, l, c), x = n(() => {
+	}, []), b = T.shouldVirtualize(r, l, c), x = n(() => {
 		let e = i.current, t = v.current;
 		if (!e || !t) return;
 		let n = t.children, r = n[0], a = n[1], o = a ? a.offsetTop - r.offsetTop : r?.offsetHeight ?? 0, s = e.clientHeight;
-		_((e) => e.itemHeight === o && e.viewHeight === s ? e : {
+		h((e) => e.itemHeight === o && e.viewHeight === s ? e : {
 			itemHeight: o,
 			viewHeight: s
 		});
@@ -189,10 +190,10 @@ function ee(t) {
 			top: e.currentTarget.scrollTop,
 			at: u ?? -1
 		});
-	}), C = w.windowFor({
+	}), C = T.windowFor({
 		count: r,
-		itemHeight: a ?? (m.itemHeight > 0 ? m.itemHeight : w.DEFAULT_ITEM_HEIGHT),
-		viewHeight: o ?? (m.viewHeight > 0 ? m.viewHeight : w.DEFAULT_VIEW_HEIGHT),
+		itemHeight: a ?? (p.itemHeight > 0 ? p.itemHeight : T.DEFAULT_ITEM_HEIGHT),
+		viewHeight: o ?? (p.viewHeight > 0 ? p.viewHeight : T.DEFAULT_VIEW_HEIGHT),
 		scrollTop: d.top,
 		overscan: s,
 		activeIndex: u === d.at ? -1 : u
@@ -223,17 +224,17 @@ function te(e, t, n, r) {
 	} : { role: "status" };
 }
 function ne(e) {
-	let { presence: n, rows: r, def: i, display: a, selection: o, multiple: s, activeIndex: c, optionId: d, rowRef: f, onSelect: m } = e, { anchorRef: _, popupRef: b, listboxId: S, labelledBy: C, loading: w, loadingText: ne, emptyText: re, createLabel: T, variant: E, itemsProps: D } = e, { virtualize: O } = e, { present: ie, ref: k, props: A } = n, ae = (e) => x.keyOf(i, e), [j, M] = g(!1), oe = p((e) => M(e === "top"), []), se = h(null), ce = p((e) => {
-		se.current = e, k(e);
-	}, [k]), le = typeof O == "object" ? O : {}, { virtualized: N, startIndex: ue, endIndex: de, offsetY: fe, totalHeight: pe, contentRef: P, onScroll: F } = ee({
+	let { presence: n, rows: r, def: i, display: a, selection: o, multiple: s, activeIndex: c, optionId: l, rowRef: f, onSelect: p } = e, { anchorRef: h, popupRef: v, listboxId: x, labelledBy: C, loading: w, loadingText: T, emptyText: ne, createLabel: re, variant: E, itemsProps: D } = e, { virtualize: O } = e, { present: ie, ref: ae, props: k } = n, A = (e) => S.keyOf(i, e), [oe, j] = _(!1), M = m((e) => j(e === "top"), []), N = g(null), se = m((e) => {
+		N.current = e, ae(e);
+	}, [ae]), ce = typeof O == "object" ? O : {}, { virtualized: P, startIndex: le, endIndex: ue, offsetY: de, totalHeight: fe, contentRef: pe, onScroll: F } = ee({
 		count: r.length,
-		scrollerRef: se,
+		scrollerRef: N,
 		enabled: typeof O == "boolean" ? O : void 0,
 		activeIndex: c,
-		...le
-	}), I = N ? r.slice(ue, de) : r, L = (e, t) => {
-		let n = N ? ue + t : t, s = e.kind === "option" && x.isSelected(o, e.row, ae), u = x.isRowDisabled(i, e);
-		return /* @__PURE__ */ v(l, {
+		...ce
+	}), I = P ? r.slice(le, ue) : r, L = (e, t) => {
+		let n = P ? le + t : t, s = e.kind === "option" && S.isSelected(o, e.row, A), d = S.isRowDisabled(i, e);
+		return /* @__PURE__ */ y(u, {
 			ref: f(n),
 			component: "combobox.item",
 			variant: [E, {
@@ -243,55 +244,55 @@ function ne(e) {
 			selected: s,
 			ai: "center",
 			gap: 2,
-			id: d(n),
+			id: l(n),
 			props: {
 				role: "option",
-				...N ? {
+				...P ? {
 					"aria-setsize": r.length,
 					"aria-posinset": n + 1
 				} : {},
-				...u ? { "aria-disabled": !0 } : {},
+				...d ? { "aria-disabled": !0 } : {},
 				onMouseDown: (e) => e.preventDefault(),
-				onClick: (e) => !u && m(n, e)
+				onClick: (e) => !d && p(n, e)
 			},
-			children: e.kind === "create" ? T(e.query) : a?.(e.row) ?? x.labelOf(i, e.row)
-		}, e.kind === "option" ? ae(e.row) : "create");
+			children: e.kind === "create" ? re(e.query) : a?.(e.row) ?? S.labelOf(i, e.row)
+		}, e.kind === "option" ? A(e.row) : "create");
 	};
-	return /* @__PURE__ */ v(u, {
-		ref: b,
-		anchor: _,
+	return /* @__PURE__ */ y(d, {
+		ref: v,
+		anchor: h,
 		side: "bottom",
 		align: "start",
 		offset: .5,
 		matchWidth: !0,
-		onSideChange: oe,
-		children: /* @__PURE__ */ y(t, {
-			ref: ce,
+		onSideChange: M,
+		children: /* @__PURE__ */ b(t, {
+			ref: se,
 			component: "combobox.items",
 			...D,
 			variant: [E, {
-				closed: !ie && !j,
-				closedUp: !ie && j
+				closed: !ie && !oe,
+				closedUp: !ie && oe
 			}],
-			id: S,
+			id: x,
 			props: {
 				...te(r.length > 0, s, w === !0, C),
-				...A,
-				...N ? { onScroll: F } : {}
+				...k,
+				...P ? { onScroll: F } : {}
 			},
-			children: [N ? /* @__PURE__ */ v(t, {
-				ref: P,
+			children: [P ? /* @__PURE__ */ y(t, {
+				ref: pe,
 				component: "combobox.window",
 				variant: E,
 				style: {
-					height: pe,
-					paddingTop: fe
+					height: fe,
+					paddingTop: de
 				},
 				children: I.map(L)
-			}) : I.map(L), r.length === 0 && /* @__PURE__ */ v(t, {
+			}) : I.map(L), r.length === 0 && /* @__PURE__ */ y(t, {
 				component: "combobox.message",
 				variant: E,
-				children: w ? ne : re
+				children: w ? T : ne
 			})]
 		})
 	});
@@ -305,91 +306,100 @@ var re = /* @__PURE__ */ new Set([
 	"ArrowLeft",
 	"ArrowRight"
 ]);
-function T(u, f) {
-	let { data: b, def: C, label: w, labelProps: ee, placeholder: te, name: T, disabled: E, props: D, itemsProps: O, hideIcon: ie, filter: k = x.filterRows, loading: A, loadingText: ae = "Loading...", emptyText: j = "No results", createRow: M, createLabel: oe = (e) => `Create "${e}"`, removeLabel: se = (e) => `Remove ${e}`, virtualize: ce, query: le, defaultQuery: N, onQueryChange: ue, open: de, defaultOpen: fe, onOpenChange: pe, multiple: P = !1, value: F, defaultValue: I, onValueChange: L, ...R } = u, z = o("combobox"), B = R.id ?? `${z}-field`, me = `${z}-listbox`, V = `${z}-label`, H = w != null && w !== !1, he = p((e) => `${z}-option-${e}`, [z]), ge = h(null), _e = h(null), ve = h(null), ye = p((e) => {
-		ve.current = e, typeof f == "function" ? f(e) : f && (f.current = e);
-	}, [f]), be = n((e, t) => {
-		L?.(P ? e : e[0] ?? null, t);
-	}), xe = m(() => F === void 0 ? void 0 : x.toArray(F), [F]), [U, Se] = r({
-		value: xe,
-		defaultValue: () => x.toArray(I),
-		onChange: be
-	}), [W, G] = r({
+function E(d, p) {
+	let { data: x, def: w, label: T, labelProps: ee, placeholder: te, name: E, disabled: D, props: O, itemsProps: ie, hideIcon: ae, filter: k = S.filterRows, loading: A, loadingText: oe = "Loading...", emptyText: j = "No results", createRow: M, createLabel: N = (e) => `Create "${e}"`, removeLabel: se = (e) => `Remove ${e}`, virtualize: ce, query: P, defaultQuery: le, onQueryChange: ue, open: de, defaultOpen: fe, onOpenChange: pe, multiple: F = !1, value: I, defaultValue: L, onValueChange: me, ...R } = d, z = o("combobox"), he = R.id ?? `${z}-field`, ge = `${z}-listbox`, _e = `${z}-label`, B = T != null && T !== !1, ve = m((e) => `${z}-option-${e}`, [z]), V = g(null), ye = g(null), H = g(null), be = m((e) => {
+		H.current = e, typeof p == "function" ? p(e) : p && (p.current = e);
+	}, [p]), xe = n((e, t) => {
+		me?.(F ? e : e[0] ?? null, t);
+	}), Se = h(() => I === void 0 ? void 0 : S.toArray(I), [I]), [U, Ce] = s({
+		value: Se,
+		defaultValue: () => S.toArray(L),
+		onChange: xe,
+		interaction: {
+			component: "combobox",
+			type: "valueChange",
+			content: ["value"]
+		}
+	}), [W, G] = s({
 		value: de,
 		defaultValue: fe ?? !1,
-		onChange: pe
-	}), [Ce, K] = r({
-		value: le,
-		defaultValue: N ?? "",
+		onChange: pe,
+		interaction: {
+			component: "combobox",
+			type: "openChange"
+		}
+	}), [we, K] = r({
+		value: P,
+		defaultValue: le ?? "",
 		onChange: ue
-	}), [we, q] = g(!1), J = p((e) => x.keyOf(C, e), [C]), Te = P || U[0] === void 0 ? "" : x.labelOf(C, U[0]), Y = we || Ce !== "" ? Ce : Te, X = m(() => x.rowsFor({
-		data: b,
-		def: C,
-		query: Y,
+	}), [q, J] = _(!1), Y = m((e) => S.keyOf(w, e), [w]), Te = F || U[0] === void 0 ? "" : S.labelOf(w, U[0]), X = q || we !== "" ? we : Te, Z = h(() => S.rowsFor({
+		data: x,
+		def: w,
+		query: X,
 		filter: k,
-		typed: we,
+		typed: q,
 		createRow: M
 	}), [
-		b,
-		C,
-		Y,
+		x,
+		w,
+		X,
 		k,
-		we,
+		q,
 		M
-	]), Ee = p((e) => X[e] ? x.isRowDisabled(C, X[e]) : !1, [X, C]), De = n((e, t) => {
+	]), Ee = m((e) => Z[e] ? S.isRowDisabled(w, Z[e]) : !1, [Z, w]), De = n((e, t) => {
 		G(!1, {
 			reason: e,
 			event: t
-		}), e !== "escape" && (q(!1), K("", {
+		}), e !== "escape" && (J(!1), K("", {
 			reason: "close",
 			event: t
 		}));
-	}), Z = n((e, t) => {
-		let n = X[e];
+	}), Q = n((e, t) => {
+		let n = Z[e];
 		if (!n || Ee(e)) return;
 		let r = n.kind === "create" ? M?.(n.query) : n.row;
 		if (r == null) return;
-		let i = x.isSelected(U, r, J), a = n.kind === "create" ? "create" : i && P ? "deselect" : "select";
-		Se(x.toggle(U, r, P, J), {
+		let i = S.isSelected(U, r, Y), a = n.kind === "create" ? "create" : i && F ? "deselect" : "select";
+		Ce(S.toggle(U, r, F, Y), {
 			reason: a,
 			event: t
-		}), q(!1), K("", {
+		}), J(!1), K("", {
 			reason: "select",
 			event: t
-		}), P || G(!1, {
+		}), F || G(!1, {
 			reason: "select",
 			event: t
 		});
 	}), Oe = a({
-		count: X.length,
+		count: Z.length,
 		focusItems: !1,
 		defaultActiveIndex: -1,
 		isDisabled: Ee,
-		onSelect: Z
-	}), { activeIndex: Q, setActiveIndex: ke, activeItem: Ae } = Oe;
+		onSelect: Q
+	}), { activeIndex: $, setActiveIndex: ke, activeItem: Ae } = Oe;
 	i({
 		enabled: W,
-		inside: [ge, _e],
+		inside: [V, ye],
 		onDismiss: (e, t) => De(e === "escape" ? "escape" : "outside-pointer", t)
 	}), e(() => {
-		!W || Q === -1 || Ae()?.scrollIntoView?.({ block: "nearest" });
+		!W || $ === -1 || Ae()?.scrollIntoView?.({ block: "nearest" });
 	}, [
 		W,
-		Q,
+		$,
 		Ae
 	]);
-	let $ = (e, t, n) => {
+	let je = (e, t, n) => {
 		G(!0, {
 			reason: n,
 			event: t
 		});
-		let r = e === "none" ? -1 : x.activeIndexFor(X, U, C, e);
+		let r = e === "none" ? -1 : S.activeIndexFor(Z, U, w, e);
 		ke(r, {
 			reason: "programmatic",
 			event: t
 		});
-	}, je = n((e) => {
-		q(!0), K(e.target.value, {
+	}, Me = n((e) => {
+		J(!0), K(e.target.value, {
 			reason: "input",
 			event: e
 		}), W || G(!0, {
@@ -399,37 +409,37 @@ function T(u, f) {
 			reason: "programmatic",
 			event: e
 		});
-	}), Me = n((e, t) => {
-		Se(U.filter((t) => J(t) !== J(e)), {
+	}), Ne = n((e, t) => {
+		Ce(U.filter((t) => Y(t) !== Y(e)), {
 			reason: "remove",
 			event: t
 		});
-	}), Ne = (e) => {
+	}), Pe = (e) => {
 		let { key: t } = e;
 		if (t === "ArrowDown" || t === "ArrowUp") {
-			e.preventDefault(), $(t === "ArrowUp" ? "last" : e.altKey ? "none" : "first", e, "trigger");
+			e.preventDefault(), je(t === "ArrowUp" ? "last" : e.altKey ? "none" : "first", e, "trigger");
 			return;
 		}
-		t === "Escape" && Y !== "" && (q(!0), K("", {
+		t === "Escape" && X !== "" && (J(!0), K("", {
 			reason: "clear",
 			event: e
 		}));
-	}, Pe = n((e) => {
-		if (D?.onKeyDown?.(e), !(e.defaultPrevented || E)) {
-			if (e.key === "Backspace" && P && Y === "" && U.length > 0) {
-				Me(U[U.length - 1], e);
+	}, Fe = n((e) => {
+		if (O?.onKeyDown?.(e), !(e.defaultPrevented || D)) {
+			if (e.key === "Backspace" && F && X === "" && U.length > 0) {
+				Ne(U[U.length - 1], e);
 				return;
 			}
 			if (!W) {
-				Ne(e);
+				Pe(e);
 				return;
 			}
 			if (e.key === "Tab") {
-				Q !== -1 && Z(Q, e), De("tab", e);
+				$ !== -1 && Q($, e), De("tab", e);
 				return;
 			}
 			if (e.altKey && e.key === "ArrowUp") {
-				e.preventDefault(), Q === -1 ? De("trigger", e) : Z(Q, e);
+				e.preventDefault(), $ === -1 ? De("trigger", e) : Q($, e);
 				return;
 			}
 			if (re.has(e.key)) {
@@ -441,42 +451,42 @@ function T(u, f) {
 			}
 			Oe.onKeyDown(e);
 		}
-	}), Fe = n((e) => {
-		!E && !W && $("first", e, "trigger");
 	}), Ie = n((e) => {
-		E || e.target === ve.current || (e.preventDefault(), ve.current?.focus(), W || $("first", e, "trigger"));
-	}), Le = X.length > 0 || A === !0 || j !== null, Re = W && Q !== -1 && X.length > 0 ? he(Q) : void 0, ze = /* @__PURE__ */ v(t, {
+		!D && !W && je("first", e, "trigger");
+	}), Le = n((e) => {
+		D || e.target === H.current || (e.preventDefault(), H.current?.focus(), W || je("first", e, "trigger"));
+	}), Re = Z.length > 0 || A === !0 || j !== null, ze = W && $ !== -1 && Z.length > 0 ? ve($) : void 0, Be = /* @__PURE__ */ y(t, {
 		tag: "input",
 		component: "combobox.field",
-		ref: ye,
-		id: B,
-		disabled: E,
+		ref: be,
+		id: he,
+		disabled: D,
 		props: {
-			...D,
+			...O,
 			role: "combobox",
 			"aria-autocomplete": "list",
 			"aria-expanded": W,
-			"aria-controls": W && Le ? me : void 0,
-			"aria-activedescendant": Re,
-			"aria-labelledby": H ? V : D?.["aria-labelledby"],
+			"aria-controls": W && Re ? ge : void 0,
+			"aria-activedescendant": ze,
+			"aria-labelledby": B ? _e : O?.["aria-labelledby"],
 			autoComplete: "off",
 			spellCheck: !1,
 			type: "text",
-			value: Y,
+			value: X,
 			placeholder: te,
-			onChange: je,
-			onKeyDown: Pe,
-			onClick: Fe
+			onChange: Me,
+			onKeyDown: Fe,
+			onClick: Ie
 		}
-	}), Be = !ie && /* @__PURE__ */ v(l, {
+	}), Ve = !ae && /* @__PURE__ */ y(u, {
 		component: "combobox.icon",
 		rotate: W ? 180 : 0,
 		props: { "aria-hidden": !0 },
-		children: /* @__PURE__ */ v(c, {
+		children: /* @__PURE__ */ y(l, {
 			viewBox: "0 0 10 6",
 			width: "0.6rem",
 			props: { fill: "none" },
-			children: /* @__PURE__ */ v(s, {
+			children: /* @__PURE__ */ y(c, {
 				d: "m1 1 4 4 4-4",
 				stroke: "currentColor",
 				strokeWidth: 2,
@@ -484,80 +494,80 @@ function T(u, f) {
 				strokeLinejoin: "round"
 			})
 		})
-	}), Ve = T === void 0 ? null : U.map((e) => /* @__PURE__ */ v(t, {
+	}), He = E === void 0 ? null : U.map((e) => /* @__PURE__ */ y(t, {
 		tag: "input",
 		props: {
 			type: "hidden",
-			name: T,
-			value: String(J(e))
+			name: E,
+			value: String(Y(e))
 		}
-	}, J(e))), He = Le && /* @__PURE__ */ v(d, {
+	}, Y(e))), Ue = Re && /* @__PURE__ */ y(f, {
 		present: W,
-		children: (e) => /* @__PURE__ */ v(ne, {
+		children: (e) => /* @__PURE__ */ y(ne, {
 			presence: e,
-			rows: X,
-			def: C,
-			display: C.display,
+			rows: Z,
+			def: w,
+			display: w.display,
 			selection: U,
-			multiple: P,
-			activeIndex: Q,
-			optionId: he,
+			multiple: F,
+			activeIndex: $,
+			optionId: ve,
 			rowRef: (e) => Oe.itemProps(e).ref,
-			onSelect: Z,
-			anchorRef: ge,
-			popupRef: _e,
-			listboxId: me,
-			labelledBy: H ? V : B,
+			onSelect: Q,
+			anchorRef: V,
+			popupRef: ye,
+			listboxId: ge,
+			labelledBy: B ? _e : he,
 			loading: A,
-			loadingText: ae,
+			loadingText: oe,
 			emptyText: j,
-			createLabel: oe,
+			createLabel: N,
 			virtualize: ce,
 			variant: R.variant,
-			itemsProps: O
+			itemsProps: ie
 		})
-	}), Ue = /* @__PURE__ */ y(l, {
-		ref: ge,
+	}), We = /* @__PURE__ */ b(u, {
+		ref: V,
 		component: "combobox",
 		ai: "center",
 		gap: 1,
 		flexWrap: "wrap",
 		...R,
-		props: { onPointerDown: Ie },
+		props: { onPointerDown: Le },
 		children: [
-			Ve,
-			P && /* @__PURE__ */ v(S, {
+			He,
+			F && /* @__PURE__ */ y(C, {
 				selection: U,
-				def: C,
-				display: C.display,
+				def: w,
+				display: w.display,
 				removeLabel: se,
-				onRemove: Me,
-				disabled: E,
+				onRemove: Ne,
+				disabled: D,
 				variant: R.variant
 			}),
-			ze,
-			Be
+			Be,
+			Ve
 		]
 	});
-	return H ? /* @__PURE__ */ y(l, {
+	return B ? /* @__PURE__ */ b(u, {
 		d: "column",
 		gap: 1,
 		width: "fit-content",
 		children: [
-			/* @__PURE__ */ v(t, {
+			/* @__PURE__ */ y(t, {
 				tag: "label",
 				component: "combobox.label",
-				id: V,
+				id: _e,
 				...ee,
-				props: { htmlFor: B },
-				children: w
+				props: { htmlFor: he },
+				children: T
 			}),
-			Ue,
-			He
+			We,
+			Ue
 		]
-	}) : /* @__PURE__ */ y(_, { children: [Ue, He] });
+	}) : /* @__PURE__ */ b(v, { children: [We, Ue] });
 }
-var E = f(T);
-E.displayName = "Combobox";
+var D = p(E);
+D.displayName = "Combobox";
 //#endregion
-export { x as ComboboxUtils, E as default };
+export { S as ComboboxUtils, D as default };