@bridge-ui/vue 0.0.6 → 0.0.7

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

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