adverich-kun-ui 0.1.513 → 0.1.514

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

@@ -1,31 +1,32 @@
-import { useAttrs as ee, ref as oe, getCurrentInstance as ne, computed as a, createElementBlock as l, openBlock as r, mergeProps as A, renderSlot as d, createElementVNode as i, createCommentVNode as u, normalizeClass as b, toDisplayString as g, normalizeProps as R, guardReactiveProps as z, unref as t, createBlock as y, resolveDynamicComponent as m, Fragment as re, renderList as te, withDirectives as se, vShow as le, createTextVNode as ae } from "vue";
-import { kunTextareaProps as de } from "../composables/KunTextareaProps.js";
-import ie from "../composables/useKunTextareaComposable.js";
+import { useAttrs as oe, ref as re, getCurrentInstance as te, computed as a, createElementBlock as l, openBlock as r, mergeProps as M, renderSlot as d, createElementVNode as i, createCommentVNode as u, normalizeClass as b, toDisplayString as g, normalizeProps as R, guardReactiveProps as z, unref as t, createBlock as y, resolveDynamicComponent as m, Fragment as ne, renderList as se, withDirectives as le, vShow as ae, createTextVNode as de } from "vue";
+import { kunTextareaProps as ie } from "../composables/KunTextareaProps.js";
+import ue from "../composables/useKunTextareaComposable.js";
 import { renderIconSlot as h } from "../../../../utils/renderIcon.js";
-const ue = { class: "relative" }, pe = {
+import { debounce as pe } from "../../../../utils/utils.js";
+const ce = { class: "relative" }, ve = {
   key: 0,
   class: "absolute left-2 top-2 flex items-center"
-}, ce = {
+}, fe = {
   key: 1,
   class: "absolute left-2 top-2 ml-1"
-}, ve = ["value", "rows", "disabled", "readonly", "placeholder"], fe = {
+}, be = ["value", "rows", "disabled", "readonly", "placeholder"], ge = {
   key: 3,
   class: "absolute right-2 top-2 mr-1"
-}, be = {
+}, ye = {
   key: 4,
   class: "absolute right-2 top-2 flex items-center"
-}, ge = {
+}, me = {
   key: 5,
   class: "mt-1"
-}, ye = { class: "h-1 w-full bg-field-background rounded overflow-hidden" }, me = {
+}, he = { class: "h-1 w-full bg-field-background rounded overflow-hidden" }, ke = {
   key: 7,
   class: "text-xs text-right mt-1 text-gray-400"
-}, he = { key: 0 }, $e = {
+}, Ce = { key: 0 }, Be = {
   __name: "KunTextarea",
-  props: { ...de },
+  props: { ...ie },
   emits: ["update:modelValue", "click:clear", "click:control", "update:focused", "mousedown:control"],
-  setup(D, { expose: M, emit: F }) {
-    const o = D, k = F, G = ee(), p = oe(null), B = `textarea-${ne().uid}`, {
+  setup(A, { expose: D, emit: F }) {
+    const o = A, k = F, G = oe(), p = re(null), B = `textarea-${te().uid}`, {
       isFocused: c,
       internalValue: v,
       updateModel: P,
@@ -36,12 +37,13 @@ const ue = { class: "relative" }, pe = {
       hasError: f,
       displayedMessages: C,
       adjustHeight: H
-    } = ie(o, k, p), L = (e) => {
-      const n = e.target.value;
-      v.value = n, P(n), o.autoGrow && H();
-    }, j = () => {
+    } = ue(o, k, p), L = (e) => {
+      v.value = e.target.value, j(e.target.value), o.autoGrow && H();
+    }, j = pe((e) => {
+      P(e);
+    }, 100), K = () => {
       c.value = !0, k("update:focused", !0);
-    }, K = () => {
+    }, U = () => {
       c.value = !1, k("update:focused", !1);
     }, V = a(() => c.value || !!v.value || o.dirty), w = a(() => typeof v.value == "string" ? v.value.length : 0), I = a(() => o.counter === !0 ? 25 : o.counter || null), q = a(() => o.persistentCounter || o.counter && c.value), J = a(() => ["relative w-full flex flex-col", o.class, o.wrapperClass]), O = a(
       () => o.persistentClear ? "opacity-100" : "hover:opacity-100 opacity-0 transition-opacity duration-200"
@@ -59,9 +61,9 @@ const ue = { class: "relative" }, pe = {
         default:
           return "";
       }
-    }), U = a(
+    }), W = a(
       () => o.density === "compact" ? "p-1" : o.density === "comfortable" ? "p-2" : "p-3"
-    ), W = a(() => [
+    ), X = a(() => [
       "w-full resize-none p-2 transition-colors duration-150",
       o.inputClass,
       {
@@ -80,8 +82,8 @@ const ue = { class: "relative" }, pe = {
         resize: !o.noResize && !o.autoGrow
       },
       Q.value,
-      U.value
-    ]), X = {
+      W.value
+    ]), Y = {
       label: o.label,
       isFocused: c,
       isActive: V,
@@ -108,11 +110,11 @@ const ue = { class: "relative" }, pe = {
         return (e = p.value) == null ? void 0 : e.blur();
       },
       props: o
-    }, Y = $, Z = $, x = a(() => {
+    }, Z = $, x = $, _ = a(() => {
       const { class: e, ...n } = G;
       return n;
     });
-    return M({
+    return D({
       validate: T,
       reset: E,
       resetValidation: N,
@@ -123,20 +125,20 @@ const ue = { class: "relative" }, pe = {
         return (e = p.value) == null ? void 0 : e.focus();
       },
       rootRef: p
-    }), (e, n) => (r(), l("div", A({
+    }), (e, n) => (r(), l("div", M({
       class: J.value,
       ref: "rootRef"
-    }, x.value), [
-      d(e.$slots, "label", A({ for: B }, X), () => [
+    }, _.value), [
+      d(e.$slots, "label", M({ for: B }, Y), () => [
         e.label ? (r(), l("label", {
           key: 0,
           for: B,
           class: b(["absolute left-2 transition-all duration-200 ease-in-out pointer-events-none select-none z-10", V.value || e.placeholder ? "-top-2.25 text-xs opacity-80" : "top-3 text-sm opacity-80"])
         }, g(e.label), 3)) : u("", !0)
       ]),
-      i("div", ue, [
-        e.prependIcon || e.$slots.prepend ? (r(), l("div", pe, [
-          d(e.$slots, "prepend", R(z(t(Y))), () => [
+      i("div", ce, [
+        e.prependIcon || e.$slots.prepend ? (r(), l("div", ve, [
+          d(e.$slots, "prepend", R(z(t(Z))), () => [
             i("div", {
               onClick: n[0] || (n[0] = (s) => e.handleIconClick(s, "prepend"))
             }, [
@@ -144,7 +146,7 @@ const ue = { class: "relative" }, pe = {
             ])
           ])
         ])) : u("", !0),
-        e.prependInnerIcon || e.$slots["prepend-inner"] ? (r(), l("div", ce, [
+        e.prependInnerIcon || e.$slots["prepend-inner"] ? (r(), l("div", fe, [
           d(e.$slots, "prepend-inner", {}, () => [
             i("div", {
               onClick: n[1] || (n[1] = (s) => e.handleIconClick(s, "prependInner"))
@@ -162,13 +164,13 @@ const ue = { class: "relative" }, pe = {
           readonly: e.readonly,
           placeholder: e.placeholder,
           onInput: L,
-          onFocus: j,
-          onBlur: K,
+          onFocus: K,
+          onBlur: U,
           onClick: n[2] || (n[2] = (s) => e.$emit("click:control", s)),
           onMousedown: n[3] || (n[3] = (s) => e.$emit("mousedown:control", s)),
-          class: b(["bg-field-background", [W.value]]),
+          class: b(["bg-field-background", [X.value]]),
           style: { width: "100%", "box-sizing": "border-box", "overflow-y": "hidden" }
-        }, null, 42, ve),
+        }, null, 42, be),
         e.clearable && t(v) ? (r(), l("div", {
           key: 2,
           class: b(["absolute right-2 top-2", O.value])
@@ -183,7 +185,7 @@ const ue = { class: "relative" }, pe = {
             ])
           ])
         ], 2)) : u("", !0),
-        e.appendInnerIcon || e.$slots["append-inner"] ? (r(), l("div", fe, [
+        e.appendInnerIcon || e.$slots["append-inner"] ? (r(), l("div", ge, [
           d(e.$slots, "append-inner", {}, () => [
             i("div", {
               onClick: n[5] || (n[5] = (s) => e.handleIconClick(s, "appendInner"))
@@ -192,8 +194,8 @@ const ue = { class: "relative" }, pe = {
             ])
           ])
         ])) : u("", !0),
-        e.appendIcon || e.$slots.append ? (r(), l("div", be, [
-          d(e.$slots, "append", R(z(t(Z))), () => [
+        e.appendIcon || e.$slots.append ? (r(), l("div", ye, [
+          d(e.$slots, "append", R(z(t(x))), () => [
             i("div", {
               onClick: n[6] || (n[6] = (s) => e.handleIconClick(s, "append"))
             }, [
@@ -201,12 +203,12 @@ const ue = { class: "relative" }, pe = {
             ])
           ])
         ])) : u("", !0),
-        e.loading ? (r(), l("div", ge, [
+        e.loading ? (r(), l("div", me, [
           d(e.$slots, "loader", {
             color: e.loadingColor,
             isActive: !0
           }, () => [
-            i("div", ye, [
+            i("div", he, [
               i("div", {
                 class: b(["h-full transition-all duration-300", [e.loadingColor]]),
                 style: { width: "100%" }
@@ -219,8 +221,8 @@ const ue = { class: "relative" }, pe = {
           class: b(["text-xs mt-1 space-y-1", { "text-red-500": t(f), "text-gray-500": !t(f) }])
         }, [
           d(e.$slots, "details", {}, () => [
-            t(f) ? (r(!0), l(re, { key: 0 }, te(t(C), (s, _) => d(e.$slots, "message", {
-              key: _,
+            t(f) ? (r(!0), l(ne, { key: 0 }, se(t(C), (s, ee) => d(e.$slots, "message", {
+              key: ee,
               message: s
             }, () => [
               i("div", null, g(s), 1)
@@ -228,20 +230,20 @@ const ue = { class: "relative" }, pe = {
               key: 1,
               hint: e.hint
             }, () => [
-              se(i("div", null, g(e.hint), 513), [
-                [le, e.persistentHint || t(c)]
+              le(i("div", null, g(e.hint), 513), [
+                [ae, e.persistentHint || t(c)]
               ])
             ]) : u("", !0)
           ])
         ], 2)) : u("", !0),
-        q.value ? (r(), l("div", me, [
+        q.value ? (r(), l("div", ke, [
           d(e.$slots, "counter", {
             counter: w.value,
             max: I.value,
             value: w.value
           }, () => [
-            ae(g(w.value), 1),
-            I.value ? (r(), l("span", he, " / " + g(I.value), 1)) : u("", !0)
+            de(g(w.value), 1),
+            I.value ? (r(), l("span", Ce, " / " + g(I.value), 1)) : u("", !0)
           ])
         ])) : u("", !0)
       ])
@@ -249,5 +251,5 @@ const ue = { class: "relative" }, pe = {
   }
 };
 export {
-  $e as default
+  Be as default
 };

package/dist/components/KunTextarea/src/composables/useKunTextareaComposable.js

@@ -1,8 +1,8 @@
-import { ref as i, computed as h, watch as E, nextTick as m, onMounted as A, onBeforeUnmount as F } from "vue";
+import { ref as i, computed as h, watch as O, nextTick as v, onMounted as A, onBeforeUnmount as F } from "vue";
 function $(t, H, l) {
-  const s = i(""), c = i(t.modelValue), J = i(!1), a = i([]), f = h(() => t.formatModel === "json" || t.formatModel === "auto" && typeof t.modelValue == "object");
-  function v(e) {
-    if (f.value && e != null)
+  const s = i(""), g = i(t.modelValue), x = i(!1), a = i([]), c = h(() => t.formatModel === "json" || t.formatModel === "auto" && typeof t.modelValue == "object");
+  function m(e) {
+    if (c.value && e != null)
       try {
         return JSON.stringify(e, null, 2);
       } catch {
@@ -11,7 +11,7 @@ function $(t, H, l) {
     return e ?? "";
   }
   function y(e) {
-    if (f.value && typeof e == "string")
+    if (c.value && typeof e == "string")
       try {
         return JSON.parse(e);
       } catch {
@@ -19,15 +19,14 @@ function $(t, H, l) {
       }
     return e;
   }
-  function x(e) {
+  function I(e) {
     const u = y(e);
-    c.value = u, H("update:modelValue", u);
+    g.value = u, H("update:modelValue", u);
   }
-  E(
+  O(
     () => t.modelValue,
     (e) => {
-      const u = JSON.stringify(e), n = JSON.stringify(c.value);
-      u !== n && (c.value = e, s.value = v(e), t.autoGrow && m(() => d()));
+      g.value = e, s.value = m(e), t.autoGrow && v(() => d());
     },
     { immediate: !0, deep: !0 }
   );
@@ -41,21 +40,21 @@ function $(t, H, l) {
     } else
       l.value.style.height = e - 16 + "px";
   };
-  function N(e) {
-    var S;
-    if (!f.value) return;
+  function J(e) {
+    var V;
+    if (!c.value) return;
     const u = l.value;
     if (!u) return;
-    const n = u.selectionStart, o = s.value, r = "  ", g = o.slice(0, n), j = o.slice(n), C = g.lastIndexOf(`
+    const n = u.selectionStart, o = s.value, r = "  ", f = o.slice(0, n), E = o.slice(n), N = f.lastIndexOf(`
 `) + 1, w = `
-${((S = g.slice(C).match(/^\s*/)) == null ? void 0 : S[0]) ?? ""}${r}`;
-    s.value = g + w + j, m(() => {
-      const V = n + w.length;
-      u.setSelectionRange(V, V);
+${((V = f.slice(N).match(/^\s*/)) == null ? void 0 : V[0]) ?? ""}${r}`;
+    s.value = f + w + E, v(() => {
+      const S = n + w.length;
+      u.setSelectionRange(S, S);
     }), e.preventDefault();
   }
   A(() => {
-    s.value = v(t.modelValue), m(() => {
+    s.value = m(t.modelValue), v(() => {
       t.autoGrow && d();
     });
   }), F(() => {
@@ -63,8 +62,8 @@ ${((S = g.slice(C).match(/^\s*/)) == null ? void 0 : S[0]) ?? ""}${r}`;
   const M = h(() => {
     var e;
     return !!(a.value.length || (e = t.errorMessages) != null && e.length);
-  }), O = h(() => M.value ? [...t.errorMessages || [], ...a.value].slice(0, t.maxErrors) : []);
-  function I() {
+  }), b = h(() => M.value ? [...t.errorMessages || [], ...a.value].slice(0, t.maxErrors) : []);
+  function j() {
     const e = t.rules || [], u = t.required && !s.value ? null : y(s.value), n = [];
     for (const o of e) {
       const r = typeof o == "function" ? o(u) : o;
@@ -72,19 +71,19 @@ ${((S = g.slice(C).match(/^\s*/)) == null ? void 0 : S[0]) ?? ""}${r}`;
     }
     return a.value = n, n.length === 0;
   }
-  function b() {
+  function C() {
     a.value = [];
   }
   return {
     internalValue: s,
-    isFocused: J,
+    isFocused: x,
     hasError: M,
-    displayedMessages: O,
-    validate: I,
-    resetValidation: b,
-    updateModel: x,
+    displayedMessages: b,
+    validate: j,
+    resetValidation: C,
+    updateModel: I,
     adjustHeight: d,
-    handleJsonEnter: N
+    handleJsonEnter: J
   };
 }
 export {

package/package.json

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