energy-components 1.10.1 → 1.12.0

package/dist/components/textArea.es.js

@@ -1,12 +1,12 @@
-import { defineComponent as G, mergeModels as J, useModel as K, toRefs as L, ref as O, computed as o, createElementBlock as f, openBlock as s, normalizeClass as h, createElementVNode as a, withDirectives as Q, unref as e, vModelText as W, renderSlot as y, createTextVNode as X, createBlock as I, createCommentVNode as i, mergeProps as q, toHandlers as T, toDisplayString as u } from "vue";
-import { R as $ } from "./icon-svg-DuzOdbk1.js";
-import { _ as Y } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/textArea.css';function b(t, _ = !0, d = !0) {
-  return _ && !t.trim() ? (console.warn("Advertencia: El valor no puede estar vacío"), !1) : d && !/^[\w\-:]+$/.test(t) ? (console.warn("Advertencia: El valor contiene caracteres inválidos"), !1) : !0;
+import { defineComponent as Q, mergeModels as W, useModel as X, toRefs as Y, ref as k, computed as o, createElementBlock as h, openBlock as s, normalizeClass as u, createElementVNode as r, withDirectives as Z, unref as e, vModelText as ee, renderSlot as S, createTextVNode as te, createBlock as T, createCommentVNode as i, mergeProps as $, toHandlers as A, toDisplayString as d } from "vue";
+import { R as F } from "./icon-svg-DuzOdbk1.js";
+import { _ as ae } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/textArea.css';function V(t, g = !0, c = !0) {
+  return g && !t.trim() ? (console.warn("Advertencia: El valor no puede estar vacío"), !1) : c && !/^[\w\-:]+$/.test(t) ? (console.warn("Advertencia: El valor contiene caracteres inválidos"), !1) : !0;
 }
-const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea__input-container" }, te = ["id", "name", "maxlength", "minlength", "rows", "disabled"], re = ["for"], ae = { key: 0 }, le = { key: 0 }, ne = { key: 1 }, se = { key: 0 }, oe = /* @__PURE__ */ G({
+const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "maxlength", "minlength", "rows", "disabled"], ne = ["for"], se = { key: 0 }, oe = { key: 0 }, ue = { key: 1 }, ie = { key: 0 }, de = /* @__PURE__ */ Q({
   __name: "text-area",
-  props: /* @__PURE__ */ J({
+  props: /* @__PURE__ */ W({
     /**
      * Etiqueta que se muestra sobre el campo de entrada. y Placeholder
      */
@@ -14,7 +14,7 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
       type: String,
       required: !0,
       validator(t) {
-        return b(t, !0, !0);
+        return V(t, !0, !0);
       }
     },
     /**
@@ -24,7 +24,7 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
       type: String,
       required: !1,
       validator(t) {
-        return b(t, !1, !0);
+        return V(t, !1, !0);
       }
     },
     /**
@@ -34,7 +34,7 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
       type: String,
       required: !1,
       validator(t) {
-        return b(t, !1, !0);
+        return V(t, !1, !0);
       }
     },
     /**
@@ -136,133 +136,143 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
   }),
   emits: ["update:modelValue"],
   setup(t) {
-    const _ = t, d = K(t, "modelValue"), {
-      label: w,
-      id: S,
-      disabled: p,
+    const g = t, c = X(t, "modelValue"), {
+      label: B,
+      id: M,
+      disabled: x,
       maxlength: m,
-      minlength: g,
-      modelValue: c,
-      icon: A,
-      rightIcon: k,
-      helper: D,
-      error: x,
-      helperText: R,
-      clearable: V,
-      lengthError: z
-    } = L(_), v = O(!1), F = () => {
-      v.value = !1;
-    }, P = () => {
-      v.value = !0;
-    }, B = o(() => c.value.length === m.value), E = o(() => c.value.length === 0 ? !1 : c.value.length < g.value), N = o(() => z.value && (B.value || E.value)), j = o(() => {
-      const r = [];
-      return c.value && r.push("rds-e-textarea--filled"), x.value && r.push("rds-e-textarea--error"), p.value && r.push("rds-e-textarea--disabled"), N.value && r.push("rds-e-textarea--error"), r.join(" ");
-    }), l = o(() => {
-      const r = {
-        name: A.value,
+      minlength: y,
+      modelValue: v,
+      icon: R,
+      rightIcon: E,
+      helper: z,
+      error: b,
+      helperText: P,
+      clearable: w,
+      lengthError: j
+    } = Y(g), f = k(!1), _ = k(!1), p = k(!1), H = () => {
+      p.value = !0;
+    }, K = () => {
+      f.value = !1, _.value = !1, p.value = !1;
+    }, U = () => {
+      f.value = !0, _.value = !p.value, p.value = !1;
+    }, N = o(() => v.value.length === m.value), C = o(() => v.value.length === 0 ? !1 : v.value.length < y.value), I = o(() => j.value && (N.value || C.value)), G = o(() => {
+      const a = [];
+      return v.value && a.push("rds-e-textarea--filled"), b.value && a.push("rds-e-textarea--error"), x.value && a.push("rds-e-textarea--disabled"), I.value && a.push("rds-e-textarea--error"), a.join(" ");
+    }), J = () => {
+      c.value = "";
+    }, l = o(() => {
+      const a = {
+        name: R.value,
         class: "",
         events: {
           click: () => {
           }
         }
       }, n = {
-        left: { ...r },
-        right: { ...r, name: k.value }
+        left: { ...a },
+        right: { ...a, name: E.value }
       };
-      return V.value && (n.right = {
-        ...r,
+      return w.value && (n.right = {
+        ...a,
         name: "close",
         class: "rds-e-textfield__icon--clear",
         events: {
-          click: () => d.value = ""
+          click: () => J()
         }
       }), n;
-    }), H = o(() => c.value.length);
-    return (r, n) => {
-      var C, M;
-      return s(), f("div", {
-        class: h(["rds-e-textarea", j.value])
+    }), L = o(() => v.value.length);
+    return (a, n) => {
+      var D, q;
+      return s(), h("div", {
+        class: u(["rds-e-textarea", G.value])
       }, [
-        a("div", Z, [
-          a("div", ee, [
-            Q(a("textarea", {
-              id: (C = e(S)) == null ? void 0 : C.toString(),
-              "onUpdate:modelValue": n[0] || (n[0] = (U) => d.value = U),
+        r("div", {
+          class: u(["rds-e-textarea__container", {
+            "rds-e-textarea__container--keyboard-focus": _.value,
+            "rds-e-textarea__container--active": f.value && !_.value
+          }]),
+          onMousedown: H
+        }, [
+          r("div", re, [
+            Z(r("textarea", {
+              id: (D = e(M)) == null ? void 0 : D.toString(),
+              "onUpdate:modelValue": n[0] || (n[0] = (O) => c.value = O),
               type: "text",
-              class: h(["rds-e-textarea__input", { "rds-e-textarea__input--active": v.value }]),
+              class: u(["rds-e-textarea__input", { "rds-e-textarea__input--active": f.value }]),
               name: t.name,
               maxlength: e(m),
-              minlength: e(g),
+              minlength: e(y),
               rows: t.rows,
-              disabled: e(p),
-              onBlur: F,
-              onFocus: P
-            }, null, 42, te), [
-              [W, d.value]
+              disabled: e(x),
+              onBlur: K,
+              onFocus: U
+            }, null, 42, le), [
+              [ee, c.value]
             ]),
-            n[1] || (n[1] = a("div", { class: "rds-e-textarea__resize-handle" }, [
-              a("svg", {
+            n[1] || (n[1] = r("div", { class: "rds-e-textarea__resize-handle" }, [
+              r("svg", {
                 width: "12",
                 height: "14",
                 viewBox: "0 0 12 14",
                 fill: "none",
                 xmlns: "http://www.w3.org/2000/svg"
               }, [
-                a("path", {
+                r("path", {
                   d: "M11 1V3C11 8.52285 6.52285 13 1 13V13",
                   "stroke-width": "1.2",
                   "stroke-linecap": "round"
                 })
               ])
             ], -1)),
-            a("label", {
-              for: (M = e(S)) == null ? void 0 : M.toString(),
-              class: h(["rds-e-textarea__label", {
+            r("label", {
+              for: (q = e(M)) == null ? void 0 : q.toString(),
+              class: u(["rds-e-textarea__label", {
                 "rds-e-textarea__label--with-icon": l.value.left.name,
-                "rds-e-textarea__label--active": v.value
+                "rds-e-textarea__label--active": f.value
               }])
             }, [
-              y(r.$slots, "left-icon", {}, () => [
-                l.value.left.name ? (s(), I($, q({
+              S(a.$slots, "left-icon", {}, () => [
+                l.value.left.name ? (s(), T(F, $({
                   key: 0,
-                  class: ["rds-e-textarea__icon rds-e-textarea__icon--left", { "rds-e-textarea__icon--hidden": v.value }],
+                  class: "rds-e-textarea__icon rds-e-textarea__icon--left",
                   "aria-hidden": "true"
-                }, l.value.left, T(l.value.left.events)), null, 16, ["class"])) : i("", !0)
+                }, l.value.left, A(l.value.left.events)), null, 16)) : i("", !0)
               ], !0),
-              X(" " + u(e(w)), 1)
-            ], 10, re),
-            a("div", {
-              class: h(["rds-e-textarea__counter", {
-                "rds-e-textarea__counter--disabled": e(p),
-                "rds-e-textarea__counter--clearable": e(V)
+              te(" " + d(e(B)), 1)
+            ], 10, ne),
+            r("div", {
+              class: u(["rds-e-textarea__counter", {
+                "rds-e-textarea__counter--disabled": e(x),
+                "rds-e-textarea__counter--clearable": e(w)
               }])
             }, [
-              t.counter && !e(k) ? (s(), f("p", ae, u(H.value) + "/" + u(e(m)), 1)) : i("", !0),
-              y(r.$slots, "right-icon", {}, () => [
-                l.value.right.name && !l.value.left.name ? (s(), I($, q({
+              t.counter && !e(E) && !e(w) ? (s(), h("p", se, d(L.value) + "/" + d(e(m)), 1)) : i("", !0),
+              S(a.$slots, "right-icon", {}, () => [
+                l.value.right.name ? (s(), T(F, $({
                   key: 0,
                   class: "rds-e-textarea__icon rds-e-textarea__icon--right",
                   "aria-hidden": "true"
-                }, l.value.right, T(l.value.right.events)), null, 16)) : i("", !0)
+                }, l.value.right, A(l.value.right.events)), null, 16)) : i("", !0)
               ], !0)
             ], 2)
           ])
-        ]),
-        a("ul", {
-          class: h(["rds-e-textarea__helper", e(x) || N.value ? "rds-e-textarea__helper--error" : ""])
+        ], 34),
+        r("ul", {
+          class: u(["rds-e-textarea__helper", e(b) || I.value ? "rds-e-textarea__helper--error" : ""])
         }, [
-          B.value ? (s(), f("li", le, " Max text length is " + u(e(m)), 1)) : i("", !0),
-          E.value ? (s(), f("li", ne, " Min text length is " + u(e(g)), 1)) : i("", !0),
-          a("li", null, [
-            y(r.$slots, "helper-text", {}, () => [
-              e(D) || e(x) ? (s(), f("span", se, u(e(R)), 1)) : i("", !0)
+          N.value ? (s(), h("li", oe, " Max text length is " + d(e(m)), 1)) : i("", !0),
+          C.value ? (s(), h("li", ue, " Min text length is " + d(e(y)), 1)) : i("", !0),
+          r("li", null, [
+            S(a.$slots, "helper-text", {}, () => [
+              e(z) || e(b) ? (s(), h("span", ie, d(e(P)), 1)) : i("", !0)
             ], !0)
           ])
         ], 2)
       ], 2);
     };
   }
-}), ce = /* @__PURE__ */ Y(oe, [["__scopeId", "data-v-e01ef58d"]]);
+}), he = /* @__PURE__ */ ae(de, [["__scopeId", "data-v-cdbbf388"]]);
 export {
-  ce as default
+  he as default
 };

package/dist/components/textField.es.js

@@ -1,14 +1,14 @@
-import { defineComponent as te, toRefs as le, ref as w, computed as d, watch as ae, createElementBlock as k, openBlock as p, normalizeClass as S, createElementVNode as m, createCommentVNode as y, renderSlot as N, createBlock as I, mergeProps as $, toHandlers as ne, unref as o, toDisplayString as C, withModifiers as oe } from "vue";
-import { g as re } from "./getInstance-GhoEcxLF.js";
-import { R, s as se } from "./icon-svg-DuzOdbk1.js";
-import { _ as ie } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/textField.css';const ue = { class: "rds-e-textfield__container" }, de = { class: "rds-e-textfield__input-container" }, ce = ["id", "type", "maxlength", "minlength", "disabled", "value", "autocomplete", "readonly"], fe = ["for"], pe = {
+import { defineComponent as re, toRefs as ie, ref as f, computed as v, watch as F, onMounted as ue, onBeforeUnmount as de, createElementBlock as V, openBlock as m, normalizeClass as k, createElementVNode as h, createCommentVNode as S, renderSlot as E, createBlock as R, mergeProps as A, toHandlers as ce, unref as d, toDisplayString as M, withModifiers as fe } from "vue";
+import { g as ve } from "./getInstance-GhoEcxLF.js";
+import { R as K, s as pe } from "./icon-svg-DuzOdbk1.js";
+import { _ as me } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/textField.css';const he = { class: "rds-e-textfield__input-container" }, ge = ["id", "type", "maxlength", "minlength", "disabled", "value", "autocomplete", "readonly"], _e = ["for"], ye = {
   key: 0,
   class: "rds-e-textfield__icon rds-e-textfield__icon--right"
-}, me = {
+}, xe = {
   key: 0,
   class: "rds-e-textfield__helper"
-}, ve = /* @__PURE__ */ te({
+}, be = /* @__PURE__ */ re({
   __name: "text-field",
   props: {
     /**
@@ -78,8 +78,8 @@ import './style/textField.css';const ue = { class: "rds-e-textfield__container"
       type: String,
       default: "text",
       validator: (t) => {
-        const r = ["text", "number", "password", "email", "tel", "url"], s = r.includes(t);
-        return s || console.warn(`[RDSTextfield]: El valor de la prop 'type' debe ser uno de: ${r.join(", ")}. Valor recibido: ${t}`), s;
+        const s = ["text", "number", "password", "email", "tel", "url"], r = s.includes(t);
+        return r || console.warn(`[RDSTextfield]: El valor de la prop 'type' debe ser uno de: ${s.join(", ")}. Valor recibido: ${t}`), r;
       }
     },
     /**
@@ -140,67 +140,76 @@ import './style/textField.css';const ue = { class: "rds-e-textfield__container"
     autocomplete: {
       type: String,
       default: "off",
-      validator: (t, r) => {
-        const s = ["new-password", "current-password", "off"];
-        return (r.password || r.type === "password") && !s.includes(t) ? (console.info(`[RDSTextfield]: El valor de autocomplete para un campo de contraseña debe ser uno de los siguientes: ${s.join(", ")}`), !1) : !0;
+      validator: (t, s) => {
+        const r = ["new-password", "current-password", "off"];
+        return (s.password || s.type === "password") && !r.includes(t) ? (console.info(`[RDSTextfield]: El valor de autocomplete para un campo de contraseña debe ser uno de los siguientes: ${r.join(", ")}`), !1) : !0;
       }
     }
   },
   emits: ["update:modelValue", "keydown", "keyup", "keypress", "change"],
-  setup(t, { expose: r, emit: s }) {
-    const a = t, i = s, {
-      type: v,
-      label: D,
-      disabled: h,
-      maxLength: F,
-      minLength: P,
-      modelValue: u,
-      icon: j,
-      rightIcon: q,
-      helper: K,
-      error: x,
-      helperText: W,
-      clearable: z,
-      password: g,
-      autocomplete: A,
-      fullWidth: H
-    } = le(a), c = w(null), f = w(!0), b = w(!1), M = re(), V = d(() => a.id || `text-field-${M}`), U = d(() => g.value ? f.value ? "text" : "password" : v.value), G = d(() => {
-      if (g.value || v.value === "password")
-        return A.value;
-    }), J = (e) => {
+  setup(t, { expose: s, emit: r }) {
+    const n = t, c = r, {
+      type: g,
+      label: P,
+      disabled: N,
+      maxLength: j,
+      minLength: q,
+      modelValue: i,
+      icon: W,
+      rightIcon: O,
+      helper: U,
+      error: L,
+      helperText: z,
+      clearable: H,
+      password: _,
+      autocomplete: G,
+      fullWidth: J
+    } = ie(n), a = f(null), p = f(!0), y = f(!1), x = f(!1), b = f(!1), Q = ve(), w = f(""), B = v(() => n.id || `text-field-${Q}`), X = v(() => _.value ? p.value ? "text" : "password" : g.value), Y = v(() => {
+      if (_.value || g.value === "password")
+        return G.value;
+    }), Z = (e) => {
       const l = e.target;
-      let _ = l.value;
-      if (v.value === "number")
+      let u = l.value;
+      if (g.value === "number")
         if (l.value.trim() === "")
-          _ = null;
+          u = null;
         else {
-          const T = Number.parseFloat(l.value);
-          _ = Number.isNaN(T) ? l.value : T;
+          const D = Number.parseFloat(l.value);
+          u = Number.isNaN(D) ? l.value : D;
         }
-      else l.value === "" && u.value === null && (_ = null);
-      i("update:modelValue", _);
-    }, B = () => {
-      b.value = !1;
-    }, E = () => {
+      else l.value === "" && i.value === null && (u = null);
+      c("update:modelValue", u);
+    }, ee = () => {
       b.value = !0;
-    }, O = (e) => {
-      i("keydown", e);
-    }, Q = (e) => {
-      i("keyup", e);
-    }, X = (e) => {
-      i("keypress", e);
-    }, Y = (e) => {
-      i("change", e);
-    }, Z = d(() => {
-      if (x.value) return !0;
-      const e = u.value === null || u.value === void 0 ? "" : String(u.value);
-      return e.length > 0 && (e.length < P.value || v.value !== "number" && e.length > F.value);
-    }), ee = d(() => {
+    }, T = () => {
+      y.value = !1, x.value = !1, b.value = !1;
+    }, I = () => {
+      y.value = !0, x.value = !b.value, b.value = !1;
+    }, te = (e) => {
+      c("keydown", e);
+    }, le = (e) => {
+      c("keyup", e);
+    }, ae = (e) => {
+      c("keypress", e);
+    }, ne = (e) => {
+      c("change", e);
+    }, oe = v(() => {
+      if (L.value) return !0;
+      const e = i.value === null || i.value === void 0 ? "" : String(i.value);
+      return e.length > 0 && (e.length < q.value || g.value !== "number" && e.length > j.value);
+    }), se = v(() => {
       const e = [];
-      return u.value !== null && String(u.value).length > 0 && e.push("rds-e-textfield--filled"), Z.value && e.push("rds-e-textfield--error"), h.value && e.push("rds-e-textfield--disabled"), H.value && e.push("rds-e-textfield--full-width"), e.join(" ");
-    }), n = d(() => {
+      return w.value !== "" && e.push(w.value), i.value !== null && String(i.value).length > 0 && e.push("rds-e-textfield--filled"), oe.value && e.push("rds-e-textfield--error"), N.value && e.push("rds-e-textfield--disabled"), J.value && e.push("rds-e-textfield--full-width"), e.join(" ");
+    });
+    F(
+      () => i.value,
+      (e) => {
+        e !== null && String(e).length > 0 && (w.value = "");
+      }
+    );
+    const o = v(() => {
       const e = {
-        name: j.value,
+        name: W.value,
         class: "",
         events: {
           click: () => {
@@ -212,23 +221,23 @@ import './style/textField.css';const ue = { class: "rds-e-textfield__container"
         },
         right: {
           ...e,
-          name: q.value
+          name: O.value
         }
       };
-      return g.value ? {
+      return _.value ? {
         left: {
           ...e,
           name: null
         },
         right: {
           ...e,
-          name: f.value ? "eye_open" : "eye_close",
+          name: p.value ? "eye_open" : "eye_close",
           class: "rds-e-textfield__icon--password",
           events: {
-            click: () => f.value = !f.value
+            click: () => p.value = !p.value
           }
         }
-      } : z.value ? {
+      } : H.value ? {
         left: {
           ...e
         },
@@ -237,86 +246,99 @@ import './style/textField.css';const ue = { class: "rds-e-textfield__container"
           name: "close",
           class: "rds-e-textfield__icon--clear",
           events: {
-            click: () => i("update:modelValue", "")
+            click: () => c("update:modelValue", "")
           }
         }
       } : l;
     });
-    ae(
-      g,
-      (e) => f.value = !e,
+    F(
+      _,
+      (e) => p.value = !e,
       { immediate: !0 }
     );
-    const L = (e) => {
-      const l = se.includes(e);
+    const C = (e) => {
+      const l = pe.includes(e);
       return l || console.warn(`[RDSTextfield]: El icono "${e}" no es un icono válido.`), l;
+    }, $ = (e) => {
+      var u;
+      ((u = a.value) == null ? void 0 : u.matches(":-webkit-autofill")) && e.animationName.startsWith("onAutoFillStart") && (w.value = "rds-e-textfield--filled");
     };
-    return r({
+    return ue(() => {
+      a.value && a.value.addEventListener("animationstart", $);
+    }), de(() => {
+      a.value && a.value.removeEventListener("animationstart", $);
+    }), s({
       focus: () => {
-        c.value && (c.value.focus(), E());
+        a.value && (a.value.focus(), I());
       },
       blur: () => {
-        c.value && (c.value.blur(), B());
+        a.value && (a.value.blur(), T());
       }
-    }), (e, l) => (p(), k("div", {
-      class: S(["rds-e-textfield", ee.value])
+    }), (e, l) => (m(), V("div", {
+      class: k(["rds-e-textfield", se.value])
     }, [
-      m("div", ue, [
-        N(e.$slots, "left-icon", {}, () => [
-          n.value.left.name && L(n.value.left.name) ? (p(), I(R, $({
+      h("div", {
+        class: k(["rds-e-textfield__container", {
+          "rds-e-textfield__container--keyboard-focus": x.value,
+          "rds-e-textfield__container--active": y.value && !x.value
+        }]),
+        onMousedown: ee
+      }, [
+        E(e.$slots, "left-icon", {}, () => [
+          o.value.left.name && C(o.value.left.name) ? (m(), R(K, A({
             key: 0,
-            class: ["rds-e-textfield__icon rds-e-textfield__icon--left", { "rds-e-textfield__icon--hidden": b.value }],
+            class: ["rds-e-textfield__icon rds-e-textfield__icon--left", { "rds-e-textfield__icon--hidden": y.value }],
             "aria-hidden": "true"
-          }, n.value.left, ne(n.value.left.events)), null, 16, ["class"])) : y("", !0)
+          }, o.value.left, ce(o.value.left.events)), null, 16, ["class"])) : S("", !0)
         ], !0),
-        m("div", de, [
-          m("input", {
-            id: V.value,
+        h("div", he, [
+          h("input", {
+            id: B.value,
             ref_key: "input",
-            ref: c,
-            type: U.value,
+            ref: a,
+            type: X.value,
             class: "rds-e-textfield__input",
-            maxlength: a.type === "number" ? void 0 : a.maxLength,
-            minlength: a.type === "number" ? void 0 : a.minLength,
-            disabled: o(h),
-            value: a.modelValue === null ? "" : a.modelValue,
-            autocomplete: G.value,
+            maxlength: n.type === "number" ? void 0 : n.maxLength,
+            minlength: n.type === "number" ? void 0 : n.minLength,
+            disabled: d(N),
+            value: n.modelValue === null ? "" : n.modelValue,
+            autocomplete: Y.value,
             readonly: t.readonly,
-            onInput: J,
-            onBlur: B,
-            onFocus: E,
-            onKeydown: O,
-            onKeyup: Q,
-            onKeypress: X,
-            onChange: Y
-          }, null, 40, ce),
-          m("label", {
-            for: V.value,
-            class: S(["rds-e-textfield__label", o(h) ? "rds-e-textfield__label--disabled" : ""])
-          }, C(o(D)), 11, fe)
+            onInput: Z,
+            onBlur: T,
+            onFocus: I,
+            onKeydown: te,
+            onKeyup: le,
+            onKeypress: ae,
+            onChange: ne
+          }, null, 40, ge),
+          h("label", {
+            for: B.value,
+            class: k(["rds-e-textfield__label", d(N) ? "rds-e-textfield__label--disabled" : ""])
+          }, M(d(P)), 11, _e)
         ]),
-        n.value.right.name || e.$slots["right-icon"] ? (p(), k("span", pe, [
-          N(e.$slots, "right-icon", {}, () => [
-            n.value.right.name && L(n.value.right.name) ? (p(), I(R, $({
+        o.value.right.name || e.$slots["right-icon"] ? (m(), V("span", ye, [
+          E(e.$slots, "right-icon", {}, () => [
+            o.value.right.name && C(o.value.right.name) ? (m(), R(K, A({
               key: 0,
               "aria-hidden": "true",
               class: "rds-e-textfield__icon rds-e-textfield__icon--right"
-            }, n.value.right, {
-              onClick: oe(n.value.right.events.click, ["stop"])
-            }), null, 16, ["onClick"])) : y("", !0)
+            }, o.value.right, {
+              onClick: fe(o.value.right.events.click, ["stop"])
+            }), null, 16, ["onClick"])) : S("", !0)
           ], !0)
-        ])) : y("", !0)
-      ]),
-      (o(K) || o(x)) && !o(h) ? (p(), k("div", me, [
-        N(e.$slots, "helper-text", {}, () => [
-          m("span", {
-            class: S(o(x) ? "rds-e-textfield__helper--error" : "")
-          }, C(o(W)), 3)
+        ])) : S("", !0)
+      ], 34),
+      d(U) || d(L) ? (m(), V("div", xe, [
+        E(e.$slots, "helper-text", {}, () => [
+          h("span", {
+            class: k(d(L) ? "rds-e-textfield__helper--error" : "")
+          }, M(d(z)), 3)
         ], !0)
-      ])) : y("", !0)
+      ])) : S("", !0)
     ], 2));
   }
-}), xe = /* @__PURE__ */ ie(ve, [["__scopeId", "data-v-3d4a237a"]]);
+}), Le = /* @__PURE__ */ me(be, [["__scopeId", "data-v-c84ec649"]]);
 export {
-  xe as default
+  Le as default
 };