@base-framework/ui 1.0.229 → 1.0.231

package/dist/index.es.js

@@ -5,7 +5,7 @@ import { V as w, a as R } from "./veil-D4dRxILB.js";
 import { Icons as E } from "./icons.es.js";
 import { A as O, B as V, C as j, t as q, E as z, v as J, w as _, x as K, D as Q, j as X, k as Y, H as Z, G as $, s as aa, c as ea, a as sa, b as oa, I as ta, i as ra, g as na, e as la, h as ia, F as pa, d as ua, f as ma, u as da, M as ca, l as ga, N as Ca, P as Ta, p as ba, q as Da, S as Ia, n as Sa, o as Ba, T as Pa, y as Fa, z as Ma, m as ka, r as Na } from "./empty-state-2O1fITpG.js";
 import { A as va, b as xa, C as ya, D as ha, a as Wa, F as Ha, M as La, P as Aa, c as wa, g as Ra, p as Ua } from "./calendar-Bn55oWBo.js";
-import { B as Ga, p as Oa, C as Va, j as ja, D as qa, m as za, k as Ja, H as _a, I as Ka, N as Qa, O as Xa, P as Ya, R as Za, S as $a, n as ae, o as ee, t as se, s as oe, q as te, r as re, T as ne, l as le, U as ie, W as pe, f as ue, h as me, i as de, c as ce, d as ge, b as Ce, e as Te, a as be, g as De } from "./signature-panel-B1BZiFct.js";
+import { B as Ga, p as Oa, C as Va, j as ja, D as qa, m as za, k as Ja, H as _a, I as Ka, N as Qa, O as Xa, P as Ya, R as Za, S as $a, n as ae, o as ee, t as se, s as oe, q as te, r as re, T as ne, l as le, U as ie, W as pe, f as ue, h as me, i as de, c as ce, d as ge, b as Ce, e as Te, a as be, g as De } from "./signature-panel-B7ItSnD5.js";
 import { B as Se, I as Be, M as Pe, d as Fe, e as Me, g as ke, N as Ne, b as fe, a as ve, f as xe, P as ye, c as he, S as We, T as He } from "./mobile-nav-wrapper-Dj67Pb8l.js";
 import { B as Ae, a as we, C as Re, F as Ue, b as Ee, c as Ge, M as Oe, P as Ve, S as je } from "./sidebar-menu-page-BVryQj2Z.js";
 import { A as ze, F as Je, M as _e, a as Ke, T as Qe } from "./aside-template-McEj_Gxc.js";

package/dist/organisms.es.js

@@ -1,4 +1,4 @@
-import { B as s, p as t, C as o, j as r, D as n, m as l, k as i, H as b, I as d, N as g, O as p, P as u, R as v, S as D, n as N, o as k, t as C, s as c, q as T, r as M, T as m, l as y, U as B, W, f as h, h as S, i as H, c as P, d as I, b as f, e as x, a as L, g as O } from "./signature-panel-B1BZiFct.js";
+import { B as s, p as t, C as o, j as r, D as n, m as l, k as i, H as b, I as d, N as g, O as p, P as u, R as v, S as D, n as N, o as k, t as C, s as c, q as T, r as M, T as m, l as y, U as B, W, f as h, h as S, i as H, c as P, d as I, b as f, e as x, a as L, g as O } from "./signature-panel-B7ItSnD5.js";
 import { b as U, C as G, D as R, a as j, F as q, M as w, c as z, p as A } from "./calendar-Bn55oWBo.js";
 import { B as J, I as K, M as Q, d as V, e as X, g as Y, N as Z, b as _, a as $, f as aa, P as ea, c as sa, S as ta, T as oa } from "./mobile-nav-wrapper-Dj67Pb8l.js";
 export {

package/dist/{signature-panel-B1BZiFct.js → signature-panel-B7ItSnD5.js}

@@ -1,22 +1,22 @@
-import { Button as S, Div as o, On as w, Span as C, OnState as K, Th as F, UseParent as G, I as J, Thead as _, Tr as V, Table as P, P as x, Li as I, Time as Z, Nav as M, Ul as k, Section as H, Canvas as tt } from "@base-framework/atoms";
-import { Atom as f, Component as g, Data as L, DateTime as $, router as D, NavLink as U, DataTracker as E, Jot as et, base as O, Dom as N } from "@base-framework/base";
-import { B as m, I as st } from "./buttons-Cm9etaEG.js";
-import { Icons as b } from "./icons.es.js";
-import { F as at, p as v, A as nt, P as it } from "./calendar-Bn55oWBo.js";
-import { TableBody as ot, DataTableBody as lt, ScrollableTableBody as rt, List as ct, IntervalTimer as dt } from "@base-framework/organisms";
-import { C as ht, I as ut, H as ft } from "./inputs-CMjx5-IX.js";
-f((e, t) => ({
+import { Button as P, Div as o, On as k, Span as $, OnState as at, Th as J, UseParent as nt, I as it, Thead as ot, Tr as lt, Table as A, P as T, Li as W, Time as rt, Nav as N, Ul as B, Section as _, Canvas as ct } from "@base-framework/atoms";
+import { Atom as g, Component as m, Data as j, DateTime as F, router as O, NavLink as V, DataTracker as Z, Jot as dt, base as U, Dom as Q } from "@base-framework/base";
+import { B as p, I as ht } from "./buttons-Cm9etaEG.js";
+import { Icons as v } from "./icons.es.js";
+import { F as Y, p as R, A as ut, P as ft } from "./calendar-Bn55oWBo.js";
+import { TableBody as gt, DataTableBody as mt, ScrollableTableBody as pt, List as yt, IntervalTimer as wt } from "@base-framework/organisms";
+import { C as bt, I as xt, H as kt } from "./inputs-CMjx5-IX.js";
+g((e, t) => ({
   class: "flex items-center px-4 py-2",
   ...e,
   children: t
 }));
-f(({ value: e, label: t }) => S({
+g(({ value: e, label: t }) => P({
   class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-md px-8 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
   onState: ["performance", { active: e }],
   dataSet: ["performance", ["state", e, "active"]],
   click: (s, { state: a }) => a.performance = e
 }, t));
-class be extends g {
+class Me extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -34,36 +34,36 @@ class be extends g {
     return o({ class: this.class || "" }, this.children);
   }
 }
-const gt = (e) => {
+const vt = (e) => {
   const t = new Date(e, 11, 31), s = new Date(e, 0, 1);
   return t.getDay() === 4 || // December 31 is a Thursday
   s.getDay() === 4;
-}, mt = (e) => {
+}, Dt = (e) => {
   const t = new Date(e.valueOf()), s = (t.getDay() + 6) % 7;
   t.setDate(t.getDate() - s + 3);
   const a = t.getFullYear(), n = new Date(a, 0, 4);
   n.setDate(n.getDate() - (n.getDay() + 6) % 7);
   const i = Math.ceil((t - n) / 6048e5) + 1;
-  return i > 52 && !gt(a) ? {
+  return i > 52 && !vt(a) ? {
     weekNumber: 1,
     year: a + 1
   } : {
     weekNumber: i,
     year: a
   };
-}, pt = (e, t, s) => {
+}, St = (e, t, s) => {
   if (s === 0) return [];
   const a = new Date(e, t, 0).getDate();
   return Array.from(
     { length: s },
     (n, i) => new Date(e, t - 1, a - s + i + 1)
   );
-}, yt = (e, t, s) => Array.from({ length: s }, (a, n) => new Date(e, t + 1, n + 1)), z = (e, t) => {
+}, Ct = (e, t, s) => Array.from({ length: s }, (a, n) => new Date(e, t + 1, n + 1)), X = (e, t) => {
   const s = new Date(t, 0, 4), a = (s.getDay() + 6) % 7, n = new Date(s);
   n.setDate(s.getDate() - a);
   const i = new Date(n);
   return i.setDate(n.getDate() + (e - 1) * 7), i;
-}, xe = (e, t) => {
+}, Le = (e, t) => {
   const s = new Date(e, t, 1).getDay(), a = new Date(e, t + 1, 0).getDate(), n = [];
   let i = [];
   for (let l = 1 - s; l <= a; l++) {
@@ -71,18 +71,18 @@ const gt = (e) => {
     i.push(l > 0 ? r : null), (i.length === 7 || l === a) && (n.push([...i]), i = []);
   }
   return n;
-}, ke = (e, t) => {
+}, Te = (e, t) => {
   const s = new Date(e, t + 1, 0).getDate(), a = [];
   let n = [];
   for (let i = 1; i <= s; i++)
     n.push(new Date(e, t, i)), n.length === 7 && (a.push(n), n = []);
   return n.length > 0 && a.push(n), a;
-}, wt = (e, t, s) => {
+}, It = (e, t, s) => {
   const a = /* @__PURE__ */ new Date();
   return a.getDate() === e && a.getMonth() === t && a.getFullYear() === s;
-}, bt = ({ day: e, month: t, year: s, weekNumber: a, selectWeek: n }) => {
-  const i = wt(e, t, s);
-  return S({
+}, Mt = ({ day: e, month: t, year: s, weekNumber: a, selectWeek: n }) => {
+  const i = It(e, t, s);
+  return P({
     text: e || "",
     disabled: !e,
     class: `
@@ -92,19 +92,19 @@ const gt = (e) => {
 		`,
     click: () => n(a, s)
   });
-}, xt = (e, t) => {
-  const s = new Date(e, t, 1).getDay(), a = new Date(e, t + 1, 0).getDate(), n = pt(e, t, s), i = Array.from({ length: a }, (h, p) => new Date(e, t, p + 1)), l = (n.length + i.length) % 7, r = l === 0 ? 0 : 7 - l, c = yt(e, t, r), d = [...n, ...i, ...c], u = [];
-  for (let h = 0; h < d.length; h += 7) {
-    const p = d.slice(h, h + 7), y = p.find((R) => R) || new Date(e, t, 1), { weekNumber: T, year: B } = mt(y);
-    u.push({
-      weekNumber: T,
-      year: B,
-      days: p
+}, Lt = (e, t) => {
+  const s = new Date(e, t, 1).getDay(), a = new Date(e, t + 1, 0).getDate(), n = St(e, t, s), i = Array.from({ length: a }, (u, b) => new Date(e, t, b + 1)), l = (n.length + i.length) % 7, r = l === 0 ? 0 : 7 - l, c = Ct(e, t, r), h = [...n, ...i, ...c], y = [];
+  for (let u = 0; u < h.length; u += 7) {
+    const b = h.slice(u, u + 7), x = b.find((d) => d) || new Date(e, t, 1), { weekNumber: E, year: z } = Dt(x);
+    y.push({
+      weekNumber: E,
+      year: z,
+      days: b
     });
   }
-  return u;
-}, kt = ({ selectWeek: e }) => w("month", (t, s, { data: a }) => {
-  const { year: n, month: i, currentDate: l } = a, r = xt(n, i);
+  return y;
+}, Tt = ({ selectWeek: e }) => k("month", (t, s, { data: a }) => {
+  const { year: n, month: i, currentDate: l } = a, r = Lt(n, i);
   return o(
     { class: "grid grid-cols-8 gap-1 text-sm px-4 py-2" },
     [
@@ -115,12 +115,12 @@ const gt = (e) => {
           class: "grid grid-cols-7 col-span-7 text-center text-muted-foreground items-center"
         },
         ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(
-          (c) => C({ class: "px-1 py-1", text: c })
+          (c) => $({ class: "px-1 py-1", text: c })
         )
       ),
       // Render each "week" row
       ...r.map(
-        ({ weekNumber: c, days: d, year: u }) => o({
+        ({ weekNumber: c, days: h, year: y }) => o({
           class: "grid grid-cols-8 col-span-8 items-center ring-primary rounded-sm px-1",
           onSet: ["currentWeek", {
             ring: c
@@ -129,7 +129,7 @@ const gt = (e) => {
           // Left column: ISO week number
           o({
             class: "font-medium text-center col-span-1 rounded-sm cursor-pointer",
-            click: () => e(c, u),
+            click: () => e(c, y),
             // If you have a 'currentWeek' state, you can highlight it with 'onSet'
             onSet: ["currentWeek", {
               "text-primary-foreground": c,
@@ -140,11 +140,11 @@ const gt = (e) => {
           // The 7 cells for each day in the row
           o(
             { class: "grid grid-cols-7 col-span-7 text-center" },
-            d.map(
-              (h) => bt({
-                year: (h == null ? void 0 : h.getFullYear()) || null,
-                month: (h == null ? void 0 : h.getMonth()) || null,
-                day: (h == null ? void 0 : h.getDate()) || null,
+            h.map(
+              (u) => Mt({
+                year: (u == null ? void 0 : u.getFullYear()) || null,
+                month: (u == null ? void 0 : u.getMonth()) || null,
+                day: (u == null ? void 0 : u.getDate()) || null,
                 weekNumber: c,
                 selectWeek: e
               })
@@ -154,7 +154,7 @@ const gt = (e) => {
       )
     ]
   );
-}), Y = ({ label: e, click: t }) => m(
+}), q = ({ label: e, click: t }) => p(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -165,20 +165,20 @@ const gt = (e) => {
     click: t,
     "aria-label": `${e} month`,
     variant: "icon",
-    icon: e === "Previous" ? b.chevron.single.left : b.chevron.single.right
+    icon: e === "Previous" ? v.chevron.single.left : v.chevron.single.right
   }
-), vt = ({ next: e, previous: t }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
-  C("[[monthName]] [[year]]"),
-  Y({
+), Bt = ({ next: e, previous: t }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
+  $("[[monthName]] [[year]]"),
+  q({
     label: "Previous",
     click: t
   }),
-  Y({
+  q({
     label: "Next",
     click: e
   })
 ]);
-class ve extends g {
+class Be extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -193,8 +193,8 @@ class ve extends g {
    * @returns {Data}
    */
   setData() {
-    const t = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(t), a = z(s, t.getFullYear());
-    return new L({
+    const t = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(t), a = X(s, t.getFullYear());
+    return new j({
       monthName: this.getMonthName(a.getMonth()),
       year: a.getFullYear(),
       month: a.getMonth(),
@@ -231,7 +231,7 @@ class ve extends g {
    * @returns {string}
    */
   getMonthName(t) {
-    return $.monthNames[t];
+    return F.monthNames[t];
   }
   /**
    * Updates the calendar to show the previous month.
@@ -276,7 +276,7 @@ class ve extends g {
    */
   selectWeek(t, s) {
     this.data.currentWeek = t;
-    const a = z(t, s);
+    const a = X(t, s);
     this.setDate(a.getMonth(), a.getFullYear(), a.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(t);
   }
   /**
@@ -286,17 +286,17 @@ class ve extends g {
    */
   render() {
     return o({ class: "week-calendar-container border rounded-md bg-background p-3" }, [
-      vt({
+      Bt({
         next: () => this.goToNextMonth(),
         previous: () => this.goToPreviousMonth()
       }),
-      kt({
+      Tt({
         selectWeek: (t, s) => this.selectWeek(t, s)
       })
     ]);
   }
 }
-const j = ({ label: e, click: t }) => m(
+const K = ({ label: e, click: t }) => p(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -307,61 +307,90 @@ const j = ({ label: e, click: t }) => m(
     click: t,
     "aria-label": `${e} month`,
     variant: "icon",
-    icon: e === "Previous" ? b.chevron.single.left : b.chevron.single.right
-  }
-), Dt = ({ onMonthClick: e, onYearClick: t, next: s, previous: a }) => o({ class: "flex items-center justify-center space-x-2 relative min-h-12 text-sm font-medium" }, [
-  m({ click: e, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
-  m({ click: t, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
-  j({ label: "Previous", click: a }),
-  j({ label: "Next", click: s })
-]), St = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), Ct = () => o(
+    icon: e === "Previous" ? v.chevron.single.left : v.chevron.single.right
+  }
+), Rt = ({ onMonthClick: e, onYearClick: t, next: s, previous: a }) => o({ class: "flex items-center justify-center space-x-2 relative min-h-12 text-sm font-medium" }, [
+  p({ click: e, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
+  p({ click: t, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
+  K({ label: "Previous", click: a }),
+  K({ label: "Next", click: s })
+]), Ot = (e) => o({ class: "h-9 flex items-center justify-center font-medium" }, e), Pt = () => 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(St)
-), It = ({ day: e, iso: t, disabled: s, isStart: a, isEnd: n, isBetween: i, click: l }) => {
-  let r = "ghost", c = "";
-  return a || n ? (r = "default", c = "bg-primary text-primary-foreground hover:bg-primary/90") : i && (c = "bg-accent text-accent-foreground hover:bg-accent/80"), s && (c += " opacity-50 cursor-not-allowed"), m(
+  ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(Ot)
+), $t = ({ day: e, iso: t, disabled: s, isStart: a, isEnd: n, isBetween: i, isOtherMonth: l, click: r }) => {
+  let c = "ghost", h = "";
+  return a || n ? (c = "default", h = "bg-primary text-primary-foreground hover:bg-primary/90") : i && (h = "bg-accent text-accent-foreground hover:bg-accent/80"), s && (h += " opacity-50 cursor-not-allowed"), l && (h += " text-muted-foreground opacity-50"), p(
     {
-      class: `flex items-center justify-center p-0 text-sm font-medium rounded-md transition-colors ${c}`,
-      variant: r,
+      class: `flex items-center justify-center p-0 text-sm font-medium rounded-md transition-colors ${h}`,
+      variant: c,
       disabled: s,
       click: () => {
-        s || l();
+        s || r();
       }
     },
     e.toString()
   );
-}, Mt = ({ today: e, current: t, blockPriorDates: s, onDateClick: a }) => {
-  const { start: n, end: i } = t, l = new Date(t.year, t.month, 1).getDay(), r = new Date(t.year, t.month + 1, 0).getDate(), c = [];
-  for (let d = 0; d < l; d++)
-    c.push(null);
+}, Wt = ({ today: e, current: t, blockPriorDates: s, onDateClick: a }) => {
+  const { start: n, end: i } = t, l = new Date(t.year, t.month, 1).getDay(), r = new Date(t.year, t.month + 1, 0).getDate(), c = [], h = t.month === 0 ? 11 : t.month - 1, y = t.month === 0 ? t.year - 1 : t.year, u = new Date(y, h + 1, 0).getDate(), b = t.month === 11 ? 0 : t.month + 1, x = t.month === 11 ? t.year + 1 : t.year;
+  for (let d = l - 1; d >= 0; d--) {
+    const f = u - d, w = Y(y, h, f), D = new Date(y, h, f), S = new Date(e.year, e.month, e.date), C = D < S, I = s && C, M = n === w, L = i === w, st = n && i && w > n && w < i;
+    c.push({
+      day: f,
+      iso: w,
+      disabled: I,
+      isStart: M,
+      isEnd: L,
+      isBetween: st,
+      isOtherMonth: !0,
+      click: () => a(w)
+    });
+  }
   for (let d = 1; d <= r; d++) {
-    const u = at(t.year, t.month, d), h = new Date(t.year, t.month, d), p = new Date(e.year, e.month, e.date), y = h < p, T = s && y, B = n === u, R = i === u, q = n && i && u > n && u < i;
+    const f = Y(t.year, t.month, d), w = new Date(t.year, t.month, d), D = new Date(e.year, e.month, e.date), S = w < D, C = s && S, I = n === f, M = i === f, L = n && i && f > n && f < i;
     c.push({
       day: d,
-      iso: u,
-      disabled: T,
-      isStart: B,
-      isEnd: R,
-      isBetween: q,
-      click: () => a(u)
+      iso: f,
+      disabled: C,
+      isStart: I,
+      isEnd: M,
+      isBetween: L,
+      isOtherMonth: !1,
+      click: () => {
+        console.log(f), a(f);
+      }
+    });
+  }
+  const z = 42 - c.length;
+  for (let d = 1; d <= z; d++) {
+    const f = Y(x, b, d), w = new Date(x, b, d), D = new Date(e.year, e.month, e.date), S = w < D, C = s && S, I = n === f, M = i === f, L = n && i && f > n && f < i;
+    c.push({
+      day: d,
+      iso: f,
+      disabled: C,
+      isStart: I,
+      isEnd: M,
+      isBetween: L,
+      isOtherMonth: !0,
+      click: () => a(f)
     });
   }
   return o(
     { class: "grid grid-cols-7 gap-1" },
     c.map(
-      (d, u) => d ? It({
+      (d, f) => $t({
         day: d.day,
         iso: d.iso,
         disabled: d.disabled,
         isStart: d.isStart,
         isEnd: d.isEnd,
         isBetween: d.isBetween,
+        isOtherMonth: d.isOtherMonth,
         click: d.click
-      }) : o({ class: "h-9" })
+      })
     )
   );
-}, Lt = f((e, t) => o({ class: "flex flex-auto flex-col" }, [
-  Dt({
+}, Nt = g((e, t) => o({ class: "flex flex-auto flex-col" }, [
+  Rt({
     onMonthClick: e.onMonthClick,
     onYearClick: e.onYearClick,
     next: e.next,
@@ -372,8 +401,8 @@ const j = ({ label: e, click: t }) => m(
     onSet: [
       "currentDate",
       () => [
-        Ct(),
-        Mt({
+        Pt(),
+        Wt({
           today: e.today,
           current: e.current,
           blockPriorDates: e.blockPriorDates,
@@ -382,10 +411,10 @@ const j = ({ label: e, click: t }) => m(
       ]
     ]
   })
-])), Tt = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
+])), jt = ({ currentMonth: e, currentYear: t, onSelect: s }) => o(
   { class: "grid grid-cols-3 gap-2" },
-  $.monthNames.map(
-    (a, n) => m(
+  F.monthNames.map(
+    (a, n) => p(
       {
         click: (i) => {
           i.preventDefault(), i.stopPropagation(), s(n);
@@ -396,30 +425,30 @@ const j = ({ label: e, click: t }) => m(
       a.substring(0, 3)
     )
   )
-), Bt = ({ start: e, end: t, selecting: s, onSelectStart: a, onSelectEnd: n }) => o({ class: "flex space-x-2 mb-4" }, [
-  w("selecting", (i) => m({
+), zt = ({ start: e, end: t, selecting: s, onSelectStart: a, onSelectEnd: n }) => o({ class: "flex space-x-2 mb-4" }, [
+  k("selecting", (i) => p({
     click: a,
     variant: i === "start" ? "primary" : "outline",
     class: "flex-1"
   }, [
-    o({ class: "font-medium" }, A("current.start", "Start Date"))
+    o({ class: "font-medium" }, G("current.start", "Start Date"))
   ])),
-  w("selecting", (i) => m({
+  k("selecting", (i) => p({
     click: n,
     variant: i === "end" ? "primary" : "outline",
     class: "flex-1"
   }, [
-    o({ class: "font-medium" }, A("current.end", "End Date"))
+    o({ class: "font-medium" }, G("current.end", "End Date"))
   ]))
-]), A = (e, t) => [`[[${e}]]`, (s) => s == null ? t : Rt(s)], Rt = (e) => {
+]), G = (e, t) => [`[[${e}]]`, (s) => s == null ? t : Yt(s)], Yt = (e) => {
   const t = /* @__PURE__ */ new Date(e + "T00:00:00"), s = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], a = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
   return `${s[t.getDay()]}, ${t.getDate()} ${a[t.getMonth()]}`;
-}, Pt = ({ currentYear: e, onSelect: t }) => {
+}, At = ({ currentYear: e, onSelect: t }) => {
   const s = e - 50, a = Array.from({ length: 101 }, (n, i) => s + i);
   return o(
     { class: "grid grid-cols-4 gap-2 overflow-y-auto max-h-72" },
     a.map(
-      (n) => m(
+      (n) => p(
         {
           click: (i) => {
             i.preventDefault(), i.stopPropagation(), t(n);
@@ -432,7 +461,7 @@ const j = ({ label: e, click: t }) => m(
     )
   );
 };
-class De extends g {
+class Re extends m {
   /**
    * Declare compiler props.
    *
@@ -448,14 +477,14 @@ class De extends g {
    */
   setData() {
     const t = /* @__PURE__ */ new Date(), s = this.startDate ? /* @__PURE__ */ new Date(this.startDate + "T00:00:00") : t, a = s.getMonth(), n = s.getFullYear();
-    return new L({
+    return new j({
       today: {
         date: t.getDate(),
         month: t.getMonth(),
         year: t.getFullYear()
       },
       monthName: this.getMonthName(a),
-      currentData: `${s.getFullYear()}-${v(s.getMonth() + 1)}-${v(s.getDate())}`,
+      currentData: `${s.getFullYear()}-${R(s.getMonth() + 1)}-${R(s.getDate())}`,
       current: {
         date: t.getDate(),
         month: a,
@@ -473,7 +502,7 @@ class De extends g {
    * @returns {string}
    */
   getMonthName(t) {
-    return $.monthNames[t];
+    return F.monthNames[t];
   }
   /**
    * Initialize component state.
@@ -496,7 +525,7 @@ class De extends g {
     if (this.data.selecting === "start") {
       this.data.current.start = t, this.data.current.end = null, this.data.selecting = "end";
       const s = new Date(t);
-      this.setCurrent({
+      console.log(s.getMonth(), s.getFullYear(), s.getDate()), this.setCurrent({
         month: s.getMonth(),
         year: s.getFullYear(),
         date: s.getDate()
@@ -519,7 +548,7 @@ class De extends g {
    */
   setCurrent({ month: t, year: s, date: a = null }) {
     const n = this.data.current;
-    n.month = (t + 12) % 12, n.year = s + (t < 0 ? -1 : t > 11 ? 1 : 0), a !== null && (n.date = a), this.data.monthName = this.getMonthName(n.month), this.data.currentDate = `${s}-${v(t + 1)}-${v(n.date)}`;
+    n.month = (t + 12) % 12, n.year = s + (t < 0 ? -1 : t > 11 ? 1 : 0), a !== null && (n.date = a), this.data.monthName = this.getMonthName(n.month), this.data.currentDate = `${s}-${R(t + 1)}-${R(n.date)}`;
   }
   /**
    * Render the range calendar.
@@ -529,17 +558,17 @@ class De extends g {
   render() {
     const { today: t, current: s, selecting: a } = this.data, { start: n, end: i } = s;
     return o({ class: "range-calendar bg-background border border-border rounded-lg shadow-md p-4 w-full max-w-sm" }, [
-      Bt({
+      zt({
         start: n,
         end: i,
         selecting: a,
         onSelectStart: () => this.data.selecting = "start",
         onSelectEnd: () => this.data.selecting = "end"
       }),
-      K("view", (l) => {
+      at("view", (l) => {
         switch (l) {
           case "months":
-            return Tt(
+            return jt(
               {
                 currentMonth: s.month,
                 currentYear: s.year,
@@ -549,7 +578,7 @@ class De extends g {
               }
             );
           case "years":
-            return Pt(
+            return At(
               {
                 currentYear: s.year,
                 onSelect: (r) => {
@@ -558,7 +587,7 @@ class De extends g {
               }
             );
           default:
-            return Lt({
+            return Nt({
               monthName: this.data.monthName,
               year: s.year,
               today: t,
@@ -581,28 +610,28 @@ class De extends g {
     ]);
   }
 }
-const $t = (e, t) => {
+const Ft = (e, t) => {
   const s = e.toggleAllSelectedRows();
   t.state.checked = !s;
-}, Wt = (e) => F({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
-  G((t) => new ht({ class: "mr-2", onChange: (s, a) => $t(t, a) }))
-]), Ot = ({ align: e, sortable: t, key: s, label: a, sort: n, class: i }) => {
+}, Ht = (e) => J({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class || ""}` }, [
+  nt((t) => new bt({ class: "mr-2", onChange: (s, a) => Ft(t, a) }))
+]), Et = ({ align: e, sortable: t, key: s, label: a, sort: n, class: i }) => {
   const l = e || "justify-start";
-  return F({
+  return J({
     class: `cursor-pointer py-3 px-4 text-base ${i || ""}`,
     click: t && (() => n(s))
   }, [
     o({ class: `flex flex-auto w-full items-center ${l}` }, [
-      C(a),
-      t && J({ class: "ml-2", html: b.arrows.upDown })
+      $(a),
+      t && it({ class: "ml-2", html: v.arrows.upDown })
     ])
   ]);
-}, W = (e) => _([
-  V({
+}, H = (e) => ot([
+  lt({
     class: "text-muted-foreground border-b",
     map: [
       e.headers,
-      (t) => t.label === "checkbox" ? Wt({ toggle: e.toggle }) : Ot({
+      (t) => t.label === "checkbox" ? Ht({ toggle: e.toggle }) : Et({
         align: t.align,
         sortable: t.sortable,
         key: t.key,
@@ -611,7 +640,7 @@ const $t = (e, t) => {
       })
     ]
   })
-]), Nt = ({ key: e, rows: t, selectRow: s, rowItem: a, emptyState: n }) => new ot({
+]), Ut = ({ key: e, rows: t, selectRow: s, rowItem: a, emptyState: n }) => new gt({
   cache: "list",
   key: e,
   items: t,
@@ -619,7 +648,7 @@ const $t = (e, t) => {
   class: "divide-y divide-border",
   emptyState: n
 });
-class Q extends g {
+class tt extends m {
   /**
    * Initializes component data.
    *
@@ -627,7 +656,7 @@ class Q extends g {
    */
   setData() {
     let t = this.rows && this.rows.length > 0;
-    return (this.loadMoreItems || this.tableData) && !t && (t = null), new L({
+    return (this.loadMoreItems || this.tableData) && !t && (t = null), new j({
       selectedRows: [],
       // @ts-ignore
       hasItems: t,
@@ -690,14 +719,14 @@ class Q extends g {
   render() {
     const t = this.rows, s = this.border !== !1 ? "border" : "";
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      w("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
+      k("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${s} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        P({ class: "w-full" }, [
+        A({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && W({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          this.headers && H({ headers: this.headers, sort: (a) => this.sortRows(a) }),
           // @ts-ignore
           this.customHeader ?? null,
-          Nt({
+          Ut({
             // @ts-ignore
             key: this.key,
             rows: t,
@@ -772,7 +801,7 @@ class Q extends g {
     this.data.selectedRows = [];
   }
 }
-const zt = (e) => new lt({
+const Qt = (e) => new mt({
   cache: "list",
   loadMoreItems: e.loadMoreItems,
   offset: e.offset,
@@ -783,7 +812,7 @@ const zt = (e) => new lt({
   rowItem: (t) => e.rowItem(t, e.selectRow),
   class: "divide-y divide-border"
 });
-class Yt extends Q {
+class Xt extends tt {
   /**
    * Renders the DataTable component.
    *
@@ -792,14 +821,14 @@ class Yt extends Q {
   render() {
     const t = this.rows, s = this.border !== !1 ? "border" : "";
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      w("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
+      k("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${s} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        P({ class: "w-full" }, [
+        A({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && W({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          this.headers && H({ headers: this.headers, sort: (a) => this.sortRows(a) }),
           // @ts-ignore
           this.customHeader ?? null,
-          zt({
+          Qt({
             // @ts-ignore
             loadMoreItems: this.loadMoreItems,
             // @ts-ignore
@@ -831,7 +860,7 @@ class Yt extends Q {
     this.list.refresh();
   }
 }
-const Se = f((e) => new Yt(
+const Oe = g((e) => new Xt(
   {
     cache: e.cache ?? "list",
     tableData: e.data,
@@ -847,7 +876,7 @@ const Se = f((e) => new Yt(
     border: e.border,
     emptyState: e.emptyState
   }
-)), jt = (e) => new rt({
+)), qt = (e) => new pt({
   cache: "list",
   scrollContainer: e.scrollContainer,
   loadMoreItems: e.loadMoreItems,
@@ -859,7 +888,7 @@ const Se = f((e) => new Yt(
   rowItem: (t) => e.rowItem(t, e.selectRow),
   class: "divide-y divide-border"
 });
-class At extends Q {
+class Kt extends tt {
   /**
    * Renders the DataTable component.
    *
@@ -868,14 +897,14 @@ class At extends Q {
   render() {
     const t = this.rows, s = this.border !== !1 ? "border" : "";
     return o({ class: "w-full flex flex-auto flex-col" }, [
-      w("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
+      k("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
       o({ class: `w-full rounded-md ${s} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        P({ class: "w-full" }, [
+        A({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && W({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          this.headers && H({ headers: this.headers, sort: (a) => this.sortRows(a) }),
           // @ts-ignore
           this.customHeader ?? null,
-          jt({
+          qt({
             // @ts-ignore
             scrollContainer: this.scrollContainer,
             // @ts-ignore
@@ -909,7 +938,7 @@ class At extends Q {
     this.list.refresh();
   }
 }
-const Ce = f((e) => new At(
+const Pe = g((e) => new Kt(
   {
     cache: e.cache ?? "list",
     tableData: e.data,
@@ -926,45 +955,45 @@ const Ce = f((e) => new At(
     border: e.border,
     emptyState: e.emptyState
   }
-)), Ft = f(({ name: e, email: t }) => o({ class: "min-w-0 flex-auto" }, [
-  x({ class: "text-base font-semibold leading-6 m-0" }, e),
-  x({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, t)
-])), Ht = () => o({ class: "flex items-center gap-x-1.5" }, [
+)), Gt = g(({ name: e, email: t }) => o({ class: "min-w-0 flex-auto" }, [
+  T({ class: "text-base font-semibold leading-6 m-0" }, e),
+  T({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, t)
+])), Jt = () => 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" })
   ]),
-  x({ class: "text-xs leading-5 text-gray-500" }, "Online")
-]), Ut = (e) => x({ class: "text-xs leading-5 text-muted-foreground" }, [
-  C("Last seen "),
-  Z({ datetime: e }, "3h ago")
-]), Et = (e, t) => e === "online" ? Ht() : Ut(t), Qt = f(({ role: e, lastSeen: t, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
-  x({ class: "text-sm leading-6 m-0" }, e),
-  Et(s, t)
-])), Xt = (e) => e.split(" ").map((s) => s[0]).join(""), qt = f((e) => I({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
+  T({ class: "text-xs leading-5 text-gray-500" }, "Online")
+]), _t = (e) => T({ class: "text-xs leading-5 text-muted-foreground" }, [
+  $("Last seen "),
+  rt({ datetime: e }, "3h ago")
+]), Vt = (e, t) => e === "online" ? Jt() : _t(t), Zt = g(({ role: e, lastSeen: t, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
+  T({ class: "text-sm leading-6 m-0" }, e),
+  Vt(s, t)
+])), te = (e) => e.split(" ").map((s) => s[0]).join(""), ee = g((e) => W({ 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" }, [
-    nt({ src: e.image, alt: e.name, fallbackText: Xt(e.name) }),
-    Ft({ name: e.name, email: e.email })
+    ut({ src: e.image, alt: e.name, fallbackText: te(e.name) }),
+    Gt({ name: e.name, email: e.email })
   ]),
-  Qt({
+  Zt({
     role: e.role,
     lastSeen: e.lastSeen,
     status: e.status
   })
-])), Ie = f((e) => new ct({
+])), $e = g((e) => new yt({
   cache: "list",
   key: "name",
   items: e.users,
   role: "list",
   class: "divide-y divide-border",
-  rowItem: qt
-})), Kt = (e, t) => t.includes(e), Gt = (e, t, s) => e.exact ? s === t : Kt(t, s), Jt = ({ text: e, href: t, exact: s, hidden: a }) => new U({
+  rowItem: ee
+})), se = (e, t) => t.includes(e), ae = (e, t, s) => e.exact ? s === t : se(t, s), ne = ({ text: e, href: t, exact: s, hidden: a }) => new V({
   text: e,
   href: t,
   exact: s,
   dataSet: ["selected", ["state", !0, "active"]],
   class: `${a ? "hidden" : "inline-flex"} items-center justify-center whitespace-nowrap px-3 py-1.5 text-sm font-medium transition-all rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring focus-visible:ring-offset-background hover:bg-primary hover:text-primary-foreground disabled:opacity-50 disabled:pointer-events-none data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm`
 });
-class Me extends g {
+class We extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -985,14 +1014,14 @@ class Me extends g {
    * @returns {object}
    */
   render() {
-    return M(
+    return N(
       { class: `flex items-center justify-center p-2 text-muted-foreground rounded-md ${this.class || ""}` },
       [
-        k({
+        B({
           class: "flex space-x-4",
           map: [this.options, (t) => this.addLink(t)],
           watch: {
-            value: ["[[path]]", D.data],
+            value: ["[[path]]", O.data],
             callBack: this.updateLinks.bind(this)
           }
         })
@@ -1005,7 +1034,7 @@ class Me extends g {
    * @returns {void}
    */
   afterSetup() {
-    const t = D.data.path;
+    const t = O.data.path;
     this.updateLinks(t);
   }
   /**
@@ -1020,7 +1049,7 @@ class Me extends g {
     for (const a of this.links) {
       if (!a.rendered)
         continue;
-      Gt(a, a.getLinkPath(), t) ? (this.updateLink(a, !0), s = !0) : this.updateLink(a, !1);
+      ae(a, a.getLinkPath(), t) ? (this.updateLink(a, !0), s = !0) : this.updateLink(a, !1);
     }
     !s && this.links[0] && this.updateLink(this.links[0], !0);
   }
@@ -1050,7 +1079,7 @@ class Me extends g {
    * @returns {object}
    */
   addLink({ label: t, href: s, exact: a, hidden: n }) {
-    const i = Jt({ text: t, href: s, exact: a, hidden: n });
+    const i = ne({ text: t, href: s, exact: a, hidden: n });
     return this.links.push(i), i;
   }
   /**
@@ -1062,13 +1091,13 @@ class Me extends g {
     this.links = [];
   }
 }
-const Le = f((e) => {
+const Ne = g((e) => {
   const t = e.margin || "m-4 ml-0";
   return e.allowHistory = e.allowHistory === !0, o({ class: `flex-none ${t}` }, [
-    m({ variant: "back", class: "ghost", ...e })
+    p({ variant: "back", class: "ghost", ...e })
   ]);
 });
-class X extends g {
+class et extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -1155,13 +1184,13 @@ class X extends g {
     return this.children;
   }
 }
-E.addType("dockableOverlay", (e) => {
+Z.addType("dockableOverlay", (e) => {
   if (!e)
     return;
   const t = e.component;
   t && t.rendered === !0 && t.state.docked === !1 && t.destroy();
 });
-class Te extends X {
+class je extends et {
   /**
    * This will stop presistence.
    *
@@ -1227,7 +1256,7 @@ class Te extends X {
    * @returns {void}
    */
   afterSetup() {
-    E.add(
+    Z.add(
       this.container,
       "dockableOverlay",
       {
@@ -1270,7 +1299,7 @@ class Te extends X {
     document.documentElement.style.overflowY = "auto";
   }
 }
-class Be extends X {
+class ze extends et {
   /**
    * This will get the overlay type.
    *
@@ -1289,7 +1318,7 @@ class Be extends X {
     this.container = t, this.initialize();
   }
 }
-const _t = f(({ index: e, click: t, state: s }, a) => I({
+const ie = g(({ index: e, click: t, state: s }, a) => W({
   class: "p-2 cursor-pointer hover:bg-muted/50",
   onState: [
     [s, "selectedIndex", {
@@ -1298,11 +1327,11 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
     }]
   ],
   click: () => t(e)
-}, a)), Vt = f(({ selectOption: e, state: t }) => k({
+}, a)), oe = g(({ selectOption: e, state: t }) => B({
   class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, a) => _t({ index: a, click: e, state: t }, s.label)]
-})), Zt = f((e) => o({ class: "relative flex items-center" }, [
-  ut({
+  for: ["filteredOptions", (s, a) => ie({ index: a, click: e, state: t }, s.label)]
+})), le = g((e) => o({ class: "relative flex items-center" }, [
+  xt({
     cache: "input",
     class: e.class ?? "",
     placeholder: e.placeholder ?? "Search...",
@@ -1318,22 +1347,22 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
     ]
   }),
   e.icon && o({ class: "absolute flex right-0 mr-2" }, [
-    st(e.icon)
+    ht(e.icon)
   ])
-])), te = (e) => o({
+])), re = (e) => o({
   class: "relative flex fle-auto flex-col",
   onState: ["open", (t, s, a) => {
     if (t)
-      return new it({
+      return new ft({
         cache: "dropdown",
         parent: a,
         button: a.input,
         size: "xl"
       }, [
-        Vt(e)
+        oe(e)
       ]);
   }]
-}), Re = et(
+}), Ye = dt(
   {
     /**
      * This will set up the data object.
@@ -1342,7 +1371,7 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
      */
     setData() {
       const e = this.options || [];
-      return new L({
+      return new j({
         options: e,
         filteredOptions: e
       });
@@ -1430,7 +1459,7 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
      */
     render() {
       return o({ class: "relative w-full max-w-md" }, [
-        Zt({
+        le({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1442,7 +1471,7 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
           // @ts-ignore
           handleKeyDown: this.handleKeyDown.bind(this)
         }),
-        te({
+        re({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1453,22 +1482,22 @@ const _t = f(({ index: e, click: t, state: s }, a) => I({
       ]);
     }
   }
-), ee = (e) => I(
+), ce = (e) => W(
   {
     class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm",
     dataSet: ["selected", ["state", e.value, "active"]]
   },
   [
-    S({
+    P({
       class: "flex flex-auto justify-center items-center px-3 py-1.5 rounded-md",
       onSet: ["selected", { selected: e.value }],
       click: (t) => e.callBack(e.value)
     }, e.label)
   ]
-), se = (e, t) => (e.callBack = t, ee(e)), ae = (e) => M({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${e.class}` }, [
-  k({ class: "flex flex-auto flex-row", map: [e.options, (t) => se(t, e.callBack)] })
+), de = (e, t) => (e.callBack = t, ce(e)), he = (e) => N({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${e.class}` }, [
+  B({ class: "flex flex-auto flex-row", map: [e.options, (t) => de(t, e.callBack)] })
 ]);
-class Pe extends g {
+class Ae extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -1485,12 +1514,12 @@ class Pe extends g {
   render() {
     const t = this.select.bind(this);
     return o({ class: "" }, [
-      ae({
+      he({
         class: this.class,
         options: this.options,
         callBack: t
       }),
-      H({
+      _({
         class: "tab-content",
         onState: ["selected", this.updateContent.bind(this)]
       })
@@ -1556,23 +1585,23 @@ class Pe extends g {
     };
   }
 }
-const ne = (e) => I(
+const ue = (e) => W(
   {
     class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm",
     dataSet: ["selected", ["state", e.value, "active"]]
   },
   [
-    S({
+    P({
       class: "flex flex-auto justify-center items-center px-3 py-1.5 rounded-md disabled:opacity-50 disabled:cursor-not-allowed",
       onSet: ["selected", { selected: e.value }],
       click: (t) => e.callBack(e.value),
       disabled: e.disabled
     }, e.label)
   ]
-), ie = (e, t) => (e.callBack = t, ne(e)), oe = (e) => M({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${e.class}` }, [
-  k({ class: "flex flex-auto flex-row", map: [e.options, (t) => ie(t, e.callBack)] })
+), fe = (e, t) => (e.callBack = t, ue(e)), ge = (e) => N({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${e.class}` }, [
+  B({ class: "flex flex-auto flex-row", map: [e.options, (t) => fe(t, e.callBack)] })
 ]);
-class $e extends g {
+class Fe extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -1588,7 +1617,7 @@ class $e extends g {
    */
   render() {
     const t = this.select.bind(this);
-    return oe({
+    return ge({
       class: this.class,
       options: this.options,
       callBack: t
@@ -1615,17 +1644,17 @@ class $e extends g {
     };
   }
 }
-const le = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), re = (e, t) => {
+const me = (e, t) => new RegExp(`${e}($|/|\\.).*`).test(t), pe = (e, t) => {
   const s = e.getLinkPath();
-  return e.exact ? t === s : le(s, t);
-}, ce = ({ text: e, href: t, exact: s }) => new U({
+  return e.exact ? t === s : me(s, t);
+}, ye = ({ text: e, href: t, exact: s }) => new V({
   text: e,
   href: t,
   exact: s,
   dataSet: ["selected", ["state", !0, "active"]],
   class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm"
 });
-class de extends g {
+class we extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -1646,12 +1675,12 @@ class de extends g {
    * @returns {object}
    */
   render() {
-    return M({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${this.class}` }, [
-      k({
+    return N({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${this.class}` }, [
+      B({
         class: "flex flex-auto flex-row",
         map: [this.options, (t) => this.addLink(t)],
         watch: {
-          value: ["[[path]]", D.data],
+          value: ["[[path]]", O.data],
           callBack: this.updateLinks.bind(this)
         }
       })
@@ -1663,7 +1692,7 @@ class de extends g {
    * @returns {void}
    */
   afterSetup() {
-    const t = D.data.path;
+    const t = O.data.path;
     this.updateLinks(t);
   }
   /**
@@ -1676,7 +1705,7 @@ class de extends g {
     let s = !1, a = this.links[0];
     this.deactivateAllLinks();
     for (const n of this.links)
-      if (n.rendered !== !1 && (s = re(n, t), s === !0)) {
+      if (n.rendered !== !1 && (s = pe(n, t), s === !0)) {
         this.updateLink(n, !0);
         break;
       }
@@ -1708,7 +1737,7 @@ class de extends g {
    * @returns {object}
    */
   addLink({ label: t, href: s, exact: a }) {
-    const n = ce({ text: t, href: s, exact: a });
+    const n = ye({ text: t, href: s, exact: a });
     return this.links.push(n), n;
   }
   /**
@@ -1720,7 +1749,7 @@ class de extends g {
     this.links = [];
   }
 }
-class We extends g {
+class He extends m {
   /**
    * This will declare the props for the compiler.
    *
@@ -1736,11 +1765,11 @@ class We extends g {
    */
   render() {
     return o({ class: "tab-panel" }, [
-      new de({
+      new we({
         class: this.class,
         options: this.options
       }),
-      H({
+      _({
         class: "tab-content",
         switch: this.addGroup()
       })
@@ -1766,7 +1795,7 @@ class We extends g {
     return s;
   }
 }
-class he extends g {
+class be extends m {
   /**
    * Runs before rendering, sets up defaults, a timer for drawing,
    * and basic canvas properties.
@@ -1776,7 +1805,7 @@ class he extends g {
   onCreated() {
     this.lineWidth = this.lineWidth || 3, this.lineColor = this.lineColor || "#000000", this.canvas = null, this.ctx = null, this.status = "stopped";
     const t = 1e3 / 60;
-    this.timer = new dt(t, this.draw.bind(this)), this.width = 0, this.height = 0, this.signed = !1, this.mouse = { x: 0, y: 0, status: "up" }, this.margin = this.margin || { x: 40, y: 60 }, this.targetSize = this.targetSize || { width: 740, height: 345 }, this.baseLineWidth = this.baseLineWidth || 2, this.baseStrokeColor = this.baseStrokeColor || "#000000";
+    this.timer = new wt(t, this.draw.bind(this)), this.width = 0, this.height = 0, this.signed = !1, this.mouse = { x: 0, y: 0, status: "up" }, this.margin = this.margin || { x: 40, y: 60 }, this.targetSize = this.targetSize || { width: 740, height: 345 }, this.baseLineWidth = this.baseLineWidth || 2, this.baseStrokeColor = this.baseStrokeColor || "#000000";
   }
   /**
    * Renders a <canvas> element.
@@ -1784,7 +1813,7 @@ class he extends g {
    * @returns {object} Layout definition for the canvas.
    */
   render() {
-    return tt({
+    return ct({
       style: "touch-action: none; -webkit-user-select: none; -webkit-touch-callout: none;"
     });
   }
@@ -1833,8 +1862,8 @@ class he extends g {
     let s, a;
     const n = this.canvas, i = n.width / parseInt(n.style.width), l = n.getBoundingClientRect();
     if (t.touches && t.touches.length) {
-      const d = t.touches[0];
-      s = d.clientX, a = d.clientY;
+      const h = t.touches[0];
+      s = h.clientX, a = h.clientY;
     } else
       s = t.x || t.clientX, a = t.y || t.clientY;
     const r = parseInt((s - l.left) * i), c = parseInt((a - l.top) * i);
@@ -1881,8 +1910,8 @@ class he extends g {
     const { canvas: t, ctx: s } = this, a = t.toDataURL();
     if (this.scale(), this.setupBackground(s), a !== "data:,") {
       const n = new globalThis.Image();
-      O.on("load", n, function i() {
-        s.drawImage(n, 0, 0), O.off("load", n, i);
+      U.on("load", n, function i() {
+        s.drawImage(n, 0, 0), U.off("load", n, i);
       }), n.src = a;
     }
     this.draw();
@@ -1902,7 +1931,7 @@ class he extends g {
    * @returns {void}
    */
   noScaleResize() {
-    const t = N.getSize(container);
+    const t = Q.getSize(container);
     this.width = canvas.width = t.width, this.height = canvas.height = t.height;
   }
   /**
@@ -1912,11 +1941,11 @@ class he extends g {
    * @returns {void}
    */
   scale() {
-    const t = this.canvas, s = this.container, a = N.getSize(s), n = this.targetSize, i = n.width, l = n.height;
+    const t = this.canvas, s = this.container, a = Q.getSize(s), n = this.targetSize, i = n.width, l = n.height;
     let r = i + "px", c = l + "px";
     if (this.width = t.width = i, this.height = t.height = l, a.width !== 0 && a.height !== 0) {
-      const d = a.width, u = a.height, h = d / i, p = u / l, y = Math.min(h, p);
-      r = i * y + "px", c = l * y + "px";
+      const h = a.width, y = a.height, u = h / i, b = y / l, x = Math.min(u, b);
+      r = i * x + "px", c = l * x + "px";
     }
     t.style.width = r, t.style.height = c;
   }
@@ -1992,7 +2021,7 @@ class he extends g {
     this.timer.stop(), this.status = "stopped";
   }
 }
-class Oe extends g {
+class Ee extends m {
   /**
    * Sets up default properties for the signature panel.
    *
@@ -2009,19 +2038,19 @@ class Oe extends g {
    */
   render() {
     return o({ class: "signature-panel relative flex flex-auto overflow-hidden select-none" }, [
-      ft({
+      kt({
         cache: "hiddenInput",
         required: !0,
         bind: this.path + ".data"
       }),
       o({ class: "absolute top-2 right-2" }, [
-        m({
+        p({
           variant: "icon",
-          icon: b.circleX,
+          icon: v.circleX,
           click: this.reset.bind(this)
         })
       ]),
-      new he({
+      new be({
         cache: "canvasLayer",
         margin: this.margin,
         targetSize: this.targetSize,
@@ -2071,37 +2100,37 @@ class Oe extends g {
   }
 }
 export {
-  Le as B,
-  Wt as C,
-  Nt as D,
-  Ot as H,
-  Be as I,
-  Me as N,
-  X as O,
-  be as P,
-  De as R,
-  Ce as S,
-  W as T,
-  qt as U,
-  ve as W,
-  yt as a,
-  z as b,
-  mt as c,
-  xe as d,
-  ke as e,
-  bt as f,
-  pt as g,
-  kt as h,
-  vt as i,
-  Q as j,
-  Se as k,
-  Ie as l,
-  Te as m,
-  Re as n,
-  Zt as o,
-  Pe as p,
-  $e as q,
-  de as r,
-  We as s,
-  Oe as t
+  Ne as B,
+  Ht as C,
+  Ut as D,
+  Et as H,
+  ze as I,
+  We as N,
+  et as O,
+  Me as P,
+  Re as R,
+  Pe as S,
+  H as T,
+  ee as U,
+  Be as W,
+  Ct as a,
+  X as b,
+  Dt as c,
+  Le as d,
+  Te as e,
+  Mt as f,
+  St as g,
+  Tt as h,
+  Bt as i,
+  tt as j,
+  Oe as k,
+  $e as l,
+  je as m,
+  Ye as n,
+  le as o,
+  Ae as p,
+  Fe as q,
+  we as r,
+  He as s,
+  Ee as t
 };

package/dist/types/components/organisms/calendar/range/range-day-cell.d.ts

@@ -1,9 +1,10 @@
-export function RangeDayCell({ day, iso, disabled, isStart, isEnd, isBetween, click }: {
+export function RangeDayCell({ day, iso, disabled, isStart, isEnd, isBetween, isOtherMonth, click }: {
     day: number;
     iso: string;
     disabled: boolean;
     isStart: boolean;
     isEnd: boolean;
     isBetween: boolean;
+    isOtherMonth: boolean;
     click: Function;
 }): object;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@base-framework/ui",
-	"version": "1.0.229",
+	"version": "1.0.231",
 	"description": "This is a UI package that adds components and atoms that use Tailwind CSS and a theme based on Shadcn.",
 	"main": "./dist/index.es.js",
 	"scripts": {