@mx-cartographer/experiences 7.2.9-alpha.san4 → 7.2.10

package/dist/finstrong/index.es.js

@@ -1,172 +1,280 @@
-import { jsxs as a, Fragment as z, jsx as e } from "react/jsx-runtime";
-import C from "@mui/material/Box";
-import u from "@mui/material/Stack";
-import { useTheme as E, alpha as _e } from "@mui/material/styles";
-import { PieChart as Vt, BarPlot as Yt } from "@mui/x-charts";
-import { TrendingUp as dt, ArrowRightAlt as Xt, TrendingDown as Ut, AccountBalance as pt, ChevronRight as Z, MultilineChart as ut, CreditCard as Ee, CheckCircle as qt, Cancel as Zt, Savings as Qt, ContentCopy as Jt, Add as _t, Cardiology as en, Payments as tn, CalendarMonth as nn, ExpandMore as on } from "@mxenabled/mx-icons";
-import { P as M, H3 as K, Text as A, InstitutionLogo as ht, H2 as Ie, MerchantLogo as rn, Icon as an } from "@mxenabled/mxui";
-import { g as sn, a as cn, r as Qe, b as ln, c as Ge, d as mt, C as be, e as fe, f as dn, h as pn, i as un, j as gt, k as Je, l as _n, m as et, n as hn, o as yt, p as mn, q as bt, s as ke, t as gn, u as yn, v as bn, w as fn, A as ee, x as xn, P as Sn } from "../FinstrongStore-rVhw737g.mjs";
-import { y as yi, F as bi } from "../FinstrongStore-rVhw737g.mjs";
-import * as tt from "d3";
-import { observer as S } from "mobx-react-lite";
-import { u as v, b as V, p as Q, z as R, q as Cn, a as ft, d as Se, m as He, g as vn, f as wn, j as kn, h as Mn, i as xt } from "../hooks-C41HAxM5.mjs";
-import { L as J } from "../Loader-DUaFpDGv.mjs";
-import h from "react";
-import $ from "@mui/material/Button";
-import j from "@mui/material/Card";
-import { L as Ne } from "../LineChart-Ct9DNmhS.mjs";
-import { C as St } from "../ConnectionsDrawer-Cd_rztVC.mjs";
-import { l as oe, g as Ct, A as We } from "../ConnectDrawer-FyY0AWYQ.mjs";
-import ae from "@mui/material/Tab";
-import Ke from "@mui/material/Tabs";
-import Me from "@mui/material/TextField";
-import { u as je } from "../useScreenSize-B6JyS_Lj.mjs";
-import { D as Dn, f as An, a as In } from "../Dialog-BPTr3qHE.mjs";
-import { u as vt } from "../useDimensions-27p2evRx.mjs";
-import Tn from "@mui/material/Chip";
-import { D as te } from "../Drawer-BEtCk82g.mjs";
-import ne from "@mui/material/Divider";
-import pe from "@mui/material/ListItem";
-import wt from "@mui/material/ListItemAvatar";
-import ue from "@mui/material/ListItemText";
-import { g as kt } from "../AccountFields-CLbLAhLf.mjs";
-import De from "@mui/material/List";
-import On from "@mui/material/ListItemButton";
-import Rn from "@mui/material/ListSubheader";
-import { f as B } from "../NumberFormatting-Buh7u8Oi.mjs";
-import { S as nt, F as Fn } from "../RecurringTransactions-CngsRZ3K.mjs";
-import { Button as Pn } from "@mui/material";
-import { S as Bn } from "../StatusBar-BK_uYHAB.mjs";
-import { h as Ve } from "../DateUtil-CBdcsyuk.mjs";
-import { useVirtualizer as Ln } from "@tanstack/react-virtual";
-import { u as $n, s as ze, h as Mt, S as Dt, b as At, Z as Wn } from "../TransactionDetails-CJvE4LNC.mjs";
-import { A as zn, W as En } from "../WidgetContainer-GoNq8wwm.mjs";
-import { T as ie } from "../TabContentContainer-j01JYR_7.mjs";
-import { b as X } from "../Localization-2MODESHW.mjs";
-import { E as Ae } from "../EmptyState-DA_lfRBv.mjs";
-import Gn from "@mui/material/useMediaQuery";
-import { ChartsXAxis as Hn } from "@mui/x-charts/ChartsXAxis";
-import { ChartsYAxis as Nn } from "@mui/x-charts/ChartsYAxis";
-import { ResponsiveChartContainer as Kn } from "@mui/x-charts/ResponsiveChartContainer";
-import { useSpring as jn, animated as ot } from "@react-spring/web";
-import { startOfMonth as It } from "date-fns/startOfMonth";
-import { endOfMonth as Tt } from "date-fns/endOfMonth";
-import { g as Vn, S as Yn, b as Xn } from "../SpendingLegend-squvjEhu.mjs";
-import { startOfToday as rt } from "date-fns/startOfToday";
-import { subDays as Un } from "date-fns/subDays";
-import { c as qn, d as at, S as Zn, i as Qn } from "../ManageIncome-DB_lKOIy.mjs";
-import { LocalizationProvider as Jn, DatePicker as eo, StaticDatePicker as to } from "@mui/x-date-pickers";
-import { AdapterDateFns as Ot } from "@mui/x-date-pickers/AdapterDateFnsV3";
-import { R as no } from "../RecurringSettings-dJJxtLyU.mjs";
-import { LocalizationProvider as oo } from "@mui/x-date-pickers/LocalizationProvider";
-import { format as ro } from "date-fns/format";
-import ao from "@mui/lab/Timeline";
-import io, { timelineItemClasses as so } from "@mui/lab/TimelineItem";
-import co from "@mui/lab/TimelineConnector";
-import lo from "@mui/lab/TimelineContent";
-import po from "@mui/lab/TimelineDot";
-import uo from "@mui/lab/TimelineSeparator";
-import _o from "@mui/material/Accordion";
-import ho from "@mui/material/AccordionDetails";
-import mo from "@mui/material/AccordionSummary";
-import go from "@mui/material/CardHeader";
-const yo = ({
-  dialScoreData: t,
+import { jsx as e, jsxs as u, Fragment as re } from "react/jsx-runtime";
+import x from "@mui/material/Box";
+import g from "@mui/material/Stack";
+import { useTheme as G, alpha as te } from "@mui/material/styles";
+import { PieChart as Oe } from "@mui/x-charts";
+import { ChevronRight as j, Check as De, TrendingUp as Me, ArrowRightAlt as Te, TrendingDown as we, AccountBalance as me, ExpandMore as Re, Payments as Fe, CalendarMonth as Pe, CreditCard as ue, Savings as Ge, ContentCopy as Le, MultilineChart as Ee } from "@mxenabled/mx-icons";
+import { Text as W, P as y, H3 as H, Icon as he } from "@mxenabled/mxui";
+import { format as _e } from "date-fns/format";
+import C from "react";
+import We from "@mui/material/Avatar";
+import ge from "@mui/material/Divider";
+import Be from "@mui/material/List";
+import He from "@mui/material/ListItem";
+import ze from "@mui/material/ListItemAvatar";
+import $e from "@mui/material/ListItemButton";
+import Ne from "@mui/material/ListItemText";
+import { b } from "../Localization-2MODESHW.mjs";
+import * as ce from "d3";
+import { observer as I } from "mobx-react-lite";
+import { u as S, b as z, x as $, p as Y, d as fe, i as ye, m as Ke } from "../hooks-D6XlXHf4.mjs";
+import { L as N } from "../Loader-DUaFpDGv.mjs";
+import { F as No, a as Ko } from "../FinstrongStore-F2c607dj.mjs";
+import q from "@mui/material/Button";
+import J from "@mui/material/Card";
+import { L as be } from "../LineChart-D4GI7nVh.mjs";
+import { l as xe } from "../ConnectDrawer-DaFRU5st.mjs";
+import Xe from "@mui/material/Accordion";
+import je from "@mui/material/AccordionDetails";
+import Ue from "@mui/material/AccordionSummary";
+import Ve from "@mui/material/CardHeader";
+import { u as Ye } from "../useDimensions-27p2evRx.mjs";
+import { C as qe } from "../ConnectionsDrawer-DHJ7qdWL.mjs";
+import { R as Je } from "../RecurringSettings-C28GrQcP.mjs";
+import Qe from "@mui/material/TextField";
+import { u as Ce } from "../useScreenSize-B6JyS_Lj.mjs";
+import { a as Ze } from "../Dialog-CWW597AF.mjs";
+import { AdapterDateFns as et } from "@mui/x-date-pickers/AdapterDateFnsV3";
+import { StaticDatePicker as tt } from "@mui/x-date-pickers";
+import { LocalizationProvider as ot } from "@mui/x-date-pickers/LocalizationProvider";
+import { D as V } from "../Drawer-kEE73B87.mjs";
+import oe from "@mui/material/Tab";
+import nt from "@mui/material/Tabs";
+import { f as rt } from "../NumberFormatting-Buh7u8Oi.mjs";
+import { T as ne } from "../TabContentContainer-j01JYR_7.mjs";
+import it from "@mui/lab/Timeline";
+import st, { timelineItemClasses as at } from "@mui/lab/TimelineItem";
+import ct from "@mui/lab/TimelineConnector";
+import lt from "@mui/lab/TimelineContent";
+import dt from "@mui/lab/TimelineDot";
+import pt from "@mui/lab/TimelineSeparator";
+import { W as mt } from "../WidgetContainer-C88Ecu2W.mjs";
+var A = /* @__PURE__ */ ((n) => (n.Connections = "connections", n.CreditScore = "credit_score", n.DateOfBirth = "date_of_birth", n.MonthlyIncome = "monthly_income", n))(A || {});
+const ut = ({ list: n, onClickItem: o }) => /* @__PURE__ */ e(x, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(
+  Be,
+  {
+    sx: {
+      "& .MuiListItemSecondaryAction-root": {
+        color: "text.primary",
+        pr: 24
+      }
+    },
+    children: n.map((t, i) => /* @__PURE__ */ u(C.Fragment, { children: [
+      /* @__PURE__ */ e(He, { secondaryAction: /* @__PURE__ */ e(j, {}), children: /* @__PURE__ */ u($e, { onClick: () => o(t.key), children: [
+        /* @__PURE__ */ e(ze, { children: /* @__PURE__ */ e(
+          We,
+          {
+            sx: {
+              bgcolor: "primary.main",
+              ...!t.isComplete && {
+                bgcolor: "transparent",
+                borderColor: "action.active",
+                borderStyle: "solid",
+                borderWidth: 1,
+                color: "action.active"
+              }
+            },
+            children: t.icon
+          }
+        ) }),
+        /* @__PURE__ */ e(
+          Ne,
+          {
+            primary: /* @__PURE__ */ e(W, { sx: { color: "text.secondary" }, variant: "caption", children: t.primaryText }),
+            secondary: /* @__PURE__ */ e(W, { sx: { color: "text.primary", fontWeight: 600 }, variant: "body1", children: t.secondaryText })
+          }
+        )
+      ] }) }),
+      i < n.length - 1 && /* @__PURE__ */ e(ge, { sx: { color: "divider", ml: 68 } })
+    ] }, t.key))
+  }
+) }), ht = ut, le = (n) => n * (180 / Math.PI), ie = (n, o) => [
+  {
+    description: o.vulnerable_description,
+    max: 25,
+    scoreContent: o.accordion_details_text.vulnerable,
+    status: o.vulnerable
+  },
+  {
+    description: o.building_description,
+    max: 50,
+    scoreContent: o.accordion_details_text.building,
+    status: o.building
+  },
+  {
+    description: o.stable_description,
+    max: 75,
+    scoreContent: o.accordion_details_text.stable,
+    status: o.stable
+  },
+  {
+    description: o.strong_description,
+    max: 100,
+    scoreContent: o.accordion_details_text.strong,
+    status: o.strong
+  }
+].find((d) => n > 0 && n <= d.max) || { status: o.insufficient_data, description: "", scoreContent: "" }, D = {
+  POOR: "#8C0E0E",
+  FAIR: "#E32727",
+  GOOD: "#FFB70D",
+  VERY_GOOD: "#0EA26C",
+  EXCEPTIONAL: "#005C3D"
+}, M = {
+  POOR: "#B21C1C",
+  FAIR: "#FF3232",
+  GOOD: "#FFC02C",
+  VERY_GOOD: "#29C76B",
+  EXCEPTIONAL: "#008A5A"
+}, _t = (n, o, t) => n >= 300 && n < 580 ? {
+  status: t.poor,
+  color: o ? M.POOR : D.POOR
+} : n >= 580 && n < 670 ? {
+  status: t.fair,
+  color: o ? M.FAIR : D.FAIR
+} : n >= 670 && n < 740 ? {
+  status: t.good,
+  color: o ? M.GOOD : D.GOOD
+} : n >= 740 && n < 800 ? {
+  status: t.very_good,
+  color: o ? M.VERY_GOOD : D.VERY_GOOD
+} : n >= 800 && n <= 850 ? {
+  status: t.exceptional,
+  color: o ? M.EXCEPTIONAL : D.EXCEPTIONAL
+} : { status: t.missing_data }, gt = (n, o, t, i) => {
+  const d = n.reduce((r, a) => r + a.value, 0);
+  let l = 0;
+  const s = n.map((r) => {
+    const a = r.value / d * o, c = t + l, p = c + a;
+    return l += a, {
+      ...r,
+      startAngle: c,
+      endAngle: p
+    };
+  });
+  return [s[i].startAngle, s[i].endAngle];
+}, ft = (n, o, t, i, d) => {
+  let l = 0, s = 0;
+  const r = Math.floor(i), a = i - r;
+  return r > t ? (l = n, s = o) : r === t && a > 0 && (l = n, s = d), [l, s];
+}, yt = (n, o, t = 0) => {
+  const i = n * Math.sin(o - t), d = -n * Math.cos(o - t);
+  return [i, d];
+}, bt = ({
+  dynamicCopy: n,
+  fallbackLabel: o,
+  icon: t,
+  key: i,
+  label: d,
+  value: l
+}) => {
+  const s = !!l, r = s ? xt(i, l) : n && b(n, o) || o;
+  return {
+    icon: s ? /* @__PURE__ */ e(De, {}) : t,
+    isComplete: s,
+    key: i,
+    primaryText: d,
+    secondaryText: r
+  };
+}, xt = (n, o) => ({
+  [A.DateOfBirth]: (i) => _e(new Date(Number(i) * 1e3), "MMM d, yyyy"),
+  [A.MonthlyIncome]: (i) => `$${i}`
+})[n]?.(o) ?? String(o), de = (n) => n !== null ? Math.round(n * 100) : null, Ct = ({
+  dialScoreData: n,
   dataIndex: o,
-  arcColor: n,
-  arcStartAngle: r,
-  totalAngularSpan: l,
-  centerX: s,
-  centerY: i,
-  arcRadius: d,
-  innerArcRadius: c,
-  outterArcRadius: p,
-  progressEndAngle: _,
-  unitsPerSegment: m,
-  isFinacialStrengthGraph: g
+  arcColor: t,
+  arcStartAngle: i,
+  totalAngularSpan: d,
+  centerX: l,
+  centerY: s,
+  arcRadius: r,
+  innerArcRadius: a,
+  outterArcRadius: c,
+  progressEndAngle: p,
+  unitsPerSegment: h,
+  isFinacialStrengthGraph: m
 }) => {
-  const b = E(), w = [
-    { offset: "13.62%", color: b.palette.chartMono.chartMono2 },
-    { offset: "36.67%", color: b.palette.chartMono.chartMono3 },
-    { offset: "59.72%", color: b.palette.chartMono.chartMono4 },
-    { offset: "83.46%", color: b.palette.chartMono.chartMono5 }
-  ], [f, x] = sn(
-    t,
-    l,
-    r,
+  const _ = G(), R = [
+    { offset: "13.62%", color: _.palette.chartMono.chartMono2 },
+    { offset: "36.67%", color: _.palette.chartMono.chartMono3 },
+    { offset: "59.72%", color: _.palette.chartMono.chartMono4 },
+    { offset: "83.46%", color: _.palette.chartMono.chartMono5 }
+  ], [T, v] = gt(
+    n,
+    d,
+    i,
     o
-  ), [y, k] = cn(
-    f,
-    x,
+  ), [L, E] = ft(
+    T,
+    v,
     o,
-    m,
-    _
-  ), D = tt.arc().innerRadius(c).outerRadius(p).startAngle(f).endAngle(x).padAngle(0.02).cornerRadius(8), I = tt.arc().innerRadius(c).outerRadius(p).startAngle(y).endAngle(k).padAngle(0.02).cornerRadius(8);
-  return /* @__PURE__ */ a(z, { children: [
+    h,
+    p
+  ), K = ce.arc().innerRadius(a).outerRadius(c).startAngle(T).endAngle(v).padAngle(0.02).cornerRadius(8), F = ce.arc().innerRadius(a).outerRadius(c).startAngle(L).endAngle(E).padAngle(0.02).cornerRadius(8);
+  return /* @__PURE__ */ u(re, { children: [
     /* @__PURE__ */ e(
       "path",
       {
-        d: D({}),
-        fill: g ? b.palette.divider : n
+        d: K({}),
+        fill: m ? _.palette.divider : t
       }
     ),
-    g && /* @__PURE__ */ e("path", { d: I({}), fill: "url(#arcGradient)" }),
+    m && /* @__PURE__ */ e("path", { d: F({}), fill: "url(#arcGradient)" }),
     /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e(
       "linearGradient",
       {
-        gradientTransform: `rotate(5, ${s}, ${i})`,
+        gradientTransform: `rotate(5, ${l}, ${s})`,
         gradientUnits: "userSpaceOnUse",
         id: "arcGradient",
-        x1: s + d * 0.8 * Math.cos(Math.PI / 1.35),
-        x2: s - d * 0.8 * Math.cos(Math.PI / 1.35),
-        y1: i + d * 0.8 * Math.sin(Math.PI / 1.35),
-        y2: i - d * 0.8 * Math.sin(Math.PI / 1.35),
-        children: w.map((N, G) => /* @__PURE__ */ e("stop", { offset: N.offset, stopColor: N.color }, G))
+        x1: l + r * 0.8 * Math.cos(Math.PI / 1.35),
+        x2: l - r * 0.8 * Math.cos(Math.PI / 1.35),
+        y1: s + r * 0.8 * Math.sin(Math.PI / 1.35),
+        y2: s - r * 0.8 * Math.sin(Math.PI / 1.35),
+        children: R.map((w, O) => /* @__PURE__ */ e("stop", { offset: w.offset, stopColor: w.color }, O))
       }
     ) })
   ] });
-}, Rt = ({
-  arcRadius: t = 100,
+}, Se = ({
+  arcRadius: n = 100,
   healthScore: o,
-  size: n = "L",
-  dialScoreData: r,
-  minValue: l = 0,
-  maxValue: s = 100,
-  markerColor: i,
-  healthScoreStatus: d,
-  footerCenterContent: c,
-  footerLeftContent: p,
-  footerRightContent: _,
-  isFinacialStrengthGraph: m = !1
+  size: t = "L",
+  dialScoreData: i,
+  minValue: d = 0,
+  maxValue: l = 100,
+  markerColor: s,
+  healthScoreStatus: r,
+  footerCenterContent: a,
+  footerLeftContent: c,
+  footerRightContent: p,
+  isFinacialStrengthGraph: h = !1
 }) => {
-  const g = E(), b = -Math.PI / 1.35, w = Math.PI / 1.35, f = w - b, x = f / (s - l), y = (o - l) * x, k = b + y + 0.02, D = n !== "SM" ? 0.1 : 0.12, I = t, N = t * (1 - D), G = I * 2.5, H = G / 2, W = G / 2, ce = (N + I) / 2, Y = o !== 25 && o !== 50 && o !== 75 && o !== 100 ? 0 : 0.12, [re, le] = ln(ce, k, Y), ge = o / 25, U = {
+  const m = G(), _ = -Math.PI / 1.35, R = Math.PI / 1.35, T = R - _, v = T / (l - d), L = (o - d) * v, E = _ + L + 0.02, K = t !== "SM" ? 0.1 : 0.12, F = n, w = n * (1 - K), O = F * 2.5, k = O / 2, P = O / 2, U = (w + F) / 2, Z = o !== 25 && o !== 50 && o !== 75 && o !== 100 ? 0 : 0.12, [ee, ke] = yt(U, E, Z), Ae = o / 25, se = {
     L: { markerSize: 12, healthScoreFontSize: 64 },
     M: { markerSize: 10, healthScoreFontSize: 48 },
     SM: { markerSize: 3, healthScoreFontSize: 14 }
-  }, Pe = c === 0 ? Xt : Ut;
-  return /* @__PURE__ */ a(
-    u,
+  }, Ie = a === 0 ? Te : we;
+  return /* @__PURE__ */ u(
+    g,
     {
       sx: {
-        width: G,
-        height: G,
+        width: O,
+        height: O,
         position: "relative",
         alignSelf: "center"
       },
       children: [
         /* @__PURE__ */ e(
-          Vt,
+          Oe,
           {
-            height: G,
+            height: O,
             margin: { top: 0, right: 0, bottom: 0, left: 0 },
             series: [
               {
-                data: r,
-                innerRadius: N,
-                outerRadius: I,
-                startAngle: Math.round(Qe(b)),
+                data: i,
+                innerRadius: w,
+                outerRadius: F,
+                startAngle: Math.round(le(_)),
                 // Use Math.degrees to convert
-                endAngle: Math.round(Qe(w))
+                endAngle: Math.round(le(R))
                 // Use Math.degrees to convert
               }
             ],
@@ -175,22 +283,22 @@ const yo = ({
               legend: { hidden: !0 }
             },
             slots: {
-              pieArc: (Ce) => /* @__PURE__ */ e(
-                yo,
+              pieArc: (ae) => /* @__PURE__ */ e(
+                Ct,
                 {
-                  arcColor: Ce.color,
-                  arcRadius: t,
-                  arcStartAngle: b,
-                  centerX: H,
-                  centerY: W,
-                  dataIndex: Ce.dataIndex,
-                  dialScoreData: r,
-                  innerArcRadius: N,
-                  isFinacialStrengthGraph: m,
-                  outterArcRadius: I,
-                  progressEndAngle: k,
-                  totalAngularSpan: f,
-                  unitsPerSegment: ge
+                  arcColor: ae.color,
+                  arcRadius: n,
+                  arcStartAngle: _,
+                  centerX: k,
+                  centerY: P,
+                  dataIndex: ae.dataIndex,
+                  dialScoreData: i,
+                  innerArcRadius: w,
+                  isFinacialStrengthGraph: h,
+                  outterArcRadius: F,
+                  progressEndAngle: E,
+                  totalAngularSpan: T,
+                  unitsPerSegment: Ae
                 }
               )
             },
@@ -199,2886 +307,923 @@ const yo = ({
                 stroke: "none"
               }
             },
-            width: G,
-            children: o >= l && o <= s && /* @__PURE__ */ e(
+            width: O,
+            children: o >= d && o <= l && /* @__PURE__ */ e(
               "circle",
               {
-                cx: H + re,
-                cy: W + le,
-                fill: g.palette.common.white,
-                r: U[n].markerSize,
-                stroke: m ? "url(#arcGradient)" : i,
-                strokeWidth: n !== "SM" ? 3 : 1
+                cx: k + ee,
+                cy: P + ke,
+                fill: m.palette.common.white,
+                r: se[t].markerSize,
+                stroke: h ? "url(#arcGradient)" : s,
+                strokeWidth: t !== "SM" ? 3 : 1
               }
             )
           }
         ),
         /* @__PURE__ */ e(
-          C,
+          x,
           {
             sx: {
               position: "absolute",
-              top: `${W}px`,
-              left: `${H}px`,
+              top: `${P}px`,
+              left: `${k}px`,
               transform: "translate(-50%, -50%)",
               textAlign: "center"
             },
-            children: /* @__PURE__ */ a(
-              u,
+            children: /* @__PURE__ */ u(
+              g,
               {
                 spacing: 1,
-                sx: { alignItems: "center", justifyContent: "center", gap: n !== "M" ? 10 : 3 },
+                sx: { alignItems: "center", justifyContent: "center", gap: t !== "M" ? 10 : 3 },
                 children: [
                   /* @__PURE__ */ e(
-                    M,
+                    y,
                     {
                       sx: {
-                        fontSize: U[n].healthScoreFontSize,
-                        lineHeight: n !== "SM" ? "48px" : "100%"
+                        fontSize: se[t].healthScoreFontSize,
+                        lineHeight: t !== "SM" ? "48px" : "100%"
                       },
                       variant: "H1",
                       children: o
                     }
                   ),
-                  n !== "SM" && /* @__PURE__ */ e(M, { sx: { fontWeight: 600 }, variant: n === "L" ? "body1" : "body2", children: d })
+                  t !== "SM" && /* @__PURE__ */ e(y, { sx: { fontWeight: 600 }, variant: t === "L" ? "body1" : "body2", children: r })
                 ]
               }
             )
           }
         ),
-        c !== void 0 && /* @__PURE__ */ e(
-          C,
+        a !== void 0 && /* @__PURE__ */ e(
+          x,
           {
             sx: {
               position: "absolute",
-              top: `${W * 2 * 0.83}px`,
-              left: `${H}px`,
+              top: `${P * 2 * 0.83}px`,
+              left: `${k}px`,
               transform: "translate(-50%, -50%)",
               textAlign: "center"
             },
-            children: typeof c == "number" ? /* @__PURE__ */ a(u, { sx: { flexDirection: "row", alignItems: "center", gap: 4 }, children: [
-              c > 0 ? /* @__PURE__ */ e(dt, { size: 16, sx: { color: "success.main" } }) : /* @__PURE__ */ e(Pe, { size: 16, sx: { color: "text.secondary" } }),
+            children: typeof a == "number" ? /* @__PURE__ */ u(g, { sx: { flexDirection: "row", alignItems: "center", gap: 4 }, children: [
+              a > 0 ? /* @__PURE__ */ e(Me, { size: 16, sx: { color: "success.main" } }) : /* @__PURE__ */ e(Ie, { size: 16, sx: { color: "text.secondary" } }),
               /* @__PURE__ */ e(
-                M,
+                y,
                 {
                   sx: {
                     fontWeight: 600,
-                    color: c > 0 ? "success.main" : "text.secondary"
+                    color: a > 0 ? "success.main" : "text.secondary"
                   },
                   variant: "body1",
-                  children: c
+                  children: a
                 }
               )
-            ] }) : /* @__PURE__ */ e(M, { sx: { color: "text.secondary" }, variant: "subtitle2", children: c })
+            ] }) : /* @__PURE__ */ e(y, { sx: { color: "text.secondary" }, variant: "subtitle2", children: a })
           }
         ),
-        p !== void 0 && /* @__PURE__ */ e(
-          C,
+        c !== void 0 && /* @__PURE__ */ e(
+          x,
           {
             sx: {
               position: "absolute",
-              top: `${W * 2 * 0.83}px`,
-              left: `${H - H / 2}px`,
+              top: `${P * 2 * 0.83}px`,
+              left: `${k - k / 2}px`,
               // shift left from center
               transform: "translate(-50%, -50%)",
               textAlign: "left"
             },
-            children: /* @__PURE__ */ e(M, { variant: "body1", children: p })
+            children: /* @__PURE__ */ e(y, { variant: "body1", children: c })
           }
         ),
-        _ !== void 0 && /* @__PURE__ */ e(
-          C,
+        p !== void 0 && /* @__PURE__ */ e(
+          x,
           {
             sx: {
               position: "absolute",
-              top: `${W * 2 * 0.83}px`,
-              left: `${H + H / 2}px`,
+              top: `${P * 2 * 0.83}px`,
+              left: `${k + k / 2}px`,
               transform: "translate(-50%, -50%)",
               textAlign: "right"
             },
-            children: /* @__PURE__ */ e(M, { variant: "body1", children: _ })
+            children: /* @__PURE__ */ e(y, { variant: "body1", children: p })
           }
         )
       ]
     }
   );
-}, Ft = S(
-  ({ arcRadius: t, size: o = "L", healthScore: n, footerCenterContent: r }) => {
-    const l = [
+}, ve = I(
+  ({ arcRadius: n, size: o = "L", healthScore: t, footerCenterContent: i }) => {
+    const d = [
       { id: 1, label: "Group A", value: 25 },
       { id: 2, label: "Group B", value: 25 },
       { id: 3, label: "Group C", value: 25 },
       { id: 4, label: "Group D", value: 25 }
-    ], { finstrong: s } = v(), i = Ge(n, s);
+    ], { finstrong: l } = S(), s = ie(t, l);
     return /* @__PURE__ */ e(
-      Rt,
+      Se,
       {
-        arcRadius: t,
-        dialScoreData: l,
-        footerCenterContent: o === "L" ? s.footer_center_content_updated_just_now : r,
-        healthScore: n,
-        healthScoreStatus: i.status,
+        arcRadius: n,
+        dialScoreData: d,
+        footerCenterContent: o === "L" ? l.footer_center_content_updated_just_now : i,
+        healthScore: t,
+        healthScoreStatus: s.status,
         isFinacialStrengthGraph: !0,
         size: o
       }
     );
   }
-), bo = S(
+), Bo = I(
   ({
-    arcRadius: t,
+    arcRadius: n,
     size: o = "L",
-    healthScore: n,
-    maxValue: r = 850,
-    minValue: l = 300,
-    footerCenterContent: s
+    healthScore: t,
+    maxValue: i = 850,
+    minValue: d = 300,
+    footerCenterContent: l
   }) => {
-    const d = E().palette.mode === "dark", c = [
+    const r = G().palette.mode === "dark", a = [
       {
         id: 1,
         label: "Poor",
-        value: 29,
-        color: d ? be.POOR : fe.POOR
+        value: 279,
+        color: r ? M.POOR : D.POOR
       },
       {
         id: 2,
         label: "Fair",
-        value: 25,
-        color: d ? be.FAIR : fe.FAIR
+        value: 89,
+        color: r ? M.FAIR : D.FAIR
       },
       {
         id: 3,
         label: "Good",
-        value: 17,
-        color: d ? be.GOOD : fe.GOOD
+        value: 69,
+        color: r ? M.GOOD : D.GOOD
       },
       {
         id: 4,
         label: "Very Good",
-        value: 17,
-        color: d ? be.VERY_GOOD : fe.VERY_GOOD
+        value: 59,
+        color: r ? M.VERY_GOOD : D.VERY_GOOD
       },
       {
         id: 5,
         label: "Exceptional",
-        value: 12,
-        color: d ? be.EXCEPTIONAL : fe.EXCEPTIONAL
+        value: 50,
+        color: r ? M.EXCEPTIONAL : D.EXCEPTIONAL
       }
-    ], { finstrong: p } = v(), { isCopyLoaded: _ } = V();
-    if (!_) return /* @__PURE__ */ e(J, {});
-    const { status: m, color: g = "none" } = mt(
-      n,
-      d,
-      p.credit_score_status
+    ], { finstrong: c } = S(), { isCopyLoaded: p } = z();
+    if (!p) return /* @__PURE__ */ e(N, {});
+    const { status: h, color: m = "none" } = _t(
+      t,
+      r,
+      c.credit_score_status
     );
     return /* @__PURE__ */ e(
-      Rt,
+      Se,
       {
-        arcRadius: t,
-        dialScoreData: c,
-        footerCenterContent: s,
-        footerLeftContent: l,
-        footerRightContent: r,
-        healthScore: n,
-        healthScoreStatus: m,
-        markerColor: g,
-        maxValue: r,
-        minValue: l,
+        arcRadius: n,
+        dialScoreData: a,
+        footerCenterContent: l,
+        footerLeftContent: d,
+        footerRightContent: i,
+        healthScore: t,
+        healthScoreStatus: h,
+        markerColor: m,
+        maxValue: i,
+        minValue: d,
         size: o
       }
     );
   }
-), Te = ({
-  drawerType: t,
-  isDashboard: o = !1,
-  hasIcon: n = !0,
-  buttonText: r,
-  title: l,
-  titleDrawer: s,
-  description: i,
-  sx: d
+), Q = ({
+  isDashboard: n = !1,
+  hasIcon: o = !0,
+  buttonText: t,
+  title: i,
+  description: d,
+  sx: l
 }) => {
-  const [c, p] = h.useState(!1), { connect: _, finstrong: m } = v();
-  return t ? /* @__PURE__ */ a(
-    j,
+  const [s, r] = C.useState(!1), { connect: a, finstrong: c } = S();
+  return /* @__PURE__ */ u(
+    J,
     {
       sx: {
         pb: 24,
         pt: 18,
         px: 24,
         width: "100%",
-        ...d
+        ...l
       },
       children: [
-        /* @__PURE__ */ a(
-          u,
+        /* @__PURE__ */ u(
+          g,
           {
             sx: {
               gap: 8,
-              ...o && { flexDirection: "row", alignItems: "center" }
+              ...n && { flexDirection: "row", alignItems: "center" }
             },
             children: [
-              n && /* @__PURE__ */ e(pt, { sx: { height: 20, width: 20 } }),
-              /* @__PURE__ */ e(K, { className: "connect-more-accounts-title", sx: { ...o && { fontSize: 15 } }, children: l || m.connect_more_accounts_title })
+              o && /* @__PURE__ */ e(me, { sx: { height: 20, width: 20 } }),
+              /* @__PURE__ */ e(H, { className: "connect-more-accounts-title", sx: { ...n && { fontSize: 15 } }, children: i || c.connect_more_accounts_title })
             ]
           }
         ),
         /* @__PURE__ */ e(
-          M,
+          y,
           {
             className: "connect-more-accounts-description",
             sx: { color: "text.secondary", mt: 8 },
             variant: "subtitle1",
-            children: i || m.connect_more_accounts_description
+            children: d || c.connect_more_accounts_description
           }
         ),
         /* @__PURE__ */ e(
-          $,
+          q,
           {
-            endIcon: /* @__PURE__ */ e(Z, {}),
-            onClick: () => p(!0),
+            endIcon: /* @__PURE__ */ e(j, {}),
+            onClick: () => r(!0),
             size: "small",
             sx: { p: 0, mt: 8, "&:hover": { backgroundColor: "transparent" } },
-            children: /* @__PURE__ */ e(A, { sx: { fontWeight: 600 }, variant: "body2", children: r || m.connect_more_accounts_button })
-          }
-        ),
-        t === "connectDrawer" && /* @__PURE__ */ e(
-          oe,
-          {
-            onClose: () => p(!1),
-            showConnectWidget: c,
-            title: s || _.mini_title
+            children: /* @__PURE__ */ e(W, { sx: { fontWeight: 600 }, variant: "body2", children: t || c.connect_more_accounts_button })
           }
         ),
-        t === "connectionsDrawer" && /* @__PURE__ */ e(
-          St,
+        /* @__PURE__ */ e(
+          xe,
           {
-            onClose: () => p(!1),
-            showConnectionsWidget: c,
-            title: s || _.mini_title
+            onClose: () => r(!1),
+            showConnectWidget: s,
+            title: a.mini_title
           }
         )
       ]
     }
-  ) : null;
-};
-var se = /* @__PURE__ */ ((t) => (t.SpendLessThanYouMake = "spendLessThanYouMake", t.PayBillsOnTime = "payBillsOnTime", t.SaveEnoughToLiveOn = "saveEnoughToLiveOn", t.MaintainEmergencySavings = "maintainEmergencySavings", t.HaveManageableDebt = "haveManageableDebt", t.HaveAGoodCreditScore = "haveAGoodCreditScore", t))(se || {});
-const fo = ({ isOpen: t, onClose: o }) => {
-  const { common: n, finstrong: r } = v(), { isMobile: l } = je(), { updateUser: s, user: i } = Q(), [d, c] = h.useState(i.credit_score || 0), p = !isNaN(d), _ = () => {
-    o(), setTimeout(() => c(i.credit_score || 0), 300);
-  }, m = () => {
-    !d || d === i.credit_score || s({ ...i, credit_score: d });
+  );
+}, St = I(() => {
+  const n = G(), [o, { width: t }] = Ye(), { finstrong: i } = S(), { isCopyLoaded: d, isInitialized: l } = z(), { healthScore: s, healthScoreChange: r } = $(), a = n.palette.mode === "dark", c = ie(s?.health_score, i);
+  return !d || !l ? /* @__PURE__ */ e(N, {}) : /* @__PURE__ */ u(J, { ref: o, sx: { p: 16 }, children: [
+    /* @__PURE__ */ e(
+      Ve,
+      {
+        action: /* @__PURE__ */ e(
+          q,
+          {
+            endIcon: /* @__PURE__ */ e(j, {}),
+            sx: {
+              fontSize: 13,
+              lineHeight: "16px",
+              fontWeight: 600,
+              color: "primary.main"
+            },
+            variant: "text",
+            children: i.financial_strength_header_action
+          }
+        ),
+        subheader: /* @__PURE__ */ e(H, { color: "text.primary", children: i.financial_strength_header }),
+        sx: {
+          p: 0,
+          "& .MuiCardHeader-content": {
+            overflow: "hidden"
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ e(g, { sx: { justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ e(
+      ve,
+      {
+        arcRadius: t <= 323 ? 73 : 154,
+        footerCenterContent: r,
+        healthScore: s?.health_score || 0,
+        size: t <= 323 ? "M" : "L"
+      }
+    ) }),
+    s?.health_score ? /* @__PURE__ */ u(
+      Xe,
+      {
+        sx: {
+          px: 16,
+          backgroundColor: a ? "grey.800" : "grey.50",
+          //TODO: Need to change the background color to palette (supporting both darkmode and lightmode)
+          "&.Mui-expanded": {
+            m: 0
+          },
+          "&::before": {
+            display: "none"
+          }
+        },
+        children: [
+          /* @__PURE__ */ e(
+            Ue,
+            {
+              expandIcon: /* @__PURE__ */ e(Re, { size: 20 }),
+              sx: {
+                height: 52,
+                p: 0,
+                "&.Mui-expanded": {
+                  minHeight: 0
+                }
+              },
+              children: /* @__PURE__ */ e(y, { sx: { fontWeight: 600 }, variant: "body1", children: i.accordion_title_text })
+            }
+          ),
+          /* @__PURE__ */ e(je, { sx: { "&.MuiAccordionDetails-root": { padding: 0, pb: 16 } }, children: /* @__PURE__ */ e(y, { variant: "subtitle1", children: c.scoreContent }) })
+        ]
+      }
+    ) : /* @__PURE__ */ e(
+      Q,
+      {
+        buttonText: i.connect_more_accounts_title,
+        description: i.health_score_zero_description,
+        hasIcon: !1,
+        isDashboard: !0,
+        sx: {
+          backgroundColor: a ? "grey.800" : "grey.50",
+          //TODO: Need to change the background color to palette (supporting both darkmode and lightmode)
+          ".connect-more-accounts-title": {
+            fontWeight: 600,
+            lineHeight: "20px",
+            color: "text.primary"
+          },
+          ".connect-more-accounts-description": { color: "text.primary" }
+        },
+        title: i.health_score_zero_title
+      }
+    )
+  ] });
+}), vt = ({ isOpen: n, onClose: o }) => {
+  const { common: t, finstrong: i } = S(), { isMobile: d } = Ce(), { updateUser: l, user: s } = Y(), [r, a] = C.useState(s.credit_score || 0), c = !isNaN(r), p = () => {
+    o(), setTimeout(() => a(s.credit_score || 0), 300);
+  }, h = () => {
+    !r || r === s.credit_score || l({ ...s, credit_score: r });
   };
   return /* @__PURE__ */ e(
-    Dn,
+    Ze,
     {
-      copy: { close_aria: n.close_aria, title: r.edit_credit_score },
-      disablePrimaryButton: !d || !p,
-      isOpen: t,
+      copy: { close_aria: t.close_aria, title: i.edit_credit_score },
+      disablePrimaryButton: !r || !c,
+      isOpen: n,
       maxWidth: "xs",
-      onClose: _,
-      onPrimaryAction: m,
+      onClose: p,
+      onPrimaryAction: h,
       primaryColor: "primary",
-      primaryText: n.save_button,
+      primaryText: t.save_button,
       sx: {
         "& .MuiDialog-paper": {
-          minWidth: l ? "100%" : 400
+          minWidth: d ? "100%" : 400
         }
       },
       children: /* @__PURE__ */ e(
-        "form",
+        Qe,
         {
-          onSubmit: (g) => {
-            g.preventDefault(), m(), _();
+          error: !c,
+          fullWidth: !0,
+          inputMode: "numeric",
+          inputProps: {
+            noValidate: !0,
+            pattern: "[0-9]*"
           },
-          children: /* @__PURE__ */ e(
-            Me,
-            {
-              error: !p,
-              fullWidth: !0,
-              inputMode: "numeric",
-              inputProps: {
-                noValidate: !0,
-                pattern: "[0-9]*"
-              },
-              onChange: (g) => c(Number(g.target.value)),
-              value: p ? d : ""
-            }
-          )
+          onChange: (m) => a(Number(m.target.value)),
+          value: c ? r : ""
         }
       )
     }
   );
-}, Pt = S(fo), Be = {
-  credit_over_time_title: "Your Credit Over Time",
-  credit_over_time_zero_state_desc: "Add your credit score to start building a full picture of your credit health."
-}, xo = ({ chartFor: t }) => {
-  const o = E(), n = o.palette.mode === "dark", { monthlySummaries: r } = R(), { user: l } = Q(), { finstrong: s } = v(), [i, { width: d }] = vt(), c = {
-    savingsOverTime: {
-      icon: /* @__PURE__ */ e(dt, { size: 48, sx: { marginBottom: 8 } }),
-      title: s.key_indicators_save.zero_state_title,
-      description: s.key_indicators_save.zero_state_description
+}, kt = I(vt), At = ({ isOpen: n, onClose: o }) => {
+  const { finstrong: t } = S(), i = G(), { updateUser: d, user: l } = Y(), [s, r] = C.useState(l.birthday), a = (p) => {
+    r(Math.floor(new Date(p).getTime() / 1e3));
+  };
+  return /* @__PURE__ */ e(
+    V,
+    {
+      isOpen: n,
+      onClose: o,
+      onPrimaryAction: () => {
+        !s || s === l.birthday || (d({ ...l, birthday: s }), o());
+      },
+      onSecondaryAction: o,
+      title: t.date_of_birth,
+      children: /* @__PURE__ */ e(ot, { dateAdapter: et, children: /* @__PURE__ */ e(
+        tt,
+        {
+          disableFuture: !0,
+          onChange: a,
+          slotProps: {
+            nextIconButton: {
+              sx: {
+                color: "primary.main",
+                "&:hover": { bgcolor: te(i.palette.primary.light, 0.1) }
+              }
+            },
+            previousIconButton: {
+              sx: {
+                color: "primary.main",
+                "&:hover": { bgcolor: te(i.palette.primary.light, 0.1) }
+              }
+            }
+          },
+          slots: {
+            actionBar: () => null,
+            toolbar: () => null
+          },
+          sx: {
+            width: "100%",
+            "& .MuiIconButton-edgeEnd": {
+              color: "primary.main",
+              "&:hover": { bgcolor: te(i.palette.primary.light, 0.1) }
+            }
+          },
+          value: s ? new Date(s * 1e3) : /* @__PURE__ */ new Date()
+        }
+      ) })
+    }
+  );
+}, It = I(At), Ot = ({ value: n, completeCopy: o }) => /* @__PURE__ */ u(g, { sx: { gap: 8 }, children: [
+  /* @__PURE__ */ e(g, { sx: { flexDirection: "row", gap: 4 }, children: Array.from({ length: 4 }).map((t, i) => /* @__PURE__ */ e(
+    x,
+    {
+      sx: {
+        bgcolor: i < n ? "primary.main" : "neutral.light",
+        borderRadius: "24px",
+        height: 4,
+        width: "100%"
+      }
     },
-    debtOverTime: {
-      icon: /* @__PURE__ */ e(ut, { size: 48, sx: { marginBottom: 8 } }),
-      title: "",
-      description: ""
+    i
+  )) }),
+  /* @__PURE__ */ u(W, { sx: { color: "text.secondary" }, variant: "body2", children: [
+    n / 4 * 100,
+    "% ",
+    o
+  ] })
+] }), Dt = ({ isOpen: n, onClose: o }) => {
+  const { visibleFinstrongAccounts: t } = fe(), { incomeBudget: i } = ye(), {
+    accounts: d,
+    common: l,
+    finstrong: s
+  } = S(), { user: r } = Y(), [a, c] = C.useState(null), h = [
+    {
+      dynamicCopy: s.add_profile_item,
+      fallbackLabel: s.monthly_income,
+      icon: /* @__PURE__ */ e(Fe, {}),
+      key: A.MonthlyIncome,
+      label: s.monthly_income,
+      value: i
     },
-    creditOverTime: {
-      icon: /* @__PURE__ */ e(Ee, { size: 48, sx: { marginBottom: 8 } }),
-      title: Be.credit_over_time_title,
-      description: Be.credit_over_time_zero_state_desc
-    }
-  }[t], _ = {
-    savingsOverTime: {
-      title: s.key_indicators_save.savings_over_time,
-      valueKey: "available_cash"
+    {
+      dynamicCopy: s.add_profile_item,
+      fallbackLabel: s.date_of_birth,
+      icon: /* @__PURE__ */ e(Pe, {}),
+      key: A.DateOfBirth,
+      label: s.date_of_birth,
+      value: r.birthday
     },
-    debtOverTime: {
-      title: s.key_indicators_borrow.have_manageable_debt_drawer.debt_over_time,
-      valueKey: "debt_balance"
+    {
+      dynamicCopy: s.add_profile_item,
+      fallbackLabel: s.credit_score,
+      icon: /* @__PURE__ */ e(ue, {}),
+      key: A.CreditScore,
+      label: s.credit_score,
+      value: r.credit_score
     },
-    creditOverTime: {
-      title: Be.credit_over_time_title,
-      valueKey: "credit_score"
+    {
+      fallbackLabel: s.connect_your_accounts,
+      icon: /* @__PURE__ */ e(me, {}),
+      key: A.Connections,
+      label: s.connections,
+      value: t.length > 0 ? b(
+        s.connected_account,
+        String(t.length),
+        t.length > 1 ? s.accounts : s.account
+      ) : void 0
     }
-  }[t], m = dn(r, _.valueKey), g = Math.max(...r.map((D) => D[_.valueKey])), b = () => g >= 1e6 ? { formatter: "0.000a", leftMargin: 55 } : g >= 1e3 ? { formatter: "0a", leftMargin: 35 } : { formatter: "0a", leftMargin: 30 }, { formatter: w, leftMargin: f } = b(), x = _.title, y = t === "creditOverTime";
-  let k;
-  if (y) {
-    const { color: D } = mt(
-      l?.credit_score ?? 0,
-      n,
-      s.credit_score_status
-    );
-    k = D;
-  }
-  return /* @__PURE__ */ e(j, { ref: i, sx: { backgroundColor: "background.paper" }, children: m.length >= 1 ? /* @__PURE__ */ a(u, { gap: 8, sx: { pl: 18 }, children: [
-    /* @__PURE__ */ e(M, { sx: { pb: 8, pt: 16 }, variant: "h3", children: x }),
-    /* @__PURE__ */ e(
-      Ne,
+  ].map((m) => bt(m));
+  return /* @__PURE__ */ u(V, { isOpen: n, onClose: o, title: s.financial_profile, children: [
+    /* @__PURE__ */ u(g, { sx: { gap: 20, p: 24 }, children: [
+      /* @__PURE__ */ u(g, { sx: { gap: 8 }, children: [
+        /* @__PURE__ */ e(H, { children: s.your_financial_profile }),
+        /* @__PURE__ */ e(y, { children: s.financial_profile_description })
+      ] }),
+      /* @__PURE__ */ e(
+        Ot,
+        {
+          completeCopy: s.complete,
+          value: h.reduce((m, _) => m + (_.isComplete ? 1 : 0), 0)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e(ht, { list: h, onClickItem: c }),
+    /* @__PURE__ */ e(x, { sx: { p: 24 }, children: /* @__PURE__ */ e(
+      Q,
       {
-        areaColor: k,
-        axisColor: o.palette.divider,
-        baseline: "min",
-        chartFor: t,
-        colors: [o.palette.primary.main],
-        curveType: y ? "linear" : "natural",
-        datasets: m ? [m] : [],
-        height: 244,
-        labelFontColor: y ? "text.primary" : "",
-        labelFontSize: y ? 13 : void 0,
-        labels: [s.key_indicators_label],
-        margin: { left: f, top: y ? 25 : 15, right: 20 },
-        markStyles: (D) => y ? {
-          markLabelStyles: {
-            marginLeft: 16,
-            transform: D === m.length - 1 ? "translateX(-16px)" : "translateX(16px)",
-            fontWeight: 600
-          }
-        } : {},
-        maxRange: y ? 850 : void 0,
-        minRange: y ? 300 : void 0,
-        showArea: !0,
-        showAverage: !y,
-        showMark: !y,
-        showMarkLabel: y,
-        showXAxis: !0,
-        showYAxis: y,
-        showYAxisTicks: y,
-        useCustomMark: !0,
-        valueFormatterString: y ? void 0 : w,
-        width: d < 342 ? d - 48 : 342
+        description: s.connect_more_accounts_to_view_more_accurate_financial_picture,
+        isDashboard: !0,
+        title: s.dont_see_all_your_accounts
       }
-    )
-  ] }) : /* @__PURE__ */ a(u, { gap: 8, sx: { alignItems: "center", p: 24, pb: 48 }, children: [
-    c.icon,
-    /* @__PURE__ */ e(M, { fontWeight: 600, variant: "body1", children: c.title }),
-    /* @__PURE__ */ e(M, { align: "center", variant: "subtitle1", children: c.description })
-  ] }) });
-}, Ye = S(xo), So = {
-  updated_score: "Updated Score"
-}, Co = () => {
-  const { healthScoreChange: t } = R(), { user: o } = Q(), { availableWidth: n } = Cn(), { isSmallMobile: r } = je(n), [l, s] = h.useState(!1);
-  return /* @__PURE__ */ a(u, { sx: { gap: 28 }, children: [
+    ) }),
     /* @__PURE__ */ e(
-      bo,
+      V,
       {
-        arcRadius: r ? 124 : 154,
-        footerCenterContent: t,
-        healthScore: o.credit_score ?? 0,
-        size: r ? "M" : "L"
+        isOpen: a === A.MonthlyIncome,
+        onClose: () => c(null),
+        title: l.settings,
+        children: /* @__PURE__ */ e(Je, {})
       }
     ),
-    /* @__PURE__ */ e($, { onClick: () => s(!0), variant: "contained", children: So.updated_score }),
-    /* @__PURE__ */ e(Pt, { isOpen: l, onClose: () => s(!1) }),
-    /* @__PURE__ */ e(Ye, { chartFor: "creditOverTime" })
+    /* @__PURE__ */ e(It, { isOpen: a === A.DateOfBirth, onClose: () => c(null) }),
+    /* @__PURE__ */ e(kt, { isOpen: a === A.CreditScore, onClose: () => c(null) }),
+    /* @__PURE__ */ e(
+      qe,
+      {
+        onClose: () => c(null),
+        showConnectionsWidget: a === A.Connections,
+        title: d.manage_connections
+      }
+    )
   ] });
-}, vo = S(Co), Oe = ({ status: t }) => {
-  const { finstrong: o } = v(), n = pn(un[t]), r = {
-    GOOD: o.key_indicators_good,
-    FAIR: o.key_indicators_fair,
-    OFF_TRACK: o.key_indicators_off_track,
-    MISSING: o.key_indicators_missing
+}, Mt = I(Dt), X = {
+  creditScore: {
+    poor: 600,
+    good: 720
+  },
+  daysOfCashOnHand: {
+    poor: 30,
+    good: 90
+  },
+  debtToIncomeRatio: {
+    poor: 40,
+    good: 30
+  },
+  emergencySavings: {
+    poor: 750,
+    good: 1e3
+  },
+  spendToIncomeRatio: {
+    poor: 110,
+    good: 100
+  }
+}, f = {
+  GOOD: "Good",
+  FAIR: "Fair",
+  OFF_TRACK: "Off Track",
+  MISSING: "Missing"
+}, B = ({
+  title: n,
+  description: o,
+  cardState: t = f.MISSING,
+  stateTitle: i
+}) => {
+  const d = {
+    [f.GOOD]: { backgroundColor: "success.lighter", color: "success.main" },
+    [f.FAIR]: { backgroundColor: "warning.lighter", color: "warning.main" },
+    [f.OFF_TRACK]: { backgroundColor: "error.lighter", color: "error.main" },
+    [f.MISSING]: { backgroundColor: "divider", color: "text.secondary" }
   }[t];
-  return /* @__PURE__ */ e(
-    Tn,
+  return /* @__PURE__ */ u(
+    g,
     {
-      label: /* @__PURE__ */ e(
-        M,
-        {
-          fontWeight: 700,
-          sx: { color: n.color, minHeight: 12 },
-          uppercase: !0,
-          variant: "tiny",
-          children: r
-        }
-      ),
-      size: "small",
+      alignItems: "center",
+      flexDirection: "row",
+      gap: 12,
+      justifyContent: "space-between",
       sx: {
-        bgcolor: n.backgroundColor,
-        height: 16
+        p: 16,
+        border: "1px solid",
+        borderColor: "divider",
+        borderRadius: 2
       },
-      variant: "filled"
+      children: [
+        /* @__PURE__ */ u(x, { sx: { minHeight: 48 }, children: [
+          /* @__PURE__ */ u(g, { flexDirection: "row", gap: 4, children: [
+            /* @__PURE__ */ e(y, { fontWeight: 600, sx: { mb: 8 }, truncate: !0, variant: "body1", children: n }),
+            /* @__PURE__ */ e(
+              x,
+              {
+                sx: {
+                  borderRadius: 3,
+                  backgroundColor: d.backgroundColor,
+                  px: 8,
+                  py: 2,
+                  height: 16
+                },
+                children: /* @__PURE__ */ e(y, { fontWeight: 700, sx: { minHeight: 12 }, uppercase: !0, variant: "tiny", children: i })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e(y, { color: "secondary", variant: "subtitle2", children: o })
+        ] }),
+        /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(he, { color: "secondary", name: "chevron_right", size: 24 }) })
+      ]
     }
   );
-}, wo = {
-  keep_strong_credit_score: "Keep a Strong Credit Score"
-}, ko = () => {
-  const { user: t } = Q(), o = gt(t.credit_score ?? null);
-  return /* @__PURE__ */ a(u, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: [
-    /* @__PURE__ */ e(K, { children: wo.keep_strong_credit_score }),
-    /* @__PURE__ */ e(Oe, { status: o })
-  ] });
-}, Mo = S(ko), Do = ({
-  additionalContent: t,
-  connectTitle: o,
-  connectDescription: n,
-  children: r,
-  description: l,
-  drawerTitle: s,
-  isOpen: i,
-  loadConnectAccountsCard: d = !0,
-  onClose: c,
-  stickyComponent: p,
-  title: _,
-  drawerType: m
-}) => {
-  const { finstrong: g } = v(), { isCopyLoaded: b } = V();
-  return b ? /* @__PURE__ */ a(te, { isOpen: i, onClose: c, title: s || g.key_indicators, children: [
-    (_ || l) && /* @__PURE__ */ a(
-      u,
+}, Tt = () => {
+  const { healthScore: n } = $(), { finstrong: o } = S(), { key_indicators_spend: t } = o, i = (r) => {
+    const { good: a, poor: c } = X.spendToIncomeRatio;
+    let p = f.MISSING, h = t.ratio_missing_description, m = o.key_indicators_missing;
+    return r !== null && (r < a ? (p = f.GOOD, h = b(t.ratio_good_description, r), m = o.key_indicators_good) : r >= a && r < c ? (p = f.FAIR, h = b(t.ratio_fair_description, r), m = o.key_indicators_fair) : r >= c && (p = f.OFF_TRACK, h = b(t.ratio_off_track_description, r), m = o.key_indicators_off_track)), {
+      cardState: p,
+      description: h,
+      title: t.ratio_card_title,
+      stateTitle: m
+    };
+  }, d = (r) => {
+    let a = f.MISSING, c = t.count_missing_description, p = o.key_indicators_missing;
+    return r !== null && (r === 0 ? (a = f.GOOD, c = t.count_good_description, p = o.key_indicators_good) : r >= 1 && (a = f.OFF_TRACK, c = t.count_off_track_description, p = o.key_indicators_off_track)), {
+      cardState: a,
+      description: c,
+      title: t.count_card_title,
+      stateTitle: p
+    };
+  }, { spendToIncomeRatio: l, spendFeeCount: s } = C.useMemo(() => {
+    const r = n.spend_to_income_ratio !== null ? Math.round(n.spend_to_income_ratio * 100) : null, a = i(r), c = d(n.spending_fee_transaction_count);
+    return { spendToIncomeRatio: a, spendFeeCount: c };
+  }, [
+    n.spend_to_income_ratio,
+    n.spending_fee_transaction_count,
+    t,
+    o
+  ]);
+  return /* @__PURE__ */ u(g, { direction: "column", gap: 24, sx: { p: 8, pt: 24 }, children: [
+    /* @__PURE__ */ e(
+      B,
       {
-        sx: {
-          backgroundColor: "background.paper",
-          gap: 8,
-          p: 24
-        },
-        children: [
-          _ && typeof _ == "string" ? /* @__PURE__ */ e(K, { children: _ }) : _,
-          l && /* @__PURE__ */ e(M, { children: l })
-        ]
+        cardState: l.cardState,
+        description: l.description,
+        stateTitle: l.stateTitle,
+        title: l.title
       }
     ),
-    p && /* @__PURE__ */ e(
-      C,
+    /* @__PURE__ */ e(
+      B,
       {
-        sx: {
-          position: "sticky",
-          top: 0,
-          zIndex: 1
-        },
-        children: p
+        cardState: s.cardState,
+        description: s.description,
+        stateTitle: s.stateTitle,
+        title: s.title
+      }
+    )
+  ] });
+}, wt = () => {
+  const { healthScore: n } = $(), { finstrong: o } = S(), { key_indicators_save: t } = o, i = (r) => {
+    const { good: a, poor: c } = X.daysOfCashOnHand;
+    let p = f.MISSING, h = t.days_of_cash_missing_description, m = o.key_indicators_missing;
+    return r !== null && (r >= a ? (p = f.GOOD, h = b(t.days_of_cash_good_description, r), m = o.key_indicators_good) : r < a && r >= c ? (p = f.FAIR, h = b(t.days_of_cash_fair_description, r), m = o.key_indicators_fair) : r < c && (p = f.OFF_TRACK, h = b(t.days_of_cash_off_track_description, r), m = o.key_indicators_off_track)), {
+      cardState: p,
+      description: h,
+      title: t.days_of_cash_title,
+      stateTitle: m
+    };
+  }, d = (r) => {
+    const { good: a, poor: c } = X.emergencySavings;
+    let p = f.MISSING, h = t.emergency_savings_missing_description, m = o.key_indicators_missing;
+    return r !== null && (r >= a ? (p = f.GOOD, h = t.emergency_savings_good_description, m = o.key_indicators_good) : r < a && r >= c ? (p = f.FAIR, h = b(
+      t.emergency_savings_fair_description,
+      rt(r, "0,0.00")
+    ), m = o.key_indicators_fair) : r < c && (p = f.OFF_TRACK, h = t.emergency_savings_off_track_description, m = o.key_indicators_off_track)), {
+      cardState: p,
+      description: h,
+      title: t.emergency_savings_title,
+      stateTitle: m
+    };
+  }, { daysOfCashOnHand: l, emergencySavings: s } = C.useMemo(() => {
+    const r = n.months_of_cash_on_hand !== null ? Math.round(n.months_of_cash_on_hand * 30) : null, a = i(r), c = n.emergency_savings_on_hand !== null ? Math.round(n.emergency_savings_on_hand) : null, p = d(c);
+    return { daysOfCashOnHand: a, emergencySavings: p };
+  }, [
+    n.months_of_cash_on_hand,
+    n.emergency_savings_on_hand,
+    t,
+    o
+  ]);
+  return /* @__PURE__ */ u(g, { direction: "column", gap: 24, sx: { p: 8, pt: 24 }, children: [
+    /* @__PURE__ */ e(
+      B,
+      {
+        cardState: l.cardState,
+        description: l.description,
+        stateTitle: l.stateTitle,
+        title: l.title
       }
     ),
-    t && /* @__PURE__ */ e(C, { children: t }),
-    /* @__PURE__ */ a(u, { sx: { p: 24, gap: 24 }, children: [
-      r,
-      d && /* @__PURE__ */ e(
-        Te,
-        {
-          description: n,
-          drawerType: m,
-          isDashboard: !0,
-          sx: { backgroundColor: "background.paper" },
-          title: o
-        }
-      )
-    ] })
-  ] }) : /* @__PURE__ */ e(J, {});
-}, Bt = S(Do), Ao = ({
-  onClick: t,
-  shouldShowBalance: o = !0,
-  loadAccounts: n
-}) => {
-  const { config: r } = ft(), { accounts: l } = v(), { selectedAccounts: s } = V(), i = h.useCallback(
-    (c) => {
-      t?.(c);
-    },
-    [t]
-  ), d = h.useMemo(
-    () => Array.from(new Set(s.map((c) => c.account_type))).filter(
-      (c) => n ? n.includes(c) : !0
-    ),
-    [s, n]
-  );
-  return s.length ? /* @__PURE__ */ e(h.Fragment, { children: d.map((c) => {
-    const { accountsForType: p, totalBalanceForType: _ } = s.reduce(
-      (m, g) => (g.account_type === c && (m.accountsForType.push(g), m.totalBalanceForType += g.balance || 0), m),
-      { accountsForType: [], totalBalanceForType: 0 }
-    );
-    return /* @__PURE__ */ a(
-      De,
+    /* @__PURE__ */ e(
+      B,
       {
-        subheader: /* @__PURE__ */ e(Rn, { sx: { pb: 4, position: "static", pt: 12, px: 24 }, children: /* @__PURE__ */ a(u, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: [
-          /* @__PURE__ */ e(A, { bold: !0, variant: "caption", children: l.account_types[c] }),
-          o && /* @__PURE__ */ e(A, { bold: !0, variant: "caption", children: B(_, "0,0.00") })
-        ] }) }),
-        sx: { bgcolor: "background.paper" },
-        children: [
-          p.map((m, g) => {
-            const { firstValue: b } = kt(m, l), w = Ct(m, {
-              allowNickname: r?.show_account_nicknames_in_master
-            }), f = /* @__PURE__ */ a(z, { children: [
-              /* @__PURE__ */ e(wt, { children: /* @__PURE__ */ e(ht, { alt: "MX", institutionGuid: m.institution_guid ?? "" }) }),
-              /* @__PURE__ */ e(
-                ue,
-                {
-                  primary: `${w}${m.account_number ? ` *${m.account_number}` : ""}`,
-                  primaryTypographyProps: { noWrap: !0, pr: 4, variant: "body1" }
-                }
-              ),
-              o && /* @__PURE__ */ e(M, { bold: !0, variant: "body2", children: B(b ?? 0, "0,0.00") })
-            ] });
-            return /* @__PURE__ */ a(h.Fragment, { children: [
-              /* @__PURE__ */ e(pe, { sx: { px: t ? 0 : 24 }, children: t ? /* @__PURE__ */ e(On, { onClick: () => i(m), children: f }) : f }),
-              g !== p.length - 1 && /* @__PURE__ */ e(ne, { variant: "inset" })
-            ] }, m.guid);
-          }),
-          /* @__PURE__ */ e(ne, {})
-        ]
-      },
-      c
-    );
-  }) }) : null;
-}, Lt = S(Ao), Io = ({ loadAccounts: t, loadMoreLabel: o }) => {
-  const n = E(), { config: r } = ft(), { connect: l, finstrong: s } = v(), { accounts: i } = v(), { selectedAccounts: d } = V(), [c, p] = h.useState(!1), [_, m] = h.useState(!1), g = h.useMemo(
-    () => d.filter(
-      (f) => t ? t.includes(f.account_type) : !0
-    ),
-    [d, t]
-  ), b = h.useMemo(() => g.slice(0, 3), [g]), w = (f) => {
-    const { firstValue: x } = kt(f, i);
-    return x;
-  };
-  return g.length >= 1 ? /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ e(C, { sx: { border: `1px solid ${n.palette.divider}`, borderRadius: 2 }, children: b.map((f, x) => /* @__PURE__ */ a(h.Fragment, { children: [
-      /* @__PURE__ */ a(pe, { sx: { px: 24 }, children: [
-        /* @__PURE__ */ e(wt, { children: /* @__PURE__ */ e(ht, { alt: "MX", institutionGuid: f.institution_guid ?? "" }) }),
-        /* @__PURE__ */ e(
-          ue,
-          {
-            primary: `${Ct(f, {
-              allowNickname: r?.show_account_nicknames_in_master
-            })}
-              ${f.account_number ? ` *${f.account_number}` : ""}`,
-            primaryTypographyProps: { noWrap: !0, pr: 4, variant: "body1" }
-          }
-        ),
-        /* @__PURE__ */ e(M, { bold: !0, variant: "body2", children: B(w(f), "0,0.00") })
-      ] }),
-      x < b.length - 1 && /* @__PURE__ */ e(ne, { variant: "inset" })
-    ] }, f.guid)) }),
-    g.length > 3 && /* @__PURE__ */ a(z, { children: [
-      /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-        $,
-        {
-          endIcon: /* @__PURE__ */ e(Z, {}),
-          onClick: () => p(!0),
-          size: "small",
-          sx: { my: 0, px: 16, py: 12, width: "100%" },
-          children: /* @__PURE__ */ a(A, { bold: !0, variant: "body1", children: [
-            g.length - 3,
-            " ",
-            o
-          ] })
-        }
-      ) }),
-      /* @__PURE__ */ e(te, { isOpen: c, onClose: () => p(!1), title: s.accounts, children: /* @__PURE__ */ e(Lt, { loadAccounts: t }) })
-    ] })
-  ] }) : /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-      $,
-      {
-        onClick: () => m(!0),
-        size: "small",
-        sx: { my: 0, px: 16, py: 12, width: "100%" },
-        variant: "contained",
-        children: /* @__PURE__ */ e(A, { bold: !0, variant: "body1", children: s.connect_more_accounts_button })
-      }
-    ) }),
-    /* @__PURE__ */ e(
-      oe,
-      {
-        onClose: () => m(!1),
-        showConnectWidget: _,
-        title: l.mini_title
-      }
-    )
-  ] });
-}, $t = S(Io), me = ({ balance: t, title: o, sx: n }) => /* @__PURE__ */ a(
-  u,
-  {
-    sx: {
-      alignItems: "center",
-      backgroundColor: "background.default",
-      borderRadius: 2,
-      height: 72,
-      justifyContent: "center",
-      p: 12,
-      ...n
-    },
-    children: [
-      typeof t == "number" ? /* @__PURE__ */ e(M, { variant: "h2", children: B(t, "0,0.00") }) : t,
-      /* @__PURE__ */ e(M, { color: "text.secondary", fontWeight: "400", variant: "subtitle2", children: o })
-    ]
-  }
-);
-var O = /* @__PURE__ */ ((t) => (t[t.ConnectAccounts = 1] = "ConnectAccounts", t[t.MonthlyIncome = 2] = "MonthlyIncome", t[t.Birthday = 3] = "Birthday", t[t.CreditScore = 4] = "CreditScore", t))(O || {}), xe = /* @__PURE__ */ ((t) => (t[t.Months = 1] = "Months", t[t.Years = 2] = "Years", t[t.Days = 3] = "Days", t))(xe || {}), q = /* @__PURE__ */ ((t) => (t[t.Monthly = 1] = "Monthly", t[t.BiWeekly = 2] = "BiWeekly", t[t.Weekly = 3] = "Weekly", t[t.Daily = 4] = "Daily", t))(q || {});
-const P = {
-  bi_weekly: "Bi-Weekly",
-  calculate: "Calculate",
-  daily: "Daily",
-  day: "day",
-  days: "Days",
-  estimated_contribution: "Estimated Contribution",
-  estimated_period_bi_weekly: "bi-weekly",
-  estimated_period_daily: "day",
-  estimated_period_monthly: "month",
-  estimated_period_weekly: "week",
-  how_often_contribute: "How often will you contribute?",
-  meet_your_goal_within: "Meet your goal within",
-  months: "Months",
-  monthly: "Monthly",
-  savings_goal: "Savings Goal",
-  suggested_goal: "Suggested Goal: $25,000",
-  weekly: "Weekly",
-  years: "Years"
-}, To = [
-  { id: q.Monthly, label: P.monthly },
-  { id: q.BiWeekly, label: P.bi_weekly },
-  { id: q.Weekly, label: P.weekly },
-  { id: q.Daily, label: P.daily }
-], Oo = {
-  [q.Monthly]: P.estimated_period_monthly,
-  [q.BiWeekly]: P.estimated_period_bi_weekly,
-  [q.Weekly]: P.estimated_period_weekly,
-  [q.Daily]: P.estimated_period_daily
-}, Ro = [
-  { id: xe.Months, label: P.months },
-  { id: xe.Years, label: P.years },
-  { id: xe.Days, label: P.days }
-], Fo = ({ total: t }) => {
-  const o = Math.ceil((t + 1) / 1e3) * 1e3, [n, r] = h.useState(0), [l, s] = h.useState(Je(t)), [i, d] = h.useState(
-    Je(t)
-  ), [c, p] = h.useState(o), [_, m] = h.useState(_n(t)), [g, b] = h.useState(xe.Months);
-  h.useEffect(() => {
-    r(
-      et({
-        contribution: i,
-        goalAmount: c,
-        goalPeriod: _,
-        targetPeriod: g,
-        totalSaved: t
-      })
-    ), s(i);
-  }, []);
-  const w = (f) => {
-    f.preventDefault(), r(
-      et({
-        contribution: i,
-        goalAmount: c,
-        goalPeriod: _,
-        targetPeriod: g,
-        totalSaved: t
-      })
-    ), s(i);
-  };
-  return /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e("form", { onSubmit: w, children: /* @__PURE__ */ a(u, { sx: { gap: 24, pb: 24, pt: 16, px: 16 }, children: [
-    /* @__PURE__ */ e(
-      me,
-      {
-        balance: /* @__PURE__ */ a(u, { sx: { flexDirection: "row", height: 32 }, children: [
-          /* @__PURE__ */ e(A, { variant: "h2", children: B(n, "0,0") }),
-          /* @__PURE__ */ a(A, { sx: { alignSelf: "end", height: 24 }, variant: "subtitle2", children: [
-            "/",
-            Oo[l]
-          ] })
-        ] }),
-        title: P.estimated_contribution
-      }
-    ),
-    /* @__PURE__ */ e(
-      Me,
-      {
-        "aria-label": P.savings_goal,
-        helperText: P.suggested_goal,
-        inputProps: {
-          noValidate: !0,
-          pattern: "[0-9]*"
-        },
-        label: P.savings_goal,
-        onChange: (f) => {
-          f.target.value && p(Number(f.target.value.replace(/[^0-9]/g, "")));
-        },
-        value: c ? B(c, "0,0") : ""
-      }
-    ),
-    /* @__PURE__ */ e(
-      nt,
-      {
-        label: P.how_often_contribute,
-        onChange: d,
-        options: To,
-        required: !0,
-        value: i
-      }
-    ),
-    /* @__PURE__ */ a(u, { sx: { flexDirection: "row" }, children: [
-      /* @__PURE__ */ e(
-        Me,
-        {
-          "aria-label": P.meet_your_goal_within,
-          fullWidth: !0,
-          inputProps: {
-            noValidate: !0,
-            pattern: "[0-9]*"
-          },
-          label: P.meet_your_goal_within,
-          onChange: (f) => m(Number(f.target.value)),
-          sx: {
-            "& .MuiInputBase-root": {
-              borderBottomRightRadius: 0,
-              borderTopRightRadius: 0,
-              fieldset: {
-                borderRightWidth: 0.5
-              }
-            }
-          },
-          value: _
-        }
-      ),
-      /* @__PURE__ */ e(
-        C,
-        {
-          sx: {
-            "& .MuiInputBase-root": {
-              borderBottomLeftRadius: 0,
-              borderTopLeftRadius: 0,
-              fieldset: {
-                borderLeftWidth: 0.5
-              }
-            }
-          },
-          children: /* @__PURE__ */ e(nt, { label: "", onChange: b, options: Ro, value: g })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e($, { fullWidth: !0, onClick: w, type: "submit", variant: "contained", children: P.calculate })
-  ] }) }) });
-}, Po = S(Fo), we = {
-  connect_accounts: "Connect Accounts",
-  more_accounts: "More Accounts",
-  your_savings: "Your Savings"
-}, Bo = () => {
-  const { savingsAccounts: t } = Se(), [o, n] = h.useState(!1), r = h.useMemo(
-    () => t.reduce((l, s) => l + (s.balance ?? 0), 0),
-    [t]
-  );
-  return /* @__PURE__ */ a(u, { sx: { gap: 24 }, children: [
-    /* @__PURE__ */ e(j, { sx: { bgcolor: "background.paper", p: 16 }, children: /* @__PURE__ */ a(u, { sx: { gap: 16 }, children: [
-      /* @__PURE__ */ e(me, { balance: r, title: we.your_savings }),
-      t.length ? /* @__PURE__ */ e($t, { loadAccounts: [We.SAVINGS], loadMoreLabel: we.connect_accounts }) : /* @__PURE__ */ e(Pn, { onClick: () => n(!0), variant: "contained", children: we.connect_accounts })
-    ] }) }),
-    /* @__PURE__ */ e(Po, { total: r }),
-    /* @__PURE__ */ e(
-      oe,
-      {
-        onClose: () => n(!1),
-        showConnectWidget: o,
-        title: we.connect_accounts
-      }
-    )
-  ] });
-}, Lo = S(Bo), Re = S(
-  ({ label: t, value: o, status: n, bottomComponent: r, statusBarData: l = [] }) => {
-    const { finstrong: s } = v(), i = {
-      GOOD: {
-        backgroundColor: "success.lighter",
-        color: "success.main",
-        progressBarColor: "primary.main",
-        label: s?.key_indicators_good
-      },
-      FAIR: {
-        backgroundColor: "warning.lighter",
-        color: "warning.main",
-        progressBarColor: "warning.main",
-        label: s?.key_indicators_fair
-      },
-      OFF_TRACK: {
-        backgroundColor: "error.lighter",
-        color: "error.main",
-        progressBarColor: "error.main",
-        label: s?.key_indicators_off_track
-      },
-      MISSING: {
-        backgroundColor: "divider",
-        color: "text.secondary",
-        progressBarColor: "text.secondary",
-        label: s?.key_indicators_missing
-      }
-    }[n], d = l.map((c, p) => l.length === 2 ? {
-      color: p === 0 ? "primary.main" : c.color || i?.progressBarColor,
-      percentage: c.percentage
-    } : {
-      color: c.color || i?.progressBarColor,
-      percentage: c.percentage
-    });
-    return /* @__PURE__ */ a(
-      u,
-      {
-        sx: {
-          backgroundColor: "background.paper",
-          gap: 8,
-          p: 24,
-          pt: 0,
-          borderBottom: "1px solid",
-          borderColor: "divider"
-        },
-        children: [
-          /* @__PURE__ */ a(u, { sx: { gap: 2 }, children: [
-            /* @__PURE__ */ e(A, { variant: "body2", children: t }),
-            /* @__PURE__ */ a(
-              u,
-              {
-                sx: {
-                  alignItems: "center",
-                  flexDirection: "row",
-                  gap: 12,
-                  justifyContent: "space-between"
-                },
-                children: [
-                  /* @__PURE__ */ e(Ie, { children: o }),
-                  /* @__PURE__ */ e(Oe, { status: n })
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ a(u, { children: [
-            /* @__PURE__ */ e(Bn, { data: d, height: 16 }),
-            r
-          ] })
-        ]
-      }
-    );
-  }
-), $o = {
-  sticky_label: "You have saved"
-}, Wo = ["$0", "$250", "$500", "$750", "$1k"], zo = () => {
-  const { healthScore: t } = R(), o = Math.round(t.emergency_savings_on_hand ?? NaN) || null, n = hn(o), r = yt(o);
-  return /* @__PURE__ */ e(
-    Re,
-    {
-      bottomComponent: /* @__PURE__ */ e(u, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: Wo.map((l) => /* @__PURE__ */ a(u, { sx: { alignItems: "center", height: 24, width: 30 }, children: [
-        /* @__PURE__ */ e(
-          ne,
-          {
-            orientation: "vertical",
-            sx: {
-              borderWidth: 0.5,
-              height: 8,
-              mt: 2
-            }
-          }
-        ),
-        /* @__PURE__ */ e(A, { variant: "caption", children: l })
-      ] }, l)) }),
-      label: $o.sticky_label,
-      status: r,
-      statusBarData: [
-        {
-          percentage: n
-        }
-      ],
-      value: B(o ?? 0, "0,0.00")
-    }
-  );
-}, Eo = S(zo), it = 65, st = 34, Go = ({
-  transactions: t,
-  bgcolor: o,
-  height: n = "calc(100dvh - 36px)",
-  loader: r = /* @__PURE__ */ e(J, { label: "Loading", size: 40 }),
-  onClick: l,
-  showInsights: s = !1,
-  showLoader: i = !1,
-  width: d = "100%",
-  zeroState: c = /* @__PURE__ */ e(Wn, {})
-}) => {
-  const { getCategoryName: p } = He(), { onEvent: _ } = vn(), { categories: m } = v(), { clearExpandedSplits: g, setShowInsights: b, toggleSplit: w } = $n(), f = (k) => {
-    const D = t.find((I) => I.guid === k);
-    if (D?.has_been_split) {
-      w(D.guid);
-      return;
-    }
-    _(zn.ACCOUNT_DETAILS_CLICK_TRANSACTION, {
-      account_guid: D?.account_guid,
-      transaction_guid: k
-    }), l?.(k);
-  }, x = h.useRef(null), y = Ln({
-    count: t.length,
-    getScrollElement: () => x.current,
-    estimateSize: (k) => it + (ze(k, t) ? st : 0),
-    overscan: 5
-  });
-  return h.useEffect(() => y.measure(), [t]), h.useEffect(() => b(s), [s]), h.useEffect(() => () => g(), []), /* @__PURE__ */ e(De, { sx: { width: d }, children: /* @__PURE__ */ e(C, { height: n, overflow: "auto", ref: x, width: d, children: /* @__PURE__ */ a(
-    C,
-    {
-      height: (
-        // set the height to auto when there are no transactions so the zero state isn't set to 0
-        y.getVirtualItems().length === 0 ? "auto" : y.getTotalSize()
-      ),
-      position: "relative",
-      width: "100%",
-      children: [
-        i && r,
-        !i && y.getVirtualItems().length === 0 && c,
-        !i && y.getVirtualItems().length > 0 && y.getVirtualItems().map((k) => {
-          const D = t[k.index], I = ze(k.index, t), N = Mt(k.index, t), G = it + (I ? st : 0);
-          return /* @__PURE__ */ a(
-            C,
-            {
-              sx: {
-                height: G,
-                position: "absolute",
-                transform: `translateY(${k.start}px)`,
-                width: "100%"
-              },
-              children: [
-                I && /* @__PURE__ */ e(Dt, { bgcolor: o, children: Ve(D.date) }),
-                /* @__PURE__ */ e(
-                  At,
-                  {
-                    ...l && { onClick: f },
-                    transaction: {
-                      ...D,
-                      category: m.default_categories[D.top_level_category_guid]?.replace(
-                        /&amp;/g,
-                        "&"
-                      ) ?? p(D.top_level_category_guid)
-                    }
-                  }
-                ),
-                /* @__PURE__ */ e(ne, { sx: { ml: N ? 24 : 0 } })
-              ]
-            },
-            D.guid
-          );
-        })
-      ]
-    }
-  ) }) });
-}, Ho = S(Go), Fe = ({
-  transactions: t = [],
-  amountColor: o = "success.main",
-  amountPosition: n = "center",
-  formatDate: r = Ve,
-  secondaryIcon: l
-}) => {
-  const s = E(), { connect: i, finstrong: d } = v(), [c, p] = h.useState(!1), [_, m] = h.useState(!1), g = 3, b = t.length > g, w = t.length - g;
-  return !t || t.length === 0 ? /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-      $,
-      {
-        onClick: () => m(!0),
-        size: "small",
-        sx: { my: 0, px: 16, py: 12, width: "100%" },
-        variant: "contained",
-        children: /* @__PURE__ */ e(A, { bold: !0, variant: "body1", children: d.connect_more_accounts_button })
-      }
-    ) }),
-    /* @__PURE__ */ e(
-      oe,
-      {
-        onClose: () => m(!1),
-        showConnectWidget: _,
-        title: i.mini_title
-      }
-    )
-  ] }) : /* @__PURE__ */ a(u, { sx: { gap: 16 }, children: [
-    /* @__PURE__ */ e(C, { sx: { border: `1px solid ${s.palette.divider}`, borderRadius: 2 }, children: t.slice(0, g).map((f, x) => /* @__PURE__ */ a(
-      u,
-      {
-        sx: {
-          alignItems: "center",
-          flexDirection: "row",
-          gap: 16,
-          pl: 24,
-          pt: 14
-        },
-        children: [
-          /* @__PURE__ */ e(u, { sx: { pb: 14 }, children: /* @__PURE__ */ e(
-            rn,
-            {
-              categoryGuid: f.top_level_category_guid || "",
-              merchantGuid: f.merchant_guid || "",
-              size: 32
-            }
-          ) }),
-          /* @__PURE__ */ a(
-            u,
-            {
-              sx: {
-                alignItems: n,
-                flexDirection: "row",
-                gap: 12,
-                justifyContent: "space-between",
-                ...x < Math.min(t.length, g) - 1 && {
-                  borderBottom: `1px solid ${s.palette.divider}`
-                },
-                pb: 14,
-                pr: 24,
-                width: "100%"
-              },
-              children: [
-                /* @__PURE__ */ a(u, { sx: { gap: 4 }, children: [
-                  /* @__PURE__ */ e(M, { bold: !0, variant: "body1", children: f.description }),
-                  /* @__PURE__ */ a(u, { sx: { flexDirection: "row", alignItems: "center", gap: 4 }, children: [
-                    !!l && l,
-                    /* @__PURE__ */ e(A, { variant: "caption", children: r(f.date) })
-                  ] })
-                ] }),
-                /* @__PURE__ */ e(M, { bold: !0, sx: { color: o, flexShrink: 0 }, variant: "body1", children: B(f.amount, "0,0.00") })
-              ]
-            },
-            f.guid || x
-          )
-        ]
-      },
-      x
-    )) }),
-    b && /* @__PURE__ */ a(z, { children: [
-      /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-        $,
-        {
-          endIcon: /* @__PURE__ */ e(Z, {}),
-          onClick: () => p(!0),
-          size: "small",
-          sx: { my: 0, px: 16, py: 12, width: "100%" },
-          children: /* @__PURE__ */ a(A, { bold: !0, variant: "body1", children: [
-            w,
-            " ",
-            d.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_more_transactions
-          ] })
-        }
-      ) }),
-      /* @__PURE__ */ e(
-        te,
-        {
-          isOpen: c,
-          onClose: () => p(!1),
-          title: d.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_transactions,
-          children: /* @__PURE__ */ e(Ho, { transactions: t })
-        }
-      )
-    ] })
-  ] });
-}, No = () => {
-  const {
-    finstrong: {
-      key_indicators_spend: { pay_bills_on_time_drawer: t }
-    }
-  } = v(), { getSpendingFeeTransactions: o, allTransactions: n } = R();
-  return h.useEffect(() => {
-    o().finally();
-  }, []), /* @__PURE__ */ e(z, { children: n.spendingFee.length === 0 ? /* @__PURE__ */ a(
-    j,
-    {
-      sx: {
-        backgroundColor: "background.paper",
-        pb: 48,
-        pt: 32,
-        px: 24,
-        textAlign: "center",
-        width: "100%"
-      },
-      children: [
-        /* @__PURE__ */ e(qt, { filled: !0, size: 48, sx: { color: "success.main" } }),
-        /* @__PURE__ */ a(u, { sx: { alignItems: "center", gap: 4, pt: 24 }, children: [
-          /* @__PURE__ */ e(K, { children: t.pay_bills_on_time_zero_fees_title }),
-          /* @__PURE__ */ e(M, { variant: "subtitle1", children: t.pay_bills_on_time_zero_fees_description })
-        ] })
-      ]
-    }
-  ) : /* @__PURE__ */ a(
-    j,
-    {
-      sx: {
-        p: 16,
-        width: "100%",
-        backgroundColor: "background.paper"
-      },
-      children: [
-        /* @__PURE__ */ e(K, { sx: { textAlign: "left", pb: 8 }, children: t.pay_bills_on_time_sticky_fee_count }),
-        /* @__PURE__ */ e(
-          Fe,
-          {
-            amountColor: "text.primary",
-            amountPosition: "flex-start",
-            formatDate: (r) => An(new Date(r * 1e3), In.MONTH_DAY),
-            secondaryIcon: /* @__PURE__ */ e(Zt, { color: "error", filled: !0, size: 12 }),
-            transactions: n.spendingFee
-          }
-        )
-      ]
-    }
-  ) });
-}, Ko = S(No), jo = () => {
-  const { healthScore: t } = R(), { finstrong: o } = v(), { key_indicators_spend: n } = o, { pay_bills_on_time_drawer: r } = n, l = mn(t.spending_fee_transaction_count);
-  return /* @__PURE__ */ a(
-    u,
-    {
-      sx: {
-        p: 24,
-        backgroundColor: "background.paper",
-        borderBottom: "1px solid",
-        borderColor: "divider"
-      },
-      children: [
-        /* @__PURE__ */ e(M, { variant: "body2", children: r.pay_bills_on_time_sticky_description }),
-        /* @__PURE__ */ a(u, { direction: "row", sx: { alignItems: "center", justifyContent: "space-between" }, children: [
-          /* @__PURE__ */ a(Ie, { children: [
-            t.spending_fee_transaction_count,
-            " ",
-            r.pay_bills_on_time_sticky_fee_count
-          ] }),
-          /* @__PURE__ */ e(Oe, { status: l })
-        ] })
-      ]
-    }
-  );
-}, Vo = S(jo), Yo = () => {
-  const { savingsAndCheckingAccountsBalance: t } = Se(), { finstrong: o } = v();
-  return /* @__PURE__ */ a(u, { gap: 16, sx: { p: 16 }, children: [
-    /* @__PURE__ */ e(
-      me,
-      {
-        balance: t,
-        title: o.key_indicators_save.drawer_available_balance
-      }
-    ),
-    /* @__PURE__ */ e(
-      $t,
-      {
-        loadAccounts: [We.SAVINGS, We.CHECKING],
-        loadMoreLabel: o.more_accounts
-      }
-    )
-  ] });
-}, Xo = S(Yo), Uo = () => {
-  const { finstrong: t } = v(), { healthScore: o, allTransactions: n, loadSpendTransactions: r, loadDebtSpend: l } = R(), { isInitialized: s } = V();
-  h.useEffect(() => {
-    s && (r().finally(), l().finally());
-  }, [s]);
-  const i = h.useMemo(() => {
-    const d = n.spend.map((p) => p.transaction), c = n.debtSpend.map((p) => p.transaction);
-    return [...d, ...c];
-  }, [n.spend, n.debtSpend]);
-  return s ? /* @__PURE__ */ a(u, { gap: 16, sx: { p: 16 }, children: [
-    /* @__PURE__ */ e(
-      me,
-      {
-        balance: o.ninety_day_spend / 90,
-        title: t.key_indicators_save.drawer_daily_spend
-      }
-    ),
-    /* @__PURE__ */ e(Fe, { amountColor: "text.primary", transactions: i })
-  ] }) : /* @__PURE__ */ e(J, {});
-}, qo = S(Uo), Zo = () => {
-  const [t, o] = h.useState(0), { finstrong: n } = v();
-  return /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ a(j, { children: [
-      /* @__PURE__ */ a(
-        Ke,
-        {
-          "aria-label": n.key_indicators_save.drawer_title,
-          centered: !0,
-          onChange: (r, l) => o(l),
-          sx: { mb: 0 },
-          value: t,
-          variant: "fullWidth",
-          children: [
-            /* @__PURE__ */ e(
-              ae,
-              {
-                "aria-controls": "available-details-tabpanel-0",
-                label: n.key_indicators_save.drawer_available,
-                sx: { minHeight: 44 }
-              }
-            ),
-            /* @__PURE__ */ e(
-              ae,
-              {
-                "aria-controls": "spending-details-tabpanel-1",
-                label: n.key_indicators_save.drawer_spending,
-                sx: { minHeight: 44 }
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(ie, { index: 0, name: "available-details", value: t, children: /* @__PURE__ */ e(Xo, {}) }),
-      /* @__PURE__ */ e(ie, { index: 1, name: "spending-details", value: t, children: /* @__PURE__ */ e(qo, {}) })
-    ] }),
-    /* @__PURE__ */ e(Ye, { chartFor: "savingsOverTime" })
-  ] });
-}, Qo = S(Zo), Jo = () => {
-  const { finstrong: t } = v(), { healthScore: o } = R(), n = o.months_of_cash_on_hand, r = bt(n ? n * 30 : null), l = 183 / 6, s = Math.floor(n), i = Math.round((n - s) * l), d = n / 6 * 100;
-  return /* @__PURE__ */ e(
-    Re,
-    {
-      bottomComponent: /* @__PURE__ */ e(
-        u,
-        {
-          sx: {
-            flexDirection: "row",
-            height: 24,
-            justifyContent: "space-between",
-            mt: 2,
-            px: 1
-          },
-          children: ["0 Mo", "1 Mo", "2 Mo", "3 Mo", "4 Mo", "5 Mo", "6 Mo"].map((p) => /* @__PURE__ */ a(
-            u,
-            {
-              sx: {
-                alignItems: "center",
-                height: 24
-              },
-              children: [
-                /* @__PURE__ */ e(
-                  ne,
-                  {
-                    orientation: "vertical",
-                    sx: {
-                      borderWidth: 1,
-                      height: 8
-                    }
-                  }
-                ),
-                /* @__PURE__ */ e(A, { variant: "XSmall", children: p })
-              ]
-            },
-            p
-          ))
-        }
-      ),
-      label: t.key_indicators_save.drawer_progress_bar_label,
-      status: r,
-      statusBarData: [
-        {
-          percentage: `${d}%`
-        }
-      ],
-      value: X(t.key_indicators_save.drawer_progress_bar_value, s, i)
-    }
-  );
-}, er = S(Jo), tr = () => {
-  const { healthScore: t } = R(), { finstrong: o } = v(), n = ke(t.debt_to_income_ratio) ?? 0, r = Object.keys(t).length === 0, s = ((i) => r ? "MISSING" : i <= 30 ? "GOOD" : i >= 31 && i <= 39 ? "FAIR" : i >= 40 ? "OFF_TRACK" : "MISSING")(n);
-  return /* @__PURE__ */ e(
-    Re,
-    {
-      bottomComponent: /* @__PURE__ */ a(
-        u,
-        {
-          sx: {
-            alignItems: "flex-end",
-            flexDirection: "row",
-            height: 24,
-            justifyContent: "space-between",
-            mt: 2,
-            position: "relative"
-          },
-          children: [
-            /* @__PURE__ */ e(
-              C,
-              {
-                sx: {
-                  left: "30%",
-                  position: "absolute",
-                  transform: "translateX(-50%)"
-                },
-                children: /* @__PURE__ */ a(
-                  u,
-                  {
-                    sx: {
-                      alignItems: "center",
-                      flexDirection: "column",
-                      height: 24,
-                      justifyContent: "flex-end"
-                    },
-                    children: [
-                      /* @__PURE__ */ e(
-                        ne,
-                        {
-                          orientation: "vertical",
-                          sx: {
-                            borderWidth: 1,
-                            height: 8
-                          }
-                        }
-                      ),
-                      /* @__PURE__ */ e(A, { sx: { color: "text.primary" }, variant: "XSmall", children: "30%" })
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ e(
-              C,
-              {
-                sx: {
-                  display: "flex",
-                  flexDirection: "column",
-                  height: 24,
-                  justifyContent: "center",
-                  marginLeft: "auto"
-                },
-                children: /* @__PURE__ */ e(A, { variant: "Small", children: X(
-                  o.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_sticky_description,
-                  n
-                ) })
-              }
-            )
-          ]
-        }
-      ),
-      label: o.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_sticky_title,
-      status: s,
-      statusBarData: [
-        {
-          percentage: `${n}%`
-        }
-      ],
-      value: B(t.ninety_day_debt_spend, "0,0.00")
-    }
-  );
-}, nr = S(tr), or = () => {
-  const { healthScore: t, allTransactions: o } = R(), { connect: n, finstrong: r } = v(), [l, s] = h.useState(!1);
-  return /* @__PURE__ */ a(u, { gap: 16, sx: { p: 16 }, children: [
-    /* @__PURE__ */ e(
-      me,
-      {
-        balance: t.ninety_day_income,
-        sx: { flexDirection: "column-reverse" },
-        title: r.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_income
-      }
-    ),
-    o.income.length ? (
-      // TODO: Need to add More Transactions functionality
-      /* @__PURE__ */ e(Fe, { transactions: o.income.map((i) => i.transaction) })
-    ) : /* @__PURE__ */ e(
-      $,
-      {
-        onClick: () => {
-          s(!0);
-        },
-        variant: "contained",
-        children: r.connect_more_accounts_button
-      }
-    ),
-    /* @__PURE__ */ e(
-      oe,
-      {
-        onClose: () => s(!1),
-        showConnectWidget: l,
-        title: n.mini_title
-      }
-    )
-  ] });
-}, rr = S(or), ar = () => {
-  const { allTransactions: t, healthScore: o } = R(), { connect: n, finstrong: r } = v(), [l, s] = h.useState(!1);
-  return /* @__PURE__ */ a(u, { gap: 16, sx: { p: 16 }, children: [
-    /* @__PURE__ */ e(
-      me,
-      {
-        balance: o.ninety_day_debt_spend,
-        sx: { flexDirection: "column-reverse" },
-        title: r.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_payments
-      }
-    ),
-    t.debtSpend.length ? (
-      //TODO: Need to add More Transactions functionality
-      /* @__PURE__ */ e(
-        Fe,
-        {
-          amountColor: "text.primary",
-          transactions: t.debtSpend.map((i) => i.transaction)
-        }
-      )
-    ) : /* @__PURE__ */ e(
-      $,
-      {
-        onClick: () => {
-          s(!0);
-        },
-        variant: "contained",
-        children: r.connect_more_accounts_button
-      }
-    ),
-    /* @__PURE__ */ e(
-      oe,
-      {
-        onClose: () => s(!1),
-        showConnectWidget: l,
-        title: n.mini_title
-      }
-    )
-  ] });
-}, ir = S(ar), sr = ({
-  color: t,
-  data: o,
-  series: n,
-  style: r,
-  ...l
-}) => {
-  const s = E(), i = h.useRef(null), { width: d } = jn({
-    width: r.width
-  });
-  h.useLayoutEffect(() => {
-    const m = new ResizeObserver(() => {
-      window.requestAnimationFrame(() => {
-        if (i.current) {
-          const { width: g } = i.current.getBoundingClientRect(), b = g / 2, w = i.current.querySelector("text");
-          w && w.setAttribute("transform", `translate(${b}, -8)`);
-        }
-      });
-    });
-    return i.current && m.observe(i.current), () => {
-      i.current && m.unobserve(i.current);
-    };
-  }, []);
-  const { formattedComparison: c, formattedMain: p } = o[n.index], _ = n.type === 0 ? p : c;
-  return /* @__PURE__ */ a("g", { children: [
-    /* @__PURE__ */ e(ot.rect, { ...l, fill: t, ref: i, rx: 2, style: r }),
-    /* @__PURE__ */ e(
-      ot.text,
-      {
-        fill: s.palette.text.secondary,
-        fontSize: 9,
-        fontWeight: 400,
-        textAnchor: "middle",
-        transform: d.to((m) => `translate(${m / 2}, -5)`),
-        x: r.x,
-        y: r.y,
-        children: _
-      }
-    )
-  ] });
-}, Wt = ({
-  chartFor: t,
-  data: o,
-  title: n,
-  buttonLabel: r,
-  onClick: l,
-  legendLabelMain: s,
-  legendLabelComparison: i,
-  totalComparison: d,
-  totalMain: c
-}) => {
-  const p = E(), _ = Gn(p.breakpoints.down("xs")), m = h.useMemo(
-    () => o.sort((y, k) => y.month - k.month).map((y) => {
-      const k = gn(y.month), D = {
-        spending_vs_income: {
-          main: y.standard_spend,
-          comparison: y.income,
-          formattedMain: B(y.standard_spend, "0.0a"),
-          formattedComparison: B(y.income, "0.0a")
-        },
-        debt_payment_vs_income: {
-          main: y.income,
-          comparison: y.debt_spend,
-          formattedMain: B(y.income, "0.0a"),
-          formattedComparison: B(y.debt_spend, "0.0a")
-        }
-      };
-      return {
-        label: k,
-        ...D[t]
-      };
-    }),
-    [o, t]
-  ), g = {
-    dataKey: "label",
-    scaleType: "band"
-  }, b = Math.max(...m.map((y) => Math.max(y.main, y.comparison))), w = Math.ceil(b * 1.2 / 1e3) * 1e3, f = w / 3, x = {
-    scaleType: "linear",
-    min: 0,
-    max: w,
-    tickNumber: 4,
-    tickMinStep: f,
-    valueFormatter: (y) => y === 0 ? "$0" : `$${(y / 1e3).toFixed(0)}K`
-  };
-  return /* @__PURE__ */ a(
-    j,
-    {
-      sx: {
-        px: 16,
-        py: 24
-      },
-      children: [
-        /* @__PURE__ */ a(
-          u,
-          {
-            sx: {
-              alignItems: "center",
-              flexDirection: "row",
-              justifyContent: "space-between",
-              gap: 12,
-              pb: 8
-            },
-            children: [
-              /* @__PURE__ */ e(K, { children: n }),
-              r && /* @__PURE__ */ e(
-                $,
-                {
-                  endIcon: /* @__PURE__ */ e(Z, {}),
-                  onClick: l,
-                  size: "small",
-                  sx: {
-                    pl: 8,
-                    height: 24
-                  },
-                  variant: "text",
-                  children: r
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ a(u, { sx: { alignItems: "center", flexDirection: "row", gap: 24, py: 4 }, children: [
-          /* @__PURE__ */ a(u, { sx: { gap: 8, alignItems: "center", flexDirection: "row" }, children: [
-            /* @__PURE__ */ e(
-              C,
-              {
-                sx: {
-                  width: 10,
-                  height: 10,
-                  backgroundColor: "chart.chart3",
-                  borderRadius: "2px"
-                }
-              }
-            ),
-            /* @__PURE__ */ a(u, { sx: { alignItems: "center", flexDirection: "row" }, children: [
-              /* @__PURE__ */ a(A, { variant: "subtitle2", children: [
-                s,
-                " "
-              ] }),
-              !_ && c && /* @__PURE__ */ e(A, { bold: !0, variant: "subtitle2", children: c })
-            ] })
-          ] }),
-          /* @__PURE__ */ a(u, { alignItems: "center", direction: "row", spacing: 8, children: [
-            /* @__PURE__ */ e(
-              C,
-              {
-                sx: {
-                  width: 10,
-                  height: 10,
-                  backgroundColor: "chart.chart5",
-                  borderRadius: "2px"
-                }
-              }
-            ),
-            /* @__PURE__ */ a(u, { sx: { alignItems: "center", flexDirection: "row" }, children: [
-              /* @__PURE__ */ a(A, { variant: "subtitle2", children: [
-                i,
-                " "
-              ] }),
-              !_ && d && /* @__PURE__ */ e(A, { bold: !0, variant: "subtitle2", children: d })
-            ] })
-          ] })
-        ] }),
-        /* @__PURE__ */ a(
-          Kn,
-          {
-            colors: [`${p.palette.chart.chart3}`, `${p.palette.chart.chart5}`],
-            dataset: m,
-            height: 240,
-            margin: { top: 20, bottom: 30, right: 10 },
-            series: [
-              { dataKey: "main", type: "bar" },
-              { dataKey: "comparison", type: "bar" }
-            ],
-            xAxis: [g],
-            yAxis: [x],
-            children: [
-              /* @__PURE__ */ e(
-                Yt,
-                {
-                  slots: {
-                    bar: (y) => {
-                      const { ownerState: k, style: D, ...I } = y;
-                      return /* @__PURE__ */ e(
-                        sr,
-                        {
-                          ...I,
-                          color: k.color,
-                          data: m,
-                          series: {
-                            index: k.dataIndex,
-                            type: Number(k.id.toString().split("-").pop())
-                          },
-                          style: D
-                        }
-                      );
-                    }
-                  }
-                }
-              ),
-              /* @__PURE__ */ e(
-                Hn,
-                {
-                  sx: () => ({
-                    ".MuiChartsAxis-line": {
-                      stroke: p.palette.divider
-                    },
-                    ".MuiChartsAxis-tick": {
-                      stroke: p.palette.divider
-                    },
-                    ".MuiChartsAxis-tickLabel": {
-                      transform: "translateY(10px)"
-                    }
-                  }),
-                  tickLabelStyle: {
-                    fontSize: 11,
-                    fill: "text.secondary"
-                  }
-                }
-              ),
-              /* @__PURE__ */ e(
-                Nn,
-                {
-                  sx: () => ({
-                    ".MuiChartsAxis-line": {
-                      stroke: p.palette.divider
-                    },
-                    ".MuiChartsAxis-tick": {
-                      stroke: p.palette.divider
-                    },
-                    ".MuiChartsAxis-tickLabel": {
-                      transform: "translateX(-8px)"
-                    }
-                  }),
-                  tickLabelStyle: {
-                    fontSize: 11,
-                    fill: "text.secondary"
-                  }
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-}, cr = () => {
-  const { loadDebtSpend: t, loadIncome: o, monthlySummaries: n } = R(), { isInitialized: r } = V(), [l, s] = h.useState(0), { finstrong: i } = v();
-  return h.useEffect(() => {
-    r && (t().finally(), o().finally());
-  }, [r]), /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ a(j, { children: [
-      /* @__PURE__ */ a(
-        Ke,
-        {
-          "aria-label": i.key_indicators_save.drawer_title,
-          centered: !0,
-          onChange: (d, c) => s(c),
-          sx: { mb: 0 },
-          value: l,
-          variant: "fullWidth",
-          children: [
-            /* @__PURE__ */ e(
-              ae,
-              {
-                "aria-controls": "income-details-tabpanel-0",
-                id: "income-details-tab-0",
-                label: i.key_indicators_borrow.have_manageable_debt_drawer.income,
-                sx: { minHeight: 44 }
-              }
-            ),
-            /* @__PURE__ */ e(
-              ae,
-              {
-                "aria-controls": "debt-payment-details-tabpanel-1",
-                id: "debt-payment-details-tab-1",
-                label: i.key_indicators_borrow.have_manageable_debt_drawer.debt_payment,
-                sx: { minHeight: 44 }
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        ie,
-        {
-          "aria-labelledby": "income-details-tab-0",
-          index: 0,
-          name: "income-details",
-          value: l,
-          children: /* @__PURE__ */ e(rr, {})
-        }
-      ),
-      /* @__PURE__ */ e(
-        ie,
-        {
-          "aria-labelledby": "debt-payment-details-tab-1",
-          index: 1,
-          name: "debt-payment-details",
-          value: l,
-          children: /* @__PURE__ */ e(ir, {})
-        }
-      )
-    ] }),
-    n.length ? /* @__PURE__ */ a(z, { children: [
-      /* @__PURE__ */ e(
-        Wt,
-        {
-          chartFor: "debt_payment_vs_income",
-          data: n,
-          legendLabelComparison: i.key_indicators_borrow.have_manageable_debt_drawer.debt_payment,
-          legendLabelMain: i.key_indicators_borrow.have_manageable_debt_drawer.income,
-          title: i.key_indicators_borrow.have_manageable_debt_drawer.debt_payment
-        }
-      ),
-      /* @__PURE__ */ e(Ye, { chartFor: "debtOverTime" })
-    ] }) : /* @__PURE__ */ a(z, { children: [
-      /* @__PURE__ */ e(
-        Ae,
-        {
-          header: i.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_double_bar_chart_empty_state_header,
-          icon: "multiline_chart",
-          subText: i.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_double_bar_chart_empty_state_description,
-          sx: {
-            backgroundColor: "background.paper",
-            borderRadius: "8px",
-            boxShadow: 1,
-            p: 24,
-            pb: 48
-          },
-          variant: "no-buttons"
-        }
-      ),
-      /* @__PURE__ */ e(
-        Ae,
-        {
-          header: i.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_line_chart_empty_state_header,
-          icon: "multiline_chart",
-          subText: i.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_line_chart_empty_state_description,
-          sx: {
-            backgroundColor: "background.paper",
-            borderRadius: "8px",
-            boxShadow: 1,
-            p: 24,
-            pb: 48
-          },
-          variant: "no-buttons"
-        }
-      )
-    ] })
-  ] });
-}, lr = S(cr), dr = () => {
-  const { healthScore: t } = R(), { finstrong: o } = v(), n = ke(t.spend_to_income_ratio) ?? 0, r = Object.keys(t).length === 0, s = ((d) => r ? "MISSING" : d < 100 ? "GOOD" : d >= 100 && d <= 109 ? "FAIR" : d >= 110 ? "OFF_TRACK" : "MISSING")(n), i = {
-    GOOD: [{ percentage: `${n}%` }],
-    FAIR: [{ percentage: "100%" }, { percentage: `${n - 100}%` }],
-    OFF_TRACK: [{ percentage: "100%" }, { percentage: `${n - 100}%` }],
-    MISSING: [{ percentage: "0%" }]
-  }[s];
-  return /* @__PURE__ */ e(
-    Re,
-    {
-      bottomComponent: /* @__PURE__ */ a(
-        u,
-        {
-          sx: {
-            flexDirection: "row",
-            justifyContent: "space-between",
-            alignItems: "center",
-            mt: 8
-          },
-          children: [
-            /* @__PURE__ */ a(A, { variant: "body2", children: [
-              r ? "-" : B(t.ninety_day_income, "0,0.00"),
-              " ",
-              o?.key_indicators_spend.spend_less_than_you_make_drawer.income
-            ] }),
-            /* @__PURE__ */ a(A, { variant: "body2", children: [
-              r ? "-%" : `${n}%`,
-              o?.key_indicators_spend.spend_less_than_you_make_drawer.spent
-            ] })
-          ]
-        }
-      ),
-      label: o?.key_indicators_spend.spend_less_than_you_make_drawer.spend_less_than_you_make_sticky_description,
-      status: s,
-      statusBarData: i,
-      value: r ? "$0" : B(t.ninety_day_spend, "0,0.00")
-    }
-  );
-}, pr = S(dr), ur = () => {
-  const t = E(), { monthlySummaries: o } = R(), { finstrong: n, goals: r, spending: l } = v(), { selectedAccounts: s } = V(), { categories: i, dateRangeCategoryTotals: d, loadDateRangeCategoryTotals: c } = He(), { appDataStore: p } = wn(), [_, m] = h.useState("");
-  h.useEffect(() => {
-    c(
-      s,
-      It(/* @__PURE__ */ new Date()),
-      Tt(/* @__PURE__ */ new Date())
-    ).finally();
-  }, [s]);
-  const g = h.useMemo(
-    () => Vn(i, r, t, d),
-    [i, d]
-  ), b = (x) => {
-    m(_ === x ? "" : x);
-  }, { totalSpending: w, totalIncome: f } = h.useMemo(() => o?.reduce(
-    (x, { standard_spend: y = 0, income: k = 0 }) => ({
-      totalSpending: x.totalSpending + y,
-      totalIncome: x.totalIncome + k
-    }),
-    { totalSpending: 0, totalIncome: 0 }
-  ), [o]);
-  return /* @__PURE__ */ a(u, { sx: { gap: 24 }, children: [
-    o.length ? /* @__PURE__ */ e(
-      Wt,
-      {
-        ...p.appData.client_profile?.allow_trends_widget && {
-          buttonLabel: n.key_indicators_spend.spend_less_than_you_make_drawer.view_more
-        },
-        chartFor: "spending_vs_income",
-        data: o,
-        legendLabelComparison: n.key_indicators_spend.spend_less_than_you_make_drawer.income,
-        legendLabelMain: n.key_indicators_spend.spend_less_than_you_make_drawer.spending,
-        title: n.key_indicators_spend.spend_less_than_you_make_drawer.trends,
-        totalComparison: B(f, "0,0.00"),
-        totalMain: B(w, "0,0.00")
-      }
-    ) : /* @__PURE__ */ e(
-      Ae,
-      {
-        header: n.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_title,
-        icon: "multiline_chart",
-        subText: n.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_description,
-        sx: {
-          backgroundColor: "background.paper",
-          borderRadius: "8px",
-          boxShadow: 1,
-          p: 24,
-          pb: 48
-        },
-        variant: "no-buttons"
-      }
-    ),
-    g ? /* @__PURE__ */ a(
-      j,
-      {
-        sx: {
-          px: 16,
-          py: 24
-        },
-        children: [
-          /* @__PURE__ */ a(
-            u,
-            {
-              sx: {
-                alignItems: "center",
-                flexDirection: "row",
-                justifyContent: "space-between",
-                gap: 12,
-                pb: 8
-              },
-              children: [
-                /* @__PURE__ */ e(K, { children: n.key_indicators_spend.spend_less_than_you_make_drawer.spending }),
-                p.appData.client_profile?.allow_spending_widget && /* @__PURE__ */ e(
-                  $,
-                  {
-                    endIcon: /* @__PURE__ */ e(Z, {}),
-                    size: "small",
-                    sx: {
-                      pl: 8,
-                      height: 24
-                    },
-                    variant: "text",
-                    children: n.key_indicators_spend.spend_less_than_you_make_drawer.view_more
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ a(u, { sx: { gap: 12, py: 16, flexDirection: "row", justifyContent: "center" }, children: [
-            /* @__PURE__ */ e(
-              Yn,
-              {
-                data: g,
-                onSelected: b,
-                selectedId: _,
-                totalLabel: l.total_spending
-              }
-            ),
-            /* @__PURE__ */ e(
-              Xn,
-              {
-                data: g,
-                onSelected: b,
-                selectedId: _
-              }
-            )
-          ] })
-        ]
-      }
-    ) : /* @__PURE__ */ e(
-      Ae,
-      {
-        header: n.key_indicators_spend.spend_less_than_you_make_drawer.spending_zero_state_title,
-        icon: "donut_small",
-        subText: n.key_indicators_spend.spend_less_than_you_make_drawer.spending_zero_state_description,
-        sx: {
-          backgroundColor: "background.paper",
-          borderRadius: "8px",
-          boxShadow: 1,
-          p: 24,
-          pb: 48
-        },
-        variant: "no-buttons"
-      }
-    )
-  ] });
-}, _r = S(ur), Le = {
-  credit_score_description: "Credit scores usually go from 300 to 850. Think of 700+ as good, 800+ as awesome, and below 600 as needing work. You can often check yours for free with your bank or credit card company.",
-  maintain_emergency_savings_description: "With at least $1,000 saved, you're ready for surprises, freeing you to save for major goals.",
-  maintain_emergency_savings_title: "Maintain Emergency Savings"
-}, hr = ({
-  drawerFor: t,
-  isOpen: o,
-  onClose: n
-}) => {
-  const { finstrong: r } = v(), s = {
-    spendLessThanYouMake: {
-      title: r.key_indicators_spend.spend_less_than_you_make_drawer.spend_less_than_you_make_title,
-      description: r.key_indicators_spend.spend_less_than_you_make_drawer.spend_less_than_you_make_description,
-      stickyComponent: /* @__PURE__ */ e(pr, {}),
-      content: /* @__PURE__ */ e(_r, {}),
-      drawerType: "connectDrawer",
-      connectTitle: r.connect_your_accounts,
-      connectDescription: r.connect_more_accounts_to_unlock_a_fuller_understanding_of_your_finances
-    },
-    payBillsOnTime: {
-      title: r.key_indicators_spend.pay_bills_on_time_drawer.pay_bills_on_time_title,
-      description: r.key_indicators_spend.pay_bills_on_time_drawer.pay_bills_on_time_description,
-      stickyComponent: /* @__PURE__ */ e(Vo, {}),
-      content: /* @__PURE__ */ e(Ko, {}),
-      drawerType: "connectDrawer",
-      connectTitle: r.connect_your_accounts,
-      connectDescription: r.connect_more_accounts_to_unlock_a_fuller_understanding_of_your_finances
-    },
-    maintainEmergencySavings: {
-      content: /* @__PURE__ */ e(Lo, {}),
-      description: Le.maintain_emergency_savings_description,
-      stickyComponent: /* @__PURE__ */ e(Eo, {}),
-      title: Le.maintain_emergency_savings_title,
-      drawerType: "connectDrawer",
-      connectTitle: r.connect_your_accounts,
-      connectDescription: r.connect_more_accounts_to_unlock_a_fuller_understanding_of_your_finances
-    },
-    haveManageableDebt: {
-      title: r.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_title,
-      description: r.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_description,
-      stickyComponent: /* @__PURE__ */ e(nr, {}),
-      content: /* @__PURE__ */ e(lr, {}),
-      drawerType: "connectDrawer",
-      connectTitle: r.dont_see_all_your_accounts,
-      connectDescription: r.connect_more_accounts_to_view_more_accurate_financial_picture
-    },
-    haveAGoodCreditScore: {
-      title: /* @__PURE__ */ e(Mo, {}),
-      description: Le.credit_score_description,
-      stickyComponent: null,
-      content: /* @__PURE__ */ e(vo, {})
-    },
-    saveEnoughToLiveOn: {
-      title: r.key_indicators_save.drawer_title,
-      description: r.key_indicators_save.drawer_description,
-      stickyComponent: /* @__PURE__ */ e(er, {}),
-      content: /* @__PURE__ */ e(Qo, {}),
-      drawerType: "connectDrawer",
-      connectTitle: r.dont_see_all_your_accounts,
-      connectDescription: r.connect_more_accounts_to_view_more_accurate_financial_picture
-    }
-  }[t];
-  return /* @__PURE__ */ e(
-    Bt,
-    {
-      connectDescription: s?.connectDescription,
-      connectTitle: s?.connectTitle,
-      description: s?.description,
-      drawerTitle: r.key_indicators,
-      drawerType: s.drawerType,
-      isOpen: o,
-      loadConnectAccountsCard: !0,
-      onClose: n,
-      stickyComponent: s.stickyComponent,
-      title: s.title,
-      children: /* @__PURE__ */ e(u, { sx: { gap: 16 }, children: s.content })
-    }
-  );
-}, mr = S(hr), he = ({
-  drawerFor: t,
-  title: o,
-  description: n,
-  cardState: r = "MISSING"
-}) => {
-  const [l, s] = h.useState(!1);
-  return /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ a(
-      u,
-      {
-        onClick: () => s(!0),
-        sx: {
-          alignItems: "center",
-          flexDirection: "row",
-          justifyContent: "space-between",
-          gap: 12,
-          p: 16,
-          border: "1px solid",
-          borderColor: "divider",
-          borderRadius: 2,
-          cursor: "pointer"
-        },
-        children: [
-          /* @__PURE__ */ a(u, { sx: { gap: 4 }, children: [
-            /* @__PURE__ */ a(u, { sx: { alignItems: "center", flexDirection: "row", gap: 8 }, children: [
-              /* @__PURE__ */ e(M, { sx: { fontWeight: 600 }, variant: "body1", children: o }),
-              /* @__PURE__ */ e(Oe, { status: r })
-            ] }),
-            /* @__PURE__ */ e(M, { color: "secondary", variant: "subtitle2", children: n })
-          ] }),
-          /* @__PURE__ */ e(Z, { color: "secondary", size: 24 })
-        ]
-      }
-    ),
-    /* @__PURE__ */ e(
-      mr,
-      {
-        drawerFor: t,
-        isOpen: l,
-        onClose: () => s(!1)
-      }
-    )
-  ] });
-}, gr = () => {
-  const { finstrong: t } = v(), { key_indicators_spend: o } = t, { healthScore: n } = R(), r = (i) => {
-    const d = bn(i), c = {
-      GOOD: o.ratio_good_description,
-      FAIR: o.ratio_fair_description,
-      OFF_TRACK: o.ratio_off_track_description,
-      MISSING: o.ratio_missing_description
-    }, p = d === "MISSING" ? c[d] : X(c[d], i);
-    return {
-      cardState: d,
-      description: p,
-      title: o.ratio_card_title
-    };
-  }, { spendToIncomeRatio: l, spendFeeCount: s } = h.useMemo(() => {
-    const i = n.spend_to_income_ratio !== null ? Math.round(n.spend_to_income_ratio * 100) : null, d = r(i), c = yn(
-      n.spending_fee_transaction_count,
-      o
-    );
-    return { spendToIncomeRatio: d, spendFeeCount: c };
-  }, [
-    n.spend_to_income_ratio,
-    n.spending_fee_transaction_count,
-    o,
-    t
-  ]);
-  return /* @__PURE__ */ a(u, { sx: { gap: 24, p: 8, pt: 24 }, children: [
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: l.cardState,
-        description: l.description,
-        drawerFor: se.SpendLessThanYouMake,
-        title: l.title
-      }
-    ),
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: s.cardState,
-        description: s.description,
-        drawerFor: se.PayBillsOnTime,
-        title: s.title
-      }
-    )
-  ] });
-}, yr = S(gr), br = () => {
-  const { healthScore: t } = R(), { finstrong: o } = v(), { key_indicators_save: n } = o, r = (d) => {
-    const c = bt(d), p = {
-      GOOD: n.days_of_cash_good_description,
-      FAIR: n.days_of_cash_fair_description,
-      OFF_TRACK: n.days_of_cash_off_track_description,
-      MISSING: n.days_of_cash_missing_description
-    }, _ = c === "MISSING" ? p[c] : X(p[c], d);
-    return {
-      cardState: c,
-      description: _,
-      title: n.days_of_cash_title
-    };
-  }, l = (d) => {
-    const c = yt(d), p = {
-      GOOD: n.emergency_savings_good_description,
-      FAIR: n.emergency_savings_fair_description,
-      OFF_TRACK: n.emergency_savings_off_track_description,
-      MISSING: n.emergency_savings_missing_description
-    };
-    let _;
-    return c === "FAIR" && d !== null ? _ = X(
-      p[c],
-      B(d, "0,0.00")
-    ) : _ = p[c], {
-      cardState: c,
-      description: _,
-      title: n.emergency_savings_title
-    };
-  }, { daysOfCashOnHand: s, emergencySavings: i } = h.useMemo(() => {
-    const d = t.months_of_cash_on_hand !== null ? Math.round(t.months_of_cash_on_hand * 30) : null, c = r(d), p = t.emergency_savings_on_hand !== null ? Math.round(t.emergency_savings_on_hand) : null, _ = l(p);
-    return { daysOfCashOnHand: c, emergencySavings: _ };
-  }, [
-    t.months_of_cash_on_hand,
-    t.emergency_savings_on_hand,
-    n,
-    o
-  ]);
-  return /* @__PURE__ */ a(u, { direction: "column", gap: 24, sx: { p: 8, pt: 24 }, children: [
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: s.cardState,
-        description: s.description,
-        drawerFor: se.SaveEnoughToLiveOn,
-        title: s.title
-      }
-    ),
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: i.cardState,
-        description: i.description,
-        drawerFor: se.MaintainEmergencySavings,
-        title: i.title
-      }
-    )
-  ] });
-}, fr = S(br), xr = () => {
-  const { healthScore: t } = R(), { finstrong: o } = v(), { key_indicators_borrow: n } = o, { user: r } = Q(), l = (c) => {
-    const p = fn(c), _ = {
-      GOOD: n.manage_debit_good_description,
-      FAIR: n.manage_debit_fair_description,
-      OFF_TRACK: n.manage_debit_off_track_description,
-      MISSING: n.manage_debit_missing_description
-    }, m = p === "FAIR" || p === "OFF_TRACK" ? X(_[p], c) : _[p];
-    return {
-      cardState: p,
-      description: m,
-      title: n.manage_debit_title
-    };
-  }, s = (c) => {
-    const p = gt(c), _ = {
-      GOOD: n.credit_score_good_description,
-      FAIR: n.credit_score_fair_description,
-      OFF_TRACK: n.credit_score_off_track_description,
-      MISSING: n.credit_score_missing_description
-    }, m = p === "MISSING" ? _[p] : X(_[p], c);
-    return {
-      cardState: p,
-      description: m,
-      title: n.credit_score_title
-    };
-  }, { manageDebtStatus: i, creditScoreStatus: d } = h.useMemo(() => {
-    const c = t.debt_to_income_ratio !== null ? Math.round(t.debt_to_income_ratio * 100) : null, p = l(c), _ = s(r.credit_score || null);
-    return {
-      manageDebtStatus: p,
-      creditScoreStatus: _
-    };
-  }, [t.debt_to_income_ratio, r.credit_score, n, o]);
-  return /* @__PURE__ */ a(u, { direction: "column", gap: 24, sx: { p: 8, pt: 24 }, children: [
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: i.cardState,
-        description: i.description,
-        drawerFor: se.HaveManageableDebt,
-        title: i.title
-      }
-    ),
-    /* @__PURE__ */ e(
-      he,
-      {
-        cardState: d.cardState,
-        description: d.description,
-        drawerFor: se.HaveAGoodCreditScore,
-        title: d.title
-      }
-    )
-  ] });
-}, Sr = S(xr), Cr = () => {
-  const [t, o] = h.useState(0), { finstrong: n } = v();
-  return /* @__PURE__ */ a(z, { children: [
-    /* @__PURE__ */ a(
-      Ke,
-      {
-        "aria-label": "Key Indicators",
-        centered: !0,
-        onChange: (r, l) => o(l),
-        sx: {
-          mb: 0,
-          "& .MuiTab-root": {
-            minWidth: 0
-          }
-        },
-        textColor: "primary",
-        value: t,
-        variant: "fullWidth",
-        children: [
-          /* @__PURE__ */ e(
-            ae,
-            {
-              "aria-controls": "spend-details-tabpanel-0",
-              icon: /* @__PURE__ */ e(Ee, { sx: { mr: 8 } }),
-              iconPosition: "start",
-              id: "spend-details-tab-0",
-              label: n.key_indicators_spend.title,
-              sx: { minHeight: 44 }
-            }
-          ),
-          /* @__PURE__ */ e(
-            ae,
-            {
-              "aria-controls": "save-details-tabpanel-1",
-              icon: /* @__PURE__ */ e(Qt, { sx: { mr: 8 } }),
-              iconPosition: "start",
-              id: "save-details-tab-1",
-              label: n.key_indicators_save.title,
-              sx: { minHeight: 44 }
-            }
-          ),
-          /* @__PURE__ */ e(
-            ae,
-            {
-              "aria-controls": "borrow-details-tabpanel-2",
-              icon: /* @__PURE__ */ e(Jt, { sx: { mr: 8 } }),
-              iconPosition: "start",
-              id: "borrow-details-tab-2",
-              label: n.key_indicators_borrow.title,
-              sx: { minHeight: 44 }
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ e(ie, { index: 0, name: "spend-details", value: t, children: /* @__PURE__ */ e(yr, {}) }),
-    /* @__PURE__ */ e(ie, { index: 1, name: "save-details", value: t, children: /* @__PURE__ */ e(fr, {}) }),
-    /* @__PURE__ */ e(ie, { index: 2, name: "borrow-details", value: t, children: /* @__PURE__ */ e(Sr, {}) })
-  ] });
-}, vr = S(Cr), wr = ({ onClick: t }) => {
-  const { finstrong: o } = v(), { isCopyLoaded: n } = V();
-  return n ? /* @__PURE__ */ a(u, { sx: { alignItems: "center", gap: 12, pt: 12, pb: 32 }, children: [
-    /* @__PURE__ */ e(ut, { size: 48 }),
-    /* @__PURE__ */ a(u, { sx: { alignItems: "center", gap: 4, textAlign: "center" }, children: [
-      /* @__PURE__ */ e(K, { children: o.missing_data_title }),
-      /* @__PURE__ */ e(M, { sx: { width: { sm: 348 } }, variant: "subtitle1", children: o.missing_data_description })
-    ] }),
-    /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-      $,
-      {
-        endIcon: /* @__PURE__ */ e(Z, {}),
-        onClick: t,
-        size: "small",
-        sx: {
-          fontSize: 13,
-          ":hover": {
-            bgcolor: "transparent"
-          }
-        },
-        variant: "text",
-        children: o.connect_more_accounts_button
-      }
-    ) })
-  ] }) : /* @__PURE__ */ e(J, {});
-}, kr = S(wr), Mr = {
-  add_more_income: "Add More Income"
-}, Dr = ({
-  incomeTransactions: t,
-  setCurrentStep: o,
-  transaction: n
-}) => /* @__PURE__ */ a(h.Fragment, { children: [
-  /* @__PURE__ */ a(u, { children: [
-    !!t.length && /* @__PURE__ */ e(C, { sx: { pb: 24 }, children: t.reduce((r, l, s) => {
-      if (l.guid === n.guid) return r;
-      const i = ze(s, t), d = Mt(s, t);
-      return r.push(
-        /* @__PURE__ */ a(h.Fragment, { children: [
-          i && /* @__PURE__ */ e(Dt, { children: Ve(l.date) }),
-          /* @__PURE__ */ e(At, { transaction: l }),
-          /* @__PURE__ */ e(ne, { sx: { ml: d ? 44 : 0 } })
-        ] }, l.guid)
-      ), r;
-    }, []) }),
-    /* @__PURE__ */ e(
-      qn,
-      {
-        firstDay: 1,
-        frequency: Fn.EveryMonth,
-        onFirstDayChange: () => {
-        },
-        onFrequencyChange: () => {
-        },
-        onSecondDayChange: () => {
-        },
-        secondDay: 15,
-        transaction: n
-      }
-    )
-  ] }),
-  /* @__PURE__ */ e(C, { sx: { px: 24 }, children: /* @__PURE__ */ e(
-    $,
-    {
-      fullWidth: !0,
-      onClick: () => o({ step: O.MonthlyIncome, type: "main" }),
-      startIcon: /* @__PURE__ */ e(_t, {}),
-      children: Mr.add_more_income
-    }
-  ) })
-] }), Ar = S(Dr), Ir = {
-  select_date: "Select Date"
-}, Tr = ({ selectedDate: t, setSelectedDate: o }) => {
-  const n = E(), r = (l) => {
-    o(Math.floor(new Date(l).getTime() / 1e3));
-  };
-  return /* @__PURE__ */ e(C, { sx: { p: 24 }, children: /* @__PURE__ */ e(Jn, { dateAdapter: Ot, children: /* @__PURE__ */ e(
-    eo,
-    {
-      disableFuture: !0,
-      label: Ir.select_date,
-      onChange: r,
-      slotProps: {
-        nextIconButton: {
-          sx: {
-            color: "primary.main",
-            "&:hover": { bgcolor: _e(n.palette.primary.light, 0.1) }
-          }
-        },
-        previousIconButton: {
-          sx: {
-            color: "primary.main",
-            "&:hover": { bgcolor: _e(n.palette.primary.light, 0.1) }
-          }
-        }
-      },
-      sx: {
-        width: "100%",
-        "& .MuiIconButton-edgeEnd": {
-          color: "primary.main",
-          "&:hover": { bgcolor: _e(n.palette.primary.light, 0.1) }
-        }
-      },
-      value: t ? new Date(t * 1e3) : null
-    }
-  ) }) });
-}, Or = S(Tr), Rr = {
-  credit_score: "Credit Score"
-}, Fr = ({ creditScore: t, setCreditScore: o }) => {
-  const n = !isNaN(t);
-  return /* @__PURE__ */ e(C, { sx: { p: 24 }, children: /* @__PURE__ */ e(
-    Me,
-    {
-      error: !n,
-      fullWidth: !0,
-      inputMode: "numeric",
-      inputProps: {
-        noValidate: !0,
-        pattern: "[0-9]*"
-      },
-      label: Rr.credit_score,
-      onChange: (r) => o(Number(r.target.value)),
-      value: n ? t : ""
-    }
-  ) });
-}, Pr = S(Fr), zt = ({ value: t, completeCopy: o }) => /* @__PURE__ */ a(u, { sx: { gap: 8 }, children: [
-  /* @__PURE__ */ e(u, { sx: { flexDirection: "row", gap: 4 }, children: Array.from({ length: 4 }).map((n, r) => /* @__PURE__ */ e(
-    C,
-    {
-      sx: {
-        bgcolor: r < t ? "primary.main" : "neutral.light",
-        borderRadius: "24px",
-        height: 4,
-        width: "100%"
-      }
-    },
-    r
-  )) }),
-  /* @__PURE__ */ a(A, { sx: { color: "text.secondary" }, variant: "body2", children: [
-    t / 4 * 100,
-    "% ",
-    o
-  ] })
-] }), Br = ({
-  completeCopy: t,
-  primaryText: o,
-  secondaryText: n,
-  value: r
-}) => /* @__PURE__ */ a(u, { sx: { gap: 20, p: 24 }, children: [
-  /* @__PURE__ */ a(u, { sx: { gap: 8 }, children: [
-    /* @__PURE__ */ e(K, { children: o }),
-    /* @__PURE__ */ e(M, { variant: "subtitle1", children: n })
-  ] }),
-  /* @__PURE__ */ e(zt, { completeCopy: t, value: r })
-] }), ct = {
-  step: O.ConnectAccounts,
-  type: "main"
-}, F = {
-  add_accounts: "Add Accounts",
-  add_income_primary: "What is your monthly income?",
-  add_income_secondary: "Add your income so that we can accurately measure your financial strength.",
-  add_more_income: "Add More Income",
-  back: "Back",
-  birthday_primary: "When is your birthday?",
-  birthday_secondary: "Get the most helpful tips and see how you’re doing compared to others your age.",
-  calculate_primary: "Calculating now ...",
-  calculate_secondary: "We’re analyzing your financial data to calculate your FinStrong score. Hold tight!",
-  confirm_income: "Confirm Income",
-  connect_accounts: "Connect Accounts",
-  connect_your_accounts_primary: "Connect Your Accounts",
-  connect_your_accounts_secondary: "Connect all of your accounts to get the most accurate FinStrong score.",
-  credit_score_primary: "What is your credit score?",
-  credit_score_secondary: "Your ability to borrow money is a key part of your financial strength score.",
-  do_it_later: "Do It Later",
-  next: "Next"
-}, Lr = ({ isOpen: t, onClose: o }) => {
-  const { visibleAccounts: n } = Se(), { calculateHealthScore: r } = R(), { finstrong: l } = v(), { setSelectedAccounts: s } = V(), { setDateRange: i } = kn(), { filter: d, setFilter: c, transactions: p } = Mn(), { user: _, userProfile: m, updateUser: g, updateUserProfile: b } = Q(), [w, f] = h.useState(_.credit_score || 0), [x, y] = h.useState(
-    ct
-  ), [k, D] = h.useState([]), [I, N] = h.useState(!1), [G, H] = h.useState(!1), [W, ce] = h.useState(_.birthday), [Y, re] = h.useState("");
-  h.useEffect(() => {
-    i({ start: It(rt()), end: Tt(rt()) });
-  }, []), h.useEffect(() => {
-    c({
-      accounts: n.map((T) => T.guid),
-      dateRange: {
-        start: Un(/* @__PURE__ */ new Date(), 90),
-        end: /* @__PURE__ */ new Date()
-      },
-      custom: at
-    }), s(n);
-  }, [n]);
-  const le = h.useMemo(
-    () => p.find((T) => T.guid === Y),
-    [Y, p]
-  ), ge = h.useMemo(() => ({
-    [O.ConnectAccounts]: !0,
-    [O.MonthlyIncome]: !!Y,
-    [O.Birthday]: !!_.birthday || !!W,
-    [O.CreditScore]: !!_.credit_score || !!w
-  })[x.step], [w, x, W, Y, _]), U = n.length > 0, Pe = h.useMemo(() => {
-    const { step: T } = x;
-    let L = 0;
-    return T >= O.MonthlyIncome && U && L++, T >= O.Birthday && k.length && L++, T >= O.CreditScore && (_.birthday || _.credit_score) && L++, L;
-  }, [x.step, U, k.length, _.birthday, _.credit_score]), Ce = (T) => {
-    c({
-      ...d,
-      custom: (L) => T ? Qn(L, T) : at(L)
-    });
-  }, Et = {
-    [O.ConnectAccounts]: {
-      main: U ? /* @__PURE__ */ e(Lt, { shouldShowBalance: !1 }) : null,
-      mainActionContent: U ? F.next : F.add_accounts,
-      primaryText: F.connect_your_accounts_primary,
-      secondaryText: F.connect_your_accounts_secondary
-    },
-    [O.MonthlyIncome]: {
-      detail: /* @__PURE__ */ e(
-        Ar,
-        {
-          incomeTransactions: k,
-          setCurrentStep: (T) => {
-            y(T), D((L) => {
-              if (L.some((ye) => ye.guid === Y)) return L.filter((ye) => ye.guid !== Y);
-              const Ze = p.find((ye) => ye.guid === Y);
-              return Ze ? [...L, Ze] : L;
-            });
-          },
-          transaction: le
-        }
-      ),
-      detailActionContent: F.confirm_income,
-      main: /* @__PURE__ */ e(
-        Zn,
-        {
-          onSearch: Ce,
-          onSelected: (T) => {
-            y({ step: O.MonthlyIncome, type: "detail" }), re(T);
-          }
-        }
-      ),
-      mainActionContent: F.confirm_income,
-      primaryText: F.add_income_primary,
-      secondaryText: F.add_income_secondary
-    },
-    [O.Birthday]: {
-      main: /* @__PURE__ */ e(Or, { selectedDate: W, setSelectedDate: ce }),
-      mainActionContent: F.next,
-      primaryText: F.birthday_primary,
-      secondaryText: F.birthday_secondary
-    },
-    [O.CreditScore]: {
-      main: /* @__PURE__ */ e(Pr, { creditScore: w, setCreditScore: f }),
-      mainActionContent: F.next,
-      primaryText: F.credit_score_primary,
-      secondaryText: F.credit_score_secondary
-    }
-  }, Xe = () => {
-    y(ct), N(!1), re(""), o();
-  }, Ue = async () => {
-    N(!0), await r(), await b({ ...m, has_completed_finstrong_onboarding: !0 }), Xe();
-  }, Gt = () => {
-    if (x.step === O.CreditScore) {
-      Ue();
-      return;
-    }
-    y({ step: x.step + 1, type: "main" });
-  }, Ht = () => {
-    const { step: T } = x, L = T + 1;
-    switch (T) {
-      case O.Birthday:
-        W && W !== _.birthday && g({ ..._, birthday: W });
-        break;
-      case O.CreditScore:
-        w && w !== _.credit_score && g({ ..._, credit_score: w }), Ue();
-        return;
-      case O.MonthlyIncome:
-        Y && k.length === 0 && D((qe) => [...qe, le]);
-        break;
-      case O.ConnectAccounts:
-        if (!U) {
-          H(!0);
-          return;
-        }
-        break;
-    }
-    L in O && y({ step: L, type: "main" });
-  }, Nt = () => {
-    const { step: T, type: L } = x;
-    if (L === "detail") {
-      y({ step: T, type: "main" });
-      return;
-    }
-    if (T === O.Birthday && k.length) {
-      y({ step: T - 1, type: "detail" });
-      return;
-    }
-    T > O.ConnectAccounts && y({ step: T - 1, type: "main" });
-  }, de = Et[x.step], ve = x.step === O.ConnectAccounts, Kt = {
-    fullWidth: !0,
-    ...ve && !U && { startIcon: /* @__PURE__ */ e(_t, {}) }
-  }, jt = !ve || ve && !U;
-  return /* @__PURE__ */ a(h.Fragment, { children: [
-    /* @__PURE__ */ a(
-      te,
+        cardState: s.cardState,
+        description: s.description,
+        stateTitle: s.stateTitle,
+        title: s.title
+      }
+    )
+  ] });
+}, Rt = () => {
+  const { healthScore: n } = $(), { finstrong: o } = S(), { key_indicators_borrow: t } = o, { user: i } = Y(), d = (a) => {
+    const { good: c, poor: p } = X.debtToIncomeRatio;
+    let h = f.MISSING, m = t.manage_debit_missing_description, _ = o.key_indicators_missing;
+    return a != null && (a <= c ? (h = f.GOOD, m = t.manage_debit_good_description, _ = o.key_indicators_good) : a > c && a <= p ? (h = f.FAIR, m = b(t.manage_debit_fair_description, a), _ = o.key_indicators_fair) : a > p && (h = f.OFF_TRACK, m = b(
+      t.manage_debit_off_track_description,
+      a
+    ), _ = o.key_indicators_off_track)), {
+      cardState: h,
+      description: m,
+      title: t.manage_debit_title,
+      stateTitle: _
+    };
+  }, l = (a) => {
+    const { good: c, poor: p } = X.creditScore;
+    let h = f.MISSING, m = t.credit_score_missing_description, _ = o.key_indicators_missing;
+    return a !== null && (a >= c ? (h = f.GOOD, m = b(t.credit_score_good_description, a), _ = o.key_indicators_good) : a < c && a >= p ? (h = f.FAIR, m = b(t.credit_score_fair_description, a), _ = o.key_indicators_fair) : a < p && (h = f.OFF_TRACK, m = b(
+      t.credit_score_off_track_description,
+      a
+    ), _ = o.key_indicators_off_track)), {
+      cardState: h,
+      description: m,
+      title: t.credit_score_title,
+      stateTitle: _
+    };
+  }, { manageDebtStatus: s, creditScoreStatus: r } = C.useMemo(() => {
+    const a = n.debt_to_income_ratio !== null ? Math.round(n.debt_to_income_ratio * 100) : null, c = d(a), p = l(i.credit_score || null);
+    return {
+      manageDebtStatus: c,
+      creditScoreStatus: p
+    };
+  }, [n.debt_to_income_ratio, i.credit_score, t, o]);
+  return /* @__PURE__ */ u(g, { direction: "column", gap: 24, sx: { p: 8, pt: 24 }, children: [
+    /* @__PURE__ */ e(
+      B,
       {
-        footerStyles: { px: 24, py: 16 },
-        hasSecondaryAction: !ve,
-        isOpen: t,
-        isPrimaryDisabled: !ge,
-        onClose: Xe,
-        onSecondaryAction: Nt,
-        primaryButtonProps: Kt,
-        primaryText: de?.mainActionContent,
-        secondaryColor: "primary",
-        secondaryText: F.back,
-        title: l.title,
-        ...!I && { onPrimaryAction: Ht },
-        children: [
-          I && /* @__PURE__ */ a(u, { sx: { alignItems: "center", gap: 24, position: "relative", px: 16, top: 126 }, children: [
-            /* @__PURE__ */ e(Ie, { children: F.calculate_primary }),
-            /* @__PURE__ */ e(M, { sx: { textAlign: "center" }, variant: "subtitle1", children: F.calculate_secondary })
-          ] }),
-          de && !I && /* @__PURE__ */ a(h.Fragment, { children: [
-            /* @__PURE__ */ e(
-              Br,
-              {
-                completeCopy: l.complete,
-                primaryText: de.primaryText,
-                secondaryText: de.secondaryText,
-                value: Pe
-              }
-            ),
-            x.type === "main" && /* @__PURE__ */ a(C, { children: [
-              de.main,
-              jt && /* @__PURE__ */ e(u, { sx: { alignItems: "center", px: 24, py: 12 }, children: /* @__PURE__ */ e($, { fullWidth: !0, onClick: Gt, children: F.do_it_later }) })
-            ] }),
-            x.type === "detail" && de.detail
-          ] })
-        ]
+        cardState: s.cardState,
+        description: s.description,
+        stateTitle: s.stateTitle,
+        title: s.title
       }
     ),
     /* @__PURE__ */ e(
-      oe,
+      B,
       {
-        onClose: () => H(!1),
-        showConnectWidget: G,
-        title: F.connect_accounts
+        cardState: r.cardState,
+        description: r.description,
+        stateTitle: r.stateTitle,
+        title: r.title
       }
     )
   ] });
-}, $r = S(Lr), $e = {
-  onboarding_title: "Financial Strength Starts Here",
-  onboarding_subtitle: "By analyzing your spending and saving, FinStrong provides a score and guidance to help you improve your financial habits.",
-  get_started: "Get Started"
-}, Wr = () => {
-  const [t, o] = h.useState(!1);
-  return /* @__PURE__ */ a(h.Fragment, { children: [
-    /* @__PURE__ */ a(
-      u,
+}, Ft = () => {
+  const [n, o] = C.useState(0), { finstrong: t } = S();
+  return /* @__PURE__ */ u(re, { children: [
+    /* @__PURE__ */ u(
+      nt,
       {
-        sx: {
-          alignItems: "center",
-          gap: 48,
-          pb: 24,
-          pt: 72,
-          px: 16
-        },
+        "aria-label": "Key Indicators",
+        centered: !0,
+        onChange: (i, d) => o(d),
+        sx: { mb: 0 },
+        textColor: "primary",
+        value: n,
+        variant: "fullWidth",
         children: [
-          /* @__PURE__ */ a(u, { sx: { alignItems: { sm: "center" }, gap: 24, width: "100%" }, children: [
-            /* @__PURE__ */ e(C, { sx: { textAlign: "center" }, children: /* @__PURE__ */ e(en, { size: 72 }) }),
-            /* @__PURE__ */ a(u, { sx: { gap: 4, textAlign: "center", width: { sm: 400 } }, children: [
-              /* @__PURE__ */ e(Ie, { children: $e.onboarding_title }),
-              /* @__PURE__ */ e(M, { sx: { color: "text.secondary" }, variant: "subtitle1", children: $e.onboarding_subtitle })
-            ] })
-          ] }),
-          /* @__PURE__ */ e($, { onClick: () => o(!0), variant: "contained", children: $e.get_started })
+          /* @__PURE__ */ e(
+            oe,
+            {
+              "aria-controls": "spend-details-tabpanel-0",
+              icon: /* @__PURE__ */ e(ue, { sx: { mr: 8 } }),
+              iconPosition: "start",
+              id: "spend-details-tab-0",
+              label: t.key_indicators_spend.title,
+              sx: { minHeight: 44 }
+            }
+          ),
+          /* @__PURE__ */ e(
+            oe,
+            {
+              "aria-controls": "save-details-tabpanel-1",
+              icon: /* @__PURE__ */ e(Ge, { sx: { mr: 8 } }),
+              iconPosition: "start",
+              id: "save-details-tab-1",
+              label: t.key_indicators_save.title,
+              sx: { minHeight: 44 }
+            }
+          ),
+          /* @__PURE__ */ e(
+            oe,
+            {
+              "aria-controls": "borrow-details-tabpanel-2",
+              icon: /* @__PURE__ */ e(Le, { sx: { mr: 8 } }),
+              iconPosition: "start",
+              id: "borrow-details-tab-2",
+              label: t.key_indicators_borrow.title,
+              sx: { minHeight: 44 }
+            }
+          )
         ]
       }
     ),
-    /* @__PURE__ */ e($r, { isOpen: t, onClose: () => o(!1) })
+    /* @__PURE__ */ e(ne, { index: 0, name: "spend-details", value: n, children: /* @__PURE__ */ e(Tt, {}) }),
+    /* @__PURE__ */ e(ne, { index: 1, name: "save-details", value: n, children: /* @__PURE__ */ e(wt, {}) }),
+    /* @__PURE__ */ e(ne, { index: 2, name: "borrow-details", value: n, children: /* @__PURE__ */ e(Rt, {}) })
   ] });
-}, zr = ({ isOpen: t, onClose: o }) => {
-  const { finstrong: n } = v(), r = E(), { updateUser: l, user: s } = Q(), [i, d] = h.useState(s.birthday), c = (_) => {
-    d(Math.floor(new Date(_).getTime() / 1e3));
-  };
-  return /* @__PURE__ */ e(
-    te,
-    {
-      isOpen: t,
-      onClose: o,
-      onPrimaryAction: () => {
-        !i || i === s.birthday || (l({ ...s, birthday: i }), o());
-      },
-      onSecondaryAction: o,
-      title: n.date_of_birth,
-      children: /* @__PURE__ */ e(oo, { dateAdapter: Ot, children: /* @__PURE__ */ e(
-        to,
-        {
-          disableFuture: !0,
-          onChange: c,
-          slotProps: {
-            nextIconButton: {
-              sx: {
-                color: "primary.main",
-                "&:hover": { bgcolor: _e(r.palette.primary.light, 0.1) }
-              }
-            },
-            previousIconButton: {
-              sx: {
-                color: "primary.main",
-                "&:hover": { bgcolor: _e(r.palette.primary.light, 0.1) }
-              }
-            }
-          },
-          slots: {
-            actionBar: () => null,
-            toolbar: () => null
-          },
-          sx: {
-            width: "100%",
-            "& .MuiIconButton-edgeEnd": {
-              color: "primary.main",
-              "&:hover": { bgcolor: _e(r.palette.primary.light, 0.1) }
-            }
-          },
-          value: i ? new Date(i * 1e3) : /* @__PURE__ */ new Date()
-        }
-      ) })
-    }
-  );
-}, Er = S(zr), Gr = ({ isOpen: t, onClose: o }) => {
-  const { visibleFinstrongAccounts: n } = Se(), { incomeBudget: r } = xt(), {
-    accounts: l,
-    common: s,
-    finstrong: i
-  } = v(), { user: d } = Q(), [c, p] = h.useState(null), m = [
-    {
-      dynamicCopy: i.add_profile_item,
-      fallbackLabel: i.monthly_income,
-      icon: /* @__PURE__ */ e(tn, {}),
-      key: ee.MonthlyIncome,
-      label: i.monthly_income,
-      value: r
-    },
-    {
-      dynamicCopy: i.add_profile_item,
-      fallbackLabel: i.date_of_birth,
-      icon: /* @__PURE__ */ e(nn, {}),
-      key: ee.DateOfBirth,
-      label: i.date_of_birth,
-      value: d.birthday
-    },
-    {
-      dynamicCopy: i.add_profile_item,
-      fallbackLabel: i.credit_score,
-      icon: /* @__PURE__ */ e(Ee, {}),
-      key: ee.CreditScore,
-      label: i.credit_score,
-      value: d.credit_score
-    },
-    {
-      fallbackLabel: i.connect_your_accounts,
-      icon: /* @__PURE__ */ e(pt, {}),
-      key: ee.Connections,
-      label: i.connections,
-      value: n.length > 0 ? X(
-        i.connected_account,
-        String(n.length),
-        n.length > 1 ? i.accounts : i.account
-      ) : void 0
-    }
-  ].map((g) => xn(g));
-  return /* @__PURE__ */ a(te, { isOpen: t, onClose: o, title: i.financial_profile, children: [
-    /* @__PURE__ */ a(u, { sx: { gap: 20, p: 24 }, children: [
-      /* @__PURE__ */ a(u, { sx: { gap: 8 }, children: [
-        /* @__PURE__ */ e(K, { children: i.your_financial_profile }),
-        /* @__PURE__ */ e(M, { children: i.financial_profile_description })
-      ] }),
-      /* @__PURE__ */ e(
-        zt,
-        {
-          completeCopy: i.complete,
-          value: m.reduce((g, b) => g + (b.isComplete ? 1 : 0), 0)
-        }
-      )
+}, Pt = ({
+  additionalContent: n,
+  children: o,
+  description: t,
+  drawerTitle: i,
+  isOpen: d,
+  loadConnectAccountsCard: l = !0,
+  onClose: s,
+  stickyComponent: r,
+  title: a
+}) => {
+  const { finstrong: c } = S(), { isCopyLoaded: p } = z();
+  return p ? /* @__PURE__ */ u(V, { isOpen: d, onClose: s, title: i || c.key_indicators, children: [
+    (a || t) && /* @__PURE__ */ u(g, { sx: { p: 24, pb: 0, gap: 8, backgroundColor: "background.paper" }, children: [
+      a && /* @__PURE__ */ e(H, { children: a }),
+      t && /* @__PURE__ */ e(y, { children: t })
     ] }),
-    /* @__PURE__ */ e(Sn, { list: m, onClickItem: p }),
-    /* @__PURE__ */ e(C, { sx: { p: 24 }, children: /* @__PURE__ */ e(
-      Te,
-      {
-        description: i.connect_more_accounts_to_view_more_accurate_financial_picture,
-        drawerType: "connectDrawer",
-        isDashboard: !0,
-        title: i.dont_see_all_your_accounts,
-        titleDrawer: s.add_accounts
-      }
-    ) }),
-    /* @__PURE__ */ e(
-      te,
+    r && /* @__PURE__ */ e(
+      x,
       {
-        isOpen: c === ee.MonthlyIncome,
-        onClose: () => p(null),
-        title: s.settings,
-        children: /* @__PURE__ */ e(no, {})
+        sx: {
+          position: "sticky",
+          top: 0,
+          zIndex: 1
+        },
+        children: r
       }
     ),
-    /* @__PURE__ */ e(Er, { isOpen: c === ee.DateOfBirth, onClose: () => p(null) }),
-    /* @__PURE__ */ e(Pt, { isOpen: c === ee.CreditScore, onClose: () => p(null) }),
-    /* @__PURE__ */ e(
-      St,
-      {
-        onClose: () => p(null),
-        showConnectionsWidget: c === ee.Connections,
-        title: l.manage_connections
-      }
-    )
-  ] });
-}, Hr = S(Gr), lt = ({
-  content: t,
+    n && /* @__PURE__ */ e(x, { children: n }),
+    /* @__PURE__ */ e(ge, {}),
+    /* @__PURE__ */ u(g, { sx: { p: 24, gap: 24 }, children: [
+      o,
+      l && /* @__PURE__ */ e(Q, { isDashboard: !0 })
+    ] })
+  ] }) : /* @__PURE__ */ e(N, {});
+}, Gt = I(Pt), pe = ({
+  content: n,
   islast: o = !1
-}) => /* @__PURE__ */ a(io, { sx: { minHeight: 0 }, children: [
-  /* @__PURE__ */ a(uo, { children: [
-    /* @__PURE__ */ e(po, { sx: { bgcolor: "divider", borderWidth: 1, p: 3 } }),
-    !o && /* @__PURE__ */ e(co, { sx: { bgcolor: "divider", width: 0.1 } })
+}) => /* @__PURE__ */ u(st, { sx: { minHeight: 0 }, children: [
+  /* @__PURE__ */ u(pt, { children: [
+    /* @__PURE__ */ e(dt, { sx: { bgcolor: "divider", borderWidth: 1, p: 3 } }),
+    !o && /* @__PURE__ */ e(ct, { sx: { bgcolor: "divider", width: 0.1 } })
   ] }),
-  /* @__PURE__ */ e(lo, { sx: { pb: 16, pl: 12, pr: 0, pt: 5 }, children: /* @__PURE__ */ e(M, { fontSize: 13, fontWeight: 400, variant: "subtitle2", children: t }) })
-] }), Nr = ({ report: t }) => {
-  const { finstrong: o } = v(), { score_history_drawer_timeline: n } = o, {
-    health_score_point_difference: r,
-    newer_credit_score: l,
-    older_credit_score: s,
-    older_spend_to_income_ratio: i,
-    newer_spend_to_income_ratio: d,
-    older_health_score: c,
-    newer_health_score: p,
-    newer_score_calculated_at: _
-  } = t, m = ro(new Date(_), "MMM d"), g = () => r === 0 ? "info.lighter" : r > 0 ? "success.lighter" : "error.lighter", b = () => r === 0 ? X(n.stayed_at, c) : r > 0 ? n.less_spending : n.more_spending, w = () => {
-    if (r === 0) return null;
-    const f = r > 0 ? n.up_from : n.down_from, x = X(f, c, p);
-    return /* @__PURE__ */ a(z, { children: [
+  /* @__PURE__ */ e(lt, { sx: { pb: 16, pl: 12, pr: 0, pt: 5 }, children: /* @__PURE__ */ e(y, { fontSize: 13, fontWeight: 400, variant: "subtitle2", children: n }) })
+] }), Lt = ({ report: n }) => {
+  const { finstrong: o } = S(), { score_history_drawer_timeline: t } = o, {
+    health_score_point_difference: i,
+    newer_credit_score: d,
+    older_credit_score: l,
+    older_spend_to_income_ratio: s,
+    newer_spend_to_income_ratio: r,
+    older_health_score: a,
+    newer_health_score: c,
+    newer_score_calculated_at: p
+  } = n, h = _e(new Date(p), "MMM d"), m = () => i === 0 ? "info.lighter" : i > 0 ? "success.lighter" : "error.lighter", _ = () => i === 0 ? b(t.stayed_at, a) : i > 0 ? t.less_spending : t.more_spending, R = () => {
+    if (i === 0) return null;
+    const T = i > 0 ? t.up_from : t.down_from, v = b(T, a, c);
+    return /* @__PURE__ */ u(re, { children: [
       /* @__PURE__ */ e(
-        an,
+        he,
         {
           fill: !0,
           name: "circle",
           sx: { color: "text.secondary", fontSize: 8, mx: 4, p: 1 }
         }
       ),
-      x
+      v
     ] });
   };
-  return /* @__PURE__ */ e(j, { children: /* @__PURE__ */ a(u, { sx: { backgroundColor: "background.paper" }, children: [
-    /* @__PURE__ */ e(C, { sx: { borderBottom: "1px solid", borderBottomColor: "divider", p: 16 }, children: /* @__PURE__ */ a(
-      u,
+  return /* @__PURE__ */ e(J, { children: /* @__PURE__ */ u(g, { sx: { backgroundColor: "background.paper" }, children: [
+    /* @__PURE__ */ e(x, { sx: { borderBottom: "1px solid", borderBottomColor: "divider", p: 16 }, children: /* @__PURE__ */ u(
+      g,
       {
         flexDirection: "row",
         sx: { alignItems: "center", gap: 16, height: 48, width: "100%" },
         children: [
           /* @__PURE__ */ e(
-            u,
+            g,
             {
               sx: {
                 alignItems: "center",
-                backgroundColor: g(),
+                backgroundColor: m(),
                 borderRadius: 999,
                 height: 48,
                 justifyContent: "center",
                 minWidth: 48
               },
-              children: /* @__PURE__ */ e(M, { sx: { fontWeight: 600 }, variant: "Body", children: r > 0 ? `+${r}` : r })
+              children: /* @__PURE__ */ e(y, { sx: { fontWeight: 600 }, variant: "Body", children: i > 0 ? `+${i}` : i })
             }
           ),
-          /* @__PURE__ */ a(u, { sx: { gap: 2, width: "80%" }, children: [
-            /* @__PURE__ */ e(A, { fontWeight: 600, variant: "Body", children: b() }),
-            /* @__PURE__ */ a(A, { sx: { color: "text.secondary" }, variant: "subtitle2", children: [
-              m,
+          /* @__PURE__ */ u(g, { sx: { gap: 2, width: "80%" }, children: [
+            /* @__PURE__ */ e(W, { fontWeight: 600, variant: "Body", children: _() }),
+            /* @__PURE__ */ u(W, { sx: { color: "text.secondary" }, variant: "subtitle2", children: [
+              h,
               " ",
-              w()
+              R()
             ] })
           ] })
         ]
       }
     ) }),
-    r !== 0 && /* @__PURE__ */ e(C, { sx: { color: "text.secondary", pb: 8, pl: 32, pr: 16, pt: 12 }, children: /* @__PURE__ */ a(
-      ao,
+    i !== 0 && /* @__PURE__ */ e(x, { sx: { color: "text.secondary", pb: 8, pl: 32, pr: 16, pt: 12 }, children: /* @__PURE__ */ u(
+      it,
       {
         sx: {
-          [`& .${so.root}:before`]: {
+          [`& .${at.root}:before`]: {
             flex: 0,
             padding: 0
           },
@@ -3087,22 +1232,22 @@ const P = {
         },
         children: [
           /* @__PURE__ */ e(
-            lt,
+            pe,
             {
-              content: X(
-                n.spend_to_income_description,
-                ke(i),
-                ke(d)
+              content: b(
+                t.spend_to_income_description,
+                de(s),
+                de(r)
               )
             }
           ),
           /* @__PURE__ */ e(
-            lt,
+            pe,
             {
-              content: X(
-                n.credit_score_description,
-                s,
-                l
+              content: b(
+                t.credit_score_description,
+                l,
+                d
               ),
               islast: !0
             }
@@ -3111,425 +1256,205 @@ const P = {
       }
     ) })
   ] }) });
-}, Kr = S(Nr), jr = ({ isOpen: t, onClose: o }) => {
-  const n = E(), { finstrong: r } = v(), { isCopyLoaded: l, isInitialized: s } = V(), { healthScore: i, healthScoreChangeReports: d, augmentedChartData: c } = R();
-  if (!l || !s) return /* @__PURE__ */ e(J, {});
-  const p = Ge(i.health_score || 0, r), _ = d.slice().reverse();
+}, Et = I(Lt), Wt = ({ isOpen: n, onClose: o }) => {
+  const t = G(), { finstrong: i } = S(), { isCopyLoaded: d, isInitialized: l } = z(), { healthScore: s, healthScoreChangeReports: r, augmentedChartData: a } = $();
+  if (!d || !l) return /* @__PURE__ */ e(N, {});
+  const c = ie(s.health_score || 0, i), p = r.slice().reverse();
   return /* @__PURE__ */ e(
-    Bt,
+    Gt,
     {
-      additionalContent: /* @__PURE__ */ e(u, { sx: { pl: 18, backgroundColor: "background.paper" }, children: /* @__PURE__ */ e(
-        Ne,
+      additionalContent: /* @__PURE__ */ e(g, { sx: { pl: 18, backgroundColor: "background.paper" }, children: /* @__PURE__ */ e(
+        be,
         {
-          axisColor: n.palette.divider,
+          axisColor: t.palette.divider,
           baseline: "min",
-          colors: [n.palette.primary.main],
+          colors: [t.palette.primary.main],
           curveType: "natural",
-          datasets: [c],
+          datasets: [a],
           height: 160,
-          labels: [r.key_indicators_label],
+          labels: [i.key_indicators_label],
           margin: { top: 12, left: 24 },
           showArea: !0,
           showAverage: !0,
-          title: r.peer_average,
+          title: i.peer_average,
           useCustomMark: !0
         }
       ) }),
-      drawerTitle: r.score_history,
-      isOpen: t,
+      drawerTitle: i.score_history,
+      isOpen: n,
       loadConnectAccountsCard: !1,
       onClose: o,
-      stickyComponent: /* @__PURE__ */ a(
-        u,
+      stickyComponent: /* @__PURE__ */ u(
+        g,
         {
           direction: "row",
           sx: { backgroundColor: "background.paper", gap: 16, pb: 12, pt: 8, px: 24 },
           children: [
-            /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
-              Ft,
+            /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(
+              ve,
               {
                 arcRadius: 20,
-                healthScore: i?.health_score,
+                healthScore: s?.health_score,
                 size: "SM"
               }
             ) }),
-            /* @__PURE__ */ a(C, { children: [
-              /* @__PURE__ */ e(M, { fontSize: 18, fontWeight: 700, sx: { mb: 4 }, variant: "subtitle1", children: p.status }),
-              /* @__PURE__ */ e(M, { variant: "caption", children: p.description })
+            /* @__PURE__ */ u(x, { children: [
+              /* @__PURE__ */ e(y, { fontSize: 18, fontWeight: 700, sx: { mb: 4 }, variant: "subtitle1", children: c.status }),
+              /* @__PURE__ */ e(y, { variant: "caption", children: c.description })
             ] })
           ]
         }
       ),
-      children: /* @__PURE__ */ e(u, { sx: { gap: 16 }, children: _.map((m, g) => /* @__PURE__ */ e(Kr, { report: m }, g)) })
+      children: /* @__PURE__ */ e(g, { sx: { gap: 16 }, children: p.map((h, m) => /* @__PURE__ */ e(Et, { report: h }, m)) })
     }
   );
-}, Vr = S(jr), Yr = ({ copy: t }) => {
-  const o = E(), n = [
-    o.palette.chartMono.chartMono5,
-    o.palette.chartMono.chartMono4,
-    o.palette.chartMono.chartMono3,
-    o.palette.chartMono.chartMono2
-  ];
-  return /* @__PURE__ */ a(u, { sx: { gap: 8 }, children: [
-    /* @__PURE__ */ e(u, { sx: { flexDirection: "row", gap: 8, px: 2 }, children: [
-      { color: "chartMono.chartMono2", text: t.vulnerable, value: "0-25" },
-      { color: "chartMono.chartMono3", text: t.building, value: "26-50" },
-      { color: "chartMono.chartMono4", text: t.stable, value: "51-75" },
-      { color: "chartMono.chartMono5", text: t.strong, value: "76-100" }
-    ].map(({ color: r, text: l, value: s }) => /* @__PURE__ */ a(u, { sx: { gap: 4, textAlign: "center", width: "100%" }, children: [
-      /* @__PURE__ */ a(C, { children: [
-        /* @__PURE__ */ e(M, { sx: { fontWeight: 700, textTransform: "uppercase" }, variant: "caption", children: l }),
-        /* @__PURE__ */ a(A, { sx: { color: "text.secondary" }, variant: "caption", children: [
-          "(",
-          s,
-          ")"
-        ] })
-      ] }),
-      /* @__PURE__ */ e(C, { sx: { border: "2px solid", borderColor: r, borderRadius: "3px" } })
-    ] }, l)) }),
-    /* @__PURE__ */ a(C, { children: [
-      /* @__PURE__ */ e(
-        C,
-        {
-          sx: {
-            background: `linear-gradient(to left, ${n.join(", ")})`,
-            borderRadius: "4px",
-            height: 16
-          }
-        }
-      ),
-      /* @__PURE__ */ e(u, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100].map((r) => /* @__PURE__ */ a(
-        u,
-        {
-          sx: { alignItems: "center", height: 20, justifyContent: "space-between", width: 24 },
-          children: [
-            /* @__PURE__ */ e(
-              C,
-              {
-                sx: {
-                  borderBottom: "1px solid",
-                  borderColor: "divider",
-                  position: "relative",
-                  rotate: "90deg",
-                  top: 3.5,
-                  width: 8
-                }
-              }
-            ),
-            /* @__PURE__ */ e(A, { sx: { color: "text.secondary" }, variant: "tiny", children: r })
-          ]
-        },
-        r
-      )) })
-    ] })
-  ] });
-}, Xr = ({ isOpen: t, onClose: o }) => {
-  const { finstrong: n } = v(), { isCopyLoaded: r } = V();
-  return r ? /* @__PURE__ */ e(te, { isOpen: t, onClose: o, title: n.score_rubric, children: /* @__PURE__ */ a(u, { sx: { gap: 36, p: 24 }, children: [
-    /* @__PURE__ */ a(u, { sx: { gap: 20 }, children: [
-      /* @__PURE__ */ a(u, { sx: { gap: 8 }, children: [
-        /* @__PURE__ */ e(K, { sx: { textWrap: "wrap" }, children: n.your_path_to_financial_freedom }),
-        /* @__PURE__ */ e(M, { variant: "subtitle1", children: n.finstrong_freedom_description })
-      ] }),
-      /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(Yr, { copy: n }) })
-    ] }),
-    /* @__PURE__ */ a(u, { sx: { gap: 12 }, children: [
-      /* @__PURE__ */ e(A, { sx: { fontWeight: 600 }, variant: "body1", children: n.how_do_we_do_this }),
-      /* @__PURE__ */ a(
-        De,
-        {
-          component: "ol",
-          sx: {
-            listStyleType: "decimal",
-            pl: 20,
-            pr: 16,
-            "& li": {
-              "::marker": {
-                fontWeight: 600
-              }
-            },
-            "& .MuiListItemText-secondary": {
-              fontSize: 15,
-              lineHeight: "24px",
-              pt: 4
-            }
-          },
-          children: [
-            /* @__PURE__ */ e(pe, { sx: { display: "list-item" }, children: /* @__PURE__ */ e(
-              ue,
-              {
-                primary: n.understand_your_habits,
-                secondary: n.understand_your_habits_description
-              }
-            ) }),
-            /* @__PURE__ */ e(pe, { sx: { display: "list-item", pt: 16 }, children: /* @__PURE__ */ e(
-              ue,
-              {
-                primary: n.see_whats_possible,
-                secondary: n.see_whats_possible_description
-              }
-            ) })
-          ]
-        }
-      )
+}, Bt = I(Wt), Ht = ({ onClick: n }) => {
+  const { finstrong: o } = S(), { isCopyLoaded: t } = z();
+  return t ? /* @__PURE__ */ u(g, { sx: { alignItems: "center", gap: 12, pt: 12, pb: 32 }, children: [
+    /* @__PURE__ */ e(Ee, { size: 48 }),
+    /* @__PURE__ */ u(g, { sx: { alignItems: "center", gap: 4, textAlign: "center" }, children: [
+      /* @__PURE__ */ e(H, { children: o.missing_data_title }),
+      /* @__PURE__ */ e(y, { sx: { width: { sm: 348 } }, variant: "subtitle1", children: o.missing_data_description })
     ] }),
-    /* @__PURE__ */ a(u, { sx: { gap: 4 }, children: [
-      /* @__PURE__ */ e(A, { sx: { fontWeight: 600, pb: 4 }, variant: "body1", children: n.we_ask_questions }),
-      /* @__PURE__ */ a(
-        De,
-        {
-          component: "ol",
-          sx: {
-            listStyleType: "initial",
-            pl: 20,
-            pr: 16,
-            "& li": {
-              minHeight: "max-content",
-              "::marker": {
-                color: "text.secondary",
-                fontWeight: 600
-              }
-            },
-            "& .MuiListItemText-secondary": {
-              fontSize: 15,
-              lineHeight: "24px"
-            }
-          },
-          children: [
-            /* @__PURE__ */ e(pe, { sx: { display: "list-item" }, children: /* @__PURE__ */ e(ue, { secondary: n.we_ask_questions_description_1 }) }),
-            /* @__PURE__ */ e(pe, { sx: { display: "list-item" }, children: /* @__PURE__ */ e(ue, { secondary: n.we_ask_questions_description_2 }) })
-          ]
-        }
-      )
-    ] })
-  ] }) }) : /* @__PURE__ */ e(J, {});
-}, Ur = S(Xr), qr = S(() => {
-  const [t, o] = h.useState(!1), n = E(), [r, { width: l }] = vt(), { finstrong: s } = v(), { isCopyLoaded: i, isInitialized: d } = V(), { healthScore: c, healthScoreChange: p } = R(), _ = n.palette.mode === "dark", m = Ge(c?.health_score, s);
-  return !i || !d ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ a(j, { ref: r, sx: { p: 16 }, children: [
-    /* @__PURE__ */ e(
-      go,
-      {
-        action: /* @__PURE__ */ e(
-          $,
-          {
-            endIcon: /* @__PURE__ */ e(Z, {}),
-            onClick: () => o(!0),
-            sx: {
-              fontSize: 13,
-              lineHeight: "16px",
-              fontWeight: 600,
-              color: "primary.main"
-            },
-            variant: "text",
-            children: s.financial_strength_header_action
-          }
-        ),
-        subheader: /* @__PURE__ */ e(K, { color: "text.primary", children: s.financial_strength_header }),
-        sx: {
-          p: 0,
-          "& .MuiCardHeader-content": {
-            overflow: "hidden"
-          }
-        }
-      }
-    ),
-    /* @__PURE__ */ e(u, { sx: { justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ e(
-      Ft,
-      {
-        arcRadius: l <= 323 ? 73 : 154,
-        footerCenterContent: p,
-        healthScore: c?.health_score || 0,
-        size: l <= 323 ? "M" : "L"
-      }
-    ) }),
-    c?.health_score ? /* @__PURE__ */ a(
-      _o,
+    /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(
+      q,
       {
+        endIcon: /* @__PURE__ */ e(j, {}),
+        onClick: n,
+        size: "small",
         sx: {
-          px: 16,
-          backgroundColor: _ ? "grey.800" : "grey.50",
-          //TODO: Need to change the background color to palette (supporting both darkmode and lightmode)
-          "&.Mui-expanded": {
-            m: 0
-          },
-          "&::before": {
-            display: "none"
+          fontSize: 13,
+          ":hover": {
+            bgcolor: "transparent"
           }
         },
-        children: [
-          /* @__PURE__ */ e(
-            mo,
-            {
-              expandIcon: /* @__PURE__ */ e(on, { size: 20 }),
-              sx: {
-                height: 52,
-                p: 0,
-                "&.Mui-expanded": {
-                  minHeight: 0
-                }
-              },
-              children: /* @__PURE__ */ e(M, { sx: { fontWeight: 600 }, variant: "body1", children: s.accordion_title_text })
-            }
-          ),
-          /* @__PURE__ */ e(ho, { sx: { "&.MuiAccordionDetails-root": { padding: 0, pb: 16 } }, children: /* @__PURE__ */ e(M, { variant: "subtitle1", children: m.scoreContent }) })
-        ]
-      }
-    ) : /* @__PURE__ */ e(
-      Te,
-      {
-        buttonText: s.connect_more_accounts_title,
-        description: s.health_score_zero_description,
-        drawerType: "connectDrawer",
-        hasIcon: !1,
-        isDashboard: !0,
-        sx: {
-          backgroundColor: _ ? "grey.800" : "grey.50",
-          //TODO: Need to change the background color to palette (supporting both darkmode and lightmode)
-          ".connect-more-accounts-title": {
-            fontWeight: 600,
-            lineHeight: "20px",
-            color: "text.primary"
-          },
-          ".connect-more-accounts-description": { color: "text.primary" }
-        },
-        title: s.health_score_zero_title
-      }
-    ),
-    /* @__PURE__ */ e(
-      Ur,
-      {
-        isOpen: t,
-        onClose: () => o(!1)
+        variant: "text",
+        children: o.connect_more_accounts_button
       }
-    )
-  ] });
-}), Zr = ({ onBackClick: t, sx: o }) => {
-  const { visibleAccounts: n } = Se(), { dateRange: r, isDataLoaded: l, loadBudgetData: s, setTheme: i } = xt(), { reloadCategoryTotals: d } = He(), {
-    augmentedChartData: c,
-    calculateHealthScore: p,
-    healthScore: _,
-    loadAugmentedChartData: m,
-    loadMonthlySummaries: g
-  } = R(), { finstrong: b, connect: w } = v(), { isCopyLoaded: f, isInitialized: x, selectedAccounts: y, setSelectedAccounts: k } = V(), { isMobile: D } = je(), I = E(), { userProfile: N } = Q(), [G, H] = h.useState(!1), [W, ce] = h.useState(!1), [Y, re] = h.useState(!1);
-  if (h.useEffect(() => {
-    i(I);
-  }, []), h.useEffect(() => k(n), [n]), h.useEffect(() => {
-    x && (p().finally(), m().finally(), g().finally());
-  }, [x]), h.useEffect(() => {
-    x && (d(y, r.start, r.end), l || s());
-  }, [r, l, x, y]), !f || !x) return /* @__PURE__ */ e(J, {});
-  const le = () => {
-  }, ge = () => H(!0);
-  return /* @__PURE__ */ a(
-    En,
+    ) })
+  ] }) : /* @__PURE__ */ e(N, {});
+}, zt = I(Ht), $t = ({ onBackClick: n, sx: o }) => {
+  const t = G(), { visibleAccounts: i } = fe(), { dateRange: d, isDataLoaded: l, loadBudgetData: s, setTheme: r } = ye(), { reloadCategoryTotals: a } = Ke(), { augmentedChartData: c, calculateHealthScore: p, healthScore: h, loadAugmentedChartData: m } = $(), { finstrong: _, connect: R } = S(), { isCopyLoaded: T, isInitialized: v, selectedAccounts: L, setSelectedAccounts: E } = z(), { isMobile: K } = Ce(), [F, w] = C.useState(!1);
+  C.useEffect(() => {
+    r(t);
+  }, []), C.useEffect(() => E(i), [i]), C.useEffect(() => {
+    v && (p().finally(), m().finally());
+  }, [v]), C.useEffect(() => {
+    v && (a(L, d.start, d.end), l || s());
+  }, [d, l, v, L]);
+  const [O, k] = C.useState(!1), [P, U] = C.useState(!1);
+  if (!T || !v) return /* @__PURE__ */ e(N, {});
+  const Z = () => {
+  }, ee = () => k(!0);
+  return /* @__PURE__ */ u(
+    mt,
     {
-      accountOptions: n,
+      accountOptions: i,
       actions: [
         {
           iconName: "person",
-          label: b.profile,
-          onClick: ge
+          label: _.profile,
+          onClick: ee
         }
       ],
       hasDivider: !0,
-      onAccountsFilterClick: le,
-      onBackClick: t,
+      onAccountsFilterClick: Z,
+      onBackClick: n,
       sx: o,
-      title: b.title,
+      title: _.title,
       children: [
-        N.has_completed_finstrong_onboarding ? /* @__PURE__ */ a(
-          u,
+        /* @__PURE__ */ u(
+          g,
           {
             sx: {
               flexDirection: { md: "row" },
               gap: 24,
               justifyContent: "center",
-              pt: D ? 24 : 16,
+              pt: K ? 24 : 16,
               px: 24
             },
             children: [
-              /* @__PURE__ */ a(u, { sx: { gap: 24, width: { md: 432 } }, children: [
-                /* @__PURE__ */ e(qr, {}),
+              /* @__PURE__ */ u(g, { sx: { gap: 24, width: { md: 432 } }, children: [
+                /* @__PURE__ */ e(St, {}),
                 /* @__PURE__ */ e(
-                  Te,
+                  Q,
                   {
-                    description: b.connect_more_accounts_description,
-                    drawerType: "connectDrawer",
-                    title: b.connect_more_accounts_title
+                    description: _.connect_more_accounts_description,
+                    title: _.connect_more_accounts_title
                   }
                 )
               ] }),
-              /* @__PURE__ */ e(u, { sx: { maxWidth: 848, minWidth: 288, width: { md: 720 } }, children: /* @__PURE__ */ a(j, { sx: { background: I.palette.background.paper, p: 16 }, children: [
-                /* @__PURE__ */ a(u, { direction: "row", sx: { alignItems: "center", justifyContent: "space-between" }, children: [
-                  /* @__PURE__ */ e(K, { children: b.key_indicators }),
+              /* @__PURE__ */ e(g, { sx: { maxWidth: 848, minWidth: 288, width: { md: 720 } }, children: /* @__PURE__ */ u(J, { sx: { background: t.palette.background.paper, p: 16 }, children: [
+                /* @__PURE__ */ u(g, { direction: "row", sx: { alignItems: "center", justifyContent: "space-between" }, children: [
+                  /* @__PURE__ */ e(H, { children: _.key_indicators }),
                   /* @__PURE__ */ e(
-                    $,
+                    q,
                     {
-                      endIcon: /* @__PURE__ */ e(Z, {}),
-                      onClick: () => ce(!0),
+                      endIcon: /* @__PURE__ */ e(j, {}),
+                      onClick: () => U(!0),
                       sx: {
                         fontSize: 13
                       },
                       variant: "text",
-                      children: b.whats_changed
+                      children: _.whats_changed
                     }
                   )
                 ] }),
                 c.length ? /* @__PURE__ */ e(
-                  Ne,
+                  be,
                   {
-                    axisColor: I.palette.divider,
+                    axisColor: t.palette.divider,
                     baseline: "min",
-                    colors: [I.palette.primary.main],
+                    colors: [t.palette.primary.main],
                     curveType: "natural",
                     customLegendVariant: "XSmall",
                     datasets: [c],
                     height: 300,
                     isGraphClippingXAxis: !0,
-                    labelBackgroundColor: I.palette.border.dark,
-                    labelFontColor: I.palette.common.white,
-                    labelFontSize: typeof I.typography.XSmall?.fontSize == "string" ? parseFloat(I.typography.XSmall.fontSize) : I.typography.XSmall?.fontSize,
-                    labels: [b.key_indicators_label],
+                    labelBackgroundColor: t.palette.border.dark,
+                    labelFontColor: t.palette.common.white,
+                    labelFontSize: typeof t.typography.XSmall?.fontSize == "string" ? parseFloat(t.typography.XSmall.fontSize) : t.typography.XSmall?.fontSize,
+                    labels: [_.key_indicators_label],
                     margin: { right: 20, left: 25 },
                     showArea: !0,
                     showAverage: !0,
                     showLegend: !0,
                     showMarkLabel: !0,
                     showXAxis: !0,
-                    title: b.peer_average,
+                    title: _.peer_average,
                     useCustomMark: !0
                   }
-                ) : /* @__PURE__ */ e(kr, { onClick: () => re(!0) }),
-                _.health_score !== null && /* @__PURE__ */ e(vr, {})
+                ) : /* @__PURE__ */ e(zt, { onClick: () => w(!0) }),
+                h.health_score !== null && /* @__PURE__ */ e(Ft, {})
               ] }) })
             ]
           }
-        ) : /* @__PURE__ */ e(Wr, {}),
-        /* @__PURE__ */ e(Hr, { isOpen: G, onClose: () => H(!1) }),
+        ),
+        /* @__PURE__ */ e(Mt, { isOpen: O, onClose: () => k(!1) }),
         /* @__PURE__ */ e(
-          oe,
+          xe,
           {
-            onClose: () => re(!1),
-            showConnectWidget: Y,
-            title: w.mini_title
+            onClose: () => w(!1),
+            showConnectWidget: F,
+            title: R.mini_title
           }
         ),
         /* @__PURE__ */ e(
-          Vr,
+          Bt,
           {
-            isOpen: W,
-            onClose: () => ce(!1)
+            isOpen: P,
+            onClose: () => U(!1)
           }
         )
       ]
     }
   );
-}, hi = S(Zr);
+}, Ho = I($t);
 export {
-  bo as CreditScoreGraph,
-  Rt as DialScoreCard,
-  Ft as FinancialStrengthGraph,
-  yi as FinstrongApi,
-  bi as FinstrongStore,
-  hi as FinstrongWidget
+  Bo as CreditScoreGraph,
+  Se as DialScoreCard,
+  ve as FinancialStrengthGraph,
+  No as FinstrongApi,
+  Ko as FinstrongStore,
+  Ho as FinstrongWidget
 };