vlite3 0.1.3 → 0.1.4

package/components/Button.vue.js

@@ -1,5 +1,5 @@
 import { defineComponent as v, useSlots as x, computed as s, withDirectives as y, openBlock as r, createElementBlock as w, normalizeClass as i, createBlock as a, createCommentVNode as u, renderSlot as p, createTextVNode as k, toDisplayString as z, unref as B } from "vue";
-import l from "./Icon.vue.js";
+import c from "./Icon.vue.js";
 import { vRipple as C } from "../directives/vRipple.js";
 const R = ["type", "disabled"], D = /* @__PURE__ */ v({
   __name: "Button",
@@ -16,8 +16,8 @@ const R = ["type", "disabled"], D = /* @__PURE__ */ v({
     rounded: { default: "md" }
   },
   setup(e) {
-    const t = e, g = x(), c = s(() => t.icon && !t.text && !g.default), h = s(() => {
-      const n = "inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 active:scale-95 cursor-pointer gap-2", d = {
+    const t = e, g = x(), l = s(() => t.icon && !t.text && !g.default), h = s(() => {
+      const n = "inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 active:scale-95 cursor-pointer gap-2", d = {
         primary: "bg-primary text-primary-foreground hover:bg-primary/90",
         "primary-light": "bg-primary-light text-primary-fg-light hover:bg-primary/20",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
@@ -62,7 +62,7 @@ const R = ["type", "disabled"], D = /* @__PURE__ */ v({
         n,
         d[t.variant],
         m[t.rounded],
-        c.value ? b[t.size] : f[t.size],
+        l.value ? b[t.size] : f[t.size],
         t.class
       ].join(" ");
     }), o = s(() => ({
@@ -77,22 +77,22 @@ const R = ["type", "disabled"], D = /* @__PURE__ */ v({
       class: i(h.value),
       disabled: e.disabled || e.loading
     }, [
-      e.loading ? (r(), a(l, {
+      e.loading ? (r(), a(c, {
         key: 0,
         icon: "lucide:loader-2",
         class: i(["animate-spin", { [o.value]: !0 }])
-      }, null, 8, ["class"])) : e.icon ? (r(), a(l, {
+      }, null, 8, ["class"])) : e.icon ? (r(), a(c, {
         key: 1,
         icon: e.icon,
         class: i({
-          "mx-auto": c.value,
+          "mx-auto": l.value,
           [o.value]: !0
         })
       }, null, 8, ["icon", "class"])) : u("", !0),
       p(n.$slots, "default", {}, () => [
         k(z(e.text), 1)
       ]),
-      e.iconRight && !e.loading ? (r(), a(l, {
+      e.iconRight && !e.loading ? (r(), a(c, {
         key: 2,
         icon: e.iconRight,
         class: i([o.value, "h-4 w-4"])

package/components/DataTable/DataTable.vue.d.ts

@@ -32,10 +32,10 @@ declare const __VLS_component: import('vue').DefineComponent<DataTableProps, {},
     "onUpdate:selectedRows"?: (value: any[]) => any;
 }>, {
     search: string;
+    variant: "default" | "raised";
     loading: boolean;
     rows: any[];
     selectable: boolean;
-    emptyMessage: string;
     showSearch: boolean;
     showItemsPerPage: boolean;
     itemsPerPage: number;
@@ -47,9 +47,12 @@ declare const __VLS_component: import('vue').DefineComponent<DataTableProps, {},
     striped: boolean;
     selectedRows: any[];
     searchPlaceholder: string;
+    emptyTitle: string;
+    emptyDescription: string;
     emptyIcon: string;
     showPagination: boolean;
     bordered: boolean;
+    sortable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/components/DataTable/DataTable.vue.js

@@ -1,7 +1,7 @@
-import a from "./DataTable.vue2.js";
+import o from "./DataTable.vue2.js";
 /* empty css               */
-import o from "../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ o(a, [["__scopeId", "data-v-45a246be"]]);
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-32de2313"]]);
 export {
   m as default
 };

package/components/DataTable/DataTable.vue2.js

@@ -1,28 +1,25 @@
-import { defineComponent as _, ref as g, computed as b, watch as p, onMounted as ee, openBlock as n, createElementBlock as i, createVNode as $, createSlots as V, withCtx as z, renderSlot as I, createBlock as j, createCommentVNode as k, createElementVNode as r, normalizeClass as E, Fragment as B, renderList as P, normalizeStyle as D, mergeProps as te, toDisplayString as le, createTextVNode as ae, unref as se } from "vue";
+import { defineComponent as ee, ref as g, computed as y, watch as p, onMounted as te, openBlock as r, createElementBlock as d, createVNode as C, createSlots as V, withCtx as T, renderSlot as S, createBlock as D, createCommentVNode as I, createElementVNode as n, normalizeClass as B, Fragment as F, renderList as $, normalizeStyle as A, mergeProps as le, toDisplayString as M, createTextVNode as ae, unref as se } from "vue";
 import oe from "../Icon.vue.js";
-import ne from "../CheckBox.vue.js";
-import re from "../Button.vue.js";
-import ie from "../ConfirmationModal.vue.js";
-import de from "../Pagination/Pagination.vue.js";
+import re from "../CheckBox.vue.js";
+import ne from "../Button.vue.js";
+import de from "../ConfirmationModal.vue.js";
+import ie from "../Pagination/Pagination.vue.js";
 import ue from "./DataTableHeader.vue.js";
 import ce from "./DataTableRow.vue.js";
 import me from "./DataTableToolbar.vue.js";
-const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve = {
-  key: 0,
-  style: { width: "48px" }
-}, ge = { class: "[&_tr]:border-b [&_tr]:border-border/70! bg-muted" }, pe = { class: "hover:bg-transparent" }, we = {
+const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve = { class: "hover:bg-transparent" }, ge = {
   key: 0,
   scope: "col",
   class: "w-[48px] px-0 text-center font-medium text-muted-foreground",
   style: { width: "48px" }
-}, ye = { class: "flex items-center justify-center" }, be = { class: "[&_tr:last-child]:border-0" }, ke = {
+}, pe = { class: "flex items-center justify-center" }, be = { class: "[&_tr:last-child]:border-0" }, we = {
   key: 0,
   class: "w-[48px] px-0 py-4 align-middle text-center",
   style: { width: "48px" }
-}, Pe = { key: 2 }, xe = ["colspan"], Ce = { class: "flex flex-col items-center justify-center gap-2 text-muted-foreground p-8" }, Se = { class: "flex h-12 w-12 items-center justify-center rounded-full bg-muted/20" }, $e = { class: "mt-2 text-base font-semibold text-foreground" }, Ie = { class: "text-sm max-w-sm mx-auto" }, Be = {
+}, ye = { key: 2 }, ke = ["colspan"], Pe = { class: "flex flex-col items-center justify-center gap-2 text-muted-foreground p-8" }, xe = { class: "flex h-12 w-12 items-center justify-center rounded-full bg-muted" }, Ce = { class: "mt-1 text-base font-semibold text-foreground" }, Se = { class: "text-sm max-w-sm mx-auto" }, Ie = {
   key: 0,
   class: "mt-4"
-}, Fe = { key: 0 }, Ae = /* @__PURE__ */ _({
+}, $e = { key: 0 }, Ve = /* @__PURE__ */ ee({
   __name: "DataTable",
   props: {
     rows: { default: () => [] },
@@ -34,7 +31,8 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
     keyField: { default: "_id" },
     loading: { type: Boolean, default: !1 },
     selectable: { type: Boolean, default: !1 },
-    emptyMessage: { default: "No data available" },
+    emptyTitle: { default: "No data available" },
+    emptyDescription: { default: "No results found. Try adjusting your filters or search terms." },
     emptyIcon: { default: "lucide:inbox" },
     showPagination: { type: Boolean, default: !0 },
     pageInfo: {},
@@ -46,265 +44,274 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
     bordered: { type: Boolean, default: !0 },
     compact: { type: Boolean, default: !1 },
     tableClass: {},
-    class: {}
+    class: {},
+    sortable: { type: Boolean, default: !1 },
+    variant: { default: "default" }
   },
   emits: ["change", "select", "rowClick", "update:itemsPerPage", "update:selectedRows", "delete"],
-  setup(s, { emit: A }) {
-    const U = (e, t) => t.split(".").reduce((l, c) => l?.[c], e), u = (e, t) => U(e, t), a = s, w = A, d = g({ field: "", order: "" }), x = g(a.itemsPerPage), h = g(a.pageInfo?.currentPage || 1), y = g(a.search || ""), C = g(!1), v = g("initial"), O = b(() => a.loading && (v.value === "initial" || v.value === "page"));
+  setup(a, { emit: U }) {
+    const O = (e, t) => t.split(".").reduce((s, c) => s?.[c], e), u = (e, t) => O(e, t), l = a, b = U, i = g({ field: "", order: "" }), k = g(l.itemsPerPage), h = g(l.pageInfo?.currentPage || 1), w = g(l.search || ""), P = g(!1), v = g("initial"), L = y(() => l.loading && (v.value === "initial" || v.value === "page"));
     p(
-      () => a.loading,
+      () => l.loading,
       (e, t) => {
         !e && t && (v.value = "idle");
       }
     ), p(
-      () => a.search,
+      () => l.search,
       (e) => {
-        e !== void 0 && e !== y.value && (y.value = e);
+        e !== void 0 && e !== w.value && (w.value = e);
       }
     );
-    let F = null;
-    p(y, (e) => {
-      F && clearTimeout(F), F = setTimeout(() => {
-        h.value = 1, v.value = "search", S();
+    let R = null;
+    p(w, (e) => {
+      R && clearTimeout(R), R = setTimeout(() => {
+        h.value = 1, v.value = "search", x();
       }, 300);
     }), p(
-      () => a.itemsPerPage,
+      () => l.itemsPerPage,
       (e) => {
-        x.value = e;
+        k.value = e;
       }
     ), p(
-      () => a.pageInfo?.currentPage,
+      () => l.pageInfo?.currentPage,
       (e) => {
         e && (h.value = e);
       }
     );
-    const M = (e) => u(e, a.keyField), o = g(/* @__PURE__ */ new Set());
+    const j = (e) => u(e, l.keyField), o = g(/* @__PURE__ */ new Set());
     p(
-      () => a.selectedRows,
+      () => l.selectedRows,
       (e) => {
-        const t = new Set((e || []).map((l) => u(l, a.keyField)));
-        (t.size !== o.value.size || [...t].some((l) => !o.value.has(l))) && (o.value = t);
+        const t = new Set((e || []).map((s) => u(s, l.keyField)));
+        (t.size !== o.value.size || [...t].some((s) => !o.value.has(s))) && (o.value = t);
       },
       { immediate: !0, deep: !0 }
     );
-    const R = b(() => a.rows.length === 0 ? !1 : a.rows.every((e) => o.value.has(u(e, a.keyField)))), N = b(() => o.value.size > 0 && !R.value), L = b(() => {
-      const e = [...a.selectedRows || [], ...a.rows], t = /* @__PURE__ */ new Map();
-      return e.forEach((l) => t.set(u(l, a.keyField), l)), Array.from(o.value).map((l) => t.get(l)).filter(Boolean);
-    }), W = (e) => {
-      e ? a.rows.forEach((t) => o.value.add(u(t, a.keyField))) : o.value.size > 0 && a.rows.forEach((t) => o.value.delete(u(t, a.keyField))), T();
-    }, q = (e) => {
-      o.value.has(e) ? o.value.delete(e) : o.value.add(e), T();
-    }, T = () => {
-      const e = a.selectedRows || [], t = /* @__PURE__ */ new Set(), l = [];
-      a.rows.forEach((m) => {
-        const f = u(m, a.keyField);
-        o.value.has(f) && (l.push(m), t.add(f));
+    const z = y(() => l.rows.length === 0 ? !1 : l.rows.every((e) => o.value.has(u(e, l.keyField)))), E = y(() => o.value.size > 0 && !z.value), W = y(() => {
+      const e = [...l.selectedRows || [], ...l.rows], t = /* @__PURE__ */ new Map();
+      return e.forEach((s) => t.set(u(s, l.keyField), s)), Array.from(o.value).map((s) => t.get(s)).filter(Boolean);
+    }), q = (e) => {
+      e ? l.rows.forEach((t) => o.value.add(u(t, l.keyField))) : o.value.size > 0 && l.rows.forEach((t) => o.value.delete(u(t, l.keyField))), N();
+    }, G = (e) => {
+      o.value.has(e) ? o.value.delete(e) : o.value.add(e), N();
+    }, N = () => {
+      const e = l.selectedRows || [], t = /* @__PURE__ */ new Set(), s = [];
+      l.rows.forEach((m) => {
+        const f = u(m, l.keyField);
+        o.value.has(f) && (s.push(m), t.add(f));
       }), e.forEach((m) => {
-        const f = u(m, a.keyField);
-        !t.has(f) && o.value.has(f) && (l.push(m), t.add(f));
+        const f = u(m, l.keyField);
+        !t.has(f) && o.value.has(f) && (s.push(m), t.add(f));
       });
       const c = {
-        selected: l,
-        all: R.value,
-        indeterminate: N.value
+        selected: s,
+        all: z.value,
+        indeterminate: E.value
       };
-      w("select", c), w("update:selectedRows", l);
-    }, G = (e) => {
-      d.value.field === e ? d.value.order === "asc" ? d.value.order = "desc" : d.value.order === "desc" ? (d.value.order = "", d.value.field = "") : d.value.order = "asc" : (d.value.field = e, d.value.order = "asc"), h.value = 1, v.value = "sort", S();
+      b("select", c), b("update:selectedRows", s);
     }, H = (e) => {
-      h.value = e, v.value = "page", S();
+      i.value.field === e ? i.value.order === "asc" ? i.value.order = "desc" : i.value.order === "desc" ? (i.value.order = "", i.value.field = "") : i.value.order = "asc" : (i.value.field = e, i.value.order = "asc"), h.value = 1, v.value = "sort", x();
     }, J = (e) => {
-      x.value = e, h.value = 1, v.value = "limit", w("update:itemsPerPage", e), S();
+      h.value = e, v.value = "page", x();
     }, K = (e) => {
-      w("rowClick", e);
-    }, Q = () => {
-      const e = L.value;
-      w("delete", e), C.value = !1;
-    }, S = () => {
-      w("change", {
+      k.value = e, h.value = 1, v.value = "limit", b("update:itemsPerPage", e), x();
+    }, Q = (e) => {
+      b("rowClick", e);
+    }, X = () => {
+      const e = W.value;
+      b("delete", e), P.value = !1;
+    }, x = () => {
+      b("change", {
         pagination: {
           page: h.value,
-          limit: x.value
+          limit: k.value
         },
-        sorting: { ...d.value },
-        search: y.value
+        sorting: { ...i.value },
+        search: w.value
       });
-    }, X = b(() => [
-      "w-full bg-background rounded border border-border/60  flex flex-col",
-      "overflow-hidden",
-      a.class
-    ].join(" ")), Y = b(() => ["w-full caption-bottom text-sm", a.tableClass].join(" ")), Z = (e) => e.width ? e.width : "auto";
+    }, Y = y(() => {
+      const e = l.variant === "raised";
+      return [
+        "w-full flex flex-col",
+        e ? "bg-background shadow-sm p-2 rounded-lg" : "bg-background rounded",
+        "overflow-hidden",
+        !e && l.bordered ? "border-b border-border/60" : "",
+        l.class
+      ].join(" ");
+    }), Z = y(() => ["w-full caption-bottom text-sm", l.tableClass].join(" ")), _ = (e) => e.width ? e.width : "auto";
     return p(
-      () => a.rows,
+      () => l.rows,
       () => {
-        const e = new Set(a.rows.map((t) => u(t, a.keyField)));
+        const e = new Set(l.rows.map((t) => u(t, l.keyField)));
         o.value = new Set([...o.value].filter((t) => e.has(t)));
       }
-    ), ee(() => {
-      S();
-    }), (e, t) => (n(), i("div", fe, [
-      $(me, {
-        modelValue: y.value,
-        "onUpdate:modelValue": t[1] || (t[1] = (l) => y.value = l),
-        "show-search": s.showSearch,
-        placeholder: s.searchPlaceholder
+    ), te(() => {
+      x();
+    }), (e, t) => (r(), d("div", fe, [
+      C(me, {
+        modelValue: w.value,
+        "onUpdate:modelValue": t[1] || (t[1] = (s) => w.value = s),
+        "show-search": a.showSearch,
+        placeholder: a.searchPlaceholder
       }, V({ _: 2 }, [
         e.$slots?.["toolbar-left"] ? {
           name: "left",
-          fn: z(() => [
-            I(e.$slots, "toolbar-left", {}, void 0, !0)
+          fn: T(() => [
+            S(e.$slots, "toolbar-left", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
         e.$slots?.["toolbar-right"] || o.value.size > 0 ? {
           name: "right",
-          fn: z(() => [
-            o.value.size > 0 ? (n(), j(re, {
+          fn: T(() => [
+            o.value.size > 0 ? (r(), D(ne, {
               key: 0,
               rounded: "full",
               variant: "ghost",
               icon: "lucide:trash-2",
               class: "text-destructive! bg-destructive/10 hover:bg-destructive/15",
-              onClick: t[0] || (t[0] = (l) => C.value = !0)
-            })) : k("", !0),
-            I(e.$slots, "toolbar-right", {}, void 0, !0)
+              onClick: t[0] || (t[0] = (s) => P.value = !0)
+            })) : I("", !0),
+            S(e.$slots, "toolbar-right", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0
       ]), 1032, ["modelValue", "show-search", "placeholder"]),
-      r("div", {
-        class: E(X.value)
+      n("div", {
+        class: B(Y.value)
       }, [
-        r("div", he, [
-          r("table", {
-            class: E(Y.value)
+        n("div", he, [
+          n("table", {
+            class: B([Z.value, ""])
           }, [
-            r("colgroup", null, [
-              s.selectable ? (n(), i("col", ve)) : k("", !0),
-              (n(!0), i(B, null, P(s.headers, (l) => (n(), i("col", {
-                key: l.field,
-                style: D({
-                  width: Z(l)
-                })
-              }, null, 4))), 128))
-            ]),
-            r("thead", ge, [
-              r("tr", pe, [
-                s.selectable ? (n(), i("th", we, [
-                  r("div", ye, [
-                    $(ne, {
-                      "model-value": R.value,
-                      indeterminate: N.value,
+            n("thead", {
+              class: B([
+                "[&_tr]:border-b [&_tr]:border-border/70! bg-muted",
+                a.variant === "raised" ? "[&_th:first-child]:rounded-tl-lg [&_th:last-child]:rounded-tr-lg" : ""
+              ])
+            }, [
+              n("tr", ve, [
+                a.selectable ? (r(), d("th", ge, [
+                  n("div", pe, [
+                    C(re, {
+                      "model-value": z.value,
+                      indeterminate: E.value,
                       size: "xs",
-                      "onUpdate:modelValue": W
+                      "onUpdate:modelValue": q
                     }, null, 8, ["model-value", "indeterminate"])
                   ])
-                ])) : k("", !0),
-                (n(!0), i(B, null, P(s.headers, (l) => (n(), j(ue, {
-                  key: l.field,
-                  header: l,
-                  "sort-config": d.value,
-                  compact: s.compact,
-                  onSort: G
-                }, null, 8, ["header", "sort-config", "compact"]))), 128))
+                ])) : I("", !0),
+                (r(!0), d(F, null, $(a.headers, (s) => (r(), D(ue, {
+                  key: s.field,
+                  header: s,
+                  "sort-config": i.value,
+                  compact: a.compact,
+                  "table-sortable": a.sortable,
+                  onSort: H,
+                  class: "last:pr-5!",
+                  style: A({
+                    width: _(s)
+                  })
+                }, null, 8, ["header", "sort-config", "compact", "table-sortable", "style"]))), 128))
               ])
-            ]),
-            r("tbody", be, [
-              O.value ? (n(!0), i(B, { key: 0 }, P(Math.min(x.value, 15), (l) => (n(), i("tr", {
-                key: "skeleton-" + l,
+            ], 2),
+            n("tbody", be, [
+              L.value ? (r(!0), d(F, { key: 0 }, $(Math.min(k.value, 15), (s) => (r(), d("tr", {
+                key: "skeleton-" + s,
                 class: "border-b border-border/50 bg-background transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"
               }, [
-                s.selectable ? (n(), i("td", ke, [...t[4] || (t[4] = [
-                  r("div", { class: "flex items-center justify-center" }, [
-                    r("div", { class: "h-4 w-4 rounded-[4px] bg-muted/50 animate-pulse" })
+                a.selectable ? (r(), d("td", we, [...t[4] || (t[4] = [
+                  n("div", { class: "flex items-center justify-center" }, [
+                    n("div", { class: "h-4 w-4 rounded-[4px] bg-muted/50 animate-pulse" })
                   ], -1)
-                ])])) : k("", !0),
-                (n(!0), i(B, null, P(s.headers, (c) => (n(), i("td", {
+                ])])) : I("", !0),
+                (r(!0), d(F, null, $(a.headers, (c) => (r(), d("td", {
                   key: c.field,
-                  class: E(["p-5! align-middle", [c.hideOnMobile ? "hidden md:table-cell" : ""]])
+                  class: B(["p-5! align-middle last:pr-6!", [c.hideOnMobile ? "hidden md:table-cell" : ""]])
                 }, [
-                  r("div", {
+                  n("div", {
                     class: "rounded-md bg-muted/50 animate-pulse h-4 w-full",
-                    style: D({
+                    style: A({
                       width: `${50 + Math.random() * 40}%`
                     })
                   }, null, 4)
                 ], 2))), 128))
-              ]))), 128)) : s.rows.length > 0 ? (n(!0), i(B, { key: 1 }, P(s.rows, (l, c) => (n(), j(ce, {
-                key: M(l),
-                row: l,
-                headers: s.headers,
+              ]))), 128)) : a.rows.length > 0 ? (r(!0), d(F, { key: 1 }, $(a.rows, (s, c) => (r(), D(ce, {
+                key: j(s),
+                row: s,
+                headers: a.headers,
                 index: c,
-                "key-field": s.keyField,
-                selectable: s.selectable,
-                "is-selected": o.value.has(M(l)),
-                hoverable: s.hoverable,
-                striped: s.striped,
-                compact: s.compact,
-                onSelect: q,
-                onRowClick: K
+                "key-field": a.keyField,
+                selectable: a.selectable,
+                "is-selected": o.value.has(j(s)),
+                hoverable: a.hoverable,
+                striped: a.striped,
+                compact: a.compact,
+                onSelect: G,
+                onRowClick: Q,
+                class: "[&_td:last-child]:pr-3.5!"
               }, V({ _: 2 }, [
-                P(s.headers, (m) => ({
+                $(a.headers, (m) => ({
                   name: m.field,
-                  fn: z((f) => [
-                    I(e.$slots, m.field, te({ ref_for: !0 }, f), void 0, !0)
+                  fn: T((f) => [
+                    S(e.$slots, m.field, le({ ref_for: !0 }, f), void 0, !0)
                   ])
                 }))
-              ]), 1032, ["row", "headers", "index", "key-field", "selectable", "is-selected", "hoverable", "striped", "compact"]))), 128)) : (n(), i("tr", Pe, [
-                r("td", {
-                  colspan: s.selectable ? s.headers.length + 1 : s.headers.length,
+              ]), 1032, ["row", "headers", "index", "key-field", "selectable", "is-selected", "hoverable", "striped", "compact"]))), 128)) : (r(), d("tr", ye, [
+                n("td", {
+                  colspan: a.selectable ? a.headers.length + 1 : a.headers.length,
                   class: "h-96 text-center align-middle hover:bg-transparent"
                 }, [
-                  r("div", Ce, [
-                    r("div", Se, [
-                      $(oe, {
-                        icon: s.emptyIcon,
+                  n("div", Pe, [
+                    n("div", xe, [
+                      C(oe, {
+                        icon: a.emptyIcon,
                         class: "h-6 w-6 text-muted-foreground/80"
                       }, null, 8, ["icon"])
                     ]),
-                    r("h3", $e, le(s.emptyMessage), 1),
-                    r("p", Ie, [
-                      I(e.$slots, "empty-description", {}, () => [
-                        t[5] || (t[5] = ae(" No results found. Try adjusting your filters or search terms. ", -1))
+                    n("h3", Ce, M(a.emptyTitle), 1),
+                    n("p", Se, [
+                      S(e.$slots, "empty-description", {}, () => [
+                        ae(M(a.emptyDescription), 1)
                       ], !0)
                     ]),
-                    e.$slots["empty-action"] ? (n(), i("div", Be, [
-                      I(e.$slots, "empty-action", {}, void 0, !0)
-                    ])) : k("", !0)
+                    e.$slots["empty-action"] ? (r(), d("div", Ie, [
+                      S(e.$slots, "empty-action", {}, void 0, !0)
+                    ])) : I("", !0)
                   ])
-                ], 8, xe)
+                ], 8, ke)
               ]))
             ])
           ], 2)
         ])
       ], 2),
-      s.showPagination && s.pageInfo ? (n(), i("div", Fe, [
-        $(se(de), {
+      a.showPagination && a.pageInfo && a.pageInfo.totalItems > 0 ? (r(), d("div", $e, [
+        C(se(ie), {
           "current-page": h.value,
-          "total-pages": s.pageInfo.totalPages,
+          "total-pages": a.pageInfo.totalPages,
           "show-page-info": !1,
-          "show-items-per-page": s.showItemsPerPage,
-          "items-per-page": x.value,
-          "items-per-page-options": s.itemsPerPageOptions,
+          "show-items-per-page": a.showItemsPerPage,
+          "items-per-page": k.value,
+          "items-per-page-options": a.itemsPerPageOptions,
           "nav-type": "icon",
-          onChange: H,
-          "onUpdate:itemsPerPage": J
+          onChange: J,
+          "onUpdate:itemsPerPage": K
         }, null, 8, ["current-page", "total-pages", "show-items-per-page", "items-per-page", "items-per-page-options"])
-      ])) : k("", !0),
-      $(ie, {
-        show: C.value,
-        "onUpdate:show": t[2] || (t[2] = (l) => C.value = l),
+      ])) : I("", !0),
+      C(de, {
+        show: P.value,
+        "onUpdate:show": t[2] || (t[2] = (s) => P.value = s),
         title: "Confirm Deletion",
         description: "Are you sure you want to delete the selected items?",
         "confirm-text": "Delete",
         "cancel-text": "Cancel",
         variant: "danger",
-        onConfirm: Q,
-        onCancel: t[3] || (t[3] = (l) => C.value = !1)
+        onConfirm: X,
+        onCancel: t[3] || (t[3] = (s) => P.value = !1)
       }, null, 8, ["show"])
     ]));
   }
 });
 export {
-  Ae as default
+  Ve as default
 };

package/components/DataTable/DataTableHeader.vue.d.ts

@@ -3,6 +3,7 @@ interface Props {
     header: TableHeader;
     sortConfig?: SortConfig;
     compact?: boolean;
+    tableSortable?: boolean;
 }
 declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     sort: (field: string) => any;
@@ -10,5 +11,6 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
     onSort?: (field: string) => any;
 }>, {
     compact: boolean;
+    tableSortable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLTableCellElement>;
 export default _default;