@mx-cartographer/experiences 7.0.52-alpha.mega7 → 7.0.52-alpha.mega8

package/dist/budgets/index.es.js

@@ -8,9 +8,9 @@ import C from "@mui/material/Stack";
 import Q from "@mui/material/styles/useTheme";
 import { Text as y, CategoryIcon as H, Icon as N, H1 as ze, H3 as xe } from "@mxenabled/mxui";
 import W from "@mui/material/List";
-import { u as w, i as D, j as ee, m as j, p as te, g as X, b as ne, h as oe, a as Ue, d as Ae } from "../hooks-CE2TKk4a.mjs";
+import { u as w, i as D, j as ee, m as j, p as te, g as X, b as ne, h as oe, a as Ue, d as ve } from "../hooks-CE2TKk4a.mjs";
 import { f as T } from "../NumberFormatting-CtWHhyBX.mjs";
-import ve from "@mui/material/Button";
+import Ae from "@mui/material/Button";
 import ae from "@mui/material/Divider";
 import K from "@mui/material/ListItem";
 import re from "@mui/material/ListItemAvatar";
@@ -84,7 +84,7 @@ const it = I(() => {
     await n(m), c(!1), o(a.alert_recalculated_budgets), t?.();
   };
   return /* @__PURE__ */ u(l.Fragment, { children: [
-    /* @__PURE__ */ e(ve, { onClick: () => c(!0), sx: { mt: 24, mx: 24 }, variant: "text", children: a.recalculate_button }),
+    /* @__PURE__ */ e(Ae, { onClick: () => c(!0), sx: { mt: 24, mx: 24 }, variant: "text", children: a.recalculate_button }),
     /* @__PURE__ */ e(y, { sx: { mx: 24, my: 16, textAlign: "center", whiteSpace: "wrap" }, variant: "Paragraph", children: a.recalculate_help }),
     /* @__PURE__ */ e(
       k,
@@ -278,11 +278,11 @@ function Bt({ bubble: t, isDraggable: a, onClick: i = () => {
     radius: p,
     x: b,
     y: S
-  } = t, h = o < 320 ? -8 : -12;
-  let x = h, A = h;
-  p > P ? (x = -14, A = -45) : p > de && (A = -32);
-  let v = 32;
-  p <= P && (v = o < 320 ? 16 : 24);
+  } = t, h = o < 400 ? -8 : -12;
+  let x = h, v = h;
+  p > P ? (x = -14, v = -45) : p > de && (v = -32);
+  let A = 32;
+  p <= P && (A = o < 400 ? 16 : 24);
   const B = `${t.category.name}: ${_}`, E = {
     modifiers: [
       {
@@ -314,7 +314,7 @@ function Bt({ bubble: t, isDraggable: a, onClick: i = () => {
             children: /* @__PURE__ */ e("circle", { fill: c, id: `circle-${f}`, r: p })
           }
         ),
-        /* @__PURE__ */ e("svg", { x, y: A, children: /* @__PURE__ */ e(N, { name: g, size: v, sx: { fill: m } }) }),
+        /* @__PURE__ */ e("svg", { x, y: v, children: /* @__PURE__ */ e(N, { name: g, size: A, sx: { fill: m } }) }),
         p > P && /* @__PURE__ */ e(
           y,
           {
@@ -392,7 +392,7 @@ const xt = ({
     const d = r.current;
     d && (i && !c.current ? (gt(d), c.current = !0) : !i && c.current && (c.current = !1));
   }, [i, n.length]), /* @__PURE__ */ e("svg", { height: t, style: { overflow: "visible" }, width: Math.abs(a), children: n.map((d) => /* @__PURE__ */ e(Bt, { bubble: d, isDraggable: i, onClick: s }, d.guid)) });
-}, At = I(xt), vt = ({
+}, vt = I(xt), At = ({
   isMiniWidget: t = !1,
   onConnectAccountsClick: a,
   createBudgetOnClick: i
@@ -420,7 +420,7 @@ const xt = ({
           width: 208,
           ...n && { mt: 16, button: { height: "max-content" } }
         },
-        ...n && { mt: 0 }
+        ...n && { mt: 0, svg: { height: 32, width: 32 } }
       }
     }
   ) : /* @__PURE__ */ e(je, { children: m ? /* @__PURE__ */ e(
@@ -444,7 +444,8 @@ const xt = ({
           height: 100,
           ...n && { mt: 16, button: { height: "max-content" } }
         },
-        padding: t ? 5 : 0
+        padding: t ? 5 : 0,
+        ...n && { svg: { height: 32, width: 32 } }
       }
     }
   ) : /* @__PURE__ */ e(
@@ -483,9 +484,9 @@ const xt = ({
     shouldShowZeroState: n,
     unavailableWidth: o = 24
   }) => {
-    const { onEvent: r } = X(), { setSelectedBudget: c } = D(), { isLoadingCategoryTotals: m } = j(), { isInitialized: g } = ne(), { accounts: d } = w(), { availableWidth: f } = te(), { isMobile: _ } = ge(), [p, b] = l.useState(!1), S = l.useMemo(() => f - o, [f]), h = (A) => {
-      c(A), r(L.BUDGETS_CLICK_BUDGET_CATEGORY, {
-        budget_category: A.category.name,
+    const { onEvent: r } = X(), { setSelectedBudget: c } = D(), { isLoadingCategoryTotals: m } = j(), { isInitialized: g } = ne(), { accounts: d } = w(), { availableWidth: f } = te(), { isMobile: _ } = ge(), [p, b] = l.useState(!1), S = l.useMemo(() => f - o, [f]), h = (v) => {
+      c(v), r(L.BUDGETS_CLICK_BUDGET_CATEGORY, {
+        budget_category: v.category.name,
         click_type: "bubble"
       });
     }, x = () => {
@@ -493,14 +494,14 @@ const xt = ({
     };
     return m ? /* @__PURE__ */ e(C, { alignItems: "center", height: a, justifyContent: "center", width: Math.abs(S), children: /* @__PURE__ */ e(G, {}) }) : /* @__PURE__ */ u(F, { ml: n || _ ? 0 : 24, sx: { alignSelf: "center" }, children: [
       n || !g ? /* @__PURE__ */ e(
-        vt,
+        At,
         {
           createBudgetOnClick: t,
           isMiniWidget: s,
           onConnectAccountsClick: x
         }
       ) : /* @__PURE__ */ e(
-        At,
+        vt,
         {
           height: a,
           isDraggable: i,
@@ -530,7 +531,7 @@ const xt = ({
   }, [n]);
   const r = l.useMemo(() => {
     const c = o.current ?? n;
-    return c > 0 ? Math.round(Math.max(140, Math.min(450, c * 0.8))) - 40 : 450;
+    return c > 0 ? Math.round(Math.max(120, Math.min(450, c * 0.8))) - 40 : 450;
   }, [n]);
   return /* @__PURE__ */ u(C, { sx: { height: "100%", justifyContent: "space-between" }, children: [
     /* @__PURE__ */ e(
@@ -550,7 +551,7 @@ const xt = ({
 }, wt = (t) => {
   const a = Q(), { onEvent: i } = X(), { detailedBudgets: s, isDataLoaded: n, loadBudgetData: o, setTheme: r } = D(), { budgets: c, common: m } = w(), { isCopyLoaded: g, isInitialized: d, selectedAccounts: f } = ne(), { reloadCategoryTotals: _ } = j(), p = Ve(), b = s.length === 0, [S, h] = l.useState(!1), x = () => {
     h(!0), i(L.BUDGETS_CLICK_ADD);
-  }, A = () => h(!1);
+  }, v = () => h(!1);
   return l.useEffect(() => {
     r(a);
   }, [a]), l.useEffect(() => {
@@ -562,7 +563,7 @@ const xt = ({
   }, [d, f]), g ? /* @__PURE__ */ u(
     Ye,
     {
-      contentStyles: { height: "calc(100% - 52px)" },
+      contentStyles: { height: "calc(100% - 52px)", ":last-child": { pb: 16 } },
       primaryCtaLabel: b ? c.get_started_cta : c.details_cta,
       sx: { height: "100%" },
       title: c.budgets_title,
@@ -584,7 +585,7 @@ const xt = ({
             isOpen: S,
             onClose: () => h(!1),
             title: c.add_new_title,
-            children: /* @__PURE__ */ e(Ie, { onRecalculateBudgets: A })
+            children: /* @__PURE__ */ e(Ie, { onRecalculateBudgets: v })
           }
         )
       ]
@@ -642,8 +643,8 @@ const xt = ({
   const { budgets: i, common: s } = w(), { setExpandedGuid: n, setOnSelect: o } = nt(), { addBudget: r } = D(), [c, m] = l.useState(!1), [g, d] = l.useState(!1), [f, _] = l.useState(""), [p, b] = l.useState(void 0);
   l.useEffect(() => {
     o((x) => {
-      const A = t.subCategories.find((v) => v.guid === x);
-      A && (b(A), _(`${A.currentAmount === 0 ? "" : A.currentAmount}`), d(!0));
+      const v = t.subCategories.find((A) => A.guid === x);
+      v && (b(v), _(`${v.currentAmount === 0 ? "" : v.currentAmount}`), d(!0));
     });
   }, []);
   const S = () => {
@@ -703,9 +704,9 @@ const xt = ({
       ...r,
       amount: Number(S)
     });
-  }, A = async () => {
-    r && await o(r.guid), b(!1), v();
-  }, v = () => {
+  }, v = async () => {
+    r && await o(r.guid), b(!1), A();
+  }, A = () => {
     d({
       ...g,
       custom: (B) => B.category_guid === t.category_guid || B.top_level_category_guid === t.category_guid
@@ -724,7 +725,7 @@ const xt = ({
       {
         ariaLabelClose: n.close_aria,
         isOpen: !!r,
-        onClose: v,
+        onClose: A,
         onPrimaryAction: () => _(!0),
         onSecondaryAction: () => b(!0),
         primaryText: s.details_edit_button,
@@ -762,7 +763,7 @@ const xt = ({
           copy: { close_aria: n.close_aria, title: s.delete_title },
           isOpen: p,
           onClose: () => b(!1),
-          onPrimaryAction: A,
+          onPrimaryAction: v,
           primaryColor: "error",
           primaryText: "Delete",
           secondaryColor: "secondary",
@@ -781,9 +782,9 @@ const xt = ({
     [b, g]
   ), x = (B, E) => {
     p(E);
-  }, A = () => {
+  }, v = () => {
     et(d, f), i(s.alert_csv_downloaded);
-  }, v = g.length > 0 && !a && (r || m && !c);
+  }, A = g.length > 0 && !a && (r || m && !c);
   return /* @__PURE__ */ u(C, { gap: 24, children: [
     /* @__PURE__ */ e(Re, { budget: t }),
     /* @__PURE__ */ u(C, { children: [
@@ -802,10 +803,10 @@ const xt = ({
         }
       ),
       _ === 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,
+        A && /* @__PURE__ */ e(C, { direction: "row", justifyContent: "right", mb: -24, mr: 8, mt: 8, zIndex: 1, children: /* @__PURE__ */ e(
+          Ae,
           {
-            onClick: A,
+            onClick: v,
             startIcon: /* @__PURE__ */ e(N, { name: "ios_share" }),
             variant: "text",
             children: o.export_csv_btn
@@ -835,16 +836,16 @@ const xt = ({
     setAlert: c,
     setSelectedBudget: m,
     updateBudget: g
-  } = D(), { setFilter: d } = oe(), [f, _] = l.useState(!1), [p, b] = l.useState(!1), [S, h] = l.useState(!1), [x, A] = l.useState("");
+  } = D(), { setFilter: d } = oe(), [f, _] = l.useState(!1), [p, b] = l.useState(!1), [S, h] = l.useState(!1), [x, v] = l.useState("");
   l.useEffect(() => {
-    o && !r && (A(`${o.amount}`), _(!0), d({
+    o && !r && (v(`${o.amount}`), _(!0), d({
       accounts: t,
       dateRange: s,
       custom: (R) => R.category_guid === o.category_guid || R.top_level_category_guid === o.category_guid,
       showSplits: !0
     }));
   }, [o]);
-  const v = async () => {
+  const A = async () => {
     o && (await g({
       ...o,
       amount: Number(x),
@@ -881,14 +882,14 @@ const xt = ({
           disablePrimaryButton: Number(x) <= 0,
           isOpen: p,
           onClose: () => b(!1),
-          onPrimaryAction: v,
+          onPrimaryAction: A,
           primaryText: a.edit_save_button,
           children: /* @__PURE__ */ e(
             se,
             {
               amount: x,
               categoryName: o.category.name,
-              onAmountChanged: A
+              onAmountChanged: v
             }
           )
         }
@@ -951,9 +952,9 @@ const xt = ({
     ] }, o.guid)) }) })
   ] });
 }), Nt = I(() => {
-  const t = Q(), { onEvent: a } = X(), { visibleAccounts: i } = Ae(), { budgets: s, common: n, recurring: o } = w(), { incomeCategories: r, spendCategories: c } = j(), { detailedBudgets: m, totalBudgeted: g } = D(), { incomeTotal: d } = ee(), { setFilter: f } = oe(), [_, p] = l.useState(!1), [b, S] = l.useMemo(() => {
-    const v = c.reduce((z, ie) => z + ie.totalAmount, 0);
-    let B = v / g;
+  const t = Q(), { onEvent: a } = X(), { visibleAccounts: i } = ve(), { budgets: s, common: n, recurring: o } = w(), { incomeCategories: r, spendCategories: c } = j(), { detailedBudgets: m, totalBudgeted: g } = D(), { incomeTotal: d } = ee(), { setFilter: f } = oe(), [_, p] = l.useState(!1), [b, S] = l.useMemo(() => {
+    const A = c.reduce((z, ie) => z + ie.totalAmount, 0);
+    let B = A / g;
     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);
@@ -963,12 +964,12 @@ const xt = ({
         percentage: `${B}`
       }
     ];
-    return [v, R];
+    return [A, R];
   }, [m, c]), [h, x] = l.useMemo(() => {
-    const v = Math.abs(
+    const A = Math.abs(
       r.reduce((R, z) => R + z.totalAmount, 0)
     );
-    let B = v / d;
+    let B = A / d;
     B > 1 && (B = 1);
     const E = [
       {
@@ -976,10 +977,10 @@ const xt = ({
         percentage: `${B}`
       }
     ];
-    return [v, E];
-  }, [r, d]), A = () => {
+    return [A, E];
+  }, [r, d]), v = () => {
     f({
-      accounts: i.map((v) => v.guid),
+      accounts: i.map((A) => A.guid),
       dateRange: {
         start: at(/* @__PURE__ */ new Date(), 90),
         end: /* @__PURE__ */ new Date()
@@ -1005,7 +1006,7 @@ const xt = ({
             rt,
             {
               "aria-label": o.manage_income,
-              onClick: A,
+              onClick: v,
               sx: { p: 0 },
               children: /* @__PURE__ */ e(N, { color: "primary", name: "edit" })
             }
@@ -1031,17 +1032,17 @@ const xt = ({
     )
   ] });
 }), Be = 480, Rn = I(({ onBackClick: t, sx: a }) => {
-  const i = Q(), { onEvent: s } = X(), { visibleAccounts: n } = Ae(), { budgets: o, common: r } = w(), { isCopyLoaded: c, isInitialized: m, selectedAccounts: g, setDisplayedDate: d, setSelectedAccounts: f } = ne(), {
+  const i = Q(), { onEvent: s } = X(), { visibleAccounts: n } = ve(), { budgets: o, common: r } = w(), { isCopyLoaded: c, isInitialized: m, selectedAccounts: g, setDisplayedDate: d, setSelectedAccounts: f } = ne(), {
     alert: _,
     dateRange: p,
     isDataLoaded: b,
     loadBudgetData: S,
     setDateRange: h,
     setAlert: x,
-    setTheme: A,
-    detailedBudgets: v
+    setTheme: v,
+    detailedBudgets: A
   } = D(), { loadRepeatingTransactions: B, setDateRange: E } = ee(), { reloadCategoryTotals: R } = j(), { isSmallTablet: z, isMobile: ie, isSmallMobile: Le } = ge(), U = z || ie || Le, [ke, ce] = l.useState(!1);
-  l.useEffect(() => (A(i), f(n), h({ start: q(Z()), end: ue(Z()) }), s(L.BUDGETS_VIEW), () => {
+  l.useEffect(() => (v(i), f(n), h({ start: q(Z()), end: ue(Z()) }), s(L.BUDGETS_VIEW), () => {
     h({ start: q(Z()), end: ue(Z()) });
   }), []), l.useEffect(() => {
     f(n);
@@ -1093,11 +1094,11 @@ const xt = ({
                   createBudgetOnClick: fe,
                   height: U ? 450 : 800,
                   isDraggable: !0,
-                  shouldShowZeroState: v.length === 0,
+                  shouldShowZeroState: A.length === 0,
                   unavailableWidth: U ? 0 : Be
                 }
               ) }),
-              v.length !== 0 && /* @__PURE__ */ u(
+              A.length !== 0 && /* @__PURE__ */ u(
                 C,
                 {
                   gap: 24,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-cartographer/experiences",
-  "version": "7.0.52-alpha.mega7",
+  "version": "7.0.52-alpha.mega8",
   "description": "Library containing experience widgets",
   "author": "MX",
   "license": "MIT",