@mx-cartographer/experiences 7.2.13-alpha.mm3 → 7.2.14-alpha.sms1

package/dist/spending/index.es.js

@@ -1,82 +1,83 @@
-import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { jsxs as h, jsx as t, Fragment as mt } from "react/jsx-runtime";
 import p from "react";
-import { observer as x } from "mobx-react-lite";
+import { observer as v } from "mobx-react-lite";
 import { startOfMonth as nt } from "date-fns/startOfMonth";
 import { endOfMonth as ot } from "date-fns/endOfMonth";
-import D from "@mui/material/Box";
+import x from "@mui/material/Box";
 import C from "@mui/material/Stack";
 import N from "@mui/material/Tab";
 import at from "@mui/material/Tabs";
-import mt from "@mui/material/styles/useTheme";
+import ht from "@mui/material/styles/useTheme";
 import { b as V } from "../CategoryUtil-BR3H5i6n.mjs";
-import { b } from "../Category-CevNQ03n.mjs";
-import { Text as f, CategoryIcon as ht, CategoryIconVariants as ft } from "@mxenabled/mxui";
-import { f as A } from "../NumberFormatting-Buh7u8Oi.mjs";
-import yt from "@mui/material/Button";
+import { b as S } from "../Category-CevNQ03n.mjs";
+import { Text as y, CategoryIcon as ft, CategoryIconVariants as yt } from "@mxenabled/mxui";
+import { f as w } from "../NumberFormatting-Buh7u8Oi.mjs";
+import { u as bt } from "../useAriaLive-B3_pRUio.mjs";
+import Ct from "@mui/material/Button";
 import { useTheme as it } from "@mui/material";
-import { u as w, b as R, m as z, d as rt, a as st, h as Ct, g as _t } from "../hooks-D6XlXHf4.mjs";
-import { u as ct } from "../useScreenSize-B6JyS_Lj.mjs";
-import { D as bt } from "../Donut-1UMNcG67.mjs";
+import { u as I, b as R, m as z, d as rt, a as st, h as _t, g as St } from "../hooks-D6XlXHf4.mjs";
+import { u as lt } from "../useScreenSize-B6JyS_Lj.mjs";
+import { D as Tt } from "../Donut-oaQFlbit.mjs";
 import { L as F } from "../Loader-DUaFpDGv.mjs";
-import { M as St } from "../MiniWidgetContainer-D0gfmbaF.mjs";
+import { M as Mt } from "../MiniWidgetContainer-D0gfmbaF.mjs";
 import { startOfToday as U } from "date-fns/startOfToday";
-import { T as Tt, a as Mt } from "../TransactionDetails-DW7T0W0z.mjs";
-import Dt from "@mui/material/Collapse";
+import { T as Dt, a as xt } from "../TransactionDetails-CuqEbcYg.mjs";
+import wt from "@mui/material/Collapse";
 import B from "@mui/material/Divider";
 import q from "@mui/material/List";
 import J from "@mui/material/ListItem";
-import xt from "@mui/material/ListItemButton";
+import vt from "@mui/material/ListItemButton";
 import { D as Q } from "../Drawer-kEE73B87.mjs";
-import { A as Z, W as wt } from "../WidgetContainer-C88Ecu2W.mjs";
-const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
-  if (c.total > 0) {
-    const a = n.find((s) => s.guid === c.category_guid);
-    if (!a) return i;
-    const o = a.parent_guid ?? a.guid, e = n.find((s) => s.guid === o);
-    if (!e) return i;
+import { A as Z, W as It } from "../WidgetContainer-C88Ecu2W.mjs";
+const j = 5, Et = (n, c, r) => r.reduce((l, a) => {
+  if (a.total > 0) {
+    const i = n.find((s) => s.guid === a.category_guid);
+    if (!i) return l;
+    const o = i.parent_guid ?? i.guid, e = n.find((s) => s.guid === o);
+    if (!e) return l;
     const d = {
-      guid: a.guid,
-      name: a.guid === o ? `General ${a.name}` : a.name,
-      color: V(e.guid, l),
-      amount: c.total
-    }, u = i.find((s) => s.guid === o);
-    u ? (u.amount += c.total, u.categoryTotals?.push(d)) : i.push({
+      guid: i.guid,
+      name: i.guid === o ? `General ${i.name}` : i.name,
+      color: V(e.guid, c),
+      amount: a.total
+    }, u = l.find((s) => s.guid === o);
+    u ? (u.amount += a.total, u.categoryTotals?.push(d)) : l.push({
       guid: o,
       name: e.name,
-      color: V(e.guid, l),
+      color: V(e.guid, c),
       categoryTotals: [d],
-      amount: c.total
+      amount: a.total
     });
   }
-  return i;
-}, []), lt = (n, l, r, i) => {
-  const c = vt(n, r, i), a = c.filter(
-    (s) => s.guid !== b.INCOME && s.guid !== b.INVESTMENTS && s.guid !== b.TRANSFER
-  ).sort((s, g) => g.amount - s.amount), o = a.reduce(
-    (s, g) => s + g.amount,
+  return l;
+}, []), ct = (n, c, r, l) => {
+  const a = Et(n, r, l), i = a.filter(
+    (s) => s.guid !== S.INCOME && s.guid !== S.INVESTMENTS && s.guid !== S.TRANSFER
+  ).sort((s, m) => m.amount - s.amount), o = i.reduce(
+    (s, m) => s + m.amount,
     0
-  ), e = a.length > j ? j : a.length, d = a.slice(0, e), u = d.map((s) => ({
+  ), e = i.length > j ? j : i.length, d = i.slice(0, e), u = d.map((s) => ({
     id: s.guid,
     color: V(s.guid, r),
     label: s.name,
     value: s.amount / o * 100
   }));
-  if (a.length > 5) {
-    const s = a.slice(j, c.length), g = s.reduce(
-      (S, _) => S + _.amount,
+  if (i.length > 5) {
+    const s = i.slice(j, a.length), m = s.reduce(
+      (T, g) => T + g.amount,
       0
     );
     d.push({
       guid: "other",
       color: r.palette.categories.others || "",
-      name: l.saving_goal_other,
+      name: c.saving_goal_other,
       categoryTotals: s,
-      amount: g
+      amount: m
     }), u.push({
       id: "other",
       color: r.palette.categories.others || "",
-      label: l.saving_goal_other,
-      value: g / o * 100
+      label: c.saving_goal_other,
+      value: m / o * 100
     });
   }
   return {
@@ -84,106 +85,131 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
     donutData: u,
     totalAmount: o
   };
-}, dt = (n, l, r) => {
-  const i = n.filter(
-    (e) => e.guid === b.INCOME || e.parent_guid === b.INCOME
-  ), c = l.filter((e) => i.some((d) => d.guid === e.category_guid)).sort((e, d) => e.total - d.total).map((e, d) => ({
+}, dt = (n, c, r) => {
+  const l = n.filter(
+    (e) => e.guid === S.INCOME || e.parent_guid === S.INCOME
+  ), a = c.filter((e) => l.some((d) => d.guid === e.category_guid)).sort((e, d) => e.total - d.total).map((e, d) => ({
     guid: e.category_guid,
     name: n.find((u) => u.guid === e.category_guid)?.name,
     color: r[d],
     categoryTotals: [],
     amount: Math.abs(e.total)
-  })), a = c.reduce(
+  })), i = a.reduce(
     (e, d) => e + d.amount,
     0
-  ), o = c.map((e) => ({
+  ), o = a.map((e) => ({
     id: e.guid,
     color: e.color,
     label: e.name,
-    value: e.amount / a * 100
+    value: e.amount / i * 100
   }));
   return {
-    categoryData: c,
+    categoryData: a,
     donutData: o,
-    totalAmount: a
+    totalAmount: i
   };
-}, W = ({ amount: n, label: l }) => /* @__PURE__ */ m(C, { direction: "column", children: [
-  /* @__PURE__ */ t(f, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: l }),
-  /* @__PURE__ */ t(f, { variant: "XSmall", children: A(n, "0,0") })
+}, W = ({ amount: n, label: c }) => /* @__PURE__ */ h(C, { direction: "column", children: [
+  /* @__PURE__ */ t(y, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: c }),
+  /* @__PURE__ */ t(y, { variant: "XSmall", children: w(n, "0,0") })
 ] }), At = ({
   data: n,
-  isIncome: l = !1,
+  isIncome: c = !1,
   onSelected: r,
-  onViewTransactions: i,
-  selectedId: c,
-  size: a = 150,
+  onViewTransactions: l,
+  selectedId: a,
+  size: i = 150,
   totalLabel: o,
   variant: e = "mini"
 }) => {
-  const { spending: d } = w(), u = it(), { isTablet: s } = ct(), g = p.useMemo(
-    () => c ? n.categoryData.find((v) => v.guid === c) : void 0,
-    [c]
-  ), S = p.useMemo(() => n.donutData.length > 0 ? n.donutData : [{ id: "0", color: u.palette.divider, value: 100 }], [n, u]), _ = () => {
-    i?.(c);
-  }, y = s ? 32 : 48;
-  return /* @__PURE__ */ t(bt, { data: S, onClick: r, selectedId: c, size: a, children: /* @__PURE__ */ t(C, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ m(C, { alignItems: "center", justifyContent: "center", minHeight: a, minWidth: a, children: [
-    g && /* @__PURE__ */ m(
-      C,
-      {
-        alignItems: "center",
-        gap: e === "mini" ? 0 : 8,
-        mb: e === "mini" ? 0 : 8,
-        mt: e === "mini" ? 0 : -16,
-        sx: e === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
-        children: [
-          /* @__PURE__ */ t(
-            ht,
-            {
-              categoryGuid: l ? b.INCOME : g.guid,
-              size: e === "mini" ? 24 : y,
-              variant: ft.Transparent
-            }
-          ),
-          /* @__PURE__ */ t(f, { color: "secondary", noWrap: !0, variant: e === "mini" ? "Tiny" : "Body", children: g ? g.name : o })
-        ]
-      }
-    ),
-    !g && e === "full" && /* @__PURE__ */ t(f, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: o }),
-    /* @__PURE__ */ t(f, { variant: e === "mini" ? "H2" : "H1", children: g ? A(g.amount, "0,0") : A(n.totalAmount, "0,0") }),
-    !g && e === "mini" && /* @__PURE__ */ t(f, { color: "secondary", noWrap: !0, variant: "Tiny", children: o }),
-    e === "full" && /* @__PURE__ */ t(
-      yt,
-      {
-        "aria-label": `View ${g?.name || ""} Transactions`,
-        disabled: n.categoryData.length === 0,
-        onClick: _,
-        sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
-        variant: "text",
-        children: d.view_transactions
-      }
-    )
-  ] }) }) });
-}, O = x(At), tt = ({ data: n, onSelected: l, selectedId: r }) => /* @__PURE__ */ t(C, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: n.categoryData.map((i) => /* @__PURE__ */ m(
-  C,
-  {
-    alignItems: "center",
-    "aria-label": i.name,
-    "aria-selected": i.guid === r,
-    direction: "row",
-    gap: 8,
-    onClick: () => l(i.guid),
-    role: "button",
-    sx: { cursor: "pointer" },
-    children: [
-      /* @__PURE__ */ t(D, { borderRadius: 4, height: 8, sx: { backgroundColor: i.color }, width: 8 }),
-      /* @__PURE__ */ t(f, { bold: i.guid === r, variant: "XSmall", children: i.name })
-    ]
-  },
-  i.guid
-)) }), Et = () => {
-  const n = mt(), { goals: l, spending: r } = w(), { selectedAccounts: i } = R(), {
-    categories: c,
-    dateRangeCategoryTotals: a,
+  const { spending: d } = I(), u = it(), { isTablet: s } = lt(), { announce: m, ariaLive: T } = bt(), g = p.useMemo(
+    () => a ? n.categoryData.find((D) => D.guid === a) : void 0,
+    [a]
+  );
+  p.useEffect(() => {
+    if (g) {
+      const D = w(g.amount, "0,0");
+      m(`${g.name}: ${D}`);
+    }
+  }, [g, m]);
+  const b = p.useMemo(() => n.donutData.length > 0 ? n.donutData : [{ id: "0", color: u.palette.divider, value: 100 }], [n, u]), E = () => {
+    l?.(a);
+  }, _ = s ? 32 : 48;
+  return /* @__PURE__ */ h(mt, { children: [
+    T,
+    /* @__PURE__ */ t(Tt, { data: b, onClick: r, selectedId: a, size: i, children: /* @__PURE__ */ t(C, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ h(C, { alignItems: "center", justifyContent: "center", minHeight: i, minWidth: i, children: [
+      g && /* @__PURE__ */ h(
+        C,
+        {
+          alignItems: "center",
+          gap: e === "mini" ? 0 : 8,
+          mb: e === "mini" ? 0 : 8,
+          mt: e === "mini" ? 0 : -16,
+          sx: e === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
+          children: [
+            /* @__PURE__ */ t(
+              ft,
+              {
+                categoryGuid: c ? S.INCOME : g.guid,
+                size: e === "mini" ? 24 : _,
+                variant: yt.Transparent
+              }
+            ),
+            /* @__PURE__ */ t(
+              y,
+              {
+                color: "secondary",
+                noWrap: !0,
+                variant: e === "mini" ? "Tiny" : "Body",
+                children: g ? g.name : o
+              }
+            )
+          ]
+        }
+      ),
+      !g && e === "full" && /* @__PURE__ */ t(y, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: o }),
+      /* @__PURE__ */ t(y, { variant: e === "mini" ? "H2" : "H1", children: g ? w(g.amount, "0,0") : w(n.totalAmount, "0,0") }),
+      !g && e === "mini" && /* @__PURE__ */ t(y, { color: "secondary", noWrap: !0, variant: "Tiny", children: o }),
+      e === "full" && /* @__PURE__ */ t(
+        Ct,
+        {
+          "aria-label": `View ${g?.name || ""} Transactions`,
+          disabled: n.categoryData.length === 0,
+          onClick: E,
+          sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
+          variant: "text",
+          children: d.view_transactions
+        }
+      )
+    ] }) }) })
+  ] });
+}, O = v(At), tt = ({ data: n, onSelected: c, selectedId: r }) => {
+  const l = (a, i) => {
+    (a.key === "Enter" || a.key === " ") && (a.preventDefault(), c(i));
+  };
+  return /* @__PURE__ */ t(C, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: n.categoryData.map((a) => /* @__PURE__ */ h(
+    C,
+    {
+      alignItems: "center",
+      "aria-label": a.name,
+      "aria-pressed": a.guid === r,
+      direction: "row",
+      gap: 8,
+      onClick: () => c(a.guid),
+      onKeyDown: (i) => l(i, a.guid),
+      role: "button",
+      sx: { cursor: "pointer" },
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ t(x, { borderRadius: 4, height: 8, sx: { backgroundColor: a.color }, width: 8 }),
+        /* @__PURE__ */ t(y, { bold: a.guid === r, variant: "XSmall", children: a.name })
+      ]
+    },
+    a.guid
+  )) });
+}, Lt = () => {
+  const n = ht(), { goals: c, spending: r } = I(), { selectedAccounts: l } = R(), {
+    categories: a,
+    dateRangeCategoryTotals: i,
     dataRangeTotalsLoaded: o,
     loadDateRangeCategoryTotals: e
   } = z(), d = p.useMemo(
@@ -199,108 +225,134 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
   );
   p.useEffect(() => {
     e(
-      i,
+      l,
       nt(/* @__PURE__ */ new Date()),
       ot(/* @__PURE__ */ new Date())
     ).finally();
-  }, [i]);
-  const [u, s] = p.useState(""), [g, S] = p.useState(0), _ = p.useMemo(
-    () => lt(c, l, n, a),
-    [c, a]
-  ), y = p.useMemo(
-    () => dt(c, a, d),
-    [c, a, d]
-  ), v = (E, L) => {
-    S(L), s("");
-  }, M = (E) => {
-    s(u === E ? "" : E);
+  }, [l]);
+  const [u, s] = p.useState(""), [m, T] = p.useState(0), g = p.useMemo(
+    () => ct(a, c, n, i),
+    [a, i]
+  ), b = p.useMemo(
+    () => dt(a, i, d),
+    [a, i, d]
+  ), E = (D, L) => {
+    T(L), s("");
+  }, _ = (D) => {
+    s(u === D ? "" : D);
   };
-  return o ? /* @__PURE__ */ m(D, { width: "100%", children: [
-    /* @__PURE__ */ m(at, { onChange: v, value: g, variant: "fullWidth", children: [
-      /* @__PURE__ */ t(
-        N,
-        {
-          label: /* @__PURE__ */ t(
-            W,
+  return o ? /* @__PURE__ */ h(x, { width: "100%", children: [
+    /* @__PURE__ */ h(
+      at,
+      {
+        "aria-label": r.mini_title,
+        onChange: E,
+        value: m,
+        variant: "fullWidth",
+        children: [
+          /* @__PURE__ */ t(
+            N,
             {
-              amount: _.totalAmount,
-              label: r.spend_tab_title
+              "aria-controls": "spending-tabpanel",
+              id: "spending-tab",
+              label: /* @__PURE__ */ t(
+                W,
+                {
+                  amount: g.totalAmount,
+                  label: r.spend_tab_title
+                }
+              ),
+              tabIndex: m === 0 ? 0 : -1
             }
-          )
-        }
-      ),
-      /* @__PURE__ */ t(
-        N,
-        {
-          label: /* @__PURE__ */ t(
-            W,
+          ),
+          /* @__PURE__ */ t(
+            N,
             {
-              amount: y.totalAmount,
-              label: r.income_tab_title
+              "aria-controls": "income-tabpanel",
+              id: "income-tab",
+              label: /* @__PURE__ */ t(
+                W,
+                {
+                  amount: b.totalAmount,
+                  label: r.income_tab_title
+                }
+              ),
+              tabIndex: m === 1 ? 0 : -1
             }
           )
-        }
-      )
-    ] }),
-    g === 0 && /* @__PURE__ */ t(D, { children: /* @__PURE__ */ m(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
-      /* @__PURE__ */ t(
-        O,
-        {
-          data: _,
-          onSelected: M,
-          selectedId: u,
-          totalLabel: r.total_spending
-        }
-      ),
-      /* @__PURE__ */ t(
-        tt,
-        {
-          data: _,
-          onSelected: M,
-          selectedId: u
-        }
-      )
-    ] }) }),
-    g === 1 && /* @__PURE__ */ t(D, { children: /* @__PURE__ */ m(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
-      /* @__PURE__ */ t(
-        O,
-        {
-          data: y,
-          isIncome: !0,
-          onSelected: M,
-          selectedId: u,
-          totalLabel: r.total_income
-        }
-      ),
-      /* @__PURE__ */ t(tt, { data: y, onSelected: M, selectedId: u })
-    ] }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ t(
+      x,
+      {
+        "aria-labelledby": "spending-tab",
+        hidden: m !== 0,
+        id: "spending-tabpanel",
+        role: "tabpanel",
+        children: /* @__PURE__ */ h(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+          /* @__PURE__ */ t(
+            O,
+            {
+              data: g,
+              onSelected: _,
+              selectedId: u,
+              totalLabel: r.total_spending
+            }
+          ),
+          /* @__PURE__ */ t(tt, { data: g, onSelected: _, selectedId: u })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ t(
+      x,
+      {
+        "aria-labelledby": "income-tab",
+        hidden: m !== 1,
+        id: "income-tabpanel",
+        role: "tabpanel",
+        children: /* @__PURE__ */ h(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
+          /* @__PURE__ */ t(
+            O,
+            {
+              data: b,
+              isIncome: !0,
+              onSelected: _,
+              selectedId: u,
+              totalLabel: r.total_income
+            }
+          ),
+          /* @__PURE__ */ t(tt, { data: b, onSelected: _, selectedId: u })
+        ] })
+      }
+    )
   ] }) : /* @__PURE__ */ t(F, { height: 250 });
-}, It = x(Et), Lt = ({ onPrimaryCtaClick: n, sx: l = {} }) => {
-  const { visibleAccounts: r } = rt(), { spending: i } = w(), { isCopyLoaded: c, isInitialized: a, setSelectedAccounts: o } = R();
+}, Nt = v(Lt), Wt = ({ onPrimaryCtaClick: n, sx: c = {} }) => {
+  const { visibleAccounts: r } = rt(), { spending: l } = I(), { isCopyLoaded: a, isInitialized: i, setSelectedAccounts: o } = R();
   return p.useEffect(() => {
     o(r);
-  }, [r]), !c || !a ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
-    St,
+  }, [r]), !a || !i ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
+    Mt,
     {
       className: "mx-exp-spending-miniwidget",
       onPrimaryCtaClick: n,
-      primaryCtaLabel: i.primary_cta,
-      sx: l,
-      title: i.mini_title,
-      children: /* @__PURE__ */ t(It, {})
+      primaryCtaLabel: l.primary_cta,
+      sx: c,
+      title: l.mini_title,
+      children: /* @__PURE__ */ t(Nt, {})
     }
   );
-}, he = x(Lt), Nt = ({
+}, be = v(Wt), Ot = ({
   data: n,
-  onSelected: l,
+  onSelected: c,
   selectedId: r = "",
-  title: i
+  title: l
 }) => {
-  const { spending: c } = w(), a = n.categoryData.find((o) => o.guid === r);
-  return /* @__PURE__ */ m(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
-    /* @__PURE__ */ t(f, { bold: !0, sx: { py: 12 }, children: `${i} ${c.by_category}` }),
+  const { spending: a } = I(), i = n.categoryData.find((o) => o.guid === r);
+  return /* @__PURE__ */ h(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
+    /* @__PURE__ */ t(y, { bold: !0, sx: { py: 12 }, children: `${l} ${a.by_category}` }),
     /* @__PURE__ */ t(B, { "aria-hidden": "true" }),
-    /* @__PURE__ */ t(q, { children: n.categoryData.map((o) => /* @__PURE__ */ m(p.Fragment, { children: [
+    /* @__PURE__ */ t(q, { children: n.categoryData.map((o) => /* @__PURE__ */ h(p.Fragment, { children: [
       /* @__PURE__ */ t(
         J,
         {
@@ -309,15 +361,15 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
           sx: {
             minHeight: 44
           },
-          children: /* @__PURE__ */ m(
-            xt,
+          children: /* @__PURE__ */ h(
+            vt,
             {
-              "aria-expanded": a?.guid === o.guid,
-              onClick: () => l(o.guid),
+              "aria-expanded": i?.guid === o.guid,
+              onClick: () => c(o.guid),
               sx: { minHeight: 44, px: 8, py: 0 },
               children: [
                 /* @__PURE__ */ t(
-                  D,
+                  x,
                   {
                     borderRadius: 4,
                     flexShrink: 0,
@@ -326,7 +378,7 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
                     width: 8
                   }
                 ),
-                /* @__PURE__ */ m(
+                /* @__PURE__ */ h(
                   C,
                   {
                     alignItems: "center",
@@ -334,8 +386,8 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
                     justifyContent: "space-between",
                     width: "100%",
                     children: [
-                      /* @__PURE__ */ t(f, { bold: r === o.guid, children: o.name }),
-                      /* @__PURE__ */ t(f, { bold: r === o.guid, variant: "Body", children: A(o.amount, "0,0") })
+                      /* @__PURE__ */ t(y, { bold: r === o.guid, children: o.name }),
+                      /* @__PURE__ */ t(y, { bold: r === o.guid, variant: "Body", children: w(o.amount, "0,0") })
                     ]
                   }
                 )
@@ -345,8 +397,8 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
         }
       ),
       /* @__PURE__ */ t(B, {}),
-      o.categoryTotals && o.categoryTotals.length > 0 && /* @__PURE__ */ t(Dt, { in: a?.guid === o.guid, unmountOnExit: !0, children: /* @__PURE__ */ m(q, { children: [
-        a?.categoryTotals?.map((e) => /* @__PURE__ */ t(
+      o.categoryTotals && o.categoryTotals.length > 0 && /* @__PURE__ */ t(wt, { in: i?.guid === o.guid, unmountOnExit: !0, children: /* @__PURE__ */ h(q, { children: [
+        i?.categoryTotals?.map((e) => /* @__PURE__ */ t(
           J,
           {
             sx: {
@@ -354,12 +406,12 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
               pr: 8,
               py: 0
             },
-            children: /* @__PURE__ */ m(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
-              /* @__PURE__ */ m(f, { children: [
+            children: /* @__PURE__ */ h(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
+              /* @__PURE__ */ h(y, { children: [
                 e.name,
                 " "
               ] }),
-              /* @__PURE__ */ t(f, { children: A(e.amount, "0,0") })
+              /* @__PURE__ */ t(y, { children: w(e.amount, "0,0") })
             ] })
           },
           e.guid
@@ -367,17 +419,17 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
         /* @__PURE__ */ t(B, {})
       ] }) })
     ] }, o.guid)) }),
-    /* @__PURE__ */ t(f, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${c.total}: ${A(n.totalAmount, "0,0")}` })
+    /* @__PURE__ */ t(y, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${a.total}: ${w(n.totalAmount, "0,0")}` })
   ] });
-}, Wt = x(Nt), Ot = ({
+}, Rt = v(Ot), kt = ({
   data: n,
-  onSelected: l,
+  onSelected: c,
   onViewTransactions: r,
-  selectedId: i,
-  title: c
+  selectedId: l,
+  title: a
 }) => {
-  const { isDesktop: a, isMobile: o } = ct(), { isLoadingCategoryTotals: e } = z(), { spending: d } = w();
-  return /* @__PURE__ */ m(
+  const { isDesktop: i, isMobile: o } = lt(), { isLoadingCategoryTotals: e } = z(), { spending: d } = I();
+  return /* @__PURE__ */ h(
     C,
     {
       alignItems: o ? "center" : "flex-start",
@@ -398,7 +450,7 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
             onSelected: () => {
             },
             selectedId: "",
-            size: a ? 400 : 300,
+            size: i ? 400 : 300,
             totalLabel: "Loading ...",
             variant: "full"
           }
@@ -407,19 +459,19 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
           O,
           {
             data: n,
-            onSelected: l,
+            onSelected: c,
             onViewTransactions: r,
-            selectedId: i,
-            size: a ? 400 : 300,
+            selectedId: l,
+            size: i ? 400 : 300,
             totalLabel: d.total_amount,
             variant: "full"
           }
         ),
-        /* @__PURE__ */ t(Wt, { data: n, onSelected: l, selectedId: i, title: c })
+        /* @__PURE__ */ t(Rt, { data: n, onSelected: c, selectedId: l, title: a })
       ]
     }
   );
-}, et = x(Ot), Rt = (n) => [
+}, et = v(kt), $t = (n) => [
   n.palette.chartMono.chartMono5,
   n.palette.chartMono.chartMono4,
   n.palette.chartMono.chartMono3,
@@ -427,61 +479,61 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
   n.palette.chartMono.chartMono1,
   n.palette.chartMono.chartMono6
 ], Gt = () => {
-  const n = it(), { clientConfig: l } = st(), { categories: r, dateRangeCategoryTotals: i, loadDateRangeCategoryTotals: c } = z(), { goals: a, spending: o } = w(), { displayedDateRange: e, selectedAccounts: d, selectedAccountGuids: u } = R(), { setFilter: s, sortedTransactions: g } = Ct(), S = l?.master?.deep_link_params?.account_guids, _ = l?.master?.deep_link_params?.view, [y, v] = p.useState(""), [M, E] = p.useState(_ === "income" ? 1 : 0), [L, H] = p.useState(""), [gt, P] = p.useState(!1);
+  const n = it(), { clientConfig: c } = st(), { categories: r, dateRangeCategoryTotals: l, loadDateRangeCategoryTotals: a } = z(), { goals: i, spending: o } = I(), { displayedDateRange: e, selectedAccounts: d, selectedAccountGuids: u } = R(), { setFilter: s, sortedTransactions: m } = _t(), T = c?.master?.deep_link_params?.account_guids, g = c?.master?.deep_link_params?.view, [b, E] = p.useState(""), [_, D] = p.useState(g === "income" ? 1 : 0), [L, H] = p.useState(""), [gt, P] = p.useState(!1);
   p.useEffect(() => {
-    c(
+    a(
       d,
       e.start,
       e.end
     ).finally();
   }, [d, e]);
-  const G = p.useMemo(
-    () => lt(r, a, n, i),
-    [r, i]
-  ), X = p.useMemo(
-    () => dt(r, i, Rt(n)),
-    [r, i]
-  ), k = p.useMemo(
-    () => g.find((h) => h.guid === L),
-    [L, g]
-  ), ut = (h, I) => {
-    E(I), v("");
-  }, Y = (h) => {
-    v(y === h || h === "0" ? "" : h);
-  }, K = (h) => {
-    const I = {
-      accounts: S || u,
+  const k = p.useMemo(
+    () => ct(r, i, n, l),
+    [r, l]
+  ), K = p.useMemo(
+    () => dt(r, l, $t(n)),
+    [r, l]
+  ), $ = p.useMemo(
+    () => m.find((f) => f.guid === L),
+    [L, m]
+  ), ut = (f, A) => {
+    D(A), E("");
+  }, X = (f) => {
+    E(b === f || f === "0" ? "" : f);
+  }, Y = (f) => {
+    const A = {
+      accounts: T || u,
       dateRange: e
     };
-    if (M === 0)
-      if (h === "other") {
-        const T = G.categoryData.find(($) => $.guid === "other");
+    if (_ === 0)
+      if (f === "other") {
+        const M = k.categoryData.find((G) => G.guid === "other");
         s({
-          ...I,
-          custom: ($) => !!T?.categoryTotals?.find((pt) => pt.guid === $.top_level_category_guid)
+          ...A,
+          custom: (G) => !!M?.categoryTotals?.find((pt) => pt.guid === G.top_level_category_guid)
         });
       } else
         s({
-          ...I,
-          custom: (T) => h ? T.top_level_category_guid === h : T.top_level_category_guid !== b.INCOME && T.top_level_category_guid !== b.INVESTMENTS && T.top_level_category_guid !== b.TRANSFER,
-          showSplits: !!h
+          ...A,
+          custom: (M) => f ? M.top_level_category_guid === f : M.top_level_category_guid !== S.INCOME && M.top_level_category_guid !== S.INVESTMENTS && M.top_level_category_guid !== S.TRANSFER,
+          showSplits: !!f
         });
     else
       s({
-        ...I,
-        custom: (T) => h ? T.category_guid === h : T.category_guid === b.INCOME || T.top_level_category_guid === b.INCOME
+        ...A,
+        custom: (M) => f ? M.category_guid === f : M.category_guid === S.INCOME || M.top_level_category_guid === S.INCOME
       });
     P(!0);
   };
-  return /* @__PURE__ */ m(D, { children: [
-    /* @__PURE__ */ m(at, { onChange: ut, value: M, variant: "fullWidth", children: [
+  return /* @__PURE__ */ h(x, { children: [
+    /* @__PURE__ */ h(at, { onChange: ut, value: _, variant: "fullWidth", children: [
       /* @__PURE__ */ t(
         N,
         {
           label: /* @__PURE__ */ t(
             W,
             {
-              amount: G.totalAmount,
+              amount: k.totalAmount,
               label: o.spend_tab_title
             }
           )
@@ -493,30 +545,30 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
           label: /* @__PURE__ */ t(
             W,
             {
-              amount: X.totalAmount,
+              amount: K.totalAmount,
               label: o.income_tab_title
             }
           )
         }
       )
     ] }),
-    M === 0 && /* @__PURE__ */ t(
+    _ === 0 && /* @__PURE__ */ t(
       et,
       {
-        data: G,
-        onSelected: Y,
-        onViewTransactions: K,
-        selectedId: y,
+        data: k,
+        onSelected: X,
+        onViewTransactions: Y,
+        selectedId: b,
         title: o.spend_tab_title
       }
     ),
-    M === 1 && /* @__PURE__ */ t(
+    _ === 1 && /* @__PURE__ */ t(
       et,
       {
-        data: X,
-        onSelected: Y,
-        onViewTransactions: K,
-        selectedId: y,
+        data: K,
+        onSelected: X,
+        onViewTransactions: Y,
+        selectedId: b,
         title: o.income_tab_title
       }
     ),
@@ -527,44 +579,44 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
         isOpen: gt,
         onClose: () => P(!1),
         title: o.transactions_drawer_title,
-        children: /* @__PURE__ */ t(Tt, { onClick: H })
+        children: /* @__PURE__ */ t(Dt, { onClick: H })
       }
     ),
     /* @__PURE__ */ t(
       Q,
       {
         ariaLabelClose: o.close_drawer_aria,
-        isOpen: !!k,
+        isOpen: !!$,
         onClose: () => H(""),
         title: o.transaction_details_drawer_title,
-        children: k && /* @__PURE__ */ t(Mt, { transaction: k })
+        children: $ && /* @__PURE__ */ t(xt, { transaction: $ })
       }
     )
   ] });
-}, kt = x(Gt), $t = ({ onBackClick: n, sx: l = {} }) => {
-  const { visibleAccounts: r } = rt(), { spending: i } = w(), { isCopyLoaded: c, isInitialized: a, setDisplayedDate: o, setSelectedAccounts: e } = R(), { onEvent: d } = _t(), { clientConfig: u } = st(), s = u?.master?.deep_link_params?.date_range, [g, S] = p.useState(!1);
+}, Bt = v(Gt), jt = ({ onBackClick: n, sx: c = {} }) => {
+  const { visibleAccounts: r } = rt(), { spending: l } = I(), { isCopyLoaded: a, isInitialized: i, setDisplayedDate: o, setSelectedAccounts: e } = R(), { onEvent: d } = St(), { clientConfig: u } = st(), s = u?.master?.deep_link_params?.date_range, [m, T] = p.useState(!1);
   p.useEffect(() => {
     e(r);
   }, [r]), p.useEffect(() => {
-    s && Array.isArray(s) && s.length === 2 ? o(s[0], s[1]) : o(nt(U()), ot(U())), S(!0), d(Z.SPENDING_VIEW);
+    s && Array.isArray(s) && s.length === 2 ? o(s[0], s[1]) : o(nt(U()), ot(U())), T(!0), d(Z.SPENDING_VIEW);
   }, []);
-  const _ = (y) => {
-    o(y[0], y[1]);
+  const g = (b) => {
+    o(b[0], b[1]);
   };
-  return !c || !a || !g ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
-    wt,
+  return !a || !i || !m ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
+    It,
     {
       accountOptions: r,
-      calendarActions: { onRangeChanged: _ },
+      calendarActions: { onRangeChanged: g },
       onAccountsFilterClick: () => d(Z.SPENDING_CLICK_FILTER),
       onBackClick: n,
-      sx: l,
-      title: i.title,
-      children: /* @__PURE__ */ t(D, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(kt, {}) })
+      sx: c,
+      title: l.title,
+      children: /* @__PURE__ */ t(x, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(Bt, {}) })
     }
   );
-}, fe = x($t);
+}, Ce = v(jt);
 export {
-  he as SpendingMiniWidget,
-  fe as SpendingWidget
+  be as SpendingMiniWidget,
+  Ce as SpendingWidget
 };