@base-framework/ui 1.2.51 → 1.2.54

package/dist/{signature-panel-C0enb6BJ.js → signature-panel-hgJVdLcO.js}

@@ -1,8 +1,8 @@
-import { Div as r, Button as b, On as I, Span as M, Nav as f, Ul as p, Section as y, Li as w, Canvas as U } from "@base-framework/atoms";
-import { Component as k, Data as A, DateTime as F, router as v, NavLink as B, base as P, Dom as W } from "@base-framework/base";
-import { f as $, av as O, b0 as u, a7 as Y } from "./full-page-BSJ6rkbe.js";
-import { Icons as S } from "./icons.es.js";
-import { IntervalTimer as R } from "@base-framework/organisms";
+import { Div as r, Button as b, On as U, Span as $, Nav as f, Ul as p, Section as y, Li as w, Canvas as R } from "@base-framework/atoms";
+import { Component as k, Data as F, DateTime as O, router as v, NavLink as C, base as P, Dom as W } from "@base-framework/base";
+import { f as N, av as Y, b0 as d, a7 as A } from "./full-page-IgSz7snX.js";
+import { Icons as B } from "./icons.es.js";
+import { IntervalTimer as V } from "@base-framework/organisms";
 class Pt extends k {
   /**
    * This will declare the props for the compiler.
@@ -38,14 +38,14 @@ const E = (s) => {
     weekNumber: a,
     year: i
   };
-}, V = (s, t, e) => {
+}, X = (s, t, e) => {
   if (e === 0) return [];
   const i = new Date(s, t, 0).getDate();
   return Array.from(
     { length: e },
     (n, a) => new Date(s, t - 1, i - e + a + 1)
   );
-}, X = (s, t, e) => Array.from({ length: e }, (i, n) => new Date(s, t + 1, n + 1)), C = (s, t) => {
+}, q = (s, t, e) => Array.from({ length: e }, (i, n) => new Date(s, t + 1, n + 1)), T = (s, t) => {
   const e = new Date(t, 0, 4), i = (e.getDay() + 6) % 7, n = new Date(e);
   n.setDate(e.getDate() - i);
   const a = new Date(n);
@@ -54,21 +54,21 @@ const E = (s) => {
   const e = new Date(s, t, 1).getDay(), i = new Date(s, t + 1, 0).getDate(), n = [];
   let a = [];
   for (let o = 1 - e; o <= i; o++) {
-    const h = new Date(s, t, o);
-    a.push(o > 0 ? h : null), (a.length === 7 || o === i) && (n.push([...a]), a = []);
+    const c = new Date(s, t, o);
+    a.push(o > 0 ? c : null), (a.length === 7 || o === i) && (n.push([...a]), a = []);
   }
   return n;
-}, Ct = (s, t) => {
+}, Tt = (s, t) => {
   const e = new Date(s, t + 1, 0).getDate(), i = [];
   let n = [];
   for (let a = 1; a <= e; a++)
     n.push(new Date(s, t, a)), n.length === 7 && (i.push(n), n = []);
   return n.length > 0 && i.push(n), i;
-}, q = (s, t, e) => {
+}, H = (s, t, e) => {
   const i = /* @__PURE__ */ new Date();
   return i.getDate() === s && i.getMonth() === t && i.getFullYear() === e;
-}, H = ({ day: s, month: t, year: e, weekNumber: i, selectWeek: n }) => {
-  const a = q(s, t, e);
+}, _ = ({ day: s, month: t, year: e, weekNumber: i, selectWeek: n }) => {
+  const a = H(s, t, e);
   return b({
     text: s || "",
     disabled: !s,
@@ -79,19 +79,19 @@ const E = (s) => {
 		`,
     click: () => n(i, e)
   });
-}, _ = (s, t) => {
-  const e = new Date(s, t, 1).getDay(), i = new Date(s, t + 1, 0).getDate(), n = V(s, t, e), a = Array.from({ length: i }, (c, m) => new Date(s, t, m + 1)), o = (n.length + a.length) % 7, h = o === 0 ? 0 : 7 - o, l = X(s, t, h), d = [...n, ...a, ...l], g = [];
-  for (let c = 0; c < d.length; c += 7) {
-    const m = d.slice(c, c + 7), x = m.find((z) => z) || new Date(s, t, 1), { weekNumber: N, year: j } = G(x);
+}, J = (s, t) => {
+  const e = new Date(s, t, 1).getDay(), i = new Date(s, t + 1, 0).getDate(), n = X(s, t, e), a = Array.from({ length: i }, (h, m) => new Date(s, t, m + 1)), o = (n.length + a.length) % 7, c = o === 0 ? 0 : 7 - o, l = q(s, t, c), u = [...n, ...a, ...l], g = [];
+  for (let h = 0; h < u.length; h += 7) {
+    const m = u.slice(h, h + 7), x = m.find((I) => I) || new Date(s, t, 1), { weekNumber: j, year: z } = G(x);
     g.push({
-      weekNumber: N,
-      year: j,
+      weekNumber: j,
+      year: z,
       days: m
     });
   }
   return g;
-}, J = ({ selectWeek: s }) => I("month", (t, e, { data: i }) => {
-  const { year: n, month: a, currentDate: o } = i, h = _(n, a);
+}, K = ({ selectWeek: s }) => U("month", (t, e, { data: i }) => {
+  const { year: n, month: a, currentDate: o } = i, c = J(n, a);
   return r(
     { class: "grid grid-cols-8 gap-1 text-sm px-4 py-2" },
     [
@@ -102,12 +102,12 @@ const E = (s) => {
           class: "grid grid-cols-7 col-span-7 text-center text-muted-foreground items-center"
         },
         ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(
-          (l) => M({ class: "px-1 py-1", text: l })
+          (l) => $({ class: "px-1 py-1", text: l })
         )
       ),
       // Render each "week" row
-      ...h.map(
-        ({ weekNumber: l, days: d, year: g }) => r({
+      ...c.map(
+        ({ weekNumber: l, days: u, year: g }) => r({
           class: "grid grid-cols-8 col-span-8 items-center ring-primary rounded-sm px-1",
           onSet: ["currentWeek", {
             ring: l
@@ -127,11 +127,11 @@ const E = (s) => {
           // The 7 cells for each day in the row
           r(
             { class: "grid grid-cols-7 col-span-7 text-center" },
-            d.map(
-              (c) => H({
-                year: c?.getFullYear() || null,
-                month: c?.getMonth() || null,
-                day: c?.getDate() || null,
+            u.map(
+              (h) => _({
+                year: h?.getFullYear() || null,
+                month: h?.getMonth() || null,
+                day: h?.getDate() || null,
                 weekNumber: l,
                 selectWeek: s
               })
@@ -141,7 +141,7 @@ const E = (s) => {
       )
     ]
   );
-}), T = ({ label: s, click: t }) => $(
+}), M = ({ label: s, click: t }) => N(
   {
     class: `
 			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
@@ -152,20 +152,20 @@ const E = (s) => {
     click: t,
     "aria-label": `${s} month`,
     variant: "icon",
-    icon: s === "Previous" ? S.chevron.single.left : S.chevron.single.right
+    icon: s === "Previous" ? B.chevron.single.left : B.chevron.single.right
   }
-), K = ({ next: s, previous: t }) => r({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
-  M("[[monthName]] [[year]]"),
-  T({
+), Q = ({ next: s, previous: t }) => r({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
+  $("[[monthName]] [[year]]"),
+  M({
     label: "Previous",
     click: t
   }),
-  T({
+  M({
     label: "Next",
     click: s
   })
 ]);
-class Tt extends k {
+class Mt extends k {
   /**
    * This will declare the props for the compiler.
    *
@@ -180,8 +180,8 @@ class Tt extends k {
    * @returns {Data}
    */
   setData() {
-    const t = /* @__PURE__ */ new Date(), e = this.selectedWeek || this.calculateCurrentWeek(t), i = C(e, t.getFullYear());
-    return new A({
+    const t = /* @__PURE__ */ new Date(), e = this.selectedWeek || this.calculateCurrentWeek(t), i = T(e, t.getFullYear());
+    return new F({
       monthName: this.getMonthName(i.getMonth()),
       year: i.getFullYear(),
       month: i.getMonth(),
@@ -218,7 +218,7 @@ class Tt extends k {
    * @returns {string}
    */
   getMonthName(t) {
-    return F.monthNames[t];
+    return O.monthNames[t];
   }
   /**
    * Updates the calendar to show the previous month.
@@ -263,7 +263,7 @@ class Tt extends k {
    */
   selectWeek(t, e) {
     this.data.currentWeek = t;
-    const i = C(t, e);
+    const i = T(t, e);
     this.setDate(i.getMonth(), i.getFullYear(), i.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(t);
   }
   /**
@@ -273,24 +273,24 @@ class Tt extends k {
    */
   render() {
     return r({ class: "week-calendar-container border rounded-md p-3" }, [
-      K({
+      Q({
         next: () => this.goToNextMonth(),
         previous: () => this.goToPreviousMonth()
       }),
-      J({
+      K({
         selectWeek: (t, e) => this.selectWeek(t, e)
       })
     ]);
   }
 }
-const Q = (s, t) => t.includes(s), Z = (s, t, e) => s.exact ? e === t : Q(t, e), tt = ({ text: s, href: t, exact: e, hidden: i }) => new B({
+const D = /* @__PURE__ */ new Map(), Z = (s, t) => (D.has(s) || D.set(s, new RegExp(`${s}($|/|\\.).*`)), D.get(s).test(t)), tt = (s, t, e) => s.exact ? e === t : Z(t, e), et = ({ text: s, href: t, exact: e, hidden: i }) => new C({
   text: s,
   href: t,
   exact: e,
   dataSet: ["selected", ["state", !0, "active"]],
   class: `${i ? "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 Mt extends k {
+class $t extends k {
   /**
    * This will declare the props for the compiler.
    *
@@ -303,7 +303,7 @@ class Mt extends k {
    * This will configure the links.
    */
   beforeSetup() {
-    this.links = [];
+    this.links = [], this.activeLink = null;
   }
   /**
    * This will render the component.
@@ -341,24 +341,14 @@ class Mt extends k {
    * @returns {void}
    */
   updateLinks(t) {
-    let e = !1;
-    this.deactivateAllLinks();
-    for (const n of this.links) {
-      if (!n.rendered)
-        continue;
-      Z(n, n.getLinkPath(), t) ? (this.updateLink(n, !0), e = !0) : this.updateLink(n, !1);
-    }
-    const i = this?.links[0] ?? null;
-    !e && i && this.updateLink(i, !0);
-  }
-  /**
-   * This will deactivate all links.
-   *
-   * @returns {void}
-   */
-  deactivateAllLinks() {
-    for (const t of this.links)
-      this.updateLink(t, !1);
+    const e = this.links[0] ?? null;
+    let i = null;
+    for (const n of this.links)
+      if (n.rendered && tt(n, n.getLinkPath(), t)) {
+        i = n;
+        break;
+      }
+    i === null && e && (i = e), this.activeLink && this.activeLink !== i && this.updateLink(this.activeLink, !1), i && i !== this.activeLink && this.updateLink(i, !0), this.activeLink = i;
   }
   /**
    * This will update the link's active state.
@@ -377,7 +367,7 @@ class Mt extends k {
    * @returns {object}
    */
   addLink({ label: t, href: e, exact: i, hidden: n }) {
-    const a = tt({ text: t, href: e, exact: i, hidden: n });
+    const a = et({ text: t, href: e, exact: i, hidden: n });
     return this.links.push(a), a;
   }
   /**
@@ -386,10 +376,10 @@ class Mt extends k {
    * @returns {void}
    */
   beforeDestroy() {
-    this.links = [];
+    this.links = [], this.activeLink = null;
   }
 }
-class $t extends O {
+class Nt extends Y {
   /**
    * This will get the overlay type.
    *
@@ -408,7 +398,7 @@ class $t extends O {
     this.container = t, this.initialize();
   }
 }
-const et = (s) => w(
+const st = (s) => 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",
     dataStateSet: ["selected", ["state", s.value, "active"]]
@@ -420,10 +410,10 @@ const et = (s) => w(
       click: (t) => s.callBack(s.value)
     }, s.label)
   ]
-), st = (s, t) => et({ ...s, callBack: t }), it = (s) => f({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${s.class}` }, [
-  p({ class: "flex flex-auto flex-row", map: [s.options, (t) => st(t, s.callBack)] })
+), it = (s, t) => st({ ...s, callBack: t }), nt = (s) => f({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${s.class}` }, [
+  p({ class: "flex flex-auto flex-row", map: [s.options, (t) => it(t, s.callBack)] })
 ]);
-class Nt extends u {
+class jt extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -440,7 +430,7 @@ class Nt extends u {
   render() {
     const t = this.select.bind(this);
     return r({ class: "" }, [
-      it({
+      nt({
         class: this.class,
         options: this.options,
         callBack: t
@@ -512,7 +502,7 @@ class Nt extends u {
     };
   }
 }
-const nt = (s) => w(
+const at = (s) => 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",
     dataStateSet: ["selected", ["state", s.value, "active"]]
@@ -525,10 +515,10 @@ const nt = (s) => w(
       disabled: s.disabled
     }, s.label)
   ]
-), at = (s, t) => nt({ ...s, callBack: t }), ot = (s) => f({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${s.class}` }, [
-  p({ class: "flex flex-auto flex-row", map: [s.options, (t) => at(t, s.callBack)] })
+), ot = (s, t) => at({ ...s, callBack: t }), lt = (s) => f({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${s.class}` }, [
+  p({ class: "flex flex-auto flex-row", map: [s.options, (t) => ot(t, s.callBack)] })
 ]);
-class jt extends u {
+class zt extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -544,7 +534,7 @@ class jt extends u {
    */
   render() {
     const t = this.select.bind(this);
-    return ot({
+    return lt({
       class: this.class,
       options: this.options,
       callBack: t
@@ -571,17 +561,17 @@ class jt extends u {
     };
   }
 }
-const D = /* @__PURE__ */ new Map(), lt = (s, t) => (D.has(s) || D.set(s, new RegExp(`${s}($|/|\\.).*`)), D.get(s).test(t)), rt = (s, t) => {
+const L = /* @__PURE__ */ new Map(), rt = (s, t) => (L.has(s) || L.set(s, new RegExp(`${s}($|/|\\.).*`)), L.get(s).test(t)), ct = (s, t) => {
   const e = s.getLinkPath();
-  return s.exact ? t === e : lt(e, t);
-}, ct = ({ text: s, href: t, exact: e }) => new B({
+  return s.exact ? t === e : rt(e, t);
+}, ht = ({ text: s, href: t, exact: e }) => new C({
   text: s,
   href: t,
   exact: e,
   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 ht extends u {
+class ut extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -632,7 +622,7 @@ class ht extends u {
     const e = this.links[0];
     let i = null;
     for (const n of this.links)
-      if (n.rendered !== !1 && rt(n, t)) {
+      if (n.rendered !== !1 && ct(n, t)) {
         i = n;
         break;
       }
@@ -655,7 +645,7 @@ class ht extends u {
    * @returns {object}
    */
   addLink({ label: t, href: e, exact: i }) {
-    const n = ct({ text: t, href: e, exact: i });
+    const n = ht({ text: t, href: e, exact: i });
     return this.links.push(n), n;
   }
   /**
@@ -667,7 +657,7 @@ class ht extends u {
     this.links = [], this.activeLink = null;
   }
 }
-class zt extends u {
+class It extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -683,7 +673,7 @@ class zt extends u {
    */
   render() {
     return r({ class: "tab-panel" }, [
-      new ht({
+      new ut({
         class: this.class,
         options: this.options
       }),
@@ -726,10 +716,10 @@ const dt = (s) => w(
       click: (t) => s.callBack(s.value)
     }, s.label)
   ]
-), ut = (s, t) => (s.callBack = t, dt(s)), ft = (s) => f({ class: `border-b border-border ${s.class}` }, [
-  p({ class: "flex flex-row items-center", map: [s.options, (t) => ut(t, s.callBack)] })
+), ft = (s, t) => (s.callBack = t, dt(s)), pt = (s) => f({ class: `border-b border-border ${s.class}` }, [
+  p({ class: "flex flex-row items-center", map: [s.options, (t) => ft(t, s.callBack)] })
 ]);
-class It extends u {
+class Ut extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -746,7 +736,7 @@ class It extends u {
   render() {
     const t = this.select.bind(this);
     return r({ class: "underlined-button-tab-panel flex flex-auto flex-col" }, [
-      ft({
+      pt({
         class: this.class,
         options: this.options,
         callBack: t
@@ -809,7 +799,7 @@ class It extends u {
     };
   }
 }
-const pt = (s) => w(
+const gt = (s) => w(
   {
     class: "relative inline-flex items-center justify-center whitespace-nowrap text-sm font-medium text-muted-foreground transition-colors hover:text-foreground 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]:text-foreground after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-primary after:transition-all after:duration-200 after:scale-x-0 data-[state=active]:after:scale-x-100",
     dataStateSet: ["selected", ["state", s.value, "active"]]
@@ -822,10 +812,10 @@ const pt = (s) => w(
       disabled: s.disabled
     }, s.label)
   ]
-), gt = (s, t) => pt({ ...s, callBack: t }), mt = (s) => f({ class: `border-b border-border ${s.class}` }, [
-  p({ class: "flex flex-row items-center", map: [s.options, (t) => gt(t, s.callBack)] })
+), mt = (s, t) => gt({ ...s, callBack: t }), vt = (s) => f({ class: `border-b border-border ${s.class}` }, [
+  p({ class: "flex flex-row items-center", map: [s.options, (t) => mt(t, s.callBack)] })
 ]);
-class Ut extends u {
+class Rt extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -841,7 +831,7 @@ class Ut extends u {
    */
   render() {
     const t = this.select.bind(this);
-    return mt({
+    return vt({
       class: this.class,
       options: this.options,
       callBack: t
@@ -868,17 +858,17 @@ class Ut extends u {
     };
   }
 }
-const L = /* @__PURE__ */ new Map(), vt = (s, t) => (L.has(s) || L.set(s, new RegExp(`${s}($|/|\\.).*`)), L.get(s).test(t)), bt = (s, t) => {
+const S = /* @__PURE__ */ new Map(), bt = (s, t) => (S.has(s) || S.set(s, new RegExp(`${s}($|/|\\.).*`)), S.get(s).test(t)), kt = (s, t) => {
   const e = s.getLinkPath();
-  return s.exact ? t === e : vt(e, t);
-}, kt = ({ text: s, href: t, exact: e }) => new B({
+  return s.exact ? t === e : bt(e, t);
+}, xt = ({ text: s, href: t, exact: e }) => new C({
   text: s,
   href: t,
   exact: e,
   dataSet: ["selected", ["state", !0, "active"]],
   class: "relative inline-flex items-center justify-center whitespace-nowrap px-4 py-3 text-sm font-medium text-muted-foreground transition-colors hover:text-foreground 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]:text-foreground after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-primary after:transition-all after:duration-200 after:scale-x-0 data-[state=active]:after:scale-x-100"
 });
-class xt extends u {
+class yt extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -930,7 +920,7 @@ class xt extends u {
     const e = this.links[0];
     let i = null;
     for (const n of this.links)
-      if (n.rendered !== !1 && bt(n, t)) {
+      if (n.rendered !== !1 && kt(n, t)) {
         i = n;
         break;
       }
@@ -944,7 +934,12 @@ class xt extends u {
    * @returns {void}
    */
   updateLink(t, e) {
-    t.update(e), e && this.scrollable && t.panel && t.panel.scrollIntoView({ behavior: "smooth", inline: "nearest", block: "nearest" });
+    if (t.update(e), e && this.scrollable && t.panel) {
+      const i = t.panel, n = i.closest("nav");
+      if (!n) return;
+      const a = i.getBoundingClientRect(), o = n.getBoundingClientRect();
+      a.left >= o.left && a.right <= o.right || i.scrollIntoView({ behavior: "smooth", inline: "nearest", block: "nearest" });
+    }
   }
   /**
    * This will add a link.
@@ -953,7 +948,7 @@ class xt extends u {
    * @returns {object}
    */
   addLink({ label: t, href: e, exact: i }) {
-    const n = kt({ text: t, href: e, exact: i });
+    const n = xt({ text: t, href: e, exact: i });
     return this.links.push(n), n;
   }
   /**
@@ -965,7 +960,7 @@ class xt extends u {
     this.links = [], this.activeLink = null;
   }
 }
-class At extends u {
+class Ft extends d {
   /**
    * This will declare the props for the compiler.
    *
@@ -981,7 +976,7 @@ class At extends u {
    */
   render() {
     return r({ class: "underlined-tab-panel flex flex-auto flex-col" }, [
-      new xt({
+      new yt({
         class: this.class,
         options: this.options,
         scrollable: this.scrollable
@@ -1013,7 +1008,7 @@ class At extends u {
     return e;
   }
 }
-class yt extends k {
+class wt extends k {
   /**
    * Runs before rendering, sets up defaults, a timer for drawing,
    * and basic canvas properties.
@@ -1023,7 +1018,7 @@ class yt extends k {
   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 R(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 V(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.
@@ -1031,7 +1026,7 @@ class yt extends k {
    * @returns {object} Layout definition for the canvas.
    */
   render() {
-    return U({
+    return R({
       style: "touch-action: none; -webkit-user-select: none; -webkit-touch-callout: none;"
     });
   }
@@ -1080,12 +1075,12 @@ class yt extends k {
     let e, i;
     const n = this.canvas, a = n.width / parseInt(n.style.width), o = n.getBoundingClientRect();
     if (t.touches && t.touches.length) {
-      const d = t.touches[0];
-      e = d.clientX, i = d.clientY;
+      const u = t.touches[0];
+      e = u.clientX, i = u.clientY;
     } else
       e = t.x || t.clientX, i = t.y || t.clientY;
-    const h = parseInt((e - o.left) * a), l = parseInt((i - o.top) * a);
-    this.mouse.x = h, this.mouse.y = l;
+    const c = parseInt((e - o.left) * a), l = parseInt((i - o.top) * a);
+    this.mouse.x = c, this.mouse.y = l;
   }
   /**
    * Called when the pointer goes down on the canvas.
@@ -1160,12 +1155,12 @@ class yt extends k {
    */
   scale() {
     const t = this.canvas, e = this.container, i = W.getSize(e), n = this.targetSize, a = n.width, o = n.height;
-    let h = a + "px", l = o + "px";
+    let c = a + "px", l = o + "px";
     if (this.width = t.width = a, this.height = t.height = o, i.width !== 0 && i.height !== 0) {
-      const d = i.width, g = i.height, c = d / a, m = g / o, x = Math.min(c, m);
-      h = a * x + "px", l = o * x + "px";
+      const u = i.width, g = i.height, h = u / a, m = g / o, x = Math.min(h, m);
+      c = a * x + "px", l = o * x + "px";
     }
-    t.style.width = h, t.style.height = l;
+    t.style.width = c, t.style.height = l;
   }
   /**
    * Main drawing loop. If the mouse is down, adds a line
@@ -1239,7 +1234,7 @@ class yt extends k {
     this.timer.stop(), this.status = "stopped";
   }
 }
-class Ft extends k {
+class Ot extends k {
   /**
    * Sets up default properties for the signature panel.
    *
@@ -1256,19 +1251,19 @@ class Ft extends k {
    */
   render() {
     return r({ class: "signature-panel relative flex flex-auto overflow-hidden select-none" }, [
-      Y({
+      A({
         cache: "hiddenInput",
         required: !0,
         bind: this.path + ".data"
       }),
       r({ class: "absolute top-2 right-2" }, [
-        $({
+        N({
           variant: "icon",
-          icon: S.circleX,
+          icon: B.circleX,
           click: this.reset.bind(this)
         })
       ]),
-      new yt({
+      new wt({
         cache: "canvasLayer",
         margin: this.margin,
         targetSize: this.targetSize,
@@ -1326,26 +1321,26 @@ class Ft extends k {
   }
 }
 export {
-  Nt as B,
-  $t as I,
-  Mt as N,
+  jt as B,
+  Nt as I,
+  $t as N,
   Pt as P,
-  Ft as S,
-  zt as T,
-  It as U,
-  Tt as W,
-  jt as a,
-  ht as b,
-  At as c,
-  Ut as d,
-  xt as e,
-  H as f,
-  J as g,
-  K as h,
+  Ot as S,
+  It as T,
+  Ut as U,
+  Mt as W,
+  zt as a,
+  ut as b,
+  Ft as c,
+  Rt as d,
+  yt as e,
+  _ as f,
+  K as g,
+  Q as h,
   G as i,
   Wt as j,
-  C as k,
-  Ct as l,
-  X as m,
-  V as n
+  T as k,
+  Tt as l,
+  q as m,
+  X as n
 };

package/dist/types/components/organisms/navigation/navigation-menu/navigation-menu.d.ts

@@ -22,6 +22,7 @@ export class NavigationMenu extends Component {
      * @type {array} links - This will hold the links for the navigation.
      */
     links: any[];
+    activeLink: any;
     /**
      * This will render the component.
      *
@@ -35,12 +36,6 @@ export class NavigationMenu extends Component {
      * @returns {void}
      */
     updateLinks(path: string): void;
-    /**
-     * This will deactivate all links.
-     *
-     * @returns {void}
-     */
-    deactivateAllLinks(): void;
     /**
      * This will update the link's active state.
      *