@bridge-ui/vue 0.0.5 → 0.0.7

package/dist/Components/Select/composables/useSelect.js

@@ -1,14 +1,14 @@
-import { hasNamedSlot as e } from "../../../Utils/slotOrProp.js";
-import { mergePartBind as t, resolveFieldAdornmentIconSize as n, useBridgeUIComponent as r, useBridgeUIMergedRegistryClasses as ee } from "../../../Utils/index.js";
-import { formFieldBridgeKeys as te, useFormField as i } from "../../FormField/composables/useFormField.js";
-import { useListboxNavigation as ne } from "../../Listbox/composables/useListboxNavigation.js";
-import { Comment as re, Text as ie, computed as a, nextTick as ae, onBeforeUnmount as oe, onMounted as se, ref as o, useAttrs as ce, useId as le, useSlots as ue, watch as s } from "vue";
-import { get as c, isNil as de, omit as fe } from "es-toolkit/compat";
-import { adjustAutosizeTextareaHeight as pe, cn as l, createSelectAsyncSearch as me, filterListboxEntries as he, flattenListboxOptions as u, mergeBridgeUILayeredClasses as d, normalizeListboxEntries as f, normalizeSelectOptions as ge, resolveSelectAsyncDebounce as _e, resolveSelectAsyncOptions as ve, selectValuesEqual as p, splitComponentProps as ye } from "@bridge-ui/core";
-import { ChevronsUpDown as be } from "@lucide/vue";
-import { colorProps as xe, invalidatedProps as Se } from "@bridge-ui/core/Tokens/Listbox";
+import { useResolveMessage as e } from "../../../Adapters/I18n/useI18nAdapter.js";
+import { hasNamedSlot as t } from "../../../Utils/slotOrProp.js";
+import { mergePartBind as n, resolveFieldAdornmentIconSize as r, useBridgeUIComponent as ee, useBridgeUIMergedRegistryClasses as i } from "../../../Utils/index.js";
+import { formFieldBridgeKeys as te, useFormField as ne } from "../../FormField/composables/useFormField.js";
+import { useListboxNavigation as re } from "../../Listbox/composables/useListboxNavigation.js";
+import { Comment as ie, Text as ae, computed as a, nextTick as oe, onBeforeUnmount as se, onMounted as ce, ref as o, useAttrs as le, useId as ue, useSlots as de, watch as s } from "vue";
+import { adjustAutosizeTextareaHeight as fe, cn as c, createSelectAsyncSearch as pe, filterListboxEntries as me, flattenListboxOptions as l, mergeBridgeUILayeredClasses as u, normalizeListboxEntries as he, normalizeSelectOptions as ge, resolveSelectAsyncDebounce as _e, resolveSelectAsyncOptions as ve, selectValuesEqual as d, splitComponentProps as ye } from "@bridge-ui/core";
+import { get as f, isNil as be, omit as xe } from "es-toolkit/compat";
+import { colorProps as Se, invalidatedProps as Ce } from "@bridge-ui/core/Tokens/Listbox";
 //#region src/Components/Select/composables/useSelect.ts
-var Ce = [
+var we = [
 	"classes",
 	"loading",
 	"options",
@@ -29,27 +29,27 @@ var Ce = [
 	"minItemsForSearch",
 	"optionDescription"
 ];
-function m(m, h, g, _, we) {
-	let Te = ce(), v = ue(), y = le(), b = o(!1), x = o(""), S = o(-1), C = o(null), w = o(!1), T = o([]), E = null, D = o([]), O = a(() => ye({
-		bridgeKeys: Ce,
+function p(p, m, h, g, _) {
+	let Te = le(), v = de(), y = ue(), b = e(), x = o(!1), S = o(""), C = o(-1), w = o(null), T = o(!1), E = o([]), D = null, O = o([]), k = a(() => ye({
+		bridgeKeys: we,
 		props: {
 			...Te,
-			...m
+			...p
 		}
-	})), k = a(() => O.value.componentProps), A = a(() => ({ classes: k.value.classes })), { components: j, entry: Ee } = r({
+	})), A = a(() => k.value.componentProps), j = a(() => ({ classes: A.value.classes })), { components: M, entry: Ee } = ee({
 		componentName: "Select",
-		props: () => A.value
-	}), M = ee({
+		props: () => j.value
+	}), N = i({
 		entry: Ee,
-		props: () => A.value
-	}), N = a(() => !!k.value.multiple), P = a(() => ({
-		optionLabel: k.value.optionLabel ?? "label",
-		optionValue: k.value.optionValue ?? "value",
-		optionDescription: k.value.optionDescription ?? "description"
-	})), F = a(() => we.value.length > 0 ? we.value.map((e) => ({
+		props: () => j.value
+	}), P = a(() => !!A.value.multiple), F = a(() => ({
+		optionLabel: A.value.optionLabel ?? "label",
+		optionValue: A.value.optionValue ?? "value",
+		optionDescription: A.value.optionDescription ?? "description"
+	})), I = a(() => _.value.length > 0 ? _.value.map((e) => ({
 		option: e,
 		type: "option"
-	})) : f(k.value.options, P.value)), De = a(() => u(F.value)), I = o([]);
+	})) : he(A.value.options, F.value)), De = a(() => l(I.value)), L = o([]);
 	function Oe(e) {
 		if (!e || typeof e != "object") return !1;
 		let t = e.type;
@@ -58,304 +58,304 @@ function m(m, h, g, _, we) {
 		return n === "SelectOption" || r === "SelectOption";
 	}
 	function ke() {
-		return e(v, "default") ? (v.default?.({}) ?? []).some((e) => {
+		return t(v, "default") ? (v.default?.({}) ?? []).some((e) => {
 			if (!e || typeof e != "object") return !1;
 			let t = e.type;
-			return t === re || t === ie || t === void 0 || typeof t == "symbol" ? !1 : !Oe(e);
+			return t === ie || t === ae || t === void 0 || typeof t == "symbol" ? !1 : !Oe(e);
 		}) : !1;
 	}
-	let L = a(() => ke() && !k.value.options?.length), R = a(() => {
-		if (L.value) return [];
-		if (T.value.length > 0) {
-			let e = f(T.value, P.value);
-			return k.value.flipOptions ? [...e].reverse() : e;
+	let R = a(() => ke() && !A.value.options?.length), z = a(() => {
+		if (R.value) return [];
+		if (E.value.length > 0) {
+			let e = he(E.value, F.value);
+			return A.value.flipOptions ? [...e].reverse() : e;
 		}
-		return k.value.flipOptions ? [...F.value].reverse().map((e) => e.type === "section" ? {
+		return A.value.flipOptions ? [...I.value].reverse().map((e) => e.type === "section" ? {
 			...e,
 			options: [...e.options].reverse()
-		} : e) : F.value;
-	}), Ae = a(() => L.value ? I.value : u(R.value)), z = a(() => {
-		let e = h.value;
-		return N.value ? Array.isArray(e) ? e : [] : !de(e) && e !== "" ? [e] : [];
-	}), B = a(() => {
+		} : e) : I.value;
+	}), Ae = a(() => R.value ? L.value : l(z.value)), B = a(() => {
+		let e = m.value;
+		return P.value ? Array.isArray(e) ? e : [] : !be(e) && e !== "" ? [e] : [];
+	}), V = a(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of [...Ae.value, ...D.value]) e.set(t.value, t);
-		return z.value.map((t) => e.get(t) ?? {
+		for (let t of [...Ae.value, ...O.value]) e.set(t.value, t);
+		return B.value.map((t) => e.get(t) ?? {
 			value: t,
 			label: String(t)
 		});
-	}), je = a(() => z.value.length > 0), Me = a(() => k.value.clearable !== !1), V = a(() => !!k.value.asyncData), H = a(() => {
-		if (V.value || k.value.searchable) return !0;
-		let e = k.value.minItemsForSearch ?? 11;
+	}), je = a(() => B.value.length > 0), Me = a(() => A.value.clearable !== !1), H = a(() => !!A.value.asyncData), U = a(() => {
+		if (H.value || A.value.searchable) return !0;
+		let e = A.value.minItemsForSearch ?? 11;
 		return De.value.length >= e;
-	}), U = a(() => b.value && H.value), Ne = a(() => !!k.value.loading || w.value), Pe = a(() => {
-		if (L.value) return [];
-		if (!U.value || !x.value.trim()) return R.value;
-		let e = x.value.trim().toLowerCase();
-		return he(R.value, (t) => t.label.toLowerCase().includes(e));
-	}), W = a(() => L.value ? I.value : u(Pe.value)), G = ne(() => W.value, S, y), Fe = a(() => m.readonly || m.disabled ? !0 : !U.value), Ie = a(() => U.value || N.value ? x.value : B.value[0]?.label ?? ""), Le = (e) => {
-		C.value = e instanceof HTMLElement ? e : null;
+	}), W = a(() => x.value && U.value), Ne = a(() => !!A.value.loading || T.value), Pe = a(() => {
+		if (R.value) return [];
+		if (!W.value || !S.value.trim()) return z.value;
+		let e = S.value.trim().toLowerCase();
+		return me(z.value, (t) => t.label.toLowerCase().includes(e));
+	}), G = a(() => R.value ? L.value : l(Pe.value)), K = re(() => G.value, C, y), Fe = a(() => p.readonly || p.disabled ? !0 : !W.value), Ie = a(() => W.value || P.value ? S.value : V.value[0]?.label ?? ""), Le = (e) => {
+		w.value = e instanceof HTMLElement ? e : null;
 	};
 	function Re(e) {
 		e.preventDefault();
 	}
 	function ze(e) {
-		if (m.disabled || m.readonly) return;
+		if (p.disabled || p.readonly) return;
 		let t = e.target;
 		if (!t.closest("[data-select-clear]") && !(t.closest(".wrapper-start-slot") || t.closest(".wrapper-end-slot"))) {
-			if (!b.value) {
-				Z();
+			if (!x.value) {
+				Q();
 				return;
 			}
-			U.value || (Q(), g.value?.focus({ preventScroll: !0 }));
+			W.value || ($(), h.value?.focus({ preventScroll: !0 }));
 		}
 	}
 	let Be = a(() => {
-		let n = ye({
+		let e = ye({
 			bridgeKeys: te,
-			props: fe(O.value.inheritedAttrs, ["class"])
-		}).componentProps, r = n.endIcon ?? (e(v, "end") ? void 0 : be), { listbox: ee, ...i } = n.customProps ?? {};
+			props: xe(k.value.inheritedAttrs, ["class"])
+		}).componentProps, r = e.endIcon ?? (t(v, "end") ? void 0 : "chevronUpDown"), { listbox: ee, ...i } = e.customProps ?? {};
 		return {
-			...n,
+			...e,
 			endIcon: r,
-			classes: M.value,
+			classes: N.value,
 			customProps: {
 				...i,
-				container: t(i.container, {}, {
+				container: n(i.container, {}, {
 					ref: Le,
 					onClick: ze,
-					class: l({ "cursor-pointer": !m.disabled && !m.readonly && !U.value })
+					class: c({ "cursor-pointer": !p.disabled && !p.readonly && !W.value })
 				})
 			}
 		};
-	}), Ve = a(() => m.customProps?.listbox), K = i(() => Be.value, {
+	}), Ve = a(() => p.customProps?.listbox), q = ne(() => Be.value, {
 		size: "md",
 		rounded: "md",
 		color: "primary",
 		variant: "outline",
-		withErrorIcon: !0
+		showErrorIcon: !0
 	}, {
-		likeInput: () => N.value,
-		control: () => N.value ? "textarea" : "input"
-	}), q = (e) => {
-		!e || !N.value || pe(e);
+		likeInput: () => P.value,
+		control: () => P.value ? "textarea" : "input"
+	}), J = (e) => {
+		!e || !P.value || fe(e);
 	};
-	function J(e) {
-		return z.value.some((t) => p(t, e));
-	}
 	function Y(e) {
-		h.value = e;
+		return B.value.some((t) => d(t, e));
 	}
 	function X(e) {
-		if (N.value) {
+		m.value = e;
+	}
+	function Z(e) {
+		if (P.value) {
 			let t = Array.isArray(e) ? e : [];
-			_("update:modelValue", t), _("change", t);
+			g("update:modelValue", t), g("change", t);
 			return;
 		}
 		let t = e ?? "";
-		_("update:modelValue", t), _("change", t);
-	}
-	function Z() {
-		m.disabled || m.readonly || b.value || (b.value = !0, x.value = "", G.highlightCurrentSelection(J), _("open"), V.value && k.value.asyncData && E?.searchImmediate(""));
+		g("update:modelValue", t), g("change", t);
 	}
 	function Q() {
-		E?.cancel(), b.value && (b.value = !1, x.value = "", S.value = -1, _("close"));
+		p.disabled || p.readonly || x.value || (x.value = !0, S.value = "", K.highlightCurrentSelection(Y), g("open"), H.value && A.value.asyncData && D?.searchImmediate(""));
+	}
+	function $() {
+		D?.cancel(), x.value && (x.value = !1, S.value = "", C.value = -1, g("close"));
 	}
-	function $(e) {
+	function He(e) {
 		if (!e.disabled) {
-			if (N.value) {
-				let t = [...z.value], n = t.findIndex((t) => p(t, e.value));
-				n >= 0 ? (t.splice(n, 1), _("deselect", e)) : (t.push(e.value), _("select", e)), Y(t), X(t), x.value = "", S.value = -1, ae(() => {
-					q(g.value), g.value?.focus({ preventScroll: !0 });
+			if (P.value) {
+				let t = [...B.value], n = t.findIndex((t) => d(t, e.value));
+				n >= 0 ? (t.splice(n, 1), g("deselect", e)) : (t.push(e.value), g("select", e)), X(t), Z(t), S.value = "", C.value = -1, oe(() => {
+					J(h.value), h.value?.focus({ preventScroll: !0 });
 				});
 				return;
 			}
-			Y(e.value), X(e.value), _("select", e), Q();
+			X(e.value), Z(e.value), g("select", e), $();
 		}
 	}
-	function He(e) {
-		e?.preventDefault(), e?.stopPropagation(), N.value ? (Y([]), X([])) : (Y(null), X(null)), _("clear"), Q();
-	}
-	function Ue(e, t) {
-		if (t.preventDefault(), t.stopPropagation(), !N.value) return;
-		let n = z.value.filter((t) => !p(t, e.value));
-		Y(n), X(n), _("deselect", e), ae(() => q(g.value));
+	function Ue(e) {
+		e?.preventDefault(), e?.stopPropagation(), P.value ? (X([]), Z([])) : (X(null), Z(null)), g("clear"), $();
 	}
-	function We() {
-		let e = G.getHighlightedOption();
-		e && $(e);
+	function We(e, t) {
+		if (t.preventDefault(), t.stopPropagation(), !P.value) return;
+		let n = B.value.filter((t) => !d(t, e.value));
+		X(n), Z(n), g("deselect", e), oe(() => J(h.value));
 	}
-	function Ge(e) {
-		x.value = e.target.value, _("search", x.value), b.value || Z(), G.resetHighlight(), V.value && E?.searchDebounced(x.value);
+	function Ge() {
+		let e = K.getHighlightedOption();
+		e && He(e);
 	}
 	function Ke(e) {
-		if (!(m.disabled || m.readonly)) switch (e.key) {
+		S.value = e.target.value, g("search", S.value), x.value || Q(), K.resetHighlight(), H.value && D?.searchDebounced(S.value);
+	}
+	function qe(e) {
+		if (!(p.disabled || p.readonly)) switch (e.key) {
 			case "ArrowDown":
-				e.preventDefault(), b.value ? G.moveHighlight(1) : Z();
+				e.preventDefault(), x.value ? K.moveHighlight(1) : Q();
 				break;
 			case "ArrowUp":
-				e.preventDefault(), b.value ? G.moveHighlight(-1) : Z();
+				e.preventDefault(), x.value ? K.moveHighlight(-1) : Q();
 				break;
 			case "Enter":
-				e.preventDefault(), b.value ? We() : Z();
+				e.preventDefault(), x.value ? Ge() : Q();
 				break;
 			case "Escape":
-				e.preventDefault(), Q();
+				e.preventDefault(), $();
 				break;
 			case "Home":
-				b.value && (e.preventDefault(), G.highlightFirst());
+				x.value && (e.preventDefault(), K.highlightFirst());
 				break;
 			case "End":
-				b.value && (e.preventDefault(), G.highlightLast());
+				x.value && (e.preventDefault(), K.highlightLast());
 				break;
 			case "Backspace":
-				if (N.value && !x.value && B.value.length > 0) {
+				if (P.value && !S.value && V.value.length > 0) {
 					e.preventDefault();
-					let t = B.value.at(-1);
-					t && Ue(t, e);
+					let t = V.value.at(-1);
+					t && We(t, e);
 				}
 				break;
 			case "Tab":
-				Q();
+				$();
 				break;
 			default: break;
 		}
 	}
-	async function qe(e) {
-		let t = k.value.asyncData;
+	async function Je(e) {
+		let t = A.value.asyncData;
 		if (t) {
-			w.value = !0;
+			T.value = !0;
 			try {
-				let { options: n, resolvedSelected: r } = await ve(t, e, z.value, (e) => ge(e, P.value));
-				r.length > 0 && (D.value = r), T.value = n;
+				let { options: n, resolvedSelected: r } = await ve(t, e, B.value, (e) => ge(e, F.value));
+				r.length > 0 && (O.value = r), E.value = n;
 			} finally {
-				w.value = !1;
+				T.value = !1;
 			}
 		}
 	}
-	async function Je() {
-		let e = k.value.asyncData;
-		!e?.resolve || z.value.length === 0 || (D.value = ge(await e.resolve(z.value), P.value));
+	async function Ye() {
+		let e = A.value.asyncData;
+		!e?.resolve || B.value.length === 0 || (O.value = ge(await e.resolve(B.value), F.value));
 	}
-	let Ye = a(() => {
-		let e = c(d(xe, c(j.value, [
+	let Xe = a(() => {
+		let e = f(u(Se, f(M.value, [
 			"Listbox",
 			"tokens",
 			"color"
-		])), K.merged.value.color ?? "primary");
-		return K.invalidated.value ? d(Se, c(j.value, [
+		])), q.merged.value.color ?? "primary");
+		return q.invalidated.value ? u(Ce, f(M.value, [
 			"Listbox",
 			"tokens",
 			"invalidated"
 		])) : e;
-	}), Xe = a(() => Ye.value?.value), Ze = a(() => {
-		let e = !m.disabled && !m.readonly && !U.value, n = !m.disabled && !m.readonly && U.value && H.value, r = je.value && !N.value && !U.value;
-		return t({
+	}), Ze = a(() => Xe.value?.value), Qe = a(() => {
+		let e = !p.disabled && !p.readonly && !W.value, t = !p.disabled && !p.readonly && W.value && U.value, r = je.value && !P.value && !W.value;
+		return n({
 			role: "combobox",
 			value: Ie.value,
 			"aria-controls": y,
-			"aria-expanded": b.value,
+			"aria-expanded": x.value,
 			readonly: Fe.value,
-			onKeydown: Ke,
-			placeholder: k.value.placeholder,
-			"aria-autocomplete": H.value ? "list" : void 0,
-			"aria-activedescendant": b.value ? G.activeDescendantId.value : void 0,
-			...N.value ? {
+			onKeydown: qe,
+			placeholder: A.value.placeholder,
+			"aria-autocomplete": U.value ? "list" : void 0,
+			"aria-activedescendant": x.value ? K.activeDescendantId.value : void 0,
+			...P.value ? {
 				rows: 1,
 				onInput: (e) => {
-					Ge(e), q(e.target);
+					Ke(e), J(e.target);
 				}
-			} : { onInput: Ge }
-		}, K.inputBind.value, l({
-			"cursor-text": n,
+			} : { onInput: Ke }
+		}, q.inputBind.value, c({
+			"cursor-text": t,
 			"cursor-pointer": e,
-			"resize-none overflow-hidden": N.value,
-			[l(Xe.value, M.value.value) ?? ""]: r
+			"resize-none overflow-hidden": P.value,
+			[c(Ze.value, N.value.value) ?? ""]: r
 		}));
 	});
 	s(() => [
-		b.value,
-		N.value,
-		g.value
+		x.value,
+		P.value,
+		h.value
 	], () => {
-		q(g.value);
-	}, { immediate: !0 }), s(() => h.value, () => {
-		Je();
-	}, { immediate: !0 }), s(() => k.value.asyncData, (e) => {
-		if (E?.cancel(), T.value = [], Je(), !e) {
-			E = null;
+		J(h.value);
+	}, { immediate: !0 }), s(() => m.value, () => {
+		Ye();
+	}, { immediate: !0 }), s(() => A.value.asyncData, (e) => {
+		if (D?.cancel(), E.value = [], Ye(), !e) {
+			D = null;
 			return;
 		}
-		E = me((e) => void qe(e), _e(e));
-	}, { immediate: !0 }), oe(() => {
-		E?.cancel();
-	}), se(() => {
-		q(g.value);
+		D = pe((e) => void Je(e), _e(e));
+	}, { immediate: !0 }), se(() => {
+		D?.cancel();
+	}), ce(() => {
+		J(h.value);
 	});
-	let Qe = a(() => n(K.merged.value.size)), $e = a(() => t({}, {}, {
+	let $e = a(() => r(q.merged.value.size)), et = a(() => n({}, {}, {
 		tabindex: 0,
 		role: "button",
 		"data-select-clear": !0,
 		onMousedown: Re,
-		class: l({
+		class: c({
 			"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-colors duration-150": !0,
-			[Ye.value?.clear ?? ""]: !0,
-			[M.value.clear ?? ""]: !0
+			[Xe.value?.clear ?? ""]: !0,
+			[N.value.clear ?? ""]: !0
 		})
-	})), et = a(() => ({
+	})), tt = a(() => ({
 		listboxId: y,
-		isSelected: J,
+		isSelected: Y,
 		disableAutoFocus: !0,
 		loading: Ne.value,
-		multiple: N.value,
-		maxHeight: m.maxHeight,
+		multiple: P.value,
+		maxHeight: p.maxHeight,
 		entries: Pe.value,
-		options: W.value,
-		size: K.merged.value.size,
-		color: K.merged.value.color,
-		labelledBy: K.controlId.value,
-		rounded: K.merged.value.rounded,
-		invalidated: K.invalidated.value,
-		highlightedIndex: S.value,
-		disableMaxHeight: m.disableMaxHeight === !0,
-		emptyMessage: k.value.emptyMessage ?? "No options",
-		hideEmptyMessage: k.value.hideEmptyMessage === !0,
-		loadingMessage: k.value.loadingMessage ?? "Loading...",
+		options: G.value,
+		size: q.merged.value.size,
+		color: q.merged.value.color,
+		labelledBy: q.controlId.value,
+		rounded: q.merged.value.rounded,
+		invalidated: q.invalidated.value,
+		highlightedIndex: C.value,
+		disableMaxHeight: p.disableMaxHeight === !0,
+		hideEmptyMessage: A.value.hideEmptyMessage === !0,
+		emptyMessage: A.value.emptyMessage ?? b("No options"),
+		loadingMessage: A.value.loadingMessage ?? b("Loading..."),
 		...Ve.value
 	}));
-	function tt(e) {
-		let t = I.value;
-		t.length === e.length && t.every((t, n) => String(t.value) === String(e[n]?.value)) || (I.value = e);
+	function nt(e) {
+		let t = L.value;
+		t.length === e.length && t.every((t, n) => String(t.value) === String(e[n]?.value)) || (L.value = e);
 	}
 	return {
-		open: b,
+		open: x,
 		slots: v,
 		hasValue: je,
-		multiple: N,
+		multiple: P,
 		listboxId: y,
-		formField: K,
+		formField: q,
 		isLoading: Ne,
 		clearable: Me,
-		clearBind: $e,
-		isSelected: J,
-		clearValue: He,
-		removeChip: Ue,
-		triggerBind: Ze,
-		selectOption: $,
-		containerRef: C,
-		listboxProps: et,
-		clearIconSize: Qe,
-		mergedClasses: M,
-		visibleOptions: W,
-		isSearchActive: U,
-		selectedOptions: B,
-		hasComposedList: L,
-		highlightedIndex: S,
-		handleRegisteredOptionsChange: tt,
-		emptyMessage: a(() => k.value.emptyMessage ?? "No options"),
-		hideEmptyMessage: a(() => k.value.hideEmptyMessage === !0),
-		loadingMessage: a(() => k.value.loadingMessage ?? "Loading...")
+		clearBind: et,
+		isSelected: Y,
+		clearValue: Ue,
+		removeChip: We,
+		triggerBind: Qe,
+		selectOption: He,
+		containerRef: w,
+		listboxProps: tt,
+		clearIconSize: $e,
+		mergedClasses: N,
+		visibleOptions: G,
+		isSearchActive: W,
+		selectedOptions: V,
+		hasComposedList: R,
+		highlightedIndex: C,
+		handleRegisteredOptionsChange: nt,
+		hideEmptyMessage: a(() => A.value.hideEmptyMessage === !0),
+		emptyMessage: a(() => A.value.emptyMessage ?? b("No options")),
+		loadingMessage: a(() => A.value.loadingMessage ?? b("Loading..."))
 	};
 }
 //#endregion
-export { m as useSelect };
+export { p as useSelect };

package/dist/Components/Skeleton/composables/useSkeleton.js

@@ -1,12 +1,12 @@
 import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
 import { computed as r, useAttrs as i } from "vue";
-import { get as a } from "es-toolkit/compat";
-import { cn as o, mergeBridgeUILayeredClasses as s, splitComponentProps as c } from "@bridge-ui/core";
+import { cn as a, mergeBridgeUILayeredClasses as o, splitComponentProps as s } from "@bridge-ui/core";
+import { get as c } from "es-toolkit/compat";
 import { roundedProps as l } from "@bridge-ui/core/Tokens/Skeleton";
 //#region src/Components/Skeleton/composables/useSkeleton.ts
 var u = ["classes", "rounded"];
 function d(d, f) {
-	let p = i(), m = r(() => c({
+	let p = i(), m = r(() => s({
 		props: {
 			...p,
 			...d
@@ -19,10 +19,10 @@ function d(d, f) {
 	}), _ = n({
 		entry: g,
 		props: () => m.value.componentProps
-	}), v = r(() => a(s(l, g.value?.tokens?.rounded), h.value.rounded));
+	}), v = r(() => c(o(l, g.value?.tokens?.rounded), h.value.rounded));
 	return {
 		merged: h,
-		rootBind: r(() => e({}, m.value.inheritedAttrs, o({
+		rootBind: r(() => e({}, m.value.inheritedAttrs, a({
 			"block animate-pulse bg-gray-200 dark:bg-gray-700": !0,
 			[v.value ?? ""]: !0,
 			[_.value.root ?? ""]: !0