energy-components 1.10.0 → 1.10.1

package/dist/components/breadcrumbs.es.js

@@ -1,7 +1,7 @@
-import { defineComponent as g, toRefs as h, ref as y, watchEffect as C, onMounted as L, createElementBlock as c, openBlock as l, Fragment as I, renderList as w, normalizeClass as x, unref as B, createVNode as j, mergeProps as E, toHandlers as P, withCtx as T, createCommentVNode as D } from "vue";
+import { defineComponent as g, toRefs as h, ref as C, watchEffect as y, onMounted as L, createElementBlock as c, openBlock as l, Fragment as I, renderList as w, normalizeClass as x, unref as B, createVNode as j, mergeProps as E, toHandlers as P, withCtx as T, createCommentVNode as D } from "vue";
 import N from "./link.es.js";
 import { _ as O } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/breadcrumbs.css';const R = { key: 0 }, V = /* @__PURE__ */ g({
+import './style/breadcrumbs.css';const R = { key: 0 }, S = /* @__PURE__ */ g({
   __name: "breadcrumbs",
   props: {
     /**
@@ -28,14 +28,14 @@ import './style/breadcrumbs.css';const R = { key: 0 }, V = /* @__PURE__ */ g({
   },
   emits: ["onClickTrimmedList"],
   setup(d, { emit: p }) {
-    const s = d, f = p, {
-      items: t,
+    const t = d, f = p, {
+      items: s,
       inverse: o
-    } = h(s), n = y(), v = () => {
-      f("onClickTrimmedList", t.value.slice(1, -1));
-    }, m = () => {
+    } = h(t), n = C(), m = () => {
+      f("onClickTrimmedList", s.value.slice(1, -1));
+    }, v = () => {
       n.value = [
-        t.value[0],
+        s.value[0],
         {
           text: "...",
           active: !1,
@@ -43,29 +43,31 @@ import './style/breadcrumbs.css';const R = { key: 0 }, V = /* @__PURE__ */ g({
           to: "",
           clickable: !0
         },
-        t.value[t.value.length - 1]
+        s.value[s.value.length - 1]
       ];
     }, u = () => {
-      s.trimItems && t.value.length > 3 ? m() : typeof s.items == "object" ? n.value = s.items : console.error("energy-components: The prop is not an Object");
-    }, b = (e, a) => {
+      t.trimItems && s.value.length > 3 ? v() : typeof t.items == "object" ? n.value = t.items : console.error("energy-components: The prop is not an Object");
+    }, _ = (e, a) => {
       const r = {
         ...e,
-        inverse: o.value
+        inverse: o.value,
+        customClass: "rds-e-breadcrumbs__link--text"
       };
       return a !== n.value.length - 1 && Object.assign(r, {
         arrow: !0,
-        right: !0
+        right: !0,
+        arrowSmall: !0
       }), r;
-    }, _ = (e) => ({
+    }, b = (e) => ({
       click: (r) => {
-        r.preventDefault(), r.stopPropagation(), e != null && e.clickable && v();
+        r.preventDefault(), r.stopPropagation(), e != null && e.clickable && m();
       }
     }), k = (e) => [
       "rds-e-breadcrumbs__link",
       e != null && e.active ? "rds-e-breadcrumbs__link--active" : "",
       o.value && (e != null && e.active) ? "rds-e-breadcrumbs__link--inverse-active" : ""
     ];
-    return C(() => {
+    return y(() => {
       u();
     }), L(() => {
       u();
@@ -75,7 +77,7 @@ import './style/breadcrumbs.css';const R = { key: 0 }, V = /* @__PURE__ */ g({
     }, [
       j(N, E({
         class: k(r)
-      }, { ref_for: !0 }, b(r, i), P(_(r))), {
+      }, { ref_for: !0 }, _(r, i), P(b(r))), {
         default: T(() => [
           r != null && r.clickable ? (l(), c("span", R, "...")) : D("", !0)
         ]),
@@ -83,7 +85,7 @@ import './style/breadcrumbs.css';const R = { key: 0 }, V = /* @__PURE__ */ g({
       }, 1040, ["class"])
     ], 2))), 128));
   }
-}), F = /* @__PURE__ */ O(V, [["__scopeId", "data-v-f9b5ced9"]]);
+}), A = /* @__PURE__ */ O(S, [["__scopeId", "data-v-696e4937"]]);
 export {
-  F as default
+  A as default
 };

package/dist/components/button.es.js

@@ -1,7 +1,7 @@
-import { defineComponent as B, toRefs as S, computed as l, createElementBlock as x, openBlock as b, normalizeClass as m, unref as o, createBlock as I, createCommentVNode as k, createElementVNode as $, renderSlot as C, createTextVNode as N, toDisplayString as R } from "vue";
-import { R as V } from "./icon-svg-DuzOdbk1.js";
-import { _ as D } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-btn__text" }, w = /* @__PURE__ */ B({
+import { defineComponent as S, toRefs as x, computed as r, createElementBlock as I, openBlock as b, normalizeClass as m, unref as s, createBlock as $, createCommentVNode as k, createElementVNode as C, renderSlot as N, createTextVNode as R, toDisplayString as V } from "vue";
+import { R as D } from "./icon-svg-DuzOdbk1.js";
+import { _ as E } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/button.css';const L = ["type", "disabled"], w = { class: "rds-e-btn__text" }, W = /* @__PURE__ */ S({
   __name: "button",
   props: {
     /**
@@ -10,8 +10,8 @@ import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-
     text: {
       type: String,
       default: "",
-      validator(e, t) {
-        return !e && !t.icon ? (console.info("No se han pasado ni texto ni icono al botón"), !1) : !0;
+      validator(t, a) {
+        return !t && !a.icon ? (console.info("No se han pasado ni texto ni icono al botón"), !1) : !0;
       }
     },
     /**
@@ -20,8 +20,8 @@ import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-
     icon: {
       type: String,
       default: "",
-      validator(e, t) {
-        return !e && !t.text ? (console.info("No se han pasado ni texto ni icono al botón"), !1) : !0;
+      validator(t, a) {
+        return !t && !a.text ? (console.info("No se han pasado ni texto ni icono al botón"), !1) : !0;
       }
     },
     /**
@@ -32,11 +32,11 @@ import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-
     type: {
       type: String,
       default: "button",
-      validator(e) {
-        const t = ["button", "submit", "reset"].includes(e);
-        return t || console.info(
-          `El tipo ${e} no es válido. Los tipos válidos son: button, submit, reset`
-        ), t;
+      validator(t) {
+        const a = ["button", "submit", "reset"].includes(t);
+        return a || console.info(
+          `El tipo ${t} no es válido. Los tipos válidos son: button, submit, reset`
+        ), a;
       }
     },
     /**
@@ -47,11 +47,11 @@ import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-
     variant: {
       type: String,
       default: "primary",
-      validator(e) {
-        const t = ["primary", "secondary", "ghost", "commercial"].includes(e);
-        return t || console.info(
-          `La variante ${e} no es válida. Las variantes válidas son: primary, secondary, ghost, commercial`
-        ), t;
+      validator(t) {
+        const a = ["primary", "secondary", "ghost", "commercial"].includes(t);
+        return a || console.info(
+          `La variante ${t} no es válida. Las variantes válidas son: primary, secondary, ghost, commercial`
+        ), a;
       }
     },
     /**
@@ -95,49 +95,57 @@ import './style/button.css';const E = ["type", "disabled"], L = { class: "rds-e-
     loading: {
       type: Boolean,
       default: !1
+    },
+    /**
+     * <span>Indica si el botón es destructivo (solo para variantes 'secondary' y 'ghost')</span>
+     */
+    destructive: {
+      type: Boolean,
+      default: !1
     }
   },
-  setup(e) {
-    const t = e, {
-      text: s,
+  setup(t) {
+    const a = t, {
+      text: l,
       icon: n,
-      type: r,
-      variant: i,
-      small: f,
-      disabled: u,
+      type: i,
+      variant: u,
+      small: p,
+      disabled: d,
       mobileWidth: y,
-      inverse: d,
-      revertIcon: _,
-      loading: p
-    } = S(t), c = l(() => p.value ? "loading" : n != null && n.value ? n == null ? void 0 : n.value : ""), h = l(() => r.value && ["button", "submit", "reset"].includes(r.value) ? r.value : "button"), v = l(() => ["primary", "secondary", "ghost", "commercial"].includes(i.value) ? i.value : "primary"), g = l(() => {
-      const a = ["rds-e-btn"];
-      return i.value && a.push(`rds-e-btn--${v.value}`), d.value && a.push(`rds-e-btn--${v.value}-inverse`), c.value && a.push(
-        s != null && s.value ? "rds-e-btn--with-icon" : "rds-e-btn--icon"
-      ), f.value && a.push("rds-e-btn--small"), _.value && a.push("rds-e-btn--revert"), u.value && a.push("rds-e-style-state-disabled"), p.value && a.push("rds-e-btn--loading"), y.value && a.push("rds-e-btn--mobile-width"), a.join(" ");
+      inverse: c,
+      revertIcon: h,
+      loading: v,
+      destructive: _
+    } = x(a), f = r(() => v.value ? "loading" : n != null && n.value ? n == null ? void 0 : n.value : ""), g = r(() => i.value && ["button", "submit", "reset"].includes(i.value) ? i.value : "button"), o = r(() => ["primary", "secondary", "ghost", "commercial"].includes(u.value) ? u.value : "primary"), B = r(() => {
+      const e = ["rds-e-btn"];
+      return u.value && e.push(`rds-e-btn--${o.value}`), c.value && e.push(`rds-e-btn--${o.value}-inverse`), f.value && e.push(
+        l != null && l.value ? "rds-e-btn--with-icon" : "rds-e-btn--icon"
+      ), p.value && e.push("rds-e-btn--small"), h.value && e.push("rds-e-btn--revert"), d.value && e.push("rds-e-style-state-disabled"), v.value && e.push("rds-e-btn--loading"), y.value && e.push("rds-e-btn--mobile-width"), _.value && (o.value === "secondary" || o.value === "ghost") && e.push(`rds-e-btn--${o.value}-destructive`), e.join(" ");
     });
-    return (a, W) => (b(), x("button", {
-      type: h.value,
-      disabled: o(u),
-      class: m(g.value)
+    return (e, j) => (b(), I("button", {
+      type: g.value,
+      disabled: s(d),
+      class: m(B.value)
     }, [
-      c.value ? (b(), I(V, {
+      f.value ? (b(), $(D, {
         key: 0,
-        name: c.value,
-        small: o(f),
+        name: f.value,
+        small: s(p),
         class: m(["rds-e-btn__icon", [
-          o(d) ? `rds-e-btn__icon--${o(d)}` : "",
-          o(u) ? "rds-e-btn__icon--disabled" : ""
+          s(c) ? `rds-e-btn__icon--${s(c)}` : "",
+          s(d) ? "rds-e-btn__icon--disabled" : ""
         ]]),
         "aria-hidden": "true"
       }, null, 8, ["name", "small", "class"])) : k("", !0),
-      $("span", L, [
-        C(a.$slots, "default", {}, () => [
-          N(R(o(s)), 1)
+      C("span", w, [
+        N(e.$slots, "default", {}, () => [
+          R(V(s(l)), 1)
         ], !0)
       ])
-    ], 10, E));
+    ], 10, L));
   }
-}), T = /* @__PURE__ */ D(w, [["__scopeId", "data-v-ad01f4e1"]]);
+}), q = /* @__PURE__ */ E(W, [["__scopeId", "data-v-9550b6cc"]]);
 export {
-  T as default
+  q as default
 };

package/dist/components/link.es.js

@@ -1,7 +1,7 @@
-import { defineComponent as E, toRefs as L, computed as c, createBlock as p, openBlock as o, resolveDynamicComponent as N, unref as e, normalizeStyle as V, normalizeClass as _, withCtx as $, createCommentVNode as i, createElementBlock as b, mergeProps as k, renderSlot as B, createTextVNode as I, toDisplayString as D } from "vue";
+import { defineComponent as L, toRefs as N, computed as f, createBlock as p, openBlock as s, resolveDynamicComponent as V, unref as e, normalizeStyle as $, normalizeClass as _, withCtx as M, createCommentVNode as d, createElementBlock as I, mergeProps as k, renderSlot as D, createTextVNode as R, toDisplayString as j } from "vue";
 import { R as v } from "./icon-svg-DuzOdbk1.js";
-import { _ as M } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/link.css';const O = /* @__PURE__ */ E({
+import { _ as O } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/link.css';const P = /* @__PURE__ */ L({
   __name: "link",
   props: {
     /**
@@ -23,7 +23,7 @@ import './style/link.css';const O = /* @__PURE__ */ E({
     icon: {
       type: Object,
       default: () => ({ name: "", modifier: "" }),
-      validator: (s) => typeof s.name == "string" && (s.modifier === void 0 || typeof s.modifier == "string") ? !0 : (console.error("El icono debe tener una propiedad name de tipo string y una propiedad modifier opcional de tipo string"), !1)
+      validator: (o) => typeof o.name == "string" && (o.modifier === void 0 || typeof o.modifier == "string") ? !0 : (console.error("El icono debe tener una propiedad name de tipo string y una propiedad modifier opcional de tipo string"), !1)
     },
     /**
      * <span>Tag del link</span>
@@ -60,6 +60,13 @@ import './style/link.css';const O = /* @__PURE__ */ E({
       type: Boolean,
       default: !1
     },
+    /**
+     * <span>Indica si la flecha del link debe ser pequeña</span>
+     */
+    arrowSmall: {
+      type: Boolean,
+      default: !1
+    },
     /**
      * <span>Indica si el icono esta a la derecha</span>
      */
@@ -82,42 +89,45 @@ import './style/link.css';const O = /* @__PURE__ */ E({
       default: ""
     }
   },
-  setup(s) {
-    const y = s, {
-      text: g,
-      to: w,
+  setup(o) {
+    const y = o, {
+      text: w,
+      to: g,
       icon: r,
       tag: u,
-      disabled: f,
+      disabled: i,
       inverse: m,
-      arrow: d,
+      arrow: c,
       right: t,
       underline: h,
-      customClass: R,
-      color: l
-    } = L(y), j = c(() => l.value ? { color: l.value } : void 0), z = c(() => {
-      var n, C;
+      customClass: b,
+      color: l,
+      arrowSmall: x
+    } = N(y), z = f(() => l.value ? { color: l.value } : void 0), E = f(() => {
+      var n, B;
       const a = ["rds-e-link"];
-      return m.value && a.push("rds-e-link--inverse"), h.value && a.push("rds-e-link--underline"), f.value && a.push("rds-e-style-state-disabled"), ((n = r == null ? void 0 : r.value) == null ? void 0 : n.name) !== "arrow" && a.push("rds-e-arrow-link"), ((C = r == null ? void 0 : r.value) == null ? void 0 : C.name) !== "arrow" && m.value && a.push("rds-e-arrow-link__icon--inverse"), a.join(" ");
-    }), S = c(() => {
+      return m.value && a.push("rds-e-link--inverse"), h.value && a.push("rds-e-link--underline"), i.value && a.push("rds-e-style-state-disabled"), ((n = r == null ? void 0 : r.value) == null ? void 0 : n.name) !== "arrow" && a.push("rds-e-arrow-link"), ((B = r == null ? void 0 : r.value) == null ? void 0 : B.name) !== "arrow" && m.value && a.push("rds-e-arrow-link__icon--inverse"), b.value === "rds-e-breadcrumbs__link--text" && a.push("rds-e-link__breadcrumbs"), a.join(" ");
+    }), S = f(() => {
       var n;
       const a = ["rds-e-arrow-link__icon--arrow"];
-      return r != null && r.value && (a.push("rds-e-arrow-link__icon"), f.value && a.push("rds-e-arrow-link__icon--disabled")), ((n = r == null ? void 0 : r.value) == null ? void 0 : n.name) !== "arrow" && m.value && a.push("rds-e-arrow-link__icon--inverse"), a.push(
+      return r != null && r.value && (a.push("rds-e-arrow-link__icon"), i.value && a.push("rds-e-arrow-link__icon--disabled")), ((n = r == null ? void 0 : r.value) == null ? void 0 : n.name) !== "arrow" && m.value && a.push("rds-e-arrow-link__icon--inverse"), a.push(
         t.value ? "rds-e-arrow-link__icon--animation-right" : "rds-e-arrow-link__icon--animation-left"
       ), a.join(" ");
-    }), x = c(() => {
+    }), C = f(() => {
       var a;
-      return d.value || ((a = r == null ? void 0 : r.value) == null ? void 0 : a.name);
+      return c.value || ((a = r == null ? void 0 : r.value) == null ? void 0 : a.name);
     });
-    return (a, n) => (o(), p(N(e(u) === "a" ? e(u) : "router-link"), {
-      class: _(z.value),
-      to: e(u) === "router-link" ? e(w) : null,
-      href: e(u) === "a" ? e(w) : null,
-      disable: e(f),
-      style: V(j.value)
+    return (a, n) => (s(), p(V(e(u) === "a" ? e(u) : "router-link"), {
+      class: _(E.value),
+      to: e(u) === "router-link" ? e(g) : null,
+      href: e(u) === "a" ? e(g) : null,
+      disable: e(i),
+      style: $(z.value),
+      tabindex: e(i) ? -1 : void 0,
+      "aria-disabled": e(i)
     }, {
-      default: $(() => [
-        e(r).name && !e(t) && !e(d) ? (o(), p(v, k({
+      default: M(() => [
+        e(r).name && !e(t) && !e(c) ? (s(), p(v, k({
           key: 0,
           name: e(r).name
         }, {
@@ -125,46 +135,48 @@ import './style/link.css';const O = /* @__PURE__ */ E({
         }, {
           class: ["rds-e-link__icon-left", S.value],
           style: e(l) ? { color: e(l) } : void 0
-        }), null, 16, ["name", "class", "style"])) : i("", !0),
-        e(t) ? (o(), b("span", {
+        }), null, 16, ["name", "class", "style"])) : d("", !0),
+        e(t) ? (s(), I("span", {
           key: 1,
-          class: _(["rds-e-link__text", [e(R), {
-            "rds-e-mr-xs": x.value,
+          class: _(["rds-e-link__text", [e(b), {
+            "rds-e-mr-xs": C.value,
             "rds-e-link__text--underline": e(h)
           }]])
         }, [
-          B(a.$slots, "default", {}, () => [
-            I(D(e(g)), 1)
+          D(a.$slots, "default", {}, () => [
+            R(j(e(w)), 1)
           ], !0)
-        ], 2)) : i("", !0),
-        e(d) ? (o(), p(v, k({ key: 2 }, {
-          name: e(t) ? "arrow_right" : "arrow_left"
+        ], 2)) : d("", !0),
+        e(c) ? (s(), p(v, k({ key: 2 }, {
+          name: e(t) ? "arrow_right" : "arrow_left",
+          size: e(x) ? 16 : void 0
         }, {
           class: ["rds-e-arrow-link__icon--arrow", [
-            e(t) ? "rds-e-arrow-link__icon--animation-right" : "rds-e-arrow-link__icon--animation-left"
+            e(t) ? "rds-e-arrow-link__icon--animation-right" : "rds-e-arrow-link__icon--animation-left",
+            { "rds-flex rds-flex-center-center": e(x) }
           ]],
           style: e(l) ? { color: e(l) } : void 0
-        }), null, 16, ["class", "style"])) : i("", !0),
-        e(t) ? i("", !0) : (o(), b("span", {
+        }), null, 16, ["class", "style"])) : d("", !0),
+        e(t) ? d("", !0) : (s(), I("span", {
           key: 3,
-          class: _(["rds-e-link__text", { "rds-e-ml-xs": x.value }])
+          class: _(["rds-e-link__text", { "rds-e-ml-xs": C.value }])
         }, [
-          B(a.$slots, "default", {}, () => [
-            I(D(e(g)), 1)
+          D(a.$slots, "default", {}, () => [
+            R(j(e(w)), 1)
           ], !0)
         ], 2)),
-        e(r).name && e(t) && !e(d) ? (o(), p(v, k({
+        e(r).name && e(t) && !e(c) ? (s(), p(v, k({
           key: 4,
           name: e(r).name
         }, e(r), {
           class: ["rds-e-link__icon-right", S.value],
           style: e(l) ? { color: e(l) } : void 0
-        }), null, 16, ["name", "class", "style"])) : i("", !0)
+        }), null, 16, ["name", "class", "style"])) : d("", !0)
       ]),
       _: 3
-    }, 8, ["class", "to", "href", "disable", "style"]));
+    }, 8, ["class", "to", "href", "disable", "style", "tabindex", "aria-disabled"]));
   }
-}), A = /* @__PURE__ */ M(O, [["__scopeId", "data-v-49b40e60"]]);
+}), F = /* @__PURE__ */ O(P, [["__scopeId", "data-v-377c1eda"]]);
 export {
-  A as default
+  F as default
 };