adverich-kun-ui 0.1.460 → 0.1.462

package/dist/components/KunAutocomplete/src/components/KunAutocomplete.vue.js

@@ -1,170 +1,175 @@
-import { mergeModels as $, useModel as z, onMounted as ae, ref as A, watch as ie, createElementBlock as g, openBlock as u, createVNode as a, unref as t, withKeys as se, withModifiers as _, isRef as R, createSlots as ue, withCtx as n, createCommentVNode as k, normalizeClass as de, createTextVNode as y, toDisplayString as V, createBlock as f, Fragment as ce, renderList as me, createElementVNode as fe } from "vue";
-import { icons as p } from "../../../../icons/index.js";
-import { isNotEmpty as x, isArray as E } from "../../../../utils/utils.js";
-import pe from "../../../KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js";
-import ve from "../../../KunList/src/components/KunList.vue.js";
+import { mergeModels as $, useModel as z, onMounted as ie, ref as A, watch as se, createElementBlock as y, openBlock as u, createVNode as a, unref as t, withKeys as ue, withModifiers as E, isRef as _, createSlots as de, withCtx as n, createCommentVNode as g, normalizeClass as ce, createTextVNode as b, toDisplayString as V, createBlock as p, Fragment as me, renderList as fe, createElementVNode as pe } from "vue";
+import { icons as v } from "../../../../icons/index.js";
+import { isNotEmpty as x, isArray as R } from "../../../../utils/utils.js";
+import ve from "../../../KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js";
+import ke from "../../../KunList/src/components/KunList.vue.js";
 import O from "../../../KunListItem/src/components/KunListItem.vue.js";
 import B from "../../../KunListItemTitle/src/components/KunListItemTitle.vue.js";
 import he from "../../../KunListItemSubtitle/src/components/KunListItemSubtitle.vue.js";
-import ge from "../../../KunMenu/src/components/KunMenu.vue.js";
-import { useAutocomplete as ke } from "../composables/useAutocomplete.js";
-import { KunAutocompleteProps as ye } from "../composables/KunAutocompleteProps.js";
-import be from "../../../KunTextField/src/components/KunTextField.vue.js";
-import Ce from "../../../KunBtn/src/components/KunBtn.vue.js";
-import we from "../../../KunChip/src/components/KunChip.vue.js";
-import b from "../../../KunIcon/src/components/KunIcon.vue.js";
-const Se = {
+import ye from "../../../KunMenu/src/components/KunMenu.vue.js";
+import { useAutocomplete as ge } from "../composables/useAutocomplete.js";
+import { KunAutocompleteProps as be } from "../composables/KunAutocompleteProps.js";
+import Ce from "../../../KunTextField/src/components/KunTextField.vue.js";
+import we from "../../../KunBtn/src/components/KunBtn.vue.js";
+import Se from "../../../KunChip/src/components/KunChip.vue.js";
+import C from "../../../KunIcon/src/components/KunIcon.vue.js";
+const Ve = {
   key: 0,
   class: "flex flex-nowrap items-center space-x-1 min-w-3xs max-w-full overflow-x-auto overflow-y-hidden"
-}, Ve = { class: "flex items-center" }, Ie = {
+}, De = { class: "flex items-center" }, Ie = {
   key: 0,
   class: "sticky top-0 z-10 p-2 border-b bg-select-background"
-}, Te = {
+}, Ue = {
   __name: "KunAutocomplete",
-  props: /* @__PURE__ */ $(ye, {
+  props: /* @__PURE__ */ $(be, {
     modelValue: { default: null },
     modelModifiers: {},
     items: { default: [], type: Array, required: !0 },
     itemsModifiers: {}
   }),
-  emits: /* @__PURE__ */ $(["update:modelValue", "selectedItem", "createItem", "validation", "search"], ["update:modelValue", "update:items"]),
-  setup(C, { emit: F }) {
-    const i = z(C, "modelValue"), m = z(C, "items"), s = C, v = F, {
-      textFieldRef: w,
-      listRef: I,
+  emits: /* @__PURE__ */ $(["update:modelValue", "selectedItem", "createItem", "validation", "search", "keyDown", "keyDownEnter"], ["update:modelValue", "update:items"]),
+  setup(w, { expose: F, emit: N }) {
+    const i = z(w, "modelValue"), f = z(w, "items"), s = w, c = N, {
+      textFieldRef: k,
+      listRef: D,
       menuModel: d,
       search: r,
-      removeItem: N,
-      clearSelection: T,
-      lightReset: U,
+      removeItem: T,
+      clearSelection: U,
+      lightReset: j,
       openMenu: S,
-      closeMenu: j,
-      toggleMenu: H,
-      onMenuKeydown: q,
-      getSelectedItem: K,
-      textArr: P,
-      getArrayText: W,
-      isAlphanumeric: G,
-      createItem: J,
-      checkDisabled: Q,
-      itemToString: L,
-      placeholder: X
-    } = ke(s, v, i, m);
-    ae(() => {
-      s.focusOnRender && w.value.focus();
+      closeMenu: H,
+      toggleMenu: q,
+      onMenuKeydown: P,
+      getSelectedItem: I,
+      textArr: W,
+      getArrayText: G,
+      isAlphanumeric: J,
+      createItem: Q,
+      checkDisabled: X,
+      itemToString: K,
+      placeholder: Y
+    } = ge(s, c, i, f);
+    ie(() => {
+      s.focusOnRender && k.value.focus();
     });
-    const D = A(null), h = A(""), M = (e) => {
+    const L = A(null), h = A(""), M = (e) => {
       for (const o of s.rules) {
         const l = o(e);
         if (l !== !0)
-          return h.value = l, v("validation", !1), !1;
+          return h.value = l, c("validation", !1), !1;
       }
-      return h.value = "", v("validation", !0), !0;
+      return h.value = "", c("validation", !0), !0;
     };
-    ie(() => i.value, (e, o) => {
+    se(() => i.value, (e, o) => {
       x(s.rules) && M(e);
     });
-    function Y() {
+    function Z() {
       var e;
-      d.value = !1, (e = w.value.inputField) == null || e.focus();
+      d.value = !1, (e = k.value.inputField) == null || e.focus();
     }
-    function Z(e) {
-      var l, c;
+    function ee(e) {
+      var l, m;
       const o = e.key;
-      if (console.log(o), o === "Tab" || o === "Shift" || o === "Escape") {
-        j();
+      if (o === "Tab" || o === "Shift" || o === "Escape") {
+        H(), c("keyDown", o);
         return;
       }
-      (G(o) || o === "Backspace") && S(), ["ArrowUp", "ArrowDown"].includes(o) && (e.preventDefault(), d.value || S(), (c = (l = I.value) == null ? void 0 : l.focusWithKey) == null || c.call(l, o));
+      (J(o) || o === "Backspace") && S(), ["ArrowUp", "ArrowDown"].includes(o) && (e.preventDefault(), d.value || S(), (m = (l = D.value) == null ? void 0 : l.focusWithKey) == null || m.call(l, o));
     }
-    function ee(e) {
-      v("search", r);
+    function le(e) {
+      c("search", r);
     }
-    function le() {
+    function te() {
       M(i);
     }
-    function te(e) {
-      q(e);
-    }
-    function oe() {
+    function oe(e) {
+      P(e);
     }
     function ne() {
+    }
+    function re() {
       if (!r.value) return;
       let e = null;
-      s.returnObject ? e = m.value.find(
+      s.returnObject ? e = f.value.find(
         (o) => Object.values(o).some(
           (l) => String(l).toLowerCase() === String(r.value).toLowerCase()
         )
-      ) : s.itemValue ? e = m.value.find(
+      ) : s.itemValue ? e = f.value.find(
         (o) => String(o[s.itemValue]).toLowerCase() === String(r.value).toLowerCase()
-      ) : e = m.value.find(
+      ) : e = f.value.find(
         (o) => typeof o == "object" ? Object.values(o).some((l) => String(l).toLowerCase() === String(r.value).toLowerCase()) : String(o).toLowerCase() === String(r.value).toLowerCase()
-      ), e && K(e);
+      ), e && I(e), c("keyDownEnter");
     }
-    return (e, o) => (u(), g("div", {
+    return F({
+      focus: () => {
+        var e;
+        (e = k.value) == null || e.focus();
+      }
+    }), (e, o) => (u(), y("div", {
       class: "w-full h-fit",
       ref_key: "parentRef",
-      ref: D
+      ref: L
     }, [
-      a(be, {
+      a(Ce, {
         modelValue: t(r),
         "onUpdate:modelValue": [
-          o[1] || (o[1] = (l) => R(r) ? r.value = l : null),
-          ee
+          o[1] || (o[1] = (l) => _(r) ? r.value = l : null),
+          le
         ],
         label: e.label,
         dirty: "",
         "hide-details": e.hideDetails,
         density: e.density,
         ref_key: "textFieldRef",
-        ref: w,
+        ref: k,
         autocomplete: "off",
-        onFocusInput: le,
-        onHandleClick: t(H),
+        onFocusInput: te,
+        onHandleClick: t(q),
         rounded: t(d) ? "rounded-t" : "rounded",
-        onBlur: oe,
+        onBlur: ne,
         onKeyDown: [
-          Z,
-          se(_(ne, ["prevent"]), ["enter"])
+          ee,
+          ue(E(re, ["prevent"]), ["enter"])
         ],
-        placeholder: s.multiple && t(E)(i.value) && i.value.length ? "" : t(X),
+        placeholder: s.multiple && t(R)(i.value) && i.value.length ? "" : t(Y),
         error: !!h.value,
         "error-messages": h.value
-      }, ue({
+      }, de({
         "prepend-input-content": n(() => [
-          t(E)(i.value) && t(x)(i.value) ? (u(), g("div", Se, [
-            (u(!0), g(ce, null, me(i.value, (l) => (u(), f(we, {
+          t(R)(i.value) && t(x)(i.value) ? (u(), y("div", Ve, [
+            (u(!0), y(me, null, fe(i.value, (l) => (u(), p(Se, {
               key: l.id ?? l.name,
               size: "small",
               variant: "pill"
             }, {
               default: n(() => [
-                fe("div", Ve, [
-                  y(V(t(W)(l)) + " ", 1),
-                  a(b, {
+                pe("div", De, [
+                  b(V(t(G)(l)) + " ", 1),
+                  a(C, {
                     color: "error",
-                    icon: t(p).close,
+                    icon: t(v).close,
                     size: "small",
                     class: "ml-1",
-                    onClick: (c) => t(N)(l)
+                    onClick: (m) => t(T)(l)
                   }, null, 8, ["icon", "onClick"])
                 ])
               ]),
               _: 2
             }, 1024))), 128))
-          ])) : k("", !0)
+          ])) : g("", !0)
         ]),
         default: n(() => [
-          a(ge, {
+          a(ye, {
             transition: "fade",
-            "onClick:outside": t(U),
+            "onClick:outside": t(j),
             modelValue: t(d),
-            "onUpdate:modelValue": o[0] || (o[0] = (l) => R(d) ? d.value = l : null),
+            "onUpdate:modelValue": o[0] || (o[0] = (l) => _(d) ? d.value = l : null),
             activator: "parent",
             "z-index": e.zIndex,
-            "parent-ref": D.value,
+            "parent-ref": L.value,
             origin: e.menuOrigin,
-            onHandleEscape: Y,
+            onHandleEscape: Z,
             bgColor: e.bgMenuColor,
             "close-on-content-click": e.closeOnSelect,
             width: "w-full",
@@ -172,28 +177,28 @@ const Se = {
             "hide-details": e.hideDetails
           }, {
             default: n(() => [
-              e.hasCreateItem ? (u(), g("div", Ie, [
-                a(Ce, {
-                  onClick: t(J),
+              e.hasCreateItem ? (u(), y("div", Ie, [
+                a(we, {
+                  onClick: t(Q),
                   bgColor: e.btnCreateBg,
-                  class: de(e.btnCreateClass)
+                  class: ce(e.btnCreateClass)
                 }, {
                   default: n(() => [
-                    y(V(e.btnCreateText), 1)
+                    b(V(e.btnCreateText), 1)
                   ]),
                   _: 1
                 }, 8, ["onClick", "bgColor", "class"])
-              ])) : k("", !0),
-              a(ve, {
-                "onClick:select": t(K),
+              ])) : g("", !0),
+              a(ke, {
+                "onClick:select": t(I),
                 ref_key: "listRef",
-                ref: I,
-                onKeyDown: te,
+                ref: D,
+                onKeyDown: oe,
                 selectable: !0
               }, {
                 default: n(() => [
-                  a(pe, {
-                    items: m.value,
+                  a(ve, {
+                    items: f.value,
                     search: t(r),
                     "searchable-keys": s.searchableKeys,
                     virtual: !1,
@@ -201,12 +206,12 @@ const Se = {
                     enabled: t(d),
                     "item-height": 48
                   }, {
-                    default: n(({ item: l, index: c, empty: re }) => [
-                      !re && l != null ? (u(), f(O, {
+                    default: n(({ item: l, index: m, empty: ae }) => [
+                      !ae && l != null ? (u(), p(O, {
                         value: l,
-                        key: `kun-list-${c + 1}`,
-                        id: `kun-item-${c + 1}`,
-                        disabled: t(Q)(l),
+                        key: `kun-list-${m + 1}`,
+                        id: `kun-item-${m + 1}`,
+                        disabled: t(X)(l),
                         "bg-items": e.bgItemListColor,
                         "hover-bg": e.hoverItemListColor,
                         activeClass: e.selectedItemListColor,
@@ -216,23 +221,23 @@ const Se = {
                         default: n(() => [
                           a(B, { class: "text-wrap" }, {
                             default: n(() => [
-                              y(V(t(L)(l, e.itemTitle ?? t(P), "hasDefault")), 1)
+                              b(V(t(K)(l, e.itemTitle ?? t(W), "hasDefault")), 1)
                             ]),
                             _: 2
                           }, 1024),
                           a(he, {
-                            text: e.itemSubtitle ? t(L)(l, e.itemSubtitle) : ""
+                            text: e.itemSubtitle ? t(K)(l, e.itemSubtitle) : ""
                           }, null, 8, ["text"])
                         ]),
                         _: 2
-                      }, 1032, ["value", "id", "disabled", "bg-items", "hover-bg", "activeClass", "density"])) : (u(), f(O, {
+                      }, 1032, ["value", "id", "disabled", "bg-items", "hover-bg", "activeClass", "density"])) : (u(), p(O, {
                         key: 1,
                         disabled: ""
                       }, {
                         default: n(() => [
                           a(B, { class: "text-center w-full text-gray-500" }, {
                             default: n(() => o[2] || (o[2] = [
-                              y(" No hay elementos disponibles ")
+                              b(" No hay elementos disponibles ")
                             ])),
                             _: 1,
                             __: [2]
@@ -255,28 +260,28 @@ const Se = {
         e.hasIcons ? {
           name: "append-inner",
           fn: n(() => [
-            e.clearable && i.value ? (u(), f(b, {
+            e.clearable && i.value ? (u(), p(C, {
               key: 0,
-              onClick: t(T),
+              onClick: t(U),
               size: "small",
               color: "error",
-              icon: t(p).close,
+              icon: t(v).close,
               class: "mr-1 mt-1"
-            }, null, 8, ["onClick", "icon"])) : k("", !0),
-            a(b, {
+            }, null, 8, ["onClick", "icon"])) : g("", !0),
+            a(C, {
               color: "teal-darken-1",
               size: "large",
               class: "cursor-pointer",
-              icon: t(d) ? t(p).menuUpOutline : t(p).menuDownOutline,
-              onClick: _(t(S), ["stop"])
+              icon: t(d) ? t(v).menuUpOutline : t(v).menuDownOutline,
+              onClick: E(t(S), ["stop"])
             }, null, 8, ["icon", "onClick"]),
-            e.required ? (u(), f(b, {
+            e.required ? (u(), p(C, {
               key: 1,
               color: "teal-darken-1",
               size: "x-small",
               class: "mb-4",
-              icon: t(p).asterisk
-            }, null, 8, ["icon"])) : k("", !0)
+              icon: t(v).asterisk
+            }, null, 8, ["icon"])) : g("", !0)
           ]),
           key: "0"
         } : void 0
@@ -285,5 +290,5 @@ const Se = {
   }
 };
 export {
-  Te as default
+  Ue as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adverich-kun-ui",
-  "version": "0.1.460",
+  "version": "0.1.462",
   "type": "module",
   "description": "Una librería de componentes Vue.js con Tailwind CSS",
   "main": "dist/index.js",