design-system-next 2.7.8 → 2.7.10

package/dist/design-system-next.js

@@ -404,9 +404,9 @@ function Fa(e, t) {
     height: r.height
   };
   let a = r.body;
-  [r, n].forEach(($) => {
-    const M = [], m = $.hFlip, v = $.vFlip;
-    let b = $.rotate;
+  [r, n].forEach((N) => {
+    const M = [], m = N.hFlip, v = N.vFlip;
+    let b = N.rotate;
     m ? v ? b += 2 : (M.push(
       "translate(" + (s.width + s.left).toString() + " " + (0 - s.top).toString() + ")"
     ), M.push("scale(-1 1)"), s.top = s.left = 0) : v && (M.push(
@@ -439,8 +439,8 @@ function Fa(e, t) {
   const o = n.width, l = n.height, u = s.width, d = s.height;
   let p, c;
   o === null ? (c = l === null ? "1em" : l === "auto" ? d : l, p = cr(c, u / d)) : (p = o === "auto" ? u : o, c = l === null ? cr(p, d / u) : l === "auto" ? d : l);
-  const h = {}, y = ($, M) => {
-    Ya(M) || (h[$] = M.toString());
+  const h = {}, y = (N, M) => {
+    Ya(M) || (h[N] = M.toString());
   };
   y("width", p), y("height", c);
   const f = [s.left, s.top, u, d];
@@ -729,8 +729,8 @@ function io(e, t, r, n) {
   if (e.random) {
     let A = e.resources.slice(0);
     for (o = []; A.length > 1; ) {
-      const N = Math.floor(Math.random() * A.length);
-      o.push(A[N]), A = A.slice(0, N).concat(A.slice(N + 1));
+      const $ = Math.floor(Math.random() * A.length);
+      o.push(A[$]), A = A.slice(0, $).concat(A.slice($ + 1));
     }
     o = o.concat(A);
   } else
@@ -741,13 +741,13 @@ function io(e, t, r, n) {
   function f() {
     c && (clearTimeout(c), c = null);
   }
-  function $() {
+  function N() {
     u === "pending" && (u = "aborted"), f(), h.forEach((A) => {
       A.status === "pending" && (A.status = "aborted");
     }), h = [];
   }
-  function M(A, N) {
-    N && (y = []), typeof A == "function" && y.push(A);
+  function M(A, $) {
+    $ && (y = []), typeof A == "function" && y.push(A);
   }
   function m() {
     return {
@@ -757,7 +757,7 @@ function io(e, t, r, n) {
       queriesSent: d,
       queriesPending: h.length,
       subscribe: M,
-      abort: $
+      abort: N
     };
   }
   function v() {
@@ -770,8 +770,8 @@ function io(e, t, r, n) {
       A.status === "pending" && (A.status = "aborted");
     }), h = [];
   }
-  function _(A, N, Y) {
-    const S = N !== "success";
+  function _(A, $, Y) {
+    const S = $ !== "success";
     switch (h = h.filter((w) => w !== A), u) {
       case "pending":
         break;
@@ -782,7 +782,7 @@ function io(e, t, r, n) {
       default:
         return;
     }
-    if (N === "abort") {
+    if ($ === "abort") {
       p = Y, v();
       return;
     }
@@ -813,14 +813,14 @@ function io(e, t, r, n) {
       v();
       return;
     }
-    const N = {
+    const $ = {
       status: "pending",
       resource: A,
       callback: (Y, S) => {
-        _(N, Y, S);
+        _($, Y, S);
       }
     };
-    h.push(N), d++, c = setTimeout(x, e.rotate), r(A, t, N.callback);
+    h.push($), d++, c = setTimeout(x, e.rotate), r(A, t, $.callback);
   }
   return setTimeout(x), m;
 }
@@ -1113,10 +1113,10 @@ function mr(e) {
 }
 const vr = (e, t) => {
   const r = ho(Cr, t), n = { ...bo }, s = t.mode || "svg", a = {}, o = t.style, l = typeof o == "object" && !(o instanceof Array) ? o : {};
-  for (let $ in t) {
-    const M = t[$];
+  for (let N in t) {
+    const M = t[N];
     if (M !== void 0)
-      switch ($) {
+      switch (N) {
         // Properties to ignore
         case "icon":
         case "style":
@@ -1128,7 +1128,7 @@ const vr = (e, t) => {
         case "inline":
         case "hFlip":
         case "vFlip":
-          r[$] = M === !0 || M === "true" || M === 1;
+          r[N] = M === !0 || M === "true" || M === 1;
           break;
         // Flip as string: 'horizontal,vertical'
         case "flip":
@@ -1140,7 +1140,7 @@ const vr = (e, t) => {
           break;
         // Rotation as string
         case "rotate":
-          typeof M == "string" ? r[$] = yo(M) : typeof M == "number" && (r[$] = M);
+          typeof M == "string" ? r[N] = yo(M) : typeof M == "number" && (r[N] = M);
           break;
         // Remove aria-hidden
         case "ariaHidden":
@@ -1148,8 +1148,8 @@ const vr = (e, t) => {
           M !== !0 && M !== "true" && delete n["aria-hidden"];
           break;
         default: {
-          const m = g0[$];
-          m ? (M === !0 || M === "true" || M === 1) && (r[m] = !0) : Cr[$] === void 0 && (n[$] = M);
+          const m = g0[N];
+          m ? (M === !0 || M === "true" || M === 1) && (r[m] = !0) : Cr[N] === void 0 && (n[N] = M);
         }
       }
   }
@@ -1159,8 +1159,8 @@ const vr = (e, t) => {
       ...a,
       ...l
     }, Object.assign(n, d);
-    let $ = 0, M = t.id;
-    return typeof M == "string" && (M = M.replace(/-/g, "_")), n.innerHTML = Va(u.body, M ? () => M + "ID" + $++ : "iconifyVue"), lr("svg", n);
+    let N = 0, M = t.id;
+    return typeof M == "string" && (M = M.replace(/-/g, "_")), n.innerHTML = Va(u.body, M ? () => M + "ID" + N++ : "iconifyVue"), lr("svg", n);
   }
   const { body: p, width: c, height: h } = e, y = s === "mask" || (s === "bg" ? !1 : p.indexOf("currentColor") !== -1), f = mo(p, {
     ...d,
@@ -1379,10 +1379,10 @@ function Uo(...e) {
     r && (clearTimeout(r), r = void 0, s(), s = je);
   };
   return (h) => {
-    const y = $e(o), f = Date.now() - t, $ = () => a = h();
-    return p(), y <= 0 ? (t = Date.now(), $()) : (f > y && (u || !n) ? (t = Date.now(), $()) : l && (a = new Promise((M, m) => {
+    const y = $e(o), f = Date.now() - t, N = () => a = h();
+    return p(), y <= 0 ? (t = Date.now(), N()) : (f > y && (u || !n) ? (t = Date.now(), N()) : l && (a = new Promise((M, m) => {
       s = d ? m : M, r = setTimeout(() => {
-        t = Date.now(), n = !0, M($()), p();
+        t = Date.now(), n = !0, M(N()), p();
       }, Math.max(0, y - f));
     })), !u && !r && (r = setTimeout(() => n = !0, y)), n = !1, a);
   };
@@ -1521,16 +1521,16 @@ function Yt(e, t, r = {}) {
         ((m = n.document.activeElement) == null ? void 0 : m.tagName) === "IFRAME" && !(v != null && v.contains(n.document.activeElement)) && t(M);
       }, 0);
     }, { passive: !0 })
-  ].filter(Boolean), $ = () => f.forEach((M) => M());
+  ].filter(Boolean), N = () => f.forEach((M) => M());
   return l ? {
-    stop: $,
+    stop: N,
     cancel: () => {
       u = !1;
     },
     trigger: (M) => {
       u = !0, h(M), u = !1;
     }
-  } : $;
+  } : N;
 }
 function Vo() {
   const e = Ue(!1), t = _0();
@@ -1617,8 +1617,8 @@ function Wo(e, t = {}) {
     }, y = (M) => {
       const m = Array.from(M ?? []).map((_) => _.type), v = h(m), b = d || M.length <= 1;
       return v && b;
-    }, f = () => /^(?:(?!chrome|android).)*safari/i.test(navigator.userAgent) && !("chrome" in window), $ = (M, m) => {
-      var v, b, _, x, A, N;
+    }, f = () => /^(?:(?!chrome|android).)*safari/i.test(navigator.userAgent) && !("chrome" in window), N = (M, m) => {
+      var v, b, _, x, A, $;
       const Y = (v = M.dataTransfer) == null ? void 0 : v.items;
       if (l = (b = Y && y(Y)) != null ? b : !1, p && M.preventDefault(), !f() && !l) {
         M.dataTransfer && (M.dataTransfer.dropEffect = "none");
@@ -1637,11 +1637,11 @@ function Wo(e, t = {}) {
           o -= 1, o === 0 && (s.value = !1), (A = u.onLeave) == null || A.call(u, null, M);
           break;
         case "drop":
-          o = 0, s.value = !1, l && (a.value = S, (N = u.onDrop) == null || N.call(u, S, M));
+          o = 0, s.value = !1, l && (a.value = S, ($ = u.onDrop) == null || $.call(u, S, M));
           break;
       }
     };
-    me(e, "dragenter", (M) => $(M, "enter")), me(e, "dragover", (M) => $(M, "over")), me(e, "dragleave", (M) => $(M, "leave")), me(e, "drop", (M) => $(M, "drop"));
+    me(e, "dragenter", (M) => N(M, "enter")), me(e, "dragover", (M) => N(M, "over")), me(e, "dragleave", (M) => N(M, "leave")), me(e, "drop", (M) => N(M, "drop"));
   }
   return {
     files: a,
@@ -1679,13 +1679,13 @@ function Ko(e, t, r = {}) {
   let p = je;
   const c = Ue(l), h = u.value ? he(
     () => [d.value, Le(n), c.value],
-    ([f, $]) => {
+    ([f, N]) => {
       if (p(), !c.value || !f.length)
         return;
       const M = new IntersectionObserver(
         t,
         {
-          root: Le($),
+          root: Le(N),
           rootMargin: s,
           threshold: a
         }
@@ -1779,25 +1779,25 @@ function qo(e, t = {}) {
     },
     behavior: u = "auto",
     window: d = r2,
-    onError: p = (N) => {
-      console.error(N);
+    onError: p = ($) => {
+      console.error($);
     }
   } = t, c = Ue(0), h = Ue(0), y = L({
     get() {
       return c.value;
     },
-    set(N) {
-      $(N, void 0);
+    set($) {
+      N($, void 0);
     }
   }), f = L({
     get() {
       return h.value;
     },
-    set(N) {
-      $(void 0, N);
+    set($) {
+      N(void 0, $);
     }
   });
-  function $(N, Y) {
+  function N($, Y) {
     var S, w, T, ee;
     if (!d)
       return;
@@ -1806,7 +1806,7 @@ function qo(e, t = {}) {
       return;
     (T = Z instanceof Document ? d.document.body : Z) == null || T.scrollTo({
       top: (S = $e(Y)) != null ? S : f.value,
-      left: (w = $e(N)) != null ? w : y.value,
+      left: (w = $e($)) != null ? w : y.value,
       behavior: $e(u)
     });
     const R = ((ee = Z == null ? void 0 : Z.document) == null ? void 0 : ee.documentElement) || (Z == null ? void 0 : Z.documentElement) || Z;
@@ -1822,26 +1822,26 @@ function qo(e, t = {}) {
     right: !1,
     top: !1,
     bottom: !1
-  }), b = (N) => {
-    M.value && (M.value = !1, v.left = !1, v.right = !1, v.top = !1, v.bottom = !1, s(N));
-  }, _ = Gn(b, r + n), x = (N) => {
+  }), b = ($) => {
+    M.value && (M.value = !1, v.left = !1, v.right = !1, v.top = !1, v.bottom = !1, s($));
+  }, _ = Gn(b, r + n), x = ($) => {
     var Y;
     if (!d)
       return;
-    const S = ((Y = N == null ? void 0 : N.document) == null ? void 0 : Y.documentElement) || (N == null ? void 0 : N.documentElement) || Le(N), { display: w, flexDirection: T, direction: ee } = getComputedStyle(S), Z = ee === "rtl" ? -1 : 1, R = S.scrollLeft;
+    const S = ((Y = $ == null ? void 0 : $.document) == null ? void 0 : Y.documentElement) || ($ == null ? void 0 : $.documentElement) || Le($), { display: w, flexDirection: T, direction: ee } = getComputedStyle(S), Z = ee === "rtl" ? -1 : 1, R = S.scrollLeft;
     v.left = R < c.value, v.right = R > c.value;
     const P = Math.abs(R * Z) <= (o.left || 0), U = Math.abs(R * Z) + S.clientWidth >= S.scrollWidth - (o.right || 0) - $r;
     w === "flex" && T === "row-reverse" ? (m.left = U, m.right = P) : (m.left = P, m.right = U), c.value = R;
     let Q = S.scrollTop;
-    N === d.document && !Q && (Q = d.document.body.scrollTop), v.top = Q < h.value, v.bottom = Q > h.value;
+    $ === d.document && !Q && (Q = d.document.body.scrollTop), v.top = Q < h.value, v.bottom = Q > h.value;
     const F = Math.abs(Q) <= (o.top || 0), K = Math.abs(Q) + S.clientHeight >= S.scrollHeight - (o.bottom || 0) - $r;
     w === "flex" && T === "column-reverse" ? (m.top = K, m.bottom = F) : (m.top = F, m.bottom = K), h.value = Q;
-  }, A = (N) => {
+  }, A = ($) => {
     var Y;
     if (!d)
       return;
-    const S = (Y = N.target.documentElement) != null ? Y : N.target;
-    x(S), M.value = !0, _(N), a(N);
+    const S = (Y = $.target.documentElement) != null ? Y : $.target;
+    x(S), M.value = !0, _($), a($);
   };
   return me(
     e,
@@ -1850,12 +1850,12 @@ function qo(e, t = {}) {
     l
   ), Fo(() => {
     try {
-      const N = $e(e);
-      if (!N)
+      const $ = $e(e);
+      if (!$)
         return;
-      x(N);
-    } catch (N) {
-      p(N);
+      x($);
+    } catch ($) {
+      p($);
     }
   }), me(
     e,
@@ -1869,8 +1869,8 @@ function qo(e, t = {}) {
     arrivedState: m,
     directions: v,
     measure() {
-      const N = $e(e);
-      d && N && x(N);
+      const $ = $e(e);
+      d && $ && x($);
     }
   };
 }
@@ -1893,7 +1893,7 @@ function Ct(e, t, r = {}) {
   function h() {
     if (l.measure(), !p.value || !c.value || !o(p.value))
       return;
-    const { scrollHeight: f, clientHeight: $, scrollWidth: M, clientWidth: m } = p.value, v = s === "bottom" || s === "top" ? f <= $ : M <= m;
+    const { scrollHeight: f, clientHeight: N, scrollWidth: M, clientWidth: m } = p.value, v = s === "bottom" || s === "top" ? f <= N : M <= m;
     (l.arrivedState[s] || v) && (u.value || (u.value = Promise.all([
       t(l),
       new Promise((b) => setTimeout(b, a))
@@ -1948,10 +1948,10 @@ function Ee(e, t, r, n = {}) {
     defaultValue: c,
     shouldEmit: h
   } = n, y = _0(), f = r || (y == null ? void 0 : y.emit) || ((s = y == null ? void 0 : y.$emit) == null ? void 0 : s.bind(y)) || ((o = (a = y == null ? void 0 : y.proxy) == null ? void 0 : a.$emit) == null ? void 0 : o.bind(y == null ? void 0 : y.proxy));
-  let $ = d;
-  t || (t = "modelValue"), $ = $ || `update:${t.toString()}`;
+  let N = d;
+  t || (t = "modelValue"), N = N || `update:${t.toString()}`;
   const M = (b) => l ? typeof l == "function" ? l(b) : Go(b) : b, m = () => zo(e[t]) ? M(e[t]) : c, v = (b) => {
-    h ? h(b) && f($, b) : f($, b);
+    h ? h(b) && f(N, b) : f(N, b);
   };
   if (u) {
     const b = m(), _ = H(b);
@@ -2038,7 +2038,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
       "spr-max-h-9 spr-min-w-9 spr-px-2 spr-py-3 spr-leading-300 spr-font-size-200 [&>svg]:spr-font-size-400": u.value && s.value === "large"
     }), T = O(
       M.value,
-      $.value,
+      N.value,
       A.value
     ), ee = O([
       "spr-transition spr-duration-150 spr-ease-in-out",
@@ -2066,7 +2066,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
         );
     }
     return O(S, w, T, ee);
-  }), $ = L(() => o.value === "secondary" || o.value === "tertiary" ? O({
+  }), N = L(() => o.value === "secondary" || o.value === "tertiary" ? O({
     "spr-text-color-strong": a.value === "neutral",
     "spr-text-color-brand-base": a.value === "success",
     "spr-text-color-danger-base": a.value === "danger"
@@ -2091,7 +2091,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
     "spr-border-solid !spr-border !spr-border-color-base": a.value === "neutral",
     "spr-border-solid !spr-border !spr-border-color-brand-base": a.value === "success",
     "spr-border-solid !spr-border !spr-border-color-danger-base": a.value === "danger"
-  })), N = L(() => ({
+  })), $ = L(() => ({
     ...l.value && { ariaDisabled: !0 },
     disabled: l.value,
     autofocus: r.value === "focus",
@@ -2100,7 +2100,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
   return {
     buttonClassses: f,
     buttonRef: p,
-    buttonProps: N,
+    buttonProps: $,
     handleClick: (S) => {
       if (l.value) {
         S.stopPropagation();
@@ -2621,7 +2621,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
           "spr-max-w-[217px]": !e.fullwidth,
           "hover:spr-drop-shadow-sm  spr-cursor-pointer": !e.viewOnly
         }
-      ), $ = O({
+      ), N = O({
         "spr-border-dashed": e.status === "pending",
         "spr-border-solid spr-border-color-danger-base": e.status === "error",
         "spr-border-solid": !e.status || e.status !== "pending" && e.status !== "error"
@@ -2632,7 +2632,7 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
       }), v = O("spr-text-color-strong spr-body-sm-regular", {
         "spr-text-color-danger-base": e.status === "error",
         "spr-text-color-strong spr-body-sm-regular-medium": r.includes(e.type)
-      }), b = O(f, c.value, $);
+      }), b = O(f, c.value, N);
       return {
         titleClasses: M,
         descriptionClasses: m,
@@ -2854,60 +2854,69 @@ const O = /* @__PURE__ */ F0(ti), ri = (e, t) => {
   bordered: {
     type: Boolean,
     default: !1
+  },
+  fullWidth: {
+    type: Boolean,
+    default: !1
   }
 }, Ji = {
   "update:modelValue": (e) => typeof e == "boolean"
 }, Xi = (e, t) => {
-  const { modelValue: r, disabled: n, checked: s } = Me(e), a = L(() => {
-    const u = O(
+  const { modelValue: r, disabled: n, checked: s, bordered: a, fullWidth: o } = Me(e), l = L(() => {
+    const c = O(
       "spr-flex spr-w-fit spr-select-none spr-items-center spr-gap-1.5 spr-transition spr-duration-150 spr-ease-in-out",
       {
         "spr-cursor-not-allowed": n.value,
         "spr-cursor-pointer": !n.value
       }
-    ), d = O(
+    ), h = O(
       "spr-h-[20px] spr-w-[20px] spr-appearance-none spr-rounded-[2.5px] spr-border-color-supporting spr-border-[1.25px] spr-border-solid spr-m-1",
       "spr-transition spr-duration-150 spr-ease-in-out",
       {
-        "spr-background-color-brand-base spr-border-color-brand-base hover:spr-background-color-brand-hover hover:spr-border-color-brand-hover": r.value || s.value,
-        "hover:spr-background-color-hover": !r.value && !s.value,
-        "spr-border-color-on-fill-disabled spr-background-color-disabled spr-cursor-not-allowed": n.value || s.value,
+        "spr-background-color-brand-base spr-border-color-brand-base": p.value && !n.value,
+        "hover:spr-background-color-brand-hover hover:spr-border-color-brand-hover": p.value && !a.value && !n.value,
+        //remove hover checkbox styling when bordered
+        "hover:spr-background-color-hover": !p.value && !a.value,
+        //remove hover checkbox styling when bordered
+        "spr-border-color-on-fill-disabled spr-background-color-disabled spr-cursor-not-allowed": !p.value && n.value,
+        "spr-bg-white-300 spr-border-none": p.value && n.value,
         "spr-cursor-pointer": !n.value
       }
-    ), p = O(
-      "spr-h-[20px] spr-w-[20px] spr-flex spr-items-center spr-justify-center spr-pointer-events-none spr-absolute spr-left-1/2 spr-top-1/2 -spr-translate-x-1/2 -spr-translate-y-1/2 spr-transform spr-font-bold spr-opacity-0",
+    ), y = O(
+      "spr-h-[20px] spr-w-[20px] spr-flex spr-items-center spr-justify-center spr-pointer-events-none spr-absolute spr-left-1/2 spr-top-1/2 -spr-translate-x-1/2 -spr-translate-y-1/2 spr-transform spr-font-bold spr-opacity-0 spr-text-color-inverted-strong",
       {
-        "spr-opacity-100": r.value || s.value,
-        "spr-text-color-inverted-strong": !n.value,
-        "spr-text-color-on-fill-disabled": n.value
+        "spr-opacity-100": p.value
       }
-    ), c = O("spr-body-sm-regular spr-text-color-strong spr-block", {
+    ), f = O("spr-body-sm-regular spr-text-color-strong spr-block", {
       "spr-text-color-on-fill-disabled": n.value
-    }), h = O("spr-body-xs-regular spr-block", {
+    }), N = O("spr-body-xs-regular spr-block", {
       "spr-text-color-on-fill-disabled": n.value
-    }), y = O(
-      "spr-border spr-rounded-md spr-p-size-spacing-2xs spr-border-solid spr-w-full spr-box-border",
+    }), M = O(
+      "spr-border spr-rounded-md spr-p-size-spacing-2xs spr-border-solid spr-box-border",
       {
         "spr-border-kangkong-700 spr-bg-kangkong-100": (r.value || s.value) && !n.value,
         "spr-border-mushroom-200": (!r.value || !s.value) && !n.value,
-        "spr-border-0 spr-bg-white-100": n.value
+        "hover:spr-background-color-hover": !r.value && !s.value || n.value,
+        "spr-border-0 spr-bg-white-100": n.value,
+        "spr-w-fit": !o.value,
+        "spr-w-full": o.value
       }
     );
     return {
-      baseClasses: u,
-      inputCheckboxClasses: d,
-      inputCheckboxCheckIconClasses: p,
-      labelClasses: c,
-      descriptionClasses: h,
-      borderedClasses: y
+      baseClasses: c,
+      inputCheckboxClasses: h,
+      inputCheckboxCheckIconClasses: y,
+      labelClasses: f,
+      descriptionClasses: N,
+      borderedClasses: M
     };
-  }), o = (u) => {
-    u.target instanceof HTMLInputElement && t("update:modelValue", u.target.checked);
-  }, l = L(() => e.indeterminate ? "ph:minus-bold" : "ph:check-bold");
+  }), u = (c) => {
+    c.target instanceof HTMLInputElement && t("update:modelValue", c.target.checked);
+  }, d = L(() => e.indeterminate ? "ph:minus-bold" : "ph:check-bold"), p = L(() => r.value || s.value);
   return {
-    checkboxClasses: a,
-    handleCheckbox: o,
-    resolveCheckboxIcon: l
+    checkboxClasses: l,
+    handleCheckbox: u,
+    resolveCheckboxIcon: d
   };
 }, qi = { class: "spr-relative spr-flex spr-items-center" }, e1 = ["disabled", "checked"], t1 = {
   key: 0,
@@ -3320,11 +3329,11 @@ const D1 = async (e, t, r) => {
     x: p,
     y: c
   } = Ar(d, n, u), h = n, y = {}, f = 0;
-  for (let $ = 0; $ < l.length; $++) {
+  for (let N = 0; N < l.length; N++) {
     const {
       name: M,
       fn: m
-    } = l[$], {
+    } = l[N], {
       x: v,
       y: b,
       data: _,
@@ -3356,7 +3365,7 @@ const D1 = async (e, t, r) => {
     }) : x.rects), {
       x: p,
       y: c
-    } = Ar(d, h, u)), $ = -1);
+    } = Ar(d, h, u)), N = -1);
   }
   return {
     x: p,
@@ -3432,10 +3441,10 @@ const I1 = (e) => ({
     const c = ts(p), h = {
       x: r,
       y: n
-    }, y = Bt(s), f = Rt(y), $ = await o.getDimensions(d), M = y === "y", m = M ? "top" : "left", v = M ? "bottom" : "right", b = M ? "clientHeight" : "clientWidth", _ = a.reference[f] + a.reference[y] - h[y] - a.floating[f], x = h[y] - a.reference[y], A = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(d));
-    let N = A ? A[b] : 0;
-    (!N || !await (o.isElement == null ? void 0 : o.isElement(A))) && (N = l.floating[b] || a.floating[f]);
-    const Y = _ / 2 - x / 2, S = N / 2 - $[f] / 2 - 1, w = W2(c[m], S), T = W2(c[v], S), ee = w, Z = N - $[f] - T, R = N / 2 - $[f] / 2 + Y, P = Mt(ee, R, Z), U = !u.arrow && Be(s) != null && R !== P && a.reference[f] / 2 - (R < ee ? w : T) - $[f] / 2 < 0, Q = U ? R < ee ? R - ee : R - Z : 0;
+    }, y = Bt(s), f = Rt(y), N = await o.getDimensions(d), M = y === "y", m = M ? "top" : "left", v = M ? "bottom" : "right", b = M ? "clientHeight" : "clientWidth", _ = a.reference[f] + a.reference[y] - h[y] - a.floating[f], x = h[y] - a.reference[y], A = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(d));
+    let $ = A ? A[b] : 0;
+    (!$ || !await (o.isElement == null ? void 0 : o.isElement(A))) && ($ = l.floating[b] || a.floating[f]);
+    const Y = _ / 2 - x / 2, S = $ / 2 - N[f] / 2 - 1, w = W2(c[m], S), T = W2(c[v], S), ee = w, Z = $ - N[f] - T, R = $ / 2 - N[f] / 2 + Y, P = Mt(ee, R, Z), U = !u.arrow && Be(s) != null && R !== P && a.reference[f] / 2 - (R < ee ? w : T) - N[f] / 2 < 0, Q = U ? R < ee ? R - ee : R - Z : 0;
     return {
       [y]: h[y] + Q,
       data: {
@@ -3470,20 +3479,20 @@ const x1 = function(e) {
         allowedPlacements: h = Ir,
         autoAlignment: y = !0,
         ...f
-      } = b2(e, t), $ = c !== void 0 || h === Ir ? A1(c || null, y, h) : h, M = await B0(t, f), m = ((r = o.autoPlacement) == null ? void 0 : r.index) || 0, v = $[m];
+      } = b2(e, t), N = c !== void 0 || h === Ir ? A1(c || null, y, h) : h, M = await B0(t, f), m = ((r = o.autoPlacement) == null ? void 0 : r.index) || 0, v = N[m];
       if (v == null)
         return {};
       const b = es(v, a, await (u.isRTL == null ? void 0 : u.isRTL(d.floating)));
       if (l !== v)
         return {
           reset: {
-            placement: $[0]
+            placement: N[0]
           }
         };
       const _ = [M[Ke(v)], M[b[0]], M[b[1]]], x = [...((n = o.autoPlacement) == null ? void 0 : n.overflows) || [], {
         placement: v,
         overflows: _
-      }], A = $[m + 1];
+      }], A = N[m + 1];
       if (A)
         return {
           data: {
@@ -3494,7 +3503,7 @@ const x1 = function(e) {
             placement: A
           }
         };
-      const N = x.map((w) => {
+      const $ = x.map((w) => {
         const T = Be(w.placement);
         return [w.placement, T && p ? (
           // Check along the mainAxis and main crossAxis side.
@@ -3503,12 +3512,12 @@ const x1 = function(e) {
           // Check only the mainAxis.
           w.overflows[0]
         ), w.overflows];
-      }).sort((w, T) => w[1] - T[1]), S = ((s = N.filter((w) => w[2].slice(
+      }).sort((w, T) => w[1] - T[1]), S = ((s = $.filter((w) => w[2].slice(
         0,
         // Aligned placements should not check their opposite crossAxis
         // side.
         Be(w[0]) ? 2 : 3
-      ).every((T) => T <= 0))[0]) == null ? void 0 : s[0]) || N[0][0];
+      ).every((T) => T <= 0))[0]) == null ? void 0 : s[0]) || $[0][0];
       return S !== l ? {
         data: {
           index: m + 1,
@@ -3539,14 +3548,14 @@ const x1 = function(e) {
         fallbackPlacements: h,
         fallbackStrategy: y = "bestFit",
         fallbackAxisSideDirection: f = "none",
-        flipAlignment: $ = !0,
+        flipAlignment: N = !0,
         ...M
       } = b2(e, t);
       if ((r = a.arrow) != null && r.alignmentOffset)
         return {};
-      const m = Ke(s), v = l2(l), b = Ke(l) === l, _ = await (u.isRTL == null ? void 0 : u.isRTL(d.floating)), x = h || (b || !$ ? [A0(l)] : v1(l)), A = f !== "none";
-      !h && A && x.push(...$1(l, $, f, _));
-      const N = [l, ...x], Y = await B0(t, M), S = [];
+      const m = Ke(s), v = l2(l), b = Ke(l) === l, _ = await (u.isRTL == null ? void 0 : u.isRTL(d.floating)), x = h || (b || !N ? [A0(l)] : v1(l)), A = f !== "none";
+      !h && A && x.push(...$1(l, N, f, _));
+      const $ = [l, ...x], Y = await B0(t, M), S = [];
       let w = ((n = a.flip) == null ? void 0 : n.overflows) || [];
       if (p && S.push(Y[m]), c) {
         const P = es(s, o, _);
@@ -3557,7 +3566,7 @@ const x1 = function(e) {
         overflows: S
       }], !S.every((P) => P <= 0)) {
         var T, ee;
-        const P = (((T = a.flip) == null ? void 0 : T.index) || 0) + 1, U = N[P];
+        const P = (((T = a.flip) == null ? void 0 : T.index) || 0) + 1, U = $[P];
         if (U) {
           var Z;
           const F = c === "alignment" ? v !== l2(U) : !1, K = ((Z = w[0]) == null ? void 0 : Z.overflows[0]) > 0;
@@ -3691,16 +3700,16 @@ const T1 = function(e) {
         const M = c === "y" ? "top" : "left", m = c === "y" ? "bottom" : "right", v = f + p[M], b = f - p[m];
         f = Mt(v, f, b);
       }
-      const $ = l.fn({
+      const N = l.fn({
         ...t,
         [h]: y,
         [c]: f
       });
       return {
-        ...$,
+        ...N,
         data: {
-          x: $.x - r,
-          y: $.y - n,
+          x: N.x - r,
+          y: N.y - n,
           enabled: {
             [h]: a,
             [c]: o
@@ -3726,23 +3735,23 @@ const T1 = function(e) {
         ...d
       } = b2(e, t), p = await B0(t, d), c = Ke(s), h = Be(s), y = l2(s) === "y", {
         width: f,
-        height: $
+        height: N
       } = a.floating;
       let M, m;
       c === "top" || c === "bottom" ? (M = c, m = h === (await (o.isRTL == null ? void 0 : o.isRTL(l.floating)) ? "start" : "end") ? "left" : "right") : (m = c, M = h === "end" ? "top" : "bottom");
-      const v = $ - p.top - p.bottom, b = f - p.left - p.right, _ = W2($ - p[M], v), x = W2(f - p[m], b), A = !t.middlewareData.shift;
-      let N = _, Y = x;
-      if ((r = t.middlewareData.shift) != null && r.enabled.x && (Y = b), (n = t.middlewareData.shift) != null && n.enabled.y && (N = v), A && !h) {
+      const v = N - p.top - p.bottom, b = f - p.left - p.right, _ = W2(N - p[M], v), x = W2(f - p[m], b), A = !t.middlewareData.shift;
+      let $ = _, Y = x;
+      if ((r = t.middlewareData.shift) != null && r.enabled.x && (Y = b), (n = t.middlewareData.shift) != null && n.enabled.y && ($ = v), A && !h) {
         const w = h2(p.left, 0), T = h2(p.right, 0), ee = h2(p.top, 0), Z = h2(p.bottom, 0);
-        y ? Y = f - 2 * (w !== 0 || T !== 0 ? w + T : h2(p.left, p.right)) : N = $ - 2 * (ee !== 0 || Z !== 0 ? ee + Z : h2(p.top, p.bottom));
+        y ? Y = f - 2 * (w !== 0 || T !== 0 ? w + T : h2(p.left, p.right)) : $ = N - 2 * (ee !== 0 || Z !== 0 ? ee + Z : h2(p.top, p.bottom));
       }
       await u({
         ...t,
         availableWidth: Y,
-        availableHeight: N
+        availableHeight: $
       });
       const S = await o.getDimensions(l.floating);
-      return f !== S.width || $ !== S.height ? {
+      return f !== S.width || N !== S.height ? {
         reset: {
           rects: !0
         }
@@ -3825,9 +3834,9 @@ function K2(e, t, r, n) {
   const d = l ? Pe(l) : window, p = !as() && r;
   let c = (o.left + (p && ((s = d.visualViewport) == null ? void 0 : s.offsetLeft) || 0)) / u.x, h = (o.top + (p && ((a = d.visualViewport) == null ? void 0 : a.offsetTop) || 0)) / u.y, y = o.width / u.x, f = o.height / u.y;
   if (l) {
-    const $ = Pe(l), M = n && d2(n) ? Pe(n) : n;
-    let m = $.frameElement;
-    for (; m && n && M !== $; ) {
+    const N = Pe(l), M = n && d2(n) ? Pe(n) : n;
+    let m = N.frameElement;
+    for (; m && n && M !== N; ) {
       const v = j2(m), b = m.getBoundingClientRect(), _ = getComputedStyle(m);
       b.x += (m.clientLeft + parseFloat(_.paddingLeft)) * v.x, b.y += (m.clientTop + parseFloat(_.paddingTop)) * v.y, c *= v.x, h *= v.y, y *= v.x, f *= v.y, c += b.x, h += b.y, m = Pe(m).frameElement;
     }
@@ -3911,10 +3920,10 @@ const _1 = { getClippingRect: function(e) {
     if (c) return c;
     let h = w0(d).filter((M) => d2(M) && p2(M) !== "body"), y = null;
     const f = Ze(d).position === "fixed";
-    let $ = f ? J2(d) : d;
-    for (; d2($) && !Qt($); ) {
-      const M = Ze($), m = yt($);
-      (f ? m || y : m || M.position !== "static" || !y || !["absolute", "fixed"].includes(y.position)) ? y = M : h = h.filter((v) => v !== $), $ = J2($);
+    let N = f ? J2(d) : d;
+    for (; d2(N) && !Qt(N); ) {
+      const M = Ze(N), m = yt(N);
+      (f ? m || y : m || M.position !== "static" || !y || !["absolute", "fixed"].includes(y.position)) ? y = M : h = h.filter((v) => v !== N), N = J2(N);
     }
     return p.set(d, h), h;
   }(t, this._c) : [].concat(r), o = [...a, n], l = o[0], u = o.reduce((d, p) => {
@@ -5174,7 +5183,7 @@ function nl(e, t, r, n, s, a) {
       autoHide: h,
       show: y,
       hide: f,
-      handleResize: $,
+      handleResize: N,
       onResize: M,
       classes: m,
       result: v
@@ -5192,7 +5201,7 @@ function nl(e, t, r, n, s, a) {
         mounted: p,
         "skip-transition": c,
         "auto-hide": h,
-        "handle-resize": $,
+        "handle-resize": N,
         classes: m,
         result: v,
         onHide: f,
@@ -5411,7 +5420,7 @@ function pl() {
     (function(r, n) {
       e.exports = n();
     })(cl, function() {
-      var r = 1e3, n = 6e4, s = 36e5, a = "millisecond", o = "second", l = "minute", u = "hour", d = "day", p = "week", c = "month", h = "quarter", y = "year", f = "date", $ = "Invalid Date", M = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, m = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, v = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(R) {
+      var r = 1e3, n = 6e4, s = 36e5, a = "millisecond", o = "second", l = "minute", u = "hour", d = "day", p = "week", c = "month", h = "quarter", y = "year", f = "date", N = "Invalid Date", M = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, m = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, v = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(R) {
         var P = ["th", "st", "nd", "rd"], U = R % 100;
         return "[" + R + (P[(U - 20) % 10] || P[U] || P[0]) + "]";
       } }, b = function(R, P, U) {
@@ -5432,8 +5441,8 @@ function pl() {
         return R === void 0;
       } }, x = "en", A = {};
       A[x] = v;
-      var N = "$isDayjsObject", Y = function(R) {
-        return R instanceof ee || !(!R || !R[N]);
+      var $ = "$isDayjsObject", Y = function(R) {
+        return R instanceof ee || !(!R || !R[$]);
       }, S = function R(P, U, Q) {
         var F;
         if (!P) return x;
@@ -5457,7 +5466,7 @@ function pl() {
       };
       var ee = function() {
         function R(U) {
-          this.$L = S(U.locale, null, !0), this.parse(U), this.$x = this.$x || U.x || {}, this[N] = !0;
+          this.$L = S(U.locale, null, !0), this.parse(U), this.$x = this.$x || U.x || {}, this[$] = !0;
         }
         var P = R.prototype;
         return P.parse = function(U) {
@@ -5481,7 +5490,7 @@ function pl() {
         }, P.$utils = function() {
           return T;
         }, P.isValid = function() {
-          return this.$d.toString() !== $;
+          return this.$d.toString() !== N;
         }, P.isSame = function(U, Q) {
           var F = w(U);
           return this.startOf(Q) <= F && F <= this.endOf(Q);
@@ -5552,7 +5561,7 @@ function pl() {
           return this.add(-1 * U, Q);
         }, P.format = function(U) {
           var Q = this, F = this.$locale();
-          if (!this.isValid()) return F.invalidDate || $;
+          if (!this.isValid()) return F.invalidDate || N;
           var K = U || "YYYY-MM-DDTHH:mm:ssZ", se = T.z(this), ie = this.$H, fe = this.$m, te = this.$M, ne = F.weekdays, ue = F.months, ye = F.meridiem, ge = function(ae, k, Oe, Je) {
             return ae && (ae[k] || ae(Q, K)) || Oe[k].slice(0, Je);
           }, De = function(ae) {
@@ -5777,7 +5786,7 @@ const $l = (e, t) => {
       monthsTabItemsBaseClasses: Ie,
       yearsTabItemsBaseClasses: xe
     };
-  }), h = H(null), y = H(null), f = H(null), $ = H(null), M = H(!1), m = H("tab-calendar"), v = H(le()), b = H(
+  }), h = H(null), y = H(null), f = H(null), N = H(null), M = H(!1), m = H("tab-calendar"), v = H(le()), b = H(
     Array.from({ length: 7 }, (z, G) => ({
       text: le().day(G).format("dd"),
       fullText: le().day(G).format("dddd"),
@@ -5789,7 +5798,7 @@ const $l = (e, t) => {
       fullText: le().month(G).format("MMMM"),
       monthValue: G
     }))
-  ), x = H(""), A = H(""), N = H(""), Y = H([]), S = H({
+  ), x = H(""), A = H(""), $ = H(""), Y = H([]), S = H({
     selectedMonth: le().month(),
     selectedYear: Number(o.value),
     calendarDays: []
@@ -5829,7 +5838,7 @@ const $l = (e, t) => {
   }, U = (z) => z.date.toDateString() === v.value.format("ddd MMM DD YYYY"), Q = (z) => !z.inactive && !ie(z), F = (z) => !!(z.inactive && !ie(z)), K = (z) => {
     var X;
     const G = (X = s0("text", x.value)) == null ? void 0 : X.monthValue;
-    return A.value && !x.value && !N.value && !ie(z) ? z.date.getDate() === Number(A.value) && !z.inactive : A.value && x && !N.value && !ie(z) ? z.date.getDate() === Number(A.value) && z.date.getMonth() === G && !z.inactive : A.value && x.value && N.value && !ie(z) ? z.date.getDate() === Number(A.value) && z.date.getMonth() === G && z.date.getFullYear().toString() === N.value && !z.inactive : !1;
+    return A.value && !x.value && !$.value && !ie(z) ? z.date.getDate() === Number(A.value) && !z.inactive : A.value && x && !$.value && !ie(z) ? z.date.getDate() === Number(A.value) && z.date.getMonth() === G && !z.inactive : A.value && x.value && $.value && !ie(z) ? z.date.getDate() === Number(A.value) && z.date.getMonth() === G && z.date.getFullYear().toString() === $.value && !z.inactive : !1;
   }, se = (z) => {
     var X;
     const G = (X = s0("text", x.value)) == null ? void 0 : X.monthValue;
@@ -5893,7 +5902,7 @@ const $l = (e, t) => {
     return !1;
   }, ve = (z) => {
     const G = le(z.date, "MM-DD-YYYY"), X = G.format("MM"), ce = G.format("DD"), Ne = G.format("YYYY");
-    x.value = X, A.value = ce, N.value = Ne, S.value.selectedMonth = z.date.getMonth(), S.value.selectedYear = z.date.getFullYear(), z2(), ee(), L2(), o0(), Y.value = [], t("getDateErrors", Y.value), setTimeout(() => {
+    x.value = X, A.value = ce, $.value = Ne, S.value.selectedMonth = z.date.getMonth(), S.value.selectedYear = z.date.getFullYear(), z2(), ee(), L2(), o0(), Y.value = [], t("getDateErrors", Y.value), setTimeout(() => {
       M.value = !1;
     }, 100);
   }, ae = (z) => {
@@ -5918,7 +5927,7 @@ const $l = (e, t) => {
   }, Gs = () => {
     (k.value.currentPage + 1) * k.value.itemsPerPage < k.value.yearsArray.length && k.value.currentPage++;
   }, Ws = L(() => k.value.currentPage === 0), Ks = L(() => (k.value.currentPage + 1) * k.value.itemsPerPage >= k.value.yearsArray.length), Js = (z) => {
-    m.value = "tab-calendar", N.value = z, S.value.selectedYear = Number(z), z2(), ee(), L2(), Y.value = [], t("getDateErrors", Y.value);
+    m.value = "tab-calendar", $.value = z, S.value.selectedYear = Number(z), z2(), ee(), L2(), Y.value = [], t("getDateErrors", Y.value);
   }, Xs = L(() => n.value || s.value), or = (z) => {
     var G, X;
     switch (z) {
@@ -5940,7 +5949,7 @@ const $l = (e, t) => {
   }, ir = () => {
     if (p.value) {
       const z = le(p.value, "MM-DD-YYYY"), G = z.format("MM"), X = z.format("DD"), ce = z.format("YYYY");
-      a0(), x.value = G, A.value = X, N.value = ce, p.value = `${G}-${X}-${ce}`, S.value.selectedMonth = z.get("month"), S.value.selectedYear = z.get("year"), z2(), ee(), L2(), t("getInputValue", `${G}-${X}-${ce}`);
+      a0(), x.value = G, A.value = X, $.value = ce, p.value = `${G}-${X}-${ce}`, S.value.selectedMonth = z.get("month"), S.value.selectedYear = z.get("year"), z2(), ee(), L2(), t("getInputValue", `${G}-${X}-${ce}`);
     }
   }, s0 = (z, G) => _.value.find(
     (X) => X[z].toString().toLowerCase() === G.toString().toLowerCase()
@@ -5951,7 +5960,7 @@ const $l = (e, t) => {
   }, ra = () => {
     A.value = A.value.replace(/[^0-9]/g, ""), Y.value = [], t("getDateErrors", Y.value), a0(), o0();
   }, na = () => {
-    N.value = N.value.replace(/[^0-9]/g, ""), Y.value = [], t("getDateErrors", Y.value), a0(), o0();
+    $.value = $.value.replace(/[^0-9]/g, ""), Y.value = [], t("getDateErrors", Y.value), a0(), o0();
   }, z2 = () => {
     if (x.value.length >= 2)
       if (!isNaN(Number(x.value)) && !isNaN(parseFloat(x.value))) {
@@ -5965,12 +5974,12 @@ const $l = (e, t) => {
       }
   }, a0 = Gn(() => {
     var z;
-    if (x.value && A.value && N.value) {
-      const G = `${x.value}-${A.value}-${N.value}`, X = le(G, "MM-DD-YYYY").isValid(), ce = Number(N.value) >= l.value.min && Number(N.value) <= l.value.max;
+    if (x.value && A.value && $.value) {
+      const G = `${x.value}-${A.value}-${$.value}`, X = le(G, "MM-DD-YYYY").isValid(), ce = Number($.value) >= l.value.min && Number($.value) <= l.value.max;
       if (X && ce) {
         Y.value = Y.value.filter((Ie) => Ie.title !== "Invalid Date");
         const Ne = (z = s0("text", x.value)) == null ? void 0 : z.monthValue;
-        S.value.selectedMonth = Number(Ne), S.value.selectedYear = Number(N.value), ee(), L2();
+        S.value.selectedMonth = Number(Ne), S.value.selectedYear = Number($.value), ee(), L2();
       } else if (!Y.value.some((Ie) => Ie.title === "Invalid Date")) {
         let Ie;
         ce ? Ie = "Invalid Date Format. Please use MM/DD/YYYY" : Ie = `Year must be between ${l.value.min} and ${l.value.max}.`, Y.value.push({
@@ -5984,16 +5993,16 @@ const $l = (e, t) => {
   }, aa = (z, G) => {
     G && G instanceof KeyboardEvent && G.key === "Backspace" && (z === "date" && A.value === "" && Qe(() => {
       y.value && y.value.focus();
-    }), z === "year" && N.value === "" && Qe(() => {
+    }), z === "year" && $.value === "" && Qe(() => {
       f.value && f.value.focus();
     }));
   }, L2 = () => {
-    if (x.value && A.value && N.value) {
+    if (x.value && A.value && $.value) {
       const z = _.value.find(
         (X) => X.text.toLowerCase() === x.value.toLowerCase()
-      ), G = k.value.yearsArray.find((X) => X === Number(N.value));
+      ), G = k.value.yearsArray.find((X) => X === Number($.value));
       if (z && G) {
-        const X = le(`${x.value}-${A.value}-${N.value}`, "MM-DD-YYYY"), ce = {
+        const X = le(`${x.value}-${A.value}-${$.value}`, "MM-DD-YYYY"), ce = {
           // Standard date formats
           mmddyyyy: X.format("MM-DD-YYYY"),
           ddmmyyyy: X.format("DD-MM-YYYY"),
@@ -6031,7 +6040,7 @@ const $l = (e, t) => {
       );
       X && (z = X.monthValue < 10 ? `0${X.monthValue + 1}` : `${X.monthValue + 1}`);
     }
-    t("getInputValue", `${z}-${A.value}-${N.value}`);
+    t("getInputValue", `${z}-${A.value}-${$.value}`);
   }, oa = () => {
     t("getMonthList", _.value);
   }, ia = () => {
@@ -6043,7 +6052,7 @@ const $l = (e, t) => {
     z === !1 && setTimeout(() => {
       m.value = "tab-calendar", Je();
     }, 500);
-  }), he(N, (z) => {
+  }), he($, (z) => {
     if (z) {
       const G = parseInt(z, 10);
       if (isNaN(G)) return;
@@ -6067,7 +6076,7 @@ const $l = (e, t) => {
     datePickerRef: h,
     monthInputRef: y,
     dateInputRef: f,
-    yearInputRef: $,
+    yearInputRef: N,
     datePopperState: M,
     currentTab: m,
     currentDate: v,
@@ -6075,7 +6084,7 @@ const $l = (e, t) => {
     monthsList: _,
     dateInput: A,
     monthInput: x,
-    yearInput: N,
+    yearInput: $,
     datePickerErrors: Y,
     calendarTabPageData: S,
     calendarTabIsMinMonth: w,
@@ -6153,7 +6162,7 @@ const $l = (e, t) => {
       daysOfWeek: h,
       dateInput: y,
       monthsList: f,
-      monthInput: $,
+      monthInput: N,
       yearInput: M,
       calendarTabPageData: m,
       calendarTabIsMinMonth: v,
@@ -6161,7 +6170,7 @@ const $l = (e, t) => {
       calendarTabIsRestDay: _,
       calendarTabIsTodayIndicator: x,
       calendarTabIsActiveMonthDates: A,
-      calendarTabIsInactiveMonthDates: N,
+      calendarTabIsInactiveMonthDates: $,
       calendarTabIsSelectedDate: Y,
       calendarTabIsUnSelectedDate: S,
       calendarTabIsDateIsDisabled: w,
@@ -6309,7 +6318,7 @@ const $l = (e, t) => {
                         // Active Month Dates
                         "spr-text-color-strong": i(A)(k),
                         // Inactive Month Dates (Past/Future)
-                        "spr-text-color-disabled": i(N)(k),
+                        "spr-text-color-disabled": i($)(k),
                         // Selected Date
                         "spr-background-color-brand-base active:spr-background-color-brand-pressed spr-text-color-inverted-strong spr-cursor-pointer spr-text-white-50 active:spr-scale-95": i(Y)(k),
                         // Unselected Date
@@ -6332,8 +6341,8 @@ const $l = (e, t) => {
                     i(s).monthsTabItemsBaseClasses,
                     {
                       "spr-text-color-brand-base": k.monthValue === i(c).month(),
-                      "spr-border-color-weak hover:spr-background-color-hover active:spr-background-color-pressed": k.text.toLowerCase() !== i($).toLowerCase(),
-                      "spr-border-color-brand-base spr-background-color-single-active": k.text.toLowerCase() === i($).toLowerCase()
+                      "spr-border-color-weak hover:spr-background-color-hover active:spr-background-color-pressed": k.text.toLowerCase() !== i(N).toLowerCase(),
+                      "spr-border-color-brand-base spr-background-color-single-active": k.text.toLowerCase() === i(N).toLowerCase()
                     }
                   ]),
                   onClick: (Je) => i(Q)(k)
@@ -6382,7 +6391,7 @@ const $l = (e, t) => {
                 i2(I("input", {
                   ref_key: "monthInputRef",
                   ref: o,
-                  "onUpdate:modelValue": ae[0] || (ae[0] = (k) => Ce($) ? $.value = k : null),
+                  "onUpdate:modelValue": ae[0] || (ae[0] = (k) => Ce(N) ? N.value = k : null),
                   class: D(["spr-w-[38px] spr-min-w-[38px]", i(s).datePickerInputClasses]),
                   type: "text",
                   placeholder: "MMM",
@@ -6395,7 +6404,7 @@ const $l = (e, t) => {
                   (...k) => i(ne) && i(ne)(...k)),
                   onKeydown: ae[3] || (ae[3] = (k) => i(De)("month", k))
                 }, null, 42, Al), [
-                  [X0, i($)]
+                  [X0, i(N)]
                 ]),
                 ae[16] || (ae[16] = I("span", { class: "spr-text-color-strong spr-font-size-200 spr-text-color-weak" }, "/", -1)),
                 i2(I("input", {
@@ -6546,11 +6555,11 @@ const $l = (e, t) => {
   "infinite-scroll-trigger": Boolean,
   "update:modelValue": (e) => e
 }, Xl = (e, t) => {
-  const { menuList: r, searchString: n, disabled: s, multiSelect: a, removeCurrentLevelInBackLabel: o, ladderized: l } = Me(e), u = Ee(e, "modelValue", t), d = H(null), p = H([]), c = H([]), h = H(!1), y = L(() => s.value), f = L(() => l.value && n.value !== "" && u.value.length === 0), $ = () => {
+  const { menuList: r, searchString: n, disabled: s, multiSelect: a, removeCurrentLevelInBackLabel: o, ladderized: l } = Me(e), u = Ee(e, "modelValue", t), d = H(null), p = H([]), c = H([]), h = H(!1), y = L(() => s.value), f = L(() => l.value && n.value !== "" && u.value.length === 0), N = () => {
     c.value = [...r.value];
   };
   he(r, () => {
-    $();
+    N();
   });
   const M = () => {
     r.value && r.value.length === 0 || (a.value ? c.value = [...r.value] : m());
@@ -6597,7 +6606,7 @@ const $l = (e, t) => {
     e.ladderized || (u.value = S.map((w) => w.value.toString())), a.value || (e.ladderized && e.searchString !== "" && (u.value = [S[0].subvalue ?? "", S[0].value]), setTimeout(() => {
       h.value = !1;
     }, 10));
-  }, N = (S) => {
+  }, $ = (S) => {
     Y(S) && (h.value = !1);
   }, Y = (S) => {
     let w = c.value;
@@ -6607,7 +6616,7 @@ const $l = (e, t) => {
     }), !(w.length > 0);
   };
   return t2(() => {
-    $();
+    N();
   }), {
     dropdownPopperState: h,
     dropdownRef: d,
@@ -6615,7 +6624,7 @@ const $l = (e, t) => {
     isDropdownPopperDisabled: y,
     selectedListItems: p,
     handleSelectedItem: A,
-    handleSelectedLadderizedItem: N,
+    handleSelectedLadderizedItem: $,
     dropdownValue: u,
     removeCurrentLevelInBackLabel: o,
     isLadderizedSearch: f
@@ -6679,7 +6688,7 @@ const $l = (e, t) => {
       const v = u.value.find((b) => String(b.value) === String(m));
       v && r.value.push(v);
     });
-  }, $ = (m) => ({
+  }, N = (m) => ({
     [l.value.listItemClasses]: !0,
     "spr-background-color-single-active": p(m)
   }), M = (m) => {
@@ -6699,7 +6708,7 @@ const $l = (e, t) => {
     localizedMenuList: u,
     groupedMenuList: d,
     isItemSelected: p,
-    getListItemClasses: $,
+    getListItemClasses: N,
     handleSelectedItem: M
   };
 }, n3 = { class: "spr-font-main" }, s3 = {
@@ -6733,7 +6742,7 @@ const $l = (e, t) => {
             I("span", null, V(c.groupLabel), 1)
           ])) : j("", !0),
           (g(!0), C(q, null, de(c.items, (y, f) => {
-            var $;
+            var N;
             return g(), C("div", {
               key: f,
               class: D(i(l)(y)),
@@ -6751,7 +6760,7 @@ const $l = (e, t) => {
                 key: 1,
                 class: "spr-text-color-brand-base spr-w-[1.39em]",
                 icon: "ph:check"
-              })) : r.ladderized && y.sublevel && (($ = y.sublevel) == null ? void 0 : $.length) > 0 ? (g(), W(i(J), {
+              })) : r.ladderized && y.sublevel && ((N = y.sublevel) == null ? void 0 : N.length) > 0 ? (g(), W(i(J), {
                 key: 2,
                 class: "spr-text-color-weak spr-size-4",
                 icon: "ph:caret-right"
@@ -6809,7 +6818,7 @@ const $l = (e, t) => {
   "update:modelValue": (e) => e
 }, M3 = (e, t) => {
   const r = Ee(e, "modelValue", t), { menuList: n, removeCurrentLevelInBackLabel: s } = Me(e), a = H("slide-left"), o = H(""), l = H([]), u = H(0), d = H(n.value), p = H([]), c = (v) => {
-    a.value = "slide-left", h(v), L(() => p.value.some((_) => _.value === v.value)).value ? $(v) : f(v), v.sublevel && v.sublevel.length > 0 && y(v), t("update:modelValue", r.value);
+    a.value = "slide-left", h(v), L(() => p.value.some((_) => _.value === v.value)).value ? N(v) : f(v), v.sublevel && v.sublevel.length > 0 && y(v), t("update:modelValue", r.value);
   }, h = (v) => {
     l.value[u.value] ? l.value[u.value] = v : l.value.push(v);
   }, y = (v) => {
@@ -6823,7 +6832,7 @@ const $l = (e, t) => {
         o.value = v.text;
       r.value.push(v.value.toString());
     }
-  }, $ = (v) => {
+  }, N = (v) => {
     const b = o.value.trim().split(",");
     b == null || b.pop(), b == null || b.push(v.text), o.value = (b == null ? void 0 : b.join(", ")) ?? "";
     const _ = r.value;
@@ -6973,7 +6982,7 @@ const $l = (e, t) => {
       removeCurrentLevelInBackLabel: h,
       isLadderizedSearch: y
     } = Xl(r, n);
-    return (f, $) => (g(), W(i(ze), {
+    return (f, N) => (g(), W(i(ze), {
       shown: i(s),
       "aria-id": "dropdown-wrapper",
       distance: "4",
@@ -7004,7 +7013,7 @@ const $l = (e, t) => {
               key: 0,
               modelValue: i(u),
               "onUpdate:modelValue": [
-                $[1] || ($[1] = (M) => Ce(u) ? u.value = M : null),
+                N[1] || (N[1] = (M) => Ce(u) ? u.value = M : null),
                 i(d)
               ],
               "menu-list": i(o),
@@ -7015,21 +7024,21 @@ const $l = (e, t) => {
               key: 1,
               modelValue: i(c),
               "onUpdate:modelValue": [
-                $[2] || ($[2] = (M) => Ce(c) ? c.value = M : null),
+                N[2] || (N[2] = (M) => Ce(c) ? c.value = M : null),
                 i(p)
               ],
               ladderized: r.ladderized,
               "menu-list": i(o),
               "remove-current-level-in-back-label": i(h)
             }, null, 8, ["modelValue", "ladderized", "menu-list", "remove-current-level-in-back-label", "onUpdate:modelValue"]))
-          ], 64)) : (g(), C("div", I3, $[3] || ($[3] = [
+          ], 64)) : (g(), C("div", I3, N[3] || (N[3] = [
             I("span", { class: "spr-body-sm-regular spr-m-0" }, "No results found", -1)
           ])))
         ], 2)
       ]),
       default: B(() => [
         I("div", {
-          onClick: $[0] || ($[0] = (M) => s.value = !0)
+          onClick: N[0] || (N[0] = (M) => s.value = !0)
         }, [
           re(f.$slots, "default")
         ]),
@@ -7265,7 +7274,7 @@ const $l = (e, t) => {
     s.value !== null && (s.value.click(), h.value = M);
   }, f = (M) => {
     h.value !== null && (a.value[h.value] = M.target.files[0], h.value = null);
-  }, $ = L(() => e.fileTypes ? e.fileTypes.map((m) => {
+  }, N = L(() => e.fileTypes ? e.fileTypes.map((m) => {
     switch (m) {
       case "application/msword":
         return "MS WORD";
@@ -7291,7 +7300,7 @@ const $l = (e, t) => {
     clickInitialInputFile: c,
     clickListInputFile: y,
     replaceFile: f,
-    supportedFileTypeLabel: $
+    supportedFileTypeLabel: N
   };
 }, X3 = { class: "media-upload" }, q3 = {
   key: 0,
@@ -7316,7 +7325,7 @@ const $l = (e, t) => {
       replaceFile: h,
       supportedFileTypeLabel: y
     } = J3(r, n);
-    return (f, $) => (g(), C("div", X3, [
+    return (f, N) => (g(), C("div", X3, [
       r.title ? (g(), C("label", q3, V(r.title), 1)) : j("", !0),
       r.modelValue.length <= 0 ? (g(), C("div", {
         key: 1,
@@ -7335,7 +7344,7 @@ const $l = (e, t) => {
             multiple: r.multiple,
             disabled: r.disabled,
             accept: r.fileTypes.join(","),
-            onChange: $[0] || ($[0] = //@ts-ignore
+            onChange: N[0] || (N[0] = //@ts-ignore
             (...M) => i(u) && i(u)(...M))
           }, null, 40, e4),
           E(i(J), {
@@ -7350,7 +7359,7 @@ const $l = (e, t) => {
             disabled: r.disabled,
             onClick: i(p)
           }, {
-            default: B(() => $[2] || ($[2] = [
+            default: B(() => N[2] || (N[2] = [
               Se("Browse Files")
             ])),
             _: 1
@@ -7377,7 +7386,7 @@ const $l = (e, t) => {
           multiple: "false",
           accept: r.fileTypes.join(","),
           hidden: "",
-          onChange: $[1] || ($[1] = //@ts-ignore
+          onChange: N[1] || (N[1] = //@ts-ignore
           (...M) => i(h) && i(h)(...M))
         }, null, 40, n4),
         (g(!0), C(q, null, de(f.modelValue, (M, m) => (g(), C("div", {
@@ -7400,7 +7409,7 @@ const $l = (e, t) => {
               variant: "secondary",
               onClick: (v) => i(c)(m)
             }, {
-              default: B(() => $[3] || ($[3] = [
+              default: B(() => N[3] || (N[3] = [
                 Se("Replace")
               ])),
               _: 2
@@ -7514,7 +7523,7 @@ const $l = (e, t) => {
   const { active: n, error: s, disabled: a, offsetSize: o } = Me(e), l = H(null), { focused: u } = Kn(l), d = Ee(e, "modelValue", t), p = L(() => {
     const y = O("spr-flex spr-flex-col spr-gap-size-spacing-4xs"), f = O("spr-body-sm-regular spr-text-color-strong spr-block", {
       "spr-text-color-on-fill-disabled": a.value
-    }), $ = O(
+    }), N = O(
       "spr-relative spr-flex spr-items-center spr-p-[1.5px] spr-rounded-border-radius-md spr-border-[1.5px] spr-border-solid",
       {
         // Border State
@@ -7569,7 +7578,7 @@ const $l = (e, t) => {
     return {
       baseClasses: y,
       labelClasses: f,
-      inputTextBaseClasses: $,
+      inputTextBaseClasses: N,
       inputTextClasses: M,
       iconSlotClasses: m,
       prefixSlotClasses: v,
@@ -7660,16 +7669,16 @@ const $l = (e, t) => {
   __proto__: null,
   default: Ye
 }, Symbol.toStringTag, { value: "Module" })), m4 = (e, t) => {
-  const { options: r, filterMenu: n, filterData: s, loading: a, filterable: o, filling: l, deselected: u, hasSearchApi: d } = Me(e), p = Ee(e, "modelValue", t), c = H(!1), h = Ee(e, "search", t), y = Ee(e, "searchFilter", t), f = H(""), $ = H(""), M = H(!1), m = H(!1), v = H({}), b = H({}), _ = H(`filter-${le().valueOf()}-${Math.floor(Math.random() * 1e3)}`), x = H(
+  const { options: r, filterMenu: n, filterData: s, loading: a, filterable: o, filling: l, deselected: u, hasSearchApi: d } = Me(e), p = Ee(e, "modelValue", t), c = H(!1), h = Ee(e, "search", t), y = Ee(e, "searchFilter", t), f = H(""), N = H(""), M = H(!1), m = H(!1), v = H({}), b = H({}), _ = H(`filter-${le().valueOf()}-${Math.floor(Math.random() * 1e3)}`), x = H(
     n.value
-  ), A = H([]), N = H(null), Y = H([]), S = H(""), w = L(() => {
+  ), A = H([]), $ = H(null), Y = H([]), S = H(""), w = L(() => {
     var ue;
     if (l.value) return r.value;
     const te = d.value ? "" : f.value.toLowerCase();
     return (ue = r.value) == null ? void 0 : ue.filter((ye, ge) => (p.value.find((ve) => ve.value === ye.value && ve.isSelected) && (r.value[ge].isSelected = !0), ye.text.toLowerCase().includes(te)));
   }), T = L(() => a.value ? s.value : s.value.filter((ne, ue) => (A.value.find(
     (ge) => ge.value === ne.value && ge.isSelected
-  ) && (s.value[ue].isSelected = !0), ne.text.toLowerCase().includes($.value.toLowerCase())))), ee = L(() => Object.values(b.value).some((te) => te.isFilterVisible)), Z = L(() => T.value.filter((te) => te.isSelected)), R = (te) => {
+  ) && (s.value[ue].isSelected = !0), ne.text.toLowerCase().includes(N.value.toLowerCase())))), ee = L(() => Object.values(b.value).some((te) => te.isFilterVisible)), Z = L(() => T.value.filter((te) => te.isSelected)), R = (te) => {
     t("getFilterData", te), S.value = te;
   }, P = (te) => {
     Object.keys(b.value).forEach((ne) => {
@@ -7682,7 +7691,7 @@ const $l = (e, t) => {
       {}
     ));
   }, Q = (te) => A.value.filter((ne) => ne.column === te).length;
-  Yt(N, () => {
+  Yt($, () => {
     c.value = !1;
   });
   const F = () => {
@@ -7733,9 +7742,9 @@ const $l = (e, t) => {
     { deep: !0 }
   ), he(f, (te, ne) => {
     te !== ne && (h.value = te);
-  }), he($, (te, ne) => {
+  }), he(N, (te, ne) => {
     te !== ne && (y.value = te);
-  }), Ct(() => Y.value[0], ie, { distance: 10 }), Ct(N, ie, { distance: 10 });
+  }), Ct(() => Y.value[0], ie, { distance: 10 }), Ct($, ie, { distance: 10 });
   const fe = L(() => {
     const te = O("spr-relative spr-inline-block spr-w-full"), ne = O(
       "spr-border-color-weak spr-border spr-border-x-0 spr-border-t-0 spr-border-solid spr-p-size-spacing-2xs",
@@ -7771,11 +7780,11 @@ const $l = (e, t) => {
     mappedMenuData: v,
     getSelectedFilterMenuOption: Z,
     getFiltereredMenuOption: T,
-    filterMenuSearchvalue: $,
+    filterMenuSearchvalue: N,
     mappedFilterMenuList: b,
     filterClass: fe,
     uniqueId: _,
-    filterOptionRef: N,
+    filterOptionRef: $,
     filterMenuOptionList: Y,
     selectAllOptions: F,
     getMappedFilterData: R,
@@ -7884,7 +7893,7 @@ const $l = (e, t) => {
       filterClass: h,
       uniqueId: y,
       filterOptionRef: f,
-      filterMenuOptionList: $,
+      filterMenuOptionList: N,
       selectAllOptions: M,
       getMappedFilterData: m,
       saveSelectedFilter: v,
@@ -7893,7 +7902,7 @@ const $l = (e, t) => {
     } = m4(r, n);
     return (x, A) => (g(), W(i(ze), {
       shown: i(s),
-      "onUpdate:shown": A[5] || (A[5] = (N) => Ce(s) ? s.value = N : null),
+      "onUpdate:shown": A[5] || (A[5] = ($) => Ce(s) ? s.value = $ : null),
       "aria-id": "filter-option-wrapper",
       distance: "4",
       placement: "bottom",
@@ -7912,19 +7921,19 @@ const $l = (e, t) => {
         }, [
           x.filterMenu.length > 0 && x.filterable ? (g(), C("div", b4, [
             I("div", D4, [
-              (g(!0), C(q, null, de(x.filterMenu, (N) => (g(), C(q, {
-                key: N.field
+              (g(!0), C(q, null, de(x.filterMenu, ($) => (g(), C(q, {
+                key: $.field
               }, [
-                i(c)[N.field].count ? (g(), W(F2, {
+                i(c)[$.field].count ? (g(), W(F2, {
                   key: 0,
-                  label: i(c)[N.field].columnName,
+                  label: i(c)[$.field].columnName,
                   icon: "ph:funnel-simple"
                 }, null, 8, ["label"])) : j("", !0)
               ], 64))), 128))
             ]),
             E(i(ze), {
               shown: i(o),
-              "onUpdate:shown": A[4] || (A[4] = (N) => Ce(o) ? o.value = N : null),
+              "onUpdate:shown": A[4] || (A[4] = ($) => Ce(o) ? o.value = $ : null),
               "aria-id": "filter-menu-wrapper",
               distance: "4",
               placement: "right-start",
@@ -7941,7 +7950,7 @@ const $l = (e, t) => {
                     A[6] || (A[6] = Se(" Add Filter ")),
                     I("span", {
                       class: "spr-cursor-pointer",
-                      onClick: A[2] || (A[2] = (N) => o.value = !1)
+                      onClick: A[2] || (A[2] = ($) => o.value = !1)
                     }, [
                       E(i(J), { icon: "ph:x" })
                     ])
@@ -7949,10 +7958,10 @@ const $l = (e, t) => {
                   I("div", {
                     class: D(i(h).PopperContentClasses)
                   }, [
-                    (g(!0), C(q, null, de(x.filterMenu, (N) => (g(), W(i(ze), {
-                      key: N.field,
-                      shown: i(c)[N.field].isFilterVisible,
-                      "onUpdate:shown": (Y) => i(c)[N.field].isFilterVisible = Y,
+                    (g(!0), C(q, null, de(x.filterMenu, ($) => (g(), W(i(ze), {
+                      key: $.field,
+                      shown: i(c)[$.field].isFilterVisible,
+                      "onUpdate:shown": (Y) => i(c)[$.field].isFilterVisible = Y,
                       "aria-id": "filter-menu-wrapper",
                       placement: "right-start",
                       triggers: ["click"],
@@ -7968,7 +7977,7 @@ const $l = (e, t) => {
                             A[7] || (A[7] = Se(" Add Filter ")),
                             I("span", {
                               class: "spr-cursor-pointer",
-                              onClick: (Y) => i(c)[N.field].isFilterVisible = !1
+                              onClick: (Y) => i(c)[$.field].isFilterVisible = !1
                             }, [
                               E(i(J), { icon: "ph:x" })
                             ], 8, I4)
@@ -7998,10 +8007,10 @@ const $l = (e, t) => {
                           ])) : j("", !0),
                           i(d).length > 0 ? (g(), C("div", {
                             key: 1,
-                            id: N.field,
+                            id: $.field,
                             ref_for: !0,
                             ref_key: "filterMenuOptionList",
-                            ref: $,
+                            ref: N,
                             class: "spr-max-h-[264px] spr-space-y-size-spacing-6xs spr-overflow-auto spr-p-size-spacing-2xs"
                           }, [
                             (g(!0), C(q, null, de(i(d), (Y, S) => (g(), C("div", {
@@ -8038,7 +8047,7 @@ const $l = (e, t) => {
                               id: "cancel-button",
                               variant: "secondary",
                               size: "small",
-                              onClick: (Y) => i(c)[N.field].isFilterVisible = !1
+                              onClick: (Y) => i(c)[$.field].isFilterVisible = !1
                             }, {
                               default: B(() => A[10] || (A[10] = [
                                 Se(" Cancel ")
@@ -8049,7 +8058,7 @@ const $l = (e, t) => {
                               id: "save-button",
                               size: "small",
                               tone: "success",
-                              onClick: (Y) => i(v)(N.field)
+                              onClick: (Y) => i(v)($.field)
                             }, {
                               default: B(() => A[11] || (A[11] = [
                                 Se(" Save ")
@@ -8061,13 +8070,13 @@ const $l = (e, t) => {
                       ]),
                       default: B(() => [
                         E(F2, {
-                          active: i(c)[N.field].isFilterVisible,
-                          label: i(c)[N.field].columnName,
-                          badge: i(b)(N.field) > 0,
-                          "badge-text": i(b)(N.field).toString(),
+                          active: i(c)[$.field].isFilterVisible,
+                          label: i(c)[$.field].columnName,
+                          badge: i(b)($.field) > 0,
+                          "badge-text": i(b)($.field).toString(),
                           "badge-variant": "danger",
                           icon: "ph:funnel-simple",
-                          onClick: (Y) => i(m)(N.field)
+                          onClick: (Y) => i(m)($.field)
                         }, null, 8, ["active", "label", "badge", "badge-text", "onClick"])
                       ]),
                       _: 2
@@ -8109,8 +8118,8 @@ const $l = (e, t) => {
           ref: f,
           class: "spr-max-h-[264px] spr-space-y-size-spacing-6xs spr-overflow-auto spr-p-size-spacing-3xs"
         }, [
-          (g(!0), C(q, null, de(i(l), (N, Y) => (g(), C("div", {
-            key: N.value,
+          (g(!0), C(q, null, de(i(l), ($, Y) => (g(), C("div", {
+            key: $.value,
             class: D([
               i(h).filterListClasses,
               {
@@ -8160,13 +8169,13 @@ const $l = (e, t) => {
             width: r.width,
             position: "relative"
           }),
-          onClick: A[1] || (A[1] = (N) => s.value = !0)
+          onClick: A[1] || (A[1] = ($) => s.value = !0)
         }, [
           re(x.$slots, "default", {}, () => [
             E(Ye, {
               id: "search",
               modelValue: i(a),
-              "onUpdate:modelValue": A[0] || (A[0] = (N) => Ce(a) ? a.value = N : null),
+              "onUpdate:modelValue": A[0] || (A[0] = ($) => Ce(a) ? a.value = $ : null),
               type: "text",
               placeholder: x.placeholder,
               label: x.label,
@@ -8982,8 +8991,8 @@ var Id = ";ext=", I2 = function(t) {
   return "([".concat(Ve, "]{1,").concat(t, "})");
 };
 function Ns(e) {
-  var t = "20", r = "15", n = "9", s = "6", a = "[  \\t,]*", o = "[:\\.．]?[  \\t,-]*", l = "#?", u = "(?:e?xt(?:ensi(?:ó?|ó))?n?|ｅ?ｘｔｎ?|доб|anexo)", d = "(?:[xｘ#＃~～]|int|ｉｎｔ)", p = "[- ]+", c = "[  \\t]*", h = "(?:,{2}|;)", y = Id + I2(t), f = a + u + o + I2(t) + l, $ = a + d + o + I2(n) + l, M = p + I2(s) + "#", m = c + h + o + I2(r) + l, v = c + "(?:,)+" + o + I2(n) + l;
-  return y + "|" + f + "|" + $ + "|" + M + "|" + m + "|" + v;
+  var t = "20", r = "15", n = "9", s = "6", a = "[  \\t,]*", o = "[:\\.．]?[  \\t,-]*", l = "#?", u = "(?:e?xt(?:ensi(?:ó?|ó))?n?|ｅ?ｘｔｎ?|доб|anexo)", d = "(?:[xｘ#＃~～]|int|ｉｎｔ)", p = "[- ]+", c = "[  \\t]*", h = "(?:,{2}|;)", y = Id + I2(t), f = a + u + o + I2(t) + l, N = a + d + o + I2(n) + l, M = p + I2(s) + "#", m = c + h + o + I2(r) + l, v = c + "(?:,)+" + o + I2(n) + l;
+  return y + "|" + f + "|" + N + "|" + M + "|" + m + "|" + v;
 }
 var Ad = "[" + Ve + "]{" + Jt + "}", xd = "[" + Xt + "]{0,1}(?:[" + T0 + "]*[" + Ve + "]){3,}[" + T0 + Ve + "]*", wd = new RegExp("^[" + Xt + "]{0,1}(?:[" + T0 + "]*[" + Ve + "]){1,2}$", "i"), jd = xd + // Phone number extensions
 "(?:" + Ns() + ")?", Td = new RegExp(
@@ -9873,29 +9882,29 @@ const Vu = (e, t) => {
   })), o = Ee(e, "modelValue", t), l = H({
     countryCode: ["PH"],
     countryCallingCode: ["63"]
-  }), u = H(!1), d = ($) => {
-    const M = m0($), m = Is().find((v) => m0(v) === String(M) && v === $);
+  }), u = H(!1), d = (N) => {
+    const M = m0(N), m = Is().find((v) => m0(v) === String(M) && v === N);
     m && M ? (l.value = {
       countryCode: [m],
       countryCallingCode: [M]
     }, h(), t("getSelectedCountryCallingCode", {
       countryCode: m,
       countryCallingCode: M
-    })) : console.error(`No valid country found for the code: ${$}`);
-  }, p = ($) => {
-    const M = $.target, m = M.value;
+    })) : console.error(`No valid country found for the code: ${N}`);
+  }, p = (N) => {
+    const M = N.target, m = M.value;
     /^[+]?\d*[\d\s-]*$/.test(m) || (M.value = m.replace(/[^0-9+\s-]/g, "")), t("getContactNumberErrors", []), m.length > 0 && h();
-  }, c = ($) => {
+  }, c = (N) => {
     l.value = {
-      countryCode: [$[0]],
-      countryCallingCode: [m0($[0])]
+      countryCode: [N[0]],
+      countryCallingCode: [m0(N[0])]
     }, t("getContactNumberErrors", []), h(), t("getSelectedCountryCallingCode", {
       countryCode: l.value.countryCode[0],
       countryCallingCode: l.value.countryCallingCode[0]
     });
   }, h = () => {
     if (!o.value) return;
-    const $ = o.value.replace(/\D/g, ""), M = Qu($, {
+    const N = o.value.replace(/\D/g, ""), M = Qu(N, {
       defaultCountry: l.value.countryCode[0],
       extract: !1
     });
@@ -9909,13 +9918,13 @@ const Vu = (e, t) => {
           message: "Must be a valid contact number"
         }
       ]);
-  }, y = ($) => {
-    t("update:modelValue", $);
-  }, f = ($) => {
-    u.value = $;
+  }, y = (N) => {
+    t("update:modelValue", N);
+  }, f = (N) => {
+    u.value = N;
   };
-  return he(r, ($) => {
-    $ && d($);
+  return he(r, (N) => {
+    N && d(N);
   }), t2(() => {
     t("getSelectedCountryCallingCode", {
       countryCode: l.value.countryCode[0],
@@ -9990,7 +9999,7 @@ const Wu = Is().map((e) => {
     } = Vu(r, n);
     return (y, f) => (g(), W(Ye, He({
       modelValue: i(a),
-      "onUpdate:modelValue": f[1] || (f[1] = ($) => Ce(a) ? a.value = $ : null)
+      "onUpdate:modelValue": f[1] || (f[1] = (N) => Ce(a) ? a.value = N : null)
     }, y.$attrs, {
       type: "contact-number",
       placeholder: r.placeholder,
@@ -10005,7 +10014,7 @@ const Wu = Is().map((e) => {
           id: "contact-number-country-dropdown",
           modelValue: i(o).countryCode,
           "onUpdate:modelValue": [
-            f[0] || (f[0] = ($) => i(o).countryCode = $),
+            f[0] || (f[0] = (N) => i(o).countryCode = N),
             i(d)
           ],
           class: "[&>#dropdown-wrapper]:spr-my-1",
@@ -11772,12 +11781,16 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
   bordered: {
     type: Boolean,
     default: !1
+  },
+  fullWidth: {
+    type: Boolean,
+    default: !1
   }
 }, U6 = ["update:modelValue"], Y6 = (e, t, r) => {
-  const { modelValue: n, disabled: s, description: a, bordered: o } = Me(e), l = H(null), u = Ft(l), d = L(() => {
-    const c = O("spr-sr-only spr-peer spr-inline-block", {
+  const { modelValue: n, disabled: s, description: a, bordered: o, fullWidth: l } = Me(e), u = H(null), d = Ft(u), p = L(() => {
+    const h = O("spr-sr-only spr-peer spr-inline-block", {
       "spr-cursor-not-allowed": s.value
-    }), h = O(
+    }), y = O(
       "spr-inline-block spr-w-4 spr-h-4 spr-rounded-full spr-border-2 spr-border-solid spr-shrink-0",
       {
         "spr-mr-2": r.default,
@@ -11786,50 +11799,69 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
       // Hover State
       {
         // Hover state with matching value
-        "spr-background-color-brand-hover spr-border-2 spr-border-color-brand-hover spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": u.value && String(n == null ? void 0 : n.value) === String(e.value) && !s.value,
+        "spr-background-color-brand-hover spr-border-2 spr-border-color-brand-hover spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": d.value && String(n == null ? void 0 : n.value) === String(e.value) && !s.value && !o.value,
         // Hover state but different value
-        "spr-background-color-base spr-border-2 spr-border-color-supporting spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": u.value && String(n == null ? void 0 : n.value) !== String(e.value) && !s.value
+        "spr-background-color-base spr-border-2 spr-border-color-supporting spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": d.value && String(n == null ? void 0 : n.value) !== String(e.value) && !s.value && !o.value,
+        // Bordered Hover state but different value
+        "spr-background-color-base spr-border-2 spr-border-color-supporting": d.value && String(n == null ? void 0 : n.value) !== String(e.value) && !s.value && o.value
       },
       // Active State
       {
         // Active state with matching value
-        "spr-border-color-brand-base spr-background-color-brand-base spr-shadow-[inset_0px_0px_0px_2.5px_#fff] animate-shadow-grow": String(n == null ? void 0 : n.value) === String(e.value) && !s.value,
+        "spr-border-color-brand-base spr-background-color-brand-base spr-shadow-[inset_0px_0px_0px_2.5px_#fff] animate-shadow-grow": String(n == null ? void 0 : n.value) === String(e.value) && !s.value && !o.value,
         // Active state with different value
-        "spr-border-color-supporting spr-shadow-[inset_0px_0px_0px_2.5px#fff]": String(n == null ? void 0 : n.value) !== String(e.value) && !s.value
+        "spr-border-color-supporting spr-shadow-[inset_0px_0px_0px_2.5px#fff]": String(n == null ? void 0 : n.value) !== String(e.value) && !s.value && !o.value,
+        //Bordered Active state with matching value
+        "spr-border-color-brand-base spr-background-color-brand-base animate-shadow-grow": String(n == null ? void 0 : n.value) === String(e.value) && !s.value && o.value,
+        //Bordered Active state with different value
+        "spr-border-color-supporting": String(n == null ? void 0 : n.value) !== String(e.value) && !s.value && o.value
       },
       // Disabled State
       {
         "spr-cursor-not-allowed": s.value,
         // Disabled state with matching value
-        "spr-border-color-disabled spr-background-color-disabled spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": s.value && String(n == null ? void 0 : n.value) === String(e.value),
+        "spr-border-color-disabled spr-background-color-disabled spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": s.value && String(n == null ? void 0 : n.value) === String(e.value) && !o.value,
         // Disabled state but different value
-        "spr-border-color-disabled spr-background-color spr-cursor-not-allowed": s.value && String(n == null ? void 0 : n.value) !== String(e.value)
+        "spr-border-color-disabled spr-background-color spr-cursor-not-allowed": s.value && String(n == null ? void 0 : n.value) !== String(e.value) && !o.value,
+        // Bordered Disabled state with matching value
+        "spr-bg-white-400 spr-shadow-[inset_0px_0px_0px_2.5px_#fff]": s.value && String(n == null ? void 0 : n.value) === String(e.value) && o.value,
+        // Bordered Disabled state but different value
+        "spr-border-white-400 spr-background-color-disabled": s.value && String(n == null ? void 0 : n.value) !== String(e.value) && o.value
       }
-    ), y = O(
+    ), f = O(
       "spr-group spr-m-0 spr-inline-flex spr-w-auto spr-items-center spr-space-x-2 spr-p-0 spr-font-main",
       "spr-text-color-strong spr-inline-flex spr-items-center spr-p-0",
       {
-        "spr-text-color-disabled spr-cursor-not-allowed": s.value,
-        "spr-cursor-pointer": !s.value
+        "spr-text-color-disabled": s.value && !o.value,
+        "spr-text-color-on-fill-disabled": s.value && o.value,
+        "spr-cursor-pointer": !s.value,
+        "spr-cursor-not-allowed": s.value
       }
-    ), f = O(
-      "spr-border spr-rounded-md spr-p-size-spacing-2xs spr-border-solid spr-w-full spr-box-border",
+    ), N = O(
+      "spr-border spr-rounded-md spr-p-size-spacing-2xs spr-border-solid spr-box-border",
       {
-        "spr-border-kangkong-700 spr-bg-kangkong-100": String(n == null ? void 0 : n.value) === String(e.value) && !s.value,
-        "spr-border-mushroom-200": String(n == null ? void 0 : n.value) !== String(e.value) || s.value
+        //enabled state
+        "spr-border-color-brand-base spr-background-color-brand-weak": String(n == null ? void 0 : n.value) === String(e.value) && !s.value,
+        // matching value
+        "spr-border-color-weak spr-bg-white-50 hover:spr-background-color-hover": String(n == null ? void 0 : n.value) !== String(e.value) && !s.value,
+        // different value
+        //disabled state
+        "spr-border-color-disabled spr-background-color-disabled": s.value,
+        "spr-w-full": l.value,
+        "spr-w-fit": !l.value
       }
     );
     return {
-      baseClasses: c,
-      baseIndicatorClasses: h,
-      labelClasses: y,
-      borderedClasses: f
+      baseClasses: h,
+      baseIndicatorClasses: y,
+      labelClasses: f,
+      borderedClasses: N
     };
-  }), p = Ee(e, "modelValue", t);
+  }), c = Ee(e, "modelValue", t);
   return {
-    radioRef: l,
-    radioClasses: d,
-    proxyValue: p,
+    radioRef: u,
+    radioClasses: p,
+    proxyValue: c,
     description: a,
     bordered: o
   };
@@ -11840,7 +11872,7 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
   setup(e, { emit: t }) {
     const r = e, n = t, s = O2(), { proxyValue: a, radioRef: o, radioClasses: l } = Y6(r, n, s);
     return (u, d) => (g(), C("div", {
-      class: D(["spr-relative", { "spr-w-full": r.bordered }])
+      class: D(["spr-relative", { "spr-w-full": r.fullWidth }])
     }, [
       i2(I("input", {
         id: r.id,
@@ -11875,7 +11907,7 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
       ], 10, R6)
     ], 2));
   }
-}), V6 = /* @__PURE__ */ g2(Q6, [["__scopeId", "data-v-a8c2a676"]]), H6 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}), V6 = /* @__PURE__ */ g2(Q6, [["__scopeId", "data-v-95e7fa1a"]]), H6 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: V6
 }, Symbol.toStringTag, { value: "Module" })), Z6 = {
@@ -12068,7 +12100,7 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
                       }
                     ])
                   }, V(h.menuHeading), 3)) : j("", !0),
-                  (g(!0), C(q, null, de(h.items, (f, $) => (g(), C(q, { key: $ }, [
+                  (g(!0), C(q, null, de(h.items, (f, N) => (g(), C(q, { key: N }, [
                     f.hidden ? j("", !0) : (g(), C("div", {
                       key: 0,
                       class: D([
@@ -12136,7 +12168,7 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
             })
           ])) : j("", !0),
           (g(!0), C(q, null, de(r.navLinks.top, (h, y) => (g(), C(q, { key: y }, [
-            (g(!0), C(q, null, de(h.parentLinks, (f, $) => (g(), C(q, { key: $ }, [
+            (g(!0), C(q, null, de(h.parentLinks, (f, N) => (g(), C(q, { key: N }, [
               f.menuLinks && f.menuLinks.length > 0 ? (g(), W(i(ze), {
                 key: 0,
                 "aria-id": "sidenav-menu-wrapper",
@@ -12175,8 +12207,8 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
                                 "spr-mt-2": x !== 0
                               })
                             }, V(_.subMenuHeading), 3)) : j("", !0),
-                            (g(!0), C(q, null, de(_.items, (A, N) => (g(), W(i(ze), {
-                              key: N,
+                            (g(!0), C(q, null, de(_.items, (A, $) => (g(), W(i(ze), {
+                              key: $,
                               "aria-id": "sidenav-sub-submenu-wrapper",
                               triggers: ["click", "hover"],
                               "instant-move": ""
@@ -12344,7 +12376,7 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
         ]),
         r.navLinks.bottom && r.navLinks.bottom.length > 0 ? (g(), C("div", N5, [
           (g(!0), C(q, null, de(r.navLinks.bottom, (h, y) => (g(), C(q, { key: y }, [
-            (g(!0), C(q, null, de(h.parentLinks, (f, $) => (g(), C(q, { key: $ }, [
+            (g(!0), C(q, null, de(h.parentLinks, (f, N) => (g(), C(q, { key: N }, [
               f.menuLinks && f.menuLinks.length > 0 ? (g(), W(i(ze), {
                 key: 0,
                 "aria-id": "sidenav-menu-wrapper",
@@ -12383,8 +12415,8 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
                                 "spr-mt-3": x !== 0
                               })
                             }, V(_.subMenuHeading), 3)) : j("", !0),
-                            (g(!0), C(q, null, de(_.items, (A, N) => (g(), W(i(ze), {
-                              key: N,
+                            (g(!0), C(q, null, de(_.items, (A, $) => (g(), W(i(ze), {
+                              key: $,
                               "aria-id": "sidenav-sub-submenu-wrapper",
                               triggers: ["click", "hover"],
                               "instant-move": ""
@@ -12915,12 +12947,12 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
   default: c9
 }, Symbol.toStringTag, { value: "Module" })), g9 = (e, t) => {
   const r = H(null), n = H(!1), s = H(e.modelValue), a = L(() => e.size === "sm" ? "spr-h-1" : "spr-h-2"), o = L(() => e.size === "sm" ? "spr-text-base" : "spr-text-[20px]"), l = L(() => e.max === e.min ? "0%" : `${(Math.min(e.max, Math.max(e.min, s.value)) - e.min) / (e.max - e.min) * 100}%`), u = (f) => {
-    const $ = Math.min(e.max, Math.max(e.min, f));
-    s.value = $, t("update:modelValue", $);
+    const N = Math.min(e.max, Math.max(e.min, f));
+    s.value = N, t("update:modelValue", N);
   }, d = (f) => {
     if (!r.value) return;
-    const $ = r.value.getBoundingClientRect();
-    let m = ((f instanceof MouseEvent ? f.clientX : f.touches[0].clientX) - $.left) / $.width;
+    const N = r.value.getBoundingClientRect();
+    let m = ((f instanceof MouseEvent ? f.clientX : f.touches[0].clientX) - N.left) / N.width;
     m = Math.min(1, Math.max(0, m));
     let v = e.min + m * (e.max - e.min);
     if (e.step > 0) {
@@ -12931,18 +12963,18 @@ const l6 = ["white", "dark", "gray", "green"], d6 = [
   }, p = (f) => {
     if (e.disabled) return;
     n.value = !0, d(f);
-    const $ = (m) => {
+    const N = (m) => {
       e.disabled || d(m);
     }, M = () => {
-      n.value = !1, window.removeEventListener("pointermove", $), window.removeEventListener("pointerup", M);
+      n.value = !1, window.removeEventListener("pointermove", N), window.removeEventListener("pointerup", M);
     };
-    window.addEventListener("pointermove", $), window.addEventListener("pointerup", M);
+    window.addEventListener("pointermove", N), window.addEventListener("pointerup", M);
   }, c = (f) => {
     !r.value || e.disabled || (f.key === "ArrowRight" && u(s.value + e.step), f.key === "ArrowLeft" && u(s.value - e.step));
   };
   t2(() => {
-    var f, $;
-    (f = r.value) == null || f.addEventListener("keydown", c), ($ = r.value) == null || $.addEventListener("pointerdown", p);
+    var f, N;
+    (f = r.value) == null || f.addEventListener("keydown", c), (N = r.value) == null || N.addEventListener("pointerdown", p);
   }), he(
     () => e.modelValue,
     (f) => {
@@ -13917,12 +13949,12 @@ function Ot(e, t, r = {}, n, s, a) {
     throw new Error("Pinia destroyed");
   const u = { deep: !0 };
   process.env.NODE_ENV !== "production" && (u.onTrigger = (w) => {
-    d ? y = w : d == !1 && !N._hotUpdating && (Array.isArray(y) ? y.push(w) : console.error("🍍 debuggerEvents should be an array. This is most likely an internal Pinia bug."));
+    d ? y = w : d == !1 && !$._hotUpdating && (Array.isArray(y) ? y.push(w) : console.error("🍍 debuggerEvents should be an array. This is most likely an internal Pinia bug."));
   });
   let d, p, c = [], h = [], y;
   const f = n.state.value[e];
   !a && !f && (process.env.NODE_ENV === "production" || !s) && (n.state.value[e] = {});
-  const $ = H({});
+  const N = H({});
   let M;
   function m(w) {
     let T;
@@ -13970,13 +14002,13 @@ function Ot(e, t, r = {}, n, s, a) {
       x2(h, {
         args: Z,
         name: ee[it],
-        store: N,
+        store: $,
         after: U,
         onError: Q
       });
       let F;
       try {
-        F = w.apply(this && this.$id === e ? this : N, Z);
+        F = w.apply(this && this.$id === e ? this : $, Z);
       } catch (K) {
         throw x2(P, K), K;
       }
@@ -13987,7 +14019,7 @@ function Ot(e, t, r = {}, n, s, a) {
     actions: {},
     getters: {},
     state: [],
-    hotState: $
+    hotState: N
   }), A = {
     _p: n,
     // _s: scope,
@@ -14006,7 +14038,7 @@ function Ot(e, t, r = {}, n, s, a) {
       return ee;
     },
     $dispose: b
-  }, N = H2(process.env.NODE_ENV !== "production" || process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && a2 ? ke(
+  }, $ = H2(process.env.NODE_ENV !== "production" || process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && a2 ? ke(
     {
       _hmrPayload: x,
       _customProperties: M2(/* @__PURE__ */ new Set())
@@ -14016,12 +14048,12 @@ function Ot(e, t, r = {}, n, s, a) {
     // must be added later
     // setupStore
   ) : A);
-  n._s.set(e, N);
+  n._s.set(e, $);
   const S = (n._a && n._a.runWithContext || J9)(() => n._e.run(() => (o = On()).run(() => t({ action: _ }))));
   for (const w in S) {
     const T = S[w];
     if (Ce(T) && !xn(T) || _t(T))
-      process.env.NODE_ENV !== "production" && s ? d0($.value, w, u0(S, w)) : a || (f && q9(T) && (Ce(T) ? T.value = f[w] : St(T, f[w])), n.state.value[e][w] = T), process.env.NODE_ENV !== "production" && x.state.push(w);
+      process.env.NODE_ENV !== "production" && s ? d0(N.value, w, u0(S, w)) : a || (f && q9(T) && (Ce(T) ? T.value = f[w] : St(T, f[w])), n.state.value[e][w] = T), process.env.NODE_ENV !== "production" && x.state.push(w);
     else if (typeof T == "function") {
       const ee = process.env.NODE_ENV !== "production" && s ? T : _(T, w);
       S[w] = ee, process.env.NODE_ENV !== "production" && (x.actions[w] = T), l.actions[w] = T;
@@ -14031,8 +14063,8 @@ function Ot(e, t, r = {}, n, s, a) {
     ) : T, a2 && (S._getters || // @ts-expect-error: same
     (S._getters = M2([]))).push(w));
   }
-  if (ke(N, S), ke(Z2(N), S), Object.defineProperty(N, "$state", {
-    get: () => process.env.NODE_ENV !== "production" && s ? $.value : n.state.value[e],
+  if (ke($, S), ke(Z2($), S), Object.defineProperty($, "$state", {
+    get: () => process.env.NODE_ENV !== "production" && s ? N.value : n.state.value[e],
     set: (w) => {
       if (process.env.NODE_ENV !== "production" && s)
         throw new Error("cannot set hotState");
@@ -14040,34 +14072,34 @@ function Ot(e, t, r = {}, n, s, a) {
         ke(T, w);
       });
     }
-  }), process.env.NODE_ENV !== "production" && (N._hotUpdate = M2((w) => {
-    N._hotUpdating = !0, w._hmrPayload.state.forEach((T) => {
-      if (T in N.$state) {
-        const ee = w.$state[T], Z = N.$state[T];
+  }), process.env.NODE_ENV !== "production" && ($._hotUpdate = M2((w) => {
+    $._hotUpdating = !0, w._hmrPayload.state.forEach((T) => {
+      if (T in $.$state) {
+        const ee = w.$state[T], Z = $.$state[T];
         typeof ee == "object" && $2(ee) && $2(Z) ? Fs(ee, Z) : w.$state[T] = Z;
       }
-      d0(N, T, u0(w.$state, T));
-    }), Object.keys(N.$state).forEach((T) => {
-      T in w.$state || ot(N, T);
+      d0($, T, u0(w.$state, T));
+    }), Object.keys($.$state).forEach((T) => {
+      T in w.$state || ot($, T);
     }), d = !1, p = !1, n.state.value[e] = u0(w._hmrPayload, "hotState"), p = !0, Qe().then(() => {
       d = !0;
     });
     for (const T in w._hmrPayload.actions) {
       const ee = w[T];
-      d0(N, T, _(ee, T));
+      d0($, T, _(ee, T));
     }
     for (const T in w._hmrPayload.getters) {
       const ee = w._hmrPayload.getters[T], Z = a ? (
         // special handling of options api
-        L(() => (r0(n), ee.call(N, N)))
+        L(() => (r0(n), ee.call($, $)))
       ) : ee;
-      d0(N, T, Z);
+      d0($, T, Z);
     }
-    Object.keys(N._hmrPayload.getters).forEach((T) => {
-      T in w._hmrPayload.getters || ot(N, T);
-    }), Object.keys(N._hmrPayload.actions).forEach((T) => {
-      T in w._hmrPayload.actions || ot(N, T);
-    }), N._hmrPayload = w._hmrPayload, N._getters = w._getters, N._hotUpdating = !1;
+    Object.keys($._hmrPayload.getters).forEach((T) => {
+      T in w._hmrPayload.getters || ot($, T);
+    }), Object.keys($._hmrPayload.actions).forEach((T) => {
+      T in w._hmrPayload.actions || ot($, T);
+    }), $._hmrPayload = w._hmrPayload, $._getters = w._getters, $._hotUpdating = !1;
   })), process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && a2) {
     const w = {
       writable: !0,
@@ -14076,28 +14108,28 @@ function Ot(e, t, r = {}, n, s, a) {
       enumerable: !1
     };
     ["_p", "_hmrPayload", "_getters", "_customProperties"].forEach((T) => {
-      Object.defineProperty(N, T, ke({ value: N[T] }, w));
+      Object.defineProperty($, T, ke({ value: $[T] }, w));
     });
   }
   return n._p.forEach((w) => {
     if (process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && a2) {
       const T = o.run(() => w({
-        store: N,
+        store: $,
         app: n._a,
         pinia: n,
         options: l
       }));
-      Object.keys(T || {}).forEach((ee) => N._customProperties.add(ee)), ke(N, T);
+      Object.keys(T || {}).forEach((ee) => $._customProperties.add(ee)), ke($, T);
     } else
-      ke(N, o.run(() => w({
-        store: N,
+      ke($, o.run(() => w({
+        store: $,
         app: n._a,
         pinia: n,
         options: l
       })));
-  }), process.env.NODE_ENV !== "production" && N.$state && typeof N.$state == "object" && typeof N.$state.constructor == "function" && !N.$state.constructor.toString().includes("[native code]") && console.warn(`[🍍]: The "state" must be a plain object. It cannot be
+  }), process.env.NODE_ENV !== "production" && $.$state && typeof $.$state == "object" && typeof $.$state.constructor == "function" && !$.$state.constructor.toString().includes("[native code]") && console.warn(`[🍍]: The "state" must be a plain object. It cannot be
 	state: () => new MyClass()
-Found in store "${N.$id}".`), f && a && r.hydrate && r.hydrate(N.$state, f), d = !0, p = !0, N;
+Found in store "${$.$id}".`), f && a && r.hydrate && r.hydrate($.$state, f), d = !0, p = !0, $;
 }
 /*! #__NO_SIDE_EFFECTS__ */
 // @__NO_SIDE_EFFECTS__
@@ -14455,11 +14487,11 @@ const t8 = (e) => ({
       "spr-opacity-60"
     );
   }
-  const f = L(() => e.disabled ? "spr-text-color-disabled" : "spr-text-color-strong"), $ = L(() => O(
+  const f = L(() => e.disabled ? "spr-text-color-disabled" : "spr-text-color-strong"), N = L(() => O(
     "spr-transition-colors",
     "before:spr-transition-all before:spr-duration-150",
     "after:spr-transition-all after:spr-duration-150"
-  )), M = L(() => O(d.value, $.value)), m = L(() => O({
+  )), M = L(() => O(d.value, N.value)), m = L(() => O({
     "spr-cursor-not-allowed": e.disabled,
     "spr-cursor-pointer": !e.disabled
   }));
@@ -14783,7 +14815,7 @@ const t8 = (e) => ({
     const m = O("spr-p-size-spacing-xs spr-flex spr-justify-between spr-bg-white-50 spr-h-max", {
       "spr-border spr-border-solid spr-border-color-weak": a.value,
       "spr-border-x-0 spr-border-t spr-border-b-0 spr-border-solid spr-border-color-weak": !a.value
-    }), v = O("spr-w-[120px] spr-h-full spr-space-x-2"), b = O("spr-mt-0.5 spr-pl-1 spr-text-mushroom-950"), _ = O("spr-flex spr-justify-between spr-items-center spr-space-x-4"), x = O("spr-text-color-base spr-body-sm-regular"), A = O("spr-flex spr-space-x-2"), N = O("spr-rounded-border-radius-md"), Y = O("!spr-w-max");
+    }), v = O("spr-w-[120px] spr-h-full spr-space-x-2"), b = O("spr-mt-0.5 spr-pl-1 spr-text-mushroom-950"), _ = O("spr-flex spr-justify-between spr-items-center spr-space-x-4"), x = O("spr-text-color-base spr-body-sm-regular"), A = O("spr-flex spr-space-x-2"), $ = O("spr-rounded-border-radius-md"), Y = O("!spr-w-max");
     return {
       baseClass: m,
       dropdownInputFieldClass: v,
@@ -14791,7 +14823,7 @@ const t8 = (e) => ({
       computeRowRangeClass: x,
       inputFieldIconClass: b,
       navigationContainerClass: A,
-      navigationButtonClass: N,
+      navigationButtonClass: $,
       dropdownClass: Y
     };
   }), l = H(e.dropdownSelection), u = L(() => {
@@ -14836,7 +14868,7 @@ const t8 = (e) => ({
       dropdownSelection: h,
       dropdownId: y
     } = U8(n, r);
-    return (f, $) => (g(), C("div", {
+    return (f, N) => (g(), C("div", {
       class: D(i(s).baseClass)
     }, [
       E(Zt, {
@@ -14850,7 +14882,7 @@ const t8 = (e) => ({
         default: B(() => [
           E(Ye, {
             modelValue: i(l),
-            "onUpdate:modelValue": $[0] || ($[0] = (M) => Ce(l) ? l.value = M : null),
+            "onUpdate:modelValue": N[0] || (N[0] = (M) => Ce(l) ? l.value = M : null),
             class: D(i(s).dropdownInputFieldClass),
             readonly: !0
           }, {
@@ -14999,7 +15031,7 @@ const t8 = (e) => ({
   onHover: (e) => typeof e.active == "boolean" && typeof e.data == "object",
   "update:selectedData": (e) => Array.isArray(e) && e.every((t) => typeof t == "object" && t !== null)
 }, V8 = (e, t, r) => {
-  const { dataTable: n, action: s, headers: a, sortOrder: o, fullHeight: l, selectedKeyId: u, returnCompleteSelectedProperties: d } = Me(e), p = H(""), c = H(e.searchModel), h = H(o.value || "asc"), y = H(!1), f = H([]), $ = L(() => f.value.length === 0 ? !1 : f.value.length === m.value.length), M = L(() => f.value.length === 0 ? !1 : f.value.length > 0 && f.value.length < m.value.length), m = L(() => !p.value || o.value ? n.value : [...n.value].sort((R, P) => {
+  const { dataTable: n, action: s, headers: a, sortOrder: o, fullHeight: l, selectedKeyId: u, returnCompleteSelectedProperties: d } = Me(e), p = H(""), c = H(e.searchModel), h = H(o.value || "asc"), y = H(!1), f = H([]), N = L(() => f.value.length === 0 ? !1 : f.value.length === m.value.length), M = L(() => f.value.length === 0 ? !1 : f.value.length > 0 && f.value.length < m.value.length), m = L(() => !p.value || o.value ? n.value : [...n.value].sort((R, P) => {
     const U = Y(R[p.value]), Q = Y(P[p.value]);
     return U < Q ? h.value === "asc" ? -1 : 1 : U > Q ? h.value === "asc" ? 1 : -1 : 0;
   })), v = (Z) => {
@@ -15010,7 +15042,7 @@ const t8 = (e) => ({
     () => e.tableActions.search || e.tableActions.filter || e.tableActions.option
   ), A = (Z, R) => {
     e.isRowClickable && t("onRowClick", Z, R);
-  }, N = L(() => l.value ? "large" : "small"), Y = (Z) => typeof Z == "string" ? Z.toLowerCase() : typeof Z == "object" && !Array.isArray(Z) && Z !== null ? Z.title.toLowerCase() : Array.isArray(Z) && Z.length > 0 ? Z[0].title.toLowerCase() : "", S = L(() => {
+  }, $ = L(() => l.value ? "large" : "small"), Y = (Z) => typeof Z == "string" ? Z.toLowerCase() : typeof Z == "object" && !Array.isArray(Z) && Z !== null ? Z.title.toLowerCase() : Array.isArray(Z) && Z.length > 0 ? Z[0].title.toLowerCase() : "", S = L(() => {
     const Z = O(
       "spr-flex spr-flex-col spr-h-full spr-border-color-weak spr-w-full spr-overflow-hidden spr-rounded-border-radius-lg spr-border spr-border-solid spr-table-wrapper spr-relative"
     ), R = O("spr-w-full spr-bottom-0 spr-left-0", {
@@ -15069,7 +15101,7 @@ const t8 = (e) => ({
     );
     R !== -1 ? f.value.splice(R, 1) : f.value.push(Z);
   }, T = () => {
-    $.value || M.value ? f.value = [] : f.value = [...m.value];
+    N.value || M.value ? f.value = [] : f.value = [...m.value];
   }, ee = (Z) => !u.value || !(u.value in Z) ? !1 : f.value.some((R) => R[u.value].title === Z[u.value].title);
   return he(
     () => f.value.length,
@@ -15092,10 +15124,10 @@ const t8 = (e) => ({
     hasTableActions: x,
     searchField: c,
     getTableClasses: S,
-    getEmptyStateSize: N,
+    getEmptyStateSize: $,
     selectAll: y,
     selectedData: f,
-    isAllSelected: $,
+    isAllSelected: N,
     isRowSelected: ee,
     isIndeterminate: M
   };
@@ -15150,7 +15182,7 @@ const t8 = (e) => ({
       isIndeterminate: h,
       isRowSelected: y,
       sortData: f,
-      updateSearchField: $,
+      updateSearchField: N,
       handleRowClick: M,
       handleSelect: m,
       handleSelectAll: v
@@ -15172,7 +15204,7 @@ const t8 = (e) => ({
           "search-model": i(u),
           "onUpdate:searchModel": [
             _[0] || (_[0] = (x) => Ce(u) ? u.value = x : null),
-            i($)
+            i(N)
           ],
           "toggle-search": r.tableActions.search,
           "toggle-option": r.tableActions.option,
@@ -15212,7 +15244,7 @@ const t8 = (e) => ({
                 }, [
                   I("span", {
                     class: D([{ "spr-cursor-pointer": x.sort }]),
-                    onClick: (N) => x.sort && i(f)(x.field)
+                    onClick: ($) => x.sort && i(f)(x.field)
                   }, V(x.name), 11, W8),
                   x.badgeText ? (g(), C("span", K8, [
                     E(v2, {
@@ -15224,7 +15256,7 @@ const t8 = (e) => ({
                   x.sort ? (g(), C("span", {
                     key: 1,
                     class: D(["spr-flex spr-flex-row spr-items-center", { "spr-cursor-pointer": x.sort }]),
-                    onClick: (N) => x.sort && i(f)(x.field)
+                    onClick: ($) => x.sort && i(f)(x.field)
                   }, [
                     E(i(J), { icon: "ph:caret-up-down-light" })
                   ], 10, J8)) : j("", !0)
@@ -15247,9 +15279,9 @@ const t8 = (e) => ({
             (g(!0), C(q, null, de(i(a), (x, A) => (g(), C("tr", {
               key: A,
               class: D(i(d).tableRowClasses),
-              onClick: (N) => i(M)(x, A),
-              onMouseover: (N) => b.$emit("onHover", { active: !0, data: x }),
-              onMouseleave: (N) => b.$emit("onHover", { active: !1, data: x })
+              onClick: ($) => i(M)(x, A),
+              onMouseover: ($) => b.$emit("onHover", { active: !0, data: x }),
+              onMouseleave: ($) => b.$emit("onHover", { active: !1, data: x })
             }, [
               r.isMultiSelect ? (g(), C("td", {
                 key: 0,
@@ -15259,57 +15291,58 @@ const t8 = (e) => ({
                   E(N2, {
                     label: "",
                     checked: i(y)(x),
-                    "onUpdate:modelValue": (N) => i(m)(x)
+                    "onUpdate:modelValue": ($) => i(m)(x)
                   }, null, 8, ["checked", "onUpdate:modelValue"])
                 ])
               ], 2)) : j("", !0),
-              (g(!0), C(q, null, de(b.headers, (N, Y) => (g(), C("td", {
+              (g(!0), C(q, null, de(b.headers, ($, Y) => (g(), C("td", {
                 key: Y,
                 class: D(i(d).tableDataClasses)
               }, [
-                b.$slots[N.field] ? re(b.$slots, N.field, {
+                b.$slots[$.field] ? re(b.$slots, $.field, {
                   key: 0,
-                  row: x[N.field]
+                  row: x,
+                  rowIndex: A
                 }) : (g(), C(q, { key: 1 }, [
-                  i(a)[A][N.field] ? (g(), C("div", e7, [
-                    N.hasAvatar ? (g(), W(R0, {
+                  i(a)[A][$.field] ? (g(), C("div", e7, [
+                    $.hasAvatar ? (g(), W(R0, {
                       key: 0,
                       size: "lg",
-                      src: i(a)[A][N.field].image,
+                      src: i(a)[A][$.field].image,
                       alt: "User Avatar",
-                      variant: N.avatarVariant ? N.avatarVariant : "initial",
-                      initial: i(a)[A][N.field].title
+                      variant: $.avatarVariant ? $.avatarVariant : "initial",
+                      initial: i(a)[A][$.field].title
                     }, null, 8, ["src", "variant", "initial"])) : j("", !0),
-                    N.hasIcon ? (g(), C("div", t7, [
+                    $.hasIcon ? (g(), C("div", t7, [
                       E(i(J), {
-                        icon: i(a)[A][N.field].icon || ""
+                        icon: i(a)[A][$.field].icon || ""
                       }, null, 8, ["icon"])
                     ])) : j("", !0),
                     I("div", null, [
-                      Array.isArray(i(a)[A][N.field].title) ? (g(), C("div", r7, [
-                        (g(!0), C(q, null, de(i(a)[A][N.field].title, (S, w) => (g(), C("div", { key: w }, [
-                          N.hasLozengeTitle ? (g(), C("div", n7, [
+                      Array.isArray(i(a)[A][$.field].title) ? (g(), C("div", r7, [
+                        (g(!0), C(q, null, de(i(a)[A][$.field].title, (S, w) => (g(), C("div", { key: w }, [
+                          $.hasLozengeTitle ? (g(), C("div", n7, [
                             E(Lt, {
                               cell: S
                             }, null, 8, ["cell"])
-                          ])) : N.hasChipTitle ? (g(), C("div", s7, [
+                          ])) : $.hasChipTitle ? (g(), C("div", s7, [
                             E(zt, {
                               cell: S
                             }, null, 8, ["cell"])
                           ])) : j("", !0)
                         ]))), 128))
                       ])) : (g(), C("div", a7, [
-                        N.hasLozengeTitle ? (g(), C("div", o7, [
+                        $.hasLozengeTitle ? (g(), C("div", o7, [
                           E(Lt, {
-                            cell: i(a)[A][N.field].title
+                            cell: i(a)[A][$.field].title
                           }, null, 8, ["cell"])
-                        ])) : N.hasChipTitle ? (g(), C("div", i7, [
+                        ])) : $.hasChipTitle ? (g(), C("div", i7, [
                           E(zt, {
-                            cell: i(a)[A][N.field].title
+                            cell: i(a)[A][$.field].title
                           }, null, 8, ["cell"])
-                        ])) : (g(), C("div", l7, V(i(a)[A][N.field].title), 1))
+                        ])) : (g(), C("div", l7, V(i(a)[A][$.field].title), 1))
                       ])),
-                      N.hasSubtext ? (g(), C("div", d7, V(i(a)[A][N.field].subtext), 1)) : j("", !0)
+                      $.hasSubtext ? (g(), C("div", d7, V(i(a)[A][$.field].subtext), 1)) : j("", !0)
                     ])
                   ])) : j("", !0)
                 ], 64))
@@ -15714,13 +15747,13 @@ const t8 = (e) => ({
     return `${m.toString().padStart(2, "0")}:${v}`;
   }, h = L(() => p()), y = L(() => h.value), f = (M) => {
     o.value = M;
-  }, $ = L(() => e.placeholder ? e.placeholder : r.value === "12" ? "HH : MM AM/PM" : "HH : MM");
+  }, N = L(() => e.placeholder ? e.placeholder : r.value === "12" ? "HH : MM AM/PM" : "HH : MM");
   return {
     optionClasses: u,
     filteredOptions: y,
     selectedValue: o,
     isOpen: a,
-    getPlaceHolder: $,
+    getPlaceHolder: N,
     uniqueId: l,
     filterInput: d,
     selectOption: f
@@ -15757,14 +15790,14 @@ const t8 = (e) => ({
         }, [
           i(o).length > 0 ? (g(), C("div", k7, [
             (g(!0), C(q, null, de(i(o), (f) => {
-              var $, M;
+              var N, M;
               return g(), C("div", {
                 key: f,
                 class: D([
                   "spr-body-xs-regular spr-flex spr-cursor-pointer spr-justify-between spr-rounded-border-radius-md spr-p-size-spacing-3xs",
                   "hover:spr-background-color-hover",
                   {
-                    "spr-background-color-single-active spr-rounded-border-radius-md": f.toUpperCase() === (($ = i(l)) == null ? void 0 : $.toUpperCase())
+                    "spr-background-color-single-active spr-rounded-border-radius-md": f.toUpperCase() === ((N = i(l)) == null ? void 0 : N.toUpperCase())
                   }
                 ]),
                 onMousedown: ut((m) => i(d)(f), ["prevent"])