@agrotools1/at-components 0.6.3 → 0.6.4

package/dist/Input/Input.core.vue.js

@@ -1,8 +1,8 @@
 import m from "./Input.core.vue2.js";
-import { resolveComponent as I, openBlock as n, createElementBlock as l, createElementVNode as r, createTextVNode as a, toDisplayString as i, createCommentVNode as d, Fragment as v, renderList as k, mergeProps as C, normalizeClass as T, createBlock as u, resolveDynamicComponent as y } from "vue";
+import { resolveComponent as I, openBlock as n, createElementBlock as l, createElementVNode as r, createTextVNode as u, toDisplayString as i, createCommentVNode as d, Fragment as v, renderList as k, mergeProps as C, normalizeClass as T, createBlock as p, resolveDynamicComponent as y } from "vue";
 import "./Input.core.vue3.js";
 import f from "../_virtual/_plugin-vue_export-helper.js";
-const h = ["data-mode", "disabled"], $ = ["for"], A = {
+const $ = ["data-mode", "disabled"], h = ["for"], A = {
   key: 0,
   class: "AT-INPUT_required"
 }, F = ["title"], N = { class: "AT-INPUT_item_slot" }, O = ["onClick"], b = {
@@ -12,24 +12,24 @@ const h = ["data-mode", "disabled"], $ = ["for"], A = {
   key: 0,
   class: "AT-INPUT_error-message"
 }, M = ["src"];
-function U(e, s, B, E, c, z) {
-  const p = I("AtCircleXMarkSolidIcon");
+function U(e, s, B, E, z, S) {
+  const a = I("AtCircleXMarkSolidIcon");
   return n(), l("div", null, [
     r("div", {
       ref: "wrapperEl",
       "data-mode": e.currentMode,
       disabled: e.$props.disabled || void 0,
       class: "AT-INPUT_core",
-      onMouseover: s[6] || (s[6] = (...o) => e.handleMouseOver && e.handleMouseOver(...o)),
-      onMouseleave: s[7] || (s[7] = (...o) => e.handleMouseLeave && e.handleMouseLeave(...o))
+      onMouseover: s[7] || (s[7] = (...o) => e.handleMouseOver && e.handleMouseOver(...o)),
+      onMouseleave: s[8] || (s[8] = (...o) => e.handleMouseLeave && e.handleMouseLeave(...o))
     }, [
       r("label", {
         for: e.id,
         onClick: s[0] || (s[0] = (...o) => e.handleOnFocus && e.handleOnFocus(...o))
       }, [
-        a(i(e.label) + " ", 1),
+        u(i(e.label) + " ", 1),
         e.$props.required ? (n(), l("span", A, "*")) : d("", !0)
-      ], 8, $),
+      ], 8, h),
       e.separator ? (n(), l("div", {
         key: 0,
         ref: "containerItemsEl",
@@ -71,28 +71,29 @@ function U(e, s, B, E, c, z) {
       e.$props.icon ? (n(), l("div", {
         key: 2,
         class: T(["AT_INPUT_icon_slot", { clickable: e.useClearButton && e.isFocused }]),
-        onClick: s[5] || (s[5] = (o) => e.showClearButton ? e.clearInput() : null)
+        onClick: s[6] || (s[6] = (o) => e.showClearButton ? e.clearInput() : null)
       }, [
-        e.showClearButton ? (n(), u(p, {
+        e.showClearButton ? (n(), p(a, {
           key: 0,
-          size: "20"
-        })) : (n(), u(y(e.icons[e.$props.icon.name]), {
+          size: "20",
+          onClick: s[5] || (s[5] = (o) => e.clearInput())
+        })) : (n(), p(y(e.icons[e.$props.icon.name]), {
           key: 1,
           size: e.$props.icon.size || "20",
           color: e.iconColor
         }, null, 8, ["size", "color"]))
       ], 2)) : d("", !0)
-    ], 40, h),
+    ], 40, $),
     e.error.value ? (n(), l("span", P, [
       r("img", {
         src: e.icons.error,
         alt: "error icon"
       }, null, 8, M),
-      a(" " + i(e.error.message), 1)
+      u(" " + i(e.error.message), 1)
     ])) : d("", !0)
   ]);
 }
-const D = /* @__PURE__ */ f(m, [["render", U], ["__scopeId", "data-v-a2a6a7e2"]]);
+const D = /* @__PURE__ */ f(m, [["render", U], ["__scopeId", "data-v-65f8dafb"]]);
 export {
   D as default
 };

package/dist/Input/Input.core.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as j, ref as a, computed as s, onMounted as z, onBeforeUnmount as N, watchEffect as U, watch as S, nextTick as D } from "vue";
+import { defineComponent as j, ref as u, computed as c, onMounted as z, onBeforeUnmount as N, watchEffect as U, watch as T, nextTick as D } from "vue";
 import { AtCircleXMarkSolidIcon as P } from "../node_modules/.pnpm/agrotools-icons@0.2.6/node_modules/agrotools-icons/dist/AtCircleXMarkSolidIcon/index.js";
 import X from "../Icons/icons.js";
 import H from "./imgs/error.svg.js";
@@ -98,33 +98,33 @@ const Y = j({
     "mouseover"
   ],
   setup(e, { emit: d }) {
-    const T = { ...X }, b = a(null), V = a(null), c = a(null), E = a(null), A = s(() => e.error), u = a(!1), i = a(""), f = a(!1), O = s(
-      () => e.useClearButton && u.value && e.modelValue && !f.value
-    ), y = a({
+    const A = { ...X }, b = u(null), V = u(null), f = u(null), E = u(null), O = c(() => e.error), a = u(!1), i = u(""), s = u(!1), k = c(
+      () => e.useClearButton && a.value && e.modelValue && !s.value
+    ), y = u({
       supportedItems: e.selectedItems.length,
       isCounterActive: !1,
       itemsToRender: e.selectedItems
-    }), q = Math.random().toString(36).substring(2), o = a(!1), F = () => {
-      o.value = !0;
+    }), q = Math.random().toString(36).substring(2), r = u(!1), F = () => {
+      r.value = !0;
     }, M = () => {
-      o.value = !1;
+      r.value = !1;
     }, g = () => {
-      u.value = !0;
-    }, m = () => {
-      e.forceFocus || (e.forceEventClearButton ? u.value = !1 : B(() => {
-        u.value = !1;
+      a.value = !0;
+    }, v = () => {
+      e.forceFocus || (e.forceEventClearButton ? a.value = !0 : w(() => {
+        a.value = !1;
       }, 100)());
-    }, v = async () => {
-      var w;
+    }, m = async () => {
+      var S;
       y.value.itemsToRender = e.selectedItems, await D();
-      const t = (w = c.value) == null ? void 0 : w.clientWidth;
+      const t = (S = f.value) == null ? void 0 : S.clientWidth;
       if (t === void 0)
         return;
       let l = 50, n = 0;
-      const r = E.value;
-      if (r)
-        for (let I = 0; I < r.length; I++)
-          l += r[I].clientWidth + 10, l <= t && (n = I + 1);
+      const o = E.value;
+      if (o)
+        for (let I = 0; I < o.length; I++)
+          l += o[I].clientWidth + 10, l <= t && (n = I + 1);
       let C;
       l >= t ? C = {
         isCounterActive: l > (t || 0),
@@ -135,79 +135,79 @@ const Y = j({
         supportedItems: e.selectedItems.length,
         itemsToRender: e.selectedItems
       }, y.value = C;
-    }, k = (t) => {
+    }, B = (t) => {
       var l, n;
-      !((l = b.value) != null && l.contains(t.target)) && !((n = V.value) != null && n.contains(t.target)) && (m(), d("clickOutside"));
+      !((l = b.value) != null && l.contains(t.target)) && !((n = V.value) != null && n.contains(t.target)) && !k.value && !s.value && (v(), a.value = !1, d("clickOutside"));
     };
     z(() => {
       var t;
-      (e.modelValue !== void 0 && ((t = e.modelValue) != null && t.length) || e.forceFocus) && g(), document.addEventListener("click", k), window.addEventListener("resize", v);
+      (e.modelValue !== void 0 && ((t = e.modelValue) != null && t.length) || e.forceFocus) && g(), document.addEventListener("click", B), window.addEventListener("resize", m);
     }), N(() => {
-      document.removeEventListener("click", k), window.removeEventListener("resize", v);
+      document.removeEventListener("click", B), window.removeEventListener("resize", m);
     });
     const L = (t) => {
       e.preventInputEvent && t.preventDefault();
       const l = t.target.value;
-      d("input", t), e.debounce > 0 ? B(() => h(l), e.debounce)() : h(l);
+      d("input", t), e.debounce > 0 ? w(() => h(l), e.debounce)() : h(l);
     }, h = (t) => {
       d("update:modelValue", t), e.modelValue === void 0 && (i.value = t);
     };
-    function B(t, l) {
+    function w(t, l) {
       let n;
       return function() {
         clearTimeout(n), n = setTimeout(t, l);
       };
     }
     const _ = () => {
-      f.value = !0, u.value = !1, d("clearInput"), setTimeout(() => {
-        e.forceEventClearButton || h(""), f.value = !1;
+      s.value = !0, a.value = !1, d("clearInput"), setTimeout(() => {
+        e.forceEventClearButton || h(""), s.value = !1;
       }, 100);
     };
     U(() => {
       var t, l;
-      e.separator && ((e.modelValue !== void 0 ? e.modelValue.split(e.separator).filter((r) => r.length > 1) : i.value.split(e.separator).filter((r) => r.length > 1)).length ? (t = c.value) == null || t.classList.remove("AT-INPUT_items_empty") : ((l = c.value) == null || l.classList.add("AT-INPUT_items_empty"), m())), e.forceFocus ? g() : m();
-    }), S(
+      e.separator && ((e.modelValue !== void 0 ? e.modelValue.split(e.separator).filter((o) => o.length > 1) : i.value.split(e.separator).filter((o) => o.length > 1)).length ? (t = f.value) == null || t.classList.remove("AT-INPUT_items_empty") : ((l = f.value) == null || l.classList.add("AT-INPUT_items_empty"), v(), a.value = !1)), e.forceFocus ? g() : (v(), a.value = !1);
+    }), T(
       () => e.selectedItems,
       async () => {
-        await v();
+        await m();
       },
       { deep: !0 }
-    ), S(
-      () => o.value,
+    ), T(
+      () => r.value,
       () => {
-        d("mouseover", o.value);
+        d("mouseover", r.value);
       }
     );
-    const x = s(() => {
+    const x = c(() => {
       var t;
-      return e.disabled ? "var(--at-medium-grey)" : e.selectedItems.length > 0 ? "var(--at-black)" : u.value ? "var(--at-primary-color-2)" : e.error.value ? "var(--at-error)" : o.value || (t = e.icon) != null && t.color || e.modelValue !== void 0 && e.modelValue.length > 0 || i.value.length > 0 ? "var(--at-black)" : "var(--at-dark-grey)";
-    }), R = s(() => e.disabled ? "disabled" : e.selectedItems.length > 0 ? "filled" : u.value ? "focused" : e.error.value ? "error" : o.value ? "hover" : e.modelValue !== void 0 && e.modelValue.length > 0 || i.value.length > 0 ? "filled" : "default"), W = s(() => e.modelValue !== void 0 ? e.modelValue : i.value ? i.value : null);
+      return e.disabled ? "var(--at-medium-grey)" : e.selectedItems.length > 0 ? "var(--at-black)" : a.value ? "var(--at-primary-color-2)" : e.error.value ? "var(--at-error)" : r.value || (t = e.icon) != null && t.color || e.modelValue !== void 0 && e.modelValue.length > 0 || i.value.length > 0 ? "var(--at-black)" : "var(--at-dark-grey)";
+    }), R = c(() => e.disabled ? "disabled" : e.selectedItems.length > 0 ? "filled" : a.value ? "focused" : e.error.value ? "error" : r.value ? "hover" : e.modelValue !== void 0 && e.modelValue.length > 0 || i.value.length > 0 ? "filled" : "default"), W = c(() => e.modelValue !== void 0 ? e.modelValue : i.value ? i.value : null);
     return {
       wrapperEl: b,
       inputEl: V,
-      inputError: A,
+      inputError: O,
       inputId: e.id ?? q,
       handleOnFocus: g,
-      handleOnFocusOut: m,
+      handleOnFocusOut: v,
       icons: {
         error: H,
-        ...T
+        ...A
       },
-      clickedClear: f,
-      showClearButton: O,
+      clickedClear: s,
+      showClearButton: k,
       clearInput: _,
-      containerItemsEl: c,
+      containerItemsEl: f,
       onInput: L,
       iconColor: x,
-      isFocused: u,
+      isFocused: a,
       handleMouseOver: F,
       handleMouseLeave: M,
-      isHovered: o,
+      isHovered: r,
       inputComputedValue: W,
       currentMode: R,
       selectedItemsEl: E,
       selectedItemsController: y,
-      resizeSelectedItems: v
+      resizeSelectedItems: m
     };
   }
 });

package/dist/Input/Input.core.vue3.js

@@ -1,4 +1,4 @@
-const e = "";
+const _ = "";
 export {
-  e as default
+  _ as default
 };