@mx-cartographer/experiences 7.3.0-alpha.sms1 → 7.3.0

package/dist/budgets/index.es.js

@@ -1,126 +1,126 @@
-import { jsxs as g, jsx as e, Fragment as je } from "react/jsx-runtime";
+import { jsxs as m, jsx as e, Fragment as ze } from "react/jsx-runtime";
 import l from "react";
 import { observer as I } from "mobx-react-lite";
-import { endOfMonth as ge } from "date-fns/endOfMonth";
-import { startOfMonth as J } from "date-fns/startOfMonth";
-import H from "@mui/material/Box";
-import B from "@mui/material/Stack";
-import ee from "@mui/material/styles/useTheme";
-import { Text as y, CategoryIcon as W, Icon as P, H1 as ze, H3 as ve } from "@mxenabled/mxui";
-import K from "@mui/material/List";
-import { u as w, i as D, j as te, m as U, q as ne, g as X, b as oe, h as ae, a as Ue, d as Ae } from "../hooks-D6XlXHf4.mjs";
+import { endOfMonth as pe } from "date-fns/endOfMonth";
+import { startOfMonth as Q } from "date-fns/startOfMonth";
+import W from "@mui/material/Box";
+import S from "@mui/material/Stack";
+import te from "@mui/material/styles/useTheme";
+import { Text as b, CategoryIcon as K, Icon as N, H1 as Ue, H3 as Ae } from "@mxenabled/mxui";
+import X from "@mui/material/List";
+import { u as w, i as D, j as ne, m as z, q as oe, g as V, b as ae, h as re, a as Fe, d as Te, n as He } from "../hooks-Cy8JnjCg.mjs";
 import { f as T } from "../NumberFormatting-Buh7u8Oi.mjs";
-import Te from "@mui/material/Button";
-import re from "@mui/material/Divider";
-import V from "@mui/material/ListItem";
-import se from "@mui/material/ListItemAvatar";
-import Y from "@mui/material/ListItemButton";
-import Z from "@mui/material/ListItemText";
+import we from "@mui/material/Button";
+import se from "@mui/material/Divider";
+import Y from "@mui/material/ListItem";
+import ie from "@mui/material/ListItemAvatar";
+import Z from "@mui/material/ListItemButton";
+import q from "@mui/material/ListItemText";
 import { b as R } from "../Localization-2MODESHW.mjs";
-import { D as $ } from "../Drawer-kEE73B87.mjs";
-import Fe from "@mui/material/ListItemSecondaryAction";
-import { C as He } from "../CurrencyInput-DUsQbkXb.mjs";
-import { a as j } from "../Dialog-CWW597AF.mjs";
-import { C as We } from "../ConnectionsDrawer-ByGQE7D5.mjs";
+import { D as k } from "../Drawer-kEE73B87.mjs";
+import We from "@mui/material/ListItemSecondaryAction";
+import { C as Ke } from "../CurrencyInput-lSC7oPDg.mjs";
+import { a as G } from "../Dialog-CWW597AF.mjs";
+import { C as Xe } from "../ConnectionsDrawer-C6kanU7I.mjs";
 import * as O from "d3";
-import Ke from "@mui/material/Tooltip";
-import { useTheme as Xe } from "@mui/material/styles";
-import { u as ie } from "../useScreenSize-B6JyS_Lj.mjs";
-import { L as z } from "../Loader-DUaFpDGv.mjs";
-import { E as ue } from "../EmptyState-DA_lfRBv.mjs";
-import { A as k, W as Ve } from "../WidgetContainer-BHWANqT4.mjs";
-import { u as Ye } from "../BudgetUtil-B2ZXyw-g.mjs";
-import { M as Ze } from "../MiniWidgetContainer-D0gfmbaF.mjs";
-import { isAfter as qe } from "date-fns/isAfter";
-import { startOfToday as q } from "date-fns/startOfToday";
-import Je from "@mui/material/Alert";
-import Qe from "@mui/material/Snackbar";
-import _e from "@mui/material/Tab";
-import et from "@mui/material/Tabs";
-import { e as tt } from "../exportTransactionsToCSV-7bVS7KXf.mjs";
-import { T as we, a as nt } from "../TransactionDetails-oP1eSuiS.mjs";
-import he from "@mui/material/Card";
-import fe from "@mui/material/CardContent";
-import { S as pe } from "../StatusBar-BK_uYHAB.mjs";
-import { S as De } from "../SingleSegmentDonut-BgbLgwHi.mjs";
-import { u as ot, b as at } from "../CategorySelectorDrawer-DUe4lH5-.mjs";
-import Ie from "@mui/material/CardHeader";
-import { subDays as rt } from "date-fns/subDays";
-import st from "@mui/material/IconButton";
-import { M as it } from "../ManageIncome-1s_q5W4X.mjs";
-const ct = I(() => {
-  const { budgets: t } = w(), { totalBudgeted: o } = D(), { incomeTotal: i } = te(), s = i - o;
-  return /* @__PURE__ */ g(B, { direction: "row", justifyContent: "center", my: 16, spacing: 20, children: [
-    /* @__PURE__ */ g(B, { alignItems: "center", children: [
-      /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: T(i, "0,0") }),
-      /* @__PURE__ */ e(y, { color: "secondary", variant: "Small", children: t.projected_income })
+import Ve from "@mui/material/Tooltip";
+import { useTheme as Ye } from "@mui/material/styles";
+import { u as ce } from "../useScreenSize-B6JyS_Lj.mjs";
+import { L as j } from "../Loader-DUaFpDGv.mjs";
+import { E as me } from "../EmptyState-DA_lfRBv.mjs";
+import { A as L, W as Ze } from "../WidgetContainer-BnTgAfQn.mjs";
+import { u as qe } from "../BudgetUtil-CXvenbdN.mjs";
+import { M as Je } from "../MiniWidgetContainer-BdgBvpga.mjs";
+import { isAfter as Qe } from "date-fns/isAfter";
+import { startOfToday as J } from "date-fns/startOfToday";
+import et from "@mui/material/Alert";
+import tt from "@mui/material/Snackbar";
+import Ce from "@mui/material/Tab";
+import nt from "@mui/material/Tabs";
+import { e as ot } from "../exportTransactionsToCSV-B8qpk5MU.mjs";
+import { T as De, a as at } from "../TransactionDetails-BUoNbsu-.mjs";
+import fe from "@mui/material/Card";
+import be from "@mui/material/CardContent";
+import { S as he } from "../StatusBar-BK_uYHAB.mjs";
+import { S as Ie } from "../SingleSegmentDonut-BgbLgwHi.mjs";
+import { u as rt, b as st } from "../CategorySelectorDrawer-Buy70Y3V.mjs";
+import Ee from "@mui/material/CardHeader";
+import { subDays as it } from "date-fns/subDays";
+import ct from "@mui/material/IconButton";
+import { M as lt } from "../ManageIncome-Cypo9qY4.mjs";
+const dt = I(() => {
+  const { budgets: t } = w(), { totalBudgeted: o } = D(), { incomeTotal: i } = ne(), s = i - o;
+  return /* @__PURE__ */ m(S, { direction: "row", justifyContent: "center", my: 16, spacing: 20, children: [
+    /* @__PURE__ */ m(S, { alignItems: "center", children: [
+      /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: T(i, "0,0") }),
+      /* @__PURE__ */ e(b, { color: "secondary", variant: "Small", children: t.projected_income })
     ] }),
-    /* @__PURE__ */ e(y, { bold: !0, justifyContent: "center", variant: "Body", children: "-" }),
-    /* @__PURE__ */ g(B, { alignItems: "center", children: [
-      /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: T(o, "0,0") }),
-      /* @__PURE__ */ e(y, { color: "secondary", variant: "Small", children: t.budgeted })
+    /* @__PURE__ */ e(b, { bold: !0, justifyContent: "center", variant: "Body", children: "-" }),
+    /* @__PURE__ */ m(S, { alignItems: "center", children: [
+      /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: T(o, "0,0") }),
+      /* @__PURE__ */ e(b, { color: "secondary", variant: "Small", children: t.budgeted })
     ] }),
-    /* @__PURE__ */ e(y, { bold: !0, justifyContent: "center", variant: "Body", children: "=" }),
-    /* @__PURE__ */ g(B, { alignItems: "center", children: [
-      /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: T(s, "0,0") }),
-      /* @__PURE__ */ e(y, { color: "secondary", variant: "Small", children: t.remaining })
+    /* @__PURE__ */ e(b, { bold: !0, justifyContent: "center", variant: "Body", children: "=" }),
+    /* @__PURE__ */ m(S, { alignItems: "center", children: [
+      /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: T(s, "0,0") }),
+      /* @__PURE__ */ e(b, { color: "secondary", variant: "Small", children: t.remaining })
     ] })
   ] });
-}), lt = I(
+}), ut = I(
   ({ category: t }) => {
     const { budgets: o } = w(), { budgets: i } = D(), s = l.useMemo(() => {
       const a = i.find((c) => c.category_guid === t.guid), n = T(t.totalAverageAmount, "0,0"), r = a ? R(o.recalculate_previous_budget, T(a.amount, "0,0")) : o.recalculate_new_budget;
       return `${n} - ${r}`;
     }, [o, i]);
-    return /* @__PURE__ */ g(l.Fragment, { children: [
-      /* @__PURE__ */ e(V, { children: /* @__PURE__ */ g(Y, { children: [
-        /* @__PURE__ */ e(se, { children: /* @__PURE__ */ e(W, { categoryGuid: t.guid, variant: "filled" }) }),
-        /* @__PURE__ */ e(Z, { primary: t.name, secondary: s })
+    return /* @__PURE__ */ m(l.Fragment, { children: [
+      /* @__PURE__ */ e(Y, { children: /* @__PURE__ */ m(Z, { children: [
+        /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e(K, { categoryGuid: t.guid, variant: "filled" }) }),
+        /* @__PURE__ */ e(q, { primary: t.name, secondary: s })
       ] }) }),
-      /* @__PURE__ */ e(re, {})
+      /* @__PURE__ */ e(se, {})
     ] }, t.guid);
   }
-), dt = ({ onRecalculateBudgets: t }) => {
-  const { budgets: o, common: i } = w(), { spendCategories: s } = U(), { recalculateBudgets: a, setAlert: n } = D(), [r, c] = l.useState(!1), d = s.filter((u) => u.totalAverageAmount > 0), m = async () => {
-    await a(d), c(!1), n(o.alert_recalculated_budgets), t?.();
+), mt = ({ onRecalculateBudgets: t }) => {
+  const { budgets: o, common: i } = w(), { spendCategories: s } = z(), { recalculateBudgets: a, setAlert: n } = D(), [r, c] = l.useState(!1), g = s.filter((u) => u.totalAverageAmount > 0), d = async () => {
+    await a(g), c(!1), n(o.alert_recalculated_budgets), t?.();
   };
-  return /* @__PURE__ */ g(l.Fragment, { children: [
-    /* @__PURE__ */ e(Te, { onClick: () => c(!0), sx: { mt: 24, mx: 24 }, variant: "text", children: o.recalculate_button }),
-    /* @__PURE__ */ e(y, { sx: { mx: 24, my: 16, textAlign: "center", whiteSpace: "wrap" }, variant: "Paragraph", children: o.recalculate_help }),
+  return /* @__PURE__ */ m(l.Fragment, { children: [
+    /* @__PURE__ */ e(we, { onClick: () => c(!0), sx: { mt: 24, mx: 24 }, variant: "text", children: o.recalculate_button }),
+    /* @__PURE__ */ e(b, { sx: { mx: 24, my: 16, textAlign: "center", whiteSpace: "wrap" }, variant: "Paragraph", children: o.recalculate_help }),
     /* @__PURE__ */ e(
-      $,
+      k,
       {
         ariaLabelClose: i.close_aria,
         isOpen: r,
         onClose: () => c(!1),
-        onPrimaryAction: m,
+        onPrimaryAction: d,
         title: o.recalculate_title,
-        children: /* @__PURE__ */ g(B, { children: [
-          /* @__PURE__ */ g(B, { mx: 24, my: 16, children: [
-            /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: o.recalculate_description_top }),
-            /* @__PURE__ */ e(y, { variant: "ParagraphSmall", children: o.recalculate_description_bottom })
+        children: /* @__PURE__ */ m(S, { children: [
+          /* @__PURE__ */ m(S, { mx: 24, my: 16, children: [
+            /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: o.recalculate_description_top }),
+            /* @__PURE__ */ e(b, { variant: "ParagraphSmall", children: o.recalculate_description_bottom })
           ] }),
-          /* @__PURE__ */ e(H, { bgcolor: "background.paper", children: /* @__PURE__ */ e(K, { children: d.map((u) => /* @__PURE__ */ e(lt, { category: u }, u.guid)) }) })
+          /* @__PURE__ */ e(W, { bgcolor: "background.paper", children: /* @__PURE__ */ e(X, { children: g.map((u) => /* @__PURE__ */ e(ut, { category: u }, u.guid)) }) })
         ] })
       }
     )
   ] });
-}, ce = ({
+}, le = ({
   amount: t,
   categoryName: o,
   onAmountChanged: i
 }) => {
-  const { budgets: s } = w(), { totalBudgeted: a } = D(), { incomeTotal: n } = te(), r = n - a;
-  return /* @__PURE__ */ g(B, { gap: 16, children: [
-    /* @__PURE__ */ g(B, { children: [
-      /* @__PURE__ */ e(y, { children: R(
+  const { budgets: s } = w(), { totalBudgeted: a } = D(), { incomeTotal: n } = ne(), r = n - a;
+  return /* @__PURE__ */ m(S, { gap: 16, children: [
+    /* @__PURE__ */ m(S, { children: [
+      /* @__PURE__ */ e(b, { children: R(
         s.add_description_top,
         T(r, "0,0")
       ) }),
-      /* @__PURE__ */ e(y, { children: R(s.add_description_bottom, o) })
+      /* @__PURE__ */ e(b, { children: R(s.add_description_bottom, o) })
     ] }),
     /* @__PURE__ */ e(
-      He,
+      Ke,
       {
         amount: t,
         autoFocus: !0,
@@ -131,24 +131,24 @@ const ct = I(() => {
       }
     )
   ] });
-}, ut = I(({ category: t, onAddBudget: o }) => {
+}, gt = I(({ category: t, onAddBudget: o }) => {
   const { budgets: i, common: s } = w(), [a, n] = l.useState(!1), [r, c] = l.useState(
     `${t.totalAmount === 0 ? "" : t.totalAmount}`
   );
-  return /* @__PURE__ */ g(l.Fragment, { children: [
-    /* @__PURE__ */ e(V, { children: /* @__PURE__ */ g(Y, { onClick: () => n(!0), children: [
-      /* @__PURE__ */ e(se, { children: /* @__PURE__ */ e(W, { categoryGuid: t.guid }) }),
+  return /* @__PURE__ */ m(l.Fragment, { children: [
+    /* @__PURE__ */ e(Y, { children: /* @__PURE__ */ m(Z, { onClick: () => n(!0), children: [
+      /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e(K, { categoryGuid: t.guid }) }),
       /* @__PURE__ */ e(
-        Z,
+        q,
         {
           primary: t.name,
           secondary: T(t.totalAmount, "0,0")
         }
       ),
-      /* @__PURE__ */ e(Fe, { children: /* @__PURE__ */ e(P, { name: "add", size: 20 }) })
+      /* @__PURE__ */ e(We, { children: /* @__PURE__ */ e(N, { name: "add", size: 20 }) })
     ] }) }, t.guid),
     /* @__PURE__ */ e(
-      j,
+      G,
       {
         copy: { close_aria: s.close_aria, title: i.add_title },
         disablePrimaryButton: Number(r) <= 0,
@@ -156,27 +156,27 @@ const ct = I(() => {
         onClose: () => n(!1),
         onPrimaryAction: () => o(t, Number(r)),
         primaryText: i.add_save_button,
-        children: /* @__PURE__ */ e(ce, { amount: r, categoryName: t.name, onAmountChanged: c })
+        children: /* @__PURE__ */ e(le, { amount: r, categoryName: t.name, onAmountChanged: c })
       }
     )
   ] });
-}), Ee = I(({ onRecalculateBudgets: t }) => {
+}), Oe = I(({ onRecalculateBudgets: t }) => {
   const { budgets: o } = w(), { addBudget: i, setAlert: s, unbudgetedCategories: a } = D(), n = async (r, c) => {
     await i(r, c), s(R(o.alert_budget_created, r.name));
   };
-  return /* @__PURE__ */ g(B, { children: [
-    /* @__PURE__ */ e(ct, {}),
-    /* @__PURE__ */ e(H, { bgcolor: "background.paper", children: /* @__PURE__ */ e(K, { children: a.map((r) => /* @__PURE__ */ e(
-      ut,
+  return /* @__PURE__ */ m(S, { children: [
+    /* @__PURE__ */ e(dt, {}),
+    /* @__PURE__ */ e(W, { bgcolor: "background.paper", children: /* @__PURE__ */ e(X, { children: a.map((r) => /* @__PURE__ */ e(
+      gt,
       {
         category: r,
         onAddBudget: n
       },
       r.guid
     )) }) }),
-    /* @__PURE__ */ e(dt, { onRecalculateBudgets: t })
+    /* @__PURE__ */ e(mt, { onRecalculateBudgets: t })
   ] });
-}), Ce = 5, Oe = 100, Q = 25, mt = (t) => {
+}), Be = 5, Me = 100, ee = 25, pt = (t) => {
   const o = (a) => {
     a.active || t.alphaTarget(0.3).restart(), a.subject.fx = a.subject.x, a.subject.fy = a.subject.y;
   }, i = (a) => {
@@ -185,14 +185,14 @@ const ct = I(() => {
     a.active || t.alphaTarget(0), a.subject.fx = null, a.subject.fy = null;
   };
   return O.drag().on("start", o).on("drag", i).on("end", s);
-}, gt = (t) => {
+}, ht = (t) => {
   let o = t.transaction_total / t.amount;
   o < 0 ? o = 0 : o > 1 && (o = 1);
-  const i = o * 2 * Math.PI, s = O.interpolate(0, i), a = O.arc().cornerRadius(5).innerRadius(t.radius - Ce * 2).outerRadius(t.radius - Ce).startAngle(0).endAngle(0);
+  const i = o * 2 * Math.PI, s = O.interpolate(0, i), a = O.arc().cornerRadius(5).innerRadius(t.radius - Be * 2).outerRadius(t.radius - Be).startAngle(0).endAngle(0);
   return (n) => (a.endAngle(s(n)), a(t) || "");
-}, pt = (t) => {
-  O.selectAll(".bubble").call(mt(t));
-}, Be = (t, o, i) => Math.min(Math.max(t, o), i), ht = (t, o, i) => {
+}, ft = (t) => {
+  O.selectAll(".bubble").call(pt(t));
+}, Se = (t, o, i) => Math.min(Math.max(t, o), i), bt = (t, o, i) => {
   t.alpha(1).restart().force(
     "x",
     O.forceX().x(i / 2).strength(0.01)
@@ -202,18 +202,18 @@ const ct = I(() => {
   ).on("tick", () => {
     const s = t.nodes();
     s.forEach((a) => {
-      const n = a.radius ?? Q;
-      a.x = Be(a.x ?? 0, n, i - n), a.y = Be(a.y ?? 0, n, o - n);
+      const n = a.radius ?? ee;
+      a.x = Se(a.x ?? 0, n, i - n), a.y = Se(a.y ?? 0, n, o - n);
     }), O.selectAll(".bubble").data(s).attr("transform", (a) => `translate(${a.x},${a.y})`);
   });
-}, Me = (t, o) => O.scaleLinear().domain([t, o]).range([Q, Oe]), ft = (t) => {
+}, Re = (t, o) => O.scaleLinear().domain([t, o]).range([ee, Me]), yt = (t) => {
   const o = t.reduce((n, r) => {
     const c = Math.max(r.transaction_total, r.amount);
     return c > n ? c : n;
   }, 0), i = t.reduce((n, r) => {
     const c = Math.max(r.transaction_total, r.amount);
     return c < n ? c : n;
-  }, o), s = Me(i, o), a = t.map((n) => {
+  }, o), s = Re(i, o), a = t.map((n) => {
     const r = s(Math.max(n.transaction_total, n.amount)) || 25;
     return {
       ...n,
@@ -221,25 +221,25 @@ const ct = I(() => {
     };
   });
   return O.forceSimulation(a).velocityDecay(0.05).force("collide", O.forceCollide((n) => n.radius + 2).strength(0.7));
-}, bt = (t, o, i) => {
-  const a = Math.PI * Q ** 2 * t, n = i < 400 || o < 300, r = n ? 40 : 20, c = Math.max(100, i - r), d = Math.max(100, o - r), m = c * d;
-  let u = Q;
-  if (a < m) {
-    const f = Math.sqrt(m / (t * Math.PI)), h = Math.min(c, d) / 4;
-    u = Math.min(Oe, f, h);
+}, _t = (t, o, i) => {
+  const a = Math.PI * ee ** 2 * t, n = i < 400 || o < 300, r = n ? 40 : 20, c = Math.max(100, i - r), g = Math.max(100, o - r), d = c * g;
+  let u = ee;
+  if (a < d) {
+    const h = Math.sqrt(d / (t * Math.PI)), f = Math.min(c, g) / 4;
+    u = Math.min(Me, h, f);
   }
   return n && t <= 3 && (u = Math.min(u, 45)), { minRadius: Math.max(20, u * 0.6), maxRadius: u };
-}, yt = (t, o, i, s, a) => {
-  const { maxRadius: n, minRadius: r } = bt(t, o, a);
+}, Ct = (t, o, i, s, a) => {
+  const { maxRadius: n, minRadius: r } = _t(t, o, a);
   return O.scaleLinear().domain([s, i]).range([r, n]);
-}, _t = (t, o, i = !1, s, a) => {
-  const n = o.map((m) => Math.max(m.transaction_total, m.amount)), r = Math.min(...n), c = Math.max(...n), d = i ? yt(t.length, s, c, r, a) : Me(r, c);
-  return t.map((m) => ({
-    ...m,
-    radius: d(Math.max(m.transaction_total, m.amount))
+}, Bt = (t, o, i = !1, s, a) => {
+  const n = o.map((d) => Math.max(d.transaction_total, d.amount)), r = Math.min(...n), c = Math.max(...n), g = i ? Ct(t.length, s, c, r, a) : Re(r, c);
+  return t.map((d) => ({
+    ...d,
+    radius: g(Math.max(d.transaction_total, d.amount))
   }));
-}, Se = 5, Ct = 2e3, Bt = ({ bubble: t }) => {
-  const o = ee(), {
+}, xe = 5, St = 2e3, xt = ({ bubble: t }) => {
+  const o = te(), {
     amount: i,
     guid: s,
     budgetColors: { mercury: a },
@@ -247,20 +247,20 @@ const ct = I(() => {
     transaction_total: r
   } = t, c = `mercury-${s}`;
   l.useEffect(() => {
-    O.select(`.${c}`).selectAll(".status").remove(), O.select(`.${c}`).append("path").transition().duration(Ct).delay(0).attr("class", "status").attr("style", `fill: ${a}; fill-opacity: 1;`).attrTween("d", () => gt(t));
+    O.select(`.${c}`).selectAll(".status").remove(), O.select(`.${c}`).append("path").transition().duration(St).delay(0).attr("class", "status").attr("style", `fill: ${a}; fill-opacity: 1;`).attrTween("d", () => ht(t));
   }, [i, n, r]);
-  const d = O.arc().innerRadius((m) => m - 2 * Se).outerRadius((m) => m - Se).startAngle(0).endAngle(2 * Math.PI);
+  const g = O.arc().innerRadius((d) => d - 2 * xe).outerRadius((d) => d - xe).startAngle(0).endAngle(2 * Math.PI);
   return /* @__PURE__ */ e("g", { className: c, children: /* @__PURE__ */ e(
     "path",
     {
-      d: d(n) || "",
+      d: g(n) || "",
       style: { fill: o.palette.common.white, fillOpacity: 0.35 }
     }
   ) });
-}, St = l.memo(Bt), G = 75, me = 50;
-function xt({ bubble: t, isDraggable: o, onClick: i = () => {
+}, vt = l.memo(xt), P = 75, ge = 50;
+function At({ bubble: t, isDraggable: o, onClick: i = () => {
 } }) {
-  const [s, a] = l.useState(!1), n = Xe(), { availableWidth: r } = ne(), c = l.useMemo(() => {
+  const [s, a] = l.useState(!1), n = Ye(), { availableWidth: r } = oe(), c = l.useMemo(() => {
     if (t)
       return {
         amount: t.amount,
@@ -272,50 +272,50 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
   }, [t.amount, t.budgetColors, t.guid, t.radius, t.transaction_total]);
   if (!t) return;
   const {
-    budgetColors: { background: d, text: m },
-    category: { icon: u, name: _ },
-    guid: f,
-    description: h,
+    budgetColors: { background: g, text: d },
+    category: { icon: u, name: B },
+    guid: h,
+    description: f,
     radius: p,
-    x: S,
-    y: b
-  } = t, C = r < 400 ? -8 : -12;
-  let v = C, A = C;
-  p > G ? (v = -14, A = -45) : p > me && (A = -32);
+    x: C,
+    y
+  } = t, _ = r < 400 ? -8 : -12;
+  let v = _, A = _;
+  p > P ? (v = -14, A = -45) : p > ge && (A = -32);
   let x = 32;
-  p <= G && (x = r < 400 ? 16 : 24);
-  const E = `${t.category.name}: ${h}`, M = {
+  p <= P && (x = r < 400 ? 16 : 24);
+  const E = `${t.category.name}: ${f}`, M = {
     modifiers: [
       {
         name: "offset",
         options: { offset: [0, 15] }
       }
     ]
-  }, N = (L) => {
-    (L.key === "Enter" || L.key === " ") && (L.preventDefault(), i(t));
-  }, F = () => {
+  }, $ = (F) => {
+    (F.key === "Enter" || F.key === " ") && (F.preventDefault(), i(t));
+  }, U = () => {
     a(!0);
-  }, le = () => {
+  }, de = () => {
     a(!1);
   };
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ m(
     "g",
     {
-      "aria-label": `${_} - ${h}`,
+      "aria-label": `${B} - ${f}`,
       className: "bubble",
-      id: `bubble-${f}`,
-      onBlur: le,
+      id: `bubble-${h}`,
+      onBlur: de,
       onClick: () => i(t),
-      onFocus: F,
-      onKeyDown: N,
+      onFocus: U,
+      onKeyDown: $,
       onMouseEnter: () => a(!0),
       onMouseLeave: () => a(!1),
       role: "button",
       style: { cursor: o ? "pointer" : "default" },
       tabIndex: 0,
       textAnchor: "middle",
-      x: S,
-      y: b,
+      x: C,
+      y,
       children: [
         /* @__PURE__ */ e("style", { children: `
           .bubble:focus,
@@ -329,111 +329,102 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
             stroke-opacity: 0.8;
           }
         ` }),
-        /* @__PURE__ */ e(
-          Ke,
-          {
-            followCursor: !0,
-            open: s,
-            slotProps: { popper: M },
-            title: E,
-            children: /* @__PURE__ */ e("circle", { fill: d, id: `circle-${f}`, r: p })
-          }
-        ),
-        /* @__PURE__ */ e("svg", { x: v, y: A, children: /* @__PURE__ */ e(P, { name: u, size: x, sx: { fill: m } }) }),
-        p > G && /* @__PURE__ */ e(
-          y,
+        /* @__PURE__ */ e(Ve, { open: s, slotProps: { popper: M }, title: E, children: /* @__PURE__ */ e("circle", { fill: g, id: `circle-${h}`, r: p }) }),
+        /* @__PURE__ */ e("svg", { x: v, y: A, children: /* @__PURE__ */ e(N, { name: u, size: x, sx: { fill: d } }) }),
+        p > P && /* @__PURE__ */ e(
+          b,
           {
             bold: !0,
             component: "text",
-            id: `budget-category-${f}`,
-            sx: { fill: m },
+            id: `budget-category-${h}`,
+            sx: { fill: d },
             variant: "Small",
             y: 4,
-            children: _
+            children: B
           }
         ),
-        p > me && /* @__PURE__ */ e(
-          y,
+        p > ge && /* @__PURE__ */ e(
+          b,
           {
             bold: !0,
             component: "text",
-            id: `budget-description-${f}-1`,
-            sx: { fill: m },
+            id: `budget-description-${h}-1`,
+            sx: { fill: d },
             variant: "Body",
-            y: p <= G ? 12 : 24,
-            children: p <= G ? h.split(" ")[0] : h
+            y: p <= P ? 12 : 24,
+            children: p <= P ? f.split(" ")[0] : f
           }
         ),
-        p <= G && p > me && /* @__PURE__ */ e(
-          y,
+        p <= P && p > ge && /* @__PURE__ */ e(
+          b,
           {
             component: "text",
-            id: `budget-description-${f}-2`,
-            sx: { fill: m },
+            id: `budget-description-${h}-2`,
+            sx: { fill: d },
             variant: "XSmall",
             y: 28,
-            children: h.split(" ")[1]
+            children: f.split(" ")[1]
           }
         ),
-        /* @__PURE__ */ e(St, { bubble: c })
+        /* @__PURE__ */ e(vt, { bubble: c })
       ]
     },
-    f
+    h
   );
 }
-const vt = ({
+const Tt = ({
   height: t,
   width: o,
   isDraggable: i = !1,
   onClick: s = () => {
   }
 }) => {
-  const [a, n] = l.useState([]), r = l.useRef(null), c = l.useRef(!1), { detailedBudgets: d } = D(), m = l.useCallback(() => {
-    const u = r.current, _ = ft(d), f = _.nodes();
+  const [a, n] = l.useState([]), r = l.useRef(null), c = l.useRef(!1), { detailedBudgets: g } = D(), d = l.useCallback(() => {
+    const u = r.current, B = yt(g), h = B.nodes();
     if (u) {
-      const h = u.nodes(), p = new Map(h.map((S) => [S.guid, S]));
-      f.forEach((S) => {
-        const b = p.get(S.guid);
-        b && Object.assign(S, {
-          vx: b.vx,
-          vy: b.vy,
-          x: b.x,
-          y: b.y
+      const f = u.nodes(), p = new Map(f.map((C) => [C.guid, C]));
+      h.forEach((C) => {
+        const y = p.get(C.guid);
+        y && Object.assign(C, {
+          vx: y.vx,
+          vy: y.vy,
+          x: y.x,
+          y: y.y
         });
       });
     }
-    r.current = _, c.current = !1, n(f);
-  }, [d]);
+    r.current = B, c.current = !1, n(h);
+  }, [g]);
   return l.useEffect(() => {
-    m();
-  }, [m]), l.useEffect(() => () => {
+    d();
+  }, [d]), l.useEffect(() => () => {
     r.current && (r.current.stop(), r.current = null);
   }, []), l.useEffect(() => {
     const u = r.current;
     if (!u) return;
-    const _ = u.nodes(), f = o > 0 && o < 450 || t > 0 && t < 300, h = _t(_, d, f, t, o);
-    u.nodes(h), ht(u, t, o), i && setTimeout(() => {
-      pt(u);
-    }, 0), n([...h]);
-  }, [t, o, i, d]), /* @__PURE__ */ e("svg", { height: t, style: { overflow: "visible" }, width: Math.abs(o), children: a.map((u) => /* @__PURE__ */ e(xt, { bubble: u, isDraggable: i, onClick: s }, u.guid)) });
-}, At = I(vt), Tt = ({
+    const B = u.nodes(), h = o > 0 && o < 450 || t > 0 && t < 300, f = Bt(B, g, h, t, o);
+    u.nodes(f), bt(u, t, o), i && setTimeout(() => {
+      ft(u);
+    }, 0), n([...f]);
+  }, [t, o, i, g]), /* @__PURE__ */ e("svg", { height: t, style: { overflow: "visible" }, width: Math.abs(o), children: a.map((u) => /* @__PURE__ */ e(At, { bubble: u, isDraggable: i, onClick: s }, u.guid)) });
+}, wt = I(Tt), Dt = ({
   isMiniWidget: t = !1,
   onConnectAccountsClick: o,
   createBudgetOnClick: i
 }) => {
-  const { recalculateBudgets: s } = D(), { spendCategories: a } = U(), { budgets: n } = w(), { availableWidth: r } = ne(), { isMobile: c } = ie(r), d = t && c, [m, u] = l.useState(!1), [_, f] = l.useState(!1), [h, p] = l.useState(!1), S = l.useMemo(() => [...a.filter((C) => C.totalAverageAmount > 0)], [a]), b = async () => {
+  const { recalculateBudgets: s } = D(), { spendCategories: a } = z(), { budgets: n } = w(), { availableWidth: r } = oe(), { isMobile: c } = ce(r), g = t && c, [d, u] = l.useState(!1), [B, h] = l.useState(!1), [f, p] = l.useState(!1), C = l.useMemo(() => [...a.filter((_) => _.totalAverageAmount > 0)], [a]), y = async () => {
     p(!0);
-    const { data: C, isSuccess: v } = await s(S);
-    p(!1), v ? (C.length === 0 && f(!0), u(!1)) : u(!0);
+    const { data: _, isSuccess: v } = await s(C);
+    p(!1), v ? (_.length === 0 && h(!0), u(!1)) : u(!0);
   };
-  return h ? /* @__PURE__ */ e(z, {}) : m ? /* @__PURE__ */ e(
-    ue,
+  return f ? /* @__PURE__ */ e(j, {}) : d ? /* @__PURE__ */ e(
+    me,
     {
       header: n.autogenerate_budgets_error_header,
       icon: "error",
       iconColor: "#4D4D4D",
-      onClick: (C) => {
-        C === "primary" ? b() : i();
+      onClick: (_) => {
+        _ === "primary" ? y() : i();
       },
       primaryButton: n.autogenerate_budgets_error_primary_button,
       secondaryButton: n.zero_state_generate_budgets_secondary_button,
@@ -442,19 +433,19 @@ const vt = ({
         width: { sm: 468 },
         ".buttons-footer": {
           width: 208,
-          ...d && { mt: 16, button: { height: "max-content" } }
+          ...g && { mt: 16, button: { height: "max-content" } }
         },
-        ...d && { justifyContent: "center", mt: 0, svg: { height: 32, width: 32 } }
+        ...g && { justifyContent: "center", mt: 0, svg: { height: 32, width: 32 } }
       }
     }
-  ) : /* @__PURE__ */ e(je, { children: _ ? /* @__PURE__ */ e(
-    ue,
+  ) : /* @__PURE__ */ e(ze, { children: B ? /* @__PURE__ */ e(
+    me,
     {
       header: n.zero_state_generate_budgets_header,
       icon: "error",
       iconColor: "#4D4D4D",
-      onClick: (C) => {
-        C === "primary" ? o() : i();
+      onClick: (_) => {
+        _ === "primary" ? o() : i();
       },
       primaryButton: n.zero_state_generate_budgets_primary_button,
       secondaryButton: n.zero_state_generate_budgets_secondary_button,
@@ -462,24 +453,24 @@ const vt = ({
       sx: {
         width: t ? "100%" : { sm: 500 },
         height: t ? "100%" : { sm: 468 },
-        mt: d ? 0 : 50,
+        mt: g ? 0 : 50,
         ".buttons-footer": {
           width: 208,
           height: 100,
-          ...d && { mt: 16, button: { height: "max-content" } }
+          ...g && { mt: 16, button: { height: "max-content" } }
         },
         padding: t ? 5 : 0,
-        ...d && { justifyContent: "center", svg: { height: 32, width: 32 } }
+        ...g && { justifyContent: "center", svg: { height: 32, width: 32 } }
       }
     }
   ) : /* @__PURE__ */ e(
-    ue,
+    me,
     {
       header: n.create_budgets_title,
       icon: "bubble_chart",
       iconColor: "#1A1A1A",
-      onClick: (C) => {
-        C === "primary" ? b() : i();
+      onClick: (_) => {
+        _ === "primary" ? y() : i();
       },
       primaryButton: n.empty_state_primary_button,
       secondaryButton: t ? void 0 : n.empty_state_secondary_button,
@@ -487,18 +478,18 @@ const vt = ({
       sx: {
         width: t ? "100%" : { sm: 432 },
         height: t ? "100%" : { sm: 468 },
-        mt: d ? 0 : 50,
+        mt: g ? 0 : 50,
         ".buttons-footer": {
           width: 208,
           height: 100,
-          ...d && { mt: 24, button: { height: "max-content" } }
+          ...g && { mt: 24, button: { height: "max-content" } }
         },
         padding: t ? 4 : 0,
-        ...d && { justifyContent: "center", svg: { height: 32, width: 32 } }
+        ...g && { justifyContent: "center", svg: { height: 32, width: 32 } }
       }
     }
   ) });
-}, Re = I(
+}, Le = I(
   ({
     createBudgetOnClick: t = () => {
     },
@@ -508,41 +499,41 @@ const vt = ({
     shouldShowZeroState: a,
     unavailableWidth: n = 24
   }) => {
-    const { onEvent: r } = X(), { setSelectedBudget: c } = D(), { isLoadingCategoryTotals: d } = U(), { isInitialized: m } = oe(), { accounts: u } = w(), { availableWidth: _ } = ne(), { isMobile: f } = ie(), [h, p] = l.useState(!1), S = l.useMemo(() => _ - n, [_]), b = (v) => {
-      c(v), r(k.BUDGETS_CLICK_BUDGET_CATEGORY, {
+    const { onEvent: r } = V(), { setSelectedBudget: c } = D(), { isLoadingCategoryTotals: g } = z(), { isInitialized: d } = ae(), { accounts: u } = w(), { availableWidth: B } = oe(), { isMobile: h } = ce(), [f, p] = l.useState(!1), C = l.useMemo(() => B - n, [B]), y = (v) => {
+      c(v), r(L.BUDGETS_CLICK_BUDGET_CATEGORY, {
         budget_category: v.category.name,
         click_type: "bubble"
       });
-    }, C = () => {
-      p(!0), r(k.ACCOUNTS_CLICK_CONNECT);
+    }, _ = () => {
+      p(!0), r(L.ACCOUNTS_CLICK_CONNECT);
     };
-    return d ? /* @__PURE__ */ e(B, { alignItems: "center", height: o, justifyContent: "center", width: Math.abs(S), children: /* @__PURE__ */ e(z, {}) }) : /* @__PURE__ */ g(
-      H,
+    return g ? /* @__PURE__ */ e(S, { alignItems: "center", height: o, justifyContent: "center", width: Math.abs(C), children: /* @__PURE__ */ e(j, {}) }) : /* @__PURE__ */ m(
+      W,
       {
-        ml: a || f ? 0 : 24,
+        ml: a || h ? 0 : 24,
         sx: { alignSelf: "center", ...s && { height: "100%" } },
         children: [
-          a || !m ? /* @__PURE__ */ e(
-            Tt,
+          a || !d ? /* @__PURE__ */ e(
+            Dt,
             {
               createBudgetOnClick: t,
               isMiniWidget: s,
-              onConnectAccountsClick: C
+              onConnectAccountsClick: _
             }
           ) : /* @__PURE__ */ e(
-            At,
+            wt,
             {
               height: o,
               isDraggable: i,
-              onClick: b,
-              width: S
+              onClick: y,
+              width: C
             }
           ),
           /* @__PURE__ */ e(
-            We,
+            Xe,
             {
               onClose: () => p(!1),
-              showConnectionsWidget: h,
+              showConnectionsWidget: f,
               title: u.manage_connections
             }
           )
@@ -550,13 +541,13 @@ const vt = ({
       }
     );
   }
-), wt = ({
+), It = ({
   budgetsCopy: t,
   difference: o,
   handleAddClick: i,
   shouldShowZeroState: s
 }) => {
-  const { availableHeight: a = 0 } = ne(), n = l.useRef(null);
+  const { availableHeight: a = 0 } = oe(), n = l.useRef(null);
   l.useEffect(() => {
     a > 0 && n.current === null && (n.current = a);
   }, [a]);
@@ -564,9 +555,9 @@ const vt = ({
     const c = n.current ?? a;
     return c > 0 ? Math.round(Math.max(120, Math.min(450, c * 0.8))) - 40 : 450;
   }, [a]);
-  return /* @__PURE__ */ g(B, { sx: { height: "100%", justifyContent: "space-between" }, children: [
+  return /* @__PURE__ */ m(S, { sx: { height: "100%", justifyContent: "space-between" }, children: [
     /* @__PURE__ */ e(
-      Re,
+      Le,
       {
         createBudgetOnClick: i,
         height: r,
@@ -574,25 +565,25 @@ const vt = ({
         shouldShowZeroState: s
       }
     ),
-    !s && /* @__PURE__ */ g(H, { ml: 16, children: [
-      /* @__PURE__ */ e(y, { bold: !0, color: o < 0 ? "error.main" : "success.main", children: T(Math.abs(o), "0,0") }),
-      /* @__PURE__ */ e(y, { children: o < 0 ? t.overspent_in_budgets : t.left_in_budgets })
+    !s && /* @__PURE__ */ m(W, { ml: 16, children: [
+      /* @__PURE__ */ e(b, { bold: !0, color: o < 0 ? "error.main" : "success.main", children: T(Math.abs(o), "0,0") }),
+      /* @__PURE__ */ e(b, { children: o < 0 ? t.overspent_in_budgets : t.left_in_budgets })
     ] })
   ] });
-}, Dt = (t) => {
-  const o = ee(), { onEvent: i } = X(), { detailedBudgets: s, isDataLoaded: a, loadBudgetData: n, setTheme: r } = D(), { budgets: c, common: d } = w(), { isCopyLoaded: m, isInitialized: u, selectedAccounts: _ } = oe(), { reloadCategoryTotals: f } = U(), h = Ye(), p = s.length === 0, [S, b] = l.useState(!1), C = () => {
-    b(!0), i(k.BUDGETS_CLICK_ADD);
-  }, v = () => b(!1);
+}, Et = (t) => {
+  const o = te(), { onEvent: i } = V(), { detailedBudgets: s, isDataLoaded: a, loadBudgetData: n, setTheme: r } = D(), { budgets: c, common: g } = w(), { isCopyLoaded: d, isInitialized: u, selectedAccounts: B } = ae(), { reloadCategoryTotals: h } = z(), f = qe(), p = s.length === 0, [C, y] = l.useState(!1), _ = () => {
+    y(!0), i(L.BUDGETS_CLICK_ADD);
+  }, v = () => y(!1);
   return l.useEffect(() => {
     r(o);
   }, [o]), l.useEffect(() => {
-    u && !a && f(_, J(/* @__PURE__ */ new Date()), ge(/* @__PURE__ */ new Date())).then(
+    u && !a && h(B, Q(/* @__PURE__ */ new Date()), pe(/* @__PURE__ */ new Date())).then(
       () => {
         n().finally();
       }
     );
-  }, [u, _]), m ? /* @__PURE__ */ g(
-    Ze,
+  }, [u, B]), d ? /* @__PURE__ */ m(
+    Je,
     {
       contentStyles: { height: "calc(100% - 66px)", ":last-child": { pb: 0 } },
       primaryCtaLabel: p ? c.get_started_cta : c.details_cta,
@@ -601,28 +592,28 @@ const vt = ({
       ...t,
       children: [
         a ? /* @__PURE__ */ e(
-          wt,
+          It,
           {
             budgetsCopy: c,
-            difference: h,
-            handleAddClick: C,
+            difference: f,
+            handleAddClick: _,
             shouldShowZeroState: p
           }
-        ) : /* @__PURE__ */ e(z, {}),
+        ) : /* @__PURE__ */ e(j, {}),
         /* @__PURE__ */ e(
-          $,
+          k,
           {
-            ariaLabelClose: d.close_aria,
-            isOpen: S,
-            onClose: () => b(!1),
+            ariaLabelClose: g.close_aria,
+            isOpen: C,
+            onClose: () => y(!1),
             title: c.add_new_title,
-            children: /* @__PURE__ */ e(Ee, { onRecalculateBudgets: v })
+            children: /* @__PURE__ */ e(Oe, { onRecalculateBudgets: v })
           }
         )
       ]
     }
-  ) : /* @__PURE__ */ e(z, {});
-}, Ln = I(Dt), Le = ({ budget: t }) => {
+  ) : /* @__PURE__ */ e(j, {});
+}, $n = I(Et), ke = ({ budget: t }) => {
   const {
     amount: o,
     budgetColors: { background: i },
@@ -636,20 +627,20 @@ const vt = ({
       percentage: `${n}%`
     }
   ];
-  return /* @__PURE__ */ e(he, { sx: { mt: 24, mx: 24 }, children: /* @__PURE__ */ e(fe, { children: /* @__PURE__ */ g(B, { alignItems: "center", gap: 16, children: [
-    /* @__PURE__ */ e(W, { categoryGuid: a, size: 56 }),
-    /* @__PURE__ */ e(ze, { children: `${T(r, "0,0")} / ${T(o, "0,0")}` }),
-    /* @__PURE__ */ e(y, { bold: !0, variant: "XSmall", children: s }),
-    /* @__PURE__ */ e(pe, { data: c, height: 10 })
+  return /* @__PURE__ */ e(fe, { sx: { mt: 24, mx: 24 }, children: /* @__PURE__ */ e(be, { children: /* @__PURE__ */ m(S, { alignItems: "center", gap: 16, children: [
+    /* @__PURE__ */ e(K, { categoryGuid: a, size: 56 }),
+    /* @__PURE__ */ e(Ue, { children: `${T(r, "0,0")} / ${T(o, "0,0")}` }),
+    /* @__PURE__ */ e(b, { bold: !0, variant: "XSmall", children: s }),
+    /* @__PURE__ */ e(he, { data: c, height: 10 })
   ] }) }) });
-}, It = I(() => {
+}, Ot = I(() => {
   const { budgets: t } = w();
-  return /* @__PURE__ */ g(B, { alignItems: "center", gap: 12, height: "auto", mb: 24, mt: 24, children: [
-    /* @__PURE__ */ e(P, { color: "secondary", name: "bubble_chart", sx: { fontSize: 32 } }),
-    /* @__PURE__ */ e(y, { bold: !0, color: "secondary", variant: "Small", children: t.zero_state_no_sub_budgets }),
-    /* @__PURE__ */ e(y, { color: "text.secondary", variant: "XSmall", children: t.zero_state_no_sub_budgets_description })
+  return /* @__PURE__ */ m(S, { alignItems: "center", gap: 12, height: "auto", mb: 24, mt: 24, children: [
+    /* @__PURE__ */ e(N, { color: "secondary", name: "bubble_chart", sx: { fontSize: 32 } }),
+    /* @__PURE__ */ e(b, { bold: !0, color: "secondary", variant: "Small", children: t.zero_state_no_sub_budgets }),
+    /* @__PURE__ */ e(b, { color: "text.secondary", variant: "XSmall", children: t.zero_state_no_sub_budgets_description })
   ] });
-}), Et = I(({ budget: t }) => {
+}), Mt = I(({ budget: t }) => {
   const {
     amount: o,
     budgetColors: { background: i },
@@ -657,219 +648,219 @@ const vt = ({
     percentage: a,
     transaction_total: n
   } = t, { setSelectedSubBudget: r } = D();
-  return /* @__PURE__ */ e(V, { children: /* @__PURE__ */ g(Y, { onClick: () => r(t), children: [
-    /* @__PURE__ */ e(se, { sx: { mb: -8, mr: 16 }, children: /* @__PURE__ */ e(De, { color: i, percent: a, size: 40, children: /* @__PURE__ */ e(W, { categoryGuid: s.parent_guid, variant: "basic" }) }) }),
+  return /* @__PURE__ */ e(Y, { children: /* @__PURE__ */ m(Z, { onClick: () => r(t), children: [
+    /* @__PURE__ */ e(ie, { sx: { mb: -8, mr: 16 }, children: /* @__PURE__ */ e(Ie, { color: i, percent: a, size: 40, children: /* @__PURE__ */ e(K, { categoryGuid: s.parent_guid, variant: "basic" }) }) }),
     /* @__PURE__ */ e(
-      Z,
+      q,
       {
-        primary: /* @__PURE__ */ e(B, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: t.category.name }) }),
-        secondary: /* @__PURE__ */ e(B, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(y, { fontWeight: 400, variant: "Body", children: `
+        primary: /* @__PURE__ */ e(S, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: t.category.name }) }),
+        secondary: /* @__PURE__ */ e(S, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(b, { fontWeight: 400, variant: "Body", children: `
                   ${T(n, "0,0")} / 
                   ${T(o, "0,0")}
                 ` }) })
       }
     )
   ] }) });
-}), Ot = I(({ category: t, parentBudget: o }) => {
-  const { budgets: i, common: s } = w(), { setExpandedGuid: a, setOnSelect: n } = ot(), { addBudget: r } = D(), [c, d] = l.useState(!1), [m, u] = l.useState(!1), [_, f] = l.useState(""), [h, p] = l.useState(void 0);
+}), Rt = I(({ category: t, parentBudget: o }) => {
+  const { budgets: i, common: s } = w(), { setExpandedGuid: a, setOnSelect: n } = rt(), { addBudget: r } = D(), [c, g] = l.useState(!1), [d, u] = l.useState(!1), [B, h] = l.useState(""), [f, p] = l.useState(void 0);
   l.useEffect(() => {
-    n((C) => {
-      const v = t.subCategories.find((A) => A.guid === C);
-      v && (p(v), f(`${v.currentAmount === 0 ? "" : v.currentAmount}`), u(!0));
+    n((_) => {
+      const v = t.subCategories.find((A) => A.guid === _);
+      v && (p(v), h(`${v.currentAmount === 0 ? "" : v.currentAmount}`), u(!0));
     });
   }, []);
-  const S = () => {
-    a(t.guid), d(!0);
-  }, b = async () => {
-    h && Number(_) > 0 && (await r(h, Number(_), o.guid), u(!1), d(!1), p(void 0));
+  const C = () => {
+    a(t.guid), g(!0);
+  }, y = async () => {
+    f && Number(B) > 0 && (await r(f, Number(B), o.guid), u(!1), g(!1), p(void 0));
   };
-  return /* @__PURE__ */ g(H, { children: [
-    /* @__PURE__ */ e(V, { disableGutters: !0, disablePadding: !0, sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(Y, { onClick: S, children: /* @__PURE__ */ e(Z, { children: /* @__PURE__ */ g(B, { alignItems: "center", direction: "row", justifyContent: "space-between", children: [
-      /* @__PURE__ */ g(B, { alignItems: "center", direction: "row", gap: 8, children: [
-        /* @__PURE__ */ e(P, { fill: !0, name: "add_box", size: 24, sx: { color: "primary.light" } }),
-        /* @__PURE__ */ e(y, { bold: !0, sx: { color: "primary.light" }, variant: "Body", children: i.add_sub_budget_button })
+  return /* @__PURE__ */ m(W, { children: [
+    /* @__PURE__ */ e(Y, { disableGutters: !0, disablePadding: !0, sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(Z, { onClick: C, children: /* @__PURE__ */ e(q, { children: /* @__PURE__ */ m(S, { alignItems: "center", direction: "row", justifyContent: "space-between", children: [
+      /* @__PURE__ */ m(S, { alignItems: "center", direction: "row", gap: 8, children: [
+        /* @__PURE__ */ e(N, { fill: !0, name: "add_box", size: 24, sx: { color: "primary.light" } }),
+        /* @__PURE__ */ e(b, { bold: !0, sx: { color: "primary.light" }, variant: "Body", children: i.add_sub_budget_button })
       ] }),
-      /* @__PURE__ */ e(P, { name: "chevron_right", size: 24, sx: { color: "primary.light" } })
+      /* @__PURE__ */ e(N, { name: "chevron_right", size: 24, sx: { color: "primary.light" } })
     ] }) }) }) }),
-    /* @__PURE__ */ e(re, {}),
+    /* @__PURE__ */ e(se, {}),
     /* @__PURE__ */ e(
-      $,
+      k,
       {
         ariaLabelClose: s.close_aria,
         isOpen: c,
-        onClose: () => d(!1),
+        onClose: () => g(!1),
         title: i.add_sub_budget_title,
-        children: /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(at, { category: t, subCategories: t.subCategories }) })
+        children: /* @__PURE__ */ e(X, { children: /* @__PURE__ */ e(st, { category: t, subCategories: t.subCategories }) })
       }
     ),
     /* @__PURE__ */ e(
-      j,
+      G,
       {
         copy: { close_aria: s.close_aria, title: i.add_title },
-        disablePrimaryButton: Number(_) <= 0,
-        isOpen: m,
+        disablePrimaryButton: Number(B) <= 0,
+        isOpen: d,
         onClose: () => u(!1),
-        onPrimaryAction: b,
+        onPrimaryAction: y,
         primaryText: i.add_save_button,
         children: /* @__PURE__ */ e(
-          ce,
+          le,
           {
-            amount: _,
-            categoryName: h?.name || "",
-            onAmountChanged: f
+            amount: B,
+            categoryName: f?.name || "",
+            onAmountChanged: h
           }
         )
       }
     )
   ] });
-}), Mt = I(({ budget: t }) => {
-  const { category: o, subBudgets: i } = t, { budgets: s, common: a } = w(), { deleteBudget: n, selectedSubBudget: r, setSelectedSubBudget: c, updateBudget: d } = D(), { filter: m, setFilter: u } = ae(), [_, f] = l.useState(!1), [h, p] = l.useState(!1), [S, b] = l.useState("");
+}), Lt = I(({ budget: t }) => {
+  const { category: o, subBudgets: i } = t, { budgets: s, common: a } = w(), { deleteBudget: n, selectedSubBudget: r, setSelectedSubBudget: c, updateBudget: g } = D(), { filter: d, setFilter: u } = re(), [B, h] = l.useState(!1), [f, p] = l.useState(!1), [C, y] = l.useState("");
   l.useEffect(() => {
-    r && (b(`${r.amount}`), u({
-      ...m,
+    r && (y(`${r.amount}`), u({
+      ...d,
       custom: (x) => x.category_guid === r.category_guid
     }));
   }, [r]);
-  const C = async () => {
-    r && await d({
+  const _ = async () => {
+    r && await g({
       ...r,
-      amount: Number(S)
+      amount: Number(C)
     });
   }, v = async () => {
     r && await n(r.guid), p(!1), A();
   }, A = () => {
     u({
-      ...m,
+      ...d,
       custom: (x) => x.category_guid === t.category_guid || x.top_level_category_guid === t.category_guid
     }), c(void 0);
   };
-  return /* @__PURE__ */ g(l.Fragment, { children: [
-    /* @__PURE__ */ g(K, { sx: { bgcolor: "background.paper" }, children: [
-      i.length === 0 ? /* @__PURE__ */ e(It, {}) : i.map((x) => /* @__PURE__ */ g(l.Fragment, { children: [
-        /* @__PURE__ */ e(Et, { budget: x }),
-        /* @__PURE__ */ e(re, {})
+  return /* @__PURE__ */ m(l.Fragment, { children: [
+    /* @__PURE__ */ m(X, { sx: { bgcolor: "background.paper" }, children: [
+      i.length === 0 ? /* @__PURE__ */ e(Ot, {}) : i.map((x) => /* @__PURE__ */ m(l.Fragment, { children: [
+        /* @__PURE__ */ e(Mt, { budget: x }),
+        /* @__PURE__ */ e(se, {})
       ] }, x.guid)),
-      /* @__PURE__ */ e(Ot, { category: o, parentBudget: t })
+      /* @__PURE__ */ e(Rt, { category: o, parentBudget: t })
     ] }),
     /* @__PURE__ */ e(
-      $,
+      k,
       {
         ariaLabelClose: a.close_aria,
         isOpen: !!r,
         onClose: A,
-        onPrimaryAction: () => f(!0),
+        onPrimaryAction: () => h(!0),
         onSecondaryAction: () => p(!0),
         primaryText: s.details_edit_button,
         secondaryText: s.details_delete_button,
         title: s.details_title,
-        children: r && /* @__PURE__ */ g(B, { gap: 24, children: [
-          /* @__PURE__ */ e(Le, { budget: r }),
-          /* @__PURE__ */ e(we, { height: "100%" })
+        children: r && /* @__PURE__ */ m(S, { gap: 24, children: [
+          /* @__PURE__ */ e(ke, { budget: r }),
+          /* @__PURE__ */ e(De, { height: "100%" })
         ] })
       }
     ),
-    r && /* @__PURE__ */ g(l.Fragment, { children: [
+    r && /* @__PURE__ */ m(l.Fragment, { children: [
       /* @__PURE__ */ e(
-        j,
+        G,
         {
           copy: { close_aria: a.close_aria, title: s.details_edit_title },
-          disablePrimaryButton: Number(S) <= 0,
-          isOpen: _,
-          onClose: () => f(!1),
-          onPrimaryAction: C,
+          disablePrimaryButton: Number(C) <= 0,
+          isOpen: B,
+          onClose: () => h(!1),
+          onPrimaryAction: _,
           primaryText: s.edit_save_button,
           children: /* @__PURE__ */ e(
-            ce,
+            le,
             {
-              amount: S,
+              amount: C,
               categoryName: r.category.name,
-              onAmountChanged: b
+              onAmountChanged: y
             }
           )
         }
       ),
       /* @__PURE__ */ e(
-        j,
+        G,
         {
           copy: { close_aria: a.close_aria, title: s.delete_title },
-          isOpen: h,
+          isOpen: f,
           onClose: () => p(!1),
           onPrimaryAction: v,
           primaryColor: "error",
           primaryText: "Delete",
           secondaryColor: "secondary",
-          children: /* @__PURE__ */ e(y, { variant: "Paragraph", children: R(s.delete_description, r.category.name) })
+          children: /* @__PURE__ */ e(b, { variant: "Paragraph", children: R(s.delete_description, r.category.name) })
         }
       )
     ] })
   ] });
-}), Rt = I(({ budget: t }) => {
-  const { is_mobile_webview: o } = Ue(), { setAlert: i } = D(), { budgets: s, common: a, transactions: n } = w(), { isDesktop: r, isSmallTablet: c, isTablet: d } = ie(), {
-    sortedTransactions: m,
+}), kt = I(({ budget: t }) => {
+  const { is_mobile_webview: o } = Fe(), { setAlert: i } = D(), { budgets: s, common: a, transactions: n } = w(), { isDesktop: r, isSmallTablet: c, isTablet: g } = ce(), {
+    sortedTransactions: d,
     sortedTransactionsWithSplits: u,
-    tags: _
-  } = ae(), [f, h] = l.useState(0), [p, S] = l.useState(""), b = l.useMemo(
-    () => m.find((x) => x.guid === p),
-    [p, m]
-  ), C = (x, E) => {
-    h(E);
+    tags: B
+  } = re(), [h, f] = l.useState(0), [p, C] = l.useState(""), y = l.useMemo(
+    () => d.find((x) => x.guid === p),
+    [p, d]
+  ), _ = (x, E) => {
+    f(E);
   }, v = () => {
-    tt(u, _), i(s.alert_csv_downloaded);
-  }, A = m.length > 0 && !o && (r || d && !c);
-  return /* @__PURE__ */ g(B, { gap: 24, children: [
-    /* @__PURE__ */ e(Le, { budget: t }),
-    /* @__PURE__ */ g(B, { children: [
-      /* @__PURE__ */ g(
-        et,
+    ot(u, B), i(s.alert_csv_downloaded);
+  }, A = d.length > 0 && !o && (r || g && !c);
+  return /* @__PURE__ */ m(S, { gap: 24, children: [
+    /* @__PURE__ */ e(ke, { budget: t }),
+    /* @__PURE__ */ m(S, { children: [
+      /* @__PURE__ */ m(
+        nt,
         {
-          onChange: C,
+          onChange: _,
           sx: { width: "100%" },
           textColor: "primary",
-          value: f,
+          value: h,
           variant: "fullWidth",
           children: [
-            /* @__PURE__ */ e(_e, { label: s.details_transactions_tab }),
-            /* @__PURE__ */ e(_e, { label: s.details_subbudgets_tab })
+            /* @__PURE__ */ e(Ce, { label: s.details_transactions_tab }),
+            /* @__PURE__ */ e(Ce, { label: s.details_subbudgets_tab })
           ]
         }
       ),
-      f === 0 && /* @__PURE__ */ g(B, { children: [
-        A && /* @__PURE__ */ e(B, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ e(
-          Te,
+      h === 0 && /* @__PURE__ */ m(S, { children: [
+        A && /* @__PURE__ */ e(S, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ e(
+          we,
           {
             onClick: v,
-            startIcon: /* @__PURE__ */ e(P, { name: "ios_share" }),
+            startIcon: /* @__PURE__ */ e(N, { name: "ios_share" }),
             variant: "text",
             children: n.export_csv_btn
           }
         ) }),
-        /* @__PURE__ */ e(we, { height: "100%", onClick: S })
+        /* @__PURE__ */ e(De, { height: "100%", onClick: C })
       ] }),
-      f === 1 && /* @__PURE__ */ e(Mt, { budget: t }),
+      h === 1 && /* @__PURE__ */ e(Lt, { budget: t }),
       /* @__PURE__ */ e(
-        $,
+        k,
         {
           ariaLabelClose: a.close_aria,
-          isOpen: !!b,
-          onClose: () => S(""),
+          isOpen: !!y,
+          onClose: () => C(""),
           title: s.details_transaction_drawer,
-          children: b && /* @__PURE__ */ e(nt, { transaction: b })
+          children: y && /* @__PURE__ */ e(at, { transaction: y })
         }
       )
     ] })
   ] });
-}), Lt = I(() => {
-  const { selectedAccountGuids: t } = oe(), { budgets: o, common: i } = w(), {
+}), $t = I(() => {
+  const { selectedAccountGuids: t } = ae(), { budgets: o, common: i } = w(), {
     dateRange: s,
     deleteBudget: a,
     selectedBudget: n,
     selectedSubBudget: r,
     setAlert: c,
-    setSelectedBudget: d,
-    updateBudget: m
-  } = D(), { setFilter: u } = ae(), [_, f] = l.useState(!1), [h, p] = l.useState(!1), [S, b] = l.useState(!1), [C, v] = l.useState("");
+    setSelectedBudget: g,
+    updateBudget: d
+  } = D(), { setFilter: u } = re(), [B, h] = l.useState(!1), [f, p] = l.useState(!1), [C, y] = l.useState(!1), [_, v] = l.useState("");
   l.useEffect(() => {
-    n && !r && (v(`${n.amount}`), f(!0), u({
+    n && !r && (v(`${n.amount}`), h(!0), u({
       accounts: t,
       dateRange: s,
       custom: (M) => M.category_guid === n.category_guid || M.top_level_category_guid === n.category_guid,
@@ -877,48 +868,48 @@ const vt = ({
     }));
   }, [n]);
   const A = async () => {
-    n && (await m({
+    n && (await d({
       ...n,
-      amount: Number(C),
-      percentage: n.category.totalAmount / Number(C) * 100
+      amount: Number(_),
+      percentage: n.category.totalAmount / Number(_) * 100
     }), c(R(o.alert_budget_updated, n.category.name)));
   }, x = async () => {
-    n && (await a(n.guid), c(R(o.alert_budget_deleted, n.category.name))), b(!1), E();
+    n && (await a(n.guid), c(R(o.alert_budget_deleted, n.category.name))), y(!1), E();
   }, E = () => {
-    f(!1), setTimeout(() => {
-      d(void 0);
+    h(!1), setTimeout(() => {
+      g(void 0);
     }, 250);
   };
   if (n)
-    return /* @__PURE__ */ g(l.Fragment, { children: [
+    return /* @__PURE__ */ m(l.Fragment, { children: [
       /* @__PURE__ */ e(
-        $,
+        k,
         {
           ariaLabelClose: i.close_aria,
-          isOpen: _,
+          isOpen: B,
           onClose: E,
           onPrimaryAction: () => p(!0),
-          onSecondaryAction: () => b(!0),
+          onSecondaryAction: () => y(!0),
           primaryText: o.details_edit_button,
           secondaryColor: "error",
           secondaryText: o.details_delete_button,
           title: o.details_title,
-          children: /* @__PURE__ */ e(Rt, { budget: n })
+          children: /* @__PURE__ */ e(kt, { budget: n })
         }
       ),
       /* @__PURE__ */ e(
-        j,
+        G,
         {
           copy: { close_aria: i.close_aria, title: o.details_edit_title },
-          disablePrimaryButton: Number(C) <= 0,
-          isOpen: h,
+          disablePrimaryButton: Number(_) <= 0,
+          isOpen: f,
           onClose: () => p(!1),
           onPrimaryAction: A,
           primaryText: o.edit_save_button,
           children: /* @__PURE__ */ e(
-            ce,
+            le,
             {
-              amount: C,
+              amount: _,
               categoryName: n.category.name,
               onAmountChanged: v
             }
@@ -926,66 +917,66 @@ const vt = ({
         }
       ),
       /* @__PURE__ */ e(
-        j,
+        G,
         {
           copy: { close_aria: i.close_aria, title: o.delete_title },
-          isOpen: S,
-          onClose: () => b(!1),
+          isOpen: C,
+          onClose: () => y(!1),
           onPrimaryAction: x,
           primaryColor: "error",
           primaryText: o.details_delete_button,
           secondaryColor: "secondary",
-          children: /* @__PURE__ */ e(y, { variant: "Paragraph", children: R(o.delete_description, n.category.name) })
+          children: /* @__PURE__ */ e(b, { variant: "Paragraph", children: R(o.delete_description, n.category.name) })
         }
       )
     ] });
-}), kt = ({ budget: t, onClick: o }) => {
+}), Nt = ({ budget: t, onClick: o }) => {
   const {
     amount: i,
     budgetColors: { background: s, description: a },
     category_guid: n,
     description: r,
     percentage: c,
-    subBudgets: d,
-    transaction_total: m
+    subBudgets: g,
+    transaction_total: d
   } = t;
-  return /* @__PURE__ */ e(V, { children: /* @__PURE__ */ g(Y, { onClick: () => o?.(t), children: [
-    /* @__PURE__ */ e(se, { sx: { mb: -8, mr: 16 }, children: /* @__PURE__ */ e(De, { color: s, percent: c, size: 40, children: /* @__PURE__ */ e(W, { categoryGuid: n, variant: "basic" }) }) }),
+  return /* @__PURE__ */ e(Y, { children: /* @__PURE__ */ m(Z, { onClick: () => o?.(t), children: [
+    /* @__PURE__ */ e(ie, { sx: { mb: -8, mr: 16 }, children: /* @__PURE__ */ e(Ie, { color: s, percent: c, size: 40, children: /* @__PURE__ */ e(K, { categoryGuid: n, variant: "basic" }) }) }),
     /* @__PURE__ */ e(
-      Z,
+      q,
       {
-        primary: /* @__PURE__ */ g(B, { component: "span", direction: "row", justifyContent: "space-between", children: [
-          /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: t.category.name }),
-          /* @__PURE__ */ e(y, { fontWeight: 400, variant: "Body", children: `
-                  ${T(m, "0,0")} / 
+        primary: /* @__PURE__ */ m(S, { component: "span", direction: "row", justifyContent: "space-between", children: [
+          /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: t.category.name }),
+          /* @__PURE__ */ e(b, { fontWeight: 400, variant: "Body", children: `
+                  ${T(d, "0,0")} / 
                   ${T(i, "0,0")}
                 ` })
         ] }),
-        secondary: /* @__PURE__ */ g(B, { component: "span", direction: "row", justifyContent: "space-between", children: [
-          /* @__PURE__ */ e(y, { variant: "XSmall", children: `${d.length} Sub-budgets` }),
-          /* @__PURE__ */ e(y, { bold: c > 100, color: a, variant: "XSmall", children: r })
+        secondary: /* @__PURE__ */ m(S, { component: "span", direction: "row", justifyContent: "space-between", children: [
+          /* @__PURE__ */ e(b, { variant: "XSmall", children: `${g.length} Sub-budgets` }),
+          /* @__PURE__ */ e(b, { bold: c > 100, color: a, variant: "XSmall", children: r })
         ] })
       }
     )
   ] }) });
-}, $t = I(() => {
-  const { onEvent: t } = X(), { budgets: o } = w(), { detailedBudgets: i, setSelectedBudget: s } = D(), a = (n) => {
-    s(n), t(k.BUDGETS_CLICK_BUDGET_CATEGORY, {
+}, Pt = I(() => {
+  const { onEvent: t } = V(), { budgets: o } = w(), { detailedBudgets: i, setSelectedBudget: s } = D(), a = (n) => {
+    s(n), t(L.BUDGETS_CLICK_BUDGET_CATEGORY, {
       budget_category: n.category.name,
       click_type: "list"
     });
   };
-  return /* @__PURE__ */ g(he, { elevation: 2, children: [
-    /* @__PURE__ */ e(Ie, { sx: { pb: 8, pl: 24 }, title: /* @__PURE__ */ e(ve, { children: o.budget_categories_title }) }),
-    /* @__PURE__ */ e(fe, { sx: { p: 0, ":last-child": { p: 0 } }, children: /* @__PURE__ */ e(K, { children: i.map((n) => /* @__PURE__ */ g(l.Fragment, { children: [
-      /* @__PURE__ */ e(kt, { budget: n, onClick: a }),
-      /* @__PURE__ */ e(re, {})
+  return /* @__PURE__ */ m(fe, { elevation: 2, children: [
+    /* @__PURE__ */ e(Ee, { sx: { pb: 8, pl: 24 }, title: /* @__PURE__ */ e(Ae, { children: o.budget_categories_title }) }),
+    /* @__PURE__ */ e(be, { sx: { p: 0, ":last-child": { p: 0 } }, children: /* @__PURE__ */ e(X, { children: i.map((n) => /* @__PURE__ */ m(l.Fragment, { children: [
+      /* @__PURE__ */ e(Nt, { budget: n, onClick: a }),
+      /* @__PURE__ */ e(se, {})
     ] }, n.guid)) }) })
   ] });
-}), Nt = I(() => {
-  const t = ee(), { onEvent: o } = X(), { visibleAccounts: i } = Ae(), { budgets: s, common: a, recurring: n } = w(), { incomeCategories: r, spendCategories: c } = U(), { detailedBudgets: d, totalBudgeted: m } = D(), { incomeTotal: u } = te(), { setFilter: _ } = ae(), [f, h] = l.useState(!1), [p, S] = l.useMemo(() => {
-    const A = c.reduce((N, F) => N + F.totalAmount, 0);
-    let x = A / m;
+}), Gt = I(() => {
+  const t = te(), { onEvent: o } = V(), { visibleAccounts: i } = Te(), { budgets: s, common: a, recurring: n } = w(), { incomeCategories: r, spendCategories: c } = z(), { detailedBudgets: g, totalBudgeted: d } = D(), { incomeTotal: u } = ne(), { setFilter: B } = re(), [h, f] = l.useState(!1), [p, C] = l.useMemo(() => {
+    const A = c.reduce(($, U) => $ + U.totalAmount, 0);
+    let x = A / d;
     x > 1 && (x = 1);
     let E = t.palette.success.main;
     x > 0.8 && x < 1 ? E = t.palette.warning.main : x >= 1 && (E = t.palette.error.main);
@@ -996,9 +987,9 @@ const vt = ({
       }
     ];
     return [A, M];
-  }, [d, c]), [b, C] = l.useMemo(() => {
+  }, [g, c]), [y, _] = l.useMemo(() => {
     const A = Math.abs(
-      r.reduce((M, N) => M + N.totalAmount, 0)
+      r.reduce((M, $) => M + $.totalAmount, 0)
     );
     let x = A / u;
     x > 1 && (x = 1);
@@ -1010,166 +1001,168 @@ const vt = ({
     ];
     return [A, E];
   }, [r, u]), v = () => {
-    _({
+    B({
       accounts: i.map((A) => A.guid),
       dateRange: {
-        start: rt(/* @__PURE__ */ new Date(), 90),
+        start: it(/* @__PURE__ */ new Date(), 90),
         end: /* @__PURE__ */ new Date()
       }
-    }), h(!0), o(k.BUDGETS_CLICK_EDIT_INCOME);
+    }), f(!0), o(L.BUDGETS_CLICK_EDIT_INCOME);
   };
-  return /* @__PURE__ */ g(he, { elevation: 2, sx: { overflow: "visible" }, children: [
-    /* @__PURE__ */ e(Ie, { sx: { pb: 8, pl: 24 }, title: /* @__PURE__ */ e(ve, { children: s.overview_title }) }),
-    /* @__PURE__ */ e(fe, { sx: { pt: 12, px: 24 }, children: /* @__PURE__ */ g(B, { gap: 24, children: [
-      /* @__PURE__ */ g(B, { gap: 8, children: [
-        /* @__PURE__ */ e(y, { bold: !0, sx: { mb: 8 }, variant: "Body", children: s.spending_title }),
-        /* @__PURE__ */ e(pe, { data: S, height: 16 }),
-        /* @__PURE__ */ e(y, { variant: "Small", children: R(
+  return /* @__PURE__ */ m(fe, { elevation: 2, sx: { overflow: "visible" }, children: [
+    /* @__PURE__ */ e(Ee, { sx: { pb: 8, pl: 24 }, title: /* @__PURE__ */ e(Ae, { children: s.overview_title }) }),
+    /* @__PURE__ */ e(be, { sx: { pt: 12, px: 24 }, children: /* @__PURE__ */ m(S, { gap: 24, children: [
+      /* @__PURE__ */ m(S, { gap: 8, children: [
+        /* @__PURE__ */ e(b, { bold: !0, sx: { mb: 8 }, variant: "Body", children: s.spending_title }),
+        /* @__PURE__ */ e(he, { data: C, height: 16 }),
+        /* @__PURE__ */ e(b, { variant: "Small", children: R(
           s.spending_description,
           T(p, "0,0"),
-          T(m, "0,0")
+          T(d, "0,0")
         ) })
       ] }),
-      /* @__PURE__ */ g(B, { gap: 8, children: [
-        /* @__PURE__ */ g(B, { alignItems: "center", direction: "row", gap: 4, mb: -4, children: [
-          /* @__PURE__ */ e(y, { bold: !0, variant: "Body", children: s.income_title }),
+      /* @__PURE__ */ m(S, { gap: 8, children: [
+        /* @__PURE__ */ m(S, { alignItems: "center", direction: "row", gap: 4, mb: -4, children: [
+          /* @__PURE__ */ e(b, { bold: !0, variant: "Body", children: s.income_title }),
           /* @__PURE__ */ e(
-            st,
+            ct,
             {
               "aria-label": n.manage_income,
               onClick: v,
               sx: { p: 0 },
-              children: /* @__PURE__ */ e(P, { color: "primary", name: "edit" })
+              children: /* @__PURE__ */ e(N, { color: "primary", name: "edit" })
             }
           )
         ] }),
-        /* @__PURE__ */ e(pe, { data: C, height: 16 }),
-        /* @__PURE__ */ e(y, { variant: "Small", children: R(
+        /* @__PURE__ */ e(he, { data: _, height: 16 }),
+        /* @__PURE__ */ e(b, { variant: "Small", children: R(
           s.income_description,
-          T(b, "0,0"),
+          T(y, "0,0"),
           T(u, "0,0")
         ) })
       ] })
     ] }) }),
     /* @__PURE__ */ e(
-      $,
+      k,
       {
         ariaLabelClose: a.close_aria,
-        isOpen: f,
-        onClose: () => h(!1),
+        isOpen: h,
+        onClose: () => f(!1),
         title: n.manage_income,
-        children: /* @__PURE__ */ e(it, { forOverview: !0 })
+        children: /* @__PURE__ */ e(lt, { forOverview: !0 })
       }
     )
   ] });
-}), xe = 480, kn = I(({ onBackClick: t, sx: o }) => {
-  const i = ee(), { onEvent: s } = X(), { visibleAccounts: a } = Ae(), { budgets: n, common: r } = w(), { isCopyLoaded: c, isInitialized: d, selectedAccounts: m, setDisplayedDate: u, setSelectedAccounts: _ } = oe(), {
+}), ve = 480, Nn = I(({ onBackClick: t, sx: o }) => {
+  const i = te(), { onEvent: s } = V(), { onLoad: a } = He(), { visibleAccounts: n } = Te(), { budgets: r, common: c } = w(), { isCopyLoaded: g, isInitialized: d, selectedAccounts: u, setDisplayedDate: B, setSelectedAccounts: h } = ae(), {
     alert: f,
-    dateRange: h,
-    isDataLoaded: p,
-    loadBudgetData: S,
-    setDateRange: b,
-    setAlert: C,
-    setTheme: v,
-    detailedBudgets: A
-  } = D(), { loadRepeatingTransactions: x, setDateRange: E } = te(), { reloadCategoryTotals: M } = U(), { isSmallTablet: N, isMobile: F, isSmallMobile: le } = ie(), L = N || F || le, [ke, de] = l.useState(!1);
-  l.useEffect(() => (v(i), _(a), b({ start: J(q()), end: ge(q()) }), s(k.BUDGETS_VIEW), () => {
-    b({ start: J(q()), end: ge(q()) });
+    dateRange: p,
+    isDataLoaded: C,
+    loadBudgetData: y,
+    setDateRange: _,
+    setAlert: v,
+    setTheme: A,
+    detailedBudgets: x
+  } = D(), { loadRepeatingTransactions: E, setDateRange: M } = ne(), { reloadCategoryTotals: $ } = z(), { isSmallTablet: U, isMobile: de, isSmallMobile: F } = ce(), H = U || de || F, [$e, ue] = l.useState(!1);
+  l.useEffect(() => (A(i), h(n), _({ start: Q(J()), end: pe(J()) }), s(L.BUDGETS_VIEW), () => {
+    _({ start: Q(J()), end: pe(J()) });
   }), []), l.useEffect(() => {
-    _(a);
-  }, [a]), l.useEffect(() => {
-    d && (u(h.start, h.end), M(m, h.start, h.end).finally(), E(h), p || (x().finally(), S().finally()));
-  }, [d, m, h]);
-  const $e = (ye) => {
-    b({ start: ye[0] || /* @__PURE__ */ new Date(), end: ye[1] || /* @__PURE__ */ new Date() });
-  }, Ne = () => {
-    s(k.BUDGETS_CLICK_FILTER);
-  }, be = () => {
-    de(!0), s(k.BUDGETS_CLICK_ADD);
+    h(n);
+  }, [n]), l.useEffect(() => {
+    d && (B(p.start, p.end), $(u, p.start, p.end).finally(), M(p), C || (E().finally(), y().finally(() => {
+      a?.("BubbleBudgetsWidget");
+    })));
+  }, [d, u, p]);
+  const Ne = (_e) => {
+    _({ start: _e[0] || /* @__PURE__ */ new Date(), end: _e[1] || /* @__PURE__ */ new Date() });
   }, Pe = () => {
-    de(!1);
-  }, Ge = qe(h.end, J(/* @__PURE__ */ new Date()));
-  return !c || !d || !p ? /* @__PURE__ */ e(z, {}) : /* @__PURE__ */ g(
-    Ve,
+    s(L.BUDGETS_CLICK_FILTER);
+  }, ye = () => {
+    ue(!0), s(L.BUDGETS_CLICK_ADD);
+  }, Ge = () => {
+    ue(!1);
+  }, je = Qe(p.end, Q(/* @__PURE__ */ new Date()));
+  return !g || !d || !C ? /* @__PURE__ */ e(j, {}) : /* @__PURE__ */ m(
+    Ze,
     {
-      accountOptions: a,
+      accountOptions: n,
       actions: [
         {
           iconName: "add",
-          label: n.add_title,
-          onClick: be
+          label: r.add_title,
+          onClick: ye
         }
       ],
       calendarActions: {
-        onRangeChanged: $e,
-        shouldDisableNext: Ge,
+        onRangeChanged: Ne,
+        shouldDisableNext: je,
         shouldDisablePicker: !0
       },
-      onAccountsFilterClick: Ne,
+      onAccountsFilterClick: Pe,
       onBackClick: t,
       sx: o,
-      title: n.budgets_title,
+      title: r.budgets_title,
       children: [
-        (!d || !p) && /* @__PURE__ */ e(z, {}),
-        d && p && /* @__PURE__ */ g(
-          B,
+        (!d || !C) && /* @__PURE__ */ e(j, {}),
+        d && C && /* @__PURE__ */ m(
+          S,
           {
-            direction: L ? "column" : "row",
+            direction: H ? "column" : "row",
             height: "100%",
             sx: { justifyContent: "center" },
             width: "100%",
             children: [
-              /* @__PURE__ */ e(B, { height: L ? 450 : "calc(100dvh - 150px)", children: /* @__PURE__ */ e(
-                Re,
+              /* @__PURE__ */ e(S, { height: H ? 450 : "calc(100dvh - 150px)", children: /* @__PURE__ */ e(
+                Le,
                 {
-                  createBudgetOnClick: be,
-                  height: L ? 450 : 800,
+                  createBudgetOnClick: ye,
+                  height: H ? 450 : 800,
                   isDraggable: !0,
-                  shouldShowZeroState: A.length === 0,
-                  unavailableWidth: L ? 0 : xe
+                  shouldShowZeroState: x.length === 0,
+                  unavailableWidth: H ? 0 : ve
                 }
               ) }),
-              A.length !== 0 && /* @__PURE__ */ g(
-                B,
+              x.length !== 0 && /* @__PURE__ */ m(
+                S,
                 {
                   gap: 24,
                   height: "100%",
                   sx: { mr: 24, mt: 48 },
-                  width: L ? "100%" : xe,
+                  width: H ? "100%" : ve,
                   children: [
-                    /* @__PURE__ */ e(Nt, {}),
-                    /* @__PURE__ */ e($t, {})
+                    /* @__PURE__ */ e(Gt, {}),
+                    /* @__PURE__ */ e(Pt, {})
                   ]
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ e(Lt, {}),
+        /* @__PURE__ */ e($t, {}),
         /* @__PURE__ */ e(
-          $,
+          k,
           {
-            ariaLabelClose: r.close_aria,
-            isOpen: ke,
-            onClose: () => de(!1),
-            title: n.add_new_title,
-            children: /* @__PURE__ */ e(Ee, { onRecalculateBudgets: Pe })
+            ariaLabelClose: c.close_aria,
+            isOpen: $e,
+            onClose: () => ue(!1),
+            title: r.add_new_title,
+            children: /* @__PURE__ */ e(Oe, { onRecalculateBudgets: Ge })
           }
         ),
         /* @__PURE__ */ e(
-          Qe,
+          tt,
           {
             anchorOrigin: { vertical: "bottom", horizontal: "right" },
             autoHideDuration: 3500,
             onClose: () => {
-              C("");
+              v("");
             },
             open: !!f,
             children: /* @__PURE__ */ e(
-              Je,
+              et,
               {
                 onClose: () => {
-                  C("");
+                  v("");
                 },
                 severity: "success",
                 variant: "filled",
@@ -1183,6 +1176,6 @@ const vt = ({
   );
 });
 export {
-  Ln as BubbleBudgetsMiniWidget,
-  kn as BubbleBudgetsWidget
+  $n as BubbleBudgetsMiniWidget,
+  Nn as BubbleBudgetsWidget
 };