@mx-cartographer/experiences 7.0.52-alpha.mega6 → 7.0.52-alpha.sms1

package/dist/budgets/index.es.js

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