vs-datatable 0.5.0 → 0.6.0

package/dist/vs-datatable.es.js

@@ -1,49 +1,56 @@
-import { defineComponent as L, computed as C, createElementBlock as g, openBlock as f, createElementVNode as n, createCommentVNode as R, Fragment as A, renderList as B, normalizeClass as S, toDisplayString as p, unref as c, ref as H, watch as F, useAttrs as W, onMounted as X, onUnmounted as Y, onBeforeMount as q, createVNode as z, renderSlot as K, isRef as N, normalizeStyle as ee, withModifiers as te, createTextVNode as se } from "vue";
-import './index.css';function E(e, l) {
-  return l.split(".").reduce((s, t) => s?.[t], e) ?? "";
+import { defineComponent as K, computed as C, createElementBlock as f, openBlock as b, createElementVNode as n, createCommentVNode as x, Fragment as M, renderList as B, normalizeClass as V, toDisplayString as P, unref as d, ref as L, watch as F, useAttrs as W, onMounted as X, onUnmounted as Y, onBeforeMount as q, createVNode as z, renderSlot as A, isRef as N, normalizeStyle as ee, withModifiers as te, createTextVNode as se } from "vue";
+import './index.css';function E(e, s) {
+  return s.split(".").reduce((l, t) => l?.[t], e) ?? "";
 }
-function k(e, l, s = "id") {
-  return typeof s == "function" ? s(e, l) : e[s] || l;
+function k(e, s, l = "id") {
+  return typeof l == "function" ? l(e, s) : e[l] || s;
 }
-function Z(e, l, s = "id") {
-  return l.some(
-    (t) => k(t, -1, s) === k(e, -1, s)
+function Z(e, s, l = "id") {
+  return s.some(
+    (t) => k(t, -1, l) === k(e, -1, l)
   );
 }
-function le(e, l) {
-  return e.length + (l ? 1 : 0);
+function le(e, s) {
+  return e.length + (s ? 1 : 0);
 }
-function ae(e, l) {
-  if (!l.length) return e;
-  const s = (t, i) => i.split(".").reduce((r, o) => r?.[o], t) ?? "";
-  return [...e].sort((t, i) => {
-    for (const { field: r, order: o } of l) {
-      const h = s(t, r), v = s(i, r);
-      if (h !== v)
-        return o === "asc" ? h > v ? 1 : -1 : h < v ? 1 : -1;
+function ae(e, s) {
+  if (!s.length) return e;
+  const l = (t, r) => r.split(".").reduce((a, c) => a?.[c], t) ?? "";
+  return [...e].sort((t, r) => {
+    for (const { field: a, order: c } of s) {
+      const i = l(t, a), g = l(r, a);
+      if (i !== g)
+        return c === "asc" ? i > g ? 1 : -1 : i < g ? 1 : -1;
     }
     return 0;
   });
 }
-function oe(e, l, s) {
-  if (!s) return e;
-  const t = (l - 1) * s, i = t + s;
-  return e.slice(t, i);
+function oe(e, s, l) {
+  if (!l) return e;
+  const t = (s - 1) * l, r = t + l;
+  return e.slice(t, r);
 }
-function ne(e, l, s) {
-  const t = (e - 1) * l + 1, i = Math.min(e * l, s);
-  return { start: t, end: i };
+function ne(e, s, l) {
+  const t = (e - 1) * s + 1, r = Math.min(e * s, l);
+  return { start: t, end: r };
 }
-function j(e, l) {
-  return Math.ceil(e / l);
+function Q(e, s) {
+  return Math.ceil(e / s);
 }
-const re = ["id"], ce = ["disabled"], de = {
+function re(e, s, l) {
+  if (!s || s.trim() === "") return e;
+  const t = s.toLowerCase();
+  return e.filter((r) => Object.values(r).some(
+    (a) => String(a ?? "").toLowerCase().includes(t)
+  ));
+}
+const de = ["id"], ce = ["disabled"], ie = {
   key: 1,
   class: "vs-pagination-ellipsis"
-}, ie = ["id", "onClick"], ue = {
+}, ue = ["id", "onClick"], ve = {
   key: 2,
   class: "vs-pagination-ellipsis"
-}, ve = ["disabled"], he = /* @__PURE__ */ L({
+}, he = ["disabled"], ge = /* @__PURE__ */ K({
   __name: "VsPagination",
   props: {
     modelValue: {},
@@ -54,85 +61,85 @@ const re = ["id"], ce = ["disabled"], de = {
     paginationClass: {}
   },
   emits: ["update:modelValue", "page-changed"],
-  setup(e, { emit: l }) {
-    const s = e, t = l, i = s.maxVisible ?? 3, r = C({
-      get: () => s.modelValue,
-      set: (d) => {
-        t("update:modelValue", d), t("page-changed", d);
+  setup(e, { emit: s }) {
+    const l = e, t = s, r = l.maxVisible ?? 3, a = C({
+      get: () => l.modelValue,
+      set: (m) => {
+        t("update:modelValue", m), t("page-changed", m);
       }
-    }), o = C(() => r.value <= Math.floor(i / 2) ? 1 : r.value >= v.value - Math.floor(i / 2) ? Math.max(v.value - i + 1, 1) : r.value - Math.floor(i / 2)), h = C(() => Math.min(o.value + i - 1, v.value)), v = C(() => j(s.totalRecords, s.rowsPerPage)), y = C(() => {
-      const d = [];
-      for (let m = o.value; m <= h.value; m++)
-        d.push(m);
-      return d;
-    }), T = (d) => {
-      d >= 1 && d <= v.value && (r.value = d);
-    }, M = () => {
-      r.value > 1 && r.value--;
+    }), c = C(() => a.value <= Math.floor(r / 2) ? 1 : a.value >= g.value - Math.floor(r / 2) ? Math.max(g.value - r + 1, 1) : a.value - Math.floor(r / 2)), i = C(() => Math.min(c.value + r - 1, g.value)), g = C(() => Q(l.totalRecords, l.rowsPerPage)), S = C(() => {
+      const m = [];
+      for (let u = c.value; u <= i.value; u++)
+        m.push(u);
+      return m;
+    }), y = (m) => {
+      m >= 1 && m <= g.value && (a.value = m);
+    }, O = () => {
+      a.value > 1 && a.value--;
     }, D = () => {
-      r.value < v.value && r.value++;
+      a.value < g.value && a.value++;
     };
-    return (d, m) => (f(), g("div", {
+    return (m, u) => (b(), f("div", {
       class: "vs-pagination",
       id: e.tablename + "-pagination"
     }, [
       n("button", {
-        onClick: M,
+        onClick: O,
         type: "button",
         class: "vs-pagination-button vs-pagination-nav",
-        disabled: r.value === 1
+        disabled: a.value === 1
       }, " ‹‹ ", 8, ce),
-      o.value > 1 ? (f(), g("button", {
+      c.value > 1 ? (b(), f("button", {
         key: 0,
         type: "button",
         class: "vs-pagination-button",
-        onClick: m[0] || (m[0] = (a) => T(1))
-      }, " 1 ")) : R("", !0),
-      o.value > 2 ? (f(), g("span", de, "...")) : R("", !0),
-      (f(!0), g(A, null, B(y.value, (a) => (f(), g("button", {
-        key: a,
+        onClick: u[0] || (u[0] = (o) => y(1))
+      }, " 1 ")) : x("", !0),
+      c.value > 2 ? (b(), f("span", ie, "...")) : x("", !0),
+      (b(!0), f(M, null, B(S.value, (o) => (b(), f("button", {
+        key: o,
         type: "button",
-        class: S([
+        class: V([
           "vs-pagination-button",
-          { "vs-active": r.value === a }
+          { "vs-active": a.value === o }
         ]),
-        id: e.tablename + "-page-" + a,
-        onClick: (b) => T(a)
-      }, p(a), 11, ie))), 128)),
-      h.value < v.value - 1 ? (f(), g("span", ue, "...")) : R("", !0),
-      h.value < v.value ? (f(), g("button", {
+        id: e.tablename + "-page-" + o,
+        onClick: (v) => y(o)
+      }, P(o), 11, ue))), 128)),
+      i.value < g.value - 1 ? (b(), f("span", ve, "...")) : x("", !0),
+      i.value < g.value ? (b(), f("button", {
         key: 3,
         type: "button",
         class: "vs-pagination-button",
-        onClick: m[1] || (m[1] = (a) => T(v.value))
-      }, p(v.value), 1)) : R("", !0),
+        onClick: u[1] || (u[1] = (o) => y(g.value))
+      }, P(g.value), 1)) : x("", !0),
       n("button", {
         onClick: D,
         type: "button",
         class: "vs-pagination-button vs-pagination-nav",
-        disabled: r.value === v.value
-      }, " ›› ", 8, ve)
-    ], 8, re));
+        disabled: a.value === g.value
+      }, " ›› ", 8, he)
+    ], 8, de));
   }
-}), Q = (e, l) => {
-  const s = e.__vccOpts || e;
-  for (const [t, i] of l)
-    s[t] = i;
-  return s;
-}, ge = /* @__PURE__ */ Q(he, [["__scopeId", "data-v-dd26d1ca"]]), fe = { class: "vs-search" }, be = ["placeholder", "value"], me = /* @__PURE__ */ L({
+}), U = (e, s) => {
+  const l = e.__vccOpts || e;
+  for (const [t, r] of s)
+    l[t] = r;
+  return l;
+}, fe = /* @__PURE__ */ U(ge, [["__scopeId", "data-v-dd26d1ca"]]), be = { class: "vs-search" }, me = ["placeholder", "value"], we = /* @__PURE__ */ K({
   __name: "VsSearch",
   props: {
     modelValue: {},
     placeholder: {}
   },
   emits: ["update:modelValue", "input-typed"],
-  setup(e, { emit: l }) {
-    const s = l, t = (i) => {
-      const r = i.target;
-      s("update:modelValue", r.value), s("input-typed", r.value);
+  setup(e, { emit: s }) {
+    const l = s, t = (r) => {
+      const a = r.target;
+      l("update:modelValue", a.value), l("input-typed", a.value);
     };
-    return (i, r) => (f(), g("div", fe, [
-      r[0] || (r[0] = n("div", { class: "vs-search-icon" }, [
+    return (r, a) => (b(), f("div", be, [
+      a[0] || (a[0] = n("div", { class: "vs-search-icon" }, [
         n("svg", {
           viewBox: "0 0 24 24",
           fill: "currentColor"
@@ -146,233 +153,239 @@ const re = ["id"], ce = ["disabled"], de = {
         placeholder: e.placeholder,
         value: e.modelValue,
         onInput: t
-      }, null, 40, be)
+      }, null, 40, me)
     ]));
   }
-}), we = { class: "vs-rows-per-page" }, ye = ["value"], Ce = ["value"], ke = /* @__PURE__ */ L({
+}), ye = { class: "vs-rows-per-page" }, pe = ["value"], Ce = ["value"], ke = /* @__PURE__ */ K({
   __name: "VsRowsPerPage",
   props: {
     modelValue: {},
     options: {}
   },
   emits: ["update:modelValue", "rows-per-page-changed"],
-  setup(e, { emit: l }) {
-    const s = e, t = l, i = s.options ?? [10, 25, 50, 100], r = (o) => {
-      const h = Number(o.target.value);
-      t("update:modelValue", h), t("rows-per-page-changed", h);
+  setup(e, { emit: s }) {
+    const l = e, t = s, r = l.options ?? [10, 25, 50, 100], a = (c) => {
+      const i = Number(c.target.value);
+      t("update:modelValue", i), t("rows-per-page-changed", i);
     };
-    return (o, h) => (f(), g("div", we, [
-      h[0] || (h[0] = n("span", { class: "vs-rows-label" }, "Items Per Page", -1)),
+    return (c, i) => (b(), f("div", ye, [
+      i[0] || (i[0] = n("span", { class: "vs-rows-label" }, "Items Per Page", -1)),
       n("select", {
         class: "vs-items-dropdown",
         value: e.modelValue,
-        onChange: r
+        onChange: a
       }, [
-        (f(!0), g(A, null, B(c(i), (v) => (f(), g("option", {
-          key: v,
-          value: v
-        }, p(v), 9, Ce))), 128))
-      ], 40, ye)
+        (b(!0), f(M, null, B(d(r), (g) => (b(), f("option", {
+          key: g,
+          value: g
+        }, P(g), 9, Ce))), 128))
+      ], 40, pe)
     ]));
   }
-}), pe = /* @__PURE__ */ Q(ke, [["__scopeId", "data-v-dd11bb0e"]]);
-function Pe(e, l, s, t) {
-  const i = H(1), r = H(e.sort ?? []);
+}), Pe = /* @__PURE__ */ U(ke, [["__scopeId", "data-v-dd11bb0e"]]);
+function Se(e, s, l, t, r) {
+  const a = L(1), c = L(e.sort ?? []);
   F(
     () => e.sort,
-    (d) => {
-      d && (r.value = [...d]);
+    (u) => {
+      u && (c.value = [...u]);
     },
     { deep: !0 }
   );
-  const o = C(
-    () => e.serverOptions?.sort ?? r.value ?? []
+  const i = C(
+    () => e.serverOptions?.sort ?? c.value ?? []
   );
   return {
     sortedRows: C(() => {
-      let d = e.rows;
-      return o.value.length && (d = ae(e.rows, o.value)), e.rowsPerPage && (d = oe(d, s.value, t.value)), d;
+      let u = e.rows;
+      return r.value && (u = re(u, r.value)), i.value.length && (u = ae(u, i.value)), e.rowsPerPage && (u = oe(u, l.value, t.value)), u;
     }),
-    activeSort: o,
+    activeSort: i,
     sortHelpers: {
-      isColumnSorted: (d) => o.value.some((m) => m.field === d),
-      getSortPriority: (d) => {
-        const m = o.value.find((a) => a.field === d);
-        return m ? m.priority ?? null : null;
+      isColumnSorted: (u) => i.value.some((o) => o.field === u),
+      getSortPriority: (u) => {
+        const o = i.value.find((v) => v.field === u);
+        return o ? o.priority ?? null : null;
       },
-      getSortOrder: (d) => o.value.find((m) => m.field === d)?.order ?? null,
-      handleSort: (d, m) => {
-        let a = [];
-        e.serverOptions ? a = [...e.serverOptions.sort ?? []] : e.sort && (a = [...e.sort]);
-        const b = a.findIndex((P) => P.field === d);
-        m.shiftKey ? b === -1 ? a.push({ field: d, order: "asc" }) : a[b]?.order === "asc" ? a[b].order = "desc" : a.splice(b, 1) : b === -1 ? a = [{ field: d, order: "asc" }] : a[b]?.order === "asc" ? a = [{ field: d, order: "desc" }] : a = [], a = a.map((P, V) => ({ ...P, priority: V + 1 })), e.serverOptions ? l("update:serverOptions", { ...e.serverOptions, sort: a }) : l("update:sort", a), s.value = i.value, l("sort-changed", { sort: a });
+      getSortOrder: (u) => i.value.find((o) => o.field === u)?.order ?? null,
+      handleSort: (u, o) => {
+        let v = [];
+        e.serverOptions ? v = [...e.serverOptions.sort ?? []] : e.sort && (v = [...e.sort]);
+        const p = v.findIndex((R) => R.field === u);
+        o.shiftKey ? p === -1 ? v.push({ field: u, order: "asc" }) : v[p]?.order === "asc" ? v[p].order = "desc" : v.splice(p, 1) : p === -1 ? v = [{ field: u, order: "asc" }] : v[p]?.order === "asc" ? v = [{ field: u, order: "desc" }] : v = [], v = v.map((R, T) => ({ ...R, priority: T + 1 })), e.serverOptions ? s("update:serverOptions", { ...e.serverOptions, sort: v }) : s("update:sort", v), l.value = a.value, s("sort-changed", { sort: v });
       }
     }
   };
 }
-function Se(e, l, s, t) {
-  const i = C({
-    get: () => e.serverItemsLength !== void 0 ? e.serverItemsLength : e.rows.length,
+function Re(e, s, l, t, r) {
+  const a = C({
+    get: () => e.serverItemsLength !== void 0 ? e.serverItemsLength : r.value.length,
     set: (y) => {
-      e.serverItemsLength !== void 0 && l("update:serverItemsLength", y);
+      e.serverItemsLength !== void 0 && s("update:serverItemsLength", y);
     }
-  }), r = C({
-    get: () => e.serverOptions?.page ?? s.value,
+  }), c = C({
+    get: () => e.serverOptions?.page ?? l.value,
     set: (y) => {
-      e.serverOptions ? l("update:serverOptions", { ...e.serverOptions, page: y }) : s.value = y;
+      e.serverOptions ? s("update:serverOptions", { ...e.serverOptions, page: y }) : l.value = y;
     }
-  }), o = C(() => {
+  }), i = C(() => {
     const y = t.value;
-    return ne(s.value, y, i.value);
-  }), h = (y) => {
-    e.serverOptions && l("update:serverOptions", { ...e.serverOptions, page: y }), l("page-updated", y);
+    return ne(l.value, y, a.value);
+  }), g = (y) => {
+    e.serverOptions && s("update:serverOptions", { ...e.serverOptions, page: y }), s("page-updated", y);
   };
   return {
-    currentPage: r,
-    totalRecords: i,
-    recordRange: o,
-    handlePageChange: h,
+    currentPage: c,
+    totalRecords: a,
+    recordRange: i,
+    handlePageChange: g,
     paginationHelpers: {
-      page: s,
-      totalRecords: i,
-      recordRange: o,
-      handlePageChange: h
+      page: l,
+      totalRecords: a,
+      recordRange: i,
+      handlePageChange: g
     }
   };
 }
-function Re(e, l, s, t) {
-  const i = C({
+function Ve(e, s, l, t) {
+  const r = C({
     get: () => t.value,
-    set: (o) => t.value = o
+    set: (c) => t.value = c
   });
-  return F(t, (o) => {
-    const h = e.serverItemsLength ?? e.rows.length, v = j(h, o);
-    s.value > v ? s.value = v || 1 : s.value < 1 && (s.value = 1);
+  return F(t, (c) => {
+    const i = e.serverItemsLength ?? e.rows.length, g = Q(i, c);
+    l.value > g ? l.value = g || 1 : l.value < 1 && (l.value = 1);
   }), {
-    vsRowsPerPage: i,
-    handleRowsPerPage: (o) => {
-      t.value = o, l("rows-per-page-changed", o);
+    vsRowsPerPage: r,
+    handleRowsPerPage: (c) => {
+      t.value = c, s("rows-per-page-changed", c);
     }
   };
 }
-function Ve(e, l) {
-  const s = H(1), t = H(e.serverOptions?.rowsPerPage ?? e.rowsPerPage), { totalRecords: i, recordRange: r, handlePageChange: o } = Se(e, l, s, t), { handleRowsPerPage: h } = Re(e, l, s, t), { sortedRows: v, sortHelpers: y } = Pe(e, l, s, t);
+function xe(e, s) {
+  const l = (c) => {
+    s.value = c, e("input-typed", c);
+  };
   return {
-    page: s,
-    rowsPerPage: t,
+    searchQuery: s,
+    onInputTyped: l,
+    clearSearch: () => {
+      s.value = "", e("input-typed", "");
+    },
+    setSearchQuery: (c) => {
+      s.value = c, e("input-typed", c);
+    },
+    searchHelpers: {
+      searchQuery: s,
+      onInputTyped: l
+    }
+  };
+}
+function Te(e, s) {
+  const l = L(1), t = L(e.serverOptions?.rowsPerPage ?? e.rowsPerPage), r = L(""), { sortedRows: a, sortHelpers: c } = Se(e, s, l, t, r), { totalRecords: i, recordRange: g, handlePageChange: S } = Re(e, s, l, t, a), { handleRowsPerPage: y } = Ve(e, s, l, t), { onInputTyped: O } = xe(s, r);
+  return {
+    //Pagination
+    page: l,
     totalRecords: i,
-    recordRange: r,
-    handlePageChange: o,
-    handleRowsPerPage: h,
-    sortedRows: v,
-    sortHelpers: y
+    recordRange: g,
+    handlePageChange: S,
+    //Row Per Page
+    rowsPerPage: t,
+    handleRowsPerPage: y,
+    //Sort
+    sortedRows: a,
+    sortHelpers: c,
+    //Search
+    searchQuery: r,
+    onInputTyped: O
   };
 }
-function xe(e, l) {
-  const s = H(e.itemSelected || []);
+function $e(e, s) {
+  const l = L(e.itemSelected || []);
   F(
     () => e.itemSelected,
-    (a) => {
-      a ? s.value = [...a] : s.value = [];
+    (o) => {
+      o ? l.value = [...o] : l.value = [];
     },
     { immediate: !0, deep: !0 }
   );
   const t = C({
-    get: () => s.value,
-    set: (a) => {
-      s.value = a, l("update:itemSelected", a);
+    get: () => l.value,
+    set: (o) => {
+      l.value = o, s("update:itemSelected", o);
     }
-  }), i = C(() => e.itemSelected !== null), r = C(
+  }), r = C(() => e.itemSelected !== null), a = C(
     () => e.rows.length > 0 && t.value.length === e.rows.length
-  ), o = C(() => !e.rows.length || !t.value.length ? !1 : !r.value && e.rows.some(
-    (a, b) => t.value.some(
-      (P, V) => k(P, V, e.rowKey) === k(a, b, e.rowKey)
+  ), c = C(() => !e.rows.length || !t.value.length ? !1 : !a.value && e.rows.some(
+    (o, v) => t.value.some(
+      (p, R) => k(p, R, e.rowKey) === k(o, v, e.rowKey)
     )
-  )), h = (a, b) => {
-    const P = k(a, b, e.rowKey);
+  )), i = (o, v) => {
+    const p = k(o, v, e.rowKey);
     t.value.some(
-      (I, O) => k(I, O, e.rowKey) === P
+      (T, H) => k(T, H, e.rowKey) === p
     ) ? (t.value = t.value.filter(
-      (I, O) => k(I, O, e.rowKey) !== P
-    ), l("row-deselected", a, b)) : (t.value = [...t.value, a], l("row-selected", a, b));
-  }, v = (a) => {
-    const b = a.target;
-    t.value = b.checked ? [...e.rows] : [], l("all-rows-selected", t.value);
+      (T, H) => k(T, H, e.rowKey) !== p
+    ), s("row-deselected", o, v)) : (t.value = [...t.value, o], s("row-selected", o, v));
+  }, g = (o) => {
+    const v = o.target;
+    t.value = v.checked ? [...e.rows] : [], s("all-rows-selected", t.value);
   };
   return {
     selectedItems: t,
-    isItemSelectedControlled: i,
-    isAllChecked: r,
-    isSomeChecked: o,
-    toggleRow: h,
-    toggleAll: v,
-    selectRow: (a, b) => {
-      Z(a, t.value, e.rowKey) || (t.value = [...t.value, a], l("row-selected", a, b));
+    isItemSelectedControlled: r,
+    isAllChecked: a,
+    isSomeChecked: c,
+    toggleRow: i,
+    toggleAll: g,
+    selectRow: (o, v) => {
+      Z(o, t.value, e.rowKey) || (t.value = [...t.value, o], s("row-selected", o, v));
     },
-    deselectRow: (a, b) => {
-      const P = k(a, b, e.rowKey);
+    deselectRow: (o, v) => {
+      const p = k(o, v, e.rowKey);
       t.value = t.value.filter(
-        (V, I) => k(V, I, e.rowKey) !== P
-      ), l("row-deselected", a, b);
+        (R, T) => k(R, T, e.rowKey) !== p
+      ), s("row-deselected", o, v);
     },
     selectAll: () => {
-      t.value = [...e.rows], l("all-rows-selected", t.value);
+      t.value = [...e.rows], s("all-rows-selected", t.value);
     },
     deselectAll: () => {
-      t.value = [], l("all-rows-selected", []);
+      t.value = [], s("all-rows-selected", []);
     },
     clearSelection: () => {
       t.value = [];
     },
     selectionHelpers: {
       selectedItems: t,
-      isItemSelectedControlled: i,
-      isAllChecked: r,
-      isSomeChecked: o,
-      toggleRow: h,
-      toggleAll: v
-    }
-  };
-}
-function $e(e) {
-  const l = H(""), s = (o) => {
-    l.value = o, e("input-typed", o);
-  };
-  return {
-    searchQuery: l,
-    onInputTyped: s,
-    clearSearch: () => {
-      l.value = "", e("input-typed", "");
-    },
-    setSearchQuery: (o) => {
-      l.value = o, e("input-typed", o);
-    },
-    searchHelpers: {
-      searchQuery: l,
-      onInputTyped: s
+      isItemSelectedControlled: r,
+      isAllChecked: a,
+      isSomeChecked: c,
+      toggleRow: i,
+      toggleAll: g
     }
   };
 }
-const Te = { class: "vs-datatable" }, Ie = {
+const Ie = { class: "vs-datatable" }, Oe = {
   key: 0,
   class: "vs-search-container"
-}, Oe = {
+}, _e = {
   ref: "tableResponsiveRef",
   class: "vs-table-wrapper"
-}, _e = {
+}, De = {
   key: 0,
   class: "vs-checkbox-column",
   style: { width: "5%" }
-}, De = { class: "vs-checkbox" }, He = ["id", "checked", "indeterminate"], Me = ["for"], Ae = ["onClick"], Be = { class: "vs-header-content" }, Ke = { class: "vs-header-label" }, Le = {
+}, He = { class: "vs-checkbox" }, Le = ["id", "checked", "indeterminate"], Me = ["for"], Be = ["onClick"], Ae = { class: "vs-header-content" }, Ke = { class: "vs-header-label" }, ze = {
   key: 0,
   class: "vs-sort-icons"
-}, ze = {
+}, Ne = {
   key: 1,
   class: "vs-sort-priority"
-}, Ne = { key: 0 }, Fe = ["colspan"], Qe = { key: 1 }, Ue = ["colspan"], Ee = { class: "vs-no-data-message" }, Ze = { class: "vs-no-data-description" }, je = ["onClick"], Ge = { class: "vs-checkbox" }, Je = ["id", "value", "checked", "onChange"], We = ["for"], Xe = {
+}, Fe = { key: 0 }, Ue = ["colspan"], je = { key: 1 }, Ee = ["colspan"], Ze = { class: "vs-no-data-message" }, Qe = { class: "vs-no-data-description" }, Ge = ["onClick"], Je = { class: "vs-checkbox" }, We = ["id", "value", "checked", "onChange"], Xe = ["for"], Ye = {
   key: 1,
   class: "vs-table-footer"
-}, Ye = { class: "vs-footer-left" }, qe = { class: "vs-table-info" }, et = /* @__PURE__ */ L({
+}, qe = { class: "vs-footer-left" }, et = { class: "vs-table-info" }, tt = /* @__PURE__ */ K({
   __name: "VsDataTable",
   props: {
     rows: { default: () => [] },
@@ -385,16 +398,16 @@ const Te = { class: "vs-datatable" }, Ie = {
     headerText: { default: "" },
     loading: { type: Boolean, default: !1 },
     columns: {},
-    showSearch: { type: Boolean, default: !0 },
     tableClass: {},
     rowClass: {},
     showFooter: { type: Boolean, default: !0 },
     containerClass: {},
     headerClass: {},
     cellClass: {},
+    showSearch: { type: Boolean, default: !0 },
     searchClass: {},
-    paginationClass: {},
     searchPlaceholder: { default: "Search..." },
+    paginationClass: {},
     loadingText: { default: "Loading..." },
     noDataText: { default: "No data available" },
     noDataDescription: { default: "Try adjusting your search criteria" },
@@ -404,30 +417,32 @@ const Te = { class: "vs-datatable" }, Ie = {
     rowKey: { type: [String, Function], default: "id" }
   },
   emits: ["update:itemSelected", "update:serverItemsLength", "update:serverOptions", "update:sort", "input-typed", "page-updated", "sort-changed", "row-click", "row-selected", "row-deselected", "all-rows-selected", "table:mounted", "table:unmounted", "table:before-mount", "data-loaded", "data-error"],
-  setup(e, { emit: l }) {
-    const s = e, t = l, i = W(), r = C(() => !!i.onRowClick), {
-      page: o,
-      rowsPerPage: h,
-      totalRecords: v,
-      recordRange: y,
-      handlePageChange: T,
-      handleRowsPerPage: M,
+  setup(e, { emit: s }) {
+    const l = e, t = s, r = W(), a = C(() => !!r.onRowClick), {
+      page: c,
+      rowsPerPage: i,
+      totalRecords: g,
+      recordRange: S,
+      handlePageChange: y,
+      handleRowsPerPage: O,
       sortedRows: D,
-      sortHelpers: d
-    } = Ve(s, t), {
-      selectedItems: m,
-      isItemSelectedControlled: a,
-      isAllChecked: b,
-      isSomeChecked: P,
-      toggleAll: V,
-      toggleRow: I
-    } = xe(s, t), { searchQuery: O, onInputTyped: G } = $e(t), U = C(
-      () => le(s.columns, a.value)
+      sortHelpers: m,
+      searchQuery: u,
+      onInputTyped: o
+    } = Te(l, t), {
+      selectedItems: v,
+      isItemSelectedControlled: p,
+      isAllChecked: R,
+      isSomeChecked: T,
+      toggleAll: H,
+      toggleRow: G
+    } = $e(l, t), j = C(
+      () => le(l.columns, p.value)
     );
     return X(() => {
       t("table:mounted");
       try {
-        t("data-loaded", s.rows);
+        t("data-loaded", l.rows);
       } catch (_) {
         t("data-error", _);
       }
@@ -435,54 +450,54 @@ const Te = { class: "vs-datatable" }, Ie = {
       t("table:unmounted");
     }), q(() => {
       t("table:before-mount");
-    }), (_, w) => (f(), g("div", Te, [
-      e.showSearch ? (f(), g("div", Ie, [
-        z(me, {
-          modelValue: c(O),
-          "onUpdate:modelValue": w[0] || (w[0] = (u) => N(O) ? O.value = u : null),
-          onInputTyped: c(G),
+    }), (_, w) => (b(), f("div", Ie, [
+      e.showSearch ? (b(), f("div", Oe, [
+        z(we, {
+          modelValue: d(u),
+          "onUpdate:modelValue": w[0] || (w[0] = (h) => N(u) ? u.value = h : null),
+          onInputTyped: d(o),
           placeholder: e.searchPlaceholder,
-          class: S(e.searchClass)
+          class: V(e.searchClass)
         }, null, 8, ["modelValue", "onInputTyped", "placeholder", "class"]),
-        K(_.$slots, "filterArea", {}, void 0, !0)
-      ])) : R("", !0),
+        A(_.$slots, "filterArea", {}, void 0, !0)
+      ])) : x("", !0),
       n("div", {
-        class: S(["vs-table-container", e.containerClass])
+        class: V(["vs-table-container", e.containerClass])
       }, [
-        n("div", Oe, [
+        n("div", _e, [
           n("table", {
-            class: S(["vs-table", e.tableClass])
+            class: V(["vs-table", e.tableClass])
           }, [
             n("thead", null, [
               n("tr", null, [
-                c(a) ? (f(), g("th", _e, [
-                  n("div", De, [
+                d(p) ? (b(), f("th", De, [
+                  n("div", He, [
                     n("input", {
                       type: "checkbox",
                       id: e.tablename + "-main-checkbox",
-                      checked: c(b),
-                      indeterminate: c(P),
+                      checked: d(R),
+                      indeterminate: d(T),
                       onChange: w[1] || (w[1] = //@ts-ignore
-                      (...u) => c(V) && c(V)(...u))
-                    }, null, 40, He),
+                      (...h) => d(H) && d(H)(...h))
+                    }, null, 40, Le),
                     n("label", {
                       for: e.tablename + "-main-checkbox"
                     }, null, 8, Me)
                   ])
-                ])) : R("", !0),
-                (f(!0), g(A, null, B(e.columns, (u) => (f(), g("th", {
-                  key: u.field,
-                  onClick: (x) => u.sortable ? c(d).handleSort(u.field, x) : null,
-                  style: ee({ width: u.width + "%" }),
-                  class: S([u.sortable ? "vs-sortable" : "", e.headerClass])
+                ])) : x("", !0),
+                (b(!0), f(M, null, B(e.columns, (h) => (b(), f("th", {
+                  key: h.field,
+                  onClick: ($) => h.sortable ? d(m).handleSort(h.field, $) : null,
+                  style: ee({ width: h.width + "%" }),
+                  class: V([h.sortable ? "vs-sortable" : "", e.headerClass])
                 }, [
-                  K(_.$slots, `header-${u.field}`, { column: u }, () => [
-                    n("div", Be, [
-                      n("span", Ke, p(u.label), 1),
-                      u.sortable ? (f(), g("div", Le, [
+                  A(_.$slots, `header-${h.field}`, { column: h }, () => [
+                    n("div", Ae, [
+                      n("span", Ke, P(h.label), 1),
+                      h.sortable ? (b(), f("div", ze, [
                         n("span", {
-                          class: S(["vs-sort-icon vs-sort-asc", {
-                            "vs-active": c(d).isColumnSorted(u.field) && c(d).getSortOrder(u.field) === "asc"
+                          class: V(["vs-sort-icon vs-sort-asc", {
+                            "vs-active": d(m).isColumnSorted(h.field) && d(m).getSortOrder(h.field) === "asc"
                           }])
                         }, [...w[5] || (w[5] = [
                           n("svg", {
@@ -495,8 +510,8 @@ const Te = { class: "vs-datatable" }, Ie = {
                           ], -1)
                         ])], 2),
                         n("span", {
-                          class: S(["vs-sort-icon vs-sort-desc", {
-                            "vs-active": c(d).isColumnSorted(u.field) && c(d).getSortOrder(u.field) === "desc"
+                          class: V(["vs-sort-icon vs-sort-desc", {
+                            "vs-active": d(m).isColumnSorted(h.field) && d(m).getSortOrder(h.field) === "desc"
                           }])
                         }, [...w[6] || (w[6] = [
                           n("svg", {
@@ -508,69 +523,69 @@ const Te = { class: "vs-datatable" }, Ie = {
                             n("path", { d: "M480-360 280-560h400L480-360Z" })
                           ], -1)
                         ])], 2)
-                      ])) : R("", !0),
-                      c(d).getSortPriority(u.field) !== null ? (f(), g("span", ze, p(c(d).getSortPriority(u.field)), 1)) : R("", !0)
+                      ])) : x("", !0),
+                      d(m).getSortPriority(h.field) !== null ? (b(), f("span", Ne, P(d(m).getSortPriority(h.field)), 1)) : x("", !0)
                     ])
                   ], !0)
-                ], 14, Ae))), 128))
+                ], 14, Be))), 128))
               ])
             ]),
             n("tbody", null, [
-              e.loading ? (f(), g("tr", Ne, [
+              e.loading ? (b(), f("tr", Fe, [
                 n("td", {
-                  colspan: U.value,
+                  colspan: j.value,
                   class: "vs-loading"
                 }, [
                   w[7] || (w[7] = n("div", { class: "vs-spinner" }, null, -1)),
-                  n("span", null, p(e.loadingText), 1)
-                ], 8, Fe)
-              ])) : c(D).length ? (f(!0), g(A, { key: 2 }, B(c(D), (u, x) => (f(), g("tr", {
-                key: c(k)(u, x),
-                class: S([
+                  n("span", null, P(e.loadingText), 1)
+                ], 8, Ue)
+              ])) : d(D).length ? (b(!0), f(M, { key: 2 }, B(d(D), (h, $) => (b(), f("tr", {
+                key: d(k)(h, $),
+                class: V([
                   e.rowClass,
-                  { "vs-row-clickable": r.value },
-                  { "vs-row-selected": c(Z)(u, c(m), e.rowKey) }
+                  { "vs-row-clickable": a.value },
+                  { "vs-row-selected": d(Z)(h, d(v), e.rowKey) }
                 ]),
-                onClick: ($) => _.$emit("row-click", u, x)
+                onClick: (I) => _.$emit("row-click", h, $)
               }, [
-                c(a) ? (f(), g("td", {
+                d(p) ? (b(), f("td", {
                   key: 0,
                   onClick: w[2] || (w[2] = te(() => {
                   }, ["stop"])),
                   class: "vs-checkbox-column"
                 }, [
-                  n("div", Ge, [
+                  n("div", Je, [
                     n("input", {
                       type: "checkbox",
-                      id: e.tablename + "-checkbox-" + c(k)(u, x),
-                      value: u,
-                      checked: c(m).some(($, J) => c(k)($, J) === c(k)(u, x)),
-                      onChange: ($) => c(I)(u, x)
-                    }, null, 40, Je),
+                      id: e.tablename + "-checkbox-" + d(k)(h, $),
+                      value: h,
+                      checked: d(v).some((I, J) => d(k)(I, J) === d(k)(h, $)),
+                      onChange: (I) => d(G)(h, $)
+                    }, null, 40, We),
                     n("label", {
-                      for: e.tablename + "-checkbox-" + c(k)(u, x)
-                    }, null, 8, We)
+                      for: e.tablename + "-checkbox-" + d(k)(h, $)
+                    }, null, 8, Xe)
                   ])
-                ])) : R("", !0),
-                (f(!0), g(A, null, B(e.columns, ($) => (f(), g("td", {
-                  key: $.field,
-                  class: S(e.cellClass)
+                ])) : x("", !0),
+                (b(!0), f(M, null, B(e.columns, (I) => (b(), f("td", {
+                  key: I.field,
+                  class: V(e.cellClass)
                 }, [
-                  K(_.$slots, `cell-${$.field}`, {
-                    item: u,
-                    value: c(E)(u, $.field),
-                    column: $,
-                    index: x
+                  A(_.$slots, `cell-${I.field}`, {
+                    item: h,
+                    value: d(E)(h, I.field),
+                    column: I,
+                    index: $
                   }, () => [
-                    se(p(c(E)(u, $.field)), 1)
+                    se(P(d(E)(h, I.field)), 1)
                   ], !0)
                 ], 2))), 128))
-              ], 10, je))), 128)) : (f(), g("tr", Qe, [
+              ], 10, Ge))), 128)) : (b(), f("tr", je, [
                 n("td", {
-                  colspan: U.value,
+                  colspan: j.value,
                   class: "vs-no-data"
                 }, [
-                  K(_.$slots, "no-data", {}, () => [
+                  A(_.$slots, "no-data", {}, () => [
                     w[8] || (w[8] = n("div", { class: "vs-no-data-icon" }, [
                       n("svg", {
                         viewBox: "0 0 24 24",
@@ -579,44 +594,44 @@ const Te = { class: "vs-datatable" }, Ie = {
                         n("path", { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z" })
                       ])
                     ], -1)),
-                    n("div", Ee, p(e.noDataText), 1),
-                    n("div", Ze, p(e.noDataDescription), 1)
+                    n("div", Ze, P(e.noDataText), 1),
+                    n("div", Qe, P(e.noDataDescription), 1)
                   ], !0)
-                ], 8, Ue)
+                ], 8, Ee)
               ]))
             ])
           ], 2)
         ], 512)
       ], 2),
-      e.showFooter ? (f(), g("div", Xe, [
-        n("div", Ye, [
-          z(pe, {
-            modelValue: c(h),
-            "onUpdate:modelValue": w[3] || (w[3] = (u) => N(h) ? h.value = u : null),
-            onRowsPerPageChanged: c(M)
+      e.showFooter ? (b(), f("div", Ye, [
+        n("div", qe, [
+          z(Pe, {
+            modelValue: d(i),
+            "onUpdate:modelValue": w[3] || (w[3] = (h) => N(i) ? i.value = h : null),
+            onRowsPerPageChanged: d(O)
           }, null, 8, ["modelValue", "onRowsPerPageChanged"]),
           w[9] || (w[9] = n("div", { class: "vs-divider" }, null, -1)),
-          n("div", qe, p(c(y).start < 1 ? 0 : c(y).start) + " - " + p(c(y).end) + " of " + p(c(v)) + " " + p(e.entriesText), 1)
+          n("div", et, P(d(S).start < 1 ? 0 : d(S).start) + " - " + P(d(S).end) + " of " + P(d(g)) + " " + P(e.entriesText), 1)
         ]),
-        z(ge, {
-          modelValue: c(o),
-          "onUpdate:modelValue": w[4] || (w[4] = (u) => N(o) ? o.value = u : null),
-          totalRecords: c(v),
-          rowsPerPage: c(h),
+        z(fe, {
+          modelValue: d(c),
+          "onUpdate:modelValue": w[4] || (w[4] = (h) => N(c) ? c.value = h : null),
+          totalRecords: d(g),
+          rowsPerPage: d(i),
           maxVisible: e.maxVisiblePages,
           tablename: e.tablename,
-          class: S(e.paginationClass),
-          onPageChanged: c(T)
+          class: V(e.paginationClass),
+          onPageChanged: d(y)
         }, null, 8, ["modelValue", "totalRecords", "rowsPerPage", "maxVisible", "tablename", "class", "onPageChanged"])
-      ])) : R("", !0)
+      ])) : x("", !0)
     ]));
   }
-}), tt = /* @__PURE__ */ Q(et, [["__scopeId", "data-v-b1f39b67"]]), lt = {
+}), st = /* @__PURE__ */ U(tt, [["__scopeId", "data-v-84a43921"]]), at = {
   install(e) {
-    e.component("VsDataTable", tt);
+    e.component("VsDataTable", st);
   }
 };
 export {
-  tt as VsDataTable,
-  lt as default
+  st as VsDataTable,
+  at as default
 };