@mudakit/ui 0.1.0 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 0.2.0
+
+### Minor Changes
+
+- 60219a2: Prefix Muda color tokens and their Tailwind utilities with `muda-` to avoid collisions with application themes.
+
+## 0.1.1
+
+### Patch Changes
+
+- 95247a2: Load Material Design icon implementations on demand to reduce the initial JavaScript chunk size.
+
 ## 0.1.0 - 2026-08-13
 
 - Publish the initial `@mudakit/ui` Vue component library.

package/README.md

@@ -39,7 +39,7 @@ The package root is also available:
 import { MudaButton, MudaCard } from "@mudakit/ui";
 ```
 
-Requires Vue 3.5 or later and Node.js 22.12 or later for development tooling.
+Requires Vue 3.5 or later and Node.js 26.5.0 or later for development tooling.
 
 ## License
 

package/dist/MudaButton-DJffOm2u.js

@@ -0,0 +1,42 @@
+import { createBlock as e, defineComponent as t, mergeProps as n, openBlock as r, renderSlot as i, resolveDynamicComponent as a, withCtx as o } from "vue";
+//#endregion
+//#region src/components/MudaButton/MudaButton.vue
+var s = /* @__PURE__ */ t({
+	__name: "MudaButton",
+	props: {
+		size: { default: "medium" },
+		variant: { default: "default" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		as: { default: "button" }
+	},
+	setup(t) {
+		let s = t;
+		return (t, c) => (r(), e(a(s.as), n(t.$attrs, {
+			disabled: s.disabled,
+			class: ["muda-button-reset flex items-center justify-center gap-1 focus-visible:outline-2 focus-visible:outline-offset-2", {
+				"muda-link-reset": s.as === "a",
+				"rounded-md font-semibold shadow-xs": !0,
+				"px-2.5 py-1.5 text-xs": s.size === "small",
+				"px-3 py-2 text-sm": s.size === "medium",
+				"px-3.5 py-2.5 text-sm": s.size === "large",
+				"cursor-pointer": !s.disabled,
+				"cursor-not-allowed": s.disabled,
+				"border bg-muda-form-background": s.variant === "default",
+				"border border-muda-primary-dark bg-muda-primary fill-white text-white hover:bg-muda-primary-dark focus-visible:bg-muda-primary disabled:border-muda-primary-dark/20 disabled:bg-muda-primary-light/70": s.variant === "primary",
+				"border border-muda-secondary-dark bg-muda-secondary fill-white text-white hover:bg-muda-secondary-dark focus-visible:bg-muda-secondary disabled:border-muda-secondary-dark/20 disabled:bg-muda-secondary-light/70": s.variant === "secondary",
+				"border border-muda-success-dark bg-muda-success fill-white text-white hover:bg-muda-success-dark focus-visible:bg-muda-success disabled:border-muda-success-dark/20 disabled:bg-muda-success-light/70": s.variant === "success",
+				"border border-muda-warning-dark bg-muda-warning fill-white text-white hover:bg-muda-warning-dark focus-visible:bg-muda-warning disabled:border-muda-warning-dark/20 disabled:bg-muda-warning-light/70": s.variant === "warning",
+				"border border-muda-danger-dark bg-muda-danger fill-white text-white hover:bg-muda-danger-dark focus-visible:bg-muda-danger disabled:border-muda-danger-dark/20 disabled:bg-muda-danger-light/70": s.variant === "danger",
+				"border border-muda-info-dark bg-muda-info fill-white text-white hover:bg-muda-info-dark focus-visible:bg-muda-info disabled:border-muda-info-dark/20 disabled:bg-muda-info-light/70": s.variant === "info"
+			}]
+		}), {
+			default: o(() => [i(t.$slots, "default")]),
+			_: 3
+		}, 16, ["disabled", "class"]));
+	}
+});
+//#endregion
+export { s as t };

package/dist/{MudaCalendar-f1lHTxVw.js → MudaCalendar-DzOlAhVw.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./keymap-BzfMgdJH.js";
-import { t } from "./MudaIcon-BhSsLCZx.js";
-import { t as n } from "./MudaFormInput-CI_xfpTj.js";
-import { t as r } from "./MudaPopover-BgwkVjjX.js";
+import { t } from "./MudaIcon-D_siyzw0.js";
+import { t as n } from "./MudaFormInput-BYoht_A0.js";
+import { t as r } from "./MudaPopover-BU9CWFeP.js";
 import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createTextVNode as d, createVNode as f, defineComponent as p, mergeModels as m, mergeProps as h, normalizeClass as g, openBlock as _, ref as v, renderList as y, toDisplayString as b, toRefs as x, unref as S, useModel as C, useTemplateRef as w, vModelText as T, watch as E, withCtx as D, withDirectives as O, withModifiers as k } from "vue";
 import A from "dayjs";
 import j from "dayjs/plugin/customParseFormat.js";
@@ -95,18 +95,13 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 		let { locale: t } = x(e), n = U(t);
 		return (e, t) => (_(), c("div", Y, [(_(!0), c(i, null, y(S(n), (e) => (_(), c("div", {
 			key: e.name,
-			class: g(["flex min-h-[2.5rem] min-w-[2.5rem] items-center justify-center font-bold", {
-				"text-danger": e.isWeekend,
-				"text-secondary-dark": !e.isWeekend
+			class: g(["flex min-h-10 min-w-10 items-center justify-center font-bold", {
+				"text-muda-danger": e.isWeekend,
+				"text-muda-secondary-dark": !e.isWeekend
 			}])
 		}, b(e.name), 3))), 128))]));
 	}
-}), Z = { class: "inline-flex flex-col" }, re = { class: "isolate grid grid-cols-7 gap-1" }, ie = [
-	"disabled",
-	"aria-selected",
-	"aria-current",
-	"onClick"
-], ae = ["datetime"], Q = /* @__PURE__ */ p({
+}), Z = { class: "inline-flex flex-col" }, re = { class: "isolate grid grid-cols-7 gap-1" }, ie = ["disabled", "onClick"], ae = ["datetime"], Q = /* @__PURE__ */ p({
 	__name: "MudaCalendarDays",
 	props: /*@__PURE__*/ m({
 		today: {},
@@ -131,14 +126,12 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			type: "button",
 			tabindex: "-1",
 			disabled: e.disabled || t.disabled,
-			"aria-selected": S(p)(e.value, n.value),
-			"aria-current": e.isToday ? "date" : void 0,
-			class: g(["muda-button-reset relative flex size-min w-full items-center justify-center rounded-md disabled:text-secondary-light", {
-				"text-secondary-dark hover:bg-primary-light hover:text-white": !(e.disabled || t.disabled),
-				"text-secondary-light": !e.isCurrentMonth,
-				"bg-primary text-white": S(p)(e.value, n.value),
-				"font-bold text-warning": e.isToday,
-				"after:absolute after:top-0 after:right-0 after:bottom-0 after:left-0 after:rounded-lg after:border-2 after:border-primary": t.keyboard && S(p)(e.value, r.value)
+			class: g(["muda-button-reset relative flex size-min w-full items-center justify-center rounded-md disabled:text-muda-secondary-light", {
+				"text-muda-secondary-dark hover:bg-muda-primary-light hover:text-white": !(e.disabled || t.disabled),
+				"text-muda-secondary-light": !e.isCurrentMonth,
+				"bg-muda-primary text-white": S(p)(e.value, n.value),
+				"font-bold text-muda-warning": e.isToday,
+				"after:absolute after:top-0 after:right-0 after:bottom-0 after:left-0 after:rounded-lg after:border-2 after:border-muda-primary": t.keyboard && S(p)(e.value, r.value)
 			}]),
 			onClick: k((t) => m(e), ["stop"])
 		}, [l("time", {
@@ -177,69 +170,57 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 		}]) }, [
 			l("button", {
 				type: "button",
-				class: "muda-button-reset flex items-center justify-center fill-primary hover:fill-primary-dark disabled:fill-secondary-light",
+				class: "muda-button-reset flex items-center justify-center fill-muda-primary hover:fill-muda-primary-dark disabled:fill-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Previous year",
 				onClick: r[0] ||= (e) => u("year", o.value === "years" ? -S(10) : -1)
 			}, [f(S(t), { icon: "keyboard_double_arrow_left:outlined" })], 8, oe),
 			o.value === "days" ? (_(), c("button", {
 				key: 0,
 				type: "button",
-				class: "muda-button-reset flex items-center justify-center fill-primary hover:fill-primary-dark disabled:fill-secondary-light",
+				class: "muda-button-reset flex items-center justify-center fill-muda-primary hover:fill-muda-primary-dark disabled:fill-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Previous month",
 				onClick: r[1] ||= (e) => u("month", -1)
 			}, [f(S(t), { icon: "keyboard_arrow_left:outlined" })], 8, se)) : s("", !0),
 			l("div", ce, [o.value === "days" ? (_(), c(i, { key: 0 }, [l("button", {
 				type: "button",
-				class: "muda-button-reset font-semibold text-primary hover:text-primary-dark disabled:text-secondary-light",
+				class: "muda-button-reset font-semibold text-muda-primary hover:text-muda-primary-dark disabled:text-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Choose year",
 				onClick: r[2] ||= (e) => o.value = "years"
 			}, b(p.value.format(S(R))), 9, le), l("button", {
 				type: "button",
-				class: "muda-button-reset font-semibold text-primary hover:text-primary-dark disabled:text-secondary-light",
+				class: "muda-button-reset font-semibold text-muda-primary hover:text-muda-primary-dark disabled:text-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Choose month",
 				onClick: r[3] ||= (e) => o.value = "months"
 			}, b(p.value.format(S("MMM"))), 9, ue)], 64)) : o.value === "months" ? (_(), c("button", {
 				key: 1,
 				type: "button",
-				class: "muda-button-reset font-semibold text-primary hover:text-primary-dark disabled:text-secondary-light",
+				class: "muda-button-reset font-semibold text-muda-primary hover:text-muda-primary-dark disabled:text-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Choose year",
 				onClick: r[4] ||= (e) => o.value = "years"
 			}, b(p.value.format(S(R))), 9, de)) : o.value === "years" ? (_(), c(i, { key: 2 }, [d(b(m.value), 1)], 64)) : s("", !0)]),
 			o.value === "days" ? (_(), c("button", {
 				key: 1,
 				type: "button",
-				class: "muda-button-reset flex items-center justify-center fill-primary hover:fill-primary-dark disabled:fill-secondary-light",
+				class: "muda-button-reset flex items-center justify-center fill-muda-primary hover:fill-muda-primary-dark disabled:fill-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Next month",
 				onClick: r[5] ||= (e) => u("month", 1)
 			}, [f(S(t), { icon: "keyboard_arrow_right:outlined" })], 8, fe)) : s("", !0),
 			l("button", {
 				type: "button",
-				class: "muda-button-reset flex items-center justify-center fill-primary hover:fill-primary-dark disabled:fill-secondary-light",
+				class: "muda-button-reset flex items-center justify-center fill-muda-primary hover:fill-muda-primary-dark disabled:fill-muda-secondary-light",
 				tabindex: "-1",
 				disabled: n.disabled,
-				"aria-label": "Next year",
 				onClick: r[6] ||= (e) => u("year", o.value === "years" ? S(10) : 1)
 			}, [f(S(t), { icon: "keyboard_double_arrow_right:outlined" })], 8, pe)
 		], 2));
 	}
-}), he = { class: "flex" }, ge = { class: "relative grid flex-1 grid-cols-[repeat(4,1fr)]" }, _e = [
-	"disabled",
-	"aria-selected",
-	"aria-current",
-	"onClick"
-], ve = ["datetime"], ye = /* @__PURE__ */ p({
+}), he = { class: "flex" }, ge = { class: "relative grid flex-1 grid-cols-[repeat(4,1fr)]" }, _e = ["disabled", "onClick"], ve = ["datetime"], ye = /* @__PURE__ */ p({
 	__name: "MudaCalendarMonths",
 	props: /*@__PURE__*/ m({
 		today: {},
@@ -263,12 +244,10 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			type: "button",
 			tabindex: "-1",
 			disabled: e.disabled || n.disabled,
-			"aria-selected": S(m)(e.value, r.value),
-			"aria-current": e.isToday ? "date" : void 0,
-			class: g(["muda-button-reset flex items-center justify-center rounded-md py-5 disabled:text-secondary-light", {
-				"text-secondary-dark hover:bg-primary-light hover:text-white": !(e.disabled || n.disabled),
-				"bg-primary text-white": S(m)(e.value, r.value),
-				"font-bold text-warning": e.isToday
+			class: g(["muda-button-reset flex items-center justify-center rounded-md py-5 disabled:text-muda-secondary-light", {
+				"text-muda-secondary-dark hover:bg-muda-primary-light hover:text-white": !(e.disabled || n.disabled),
+				"bg-muda-primary text-white": S(m)(e.value, r.value),
+				"font-bold text-muda-warning": e.isToday
 			}]),
 			onClick: k((t) => h(e), ["prevent"])
 		}, [l("time", {
@@ -276,12 +255,7 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			datetime: e.value
 		}, b(e.label), 9, ve)], 10, _e))), 128))])]));
 	}
-}), be = { class: "grid grid-cols-[repeat(2,1fr)]" }, xe = [
-	"disabled",
-	"aria-selected",
-	"aria-current",
-	"onClick"
-], Se = ["datetime"], Ce = /* @__PURE__ */ p({
+}), be = { class: "grid grid-cols-[repeat(2,1fr)]" }, xe = ["disabled", "onClick"], Se = ["datetime"], Ce = /* @__PURE__ */ p({
 	__name: "MudaCalendarYears",
 	props: /*@__PURE__*/ m({
 		today: {},
@@ -305,12 +279,10 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			type: "button",
 			tabindex: "-1",
 			disabled: e.disabled || n.disabled,
-			"aria-selected": S(m)(e.value, r.value),
-			"aria-current": e.isToday ? "date" : void 0,
-			class: g(["muda-button-reset flex items-center justify-center rounded-md py-3 disabled:text-secondary-light", {
-				"text-secondary-dark hover:bg-primary-light hover:text-white": !(e.disabled || n.disabled),
-				"bg-primary text-white": S(m)(e.value, r.value),
-				"font-bold text-warning": e.isToday
+			class: g(["muda-button-reset flex items-center justify-center rounded-md py-3 disabled:text-muda-secondary-light", {
+				"text-muda-secondary-dark hover:bg-muda-primary-light hover:text-white": !(e.disabled || n.disabled),
+				"bg-muda-primary text-white": S(m)(e.value, r.value),
+				"font-bold text-muda-warning": e.isToday
 			}]),
 			onClick: k((t) => h(e), ["prevent"])
 		}, [l("time", {
@@ -439,8 +411,7 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 }), Te = ["tabindex"], Ee = [
 	"min",
 	"max",
-	"disabled",
-	"aria-invalid"
+	"disabled"
 ], De = /* @__PURE__ */ p({
 	inheritAttrs: !1,
 	__name: "MudaCalendar",
@@ -472,9 +443,9 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			onBlur: r[3] ||= (e) => o.value = !1,
 			onKeydown: d,
 			ref: "root",
-			class: g(["rounded-md bg-foreground p-2 ring-1 focus:rounded-md focus:ring-2 focus:ring-primary-light focus:outline-hidden", {
-				"ring-danger": t.isInvalid,
-				"ring-secondary-light": !t.isInvalid
+			class: g(["rounded-md bg-muda-foreground p-2 ring-1 focus:rounded-md focus:ring-2 focus:ring-muda-primary-light focus:outline-hidden", {
+				"ring-muda-danger": t.isInvalid,
+				"ring-muda-secondary-light": !t.isInvalid
 			}])
 		}, [f($, {
 			modelValue: n.value,
@@ -497,7 +468,6 @@ var Y = { class: "grid grid-cols-[repeat(7,auto)]" }, X = /* @__PURE__ */ p({
 			min: s.value,
 			max: u.value,
 			disabled: t.disabled,
-			"aria-invalid": t.isInvalid || void 0,
 			class: "hidden"
 		}), null, 16, Ee), [[T, n.value]])], 42, Te));
 	}

package/dist/{MudaCard-C9geam4O.js → MudaCard-D9GQzC7B.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { createElementBlock as t, openBlock as n, renderSlot as r } from "vue";
 //#region src/components/MudaCard/MudaCard.vue
-var i = {}, a = { class: "relative rounded-lg border border-secondary-light bg-foreground p-4" };
+var i = {}, a = { class: "relative rounded-lg border border-muda-secondary-light bg-muda-foreground p-4" };
 function o(e, i) {
 	return n(), t("div", a, [r(e.$slots, "default")]);
 }

package/dist/{MudaColorPicker-Ny8v-KZR.js → MudaColorPicker-DJ7dbzzb.js}

@@ -1,8 +1,8 @@
-import { t as e } from "./MudaButton-Bw6Fw2-Y.js";
+import { t as e } from "./MudaButton-DJffOm2u.js";
 import { t } from "./keymap-BzfMgdJH.js";
-import { t as n } from "./MudaIcon-BhSsLCZx.js";
-import { t as r } from "./MudaFormInput-CI_xfpTj.js";
-import { t as i } from "./MudaPopover-BgwkVjjX.js";
+import { t as n } from "./MudaIcon-D_siyzw0.js";
+import { t as r } from "./MudaFormInput-BYoht_A0.js";
+import { t as i } from "./MudaPopover-BU9CWFeP.js";
 import { t as a } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { t as o } from "./useKeyDown-B1jmp4nA.js";
 import { createBlock as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeModels as p, mergeProps as m, normalizeStyle as h, openBlock as g, ref as _, toDisplayString as v, unref as y, useModel as b, watch as x, watchEffect as S, withCtx as C, withModifiers as w } from "vue";
@@ -57,7 +57,7 @@ var k = {
 			_: 1
 		}, 8, ["onChangePosition"])], 4));
 	}
-}), j = /*#__PURE__*/ a(A, [["__scopeId", "data-v-da1392ff"]]), M = { class: "flex flex-col gap-2" }, N = /* @__PURE__ */ f({
+}), j = /*#__PURE__*/ a(A, [["__scopeId", "data-v-2888e57a"]]), M = { class: "flex flex-col gap-2" }, N = /* @__PURE__ */ f({
 	inheritAttrs: !1,
 	__name: "MudaColorPicker",
 	props: /*@__PURE__*/ p({

package/dist/MudaDialog-voCW-SpB.js

@@ -0,0 +1,61 @@
+import { t as e } from "./keymap-BzfMgdJH.js";
+import { t } from "./useZIndex-DWnsohLZ.js";
+import { t as n } from "./useKeyDown-B1jmp4nA.js";
+import { t as r } from "./MudaFocusTrap-CGlvV_MC.js";
+import { Teleport as i, Transition as a, createBlock as o, createCommentVNode as s, createElementVNode as c, createVNode as l, defineComponent as u, mergeProps as d, normalizeStyle as f, onUnmounted as p, openBlock as m, renderSlot as h, unref as g, useModel as _, useTemplateRef as v, watch as y, withCtx as b, withModifiers as x } from "vue";
+//#region src/composables/useBodyScrollLock.ts
+var S = 0, C = "", w = (e) => {
+	let t = !1, n = () => {
+		t || typeof document > "u" || (S === 0 && (C = document.body.style.overflow, document.body.style.overflow = "hidden"), S += 1, t = !0);
+	}, r = () => {
+		!t || typeof document > "u" || (--S, t = !1, S === 0 && (document.body.style.overflow = C));
+	};
+	y(e, (e) => e ? n() : r(), { immediate: !0 }), p(r);
+}, T = { class: "fixed inset-0 w-screen overflow-y-auto py-6" }, E = { class: "flex min-h-full items-center justify-center" }, D = /* @__PURE__ */ u({
+	inheritAttrs: !1,
+	__name: "MudaDialog",
+	props: {
+		modelValue: {
+			type: Boolean,
+			required: !0
+		},
+		modelModifiers: {}
+	},
+	emits: ["update:modelValue"],
+	setup(u) {
+		let p = _(u, "modelValue"), y = v("dialog"), S = t();
+		w(p), n((t) => {
+			if (p.value) switch (t.key) {
+				case e.Escape: p.value = !1, t.preventDefault();
+			}
+		});
+		let C = (e) => {
+			y.value?.contains(e.target) || (p.value = !1);
+		};
+		return (e, t) => (m(), o(i, { to: "body" }, [l(a, {
+			"enter-active-class": "transition-opacity ease-linear duration-100",
+			"leave-active-class": "transition-opacity ease-linear duration-100",
+			"enter-from-class": "opacity-0",
+			"leave-to-class": "opacity-0"
+		}, {
+			default: b(() => [p.value ? (m(), o(g(r), {
+				key: 0,
+				role: "dialog",
+				class: "fixed inset-0 bg-gray-500/30 backdrop-blur-xs transition-opacity",
+				style: f({ zIndex: g(S) }),
+				onClickCapture: C,
+				onWheel: t[0] ||= x(() => {}, ["stop"])
+			}, {
+				default: b(() => [c("div", T, [c("div", E, [c("div", d(e.$attrs, {
+					class: "rounded-lg bg-muda-background p-4 focus:outline-hidden",
+					tabindex: "0",
+					ref: "dialog"
+				}), [h(e.$slots, "default")], 16)])])]),
+				_: 3
+			}, 8, ["style"])) : s("", !0)]),
+			_: 3
+		})]));
+	}
+});
+//#endregion
+export { D as t };

package/dist/{MudaDropdown-DJOG_m6C.js → MudaDropdown-BCue994w.js}

@@ -1,5 +1,5 @@
-import { t as e } from "./MudaIcon-BhSsLCZx.js";
-import { t } from "./MudaPopover-BgwkVjjX.js";
+import { t as e } from "./MudaIcon-D_siyzw0.js";
+import { t } from "./MudaPopover-BU9CWFeP.js";
 import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, mergeModels as l, normalizeClass as u, openBlock as d, renderList as f, renderSlot as p, toDisplayString as m, unref as h, useModel as g, useSlots as _, withCtx as v, withModifiers as y } from "vue";
 //#region src/components/MudaDropdown/MudaDropdown.vue?vue&type=script&setup=true&lang.ts
 var b = { class: "flex flex-col" }, x = ["onClick"], S = {
@@ -28,13 +28,13 @@ var b = { class: "flex flex-col" }, x = ["onClick"], S = {
 			content: v(() => [o("div", b, [(d(!0), a(n, null, f(C.items, (t, n) => (d(), a("button", {
 				key: n,
 				class: u(["muda-button-reset flex w-full cursor-pointer items-center gap-2 rounded-md px-4 py-2 text-left text-sm", {
-					"fill-secondary text-secondary hover:bg-secondary-light": t.variant === "default" || t.variant == null,
-					"fill-primary text-primary hover:bg-primary hover:fill-white hover:text-white": t.variant === "primary",
-					"fill-secondary text-secondary hover:bg-secondary hover:fill-white hover:text-white": t.variant === "secondary",
-					"fill-success text-success hover:bg-success hover:fill-white hover:text-white": t.variant === "success",
-					"fill-danger text-danger hover:bg-danger hover:fill-white hover:text-white": t.variant === "danger",
-					"fill-warning text-warning hover:bg-warning hover:fill-white hover:text-white": t.variant === "warning",
-					"fill-info text-info hover:bg-info hover:fill-white hover:text-white": t.variant === "info"
+					"fill-muda-secondary text-muda-secondary hover:bg-muda-secondary-light": t.variant === "default" || t.variant == null,
+					"fill-muda-primary text-muda-primary hover:bg-muda-primary hover:fill-white hover:text-white": t.variant === "primary",
+					"fill-muda-secondary text-muda-secondary hover:bg-muda-secondary hover:fill-white hover:text-white": t.variant === "secondary",
+					"fill-muda-success text-muda-success hover:bg-muda-success hover:fill-white hover:text-white": t.variant === "success",
+					"fill-muda-danger text-muda-danger hover:bg-muda-danger hover:fill-white hover:text-white": t.variant === "danger",
+					"fill-muda-warning text-muda-warning hover:bg-muda-warning hover:fill-white hover:text-white": t.variant === "warning",
+					"fill-muda-info text-muda-info hover:bg-muda-info hover:fill-white hover:text-white": t.variant === "info"
 				}]),
 				onClick: y((e) => D(t, n), ["prevent"])
 			}, [w.item == null ? (d(), a("span", S, [t.icon == null ? i("", !0) : (d(), r(h(e), {

package/dist/{MudaErrorBox-C0DvbAfU.js → MudaErrorBox-BvlBaVk_.js}

@@ -2,9 +2,8 @@ import { computed as e, createElementBlock as t, createElementVNode as n, define
 //#region src/components/MudaErrorBox/MudaErrorBox.vue?vue&type=script&setup=true&lang.ts
 var o = {
 	class: "flex flex-col gap-2",
-	role: "alert",
-	"aria-live": "assertive"
-}, s = { class: "text-center text-4xl font-bold text-danger" }, c = { class: "text-center text-2xl font-semibold tracking-tight text-secondary-dark" }, l = /* @__PURE__ */ r({
+	role: "alert"
+}, s = { class: "text-center text-4xl font-bold text-muda-danger" }, c = { class: "text-center text-2xl font-semibold tracking-tight text-muda-secondary-dark" }, l = /* @__PURE__ */ r({
 	__name: "MudaErrorBox",
 	props: {
 		title: { default: "Error" },

package/dist/MudaFocusTrap-CGlvV_MC.js

@@ -0,0 +1,50 @@
+import { t as e } from "./keymap-BzfMgdJH.js";
+import { createBlock as t, defineComponent as n, nextTick as r, onMounted as i, onUnmounted as a, openBlock as o, ref as s, renderSlot as c, resolveDynamicComponent as l, useTemplateRef as u, withCtx as d } from "vue";
+//#region src/components/MudaFocusTrap/useMudaFocusTrap.ts
+var f = (t) => {
+	let n = s(null), i = (e) => {
+		let t = [
+			"a[href]",
+			"button:not([disabled])",
+			"input:not([disabled])",
+			"select:not([disabled])",
+			"textarea:not([disabled])",
+			"[tabindex]:not([tabindex=\"-1\"])",
+			"[contenteditable]:not([tabindex=\"-1\"])"
+		].join(",");
+		return Array.from(e.querySelectorAll(t));
+	}, a = (n) => {
+		if (n.key !== e.Tab || !t.value) return;
+		let r = i(t.value);
+		if (r.length === 0) return;
+		let a = r[0], o = r[r.length - 1];
+		n.shiftKey ? document.activeElement === a && (o?.focus(), n.preventDefault()) : document.activeElement === o && (a?.focus(), n.preventDefault());
+	};
+	return {
+		activate: async () => {
+			if (!t.value) return;
+			n.value = document.activeElement, document.addEventListener("keydown", a), await r();
+			let e = i(t.value);
+			e.length > 0 && e[0]?.focus();
+		},
+		deactivate: () => {
+			document.removeEventListener("keydown", a), n.value?.focus();
+		}
+	};
+}, p = /* @__PURE__ */ n({
+	__name: "MudaFocusTrap",
+	props: { is: { default: "div" } },
+	setup(e) {
+		let n = e, { activate: r, deactivate: s } = f(u("trap"));
+		return i(r), a(s), (e, r) => (o(), t(l(n.is), {
+			ref: "trap",
+			tabindex: "-1",
+			role: "region"
+		}, {
+			default: d(() => [c(e.$slots, "default")]),
+			_: 3
+		}, 512));
+	}
+});
+//#endregion
+export { p as t };

package/dist/{MudaFormCheckbox-CDY-INi6.js → MudaFormCheckbox-90HcY4_2.js}

@@ -25,16 +25,16 @@ var c = /* @__PURE__ */ t({
 				n.size === "small" && "size-4 before:text-xs",
 				n.size === "medium" && "size-5 before:text-lg",
 				n.size === "large" && "size-6 before:text-xl",
-				"muda-control-reset bg-form-background",
+				"muda-control-reset bg-muda-form-background",
 				"relative shrink-0 appearance-none outline-hidden",
-				"rounded-xs border border-secondary-light text-secondary-dark",
-				"focus:ring-2 focus:ring-primary-light focus:outline-hidden",
-				"disabled:border-secondary-dark/20 disabled:text-secondary-light",
+				"rounded-xs border border-muda-secondary-light text-muda-secondary-dark",
+				"focus:ring-2 focus:ring-muda-primary-light focus:outline-hidden",
+				"disabled:border-muda-secondary-dark/20 disabled:text-muda-secondary-light",
 				"before:absolute before:top-0 before:right-0 before:bottom-0 before:left-0",
 				"before:flex before:items-center before:justify-center",
-				"before:text-sm before:font-bold before:text-primary",
+				"before:text-sm before:font-bold before:text-muda-primary",
 				"checked:before:content-[attr(data-checked)]",
-				"disabled:before:text-secondary-light"
+				"disabled:before:text-muda-secondary-light"
 			]
 		}), null, 16)), [[o, c.value]]);
 	}

package/dist/{MudaFormCombobox-CBaRBOKQ.js → MudaFormCombobox-Tm_AejmV.js}

@@ -1,16 +1,16 @@
 import { t as e } from "./keymap-BzfMgdJH.js";
-import { t } from "./MudaIcon-BhSsLCZx.js";
-import { t as n } from "./MudaFormInput-CI_xfpTj.js";
+import { t } from "./MudaIcon-D_siyzw0.js";
+import { t as n } from "./MudaFormInput-BYoht_A0.js";
 import { t as r } from "./useClickOutside-B6tdxsc3.js";
 import { t as i } from "./useZIndex-DWnsohLZ.js";
 import { t as a } from "./useKeyDown-B1jmp4nA.js";
-import { t as o } from "./MudaFormCheckbox-CDY-INi6.js";
+import { t as o } from "./MudaFormCheckbox-90HcY4_2.js";
 import { Fragment as s, Teleport as c, Transition as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createSlots as h, createTextVNode as g, createVNode as _, defineComponent as v, mergeModels as y, mergeProps as b, normalizeClass as x, normalizeStyle as S, openBlock as C, ref as w, renderList as T, renderSlot as E, toDisplayString as D, unref as O, useModel as k, useSlots as A, useTemplateRef as j, watch as M, watchEffect as N, withCtx as P, withModifiers as F } from "vue";
 import { autoUpdate as I, flip as L, offset as R, shift as z, size as B, useFloating as V } from "@floating-ui/vue";
 //#region src/components/MudaFormCombobox/MudaFormComboboxMultiple.vue?vue&type=script&setup=true&lang.ts
 var H = { class: "flex flex-col" }, U = {
 	key: 0,
-	class: "-mt-2.75 rounded-b-lg border border-secondary-light bg-form-background pt-2.5"
+	class: "-mt-2.75 rounded-b-lg border border-muda-secondary-light bg-muda-form-background pt-2.5"
 }, W = { class: "m-0 muda-no-scrollbar flex max-h-80 list-none flex-col gap-1 muda-scroll-container-v-form-background rounded-lg px-2 py-2" }, G = { class: "flex cursor-pointer items-center gap-2" }, K = /* @__PURE__ */ v({
 	inheritAttrs: !1,
 	__name: "MudaFormComboboxMultiple",
@@ -164,7 +164,7 @@ var H = { class: "flex flex-col" }, U = {
 			default: P(() => [K.value ? (C(), p("ul", {
 				key: 0,
 				ref: "list",
-				class: "m-0 max-h-52 w-max list-none overflow-auto rounded-sm bg-form-background p-0 shadow-lg",
+				class: "m-0 max-h-52 w-max list-none overflow-auto rounded-sm bg-muda-form-background p-0 shadow-lg",
 				style: S({
 					...O(Q),
 					zIndex: O(X)
@@ -173,8 +173,8 @@ var H = { class: "flex flex-col" }, U = {
 				key: `${String(t.value)}-${n}`,
 				role: "button",
 				class: x(["flex h-10 w-full cursor-pointer items-center px-2 text-base select-none", {
-					"bg-primary-light text-white": Y.value === n,
-					"bg-primary text-white": t.value === y.value
+					"bg-muda-primary-light text-white": Y.value === n,
+					"bg-muda-primary text-white": t.value === y.value
 				}]),
 				onClick: F((e) => $(n), ["prevent"])
 			}, [v.label == null ? (C(), p(s, { key: 1 }, [g(D(t.label), 1)], 64)) : E(e.$slots, "label", { option: t }, void 0, void 0, 0)], 10, J))), 128))], 4)) : f("", !0)]),

package/dist/{MudaFormField-Bt5W7NC1.js → MudaFormField-CFLLQiTa.js}

@@ -2,7 +2,7 @@ import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r
 //#region src/components/MudaFormField/MudaFormFieldErrors.vue?vue&type=script&setup=true&lang.ts
 var h = {
 	key: 0,
-	class: "m-0 list-none fill-danger p-0 text-danger"
+	class: "m-0 list-none fill-muda-danger p-0 text-muda-danger"
 }, g = /* @__PURE__ */ s({
 	__name: "MudaFormFieldErrors",
 	props: { errors: {} },
@@ -28,11 +28,11 @@ var h = {
 			"flex-row items-center gap-2": u.axis === "horizontal"
 		}]) }, {
 			default: m(() => [u.labelPosition === "before" ? (l(), i(e, { key: 0 }, [a("span", { class: c(["block", {
-				"text-secondary-dark": !p.value,
-				"text-danger": p.value
+				"text-muda-secondary-dark": !p.value,
+				"text-muda-danger": p.value
 			}]) }, [d(t.$slots, "label")], 2), d(t.$slots, "default")], 64)) : u.labelPosition === "after" ? (l(), i(e, { key: 1 }, [d(t.$slots, "default"), a("span", { class: c(["block", {
-				"text-secondary-dark": !p.value,
-				"text-danger": p.value
+				"text-muda-secondary-dark": !p.value,
+				"text-muda-danger": p.value
 			}]) }, [d(t.$slots, "label")], 2)], 64)) : r("", !0)]),
 			_: 3
 		}, 8, ["class"])), o(g, { errors: u.errors }, null, 8, ["errors"])]));

package/dist/{MudaFormInput-CI_xfpTj.js → MudaFormInput-BYoht_A0.js}

@@ -22,8 +22,8 @@ var g = { class: "relative inline-block w-full" }, _ = { class: "flex size-6 ite
 			x.before == null ? t("", !0) : (l(), n("span", {
 				key: 0,
 				class: c(["absolute inset-y-0 left-2 flex items-center", {
-					"fill-primary text-primary": !b.isInvalid,
-					"fill-danger text-danger": b.isInvalid,
+					"fill-muda-primary text-muda-primary": !b.isInvalid,
+					"fill-muda-danger text-muda-danger": b.isInvalid,
 					"pointer-events-none": !w.value,
 					"cursor-pointer": w.value
 				}]),
@@ -32,9 +32,9 @@ var g = { class: "relative inline-block w-full" }, _ = { class: "flex size-6 ite
 			h(r("input", s(e.$attrs, {
 				"onUpdate:modelValue": i[1] ||= (e) => S.value = e,
 				ref: "input",
-				class: ["muda-control-reset block h-10 w-full rounded-md border bg-form-background px-2 text-secondary-dark placeholder:text-secondary-light focus:ring-2 focus:outline-hidden disabled:border-secondary-dark/20 disabled:bg-secondary-light disabled:text-secondary-light", {
-					"border-secondary-light focus:ring-primary-light": !b.isInvalid,
-					"border-danger focus:ring-danger-light": b.isInvalid,
+				class: ["muda-control-reset block h-10 w-full rounded-md border bg-muda-form-background px-2 text-muda-secondary-dark placeholder:text-muda-secondary-light focus:ring-2 focus:outline-hidden disabled:border-muda-secondary-dark/20 disabled:bg-muda-secondary-light disabled:text-muda-secondary-light", {
+					"border-muda-secondary-light focus:ring-muda-primary-light": !b.isInvalid,
+					"border-muda-danger focus:ring-muda-danger-light": b.isInvalid,
 					"pl-9": x.before != null,
 					"pr-9": x.after != null
 				}]
@@ -42,8 +42,8 @@ var g = { class: "relative inline-block w-full" }, _ = { class: "flex size-6 ite
 			x.after == null ? t("", !0) : (l(), n("span", {
 				key: 1,
 				class: c(["absolute inset-y-0 right-2 flex items-center", {
-					"fill-primary text-primary": !b.isInvalid,
-					"fill-danger text-danger": b.isInvalid,
+					"fill-muda-primary text-muda-primary": !b.isInvalid,
+					"fill-muda-danger text-muda-danger": b.isInvalid,
 					"pointer-events-none": !T.value,
 					"cursor-pointer": T.value
 				}]),

package/dist/{MudaFormRadio-DOXXv3mT.js → MudaFormRadio-B-1viZTW.js}

@@ -13,7 +13,7 @@ var s = /* @__PURE__ */ t({
 		return (t, i) => o((r(), e("input", n(t.$attrs, {
 			"onUpdate:modelValue": i[0] ||= (e) => s.value = e,
 			type: "radio",
-			class: "muda-control-reset h-4 w-4 bg-form-background text-primary focus:ring-primary"
+			class: "muda-control-reset h-4 w-4 bg-muda-form-background text-muda-primary focus:ring-muda-primary"
 		}), null, 16)), [[a, s.value]]);
 	}
 });