adverich-kun-ui 0.1.500 → 0.1.502

package/dist/components/KunBtn/src/components/KunBtn.vue.js

@@ -1,17 +1,17 @@
-import { useSlots as O, useAttrs as W, computed as r, ref as E, createBlock as i, openBlock as l, resolveDynamicComponent as c, mergeProps as N, unref as T, withCtx as V, createElementVNode as x, normalizeClass as y, renderSlot as u, createCommentVNode as d, createVNode as F, createElementBlock as m, createTextVNode as D, toDisplayString as L, h as q } from "vue";
-import { RouterLink as H } from "vue-router";
-import K from "../../../KunLoaderCircular/src/components/KunLoaderCircular.vue.js";
-import P from "../../../KunIcon/src/components/KunIcon.vue.js";
-const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G = {
+import { useSlots as E, useAttrs as K, computed as a, ref as N, createBlock as u, openBlock as o, resolveDynamicComponent as c, mergeProps as T, unref as V, withCtx as F, createElementVNode as m, normalizeClass as v, renderSlot as d, createCommentVNode as f, createVNode as D, createElementBlock as g, createTextVNode as L, toDisplayString as q, h as H } from "vue";
+import { RouterLink as P } from "vue-router";
+import R from "../../../KunLoaderCircular/src/components/KunLoaderCircular.vue.js";
+import G from "../../../KunIcon/src/components/KunIcon.vue.js";
+const J = { class: "absolute inset-0 flex items-center justify-center z-10" }, M = {
   key: 0,
   class: "mr-2 flex items-center"
-}, J = {
+}, Q = {
   key: 1,
   class: "truncate flex items-center justify-center"
-}, M = {
+}, U = {
   key: 2,
   class: "ml-2 flex items-center"
-}, Z = {
+}, ee = {
   __name: "KunBtn",
   props: {
     text: String,
@@ -47,13 +47,14 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
     iconSize: { type: String, default: null },
     focusColor: { type: String, default: null }
   },
-  setup(n, { expose: v }) {
-    const g = O(), a = W(), t = n, k = r(() => !!t.to || !!t.href), S = r(() => !k.value), $ = r(() => t.href ? "a" : t.to ? H : "button"), f = (e) => !e || e === !1 || e === !0 && !t.icon ? null : q(P, {
+  emits: ["click", "keydown", "keyup", "keypress"],
+  setup(n, { expose: k, emit: S }) {
+    const y = E(), l = K(), t = n, i = S, $ = a(() => !!t.to || !!t.href), w = a(() => !$.value), C = a(() => t.href ? "a" : t.to ? P : "button"), p = (e) => !e || e === !1 || e === !0 && !t.icon ? null : H(G, {
       icon: e,
-      size: z.value,
+      size: j.value,
       color: t.textColor ?? "text-font-color",
       disabled: t.disabled
-    }), w = r(() => t.href ? {
+    }), z = a(() => t.href ? {
       href: t.href,
       target: t.target ?? "_self",
       rel: t.target === "_blank" ? "noopener noreferrer" : null
@@ -63,7 +64,7 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
     } : {
       type: "button",
       disabled: t.loading || t.disabled
-    }), C = (e) => {
+    }), B = (e) => {
       switch (e) {
         case "xxs":
           return "px-1 py-1 text-xs";
@@ -82,7 +83,7 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
         default:
           return "px-3 py-2 text-sm";
       }
-    }, z = r(() => {
+    }, j = a(() => {
       if (t.iconSize) return t.iconSize;
       switch (t.size) {
         case "xxs":
@@ -102,7 +103,7 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
         default:
           return "text-base";
       }
-    }), B = r(() => {
+    }), I = a(() => {
       const e = t.bgColor, s = t.textColor;
       switch (t.variant) {
         case "default":
@@ -120,27 +121,27 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
         default:
           return `${e} ${s}`;
       }
-    }), j = r(() => !!t.text), h = r(() => {
-      var e, s, o;
-      return ((e = a.class) == null ? void 0 : e.includes("w-")) || ((s = a.class) == null ? void 0 : s.includes("min-w-")) || ((o = a.class) == null ? void 0 : o.includes("max-w-"));
-    }), I = r(() => {
-      var e, s, o;
-      return ((e = a.class) == null ? void 0 : e.includes("h-")) || ((s = a.class) == null ? void 0 : s.includes("min-h-")) || ((o = a.class) == null ? void 0 : o.includes("max-h-"));
-    }), p = r(() => {
+    }), A = a(() => !!t.text), h = a(() => {
+      var e, s, r;
+      return ((e = l.class) == null ? void 0 : e.includes("w-")) || ((s = l.class) == null ? void 0 : s.includes("min-w-")) || ((r = l.class) == null ? void 0 : r.includes("max-w-"));
+    }), O = a(() => {
+      var e, s, r;
+      return ((e = l.class) == null ? void 0 : e.includes("h-")) || ((s = l.class) == null ? void 0 : s.includes("min-h-")) || ((r = l.class) == null ? void 0 : r.includes("max-h-"));
+    }), x = a(() => {
       var s;
-      const e = ((s = t.text) == null ? void 0 : s.length) === 1 && !g.default && !t.icon;
-      return !!t.icon && !t.text && !g.default || e;
-    }), A = r(() => {
+      const e = ((s = t.text) == null ? void 0 : s.length) === 1 && !y.default && !t.icon;
+      return !!t.icon && !t.text && !y.default || e;
+    }), W = a(() => {
       const e = [
         "inline-flex items-center justify-center break-keep transition-all whitespace-nowrap",
-        p.value ? "" : C(t.size),
+        x.value ? "" : B(t.size),
         t.fontWeight,
         t.rounded,
         t.textAlign,
-        B.value,
+        I.value,
         "relative"
       ];
-      if (a.class && e.push(a.class), p.value)
+      if (l.class && e.push(l.class), x.value)
         switch (e.push("aspect-square justify-center items-center"), t.size) {
           case "xxs":
             e.push("p-1");
@@ -173,50 +174,54 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
         "active:scale-[.98]",
         "transition duration-100 ease-in-out",
         "cursor-pointer",
-        t.focusColor ? `focus:${t.focusColor}` : ""
-      ) : (e.push("pointer-events-none"), t.disabled && e.push("opacity-50 cursor-not-allowed")), j.value && !p.value && !h.value && e.push(t.minWidth), e.filter(Boolean);
-    }), b = E(null);
-    return v({
+        t.focusColor ? `${t.focusColor}` : ""
+      ) : (e.push("pointer-events-none"), t.disabled && e.push("opacity-50 cursor-not-allowed")), A.value && !x.value && !h.value && e.push(t.minWidth), e.filter(Boolean);
+    }), b = N(null);
+    return k({
       focus: () => {
         var e, s;
         return (s = (e = b.value) == null ? void 0 : e.focus) == null ? void 0 : s.call(e);
       }
-    }), (e, s) => (l(), i(c($.value), N({
+    }), (e, s) => (o(), u(c(C.value), T({
       ref_key: "rootEl",
       ref: b
-    }, w.value, {
-      class: A.value,
-      style: T(a).style,
-      disabled: S.value && (n.loading || n.disabled)
+    }, z.value, {
+      class: W.value,
+      style: V(l).style,
+      disabled: w.value && (n.loading || n.disabled),
+      onClick: s[0] || (s[0] = (r) => i("click", r)),
+      onKeydown: s[1] || (s[1] = (r) => i("keydown", r)),
+      onKeyup: s[2] || (s[2] = (r) => i("keyup", r)),
+      onKeypress: s[3] || (s[3] = (r) => i("keypress", r))
     }), {
-      default: V(() => [
-        x("div", {
-          class: y(["relative flex items-center justify-center", h.value ? "" : "w-full", I.value ? "" : "h-full"])
+      default: F(() => [
+        m("div", {
+          class: v(["relative flex items-center justify-center", h.value ? "" : "w-full", O.value ? "" : "h-full"])
         }, [
-          n.loading ? u(e.$slots, "loader", { key: 0 }, () => [
-            x("div", R, [
-              F(K, {
+          n.loading ? d(e.$slots, "loader", { key: 0 }, () => [
+            m("div", J, [
+              D(R, {
                 size: "20",
                 width: "5"
               })
             ])
-          ]) : d("", !0),
-          x("div", {
-            class: y([{ "opacity-50": n.loading }, "flex items-center justify-center w-full h-full"])
+          ]) : f("", !0),
+          m("div", {
+            class: v([{ "opacity-50": n.loading }, "flex items-center justify-center w-full h-full"])
           }, [
-            e.$slots.prepend || n.prependIcon ? (l(), m("span", G, [
-              u(e.$slots, "prepend"),
-              (l(), i(c(f(n.prependIcon))))
-            ])) : d("", !0),
-            n.text || e.$slots.default || n.icon ? (l(), m("span", J, [
-              n.icon && !n.text && !e.$slots.default ? (l(), i(c(f(n.icon)), { key: 0 })) : u(e.$slots, "default", { key: 1 }, () => [
-                D(L(n.text), 1)
+            e.$slots.prepend || n.prependIcon ? (o(), g("span", M, [
+              d(e.$slots, "prepend"),
+              (o(), u(c(p(n.prependIcon))))
+            ])) : f("", !0),
+            n.text || e.$slots.default || n.icon ? (o(), g("span", Q, [
+              n.icon && !n.text && !e.$slots.default ? (o(), u(c(p(n.icon)), { key: 0 })) : d(e.$slots, "default", { key: 1 }, () => [
+                L(q(n.text), 1)
               ])
-            ])) : d("", !0),
-            e.$slots.append || n.appendIcon ? (l(), m("span", M, [
-              u(e.$slots, "append"),
-              (l(), i(c(f(n.appendIcon))))
-            ])) : d("", !0)
+            ])) : f("", !0),
+            e.$slots.append || n.appendIcon ? (o(), g("span", U, [
+              d(e.$slots, "append"),
+              (o(), u(c(p(n.appendIcon))))
+            ])) : f("", !0)
           ], 2)
         ], 2)
       ]),
@@ -225,5 +230,5 @@ const R = { class: "absolute inset-0 flex items-center justify-center z-10" }, G
   }
 };
 export {
-  Z as default
+  ee as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adverich-kun-ui",
-  "version": "0.1.500",
+  "version": "0.1.502",
   "type": "module",
   "description": "Una librería de componentes Vue.js con Tailwind CSS",
   "main": "dist/index.js",