energy-components 1.6.0-beta.0 → 1.6.0

package/dist/components/tableslotedcomponent.es.js

@@ -1,16 +1,24 @@
-import { defineComponent as ee, toRefs as le, getCurrentInstance as te, ref as _, computed as C, watchEffect as se, watch as ae, onMounted as oe, openBlock as o, createElementBlock as n, normalizeClass as b, createElementVNode as i, Fragment as p, renderList as x, renderSlot as h, normalizeStyle as ne, toDisplayString as O, createBlock as ce, mergeProps as ie, createCommentVNode as d, unref as $, createVNode as E, Transition as N, withCtx as V, nextTick as re } from "vue";
-import { I as L } from "./icon-svg-CeKfjk3j.js";
-import { _ as ue } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/tableslotedcomponent.css';const de = { key: 0 }, _e = ["data-header", "onClick"], be = ["id", "checked", "onClick"], ke = ["for"], fe = {
+import { defineComponent as w, toRefs as I, getCurrentInstance as ee, ref as p, computed as m, watchEffect as le, watch as te, onMounted as se, openBlock as n, createElementBlock as c, normalizeClass as u, createElementVNode as i, Fragment as g, renderList as x, renderSlot as h, createVNode as f, normalizeStyle as ae, toDisplayString as U, createCommentVNode as b, unref as C, Transition as O, withCtx as N, nextTick as oe } from "vue";
+import { R as ne } from "./icon-svg-DGp2yHJn.js";
+import E from "./checkbox.es.js";
+import { g as ce } from "./getInstance-GhoEcxLF.js";
+import { _ as ie } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/tableslotedcomponent.css';const de = { key: 0 }, re = ["data-header", "onClick"], ue = ["for"], be = {
+  key: 1,
+  class: "rds-flex rds-flex-align-center"
+}, _e = {
+  key: 0,
+  class: "table__sortable-icon rds-flex rds-flex-center-center rds-flex-col"
+}, ke = {
   key: 0,
   class: "table__cell table__cell--heading body-1 table__cell--right"
-}, pe = ["checked"], ye = {
+}, pe = ["for"], fe = {
   key: 0,
   class: "loading-overlay"
-}, ve = ["onClick"], ge = ["column-key", "data-cell"], he = ["title"], $e = {
+}, ye = ["onClick"], ve = ["column-key", "data-cell"], ge = ["title"], he = {
   key: 0,
   class: "table__cell table__cell--shadow table__cell--right"
-}, me = ["id", "checked", "disabled", "onClick"], Ce = ["for"], Se = ["colspan"], xe = ["colspan"], Ee = /* @__PURE__ */ ee({
+}, $e = ["for"], me = ["colspan"], Ce = ["colspan"], Se = /* @__PURE__ */ w({
   __name: "TableSlotedComponent",
   props: {
     loading: { type: Boolean, default: !1 },
@@ -31,102 +39,107 @@ import './style/tableslotedcomponent.css';const de = { key: 0 }, _e = ["data-hea
     mockItems: {}
   },
   emits: ["selectAll", "onClickCheckbox", "onItemExpansion", "onHeaderSort"],
-  setup(j, { expose: z, emit: F }) {
-    const c = j, y = F, { item: k, listChecked: P, selectableKey: r } = le(c), S = te(), q = _(), v = _([]), m = _([]), K = _([]), U = _({}), f = _(!1), Y = _(!0), G = C(() => {
+  setup(L, { expose: j, emit: q }) {
+    const o = L, y = q, { item: k, listChecked: z, selectableKey: d } = I(o), S = ee(), F = p(), B = p(`table-${ce()}`), _ = p([]), $ = p([]), K = p([]), P = p(!0), G = m(() => {
       const e = "table";
       let t = e;
-      return t = `${t} ${e}--${c.variant}`, c.condensed && (t = `${t} ${e}--condensed`), t;
-    }), J = C(() => {
+      return t = `${t} ${e}--${o.variant}`, o.condensed && (t = `${t} ${e}--condensed`), t;
+    }), J = m(() => {
       const e = "table__body";
       let t = e;
-      return t = `${t} ${e}--${c.variant}`, c.condensed && (t = `${t} ${e}--condensed`), t;
-    }), Q = C(() => c.mockItems ? Array.from({ length: c.mockItems }, () => ({
+      return t = `${t} ${e}--${o.variant}`, o.condensed && (t = `${t} ${e}--condensed`), t;
+    }), Q = m(() => o.mockItems ? Array.from({ length: o.mockItems }, () => ({
       expandible: !1,
       visible: !1
-    })) : []), g = C(() => c.loading && v.value.length === 0 ? Q.value : v.value), W = (e) => {
-      if (r != null && r.value) {
-        const t = e[r.value];
-        return P.value.includes(t);
+    })) : []), v = m(() => o.loading && _.value.length === 0 ? Q.value : _.value), W = (e) => {
+      if (d != null && d.value) {
+        const t = e[d.value];
+        return z.value.includes(t);
       }
       return !1;
     }, X = (e) => {
-      r != null && r.value && y("onClickCheckbox", String(e[r.value]));
-    }, B = async (e, t = !1) => {
+      if (d != null && d.value) {
+        const t = String(e[d.value]);
+        y("onClickCheckbox", t);
+      }
+    }, D = async (e, t = !1) => {
       var l;
-      e.expandible && (c.isMobileDevice || (e.visible = !e.visible), y("onItemExpansion", {
-        ...e,
-        isMobileDevice: c.isMobileDevice
-      }), t && (await re(), (l = document.querySelector(".table__group--is-open")) == null || l.scrollIntoView({ behavior: "smooth" })));
-    }, Z = (e) => {
-      f.value = e.target.checked, y("selectAll", f.value);
-    }, A = (e) => e.align ? `table__cell--${e.align}` : "table__cell--left", R = (e, t) => t === "actions" ? !1 : e.status === "BLOCKED" || e.status === "BUSINESS_BLOCK" || e.status === "PT_BLOCKED" ? !0 : !!e.$disabled, D = (e, t, l) => {
+      if (e.expandible) {
+        if (!o.isMobileDevice) {
+          const a = _.value.map(
+            (s) => s === e ? { ...s, visible: !s.visible } : s
+          );
+          _.value = a;
+        }
+        y("onItemExpansion", {
+          ...e,
+          visible: o.isMobileDevice ? e.visible : !e.visible,
+          isMobileDevice: o.isMobileDevice
+        }), t && (await oe(), (l = document.querySelector(".table__group--is-open")) == null || l.scrollIntoView({ behavior: "smooth" }));
+      }
+    }, Y = (e) => {
+      y("selectAll", e);
+    }, A = (e) => e.align ? `table__cell--${e.align}` : "table__cell--left", Z = (e, t) => t === "actions" ? !1 : e.status === "BLOCKED" || e.status === "BUSINESS_BLOCK" || e.status === "PT_BLOCKED" ? !0 : !!e.$disabled, V = (e, t, l) => {
       var a, s;
       if (!t) return "---";
       if (e === "date") {
-        const u = (s = (a = k.value.items[l]) == null ? void 0 : a.rawElem) == null ? void 0 : s.operationHour;
-        if (u) return `${t} ${u}`;
+        const r = (s = (a = k.value.items[l]) == null ? void 0 : a.rawElem) == null ? void 0 : s.operationHour;
+        if (r) return `${t} ${r}`;
       }
       return t;
-    }, w = (e, t) => {
+    }, R = (e, t) => {
       if (!t.sortable) return;
       const l = ["", "asc", "desc"], s = (l.indexOf(t.sort || "") + 1) % l.length;
-      if (m.value.forEach((u) => {
-        u.sortable && u.key !== t.key && (u.sort = "");
+      if ($.value.forEach((r) => {
+        r.sortable && r.key !== t.key && (r.sort = "");
       }), t.sort = l[s], t.sort === "")
         return y("onHeaderSort", {});
       y("onHeaderSort", {
         sortBy: t.key,
         order: t.sort
       });
-    }, I = (e) => {
-      const t = {
-        name: "filter",
-        class: "",
-        style: {
-          transform: "translateY(6px)"
-        }
-      };
-      return e.sort === "asc" && (t.class = "sortable_icon--active", t.style.transform = `${t.style.transform} scale(-1)`), e.sort === "desc" && (t.class = "sortable_icon--active"), t;
     }, H = (e = !1) => {
-      v.value = [...k.value.items].map((t, l) => {
-        var a;
+      const t = k.value.items.map((l, a) => {
+        var r;
+        const s = (r = _.value[a]) == null ? void 0 : r.visible;
         return {
-          ...t,
-          visible: e ? !!((a = v.value[l]) != null && a.visible) : !1
+          ...l,
+          visible: e && s !== void 0 ? s : !1
         };
       });
+      _.value = t;
     }, T = (e = !1) => {
-      Y.value = !e, m.value = [
+      P.value = !e, $.value = [
         ...k.value.header.map((t) => ("sort" in t || Object.assign(t, { sort: "" }), t))
-      ], H(e), f.value = c.checkedAll;
+      ], H(e);
     };
     T();
     const M = (e) => Object.keys(e);
-    return se(() => {
+    return le(() => {
       var e;
-      T(!0), (e = c.itemsExpanded) != null && e.length && c.itemsExpanded.forEach((t) => {
-        k.value.items[t] && B(k.value.items[t], !0);
+      T(!0), (e = o.itemsExpanded) != null && e.length && o.itemsExpanded.forEach((t) => {
+        k.value.items[t] && D(k.value.items[t], !0);
       });
-    }), ae(() => c.isMobileDevice, () => {
-      v.value = [...k.value.items].map((e) => ({
+    }), te(() => o.isMobileDevice, () => {
+      _.value = [...k.value.items].map((e) => ({
         ...e,
         visible: !1
       }));
-    }), z({
+    }), j({
       clearVisibleDetails: H
-    }), oe(() => {
+    }), se(() => {
       var e;
-      q.value = (e = S == null ? void 0 : S.vnode) == null ? void 0 : e.scopeId;
-    }), (e, t) => (o(), n("div", {
-      class: b(["table__container", G.value])
+      F.value = (e = S == null ? void 0 : S.vnode) == null ? void 0 : e.scopeId;
+    }), (e, t) => (n(), c("div", {
+      class: u(["table__container", G.value])
     }, [
       i("table", null, [
-        e.hideHeaders ? d("", !0) : (o(), n("thead", de, [
+        e.hideHeaders ? b("", !0) : (n(), c("thead", de, [
           i("tr", null, [
-            (o(!0), n(p, null, x(m.value, (l, a) => (o(), n("th", {
+            (n(!0), c(g, null, x($.value, (l, a) => (n(), c("th", {
               key: `header-${a}`,
               "data-header": `data-header-${l.key}`,
-              class: b(["table__cell table__cell--heading body-1", [
+              class: u(["table__cell table__cell--heading body-1", [
                 A(l),
                 {
                   "table__cell--shadow": l.sticky,
@@ -134,63 +147,63 @@ import './style/tableslotedcomponent.css';const de = { key: 0 }, _e = ["data-hea
                   "table__cell--sortable": l.sortable
                 }
               ]]),
-              onClick: (s) => w(s, l)
+              onClick: (s) => R(s, l)
             }, [
               h(e.$slots, `header-${l.key}`, { item: l }, () => [
-                l.type === "selectAll" ? (o(), n(p, { key: 0 }, [
-                  i("input", {
+                l.type === "selectAll" ? (n(), c(g, { key: 0 }, [
+                  f(E, {
                     id: `checkbox_${l.key}`,
-                    class: "rds-checkbox",
-                    type: "checkbox",
-                    checked: l.allSelected,
-                    onClick: l.callback
-                  }, null, 8, be),
+                    "is-checked": l.allSelected,
+                    "onUpdate:modelValue": l.callback
+                  }, null, 8, ["id", "is-checked", "onUpdate:modelValue"]),
                   i("label", {
                     for: `checkbox_${l.key}`,
                     class: "rds-checkbox__label"
-                  }, null, 8, ke)
-                ], 64)) : (o(), n(p, { key: 1 }, [
+                  }, null, 8, ue)
+                ], 64)) : (n(), c("div", be, [
                   i("span", {
-                    style: ne({
+                    style: ae({
                       color: (l == null ? void 0 : l.sort) !== "" ? "#00ADC3" : ""
                     }),
                     class: "rds-title-02"
-                  }, O(l.text || ""), 5),
-                  l.sortable ? (o(), ce(L, ie({
-                    key: 0,
-                    class: "table__header__icon sortable_icon",
-                    ref_for: !0
-                  }, I(l)), null, 16)) : d("", !0)
-                ], 64))
+                  }, U(l.text || ""), 5),
+                  l.sortable ? (n(), c("span", _e, [
+                    i("span", {
+                      class: u(["table__sortable-icon--up sortable-icon", `${l.sort === "asc" ? "active" : ""}`])
+                    }, "▲", 2),
+                    i("span", {
+                      class: u(["table__sortable-icon--down sortable-icon", `${l.sort === "desc" ? "active" : ""}`])
+                    }, "▼", 2)
+                  ])) : b("", !0)
+                ]))
               ], !0)
-            ], 10, _e))), 128)),
-            $(r) && !e.hideSelectAll ? (o(), n("th", fe, [
-              i("input", {
-                id: "All",
+            ], 10, re))), 128)),
+            C(d) && !e.hideSelectAll ? (n(), c("th", ke, [
+              f(E, {
+                id: `checkbox-all-${B.value}`,
                 class: "rds-checkbox table__checkbox",
-                type: "checkbox",
-                checked: f.value,
-                onClick: Z
-              }, null, 8, pe),
-              t[0] || (t[0] = i("label", {
-                for: "All",
+                "is-checked": o.checkedAll,
+                "onUpdate:modelValue": Y
+              }, null, 8, ["id", "is-checked"]),
+              i("label", {
+                for: `checkbox-all-${B.value}`,
                 class: "rds-checkbox__label rds-checkbox__label--no-text"
-              }, null, -1))
-            ])) : d("", !0)
+              }, null, 8, pe)
+            ])) : b("", !0)
           ])
         ])),
         i("tbody", {
-          class: b(J.value)
+          class: u(J.value)
         }, [
-          E(N, { name: "fade" }, {
-            default: V(() => [
-              e.loading ? (o(), n("div", ye, [
-                E(L, { name: "loading" })
-              ])) : d("", !0)
+          f(O, { name: "fade" }, {
+            default: N(() => [
+              e.loading ? (n(), c("div", fe, [
+                f(ne, { name: "loading" })
+              ])) : b("", !0)
             ]),
             _: 1
           }),
-          g.value.length !== 0 ? (o(!0), n(p, { key: 0 }, x(g.value, (l, a) => (o(), n(p, {
+          v.value.length !== 0 ? (n(!0), c(g, { key: 0 }, x(v.value, (l, a) => (n(), c(g, {
             key: `row-${a}}`
           }, [
             i("tr", {
@@ -198,24 +211,24 @@ import './style/tableslotedcomponent.css';const de = { key: 0 }, _e = ["data-hea
               ref: (s) => {
                 K.value[a] = s;
               },
-              class: b(["table__group", [
+              class: u(["table__group", [
                 { "table__group--odd": a % 2 === 0 },
                 { "table__group--is-open rds-background-grey": l.visible },
                 { "table__group--expandible": l.expandible },
                 l.$class || ""
               ]]),
-              onClick: () => B(l)
+              onClick: () => D(l)
             }, [
-              (o(!0), n(p, null, x(m.value, (s, u) => (o(), n("td", {
-                key: `column-${u}`,
-                "column-key": u,
+              (n(!0), c(g, null, x($.value, (s, r) => (n(), c("td", {
+                key: `column-${r}`,
+                "column-key": r,
                 "data-cell": `data-cell-${s.key}`,
-                class: b(["table__cell rds-body-01", [
+                class: u(["table__cell rds-body-01", [
                   A(s),
                   {
                     "table__cell--shadow": s.sticky,
                     "table__cell--no-sticky": !s.sticky,
-                    "table__cell--disabled": R(l, s.key)
+                    "table__cell--disabled": Z(l, s.key)
                   },
                   l[`$${s.key}_class`] || ""
                 ]])
@@ -225,69 +238,65 @@ import './style/tableslotedcomponent.css';const de = { key: 0 }, _e = ["data-hea
                   item: l
                 }, () => [
                   i("span", {
-                    title: D(s.key, String(l[s.key] || ""), a)
-                  }, O(D(s.key, String(l[s.key] || ""), a)), 9, he)
+                    title: V(s.key, String(l[s.key] || ""), a)
+                  }, U(V(s.key, String(l[s.key] || ""), a)), 9, ge)
                 ], !0)
-              ], 10, ge))), 128)),
-              $(r) ? (o(), n("td", $e, [
+              ], 10, ve))), 128)),
+              C(d) ? (n(), c("td", he, [
                 h(e.$slots, "td-checkbox", { item: l }, () => [
-                  i("input", {
-                    id: `add-${a}-${l[$(r)]}`,
-                    ref_for: !0,
-                    ref: () => {
-                      U.value[String(l[$(r)] || "")] = !0;
-                    },
+                  f(E, {
+                    id: `add-${a}-${l[C(d)]}`,
                     name: "checkbox-item",
-                    class: "rds-checkbox",
-                    checked: W(l) || f.value,
-                    disabled: f.value,
-                    type: "checkbox",
-                    onClick: (s) => X(l)
-                  }, null, 8, me),
+                    "is-checked": W(l) || o.checkedAll,
+                    disabled: !1,
+                    "onUpdate:modelValue": (s) => X(l)
+                  }, null, 8, ["id", "is-checked", "onUpdate:modelValue"]),
                   i("label", {
-                    for: `add-${a}-${l[$(r)]}`,
+                    for: `add-${a}-${l[C(d)]}`,
                     class: "rds-checkbox__label rds-checkbox__label--no-text"
-                  }, null, 8, Ce)
+                  }, null, 8, $e)
                 ], !0)
-              ])) : d("", !0)
-            ], 10, ve),
-            g.value[a].visible ? (o(), n("tr", {
+              ])) : b("", !0)
+            ], 10, ye),
+            v.value[a].visible ? (n(), c("tr", {
               key: 0,
-              class: b(["table__group table__group--dropdown", [
+              class: u(["table__group table__group--dropdown", [
                 {
                   "table__group--odd": a % 2 === 0
                 }
               ]])
             }, [
               i("td", {
-                class: b(["table__cell table__group--dropdown rds-background-grey", {
+                class: u(["table__cell table__group--dropdown rds-background-grey", {
                   "table__group--dropdown-disabled": l.status !== "ACTIVE",
                   "table__cell--table": !l.expandible
                 }]),
                 colspan: M(l).length
               }, [
                 h(e.$slots, "expandible", { item: l }, void 0, !0)
-              ], 10, Se)
-            ], 2)) : d("", !0),
-            g.value[a].visible ? (o(), n("tr", {
+              ], 10, me)
+            ], 2)) : b("", !0),
+            v.value[a].visible ? (n(), c("tr", {
               key: 1,
               class: "table__group--spacer",
               colspan: M(l).length
-            }, null, 8, xe)) : d("", !0)
-          ], 64))), 128)) : d("", !0)
+            }, null, 8, Ce)) : b("", !0)
+          ], 64))), 128)) : b("", !0)
         ], 2)
       ]),
-      E(N, { name: "fade" }, {
-        default: V(() => [
-          e.showEmptyState && !e.loading && g.value.length === 0 ? h(e.$slots, "empty", { key: 0 }, () => [
-            t[1] || (t[1] = i("p", { class: "rds-headline-03" }, " No hay datos para mostrar ", -1))
-          ], !0) : d("", !0)
+      f(O, { name: "fade" }, {
+        default: N(() => [
+          e.showEmptyState && !e.loading && v.value.length === 0 ? h(e.$slots, "empty", { key: 0 }, () => [
+            t[0] || (t[0] = i("div", { class: "table__empty-state" }, [
+              i("h3", { class: "rds-title-02" }, " No hay elementos a mostrar. ")
+            ], -1))
+          ], !0) : b("", !0)
         ]),
         _: 3
       })
     ], 2));
   }
-}), He = /* @__PURE__ */ ue(Ee, [["__scopeId", "data-v-2f3d4308"]]);
+}), Ve = /* @__PURE__ */ ie(Se, [["__scopeId", "data-v-d17d793d"]]);
 export {
-  He as default
+  Ve as default
 };

package/dist/components/tag.es.js

@@ -1,5 +1,5 @@
-import { defineComponent as h, toRefs as x, computed as u, openBlock as o, createElementBlock as $, normalizeClass as r, unref as t, createBlock as p, createCommentVNode as d, createTextVNode as B, toDisplayString as S } from "vue";
-import { I as f } from "./icon-svg-CeKfjk3j.js";
+import { defineComponent as h, toRefs as x, computed as u, openBlock as o, createElementBlock as $, normalizeClass as r, unref as t, createBlock as p, createCommentVNode as d, createTextVNode as S, toDisplayString as B } from "vue";
+import { R as f } from "./icon-svg-DGp2yHJn.js";
 import { _ as k } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 import './style/tag.css';const C = /* @__PURE__ */ h({
   __name: "tag",
@@ -76,7 +76,7 @@ import './style/tag.css';const C = /* @__PURE__ */ h({
         class: r(["rds-e-tag__icon", i.value]),
         "aria-hidden": "true"
       }, null, 8, ["name", "class"])) : d("", !0),
-      B(" " + S(t(_)) + " ", 1),
+      S(" " + B(t(_)) + " ", 1),
       t(c) ? (o(), p(f, {
         key: 1,
         name: "arrow_right",
@@ -85,7 +85,7 @@ import './style/tag.css';const C = /* @__PURE__ */ h({
       }, null, 8, ["class"])) : d("", !0)
     ], 2));
   }
-}), j = /* @__PURE__ */ k(C, [["__scopeId", "data-v-e784d437"]]);
+}), D = /* @__PURE__ */ k(C, [["__scopeId", "data-v-e784d437"]]);
 export {
-  j as default
+  D as default
 };

package/dist/components/textArea.es.js

@@ -1,5 +1,5 @@
-import { defineComponent as G, mergeModels as J, useModel as K, toRefs as L, ref as O, computed as o, openBlock as s, createElementBlock as f, normalizeClass as h, createElementVNode as a, withDirectives as Q, unref as e, vModelText as W, renderSlot as y, createBlock as M, mergeProps as q, toHandlers as T, createCommentVNode as i, createTextVNode as X, toDisplayString as u } from "vue";
-import { I as $ } from "./icon-svg-CeKfjk3j.js";
+import { defineComponent as G, mergeModels as J, useModel as K, toRefs as L, ref as O, computed as o, openBlock as s, createElementBlock as f, normalizeClass as h, createElementVNode as a, withDirectives as Q, unref as e, vModelText as W, renderSlot as y, createBlock as I, mergeProps as q, toHandlers as T, createCommentVNode as i, createTextVNode as X, toDisplayString as u } from "vue";
+import { R as $ } from "./icon-svg-DGp2yHJn.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;
@@ -138,23 +138,23 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
   setup(t) {
     const _ = t, d = K(t, "modelValue"), {
       label: w,
-      id: k,
+      id: S,
       disabled: p,
       maxlength: m,
       minlength: g,
       modelValue: c,
       icon: A,
-      rightIcon: S,
-      helper: z,
+      rightIcon: k,
+      helper: D,
       error: x,
-      helperText: D,
+      helperText: R,
       clearable: V,
-      lengthError: F
-    } = L(_), v = O(!1), P = () => {
+      lengthError: z
+    } = L(_), v = O(!1), F = () => {
       v.value = !1;
-    }, j = () => {
+    }, 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(() => F.value && (B.value || E.value)), H = o(() => {
+    }, 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(() => {
@@ -167,7 +167,7 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
         }
       }, n = {
         left: { ...r },
-        right: { ...r, name: S.value }
+        right: { ...r, name: k.value }
       };
       return V.value && (n.right = {
         ...r,
@@ -177,16 +177,16 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
           click: () => d.value = ""
         }
       }), n;
-    }), R = o(() => c.value.length);
+    }), H = o(() => c.value.length);
     return (r, n) => {
-      var C, I;
+      var C, M;
       return s(), f("div", {
-        class: h(["rds-e-textarea", H.value])
+        class: h(["rds-e-textarea", j.value])
       }, [
         a("div", Z, [
           a("div", ee, [
             Q(a("textarea", {
-              id: (C = e(k)) == null ? void 0 : C.toString(),
+              id: (C = e(S)) == null ? void 0 : C.toString(),
               "onUpdate:modelValue": n[0] || (n[0] = (U) => d.value = U),
               type: "text",
               class: h(["rds-e-textarea__input", { "rds-e-textarea__input--active": v.value }]),
@@ -195,8 +195,8 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
               minlength: e(g),
               rows: t.rows,
               disabled: e(p),
-              onBlur: P,
-              onFocus: j
+              onBlur: F,
+              onFocus: P
             }, null, 42, te), [
               [W, d.value]
             ]),
@@ -216,14 +216,14 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
               ])
             ], -1)),
             a("label", {
-              for: (I = e(k)) == null ? void 0 : I.toString(),
+              for: (M = e(S)) == null ? void 0 : M.toString(),
               class: h(["rds-e-textarea__label", {
                 "rds-e-textarea__label--with-icon": l.value.left.name,
                 "rds-e-textarea__label--active": v.value
               }])
             }, [
               y(r.$slots, "left-icon", {}, () => [
-                l.value.left.name ? (s(), M($, q({
+                l.value.left.name ? (s(), I($, q({
                   key: 0,
                   class: ["rds-e-textarea__icon rds-e-textarea__icon--left", { "rds-e-textarea__icon--hidden": v.value }],
                   "aria-hidden": "true"
@@ -237,9 +237,9 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
                 "rds-e-textarea__counter--clearable": e(V)
               }])
             }, [
-              t.counter && !e(S) ? (s(), f("p", ae, u(R.value) + "/" + u(e(m)), 1)) : i("", !0),
+              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(), M($, q({
+                l.value.right.name && !l.value.left.name ? (s(), I($, q({
                   key: 0,
                   class: "rds-e-textarea__icon rds-e-textarea__icon--right",
                   "aria-hidden": "true"
@@ -255,7 +255,7 @@ const Z = { class: "rds-e-textarea__container" }, ee = { class: "rds-e-textarea_
           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(z) || e(x) ? (s(), f("span", se, u(e(D)), 1)) : i("", !0)
+              e(D) || e(x) ? (s(), f("span", se, u(e(R)), 1)) : i("", !0)
             ], !0)
           ])
         ], 2)