@base-framework/ui 1.0.62 → 1.0.66

package/dist/{signature-panel-CN_WhW5E.js → signature-panel-BCsAYjDW.js}

@@ -1,10 +1,10 @@
-import { Button as y, Div as o, On as Y, Span as v, Th as P, UseParent as F, I as E, Thead as H, Tr as Q, Table as X, P as m, Li as D, Time as q, Nav as S, Ul as b, Section as O, Canvas as K } from "@base-framework/atoms";
-import { Atom as h, Component as u, Data as L, DateTime as G, Jot as R, router as x, NavLink as M, DataTracker as z, base as B, Dom as I } from "@base-framework/base";
-import { B as C, I as N } from "./buttons-CVEwmPAi.js";
+import { Button as y, Div as o, On as E, Span as v, Th as P, UseParent as H, I as Q, Thead as X, Tr as q, Table as R, P as m, Li as D, Time as K, Nav as S, Ul as b, Section as O, Canvas as G } from "@base-framework/atoms";
+import { Atom as h, Component as u, Data as L, DateTime as V, Jot as M, router as x, NavLink as z, DataTracker as N, base as B, Dom as I } from "@base-framework/base";
+import { B as C, I as $ } from "./buttons-CVEwmPAi.js";
 import { Icons as w } from "./icons.es.js";
-import { TableBody as V, List as _, IntervalTimer as J } from "@base-framework/organisms";
-import { C as Z, I as ee, H as te } from "./inputs-DmJuUwS9.js";
-import { A as se, P as ne } from "./calendar-BDqm833e.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-DmJuUwS9.js";
+import { A as ne, P as ie } from "./calendar-BDqm833e.js";
 h((t, e) => ({
   class: "flex items-center px-4 py-2",
   ...t,
@@ -14,9 +14,9 @@ h(({ value: t, label: e }) => y({
   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: n }) => n.performance = t
+  click: (s, { state: a }) => a.performance = t
 }, e));
-class Ve extends u {
+class Je extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -34,54 +34,54 @@ class Ve extends u {
     return o({ class: this.class || "" }, this.children);
   }
 }
-const ae = (t) => {
+const oe = (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;
-}, ie = (t) => {
+}, le = (t) => {
   const e = new Date(t.valueOf()), s = (e.getDay() + 6) % 7;
   e.setDate(e.getDate() - s + 3);
-  const n = e.getFullYear(), a = new Date(n, 0, 4);
-  a.setDate(a.getDate() - (a.getDay() + 6) % 7);
-  const i = Math.ceil((e - a) / 6048e5) + 1;
-  return i > 52 && !ae(n) ? {
+  const a = e.getFullYear(), n = new Date(a, 0, 4);
+  n.setDate(n.getDate() - (n.getDay() + 6) % 7);
+  const i = Math.ceil((e - n) / 6048e5) + 1;
+  return i > 52 && !oe(a) ? {
     weekNumber: 1,
-    year: n + 1
+    year: a + 1
   } : {
     weekNumber: i,
-    year: n
+    year: a
   };
-}, oe = (t, e, s) => {
+}, re = (t, e, s) => {
   if (s === 0) return [];
-  const n = new Date(t, e, 0).getDate();
+  const a = new Date(t, e, 0).getDate();
   return Array.from(
     { length: s },
-    (a, i) => new Date(t, e - 1, n - s + i + 1)
+    (n, i) => new Date(t, e - 1, a - s + i + 1)
   );
-}, le = (t, e, s) => Array.from({ length: s }, (n, a) => new Date(t, e + 1, a + 1)), T = (t, e) => {
-  const s = new Date(e, 0, 4), n = (s.getDay() + 6) % 7, a = new Date(s);
-  a.setDate(s.getDate() - n);
-  const i = new Date(a);
-  return i.setDate(a.getDate() + (t - 1) * 7), i;
-}, _e = (t, e) => {
-  const s = new Date(t, e, 1).getDay(), n = new Date(t, e + 1, 0).getDate(), a = [];
+}, ce = (t, e, s) => Array.from({ length: s }, (a, n) => new Date(t, e + 1, n + 1)), T = (t, e) => {
+  const s = new Date(e, 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() + (t - 1) * 7), i;
+}, Ze = (t, e) => {
+  const s = new Date(t, e, 1).getDay(), a = new Date(t, e + 1, 0).getDate(), n = [];
   let i = [];
-  for (let l = 1 - s; l <= n; l++) {
+  for (let l = 1 - s; l <= a; l++) {
     const d = new Date(t, e, l);
-    i.push(l > 0 ? d : null), (i.length === 7 || l === n) && (a.push([...i]), i = []);
+    i.push(l > 0 ? d : null), (i.length === 7 || l === a) && (n.push([...i]), i = []);
   }
-  return a;
-}, Je = (t, e) => {
-  const s = new Date(t, e + 1, 0).getDate(), n = [];
-  let a = [];
+  return n;
+}, et = (t, e) => {
+  const s = new Date(t, e + 1, 0).getDate(), a = [];
+  let n = [];
   for (let i = 1; i <= s; i++)
-    a.push(new Date(t, e, i)), a.length === 7 && (n.push(a), a = []);
-  return a.length > 0 && n.push(a), n;
-}, re = (t, e, s) => {
-  const n = /* @__PURE__ */ new Date();
-  return n.getDate() === t && n.getMonth() === e && n.getFullYear() === s;
-}, ce = ({ day: t, month: e, year: s, weekNumber: n, selectWeek: a }) => {
-  const i = re(t, e, s);
+    n.push(new Date(t, e, i)), n.length === 7 && (a.push(n), n = []);
+  return n.length > 0 && a.push(n), a;
+}, de = (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: n }) => {
+  const i = de(t, e, s);
   return y({
     text: t || "",
     disabled: !t,
@@ -90,21 +90,21 @@ const ae = (t) => {
 			${i ? "bg-accent text-accent-foreground" : ""}
 			hover:bg-primary hover:text-primary-foreground
 		`,
-    click: () => a(n, s)
+    click: () => n(a, s)
   });
-}, de = (t, e) => {
-  const s = new Date(t, e, 1).getDay(), n = new Date(t, e + 1, 0).getDate(), a = oe(t, e, s), i = Array.from({ length: n }, (r, p) => new Date(t, e, p + 1)), l = (a.length + i.length) % 7, d = l === 0 ? 0 : 7 - l, c = le(t, e, d), g = [...a, ...i, ...c], f = [];
-  for (let r = 0; r < g.length; r += 7) {
-    const p = g.slice(r, r + 7), k = p.find((U) => U) || new Date(t, e, 1), { weekNumber: j, year: A } = ie(k);
-    f.push({
-      weekNumber: j,
-      year: A,
+}, ue = (t, e) => {
+  const s = new Date(t, e, 1).getDay(), a = new Date(t, e + 1, 0).getDate(), n = re(t, e, s), i = Array.from({ length: a }, (r, p) => new Date(t, e, p + 1)), l = (n.length + i.length) % 7, d = l === 0 ? 0 : 7 - l, c = ce(t, e, d), f = [...n, ...i, ...c], g = [];
+  for (let r = 0; r < f.length; r += 7) {
+    const p = f.slice(r, r + 7), k = p.find((F) => F) || new Date(t, e, 1), { weekNumber: U, year: Y } = le(k);
+    g.push({
+      weekNumber: U,
+      year: Y,
       days: p
     });
   }
-  return f;
-}, he = ({ selectWeek: t }) => Y("month", (e, s, { data: n }) => {
-  const { year: a, month: i, currentDate: l } = n, d = de(a, i);
+  return g;
+}, fe = ({ selectWeek: t }) => E("month", (e, s, { data: a }) => {
+  const { year: n, month: i, currentDate: l } = a, d = ue(n, i);
   return o(
     { class: "grid grid-cols-8 gap-1 text-sm px-4 py-2" },
     [
@@ -120,7 +120,7 @@ const ae = (t) => {
       ),
       // Render each "week" row
       ...d.map(
-        ({ weekNumber: c, days: g, year: f }) => o({
+        ({ weekNumber: c, days: f, year: g }) => 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 ae = (t) => {
           // Left column: ISO week number
           o({
             class: "font-medium text-center col-span-1 rounded-sm cursor-pointer",
-            click: () => t(c, f),
+            click: () => t(c, g),
             // If you have a 'currentWeek' state, you can highlight it with 'onSet'
             onSet: ["currentWeek", {
               "text-primary-foreground": c,
@@ -140,8 +140,8 @@ const ae = (t) => {
           // The 7 cells for each day in the row
           o(
             { class: "grid grid-cols-7 col-span-7 text-center" },
-            g.map(
-              (r) => ce({
+            f.map(
+              (r) => he({
                 year: (r == null ? void 0 : r.getFullYear()) || null,
                 month: (r == null ? void 0 : r.getMonth()) || null,
                 day: (r == null ? void 0 : r.getDate()) || null,
@@ -167,7 +167,7 @@ const ae = (t) => {
     variant: "icon",
     icon: t === "Previous" ? w.chevron.single.left : w.chevron.single.right
   }
-), ue = ({ next: t, previous: e }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
+), ge = ({ next: t, previous: e }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
   v("[[monthName]] [[year]]"),
   W({
     label: "Previous",
@@ -178,7 +178,7 @@ const ae = (t) => {
     click: t
   })
 ]);
-class Ze extends u {
+class tt extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -193,12 +193,12 @@ class Ze extends u {
    * @returns {Data}
    */
   setData() {
-    const e = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(e), n = T(s, e.getFullYear());
+    const e = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(e), a = T(s, e.getFullYear());
     return new L({
-      monthName: this.getMonthName(n.getMonth()),
-      year: n.getFullYear(),
-      month: n.getMonth(),
-      currentDate: n.getDate(),
+      monthName: this.getMonthName(a.getMonth()),
+      year: a.getFullYear(),
+      month: a.getMonth(),
+      currentDate: a.getDate(),
       currentWeek: s
     });
   }
@@ -219,10 +219,10 @@ class Ze extends u {
    * @returns {number}
    */
   calculateCurrentWeek(e) {
-    const s = new Date(e.valueOf()), n = (e.getDay() + 6) % 7;
-    s.setDate(s.getDate() - n + 3);
-    const a = s.valueOf();
-    return s.setMonth(0, 1), s.getDay() !== 4 && s.setMonth(0, 1 + (4 - s.getDay() + 7) % 7), 1 + Math.ceil((a - s) / 6048e5);
+    const s = new Date(e.valueOf()), a = (e.getDay() + 6) % 7;
+    s.setDate(s.getDate() - a + 3);
+    const n = s.valueOf();
+    return s.setMonth(0, 1), s.getDay() !== 4 && s.setMonth(0, 1 + (4 - s.getDay() + 7) % 7), 1 + Math.ceil((n - s) / 6048e5);
   }
   /**
    * Gets the name of the month.
@@ -231,7 +231,7 @@ class Ze extends u {
    * @returns {string}
    */
   getMonthName(e) {
-    return G.monthNames[e];
+    return V.monthNames[e];
   }
   /**
    * Updates the calendar to show the previous month.
@@ -240,8 +240,8 @@ class Ze extends u {
    */
   goToPreviousMonth() {
     const e = this.data;
-    let { year: s, month: n } = e;
-    n === 0 ? (n = 11, s--) : n--, this.setDate(n, s);
+    let { year: s, month: a } = e;
+    a === 0 ? (a = 11, s--) : a--, this.setDate(a, s);
   }
   /**
    * Updates the calendar to show the next month.
@@ -250,8 +250,8 @@ class Ze extends u {
    */
   goToNextMonth() {
     const e = this.data;
-    let { year: s, month: n } = e;
-    n === 11 ? (n = 0, s++) : n++, this.setDate(n, s);
+    let { year: s, month: a } = e;
+    a === 11 ? (a = 0, s++) : a++, this.setDate(a, s);
   }
   /**
    * Sets the selected date.
@@ -261,12 +261,12 @@ class Ze extends u {
    * @param {number|null} [date=null]
    * @returns {void}
    */
-  setDate(e, s, n) {
+  setDate(e, s, a) {
     this.data.set({
       year: s,
       month: e,
       monthName: this.getMonthName(e)
-    }), n && (this.data.currentDate = n);
+    }), a && (this.data.currentDate = a);
   }
   /**
    * Handles week selection.
@@ -276,8 +276,8 @@ class Ze extends u {
    */
   selectWeek(e, s) {
     this.data.currentWeek = e;
-    const n = T(e, s);
-    this.setDate(n.getMonth(), n.getFullYear(), n.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(e);
+    const a = T(e, s);
+    this.setDate(a.getMonth(), a.getFullYear(), a.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(e);
   }
   /**
    * Renders the WeekCalendar component.
@@ -286,36 +286,36 @@ class Ze extends u {
    */
   render() {
     return o({ class: "week-calendar-container border rounded-md bg-background p-3" }, [
-      ue({
+      ge({
         next: () => this.goToNextMonth(),
         previous: () => this.goToPreviousMonth()
       }),
-      he({
+      fe({
         selectWeek: (e, s) => this.selectWeek(e, s)
       })
     ]);
   }
 }
-const ge = (t, e) => {
+const pe = (t, e) => {
   const s = t.toggleAllSelectedRows();
   e.state.checked = !s;
-}, fe = (t) => P({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
-  F((e) => new Z({ class: "mr-2", onChange: (s, n) => ge(e, n) }))
-]), pe = ({ align: t, sortable: e, key: s, label: n, sort: a, class: i }) => {
+}, me = (t) => P({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
+  H((e) => new te({ class: "mr-2", onChange: (s, a) => pe(e, a) }))
+]), we = ({ align: t, sortable: e, key: s, label: a, sort: n, class: i }) => {
   const l = t || "justify-start";
   return P({
     class: `cursor-pointer py-3 px-4 text-base ${i || ""}`,
-    click: e && (() => a(s))
+    click: e && (() => n(s))
   }, [
     o({ class: `flex flex-auto w-full items-center ${l}` }, [
-      v(n),
-      e && E({ class: "ml-2", html: w.arrows.upDown })
+      v(a),
+      e && Q({ class: "ml-2", html: w.arrows.upDown })
     ])
   ]);
-}, me = (t) => H([
-  Q({
+}, j = (t) => X([
+  q({
     class: "text-muted-foreground border-b",
-    map: [t.headers, (e) => e.label === "checkbox" ? fe({ toggle: t.toggle }) : pe({
+    map: [t.headers, (e) => e.label === "checkbox" ? me({ toggle: t.toggle }) : we({
       align: e.align,
       sortable: e.sortable,
       key: e.key,
@@ -323,13 +323,13 @@ const ge = (t, e) => {
       sort: t.sort
     })]
   })
-]), we = ({ key: t, rows: e, selectRow: s, rowItem: n }) => new V({
+]), be = ({ key: t, rows: e, selectRow: s, rowItem: a }) => new _({
   cache: "table",
   key: t,
   items: e,
-  rowItem: (a) => n(a, s),
+  rowItem: (n) => a(n, s),
   class: "divide-y divide-border"
-}), et = R(
+}), ke = M(
   {
     /**
      * Initializes component data.
@@ -387,8 +387,8 @@ const ge = (t, e) => {
     selectRow(t) {
       const e = t.selected ?? !1;
       t.selected = !e;
-      const s = this.data.get("selectedRows"), n = t.selected ? [...s, t] : s.filter((a) => a !== t);
-      this.data.selectedRows = n, this.updateSelected();
+      const s = this.data.get("selectedRows"), a = t.selected ? [...s, t] : s.filter((n) => n !== t);
+      this.data.selectedRows = a, this.updateSelected();
     },
     /**
      * Renders the DataTable component.
@@ -399,12 +399,12 @@ const ge = (t, e) => {
       const t = this.rows, e = this.border !== !1 ? "border" : "";
       return o({ class: "w-full" }, [
         o({ class: `w-full rounded-md ${e} overflow-x-auto` }, [
-          X({ class: "w-full" }, [
+          R({ class: "w-full" }, [
             // @ts-ignore
-            this.headers && me({ headers: this.headers, sort: (s) => this.sortRows(s) }),
+            this.headers && j({ headers: this.headers, sort: (s) => this.sortRows(s) }),
             // @ts-ignore
             this.customHeader ?? null,
-            we({
+            be({
               // @ts-ignore
               key: this.key,
               rows: t,
@@ -477,45 +477,75 @@ const ge = (t, e) => {
       this.data.selectedRows = [];
     }
   }
-), be = h(({ name: t, email: e }) => o({ class: "min-w-0 flex-auto" }, [
+);
+class st extends ke {
+  /**
+   * 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` }, [
+        R({ class: "w-full" }, [
+          // @ts-ignore
+          this.headers && j({ headers: this.headers, sort: (a) => this.sortRows(a) }),
+          // @ts-ignore
+          this.customHeader ?? null,
+          J({
+            // @ts-ignore
+            key: this.key,
+            rows: e,
+            // @ts-ignore
+            selectRow: this.selectRow.bind(this),
+            // @ts-ignore
+            rowItem: this.rowItem
+          })
+        ])
+      ])
+    ]);
+  }
+}
+const xe = h(({ name: t, email: e }) => o({ class: "min-w-0 flex-auto" }, [
   m({ class: "text-base font-semibold leading-6 m-0" }, t),
   m({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, e)
-])), ke = () => o({ class: "flex items-center gap-x-1.5" }, [
+])), ye = () => 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" })
   ]),
   m({ class: "text-xs leading-5 text-gray-500" }, "Online")
-]), xe = (t) => m({ class: "text-xs leading-5 text-muted-foreground" }, [
+]), ve = (t) => m({ class: "text-xs leading-5 text-muted-foreground" }, [
   v("Last seen "),
-  q({ datetime: t }, "3h ago")
-]), ye = (t, e) => t === "online" ? ke() : xe(e), ve = h(({ role: t, lastSeen: e, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
+  K({ datetime: t }, "3h ago")
+]), De = (t, e) => t === "online" ? ye() : ve(e), Se = h(({ role: t, lastSeen: e, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
   m({ class: "text-sm leading-6 m-0" }, t),
-  ye(s, e)
-])), De = (t) => t.split(" ").map((s) => s[0]).join(""), Se = h((t) => D({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
+  De(s, e)
+])), Le = (t) => t.split(" ").map((s) => s[0]).join(""), Ce = h((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" }, [
-    se({ src: t.image, alt: t.name, fallbackText: De(t.name) }),
-    be({ name: t.name, email: t.email })
+    ne({ src: t.image, alt: t.name, fallbackText: Le(t.name) }),
+    xe({ name: t.name, email: t.email })
   ]),
-  ve({
+  Se({
     role: t.role,
     lastSeen: t.lastSeen,
     status: t.status
   })
-])), tt = h((t) => new _({
+])), at = h((t) => new Z({
   cache: "list",
   key: "name",
   items: t.users,
   role: "list",
   class: "divide-y divide-border",
-  rowItem: Se
-})), Le = (t, e) => e.includes(t), Ce = (t, e, s) => t.exact ? s === e : Le(e, s), Be = ({ text: t, href: e, exact: s, hidden: n }) => new M({
+  rowItem: Ce
+})), Be = (t, e) => e.includes(t), Ie = (t, e, s) => t.exact ? s === e : Be(e, s), Te = ({ text: t, href: e, exact: s, hidden: a }) => new z({
   text: t,
   href: e,
   exact: s,
   dataSet: ["selected", ["state", !0, "active"]],
-  class: `${n ? "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: `${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 st extends u {
+class nt extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -568,10 +598,10 @@ class st extends u {
   updateLinks(e) {
     let s = !1;
     this.deactivateAllLinks();
-    for (const n of this.links) {
-      if (!n.rendered)
+    for (const a of this.links) {
+      if (!a.rendered)
         continue;
-      Ce(n, n.getLinkPath(), e) ? (this.updateLink(n, !0), s = !0) : this.updateLink(n, !1);
+      Ie(a, a.getLinkPath(), e) ? (this.updateLink(a, !0), s = !0) : this.updateLink(a, !1);
     }
     !s && this.links[0] && this.updateLink(this.links[0], !0);
   }
@@ -600,8 +630,8 @@ class st extends u {
    * @param {object} option
    * @returns {object}
    */
-  addLink({ label: e, href: s, exact: n, hidden: a }) {
-    const i = Be({ text: e, href: s, exact: n, hidden: a });
+  addLink({ label: e, href: s, exact: a, hidden: n }) {
+    const i = Te({ text: e, href: s, exact: a, hidden: n });
     return this.links.push(i), i;
   }
   /**
@@ -613,7 +643,7 @@ class st extends u {
     this.links = [];
   }
 }
-const nt = h((t) => {
+const it = h((t) => {
   const e = t.margin || "m-4 ml-0";
   return o({ class: `flex-none ${e}` }, [
     C({
@@ -627,11 +657,11 @@ const nt = h((t) => {
         t.backUrl && app.navigate(t.backUrl);
       }
     }, [
-      N(w.arrows.left)
+      $(w.arrows.left)
     ])
   ]);
 });
-class $ extends u {
+class A extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -718,13 +748,13 @@ class $ extends u {
     return this.children;
   }
 }
-z.addType("dockableOverlay", (t) => {
+N.addType("dockableOverlay", (t) => {
   if (!t)
     return;
   const e = t.component;
   e && e.rendered === !0 && e.state.docked === !1 && e.destroy();
 });
-class at extends $ {
+class ot extends A {
   /**
    * This will stop presistence.
    *
@@ -746,8 +776,8 @@ class at extends $ {
           ["loading", {
             loading: !0
           }],
-          ["docked", (s, n) => {
-            s ? (n.className = this.getDockedClassName(), e.appendChild(n), document.documentElement.style.overflowY = "auto") : (n.className = this.getClassName(), app.root.appendChild(n), document.documentElement.style.overflowY = "hidden");
+          ["docked", (s, a) => {
+            s ? (a.className = this.getDockedClassName(), e.appendChild(a), document.documentElement.style.overflowY = "auto") : (a.className = this.getClassName(), app.root.appendChild(a), document.documentElement.style.overflowY = "hidden");
           }]
         ]
       },
@@ -790,7 +820,7 @@ class at extends $ {
    * @returns {void}
    */
   afterSetup() {
-    z.add(
+    N.add(
       this.container,
       "dockableOverlay",
       {
@@ -833,7 +863,7 @@ class at extends $ {
     document.documentElement.style.overflowY = "auto";
   }
 }
-class it extends $ {
+class lt extends A {
   /**
    * This will get the overlay type.
    *
@@ -852,7 +882,7 @@ class it extends $ {
     this.container = e, this.initialize();
   }
 }
-const Ie = h(({ index: t, click: e, state: s }, n) => D({
+const We = h(({ index: t, click: e, state: s }, a) => D({
   class: "p-2 cursor-pointer hover:bg-muted/50",
   onState: [
     [s, "selectedIndex", {
@@ -861,11 +891,11 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
     }]
   ],
   click: () => e(t)
-}, n)), Te = h(({ selectOption: t, state: e }) => b({
+}, a)), Pe = h(({ selectOption: t, state: e }) => b({
   class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, n) => Ie({ index: n, click: t, state: e }, s.label)]
-})), We = h((t) => o({ class: "relative flex items-center" }, [
-  ee({
+  for: ["filteredOptions", (s, a) => We({ index: a, click: t, state: e }, s.label)]
+})), Re = h((t) => o({ class: "relative flex items-center" }, [
+  se({
     cache: "input",
     placeholder: t.placeholder ?? "Search...",
     bind: [t.state, "searchQuery"],
@@ -876,22 +906,22 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
     keydown: (e) => typeof t.handleKeyDown == "function" && t.handleKeyDown(e)
   }),
   t.icon && o({ class: "absolute right-0 mr-2" }, [
-    N(t.icon)
+    $(t.icon)
   ])
-])), Pe = (t) => o({
+])), Oe = (t) => o({
   class: "relative flex fle-auto flex-col",
-  onState: ["open", (e, s, n) => {
+  onState: ["open", (e, s, a) => {
     if (e)
-      return new ne({
+      return new ie({
         cache: "dropdown",
-        parent: n,
-        button: n.input,
+        parent: a,
+        button: a.input,
         size: "xl"
       }, [
-        Te(t)
+        Pe(t)
       ]);
   }]
-}), ot = R(
+}), rt = M(
   {
     /**
      * This will set up the data object.
@@ -926,7 +956,7 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
       const t = this.data.filteredOptions;
       let { searchQuery: e } = this.state;
       e = e.toLowerCase();
-      const s = t.findIndex((n) => n.label.toLowerCase() === e);
+      const s = t.findIndex((a) => a.label.toLowerCase() === e);
       s >= 0 && (this.state.selectedIndex = s);
     },
     /**
@@ -988,7 +1018,7 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
      */
     render() {
       return o({ class: "relative w-full max-w-md" }, [
-        We({
+        Re({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1000,7 +1030,7 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
           // @ts-ignore
           handleKeyDown: this.handleKeyDown.bind(this)
         }),
-        Pe({
+        Oe({
           // @ts-ignore
           state: this.state,
           // @ts-ignore
@@ -1011,7 +1041,7 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
       ]);
     }
   }
-), Oe = (t) => D(
+), Me = (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"]]
@@ -1023,10 +1053,10 @@ const Ie = h(({ index: t, click: e, state: s }, n) => D({
       click: (e) => t.callBack(t.value)
     }, t.label)
   ]
-), Re = (t, e) => (t.callBack = e, Oe(t)), Me = (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) => Re(e, t.callBack)] })
+), ze = (t, e) => (t.callBack = e, Me(t)), Ne = (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) => ze(e, t.callBack)] })
 ]);
-class lt extends u {
+class ct extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -1043,7 +1073,7 @@ class lt extends u {
   render() {
     const e = this.select.bind(this);
     return o({ class: "" }, [
-      Me({
+      Ne({
         class: this.class,
         options: this.options,
         callBack: e
@@ -1091,11 +1121,11 @@ class lt extends u {
     const s = this.options;
     if (!s || s.length < 1)
       return;
-    const n = s[0];
-    for (const a of s)
-      if (a.value === e)
-        return a.layout;
-    return n.layout;
+    const a = s[0];
+    for (const n of s)
+      if (n.value === e)
+        return n.layout;
+    return a.layout;
   }
   /**
    * This will setup the states.
@@ -1107,14 +1137,14 @@ class lt extends u {
     return {
       selected: {
         state: this.getFirstValue(),
-        callBack(n) {
-          s === "function" && e(n);
+        callBack(a) {
+          s === "function" && e(a);
         }
       }
     };
   }
 }
-const ze = (t) => D(
+const $e = (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"]]
@@ -1127,10 +1157,10 @@ const ze = (t) => D(
       disabled: t.disabled
     }, t.label)
   ]
-), Ne = (t, e) => (t.callBack = e, ze(t)), $e = (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) => Ne(e, t.callBack)] })
+), je = (t, e) => (t.callBack = e, $e(t)), Ae = (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) => je(e, t.callBack)] })
 ]);
-class rt extends u {
+class dt extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -1146,7 +1176,7 @@ class rt extends u {
    */
   render() {
     const e = this.select.bind(this);
-    return $e({
+    return Ae({
       class: this.class,
       options: this.options,
       callBack: e
@@ -1173,17 +1203,17 @@ class rt extends u {
     };
   }
 }
-const je = (t, e) => new RegExp(`${t}($|/|\\.).*`).test(e), Ae = (t, e) => {
+const Ue = (t, e) => new RegExp(`${t}($|/|\\.).*`).test(e), Ye = (t, e) => {
   const s = t.getLinkPath();
-  return t.exact ? e === s : je(s, e);
-}, Ue = ({ text: t, href: e, exact: s }) => new M({
+  return t.exact ? e === s : Ue(s, e);
+}, Fe = ({ 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 Ye extends u {
+class Ee extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -1231,14 +1261,14 @@ class Ye extends u {
    * @returns {void}
    */
   updateLinks(e) {
-    let s = !1, n = this.links[0];
+    let s = !1, a = this.links[0];
     this.deactivateAllLinks();
-    for (const a of this.links)
-      if (a.rendered !== !1 && (s = Ae(a, e), s === !0)) {
-        this.updateLink(a, !0);
+    for (const n of this.links)
+      if (n.rendered !== !1 && (s = Ye(n, e), s === !0)) {
+        this.updateLink(n, !0);
         break;
       }
-    s !== !0 && n && this.updateLink(n, !0);
+    s !== !0 && a && this.updateLink(a, !0);
   }
   /**
    * This will deactivate all links.
@@ -1265,9 +1295,9 @@ class Ye extends u {
    * @param {object} option
    * @returns {object}
    */
-  addLink({ label: e, href: s, exact: n }) {
-    const a = Ue({ text: e, href: s, exact: n });
-    return this.links.push(a), a;
+  addLink({ label: e, href: s, exact: a }) {
+    const n = Fe({ text: e, href: s, exact: a });
+    return this.links.push(n), n;
   }
   /**
    * This will remove all the links.
@@ -1278,7 +1308,7 @@ class Ye extends u {
     this.links = [];
   }
 }
-class ct extends u {
+class ht extends u {
   /**
    * This will declare the props for the compiler.
    *
@@ -1294,7 +1324,7 @@ class ct extends u {
    */
   render() {
     return o({ class: "tab-panel" }, [
-      new Ye({
+      new Ee({
         class: this.class,
         options: this.options
       }),
@@ -1311,9 +1341,9 @@ class ct extends u {
    */
   addGroup() {
     let e;
-    const s = [], n = this.options;
-    for (let a = 0, i = n.length; a < i; a++)
-      e = n[a], s.push(
+    const s = [], a = this.options;
+    for (let n = 0, i = a.length; n < i; n++)
+      e = a[n], s.push(
         {
           uri: e.uri || e.href,
           component: e.component,
@@ -1324,7 +1354,7 @@ class ct extends u {
     return s;
   }
 }
-class Fe extends u {
+class He extends u {
   /**
    * Runs before rendering, sets up defaults, a timer for drawing,
    * and basic canvas properties.
@@ -1334,7 +1364,7 @@ class Fe extends u {
   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 J(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 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";
   }
   /**
    * Renders a <canvas> element.
@@ -1342,7 +1372,7 @@ class Fe extends u {
    * @returns {object} Layout definition for the canvas.
    */
   render() {
-    return K({
+    return G({
       style: "touch-action: none; -webkit-user-select: none; -webkit-touch-callout: none;"
     });
   }
@@ -1372,12 +1402,12 @@ class Fe extends u {
    * @returns {Array} An array of [eventName, element, callback] definitions.
    */
   setupEvents() {
-    const e = this.panel, s = this.pointerPosition.bind(this), n = this.pointerUp.bind(this), a = this.pointerDown.bind(this), i = this.resize.bind(this), l = { passive: !1 };
+    const e = this.panel, s = this.pointerPosition.bind(this), a = this.pointerUp.bind(this), n = this.pointerDown.bind(this), i = this.resize.bind(this), l = { passive: !1 };
     return [
       ["pointermove", e, s, l],
-      ["pointerup", e, n],
-      ["pointerdown", e, a, l],
-      ["pointerout", e, n],
+      ["pointerup", e, a],
+      ["pointerdown", e, n, l],
+      ["pointerout", e, a],
       ["resize", window, i]
     ];
   }
@@ -1388,14 +1418,14 @@ class Fe extends u {
    * @returns {void}
    */
   getEventPosition(e) {
-    let s, n;
-    const a = this.canvas, i = a.width / parseInt(a.style.width), l = a.getBoundingClientRect();
+    let s, a;
+    const n = this.canvas, i = n.width / parseInt(n.style.width), l = n.getBoundingClientRect();
     if (e.touches && e.touches.length) {
-      const g = e.touches[0];
-      s = g.clientX, n = g.clientY;
+      const f = e.touches[0];
+      s = f.clientX, a = f.clientY;
     } else
-      s = e.x || e.clientX, n = e.y || e.clientY;
-    const d = parseInt((s - l.left) * i), c = parseInt((n - l.top) * i);
+      s = e.x || e.clientX, a = e.y || e.clientY;
+    const d = parseInt((s - l.left) * i), c = parseInt((a - l.top) * i);
     this.mouse.x = d, this.mouse.y = c;
   }
   /**
@@ -1407,8 +1437,8 @@ class Fe extends u {
    */
   pointerDown(e) {
     e.preventDefault(), e.stopPropagation(), this.getEventPosition(e);
-    const { ctx: s, mouse: n } = this;
-    s.beginPath(), s.moveTo(n.x, n.y), n.status = "down", this.startTimer();
+    const { ctx: s, mouse: a } = this;
+    s.beginPath(), s.moveTo(a.x, a.y), a.status = "down", this.startTimer();
   }
   /**
    * Called when the pointer goes up or leaves the canvas area.
@@ -1436,12 +1466,12 @@ class Fe extends u {
    * @returns {void}
    */
   resize() {
-    const { canvas: e, ctx: s } = this, n = e.toDataURL();
-    if (this.scale(), this.setupBackground(s), n !== "data:,") {
-      const a = new window.Image();
-      B.on("load", a, function i() {
-        s.drawImage(a, 0, 0), B.off("load", a, i);
-      }), a.src = n;
+    const { canvas: e, ctx: s } = this, a = e.toDataURL();
+    if (this.scale(), this.setupBackground(s), a !== "data:,") {
+      const n = new window.Image();
+      B.on("load", n, function i() {
+        s.drawImage(n, 0, 0), B.off("load", n, i);
+      }), n.src = a;
     }
     this.draw();
   }
@@ -1470,10 +1500,10 @@ class Fe extends u {
    * @returns {void}
    */
   scale() {
-    const e = this.canvas, s = this.container, n = I.getSize(s), a = this.targetSize, i = a.width, l = a.height;
+    const e = this.canvas, s = this.container, a = I.getSize(s), n = this.targetSize, i = n.width, l = n.height;
     let d = i + "px", c = l + "px";
-    if (this.width = e.width = i, this.height = e.height = l, n.width !== 0 && n.height !== 0) {
-      const g = n.width, f = n.height, r = g / i, p = f / l, k = Math.min(r, p);
+    if (this.width = e.width = i, this.height = e.height = l, a.width !== 0 && a.height !== 0) {
+      const f = a.width, g = a.height, r = f / i, p = g / l, k = Math.min(r, p);
       d = i * k + "px", c = l * k + "px";
     }
     e.style.width = d, e.style.height = c;
@@ -1496,8 +1526,8 @@ class Fe extends u {
   drawBottomLine(e) {
     const s = this.canvas;
     e.globalAlpha = 1, e.shadowBlur = 0;
-    const n = this.margin.x, a = this.height - this.margin.y;
-    e.beginPath(), e.moveTo(n, a), e.lineTo(s.width - this.margin.x, a), e.lineWidth = this.baseLineWidth, e.strokeStyle = this.baseStrokeColor, e.stroke(), e.closePath();
+    const a = this.margin.x, n = this.height - this.margin.y;
+    e.beginPath(), e.moveTo(a, n), e.lineTo(s.width - this.margin.x, n), e.lineWidth = this.baseLineWidth, e.strokeStyle = this.baseStrokeColor, e.stroke(), e.closePath();
   }
   /**
    * Adds a line to the current path, updating the 'signed' status.
@@ -1508,10 +1538,10 @@ class Fe extends u {
    * @param {string} color The stroke color.
    * @returns {void}
    */
-  addLine(e, s, n, a) {
+  addLine(e, s, a, n) {
     this.signed || (this.signed = !0);
-    const i = Math.round(s), l = Math.round(n);
-    e.lineWidth = this.lineWidth, e.strokeStyle = a, e.lineTo(i, l), e.stroke();
+    const i = Math.round(s), l = Math.round(a);
+    e.lineWidth = this.lineWidth, e.strokeStyle = n, e.lineTo(i, l), e.stroke();
   }
   /**
    * Clears the canvas, sets signed to false, and re-initializes
@@ -1550,7 +1580,7 @@ class Fe extends u {
     this.timer.stop(), this.status = "stopped";
   }
 }
-class dt extends u {
+class ut extends u {
   /**
    * Sets up default properties for the signature panel.
    *
@@ -1567,7 +1597,7 @@ class dt extends u {
    */
   render() {
     return o({ class: "signature-panel relative flex flex-auto overflow-hidden select-none" }, [
-      te({
+      ae({
         cache: "hiddenInput",
         required: !0,
         bind: this.path + ".data"
@@ -1579,7 +1609,7 @@ class dt extends u {
           click: this.reset.bind(this)
         })
       ]),
-      new Fe({
+      new He({
         cache: "canvasLayer",
         margin: this.margin,
         targetSize: this.targetSize,
@@ -1629,33 +1659,34 @@ class dt extends u {
   }
 }
 export {
-  nt as B,
-  fe as C,
-  we as D,
-  pe as H,
-  it as I,
-  st as N,
-  $ as O,
-  Ve as P,
-  ot as S,
-  me as T,
-  Se as U,
-  Ze as W,
-  le as a,
+  it as B,
+  me as C,
+  be as D,
+  we as H,
+  lt as I,
+  nt as N,
+  A as O,
+  Je as P,
+  st as S,
+  j as T,
+  Ce as U,
+  tt as W,
+  ce as a,
   T as b,
-  ie as c,
-  _e as d,
-  Je as e,
-  ce as f,
-  oe as g,
-  he as h,
-  ue as i,
-  et as j,
-  tt as k,
-  at as l,
-  lt as m,
-  rt as n,
-  Ye as o,
-  ct as p,
-  dt as q
+  le as c,
+  Ze as d,
+  et as e,
+  he as f,
+  re as g,
+  fe as h,
+  ge as i,
+  ke as j,
+  at as k,
+  ot as l,
+  rt as m,
+  ct as n,
+  dt as o,
+  Ee as p,
+  ht as q,
+  ut as r
 };