@base-framework/ui 1.2.44 → 1.2.45

package/dist/{full-page-CssNnMq9.js → full-page-xXOODy8c.js}

@@ -1,5 +1,5 @@
-import { I as E, Span as u, Button as v, OnState as M, Div as o, Legend as ht, Fieldset as ft, H4 as qe, P as k, Label as H, Checkbox as fe, Input as p, Textarea as Ge, UseParent as W, Img as ge, H5 as gt, H2 as X, Form as mt, Header as Z, Footer as me, A as Ke, H3 as be, Nav as xe, Ul as ee, Li as pe, OnStateOpen as ye, On as J, Dialog as bt, Th as Qe, Thead as xt, Tr as pt, Table as we, Time as yt, H1 as wt } from "@base-framework/atoms";
-import { Atom as r, Jot as P, Component as S, router as oe, Html as Je, Data as z, Events as j, DateTime as te, NavLink as vt, DataTracker as Xe } from "@base-framework/base";
+import { I as E, Span as u, Button as v, OnState as P, Div as o, Legend as ht, Fieldset as ft, H4 as qe, P as k, Label as H, Checkbox as fe, Input as p, Textarea as Ge, UseParent as W, Img as ge, H5 as gt, H2 as X, Form as mt, Header as Z, Footer as me, A as Ke, H3 as be, Nav as xe, Ul as ee, Li as pe, OnStateOpen as ye, On as J, Dialog as bt, Th as Qe, Thead as xt, Tr as pt, Table as we, Time as yt, H1 as wt } from "@base-framework/atoms";
+import { Atom as r, Jot as M, Component as S, router as oe, Html as Je, Data as O, Events as j, DateTime as te, NavLink as vt, DataTracker as Xe } from "@base-framework/base";
 import { Icons as h } from "./icons.es.js";
 import { Timer as kt, TableBody as Ct, DataTableBody as St, ScrollableTableBody as $t, List as Dt } from "@base-framework/organisms";
 import { F as V } from "./format-DE4rFWuD.js";
@@ -48,7 +48,7 @@ const Tt = {
   filled: "material-symbols-filled",
   rounded: "material-symbols-rounded",
   sharp: "material-symbols-sharp"
-}, Me = r((e) => {
+}, Pe = r((e) => {
   const t = e.size || "sm", s = e.variant || "outlined", n = De[t] || De.sm, a = Ie[t] || Ie.sm, l = Te[s] || Te.outlined;
   return u({
     ...e,
@@ -62,14 +62,14 @@ const Tt = {
     name: void 0
     // @ts-ignore
   }, e.name);
-}), x = (e = {}, t) => t ? typeof t == "string" && t.includes("<svg") ? ue(e, t) : typeof t == "object" && t.name ? Me({
+}), x = (e = {}, t) => t ? typeof t == "string" && t.includes("<svg") ? ue(e, t) : typeof t == "object" && t.name ? Pe({
   ...e,
   name: t.name,
   variant: t.variant || e.variant || "outlined"
-}) : typeof t == "string" ? Me({
+}) : typeof t == "string" ? Pe({
   ...e,
   name: t
-}) : ue(e, t) : null, Sa = (e) => e ? !!(typeof e == "object" && e.name || typeof e == "string" && !e.includes("<svg")) : !1, $a = (e) => typeof e == "string" && e.includes("<svg"), Pe = {
+}) : ue(e, t) : null, $a = (e) => e ? !!(typeof e == "object" && e.name || typeof e == "string" && !e.includes("<svg")) : !1, Da = (e) => typeof e == "string" && e.includes("<svg"), Me = {
   gray: {
     backgroundColor: "bg-gray-50",
     textColor: "text-gray-600",
@@ -150,11 +150,11 @@ const Tt = {
     textColor: "text-foreground",
     ringColor: "ring-white/10"
   }
-}, Mt = (e) => Pe[e] || Pe.gray, Pt = (e, t = {}) => {
-  const s = Mt(e), n = t.backgroundColor ?? s.backgroundColor, a = t.textColor ?? s.textColor, l = t.ringColor ?? s.ringColor;
+}, Pt = (e) => Me[e] || Me.gray, Mt = (e, t = {}) => {
+  const s = Pt(e), n = t.backgroundColor ?? s.backgroundColor, a = t.textColor ?? s.textColor, l = t.ringColor ?? s.ringColor;
   return `inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors ${n} ${a} ${l}`;
-}, Da = r((e, t) => {
-  const { type: s, icon: n, size: a = "xs", backgroundColor: l, textColor: i, ringColor: c, ...f } = e, m = Pt(s, { backgroundColor: l, textColor: i, ringColor: c });
+}, Ia = r((e, t) => {
+  const { type: s, icon: n, size: a = "xs", backgroundColor: l, textColor: i, ringColor: c, ...f } = e, m = Mt(s, { backgroundColor: l, textColor: i, ringColor: c });
   return u({ ...f, class: m }, [
     n ? x({ size: a, class: "mr-1" }, n) : null,
     ...t || []
@@ -174,11 +174,11 @@ class Ze extends S {
     return s ? { data: s } : null;
   }
 }
-const O = (e) => (
+const N = (e) => (
   /** @type {VeilComponentConstructor} */
-  P(e, Ze)
+  M(e, Ze)
 );
-class Ia extends Ze {
+class Ta extends Ze {
   /**
    * Declare public props and their defaults.
    */
@@ -221,7 +221,7 @@ class Ia extends Ze {
       // @ts-ignore
       class: `toggle-btn inline-flex items-center gap-1.5 bg-transparent border-0 p-0 cursor-pointer text-foreground/70 hover:text-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${this.class || ""}`
     }, [
-      M(
+      P(
         "active",
         (i) => x({ size: t, variant: i && l ? "filled" : "outlined" }, i ? n : s)
       ),
@@ -237,7 +237,7 @@ const le = {
   xl: "w-14 h-14",
   "2xl": "w-16 h-16"
 };
-class Ta extends S {
+class Pa extends S {
   /**
    * Declare public props.
    */
@@ -274,7 +274,7 @@ class Ta extends S {
       // @ts-ignore
       class: `circle-toggle-btn inline-flex items-center justify-center rounded-full border-0 cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 ${n} ${l}${f ? " rounded-full w-[40px] h-[40px] max-w-[40px]" : ""}`
     }, [
-      M("active", (w) => [
+      P("active", (w) => [
         x({
           size: a,
           variant: w && m ? "filled" : "outlined",
@@ -296,8 +296,8 @@ const Ma = r((e, t) => {
     ...t || []
   ]);
 });
-let A = globalThis.history?.state?._pos ?? 0;
-const he = /* @__PURE__ */ new Map(), Be = (e) => (e || "").replace(/^\/+/, "").replace(/\/+$/, ""), Bt = (e, t) => {
+let B = globalThis.history?.state?._pos ?? 0;
+const Bt = B, he = /* @__PURE__ */ new Map(), Be = (e) => (e || "").replace(/^\/+/, "").replace(/\/+$/, ""), zt = (e, t) => {
   if (!t) return !1;
   const s = Be(e), n = Be(t);
   return s === n || s.startsWith(n + "/");
@@ -305,33 +305,33 @@ const he = /* @__PURE__ */ new Map(), Be = (e) => (e || "").replace(/^\/+/, "").
 if (typeof globalThis.history?.pushState == "function") {
   const e = globalThis.history.pushState, t = globalThis.history.replaceState;
   globalThis.history.pushState = function(s, n, a) {
-    A++;
-    const l = s !== null && typeof s == "object" ? { ...s, _pos: A } : { _pos: A };
+    B++;
+    const l = s !== null && typeof s == "object" ? { ...s, _pos: B } : { _pos: B };
     return e.call(this, l, n, a);
   }, globalThis.history.replaceState = function(s, n, a) {
-    const l = globalThis.history.state?._pos ?? A, i = s !== null && typeof s == "object" ? { ...s, _pos: l } : { _pos: l };
+    const l = globalThis.history.state?._pos ?? B, i = s !== null && typeof s == "object" ? { ...s, _pos: l } : { _pos: l };
     return t.call(this, i, n, a);
   }, globalThis.addEventListener("popstate", (s) => {
     const n = (
       /** @type {any} */
       s.state?._pos
     );
-    typeof n == "number" && (A = n);
+    typeof n == "number" && (B = n);
   });
 }
-const zt = (e) => {
+const Ot = (e) => {
   const t = e || "", s = oe.path || "", n = he.get(t);
-  if (n && Bt(s, n.basePath))
+  if (n && zt(s, n.basePath))
     return n;
   const a = {
-    pos: A,
+    pos: B,
     sourcePath: oe.lastPath || null,
     basePath: s
   };
   return he.set(t, a), a;
-}, Ot = (e) => {
+}, Nt = (e) => {
   he.delete(e || "");
-}, L = (e) => r((t, s) => v({
+}, A = (e) => r((t, s) => v({
   ...e,
   ...t,
   // @ts-ignore
@@ -353,22 +353,22 @@ const zt = (e) => {
   ...t,
   // @ts-ignore
   class: `bttn ${e.class} ${t.class || ""}`
-}, s)), Nt = (e) => {
-  const t = zt(e.backUrl);
+}, s)), Ft = (e) => {
+  const t = Ot(e.backUrl);
   return () => {
-    Ot(e.backUrl);
-    const n = A - t.pos + 1;
-    if (t.pos > 0) {
+    Nt(e.backUrl);
+    const n = B - t.pos + 1;
+    if (t.pos > 0 && t.pos > Bt) {
       globalThis.history.go(-n);
       return;
     }
     const a = t.sourcePath || e.backUrl;
     a && app.navigate(a);
   };
-}, Ft = (e) => r((t, s) => (t.icon = t.icon || h.arrows.left, t.click = t.click || Nt(t), et({
+}, Lt = (e) => r((t, s) => (t.icon = t.icon || h.arrows.left, t.click = t.click || Ft(t), et({
   ...e,
   ...t
-}, s))), Lt = r((e, t) => {
+}, s))), At = r((e, t) => {
   const s = e.size || "md", n = {
     xs: "w-6 h-6",
     sm: "w-8 h-8",
@@ -386,29 +386,29 @@ const zt = (e) => {
     ...t || []
   ]);
 }), Oe = {
-  primary: L({ class: "primary" }),
-  secondary: L({ class: "secondary" }),
-  destructive: L({ class: "destructive" }),
-  warning: L({ class: "warning" }),
-  outline: L({ class: "outline" }),
-  ghost: L({ class: "ghost" }),
-  link: L({ class: "link" }),
+  primary: A({ class: "primary" }),
+  secondary: A({ class: "secondary" }),
+  destructive: A({ class: "destructive" }),
+  warning: A({ class: "warning" }),
+  outline: A({ class: "outline" }),
+  ghost: A({ class: "ghost" }),
+  link: A({ class: "link" }),
   icon: ze({ class: "icon" }),
   withIcon: ze({ class: "with-icon" }),
-  back: Ft({ class: "with-icon back-button" }),
-  circleIcon: Lt
-}, b = r((e, t) => (Oe[e.variant] || Oe.primary)(e, t)), Pa = r((e, t) => b({ ...e, variant: "withIcon", icon: h.loading, animation: "animate-spin" }, t)), At = r((e, t) => {
+  back: Lt({ class: "with-icon back-button" }),
+  circleIcon: At
+}, b = r((e, t) => (Oe[e.variant] || Oe.primary)(e, t)), Ba = r((e, t) => b({ ...e, variant: "withIcon", icon: h.loading, animation: "animate-spin" }, t)), Rt = r((e, t) => {
   const s = e.margin ?? "my-5 mx-5", n = e.padding ?? "p-4", a = e.border ?? "border-border";
   return e.hover && (e.class += " hover:shadow-lg hover:bg-muted/50"), o({
     ...e,
     // @ts-ignore
     class: `rounded-lg ${a} bg-card text-card-foreground shadow-md min-w-[120px] min-h-[80px] ${s} ${n} ${e.class || ""}`
   }, t);
-}), Rt = r((e, t) => ht({
+}), jt = r((e, t) => ht({
   ...e,
   // @ts-ignore
   class: ` font-medium -mt-4 -mx-1 px-2 py-2 ${e.class || ""}`
-}, t)), Ba = r((e, t) => {
+}, t)), za = r((e, t) => {
   const s = e.border === "full" ? "border rounded-md" : "border-t";
   return ft({
     ...e,
@@ -416,10 +416,10 @@ const zt = (e) => {
     class: `p-6 ${s} ${e.class || ""}`
   }, [
     // @ts-ignore
-    e.legend && Rt(e.legend),
+    e.legend && jt(e.legend),
     o({ class: "flex flex-auto flex-col gap-y-6" }, t)
   ]);
-}), jt = r((e, t) => {
+}), Et = r((e, t) => {
   const s = e.border === !0 ? "border-t" : "";
   return o({
     ...e,
@@ -441,7 +441,7 @@ const zt = (e) => {
     // Controls container: grows to fill remaining space, spacing between items
     o({ class: "flex flex-col gap-y-4" }, t)
   ]);
-}), Et = "flex h-10 w-full px-3 py-2 text-sm", D = "rounded-md border border-border bg-input", $ = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background", C = "disabled:cursor-not-allowed disabled:opacity-50 [&:user-invalid]:border-destructive", _ = "placeholder:text-muted-foreground", ve = `${Et} ${D} ${$} ${_} ${C}`, Ht = ({ id: e, checked: t, bind: s, required: n }) => fe({
+}), Ht = "flex h-10 w-full px-3 py-2 text-sm", D = "rounded-md border border-border bg-input", $ = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background", C = "disabled:cursor-not-allowed disabled:opacity-50 [&:user-invalid]:border-destructive", _ = "placeholder:text-muted-foreground", ve = `${Ht} ${D} ${$} ${_} ${C}`, _t = ({ id: e, checked: t, bind: s, required: n }) => fe({
   id: e,
   cache: "checkbox",
   class: "absolute opacity-0 w-full h-full cursor-pointer pointer-events-none",
@@ -451,15 +451,15 @@ const zt = (e) => {
   required: n,
   checked: t,
   bind: s
-}), _t = () => u({ class: "absolute text-xs pointer-events-none" }, [
-  M(
+}), Ut = () => u({ class: "absolute text-xs pointer-events-none" }, [
+  P(
     "checked",
     (e) => e ? E({
       class: "w-2 h-2 pointer-events-none",
       html: h.check
     }) : null
   )
-]), Ut = ({ id: e, bind: t, checked: s, required: n, clickHandler: a }) => o({
+]), Yt = ({ id: e, bind: t, checked: s, required: n, clickHandler: a }) => o({
   class: `relative flex items-center justify-center w-5 h-5 transition-colors duration-200 hover:border-accent-foreground
 			rounded-md border
 			${$}
@@ -479,13 +479,13 @@ const zt = (e) => {
   tabIndex: 0,
   click: a
 }, [
-  Ht({ bind: t, checked: s, id: e, required: n }),
-  _t()
-]), Yt = ({ id: e, label: t, clickHandler: s }) => H({
+  _t({ bind: t, checked: s, id: e, required: n }),
+  Ut()
+]), Vt = ({ id: e, label: t, clickHandler: s }) => H({
   class: "text-base cursor-pointer",
   htmlFor: e,
   click: s
-}, t), Vt = P(
+}, t), Wt = M(
   {
     /**
      * This will initialize the state of the checkbox.
@@ -524,7 +524,7 @@ const zt = (e) => {
     render() {
       const e = this.getId(), t = (s) => this.clickHandler(s);
       return o({ class: `flex items-center gap-x-2 cursor-pointer ${this.class || ""}` }, [
-        Ut({
+        Yt({
           id: e,
           // @ts-ignore
           bind: this.bind,
@@ -536,38 +536,38 @@ const zt = (e) => {
           clickHandler: t
         }),
         // @ts-ignore
-        this.label && Yt({ id: e, label: this.label, clickHandler: t })
+        this.label && Vt({ id: e, label: this.label, clickHandler: t })
       ]);
     }
   }
-), Wt = (e) => {
+), qt = (e) => {
   if (!e || e.length === 0) return "";
   const s = e.replace(/\D/g, "").match(/^(\d{0,3})(\d{0,3})(\d{0,4})$/);
   return s ? s[2] ? `(${s[1]}) ${s[2]}${s[3] ? "-" + s[3] : ""}` : s[1] || "" : e;
-}, qt = (e) => {
-  const t = e.target, s = Wt(t.value);
+}, Gt = (e) => {
+  const t = e.target, s = qt(t.value);
   s && (t.value = s);
-}, Gt = [
+}, Kt = [
   "peer w-full h-14 px-3 pt-5 pb-1",
   "text-base text-foreground",
   D,
   $,
   C,
   "placeholder-transparent"
-].join(" "), Kt = [
+].join(" "), Qt = [
   "peer w-full min-h-[120px] px-3 pt-6 pb-2",
   "text-base text-foreground",
   D,
   $,
   C,
   "placeholder-transparent resize-y"
-].join(" "), Qt = [
+].join(" "), Jt = [
   "peer w-full h-14 px-3 pt-5 pb-1 pr-10",
   "text-base text-foreground appearance-none",
   D,
   $,
   C
-].join(" "), Jt = [
+].join(" "), Xt = [
   "absolute left-3",
   "text-foreground-secondary",
   "transition-all duration-200",
@@ -578,7 +578,7 @@ const zt = (e) => {
   "peer-[:placeholder-shown:not(:focus)]:top-1/2",
   "peer-[:placeholder-shown:not(:focus)]:-translate-y-1/2",
   "peer-[:placeholder-shown:not(:focus)]:text-base"
-].join(" "), Xt = [
+].join(" "), Zt = [
   "absolute left-3",
   "text-foreground-secondary",
   "transition-all duration-200",
@@ -588,16 +588,16 @@ const zt = (e) => {
   // Placeholder state (empty + not focused)
   "peer-[:placeholder-shown:not(:focus)]:top-3.5",
   "peer-[:placeholder-shown:not(:focus)]:text-base"
-].join(" "), Zt = [
+].join(" "), es = [
   "absolute left-3 top-2",
   "text-xs text-foreground-secondary",
   "pointer-events-none select-none"
 ].join(" ");
-let es = 0;
-const ke = (e) => e.id || e.name || `floating-${++es}`, Ce = (e, t, s, n) => e ? H(
+let ts = 0;
+const ke = (e) => e.id || e.name || `floating-${++ts}`, Ce = (e, t, s, n) => e ? H(
   { htmlFor: s, class: n },
   t ? [u(e), u({ class: "text-destructive ml-0.5" }, "*")] : e
-) : null, ts = () => E({
+) : null, ss = () => E({
   class: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none w-4 h-4 text-foreground-secondary",
   html: h.chevron.single.down
 }), se = r((e) => {
@@ -607,83 +607,83 @@ const ke = (e) => e.id || e.name || `floating-${++es}`, Ce = (e, t, s, n) => e ?
       ...e,
       id: t,
       placeholder: " ",
-      class: `${Gt} ${e.class || ""}`.trim()
+      class: `${Kt} ${e.class || ""}`.trim()
     }),
-    Ce(e.label, e.required, t, Jt)
+    Ce(e.label, e.required, t, Xt)
   ]);
-}), za = r(
+}), Oa = r(
   (e) => se({
     ...e,
     type: "tel",
     name: e.name || "Phone",
     label: e.label || "Phone",
     pattern: e.pattern || "\\(\\d{3}\\) \\d{3}-\\d{4}",
-    keyup: qt
+    keyup: Gt
   })
-), Oa = r(
+), Na = r(
   (e) => se({
     ...e,
     type: "email",
     name: e.name || "Email",
     label: e.label || "Email"
   })
-), Na = r(
+), Fa = r(
   (e) => se({
     ...e,
     type: "password",
     name: e.name || "Password",
     label: e.label || "Password"
   })
-), Fa = r(
+), La = r(
   (e) => se({
     ...e,
     type: "number"
   })
-), La = r(
+), Aa = r(
   (e) => se({
     ...e,
     type: "url",
     name: e.name || "Url",
     label: e.label || "URL"
   })
-), Aa = r((e) => {
+), Ra = r((e) => {
   const t = ke(e);
   return o({ class: "relative" }, [
     Ge({
       ...e,
       id: t,
       placeholder: " ",
-      class: `${Kt} ${e.class || ""}`.trim()
+      class: `${Qt} ${e.class || ""}`.trim()
     }),
-    Ce(e.label, e.required, t, Xt)
+    Ce(e.label, e.required, t, Zt)
   ]);
-}), Ra = r((e) => {
+}), ja = r((e) => {
   const t = ke(e), { options: s, onCreated: n, ...a } = e;
   return o({ class: "relative" }, [
     {
       tag: "select",
       ...a,
       id: t,
-      class: `[&>option]:text-foreground [&>option]:bg-background ${Qt} ${a.class || ""}`.trim(),
+      class: `[&>option]:text-foreground [&>option]:bg-background ${Jt} ${a.class || ""}`.trim(),
       onCreated(l) {
         s && Je.setupSelectOptions(l, s), typeof n == "function" && n(l);
       }
     },
-    ts(),
-    Ce(e.label, e.required, t, Zt)
+    ss(),
+    Ce(e.label, e.required, t, es)
   ]);
-}), ss = (e) => {
+}), ns = (e) => {
   if (!e || e.length === 0) return "";
   const s = e.replace(/\D/g, "").match(/^(\d{0,3})(\d{0,3})(\d{0,4})$/);
   return s ? s[2] ? `(${s[1]}) ${s[2]}${s[3] ? "-" + s[3] : ""}` : s[1] || "" : e;
-}, ns = (e) => {
-  const t = e.target, s = ss(t.value);
+}, as = (e) => {
+  const t = e.target, s = ns(t.value);
   s && (t.value = s);
-}, N = r((e) => p({
+}, F = r((e) => p({
   ...e,
   // @ts-ignore
   class: `${ve} ${e.class || ""}`.trim()
-})), ja = r((e) => N({
+})), Ea = r((e) => F({
   ...e,
   type: "tel",
   // @ts-ignore
@@ -693,8 +693,8 @@ const ke = (e) => e.id || e.name || `floating-${++es}`, Ce = (e, t, s, n) => e ?
   placeholder: "(555) 555-5555",
   // @ts-ignore
   pattern: e.pattern || "\\(\\d{3}\\) \\d{3}-\\d{4}",
-  keyup: ns
-})), Ea = r((e) => N({
+  keyup: as
+})), Ha = r((e) => F({
   ...e,
   type: "email",
   // @ts-ignore
@@ -702,61 +702,61 @@ const ke = (e) => e.id || e.name || `floating-${++es}`, Ce = (e, t, s, n) => e ?
   // @ts-ignore
   label: e.label || "Email",
   placeholder: "Email address"
-})), Ha = r((e) => Ge({
+})), _a = r((e) => Ge({
   ...e,
   as: "textarea",
   // @ts-ignore
   class: `flex w-full h-24 px-3 py-2 text-sm ${D} ${$} ${_} ${C} ${e.class || ""}`.trim()
-})), _a = (e = {}) => o({ class: "flex items-center gap-x-2" }, [
+})), Ua = (e = {}) => o({ class: "flex items-center gap-x-2" }, [
   p({
     ...e,
     type: "radio",
     class: "cursor-pointer appearance-none h-4 w-4 border rounded-full checked:border-primary checked:bg-primary focus:ring focus:ring-primary".trim()
   }),
   e.label && H({ forHTML: e.value, class: "cursor-pointer" }, e.label)
-]), Ua = r((e) => p({
+]), Ya = r((e) => p({
   ...e,
   type: "date",
   // @ts-ignore
   class: `${D} ${$} ${_} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Ya = r((e) => p({
+})), Va = r((e) => p({
   ...e,
   type: "time",
   // @ts-ignore
   class: `${D} ${$} ${_} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Va = r((e) => p({
+})), Wa = r((e) => p({
   ...e,
   type: "datetime-local",
   // @ts-ignore
   class: `${D} ${$} ${_} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Wa = r((e) => p({
+})), qa = r((e) => p({
   ...e,
   type: "month",
   // @ts-ignore
   class: `${D} ${$} ${_} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), qa = r((e) => p({
+})), Ga = r((e) => p({
   ...e,
   type: "week",
   // @ts-ignore
   class: `${D} ${$} ${_} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Ga = r((e) => N({
+})), Ka = r((e) => F({
   ...e,
   type: "number"
-})), Ka = r((e) => N({
+})), Qa = r((e) => F({
   ...e,
   type: "password"
 }));
-r((e) => N({
+r((e) => F({
   ...e,
   type: "search"
 }));
-const Qa = r((e) => N({
+const Ja = r((e) => F({
   ...e,
   type: "url"
-})), Ja = r((e) => N({
+})), Xa = r((e) => F({
   ...e,
   type: "hidden"
-})), Xa = r((e) => p({
+})), Za = r((e) => p({
   ...e,
   type: "color",
   // @ts-ignore
@@ -767,12 +767,12 @@ r((e) => fe({
   // @ts-ignore
   class: `flex h-4 w-4 text-foreground ${D} ${$} ${C} ${e.class || ""}`.trim()
 }));
-const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", Za = r((e) => p({
+const os = "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", eo = r((e) => p({
   ...e,
   type: "file",
   // @ts-ignore
-  class: `${ve} ${as} ${e.class || ""}`.trim()
-})), eo = O(
+  class: `${ve} ${os} ${e.class || ""}`.trim()
+})), to = N(
   {
     /**
      * This will create the initial state of the RangeSlider.
@@ -844,7 +844,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
       ]);
     }
   }
-), to = r((e) => {
+), so = r((e) => {
   const { options: t, onCreated: s, ...n } = e;
   return {
     tag: "select",
@@ -854,7 +854,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     ...n,
     class: `[&>option]:text-foreground [&>option]:bg-background ${ve} ${n.class || ""}`.trim()
   };
-}), os = r(({ src: e, alt: t, class: s, checkPath: n = !0 }) => !e || (s = s || "", n && e.indexOf(".") === -1 && e.indexOf("[[") === -1) ? null : ge({
+}), ls = r(({ src: e, alt: t, class: s, checkPath: n = !0 }) => !e || (s = s || "", n && e.indexOf(".") === -1 && e.indexOf("[[") === -1) ? null : ge({
   class: `absolute w-full h-full object-cover fadeIn ${s}`,
   src: e,
   alt: t,
@@ -863,7 +863,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
    * If there's an error loading the image, hide it.
    */
   error: (a) => a.target.style.visibility = "hidden"
-})), ls = (e) => !e || isNaN(e) ? null : e, Ne = (e, t) => {
+})), rs = (e) => !e || isNaN(e) ? null : e, Ne = (e, t) => {
   const s = e, n = 16, a = 2 * Math.PI * n, l = s / 100 * a, i = `
 	<svg class="w-40 h-40 mx-auto" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
 		<!-- Background Circle -->
@@ -906,20 +906,20 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     class: "circle-graph text-inherit",
     html: i
   });
-}, so = r((e) => {
+}, no = r((e) => {
   const t = e.progress || 0, s = e.class || "", n = Ne(t, s);
   return o({
     class: "circle-graph-wrap",
     onSet: [
       // @ts-ignore
       e.prop,
-      (a) => (a = ls(a), a ? Ne(a, s) : n)
+      (a) => (a = rs(a), a ? Ne(a, s) : n)
     ]
   }, [n]);
-}), rs = () => W(({ state: e }) => o({
+}), is = () => W(({ state: e }) => o({
   class: "absolute h-full rounded-full bg-primary transition-all duration-300",
   style: ["width: [[progress]]%;", e]
-})), no = O(
+})), ao = N(
   {
     /**
      * This will render the progress bar component.
@@ -928,7 +928,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
      */
     render() {
       return o({ class: "relative w-full h-4 rounded-full bg-muted" }, [
-        rs()
+        is()
       ]);
     },
     /**
@@ -971,7 +971,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
       e < 0 && (e = 0), e > 100 && (e = 100), this.state.progress = e;
     }
   }
-), ao = r((e = {}) => {
+), oo = r((e = {}) => {
   const {
     class: t = "",
     background: s = !0,
@@ -992,7 +992,7 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     style: m,
     "aria-hidden": "true"
   });
-}), oo = r((e = {}) => {
+}), lo = r((e = {}) => {
   const {
     class: t = "",
     background: s = !0,
@@ -1022,8 +1022,8 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
   "bottom-left": "top-full right-full transform translate-x-1 mt-2",
   left: "top-1/2 right-full transform -translate-y-1/2 mr-2",
   right: "top-1/2 left-full transform -translate-y-1/2 ml-2"
-}, is = (e) => Fe[String(e)] || Fe.top, lo = r(({ position: e = "top", content: t }, s) => {
-  const n = is(e);
+}, cs = (e) => Fe[String(e)] || Fe.top, ro = r(({ position: e = "top", content: t }, s) => {
+  const n = cs(e);
   return Array.isArray(s) === !1 && (s = [s]), o({ class: "relative group inline-block" }, [
     ...s,
     // Tooltip box
@@ -1060,19 +1060,19 @@ const as = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     bgColor: "bg-muted/10",
     iconColor: "text-muted-foreground"
   }
-}, cs = (e, t) => o({ class: `flex items-center justify-center h-6 w-6 mr-3 ${t}` }, [
+}, ds = (e, t) => o({ class: `flex items-center justify-center h-6 w-6 mr-3 ${t}` }, [
   x({ size: "sm" }, e)
-]), ds = (e) => gt({ class: "font-semibold" }, e), us = (e) => k({ class: "text-sm text-muted-foreground" }, e), ro = r(({ title: e, description: t, icon: s, type: n = "default" }) => {
+]), us = (e) => gt({ class: "font-semibold" }, e), hs = (e) => k({ class: "text-sm text-muted-foreground" }, e), io = r(({ title: e, description: t, icon: s, type: n = "default" }) => {
   const { borderColor: a, bgColor: l, iconColor: i } = Le[n] || Le.default;
   return o({ class: `flex items-start p-4 border rounded-lg ${l} ${a}` }, [
     // Icon and content
-    s && cs(s, i),
+    s && ds(s, i),
     o({ class: "flex flex-col" }, [
-      ds(e),
-      us(t)
+      us(e),
+      hs(t)
     ])
   ]);
-}), hs = (e, t) => {
+}), fs = (e, t) => {
   const s = e ? e.getBoundingClientRect() : { top: 0, bottom: 0, left: 0 }, n = t.getBoundingClientRect(), a = 10, l = globalThis.scrollX, i = globalThis.scrollY;
   let c = s.left + l, f = s.bottom + i;
   const m = globalThis.innerHeight - s.bottom, w = s.top;
@@ -1085,7 +1085,7 @@ class ne extends S {
    * @returns {object}
    */
   setData() {
-    const t = this.parent.data || new z();
+    const t = this.parent.data || new O();
     return t.set({
       position: { x: 0, y: 0 }
     }), t;
@@ -1155,7 +1155,7 @@ class ne extends S {
    * @returns {void}
    */
   updatePosition() {
-    const t = this.button ?? null, s = this.panel, n = hs(t, s);
+    const t = this.button ?? null, s = this.panel, n = fs(t, s);
     this.data.position = n;
   }
   /**
@@ -1207,28 +1207,28 @@ class ne extends S {
     this?.panel?.hidePopover();
   }
 }
-const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t)), gs = r((e, t) => H({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), ms = r((e, t) => k({ ...e, class: "text-sm text-muted-foreground italic" }, t)), bs = r((e, t) => k({ ...e, class: "text-sm text-destructive" }, t)), io = r((e, t = []) => At({ class: "flex flex-auto flex-col gap-y-0", margin: "m-0", padding: "p-0" }, [
+const gs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t)), ms = r((e, t) => H({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), bs = r((e, t) => k({ ...e, class: "text-sm text-muted-foreground italic" }, t)), xs = r((e, t) => k({ ...e, class: "text-sm text-destructive" }, t)), co = r((e, t = []) => Rt({ class: "flex flex-auto flex-col gap-y-0", margin: "m-0", padding: "p-0" }, [
   // @ts-ignore
   e.title && X({ class: "text-lg font-semibold py-4 px-6" }, e.title),
   // @ts-ignore
   e.description && k({ class: "text-sm text-muted-foreground pb-4 px-6 max-w-[700px]" }, e.description),
   ...t
-])), co = r((e, t = []) => (
+])), uo = r((e, t = []) => (
   // @ts-ignore
-  jt({ label: e.label, description: e.description, class: "py-4 px-6", border: e.border }, [
+  Et({ label: e.label, description: e.description, class: "py-4 px-6", border: e.border }, [
     o({ class: "flex flex-col gap-y-6" }, t)
   ])
-)), uo = r((e, t = []) => {
+)), ho = r((e, t = []) => {
   const s = e.border ? "border-t" : "";
   return o({ ...e, class: `flex flex-col pb-4 px-6 gap-y-4 ${s} ${e.class || ""}` }, t);
-}), xs = (e) => e.tag === "input" || e.tag === "select" || e.tag === "textarea", tt = (e, t, s) => e.map((n) => !n || (n.children && n.children.length > 0 && (n.children = tt(n.children, t, s)), !n.required) ? n : xs(n) ? {
+}), ps = (e) => e.tag === "input" || e.tag === "select" || e.tag === "textarea", tt = (e, t, s) => e.map((n) => !n || (n.children && n.children.length > 0 && (n.children = tt(n.children, t, s)), !n.required) ? n : ps(n) ? {
   ...n,
   aria: {
     invalid: ["hasError"]
   },
   invalid: s,
   input: t
-} : n), ps = r((e, t) => {
+} : n), ys = r((e, t) => {
   const a = tt(t, (l) => {
     l.target.checkValidity() && e.setError(null);
   }, (l) => {
@@ -1238,7 +1238,7 @@ const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
     ...e,
     class: "w-full"
   }, a);
-}), ho = O(
+}), fo = N(
   {
     /**
      * The initial state of the FormField.
@@ -1263,41 +1263,41 @@ const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
         this.state.error = l, this.state.hasError = !!l;
       };
       return o({ class: "flex flex-auto gap-y-4" }, [
-        fs([
-          gs({ htmlFor: t }, s),
-          ps({
+        gs([
+          ms({ htmlFor: t }, s),
+          ys({
             id: t,
             name: e,
             value: this.state.value,
             setError: a
           }, this.children),
-          n && ms({ id: this.getId("description") }, n),
-          o({ onState: ["error", (l) => l && bs(l)] })
+          n && bs({ id: this.getId("description") }, n),
+          o({ onState: ["error", (l) => l && xs(l)] })
         ])
       ]);
     }
   }
-), ys = (e, t, s = null) => {
+), ws = (e, t, s = null) => {
   e.target.checkValidity() && (e.preventDefault(), s && s(e, t));
 }, st = r(
   (e, t) => (
     // @ts-ignore
-    mt({ ...e, submit: (s, n) => ys(s, n, e.submit), class: `w-full ${e.class ?? ""}` }, t)
+    mt({ ...e, submit: (s, n) => ws(s, n, e.submit), class: `w-full ${e.class ?? ""}` }, t)
   )
-), fo = r((e, t) => (
+), go = r((e, t) => (
   // @ts-ignore
   o({ ...e, class: `flex flex-auto flex-col gap-y-6 p-4 md:p-6 divide-y ${e.class || ""}` }, t)
-)), go = r((e, t = []) => o({ class: "flex flex-col gap-y-3 py-4" }, [
+)), mo = r((e, t = []) => o({ class: "flex flex-col gap-y-3 py-4" }, [
   // @ts-ignore
   e.title && X({ class: "font-semibold" }, e.title),
   ...t
-])), mo = (e, t) => o({ class: "flex justify-between" }, [
+])), bo = (e, t) => o({ class: "flex justify-between" }, [
   u({ class: "text-muted-foreground" }, e),
   u(t)
-]), bo = (e, t) => o({ class: "flex" }, [
+]), xo = (e, t) => o({ class: "flex" }, [
   u({ class: "text-muted-foreground mr-8 w-24 truncate text-nowrap" }, e),
   u(t)
-]), ws = r(({ title: e, description: t, back: s, icon: n, options: a = [], titleCenter: l = !1 }) => Z({ class: "modal-header bg-background/80 backdrop-blur-md sticky flex flex-none items-center py-4 px-6 z-10 min-w-0" }, [
+]), vs = r(({ title: e, description: t, back: s, icon: n, options: a = [], titleCenter: l = !1 }) => Z({ class: "modal-header bg-background/80 backdrop-blur-md sticky flex flex-none items-center py-4 px-6 z-10 min-w-0" }, [
   /**
    * Back Button (Mobile Only)
    */
@@ -1320,7 +1320,7 @@ const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
     ]),
     o({ class: "flex flex-none items-center gap-2" }, a)
   ])
-])), xo = r((e, t) => {
+])), po = r((e, t) => {
   const s = e.class?.includes("drawer");
   return o({
     popover: "manual",
@@ -1336,7 +1336,7 @@ const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
       submit: (l, i) => e.onSubmit && e.onSubmit(i),
       cache: "modalContent"
     }, [
-      ws(e),
+      vs(e),
       o({ class: "modal-body flex grow flex-col py-0 px-6 z-0", cache: "modalBody" }, t),
       // @ts-ignore
       !e.hideFooter && me({ class: "modal-footer sticky bottom-0 bg-background/80 backdrop-blur-md flex flex-none justify-between py-4 px-6 z-10" }, e.buttons)
@@ -1368,22 +1368,22 @@ const fs = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
     borderColor: "border",
     iconColor: "text-muted-foreground"
   }
-}, vs = (e) => Z({ class: "flex justify-center" }, [
+}, ks = (e) => Z({ class: "flex justify-center" }, [
   be({ class: "text-lg font-bold mb-0" }, e)
-]), ks = r(({ href: e, class: t }, s) => Ke({
+]), Cs = r(({ href: e, class: t }, s) => Ke({
   class: `bg-popover text-popover-foreground relative flex flex-auto flex-col justify-start shadow-lg pointer-events-auto p-4 border rounded-md min-w-[340px] max-w-[450px] mt-4 ${t}`,
   href: e,
   animateIn: "pullRightIn",
   animateOut: "pullRight",
   role: "alert"
-}, s)), Cs = r(({ close: e, class: t }, s) => o({
+}, s)), Ss = r(({ close: e, class: t }, s) => o({
   class: `pullRightIn bg-popover text-popover-foreground relative flex flex-auto flex-col justify-start shadow-lg pointer-events-auto p-4 border rounded-md min-w-[340px] max-w-[450px] mt-4 ${t}`,
   click: () => e(),
   animateIn: "pullRightIn",
   animateOut: "pullRight",
   role: "alert"
 }, s));
-class po extends S {
+class yo extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -1407,10 +1407,10 @@ class po extends S {
    */
   render() {
     const { bgColor: t, borderColor: s, iconColor: n } = this.getTypeStyles(), a = this.href || null, l = this.getChildren(n);
-    return a ? ks({
+    return a ? Cs({
       href: a,
       class: `${t} ${s}`
-    }, l) : Cs({
+    }, l) : Ss({
       close: this.close.bind(this),
       class: `${t} ${s}`
     }, l);
@@ -1460,7 +1460,7 @@ class po extends S {
         ]),
         o({ class: "flex flex-auto flex-col" }, [
           o({ class: "flex flex-auto flex-row items-center w-full pr-12" }, [
-            this.title && vs(this.title)
+            this.title && ks(this.title)
           ]),
           k({ class: "text-base text-muted-foreground m-0 pr-12" }, this.description),
           (this.primary || this.secondary) && me({ class: "margin-top-24 flex align-center" }, this.getButtons())
@@ -1489,12 +1489,12 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   onState: ["method", { active: e }],
   dataSet: ["method", ["state", e, "active"]],
   click: (n, { state: a }) => {
-    a.method = e, localStorage.setItem("theme", e), e === "system" && localStorage.removeItem("theme"), Ss(e);
+    a.method = e, localStorage.setItem("theme", e), e === "system" && localStorage.removeItem("theme"), $s(e);
   }
 }, [
   x({}, s),
   u(t)
-])), Ss = (e) => {
+])), $s = (e) => {
   const t = document.documentElement;
   if (e === "system" && (e = globalThis.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light"), Re && !Re("(prefers-color-scheme: " + e + ")").matches) {
     t.classList.add(e);
@@ -1502,7 +1502,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   }
   const s = e === "light" ? "dark" : "light";
   t.classList.remove(s);
-}, yo = P(
+}, wo = M(
   {
     /**
      * This will render the component.
@@ -1529,7 +1529,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       };
     }
   }
-), wo = O(
+), vo = N(
   {
     /**
      * The initial state of the Toggle.
@@ -1581,11 +1581,11 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       ]);
     }
   }
-), $s = r(({ src: e, alt: t }) => !e || e.indexOf(".") === -1 && e.indexOf("[[") === -1 ? null : os({
+), Ds = r(({ src: e, alt: t }) => !e || e.indexOf(".") === -1 && e.indexOf("[[") === -1 ? null : ls({
   src: e,
   alt: t,
   class: "rounded-full"
-})), Ds = (e) => e && (Array.isArray(e) && (e = e.join(" ")), typeof e != "string" && (e = String(e)), e.split(" ").map((t) => t.charAt(0)).join("").toUpperCase()), nt = (e) => !e || e.length < 2 ? e : Ds(e), Is = (e) => u([e, (t, s) => {
+})), Is = (e) => e && (Array.isArray(e) && (e = e.join(" ")), typeof e != "string" && (e = String(e)), e.split(" ").map((t) => t.charAt(0)).join("").toUpperCase()), nt = (e) => !e || e.length < 2 ? e : Is(e), Ts = (e) => u([e, (t, s) => {
   s.textContent = nt(t);
 }]), je = {
   xs: "h-6 w-6",
@@ -1607,7 +1607,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   "3xl": "text-4xl",
   "4xl": "text-5xl",
   default: "text-base"
-}, Ts = (e) => je[e] || je.default, Ms = (e) => Ee[e] || Ee.default, Ps = (e, t = null, s = "md") => {
+}, Ps = (e) => je[e] || je.default, Ms = (e) => Ee[e] || Ee.default, Bs = (e, t = null, s = "md") => {
   const n = nt(String(e)), a = Ms(s);
   return o(
     {
@@ -1618,21 +1618,21 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
 		`
     },
     [
-      t ? Is(t) : u({ class: "uppercase" }, n)
+      t ? Ts(t) : u({ class: "uppercase" }, n)
     ]
   );
-}, Bs = r(({ src: e, alt: t, fallbackText: s, watcherFallback: n, size: a }) => {
-  const l = Ts(a);
+}, zs = r(({ src: e, alt: t, fallbackText: s, watcherFallback: n, size: a }) => {
+  const l = Ps(a);
   return o(
     {
       class: `relative flex items-center justify-center ${l}`
     },
     [
-      $s({ src: e, alt: t }),
-      Ps(s, n, a)
+      Ds({ src: e, alt: t }),
+      Bs(s, n, a)
     ]
   );
-}), He = (e) => !e || e.includes("[[") || e.indexOf(".") === -1 && e.indexOf("blob:") === -1, vo = P(
+}), He = (e) => !e || e.includes("[[") || e.indexOf(".") === -1 && e.indexOf("blob:") === -1, ko = M(
   {
     /**
      * Get the initial state for the component.
@@ -1688,7 +1688,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
             s.preventDefault(), s.stopPropagation(), this.openFileBrowse();
           }
         }, [
-          M("loaded", (s) => s === !1 || He(this.src) ? H({
+          P("loaded", (s) => s === !1 || He(this.src) ? H({
             htmlFor: e,
             class: "z-10 flex flex-col items-center justify-center text-sm text-muted-foreground group-hover:text-primary"
           }, [
@@ -1703,7 +1703,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       ]);
     }
   }
-), ko = P(
+), Co = M(
   {
     /**
      * Get the initial state for the component.
@@ -1759,7 +1759,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
             s.preventDefault(), s.stopPropagation(), this.openFileBrowse();
           }
         }, [
-          M(
+          P(
             "loaded",
             (s) => s ? ge({
               // @ts-ignore
@@ -1785,7 +1785,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       this.input = null;
     }
   }
-), zs = (e, t) => Ke(
+), Os = (e, t) => Ke(
   {
     href: e,
     "aria-current": t === "Breadcrumb" && "page",
@@ -1793,14 +1793,14 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     class: "text-muted-foreground font-medium hover:text-foreground"
   },
   [u(t)]
-), Os = () => x({
+), Ns = () => x({
   class: "mx-3 text-muted-foreground",
   "aria-hidden": !0,
   size: "xs"
-}, h.chevron.single.right), Ns = (e) => o({ class: "flex items-center" }, [
-  e.href ? zs(e.href, e.label) : u(e.label),
-  e.separator && Os()
-]), Co = P(
+}, h.chevron.single.right), Fs = (e) => o({ class: "flex items-center" }, [
+  e.href ? Os(e.href, e.label) : u(e.label),
+  e.separator && Ns()
+]), So = M(
   {
     /**
      * Set initial data
@@ -1808,7 +1808,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
      * @returns {Data}
      */
     setData() {
-      return new z({
+      return new O({
         // @ts-ignore
         items: this.items || []
       });
@@ -1829,7 +1829,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
           o({
             role: "list",
             class: "flex items-center",
-            for: ["items", (t, s) => Ns({
+            for: ["items", (t, s) => Fs({
               href: t.href,
               label: t.label,
               separator: s < e
@@ -1848,7 +1848,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   "2xl": "h-16 w-16",
   "3xl": "h-24 w-24",
   default: "h-4 w-4"
-}, Fs = (e) => _e[e] || _e.default, Ls = ({ index: e, size: t }) => o({ class: `${t} rounded-full bg-muted cursor-pointer` }, [
+}, Ls = (e) => _e[e] || _e.default, As = ({ index: e, size: t }) => o({ class: `${t} rounded-full bg-muted cursor-pointer` }, [
   u({
     class: "block w-full h-full rounded-full transition-colors",
     onSet: ["activeIndex", {
@@ -1859,10 +1859,10 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       n.activeIndex = e, a && a(e);
     }
   })
-]), As = (e, t) => Array.from({ length: e }, (s, n) => Ls({
+]), Rs = (e, t) => Array.from({ length: e }, (s, n) => As({
   index: n,
   size: t
-})), So = P(
+})), $o = M(
   {
     /**
      * Defines component data (props).
@@ -1870,7 +1870,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
      * @returns {Data}
      */
     setData() {
-      return new z({
+      return new O({
         // @ts-ignore
         count: this.count || 4,
         // total dots
@@ -1884,7 +1884,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
      * @returns {object}
      */
     render() {
-      const e = this.gap || "gap-2", t = Fs(this.size || "sm"), s = As(this.data.count, t);
+      const e = this.gap || "gap-2", t = Ls(this.size || "sm"), s = Rs(this.data.count, t);
       return o(
         { class: "flex justify-center items-center py-2" },
         [
@@ -1893,7 +1893,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       );
     }
   }
-), Rs = ({ toggleDropdown: e }) => v(
+), js = ({ toggleDropdown: e }) => v(
   {
     cache: "button",
     class: "relative z-2 inline-flex items-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border bg-input hover:bg-muted h-10 px-4 py-2 justify-between",
@@ -1903,27 +1903,27 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     u({ onState: ["selectedLabel", (t) => t || "Select item..."] }),
     x({ size: "sm" }, h.chevron.upDown)
   ]
-), js = (e, t, s) => pe({
+), Es = (e, t, s) => pe({
   class: "flex flex-auto items-center cursor-pointer p-2 hover:bg-muted/50 rounded-sm",
   click: () => t(e),
   onState: [s, "selectedValue", { "bg-secondary": e.value }]
 }, [
   e.icon && u({ class: "mr-2 flex items-baseline" }, [x({ size: "xs" }, e.icon)]),
   u({ class: "text-base font-normal" }, e.label)
-]), Es = (e, t) => o({ class: "w-full border rounded-md" }, [
-  ee({ class: "max-h-60 overflow-y-auto p-2 grid gap-1", for: ["items", (s) => js(s, e, t)] })
-]), Hs = ({ onSelect: e, state: t }) => o({ class: "flex flex-auto flex-col" }, [
-  M(
+]), Hs = (e, t) => o({ class: "w-full border rounded-md" }, [
+  ee({ class: "max-h-60 overflow-y-auto p-2 grid gap-1", for: ["items", (s) => Es(s, e, t)] })
+]), _s = ({ onSelect: e, state: t }) => o({ class: "flex flex-auto flex-col" }, [
+  P(
     "open",
     (s, n, a) => s ? new ne({
       cache: "dropdown",
       parent: a,
       button: a.button
     }, [
-      Es(e, t)
+      Hs(e, t)
     ]) : null
   )
-]), $o = P(
+]), Do = M(
   {
     /**
      * This will set up the data.
@@ -1931,7 +1931,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
      * @returns {Data}
      */
     setData() {
-      return new z({
+      return new O({
         // @ts-ignore
         items: this.items || []
       });
@@ -2004,8 +2004,8 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       const e = this.class || "", t = this.maxWidth || "max-w-[250px]", s = this.width || "w-full";
       return o({ class: `relative ${s} flex flex-auto flex-col ${t} ${e}` }, [
         // @ts-ignore
-        Rs({ toggleDropdown: this.toggleDropdown.bind(this) }),
-        Hs({
+        js({ toggleDropdown: this.toggleDropdown.bind(this) }),
+        _s({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -2031,15 +2031,15 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   click: t,
   icon: e,
   "aria-label": s
-}), _s = ({ click: e }) => at({
+}), Us = ({ click: e }) => at({
   icon: h.circleMinus,
   click: e,
   ariaLabel: "Decrement"
-}), Us = ({ click: e }) => at({
+}), Ys = ({ click: e }) => at({
   icon: h.circlePlus,
   click: e,
   ariaLabel: "Increment"
-}), Ys = ({ bind: e, min: t, max: s, readonly: n = !1 }) => W(({ state: a }) => p({
+}), Vs = ({ bind: e, min: t, max: s, readonly: n = !1 }) => W(({ state: a }) => p({
   value: ["[[count]]", a],
   bind: e,
   blur: (l, { state: i }) => {
@@ -2052,7 +2052,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
   max: s,
   type: "number",
   "aria-label": "Counter"
-})), Do = O(
+})), Io = N(
   {
     /**
      * Initial state for the counter component.
@@ -2075,18 +2075,18 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     render() {
       const e = this.class ?? "";
       return o({ class: `flex flex-auto items-center justify-between gap-x-4 p-4 ${e}` }, [
-        _s({ click: () => this.state.decrement("count") }),
-        Ys({
+        Us({ click: () => this.state.decrement("count") }),
+        Vs({
           bind: this.bind,
           readonly: this.readonly,
           min: this.min,
           max: this.max
         }),
-        Us({ click: () => this.state.increment("count") })
+        Ys({ click: () => this.state.increment("count") })
       ]);
     }
   }
-), Vs = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
+), Ws = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
   { class: "grid grid-cols-3 gap-2" },
   te.monthNames.map(
     (n, a) => b(
@@ -2100,9 +2100,9 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       n.substring(0, 3)
     )
   )
-), B = (e) => (e *= 1, e < 10 ? `0${e}` : String(e)), Ws = (e) => (e.indexOf("T") === -1 && e.indexOf(" ") === -1 && (e += "T00:00:01"), e.replace(" ", "T"), e), R = (e, t, s) => `${e}-${B(t + 1)}-${B(s)}`, qs = (e) => e ? "bg-accent text-primary" : "", Gs = (e) => e ? "text-muted-foreground opacity-50" : "", Ks = (e, t) => e === t, Qs = (e, t) => Ks(e, t) ? "bg-primary text-primary-foreground" : "", Js = (e, t, s, n) => {
-  const a = Qs(t, n);
-  return a || (e ? qs(e) : s ? Gs(s) : "text-foreground");
+), z = (e) => (e *= 1, e < 10 ? `0${e}` : String(e)), qs = (e) => (e.indexOf("T") === -1 && e.indexOf(" ") === -1 && (e += "T00:00:01"), e.replace(" ", "T"), e), R = (e, t, s) => `${e}-${z(t + 1)}-${z(s)}`, Gs = (e) => e ? "bg-accent text-primary" : "", Ks = (e) => e ? "text-muted-foreground opacity-50" : "", Qs = (e, t) => e === t, Js = (e, t) => Qs(e, t) ? "bg-primary text-primary-foreground" : "", Xs = (e, t, s, n) => {
+  const a = Js(t, n);
+  return a || (e ? Gs(e) : s ? Ks(s) : "text-foreground");
 }, ie = (e) => {
   const {
     day: t,
@@ -2117,7 +2117,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     {
       class: `
 				flex items-center justify-center h-9 w-auto p-0 font-normal text-sm rounded-md cursor-pointer
-				${Js(a, s, l, n)}
+				${Xs(a, s, l, n)}
 				hover:bg-muted/50 hover:text-muted-foreground focus:z-10
                 disabled:pointer-events-none disabled:opacity-50
 			`,
@@ -2128,10 +2128,10 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     },
     t.toString()
   );
-}, ce = (e, t, s, n) => e === n.date && t === n.month && s === n.year, Xs = (e, t, s, n = !1) => {
+}, ce = (e, t, s, n) => e === n.date && t === n.month && s === n.year, Zs = (e, t, s, n = !1) => {
   const { year: a, month: l } = e, i = R(a, l, e.date), c = new Date(a, l, 1).getDay(), f = new Date(a, l + 1, 0).getDate(), m = new Date(a, l, 0).getDate(), w = [], q = l === 0 ? 11 : l - 1, U = l === 0 ? a - 1 : a;
   for (let d = c - 1; d >= 0; d--) {
-    const y = m - d, I = ce(y, q, U, t), T = new Date(U, q, y) < new Date(t.year, t.month, t.date), F = n && T;
+    const y = m - d, I = ce(y, q, U, t), T = new Date(U, q, y) < new Date(t.year, t.month, t.date), L = n && T;
     w.push(
       ie({
         day: y,
@@ -2140,7 +2140,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
         isToday: I,
         isOutsideMonth: !0,
         select: s,
-        disabled: F
+        disabled: L
       })
     );
   }
@@ -2187,16 +2187,16 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     variant: "icon",
     icon: e === "Previous" ? h.chevron.single.left : h.chevron.single.right
   }
-), Zs = ({ onMonthClick: e, onYearClick: t, next: s, previous: n }) => o({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
+), en = ({ onMonthClick: e, onYearClick: t, next: s, previous: n }) => o({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
   b({ click: e, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
   b({ click: t, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
   Ue({ label: "Previous", click: n }),
   Ue({ label: "Next", click: s })
-]), en = (e) => o(
+]), tn = (e) => o(
   { class: "flex items-center justify-center h-9 w-auto text-[0.8rem] font-normal text-muted-foreground" },
   e
-), tn = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(en), sn = (e) => o({ class: "rdp flex flex-auto flex-col w-full gap-y-1" }, [
-  Zs({
+), sn = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(tn), nn = (e) => o({ class: "rdp flex flex-auto flex-col w-full gap-y-1" }, [
+  en({
     onMonthClick: e.onMonthClick,
     onYearClick: e.onYearClick,
     next: e.next,
@@ -2207,10 +2207,10 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     onSet: [
       "currentDate",
       () => [
-        o({ class: "grid grid-cols-7" }, tn()),
+        o({ class: "grid grid-cols-7" }, sn()),
         o(
           { class: "grid grid-cols-7" },
-          Xs(
+          Zs(
             e.current,
             e.today,
             e.select,
@@ -2220,7 +2220,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
       ]
     ]
   })
-]), nn = ({ currentMonth: e, currentYear: t, onSelect: s }) => {
+]), an = ({ currentMonth: e, currentYear: t, onSelect: s }) => {
   const n = t - 50, a = Array.from({ length: 101 }, (l, i) => n + i);
   return o(
     { class: "grid grid-cols-4 gap-2 overflow-y-auto max-h-72" },
@@ -2238,7 +2238,7 @@ const Re = globalThis.matchMedia, re = r(({ value: e, label: t, icon: s }) => v(
     )
   );
 };
-class an extends S {
+class on extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -2254,7 +2254,7 @@ class an extends S {
    * @returns {Date}
    */
   getSelectedDate(t) {
-    const s = this.selectedDate ? new Date(Ws(this.selectedDate)) : t;
+    const s = this.selectedDate ? new Date(qs(this.selectedDate)) : t;
     return new Date(s.getFullYear(), s.getMonth(), s.getDate());
   }
   /**
@@ -2264,7 +2264,7 @@ class an extends S {
    */
   setData() {
     const t = /* @__PURE__ */ new Date(), s = this.getSelectedDate(t), n = s.getMonth();
-    return new z({
+    return new O({
       monthName: this.getMonthName(n),
       currentDate: `${s.getFullYear()}-${n + 1}-${s.getDate()}`,
       current: {
@@ -2329,7 +2329,7 @@ class an extends S {
    */
   setCurrentDate(t, s, n = null) {
     const a = this.data;
-    a.current.month = t, a.current.year = s, typeof n == "number" && (a.current.date = B(n)), a.currentDate = `${s}-${B(t + 1)}-${a.current.date}`, a.monthName = this.getMonthName(t);
+    a.current.month = t, a.current.year = s, typeof n == "number" && (a.current.date = z(n)), a.currentDate = `${s}-${z(t + 1)}-${a.current.date}`, a.monthName = this.getMonthName(t);
   }
   /**
    * This will select a date.
@@ -2348,10 +2348,10 @@ class an extends S {
    */
   render() {
     return o({ class: "calendar-container p-3 rounded-md border min-w-80" }, [
-      M("view", (t) => {
+      P("view", (t) => {
         switch (t) {
           case "months":
-            return Vs(
+            return Ws(
               {
                 // @ts-ignore
                 currentMonth: this.data.current.month,
@@ -2363,7 +2363,7 @@ class an extends S {
               }
             );
           case "years":
-            return nn(
+            return an(
               {
                 // @ts-ignore
                 currentMonth: this.data.current.month,
@@ -2375,7 +2375,7 @@ class an extends S {
               }
             );
           default:
-            return sn({
+            return nn({
               // @ts-ignore
               current: this.data.current,
               // @ts-ignore
@@ -2396,33 +2396,33 @@ class an extends S {
     ]);
   }
 }
-const on = (e) => {
+const ln = (e) => {
   let t = "";
   return e.length > 0 && (t = e.substring(0, 2), e.length > 2 && (t += "/" + e.substring(2, 4), e.length > 4 && (t += "/" + e.substring(4, 8)))), t;
-}, ln = (e) => {
+}, rn = (e) => {
   if (e.length !== 8)
     return null;
   const t = parseInt(e.substring(0, 2), 10), s = parseInt(e.substring(2, 4), 10), n = parseInt(e.substring(4, 8), 10);
   return t >= 1 && t <= 12 && s >= 1 && s <= 31 && n >= 1900 ? `${n}-${t.toString().padStart(2, "0")}-${s.toString().padStart(2, "0")}` : null;
-}, rn = ({ bind: e, required: t }) => p({
+}, cn = ({ bind: e, required: t }) => p({
   cache: "input",
   class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
   bind: e,
   required: t
-}), cn = ({ placeholder: e, handleInputChange: t, handleInputFocus: s }) => p({
+}), dn = ({ placeholder: e, handleInputChange: t, handleInputFocus: s }) => p({
   cache: "dateInput",
   class: "flex-1 bg-transparent outline-none placeholder:text-muted-foreground border-0",
   placeholder: e || "mm/dd/yyyy",
   input: t,
   focus: s,
   onState: ["selectedDate", (n) => n ? te.format("standard", n) : ""]
-}), dn = ({ bind: e, required: t, toggleOpen: s, handleInputChange: n, handleInputFocus: a, placeholder: l }) => o(
+}), un = ({ bind: e, required: t, toggleOpen: s, handleInputChange: n, handleInputFocus: a, placeholder: l }) => o(
   {
     class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 pr-4 py-2"
   },
   [
-    rn({ bind: e, required: t }),
-    cn({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
+    cn({ bind: e, required: t }),
+    dn({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
     v(
       {
         class: "shrink-0 hover:bg-muted/50 rounded p-1 cursor-pointer",
@@ -2433,20 +2433,20 @@ const on = (e) => {
       ]
     )
   ]
-), un = ({ handleDateSelect: e, blockPriorDates: t }) => ye(
+), hn = ({ handleDateSelect: e, blockPriorDates: t }) => ye(
   (s, n, a) => new ne({
     cache: "dropdown",
     parent: a,
     button: a.panel,
     size: "fit"
   }, [
-    new an({
+    new on({
       selectedDate: a.state.selectedDate,
       selectedCallBack: e,
       blockPriorDates: t
     })
   ])
-), Io = O(
+), To = N(
   {
     /**
      * The initial state of the DatePicker.
@@ -2475,8 +2475,8 @@ const on = (e) => {
      */
     handleInputChange(e) {
       const s = e.target.value.replace(/\D/g, "");
-      e.target.value = on(s);
-      const n = ln(s);
+      e.target.value = ln(s);
+      const n = rn(s);
       n && (this.state.selectedDate = n, this.input.value = n, j.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(n));
     },
     /**
@@ -2513,7 +2513,7 @@ const on = (e) => {
       return o(
         { class: "relative w-full max-w-[320px]" },
         [
-          dn({
+          un({
             toggleOpen: this.toggleOpen.bind(this),
             bind: this.bind,
             required: this.required,
@@ -2521,7 +2521,7 @@ const on = (e) => {
             handleInputFocus: this.handleInputFocus.bind(this),
             placeholder: this.placeholder
           }),
-          un({
+          hn({
             handleDateSelect: this.handleDateSelect.bind(this),
             blockPriorDates: this.blockPriorDates || !1
           })
@@ -2542,15 +2542,15 @@ const on = (e) => {
     variant: "icon",
     icon: e === "Previous" ? h.chevron.single.left : h.chevron.single.right
   }
-), hn = ({ onMonthClick: e, onYearClick: t, next: s, previous: n }) => o({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
+), fn = ({ onMonthClick: e, onYearClick: t, next: s, previous: n }) => o({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
   b({ click: e, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
   b({ click: t, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
   Ye({ label: "Previous", click: n }),
   Ye({ label: "Next", click: s })
-]), fn = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), gn = () => o(
+]), gn = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), mn = () => o(
   { class: "grid grid-cols-7 gap-1 text-center text-xs font-medium text-muted-foreground mb-2" },
-  ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(fn)
-), mn = ({ day: e, iso: t, disabled: s, isStart: n, isEnd: a, isBetween: l, isOtherMonth: i, click: c }) => {
+  ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(gn)
+), bn = ({ day: e, iso: t, disabled: s, isStart: n, isEnd: a, isBetween: l, isOtherMonth: i, click: c }) => {
   let f = "ghost", m = "";
   return n || a ? (f = "default", m = "bg-primary text-primary-foreground hover:bg-primary/90") : l && (m = "bg-accent text-accent-foreground hover:bg-accent/80"), s && (m += " opacity-50 cursor-not-allowed"), i && (m += " text-muted-foreground opacity-50"), b(
     {
@@ -2563,10 +2563,10 @@ const on = (e) => {
     },
     e.toString()
   );
-}, bn = ({ today: e, current: t, blockPriorDates: s, onDateClick: n }) => {
+}, xn = ({ today: e, current: t, blockPriorDates: s, onDateClick: n }) => {
   const { start: a, end: l } = t, i = new Date(t.year, t.month, 1).getDay(), c = new Date(t.year, t.month + 1, 0).getDate(), f = [], m = t.month === 0 ? 11 : t.month - 1, w = t.month === 0 ? t.year - 1 : t.year, q = new Date(w, m + 1, 0).getDate(), U = t.month === 11 ? 0 : t.month + 1, Y = t.month === 11 ? t.year + 1 : t.year;
   for (let g = i - 1; g >= 0; g--) {
-    const d = q - g, y = R(w, m, d), I = new Date(w, m, d), T = new Date(e.year, e.month, e.date), F = I < T, G = s && F, K = a === y, Q = l === y, ut = a && l && y > a && y < l;
+    const d = q - g, y = R(w, m, d), I = new Date(w, m, d), T = new Date(e.year, e.month, e.date), L = I < T, G = s && L, K = a === y, Q = l === y, ut = a && l && y > a && y < l;
     f.push({
       day: d,
       iso: y,
@@ -2579,11 +2579,11 @@ const on = (e) => {
     });
   }
   for (let g = 1; g <= c; g++) {
-    const d = R(t.year, t.month, g), y = new Date(t.year, t.month, g), I = new Date(e.year, e.month, e.date), T = y < I, F = s && T, G = a === d, K = l === d, Q = a && l && d > a && d < l;
+    const d = R(t.year, t.month, g), y = new Date(t.year, t.month, g), I = new Date(e.year, e.month, e.date), T = y < I, L = s && T, G = a === d, K = l === d, Q = a && l && d > a && d < l;
     f.push({
       day: g,
       iso: d,
-      disabled: F,
+      disabled: L,
       isStart: G,
       isEnd: K,
       isBetween: Q,
@@ -2595,11 +2595,11 @@ const on = (e) => {
   }
   const $e = (7 - f.length % 7) % 7;
   for (let g = 1; g <= $e; g++) {
-    const d = R(Y, U, g), y = new Date(Y, U, g), I = new Date(e.year, e.month, e.date), T = y < I, F = s && T, G = a === d, K = l === d, Q = a && l && d > a && d < l;
+    const d = R(Y, U, g), y = new Date(Y, U, g), I = new Date(e.year, e.month, e.date), T = y < I, L = s && T, G = a === d, K = l === d, Q = a && l && d > a && d < l;
     f.push({
       day: g,
       iso: d,
-      disabled: F,
+      disabled: L,
       isStart: G,
       isEnd: K,
       isBetween: Q,
@@ -2610,7 +2610,7 @@ const on = (e) => {
   return o(
     { class: "grid grid-cols-7 gap-1" },
     f.map(
-      (g, d) => mn({
+      (g, d) => bn({
         day: g.day,
         iso: g.iso,
         disabled: g.disabled,
@@ -2622,8 +2622,8 @@ const on = (e) => {
       })
     )
   );
-}, xn = r((e, t) => o({ class: "flex flex-auto flex-col" }, [
-  hn({
+}, pn = r((e, t) => o({ class: "flex flex-auto flex-col" }, [
+  fn({
     // @ts-ignore
     onMonthClick: e.onMonthClick,
     // @ts-ignore
@@ -2638,8 +2638,8 @@ const on = (e) => {
     onSet: [
       "currentDate",
       () => [
-        gn(),
-        bn({
+        mn(),
+        xn({
           // @ts-ignore
           today: e.today,
           // @ts-ignore
@@ -2652,7 +2652,7 @@ const on = (e) => {
       ]
     ]
   })
-])), pn = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
+])), yn = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
   { class: "grid grid-cols-3 gap-2" },
   te.monthNames.map(
     (n, a) => b(
@@ -2666,7 +2666,7 @@ const on = (e) => {
       n.substring(0, 3)
     )
   )
-), yn = ({ start: e, end: t, selecting: s, onSelectStart: n, onSelectEnd: a }) => o({ class: "flex gap-x-2 mb-4" }, [
+), wn = ({ start: e, end: t, selecting: s, onSelectStart: n, onSelectEnd: a }) => o({ class: "flex gap-x-2 mb-4" }, [
   J("selecting", (l) => b({
     click: n,
     variant: l === "start" ? "primary" : "outline",
@@ -2681,10 +2681,10 @@ const on = (e) => {
   }, [
     o({ class: "font-medium" }, Ve("current.end", "End Date"))
   ]))
-]), Ve = (e, t) => [`[[${e}]]`, (s) => s == null ? t : wn(s)], wn = (e) => {
+]), Ve = (e, t) => [`[[${e}]]`, (s) => s == null ? t : vn(s)], vn = (e) => {
   const t = /* @__PURE__ */ new Date(e + "T00:00:00"), s = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], n = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
   return `${s[t.getDay()]}, ${t.getDate()} ${n[t.getMonth()]}`;
-}, vn = ({ currentYear: e, onSelect: t }) => {
+}, kn = ({ currentYear: e, onSelect: t }) => {
   const s = e - 50, n = Array.from({ length: 101 }, (a, l) => s + l);
   return o(
     { class: "grid grid-cols-4 gap-2 overflow-y-auto max-h-72" },
@@ -2702,7 +2702,7 @@ const on = (e) => {
     )
   );
 };
-class kn extends S {
+class Cn extends S {
   /**
    * Declare compiler props.
    *
@@ -2718,14 +2718,14 @@ class kn extends S {
    */
   setData() {
     const t = /* @__PURE__ */ new Date(), s = this.startDate ? /* @__PURE__ */ new Date(this.startDate + "T00:00:00") : t, n = s.getMonth(), a = s.getFullYear();
-    return new z({
+    return new O({
       today: {
         date: t.getDate(),
         month: t.getMonth(),
         year: t.getFullYear()
       },
       monthName: this.getMonthName(n),
-      currentData: `${s.getFullYear()}-${B(s.getMonth() + 1)}-${B(s.getDate())}`,
+      currentData: `${s.getFullYear()}-${z(s.getMonth() + 1)}-${z(s.getDate())}`,
       current: {
         date: t.getDate(),
         month: n,
@@ -2789,7 +2789,7 @@ class kn extends S {
    */
   setCurrent({ month: t, year: s, date: n = null }) {
     const a = this.data.current;
-    a.month = (t + 12) % 12, a.year = s + (t < 0 ? -1 : t > 11 ? 1 : 0), n !== null && (a.date = n), this.data.monthName = this.getMonthName(a.month), this.data.currentDate = `${s}-${B(t + 1)}-${B(a.date)}`;
+    a.month = (t + 12) % 12, a.year = s + (t < 0 ? -1 : t > 11 ? 1 : 0), n !== null && (a.date = n), this.data.monthName = this.getMonthName(a.month), this.data.currentDate = `${s}-${z(t + 1)}-${z(a.date)}`;
   }
   /**
    * Render the range calendar.
@@ -2799,7 +2799,7 @@ class kn extends S {
   render() {
     const { today: t, current: s, selecting: n } = this.data, { start: a, end: l } = s;
     return o({ class: "range-calendar border border-border rounded-lg shadow-md p-4 w-full max-w-sm min-w-80" }, [
-      yn({
+      wn({
         start: a,
         end: l,
         selecting: n,
@@ -2810,10 +2810,10 @@ class kn extends S {
           i.preventDefault(), i.stopPropagation(), this.data.selecting = "end";
         }
       }),
-      M("view", (i) => {
+      P("view", (i) => {
         switch (i) {
           case "months":
-            return pn(
+            return yn(
               {
                 currentMonth: s.month,
                 currentYear: s.year,
@@ -2823,7 +2823,7 @@ class kn extends S {
               }
             );
           case "years":
-            return vn(
+            return kn(
               {
                 currentYear: s.year,
                 onSelect: (c) => {
@@ -2832,7 +2832,7 @@ class kn extends S {
               }
             );
           default:
-            return xn({
+            return pn({
               // @ts-ignore
               monthName: this.data.monthName,
               year: s.year,
@@ -2860,35 +2860,35 @@ class kn extends S {
     ]);
   }
 }
-const Cn = ({ bind: e, required: t }) => p({
+const Sn = ({ bind: e, required: t }) => p({
   cache: "input",
   class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
   bind: e,
   required: t
-}), Sn = ({ bind: e, required: t, toggleOpen: s }) => v({
+}), $n = ({ bind: e, required: t, toggleOpen: s }) => v({
   class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 px-4 py-2",
   click: s
 }, [
-  Cn({ bind: e, required: t }),
+  Sn({ bind: e, required: t }),
   W(({ state: n }) => [
     u(V.date(["[[start]]", n], "Start Date")),
     u(" - "),
     u(V.date(["[[end]]", n], "End Date"))
   ]),
   E({ html: h.calendar.days })
-]), $n = ({ handleDateSelect: e, blockPriorDates: t }) => ye((s, n, a) => new ne({
+]), Dn = ({ handleDateSelect: e, blockPriorDates: t }) => ye((s, n, a) => new ne({
   cache: "dropdown",
   parent: a,
   button: a.panel,
   size: "xl"
 }, [
-  new kn({
+  new Cn({
     startDate: a.state.start,
     endDate: a.state.end,
     onRangeSelect: e,
     blockPriorDates: t
   })
-])), To = O(
+])), Po = N(
   {
     /**
      * The initial state of the DateRangePicker.
@@ -2924,12 +2924,12 @@ const Cn = ({ bind: e, required: t }) => p({
         this.state.start = s, this.state.end = n, this.state.open = !1, this.input.value = `${s}-${n}`, j.trigger("change", this.input), typeof this.onChange == "function" && this.onChange({ start: s, end: n }, this.parent);
       };
       return o({ class: "relative w-full max-w-[320px]" }, [
-        Sn({
+        $n({
           toggleOpen: e,
           bind: this.bind,
           required: this.required
         }),
-        $n({
+        Dn({
           handleDateSelect: t,
           blockPriorDates: this.blockPriorDates || !1
         })
@@ -2937,11 +2937,11 @@ const Cn = ({ bind: e, required: t }) => p({
     }
   }
 );
-function Dn(e) {
+function In(e) {
   let t = "";
   return e.length > 0 && (t = e.substring(0, 2), e.length > 2 && (t += ":" + e.substring(2, 4))), t;
 }
-function In(e) {
+function Tn(e) {
   if (e.length < 4)
     return { formattedTime: null, hour: null, minute: null, meridian: null };
   const t = parseInt(e.substring(0, 2), 10), s = parseInt(e.substring(2, 4), 10);
@@ -2955,7 +2955,7 @@ function In(e) {
     meridian: a
   };
 }
-function Tn({ bind: e, required: t }) {
+function Pn({ bind: e, required: t }) {
   return p({
     cache: "input",
     class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
@@ -2973,13 +2973,13 @@ function Mn({ placeholder: e, handleInputChange: t, handleInputFocus: s }) {
     onState: ["selectedTime", (n) => n || ""]
   });
 }
-function Pn({ bind: e, required: t, toggleOpen: s, handleInputChange: n, handleInputFocus: a, placeholder: l }) {
+function Bn({ bind: e, required: t, toggleOpen: s, handleInputChange: n, handleInputFocus: a, placeholder: l }) {
   return o(
     {
       class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 pr-4 py-2"
     },
     [
-      Tn({ bind: e, required: t }),
+      Pn({ bind: e, required: t }),
       Mn({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
       v(
         {
@@ -3007,7 +3007,7 @@ function de({ items: e, handleTimeSelect: t, state: s, stateValue: n, pad: a = !
     })
   );
 }
-function Bn({ handleTimeSelect: e }) {
+function zn({ handleTimeSelect: e }) {
   return ye(
     (t, s, n) => new ne(
       {
@@ -3067,7 +3067,7 @@ function We(e) {
     meridian: l
   });
 }
-const Mo = O(
+const Mo = N(
   {
     /**
      * The initial shallow state of the TimePicker.
@@ -3115,8 +3115,8 @@ const Mo = O(
      * @param {Event} e
      */
     handleInputChange(e) {
-      let t = e.target.value.replace(/[^\d]/g, ""), s = Dn(t);
-      const n = In(t);
+      let t = e.target.value.replace(/[^\d]/g, ""), s = In(t);
+      const n = Tn(t);
       n.formattedTime && (s = n.formattedTime, this.state.set({
         hour: n.hour,
         minute: n.minute,
@@ -3152,7 +3152,7 @@ const Mo = O(
       return o(
         { class: "relative w-full max-w-[320px]" },
         [
-          Pn({
+          Bn({
             toggleOpen: this.toggleOpen.bind(this),
             bind: this.bind,
             required: this.required,
@@ -3160,18 +3160,18 @@ const Mo = O(
             handleInputFocus: this.handleInputFocus.bind(this),
             placeholder: this.placeholder
           }),
-          Bn({
+          zn({
             handleTimeSelect: this.handleTimeSelect.bind(this)
           })
         ]
       );
     }
   }
-), zn = (e, t) => o({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
+), On = (e, t) => o({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
   x({ size: "lg" }, e)
-]), On = ({ title: e }) => Z({ class: "flex flex-auto items-center" }, [
+]), Nn = ({ title: e }) => Z({ class: "flex flex-auto items-center" }, [
   X({ class: "text-lg font-semibold" }, e)
-]), Po = r((e, t) => bt(
+]), Bo = r((e, t) => bt(
   {
     class: `fixed pullUpIn z-30 w-[98%] border md:w-full max-w-lg bg-popover text-foreground shadow-lg duration-200
 				rounded-lg flex flex-auto flex-col
@@ -3184,10 +3184,10 @@ const Mo = O(
     o({ class: "flex flex-auto p-6 pb-12 md:pb-6" }, [
       // Icon and content
       // @ts-ignore
-      e.icon && zn(e.icon, e.iconColor),
+      e.icon && On(e.icon, e.iconColor),
       o({ class: "flex flex-auto flex-col gap-4" }, [
         o({ class: "flex flex-auto flex-col gap-y-2" }, [
-          On(e),
+          Nn(e),
           // @ts-ignore
           e.description && k({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, e.description),
           o({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, t)
@@ -3197,7 +3197,7 @@ const Mo = O(
       ])
     ])
   ]
-)), Bo = r((e, t = []) => o({ class: "w-full max-w-md p-6 m-auto" }, [
+)), zo = r((e, t = []) => o({ class: "w-full max-w-md p-6 m-auto" }, [
   st({ class: "flex flex-auto flex-col" }, [
     o({ class: "flex flex-auto flex-col gap-y-4" }, [
       o({ class: "flex flex-auto items-center justify-center" }, [
@@ -3228,12 +3228,12 @@ r(({ value: e, label: t }) => v({
   dataSet: ["performance", ["state", e, "active"]],
   click: (s, { state: n }) => n.performance = e
 }, t));
-const Nn = (e, t) => {
+const Fn = (e, t) => {
   const s = e.toggleAllSelectedRows();
   t.state.checked = !s;
-}, Fn = (e) => Qe({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
-  W((t) => new Vt({ class: "mr-2", onChange: (s, n) => Nn(t, n) }))
-]), Ln = ({ align: e, sortable: t, key: s, label: n, sort: a, class: l }) => {
+}, Ln = (e) => Qe({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
+  W((t) => new Wt({ class: "mr-2", onChange: (s, n) => Fn(t, n) }))
+]), An = ({ align: e, sortable: t, key: s, label: n, sort: a, class: l }) => {
   const i = e || "justify-start";
   return Qe({
     class: `cursor-pointer py-3 px-4 text-base ${l || ""}`,
@@ -3249,7 +3249,7 @@ const Nn = (e, t) => {
     class: "text-muted-foreground border-b",
     map: [
       e.headers,
-      (t) => t.label === "checkbox" ? Fn({ toggle: e.toggle }) : Ln({
+      (t) => t.label === "checkbox" ? Ln({ toggle: e.toggle }) : An({
         align: t.align,
         sortable: t.sortable,
         key: t.key,
@@ -3258,7 +3258,7 @@ const Nn = (e, t) => {
       })
     ]
   })
-]), An = ({ key: e, rows: t, selectRow: s, rowItem: n, emptyState: a, skeleton: l, columnCount: i }) => new Ct({
+]), Rn = ({ key: e, rows: t, selectRow: s, rowItem: n, emptyState: a, skeleton: l, columnCount: i }) => new Ct({
   cache: "list",
   key: e,
   items: t,
@@ -3276,7 +3276,7 @@ class ot extends S {
    */
   setData() {
     let t = this.rows && this.rows.length > 0;
-    return (this.loadMoreItems || this.tableData) && !t && (t = null), new z({
+    return (this.loadMoreItems || this.tableData) && !t && (t = null), new O({
       selectedRows: [],
       // @ts-ignore
       hasItems: t,
@@ -3354,7 +3354,7 @@ class ot extends S {
           this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          An({
+          Rn({
             // @ts-ignore
             key: this.key,
             // @ts-ignore
@@ -3433,7 +3433,7 @@ class ot extends S {
     this.data.selectedRows = [];
   }
 }
-const Rn = (e) => new St({
+const jn = (e) => new St({
   cache: "list",
   loadMoreItems: e.loadMoreItems,
   offset: e.offset,
@@ -3446,7 +3446,7 @@ const Rn = (e) => new St({
   skeleton: e.skeleton,
   columnCount: e.columnCount
 });
-class jn extends ot {
+class En extends ot {
   /**
    * Renders the DataTable component.
    *
@@ -3462,7 +3462,7 @@ class jn extends ot {
           this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          Rn({
+          jn({
             // @ts-ignore
             loadMoreItems: this.loadMoreItems,
             // @ts-ignore
@@ -3498,7 +3498,7 @@ class jn extends ot {
     this.list.refresh();
   }
 }
-const zo = r((e) => new jn(
+const Oo = r((e) => new En(
   {
     // @ts-ignore
     cache: e.cache ?? "list",
@@ -3529,7 +3529,7 @@ const zo = r((e) => new jn(
     // @ts-ignore
     skeleton: e.skeleton
   }
-)), En = (e) => new $t({
+)), Hn = (e) => new $t({
   cache: "list",
   scrollContainer: e.scrollContainer,
   loadMoreItems: e.loadMoreItems,
@@ -3543,7 +3543,7 @@ const zo = r((e) => new jn(
   skeleton: e.skeleton,
   columnCount: e.columnCount
 });
-class Hn extends ot {
+class _n extends ot {
   /**
    * Renders the DataTable component.
    *
@@ -3559,7 +3559,7 @@ class Hn extends ot {
           this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          En({
+          Hn({
             // @ts-ignore
             scrollContainer: this.scrollContainer,
             // @ts-ignore
@@ -3597,7 +3597,7 @@ class Hn extends ot {
     this.list.refresh();
   }
 }
-const Oo = r((e) => new Hn(
+const No = r((e) => new _n(
   {
     // @ts-ignore
     cache: e.cache ?? "list",
@@ -3630,28 +3630,28 @@ const Oo = r((e) => new Hn(
     // @ts-ignore
     skeleton: e.skeleton
   }
-)), _n = r(({ name: e, email: t }) => o({ class: "min-w-0 flex-auto" }, [
+)), Un = r(({ name: e, email: t }) => o({ class: "min-w-0 flex-auto" }, [
   k({ class: "text-base font-semibold leading-6 m-0" }, e),
   k({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, t)
-])), Un = () => o({ class: "flex items-center gap-x-1.5" }, [
+])), Yn = () => o({ class: "flex items-center gap-x-1.5" }, [
   o({ class: "flex-none rounded-full bg-emerald-500/20 p-1" }, [
     o({ class: "h-1.5 w-1.5 rounded-full bg-emerald-500" })
   ]),
   k({ class: "text-xs leading-5 text-gray-500" }, "Online")
-]), Yn = (e) => k({ class: "text-xs leading-5 text-muted-foreground" }, [
+]), Vn = (e) => k({ class: "text-xs leading-5 text-muted-foreground" }, [
   u("Last seen "),
   yt({ datetime: e }, "3h ago")
-]), Vn = (e, t) => e === "online" ? Un() : Yn(t), Wn = r(({ role: e, lastSeen: t, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
+]), Wn = (e, t) => e === "online" ? Yn() : Vn(t), qn = r(({ role: e, lastSeen: t, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
   k({ class: "text-sm leading-6 m-0" }, e),
-  Vn(s, t)
-])), qn = (e) => e.split(" ").map((s) => s[0]).join(""), Gn = r((e) => pe({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
+  Wn(s, t)
+])), Gn = (e) => e.split(" ").map((s) => s[0]).join(""), Kn = r((e) => pe({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
   o({ class: "flex min-w-0 gap-x-4" }, [
     // @ts-ignore
-    Bs({ src: e.image, alt: e.name, fallbackText: qn(e.name) }),
+    zs({ src: e.image, alt: e.name, fallbackText: Gn(e.name) }),
     // @ts-ignore
-    _n({ name: e.name, email: e.email })
+    Un({ name: e.name, email: e.email })
   ]),
-  Wn({
+  qn({
     // @ts-ignore
     role: e.role,
     // @ts-ignore
@@ -3659,16 +3659,16 @@ const Oo = r((e) => new Hn(
     // @ts-ignore
     status: e.status
   })
-])), No = r((e) => new Dt({
+])), Fo = r((e) => new Dt({
   cache: "list",
   key: "name",
   // @ts-ignore
   items: e.users,
   role: "list",
   class: "divide-y divide-border",
-  rowItem: Gn
+  rowItem: Kn
 }));
-class Kn extends S {
+class Qn extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3729,14 +3729,14 @@ class Kn extends S {
     });
   }
 }
-const Qn = r(({ options: e, click: t }, s) => ({
+const Jn = r(({ options: e, click: t }, s) => ({
   tag: "li",
   ...{
     class: `relative flex flex-row w-auto text-left p-0 transition-all cursor-pointer min-w-[48px] option${e ? " sub" : ""}`,
     click: t
   },
   children: s
-})), Jn = (e, t = null, s = !1) => [
+})), Xn = (e, t = null, s = !1) => [
   t && o({
     class: "icon w-12 rounded-md flex items-center justify-center min-w-12",
     onState: ["selected", {
@@ -3780,7 +3780,7 @@ class lt extends S {
    */
   render() {
     const t = !this.options && this.callBack;
-    return Qn(
+    return Jn(
       { options: this.options, click: t },
       [
         this.addLink()
@@ -3794,7 +3794,7 @@ class lt extends S {
    * @protected
    */
   addLink() {
-    const t = this.options && this.options.length > 0, s = this.content || Jn(String(this.label), this.icon, t);
+    const t = this.options && this.options.length > 0, s = this.content || Xn(String(this.label), this.icon, t);
     return this.href ? new vt(
       {
         class: "flex flex-auto flex-row rounded-md transition-all overflow-x-hidden",
@@ -3804,7 +3804,7 @@ class lt extends S {
         exact: this.exact || !1
       },
       s
-    ) : new Kn({
+    ) : new Qn({
       class: "flex flex-auto flex-row rounded-md transition-all overflow-x-hidden",
       cache: "link",
       checkCallBack: this.checkCallBack
@@ -3822,10 +3822,10 @@ class lt extends S {
     this.link.update(t);
   }
 }
-const Xn = r(({ map: e }, t) => ee({ class: "navigation-group flex flex-col gap-2 list-none m-0 py-2 px-0", map: e }, [
+const Zn = r(({ map: e }, t) => ee({ class: "navigation-group flex flex-col gap-2 list-none m-0 py-2 px-0", map: e }, [
   qe({ class: "text-muted-foreground text-sm py-0 px-4 whitespace-nowrap" }, t)
 ]));
-class Zn extends S {
+class ea extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3874,7 +3874,7 @@ class Zn extends S {
    */
   addGroup(t) {
     const s = this.mapOptions(t.options);
-    return Xn({ map: s }, t.group);
+    return Zn({ map: s }, t.group);
   }
   /**
    * This will add a link.
@@ -3886,7 +3886,7 @@ class Zn extends S {
     return new lt(t);
   }
 }
-class rt extends Zn {
+class rt extends ea {
   onCreated() {
     this.links = [];
   }
@@ -3897,7 +3897,7 @@ class rt extends Zn {
    * @returns {object}
    */
   setupSubNav(t) {
-    return new sa(
+    return new na(
       {
         parentLink: t,
         options: t.options
@@ -3932,11 +3932,11 @@ class rt extends Zn {
     };
   }
 }
-const ea = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), ta = (e, t) => {
+const ta = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), sa = (e, t) => {
   const s = e.link.panel.pathname;
-  return !s && e.isSelected() ? !0 : e.exact ? t === s : ea(s, t);
+  return !s && e.isSelected() ? !0 : e.exact ? t === s : ta(s, t);
 };
-class sa extends rt {
+class na extends rt {
   /**
    * This will declare the props for the compiler.
    *
@@ -4018,27 +4018,27 @@ class sa extends rt {
   updateLinks(t) {
     let s = !1;
     for (const n of this.links)
-      if (n.rendered && (s = ta(n, t), s === !0))
+      if (n.rendered && (s = sa(n, t), s === !0))
         break;
     this.parentLink.update(s);
   }
 }
-const na = (e) => be({ class: "text-lg ml-2" }, e), aa = (e) => o({ class: "sticky flex flex-row items-center bg-popover lg:hidden top-0 z-10 border-0 border-b" }, [
+const aa = (e) => be({ class: "text-lg ml-2" }, e), oa = (e) => o({ class: "sticky flex flex-row items-center bg-popover lg:hidden top-0 z-10 border-0 border-b" }, [
   b({
     variant: "icon",
     class: "m-2",
     click: (t, { state: s }) => s.toggle("open"),
     icon: h.arrows.left
   }),
-  e.title && na(e.title)
-]), oa = () => o({
+  e.title && aa(e.title)
+]), la = () => o({
   class: `
 			absolute inset-0 bg-black/40 z-[-1] fadeIn
 			transition-opacity duration-200
 		`,
   click: (e, { state: t }) => t.open = !1
 });
-class la extends S {
+class ra extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -4057,7 +4057,7 @@ class la extends S {
       class: "fixed inset-0 z-50",
       style: "[[typeClass]]"
     }, [
-      oa(),
+      la(),
       // Popover Content
       o({
         class: `
@@ -4066,7 +4066,7 @@ class la extends S {
         dataSet: ["open", ["expanded", !0, "true"]]
       }, [
         o({ class: "flex flex-auto flex-col w-full h-full overflow-y-auto max-h-[85vh] rounded-md bg-popover border" }, [
-          aa({ title: this.title }),
+          oa({ title: this.title }),
           o({ class: "flex flex-auto flex-col" }, this.children)
         ])
       ])
@@ -4110,9 +4110,9 @@ const it = () => b({ class: "m-2", variant: "ghost", addState() {
   };
 }, click: (e, { state: t }) => t.toggle("open") }, [
   x({}, h.bar.three)
-]), ra = (e) => be({ class: "text-lg ml-2" }, e), ia = (e) => o({ class: "flex flex-auto flex-row items-center lg:hidden" }, [
+]), ia = (e) => be({ class: "text-lg ml-2" }, e), ca = (e) => o({ class: "flex flex-auto flex-row items-center lg:hidden" }, [
   it(),
-  e.title && ra(e.title)
+  e.title && ia(e.title)
 ]), ct = (e, t) => {
   e.forEach((s) => {
     if (s.options) {
@@ -4122,10 +4122,10 @@ const it = () => b({ class: "m-2", variant: "ghost", addState() {
     s.callBack = t;
   });
 }, dt = (e) => o({ class: "bg-background flex flex-auto flex-col w-full relative" }, [
-  M(
+  P(
     "open",
     (t) => t ? [
-      new la({ title: e.title }, [
+      new ra({ title: e.title }, [
         W(({ state: s }) => {
           const n = (a) => s.open = !1;
           return ct(e.options, n), new rt(
@@ -4137,23 +4137,23 @@ const it = () => b({ class: "m-2", variant: "ghost", addState() {
       ])
     ] : null
   )
-]), Fo = r((e) => o({ cache: "mobileNav", class: "inline-flex relative lg:hidden" }, [
+]), Lo = r((e) => o({ cache: "mobileNav", class: "inline-flex relative lg:hidden" }, [
   o([
     it(),
     dt(e)
   ])
-])), Lo = r((e) => o({ cache: "mobileNav", class: "flex flex-auto flex-col w-full relative lg:hidden" }, [
+])), Ao = r((e) => o({ cache: "mobileNav", class: "flex flex-auto flex-col w-full relative lg:hidden" }, [
   o({ class: "flex flex-auto flex-col w-full" }, [
-    ia(e),
+    ca(e),
     dt(e)
   ])
-])), Ao = r((e) => {
+])), Ro = r((e) => {
   const t = e.margin || "m-4 ml-0";
   return o({ class: `flex-none ${t}` }, [
     b({ variant: "back", class: "ghost", ...e })
   ]);
 });
-class ca extends S {
+class da extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -4254,7 +4254,7 @@ Xe.addType("dockableOverlay", (e) => {
   const t = e.component;
   t && t.rendered === !0 && t.state.docked === !1 && t.destroy();
 });
-class Ro extends ca {
+class jo extends da {
   /**
    * This will stop presistence.
    *
@@ -4359,7 +4359,7 @@ class Ro extends ca {
     this.state.docked = this.canDock();
   }
 }
-const da = r(({ index: e, click: t, state: s }, n) => pe({
+const ua = r(({ index: e, click: t, state: s }, n) => pe({
   class: "p-2 cursor-pointer hover:bg-muted/50",
   onState: [
     [s, "selectedIndex", {
@@ -4368,11 +4368,11 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
     }]
   ],
   click: () => t(e)
-}, n)), ua = r(({ selectOption: e, state: t }) => ee({
+}, n)), ha = r(({ selectOption: e, state: t }) => ee({
   class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, n) => da({ index: n, click: e, state: t }, s.label)]
-})), ha = r((e) => o({ class: "relative flex flex-auto items-center" }, [
-  N({
+  for: ["filteredOptions", (s, n) => ua({ index: n, click: e, state: t }, s.label)]
+})), fa = r((e) => o({ class: "relative flex flex-auto items-center" }, [
+  F({
     cache: "input",
     // @ts-ignore
     class: e.class ?? "",
@@ -4396,7 +4396,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
     // @ts-ignore
     x({ size: "sm" }, e.icon)
   ])
-])), fa = (e) => o({
+])), ga = (e) => o({
   class: "relative flex fle-auto flex-col",
   onState: ["open", (t, s, n) => {
     if (t)
@@ -4406,10 +4406,10 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
         button: n.input,
         size: "xl"
       }, [
-        ua(e)
+        ha(e)
       ]);
   }]
-}), jo = P(
+}), Eo = M(
   {
     /**
      * This will set up the data object.
@@ -4418,7 +4418,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
      */
     setData() {
       const e = this.options || [];
-      return new z({
+      return new O({
         options: e,
         filteredOptions: e
       });
@@ -4506,7 +4506,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
      */
     render() {
       return o({ class: "relative w-full max-w-md" }, [
-        ha({
+        fa({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -4518,7 +4518,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
           // @ts-ignore
           handleKeyDown: this.handleKeyDown.bind(this)
         }),
-        fa({
+        ga({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -4529,7 +4529,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
       ]);
     }
   }
-), Eo = r((e) => {
+), Ho = r((e) => {
   const t = e.icon ?? h.magnifyingGlass.default;
   return o({
     // @ts-ignore
@@ -4565,7 +4565,7 @@ const da = r(({ index: e, click: t, state: s }, n) => pe({
     })
   ]);
 });
-class ga extends S {
+class ma extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -4583,7 +4583,7 @@ class ga extends S {
     return o({ class: `${this.class || ""}` }, this.children);
   }
 }
-class ma extends ga {
+class ba extends ma {
   /**
    * This will be called every time the route
    * is activated.
@@ -4593,15 +4593,15 @@ class ma extends ga {
   update(t) {
   }
 }
-const ba = r((e, t) => (e.class = "basic-page pt-[80px] sm:pt-0 flex flex-auto flex-col " + (e.class || ""), {
+const xa = r((e, t) => (e.class = "basic-page pt-[80px] sm:pt-0 flex flex-auto flex-col " + (e.class || ""), {
   tag: "section",
   ...e,
   children: t
-})), xa = r(({ title: e, description: t }) => Z({ class: "sm:py-8 px-6 md:px-5 flex flex-col" }, [
+})), pa = r(({ title: e, description: t }) => Z({ class: "sm:py-8 px-6 md:px-5 flex flex-col" }, [
   wt({ class: "scroll-m-20 text-3xl font-bold tracking-tight" }, e),
   t && k({ class: "text-base text-muted-foreground py-2 max-w-[700px]" }, t)
 ]));
-class Ho extends ma {
+class _o extends ba {
   /**
    * This will declare the props for the compiler.
    *
@@ -4616,8 +4616,8 @@ class Ho extends ma {
    * @returns {object}
    */
   render() {
-    return ba([
-      xa({
+    return xa([
+      pa({
         title: this.title,
         description: this.description
       }),
@@ -4626,131 +4626,131 @@ class Ho extends ma {
   }
 }
 export {
-  ho as $,
-  ro as A,
-  Ao as B,
-  an as C,
+  fo as $,
+  io as A,
+  Ro as B,
+  on as C,
   ot as D,
-  go as E,
-  Po as F,
-  Ro as G,
-  So as H,
-  zo as I,
-  Ea as J,
-  Bo as K,
-  Ba as L,
-  Za as M,
-  Oa as N,
+  mo as E,
+  Bo as F,
+  jo as G,
+  $o as H,
+  Oo as I,
+  Ha as J,
+  zo as K,
+  za as L,
+  eo as M,
+  Na as N,
   se as O,
-  Fa as P,
-  Na as Q,
-  Ra as R,
-  za as S,
-  Aa as T,
-  La as U,
+  La as P,
+  Fa as Q,
+  ja as R,
+  Oa as S,
+  Ra as T,
+  Aa as U,
   st as V,
-  io as W,
-  uo as X,
-  co as Y,
-  ps as Z,
-  ms as _,
-  Bs as a,
-  Gn as a$,
-  jt as a0,
-  fs as a1,
-  gs as a2,
-  bs as a3,
+  co as W,
+  ho as X,
+  uo as Y,
+  ys as Z,
+  bs as _,
+  zs as a,
+  Kn as a$,
+  Et as a0,
+  gs as a1,
+  ms as a2,
+  xs as a3,
   R as a4,
-  Ho as a5,
-  Ln as a6,
-  Ja as a7,
+  _o as a5,
+  An as a6,
+  Xa as a7,
   ue as a8,
-  os as a9,
-  aa as aA,
-  no as aB,
-  _a as aC,
-  kn as aD,
-  eo as aE,
-  ao as aF,
-  oo as aG,
-  Oo as aH,
-  jo as aI,
-  ha as aJ,
-  to as aK,
-  Eo as aL,
-  mo as aM,
-  sa as aN,
+  ls as a9,
+  oa as aA,
+  ao as aB,
+  Ua as aC,
+  Cn as aD,
+  to as aE,
+  oo as aF,
+  lo as aG,
+  No as aH,
+  Eo as aI,
+  fa as aJ,
+  so as aK,
+  Ho as aL,
+  bo as aM,
+  na as aN,
   Se as aO,
-  ja as aP,
-  Ha as aQ,
-  yo as aR,
-  Ya as aS,
+  Ea as aP,
+  _a as aQ,
+  wo as aR,
+  Va as aS,
   Mo as aT,
-  ia as aU,
-  wo as aV,
-  Ia as aW,
-  lo as aX,
+  ca as aU,
+  vo as aV,
+  Ta as aW,
+  ro as aX,
   x as aY,
-  Qa as aZ,
-  No as a_,
-  vo as aa,
+  Ja as aZ,
+  Fo as a_,
+  ko as aa,
   rt as ab,
-  N as ac,
-  Rt as ad,
-  Pa as ae,
-  ko as af,
+  F as ac,
+  jt as ad,
+  Ba as ae,
+  Co as af,
   lt as ag,
-  ba as ah,
-  Me as ai,
-  _s as aj,
-  Fo as ak,
-  Lo as al,
-  sn as am,
-  Wa as an,
+  xa as ah,
+  Pe as ai,
+  Us as aj,
+  Lo as ak,
+  Ao as al,
+  nn as am,
+  qa as an,
   it as ao,
-  Kn as ap,
-  Zn as aq,
-  Xn as ar,
-  la as as,
-  po as at,
-  Ga as au,
-  ca as av,
-  ga as aw,
-  Ka as ax,
-  Us as ay,
+  Qn as ap,
+  ea as aq,
+  Zn as ar,
+  ra as as,
+  yo as at,
+  Ka as au,
+  da as av,
+  ma as aw,
+  Qa as ax,
+  Ys as ay,
   ne as az,
-  oa as b,
+  la as b,
   Ze as b0,
-  O as b1,
-  qa as b2,
-  Ws as b3,
-  hs as b4,
-  $a as b5,
-  Sa as b6,
-  B as b7,
-  xo as b8,
-  Da as c,
-  ma as d,
-  Co as e,
+  N as b1,
+  Ga as b2,
+  qs as b3,
+  fs as b4,
+  Da as b5,
+  $a as b6,
+  z as b7,
+  po as b8,
+  Ia as c,
+  ba as d,
+  So as e,
   b as f,
-  Xs as g,
-  At as h,
-  Vt as i,
-  Fn as j,
+  Zs as g,
+  Rt as h,
+  Wt as i,
+  Ln as j,
   Ma as k,
-  so as l,
-  Ta as m,
-  Xa as n,
-  bo as o,
-  $o as p,
-  Ys as q,
-  Do as r,
-  An as s,
-  Ua as t,
-  Io as u,
-  To as v,
-  Va as w,
+  no as l,
+  Pa as m,
+  Za as n,
+  xo as o,
+  Do as p,
+  Vs as q,
+  Io as r,
+  Rn as s,
+  Ya as t,
+  To as u,
+  Po as v,
+  Wa as w,
   ie as x,
-  en as y,
-  fo as z
+  tn as y,
+  go as z
 };