@volverjs/ui-vue 0.0.1-beta.12 → 0.0.1-beta.16

package/dist/components/VvTextarea/VvTextarea.es.js

@@ -1,146 +1,285 @@
-import { computed as m, unref as l, defineComponent as z, ref as N, toRefs as F, inject as ee, openBlock as $, createBlock as te, mergeProps as w, createCommentVNode as _, h as re, watch as Z, useSlots as ne, useAttrs as oe, onMounted as se, createElementBlock as E, toDisplayString as q, createElementVNode as V, renderSlot as O, normalizeProps as R, createVNode as P, withDirectives as ie, isRef as ae, vModelText as le, createTextVNode as ue } from "vue";
-import { iconExists as D, Icon as ce, addIcon as fe } from "@iconify/vue";
-import { toReactive as de, useFocus as me, refDebounced as pe, isString as M } from "@vueuse/core";
-const y = {
-  equals(e, r, t) {
-    return t ? this.resolveFieldData(e, t) === this.resolveFieldData(r, t) : this.deepEquals(e, r);
-  },
-  deepEquals(e, r) {
-    if (e === r)
-      return !0;
-    if (e && r && typeof e == "object" && typeof r == "object") {
-      const t = Array.isArray(e), o = Array.isArray(r);
-      let n, s, i;
-      if (t && o) {
-        if (s = e.length, s != r.length)
-          return !1;
-        for (n = s; n-- !== 0; )
-          if (!this.deepEquals(e[n], r[n]))
-            return !1;
-        return !0;
+import { unref as i, toRefs as F, computed as c, h as oe, watch as ie, defineComponent as X, ref as K, inject as se, openBlock as C, createBlock as ae, mergeProps as $, createCommentVNode as w, useSlots as le, onMounted as ue, createElementBlock as D, toDisplayString as q, createElementVNode as E, renderSlot as O, normalizeProps as z, createVNode as V, withDirectives as Z, isRef as ce, vModelText as de, vShow as fe, createTextVNode as me } from "vue";
+import { nanoid as ve } from "nanoid";
+import { toReactive as pe, useFocus as ge, isString as G } from "@vueuse/core";
+import { iconExists as B, Icon as he, addIcon as ye } from "@iconify/vue";
+function J(r, t) {
+  if (r && Object.keys(r).length && t) {
+    if (t.indexOf(".") === -1)
+      return r[t];
+    {
+      const e = t.split(".");
+      let a = r;
+      for (let s = 0, u = e.length; s < u; ++s) {
+        if (r == null)
+          return null;
+        a = a[e[s]];
       }
-      if (t != o)
-        return !1;
-      const d = e instanceof Date, a = r instanceof Date;
-      if (d != a)
-        return !1;
-      if (d && a)
-        return e.getTime() == r.getTime();
-      const h = e instanceof RegExp, u = r instanceof RegExp;
-      if (h != u)
-        return !1;
-      if (h && u)
-        return e.toString() == r.toString();
-      const c = Object.keys(e);
-      if (s = c.length, s !== Object.keys(r).length)
-        return !1;
-      for (n = s; n-- !== 0; )
-        if (!Object.prototype.hasOwnProperty.call(r, c[n]))
-          return !1;
-      for (n = s; n-- !== 0; )
-        if (i = c[n], !this.deepEquals(e[i], r[i]))
-          return !1;
-      return !0;
+      return a;
     }
-    return e !== e && r !== r;
-  },
-  resolveFieldData(e, r) {
-    if (e && Object.keys(e).length && r) {
-      if (r.indexOf(".") === -1)
-        return e[r];
-      {
-        const t = r.split(".");
-        let o = e;
-        for (let n = 0, s = t.length; n < s; ++n) {
-          if (e == null)
-            return null;
-          o = o[t[n]];
+  } else
+    return null;
+}
+function A(r) {
+  return ((t) => t == null || t === "" || Array.isArray(t) && t.length === 0 || !(t instanceof Date) && typeof t == "object" && Object.keys(t).length === 0)(i(r));
+}
+function Se(r) {
+  return typeof r == "string" || r instanceof String;
+}
+function U(r) {
+  var t, e;
+  if (r)
+    return (e = (t = r.match(
+      /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
+    )) == null ? void 0 : t.join("-")) == null ? void 0 : e.toLowerCase();
+}
+function P(r) {
+  return Array.isArray(r) ? r.filter((t) => Se(t)).join(" ") : r;
+}
+function be(r, t) {
+  const {
+    error: e,
+    valid: a,
+    hint: s,
+    loading: u
+  } = t, {
+    hintLabel: n,
+    modelValue: g,
+    valid: p,
+    validLabel: m,
+    error: l,
+    errorLabel: o,
+    ...v
+  } = F(r), d = J(v, "loading"), f = J(v, "loadingLabel"), h = c(() => l.value ? !!(l.value && e || o != null && o.value && Array.isArray(o.value) && o.value.length > 0 || o != null && o.value && !A(o)) : !1), b = c(
+    () => !!(n && n.value || s)
+  ), _ = c(
+    () => !!(m && m.value || a)
+  ), x = c(
+    () => !!(d != null && d.value && u || d != null && d.value && (f != null && f.value))
+  ), N = c(
+    () => b.value || _ || h.value || x.value
+  );
+  return {
+    hasErrors: h,
+    hasHint: b,
+    hasValid: _,
+    hasLoading: x,
+    HintSlot: {
+      name: "HintSlot",
+      props: {
+        params: {
+          type: Object,
+          default: () => ({})
         }
-        return o;
+      },
+      setup(L) {
+        const T = c(() => {
+          const S = pe({
+            hintLabel: n,
+            modelValue: g,
+            valid: p,
+            validLabel: m,
+            error: l,
+            errorLabel: o,
+            loading: d,
+            loadingLabel: f,
+            ...L.params
+          });
+          return l != null && l.value ? (e == null ? void 0 : e(S)) || P(o == null ? void 0 : o.value) || (n == null ? void 0 : n.value) : p != null && p.value ? (a == null ? void 0 : a(S)) || P(m == null ? void 0 : m.value) || (n == null ? void 0 : n.value) : d != null && d.value ? (u == null ? void 0 : u(S)) || P(f == null ? void 0 : f.value) || (n == null ? void 0 : n.value) : (s == null ? void 0 : s(S)) || P(n == null ? void 0 : n.value) || (n == null ? void 0 : n.value);
+        });
+        return {
+          isVisible: N,
+          hasErrors: h,
+          hasValid: _,
+          hintContent: T
+        };
+      },
+      render() {
+        if (this.isVisible)
+          return oe(
+            "small",
+            {
+              role: this.hasErrors || this.hasValid ? "alert" : void 0
+            },
+            this.hintContent
+          );
       }
-    } else
-      return null;
-  },
-  isFunction(e) {
-    return !!(e && e.constructor && e.call && e.apply);
-  },
-  findIndexInList(e, r) {
-    let t = -1;
-    if (r) {
-      for (let o = 0; o < r.length; o++)
-        if (this.equals(r[o], e)) {
-          t = o;
-          break;
-        }
     }
-    return t;
-  },
-  contains(e, r) {
-    if (e != null && r && r.length) {
-      for (const t of r)
-        if (this.equals(e, t))
-          return !0;
+  };
+}
+function _e(r, t, e) {
+  const a = c(
+    () => !!(r.value && t.value === "left" || e.iconLeft)
+  ), s = c(
+    () => !!(r.value && t.value === "right" || e.iconRight)
+  ), u = c(
+    () => !!(r.value && t.value === "top" || e.iconTop)
+  ), n = c(
+    () => !!(r.value && t.value === "bottom" || e.iconBottom)
+  );
+  return {
+    hasIconLeft: a,
+    hasIconRight: s,
+    hasIconTop: u,
+    hasIconBottom: n
+  };
+}
+function xe(r, t) {
+  const { focused: e } = ge(r);
+  return ie(e, (a) => {
+    t(a ? "focus" : "blur", i(r));
+  }), {
+    focused: e
+  };
+}
+function $e(r, t, e = 0) {
+  let a;
+  return typeof e == "string" && (e = parseInt(e)), c({
+    get: () => r == null ? void 0 : r.value,
+    set: (s) => {
+      a && clearTimeout(a), a = setTimeout(() => {
+        t("update:modelValue", s);
+      }, e);
     }
-    return !1;
-  },
-  isEmpty(e) {
-    return e == null || e === "" || Array.isArray(e) && e.length === 0 || !(e instanceof Date) && typeof e == "object" && Object.keys(e).length === 0;
-  },
-  isNotEmpty(e) {
-    return !this.isEmpty(e);
-  },
-  pickBy(e, r) {
-    return Object.fromEntries(
-      Object.entries(e).filter(([t]) => r(t))
-    );
+  });
+}
+function we(r, t) {
+  const e = c(() => {
+    const u = i(r);
+    return G(u) ? u.length : 0;
+  }), a = c(() => {
+    const u = i(r) || "";
+    return !G(u) || t.mode === !1 ? 0 : t.mode === !0 ? u.length : i(t.upperLimit) - u.length;
+  }), s = c(() => t.mode === !1 ? "" : t.mode === !0 && t.upperLimit && t.upperLimit > 0 ? `${a.value}/${i(t.upperLimit)}` : a.value);
+  return {
+    textLength: e,
+    textLimitLength: a,
+    formattedTextLimitLength: s
+  };
+}
+function Q(r, t) {
+  const e = { [`${r}`]: !0 };
+  return {
+    bemCssClasses: c(() => Object.keys(t).reduce((s, u) => {
+      const n = i(t[u]) || !1;
+      if (!n)
+        return s;
+      if (u === "modifiers") {
+        const g = Array.isArray(n) ? n : n.split(" ");
+        return {
+          ...s,
+          ...g.reduce(
+            (p, m) => ({
+              ...p,
+              [`${r}--${U(m)}`]: !0
+            }),
+            {}
+          )
+        };
+      } else
+        return {
+          ...s,
+          [`${r}--${U(u)}`]: n
+        };
+    }, e) || {})
+  };
+}
+const Ie = "ds", Ve = {
+  color: String,
+  width: {
+    type: [String, Number]
   },
-  removeFromList(e, r) {
-    const t = this.findIndexInList(e, r);
-    return t > -1 ? r.filter((o, n) => n !== t) : r;
+  height: {
+    type: [String, Number]
   },
-  isString(e) {
-    return typeof e == "string" || e instanceof String;
+  name: {
+    type: String,
+    required: !0
   },
-  propsToObject(e) {
-    return Object.keys(e).reduce((r, t) => {
-      var o, n, s, i, d;
-      return this.isFunction(e[t]) ? r[t] = e[t]() : Array.isArray(e[t]) ? r[t] = e[t][0]() : (o = e[t]) != null && o.type && (Array.isArray(e[t].type) ? r[t] = ((n = e[t]) == null ? void 0 : n.default) || ((s = e[t]) == null ? void 0 : s.type[0]()) : r[t] = ((i = e[t]) == null ? void 0 : i.default) || ((d = e[t]) == null ? void 0 : d.type())), r;
-    }, {});
+  provider: {
+    type: String
   },
-  filterArray(e, r, t) {
-    return e.filter((o) => r.some((n) => typeof n == "string" ? o[t] == n : this.equals(
-      o[t],
-      n[t]
-    )));
+  prefix: {
+    type: String,
+    default: "normal"
   },
-  kebabCase(e) {
-    var r, t;
-    if (e)
-      return (t = (r = e.match(
-        /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
-      )) == null ? void 0 : r.join("-")) == null ? void 0 : t.toLowerCase();
+  src: String,
+  horizontalFlip: Boolean,
+  verticalFlip: Boolean,
+  flip: String,
+  mode: String,
+  inline: Boolean,
+  rotate: [Number, String],
+  onLoad: Function,
+  svg: String,
+  modifiers: {
+    type: [String, Array]
+  }
+}, Be = {
+  name: "VvIcon"
+}, R = /* @__PURE__ */ X({
+  ...Be,
+  props: Ve,
+  setup(r) {
+    const t = r, e = K(!0), { modifiers: a } = F(t), s = se(Ie), { bemCssClasses: u } = Q("vv-icon", {
+      modifiers: a
+    }), n = c(() => t.provider || (s == null ? void 0 : s.provider)), g = c(() => {
+      const l = t.name || "", o = `@${n.value}:${t.prefix}:${t.name}`;
+      return B(l) ? l : B(o) ? o : (s == null ? void 0 : s.iconsCollections.find((v) => {
+        const d = `@${n.value}:${v.prefix}:${l}`;
+        if (B(d))
+          return d;
+      })) || l;
+    });
+    function p(l) {
+      let o = null;
+      if (typeof window > "u") {
+        const { JSDOM: h } = require("jsdom");
+        o = new h().window;
+      }
+      return (o ? new o.DOMParser() : new window.DOMParser()).parseFromString(l, "text/html").querySelector("svg");
+    }
+    function m(l) {
+      const o = p(l), v = (o == null ? void 0 : o.innerHTML.trim()) || "";
+      o && v && ye(`@${n.value}:${t.prefix}:${t.name}`, {
+        body: v,
+        height: o.viewBox.baseVal.height,
+        width: o.viewBox.baseVal.width
+      });
+    }
+    return s && (t.src && !B(`@${n.value}:${t.prefix}:${t.name}`) ? (e.value = !1, s.fetchIcon(t.src).then((l) => {
+      l && (m(l), e.value = !0);
+    }).catch((l) => {
+      throw new Error(`During fetch icon: ${l == null ? void 0 : l.message}`);
+    })) : t.svg && m(t.svg)), (l, o) => e.value ? (C(), ae(i(he), $({
+      key: 0,
+      class: i(u)
+    }, {
+      ...l.$props,
+      provider: i(n),
+      icon: i(g)
+    }), null, 16, ["class"])) : w("", !0);
   }
-}, ge = {
+}), Pe = {
   valid: Boolean,
   validLabel: [String, Array]
-}, he = {
+}, Ce = {
   error: Boolean,
   errorLabel: [String, Array]
-}, ye = {
+}, Ae = {
   loading: Boolean,
   loadingLabel: String
-}, ve = {
+}, Ne = {
   modifiers: [String, Array]
-}, be = {
+}, Le = {
   hintLabel: { type: String, default: "" }
-}, xe = {
+}, Te = {
   limit: {
     type: [Boolean, String],
     default: !1,
-    validator: (e) => [!0, !1, "countdown"].includes(e)
+    validator: (r) => [!0, !1, "countdown"].includes(r)
   }
-}, Se = {
-  id: String,
+}, ke = {
+  id: [String, Number],
   name: { type: String, required: !0 },
   autocomplete: { type: String, default: "off" },
   autofocus: Boolean,
@@ -151,400 +290,152 @@ const y = {
   required: Boolean,
   disabled: Boolean,
   readonly: Boolean
-}, Ae = {
+}, De = {
   debounce: Number
-}, H = {
+}, W = {
   LEFT: "left",
   RIGHT: "right"
-}, _e = {
+}, Ee = {
   hard: "hard",
   soft: "soft"
-}, Be = ["update:modelValue", "focus", "blur"], $e = {
-  ...ge,
-  ...he,
-  ...be,
-  ...ye,
-  ...ve,
-  ...xe,
-  ...Se,
+}, Oe = ["update:modelValue", "focus", "blur"], Re = {
+  ...Pe,
+  ...Ce,
+  ...Le,
   ...Ae,
-  modelValue: null,
+  ...Ne,
+  ...Te,
+  ...ke,
+  ...De,
+  id: [String, Number],
+  modelValue: {
+    type: [String],
+    default: void 0
+  },
   cols: { type: Number, default: 50 },
   rows: { type: Number, default: 5 },
   icon: { type: String, default: "" },
   iconPosition: {
     type: String,
-    validation: (e) => Object.values(H).includes(e),
-    default: H.RIGHT
+    validation: (r) => Object.values(W).includes(r),
+    default: W.RIGHT
   },
   floating: Boolean,
-  wrap: { type: String, default: _e.soft },
+  wrap: { type: String, default: Ee.soft },
   autoclear: Boolean,
   resizable: Boolean
-}, we = "ds", Ce = {
-  color: String,
-  width: {
-    type: [String, Number]
-  },
-  height: {
-    type: [String, Number]
-  },
-  name: {
-    type: String,
-    required: !0
-  },
-  provider: {
-    type: String
-  },
-  prefix: {
-    type: String,
-    default: "normal"
-  },
-  src: String,
-  horizontalFlip: Boolean,
-  verticalFlip: Boolean,
-  flip: String,
-  mode: String,
-  inline: Boolean,
-  rotate: [Number, String],
-  onLoad: Function,
-  svg: String,
-  modifiers: {
-    type: [String, Array]
-  }
-};
-function Ie(e, r) {
-  const t = { [`${e}`]: !0 };
-  return {
-    bemCssClasses: m(() => Object.keys(r).reduce((n, s) => {
-      const i = l(r[s]) || !1;
-      if (!i)
-        return n;
-      if (s === "modifiers") {
-        const d = Array.isArray(i) ? i : [i];
-        return {
-          ...n,
-          ...d.reduce(
-            (a, h) => ({
-              ...a,
-              [`${e}--${y.kebabCase(
-                h
-              )}`]: !0
-            }),
-            {}
-          )
-        };
-      } else
-        return {
-          ...n,
-          [`${e}--${y.kebabCase(s)}`]: i
-        };
-    }, t) || {})
-  };
-}
-function Ee(e, r) {
-  const t = { [`${e}`]: !0 };
-  return Object.keys(r).reduce((o, n) => {
-    const s = l(r[n]) || !1;
-    if (!s)
-      return o;
-    if (n === "modifiers") {
-      const i = Array.isArray(s) ? s : [s];
-      return {
-        ...o,
-        ...i.reduce(
-          (d, a) => ({
-            ...d,
-            [`${e}--${y.kebabCase(
-              a
-            )}`]: !0
-          }),
-          {}
-        )
-      };
-    } else
-      return {
-        ...o,
-        [`${e}--${y.kebabCase(n)}`]: s
-      };
-  }, t) || {};
-}
-const L = /* @__PURE__ */ z({
-  __name: "VvIcon",
-  props: Ce,
-  setup(e) {
-    const r = e, t = N(!0), { modifiers: o } = F(r), n = ee(we), { bemCssClasses: s } = Ie("vv-icon", {
-      modifiers: o
-    }), i = m(() => r.provider || (n == null ? void 0 : n.provider)), d = m(() => {
-      const u = r.name || "", c = `@${i.value}:${r.prefix}:${r.name}`;
-      return D(u) ? u : D(c) ? c : (n == null ? void 0 : n.iconsCollections.find((p) => {
-        const f = `@${i.value}:${p.prefix}:${u}`;
-        if (D(f))
-          return f;
-      })) || u;
-    });
-    function a(u) {
-      let c = null;
-      if (typeof window > "u") {
-        const { JSDOM: v } = require("jsdom");
-        c = new v().window;
-      }
-      return (c ? new c.DOMParser() : new window.DOMParser()).parseFromString(u, "text/html").querySelector("svg");
-    }
-    function h(u) {
-      const c = a(u), p = (c == null ? void 0 : c.innerHTML.trim()) || "";
-      c && p && fe(`@${i.value}:${r.prefix}:${r.name}`, {
-        body: p,
-        height: c.viewBox.baseVal.height,
-        width: c.viewBox.baseVal.width
-      });
-    }
-    return n && (r.src ? (t.value = !1, n.fetchIcon(r.src).then((u) => {
-      u && (h(u), t.value = !0);
-    }).catch((u) => {
-      throw new Error(`During fetch icon: ${u == null ? void 0 : u.message}`);
-    })) : r.svg && h(r.svg)), (u, c) => t.value ? ($(), te(l(ce), w({
-      key: 0,
-      class: l(s)
-    }, {
-      ...u.$props,
-      provider: l(i),
-      icon: l(d)
-    }), null, 16, ["class"])) : _("", !0);
-  }
-});
-function k(e) {
-  return Array.isArray(e) ? e.filter((r) => y.isString(r)).reduce((r, t) => r.length > 0 ? r + `
-` + t : t, "") : e;
-}
-function Pe(e, r) {
-  return {
-    name: "HintSlot",
-    props: {
-      params: {
-        type: Object,
-        default: () => ({})
-      }
-    },
-    setup(t) {
-      const o = F(e), {
-        error: n,
-        valid: s,
-        hint: i,
-        loading: d
-      } = r, {
-        hintLabel: a,
-        modelValue: h,
-        valid: u,
-        validLabel: c,
-        error: p,
-        errorLabel: f
-      } = o, g = y.resolveFieldData(o, "loading"), v = y.resolveFieldData(
-        o,
-        "loadingLabel"
-      ), S = m(() => p.value ? !!(p.value && n || (f == null ? void 0 : f.value) && Array.isArray(f.value) && f.value.length > 0 || (f == null ? void 0 : f.value) && y.isNotEmpty(f.value)) : !1), C = m(() => !!(a && a.value || i || s || c && c.value || S.value || (g == null ? void 0 : g.value) && d || (g == null ? void 0 : g.value) && (v == null ? void 0 : v.value))), I = m(() => {
-        const A = de({
-          hintLabel: a,
-          modelValue: h,
-          valid: u,
-          validLabel: c,
-          error: p,
-          errorLabel: f,
-          loading: g,
-          loadingLabel: v,
-          ...t.params
-        });
-        return p != null && p.value ? (n == null ? void 0 : n(A)) || k(f == null ? void 0 : f.value) || (a == null ? void 0 : a.value) : u != null && u.value ? (s == null ? void 0 : s(A)) || k(c == null ? void 0 : c.value) || (a == null ? void 0 : a.value) : g != null && g.value ? (d == null ? void 0 : d(A)) || k(v == null ? void 0 : v.value) || (a == null ? void 0 : a.value) : (i == null ? void 0 : i(A)) || k(a == null ? void 0 : a.value) || (a == null ? void 0 : a.value);
-      });
-      return {
-        hasHint: C,
-        hintContent: I
-      };
-    },
-    render() {
-      if (this.hasHint)
-        return re(
-          "pre",
-          { style: { "white-space": "pre" } },
-          this.hintContent
-        );
-    }
-  };
-}
-function ke(e, r, t) {
-  const o = m(
-    () => !!(e.value && r.value === "left" || t.iconLeft)
-  ), n = m(
-    () => !!(e.value && r.value === "right" || t.iconRight)
-  ), s = m(
-    () => !!(e.value && r.value === "top" || t.iconTop)
-  ), i = m(
-    () => !!(e.value && r.value === "bottom" || t.iconBottom)
-  );
-  return {
-    hasIconLeft: o,
-    hasIconRight: n,
-    hasIconTop: s,
-    hasIconBottom: i
-  };
-}
-function Oe(e, r) {
-  const { focused: t } = me(e);
-  return Z(t, (o) => {
-    r(o ? "focus" : "blur", e.value);
-  }), {
-    focused: t
-  };
-}
-function De(e, r, t) {
-  const o = N(e == null ? void 0 : e.value), n = pe(
-    o,
-    r || 0
-  );
-  return Z(n, (s) => t("update:modelValue", s)), o;
-}
-function Le(e, r) {
-  const t = m(() => {
-    const s = l(e);
-    return M(s) ? s.length : 0;
-  }), o = m(() => {
-    const s = l(e) || "";
-    return !M(s) || r.mode === !1 ? 0 : r.mode === !0 ? s.length : l(r.upperLimit) - s.length;
-  }), n = m(() => r.mode === !1 ? "" : r.mode === !0 && r.upperLimit && r.upperLimit > 0 ? `${o.value}/${l(r.upperLimit)}` : o.value);
-  return {
-    textLength: t,
-    textLimitLength: o,
-    formattedTextLimitLength: n
-  };
-}
-const Ne = ["for"], Fe = { class: "vv-textarea__wrapper" }, je = {
-  key: 3,
+}, Fe = ["for"], je = { class: "vv-textarea__wrapper" }, He = ["id", "disabled", "readonly", "required"], Me = {
+  key: 2,
   class: "vv-textarea__limit"
-}, Te = {
-  inheritAttrs: !1
-}, Me = /* @__PURE__ */ z({
-  ...Te,
-  __name: "VvTextarea",
-  props: $e,
-  emits: Be,
-  setup(e, { emit: r }) {
-    const t = e, o = ne(), n = oe(), s = N(), { icon: i, iconPosition: d, label: a, modelValue: h, autoclear: u, limit: c } = F(t), p = t.id || t.name, f = `${t.name}-label`, g = `${t.name}-hint`, v = m(
-      () => t.floating && y.isEmpty(t.placeholder) ? " " : t.placeholder
-    ), S = De(h, t.debounce, r), { hasIconLeft: C, hasIconRight: I } = ke(i, d, {
-      iconLeft: o["icon-left"],
-      iconRight: o["icon-right"]
-    }), { focused: A } = Oe(s, r), { textLength: j, formattedTextLimitLength: W } = Le(S, {
-      mode: t.limit,
-      upperLimit: t.maxlength || 0
-    }), G = m(() => [
-      Ee("vv-textarea", {
-        modifiers: t.modifiers,
-        readonly: t.readonly,
-        valid: t.valid,
-        invalid: t.error,
-        loading: t.loading,
-        iconLeft: C,
-        iconRight: I,
-        floating: t.floating && y.isNotEmpty(t.label),
-        dirty: y.isNotEmpty(h == null ? void 0 : h.value),
-        resizable: t.resizable
-      }),
-      n.class
-    ]), U = m(() => {
-      const x = y.pickBy(
-        n,
-        (b) => b.startsWith("data-")
-      );
-      return {
-        style: n.style,
-        ...x
-      };
-    }), J = m(() => {
-      const x = y.pickBy(
-        n,
-        (b) => b.startsWith("aria-")
-      );
-      return {
-        id: p,
-        placeholder: v.value,
-        name: t.name,
-        autocomplete: t.autocomplete,
-        disabled: t.disabled,
-        readonly: t.readonly,
-        minlength: t.minlength,
-        maxlength: t.maxlength,
-        cols: t.cols,
-        rows: t.rows,
-        required: t.required,
-        tabindex: n.tabindex,
-        "aria-invalid": t.error,
-        "aria-valid": !t.valid,
-        "aria-labeledby": f,
-        "aria-describedby": g,
-        "aria-errormessage": g,
-        ...x
-      };
-    }), T = m(() => {
-      const { modelValue: x, valid: b, error: B, maxlength: Q, hintLabel: Y } = t;
+}, qe = {
+  name: "VvInputText"
+}, Ue = /* @__PURE__ */ X({
+  ...qe,
+  props: Re,
+  emits: Oe,
+  setup(r, { emit: t }) {
+    const e = r, a = le(), s = K(), { icon: u, iconPosition: n, label: g, modelValue: p, autoclear: m, limit: l } = F(e), o = c(() => String(e.id || ve())), v = c(() => `${o.value}-hint`), d = c(
+      () => e.floating && A(e.placeholder) ? " " : e.placeholder
+    ), f = $e(p, t, e.debounce), { hasIconLeft: h, hasIconRight: b } = _e(u, n, {
+      iconLeft: a["icon-left"],
+      iconRight: a["icon-right"]
+    }), { focused: _ } = xe(s, t), { textLength: x, formattedTextLimitLength: N } = we(f, {
+      mode: e.limit,
+      upperLimit: e.maxlength || 0
+    }), L = c(() => !A(p)), T = c(() => {
+      if (e.error === !0)
+        return !0;
+      if (e.valid === !0)
+        return !1;
+    }), { HintSlot: S, hasHint: Y, hasErrors: j } = be(e, a), { bemCssClasses: ee } = Q("vv-textarea", {
+      modifiers: e.modifiers,
+      readonly: e.readonly,
+      valid: e.valid,
+      invalid: e.error,
+      loading: e.loading,
+      iconLeft: h,
+      iconRight: b,
+      floating: e.floating && !A(e.label),
+      dirty: L,
+      resizable: e.resizable
+    }), H = c(
+      () => ({
+        placeholder: d.value,
+        name: e.name,
+        autocomplete: e.autocomplete,
+        minlength: e.minlength,
+        maxlength: e.maxlength,
+        cols: e.cols,
+        rows: e.rows,
+        "aria-invalid": T.value,
+        "aria-describedby": !j.value && Y.value ? v.value : void 0,
+        "aria-errormessage": j.value ? v.value : void 0
+      })
+    ), M = c(() => {
+      const { modelValue: y, valid: I, error: k, maxlength: re, hintLabel: ne } = e;
       return {
-        valid: b,
-        error: B,
-        modelValue: x,
-        hintLabel: Y,
-        maxlength: Q,
-        textLength: j
+        valid: I,
+        error: k,
+        modelValue: y,
+        hintLabel: ne,
+        maxlength: re,
+        textLength: x
       };
-    }), X = Pe(t, o);
-    function K() {
-      S.value = "";
+    });
+    function te() {
+      f.value = "";
     }
-    return se(() => {
-      t.autofocus && (A.value = !0);
-    }), (x, b) => ($(), E("div", w(l(U), { class: l(G) }), [
-      l(a) ? ($(), E("label", {
+    return ue(() => {
+      e.autofocus && (_.value = !0);
+    }), (y, I) => (C(), D("div", $(i(H), { class: i(ee) }), [
+      i(g) ? (C(), D("label", {
         key: 0,
-        id: f,
-        for: l(p)
-      }, q(l(a)), 9, Ne)) : _("", !0),
-      V("div", Fe, [
-        l(C) ? O(x.$slots, "icon-left", R(w({ key: 0 }, l(T))), () => [
-          P(L, {
+        for: i(o),
+        class: "vv-textarea__label"
+      }, q(i(g)), 9, Fe)) : w("", !0),
+      E("div", je, [
+        i(h) ? O(y.$slots, "icon-left", z($({ key: 0 }, i(M))), () => [
+          V(R, {
             class: "vv-textarea__icon-left",
-            name: l(i)
+            name: i(u)
           }, null, 8, ["name"])
-        ]) : _("", !0),
-        ie(V("textarea", w({
+        ]) : w("", !0),
+        Z(E("textarea", $({
+          id: i(o),
           ref_key: "input",
           ref: s,
-          "onUpdate:modelValue": b[0] || (b[0] = (B) => ae(S) ? S.value = B : null)
-        }, l(J), {
-          onInput: b[1] || (b[1] = (B) => r("input", B))
-        }), null, 16), [
-          [le, l(S)]
+          "onUpdate:modelValue": I[0] || (I[0] = (k) => ce(f) ? f.value = k : null)
+        }, i(H), {
+          disabled: y.disabled,
+          readonly: y.readonly,
+          required: y.required
+        }), null, 16, He), [
+          [de, i(f)]
         ]),
-        l(u) && l(j) > 0 ? ($(), E("button", {
-          key: 1,
+        Z(E("button", {
           class: "vv-button vv-button--ghost",
-          onClick: K
+          onClick: te
         }, [
-          P(L, { name: "clear-field" })
-        ])) : _("", !0),
-        l(I) ? O(x.$slots, "icon-right", R(w({ key: 2 }, l(T))), () => [
-          P(L, { name: l(i) }, null, 8, ["name"])
-        ]) : _("", !0),
-        l(c) ? ($(), E("span", je, [
-          O(x.$slots, "limit", {}, () => [
-            ue(q(l(W)), 1)
+          V(R, { name: "clear-field" })
+        ], 512), [
+          [fe, i(m) && i(x) > 0]
+        ]),
+        i(b) ? O(y.$slots, "icon-right", z($({ key: 1 }, i(M))), () => [
+          V(R, { name: i(u) }, null, 8, ["name"])
+        ]) : w("", !0),
+        i(l) ? (C(), D("span", Me, [
+          O(y.$slots, "limit", {}, () => [
+            me(q(i(N)), 1)
           ])
-        ])) : _("", !0)
+        ])) : w("", !0)
       ]),
-      P(l(X), {
-        id: g,
+      V(i(S), {
+        id: i(v),
         class: "vv-textarea__hint"
-      })
+      }, null, 8, ["id"])
     ], 16));
   }
 });
 export {
-  Me as default
+  Ue as default
 };