morya-ui 0.4.0 → 0.4.1

package/dist/config-provider/index.js

@@ -42,7 +42,7 @@ function b({ r: e, g: t, b: n }, r) {
 	let i = Number(r.toFixed(3));
 	return `rgba(${Math.round(e)}, ${Math.round(t)}, ${Math.round(n)}, ${i})`;
 }
-function x({ r: e, g: t, b: n }) {
+function re({ r: e, g: t, b: n }) {
 	let r = e / 255, i = t / 255, a = n / 255, o = Math.max(r, i, a), s = o - Math.min(r, i, a), c = 0;
 	s !== 0 && (c = o === r ? (i - a) / s % 6 : o === i ? (a - r) / s + 2 : (r - i) / s + 4, c *= 60, c < 0 && (c += 360));
 	let l = o === 0 ? 0 : s / o;
@@ -52,7 +52,7 @@ function x({ r: e, g: t, b: n }) {
 		v: o
 	};
 }
-function S({ h: e, s: t, v: n }) {
+function x({ h: e, s: t, v: n }) {
 	let r = (e % 360 + 360) % 360, i = n * t, a = i * (1 - Math.abs(r / 60 % 2 - 1)), o = n - i, s = 0, c = 0, l = 0;
 	return r < 60 ? [s, c, l] = [
 		i,
@@ -84,7 +84,7 @@ function S({ h: e, s: t, v: n }) {
 		b: (l + o) * 255
 	};
 }
-var C = 2, w = .16, T = .05, E = .05, D = .15, O = 5, k = 4, A = [
+var S = 2, C = .16, w = .05, T = .05, E = .15, D = 5, O = 4, k = [
 	{
 		index: 7,
 		amount: 15
@@ -125,43 +125,43 @@ var C = 2, w = .16, T = .05, E = .05, D = .15, O = 5, k = 4, A = [
 		index: 1,
 		amount: 98
 	}
-], j = "#141414";
-function M(e) {
+], A = "#141414";
+function j(e) {
 	return Math.round(e * 100) / 100;
 }
-function N(e, t, n) {
-	let r = Math.round(e.h), i = r >= 60 && r <= 240 ? n ? r - C * t : r + C * t : n ? r + C * t : r - C * t;
+function M(e, t, n) {
+	let r = Math.round(e.h), i = r >= 60 && r <= 240 ? n ? r - S * t : r + S * t : n ? r + S * t : r - S * t;
 	return i < 0 ? i += 360 : i >= 360 && (i -= 360), i;
 }
-function P(e, t, n) {
+function N(e, t, n) {
 	if (e.h === 0 && e.s === 0) return e.s;
 	let r;
-	return r = n ? e.s - w * t : t === k ? e.s + w : e.s + T * t, r > 1 && (r = 1), n && t === O && r > .1 && (r = .1), r < .06 && (r = .06), M(r);
-}
-function F(e, t, n) {
-	let r = n ? e.v + E * t : e.v - D * t;
-	return M(Math.max(0, Math.min(1, r)));
-}
-function I(e, t = {}) {
-	let n = g(e), r = x(n), i = [];
-	for (let e = O; e > 0; --e) i.push(S({
-		h: N(r, e, !0),
-		s: P(r, e, !0),
-		v: F(r, e, !0)
+	return r = n ? e.s - C * t : t === O ? e.s + C : e.s + w * t, r > 1 && (r = 1), n && t === D && r > .1 && (r = .1), r < .06 && (r = .06), j(r);
+}
+function P(e, t, n) {
+	let r = n ? e.v + T * t : e.v - E * t;
+	return j(Math.max(0, Math.min(1, r)));
+}
+function F(e, t = {}) {
+	let n = g(e), r = re(n), i = [];
+	for (let e = D; e > 0; --e) i.push(x({
+		h: M(r, e, !0),
+		s: N(r, e, !0),
+		v: P(r, e, !0)
 	}));
 	i.push(n);
-	for (let e = 1; e <= k; e += 1) i.push(S({
-		h: N(r, e, !1),
-		s: P(r, e, !1),
-		v: F(r, e, !1)
+	for (let e = 1; e <= O; e += 1) i.push(x({
+		h: M(r, e, !1),
+		s: N(r, e, !1),
+		v: P(r, e, !1)
 	}));
 	if (t.dark) {
-		let e = g(t.backgroundColor ?? j);
-		return A.map(({ index: t, amount: r }) => L(e, i[t] ?? n, r / 100)).map(y);
+		let e = g(t.backgroundColor ?? A);
+		return k.map(({ index: t, amount: r }) => I(e, i[t] ?? n, r / 100)).map(y);
 	}
 	return i.map(y);
 }
-function L(e, t, n) {
+function I(e, t, n) {
 	let r = _(n, 0, 1);
 	return {
 		r: e.r + (t.r - e.r) * r,
@@ -169,7 +169,7 @@ function L(e, t, n) {
 		b: e.b + (t.b - e.b) * r
 	};
 }
-function re(e, t, n) {
+function ie(e, t, n) {
 	let r = g(e), i = g(t), a = _(n, 0, 1);
 	return y({
 		r: r.r + (i.r - r.r) * a,
@@ -177,11 +177,23 @@ function re(e, t, n) {
 		b: r.b + (i.b - r.b) * a
 	});
 }
-function ie(e) {
+function L(e, t) {
+	let n = g(e), r = g(t);
+	for (let e = .01; e <= 1; e += .01) {
+		let t = Math.round((n.r - r.r * (1 - e)) / e), i = Math.round((n.g - r.g * (1 - e)) / e), a = Math.round((n.b - r.b * (1 - e)) / e);
+		if (t >= 0 && t <= 255 && i >= 0 && i <= 255 && a >= 0 && a <= 255) return b({
+			r: t,
+			g: i,
+			b: a
+		}, Math.round(e * 100) / 100);
+	}
+	return b(n, 1);
+}
+function ae(e) {
 	let { r: t, g: n, b: r } = g(e);
 	return (t * 299 + n * 587 + r * 114) / 1e3 < 128;
 }
-function ae({ r: e, g: t, b: n }) {
+function oe({ r: e, g: t, b: n }) {
 	let r = e / 255, i = t / 255, a = n / 255, o = Math.max(r, i, a), s = Math.min(r, i, a), c = o - s, l = 0;
 	c !== 0 && (l = o === r ? (i - a) / c % 6 : o === i ? (a - r) / c + 2 : (r - i) / c + 4, l *= 60, l < 0 && (l += 360));
 	let u = (o + s) / 2, d = c === 0 ? 0 : c / (1 - Math.abs(2 * u - 1));
@@ -191,7 +203,7 @@ function ae({ r: e, g: t, b: n }) {
 		l: u
 	};
 }
-function oe({ h: e, s: t, l: n }) {
+function se({ h: e, s: t, l: n }) {
 	let r = (e % 360 + 360) % 360, i = (1 - Math.abs(2 * n - 1)) * t, a = i * (1 - Math.abs(r / 60 % 2 - 1)), o = n - i / 2, s = 0, c = 0, l = 0;
 	return r < 60 ? [s, c, l] = [
 		i,
@@ -224,8 +236,8 @@ function oe({ h: e, s: t, l: n }) {
 	};
 }
 function R(e, t) {
-	let n = ae(g(e)), r = t / 100, i = n.l < .5 ? n.l + r * (1 - n.l) : n.l - r;
-	return y(oe({
+	let n = oe(g(e)), r = t / 100, i = n.l < .5 ? n.l + r * (1 - n.l) : n.l - r;
+	return y(se({
 		...n,
 		l: _(i, 0, 1)
 	}));
@@ -235,7 +247,7 @@ function z(e, t) {
 }
 //#endregion
 //#region src/theme/derive.ts
-var se = [
+var ce = [
 	1,
 	2,
 	3,
@@ -246,7 +258,7 @@ var se = [
 	8,
 	9,
 	10
-], ce = [
+], le = [
 	"primary",
 	"success",
 	"warning",
@@ -259,8 +271,8 @@ function B(e, t) {
 	if (n === void 0) throw Error(`[morya-ui] Missing derived token "${t}". This is a bug in the token engine.`);
 	return n;
 }
-function le(e, t) {
-	let n = I(e, { dark: t }), r = t ? [
+function ue(e, t) {
+	let n = F(e, { dark: t }), r = t ? [
 		0,
 		1,
 		2,
@@ -302,7 +314,7 @@ function le(e, t) {
 function V(e) {
 	return e.replace(/([a-z\d])([A-Z])/g, "$1-$2").toLowerCase();
 }
-function ue(e, t) {
+function de(e, t) {
 	let n = {}, r = {
 		primary: e.colorPrimary,
 		success: e.colorSuccess,
@@ -311,16 +323,16 @@ function ue(e, t) {
 		info: e.colorInfo,
 		link: e.colorLink || e.colorPrimary
 	}, i = {};
-	for (let e of ce) {
-		let a = le(r[e], t);
+	for (let e of le) {
+		let a = ue(r[e], t);
 		i[e] = a;
 		let o = `${e.charAt(0).toUpperCase()}${e.slice(1)}`;
-		for (let e of se) n[`color${o}${e}`] = a[e];
+		for (let e of ce) n[`color${o}${e}`] = a[e];
 		n[`color${o}Bg`] = a[1], n[`color${o}BgHover`] = a[2], n[`color${o}Border`] = a[3], n[`color${o}BorderHover`] = a[4], n[`color${o}Hover`] = a[5], n[`color${o}`] = a[6], n[`color${o}Active`] = a[7], n[`color${o}TextHover`] = a[8], n[`color${o}Text`] = a[9], n[`color${o}TextActive`] = a[10];
 	}
-	return n.colorSuccessHover = i.success[4], n.colorWarningHover = i.warning[4], n.colorInfoHover = i.info[4], n.colorErrorBgActive = i.error[3], n.colorErrorBgFilledHover = re(i.error[1], i.error[3], .5), t && (n.colorPrimaryBg = i.primary[3], n.colorPrimaryBgHover = i.primary[4], n.colorErrorBg = i.error[3], n.colorWarningBg = i.warning[3], n.colorSuccessBg = i.success[3], n.colorInfoBg = i.info[3]), n;
+	return n.colorSuccessHover = i.success[4], n.colorWarningHover = i.warning[4], n.colorInfoHover = i.info[4], n.colorErrorBgActive = i.error[3], n.colorErrorBgFilledHover = ie(i.error[1], i.error[3], .5), t && (n.colorPrimaryBg = i.primary[3], n.colorPrimaryBgHover = i.primary[4], n.colorErrorBg = i.error[3], n.colorWarningBg = i.warning[3], n.colorSuccessBg = i.success[3], n.colorInfoBg = i.info[3]), n;
 }
-function de(e, t) {
+function fe(e, t) {
 	let n = e.colorTextBase || (t ? "#ffffff" : "#000000"), r = e.colorBgBase || (t ? "#000000" : "#ffffff");
 	return t ? {
 		colorBgBase: r,
@@ -368,7 +380,7 @@ function de(e, t) {
 		colorBorderSecondary: R(r, 6)
 	};
 }
-function fe(e, t, n) {
+function pe(e, t, n) {
 	let r = e.colorTextBase || (t ? "#ffffff" : "#000000");
 	return {
 		colorTextPlaceholder: B(n, "colorTextQuaternary"),
@@ -384,8 +396,10 @@ function fe(e, t, n) {
 		colorBgMask: z("#000000", .45),
 		colorWhite: "#ffffff",
 		colorSplit: B(n, "colorBorderSecondary"),
-		controlOutline: B(n, "colorPrimaryBg"),
+		controlOutline: L(B(n, "colorPrimaryBg"), B(n, "colorBgContainer")),
 		controlOutlineWidth: "2px",
+		controlOutlineDanger: L(B(n, "colorErrorBg"), B(n, "colorBgContainer")),
+		controlOutlineWarning: L(B(n, "colorWarningBg"), B(n, "colorBgContainer")),
 		controlItemBgHover: B(n, "colorFillTertiary"),
 		controlItemBgActive: B(n, "colorPrimaryBg"),
 		controlItemBgActiveHover: B(n, "colorPrimaryBgHover"),
@@ -407,7 +421,7 @@ function H(e) {
 		sizeXXS: `${t - n * 3}px`
 	};
 }
-function pe(e) {
+function me(e) {
 	let { controlHeight: t } = e;
 	return {
 		controlHeightXS: `${t * .5}px`,
@@ -418,7 +432,7 @@ function pe(e) {
 		controlPaddingHorizontalSM: "8px"
 	};
 }
-function me(e) {
+function he(e) {
 	let { fontSize: t } = e, n = t - 2, r = t, i = t + 2, a = t + 6, o = t + 10, s = t + 14, c = t + 24, l = 1.6667, u = 1.5714, d = 1.5, f = (e) => Number(e.toFixed(4));
 	return {
 		fontSizeSM: `${n}px`,
@@ -445,7 +459,7 @@ function me(e) {
 		fontWeightStrong: "600"
 	};
 }
-function he(e) {
+function ge(e) {
 	let { borderRadius: t } = e;
 	return {
 		borderRadiusXS: `${Math.max(t - 4, 2)}px`,
@@ -455,7 +469,7 @@ function he(e) {
 		borderRadiusOuter: `${t + 4}px`
 	};
 }
-function ge(e) {
+function _e(e) {
 	let t = e.motionBase + e.motionUnit, n = e.motionBase + e.motionUnit * 2, r = e.motionBase + e.motionUnit * 3;
 	return {
 		lineWidth: `${e.lineWidth}px`,
@@ -475,27 +489,27 @@ function ge(e) {
 	};
 }
 function U(e, t = {}) {
-	let n = t.dark ?? ie(e.colorBgBase), r = ue(e, n), i = {
-		...de(e, n),
+	let n = t.dark ?? ae(e.colorBgBase), r = de(e, n), i = {
+		...fe(e, n),
 		...r
 	};
 	return {
 		...i,
-		...fe(e, n, i),
+		...pe(e, n, i),
 		...H(e),
-		...pe(e),
 		...me(e),
 		...he(e),
-		...ge(e)
+		...ge(e),
+		..._e(e)
 	};
 }
-function _e(e) {
+function ve(e) {
 	let t = {};
-	for (let [n, r] of Object.entries(e)) ve.has(n) || (t[`--m-${V(n)}`] = r);
+	for (let [n, r] of Object.entries(e)) ye.has(n) || (t[`--m-${V(n)}`] = r);
 	return t;
 }
-var ve = /* @__PURE__ */ new Set(["fontSizeSM", "fontSizeLG"]);
-function ye(e, t) {
+var ye = /* @__PURE__ */ new Set(["fontSizeSM", "fontSizeLG"]);
+function be(e, t) {
 	let n = H(e), r = (t) => `${Math.round((e.motionBase + e.motionUnit * t) * 1e3)}ms`;
 	return {
 		"--m-color-surface": B(t, "colorBgContainer"),
@@ -507,6 +521,13 @@ function ye(e, t) {
 		"--m-color-warn": B(t, "colorWarning"),
 		"--m-color-info": B(t, "colorInfo"),
 		"--m-color-focus-ring": B(t, "colorPrimary"),
+		"--m-color-control-outline": B(t, "controlOutline"),
+		"--m-color-control-outline-danger": B(t, "controlOutlineDanger"),
+		"--m-color-control-outline-warning": B(t, "controlOutlineWarning"),
+		"--m-focus-outline-width": B(t, "controlOutlineWidth"),
+		"--m-focus-shadow": `0 0 0 ${B(t, "controlOutlineWidth")} ${B(t, "controlOutline")}`,
+		"--m-focus-shadow-danger": `0 0 0 ${B(t, "controlOutlineWidth")} ${B(t, "controlOutlineDanger")}`,
+		"--m-focus-shadow-warning": `0 0 0 ${B(t, "controlOutlineWidth")} ${B(t, "controlOutlineWarning")}`,
 		"--m-color-primary-active": B(t, "colorPrimaryActive"),
 		"--m-color-on-emphasis": B(t, "colorTextLightSolid"),
 		"--m-color-on-primary": B(t, "colorTextLightSolid"),
@@ -537,11 +558,11 @@ function ye(e, t) {
 		"--m-z-sticky": "10"
 	};
 }
-function be(e, t = {}) {
+function xe(e, t = {}) {
 	let n = U(e, t);
 	return {
-		..._e(n),
-		...ye(e, n)
+		...ve(n),
+		...be(e, n)
 	};
 }
 var W = {
@@ -575,7 +596,7 @@ var W = {
 ({ ...W }), { ...W };
 //#endregion
 //#region src/theme/createTheme.ts
-var G = "m-theme-vars", xe = {
+var G = "m-theme-vars", Se = {
 	default: {},
 	dark: {
 		colorTextBase: "#ffffff",
@@ -586,10 +607,10 @@ var G = "m-theme-vars", xe = {
 		sizeStep: 2
 	}
 };
-function Se(e) {
+function Ce(e) {
 	return `.m-${V(e.replace(/^M(?=[A-Z])/, ""))}`;
 }
-function Ce(e) {
+function we(e) {
 	let t = {};
 	for (let [n, r] of Object.entries(e)) {
 		let e = n.startsWith("--") ? n : `--m-${V(n)}`;
@@ -597,17 +618,17 @@ function Ce(e) {
 	}
 	return t;
 }
-function we(e) {
+function Te(e) {
 	return e.reduce((e, t) => ({
 		...e,
-		...xe[t]
+		...Se[t]
 	}), W);
 }
-function Te(e = {}) {
+function Ee(e = {}) {
 	let t = e.algorithm === void 0 ? [] : Array.isArray(e.algorithm) ? e.algorithm : [e.algorithm], n = t.includes("dark"), r = {
-		...t.length > 0 ? we(t) : W,
+		...t.length > 0 ? Te(t) : W,
 		...e.seed
-	}, i = U(r, { dark: n }), a = be(r, { dark: n }), o = Object.entries(a).map(([e, t]) => `  ${e}: ${t};`).join("\n"), s = Object.entries(e.components ?? {}).map(([t, n]) => `${e.selector?.(t) ?? Se(t)} {\n${Object.entries(Ce(n)).map(([e, t]) => `  ${e}: ${t};`).join("\n")}\n}`).join("\n\n"), c = [`:root {\n${o}\n}`, s].filter(Boolean).join("\n\n");
+	}, i = U(r, { dark: n }), a = xe(r, { dark: n }), o = Object.entries(a).map(([e, t]) => `  ${e}: ${t};`).join("\n"), s = Object.entries(e.components ?? {}).map(([t, n]) => `${e.selector?.(t) ?? Ce(t)} {\n${Object.entries(we(n)).map(([e, t]) => `  ${e}: ${t};`).join("\n")}\n}`).join("\n\n"), c = [`:root {\n${o}\n}`, s].filter(Boolean).join("\n\n");
 	return {
 		seed: r,
 		tokens: i,
@@ -651,63 +672,63 @@ function q(e, t, n = []) {
 }
 //#endregion
 //#region src/theme/useDensity.ts
-var J = "morya-ui-density", Y = ["wex-design-density"], Ee = [
+var J = "morya-ui-density", Y = ["wex-design-density"], De = [
 	"compact",
 	"comfortable",
 	"spacious"
-], De = d(Oe());
+], Oe = d(ke());
 function X(e, t) {
 	let n = t ?? (typeof document < "u" ? document.documentElement : void 0);
 	n && (n.dataset.mDensity = e);
 }
-function Oe() {
+function ke() {
 	let e = K(J, Y);
-	return e && Ee.includes(e) ? e : "comfortable";
+	return e && De.includes(e) ? e : "comfortable";
 }
-typeof window < "u" && p(De, (e) => {
+typeof window < "u" && p(Oe, (e) => {
 	X(e), q(J, e, Y);
 }, { immediate: !0 });
 //#endregion
 //#region src/theme/useMotion.ts
-var Z = "morya-ui-motion", Q = ["wex-design-motion"], ke = [
+var Z = "morya-ui-motion", Q = ["wex-design-motion"], Ae = [
 	"full",
 	"reduced",
 	"none"
-], Ae = d(Pe());
-function je(e, t) {
+], je = d(Fe());
+function Me(e, t) {
 	let n = t ?? (typeof document < "u" ? document.documentElement : void 0);
 	n && (n.dataset.mMotion = e);
 }
-function Me(e, t) {
+function Ne(e, t) {
 	let n = t ?? (typeof document < "u" ? document.documentElement : void 0);
 	n && (e === !1 ? n.dataset.mIgnoreReducedMotion = "true" : delete n.dataset.mIgnoreReducedMotion);
 }
-function Ne() {
+function Pe() {
 	return "full";
 }
-function Pe() {
+function Fe() {
 	let e = K(Z, Q);
-	return e && ke.includes(e) ? e : Ne();
+	return e && Ae.includes(e) ? e : Pe();
 }
-typeof window < "u" && p(Ae, (e) => {
-	je(e), q(Z, e, Q);
+typeof window < "u" && p(je, (e) => {
+	Me(e), q(Z, e, Q);
 }, { immediate: !0 });
 //#endregion
 //#region src/theme/index.ts
 function $() {
 	return typeof window < "u" && window.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light";
 }
-function Fe(e, t) {
+function Ie(e, t) {
 	let n = t ?? (typeof document < "u" ? document.documentElement : void 0);
 	n && (n.dataset.theme = e);
 }
 //#endregion
 //#region src/components/ConfigProvider/ConfigProvider.vue?vue&type=script&setup=true&lang.ts
-var Ie = [
+var Le = [
 	"data-m-density",
 	"data-theme",
 	"dir"
-], Le = /* @__PURE__ */ o({
+], Re = /* @__PURE__ */ o({
 	inheritAttrs: !1,
 	__name: "ConfigProvider",
 	props: {
@@ -749,70 +770,70 @@ var Ie = [
 			return t(e, v.value);
 		});
 		n(y);
-		let b = i(() => y.value.density ?? "comfortable"), x = i(() => {
+		let b = i(() => y.value.density ?? "comfortable"), re = i(() => {
 			let e = y.value.theme;
 			if (e !== void 0) return e === "system" ? $() : e;
-		}), S = i(() => m.globalDensity !== !1), C = i(() => {
+		}), x = i(() => m.globalDensity !== !1), S = i(() => {
 			let e = y.value.zIndex;
 			if (e != null) return { "--m-z-base": String(e) };
-		}), w = i(() => y.value.direction ?? "ltr"), T = d(null), E = null;
-		function D() {
-			E?.(), E = null;
+		}), C = i(() => y.value.direction ?? "ltr"), w = d(null), T = null;
+		function E() {
+			T?.(), T = null;
 		}
-		function O() {
-			D();
+		function D() {
+			E();
 			let e = y.value.themeConfig;
 			if (!e) return;
-			let t = Te(e);
-			if (S.value) {
-				E = t.inject();
+			let t = Ee(e);
+			if (x.value) {
+				T = t.inject();
 				return;
 			}
-			T.value && t.apply(T.value);
+			w.value && t.apply(w.value);
 		}
-		p(() => [y.value.themeConfig, S.value], O, {
+		p(() => [y.value.themeConfig, x.value], D, {
 			immediate: !0,
 			deep: !0
-		}), l(D);
-		let k, A, j, M, N = null;
+		}), l(E);
+		let O, k, A, j, M = null;
+		function N() {
+			M?.removeEventListener("change", P), M = null;
+		}
 		function P() {
-			N?.removeEventListener("change", F), N = null;
+			y.value.theme === "system" && Ie($());
 		}
 		function F() {
-			y.value.theme === "system" && Fe($());
+			typeof document > "u" || (j = document.documentElement.dataset.mIgnoreReducedMotion, Ne(y.value.respectReducedMotion));
 		}
 		function I() {
-			typeof document > "u" || (M = document.documentElement.dataset.mIgnoreReducedMotion, Me(y.value.respectReducedMotion));
-		}
-		function L() {
-			if (!S.value || typeof document > "u") return;
+			if (!x.value || typeof document > "u") return;
 			let { density: e, zIndex: t, theme: n } = y.value;
-			e && (k = document.documentElement.dataset.mDensity, X(e)), t != null && (A = document.documentElement.style.getPropertyValue("--m-z-base"), document.documentElement.style.setProperty("--m-z-base", String(t))), n !== void 0 && (j = document.documentElement.dataset.theme, Fe(n === "system" ? $() : n)), n === "system" && typeof window < "u" ? (P(), N = window.matchMedia("(prefers-color-scheme: dark)"), N.addEventListener("change", F)) : P();
+			e && (O = document.documentElement.dataset.mDensity, X(e)), t != null && (k = document.documentElement.style.getPropertyValue("--m-z-base"), document.documentElement.style.setProperty("--m-z-base", String(t))), n !== void 0 && (A = document.documentElement.dataset.theme, Ie(n === "system" ? $() : n)), n === "system" && typeof window < "u" ? (N(), M = window.matchMedia("(prefers-color-scheme: dark)"), M.addEventListener("change", P)) : N();
 		}
-		return p(() => y.value.respectReducedMotion, I, { immediate: !0 }), p(() => [
-			S.value,
+		return p(() => y.value.respectReducedMotion, F, { immediate: !0 }), p(() => [
+			x.value,
 			y.value.density,
 			y.value.zIndex,
 			y.value.theme
-		], L, { immediate: !0 }), l(() => {
+		], I, { immediate: !0 }), l(() => {
 			if (!(typeof document > "u")) {
-				if (M !== void 0 && (M ? document.documentElement.dataset.mIgnoreReducedMotion = M : delete document.documentElement.dataset.mIgnoreReducedMotion), !S.value) {
-					P();
+				if (j !== void 0 && (j ? document.documentElement.dataset.mIgnoreReducedMotion = j : delete document.documentElement.dataset.mIgnoreReducedMotion), !x.value) {
+					N();
 					return;
 				}
-				k !== void 0 && (k ? document.documentElement.dataset.mDensity = k : delete document.documentElement.dataset.mDensity), A !== void 0 && (A ? document.documentElement.style.setProperty("--m-z-base", A) : document.documentElement.style.removeProperty("--m-z-base")), j !== void 0 && (j ? document.documentElement.dataset.theme = j : delete document.documentElement.dataset.theme), P();
+				O !== void 0 && (O ? document.documentElement.dataset.mDensity = O : delete document.documentElement.dataset.mDensity), k !== void 0 && (k ? document.documentElement.style.setProperty("--m-z-base", k) : document.documentElement.style.removeProperty("--m-z-base")), A !== void 0 && (A ? document.documentElement.dataset.theme = A : delete document.documentElement.dataset.theme), N();
 			}
 		}), (e, t) => (u(), a("div", c({
 			ref_key: "rootEl",
-			ref: T
+			ref: w
 		}, te(g), {
 			class: "m-config-provider",
 			"data-m-density": b.value,
-			"data-theme": x.value,
-			dir: w.value,
-			style: C.value
-		}), [f(e.$slots, "default")], 16, Ie));
+			"data-theme": re.value,
+			dir: C.value,
+			style: S.value
+		}), [f(e.$slots, "default")], 16, Le));
 	}
 });
 //#endregion
-export { Le as MConfigProvider };
+export { Re as MConfigProvider };