@bridge-ui/vue 0.0.11 → 0.1.0

package/dist/Components/Autocomplete/composables/useAutocomplete.d.ts

@@ -734,9 +734,9 @@ export declare function useAutocomplete(props: AutocompleteOwnProps, model: Ref<
         disableMaxHeight: boolean;
         emptyMessage: string;
         entries: ListboxEntry[];
+        error: boolean;
         hideEmptyMessage: boolean;
         highlightedIndex: number;
-        invalidated: boolean;
         isSelected: (value: import('@bridge-ui/core/Domain').ListboxValue) => boolean;
         labelledBy: string;
         listboxId: string;

package/dist/Components/Autocomplete/composables/useAutocomplete.js

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

package/dist/Components/BaseField/baseField.types.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes, Slot } from 'vue';
-import { BaseFieldInvalidated, BaseFieldSize } from '@bridge-ui/core/Tokens';
+import { BaseFieldSize } from '@bridge-ui/core/Tokens';
 import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
 import { UseBaseFieldReturn } from './composables/useBaseField';
 import { LabelProps } from '../Label/label.types';
@@ -71,13 +71,6 @@ export interface BaseFieldCustomProps {
      * Props forwarded to the label + corner header row.
      */
     header?: HTMLAttributes;
-    /**
-     * Error-state message colors (`errorMessage`). Label colors come from `Label`
-     * when `error` is set.
-     *
-     * @default undefined
-     */
-    invalidated?: Partial<BaseFieldInvalidated>;
     /**
      * Props forwarded to the primary `Label` (content stays owned by `BaseField`).
      *