@mx-cartographer/experiences 9.1.0-alpha.bb1 → 9.1.0

package/dist/networth/index.es.js

@@ -1,128 +1,115 @@
-import { J as F, ln as re, m as Y, un as oe, x as K } from "../core-BexP5oiV.mjs";
-import { An as ie, Gn as ae, i as se, jn as x, lr as U, mr as q, qn as ce, sr as w, yn as le } from "../accounts-DkyAiLpg.mjs";
-import { n as J } from "../Analytics-BKzTPees.mjs";
-import { d as B, h as Z, k as de, n as he, p as E, t as Q, x as j } from "../Loader-BlVzRtUd.mjs";
-import p from "react";
-import { observer as C } from "mobx-react-lite";
-import h from "@mui/material/Stack";
-import { Icon as R, P, Text as d } from "@mxenabled/mxui";
-import me from "@mui/material/Button";
-import { Icon as ee } from "@mxenabled/mx-icons";
-import { Fragment as N, jsx as e, jsxs as o } from "react/jsx-runtime";
+import { jsxs as r, jsx as e, Fragment as N } from "react/jsx-runtime";
+import u 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";
+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 { 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";
+import P from "@mui/material/Box";
+import { C as le } from "../ConnectionsDrawer-CZU9ku-k.mjs";
+import { fromUnixTime as de } from "date-fns/fromUnixTime";
 import { useTheme as H } from "@mui/material/styles";
-import te from "@mui/material/Box";
-import { fromUnixTime as ue } from "date-fns/fromUnixTime";
-import { differenceInMonths as pe, format as fe, fromUnixTime as xe } from "date-fns";
-import { Stack as ge } from "@mui/material";
+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 G from "@mui/material/List";
-import A from "@mui/material/ListItem";
-import ne from "@mui/material/ListItemButton";
-import V from "@mui/material/ListItemIcon";
-import v from "@mui/material/ListItemText";
-import O from "@mui/material/ListSubheader";
-import ye from "@mui/material/Collapse";
-var _e = ({ amount: t, copy: s, trendValue: i }) => {
-  const n = i > 0, r = i === 0 ? "trending_flat" : n ? "trending_up" : "trending_down";
-  return /* @__PURE__ */ o(h, {
-    sx: {
-      flexDirection: "row",
-      justifyContent: "space-between"
-    },
-    children: [/* @__PURE__ */ e(P, {
-      variant: "h1",
-      children: F(t, "0,0")
-    }), t !== 0 && /* @__PURE__ */ o(h, {
-      sx: { color: n ? "success.main" : "text.secondary" },
-      children: [/* @__PURE__ */ o(h, {
-        sx: {
-          flexDirection: "row",
-          gap: 8
-        },
-        children: [/* @__PURE__ */ e(ee, {
-          name: r,
-          size: 20
-        }), /* @__PURE__ */ e(d, {
-          sx: {
-            fontWeight: 600,
-            textAlign: "right"
-          },
-          variant: "body1",
-          children: F(i, "0,0.00")
-        })]
-      }), /* @__PURE__ */ e(d, {
-        sx: {
-          display: "block",
-          textAlign: "right"
-        },
-        variant: "caption",
-        children: s.this_month
-      })]
-    })]
-  });
-}, ve = ({ copy: t }) => /* @__PURE__ */ o(h, {
-  sx: {
-    flexDirection: "row",
-    gap: 12
-  },
-  children: [/* @__PURE__ */ e(ee, {
-    name: "elevation",
-    size: 32,
-    sx: { color: "text.primary" }
-  }), /* @__PURE__ */ o(h, { children: [/* @__PURE__ */ e(d, {
-    sx: {
-      display: "block",
-      fontWeight: 600
-    },
-    variant: "body1",
-    children: t.empty_widget_header
-  }), /* @__PURE__ */ e(P, {
-    sx: { color: "text.secondary" },
-    variant: "body2",
-    children: t.zero_state_description
-  })] })]
-}), it = C(({ onCTAClick: t }) => {
-  const { visibleAccounts: s } = he(), { onEvent: i } = B(), { net_worth: n, common: r } = E(), { isInitialized: a } = Z(), { isNetWorthDataLoaded: c, loadNetWorthData: l, netWorthData: g, selectedData: f } = j();
-  if (p.useEffect(() => {
+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 { Stack as fe } from "@mui/material";
+import xe from "@mui/material/Collapse";
+import K from "@mui/material/ListItemIcon";
+import { g as U } from "../NetWorthUtils-DfSH3z70.mjs";
+import { D as V } from "../Drawer-DsnW2o0v.mjs";
+import { W as ge } from "../WidgetContainer-DJnp6t6c.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";
+  return /* @__PURE__ */ r(m, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: [
+    /* @__PURE__ */ e(Y, { variant: "h1", children: F(t, "0,0") }),
+    t !== 0 && /* @__PURE__ */ r(m, { sx: { color: n ? "success.main" : "text.secondary" }, children: [
+      /* @__PURE__ */ r(m, { sx: { flexDirection: "row", gap: 8 }, children: [
+        /* @__PURE__ */ e(Z, { name: o, size: 20 }),
+        /* @__PURE__ */ e(d, { sx: { fontWeight: 600, textAlign: "right" }, variant: "body1", children: F(i, "0,0.00") })
+      ] }),
+      /* @__PURE__ */ e(d, { sx: { display: "block", textAlign: "right" }, variant: "caption", children: s.this_month })
+    ] })
+  ] });
+}, be = ({ copy: t }) => /* @__PURE__ */ r(m, { sx: { flexDirection: "row", gap: 12 }, children: [
+  /* @__PURE__ */ e(Z, { name: "elevation", size: 32, sx: { color: "text.primary" } }),
+  /* @__PURE__ */ r(m, { children: [
+    /* @__PURE__ */ e(d, { sx: { display: "block", fontWeight: 600 }, variant: "body1", children: t.empty_widget_header }),
+    /* @__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(() => {
     c || l().finally();
   }, []), J({
     widgetName: "NetWorthMicroWidget",
     isLoaded: c
-  }), p.useEffect(() => {
-    c && i(w.NET_WORTH_LOAD_WIDGET, { state: s?.length ? "default" : "zeroState" });
-  }, [c]), !a || !c) return /* @__PURE__ */ e(Q, { height: 100 });
-  const S = () => {
-    i(s.length ? w.NET_WORTH_CLICK_VIEW_DETAILS : w.NET_WORTH_CLICK_GET_STARTED), t();
+  }), u.useEffect(() => {
+    c && i(v.NET_WORTH_LOAD_WIDGET, {
+      state: s?.length ? "default" : "zeroState"
+    });
+  }, [c]), !o || !c) return /* @__PURE__ */ e(Q, { height: 100 });
+  const W = () => {
+    i(
+      s.length ? v.NET_WORTH_CLICK_VIEW_DETAILS : v.NET_WORTH_CLICK_GET_STARTED
+    ), t();
   };
-  return /* @__PURE__ */ e(ce, {
-    className: "mx-networth-microwidget",
-    ctaLabel: r.see_details,
-    onCTAClick: S,
-    title: n.net_worth,
-    children: g.accounts.length ? /* @__PURE__ */ e(_e, {
-      amount: f?.y,
-      copy: n,
-      trendValue: f?.change
-    }) : /* @__PURE__ */ e(ve, { copy: n })
-  });
-}), Ce = () => {
-  const { isMobile: t } = q(), { availableWidth: s } = de(), i = H(), { hoveredData: n, netWorthChartData: r, selectedData: a, setHoveredIndex: c, setSelectedIndex: l } = j(), g = s - 320, f = r.map((m) => ({
-    x: oe(ue(m.x), re.MONTH_SHORT),
-    y: m.y
-  })), S = a ? { index: r.findIndex((m) => m.x === a.x) } : void 0, W = n ? { index: r.findIndex((m) => m.x === n.x) } : void 0, b = (m) => ({
-    fill: m === S?.index ? i.palette.success.main : "",
-    filter: m === W?.index ? `drop-shadow(0px 0px 10px ${i.palette.success.main})` : "none",
+  return /* @__PURE__ */ e(
+    ie,
+    {
+      className: "mx-networth-microwidget",
+      ctaLabel: a.see_details,
+      onCTAClick: W,
+      title: n.net_worth,
+      children: g.accounts.length ? /* @__PURE__ */ e(
+        Ce,
+        {
+          amount: f?.y,
+          copy: n,
+          trendValue: f?.change
+        }
+      ) : /* @__PURE__ */ e(be, { copy: n })
+    }
+  );
+}), _e = () => {
+  const { isMobile: t } = ee(), { availableWidth: s } = re(), i = H(), {
+    hoveredData: n,
+    netWorthChartData: a,
+    selectedData: o,
+    setHoveredIndex: c,
+    setSelectedIndex: l
+  } = j(), g = s - 320, f = 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) => ({
+    fill: h === W?.index ? i.palette.success.main : "",
+    filter: h === S?.index ? `drop-shadow(0px 0px 10px ${i.palette.success.main})` : "none",
     stroke: i.palette.success.main
-  }), y = (m, M) => {
+  }), y = (h, M) => {
     l(M);
-  }, k = (m) => {
-    c(m);
+  }, k = (h) => {
+    c(h);
   }, D = () => {
     c(-1);
   };
-  return /* @__PURE__ */ e(h, {
-    sx: { width: "100%" },
-    children: /* @__PURE__ */ e(le, {
+  return /* @__PURE__ */ e(m, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
+    me,
+    {
       baseline: "min",
       chartFor: "networthChart",
       chartXaxisSx: { "& .MuiChartsAxis-tickLabel": { transform: "translateX(8px)" } },
@@ -131,481 +118,448 @@ var _e = ({ amount: t, copy: s, trendValue: i }) => {
       datasets: [f],
       height: 350,
       labels: [],
-      margin: {
-        right: 20,
-        left: 38
-      },
-      markHandlers: {
-        onMarkClick: y,
-        onMouseEnter: k,
-        onMouseLeave: D
-      },
-      markStyles: b,
+      margin: { right: 20, left: 38 },
+      markHandlers: { onMarkClick: y, onMouseEnter: k, onMouseLeave: D },
+      markStyles: w,
       showArea: !0,
       useCustomMark: !0,
       valueFormatterString: "0.0[0]a",
       width: t ? s - 48 : g
-    })
+    }
+  ) });
+}, we = _(_e), ve = ({
+  item: t,
+  getStyles: s,
+  isHovered: i = !1,
+  isSelected: n = !1,
+  onItemClick: a,
+  onMouseEnter: o,
+  onMouseLeave: c
+}) => {
+  const [l, g] = u.useState({
+    color: ""
   });
-}, be = C(Ce), we = ({ item: t, getStyles: s, isHovered: i = !1, isSelected: n = !1, onItemClick: r, onMouseEnter: a, onMouseLeave: c }) => {
-  const [l, g] = p.useState({ color: "" });
-  return p.useEffect(() => {
+  return u.useEffect(() => {
     g(s(t));
-  }, [i, n]), /* @__PURE__ */ o(p.Fragment, { children: [/* @__PURE__ */ e(A, {
-    sx: {
-      ...l,
-      minHeight: 44,
-      "&:hover": { color: n ? "inherit" : l.color }
-    },
-    children: /* @__PURE__ */ e(ne, {
-      onClick: (f) => r?.(f, t.x),
-      onMouseEnter: () => a(t.x),
-      onMouseLeave: () => c(),
-      sx: {
-        minHeight: 20,
-        padding: 12
-      },
-      children: /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ o(h, {
-        direction: "row",
-        justifyContent: "space-between",
-        sx: { fontWeight: 400 },
-        children: [/* @__PURE__ */ e(d, {
-          variant: "body1",
-          children: Y(t.x)
-        }), /* @__PURE__ */ e(x, {
-          amount: t.y,
-          sx: { color: "inherit" },
-          variant: "body1"
-        })]
-      }) })
-    })
-  }), /* @__PURE__ */ e(L, {})] }, t.x);
-}, Se = C(we), We = ({ currencyLabel: t, currencyVariant: s = "body2", iconSize: i, netWorth: n, theme: r }) => {
-  let a = r.palette.secondary.main, c = r.palette.secondary.main, l = "trending_flat";
-  return n.change < 0 ? l = "trending_down" : n.change > 0 && (a = r.palette.success.main, c = r.palette.success.main, l = "trending_up"), /* @__PURE__ */ o(ge, {
-    alignItems: "center",
-    direction: "row",
-    spacing: 4,
-    children: [
-      /* @__PURE__ */ e(R, {
+  }, [i, n]), /* @__PURE__ */ r(u.Fragment, { children: [
+    /* @__PURE__ */ e(
+      O,
+      {
+        sx: {
+          ...l,
+          minHeight: 44,
+          "&:hover": { color: n ? "inherit" : l.color }
+        },
+        children: /* @__PURE__ */ e(
+          te,
+          {
+            onClick: (f) => a?.(f, t.x),
+            onMouseEnter: () => o(t.x),
+            onMouseLeave: () => c(),
+            sx: { minHeight: 20, padding: 12 },
+            children: /* @__PURE__ */ e(
+              b,
+              {
+                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(L, {})
+  ] }, t.x);
+}, We = _(ve), Se = ({
+  currencyLabel: t,
+  currencyVariant: s = "body2",
+  iconSize: i,
+  netWorth: n,
+  theme: a
+}) => {
+  let o = a.palette.secondary.main, c = a.palette.secondary.main, l = "trending_flat";
+  return n.change < 0 ? l = "trending_down" : n.change > 0 && (o = a.palette.success.main, c = a.palette.success.main, l = "trending_up"), /* @__PURE__ */ r(fe, { alignItems: "center", direction: "row", spacing: 4, children: [
+    /* @__PURE__ */ e(
+      R,
+      {
         name: l,
         size: i,
-        sx: { color: a }
-      }),
-      /* @__PURE__ */ e(x, {
-        amount: n.change,
-        color: c,
-        variant: s
-      }),
-      /* @__PURE__ */ e(d, {
-        variant: "body2",
-        children: t
-      })
-    ]
-  });
-}, $ = C(We), Te = ({ netWorth: t, gains: s, losses: i, totalGains: n, totalLosses: r }) => {
-  const { net_worth: a } = E(), c = H();
-  return /* @__PURE__ */ o(N, { children: [/* @__PURE__ */ o(h, {
-    alignItems: "center",
-    justifyContent: "space-between",
-    mb: 8,
-    pt: 24,
-    children: [
-      /* @__PURE__ */ e(d, {
-        variant: "body2",
-        children: Y(t?.x)
-      }),
-      /* @__PURE__ */ e(d, {
-        variant: "body1",
-        children: a.total_change
-      }),
-      t && /* @__PURE__ */ e($, {
-        currencyVariant: "h1",
-        iconSize: 32,
-        netWorth: t,
-        theme: c
-      })
-    ]
-  }), /* @__PURE__ */ o(G, { children: [
-    /* @__PURE__ */ e(O, {
-      sx: {
-        mb: 8,
-        mt: 12,
-        mx: 8
-      },
-      children: /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ o(h, {
-        direction: "row",
-        justifyContent: "space-between",
-        children: [/* @__PURE__ */ e(d, {
-          sx: { fontWeight: 700 },
-          variant: "caption",
-          children: a.gains
-        }), /* @__PURE__ */ e(x, {
-          amount: n,
-          sx: { fontWeight: 400 },
-          variant: "caption"
-        })]
-      }) })
-    }),
-    s?.map((l) => /* @__PURE__ */ o(p.Fragment, { children: [/* @__PURE__ */ e(A, {
-      sx: {
-        backgroundColor: c.palette.background.paper,
-        py: 14
-      },
-      children: /* @__PURE__ */ e(v, {
-        primary: /* @__PURE__ */ o(h, {
-          direction: "row",
-          justifyContent: "space-between",
-          children: [/* @__PURE__ */ e(d, {
-            sx: { mr: 10 },
-            variant: "body1",
-            children: l.accountName
-          }), /* @__PURE__ */ e(x, {
-            amount: l.gain,
-            sx: {
-              color: c.palette.success.main,
-              flexShrink: 0,
-              fontWeight: 700
-            },
-            variant: "body1"
-          })]
-        }),
-        sx: { px: 16 }
-      })
-    }), /* @__PURE__ */ e(L, {})] }, l.accountName)),
-    /* @__PURE__ */ e(O, {
-      sx: {
-        mb: 8,
-        mt: 12,
-        mx: 8
-      },
-      children: /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ o(h, {
-        direction: "row",
-        justifyContent: "space-between",
-        children: [/* @__PURE__ */ e(d, {
-          sx: { fontWeight: 700 },
-          variant: "caption",
-          children: a.losses
-        }), /* @__PURE__ */ e(x, {
-          amount: r,
-          sx: { fontWeight: 400 },
-          variant: "caption"
-        })]
-      }) })
-    }),
-    i?.map((l) => /* @__PURE__ */ o(N, { children: [/* @__PURE__ */ e(A, {
-      sx: {
-        backgroundColor: c.palette.background.paper,
-        py: 14
-      },
-      children: /* @__PURE__ */ e(v, {
-        primary: /* @__PURE__ */ o(h, {
-          direction: "row",
+        sx: {
+          color: o
+        }
+      }
+    ),
+    /* @__PURE__ */ e(x, { amount: n.change, color: c, variant: s }),
+    /* @__PURE__ */ e(d, { variant: "body2", children: t })
+  ] });
+}, B = _(Se), Ie = ({
+  netWorth: t,
+  gains: s,
+  losses: i,
+  totalGains: n,
+  totalLosses: a
+}) => {
+  const { net_worth: o } = E(), c = H();
+  return /* @__PURE__ */ r(N, { children: [
+    /* @__PURE__ */ r(m, { alignItems: "center", justifyContent: "space-between", mb: 8, pt: 24, children: [
+      /* @__PURE__ */ e(d, { variant: "body2", children: ne(t?.x) }),
+      /* @__PURE__ */ e(d, { variant: "body1", children: o.total_change }),
+      t && /* @__PURE__ */ e(B, { currencyVariant: "h1", iconSize: 32, netWorth: t, theme: c })
+    ] }),
+    /* @__PURE__ */ r(z, { children: [
+      /* @__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.gains }),
+            /* @__PURE__ */ e(x, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
+          ] })
+        }
+      ) }),
+      s?.map((l) => /* @__PURE__ */ r(u.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,
+                {
+                  amount: l.gain,
+                  sx: { color: c.palette.success.main, flexShrink: 0, fontWeight: 700 },
+                  variant: "body1"
+                }
+              )
+            ] }),
+            sx: { px: 16 }
+          }
+        ) }),
+        /* @__PURE__ */ e(L, {})
+      ] }, 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" })
+          ] })
+        }
+      ) }),
+      i?.map((l) => /* @__PURE__ */ r(N, { 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,
+                    {
+                      amount: l.loss,
+                      sx: { flexShrink: 0, fontWeight: 700 },
+                      variant: "body1"
+                    }
+                  )
+                ] }),
+                sx: { px: 16 }
+              }
+            )
+          },
+          l.accountName
+        ),
+        /* @__PURE__ */ e(L, {})
+      ] }))
+    ] })
+  ] });
+}, Te = _(Ie), Le = ({ accounts: t, name: s, icon: i }) => {
+  const [n, a] = u.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 } }) }),
+      /* @__PURE__ */ e(
+        b,
+        {
+          primary: /* @__PURE__ */ e(d, { sx: { fontWeight: 700 }, variant: "body1", children: s })
+        }
+      ),
+      /* @__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(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,
+        {
+          primary: /* @__PURE__ */ r(m, { direction: "row", justifyContent: "space-between", sx: { fontWeight: 400 }, children: [
+            /* @__PURE__ */ e(
+              d,
+              {
+                sx: {
+                  marginRight: 10
+                },
+                variant: "body1",
+                children: o.accountName
+              }
+            ),
+            /* @__PURE__ */ e(
+              x,
+              {
+                amount: o.balance,
+                sx: {
+                  flexShrink: 0
+                },
+                variant: "body2"
+              }
+            )
+          ] }),
+          sx: { pl: 72, pr: 16 }
+        }
+      ) }),
+      c < t.length - 1 ? /* @__PURE__ */ e(L, { variant: "inset" }) : /* @__PURE__ */ e(L, {})
+    ] }, 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 = ({
+  netWorth: t,
+  assets: s,
+  liabilities: i,
+  totalAssets: n,
+  totalLiabilities: a
+}) => {
+  const { net_worth: o } = E(), c = H();
+  return /* @__PURE__ */ r(N, { children: [
+    /* @__PURE__ */ r(
+      P,
+      {
+        sx: {
+          alignItems: "center",
+          display: "flex",
+          flexDirection: "column",
           justifyContent: "space-between",
-          children: [/* @__PURE__ */ e(d, {
-            sx: { mr: 10 },
-            variant: "body1",
-            children: l.accountName
-          }), /* @__PURE__ */ e(x, {
-            amount: l.loss,
-            sx: {
-              flexShrink: 0,
-              fontWeight: 700
-            },
-            variant: "body1"
-          })]
-        }),
-        sx: { px: 16 }
-      })
-    }, l.accountName), /* @__PURE__ */ e(L, {})] }))
-  ] })] });
-}, Ie = C(Te), Le = ({ accounts: t, name: s, icon: i }) => {
-  const [n, r] = p.useState(!1);
-  return /* @__PURE__ */ o(N, { children: [
-    /* @__PURE__ */ e(A, {
-      sx: (a) => ({ backgroundColor: a.palette.background.paper }),
-      children: /* @__PURE__ */ o(ne, {
-        onClick: () => r(!n),
+          paddingTop: 24,
+          marginBottom: 8
+        },
         children: [
-          i && /* @__PURE__ */ e(V, { children: /* @__PURE__ */ e(R, {
-            name: i,
-            size: 24,
-            sx: { mr: 12 }
-          }) }),
-          /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ e(d, {
-            sx: { fontWeight: 700 },
-            variant: "body1",
-            children: s
-          }) }),
-          /* @__PURE__ */ e(V, { children: n ? /* @__PURE__ */ e(R, {
-            name: "expand_less",
-            size: 24
-          }) : /* @__PURE__ */ e(R, {
-            name: "expand_more",
-            size: 24
-          }) })
+          /* @__PURE__ */ e(d, { variant: "body1", children: o.current_net_worth }),
+          /* @__PURE__ */ e(x, { amount: t?.y ?? 0, variant: "h1" }),
+          t && /* @__PURE__ */ e(
+            B,
+            {
+              currencyLabel: o.this_month,
+              iconSize: 20,
+              netWorth: t,
+              theme: c
+            }
+          )
         ]
-      })
-    }),
-    /* @__PURE__ */ e(L, {}),
-    /* @__PURE__ */ e(ye, {
-      in: n,
-      timeout: "auto",
-      unmountOnExit: !0,
-      children: t.map((a, c) => /* @__PURE__ */ o(G, { children: [/* @__PURE__ */ e(A, {
-        sx: () => ({ py: 14 }),
-        children: /* @__PURE__ */ e(v, {
-          primary: /* @__PURE__ */ o(h, {
-            direction: "row",
-            justifyContent: "space-between",
-            sx: { fontWeight: 400 },
-            children: [/* @__PURE__ */ e(d, {
-              sx: { marginRight: 10 },
-              variant: "body1",
-              children: a.accountName
-            }), /* @__PURE__ */ e(x, {
-              amount: a.balance,
-              sx: { flexShrink: 0 },
-              variant: "body2"
-            })]
-          }),
-          sx: {
-            pl: 72,
-            pr: 16
-          }
-        })
-      }), c < t.length - 1 ? /* @__PURE__ */ e(L, { variant: "inset" }) : /* @__PURE__ */ e(L, {})] }, a.accountName))
-    })
+      }
+    ),
+    /* @__PURE__ */ r(z, { children: [
+      /* @__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.assets }),
+            /* @__PURE__ */ e(x, { amount: n, sx: { fontWeight: 400 }, variant: "caption" })
+          ] })
+        }
+      ) }),
+      /* @__PURE__ */ e(X, { groupedAccounts: U(s) }),
+      /* @__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.liabilities }),
+            /* @__PURE__ */ e(
+              x,
+              {
+                amount: a,
+                sx: { fontWeight: 400 },
+                variant: "caption"
+              }
+            )
+          ] })
+        }
+      ) }),
+      /* @__PURE__ */ e(X, { groupedAccounts: U(i) })
+    ] })
   ] });
-}, 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 = ({ netWorth: t, assets: s, liabilities: i, totalAssets: n, totalLiabilities: r }) => {
-  const { net_worth: a } = E(), c = H();
-  return /* @__PURE__ */ o(N, { children: [/* @__PURE__ */ o(te, {
-    sx: {
-      alignItems: "center",
-      display: "flex",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      paddingTop: 24,
-      marginBottom: 8
-    },
-    children: [
-      /* @__PURE__ */ e(d, {
-        variant: "body1",
-        children: a.current_net_worth
-      }),
-      /* @__PURE__ */ e(x, {
-        amount: t?.y ?? 0,
-        variant: "h1"
-      }),
-      t && /* @__PURE__ */ e($, {
-        currencyLabel: a.this_month,
-        iconSize: 20,
-        netWorth: t,
-        theme: c
-      })
-    ]
-  }), /* @__PURE__ */ o(G, { children: [
-    /* @__PURE__ */ e(O, {
-      sx: {
-        mb: 8,
-        mt: 12,
-        mx: 8
-      },
-      children: /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ o(h, {
-        direction: "row",
-        justifyContent: "space-between",
-        children: [/* @__PURE__ */ e(d, {
-          sx: { fontWeight: 700 },
-          variant: "caption",
-          children: a.assets
-        }), /* @__PURE__ */ e(x, {
-          amount: n,
-          sx: { fontWeight: 400 },
-          variant: "caption"
-        })]
-      }) })
-    }),
-    /* @__PURE__ */ e(X, { groupedAccounts: K(s) }),
-    /* @__PURE__ */ e(O, {
-      sx: {
-        mb: 8,
-        mt: 12,
-        mx: 8
-      },
-      children: /* @__PURE__ */ e(v, { primary: /* @__PURE__ */ o(h, {
-        direction: "row",
-        justifyContent: "space-between",
-        children: [/* @__PURE__ */ e(d, {
-          sx: { fontWeight: 700 },
-          variant: "caption",
-          children: a.liabilities
-        }), /* @__PURE__ */ e(x, {
-          amount: r,
-          sx: { fontWeight: 400 },
-          variant: "caption"
-        })]
-      }) })
-    }),
-    /* @__PURE__ */ e(X, { groupedAccounts: K(i) })
-  ] })] });
-}, Ne = C(De), Ee = () => {
-  const { net_worth: t } = E(), s = H(), { onEvent: i } = B(), { assetsLiabilities: n, gainsLosses: r, hoveredData: a, netWorthChartData: c, selectedData: l, setHoveredIndex: g, setSelectedIndex: f } = j(), [S, W] = p.useState(!1), [b, y] = p.useState(!1), k = (u) => {
-    const _ = u.x === a?.x, T = u.x === l?.x, I = {
+}, Ne = _(De), Ee = () => {
+  const { net_worth: t } = E(), s = H(), { onEvent: i } = $(), {
+    assetsLiabilities: n,
+    gainsLosses: a,
+    hoveredData: o,
+    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 = {
       backgroundColor: "inherit",
       borderBottom: "inherit",
       color: "inherit"
     };
-    return _ && (I.color = T ? "inherit" : I.color, I.backgroundColor = s.palette.action.hover), T && (I.backgroundColor = s.palette.primary.main, I.borderBottom = s.palette.neutral.light, I.color = s.palette.common.white), I;
-  }, D = (u, _) => {
-    f(_), u.currentTarget instanceof HTMLDivElement && W(!0);
-  }, m = () => {
-    y(!0), i(w.NET_WORTH_WIDGET_CLICK_ASSETS_LIABILITIES);
-  }, M = (u) => {
-    g(u);
-  }, z = () => {
+    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);
+  }, h = () => {
+    y(!0), i(v.NET_WORTH_WIDGET_CLICK_ASSETS_LIABILITIES);
+  }, M = (p) => {
+    g(p);
+  }, G = () => {
     g(-1);
   };
-  return /* @__PURE__ */ o(h, {
-    direction: "column",
-    sx: { width: 320 },
-    children: [
-      /* @__PURE__ */ o(G, { children: [
-        /* @__PURE__ */ e(O, {
-          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, {}),
-        c.map((u, _) => /* @__PURE__ */ e(Se, {
+  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, {}),
+      c.map((p, C) => /* @__PURE__ */ e(
+        We,
+        {
           getStyles: k,
-          isHovered: u.x === a?.x,
-          isSelected: u.x === l?.x,
-          item: u,
-          onItemClick: (T) => D(T, _),
-          onMouseEnter: () => M(_),
-          onMouseLeave: () => z()
-        }, u.x))
-      ] }),
-      /* @__PURE__ */ e(me, {
-        onClick: () => m(),
-        sx: {
-          alignSelf: "center",
-          marginTop: 16,
-          width: "fit-content"
+          isHovered: p.x === o?.x,
+          isSelected: p.x === l?.x,
+          item: p,
+          onItemClick: (I) => D(I, C),
+          onMouseEnter: () => M(C),
+          onMouseLeave: () => G()
         },
+        p.x
+      ))
+    ] }),
+    /* @__PURE__ */ e(
+      ue,
+      {
+        onClick: () => h(),
+        sx: { alignSelf: "center", marginTop: 16, width: "fit-content" },
         variant: "outlined",
         children: t.view_assets_and_liabilities
-      }),
-      /* @__PURE__ */ e(U, {
+      }
+    ),
+    /* @__PURE__ */ e(
+      V,
+      {
         ariaLabelClose: "Close",
-        isOpen: S,
-        onClose: () => W(!1),
+        isOpen: W,
+        onClose: () => S(!1),
         shouldShowHeaderBorders: !1,
         shouldShowHeaderShadow: !0,
         title: t.gains_and_losses,
-        children: r && /* @__PURE__ */ e(Ie, { ...r })
-      }),
-      /* @__PURE__ */ e(U, {
+        children: a && /* @__PURE__ */ e(Te, { ...a })
+      }
+    ),
+    /* @__PURE__ */ e(
+      V,
+      {
         ariaLabelClose: "Close",
-        isOpen: b,
+        isOpen: w,
         onClose: () => y(!1),
         shouldShowHeaderBorders: !1,
         shouldShowHeaderShadow: !0,
         title: t.assets_and_liabilities,
         children: n && /* @__PURE__ */ e(Ne, { ...n })
-      })
-    ]
-  });
-}, ke = C(Ee), Me = ({ hoveredData: t, selectedData: s }) => {
-  const { net_worth: i } = E(), n = H(), r = t || s, a = fe(xe(r.x), "MMMM");
-  return /* @__PURE__ */ o(h, {
-    alignItems: "center",
-    direction: "column",
-    m: 24,
-    children: [
-      /* @__PURE__ */ e(d, {
-        color: n.palette.secondary.main,
-        variant: "body2",
-        children: `${a} ${i.net_worth}`
-      }),
-      /* @__PURE__ */ e(x, {
-        amount: r.y,
-        variant: "h2"
-      }),
-      /* @__PURE__ */ e($, {
-        currencyLabel: i.this_month,
-        netWorth: r,
-        theme: n
-      })
-    ]
-  });
-}, Ae = C(Me), at = C(({ onBackClick: t, onMenuClick: s }) => {
-  const { isInitialized: i } = Z(), { accounts: n, net_worth: r } = E(), { hoveredData: a, isNetWorthDataLoaded: c, loadNetWorthData: l, netWorthChartData: g, selectedData: f, setTimeframe: S, timeframe: W } = j(), { isMobile: b } = q(), { onEvent: y } = B(), [k, D] = p.useState(!1);
+      }
+    )
+  ] });
+}, ke = _(Ee), Me = ({ hoveredData: t, selectedData: s }) => {
+  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(B, { currencyLabel: i.this_month, netWorth: a, theme: n })
+  ] });
+}, Ae = _(Me), yt = _(({ onBackClick: t, onMenuClick: s }) => {
+  const { isInitialized: i } = q(), { accounts: n, net_worth: a } = E(), {
+    hoveredData: o,
+    isNetWorthDataLoaded: c,
+    loadNetWorthData: l,
+    netWorthChartData: g,
+    selectedData: f,
+    setTimeframe: W,
+    timeframe: S
+  } = j(), { isMobile: w } = ee(), { onEvent: y } = $(), [k, D] = u.useState(!1);
   J({
     widgetName: "NetWorthWidget",
     isLoaded: c
-  }), p.useEffect(() => {
-    c || l().finally(), y(w.NET_WORTH_VIEW);
-  }, []), p.useEffect(() => {
-    y(w.NET_WORTH_WIDGET_CLICK_TIMEFRAME, { time_period: W + "M" });
-  }, [W]);
-  const m = async (u) => {
-    const _ = u[0], T = u[1];
-    _ && T && S(pe(T, _));
+  }), 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));
   }, M = () => {
-    D(!0), y(w.ACCOUNTS_CLICK_CONNECT);
+    D(!0), y(v.ACCOUNTS_CLICK_CONNECT);
   };
   if (!i || !c) return /* @__PURE__ */ e(Q, {});
-  const z = g.length === 0;
-  return /* @__PURE__ */ o(ae, {
-    calendarActions: { onRangeChanged: m },
-    dateRangeVariant: b ? "timeframetabs" : "timeframebuttons",
-    onAccountsFilterClick: () => y(w.NET_WORTH_WIDGET_CLICK_FILTER),
-    onBackClick: t,
-    onMenuClick: s,
-    title: r.net_worth,
-    children: [z ? /* @__PURE__ */ e(te, {
-      sx: { justifyItems: "center" },
-      children: /* @__PURE__ */ e(ie, {
-        header: r.empty_widget_header,
-        icon: "elevation",
-        onClick: M,
-        primaryButton: r.empty_widget_button,
-        subText: r.empty_widget_description,
-        sx: {
-          width: { sm: 432 },
-          ".buttons-footer": { width: 167 }
-        }
-      })
-    }) : /* @__PURE__ */ o(N, { children: [f && /* @__PURE__ */ e(Ae, {
-      hoveredData: a,
-      selectedData: f
-    }), /* @__PURE__ */ o(h, {
-      alignItems: b ? "center" : "flex-start",
-      direction: b ? "column" : "row",
-      spacing: b ? 0 : 48,
-      children: [/* @__PURE__ */ e(be, {}), /* @__PURE__ */ e(ke, {})]
-    })] }), /* @__PURE__ */ e(se, {
-      onClose: () => D(!1),
-      showConnectionsWidget: k,
-      title: n.manage_connections
-    })]
-  });
+  const G = g.length === 0;
+  return /* @__PURE__ */ r(
+    ge,
+    {
+      calendarActions: { onRangeChanged: h },
+      dateRangeVariant: w ? "timeframetabs" : "timeframebuttons",
+      onAccountsFilterClick: () => y(v.NET_WORTH_WIDGET_CLICK_FILTER),
+      onBackClick: t,
+      onMenuClick: s,
+      title: a.net_worth,
+      children: [
+        G ? /* @__PURE__ */ e(P, { sx: { justifyItems: "center" }, children: /* @__PURE__ */ e(
+          ye,
+          {
+            header: a.empty_widget_header,
+            icon: "elevation",
+            onClick: M,
+            primaryButton: a.empty_widget_button,
+            subText: a.empty_widget_description,
+            sx: {
+              width: { sm: 432 },
+              ".buttons-footer": {
+                width: 167
+              }
+            }
+          }
+        ) }) : /* @__PURE__ */ r(N, { children: [
+          f && /* @__PURE__ */ e(Ae, { hoveredData: o, selectedData: f }),
+          /* @__PURE__ */ r(
+            m,
+            {
+              alignItems: w ? "center" : "flex-start",
+              direction: w ? "column" : "row",
+              spacing: w ? 0 : 48,
+              children: [
+                /* @__PURE__ */ e(we, {}),
+                /* @__PURE__ */ e(ke, {})
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e(
+          le,
+          {
+            onClose: () => D(!1),
+            showConnectionsWidget: k,
+            title: n.manage_connections
+          }
+        )
+      ]
+    }
+  );
 });
 export {
-  it as NetWorthMicroWidget,
-  at as NetWorthWidget
+  gt as NetWorthMicroWidget,
+  yt as NetWorthWidget
 };
+//# sourceMappingURL=index.es.js.map