@mx-cartographer/experiences 7.2.19 → 7.2.21

package/dist/debts/index.es.js

@@ -1,22 +1,22 @@
-import { jsx as e, jsxs as s, Fragment as $ } from "react/jsx-runtime";
+import { jsx as e, jsxs as s, Fragment as H } from "react/jsx-runtime";
 import g from "react";
 import { observer as D } from "mobx-react-lite";
 import w from "@mui/material/Stack";
-import { useTheme as X, Card as _e, Stack as y, Box as W } from "@mui/material";
+import { useTheme as X, Card as _e, Stack as _, Box as W } from "@mui/material";
 import { Text as l, H3 as De, InstitutionLogo as Te, Icon as te } from "@mxenabled/mxui";
 import { intervalToDuration as Ae, formatDuration as Ee } from "date-fns";
 import { addMonths as se } from "date-fns/addMonths";
 import { fromUnixTime as ce } from "date-fns/fromUnixTime";
 import { getUnixTime as de } from "date-fns/getUnixTime";
-import { D as I, M as Ie, I as Be } from "../DebtsStore-BD_XwsI7.mjs";
+import { D as P, M as Ie, I as Be } from "../DebtsStore-BD_XwsI7.mjs";
 import { a as Lr } from "../DebtsStore-BD_XwsI7.mjs";
-import { f as B, a as Me } from "../NumberFormatting-Buh7u8Oi.mjs";
+import { f as k, a as Me } from "../NumberFormatting-Buh7u8Oi.mjs";
 import { f as U, D as q } from "../Dialog-CWW597AF.mjs";
-import { G as Pe, y as Z, u as C, l as V, g as k, d as J, n as ke, b as Ne } from "../hooks-D6XlXHf4.mjs";
+import { G as Pe, y as Z, u as S, l as V, g as F, d as J, n as ke, b as Ne } from "../hooks-D6XlXHf4.mjs";
 import { u as Y } from "../useScreenSize-B6JyS_Lj.mjs";
 import { D as re } from "../Drawer-kEE73B87.mjs";
-import { b as A } from "../Localization-2MODESHW.mjs";
-import { A as Fe, u as Re } from "../AccountDetailsHeader-Df1JkzYi.mjs";
+import { b as I } from "../Localization-2MODESHW.mjs";
+import { A as Fe, u as Re } from "../AccountDetailsHeader-vPzGb1RZ.mjs";
 import Le from "@mui/material/Card";
 import $e from "@mui/material/CardContent";
 import He from "@mui/material/CardHeader";
@@ -54,18 +54,18 @@ const tt = (a, n = 0, r = 0) => {
 }, rt = (a, n, r, t, o) => {
   const i = [];
   if (r === 0) {
-    for (let d = 0; d < a; d++) {
-      const c = n - t * (d + 1), m = n - t * d, _ = c >= 0 ? t : m;
+    for (let c = 0; c < a; c++) {
+      const d = n - t * (c + 1), m = n - t * c, u = d >= 0 ? t : m;
       i.push({
-        balance: c >= 0 ? c : 0,
+        balance: d >= 0 ? d : 0,
         interest: r,
-        payment: _,
-        principal: _,
+        payment: u,
+        principal: u,
         timestamp: de(
           se(
             ce(o),
             // convert seconds → Date
-            d + 1
+            c + 1
             // add (index + 1) months
           )
         )
@@ -74,14 +74,14 @@ const tt = (a, n = 0, r = 0) => {
     return i;
   }
   const p = r / 1200;
-  for (let d = 0; d < a; d++) {
-    const c = de(se(ce(o), d + 1)), m = Math.pow(1 + p, d), _ = n * m - t * ((m - 1) / p), f = Math.pow(1 + p, d + 1), h = n * f - t * ((f - 1) / p), v = t + Math.min(h, 0), M = _ * p;
+  for (let c = 0; c < a; c++) {
+    const d = de(se(ce(o), c + 1)), m = Math.pow(1 + p, c), u = n * m - t * ((m - 1) / p), x = Math.pow(1 + p, c + 1), h = n * x - t * ((x - 1) / p), v = t + Math.min(h, 0), B = u * p;
     i.push({
       balance: Math.max(0, h),
-      interest: M,
+      interest: B,
       payment: v,
-      principal: v - M,
-      timestamp: c
+      principal: v - B,
+      timestamp: d
     });
   }
   return i;
@@ -92,10 +92,10 @@ const tt = (a, n = 0, r = 0) => {
     r ?? 0,
     n ?? 0,
     o
-  ), d = at(p);
+  ), c = at(p);
   return {
     ...a,
-    minimumFinalPayment: d,
+    minimumFinalPayment: c,
     minimumPayments: p
   };
 }, ge = (a, n) => {
@@ -104,16 +104,16 @@ const tt = (a, n = 0, r = 0) => {
     [[], []]
   );
   switch (n) {
-    case I.FASTEST_PAYOFF_FIRST:
+    case P.FASTEST_PAYOFF_FIRST:
       r.sort((o, i) => (o.minimumFinalPayment ?? 0) - (i.minimumFinalPayment ?? 0));
       break;
-    case I.HIGHEST_INTEREST:
+    case P.HIGHEST_INTEREST:
       r.sort((o, i) => (i.interest_rate ?? 0) - (o.interest_rate ?? 0));
       break;
-    case I.LOWEST_BALANCE:
+    case P.LOWEST_BALANCE:
       r.sort((o, i) => o.balance - i.balance);
       break;
-    case I.HIGHEST_BALANCE:
+    case P.HIGHEST_BALANCE:
       r.sort((o, i) => i.balance - o.balance);
       break;
     default:
@@ -122,44 +122,44 @@ const tt = (a, n = 0, r = 0) => {
   a.splice(0, a.length, ...r, ...t);
 };
 function ot(a, n, r = 0) {
-  const t = a.map((_) => ({ ..._ })).filter(
-    (_) => _.interest_rate !== void 0 && _.monthly_payment !== void 0 && !_.is_paid_off
+  const t = a.map((u) => ({ ...u })).filter(
+    (u) => u.interest_rate !== void 0 && u.monthly_payment !== void 0 && !u.is_paid_off
   );
   ge(t, n);
   let o = 0, i = 0;
-  const p = /* @__PURE__ */ new Date(), d = /* @__PURE__ */ new Date();
-  for (; t.some((_) => _.balance >= 0.01 && !_.is_impossible); ) {
-    let _ = !1;
-    for (const [f, h] of t.entries()) {
+  const p = /* @__PURE__ */ new Date(), c = /* @__PURE__ */ new Date();
+  for (; t.some((u) => u.balance >= 0.01 && !u.is_impossible); ) {
+    let u = !1;
+    for (const [x, h] of t.entries()) {
       if (h.balance <= 0.01 || h.is_impossible) continue;
-      const M = (h.interest_rate ?? 0) / 100 / 12, P = h.balance * M;
-      let u = h.monthly_payment ?? 0;
-      f === 0 && r && (u += r), h.balance += P;
-      const S = Math.min(h.balance, u + i);
-      if (S <= P) {
+      const B = (h.interest_rate ?? 0) / 100 / 12, N = h.balance * B;
+      let C = h.monthly_payment ?? 0;
+      x === 0 && r && (C += r), h.balance += N;
+      const A = Math.min(h.balance, C + i);
+      if (A <= N) {
         h.is_impossible = !0;
         continue;
       }
-      h.balance -= S, h.balance = h.balance < 0.01 ? 0 : h.balance, o += P, h.balance <= 0 && (i += u), S > 0 && (_ = !0);
+      h.balance -= A, h.balance = h.balance < 0.01 ? 0 : h.balance, o += N, h.balance <= 0 && (i += C), A > 0 && (u = !0);
     }
-    _ && d.setMonth(d.getMonth() + 1);
+    u && c.setMonth(c.getMonth() + 1);
   }
-  const c = t.some((_) => _.is_impossible && _.balance > 0), m = Ae({ start: p, end: d });
+  const d = t.some((u) => u.is_impossible && u.balance > 0), m = Ae({ start: p, end: c });
   return {
-    payoffSavings: c ? "N/A" : B(o, "0,0.00"),
-    payoffDate: c ? "Never" : U(d, q.MONTH_YEAR),
-    payoffDuration: c ? "Stagnant" : Ee(m, { format: ["years", "months"] }) || "0 months"
+    payoffSavings: d ? "N/A" : k(o, "0,0.00"),
+    payoffDate: d ? "Never" : U(c, q.MONTH_YEAR),
+    payoffDuration: d ? "Stagnant" : Ee(m, { format: ["years", "months"] }) || "0 months"
   };
 }
-const F = () => {
+const L = () => {
   if (!g.useContext(Pe))
     throw new Error("useCateUiStore() must be used within the GlobalDataContext");
   return Z().uiStore;
 }, it = ({ debts: a, onClickCta: n, sx: r }) => {
-  const t = X(), { isMobile: o } = Y(), { debts: i } = C(), { selectedDebtPriority: p } = F(), { monthlyCashFlowProfile: d } = V(), { payoffDate: c, payoffSavings: m, payoffDuration: _ } = g.useMemo(() => {
-    const f = d?.extra_payment ?? 0;
-    return ot(a, p, f);
-  }, [a, p, d]);
+  const t = X(), { isMobile: o } = Y(), { debts: i } = S(), { selectedDebtPriority: p } = L(), { monthlyCashFlowProfile: c } = V(), { payoffDate: d, payoffSavings: m, payoffDuration: u } = g.useMemo(() => {
+    const x = c?.extra_payment ?? 0;
+    return ot(a, p, x);
+  }, [a, p, c]);
   return /* @__PURE__ */ e(
     _e,
     {
@@ -169,9 +169,9 @@ const F = () => {
         minWidth: "186px",
         ...r
       },
-      children: /* @__PURE__ */ s(y, { sx: { gap: "12px", p: "16px" }, children: [
+      children: /* @__PURE__ */ s(_, { sx: { gap: "12px", p: "16px" }, children: [
         /* @__PURE__ */ s(
-          y,
+          _,
           {
             gap: o ? "4px" : "0",
             sx: {
@@ -181,16 +181,16 @@ const F = () => {
             },
             children: [
               /* @__PURE__ */ e(l, { variant: "XSmall", children: i.snowball_card_date_description }),
-              /* @__PURE__ */ e(l, { bold: !0, color: t.palette.primary.main, variant: "Small", children: c })
+              /* @__PURE__ */ e(l, { bold: !0, color: t.palette.primary.main, variant: "Small", children: d })
             ]
           }
         ),
-        /* @__PURE__ */ s(y, { gap: o ? "4px" : "0", children: [
+        /* @__PURE__ */ s(_, { gap: o ? "4px" : "0", children: [
           /* @__PURE__ */ e(l, { bold: !0, variant: "Small", children: m }),
           /* @__PURE__ */ e(l, { sx: { whiteSpace: "normal" }, variant: "XSmall", children: i.snowball_card_amount_description })
         ] }),
-        /* @__PURE__ */ s(y, { gap: o ? "4px" : "0", children: [
-          /* @__PURE__ */ e(l, { bold: !0, variant: "Small", children: _ }),
+        /* @__PURE__ */ s(_, { gap: o ? "4px" : "0", children: [
+          /* @__PURE__ */ e(l, { bold: !0, variant: "Small", children: u }),
           /* @__PURE__ */ e(l, { variant: "XSmall", children: i.snowball_card_duration_description })
         ] }),
         /* @__PURE__ */ e(
@@ -208,7 +208,7 @@ const F = () => {
     }
   );
 }, lt = D(it), st = ({ isOpen: a, onClose: n }) => {
-  const r = X(), { debts: t } = C(), [o, i] = g.useState(!1);
+  const r = X(), { debts: t } = S(), [o, i] = g.useState(!1);
   return /* @__PURE__ */ e(
     re,
     {
@@ -216,9 +216,9 @@ const F = () => {
       isOpen: a,
       onClose: n,
       title: t.snowball_drawer_title,
-      children: /* @__PURE__ */ s(y, { bgcolor: r.palette.background.default, height: "100%", children: [
-        /* @__PURE__ */ s(y, { alignItems: "center", px: 24, py: 24, children: [
-          /* @__PURE__ */ s(y, { alignItems: "center", pb: 24, children: [
+      children: /* @__PURE__ */ s(_, { bgcolor: r.palette.background.default, height: "100%", children: [
+        /* @__PURE__ */ s(_, { alignItems: "center", px: 24, py: 24, children: [
+          /* @__PURE__ */ s(_, { alignItems: "center", pb: 24, children: [
             /* @__PURE__ */ e(l, { mb: 12, variant: "H3", children: t.snowball_drawer_subtitle }),
             /* @__PURE__ */ e(l, { color: r.palette.secondary.main, variant: "Small", children: t.snowball_drawer_amount_description }),
             /* @__PURE__ */ e(l, { variant: "H1", children: t.snowball_drawer_savings }),
@@ -249,7 +249,7 @@ const F = () => {
             )
           ] })
         ] }),
-        /* @__PURE__ */ s(y, { children: [
+        /* @__PURE__ */ s(_, { children: [
           /* @__PURE__ */ e(
             l,
             {
@@ -260,12 +260,12 @@ const F = () => {
               children: t.snowball_drawer_disclaimer
             }
           ),
-          /* @__PURE__ */ s(y, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
-            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: A(t.snowball_drawer_month_header, 1) }),
+          /* @__PURE__ */ s(_, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: I(t.snowball_drawer_month_header, 1) }),
             /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ s(y, { bgcolor: r.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ s(_, { bgcolor: r.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -283,7 +283,7 @@ const F = () => {
                 }
               ),
               /* @__PURE__ */ s(
-                y,
+                _,
                 {
                   sx: {
                     borderBottom: `1px solid ${r.palette.border.light}`,
@@ -293,18 +293,18 @@ const F = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ s(y, { flexGrow: 1, children: [
-                      /* @__PURE__ */ e(l, { variant: "Body", children: A(t.snowball_drawer_debt_label, "A") }),
+                    /* @__PURE__ */ s(_, { flexGrow: 1, children: [
+                      /* @__PURE__ */ e(l, { variant: "Body", children: I(t.snowball_drawer_debt_label, "A") }),
                       /* @__PURE__ */ s(l, { color: r.palette.secondary.main, variant: "XSmall", children: [
-                        A(
+                        I(
                           t.snowball_drawer_rollover_explainer_pt1,
                           "$100"
                         ),
-                        /* @__PURE__ */ e("strong", { children: A(t.snowball_drawer_debt_label, "B") }),
+                        /* @__PURE__ */ e("strong", { children: I(t.snowball_drawer_debt_label, "B") }),
                         t.snowball_drawer_rollover_explainer_pt2
                       ] })
                     ] }),
-                    /* @__PURE__ */ s(y, { children: [
+                    /* @__PURE__ */ s(_, { children: [
                       /* @__PURE__ */ e(l, { variant: "Body", children: "$100.00" }),
                       /* @__PURE__ */ e(
                         l,
@@ -321,7 +321,7 @@ const F = () => {
                 }
               )
             ] }),
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -335,7 +335,7 @@ const F = () => {
                 }
               ),
               /* @__PURE__ */ s(
-                y,
+                _,
                 {
                   sx: {
                     borderBottom: `1px solid ${r.palette.border.light}`,
@@ -345,13 +345,13 @@ const F = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: A(t.snowball_drawer_debt_label, "B") }),
+                    /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: I(t.snowball_drawer_debt_label, "B") }),
                     /* @__PURE__ */ e(l, { variant: "Body", children: "$400.00" })
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, py: 14, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, py: 14, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -364,13 +364,13 @@ const F = () => {
                   }
                 }
               ),
-              /* @__PURE__ */ s(y, { flexDirection: "row", flexGrow: 1, pr: 24, children: [
-                /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: A(t.snowball_drawer_debt_label, "C") }),
+              /* @__PURE__ */ s(_, { flexDirection: "row", flexGrow: 1, pr: 24, children: [
+                /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: I(t.snowball_drawer_debt_label, "C") }),
                 /* @__PURE__ */ e(l, { variant: "Body", children: "$1,000.00" })
               ] })
             ] }),
             /* @__PURE__ */ s(
-              y,
+              _,
               {
                 sx: {
                   py: 8,
@@ -387,12 +387,12 @@ const F = () => {
               }
             )
           ] }),
-          /* @__PURE__ */ s(y, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
-            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: A(t.snowball_drawer_month_header, 2) }),
+          /* @__PURE__ */ s(_, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: I(t.snowball_drawer_month_header, 2) }),
             /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ s(y, { bgcolor: r.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ s(_, { bgcolor: r.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -410,7 +410,7 @@ const F = () => {
                 }
               ),
               /* @__PURE__ */ s(
-                y,
+                _,
                 {
                   sx: {
                     borderBottom: `1px solid ${r.palette.border.light}`,
@@ -420,18 +420,18 @@ const F = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ s(y, { flexGrow: 1, children: [
-                      /* @__PURE__ */ e(l, { variant: "Body", children: A(t.snowball_drawer_debt_label, "B") }),
+                    /* @__PURE__ */ s(_, { flexGrow: 1, children: [
+                      /* @__PURE__ */ e(l, { variant: "Body", children: I(t.snowball_drawer_debt_label, "B") }),
                       /* @__PURE__ */ s(l, { color: r.palette.secondary.main, variant: "XSmall", children: [
-                        A(
+                        I(
                           t.snowball_drawer_rollover_explainer_pt1,
                           "$500"
                         ),
-                        /* @__PURE__ */ e("strong", { children: A(t.snowball_drawer_debt_label, "C") }),
+                        /* @__PURE__ */ e("strong", { children: I(t.snowball_drawer_debt_label, "C") }),
                         t.snowball_drawer_rollover_explainer_pt2
                       ] })
                     ] }),
-                    /* @__PURE__ */ s(y, { children: [
+                    /* @__PURE__ */ s(_, { children: [
                       /* @__PURE__ */ e(l, { variant: "Body", children: "$500.00" }),
                       /* @__PURE__ */ e(
                         l,
@@ -448,7 +448,7 @@ const F = () => {
                 }
               )
             ] }),
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -462,7 +462,7 @@ const F = () => {
                 }
               ),
               /* @__PURE__ */ s(
-                y,
+                _,
                 {
                   sx: {
                     flexDirection: "row",
@@ -471,14 +471,14 @@ const F = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: A(t.snowball_drawer_debt_label, "C") }),
+                    /* @__PURE__ */ e(l, { flexGrow: 1, variant: "Body", children: I(t.snowball_drawer_debt_label, "C") }),
                     /* @__PURE__ */ e(l, { variant: "Body", children: "$1,000.00" })
                   ]
                 }
               )
             ] }),
             /* @__PURE__ */ s(
-              y,
+              _,
               {
                 sx: {
                   py: 8,
@@ -495,12 +495,12 @@ const F = () => {
               }
             )
           ] }),
-          /* @__PURE__ */ s(y, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
-            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: A(t.snowball_drawer_month_header, 3) }),
+          /* @__PURE__ */ s(_, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+            /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: I(t.snowball_drawer_month_header, 3) }),
             /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ s(y, { bgcolor: r.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ s(y, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ s(_, { bgcolor: r.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ s(_, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -518,7 +518,7 @@ const F = () => {
                 }
               ),
               /* @__PURE__ */ s(
-                y,
+                _,
                 {
                   sx: {
                     alignItems: "center",
@@ -528,8 +528,8 @@ const F = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ e(y, { flexGrow: 1, children: /* @__PURE__ */ e(l, { variant: "Body", children: A(t.snowball_drawer_debt_label, "C") }) }),
-                    /* @__PURE__ */ s(y, { children: [
+                    /* @__PURE__ */ e(_, { flexGrow: 1, children: /* @__PURE__ */ e(l, { variant: "Body", children: I(t.snowball_drawer_debt_label, "C") }) }),
+                    /* @__PURE__ */ s(_, { children: [
                       /* @__PURE__ */ e(l, { variant: "Body", children: "$1,500.00" }),
                       /* @__PURE__ */ e(
                         l,
@@ -547,7 +547,7 @@ const F = () => {
               )
             ] }),
             /* @__PURE__ */ s(
-              y,
+              _,
               {
                 sx: {
                   py: 8,
@@ -586,32 +586,32 @@ const we = ({
   onClickArea: i,
   onHoverArea: p
 }) => {
-  const d = We(), { onEvent: c } = k(), m = t.filter((b) => !b.is_impossible), _ = [
+  const c = We(), { onEvent: d } = F(), m = t.filter((b) => !b.is_impossible), u = [
     ...new Set(
-      m.flatMap((b) => b.dataset.map((x) => new Date(x.x).getTime()))
+      m.flatMap((b) => b.dataset.map((f) => new Date(f.x).getTime()))
     )
-  ].sort((b, x) => b - x).map((b) => new Date(b)), f = m.map((b) => {
-    const x = new Map(b.dataset.map((N) => [new Date(N.x).getTime(), N.y]));
-    let E = x.get(_[0].getTime()) ?? 0;
-    const L = _.map((N) => {
-      const z = x.get(N.getTime()) ?? E;
-      return E = z, { x: N, y: z };
+  ].sort((b, f) => b - f).map((b) => new Date(b)), x = m.map((b) => {
+    const f = new Map(b.dataset.map((R) => [new Date(R.x).getTime(), R.y]));
+    let E = f.get(u[0].getTime()) ?? 0;
+    const $ = u.map((R) => {
+      const z = f.get(R.getTime()) ?? E;
+      return E = z, { x: R, y: z };
     });
-    return { ...b, dataset: L };
-  }), h = f.reduce(
-    (b, x) => b + (x.dataset[0]?.y ?? 0),
+    return { ...b, dataset: $ };
+  }), h = x.reduce(
+    (b, f) => b + (f.dataset[0]?.y ?? 0),
     0
-  ), v = _.map((b, x) => {
-    const E = x / (_.length - 1), L = h * (1 - E);
-    return { x: b, y: L };
-  }), M = Math.ceil(h / 100) * 100, P = _, u = f.map((b, x) => {
-    const E = 1 - x / f.length * 0.5, L = pt(dt, E);
+  ), v = u.map((b, f) => {
+    const E = f / (u.length - 1), $ = h * (1 - E);
+    return { x: b, y: $ };
+  }), B = Math.ceil(h / 100) * 100, N = u, C = x.map((b, f) => {
+    const E = 1 - f / x.length * 0.5, $ = pt(dt, E);
     return {
-      id: `debt-${x}`,
+      id: `debt-${f}`,
       guid: b.guid,
       label: b.name,
-      data: b.dataset.map((N) => N.y),
-      color: L,
+      data: b.dataset.map((R) => R.y),
+      color: $,
       curve: "linear",
       type: "line",
       area: !0,
@@ -619,18 +619,18 @@ const we = ({
       showMark: !1
     };
   });
-  u.push({
+  C.push({
     id: "payoff-line",
     label: "Payoff Line",
     data: v.map((b) => b.y),
-    color: d.palette.grey[700],
+    color: c.palette.grey[700],
     curve: "linear",
     type: "line",
     stack: void 0,
     showMark: !1,
     disableHighlight: !0
   });
-  const S = (b) => u.findIndex((x) => x?.guid === b);
+  const A = (b) => C.findIndex((f) => f?.guid === b);
   return /* @__PURE__ */ e(
     ae,
     {
@@ -652,16 +652,16 @@ const we = ({
           axisHighlight: { x: "none" },
           disableLineItemHighlight: !0,
           height: n,
-          onAreaClick: (b, x) => {
+          onAreaClick: (b, f) => {
             i?.();
-            const E = u.find((L) => L.id === x.seriesId);
-            c(T.DEBTS_CLICK_CHART_AREA, { account_guid: E?.guid });
+            const E = C.find(($) => $.id === f.seriesId);
+            d(T.DEBTS_CLICK_CHART_AREA, { account_guid: E?.guid });
           },
           onHighlightChange: (b) => {
-            const x = u.find((E) => E.id === b?.seriesId)?.guid;
-            p?.(x ?? "");
+            const f = C.find((E) => E.id === b?.seriesId)?.guid;
+            p?.(f ?? "");
           },
-          series: u,
+          series: C,
           skipAnimation: !0,
           slotProps: {
             legend: {
@@ -685,14 +685,14 @@ const we = ({
               strokeDasharray: "10 5",
               strokeWidth: 1
             },
-            [`& .MuiLineElement-series-debt-${S(o ?? "0")}`]: {
+            [`& .MuiLineElement-series-debt-${A(o ?? "0")}`]: {
               opacity: 1
             },
-            [`& .MuiAreaElement-series-debt-${S(o ?? "0")}`]: {
+            [`& .MuiAreaElement-series-debt-${A(o ?? "0")}`]: {
               opacity: 1
             },
             "& .MuiChartsAxis-tickLabel > tspan": {
-              fontFamily: d.typography.Small.fontFamily
+              fontFamily: c.typography.Small.fontFamily
             },
             ...a
           },
@@ -700,9 +700,9 @@ const we = ({
           width: r,
           xAxis: [
             {
-              data: P,
+              data: N,
               scaleType: "time",
-              min: _[0],
+              min: u[0],
               disableTicks: !0,
               valueFormatter: (b) => U(b, q.MONTH_SHORT_YEAR)
             }
@@ -710,9 +710,9 @@ const we = ({
           yAxis: [
             {
               min: 0,
-              max: M,
+              max: B,
               disableTicks: !0,
-              valueFormatter: (b) => B(b, "0a")
+              valueFormatter: (b) => k(b, "0a")
             }
           ]
         }
@@ -720,8 +720,8 @@ const we = ({
     }
   );
 }, mt = () => {
-  const a = X(), { debts: n } = C(), { selectedDebtChartData: r } = F();
-  return /* @__PURE__ */ s($, { children: [
+  const a = X(), { debts: n } = S(), { selectedDebtChartData: r } = L();
+  return /* @__PURE__ */ s(H, { children: [
     /* @__PURE__ */ s(
       Le,
       {
@@ -747,7 +747,7 @@ const we = ({
     )
   ] });
 }, ht = D(mt), ut = () => {
-  const a = X(), { onEvent: n } = k(), { debts: r } = C(), { selectedDebtChartData: t, showCompleted: o, showError: i } = F();
+  const a = X(), { onEvent: n } = F(), { debts: r } = S(), { selectedDebtChartData: t, showCompleted: o, showError: i } = L();
   return g.useEffect(() => n(T.DEBT_SCHEDULE_VIEW), []), /* @__PURE__ */ e(ye, { children: i || o ? /* @__PURE__ */ e(
     l,
     {
@@ -757,12 +757,12 @@ const we = ({
       variant: "Small",
       children: i ? r.schedule_error_message : r.schedule_complete_message
     }
-  ) : /* @__PURE__ */ s($, { children: [
+  ) : /* @__PURE__ */ s(H, { children: [
     /* @__PURE__ */ s(w, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
       /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: r.schedule_month_heading }),
       /* @__PURE__ */ e(l, { bold: !0, variant: "XSmall", children: r.schedule_amount_heading })
     ] }),
-    t.dataset.slice(1).map(({ x: p, y: d, payment: c }) => /* @__PURE__ */ e(w, { bgcolor: a.palette.background.paper, children: /* @__PURE__ */ e(w, { alignItems: "center", flexDirection: "row", pl: 24, children: /* @__PURE__ */ s(
+    t.dataset.slice(1).map(({ x: p, y: c, payment: d }) => /* @__PURE__ */ e(w, { bgcolor: a.palette.background.paper, children: /* @__PURE__ */ e(w, { alignItems: "center", flexDirection: "row", pl: 24, children: /* @__PURE__ */ s(
       w,
       {
         sx: {
@@ -778,7 +778,7 @@ const we = ({
             /* @__PURE__ */ e(l, { color: a.palette.secondary.main, variant: "XSmall", children: r.schedule_month_label })
           ] }),
           /* @__PURE__ */ s(w, { children: [
-            /* @__PURE__ */ e(l, { bold: !0, variant: "Body", children: B(d, "0,0.00") }),
+            /* @__PURE__ */ e(l, { bold: !0, variant: "Body", children: k(c, "0,0.00") }),
             /* @__PURE__ */ e(
               l,
               {
@@ -786,7 +786,7 @@ const we = ({
                 color: a.palette.success.main,
                 textAlign: "end",
                 variant: "Tiny",
-                children: `+${B(c, "0,0")}`
+                children: `+${k(d, "0,0")}`
               }
             )
           ] })
@@ -811,9 +811,9 @@ const we = ({
     ) })
   ] }) });
 }, bt = D(ut), _t = D(({ debt: a }) => {
-  const { debts: n } = C(), { updateAccount: r } = J(), { onEvent: t } = k(), [o, i] = g.useState(a.interest_rate ?? 0), p = o < 0, d = async () => {
+  const { debts: n } = S(), { updateAccount: r } = J(), { onEvent: t } = F(), [o, i] = g.useState(a.interest_rate ?? 0), p = o < 0, c = async () => {
     await r({ ...a.account, interest_rate: o }), a.interest_rate = o, t(T.DEBTS_SAVE_RATE_ACTION, { account_guid: a.guid });
-  }, c = () => {
+  }, d = () => {
     setTimeout(() => {
       i(a.interest_rate ?? 0);
     }, 250);
@@ -823,8 +823,8 @@ const we = ({
     {
       isSaveDisabled: p,
       label: `${n.details_interest_rate} (%)`,
-      onCancel: c,
-      onSave: d,
+      onCancel: d,
+      onSave: c,
       primaryText: n.details_interest_rate,
       secondaryText: Me(Number(a.interest_rate) / 100),
       zeroStateText: a.interest_rate ? void 0 : n.add_interest_rate,
@@ -841,9 +841,9 @@ const we = ({
     }
   );
 }), yt = D(({ debt: a }) => {
-  const { debts: n } = C(), { updateAccount: r } = J(), { onEvent: t } = k(), [o, i] = g.useState(a.monthly_payment ?? 0), p = o < 0 || o > 9999999999e-2, d = async () => {
+  const { debts: n } = S(), { updateAccount: r } = J(), { onEvent: t } = F(), [o, i] = g.useState(a.monthly_payment ?? 0), p = o < 0 || o > 9999999999e-2, c = async () => {
     await r({ ...a.account, minimum_payment: o }), a.monthly_payment = o, t(T.DEBTS_SAVE_PAYMENT_ACTION, { account_guid: a.guid });
-  }, c = () => {
+  }, d = () => {
     setTimeout(() => {
       i(a.monthly_payment ?? 0);
     }, 250);
@@ -853,10 +853,10 @@ const we = ({
     {
       isSaveDisabled: p,
       label: n.details_monthly_payment,
-      onCancel: c,
-      onSave: d,
+      onCancel: d,
+      onSave: c,
       primaryText: n.details_monthly_payment,
-      secondaryText: B(a.monthly_payment, "0,0"),
+      secondaryText: k(a.monthly_payment, "0,0"),
       zeroStateText: a.monthly_payment ? void 0 : n.add_monthly_payment,
       children: /* @__PURE__ */ e(
         ne,
@@ -873,9 +873,9 @@ const we = ({
     }
   );
 }), ft = D(({ debt: a }) => {
-  const { debts: n } = C(), { updateAccount: r } = J(), { onEvent: t } = k(), [o, i] = g.useState(a.original_balance ?? 0), p = o < 0 || o > 9999999999e-2, d = async () => {
+  const { debts: n } = S(), { updateAccount: r } = J(), { onEvent: t } = F(), [o, i] = g.useState(a.original_balance ?? 0), p = o < 0 || o > 9999999999e-2, c = async () => {
     await r({ ...a.account, original_balance: o }), a.original_balance = o, t(T.DEBTS_SAVE_BALANCE_ACTION, { account_guid: a.guid });
-  }, c = () => {
+  }, d = () => {
     setTimeout(() => {
       i(a.original_balance ?? 0);
     }, 250);
@@ -885,10 +885,10 @@ const we = ({
     {
       isSaveDisabled: p,
       label: n.details_original_balance,
-      onCancel: c,
-      onSave: d,
+      onCancel: d,
+      onSave: c,
       primaryText: n.details_original_balance,
-      secondaryText: B(a.original_balance, "0,0"),
+      secondaryText: k(a.original_balance, "0,0"),
       zeroStateText: a.original_balance ? void 0 : n.add_original_balance,
       children: /* @__PURE__ */ e(
         ne,
@@ -905,9 +905,9 @@ const we = ({
     }
   );
 }), xt = () => {
-  const { onEvent: a } = k(), { selectedDebtChartData: n } = F();
+  const { onEvent: a } = F(), { selectedDebtChartData: n } = L();
   return g.useEffect(() => a(T.DEBT_DETAILS_VIEW), []), /* @__PURE__ */ s(w, { bgcolor: "background.paper", children: [
-    n?.goal && /* @__PURE__ */ s($, { children: [
+    n?.goal && /* @__PURE__ */ s(H, { children: [
       /* @__PURE__ */ e(ze, { goal: n.goal }),
       /* @__PURE__ */ e(G, {}),
       /* @__PURE__ */ e(Xe, { goal: n.goal }),
@@ -915,7 +915,7 @@ const we = ({
       /* @__PURE__ */ e(Ve, { goal: n.goal }),
       /* @__PURE__ */ e(G, {})
     ] }),
-    !n?.goal && n?.account && /* @__PURE__ */ s($, { children: [
+    !n?.goal && n?.account && /* @__PURE__ */ s(H, { children: [
       /* @__PURE__ */ e(yt, { debt: n }),
       /* @__PURE__ */ e(G, {}),
       /* @__PURE__ */ e(_t, { debt: n }),
@@ -925,10 +925,10 @@ const we = ({
     ] })
   ] });
 }, gt = D(xt), wt = ({ setTabValue: a, sx: n }) => {
-  const { debts: r } = C(), { showError: t, showCompleted: o } = F();
+  const { debts: r } = S(), { showError: t, showCompleted: o } = L();
   return g.useEffect(() => {
     t && a(1);
-  }, [t]), !t && !o ? /* @__PURE__ */ e($, {}) : /* @__PURE__ */ s(w, { gap: 16, children: [
+  }, [t]), !t && !o ? /* @__PURE__ */ e(H, {}) : /* @__PURE__ */ s(w, { gap: 16, children: [
     /* @__PURE__ */ e(ue, { sx: { my: 16, mx: 24, ...n }, children: /* @__PURE__ */ s(
       me,
       {
@@ -953,7 +953,7 @@ const we = ({
     t && /* @__PURE__ */ e(ue, { sx: { mb: 16, mt: 100, mx: 24, ...n }, children: /* @__PURE__ */ s(
       me,
       {
-        icon: /* @__PURE__ */ e($, {}),
+        icon: /* @__PURE__ */ e(H, {}),
         severity: "error",
         sx: {
           borderRadius: 2,
@@ -970,8 +970,8 @@ const we = ({
     ) })
   ] });
 }, Ct = D(wt), St = () => {
-  const { debts: a } = C(), { showError: n, showCompleted: r } = F(), [t, o] = g.useState(0);
-  return /* @__PURE__ */ s($, { children: [
+  const { debts: a } = S(), { showError: n, showCompleted: r } = L(), [t, o] = g.useState(0);
+  return /* @__PURE__ */ s(H, { children: [
     (n || r) && /* @__PURE__ */ e(Ct, { setTabValue: o, sx: { mt: -24 } }),
     /* @__PURE__ */ s(
       je,
@@ -1006,7 +1006,7 @@ const we = ({
     /* @__PURE__ */ e(be, { index: 1, name: "debt-details", value: t, children: /* @__PURE__ */ e(gt, {}) })
   ] });
 }, vt = D(St), Dt = ({ isOpen: a, onClose: n }) => {
-  const { debts: r } = C(), { showError: t, showCompleted: o } = F(), i = t || o ? /* @__PURE__ */ e($, {}) : /* @__PURE__ */ e(ht, {});
+  const { debts: r } = S(), { showError: t, showCompleted: o } = L(), i = t || o ? /* @__PURE__ */ e(H, {}) : /* @__PURE__ */ e(ht, {});
   return /* @__PURE__ */ e(
     re,
     {
@@ -1021,11 +1021,11 @@ const we = ({
     }
   );
 }, Tt = D(() => {
-  const { debts: a } = C(), { monthlyCashFlowProfile: n, updateMonthlyCashFlowProfile: r } = V(), { onEvent: t } = k(), [o, i] = g.useState(n?.extra_payment ?? 0), p = o < 0 || o > 9999999999e-2, d = async () => {
+  const { debts: a } = S(), { monthlyCashFlowProfile: n, updateMonthlyCashFlowProfile: r } = V(), { onEvent: t } = F(), [o, i] = g.useState(n?.extra_payment ?? 0), p = o < 0 || o > 9999999999e-2, c = async () => {
     n && (await r({ ...n, extra_payment: o }), n.extra_payment = o, t(T.DEBTS_SAVE_PAYDOWN_ACTION, {
       user_guid: n?.user_guid
     }));
-  }, c = () => {
+  }, d = () => {
     setTimeout(() => {
       i(n?.extra_payment ?? 0);
     }, 250);
@@ -1035,10 +1035,10 @@ const we = ({
     {
       isSaveDisabled: p,
       label: a.paydown_drawer_extra_payment,
-      onCancel: c,
-      onSave: d,
+      onCancel: d,
+      onSave: c,
       primaryText: a.paydown_drawer_extra_payment,
-      secondaryText: B(n?.extra_payment, "0,0"),
+      secondaryText: k(n?.extra_payment, "0,0"),
       zeroStateText: n?.extra_payment ? void 0 : a.add_extra_payment,
       children: /* @__PURE__ */ e(
         ne,
@@ -1055,12 +1055,12 @@ const we = ({
     }
   );
 }), At = () => {
-  const { debts: a } = C(), { totalMonthlyPayments: n } = Z(), { monthlyCashFlowProfile: r } = V(), t = n + Number(r?.extra_payment);
+  const { debts: a } = S(), { totalMonthlyPayments: n } = Z(), { monthlyCashFlowProfile: r } = V(), t = n + Number(r?.extra_payment);
   return /* @__PURE__ */ s(w, { sx: { backgroundColor: "background.default", height: "100%" }, children: [
     /* @__PURE__ */ s(w, { p: 24, children: [
       /* @__PURE__ */ s(w, { alignItems: "center", gap: 4, mb: 24, children: [
         /* @__PURE__ */ e(l, { variant: "Body", children: a.paydown_drawer_mimimum_label }),
-        /* @__PURE__ */ e(l, { bold: !0, variant: "H1", children: B(n, "0,0") }),
+        /* @__PURE__ */ e(l, { bold: !0, variant: "H1", children: k(n, "0,0") }),
         /* @__PURE__ */ e(l, { textAlign: "center", truncate: !1, variant: "Small", width: 208, children: a.paydown_drawer_minimum_info })
       ] }),
       /* @__PURE__ */ s(w, { children: [
@@ -1071,11 +1071,11 @@ const we = ({
     /* @__PURE__ */ e(w, { sx: { backgroundColor: "background.paper" }, children: /* @__PURE__ */ e(Tt, {}) }),
     /* @__PURE__ */ e(w, { flexDirection: "row-reverse", px: 24, py: 12, children: /* @__PURE__ */ s(w, { gap: 4, children: [
       /* @__PURE__ */ e(l, { variant: "Small", children: a.paydown_drawer_total_payment }),
-      /* @__PURE__ */ e(l, { bold: !0, textAlign: "right", variant: "Body", children: B(t, "0,0") })
+      /* @__PURE__ */ e(l, { bold: !0, textAlign: "right", variant: "Body", children: k(t, "0,0") })
     ] }) })
   ] });
 }, Et = D(At), It = ({ isOpen: a, onClose: n }) => {
-  const { debts: r } = C();
+  const { debts: r } = S();
   return /* @__PURE__ */ e(
     re,
     {
@@ -1145,12 +1145,12 @@ const Pt = (a) => {
   onHoverRow: t,
   onClickRow: o
 }) => {
-  const i = X(), { onEvent: p } = k(), { isMobile: d } = Y(), { debts: c } = C(), [m, _] = g.useState([
+  const i = X(), { onEvent: p } = F(), { isMobile: c } = Y(), { debts: d } = S(), [m, u] = g.useState([
     { field: "priority", sort: "asc" }
-  ]), f = [
+  ]), x = [
     {
       field: "priority",
-      headerName: c.table_column_priority,
+      headerName: d.table_column_priority,
       renderHeader: j,
       renderCell: kt,
       sortComparator: Bt,
@@ -1159,41 +1159,41 @@ const Pt = (a) => {
       type: "custom",
       align: "left",
       headerAlign: "left",
-      minWidth: d ? 67 : 72,
-      flex: d ? 0.2 : 0.4
+      minWidth: c ? 67 : 72,
+      flex: c ? 0.2 : 0.4
     },
     {
       field: "account",
-      headerName: c.table_column_account,
+      headerName: d.table_column_account,
       renderHeader: j,
       renderCell: Nt,
       sortable: !1,
       type: "custom",
       align: "left",
       headerAlign: "left",
-      minWidth: d ? 180 : 225,
+      minWidth: c ? 180 : 225,
       flex: 1
     },
     {
       field: "balance",
-      headerName: c.table_column_balance,
+      headerName: d.table_column_balance,
       renderHeader: j,
-      renderCell: (u) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: B(u.value, "0,0") }),
+      renderCell: (y) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: k(y.value, "0,0") }),
       sortable: !0,
-      hideSortIcons: d,
+      hideSortIcons: c,
       type: "number",
-      align: d ? "right" : "left",
-      headerAlign: d ? "right" : "left",
-      minWidth: d ? 70 : 122,
-      flex: d ? 0.4 : 0.6
+      align: c ? "right" : "left",
+      headerAlign: c ? "right" : "left",
+      minWidth: c ? 70 : 122,
+      flex: c ? 0.4 : 0.6
     },
     {
       field: "interest_rate",
-      headerName: c.table_column_interest_rate,
+      headerName: d.table_column_interest_rate,
       renderHeader: j,
-      renderCell: (u) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: isNaN(u.value) ? "---" : `${Number(u.value).toFixed(2)}%` }),
+      renderCell: (y) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: isNaN(y.value) ? "---" : `${Number(y.value).toFixed(2)}%` }),
       sortable: !0,
-      hideSortIcons: d,
+      hideSortIcons: c,
       type: "number",
       align: "left",
       headerAlign: "left",
@@ -1202,11 +1202,11 @@ const Pt = (a) => {
     },
     {
       field: "projected_payoff_date",
-      headerName: c.table_column_payoff_date,
+      headerName: d.table_column_payoff_date,
       renderHeader: j,
-      renderCell: (u) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: u.value ? U(u.value, q.MONTH_SHORT_YEAR) : "---" }),
+      renderCell: (y) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: y.value ? U(y.value, q.MONTH_SHORT_YEAR) : "---" }),
       sortable: !0,
-      hideSortIcons: d,
+      hideSortIcons: c,
       type: "number",
       align: "left",
       headerAlign: "left",
@@ -1215,11 +1215,11 @@ const Pt = (a) => {
     },
     {
       field: "monthly_payment",
-      headerName: c.table_column_amount_due,
+      headerName: d.table_column_amount_due,
       renderHeader: j,
-      renderCell: (u) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: typeof u.value == "number" ? B(u.value, "0,0") : "---" }),
+      renderCell: (y) => /* @__PURE__ */ e(l, { color: i.palette.text.primary, variant: "Small", children: typeof y.value == "number" ? k(y.value, "0,0") : "---" }),
       sortable: !0,
-      hideSortIcons: d,
+      hideSortIcons: c,
       type: "number",
       align: "left",
       headerAlign: "left",
@@ -1227,7 +1227,7 @@ const Pt = (a) => {
       flex: 0.6
     }
   ], h = [
-    ...f.slice(0, 3),
+    ...x.slice(0, 3),
     {
       field: "chevron",
       headerName: "",
@@ -1240,14 +1240,18 @@ const Pt = (a) => {
       headerAlign: "right",
       width: 20
     }
-  ], v = g.useMemo(() => n.map((u, S) => ({
-    ...u,
-    id: S,
-    priority: Mt(u)
-  })), [n]), M = (u) => {
-    const R = u.target.closest("[data-id]")?.getAttribute("data-id"), b = n[Number(R)];
-    t?.(b?.guid ?? "");
-  }, P = (u) => v.find((S) => S.guid === u)?.id;
+  ], v = g.useMemo(() => n.map((y, M) => ({
+    ...y,
+    id: M,
+    priority: Mt(y)
+  })), [n]), B = (y) => {
+    const f = y.target.closest("[data-id]")?.getAttribute("data-id"), E = n[Number(f)];
+    t?.(E?.guid ?? "");
+  }, N = (y) => {
+    c || B(y);
+  }, C = (y) => {
+    c && B(y);
+  }, A = (y) => v.find((M) => M.guid === y)?.id;
   return /* @__PURE__ */ e(
     ae,
     {
@@ -1262,29 +1266,31 @@ const Pt = (a) => {
       children: /* @__PURE__ */ e(
         Ue,
         {
-          columns: d ? h : f,
+          columns: c ? h : x,
           disableColumnFilter: !0,
           disableColumnMenu: !0,
           hideFooter: !0,
           initialState: { sorting: { sortModel: m } },
-          onRowClick: (u) => {
-            o(), p(T.DEBTS_CLICK_TABLE_ROW, { account_guid: u.row.guid });
+          onRowClick: (y) => {
+            o(), p(T.DEBTS_CLICK_TABLE_ROW, { account_guid: y.row.guid });
           },
-          onSortModelChange: (u) => {
-            _(u), p(T.DEBTS_CLICK_TABLE_SORT);
+          onSortModelChange: (y) => {
+            u(y), p(T.DEBTS_CLICK_TABLE_SORT);
           },
           rows: v,
           slotProps: {
             baseIconButton: { color: "secondary", sx: { ml: 8 } },
             row: {
-              onMouseEnter: M,
-              onMouseLeave: () => t?.("")
+              onMouseEnter: N,
+              onMouseLeave: () => !c && t?.(""),
+              onTouchStart: C,
+              onClick: c ? C : void 0
             }
           },
           sortModel: m,
           sortingOrder: ["asc", "desc"],
           sx: {
-            [`& .MuiDataGrid-row[data-id="${P(r)}"]`]: {
+            [`& .MuiDataGrid-row[data-id="${A(r)}"]`]: {
               backgroundColor: i.palette.mode === "light" ? "#f8f9fb" : "#1f2329",
               filter: "brightness(98%)"
             }
@@ -1319,24 +1325,24 @@ const Pt = (a) => {
     }
   );
 }, Lt = D(({ buttonEl: a, onClose: n }) => {
-  const { onEvent: r } = k(), { debts: t } = C(), { selectedDebtPriority: o, setSelectedDebtPriority: i } = F(), p = !!a, d = [
+  const { onEvent: r } = F(), { debts: t } = S(), { selectedDebtPriority: o, setSelectedDebtPriority: i } = L(), p = !!a, c = [
     {
-      priority: I.FASTEST_PAYOFF_FIRST,
+      priority: P.FASTEST_PAYOFF_FIRST,
       text: t.priority_sort_fastest_payoff
     },
     {
-      priority: I.HIGHEST_INTEREST,
+      priority: P.HIGHEST_INTEREST,
       text: t.priority_sort_highest_interest
     },
     {
-      priority: I.LOWEST_BALANCE,
+      priority: P.LOWEST_BALANCE,
       text: t.priority_sort_lowest_balance
     },
     {
-      priority: I.HIGHEST_BALANCE,
+      priority: P.HIGHEST_BALANCE,
       text: t.priority_sort_highest_balance
     }
-  ], c = (m) => {
+  ], d = (m) => {
     i(m), r(T.DEBTS_CLICK_PRIORITY, { debts_priority: m });
   };
   return /* @__PURE__ */ e(
@@ -1354,10 +1360,10 @@ const Pt = (a) => {
         vertical: "top",
         horizontal: "left"
       },
-      children: /* @__PURE__ */ e(ye, { children: d.map(({ priority: m, text: _ }) => /* @__PURE__ */ s(
+      children: /* @__PURE__ */ e(ye, { children: c.map(({ priority: m, text: u }) => /* @__PURE__ */ s(
         Je,
         {
-          onClick: () => c(m),
+          onClick: () => d(m),
           sx: {
             bgcolor: o === m ? "primary.main" : void 0,
             color: o === m ? "#fff" : void 0,
@@ -1373,7 +1379,7 @@ const Pt = (a) => {
             }
           },
           children: [
-            /* @__PURE__ */ e(l, { color: "inherit", variant: "Small", children: _ }),
+            /* @__PURE__ */ e(l, { color: "inherit", variant: "Small", children: u }),
             o === m && /* @__PURE__ */ e(fe, { color: "inherit", filled: !0, fontSize: "small" })
           ]
         },
@@ -1382,59 +1388,59 @@ const Pt = (a) => {
     }
   );
 }), $t = D(() => {
-  const { onEvent: a } = k(), { debts: n } = C(), { selectedDebtPriority: r } = F(), [t, o] = g.useState(null), i = (m) => {
+  const { onEvent: a } = F(), { debts: n } = S(), { selectedDebtPriority: r } = L(), [t, o] = g.useState(null), i = (m) => {
     o(m.currentTarget), a(T.DEBTS_CLICK_PRIORITIZE);
   }, p = () => {
     o(null);
-  }, d = !!t, c = g.useMemo(() => ({
-    [I.FASTEST_PAYOFF_FIRST]: n.priority_sort_fastest_payoff,
-    [I.HIGHEST_INTEREST]: n.priority_sort_highest_interest,
-    [I.HIGHEST_BALANCE]: n.priority_sort_highest_balance,
-    [I.LOWEST_BALANCE]: n.priority_sort_lowest_balance
+  }, c = !!t, d = g.useMemo(() => ({
+    [P.FASTEST_PAYOFF_FIRST]: n.priority_sort_fastest_payoff,
+    [P.HIGHEST_INTEREST]: n.priority_sort_highest_interest,
+    [P.HIGHEST_BALANCE]: n.priority_sort_highest_balance,
+    [P.LOWEST_BALANCE]: n.priority_sort_lowest_balance
   })[r] ?? n.priority_sort_lowest_balance, [r]);
-  return /* @__PURE__ */ s(y, { children: [
-    /* @__PURE__ */ e(Rt, { buttonText: c, isOpen: d, onClick: i }),
+  return /* @__PURE__ */ s(_, { children: [
+    /* @__PURE__ */ e(Rt, { buttonText: d, isOpen: c, onClick: i }),
     /* @__PURE__ */ e(Lt, { buttonEl: t, onClose: p })
   ] });
 }), Ht = (a, n, r = 0) => {
-  const t = a.map((c) => ({ ...c }));
+  const t = a.map((d) => ({ ...d }));
   ge(t, n);
   const o = /* @__PURE__ */ new Date(), i = [];
-  let p = 0, d = 1;
-  for (const c of t)
+  let p = 0, c = 1;
+  for (const d of t)
     i.push({
-      ...c,
+      ...d,
       // Start with the initial balance
-      dataset: [{ x: new Date(o), y: c.balance }]
+      dataset: [{ x: new Date(o), y: d.balance }]
     });
-  for (; t.some((c) => c.balance >= 0.01 && !c.is_impossible); ) {
-    let c = !1, m = !1, _ = !1;
-    for (const [f, h] of t.entries()) {
+  for (; t.some((d) => d.balance >= 0.01 && !d.is_impossible); ) {
+    let d = !1, m = !1, u = !1;
+    for (const [x, h] of t.entries()) {
       if (h.balance <= 0.01) continue;
-      const v = i[f].dataset, P = (h.interest_rate ?? 0) / 100 / 12, u = h.balance * P, S = h.monthly_payment ?? 0;
-      let H = S, R = 0;
-      !_ && r > 0 && (H += r, _ = !0), !m && p > 0 && (R = p, m = !0), h.balance += u;
-      const b = Math.min(h.balance, H + R);
-      if (b <= u) {
-        h.is_impossible = !0, i[f].is_impossible = !0, i[f].priority = void 0, v.push({ x: new Date(o), y: h.balance });
+      const v = i[x].dataset, N = (h.interest_rate ?? 0) / 100 / 12, C = h.balance * N, A = h.monthly_payment ?? 0;
+      let y = A, M = 0;
+      !u && r > 0 && (y += r, u = !0), !m && p > 0 && (M = p, m = !0), h.balance += C;
+      const b = Math.min(h.balance, y + M);
+      if (b <= C) {
+        h.is_impossible = !0, i[x].is_impossible = !0, i[x].priority = void 0, v.push({ x: new Date(o), y: h.balance });
         continue;
       }
       h.balance -= b, h.balance = h.balance < 0.01 ? 0 : h.balance, v.push({
         x: new Date(o),
         y: Math.max(0, h.balance),
         payment: b,
-        extra: R
-      }), h.balance <= 0 && (p += S, i[f].projected_payoff_date = new Date(o)), b > 0 && (c = !0);
+        extra: M
+      }), h.balance <= 0 && (p += A, i[x].projected_payoff_date = new Date(o)), b > 0 && (d = !0);
     }
-    c && o.setMonth(o.getMonth() + 1);
+    d && o.setMonth(o.getMonth() + 1);
   }
-  return i.forEach((c) => {
-    (c.interest_rate === void 0 || c.monthly_payment === void 0) && (c.projected_payoff_date = void 0);
-  }), i.forEach((c) => {
-    c.priority = !c.is_paid_off && !c.is_impossible ? d++ : void 0;
+  return i.forEach((d) => {
+    (d.interest_rate === void 0 || d.monthly_payment === void 0) && (d.projected_payoff_date = void 0);
+  }), i.forEach((d) => {
+    d.priority = !d.is_paid_off && !d.is_impossible ? c++ : void 0;
   }), i;
 }, Ot = D(({ onClick: a }) => {
-  const { debts: n } = C(), { isDesktop: r } = Y(), { totalMonthlyPayments: t } = Z(), { monthlyCashFlowProfile: o } = V(), i = t + Number(o?.extra_payment), p = r ? n.paydown_button_long : n.paydown_button_short;
+  const { debts: n } = S(), { isDesktop: r } = Y(), { totalMonthlyPayments: t } = Z(), { monthlyCashFlowProfile: o } = V(), i = t + Number(o?.extra_payment), p = r ? n.paydown_button_long : n.paydown_button_short;
   return /* @__PURE__ */ e(
     xe,
     {
@@ -1444,35 +1450,35 @@ const Pt = (a) => {
       "aria-label": "extra-paydown",
       onClick: a,
       sx: { justifyContent: "start", minWidth: 100, mx: 4 },
-      children: A(p, B(i, "0,0"))
+      children: I(p, k(i, "0,0"))
     }
   );
 }), Wt = ({ onBackClick: a, sx: n }) => {
-  const [r, t] = g.useState(!1), [o, i] = g.useState(!1), [p, d] = g.useState(!1), [c, m] = g.useState(""), { isDesktop: _, isMobile: f } = Y(), { debts: h } = C(), { onEvent: v } = k(), { onLoad: M } = ke(), { isCopyLoaded: P, isInitialized: u, setSelectedAccounts: S } = Ne(), { setSelectedAccount: H } = Re(), { selectedDebtPriority: R, setSelectedDebtChartData: b } = F(), { visibleDebtAccounts: x } = J(), { goalsLoaded: E, loadGoals: L, monthlyCashFlowProfile: N } = V(), { debts: z } = Z(), K = g.useMemo(() => {
-    const O = N?.extra_payment ?? 0;
-    return Ht(z, R, O);
-  }, [z, R, N]);
+  const [r, t] = g.useState(!1), [o, i] = g.useState(!1), [p, c] = g.useState(!1), [d, m] = g.useState(""), { isDesktop: u, isMobile: x } = Y(), { debts: h } = S(), { onEvent: v } = F(), { onLoad: B } = ke(), { isCopyLoaded: N, isInitialized: C, setSelectedAccounts: A } = Ne(), { setSelectedAccount: y } = Re(), { selectedDebtPriority: M, setSelectedDebtChartData: b } = L(), { visibleDebtAccounts: f } = J(), { goalsLoaded: E, loadGoals: $, monthlyCashFlowProfile: R } = V(), { debts: z } = Z(), K = g.useMemo(() => {
+    const O = R?.extra_payment ?? 0;
+    return Ht(z, M, O);
+  }, [z, M, R]);
   g.useEffect(() => {
-    S(x), v(T.DEBTS_VIEW);
+    A(f), v(T.DEBTS_VIEW);
   }, []), g.useEffect(() => {
-    S(x);
-  }, [x]), g.useEffect(() => {
-    u && L().finally(() => {
-      M?.("DebtsWidget");
+    A(f);
+  }, [f]), g.useEffect(() => {
+    C && $().finally(() => {
+      B?.("DebtsWidget");
     });
-  }, [u]);
+  }, [C]);
   const oe = (O) => m(O), ie = () => {
-    const O = x.find((ee) => ee.guid === c), le = K.find((ee) => ee.guid === c);
-    O && H(O), le && b(le), t(!0);
+    const O = f.find((ee) => ee.guid === d), le = K.find((ee) => ee.guid === d);
+    O && y(O), le && b(le), t(!0);
   }, Ce = () => v(T.DEBTS_CLICK_FILTER), Se = () => {
-    d(!0), v(T.DEBTS_CLICK_SNOWBALL_CTA);
+    c(!0), v(T.DEBTS_CLICK_SNOWBALL_CTA);
   }, ve = () => {
     i(!0), v(T.DEBTS_CLICK_PAYDOWN);
   };
-  return !E || !P || !u ? /* @__PURE__ */ e(et, {}) : /* @__PURE__ */ s(
+  return !E || !N || !C ? /* @__PURE__ */ e(et, {}) : /* @__PURE__ */ s(
     Ge,
     {
-      accountOptions: x,
+      accountOptions: f,
       actions: [
         /* @__PURE__ */ e($t, {}, "prioritize-debts"),
         /* @__PURE__ */ e(Ot, { onClick: ve }, "extra-paydown")
@@ -1482,25 +1488,25 @@ const Pt = (a) => {
       sx: n,
       title: h.title,
       children: [
-        /* @__PURE__ */ s(w, { sx: { px: _ ? "48px" : "24px" }, children: [
+        /* @__PURE__ */ s(w, { sx: { px: u ? "48px" : "24px" }, children: [
           /* @__PURE__ */ s(
             w,
             {
               sx: {
-                alignItems: f ? "flex-start" : "flex-end",
-                flexDirection: f ? "column" : "row",
-                mx: f ? "-12px" : 0
+                alignItems: x ? "flex-start" : "flex-end",
+                flexDirection: x ? "column" : "row",
+                mx: x ? "-12px" : 0
               },
               children: [
                 /* @__PURE__ */ e(
                   we,
                   {
                     debts: K,
-                    height: f ? 250 : void 0,
-                    hoveredDebtGuid: c,
+                    height: x ? 250 : void 0,
+                    hoveredDebtGuid: d,
                     onClickArea: ie,
                     onHoverArea: oe,
-                    sx: { mr: f ? "4px" : "-48px" }
+                    sx: { mr: x ? "4px" : "-48px" }
                   }
                 ),
                 /* @__PURE__ */ e(
@@ -1508,17 +1514,17 @@ const Pt = (a) => {
                   {
                     debts: K,
                     onClickCta: Se,
-                    sx: { mb: f ? "0px" : "64px" }
+                    sx: { mb: x ? "0px" : "64px" }
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ e(w, { sx: { mx: f ? "-24px" : 0 }, children: /* @__PURE__ */ e(
+          /* @__PURE__ */ e(w, { sx: { mx: x ? "-24px" : 0 }, children: /* @__PURE__ */ e(
             Ft,
             {
               debts: K,
-              hoveredDebtGuid: c,
+              hoveredDebtGuid: d,
               onClickRow: ie,
               onHoverRow: oe
             }
@@ -1528,7 +1534,7 @@ const Pt = (a) => {
           ct,
           {
             isOpen: p,
-            onClose: () => d(!1)
+            onClose: () => c(!1)
           }
         ),
         /* @__PURE__ */ e(Dt, { isOpen: r, onClose: () => t(!1) }),