vs-datatable 1.2.0 → 1.2.2

package/dist/vs-datatable.es.js

@@ -1,56 +1,63 @@
-import { defineComponent as _, computed as T, createElementBlock as w, openBlock as h, createElementVNode as g, createCommentVNode as P, Fragment as K, renderList as z, normalizeClass as W, toDisplayString as D, unref as R, mergeProps as xt, renderSlot as q, ref as L, watch as G, createVNode as j, withModifiers as le, withCtx as I, withDirectives as U, vModelText as oe, nextTick as Ct, onMounted as st, onUnmounted as lt, createBlock as fe, Teleport as kt, Transition as Rt, vModelSelect as Me, normalizeStyle as St, createSlots as Ne, createTextVNode as je, isRef as ye, shallowRef as at, useAttrs as Tt, onBeforeMount as $t, normalizeProps as ze, guardReactiveProps as Ze } from "vue";
-import './index.css';function Vt(e, t) {
-  return t.split(".").reduce((n, o) => n?.[o], e) ?? "";
-}
-function X(e, t, n = "id") {
-  return typeof n == "function" ? n(e, t) : e[n] || t;
-}
-function rt(e, t, n = "id") {
-  return t.some(
-    (o) => X(o, -1, n) === X(e, -1, n)
+import { defineComponent as _, computed as F, createElementBlock as k, openBlock as y, createElementVNode as w, createCommentVNode as D, Fragment as K, renderList as Q, normalizeClass as G, toDisplayString as H, unref as $, mergeProps as Ae, renderSlot as z, ref as q, watch as Y, createVNode as ne, withModifiers as me, withCtx as X, withDirectives as te, vModelText as ve, nextTick as oe, onMounted as Re, onUnmounted as mt, createBlock as fe, Teleport as Dt, Transition as It, vModelSelect as Xe, normalizeStyle as pt, createSlots as Te, createTextVNode as Ye, onBeforeUnmount as He, isRef as Fe, shallowRef as gt, useAttrs as qt, onBeforeMount as Mt, normalizeProps as nt, guardReactiveProps as ot } from "vue";
+import './index.css';const Bt = (e, n) => n ? n.split(".").reduce((t, o) => t && t[o], e) : "";
+function re(e, n, t = "id") {
+  return typeof t == "function" ? t(e, n) : e[t] || n;
+}
+function yt(e, n, t = "id") {
+  return n.some(
+    (o) => re(o, -1, t) === re(e, -1, t)
   );
 }
-function Ot(e, t, n) {
-  return e.length + (t ? 1 : 0) + (n ? 1 : 0);
+function Ht(e, n, t) {
+  const o = (l) => l.reduce((a, r) => r.children && r.children.length > 0 ? a + o(r.children) : a + 1, 0);
+  return o(e) + (n ? 1 : 0) + (t ? 1 : 0);
 }
-function At(e, t) {
-  if (!t.length) return e;
-  const n = (o, s) => s.split(".").reduce((l, a) => l?.[a], o) ?? "";
+function Wt(e, n) {
+  if (!n.length) return e;
+  const t = (o, s) => s.split(".").reduce((l, a) => l?.[a], o) ?? "";
   return [...e].sort((o, s) => {
-    for (const { field: l, order: a } of t) {
-      const r = n(o, l), u = n(s, l);
-      if (r !== u)
-        return a === "asc" ? r > u ? 1 : -1 : r < u ? 1 : -1;
+    for (const { field: l, order: a } of n) {
+      const r = t(o, l), i = t(s, l);
+      if (r !== i)
+        return a === "asc" ? r > i ? 1 : -1 : r < i ? 1 : -1;
     }
     return 0;
   });
 }
-function Et(e, t, n) {
-  if (!n) return e;
-  const o = (t - 1) * n, s = o + n;
+function Nt(e, n, t) {
+  if (!t) return e;
+  const o = (n - 1) * t, s = o + t;
   return e.slice(o, s);
 }
-function Pt(e, t, n) {
-  const o = (e - 1) * t + 1, s = Math.min(e * t, n);
+function Kt(e, n, t) {
+  const o = (e - 1) * n + 1, s = Math.min(e * n, t);
   return { start: o, end: s };
 }
-function it(e, t) {
-  return Math.ceil(e / t);
+function wt(e, n) {
+  return Math.ceil(e / n);
 }
-function Qe(e, t, n) {
-  if (!t || t.trim() === "") return e;
-  const o = t.toLowerCase();
+function st(e, n, t) {
+  if (!n || n.trim() === "") return e;
+  const o = n.toLowerCase();
   return e.filter((s) => Object.values(s).some(
     (l) => String(l ?? "").toLowerCase().includes(o)
   ));
 }
-const Dt = ["id"], Lt = ["disabled"], Ft = {
+function zt(e = []) {
+  const n = [], t = (o) => {
+    o.forEach((s) => {
+      Array.isArray(s.children) && s.children.length ? t(s.children) : n.push(s);
+    });
+  };
+  return t(e), n;
+}
+const jt = ["id"], Ut = ["disabled"], Zt = {
   key: 1,
   class: "vs-pagination-ellipsis"
-}, Bt = ["id", "onClick"], Mt = {
+}, Xt = ["id", "onClick"], Qt = {
   key: 2,
   class: "vs-pagination-ellipsis"
-}, qt = ["disabled"], Nt = /* @__PURE__ */ _({
+}, Yt = ["disabled"], Gt = /* @__PURE__ */ _({
   __name: "VsPagination",
   props: {
     modelValue: {},
@@ -61,169 +68,169 @@ const Dt = ["id"], Lt = ["disabled"], Ft = {
     paginationClass: {}
   },
   emits: ["update:modelValue", "pageChanged"],
-  setup(e, { emit: t }) {
-    const n = e, o = t, s = n.maxVisible ?? 3, l = T({
-      get: () => n.modelValue,
-      set: (v) => {
-        o("update:modelValue", v), o("pageChanged", v);
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = t.maxVisible ?? 3, l = F({
+      get: () => t.modelValue,
+      set: (f) => {
+        o("update:modelValue", f), o("pageChanged", f);
       }
-    }), a = T(() => l.value <= Math.floor(s / 2) ? 1 : l.value >= u.value - Math.floor(s / 2) ? Math.max(u.value - s + 1, 1) : l.value - Math.floor(s / 2)), r = T(() => Math.min(a.value + s - 1, u.value)), u = T(() => it(n.totalRecords, n.rowsPerPage)), c = T(() => {
-      const v = [];
-      for (let d = a.value; d <= r.value; d++)
-        v.push(d);
-      return v;
-    }), f = (v) => {
-      v >= 1 && v <= u.value && (l.value = v);
-    }, i = () => {
+    }), a = F(() => l.value <= Math.floor(s / 2) ? 1 : l.value >= i.value - Math.floor(s / 2) ? Math.max(i.value - s + 1, 1) : l.value - Math.floor(s / 2)), r = F(() => Math.min(a.value + s - 1, i.value)), i = F(() => wt(t.totalRecords, t.rowsPerPage)), c = F(() => {
+      const f = [];
+      for (let u = a.value; u <= r.value; u++)
+        f.push(u);
+      return f;
+    }), d = (f) => {
+      f >= 1 && f <= i.value && (l.value = f);
+    }, v = () => {
       l.value > 1 && l.value--;
-    }, p = () => {
-      l.value < u.value && l.value++;
+    }, m = () => {
+      l.value < i.value && l.value++;
     };
-    return (v, d) => (h(), w("div", {
+    return (f, u) => (y(), k("div", {
       class: "vs-pagination",
       id: e.tablename + "-pagination"
     }, [
-      g("button", {
-        onClick: i,
+      w("button", {
+        onClick: v,
         type: "button",
         class: "vs-pagination-button vs-pagination-nav",
         disabled: l.value === 1
-      }, " ‹‹ ", 8, Lt),
-      a.value > 1 ? (h(), w("button", {
+      }, " ‹‹ ", 8, Ut),
+      a.value > 1 ? (y(), k("button", {
         key: 0,
         type: "button",
         class: "vs-pagination-button",
-        onClick: d[0] || (d[0] = (m) => f(1))
-      }, " 1 ")) : P("", !0),
-      a.value > 2 ? (h(), w("span", Ft, "...")) : P("", !0),
-      (h(!0), w(K, null, z(c.value, (m) => (h(), w("button", {
-        key: m,
+        onClick: u[0] || (u[0] = (h) => d(1))
+      }, " 1 ")) : D("", !0),
+      a.value > 2 ? (y(), k("span", Zt, "...")) : D("", !0),
+      (y(!0), k(K, null, Q(c.value, (h) => (y(), k("button", {
+        key: h,
         type: "button",
-        class: W([
+        class: G([
           "vs-pagination-button",
-          { "vs-active": l.value === m }
+          { "vs-active": l.value === h }
         ]),
-        id: e.tablename + "-page-" + m,
-        onClick: (b) => f(m)
-      }, D(m), 11, Bt))), 128)),
-      r.value < u.value - 1 ? (h(), w("span", Mt, "...")) : P("", !0),
-      r.value < u.value ? (h(), w("button", {
+        id: e.tablename + "-page-" + h,
+        onClick: (g) => d(h)
+      }, H(h), 11, Xt))), 128)),
+      r.value < i.value - 1 ? (y(), k("span", Qt, "...")) : D("", !0),
+      r.value < i.value ? (y(), k("button", {
         key: 3,
         type: "button",
         class: "vs-pagination-button",
-        onClick: d[1] || (d[1] = (m) => f(u.value))
-      }, D(u.value), 1)) : P("", !0),
-      g("button", {
-        onClick: p,
+        onClick: u[1] || (u[1] = (h) => d(i.value))
+      }, H(i.value), 1)) : D("", !0),
+      w("button", {
+        onClick: m,
         type: "button",
         class: "vs-pagination-button vs-pagination-nav",
-        disabled: l.value === u.value
-      }, " ›› ", 8, qt)
-    ], 8, Dt));
+        disabled: l.value === i.value
+      }, " ›› ", 8, Yt)
+    ], 8, jt));
   }
-}), ne = (e, t) => {
-  const n = e.__vccOpts || e;
-  for (const [o, s] of t)
-    n[o] = s;
-  return n;
-}, It = /* @__PURE__ */ ne(Nt, [["__scopeId", "data-v-b327b254"]]), Ht = { class: "vs-rows-per-page" }, Kt = ["value"], Wt = ["value"], Ut = /* @__PURE__ */ _({
+}), ae = (e, n) => {
+  const t = e.__vccOpts || e;
+  for (const [o, s] of n)
+    t[o] = s;
+  return t;
+}, Jt = /* @__PURE__ */ ae(Gt, [["__scopeId", "data-v-b327b254"]]), _t = { class: "vs-rows-per-page" }, en = ["value"], tn = ["value"], nn = /* @__PURE__ */ _({
   __name: "VsRowsPerPage",
   props: {
     modelValue: {},
     options: {}
   },
   emits: ["update:modelValue", "rowsPerPageChanged"],
-  setup(e, { emit: t }) {
-    const n = e, o = t, s = n.options ?? [10, 25, 50, 100], l = (a) => {
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = t.options ?? [10, 25, 50, 100], l = (a) => {
       const r = Number(a.target.value);
       o("update:modelValue", r), o("rowsPerPageChanged", r);
     };
-    return (a, r) => (h(), w("div", Ht, [
-      r[0] || (r[0] = g("span", { class: "vs-rows-label" }, "Items Per Page", -1)),
-      g("select", {
+    return (a, r) => (y(), k("div", _t, [
+      r[0] || (r[0] = w("span", { class: "vs-rows-label" }, "Items Per Page", -1)),
+      w("select", {
         class: "vs-items-dropdown",
         value: e.modelValue,
         onChange: l
       }, [
-        (h(!0), w(K, null, z(R(s), (u) => (h(), w("option", {
-          key: u,
-          value: u
-        }, D(u), 9, Wt))), 128))
-      ], 40, Kt)
+        (y(!0), k(K, null, Q($(s), (i) => (y(), k("option", {
+          key: i,
+          value: i
+        }, H(i), 9, tn))), 128))
+      ], 40, en)
     ]));
   }
-}), jt = /* @__PURE__ */ ne(Ut, [["__scopeId", "data-v-0c2bdd9c"]]), Te = Math.min, ie = Math.max, $e = Math.round, Re = Math.floor, Y = (e) => ({
+}), on = /* @__PURE__ */ ae(nn, [["__scopeId", "data-v-0c2bdd9c"]]), De = Math.min, we = Math.max, Ie = Math.round, Le = Math.floor, ie = (e) => ({
   x: e,
   y: e
-}), zt = {
+}), sn = {
   left: "right",
   right: "left",
   bottom: "top",
   top: "bottom"
-}, Zt = {
+}, ln = {
   start: "end",
   end: "start"
 };
-function Xe(e, t, n) {
-  return ie(e, Te(t, n));
+function lt(e, n, t) {
+  return we(e, De(n, t));
 }
-function Ee(e, t) {
-  return typeof e == "function" ? e(t) : e;
+function We(e, n) {
+  return typeof e == "function" ? e(n) : e;
 }
-function ue(e) {
+function be(e) {
   return e.split("-")[0];
 }
-function Pe(e) {
+function Ne(e) {
   return e.split("-")[1];
 }
-function ut(e) {
+function bt(e) {
   return e === "x" ? "y" : "x";
 }
-function ct(e) {
+function xt(e) {
   return e === "y" ? "height" : "width";
 }
-const Qt = /* @__PURE__ */ new Set(["top", "bottom"]);
-function se(e) {
-  return Qt.has(ue(e)) ? "y" : "x";
+const an = /* @__PURE__ */ new Set(["top", "bottom"]);
+function he(e) {
+  return an.has(be(e)) ? "y" : "x";
 }
-function dt(e) {
-  return ut(se(e));
+function kt(e) {
+  return bt(he(e));
 }
-function Xt(e, t, n) {
-  n === void 0 && (n = !1);
-  const o = Pe(e), s = dt(e), l = ct(s);
-  let a = s === "x" ? o === (n ? "end" : "start") ? "right" : "left" : o === "start" ? "bottom" : "top";
-  return t.reference[l] > t.floating[l] && (a = Ve(a)), [a, Ve(a)];
+function rn(e, n, t) {
+  t === void 0 && (t = !1);
+  const o = Ne(e), s = kt(e), l = xt(s);
+  let a = s === "x" ? o === (t ? "end" : "start") ? "right" : "left" : o === "start" ? "bottom" : "top";
+  return n.reference[l] > n.floating[l] && (a = qe(a)), [a, qe(a)];
 }
-function Yt(e) {
-  const t = Ve(e);
-  return [Ie(e), t, Ie(t)];
+function cn(e) {
+  const n = qe(e);
+  return [Ge(e), n, Ge(n)];
 }
-function Ie(e) {
-  return e.replace(/start|end/g, (t) => Zt[t]);
+function Ge(e) {
+  return e.replace(/start|end/g, (n) => ln[n]);
 }
-const Ye = ["left", "right"], Ge = ["right", "left"], Gt = ["top", "bottom"], Jt = ["bottom", "top"];
-function _t(e, t, n) {
+const at = ["left", "right"], rt = ["right", "left"], un = ["top", "bottom"], dn = ["bottom", "top"];
+function fn(e, n, t) {
   switch (e) {
     case "top":
     case "bottom":
-      return n ? t ? Ge : Ye : t ? Ye : Ge;
+      return t ? n ? rt : at : n ? at : rt;
     case "left":
     case "right":
-      return t ? Gt : Jt;
+      return n ? un : dn;
     default:
       return [];
   }
 }
-function en(e, t, n, o) {
-  const s = Pe(e);
-  let l = _t(ue(e), n === "start", o);
-  return s && (l = l.map((a) => a + "-" + s), t && (l = l.concat(l.map(Ie)))), l;
+function vn(e, n, t, o) {
+  const s = Ne(e);
+  let l = fn(be(e), t === "start", o);
+  return s && (l = l.map((a) => a + "-" + s), n && (l = l.concat(l.map(Ge)))), l;
 }
-function Ve(e) {
-  return e.replace(/left|right|bottom|top/g, (t) => zt[t]);
+function qe(e) {
+  return e.replace(/left|right|bottom|top/g, (n) => sn[n]);
 }
-function tn(e) {
+function hn(e) {
   return {
     top: 0,
     right: 0,
@@ -232,452 +239,452 @@ function tn(e) {
     ...e
   };
 }
-function nn(e) {
-  return typeof e != "number" ? tn(e) : {
+function mn(e) {
+  return typeof e != "number" ? hn(e) : {
     top: e,
     right: e,
     bottom: e,
     left: e
   };
 }
-function Oe(e) {
+function Me(e) {
   const {
-    x: t,
-    y: n,
+    x: n,
+    y: t,
     width: o,
     height: s
   } = e;
   return {
     width: o,
     height: s,
-    top: n,
-    left: t,
-    right: t + o,
-    bottom: n + s,
-    x: t,
-    y: n
+    top: t,
+    left: n,
+    right: n + o,
+    bottom: t + s,
+    x: n,
+    y: t
   };
 }
-function Je(e, t, n) {
+function it(e, n, t) {
   let {
     reference: o,
     floating: s
   } = e;
-  const l = se(t), a = dt(t), r = ct(a), u = ue(t), c = l === "y", f = o.x + o.width / 2 - s.width / 2, i = o.y + o.height / 2 - s.height / 2, p = o[r] / 2 - s[r] / 2;
-  let v;
-  switch (u) {
+  const l = he(n), a = kt(n), r = xt(a), i = be(n), c = l === "y", d = o.x + o.width / 2 - s.width / 2, v = o.y + o.height / 2 - s.height / 2, m = o[r] / 2 - s[r] / 2;
+  let f;
+  switch (i) {
     case "top":
-      v = {
-        x: f,
+      f = {
+        x: d,
         y: o.y - s.height
       };
       break;
     case "bottom":
-      v = {
-        x: f,
+      f = {
+        x: d,
         y: o.y + o.height
       };
       break;
     case "right":
-      v = {
+      f = {
         x: o.x + o.width,
-        y: i
+        y: v
       };
       break;
     case "left":
-      v = {
+      f = {
         x: o.x - s.width,
-        y: i
+        y: v
       };
       break;
     default:
-      v = {
+      f = {
         x: o.x,
         y: o.y
       };
   }
-  switch (Pe(t)) {
+  switch (Ne(n)) {
     case "start":
-      v[a] -= p * (n && c ? -1 : 1);
+      f[a] -= m * (t && c ? -1 : 1);
       break;
     case "end":
-      v[a] += p * (n && c ? -1 : 1);
+      f[a] += m * (t && c ? -1 : 1);
       break;
   }
-  return v;
+  return f;
 }
-const on = async (e, t, n) => {
+const pn = async (e, n, t) => {
   const {
     placement: o = "bottom",
     strategy: s = "absolute",
     middleware: l = [],
     platform: a
-  } = n, r = l.filter(Boolean), u = await (a.isRTL == null ? void 0 : a.isRTL(t));
+  } = t, r = l.filter(Boolean), i = await (a.isRTL == null ? void 0 : a.isRTL(n));
   let c = await a.getElementRects({
     reference: e,
-    floating: t,
+    floating: n,
     strategy: s
   }), {
-    x: f,
-    y: i
-  } = Je(c, o, u), p = o, v = {}, d = 0;
-  for (let m = 0; m < r.length; m++) {
+    x: d,
+    y: v
+  } = it(c, o, i), m = o, f = {}, u = 0;
+  for (let h = 0; h < r.length; h++) {
     const {
-      name: b,
+      name: g,
       fn: C
-    } = r[m], {
-      x: k,
-      y: S,
-      data: O,
-      reset: A
+    } = r[h], {
+      x: S,
+      y: E,
+      data: L,
+      reset: P
     } = await C({
-      x: f,
-      y: i,
+      x: d,
+      y: v,
       initialPlacement: o,
-      placement: p,
+      placement: m,
       strategy: s,
-      middlewareData: v,
+      middlewareData: f,
       rects: c,
       platform: a,
       elements: {
         reference: e,
-        floating: t
+        floating: n
       }
     });
-    f = k ?? f, i = S ?? i, v = {
-      ...v,
-      [b]: {
-        ...v[b],
-        ...O
+    d = S ?? d, v = E ?? v, f = {
+      ...f,
+      [g]: {
+        ...f[g],
+        ...L
       }
-    }, A && d <= 50 && (d++, typeof A == "object" && (A.placement && (p = A.placement), A.rects && (c = A.rects === !0 ? await a.getElementRects({
+    }, P && u <= 50 && (u++, typeof P == "object" && (P.placement && (m = P.placement), P.rects && (c = P.rects === !0 ? await a.getElementRects({
       reference: e,
-      floating: t,
+      floating: n,
       strategy: s
-    }) : A.rects), {
-      x: f,
-      y: i
-    } = Je(c, p, u)), m = -1);
+    }) : P.rects), {
+      x: d,
+      y: v
+    } = it(c, m, i)), h = -1);
   }
   return {
-    x: f,
-    y: i,
-    placement: p,
+    x: d,
+    y: v,
+    placement: m,
     strategy: s,
-    middlewareData: v
+    middlewareData: f
   };
 };
-async function ft(e, t) {
-  var n;
-  t === void 0 && (t = {});
+async function Ct(e, n) {
+  var t;
+  n === void 0 && (n = {});
   const {
     x: o,
     y: s,
     platform: l,
     rects: a,
     elements: r,
-    strategy: u
+    strategy: i
   } = e, {
     boundary: c = "clippingAncestors",
-    rootBoundary: f = "viewport",
-    elementContext: i = "floating",
-    altBoundary: p = !1,
-    padding: v = 0
-  } = Ee(t, e), d = nn(v), b = r[p ? i === "floating" ? "reference" : "floating" : i], C = Oe(await l.getClippingRect({
-    element: (n = await (l.isElement == null ? void 0 : l.isElement(b))) == null || n ? b : b.contextElement || await (l.getDocumentElement == null ? void 0 : l.getDocumentElement(r.floating)),
+    rootBoundary: d = "viewport",
+    elementContext: v = "floating",
+    altBoundary: m = !1,
+    padding: f = 0
+  } = We(n, e), u = mn(f), g = r[m ? v === "floating" ? "reference" : "floating" : v], C = Me(await l.getClippingRect({
+    element: (t = await (l.isElement == null ? void 0 : l.isElement(g))) == null || t ? g : g.contextElement || await (l.getDocumentElement == null ? void 0 : l.getDocumentElement(r.floating)),
     boundary: c,
-    rootBoundary: f,
-    strategy: u
-  })), k = i === "floating" ? {
+    rootBoundary: d,
+    strategy: i
+  })), S = v === "floating" ? {
     x: o,
     y: s,
     width: a.floating.width,
     height: a.floating.height
-  } : a.reference, S = await (l.getOffsetParent == null ? void 0 : l.getOffsetParent(r.floating)), O = await (l.isElement == null ? void 0 : l.isElement(S)) ? await (l.getScale == null ? void 0 : l.getScale(S)) || {
+  } : a.reference, E = await (l.getOffsetParent == null ? void 0 : l.getOffsetParent(r.floating)), L = await (l.isElement == null ? void 0 : l.isElement(E)) ? await (l.getScale == null ? void 0 : l.getScale(E)) || {
     x: 1,
     y: 1
   } : {
     x: 1,
     y: 1
-  }, A = Oe(l.convertOffsetParentRelativeRectToViewportRelativeRect ? await l.convertOffsetParentRelativeRectToViewportRelativeRect({
+  }, P = Me(l.convertOffsetParentRelativeRectToViewportRelativeRect ? await l.convertOffsetParentRelativeRectToViewportRelativeRect({
     elements: r,
-    rect: k,
-    offsetParent: S,
-    strategy: u
-  }) : k);
+    rect: S,
+    offsetParent: E,
+    strategy: i
+  }) : S);
   return {
-    top: (C.top - A.top + d.top) / O.y,
-    bottom: (A.bottom - C.bottom + d.bottom) / O.y,
-    left: (C.left - A.left + d.left) / O.x,
-    right: (A.right - C.right + d.right) / O.x
+    top: (C.top - P.top + u.top) / L.y,
+    bottom: (P.bottom - C.bottom + u.bottom) / L.y,
+    left: (C.left - P.left + u.left) / L.x,
+    right: (P.right - C.right + u.right) / L.x
   };
 }
-const sn = function(e) {
+const gn = function(e) {
   return e === void 0 && (e = {}), {
     name: "flip",
     options: e,
-    async fn(t) {
-      var n, o;
+    async fn(n) {
+      var t, o;
       const {
         placement: s,
         middlewareData: l,
         rects: a,
         initialPlacement: r,
-        platform: u,
+        platform: i,
         elements: c
-      } = t, {
-        mainAxis: f = !0,
-        crossAxis: i = !0,
-        fallbackPlacements: p,
-        fallbackStrategy: v = "bestFit",
-        fallbackAxisSideDirection: d = "none",
-        flipAlignment: m = !0,
-        ...b
-      } = Ee(e, t);
-      if ((n = l.arrow) != null && n.alignmentOffset)
+      } = n, {
+        mainAxis: d = !0,
+        crossAxis: v = !0,
+        fallbackPlacements: m,
+        fallbackStrategy: f = "bestFit",
+        fallbackAxisSideDirection: u = "none",
+        flipAlignment: h = !0,
+        ...g
+      } = We(e, n);
+      if ((t = l.arrow) != null && t.alignmentOffset)
         return {};
-      const C = ue(s), k = se(r), S = ue(r) === r, O = await (u.isRTL == null ? void 0 : u.isRTL(c.floating)), A = p || (S || !m ? [Ve(r)] : Yt(r)), M = d !== "none";
-      !p && M && A.push(...en(r, m, d, O));
-      const $ = [r, ...A], x = await ft(t, b), y = [];
-      let N = ((o = l.flip) == null ? void 0 : o.overflows) || [];
-      if (f && y.push(x[C]), i) {
-        const te = Xt(s, a, O);
-        y.push(x[te[0]], x[te[1]]);
+      const C = be(s), S = he(r), E = be(r) === r, L = await (i.isRTL == null ? void 0 : i.isRTL(c.floating)), P = m || (E || !h ? [qe(r)] : cn(r)), B = u !== "none";
+      !m && B && P.push(...vn(r, h, u, L));
+      const b = [r, ...P], p = await Ct(n, g), x = [];
+      let R = ((o = l.flip) == null ? void 0 : o.overflows) || [];
+      if (d && x.push(p[C]), v) {
+        const O = rn(s, a, L);
+        x.push(p[O[0]], p[O[1]]);
       }
-      if (N = [...N, {
+      if (R = [...R, {
         placement: s,
-        overflows: y
-      }], !y.every((te) => te <= 0)) {
-        var de, Ce;
-        const te = (((de = l.flip) == null ? void 0 : de.index) || 0) + 1, he = $[te];
-        if (he && (!(i === "alignment" ? k !== se(he) : !1) || // We leave the current main axis only if every placement on that axis
+        overflows: x
+      }], !x.every((O) => O <= 0)) {
+        var T, M;
+        const O = (((T = l.flip) == null ? void 0 : T.index) || 0) + 1, N = b[O];
+        if (N && (!(v === "alignment" ? S !== he(N) : !1) || // We leave the current main axis only if every placement on that axis
         // overflows the main axis.
-        N.every((V) => se(V.placement) === k ? V.overflows[0] > 0 : !0)))
+        R.every((V) => he(V.placement) === S ? V.overflows[0] > 0 : !0)))
           return {
             data: {
-              index: te,
-              overflows: N
+              index: O,
+              overflows: R
             },
             reset: {
-              placement: he
+              placement: N
             }
           };
-        let B = (Ce = N.filter((E) => E.overflows[0] <= 0).sort((E, V) => E.overflows[1] - V.overflows[1])[0]) == null ? void 0 : Ce.placement;
-        if (!B)
-          switch (v) {
+        let I = (M = R.filter((W) => W.overflows[0] <= 0).sort((W, V) => W.overflows[1] - V.overflows[1])[0]) == null ? void 0 : M.placement;
+        if (!I)
+          switch (f) {
             case "bestFit": {
-              var ke;
-              const E = (ke = N.filter((V) => {
-                if (M) {
-                  const F = se(V.placement);
-                  return F === k || // Create a bias to the `y` side axis due to horizontal
+              var A;
+              const W = (A = R.filter((V) => {
+                if (B) {
+                  const U = he(V.placement);
+                  return U === S || // Create a bias to the `y` side axis due to horizontal
                   // reading directions favoring greater width.
-                  F === "y";
+                  U === "y";
                 }
                 return !0;
-              }).map((V) => [V.placement, V.overflows.filter((F) => F > 0).reduce((F, we) => F + we, 0)]).sort((V, F) => V[1] - F[1])[0]) == null ? void 0 : ke[0];
-              E && (B = E);
+              }).map((V) => [V.placement, V.overflows.filter((U) => U > 0).reduce((U, ge) => U + ge, 0)]).sort((V, U) => V[1] - U[1])[0]) == null ? void 0 : A[0];
+              W && (I = W);
               break;
             }
             case "initialPlacement":
-              B = r;
+              I = r;
               break;
           }
-        if (s !== B)
+        if (s !== I)
           return {
             reset: {
-              placement: B
+              placement: I
             }
           };
       }
       return {};
     }
   };
-}, ln = /* @__PURE__ */ new Set(["left", "top"]);
-async function an(e, t) {
+}, yn = /* @__PURE__ */ new Set(["left", "top"]);
+async function wn(e, n) {
   const {
-    placement: n,
+    placement: t,
     platform: o,
     elements: s
-  } = e, l = await (o.isRTL == null ? void 0 : o.isRTL(s.floating)), a = ue(n), r = Pe(n), u = se(n) === "y", c = ln.has(a) ? -1 : 1, f = l && u ? -1 : 1, i = Ee(t, e);
+  } = e, l = await (o.isRTL == null ? void 0 : o.isRTL(s.floating)), a = be(t), r = Ne(t), i = he(t) === "y", c = yn.has(a) ? -1 : 1, d = l && i ? -1 : 1, v = We(n, e);
   let {
-    mainAxis: p,
-    crossAxis: v,
-    alignmentAxis: d
-  } = typeof i == "number" ? {
-    mainAxis: i,
+    mainAxis: m,
+    crossAxis: f,
+    alignmentAxis: u
+  } = typeof v == "number" ? {
+    mainAxis: v,
     crossAxis: 0,
     alignmentAxis: null
   } : {
-    mainAxis: i.mainAxis || 0,
-    crossAxis: i.crossAxis || 0,
-    alignmentAxis: i.alignmentAxis
+    mainAxis: v.mainAxis || 0,
+    crossAxis: v.crossAxis || 0,
+    alignmentAxis: v.alignmentAxis
   };
-  return r && typeof d == "number" && (v = r === "end" ? d * -1 : d), u ? {
-    x: v * f,
-    y: p * c
+  return r && typeof u == "number" && (f = r === "end" ? u * -1 : u), i ? {
+    x: f * d,
+    y: m * c
   } : {
-    x: p * c,
-    y: v * f
+    x: m * c,
+    y: f * d
   };
 }
-const rn = function(e) {
+const bn = function(e) {
   return e === void 0 && (e = 0), {
     name: "offset",
     options: e,
-    async fn(t) {
-      var n, o;
+    async fn(n) {
+      var t, o;
       const {
         x: s,
         y: l,
         placement: a,
         middlewareData: r
-      } = t, u = await an(t, e);
-      return a === ((n = r.offset) == null ? void 0 : n.placement) && (o = r.arrow) != null && o.alignmentOffset ? {} : {
-        x: s + u.x,
-        y: l + u.y,
+      } = n, i = await wn(n, e);
+      return a === ((t = r.offset) == null ? void 0 : t.placement) && (o = r.arrow) != null && o.alignmentOffset ? {} : {
+        x: s + i.x,
+        y: l + i.y,
         data: {
-          ...u,
+          ...i,
           placement: a
         }
       };
     }
   };
-}, un = function(e) {
+}, xn = function(e) {
   return e === void 0 && (e = {}), {
     name: "shift",
     options: e,
-    async fn(t) {
+    async fn(n) {
       const {
-        x: n,
+        x: t,
         y: o,
         placement: s
-      } = t, {
+      } = n, {
         mainAxis: l = !0,
         crossAxis: a = !1,
         limiter: r = {
-          fn: (b) => {
+          fn: (g) => {
             let {
               x: C,
-              y: k
-            } = b;
+              y: S
+            } = g;
             return {
               x: C,
-              y: k
+              y: S
             };
           }
         },
-        ...u
-      } = Ee(e, t), c = {
-        x: n,
+        ...i
+      } = We(e, n), c = {
+        x: t,
         y: o
-      }, f = await ft(t, u), i = se(ue(s)), p = ut(i);
-      let v = c[p], d = c[i];
+      }, d = await Ct(n, i), v = he(be(s)), m = bt(v);
+      let f = c[m], u = c[v];
       if (l) {
-        const b = p === "y" ? "top" : "left", C = p === "y" ? "bottom" : "right", k = v + f[b], S = v - f[C];
-        v = Xe(k, v, S);
+        const g = m === "y" ? "top" : "left", C = m === "y" ? "bottom" : "right", S = f + d[g], E = f - d[C];
+        f = lt(S, f, E);
       }
       if (a) {
-        const b = i === "y" ? "top" : "left", C = i === "y" ? "bottom" : "right", k = d + f[b], S = d - f[C];
-        d = Xe(k, d, S);
+        const g = v === "y" ? "top" : "left", C = v === "y" ? "bottom" : "right", S = u + d[g], E = u - d[C];
+        u = lt(S, u, E);
       }
-      const m = r.fn({
-        ...t,
-        [p]: v,
-        [i]: d
+      const h = r.fn({
+        ...n,
+        [m]: f,
+        [v]: u
       });
       return {
-        ...m,
+        ...h,
         data: {
-          x: m.x - n,
-          y: m.y - o,
+          x: h.x - t,
+          y: h.y - o,
           enabled: {
-            [p]: l,
-            [i]: a
+            [m]: l,
+            [v]: a
           }
         }
       };
     }
   };
 };
-function De() {
+function Ke() {
   return typeof window < "u";
 }
-function ge(e) {
-  return vt(e) ? (e.nodeName || "").toLowerCase() : "#document";
+function Ee(e) {
+  return St(e) ? (e.nodeName || "").toLowerCase() : "#document";
 }
-function H(e) {
-  var t;
-  return (e == null || (t = e.ownerDocument) == null ? void 0 : t.defaultView) || window;
+function J(e) {
+  var n;
+  return (e == null || (n = e.ownerDocument) == null ? void 0 : n.defaultView) || window;
 }
-function ee(e) {
-  var t;
-  return (t = (vt(e) ? e.ownerDocument : e.document) || window.document) == null ? void 0 : t.documentElement;
+function ue(e) {
+  var n;
+  return (n = (St(e) ? e.ownerDocument : e.document) || window.document) == null ? void 0 : n.documentElement;
 }
-function vt(e) {
-  return De() ? e instanceof Node || e instanceof H(e).Node : !1;
+function St(e) {
+  return Ke() ? e instanceof Node || e instanceof J(e).Node : !1;
 }
-function Z(e) {
-  return De() ? e instanceof Element || e instanceof H(e).Element : !1;
+function se(e) {
+  return Ke() ? e instanceof Element || e instanceof J(e).Element : !1;
 }
-function J(e) {
-  return De() ? e instanceof HTMLElement || e instanceof H(e).HTMLElement : !1;
+function ce(e) {
+  return Ke() ? e instanceof HTMLElement || e instanceof J(e).HTMLElement : !1;
 }
-function _e(e) {
-  return !De() || typeof ShadowRoot > "u" ? !1 : e instanceof ShadowRoot || e instanceof H(e).ShadowRoot;
+function ct(e) {
+  return !Ke() || typeof ShadowRoot > "u" ? !1 : e instanceof ShadowRoot || e instanceof J(e).ShadowRoot;
 }
-const cn = /* @__PURE__ */ new Set(["inline", "contents"]);
-function xe(e) {
+const kn = /* @__PURE__ */ new Set(["inline", "contents"]);
+function Ve(e) {
   const {
-    overflow: t,
-    overflowX: n,
+    overflow: n,
+    overflowX: t,
     overflowY: o,
     display: s
-  } = Q(e);
-  return /auto|scroll|overlay|hidden|clip/.test(t + o + n) && !cn.has(s);
+  } = le(e);
+  return /auto|scroll|overlay|hidden|clip/.test(n + o + t) && !kn.has(s);
 }
-const dn = /* @__PURE__ */ new Set(["table", "td", "th"]);
-function fn(e) {
-  return dn.has(ge(e));
+const Cn = /* @__PURE__ */ new Set(["table", "td", "th"]);
+function Sn(e) {
+  return Cn.has(Ee(e));
 }
-const vn = [":popover-open", ":modal"];
-function Le(e) {
-  return vn.some((t) => {
+const Rn = [":popover-open", ":modal"];
+function ze(e) {
+  return Rn.some((n) => {
     try {
-      return e.matches(t);
+      return e.matches(n);
     } catch {
       return !1;
     }
   });
 }
-const pn = ["transform", "translate", "scale", "rotate", "perspective"], mn = ["transform", "translate", "scale", "rotate", "perspective", "filter"], gn = ["paint", "layout", "strict", "content"];
-function Ke(e) {
-  const t = We(), n = Z(e) ? Q(e) : e;
-  return pn.some((o) => n[o] ? n[o] !== "none" : !1) || (n.containerType ? n.containerType !== "normal" : !1) || !t && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !t && (n.filter ? n.filter !== "none" : !1) || mn.some((o) => (n.willChange || "").includes(o)) || gn.some((o) => (n.contain || "").includes(o));
-}
-function hn(e) {
-  let t = ae(e);
-  for (; J(t) && !me(t); ) {
-    if (Ke(t))
-      return t;
-    if (Le(t))
+const En = ["transform", "translate", "scale", "rotate", "perspective"], $n = ["transform", "translate", "scale", "rotate", "perspective", "filter"], An = ["paint", "layout", "strict", "content"];
+function _e(e) {
+  const n = et(), t = se(e) ? le(e) : e;
+  return En.some((o) => t[o] ? t[o] !== "none" : !1) || (t.containerType ? t.containerType !== "normal" : !1) || !n && (t.backdropFilter ? t.backdropFilter !== "none" : !1) || !n && (t.filter ? t.filter !== "none" : !1) || $n.some((o) => (t.willChange || "").includes(o)) || An.some((o) => (t.contain || "").includes(o));
+}
+function Fn(e) {
+  let n = pe(e);
+  for (; ce(n) && !Se(n); ) {
+    if (_e(n))
+      return n;
+    if (ze(n))
       return null;
-    t = ae(t);
+    n = pe(n);
   }
   return null;
 }
-function We() {
+function et() {
   return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
 }
-const wn = /* @__PURE__ */ new Set(["html", "body", "#document"]);
-function me(e) {
-  return wn.has(ge(e));
+const Tn = /* @__PURE__ */ new Set(["html", "body", "#document"]);
+function Se(e) {
+  return Tn.has(Ee(e));
 }
-function Q(e) {
-  return H(e).getComputedStyle(e);
+function le(e) {
+  return J(e).getComputedStyle(e);
 }
-function Fe(e) {
-  return Z(e) ? {
+function je(e) {
+  return se(e) ? {
     scrollLeft: e.scrollLeft,
     scrollTop: e.scrollTop
   } : {
@@ -685,300 +692,300 @@ function Fe(e) {
     scrollTop: e.scrollY
   };
 }
-function ae(e) {
-  if (ge(e) === "html")
+function pe(e) {
+  if (Ee(e) === "html")
     return e;
-  const t = (
+  const n = (
     // Step into the shadow DOM of the parent of a slotted node.
     e.assignedSlot || // DOM Element detected.
     e.parentNode || // ShadowRoot detected.
-    _e(e) && e.host || // Fallback.
-    ee(e)
+    ct(e) && e.host || // Fallback.
+    ue(e)
   );
-  return _e(t) ? t.host : t;
+  return ct(n) ? n.host : n;
 }
-function pt(e) {
-  const t = ae(e);
-  return me(t) ? e.ownerDocument ? e.ownerDocument.body : e.body : J(t) && xe(t) ? t : pt(t);
+function Rt(e) {
+  const n = pe(e);
+  return Se(n) ? e.ownerDocument ? e.ownerDocument.body : e.body : ce(n) && Ve(n) ? n : Rt(n);
 }
-function be(e, t, n) {
+function Oe(e, n, t) {
   var o;
-  t === void 0 && (t = []), n === void 0 && (n = !0);
-  const s = pt(e), l = s === ((o = e.ownerDocument) == null ? void 0 : o.body), a = H(s);
+  n === void 0 && (n = []), t === void 0 && (t = !0);
+  const s = Rt(e), l = s === ((o = e.ownerDocument) == null ? void 0 : o.body), a = J(s);
   if (l) {
-    const r = He(a);
-    return t.concat(a, a.visualViewport || [], xe(s) ? s : [], r && n ? be(r) : []);
+    const r = Je(a);
+    return n.concat(a, a.visualViewport || [], Ve(s) ? s : [], r && t ? Oe(r) : []);
   }
-  return t.concat(s, be(s, [], n));
+  return n.concat(s, Oe(s, [], t));
 }
-function He(e) {
+function Je(e) {
   return e.parent && Object.getPrototypeOf(e.parent) ? e.frameElement : null;
 }
-function mt(e) {
-  const t = Q(e);
-  let n = parseFloat(t.width) || 0, o = parseFloat(t.height) || 0;
-  const s = J(e), l = s ? e.offsetWidth : n, a = s ? e.offsetHeight : o, r = $e(n) !== l || $e(o) !== a;
-  return r && (n = l, o = a), {
-    width: n,
+function Et(e) {
+  const n = le(e);
+  let t = parseFloat(n.width) || 0, o = parseFloat(n.height) || 0;
+  const s = ce(e), l = s ? e.offsetWidth : t, a = s ? e.offsetHeight : o, r = Ie(t) !== l || Ie(o) !== a;
+  return r && (t = l, o = a), {
+    width: t,
     height: o,
     $: r
   };
 }
-function Ue(e) {
-  return Z(e) ? e : e.contextElement;
+function tt(e) {
+  return se(e) ? e : e.contextElement;
 }
-function ve(e) {
-  const t = Ue(e);
-  if (!J(t))
-    return Y(1);
-  const n = t.getBoundingClientRect(), {
+function ke(e) {
+  const n = tt(e);
+  if (!ce(n))
+    return ie(1);
+  const t = n.getBoundingClientRect(), {
     width: o,
     height: s,
     $: l
-  } = mt(t);
-  let a = (l ? $e(n.width) : n.width) / o, r = (l ? $e(n.height) : n.height) / s;
+  } = Et(n);
+  let a = (l ? Ie(t.width) : t.width) / o, r = (l ? Ie(t.height) : t.height) / s;
   return (!a || !Number.isFinite(a)) && (a = 1), (!r || !Number.isFinite(r)) && (r = 1), {
     x: a,
     y: r
   };
 }
-const yn = /* @__PURE__ */ Y(0);
-function gt(e) {
-  const t = H(e);
-  return !We() || !t.visualViewport ? yn : {
-    x: t.visualViewport.offsetLeft,
-    y: t.visualViewport.offsetTop
+const On = /* @__PURE__ */ ie(0);
+function $t(e) {
+  const n = J(e);
+  return !et() || !n.visualViewport ? On : {
+    x: n.visualViewport.offsetLeft,
+    y: n.visualViewport.offsetTop
   };
 }
-function bn(e, t, n) {
-  return t === void 0 && (t = !1), !n || t && n !== H(e) ? !1 : t;
+function Vn(e, n, t) {
+  return n === void 0 && (n = !1), !t || n && t !== J(e) ? !1 : n;
 }
-function ce(e, t, n, o) {
-  t === void 0 && (t = !1), n === void 0 && (n = !1);
-  const s = e.getBoundingClientRect(), l = Ue(e);
-  let a = Y(1);
-  t && (o ? Z(o) && (a = ve(o)) : a = ve(e));
-  const r = bn(l, n, o) ? gt(l) : Y(0);
-  let u = (s.left + r.x) / a.x, c = (s.top + r.y) / a.y, f = s.width / a.x, i = s.height / a.y;
+function xe(e, n, t, o) {
+  n === void 0 && (n = !1), t === void 0 && (t = !1);
+  const s = e.getBoundingClientRect(), l = tt(e);
+  let a = ie(1);
+  n && (o ? se(o) && (a = ke(o)) : a = ke(e));
+  const r = Vn(l, t, o) ? $t(l) : ie(0);
+  let i = (s.left + r.x) / a.x, c = (s.top + r.y) / a.y, d = s.width / a.x, v = s.height / a.y;
   if (l) {
-    const p = H(l), v = o && Z(o) ? H(o) : o;
-    let d = p, m = He(d);
-    for (; m && o && v !== d; ) {
-      const b = ve(m), C = m.getBoundingClientRect(), k = Q(m), S = C.left + (m.clientLeft + parseFloat(k.paddingLeft)) * b.x, O = C.top + (m.clientTop + parseFloat(k.paddingTop)) * b.y;
-      u *= b.x, c *= b.y, f *= b.x, i *= b.y, u += S, c += O, d = H(m), m = He(d);
+    const m = J(l), f = o && se(o) ? J(o) : o;
+    let u = m, h = Je(u);
+    for (; h && o && f !== u; ) {
+      const g = ke(h), C = h.getBoundingClientRect(), S = le(h), E = C.left + (h.clientLeft + parseFloat(S.paddingLeft)) * g.x, L = C.top + (h.clientTop + parseFloat(S.paddingTop)) * g.y;
+      i *= g.x, c *= g.y, d *= g.x, v *= g.y, i += E, c += L, u = J(h), h = Je(u);
     }
   }
-  return Oe({
-    width: f,
-    height: i,
-    x: u,
+  return Me({
+    width: d,
+    height: v,
+    x: i,
     y: c
   });
 }
-function Be(e, t) {
-  const n = Fe(e).scrollLeft;
-  return t ? t.left + n : ce(ee(e)).left + n;
+function Ue(e, n) {
+  const t = je(e).scrollLeft;
+  return n ? n.left + t : xe(ue(e)).left + t;
 }
-function ht(e, t) {
-  const n = e.getBoundingClientRect(), o = n.left + t.scrollLeft - Be(e, n), s = n.top + t.scrollTop;
+function At(e, n) {
+  const t = e.getBoundingClientRect(), o = t.left + n.scrollLeft - Ue(e, t), s = t.top + n.scrollTop;
   return {
     x: o,
     y: s
   };
 }
-function xn(e) {
+function Ln(e) {
   let {
-    elements: t,
-    rect: n,
+    elements: n,
+    rect: t,
     offsetParent: o,
     strategy: s
   } = e;
-  const l = s === "fixed", a = ee(o), r = t ? Le(t.floating) : !1;
+  const l = s === "fixed", a = ue(o), r = n ? ze(n.floating) : !1;
   if (o === a || r && l)
-    return n;
-  let u = {
+    return t;
+  let i = {
     scrollLeft: 0,
     scrollTop: 0
-  }, c = Y(1);
-  const f = Y(0), i = J(o);
-  if ((i || !i && !l) && ((ge(o) !== "body" || xe(a)) && (u = Fe(o)), J(o))) {
-    const v = ce(o);
-    c = ve(o), f.x = v.x + o.clientLeft, f.y = v.y + o.clientTop;
+  }, c = ie(1);
+  const d = ie(0), v = ce(o);
+  if ((v || !v && !l) && ((Ee(o) !== "body" || Ve(a)) && (i = je(o)), ce(o))) {
+    const f = xe(o);
+    c = ke(o), d.x = f.x + o.clientLeft, d.y = f.y + o.clientTop;
   }
-  const p = a && !i && !l ? ht(a, u) : Y(0);
+  const m = a && !v && !l ? At(a, i) : ie(0);
   return {
-    width: n.width * c.x,
-    height: n.height * c.y,
-    x: n.x * c.x - u.scrollLeft * c.x + f.x + p.x,
-    y: n.y * c.y - u.scrollTop * c.y + f.y + p.y
+    width: t.width * c.x,
+    height: t.height * c.y,
+    x: t.x * c.x - i.scrollLeft * c.x + d.x + m.x,
+    y: t.y * c.y - i.scrollTop * c.y + d.y + m.y
   };
 }
-function Cn(e) {
+function Pn(e) {
   return Array.from(e.getClientRects());
 }
-function kn(e) {
-  const t = ee(e), n = Fe(e), o = e.ownerDocument.body, s = ie(t.scrollWidth, t.clientWidth, o.scrollWidth, o.clientWidth), l = ie(t.scrollHeight, t.clientHeight, o.scrollHeight, o.clientHeight);
-  let a = -n.scrollLeft + Be(e);
-  const r = -n.scrollTop;
-  return Q(o).direction === "rtl" && (a += ie(t.clientWidth, o.clientWidth) - s), {
+function Dn(e) {
+  const n = ue(e), t = je(e), o = e.ownerDocument.body, s = we(n.scrollWidth, n.clientWidth, o.scrollWidth, o.clientWidth), l = we(n.scrollHeight, n.clientHeight, o.scrollHeight, o.clientHeight);
+  let a = -t.scrollLeft + Ue(e);
+  const r = -t.scrollTop;
+  return le(o).direction === "rtl" && (a += we(n.clientWidth, o.clientWidth) - s), {
     width: s,
     height: l,
     x: a,
     y: r
   };
 }
-const et = 25;
-function Rn(e, t) {
-  const n = H(e), o = ee(e), s = n.visualViewport;
-  let l = o.clientWidth, a = o.clientHeight, r = 0, u = 0;
+const ut = 25;
+function In(e, n) {
+  const t = J(e), o = ue(e), s = t.visualViewport;
+  let l = o.clientWidth, a = o.clientHeight, r = 0, i = 0;
   if (s) {
     l = s.width, a = s.height;
-    const f = We();
-    (!f || f && t === "fixed") && (r = s.offsetLeft, u = s.offsetTop);
+    const d = et();
+    (!d || d && n === "fixed") && (r = s.offsetLeft, i = s.offsetTop);
   }
-  const c = Be(o);
+  const c = Ue(o);
   if (c <= 0) {
-    const f = o.ownerDocument, i = f.body, p = getComputedStyle(i), v = f.compatMode === "CSS1Compat" && parseFloat(p.marginLeft) + parseFloat(p.marginRight) || 0, d = Math.abs(o.clientWidth - i.clientWidth - v);
-    d <= et && (l -= d);
-  } else c <= et && (l += c);
+    const d = o.ownerDocument, v = d.body, m = getComputedStyle(v), f = d.compatMode === "CSS1Compat" && parseFloat(m.marginLeft) + parseFloat(m.marginRight) || 0, u = Math.abs(o.clientWidth - v.clientWidth - f);
+    u <= ut && (l -= u);
+  } else c <= ut && (l += c);
   return {
     width: l,
     height: a,
     x: r,
-    y: u
+    y: i
   };
 }
-const Sn = /* @__PURE__ */ new Set(["absolute", "fixed"]);
-function Tn(e, t) {
-  const n = ce(e, !0, t === "fixed"), o = n.top + e.clientTop, s = n.left + e.clientLeft, l = J(e) ? ve(e) : Y(1), a = e.clientWidth * l.x, r = e.clientHeight * l.y, u = s * l.x, c = o * l.y;
+const qn = /* @__PURE__ */ new Set(["absolute", "fixed"]);
+function Mn(e, n) {
+  const t = xe(e, !0, n === "fixed"), o = t.top + e.clientTop, s = t.left + e.clientLeft, l = ce(e) ? ke(e) : ie(1), a = e.clientWidth * l.x, r = e.clientHeight * l.y, i = s * l.x, c = o * l.y;
   return {
     width: a,
     height: r,
-    x: u,
+    x: i,
     y: c
   };
 }
-function tt(e, t, n) {
+function dt(e, n, t) {
   let o;
-  if (t === "viewport")
-    o = Rn(e, n);
-  else if (t === "document")
-    o = kn(ee(e));
-  else if (Z(t))
-    o = Tn(t, n);
+  if (n === "viewport")
+    o = In(e, t);
+  else if (n === "document")
+    o = Dn(ue(e));
+  else if (se(n))
+    o = Mn(n, t);
   else {
-    const s = gt(e);
+    const s = $t(e);
     o = {
-      x: t.x - s.x,
-      y: t.y - s.y,
-      width: t.width,
-      height: t.height
+      x: n.x - s.x,
+      y: n.y - s.y,
+      width: n.width,
+      height: n.height
     };
   }
-  return Oe(o);
+  return Me(o);
 }
-function wt(e, t) {
-  const n = ae(e);
-  return n === t || !Z(n) || me(n) ? !1 : Q(n).position === "fixed" || wt(n, t);
+function Ft(e, n) {
+  const t = pe(e);
+  return t === n || !se(t) || Se(t) ? !1 : le(t).position === "fixed" || Ft(t, n);
 }
-function $n(e, t) {
-  const n = t.get(e);
-  if (n)
-    return n;
-  let o = be(e, [], !1).filter((r) => Z(r) && ge(r) !== "body"), s = null;
-  const l = Q(e).position === "fixed";
-  let a = l ? ae(e) : e;
-  for (; Z(a) && !me(a); ) {
-    const r = Q(a), u = Ke(a);
-    !u && r.position === "fixed" && (s = null), (l ? !u && !s : !u && r.position === "static" && !!s && Sn.has(s.position) || xe(a) && !u && wt(e, a)) ? o = o.filter((f) => f !== a) : s = r, a = ae(a);
+function Bn(e, n) {
+  const t = n.get(e);
+  if (t)
+    return t;
+  let o = Oe(e, [], !1).filter((r) => se(r) && Ee(r) !== "body"), s = null;
+  const l = le(e).position === "fixed";
+  let a = l ? pe(e) : e;
+  for (; se(a) && !Se(a); ) {
+    const r = le(a), i = _e(a);
+    !i && r.position === "fixed" && (s = null), (l ? !i && !s : !i && r.position === "static" && !!s && qn.has(s.position) || Ve(a) && !i && Ft(e, a)) ? o = o.filter((d) => d !== a) : s = r, a = pe(a);
   }
-  return t.set(e, o), o;
+  return n.set(e, o), o;
 }
-function Vn(e) {
+function Hn(e) {
   let {
-    element: t,
-    boundary: n,
+    element: n,
+    boundary: t,
     rootBoundary: o,
     strategy: s
   } = e;
-  const a = [...n === "clippingAncestors" ? Le(t) ? [] : $n(t, this._c) : [].concat(n), o], r = a[0], u = a.reduce((c, f) => {
-    const i = tt(t, f, s);
-    return c.top = ie(i.top, c.top), c.right = Te(i.right, c.right), c.bottom = Te(i.bottom, c.bottom), c.left = ie(i.left, c.left), c;
-  }, tt(t, r, s));
+  const a = [...t === "clippingAncestors" ? ze(n) ? [] : Bn(n, this._c) : [].concat(t), o], r = a[0], i = a.reduce((c, d) => {
+    const v = dt(n, d, s);
+    return c.top = we(v.top, c.top), c.right = De(v.right, c.right), c.bottom = De(v.bottom, c.bottom), c.left = we(v.left, c.left), c;
+  }, dt(n, r, s));
   return {
-    width: u.right - u.left,
-    height: u.bottom - u.top,
-    x: u.left,
-    y: u.top
+    width: i.right - i.left,
+    height: i.bottom - i.top,
+    x: i.left,
+    y: i.top
   };
 }
-function On(e) {
+function Wn(e) {
   const {
-    width: t,
-    height: n
-  } = mt(e);
+    width: n,
+    height: t
+  } = Et(e);
   return {
-    width: t,
-    height: n
+    width: n,
+    height: t
   };
 }
-function An(e, t, n) {
-  const o = J(t), s = ee(t), l = n === "fixed", a = ce(e, !0, l, t);
+function Nn(e, n, t) {
+  const o = ce(n), s = ue(n), l = t === "fixed", a = xe(e, !0, l, n);
   let r = {
     scrollLeft: 0,
     scrollTop: 0
   };
-  const u = Y(0);
+  const i = ie(0);
   function c() {
-    u.x = Be(s);
+    i.x = Ue(s);
   }
   if (o || !o && !l)
-    if ((ge(t) !== "body" || xe(s)) && (r = Fe(t)), o) {
-      const v = ce(t, !0, l, t);
-      u.x = v.x + t.clientLeft, u.y = v.y + t.clientTop;
+    if ((Ee(n) !== "body" || Ve(s)) && (r = je(n)), o) {
+      const f = xe(n, !0, l, n);
+      i.x = f.x + n.clientLeft, i.y = f.y + n.clientTop;
     } else s && c();
   l && !o && s && c();
-  const f = s && !o && !l ? ht(s, r) : Y(0), i = a.left + r.scrollLeft - u.x - f.x, p = a.top + r.scrollTop - u.y - f.y;
+  const d = s && !o && !l ? At(s, r) : ie(0), v = a.left + r.scrollLeft - i.x - d.x, m = a.top + r.scrollTop - i.y - d.y;
   return {
-    x: i,
-    y: p,
+    x: v,
+    y: m,
     width: a.width,
     height: a.height
   };
 }
-function qe(e) {
-  return Q(e).position === "static";
+function Qe(e) {
+  return le(e).position === "static";
 }
-function nt(e, t) {
-  if (!J(e) || Q(e).position === "fixed")
+function ft(e, n) {
+  if (!ce(e) || le(e).position === "fixed")
     return null;
-  if (t)
-    return t(e);
-  let n = e.offsetParent;
-  return ee(e) === n && (n = n.ownerDocument.body), n;
-}
-function yt(e, t) {
-  const n = H(e);
-  if (Le(e))
-    return n;
-  if (!J(e)) {
-    let s = ae(e);
-    for (; s && !me(s); ) {
-      if (Z(s) && !qe(s))
+  if (n)
+    return n(e);
+  let t = e.offsetParent;
+  return ue(e) === t && (t = t.ownerDocument.body), t;
+}
+function Tt(e, n) {
+  const t = J(e);
+  if (ze(e))
+    return t;
+  if (!ce(e)) {
+    let s = pe(e);
+    for (; s && !Se(s); ) {
+      if (se(s) && !Qe(s))
         return s;
-      s = ae(s);
+      s = pe(s);
     }
-    return n;
+    return t;
   }
-  let o = nt(e, t);
-  for (; o && fn(o) && qe(o); )
-    o = nt(o, t);
-  return o && me(o) && qe(o) && !Ke(o) ? n : o || hn(e) || n;
+  let o = ft(e, n);
+  for (; o && Sn(o) && Qe(o); )
+    o = ft(o, n);
+  return o && Se(o) && Qe(o) && !_e(o) ? t : o || Fn(e) || t;
 }
-const En = async function(e) {
-  const t = this.getOffsetParent || yt, n = this.getDimensions, o = await n(e.floating);
+const Kn = async function(e) {
+  const n = this.getOffsetParent || Tt, t = this.getDimensions, o = await t(e.floating);
   return {
-    reference: An(e.reference, await t(e.floating), e.strategy),
+    reference: Nn(e.reference, await n(e.floating), e.strategy),
     floating: {
       x: 0,
       y: 0,
@@ -987,123 +994,123 @@ const En = async function(e) {
     }
   };
 };
-function Pn(e) {
-  return Q(e).direction === "rtl";
-}
-const Dn = {
-  convertOffsetParentRelativeRectToViewportRelativeRect: xn,
-  getDocumentElement: ee,
-  getClippingRect: Vn,
-  getOffsetParent: yt,
-  getElementRects: En,
-  getClientRects: Cn,
-  getDimensions: On,
-  getScale: ve,
-  isElement: Z,
-  isRTL: Pn
+function zn(e) {
+  return le(e).direction === "rtl";
+}
+const jn = {
+  convertOffsetParentRelativeRectToViewportRelativeRect: Ln,
+  getDocumentElement: ue,
+  getClippingRect: Hn,
+  getOffsetParent: Tt,
+  getElementRects: Kn,
+  getClientRects: Pn,
+  getDimensions: Wn,
+  getScale: ke,
+  isElement: se,
+  isRTL: zn
 };
-function bt(e, t) {
-  return e.x === t.x && e.y === t.y && e.width === t.width && e.height === t.height;
+function Ot(e, n) {
+  return e.x === n.x && e.y === n.y && e.width === n.width && e.height === n.height;
 }
-function Ln(e, t) {
-  let n = null, o;
-  const s = ee(e);
+function Un(e, n) {
+  let t = null, o;
+  const s = ue(e);
   function l() {
     var r;
-    clearTimeout(o), (r = n) == null || r.disconnect(), n = null;
+    clearTimeout(o), (r = t) == null || r.disconnect(), t = null;
   }
-  function a(r, u) {
-    r === void 0 && (r = !1), u === void 0 && (u = 1), l();
+  function a(r, i) {
+    r === void 0 && (r = !1), i === void 0 && (i = 1), l();
     const c = e.getBoundingClientRect(), {
-      left: f,
-      top: i,
-      width: p,
-      height: v
+      left: d,
+      top: v,
+      width: m,
+      height: f
     } = c;
-    if (r || t(), !p || !v)
+    if (r || n(), !m || !f)
       return;
-    const d = Re(i), m = Re(s.clientWidth - (f + p)), b = Re(s.clientHeight - (i + v)), C = Re(f), S = {
-      rootMargin: -d + "px " + -m + "px " + -b + "px " + -C + "px",
-      threshold: ie(0, Te(1, u)) || 1
+    const u = Le(v), h = Le(s.clientWidth - (d + m)), g = Le(s.clientHeight - (v + f)), C = Le(d), E = {
+      rootMargin: -u + "px " + -h + "px " + -g + "px " + -C + "px",
+      threshold: we(0, De(1, i)) || 1
     };
-    let O = !0;
-    function A(M) {
-      const $ = M[0].intersectionRatio;
-      if ($ !== u) {
-        if (!O)
+    let L = !0;
+    function P(B) {
+      const b = B[0].intersectionRatio;
+      if (b !== i) {
+        if (!L)
           return a();
-        $ ? a(!1, $) : o = setTimeout(() => {
+        b ? a(!1, b) : o = setTimeout(() => {
           a(!1, 1e-7);
         }, 1e3);
       }
-      $ === 1 && !bt(c, e.getBoundingClientRect()) && a(), O = !1;
+      b === 1 && !Ot(c, e.getBoundingClientRect()) && a(), L = !1;
     }
     try {
-      n = new IntersectionObserver(A, {
-        ...S,
+      t = new IntersectionObserver(P, {
+        ...E,
         // Handle <iframe>s
         root: s.ownerDocument
       });
     } catch {
-      n = new IntersectionObserver(A, S);
+      t = new IntersectionObserver(P, E);
     }
-    n.observe(e);
+    t.observe(e);
   }
   return a(!0), l;
 }
-function Fn(e, t, n, o) {
+function Zn(e, n, t, o) {
   o === void 0 && (o = {});
   const {
     ancestorScroll: s = !0,
     ancestorResize: l = !0,
     elementResize: a = typeof ResizeObserver == "function",
     layoutShift: r = typeof IntersectionObserver == "function",
-    animationFrame: u = !1
-  } = o, c = Ue(e), f = s || l ? [...c ? be(c) : [], ...be(t)] : [];
-  f.forEach((C) => {
-    s && C.addEventListener("scroll", n, {
+    animationFrame: i = !1
+  } = o, c = tt(e), d = s || l ? [...c ? Oe(c) : [], ...Oe(n)] : [];
+  d.forEach((C) => {
+    s && C.addEventListener("scroll", t, {
       passive: !0
-    }), l && C.addEventListener("resize", n);
+    }), l && C.addEventListener("resize", t);
   });
-  const i = c && r ? Ln(c, n) : null;
-  let p = -1, v = null;
-  a && (v = new ResizeObserver((C) => {
-    let [k] = C;
-    k && k.target === c && v && (v.unobserve(t), cancelAnimationFrame(p), p = requestAnimationFrame(() => {
-      var S;
-      (S = v) == null || S.observe(t);
-    })), n();
-  }), c && !u && v.observe(c), v.observe(t));
-  let d, m = u ? ce(e) : null;
-  u && b();
-  function b() {
-    const C = ce(e);
-    m && !bt(m, C) && n(), m = C, d = requestAnimationFrame(b);
+  const v = c && r ? Un(c, t) : null;
+  let m = -1, f = null;
+  a && (f = new ResizeObserver((C) => {
+    let [S] = C;
+    S && S.target === c && f && (f.unobserve(n), cancelAnimationFrame(m), m = requestAnimationFrame(() => {
+      var E;
+      (E = f) == null || E.observe(n);
+    })), t();
+  }), c && !i && f.observe(c), f.observe(n));
+  let u, h = i ? xe(e) : null;
+  i && g();
+  function g() {
+    const C = xe(e);
+    h && !Ot(h, C) && t(), h = C, u = requestAnimationFrame(g);
   }
-  return n(), () => {
+  return t(), () => {
     var C;
-    f.forEach((k) => {
-      s && k.removeEventListener("scroll", n), l && k.removeEventListener("resize", n);
-    }), i?.(), (C = v) == null || C.disconnect(), v = null, u && cancelAnimationFrame(d);
+    d.forEach((S) => {
+      s && S.removeEventListener("scroll", t), l && S.removeEventListener("resize", t);
+    }), v?.(), (C = f) == null || C.disconnect(), f = null, i && cancelAnimationFrame(u);
   };
 }
-const Bn = rn, Mn = un, qn = sn, Nn = (e, t, n) => {
+const Xn = bn, Qn = xn, Yn = gn, Gn = (e, n, t) => {
   const o = /* @__PURE__ */ new Map(), s = {
-    platform: Dn,
-    ...n
+    platform: jn,
+    ...t
   }, l = {
     ...s.platform,
     _c: o
   };
-  return on(e, t, {
+  return pn(e, n, {
     ...s,
     platform: l
   });
-}, Ae = {
-  text: (e, t, n) => {
-    const o = String(e[t] ?? "").toLowerCase(), s = (n.value ?? "").toLowerCase().trim();
-    if (!s && !["empty", "notEmpty"].includes(n.operator ?? "")) return !0;
-    switch (n.operator) {
+}, Be = {
+  text: (e, n, t) => {
+    const o = String(e[n] ?? "").toLowerCase(), s = (t.value ?? "").toLowerCase().trim();
+    if (!s && !["empty", "notEmpty"].includes(t.operator ?? "")) return !0;
+    switch (t.operator) {
       case "contains":
         return o.includes(s);
       case "doesNotContains":
@@ -1124,34 +1131,34 @@ const Bn = rn, Mn = un, qn = sn, Nn = (e, t, n) => {
         return !0;
     }
   },
-  "multi-select": (e, t, n) => n.value?.length ? n.value.includes(String(e[t])) : !0,
-  "number-range": (e, t, n) => {
-    const o = Number(e[t]);
+  "multi-select": (e, n, t) => t.value?.length ? t.value.includes(String(e[n])) : !0,
+  "number-range": (e, n, t) => {
+    const o = Number(e[n]);
     if (isNaN(o)) return !1;
-    switch (n.operator) {
+    switch (t.operator) {
       case "between":
-        return !(n.min != null && o < n.min || n.max != null && o > n.max);
+        return !(t.min != null && o < t.min || t.max != null && o > t.max);
       case "equals":
-        return o === Number(n.value);
+        return o === Number(t.value);
       case "notEqual":
-        return o !== Number(n.value);
+        return o !== Number(t.value);
       case "greaterThan":
-        return o > Number(n.value);
+        return o > Number(t.value);
       case "lessThan":
-        return o < Number(n.value);
+        return o < Number(t.value);
       case "empty":
-        return e[t] == null || e[t] === "";
+        return e[n] == null || e[n] === "";
       case "notEmpty":
-        return e[t] != null && e[t] !== "";
+        return e[n] != null && e[n] !== "";
       default:
         return !0;
     }
   },
-  "date-range": (e, t, n) => {
-    const o = new Date(String(e[t]));
+  "date-range": (e, n, t) => {
+    const o = new Date(String(e[n]));
     if (isNaN(o.getTime())) return !1;
-    const s = n.value ?? null, l = n.start ? new Date(n.start) : null, a = n.end ? new Date(n.end) : null;
-    switch (n.operator ?? "between") {
+    const s = t.value ?? null, l = t.start ? new Date(t.start) : null, a = t.end ? new Date(t.end) : null;
+    switch (t.operator ?? "between") {
       case "between":
         return !(l && o < l || a && o > a);
       case "equals":
@@ -1163,56 +1170,56 @@ const Bn = rn, Mn = un, qn = sn, Nn = (e, t, n) => {
       case "after":
         return s ? o > new Date(s) : !0;
       case "empty":
-        return e[t] == null || e[t] === "";
+        return e[n] == null || e[n] === "";
       case "notEmpty":
-        return e[t] != null && e[t] !== "";
+        return e[n] != null && e[n] !== "";
       default:
         return !0;
     }
   },
   // Default handler for custom filters
-  custom: (e, t, n) => {
-    const o = e[t];
-    if (typeof n.filterFn == "function")
-      return n.filterFn(o, n.value, e);
-    if (n.filterKey && Object.prototype.hasOwnProperty.call(Ae, n.filterKey)) {
-      const s = Ae[n.filterKey];
+  custom: (e, n, t) => {
+    const o = e[n];
+    if (typeof t.filterFn == "function")
+      return t.filterFn(o, t.value, e);
+    if (t.filterKey && Object.prototype.hasOwnProperty.call(Be, t.filterKey)) {
+      const s = Be[t.filterKey];
       if (typeof s == "function")
-        return s(e, t, n);
+        return s(e, n, t);
     }
     return !0;
   }
 };
-function pe(e, t) {
-  const n = {
-    operator: t?.operator,
-    value: t?.value ?? null
+function Ce(e, n) {
+  const t = {
+    operator: n?.operator,
+    value: n?.value ?? null
   };
   switch (e) {
     case "text": {
       const s = { type: e, value: "", operator: "contains" };
-      return t?.type === "text" ? { ...s, ...t } : s;
+      return n?.type === "text" ? { ...s, ...n } : s;
     }
     case "multi-select": {
       const s = { type: e, value: [], operator: "in" };
-      return t?.type === "multi-select" ? { ...s, ...t } : s;
+      return n?.type === "multi-select" ? { ...s, ...n } : s;
     }
     case "number-range": {
       const s = { type: e, operator: "between", value: null, min: null, max: null };
-      return t?.type === "number-range" ? { ...s, ...t } : s;
+      return n?.type === "number-range" ? { ...s, ...n } : s;
     }
     case "date-range": {
       const s = { type: e, operator: "between", value: null, start: null, end: null };
-      return t?.type === "date-range" ? { ...s, ...t } : s;
+      return n?.type === "date-range" ? { ...s, ...n } : s;
     }
     case "custom":
-      const o = { type: e, value: null, operator: n.operator ?? "equals", custom: "", filterFn: void 0 };
-      return t?.type === "custom" ? { ...o, ...t } : o;
+      const o = { type: e, value: null, operator: t.operator ?? "equals", custom: "", filterFn: void 0 };
+      return n?.type === "custom" ? { ...o, ...n } : o;
     default:
       throw new Error(`Unsupported filter type: ${e}`);
   }
 }
-function ot(e) {
+function vt(e) {
   switch (e.type) {
     case "text":
       return e.operator ? ["empty", "notEmpty"].includes(e.operator || "") ? !0 : !!e.value?.trim() : !1;
@@ -1228,7 +1235,7 @@ function ot(e) {
       return !1;
   }
 }
-const In = _({
+const Jn = _({
   name: "VsDFlex",
   inheritAttrs: !1,
   props: {
@@ -1239,36 +1246,36 @@ const In = _({
     gap: [String, Number],
     responsive: Object
   },
-  setup(e, { attrs: t }) {
-    const n = (s, l) => `${s}-${l}`;
-    return { flexClasses: T(() => {
+  setup(e, { attrs: n }) {
+    const t = (s, l) => `${s}-${l}`;
+    return { flexClasses: F(() => {
       const s = ["vs-d-flex"];
-      return e.direction && s.push(n("vs-row", e.direction)), e.justify && s.push(n("vs-justify", e.justify)), e.align && s.push(n("vs-align", e.align)), e.wrap !== void 0 && s.push(e.wrap ? "vs-wrap" : "vs-nowrap"), e.gap && s.push(n("vs-gap", e.gap)), Object.entries(e.responsive || {}).forEach(([l, a]) => {
+      return e.direction && s.push(t("vs-row", e.direction)), e.justify && s.push(t("vs-justify", e.justify)), e.align && s.push(t("vs-align", e.align)), e.wrap !== void 0 && s.push(e.wrap ? "vs-wrap" : "vs-nowrap"), e.gap && s.push(t("vs-gap", e.gap)), Object.entries(e.responsive || {}).forEach(([l, a]) => {
         const r = l + ":";
-        a.direction && s.push(r + n("vs-row", a.direction)), a.justify && s.push(r + n("vs-justify", a.justify)), a.align && s.push(r + n("vs-align", a.align)), a.wrap !== void 0 && s.push(r + (a.wrap ? "vs-wrap" : "vs-nowrap")), a.gap && s.push(r + n("vs-gap", a.gap));
+        a.direction && s.push(r + t("vs-row", a.direction)), a.justify && s.push(r + t("vs-justify", a.justify)), a.align && s.push(r + t("vs-align", a.align)), a.wrap !== void 0 && s.push(r + (a.wrap ? "vs-wrap" : "vs-nowrap")), a.gap && s.push(r + t("vs-gap", a.gap));
       }), s;
-    }), attrs: t };
+    }), attrs: n };
   }
 });
-function Hn(e, t, n, o, s, l) {
-  return h(), w("div", xt({ class: e.flexClasses }, e.attrs), [
-    q(e.$slots, "default")
+function _n(e, n, t, o, s, l) {
+  return y(), k("div", Ae({ class: e.flexClasses }, e.attrs), [
+    z(e.$slots, "default")
   ], 16);
 }
-const re = /* @__PURE__ */ ne(In, [["render", Hn]]), Kn = { class: "vs-multiselect" }, Wn = { class: "vs-multiselect-actions" }, Un = {
+const ye = /* @__PURE__ */ ae(Jn, [["render", _n]]), eo = { class: "vs-multiselect" }, to = { class: "vs-multiselect-actions" }, no = {
   key: 0,
   class: "vs-py-4 vs-text-center vs-text-primary"
-}, jn = {
+}, oo = {
   key: 1,
   class: "vs-multiselect-options"
-}, zn = ["onClick"], Zn = { class: "option-label" }, Qn = {
+}, so = ["onClick"], lo = { class: "option-label" }, ao = {
   key: 0,
   xmlns: "http://www.w3.org/2000/svg",
   class: "check-icon",
   fill: "none",
   viewBox: "0 0 24 24",
   stroke: "currentColor"
-}, Xn = /* @__PURE__ */ _({
+}, ro = /* @__PURE__ */ _({
   __name: "VsMultiSelect",
   props: {
     columnData: {},
@@ -1276,81 +1283,81 @@ const re = /* @__PURE__ */ ne(In, [["render", Hn]]), Kn = { class: "vs-multisele
     isLoading: { type: Boolean }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: t }) {
-    const n = e, o = t, s = L(""), l = L([...n.modelValue ?? []]), a = T(() => {
-      const v = new Set(n.columnData.filter(Boolean));
-      return Array.from(v);
-    }), r = T(() => {
-      const v = s.value.toLowerCase();
-      return a.value.filter((d) => d.toString().toLowerCase().includes(v));
-    }), u = T(() => l.value.length), c = T(() => a.value.length - l.value.length), f = (v) => {
-      const d = l.value.indexOf(v);
-      d > -1 ? l.value.splice(d, 1) : l.value.push(v), o("update:modelValue", [...l.value]);
-    }, i = () => {
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = q(""), l = q([...t.modelValue ?? []]), a = F(() => {
+      const f = new Set(t.columnData.filter(Boolean));
+      return Array.from(f);
+    }), r = F(() => {
+      const f = s.value.toLowerCase();
+      return a.value.filter((u) => u.toString().toLowerCase().includes(f));
+    }), i = F(() => l.value.length), c = F(() => a.value.length - l.value.length), d = (f) => {
+      const u = l.value.indexOf(f);
+      u > -1 ? l.value.splice(u, 1) : l.value.push(f), o("update:modelValue", [...l.value]);
+    }, v = () => {
       l.value = [...a.value], o("update:modelValue", [...l.value]);
-    }, p = () => {
+    }, m = () => {
       l.value = [], o("update:modelValue", []);
     };
-    return G(
-      () => n.modelValue,
-      (v) => {
-        l.value = [...v || []];
+    return Y(
+      () => t.modelValue,
+      (f) => {
+        l.value = [...f || []];
       }
-    ), (v, d) => (h(), w("div", Kn, [
-      g("div", Wn, [
-        g("button", {
-          onClick: le(i, ["stop"])
-        }, "Select All (" + D(c.value) + ")", 1),
-        g("button", {
-          onClick: le(p, ["stop"])
-        }, "Deselect All (" + D(u.value) + ")", 1)
+    ), (f, u) => (y(), k("div", eo, [
+      w("div", to, [
+        w("button", {
+          onClick: me(v, ["stop"])
+        }, "Select All (" + H(c.value) + ")", 1),
+        w("button", {
+          onClick: me(m, ["stop"])
+        }, "Deselect All (" + H(i.value) + ")", 1)
       ]),
-      j(re, { direction: "row" }, {
-        default: I(() => [
-          U(g("input", {
+      ne(ye, { direction: "row" }, {
+        default: X(() => [
+          te(w("input", {
             type: "text",
-            "onUpdate:modelValue": d[0] || (d[0] = (m) => s.value = m),
+            "onUpdate:modelValue": u[0] || (u[0] = (h) => s.value = h),
             placeholder: "Search...",
             class: "vs-multiselect-search vs-w-full"
           }, null, 512), [
-            [oe, s.value]
+            [ve, s.value]
           ])
         ]),
         _: 1
       }),
-      e.isLoading ? (h(), w("div", Un, "Loading options...")) : (h(), w("ul", jn, [
-        (h(!0), w(K, null, z(r.value, (m) => (h(), w("li", {
-          key: m,
-          onClick: le((b) => f(m), ["stop"]),
-          class: W({ selected: l.value.includes(m) })
+      e.isLoading ? (y(), k("div", no, "Loading options...")) : (y(), k("ul", oo, [
+        (y(!0), k(K, null, Q(r.value, (h) => (y(), k("li", {
+          key: h,
+          onClick: me((g) => d(h), ["stop"]),
+          class: G({ selected: l.value.includes(h) })
         }, [
-          g("span", Zn, D(m), 1),
-          l.value.includes(m) ? (h(), w("svg", Qn, [...d[1] || (d[1] = [
-            g("path", {
+          w("span", lo, H(h), 1),
+          l.value.includes(h) ? (y(), k("svg", ao, [...u[1] || (u[1] = [
+            w("path", {
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
               "stroke-width": "2",
               d: "M5 13l4 4L19 7"
             }, null, -1)
-          ])])) : P("", !0)
-        ], 10, zn))), 128))
+          ])])) : D("", !0)
+        ], 10, so))), 128))
       ]))
     ]));
   }
-}), Se = /* @__PURE__ */ new Map();
-function Yn(e) {
-  const t = L(e.columnData || []), n = L(!1), o = () => n.value = !0, s = () => n.value = !1;
+}), Pe = /* @__PURE__ */ new Map();
+function io(e) {
+  const n = q(e.columnData || []), t = q(!1), o = () => t.value = !0, s = () => t.value = !1;
   async function l(r = !1) {
     if (!e.asyncOptions) return;
-    const u = e.cacheKey ?? "default";
-    if (!r && Se.has(u)) {
-      t.value = Se.get(u);
+    const i = e.cacheKey ?? "default";
+    if (!r && Pe.has(i)) {
+      n.value = Pe.get(i);
       return;
     }
     try {
       o();
-      const c = await e.asyncOptions(), f = Array.isArray(c) ? c : [];
-      t.value = f, Se.set(u, f);
+      const c = await e.asyncOptions(), d = Array.isArray(c) ? c : [];
+      n.value = d, Pe.set(i, d);
     } catch (c) {
       console.error("Failed to load async filter options:", c);
     } finally {
@@ -1359,43 +1366,43 @@ function Yn(e) {
   }
   function a() {
     const r = e.cacheKey ?? "default";
-    Se.delete(r);
+    Pe.delete(r);
   }
   return {
-    columnOrAsyncOptions: t,
-    isLoading: n,
+    columnOrAsyncOptions: n,
+    isLoading: t,
     clearCache: a,
     loadAsyncOptions: l
   };
 }
-const Gn = {
+const co = {
   key: 0,
   class: "vs-filter-text"
-}, Jn = {
+}, uo = {
   key: 0,
   class: "vs-pb-sm"
-}, _n = ["value"], eo = {
+}, fo = ["value"], vo = {
   key: 1,
   class: "vs-filter-multi"
-}, to = {
+}, ho = {
   key: 2,
   class: "vs-filter-range"
-}, no = {
+}, mo = {
   key: 0,
   class: "vs-pb-sm"
-}, oo = ["value"], so = { key: 1 }, lo = { class: "vs-operator-fixed" }, ao = { key: 4 }, ro = {
+}, po = ["value"], go = { key: 1 }, yo = { class: "vs-operator-fixed" }, wo = { key: 4 }, bo = {
   key: 3,
   class: "vs-filter-date"
-}, io = {
+}, xo = {
   key: 0,
   class: "vs-pb-sm"
-}, uo = ["value"], co = { key: 1 }, fo = { class: "vs-operator-fixed" }, vo = {
+}, ko = ["value"], Co = { key: 1 }, So = { class: "vs-operator-fixed" }, Ro = {
   key: 4,
   class: "vs-muted vs-text-center vs-pt-sm"
-}, po = {
+}, Eo = {
   key: 4,
   class: "vs-filter-actions"
-}, mo = /* @__PURE__ */ _({
+}, $o = /* @__PURE__ */ _({
   __name: "VsDataTableFilterDropdown",
   props: {
     modelValue: {},
@@ -1407,11 +1414,11 @@ const Gn = {
     asyncOptions: {}
   },
   emits: ["update:modelValue", "apply", "clear", "open", "close"],
-  setup(e, { emit: t }) {
-    const n = e, o = t, { columnOrAsyncOptions: s, isLoading: l, loadAsyncOptions: a } = Yn({
-      asyncOptions: n.asyncOptions,
-      columnData: n.columnData,
-      cacheKey: n.field
+  setup(e, { emit: n }) {
+    const t = e, o = n, { columnOrAsyncOptions: s, isLoading: l, loadAsyncOptions: a } = io({
+      asyncOptions: t.asyncOptions,
+      columnData: t.columnData,
+      cacheKey: t.field
     }), r = {
       text: [
         "contains",
@@ -1428,8 +1435,8 @@ const Gn = {
       "date-range": ["between", "equals", "notEqual", "before", "after", "empty", "notEmpty"],
       custom: []
     };
-    function u($) {
-      switch ($) {
+    function i(b) {
+      switch (b) {
         case "notEqual":
           return "Not Equal";
         case "greaterThan":
@@ -1447,330 +1454,463 @@ const Gn = {
         case "notEmpty":
           return "Not Empty";
         default:
-          return $.charAt(0).toUpperCase() + $.slice(1);
+          return b.charAt(0).toUpperCase() + b.slice(1);
       }
     }
-    const c = T(() => n.type === "custom" ? [] : n.operators?.length ? n.operators : r[n.type]), f = L(null), i = L(null), p = L(), v = L(!1);
-    G(
-      () => n.visible,
-      async ($) => {
-        v.value = !!$, v.value ? (await Ct(), S(), n.asyncOptions && a()) : O();
+    const c = F(() => t.type === "custom" ? [] : t.operators?.length ? t.operators : r[t.type]), d = q(null), v = q(null), m = q(), f = q(!1);
+    Y(
+      () => t.visible,
+      async (b) => {
+        f.value = !!b, f.value ? (await oe(), E(), t.asyncOptions && a()) : L();
       },
       { immediate: !0 }
     );
-    const d = L(pe(n.type, n.modelValue));
-    G(
-      () => n.modelValue,
-      ($) => {
-        d.value = pe(n.type, $);
+    const u = q(Ce(t.type, t.modelValue));
+    Y(
+      () => t.modelValue,
+      (b) => {
+        u.value = Ce(t.type, b);
       },
       { immediate: !0 }
     );
-    function m() {
+    function h() {
       o("open");
     }
-    function b() {
-      o("update:modelValue", { ...d.value }), o("apply", { ...d.value });
+    function g() {
+      o("update:modelValue", { ...u.value }), o("apply", { ...u.value });
     }
     function C() {
-      d.value = pe(n.type), o("update:modelValue", { ...d.value }), o("clear"), k();
+      u.value = Ce(t.type), o("update:modelValue", { ...u.value }), o("clear"), S();
     }
-    function k() {
+    function S() {
       o("close");
     }
-    function S() {
-      !f.value || !i.value || (p.value = Fn(f.value, i.value, () => {
-        Nn(f.value, i.value, {
+    function E() {
+      !d.value || !v.value || (m.value = Zn(d.value, v.value, () => {
+        Gn(d.value, v.value, {
           placement: "bottom-start",
-          middleware: [Bn(6), qn(), Mn({ padding: 8 })]
-        }).then(({ x: $, y: x }) => {
-          Object.assign(i.value.style, {
-            left: `${$}px`,
-            top: `${x}px`,
+          middleware: [Xn(6), Yn(), Qn({ padding: 8 })]
+        }).then(({ x: b, y: p }) => {
+          Object.assign(v.value.style, {
+            left: `${b}px`,
+            top: `${p}px`,
             position: "absolute",
             zIndex: 2e3
           });
         });
       }));
     }
-    function O() {
-      p.value?.(), p.value = void 0;
+    function L() {
+      m.value?.(), m.value = void 0;
     }
-    function A($) {
-      const x = $.target;
-      v.value && f.value && i.value && !f.value.contains(x) && !i.value.contains(x) && k();
+    function P(b) {
+      const p = b.target;
+      f.value && d.value && v.value && !d.value.contains(p) && !v.value.contains(p) && S();
     }
-    function M($) {
-      $.key === "Escape" && v.value && k();
+    function B(b) {
+      b.key === "Escape" && f.value && S();
     }
-    return st(() => {
-      document.addEventListener("click", A), document.addEventListener("keydown", M);
-    }), lt(() => {
-      document.removeEventListener("click", A), document.removeEventListener("keydown", M), O();
-    }), ($, x) => (h(), w(K, null, [
-      g("span", {
+    return Re(() => {
+      document.addEventListener("click", P), document.addEventListener("keydown", B);
+    }), mt(() => {
+      document.removeEventListener("click", P), document.removeEventListener("keydown", B), L();
+    }), (b, p) => (y(), k(K, null, [
+      w("span", {
         ref_key: "referenceRef",
-        ref: f,
-        class: W(["vs-column-filter", {
-          "is-active": R(ot)(d.value),
-          "in-active": !R(ot)(d.value)
+        ref: d,
+        class: G(["vs-column-filter", {
+          "is-active": $(vt)(u.value),
+          "in-active": !$(vt)(u.value)
         }]),
-        onClick: le(m, ["stop"])
-      }, [...x[13] || (x[13] = [
-        g("svg", {
+        onClick: me(h, ["stop"])
+      }, [...p[13] || (p[13] = [
+        w("svg", {
           xmlns: "http://www.w3.org/2000/svg",
           height: "24px",
           viewBox: "0 -960 960 960",
           width: "24px",
           fill: "currentColor"
         }, [
-          g("path", { d: "M440-160q-17 0-28.5-11.5T400-200v-240L168-736q-15-20-4.5-42t36.5-22h560q26 0 36.5 22t-4.5 42L560-440v240q0 17-11.5 28.5T520-160h-80Zm40-308 198-252H282l198 252Zm0 0Z" })
+          w("path", { d: "M400-240v-80h160v80H400ZM240-440v-80h480v80H240ZM120-640v-80h720v80H120Z" })
         ], -1)
       ])], 2),
-      (h(), fe(kt, { to: "body" }, [
-        j(Rt, { name: "fade" }, {
-          default: I(() => [
-            v.value ? (h(), w("div", {
+      (y(), fe(Dt, { to: "body" }, [
+        ne(It, { name: "fade" }, {
+          default: X(() => [
+            f.value ? (y(), k("div", {
               key: 0,
               ref_key: "floatingRef",
-              ref: i,
+              ref: v,
               class: "vs-filter-dropdown",
               style: { position: "absolute", "z-index": "1000" },
-              onClick: x[12] || (x[12] = le(() => {
+              onClick: p[12] || (p[12] = me(() => {
               }, ["stop"]))
             }, [
-              d.value.type === "text" ? (h(), w("div", Gn, [
-                c.value.length > 1 ? (h(), w("div", Jn, [
-                  U(g("select", {
-                    "onUpdate:modelValue": x[0] || (x[0] = (y) => d.value.operator = y),
+              u.value.type === "text" ? (y(), k("div", co, [
+                c.value.length > 1 ? (y(), k("div", uo, [
+                  te(w("select", {
+                    "onUpdate:modelValue": p[0] || (p[0] = (x) => u.value.operator = x),
                     class: "vs-operator-select vs-mx-auto vs-w-full"
                   }, [
-                    (h(!0), w(K, null, z(c.value, (y) => (h(), w("option", {
-                      key: y,
-                      value: y
-                    }, D(u(y)), 9, _n))), 128))
+                    (y(!0), k(K, null, Q(c.value, (x) => (y(), k("option", {
+                      key: x,
+                      value: x
+                    }, H(i(x)), 9, fo))), 128))
                   ], 512), [
-                    [Me, d.value.operator]
+                    [Xe, u.value.operator]
                   ])
-                ])) : P("", !0),
-                j(re, {
+                ])) : D("", !0),
+                ne(ye, {
                   direction: "row",
                   class: "mb-6"
                 }, {
-                  default: I(() => [
-                    U(g("input", {
+                  default: X(() => [
+                    te(w("input", {
                       type: "text",
-                      "onUpdate:modelValue": x[1] || (x[1] = (y) => d.value.value = y),
+                      "onUpdate:modelValue": p[1] || (p[1] = (x) => u.value.value = x),
                       placeholder: "Search...",
                       class: "vs-input vs-mx-auto vs-w-full"
                     }, null, 512), [
-                      [oe, d.value.value]
+                      [ve, u.value.value]
                     ])
                   ]),
                   _: 1
                 })
-              ])) : d.value.type === "multi-select" ? (h(), w("div", eo, [
-                j(re, {
+              ])) : u.value.type === "multi-select" ? (y(), k("div", vo, [
+                ne(ye, {
                   direction: "row",
                   class: "mb-6 vs-align-center vs-justify-end"
                 }, {
-                  default: I(() => [
-                    e.asyncOptions ? (h(), w("span", {
+                  default: X(() => [
+                    e.asyncOptions ? (y(), k("span", {
                       key: 0,
-                      onClick: x[2] || (x[2] = (y) => R(a)(!0)),
+                      onClick: p[2] || (p[2] = (x) => $(a)(!0)),
                       class: "vs-cursor-pointer"
-                    }, [...x[14] || (x[14] = [
-                      g("svg", {
+                    }, [...p[14] || (p[14] = [
+                      w("svg", {
                         xmlns: "http://www.w3.org/2000/svg",
                         height: "24px",
                         viewBox: "0 -960 960 960",
                         width: "24px",
                         fill: "var(--vs-inactive)"
                       }, [
-                        g("path", { d: "M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z" })
+                        w("path", { d: "M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z" })
                       ], -1)
-                    ])])) : P("", !0)
+                    ])])) : D("", !0)
                   ]),
                   _: 1
                 }),
-                j(Xn, {
-                  isLoading: R(l),
-                  columnData: R(s),
-                  modelValue: d.value.value,
-                  "onUpdate:modelValue": x[3] || (x[3] = (y) => d.value.value = y),
+                ne(ro, {
+                  isLoading: $(l),
+                  columnData: $(s),
+                  modelValue: u.value.value,
+                  "onUpdate:modelValue": p[3] || (p[3] = (x) => u.value.value = x),
                   placeholder: "Select values..."
                 }, null, 8, ["isLoading", "columnData", "modelValue"])
-              ])) : d.value.type === "number-range" ? (h(), w("div", to, [
-                c.value.length > 1 ? (h(), w("div", no, [
-                  U(g("select", {
-                    "onUpdate:modelValue": x[4] || (x[4] = (y) => d.value.operator = y),
+              ])) : u.value.type === "number-range" ? (y(), k("div", ho, [
+                c.value.length > 1 ? (y(), k("div", mo, [
+                  te(w("select", {
+                    "onUpdate:modelValue": p[4] || (p[4] = (x) => u.value.operator = x),
                     class: "vs-operator-select vs-w-full"
                   }, [
-                    (h(!0), w(K, null, z(c.value, (y) => (h(), w("option", {
-                      key: y,
-                      value: y
-                    }, D(u(y)), 9, oo))), 128))
+                    (y(!0), k(K, null, Q(c.value, (x) => (y(), k("option", {
+                      key: x,
+                      value: x
+                    }, H(i(x)), 9, po))), 128))
                   ], 512), [
-                    [Me, d.value.operator]
+                    [Xe, u.value.operator]
                   ])
-                ])) : (h(), w("div", so, [
-                  g("span", lo, D(d.value.operator), 1)
+                ])) : (y(), k("div", go, [
+                  w("span", yo, H(u.value.operator), 1)
                 ])),
-                d.value.operator === "between" ? (h(), fe(re, {
+                u.value.operator === "between" ? (y(), fe(ye, {
                   key: 2,
                   justify: "between",
                   align: "center",
                   gap: "4",
                   class: "mb-6"
                 }, {
-                  default: I(() => [
-                    U(g("input", {
+                  default: X(() => [
+                    te(w("input", {
                       type: "number",
-                      "onUpdate:modelValue": x[5] || (x[5] = (y) => d.value.min = y),
+                      "onUpdate:modelValue": p[5] || (p[5] = (x) => u.value.min = x),
                       placeholder: "Min",
                       class: "vs-input vs-w-full"
                     }, null, 512), [
                       [
-                        oe,
-                        d.value.min,
+                        ve,
+                        u.value.min,
                         void 0,
                         { number: !0 }
                       ]
                     ]),
-                    x[15] || (x[15] = g("span", null, "-", -1)),
-                    U(g("input", {
+                    p[15] || (p[15] = w("span", null, "-", -1)),
+                    te(w("input", {
                       type: "number",
-                      "onUpdate:modelValue": x[6] || (x[6] = (y) => d.value.max = y),
+                      "onUpdate:modelValue": p[6] || (p[6] = (x) => u.value.max = x),
                       placeholder: "Max",
                       class: "vs-input vs-w-full"
                     }, null, 512), [
                       [
-                        oe,
-                        d.value.max,
+                        ve,
+                        u.value.max,
                         void 0,
                         { number: !0 }
                       ]
                     ])
                   ]),
                   _: 1
-                })) : ["equals", "notEqual", "greaterThan", "lessThan"].includes(d.value.operator || "") ? (h(), fe(re, {
+                })) : ["equals", "notEqual", "greaterThan", "lessThan"].includes(u.value.operator || "") ? (y(), fe(ye, {
                   key: 3,
                   direction: "row"
                 }, {
-                  default: I(() => [
-                    U(g("input", {
+                  default: X(() => [
+                    te(w("input", {
                       type: "number",
-                      "onUpdate:modelValue": x[7] || (x[7] = (y) => d.value.value = y),
+                      "onUpdate:modelValue": p[7] || (p[7] = (x) => u.value.value = x),
                       placeholder: "Enter number",
                       class: "vs-input vs-w-full"
                     }, null, 512), [
                       [
-                        oe,
-                        d.value.value,
+                        ve,
+                        u.value.value,
                         void 0,
                         { number: !0 }
                       ]
                     ])
                   ]),
                   _: 1
-                })) : ["empty", "notEmpty"].includes(d.value.operator || "") ? (h(), w("div", ao, [...x[16] || (x[16] = [
-                  g("div", { class: "vs-muted vs-text-center vs-pt-sm" }, "No input required", -1)
-                ])])) : P("", !0)
-              ])) : d.value.type === "date-range" ? (h(), w("div", ro, [
-                c.value.length > 1 ? (h(), w("div", io, [
-                  U(g("select", {
-                    "onUpdate:modelValue": x[8] || (x[8] = (y) => d.value.operator = y),
+                })) : ["empty", "notEmpty"].includes(u.value.operator || "") ? (y(), k("div", wo, [...p[16] || (p[16] = [
+                  w("div", { class: "vs-muted vs-text-center vs-pt-sm" }, "No input required", -1)
+                ])])) : D("", !0)
+              ])) : u.value.type === "date-range" ? (y(), k("div", bo, [
+                c.value.length > 1 ? (y(), k("div", xo, [
+                  te(w("select", {
+                    "onUpdate:modelValue": p[8] || (p[8] = (x) => u.value.operator = x),
                     class: "vs-operator-select vs-w-full"
                   }, [
-                    (h(!0), w(K, null, z(c.value, (y) => (h(), w("option", {
-                      key: y,
-                      value: y
-                    }, D(u(y)), 9, uo))), 128))
+                    (y(!0), k(K, null, Q(c.value, (x) => (y(), k("option", {
+                      key: x,
+                      value: x
+                    }, H(i(x)), 9, ko))), 128))
                   ], 512), [
-                    [Me, d.value.operator]
+                    [Xe, u.value.operator]
                   ])
-                ])) : (h(), w("div", co, [
-                  g("span", fo, D(d.value.operator), 1)
+                ])) : (y(), k("div", Co, [
+                  w("span", So, H(u.value.operator), 1)
                 ])),
-                d.value.operator === "between" ? (h(), fe(re, {
+                u.value.operator === "between" ? (y(), fe(ye, {
                   key: 2,
                   justify: "between",
                   align: "center",
                   gap: "4",
                   class: "mb-6"
                 }, {
-                  default: I(() => [
-                    U(g("input", {
+                  default: X(() => [
+                    te(w("input", {
                       type: "date",
-                      "onUpdate:modelValue": x[9] || (x[9] = (y) => d.value.start = y),
+                      "onUpdate:modelValue": p[9] || (p[9] = (x) => u.value.start = x),
                       class: "vs-input vs-w-full"
                     }, null, 512), [
-                      [oe, d.value.start]
+                      [ve, u.value.start]
                     ]),
-                    x[17] || (x[17] = g("span", null, "-", -1)),
-                    U(g("input", {
+                    p[17] || (p[17] = w("span", null, "-", -1)),
+                    te(w("input", {
                       type: "date",
-                      "onUpdate:modelValue": x[10] || (x[10] = (y) => d.value.end = y),
+                      "onUpdate:modelValue": p[10] || (p[10] = (x) => u.value.end = x),
                       class: "vs-input vs-w-full"
                     }, null, 512), [
-                      [oe, d.value.end]
+                      [ve, u.value.end]
                     ])
                   ]),
                   _: 1
-                })) : ["equals", "notEqual", "before", "after"].includes(d.value.operator || "") ? (h(), fe(re, {
+                })) : ["equals", "notEqual", "before", "after"].includes(u.value.operator || "") ? (y(), fe(ye, {
                   key: 3,
                   direction: "row",
                   class: "vs-filter-single-date"
                 }, {
-                  default: I(() => [
-                    U(g("input", {
+                  default: X(() => [
+                    te(w("input", {
                       type: "date",
-                      "onUpdate:modelValue": x[11] || (x[11] = (y) => d.value.value = y),
+                      "onUpdate:modelValue": p[11] || (p[11] = (x) => u.value.value = x),
                       class: "vs-input vs-w-full"
                     }, null, 512), [
-                      [oe, d.value.value]
+                      [ve, u.value.value]
                     ])
                   ]),
                   _: 1
-                })) : ["empty", "notEmpty"].includes(d.value.operator || "") ? (h(), w("div", vo, " No date input required ")) : P("", !0)
-              ])) : P("", !0),
-              d.value.type !== "custom" ? (h(), w("div", po, [
-                g("button", {
+                })) : ["empty", "notEmpty"].includes(u.value.operator || "") ? (y(), k("div", Ro, " No date input required ")) : D("", !0)
+              ])) : D("", !0),
+              u.value.type !== "custom" ? (y(), k("div", Eo, [
+                w("button", {
                   class: "vs-btn vs-btn-primary",
-                  onClick: b
+                  onClick: g
                 }, "Apply"),
-                g("button", {
+                w("button", {
                   class: "vs-btn vs-btn-secondary",
                   onClick: C
                 }, "Clear")
-              ])) : P("", !0),
-              q($.$slots, "custom", {
-                filter: d.value,
-                apply: b,
+              ])) : D("", !0),
+              z(b.$slots, "custom", {
+                filter: u.value,
+                apply: g,
                 clear: C
               }, void 0, !0)
-            ], 512)) : P("", !0)
+            ], 512)) : D("", !0)
           ]),
           _: 3
         })
       ]))
     ], 64));
   }
-}), go = /* @__PURE__ */ ne(mo, [["__scopeId", "data-v-bdeb98d2"]]), ho = {
+}), Ao = /* @__PURE__ */ ae($o, [["__scopeId", "data-v-f4972f8b"]]), Fo = ["data-field", "rowspan"], To = { class: "vs-header-content" }, Oo = { class: "vs-header-label" }, Vo = {
+  key: 0,
+  class: "vs-sort-icons"
+}, Lo = {
+  key: 1,
+  class: "vs-sort-priority"
+}, Po = /* @__PURE__ */ _({
+  __name: "HeaderCell",
+  props: {
+    column: {},
+    rows: {},
+    rowspan: {},
+    sortHelpers: {},
+    filters: {},
+    openFilter: {},
+    headerClass: {},
+    tablename: {}
+  },
+  emits: ["applyFilter", "clearFilter", "openFilter", "closeFilter", "update:filters"],
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = F({
+      get: () => t.filters,
+      set: (v) => o("update:filters", v)
+    });
+    function l(v) {
+      t.column.sortable && t.column.field && t.sortHelpers.handleSort(t.column.field, v);
+    }
+    function a() {
+      return t.column.field ? t.rows.map((v) => v[t.column.field]) : [];
+    }
+    function r(v) {
+      t.column.field && o("applyFilter", t.column.field, v);
+    }
+    function i() {
+      t.column.field && o("clearFilter", t.column.field);
+    }
+    function c() {
+      t.column.field && o("closeFilter", t.column.field);
+    }
+    function d() {
+      t.column.field && o("openFilter", t.column.field);
+    }
+    return (v, m) => e.column && e.column.field ? (y(), k("th", {
+      key: 0,
+      onClick: l,
+      style: pt([
+        {
+          width: e.column.width + "%",
+          textAlign: "center"
+        }
+      ]),
+      "data-field": e.column.field || e.column.label,
+      rowspan: e.rowspan,
+      class: G(["vs-group-header", [
+        e.headerClass,
+        e.column.colHeaderClass,
+        e.column.sortable ? "vs-sortable" : ""
+      ]])
+    }, [
+      z(v.$slots, `header-${e.column.field}`, { column: e.column }, () => [
+        w("div", To, [
+          w("span", Oo, H(e.column.label), 1),
+          e.column.sortable ? (y(), k("div", Vo, [
+            w("span", {
+              class: G(["vs-sort-icon vs-sort-asc", {
+                "vs-active": e.sortHelpers.isColumnSorted(e.column.field) && e.sortHelpers.getSortOrder(e.column.field) === "asc"
+              }])
+            }, [...m[2] || (m[2] = [
+              w("svg", {
+                xmlns: "http://www.w3.org/2000/svg",
+                height: "24px",
+                viewBox: "0 -960 960 960",
+                width: "24px",
+                fill: "var(--vs-gray-800)"
+              }, [
+                w("path", { d: "m280-400 200-200 200 200H280Z" })
+              ], -1)
+            ])], 2),
+            w("span", {
+              class: G(["vs-sort-icon vs-sort-desc", {
+                "vs-active": e.sortHelpers.isColumnSorted(e.column.field) && e.sortHelpers.getSortOrder(e.column.field) === "desc"
+              }])
+            }, [...m[3] || (m[3] = [
+              w("svg", {
+                xmlns: "http://www.w3.org/2000/svg",
+                height: "24px",
+                viewBox: "0 -960 960 960",
+                width: "24px"
+              }, [
+                w("path", { d: "M480-360 280-560h400L480-360Z" })
+              ], -1)
+            ])], 2)
+          ])) : D("", !0),
+          e.sortHelpers.getSortPriority(e.column.field) !== null ? (y(), k("span", Lo, H(e.sortHelpers.getSortPriority(e.column.field)), 1)) : D("", !0),
+          e.column.filter ? (y(), fe(Ao, {
+            key: 2,
+            type: e.column.filter.type,
+            "async-options": e.column.filter.asyncOptions,
+            field: e.column.field,
+            operators: e.column.filter.operators,
+            modelValue: s.value[e.column.field],
+            "onUpdate:modelValue": m[0] || (m[0] = (f) => s.value[e.column.field] = f),
+            visible: e.openFilter === e.column.field,
+            "column-data": a(),
+            onApply: m[1] || (m[1] = (f) => r(f)),
+            onClear: i,
+            onClose: c,
+            onOpen: d
+          }, Te({ _: 2 }, [
+            e.column.filter.custom ? {
+              name: "custom",
+              fn: X(({ filter: f, apply: u, clear: h }) => [
+                z(v.$slots, e.column.filter.custom, {
+                  filter: f,
+                  apply: u,
+                  clear: h
+                }, void 0, !0)
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["type", "async-options", "field", "operators", "modelValue", "visible", "column-data"])) : D("", !0)
+        ])
+      ], !0)
+    ], 14, Fo)) : D("", !0);
+  }
+}), ht = /* @__PURE__ */ ae(Po, [["__scopeId", "data-v-69e5e343"]]), Do = { key: 0 }, Io = {
   key: 0,
   class: "vs-expand-column",
-  style: { width: "5%" }
-}, wo = {
+  rowspan: "2",
+  style: { width: "5%" },
+  "data-field": "_expand"
+}, qo = {
   key: 1,
   class: "vs-checkbox-column",
-  style: { width: "5%" }
-}, yo = { class: "vs-checkbox" }, bo = ["id", "checked", "indeterminate"], xo = ["for"], Co = ["onClick"], ko = { class: "vs-header-content" }, Ro = { class: "vs-header-label" }, So = {
+  rowspan: "2",
+  style: { width: "5%" },
+  "data-field": "_checkbox"
+}, Mo = { class: "vs-checkbox" }, Bo = ["id", "checked", "indeterminate"], Ho = ["for"], Wo = ["colspan", "data-field"], No = {
   key: 0,
-  class: "vs-sort-icons"
-}, To = {
+  class: "vs-expand-column",
+  style: { width: "5%" },
+  "data-field": "_expand"
+}, Ko = {
   key: 1,
-  class: "vs-sort-priority"
-}, $o = /* @__PURE__ */ _({
+  class: "vs-checkbox-column",
+  style: { width: "5%" },
+  "data-field": "_checkbox"
+}, zo = { class: "vs-checkbox" }, jo = ["id", "checked", "indeterminate"], Uo = ["for"], Zo = /* @__PURE__ */ _({
   __name: "VsDataTableHeader",
   props: {
     columns: {},
@@ -1786,123 +1926,140 @@ const Gn = {
     headerClass: {}
   },
   emits: ["toggleAll", "applyFilter", "clearFilter", "update:filters"],
-  setup(e, { emit: t }) {
-    const n = e, o = t;
-    function s(c) {
-      o("toggleAll", c);
+  setup(e, { emit: n }) {
+    const t = e, o = n;
+    function s(f) {
+      o("toggleAll", f);
+    }
+    const l = F({
+      get: () => t.filters,
+      set: (f) => o("update:filters", f)
+    }), a = q(null);
+    function r(f) {
+      a.value = f;
     }
-    const l = T({
-      get: () => n.filters,
-      set: (c) => o("update:filters", c)
-    }), a = L(null);
-    function r(c) {
-      a.value = c;
+    function i(f) {
+      a.value === f && (a.value = null);
     }
-    function u(c) {
-      a.value === c && (a.value = null);
+    const c = q(null), d = F(() => t.columns.some((f) => f.children && f.children.length)), v = F(() => {
+      const f = [];
+      return t.columns.forEach((u) => {
+        u.children && u.children.length ? f.push(...u.children) : f.push(u);
+      }), f;
+    });
+    function m(f) {
+      return d.value ? t.columns.some(
+        (u) => u.children && u.children.some((h) => h.field === f.field)
+      ) : !0;
     }
-    return (c, f) => (h(), w("thead", null, [
-      g("tr", null, [
-        e.expandable ? (h(), w("th", ho)) : P("", !0),
-        e.isItemSelectedControlled ? (h(), w("th", wo, [
-          g("div", yo, [
-            g("input", {
+    return (f, u) => (y(), k("thead", {
+      ref_key: "headerRef",
+      ref: c
+    }, [
+      d.value ? (y(), k("tr", Do, [
+        e.expandable ? (y(), k("th", Io)) : D("", !0),
+        e.isItemSelectedControlled ? (y(), k("th", qo, [
+          w("div", Mo, [
+            w("input", {
               type: "checkbox",
               id: e.tablename + "-main-checkbox",
               checked: e.isAllChecked,
               indeterminate: e.isSomeChecked,
               onChange: s
-            }, null, 40, bo),
-            g("label", {
+            }, null, 40, Bo),
+            w("label", {
               for: e.tablename + "-main-checkbox"
-            }, null, 8, xo)
+            }, null, 8, Ho)
           ])
-        ])) : P("", !0),
-        (h(!0), w(K, null, z(e.columns, (i) => (h(), w("th", {
-          key: i.field,
-          onClick: (p) => i.sortable ? e.sortHelpers.handleSort(i.field, p) : null,
-          style: St({ width: i.width + "%" }),
-          class: W([i.sortable ? "vs-sortable" : "", e.headerClass])
+        ])) : D("", !0),
+        (y(!0), k(K, null, Q(t.columns, (h) => (y(), k(K, {
+          key: h.field || h.label
         }, [
-          q(c.$slots, `header-${i.field}`, { column: i }, () => [
-            g("div", ko, [
-              g("span", Ro, D(i.label), 1),
-              i.sortable ? (h(), w("div", So, [
-                g("span", {
-                  class: W(["vs-sort-icon vs-sort-asc", {
-                    "vs-active": e.sortHelpers.isColumnSorted(i.field) && e.sortHelpers.getSortOrder(i.field) === "asc"
-                  }])
-                }, [...f[0] || (f[0] = [
-                  g("svg", {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    height: "24px",
-                    viewBox: "0 -960 960 960",
-                    width: "24px",
-                    fill: "var(--vs-gray-800)"
-                  }, [
-                    g("path", { d: "m280-400 200-200 200 200H280Z" })
-                  ], -1)
-                ])], 2),
-                g("span", {
-                  class: W(["vs-sort-icon vs-sort-desc", {
-                    "vs-active": e.sortHelpers.isColumnSorted(i.field) && e.sortHelpers.getSortOrder(i.field) === "desc"
-                  }])
-                }, [...f[1] || (f[1] = [
-                  g("svg", {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    height: "24px",
-                    viewBox: "0 -960 960 960",
-                    width: "24px"
-                  }, [
-                    g("path", { d: "M480-360 280-560h400L480-360Z" })
-                  ], -1)
-                ])], 2)
-              ])) : P("", !0),
-              e.sortHelpers.getSortPriority(i.field) !== null ? (h(), w("span", To, D(e.sortHelpers.getSortPriority(i.field)), 1)) : P("", !0),
-              i.filter ? (h(), fe(go, {
-                key: 2,
-                type: i.filter.type,
-                "async-options": i.filter.asyncOptions,
-                field: i.field,
-                operators: i.filter.operators,
-                modelValue: l.value[i.field],
-                "onUpdate:modelValue": (p) => l.value[i.field] = p,
-                visible: a.value === i.field,
-                "column-data": e.rows.map((p) => p[i.field]),
-                onApply: (p) => {
-                  o("applyFilter", i.field, p);
-                },
-                onClear: () => {
-                  o("clearFilter", i.field);
-                },
-                onClose: (p) => u(i.field),
-                onOpen: (p) => r(i.field)
-              }, Ne({ _: 2 }, [
-                i.filter.custom ? {
-                  name: "custom",
-                  fn: I(({ filter: p, apply: v, clear: d }) => [
-                    q(c.$slots, i.filter.custom, {
-                      filter: p,
-                      apply: v,
-                      clear: d
-                    }, void 0, !0)
-                  ]),
-                  key: "0"
-                } : void 0
-              ]), 1032, ["type", "async-options", "field", "operators", "modelValue", "onUpdate:modelValue", "visible", "column-data", "onApply", "onClear", "onClose", "onOpen"])) : P("", !0)
-            ])
-          ], !0)
-        ], 14, Co))), 128))
+          !h.children || !h.children.length ? (y(), fe(ht, Ae({
+            key: 0,
+            column: h,
+            rows: e.rows,
+            rowspan: 2,
+            "sort-helpers": e.sortHelpers,
+            filters: l.value,
+            "open-filter": a.value,
+            "header-class": e.headerClass,
+            tablename: e.tablename
+          }, { ref_for: !0 }, f.$attrs, {
+            onApplyFilter: u[0] || (u[0] = (g, C) => o("applyFilter", g, C)),
+            onClearFilter: u[1] || (u[1] = (g) => o("clearFilter", g)),
+            onOpenFilter: r,
+            onCloseFilter: i,
+            "onUpdate:filters": u[2] || (u[2] = (g) => o("update:filters", g))
+          }), Te({ _: 2 }, [
+            Q(f.$slots, (g, C) => ({
+              name: C,
+              fn: X((S) => [
+                z(f.$slots, C, Ae({ ref_for: !0 }, S), void 0, !0)
+              ])
+            }))
+          ]), 1040, ["column", "rows", "sort-helpers", "filters", "open-filter", "header-class", "tablename"])) : (y(), k("th", {
+            key: 1,
+            colspan: h.children.length,
+            "data-field": `group-${h.label}`,
+            class: "vs-group-header",
+            style: { textAlign: "center" }
+          }, H(h.label), 9, Wo))
+        ], 64))), 128))
+      ])) : D("", !0),
+      w("tr", null, [
+        e.expandable && !d.value ? (y(), k("th", No)) : D("", !0),
+        e.isItemSelectedControlled && !d.value ? (y(), k("th", Ko, [
+          w("div", zo, [
+            w("input", {
+              type: "checkbox",
+              id: e.tablename + "-main-checkbox",
+              checked: e.isAllChecked,
+              indeterminate: e.isSomeChecked,
+              onChange: s
+            }, null, 40, jo),
+            w("label", {
+              for: e.tablename + "-main-checkbox"
+            }, null, 8, Uo)
+          ])
+        ])) : D("", !0),
+        (y(!0), k(K, null, Q(v.value, (h) => (y(), k(K, {
+          key: h.field
+        }, [
+          h.field && m(h) ? (y(), fe(ht, Ae({
+            key: 0,
+            column: h,
+            rows: e.rows,
+            "sort-helpers": e.sortHelpers,
+            filters: l.value,
+            "open-filter": a.value,
+            "header-class": e.headerClass,
+            tablename: e.tablename
+          }, { ref_for: !0 }, f.$attrs, {
+            onApplyFilter: u[3] || (u[3] = (g, C) => o("applyFilter", g, C)),
+            onClearFilter: u[4] || (u[4] = (g) => o("clearFilter", g)),
+            onOpenFilter: r,
+            onCloseFilter: i,
+            "onUpdate:filters": u[5] || (u[5] = (g) => o("update:filters", g))
+          }), Te({ _: 2 }, [
+            Q(f.$slots, (g, C) => ({
+              name: C,
+              fn: X((S) => [
+                z(f.$slots, C, Ae({ ref_for: !0 }, S), void 0, !0)
+              ])
+            }))
+          ]), 1040, ["column", "rows", "sort-helpers", "filters", "open-filter", "header-class", "tablename"])) : D("", !0)
+        ], 64))), 128))
       ])
-    ]));
+    ], 512));
   }
-}), Vo = /* @__PURE__ */ ne($o, [["__scopeId", "data-v-1776a5d5"]]), Oo = { key: 0 }, Ao = ["colspan"], Eo = { key: 1 }, Po = ["colspan"], Do = { class: "vs-no-data-message" }, Lo = { class: "vs-no-data-description" }, Fo = ["onClick"], Bo = ["aria-expanded", "aria-controls", "onClick"], Mo = { key: 0 }, qo = { key: 1 }, No = { class: "vs-checkbox" }, Io = ["id", "value", "checked", "onChange"], Ho = ["for"], Ko = {
+}), Xo = /* @__PURE__ */ ae(Zo, [["__scopeId", "data-v-f82c670c"]]), Qo = { key: 0 }, Yo = ["colspan"], Go = { key: 1 }, Jo = ["colspan"], _o = { class: "vs-no-data-message" }, es = { class: "vs-no-data-description" }, ts = ["onClick"], ns = ["aria-expanded", "aria-controls", "onClick"], os = { key: 0 }, ss = { key: 1 }, ls = { class: "vs-checkbox" }, as = ["id", "value", "checked", "onChange"], rs = ["for"], is = ["data-field"], cs = {
   key: 0,
   class: "vs-row-expanded"
-}, Wo = ["colspan"], Uo = {
+}, us = ["colspan"], ds = {
   key: 1,
   class: "vs-expanded-content"
-}, jo = /* @__PURE__ */ _({
+}, fs = /* @__PURE__ */ _({
   __name: "VsDataTableBody",
   props: {
     loading: { type: Boolean },
@@ -1929,181 +2086,191 @@ const Gn = {
     isRowSelected: { type: Function }
   },
   emits: ["row-click"],
-  setup(e, { emit: t }) {
-    const n = e, o = T(() => n.rowKey ?? "id");
-    return (s, l) => (h(), w("tbody", null, [
-      e.loading ? (h(), w("tr", Oo, [
-        g("td", {
+  setup(e, { emit: n }) {
+    const t = e, o = F(() => t.rowKey ?? "id"), s = q(null), l = F(() => t.columns.flatMap(
+      (a) => "children" in a ? a.children : [a]
+    ));
+    return (a, r) => (y(), k("tbody", {
+      ref_key: "bodyRef",
+      ref: s
+    }, [
+      e.loading ? (y(), k("tr", Qo, [
+        w("td", {
           colspan: e.totalColumns,
           class: "vs-loading"
         }, [
-          l[2] || (l[2] = g("div", { class: "vs-spinner" }, null, -1)),
-          g("span", null, D(e.loadingText), 1)
-        ], 8, Ao)
-      ])) : e.paginatedRows.length ? (h(!0), w(K, { key: 2 }, z(e.paginatedRows, (a, r) => (h(), w(K, {
-        key: e.getRowKey(a, r)
+          r[2] || (r[2] = w("div", { class: "vs-spinner" }, null, -1)),
+          w("span", null, H(e.loadingText), 1)
+        ], 8, Yo)
+      ])) : e.paginatedRows.length ? (y(!0), k(K, { key: 2 }, Q(e.paginatedRows, (i, c) => (y(), k(K, {
+        key: e.getRowKey(i, c)
       }, [
-        g("tr", {
-          class: W([
+        w("tr", {
+          class: G([
             e.rowClass,
             { "vs-row-clickable": e.hasRowClick },
-            { "vs-row-selected": e.isRowSelected(a, e.selectedItems, o.value) }
+            { "vs-row-selected": e.isRowSelected(i, e.selectedItems, o.value) }
           ]),
-          onClick: (u) => s.$emit("row-click", a, r)
+          onClick: (d) => a.$emit("row-click", i, c)
         }, [
-          e.expandable ? (h(), w("td", {
+          e.expandable ? (y(), k("td", {
             key: 0,
             class: "vs-expand-column",
-            onClick: l[0] || (l[0] = le(() => {
+            "data-field": "_expand",
+            onClick: r[0] || (r[0] = me(() => {
             }, ["stop"]))
           }, [
-            g("button", {
+            w("button", {
               class: "vs-expand-btn",
               type: "button",
-              "aria-expanded": e.isRowExpanded(a, r),
-              "aria-controls": `row-details-${e.getRowKey(a, r)}`,
-              onClick: le((u) => e.toggleRowExpansion(a, r), ["stop"])
+              "aria-expanded": e.isRowExpanded(i, c),
+              "aria-controls": `row-details-${e.getRowKey(i, c)}`,
+              onClick: me((d) => e.toggleRowExpansion(i, c), ["stop"])
             }, [
-              e.isRowExpanded(a, r) ? (h(), w("span", Mo, [...l[4] || (l[4] = [
-                g("svg", {
+              e.isRowExpanded(i, c) ? (y(), k("span", os, [...r[4] || (r[4] = [
+                w("svg", {
                   xmlns: "http://www.w3.org/2000/svg",
                   height: "24px",
                   viewBox: "0 -960 960 960",
                   width: "24px",
                   fill: "var(--vs-gray-800)"
                 }, [
-                  g("path", { d: "M480-345 240-585l56-56 184 183 184-183 56 56-240 240Z" })
+                  w("path", { d: "M480-345 240-585l56-56 184 183 184-183 56 56-240 240Z" })
                 ], -1)
-              ])])) : (h(), w("span", qo, [...l[5] || (l[5] = [
-                g("svg", {
+              ])])) : (y(), k("span", ss, [...r[5] || (r[5] = [
+                w("svg", {
                   xmlns: "http://www.w3.org/2000/svg",
                   height: "24px",
                   viewBox: "0 -960 960 960",
                   width: "24px",
                   fill: "var(--vs-gray-800)"
                 }, [
-                  g("path", { d: "M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z" })
+                  w("path", { d: "M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z" })
                 ], -1)
               ])]))
-            ], 8, Bo)
-          ])) : P("", !0),
-          e.isItemSelectedControlled ? (h(), w("td", {
+            ], 8, ns)
+          ])) : D("", !0),
+          e.isItemSelectedControlled ? (y(), k("td", {
             key: 1,
-            onClick: l[1] || (l[1] = le(() => {
-            }, ["stop"])),
-            class: "vs-checkbox-column"
+            class: "vs-checkbox-column",
+            "data-field": "_checkbox",
+            onClick: r[1] || (r[1] = me(() => {
+            }, ["stop"]))
           }, [
-            g("div", No, [
-              g("input", {
+            w("div", ls, [
+              w("input", {
                 type: "checkbox",
-                id: e.tablename + "-checkbox-" + e.getRowKey(a, r),
-                value: a,
-                checked: e.selectedItems.some((u, c) => e.getRowKey(u, c) === e.getRowKey(a, r)),
-                onChange: (u) => e.toggleRow(a, r)
-              }, null, 40, Io),
-              g("label", {
-                for: e.tablename + "-checkbox-" + e.getRowKey(a, r)
-              }, null, 8, Ho)
+                id: e.tablename + "-checkbox-" + e.getRowKey(i, c),
+                value: i,
+                checked: e.selectedItems.some((d, v) => e.getRowKey(d, v) === e.getRowKey(i, c)),
+                onChange: (d) => e.toggleRow(i, c)
+              }, null, 40, as),
+              w("label", {
+                for: e.tablename + "-checkbox-" + e.getRowKey(i, c)
+              }, null, 8, rs)
             ])
-          ])) : P("", !0),
-          (h(!0), w(K, null, z(e.columns, (u) => (h(), w("td", {
-            key: u.field,
-            class: W(e.cellClass)
-          }, [
-            q(s.$slots, `cell-${u.field}`, {
-              item: a,
-              value: e.getValue(a, u.field),
-              column: u,
-              index: r
-            }, () => [
-              je(D(e.getValue(a, u.field)), 1)
-            ], !0)
-          ], 2))), 128))
-        ], 10, Fo),
-        e.expandable ? (h(), w(K, { key: 0 }, [
-          e.isRowExpanded(a, r) ? (h(), w("tr", Ko, [
-            g("td", {
+          ])) : D("", !0),
+          (y(!0), k(K, null, Q(l.value, (d) => (y(), k(K, null, [
+            d && d.field ? (y(), k("td", {
+              key: d.field,
+              class: G(e.cellClass),
+              "data-field": d.field
+            }, [
+              z(a.$slots, `cell-${d.field}`, {
+                item: i,
+                value: e.getValue(i, d.field),
+                column: d,
+                index: c
+              }, () => [
+                Ye(H(e.getValue(i, d.field)), 1)
+              ], !0)
+            ], 10, is)) : D("", !0)
+          ], 64))), 256))
+        ], 10, ts),
+        e.expandable ? (y(), k(K, { key: 0 }, [
+          e.isRowExpanded(i, c) ? (y(), k("tr", cs, [
+            w("td", {
               colspan: e.totalColumns,
               class: "vs-expanded-cell"
             }, [
-              e.isRowLoading(a, r) ? q(s.$slots, "row-expanded-loader", {
+              e.isRowLoading(i, c) ? z(a.$slots, "row-expanded-loader", {
                 key: 0,
-                item: a,
-                index: r
+                item: i,
+                index: c
               }, () => [
-                l[6] || (l[6] = g("div", { class: "vs-loader-bar" }, [
-                  g("div", { class: "vs-loader-bar-inner" })
+                r[6] || (r[6] = w("div", { class: "vs-loader-bar" }, [
+                  w("div", { class: "vs-loader-bar-inner" })
                 ], -1))
-              ], !0) : (h(), w("div", Uo, [
-                q(s.$slots, "row-expanded", {
-                  item: a,
-                  index: r
+              ], !0) : (y(), k("div", ds, [
+                z(a.$slots, "row-expanded", {
+                  item: i,
+                  index: c
                 }, () => [
-                  l[7] || (l[7] = je(" Expanded details for row ", -1)),
-                  g("b", null, D(e.getRowKey(a, r)), 1)
+                  r[7] || (r[7] = Ye(" Expanded details for row ", -1)),
+                  w("b", null, H(e.getRowKey(i, c)), 1)
                 ], !0)
               ]))
-            ], 8, Wo)
-          ])) : P("", !0)
-        ], 64)) : P("", !0)
-      ], 64))), 128)) : (h(), w("tr", Eo, [
-        g("td", {
+            ], 8, us)
+          ])) : D("", !0)
+        ], 64)) : D("", !0)
+      ], 64))), 128)) : (y(), k("tr", Go, [
+        w("td", {
           colspan: e.totalColumns,
           class: "vs-no-data"
         }, [
-          q(s.$slots, "no-data", {}, () => [
-            l[3] || (l[3] = g("div", { class: "vs-no-data-icon" }, [
-              g("svg", {
+          z(a.$slots, "no-data", {}, () => [
+            r[3] || (r[3] = w("div", { class: "vs-no-data-icon" }, [
+              w("svg", {
                 viewBox: "0 0 24 24",
                 fill: "currentColor"
               }, [
-                g("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" })
+                w("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)),
-            g("div", Do, D(e.noDataText), 1),
-            g("div", Lo, D(e.noDataDescription), 1)
+            w("div", _o, H(e.noDataText), 1),
+            w("div", es, H(e.noDataDescription), 1)
           ], !0)
-        ], 8, Po)
+        ], 8, Jo)
       ]))
-    ]));
+    ], 512));
   }
-}), zo = /* @__PURE__ */ ne(jo, [["__scopeId", "data-v-149f0fb5"]]), Zo = { class: "vs-search" }, Qo = ["placeholder", "value"], Xo = /* @__PURE__ */ _({
+}), vs = /* @__PURE__ */ ae(fs, [["__scopeId", "data-v-d11afcd0"]]), hs = { class: "vs-search" }, ms = ["placeholder", "value"], ps = /* @__PURE__ */ _({
   __name: "VsSearch",
   props: {
     modelValue: {},
     placeholder: {}
   },
   emits: ["update:modelValue", "inputTyped"],
-  setup(e, { emit: t }) {
-    const n = t, o = (s) => {
+  setup(e, { emit: n }) {
+    const t = n, o = (s) => {
       const l = s.target;
-      n("update:modelValue", l.value), n("inputTyped", l.value);
+      t("update:modelValue", l.value), t("inputTyped", l.value);
     };
-    return (s, l) => (h(), w("div", Zo, [
-      l[0] || (l[0] = g("div", { class: "vs-search-icon" }, [
-        g("svg", {
+    return (s, l) => (y(), k("div", hs, [
+      l[0] || (l[0] = w("div", { class: "vs-search-icon" }, [
+        w("svg", {
           xmlns: "http://www.w3.org/2000/svg",
           height: "22px",
           viewBox: "0 -960 960 960",
           width: "22px",
           fill: "#e3e3e3"
         }, [
-          g("path", { d: "M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z" })
+          w("path", { d: "M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z" })
         ])
       ], -1)),
-      g("input", {
+      w("input", {
         type: "text",
         class: "vs-search-input",
         placeholder: e.placeholder,
         value: e.modelValue,
         onInput: o
-      }, null, 40, Qo)
+      }, null, 40, ms)
     ]));
   }
-}), Yo = /* @__PURE__ */ ne(Xo, [["__scopeId", "data-v-60b73b45"]]), Go = { class: "vs-datatable-toolbar vs-layout-row" }, Jo = { class: "vs-layout-start" }, _o = {
+}), gs = /* @__PURE__ */ ae(ps, [["__scopeId", "data-v-60b73b45"]]), ys = { class: "vs-datatable-toolbar vs-layout-row" }, ws = { class: "vs-layout-start" }, bs = {
   key: 0,
   class: "vs-search-container"
-}, es = { class: "vs-layout-end" }, ts = /* @__PURE__ */ _({
+}, xs = { class: "vs-layout-end" }, ks = /* @__PURE__ */ _({
   __name: "VsDataTableToolbar",
   props: {
     showSearch: { type: Boolean },
@@ -2112,146 +2279,217 @@ const Gn = {
     searchClass: {}
   },
   emits: ["update:searchQuery", "search"],
-  setup(e, { emit: t }) {
-    const n = t, o = (s) => {
-      n("update:searchQuery", s), n("search", s);
+  setup(e, { emit: n }) {
+    const t = n, o = (s) => {
+      t("update:searchQuery", s), t("search", s);
     };
-    return (s, l) => (h(), w("div", Go, [
-      g("div", Jo, [
-        e.showSearch ? (h(), w("div", _o, [
-          j(Yo, {
+    return (s, l) => (y(), k("div", ys, [
+      w("div", ws, [
+        e.showSearch ? (y(), k("div", bs, [
+          ne(gs, {
             "model-value": e.searchQuery,
             "onUpdate:modelValue": o,
             placeholder: e.searchPlaceholder,
-            class: W(e.searchClass)
+            class: G(e.searchClass)
           }, null, 8, ["model-value", "placeholder", "class"])
-        ])) : P("", !0),
-        q(s.$slots, "left", {}, void 0, !0)
+        ])) : D("", !0),
+        z(s.$slots, "left", {}, void 0, !0)
       ]),
-      g("div", es, [
-        q(s.$slots, "right", {}, void 0, !0)
+      w("div", xs, [
+        z(s.$slots, "right", {}, void 0, !0)
       ])
     ]));
   }
-}), ns = /* @__PURE__ */ ne(ts, [["__scopeId", "data-v-8524b8f7"]]);
-function os(e, t, n) {
-  const o = L(1), s = L(e.sort ? [...e.sort] : []);
-  G(
+}), Cs = /* @__PURE__ */ ae(ks, [["__scopeId", "data-v-8a8215b9"]]), Ss = { key: 0 }, Rs = { class: "vs-footer-row" }, Es = {
+  key: 0,
+  class: "vs-footer-cell vs-expand-column"
+}, $s = {
+  key: 1,
+  class: "vs-footer-cell vs-checkbox-column"
+}, As = ["data-field"], Fs = /* @__PURE__ */ _({
+  __name: "VsDataTableFooter",
+  props: {
+    columns: {},
+    rows: {},
+    expandable: { type: Boolean },
+    isItemSelectedControlled: { type: Boolean }
+  },
+  setup(e) {
+    const n = e, t = F(() => {
+      const s = [];
+      function l(a) {
+        for (const r of a)
+          r.hidden || (r.children && r.children.length ? l(r.children) : s.push(r));
+      }
+      return l(n.columns), s.map((a) => {
+        const r = a.footerValue !== void 0;
+        let i = null;
+        if (typeof a.footerValue == "function")
+          try {
+            i = a.footerValue(n.rows);
+          } catch (c) {
+            console.warn(`Error computing footerValue for column "${a.field}"`, c);
+          }
+        else a.footerValue !== void 0 && (i = a.footerValue);
+        return {
+          ...a,
+          hasFooter: r,
+          footerValue: i,
+          formattedValue: o(a, i)
+        };
+      });
+    });
+    function o(s, l) {
+      if (l == null) return "";
+      if (s.footerFormatter)
+        try {
+          return s.footerFormatter(l, s);
+        } catch (a) {
+          return console.warn(`Error in footerFormatter for column "${s.field}"`, a), String(l);
+        }
+      return typeof l == "number" ? s.field === "price" ? `$${l.toFixed(2)}` : s.field === "tax" ? l.toFixed(2) : l.toLocaleString() : String(l);
+    }
+    return (s, l) => t.value.length ? (y(), k("tfoot", Ss, [
+      w("tr", Rs, [
+        e.expandable ? (y(), k("td", Es)) : D("", !0),
+        e.isItemSelectedControlled ? (y(), k("td", $s)) : D("", !0),
+        (y(!0), k(K, null, Q(t.value, (a, r) => (y(), k("td", {
+          key: r,
+          "data-field": a.field,
+          class: G(["vs-footer-cell", a.footerClass || ""]),
+          style: pt(a.footerStyle || {})
+        }, [
+          a.hasFooter ? z(s.$slots, `footer-${a.field}`, {
+            key: 0,
+            column: a,
+            value: a.footerValue,
+            rows: e.rows
+          }, () => [
+            Ye(H(a.formattedValue), 1)
+          ], !0) : D("", !0)
+        ], 14, As))), 128))
+      ])
+    ])) : D("", !0);
+  }
+}), Ts = /* @__PURE__ */ ae(Fs, [["__scopeId", "data-v-f3b614d3"]]);
+function Os(e, n, t) {
+  const o = q(1), s = q(e.sort ? [...e.sort] : []);
+  Y(
     () => e.sort,
-    (i) => {
-      i && (s.value = [...i]);
+    (v) => {
+      v && (s.value = [...v]);
     },
     { deep: !0 }
   );
-  const l = T(
+  const l = F(
     () => e.serverOptions?.sort ?? s.value ?? []
   );
   return {
     activeSort: l,
     sortHelpers: {
-      isColumnSorted: (i) => l.value.some((p) => p.field === i),
-      getSortPriority: (i) => {
-        const p = l.value.find((v) => v.field === i);
-        return p ? p.priority ?? null : null;
+      isColumnSorted: (v) => l.value.some((m) => m.field === v),
+      getSortPriority: (v) => {
+        const m = l.value.find((f) => f.field === v);
+        return m ? m.priority ?? null : null;
       },
-      getSortOrder: (i) => l.value.find((p) => p.field === i)?.order ?? null,
-      handleSort: (i, p) => {
-        let v = [...s.value];
-        const d = v.findIndex((m) => m.field === i);
-        p.shiftKey ? d === -1 ? v.push({ field: i, order: "asc" }) : v[d]?.order === "asc" ? v[d].order = "desc" : v.splice(d, 1) : d === -1 ? v = [{ field: i, order: "asc" }] : v[d]?.order === "asc" ? v = [{ field: i, order: "desc" }] : v = [], v = v.map((m, b) => ({ ...m, priority: b + 1 })), s.value = [...v], e.serverOptions ? t("update:serverOptions", { ...e.serverOptions, sort: v }) : t("update:sort", v), n.value = o.value, t("sortChanged", { sort: v });
+      getSortOrder: (v) => l.value.find((m) => m.field === v)?.order ?? null,
+      handleSort: (v, m) => {
+        let f = [...s.value];
+        const u = f.findIndex((h) => h.field === v);
+        m.shiftKey ? u === -1 ? f.push({ field: v, order: "asc" }) : f[u]?.order === "asc" ? f[u].order = "desc" : f.splice(u, 1) : u === -1 ? f = [{ field: v, order: "asc" }] : f[u]?.order === "asc" ? f = [{ field: v, order: "desc" }] : f = [], f = f.map((h, g) => ({ ...h, priority: g + 1 })), s.value = [...f], e.serverOptions ? n("update:serverOptions", { ...e.serverOptions, sort: f }) : n("update:sort", f), t.value = o.value, n("sortChanged", { sort: f });
       }
     }
   };
 }
-function ss(e, t, n, o, s) {
-  const l = T({
+function Vs(e, n, t, o, s) {
+  const l = F({
     get: () => e.serverItemsLength !== void 0 ? e.serverItemsLength : s.value.length,
-    set: (f) => {
-      e.serverItemsLength !== void 0 && t("update:serverItemsLength", f);
+    set: (d) => {
+      e.serverItemsLength !== void 0 && n("update:serverItemsLength", d);
     }
-  }), a = T({
-    get: () => e.serverOptions?.page ?? n.value,
-    set: (f) => {
-      e.serverOptions ? t("update:serverOptions", { ...e.serverOptions, page: f }) : n.value = f;
+  }), a = F({
+    get: () => e.serverOptions?.page ?? t.value,
+    set: (d) => {
+      e.serverOptions ? n("update:serverOptions", { ...e.serverOptions, page: d }) : t.value = d;
     }
-  }), r = T(() => {
-    const f = o.value;
-    return Pt(n.value, f, l.value);
-  }), u = (f) => {
-    e.serverOptions && t("update:serverOptions", { ...e.serverOptions, page: f }), t("pageUpdated", f);
+  }), r = F(() => {
+    const d = o.value;
+    return Kt(t.value, d, l.value);
+  }), i = (d) => {
+    e.serverOptions && n("update:serverOptions", { ...e.serverOptions, page: d }), n("pageUpdated", d);
   };
   return {
     currentPage: a,
     totalRecords: l,
     recordRange: r,
-    handlePageChange: u,
+    handlePageChange: i,
     paginationHelpers: {
-      page: n,
+      page: t,
       totalRecords: l,
       recordRange: r,
-      handlePageChange: u
+      handlePageChange: i
     }
   };
 }
-function ls(e, t, n, o) {
-  const s = T({
+function Ls(e, n, t, o) {
+  const s = F({
     get: () => o.value,
     set: (a) => o.value = a
   });
-  return G(o, (a) => {
-    const r = e.serverItemsLength ?? e.rows.length, u = it(r, a);
-    n.value > u ? n.value = u || 1 : n.value < 1 && (n.value = 1);
+  return Y(o, (a) => {
+    const r = e.serverItemsLength ?? e.rows.length, i = wt(r, a);
+    t.value > i ? t.value = i || 1 : t.value < 1 && (t.value = 1);
   }), {
     vsRowsPerPage: s,
     handleRowsPerPage: (a) => {
-      o.value = a, t("rowsPerPageChanged", a);
+      o.value = a, n("rowsPerPageChanged", a);
     }
   };
 }
-function as(e, t) {
-  const n = (a) => {
-    t.value = a, e("inputTyped", a);
+function Ps(e, n) {
+  const t = (a) => {
+    n.value = a, e("inputTyped", a);
   };
   return {
-    searchQuery: t,
-    onInputTyped: n,
+    searchQuery: n,
+    onInputTyped: t,
     clearSearch: () => {
-      t.value = "", e("inputTyped", "");
+      n.value = "", e("inputTyped", "");
     },
     setSearchQuery: (a) => {
-      t.value = a, e("inputTyped", a);
+      n.value = a, e("inputTyped", a);
     },
     searchHelpers: {
-      searchQuery: t,
-      onInputTyped: n
+      searchQuery: n,
+      onInputTyped: t
     }
   };
 }
-function rs(e, t) {
-  const n = L([]), o = L(/* @__PURE__ */ new Map()), s = T({
-    get: () => e.expanded ?? n.value,
-    set: (f) => {
-      e.expanded !== void 0 ? t("update:expanded", f) : n.value = f;
+function Ds(e, n) {
+  const t = q([]), o = q(/* @__PURE__ */ new Map()), s = F({
+    get: () => e.expanded ?? t.value,
+    set: (d) => {
+      e.expanded !== void 0 ? n("update:expanded", d) : t.value = d;
     }
   });
-  function l(f, i) {
-    return typeof e.rowKey == "function" ? e.rowKey(f, i) : typeof e.rowKey == "string" && f[e.rowKey] !== void 0 ? f[e.rowKey] : i;
+  function l(d, v) {
+    return typeof e.rowKey == "function" ? e.rowKey(d, v) : typeof e.rowKey == "string" && d[e.rowKey] !== void 0 ? d[e.rowKey] : v;
   }
-  function a(f, i) {
-    const p = l(f, i);
-    return s.value.includes(p);
+  function a(d, v) {
+    const m = l(d, v);
+    return s.value.includes(m);
   }
-  function r(f, i) {
-    const p = l(f, i), v = s.value.includes(p);
-    let d;
-    v ? (d = s.value.filter((m) => m !== p), t("collapseRow", { row: f, index: i, rowId: p })) : (d = e.accordion ? [p] : [...s.value, p], t("expandRow", { row: f, index: i, rowId: p })), s.value = d;
+  function r(d, v) {
+    const m = l(d, v), f = s.value.includes(m);
+    let u;
+    f ? (u = s.value.filter((h) => h !== m), n("collapseRow", { row: d, index: v, rowId: m })) : (u = e.accordion ? [m] : [...s.value, m], n("expandRow", { row: d, index: v, rowId: m })), s.value = u;
   }
-  function u(f, i) {
-    const p = l(f, i);
-    return o.value.get(p) === !0;
+  function i(d, v) {
+    const m = l(d, v);
+    return o.value.get(m) === !0;
   }
-  function c(f, i) {
-    o.value.set(f, i);
+  function c(d, v) {
+    o.value.set(d, v);
   }
   return {
     expandedRows: s,
@@ -2259,68 +2497,69 @@ function rs(e, t) {
     toggleRowExpansion: r,
     getRowId: l,
     setRowLoading: c,
-    isRowLoading: u
+    isRowLoading: i
   };
 }
-function is(e, t, n) {
-  const o = L({}), s = T(() => n?.serverMode ? e.value : e.value.filter((r) => t.every((u) => {
-    const c = o.value[u.field];
+function Is(e, n, t) {
+  const o = q({}), s = F(() => (console.log("InitFilter Filtered:", e.value), t?.serverMode ? e.value : e.value.filter((r) => n.every((i) => {
+    if (!i.field) return !0;
+    const c = o.value[i.field];
     if (!c || !c.type) return !0;
-    const f = r[u.field];
-    if (u.filter?.filterFn)
-      return u.filter.filterFn(f, c.value, r);
-    if (c.type === "custom" && u.filter?.filterKey) {
-      const p = Ae[u.filter.filterKey];
-      return typeof p == "function" ? p(r, u.field, c) : !0;
+    const d = r[i.field];
+    if (i.filter?.filterFn)
+      return i.filter.filterFn(d, c.value, r);
+    if (c.type === "custom" && i.filter?.filterKey) {
+      const m = Be[i.filter.filterKey];
+      return typeof m == "function" ? m(r, i.field, c) : !0;
     }
-    const i = Ae[c.type];
-    return typeof i == "function" ? i(r, u.field, c) : !0;
-  })));
-  G(
+    const v = Be[c.type];
+    return typeof v == "function" ? v(r, i.field, c) : !0;
+  }))));
+  Y(
     o,
     (r) => {
-      if (n?.serverMode && n.onServerFilter) {
-        const u = Object.entries(r).reduce(
-          (c, [f, i]) => {
-            if (!i?.type) return c;
-            const p = {
-              type: i.type,
-              operator: i.operator
+      if (t?.serverMode && t.onServerFilter) {
+        const i = Object.entries(r).reduce(
+          (c, [d, v]) => {
+            if (!v?.type) return c;
+            const m = {
+              type: v.type,
+              operator: v.operator
             };
-            switch (i.type) {
+            switch (v.type) {
               case "text":
-                c[f] = {
-                  ...p,
-                  value: i.value ?? null
+                c[d] = {
+                  ...m,
+                  value: v.value ?? null
                 };
                 break;
               case "multi-select":
-                c[f] = {
-                  ...p,
-                  value: i.value ?? []
+                c[d] = {
+                  ...m,
+                  value: v.value ?? []
                 };
                 break;
               case "number-range":
-                c[f] = {
-                  ...p,
-                  value: i.value ?? null,
-                  min: i.min ?? null,
-                  max: i.max ?? null
+                c[d] = {
+                  ...m,
+                  value: v.value ?? null,
+                  min: v.min ?? null,
+                  max: v.max ?? null
                 };
                 break;
               case "date-range":
-                c[f] = {
-                  ...p,
-                  value: i.value ?? null,
-                  start: i.start ?? null,
-                  end: i.end ?? null
+                c[d] = {
+                  ...m,
+                  value: v.value ?? null,
+                  start: v.start ?? null,
+                  end: v.end ?? null
                 };
                 break;
               case "custom":
-                c[f] = {
-                  ...p,
-                  value: i.value,
-                  filterKey: i.filterKey
+                c[d] = {
+                  ...m,
+                  value: v.value,
+                  filterKey: v.filterKey
                 };
                 break;
             }
@@ -2328,16 +2567,16 @@ function is(e, t, n) {
           },
           {}
         );
-        n.onServerFilter(u);
+        t.onServerFilter(i);
       }
     },
     { deep: !0 }
   );
-  function l(r, u, c) {
-    u ? o.value[r] = pe(u.type, u) : c && (o.value[r] = pe(c));
+  function l(r, i, c) {
+    i ? o.value[r] = Ce(i.type, i) : c && (o.value[r] = Ce(c));
   }
-  function a(r, u) {
-    u ? o.value[r] = pe(u) : delete o.value[r];
+  function a(r, i) {
+    i ? o.value[r] = Ce(i) : delete o.value[r];
   }
   return {
     filters: o,
@@ -2346,97 +2585,264 @@ function is(e, t, n) {
     clearFilter: a
   };
 }
-function us(e, t) {
-  const n = ye(e.rows) ? e.rows : at(e.rows), o = L(1), s = L(e.serverOptions?.rowsPerPage ?? e.rowsPerPage), l = L(""), { isRowExpanded: a, toggleRowExpansion: r, getRowId: u, setRowLoading: c, isRowLoading: f } = rs(e, t), { filters: i, filteredData: p, setFilter: v, clearFilter: d } = is(
-    T(() => R(n)),
-    e.columns,
+function qs(e, n = {}) {
+  const { enabled: t = !1, maxHeight: o = "calc(100vh - 250px)" } = n;
+  let s = null, l = null;
+  const a = () => {
+    const c = e.value;
+    if (!t || !c) return;
+    const d = c.querySelector("thead"), v = c.querySelector("tbody");
+    !d || !v || (c.parentElement?.classList.contains("vs-table-wrapper") ? s = c.parentElement : (s = document.createElement("div"), s.classList.add("vs-table-wrapper"), c.parentNode?.insertBefore(s, c), s.appendChild(c)), Object.assign(s.style, {
+      overflowY: "auto",
+      overflowX: "auto",
+      position: "relative",
+      maxHeight: typeof o == "number" ? `${o}px` : o
+    }), Object.assign(d.style, {
+      position: "sticky",
+      top: "0",
+      zIndex: "5",
+      background: "var(--vs-table-header-bg, #fff)"
+    }), l || (l = new ResizeObserver(() => {
+      r();
+    }), l.observe(c)), r());
+  }, r = () => {
+    const c = e.value;
+    if (!c) return;
+    const d = c.querySelector("thead"), v = c.querySelector("tbody");
+    if (!d || !v) return;
+    const m = Array.from(d.querySelectorAll("tr")), f = v.querySelector("tr");
+    if (!f) return;
+    const u = Array.from(f.querySelectorAll("td"));
+    if (!u.length) return;
+    const h = [];
+    m.forEach((g) => {
+      Array.from(g.querySelectorAll("th")).forEach((S) => {
+        parseInt(S.getAttribute("colspan") || "1", 10) === 1 && h.push(S);
+      });
+    }), h.forEach((g, C) => {
+      const S = u[C];
+      S && (g.style.width = `${S.offsetWidth}px`);
+    }), m.forEach((g) => {
+      Array.from(g.querySelectorAll("th")).forEach((S) => {
+        const E = parseInt(S.getAttribute("colspan") || "1", 10);
+        if (E > 1) {
+          let L = 0;
+          const P = Array.from(g.children).indexOf(S);
+          for (let B = 0; B < E; B++) {
+            const b = u[P + B];
+            b && (L += b.offsetWidth);
+          }
+          L > 0 && (S.style.width = `${L}px`);
+        }
+      });
+    });
+  }, i = () => {
+    l && (l.disconnect(), l = null);
+  };
+  return Re(async () => {
+    t && (await oe(), a());
+  }), He(() => {
+    i();
+  }), Y(
+    () => t,
+    async (c) => {
+      await oe(), c ? a() : i();
+    }
+  ), {
+    refresh: a,
+    cleanup: i
+  };
+}
+function Ms(e, n = {}) {
+  const {
+    enabled: t = !1,
+    maxHeight: o = "calc(100vh - 250px)",
+    debounceMs: s = 100
+  } = n;
+  let l = null, a = null, r = null, i = !1, c = !1, d = null;
+  const m = ((h, g = 100) => {
+    let C = null;
+    return (...S) => {
+      C && clearTimeout(C), C = window.setTimeout(() => h(...S), g);
+    };
+  })(() => {
+    i || (i = !0, cancelAnimationFrame(r), r = requestAnimationFrame(() => {
+      const h = e.value;
+      if (!h) return;
+      const g = h.querySelector("tfoot"), C = h.querySelector("tbody");
+      if (!g || !C) return;
+      const S = g.querySelector("tr"), E = C.querySelector("tr");
+      if (!S || !E) {
+        i = !1;
+        return;
+      }
+      const L = Array.from(S.querySelectorAll("td, th")), P = Array.from(E.querySelectorAll("td"));
+      if (!L.length || !P.length) {
+        i = !1;
+        return;
+      }
+      let B = 0;
+      L.forEach((b) => {
+        const p = parseInt(b.getAttribute("colspan") || "1", 10);
+        if (p === 1) {
+          const x = P[B];
+          if (x) {
+            const R = x.offsetWidth;
+            b.offsetWidth !== R && (b.style.width = `${R}px`, b.style.minWidth = `${R}px`);
+          }
+          B += 1;
+        } else {
+          let x = 0;
+          for (let R = 0; R < p; R++) {
+            const T = P[B + R];
+            T && (x += T.offsetWidth);
+          }
+          x > 0 && b.offsetWidth !== x && (b.style.width = `${x}px`, b.style.minWidth = `${x}px`), B += p;
+        }
+      }), i = !1;
+    }));
+  }, s), f = () => {
+    const h = e.value;
+    if (!t || !h) return;
+    const g = h.querySelector("tfoot"), C = h.querySelector("tbody"), S = h.querySelector("thead");
+    !g || !C || (h.parentElement?.classList.contains("vs-table-wrapper") ? l = h.parentElement : (l = document.createElement("div"), l.classList.add("vs-table-wrapper"), h.parentNode?.insertBefore(l, h), l.appendChild(h)), Object.assign(l.style, {
+      overflowY: "auto",
+      overflowX: "auto",
+      position: "relative",
+      maxHeight: typeof o == "number" ? `${o}px` : o
+    }), Object.assign(g.style, {
+      position: "sticky",
+      bottom: "0",
+      zIndex: "5",
+      background: "var(--vs-table-footer-bg, var(--vs-table-header-bg, #fff))"
+    }), !c && S && (d = () => {
+      const E = l.scrollLeft;
+      S.scrollLeft = E, g.scrollLeft = E;
+    }, l.addEventListener("scroll", d), c = !0), a || (a = new ResizeObserver(() => {
+      m();
+    }), a.observe(h)), m());
+  }, u = () => {
+    cancelAnimationFrame(r), a && (a.disconnect(), a = null), l && d && c && (l.removeEventListener("scroll", d), c = !1);
+    const h = e.value;
+    if (h) {
+      const g = h.querySelector("tfoot");
+      g && (g.style.position = "", g.style.bottom = "", g.style.zIndex = "", g.style.background = "");
+    }
+  };
+  return Re(async () => {
+    t && (await oe(), f());
+  }), He(u), Y(
+    () => t,
+    async (h) => {
+      await oe(), h ? f() : u();
+    }
+  ), {
+    refresh: m,
+    cleanup: u
+  };
+}
+function Bs(e, n, t = {}) {
+  const o = Fe(e.rows) ? e.rows : gt(e.rows), s = q(1), l = q(e.serverOptions?.rowsPerPage ?? e.rowsPerPage), a = q(""), r = q(), i = q(null), c = q(), { isRowExpanded: d, toggleRowExpansion: v, getRowId: m, setRowLoading: f, isRowLoading: u } = Ds(e, n), { filters: h, filteredData: g, setFilter: C, clearFilter: S } = Is(
+    F(() => $(o)),
+    zt($(e.columns)),
     {
       serverMode: !!e.serverOptions,
-      onServerFilter(y) {
-        t("filterChange", y);
+      onServerFilter(V) {
+        n("filterChange", V);
       }
     }
-  ), { activeSort: m, sortHelpers: b } = os(e, t, o), { onInputTyped: C } = as(t, l), { totalRecords: k, recordRange: S, handlePageChange: O } = ss(
+  ), { activeSort: E, sortHelpers: L } = Os(e, n, s), { onInputTyped: P } = Ps(n, a), { totalRecords: B, recordRange: b, handlePageChange: p } = Vs(
     e,
-    t,
-    o,
+    n,
     s,
-    T(() => $.value)
-  ), { handleRowsPerPage: A } = ls(e, t, o, s), M = T(() => {
-    let y = p.value;
-    return l.value && (y = Qe(y, l.value)), y;
-  }), $ = T(() => {
-    let y = M.value;
-    return e.serverOptions || (l.value && (y = Qe(y, l.value)), m.value.length && (y = At(y, m.value))), y = y.map((N, de) => ({
-      ...N,
-      isExpanded: a(N, de)
+    l,
+    F(() => I.value)
+  ), { handleRowsPerPage: x } = Ls(e, n, s, l), { header: R = !0, footer: T = !0, maxHeight: M = "calc(100vh - 100px)" } = t, A = qs(c, { enabled: R, maxHeight: M }), O = Ms(c, { enabled: T, maxHeight: M }), N = F(() => {
+    let V = g.value;
+    return a.value && (V = st(V, a.value)), V;
+  }), I = F(() => {
+    let V = N.value;
+    return e.serverOptions || (a.value && (V = st(V, a.value)), E.value.length && (V = Wt(V, E.value))), V = V.map((U, ge) => ({
+      ...U,
+      isExpanded: d(U, ge)
       // pass index here
-    })), y;
+    })), V;
   });
-  G([i, l], () => o.value = 1, { deep: !0 });
-  const x = T(
-    () => Et($.value, o.value, s.value)
+  Y([h, a], () => s.value = 1, { deep: !0 });
+  const W = F(
+    () => Nt(I.value, s.value, l.value)
   );
-  return G(n, (y) => {
-    Array.isArray(y) && y.length > 1e3 && console.log(`[useDataTable] Large dataset updated (${y.length} rows)`);
+  return Y(o, (V) => {
+    Array.isArray(V) && V.length > 1e3 && console.log(`[useDataTable] Large dataset updated (${V.length} rows)`);
   }), {
     // Pagination
-    page: o,
-    totalRecords: k,
-    recordRange: S,
-    handlePageChange: O,
-    rowsPerPage: s,
-    handleRowsPerPage: A,
+    page: s,
+    totalRecords: B,
+    recordRange: b,
+    handlePageChange: p,
+    rowsPerPage: l,
+    handleRowsPerPage: x,
     // Sorting
-    processedRows: $,
-    paginatedRows: x,
-    sortHelpers: b,
+    processedRows: I,
+    paginatedRows: W,
+    sortHelpers: L,
     // Search
-    searchQuery: l,
-    onInputTyped: C,
+    searchQuery: a,
+    onInputTyped: P,
     // Expandable
-    isRowExpanded: a,
-    toggleRowExpansion: r,
-    getRowId: u,
-    setRowLoading: c,
-    isRowLoading: f,
+    isRowExpanded: d,
+    toggleRowExpansion: v,
+    getRowId: m,
+    setRowLoading: f,
+    isRowLoading: u,
     // Column filters
-    filters: i,
-    filteredData: p,
-    setFilter: v,
-    clearFilter: d
+    filters: h,
+    filteredData: g,
+    setFilter: C,
+    clearFilter: S,
+    // Table Ref
+    tableContainer: r,
+    tableResponsiveRef: i,
+    tableRef: c,
+    // Sticky Header and Footer
+    refresh() {
+      A.refresh?.(), O.refresh?.();
+    },
+    cleanup() {
+      A.cleanup?.(), O.cleanup?.();
+    }
   };
 }
-function cs(e, t) {
-  const n = L(e.itemSelected || []);
-  G(
+function Hs(e, n) {
+  const t = q(e.itemSelected || []);
+  Y(
     () => e.itemSelected,
-    (m) => {
-      m ? n.value = [...m] : n.value = [];
+    (h) => {
+      h ? t.value = [...h] : t.value = [];
     },
     { immediate: !0, deep: !0 }
   );
-  const o = T({
-    get: () => n.value,
-    set: (m) => {
-      n.value = m, t("update:itemSelected", m);
+  const o = F({
+    get: () => t.value,
+    set: (h) => {
+      t.value = h, n("update:itemSelected", h);
     }
-  }), s = T(() => e.itemSelected !== null), l = T(
+  }), s = F(() => e.itemSelected !== null), l = F(
     () => e.rows.length > 0 && o.value.length === e.rows.length
-  ), a = T(() => !e.rows.length || !o.value.length ? !1 : !l.value && e.rows.some(
-    (m, b) => o.value.some(
-      (C, k) => X(C, k, e.rowKey) === X(m, b, e.rowKey)
+  ), a = F(() => !e.rows.length || !o.value.length ? !1 : !l.value && e.rows.some(
+    (h, g) => o.value.some(
+      (C, S) => re(C, S, e.rowKey) === re(h, g, e.rowKey)
     )
-  )), r = (m, b) => {
-    const C = X(m, b, e.rowKey);
+  )), r = (h, g) => {
+    const C = re(h, g, e.rowKey);
     o.value.some(
-      (S, O) => X(S, O, e.rowKey) === C
+      (E, L) => re(E, L, e.rowKey) === C
     ) ? (o.value = o.value.filter(
-      (S, O) => X(S, O, e.rowKey) !== C
-    ), t("rowDeselected", m, b)) : (o.value = [...o.value, m], t("rowSelected", m, b));
-  }, u = (m) => {
-    const b = m.target;
-    o.value = b.checked ? [...e.rows] : [], t("allRowsSelected", o.value);
+      (E, L) => re(E, L, e.rowKey) !== C
+    ), n("rowDeselected", h, g)) : (o.value = [...o.value, h], n("rowSelected", h, g));
+  }, i = (h) => {
+    const g = h.target;
+    o.value = g.checked ? [...e.rows] : [], n("allRowsSelected", o.value);
   };
   return {
     selectedItems: o,
@@ -2444,21 +2850,21 @@ function cs(e, t) {
     isAllChecked: l,
     isSomeChecked: a,
     toggleRow: r,
-    toggleAll: u,
-    selectRow: (m, b) => {
-      rt(m, o.value, e.rowKey) || (o.value = [...o.value, m], t("rowSelected", m, b));
+    toggleAll: i,
+    selectRow: (h, g) => {
+      yt(h, o.value, e.rowKey) || (o.value = [...o.value, h], n("rowSelected", h, g));
     },
-    deselectRow: (m, b) => {
-      const C = X(m, b, e.rowKey);
+    deselectRow: (h, g) => {
+      const C = re(h, g, e.rowKey);
       o.value = o.value.filter(
-        (k, S) => X(k, S, e.rowKey) !== C
-      ), t("rowDeselected", m, b);
+        (S, E) => re(S, E, e.rowKey) !== C
+      ), n("rowDeselected", h, g);
     },
     selectAll: () => {
-      o.value = [...e.rows], t("allRowsSelected", o.value);
+      o.value = [...e.rows], n("allRowsSelected", o.value);
     },
     deselectAll: () => {
-      o.value = [], t("allRowsSelected", []);
+      o.value = [], n("allRowsSelected", []);
     },
     clearSelection: () => {
       o.value = [];
@@ -2469,17 +2875,191 @@ function cs(e, t) {
       isAllChecked: l,
       isSomeChecked: a,
       toggleRow: r,
-      toggleAll: u
+      toggleAll: i
+    }
+  };
+}
+function Ws(e, n, t = q(!1)) {
+  const o = q(!1), s = q(!1);
+  let l = !1;
+  const a = () => {
+    if (l) return;
+    const b = e.value?.parentElement, p = e.value;
+    if (!b || !p) return;
+    const x = b.scrollLeft, R = b.scrollWidth - b.clientWidth;
+    o.value = x > 0, s.value = x < R - 1;
+    const T = Array.from(
+      p.querySelectorAll(".vs-sticky-left")
+    ), M = Array.from(
+      p.querySelectorAll(".vs-sticky-right")
+    );
+    if (x > 0 ? T.forEach((A) => {
+      const O = A.closest("thead") !== null;
+      A.style.zIndex = O ? "5" : "4";
+    }) : T.forEach((A) => {
+      const O = A.closest("thead") !== null;
+      A.style.zIndex = O ? "4" : "3";
+    }), M.length) {
+      const A = M[0], O = A ? p.offsetWidth - A.offsetLeft : p.offsetWidth;
+      b.scrollWidth - (x + b.clientWidth) <= O + 5 ? M.forEach((I) => {
+        const W = I.closest("thead") !== null;
+        I.style.zIndex = W ? "5" : "4";
+      }) : M.forEach((I) => {
+        const W = I.closest("thead") !== null;
+        I.style.zIndex = W ? "4" : "3";
+      });
+    }
+  }, r = () => {
+    const b = e.value;
+    return b ? Array.from(b.querySelectorAll("tr")) : [];
+  }, i = (b) => b.filter((p) => p.closest("tbody")), c = (b) => {
+    const p = b[0];
+    return p ? Array.from(p.children) : [];
+  }, d = (b) => {
+    const p = /* @__PURE__ */ new Map();
+    return b.forEach((x, R) => {
+      const T = x.getAttribute("data-field");
+      T && p.set(T, R);
+    }), p;
+  }, v = (b) => {
+    for (const p of b)
+      if (p.children?.length) {
+        if (p.children.some((x) => x.sticky === "left" || x.sticky === "right"))
+          return !0;
+      } else if (p.sticky === "left" || p.sticky === "right")
+        return !0;
+    return !1;
+  }, m = (b, p, x) => {
+    const R = [], T = [];
+    return v(x) && b.forEach((A, O) => {
+      (A.classList.contains("vs-expand-column") || A.classList.contains("vs-checkbox-column")) && R.push(O);
+    }), x.forEach((A) => {
+      if (A.children?.length)
+        A.children.forEach((O) => {
+          const N = p.get(O.field);
+          if (N === void 0) return;
+          const I = A.sticky || O.sticky;
+          I === "left" && R.push(N), I === "right" && T.push(N);
+        });
+      else {
+        const O = p.get(A.field);
+        if (O === void 0) return;
+        const N = A.sticky;
+        N === "left" && R.push(O), N === "right" && T.push(O);
+      }
+    }), {
+      left: [...new Set(R)].sort((A, O) => A - O),
+      right: [...new Set(T)].sort((A, O) => O - A)
+    };
+  }, f = (b, p, x) => {
+    const R = /* @__PURE__ */ new Map();
+    let T = 0;
+    return p.forEach((M) => {
+      R.set(M, T);
+      const A = b[M];
+      A && (T += A.offsetWidth);
+    }), R;
+  }, u = (b) => {
+    const p = /* @__PURE__ */ new Map(), x = /* @__PURE__ */ new Map();
+    return b.forEach((R) => {
+      R.children?.length && (p.set(R.label, R.children[0]?.field), x.set(R.label, R.children[R.children.length - 1]?.field));
+    }), { firstChild: p, lastChild: x };
+  }, h = (b, p, x, R) => {
+    if (b) {
+      if (b.startsWith("group-")) {
+        const T = b.replace(/^group-/, "");
+        if (R === "left") {
+          const M = x.firstChild.get(T);
+          return M ? p.get(M) : void 0;
+        } else {
+          const M = x.lastChild.get(T);
+          return M ? p.get(M) : void 0;
+        }
+      }
+      return p.get(b);
+    }
+  }, g = (b) => {
+    b.forEach((p) => {
+      Array.from(p.children).forEach((R) => {
+        R.style.position = "", R.style.left = "", R.style.right = "", R.style.zIndex = "", R.style.background = "", R.style.minWidth = "", R.style.width = "", R.classList.remove("vs-sticky-left", "vs-sticky-right");
+      });
+    });
+  }, C = (b, p, x, R, T, M) => {
+    if (!l) {
+      l = !0;
+      try {
+        b.forEach((A) => {
+          const O = Array.from(A.children), N = A.closest("thead") !== null;
+          O.forEach((I) => {
+            const W = I.getAttribute("data-field");
+            if (!W) return;
+            const V = h(W, T, M, R);
+            if (V === void 0 || !p.includes(V)) return;
+            const U = x.get(V) || 0, ge = N ? "4" : "3";
+            I.style.position = "sticky", I.style[R] = `${U}px`, I.style.zIndex = ge, I.classList.add(`vs-sticky-${R}`), I.style.background = "var(--vs-table-bg, #fff)";
+          });
+        });
+      } finally {
+        l = !1;
+      }
+    }
+  }, S = async () => {
+    if (l) return;
+    const b = r();
+    if (!b.length) return;
+    const p = i(b);
+    if (!p.length) return;
+    const x = c(p), R = d(x), T = m(x, R, n.value);
+    if (g(b), T.left.length > 0 || T.right.length > 0) {
+      const M = f(x, T.left), A = f(x, T.right), O = u(n.value);
+      C(b, T.left, M, "left", R, O), C(b, T.right, A, "right", R, O);
     }
+    a();
+  }, E = async () => {
+    l || (await oe(), setTimeout(() => {
+      try {
+        S();
+      } catch (b) {
+        console.warn("[useStickyColumns] refreshSticky failed:", b);
+      }
+    }, 150));
+  }, L = () => {
+    e.value?.parentElement?.addEventListener("scroll", a), a();
+  }, P = () => {
+    e.value?.parentElement?.removeEventListener("scroll", a);
   };
+  Re(async () => {
+    await oe(), setTimeout(() => {
+      E();
+    }, 300), L();
+  }), He(P);
+  let B = null;
+  return Y([n, t], () => {
+    B && clearTimeout(B), B = setTimeout(() => {
+      E();
+    }, 100);
+  }, { deep: !0 }), { hasLeftShadow: o, hasRightShadow: s, refreshSticky: E };
+}
+function Ns(e, n) {
+  let t = null, o = null;
+  const s = () => {
+    const a = e.value;
+    a && (l(), t = new ResizeObserver(() => {
+      o && cancelAnimationFrame(o), o = requestAnimationFrame(() => {
+        n();
+      });
+    }), t.observe(a));
+  }, l = () => {
+    t && (t.disconnect(), t = null), o && (cancelAnimationFrame(o), o = null);
+  };
+  return Re(async () => {
+    await oe(), s();
+  }), He(l), { refreshSticky: n, cleanup: l };
 }
-const ds = { class: "vs-datatable" }, fs = {
-  ref: "tableResponsiveRef",
-  class: "vs-table-wrapper"
-}, vs = {
+const Ks = { class: "vs-datatable" }, zs = {
   key: 0,
-  class: "vs-table-footer"
-}, ps = { class: "vs-footer-left" }, ms = { class: "vs-table-info" }, gs = /* @__PURE__ */ _({
+  class: "vs-table-pagination"
+}, js = { class: "vs-pagination-left" }, Us = { class: "vs-table-info" }, Zs = /* @__PURE__ */ _({
   __name: "VsDataTable",
   props: {
     rows: { default: () => [] },
@@ -2511,175 +3091,233 @@ const ds = { class: "vs-datatable" }, fs = {
     rowKey: { type: [String, Function], default: "id" },
     expanded: {},
     expandable: { type: Boolean },
-    accordion: { type: Boolean }
+    accordion: { type: Boolean },
+    stickyHeader: { type: Boolean, default: !1 },
+    stickyFooter: { type: Boolean, default: !1 },
+    showPagination: { type: Boolean, default: !0 }
   },
   emits: ["update:serverItemsLength", "update:serverOptions", "pageUpdated", "inputTyped", "update:sort", "sortChanged", "update:itemSelected", "rowSelected", "rowDeselected", "allRowsSelected", "rowClick", "tableBeforeMount", "tableMounted", "tableUnmounted", "dataLoaded", "dataError", "update:expanded", "expandRow", "collapseRow", "filterChange"],
-  setup(e, { expose: t, emit: n }) {
-    const o = e, s = at(o.rows);
-    G(
+  setup(e, { expose: n, emit: t }) {
+    const o = e, s = gt(o.rows);
+    Y(
       () => o.rows,
-      (B) => {
-        s.value = B;
+      (ee) => {
+        s.value = ee;
       },
       { deep: !1 }
     );
-    const l = n, a = Tt(), r = T(() => !!a.onRowClick), {
-      page: u,
-      rowsPerPage: c,
-      totalRecords: f,
-      recordRange: i,
-      handlePageChange: p,
-      handleRowsPerPage: v,
-      paginatedRows: d,
-      sortHelpers: m,
-      searchQuery: b,
-      onInputTyped: C,
-      isRowExpanded: k,
-      toggleRowExpansion: S,
-      setRowLoading: O,
-      isRowLoading: A,
-      filters: M,
-      setFilter: $,
-      clearFilter: x
-    } = us({ ...o, rows: s.value }, l), {
-      selectedItems: y,
-      isItemSelectedControlled: N,
-      isAllChecked: de,
-      isSomeChecked: Ce,
-      toggleAll: ke,
-      toggleRow: te
-    } = cs(o, l), he = T(
-      () => Ot(o.columns, N.value, o.expandable)
+    const l = t, a = qt(), r = F(() => !!a.onRowClick), i = q(), c = q(), {
+      page: d,
+      rowsPerPage: v,
+      totalRecords: m,
+      recordRange: f,
+      handlePageChange: u,
+      handleRowsPerPage: h,
+      paginatedRows: g,
+      sortHelpers: C,
+      searchQuery: S,
+      onInputTyped: E,
+      isRowExpanded: L,
+      toggleRowExpansion: P,
+      setRowLoading: B,
+      isRowLoading: b,
+      filters: p,
+      setFilter: x,
+      clearFilter: R,
+      tableRef: T,
+      tableContainer: M,
+      tableResponsiveRef: A,
+      refresh: O
+    } = Bs(
+      { ...o, rows: s.value },
+      l,
+      { header: o.stickyHeader, footer: o.stickyFooter }
+    ), {
+      selectedItems: N,
+      isItemSelectedControlled: I,
+      isAllChecked: W,
+      isSomeChecked: V,
+      toggleAll: U,
+      toggleRow: ge
+    } = Hs(o, l), Vt = F(
+      () => Ht(o.columns, I.value, o.expandable)
+    ), { hasLeftShadow: Lt, hasRightShadow: Pt, refreshSticky: $e } = Ws(
+      T,
+      F(() => o.columns)
     );
-    return t({
-      toggleRowExpansion: S,
-      setRowLoading: O
-    }), st(() => {
-      l("tableMounted");
+    return Ns(T, $e), Y(
+      () => g.value,
+      () => {
+        oe(() => {
+          $e();
+        });
+      },
+      { deep: !0 }
+    ), Y(
+      () => o.columns,
+      () => {
+        oe(() => {
+          $e();
+        });
+      },
+      { deep: !0 }
+    ), n({
+      toggleRowExpansion: P,
+      setRowLoading: B,
+      refreshSticky: $e
+    }), Re(async () => {
+      setTimeout(() => {
+        $e();
+      }, 100), await oe(), O(), l("tableMounted");
       try {
         l("dataLoaded", o.rows);
-      } catch (B) {
-        l("dataError", B);
+      } catch (ee) {
+        l("dataError", ee);
       }
-    }), lt(() => {
+    }), mt(() => {
       l("tableUnmounted");
-    }), $t(() => {
+    }), Mt(() => {
       l("tableBeforeMount");
-    }), (B, E) => (h(), w("div", ds, [
-      j(ns, {
+    }), (ee, j) => (y(), k("div", Ks, [
+      ne(Cs, {
         "show-search": e.showSearch,
-        "search-query": R(b),
-        "onUpdate:searchQuery": E[0] || (E[0] = (V) => ye(b) ? b.value = V : null),
-        onSearch: R(C),
+        "search-query": $(S),
+        "onUpdate:searchQuery": j[0] || (j[0] = (Z) => Fe(S) ? S.value = Z : null),
+        onSearch: $(E),
         "search-placeholder": e.searchPlaceholder,
         "search-class": e.searchClass
       }, {
-        left: I(() => [
-          q(B.$slots, "filterAreaLeft", {}, void 0, !0)
+        left: X(() => [
+          z(ee.$slots, "filterAreaLeft", {}, void 0, !0)
         ]),
-        right: I(() => [
-          q(B.$slots, "filterAreaRight", {}, void 0, !0)
+        right: X(() => [
+          z(ee.$slots, "filterAreaRight", {}, void 0, !0)
         ]),
         _: 3
       }, 8, ["show-search", "search-query", "onSearch", "search-placeholder", "search-class"]),
-      g("div", {
-        class: W(["vs-table-container", e.containerClass])
+      w("div", {
+        ref_key: "tableContainer",
+        ref: M,
+        class: G(["vs-table-container vs-position-relative vs-overflow-auto", [
+          e.containerClass,
+          {
+            "has-left-shadow": $(Lt),
+            "has-right-shadow": $(Pt)
+          }
+        ]])
       }, [
-        g("div", fs, [
-          g("table", {
-            class: W(["vs-table", e.tableClass])
+        w("div", {
+          ref_key: "tableResponsiveRef",
+          ref: A,
+          class: G(["vs-table-wrapper", { "vs-sticky-header-wrapper": e.stickyHeader }])
+        }, [
+          w("table", {
+            ref_key: "tableRef",
+            ref: T,
+            class: G(["vs-table", e.tableClass])
           }, [
-            j(Vo, {
+            ne(Xo, {
+              ref_key: "headerRef",
+              ref: i,
               columns: e.columns,
               expandable: e.expandable,
-              "is-item-selected-controlled": R(N),
-              "is-all-checked": R(de),
-              "is-some-checked": R(Ce),
+              "is-item-selected-controlled": $(I),
+              "is-all-checked": $(W),
+              "is-some-checked": $(V),
               tablename: e.tablename,
-              "sort-helpers": R(m),
-              filters: R(M),
-              "onUpdate:filters": E[1] || (E[1] = (V) => ye(M) ? M.value = V : null),
+              "sort-helpers": $(C),
+              filters: $(p),
+              "onUpdate:filters": j[1] || (j[1] = (Z) => Fe(p) ? p.value = Z : null),
               rows: e.rows,
               "header-class": e.headerClass,
-              onToggleAll: R(ke),
-              onApplyFilter: E[2] || (E[2] = (V, F) => {
-                R($)(V, F), u.value = 1;
+              onToggleAll: $(U),
+              onApplyFilter: j[2] || (j[2] = (Z, de) => {
+                $(x)(Z, de), d.value = 1;
               }),
-              onClearFilter: E[3] || (E[3] = (V) => {
-                R(x)(V), u.value = 1;
+              onClearFilter: j[3] || (j[3] = (Z) => {
+                $(R)(Z), d.value = 1;
               })
-            }, Ne({ _: 2 }, [
-              z(B.$slots, (V, F) => ({
-                name: F,
-                fn: I((we) => [
-                  q(B.$slots, F, ze(Ze(we)), void 0, !0)
+            }, Te({ _: 2 }, [
+              Q(ee.$slots, (Z, de) => ({
+                name: de,
+                fn: X((Ze) => [
+                  z(ee.$slots, de, nt(ot(Ze)), void 0, !0)
                 ])
               }))
             ]), 1032, ["columns", "expandable", "is-item-selected-controlled", "is-all-checked", "is-some-checked", "tablename", "sort-helpers", "filters", "rows", "header-class", "onToggleAll"]),
-            j(zo, {
+            ne(vs, {
+              ref_key: "bodyRef",
+              ref: c,
               loading: e.loading,
               "loading-text": e.loadingText,
               "no-data-text": e.noDataText,
               "no-data-description": e.noDataDescription,
-              "paginated-rows": R(d),
-              "total-columns": he.value,
+              "paginated-rows": $(g),
+              "total-columns": Vt.value,
               expandable: e.expandable,
-              "is-item-selected-controlled": R(N),
-              "selected-items": R(y),
+              "is-item-selected-controlled": $(I),
+              "selected-items": $(N),
               tablename: e.tablename,
               columns: e.columns,
               "row-key": e.rowKey,
               "row-class": e.rowClass,
               "cell-class": e.cellClass,
               "has-row-click": r.value,
-              "get-row-key": R(X),
-              "get-value": R(Vt),
-              "is-row-expanded": R(k),
-              "is-row-loading": R(A),
-              "toggle-row-expansion": R(S),
-              "toggle-row": R(te),
-              "is-row-selected": R(rt),
-              onRowClick: E[4] || (E[4] = (V, F) => B.$emit("rowClick", V, F))
-            }, Ne({ _: 2 }, [
-              z(B.$slots, (V, F) => ({
-                name: F,
-                fn: I((we) => [
-                  q(B.$slots, F, ze(Ze(we)), void 0, !0)
+              "get-row-key": $(re),
+              "get-value": $(Bt),
+              "is-row-expanded": $(L),
+              "is-row-loading": $(b),
+              "toggle-row-expansion": $(P),
+              "toggle-row": $(ge),
+              "is-row-selected": $(yt),
+              onRowClick: j[4] || (j[4] = (Z, de) => ee.$emit("rowClick", Z, de))
+            }, Te({ _: 2 }, [
+              Q(ee.$slots, (Z, de) => ({
+                name: de,
+                fn: X((Ze) => [
+                  z(ee.$slots, de, nt(ot(Ze)), void 0, !0)
                 ])
               }))
-            ]), 1032, ["loading", "loading-text", "no-data-text", "no-data-description", "paginated-rows", "total-columns", "expandable", "is-item-selected-controlled", "selected-items", "tablename", "columns", "row-key", "row-class", "cell-class", "has-row-click", "get-row-key", "get-value", "is-row-expanded", "is-row-loading", "toggle-row-expansion", "toggle-row", "is-row-selected"])
+            ]), 1032, ["loading", "loading-text", "no-data-text", "no-data-description", "paginated-rows", "total-columns", "expandable", "is-item-selected-controlled", "selected-items", "tablename", "columns", "row-key", "row-class", "cell-class", "has-row-click", "get-row-key", "get-value", "is-row-expanded", "is-row-loading", "toggle-row-expansion", "toggle-row", "is-row-selected"]),
+            e.showFooter ? (y(), fe(Ts, {
+              key: 0,
+              columns: e.columns,
+              rows: $(g),
+              expandable: e.expandable,
+              "is-item-selected-controlled": $(I)
+            }, null, 8, ["columns", "rows", "expandable", "is-item-selected-controlled"])) : D("", !0)
           ], 2)
-        ], 512)
+        ], 2)
       ], 2),
-      e.showFooter ? (h(), w("div", vs, [
-        g("div", ps, [
-          j(jt, {
-            modelValue: R(c),
-            "onUpdate:modelValue": E[5] || (E[5] = (V) => ye(c) ? c.value = V : null),
-            onRowsPerPageChanged: R(v)
+      e.showPagination ? (y(), k("div", zs, [
+        w("div", js, [
+          ne(on, {
+            modelValue: $(v),
+            "onUpdate:modelValue": j[5] || (j[5] = (Z) => Fe(v) ? v.value = Z : null),
+            onRowsPerPageChanged: $(h)
           }, null, 8, ["modelValue", "onRowsPerPageChanged"]),
-          E[7] || (E[7] = g("div", { class: "vs-divider" }, null, -1)),
-          g("div", ms, D(R(i).start < 1 ? 0 : R(i).start) + " - " + D(R(i).end) + " of " + D(R(f)) + " " + D(e.entriesText), 1)
+          j[7] || (j[7] = w("div", { class: "vs-divider" }, null, -1)),
+          w("div", Us, H($(f).start < 1 ? 0 : $(f).start) + " - " + H($(f).end) + " of " + H($(m)) + " " + H(e.entriesText), 1)
         ]),
-        j(It, {
-          modelValue: R(u),
-          "onUpdate:modelValue": E[6] || (E[6] = (V) => ye(u) ? u.value = V : null),
-          totalRecords: R(f),
-          rowsPerPage: R(c),
+        ne(Jt, {
+          modelValue: $(d),
+          "onUpdate:modelValue": j[6] || (j[6] = (Z) => Fe(d) ? d.value = Z : null),
+          totalRecords: $(m),
+          rowsPerPage: $(v),
           maxVisible: e.maxVisiblePages,
           tablename: e.tablename,
-          class: W(e.paginationClass),
-          onPageChanged: R(p)
+          class: G(e.paginationClass),
+          onPageChanged: $(u)
         }, null, 8, ["modelValue", "totalRecords", "rowsPerPage", "maxVisible", "tablename", "class", "onPageChanged"])
-      ])) : P("", !0)
+      ])) : D("", !0)
     ]));
   }
-}), hs = /* @__PURE__ */ ne(gs, [["__scopeId", "data-v-4da895c0"]]), ys = {
+}), Xs = /* @__PURE__ */ ae(Zs, [["__scopeId", "data-v-6e690e26"]]), Ys = {
   install(e) {
-    e.component("VsDataTable", hs);
+    e.component("VsDataTable", Xs);
   }
 };
 export {
-  hs as VsDataTable,
-  ys as default
+  Xs as VsDataTable,
+  Ys as default
 };