energy-components 1.8.1 → 1.9.0

package/dist/components/avatar.es.js

@@ -0,0 +1,161 @@
+import { defineComponent as _, computed as a, createElementBlock as s, openBlock as r, withKeys as o, normalizeStyle as u, normalizeClass as h, createBlock as k, createCommentVNode as b, toDisplayString as z } from "vue";
+import { R as C } from "./icon-svg-_WCkLP8-.js";
+import { _ as w } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/avatar.css';const A = ["aria-label"], B = ["src", "alt"], D = {
+  key: 1,
+  class: "rds-e-avatar__initials"
+}, N = {
+  key: 3,
+  class: "rds-e-avatar__badge",
+  "aria-hidden": "true"
+}, E = /* @__PURE__ */ _({
+  __name: "avatar",
+  props: {
+    /**
+     * Tipo de contenido para el avatar.
+     * <br>
+     * `['icon', 'image', 'initials']`
+     */
+    type: {
+      type: String,
+      default: "icon",
+      validator: (t) => ["icon", "image", "initials"].includes(t)
+    },
+    /**
+     * URL de la imagen a mostrar si el tipo es 'image'.
+     */
+    src: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Nombre del icono a mostrar si el tipo es 'icon'.
+     * Por defecto es 'user_default'.
+     */
+    iconName: {
+      type: String,
+      default: "user_default"
+    },
+    /**
+     * Texto de las iniciales a mostrar si el tipo es 'initials'.
+     * Se mostrarán como máximo los dos primeros caracteres en mayúsculas.
+     */
+    initials: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Indica si se debe mostrar un badge de notificación en el avatar.
+     */
+    badge: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Color de fondo del avatar.
+     * Puede ser un valor de color CSS válido (ej: '#333', 'rgb(255,0,0)', 'red') o una variable CSS.
+     * Por defecto es '#DBE6F0'.
+     */
+    backgroundColor: {
+      type: String,
+      default: "#DBE6F0"
+    },
+    /**
+     * Tamaño del avatar.
+     * <br>
+     * `'s'` (24px), `'m'` (32px), `'l'` (40px), `'xl'` (48px)
+     * Por defecto es 'l'.
+     */
+    size: {
+      type: String,
+      default: "l",
+      // Corresponds to '40px'
+      validator: (t) => Object.keys({ s: "24px", m: "32px", l: "40px", xl: "48px" }).includes(t)
+    },
+    /**
+     * Texto alternativo para la imagen del avatar (usado para accesibilidad si el tipo es 'image').
+     */
+    alt: {
+      type: String,
+      default: "Avatar"
+    }
+  },
+  emits: ["click"],
+  setup(t, { emit: d }) {
+    const e = t, p = d, m = {
+      s: "24px",
+      m: "32px",
+      l: "40px",
+      xl: "48px"
+    }, v = a(() => `rds-e-avatar--${e.size}`), n = a(() => !e.initials || typeof e.initials != "string" ? "" : e.initials.trim().substring(0, 2).toUpperCase()), y = a(() => {
+      switch (e.size) {
+        case "s":
+          return "10px";
+        case "m":
+          return "12px";
+        case "l":
+          return "14px";
+        case "xl":
+          return "16px";
+        default:
+          return "14px";
+      }
+    }), f = a(() => {
+      const i = m[e.size];
+      return {
+        width: i,
+        height: i,
+        backgroundColor: e.type === "image" && e.src ? "transparent" : e.backgroundColor,
+        fontSize: y.value,
+        lineHeight: i
+      };
+    }), c = a(() => e.type === "icon" && e.iconName ? e.iconName : "user_default"), x = a(() => {
+      switch (e.size) {
+        case "s":
+          return "12px";
+        case "m":
+          return "16px";
+        case "l":
+          return "20px";
+        case "xl":
+          return "24px";
+        default:
+          return "20px";
+      }
+    }), g = a(() => ({
+      fontSize: x.value,
+      color: "#001E37"
+    })), S = a(() => e.alt && e.type === "image" ? e.alt : e.type === "initials" && n.value ? `Avatar con iniciales ${n.value}` : e.type === "icon" ? `Avatar con icono ${c.value}` : e.badge ? "Avatar de usuario con notificación" : "Avatar de usuario"), l = (i) => {
+      p("click", i);
+    };
+    return (i, I) => (r(), s("div", {
+      class: h(["rds-e-avatar", [v.value]]),
+      style: u(f.value),
+      role: "button",
+      tabindex: "0",
+      "aria-label": S.value,
+      onClick: l,
+      onKeydown: [
+        o(l, ["enter"]),
+        o(l, ["space"])
+      ]
+    }, [
+      t.type === "image" && t.src ? (r(), s("img", {
+        key: 0,
+        src: t.src,
+        alt: t.alt,
+        class: "rds-e-avatar__image"
+      }, null, 8, B)) : t.type === "initials" && n.value ? (r(), s("span", D, z(n.value), 1)) : (r(), k(C, {
+        key: 2,
+        name: c.value,
+        class: "rds-e-avatar__icon",
+        style: u(g.value),
+        "aria-hidden": "true"
+      }, null, 8, ["name", "style"])),
+      t.badge ? (r(), s("span", N)) : b("", !0)
+    ], 46, A));
+  }
+}), R = /* @__PURE__ */ w(E, [["__scopeId", "data-v-194a7f49"]]);
+export {
+  R as default
+};

package/dist/components/checkbox.es.js

@@ -1,7 +1,7 @@
-import { defineComponent as x, ref as d, watch as v, onMounted as y, onBeforeUnmount as w, createElementBlock as g, openBlock as b, normalizeClass as o, createElementVNode as n, renderSlot as S, createTextVNode as B, createBlock as C, createCommentVNode as E, toDisplayString as L } from "vue";
+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-_WCkLP8-.js";
-import { _ } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/checkbox.css';const D = ["id", "checked", "aria-label", "required", "disabled"], N = ["for"], q = /* @__PURE__ */ x({
+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({
   __name: "checkbox",
   props: {
     /**
@@ -59,52 +59,68 @@ import './style/checkbox.css';const D = ["id", "checked", "aria-label", "require
     disabled: {
       type: Boolean,
       default: !1
+    },
+    /**
+     * <span>Estado "indeterminado" visual del checkbox. Solo afecta si está checked.</span>
+     */
+    indeterminate: {
+      type: Boolean,
+      default: !1
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: u }) {
-    const s = e, f = u, t = d(s.isChecked), l = d(!1), c = d(!1);
-    v(() => s.isChecked, (a) => {
+  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));
+      },
+      { immediate: !0 }
+    );
     const h = () => {
-      c.value && (l.value = !0);
-    }, k = () => l.value = !1, m = (a) => {
-      t.value = a.target.checked, f("update:modelValue", a.target.checked);
-    }, r = (a) => {
-      a.key === "Tab" && (c.value = !0);
-    }, i = () => {
-      c.value = !1;
+      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;
     };
-    return y(() => {
-      window.addEventListener("keydown", r), window.addEventListener("mousedown", i);
-    }), w(() => {
-      window.removeEventListener("keydown", r), window.removeEventListener("mousedown", i);
-    }), (a, R) => (b(), g("div", {
-      class: o(["rds-e-checkbox__container", { "rds-e-checkbox__container--focused": l.value }])
+    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 }])
     }, [
-      n("input", {
+      r("input", {
         id: e.id.toString(),
+        ref_key: "inputRef",
+        ref: l,
         checked: e.isChecked,
         "aria-label": e.accessibilityLabel,
         type: "checkbox",
-        class: o(["rds-e-checkbox", { "rds-e-checkbox--error": e.error }]),
+        class: d(["rds-e-checkbox", { "rds-e-checkbox--error": e.error }]),
         required: e.required,
         disabled: e.disabled,
-        onChange: m,
+        onChange: x,
         onFocus: h,
-        onBlur: k
-      }, null, 42, D),
-      n("label", {
+        onBlur: v
+      }, null, 42, N),
+      r("label", {
         for: e.id.toString(),
-        class: o(["rds-e-checkbox__label", {
+        class: d(["rds-e-checkbox__label", {
           "rds-e-checkbox__label--disabled": e.disabled,
-          "rds-e-checkbox__label--checked": t.value
+          "rds-e-checkbox__label--checked": t.value,
+          "rds-e-checkbox__label--indeterminate": e.indeterminate && t.value
         }])
       }, [
-        S(a.$slots, "label-text", {}, () => [
-          n("span", {
-            class: o([
+        B(a.$slots, "label-text", {}, () => [
+          r("span", {
+            class: d([
               "rds-e-checkbox__label-box",
               {
                 "rds-e-checkbox__label-box--disabled": e.disabled,
@@ -112,8 +128,8 @@ import './style/checkbox.css';const D = ["id", "checked", "aria-label", "require
               }
             ])
           }, [
-            B(L(e.label) + " ", 1),
-            e.icon ? (b(), C(V, {
+            C(L(e.label) + " ", 1),
+            e.icon ? (f(), _(V, {
               key: 0,
               class: "rds-e-checkbox__label-box--icon",
               name: e.icon,
@@ -121,10 +137,10 @@ import './style/checkbox.css';const D = ["id", "checked", "aria-label", "require
             }, null, 8, ["name"])) : E("", !0)
           ], 2)
         ], !0)
-      ], 10, N)
+      ], 10, R)
     ], 2));
   }
-}), K = /* @__PURE__ */ _(q, [["__scopeId", "data-v-6beff478"]]);
+}), K = /* @__PURE__ */ D(q, [["__scopeId", "data-v-1f3c3114"]]);
 export {
   K as default
 };

package/dist/components/directAccess.es.js

@@ -0,0 +1,146 @@
+import { defineComponent as j, toRefs as E, computed as o, createBlock as d, openBlock as i, resolveDynamicComponent as I, unref as t, normalizeClass as N, withCtx as O, renderSlot as u, createElementVNode as m, createCommentVNode as w, createElementBlock as T, normalizeStyle as b, toDisplayString as V } from "vue";
+import { R as S } from "./icon-svg-_WCkLP8-.js";
+import { _ as q } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/directAccess.css';const A = { class: "rds-e-direct-access__artwork-container" }, M = ["src", "alt", "aria-hidden"], F = { class: "rds-e-direct-access__text-container" }, G = { class: "rds-e-direct-access__text" }, H = /* @__PURE__ */ j({
+  __name: "direct-access",
+  props: {
+    /**
+     * Texto principal a mostrar en el componente.
+     */
+    text: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Define la disposición de los elementos: 'horizontal' o 'vertical'.
+     * <br>
+     * `['horizontal', 'vertical']`
+     */
+    layout: {
+      type: String,
+      default: "horizontal",
+      validator: (l) => ["horizontal", "vertical"].includes(l)
+    },
+    /**
+     * Objeto para configurar el arte gráfico (icono o microilustración).
+     * <br>
+     * Ejemplo para icono: `{ icon: { name: 'icon-name', size: 24, color: 'blue' } }`
+     * <br>
+     * Ejemplo para microilustración: `{ microillustration: { path: 'path/to/image.svg', alt: 'Descripción', size: 48 } }`
+     */
+    artwork: {
+      type: Object,
+      default: () => ({})
+    },
+    /**
+     * Indica si se debe mostrar una flecha a la derecha (generalmente en layout horizontal).
+     */
+    arrow: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Indica si el componente está deshabilitado.
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Etiqueta ARIA para accesibilidad. Si no se proporciona, se usará el texto del componente.
+     */
+    ariaLabel: {
+      type: String,
+      default: ""
+    },
+    /**
+     * URL de destino si el componente debe funcionar como un enlace.
+     * Si se proporciona, el componente se renderizará como <a> o <router-link>.
+     */
+    linkTo: {
+      type: [String, Object],
+      default: ""
+    },
+    /**
+     * Determina si linkTo debe tratarse como ruta de Vue Router.
+     * Si es true y linkTo está presente, se usará <router-link>.
+     */
+    useRouterLink: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["click"],
+  setup(l, { emit: g }) {
+    const x = l, z = g, { text: _, layout: C, disabled: c, arrow: p, artwork: r, ariaLabel: $, linkTo: a, useRouterLink: B } = E(x), L = o(() => [
+      "rds-e-direct-access",
+      `rds-e-direct-access--${C.value}`,
+      { "rds-e-direct-access--disabled": c.value },
+      { "rds-e-direct-access--with-arrow": p.value }
+    ]), n = o(() => B.value && !!a.value), R = o(() => $.value || _.value), f = o(() => {
+      var e;
+      return (e = r.value) != null && e.microillustration && (r.value.microillustration.path || r.value.microillustration.url) || "";
+    }), v = (e) => {
+      if (!e) return {};
+      const s = {};
+      return e.size && (s.fontSize = `${e.size}px`, s.width = `${e.size}px`, s.height = `${e.size}px`), e.color && "name" in e && (s.color = e.color), s;
+    }, D = (e) => {
+      if (c.value) {
+        e.preventDefault();
+        return;
+      }
+      z("click", e);
+    };
+    return (e, s) => (i(), d(I(t(a) ? n.value ? "router-link" : "a" : "button"), {
+      type: t(a) ? void 0 : "button",
+      href: !n.value && t(a) ? t(a) : void 0,
+      to: n.value && t(a) ? t(a) : void 0,
+      class: N(L.value),
+      disabled: t(c),
+      "aria-label": R.value,
+      onClick: D
+    }, {
+      default: O(() => [
+        u(e.$slots, "default", {}, () => [
+          m("div", A, [
+            u(e.$slots, "artwork", {}, () => {
+              var k, y, h;
+              return [
+                (y = (k = t(r)) == null ? void 0 : k.icon) != null && y.name ? (i(), d(S, {
+                  key: 0,
+                  name: t(r).icon.name,
+                  style: b(v(t(r).icon)),
+                  class: "rds-e-direct-access__artwork-item rds-e-direct-access__artwork-item--icon",
+                  "aria-hidden": "true"
+                }, null, 8, ["name", "style"])) : (h = t(r)) != null && h.microillustration && f.value ? (i(), T("img", {
+                  key: 1,
+                  src: f.value,
+                  alt: t(r).microillustration.alt || "",
+                  style: b(v(t(r).microillustration)),
+                  class: "rds-e-direct-access__artwork-item rds-e-direct-access__artwork-item--microillustration",
+                  "aria-hidden": !t(r).microillustration.alt
+                }, null, 12, M)) : w("", !0)
+              ];
+            }, !0)
+          ]),
+          m("div", F, [
+            u(e.$slots, "text", {}, () => [
+              m("span", G, V(t(_)), 1)
+            ], !0)
+          ]),
+          t(p) ? (i(), d(S, {
+            key: 0,
+            name: "arrow_right",
+            small: "",
+            class: "rds-e-direct-access__arrow",
+            "aria-hidden": "true"
+          })) : w("", !0)
+        ], !0)
+      ]),
+      _: 3
+    }, 8, ["type", "href", "to", "class", "disabled", "aria-label"]));
+  }
+}), Q = /* @__PURE__ */ q(H, [["__scopeId", "data-v-d6ee1420"]]);
+export {
+  Q as default
+};

package/dist/components/dragAndDrop.es.js

@@ -1,11 +1,11 @@
-import { defineComponent as W, ref as _, computed as c, createElementBlock as b, openBlock as x, withModifiers as u, normalizeClass as k, createElementVNode as o, renderSlot as L, createVNode as M, createCommentVNode as R, toDisplayString as D } from "vue";
+import { defineComponent as k, ref as _, computed as c, createElementBlock as b, openBlock as x, withModifiers as f, normalizeClass as q, createElementVNode as u, renderSlot as L, createVNode as M, createCommentVNode as z, toDisplayString as D } from "vue";
 import { g as A } from "./getInstance-GhoEcxLF.js";
-import { R as V } from "./icon-svg-_WCkLP8-.js";
-import { _ as q } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/dragAndDrop.css';const z = ["id", "accept", "multiple", "disabled"], O = ["for"], P = { class: "rds-e-drag-and-drop__icon-wrapper" }, U = { class: "rds-e-drag-and-drop__text-container" }, j = { class: "rds-e-drag-and-drop__text" }, G = {
+import { R as U } from "./icon-svg-_WCkLP8-.js";
+import { _ as V } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/dragAndDrop.css';const O = ["id", "accept", "multiple", "disabled"], P = ["for"], j = { class: "rds-e-drag-and-drop__icon-wrapper" }, G = { class: "rds-e-drag-and-drop__text-container" }, H = { class: "rds-e-drag-and-drop__text" }, J = {
   key: 0,
   class: "rds-e-drag-and-drop__detail"
-}, H = /* @__PURE__ */ W({
+}, K = /* @__PURE__ */ k({
   __name: "drag-and-drop",
   props: {
     /**
@@ -49,7 +49,6 @@ import './style/dragAndDrop.css';const z = ["id", "accept", "multiple", "disable
     icon: {
       type: String,
       default: "add_file"
-      // Default icon from the design
     },
     /**
      * Identificador único para el input de archivo. Si no se proporciona, se genera uno automáticamente.
@@ -95,62 +94,80 @@ import './style/dragAndDrop.css';const z = ["id", "accept", "multiple", "disable
       default: !1
     }
   },
-  emits: ["filesSelected", "error"],
+  emits: ["filesSelected", "validationError", "fileReady"],
   setup(r, { emit: y }) {
-    const e = r, f = y, s = _(null), n = _(!1), S = A(), g = c(() => e.id || `rds-drag-drop-${S}`), w = c(() => [
+    const t = r, p = y;
+    let S = 0;
+    const C = () => `rds-dd-file-${S++}`, s = _(null), i = _(!1), w = A(), g = c(() => t.id || `rds-drag-drop-${w}`), F = c(() => [
       "rds-e-drag-and-drop",
       {
-        "rds-e-drag-and-drop--dragging": n.value && !e.disabled,
-        "rds-e-drag-and-drop--disabled": e.disabled,
-        "rds-e-drag-and-drop--full-width": e.fullWidth,
-        "rds-e-drag-and-drop--error": e.error && !e.disabled
+        "rds-e-drag-and-drop--dragging": i.value && !t.disabled,
+        "rds-e-drag-and-drop--disabled": t.disabled,
+        "rds-e-drag-and-drop--full-width": t.fullWidth,
+        "rds-e-drag-and-drop--error": t.error && !t.disabled
       }
-    ]), m = c(() => e.error && e.errorMessage ? e.errorMessage : e.detailText), C = c(() => e.showDetailText && (m.value || !e.error)), F = (t) => {
+    ]), m = c(() => t.error && t.errorMessage ? t.errorMessage : t.detailText), I = c(() => t.showDetailText && (m.value || !t.error)), T = (e) => {
       var a;
-      if (!t || t.length === 0)
+      if (!e || e.length === 0)
         return { valid: !1, message: "No se seleccionaron archivos." };
-      if (!e.multiple && t.length > 1)
+      if (!t.multiple && e.length > 1)
         return { valid: !1, message: "Solo se permite seleccionar un archivo." };
-      if (e.maxFiles !== null && e.maxFiles > 0 && t.length > e.maxFiles)
-        return { valid: !1, message: `Se permite un máximo de ${e.maxFiles} archivos.` };
-      if (e.accept) {
-        const i = e.accept.split(",").map((d) => d.trim().toLowerCase());
-        for (let d = 0; d < t.length; d++) {
-          const p = t[d], N = `.${(a = p.name.split(".").pop()) == null ? void 0 : a.toLowerCase()}`, h = p.type.toLowerCase();
-          if (!i.some((l) => l.startsWith(".") ? N === l : l.includes("/") ? l.endsWith("/*") ? h.startsWith(l.replace("/*", "")) : h === l : !1))
-            return { valid: !1, message: `El tipo de archivo '${p.name}' no es válido. Permitidos: ${e.accept}` };
+      if (t.maxFiles !== null && t.maxFiles > 0 && e.length > t.maxFiles)
+        return { valid: !1, message: `Se permite un máximo de ${t.maxFiles} archivos por selección.` };
+      if (t.accept) {
+        const n = t.accept.split(",").map((l) => l.trim().toLowerCase());
+        for (let l = 0; l < e.length; l++) {
+          const o = e[l], W = `.${(a = o.name.split(".").pop()) == null ? void 0 : a.toLowerCase()}`, h = o.type.toLowerCase();
+          if (!n.some((d) => d.startsWith(".") ? W === d : d.includes("/") ? d.endsWith("/*") ? h.startsWith(d.replace("/*", "")) : h === d : !1))
+            return { valid: !1, message: `El tipo de archivo '${o.name}' no es válido. Permitidos: ${t.accept}` };
         }
       }
       return { valid: !0 };
-    }, v = (t) => {
-      if (e.disabled) return;
-      const a = F(t);
-      a.valid && t ? (f("filesSelected", t), s.value && (s.value.value = "")) : a.message && (f("error", a.message), s.value && (s.value.value = ""));
-    }, T = (t) => {
-      const a = t.target;
+    }, v = (e) => {
+      if (t.disabled) return;
+      if (!e || e.length === 0) {
+        s.value && (s.value.value = "");
+        return;
+      }
+      p("filesSelected", e);
+      const a = T(e);
+      if (a.valid) {
+        for (let n = 0; n < e.length; n++) {
+          const l = e[n], o = C();
+          p("fileReady", {
+            id: o,
+            file: l,
+            name: l.name,
+            size: l.size
+          });
+        }
+        s.value && (s.value.value = "");
+      } else a.message && (p("validationError", a.message), s.value && (s.value.value = ""));
+    }, B = (e) => {
+      const a = e.target;
       v(a.files);
-    }, B = () => {
-      e.disabled || (n.value = !0);
-    }, $ = (t) => {
-      e.disabled || (t.preventDefault(), n.value = !0);
-    }, E = (t) => {
-      const a = t.relatedTarget;
-      (!t.currentTarget || !t.currentTarget.contains(a)) && (n.value = !1);
-    }, I = (t) => {
-      var i;
-      if (e.disabled) return;
-      n.value = !1;
-      const a = (i = t.dataTransfer) == null ? void 0 : i.files;
+    }, E = () => {
+      t.disabled || (i.value = !0);
+    }, $ = (e) => {
+      t.disabled || (e.preventDefault(), i.value = !0);
+    }, R = (e) => {
+      const a = e.relatedTarget;
+      (!e.currentTarget || !e.currentTarget.contains(a)) && (i.value = !1);
+    }, N = (e) => {
+      var n;
+      if (t.disabled) return;
+      i.value = !1;
+      const a = (n = e.dataTransfer) == null ? void 0 : n.files;
       v(a || null);
     };
-    return (t, a) => (x(), b("div", {
-      class: k(w.value),
-      onDragenter: u(B, ["prevent"]),
-      onDragover: u($, ["prevent"]),
-      onDragleave: u(E, ["prevent"]),
-      onDrop: u(I, ["prevent"])
+    return (e, a) => (x(), b("div", {
+      class: q(F.value),
+      onDragenter: f(E, ["prevent"]),
+      onDragover: f($, ["prevent"]),
+      onDragleave: f(R, ["prevent"]),
+      onDrop: f(N, ["prevent"])
     }, [
-      o("input", {
+      u("input", {
         id: g.value,
         ref_key: "fileInputRef",
         ref: s,
@@ -159,29 +176,29 @@ import './style/dragAndDrop.css';const z = ["id", "accept", "multiple", "disable
         accept: r.accept,
         multiple: r.multiple,
         disabled: r.disabled,
-        onChange: T
-      }, null, 40, z),
-      o("label", {
+        onChange: B
+      }, null, 40, O),
+      u("label", {
         for: g.value,
         class: "rds-e-drag-and-drop__label"
       }, [
-        L(t.$slots, "content", {}, () => [
-          o("span", P, [
-            M(V, {
+        L(e.$slots, "content", {}, () => [
+          u("span", j, [
+            M(U, {
               name: r.icon,
               class: "rds-e-drag-and-drop__icon",
               "aria-hidden": "true"
             }, null, 8, ["name"])
           ]),
-          o("div", U, [
-            o("span", j, D(r.label), 1),
-            C.value ? (x(), b("span", G, D(m.value), 1)) : R("", !0)
+          u("div", G, [
+            u("span", H, D(r.label), 1),
+            I.value ? (x(), b("span", J, D(m.value), 1)) : z("", !0)
           ])
         ], !0)
-      ], 8, O)
+      ], 8, P)
     ], 34));
   }
-}), Z = /* @__PURE__ */ q(H, [["__scopeId", "data-v-a915c196"]]);
+}), te = /* @__PURE__ */ V(K, [["__scopeId", "data-v-3928ef06"]]);
 export {
-  Z as default
+  te as default
 };