@mx-cartographer/experiences 8.0.0-alpha.sms1 → 8.0.0-alpha.sms2

package/dist/budgets/index.es.js

@@ -6,7 +6,7 @@ import { startOfMonth as J } from "date-fns/startOfMonth";
 import F from "@mui/material/Box";
 import B from "@mui/material/Stack";
 import ee from "@mui/material/styles/useTheme";
-import { Text as y, CategoryIcon as H, Icon as P, H1 as je, H3 as Ae } from "@mxenabled/mxui";
+import { Text as _, CategoryIcon as H, Icon as P, H1 as je, H3 as Ae } from "@mxenabled/mxui";
 import W from "@mui/material/List";
 import { u as w, i as D, j as te, m as K, q as ne, g as X, b as oe, d as pe, h as ae, a as ze, n as Ue } from "../hooks-C41HAxM5.mjs";
 import { f as T } from "../NumberFormatting-DjTD0t3W.mjs";
@@ -17,53 +17,53 @@ import se from "@mui/material/ListItemAvatar";
 import Y from "@mui/material/ListItemButton";
 import Z from "@mui/material/ListItemText";
 import { b as R } from "../Localization-2MODESHW.mjs";
-import { D as L } from "../Drawer-BEtCk82g.mjs";
+import { D as L } from "../Drawer-Dqe5EqvA.mjs";
 import Fe from "@mui/material/ListItemSecondaryAction";
-import { C as He } from "../CurrencyInput-BFKcs-_K.mjs";
-import { D as j } from "../Dialog-BPTr3qHE.mjs";
-import { C as We } from "../ConnectionsDrawer-BFfY3_zB.mjs";
+import { C as He } from "../CurrencyInput-BrGvhgVK.mjs";
+import { D as j } from "../Dialog-CDV0kKxj.mjs";
+import { C as We } from "../ConnectionsDrawer-CSo6AFkG.mjs";
 import * as O from "d3";
 import Ke from "@mui/material/Tooltip";
 import { useTheme as Xe } from "@mui/material/styles";
+import { L as he } from "../Loader-BSWSYqvn.mjs";
 import { u as ie } from "../useScreenSize-B6JyS_Lj.mjs";
-import { L as he } from "../Loader-DUaFpDGv.mjs";
 import { E as de } from "../EmptyState-DoxNUae-.mjs";
-import { A as k, W as Ve } from "../WidgetContainer-BhQ1Kx2z.mjs";
-import { u as Ye } from "../BudgetUtil-Df2nII9u.mjs";
-import { M as Ze } from "../MiniWidgetContainer-CmXpTylX.mjs";
+import { A as k, W as Ve } from "../WidgetContainer-B1Jzb4XA.mjs";
+import { u as Ye } from "../BudgetUtil-CIDAPPPT.mjs";
+import { M as Ze } from "../MiniWidgetContainer-D7MkHG15.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 Ce from "@mui/material/Tab";
 import et from "@mui/material/Tabs";
-import { e as tt } from "../exportTransactionsToCSV-Cz2t0lmA.mjs";
-import { T as we, a as nt } from "../TransactionDetails-5M2vfr59.mjs";
+import { e as tt } from "../exportTransactionsToCSV-BFpuIAXW.mjs";
+import { T as we, a as nt } from "../TransactionDetails-Duv1X9ec.mjs";
 import fe from "@mui/material/Card";
 import be from "@mui/material/CardContent";
-import { S as ge } from "../StatusBar-BK_uYHAB.mjs";
-import { S as De } from "../SingleSegmentDonut-BgbLgwHi.mjs";
-import { u as ot, b as at } from "../CategorySelectorDrawer-DqJK_rrL.mjs";
+import { S as ge } from "../StatusBar-CPfSXe80.mjs";
+import { S as De } from "../SingleSegmentDonut-PsRQPkmV.mjs";
+import { u as ot, b as at } from "../CategorySelectorDrawer-DqDAA_5I.mjs";
 import Ee from "@mui/material/CardHeader";
 import { subDays as rt } from "date-fns/subDays";
 import st from "@mui/material/IconButton";
-import { M as it } from "../ManageIncome-NpXHhO1n.mjs";
+import { M as it } from "../ManageIncome-D_qVX5dN.mjs";
 const ct = E(() => {
   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 })
+      /* @__PURE__ */ e(_, { bold: !0, variant: "Body", children: T(i, "0,0") }),
+      /* @__PURE__ */ e(_, { color: "secondary", variant: "Small", children: t.projected_income })
     ] }),
-    /* @__PURE__ */ e(y, { bold: !0, justifyContent: "center", variant: "Body", children: "-" }),
+    /* @__PURE__ */ e(_, { 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(_, { bold: !0, variant: "Body", children: T(o, "0,0") }),
+      /* @__PURE__ */ e(_, { color: "secondary", variant: "Small", children: t.budgeted })
     ] }),
-    /* @__PURE__ */ e(y, { bold: !0, justifyContent: "center", variant: "Body", children: "=" }),
+    /* @__PURE__ */ e(_, { 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(_, { bold: !0, variant: "Body", children: T(s, "0,0") }),
+      /* @__PURE__ */ e(_, { color: "secondary", variant: "Small", children: t.remaining })
     ] })
   ] });
 }), lt = E(
@@ -86,7 +86,7 @@ const ct = E(() => {
   };
   return /* @__PURE__ */ g(c.Fragment, { children: [
     /* @__PURE__ */ e(Te, { onClick: () => l(!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 }),
+    /* @__PURE__ */ e(_, { sx: { mx: 24, my: 16, textAlign: "center", whiteSpace: "wrap" }, variant: "Paragraph", children: o.recalculate_help }),
     /* @__PURE__ */ e(
       L,
       {
@@ -97,8 +97,8 @@ const ct = E(() => {
         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 })
+            /* @__PURE__ */ e(_, { bold: !0, variant: "Body", children: o.recalculate_description_top }),
+            /* @__PURE__ */ e(_, { variant: "ParagraphSmall", children: o.recalculate_description_bottom })
           ] }),
           /* @__PURE__ */ e(F, { bgcolor: "background.paper", children: /* @__PURE__ */ e(W, { children: d.map((u) => /* @__PURE__ */ e(lt, { category: u }, u.guid)) }) })
         ] })
@@ -113,11 +113,11 @@ const ct = E(() => {
   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(
+      /* @__PURE__ */ e(_, { children: R(
         s.add_description_top,
         T(r, "0,0")
       ) }),
-      /* @__PURE__ */ e(y, { children: R(s.add_description_bottom, o) })
+      /* @__PURE__ */ e(_, { children: R(s.add_description_bottom, o) })
     ] }),
     /* @__PURE__ */ e(
       He,
@@ -229,11 +229,11 @@ const ct = E(() => {
     u = Math.min(Oe, h, p);
   }
   return n && t <= 3 && (u = Math.min(u, 45)), { minRadius: Math.max(20, u * 0.6), maxRadius: u };
-}, yt = (t, o, i, s, a) => {
+}, _t = (t, o, i, s, a) => {
   const { maxRadius: n, minRadius: r } = bt(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), l = Math.max(...n), d = i ? yt(t.length, s, l, r, a) : Me(r, l);
+}, yt = (t, o, i = !1, s, a) => {
+  const n = o.map((m) => Math.max(m.transaction_total, m.amount)), r = Math.min(...n), l = Math.max(...n), d = i ? _t(t.length, s, l, r, a) : Me(r, l);
   return t.map((m) => ({
     ...m,
     radius: d(Math.max(m.transaction_total, m.amount))
@@ -278,7 +278,7 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
     description: p,
     radius: f,
     x: S,
-    y: _
+    y
   } = t, b = r < 400 ? -8 : -12;
   let A = b, v = b;
   f > G ? (A = -14, v = -45) : f > ue && (v = -32);
@@ -291,11 +291,11 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
         options: { offset: [0, 15] }
       }
     ]
-  }, $ = (U) => {
+  }, N = (U) => {
     (U.key === "Enter" || U.key === " ") && (U.preventDefault(), i(t));
   }, z = () => {
     a(!0);
-  }, N = () => {
+  }, $ = () => {
     a(!1);
   };
   return /* @__PURE__ */ g(
@@ -304,10 +304,10 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
       "aria-label": `${C} - ${p}`,
       className: "bubble",
       id: `bubble-${h}`,
-      onBlur: N,
+      onBlur: $,
       onClick: () => i(t),
       onFocus: z,
-      onKeyDown: $,
+      onKeyDown: N,
       onMouseEnter: () => a(!0),
       onMouseLeave: () => a(!1),
       role: "button",
@@ -315,7 +315,7 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
       tabIndex: 0,
       textAnchor: "middle",
       x: S,
-      y: _,
+      y,
       children: [
         /* @__PURE__ */ e("style", { children: `
           .bubble:focus,
@@ -332,7 +332,7 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
         /* @__PURE__ */ e(Ke, { open: s, slotProps: { popper: M }, title: I, children: /* @__PURE__ */ e("circle", { fill: d, id: `circle-${h}`, r: f }) }),
         /* @__PURE__ */ e("svg", { x: A, y: v, children: /* @__PURE__ */ e(P, { name: u, size: x, sx: { fill: m } }) }),
         f > G && /* @__PURE__ */ e(
-          y,
+          _,
           {
             bold: !0,
             component: "text",
@@ -344,7 +344,7 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
           }
         ),
         f > ue && /* @__PURE__ */ e(
-          y,
+          _,
           {
             bold: !0,
             component: "text",
@@ -356,7 +356,7 @@ function xt({ bubble: t, isDraggable: o, onClick: i = () => {
           }
         ),
         f <= G && f > ue && /* @__PURE__ */ e(
-          y,
+          _,
           {
             component: "text",
             id: `budget-description-${h}-2`,
@@ -384,12 +384,12 @@ const vt = ({
     if (u) {
       const p = u.nodes(), f = new Map(p.map((S) => [S.guid, S]));
       h.forEach((S) => {
-        const _ = f.get(S.guid);
-        _ && Object.assign(S, {
-          vx: _.vx,
-          vy: _.vy,
-          x: _.x,
-          y: _.y
+        const y = f.get(S.guid);
+        y && Object.assign(S, {
+          vx: y.vx,
+          vy: y.vy,
+          x: y.x,
+          y: y.y
         });
       });
     }
@@ -402,7 +402,7 @@ const vt = ({
   }, []), c.useEffect(() => {
     const u = r.current;
     if (!u) return;
-    const C = u.nodes(), h = o > 0 && o < 450 || t > 0 && t < 300, p = _t(C, d, h, t, o);
+    const C = u.nodes(), h = o > 0 && o < 450 || t > 0 && t < 300, p = yt(C, d, h, t, o);
     u.nodes(p), ht(u, t, o), i && setTimeout(() => {
       pt(u);
     }, 0), n([...p]);
@@ -412,7 +412,7 @@ const vt = ({
   onConnectAccountsClick: o,
   createBudgetOnClick: i
 }) => {
-  const { recalculateBudgets: s } = D(), { spendCategories: a } = K(), { budgets: n } = w(), { availableWidth: r } = ne(), { isMobile: l } = ie(r), d = t && l, [m, u] = c.useState(!1), [C, h] = c.useState(!1), [p, f] = c.useState(!1), S = c.useMemo(() => [...a.filter((b) => b.totalAverageAmount > 0)], [a]), _ = async () => {
+  const { recalculateBudgets: s } = D(), { spendCategories: a } = K(), { budgets: n } = w(), { availableWidth: r } = ne(), { isMobile: l } = ie(r), d = t && l, [m, u] = c.useState(!1), [C, h] = c.useState(!1), [p, f] = c.useState(!1), S = c.useMemo(() => [...a.filter((b) => b.totalAverageAmount > 0)], [a]), y = async () => {
     f(!0);
     const { data: b, isSuccess: A } = await s(S);
     f(!1), A ? (b.length === 0 && h(!0), u(!1)) : u(!0);
@@ -424,7 +424,7 @@ const vt = ({
       icon: "error",
       iconColor: "#4D4D4D",
       onClick: (b) => {
-        b === "primary" ? _() : i();
+        b === "primary" ? y() : i();
       },
       primaryButton: n.autogenerate_budgets_error_primary_button,
       secondaryButton: n.zero_state_generate_budgets_secondary_button,
@@ -470,7 +470,7 @@ const vt = ({
       icon: "bubble_chart",
       iconColor: "#1A1A1A",
       onClick: (b) => {
-        b === "primary" ? _() : i();
+        b === "primary" ? y() : i();
       },
       primaryButton: n.empty_state_primary_button,
       secondaryButton: t ? void 0 : n.empty_state_secondary_button,
@@ -504,7 +504,7 @@ const vt = ({
         budget_category: b.category.name,
         click_type: "bubble"
       });
-    }, _ = () => {
+    }, y = () => {
       p(!0), r(k.ACCOUNTS_CLICK_CONNECT);
     };
     return /* @__PURE__ */ g(
@@ -518,7 +518,7 @@ const vt = ({
             {
               createBudgetOnClick: t,
               isMiniWidget: s,
-              onConnectAccountsClick: _
+              onConnectAccountsClick: y
             }
           ) : /* @__PURE__ */ e(
             At,
@@ -566,12 +566,12 @@ const vt = ({
       }
     ),
     !s && /* @__PURE__ */ g(F, { 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 })
+      /* @__PURE__ */ e(_, { bold: !0, color: o < 0 ? "error.main" : "success.main", children: T(Math.abs(o), "0,0") }),
+      /* @__PURE__ */ e(_, { children: o < 0 ? t.overspent_in_budgets : t.left_in_budgets })
     ] })
   ] });
 }, Dt = (t) => {
-  const o = ee(), { onEvent: i } = X(), { visibleAccounts: s } = pe(), { detailedBudgets: a, isDataLoaded: n, loadBudgetData: r, setTheme: l } = D(), { budgets: d, common: m } = w(), { isInitialized: u, selectedAccounts: C, setSelectedAccounts: h } = oe(), { reloadCategoryTotals: p } = K(), f = Ye(), S = a.length === 0, [_, b] = c.useState(!1);
+  const o = ee(), { onEvent: i } = X(), { visibleAccounts: s } = pe(), { detailedBudgets: a, isDataLoaded: n, loadBudgetData: r, setTheme: l } = D(), { budgets: d, common: m } = w(), { isInitialized: u, selectedAccounts: C, setSelectedAccounts: h } = oe(), { reloadCategoryTotals: p } = K(), f = Ye(), S = a.length === 0, [y, b] = c.useState(!1);
   c.useEffect(() => {
     n || r().finally();
   }, []), c.useEffect(() => {
@@ -610,7 +610,7 @@ const vt = ({
           L,
           {
             ariaLabelClose: m.close_aria,
-            isOpen: _,
+            isOpen: y,
             onClose: () => b(!1),
             title: d.add_new_title,
             children: /* @__PURE__ */ e(Ie, { onRecalculateBudgets: v })
@@ -636,15 +636,15 @@ const vt = ({
   return /* @__PURE__ */ e(fe, { sx: { mt: 24, mx: 24 }, children: /* @__PURE__ */ e(be, { children: /* @__PURE__ */ g(B, { alignItems: "center", gap: 16, children: [
     /* @__PURE__ */ e(H, { categoryGuid: a, size: 56 }),
     /* @__PURE__ */ e(je, { children: `${T(r, "0,0")} / ${T(o, "0,0")}` }),
-    /* @__PURE__ */ e(y, { bold: !0, variant: "XSmall", children: s }),
+    /* @__PURE__ */ e(_, { bold: !0, variant: "XSmall", children: s }),
     /* @__PURE__ */ e(ge, { data: l, height: 10 })
   ] }) }) });
 }, Et = E(() => {
   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 })
+    /* @__PURE__ */ e(_, { bold: !0, color: "secondary", variant: "Small", children: t.zero_state_no_sub_budgets }),
+    /* @__PURE__ */ e(_, { color: "text.secondary", variant: "XSmall", children: t.zero_state_no_sub_budgets_description })
   ] });
 }), It = E(({ budget: t }) => {
   const {
@@ -659,8 +659,8 @@ const vt = ({
     /* @__PURE__ */ e(
       Z,
       {
-        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(B, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(_, { bold: !0, variant: "Body", children: t.category.name }) }),
+        secondary: /* @__PURE__ */ e(B, { component: "span", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ e(_, { fontWeight: 400, variant: "Body", children: `
                   ${T(n, "0,0")} / 
                   ${T(o, "0,0")}
                 ` }) })
@@ -677,14 +677,14 @@ const vt = ({
   }, []);
   const S = () => {
     a(t.guid), d(!0);
-  }, _ = async () => {
+  }, y = async () => {
     p && Number(C) > 0 && (await r(p, Number(C), o.guid), u(!1), d(!1), f(void 0));
   };
   return /* @__PURE__ */ g(F, { 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 })
+        /* @__PURE__ */ e(_, { 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" } })
     ] }) }) }) }),
@@ -706,7 +706,7 @@ const vt = ({
         disablePrimaryButton: Number(C) <= 0,
         isOpen: m,
         onClose: () => u(!1),
-        onPrimaryAction: _,
+        onPrimaryAction: y,
         primaryText: i.add_save_button,
         children: /* @__PURE__ */ e(
           ce,
@@ -720,9 +720,9 @@ const vt = ({
     )
   ] });
 }), Mt = E(({ budget: t }) => {
-  const { category: o, subBudgets: i } = t, { budgets: s, common: a } = w(), { deleteBudget: n, selectedSubBudget: r, setSelectedSubBudget: l, updateBudget: d } = D(), { filter: m, setFilter: u } = ae(), [C, h] = c.useState(!1), [p, f] = c.useState(!1), [S, _] = c.useState("");
+  const { category: o, subBudgets: i } = t, { budgets: s, common: a } = w(), { deleteBudget: n, selectedSubBudget: r, setSelectedSubBudget: l, updateBudget: d } = D(), { filter: m, setFilter: u } = ae(), [C, h] = c.useState(!1), [p, f] = c.useState(!1), [S, y] = c.useState("");
   c.useEffect(() => {
-    r && (_(`${r.amount}`), u({
+    r && (y(`${r.amount}`), u({
       ...m,
       custom: (x) => x.category_guid === r.category_guid
     }));
@@ -780,7 +780,7 @@ const vt = ({
             {
               amount: S,
               categoryName: r.category.name,
-              onAmountChanged: _
+              onAmountChanged: y
             }
           )
         }
@@ -795,7 +795,7 @@ const vt = ({
           primaryColor: "error",
           primaryText: "Delete",
           secondaryColor: "secondary",
-          children: /* @__PURE__ */ e(y, { variant: "Paragraph", children: R(s.delete_description, r.category.name) })
+          children: /* @__PURE__ */ e(_, { variant: "Paragraph", children: R(s.delete_description, r.category.name) })
         }
       )
     ] })
@@ -805,7 +805,7 @@ const vt = ({
     sortedTransactions: m,
     sortedTransactionsWithSplits: u,
     tags: C
-  } = ae(), [h, p] = c.useState(0), [f, S] = c.useState(""), _ = c.useMemo(
+  } = ae(), [h, p] = c.useState(0), [f, S] = c.useState(""), y = c.useMemo(
     () => m.find((x) => x.guid === f),
     [f, m]
   ), b = (x, I) => {
@@ -847,10 +847,10 @@ const vt = ({
         L,
         {
           ariaLabelClose: a.close_aria,
-          isOpen: !!_,
+          isOpen: !!y,
           onClose: () => S(""),
           title: s.details_transaction_drawer,
-          children: _ && /* @__PURE__ */ e(nt, { transaction: _ })
+          children: y && /* @__PURE__ */ e(nt, { transaction: y })
         }
       )
     ] })
@@ -864,7 +864,7 @@ const vt = ({
     setAlert: l,
     setSelectedBudget: d,
     updateBudget: m
-  } = D(), { setFilter: u } = ae(), [C, h] = c.useState(!1), [p, f] = c.useState(!1), [S, _] = c.useState(!1), [b, A] = c.useState("");
+  } = D(), { setFilter: u } = ae(), [C, h] = c.useState(!1), [p, f] = c.useState(!1), [S, y] = c.useState(!1), [b, A] = c.useState("");
   c.useEffect(() => {
     n && !r && (A(`${n.amount}`), h(!0), u({
       accounts: t,
@@ -880,7 +880,7 @@ const vt = ({
       percentage: n.category.totalAmount / Number(b) * 100
     }), l(R(o.alert_budget_updated, n.category.name)));
   }, x = async () => {
-    n && (await a(n.guid), l(R(o.alert_budget_deleted, n.category.name))), _(!1), I();
+    n && (await a(n.guid), l(R(o.alert_budget_deleted, n.category.name))), y(!1), I();
   }, I = () => {
     h(!1), setTimeout(() => {
       d(void 0);
@@ -895,7 +895,7 @@ const vt = ({
           isOpen: C,
           onClose: I,
           onPrimaryAction: () => f(!0),
-          onSecondaryAction: () => _(!0),
+          onSecondaryAction: () => y(!0),
           primaryText: o.details_edit_button,
           secondaryColor: "error",
           secondaryText: o.details_delete_button,
@@ -927,12 +927,12 @@ const vt = ({
         {
           copy: { close_aria: i.close_aria, title: o.delete_title },
           isOpen: S,
-          onClose: () => _(!1),
+          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(_, { variant: "Paragraph", children: R(o.delete_description, n.category.name) })
         }
       )
     ] });
@@ -952,20 +952,20 @@ const vt = ({
       Z,
       {
         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: `
+          /* @__PURE__ */ e(_, { bold: !0, variant: "Body", children: t.category.name }),
+          /* @__PURE__ */ e(_, { fontWeight: 400, variant: "Body", children: `
                   ${T(m, "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: l > 100, color: a, variant: "XSmall", children: r })
+          /* @__PURE__ */ e(_, { variant: "XSmall", children: `${d.length} Sub-budgets` }),
+          /* @__PURE__ */ e(_, { bold: l > 100, color: a, variant: "XSmall", children: r })
         ] })
       }
     )
   ] }) });
-}, $t = E(() => {
+}, Nt = E(() => {
   const { onEvent: t } = X(), { budgets: o } = w(), { detailedBudgets: i, setSelectedBudget: s } = D(), a = (n) => {
     s(n), t(k.BUDGETS_CLICK_BUDGET_CATEGORY, {
       budget_category: n.category.name,
@@ -979,9 +979,9 @@ const vt = ({
       /* @__PURE__ */ e(re, {})
     ] }, n.guid)) }) })
   ] });
-}), Nt = E(() => {
+}), $t = E(() => {
   const t = ee(), { onEvent: o } = X(), { visibleAccounts: i } = pe(), { budgets: s, common: a, recurring: n } = w(), { incomeCategories: r, spendCategories: l } = K(), { detailedBudgets: d, totalBudgeted: m } = D(), { incomeTotal: u } = te(), { setFilter: C } = ae(), [h, p] = c.useState(!1), [f, S] = c.useMemo(() => {
-    const v = l.reduce(($, z) => $ + z.totalAmount, 0);
+    const v = l.reduce((N, z) => N + z.totalAmount, 0);
     let x = v / m;
     x > 1 && (x = 1);
     let I = t.palette.success.main;
@@ -993,9 +993,9 @@ const vt = ({
       }
     ];
     return [v, M];
-  }, [d, l]), [_, b] = c.useMemo(() => {
+  }, [d, l]), [y, b] = c.useMemo(() => {
     const v = Math.abs(
-      r.reduce((M, $) => M + $.totalAmount, 0)
+      r.reduce((M, N) => M + N.totalAmount, 0)
     );
     let x = v / u;
     x > 1 && (x = 1);
@@ -1019,9 +1019,9 @@ const vt = ({
     /* @__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__ */ 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(_, { bold: !0, sx: { mb: 8 }, variant: "Body", children: s.spending_title }),
         /* @__PURE__ */ e(ge, { data: S, height: 16 }),
-        /* @__PURE__ */ e(y, { variant: "Small", children: R(
+        /* @__PURE__ */ e(_, { variant: "Small", children: R(
           s.spending_description,
           T(f, "0,0"),
           T(m, "0,0")
@@ -1029,7 +1029,7 @@ const vt = ({
       ] }),
       /* @__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__ */ e(_, { bold: !0, variant: "Body", children: s.income_title }),
           /* @__PURE__ */ e(
             st,
             {
@@ -1041,9 +1041,9 @@ const vt = ({
           )
         ] }),
         /* @__PURE__ */ e(ge, { data: b, height: 16 }),
-        /* @__PURE__ */ e(y, { variant: "Small", children: R(
+        /* @__PURE__ */ e(_, { variant: "Small", children: R(
           s.income_description,
-          T(_, "0,0"),
+          T(y, "0,0"),
           T(u, "0,0")
         ) })
       ] })
@@ -1065,27 +1065,27 @@ const vt = ({
     dateRange: p,
     isDataLoaded: f,
     loadBudgetData: S,
-    setDateRange: _,
+    setDateRange: y,
     setAlert: b,
     setTheme: A,
     detailedBudgets: v
-  } = D(), { setDateRange: x } = te(), { reloadCategoryTotals: I } = K(), { isSmallTablet: M, isMobile: $, isSmallMobile: z } = ie(), N = M || $ || z, [U, le] = c.useState(!1);
+  } = D(), { setDateRange: x } = te(), { reloadCategoryTotals: I } = K(), { isSmallTablet: M, isMobile: N, isSmallMobile: z } = ie(), $ = M || N || z, [U, le] = c.useState(!1);
   c.useEffect(() => {
     A(i), S().finally(() => {
       s(k.BUDGETS_VIEW), a?.("BubbleBudgetsWidget");
     });
-  }, []), c.useEffect(() => (C(n), _({ start: J(q()), end: me(q()) }), () => {
-    _({ start: J(q()), end: me(q()) });
+  }, []), c.useEffect(() => (C(n), y({ start: J(q()), end: me(q()) }), () => {
+    y({ start: J(q()), end: me(q()) });
   }), [n]), c.useEffect(() => {
     d && (u(p.start, p.end), I(m, p.start, p.end).finally(), x(p));
   }, [d, m, p]);
-  const Le = (_e) => {
-    _({ start: _e[0] || /* @__PURE__ */ new Date(), end: _e[1] || /* @__PURE__ */ new Date() });
-  }, $e = () => {
+  const Le = (ye) => {
+    y({ start: ye[0] || /* @__PURE__ */ new Date(), end: ye[1] || /* @__PURE__ */ new Date() });
+  }, Ne = () => {
     s(k.BUDGETS_CLICK_FILTER);
-  }, ye = () => {
+  }, _e = () => {
     le(!0), s(k.BUDGETS_CLICK_ADD);
-  }, Ne = () => {
+  }, $e = () => {
     le(!1);
   }, Pe = qe(p.end, J(/* @__PURE__ */ new Date()));
   return !d || !f ? /* @__PURE__ */ e(he, {}) : /* @__PURE__ */ g(
@@ -1096,7 +1096,7 @@ const vt = ({
         {
           iconName: "add",
           label: r.add_title,
-          onClick: ye
+          onClick: _e
         }
       ],
       calendarActions: {
@@ -1104,7 +1104,7 @@ const vt = ({
         shouldDisableNext: Pe,
         shouldDisablePicker: !0
       },
-      onAccountsFilterClick: $e,
+      onAccountsFilterClick: Ne,
       onBackClick: t,
       sx: o,
       title: r.budgets_title,
@@ -1112,19 +1112,19 @@ const vt = ({
         /* @__PURE__ */ g(
           B,
           {
-            direction: N ? "column" : "row",
+            direction: $ ? "column" : "row",
             height: "100%",
             sx: { justifyContent: "center" },
             width: "100%",
             children: [
-              /* @__PURE__ */ e(B, { height: N ? 450 : "calc(100dvh - 150px)", children: /* @__PURE__ */ e(
+              /* @__PURE__ */ e(B, { height: $ ? 450 : "calc(100dvh - 150px)", children: /* @__PURE__ */ e(
                 Re,
                 {
-                  createBudgetOnClick: ye,
-                  height: N ? 450 : 800,
+                  createBudgetOnClick: _e,
+                  height: $ ? 450 : 800,
                   isDraggable: !0,
                   shouldShowZeroState: v.length === 0,
-                  unavailableWidth: N ? 0 : ve
+                  unavailableWidth: $ ? 0 : ve
                 }
               ) }),
               v.length !== 0 && /* @__PURE__ */ g(
@@ -1133,10 +1133,10 @@ const vt = ({
                   gap: 24,
                   height: "100%",
                   sx: { mr: 24, mt: 48 },
-                  width: N ? "100%" : ve,
+                  width: $ ? "100%" : ve,
                   children: [
-                    /* @__PURE__ */ e(Nt, {}),
-                    /* @__PURE__ */ e($t, {})
+                    /* @__PURE__ */ e($t, {}),
+                    /* @__PURE__ */ e(Nt, {})
                   ]
                 }
               )
@@ -1151,7 +1151,7 @@ const vt = ({
             isOpen: U,
             onClose: () => le(!1),
             title: r.add_new_title,
-            children: /* @__PURE__ */ e(Ie, { onRecalculateBudgets: Ne })
+            children: /* @__PURE__ */ e(Ie, { onRecalculateBudgets: $e })
           }
         ),
         /* @__PURE__ */ e(