adverich-kun-ui 0.1.241 → 0.1.243

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

@@ -54,8 +54,8 @@ const b = ["innerHTML"], S = {
         class: c([o.color, s.value, o.contentClass])
       }, null, 8, ["class"])) : (a(), i("span", {
         key: 2,
-        innerHTML: r.value ? n.value : "",
-        class: c([r.value ? "" : n.value, o.color, s.value, o.contentClass])
+        class: c([r.value ? "" : n.value, o.color, s.value, o.contentClass]),
+        innerHTML: r.value ? n.value : ""
       }, null, 10, b))
     ], 16));
   }

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

@@ -5,8 +5,8 @@ import fe from "./KunTableFooter.vue.js";
 import ye from "./KunTableRows.vue.js";
 import be from "./KunTableIterators.vue.js";
 import we from "../../../KunBtn/src/components/KunBtn.vue.js";
-import ve from "./KunTableFilter.vue.js";
-import Se from "../../../KunCard/src/components/KunCard.vue.js";
+import Se from "./KunTableFilter.vue.js";
+import ve from "../../../KunCard/src/components/KunCard.vue.js";
 import Ce from "../composables/useExpand.js";
 import $e from "../composables/useOptions.js";
 import ke from "../composables/useSelect.js";
@@ -23,28 +23,28 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
   }),
   emits: /* @__PURE__ */ V(["update:page", "update:itemsPerPage", "update:sortBy", "update:search"], ["update:selectedItems"]),
   setup(E, { emit: O }) {
-    const B = O, r = E, v = ie(r), W = de(E, "selectedItems"), {
+    const B = O, r = E, S = ie(r), W = de(E, "selectedItems"), {
       headers: b,
-      showExpand: S,
+      showExpand: v,
       showSelect: C,
       rowClass: I,
-      hideDefaultFooter: x,
-      hideDefaultHeader: H,
-      tableClass: Q,
-      wrapperClass: q,
+      hideDefaultFooter: H,
+      hideDefaultHeader: Q,
+      tableClass: q,
+      wrapperClass: x,
       pageOptions: G,
       items: J,
       searchable: M,
       debounceTime: X
-    } = v, h = pe(r.search);
+    } = S, h = pe(r.search);
     j(() => r.search, (e) => {
       e !== h.value && (h.value = e);
     });
-    const { filteredItems: Y, setSearch: Z, modalFilter: g, applyColumnFilters: _, clearFilters: ee, appliedFilters: se } = Pe(v, X);
+    const { filteredItems: Y, setSearch: Z, modalFilter: g, applyColumnFilters: _, clearFilters: ee, appliedFilters: se } = Pe(S, X);
     j(h, (e) => {
       B("update:search", e), Z(e);
     });
-    const { options: n, paginatedItems: p, updateSort: te } = $e(v, B, Y), { isSelected: $, toggleSelect: k, toggleSelectAll: le, allSelected: oe, someSelected: ae } = ke(p, W), { isExpanded: P, toggleExpand: T } = Ce(), m = z(() => ({
+    const { options: n, paginatedItems: p, updateSort: te } = $e(S, B, Y), { isSelected: $, toggleSelect: k, toggleSelectAll: le, allSelected: oe, someSelected: ae } = ke(p, W), { isExpanded: P, toggleExpand: T } = Ce(), m = z(() => ({
       items: p.value,
       headers: b.value,
       page: n.page,
@@ -55,7 +55,7 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
       isExpanded: P,
       sortBy: n.sortBy,
       hasActions: r.hasActions
-    })), re = [Me, q.value], ne = [Ve, Q.value];
+    })), re = [Me, x.value], ne = [Ve, q.value];
     return z(() => {
       var t;
       let e = ((t = r.headers) == null ? void 0 : t.length) || 0;
@@ -93,12 +93,12 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
         e.$slots.colgroup && !s(w) ? (l(), c("colgroup", Ae, [
           a(e.$slots, "colgroup", d(u(m.value)))
         ])) : i("", !0),
-        !s(H) && !s(w) ? (l(), y(ge, {
+        !s(Q) && !s(w) ? (l(), y(ge, {
           key: 1,
           headers: s(b),
           "sort-by": s(n).sortBy,
           "show-select": s(C),
-          "show-expand": s(S),
+          "show-expand": s(v),
           "all-selected": s(oe),
           "some-selected": s(ae),
           "thead-class": e.theadClass,
@@ -123,11 +123,12 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
             "is-selected": s($),
             "is-expanded": s(P),
             "show-select": s(C),
-            "show-expand": s(S),
+            "show-expand": s(v),
             "has-actions": e.hasActions,
             "action-loading-map": e.actionLoadingMap,
             onToggleExpand: s(T),
-            onToggleSelect: s(k)
+            onToggleSelect: s(k),
+            customSlots: e.customSlots
           }, U({ _: 2 }, [
             N(e.$slots, (o, f) => ({
               name: f,
@@ -135,7 +136,7 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
                 a(e.$slots, f, d(u(F)))
               ])
             }))
-          ]), 1032, ["items", "headers", "tbody-class", "row-class", "tr-class", "td-class", "selected-class", "striped-class", "is-selected", "is-expanded", "show-select", "show-expand", "has-actions", "action-loading-map", "onToggleExpand", "onToggleSelect"]),
+          ]), 1032, ["items", "headers", "tbody-class", "row-class", "tr-class", "td-class", "selected-class", "striped-class", "is-selected", "is-expanded", "show-select", "show-expand", "has-actions", "action-loading-map", "onToggleExpand", "onToggleSelect", "customSlots"]),
           a(e.$slots, "body.append", d(u(m.value)))
         ], 64)) : s(p).length && s(w) ? (l(), y(be, {
           key: 4,
@@ -145,7 +146,7 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
           "is-selected": s($),
           "is-expanded": s(P),
           "show-select": s(C),
-          "show-expand": s(S),
+          "show-expand": s(v),
           "has-actions": e.hasActions,
           "action-loading-map": e.actionLoadingMap,
           onToggleExpand: s(T),
@@ -163,14 +164,14 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
         ])) : i("", !0)
       ]),
       D("div", Be, [
-        s(p).length ? i("", !0) : (l(), y(Se, {
+        s(p).length ? i("", !0) : (l(), y(ve, {
           key: 0,
           class: "h-full flex justify-center items-center",
           title: e.noDataText,
           titleSize: "text-4xl"
         }, null, 8, ["title"]))
       ]),
-      s(x) ? a(e.$slots, "footer", d(A({ key: 2 }, m.value))) : (l(), c("div", Ie, [
+      s(H) ? a(e.$slots, "footer", d(A({ key: 2 }, m.value))) : (l(), c("div", Ie, [
         R(fe, {
           "items-length": s(J).length,
           "items-per-page": s(n).itemsPerPage,
@@ -180,7 +181,7 @@ const Fe = ["placeholder"], Ae = { key: 0 }, Ee = { key: 5 }, Be = { class: "h-f
           "onUpdate:page": t[3] || (t[3] = (o) => s(n).page = o)
         }, null, 8, ["items-length", "items-per-page", "current-page", "page-options"])
       ])),
-      e.filterable && s(g) ? (l(), y(ve, {
+      e.filterable && s(g) ? (l(), y(Se, {
         key: 3,
         filters: e.filters,
         modelValue: s(g),

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

@@ -1,6 +1,6 @@
-import { createElementBlock as s, openBlock as n, normalizeClass as a, createCommentVNode as c, renderSlot as m, createElementVNode as b, withModifiers as w, Fragment as f, renderList as h, unref as g, createTextVNode as y, toDisplayString as S } from "vue";
-import { getValue as x, formatValue as v } from "../../../../utils/tableFormatters.js";
-const B = { key: 0 }, $ = { key: 1 }, A = ["checked"], E = "hover:bg-slate-300 dark:hover:bg-slate-600 border-t border-slate-300 dark:border-slate-700", T = "bg-slate-100 dark:bg-slate-900", V = "px-3 py-2 whitespace-nowrap text-sm text-black dark:text-white", R = {
+import { createElementBlock as l, openBlock as s, normalizeClass as a, createCommentVNode as r, renderSlot as u, createElementVNode as w, withModifiers as y, Fragment as S, renderList as f, createBlock as v, resolveDynamicComponent as h, unref as c, createTextVNode as B, toDisplayString as $ } from "vue";
+import { getValue as g, formatValue as A } from "../../../../utils/tableFormatters.js";
+const E = { key: 0 }, T = { key: 1 }, V = ["checked"], N = "hover:bg-slate-300 dark:hover:bg-slate-600 border-t border-slate-300 dark:border-slate-700", j = "bg-slate-100 dark:bg-slate-900", D = "px-3 py-2 whitespace-nowrap text-sm text-black dark:text-white", z = {
   __name: "KunTableRow",
   props: {
     item: Object,
@@ -17,73 +17,85 @@ const B = { key: 0 }, $ = { key: 1 }, A = ["checked"], E = "hover:bg-slate-300 d
     isSelected: Boolean,
     hasActions: Boolean,
     actionsAlign: String,
-    loading: Boolean
+    loading: Boolean,
+    customSlots: Object
   },
   emits: ["toggle-expand", "toggle-select", "row-click"],
-  setup(e, { emit: u }) {
-    const l = e, r = u, k = [
-      E,
-      T,
-      l.rowClass,
-      l.trClass,
-      l.stripedClass,
-      l.isSelected ? l.selectedClass : ""
-    ], o = [V, l.tdClass], C = ["text-center", l.actionsAlign];
-    return (d, i) => (n(), s("tr", {
-      class: a(k),
-      onClick: i[2] || (i[2] = (t) => r("row-click", { item: e.item, index: e.index, event: t }))
+  setup(e, { emit: k }) {
+    const n = e, m = k, C = [
+      N,
+      j,
+      n.rowClass,
+      n.trClass,
+      n.stripedClass,
+      n.isSelected ? n.selectedClass : ""
+    ], o = [D, n.tdClass], b = ["text-center", n.actionsAlign];
+    return (d, i) => (s(), l("tr", {
+      class: a(C),
+      onClick: i[2] || (i[2] = (t) => m("row-click", { item: e.item, index: e.index, event: t }))
     }, [
-      e.showExpand ? (n(), s("td", {
+      e.showExpand ? (s(), l("td", {
         key: 0,
         class: a(o)
       }, [
-        d.$slots.expandIcon ? m(d.$slots, "expand-icon", {
+        d.$slots.expandIcon ? u(d.$slots, "expand-icon", {
           key: 0,
           item: e.item,
           index: e.index
-        }) : (n(), s("button", {
+        }) : (s(), l("button", {
           key: 1,
-          onClick: i[0] || (i[0] = (t) => r("toggle-expand", e.item))
+          onClick: i[0] || (i[0] = (t) => m("toggle-expand", e.item))
         }, [
-          e.isExpanded ? (n(), s("span", B, "−")) : (n(), s("span", $, "+"))
+          e.isExpanded ? (s(), l("span", E, "−")) : (s(), l("span", T, "+"))
         ]))
-      ])) : c("", !0),
-      e.showSelect ? (n(), s("td", {
+      ])) : r("", !0),
+      e.showSelect ? (s(), l("td", {
         key: 1,
         class: a([o, "h-full w-10 flex flex-col items-center justify-center"])
       }, [
-        b("input", {
+        w("input", {
           type: "checkbox",
           checked: e.isSelected,
-          onChange: i[1] || (i[1] = w((t) => r("toggle-select", e.item), ["stop"])),
+          onChange: i[1] || (i[1] = y((t) => m("toggle-select", e.item), ["stop"])),
           class: "h-5 w-5 text-blue-600 transition-all duration-200 ease-in-out rounded"
-        }, null, 40, A)
-      ])) : c("", !0),
-      (n(!0), s(f, null, h(e.headers, (t) => (n(), s("td", {
-        key: t.value,
-        class: a([o, t.align === "right" ? "text-right" : t.align === "left" ? "text-left" : "text-center"])
-      }, [
-        m(d.$slots, `item.${t.value}`, {
-          item: e.item,
-          value: g(x)(t, e.item),
-          index: e.index
-        }, () => [
-          y(S(g(v)(t, g(x)(t, e.item))), 1)
-        ])
-      ], 2))), 128)),
-      e.hasActions ? (n(), s("td", {
+        }, null, 40, V)
+      ])) : r("", !0),
+      (s(!0), l(S, null, f(e.headers, (t) => {
+        var x;
+        return s(), l("td", {
+          key: t.value,
+          class: a([o, t.align === "right" ? "text-right" : t.align === "left" ? "text-left" : "text-center"])
+        }, [
+          (x = e.customSlots) != null && x[`item.${t.value}`] ? (s(), v(h(e.customSlots[`item.${t.value}`]), {
+            key: 0,
+            item: e.item,
+            value: c(g)(t, e.item),
+            index: e.index,
+            header: t
+          }, null, 8, ["item", "value", "index", "header"])) : u(d.$slots, `item.${t.value}`, {
+            key: 1,
+            item: e.item,
+            value: c(g)(t, e.item),
+            index: e.index,
+            header: t
+          }, () => [
+            B($(c(A)(t, c(g)(t, e.item))), 1)
+          ])
+        ], 2);
+      }), 128)),
+      e.hasActions ? (s(), l("td", {
         key: 2,
-        class: a([o, C])
+        class: a([o, b])
       }, [
-        m(d.$slots, "item.actions", {
+        u(d.$slots, "item.actions", {
           item: e.item,
           index: e.index,
           loading: e.loading
         })
-      ], 2)) : c("", !0)
+      ], 2)) : r("", !0)
     ]));
   }
 };
 export {
-  R as default
+  z as default
 };

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

@@ -1,4 +1,4 @@
-import { computed as g, createElementBlock as d, openBlock as l, normalizeClass as p, Fragment as c, renderList as u, createVNode as E, createCommentVNode as S, mergeProps as h, createSlots as b, withCtx as C, renderSlot as f, createElementVNode as m } from "vue";
+import { computed as w, createElementBlock as l, openBlock as d, normalizeClass as g, Fragment as c, renderList as u, createVNode as b, createCommentVNode as E, mergeProps as h, createSlots as p, withCtx as C, renderSlot as m, createElementVNode as f } from "vue";
 import B from "./KunTableRow.vue.js";
 const A = { key: 0 }, $ = ["colspan"], k = "table-auto w-full text-sm text-left", K = {
   __name: "KunTableRows",
@@ -15,58 +15,59 @@ const A = { key: 0 }, $ = ["colspan"], k = "table-auto w-full text-sm text-left"
     },
     itemKey: {
       type: Function,
-      default: (e, s) => s
+      default: (e, o) => o
     },
     headers: Array,
     showExpand: Boolean,
     showSelect: Boolean,
     hasActions: Boolean,
     loading: Boolean,
-    actionLoadingMap: Object
+    actionLoadingMap: Object,
+    customSlots: Object
   },
   setup(e) {
-    const s = e, y = [k, s.tbodyClass], x = g(() => {
-      var o;
-      let t = ((o = s.headers) == null ? void 0 : o.length) || 0;
-      return s.showSelect && (t += 1), s.showExpand && (t += 1), s.hasActions && (t += 1), t;
+    const o = e, y = [k, o.tbodyClass], x = w(() => {
+      var a;
+      let t = ((a = o.headers) == null ? void 0 : a.length) || 0;
+      return o.showSelect && (t += 1), o.showExpand && (t += 1), o.hasActions && (t += 1), t;
     });
-    return (t, o) => (l(), d("tbody", {
-      class: p(y)
+    return (t, a) => (d(), l("tbody", {
+      class: g(y)
     }, [
-      (l(!0), d(c, null, u(e.items, (a, n) => (l(), d(c, {
-        key: e.itemKey(a, n)
+      (d(!0), l(c, null, u(e.items, (s, n) => (d(), l(c, {
+        key: e.itemKey(s, n)
       }, [
-        E(B, h({
-          item: a,
+        b(B, h({
+          item: s,
           index: n,
           headers: e.headers,
           showExpand: e.showExpand,
           showSelect: e.showSelect,
-          "is-selected": e.isSelected(a),
-          "is-expanded": e.isExpanded(a),
+          "is-selected": e.isSelected(s),
+          "is-expanded": e.isExpanded(s),
           "has-actions": e.hasActions,
-          loading: e.actionLoadingMap[a.id] || !1
-        }, { ref_for: !0 }, t.$attrs), b({ _: 2 }, [
+          loading: e.actionLoadingMap[s.id] || !1
+        }, { ref_for: !0 }, t.$attrs, { customSlots: e.customSlots }), p({ _: 2 }, [
           u(t.$slots, (F, i) => ({
             name: i,
-            fn: C((w) => {
+            fn: C((S) => {
               var r;
               return [
-                f(t.$slots, i, h({ ref_for: !0 }, { ...w, item: a, index: n, loading: ((r = e.actionLoadingMap) == null ? void 0 : r[a.id]) || !1 }))
+                m(t.$slots, i, h({ ref_for: !0 }, { ...S, item: s, index: n, loading: ((r = e.actionLoadingMap) == null ? void 0 : r[s.id]) || !1 }))
               ];
             })
           }))
-        ]), 1040, ["item", "index", "headers", "showExpand", "showSelect", "is-selected", "is-expanded", "has-actions", "loading"]),
-        e.isExpanded(a) ? (l(), d("tr", A, [
-          m("td", { colspan: x.value }, [
-            f(t.$slots, "expand", {
-              item: a,
+        ]), 1040, ["item", "index", "headers", "showExpand", "showSelect", "is-selected", "is-expanded", "has-actions", "loading", "customSlots"]),
+        e.isExpanded(s) ? (d(), l("tr", A, [
+          f("td", { colspan: x.value }, [
+            m(t.$slots, "expand", {
+              item: s,
               index: n
             }, () => [
-              o[0] || (o[0] = m("div", { class: "text-center opacity-70 text-sm" }, "No hay contenido expandido.", -1))
+              a[0] || (a[0] = f("div", { class: "text-center opacity-70 text-sm" }, "No hay contenido expandido.", -1))
             ])
           ], 8, $)
-        ])) : S("", !0)
+        ])) : E("", !0)
       ], 64))), 128))
     ]));
   }

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

@@ -54,6 +54,7 @@ const t = () => ({
   noDataText: { type: String, default: "No hay elementos disponibles" },
   loadingText: { type: String, default: "Cargando..." },
   // Slots control
+  customSlots: Object,
   showTopSlot: { type: Boolean, default: !1 },
   showBottomSlot: { type: Boolean, default: !1 }
 });

package/package.json

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