@mx-cartographer/experiences 8.2.0 → 8.2.1

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## [8.2.1] - 05-07-2026
+
+- **FIXED** - Widget scrolling behavior
+
 ## [8.2.0] - 05-05-2026
 
 - **UPDATED** - Moved all MobX stores into src/core/stores

package/dist/{WidgetContainer-DalWyz5A.mjs → WidgetContainer-CYcmwsSu.mjs}

@@ -32,18 +32,18 @@ import Me from "@mui/material/ButtonGroup";
 import Pe from "@mui/material/Tab";
 import Se from "@mui/material/Tabs";
 import Ee from "@mui/material/ToggleButton";
-import Le from "@mui/material/ToggleButtonGroup";
-import Ye from "@mui/material/styles/useTheme";
+import Ye from "@mui/material/ToggleButtonGroup";
+import Le from "@mui/material/styles/useTheme";
 import { u as Ae } from "./useAriaLive-MkYebyUR.mjs";
 import { D as Be } from "./Dialog-iLlBR8TG.mjs";
-import { D as Ne } from "./Drawer-XPaLYjiO.mjs";
+import { D as we } from "./Drawer-XPaLYjiO.mjs";
 import { u as le } from "./useScreenSize-CeFhWTt_.mjs";
 import { f as P, D as S } from "./DateFormats-HudZ3Bjs.mjs";
-import { L as Oe } from "./Loader-CxeBwuPG.mjs";
-import we from "@mui/material/useMediaQuery";
+import { L as Ne } from "./Loader-CxeBwuPG.mjs";
+import Oe from "@mui/material/useMediaQuery";
 import { A as oe } from "./Analytics-CzGzz_sE.mjs";
 const Ie = (n) => {
-  const { isDesktop: d, isMobile: a, isSmallTablet: m, isTablet: r } = le(n), i = we("(min-width:900px)"), _ = 24;
+  const { isDesktop: d, isMobile: a, isSmallTablet: m, isTablet: r } = le(n), i = Oe("(min-width:900px)"), _ = 24;
   let s = 48, y = 32, h = 0, c = "h1", R = !1;
   const o = a || m;
   r && !m ? (s = 24, y = 24, c = "h2") : o && (s = 8, y = 10, h = 10, c = "h3", R = !0);
@@ -79,7 +79,7 @@ const Ie = (n) => {
   shouldShrinkToIcon: r = !0,
   variant: i = "outlined"
 }) => {
-  const _ = Ye(), { isMobile: s } = le(), { announce: y, ariaLive: h } = Ae(), [c, R] = u.useState(m), [o, A] = u.useState(a.dateRangePickerCopy.dateRangeThisMonth), [C, N] = u.useState(c), [k, x] = u.useState(!1), [O, F] = u.useState(!0), [E, j] = u.useState(6), w = {
+  const _ = Le(), { isMobile: s } = le(), { announce: y, ariaLive: h } = Ae(), [c, R] = u.useState(m), [o, A] = u.useState(a.dateRangePickerCopy.dateRangeThisMonth), [C, w] = u.useState(c), [k, x] = u.useState(!1), [N, F] = u.useState(!0), [E, j] = u.useState(6), O = {
     buttons: [
       { ariaLabel: "3 Months", label: "3M", value: 3 },
       { ariaLabel: "6 Months", label: "6M", value: 6 },
@@ -94,7 +94,7 @@ const Ie = (n) => {
     ]
   };
   u.useEffect(() => {
-    R(m), N(m);
+    R(m), w(m);
   }, [m]), u.useEffect(() => {
     (i === "timeframebuttons" || i === "timeframetabs") && n.onRangeChanged(V());
   }, [E]);
@@ -120,15 +120,15 @@ const Ie = (n) => {
       b = [M(l, v), M(p, v)];
     }
     R(b), n.onRangeChanged(b);
-  }, L = () => {
+  }, Y = () => {
     R(C), F(
       o === a.dateRangePickerCopy.dateRangeThisMonth || o === a.dateRangePickerCopy.dateRangeLastMonth
     ), n.onRangeChanged(C);
   }, T = (t, l) => {
     t[1] = t[1] ?? t[0];
     const p = [t[0], t[1] ? xe(t[1]) : t[1]], f = P(p[0], S.MONTH_DAY_YEAR), b = P(p[1], S.MONTH_DAY_YEAR);
-    N(p), A(l), y(`${a.dateRangePickerCopy}: ${f} - ${b}`);
-  }, Y = (t) => {
+    w(p), A(l), y(`${a.dateRangePickerCopy}: ${f} - ${b}`);
+  }, L = (t) => {
     j(t);
   };
   return /* @__PURE__ */ g(re, { className: "mx-cmn-date-range-selector", m: 4, children: [
@@ -184,7 +184,7 @@ const Ie = (n) => {
                     sx: {
                       p: s ? 0 : 8
                     },
-                    children: O ? P(c[0], S.MONTH_YEAR) : /* @__PURE__ */ g("span", { children: [
+                    children: N ? P(c[0], S.MONTH_YEAR) : /* @__PURE__ */ g("span", { children: [
                       P(c[0], S.MONTH_DAY_YEAR),
                       " -",
                       " ",
@@ -206,18 +206,18 @@ const Ie = (n) => {
             }
           ),
           i === "timeframebuttons" && /* @__PURE__ */ e(
-            Le,
+            Ye,
             {
               "aria-label": a.dateRangeEditTitle,
               color: d,
               exclusive: !0,
               orientation: "horizontal",
               value: E,
-              children: w.buttons.map((t) => /* @__PURE__ */ e(
+              children: O.buttons.map((t) => /* @__PURE__ */ e(
                 Ee,
                 {
                   "aria-label": t.ariaLabel,
-                  onClick: () => Y(t.value),
+                  onClick: () => L(t.value),
                   sx: { width: 56 },
                   value: t.value,
                   children: t.label
@@ -230,11 +230,11 @@ const Ie = (n) => {
             Se,
             {
               indicatorColor: "primary",
-              onChange: (t, l) => Y(l),
+              onChange: (t, l) => L(l),
               textColor: "primary",
               value: E,
               variant: "fullWidth",
-              children: w.tabs.map((t) => /* @__PURE__ */ e(
+              children: O.tabs.map((t) => /* @__PURE__ */ e(
                 Pe,
                 {
                   label: /* @__PURE__ */ e(W, { bold: !0, variant: "body1", children: t.label }),
@@ -249,13 +249,13 @@ const Ie = (n) => {
       }
     ),
     k && s && /* @__PURE__ */ g(
-      Ne,
+      we,
       {
         ariaLabelClose: a.dateRangeCloseAria,
         isOpen: k,
         onClose: () => x(!1),
         onPrimaryAction: () => {
-          L(), x(!1);
+          Y(), x(!1);
         },
         primaryText: a.dateRangeEditApply,
         title: a.dateRangeEditTitle,
@@ -280,7 +280,7 @@ const Ie = (n) => {
         copy: { title: a.dateRangeEditTitle },
         isOpen: !0,
         onClose: () => x(!1),
-        onPrimaryAction: () => L(),
+        onPrimaryAction: () => Y(),
         primaryText: a.dateRangeEditApply,
         sx: {
           "& .MuiDialogContent-root": {
@@ -340,7 +340,7 @@ const Ie = (n) => {
       }
     );
   }
-), Lt = ne(
+), Yt = ne(
   ({
     actions: n,
     allowedAccountTypes: d,
@@ -358,28 +358,28 @@ const Ie = (n) => {
     sx: A = {},
     title: C = ""
   }) => {
-    const [N, { height: k, width: x }] = ge(), { onEvent: O } = fe(), {
+    const [w, { height: k, width: x }] = ge(), { onEvent: N } = fe(), {
       actionsFlex: F,
       containerSquareCorners: E,
       headerHeadingLevel: j,
-      headerPaddingBottom: w,
+      headerPaddingBottom: O,
       headerPaddingTop: V,
       headerPaddingX: I,
-      iconSize: L,
+      iconSize: Y,
       isCompact: T,
-      isDesktop: Y,
+      isDesktop: L,
       isViewportAbove900: t,
       slotSx: l
     } = Ie(x), { isCopyLoaded: p } = ie(), { common: f } = se(), {
       config: { display_widget_headings: b }
     } = be(), v = () => {
-      h && (h(), O(oe.WIDGET_BACK_CLICK));
+      h && (h(), N(oe.WIDGET_BACK_CLICK));
     };
     if (u.useEffect(() => {
-      O(oe.WIDGET_SIZE_CHANGED, { height: k, width: x });
+      N(oe.WIDGET_SIZE_CHANGED, { height: k, width: x });
     }, [k]), !p)
-      return /* @__PURE__ */ e(Oe, {});
-    const M = () => c && T && !t ? /* @__PURE__ */ e($, { color: "primary", onClick: c, sx: { p: 10 }, children: /* @__PURE__ */ e(D, { name: "menu_open", size: L, sx: { transform: "rotate(180deg)" } }) }) : h ? /* @__PURE__ */ e(
+      return /* @__PURE__ */ e(Ne, {});
+    const M = () => c && T && !t ? /* @__PURE__ */ e($, { color: "primary", onClick: c, sx: { p: 10 }, children: /* @__PURE__ */ e(D, { name: "menu_open", size: Y, sx: { transform: "rotate(180deg)" } }) }) : h ? /* @__PURE__ */ e(
       $,
       {
         "aria-label": f.back_to_dashboard,
@@ -401,9 +401,16 @@ const Ie = (n) => {
       {
         className: r,
         elevation: 1,
-        ref: N,
+        ref: w,
         square: E,
-        sx: { borderBottomLeftRadius: 0, borderBottomRightRadius: 0, margin: 0, ...A },
+        sx: {
+          borderBottomLeftRadius: 0,
+          borderBottomRightRadius: 0,
+          margin: 0,
+          overflowY: "auto",
+          height: "100%",
+          ...A
+        },
         children: /* @__PURE__ */ g(de, { children: [
           /* @__PURE__ */ g(
             B,
@@ -413,7 +420,7 @@ const Ie = (n) => {
               direction: "row",
               justifyContent: "space-between",
               sx: {
-                pb: w,
+                pb: O,
                 pt: V,
                 px: I
               },
@@ -433,23 +440,23 @@ const Ie = (n) => {
                         he,
                         {
                           allowedAccountTypes: d,
-                          isDesktop: Y,
+                          isDesktop: L,
                           onAccountFilterClick: y
                         }
                       ),
                       n?.map((q) => {
                         if (u.isValidElement(q))
-                          return u.cloneElement(q, { isDesktop: Y });
+                          return u.cloneElement(q, { isDesktop: L });
                         const { iconName: G, onClick: Q, label: U } = q;
-                        return Y ? /* @__PURE__ */ e(
+                        return L ? /* @__PURE__ */ e(
                           H,
                           {
                             onClick: Q,
-                            startIcon: /* @__PURE__ */ e(D, { name: G, size: L }),
+                            startIcon: /* @__PURE__ */ e(D, { name: G, size: Y }),
                             children: U
                           },
                           G
-                        ) : /* @__PURE__ */ e($, { "aria-label": U, color: "primary", onClick: Q, children: /* @__PURE__ */ e(D, { name: G, size: L }) }, G);
+                        ) : /* @__PURE__ */ e($, { "aria-label": U, color: "primary", onClick: Q, children: /* @__PURE__ */ e(D, { name: G, size: Y }) }, G);
                       })
                     ]
                   }
@@ -459,7 +466,7 @@ const Ie = (n) => {
           ),
           T && (o || X),
           T && s && /* @__PURE__ */ e(ce, {}),
-          /* @__PURE__ */ e(me, { children: /* @__PURE__ */ e(_e, { availableHeight: k, availableWidth: x, children: m }) })
+          /* @__PURE__ */ e(me, { sx: { p: 0 }, children: /* @__PURE__ */ e(_e, { availableHeight: k, availableWidth: x, children: m }) })
         ] })
       }
     );
@@ -467,6 +474,6 @@ const Ie = (n) => {
 );
 export {
   Ge as D,
-  Lt as W,
+  Yt as W,
   Ie as u
 };

package/dist/accounts/index.es.js

@@ -63,7 +63,7 @@ import { C as r3 } from "../ConnectionsDrawer-D7IXAza2.mjs";
 import { u as b1 } from "../useScreenSize-CeFhWTt_.mjs";
 import { u as o1 } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as i1 } from "../Loader-CxeBwuPG.mjs";
-import { W as d3 } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as d3 } from "../WidgetContainer-CYcmwsSu.mjs";
 import { M as V1 } from "../MiniWidgetContainer-BdPiUU-u.mjs";
 const u3 = (t, o) => {
   const n = f1.includes(o) ? S1(t) : [], c = g1.includes(o) ? T1(t) : [], i = H1.includes(o) ? E1(t) : [];

package/dist/budgets/index.es.js

@@ -48,7 +48,7 @@ import { subDays as st } from "date-fns/subDays";
 import it from "@mui/material/IconButton";
 import { M as ct } from "../ManageIncome-DwylSiWs.mjs";
 import { u as ze } from "../useWidgetLoadTimer-CJb-RELP.mjs";
-import { W as lt } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as lt } from "../WidgetContainer-CYcmwsSu.mjs";
 import { g as dt, a as ut } from "../BudgetUtil-Bg2AQJpQ.mjs";
 import { M as mt } from "../MiniWidgetContainer-BdPiUU-u.mjs";
 import { b as gt } from "../CurrencyDialog-d4dL7vA5.mjs";

package/dist/cashflow/index.es.js

@@ -39,7 +39,7 @@ import { M as rt, S as st, i as ct, b as we, c as lt } from "../ManageIncome-Dwy
 import { D as He } from "../Drawer-XPaLYjiO.mjs";
 import { subDays as We } from "date-fns/subDays";
 import { endOfToday as dt } from "date-fns/endOfToday";
-import { W as mt } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as mt } from "../WidgetContainer-CYcmwsSu.mjs";
 import { A as X } from "../Account-BaJmiJAG.mjs";
 import { A as Se } from "../Analytics-CzGzz_sE.mjs";
 import { formatISO as ut } from "date-fns/formatISO";

package/dist/common/index.es.js

@@ -4,7 +4,7 @@ import { f as Q, b as j, a as V, c as K, g as Z, d as J } from "../NumberFormatt
 import { C as z, a as rr, b as er } from "../CurrencyDialog-d4dL7vA5.mjs";
 import { C as tr } from "../CurrencyInput-B59ugxPN.mjs";
 import { D as sr, S as nr } from "../Select-BZRUpOib.mjs";
-import { D as ur, W as lr, u as mr } from "../WidgetContainer-DalWyz5A.mjs";
+import { D as ur, W as lr, u as mr } from "../WidgetContainer-CYcmwsSu.mjs";
 import { D as cr } from "../Dialog-iLlBR8TG.mjs";
 import { D as pr } from "../Donut-SzzfZDHF.mjs";
 import { D as gr } from "../Drawer-XPaLYjiO.mjs";

package/dist/debts/index.es.js

@@ -42,7 +42,7 @@ import it from "@mui/material/ListItem";
 import lt from "@mui/material/Popover";
 import { u as st } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as ct } from "../Loader-CxeBwuPG.mjs";
-import { W as dt } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as dt } from "../WidgetContainer-CYcmwsSu.mjs";
 import { E as pt } from "../EmptyState-DHAkGsjk.mjs";
 import { C as ht } from "../ConnectDrawer-DgfsTpyW.mjs";
 function ut(r, n, o = 0) {

package/dist/finstrong/index.es.js

@@ -78,7 +78,7 @@ import So from "@mui/material/Accordion";
 import vo from "@mui/material/AccordionDetails";
 import wo from "@mui/material/AccordionSummary";
 import { u as ko } from "../useWidgetLoadTimer-CJb-RELP.mjs";
-import { W as Mo } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as Mo } from "../WidgetContainer-CYcmwsSu.mjs";
 const Ae = {
   creditScore: {
     poor: 600,

package/dist/goals/index.es.js

@@ -51,7 +51,7 @@ import { D as pt } from "../Dialog-iLlBR8TG.mjs";
 import { u as Me } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { A as $ } from "../Analytics-CzGzz_sE.mjs";
 import { L as Le } from "../Loader-CxeBwuPG.mjs";
-import { W as ht } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as ht } from "../WidgetContainer-CYcmwsSu.mjs";
 import { E as bt } from "../EmptyState-DHAkGsjk.mjs";
 import ft from "@mui/material/Stack/Stack";
 import yt from "@mui/material/Box";

package/dist/help/index.es.js

@@ -4,7 +4,7 @@ import { H as s } from "../Help-BSQm9o29.mjs";
 import { b as a } from "../hooks-BaO_gOI6.mjs";
 import { u as p } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as d } from "../Loader-CxeBwuPG.mjs";
-import { W as f } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as f } from "../WidgetContainer-CYcmwsSu.mjs";
 const L = m(({ onBackClick: e, onMenuClick: i, sx: t }) => {
   const { isInitialized: o } = a();
   return p({

package/dist/investments/index.es.js

@@ -39,7 +39,7 @@ import { DataGridPro as Pe } from "@mui/x-data-grid-pro";
 import { Stack as qe } from "@mui/material";
 import { L as De } from "../Loader-CxeBwuPG.mjs";
 import { u as Ke } from "../useWidgetLoadTimer-CJb-RELP.mjs";
-import { W as Ye } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as Ye } from "../WidgetContainer-CYcmwsSu.mjs";
 import { A as Qe } from "../Account-BaJmiJAG.mjs";
 import { E as Je } from "../EmptyState-DHAkGsjk.mjs";
 const me = ({ sx: t = {} }) => {

package/dist/networth/index.es.js

@@ -34,7 +34,7 @@ import ye from "@mui/material/Collapse";
 import K from "@mui/material/ListItemIcon";
 import { g as U } from "../NetWorthUtils-DilGN1nW.mjs";
 import { D as V } from "../Drawer-XPaLYjiO.mjs";
-import { W as Ce } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as Ce } from "../WidgetContainer-CYcmwsSu.mjs";
 import { E as be } from "../EmptyState-DHAkGsjk.mjs";
 const _e = ({ amount: t, copy: s, trendValue: i }) => {
   const n = i > 0, o = i === 0 ? "trending_flat" : n ? "trending_up" : "trending_down";

package/dist/recurringtransactions/index.es.js

@@ -56,7 +56,7 @@ import { S as Le } from "../StatusBar-CPfSXe80.mjs";
 import { S as ve } from "../SkeletonLoader-BaNboJjD.mjs";
 import { u as oe } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as ae } from "../Loader-CxeBwuPG.mjs";
-import { W as ht } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as ht } from "../WidgetContainer-CYcmwsSu.mjs";
 import { M as ft } from "../MiniWidgetContainer-BdPiUU-u.mjs";
 import { u as xt } from "../useDimensions-CeDR9V8N.mjs";
 import { M as bt } from "../MicroWidgetContainer-CfKdQfhi.mjs";

package/dist/settings/index.es.js

@@ -42,7 +42,7 @@ import Be from "@mui/material/ListItemText";
 import { D as He } from "../Drawer-XPaLYjiO.mjs";
 import { u as ne } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { H as Oe } from "../Help-BSQm9o29.mjs";
-import { W as q } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as q } from "../WidgetContainer-CYcmwsSu.mjs";
 const Fe = ({ availableWidth: t, handleOnLeavClick: r }) => {
   const i = xe(), { common: o, settings: n } = w(), { isDesktop: u, isMobile: s, isSmallMobile: a, isTablet: l } = H(t), { config: b } = G(), { updateUser: _ } = E(), { user: d } = we(), [p, k] = m.useState({
     first_name: d.first_name,

package/dist/spending/index.es.js

@@ -31,7 +31,7 @@ import { D as tt } from "../Drawer-XPaLYjiO.mjs";
 import { C as w } from "../Category-DEKZGLYe.mjs";
 import { parseISO as et } from "date-fns/parseISO";
 import { A as nt } from "../Analytics-CzGzz_sE.mjs";
-import { W as It } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as It } from "../WidgetContainer-CYcmwsSu.mjs";
 const G = ({ amount: n, label: d, variant: o = "full" }) => /* @__PURE__ */ p(y, { direction: "column", children: [
   /* @__PURE__ */ t(T, { bold: !0, sx: { textTransform: "none" }, variant: "body1", children: d }),
   /* @__PURE__ */ t(T, { variant: "caption", children: k(n, o === "mini" ? "0,0" : "0,0.00") })

package/dist/transactions/index.es.js

@@ -38,7 +38,7 @@ import { u as mt } from "../useAriaLive-MkYebyUR.mjs";
 import { S as _t } from "../SkeletonLoader-BaNboJjD.mjs";
 import { u as pt } from "../useScreenSize-CeFhWTt_.mjs";
 import { u as gt } from "../useWidgetLoadTimer-CJb-RELP.mjs";
-import { W as ht } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as ht } from "../WidgetContainer-CYcmwsSu.mjs";
 import { S as ft } from "../SearchBox-CwDgvWVJ.mjs";
 import { D as te } from "../Drawer-XPaLYjiO.mjs";
 const Ct = (t) => /* @__PURE__ */ m(y, { tabIndex: t.tabIndex, variant: "body2", children: [

package/dist/trends/index.es.js

@@ -39,7 +39,7 @@ import { T as dt } from "../TransactionDetails-CbBSxdOi.mjs";
 import { D as Pe } from "../Drawer-XPaLYjiO.mjs";
 import { u as Ie } from "../useWidgetLoadTimer-CJb-RELP.mjs";
 import { L as Le } from "../Loader-CxeBwuPG.mjs";
-import { W as ut } from "../WidgetContainer-DalWyz5A.mjs";
+import { W as ut } from "../WidgetContainer-CYcmwsSu.mjs";
 import { L as Ve } from "../LineChart-CejWS_rh.mjs";
 import { M as qt } from "../MiniWidgetContainer-BdPiUU-u.mjs";
 import { subMonths as Jt } from "date-fns";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-cartographer/experiences",
-  "version": "8.2.0",
+  "version": "8.2.1",
   "description": "Library containing experience widgets",
   "author": "MX",
   "license": "MIT",