@mudakit/ui 0.1.0

package/dist/MudaColorPicker-Ny8v-KZR.js

@@ -0,0 +1,134 @@
+import { t as e } from "./MudaButton-Bw6Fw2-Y.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 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";
+import { ColorPickerCanvas as T, ColorPickerHueCursor as E, ColorPickerSaturationCursor as D, useColorPicker as O } from "@wattanx/vue-color-picker";
+//#region src/common/components.ts
+var k = {
+	small: 120,
+	medium: 180,
+	large: 240
+}, A = /*@__PURE__*/ f({
+	__name: "MudaColorPickerControl",
+	props: {
+		size: { default: k.medium },
+		initialColor: { default: "#cccccc" }
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, { onMoveHue: i, onMoveSaturation: a, selfColor: o, saturationPosition: s, huePosition: l } = O({
+			initialColor: n.initialColor,
+			width: n.size,
+			height: n.size
+		});
+		return S(() => {
+			r("change", o.value.hex);
+		}), (e, t) => (g(), c("div", {
+			class: "flex flex-col gap-4",
+			style: h({ width: `${n.size}px` })
+		}, [d(y(T), {
+			class: "color-picker-saturation relative w-full rounded-lg select-none",
+			style: h({
+				backgroundColor: `hsl(${y(o).hsv.h}, 100%, 50%)`,
+				height: `${n.size}px`
+			}),
+			onChangePosition: y(a)
+		}, {
+			default: C(() => [d(y(D), {
+				class: "absolute h-4 w-4 -translate-x-2 -translate-y-2 rounded-full border-2 border-white shadow-xs shadow-gray-400",
+				"saturation-position": y(s),
+				hex: y(o).hex
+			}, null, 8, ["saturation-position", "hex"])]),
+			_: 1
+		}, 8, ["style", "onChangePosition"]), d(y(T), {
+			class: "color-picker-hue relative h-4 w-full rounded-lg select-none",
+			onChangePosition: y(i)
+		}, {
+			default: C(() => [d(y(E), {
+				position: y(l),
+				hue: y(o).hsv.h,
+				direction: "horizontal",
+				class: "absolute h-4 w-4 -translate-x-2 rounded-full border-2 border-white shadow-xs shadow-gray-400"
+			}, null, 8, ["position", "hue"])]),
+			_: 1
+		}, 8, ["onChangePosition"])], 4));
+	}
+}), j = /*#__PURE__*/ a(A, [["__scopeId", "data-v-da1392ff"]]), M = { class: "flex flex-col gap-2" }, N = /* @__PURE__ */ f({
+	inheritAttrs: !1,
+	__name: "MudaColorPicker",
+	props: /*@__PURE__*/ p({
+		size: { default: "medium" },
+		buttonLabel: {},
+		disabled: { type: Boolean },
+		appendToBody: { type: Boolean },
+		isInvalid: { type: Boolean }
+	}, {
+		modelValue: { default: "#007bff" },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(a) {
+		let c = a, f = b(a, "modelValue"), p = _(), S = _(f.value), T = _(!1);
+		x(f, (e) => {
+			T.value || (S.value = e);
+		}), o((e) => {
+			if (T.value) switch (e.key) {
+				case t.Escape: T.value = !1, p.value?.input?.blur();
+			}
+		});
+		let E = () => {
+			f.value = S.value, T.value = !1;
+		};
+		return (t, a) => (g(), s(y(i), {
+			modelValue: T.value,
+			"onUpdate:modelValue": a[4] ||= (e) => T.value = e,
+			placement: "bottom-start",
+			"append-to-body": c.appendToBody
+		}, {
+			content: C(() => [l("div", M, [(g(), s(j, {
+				key: c.size,
+				"initial-color": f.value,
+				size: y(k)[c.size],
+				onChange: a[3] ||= (e) => S.value = e
+			}, null, 8, ["initial-color", "size"])), d(y(e), {
+				type: "button",
+				variant: "primary",
+				size: "small",
+				onClick: w(E, ["stop"]),
+				style: h({ backgroundColor: S.value })
+			}, {
+				default: C(() => [u(v(c.buttonLabel ?? S.value), 1)]),
+				_: 1
+			}, 8, ["style"])])]),
+			default: C(() => [d(y(r), m({
+				ref_key: "inputRef",
+				ref: p
+			}, t.$attrs, {
+				modelValue: f.value,
+				"onUpdate:modelValue": a[0] ||= (e) => f.value = e,
+				disabled: c.disabled,
+				"is-invalid": c.isInvalid,
+				readonly: "",
+				onFocus: a[1] ||= (e) => T.value = !0,
+				"onClick:before": a[2] ||= (e) => T.value = !0
+			}), {
+				before: C(() => [d(y(n), {
+					icon: "palette:outlined",
+					color: f.value
+				}, null, 8, ["color"])]),
+				_: 1
+			}, 16, [
+				"modelValue",
+				"disabled",
+				"is-invalid"
+			])]),
+			_: 1
+		}, 8, ["modelValue", "append-to-body"]));
+	}
+});
+//#endregion
+export { j as n, N as t };

package/dist/MudaDialog-C6dOmY_K.js

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

package/dist/MudaDropdown-DJOG_m6C.js

@@ -0,0 +1,54 @@
+import { t as e } from "./MudaIcon-BhSsLCZx.js";
+import { t } from "./MudaPopover-BgwkVjjX.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 = {
+	key: 0,
+	class: "flex items-center gap-2"
+}, C = /* @__PURE__ */ c({
+	__name: "MudaDropdown",
+	props: /*@__PURE__*/ l({ items: {} }, {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ l(["action"], ["update:modelValue"]),
+	setup(c, { emit: l }) {
+		let C = c, w = _(), T = l, E = g(c, "modelValue"), D = (e, t) => {
+			E.value = !1, T("action", e, t);
+		};
+		return (c, l) => (d(), r(h(t), {
+			modelValue: E.value,
+			"onUpdate:modelValue": l[0] ||= (e) => E.value = e,
+			placement: "bottom-start",
+			"append-to-body": ""
+		}, {
+			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"
+				}]),
+				onClick: y((e) => D(t, n), ["prevent"])
+			}, [w.item == null ? (d(), a("span", S, [t.icon == null ? i("", !0) : (d(), r(h(e), {
+				key: 0,
+				icon: t.icon,
+				size: "small"
+			}, null, 8, ["icon"])), s(" " + m(t.label), 1)])) : p(c.$slots, "item", {
+				item: t,
+				index: n
+			}, void 0, void 0, 1)], 10, x))), 128))])]),
+			default: v(() => [p(c.$slots, "default")]),
+			_: 3
+		}, 8, ["modelValue"]));
+	}
+});
+//#endregion
+export { C as t };

package/dist/MudaErrorBox-C0DvbAfU.js

@@ -0,0 +1,28 @@
+import { computed as e, createElementBlock as t, createElementVNode as n, defineComponent as r, openBlock as i, toDisplayString as a } from "vue";
+//#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({
+	__name: "MudaErrorBox",
+	props: {
+		title: { default: "Error" },
+		error: {}
+	},
+	setup(r) {
+		let l = r, u = e(() => {
+			if (l.error instanceof Error) return l.error.message;
+			if (l.error == null) return "Unknown error";
+			if (typeof l.error == "string") return l.error;
+			try {
+				return JSON.stringify(l.error) ?? String(l.error);
+			} catch {
+				return String(l.error);
+			}
+		});
+		return (e, r) => (i(), t("div", o, [n("h1", s, a(l.title), 1), n("h2", c, a(u.value), 1)]));
+	}
+});
+//#endregion
+export { l as t };

package/dist/MudaFormCheckbox-CDY-INi6.js

@@ -0,0 +1,43 @@
+import { createElementBlock as e, defineComponent as t, mergeModels as n, mergeProps as r, openBlock as i, useModel as a, vModelCheckbox as o, withDirectives as s } from "vue";
+//#endregion
+//#region src/components/MudaFormCheckbox/MudaFormCheckbox.vue
+var c = /* @__PURE__ */ t({
+	__name: "MudaFormCheckbox",
+	props: /*@__PURE__*/ n({ size: { default: "medium" } }, {
+		modelValue: {
+			type: [
+				Boolean,
+				Array,
+				null
+			],
+			default: void 0
+		},
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(t) {
+		let n = t, c = a(t, "modelValue");
+		return (t, a) => s((i(), e("input", r(t.$attrs, {
+			"onUpdate:modelValue": a[0] ||= (e) => c.value = e,
+			type: "checkbox",
+			"data-checked": "✓",
+			class: [
+				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",
+				"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",
+				"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",
+				"checked:before:content-[attr(data-checked)]",
+				"disabled:before:text-secondary-light"
+			]
+		}), null, 16)), [[o, c.value]]);
+	}
+});
+//#endregion
+export { c as t };

package/dist/MudaFormCombobox-CBaRBOKQ.js

@@ -0,0 +1,186 @@
+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 "./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 { 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"
+}, 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",
+	props: /*@__PURE__*/ y({
+		options: {},
+		placeholder: {},
+		disabled: { type: Boolean }
+	}, {
+		modelValue: { default: () => [] },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(e) {
+		let r = e, i = A(), a = k(e, "modelValue"), c = w(""), l = u(() => {
+			let e = c.value.trim().toLowerCase();
+			return e === "" ? r.options : r.options.filter((t) => t.label.toLowerCase().includes(e));
+		}), h = () => {
+			c.value.length > 0 ? c.value = "" : a.value = [];
+		};
+		return (e, u) => (C(), p("div", H, [_(O(n), b(e.$attrs, {
+			modelValue: c.value,
+			"onUpdate:modelValue": u[0] ||= (e) => c.value = e,
+			placeholder: r.placeholder,
+			"onClick:after": h,
+			disabled: r.disabled
+		}), {
+			after: P(() => [c.value.length > 0 ? (C(), d(O(t), {
+				key: 0,
+				icon: "close:outlined"
+			})) : a.value.length > 0 ? (C(), p(s, { key: 1 }, [g(D(a.value.length) + " ", 1), _(O(t), { icon: "close:outlined" })], 64)) : f("", !0)]),
+			_: 1
+		}, 16, [
+			"modelValue",
+			"placeholder",
+			"disabled"
+		]), !r.disabled && l.value.length > 0 ? (C(), p("div", U, [m("ul", W, [(C(!0), p(s, null, T(l.value, (t) => (C(), p("li", { key: t.value }, [m("label", G, [_(O(o), {
+			modelValue: a.value,
+			"onUpdate:modelValue": u[1] ||= (e) => a.value = e,
+			size: "small",
+			value: t.value,
+			disabled: r.disabled
+		}, null, 8, [
+			"modelValue",
+			"value",
+			"disabled"
+		]), i.label == null ? (C(), p(s, { key: 1 }, [g(D(t.label), 1)], 64)) : E(e.$slots, "label", { option: t }, void 0, void 0, 0)])]))), 128))])])) : f("", !0)]));
+	}
+}), q = {
+	ref: "root",
+	class: "relative"
+}, J = ["onClick"], Y = /* @__PURE__ */ v({
+	__name: "MudaFormComboboxSingle",
+	props: /*@__PURE__*/ y({
+		options: {},
+		placeholder: {},
+		disabled: { type: Boolean },
+		appendToBody: { type: Boolean },
+		isInvalid: { type: Boolean }
+	}, {
+		modelValue: { default: void 0 },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(o) {
+		let m = o, v = A(), y = k(o, "modelValue"), H = w(m.options.find(({ value: e }) => e === y.value)?.label ?? ""), U = j("root"), W = j("list"), G = w(), K = w(!1), Y = w(null), X = i(), Z = u(() => {
+			let e = H.value.trim().toLowerCase();
+			return e === "" ? m.options : m.options.filter((t) => t.label.toLowerCase().includes(e));
+		}), { floatingStyles: Q } = V(U, W, {
+			whileElementsMounted: I,
+			transform: !1,
+			placement: "bottom-start",
+			strategy: "absolute",
+			middleware: [
+				R(0),
+				L(),
+				z({ padding: 5 }),
+				B({ apply({ elements: e }) {
+					Object.assign(e.floating.style, { minWidth: `${e.reference.getBoundingClientRect().width}px` });
+				} })
+			]
+		}), $ = (e) => {
+			let t = Z.value[e];
+			t != null && (H.value = t.label, y.value = t.value, K.value = !1);
+		}, ee = (e) => {
+			e.preventDefault(), H.value = "", y.value = void 0;
+		};
+		return r([U, W], () => {
+			K.value &&= !1;
+		}), a((t) => {
+			if (K.value && !t.isComposing) switch (t.key) {
+				case e.Enter:
+					Y.value != null && ($(Y.value), t.preventDefault());
+					break;
+				case e.Escape:
+					K.value = !1;
+					break;
+				case e.ArrowDown:
+					if (Z.value.length === 0) {
+						Y.value = null;
+						break;
+					}
+					Y.value = Y.value == null ? 0 : (Y.value + 1) % Z.value.length, t.preventDefault();
+					break;
+				case e.ArrowUp:
+					if (Z.value.length === 0) {
+						Y.value = null;
+						break;
+					}
+					Y.value = Y.value == null ? Z.value.length - 1 : (Y.value + Z.value.length - 1) % Z.value.length, t.preventDefault();
+			}
+		}), N(() => {
+			Y.value != null && W.value?.children[Y.value]?.scrollIntoView({
+				block: "center",
+				behavior: "smooth"
+			});
+		}), M(Z, (e) => {
+			Y.value = K.value && e.length > 0 ? 0 : null;
+		}), M(K, (e) => {
+			e || G.value?.input?.blur(), Y.value = e && Z.value.length > 0 ? 0 : null;
+		}), M([y, () => m.options], ([e]) => {
+			H.value = m.options.find(({ value: t }) => t === e)?.label ?? "";
+		}, { deep: !0 }), (e, r) => (C(), p("div", q, [_(O(n), b(e.$attrs, {
+			modelValue: H.value,
+			"onUpdate:modelValue": r[0] ||= (e) => H.value = e,
+			ref_key: "inputRef",
+			ref: G,
+			onFocus: r[1] ||= (e) => K.value = !0,
+			"onClick:after": ee,
+			disabled: m.disabled,
+			placeholder: m.placeholder,
+			"is-invalid": m.isInvalid
+		}), h({ _: 2 }, [H.value.length > 0 ? {
+			name: "after",
+			fn: P(() => [_(O(t), { icon: "close:outlined" })]),
+			key: "0"
+		} : void 0]), 1040, [
+			"modelValue",
+			"disabled",
+			"placeholder",
+			"is-invalid"
+		]), m.disabled ? f("", !0) : (C(), d(c, {
+			key: 0,
+			to: "body",
+			disabled: !m.appendToBody
+		}, [_(l, {
+			"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: 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",
+				style: S({
+					...O(Q),
+					zIndex: O(X)
+				})
+			}, [(C(!0), p(s, null, T(Z.value, (t, n) => (C(), p("li", {
+				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
+				}]),
+				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)]),
+			_: 3
+		})], 8, ["disabled"]))], 512));
+	}
+});
+//#endregion
+export { K as n, Y as t };

package/dist/MudaFormField-Bt5W7NC1.js

@@ -0,0 +1,42 @@
+import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, normalizeClass as c, openBlock as l, renderList as u, renderSlot as d, resolveDynamicComponent as f, toDisplayString as p, withCtx as m } from "vue";
+//#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"
+}, g = /* @__PURE__ */ s({
+	__name: "MudaFormFieldErrors",
+	props: { errors: {} },
+	setup(t) {
+		let n = t;
+		return (t, a) => n.errors && n.errors.length > 0 ? (l(), i("ul", h, [(l(!0), i(e, null, u(n.errors, (e, t) => (l(), i("li", {
+			key: `${e.message}-${t}`,
+			class: "text-xs wrap-break-word"
+		}, p(e.message), 1))), 128))])) : r("", !0);
+	}
+}), _ = { class: "flex flex-col gap-2" }, v = /* @__PURE__ */ s({
+	__name: "MudaFormField",
+	props: {
+		axis: { default: "vertical" },
+		errors: {},
+		labelPosition: { default: "before" },
+		as: { default: "label" }
+	},
+	setup(s) {
+		let u = s, p = t(() => u.errors && u.errors.length > 0);
+		return (t, s) => (l(), i("div", _, [(l(), n(f(u.as), { class: c(["flex cursor-pointer text-sm leading-6 font-medium", {
+			"flex-col gap-1": u.axis === "vertical",
+			"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
+			}]) }, [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
+			}]) }, [d(t.$slots, "label")], 2)], 64)) : r("", !0)]),
+			_: 3
+		}, 8, ["class"])), o(g, { errors: u.errors }, null, 8, ["errors"])]));
+	}
+});
+//#endregion
+export { g as n, v as t };

package/dist/MudaFormInput-CI_xfpTj.js

@@ -0,0 +1,56 @@
+import { computed as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, defineComponent as i, getCurrentInstance as a, mergeModels as o, mergeProps as s, normalizeClass as c, openBlock as l, renderSlot as u, useModel as d, useSlots as f, useTemplateRef as p, vModelDynamic as m, withDirectives as h } from "vue";
+//#region src/components/MudaFormInput/MudaFormInput.vue?vue&type=script&setup=true&lang.ts
+var g = { class: "relative inline-block w-full" }, _ = { class: "flex size-6 items-center justify-center" }, v = { class: "flex size-6 items-center justify-center" }, y = /* @__PURE__ */ i({
+	inheritAttrs: !1,
+	__name: "MudaFormInput",
+	props: /*@__PURE__*/ o({ isInvalid: { type: Boolean } }, {
+		modelValue: {},
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ o(["click:before", "click:after"], ["update:modelValue"]),
+	setup(i, { expose: o, emit: y }) {
+		let b = i, x = f(), S = d(i, "modelValue"), C = y;
+		o({ input: p("input") });
+		let w = e(() => {
+			let e = a()?.vnode.props;
+			return e != null && e["onClick:before"] != null;
+		}), T = e(() => {
+			let e = a()?.vnode.props;
+			return e != null && e["onClick:after"] != null;
+		});
+		return (e, i) => (l(), n("span", g, [
+			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,
+					"pointer-events-none": !w.value,
+					"cursor-pointer": w.value
+				}]),
+				onClick: i[0] ||= (e) => C("click:before", e)
+			}, [r("span", _, [u(e.$slots, "before")])], 2)),
+			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,
+					"pl-9": x.before != null,
+					"pr-9": x.after != null
+				}]
+			}), null, 16), [[m, S.value]]),
+			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,
+					"pointer-events-none": !T.value,
+					"cursor-pointer": T.value
+				}]),
+				onClick: i[2] ||= (e) => C("click:after", e)
+			}, [r("span", v, [u(e.$slots, "after")])], 2))
+		]));
+	}
+});
+//#endregion
+export { y as t };

package/dist/MudaFormRadio-DOXXv3mT.js

@@ -0,0 +1,21 @@
+import { createElementBlock as e, defineComponent as t, mergeProps as n, openBlock as r, useModel as i, vModelRadio as a, withDirectives as o } from "vue";
+//#endregion
+//#region src/components/MudaFormRadio/MudaFormRadio.vue
+var s = /* @__PURE__ */ t({
+	__name: "MudaFormRadio",
+	props: {
+		modelValue: {},
+		modelModifiers: {}
+	},
+	emits: ["update:modelValue"],
+	setup(t) {
+		let s = i(t, "modelValue");
+		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"
+		}), null, 16)), [[a, s.value]]);
+	}
+});
+//#endregion
+export { s as t };