@base-framework/ui 1.0.167 → 1.0.168

package/dist/index.es.js

@@ -1,36 +1,36 @@
 import { B as e, C as o, a as t, F as r, L as n, P as i, R as l, S as p, b as u, T as m } from "./tooltip-CESEqMCU.js";
-import { B as g, I as C, L as T } from "./buttons-Cm9etaEG.js";
-import { C as b, d as D, D as S, c as I, E as B, F as P, H as F, I as M, M as k, N, P as v, R as f, S as x, T as h, a as y, b as W, U as H, W as L } from "./inputs-Dmu4Z-7-.js";
+import { B as g, I as T, L as c } from "./buttons-Cm9etaEG.js";
+import { C as D, d as b, D as S, c as I, E as B, F as P, H as F, I as M, M as k, N, P as v, R as f, S as x, T as y, a as h, b as W, U as H, W as L } from "./inputs-Dmu4Z-7-.js";
 import { V as w, a as U } from "./veil-D4dRxILB.js";
 import { Icons as O } from "./icons.es.js";
-import { A as G, 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 sa, a as ea, b as oa, i as ta, g as ra, e as na, h as ia, F as la, d as pa, f as ua, u as ma, M as da, l as ga, N as Ca, P as Ta, p as ca, q as ba, S as Da, n as Sa, o as Ia, T as Ba, y as Pa, z as Fa, m as Ma, r as ka } from "./confirmation-D3LQkcmd.js";
-import { A as va, b as fa, C as xa, D as ha, a as ya, F as Wa, M as Ha, P as La, c as Aa, g as wa, p as Ua } from "./calendar-DQXME-2u.js";
-import { B as Oa, n as Ea, C as Ga, j as Va, D as ja, l as qa, H as za, I as Ja, N as _a, O as Ka, P as Qa, S as Xa, m as Ya, r as Za, q as $a, o as as, p as ss, T as es, k as os, U as ts, W as rs, f as ns, h as is, i as ls, c as ps, d as us, b as ms, e as ds, a as gs, g as Cs } from "./signature-panel-C8UM0F7Y.js";
-import { B as cs, I as bs, M as Ds, d as Ss, e as Is, g as Bs, N as Ps, b as Fs, a as Ms, f as ks, P as Ns, c as vs, S as fs, T as xs } from "./mobile-nav-wrapper-Dj67Pb8l.js";
-import { B as ys, a as Ws, C as Hs, F as Ls, b as As, c as ws, M as Us, P as Rs, S as Os } from "./sidebar-menu-page-BVryQj2Z.js";
-import { A as Gs, F as Vs, M as js, a as qs, T as zs } from "./aside-template-McEj_Gxc.js";
-import { B as _s } from "./bside-template-Du2m3rsE.js";
+import { A as G, 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 sa, a as ea, b as oa, i as ta, g as ra, e as na, h as ia, F as la, d as pa, f as ua, u as ma, M as da, l as ga, N as Ta, P as ca, p as Ca, q as Da, S as ba, n as Sa, o as Ia, T as Ba, y as Pa, z as Fa, m as Ma, r as ka } from "./confirmation-D3LQkcmd.js";
+import { A as va, b as fa, C as xa, D as ya, a as ha, F as Wa, M as Ha, P as La, c as Aa, g as wa, p as Ua } from "./calendar-DQXME-2u.js";
+import { B as Oa, o as Ea, C as Ga, j as Va, D as ja, m as qa, k as za, H as Ja, I as _a, N as Ka, O as Qa, P as Xa, S as Ya, n as Za, s as $a, r as as, p as ss, q as es, T as os, l as ts, U as rs, W as ns, f as is, h as ls, i as ps, c as us, d as ms, b as ds, e as gs, a as Ts, g as cs } from "./signature-panel-BMKPAG1c.js";
+import { B as Ds, I as bs, M as Ss, d as Is, e as Bs, g as Ps, N as Fs, b as Ms, a as ks, f as Ns, P as vs, c as fs, S as xs, T as ys } from "./mobile-nav-wrapper-Dj67Pb8l.js";
+import { B as Ws, a as Hs, C as Ls, F as As, b as ws, c as Us, M as Rs, P as Os, S as Es } from "./sidebar-menu-page-BVryQj2Z.js";
+import { A as Vs, F as js, M as qs, a as zs, T as Js } from "./aside-template-McEj_Gxc.js";
+import { B as Ks } from "./bside-template-Du2m3rsE.js";
 export {
   G as Alert,
-  Gs as AsideTemplate,
+  Vs as AsideTemplate,
   va as Avatar,
   Oa as BackButton,
-  cs as Backdrop,
+  Ds as Backdrop,
   e as Badge,
-  ys as BasicPage,
-  Ws as BlankPage,
+  Ws as BasicPage,
+  Hs as BlankPage,
   V as Breadcrumb,
-  _s as BsideTemplate,
+  Ks as BsideTemplate,
   g as Button,
   Ea as ButtonTab,
   fa as Calendar,
   xa as CalendarCells,
   o as Card,
-  Hs as CenterPage,
-  b as Checkbox,
+  Ls as CenterPage,
+  D as Checkbox,
   Ga as CheckboxCol,
   t as CircleGraph,
-  D as ColorInput,
+  b as ColorInput,
   j as ColumnRow,
   q as Combobox,
   z as Confirmation,
@@ -41,8 +41,8 @@ export {
   S as DateInput,
   K as DatePicker,
   I as DateTimeInput,
-  ha as DayCell,
-  ya as DayHeader,
+  ya as DayCell,
+  ha as DayHeader,
   Q as DelayComponent,
   X as DetailBody,
   Y as DetailSection,
@@ -53,6 +53,7 @@ export {
   sa as Dropdown,
   ea as DropdownItem,
   oa as DropdownMenu,
+  za as DynamicDataTable,
   B as EmailInput,
   r as Fieldset,
   P as FileInput,
@@ -64,94 +65,94 @@ export {
   pa as FormLabel,
   ua as FormMessage,
   Wa as FormatDate,
-  Ls as FullContainPage,
-  As as FullPage,
-  Vs as FullTemplate,
-  ws as FullscreenPage,
-  za as HeaderCol,
+  As as FullContainPage,
+  ws as FullPage,
+  js as FullTemplate,
+  Us as FullscreenPage,
+  Ja as HeaderCol,
   F as HiddenInput,
-  C as Icon,
+  T as Icon,
   O as Icons,
   bs as InlineNavigation,
-  Ja as InlineOverlay,
+  _a as InlineOverlay,
   M as Input,
   n as Legend,
-  T as LoadingButton,
-  js as MainColumn,
-  Ds as MainLink,
-  Us as MainSection,
+  c as LoadingButton,
+  qs as MainColumn,
+  Ss as MainLink,
+  Rs as MainSection,
   ma as MinusButton,
-  Ss as MobileNavButton,
-  Is as MobileNavWrapper,
+  Is as MobileNavButton,
+  Bs as MobileNavWrapper,
   da as Modal,
   Ha as MonthCalendar,
   k as MonthInput,
-  Bs as NavButton,
-  Ps as NavButtonLink,
-  Fs as Navigation,
-  Ms as NavigationGroup,
-  _a as NavigationMenu,
-  ks as NavigationPopover,
+  Ps as NavButton,
+  Fs as NavButtonLink,
+  Ms as Navigation,
+  ks as NavigationGroup,
+  Ka as NavigationMenu,
+  Ns as NavigationPopover,
   ga as Notification,
-  Ca as NotificationContainer,
+  Ta as NotificationContainer,
   N as NumberInput,
-  Ka as Overlay,
-  Rs as Page,
-  Qa as Panel,
+  Qa as Overlay,
+  Os as Page,
+  Xa as Panel,
   v as PasswordInput,
-  Ta as PlusButton,
+  ca as PlusButton,
   La as PopOver,
-  Ns as PopupHeader,
+  vs as PopupHeader,
   i as ProgressBar,
   f as Radio,
   l as RangeSlider,
-  ca as STATUSES,
-  ba as STATUS_CLASS,
-  Xa as ScrollableDataTable,
-  Ya as SearchDropdown,
+  Ca as STATUSES,
+  Da as STATUS_CLASS,
+  Ya as ScrollableDataTable,
+  Za as SearchDropdown,
   x as SearchInput,
   p as Select,
-  vs as SidebarMenu,
-  Os as SidebarMenuPage,
-  Za as SignaturePanel,
+  fs as SidebarMenu,
+  Es as SidebarMenuPage,
+  $a as SignaturePanel,
   u as Skeleton,
-  Da as SplitRow,
+  ba as SplitRow,
   Sa as StaticStatusIndicator,
   Ia as StatusIndicator,
-  fs as SubNavigation,
-  $a as Tab,
-  as as TabGroup,
-  ss as TabNavigation,
-  es as TableHeader,
-  h as TelInput,
-  qs as Template,
-  y as Textarea,
+  xs as SubNavigation,
+  as as Tab,
+  ss as TabGroup,
+  es as TabNavigation,
+  os as TableHeader,
+  y as TelInput,
+  zs as Template,
+  h as Textarea,
   Ba as ThemeToggle,
   Pa as TimeFrame,
   W as TimeInput,
   Fa as TimePicker,
-  xs as TitleHeader,
+  ys as TitleHeader,
   Ma as Toggle,
   m as Tooltip,
-  zs as TopBar,
+  Js as TopBar,
   H as UrlInput,
-  os as UserList,
-  ts as UserListItem,
+  ts as UserList,
+  rs as UserListItem,
   w as Veil,
   U as VeilJot,
-  rs as WeekCalendar,
-  ns as WeekCell,
-  is as WeekCells,
-  ls as WeekHeader,
+  ns as WeekCalendar,
+  is as WeekCell,
+  ls as WeekCells,
+  ps as WeekHeader,
   L as WeekInput,
   Aa as addTime,
-  ps as calculateWeekNumber,
-  us as generateWeeks,
-  ms as getDateFromWeek,
-  ds as getMonthDays,
-  gs as getNextMonthDays,
+  us as calculateWeekNumber,
+  ms as generateWeeks,
+  ds as getDateFromWeek,
+  gs as getMonthDays,
+  Ts as getNextMonthDays,
   wa as getPosition,
-  Cs as getPreviousMonthDays,
+  cs as getPreviousMonthDays,
   ka as getStatusClass,
   Ua as pad
 };

package/dist/organisms.es.js

@@ -1,57 +1,58 @@
-import { B as s, n as o, C as t, j as r, D as l, l as n, H as i, I as b, N as d, O as v, P as g, S as p, m as u, r as N, q as k, o as D, p as C, T, k as c, U as M, W as B, f as m, h as y, i as W, c as h, d as H, b as P, e as S, a as f, g as x } from "./signature-panel-C8UM0F7Y.js";
-import { b as L, C as O, D as F, a as U, F as G, M as j, c as q, p as w } from "./calendar-DQXME-2u.js";
-import { B as A, I as E, M as J, d as K, e as Q, g as R, N as V, b as X, a as Y, f as Z, P as _, c as $, S as aa, T as ea } from "./mobile-nav-wrapper-Dj67Pb8l.js";
+import { B as s, o as t, C as o, j as r, D as l, m as n, k as i, H as b, I as d, N as v, O as D, P as g, S as p, n as u, s as N, r as k, p as C, q as T, T as c, l as M, U as m, W as y, f as B, h as W, i as h, c as H, d as P, b as S, e as f, a as x, g as I } from "./signature-panel-BMKPAG1c.js";
+import { b as O, C as F, D as U, a as G, F as j, M as q, c as w, p as z } from "./calendar-DQXME-2u.js";
+import { B as E, I as J, M as K, d as Q, e as R, g as V, N as X, b as Y, a as Z, f as _, P as $, c as aa, S as ea, T as sa } from "./mobile-nav-wrapper-Dj67Pb8l.js";
 export {
   s as BackButton,
-  A as Backdrop,
-  o as ButtonTab,
-  L as Calendar,
-  O as CalendarCells,
-  t as CheckboxCol,
+  E as Backdrop,
+  t as ButtonTab,
+  O as Calendar,
+  F as CalendarCells,
+  o as CheckboxCol,
   r as DataTable,
   l as DataTableBody,
-  F as DayCell,
-  U as DayHeader,
+  U as DayCell,
+  G as DayHeader,
   n as DockableOverlay,
-  G as FormatDate,
-  i as HeaderCol,
-  E as InlineNavigation,
-  b as InlineOverlay,
-  J as MainLink,
-  K as MobileNavButton,
-  Q as MobileNavWrapper,
-  j as MonthCalendar,
-  R as NavButton,
-  V as NavButtonLink,
-  X as Navigation,
-  Y as NavigationGroup,
-  d as NavigationMenu,
-  Z as NavigationPopover,
-  v as Overlay,
+  i as DynamicDataTable,
+  j as FormatDate,
+  b as HeaderCol,
+  J as InlineNavigation,
+  d as InlineOverlay,
+  K as MainLink,
+  Q as MobileNavButton,
+  R as MobileNavWrapper,
+  q as MonthCalendar,
+  V as NavButton,
+  X as NavButtonLink,
+  Y as Navigation,
+  Z as NavigationGroup,
+  v as NavigationMenu,
+  _ as NavigationPopover,
+  D as Overlay,
   g as Panel,
-  _ as PopupHeader,
+  $ as PopupHeader,
   p as ScrollableDataTable,
   u as SearchDropdown,
-  $ as SidebarMenu,
+  aa as SidebarMenu,
   N as SignaturePanel,
-  aa as SubNavigation,
+  ea as SubNavigation,
   k as Tab,
-  D as TabGroup,
-  C as TabNavigation,
-  T as TableHeader,
-  ea as TitleHeader,
-  c as UserList,
-  M as UserListItem,
-  B as WeekCalendar,
-  m as WeekCell,
-  y as WeekCells,
-  W as WeekHeader,
-  q as addTime,
-  h as calculateWeekNumber,
-  H as generateWeeks,
-  P as getDateFromWeek,
-  S as getMonthDays,
-  f as getNextMonthDays,
-  x as getPreviousMonthDays,
-  w as pad
+  C as TabGroup,
+  T as TabNavigation,
+  c as TableHeader,
+  sa as TitleHeader,
+  M as UserList,
+  m as UserListItem,
+  y as WeekCalendar,
+  B as WeekCell,
+  W as WeekCells,
+  h as WeekHeader,
+  w as addTime,
+  H as calculateWeekNumber,
+  P as generateWeeks,
+  S as getDateFromWeek,
+  f as getMonthDays,
+  x as getNextMonthDays,
+  I as getPreviousMonthDays,
+  z as pad
 };

package/dist/{signature-panel-C8UM0F7Y.js → signature-panel-BMKPAG1c.js}

@@ -1,22 +1,22 @@
-import { Button as y, Div as o, On as Y, Span as v, Th as R, UseParent as F, I as H, Thead as E, Tr as Q, Table as W, P as p, Li as D, Time as X, Nav as S, Ul as b, Section as P, Canvas as q } from "@base-framework/atoms";
-import { Atom as d, Component as h, Data as L, DateTime as K, router as x, NavLink as O, DataTracker as z, Jot as G, base as I, Dom as T } from "@base-framework/base";
-import { B as C, I as V } from "./buttons-Cm9etaEG.js";
+import { Button as x, Div as o, On as H, Span as v, Th as P, UseParent as F, I as E, Thead as Q, Tr as X, Table as I, P as p, Li as D, Time as q, Nav as S, Ul as w, Section as O, Canvas as K } from "@base-framework/atoms";
+import { Atom as d, Component as h, Data as L, DateTime as G, router as y, NavLink as z, DataTracker as $, Jot as V, base as B, Dom as M } from "@base-framework/base";
+import { B as C, I as _ } from "./buttons-Cm9etaEG.js";
 import { Icons as k } from "./icons.es.js";
-import { TableBody as _, ScrollableTableBody as J, List as Z, IntervalTimer as ee } from "@base-framework/organisms";
-import { C as te, I as se, H as ae } from "./inputs-Dmu4Z-7-.js";
-import { A as ie, P as ne } from "./calendar-DQXME-2u.js";
+import { TableBody as J, DataTableBody as Z, ScrollableTableBody as ee, List as te, IntervalTimer as se } from "@base-framework/organisms";
+import { C as ae, I as ie, H as ne } from "./inputs-Dmu4Z-7-.js";
+import { A as oe, P as le } from "./calendar-DQXME-2u.js";
 d((t, e) => ({
   class: "flex items-center px-4 py-2",
   ...t,
   children: e
 }));
-d(({ value: t, label: e }) => y({
+d(({ value: t, label: e }) => x({
   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: t }],
   dataSet: ["performance", ["state", t, "active"]],
   click: (s, { state: a }) => a.performance = t
 }, e));
-class et extends h {
+class at extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -34,36 +34,36 @@ class et extends h {
     return o({ class: this.class || "" }, this.children);
   }
 }
-const oe = (t) => {
+const re = (t) => {
   const e = new Date(t, 11, 31), s = new Date(t, 0, 1);
   return e.getDay() === 4 || // December 31 is a Thursday
   s.getDay() === 4;
-}, le = (t) => {
+}, ce = (t) => {
   const e = new Date(t.valueOf()), s = (e.getDay() + 6) % 7;
   e.setDate(e.getDate() - s + 3);
   const a = e.getFullYear(), i = new Date(a, 0, 4);
   i.setDate(i.getDate() - (i.getDay() + 6) % 7);
   const n = Math.ceil((e - i) / 6048e5) + 1;
-  return n > 52 && !oe(a) ? {
+  return n > 52 && !re(a) ? {
     weekNumber: 1,
     year: a + 1
   } : {
     weekNumber: n,
     year: a
   };
-}, re = (t, e, s) => {
+}, de = (t, e, s) => {
   if (s === 0) return [];
   const a = new Date(t, e, 0).getDate();
   return Array.from(
     { length: s },
     (i, n) => new Date(t, e - 1, a - s + n + 1)
   );
-}, ce = (t, e, s) => Array.from({ length: s }, (a, i) => new Date(t, e + 1, i + 1)), B = (t, e) => {
+}, he = (t, e, s) => Array.from({ length: s }, (a, i) => new Date(t, e + 1, i + 1)), R = (t, e) => {
   const s = new Date(e, 0, 4), a = (s.getDay() + 6) % 7, i = new Date(s);
   i.setDate(s.getDate() - a);
   const n = new Date(i);
   return n.setDate(i.getDate() + (t - 1) * 7), n;
-}, tt = (t, e) => {
+}, it = (t, e) => {
   const s = new Date(t, e, 1).getDay(), a = new Date(t, e + 1, 0).getDate(), i = [];
   let n = [];
   for (let l = 1 - s; l <= a; l++) {
@@ -71,18 +71,18 @@ const oe = (t) => {
     n.push(l > 0 ? u : null), (n.length === 7 || l === a) && (i.push([...n]), n = []);
   }
   return i;
-}, st = (t, e) => {
+}, nt = (t, e) => {
   const s = new Date(t, e + 1, 0).getDate(), a = [];
   let i = [];
   for (let n = 1; n <= s; n++)
     i.push(new Date(t, e, n)), i.length === 7 && (a.push(i), i = []);
   return i.length > 0 && a.push(i), a;
-}, de = (t, e, s) => {
+}, ue = (t, e, s) => {
   const a = /* @__PURE__ */ new Date();
   return a.getDate() === t && a.getMonth() === e && a.getFullYear() === s;
-}, he = ({ day: t, month: e, year: s, weekNumber: a, selectWeek: i }) => {
-  const n = de(t, e, s);
-  return y({
+}, fe = ({ day: t, month: e, year: s, weekNumber: a, selectWeek: i }) => {
+  const n = ue(t, e, s);
+  return x({
     text: t || "",
     disabled: !t,
     class: `
@@ -92,19 +92,19 @@ const oe = (t) => {
 		`,
     click: () => i(a, s)
   });
-}, ue = (t, e) => {
-  const s = new Date(t, e, 1).getDay(), a = new Date(t, e + 1, 0).getDate(), i = re(t, e, s), n = Array.from({ length: a }, (r, m) => new Date(t, e, m + 1)), l = (i.length + n.length) % 7, u = l === 0 ? 0 : 7 - l, c = ce(t, e, u), f = [...i, ...n, ...c], g = [];
+}, ge = (t, e) => {
+  const s = new Date(t, e, 1).getDay(), a = new Date(t, e + 1, 0).getDate(), i = de(t, e, s), n = Array.from({ length: a }, (r, m) => new Date(t, e, m + 1)), l = (i.length + n.length) % 7, u = l === 0 ? 0 : 7 - l, c = he(t, e, u), f = [...i, ...n, ...c], g = [];
   for (let r = 0; r < f.length; r += 7) {
-    const m = f.slice(r, r + 7), w = m.find((U) => U) || new Date(t, e, 1), { weekNumber: j, year: A } = le(w);
+    const m = f.slice(r, r + 7), b = m.find((Y) => Y) || new Date(t, e, 1), { weekNumber: A, year: U } = ce(b);
     g.push({
-      weekNumber: j,
-      year: A,
+      weekNumber: A,
+      year: U,
       days: m
     });
   }
   return g;
-}, fe = ({ selectWeek: t }) => Y("month", (e, s, { data: a }) => {
-  const { year: i, month: n, currentDate: l } = a, u = ue(i, n);
+}, me = ({ selectWeek: t }) => H("month", (e, s, { data: a }) => {
+  const { year: i, month: n, currentDate: l } = a, u = ge(i, n);
   return o(
     { class: "grid grid-cols-8 gap-1 text-sm px-4 py-2" },
     [
@@ -141,7 +141,7 @@ const oe = (t) => {
           o(
             { class: "grid grid-cols-7 col-span-7 text-center" },
             f.map(
-              (r) => he({
+              (r) => fe({
                 year: (r == null ? void 0 : r.getFullYear()) || null,
                 month: (r == null ? void 0 : r.getMonth()) || null,
                 day: (r == null ? void 0 : r.getDate()) || null,
@@ -154,7 +154,7 @@ const oe = (t) => {
       )
     ]
   );
-}), M = ({ label: t, click: e }) => C(
+}), W = ({ label: t, click: e }) => C(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -167,18 +167,18 @@ const oe = (t) => {
     variant: "icon",
     icon: t === "Previous" ? k.chevron.single.left : k.chevron.single.right
   }
-), ge = ({ next: t, previous: e }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
+), pe = ({ next: t, previous: e }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
   v("[[monthName]] [[year]]"),
-  M({
+  W({
     label: "Previous",
     click: e
   }),
-  M({
+  W({
     label: "Next",
     click: t
   })
 ]);
-class at extends h {
+class ot extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -193,7 +193,7 @@ class at extends h {
    * @returns {Data}
    */
   setData() {
-    const e = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(e), a = B(s, e.getFullYear());
+    const e = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(e), a = R(s, e.getFullYear());
     return new L({
       monthName: this.getMonthName(a.getMonth()),
       year: a.getFullYear(),
@@ -231,7 +231,7 @@ class at extends h {
    * @returns {string}
    */
   getMonthName(e) {
-    return K.monthNames[e];
+    return G.monthNames[e];
   }
   /**
    * Updates the calendar to show the previous month.
@@ -276,7 +276,7 @@ class at extends h {
    */
   selectWeek(e, s) {
     this.data.currentWeek = e;
-    const a = B(e, s);
+    const a = R(e, s);
     this.setDate(a.getMonth(), a.getFullYear(), a.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(e);
   }
   /**
@@ -286,38 +286,38 @@ class at extends h {
    */
   render() {
     return o({ class: "week-calendar-container border rounded-md bg-background p-3" }, [
-      ge({
+      pe({
         next: () => this.goToNextMonth(),
         previous: () => this.goToPreviousMonth()
       }),
-      fe({
+      me({
         selectWeek: (e, s) => this.selectWeek(e, s)
       })
     ]);
   }
 }
-const me = (t, e) => {
+const we = (t, e) => {
   const s = t.toggleAllSelectedRows();
   e.state.checked = !s;
-}, pe = (t) => R({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
-  F((e) => new te({ class: "mr-2", onChange: (s, a) => me(e, a) }))
-]), be = ({ align: t, sortable: e, key: s, label: a, sort: i, class: n }) => {
+}, be = (t) => P({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
+  F((e) => new ae({ class: "mr-2", onChange: (s, a) => we(e, a) }))
+]), ye = ({ align: t, sortable: e, key: s, label: a, sort: i, class: n }) => {
   const l = t || "justify-start";
-  return R({
+  return P({
     class: `cursor-pointer py-3 px-4 text-base ${n || ""}`,
     click: e && (() => i(s))
   }, [
     o({ class: `flex flex-auto w-full items-center ${l}` }, [
       v(a),
-      e && H({ class: "ml-2", html: k.arrows.upDown })
+      e && E({ class: "ml-2", html: k.arrows.upDown })
     ])
   ]);
-}, N = (t) => E([
-  Q({
+}, T = (t) => Q([
+  X({
     class: "text-muted-foreground border-b",
     map: [
       t.headers,
-      (e) => e.label === "checkbox" ? pe({ toggle: t.toggle }) : be({
+      (e) => e.label === "checkbox" ? be({ toggle: t.toggle }) : ye({
         align: e.align,
         sortable: e.sortable,
         key: e.key,
@@ -326,14 +326,14 @@ const me = (t, e) => {
       })
     ]
   })
-]), we = ({ key: t, rows: e, selectRow: s, rowItem: a }) => new _({
+]), ke = ({ key: t, rows: e, selectRow: s, rowItem: a }) => new J({
   cache: "list",
   key: t,
   items: e,
   rowItem: (i) => a(i, s),
   class: "divide-y divide-border"
 });
-class xe extends h {
+class N extends h {
   /**
    * Initializes component data.
    *
@@ -402,12 +402,12 @@ class xe extends h {
     const e = this.rows, s = this.border !== !1 ? "border" : "";
     return o({ class: "w-full" }, [
       o({ class: `w-full rounded-md ${s} overflow-x-auto` }, [
-        W({ class: "w-full" }, [
+        I({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && N({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          this.headers && T({ headers: this.headers, sort: (a) => this.sortRows(a) }),
           // @ts-ignore
           this.customHeader ?? null,
-          we({
+          ke({
             // @ts-ignore
             key: this.key,
             rows: e,
@@ -480,7 +480,80 @@ class xe extends h {
     this.data.selectedRows = [];
   }
 }
-const ke = (t) => new J({
+const xe = (t) => new Z({
+  cache: "list",
+  loadMoreItems: t.loadMoreItems,
+  offset: t.offset,
+  limit: t.limit,
+  key: t.key,
+  tableData: t.tableData,
+  items: t.items,
+  rowItem: (e) => t.rowItem(e, t.selectRow),
+  class: "divide-y divide-border"
+});
+class ve extends N {
+  /**
+   * Renders the DataTable component.
+   *
+   * @returns {object}
+   */
+  render() {
+    const e = this.rows, s = this.border !== !1 ? "border" : "";
+    return o({ class: "w-full" }, [
+      o({ class: `w-full rounded-md ${s} overflow-x-auto` }, [
+        I({ class: "w-full" }, [
+          // @ts-ignore
+          this.headers && T({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          // @ts-ignore
+          this.customHeader ?? null,
+          xe({
+            // @ts-ignore
+            loadMoreItems: this.loadMoreItems,
+            // @ts-ignore
+            offset: this.offset,
+            // @ts-ignore
+            limit: this.limit,
+            // @ts-ignore
+            class: this.class,
+            // @ts-ignore
+            tableData: this.tableData,
+            // @ts-ignore
+            key: this.key,
+            items: e,
+            // @ts-ignore
+            selectRow: this.selectRow.bind(this),
+            // @ts-ignore
+            rowItem: this.rowItem
+          })
+        ])
+      ])
+    ]);
+  }
+  /**
+   * Refreshes the list.
+   *
+   * @returns {void}
+   */
+  refresh() {
+    this.list.refresh();
+  }
+}
+const lt = d((t) => new ve(
+  {
+    cache: t.cache ?? "list",
+    tableData: t.data,
+    loadMoreItems: t.loadMoreItems,
+    offset: t.offset,
+    limit: t.limit,
+    class: t.class,
+    key: t.key,
+    rows: t.rows,
+    rowItem: t.rowItem,
+    headers: t.headers,
+    customHeader: t.customHeader,
+    border: t.border
+  }
+)), De = (t) => new ee({
   cache: "list",
   scrollContainer: t.scrollContainer,
   loadMoreItems: t.loadMoreItems,
@@ -492,7 +565,7 @@ const ke = (t) => new J({
   rowItem: (e) => t.rowItem(e, t.selectRow),
   class: "divide-y divide-border"
 });
-class ye extends xe {
+class Se extends N {
   /**
    * Renders the DataTable component.
    *
@@ -502,12 +575,12 @@ class ye extends xe {
     const e = this.rows, s = this.border !== !1 ? "border" : "";
     return o({ class: "w-full" }, [
       o({ class: `w-full rounded-md ${s} overflow-x-auto` }, [
-        W({ class: "w-full" }, [
+        I({ class: "w-full" }, [
           // @ts-ignore
-          this.headers && N({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          this.headers && T({ headers: this.headers, sort: (a) => this.sortRows(a) }),
           // @ts-ignore
           this.customHeader ?? null,
-          ke({
+          De({
             // @ts-ignore
             scrollContainer: this.scrollContainer,
             // @ts-ignore
@@ -541,7 +614,7 @@ class ye extends xe {
     this.list.refresh();
   }
 }
-const it = d((t) => new ye(
+const rt = d((t) => new Se(
   {
     cache: t.cache ?? "list",
     tableData: t.data,
@@ -557,45 +630,45 @@ const it = d((t) => new ye(
     customHeader: t.customHeader,
     border: t.border
   }
-)), ve = d(({ name: t, email: e }) => o({ class: "min-w-0 flex-auto" }, [
+)), Ie = d(({ name: t, email: e }) => o({ class: "min-w-0 flex-auto" }, [
   p({ class: "text-base font-semibold leading-6 m-0" }, t),
   p({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, e)
-])), De = () => o({ class: "flex items-center gap-x-1.5" }, [
+])), Le = () => 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" })
   ]),
   p({ class: "text-xs leading-5 text-gray-500" }, "Online")
-]), Se = (t) => p({ class: "text-xs leading-5 text-muted-foreground" }, [
+]), Ce = (t) => p({ class: "text-xs leading-5 text-muted-foreground" }, [
   v("Last seen "),
-  X({ datetime: t }, "3h ago")
-]), Le = (t, e) => t === "online" ? De() : Se(e), Ce = d(({ role: t, lastSeen: e, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
+  q({ datetime: t }, "3h ago")
+]), Te = (t, e) => t === "online" ? Le() : Ce(e), Be = d(({ role: t, lastSeen: e, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
   p({ class: "text-sm leading-6 m-0" }, t),
-  Le(s, e)
-])), Ie = (t) => t.split(" ").map((s) => s[0]).join(""), Te = d((t) => D({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
+  Te(s, e)
+])), Me = (t) => t.split(" ").map((s) => s[0]).join(""), Re = d((t) => D({ 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" }, [
-    ie({ src: t.image, alt: t.name, fallbackText: Ie(t.name) }),
-    ve({ name: t.name, email: t.email })
+    oe({ src: t.image, alt: t.name, fallbackText: Me(t.name) }),
+    Ie({ name: t.name, email: t.email })
   ]),
-  Ce({
+  Be({
     role: t.role,
     lastSeen: t.lastSeen,
     status: t.status
   })
-])), nt = d((t) => new Z({
+])), ct = d((t) => new te({
   cache: "list",
   key: "name",
   items: t.users,
   role: "list",
   class: "divide-y divide-border",
-  rowItem: Te
-})), Be = (t, e) => e.includes(t), Me = (t, e, s) => t.exact ? s === e : Be(e, s), Re = ({ text: t, href: e, exact: s, hidden: a }) => new O({
+  rowItem: Re
+})), We = (t, e) => e.includes(t), Pe = (t, e, s) => t.exact ? s === e : We(e, s), Oe = ({ text: t, href: e, exact: s, hidden: a }) => new z({
   text: t,
   href: e,
   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 ot extends h {
+class dt extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -619,11 +692,11 @@ class ot extends h {
     return S(
       { class: `flex items-center justify-center p-2 text-muted-foreground rounded-md ${this.class || ""}` },
       [
-        b({
+        w({
           class: "flex space-x-4",
           map: [this.options, (e) => this.addLink(e)],
           watch: {
-            value: ["[[path]]", x.data],
+            value: ["[[path]]", y.data],
             callBack: this.updateLinks.bind(this)
           }
         })
@@ -636,7 +709,7 @@ class ot extends h {
    * @returns {void}
    */
   afterSetup() {
-    const e = x.data.path;
+    const e = y.data.path;
     this.updateLinks(e);
   }
   /**
@@ -651,7 +724,7 @@ class ot extends h {
     for (const a of this.links) {
       if (!a.rendered)
         continue;
-      Me(a, a.getLinkPath(), e) ? (this.updateLink(a, !0), s = !0) : this.updateLink(a, !1);
+      Pe(a, a.getLinkPath(), e) ? (this.updateLink(a, !0), s = !0) : this.updateLink(a, !1);
     }
     !s && this.links[0] && this.updateLink(this.links[0], !0);
   }
@@ -681,7 +754,7 @@ class ot extends h {
    * @returns {object}
    */
   addLink({ label: e, href: s, exact: a, hidden: i }) {
-    const n = Re({ text: e, href: s, exact: a, hidden: i });
+    const n = Oe({ text: e, href: s, exact: a, hidden: i });
     return this.links.push(n), n;
   }
   /**
@@ -693,13 +766,13 @@ class ot extends h {
     this.links = [];
   }
 }
-const lt = d((t) => {
+const ht = d((t) => {
   const e = t.margin || "m-4 ml-0";
   return t.allowHistory = t.allowHistory === !0, o({ class: `flex-none ${e}` }, [
     C({ variant: "back", class: "ghost", ...t })
   ]);
 });
-class $ extends h {
+class j extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -786,13 +859,13 @@ class $ extends h {
     return this.children;
   }
 }
-z.addType("dockableOverlay", (t) => {
+$.addType("dockableOverlay", (t) => {
   if (!t)
     return;
   const e = t.component;
   e && e.rendered === !0 && e.state.docked === !1 && e.destroy();
 });
-class rt extends $ {
+class ut extends j {
   /**
    * This will stop presistence.
    *
@@ -858,7 +931,7 @@ class rt extends $ {
    * @returns {void}
    */
   afterSetup() {
-    z.add(
+    $.add(
       this.container,
       "dockableOverlay",
       {
@@ -901,7 +974,7 @@ class rt extends $ {
     document.documentElement.style.overflowY = "auto";
   }
 }
-class ct extends $ {
+class ft extends j {
   /**
    * This will get the overlay type.
    *
@@ -920,7 +993,7 @@ class ct extends $ {
     this.container = e, this.initialize();
   }
 }
-const We = d(({ index: t, click: e, state: s }, a) => D({
+const ze = d(({ index: t, click: e, state: s }, a) => D({
   class: "p-2 cursor-pointer hover:bg-muted/50",
   onState: [
     [s, "selectedIndex", {
@@ -929,11 +1002,11 @@ const We = d(({ index: t, click: e, state: s }, a) => D({
     }]
   ],
   click: () => e(t)
-}, a)), Pe = d(({ selectOption: t, state: e }) => b({
+}, a)), $e = d(({ selectOption: t, state: e }) => w({
   class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, a) => We({ index: a, click: t, state: e }, s.label)]
-})), Oe = d((t) => o({ class: "relative flex items-center" }, [
-  se({
+  for: ["filteredOptions", (s, a) => ze({ index: a, click: t, state: e }, s.label)]
+})), Ne = d((t) => o({ class: "relative flex items-center" }, [
+  ie({
     cache: "input",
     placeholder: t.placeholder ?? "Search...",
     bind: [t.state, "searchQuery"],
@@ -944,22 +1017,22 @@ const We = d(({ index: t, click: e, state: s }, a) => D({
     keydown: (e) => typeof t.handleKeyDown == "function" && t.handleKeyDown(e)
   }),
   t.icon && o({ class: "absolute right-0 mr-2" }, [
-    V(t.icon)
+    _(t.icon)
   ])
-])), ze = (t) => o({
+])), je = (t) => o({
   class: "relative flex fle-auto flex-col",
   onState: ["open", (e, s, a) => {
     if (e)
-      return new ne({
+      return new le({
         cache: "dropdown",
         parent: a,
         button: a.input,
         size: "xl"
       }, [
-        Pe(t)
+        $e(t)
       ]);
   }]
-}), dt = G(
+}), gt = V(
   {
     /**
      * This will set up the data object.
@@ -1056,7 +1129,7 @@ const We = d(({ index: t, click: e, state: s }, a) => D({
      */
     render() {
       return o({ class: "relative w-full max-w-md" }, [
-        Oe({
+        Ne({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1068,7 +1141,7 @@ const We = d(({ index: t, click: e, state: s }, a) => D({
           // @ts-ignore
           handleKeyDown: this.handleKeyDown.bind(this)
         }),
-        ze({
+        je({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1079,22 +1152,22 @@ const We = d(({ index: t, click: e, state: s }, a) => D({
       ]);
     }
   }
-), Ne = (t) => D(
+), Ae = (t) => D(
   {
     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", t.value, "active"]]
   },
   [
-    y({
+    x({
       class: "flex flex-auto justify-center items-center px-3 py-1.5 rounded-md",
       onSet: ["selected", { selected: t.value }],
       click: (e) => t.callBack(t.value)
     }, t.label)
   ]
-), $e = (t, e) => (t.callBack = e, Ne(t)), je = (t) => S({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
-  b({ class: "flex flex-auto flex-row", map: [t.options, (e) => $e(e, t.callBack)] })
+), Ue = (t, e) => (t.callBack = e, Ae(t)), Ye = (t) => S({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
+  w({ class: "flex flex-auto flex-row", map: [t.options, (e) => Ue(e, t.callBack)] })
 ]);
-class ht extends h {
+class mt extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -1111,12 +1184,12 @@ class ht extends h {
   render() {
     const e = this.select.bind(this);
     return o({ class: "" }, [
-      je({
+      Ye({
         class: this.class,
         options: this.options,
         callBack: e
       }),
-      P({
+      O({
         class: "tab-content",
         onState: ["selected", this.updateContent.bind(this)]
       })
@@ -1182,23 +1255,23 @@ class ht extends h {
     };
   }
 }
-const Ae = (t) => D(
+const He = (t) => D(
   {
     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", t.value, "active"]]
   },
   [
-    y({
+    x({
       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: t.value }],
       click: (e) => t.callBack(t.value),
       disabled: t.disabled
     }, t.label)
   ]
-), Ue = (t, e) => (t.callBack = e, Ae(t)), Ye = (t) => S({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
-  b({ class: "flex flex-auto flex-row", map: [t.options, (e) => Ue(e, t.callBack)] })
+), Fe = (t, e) => (t.callBack = e, He(t)), Ee = (t) => S({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
+  w({ class: "flex flex-auto flex-row", map: [t.options, (e) => Fe(e, t.callBack)] })
 ]);
-class ut extends h {
+class pt extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -1214,7 +1287,7 @@ class ut extends h {
    */
   render() {
     const e = this.select.bind(this);
-    return Ye({
+    return Ee({
       class: this.class,
       options: this.options,
       callBack: e
@@ -1241,17 +1314,17 @@ class ut extends h {
     };
   }
 }
-const Fe = (t, e) => new RegExp(`${t}($|/|\\.).*`).test(e), He = (t, e) => {
+const Qe = (t, e) => new RegExp(`${t}($|/|\\.).*`).test(e), Xe = (t, e) => {
   const s = t.getLinkPath();
-  return t.exact ? e === s : Fe(s, e);
-}, Ee = ({ text: t, href: e, exact: s }) => new O({
+  return t.exact ? e === s : Qe(s, e);
+}, qe = ({ text: t, href: e, exact: s }) => new z({
   text: t,
   href: e,
   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 Qe extends h {
+class Ke extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -1273,11 +1346,11 @@ class Qe extends h {
    */
   render() {
     return S({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${this.class}` }, [
-      b({
+      w({
         class: "flex flex-auto flex-row",
         map: [this.options, (e) => this.addLink(e)],
         watch: {
-          value: ["[[path]]", x.data],
+          value: ["[[path]]", y.data],
           callBack: this.updateLinks.bind(this)
         }
       })
@@ -1289,7 +1362,7 @@ class Qe extends h {
    * @returns {void}
    */
   afterSetup() {
-    const e = x.data.path;
+    const e = y.data.path;
     this.updateLinks(e);
   }
   /**
@@ -1302,7 +1375,7 @@ class Qe extends h {
     let s = !1, a = this.links[0];
     this.deactivateAllLinks();
     for (const i of this.links)
-      if (i.rendered !== !1 && (s = He(i, e), s === !0)) {
+      if (i.rendered !== !1 && (s = Xe(i, e), s === !0)) {
         this.updateLink(i, !0);
         break;
       }
@@ -1334,7 +1407,7 @@ class Qe extends h {
    * @returns {object}
    */
   addLink({ label: e, href: s, exact: a }) {
-    const i = Ee({ text: e, href: s, exact: a });
+    const i = qe({ text: e, href: s, exact: a });
     return this.links.push(i), i;
   }
   /**
@@ -1346,7 +1419,7 @@ class Qe extends h {
     this.links = [];
   }
 }
-class ft extends h {
+class wt extends h {
   /**
    * This will declare the props for the compiler.
    *
@@ -1362,11 +1435,11 @@ class ft extends h {
    */
   render() {
     return o({ class: "tab-panel" }, [
-      new Qe({
+      new Ke({
         class: this.class,
         options: this.options
       }),
-      P({
+      O({
         class: "tab-content",
         switch: this.addGroup()
       })
@@ -1392,7 +1465,7 @@ class ft extends h {
     return s;
   }
 }
-class Xe extends h {
+class Ge extends h {
   /**
    * Runs before rendering, sets up defaults, a timer for drawing,
    * and basic canvas properties.
@@ -1402,7 +1475,7 @@ class Xe extends h {
   onCreated() {
     this.lineWidth = this.lineWidth || 3, this.lineColor = this.lineColor || "#000000", this.canvas = null, this.ctx = null, this.status = "stopped";
     const e = 1e3 / 60;
-    this.timer = new ee(e, 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 se(e, 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.
@@ -1410,7 +1483,7 @@ class Xe extends h {
    * @returns {object} Layout definition for the canvas.
    */
   render() {
-    return q({
+    return K({
       style: "touch-action: none; -webkit-user-select: none; -webkit-touch-callout: none;"
     });
   }
@@ -1507,8 +1580,8 @@ class Xe extends h {
     const { canvas: e, ctx: s } = this, a = e.toDataURL();
     if (this.scale(), this.setupBackground(s), a !== "data:,") {
       const i = new globalThis.Image();
-      I.on("load", i, function n() {
-        s.drawImage(i, 0, 0), I.off("load", i, n);
+      B.on("load", i, function n() {
+        s.drawImage(i, 0, 0), B.off("load", i, n);
       }), i.src = a;
     }
     this.draw();
@@ -1528,7 +1601,7 @@ class Xe extends h {
    * @returns {void}
    */
   noScaleResize() {
-    const e = T.getSize(container);
+    const e = M.getSize(container);
     this.width = canvas.width = e.width, this.height = canvas.height = e.height;
   }
   /**
@@ -1538,11 +1611,11 @@ class Xe extends h {
    * @returns {void}
    */
   scale() {
-    const e = this.canvas, s = this.container, a = T.getSize(s), i = this.targetSize, n = i.width, l = i.height;
+    const e = this.canvas, s = this.container, a = M.getSize(s), i = this.targetSize, n = i.width, l = i.height;
     let u = n + "px", c = l + "px";
     if (this.width = e.width = n, this.height = e.height = l, a.width !== 0 && a.height !== 0) {
-      const f = a.width, g = a.height, r = f / n, m = g / l, w = Math.min(r, m);
-      u = n * w + "px", c = l * w + "px";
+      const f = a.width, g = a.height, r = f / n, m = g / l, b = Math.min(r, m);
+      u = n * b + "px", c = l * b + "px";
     }
     e.style.width = u, e.style.height = c;
   }
@@ -1618,7 +1691,7 @@ class Xe extends h {
     this.timer.stop(), this.status = "stopped";
   }
 }
-class gt extends h {
+class bt extends h {
   /**
    * Sets up default properties for the signature panel.
    *
@@ -1635,7 +1708,7 @@ class gt extends h {
    */
   render() {
     return o({ class: "signature-panel relative flex flex-auto overflow-hidden select-none" }, [
-      ae({
+      ne({
         cache: "hiddenInput",
         required: !0,
         bind: this.path + ".data"
@@ -1647,7 +1720,7 @@ class gt extends h {
           click: this.reset.bind(this)
         })
       ]),
-      new Xe({
+      new Ge({
         cache: "canvasLayer",
         margin: this.margin,
         targetSize: this.targetSize,
@@ -1697,34 +1770,35 @@ class gt extends h {
   }
 }
 export {
-  lt as B,
-  pe as C,
-  we as D,
-  be as H,
-  ct as I,
-  ot as N,
-  $ as O,
-  et as P,
-  it as S,
-  N as T,
-  Te as U,
-  at as W,
-  ce as a,
-  B as b,
-  le as c,
-  tt as d,
-  st as e,
-  he as f,
-  re as g,
-  fe as h,
-  ge as i,
-  xe as j,
-  nt as k,
-  rt as l,
-  dt as m,
-  ht as n,
-  ut as o,
-  Qe as p,
-  ft as q,
-  gt as r
+  ht as B,
+  be as C,
+  ke as D,
+  ye as H,
+  ft as I,
+  dt as N,
+  j as O,
+  at as P,
+  rt as S,
+  T,
+  Re as U,
+  ot as W,
+  he as a,
+  R as b,
+  ce as c,
+  it as d,
+  nt as e,
+  fe as f,
+  de as g,
+  me as h,
+  pe as i,
+  N as j,
+  lt as k,
+  ct as l,
+  ut as m,
+  gt as n,
+  mt as o,
+  pt as p,
+  Ke as q,
+  wt as r,
+  bt as s
 };

package/dist/types/components/organisms/lists/dynamic-data-table.d.ts

@@ -0,0 +1,27 @@
+/**
+ * DynamicDataTable Component
+ *
+ * This will create a dynamic data table.
+ *
+ * @param {object} props
+ * @property {function} [props.loadMoreItems] - A function to fetch/generate additional items.
+ * @property {number} [props.offset] - The initial offset. Defaults to 0.
+ * @property {number} [props.limit] - Number of items to load per batch. Defaults to 20.
+ * @property {string} [props.class] - The class to add to the list.
+ * @property {string} [props.key] - The key to use to identify the items.
+ * @property {array} [props.rows] - The initial rows.
+ * @property {function} [props.rowItem] - The row item.
+ * @property {array} [props.headers] - The table headers.
+ * @property {object} [props.customHeader] - The custom header.
+ * @property {function} [props.selectRow] - The function to select a row.
+ * @property {string} [props.border] - The border to add to the table.
+ * @property {object} [props.data] - The table data.
+ * @property {string} [props.cache] - The table cache identifier.
+ * @returns {object}
+ */
+export const DynamicDataTable: Function;
+export default DynamicDataTable;
+import { CheckboxCol } from './table-header.js';
+import { HeaderCol } from './table-header.js';
+import { TableHeader } from './table-header.js';
+export { CheckboxCol, HeaderCol, TableHeader };

package/dist/types/components/organisms/lists/dynamic-table.d.ts

@@ -0,0 +1,32 @@
+export function DynamicTableBody(props: object): object;
+/**
+ * DynamicTable Component
+ *
+ * This will create a dynamic data table.
+ *
+ * @param {object} props
+ * @property {function} [props.loadMoreItems] - A function to fetch/generate additional items.
+ * @property {number} [props.offset] - The initial offset. Defaults to 0.
+ * @property {number} [props.limit] - Number of items to load per batch. Defaults to 20.
+ * @property {string} [props.class] - The class to add to the list.
+ * @property {string} [props.key] - The key to use to identify the items.
+ * @property {object} [props.tableData] - The table data.
+ * @property {array} [props.rows] - The initial rows.
+ * @property {function} [props.rowItem] - The row item.
+ * @property {string} [props.containerClass] - The class to add to the scroll container.
+ * @returns {object}
+ */
+export class DynamicTable extends DataTable {
+    /**
+     * Refreshes the list.
+     *
+     * @returns {void}
+     */
+    refresh(): void;
+}
+export default DynamicTable;
+import { CheckboxCol } from './table-header.js';
+import { HeaderCol } from './table-header.js';
+import { TableHeader } from './table-header.js';
+import { DataTable } from './data-table.js';
+export { CheckboxCol, HeaderCol, TableHeader };

package/dist/types/components/organisms/organisms.d.ts

@@ -14,6 +14,7 @@ export * from "./calendar/utils.js";
 export * from "./lists/checkbox-col.js";
 export * from "./lists/data-table-body.js";
 export * from "./lists/data-table.js";
+export * from "./lists/dynamic-data-table.js";
 export * from "./lists/header-col.js";
 export * from "./lists/scrollable-data-table.js";
 export * from "./lists/table-header.js";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@base-framework/ui",
-	"version": "1.0.167",
+	"version": "1.0.168",
 	"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": {