@slotted/react 0.0.0-stage → 0.1.0-beta.1

package/dist/combobox-C46GRqAA.js

@@ -0,0 +1,852 @@
+import { t as e } from "./react-dom-DzrKNxo6.js";
+import { n as t, t as n } from "./icon-T9Yt4tnm.js";
+import { n as r, r as i } from "./i18n-DpW8lqJ1.js";
+import { b as a } from "./field-BJh5HI7w.js";
+import { t as o } from "./highlight-0Qw23QPp.js";
+import { createControllable as s } from "@slotted/core/state";
+import { createContext as c, useCallback as l, useContext as u, useEffect as d, useId as f, useImperativeHandle as p, useLayoutEffect 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";
+import { createPresence as x } from "@slotted/core/presence";
+import { createPortalRoot as S, setPortalContainer as C } from "@slotted/core/portal";
+import { createDismissableLayer as w, pressOrigin as T } from "@slotted/core/dismissable-layer";
+import { createPositioner as ee } from "@slotted/core/positioner";
+import { comboboxMessages as E } from "@slotted/core/i18n";
+import { createFilter as te, moveIndex as D } from "@slotted/core/collection";
+import { matchRanges as O } from "@slotted/core/highlight";
+//#region src/combobox/combobox-defaults.tsx
+var k = {
+	align: "start",
+	alignOffset: 0,
+	allowsCustomValue: !1,
+	autocomplete: "list",
+	autoHighlight: !1,
+	clearable: !0,
+	closeOnEscape: !0,
+	closeOnOutsidePress: !0,
+	closeOnSelect: !0,
+	collisionPadding: 8,
+	disabled: !1,
+	flip: !0,
+	fullWidth: !0,
+	hideWhenDetached: !0,
+	highlightMatch: !0,
+	invalid: !1,
+	loading: !1,
+	loop: !1,
+	mount: "active",
+	openOn: "input",
+	portal: !0,
+	readOnly: !1,
+	required: !1,
+	shift: !0,
+	side: "bottom",
+	sideOffset: 4,
+	size: "md",
+	strategy: "absolute",
+	variant: "outline",
+	width: "content"
+}, A = c(k);
+function j() {
+	return u(A);
+}
+function ne({ children: e, container: t, ...n }) {
+	let r = j();
+	d(() => {
+		if (t !== void 0) return C(t), () => C(null);
+	}, [t]);
+	let i = {
+		align: n.align ?? r.align,
+		alignOffset: n.alignOffset ?? r.alignOffset,
+		allowsCustomValue: n.allowsCustomValue ?? r.allowsCustomValue,
+		autocomplete: n.autocomplete ?? r.autocomplete,
+		autoHighlight: n.autoHighlight ?? r.autoHighlight,
+		clearable: n.clearable ?? r.clearable,
+		closeOnEscape: n.closeOnEscape ?? r.closeOnEscape,
+		closeOnOutsidePress: n.closeOnOutsidePress ?? r.closeOnOutsidePress,
+		closeOnSelect: n.closeOnSelect ?? r.closeOnSelect,
+		collisionPadding: n.collisionPadding ?? r.collisionPadding,
+		disabled: n.disabled ?? r.disabled,
+		flip: n.flip ?? r.flip,
+		fullWidth: n.fullWidth ?? r.fullWidth,
+		hideWhenDetached: n.hideWhenDetached ?? r.hideWhenDetached,
+		highlightMatch: n.highlightMatch ?? r.highlightMatch,
+		invalid: n.invalid ?? r.invalid,
+		loading: n.loading ?? r.loading,
+		loop: n.loop ?? r.loop,
+		mount: n.mount ?? r.mount,
+		openOn: n.openOn ?? r.openOn,
+		portal: n.portal ?? r.portal,
+		readOnly: n.readOnly ?? r.readOnly,
+		required: n.required ?? r.required,
+		shift: n.shift ?? r.shift,
+		side: n.side ?? r.side,
+		sideOffset: n.sideOffset ?? r.sideOffset,
+		size: n.size ?? r.size,
+		strategy: n.strategy ?? r.strategy,
+		variant: n.variant ?? r.variant,
+		width: n.width ?? r.width
+	};
+	return /* @__PURE__ */ y(A.Provider, {
+		value: i,
+		children: e
+	});
+}
+//#endregion
+//#region src/combobox/combobox.tsx
+var re = c(void 0);
+function M() {
+	let e = u(re);
+	if (e === void 0) throw Error("ComboboxInput, ComboboxContent and every option have to be inside a Combobox.");
+	return e;
+}
+var N = (e) => "options" in e;
+function ie(e) {
+	return e === void 0 ? [] : e.flatMap((e) => N(e) ? e.options : [e]);
+}
+function ae({ align: e, alignOffset: t, allowsCustomValue: n, autocomplete: o, autoHighlight: c, children: u, clearable: d, closeOnEscape: m, closeOnOutsidePress: v, closeOnSelect: b, collisionPadding: x, onCreate: S, defaultHighlightedValue: C = null, defaultInputValue: w = "", defaultOpen: T = !1, defaultValue: ee = null, disabled: D, filter: O, flip: k, form: A, fullWidth: ne, hideWhenDetached: M, highlightedValue: N, highlightMatch: ae, inputValue: P, invalid: oe, items: F, loading: I, locale: L, loop: R, messages: z, mount: se, name: ce, onHighlightedValueChange: le, onInputValueChange: ue, onInputReset: B, onLoadMore: de, onOpenChange: V, onValueChange: fe, open: H, openOn: pe, portal: me, readOnly: he, ref: ge, required: _e, shift: ve, side: ye, sideOffset: be, size: xe, strategy: Se, total: Ce, value: we, variant: Te, width: Ee }) {
+	let U = j(), W = a(), De = i(E, z), Oe = r(), ke = L ?? Oe, Ae = f(), je = `${Ae}listbox`, Me = `${Ae}input`, [Ne, Pe] = _(T), [Fe, Ie] = _(ee), [Le, Re] = _(w), [ze, Be] = _(C), [Ve, He] = _(null), [Ue, We] = _(null), Ge = D ?? W?.disabled ?? U.disabled, Ke = he ?? W?.readOnly ?? U.readOnly, G = (H ?? Ne) && !Ge, K = we === void 0 ? Fe : we, q = P ?? Le, qe = N === void 0 ? ze : N, Je = g(G);
+	G && (Je.current = !0);
+	let Ye = g("none"), [Xe, Ze] = _(null), Qe = g(!1), $e = g(/* @__PURE__ */ new Map()), [et, tt] = _(0), nt = h(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of ie(F)) e.set(t.value, t.label);
+		return e;
+	}, [F]), rt = l((e, t) => {
+		$e.current.get(e) !== t && ($e.current.set(e, t), tt((e) => e + 1));
+	}, []), it = l((e) => nt.get(e) ?? $e.current.get(e), [nt, et]), at = l((e) => `${Ae}option-${encodeURIComponent(e)}`, [Ae]), J = q === (K === null ? void 0 : it(K)) ? "" : q, Y = h(() => te({ locale: ke }), [ke]), ot = l((e) => J === "" || O === null ? !0 : O === void 0 ? Y.contains(e, J) : O(e, J), [
+		Y,
+		O,
+		J
+	]), X = g({
+		currentHighlighted: qe,
+		currentInput: q,
+		currentOpen: G,
+		currentValue: K,
+		highlightedValue: N,
+		inputNode: Ve,
+		inputValue: P,
+		onHighlightedValueChange: le,
+		onInputValueChange: ue,
+		onCreate: S,
+		onOpenChange: V,
+		onValueChange: fe,
+		open: H,
+		value: we
+	});
+	X.current = {
+		currentHighlighted: qe,
+		currentInput: q,
+		currentOpen: G,
+		currentValue: K,
+		highlightedValue: N,
+		inputNode: Ve,
+		inputValue: P,
+		onHighlightedValueChange: le,
+		onInputValueChange: ue,
+		onCreate: S,
+		onOpenChange: V,
+		onValueChange: fe,
+		open: H,
+		value: we
+	};
+	let Z = l((e, t, n) => {
+		let r = X.current;
+		e !== r.currentOpen && s({
+			controlled: r.open,
+			initial: r.currentOpen,
+			onRequest: (e) => r.onOpenChange?.(e.value, e)
+		}).request(e, t, n) && (Pe(e), e || (Be(null), Ye.current = "none"));
+	}, []), st = l((e, t, n) => {
+		let r = X.current;
+		e !== r.currentHighlighted && s({
+			controlled: r.highlightedValue,
+			initial: r.currentHighlighted,
+			onRequest: (e) => r.onHighlightedValueChange?.(e.value, e)
+		}).request(e, t, n) && Be(e);
+	}, []), ct = l((e) => {
+		if (e !== "") {
+			for (let [t, n] of nt) if (Y.equals(n, e)) return t;
+			for (let [t, n] of $e.current) if (Y.equals(n, e)) return t;
+		}
+	}, [
+		nt,
+		Y,
+		et
+	]), Q = l((e, t, n) => {
+		let r = X.current;
+		Ze(null), e !== r.currentInput && s({
+			controlled: r.inputValue,
+			initial: r.currentInput,
+			onRequest: (e) => r.onInputValueChange?.(e.value, e)
+		}).request(e, t, n) && Re(e);
+	}, []), $ = l((e, t, n) => {
+		let r = X.current;
+		e !== r.currentValue && s({
+			controlled: r.value,
+			initial: r.currentValue,
+			onRequest: (e) => r.onValueChange?.(e.value, e)
+		}).request(e, t, n) && Ie(e);
+	}, []), lt = g({
+		allowsCustomValue: !1,
+		currentInput: q,
+		currentValue: K,
+		labelFor: it,
+		onInputReset: B,
+		select: $,
+		setInputValue: Q,
+		valueForLabel: ct
+	});
+	lt.current = {
+		allowsCustomValue: n ?? U.allowsCustomValue,
+		currentInput: q,
+		currentValue: K,
+		labelFor: it,
+		onInputReset: B,
+		select: $,
+		setInputValue: Q,
+		valueForLabel: ct
+	};
+	let ut = l((e) => {
+		let t = lt.current, n = t.currentInput, r = t.valueForLabel(n);
+		if (r !== void 0) {
+			r !== t.currentValue && t.select(r, "blur", e), t.setInputValue(t.labelFor(r) ?? n, "blur", e);
+			return;
+		}
+		if (n === "") {
+			t.currentValue !== null && t.select(null, "blur", e);
+			return;
+		}
+		if (t.allowsCustomValue) {
+			n !== t.currentValue && t.select(n, "blur", e);
+			return;
+		}
+		let i = t.currentValue === null ? "" : t.labelFor(t.currentValue) ?? "";
+		t.setInputValue(i, "blur", e), t.onInputReset?.(n, {
+			reason: "blur",
+			source: e
+		});
+	}, []), dt = l((e, t, n) => {
+		X.current.onCreate?.(e, {
+			reason: t,
+			source: n
+		});
+	}, []), ft = l((e, t) => {
+		$(null, e, t), Q("", e === "clear" ? "clear" : "programmatic", t);
+	}, [$, Q]);
+	p(ge, () => ({
+		close: () => Z(!1, "programmatic"),
+		focus: () => X.current.inputNode?.focus({ preventScroll: !0 }),
+		open: () => Z(!0, "programmatic"),
+		scrollToKey: (e) => {
+			let t = Ue?.querySelector(`[data-part='item'][data-value="${CSS.escape(e)}"]`);
+			typeof t?.scrollIntoView == "function" && t.scrollIntoView({ block: "nearest" });
+		}
+	}), [Ue, Z]);
+	let pt = {
+		align: e ?? U.align,
+		alignOffset: t ?? U.alignOffset,
+		allowsCustomValue: n ?? U.allowsCustomValue,
+		autocomplete: o ?? U.autocomplete,
+		autoHighlight: c ?? U.autoHighlight,
+		clear: ft,
+		clearable: d ?? U.clearable,
+		closeOnEscape: m ?? U.closeOnEscape,
+		closeOnOutsidePress: v ?? U.closeOnOutsidePress,
+		closeOnSelect: b ?? U.closeOnSelect,
+		collisionPadding: x ?? U.collisionPadding,
+		completion: Xe,
+		contentId: je,
+		contentNode: Ue,
+		canCreate: S !== void 0,
+		create: dt,
+		disabled: Ge,
+		entry: Ye,
+		flip: k ?? U.flip,
+		form: A,
+		fullWidth: ne ?? U.fullWidth,
+		hideWhenDetached: M ?? U.hideWhenDetached,
+		highlighted: qe,
+		highlightMatch: ae ?? U.highlightMatch,
+		inputId: Me,
+		inputNode: Ve,
+		inputValue: q,
+		invalid: oe ?? W?.invalid ?? U.invalid,
+		labelFor: it,
+		loading: I ?? U.loading,
+		locale: ke,
+		loop: R ?? U.loop,
+		matches: ot,
+		mount: se ?? U.mount,
+		name: ce,
+		onLoadMore: de,
+		open: G,
+		openOn: pe ?? U.openOn,
+		optionId: at,
+		portal: me ?? U.portal,
+		query: J,
+		readOnly: Ke,
+		registerLabel: rt,
+		required: _e ?? W?.required ?? U.required,
+		seen: Je.current,
+		select: $,
+		setCompletion: Ze,
+		setContentNode: We,
+		setHighlighted: st,
+		setInputNode: He,
+		setInputValue: Q,
+		setOpen: Z,
+		settleInput: ut,
+		shift: ve ?? U.shift,
+		side: ye ?? U.side,
+		sideOffset: be ?? U.sideOffset,
+		size: xe ?? W?.size ?? U.size,
+		strategy: Se ?? U.strategy,
+		t: De,
+		total: Ce,
+		value: K,
+		variant: Te ?? U.variant,
+		wantsCompletion: Qe,
+		width: Ee ?? U.width
+	};
+	return /* @__PURE__ */ y(re.Provider, {
+		value: pt,
+		children: u
+	});
+}
+//#endregion
+//#region src/combobox/combobox-collection.ts
+var P = e(), oe = "[data-part='item']";
+function F(e) {
+	return e === null ? [] : [...e.querySelectorAll(oe)];
+}
+var I = (e) => e.dataset.value ?? "", L = (e) => e.dataset.disabled === void 0, R = (e) => e.dataset.textValue ?? e.querySelector("[data-part='label']")?.textContent?.trim() ?? e.textContent?.trim() ?? "";
+function z(e, t, n, r) {
+	let i = F(e);
+	if (i.length === 0) return null;
+	let a = D({
+		enabled: i.map(L),
+		from: t === null ? -1 : i.findIndex((e) => I(e) === t),
+		intent: n,
+		loop: r
+	});
+	return a === -1 ? null : I(i[a]);
+}
+function se(e, t, n, r) {
+	if (n === "none") return null;
+	if (n === "selected") {
+		if (t === null) return null;
+		let n = F(e).find((e) => I(e) === t && L(e));
+		return n === void 0 ? null : I(n);
+	}
+	return z(e, null, n, r);
+}
+function ce(e) {
+	let t = F(e).find(L);
+	return t === void 0 ? null : R(t);
+}
+function le(e, t) {
+	let n = F(e).find((e) => R(e) === t);
+	return n === void 0 ? null : I(n);
+}
+function ue(e, t) {
+	if (e === null || t === null) return;
+	let n = F(e).find((e) => I(e) === t);
+	typeof n?.scrollIntoView == "function" && n.scrollIntoView({ block: "nearest" });
+}
+//#endregion
+//#region src/combobox/combobox-parts.tsx
+function B(e, t) {
+	return (n) => {
+		e?.(n), n.defaultPrevented || t(n);
+	};
+}
+function de(e, ...t) {
+	for (let n of t) typeof n == "function" ? n(e) : n != null && (n.current = e);
+}
+function V({ ref: e, render: r, ...i }) {
+	let o = M(), s = a(), [c, u] = _(null);
+	d(() => {
+		o.setInputNode(c);
+	}, [o, c]), m(() => {
+		o.completion !== null && c !== null && c.setSelectionRange(o.inputValue.length, o.completion.length);
+	}, [
+		o.completion,
+		o.inputValue,
+		c
+	]);
+	let f = (e, t) => {
+		let n = z(o.contentNode, o.highlighted, e, o.loop);
+		n !== null && o.setHighlighted(n, "keyboard", t);
+	}, p = (e) => {
+		if (o.highlighted === null && o.completion !== null) {
+			let t = le(o.contentNode, o.completion);
+			if (t !== null) {
+				o.select(t, "keyboard", e), o.setInputValue(o.completion, "select", e), o.setOpen(!1, "select", e);
+				return;
+			}
+		}
+		let t = o.highlighted;
+		if (t !== null && fe(o.contentNode, t)) {
+			o.create(t, "keyboard", e), o.setOpen(!1, "select", e);
+			return;
+		}
+		if (t === null) {
+			o.allowsCustomValue ? o.select(o.inputValue === "" ? null : o.inputValue, "keyboard", e) : o.setInputValue(o.value === null ? "" : o.labelFor(o.value) ?? "", "select", e), o.setOpen(!1, "select", e);
+			return;
+		}
+		o.select(t, "keyboard", e), o.setInputValue(o.labelFor(t) ?? t, "select", e), o.closeOnSelect && o.setOpen(!1, "select", e);
+	}, h = (e, t) => {
+		o.entry.current = e, o.setOpen(!0, "keyboard", t);
+	}, g = (e) => {
+		if (o.disabled) return;
+		let t = e.altKey;
+		switch (e.key) {
+			case "ArrowDown":
+				if (o.readOnly) return;
+				e.preventDefault(), o.open ? t || f("next", e.nativeEvent) : h(t ? "none" : "first", e.nativeEvent);
+				return;
+			case "ArrowUp":
+				if (o.readOnly) return;
+				e.preventDefault(), t ? o.setOpen(!1, "keyboard", e.nativeEvent) : o.open ? f("previous", e.nativeEvent) : h("last", e.nativeEvent);
+				return;
+			case "PageDown":
+				if (!o.open) return;
+				e.preventDefault(), f("pageDown", e.nativeEvent);
+				return;
+			case "PageUp":
+				if (!o.open) return;
+				e.preventDefault(), f("pageUp", e.nativeEvent);
+				return;
+			case "Enter":
+				if (!o.open && !o.allowsCustomValue) return;
+				e.preventDefault(), p(e.nativeEvent);
+				return;
+			case "Escape":
+				if (o.open) {
+					e.preventDefault(), o.setOpen(!1, "escape", e.nativeEvent);
+					return;
+				}
+				if (o.value === null) return;
+				e.preventDefault(), o.inputValue === (o.labelFor(o.value) ?? "") ? o.clear("keyboard", e.nativeEvent) : o.setInputValue(o.labelFor(o.value) ?? "", "keyboard", e.nativeEvent);
+				return;
+			case "Tab":
+				o.completion === null ? o.open && o.setOpen(!1, "dismiss", e.nativeEvent) : p(e.nativeEvent);
+				return;
+		}
+	}, x = (e) => {
+		let t = e.currentTarget.value;
+		o.setInputValue(t, "keyboard", e.nativeEvent), o.wantsCompletion.current = o.autocomplete === "both" && t.length > o.inputValue.length, o.openOn === "input" && !o.open && !o.readOnly && (o.entry.current = o.autoHighlight ? "first" : "none", o.setOpen(!0, "keyboard", e.nativeEvent));
+	}, S = () => {
+		o.openOn !== "focus" || o.readOnly || o.open || (o.entry.current = "selected", o.setOpen(!0, "keyboard"));
+	}, C = (e) => {
+		o.openOn === "manual" || o.open || o.disabled || o.readOnly || (o.entry.current = "selected", o.setOpen(!0, "pointer", e.nativeEvent));
+	}, w = (e) => {
+		let t = e.relatedTarget;
+		if (t instanceof Node && o.contentNode?.contains(t) === !0) return;
+		let n = T(c?.ownerDocument);
+		n instanceof Node && o.contentNode?.contains(n) === !0 || (o.settleInput(e), o.open && o.setOpen(!1, "blur"));
+	}, ee = (e) => {
+		o.clear("clear", e.nativeEvent), c?.focus({ preventScroll: !0 });
+	}, E = (e) => {
+		o.disabled || o.readOnly || (o.entry.current = "selected", o.setOpen(!o.open, "pointer", e.nativeEvent), c?.focus({ preventScroll: !0 }));
+	}, te = l((t) => {
+		u(t), de(t, e);
+	}, [e]), D = [i["aria-describedby"], s?.describedBy].filter(Boolean).join(" "), O = o.clearable && o.inputValue !== "" && !o.disabled && !o.readOnly, k = {
+		"data-part": "root",
+		"data-size": o.size,
+		"data-ui": "combobox",
+		"data-variant": o.variant,
+		...o.fullWidth ? { "data-full-width": "" } : {},
+		...o.open ? { "data-open": "" } : {},
+		...o.disabled ? { "data-disabled": "" } : {},
+		...o.readOnly ? { "data-readonly": "" } : {},
+		...o.invalid ? { "data-invalid": "" } : {},
+		...o.required ? { "data-required": "" } : {},
+		...o.loading ? { "data-loading": "" } : {}
+	}, A = /* @__PURE__ */ b(v, { children: [
+		/* @__PURE__ */ y("input", {
+			...i,
+			"aria-activedescendant": o.open && o.highlighted !== null ? o.optionId(o.highlighted) : void 0,
+			"aria-autocomplete": o.autocomplete,
+			"aria-controls": o.open ? o.contentId : void 0,
+			"aria-describedby": D === "" ? void 0 : D,
+			"aria-expanded": o.open,
+			"aria-invalid": o.invalid ? !0 : void 0,
+			"aria-readonly": o.readOnly ? !0 : void 0,
+			"data-part": "input",
+			disabled: o.disabled,
+			id: i.id ?? s?.ids.control ?? o.inputId,
+			onBlur: B(i.onBlur, w),
+			onChange: B(i.onChange, x),
+			onClick: B(i.onClick, C),
+			onFocus: B(i.onFocus, S),
+			onKeyDown: B(i.onKeyDown, g),
+			readOnly: o.readOnly,
+			ref: te,
+			required: o.required,
+			role: "combobox",
+			type: "text",
+			value: o.completion ?? o.inputValue
+		}),
+		O ? /* @__PURE__ */ y("button", {
+			"aria-label": o.t("clear"),
+			"data-part": "clear",
+			onClick: ee,
+			type: "button",
+			children: /* @__PURE__ */ y(n, { children: /* @__PURE__ */ y(t, { name: "x" }) })
+		}) : null,
+		/* @__PURE__ */ y("button", {
+			"aria-label": o.t("trigger"),
+			"data-part": "trigger",
+			disabled: o.disabled,
+			onClick: E,
+			tabIndex: -1,
+			type: "button",
+			children: o.loading ? /* @__PURE__ */ y("span", {
+				"aria-hidden": "true",
+				"data-part": "busy",
+				"data-ui": "spinner"
+			}) : /* @__PURE__ */ y("span", {
+				"data-part": "arrow",
+				children: /* @__PURE__ */ y(n, { children: /* @__PURE__ */ y(t, { name: "chevron-down" }) })
+			})
+		}),
+		o.name === void 0 ? null : /* @__PURE__ */ y("input", {
+			"aria-hidden": "true",
+			form: o.form,
+			name: o.name,
+			readOnly: !0,
+			required: o.required,
+			style: {
+				border: 0,
+				clip: "rect(0 0 0 0)",
+				clipPath: "inset(50%)",
+				height: "1px",
+				overflow: "hidden",
+				padding: 0,
+				position: "absolute",
+				whiteSpace: "nowrap",
+				width: "1px"
+			},
+			tabIndex: -1,
+			type: "text",
+			value: o.value ?? ""
+		})
+	] });
+	return r === void 0 ? /* @__PURE__ */ y("div", {
+		...k,
+		children: A
+	}) : r({
+		...k,
+		children: A
+	});
+}
+function fe(e, t) {
+	return e !== null && e.querySelector(`[data-part='item'][data-value="${CSS.escape(t)}"]`)?.hasAttribute("data-create") === !0;
+}
+function H({ children: e, empty: t, ref: n, render: r, status: i, ...a }) {
+	let o = M(), [s, c] = _(null), [l, u] = _(null), [f, p] = _(null), [h, v] = _("unmounted"), [C, T] = _(!1), [E, te] = _(0), D = g(null), O = g(null), k = g(o);
+	k.current = o, d(() => {
+		let e = x({
+			present: k.current.open,
+			onStatusChange: v
+		});
+		return D.current = e, v(e.status), () => {
+			e.destroy(), D.current = null;
+		};
+	}, []), d(() => D.current?.sync(o.open), [o.open]), d(() => D.current?.setNode(s), [s]), d(() => o.setContentNode(l), [o, l]);
+	let A = o.mount === "eager" || o.mount === "lazy" && o.seen || h !== "unmounted";
+	d(() => {
+		if (!A) {
+			p(null);
+			return;
+		}
+		let e = S({
+			origin: o.inputNode,
+			disabled: !o.portal
+		});
+		return p(e.container), () => e.release();
+	}, [
+		o.inputNode,
+		o.portal,
+		A
+	]);
+	let { align: j, alignOffset: ne, collisionPadding: re, flip: N, hideWhenDetached: ie, shift: ae, side: oe, sideOffset: L, strategy: R, width: z } = o;
+	if (d(() => {
+		if (s === null || o.inputNode === null) return;
+		let e = !0, t = o.inputNode.closest("[data-part='root']") ?? o.inputNode, n = ee(t, s, {
+			align: j,
+			alignOffset: ne,
+			boundaryPadding: re,
+			flip: N,
+			hideWhenDetached: ie,
+			matchWidth: z === "anchor",
+			shift: ae,
+			side: oe,
+			sideOffset: L,
+			strategy: R
+		});
+		return n.update().then(() => {
+			e && T(!0);
+		}), () => {
+			e = !1, n.destroy(), T(!1);
+		};
+	}, [
+		j,
+		ne,
+		re,
+		o.inputNode,
+		N,
+		ie,
+		s,
+		ae,
+		oe,
+		L,
+		R,
+		z
+	]), d(() => {
+		if (s === null || !o.open) return;
+		let e = [o.inputNode?.closest("[data-part='root']") ?? null].filter((e) => e !== null), t = w(s, {
+			branches: e,
+			escape: o.closeOnEscape,
+			focusOutside: !1,
+			modal: !1,
+			outsidePress: o.closeOnOutsidePress,
+			scrollLock: !1,
+			onDismiss: (e) => {
+				k.current.setOpen(!1, e.reason === "escape" ? "escape" : "outsidePress", e.source);
+			}
+		});
+		return () => t.destroy();
+	}, [
+		o.closeOnEscape,
+		o.closeOnOutsidePress,
+		o.inputNode,
+		o.open,
+		s
+	]), m(() => {
+		let e = F(l).filter((e) => e.dataset.create === void 0).length;
+		te((t) => t === e ? t : e);
+	}), m(() => {
+		let e = k.current;
+		if (e.open && l !== null) {
+			if (e.entry.current !== "none") {
+				let t = se(l, e.value, e.entry.current, e.loop) ?? (e.autoHighlight ? se(l, null, "first", e.loop) : null);
+				t !== null && e.setHighlighted(t, "keyboard");
+				return;
+			}
+			e.highlighted !== null && (F(l).some((t) => I(t) === e.highlighted) || e.setHighlighted(null, "keyboard"));
+		}
+	}, [
+		o.open,
+		o.query,
+		E,
+		l
+	]), d(() => {
+		ue(l, o.highlighted);
+	}, [o.highlighted, l]), m(() => {
+		let e = k.current;
+		if (!e.wantsCompletion.current || l === null) return;
+		e.wantsCompletion.current = !1;
+		let t = pe(l, e.inputValue);
+		t !== null && t !== e.inputValue && e.setCompletion(t);
+	}, [
+		o.inputValue,
+		E,
+		l
+	]), d(() => {
+		let e = O.current, t = l, n = o.onLoadMore;
+		if (e === null || t === null || n === void 0 || typeof IntersectionObserver != "function") return;
+		let r = new IntersectionObserver((e) => {
+			e.some((e) => e.isIntersecting) && n();
+		}, { root: t });
+		return r.observe(e), () => r.disconnect();
+	}, [
+		o.onLoadMore,
+		E,
+		l
+	]), !A) return null;
+	let ce = {
+		"data-align": j,
+		...o.open ? {} : { inert: !0 },
+		...o.open && C ? { "data-open": "" } : {},
+		"data-part": "positioner",
+		"data-size": o.size,
+		"data-ui": "combobox",
+		"data-width": o.width
+	}, le = i === void 0 ? o.loading ? o.t("loading") : E === 0 ? null : o.t("count", { count: E }) : i, B = /* @__PURE__ */ y("div", {
+		...ce,
+		ref: (e) => {
+			c(e), de(e, n);
+		},
+		children: /* @__PURE__ */ b("div", {
+			...a,
+			"aria-busy": o.loading ? !0 : void 0,
+			"aria-label": a["aria-label"] ?? void 0,
+			"data-loading": o.loading ? "" : void 0,
+			"data-part": "content",
+			id: o.contentId,
+			ref: u,
+			role: "listbox",
+			children: [
+				e,
+				/* @__PURE__ */ y("div", { ref: O }),
+				!o.loading && E === 0 && o.canCreate && o.query !== "" ? /* @__PURE__ */ y("div", {
+					"data-create": "",
+					"data-part": "item",
+					"data-value": o.query,
+					id: o.optionId(o.query),
+					onClick: (e) => {
+						o.create(o.query, "pointer", e.nativeEvent), o.setOpen(!1, "select", e.nativeEvent), o.inputNode?.focus({ preventScroll: !0 });
+					},
+					onPointerDown: (e) => {
+						e.defaultPrevented || e.preventDefault();
+					},
+					onPointerEnter: (e) => o.setHighlighted(o.query, "pointer", e.nativeEvent),
+					role: "option",
+					...o.highlighted === o.query ? { "data-current": "" } : {},
+					children: /* @__PURE__ */ y("span", {
+						"data-part": "label",
+						children: o.t("create", { query: o.query })
+					})
+				}) : null,
+				!o.loading && E === 0 && !(o.canCreate && o.query !== "") ? /* @__PURE__ */ y("div", {
+					"data-part": "empty",
+					children: t ?? o.t("empty")
+				}) : null,
+				o.loading ? /* @__PURE__ */ y("div", {
+					"aria-hidden": "true",
+					"data-part": "placeholder",
+					children: [
+						0,
+						1,
+						2
+					].map((e) => /* @__PURE__ */ y("div", { children: /* @__PURE__ */ y("span", {
+						"data-part": "root",
+						"data-shape": "text",
+						"data-ui": "skeleton",
+						"data-loading": ""
+					}) }, e))
+				}) : null,
+				/* @__PURE__ */ y("div", {
+					"aria-live": "polite",
+					"data-part": "status",
+					...o.loading ? { "data-loading": "" } : {},
+					role: "status",
+					children: le
+				})
+			]
+		})
+	}), V = r === void 0 ? B : r({
+		...ce,
+		children: e
+	});
+	return f === null ? V : (0, P.createPortal)(V, f);
+}
+function pe(e, t) {
+	if (t === "") return null;
+	let n = ce(e);
+	return n === null ? null : n.toLowerCase().startsWith(t.toLowerCase()) ? n : null;
+}
+//#endregion
+//#region src/combobox/combobox-items.tsx
+function me({ children: e, description: r, disabled: i = !1, icon: a, position: s, ref: c, textValue: l, value: u, ...f }) {
+	let p = M(), [m, v] = _(null), x = g(null), S = l ?? (typeof e == "string" ? e : void 0);
+	d(() => {
+		if (m === null) return;
+		let e = S ?? m.querySelector("[data-part='label']")?.textContent?.trim() ?? "";
+		e !== "" && e !== x.current && (x.current = e, p.registerLabel(u, e));
+	}, [
+		p,
+		m,
+		S,
+		u
+	]);
+	let C = h(() => {
+		if (!p.highlightMatch || p.query === "" || S === void 0) return e;
+		let t = O(S, p.query, { locale: p.locale });
+		return t.length === 0 ? e : /* @__PURE__ */ y(o, {
+			ranges: t,
+			text: S
+		});
+	}, [
+		e,
+		p.highlightMatch,
+		p.locale,
+		p.query,
+		S
+	]);
+	if (S !== void 0 && !p.matches(S)) return null;
+	let w = p.value === u, T = p.highlighted === u, ee = (e) => {
+		i || p.setHighlighted(u, "pointer", e.nativeEvent);
+	}, E = (e) => {
+		f.onPointerDown?.(e), !e.defaultPrevented && e.preventDefault();
+	}, te = (e) => {
+		i || (p.select(u, "pointer", e.nativeEvent), p.setInputValue(p.labelFor(u) ?? S ?? u, "select", e.nativeEvent), p.closeOnSelect && p.setOpen(!1, "select", e.nativeEvent), p.inputNode?.focus({ preventScroll: !0 }));
+	};
+	return /* @__PURE__ */ b("div", {
+		...f,
+		"aria-disabled": i ? !0 : void 0,
+		"aria-posinset": s,
+		"aria-selected": w,
+		"aria-setsize": s === void 0 ? void 0 : p.total,
+		"data-part": "item",
+		"data-value": u,
+		...S === void 0 ? {} : { "data-text-value": S },
+		...i ? { "data-disabled": "" } : {},
+		...w ? { "data-selected": "" } : {},
+		...T ? { "data-current": "" } : {},
+		id: f.id ?? p.optionId(u),
+		onClick: te,
+		onPointerDown: E,
+		onPointerEnter: ee,
+		ref: (e) => {
+			v(e), typeof c == "function" ? c(e) : c != null && (c.current = e);
+		},
+		role: "option",
+		children: [
+			a === void 0 ? null : /* @__PURE__ */ y("span", {
+				"data-part": "icon",
+				children: a
+			}),
+			/* @__PURE__ */ y("span", {
+				"data-part": "label",
+				children: C
+			}),
+			r === void 0 ? null : /* @__PURE__ */ y("span", {
+				"data-part": "description",
+				children: r
+			}),
+			/* @__PURE__ */ y("span", {
+				"data-part": "indicator",
+				children: /* @__PURE__ */ y(n, { children: /* @__PURE__ */ y(t, { name: "check" }) })
+			})
+		]
+	});
+}
+function he({ children: e, label: t, ...n }) {
+	let r = `${f()}group`, { query: i } = M(), [a, o] = _(null), [s, c] = _(!1);
+	return d(() => {
+		a !== null && c(a.querySelector("[data-part='item']") === null);
+	}, [a, i]), /* @__PURE__ */ b("div", {
+		...n,
+		"aria-labelledby": r,
+		"data-part": "group",
+		hidden: s,
+		ref: o,
+		role: "group",
+		children: [/* @__PURE__ */ y("div", {
+			"data-part": "group-label",
+			id: r,
+			children: t
+		}), e]
+	});
+}
+function ge(e) {
+	return /* @__PURE__ */ y("div", {
+		"data-part": "separator",
+		ref: e.ref,
+		role: "separator"
+	});
+}
+//#endregion
+export { V as a, k as c, H as i, ne as l, me as n, ae as o, ge as r, M as s, he as t, j as u };