@iaclinical/components 1.0.7 → 1.0.9

package/dist/iaclinical-components.js

@@ -1,4 +1,4 @@
-import { defineComponent as L, computed as g, createElementBlock as o, openBlock as s, normalizeClass as b, createElementVNode as a, createCommentVNode as c, renderSlot as C, toDisplayString as w, createBlock as q, Teleport as X, createVNode as G, Transition as Q, withCtx as U, withModifiers as E, createTextVNode as K, ref as V, normalizeStyle as W, onMounted as ee, onUnmounted as te, watch as Y, nextTick as J, Fragment as H, renderList as A, resolveDynamicComponent as Z, withDirectives as se, vModelText as oe } from "vue";
+import { defineComponent as S, computed as p, createElementBlock as o, openBlock as s, normalizeClass as v, createElementVNode as a, createCommentVNode as c, renderSlot as C, toDisplayString as w, createBlock as q, Teleport as X, createVNode as G, Transition as Q, withCtx as U, withModifiers as H, createTextVNode as K, ref as j, normalizeStyle as W, onMounted as ee, onUnmounted as te, watch as Y, nextTick as J, Fragment as F, renderList as A, resolveDynamicComponent as Z, withDirectives as se, vModelText as oe } from "vue";
 const le = { class: "flex items-center gap-4" }, ae = {
   key: 1,
   class: "text-lg font-bold text-primary-50 font-poppins"
@@ -8,7 +8,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }, ie = { class: "flex items-center gap-3" }, de = {
   key: 0,
   class: "text-lg font-bold text-primary-50 font-poppins"
-}, ue = /* @__PURE__ */ L({
+}, ue = /* @__PURE__ */ S({
   __name: "AppBar",
   props: {
     title: { default: "" },
@@ -20,8 +20,8 @@ const le = { class: "flex items-center gap-4" }, ae = {
     height: { default: "md" }
   },
   emits: ["toggle-menu"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = g(() => {
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = p(() => {
       const d = "flex items-center justify-between px-6 z-50", r = {
         default: "bg-primary-700 text-primary-50",
         dark: "bg-secondary-900 text-white",
@@ -40,7 +40,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ].join(" ");
     });
     return (d, r) => (s(), o("header", {
-      class: b(n.value)
+      class: v(n.value)
     }, [
       a("div", le, [
         t.showMenuButton ? (s(), o("button", {
@@ -77,15 +77,15 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ])
     ], 2));
   }
-}), R = (t, v) => {
+}), R = (t, b) => {
   const e = t.__vccOpts || t;
-  for (const [u, n] of v)
+  for (const [u, n] of b)
     e[u] = n;
   return e;
 }, Ht = /* @__PURE__ */ R(ue, [["__scopeId", "data-v-883474b5"]]), ce = ["type", "disabled", "aria-label"], fe = {
   key: 0,
   class: "absolute top-0 right-0 inline-flex items-center justify-center px-1.5 py-0.5 text-xs font-bold leading-none text-white transform translate-x-1/2 -translate-y-1/2 bg-danger-600 rounded-full min-w-[1.25rem]"
-}, Ft = /* @__PURE__ */ L({
+}, Ft = /* @__PURE__ */ S({
   __name: "Button",
   props: {
     variant: { default: "primary" },
@@ -95,11 +95,12 @@ const le = { class: "flex items-center gap-4" }, ae = {
     disabled: { type: Boolean, default: !1 },
     badge: { default: 0 },
     ariaLabel: { default: "" },
-    textColor: { default: void 0 }
+    textColor: { default: void 0 },
+    textColorHover: { default: void 0 }
   },
   emits: ["click"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = g(() => e.variant === "icon"), d = g(() => e.badge > 99 ? "99+" : e.badge.toString()), r = g(() => {
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = p(() => e.variant === "icon"), d = p(() => e.badge > 99 ? "99+" : e.badge.toString()), r = p(() => {
       const i = "inline-flex items-center justify-center font-semibold tracking-wide transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", y = {
         primary: "bg-primary-500 text-white hover:bg-primary-600 active:bg-primary-700 focus-visible:ring-primary-700",
         secondary: "bg-secondary-200 text-secondary-900 hover:bg-secondary-300 focus-visible:ring-secondary-500",
@@ -112,20 +113,23 @@ const le = { class: "flex items-center gap-4" }, ae = {
         sm: n.value ? "p-1.5" : "h-8 px-3 text-sm",
         md: n.value ? "p-2" : "h-10 px-4 text-base",
         lg: n.value ? "p-3" : "h-12 px-6 text-lg"
-      }, j = {
+      }, L = {
         full: "rounded-full",
         xl: "rounded-2xl",
         lg: "rounded-xl",
         md: "rounded-lg",
         sm: "rounded-md",
         none: "rounded-none"
-      }, S = e.textColor ? e.textColor : "";
-      return `${i} ${y[e.variant]} ${x[e.size]} ${j[e.radius]} ${S}`;
+      }, D = e.textColor ? e.textColor : "", _ = p(() => {
+        var M, O;
+        return e.textColorHover ? e.textColorHover : (M = e.textColor) != null && M.includes("white") || (O = e.textColor) != null && O.includes("50") ? "hover:text-black" : "";
+      });
+      return `${i} ${y[e.variant]} ${x[e.size]} ${L[e.radius]} ${D} ${_.value}`;
     }), f = (i) => {
       e.disabled || u("click", i);
     };
     return (i, y) => (s(), o("button", {
-      class: b(r.value),
+      class: v(r.value),
       type: t.type,
       disabled: t.disabled,
       onClick: f,
@@ -141,7 +145,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }, ge = { class: "px-6 py-4" }, he = {
   key: 1,
   class: "border-t border-gray-100 px-6 py-4 bg-gray-50"
-}, Pt = /* @__PURE__ */ L({
+}, Pt = /* @__PURE__ */ S({
   __name: "Card",
   props: {
     shadow: { default: "md" },
@@ -149,7 +153,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
     bordered: { type: Boolean, default: !1 }
   },
   setup(t) {
-    const v = t, e = {
+    const b = t, e = {
       none: "",
       sm: "shadow-sm",
       md: "shadow",
@@ -162,14 +166,14 @@ const le = { class: "flex items-center gap-4" }, ae = {
       lg: "rounded-lg",
       xl: "rounded-xl",
       full: "rounded-full"
-    }, n = g(() => [
+    }, n = p(() => [
       "w-full bg-white",
-      e[v.shadow],
-      u[v.rounded],
-      v.bordered ? "border border-gray-200" : ""
+      e[b.shadow],
+      u[b.rounded],
+      b.bordered ? "border border-gray-200" : ""
     ]);
     return (d, r) => (s(), o("div", {
-      class: b(n.value)
+      class: v(n.value)
     }, [
       d.$slots.header ? (s(), o("div", pe, [
         C(d.$slots, "header")
@@ -182,10 +186,10 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ])) : c("", !0)
     ], 2));
   }
-}), be = { class: "flex items-center justify-between border-b border-gray-100 px-8 py-6" }, ve = { class: "text-xl font-semibold text-gray-900" }, ye = { class: "px-8 py-6" }, xe = {
+}), ve = { class: "flex items-center justify-between border-b border-gray-100 px-8 py-6" }, be = { class: "text-xl font-semibold text-gray-900" }, ye = { class: "px-8 py-6" }, xe = {
   key: 0,
   class: "border-t border-gray-100 px-8 py-6 bg-gray-50"
-}, me = /* @__PURE__ */ L({
+}, me = /* @__PURE__ */ S({
   __name: "Dialog",
   props: {
     modelValue: { type: Boolean, default: !1 },
@@ -193,8 +197,8 @@ const le = { class: "flex items-center gap-4" }, ae = {
     closeOnBackdrop: { type: Boolean, default: !0 }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = g({
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = p({
       get: () => e.modelValue,
       set: (f) => u("update:modelValue", f)
     }), d = () => {
@@ -212,11 +216,11 @@ const le = { class: "flex items-center gap-4" }, ae = {
           }, [
             a("div", {
               class: "relative w-full max-w-2xl rounded-lg bg-white shadow-xl",
-              onClick: i[0] || (i[0] = E(() => {
+              onClick: i[0] || (i[0] = H(() => {
               }, ["stop"]))
             }, [
-              a("div", be, [
-                a("h2", ve, [
+              a("div", ve, [
+                a("h2", be, [
                   C(f.$slots, "title", {}, () => [
                     K(w(t.title), 1)
                   ], !0)
@@ -267,7 +271,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }, Se = {
   key: 2,
   class: "text-sm text-danger-500 mt-2"
-}, At = /* @__PURE__ */ L({
+}, At = /* @__PURE__ */ S({
   __name: "FileUpload",
   props: {
     modelValue: { default: null },
@@ -283,19 +287,20 @@ const le = { class: "flex items-center gap-4" }, ae = {
     maxSize: { default: void 0 }
   },
   emits: ["update:modelValue", "change", "error"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = V(null), d = V(!1), r = V(e.modelValue), f = V(""), i = g(() => ({
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = j(null), d = j(!1), r = j(e.modelValue), f = j(""), i = p(() => ({
       sm: "w-20 h-20",
       md: "w-32 h-32",
-      lg: "w-48 h-48"
+      lg: "w-48 h-48",
+      xl: "w-64 h-64"
     })[e.illustrationSize]), y = () => {
       var $;
       ($ = n.value) == null || $.click();
     }, x = () => {
       e.disabled || y();
-    }, j = ($) => {
+    }, L = ($) => {
       e.disabled || (d.value = !0);
-    }, S = () => {
+    }, D = () => {
       d.value = !1;
     }, _ = ($) => {
       if (f.value = "", e.maxSize && $.size > e.maxSize) {
@@ -303,31 +308,31 @@ const le = { class: "flex items-center gap-4" }, ae = {
         return f.value = `El archivo excede el tamaño máximo de ${B}MB`, u("error", f.value), !1;
       }
       return !0;
+    }, M = ($) => {
+      var I;
+      const z = (I = $.target.files) == null ? void 0 : I[0];
+      z && _(z) && (r.value = z, u("update:modelValue", z), u("change", z));
     }, O = ($) => {
-      var D;
-      const T = (D = $.target.files) == null ? void 0 : D[0];
-      T && _(T) && (r.value = T, u("update:modelValue", T), u("change", T));
-    }, F = ($) => {
-      var T;
+      var z;
       d.value = !1;
-      const B = (T = $.dataTransfer) == null ? void 0 : T.files[0];
+      const B = (z = $.dataTransfer) == null ? void 0 : z.files[0];
       B && _(B) && (r.value = B, u("update:modelValue", B), u("change", B));
     }, P = () => {
       r.value = null, f.value = "", n.value && (n.value.value = ""), u("update:modelValue", null), u("change", null);
-    }, I = ($) => {
+    }, E = ($) => {
       if ($ === 0) return "0 Bytes";
-      const B = 1024, T = ["Bytes", "KB", "MB", "GB"], D = Math.floor(Math.log($) / Math.log(B));
-      return Math.round($ / Math.pow(B, D) * 100) / 100 + " " + T[D];
+      const B = 1024, z = ["Bytes", "KB", "MB", "GB"], I = Math.floor(Math.log($) / Math.log(B));
+      return Math.round($ / Math.pow(B, I) * 100) / 100 + " " + z[I];
     };
     return ($, B) => (s(), o("div", {
-      class: b(["relative border-2 border-dashed rounded-lg p-8 transition-colors", [
+      class: v(["relative border-2 border-dashed rounded-lg p-8 transition-colors", [
         d.value ? "border-primary-700 bg-primary-50" : "border-gray-300 bg-white hover:border-primary-500",
         t.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
       ]]),
       onClick: x,
-      onDragover: E(j, ["prevent"]),
-      onDragleave: E(S, ["prevent"]),
-      onDrop: E(F, ["prevent"])
+      onDragover: H(L, ["prevent"]),
+      onDragleave: H(D, ["prevent"]),
+      onDrop: H(O, ["prevent"])
     }, [
       a("input", {
         ref_key: "fileInput",
@@ -337,11 +342,11 @@ const le = { class: "flex items-center gap-4" }, ae = {
         multiple: t.multiple,
         disabled: t.disabled,
         class: "hidden",
-        onChange: O
+        onChange: M
       }, null, 40, ke),
       a("div", we, [
         a("div", {
-          class: b([i.value, "flex items-center justify-center"])
+          class: v([i.value, "flex items-center justify-center"])
         }, [
           t.illustration ? (s(), o("img", {
             key: 0,
@@ -366,7 +371,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
         r.value ? (s(), o("div", {
           key: 0,
           class: "w-full max-w-md bg-gray-50 rounded-lg p-4 flex items-center justify-between",
-          onClick: B[0] || (B[0] = E(() => {
+          onClick: B[0] || (B[0] = H(() => {
           }, ["stop"]))
         }, [
           a("div", ze, [
@@ -385,12 +390,12 @@ const le = { class: "flex items-center gap-4" }, ae = {
             ], -1)),
             a("div", Me, [
               a("p", Ve, w(r.value.name), 1),
-              a("p", je, w(I(r.value.size)), 1)
+              a("p", je, w(E(r.value.size)), 1)
             ])
           ]),
           t.disabled ? c("", !0) : (s(), o("button", {
             key: 0,
-            onClick: E(P, ["stop"]),
+            onClick: H(P, ["stop"]),
             class: "ml-3 text-gray-400 hover:text-danger-500 transition-colors"
           }, [...B[3] || (B[3] = [
             a("svg", {
@@ -414,7 +419,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }), De = ["stroke-width"], Oe = {
   class: "w-full h-full rounded-lg overflow-hidden",
   style: { "background-color": "#f7f7f7" }
-}, Ie = /* @__PURE__ */ L({
+}, Ie = /* @__PURE__ */ S({
   __name: "Loader",
   props: {
     type: { default: "circular" },
@@ -425,7 +430,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
     progress: { default: void 0 }
   },
   setup(t) {
-    const v = t, e = {
+    const b = t, e = {
       primary: "text-primary-700",
       secondary: "text-secondary-500",
       success: "text-success-500",
@@ -439,10 +444,10 @@ const le = { class: "flex items-center gap-4" }, ae = {
       warning: "bg-warning-500",
       danger: "bg-danger-500",
       info: "bg-info-500"
-    }, n = g(() => [e[v.color]]), d = g(() => [u[v.color]]);
+    }, n = p(() => [e[b.color]]), d = p(() => [u[b.color]]);
     return (r, f) => t.type === "circular" ? (s(), o("div", {
       key: 0,
-      class: b(n.value)
+      class: v(n.value)
     }, [
       (s(), o("svg", {
         class: "animate-spin",
@@ -471,7 +476,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
     }, [
       a("div", Oe, [
         a("div", {
-          class: b([d.value, "h-full rounded-lg animate-linear-loader"]),
+          class: v([d.value, "h-full rounded-lg animate-linear-loader"]),
           style: W({ width: t.progress ? `${t.progress}%` : void 0 })
         }, null, 6)
       ])
@@ -492,7 +497,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
   fill: "none",
   stroke: "currentColor",
   viewBox: "0 0 24 24"
-}, Qe = /* @__PURE__ */ L({
+}, Qe = /* @__PURE__ */ S({
   __name: "Menu",
   props: {
     items: { default: () => [] },
@@ -511,79 +516,80 @@ const le = { class: "flex items-center gap-4" }, ae = {
     zIndex: { default: 50 }
   },
   emits: ["open", "close", "select"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = V(!1), d = V(null), r = V(null), f = V({}), i = g(() => [
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = j(!1), d = j(null), r = j(null), f = j({}), i = p(() => [
       "inline-flex items-center justify-center px-4 py-2 text-sm font-medium",
       "bg-white border border-secondary-300 rounded-md",
       "hover:bg-secondary-50 focus:outline-none focus:ring-2 focus:ring-primary-500",
       "disabled:opacity-50 disabled:cursor-not-allowed",
       "transition-colors"
-    ].join(" ")), y = g(() => [...[
+    ].join(" ")), y = p(() => [...[
       "fixed bg-white rounded-lg shadow-lg border border-secondary-200",
       "flex flex-col",
       "focus:outline-none"
-    ], `z-${e.zIndex}`].join(" ")), x = g(() => "px-4 py-3 border-b border-secondary-200 bg-secondary-50"), j = g(() => "px-4 py-3 border-t border-secondary-200 bg-secondary-50"), S = g(() => "py-1 overflow-y-auto flex-1 min-h-0"), _ = g(() => "my-1 border-t border-secondary-200"), O = g(() => "px-4 py-2 text-xs font-semibold text-secondary-500 uppercase tracking-wider"), F = (l) => {
+    ], `z-${e.zIndex}`].join(" ")), x = p(() => "px-4 py-3 border-b border-secondary-200 bg-secondary-50"), L = p(() => "px-4 py-3 border-t border-secondary-200 bg-secondary-50"), D = p(() => "py-1 overflow-y-auto flex-1 min-h-0"), _ = p(() => "my-1 border-t border-secondary-200"), M = p(() => "px-4 py-2 text-xs font-semibold text-secondary-500 uppercase tracking-wider"), O = (l) => {
       const k = [
         "w-full flex items-center gap-3 px-4 py-2 text-sm text-left",
         "transition-colors focus:outline-none",
         "disabled:opacity-50 disabled:cursor-not-allowed"
-      ], p = l.variant || "default", N = {
+      ], g = l.variant || "default", N = {
         default: "text-secondary-700 hover:bg-secondary-50 focus:bg-secondary-50",
         danger: "text-danger-600 hover:bg-danger-50 focus:bg-danger-50",
         success: "text-success-600 hover:bg-success-50 focus:bg-success-50",
         warning: "text-warning-600 hover:bg-warning-50 focus:bg-warning-50"
       };
-      return [...k, N[p]].join(" ");
+      let T = "";
+      return l.color && (T = l.color, (l.color.includes("white") || l.color.includes("50")) && (T += " hover:text-black")), [...k, T || N[g]].join(" ");
     }, P = () => {
-      e.disabled || (n.value ? $() : I());
-    }, I = () => {
+      e.disabled || (n.value ? $() : E());
+    }, E = () => {
       n.value = !0, u("open"), J(() => {
-        m(), document.addEventListener("click", T), document.addEventListener("keydown", D);
+        m(), document.addEventListener("click", z), document.addEventListener("keydown", I);
       });
     }, $ = () => {
-      n.value = !1, u("close"), document.removeEventListener("click", T), document.removeEventListener("keydown", D);
+      n.value = !1, u("close"), document.removeEventListener("click", z), document.removeEventListener("keydown", I);
     }, B = (l) => {
       l.disabled || (l.action && l.action(), u("select", l), e.closeOnClick && !l.children && $());
-    }, T = (l) => {
+    }, z = (l) => {
       const k = l.target;
       d.value && !d.value.contains(k) && r.value && !r.value.contains(k) && $();
-    }, D = (l) => {
+    }, I = (l) => {
       l.key === "Escape" && $();
     }, h = (l) => {
       (l.key === "Enter" || l.key === " ") && (l.preventDefault(), P());
     }, m = () => {
       if (!d.value || !r.value) return;
-      const l = d.value.getBoundingClientRect(), k = r.value.getBoundingClientRect(), p = window.innerWidth, N = window.innerHeight;
-      let z = 0, M = 0;
+      const l = d.value.getBoundingClientRect(), k = r.value.getBoundingClientRect(), g = window.innerWidth, N = window.innerHeight;
+      let T = 0, V = 0;
       switch (e.position) {
         case "bottom-start":
-          z = l.bottom + e.offset.y, M = l.left + e.offset.x;
+          T = l.bottom + e.offset.y, V = l.left + e.offset.x;
           break;
         case "bottom-end":
-          z = l.bottom + e.offset.y, M = l.right - k.width + e.offset.x;
+          T = l.bottom + e.offset.y, V = l.right - k.width + e.offset.x;
           break;
         case "top-start":
-          z = l.top - k.height - e.offset.y, M = l.left + e.offset.x;
+          T = l.top - k.height - e.offset.y, V = l.left + e.offset.x;
           break;
         case "top-end":
-          z = l.top - k.height - e.offset.y, M = l.right - k.width + e.offset.x;
+          T = l.top - k.height - e.offset.y, V = l.right - k.width + e.offset.x;
           break;
         case "right-start":
-          z = l.top + e.offset.y, M = l.right + e.offset.x;
+          T = l.top + e.offset.y, V = l.right + e.offset.x;
           break;
         case "right-end":
-          z = l.bottom - k.height + e.offset.y, M = l.right + e.offset.x;
+          T = l.bottom - k.height + e.offset.y, V = l.right + e.offset.x;
           break;
         case "left-start":
-          z = l.top + e.offset.y, M = l.left - k.width - e.offset.x;
+          T = l.top + e.offset.y, V = l.left - k.width - e.offset.x;
           break;
         case "left-end":
-          z = l.bottom - k.height + e.offset.y, M = l.left - k.width - e.offset.x;
+          T = l.bottom - k.height + e.offset.y, V = l.left - k.width - e.offset.x;
           break;
       }
-      M + k.width > p && (M = p - k.width - 8), M < 8 && (M = 8), z + k.height > N && (z = N - k.height - 8), z < 8 && (z = 8), f.value = {
-        top: `${z}px`,
-        left: `${M}px`,
+      V + k.width > g && (V = g - k.width - 8), V < 8 && (V = 8), T + k.height > N && (T = N - k.height - 8), T < 8 && (T = 8), f.value = {
+        top: `${T}px`,
+        left: `${V}px`,
         width: e.width === "auto" ? `${Math.max(l.width, 240)}px` : e.width,
         maxHeight: e.maxHeight,
         minWidth: "240px"
@@ -592,11 +598,11 @@ const le = { class: "flex items-center gap-4" }, ae = {
     return ee(() => {
       window.addEventListener("scroll", m, !0), window.addEventListener("resize", m);
     }), te(() => {
-      window.removeEventListener("scroll", m, !0), window.removeEventListener("resize", m), document.removeEventListener("click", T), document.removeEventListener("keydown", D);
+      window.removeEventListener("scroll", m, !0), window.removeEventListener("resize", m), document.removeEventListener("click", z), document.removeEventListener("keydown", I);
     }), Y(() => e.items, () => {
       n.value && J(m);
     }, { deep: !0 }), (l, k) => (s(), o("div", {
-      class: b(["menu-wrapper", { "w-full": t.fullWidth }])
+      class: v(["menu-wrapper", { "w-full": t.fullWidth }])
     }, [
       a("div", {
         ref_key: "triggerRef",
@@ -608,7 +614,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
         }, () => [
           a("button", {
             type: "button",
-            class: b(i.value),
+            class: v(i.value),
             disabled: t.disabled,
             onClick: P,
             onKeydown: h,
@@ -622,7 +628,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
             ], !0),
             t.showChevron ? (s(), o("svg", {
               key: 0,
-              class: b(["w-4 h-4 ml-2 transition-transform", n.value ? "rotate-180" : ""]),
+              class: v(["w-4 h-4 ml-2 transition-transform", n.value ? "rotate-180" : ""]),
               fill: "none",
               stroke: "currentColor",
               viewBox: "0 0 24 24"
@@ -642,76 +648,76 @@ const le = { class: "flex items-center gap-4" }, ae = {
           key: 0,
           ref_key: "menuRef",
           ref: r,
-          class: b(y.value),
+          class: v(y.value),
           style: W(f.value),
-          onClick: k[0] || (k[0] = E(() => {
+          onClick: k[0] || (k[0] = H(() => {
           }, ["stop"]))
         }, [
           l.$slots.header ? (s(), o("div", {
             key: 0,
-            class: b(x.value)
+            class: v(x.value)
           }, [
             C(l.$slots, "header", { close: $ }, void 0, !0)
           ], 2)) : c("", !0),
           a("div", {
-            class: b(S.value)
+            class: v(D.value)
           }, [
             C(l.$slots, "default", {
               close: $,
               isOpen: n.value
             }, () => [
-              (s(!0), o(H, null, A(t.items, (p, N) => (s(), o(H, {
-                key: p.id || N
+              (s(!0), o(F, null, A(t.items, (g, N) => (s(), o(F, {
+                key: g.id || N
               }, [
-                p.type === "divider" ? (s(), o("div", {
+                g.type === "divider" ? (s(), o("div", {
                   key: 0,
-                  class: b(_.value)
-                }, null, 2)) : p.type === "header" ? (s(), o("div", {
+                  class: v(_.value)
+                }, null, 2)) : g.type === "header" ? (s(), o("div", {
                   key: 1,
-                  class: b(O.value)
-                }, w(p.label), 3)) : (s(), o("button", {
+                  class: v(M.value)
+                }, w(g.label), 3)) : (s(), o("button", {
                   key: 2,
                   type: "button",
-                  class: b(F(p)),
-                  disabled: p.disabled,
-                  onClick: (z) => B(p)
+                  class: v(O(g)),
+                  disabled: g.disabled,
+                  onClick: (T) => B(g)
                 }, [
-                  p.icon || l.$slots[`icon-${p.id}`] ? (s(), o("span", Fe, [
-                    C(l.$slots, `icon-${p.id}`, { item: p }, () => [
-                      typeof p.icon != "string" ? (s(), q(Z(p.icon), {
+                  g.icon || l.$slots[`icon-${g.id}`] ? (s(), o("span", Fe, [
+                    C(l.$slots, `icon-${g.id}`, { item: g }, () => [
+                      typeof g.icon != "string" ? (s(), q(Z(g.icon), {
                         key: 0,
                         class: "w-5 h-5"
                       })) : (s(), o("span", {
                         key: 1,
-                        innerHTML: p.icon,
+                        innerHTML: g.icon,
                         class: "w-5 h-5 inline-block"
                       }, null, 8, Pe))
                     ], !0)
                   ])) : c("", !0),
                   a("div", We, [
-                    C(l.$slots, `item-${p.id}`, {
-                      item: p,
+                    C(l.$slots, `item-${g.id}`, {
+                      item: g,
                       close: $
                     }, () => [
                       a("div", Ae, [
                         a("span", {
                           class: "truncate w-full",
-                          title: p.label
-                        }, w(p.label), 9, Ke),
-                        p.description ? (s(), o("span", {
+                          title: g.label
+                        }, w(g.label), 9, Ke),
+                        g.description ? (s(), o("span", {
                           key: 0,
                           class: "text-xs text-secondary-500 truncate w-full",
-                          title: p.description
-                        }, w(p.description), 9, Re)) : c("", !0)
+                          title: g.description
+                        }, w(g.description), 9, Re)) : c("", !0)
                       ])
                     ], !0)
                   ]),
-                  p.suffix || p.shortcut || l.$slots[`suffix-${p.id}`] ? (s(), o("span", Ne, [
-                    C(l.$slots, `suffix-${p.id}`, { item: p }, () => [
-                      p.shortcut ? (s(), o("span", qe, w(p.shortcut), 1)) : p.suffix ? (s(), o("span", Ue, w(p.suffix), 1)) : c("", !0)
+                  g.suffix || g.shortcut || l.$slots[`suffix-${g.id}`] ? (s(), o("span", Ne, [
+                    C(l.$slots, `suffix-${g.id}`, { item: g }, () => [
+                      g.shortcut ? (s(), o("span", qe, w(g.shortcut), 1)) : g.suffix ? (s(), o("span", Ue, w(g.suffix), 1)) : c("", !0)
                     ], !0)
                   ])) : c("", !0),
-                  p.children && p.children.length > 0 ? (s(), o("svg", Ge, [...k[2] || (k[2] = [
+                  g.children && g.children.length > 0 ? (s(), o("svg", Ge, [...k[2] || (k[2] = [
                     a("path", {
                       "stroke-linecap": "round",
                       "stroke-linejoin": "round",
@@ -725,7 +731,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
           ], 2),
           l.$slots.footer ? (s(), o("div", {
             key: 1,
-            class: b(j.value)
+            class: v(L.value)
           }, [
             C(l.$slots, "footer", { close: $ }, void 0, !0)
           ], 2)) : c("", !0)
@@ -738,7 +744,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ]))
     ], 2));
   }
-}), Rt = /* @__PURE__ */ R(Qe, [["__scopeId", "data-v-e155a86b"]]), Je = ["for"], Xe = {
+}), Rt = /* @__PURE__ */ R(Qe, [["__scopeId", "data-v-335f2699"]]), Je = ["for"], Xe = {
   key: 0,
   class: "text-danger-600"
 }, Ye = { class: "relative" }, Ze = ["id", "disabled", "aria-expanded"], et = { class: "flex-1 text-left truncate" }, tt = {
@@ -763,7 +769,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }, pt = {
   key: 2,
   class: "mt-1 text-sm text-secondary-600"
-}, gt = /* @__PURE__ */ L({
+}, gt = /* @__PURE__ */ S({
   __name: "Select",
   props: {
     modelValue: { default: null },
@@ -784,15 +790,15 @@ const le = { class: "flex items-center gap-4" }, ae = {
     menuPosition: { default: "bottom" }
   },
   emits: ["update:modelValue", "change", "action"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = V(!1), d = V(""), r = V(null), f = g(
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = j(!1), d = j(""), r = j(null), f = p(
       () => `select-${Math.random().toString(36).substr(2, 9)}`
-    ), i = g(() => e.options.find((h) => h.value === e.modelValue) || null), y = g(() => {
+    ), i = p(() => e.options.find((h) => h.value === e.modelValue) || null), y = p(() => {
       if (!e.searchable || !d.value)
         return e.options;
       const h = d.value.toLowerCase();
       return e.options.filter((m) => m.label.toLowerCase().includes(h));
-    }), x = g(() => "block text-sm font-semibold text-secondary-700 mb-1"), j = g(() => {
+    }), x = p(() => "block text-sm font-semibold text-secondary-700 mb-1"), L = p(() => {
       const h = "w-full flex items-center justify-between gap-2 border rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500 disabled:opacity-50 disabled:cursor-not-allowed", m = {
         sm: "px-3 py-1.5 text-sm",
         md: "px-4 py-2 text-base",
@@ -808,40 +814,40 @@ const le = { class: "flex items-center gap-4" }, ae = {
         l[e.variant],
         k
       ].join(" ");
-    }), S = g(() => `absolute ${e.menuPosition === "top" ? "bottom-full mb-1" : "top-full mt-1"} left-0 right-0 bg-white rounded-lg shadow-lg border border-secondary-200 z-50 overflow-hidden`), _ = (h) => {
-      const m = "w-full px-4 py-2 text-left hover:bg-primary-50 transition-colors focus:outline-none focus:bg-primary-50 disabled:opacity-50 disabled:cursor-not-allowed", l = F(h) ? "bg-primary-50" : "";
+    }), D = p(() => `absolute ${e.menuPosition === "top" ? "bottom-full mb-1" : "top-full mt-1"} left-0 right-0 bg-white rounded-lg shadow-lg border border-secondary-200 z-50 overflow-hidden`), _ = (h) => {
+      const m = "w-full px-4 py-2 text-left hover:bg-primary-50 transition-colors focus:outline-none focus:bg-primary-50 disabled:opacity-50 disabled:cursor-not-allowed", l = O(h) ? "bg-primary-50" : "";
       return [m, l].join(" ");
-    }, O = (h) => {
+    }, M = (h) => {
       const m = "w-full px-4 py-2 text-left text-sm font-semibold transition-colors focus:outline-none flex items-center gap-3";
       return h.variant === "danger" ? `${m} text-danger-600 hover:bg-danger-50 focus:bg-danger-50` : `${m} text-secondary-700 hover:bg-secondary-50 focus:bg-secondary-50`;
-    }, F = (h) => h.value === e.modelValue, P = () => {
+    }, O = (h) => h.value === e.modelValue, P = () => {
       e.disabled || (n.value = !n.value, n.value && e.searchable && J(() => {
         var h;
         (h = r.value) == null || h.focus();
       }));
-    }, I = () => {
+    }, E = () => {
       n.value = !1, d.value = "";
     }, $ = (h) => {
-      h.disabled || (u("update:modelValue", h.value), u("change", h), I());
+      h.disabled || (u("update:modelValue", h.value), u("change", h), E());
     }, B = (h) => {
-      h.action && h.action(), u("action", h), I();
-    }, T = (h) => {
+      h.action && h.action(), u("action", h), E();
+    }, z = (h) => {
       const m = h.relatedTarget;
       m && m.closest(".select-wrapper") || setTimeout(() => {
-        I();
+        E();
       }, 200);
-    }, D = (h) => {
-      h.key === "Escape" ? I() : (h.key === "Enter" || h.key === " ") && (h.preventDefault(), P());
+    }, I = (h) => {
+      h.key === "Escape" ? E() : (h.key === "Enter" || h.key === " ") && (h.preventDefault(), P());
     };
     return Y(n, (h) => {
       h && (d.value = "");
     }), (h, m) => (s(), o("div", {
-      class: b(["select-wrapper", { "w-full": t.fullWidth }])
+      class: v(["select-wrapper", { "w-full": t.fullWidth }])
     }, [
       t.label ? (s(), o("label", {
         key: 0,
         for: f.value,
-        class: b(x.value)
+        class: v(x.value)
       }, [
         K(w(t.label) + " ", 1),
         t.required ? (s(), o("span", Xe, "*")) : c("", !0)
@@ -850,17 +856,17 @@ const le = { class: "flex items-center gap-4" }, ae = {
         a("button", {
           id: f.value,
           type: "button",
-          class: b(j.value),
+          class: v(L.value),
           disabled: t.disabled,
           "aria-expanded": n.value,
           "aria-haspopup": !0,
           onClick: P,
-          onBlur: T,
-          onKeydown: D
+          onBlur: z,
+          onKeydown: I
         }, [
           a("span", et, w(i.value ? i.value.label : t.placeholder), 1),
           (s(), o("svg", {
-            class: b(["w-5 h-5 flex-shrink-0 transition-transform text-secondary-600", n.value ? "rotate-180" : ""]),
+            class: v(["w-5 h-5 flex-shrink-0 transition-transform text-secondary-600", n.value ? "rotate-180" : ""]),
             fill: "none",
             stroke: "currentColor",
             viewBox: "0 0 24 24",
@@ -876,8 +882,8 @@ const le = { class: "flex items-center gap-4" }, ae = {
         ], 42, Ze),
         n.value ? (s(), o("div", {
           key: 0,
-          class: b(S.value),
-          onClick: m[2] || (m[2] = E(() => {
+          class: v(D.value),
+          onClick: m[2] || (m[2] = H(() => {
           }, ["stop"]))
         }, [
           t.searchable ? (s(), o("div", tt, [
@@ -888,23 +894,23 @@ const le = { class: "flex items-center gap-4" }, ae = {
               type: "text",
               class: "w-full px-3 py-2 text-sm border border-secondary-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary-500",
               placeholder: t.searchPlaceholder,
-              onKeydown: m[1] || (m[1] = E(() => {
+              onKeydown: m[1] || (m[1] = H(() => {
               }, ["stop"]))
             }, null, 40, st), [
               [oe, d.value]
             ])
           ])) : c("", !0),
           a("div", ot, [
-            y.value.length === 0 ? (s(), o("div", lt, w(t.emptyText), 1)) : (s(), o(H, { key: 1 }, [
-              (s(!0), o(H, null, A(y.value, (l) => (s(), o("button", {
+            y.value.length === 0 ? (s(), o("div", lt, w(t.emptyText), 1)) : (s(), o(F, { key: 1 }, [
+              (s(!0), o(F, null, A(y.value, (l) => (s(), o("button", {
                 key: l.value,
                 type: "button",
-                class: b(_(l)),
+                class: v(_(l)),
                 onClick: (k) => $(l)
               }, [
                 a("div", nt, [
                   a("span", rt, w(l.label), 1),
-                  F(l) ? (s(), o("svg", it, [...m[4] || (m[4] = [
+                  O(l) ? (s(), o("svg", it, [...m[4] || (m[4] = [
                     a("path", {
                       "stroke-linecap": "round",
                       "stroke-linejoin": "round",
@@ -915,10 +921,10 @@ const le = { class: "flex items-center gap-4" }, ae = {
                 ])
               ], 10, at))), 128)),
               t.actionItems.length > 0 ? (s(), o("div", dt)) : c("", !0),
-              (s(!0), o(H, null, A(t.actionItems, (l) => (s(), o("button", {
+              (s(!0), o(F, null, A(t.actionItems, (l) => (s(), o("button", {
                 key: l.id,
                 type: "button",
-                class: b(O(l)),
+                class: v(M(l)),
                 onClick: (k) => B(l)
               }, [
                 l.icon ? (s(), o("svg", {
@@ -939,12 +945,12 @@ const le = { class: "flex items-center gap-4" }, ae = {
       t.error ? (s(), o("p", ft, w(t.error), 1)) : t.helperText ? (s(), o("p", pt, w(t.helperText), 1)) : c("", !0),
       n.value ? (s(), o("div", {
         key: 3,
-        onClick: I,
+        onClick: E,
         class: "fixed inset-0 z-40"
       })) : c("", !0)
     ], 2));
   }
-}), Nt = /* @__PURE__ */ R(gt, [["__scopeId", "data-v-f016a03c"]]), ht = /* @__PURE__ */ L({
+}), Nt = /* @__PURE__ */ R(gt, [["__scopeId", "data-v-f016a03c"]]), ht = /* @__PURE__ */ S({
   __name: "Sidebar",
   props: {
     modelValue: { type: Boolean, default: !1 },
@@ -959,16 +965,16 @@ const le = { class: "flex items-center gap-4" }, ae = {
     padding: { default: "md" }
   },
   emits: ["update:modelValue", "close", "open"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = g({
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = p({
       get: () => e.modelValue,
       set: (_) => u("update:modelValue", _)
     }), d = () => {
       e.persistent || (n.value = !1, u("close"));
-    }, r = g(() => e.position === "left" ? "slide-right" : "slide-left"), f = g(() => {
-      const _ = "fixed top-0 h-full z-50 flex flex-col", O = e.position === "left" ? "left-0" : "right-0", F = e.shadow ? e.position === "left" ? "shadow-[2px_0_8px_rgba(0,0,0,0.1)]" : "shadow-[-2px_0_8px_rgba(0,0,0,0.1)]" : "";
-      return [_, O, F].filter(Boolean).join(" ");
-    }), i = g(() => ({
+    }, r = p(() => e.position === "left" ? "slide-right" : "slide-left"), f = p(() => {
+      const _ = "fixed top-0 h-full z-50 flex flex-col", M = e.position === "left" ? "left-0" : "right-0", O = e.shadow ? e.position === "left" ? "shadow-[2px_0_8px_rgba(0,0,0,0.1)]" : "shadow-[-2px_0_8px_rgba(0,0,0,0.1)]" : "";
+      return [_, M, O].filter(Boolean).join(" ");
+    }), i = p(() => ({
       width: e.width,
       backgroundColor: e.backgroundColor,
       top: e.overlayTop,
@@ -978,8 +984,8 @@ const le = { class: "flex items-center gap-4" }, ae = {
       sm: "p-2",
       md: "p-4",
       lg: "p-6"
-    }, x = g(() => `flex items-center justify-between border-b border-gray-200 ${y[e.padding]}`), j = g(() => `flex-1 overflow-y-auto ${y[e.padding]}`), S = g(() => `border-t border-gray-200 ${y[e.padding]}`);
-    return (_, O) => (s(), q(X, { to: "body" }, [
+    }, x = p(() => `flex items-center justify-between border-b border-gray-200 ${y[e.padding]}`), L = p(() => `flex-1 overflow-y-auto ${y[e.padding]}`), D = p(() => `border-t border-gray-200 ${y[e.padding]}`);
+    return (_, M) => (s(), q(X, { to: "body" }, [
       G(Q, { name: "fade" }, {
         default: U(() => [
           n.value && t.overlay ? (s(), o("div", {
@@ -995,12 +1001,12 @@ const le = { class: "flex items-center gap-4" }, ae = {
         default: U(() => [
           n.value ? (s(), o("aside", {
             key: 0,
-            class: b(f.value),
+            class: v(f.value),
             style: W(i.value)
           }, [
             _.$slots.header ? (s(), o("div", {
               key: 0,
-              class: b(x.value)
+              class: v(x.value)
             }, [
               C(_.$slots, "header", {}, void 0, !0),
               t.closable ? (s(), o("button", {
@@ -1008,7 +1014,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
                 onClick: d,
                 class: "p-2 hover:bg-gray-100 rounded-md transition-colors",
                 "aria-label": "Cerrar menú"
-              }, [...O[0] || (O[0] = [
+              }, [...M[0] || (M[0] = [
                 a("svg", {
                   class: "w-5 h-5",
                   fill: "none",
@@ -1025,13 +1031,13 @@ const le = { class: "flex items-center gap-4" }, ae = {
               ])])) : c("", !0)
             ], 2)) : c("", !0),
             a("div", {
-              class: b(j.value)
+              class: v(L.value)
             }, [
               C(_.$slots, "default", {}, void 0, !0)
             ], 2),
             _.$slots.footer ? (s(), o("div", {
               key: 1,
-              class: b(S.value)
+              class: v(D.value)
             }, [
               C(_.$slots, "footer", {}, void 0, !0)
             ], 2)) : c("", !0)
@@ -1041,7 +1047,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
       }, 8, ["name"])
     ]));
   }
-}), qt = /* @__PURE__ */ R(ht, [["__scopeId", "data-v-fffb0e44"]]), bt = { class: "w-full overflow-x-auto" }, vt = { class: "w-full border-collapse" }, yt = { class: "w-full" }, xt = { class: "bg-white border-b border-gray-100 w-full" }, mt = ["onClick"], kt = { class: "flex items-center gap-2" }, wt = {
+}), qt = /* @__PURE__ */ R(ht, [["__scopeId", "data-v-fffb0e44"]]), vt = { class: "w-full overflow-x-auto" }, bt = { class: "w-full border-collapse" }, yt = { class: "w-full" }, xt = { class: "bg-white border-b border-gray-100 w-full" }, mt = ["onClick"], kt = { class: "flex items-center gap-2" }, wt = {
   key: 0,
   class: "text-xs text-gray-400"
 }, $t = { key: 0 }, Ct = { key: 1 }, Bt = { class: "w-full" }, _t = {
@@ -1050,32 +1056,32 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }, Tt = {
   key: 1,
   class: "w-full px-6 py-4 bg-white"
-}, zt = /* @__PURE__ */ L({
+}, zt = /* @__PURE__ */ S({
   __name: "Table",
   props: {
     columns: {},
     data: {}
   },
   setup(t) {
-    const v = t, e = V(null), u = V("asc"), n = (r) => {
+    const b = t, e = j(null), u = j("asc"), n = (r) => {
       e.value === r ? u.value = u.value === "asc" ? "desc" : "asc" : (e.value = r, u.value = "asc");
-    }, d = g(() => {
+    }, d = p(() => {
       if (!e.value)
-        return v.data;
-      const r = [...v.data];
+        return b.data;
+      const r = [...b.data];
       return r.sort((f, i) => {
         const y = f[e.value], x = i[e.value];
         return typeof y == "string" && typeof x == "string" ? u.value === "asc" ? y.localeCompare(x) : x.localeCompare(y) : typeof y == "number" && typeof x == "number" ? u.value === "asc" ? y - x : x - y : 0;
       }), r;
     });
-    return (r, f) => (s(), o("div", bt, [
-      a("table", vt, [
+    return (r, f) => (s(), o("div", vt, [
+      a("table", bt, [
         a("thead", yt, [
           a("tr", xt, [
-            (s(!0), o(H, null, A(t.columns, (i) => (s(), o("th", {
+            (s(!0), o(F, null, A(t.columns, (i) => (s(), o("th", {
               key: i.key,
               style: W(i.width ? { width: i.width } : {}),
-              class: b([
+              class: v([
                 "px-8 py-4 text-left text-base font-semibold text-gray-900 border-0",
                 i.sortable ? "cursor-pointer hover:text-primary-700 select-none transition-colors" : ""
               ]),
@@ -1091,11 +1097,11 @@ const le = { class: "flex items-center gap-4" }, ae = {
           ])
         ]),
         a("tbody", Bt, [
-          (s(!0), o(H, null, A(d.value, (i, y) => (s(), o("tr", {
+          (s(!0), o(F, null, A(d.value, (i, y) => (s(), o("tr", {
             key: y,
             class: "w-full hover:bg-gray-50 transition-colors"
           }, [
-            (s(!0), o(H, null, A(t.columns, (x) => (s(), o("td", {
+            (s(!0), o(F, null, A(t.columns, (x) => (s(), o("td", {
               key: `${y}-${x.key}`,
               class: "px-8 py-4 text-base text-gray-700 border-0"
             }, [
@@ -1122,31 +1128,31 @@ const le = { class: "flex items-center gap-4" }, ae = {
 }), Ut = /* @__PURE__ */ R(zt, [["__scopeId", "data-v-6b3ff0a8"]]), Mt = { class: "w-full" }, Vt = {
   class: "flex border-b border-gray-100",
   role: "tablist"
-}, jt = ["aria-selected", "onClick"], Lt = { role: "tabpanel" }, St = "relative px-6 py-3 text-base font-semibold tracking-wide transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary-500", Dt = "text-primary-700 border-b-4 border-primary-700", Ot = "text-gray-600 border-b-4 border-transparent hover:text-gray-800", Gt = /* @__PURE__ */ L({
+}, jt = ["aria-selected", "onClick"], Lt = { role: "tabpanel" }, St = "relative px-6 py-3 text-base font-semibold tracking-wide transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary-500", Dt = "text-primary-700 border-b-4 border-primary-700", Ot = "text-gray-600 border-b-4 border-transparent hover:text-gray-800", Gt = /* @__PURE__ */ S({
   __name: "Tabs",
   props: {
     modelValue: {},
     tabs: {}
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: v }) {
-    const e = t, u = v, n = (i) => e.modelValue === i, d = (i) => {
+  setup(t, { emit: b }) {
+    const e = t, u = b, n = (i) => e.modelValue === i, d = (i) => {
       n(i) || u("update:modelValue", i);
-    }, r = g(() => e.modelValue), f = g(
+    }, r = p(() => e.modelValue), f = p(
       () => e.tabs.find((i) => i.value === r.value)
     );
     return (i, y) => (s(), o("div", Mt, [
       a("div", Vt, [
-        (s(!0), o(H, null, A(t.tabs, (x) => (s(), o("button", {
+        (s(!0), o(F, null, A(t.tabs, (x) => (s(), o("button", {
           key: x.value,
           type: "button",
-          class: b([
+          class: v([
             St,
             n(x.value) ? Dt : Ot
           ]),
           "aria-selected": n(x.value),
           role: "tab",
-          onClick: (j) => d(x.value)
+          onClick: (L) => d(x.value)
         }, w(x.label), 11, jt))), 128))
       ]),
       a("div", Lt, [
@@ -1157,7 +1163,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ])
     ]));
   }
-}), It = "font-sans", Qt = /* @__PURE__ */ L({
+}), It = "font-sans", Qt = /* @__PURE__ */ S({
   __name: "Text",
   props: {
     variant: { default: "body1" },
@@ -1169,7 +1175,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
     weight: {}
   },
   setup(t) {
-    const v = {
+    const b = {
       h1: "text-[40px] leading-[57px] tracking-[0px] font-extrabold",
       h2: "text-[40px] leading-[57px] tracking-[0px] font-bold",
       h3: "text-[28px] leading-[39px] tracking-[0px] font-extrabold",
@@ -1229,14 +1235,14 @@ const le = { class: "flex items-center gap-4" }, ae = {
       semibold: "font-semibold",
       bold: "font-bold",
       extrabold: "font-extrabold"
-    }, r = t, f = g(() => r.variant), i = g(() => r.color), y = g(() => r.align), x = g(() => r.as || e[f.value] || "span"), j = g(() => r.weight ? d[r.weight] : "");
-    return (S, _) => (s(), q(Z(x.value), {
-      class: b([
+    }, r = t, f = p(() => r.variant), i = p(() => r.color), y = p(() => r.align), x = p(() => r.as || e[f.value] || "span"), L = p(() => r.weight ? d[r.weight] : "");
+    return (D, _) => (s(), q(Z(x.value), {
+      class: v([
         It,
-        v[f.value],
+        b[f.value],
         n[i.value],
         u[y.value],
-        j.value,
+        L.value,
         {
           uppercase: t.uppercase || f.value === "overline",
           truncate: t.truncate
@@ -1244,7 +1250,7 @@ const le = { class: "flex items-center gap-4" }, ae = {
       ])
     }, {
       default: U(() => [
-        C(S.$slots, "default")
+        C(D.$slots, "default")
       ]),
       _: 3
     }, 8, ["class"]));