@mx-cartographer/experiences 8.0.0-alpha.bb4 → 8.0.0-alpha.mega1

package/dist/spending/index.es.js

@@ -1,213 +1,224 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import i from "react";
-import { observer as w } from "mobx-react-lite";
-import { startOfMonth as nt } from "date-fns/startOfMonth";
-import { endOfMonth as ot } from "date-fns/endOfMonth";
-import v from "@mui/material/Box";
-import b from "@mui/material/Stack";
-import k from "@mui/material/Tab";
-import at from "@mui/material/Tabs";
-import { useTheme as mt } from "@mui/material/styles";
-import { g as it, a as rt, S as G, b as q } from "../SpendingLegend-6FqtMcBV.mjs";
-import { Text as C, Icon as ht } from "@mxenabled/mxui";
-import { f as R } from "../NumberFormatting-DjTD0t3W.mjs";
-import { u as L, m as W, d as st, b as P, a as F, h as ct, g as ft, n as bt } from "../hooks-C41HAxM5.mjs";
-import { L as lt } from "../Loader-Ckqi9Rx6.mjs";
-import { M as _t } from "../MiniWidgetContainer-CKzf_Ira.mjs";
-import { startOfToday as J } from "date-fns/startOfToday";
-import yt from "@mui/material/Button";
-import { useTheme as Ct } from "@mui/material";
-import { e as St } from "../exportTransactionsToCSV-BgV_wTLT.mjs";
-import { T as Tt, a as Mt } from "../TransactionDetails-Bn0qY5Hw.mjs";
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import a 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 bt from "@mui/material/styles/useTheme";
+import { g as ct, a as lt, S as W, b as Q } from "../SpendingLegend-CDO060GT.mjs";
+import { Text as y, Icon as _t } from "@mxenabled/mxui";
+import { f as A } from "../NumberFormatting-DjTD0t3W.mjs";
+import { u as w, b as R, m as F, d as dt, a as V, h as Ct, g as yt } from "../hooks-ZMp65DFz.mjs";
+import { u as gt } from "../useWidgetLoadTimer-hIOioiKx.mjs";
+import { L as P } from "../Loader-DUaFpDGv.mjs";
+import { M as St } from "../MiniWidgetContainer-Bg02sF1Y.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-DuAaI5XA.mjs";
+import { T as wt, a as vt } from "../TransactionDetails-m5PddMQn.mjs";
 import Dt from "@mui/material/Collapse";
 import z from "@mui/material/Divider";
-import Q from "@mui/material/List";
-import X from "@mui/material/ListItem";
-import xt from "@mui/material/ListItemButton";
-import { u as vt } from "../useScreenSize-B5afALev.mjs";
-import { D as Z } from "../Drawer-BF40nbsH.mjs";
-import { b as x } from "../Category-Ccoew_sA.mjs";
-import { A as tt, W as wt } from "../WidgetContainer-CDh9fjpR.mjs";
-const j = ({ amount: n, label: d }) => /* @__PURE__ */ s(b, { direction: "column", children: [
-  /* @__PURE__ */ t(C, { bold: !0, sx: { textTransform: "none" }, variant: "body1", children: d }),
-  /* @__PURE__ */ t(C, { variant: "caption", children: R(n, "0,0") })
-] }), Lt = () => {
-  const n = mt(), { goals: d, spending: o } = L(), { categories: r, dateRangeCategoryTotals: a } = W(), c = i.useMemo(
+import tt from "@mui/material/List";
+import et from "@mui/material/ListItem";
+import Lt from "@mui/material/ListItemButton";
+import { u as It } from "../useScreenSize-B6JyS_Lj.mjs";
+import { D as nt } from "../Drawer-By9V-B5L.mjs";
+import { b as L } from "../Category-CevNQ03n.mjs";
+import { A as ot, W as At } from "../WidgetContainer-CoFDmQRE.mjs";
+const N = ({ amount: e, label: d }) => /* @__PURE__ */ l(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 = bt(), { goals: d, spending: o } = w(), { selectedAccounts: r } = R(), {
+    categories: i,
+    dateRangeCategoryTotals: s,
+    dataRangeTotalsLoaded: n,
+    loadDateRangeCategoryTotals: u
+  } = F();
+  gt({
+    widgetName: "SpendingMiniWidget",
+    isLoaded: n
+  });
+  const c = a.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, l] = i.useState(""), [g, _] = i.useState(0), m = i.useMemo(
-    () => it(r, d, n, a),
-    [r, a]
-  ), p = i.useMemo(
-    () => rt(r, a, c),
-    [r, a, c]
-  ), A = (y, T) => {
-    _(T), l("");
-  }, f = (y) => {
-    l(e === y ? "" : y);
+    [e]
+  );
+  a.useEffect(() => {
+    u(
+      r,
+      it(/* @__PURE__ */ new Date()),
+      rt(/* @__PURE__ */ new Date())
+    ).finally();
+  }, [r]);
+  const [m, g] = a.useState(""), [h, v] = a.useState(0), _ = a.useMemo(
+    () => ct(i, d, e, s),
+    [i, s]
+  ), f = a.useMemo(
+    () => lt(i, s, c),
+    [i, s, c]
+  ), O = (T, k) => {
+    v(k), g("");
+  }, S = (T) => {
+    g(m === T ? "" : T);
   };
-  return /* @__PURE__ */ s(v, { width: "100%", children: [
-    /* @__PURE__ */ s(
-      at,
+  return n ? /* @__PURE__ */ l(M, { width: "100%", children: [
+    /* @__PURE__ */ l(
+      st,
       {
         "aria-label": o.mini_title,
-        onChange: A,
-        value: g,
+        onChange: O,
+        value: h,
         variant: "fullWidth",
         children: [
           /* @__PURE__ */ t(
-            k,
+            E,
             {
               "aria-controls": "spending-tabpanel",
               id: "spending-tab",
               label: /* @__PURE__ */ t(
-                j,
+                N,
                 {
-                  amount: m.totalAmount,
+                  amount: _.totalAmount,
                   label: o.spend_tab_title
                 }
               ),
-              tabIndex: g === 0 ? 0 : -1
+              tabIndex: h === 0 ? 0 : -1
             }
           ),
           /* @__PURE__ */ t(
-            k,
+            E,
             {
               "aria-controls": "income-tabpanel",
               id: "income-tab",
               label: /* @__PURE__ */ t(
-                j,
+                N,
                 {
-                  amount: p.totalAmount,
+                  amount: f.totalAmount,
                   label: o.income_tab_title
                 }
               ),
-              tabIndex: g === 1 ? 0 : -1
+              tabIndex: h === 1 ? 0 : -1
             }
           )
         ]
       }
     ),
     /* @__PURE__ */ t(
-      v,
+      M,
       {
         "aria-labelledby": "spending-tab",
-        hidden: g !== 0,
+        hidden: h !== 0,
         id: "spending-tabpanel",
         role: "tabpanel",
-        children: /* @__PURE__ */ s(b, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+        children: /* @__PURE__ */ l(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
           /* @__PURE__ */ t(
-            G,
+            W,
             {
-              data: m,
-              onSelected: f,
-              selectedId: e,
+              data: _,
+              onSelected: S,
+              selectedId: m,
               totalLabel: o.total_spending
             }
           ),
-          /* @__PURE__ */ t(q, { data: m, onSelected: f, selectedId: e })
+          /* @__PURE__ */ t(Q, { data: _, onSelected: S, selectedId: m })
         ] })
       }
     ),
     /* @__PURE__ */ t(
-      v,
+      M,
       {
         "aria-labelledby": "income-tab",
-        hidden: g !== 1,
+        hidden: h !== 1,
         id: "income-tabpanel",
         role: "tabpanel",
-        children: /* @__PURE__ */ s(b, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+        children: /* @__PURE__ */ l(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
           /* @__PURE__ */ t(
-            G,
+            W,
             {
-              data: p,
+              data: f,
               isIncome: !0,
-              onSelected: f,
-              selectedId: e,
+              onSelected: S,
+              selectedId: m,
               totalLabel: o.total_income
             }
           ),
-          /* @__PURE__ */ t(q, { data: p, onSelected: f, selectedId: e })
+          /* @__PURE__ */ t(Q, { data: f, onSelected: S, selectedId: m })
         ] })
       }
     )
-  ] });
-}, At = w(Lt), It = ({ onPrimaryCtaClick: n, sx: d = {} }) => {
-  const { isAccountDataLoaded: o, loadAccountData: r, visibleAccounts: a } = st(), { categoriesLoaded: c, loadCategories: e, loadDateRangeCategoryTotals: l } = W(), { spending: g } = L(), { isInitialized: _, selectedAccounts: m, setSelectedAccounts: p } = P();
-  return i.useEffect(() => {
-    o || r().finally(), c || e().finally();
-  }, []), i.useEffect(() => {
-    p(a);
-  }, [a]), i.useEffect(() => {
-    l(
-      m,
-      nt(/* @__PURE__ */ new Date()),
-      ot(/* @__PURE__ */ new Date())
-    ).finally();
-  }, [m]), _ ? /* @__PURE__ */ t(
-    _t,
+  ] }) : /* @__PURE__ */ t(P, { height: 250 });
+}, Wt = x(Et), Nt = ({ onPrimaryCtaClick: e, sx: d = {} }) => {
+  const { visibleAccounts: o } = dt(), { spending: r } = w(), { isCopyLoaded: i, isInitialized: s, setSelectedAccounts: n } = R();
+  return a.useEffect(() => {
+    n(o);
+  }, [o]), !i || !s ? /* @__PURE__ */ t(P, {}) : /* @__PURE__ */ t(
+    St,
     {
       className: "mx-exp-spending-miniwidget",
-      onPrimaryCtaClick: n,
-      primaryCtaLabel: g.primary_cta,
+      onPrimaryCtaClick: e,
+      primaryCtaLabel: r.primary_cta,
       sx: { height: "100%", ...d },
-      title: g.mini_title,
-      children: /* @__PURE__ */ t(At, {})
+      title: r.mini_title,
+      children: /* @__PURE__ */ t(Wt, {})
     }
-  ) : /* @__PURE__ */ t(lt, {});
-}, me = w(It), Et = ({
-  data: n,
+  );
+}, _e = x(Nt), Rt = ({
+  data: e,
   onSelected: d,
   selectedId: o = "",
   title: r
 }) => {
-  const { spending: a } = L(), c = n.categoryData.find((e) => e.guid === o);
-  return /* @__PURE__ */ s(b, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
-    /* @__PURE__ */ t(C, { bold: !0, sx: { py: 12 }, children: `${r} ${a.by_category}` }),
+  const { spending: i } = w(), s = e.categoryData.find((n) => n.guid === o);
+  return /* @__PURE__ */ l(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
+    /* @__PURE__ */ t(y, { bold: !0, sx: { py: 12 }, children: `${r} ${i.by_category}` }),
     /* @__PURE__ */ t(z, { "aria-hidden": "true" }),
-    /* @__PURE__ */ t(Q, { children: n.categoryData.map((e) => /* @__PURE__ */ s(i.Fragment, { children: [
+    /* @__PURE__ */ t(tt, { children: e.categoryData.map((n) => /* @__PURE__ */ l(a.Fragment, { children: [
       /* @__PURE__ */ t(
-        X,
+        et,
         {
           disableGutters: !0,
           disablePadding: !0,
           sx: {
             minHeight: 44
           },
-          children: /* @__PURE__ */ s(
-            xt,
+          children: /* @__PURE__ */ l(
+            Lt,
             {
-              "aria-expanded": c?.guid === e.guid,
-              onClick: () => d(e.guid),
+              "aria-expanded": s?.guid === n.guid,
+              onClick: () => d(n.guid),
               sx: { minHeight: 44, px: 8, py: 0 },
               children: [
                 /* @__PURE__ */ t(
-                  v,
+                  M,
                   {
                     borderRadius: 4,
                     flexShrink: 0,
                     height: 8,
-                    sx: { backgroundColor: e.color, mr: 8 },
+                    sx: { backgroundColor: n.color, mr: 8 },
                     width: 8
                   }
                 ),
-                /* @__PURE__ */ s(
-                  b,
+                /* @__PURE__ */ l(
+                  C,
                   {
                     alignItems: "center",
                     direction: "row",
                     justifyContent: "space-between",
                     width: "100%",
                     children: [
-                      /* @__PURE__ */ t(C, { bold: o === e.guid, children: e.name }),
-                      /* @__PURE__ */ t(C, { bold: o === e.guid, variant: "body1", children: R(e.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") })
                     ]
                   }
                 )
@@ -217,50 +228,50 @@ const j = ({ amount: n, label: d }) => /* @__PURE__ */ s(b, { direction: "column
         }
       ),
       /* @__PURE__ */ t(z, {}),
-      e.categoryTotals && e.categoryTotals.length > 0 && /* @__PURE__ */ t(Dt, { in: c?.guid === e.guid, unmountOnExit: !0, children: /* @__PURE__ */ s(Q, { children: [
-        c?.categoryTotals?.map((l) => /* @__PURE__ */ t(
-          X,
+      n.categoryTotals && n.categoryTotals.length > 0 && /* @__PURE__ */ t(Dt, { in: s?.guid === n.guid, unmountOnExit: !0, children: /* @__PURE__ */ l(tt, { children: [
+        s?.categoryTotals?.map((u) => /* @__PURE__ */ t(
+          et,
           {
             sx: {
               pl: 24,
               pr: 8,
               py: 0
             },
-            children: /* @__PURE__ */ s(b, { direction: "row", justifyContent: "space-between", width: "100%", children: [
-              /* @__PURE__ */ s(C, { children: [
-                l.name,
+            children: /* @__PURE__ */ l(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
+              /* @__PURE__ */ l(y, { children: [
+                u.name,
                 " "
               ] }),
-              /* @__PURE__ */ t(C, { children: R(l.amount, "0,0") })
+              /* @__PURE__ */ t(y, { children: A(u.amount, "0,0") })
             ] })
           },
-          l.guid
+          u.guid
         )),
         /* @__PURE__ */ t(z, {})
       ] }) })
-    ] }, e.guid)) }),
-    /* @__PURE__ */ t(C, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${a.total}: ${R(n.totalAmount, "0,0")}` })
+    ] }, n.guid)) }),
+    /* @__PURE__ */ t(y, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${i.total}: ${A(e.totalAmount, "0,0")}` })
   ] });
-}, Wt = w(Et), Nt = ({
-  data: n,
+}, Ot = x(Rt), kt = ({
+  data: e,
   onSelected: d,
   onViewTransactions: o,
   selectedId: r,
-  title: a
+  title: i
 }) => {
-  const { isDesktop: c, isMobile: e } = vt(), { isLoadingCategoryTotals: l } = W(), { spending: g } = L();
-  return /* @__PURE__ */ s(
-    b,
+  const { isDesktop: s, isMobile: n } = It(), { isLoadingCategoryTotals: u } = F(), { spending: c } = w();
+  return /* @__PURE__ */ l(
+    C,
     {
-      alignItems: e ? "center" : "flex-start",
-      direction: e ? "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: [
-        l && /* @__PURE__ */ t(
-          G,
+        u && /* @__PURE__ */ t(
+          W,
           {
             data: {
               categoryData: [],
@@ -270,201 +281,203 @@ const j = ({ amount: n, label: d }) => /* @__PURE__ */ s(b, { direction: "column
             onSelected: () => {
             },
             selectedId: "",
-            size: c ? 400 : 300,
+            size: s ? 400 : 300,
             totalLabel: "Loading ...",
             variant: "full"
           }
         ),
-        !l && /* @__PURE__ */ t(
-          G,
+        !u && /* @__PURE__ */ t(
+          W,
           {
-            data: n,
+            data: e,
             onSelected: d,
             onViewTransactions: o,
             selectedId: r,
-            size: c ? 400 : 300,
-            totalLabel: g.total_amount,
+            size: s ? 400 : 300,
+            totalLabel: c.total_amount,
             variant: "full"
           }
         ),
-        /* @__PURE__ */ t(Wt, { data: n, onSelected: d, selectedId: r, title: a })
+        /* @__PURE__ */ t(Ot, { data: e, onSelected: d, selectedId: r, title: i })
       ]
     }
   );
-}, et = w(Nt), Ot = (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
-], Rt = () => {
-  const n = Ct(), { is_mobile_webview: d } = F(), { clientConfig: o } = F(), { categories: r, dateRangeCategoryTotals: a } = W(), {
-    goals: c,
-    spending: e,
-    transactions: l
-  } = L(), { displayedDateRange: g, selectedAccountGuids: _ } = P(), {
-    setFilter: m,
-    sortedTransactions: p,
-    sortedTransactionsWithSplits: A,
-    tags: f
-  } = ct(), y = o?.master?.deep_link_params?.account_guids, T = o?.master?.deep_link_params?.view, [M, N] = i.useState(""), [D, S] = i.useState(T === "income" ? 1 : 0), [O, I] = i.useState(""), [dt, H] = i.useState(!1), $ = i.useMemo(
-    () => it(r, c, n, a),
-    [r, a]
-  ), K = i.useMemo(
-    () => rt(r, a, Ot(n)),
-    [r, a]
-  ), B = i.useMemo(
-    () => p.find((u) => u.guid === O),
-    [O, p]
-  ), gt = (u, E) => {
-    S(E), N("");
-  }, U = (u) => {
-    N(M === u || u === "0" ? "" : u);
-  }, Y = (u) => {
-    const E = {
-      accounts: y || _,
+}, 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(), { is_mobile_webview: d } = V(), { clientConfig: o } = V(), {
+    categories: r,
+    dateRangeCategoryTotals: i,
+    loadDateRangeCategoryTotals: s,
+    dataRangeTotalsLoaded: n
+  } = F(), {
+    goals: u,
+    spending: c,
+    transactions: m
+  } = w(), { displayedDateRange: g, selectedAccounts: h, selectedAccountGuids: v } = R(), {
+    setFilter: _,
+    sortedTransactions: f,
+    sortedTransactionsWithSplits: O,
+    tags: S
+  } = Ct(), T = o?.master?.deep_link_params?.account_guids, k = o?.master?.deep_link_params?.view, [$, H] = a.useState(""), [I, pt] = a.useState(k === "income" ? 1 : 0), [K, U] = a.useState(""), [ut, X] = a.useState(!1);
+  gt({
+    widgetName: "SpendingWidget",
+    isLoaded: n
+  }), a.useEffect(() => {
+    s(
+      h,
+      g.start,
+      g.end
+    ).finally();
+  }, [h, g]);
+  const B = a.useMemo(
+    () => ct(r, u, e, i),
+    [r, i]
+  ), Y = a.useMemo(
+    () => lt(r, i, $t(e)),
+    [r, i]
+  ), G = a.useMemo(
+    () => f.find((p) => p.guid === K),
+    [K, f]
+  ), mt = (p, D) => {
+    pt(D), H("");
+  }, q = (p) => {
+    H($ === p || p === "0" ? "" : p);
+  }, J = (p) => {
+    const D = {
+      accounts: T || v,
       dateRange: g
     };
-    if (D === 0)
-      if (u === "other") {
-        const h = $.categoryData.find((V) => V.guid === "other");
-        m({
-          ...E,
-          custom: (V) => !!h?.categoryTotals?.find((ut) => ut.guid === V.top_level_category_guid)
+    if (I === 0)
+      if (p === "other") {
+        const b = B.categoryData.find((j) => j.guid === "other");
+        _({
+          ...D,
+          custom: (j) => !!b?.categoryTotals?.find((ft) => ft.guid === j.top_level_category_guid)
         });
       } else
-        m({
-          ...E,
-          custom: (h) => u ? h.top_level_category_guid === u : h.top_level_category_guid !== x.INCOME && h.category_guid !== x.INCOME && h.top_level_category_guid !== x.INVESTMENTS && h.top_level_category_guid !== x.TRANSFER,
-          showSplits: !!u
+        _({
+          ...D,
+          custom: (b) => p ? b.top_level_category_guid === p : b.top_level_category_guid !== L.INCOME && b.top_level_category_guid !== L.INVESTMENTS && b.top_level_category_guid !== L.TRANSFER,
+          showSplits: !!p
         });
     else
-      m({
-        ...E,
-        custom: (h) => u ? h.category_guid === u : h.category_guid === x.INCOME || h.top_level_category_guid === x.INCOME
+      _({
+        ...D,
+        custom: (b) => p ? b.category_guid === p : b.category_guid === L.INCOME || b.top_level_category_guid === L.INCOME
       });
-    H(!0);
-  }, pt = () => {
-    St(A, f);
+    X(!0);
+  }, ht = () => {
+    xt(O, S);
   };
-  return /* @__PURE__ */ s(v, { children: [
-    /* @__PURE__ */ s(at, { onChange: gt, value: D, variant: "fullWidth", children: [
+  return /* @__PURE__ */ l(M, { children: [
+    /* @__PURE__ */ l(st, { onChange: mt, value: I, variant: "fullWidth", children: [
       /* @__PURE__ */ t(
-        k,
+        E,
         {
           label: /* @__PURE__ */ t(
-            j,
+            N,
             {
-              amount: $.totalAmount,
-              label: e.spend_tab_title
+              amount: B.totalAmount,
+              label: c.spend_tab_title
             }
           )
         }
       ),
       /* @__PURE__ */ t(
-        k,
+        E,
         {
           label: /* @__PURE__ */ t(
-            j,
+            N,
             {
-              amount: K.totalAmount,
-              label: e.income_tab_title
+              amount: Y.totalAmount,
+              label: c.income_tab_title
             }
           )
         }
       )
     ] }),
-    D === 0 && /* @__PURE__ */ t(
-      et,
+    I === 0 && /* @__PURE__ */ t(
+      at,
       {
-        data: $,
-        onSelected: U,
-        onViewTransactions: Y,
-        selectedId: M,
-        title: e.spend_tab_title
+        data: B,
+        onSelected: q,
+        onViewTransactions: J,
+        selectedId: $,
+        title: c.spend_tab_title
       }
     ),
-    D === 1 && /* @__PURE__ */ t(
-      et,
+    I === 1 && /* @__PURE__ */ t(
+      at,
       {
-        data: K,
-        onSelected: U,
-        onViewTransactions: Y,
-        selectedId: M,
-        title: e.income_tab_title
+        data: Y,
+        onSelected: q,
+        onViewTransactions: J,
+        selectedId: $,
+        title: c.income_tab_title
       }
     ),
     /* @__PURE__ */ t(
-      Z,
+      nt,
       {
-        ariaLabelClose: e.close_drawer_aria,
-        isOpen: dt,
-        onClose: () => H(!1),
-        title: e.transactions_drawer_title,
-        children: /* @__PURE__ */ s(b, { children: [
-          !d && p.length > 0 && /* @__PURE__ */ t(b, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ t(
-            yt,
+        ariaLabelClose: c.close_drawer_aria,
+        isOpen: ut,
+        onClose: () => X(!1),
+        title: c.transactions_drawer_title,
+        children: /* @__PURE__ */ l(C, { children: [
+          !d && f.length > 0 && /* @__PURE__ */ t(C, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ t(
+            Tt,
             {
-              onClick: pt,
-              startIcon: /* @__PURE__ */ t(ht, { name: "ios_share" }),
+              onClick: ht,
+              startIcon: /* @__PURE__ */ t(_t, { name: "ios_share" }),
               variant: "text",
-              children: l.export_csv_btn
+              children: m.export_csv_btn
             }
           ) }),
-          /* @__PURE__ */ t(Tt, { onClick: I })
+          /* @__PURE__ */ t(wt, { onClick: U })
         ] })
       }
     ),
     /* @__PURE__ */ t(
-      Z,
+      nt,
       {
-        ariaLabelClose: e.close_drawer_aria,
-        isOpen: !!B,
-        onClose: () => I(""),
-        title: e.transaction_details_drawer_title,
-        children: B && /* @__PURE__ */ t(Mt, { transaction: B })
+        ariaLabelClose: c.close_drawer_aria,
+        isOpen: !!G,
+        onClose: () => U(""),
+        title: c.transaction_details_drawer_title,
+        children: G && /* @__PURE__ */ t(vt, { transaction: G })
       }
     )
   ] });
-}, kt = w(Rt), Gt = ({ onBackClick: n, sx: d = {} }) => {
-  const { visibleAccounts: o, isAccountDataLoaded: r, loadAccountData: a } = st(), { categoriesLoaded: c, loadCategories: e, loadDateRangeCategoryTotals: l } = W(), { isTransactionDataLoaded: g, loadTransactionData: _ } = ct(), { spending: m } = L(), {
-    displayedDateRange: p,
-    isInitialized: A,
-    setDisplayedDate: f,
-    setSelectedAccounts: y,
-    selectedAccounts: T
-  } = P(), { onEvent: M } = ft(), { onLoad: N } = bt(), { clientConfig: D } = F(), S = D?.master?.deep_link_params?.date_range;
-  i.useEffect(() => {
-    S && Array.isArray(S) && S.length === 2 ? f(S[0], S[1]) : f(nt(J()), ot(J())), r || a().finally(), c || e().finally(), g || _().finally(), M(tt.SPENDING_VIEW);
-  }, []), i.useEffect(() => {
-    y(o);
-  }, [o]), i.useEffect(() => {
-    l(
-      T,
-      p.start,
-      p.end
-    ).finally(() => {
-      N?.("SpendingWidget");
-    });
-  }, [p, T]);
-  const O = (I) => {
-    f(I[0], I[1]);
+}, Gt = x(Bt), jt = ({ onBackClick: e, sx: d = {} }) => {
+  const { visibleAccounts: o } = dt(), { spending: r } = w(), { isCopyLoaded: i, isInitialized: s, setDisplayedDate: n, setSelectedAccounts: u } = R(), { onEvent: c } = yt(), { clientConfig: m } = V(), g = m?.master?.deep_link_params?.date_range, [h, v] = a.useState(!1);
+  a.useEffect(() => {
+    u(o);
+  }, [o]), a.useEffect(() => {
+    g && Array.isArray(g) && g.length === 2 ? n(g[0], g[1]) : n(it(Z()), rt(Z())), v(!0), c(ot.SPENDING_VIEW);
+  }, []);
+  const _ = (f) => {
+    n(f[0], f[1]);
   };
-  return A ? /* @__PURE__ */ t(
-    wt,
+  return !i || !s || !h ? /* @__PURE__ */ t(P, {}) : /* @__PURE__ */ t(
+    At,
     {
       accountOptions: o,
-      calendarActions: { onRangeChanged: O },
-      onAccountsFilterClick: () => M(tt.SPENDING_CLICK_FILTER),
-      onBackClick: n,
+      calendarActions: { onRangeChanged: _ },
+      onAccountsFilterClick: () => c(ot.SPENDING_CLICK_FILTER),
+      onBackClick: e,
       sx: d,
-      title: m.title,
-      children: /* @__PURE__ */ t(v, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(kt, {}) })
+      title: r.title,
+      children: /* @__PURE__ */ t(M, { width: "100%", children: /* @__PURE__ */ t(Gt, {}) })
     }
-  ) : /* @__PURE__ */ t(lt, {});
-}, he = w(Gt);
+  );
+}, Ce = x(jt);
 export {
-  me as SpendingMiniWidget,
-  he as SpendingWidget
+  _e as SpendingMiniWidget,
+  Ce as SpendingWidget
 };