energy-components 1.14.1 → 1.15.0

package/dist/components/tag.es.js

@@ -1,7 +1,7 @@
-import { defineComponent as y, toRefs as $, computed as u, createElementBlock as x, openBlock as o, normalizeClass as l, createBlock as p, createCommentVNode as d, createElementVNode as S, unref as t, toDisplayString as b } from "vue";
-import { R as f } from "./icon-svg-DuzOdbk1.js";
-import { _ as B } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/tag.css';const k = { class: "rds-caption-tag" }, C = /* @__PURE__ */ y({
+import { defineComponent as y, toRefs as S, computed as u, createElementBlock as $, openBlock as o, normalizeClass as l, createBlock as d, createCommentVNode as p, createElementVNode as x, unref as s, toDisplayString as B } from "vue";
+import { R as f } from "./icon-svg-BU0OQFKH.js";
+import { _ as b } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/tag.css';const k = ["id"], C = { class: "rds-caption-tag" }, N = /* @__PURE__ */ y({
   __name: "tag",
   props: {
     /**
@@ -26,7 +26,7 @@ import './style/tag.css';const k = { class: "rds-caption-tag" }, C = /* @__PURE_
     type: {
       type: String,
       default: "default",
-      validator: (s) => ["default", "information", "success", "error", "warning", "promo"].includes(s)
+      validator: (t) => ["default", "information", "success", "error", "warning", "promo"].includes(t)
     },
     /**
      * Define si el tag tiene una acción asociada.
@@ -50,42 +50,50 @@ import './style/tag.css';const k = { class: "rds-caption-tag" }, C = /* @__PURE_
     small: {
       type: Boolean,
       default: !1
+    },
+    /**
+     * ID del tag para testing
+     */
+    id: {
+      type: String,
+      default: void 0
     }
   },
-  setup(s) {
-    const m = s, {
+  setup(t) {
+    const m = t, {
       type: r,
-      actionable: c,
+      actionable: i,
       icon: n,
       text: _,
       inverse: g,
       small: v
-    } = $(m), h = u(() => {
+    } = S(m), h = u(() => {
       const a = "rds-e-tag", e = [];
-      return g.value && e.push(`${a}--inverse`), c.value && e.push(`${a}--actionable`), n.value && e.push(`${a}--icon`), v.value && e.push(`${a}--small`), e.push(`${a}--${r.value}`), e.join(" ");
-    }), i = u(() => {
+      return g.value && e.push(`${a}--inverse`), i.value && e.push(`${a}--actionable`), n.value && e.push(`${a}--icon`), v.value && e.push(`${a}--small`), e.push(`${a}--${r.value}`), e.join(" ");
+    }), c = u(() => {
       const a = "rds-e-tag_icon", e = [];
       return e.push(`${a}--${r.value}`), e.join(" ");
     });
-    return (a, e) => (o(), x("div", {
+    return (a, e) => (o(), $("div", {
+      id: t.id,
       class: l(["rds-e-tag rds-e-caption-tag", h.value])
     }, [
-      t(n) ? (o(), p(f, {
+      s(n) ? (o(), d(f, {
         key: 0,
-        name: t(n),
-        class: l(["rds-e-tag__icon", i.value]),
+        name: s(n),
+        class: l(["rds-e-tag__icon", c.value]),
         "aria-hidden": "true"
-      }, null, 8, ["name", "class"])) : d("", !0),
-      S("span", k, b(t(_)), 1),
-      t(c) ? (o(), p(f, {
+      }, null, 8, ["name", "class"])) : p("", !0),
+      x("span", C, B(s(_)), 1),
+      s(i) ? (o(), d(f, {
         key: 1,
         name: "arrow_right",
-        class: l(["rds-e-tag__icon-actionable", i.value]),
+        class: l(["rds-e-tag__icon-actionable", c.value]),
         "aria-hidden": "true"
-      }, null, 8, ["class"])) : d("", !0)
-    ], 2));
+      }, null, 8, ["class"])) : p("", !0)
+    ], 10, k));
   }
-}), j = /* @__PURE__ */ B(C, [["__scopeId", "data-v-5e8bf5cb"]]);
+}), w = /* @__PURE__ */ b(N, [["__scopeId", "data-v-ac2ecb64"]]);
 export {
-  j as default
+  w as default
 };

package/dist/components/textArea.es.js

@@ -1,10 +1,10 @@
-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 { defineComponent as Q, mergeModels as W, useModel as X, toRefs as Y, ref as k, computed as s, createElementBlock as f, openBlock as o, normalizeClass as u, createElementVNode as r, withDirectives as Z, unref as e, vModelText as ee, renderSlot as S, createTextVNode as te, createBlock as z, createCommentVNode as i, mergeProps as F, toHandlers as T, toDisplayString as _ } from "vue";
+import { R as A } from "./icon-svg-BU0OQFKH.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;
+import './style/textArea.css';function V(t, p = !0, d = !0) {
+  return p && !t.trim() ? (console.warn("Advertencia: El valor no puede estar vacío"), !1) : d && !/^[\w\s\u00C0-\u017F\-:.,;()¿?¡!%"'$€]+$/.test(t) ? (console.warn("Advertencia: El valor contiene caracteres inválidos"), !1) : !0;
 }
-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({
+const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "maxlength", "minlength", "rows", "disabled"], ne = ["for"], oe = { key: 0 }, se = { key: 0 }, ue = { key: 1 }, ie = { key: 0 }, de = /* @__PURE__ */ Q({
   __name: "text-area",
   props: /* @__PURE__ */ W({
     /**
@@ -136,34 +136,34 @@ const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "ma
   }),
   emits: ["update:modelValue"],
   setup(t) {
-    const g = t, c = X(t, "modelValue"), {
+    const p = t, d = X(t, "modelValue"), {
       label: B,
-      id: M,
-      disabled: x,
-      maxlength: m,
-      minlength: y,
-      modelValue: v,
-      icon: R,
-      rightIcon: E,
-      helper: z,
-      error: b,
+      id: E,
+      disabled: g,
+      maxlength: x,
+      minlength: C,
+      modelValue: c,
+      icon: H,
+      rightIcon: M,
+      helper: R,
+      error: y,
       helperText: P,
-      clearable: w,
-      lengthError: j
-    } = Y(g), f = k(!1), _ = k(!1), p = k(!1), H = () => {
-      p.value = !0;
+      clearable: b,
+      lengthError: w
+    } = Y(p), v = k(!1), m = k(!1), h = k(!1), j = () => {
+      h.value = !0;
     }, K = () => {
-      f.value = !1, _.value = !1, p.value = !1;
+      v.value = !1, m.value = !1, h.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(() => {
+      v.value = !0, m.value = !h.value, h.value = !1;
+    }, N = s(() => c.value.length === x.value), I = s(() => c.value.length === 0 ? !1 : c.value.length < C.value), D = s(() => w.value && (N.value || I.value)), G = s(() => {
       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(" ");
+      return c.value && a.push("rds-e-textarea--filled"), y.value && a.push("rds-e-textarea--error"), g.value && a.push("rds-e-textarea--disabled"), D.value && a.push("rds-e-textarea--error"), a.join(" ");
     }), J = () => {
-      c.value = "";
-    }, l = o(() => {
+      d.value = "";
+    }, l = s(() => {
       const a = {
-        name: R.value,
+        name: H.value,
         class: "",
         events: {
           click: () => {
@@ -171,9 +171,9 @@ const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "ma
         }
       }, n = {
         left: { ...a },
-        right: { ...a, name: E.value }
+        right: { ...a, name: M.value }
       };
-      return w.value && (n.right = {
+      return b.value && (n.right = {
         ...a,
         name: "close",
         class: "rds-e-textfield__icon--clear",
@@ -181,34 +181,34 @@ const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "ma
           click: () => J()
         }
       }), n;
-    }), L = o(() => v.value.length);
+    }), L = s(() => c.value.length);
     return (a, n) => {
-      var D, q;
-      return s(), h("div", {
+      var $, q;
+      return o(), f("div", {
         class: u(["rds-e-textarea", G.value])
       }, [
         r("div", {
           class: u(["rds-e-textarea__container", {
-            "rds-e-textarea__container--keyboard-focus": _.value,
-            "rds-e-textarea__container--active": f.value && !_.value
+            "rds-e-textarea__container--keyboard-focus": m.value,
+            "rds-e-textarea__container--active": v.value && !m.value
           }]),
-          onMousedown: H
+          onMousedown: j
         }, [
           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),
+              id: ($ = e(E)) == null ? void 0 : $.toString(),
+              "onUpdate:modelValue": n[0] || (n[0] = (O) => d.value = O),
               type: "text",
-              class: u(["rds-e-textarea__input", { "rds-e-textarea__input--active": f.value }]),
+              class: u(["rds-e-textarea__input", { "rds-e-textarea__input--active": v.value }]),
               name: t.name,
-              maxlength: e(m),
-              minlength: e(y),
+              maxlength: e(x),
+              minlength: e(C),
               rows: t.rows,
-              disabled: e(x),
+              disabled: e(g),
               onBlur: K,
               onFocus: U
             }, null, 42, le), [
-              [ee, c.value]
+              [ee, d.value]
             ]),
             n[1] || (n[1] = r("div", { class: "rds-e-textarea__resize-handle" }, [
               r("svg", {
@@ -226,53 +226,53 @@ const re = { class: "rds-e-textarea__input-container" }, le = ["id", "name", "ma
               ])
             ], -1)),
             r("label", {
-              for: (q = e(M)) == null ? void 0 : q.toString(),
+              for: (q = e(E)) == 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": f.value
+                "rds-e-textarea__label--active": v.value
               }])
             }, [
               S(a.$slots, "left-icon", {}, () => [
-                l.value.left.name ? (s(), T(F, $({
+                l.value.left.name ? (o(), z(A, F({
                   key: 0,
                   class: "rds-e-textarea__icon rds-e-textarea__icon--left",
                   "aria-hidden": "true"
-                }, l.value.left, A(l.value.left.events)), null, 16)) : i("", !0)
+                }, l.value.left, T(l.value.left.events)), null, 16)) : i("", !0)
               ], !0),
-              te(" " + d(e(B)), 1)
+              te(" " + _(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)
+                "rds-e-textarea__counter--disabled": e(g),
+                "rds-e-textarea__counter--clearable": e(b)
               }])
             }, [
-              t.counter && !e(E) && !e(w) ? (s(), h("p", se, d(L.value) + "/" + d(e(m)), 1)) : i("", !0),
+              t.counter && !e(M) && !e(b) ? (o(), f("p", oe, _(L.value) + "/" + _(e(x)), 1)) : i("", !0),
               S(a.$slots, "right-icon", {}, () => [
-                l.value.right.name ? (s(), T(F, $({
+                l.value.right.name ? (o(), z(A, F({
                   key: 0,
                   class: "rds-e-textarea__icon rds-e-textarea__icon--right",
                   "aria-hidden": "true"
-                }, l.value.right, A(l.value.right.events)), null, 16)) : i("", !0)
+                }, l.value.right, T(l.value.right.events)), null, 16)) : i("", !0)
               ], !0)
             ], 2)
           ])
         ], 34),
         r("ul", {
-          class: u(["rds-e-textarea__helper", e(b) || I.value ? "rds-e-textarea__helper--error" : ""])
+          class: u(["rds-e-textarea__helper", e(y) || D.value ? "rds-e-textarea__helper--error" : ""])
         }, [
-          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),
+          N.value && e(w) ? (o(), f("li", se, " Ha alcanzado el número máximo de carácteres ")) : i("", !0),
+          I.value && e(w) ? (o(), f("li", ue, " Ha alcanzado el número mínimo de carácteres ")) : i("", !0),
           r("li", null, [
             S(a.$slots, "helper-text", {}, () => [
-              e(z) || e(b) ? (s(), h("span", ie, d(e(P)), 1)) : i("", !0)
+              e(R) || e(y) ? (o(), f("span", ie, _(e(P)), 1)) : i("", !0)
             ], !0)
           ])
         ], 2)
       ], 2);
     };
   }
-}), he = /* @__PURE__ */ ae(de, [["__scopeId", "data-v-cdbbf388"]]);
+}), me = /* @__PURE__ */ ae(de, [["__scopeId", "data-v-b6c3c9f8"]]);
 export {
-  he as default
+  me as default
 };

package/dist/components/textField.es.js

@@ -1,6 +1,6 @@
 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 h, normalizeClass as k, createElementVNode as g, 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 { R as K, s as pe } from "./icon-svg-BU0OQFKH.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,

package/dist/components/toggle.es.js

@@ -1,6 +1,6 @@
-import { defineComponent as c, toRefs as E, ref as L, onMounted as h, createElementBlock as y, openBlock as B, normalizeClass as r, createElementVNode as p, unref as i, toDisplayString as f } from "vue";
+import { defineComponent as T, toRefs as c, ref as E, onMounted as L, createElementBlock as y, openBlock as B, normalizeClass as r, createElementVNode as p, unref as u, toDisplayString as f } from "vue";
 import { _ as F } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/toggle.css';const I = /* @__PURE__ */ c({
+import './style/toggle.css';const I = ["id"], R = ["id"], _ = ["id"], G = /* @__PURE__ */ T({
   __name: "toggle",
   props: {
     small: { type: Boolean },
@@ -10,19 +10,21 @@ import './style/toggle.css';const I = /* @__PURE__ */ c({
     valueLeft: {},
     valueRight: {},
     labelLeft: {},
-    labelRight: {}
+    labelRight: {},
+    id: {}
   },
   emits: ["update:modelValue"],
   setup(m, { emit: v }) {
-    const b = m, u = v, { modelValue: l, switchType: s, valueLeft: n, valueRight: o } = E(b), t = {
+    const b = m, i = v, { modelValue: l, switchType: s, valueLeft: d, valueRight: o } = c(b), t = {
       LEFT: "left",
       RIGHT: "right"
-    }, a = L(t.LEFT), g = (e) => {
-      u("update:modelValue", e);
+    }, a = E(t.LEFT), g = (e) => {
+      i("update:modelValue", e);
     };
-    return h(() => {
-      s != null && s.value ? (u("update:modelValue", l == null ? void 0 : l.value), a.value = l != null && l.value ? t.RIGHT : t.LEFT) : (l == null ? void 0 : l.value) === (o == null ? void 0 : o.value) ? (u("update:modelValue", o == null ? void 0 : o.value), a.value = t.RIGHT) : (u("update:modelValue", n == null ? void 0 : n.value), a.value = t.LEFT);
-    }), (e, d) => (B(), y("div", {
+    return L(() => {
+      s != null && s.value ? (i("update:modelValue", l == null ? void 0 : l.value), a.value = l != null && l.value ? t.RIGHT : t.LEFT) : (l == null ? void 0 : l.value) === (o == null ? void 0 : o.value) ? (i("update:modelValue", o == null ? void 0 : o.value), a.value = t.RIGHT) : (i("update:modelValue", d == null ? void 0 : d.value), a.value = t.LEFT);
+    }), (e, n) => (B(), y("div", {
+      id: e.id,
       class: r(["rds-e-toggle", [
         {
           "rds-e-toggle--small-full-width": e.small && e.fullWidth,
@@ -33,22 +35,24 @@ import './style/toggle.css';const I = /* @__PURE__ */ c({
       ]])
     }, [
       p("button", {
+        id: e.id ? `${e.id}-left` : void 0,
         class: r(["rds-e-toggle__tab", {
           "rds-e-toggle__tab--active": a.value === t.LEFT
         }]),
         type: "button",
-        onClick: d[0] || (d[0] = (T) => (g(i(s) ? !0 : i(n)), a.value = t.LEFT))
-      }, f(e.labelLeft), 3),
+        onClick: n[0] || (n[0] = (h) => (g(u(s) ? !0 : u(d)), a.value = t.LEFT))
+      }, f(e.labelLeft), 11, R),
       p("button", {
+        id: e.id ? `${e.id}-right` : void 0,
         class: r(["rds-e-toggle__tab", {
           "rds-e-toggle__tab--active": a.value === t.RIGHT
         }]),
         type: "button",
-        onClick: d[1] || (d[1] = (T) => (g(i(s) ? !1 : i(o)), a.value = t.RIGHT))
-      }, f(e.labelRight), 3)
-    ], 2));
+        onClick: n[1] || (n[1] = (h) => (g(u(s) ? !1 : u(o)), a.value = t.RIGHT))
+      }, f(e.labelRight), 11, _)
+    ], 10, I));
   }
-}), H = /* @__PURE__ */ F(I, [["__scopeId", "data-v-30b07e72"]]);
+}), k = /* @__PURE__ */ F(G, [["__scopeId", "data-v-be1c5818"]]);
 export {
-  H as default
+  k as default
 };