energy-components 1.12.0 → 1.13.0

package/dist/components/checkbox.es.js

@@ -1,7 +1,8 @@
-import { defineComponent as y, ref as n, watch as b, onMounted as w, onBeforeUnmount as g, createElementBlock as S, openBlock as f, normalizeClass as d, createElementVNode as r, renderSlot as B, createTextVNode as C, createBlock as _, createCommentVNode as E, toDisplayString as L } from "vue";
-import { R as V } from "./icon-svg-DuzOdbk1.js";
-import { _ as D } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/checkbox.css';const N = ["id", "checked", "aria-label", "required", "disabled"], R = ["for"], q = /* @__PURE__ */ y({
+import { defineComponent as g, ref as n, watch as f, onMounted as S, onBeforeUnmount as B, createElementBlock as C, openBlock as r, normalizeClass as c, createElementVNode as s, renderSlot as V, createTextVNode as D, createBlock as m, createCommentVNode as E, toDisplayString as L, withCtx as N, createVNode as R } from "vue";
+import { R as k } from "./icon-svg-DuzOdbk1.js";
+import T from "./tooltip.es.js";
+import { _ as q } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/checkbox.css';const p = ["id", "checked", "aria-label", "required", "disabled"], z = ["for"], F = /* @__PURE__ */ g({
   __name: "checkbox",
   props: {
     /**
@@ -32,6 +33,13 @@ import './style/checkbox.css';const N = ["id", "checked", "aria-label", "require
       type: String,
       default: ""
     },
+    /**
+     * <span>Texto del tooltip para el icono. Si se proporciona, el icono mostrará un tooltip.</span>
+     */
+    iconTooltip: {
+      type: String,
+      default: ""
+    },
     /**
      * <span>Estado del checkbox</span>
      */
@@ -69,58 +77,58 @@ import './style/checkbox.css';const N = ["id", "checked", "aria-label", "require
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: m }) {
-    const o = e, k = m, t = n(o.isChecked), c = n(!1), i = n(!1), l = n(null);
-    b(() => o.isChecked, (a) => {
-      t.value = a;
-    }), b(
-      () => o.indeterminate,
-      (a) => {
-        l.value && (l.value.indeterminate = !!(a && t.value));
+  setup(e, { emit: h }) {
+    const l = e, x = h, a = n(l.isChecked), i = n(!1), d = n(!1), o = n(null);
+    f(() => l.isChecked, (t) => {
+      a.value = t;
+    }), f(
+      () => l.indeterminate,
+      (t) => {
+        o.value && (o.value.indeterminate = !!(t && a.value));
       },
       { immediate: !0 }
     );
-    const h = () => {
-      i.value && (c.value = !0);
-    }, v = () => c.value = !1, x = (a) => {
-      t.value = a.target.checked, k("update:modelValue", a.target.checked);
-    }, s = (a) => {
-      a.key === "Tab" && (i.value = !0);
-    }, u = () => {
-      i.value = !1;
+    const v = () => {
+      d.value && (i.value = !0);
+    }, y = () => i.value = !1, w = (t) => {
+      a.value = t.target.checked, x("update:modelValue", t.target.checked);
+    }, u = (t) => {
+      t.key === "Tab" && (d.value = !0);
+    }, b = () => {
+      d.value = !1;
     };
-    return w(() => {
-      l.value && (l.value.indeterminate = !!(o.indeterminate && t.value)), window.addEventListener("keydown", s), window.addEventListener("mousedown", u);
-    }), g(() => {
-      window.removeEventListener("keydown", s), window.removeEventListener("mousedown", u);
-    }), (a, p) => (f(), S("div", {
-      class: d(["rds-e-checkbox__container", { "rds-e-checkbox__container--focused": c.value }])
+    return S(() => {
+      o.value && (o.value.indeterminate = !!(l.indeterminate && a.value)), window.addEventListener("keydown", u), window.addEventListener("mousedown", b);
+    }), B(() => {
+      window.removeEventListener("keydown", u), window.removeEventListener("mousedown", b);
+    }), (t, I) => (r(), C("div", {
+      class: c(["rds-e-checkbox__container", { "rds-e-checkbox__container--focused": i.value }])
     }, [
-      r("input", {
+      s("input", {
         id: e.id.toString(),
         ref_key: "inputRef",
-        ref: l,
+        ref: o,
         checked: e.isChecked,
         "aria-label": e.accessibilityLabel,
         type: "checkbox",
-        class: d(["rds-e-checkbox", { "rds-e-checkbox--error": e.error }]),
+        class: c(["rds-e-checkbox", { "rds-e-checkbox--error": e.error }]),
         required: e.required,
         disabled: e.disabled,
-        onChange: x,
-        onFocus: h,
-        onBlur: v
-      }, null, 42, N),
-      r("label", {
+        onChange: w,
+        onFocus: v,
+        onBlur: y
+      }, null, 42, p),
+      s("label", {
         for: e.id.toString(),
-        class: d(["rds-e-checkbox__label", {
+        class: c(["rds-e-checkbox__label", {
           "rds-e-checkbox__label--disabled": e.disabled,
-          "rds-e-checkbox__label--checked": t.value,
-          "rds-e-checkbox__label--indeterminate": e.indeterminate && t.value
+          "rds-e-checkbox__label--checked": a.value,
+          "rds-e-checkbox__label--indeterminate": e.indeterminate && a.value
         }])
       }, [
-        B(a.$slots, "label-text", {}, () => [
-          r("span", {
-            class: d([
+        V(t.$slots, "label-text", {}, () => [
+          s("span", {
+            class: c([
               "rds-e-checkbox__label-box",
               {
                 "rds-e-checkbox__label-box--disabled": e.disabled,
@@ -128,19 +136,33 @@ import './style/checkbox.css';const N = ["id", "checked", "aria-label", "require
               }
             ])
           }, [
-            C(L(e.label) + " ", 1),
-            e.icon ? (f(), _(V, {
+            D(L(e.label) + " ", 1),
+            e.icon && e.iconTooltip ? (r(), m(T, {
               key: 0,
+              content: e.iconTooltip,
+              placement: "top",
+              "offset-space": 8
+            }, {
+              default: N(() => [
+                R(k, {
+                  class: "rds-e-checkbox__label-box--icon",
+                  name: e.icon,
+                  size: "sm"
+                }, null, 8, ["name"])
+              ]),
+              _: 1
+            }, 8, ["content"])) : e.icon ? (r(), m(k, {
+              key: 1,
               class: "rds-e-checkbox__label-box--icon",
               name: e.icon,
               size: "sm"
             }, null, 8, ["name"])) : E("", !0)
           ], 2)
         ], !0)
-      ], 10, R)
+      ], 10, z)
     ], 2));
   }
-}), K = /* @__PURE__ */ D(q, [["__scopeId", "data-v-1f3c3114"]]);
+}), $ = /* @__PURE__ */ q(F, [["__scopeId", "data-v-472a518b"]]);
 export {
-  K as default
+  $ as default
 };