adverich-kun-ui 0.1.329 → 0.1.331

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

@@ -1,10 +1,10 @@
-import { ref as D, watch as E, computed as f, createElementBlock as r, openBlock as o, normalizeStyle as F, normalizeClass as y, unref as t, createCommentVNode as a, createElementVNode as w, withDirectives as M, renderSlot as s, createBlock as C, withKeys as j, withModifiers as H, createVNode as K, createTextVNode as V, toDisplayString as g, Fragment as R, renderList as T } from "vue";
+import { ref as D, watch as E, computed as f, createElementBlock as r, openBlock as o, mergeProps as F, unref as t, createCommentVNode as a, createElementVNode as $, withDirectives as M, renderSlot as s, createBlock as w, withKeys as j, normalizeClass as C, withModifiers as H, createVNode as K, createTextVNode as V, toDisplayString as g, Fragment as R, renderList as T } from "vue";
 import h from "../../../KunIcon/src/components/KunIcon.vue.js";
 import { useCheckboxModel as L } from "../composables/useCheckboxModel.js";
-import { useValidation as q } from "../composables/useValidation.js";
-import { vRipple as G } from "../../../../directives/ripple.js";
-import { icons as v } from "../../../../icons/index.js";
-const J = ["name", "checked", "value"], P = ["aria-checked", "aria-disabled", "tabindex"], Q = {
+import { useValidation as P } from "../composables/useValidation.js";
+import { vRipple as q } from "../../../../directives/ripple.js";
+import { icons as y } from "../../../../icons/index.js";
+const G = ["name", "checked", "value"], J = ["aria-checked", "aria-disabled", "tabindex"], Q = {
   key: 1,
   class: "cursor-pointer"
 }, U = {
@@ -60,49 +60,49 @@ const J = ["name", "checked", "value"], P = ["aria-checked", "aria-disabled", "t
     "click:append",
     "click:prepend"
   ],
-  setup(b, { expose: I, emit: N }) {
-    const c = N, e = b, d = D(e.focused ?? !1);
-    E(() => e.focused, (i) => d.value = i);
+  setup(v, { expose: I, emit: N }) {
+    const c = N, e = v, d = D(e.focused ?? !1);
+    E(() => e.focused, (n) => d.value = n);
     const {
       isChecked: p,
       toggle: u,
       internalValue: W
     } = L(e, c), {
       errorMessages: m,
-      isValid: k,
-      validate: x,
+      isValid: b,
+      validate: k,
       resetValidation: z
-    } = q(e, W);
-    I({ validate: x, resetValidation: z });
-    const O = f(() => e.indeterminate ? e.indeterminateIcon || v.checkboxIndeterminate : p.value ? e.trueIcon || v.checkboxOn : e.falseIcon || v.checkboxBlank), A = f(() => [
+    } = P(e, W);
+    I({ validate: k, resetValidation: z });
+    const O = f(() => e.indeterminate ? e.indeterminateIcon || y.checkboxIndeterminate : p.value ? e.trueIcon || y.checkboxOn : e.falseIcon || y.checkboxBlank), A = f(() => [
       typeof e.iconColor == "string" ? `text-${e.iconColor}` : "",
       e.glow && d.value ? "opacity-100" : "opacity-70"
-    ]), S = f(() => ({
+    ]), x = f(() => ({
       sm: "w-4 h-4 text-sm",
       md: "w-5 h-5 text-base",
       lg: "w-6 h-6 text-lg"
     })[e.size] || e.size);
-    return (i, n) => {
-      var B;
-      return o(), r("div", {
-        class: y([
+    return (n, i) => {
+      var S;
+      return o(), r("div", F({
+        class: [
           "kun-checkbox",
           "flex",
-          b.direction === "vertical" ? "flex-col items-start" : "flex-row items-center",
+          v.direction === "vertical" ? "flex-col items-start" : "flex-row items-center",
           "gap-2",
           e.color && `text-${e.color}`,
           {
             "opacity-50 pointer-events-none": e.disabled || e.readonly,
-            "text-red-600": e.error || !t(k),
+            "text-red-600": e.error || !t(b),
             "focus-within:ring-2 ring-primary-500": d.value
           }
-        ]),
-        style: F({
+        ],
+        style: {
           width: e.width && `${e.width}px`,
           minWidth: e.minWidth && `${e.minWidth}px`,
           maxWidth: e.maxWidth && `${e.maxWidth}px`
-        })
-      }, [
+        }
+      }, n.$attrs), [
         e.name ? (o(), r("input", {
           key: 0,
           type: "checkbox",
@@ -110,71 +110,71 @@ const J = ["name", "checked", "value"], P = ["aria-checked", "aria-disabled", "t
           checked: t(p),
           value: e.value ?? e.trueValue,
           class: "hidden"
-        }, null, 8, J)) : a("", !0),
-        w("div", {
+        }, null, 8, G)) : a("", !0),
+        $("div", {
           class: "flex items-center gap-2",
-          onClick: n[0] || (n[0] = (l) => i.$emit("click:prepend"))
+          onClick: i[0] || (i[0] = (l) => n.$emit("click:prepend"))
         }, [
-          s(i.$slots, "prepend"),
-          e.prependIcon ? (o(), C(h, {
+          s(n.$slots, "prepend"),
+          e.prependIcon ? (o(), w(h, {
             key: 0,
             icon: e.prependIcon
           }, null, 8, ["icon"])) : a("", !0)
         ]),
         M((o(), r("div", {
-          class: y(["relative inline-flex items-center justify-center cursor-pointer", [S.value]]),
+          class: C(["relative inline-flex items-center justify-center cursor-pointer", [x.value]]),
           role: "checkbox",
           "aria-checked": e.indeterminate ? "mixed" : t(p),
           "aria-disabled": e.disabled,
           tabindex: e.disabled ? -1 : 0,
-          onClick: n[1] || (n[1] = (...l) => t(u) && t(u)(...l)),
-          onFocus: n[2] || (n[2] = () => {
+          onClick: i[1] || (i[1] = (...l) => t(u) && t(u)(...l)),
+          onFocus: i[2] || (i[2] = () => {
             d.value = !0, c("update:focused", !0);
           }),
-          onBlur: n[3] || (n[3] = () => {
+          onBlur: i[3] || (i[3] = () => {
             var l;
-            d.value = !1, c("update:focused", !1), (l = e.validateOn) != null && l.includes("blur") && t(x)();
+            d.value = !1, c("update:focused", !1), (l = e.validateOn) != null && l.includes("blur") && t(k)();
           }),
-          onKeydown: n[4] || (n[4] = j(H((...l) => t(u) && t(u)(...l), ["prevent"]), ["space"]))
+          onKeydown: i[4] || (i[4] = j(H((...l) => t(u) && t(u)(...l), ["prevent"]), ["space"]))
         }, [
           K(h, {
             icon: O.value,
-            class: y([...A.value, S.value])
+            class: C([...A.value, x.value])
           }, null, 8, ["icon", "class"]),
-          s(i.$slots, "input")
-        ], 42, P)), [
-          [t(G), e.ripple]
+          s(n.$slots, "input")
+        ], 42, J)), [
+          [t(q), e.ripple]
         ]),
-        e.label || i.$slots.label ? (o(), r("div", Q, [
-          s(i.$slots, "label", {
+        e.label || n.$slots.label ? (o(), r("div", Q, [
+          s(n.$slots, "label", {
             label: e.label
           }, () => [
             V(g(e.label), 1)
           ])
         ])) : a("", !0),
-        w("div", {
+        $("div", {
           class: "flex items-center gap-2",
-          onClick: n[5] || (n[5] = (l) => i.$emit("click:append"))
+          onClick: i[5] || (i[5] = (l) => n.$emit("click:append"))
         }, [
-          s(i.$slots, "append"),
-          e.appendIcon ? (o(), C(h, {
+          s(n.$slots, "append"),
+          e.appendIcon ? (o(), w(h, {
             key: 0,
             icon: e.appendIcon
           }, null, 8, ["icon"])) : a("", !0)
         ]),
-        !e.hideDetails && ((B = t(m)) != null && B.length || e.hint || e.persistentHint) ? (o(), r("div", U, [
-          s(i.$slots, "details", {}, () => {
+        !e.hideDetails && ((S = t(m)) != null && S.length || e.hint || e.persistentHint) ? (o(), r("div", U, [
+          s(n.$slots, "details", {}, () => {
             var l;
             return [
-              (e.error || !t(k)) && ((l = t(m)) != null && l.length) ? (o(), r("div", X, [
-                (o(!0), r(R, null, T(t(m).slice(0, Number(e.maxErrors)), ($) => s(i.$slots, "message", { message: $ }, () => [
-                  V(g($), 1)
+              (e.error || !t(b)) && ((l = t(m)) != null && l.length) ? (o(), r("div", X, [
+                (o(!0), r(R, null, T(t(m).slice(0, Number(e.maxErrors)), (B) => s(n.$slots, "message", { message: B }, () => [
+                  V(g(B), 1)
                 ])), 256))
               ])) : e.hint || e.persistentHint ? (o(), r("div", Y, g(e.hint), 1)) : a("", !0)
             ];
           })
         ])) : a("", !0)
-      ], 6);
+      ], 16);
     };
   }
 };

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

@@ -1,47 +1,48 @@
-import { ref as L, computed as p, createElementBlock as l, openBlock as s, normalizeClass as m, renderSlot as i, createElementVNode as a, normalizeProps as y, guardReactiveProps as k, unref as n, createCommentVNode as d, toDisplayString as b, createBlock as h, resolveDynamicComponent as C, Fragment as q, renderList as J, withDirectives as O, vShow as Q, createTextVNode as U } from "vue";
-import { kunTextareaProps as W } from "../composables/KunTextareaProps.js";
-import { useKunTextarea as X } from "../composables/useKunTextareaComposable.js";
+import { ref as q, computed as p, createElementBlock as l, openBlock as s, normalizeClass as m, renderSlot as i, createElementVNode as a, normalizeProps as y, guardReactiveProps as k, unref as t, createCommentVNode as d, toDisplayString as b, createBlock as h, resolveDynamicComponent as C, Fragment as J, renderList as O, withDirectives as Q, vShow as U, createTextVNode as W } from "vue";
+import { kunTextareaProps as X } from "../composables/KunTextareaProps.js";
+import { useKunTextarea as Y } from "../composables/useKunTextareaComposable.js";
 import { renderIconSlot as $ } from "../../../../utils/renderIcon.js";
-const Y = {
+const Z = {
   key: 0,
   class: "block text-sm font-medium mb-1"
-}, Z = { class: "relative" }, x = {
+}, x = { class: "relative" }, _ = {
   key: 0,
   class: "absolute left-2 top-2 flex items-center"
-}, _ = {
+}, ee = {
   key: 1,
   class: "absolute left-2 top-2 ml-1"
-}, ee = ["value", "rows", "disabled", "readonly", "placeholder"], re = {
+}, oe = ["value", "rows", "disabled", "readonly", "placeholder"], re = {
   key: 3,
   class: "absolute right-2 top-2 mr-1"
-}, oe = {
+}, te = {
   key: 4,
   class: "absolute right-2 top-2 flex items-center"
 }, ne = {
   key: 5,
   class: "mt-1"
-}, te = { class: "h-1 w-full bg-gray-200 rounded overflow-hidden" }, se = {
+}, se = { class: "h-1 w-full bg-gray-200 rounded overflow-hidden" }, le = {
   key: 7,
   class: "text-xs text-right mt-1 text-gray-400"
-}, le = { key: 0 }, pe = {
+}, ae = { key: 0 }, ce = {
   __name: "KunTextarea",
-  props: W,
+  props: X,
   emits: ["update:modelValue", "click:clear", "click:control", "update:focused", "mousedown:control"],
-  setup(B, { expose: R, emit: S }) {
-    const r = B, V = S, u = L(null), {
+  setup(B, { expose: S, emit: D }) {
+    const o = B, R = D, u = q(null), {
       isFocused: v,
       internalValue: c,
-      updateValue: D,
+      rootRef: V,
+      updateValue: F,
       handleClear: z,
-      adjustHeight: F,
-      validate: M,
-      reset: T,
-      resetValidation: A,
+      adjustHeight: M,
+      validate: T,
+      reset: A,
+      resetValidation: E,
       hasError: f,
       displayedMessages: w
-    } = X(r, V, u), E = p(() => {
-      const e = !!r.bgColor;
-      switch (r.variant) {
+    } = Y(o, R, u), G = p(() => {
+      const e = !!o.bgColor;
+      switch (o.variant) {
         case "filled":
           return [
             e ? "" : "bg-gray-100 dark:bg-gray-900",
@@ -59,8 +60,8 @@ const Y = {
         default:
           return "";
       }
-    }), G = p(() => {
-      switch (r.density) {
+    }), N = p(() => {
+      switch (o.density) {
         case "comfortable":
           return "py-2";
         case "compact":
@@ -68,108 +69,115 @@ const Y = {
         default:
           return "";
       }
-    }), N = p(() => [
+    }), P = p(() => [
       "w-full resize-none p-2 transition-colors duration-150",
-      r.inputClass,
+      o.inputClass,
       {
-        "rounded-md": !r.tile,
-        "rounded-none": r.tile,
-        [`rounded-${r.rounded}`]: typeof r.rounded == "string" || typeof r.rounded == "number",
-        "shadow-md": r.variant === "solo" && !r.flat,
-        "shadow-none": r.flat,
-        [`text-${r.textColor}`]: r.textColor,
-        [`${r.bgColor}`]: r.bgColor,
-        "text-gray-500 bg-gray-200": r.disabled,
-        "focus:outline-none focus:ring-2": !r.disabled,
-        [`focus:ring-${r.color}`]: r.color && !r.disabled && !f.value,
+        "rounded-md": !o.tile,
+        "rounded-none": o.tile,
+        [`rounded-${o.rounded}`]: typeof o.rounded == "string" || typeof o.rounded == "number",
+        "shadow-md": o.variant === "solo" && !o.flat,
+        "shadow-none": o.flat,
+        [`text-${o.textColor}`]: o.textColor,
+        [`${o.bgColor}`]: o.bgColor,
+        "text-gray-500 bg-gray-200": o.disabled,
+        "focus:outline-none focus:ring-2": !o.disabled,
+        [`focus:ring-${o.color}`]: o.color && !o.disabled && !f.value,
         "border-red-500 ring-red-500 focus:ring-red-500": f.value,
-        "resize-none": r.noResize || r.autoGrow,
-        resize: !r.noResize && !r.autoGrow
+        "resize-none": o.noResize || o.autoGrow,
+        resize: !o.noResize && !o.autoGrow
       }
-    ]), P = p(() => [
+    ]), H = p(() => [
       "relative w-full",
-      r.class,
-      r.wrapperClass
-    ]), I = p(() => r.counter === !0 ? 25 : typeof r.counter == "number" || typeof r.counter == "string" ? r.counter : null), H = p(() => r.persistentCounter ? !0 : !!r.counter && v.value), K = p(() => typeof r.clearIcon == "string" ? r.clearIcon : "i-heroicons-x-mark-20-solid");
-    function g(e, t) {
-      V(`click:${t}`, e);
+      o.class,
+      o.wrapperClass
+    ]), I = p(() => o.counter === !0 ? 25 : typeof o.counter == "number" || typeof o.counter == "string" ? o.counter : null), K = p(() => o.persistentCounter ? !0 : !!o.counter && v.value), j = p(() => typeof o.clearIcon == "string" ? o.clearIcon : "i-heroicons-x-mark-20-solid");
+    function g(e, n) {
+      R(`click:${n}`, e);
     }
-    return R({
-      validate: M,
-      reset: T,
-      resetValidation: A,
+    return S({
+      validate: T,
+      reset: A,
+      resetValidation: E,
       errorMessages: w,
-      isValid: p(() => !f.value)
-    }), (e, t) => (s(), l("div", {
-      class: m(P.value)
+      isValid: p(() => !f.value),
+      rootRef: V,
+      focus: () => {
+        var e;
+        return (e = u.value) == null ? void 0 : e.focus();
+      }
+    }), (e, n) => (s(), l("div", {
+      class: m(H.value),
+      ref_key: "rootRef",
+      ref: V
     }, [
-      i(e.$slots, "label", y(k({ label: e.label, isFocused: n(v), isActive: !!n(c), controlRef: u.value, focus: () => {
-        var o;
-        return (o = u.value) == null ? void 0 : o.focus();
+      i(e.$slots, "label", y(k({ label: e.label, isFocused: t(v), isActive: !!t(c), controlRef: u.value, focus: () => {
+        var r;
+        return (r = u.value) == null ? void 0 : r.focus();
       }, blur: () => {
-        var o;
-        return (o = u.value) == null ? void 0 : o.blur();
-      }, props: r })), () => [
-        e.label ? (s(), l("label", Y, b(e.label), 1)) : d("", !0)
+        var r;
+        return (r = u.value) == null ? void 0 : r.blur();
+      }, props: o })), () => [
+        e.label ? (s(), l("label", Z, b(e.label), 1)) : d("", !0)
       ]),
-      a("div", Z, [
-        e.prependIcon || e.$slots.prepend ? (s(), l("div", x, [
+      a("div", x, [
+        e.prependIcon || e.$slots.prepend ? (s(), l("div", _, [
           i(e.$slots, "prepend", y(k(e.prependSlotBindings)), () => [
             a("div", {
-              onClick: t[0] || (t[0] = (o) => g(o, "prepend"))
+              onClick: n[0] || (n[0] = (r) => g(r, "prepend"))
             }, [
-              (s(), h(C(n($)(e.prependIcon))))
+              (s(), h(C(t($)(e.prependIcon))))
             ])
           ])
         ])) : d("", !0),
-        e.prependInnerIcon || e.$slots["prepend-inner"] ? (s(), l("div", _, [
+        e.prependInnerIcon || e.$slots["prepend-inner"] ? (s(), l("div", ee, [
           i(e.$slots, "prepend-inner", {}, () => [
             a("div", {
-              onClick: t[1] || (t[1] = (o) => g(o, "prependInner"))
+              onClick: n[1] || (n[1] = (r) => g(r, "prependInner"))
             }, [
-              (s(), h(C(n($)(e.prependInnerIcon))))
+              (s(), h(C(t($)(e.prependInnerIcon))))
             ])
           ])
         ])) : d("", !0),
         a("textarea", {
           ref_key: "textareaRef",
           ref: u,
-          value: n(c),
+          value: t(c),
           rows: e.rows,
           disabled: e.disabled,
           readonly: e.readonly,
           placeholder: e.placeholder,
-          onInput: t[2] || (t[2] = (o) => {
-            n(D)(o.target.value), e.autoGrow && n(F)();
+          onInput: n[2] || (n[2] = (r) => {
+            t(F)(r.target.value), e.autoGrow && t(M)();
           }),
-          onFocus: t[3] || (t[3] = (o) => {
+          onFocus: n[3] || (n[3] = (r) => {
             v.value = !0, e.$emit("update:focused", !0);
           }),
-          onBlur: t[4] || (t[4] = (o) => {
+          onBlur: n[4] || (n[4] = (r) => {
             v.value = !1, e.$emit("update:focused", !1);
           }),
-          onClick: t[5] || (t[5] = (o) => e.$emit("click:control", o)),
-          onMousedown: t[6] || (t[6] = (o) => e.$emit("mousedown:control", o)),
-          class: m([E.value, G.value, N.value])
-        }, null, 42, ee),
-        e.clearable && n(c) ? (s(), l("div", {
+          onClick: n[5] || (n[5] = (r) => e.$emit("click:control", r)),
+          onMousedown: n[6] || (n[6] = (r) => e.$emit("mousedown:control", r)),
+          class: m([G.value, N.value, P.value])
+        }, null, 42, oe),
+        e.clearable && t(c) ? (s(), l("div", {
           key: 2,
           class: m(["absolute right-2 top-2", { "opacity-100": e.persistentClear, "hover:opacity-100 opacity-0 transition-opacity duration-200": !e.persistentClear }])
         }, [
-          i(e.$slots, "clear", y(k({ isActive: !!n(c), isFocused: n(v), controlRef: u.value, focus: () => {
-            var o;
-            return (o = u.value) == null ? void 0 : o.focus();
+          i(e.$slots, "clear", y(k({ isActive: !!t(c), isFocused: t(v), controlRef: u.value, focus: () => {
+            var r;
+            return (r = u.value) == null ? void 0 : r.focus();
           }, blur: () => {
-            var o;
-            return (o = u.value) == null ? void 0 : o.blur();
-          }, props: r })), () => [
+            var r;
+            return (r = u.value) == null ? void 0 : r.blur();
+          }, props: o })), () => [
             a("button", {
               type: "button",
-              onClick: t[7] || (t[7] = (...o) => n(z) && n(z)(...o)),
+              onClick: n[7] || (n[7] = (...r) => t(z) && t(z)(...r)),
               class: "text-gray-500 hover:text-gray-700"
             }, [
               a("span", {
-                class: m(K.value)
+                class: m(j.value)
               }, null, 2)
             ])
           ])
@@ -177,18 +185,18 @@ const Y = {
         e.appendInnerIcon || e.$slots["append-inner"] ? (s(), l("div", re, [
           i(e.$slots, "append-inner", {}, () => [
             a("div", {
-              onClick: t[8] || (t[8] = (o) => g(o, "appendInner"))
+              onClick: n[8] || (n[8] = (r) => g(r, "appendInner"))
             }, [
-              (s(), h(C(n($)(e.appendInnerIcon))))
+              (s(), h(C(t($)(e.appendInnerIcon))))
             ])
           ])
         ])) : d("", !0),
-        e.appendIcon || e.$slots.append ? (s(), l("div", oe, [
+        e.appendIcon || e.$slots.append ? (s(), l("div", te, [
           i(e.$slots, "append", y(k(e.appendSlotBindings)), () => [
             a("div", {
-              onClick: t[9] || (t[9] = (o) => g(o, "append"))
+              onClick: n[9] || (n[9] = (r) => g(r, "append"))
             }, [
-              (s(), h(C(n($)(e.appendIcon))))
+              (s(), h(C(t($)(e.appendIcon))))
             ])
           ])
         ])) : d("", !0),
@@ -197,7 +205,7 @@ const Y = {
             color: e.loadingColor,
             isActive: !0
           }, () => [
-            a("div", te, [
+            a("div", se, [
               a("div", {
                 class: m(["h-full transition-all duration-300", [`${e.loadingColor}`]]),
                 style: { width: "100%" }
@@ -205,34 +213,34 @@ const Y = {
             ])
           ])
         ])) : d("", !0),
-        !e.hideDetails || e.hideDetails === "auto" && (n(w).length || e.hint) ? (s(), l("div", {
+        !e.hideDetails || e.hideDetails === "auto" && (t(w).length || e.hint) ? (s(), l("div", {
           key: 6,
-          class: m(["text-xs mt-1 space-y-1", { "text-red-500": n(f), "text-gray-500": !n(f) }])
+          class: m(["text-xs mt-1 space-y-1", { "text-red-500": t(f), "text-gray-500": !t(f) }])
         }, [
           i(e.$slots, "details", {}, () => [
-            n(f) ? (s(!0), l(q, { key: 0 }, J(n(w), (o, j) => i(e.$slots, "message", {
-              key: j,
-              message: o
+            t(f) ? (s(!0), l(J, { key: 0 }, O(t(w), (r, L) => i(e.$slots, "message", {
+              key: L,
+              message: r
             }, () => [
-              a("div", null, b(o), 1)
+              a("div", null, b(r), 1)
             ])), 128)) : e.hint ? i(e.$slots, "hint", {
               key: 1,
               hint: e.hint
             }, () => [
-              O(a("div", null, b(e.hint), 513), [
-                [Q, e.persistentHint || n(v)]
+              Q(a("div", null, b(e.hint), 513), [
+                [U, e.persistentHint || t(v)]
               ])
             ]) : d("", !0)
           ])
         ], 2)) : d("", !0),
-        H.value ? (s(), l("div", se, [
+        K.value ? (s(), l("div", le, [
           i(e.$slots, "counter", {
-            counter: n(c).length,
+            counter: t(c).length,
             max: I.value,
-            value: n(c).length
+            value: t(c).length
           }, () => [
-            U(b(n(c).length), 1),
-            I.value ? (s(), l("span", le, " / " + b(I.value), 1)) : d("", !0)
+            W(b(t(c).length), 1),
+            I.value ? (s(), l("span", ae, " / " + b(I.value), 1)) : d("", !0)
           ])
         ])) : d("", !0)
       ])
@@ -240,5 +248,5 @@ const Y = {
   }
 };
 export {
-  pe as default
+  ce as default
 };

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

@@ -1,6 +1,6 @@
-import { ref as n, watch as N, nextTick as M, onMounted as T, computed as V } from "vue";
-function k(t, s, l) {
-  const h = n(!1), w = n(t.modelValue), g = (e) => {
+import { ref as o, watch as T, nextTick as M, onMounted as b, computed as V } from "vue";
+function A(t, s, a) {
+  const h = o(!1), w = o(t.modelValue), H = o(null), g = (e) => {
     if (t.formatModel === "raw") return String(e ?? "");
     if ((t.formatModel === "json" || t.formatModel === "auto") && typeof e == "object" && e !== null)
       try {
@@ -12,65 +12,66 @@ function k(t, s, l) {
   }, m = (e) => {
     if (t.formatModel === "raw") return e;
     try {
-      const a = JSON.parse(e);
+      const l = JSON.parse(e);
       if (t.formatModel === "json" || t.formatModel === "auto")
-        return a;
+        return l;
     } catch {
     }
     return e;
-  }, o = n(g(t.modelValue));
-  N(() => t.modelValue, (e) => {
-    w.value = e, o.value = g(e), t.autoGrow && M(c);
+  }, u = o(g(t.modelValue));
+  T(() => t.modelValue, (e) => {
+    w.value = e, u.value = g(e), t.autoGrow && M(c);
   });
   const v = (e) => {
-    o.value = e;
-    const a = m(e);
-    s("update:modelValue", a);
-  }, H = () => {
+    u.value = e;
+    const l = m(e);
+    s("update:modelValue", l);
+  }, S = () => {
     v(""), s("click:clear");
   }, c = () => {
-    if (!l.value) return;
-    l.value.style.height = "auto", l.value.style.overflowY = "hidden";
-    const e = l.value.scrollHeight, a = parseFloat(getComputedStyle(l.value).lineHeight || "24"), i = Number(t.maxRows || 0);
+    if (!a.value) return;
+    a.value.style.height = "auto", a.value.style.overflowY = "hidden";
+    const e = a.value.scrollHeight, l = parseFloat(getComputedStyle(a.value).lineHeight || "24"), i = Number(t.maxRows || 0);
     if (t.maxRows && i > 0) {
-      const u = i * a;
-      l.value.style.height = Math.min(e, u) + "px";
+      const n = i * l;
+      a.value.style.height = Math.min(e, n) + "px";
     } else
-      l.value.style.height = e + "px";
+      a.value.style.height = e + "px";
   };
-  T(() => {
+  b(() => {
     t.autoGrow && M(c);
   });
-  const r = n([]), S = n(!0), j = (e = !1) => {
-    const a = t.validationValue ?? m(o.value), i = t.rules ?? [], u = [];
+  const r = o([]), j = o(!0), x = (e = !1) => {
+    const l = t.validationValue ?? m(u.value), i = t.rules ?? [], n = [];
     for (const d of i) {
-      const f = typeof d == "function" ? d(a) : d;
-      typeof f == "string" ? u.push(f) : f === !1 && u.push("Campo inválido");
+      const f = typeof d == "function" ? d(l) : d;
+      typeof f == "string" ? n.push(f) : f === !1 && n.push("Campo inválido");
     }
-    return r.value = u.slice(0, t.maxErrors ?? 1), e || s("update:focused", h.value), r.value;
+    return r.value = n.slice(0, t.maxErrors ?? 1), e || s("update:focused", h.value), r.value;
   }, y = () => {
     r.value = [];
-  }, x = () => {
-    o.value = "", y(), s("update:modelValue", "");
-  }, C = V(() => t.error || r.value.length > 0), E = V(() => {
+  }, C = () => {
+    u.value = "", y(), s("update:modelValue", "");
+  }, E = V(() => t.error || r.value.length > 0), N = V(() => {
     var e;
     return (e = t.errorMessages) != null && e.length ? Array.isArray(t.errorMessages) ? t.errorMessages : [t.errorMessages] : r.value;
   });
   return {
     isFocused: h,
-    internalValue: o,
+    internalValue: u,
+    rootRef: H,
     updateValue: v,
-    handleClear: H,
+    handleClear: S,
     adjustHeight: c,
-    isPristine: S,
-    validate: j,
-    reset: x,
+    isPristine: j,
+    validate: x,
+    reset: C,
     resetValidation: y,
     validationErrors: r,
-    hasError: C,
-    displayedMessages: E
+    hasError: E,
+    displayedMessages: N
   };
 }
 export {
-  k as useKunTextarea
+  A as useKunTextarea
 };

package/package.json

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