@mx-cartographer/experiences 8.2.3 → 8.2.4-alpha-ram1-bug-testing

package/dist/debts/index.es.js

@@ -2,17 +2,17 @@ import { jsx as e, jsxs as l, Fragment as R } from "react/jsx-runtime";
 import f from "react";
 import { observer as C } from "mobx-react-lite";
 import y from "@mui/material/Stack";
-import { useTheme as j, Card as ge, Stack as h, Box as W } from "@mui/material";
+import { useTheme as j, Card as ge, Stack as u, Box as W } from "@mui/material";
 import { Text as i, P as xe, H3 as Be, InstitutionLogo as Pe, Icon as ne } from "@mxenabled/mxui";
 import { intervalToDuration as Re, formatDuration as Le } from "date-fns";
 import { s as Fe, D as F, t as $e, b as Oe } from "../DebtUtils-DD3186U-.mjs";
 import { f as I, a as We } from "../NumberFormatting--XMeeBfr.mjs";
 import { f as J, D as Q } from "../DateFormats-HudZ3Bjs.mjs";
 import { G as Ge, q as ee, u as w, k as V, g as k, d as te, a as He, b as ze } from "../hooks-BaO_gOI6.mjs";
-import { u as ae } from "../useScreenSize-CeFhWTt_.mjs";
+import { u as ae } from "../useScreenSize-mWpmnh5w.mjs";
 import { b as T } from "../Localization-DnoVyBNK.mjs";
-import { D as ie } from "../Drawer-XPaLYjiO.mjs";
-import { A as je, u as Ve } from "../AccountDetailsHeader-CfdnKyJK.mjs";
+import { D as ie } from "../Drawer-BXqqBMxg.mjs";
+import { A as je, u as Ve } from "../AccountDetailsHeader-DIysk_4w.mjs";
 import Ye from "@mui/material/Card";
 import Ke from "@mui/material/CardContent";
 import Ue from "@mui/material/CardHeader";
@@ -20,15 +20,15 @@ import le from "@mui/material/Box";
 import { useTheme as qe } from "@mui/material/styles";
 import { LineChart as Xe } from "@mui/x-charts/LineChart";
 import { A as S } from "../Analytics-CzGzz_sE.mjs";
-import me from "@mui/material/Tab";
+import be from "@mui/material/Tab";
 import Ze from "@mui/material/Tabs";
 import we from "@mui/material/List";
 import G from "@mui/material/Divider";
-import { M as Je, I as Qe, O as et } from "../OriginalBalanceAction-CvDx0K6k.mjs";
+import { M as Je, I as Qe, O as et } from "../OriginalBalanceAction-CkJPnp2c.mjs";
 import tt from "@mui/material/TextField";
-import { L as re } from "../ListItemAction-DGjHxNDJ.mjs";
-import { C as se } from "../CurrencyInput-B59ugxPN.mjs";
-import be from "@mui/material/Alert";
+import { L as re } from "../ListItemAction-CwspSmQi.mjs";
+import { C as se } from "../CurrencyInput-adTIRtL3.mjs";
+import me from "@mui/material/Alert";
 import _e from "@mui/material/AlertTitle";
 import ye from "@mui/material/Paper";
 import { Error as rt, CheckCircle as Ce } from "@mxenabled/mx-icons";
@@ -42,18 +42,18 @@ import it from "@mui/material/ListItem";
 import lt from "@mui/material/Popover";
 import { u as st } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as ct } from "../Loader-CxeBwuPG.mjs";
-import { W as dt } from "../WidgetContainer-CYcmwsSu.mjs";
-import { E as pt } from "../EmptyState-DHAkGsjk.mjs";
-import { C as ht } from "../ConnectDrawer-DgfsTpyW.mjs";
-function ut(r, n, o = 0) {
-  const t = r.map((m) => ({ ...m })).filter(
-    (m) => m.interest_rate !== void 0 && m.monthly_payment !== void 0 && !m.is_paid_off
+import { W as dt } from "../WidgetContainer-DNuz_s7W.mjs";
+import { E as pt } from "../EmptyState-CJUDc3kD.mjs";
+import { C as ut } from "../ConnectDrawer-Cnjr3Ddg.mjs";
+function ht(r, n, o = 0) {
+  const t = r.map((b) => ({ ...b })).filter(
+    (b) => b.interest_rate !== void 0 && b.monthly_payment !== void 0 && !b.is_paid_off
   );
   Fe(t, n);
   let a = 0, s = 0;
   const d = /* @__PURE__ */ new Date(), c = /* @__PURE__ */ new Date();
-  for (; t.some((m) => m.balance >= 0.01 && !m.is_impossible); ) {
-    let m = !1;
+  for (; t.some((b) => b.balance >= 0.01 && !b.is_impossible); ) {
+    let b = !1;
     for (const [v, x] of t.entries()) {
       if (x.balance <= 0.01 || x.is_impossible) continue;
       const L = (x.interest_rate ?? 0) / 100 / 12, N = x.balance * L;
@@ -64,25 +64,25 @@ function ut(r, n, o = 0) {
         x.is_impossible = !0;
         continue;
       }
-      x.balance -= E, x.balance = x.balance < 0.01 ? 0 : x.balance, a += N, x.balance <= 0 && (s += A), E > 0 && (m = !0);
+      x.balance -= E, x.balance = x.balance < 0.01 ? 0 : x.balance, a += N, x.balance <= 0 && (s += A), E > 0 && (b = !0);
     }
-    m && c.setMonth(c.getMonth() + 1);
+    b && c.setMonth(c.getMonth() + 1);
   }
-  const b = t.some((m) => m.is_impossible && m.balance > 0), u = Re({ start: d, end: c });
+  const m = t.some((b) => b.is_impossible && b.balance > 0), h = Re({ start: d, end: c });
   return {
-    payoffSavings: b ? "N/A" : I(a, "0,0.00"),
-    payoffDate: b ? "Never" : J(c, Q.MONTH_YEAR),
-    payoffDuration: b ? "Stagnant" : Le(u, { format: ["years", "months"] }) || "0 months"
+    payoffSavings: m ? "N/A" : I(a, "0,0.00"),
+    payoffDate: m ? "Never" : J(c, Q.MONTH_YEAR),
+    payoffDuration: m ? "Stagnant" : Le(h, { format: ["years", "months"] }) || "0 months"
   };
 }
 const P = () => {
   if (!f.useContext(Ge))
     throw new Error("useCateUiStore() must be used within the GlobalDataContext");
   return ee().uiStore;
-}, mt = ({ debts: r, onClickCta: n, sx: o }) => {
-  const t = j(), { isMobile: a } = ae(), { debts: s } = w(), { selectedDebtPriority: d } = P(), { monthlyCashFlowProfile: c } = V(), { payoffDate: b, payoffSavings: u, payoffDuration: m } = f.useMemo(() => {
+}, bt = ({ debts: r, onClickCta: n, sx: o }) => {
+  const t = j(), { isMobile: a } = ae(), { debts: s } = w(), { selectedDebtPriority: d } = P(), { monthlyCashFlowProfile: c } = V(), { payoffDate: m, payoffSavings: h, payoffDuration: b } = f.useMemo(() => {
     const v = c?.extra_payment ?? 0;
-    return ut(r, d, v);
+    return ht(r, d, v);
   }, [r, d, c]);
   return /* @__PURE__ */ e(
     ge,
@@ -93,9 +93,9 @@ const P = () => {
         minWidth: "186px",
         ...o
       },
-      children: /* @__PURE__ */ l(h, { sx: { gap: "12px", p: "16px" }, children: [
+      children: /* @__PURE__ */ l(u, { sx: { gap: "12px", p: "16px" }, children: [
         /* @__PURE__ */ l(
-          h,
+          u,
           {
             gap: a ? "4px" : "0",
             sx: {
@@ -105,16 +105,16 @@ const P = () => {
             },
             children: [
               /* @__PURE__ */ e(i, { variant: "caption", children: s.snowball_card_date_description }),
-              /* @__PURE__ */ e(i, { bold: !0, color: t.palette.primary.main, variant: "body2", children: b })
+              /* @__PURE__ */ e(i, { bold: !0, color: t.palette.primary.main, variant: "body2", children: m })
             ]
           }
         ),
-        /* @__PURE__ */ l(h, { gap: a ? "4px" : "0", children: [
-          /* @__PURE__ */ e(i, { bold: !0, variant: "body2", children: u }),
-          /* @__PURE__ */ e(i, { sx: { whiteSpace: "normal" }, variant: "caption", children: s.snowball_card_amount_description })
+        /* @__PURE__ */ l(u, { gap: a ? "4px" : "0", children: [
+          /* @__PURE__ */ e(i, { bold: !0, variant: "body2", children: h }),
+          /* @__PURE__ */ e(i, { variant: "caption", children: s.snowball_card_amount_description })
         ] }),
-        /* @__PURE__ */ l(h, { gap: a ? "4px" : "0", children: [
-          /* @__PURE__ */ e(i, { bold: !0, variant: "body2", children: m }),
+        /* @__PURE__ */ l(u, { gap: a ? "4px" : "0", children: [
+          /* @__PURE__ */ e(i, { bold: !0, variant: "body2", children: b }),
           /* @__PURE__ */ e(i, { variant: "caption", children: s.snowball_card_duration_description })
         ] }),
         /* @__PURE__ */ e(
@@ -131,7 +131,7 @@ const P = () => {
       ] })
     }
   );
-}, bt = C(mt), _t = ({ isOpen: r, onClose: n }) => {
+}, mt = C(bt), _t = ({ isOpen: r, onClose: n }) => {
   const o = j(), { debts: t } = w(), [a, s] = f.useState(!1);
   return /* @__PURE__ */ e(
     ie,
@@ -140,22 +140,22 @@ const P = () => {
       isOpen: r,
       onClose: n,
       title: t.snowball_drawer_title,
-      children: /* @__PURE__ */ l(h, { bgcolor: o.palette.background.default, height: "100%", children: [
-        /* @__PURE__ */ l(h, { alignItems: "center", px: 24, py: 24, children: [
-          /* @__PURE__ */ l(h, { alignItems: "center", pb: 24, children: [
-            /* @__PURE__ */ e(i, { mb: 12, variant: "h3", children: t.snowball_drawer_subtitle }),
+      children: /* @__PURE__ */ l(u, { bgcolor: o.palette.background.default, height: "100%", children: [
+        /* @__PURE__ */ l(u, { alignItems: "center", px: 24, py: 24, children: [
+          /* @__PURE__ */ l(u, { alignItems: "center", pb: 24, children: [
+            /* @__PURE__ */ e(i, { mb: 12, truncate: !0, variant: "h3", children: t.snowball_drawer_subtitle }),
             /* @__PURE__ */ e(i, { color: o.palette.secondary.main, variant: "body2", children: t.snowball_drawer_amount_description }),
             /* @__PURE__ */ e(xe, { variant: "h1", children: t.snowball_drawer_savings }),
             /* @__PURE__ */ e(i, { color: o.palette.secondary.main, variant: "body2", children: t.snowball_drawer_duration_description })
           ] }),
           /* @__PURE__ */ l(ge, { sx: { display: "grid", py: 16, px: 24 }, children: [
-            /* @__PURE__ */ e(i, { mb: 4, variant: "h3", children: t.snowball_drawer_question }),
+            /* @__PURE__ */ e(i, { mb: 4, truncate: !0, variant: "h3", children: t.snowball_drawer_question }),
             /* @__PURE__ */ e(
               i,
               {
                 color: o.palette.secondary.main,
                 mb: 8,
-                sx: { whiteSpace: a ? "normal" : "nowrap" },
+                truncate: !a,
                 variant: "subtitle2",
                 children: t.snowball_drawer_answer
               }
@@ -173,23 +173,23 @@ const P = () => {
             )
           ] })
         ] }),
-        /* @__PURE__ */ l(h, { children: [
+        /* @__PURE__ */ l(u, { children: [
           /* @__PURE__ */ e(
             i,
             {
               color: o.palette.secondary.main,
               px: 24,
-              sx: { textAlign: "center", whiteSpace: "normal" },
+              sx: { textAlign: "center" },
               variant: "body2",
               children: t.snowball_drawer_disclaimer
             }
           ),
-          /* @__PURE__ */ l(h, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+          /* @__PURE__ */ l(u, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: T(t.snowball_drawer_month_header, 1) }),
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ l(h, { bgcolor: o.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ l(u, { bgcolor: o.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -207,7 +207,7 @@ const P = () => {
                 }
               ),
               /* @__PURE__ */ l(
-                h,
+                u,
                 {
                   sx: {
                     borderBottom: `1px solid ${o.palette.neutral.light}`,
@@ -217,7 +217,7 @@ const P = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ l(h, { flexGrow: 1, children: [
+                    /* @__PURE__ */ l(u, { flexGrow: 1, children: [
                       /* @__PURE__ */ e(i, { variant: "body1", children: T(t.snowball_drawer_debt_label, "A") }),
                       /* @__PURE__ */ l(i, { color: o.palette.secondary.main, variant: "caption", children: [
                         T(
@@ -228,7 +228,7 @@ const P = () => {
                         t.snowball_drawer_rollover_explainer_pt2
                       ] })
                     ] }),
-                    /* @__PURE__ */ l(h, { children: [
+                    /* @__PURE__ */ l(u, { children: [
                       /* @__PURE__ */ e(i, { variant: "body1", children: "$100.00" }),
                       /* @__PURE__ */ e(
                         i,
@@ -245,7 +245,7 @@ const P = () => {
                 }
               )
             ] }),
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -259,7 +259,7 @@ const P = () => {
                 }
               ),
               /* @__PURE__ */ l(
-                h,
+                u,
                 {
                   sx: {
                     borderBottom: `1px solid ${o.palette.neutral.light}`,
@@ -275,7 +275,7 @@ const P = () => {
                 }
               )
             ] }),
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, py: 14, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, py: 14, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -288,13 +288,13 @@ const P = () => {
                   }
                 }
               ),
-              /* @__PURE__ */ l(h, { flexDirection: "row", flexGrow: 1, pr: 24, children: [
+              /* @__PURE__ */ l(u, { flexDirection: "row", flexGrow: 1, pr: 24, children: [
                 /* @__PURE__ */ e(i, { flexGrow: 1, variant: "body1", children: T(t.snowball_drawer_debt_label, "C") }),
                 /* @__PURE__ */ e(i, { variant: "body1", children: "$1,000.00" })
               ] })
             ] }),
             /* @__PURE__ */ l(
-              h,
+              u,
               {
                 sx: {
                   py: 8,
@@ -311,12 +311,12 @@ const P = () => {
               }
             )
           ] }),
-          /* @__PURE__ */ l(h, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+          /* @__PURE__ */ l(u, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: T(t.snowball_drawer_month_header, 2) }),
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ l(h, { bgcolor: o.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ l(u, { bgcolor: o.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -334,7 +334,7 @@ const P = () => {
                 }
               ),
               /* @__PURE__ */ l(
-                h,
+                u,
                 {
                   sx: {
                     borderBottom: `1px solid ${o.palette.neutral.light}`,
@@ -344,7 +344,7 @@ const P = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ l(h, { flexGrow: 1, children: [
+                    /* @__PURE__ */ l(u, { flexGrow: 1, children: [
                       /* @__PURE__ */ e(i, { variant: "body1", children: T(t.snowball_drawer_debt_label, "B") }),
                       /* @__PURE__ */ l(i, { color: o.palette.secondary.main, variant: "caption", children: [
                         T(
@@ -355,7 +355,7 @@ const P = () => {
                         t.snowball_drawer_rollover_explainer_pt2
                       ] })
                     ] }),
-                    /* @__PURE__ */ l(h, { children: [
+                    /* @__PURE__ */ l(u, { children: [
                       /* @__PURE__ */ e(i, { variant: "body1", children: "$500.00" }),
                       /* @__PURE__ */ e(
                         i,
@@ -372,7 +372,7 @@ const P = () => {
                 }
               )
             ] }),
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -386,7 +386,7 @@ const P = () => {
                 }
               ),
               /* @__PURE__ */ l(
-                h,
+                u,
                 {
                   sx: {
                     flexDirection: "row",
@@ -402,7 +402,7 @@ const P = () => {
               )
             ] }),
             /* @__PURE__ */ l(
-              h,
+              u,
               {
                 sx: {
                   py: 8,
@@ -419,12 +419,12 @@ const P = () => {
               }
             )
           ] }),
-          /* @__PURE__ */ l(h, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
+          /* @__PURE__ */ l(u, { flexDirection: "row", justifyContent: "space-between", sx: { pt: 12, px: 24, pb: 8 }, children: [
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: T(t.snowball_drawer_month_header, 3) }),
             /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: t.snowball_drawer_payment_header })
           ] }),
-          /* @__PURE__ */ l(h, { bgcolor: o.palette.background.paper, mb: 24, children: [
-            /* @__PURE__ */ l(h, { alignItems: "center", flexDirection: "row", pl: 24, children: [
+          /* @__PURE__ */ l(u, { bgcolor: o.palette.background.paper, mb: 24, children: [
+            /* @__PURE__ */ l(u, { alignItems: "center", flexDirection: "row", pl: 24, children: [
               /* @__PURE__ */ e(
                 W,
                 {
@@ -442,7 +442,7 @@ const P = () => {
                 }
               ),
               /* @__PURE__ */ l(
-                h,
+                u,
                 {
                   sx: {
                     alignItems: "center",
@@ -452,8 +452,8 @@ const P = () => {
                     pr: 24
                   },
                   children: [
-                    /* @__PURE__ */ e(h, { flexGrow: 1, children: /* @__PURE__ */ e(i, { variant: "body1", children: T(t.snowball_drawer_debt_label, "C") }) }),
-                    /* @__PURE__ */ l(h, { children: [
+                    /* @__PURE__ */ e(u, { flexGrow: 1, children: /* @__PURE__ */ e(i, { variant: "body1", children: T(t.snowball_drawer_debt_label, "C") }) }),
+                    /* @__PURE__ */ l(u, { children: [
                       /* @__PURE__ */ e(i, { variant: "body1", children: "$1,500.00" }),
                       /* @__PURE__ */ e(
                         i,
@@ -471,7 +471,7 @@ const P = () => {
               )
             ] }),
             /* @__PURE__ */ l(
-              h,
+              u,
               {
                 sx: {
                   py: 8,
@@ -510,14 +510,14 @@ const De = ({
   onClickArea: s,
   onHoverArea: d
 }) => {
-  const c = qe(), { onEvent: b } = k(), u = t.filter((p) => !p.is_impossible), m = [
+  const c = qe(), { onEvent: m } = k(), h = t.filter((p) => !p.is_impossible), b = [
     ...new Set(
-      u.flatMap((p) => p.dataset.map((g) => new Date(g.x).getTime()))
+      h.flatMap((p) => p.dataset.map((g) => new Date(g.x).getTime()))
     )
-  ].sort((p, g) => p - g).map((p) => new Date(p)), v = u.map((p) => {
+  ].sort((p, g) => p - g).map((p) => new Date(p)), v = h.map((p) => {
     const g = new Map(p.dataset.map((B) => [new Date(B.x).getTime(), B.y]));
-    let D = g.get(m[0].getTime()) ?? 0;
-    const M = m.map((B) => {
+    let D = g.get(b[0].getTime()) ?? 0;
+    const M = b.map((B) => {
       const K = g.get(B.getTime()) ?? D;
       return D = K, { x: B, y: K };
     });
@@ -525,10 +525,10 @@ const De = ({
   }), x = v.reduce(
     (p, g) => p + (g.dataset[0]?.y ?? 0),
     0
-  ), $ = m.map((p, g) => {
-    const D = g / (m.length - 1), M = x * (1 - D);
+  ), $ = b.map((p, g) => {
+    const D = g / (b.length - 1), M = x * (1 - D);
     return { x: p, y: M };
-  }), L = Math.ceil(x / 100) * 100, N = m, A = v.map((p, g) => {
+  }), L = Math.ceil(x / 100) * 100, N = b, A = v.map((p, g) => {
     const D = 1 - g / v.length * 0.5, M = gt(ft, D);
     return {
       id: `debt-${g}`,
@@ -581,7 +581,7 @@ const De = ({
           onAreaClick: (p, g) => {
             s?.();
             const D = A.find((M) => M.id === g.seriesId);
-            b(S.DEBTS_CLICK_CHART_AREA, { account_guid: D?.guid });
+            m(S.DEBTS_CLICK_CHART_AREA, { account_guid: D?.guid });
           },
           onHighlightChange: (p) => {
             const g = A.find((D) => D.id === p?.seriesId)?.guid;
@@ -623,7 +623,7 @@ const De = ({
             {
               data: N,
               disableTicks: !0,
-              min: m[0],
+              min: b[0],
               scaleType: "time",
               tickLabelMinGap: 24,
               valueFormatter: (p) => J(p, Q.MONTH_SHORT_YEAR)
@@ -662,7 +662,7 @@ const De = ({
       i,
       {
         color: r.palette.text.secondary,
-        sx: { whiteSpace: "normal", textAlign: "center", px: 8, py: 12 },
+        sx: { textAlign: "center", px: 8, py: 12 },
         variant: "body2",
         children: n.details_chart_description
       }
@@ -675,7 +675,7 @@ const De = ({
     {
       color: r.palette.secondary.main,
       component: "div",
-      sx: { p: 32, textAlign: "center", whiteSpace: "normal" },
+      sx: { p: 32, textAlign: "center" },
       variant: "body2",
       children: s ? o.schedule_error_message : o.schedule_complete_message
     }
@@ -684,7 +684,7 @@ const De = ({
       /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: o.schedule_month_heading }),
       /* @__PURE__ */ e(i, { bold: !0, variant: "caption", children: o.schedule_amount_heading })
     ] }),
-    t.dataset.slice(1).map(({ x: d, y: c, payment: b }) => /* @__PURE__ */ e(y, { bgcolor: r.palette.background.paper, children: /* @__PURE__ */ e(y, { alignItems: "center", flexDirection: "row", pl: 24, children: /* @__PURE__ */ l(
+    t.dataset.slice(1).map(({ x: d, y: c, payment: m }) => /* @__PURE__ */ e(y, { bgcolor: r.palette.background.paper, children: /* @__PURE__ */ e(y, { alignItems: "center", flexDirection: "row", pl: 24, children: /* @__PURE__ */ l(
       y,
       {
         sx: {
@@ -708,7 +708,7 @@ const De = ({
                 color: r.palette.success.main,
                 textAlign: "end",
                 variant: "tiny",
-                children: `+${I(b, "0,0")}`
+                children: `+${I(m, "0,0")}`
               }
             )
           ] })
@@ -735,7 +735,7 @@ const De = ({
 }, vt = C(Ct), Dt = C(({ debt: r }) => {
   const { debts: n } = w(), { updateAccount: o } = te(), { onEvent: t } = k(), [a, s] = f.useState(r.interest_rate ?? 0), d = a < 0, c = async () => {
     await o({ ...r.account, interest_rate: a }), r.interest_rate = a, t(S.DEBTS_SAVE_RATE_ACTION, { account_guid: r.guid });
-  }, b = () => {
+  }, m = () => {
     setTimeout(() => {
       s(r.interest_rate ?? 0);
     }, 250);
@@ -745,7 +745,7 @@ const De = ({
     {
       isSaveDisabled: d,
       label: `${n.details_interest_rate} (%)`,
-      onCancel: b,
+      onCancel: m,
       onSave: c,
       primaryText: n.details_interest_rate,
       secondaryText: We(Number(r.interest_rate) / 100),
@@ -755,7 +755,7 @@ const De = ({
         {
           error: d,
           fullWidth: !0,
-          onChange: (u) => s(isNaN(parseFloat(u.target.value)) ? 0 : parseFloat(u.target.value)),
+          onChange: (h) => s(isNaN(parseFloat(h.target.value)) ? 0 : parseFloat(h.target.value)),
           type: "number",
           value: a
         }
@@ -765,7 +765,7 @@ const De = ({
 }), St = C(({ debt: r }) => {
   const { debts: n } = w(), { updateAccount: o } = te(), { onEvent: t } = k(), [a, s] = f.useState(r.monthly_payment ?? 0), d = a < 0 || a > 9999999999e-2, c = async () => {
     await o({ ...r.account, minimum_payment: a }), r.monthly_payment = a, t(S.DEBTS_SAVE_PAYMENT_ACTION, { account_guid: r.guid });
-  }, b = () => {
+  }, m = () => {
     setTimeout(() => {
       s(r.monthly_payment ?? 0);
     }, 250);
@@ -775,7 +775,7 @@ const De = ({
     {
       isSaveDisabled: d,
       label: n.details_monthly_payment,
-      onCancel: b,
+      onCancel: m,
       onSave: c,
       primaryText: n.details_monthly_payment,
       secondaryText: I(r.monthly_payment, "0,0"),
@@ -788,7 +788,7 @@ const De = ({
           error: d,
           fullWidth: !0,
           minAmount: 0,
-          setAmount: (u) => s(isNaN(Number(u)) ? a : Number(u)),
+          setAmount: (h) => s(isNaN(Number(h)) ? a : Number(h)),
           sx: { ".MuiTypography-body1": { p: 0 } }
         }
       )
@@ -797,7 +797,7 @@ const De = ({
 }), At = C(({ debt: r }) => {
   const { debts: n } = w(), { updateAccount: o } = te(), { onEvent: t } = k(), [a, s] = f.useState(r.original_balance ?? 0), d = a < 0 || a > 9999999999e-2, c = async () => {
     await o({ ...r.account, original_balance: a }), r.original_balance = a, t(S.DEBTS_SAVE_BALANCE_ACTION, { account_guid: r.guid });
-  }, b = () => {
+  }, m = () => {
     setTimeout(() => {
       s(r.original_balance ?? 0);
     }, 250);
@@ -807,7 +807,7 @@ const De = ({
     {
       isSaveDisabled: d,
       label: n.details_original_balance,
-      onCancel: b,
+      onCancel: m,
       onSave: c,
       primaryText: n.details_original_balance,
       secondaryText: I(r.original_balance, "0,0"),
@@ -820,7 +820,7 @@ const De = ({
           error: d,
           fullWidth: !0,
           minAmount: 0,
-          setAmount: (u) => s(isNaN(Number(u)) ? a : Number(u)),
+          setAmount: (h) => s(isNaN(Number(h)) ? a : Number(h)),
           sx: { ".MuiTypography-body1": { p: 0 } }
         }
       )
@@ -852,7 +852,7 @@ const De = ({
     t && r(1);
   }, [t]), !t && !a ? /* @__PURE__ */ e(R, {}) : /* @__PURE__ */ l(y, { gap: 16, children: [
     /* @__PURE__ */ e(ye, { sx: { my: 16, mx: 24, ...n }, children: /* @__PURE__ */ l(
-      be,
+      me,
       {
         icon: t ? /* @__PURE__ */ e(rt, { filled: !0 }) : /* @__PURE__ */ e(Ce, { color: "success", filled: !0 }),
         severity: "error",
@@ -868,12 +868,12 @@ const De = ({
         },
         children: [
           /* @__PURE__ */ e(_e, { sx: { fontWeight: 600, marginTop: 2 }, variant: "body1", children: t ? o.status_error_title : o.status_complete_title }),
-          /* @__PURE__ */ e(i, { component: "p", sx: { whiteSpace: "wrap" }, variant: "subtitle2", children: t ? o.status_error_description : o.status_complete_description })
+          /* @__PURE__ */ e(i, { component: "p", variant: "subtitle2", children: t ? o.status_error_description : o.status_complete_description })
         ]
       }
     ) }),
     t && /* @__PURE__ */ e(ye, { sx: { mb: 16, mt: 100, mx: 24, ...n }, children: /* @__PURE__ */ l(
-      be,
+      me,
       {
         icon: /* @__PURE__ */ e(R, {}),
         severity: "error",
@@ -886,7 +886,7 @@ const De = ({
         },
         children: [
           /* @__PURE__ */ e(_e, { sx: { fontWeight: 600, marginTop: 2 }, variant: "body1", children: o.status_info_title }),
-          /* @__PURE__ */ e(i, { component: "p", sx: { whiteSpace: "wrap" }, variant: "subtitle2", children: o.status_info_description })
+          /* @__PURE__ */ e(i, { component: "p", variant: "subtitle2", children: o.status_info_description })
         ]
       }
     ) })
@@ -906,7 +906,7 @@ const De = ({
         variant: "fullWidth",
         children: [
           /* @__PURE__ */ e(
-            me,
+            be,
             {
               "aria-controls": "debt-schedule-tabpanel-0",
               id: "debt-schedule-tab-0",
@@ -914,7 +914,7 @@ const De = ({
             }
           ),
           /* @__PURE__ */ e(
-            me,
+            be,
             {
               "aria-controls": "debt-details-tabpanel-1",
               id: "debt-details-tab-1",
@@ -947,7 +947,7 @@ const De = ({
     n && (await o({ ...n, extra_payment: a }), n.extra_payment = a, t(S.DEBTS_SAVE_PAYDOWN_ACTION, {
       user_guid: n?.user_guid
     }));
-  }, b = () => {
+  }, m = () => {
     setTimeout(() => {
       s(n?.extra_payment ?? 0);
     }, 250);
@@ -957,7 +957,7 @@ const De = ({
     {
       isSaveDisabled: d,
       label: r.paydown_drawer_extra_payment,
-      onCancel: b,
+      onCancel: m,
       onSave: c,
       primaryText: r.paydown_drawer_extra_payment,
       secondaryText: I(n?.extra_payment, "0,0"),
@@ -970,7 +970,7 @@ const De = ({
           error: d,
           fullWidth: !0,
           minAmount: 0,
-          setAmount: (u) => s(isNaN(Number(u)) ? a : Number(u)),
+          setAmount: (h) => s(isNaN(Number(h)) ? a : Number(h)),
           sx: { ".MuiTypography-body1": { p: 0 } }
         }
       )
@@ -1067,12 +1067,12 @@ const Wt = (r) => {
   onHoverRow: t,
   onClickRow: a
 }) => {
-  const s = j(), { onEvent: d } = k(), { isMobile: c } = ae(), { debts: b, common: u } = w(), [m, v] = f.useState([
+  const s = j(), { onEvent: d } = k(), { isMobile: c } = ae(), { debts: m, common: h } = w(), [b, v] = f.useState([
     { field: "priority", sort: "asc" }
   ]), x = [
     {
       field: "priority",
-      headerName: b.table_column_priority,
+      headerName: m.table_column_priority,
       renderHeader: H,
       renderCell: Gt,
       sortComparator: $t,
@@ -1086,7 +1086,7 @@ const Wt = (r) => {
     },
     {
       field: "account",
-      headerName: b.table_column_account,
+      headerName: m.table_column_account,
       renderHeader: H,
       renderCell: Ht,
       sortable: !1,
@@ -1098,7 +1098,7 @@ const Wt = (r) => {
     },
     {
       field: "balance",
-      headerName: b.table_column_balance,
+      headerName: m.table_column_balance,
       renderHeader: H,
       renderCell: (_) => /* @__PURE__ */ e(i, { color: s.palette.text.primary, variant: "body2", children: I(_.value, "0,0") }),
       sortable: !0,
@@ -1111,7 +1111,7 @@ const Wt = (r) => {
     },
     {
       field: "interest_rate",
-      headerName: b.table_column_interest_rate,
+      headerName: m.table_column_interest_rate,
       renderHeader: H,
       renderCell: (_) => /* @__PURE__ */ e(i, { color: s.palette.text.primary, variant: "body2", children: isNaN(_.value) ? "---" : `${Number(_.value).toFixed(2)}%` }),
       sortable: !0,
@@ -1124,7 +1124,7 @@ const Wt = (r) => {
     },
     {
       field: "projected_payoff_date",
-      headerName: b.table_column_payoff_date,
+      headerName: m.table_column_payoff_date,
       renderHeader: H,
       renderCell: (_) => /* @__PURE__ */ e(i, { color: s.palette.text.primary, variant: "body2", children: _.value ? J(_.value, Q.MONTH_SHORT_YEAR) : "---" }),
       sortable: !0,
@@ -1137,7 +1137,7 @@ const Wt = (r) => {
     },
     {
       field: "monthly_payment",
-      headerName: b.table_column_amount_due,
+      headerName: m.table_column_amount_due,
       renderHeader: H,
       renderCell: (_) => /* @__PURE__ */ e(i, { color: s.palette.text.primary, variant: "body2", children: typeof _.value == "number" ? I(_.value, "0,0") : "---" }),
       sortable: !0,
@@ -1154,7 +1154,7 @@ const Wt = (r) => {
       field: "chevron",
       headerClassName: "chevron-header",
       headerName: "",
-      renderCell: () => /* @__PURE__ */ e(h, { "aria-label": u.see_details, role: "button", children: /* @__PURE__ */ e(ne, { name: "chevron_right" }) }),
+      renderCell: () => /* @__PURE__ */ e(u, { "aria-label": h.see_details, role: "button", children: /* @__PURE__ */ e(ne, { name: "chevron_right" }) }),
       sortable: !1,
       hideSortIcons: !0,
       type: "custom",
@@ -1193,7 +1193,7 @@ const Wt = (r) => {
           disableColumnFilter: !0,
           disableColumnMenu: !0,
           hideFooter: !0,
-          initialState: { sorting: { sortModel: m } },
+          initialState: { sorting: { sortModel: b } },
           onRowClick: (_) => {
             a(), d(S.DEBTS_CLICK_TABLE_ROW, { account_guid: _.row.guid });
           },
@@ -1210,7 +1210,7 @@ const Wt = (r) => {
               onClick: c ? E : void 0
             }
           },
-          sortModel: m,
+          sortModel: b,
           sortingOrder: ["asc", "desc"],
           sx: {
             "& .chevron-header": { display: "none" },
@@ -1274,8 +1274,8 @@ const Wt = (r) => {
       priority: F.HIGHEST_BALANCE,
       text: t.priority_sort_highest_balance
     }
-  ], b = (u) => {
-    s(u), o(S.DEBTS_CLICK_PRIORITY, { debts_priority: u });
+  ], m = (h) => {
+    s(h), o(S.DEBTS_CLICK_PRIORITY, { debts_priority: h });
   };
   return /* @__PURE__ */ e(
     lt,
@@ -1292,13 +1292,13 @@ const Wt = (r) => {
         vertical: "top",
         horizontal: "left"
       },
-      children: /* @__PURE__ */ e(we, { children: c.map(({ priority: u, text: m }) => /* @__PURE__ */ l(
+      children: /* @__PURE__ */ e(we, { children: c.map(({ priority: h, text: b }) => /* @__PURE__ */ l(
         it,
         {
-          onClick: () => b(u),
+          onClick: () => m(h),
           sx: {
-            bgcolor: a === u ? "primary.main" : void 0,
-            color: a === u ? "#fff" : void 0,
+            bgcolor: a === h ? "primary.main" : void 0,
+            color: a === h ? "#fff" : void 0,
             justifyContent: "space-between",
             minHeight: 44,
             minWidth: 268,
@@ -1311,37 +1311,37 @@ const Wt = (r) => {
             }
           },
           children: [
-            /* @__PURE__ */ e(i, { color: "inherit", variant: "body2", children: m }),
-            a === u && /* @__PURE__ */ e(Ce, { color: "inherit", filled: !0, fontSize: "small" })
+            /* @__PURE__ */ e(i, { color: "inherit", variant: "body2", children: b }),
+            a === h && /* @__PURE__ */ e(Ce, { color: "inherit", filled: !0, fontSize: "small" })
           ]
         },
-        u
+        h
       )) })
     }
   );
 }), Yt = C(({ disabled: r, isDesktop: n }) => {
   const { onEvent: o } = k(), { debts: t } = w(), { selectedDebtPriority: a } = P(), [s, d] = f.useState(null), c = (v) => {
     d(v.currentTarget), o(S.DEBTS_CLICK_PRIORITIZE);
-  }, b = () => {
+  }, m = () => {
     d(null);
-  }, u = !!s, m = f.useMemo(() => ({
+  }, h = !!s, b = f.useMemo(() => ({
     [F.FASTEST_PAYOFF_FIRST]: t.priority_sort_fastest_payoff,
     [F.HIGHEST_INTEREST]: t.priority_sort_highest_interest,
     [F.HIGHEST_BALANCE]: t.priority_sort_highest_balance,
     [F.LOWEST_BALANCE]: t.priority_sort_lowest_balance
   })[a] ?? t.priority_sort_lowest_balance, [a]);
-  return /* @__PURE__ */ l(h, { children: [
+  return /* @__PURE__ */ l(u, { children: [
     /* @__PURE__ */ e(
       jt,
       {
-        buttonText: m,
+        buttonText: b,
         disabled: r,
         isDesktop: n,
-        isOpen: u,
+        isOpen: h,
         onClick: c
       }
     ),
-    /* @__PURE__ */ e(Vt, { buttonEl: s, onClose: b })
+    /* @__PURE__ */ e(Vt, { buttonEl: s, onClose: m })
   ] });
 }), Kt = C(({ disabled: r, onClick: n }) => {
   const { debts: o } = w(), { totalMonthlyPayments: t } = ee(), { monthlyCashFlowProfile: a } = V(), s = t + Number(a?.extra_payment), d = o.paydown_button_long;
@@ -1360,8 +1360,8 @@ const Wt = (r) => {
   ) });
 }), Ut = ({ onBackClick: r, onMenuClick: n, sx: o }) => {
   const { isDesktop: t, isMobile: a } = ae(), { connect: s, debts: d } = w(), { onEvent: c } = k(), {
-    config: { show_connections_widget_in_master: b }
-  } = He(), { isInitialized: u } = ze(), { setSelectedAccount: m } = Ve(), { selectedDebtPriority: v, setSelectedDebtChartData: x } = P(), {
+    config: { show_connections_widget_in_master: m }
+  } = He(), { isInitialized: h } = ze(), { setSelectedAccount: b } = Ve(), { selectedDebtPriority: v, setSelectedDebtChartData: x } = P(), {
     isAccountDataLoaded: $,
     loadAccountData: L,
     detailedAccounts: N,
@@ -1378,21 +1378,21 @@ const Wt = (r) => {
   f.useEffect(() => {
     $ || L().finally(), c(S.DEBTS_VIEW);
   }, []), f.useEffect(() => {
-    u && Y().finally();
-  }, [u]);
-  const pe = (O) => Se(O), he = () => {
-    const O = A.find((oe) => oe.guid === U), ue = q.find((oe) => oe.guid === U);
-    O && m(O), ue && x(ue), D(!0);
+    h && Y().finally();
+  }, [h]);
+  const pe = (O) => Se(O), ue = () => {
+    const O = A.find((oe) => oe.guid === U), he = q.find((oe) => oe.guid === U);
+    O && b(O), he && x(he), D(!0);
   }, Te = () => c(S.DEBTS_CLICK_FILTER), Ee = () => {
     ce(!0), c(S.DEBTS_CLICK_SNOWBALL_CTA);
   }, Ie = () => {
     B(!0), c(S.DEBTS_CLICK_PAYDOWN);
   };
-  if (!u || !E)
+  if (!h || !E)
     return /* @__PURE__ */ e(ct, {});
   const Me = N.length === 0, ke = A.length === 0, Ne = p.length === 0, X = Me || ke || Ne, Z = Oe(
     d,
-    b,
+    m,
     () => de(!0)
   );
   return /* @__PURE__ */ l(
@@ -1442,13 +1442,13 @@ const Wt = (r) => {
                       debts: q,
                       height: a ? 250 : void 0,
                       hoveredDebtGuid: U,
-                      onClickArea: he,
+                      onClickArea: ue,
                       onHoverArea: pe,
                       sx: { mr: a ? "4px" : "-48px" }
                     }
                   ),
                   /* @__PURE__ */ e(
-                    bt,
+                    mt,
                     {
                       debts: q,
                       onClickCta: Ee,
@@ -1463,7 +1463,7 @@ const Wt = (r) => {
               {
                 debts: q,
                 hoveredDebtGuid: U,
-                onClickRow: he,
+                onClickRow: ue,
                 onHoverRow: pe
               }
             ) })
@@ -1479,7 +1479,7 @@ const Wt = (r) => {
         /* @__PURE__ */ e(Bt, { isOpen: g, onClose: () => D(!1) }),
         /* @__PURE__ */ e(Ft, { isOpen: M, onClose: () => B(!1) }),
         /* @__PURE__ */ e(
-          ht,
+          ut,
           {
             onClose: () => de(!1),
             showConnectWidget: Ae,