adverich-kun-ui 0.1.359 → 0.1.361

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

@@ -1,214 +1,211 @@
-import { mergeModels as _, useModel as x, onMounted as ne, ref as A, watch as ie, createElementBlock as C, openBlock as s, createVNode as i, unref as t, isRef as z, createSlots as ae, withCtx as n, createCommentVNode as w, Fragment as re, renderList as se, createBlock as c, createElementVNode as ue, createTextVNode as V, toDisplayString as $, withModifiers as de } from "vue";
-import { icons as m } from "../../../../icons/index.js";
-import { isNotEmpty as ce, isArray as F } from "../../../../utils/utils.js";
-import me from "../../../KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js";
-import fe from "../../../KunList/src/components/KunList.vue.js";
-import B from "../../../KunListItem/src/components/KunListItem.vue.js";
-import E from "../../../KunListItemTitle/src/components/KunListItemTitle.vue.js";
-import pe from "../../../KunListItemSubtitle/src/components/KunListItemSubtitle.vue.js";
-import he from "../../../KunMenu/src/components/KunMenu.vue.js";
-import { useAutocomplete as ve } from "../composables/useAutocomplete.js";
-import { KunAutocompleteProps as ye } from "../composables/KunAutocompleteProps.js";
-import ke from "../../../KunTextField/src/components/KunTextField.vue.js";
-import ge from "../../../KunChip/src/components/KunChip.vue.js";
+import { mergeModels as R, useModel as S, onMounted as te, ref as _, watch as oe, createElementBlock as C, openBlock as s, createVNode as n, unref as l, isRef as $, createSlots as ie, withCtx as i, createCommentVNode as w, Fragment as ne, renderList as ae, createBlock as m, createElementVNode as re, createTextVNode as V, toDisplayString as A, withModifiers as se } from "vue";
+import { icons as f } from "../../../../icons/index.js";
+import { isNotEmpty as ue, isArray as z } from "../../../../utils/utils.js";
+import de from "../../../KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js";
+import ce from "../../../KunList/src/components/KunList.vue.js";
+import x from "../../../KunListItem/src/components/KunListItem.vue.js";
+import F from "../../../KunListItemTitle/src/components/KunListItemTitle.vue.js";
+import me from "../../../KunListItemSubtitle/src/components/KunListItemSubtitle.vue.js";
+import fe from "../../../KunMenu/src/components/KunMenu.vue.js";
+import { useAutocomplete as pe } from "../composables/useAutocomplete.js";
+import { KunAutocompleteProps as he } from "../composables/KunAutocompleteProps.js";
+import ve from "../../../KunTextField/src/components/KunTextField.vue.js";
+import ke from "../../../KunChip/src/components/KunChip.vue.js";
 import v from "../../../KunIcon/src/components/KunIcon.vue.js";
-const be = {
+const ye = {
   key: 0,
   class: "flex justify-center align-center"
-}, Ce = { class: "flex justify-center align-center" }, Be = {
+}, be = { class: "flex justify-center align-center" }, xe = {
   __name: "KunAutocomplete",
-  props: /* @__PURE__ */ _(ye, {
+  props: /* @__PURE__ */ R(he, {
     modelValue: { default: null },
     modelModifiers: {},
     items: { default: [], type: Array, required: !0 },
     itemsModifiers: {}
   }),
-  emits: /* @__PURE__ */ _(["update:modelValue", "selectedItem", "createItem", "validation", "search"], ["update:modelValue", "update:items"]),
-  setup(y, { emit: N }) {
-    const a = x(y, "modelValue"), I = x(y, "items"), u = y, f = N, {
-      textFieldRef: k,
-      listRef: g,
+  emits: /* @__PURE__ */ R(["update:modelValue", "selectedItem", "createItem", "validation", "search"], ["update:modelValue", "update:items"]),
+  setup(k, { emit: B }) {
+    const a = S(k, "modelValue"), I = S(k, "items"), u = k, p = B, {
+      textFieldRef: y,
+      listRef: b,
       menuModel: r,
-      search: d,
-      removeItem: T,
-      clearSelection: L,
-      lightReset: U,
-      openMenu: b,
-      closeMenu: H,
-      toggleMenu: O,
-      onMenuKeydown: j,
-      getSelectedItem: q,
-      textArr: P,
-      getItemText: W,
-      isAlphanumeric: G,
-      checkDisabled: J,
-      itemToString: S,
-      placeholder: Q
-    } = ve(u, f, a, I);
-    ne(() => {
-      u.focusOnRender && k.value.focus();
+      search: c,
+      removeItem: E,
+      clearSelection: N,
+      lightReset: T,
+      openMenu: g,
+      closeMenu: L,
+      toggleMenu: U,
+      onMenuKeydown: H,
+      getSelectedItem: O,
+      textArr: j,
+      getItemText: q,
+      isAlphanumeric: P,
+      checkDisabled: W,
+      itemToString: D,
+      placeholder: G
+    } = pe(u, p, a, I);
+    te(() => {
+      u.focusOnRender && y.value.focus();
     });
-    const D = A(null), p = A(""), K = (e) => {
+    const K = _(null), h = _(""), M = (e) => {
       for (const o of u.rules) {
-        const l = o(e);
-        if (l !== !0)
-          return p.value = l, f("validation", !1), !1;
+        const t = o(e);
+        if (t !== !0)
+          return h.value = t, p("validation", !1), !1;
       }
-      return p.value = "", f("validation", !0), !0;
+      return h.value = "", p("validation", !0), !0;
     };
-    ie(() => a.value, (e, o) => {
-      ce(u.rules) && K(e);
+    oe(() => a.value, (e, o) => {
+      ue(u.rules) && M(e);
     });
-    function X() {
+    function J() {
       var e;
-      r.value = !1, (e = k.value.inputField) == null || e.focus();
+      r.value = !1, (e = y.value.inputField) == null || e.focus();
     }
-    function Y(e) {
-      var l, h;
+    function Q(e) {
+      var t, d;
       const o = e.key;
       if (o === "Tab" || o === "Shift") {
-        H();
+        L();
         return;
       }
-      (G(o) || o === "Backspace") && b(), ["ArrowUp", "ArrowDown"].includes(o) && (e.preventDefault(), r.value || b(), console.log("listRef.value", g.value), (h = (l = g.value) == null ? void 0 : l.focusWithKey) == null || h.call(l, o));
+      (P(o) || o === "Backspace") && g(), ["ArrowUp", "ArrowDown"].includes(o) && (e.preventDefault(), r.value || g(), console.log("listRef.value", b.value), (d = (t = b.value) == null ? void 0 : t.focusWithKey) == null || d.call(t, o));
     }
-    function Z(e) {
-      f("search", d);
+    function X(e) {
+      p("search", c);
     }
-    function ee() {
-      K(a);
+    function Y() {
+      M(a);
     }
-    function le(e) {
-      j(e);
+    function Z(e) {
+      H(e);
     }
-    function te() {
+    function ee() {
     }
     return (e, o) => (s(), C("div", {
       class: "w-full h-fit",
       ref_key: "parentRef",
-      ref: D
+      ref: K
     }, [
-      i(ke, {
-        modelValue: t(d),
+      n(ve, {
+        modelValue: l(c),
         "onUpdate:modelValue": [
-          o[1] || (o[1] = (l) => z(d) ? d.value = l : null),
-          Z
+          o[1] || (o[1] = (t) => $(c) ? c.value = t : null),
+          X
         ],
         label: e.label,
         dirty: "",
         "hide-details": e.hideDetails,
         density: e.density,
         ref_key: "textFieldRef",
-        ref: k,
+        ref: y,
         autocomplete: "off",
-        onFocusInput: ee,
-        onHandleClick: t(O),
-        rounded: t(r) ? "rounded-t" : "rounded",
-        onBlur: te,
-        onKeyDown: Y,
-        placeholder: u.multiple && t(F)(a.value) && a.value.length ? "" : t(Q),
-        error: !!p.value,
-        "error-messages": p.value
-      }, ae({
-        default: n(() => [
-          t(F)(a.value) ? (s(), C("div", be, [
-            (s(!0), C(re, null, se(a.value, (l) => (s(), c(ge, {
-              key: l.id ?? l.name,
+        onFocusInput: Y,
+        onHandleClick: l(U),
+        rounded: l(r) ? "rounded-t" : "rounded",
+        onBlur: ee,
+        onKeyDown: Q,
+        placeholder: u.multiple && l(z)(a.value) && a.value.length ? "" : l(G),
+        error: !!h.value,
+        "error-messages": h.value
+      }, ie({
+        default: i(() => [
+          l(z)(a.value) ? (s(), C("div", ye, [
+            (s(!0), C(ne, null, ae(a.value, (t) => (s(), m(ke, {
+              key: t.id ?? t.name,
               size: "small",
               class: "ml-1"
             }, {
-              default: n(() => [
-                ue("div", Ce, [
-                  V($(t(W)(l, e.itemTitle)) + " ", 1),
-                  i(v, {
+              default: i(() => [
+                re("div", be, [
+                  V(A(l(q)(t, e.itemTitle)) + " ", 1),
+                  n(v, {
                     color: "error",
-                    icon: t(m).close,
+                    icon: l(f).close,
                     size: "small",
                     class: "ml-1",
-                    onClick: (h) => t(T)(l)
+                    onClick: (d) => l(E)(t)
                   }, null, 8, ["icon", "onClick"])
                 ])
               ]),
               _: 2
             }, 1024))), 128))
           ])) : w("", !0),
-          i(he, {
+          n(fe, {
             transition: "fade",
-            "onClick:outside": t(U),
-            modelValue: t(r),
-            "onUpdate:modelValue": o[0] || (o[0] = (l) => z(r) ? r.value = l : null),
+            "onClick:outside": l(T),
+            modelValue: l(r),
+            "onUpdate:modelValue": o[0] || (o[0] = (t) => $(r) ? r.value = t : null),
             activator: "parent",
             "z-index": e.zIndex,
-            "parent-ref": D.value,
+            "parent-ref": K.value,
             location: "bottom",
             origin: "bottom left",
-            onHandleEscape: X,
+            onHandleEscape: J,
             "close-on-content-click": e.closeOnSelect,
             width: "w-full",
             "max-height": e.maxHeight,
             "hide-details": e.hideDetails
           }, {
-            default: n(() => [
-              i(fe, {
-                "onClick:select": t(q),
+            default: i(() => [
+              n(ce, {
+                "onClick:select": l(O),
                 ref_key: "listRef",
-                ref: g,
-                onKeyDown: le,
+                ref: b,
+                onKeyDown: Z,
                 selectable: !0
               }, {
-                default: n(() => [
-                  i(me, {
+                default: i(() => [
+                  n(de, {
                     items: I.value,
-                    search: t(d),
+                    search: l(c),
                     "searchable-keys": u.searchableKeys,
                     virtual: !1,
                     "items-per-intersection": 10,
-                    enabled: t(r),
+                    enabled: l(r),
                     "item-height": 48
                   }, {
-                    default: n(({ item: l, index: h, empty: oe }) => {
-                      var M, R;
-                      return [
-                        !oe && l ? (s(), c(B, {
-                          value: l,
-                          key: ((M = l.id) == null ? void 0 : M.toString()) ?? l.name,
-                          disabled: t(J)(l),
-                          "bg-items": e.bgItemListColor,
-                          "hover-bg": e.hoverItemListColor,
-                          activeClass: e.selectedItemListColor,
-                          density: e.density,
-                          id: ((R = l.id) == null ? void 0 : R.toString()) ?? l.name,
-                          selectable: !0
-                        }, {
-                          default: n(() => [
-                            i(E, { class: "text-wrap" }, {
-                              default: n(() => [
-                                V($(t(S)(l, e.itemTitle ?? t(P), "hasDefault")), 1)
-                              ]),
-                              _: 2
-                            }, 1024),
-                            i(pe, {
-                              text: e.itemSubtitle ? t(S)(l, e.itemSubtitle) : ""
-                            }, null, 8, ["text"])
-                          ]),
-                          _: 2
-                        }, 1032, ["value", "disabled", "bg-items", "hover-bg", "activeClass", "density", "id"])) : (s(), c(B, {
-                          key: 1,
-                          disabled: ""
-                        }, {
-                          default: n(() => [
-                            i(E, { class: "text-center w-full text-gray-500" }, {
-                              default: n(() => o[2] || (o[2] = [
-                                V(" No hay elementos disponibles ")
-                              ])),
-                              _: 1,
-                              __: [2]
-                            })
-                          ]),
-                          _: 1
-                        }))
-                      ];
-                    }),
+                    default: i(({ item: t, index: d, empty: le }) => [
+                      !le && t ? (s(), m(x, {
+                        value: t,
+                        key: `kun-list-${d + 1}`,
+                        id: `kun-item-${d + 1}`,
+                        disabled: l(W)(t),
+                        "bg-items": e.bgItemListColor,
+                        "hover-bg": e.hoverItemListColor,
+                        activeClass: e.selectedItemListColor,
+                        density: e.density,
+                        selectable: !0
+                      }, {
+                        default: i(() => [
+                          n(F, { class: "text-wrap" }, {
+                            default: i(() => [
+                              V(A(l(D)(t, e.itemTitle ?? l(j), "hasDefault")), 1)
+                            ]),
+                            _: 2
+                          }, 1024),
+                          n(me, {
+                            text: e.itemSubtitle ? l(D)(t, e.itemSubtitle) : ""
+                          }, null, 8, ["text"])
+                        ]),
+                        _: 2
+                      }, 1032, ["value", "id", "disabled", "bg-items", "hover-bg", "activeClass", "density"])) : (s(), m(x, {
+                        key: 1,
+                        disabled: ""
+                      }, {
+                        default: i(() => [
+                          n(F, { class: "text-center w-full text-gray-500" }, {
+                            default: i(() => o[2] || (o[2] = [
+                              V(" No hay elementos disponibles ")
+                            ])),
+                            _: 1,
+                            __: [2]
+                          })
+                        ]),
+                        _: 1
+                      }))
+                    ]),
                     _: 1
                   }, 8, ["items", "search", "searchable-keys", "enabled"])
                 ]),
@@ -222,28 +219,28 @@ const be = {
       }, [
         e.hasIcons ? {
           name: "append-inner",
-          fn: n(() => [
-            e.clearable && a.value ? (s(), c(v, {
+          fn: i(() => [
+            e.clearable && a.value ? (s(), m(v, {
               key: 0,
-              onClick: t(L),
+              onClick: l(N),
               size: "small",
               color: "error",
-              icon: t(m).close,
+              icon: l(f).close,
               class: "mr-1 mt-1"
             }, null, 8, ["onClick", "icon"])) : w("", !0),
-            i(v, {
+            n(v, {
               color: "teal-darken-1",
               size: "large",
               class: "cursor-pointer",
-              icon: t(r) ? t(m).menuUpOutline : t(m).menuDownOutline,
-              onClick: de(t(b), ["stop"])
+              icon: l(r) ? l(f).menuUpOutline : l(f).menuDownOutline,
+              onClick: se(l(g), ["stop"])
             }, null, 8, ["icon", "onClick"]),
-            e.required ? (s(), c(v, {
+            e.required ? (s(), m(v, {
               key: 1,
               color: "teal-darken-1",
               size: "x-small",
               class: "mb-4",
-              icon: t(m).asterisk
+              icon: l(f).asterisk
             }, null, 8, ["icon"])) : w("", !0)
           ]),
           key: "0"
@@ -253,5 +250,5 @@ const be = {
   }
 };
 export {
-  Be as default
+  xe as default
 };

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

@@ -1,7 +1,7 @@
-import { mergeModels as m, ref as v, useModel as D, provide as p, computed as B, onUpdated as C, createElementBlock as I, openBlock as M, mergeProps as S, withModifiers as E, renderSlot as L } from "vue";
+import { mergeModels as g, ref as v, useModel as D, provide as p, computed as B, onUpdated as C, createElementBlock as M, openBlock as S, mergeProps as I, withModifiers as E, renderSlot as L } from "vue";
 const R = {
   __name: "KunList",
-  props: /* @__PURE__ */ m({
+  props: /* @__PURE__ */ g({
     nav: Boolean,
     sub: Boolean,
     dense: Boolean,
@@ -20,39 +20,39 @@ const R = {
     },
     selectedModifiers: {}
   }),
-  emits: /* @__PURE__ */ m(["keyDown", "click:select", "update:selected"], ["update:selected"]),
+  emits: /* @__PURE__ */ g(["keyDown", "click:select", "update:selected"], ["update:selected"]),
   setup(o, { expose: w, emit: b }) {
-    const d = o, a = b, f = v(null), r = v([]), i = D(o, "selected");
+    const c = o, a = b, f = v(null), s = v([]), i = D(o, "selected");
     p("registerListItemRef", (e) => {
-      e ? (console.log(e), e.isConnected && !r.value.includes(e) && (r.value.push(e), r.value.sort((t, n) => {
-        const s = t.id ?? "", l = n.id ?? "";
-        return s.localeCompare(l, void 0, { numeric: !0, sensitivity: "base" });
-      }))) : r.value = r.value.filter((t) => t && t.isConnected);
+      e ? e.isConnected && !s.value.includes(e) && (s.value.push(e), s.value.sort((t, n) => {
+        const r = t.id ?? "", l = n.id ?? "";
+        return r.localeCompare(l, void 0, { numeric: !0, sensitivity: "base" });
+      })) : s.value = s.value.filter((t) => t && t.isConnected);
     });
-    const g = B(() => d.selectable && d.selectionMode === "multiple");
+    const m = B(() => c.selectable && c.selectionMode === "multiple");
     function y(e) {
-      if (!(!d.selectable || e == null))
-        if (g.value) {
+      if (!(!c.selectable || e == null))
+        if (m.value) {
           const t = i.value.includes(e);
           i.value = t ? i.value.filter((n) => n !== e) : [...i.value, e];
         } else
           i.value = e;
     }
     C(() => {
-      r.value = r.value.filter((e) => e && e.isConnected);
+      s.value = s.value.filter((e) => e && e.isConnected);
     });
     function k(e) {
       var t, n;
-      return !d.selectable || e == null ? !1 : g.value ? (n = (t = i.value) == null ? void 0 : t.includes) == null ? void 0 : n.call(t, e) : i.value === e;
+      return !c.selectable || e == null ? !1 : m.value ? (n = (t = i.value) == null ? void 0 : t.includes) == null ? void 0 : n.call(t, e) : i.value === e;
     }
     p("kunListContext", {
       toggleItem: y,
       isSelected: k
     });
     function A(e) {
-      var s;
+      var r;
       a("keyDown", e);
-      const t = e.key, n = r.value.filter((l) => l && l.isConnected);
+      const t = e.key, n = s.value.filter((l) => l && l.isConnected);
       if (!(!n.length || !["ArrowUp", "ArrowDown", "Enter"].includes(t))) {
         if (t === "Enter") {
           const l = document.activeElement;
@@ -61,26 +61,26 @@ const R = {
         }
         if (t === "ArrowUp" || t === "ArrowDown") {
           e.preventDefault();
-          const l = n.findIndex((h) => h === document.activeElement);
-          let u = -1;
-          l === -1 ? (console.log(1), u = t === "ArrowDown" ? 0 : n.length - 1) : t === "ArrowDown" ? (console.log(2), u = (l + 1) % n.length) : t === "ArrowUp" && (console.log(3), u = (l - 1 + n.length) % n.length), console.log(`currentIndex: ${u}`);
-          const c = n[u];
-          (s = c == null ? void 0 : c.focus) == null || s.call(c);
+          const l = n.findIndex((x) => x === document.activeElement);
+          let d = -1;
+          l === -1 ? d = t === "ArrowDown" ? 0 : n.length - 1 : t === "ArrowDown" ? d = (l + 1) % n.length : t === "ArrowUp" && (d = (l - 1 + n.length) % n.length);
+          const u = n[d];
+          (r = u == null ? void 0 : u.focus) == null || r.call(u);
           return;
         }
       }
     }
-    function x(e = "ArrowDown") {
+    function h(e = "ArrowDown") {
       var l;
-      const t = r.value.filter(Boolean);
+      const t = s.value.filter(Boolean);
       if (!t.length) return;
-      const n = e === "ArrowDown" ? 0 : t.length - 1, s = t[n];
-      (l = s == null ? void 0 : s.focus) == null || l.call(s);
+      const n = e === "ArrowDown" ? 0 : t.length - 1, r = t[n];
+      (l = r == null ? void 0 : r.focus) == null || l.call(r);
     }
-    return w({ focusWithKey: x, focus: () => {
+    return w({ focusWithKey: h, focus: () => {
       var e, t;
       return (t = (e = f.value) == null ? void 0 : e.focus) == null ? void 0 : t.call(e);
-    } }), (e, t) => (M(), I("ul", S({
+    } }), (e, t) => (S(), M("ul", I({
       ref_key: "ulRef",
       ref: f,
       role: "list",

package/package.json

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