@mx-cartographer/experiences 9.1.1 → 9.1.2

package/dist/networth/index.es.js

@@ -1,5 +1,5 @@
 import { jsxs as r, jsx as e, Fragment as N } from "react/jsx-runtime";
-import u from "react";
+import x from "react";
 import { observer as _ } from "mobx-react-lite";
 import m from "@mui/material/Stack";
 import { P as Y, Text as d, Icon as R } from "@mxenabled/mxui";
@@ -7,7 +7,7 @@ import { Icon as Z } from "@mxenabled/mx-icons";
 import { f as F } from "../NumberFormatting--XMeeBfr.mjs";
 import { c as oe, f as $, u as E, a as q, x as j, D as re } from "../hooks-97sNJ_lf.mjs";
 import { u as J } from "../useWidgetLoadTimer-B0tB-yzL.mjs";
-import { A as v } from "../Analytics-WeZYytR0.mjs";
+import { A as v } from "../Analytics-D-jdcL72.mjs";
 import { L as Q } from "../Loader-CxeBwuPG.mjs";
 import { M as ie } from "../MicroWidgetContainer-B2NnKBgW.mjs";
 import { format as ae, fromUnixTime as se, differenceInMonths as ce } from "date-fns";
@@ -19,20 +19,20 @@ import { L as me } from "../LineChart-CUfiH86G.mjs";
 import { u as ee } from "../useScreenSize-mWpmnh5w.mjs";
 import { f as he, D as pe } from "../DateFormats-HudZ3Bjs.mjs";
 import ue from "@mui/material/Button";
-import L from "@mui/material/Divider";
+import I from "@mui/material/Divider";
 import z from "@mui/material/List";
 import A from "@mui/material/ListSubheader";
 import O from "@mui/material/ListItem";
 import te from "@mui/material/ListItemButton";
 import b from "@mui/material/ListItemText";
 import { l as ne } from "../DateUtil-CzBmbjmA.mjs";
-import { C as x } from "../CurrencyText-CCbE6MmF.mjs";
+import { C as f } from "../CurrencyText-CCbE6MmF.mjs";
 import { Stack as fe } from "@mui/material";
 import xe from "@mui/material/Collapse";
 import K from "@mui/material/ListItemIcon";
 import { g as U } from "../NetWorthUtils-Dj7CgAg2.mjs";
 import { D as V } from "../Drawer-DsnW2o0v.mjs";
-import { W as ge } from "../WidgetContainer-DJnp6t6c.mjs";
+import { W as ge } from "../WidgetContainer-CjdCY4sj.mjs";
 import { E as ye } from "../EmptyState-CJUDc3kD.mjs";
 const Ce = ({ amount: t, copy: s, trendValue: i }) => {
   const n = i > 0, o = i === 0 ? "trending_flat" : n ? "trending_up" : "trending_down";
@@ -53,13 +53,13 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
     /* @__PURE__ */ e(Y, { sx: { color: "text.secondary" }, variant: "body2", children: t.zero_state_description })
   ] })
 ] }), gt = _(({ onCTAClick: t }) => {
-  const { visibleAccounts: s } = oe(), { onEvent: i } = $(), { net_worth: n, common: a } = E(), { isInitialized: o } = q(), { isNetWorthDataLoaded: c, loadNetWorthData: l, netWorthData: g, selectedData: f } = j();
-  if (u.useEffect(() => {
+  const { visibleAccounts: s } = oe(), { onEvent: i } = $(), { net_worth: n, common: a } = E(), { isInitialized: o } = q(), { isNetWorthDataLoaded: c, loadNetWorthData: l, netWorthData: g, selectedData: u } = j();
+  if (x.useEffect(() => {
     c || l().finally();
   }, []), J({
     widgetName: "NetWorthMicroWidget",
     isLoaded: c
-  }), u.useEffect(() => {
+  }), x.useEffect(() => {
     c && i(v.NET_WORTH_LOAD_WIDGET, {
       state: s?.length ? "default" : "zeroState"
     });
@@ -79,9 +79,9 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
       children: g.accounts.length ? /* @__PURE__ */ e(
         Ce,
         {
-          amount: f?.y,
+          amount: u?.y,
           copy: n,
-          trendValue: f?.change
+          trendValue: u?.change
         }
       ) : /* @__PURE__ */ e(be, { copy: n })
     }
@@ -93,18 +93,18 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
     selectedData: o,
     setHoveredIndex: c,
     setSelectedIndex: l
-  } = j(), g = s - 320, f = a.map((h) => ({
+  } = j(), g = s - 320, u = a.map((h) => ({
     x: he(de(h.x), pe.MONTH_SHORT),
     y: h.y
-  })), W = o ? { index: a.findIndex((h) => h.x === o.x) } : void 0, S = n ? { index: a.findIndex((h) => h.x === n.x) } : void 0, w = (h) => ({
+  })), W = o ? { index: a.findIndex((h) => h.x === o.x) } : void 0, y = n ? { index: a.findIndex((h) => h.x === n.x) } : void 0, w = (h) => ({
     fill: h === W?.index ? i.palette.success.main : "",
-    filter: h === S?.index ? `drop-shadow(0px 0px 10px ${i.palette.success.main})` : "none",
+    filter: h === y?.index ? `drop-shadow(0px 0px 10px ${i.palette.success.main})` : "none",
     stroke: i.palette.success.main
-  }), y = (h, M) => {
+  }), L = (h, M) => {
     l(M);
-  }, k = (h) => {
+  }, D = (h) => {
     c(h);
-  }, D = () => {
+  }, k = () => {
     c(-1);
   };
   return /* @__PURE__ */ e(m, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
@@ -115,11 +115,11 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
       chartXaxisSx: { "& .MuiChartsAxis-tickLabel": { transform: "translateX(8px)" } },
       chartYaxisSx: { "& .MuiChartsAxis-tickLabel": { transform: "translateX(-8px)" } },
       colors: [i.palette.success.main],
-      datasets: [f],
+      datasets: [u],
       height: 350,
       labels: [],
       margin: { right: 20, left: 38 },
-      markHandlers: { onMarkClick: y, onMouseEnter: k, onMouseLeave: D },
+      markHandlers: { onMarkClick: L, onMouseEnter: D, onMouseLeave: k },
       markStyles: w,
       showArea: !0,
       useCustomMark: !0,
@@ -136,12 +136,12 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
   onMouseEnter: o,
   onMouseLeave: c
 }) => {
-  const [l, g] = u.useState({
+  const [l, g] = x.useState({
     color: ""
   });
-  return u.useEffect(() => {
+  return x.useEffect(() => {
     g(s(t));
-  }, [i, n]), /* @__PURE__ */ r(u.Fragment, { children: [
+  }, [i, n]), /* @__PURE__ */ r(x.Fragment, { children: [
     /* @__PURE__ */ e(
       O,
       {
@@ -153,7 +153,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         children: /* @__PURE__ */ e(
           te,
           {
-            onClick: (f) => a?.(f, t.x),
+            onClick: (u) => a?.(u, t.x),
             onMouseEnter: () => o(t.x),
             onMouseLeave: () => c(),
             sx: { minHeight: 20, padding: 12 },
@@ -162,7 +162,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
               {
                 primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", sx: { fontWeight: 400 }, children: [
                   /* @__PURE__ */ e(d, { variant: "body1", children: ne(t.x) }),
-                  /* @__PURE__ */ e(x, { amount: t.y, sx: { color: "inherit" }, variant: "body1" })
+                  /* @__PURE__ */ e(f, { amount: t.y, sx: { color: "inherit" }, variant: "body1" })
                 ] })
               }
             )
@@ -170,7 +170,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         )
       }
     ),
-    /* @__PURE__ */ e(L, {})
+    /* @__PURE__ */ e(I, {})
   ] }, t.x);
 }, We = _(ve), Se = ({
   currencyLabel: t,
@@ -191,10 +191,10 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         }
       }
     ),
-    /* @__PURE__ */ e(x, { amount: n.change, color: c, variant: s }),
+    /* @__PURE__ */ e(f, { amount: n.change, color: c, variant: s }),
     /* @__PURE__ */ e(d, { variant: "body2", children: t })
   ] });
-}, B = _(Se), Ie = ({
+}, B = _(Se), Te = ({
   netWorth: t,
   gains: s,
   losses: i,
@@ -214,18 +214,18 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         {
           primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", children: [
             /* @__PURE__ */ e(d, { sx: { fontWeight: 700 }, variant: "caption", children: o.gains }),
-            /* @__PURE__ */ e(x, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
+            /* @__PURE__ */ e(f, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
           ] })
         }
       ) }),
-      s?.map((l) => /* @__PURE__ */ r(u.Fragment, { children: [
+      s?.map((l) => /* @__PURE__ */ r(x.Fragment, { children: [
         /* @__PURE__ */ e(O, { sx: { backgroundColor: c.palette.background.paper, py: 14 }, children: /* @__PURE__ */ e(
           b,
           {
             primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", children: [
               /* @__PURE__ */ e(d, { sx: { mr: 10 }, variant: "body1", children: l.accountName }),
               /* @__PURE__ */ e(
-                x,
+                f,
                 {
                   amount: l.gain,
                   sx: { color: c.palette.success.main, flexShrink: 0, fontWeight: 700 },
@@ -236,14 +236,14 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
             sx: { px: 16 }
           }
         ) }),
-        /* @__PURE__ */ e(L, {})
+        /* @__PURE__ */ e(I, {})
       ] }, l.accountName)),
       /* @__PURE__ */ e(A, { sx: { mb: 8, mt: 12, mx: 8 }, children: /* @__PURE__ */ e(
         b,
         {
           primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", children: [
             /* @__PURE__ */ e(d, { sx: { fontWeight: 700 }, variant: "caption", children: o.losses }),
-            /* @__PURE__ */ e(x, { amount: a, sx: { fontWeight: 400 }, variant: "caption" })
+            /* @__PURE__ */ e(f, { amount: a, sx: { fontWeight: 400 }, variant: "caption" })
           ] })
         }
       ) }),
@@ -267,7 +267,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
                     }
                   ),
                   /* @__PURE__ */ e(
-                    x,
+                    f,
                     {
                       amount: l.loss,
                       sx: { flexShrink: 0, fontWeight: 700 },
@@ -281,12 +281,12 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
           },
           l.accountName
         ),
-        /* @__PURE__ */ e(L, {})
+        /* @__PURE__ */ e(I, {})
       ] }))
     ] })
   ] });
-}, Te = _(Ie), Le = ({ accounts: t, name: s, icon: i }) => {
-  const [n, a] = u.useState(!1);
+}, Ie = _(Te), Le = ({ accounts: t, name: s, icon: i }) => {
+  const [n, a] = x.useState(!1);
   return /* @__PURE__ */ r(N, { children: [
     /* @__PURE__ */ e(O, { sx: (o) => ({ backgroundColor: o.palette.background.paper }), children: /* @__PURE__ */ r(te, { onClick: () => a(!n), children: [
       i && /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(R, { name: i, size: 24, sx: { mr: 12 } }) }),
@@ -298,7 +298,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
       ),
       /* @__PURE__ */ e(K, { children: n ? /* @__PURE__ */ e(R, { name: "expand_less", size: 24 }) : /* @__PURE__ */ e(R, { name: "expand_more", size: 24 }) })
     ] }) }),
-    /* @__PURE__ */ e(L, {}),
+    /* @__PURE__ */ e(I, {}),
     /* @__PURE__ */ e(xe, { in: n, timeout: "auto", unmountOnExit: !0, children: t.map((o, c) => /* @__PURE__ */ r(z, { children: [
       /* @__PURE__ */ e(O, { sx: () => ({ py: 14 }), children: /* @__PURE__ */ e(
         b,
@@ -315,7 +315,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
               }
             ),
             /* @__PURE__ */ e(
-              x,
+              f,
               {
                 amount: o.balance,
                 sx: {
@@ -328,7 +328,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
           sx: { pl: 72, pr: 16 }
         }
       ) }),
-      c < t.length - 1 ? /* @__PURE__ */ e(L, { variant: "inset" }) : /* @__PURE__ */ e(L, {})
+      c < t.length - 1 ? /* @__PURE__ */ e(I, { variant: "inset" }) : /* @__PURE__ */ e(I, {})
     ] }, o.accountName)) })
   ] });
 }, X = ({ groupedAccounts: t }) => /* @__PURE__ */ e(N, { children: t.map(({ accounts: s, icon: i, name: n }) => /* @__PURE__ */ e(Le, { accounts: s, icon: i, name: n }, n)) }), De = ({
@@ -353,7 +353,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         },
         children: [
           /* @__PURE__ */ e(d, { variant: "body1", children: o.current_net_worth }),
-          /* @__PURE__ */ e(x, { amount: t?.y ?? 0, variant: "h1" }),
+          /* @__PURE__ */ e(f, { amount: t?.y ?? 0, variant: "h1" }),
           t && /* @__PURE__ */ e(
             B,
             {
@@ -372,7 +372,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
         {
           primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", children: [
             /* @__PURE__ */ e(d, { sx: { fontWeight: 700 }, variant: "caption", children: o.assets }),
-            /* @__PURE__ */ e(x, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
+            /* @__PURE__ */ e(f, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
           ] })
         }
       ) }),
@@ -383,7 +383,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
           primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", children: [
             /* @__PURE__ */ e(d, { sx: { fontWeight: 700 }, variant: "caption", children: o.liabilities }),
             /* @__PURE__ */ e(
-              x,
+              f,
               {
                 amount: a,
                 sx: { fontWeight: 400 },
@@ -404,18 +404,18 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
     netWorthChartData: c,
     selectedData: l,
     setHoveredIndex: g,
-    setSelectedIndex: f
-  } = j(), [W, S] = u.useState(!1), [w, y] = u.useState(!1), k = (p) => {
-    const C = p.x === o?.x, I = p.x === l?.x, T = {
+    setSelectedIndex: u
+  } = j(), [W, y] = x.useState(!1), [w, L] = x.useState(!1), D = (p) => {
+    const C = p.x === o?.x, S = p.x === l?.x, T = {
       backgroundColor: "inherit",
       borderBottom: "inherit",
       color: "inherit"
     };
-    return C && (T.color = I ? "inherit" : T.color, T.backgroundColor = s.palette.action.hover), I && (T.backgroundColor = s.palette.primary.main, T.borderBottom = s.palette.neutral.light, T.color = s.palette.common.white), T;
-  }, D = (p, C) => {
-    f(C), p.currentTarget instanceof HTMLDivElement && S(!0);
+    return C && (T.color = S ? "inherit" : T.color, T.backgroundColor = s.palette.action.hover), S && (T.backgroundColor = s.palette.primary.main, T.borderBottom = s.palette.neutral.light, T.color = s.palette.common.white), T;
+  }, k = (p, C) => {
+    u(C), p.currentTarget instanceof HTMLDivElement && y(!0);
   }, h = () => {
-    y(!0), i(v.NET_WORTH_WIDGET_CLICK_ASSETS_LIABILITIES);
+    L(!0), i(v.NET_WORTH_WIDGET_CLICK_ASSETS_LIABILITIES);
   }, M = (p) => {
     g(p);
   }, G = () => {
@@ -424,15 +424,15 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
   return /* @__PURE__ */ r(m, { direction: "column", sx: { width: 320 }, children: [
     /* @__PURE__ */ r(z, { children: [
       /* @__PURE__ */ e(A, { sx: { backgroundColor: "transparent", mb: 8, mt: 12, px: 12 }, children: /* @__PURE__ */ e(d, { bold: !0, component: "h2", variant: "body1", children: t.monthly_totals }) }),
-      /* @__PURE__ */ e(L, {}),
+      /* @__PURE__ */ e(I, {}),
       c.map((p, C) => /* @__PURE__ */ e(
         We,
         {
-          getStyles: k,
+          getStyles: D,
           isHovered: p.x === o?.x,
           isSelected: p.x === l?.x,
           item: p,
-          onItemClick: (I) => D(I, C),
+          onItemClick: (S) => k(S, C),
           onMouseEnter: () => M(C),
           onMouseLeave: () => G()
         },
@@ -453,11 +453,11 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
       {
         ariaLabelClose: "Close",
         isOpen: W,
-        onClose: () => S(!1),
+        onClose: () => y(!1),
         shouldShowHeaderBorders: !1,
         shouldShowHeaderShadow: !0,
         title: t.gains_and_losses,
-        children: a && /* @__PURE__ */ e(Te, { ...a })
+        children: a && /* @__PURE__ */ e(Ie, { ...a })
       }
     ),
     /* @__PURE__ */ e(
@@ -465,7 +465,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
       {
         ariaLabelClose: "Close",
         isOpen: w,
-        onClose: () => y(!1),
+        onClose: () => L(!1),
         shouldShowHeaderBorders: !1,
         shouldShowHeaderShadow: !0,
         title: t.assets_and_liabilities,
@@ -477,7 +477,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
   const { net_worth: i } = E(), n = H(), a = t || s, o = ae(se(a.x), "MMMM");
   return /* @__PURE__ */ r(m, { alignItems: "center", direction: "column", m: 24, children: [
     /* @__PURE__ */ e(d, { color: n.palette.secondary.main, variant: "body2", children: `${o} ${i.net_worth}` }),
-    /* @__PURE__ */ e(x, { amount: a.y, variant: "h2" }),
+    /* @__PURE__ */ e(f, { amount: a.y, variant: "h2" }),
     /* @__PURE__ */ e(B, { currencyLabel: i.this_month, netWorth: a, theme: n })
   ] });
 }, Ae = _(Me), yt = _(({ onBackClick: t, onMenuClick: s }) => {
@@ -486,32 +486,34 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
     isNetWorthDataLoaded: c,
     loadNetWorthData: l,
     netWorthChartData: g,
-    selectedData: f,
-    setTimeframe: W,
-    timeframe: S
-  } = j(), { isMobile: w } = ee(), { onEvent: y } = $(), [k, D] = u.useState(!1);
+    selectedData: u,
+    setTimeframe: W
+  } = j(), { isMobile: y } = ee(), { onEvent: w } = $(), [L, D] = x.useState(!1);
   J({
     widgetName: "NetWorthWidget",
     isLoaded: c
-  }), u.useEffect(() => {
-    c || l().finally(), y(v.NET_WORTH_VIEW);
-  }, []), u.useEffect(() => {
-    y(v.NET_WORTH_WIDGET_CLICK_TIMEFRAME, { time_period: S + "M" });
-  }, [S]);
-  const h = async (p) => {
-    const C = p[0], I = p[1];
-    C && I && W(ce(I, C));
+  }), x.useEffect(() => {
+    c || l().finally(), w(v.NET_WORTH_VIEW);
+  }, []);
+  const k = async (p) => {
+    const C = p[0], S = p[1];
+    C && S && W(ce(S, C));
+  }, h = (p) => {
+    w(v.NET_WORTH_WIDGET_CLICK_TIMEFRAME, { time_period: p + "M" });
   }, M = () => {
-    D(!0), y(v.ACCOUNTS_CLICK_CONNECT);
+    D(!0), w(v.ACCOUNTS_CLICK_CONNECT);
   };
   if (!i || !c) return /* @__PURE__ */ e(Q, {});
   const G = g.length === 0;
   return /* @__PURE__ */ r(
     ge,
     {
-      calendarActions: { onRangeChanged: h },
-      dateRangeVariant: w ? "timeframetabs" : "timeframebuttons",
-      onAccountsFilterClick: () => y(v.NET_WORTH_WIDGET_CLICK_FILTER),
+      calendarActions: {
+        onRangeChanged: k,
+        onTimeframeClick: h
+      },
+      dateRangeVariant: y ? "timeframetabs" : "timeframebuttons",
+      onAccountsFilterClick: () => w(v.NET_WORTH_WIDGET_CLICK_FILTER),
       onBackClick: t,
       onMenuClick: s,
       title: a.net_worth,
@@ -532,13 +534,13 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
             }
           }
         ) }) : /* @__PURE__ */ r(N, { children: [
-          f && /* @__PURE__ */ e(Ae, { hoveredData: o, selectedData: f }),
+          u && /* @__PURE__ */ e(Ae, { hoveredData: o, selectedData: u }),
           /* @__PURE__ */ r(
             m,
             {
-              alignItems: w ? "center" : "flex-start",
-              direction: w ? "column" : "row",
-              spacing: w ? 0 : 48,
+              alignItems: y ? "center" : "flex-start",
+              direction: y ? "column" : "row",
+              spacing: y ? 0 : 48,
               children: [
                 /* @__PURE__ */ e(we, {}),
                 /* @__PURE__ */ e(ke, {})
@@ -550,7 +552,7 @@ const Ce = ({ amount: t, copy: s, trendValue: i }) => {
           le,
           {
             onClose: () => D(!1),
-            showConnectionsWidget: k,
+            showConnectionsWidget: L,
             title: n.manage_connections
           }
         )