adverich-kun-ui 0.1.158 → 0.1.159

package/dist/components/KunTable/src/components/KunTableHeaders.vue.js

@@ -1,5 +1,11 @@
-import { createElementBlock as t, openBlock as s, normalizeClass as c, createElementVNode as y, createCommentVNode as d, renderSlot as g, Fragment as S, renderList as B, normalizeStyle as f, toDisplayString as h } from "vue";
-const A = { key: 0 }, E = { key: 1 }, T = ["checked"], w = ["onClick"], $ = { key: 0 }, z = { key: 0 }, L = { key: 1 }, v = "bg-slate-200 dark:bg-slate-800 sticky top-0 z-5", N = "", O = "px-3 py-2 text-xs font-medium text-slate-700 dark:text-slate-300 uppercase tracking-wider", j = {
+import { createElementBlock as o, openBlock as l, normalizeClass as a, createElementVNode as u, createCommentVNode as m, renderSlot as g, Fragment as w, renderList as B, normalizeStyle as A, toDisplayString as k, createBlock as E, resolveDynamicComponent as T } from "vue";
+import v from "../../../../icons/IconArrowUp.vue.js";
+import $ from "../../../../icons/IconArrowDown.vue.js";
+import D from "../../../../icons/IconArrowDownUp.vue.js";
+const z = { key: 0 }, L = { key: 1 }, O = ["checked"], I = ["onClick"], N = {
+  key: 0,
+  class: "inline-flex items-center gap-1 ml-1"
+}, U = "bg-slate-200 dark:bg-slate-800 sticky top-0 z-5", V = "", j = "px-3 py-2 text-xs font-medium text-slate-700 dark:text-slate-300 uppercase tracking-wider", G = {
   __name: "KunTableHeaders",
   props: {
     headers: Array,
@@ -16,71 +22,74 @@ const A = { key: 0 }, E = { key: 1 }, T = ["checked"], w = ["onClick"], $ = { ke
     actionLabel: String
   },
   emits: ["toggle-select-all", "sort", "expandAll", "collapseAll"],
-  setup(l, { emit: u }) {
-    const o = l, r = u;
-    function m() {
-      r("toggle-select-all");
+  setup(n, { emit: y }) {
+    const r = n, i = y;
+    function h() {
+      i("toggle-select-all");
     }
-    function x(n) {
-      var k;
-      if (!n.sortable) return;
-      const e = ((k = o.sortBy) == null ? void 0 : k.key) === n.key && o.sortBy.order === "asc" ? "desc" : "asc";
-      r("sort", { key: n.key, order: e });
+    function p(s) {
+      var c;
+      if (!s.sortable) return;
+      const t = (c = r.sortBy) == null ? void 0 : c.find((S) => S.key === s.value), e = (t == null ? void 0 : t.order) === "asc" ? "desc" : "asc";
+      i("sort", { key: s.value, order: e });
     }
-    function C(n) {
-      var a;
-      return ((a = o.sortBy) == null ? void 0 : a.key) === n.key;
+    function x(s) {
+      var t, e;
+      return (e = (t = r.sortBy) == null ? void 0 : t.find((c) => c.key === s.value)) == null ? void 0 : e.order;
     }
-    const b = [v, o.theadClass], p = [N, o.trClass], i = [O, o.thClass];
-    return (n, a) => (s(), t("thead", {
-      class: c(b)
+    const C = (s) => {
+      const t = x(s);
+      return t ? t === "asc" ? v : $ : D;
+    }, f = [U, r.theadClass], b = [V, r.trClass], d = [j, r.thClass];
+    return (s, t) => (l(), o("thead", {
+      class: a(f)
     }, [
-      y("tr", {
-        class: c(p)
+      u("tr", {
+        class: a(b)
       }, [
-        l.showExpand ? (s(), t("th", {
+        n.showExpand ? (l(), o("th", {
           key: 0,
-          class: c([i])
+          class: a([d])
         }, [
-          n.$slots.expandIcon ? g(n.$slots, "expand-icon", { key: 0 }) : (s(), t("button", {
+          s.$slots.expandIcon ? g(s.$slots, "expand-icon", { key: 0 }) : (l(), o("button", {
             key: 1,
-            onClick: a[0] || (a[0] = (e) => l.isExpanded ? r("expandAll") : r("collapseAll"))
+            onClick: t[0] || (t[0] = (e) => n.isExpanded ? i("expandAll") : i("collapseAll"))
           }, [
-            l.isExpanded ? (s(), t("span", A, "−")) : (s(), t("span", E, "+"))
+            n.isExpanded ? (l(), o("span", z, "−")) : (l(), o("span", L, "+"))
           ]))
-        ], 2)) : d("", !0),
-        l.showSelect ? (s(), t("th", {
+        ], 2)) : m("", !0),
+        n.showSelect ? (l(), o("th", {
           key: 1,
-          class: c(i)
+          class: a(d)
         }, [
-          y("input", {
+          u("input", {
             type: "checkbox",
-            checked: l.allSelected,
-            onChange: m,
+            checked: n.allSelected,
+            onChange: h,
             class: "form-checkbox"
-          }, null, 40, T)
-        ])) : d("", !0),
-        (s(!0), t(S, null, B(l.headers, (e) => (s(), t("th", {
+          }, null, 40, O)
+        ])) : m("", !0),
+        (l(!0), o(w, null, B(n.headers, (e) => (l(), o("th", {
           key: e.key,
-          class: c([i, e.headerAlign === "right" ? "text-right" : e.headerAlign === "center" ? "text-center" : "text-left"]),
-          onClick: (k) => x(e),
-          style: f({ cursor: e.sortable ? "pointer" : "default" })
+          class: a([d, e.headerAlign === "right" ? "text-right" : e.headerAlign === "center" ? "text-center" : "text-left"]),
+          onClick: (c) => p(e),
+          style: A({ cursor: e.sortable ? "pointer" : "default" })
         }, [
-          g(n.$slots, `header.${e.key}`, { header: e }, () => [
-            y("span", null, h(e.label), 1),
-            e.sortable ? (s(), t("span", $, [
-              C(e) ? (s(), t("span", z, h(l.sortBy.order === "asc" ? "⬆️" : "⬇️"), 1)) : (s(), t("span", L, "⇅"))
-            ])) : d("", !0)
+          g(s.$slots, `header.${e.key}`, { header: e }, () => [
+            u("span", null, k(e.label ?? e.text), 1),
+            e.sortable ? (l(), o("span", N, [
+              (l(), E(T(C(e)), { class: "w-4 h-4 text-gray-500" }))
+            ])) : m("", !0)
           ])
-        ], 14, w))), 128)),
-        l.hasActions ? (s(), t("th", {
+        ], 14, I))), 128)),
+        n.hasActions ? (l(), o("th", {
           key: 2,
-          class: c([[i], "text-center"])
-        }, h(l.actionLabel), 3)) : d("", !0)
+          class: a([[d], "text-center"])
+        }, k(n.actionLabel), 3)) : m("", !0)
       ])
     ]));
   }
 };
 export {
-  j as default
+  G as default
 };

package/dist/components/KunTable/src/composables/KunTableProps.js

@@ -12,6 +12,7 @@ const t = () => ({
   itemsPerPage: { type: Number, default: 10 },
   page: { type: Number, default: 1 },
   sortBy: { type: Array, default: () => [] },
+  mutliSort: Boolean,
   pageOptions: { type: Array, default: () => [5, 10, 25, 50, 100] },
   searchable: { type: Boolean, default: !1 },
   searchableKeys: { type: Array, default: null },

package/dist/components/KunTable/src/composables/useOptions.js

@@ -1,29 +1,47 @@
-import { reactive as x, watch as t, computed as s } from "vue";
-function I(y, a, u) {
-  const { page: p, itemsPerPage: d, sortBy: g } = y, r = x({
+import { reactive as x, watch as c, computed as f } from "vue";
+function A(y, u, l) {
+  const { page: p, itemsPerPage: g, sortBy: P, mutliSort: m } = y, e = x({
     page: p.value,
-    itemsPerPage: d.value,
-    sortBy: [...g.value || []]
+    itemsPerPage: g.value,
+    sortBy: [...P.value || []]
   });
-  t(() => p.value, (e) => r.page = e), t(() => d.value, (e) => r.itemsPerPage = e), t(() => g.value, (e) => r.sortBy = [...e]), t(() => r.page, (e) => a == null ? void 0 : a("update:page", e)), t(() => r.itemsPerPage, (e) => a == null ? void 0 : a("update:itemsPerPage", e)), t(() => r.sortBy, (e) => a == null ? void 0 : a("update:sortBy", e));
-  const v = s(() => (r.page - 1) * r.itemsPerPage), B = s(() => v.value + r.itemsPerPage), P = s(() => Array.isArray(u.value) ? r.sortBy.length ? [...u.value].sort((e, o) => {
-    for (const { key: n, order: i } of r.sortBy) {
-      const c = e[n], l = o[n];
-      if (c !== l)
-        return i === "asc" ? c > l ? 1 : -1 : c < l ? 1 : -1;
+  c(() => p.value, (t) => e.page = t), c(() => g.value, (t) => e.itemsPerPage = t), c(() => e.page, (t) => u == null ? void 0 : u("update:page", t)), c(() => e.itemsPerPage, (t) => u == null ? void 0 : u("update:itemsPerPage", t));
+  const d = f(() => (e.page - 1) * e.itemsPerPage), B = f(() => d.value + e.itemsPerPage), v = f(() => Array.isArray(l.value) ? e.sortBy.length ? [...l.value].sort((t, s) => {
+    for (const { key: i, order: o } of e.sortBy) {
+      const n = t[i], r = s[i];
+      if (!(n == null && r == null)) {
+        if (n == null) return o === "asc" ? -1 : 1;
+        if (r == null) return o === "asc" ? 1 : -1;
+        if (n instanceof Date && r instanceof Date) {
+          const a = n.getTime() - r.getTime();
+          if (a !== 0) return o === "asc" ? a : -a;
+          continue;
+        }
+        if (typeof n == "number" && typeof r == "number") {
+          const a = n - r;
+          if (a !== 0) return o === "asc" ? a : -a;
+          continue;
+        }
+        if (typeof n == "string" && typeof r == "string") {
+          const a = n.localeCompare(r, void 0, { sensitivity: "base" });
+          if (a !== 0) return o === "asc" ? a : -a;
+          continue;
+        }
+        if (n !== r) return o === "asc" ? n > r ? 1 : -1 : n < r ? 1 : -1;
+      }
     }
     return 0;
-  }) : u.value : []), f = s(() => P.value.slice(v.value, B.value));
+  }) : l.value : []), b = f(() => v.value.slice(d.value, B.value));
   return {
-    options: r,
-    paginatedItems: f,
-    updateSort: (e) => {
-      const o = r.sortBy.find((n) => n.key === e);
-      o ? o.order = o.order === "asc" ? "desc" : "asc" : r.sortBy = [{ key: e, order: "asc" }];
+    options: e,
+    paginatedItems: b,
+    updateSort: ({ key: t, order: s }) => {
+      const i = e.sortBy.find((o) => o.key === t);
+      i ? i.order = s : m.value ? e.sortBy.push({ key: t, order: s }) : e.sortBy = [{ key: t, order: s }];
     },
-    sortedItems: P
+    sortedItems: v
   };
 }
 export {
-  I as default
+  A as default
 };

package/dist/icons/IconArrowDown.vue.js

@@ -0,0 +1,20 @@
+import { createElementBlock as e, openBlock as o, createElementVNode as l } from "vue";
+import r from "../_virtual/_plugin-vue_export-helper.js";
+const n = {}, m = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24"
+};
+function c(s, t) {
+  return o(), e("svg", m, t[0] || (t[0] = [
+    l("path", {
+      fill: "currentColor",
+      d: "m12 20l-.707.707l.707.707l.707-.707zm1-15a1 1 0 1 0-2 0zm-7.707 9.707l6 6l1.414-1.414l-6-6zm7.414 6l6-6l-1.414-1.414l-6 6zM13 20V5h-2v15z"
+    }, null, -1)
+  ]));
+}
+const w = /* @__PURE__ */ r(n, [["render", c]]);
+export {
+  w as default
+};

package/dist/icons/IconArrowDownUp.vue.js

@@ -0,0 +1,20 @@
+import { createElementBlock as t, openBlock as e, createElementVNode as o } from "vue";
+import r from "../_virtual/_plugin-vue_export-helper.js";
+const n = {}, m = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24"
+};
+function c(s, l) {
+  return e(), t("svg", m, l[0] || (l[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "m8 2l-.707-.707L8 .586l.707.707zm1 15a1 1 0 1 1-2 0zM2.293 6.293l5-5l1.414 1.414l-5 5zm6.414-5l5 5l-1.414 1.414l-5-5zM9 2v15H7V2zm7 20l-.707.707l.707.707l.707-.707zm1-15a1 1 0 1 0-2 0zm-6.707 10.707l5 5l1.414-1.414l-5-5zm6.414 5l5-5l-1.414-1.414l-5 5zM17 22V7h-2v15z"
+    }, null, -1)
+  ]));
+}
+const a = /* @__PURE__ */ r(n, [["render", c]]);
+export {
+  a as default
+};

package/dist/icons/IconArrowUp.vue.js

@@ -0,0 +1,20 @@
+import { createElementBlock as e, openBlock as l, createElementVNode as o } from "vue";
+import r from "../_virtual/_plugin-vue_export-helper.js";
+const n = {}, c = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24"
+};
+function m(s, t) {
+  return l(), e("svg", c, t[0] || (t[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "m12 4l-.707-.707l.707-.707l.707.707zm1 15a1 1 0 1 1-2 0zM5.293 9.293l6-6l1.414 1.414l-6 6zm7.414-6l6 6l-1.414 1.414l-6-6zM13 4v15h-2V4z"
+    }, null, -1)
+  ]));
+}
+const p = /* @__PURE__ */ r(n, [["render", m]]);
+export {
+  p as default
+};

package/dist/icons/index.js

@@ -1,33 +1,39 @@
-import o from "./IconAsterisk.vue.js";
-import e from "./IconCheck.vue.js";
-import t from "./IconClose.vue.js";
-import n from "./IconDelete.vue.js";
-import r from "./IconEdit.vue.js";
-import i from "./IconMenuDownOutline.vue.js";
-import m from "./IconMenuUpOutline.vue.js";
-import c from "./IconSearch.vue.js";
-import f from "./IconStar.vue.js";
-import l from "./IconEyeOutline.vue.js";
-import p from "./IconEyeOffOutline.vue.js";
-import u from "./IconAccountOutline.vue.js";
+import o from "./IconAccountOutline.vue.js";
+import r from "./IconArrowDown.vue.js";
+import n from "./IconArrowDownUp.vue.js";
+import t from "./IconArrowUp.vue.js";
+import e from "./IconAsterisk.vue.js";
+import i from "./IconCheck.vue.js";
+import m from "./IconClose.vue.js";
+import c from "./IconDelete.vue.js";
+import p from "./IconEdit.vue.js";
+import f from "./IconEyeOutline.vue.js";
+import l from "./IconEyeOffOutline.vue.js";
+import u from "./IconMenuDownOutline.vue.js";
+import a from "./IconMenuUpOutline.vue.js";
 import I from "./IconPencil.vue.js";
-import O from "./IconTrashOutline.vue.js";
-const x = {
-  asterisk: o,
-  check: e,
-  close: t,
-  delete: n,
-  edit: r,
-  menuDownOutline: i,
-  menuUpOutline: m,
-  search: c,
-  star: f,
-  eyeOutline: l,
-  eyeOffOutline: p,
-  accountOutline: u,
+import O from "./IconSearch.vue.js";
+import s from "./IconStar.vue.js";
+import w from "./IconTrashOutline.vue.js";
+const q = {
+  accountOutline: o,
+  arrowDown: r,
+  arrowDownUp: n,
+  arrowUp: t,
+  asterisk: e,
+  check: i,
+  close: m,
+  delete: c,
+  edit: p,
+  eyeOutline: f,
+  eyeOffOutline: l,
+  menuDownOutline: u,
+  menuUpOutline: a,
   pencil: I,
-  trashOutline: O
+  search: O,
+  star: s,
+  trashOutline: w
 };
 export {
-  x as icons
+  q as icons
 };

package/package.json

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