@mx-cartographer/experiences 7.3.3-alpha.mega1 → 7.4.0

package/dist/spending/index.es.js

@@ -1,393 +1,218 @@
-import { jsxs as h, jsx as t, Fragment as St } from "react/jsx-runtime";
-import p from "react";
-import { observer as v } from "mobx-react-lite";
-import { startOfMonth as st } from "date-fns/startOfMonth";
-import { endOfMonth as ct } from "date-fns/endOfMonth";
-import D from "@mui/material/Box";
-import f from "@mui/material/Stack";
-import N from "@mui/material/Tab";
-import lt from "@mui/material/Tabs";
-import Tt from "@mui/material/styles/useTheme";
-import { b as F } from "../CategoryUtil-BR3H5i6n.mjs";
-import { b as _ } from "../Category-CevNQ03n.mjs";
-import { Text as C, CategoryIcon as Mt, CategoryIconVariants as xt, Icon as Dt } from "@mxenabled/mxui";
-import { f as w } from "../NumberFormatting-Buh7u8Oi.mjs";
-import { c as wt, T as vt, a as It } from "../TransactionDetails-BUoNbsu-.mjs";
-import dt from "@mui/material/Button";
-import { useTheme as gt } from "@mui/material";
-import { u as I, b as k, m as P, d as ut, n as Et, a as H, h as At, g as Lt } from "../hooks-Cy8JnjCg.mjs";
-import { u as pt } from "../useScreenSize-B6JyS_Lj.mjs";
-import { D as Nt } from "../Donut-oaQFlbit.mjs";
-import { L as K } from "../Loader-DUaFpDGv.mjs";
-import { M as Wt } from "../MiniWidgetContainer-BdgBvpga.mjs";
-import { startOfToday as tt } from "date-fns/startOfToday";
-import { e as Ot } from "../exportTransactionsToCSV-C4PkIYP6.mjs";
-import kt from "@mui/material/Collapse";
-import V from "@mui/material/Divider";
-import et from "@mui/material/List";
-import nt from "@mui/material/ListItem";
-import Rt from "@mui/material/ListItemButton";
-import { D as ot } from "../Drawer-kEE73B87.mjs";
-import { A as at, W as $t } from "../WidgetContainer-BnTgAfQn.mjs";
-const z = 5, Gt = (n, d, s) => s.reduce((l, e) => {
-  if (e.total > 0) {
-    const a = n.find((r) => r.guid === e.category_guid);
-    if (!a) return l;
-    const i = a.parent_guid ?? a.guid, o = n.find((r) => r.guid === i);
-    if (!o) return l;
-    const c = {
-      guid: a.guid,
-      name: a.guid === i ? `General ${a.name}` : a.name,
-      color: F(o.guid, d),
-      amount: e.total
-    }, u = l.find((r) => r.guid === i);
-    u ? (u.amount += e.total, u.categoryTotals?.push(c)) : l.push({
-      guid: i,
-      name: o.name,
-      color: F(o.guid, d),
-      categoryTotals: [c],
-      amount: e.total
-    });
-  }
-  return l;
-}, []), mt = (n, d, s, l) => {
-  const e = Gt(n, s, l), a = e.filter(
-    (r) => r.guid !== _.INCOME && r.guid !== _.INVESTMENTS && r.guid !== _.TRANSFER
-  ).sort((r, m) => m.amount - r.amount), i = a.reduce(
-    (r, m) => r + m.amount,
-    0
-  ), o = a.length > z ? z : a.length, c = a.slice(0, o), u = c.map((r) => ({
-    id: r.guid,
-    color: F(r.guid, s),
-    label: r.name,
-    value: r.amount / i * 100
-  }));
-  if (a.length > 5) {
-    const r = a.slice(z, e.length), m = r.reduce(
-      (M, g) => M + g.amount,
-      0
-    );
-    c.push({
-      guid: "other",
-      color: s.palette.categories.others || "",
-      name: d.saving_goal_other,
-      categoryTotals: r,
-      amount: m
-    }), u.push({
-      id: "other",
-      color: s.palette.categories.others || "",
-      label: d.saving_goal_other,
-      value: m / i * 100
-    });
-  }
-  return {
-    categoryData: c,
-    donutData: u,
-    totalAmount: i
-  };
-}, ht = (n, d, s) => {
-  const l = n.filter(
-    (o) => o.guid === _.INCOME || o.parent_guid === _.INCOME
-  ), e = d.filter((o) => l.some((c) => c.guid === o.category_guid)).sort((o, c) => o.total - c.total).map((o, c) => ({
-    guid: o.category_guid,
-    name: n.find((u) => u.guid === o.category_guid)?.name,
-    color: s[c],
-    categoryTotals: [],
-    amount: Math.abs(o.total)
-  })), a = e.reduce(
-    (o, c) => o + c.amount,
-    0
-  ), i = e.map((o) => ({
-    id: o.guid,
-    color: o.color,
-    label: o.name,
-    value: o.amount / a * 100
-  }));
-  return {
-    categoryData: e,
-    donutData: i,
-    totalAmount: a
-  };
-}, W = ({ amount: n, label: d }) => /* @__PURE__ */ h(f, { direction: "column", children: [
-  /* @__PURE__ */ t(C, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: d }),
-  /* @__PURE__ */ t(C, { variant: "XSmall", children: w(n, "0,0") })
-] }), jt = ({
-  data: n,
-  isIncome: d = !1,
-  onSelected: s,
-  onViewTransactions: l,
-  selectedId: e,
-  size: a = 150,
-  totalLabel: i,
-  variant: o = "mini"
-}) => {
-  const { spending: c } = I(), u = gt(), { isTablet: r } = pt(), { announce: m, ariaLive: M } = wt(), g = p.useMemo(
-    () => e ? n.categoryData.find((S) => S.guid === e) : void 0,
-    [e]
-  );
-  p.useEffect(() => {
-    if (g) {
-      const S = w(g.amount, "0,0");
-      m(`${g.name}: ${S}`);
-    }
-  }, [g, m]);
-  const b = p.useMemo(() => n.donutData.length > 0 ? n.donutData : [{ id: "0", color: u.palette.divider, value: 100 }], [n, u]), E = () => {
-    l?.(e);
-  }, x = r ? 32 : 48;
-  return /* @__PURE__ */ h(St, { children: [
-    M,
-    /* @__PURE__ */ t(Nt, { data: b, onClick: s, selectedId: e, size: a, children: /* @__PURE__ */ t(f, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ h(f, { alignItems: "center", justifyContent: "center", minHeight: a, minWidth: a, children: [
-      g && /* @__PURE__ */ h(
-        f,
-        {
-          alignItems: "center",
-          gap: o === "mini" ? 0 : 8,
-          mb: o === "mini" ? 0 : 8,
-          mt: o === "mini" ? 0 : -16,
-          sx: o === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
-          children: [
-            /* @__PURE__ */ t(
-              Mt,
-              {
-                categoryGuid: d ? _.INCOME : g.guid,
-                size: o === "mini" ? 24 : x,
-                variant: xt.Transparent
-              }
-            ),
-            /* @__PURE__ */ t(
-              C,
-              {
-                color: "secondary",
-                noWrap: !0,
-                variant: o === "mini" ? "Tiny" : "Body",
-                children: g ? g.name : i
-              }
-            )
-          ]
-        }
-      ),
-      !g && o === "full" && /* @__PURE__ */ t(C, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: i }),
-      /* @__PURE__ */ t(C, { variant: o === "mini" ? "H2" : "H1", children: g ? w(g.amount, "0,0") : w(n.totalAmount, "0,0") }),
-      !g && o === "mini" && /* @__PURE__ */ t(C, { color: "secondary", noWrap: !0, variant: "Tiny", children: i }),
-      o === "full" && /* @__PURE__ */ t(
-        dt,
-        {
-          "aria-label": `View ${g?.name || ""} Transactions`,
-          disabled: n.categoryData.length === 0,
-          onClick: E,
-          sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
-          variant: "text",
-          children: c.view_transactions
-        }
-      )
-    ] }) }) })
-  ] });
-}, O = v(jt), it = ({ data: n, onSelected: d, selectedId: s }) => {
-  const l = (e, a) => {
-    (e.key === "Enter" || e.key === " ") && (e.preventDefault(), d(a));
-  };
-  return /* @__PURE__ */ t(f, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: n.categoryData.map((e) => /* @__PURE__ */ h(
-    f,
-    {
-      alignItems: "center",
-      "aria-label": e.name,
-      "aria-pressed": e.guid === s,
-      direction: "row",
-      gap: 8,
-      onClick: () => d(e.guid),
-      onKeyDown: (a) => l(a, e.guid),
-      role: "button",
-      sx: { cursor: "pointer" },
-      tabIndex: 0,
-      children: [
-        /* @__PURE__ */ t(D, { borderRadius: 4, height: 8, sx: { backgroundColor: e.color }, width: 8 }),
-        /* @__PURE__ */ t(C, { bold: e.guid === s, variant: "XSmall", children: e.name })
-      ]
-    },
-    e.guid
-  )) });
-}, Bt = () => {
-  const n = Tt(), { goals: d, spending: s } = I(), { selectedAccounts: l } = k(), {
-    categories: e,
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import i from "react";
+import { observer as x } from "mobx-react-lite";
+import { startOfMonth as it } from "date-fns/startOfMonth";
+import { endOfMonth as rt } from "date-fns/endOfMonth";
+import M from "@mui/material/Box";
+import C from "@mui/material/Stack";
+import E from "@mui/material/Tab";
+import st from "@mui/material/Tabs";
+import ft from "@mui/material/styles/useTheme";
+import { g as ct, a as lt, S as W, b as Q } from "../SpendingLegend-B2BYr8B4.mjs";
+import { Text as y, Icon as bt } from "@mxenabled/mxui";
+import { f as A } from "../NumberFormatting-Buh7u8Oi.mjs";
+import { u as v, b as R, m as F, d as dt, n as _t, a as V, h as Ct, g as yt } from "../hooks-C41HAxM5.mjs";
+import { L as P } from "../Loader-DUaFpDGv.mjs";
+import { M as St } from "../MiniWidgetContainer-CmXpTylX.mjs";
+import { startOfToday as Z } from "date-fns/startOfToday";
+import Tt from "@mui/material/Button";
+import { useTheme as Mt } from "@mui/material";
+import { e as xt } from "../exportTransactionsToCSV-Cz2t0lmA.mjs";
+import { T as vt, a as wt } from "../TransactionDetails-CtbBBSoU.mjs";
+import Dt from "@mui/material/Collapse";
+import z from "@mui/material/Divider";
+import tt from "@mui/material/List";
+import et from "@mui/material/ListItem";
+import It from "@mui/material/ListItemButton";
+import { u as Lt } from "../useScreenSize-B6JyS_Lj.mjs";
+import { D as nt } from "../Drawer-BEtCk82g.mjs";
+import { b as I } from "../Category-CevNQ03n.mjs";
+import { A as ot, W as At } from "../WidgetContainer-6dsjtOVg.mjs";
+const N = ({ amount: e, label: d }) => /* @__PURE__ */ c(C, { direction: "column", children: [
+  /* @__PURE__ */ t(y, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: d }),
+  /* @__PURE__ */ t(y, { variant: "XSmall", children: A(e, "0,0") })
+] }), Et = () => {
+  const e = ft(), { goals: d, spending: o } = v(), { selectedAccounts: l } = R(), {
+    categories: r,
     dateRangeCategoryTotals: a,
-    dataRangeTotalsLoaded: i,
-    loadDateRangeCategoryTotals: o
-  } = P(), c = p.useMemo(
+    dataRangeTotalsLoaded: n,
+    loadDateRangeCategoryTotals: u
+  } = F(), s = i.useMemo(
     () => [
-      n.palette.chartMono.chartMono5,
-      n.palette.chartMono.chartMono4,
-      n.palette.chartMono.chartMono3,
-      n.palette.chartMono.chartMono2,
-      n.palette.chartMono.chartMono1,
-      n.palette.chartMono.chartMono6
+      e.palette.chartMono.chartMono5,
+      e.palette.chartMono.chartMono4,
+      e.palette.chartMono.chartMono3,
+      e.palette.chartMono.chartMono2,
+      e.palette.chartMono.chartMono1,
+      e.palette.chartMono.chartMono6
     ],
-    [n]
+    [e]
   );
-  p.useEffect(() => {
-    o(
+  i.useEffect(() => {
+    u(
       l,
-      st(/* @__PURE__ */ new Date()),
-      ct(/* @__PURE__ */ new Date())
+      it(/* @__PURE__ */ new Date()),
+      rt(/* @__PURE__ */ new Date())
     ).finally();
   }, [l]);
-  const [u, r] = p.useState(""), [m, M] = p.useState(0), g = p.useMemo(
-    () => mt(e, d, n, a),
-    [e, a]
-  ), b = p.useMemo(
-    () => ht(e, a, c),
-    [e, a, c]
-  ), E = (S, R) => {
-    M(R), r("");
-  }, x = (S) => {
-    r(u === S ? "" : S);
+  const [m, p] = i.useState(""), [h, w] = i.useState(0), _ = i.useMemo(
+    () => ct(r, d, e, a),
+    [r, a]
+  ), f = i.useMemo(
+    () => lt(r, a, s),
+    [r, a, s]
+  ), O = (T, k) => {
+    w(k), p("");
+  }, S = (T) => {
+    p(m === T ? "" : T);
   };
-  return i ? /* @__PURE__ */ h(D, { width: "100%", children: [
-    /* @__PURE__ */ h(
-      lt,
+  return n ? /* @__PURE__ */ c(M, { width: "100%", children: [
+    /* @__PURE__ */ c(
+      st,
       {
-        "aria-label": s.mini_title,
-        onChange: E,
-        value: m,
+        "aria-label": o.mini_title,
+        onChange: O,
+        value: h,
         variant: "fullWidth",
         children: [
           /* @__PURE__ */ t(
-            N,
+            E,
             {
               "aria-controls": "spending-tabpanel",
               id: "spending-tab",
               label: /* @__PURE__ */ t(
-                W,
+                N,
                 {
-                  amount: g.totalAmount,
-                  label: s.spend_tab_title
+                  amount: _.totalAmount,
+                  label: o.spend_tab_title
                 }
               ),
-              tabIndex: m === 0 ? 0 : -1
+              tabIndex: h === 0 ? 0 : -1
             }
           ),
           /* @__PURE__ */ t(
-            N,
+            E,
             {
               "aria-controls": "income-tabpanel",
               id: "income-tab",
               label: /* @__PURE__ */ t(
-                W,
+                N,
                 {
-                  amount: b.totalAmount,
-                  label: s.income_tab_title
+                  amount: f.totalAmount,
+                  label: o.income_tab_title
                 }
               ),
-              tabIndex: m === 1 ? 0 : -1
+              tabIndex: h === 1 ? 0 : -1
             }
           )
         ]
       }
     ),
     /* @__PURE__ */ t(
-      D,
+      M,
       {
         "aria-labelledby": "spending-tab",
-        hidden: m !== 0,
+        hidden: h !== 0,
         id: "spending-tabpanel",
         role: "tabpanel",
-        children: /* @__PURE__ */ h(f, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+        children: /* @__PURE__ */ c(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
           /* @__PURE__ */ t(
-            O,
+            W,
             {
-              data: g,
-              onSelected: x,
-              selectedId: u,
-              totalLabel: s.total_spending
+              data: _,
+              onSelected: S,
+              selectedId: m,
+              totalLabel: o.total_spending
             }
           ),
-          /* @__PURE__ */ t(it, { data: g, onSelected: x, selectedId: u })
+          /* @__PURE__ */ t(Q, { data: _, onSelected: S, selectedId: m })
         ] })
       }
     ),
     /* @__PURE__ */ t(
-      D,
+      M,
       {
         "aria-labelledby": "income-tab",
-        hidden: m !== 1,
+        hidden: h !== 1,
         id: "income-tabpanel",
         role: "tabpanel",
-        children: /* @__PURE__ */ h(f, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+        children: /* @__PURE__ */ c(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
           /* @__PURE__ */ t(
-            O,
+            W,
             {
-              data: b,
+              data: f,
               isIncome: !0,
-              onSelected: x,
-              selectedId: u,
-              totalLabel: s.total_income
+              onSelected: S,
+              selectedId: m,
+              totalLabel: o.total_income
             }
           ),
-          /* @__PURE__ */ t(it, { data: b, onSelected: x, selectedId: u })
+          /* @__PURE__ */ t(Q, { data: f, onSelected: S, selectedId: m })
         ] })
       }
     )
-  ] }) : /* @__PURE__ */ t(K, { height: 250 });
-}, Vt = v(Bt), zt = ({ onPrimaryCtaClick: n, sx: d = {} }) => {
-  const { visibleAccounts: s } = ut(), { spending: l } = I(), { isCopyLoaded: e, isInitialized: a, setSelectedAccounts: i } = k();
-  return p.useEffect(() => {
-    i(s);
-  }, [s]), !e || !a ? /* @__PURE__ */ t(K, {}) : /* @__PURE__ */ t(
-    Wt,
+  ] }) : /* @__PURE__ */ t(P, { height: 250 });
+}, Wt = x(Et), Nt = ({ onPrimaryCtaClick: e, sx: d = {} }) => {
+  const { visibleAccounts: o } = dt(), { spending: l } = v(), { isCopyLoaded: r, isInitialized: a, setSelectedAccounts: n } = R();
+  return i.useEffect(() => {
+    n(o);
+  }, [o]), !r || !a ? /* @__PURE__ */ t(P, {}) : /* @__PURE__ */ t(
+    St,
     {
       className: "mx-exp-spending-miniwidget",
-      onPrimaryCtaClick: n,
+      onPrimaryCtaClick: e,
       primaryCtaLabel: l.primary_cta,
       sx: d,
       title: l.mini_title,
-      children: /* @__PURE__ */ t(Vt, {})
+      children: /* @__PURE__ */ t(Wt, {})
     }
   );
-}, ve = v(zt), Ft = ({
-  data: n,
+}, be = x(Nt), Rt = ({
+  data: e,
   onSelected: d,
-  selectedId: s = "",
+  selectedId: o = "",
   title: l
 }) => {
-  const { spending: e } = I(), a = n.categoryData.find((i) => i.guid === s);
-  return /* @__PURE__ */ h(f, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
-    /* @__PURE__ */ t(C, { bold: !0, sx: { py: 12 }, children: `${l} ${e.by_category}` }),
-    /* @__PURE__ */ t(V, { "aria-hidden": "true" }),
-    /* @__PURE__ */ t(et, { children: n.categoryData.map((i) => /* @__PURE__ */ h(p.Fragment, { children: [
+  const { spending: r } = v(), a = e.categoryData.find((n) => n.guid === o);
+  return /* @__PURE__ */ c(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
+    /* @__PURE__ */ t(y, { bold: !0, sx: { py: 12 }, children: `${l} ${r.by_category}` }),
+    /* @__PURE__ */ t(z, { "aria-hidden": "true" }),
+    /* @__PURE__ */ t(tt, { children: e.categoryData.map((n) => /* @__PURE__ */ c(i.Fragment, { children: [
       /* @__PURE__ */ t(
-        nt,
+        et,
         {
           disableGutters: !0,
           disablePadding: !0,
           sx: {
             minHeight: 44
           },
-          children: /* @__PURE__ */ h(
-            Rt,
+          children: /* @__PURE__ */ c(
+            It,
             {
-              "aria-expanded": a?.guid === i.guid,
-              onClick: () => d(i.guid),
+              "aria-expanded": a?.guid === n.guid,
+              onClick: () => d(n.guid),
               sx: { minHeight: 44, px: 8, py: 0 },
               children: [
                 /* @__PURE__ */ t(
-                  D,
+                  M,
                   {
                     borderRadius: 4,
                     flexShrink: 0,
                     height: 8,
-                    sx: { backgroundColor: i.color, mr: 8 },
+                    sx: { backgroundColor: n.color, mr: 8 },
                     width: 8
                   }
                 ),
-                /* @__PURE__ */ h(
-                  f,
+                /* @__PURE__ */ c(
+                  C,
                   {
                     alignItems: "center",
                     direction: "row",
                     justifyContent: "space-between",
                     width: "100%",
                     children: [
-                      /* @__PURE__ */ t(C, { bold: s === i.guid, children: i.name }),
-                      /* @__PURE__ */ t(C, { bold: s === i.guid, variant: "Body", children: w(i.amount, "0,0") })
+                      /* @__PURE__ */ t(y, { bold: o === n.guid, children: n.name }),
+                      /* @__PURE__ */ t(y, { bold: o === n.guid, variant: "Body", children: A(n.amount, "0,0") })
                     ]
                   }
                 )
@@ -396,51 +221,51 @@ const z = 5, Gt = (n, d, s) => s.reduce((l, e) => {
           )
         }
       ),
-      /* @__PURE__ */ t(V, {}),
-      i.categoryTotals && i.categoryTotals.length > 0 && /* @__PURE__ */ t(kt, { in: a?.guid === i.guid, unmountOnExit: !0, children: /* @__PURE__ */ h(et, { children: [
-        a?.categoryTotals?.map((o) => /* @__PURE__ */ t(
-          nt,
+      /* @__PURE__ */ t(z, {}),
+      n.categoryTotals && n.categoryTotals.length > 0 && /* @__PURE__ */ t(Dt, { in: a?.guid === n.guid, unmountOnExit: !0, children: /* @__PURE__ */ c(tt, { children: [
+        a?.categoryTotals?.map((u) => /* @__PURE__ */ t(
+          et,
           {
             sx: {
               pl: 24,
               pr: 8,
               py: 0
             },
-            children: /* @__PURE__ */ h(f, { direction: "row", justifyContent: "space-between", width: "100%", children: [
-              /* @__PURE__ */ h(C, { children: [
-                o.name,
+            children: /* @__PURE__ */ c(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
+              /* @__PURE__ */ c(y, { children: [
+                u.name,
                 " "
               ] }),
-              /* @__PURE__ */ t(C, { children: w(o.amount, "0,0") })
+              /* @__PURE__ */ t(y, { children: A(u.amount, "0,0") })
             ] })
           },
-          o.guid
+          u.guid
         )),
-        /* @__PURE__ */ t(V, {})
+        /* @__PURE__ */ t(z, {})
       ] }) })
-    ] }, i.guid)) }),
-    /* @__PURE__ */ t(C, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${e.total}: ${w(n.totalAmount, "0,0")}` })
+    ] }, n.guid)) }),
+    /* @__PURE__ */ t(y, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${r.total}: ${A(e.totalAmount, "0,0")}` })
   ] });
-}, Ht = v(Ft), Pt = ({
-  data: n,
+}, Ot = x(Rt), kt = ({
+  data: e,
   onSelected: d,
-  onViewTransactions: s,
+  onViewTransactions: o,
   selectedId: l,
-  title: e
+  title: r
 }) => {
-  const { isDesktop: a, isMobile: i } = pt(), { isLoadingCategoryTotals: o } = P(), { spending: c } = I();
-  return /* @__PURE__ */ h(
-    f,
+  const { isDesktop: a, isMobile: n } = Lt(), { isLoadingCategoryTotals: u } = F(), { spending: s } = v();
+  return /* @__PURE__ */ c(
+    C,
     {
-      alignItems: i ? "center" : "flex-start",
-      direction: i ? "column" : "row",
+      alignItems: n ? "center" : "flex-start",
+      direction: n ? "column" : "row",
       gap: { xs: 16, md: 64, xl: 100 },
       justifyContent: "center",
       pt: 50,
       px: 8,
       children: [
-        o && /* @__PURE__ */ t(
-          O,
+        u && /* @__PURE__ */ t(
+          W,
           {
             data: {
               categoryData: [],
@@ -455,151 +280,151 @@ const z = 5, Gt = (n, d, s) => s.reduce((l, e) => {
             variant: "full"
           }
         ),
-        !o && /* @__PURE__ */ t(
-          O,
+        !u && /* @__PURE__ */ t(
+          W,
           {
-            data: n,
+            data: e,
             onSelected: d,
-            onViewTransactions: s,
+            onViewTransactions: o,
             selectedId: l,
             size: a ? 400 : 300,
-            totalLabel: c.total_amount,
+            totalLabel: s.total_amount,
             variant: "full"
           }
         ),
-        /* @__PURE__ */ t(Ht, { data: n, onSelected: d, selectedId: l, title: e })
+        /* @__PURE__ */ t(Ot, { data: e, onSelected: d, selectedId: l, title: r })
       ]
     }
   );
-}, rt = v(Pt), Kt = (n) => [
-  n.palette.chartMono.chartMono5,
-  n.palette.chartMono.chartMono4,
-  n.palette.chartMono.chartMono3,
-  n.palette.chartMono.chartMono2,
-  n.palette.chartMono.chartMono1,
-  n.palette.chartMono.chartMono6
-], Xt = () => {
-  const n = gt(), { onLoad: d } = Et(), { is_mobile_webview: s } = H(), { clientConfig: l } = H(), { categories: e, dateRangeCategoryTotals: a, loadDateRangeCategoryTotals: i } = P(), {
-    goals: o,
-    spending: c,
-    transactions: u
-  } = I(), { displayedDateRange: r, selectedAccounts: m, selectedAccountGuids: M } = k(), {
-    setFilter: g,
-    sortedTransactions: b,
-    sortedTransactionsWithSplits: E,
-    tags: x
-  } = At(), S = l?.master?.deep_link_params?.account_guids, R = l?.master?.deep_link_params?.view, [$, X] = p.useState(""), [L, ft] = p.useState(R === "income" ? 1 : 0), [Y, U] = p.useState(""), [yt, q] = p.useState(!1);
-  p.useEffect(() => {
-    i(
-      m,
-      r.start,
-      r.end
+}, at = x(kt), $t = (e) => [
+  e.palette.chartMono.chartMono5,
+  e.palette.chartMono.chartMono4,
+  e.palette.chartMono.chartMono3,
+  e.palette.chartMono.chartMono2,
+  e.palette.chartMono.chartMono1,
+  e.palette.chartMono.chartMono6
+], Bt = () => {
+  const e = Mt(), { onLoad: d } = _t(), { is_mobile_webview: o } = V(), { clientConfig: l } = V(), { categories: r, dateRangeCategoryTotals: a, loadDateRangeCategoryTotals: n } = F(), {
+    goals: u,
+    spending: s,
+    transactions: m
+  } = v(), { displayedDateRange: p, selectedAccounts: h, selectedAccountGuids: w } = R(), {
+    setFilter: _,
+    sortedTransactions: f,
+    sortedTransactionsWithSplits: O,
+    tags: S
+  } = Ct(), T = l?.master?.deep_link_params?.account_guids, k = l?.master?.deep_link_params?.view, [$, H] = i.useState(""), [L, pt] = i.useState(k === "income" ? 1 : 0), [K, U] = i.useState(""), [gt, X] = i.useState(!1);
+  i.useEffect(() => {
+    n(
+      h,
+      p.start,
+      p.end
     ).finally(() => {
       d?.("SpendingWidget");
     });
-  }, [m, r]);
-  const G = p.useMemo(
-    () => mt(e, o, n, a),
-    [e, a]
-  ), J = p.useMemo(
-    () => ht(e, a, Kt(n)),
-    [e, a]
-  ), j = p.useMemo(
-    () => b.find((y) => y.guid === Y),
-    [Y, b]
-  ), Ct = (y, A) => {
-    ft(A), X("");
-  }, Q = (y) => {
-    X($ === y || y === "0" ? "" : y);
-  }, Z = (y) => {
-    const A = {
-      accounts: S || M,
-      dateRange: r
+  }, [h, p]);
+  const B = i.useMemo(
+    () => ct(r, u, e, a),
+    [r, a]
+  ), Y = i.useMemo(
+    () => lt(r, a, $t(e)),
+    [r, a]
+  ), G = i.useMemo(
+    () => f.find((g) => g.guid === K),
+    [K, f]
+  ), ut = (g, D) => {
+    pt(D), H("");
+  }, q = (g) => {
+    H($ === g || g === "0" ? "" : g);
+  }, J = (g) => {
+    const D = {
+      accounts: T || w,
+      dateRange: p
     };
     if (L === 0)
-      if (y === "other") {
-        const T = G.categoryData.find((B) => B.guid === "other");
-        g({
-          ...A,
-          custom: (B) => !!T?.categoryTotals?.find((_t) => _t.guid === B.top_level_category_guid)
+      if (g === "other") {
+        const b = B.categoryData.find((j) => j.guid === "other");
+        _({
+          ...D,
+          custom: (j) => !!b?.categoryTotals?.find((ht) => ht.guid === j.top_level_category_guid)
         });
       } else
-        g({
-          ...A,
-          custom: (T) => y ? T.top_level_category_guid === y : T.top_level_category_guid !== _.INCOME && T.top_level_category_guid !== _.INVESTMENTS && T.top_level_category_guid !== _.TRANSFER,
-          showSplits: !!y
+        _({
+          ...D,
+          custom: (b) => g ? b.top_level_category_guid === g : b.top_level_category_guid !== I.INCOME && b.top_level_category_guid !== I.INVESTMENTS && b.top_level_category_guid !== I.TRANSFER,
+          showSplits: !!g
         });
     else
-      g({
-        ...A,
-        custom: (T) => y ? T.category_guid === y : T.category_guid === _.INCOME || T.top_level_category_guid === _.INCOME
+      _({
+        ...D,
+        custom: (b) => g ? b.category_guid === g : b.category_guid === I.INCOME || b.top_level_category_guid === I.INCOME
       });
-    q(!0);
-  }, bt = () => {
-    Ot(E, x);
+    X(!0);
+  }, mt = () => {
+    xt(O, S);
   };
-  return /* @__PURE__ */ h(D, { children: [
-    /* @__PURE__ */ h(lt, { onChange: Ct, value: L, variant: "fullWidth", children: [
+  return /* @__PURE__ */ c(M, { children: [
+    /* @__PURE__ */ c(st, { onChange: ut, value: L, variant: "fullWidth", children: [
       /* @__PURE__ */ t(
-        N,
+        E,
         {
           label: /* @__PURE__ */ t(
-            W,
+            N,
             {
-              amount: G.totalAmount,
-              label: c.spend_tab_title
+              amount: B.totalAmount,
+              label: s.spend_tab_title
             }
           )
         }
       ),
       /* @__PURE__ */ t(
-        N,
+        E,
         {
           label: /* @__PURE__ */ t(
-            W,
+            N,
             {
-              amount: J.totalAmount,
-              label: c.income_tab_title
+              amount: Y.totalAmount,
+              label: s.income_tab_title
             }
           )
         }
       )
     ] }),
     L === 0 && /* @__PURE__ */ t(
-      rt,
+      at,
       {
-        data: G,
-        onSelected: Q,
-        onViewTransactions: Z,
+        data: B,
+        onSelected: q,
+        onViewTransactions: J,
         selectedId: $,
-        title: c.spend_tab_title
+        title: s.spend_tab_title
       }
     ),
     L === 1 && /* @__PURE__ */ t(
-      rt,
+      at,
       {
-        data: J,
-        onSelected: Q,
-        onViewTransactions: Z,
+        data: Y,
+        onSelected: q,
+        onViewTransactions: J,
         selectedId: $,
-        title: c.income_tab_title
+        title: s.income_tab_title
       }
     ),
     /* @__PURE__ */ t(
-      ot,
+      nt,
       {
-        ariaLabelClose: c.close_drawer_aria,
-        isOpen: yt,
-        onClose: () => q(!1),
-        title: c.transactions_drawer_title,
-        children: /* @__PURE__ */ h(f, { children: [
-          !s && b.length > 0 && /* @__PURE__ */ t(f, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ t(
-            dt,
+        ariaLabelClose: s.close_drawer_aria,
+        isOpen: gt,
+        onClose: () => X(!1),
+        title: s.transactions_drawer_title,
+        children: /* @__PURE__ */ c(C, { children: [
+          !o && f.length > 0 && /* @__PURE__ */ t(C, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ t(
+            Tt,
             {
-              onClick: bt,
-              startIcon: /* @__PURE__ */ t(Dt, { name: "ios_share" }),
+              onClick: mt,
+              startIcon: /* @__PURE__ */ t(bt, { name: "ios_share" }),
               variant: "text",
-              children: u.export_csv_btn
+              children: m.export_csv_btn
             }
           ) }),
           /* @__PURE__ */ t(vt, { onClick: U })
@@ -607,40 +432,40 @@ const z = 5, Gt = (n, d, s) => s.reduce((l, e) => {
       }
     ),
     /* @__PURE__ */ t(
-      ot,
+      nt,
       {
-        ariaLabelClose: c.close_drawer_aria,
-        isOpen: !!j,
+        ariaLabelClose: s.close_drawer_aria,
+        isOpen: !!G,
         onClose: () => U(""),
-        title: c.transaction_details_drawer_title,
-        children: j && /* @__PURE__ */ t(It, { transaction: j })
+        title: s.transaction_details_drawer_title,
+        children: G && /* @__PURE__ */ t(wt, { transaction: G })
       }
     )
   ] });
-}, Yt = v(Xt), Ut = ({ onBackClick: n, sx: d = {} }) => {
-  const { visibleAccounts: s } = ut(), { spending: l } = I(), { isCopyLoaded: e, isInitialized: a, setDisplayedDate: i, setSelectedAccounts: o } = k(), { onEvent: c } = Lt(), { clientConfig: u } = H(), r = u?.master?.deep_link_params?.date_range, [m, M] = p.useState(!1);
-  p.useEffect(() => {
-    o(s);
-  }, [s]), p.useEffect(() => {
-    r && Array.isArray(r) && r.length === 2 ? i(r[0], r[1]) : i(st(tt()), ct(tt())), M(!0), c(at.SPENDING_VIEW);
+}, Gt = x(Bt), jt = ({ onBackClick: e, sx: d = {} }) => {
+  const { visibleAccounts: o } = dt(), { spending: l } = v(), { isCopyLoaded: r, isInitialized: a, setDisplayedDate: n, setSelectedAccounts: u } = R(), { onEvent: s } = yt(), { clientConfig: m } = V(), p = m?.master?.deep_link_params?.date_range, [h, w] = i.useState(!1);
+  i.useEffect(() => {
+    u(o);
+  }, [o]), i.useEffect(() => {
+    p && Array.isArray(p) && p.length === 2 ? n(p[0], p[1]) : n(it(Z()), rt(Z())), w(!0), s(ot.SPENDING_VIEW);
   }, []);
-  const g = (b) => {
-    i(b[0], b[1]);
+  const _ = (f) => {
+    n(f[0], f[1]);
   };
-  return !e || !a || !m ? /* @__PURE__ */ t(K, {}) : /* @__PURE__ */ t(
-    $t,
+  return !r || !a || !h ? /* @__PURE__ */ t(P, {}) : /* @__PURE__ */ t(
+    At,
     {
-      accountOptions: s,
-      calendarActions: { onRangeChanged: g },
-      onAccountsFilterClick: () => c(at.SPENDING_CLICK_FILTER),
-      onBackClick: n,
+      accountOptions: o,
+      calendarActions: { onRangeChanged: _ },
+      onAccountsFilterClick: () => s(ot.SPENDING_CLICK_FILTER),
+      onBackClick: e,
       sx: d,
       title: l.title,
-      children: /* @__PURE__ */ t(D, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(Yt, {}) })
+      children: /* @__PURE__ */ t(M, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(Gt, {}) })
     }
   );
-}, Ie = v(Ut);
+}, _e = x(jt);
 export {
-  ve as SpendingMiniWidget,
-  Ie as SpendingWidget
+  be as SpendingMiniWidget,
+  _e as SpendingWidget
 };