@base-framework/ui 1.2.24 → 1.2.26

package/dist/{full-page-Bpc7f0Jt.js → full-page-CbpTbpJf.js}

@@ -1,10 +1,10 @@
-import { I as V, Span as g, Button as w, OnState as T, Div as o, Legend as rt, Fieldset as it, H4 as Ue, P as k, Label as W, Checkbox as de, Input as p, Textarea as ct, UseParent as _, Img as ue, H5 as dt, H2 as Z, Form as ut, Header as X, Footer as he, A as Ye, H3 as fe, Nav as ge, Ul as ee, Li as me, OnStateOpen as be, On as J, Dialog as ht, Th as Ve, Thead as ft, Tr as gt, Table as xe, Time as mt, H1 as bt } from "@base-framework/atoms";
-import { Atom as r, Jot as M, Component as C, Html as xt, Data as z, Events as j, DateTime as te, NavLink as pt, router as ke, DataTracker as We } from "@base-framework/base";
-import { Icons as u } from "./icons.es.js";
-import { Timer as yt, TableBody as wt, DataTableBody as vt, ScrollableTableBody as kt, List as Ct } from "@base-framework/organisms";
-import { F as U } from "./format-DE4rFWuD.js";
-import { F as St } from "./bside-template-C7AQgQ6H.js";
-const $t = {
+import { I as j, Span as u, Button as w, OnState as M, Div as o, Legend as ht, Fieldset as ft, H4 as We, P as k, Label as E, Checkbox as he, Input as p, Textarea as qe, UseParent as V, Img as fe, H5 as gt, H2 as J, Form as mt, Header as X, Footer as ge, A as Ge, H3 as me, Nav as be, Ul as Z, Li as xe, OnStateOpen as pe, On as Q, Dialog as bt, Th as Ke, Thead as xt, Tr as pt, Table as ye, Time as yt, H1 as wt } from "@base-framework/atoms";
+import { Atom as r, Jot as P, Component as S, Html as Qe, Data as z, Events as R, DateTime as ee, NavLink as vt, router as De, DataTracker as Je } 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 _ } from "./format-DE4rFWuD.js";
+import { F as It } from "./bside-template-C7AQgQ6H.js";
+const Tt = {
   xs: "w-4 h-4",
   sm: "w-6 h-6",
   md: "w-8 h-8",
@@ -12,15 +12,15 @@ const $t = {
   xl: "w-12 h-12",
   "2xl": "w-14 h-14",
   "3xl": "w-16 h-16"
-}, ce = r((e, t) => {
-  const s = $t[e.size || "sm"];
-  return V({
+}, de = r((e, t) => {
+  const s = Tt[e.size || "sm"];
+  return j({
     ...e,
     // @ts-ignore
     class: `stroke-current icon-size ${s} ${e.class || ""}`,
     html: t[0]?.textContent
   });
-}), Ce = {
+}), Ie = {
   xs: "w-4 h-4",
   // 16px - matches Icon
   sm: "w-6 h-6",
@@ -35,7 +35,7 @@ const $t = {
   // 56px - matches Icon
   "3xl": "w-16 h-16"
   // 64px - matches Icon
-}, Se = {
+}, Te = {
   xs: "16px",
   sm: "24px",
   md: "32px",
@@ -43,14 +43,14 @@ const $t = {
   xl: "48px",
   "2xl": "56px",
   "3xl": "64px"
-}, $e = {
+}, Me = {
   outlined: "material-symbols-outlined",
   filled: "material-symbols-filled",
   rounded: "material-symbols-rounded",
   sharp: "material-symbols-sharp"
-}, De = r((e) => {
-  const t = e.size || "sm", s = e.variant || "outlined", n = Ce[t] || Ce.sm, a = Se[t] || Se.sm, l = $e[s] || $e.outlined;
-  return g({
+}, Pe = r((e) => {
+  const t = e.size || "sm", s = e.variant || "outlined", n = Ie[t] || Ie.sm, a = Te[t] || Te.sm, l = Me[s] || Me.outlined;
+  return u({
     ...e,
     // @ts-ignore
     class: `inline-flex items-center justify-center ${l} ${n} ${e.class || ""}`,
@@ -62,14 +62,14 @@ const $t = {
     name: void 0
     // @ts-ignore
   }, e.name);
-}), x = (e = {}, t) => t ? typeof t == "string" && t.includes("<svg") ? ce(e, t) : typeof t == "object" && t.name ? De({
+}), x = (e = {}, t) => t ? typeof t == "string" && t.includes("<svg") ? de(e, t) : typeof t == "object" && t.name ? Pe({
   ...e,
   name: t.name,
   variant: t.variant || e.variant || "outlined"
-}) : typeof t == "string" ? De({
+}) : typeof t == "string" ? Pe({
   ...e,
   name: t
-}) : ce(e, t) : null, ha = (e) => e ? !!(typeof e == "object" && e.name || typeof e == "string" && !e.includes("<svg")) : !1, fa = (e) => typeof e == "string" && e.includes("<svg"), Ie = {
+}) : de(e, t) : null, Da = (e) => e ? !!(typeof e == "object" && e.name || typeof e == "string" && !e.includes("<svg")) : !1, Ia = (e) => typeof e == "string" && e.includes("<svg"), Be = {
   gray: {
     backgroundColor: "bg-gray-50",
     textColor: "text-gray-600",
@@ -150,17 +150,17 @@ const $t = {
     textColor: "text-foreground",
     ringColor: "ring-white/10"
   }
-}, Dt = (e) => Ie[e] || Ie.gray, It = (e, t = {}) => {
-  const s = Dt(e), n = t.backgroundColor ?? s.backgroundColor, a = t.textColor ?? s.textColor, l = t.ringColor ?? s.ringColor;
+}, Mt = (e) => Be[e] || Be.gray, Pt = (e, t = {}) => {
+  const s = Mt(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}`;
-}, ga = r((e, t) => {
-  const { type: s, icon: n, size: a = "xs", backgroundColor: l, textColor: i, ringColor: c, ...h } = e, m = It(s, { backgroundColor: l, textColor: i, ringColor: c });
-  return g({ ...h, class: m }, [
+}, Ta = 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 });
+  return u({ ...f, class: m }, [
     n ? x({ size: a, class: "mr-1" }, n) : null,
     ...t || []
   ]);
 });
-class _e extends C {
+class Xe extends S {
   /**
    * This will set the component context.
    *
@@ -176,9 +176,9 @@ class _e extends C {
 }
 const O = (e) => (
   /** @type {VeilComponentConstructor} */
-  M(e, _e)
+  P(e, Xe)
 );
-class ma extends _e {
+class Ma extends Xe {
   /**
    * Declare public props and their defaults.
    */
@@ -212,16 +212,16 @@ class ma extends _e {
     const t = this.size, s = this.icon, n = this.activeIcon || this.icon, a = (() => {
       if (this.dataKey) {
         let l = `[[${this.dataKey}]]`;
-        return this.formatType === "number" ? l = U.number(l, "0") : this.formatType === "money" ? l = U.roundMoney(l) : this.formatType === "date" ? l = U.date(l) : this.formatType === "percent" && (l = U.percentage(l)), g({ class: "toggle-btn-value text-sm tabular-nums capitalize" }, l);
+        return this.formatType === "number" ? l = _.number(l, "0") : this.formatType === "money" ? l = _.roundMoney(l) : this.formatType === "date" ? l = _.date(l) : this.formatType === "percent" && (l = _.percentage(l)), u({ class: "toggle-btn-value text-sm tabular-nums capitalize" }, l);
       }
-      return this.value !== null && this.value !== void 0 ? g({ class: "toggle-btn-value text-sm tabular-nums" }, String(this.value)) : null;
+      return this.value !== null && this.value !== void 0 ? u({ class: "toggle-btn-value text-sm tabular-nums" }, String(this.value)) : null;
     })();
     return w({
       click: () => this.handleToggle(),
       // @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 || ""}`
     }, [
-      T(
+      M(
         "active",
         (l) => x({ size: t }, l ? n : s)
       ),
@@ -237,7 +237,7 @@ const ae = {
   xl: "w-14 h-14",
   "2xl": "w-16 h-16"
 };
-class ba extends C {
+class Pa extends S {
   /**
    * Declare public props.
    */
@@ -268,13 +268,13 @@ class ba extends C {
    * @returns {object}
    */
   render() {
-    const t = this.icon, s = this.activeIcon || this.icon, n = ae[this.size] || ae.md, a = ["xs", "sm"].includes(this.size) ? "xs" : "sm", l = this.class ?? "bg-background/40 backdrop-blur-sm", i = "text-foreground", c = this.activeClass || i, h = this.circle ?? !1;
+    const t = this.icon, s = this.activeIcon || this.icon, n = ae[this.size] || ae.md, a = ["xs", "sm"].includes(this.size) ? "xs" : "sm", l = this.class ?? "bg-background/40 backdrop-blur-sm", i = "text-foreground", c = this.activeClass || i, f = this.circle ?? !1;
     return w({
       click: () => this.handleToggle(),
       // @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}${h ? " rounded-full w-[40px] h-[40px] max-w-[40px]" : ""}`
+      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]" : ""}`
     }, [
-      T("active", (m) => [
+      M("active", (m) => [
         x({
           size: a,
           class: `transition-colors ${m ? c : i}`
@@ -283,7 +283,7 @@ class ba extends C {
     ]);
   }
 }
-const xa = r((e, t) => {
+const Ba = r((e, t) => {
   const s = e.size || "md", n = ae[s] || ae.md, a = ["xs", "sm"].includes(s) ? "xs" : "sm";
   return w({
     ...e,
@@ -295,42 +295,34 @@ const xa = r((e, t) => {
     ...t || []
   ]);
 });
-let qe = 0;
-const Y = /* @__PURE__ */ new Map(), Tt = () => {
+let oe = 0;
+const ue = /* @__PURE__ */ new Map(), Bt = () => {
   const e = globalThis.location?.hash || "";
-  return (e ? e.replace(/^#\/?/, "") : globalThis.location?.pathname || "/").replace(/^\/+/, "");
-};
+  return (e ? e.replace(/^#\/?/, "") : globalThis.location?.pathname || "/").replace(/^\/+/, "").replace(/\/+$/, "");
+}, zt = (e, t) => t ? e === t || e.startsWith(t + "/") : !1;
 if (typeof globalThis.history?.pushState == "function") {
   const e = globalThis.history.pushState;
   globalThis.history.pushState = function(...t) {
-    qe++;
-    const s = String(t[2] || "").replace(/^[#/]+/, "");
-    for (const [n, a] of Y)
-      a.basePath && s !== a.basePath && !s.startsWith(a.basePath + "/") && Y.delete(n);
-    return e.apply(this, t);
+    return oe++, e.apply(this, t);
   };
 }
-const Ge = (e) => {
-  const t = e || "";
-  if (Y.has(t))
-    return (
-      /** @type {{ historyLength: number, pushCount: number, basePath: string }} */
-      Y.get(t)
-    );
-  const s = {
-    historyLength: globalThis.history.length,
-    pushCount: qe,
-    basePath: Tt()
+const Ze = (e) => {
+  const t = e || "", s = Bt(), n = ue.get(t);
+  if (n && zt(s, n.basePath))
+    return n;
+  const a = {
+    pushCount: oe,
+    basePath: s
   };
-  return Y.set(t, s), s;
-}, Ke = (e) => {
-  Y.delete(e || "");
-}, F = (e) => r((t, s) => w({
+  return ue.set(t, a), a;
+}, et = (e) => {
+  ue.delete(e || "");
+}, L = (e) => r((t, s) => w({
   ...e,
   ...t,
   // @ts-ignore
   class: `bttn ${e.class} ${t.class || ""}`
-}, s)), pe = r(
+}, s)), we = r(
   (e, t) => w({
     ...e,
     // @ts-ignore
@@ -342,40 +334,40 @@ const Ge = (e) => {
     // @ts-ignore
     e.icon && e.position === "right" ? x({ size: e.size || "sm", class: e.animation ?? null }, e.icon) : null
   ])
-), Te = (e) => r((t, s) => pe({
+), ze = (e) => r((t, s) => we({
   ...e,
   ...t,
   // @ts-ignore
   class: `bttn ${e.class} ${t.class || ""}`
-}, s)), Mt = (e) => {
-  const t = Ge(e.backUrl);
+}, s)), Ot = (e) => {
+  const t = Ze(e.backUrl);
   return () => {
-    Ke(e.backUrl);
-    const n = globalThis.history.length - t.historyLength + 1;
+    et(e.backUrl);
+    const n = oe - t.pushCount + 1;
     if (e.allowHistory === !0 && t.pushCount > 0) {
       globalThis.history.go(-n);
       return;
     }
     e.backUrl && app.navigate(e.backUrl);
   };
-}, Pt = (e) => r((t, s) => (t.icon = t.icon || u.arrows.left, t.click = t.click || Mt(t), pe({
+}, Nt = (e) => r((t, s) => (t.icon = t.icon || h.arrows.left, t.click = t.click || Ot(t), we({
   ...e,
   ...t
-}, s))), Bt = (e) => {
-  const t = Ge(e.backUrl);
+}, s))), Ft = (e) => {
+  const t = Ze(e.backUrl);
   return () => {
-    Ke(e.backUrl);
-    const n = globalThis.history.length - t.historyLength + 1;
+    et(e.backUrl);
+    const n = oe - t.pushCount + 1;
     if (t.pushCount > 0) {
       globalThis.history.go(-n);
       return;
     }
     e.backUrl && app.navigate(e.backUrl);
   };
-}, zt = (e) => r((t, s) => (t.icon = t.icon || u.arrows.left, t.click = t.click || Bt(t), pe({
+}, Lt = (e) => r((t, s) => (t.icon = t.icon || h.arrows.left, t.click = t.click || Ft(t), we({
   ...e,
   ...t
-}, s))), Ot = r((e, t) => {
+}, s))), At = r((e, t) => {
   const s = e.size || "md", n = {
     xs: "w-6 h-6",
     sm: "w-8 h-8",
@@ -392,42 +384,42 @@ const Ge = (e) => {
     e.icon ? x({ size: s === "xs" ? "xs" : "sm" }, e.icon) : null,
     ...t || []
   ]);
-}), Me = {
-  primary: F({ class: "primary" }),
-  secondary: F({ class: "secondary" }),
-  destructive: F({ class: "destructive" }),
-  warning: F({ class: "warning" }),
-  outline: F({ class: "outline" }),
-  ghost: F({ class: "ghost" }),
-  link: F({ class: "link" }),
-  icon: Te({ class: "icon" }),
-  withIcon: Te({ class: "with-icon" }),
-  back: Pt({ class: "with-icon back-button" }),
-  smartBack: zt({ class: "with-icon back-button" }),
-  circleIcon: Ot
-}, b = r((e, t) => (Me[e.variant] || Me.primary)(e, t)), pa = r((e, t) => b({ ...e, variant: "withIcon", icon: u.loading, animation: "animate-spin" }, t)), Nt = r((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" }),
+  icon: ze({ class: "icon" }),
+  withIcon: ze({ class: "with-icon" }),
+  back: Nt({ class: "with-icon back-button" }),
+  smartBack: Lt({ class: "with-icon back-button" }),
+  circleIcon: At
+}, b = r((e, t) => (Oe[e.variant] || Oe.primary)(e, t)), za = 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) => rt({
+}), jt = r((e, t) => ht({
   ...e,
   // @ts-ignore
   class: ` font-medium -mt-4 -mx-1 px-2 py-2 ${e.class || ""}`
-}, t)), ya = r((e, t) => {
+}, t)), Oa = r((e, t) => {
   const s = e.border === "full" ? "border rounded-md" : "border-t";
-  return it({
+  return ft({
     ...e,
     // @ts-ignore
     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)
   ]);
-}), Ft = r((e, t) => {
+}), Et = r((e, t) => {
   const s = e.border === !0 ? "border-t" : "";
   return o({
     ...e,
@@ -442,14 +434,14 @@ const Ge = (e) => {
       class: `flex flex-auto flex-col gap-y-1 ${e.labelProps?.class || ""}`
     }, [
       // @ts-ignore
-      Ue({ class: "text-base" }, e.label),
+      We({ class: "text-base" }, e.label),
       // @ts-ignore
       e.description && k({ class: "text-sm text-muted-foreground" }, e.description)
     ]),
     // Controls container: grows to fill remaining space, spacing between items
     o({ class: "flex flex-col gap-y-4" }, t)
   ]);
-}), Lt = "flex h-10 w-full px-3 py-2 text-sm", P = "rounded-md border border-border bg-input", I = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background", D = "disabled:cursor-not-allowed disabled:opacity-50 [&:user-invalid]:border-destructive", A = "placeholder:text-muted-foreground", ye = `${Lt} ${P} ${I} ${A} ${D}`, jt = ({ id: e, checked: t, bind: s, required: n }) => de({
+}), 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", H = "placeholder:text-muted-foreground", ve = `${Ht} ${D} ${$} ${H} ${C}`, Ut = ({ id: e, checked: t, bind: s, required: n }) => he({
   id: e,
   cache: "checkbox",
   class: "absolute opacity-0 w-full h-full cursor-pointer pointer-events-none",
@@ -459,19 +451,19 @@ const Ge = (e) => {
   required: n,
   checked: t,
   bind: s
-}), At = () => g({ class: "absolute text-xs pointer-events-none" }, [
-  T(
+}), Yt = () => u({ class: "absolute text-xs pointer-events-none" }, [
+  M(
     "checked",
-    (e) => e ? V({
+    (e) => e ? j({
       class: "w-2 h-2 pointer-events-none",
-      html: u.check
+      html: h.check
     }) : null
   )
-]), Ht = ({ id: e, bind: t, checked: s, required: n, clickHandler: a }) => o({
+]), _t = ({ 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
-			${I}
-			${D}`.trim(),
+			${$}
+			${C}`.trim(),
   onState: [
     "checked",
     {
@@ -487,13 +479,13 @@ const Ge = (e) => {
   tabIndex: 0,
   click: a
 }, [
-  jt({ bind: t, checked: s, id: e, required: n }),
-  At()
-]), Et = ({ id: e, label: t, clickHandler: s }) => W({
+  Ut({ bind: t, checked: s, id: e, required: n }),
+  Yt()
+]), Vt = ({ id: e, label: t, clickHandler: s }) => E({
   class: "text-base cursor-pointer",
   htmlFor: e,
   click: s
-}, t), Ut = M(
+}, t), Wt = P(
   {
     /**
      * This will initialize the state of the checkbox.
@@ -532,7 +524,7 @@ const Ge = (e) => {
     render() {
       const e = this.getId(), t = (s) => this.clickHandler(s);
       return o({ class: `flex items-center gap-x-2 cursor-pointer ${this.class || ""}` }, [
-        Ht({
+        _t({
           id: e,
           // @ts-ignore
           bind: this.bind,
@@ -544,22 +536,154 @@ const Ge = (e) => {
           clickHandler: t
         }),
         // @ts-ignore
-        this.label && Et({ id: e, label: this.label, clickHandler: t })
+        this.label && Vt({ id: e, label: this.label, clickHandler: t })
       ]);
     }
   }
-), Yt = (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;
-}, Vt = (e) => {
-  const t = e.target, s = Yt(t.value);
+}, Gt = (e) => {
+  const t = e.target, s = qt(t.value);
+  s && (t.value = s);
+}, Kt = [
+  "peer w-full h-14 px-3 pt-5 pb-1",
+  "text-base text-foreground",
+  D,
+  $,
+  C,
+  "placeholder-transparent"
+].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(" "), Jt = [
+  "peer w-full h-14 px-3 pt-5 pb-1 pr-10",
+  "text-base text-foreground appearance-none",
+  D,
+  $,
+  C
+].join(" "), Xt = [
+  "absolute left-3",
+  "text-muted-foreground",
+  "transition-all duration-200",
+  "pointer-events-none select-none",
+  // Floated state (default — input has a value or is focused)
+  "top-2 text-xs",
+  // Centered / placeholder state (empty + not focused)
+  "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(" "), Zt = [
+  "absolute left-3",
+  "text-muted-foreground",
+  "transition-all duration-200",
+  "pointer-events-none select-none",
+  // Floated state
+  "top-1 text-xs",
+  // Placeholder state (empty + not focused)
+  "peer-[:placeholder-shown:not(:focus)]:top-3.5",
+  "peer-[:placeholder-shown:not(:focus)]:text-base"
+].join(" "), es = [
+  "absolute left-3 top-2",
+  "text-xs text-muted-foreground",
+  "pointer-events-none select-none"
+].join(" ");
+let ts = 0;
+const ke = (e) => e.id || e.name || `floating-${++ts}`, Ce = (e, t, s, n) => e ? E(
+  { htmlFor: s, class: n },
+  t ? [u(e), u({ class: "text-destructive ml-0.5" }, "*")] : e
+) : null, ss = () => j({
+  class: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none w-4 h-4 text-muted-foreground",
+  html: h.chevron.single.down
+}), te = r((e) => {
+  const t = ke(e);
+  return o({ class: "relative" }, [
+    p({
+      ...e,
+      id: t,
+      placeholder: " ",
+      class: `${Kt} ${e.class || ""}`.trim()
+    }),
+    Ce(e.label, e.required, t, Xt)
+  ]);
+}), Na = r(
+  (e) => te({
+    ...e,
+    type: "tel",
+    name: e.name || "Phone",
+    label: e.label || "Phone",
+    pattern: e.pattern || "\\(\\d{3}\\) \\d{3}-\\d{4}",
+    keyup: Gt
+  })
+), Fa = r(
+  (e) => te({
+    ...e,
+    type: "email",
+    name: e.name || "Email",
+    label: e.label || "Email"
+  })
+), La = r(
+  (e) => te({
+    ...e,
+    type: "password",
+    name: e.name || "Password",
+    label: e.label || "Password"
+  })
+), Aa = r(
+  (e) => te({
+    ...e,
+    type: "number"
+  })
+), Ra = r(
+  (e) => te({
+    ...e,
+    type: "url",
+    name: e.name || "Url",
+    label: e.label || "URL"
+  })
+), ja = r((e) => {
+  const t = ke(e);
+  return o({ class: "relative" }, [
+    qe({
+      ...e,
+      id: t,
+      placeholder: " ",
+      class: `${Qt} ${e.class || ""}`.trim()
+    }),
+    Ce(e.label, e.required, t, Zt)
+  ]);
+}), Ea = r((e) => {
+  const t = ke(e);
+  return o({ class: "relative" }, [
+    {
+      tag: "select",
+      ...e,
+      id: t,
+      class: `${Jt} ${e.class || ""}`.trim(),
+      onCreated(s) {
+        e.options && Qe.setupSelectOptions(s, e.options), typeof e.onCreated == "function" && e.onCreated(s);
+      }
+    },
+    ss(),
+    Ce(e.label, e.required, t, es)
+  ]);
+}), 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;
+}, as = (e) => {
+  const t = e.target, s = ns(t.value);
   s && (t.value = s);
 }, N = r((e) => p({
   ...e,
   // @ts-ignore
-  class: `${ye} ${e.class || ""}`.trim()
-})), wa = r((e) => N({
+  class: `${ve} ${e.class || ""}`.trim()
+})), Ha = r((e) => N({
   ...e,
   type: "tel",
   // @ts-ignore
@@ -569,8 +693,8 @@ const Ge = (e) => {
   placeholder: "(555) 555-5555",
   // @ts-ignore
   pattern: e.pattern || "\\(\\d{3}\\) \\d{3}-\\d{4}",
-  keyup: Vt
-})), va = r((e) => N({
+  keyup: as
+})), Ua = r((e) => N({
   ...e,
   type: "email",
   // @ts-ignore
@@ -578,47 +702,47 @@ const Ge = (e) => {
   // @ts-ignore
   label: e.label || "Email",
   placeholder: "Email address"
-})), ka = r((e) => ct({
+})), Ya = r((e) => qe({
   ...e,
   as: "textarea",
   // @ts-ignore
-  class: `flex w-full h-24 px-3 py-2 text-sm ${P} ${I} ${A} ${D} ${e.class || ""}`.trim()
-})), Ca = (e = {}) => o({ class: "flex items-center gap-x-2" }, [
+  class: `flex w-full h-24 px-3 py-2 text-sm ${D} ${$} ${H} ${C} ${e.class || ""}`.trim()
+})), _a = (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 && W({ forHTML: e.value, class: "cursor-pointer" }, e.label)
-]), Sa = r((e) => p({
+  e.label && E({ forHTML: e.value, class: "cursor-pointer" }, e.label)
+]), Va = r((e) => p({
   ...e,
   type: "date",
   // @ts-ignore
-  class: `${P} ${I} ${A} ${D} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), $a = r((e) => p({
+  class: `${D} ${$} ${H} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
+})), Wa = r((e) => p({
   ...e,
   type: "time",
   // @ts-ignore
-  class: `${P} ${I} ${A} ${D} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Da = r((e) => p({
+  class: `${D} ${$} ${H} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
+})), qa = r((e) => p({
   ...e,
   type: "datetime-local",
   // @ts-ignore
-  class: `${P} ${I} ${A} ${D} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Ia = r((e) => p({
+  class: `${D} ${$} ${H} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
+})), Ga = r((e) => p({
   ...e,
   type: "month",
   // @ts-ignore
-  class: `${P} ${I} ${A} ${D} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Ta = r((e) => p({
+  class: `${D} ${$} ${H} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
+})), Ka = r((e) => p({
   ...e,
   type: "week",
   // @ts-ignore
-  class: `${P} ${I} ${A} ${D} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
-})), Ma = r((e) => N({
+  class: `${D} ${$} ${H} ${C} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
+})), Qa = r((e) => N({
   ...e,
   type: "number"
-})), Pa = r((e) => N({
+})), Ja = r((e) => N({
   ...e,
   type: "password"
 }));
@@ -626,29 +750,29 @@ r((e) => N({
   ...e,
   type: "search"
 }));
-const Ba = r((e) => N({
+const Xa = r((e) => N({
   ...e,
   type: "url"
-})), za = r((e) => N({
+})), Za = r((e) => N({
   ...e,
   type: "hidden"
-})), Oa = r((e) => p({
+})), eo = r((e) => p({
   ...e,
   type: "color",
   // @ts-ignore
-  class: `${P} text-foreground p-0 ${D} ${e.class || ""}`.trim()
+  class: `${D} text-foreground p-0 ${C} ${e.class || ""}`.trim()
 }));
-r((e) => de({
+r((e) => he({
   ...e,
   // @ts-ignore
-  class: `flex h-4 w-4 text-foreground ${P} ${I} ${D} ${e.class || ""}`.trim()
+  class: `flex h-4 w-4 text-foreground ${D} ${$} ${C} ${e.class || ""}`.trim()
 }));
-const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", Na = r((e) => p({
+const os = "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", to = r((e) => p({
   ...e,
   type: "file",
   // @ts-ignore
-  class: `${ye} ${Wt} ${e.class || ""}`.trim()
-})), Ra = O(
+  class: `${ve} ${os} ${e.class || ""}`.trim()
+})), so = O(
   {
     /**
      * This will create the initial state of the RangeSlider.
@@ -681,7 +805,7 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
       return o({ class: "relative w-full h-4 flex items-center" }, [
         // Track
         o({ class: "absolute h-2 w-full rounded-full bg-muted" }),
-        _(({ state: e }) => [
+        V(({ state: e }) => [
           // Filled Track
           o({
             class: "absolute h-2 bg-primary rounded-full",
@@ -706,8 +830,8 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
             // Incorporate your new classes here
             class: `
 						absolute w-full h-full opacity-0 cursor-pointer
-						${I}
-						${D}
+						${$}
+						${C}
 						${this.class || ""}
 					`.trim(),
             bind: this.bind,
@@ -720,15 +844,15 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
       ]);
     }
   }
-), Fa = r((e) => ({
+), no = r((e) => ({
   tag: "select",
   onCreated(t) {
-    e.options && xt.setupSelectOptions(t, e.options);
+    e.options && Qe.setupSelectOptions(t, e.options);
   },
   ...e,
   // @ts-ignore
-  class: `${ye} ${e.class || ""}`.trim()
-})), _t = r(({ src: e, alt: t, class: s, checkPath: n = !0 }) => !e || (s = s || "", n && e.indexOf(".") === -1 && e.indexOf("[[") === -1) ? null : ue({
+  class: `${ve} ${e.class || ""}`.trim()
+})), ls = r(({ src: e, alt: t, class: s, checkPath: n = !0 }) => !e || (s = s || "", n && e.indexOf(".") === -1 && e.indexOf("[[") === -1) ? null : fe({
   class: `absolute w-full h-full object-cover fadeIn ${s}`,
   src: e,
   alt: t,
@@ -737,7 +861,7 @@ const Wt = "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"
-})), qt = (e) => !e || isNaN(e) ? null : e, Pe = (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 -->
@@ -780,20 +904,20 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     class: "circle-graph text-inherit",
     html: i
   });
-}, La = r((e) => {
-  const t = e.progress || 0, s = e.class || "", n = Pe(t, s);
+}, ao = 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 = qt(a), a ? Pe(a, s) : n)
+      (a) => (a = rs(a), a ? Ne(a, s) : n)
     ]
   }, [n]);
-}), Gt = () => _(({ state: e }) => o({
+}), is = () => V(({ state: e }) => o({
   class: "absolute h-full rounded-full bg-primary transition-all duration-300",
   style: ["width: [[progress]]%;", e]
-})), ja = O(
+})), oo = O(
   {
     /**
      * This will render the progress bar component.
@@ -802,7 +926,7 @@ const Wt = "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" }, [
-        Gt()
+        is()
       ]);
     },
     /**
@@ -845,7 +969,7 @@ const Wt = "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;
     }
   }
-), Aa = r((e = {}) => {
+), lo = r((e = {}) => {
   const {
     class: t = "",
     background: s = !0,
@@ -854,7 +978,7 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     blurClass: l = "backdrop-blur",
     zIndexClass: i = "z-9999",
     style: c = ""
-  } = e, h = [
+  } = e, f = [
     "sticky bottom-0 left-0 right-0 w-full",
     i,
     s ? a : "",
@@ -862,11 +986,11 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     t
   ].filter(Boolean).join(" "), m = `height: env(safe-area-inset-bottom, 0px);${c ? ` ${c}` : ""}`;
   return o({
-    class: h,
+    class: f,
     style: m,
     "aria-hidden": "true"
   });
-}), Ha = r((e = {}) => {
+}), ro = r((e = {}) => {
   const {
     class: t = "",
     background: s = !0,
@@ -875,7 +999,7 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     blurClass: l = "backdrop-blur",
     zIndexClass: i = "z-9999",
     style: c = ""
-  } = e, h = [
+  } = e, f = [
     "fixed top-0 left-0 right-0 w-full",
     i,
     s ? a : "",
@@ -883,11 +1007,11 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     t
   ].filter(Boolean).join(" "), m = `height: env(safe-area-inset-top, 0px);${c ? ` ${c}` : ""}`;
   return o({
-    class: h,
+    class: f,
     style: m,
     "aria-hidden": "true"
   });
-}), Be = {
+}), Fe = {
   top: "bottom-full left-1/2 transform -translate-x-1/2 mb-2",
   "top-right": "bottom-full left-full transform -translate-x-1 mb-2",
   "top-left": "bottom-full right-full transform translate-x-1 mb-2",
@@ -896,19 +1020,19 @@ const Wt = "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"
-}, Kt = (e) => Be[String(e)] || Be.top, Ea = r(({ position: e = "top", content: t }, s) => {
-  const n = Kt(e);
+}, cs = (e) => Fe[String(e)] || Fe.top, io = 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
-    g({
+    u({
       class: `
 				absolute z-20 px-2 py-1 border text-sm bg-background rounded shadow-md opacity-0 whitespace-nowrap
 				group-hover:opacity-100 transition-opacity duration-200 ${n} pointer-events-none
 			`
     }, t)
   ]);
-}), ze = {
+}), Le = {
   info: {
     borderColor: "border-blue-500",
     bgColor: "bg-muted/10",
@@ -934,25 +1058,25 @@ const Wt = "file:border-0 file:bg-transparent file:text-sm file:font-medium file
     bgColor: "bg-muted/10",
     iconColor: "text-muted-foreground"
   }
-}, Qt = (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)
-]), Jt = (e) => dt({ class: "font-semibold" }, e), Zt = (e) => k({ class: "text-sm text-muted-foreground" }, e), Ua = r(({ title: e, description: t, icon: s, type: n = "default" }) => {
-  const { borderColor: a, bgColor: l, iconColor: i } = ze[n] || ze.default;
+]), us = (e) => gt({ class: "font-semibold" }, e), hs = (e) => k({ class: "text-sm text-muted-foreground" }, e), co = 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 && Qt(s, i),
+    s && ds(s, i),
     o({ class: "flex flex-col" }, [
-      Jt(e),
-      Zt(t)
+      us(e),
+      hs(t)
     ])
   ]);
-}), Xt = (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, h = s.bottom + i;
+  let c = s.left + l, f = s.bottom + i;
   const m = globalThis.innerHeight - s.bottom, v = s.top;
-  return c + n.width > globalThis.innerWidth && (c = globalThis.innerWidth - n.width - a), m < n.height && v > m ? h = s.top + i - n.height - a : m < n.height && (h = s.bottom + i - (n.height - m) - a), { x: c, y: h };
+  return c + n.width > globalThis.innerWidth && (c = globalThis.innerWidth - n.width - a), m < n.height && v > m ? f = s.top + i - n.height - a : m < n.height && (f = s.bottom + i - (n.height - m) - a), { x: c, y: f };
 };
-class se extends C {
+class se extends S {
   /**
    * This will set up the data.
    *
@@ -1029,7 +1153,7 @@ class se extends C {
    * @returns {void}
    */
   updatePosition() {
-    const t = this.button ?? null, s = this.panel, n = Xt(t, s);
+    const t = this.button ?? null, s = this.panel, n = fs(t, s);
     this.data.position = n;
   }
   /**
@@ -1081,29 +1205,29 @@ class se extends C {
     this?.panel?.hidePopover();
   }
 }
-const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t)), ts = r((e, t) => W({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), ss = r((e, t) => k({ ...e, class: "text-sm text-muted-foreground italic" }, t)), ns = r((e, t) => k({ ...e, class: "text-sm text-destructive" }, t)), Ya = r((e, t = []) => Nt({ 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) => E({ ...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)), uo = r((e, t = []) => Rt({ class: "flex flex-auto flex-col gap-y-0", margin: "m-0", padding: "p-0" }, [
   // @ts-ignore
-  e.title && Z({ class: "text-lg font-semibold py-4 px-6" }, e.title),
+  e.title && J({ 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
-])), Va = r((e, t = []) => (
+])), ho = r((e, t = []) => (
   // @ts-ignore
-  Ft({ 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)
   ])
-)), Wa = r((e, t = []) => {
+)), fo = 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);
-}), as = (e) => e.tag === "input" || e.tag === "select" || e.tag === "textarea", Qe = (e, t, s) => e.map((n) => !n || (n.children && n.children.length > 0 && (n.children = Qe(n.children, t, s)), !n.required) ? n : as(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), os = r((e, t) => {
-  const a = Qe(t, (l) => {
+} : n), ys = r((e, t) => {
+  const a = tt(t, (l) => {
     l.target.checkValidity() && e.setError(null);
   }, (l) => {
     e.setError(l.target.validationMessage);
@@ -1112,7 +1236,7 @@ const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
     ...e,
     class: "w-full"
   }, a);
-}), _a = O(
+}), go = O(
   {
     /**
      * The initial state of the FormField.
@@ -1137,47 +1261,47 @@ const es = 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" }, [
-        es([
-          ts({ htmlFor: t }, s),
-          os({
+        gs([
+          ms({ htmlFor: t }, s),
+          ys({
             id: t,
             name: e,
             value: this.state.value,
             setError: a
           }, this.children),
-          n && ss({ id: this.getId("description") }, n),
-          o({ onState: ["error", (l) => l && ns(l)] })
+          n && bs({ id: this.getId("description") }, n),
+          o({ onState: ["error", (l) => l && xs(l)] })
         ])
       ]);
     }
   }
-), ls = (e, t, s = null) => {
+), ws = (e, t, s = null) => {
   e.target.checkValidity() && (e.preventDefault(), s && s(e, t));
-}, Je = r(
+}, st = r(
   (e, t) => (
     // @ts-ignore
-    ut({ ...e, submit: (s, n) => ls(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)
   )
-), qa = r((e, t) => (
+), mo = 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)
-)), Ga = r((e, t = []) => o({ class: "flex flex-col gap-y-3 py-4" }, [
+)), bo = r((e, t = []) => o({ class: "flex flex-col gap-y-3 py-4" }, [
   // @ts-ignore
-  e.title && Z({ class: "font-semibold" }, e.title),
+  e.title && J({ class: "font-semibold" }, e.title),
   ...t
-])), Ka = (e, t) => o({ class: "flex justify-between" }, [
-  g({ class: "text-muted-foreground" }, e),
-  g(t)
-]), Qa = (e, t) => o({ class: "flex" }, [
-  g({ class: "text-muted-foreground mr-8 w-24 truncate text-nowrap" }, e),
-  g(t)
-]), rs = r(({ title: e, description: t, back: s, icon: n, options: a = [] }) => X({ class: "modal-header bg-background/80 backdrop-blur-md sticky flex flex-none items-center py-4 px-6 z-10 min-w-0" }, [
+])), xo = (e, t) => o({ class: "flex justify-between" }, [
+  u({ class: "text-muted-foreground" }, e),
+  u(t)
+]), po = (e, t) => o({ class: "flex" }, [
+  u({ class: "text-muted-foreground mr-8 w-24 truncate text-nowrap" }, e),
+  u(t)
+]), vs = r(({ title: e, description: t, back: s, icon: n, options: a = [] }) => X({ 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)
    */
   s && b({
     variant: "icon",
-    icon: u.arrows.left,
+    icon: h.arrows.left,
     class: "mr-2 p-0 flex sm:hidden",
     click: (l, i) => i.close()
   }),
@@ -1189,12 +1313,12 @@ const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
   ]),
   o({ class: "flex flex-auto flex-row justify-between ml-2 gap-2 min-w-0" }, [
     o({ class: "flex flex-auto flex-col min-w-0" }, [
-      Z({ class: "text-lg font-semibold m-0 truncate" }, e),
+      J({ class: "text-lg font-semibold m-0 truncate" }, e),
       t && o({ class: "text-sm text-muted-foreground truncate" }, t)
     ]),
     o({ class: "flex flex-none items-center gap-2" }, a)
   ])
-])), Ja = r((e, t) => {
+])), yo = r((e, t) => {
   const s = e.class?.includes("drawer");
   return o({
     popover: "manual",
@@ -1204,7 +1328,7 @@ const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
       l.target === i.panel && (l.preventDefault(), l.stopPropagation(), i.state.open = !1);
     }
   }, [
-    Je({
+    st({
       class: "modal-content relative bg-background z-1 flex flex-auto flex-col gap-y-4 min-w-0",
       // @ts-ignore
       submit: (l, i) => e.onSubmit && e.onSubmit(i),
@@ -1212,13 +1336,13 @@ const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
       // @ts-ignore
       ...e.gestureHandlers
     }, [
-      rs(e),
+      vs(e),
       o({ class: "modal-body flex grow flex-col py-0 px-6 z-0", cache: "modalBody" }, t),
       // @ts-ignore
-      !e.hideFooter && he({ 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)
+      !e.hideFooter && ge({ 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)
     ])
   ]);
-}), Oe = {
+}), Ae = {
   info: {
     bgColor: "bg-muted/10",
     borderColor: "border-blue-500",
@@ -1244,22 +1368,22 @@ const es = r((e, t) => o({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
     borderColor: "border",
     iconColor: "text-muted-foreground"
   }
-}, is = (e) => X({ class: "flex justify-center" }, [
-  fe({ class: "text-lg font-bold mb-0" }, e)
-]), cs = r(({ href: e, class: t }, s) => Ye({
+}, ks = (e) => X({ class: "flex justify-center" }, [
+  me({ class: "text-lg font-bold mb-0" }, e)
+]), Cs = r(({ href: e, class: t }, s) => Ge({
   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)), ds = 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 Za extends C {
+class wo extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -1283,10 +1407,10 @@ class Za extends C {
    */
   render() {
     const { bgColor: t, borderColor: s, iconColor: n } = this.getTypeStyles(), a = this.href || null, l = this.getChildren(n);
-    return a ? cs({
+    return a ? Cs({
       href: a,
       class: `${t} ${s}`
-    }, l) : ds({
+    }, l) : Ss({
       close: this.close.bind(this),
       class: `${t} ${s}`
     }, l);
@@ -1298,7 +1422,7 @@ class Za extends C {
    */
   afterSetup() {
     const t = this.duration;
-    t !== "infinite" && (this.timer = new yt(t, this.close.bind(this)), this.timer.start());
+    t !== "infinite" && (this.timer = new kt(t, this.close.bind(this)), this.timer.start());
   }
   /**
    * This will get the style properties based on the notification type.
@@ -1307,7 +1431,7 @@ class Za extends C {
    */
   getTypeStyles() {
     const t = this.type || "default";
-    return Oe[t] || Oe.default;
+    return Ae[t] || Ae.default;
   }
   /**
    * This will get the buttons for the notification.
@@ -1336,16 +1460,16 @@ class Za extends C {
         ]),
         o({ class: "flex flex-auto flex-col" }, [
           o({ class: "flex flex-auto flex-row items-center w-full pr-12" }, [
-            this.title && is(this.title)
+            this.title && ks(this.title)
           ]),
           k({ class: "text-base text-muted-foreground m-0 pr-12" }, this.description),
-          (this.primary || this.secondary) && he({ class: "margin-top-24 flex align-center" }, this.getButtons())
+          (this.primary || this.secondary) && ge({ class: "margin-top-24 flex align-center" }, this.getButtons())
         ])
       ]),
       b({
         class: "absolute top-[12px] right-[12px]",
         variant: "icon",
-        icon: u.x,
+        icon: h.x,
         click: this.close.bind(this)
       })
     ];
@@ -1360,25 +1484,25 @@ class Za extends C {
     t && t.stopPropagation(), this.duration !== "infinite" && this.timer.stop(), this.onClick && this.onClick(), this.destroy();
   }
 }
-const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w({
+const Re = globalThis.matchMedia, le = r(({ value: e, label: t, icon: s }) => w({
   class: 'text-sm gap-1 font-medium leading-none disabled:cursor-not-allowed disabled:opacity-70 flex flex-col items-center justify-between rounded-md border-2 bg-popover p-4 hover:bg-accent hover:text-accent-foreground data-[state="active"]:border-primary [&:has([data-state="active"])]:border-primary',
   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"), us(e);
+    a.method = e, localStorage.setItem("theme", e), e === "system" && localStorage.removeItem("theme"), $s(e);
   }
 }, [
   x({}, s),
-  g(t)
-])), us = (e) => {
+  u(t)
+])), $s = (e) => {
   const t = document.documentElement;
-  if (e === "system" && (e = globalThis.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light"), Ne && !Ne("(prefers-color-scheme: " + e + ")").matches) {
+  if (e === "system" && (e = globalThis.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light"), Re && !Re("(prefers-color-scheme: " + e + ")").matches) {
     t.classList.add(e);
     return;
   }
   const s = e === "light" ? "dark" : "light";
   t.classList.remove(s);
-}, Xa = M(
+}, vo = P(
   {
     /**
      * This will render the component.
@@ -1388,9 +1512,9 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     render() {
       return o({ class: "flex flex-auto flex-col" }, [
         o({ class: "grid grid-cols-3 gap-4" }, [
-          oe({ label: "System", value: "system", icon: u.adjustments.horizontal }),
-          oe({ label: "Light", value: "light", icon: u.sun }),
-          oe({ label: "Dark", value: "dark", icon: u.moon })
+          le({ label: "System", value: "system", icon: h.adjustments.horizontal }),
+          le({ label: "Light", value: "light", icon: h.sun }),
+          le({ label: "Dark", value: "dark", icon: h.moon })
         ])
       ]);
     },
@@ -1405,7 +1529,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       };
     }
   }
-), eo = O(
+), ko = O(
   {
     /**
      * The initial state of the Toggle.
@@ -1439,7 +1563,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
           s.toggle("active"), this.checkbox.checked = s.active, this.change && this.change(s.active, t, this);
         }
       }, [
-        de({
+        he({
           cache: "checkbox",
           class: "opacity-0 absolute top-0 left-0 bottom-0 right-0 w-full h-full",
           /**
@@ -1450,20 +1574,20 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
           bind: this.bind,
           required: this.required
         }),
-        g({
+        u({
           class: "absolute h-5 w-5 bg-background rounded-full shadow-md transform transition-transform",
           onState: ["active", { "translate-x-[22px]": !0, "translate-x-[2px]": !1 }]
         })
       ]);
     }
   }
-), hs = r(({ src: e, alt: t }) => !e || e.indexOf(".") === -1 && e.indexOf("[[") === -1 ? null : _t({
+), Ds = r(({ src: e, alt: t }) => !e || e.indexOf(".") === -1 && e.indexOf("[[") === -1 ? null : ls({
   src: e,
   alt: t,
   class: "rounded-full"
-})), fs = (e) => e && (Array.isArray(e) && (e = e.join(" ")), typeof e != "string" && (e = String(e)), e.split(" ").map((t) => t.charAt(0)).join("").toUpperCase()), Ze = (e) => !e || e.length < 2 ? e : fs(e), gs = (e) => g([e, (t, s) => {
-  s.textContent = Ze(t);
-}]), Re = {
+})), 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",
   sm: "h-8 w-8",
   md: "h-12 w-12",
@@ -1473,7 +1597,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
   "3xl": "h-48 w-48",
   "4xl": "h-64 w-64",
   default: "h-12 w-12"
-}, Fe = {
+}, Ee = {
   xs: "text-[7px]",
   sm: "text-xs",
   md: "text-base",
@@ -1483,8 +1607,8 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
   "3xl": "text-4xl",
   "4xl": "text-5xl",
   default: "text-base"
-}, ms = (e) => Re[e] || Re.default, bs = (e) => Fe[e] || Fe.default, xs = (e, t = null, s = "md") => {
-  const n = Ze(String(e)), a = bs(s);
+}, Ms = (e) => je[e] || je.default, Ps = (e) => Ee[e] || Ee.default, Bs = (e, t = null, s = "md") => {
+  const n = nt(String(e)), a = Ps(s);
   return o(
     {
       class: `
@@ -1494,21 +1618,21 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
 		`
     },
     [
-      t ? gs(t) : g({ class: "uppercase" }, n)
+      t ? Ts(t) : u({ class: "uppercase" }, n)
     ]
   );
-}, ps = r(({ src: e, alt: t, fallbackText: s, watcherFallback: n, size: a }) => {
-  const l = ms(a);
+}, zs = r(({ src: e, alt: t, fallbackText: s, watcherFallback: n, size: a }) => {
+  const l = Ms(a);
   return o(
     {
       class: `relative flex items-center justify-center ${l}`
     },
     [
-      hs({ src: e, alt: t }),
-      xs(s, n, a)
+      Ds({ src: e, alt: t }),
+      Bs(s, n, a)
     ]
   );
-}), ys = (e) => e.indexOf(".") === -1 && e.indexOf("[[") === -1 && e.indexOf("blob:") === -1, to = M(
+}), Os = (e) => e.indexOf(".") === -1 && e.indexOf("[[") === -1 && e.indexOf("blob:") === -1, Co = P(
   {
     /**
      * Get the initial state for the component.
@@ -1528,7 +1652,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
      */
     openFileBrowse() {
       const e = this.input;
-      e && (e.value = "", j.trigger("click", e));
+      e && (e.value = "", R.trigger("click", e));
     },
     /**
      * Get the URL for the uploaded file.
@@ -1564,13 +1688,13 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
             s.preventDefault(), s.stopPropagation(), this.openFileBrowse();
           }
         }, [
-          T("loaded", (s) => s === !1 || ys(this.src) ? W({
+          M("loaded", (s) => s === !1 || Os(this.src) ? E({
             htmlFor: e,
             class: "z-10 flex flex-col items-center justify-center text-sm text-muted-foreground group-hover:text-primary"
           }, [
-            ce(u.upload),
+            de(h.upload),
             o("Upload Image")
-          ]) : ue({
+          ]) : fe({
             // @ts-ignore
             src: this.src,
             class: "absolute inset-0 w-full h-full object-cover rounded-full"
@@ -1579,7 +1703,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       ]);
     }
   }
-), so = M(
+), So = P(
   {
     /**
      * Get the initial state for the component.
@@ -1599,7 +1723,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
      */
     openFileBrowse() {
       const e = this.input;
-      e && (e.value = "", j.trigger("click", e));
+      e && (e.value = "", R.trigger("click", e));
     },
     /**
      * Get the URL for the uploaded file.
@@ -1635,17 +1759,17 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
             s.preventDefault(), s.stopPropagation(), this.openFileBrowse();
           }
         }, [
-          T(
+          M(
             "loaded",
-            (s) => s ? ue({
+            (s) => s ? fe({
               // @ts-ignore
               src: this.src,
               class: "absolute inset-0 w-full h-full object-cover rounded-full"
-            }) : W({
+            }) : E({
               htmlFor: e,
               class: "z-10 flex flex-col items-center justify-center text-sm text-muted-foreground group-hover:text-primary"
             }, [
-              x({}, u.upload),
+              x({}, h.upload),
               o("Upload logo")
             ])
           )
@@ -1661,22 +1785,22 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       this.input = null;
     }
   }
-), ws = (e, t) => Ye(
+), Ns = (e, t) => Ge(
   {
     href: e,
     "aria-current": t === "Breadcrumb" && "page",
     // Only set aria-current on the last item
     class: "text-muted-foreground font-medium hover:text-foreground"
   },
-  [g(t)]
-), vs = () => x({
+  [u(t)]
+), Fs = () => x({
   class: "mx-3 text-muted-foreground",
   "aria-hidden": !0,
   size: "xs"
-}, u.chevron.single.right), ks = (e) => o({ class: "flex items-center" }, [
-  e.href ? ws(e.href, e.label) : g(e.label),
-  e.separator && vs()
-]), no = M(
+}, h.chevron.single.right), Ls = (e) => o({ class: "flex items-center" }, [
+  e.href ? Ns(e.href, e.label) : u(e.label),
+  e.separator && Fs()
+]), $o = P(
   {
     /**
      * Set initial data
@@ -1696,7 +1820,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
      */
     render() {
       const e = this.data.items.length - 1;
-      return ge(
+      return be(
         {
           "aria-label": "Breadcrumb",
           class: "flex items-center gap-x-1 text-sm"
@@ -1705,7 +1829,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
           o({
             role: "list",
             class: "flex items-center",
-            for: ["items", (t, s) => ks({
+            for: ["items", (t, s) => Ls({
               href: t.href,
               label: t.label,
               separator: s < e
@@ -1715,7 +1839,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       );
     }
   }
-), Le = {
+), He = {
   xs: "h-1 w-1",
   sm: "h-2 w-2",
   md: "h-4 w-4",
@@ -1724,8 +1848,8 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
   "2xl": "h-16 w-16",
   "3xl": "h-24 w-24",
   default: "h-4 w-4"
-}, Cs = (e) => Le[e] || Le.default, Ss = ({ index: e, size: t }) => o({ class: `${t} rounded-full bg-muted cursor-pointer` }, [
-  g({
+}, As = (e) => He[e] || He.default, Rs = ({ 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", {
       "bg-primary": e,
@@ -1735,10 +1859,10 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       n.activeIndex = e, a && a(e);
     }
   })
-]), $s = (e, t) => Array.from({ length: e }, (s, n) => Ss({
+]), js = (e, t) => Array.from({ length: e }, (s, n) => Rs({
   index: n,
   size: t
-})), ao = M(
+})), Do = P(
   {
     /**
      * Defines component data (props).
@@ -1760,7 +1884,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
      * @returns {object}
      */
     render() {
-      const e = this.gap || "gap-2", t = Cs(this.size || "sm"), s = $s(this.data.count, t);
+      const e = this.gap || "gap-2", t = As(this.size || "sm"), s = js(this.data.count, t);
       return o(
         { class: "flex justify-center items-center py-2" },
         [
@@ -1769,37 +1893,37 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       );
     }
   }
-), Ds = ({ toggleDropdown: e }) => w(
+), Es = ({ toggleDropdown: e }) => w(
   {
     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",
     click: e
   },
   [
-    g({ onState: ["selectedLabel", (t) => t || "Select item..."] }),
-    x({ size: "sm" }, u.chevron.upDown)
+    u({ onState: ["selectedLabel", (t) => t || "Select item..."] }),
+    x({ size: "sm" }, h.chevron.upDown)
   ]
-), Is = (e, t, s) => me({
+), Hs = (e, t, s) => xe({
   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 && g({ class: "mr-2 flex items-baseline" }, [x({ size: "xs" }, e.icon)]),
-  g({ class: "text-base font-normal" }, e.label)
-]), Ts = (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) => Is(s, e, t)] })
-]), Ms = ({ onSelect: e, state: t }) => o({ class: "flex flex-auto flex-col" }, [
-  T(
+  e.icon && u({ class: "mr-2 flex items-baseline" }, [x({ size: "xs" }, e.icon)]),
+  u({ class: "text-base font-normal" }, e.label)
+]), Us = (e, t) => o({ class: "w-full border rounded-md" }, [
+  Z({ class: "max-h-60 overflow-y-auto p-2 grid gap-1", for: ["items", (s) => Hs(s, e, t)] })
+]), Ys = ({ onSelect: e, state: t }) => o({ class: "flex flex-auto flex-col" }, [
+  M(
     "open",
     (s, n, a) => s ? new se({
       cache: "dropdown",
       parent: a,
       button: a.button
     }, [
-      Ts(e, t)
+      Us(e, t)
     ]) : null
   )
-]), oo = M(
+]), Io = P(
   {
     /**
      * This will set up the data.
@@ -1880,8 +2004,8 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       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
-        Ds({ toggleDropdown: this.toggleDropdown.bind(this) }),
-        Ms({
+        Es({ toggleDropdown: this.toggleDropdown.bind(this) }),
+        Ys({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1901,21 +2025,21 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       ]);
     }
   }
-), Xe = ({ icon: e, click: t, ariaLabel: s }) => b({
+), at = ({ icon: e, click: t, ariaLabel: s }) => b({
   variant: "icon",
   class: "flex flex-none",
   click: t,
   icon: e,
   "aria-label": s
-}), Ps = ({ click: e }) => Xe({
-  icon: u.circleMinus,
+}), _s = ({ click: e }) => at({
+  icon: h.circleMinus,
   click: e,
   ariaLabel: "Decrement"
-}), Bs = ({ click: e }) => Xe({
-  icon: u.circlePlus,
+}), Vs = ({ click: e }) => at({
+  icon: h.circlePlus,
   click: e,
   ariaLabel: "Increment"
-}), zs = ({ bind: e, min: t, max: s, readonly: n = !1 }) => _(({ state: a }) => p({
+}), Ws = ({ bind: e, min: t, max: s, readonly: n = !1 }) => V(({ state: a }) => p({
   value: ["[[count]]", a],
   bind: e,
   blur: (l, { state: i }) => {
@@ -1928,7 +2052,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
   max: s,
   type: "number",
   "aria-label": "Counter"
-})), lo = O(
+})), To = O(
   {
     /**
      * Initial state for the counter component.
@@ -1951,20 +2075,20 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     render() {
       const e = this.class ?? "";
       return o({ class: `flex flex-auto items-center justify-between gap-x-4 p-4 ${e}` }, [
-        Ps({ click: () => this.state.decrement("count") }),
-        zs({
+        _s({ click: () => this.state.decrement("count") }),
+        Ws({
           bind: this.bind,
           readonly: this.readonly,
           min: this.min,
           max: this.max
         }),
-        Bs({ click: () => this.state.increment("count") })
+        Vs({ click: () => this.state.increment("count") })
       ]);
     }
   }
-), Os = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
+), qs = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
   { class: "grid grid-cols-3 gap-2" },
-  te.monthNames.map(
+  ee.monthNames.map(
     (n, a) => b(
       {
         click: (l) => {
@@ -1976,10 +2100,10 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       n.substring(0, 3)
     )
   )
-), B = (e) => (e *= 1, e < 10 ? `0${e}` : String(e)), Ns = (e) => (e.indexOf("T") === -1 && e.indexOf(" ") === -1 && (e += "T00:00:01"), e.replace(" ", "T"), e), L = (e, t, s) => `${e}-${B(t + 1)}-${B(s)}`, Rs = (e) => e ? "bg-accent text-primary" : "", Fs = (e) => e ? "text-muted-foreground opacity-50" : "", Ls = (e, t) => e === t, js = (e, t) => Ls(e, t) ? "bg-primary text-primary-foreground" : "", As = (e, t, s, n) => {
-  const a = js(t, n);
-  return a || (e ? Rs(e) : s ? Fs(s) : "text-foreground");
-}, le = (e) => {
+), B = (e) => (e *= 1, e < 10 ? `0${e}` : String(e)), Gs = (e) => (e.indexOf("T") === -1 && e.indexOf(" ") === -1 && (e += "T00:00:01"), e.replace(" ", "T"), e), A = (e, t, s) => `${e}-${B(t + 1)}-${B(s)}`, Ks = (e) => e ? "bg-accent text-primary" : "", Qs = (e) => e ? "text-muted-foreground opacity-50" : "", Js = (e, t) => e === t, Xs = (e, t) => Js(e, t) ? "bg-primary text-primary-foreground" : "", Zs = (e, t, s, n) => {
+  const a = Xs(t, n);
+  return a || (e ? Ks(e) : s ? Qs(s) : "text-foreground");
+}, re = (e) => {
   const {
     day: t,
     currentDate: s,
@@ -1993,7 +2117,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     {
       class: `
 				flex items-center justify-center h-9 w-auto p-0 font-normal text-sm rounded-md cursor-pointer
-				${As(a, s, l, n)}
+				${Zs(a, s, l, n)}
 				hover:bg-muted/50 hover:text-muted-foreground focus:z-10
                 disabled:pointer-events-none disabled:opacity-50
 			`,
@@ -2004,53 +2128,53 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     },
     t.toString()
   );
-}, re = (e, t, s, n) => e === n.date && t === n.month && s === n.year, Hs = (e, t, s, n = !1) => {
-  const { year: a, month: l } = e, i = L(a, l, e.date), c = new Date(a, l, 1).getDay(), h = new Date(a, l + 1, 0).getDate(), m = new Date(a, l, 0).getDate(), v = [], q = l === 0 ? 11 : l - 1, H = l === 0 ? a - 1 : a;
+}, ie = (e, t, s, n) => e === n.date && t === n.month && s === n.year, en = (e, t, s, n = !1) => {
+  const { year: a, month: l } = e, i = A(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(), v = [], W = l === 0 ? 11 : l - 1, U = l === 0 ? a - 1 : a;
   for (let d = c - 1; d >= 0; d--) {
-    const y = m - d, S = re(y, q, H, t), $ = new Date(H, q, y) < new Date(t.year, t.month, t.date), R = n && $;
+    const y = m - d, I = ie(y, W, U, t), T = new Date(U, W, y) < new Date(t.year, t.month, t.date), F = n && T;
     v.push(
-      le({
+      re({
         day: y,
         currentDate: i,
-        date: L(H, q, y),
-        isToday: S,
+        date: A(U, W, y),
+        isToday: I,
         isOutsideMonth: !0,
         select: s,
-        disabled: R
+        disabled: F
       })
     );
   }
-  for (let d = 1; d <= h; d++) {
-    const y = re(d, l, a, t), S = new Date(a, l, d) < new Date(t.year, t.month, t.date), $ = n && S;
+  for (let d = 1; d <= f; d++) {
+    const y = ie(d, l, a, t), I = new Date(a, l, d) < new Date(t.year, t.month, t.date), T = n && I;
     v.push(
-      le({
+      re({
         day: d,
         currentDate: i,
-        date: L(a, l, d),
+        date: A(a, l, d),
         isToday: y,
         isOutsideMonth: !1,
         select: s,
-        disabled: $
+        disabled: T
       })
     );
   }
-  const E = l === 11 ? 0 : l + 1, ne = l === 11 ? a + 1 : a, f = (7 - v.length % 7) % 7;
-  for (let d = 1; d <= f; d++) {
-    const y = re(d, E, ne, t), S = new Date(ne, E, d) < new Date(t.year, t.month, t.date), $ = n && S;
+  const Y = l === 11 ? 0 : l + 1, ne = l === 11 ? a + 1 : a, g = (7 - v.length % 7) % 7;
+  for (let d = 1; d <= g; d++) {
+    const y = ie(d, Y, ne, t), I = new Date(ne, Y, d) < new Date(t.year, t.month, t.date), T = n && I;
     v.push(
-      le({
+      re({
         day: d,
         currentDate: i,
-        date: L(ne, E, d),
+        date: A(ne, Y, d),
         isToday: y,
         isOutsideMonth: !0,
         select: s,
-        disabled: $
+        disabled: T
       })
     );
   }
   return v;
-}, je = ({ label: e, click: t }) => b(
+}, Ue = ({ label: e, click: t }) => b(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -2061,18 +2185,18 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     click: t,
     "aria-label": `${e} month`,
     variant: "icon",
-    icon: e === "Previous" ? u.chevron.single.left : u.chevron.single.right
+    icon: e === "Previous" ? h.chevron.single.left : h.chevron.single.right
   }
-), Es = ({ 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" }, [
+), tn = ({ 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]]"),
-  je({ label: "Previous", click: n }),
-  je({ label: "Next", click: s })
-]), Us = (e) => o(
+  Ue({ label: "Previous", click: n }),
+  Ue({ label: "Next", click: s })
+]), sn = (e) => o(
   { class: "flex items-center justify-center h-9 w-auto text-[0.8rem] font-normal text-muted-foreground" },
   e
-), Ys = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(Us), Vs = (e) => o({ class: "rdp flex flex-auto flex-col w-full gap-y-1" }, [
-  Es({
+), nn = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(sn), an = (e) => o({ class: "rdp flex flex-auto flex-col w-full gap-y-1" }, [
+  tn({
     onMonthClick: e.onMonthClick,
     onYearClick: e.onYearClick,
     next: e.next,
@@ -2083,10 +2207,10 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     onSet: [
       "currentDate",
       () => [
-        o({ class: "grid grid-cols-7" }, Ys()),
+        o({ class: "grid grid-cols-7" }, nn()),
         o(
           { class: "grid grid-cols-7" },
-          Hs(
+          en(
             e.current,
             e.today,
             e.select,
@@ -2096,7 +2220,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
       ]
     ]
   })
-]), Ws = ({ currentMonth: e, currentYear: t, onSelect: s }) => {
+]), on = ({ 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" },
@@ -2114,7 +2238,7 @@ const Ne = globalThis.matchMedia, oe = r(({ value: e, label: t, icon: s }) => w(
     )
   );
 };
-class _s extends C {
+class ln extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -2130,7 +2254,7 @@ class _s extends C {
    * @returns {Date}
    */
   getSelectedDate(t) {
-    const s = this.selectedDate ? new Date(Ns(this.selectedDate)) : t;
+    const s = this.selectedDate ? new Date(Gs(this.selectedDate)) : t;
     return new Date(s.getFullYear(), s.getMonth(), s.getDate());
   }
   /**
@@ -2173,7 +2297,7 @@ class _s extends C {
    * @returns {string}
    */
   getMonthName(t) {
-    return te.monthNames[t];
+    return ee.monthNames[t];
   }
   /**
    * This will go to the previous month.
@@ -2224,10 +2348,10 @@ class _s extends C {
    */
   render() {
     return o({ class: "calendar-container p-3 rounded-md border min-w-80" }, [
-      T("view", (t) => {
+      M("view", (t) => {
         switch (t) {
           case "months":
-            return Os(
+            return qs(
               {
                 // @ts-ignore
                 currentMonth: this.data.current.month,
@@ -2239,7 +2363,7 @@ class _s extends C {
               }
             );
           case "years":
-            return Ws(
+            return on(
               {
                 // @ts-ignore
                 currentMonth: this.data.current.month,
@@ -2251,7 +2375,7 @@ class _s extends C {
               }
             );
           default:
-            return Vs({
+            return an({
               // @ts-ignore
               current: this.data.current,
               // @ts-ignore
@@ -2272,57 +2396,57 @@ class _s extends C {
     ]);
   }
 }
-const qs = (e) => {
+const rn = (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;
-}, Gs = (e) => {
+}, cn = (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;
-}, Ks = ({ bind: e, required: t }) => p({
+}, dn = ({ 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
-}), Qs = ({ placeholder: e, handleInputChange: t, handleInputFocus: s }) => p({
+}), un = ({ 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) : ""]
-}), Js = ({ bind: e, required: t, toggleOpen: s, handleInputChange: n, handleInputFocus: a, placeholder: l }) => o(
+  onState: ["selectedDate", (n) => n ? ee.format("standard", n) : ""]
+}), hn = ({ 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"
   },
   [
-    Ks({ bind: e, required: t }),
-    Qs({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
+    dn({ bind: e, required: t }),
+    un({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
     w(
       {
         class: "shrink-0 hover:bg-muted/50 rounded p-1 cursor-pointer",
         click: s
       },
       [
-        V({ html: u.calendar.days })
+        j({ html: h.calendar.days })
       ]
     )
   ]
-), Zs = ({ handleDateSelect: e, blockPriorDates: t }) => be(
+), fn = ({ handleDateSelect: e, blockPriorDates: t }) => pe(
   (s, n, a) => new se({
     cache: "dropdown",
     parent: a,
     button: a.panel,
     size: "fit"
   }, [
-    new _s({
+    new ln({
       selectedDate: a.state.selectedDate,
       selectedCallBack: e,
       blockPriorDates: t
     })
   ])
-), ro = O(
+), Mo = O(
   {
     /**
      * The initial state of the DatePicker.
@@ -2351,9 +2475,9 @@ const qs = (e) => {
      */
     handleInputChange(e) {
       const s = e.target.value.replace(/\D/g, "");
-      e.target.value = qs(s);
-      const n = Gs(s);
-      n && (this.state.selectedDate = n, this.input.value = n, j.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(n));
+      e.target.value = rn(s);
+      const n = cn(s);
+      n && (this.state.selectedDate = n, this.input.value = n, R.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(n));
     },
     /**
      * Handles input focus - select all text for easy editing.
@@ -2369,7 +2493,7 @@ const qs = (e) => {
      * @param {string} date
      */
     handleDateSelect(e) {
-      this.state.selectedDate = e, this.state.open = !1, this.input.value = e, j.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(e);
+      this.state.selectedDate = e, this.state.open = !1, this.input.value = e, R.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(e);
     },
     /**
      * Toggles the calendar popover.
@@ -2389,7 +2513,7 @@ const qs = (e) => {
       return o(
         { class: "relative w-full max-w-[320px]" },
         [
-          Js({
+          hn({
             toggleOpen: this.toggleOpen.bind(this),
             bind: this.bind,
             required: this.required,
@@ -2397,7 +2521,7 @@ const qs = (e) => {
             handleInputFocus: this.handleInputFocus.bind(this),
             placeholder: this.placeholder
           }),
-          Zs({
+          fn({
             handleDateSelect: this.handleDateSelect.bind(this),
             blockPriorDates: this.blockPriorDates || !1
           })
@@ -2405,7 +2529,7 @@ const qs = (e) => {
       );
     }
   }
-), Ae = ({ label: e, click: t }) => b(
+), Ye = ({ label: e, click: t }) => b(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -2416,22 +2540,22 @@ const qs = (e) => {
     click: t,
     "aria-label": `${e} month`,
     variant: "icon",
-    icon: e === "Previous" ? u.chevron.single.left : u.chevron.single.right
+    icon: e === "Previous" ? h.chevron.single.left : h.chevron.single.right
   }
-), Xs = ({ 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" }, [
+), gn = ({ 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]]"),
-  Ae({ label: "Previous", click: n }),
-  Ae({ label: "Next", click: s })
-]), en = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), tn = () => o(
+  Ye({ label: "Previous", click: n }),
+  Ye({ label: "Next", click: s })
+]), mn = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), bn = () => 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(en)
-), sn = ({ day: e, iso: t, disabled: s, isStart: n, isEnd: a, isBetween: l, isOtherMonth: i, click: c }) => {
-  let h = "ghost", m = "";
-  return n || a ? (h = "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(
+  ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(mn)
+), xn = ({ 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(
     {
       class: `flex items-center justify-center p-0 text-sm font-medium rounded-md transition-colors ${m}`,
-      variant: h,
+      variant: f,
       disabled: s,
       click: (v) => {
         v.preventDefault(), v.stopPropagation(), s || c();
@@ -2439,67 +2563,67 @@ const qs = (e) => {
     },
     e.toString()
   );
-}, nn = ({ 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(), h = [], m = t.month === 0 ? 11 : t.month - 1, v = t.month === 0 ? t.year - 1 : t.year, q = new Date(v, m + 1, 0).getDate(), H = t.month === 11 ? 0 : t.month + 1, E = t.month === 11 ? t.year + 1 : t.year;
-  for (let f = i - 1; f >= 0; f--) {
-    const d = q - f, y = L(v, m, d), S = new Date(v, m, d), $ = new Date(e.year, e.month, e.date), R = S < $, G = s && R, K = a === y, Q = l === y, lt = a && l && y > a && y < l;
-    h.push({
+}, pn = ({ 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, v = t.month === 0 ? t.year - 1 : t.year, W = new Date(v, 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 = W - g, y = A(v, m, d), I = new Date(v, m, d), T = new Date(e.year, e.month, e.date), F = I < T, q = s && F, G = a === y, K = l === y, ut = a && l && y > a && y < l;
+    f.push({
       day: d,
       iso: y,
-      disabled: G,
-      isStart: K,
-      isEnd: Q,
-      isBetween: lt,
+      disabled: q,
+      isStart: G,
+      isEnd: K,
+      isBetween: ut,
       isOtherMonth: !0,
       click: () => n(y)
     });
   }
-  for (let f = 1; f <= c; f++) {
-    const d = L(t.year, t.month, f), y = new Date(t.year, t.month, f), S = new Date(e.year, e.month, e.date), $ = y < S, R = s && $, G = a === d, K = l === d, Q = a && l && d > a && d < l;
-    h.push({
-      day: f,
+  for (let g = 1; g <= c; g++) {
+    const d = A(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, q = a === d, G = l === d, K = a && l && d > a && d < l;
+    f.push({
+      day: g,
       iso: d,
-      disabled: R,
-      isStart: G,
-      isEnd: K,
-      isBetween: Q,
+      disabled: F,
+      isStart: q,
+      isEnd: G,
+      isBetween: K,
       isOtherMonth: !1,
       click: () => {
         n(d);
       }
     });
   }
-  const ve = (7 - h.length % 7) % 7;
-  for (let f = 1; f <= ve; f++) {
-    const d = L(E, H, f), y = new Date(E, H, f), S = new Date(e.year, e.month, e.date), $ = y < S, R = s && $, G = a === d, K = l === d, Q = a && l && d > a && d < l;
-    h.push({
-      day: f,
+  const $e = (7 - f.length % 7) % 7;
+  for (let g = 1; g <= $e; g++) {
+    const d = A(Y, U, g), y = new Date(Y, U, g), I = new Date(e.year, e.month, e.date), T = y < I, F = s && T, q = a === d, G = l === d, K = a && l && d > a && d < l;
+    f.push({
+      day: g,
       iso: d,
-      disabled: R,
-      isStart: G,
-      isEnd: K,
-      isBetween: Q,
+      disabled: F,
+      isStart: q,
+      isEnd: G,
+      isBetween: K,
       isOtherMonth: !0,
       click: () => n(d)
     });
   }
   return o(
     { class: "grid grid-cols-7 gap-1" },
-    h.map(
-      (f, d) => sn({
-        day: f.day,
-        iso: f.iso,
-        disabled: f.disabled,
-        isStart: f.isStart,
-        isEnd: f.isEnd,
-        isBetween: f.isBetween,
-        isOtherMonth: f.isOtherMonth,
-        click: f.click
+    f.map(
+      (g, d) => xn({
+        day: g.day,
+        iso: g.iso,
+        disabled: g.disabled,
+        isStart: g.isStart,
+        isEnd: g.isEnd,
+        isBetween: g.isBetween,
+        isOtherMonth: g.isOtherMonth,
+        click: g.click
       })
     )
   );
-}, an = r((e, t) => o({ class: "flex flex-auto flex-col" }, [
-  Xs({
+}, yn = r((e, t) => o({ class: "flex flex-auto flex-col" }, [
+  gn({
     // @ts-ignore
     onMonthClick: e.onMonthClick,
     // @ts-ignore
@@ -2514,8 +2638,8 @@ const qs = (e) => {
     onSet: [
       "currentDate",
       () => [
-        tn(),
-        nn({
+        bn(),
+        pn({
           // @ts-ignore
           today: e.today,
           // @ts-ignore
@@ -2528,9 +2652,9 @@ const qs = (e) => {
       ]
     ]
   })
-])), on = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
+])), wn = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
   { class: "grid grid-cols-3 gap-2" },
-  te.monthNames.map(
+  ee.monthNames.map(
     (n, a) => b(
       {
         click: (l) => {
@@ -2542,25 +2666,25 @@ const qs = (e) => {
       n.substring(0, 3)
     )
   )
-), ln = ({ start: e, end: t, selecting: s, onSelectStart: n, onSelectEnd: a }) => o({ class: "flex gap-x-2 mb-4" }, [
-  J("selecting", (l) => b({
+), vn = ({ start: e, end: t, selecting: s, onSelectStart: n, onSelectEnd: a }) => o({ class: "flex gap-x-2 mb-4" }, [
+  Q("selecting", (l) => b({
     click: n,
     variant: l === "start" ? "primary" : "outline",
     class: "flex-1"
   }, [
-    o({ class: "font-medium" }, He("current.start", "Start Date"))
+    o({ class: "font-medium" }, _e("current.start", "Start Date"))
   ])),
-  J("selecting", (l) => b({
+  Q("selecting", (l) => b({
     click: a,
     variant: l === "end" ? "primary" : "outline",
     class: "flex-1"
   }, [
-    o({ class: "font-medium" }, He("current.end", "End Date"))
+    o({ class: "font-medium" }, _e("current.end", "End Date"))
   ]))
-]), He = (e, t) => [`[[${e}]]`, (s) => s == null ? t : rn(s)], rn = (e) => {
+]), _e = (e, t) => [`[[${e}]]`, (s) => s == null ? t : kn(s)], kn = (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()]}`;
-}, cn = ({ currentYear: e, onSelect: t }) => {
+}, Cn = ({ 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" },
@@ -2578,7 +2702,7 @@ const qs = (e) => {
     )
   );
 };
-class dn extends C {
+class Sn extends S {
   /**
    * Declare compiler props.
    *
@@ -2619,7 +2743,7 @@ class dn extends C {
    * @returns {string}
    */
   getMonthName(t) {
-    return te.monthNames[t];
+    return ee.monthNames[t];
   }
   /**
    * Initialize component state.
@@ -2675,7 +2799,7 @@ class dn extends C {
   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" }, [
-      ln({
+      vn({
         start: a,
         end: l,
         selecting: n,
@@ -2686,10 +2810,10 @@ class dn extends C {
           i.preventDefault(), i.stopPropagation(), this.data.selecting = "end";
         }
       }),
-      T("view", (i) => {
+      M("view", (i) => {
         switch (i) {
           case "months":
-            return on(
+            return wn(
               {
                 currentMonth: s.month,
                 currentYear: s.year,
@@ -2699,7 +2823,7 @@ class dn extends C {
               }
             );
           case "years":
-            return cn(
+            return Cn(
               {
                 currentYear: s.year,
                 onSelect: (c) => {
@@ -2708,7 +2832,7 @@ class dn extends C {
               }
             );
           default:
-            return an({
+            return yn({
               // @ts-ignore
               monthName: this.data.monthName,
               year: s.year,
@@ -2723,12 +2847,12 @@ class dn extends C {
                 c.preventDefault(), c.stopPropagation(), this.state.view = "years";
               },
               next: () => {
-                const c = this.data.current, h = c.month === 11 ? { month: 0, year: c.year + 1 } : { month: c.month + 1, year: c.year };
-                this.setCurrent(h);
+                const c = this.data.current, f = c.month === 11 ? { month: 0, year: c.year + 1 } : { month: c.month + 1, year: c.year };
+                this.setCurrent(f);
               },
               previous: () => {
-                const c = this.data.current, h = c.month === 0 ? { month: 11, year: c.year - 1 } : { month: c.month - 1, year: c.year };
-                this.setCurrent(h);
+                const c = this.data.current, f = c.month === 0 ? { month: 11, year: c.year - 1 } : { month: c.month - 1, year: c.year };
+                this.setCurrent(f);
               }
             });
         }
@@ -2736,35 +2860,35 @@ class dn extends C {
     ]);
   }
 }
-const un = ({ bind: e, required: t }) => p({
+const $n = ({ 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
-}), hn = ({ bind: e, required: t, toggleOpen: s }) => w({
+}), Dn = ({ bind: e, required: t, toggleOpen: s }) => w({
   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
 }, [
-  un({ bind: e, required: t }),
-  _(({ state: n }) => [
-    g(U.date(["[[start]]", n], "Start Date")),
-    g(" - "),
-    g(U.date(["[[end]]", n], "End Date"))
+  $n({ bind: e, required: t }),
+  V(({ state: n }) => [
+    u(_.date(["[[start]]", n], "Start Date")),
+    u(" - "),
+    u(_.date(["[[end]]", n], "End Date"))
   ]),
-  V({ html: u.calendar.days })
-]), fn = ({ handleDateSelect: e, blockPriorDates: t }) => be((s, n, a) => new se({
+  j({ html: h.calendar.days })
+]), In = ({ handleDateSelect: e, blockPriorDates: t }) => pe((s, n, a) => new se({
   cache: "dropdown",
   parent: a,
   button: a.panel,
   size: "xl"
 }, [
-  new dn({
+  new Sn({
     startDate: a.state.start,
     endDate: a.state.end,
     onRangeSelect: e,
     blockPriorDates: t
   })
-])), io = O(
+])), Po = O(
   {
     /**
      * The initial state of the DateRangePicker.
@@ -2797,15 +2921,15 @@ const un = ({ bind: e, required: t }) => p({
      */
     render() {
       const e = (s, { state: n }) => n.toggle("open"), t = (s, n) => {
-        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);
+        this.state.start = s, this.state.end = n, this.state.open = !1, this.input.value = `${s}-${n}`, R.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]" }, [
-        hn({
+        Dn({
           toggleOpen: e,
           bind: this.bind,
           required: this.required
         }),
-        fn({
+        In({
           handleDateSelect: t,
           blockPriorDates: this.blockPriorDates || !1
         })
@@ -2813,11 +2937,11 @@ const un = ({ bind: e, required: t }) => p({
     }
   }
 );
-function gn(e) {
+function Tn(e) {
   let t = "";
   return e.length > 0 && (t = e.substring(0, 2), e.length > 2 && (t += ":" + e.substring(2, 4))), t;
 }
-function mn(e) {
+function Mn(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);
@@ -2831,7 +2955,7 @@ function mn(e) {
     meridian: a
   };
 }
-function bn({ 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",
@@ -2839,7 +2963,7 @@ function bn({ bind: e, required: t }) {
     required: t
   });
 }
-function xn({ placeholder: e, handleInputChange: t, handleInputFocus: s }) {
+function Bn({ placeholder: e, handleInputChange: t, handleInputFocus: s }) {
   return p({
     cache: "timeInput",
     class: "flex-1 bg-transparent outline-none placeholder:text-muted-foreground border-0",
@@ -2849,27 +2973,27 @@ function xn({ 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 zn({ 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"
     },
     [
-      bn({ bind: e, required: t }),
-      xn({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
+      Pn({ bind: e, required: t }),
+      Bn({ placeholder: l, handleInputChange: n, handleInputFocus: a }),
       w(
         {
           class: "shrink-0 hover:bg-muted/50 rounded p-1 cursor-pointer",
           click: s
         },
         [
-          V({ html: u.clock })
+          j({ html: h.clock })
         ]
       )
     ]
   );
 }
-function ie({ items: e, handleTimeSelect: t, state: s, stateValue: n, pad: a = !1 }) {
+function ce({ items: e, handleTimeSelect: t, state: s, stateValue: n, pad: a = !1 }) {
   return o(
     { class: "flex flex-col max-h-[200px] overflow-y-auto" },
     e.map((l) => {
@@ -2883,8 +3007,8 @@ function ie({ items: e, handleTimeSelect: t, state: s, stateValue: n, pad: a = !
     })
   );
 }
-function yn({ handleTimeSelect: e }) {
-  return be(
+function On({ handleTimeSelect: e }) {
+  return pe(
     (t, s, n) => new se(
       {
         cache: "dropdown",
@@ -2900,7 +3024,7 @@ function yn({ handleTimeSelect: e }) {
               { class: "grid grid-cols-3 gap-2 p-4 text-center max-h-[220px] min-w-[240px]" },
               [
                 // Hours column
-                ie({
+                ce({
                   items: Array.from({ length: 12 }, (a, l) => l + 1),
                   handleTimeSelect: e,
                   state: n.state,
@@ -2908,7 +3032,7 @@ function yn({ handleTimeSelect: e }) {
                   pad: !0
                 }),
                 // Minutes column
-                ie({
+                ce({
                   items: Array.from({ length: 60 }, (a, l) => l),
                   handleTimeSelect: e,
                   state: n.state,
@@ -2916,7 +3040,7 @@ function yn({ handleTimeSelect: e }) {
                   pad: !0
                 }),
                 // AM/PM column
-                ie({
+                ce({
                   items: ["AM", "PM"],
                   handleTimeSelect: e,
                   state: n.state,
@@ -2930,7 +3054,7 @@ function yn({ handleTimeSelect: e }) {
     )
   );
 }
-function Ee(e) {
+function Ve(e) {
   if (!e)
     return { hour: null, minute: null, meridian: null };
   const t = /^(\d{1,2}):(\d{2})(?::(\d{2}))?\s?(AM|PM)?$/i, s = e.match(t);
@@ -2943,7 +3067,7 @@ function Ee(e) {
     meridian: l
   });
 }
-const co = O(
+const Bo = O(
   {
     /**
      * The initial shallow state of the TimePicker.
@@ -2951,7 +3075,7 @@ const co = O(
      * @member {object} state
      */
     state() {
-      const e = this.selectedTime ?? null, { hour: t, minute: s, meridian: n } = Ee(e);
+      const e = this.selectedTime ?? null, { hour: t, minute: s, meridian: n } = Ve(e);
       return {
         selectedTime: e,
         open: !1,
@@ -2967,7 +3091,7 @@ const co = O(
      */
     after() {
       if (this.input.value) {
-        const { hour: e, minute: t, meridian: s } = Ee(this.input.value);
+        const { hour: e, minute: t, meridian: s } = Ve(this.input.value);
         this.state.set({
           hour: e,
           minute: t,
@@ -2991,14 +3115,14 @@ const co = O(
      * @param {Event} e
      */
     handleInputChange(e) {
-      let t = e.target.value.replace(/[^\d]/g, ""), s = gn(t);
-      const n = mn(t);
+      let t = e.target.value.replace(/[^\d]/g, ""), s = Tn(t);
+      const n = Mn(t);
       n.formattedTime && (s = n.formattedTime, this.state.set({
         hour: n.hour,
         minute: n.minute,
         meridian: n.meridian,
         selectedTime: n.formattedTime
-      }), this.input.value = n.formattedTime, j.trigger("change", this.input), typeof this.change == "function" && this.change(n.formattedTime)), e.target.value = s;
+      }), this.input.value = n.formattedTime, R.trigger("change", this.input), typeof this.change == "function" && this.change(n.formattedTime)), e.target.value = s;
     },
     /**
      * Handles input focus - select all text for easy editing.
@@ -3016,7 +3140,7 @@ const co = O(
     handleTimeSelect({ hour: e, minute: t, meridian: s }) {
       if (e && (this.state.hour = e), t && (this.state.minute = t), s && (this.state.meridian = s), this.state.hour && this.state.minute && this.state.meridian) {
         const n = `${this.state.hour}:${this.state.minute} ${this.state.meridian}`;
-        this.state.selectedTime = n, this.state.open = !1, this.input.value = n, j.trigger("change", this.input), typeof this.change == "function" && this.change(n);
+        this.state.selectedTime = n, this.state.open = !1, this.input.value = n, R.trigger("change", this.input), typeof this.change == "function" && this.change(n);
       }
     },
     /**
@@ -3028,7 +3152,7 @@ const co = O(
       return o(
         { class: "relative w-full max-w-[320px]" },
         [
-          pn({
+          zn({
             toggleOpen: this.toggleOpen.bind(this),
             bind: this.bind,
             required: this.required,
@@ -3036,18 +3160,18 @@ const co = O(
             handleInputFocus: this.handleInputFocus.bind(this),
             placeholder: this.placeholder
           }),
-          yn({
+          On({
             handleTimeSelect: this.handleTimeSelect.bind(this)
           })
         ]
       );
     }
   }
-), wn = (e, t) => o({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
+), Nn = (e, t) => o({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
   x({ size: "lg" }, e)
-]), vn = ({ title: e }) => X({ class: "flex flex-auto items-center" }, [
-  Z({ class: "text-lg font-semibold" }, e)
-]), uo = r((e, t) => ht(
+]), Fn = ({ title: e }) => X({ class: "flex flex-auto items-center" }, [
+  J({ class: "text-lg font-semibold" }, e)
+]), zo = 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
@@ -3060,21 +3184,21 @@ const co = O(
     o({ class: "flex flex-auto p-6 pb-12 md:pb-6" }, [
       // Icon and content
       // @ts-ignore
-      e.icon && wn(e.icon, e.iconColor),
+      e.icon && Nn(e.icon, e.iconColor),
       o({ class: "flex flex-auto flex-col gap-4" }, [
         o({ class: "flex flex-auto flex-col gap-y-2" }, [
-          vn(e),
+          Fn(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)
         ]),
         // @ts-ignore
-        e.buttons && he({ class: "flex flex-col-reverse sm:flex-row sm:justify-end mt-6 gap-2 sm:gap-0 sm:gap-x-2" }, e.buttons)
+        e.buttons && ge({ class: "flex flex-col-reverse sm:flex-row sm:justify-end mt-6 gap-2 sm:gap-0 sm:gap-x-2" }, e.buttons)
       ])
     ])
   ]
-)), ho = r((e, t = []) => o({ class: "w-full max-w-md p-6 m-auto" }, [
-  Je({ class: "flex flex-auto flex-col" }, [
+)), Oo = 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" }, [
         // @ts-ignore
@@ -3085,7 +3209,7 @@ const co = O(
       ]),
       X({ class: "py-4 text-center" }, [
         // @ts-ignore
-        Z({ class: "text-xl font-bold" }, e.title),
+        J({ class: "text-xl font-bold" }, e.title),
         // @ts-ignore
         k({ class: "pb-8 text-muted-foreground" }, e.description || ""),
         ...t
@@ -3104,28 +3228,28 @@ r(({ value: e, label: t }) => w({
   dataSet: ["performance", ["state", e, "active"]],
   click: (s, { state: n }) => n.performance = e
 }, t));
-const kn = (e, t) => {
+const Ln = (e, t) => {
   const s = e.toggleAllSelectedRows();
   t.state.checked = !s;
-}, Cn = (e) => Ve({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
-  _((t) => new Ut({ class: "mr-2", onChange: (s, n) => kn(t, n) }))
-]), Sn = ({ align: e, sortable: t, key: s, label: n, sort: a, class: l }) => {
+}, An = (e) => Ke({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
+  V((t) => new Wt({ class: "mr-2", onChange: (s, n) => Ln(t, n) }))
+]), Rn = ({ align: e, sortable: t, key: s, label: n, sort: a, class: l }) => {
   const i = e || "justify-start";
-  return Ve({
+  return Ke({
     class: `cursor-pointer py-3 px-4 text-base ${l || ""}`,
     click: t && (() => a(s))
   }, [
     o({ class: `flex flex-auto w-full items-center ${i}` }, [
-      g(n),
-      t && V({ class: "ml-2", html: u.arrows.upDown })
+      u(n),
+      t && j({ class: "ml-2", html: h.arrows.upDown })
     ])
   ]);
-}, we = (e) => ft([
-  gt({
+}, Se = (e) => xt([
+  pt({
     class: "text-muted-foreground border-b",
     map: [
       e.headers,
-      (t) => t.label === "checkbox" ? Cn({ toggle: e.toggle }) : Sn({
+      (t) => t.label === "checkbox" ? An({ toggle: e.toggle }) : Rn({
         align: t.align,
         sortable: t.sortable,
         key: t.key,
@@ -3134,7 +3258,7 @@ const kn = (e, t) => {
       })
     ]
   })
-]), $n = ({ key: e, rows: t, selectRow: s, rowItem: n, emptyState: a, skeleton: l, columnCount: i }) => new wt({
+]), jn = ({ key: e, rows: t, selectRow: s, rowItem: n, emptyState: a, skeleton: l, columnCount: i }) => new Ct({
   cache: "list",
   key: e,
   items: t,
@@ -3144,7 +3268,7 @@ const kn = (e, t) => {
   skeleton: l,
   columnCount: i
 });
-class et extends C {
+class ot extends S {
   /**
    * Initializes component data.
    *
@@ -3223,14 +3347,14 @@ class et extends C {
   render() {
     const t = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      J("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
+      Q("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${t} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        xe({ class: "w-full" }, [
+        ye({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && we({ headers: this.headers, sort: (n) => this.sortRows(n) }),
+          this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          $n({
+          jn({
             // @ts-ignore
             key: this.key,
             // @ts-ignore
@@ -3309,7 +3433,7 @@ class et extends C {
     this.data.selectedRows = [];
   }
 }
-const Dn = (e) => new vt({
+const En = (e) => new St({
   cache: "list",
   loadMoreItems: e.loadMoreItems,
   offset: e.offset,
@@ -3322,7 +3446,7 @@ const Dn = (e) => new vt({
   skeleton: e.skeleton,
   columnCount: e.columnCount
 });
-class In extends et {
+class Hn extends ot {
   /**
    * Renders the DataTable component.
    *
@@ -3331,14 +3455,14 @@ class In extends et {
   render() {
     const t = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      J("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
+      Q("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${t} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        xe({ class: "w-full" }, [
+        ye({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && we({ headers: this.headers, sort: (n) => this.sortRows(n) }),
+          this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          Dn({
+          En({
             // @ts-ignore
             loadMoreItems: this.loadMoreItems,
             // @ts-ignore
@@ -3374,7 +3498,7 @@ class In extends et {
     this.list.refresh();
   }
 }
-const fo = r((e) => new In(
+const No = r((e) => new Hn(
   {
     // @ts-ignore
     cache: e.cache ?? "list",
@@ -3405,7 +3529,7 @@ const fo = r((e) => new In(
     // @ts-ignore
     skeleton: e.skeleton
   }
-)), Tn = (e) => new kt({
+)), Un = (e) => new $t({
   cache: "list",
   scrollContainer: e.scrollContainer,
   loadMoreItems: e.loadMoreItems,
@@ -3419,7 +3543,7 @@ const fo = r((e) => new In(
   skeleton: e.skeleton,
   columnCount: e.columnCount
 });
-class Mn extends et {
+class Yn extends ot {
   /**
    * Renders the DataTable component.
    *
@@ -3428,14 +3552,14 @@ class Mn extends et {
   render() {
     const t = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      J("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
+      Q("hasItems", (n) => n === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${t} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        xe({ class: "w-full" }, [
+        ye({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && we({ headers: this.headers, sort: (n) => this.sortRows(n) }),
+          this.headers && Se({ headers: this.headers, sort: (n) => this.sortRows(n) }),
           // @ts-ignore
           this.customHeader ?? null,
-          Tn({
+          Un({
             // @ts-ignore
             scrollContainer: this.scrollContainer,
             // @ts-ignore
@@ -3473,7 +3597,7 @@ class Mn extends et {
     this.list.refresh();
   }
 }
-const go = r((e) => new Mn(
+const Fo = r((e) => new Yn(
   {
     // @ts-ignore
     cache: e.cache ?? "list",
@@ -3506,28 +3630,28 @@ const go = r((e) => new Mn(
     // @ts-ignore
     skeleton: e.skeleton
   }
-)), Pn = r(({ name: e, email: t }) => o({ class: "min-w-0 flex-auto" }, [
+)), _n = 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)
-])), Bn = () => o({ class: "flex items-center gap-x-1.5" }, [
+])), Vn = () => 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")
-]), zn = (e) => k({ class: "text-xs leading-5 text-muted-foreground" }, [
-  g("Last seen "),
-  mt({ datetime: e }, "3h ago")
-]), On = (e, t) => e === "online" ? Bn() : zn(t), Nn = r(({ role: e, lastSeen: t, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
+]), Wn = (e) => k({ class: "text-xs leading-5 text-muted-foreground" }, [
+  u("Last seen "),
+  yt({ datetime: e }, "3h ago")
+]), qn = (e, t) => e === "online" ? Vn() : Wn(t), Gn = 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),
-  On(s, t)
-])), Rn = (e) => e.split(" ").map((s) => s[0]).join(""), Fn = r((e) => me({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
+  qn(s, t)
+])), Kn = (e) => e.split(" ").map((s) => s[0]).join(""), Qn = r((e) => xe({ 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
-    ps({ src: e.image, alt: e.name, fallbackText: Rn(e.name) }),
+    zs({ src: e.image, alt: e.name, fallbackText: Kn(e.name) }),
     // @ts-ignore
-    Pn({ name: e.name, email: e.email })
+    _n({ name: e.name, email: e.email })
   ]),
-  Nn({
+  Gn({
     // @ts-ignore
     role: e.role,
     // @ts-ignore
@@ -3535,16 +3659,16 @@ const go = r((e) => new Mn(
     // @ts-ignore
     status: e.status
   })
-])), mo = r((e) => new Ct({
+])), Lo = r((e) => new Dt({
   cache: "list",
   key: "name",
   // @ts-ignore
   items: e.users,
   role: "list",
   class: "divide-y divide-border",
-  rowItem: Fn
+  rowItem: Qn
 }));
-class Ln extends C {
+class Jn extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3605,14 +3729,14 @@ class Ln extends C {
     });
   }
 }
-const jn = r(({ options: e, click: t }, s) => ({
+const Xn = 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
-})), An = (e, t = null, s = !1) => [
+})), Zn = (e, t = null, s = !1) => [
   t && o({
     class: "icon w-12 rounded-md flex items-center justify-center min-w-12",
     onState: ["selected", {
@@ -3621,8 +3745,8 @@ const jn = r(({ options: e, click: t }, s) => ({
   }, [
     x({ size: "sm" }, t)
   ]),
-  W({ class: "label flex flex-auto text-sm items-center cursor-pointer whitespace-nowrap" }, e),
-  s && g(
+  E({ class: "label flex flex-auto text-sm items-center cursor-pointer whitespace-nowrap" }, e),
+  s && u(
     {
       class: "flex justify-center items-center px-1 transition-all text-muted-foreground mr-2",
       onState: [
@@ -3635,11 +3759,11 @@ const jn = r(({ options: e, click: t }, s) => ({
       ]
     },
     [
-      x({ size: "xs" }, u.chevron.single.down)
+      x({ size: "xs" }, h.chevron.single.down)
     ]
   )
 ];
-class tt extends C {
+class lt extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3656,7 +3780,7 @@ class tt extends C {
    */
   render() {
     const t = !this.options && this.callBack;
-    return jn(
+    return Xn(
       { options: this.options, click: t },
       [
         this.addLink()
@@ -3670,8 +3794,8 @@ class tt extends C {
    * @protected
    */
   addLink() {
-    const t = this.options && this.options.length > 0, s = this.content || An(String(this.label), this.icon, t);
-    return this.href ? new pt(
+    const t = this.options && this.options.length > 0, s = this.content || Zn(String(this.label), this.icon, t);
+    return this.href ? new vt(
       {
         class: "flex flex-auto flex-row rounded-md transition-all overflow-x-hidden",
         cache: "link",
@@ -3680,7 +3804,7 @@ class tt extends C {
         exact: this.exact || !1
       },
       s
-    ) : new Ln({
+    ) : new Jn({
       class: "flex flex-auto flex-row rounded-md transition-all overflow-x-hidden",
       cache: "link",
       checkCallBack: this.checkCallBack
@@ -3698,10 +3822,10 @@ class tt extends C {
     this.link.update(t);
   }
 }
-const Hn = r(({ map: e }, t) => ee({ class: "navigation-group flex flex-col gap-2 list-none m-0 py-2 px-0", map: e }, [
-  Ue({ class: "text-muted-foreground text-sm py-0 px-4 whitespace-nowrap" }, t)
+const ea = r(({ map: e }, t) => Z({ class: "navigation-group flex flex-col gap-2 list-none m-0 py-2 px-0", map: e }, [
+  We({ class: "text-muted-foreground text-sm py-0 px-4 whitespace-nowrap" }, t)
 ]));
-class En extends C {
+class ta extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3717,8 +3841,8 @@ class En extends C {
    */
   render() {
     const t = this.mapOptions(this.options), s = this.class || "", n = this.mobileBorder ? "border md:border-0 rounded-md" : "";
-    return ge({ class: `navigation flex flex-auto flex-col ${s}` }, [
-      ee({
+    return be({ class: `navigation flex flex-auto flex-col ${s}` }, [
+      Z({
         class: `relative group flex flex-col gap-2 py-2 px-2 list-none m-0 ${n}`,
         map: t
       }),
@@ -3750,7 +3874,7 @@ class En extends C {
    */
   addGroup(t) {
     const s = this.mapOptions(t.options);
-    return Hn({ map: s }, t.group);
+    return ea({ map: s }, t.group);
   }
   /**
    * This will add a link.
@@ -3759,10 +3883,10 @@ class En extends C {
    * @returns {object}
    */
   addLink(t) {
-    return new tt(t);
+    return new lt(t);
   }
 }
-class st extends En {
+class rt extends ta {
   onCreated() {
     this.links = [];
   }
@@ -3773,7 +3897,7 @@ class st extends En {
    * @returns {object}
    */
   setupSubNav(t) {
-    return new Vn(
+    return new aa(
       {
         parentLink: t,
         options: t.options
@@ -3797,7 +3921,7 @@ class st extends En {
    * @returns {object}
    */
   addLink(t) {
-    const s = new tt(t);
+    const s = new lt(t);
     if (this.links.push(s), !s.options)
       return s;
     const n = this.addSubNav(s);
@@ -3808,11 +3932,11 @@ class st extends En {
     };
   }
 }
-const Un = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), Yn = (e, t) => {
+const sa = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), na = (e, t) => {
   const s = e.link.panel.pathname;
-  return !s && e.isSelected() ? !0 : e.exact ? t === s : Un(s, t);
+  return !s && e.isSelected() ? !0 : e.exact ? t === s : sa(s, t);
 };
-class Vn extends st {
+class aa extends rt {
   /**
    * This will declare the props for the compiler.
    *
@@ -3828,8 +3952,8 @@ class Vn extends st {
    */
   render() {
     const t = `navigation flex flex-auto flex-col sub ${this.mainClassName || ""}`, s = this.mapOptions(this.options);
-    return ge({ class: t, onState: this.onState() }, [
-      ee({ class: "relative group flex flex-col gap-2 py-2 px-0 list-none m-0" }, [...s, ...this.addSubs(), this.addWatcher()])
+    return be({ class: t, onState: this.onState() }, [
+      Z({ class: "relative group flex flex-col gap-2 py-2 px-0 list-none m-0" }, [...s, ...this.addSubs(), this.addWatcher()])
     ]);
   }
   /**
@@ -3841,7 +3965,7 @@ class Vn extends st {
   addWatcher() {
     return {
       watch: {
-        value: ["[[path]]", ke.data],
+        value: ["[[path]]", De.data],
         callBack: this.updateLinks.bind(this)
       }
     };
@@ -3882,7 +4006,7 @@ class Vn extends st {
    * @returns {void}
    */
   afterSetup() {
-    const t = ke.data.path;
+    const t = De.data.path;
     this.updateLinks(t);
   }
   /**
@@ -3894,27 +4018,27 @@ class Vn extends st {
   updateLinks(t) {
     let s = !1;
     for (const n of this.links)
-      if (n.rendered && (s = Yn(n, t), s === !0))
+      if (n.rendered && (s = na(n, t), s === !0))
         break;
     this.parentLink.update(s);
   }
 }
-const Wn = (e) => fe({ class: "text-lg ml-2" }, e), _n = (e) => o({ class: "sticky flex flex-row items-center bg-popover lg:hidden top-0 z-10 border-0 border-b" }, [
+const oa = (e) => me({ class: "text-lg ml-2" }, e), la = (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: u.arrows.left
+    icon: h.arrows.left
   }),
-  e.title && Wn(e.title)
-]), qn = () => o({
+  e.title && oa(e.title)
+]), ra = () => o({
   class: `
 			absolute inset-0 bg-black/40 z-[-1] fadeIn
 			transition-opacity duration-200
 		`,
   click: (e, { state: t }) => t.open = !1
 });
-class Gn extends C {
+class ia extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -3933,7 +4057,7 @@ class Gn extends C {
       class: "fixed inset-0 z-50",
       style: "[[typeClass]]"
     }, [
-      qn(),
+      ra(),
       // Popover Content
       o({
         class: `
@@ -3942,7 +4066,7 @@ class Gn extends C {
         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" }, [
-          _n({ title: this.title }),
+          la({ title: this.title }),
           o({ class: "flex flex-auto flex-col" }, this.children)
         ])
       ])
@@ -3980,31 +4104,31 @@ class Gn extends C {
     this.container = app.root;
   }
 }
-const nt = () => b({ class: "m-2", variant: "ghost", addState() {
+const it = () => b({ class: "m-2", variant: "ghost", addState() {
   return {
     open: !1
   };
 }, click: (e, { state: t }) => t.toggle("open") }, [
-  x({}, u.bar.three)
-]), Kn = (e) => fe({ class: "text-lg ml-2" }, e), Qn = (e) => o({ class: "flex flex-auto flex-row items-center lg:hidden" }, [
-  nt(),
-  e.title && Kn(e.title)
-]), at = (e, t) => {
+  x({}, h.bar.three)
+]), ca = (e) => me({ class: "text-lg ml-2" }, e), da = (e) => o({ class: "flex flex-auto flex-row items-center lg:hidden" }, [
+  it(),
+  e.title && ca(e.title)
+]), ct = (e, t) => {
   e.forEach((s) => {
     if (s.options) {
-      at(s.options, t);
+      ct(s.options, t);
       return;
     }
     s.callBack = t;
   });
-}, ot = (e) => o({ class: "bg-background flex flex-auto flex-col w-full relative" }, [
-  T(
+}, dt = (e) => o({ class: "bg-background flex flex-auto flex-col w-full relative" }, [
+  M(
     "open",
     (t) => t ? [
-      new Gn({ title: e.title }, [
-        _(({ state: s }) => {
+      new ia({ title: e.title }, [
+        V(({ state: s }) => {
           const n = (a) => s.open = !1;
-          return at(e.options, n), new st(
+          return ct(e.options, n), new rt(
             {
               options: e.options
             }
@@ -4013,23 +4137,23 @@ const nt = () => b({ class: "m-2", variant: "ghost", addState() {
       ])
     ] : null
   )
-]), bo = r((e) => o({ cache: "mobileNav", class: "inline-flex relative lg:hidden" }, [
+]), Ao = r((e) => o({ cache: "mobileNav", class: "inline-flex relative lg:hidden" }, [
   o([
-    nt(),
-    ot(e)
+    it(),
+    dt(e)
   ])
-])), xo = r((e) => o({ cache: "mobileNav", class: "flex flex-auto flex-col w-full relative lg:hidden" }, [
+])), Ro = 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" }, [
-    Qn(e),
-    ot(e)
+    da(e),
+    dt(e)
   ])
-])), po = r((e) => {
+])), jo = r((e) => {
   const t = e.margin || "m-4 ml-0";
   return e.allowHistory = e.allowHistory === !0, o({ class: `flex-none ${t}` }, [
     b({ variant: "back", class: "ghost", ...e })
   ]);
 });
-class Jn extends C {
+class ua extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -4124,13 +4248,13 @@ class Jn extends C {
     return this.children;
   }
 }
-We.addType("dockableOverlay", (e) => {
+Je.addType("dockableOverlay", (e) => {
   if (!e)
     return;
   const t = e.component;
   t && t.rendered === !0 && t.state.docked === !1 && t.destroy();
 });
-class yo extends Jn {
+class Eo extends ua {
   /**
    * This will stop presistence.
    *
@@ -4200,7 +4324,7 @@ class yo extends Jn {
    * @returns {void}
    */
   afterSetup() {
-    We.add(
+    Je.add(
       this.container,
       "dockableOverlay",
       {
@@ -4235,7 +4359,7 @@ class yo extends Jn {
     this.state.docked = this.canDock();
   }
 }
-const Zn = r(({ index: e, click: t, state: s }, n) => me({
+const ha = r(({ index: e, click: t, state: s }, n) => xe({
   class: "p-2 cursor-pointer hover:bg-muted/50",
   onState: [
     [s, "selectedIndex", {
@@ -4244,10 +4368,10 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
     }]
   ],
   click: () => t(e)
-}, n)), Xn = r(({ selectOption: e, state: t }) => ee({
+}, n)), fa = r(({ selectOption: e, state: t }) => Z({
   class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, n) => Zn({ index: n, click: e, state: t }, s.label)]
-})), ea = r((e) => o({ class: "relative flex flex-auto items-center" }, [
+  for: ["filteredOptions", (s, n) => ha({ index: n, click: e, state: t }, s.label)]
+})), ga = r((e) => o({ class: "relative flex flex-auto items-center" }, [
   N({
     cache: "input",
     // @ts-ignore
@@ -4272,7 +4396,7 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
     // @ts-ignore
     x({ size: "sm" }, e.icon)
   ])
-])), ta = (e) => o({
+])), ma = (e) => o({
   class: "relative flex fle-auto flex-col",
   onState: ["open", (t, s, n) => {
     if (t)
@@ -4282,10 +4406,10 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
         button: n.input,
         size: "xl"
       }, [
-        Xn(e)
+        fa(e)
       ]);
   }]
-}), wo = M(
+}), Ho = P(
   {
     /**
      * This will set up the data object.
@@ -4382,7 +4506,7 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
      */
     render() {
       return o({ class: "relative w-full max-w-md" }, [
-        ea({
+        ga({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -4394,7 +4518,7 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
           // @ts-ignore
           handleKeyDown: this.handleKeyDown.bind(this)
         }),
-        ta({
+        ma({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -4405,8 +4529,8 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
       ]);
     }
   }
-), vo = r((e) => {
-  const t = e.icon ?? u.magnifyingGlass.default;
+), Uo = r((e) => {
+  const t = e.icon ?? h.magnifyingGlass.default;
   return o({
     // @ts-ignore
     class: `relative flex items-center w-full rounded-xl bg-muted/30 focus-within:ring-2 focus-within:ring-ring transition-all ${e.containerClass || ""}`
@@ -4441,7 +4565,7 @@ const Zn = r(({ index: e, click: t, state: s }, n) => me({
     })
   ]);
 });
-class sa extends C {
+class ba extends S {
   /**
    * This will declare the props for the compiler.
    *
@@ -4459,7 +4583,7 @@ class sa extends C {
     return o({ class: `${this.class || ""}` }, this.children);
   }
 }
-class na extends sa {
+class xa extends ba {
   /**
    * This will be called every time the route
    * is activated.
@@ -4469,15 +4593,15 @@ class na extends sa {
   update(t) {
   }
 }
-const aa = r((e, t) => (e.class = "basic-page pt-[80px] sm:pt-0 flex flex-auto flex-col " + (e.class || ""), {
+const pa = r((e, t) => (e.class = "basic-page pt-[80px] sm:pt-0 flex flex-auto flex-col " + (e.class || ""), {
   tag: "section",
   ...e,
   children: t
-})), oa = r(({ title: e, description: t }) => X({ class: "sm:py-8 px-6 md:px-5 flex flex-col" }, [
-  bt({ class: "scroll-m-20 text-3xl font-bold tracking-tight" }, e),
+})), ya = r(({ title: e, description: t }) => X({ 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 ko extends na {
+class Yo extends xa {
   /**
    * This will declare the props for the compiler.
    *
@@ -4492,133 +4616,141 @@ class ko extends na {
    * @returns {object}
    */
   render() {
-    return aa([
-      oa({
+    return pa([
+      ya({
         title: this.title,
         description: this.description
       }),
-      St(this.children)
+      It(this.children)
     ]);
   }
 }
 export {
-  za as $,
-  Ua as A,
-  po as B,
-  _s as C,
-  et as D,
-  Ga as E,
-  uo as F,
-  yo as G,
-  ao as H,
-  fo as I,
-  va as J,
-  ho as K,
-  ya as L,
-  Na as M,
-  Je as N,
-  Ya as O,
-  Wa as P,
-  Va as Q,
-  os as R,
-  ss as S,
-  _a as T,
-  Ft as U,
-  es as V,
-  ts as W,
-  ns as X,
-  L as Y,
-  ko as Z,
-  Sn as _,
-  ps as a,
-  B as a$,
-  ce as a0,
-  _t as a1,
-  to as a2,
-  st as a3,
-  N as a4,
-  Rt as a5,
-  pa as a6,
-  so as a7,
-  tt as a8,
-  aa as a9,
-  wo as aA,
-  ea as aB,
-  Fa as aC,
-  vo as aD,
-  Ka as aE,
-  Vn as aF,
-  we as aG,
-  wa as aH,
-  ka as aI,
-  Xa as aJ,
-  $a as aK,
-  co as aL,
-  Qn as aM,
-  eo as aN,
-  ma as aO,
-  Ea as aP,
-  x as aQ,
-  Ba as aR,
-  mo as aS,
-  Fn as aT,
-  _e as aU,
-  O as aV,
-  Ta as aW,
-  Ns as aX,
-  Xt as aY,
-  fa as aZ,
-  ha as a_,
-  De as aa,
-  Ps as ab,
-  bo as ac,
-  xo as ad,
-  Vs as ae,
-  Ia as af,
-  nt as ag,
-  Ln as ah,
-  En as ai,
-  Hn as aj,
-  Gn as ak,
-  Za as al,
-  Ma as am,
-  Jn as an,
-  sa as ao,
-  Pa as ap,
-  Bs as aq,
-  se as ar,
-  _n as as,
-  ja as at,
-  Ca as au,
-  dn as av,
-  Ra as aw,
-  Aa as ax,
-  Ha as ay,
-  go as az,
-  qn as b,
-  Ja as b0,
-  ga as c,
-  na as d,
-  no as e,
+  go as $,
+  co as A,
+  jo as B,
+  ln as C,
+  ot as D,
+  bo as E,
+  zo as F,
+  Eo as G,
+  Do as H,
+  No as I,
+  Ua as J,
+  Oo as K,
+  Oa as L,
+  to as M,
+  Fa as N,
+  te as O,
+  Aa as P,
+  La as Q,
+  Ea as R,
+  Na as S,
+  ja as T,
+  Ra as U,
+  st as V,
+  uo as W,
+  fo as X,
+  ho as Y,
+  ys as Z,
+  bs as _,
+  zs as a,
+  Qn as a$,
+  Et as a0,
+  gs as a1,
+  ms as a2,
+  xs as a3,
+  A as a4,
+  Yo as a5,
+  Rn as a6,
+  Za as a7,
+  de as a8,
+  ls as a9,
+  la as aA,
+  oo as aB,
+  _a as aC,
+  Sn as aD,
+  so as aE,
+  lo as aF,
+  ro as aG,
+  Fo as aH,
+  Ho as aI,
+  ga as aJ,
+  no as aK,
+  Uo as aL,
+  xo as aM,
+  aa as aN,
+  Se as aO,
+  Ha as aP,
+  Ya as aQ,
+  vo as aR,
+  Wa as aS,
+  Bo as aT,
+  da as aU,
+  ko as aV,
+  Ma as aW,
+  io as aX,
+  x as aY,
+  Xa as aZ,
+  Lo as a_,
+  Co as aa,
+  rt as ab,
+  N as ac,
+  jt as ad,
+  za as ae,
+  So as af,
+  lt as ag,
+  pa as ah,
+  Pe as ai,
+  _s as aj,
+  Ao as ak,
+  Ro as al,
+  an as am,
+  Ga as an,
+  it as ao,
+  Jn as ap,
+  ta as aq,
+  ea as ar,
+  ia as as,
+  wo as at,
+  Qa as au,
+  ua as av,
+  ba as aw,
+  Ja as ax,
+  Vs as ay,
+  se as az,
+  ra as b,
+  Xe as b0,
+  O as b1,
+  Ka as b2,
+  Gs as b3,
+  fs as b4,
+  Ia as b5,
+  Da as b6,
+  B as b7,
+  yo as b8,
+  Ta as c,
+  xa as d,
+  $o as e,
   b as f,
-  Hs as g,
-  Nt as h,
-  Ut as i,
-  Cn as j,
-  xa as k,
-  La as l,
-  ba as m,
-  Oa as n,
-  Qa as o,
-  oo as p,
-  zs as q,
-  lo as r,
-  $n as s,
-  Sa as t,
-  ro as u,
-  io as v,
-  Da as w,
-  le as x,
-  Us as y,
-  qa as z
+  en as g,
+  Rt as h,
+  Wt as i,
+  An as j,
+  Ba as k,
+  ao as l,
+  Pa as m,
+  eo as n,
+  po as o,
+  Io as p,
+  Ws as q,
+  To as r,
+  jn as s,
+  Va as t,
+  Mo as u,
+  Po as v,
+  qa as w,
+  re as x,
+  sn as y,
+  mo as z
 };