@mx-cartographer/experiences 7.12.4 → 7.12.6

package/dist/trends/index.es.js

@@ -1,72 +1,72 @@
-import { jsxs as C, jsx as e, Fragment as St } from "react/jsx-runtime";
-import h, { useRef as wt, useState as xt, useEffect as vt } from "react";
+import { jsxs as C, jsx as e, Fragment as wt } from "react/jsx-runtime";
+import g, { useRef as xt, useState as vt, useEffect as Dt } from "react";
 import { observer as M } from "mobx-react-lite";
-import { CategoryIcon as xe, Text as Q, Icon as He, H3 as Oe, P as fe, ChevronRightIcon as Dt } from "@mxenabled/mxui";
+import { CategoryIcon as xe, Text as Q, Icon as He, H3 as Ge, P as fe, ChevronRightIcon as It } from "@mxenabled/mxui";
 import W from "@mui/material/Box";
 import x from "@mui/material/Stack";
 import Te from "@mui/material/Button";
-import { addSeconds as qe } from "date-fns/addSeconds";
+import { addSeconds as Je } from "date-fns/addSeconds";
 import { differenceInCalendarMonths as Se } from "date-fns/differenceInCalendarMonths";
-import It from "numeral";
-import { useTheme as ce, styled as Lt } from "@mui/material/styles";
-import { useItemTooltip as Et, ChartsTooltipContainer as Mt } from "@mui/x-charts/ChartsTooltip";
-import { LineChart as At } from "@mui/x-charts/LineChart";
+import Lt from "numeral";
+import { useTheme as ne, styled as Et, alpha as Mt } from "@mui/material/styles";
+import { useItemTooltip as At, ChartsTooltipContainer as Rt } from "@mui/x-charts/ChartsTooltip";
+import { LineChart as kt } from "@mui/x-charts/LineChart";
 import { u as q } from "../useScreenSize-B6JyS_Lj.mjs";
-import { u as Rt } from "../useDimensions-CeDR9V8N.mjs";
-import Je from "@mui/material/Card";
-import et from "@mui/material/CardContent";
+import { u as Ht } from "../useDimensions-CeDR9V8N.mjs";
+import et from "@mui/material/Card";
+import tt from "@mui/material/CardContent";
 import Ne from "@mui/material/Divider";
-import Ve from "@mui/material/Grid";
-import { u as A, l as J, g as $, b as ye, h as ve, d as De, B as Ce, p as tt, f as Ge, a as ot } from "../hooks-BxkfR-Ff.mjs";
-import { b as nt } from "../Localization-CPkpIwIx.mjs";
+import Fe from "@mui/material/Grid";
+import { u as A, l as J, g as $, b as ye, h as ve, d as De, B as Ce, p as ot, f as Be, a as nt } from "../hooks-BxkfR-Ff.mjs";
+import { b as st } from "../Localization-CPkpIwIx.mjs";
 import { C as we } from "../CurrencyText-CA-E5N_y.mjs";
-import { C as Re, b as Fe, c as kt } from "../Category-CevNQ03n.mjs";
+import { C as Re, b as $e, c as Nt } from "../Category-CevNQ03n.mjs";
 import { f as Z, D as B } from "../DateFormats-BMpMrZpW.mjs";
-import { f as oe, a as Ht } from "../NumberFormatting-QCaNwbjv.mjs";
-import { c as Nt, a as $e, g as Wt, L as st } from "../TrendsStore-st6GjDtg.mjs";
-import { T as us } from "../TrendsStore-st6GjDtg.mjs";
-import { c as Ot, i as Gt, d as Bt, e as Pt, b as rt, g as at, f as ze } from "../SpendingData-Bz1bCWAs.mjs";
-import Vt from "@mui/material/ToggleButton";
-import Ft from "@mui/material/ToggleButtonGroup";
-import { parseISO as it } from "date-fns/parseISO";
+import { f as oe, a as Wt } from "../NumberFormatting-QCaNwbjv.mjs";
+import { c as Ot, a as ze, g as Gt, L as rt } from "../TrendsStore-st6GjDtg.mjs";
+import { T as ms } from "../TrendsStore-st6GjDtg.mjs";
+import { c as Bt, i as Pt, d as Vt, e as Ft, b as at, g as it, f as Ke } from "../SpendingData-Bz1bCWAs.mjs";
+import $t from "@mui/material/ToggleButton";
+import zt from "@mui/material/ToggleButtonGroup";
+import { parseISO as lt } from "date-fns/parseISO";
 import { H as ke } from "../HeaderCell-DjuifqHJ.mjs";
-import { T as G, b as $t } from "../ViewMoreMicroCard-DirvUT9O.mjs";
-import { useGridApiContext as zt, useGridRootProps as Kt, DataGridPro as Yt } from "@mui/x-data-grid-pro";
-import jt from "@mui/material/Badge";
-import Ut from "@mui/material/IconButton";
+import { T as G, b as Kt } from "../ViewMoreMicroCard-DirvUT9O.mjs";
+import { useGridApiContext as Yt, useGridRootProps as jt, DataGridPro as Ut } from "@mui/x-data-grid-pro";
+import Xt from "@mui/material/Badge";
+import Zt from "@mui/material/IconButton";
 import { A as v } from "../Analytics-BYItVAe-.mjs";
-import { T as lt } from "../StatusIndicator-BWdlLG0b.mjs";
-import { T as ct } from "../TransactionDetails-CzaNtpaw.mjs";
+import { T as ct } from "../StatusIndicator-Bo80rdKq.mjs";
+import { T as dt } from "../TransactionDetails-DWZuZgBw.mjs";
 import { D as We } from "../Drawer-DV4NTsFg.mjs";
 import { u as Ie } from "../useWidgetLoadTimer-DgN1bTyu.mjs";
 import { L as Le } from "../Loader-D3rjKx72.mjs";
-import { W as dt } from "../WidgetContainer-B0ncgABX.mjs";
-import { L as Be } from "../LineChart-B1qbKR8q.mjs";
-import { M as Xt } from "../MiniWidgetContainer-Cu72GNsE.mjs";
-import { subMonths as Zt } from "date-fns";
-import { TrendingUp as Qt, TrendingDown as qt, MultilineChart as Jt, ExpandLess as eo, ExpandMore as to, ArrowBack as oo } from "@mxenabled/mx-icons";
-import { M as no } from "../MicroWidgetContainer-B_EnfvCq.mjs";
-import so from "@mui/material/Collapse";
-import ro from "@mui/material/List";
-import ao from "@mui/material/ListItem";
-import io from "@mui/material/ListItemButton";
-import lo from "@mui/material/ListItemIcon";
-import co from "@mui/material/ListItemText";
-import ut from "@mui/material/styles/useTheme";
-import { Stack as uo } from "@mui/material";
-import mo from "@mui/material/Paper";
-import { b as ho } from "../CategoryUtil-BVixr0d5.mjs";
-import { E as go } from "../ExportCsvAction-Bg6gO_Cz.mjs";
-import { u as po } from "../useInsightsEnabled-DL_oNyI0.mjs";
-import { E as fo } from "../EmptyState-DHAkGsjk.mjs";
-import { C as yo } from "../ConnectDrawer-CioFo6Wy.mjs";
-const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
+import { W as ut } from "../WidgetContainer-B0ncgABX.mjs";
+import { L as Pe } from "../LineChart-B1qbKR8q.mjs";
+import { M as Qt } from "../MiniWidgetContainer-Cu72GNsE.mjs";
+import { subMonths as qt } from "date-fns";
+import { TrendingUp as Jt, TrendingDown as eo, MultilineChart as to, ExpandLess as oo, ExpandMore as no, ArrowBack as so } from "@mxenabled/mx-icons";
+import { M as ro } from "../MicroWidgetContainer-B_EnfvCq.mjs";
+import ao from "@mui/material/Collapse";
+import io from "@mui/material/List";
+import lo from "@mui/material/ListItem";
+import co from "@mui/material/ListItemButton";
+import uo from "@mui/material/ListItemIcon";
+import mo from "@mui/material/ListItemText";
+import mt from "@mui/material/styles/useTheme";
+import { b as Oe } from "../CategoryUtil-BVixr0d5.mjs";
+import { Stack as ho } from "@mui/material";
+import go from "@mui/material/Paper";
+import { E as po } from "../ExportCsvAction-Bg6gO_Cz.mjs";
+import { u as fo } from "../useInsightsEnabled-DL_oNyI0.mjs";
+import { E as yo } from "../EmptyState-DHAkGsjk.mjs";
+import { C as Co } from "../ConnectDrawer-CioFo6Wy.mjs";
+const ht = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
   const { categories: n } = A(), { getCategoryName: o } = J(), r = o(t);
   return /* @__PURE__ */ C(x, { alignItems: "center", direction: "column", gap: "8", justifyContent: "center", mb: 4, children: [
     /* @__PURE__ */ e(
       W,
       {
-        "aria-label": nt(n.category_icon_label_aria, r),
+        "aria-label": st(n.category_icon_label_aria, r),
         mb: 4,
         role: "img",
         children: /* @__PURE__ */ e(xe, { categoryGuid: s })
@@ -74,25 +74,25 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     ),
     /* @__PURE__ */ e(Q, { variant: "Body", children: r })
   ] });
-}, Co = ({
+}, _o = ({
   categoryGuids: { guid: t, topLevelGuid: s },
   hoveredAreaData: n,
   cursorPosition: o,
   chartContainerRef: r
 }) => {
-  const l = ce(), a = wt(null), [u, c] = xt({ x: o.x, y: o.y });
-  if (vt(() => {
+  const l = ne(), a = xt(null), [u, c] = vt({ x: o.x, y: o.y });
+  if (Dt(() => {
     (() => {
-      const g = a.current, _ = r.current;
-      if (!g || !_) return;
-      const m = g.getBoundingClientRect(), p = _.getBoundingClientRect();
+      const m = a.current, _ = r.current;
+      if (!m || !_) return;
+      const h = m.getBoundingClientRect(), p = _.getBoundingClientRect();
       let f = o.x, T = o.y;
-      f + m.width * 2 > p.right ? f = o.x - m.width : f - m.width < p.left && (f = o.x), T + m.height * 2 > p.bottom && (T = o.y - m.height), c({ x: f, y: T });
+      f + h.width * 2 > p.right ? f = o.x - h.width : f - h.width < p.left && (f = o.x), T + h.height * 2 > p.bottom && (T = o.y - h.height), c({ x: f, y: T });
     })();
   }, [o, r]), !n) return null;
-  const i = n.reduce((y, g) => y + g.y, 0);
+  const i = n.reduce((y, m) => y + m.y, 0);
   return /* @__PURE__ */ e(
-    Je,
+    et,
     {
       ref: a,
       sx: {
@@ -102,16 +102,16 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
         width: 250,
         pointerEvents: "none"
       },
-      children: /* @__PURE__ */ C(et, { children: [
+      children: /* @__PURE__ */ C(tt, { children: [
         /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
-          /* @__PURE__ */ e(mt, { categoryGuid: t, topLevelCategoryGuid: s }),
+          /* @__PURE__ */ e(ht, { categoryGuid: t, topLevelCategoryGuid: s }),
           /* @__PURE__ */ e(Q, { variant: "Small", children: `${n.length}-month total` }),
           /* @__PURE__ */ e(we, { amount: i, bold: !0, formatString: "0,0", variant: "body2" })
         ] }),
         /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
-        /* @__PURE__ */ e(Ve, { container: !0, children: n.map((y, g) => /* @__PURE__ */ C(h.Fragment, { children: [
-          g > 0 && g % 3 === 0 && /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
-          /* @__PURE__ */ e(Ve, { item: !0, xs: 4, children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
+        /* @__PURE__ */ e(Fe, { container: !0, children: n.map((y, m) => /* @__PURE__ */ C(g.Fragment, { children: [
+          m > 0 && m % 3 === 0 && /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
+          /* @__PURE__ */ e(Fe, { item: !0, xs: 4, children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
             /* @__PURE__ */ e(Q, { color: l.palette.text.secondary, variant: "XSmall", children: y.x }),
             /* @__PURE__ */ e(
               we,
@@ -123,11 +123,11 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
               }
             )
           ] }) })
-        ] }, g)) })
+        ] }, m)) })
       ] })
     }
   );
-}, _o = M(Co), bo = ({
+}, bo = M(_o), To = ({
   sx: t,
   categoryGuids: s,
   hoveredLegend: n,
@@ -146,7 +146,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       ref: o,
       sx: t,
       children: s.map(({ guid: c, top_level_guid: i }) => {
-        const y = n === c, g = Re[c], _ = Re[i], m = g ?? _ ?? Re.default, p = m + "33";
+        const y = n === c, m = Re[c], _ = Re[i], h = m ?? _ ?? Re.default, p = h + "33";
         return /* @__PURE__ */ C(
           Te,
           {
@@ -173,7 +173,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
                     height: 16,
                     marginRight: a ? 5 : 10,
                     borderRadius: "2px",
-                    backgroundColor: n ? y ? m : p : m
+                    backgroundColor: n ? y ? h : p : h
                   }
                 }
               ),
@@ -185,22 +185,22 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       })
     }
   );
-}, To = ({
+}, So = ({
   categoryGuids: { guid: t, topLevelGuid: s },
   series: n,
   xData: o
 }) => {
-  const r = Et(), l = ce();
+  const r = At(), l = ne();
   if (!r?.identifier) return null;
   const { dataIndex: a, seriesId: u } = r.identifier;
   if (a == null || !u) return null;
-  const i = n.find((g) => g.id === u)?.data?.[a], y = o?.[a];
-  return i === void 0 || !y ? null : /* @__PURE__ */ e(Je, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(et, { children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
-    /* @__PURE__ */ e(mt, { categoryGuid: t, topLevelCategoryGuid: s }),
+  const i = n.find((m) => m.id === u)?.data?.[a], y = o?.[a];
+  return i === void 0 || !y ? null : /* @__PURE__ */ e(et, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(tt, { children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
+    /* @__PURE__ */ e(ht, { categoryGuid: t, topLevelCategoryGuid: s }),
     /* @__PURE__ */ e(Q, { color: l.palette.text.secondary, variant: "Small", children: Z(y, B.MONTH_SHORT_YEAR) }),
     /* @__PURE__ */ e(we, { amount: String(i), bold: !0, formatString: "0,0", variant: "Body" })
   ] }) }) });
-}, So = ({
+}, wo = ({
   onHoverArea: t,
   onHoverPoint: s,
   onHoverLegend: n,
@@ -210,21 +210,21 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
   availableHeight: a = 0,
   minimumHeight: u = 350
 }) => {
-  const c = ce(), { isMobile: i } = q(), [y, { height: g }] = Rt(), _ = h.useRef(null), [m, p] = h.useState(0);
-  h.useEffect(() => {
-    const d = Math.max(a - g, u);
+  const c = ne(), { isMobile: i } = q(), [y, { height: m }] = Ht(), _ = g.useRef(null), [h, p] = g.useState(0);
+  g.useEffect(() => {
+    const d = Math.max(a - m, u);
     p(d);
-  }, [a, g]);
-  const [f, T] = h.useState(null), [S, R] = h.useState({
+  }, [a, m]);
+  const [f, T] = g.useState(null), [S, R] = g.useState({
     hoveredSeriesId: null,
     hoveredAreaData: null,
     isAreaHovered: !1,
     cursorPos: { x: 0, y: 0 }
-  }), { hoveredSeriesId: L, hoveredAreaData: w, isAreaHovered: k, cursorPos: H } = S, z = k && L && w, P = !z, K = [...r, ...l], E = K[0]?.dataset.length ?? 0, te = K.flatMap((d) => d.dataset.map((b) => b.x)), O = K.flatMap((d) => d.dataset.map((b) => b.y)), ne = r[0]?.dataset?.map(
+  }), { hoveredSeriesId: L, hoveredAreaData: w, isAreaHovered: k, cursorPos: H } = S, z = k && L && w, P = !z, K = [...r, ...l], E = K[0]?.dataset.length ?? 0, te = K.flatMap((d) => d.dataset.map((b) => b.x)), O = K.flatMap((d) => d.dataset.map((b) => b.y)), se = r[0]?.dataset?.map(
     (d, b) => r.reduce((I, U) => I + U.dataset[b]?.y || 0, 0)
-  ) ?? [0], se = Math.max(...ne), X = Math.max(
+  ) ?? [0], re = Math.max(...se), X = Math.max(
     ...l.flatMap((d) => d.dataset.map((b) => b.y))
-  ), de = Math.floor(Math.min(...O) / 100) * 100, ue = Math.ceil(Math.max(se, X) / 100) * 100, V = r.map((d, b) => ({
+  ), de = Math.floor(Math.min(...O) / 100) * 100, ue = Math.ceil(Math.max(re, X) / 100) * 100, V = r.map((d, b) => ({
     id: `stacked-${b}`,
     guid: d.category_guid,
     top_level_guid: d.top_level_category_guid,
@@ -236,7 +236,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     type: "line",
     highlightScope: { highlight: "item" },
     valueFormatter: (I) => oe(I, "0,0")
-  })), re = l.map((d, b) => ({
+  })), ae = l.map((d, b) => ({
     id: `unstacked-${b}`,
     guid: d.category_guid,
     top_level_guid: d.top_level_category_guid,
@@ -246,12 +246,12 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     label: d.category_name,
     type: "line",
     valueFormatter: (I) => oe(I, "0,0")
-  })), Y = [...V, ...re], me = [
+  })), Y = [...V, ...ae], me = [
     ...V.map(({ guid: d, top_level_guid: b }) => ({
       guid: d,
       top_level_guid: b
     })),
-    ...re.map(({ guid: d, top_level_guid: b }) => ({
+    ...ae.map(({ guid: d, top_level_guid: b }) => ({
       guid: d,
       top_level_guid: b
     }))
@@ -261,14 +261,14 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       guid: I?.category_guid,
       topLevelGuid: I?.top_level_category_guid
     };
-  }, ae = (d) => {
+  }, ie = (d) => {
     T(d), n?.(d ?? "");
   }, he = (d) => {
     o?.(d ?? "");
-  }, ie = () => {
+  }, le = () => {
     const d = j(String(L)).guid;
     d && o?.(d);
-  }, le = (d) => {
+  }, ce = (d) => {
     const b = String(d?.seriesId), I = j(b).guid, U = Y.find((ge) => ge.id === b), Ee = U && d?.dataIndex !== void 0, _e = U && d?.dataIndex === void 0;
     if (Ee)
       R({
@@ -353,21 +353,21 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
           sx: { width: "100%", position: "relative" },
           children: [
             /* @__PURE__ */ e(
-              At,
+              kt,
               {
-                height: m,
+                height: h,
                 hideLegend: !0,
                 margin: { bottom: 24, left: 12, right: 54, top: 48 },
-                onAreaClick: ie,
-                onHighlightChange: le,
+                onAreaClick: le,
+                onHighlightChange: ce,
                 series: Y,
                 skipAnimation: !0,
                 slotProps: {
                   tooltip: { trigger: P ? "item" : "none" }
                 },
                 slots: {
-                  tooltip: P && L ? (d) => /* @__PURE__ */ e(Mt, { children: /* @__PURE__ */ e(
-                    To,
+                  tooltip: P && L ? (d) => /* @__PURE__ */ e(Rt, { children: /* @__PURE__ */ e(
+                    So,
                     {
                       ...d,
                       categoryGuids: j(L),
@@ -390,24 +390,24 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
                   {
                     min: de,
                     max: ue || 100,
-                    valueFormatter: (d) => It(d).format("0a")
+                    valueFormatter: (d) => Lt(d).format("0a")
                   }
                 ]
               }
             ),
             /* @__PURE__ */ e(
-              bo,
+              To,
               {
                 categoryGuids: me,
                 hoveredLegend: f,
                 legendRef: y,
                 onClickLegend: he,
-                onHoverLegend: ae,
+                onHoverLegend: ie,
                 sx: { px: i ? 0 : 24 }
               }
             ),
             z && /* @__PURE__ */ e(
-              _o,
+              bo,
               {
                 categoryGuids: j(L),
                 chartContainerRef: _,
@@ -423,10 +423,10 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       )
     }
   );
-}, ht = ({ selectedTab: t, onTabChange: s }) => {
+}, gt = ({ selectedTab: t, onTabChange: s }) => {
   const { common: n } = A();
   return /* @__PURE__ */ e(
-    Ft,
+    zt,
     {
       "aria-label": n.view_toggle,
       exclusive: !0,
@@ -434,7 +434,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       orientation: "horizontal",
       value: t,
       children: ["Chart", "Table"].map((o) => /* @__PURE__ */ e(
-        Vt,
+        $t,
         {
           "aria-label": o === "Chart" ? n.view_chart : n.view_table,
           "aria-pressed": t === o,
@@ -447,8 +447,8 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       ))
     }
   );
-}, gt = ({ selectedDateRange: t, selectedCategoryGuid: s }) => {
-  const { trends: n } = A(), { isMobile: o, isDesktop: r } = q(), { getCategoryName: l } = J(), a = h.useMemo(() => {
+}, pt = ({ selectedDateRange: t, selectedCategoryGuid: s }) => {
+  const { trends: n } = A(), { isMobile: o, isDesktop: r } = q(), { getCategoryName: l } = J(), a = g.useMemo(() => {
     const i = t.start.getFullYear() === t.end.getFullYear() ? Z(
       t.start,
       o ? B.MONTH_SHORT : B.MONTH_LONG
@@ -463,7 +463,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
   }, [t, o]), c = l(s) || (o ? n.sub_title : n.sub_title_by_category);
   return /* @__PURE__ */ C(W, { children: [
     /* @__PURE__ */ e(
-      Oe,
+      Ge,
       {
         sx: {
           fontSize: r ? null : 15,
@@ -476,14 +476,14 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     ),
     /* @__PURE__ */ e(Q, { variant: r ? "subtitle1" : "body2", children: a })
   ] });
-}, wo = (t) => {
+}, xo = (t) => {
   const s = t.id === "total";
   return /* @__PURE__ */ C(x, { alignItems: "center", direction: "row", role: "rowheader", tabIndex: t.tabIndex, children: [
     !s && /* @__PURE__ */ e(W, { "aria-hidden": !0, children: /* @__PURE__ */ e(xe, { categoryGuid: t.row.top_level_category_guid, variant: "twotone" }) }),
     /* @__PURE__ */ e(Q, { bold: s, sx: { ml: 12 }, variant: s ? "body1" : "body2", children: t.row.category })
   ] });
-}, Ke = (t) => {
-  const s = t.row.category_guid, n = t.row.top_level_category_guid, o = s === Fe.INCOME || n === Fe.INCOME, r = t.id === "total", l = t.field === "total", a = l ? t.row[t.field] : t.row.monthlyAmounts[t.field];
+}, Ye = (t) => {
+  const s = t.row.category_guid, n = t.row.top_level_category_guid, o = s === $e.INCOME || n === $e.INCOME, r = t.id === "total", l = t.field === "total", a = l ? t.row[t.field] : t.row.monthlyAmounts[t.field];
   return /* @__PURE__ */ e(x, { alignItems: "flex-end", direction: "row", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(
     we,
     {
@@ -494,20 +494,20 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       variant: r ? "body1" : "body2"
     }
   ) });
-}, Ye = (t, s) => {
-  const n = Z(it(s.isoDate), B.MONTH_LONG);
+}, je = (t, s) => {
+  const n = Z(lt(s.isoDate), B.MONTH_LONG);
   return t[n] = s.amount, t;
-}, je = (t) => (s, n) => {
-  const o = Z(it(n.isoDate), B.MONTH_LONG);
+}, Ue = (t) => (s, n) => {
+  const o = Z(lt(n.isoDate), B.MONTH_LONG);
   return s + (t.includes(o) ? n.amount : 0);
-}, xo = (t, s) => {
+}, vo = (t, s) => {
   const n = [], o = new Date(t);
   for (; o <= s; ) {
     const r = Z(o, B.MONTH_LONG);
     n.push(r), o.setMonth(o.getMonth() + 1);
   }
   return n;
-}, vo = (t, s) => {
+}, Do = (t, s) => {
   const n = {
     field: "category",
     flex: 1,
@@ -515,9 +515,9 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     headerName: s.category_title,
     minWidth: 210,
     renderHeader: ke,
-    renderCell: wo,
+    renderCell: xo,
     sortable: !0,
-    sortComparator: Nt,
+    sortComparator: Ot,
     type: "string"
   }, o = t.map((l) => ({
     field: l,
@@ -526,13 +526,13 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     headerName: l,
     minWidth: 100,
     renderHeader: ke,
-    renderCell: Ke,
+    renderCell: Ye,
     align: "center",
     headerAlign: "center",
     sortable: !0,
     hideSortIcons: !1,
     type: "number",
-    sortComparator: $e,
+    sortComparator: ze,
     valueGetter: (a, u) => u.monthlyAmounts?.[l] ?? 0
   })), r = {
     field: "total",
@@ -541,16 +541,16 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
     headerName: s.table_column_total,
     minWidth: 100,
     renderHeader: ke,
-    renderCell: Ke,
+    renderCell: Ye,
     align: "center",
     headerAlign: "center",
     sortable: !0,
     hideSortIcons: !1,
     type: "number",
-    sortComparator: $e
+    sortComparator: ze
   };
   return [n, ...o, r];
-}, Ue = (t, s, n, o, r) => {
+}, Xe = (t, s, n, o, r) => {
   const l = t.filter((a) => a.is_income === n).map((a) => {
     let u = a.totalMonthlyAmounts;
     return r && (u = a.monthlyAmounts), {
@@ -559,29 +559,29 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
       category_guid: a.guid,
       isParent: !1,
       top_level_category_guid: a.parent_guid || a.guid,
-      total: u.reduce(je(o), 0),
-      monthlyAmounts: u.reduce(Ye, {})
+      total: u.reduce(Ue(o), 0),
+      monthlyAmounts: u.reduce(je, {})
     };
   });
   if (r && r.is_income === n) {
-    const a = r.monthlyAmounts.reduce(je(o), 0);
+    const a = r.monthlyAmounts.reduce(Ue(o), 0);
     a !== 0 && l.push({
       id: `sub-${r.guid}`,
-      category: nt(s.category_general, r.name),
+      category: st(s.category_general, r.name),
       category_guid: r.guid,
       isParent: !0,
       top_level_category_guid: r.guid,
       total: a,
-      monthlyAmounts: r.monthlyAmounts.reduce(Ye, {})
+      monthlyAmounts: r.monthlyAmounts.reduce(je, {})
     });
   }
   return l;
-}, Do = Lt("div")({
+}, Io = Et("div")({
   display: "flex",
   visibility: "hidden",
   width: 0
 });
-function Io({
+function Lo({
   direction: t,
   index: s,
   sortingOrder: n,
@@ -589,15 +589,15 @@ function Io({
   className: r,
   field: l
 }) {
-  const a = zt(), u = Kt();
+  const a = Yt(), u = jt();
   let c = null;
   const i = {};
   if (t === "asc" ? c = u.slots.columnSortedAscendingIcon : t === "desc" ? c = u.slots.columnSortedDescendingIcon : (c = u.slots.columnUnsortedIcon ?? null, i.sortingOrder = n), !c) return null;
-  const g = a.current.getColumn(l)?.headerName ?? l;
+  const m = a.current.getColumn(l)?.headerName ?? l;
   let _ = "";
   t === "asc" ? _ = ", sorted ascending" : t === "desc" && (_ = ", sorted descending");
-  const m = ["Total", "Category"].includes(g) ? "" : " category totals", p = `Sort by ${g}${m}${_}`, f = /* @__PURE__ */ e(c, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...i }), T = /* @__PURE__ */ e(
-    Ut,
+  const h = ["Total", "Category"].includes(m) ? "" : " category totals", p = `Sort by ${m}${h}${_}`, f = /* @__PURE__ */ e(c, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...i }), T = /* @__PURE__ */ e(
+    Zt,
     {
       disabled: o,
       size: "small",
@@ -609,18 +609,18 @@ function Io({
       children: f
     }
   );
-  return /* @__PURE__ */ e(Do, { className: "MuiDataGrid-iconButtonContainer", children: s != null ? /* @__PURE__ */ e(jt, { badgeContent: s, color: "default", overlap: "circular", children: T }) : T });
+  return /* @__PURE__ */ e(Io, { className: "MuiDataGrid-iconButtonContainer", children: s != null ? /* @__PURE__ */ e(Xt, { badgeContent: s, color: "default", overlap: "circular", children: T }) : T });
 }
-const Lo = h.memo(Io), Xe = ({
+const Eo = g.memo(Lo), Ze = ({
   columns: t,
   onRowClick: s,
   parentCategory: n,
   rows: o,
   totalRow: r
 }) => {
-  const l = ce(), { onEvent: a } = $(), u = l.palette.mode === "light";
+  const l = ne(), { onEvent: a } = $(), u = l.palette.mode === "light";
   return /* @__PURE__ */ e(
-    Yt,
+    Ut,
     {
       columns: t,
       disableColumnFilter: !0,
@@ -630,7 +630,7 @@ const Lo = h.memo(Io), Xe = ({
       onRowClick: (c) => {
         n || s?.(c.row.category_guid), a(v.TRENDS_CLICK_LIST_ITEM, {
           ...G,
-          listItem: kt[c.row.category_guid]
+          listItem: Nt[c.row.category_guid]
         });
       },
       pinnedRows: {
@@ -639,7 +639,7 @@ const Lo = h.memo(Io), Xe = ({
       rowHeight: 64,
       rows: o,
       slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
-      slots: { columnHeaderSortIcon: Lo },
+      slots: { columnHeaderSortIcon: Eo },
       sortingOrder: ["asc", "desc"],
       sx: {
         borderColor: "divider",
@@ -656,23 +656,23 @@ const Lo = h.memo(Io), Xe = ({
       }
     }
   );
-}, pt = ({
+}, ft = ({
   selectedDateRange: t,
   selectedCategory: s,
   onClickRow: n,
   height: o = "100%",
   sx: r = {}
 }) => {
-  const { trends: l } = A(), { trendsCategories: a } = J(), u = h.useMemo(() => xo(t.start, t.end), [t]), c = h.useMemo(() => vo(u, l), [u, l]), i = h.useMemo(() => {
+  const { trends: l } = A(), { trendsCategories: a } = J(), u = g.useMemo(() => vo(t.start, t.end), [t]), c = g.useMemo(() => Do(u, l), [u, l]), i = g.useMemo(() => {
     if (s)
-      return a.find((m) => m.guid === s);
-  }, [s, a]), [y, g] = h.useMemo(() => {
-    let m = a;
-    return i && (m = i.subCategories.filter(
+      return a.find((h) => h.guid === s);
+  }, [s, a]), [y, m] = g.useMemo(() => {
+    let h = a;
+    return i && (h = i.subCategories.filter(
       (p) => p.monthlyAmounts.some((f) => f.amount !== 0)
     )), [
-      Ue(m, l, !0, u, i),
-      Ue(m, l, !1, u, i)
+      Xe(h, l, !0, u, i),
+      Xe(h, l, !1, u, i)
     ];
   }, [a, u, i, l]), _ = {
     id: "total",
@@ -680,11 +680,11 @@ const Lo = h.memo(Io), Xe = ({
     category_guid: "total",
     isParent: !1,
     top_level_category_guid: "total",
-    total: g.reduce((m, p) => m + p.total, 0),
-    monthlyAmounts: g.reduce(
-      (m, p) => (Object.entries(p.monthlyAmounts).forEach(([f, T]) => {
-        m[f] = (m[f] || 0) + T;
-      }), m),
+    total: m.reduce((h, p) => h + p.total, 0),
+    monthlyAmounts: m.reduce(
+      (h, p) => (Object.entries(p.monthlyAmounts).forEach(([f, T]) => {
+        h[f] = (h[f] || 0) + T;
+      }), h),
       {}
     )
   };
@@ -695,7 +695,7 @@ const Lo = h.memo(Io), Xe = ({
       sx: { height: o, width: "100%", overflowX: "auto", boxShadow: "none", ...r },
       children: [
         (!i || i && i.is_income) && /* @__PURE__ */ e(
-          Xe,
+          Ze,
           {
             columns: c,
             onRowClick: n,
@@ -704,38 +704,38 @@ const Lo = h.memo(Io), Xe = ({
           }
         ),
         (!i || i && !i.is_income) && /* @__PURE__ */ e(
-          Xe,
+          Ze,
           {
             columns: c,
             onRowClick: n,
             parentCategory: i,
-            rows: g,
+            rows: m,
             totalRow: _
           }
         )
       ]
     }
   );
-}, Eo = {
+}, Mo = {
   title: "Transaction List"
-}, Mo = ({
+}, Ao = ({
   categoryGuid: t,
   dateRange: s,
   isOpen: n,
   onClose: o
 }) => {
-  const { onEvent: r } = $(), { selectedAccountGuids: l } = ye(), { common: a } = A(), { setFilter: u, sortedTransactions: c } = ve(), [i, y] = h.useState(""), g = h.useMemo(
-    () => c.find((m) => m.guid === i),
+  const { onEvent: r } = $(), { selectedAccountGuids: l } = ye(), { common: a } = A(), { setFilter: u, sortedTransactions: c } = ve(), [i, y] = g.useState(""), m = g.useMemo(
+    () => c.find((h) => h.guid === i),
     [i, c]
   );
-  h.useEffect(() => {
+  g.useEffect(() => {
     u({
       accounts: l,
       dateRange: s,
-      custom: (m) => t === "" || t === m.category_guid || t === m.top_level_category_guid,
+      custom: (h) => t === "" || t === h.category_guid || t === h.top_level_category_guid,
       showSplits: !!t
     });
-  }, [l, t, s]), h.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
+  }, [l, t, s]), g.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
   const _ = () => {
     y(""), o();
   };
@@ -745,35 +745,35 @@ const Lo = h.memo(Io), Xe = ({
       ariaLabelClose: a.close_aria,
       isOpen: n,
       onClose: _,
-      title: Eo.title,
+      title: Mo.title,
       children: [
-        g && /* @__PURE__ */ e(ct, { transaction: g }),
-        !g && /* @__PURE__ */ e(lt, { onClick: y })
+        m && /* @__PURE__ */ e(dt, { transaction: m }),
+        !m && /* @__PURE__ */ e(ct, { onClick: y })
       ]
     }
   );
-}, Ao = M(Mo), Ro = ({ onBackClick: t, sx: s }) => {
+}, Ro = M(Ao), ko = ({ onBackClick: t, sx: s }) => {
   const { onEvent: n } = $(), { isDesktop: o, isTablet: r, isMobile: l } = q(), { isAccountDataLoaded: a, loadAccountData: u } = De(), {
     categoriesLoaded: c,
     loadCategories: i,
     loadDateRangeCategoryTotals: y,
-    loadMonthlyCategoryTotals: g,
+    loadMonthlyCategoryTotals: m,
     monthlyCategoryTotals: _,
-    getCategoryName: m
+    getCategoryName: h
   } = J(), {
     isTransactionDataLoaded: p,
     loadTransactionData: f,
     sortedTransactions: T
-  } = ve(), { selectedDateRange: S, setSelectedDateRange: R } = Ce(), { isInitialized: L, selectedAccounts: w } = ye(), { trends: k } = A(), [H, z] = h.useState(!1), [P, K] = h.useState(!1), [E, te] = h.useState("Chart"), [O, ne] = h.useState(""), [se, X] = h.useState(window.innerHeight), ue = se - (l ? 315 : 345);
+  } = ve(), { selectedDateRange: S, setSelectedDateRange: R } = Ce(), { isInitialized: L, selectedAccounts: w } = ye(), { trends: k } = A(), [H, z] = g.useState(!1), [P, K] = g.useState(!1), [E, te] = g.useState("Chart"), [O, se] = g.useState(""), [re, X] = g.useState(window.innerHeight), ue = re - (l ? 315 : 345);
   Ie({
     widgetName: "TrendsFullWidget",
     isLoaded: H
-  }), h.useEffect(() => {
+  }), g.useEffect(() => {
     const D = () => X(window.innerHeight);
     return window.addEventListener("resize", D), a || u().finally(), c || i().finally(), p || f().finally(), () => window.removeEventListener("resize", D);
-  }, []), h.useEffect(() => {
+  }, []), g.useEffect(() => {
     L && y(w, S.start, S.end).then(() => {
-      g(
+      m(
         w,
         S.start,
         S.end
@@ -785,41 +785,41 @@ const Lo = h.memo(Io), Xe = ({
       });
     });
   }, [L, w, S]);
-  const V = h.useMemo(() => {
+  const V = g.useMemo(() => {
     if (!H) return { stackedDatasets: [], unstackedDatasets: [] };
-    const D = Wt(
+    const D = Gt(
       _,
       S.start,
       S.end
     ), F = O.length ? D.filter(
       (d) => d.top_level_category_guid === O || d.category_guid === O
-    ) : Ot(D);
+    ) : Bt(D);
     return {
-      stackedDatasets: F.filter(Gt),
-      unstackedDatasets: F.filter(Bt)
+      stackedDatasets: F.filter(Pt),
+      unstackedDatasets: F.filter(Vt)
     };
-  }, [_, O, S]), re = (D, F) => {
+  }, [_, O, S]), ae = (D, F) => {
     te(F ?? E), n(v.TRENDS_CLICK_TOGGLE_VIEW);
   }, Y = (D) => {
-    const F = qe(D?.[0], 1), d = D?.[1], b = Se(d, F);
+    const F = Je(D?.[0], 1), d = D?.[1], b = Se(d, F);
     R({ start: F, end: d }), n(v.TRENDS_CLICK_TIME_WINDOW, {
       time_period: b + "M"
     });
   }, me = () => {
     n(v.TRENDS_CLICK_FILTER);
   }, j = (D) => {
-    ne(D);
-  }, ae = (D) => {
-    ne(D), n(v.TRENDS_CLICK_LEGEND, { category: m(D) });
-  }, he = (D) => {
-    n(v.TRENDS_HOVER_LEGEND, { category: m(D) });
+    se(D);
   }, ie = (D) => {
-    n(v.TRENDS_HOVER_AREA, { category: D });
+    se(D), n(v.TRENDS_CLICK_LEGEND, { category: h(D) });
+  }, he = (D) => {
+    n(v.TRENDS_HOVER_LEGEND, { category: h(D) });
   }, le = (D) => {
+    n(v.TRENDS_HOVER_AREA, { category: D });
+  }, ce = (D) => {
     n(v.TRENDS_HOVER_POINT, { category: D });
   };
   return !L || !H ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ C(
-    dt,
+    ut,
     {
       calendarActions: { onRangeChanged: Y },
       dateRange: S,
@@ -845,18 +845,18 @@ const Lo = h.memo(Io), Xe = ({
                   sx: { pb: l ? 12 : 24, pt: l ? 24 : 48 },
                   children: [
                     /* @__PURE__ */ e(
-                      gt,
+                      pt,
                       {
                         selectedCategoryGuid: O,
                         selectedDateRange: S
                       }
                     ),
-                    /* @__PURE__ */ e(ht, { onTabChange: re, selectedTab: E })
+                    /* @__PURE__ */ e(gt, { onTabChange: ae, selectedTab: E })
                   ]
                 }
               ),
               /* @__PURE__ */ C(x, { alignItems: "center", flexDirection: "row", width: "100%", children: [
-                /* @__PURE__ */ e(W, { flexGrow: 1, children: O && /* @__PURE__ */ C(Te, { onClick: () => ne(""), sx: { p: 0, pr: 5 }, children: [
+                /* @__PURE__ */ e(W, { flexGrow: 1, children: O && /* @__PURE__ */ C(Te, { onClick: () => se(""), sx: { p: 0, pr: 5 }, children: [
                   /* @__PURE__ */ e(He, { name: "arrow_back" }),
                   k.all_categories
                 ] }) }),
@@ -864,19 +864,19 @@ const Lo = h.memo(Io), Xe = ({
               ] }),
               /* @__PURE__ */ C(W, { children: [
                 E === "Chart" && /* @__PURE__ */ e(
-                  So,
+                  wo,
                   {
                     availableHeight: ue,
-                    onClickLegend: ae,
-                    onHoverArea: ie,
+                    onClickLegend: ie,
+                    onHoverArea: le,
                     onHoverLegend: he,
-                    onHoverPoint: le,
+                    onHoverPoint: ce,
                     stackedDatasets: V.stackedDatasets,
                     unstackedDatasets: V.unstackedDatasets
                   }
                 ),
                 E === "Table" && /* @__PURE__ */ e(
-                  pt,
+                  ft,
                   {
                     onClickRow: j,
                     selectedCategory: O,
@@ -888,7 +888,7 @@ const Lo = h.memo(Io), Xe = ({
           }
         ),
         /* @__PURE__ */ e(
-          Ao,
+          Ro,
           {
             categoryGuid: O,
             dateRange: S,
@@ -899,10 +899,10 @@ const Lo = h.memo(Io), Xe = ({
       ]
     }
   );
-}, rs = M(Ro), ko = () => {
-  const { monthlyCategoryTotals: t } = J(), { trends: s } = A(), n = ce(), { availableHeight: o = 300 } = tt(), r = h.useMemo(() => Pt(t), [t]);
+}, as = M(ko), Ho = () => {
+  const { monthlyCategoryTotals: t } = J(), { trends: s } = A(), n = ne(), { availableHeight: o = 300 } = ot(), r = g.useMemo(() => Ft(t), [t]);
   return /* @__PURE__ */ e(
-    Be,
+    Pe,
     {
       baseline: "min",
       colors: [n.palette.primary.main],
@@ -917,17 +917,17 @@ const Lo = h.memo(Io), Xe = ({
       valueFormatterString: "0,0"
     }
   );
-}, Ho = M(ko), No = ({ onPrimaryCtaClick: t, sx: s }) => {
-  const { isAccountDataLoaded: n, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: l } = J(), { isInitialized: a } = Ge(), { trends: u } = A(), { selectedAccounts: c } = ye();
-  return h.useEffect(() => {
+}, No = M(Ho), Wo = ({ onPrimaryCtaClick: t, sx: s }) => {
+  const { isAccountDataLoaded: n, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: l } = J(), { isInitialized: a } = Be(), { trends: u } = A(), { selectedAccounts: c } = ye();
+  return g.useEffect(() => {
     n || o().finally();
   }, []), Ie({
     widgetName: "TrendsMiniWidget",
     isLoaded: l
-  }), h.useEffect(() => {
+  }), g.useEffect(() => {
     a && n && r(c).finally();
   }, [n, a, c]), !n || !a || !l ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
-    Xt,
+    Qt,
     {
       contentStyles: { height: "calc(100% - 72px)", minHeight: 300, ":last-child": { pb: 0 } },
       onPrimaryCtaClick: t,
@@ -935,10 +935,10 @@ const Lo = h.memo(Io), Xe = ({
       subTitle: u.sub_title,
       sx: { height: "100%", ...s },
       title: u.mini_title,
-      children: /* @__PURE__ */ e(Ho, {})
+      children: /* @__PURE__ */ e(No, {})
     }
   );
-}, as = M(No), Wo = 70, Ze = ({
+}, is = M(Wo), Oo = 70, Qe = ({
   title: t,
   totalAmount: s,
   transactionType: n,
@@ -946,10 +946,10 @@ const Lo = h.memo(Io), Xe = ({
   secondaryLabel: r,
   shouldDisplayPercentage: l
 }) => {
-  const { availableWidth: a } = tt(), u = h.useRef(null), c = h.useRef(null), i = Ht(Number(Math.abs(o)), {
+  const { availableWidth: a } = ot(), u = g.useRef(null), c = g.useRef(null), i = Wt(Number(Math.abs(o)), {
     style: "percent",
     minimumIntegerDigits: 1
-  }), y = a === 288 && oe(s, "0,0.00").length > 10 ? oe(s, "0,0") : oe(s, "0,0.00"), g = n === "spending" ? o > 0 : o >= 0, _ = n === "spending" ? "error.main" : "success.main", m = n === "spending" ? "success.main" : "text.secondary", p = u?.current, f = c?.current, T = p && f ? p.scrollWidth > f.clientWidth - Wo : !1;
+  }), y = a === 288 && oe(s, "0,0.00").length > 10 ? oe(s, "0,0") : oe(s, "0,0.00"), m = n === "spending" ? o > 0 : o >= 0, _ = n === "spending" ? "error.main" : "success.main", h = n === "spending" ? "success.main" : "text.secondary", p = u?.current, f = c?.current, T = p && f ? p.scrollWidth > f.clientWidth - Oo : !1;
   return /* @__PURE__ */ C(
     x,
     {
@@ -974,12 +974,12 @@ const Lo = h.memo(Io), Xe = ({
             children: [
               /* @__PURE__ */ e(fe, { color: "text.secondary", variant: "caption", children: t }),
               l && /* @__PURE__ */ C(x, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
-                g ? /* @__PURE__ */ e(Qt, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(qt, { size: 20, sx: { color: m } }),
+                m ? /* @__PURE__ */ e(Jt, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(eo, { size: 20, sx: { color: h } }),
                 /* @__PURE__ */ e(
                   fe,
                   {
                     sx: {
-                      color: g ? _ : m,
+                      color: m ? _ : h,
                       fontWeight: 600
                     },
                     variant: "body2",
@@ -1005,13 +1005,13 @@ const Lo = h.memo(Io), Xe = ({
                 {
                   ref: u,
                   sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
-                  children: /* @__PURE__ */ e(Oe, { children: y })
+                  children: /* @__PURE__ */ e(Ge, { children: y })
                 }
               ),
               l && a >= 450 && !T && /* @__PURE__ */ e(
                 fe,
                 {
-                  color: g ? _ : m,
+                  color: m ? _ : h,
                   variant: "caption",
                   children: r
                 }
@@ -1022,54 +1022,54 @@ const Lo = h.memo(Io), Xe = ({
       ]
     }
   );
-}, Oo = M(() => {
+}, Go = M(() => {
   const { trends: t } = A();
   return /* @__PURE__ */ C(x, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
-    /* @__PURE__ */ e(Jt, { size: 32 }),
+    /* @__PURE__ */ e(to, { size: 32 }),
     /* @__PURE__ */ C(x, { children: [
       /* @__PURE__ */ e(fe, { fontWeight: 600, variant: "body1", children: t.zero_state_content_header }),
       /* @__PURE__ */ e(fe, { color: "text.secondary", variant: "subtitle2", children: t.zero_state_content_description })
     ] })
   ] });
-}), is = M(({ onCtaClick: t }) => {
+}), ls = M(({ onCtaClick: t }) => {
   const { isAccountDataLoaded: s, loadAccountData: n, visibleAccounts: o } = De();
-  h.useEffect(() => {
+  g.useEffect(() => {
     s || n().finally();
   }, []);
   const { onEvent: r } = $(), { monthlyCategoryTotals: l, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: u } = J(), c = {
-    start: Zt(/* @__PURE__ */ new Date(), 1),
+    start: qt(/* @__PURE__ */ new Date(), 1),
     end: /* @__PURE__ */ new Date()
-  }, { trends: i } = A(), { selectedAccounts: y, isInitialized: g } = ye();
+  }, { trends: i } = A(), { selectedAccounts: y, isInitialized: m } = ye();
   Ie({
     widgetName: "TrendsMicroWidget",
     isLoaded: u
-  }), h.useEffect(() => {
-    g && a(y, c.start).then(() => {
+  }), g.useEffect(() => {
+    m && a(y, c.start).then(() => {
       r(v.TRENDS_LOAD_WIDGET, {
         state: o?.length ? "default" : "zeroState"
       });
     });
-  }, [g, y]);
-  const { spendingData: _, incomeData: m } = h.useMemo(
+  }, [m, y]);
+  const { spendingData: _, incomeData: h } = g.useMemo(
     () => ({
-      spendingData: rt(l, c),
-      incomeData: at(l, c)
+      spendingData: at(l, c),
+      incomeData: it(l, c)
     }),
     [l, c]
-  ), [p, f] = _, [T, S] = m, R = ze(f.y, p.y), L = ze(S.y, T.y), w = g && !o?.length, k = () => {
+  ), [p, f] = _, [T, S] = h, R = Ke(f.y, p.y), L = Ke(S.y, T.y), w = m && !o?.length, k = () => {
     r(
       w ? v.TRENDS_CLICK_GET_STARTED : v.TRENDS_CLICK_VIEW_MORE
     ), t();
   };
-  return !u || !g ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
-    no,
+  return !u || !m ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
+    ro,
     {
       className: "mx-trends-microwidget",
       ctaLabel: i.micro_primary_cta_label,
       onCTAClick: k,
       subHeader: w ? void 0 : i.micro_subheader,
       title: i.title,
-      children: w ? /* @__PURE__ */ e(Oo, {}) : /* @__PURE__ */ C(
+      children: w ? /* @__PURE__ */ e(Go, {}) : /* @__PURE__ */ C(
         x,
         {
           sx: {
@@ -1079,7 +1079,7 @@ const Lo = h.memo(Io), Xe = ({
           },
           children: [
             /* @__PURE__ */ e(
-              Ze,
+              Qe,
               {
                 percentage: R,
                 secondaryLabel: i.micro_secondary_label,
@@ -1090,7 +1090,7 @@ const Lo = h.memo(Io), Xe = ({
               }
             ),
             /* @__PURE__ */ e(
-              Ze,
+              Qe,
               {
                 percentage: L,
                 secondaryLabel: i.micro_secondary_label,
@@ -1105,17 +1105,17 @@ const Lo = h.memo(Io), Xe = ({
       )
     }
   );
-}), Go = M(
+}), Bo = M(
   ({ isExpanded: t, onClick: s }) => {
-    const n = ut();
-    return /* @__PURE__ */ e(ao, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(io, { onClick: s, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
+    const n = mt();
+    return /* @__PURE__ */ e(lo, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(co, { onClick: s, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
       x,
       {
         sx: { color: n.palette.primary.main, flexDirection: "row", alignItems: "center" },
         children: [
-          /* @__PURE__ */ e(co, { children: /* @__PURE__ */ e(Q, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
-          /* @__PURE__ */ e(lo, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(eo, {}) : /* @__PURE__ */ e(
-            to,
+          /* @__PURE__ */ e(mo, { children: /* @__PURE__ */ e(Q, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
+          /* @__PURE__ */ e(uo, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(oo, {}) : /* @__PURE__ */ e(
+            no,
             {
               sx: {
                 transition: "transform 0.3s ease-in-out",
@@ -1127,7 +1127,7 @@ const Lo = h.memo(Io), Xe = ({
       }
     ) }) });
   }
-), Qe = M(
+), qe = M(
   ({
     totalAmount: t,
     guid: s,
@@ -1137,63 +1137,73 @@ const Lo = h.memo(Io), Xe = ({
     isLastItem: l = !1,
     showDivider: a = !0
   }) => {
-    const { trends: u } = A(), { onEvent: c } = $(), i = `${o.length} ${o.length === 1 ? u.transaction : u.transactions}`, y = () => {
+    const { trends: u } = A(), { onEvent: c } = $(), i = ne(), y = `${o.length} ${o.length === 1 ? u.transaction : u.transactions}`, m = () => {
       r?.(), c(v.TRENDS_CLICK_LIST_ITEM, {
         ...G,
         listItem: n
       });
     };
-    return /* @__PURE__ */ C(h.Fragment, { children: [
+    return /* @__PURE__ */ C(g.Fragment, { children: [
       /* @__PURE__ */ e(
-        st,
+        rt,
         {
-          leftIcon: s ? /* @__PURE__ */ e(xe, { categoryGuid: s }) : void 0,
-          onClick: y,
+          leftIcon: s ? /* @__PURE__ */ e(
+            xe,
+            {
+              categoryGuid: s,
+              sx: {
+                bgcolor: Mt(Oe(s, i), 0.15),
+                border: `1px solid ${Oe(s, i)}`,
+                color: "text.primary"
+              }
+            }
+          ) : void 0,
+          onClick: m,
           rightContent: oe(Math.abs(t), "0,0.00"),
-          rightIcon: r ? /* @__PURE__ */ e(Dt, {}) : void 0,
-          subtitle: i,
+          rightIcon: r ? /* @__PURE__ */ e(It, {}) : void 0,
+          subtitle: y,
           title: n
         }
       ),
       a && /* @__PURE__ */ e(Ne, { sx: { ml: l ? 24 : 68 } })
     ] }, s);
   }
-), Bo = M(
+), Po = M(
   ({ availableHeight: t = 0, onCategoryClick: s }) => {
-    const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: r } = Ce(), { isLargeDesktop: l, isDesktop: a } = q(), { trends: u } = A(), { onEvent: c } = $(), [i, y] = h.useState(!1), g = a || l;
-    h.useEffect(() => {
+    const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: r } = Ce(), { isLargeDesktop: l, isDesktop: a } = q(), { trends: u } = A(), { onEvent: c } = $(), [i, y] = g.useState(!1), m = a || l;
+    g.useEffect(() => {
       const p = Math.floor(t / 64) - 1, f = o.length + n.length;
-      p !== o.length && (r(g ? Math.max(p, 5) : 5), y(p >= f));
+      p !== o.length && (r(m ? Math.max(p, 5) : 5), y(p >= f));
     }, [t]);
     const _ = () => {
       y(!i), c(v.TRENDS_CLICK_VIEW_MORE, {
         ...G
       });
-    }, m = o.length + (i ? n.length : 0);
-    return /* @__PURE__ */ e(x, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ C(ro, { children: [
-      /* @__PURE__ */ e(x, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Oe, { children: u.categories }) }),
+    }, h = o.length + (i ? n.length : 0);
+    return /* @__PURE__ */ e(x, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ C(io, { children: [
+      /* @__PURE__ */ e(x, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Ge, { children: u.categories }) }),
       o.map((p, f) => /* @__PURE__ */ e(
-        Qe,
+        qe,
         {
           ...p,
-          isLastItem: f === m - 1,
+          isLastItem: f === h - 1,
           onClick: p.transactions.length > 0 ? () => s(p) : void 0,
           showDivider: !0
         },
         p.guid
       )),
       /* @__PURE__ */ e(
-        so,
+        ao,
         {
           in: i,
           sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
           children: n.map((p, f) => {
             const T = o.length + f;
             return /* @__PURE__ */ e(
-              Qe,
+              qe,
               {
                 ...p,
-                isLastItem: T === m - 1,
+                isLastItem: T === h - 1,
                 onClick: p.transactions.length > 0 ? () => s(p) : void 0,
                 showDivider: !0
               },
@@ -1202,21 +1212,21 @@ const Lo = h.memo(Io), Xe = ({
           })
         }
       ),
-      n.length > 0 && /* @__PURE__ */ e(Go, { isExpanded: i, onClick: _ })
+      n.length > 0 && /* @__PURE__ */ e(Bo, { isExpanded: i, onClick: _ })
     ] }) });
   }
-), Po = ({ beats: t, onInsightCardClick: s }) => {
-  const { onEvent: n } = $(), { isMobile: o, isDesktop: r, isLargeDesktop: l } = q(), { beatStore: a, endpoint: u, sessionToken: c } = Ge(), i = r || l, y = i || o ? 1 : 2, g = () => null, _ = (S) => {
+), Vo = ({ beats: t, onInsightCardClick: s }) => {
+  const { onEvent: n } = $(), { isMobile: o, isDesktop: r, isLargeDesktop: l } = q(), { beatStore: a, endpoint: u, sessionToken: c } = Be(), i = r || l, y = i || o ? 1 : 2, m = () => null, _ = (S) => {
     s?.(S), n(v.TRENDS_CLICK_INSIGHT, G);
-  }, m = i ? 200 : 170, p = i ? 170 : 124, f = i ? 56 : 0, T = t.length > 0 ? m + f : p;
-  return /* @__PURE__ */ e(uo, { sx: { height: T }, children: /* @__PURE__ */ e(
-    $t,
+  }, h = i ? 200 : 170, p = i ? 170 : 124, f = i ? 56 : 0, T = t.length > 0 ? h + f : p;
+  return /* @__PURE__ */ e(ho, { sx: { height: T }, children: /* @__PURE__ */ e(
+    Kt,
     {
       areBeatsLoading: a.isLoading,
       beats: t,
       endpoint: u,
       headerSx: { p: 0 },
-      logOutUser: g,
+      logOutUser: m,
       onCardClick: _,
       showBorder: !0,
       showCTAColocatedWithText: !1,
@@ -1230,12 +1240,12 @@ const Lo = h.memo(Io), Xe = ({
       visibleCardsCount: y
     }
   ) });
-}, Vo = M(Po), Fo = M(({ chartLabel: t, chartColor: s }) => {
+}, Fo = M(Vo), $o = M(({ chartLabel: t, chartColor: s }) => {
   const { onEvent: n } = $(), {
     categoryDetailsChartData: { monthlyAmounts: o, tooltipLabels: r }
   } = Ce();
   return /* @__PURE__ */ e(x, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
-    Be,
+    Pe,
     {
       baseline: "min",
       colors: [s],
@@ -1263,14 +1273,14 @@ const Lo = h.memo(Io), Xe = ({
       valueFormatterString: "0,0"
     }
   ) });
-}), $o = M(({ onClose: t }) => {
-  const s = ut(), { is_mobile_webview: n } = ot(), { isDesktop: o, isSmallTablet: r, isTablet: l } = q(), { onEvent: a } = $(), { common: u, trends: c } = A(), { selectedCategoryData: i, selectedDateRangeMonthRange: y } = Ce(), { sortedTransactions: g } = ve(), [_, m] = h.useState(null);
+}), zo = M(({ onClose: t }) => {
+  const s = mt(), { is_mobile_webview: n } = nt(), { isDesktop: o, isSmallTablet: r, isTablet: l } = q(), { onEvent: a } = $(), { common: u, trends: c } = A(), { selectedCategoryData: i, selectedDateRangeMonthRange: y } = Ce(), { sortedTransactions: m } = ve(), [_, h] = g.useState(null);
   if (!i)
     return null;
-  const { guid: p, name: f, is_income: T, totalAmount: S } = i, R = T ? c.category_income : c.category_spending, L = ho(p, s), w = T ? c.income_label : c.spending_label, k = ` ${i.transactions.length === 1 ? c.transaction : c.transactions} (${i.transactions.length})`, H = h.useMemo(
-    () => g.find((E) => E.guid === _),
-    [_, g]
-  ), z = g.length > 0 && !n && (o || l && !r), P = (E) => E.category_guid === p || E.top_level_category_guid === p, K = () => {
+  const { guid: p, name: f, is_income: T, totalAmount: S } = i, R = T ? c.category_income : c.category_spending, L = Oe(p, s), w = T ? c.income_label : c.spending_label, k = ` ${i.transactions.length === 1 ? c.transaction : c.transactions} (${i.transactions.length})`, H = g.useMemo(
+    () => m.find((E) => E.guid === _),
+    [_, m]
+  ), z = m.length > 0 && !n && (o || l && !r), P = (E) => E.category_guid === p || E.top_level_category_guid === p, K = () => {
     t?.(), a(v.TRENDS_CLICK_BACK, G);
   };
   return /* @__PURE__ */ C(
@@ -1283,9 +1293,9 @@ const Lo = h.memo(Io), Xe = ({
       title: R,
       children: [
         /* @__PURE__ */ C(x, { sx: { alignItems: "center", height: "100%" }, children: [
-          /* @__PURE__ */ C(mo, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
+          /* @__PURE__ */ C(go, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
             /* @__PURE__ */ e(
-              st,
+              rt,
               {
                 leftIcon: /* @__PURE__ */ e(xe, { categoryGuid: p }),
                 rightContent: oe(Math.abs(S), "0,0.00"),
@@ -1293,19 +1303,19 @@ const Lo = h.memo(Io), Xe = ({
                 title: f
               }
             ),
-            /* @__PURE__ */ e(Fo, { chartColor: L, chartLabel: w }),
+            /* @__PURE__ */ e($o, { chartColor: L, chartLabel: w }),
             /* @__PURE__ */ C(x, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
               /* @__PURE__ */ e(Q, { bold: !0, variant: "body1", children: k }),
-              z && /* @__PURE__ */ e(go, { filter: P })
+              z && /* @__PURE__ */ e(po, { filter: P })
             ] })
           ] }),
           /* @__PURE__ */ e(
-            lt,
+            ct,
             {
               bgcolor: "transparent",
               filter: P,
               height: "calc(100vh - 475px)",
-              onClick: m
+              onClick: h
             }
           )
         ] }),
@@ -1314,18 +1324,18 @@ const Lo = h.memo(Io), Xe = ({
           {
             ariaLabelClose: u.close_aria,
             isOpen: !!H,
-            onClose: () => m(""),
+            onClose: () => h(""),
             title: c.transaction,
-            children: H && /* @__PURE__ */ e(ct, { transaction: H })
+            children: H && /* @__PURE__ */ e(dt, { transaction: H })
           }
         )
       ]
     }
   );
-}), zo = (t, s) => {
-  const n = at(t, s), o = rt(t, s);
+}), Ko = (t, s) => {
+  const n = it(t, s), o = at(t, s);
   return [n, o].filter((r) => r.length > 0);
-}, Ko = (t, s) => {
+}, Yo = (t, s) => {
   const [n, o] = t, r = n, l = o ?? n, a = [];
   if (r) {
     const u = r.reduce((c, i) => c + i.y, 0);
@@ -1336,25 +1346,25 @@ const Lo = h.memo(Io), Xe = ({
     a.push({ label: s.spending_label, amount: u });
   }
   return a;
-}, Yo = ({
+}, jo = ({
   availableHeight: t = 0,
   minHeight: s = 500,
   selectedDateRange: n,
   totals: o
 }) => {
-  const r = ce(), { onEvent: l } = $(), { trends: a } = A(), { isSmallMobile: u, isMobile: c, isSmallTablet: i, isTablet: y } = q(), g = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = zo(o, n), m = Ko(_, a), [p, f] = h.useState(0), T = 458, S = 195, R = 56, L = c || u ? S : i || y ? T : p;
-  return h.useEffect(() => {
+  const r = ne(), { onEvent: l } = $(), { trends: a } = A(), { isSmallMobile: u, isMobile: c, isSmallTablet: i, isTablet: y } = q(), m = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = Ko(o, n), h = Yo(_, a), [p, f] = g.useState(0), T = 458, S = 195, R = 56, L = c || u ? S : i || y ? T : p;
+  return g.useEffect(() => {
     const k = Math.max(t - R, s);
     f(k);
   }, [t]), /* @__PURE__ */ e(
-    Be,
+    Pe,
     {
       baseline: "min",
-      colors: g,
+      colors: m,
       curveType: "bump",
       datasets: _,
       height: L,
-      labels: m,
+      labels: h,
       onItemClick: () => {
         l(v.TRENDS_CLICK_CHART, G);
       },
@@ -1369,7 +1379,7 @@ const Lo = h.memo(Io), Xe = ({
       valueFormatterString: "0.0a"
     }
   );
-}, jo = M(Yo), Uo = [
+}, Uo = M(jo), Xo = [
   "BillAmountNotStandard",
   "CategorySpendingV2",
   "CostOfLivingToIncome",
@@ -1403,30 +1413,30 @@ const Lo = h.memo(Io), Xe = ({
   "WeeklyNewMerchantsV2",
   "WeeklyNoSpendDays",
   "WeeklySmallPurchasesSummary"
-], Xo = (t, s, n) => ({
+], Zo = (t, s, n) => ({
   description: s ? t.empty_state_sub_text : t.empty_state_sub_text_no_aggregation,
   header: s ? t.zero_state_content_header : t.zero_state_content_header_no_aggregation,
   onClickHandler: s ? n : void 0,
   primaryButton: s ? t.empty_state_primary : void 0
-}), Zo = ({ onBackClick: t, onInsightCardClick: s, sx: n }) => {
-  const { onEvent: o } = $(), { config: r } = ot(), { isDesktop: l, isLargeDesktop: a, isMobile: u } = q(), { isAccountDataLoaded: c, loadAccountData: i, visibleAccounts: y } = De(), {
-    categoriesLoaded: g,
+}), Qo = ({ onBackClick: t, onInsightCardClick: s, sx: n }) => {
+  const { onEvent: o } = $(), { config: r } = nt(), { isDesktop: l, isLargeDesktop: a, isMobile: u } = q(), { isAccountDataLoaded: c, loadAccountData: i, visibleAccounts: y } = De(), {
+    categoriesLoaded: m,
     loadCategories: _,
-    loadDateRangeCategoryTotals: m,
+    loadDateRangeCategoryTotals: h,
     loadMonthlyCategoryTotals: p,
     monthlyCategoryTotals: f,
     monthlyTotalsLoaded: T
-  } = J(), { isTransactionDataLoaded: S, loadTransactionData: R, setFilter: L } = ve(), { selectedDateRange: w, setSelectedCategoryData: k, setSelectedDateRange: H } = Ce(), { isInitialized: z, selectedAccounts: P, selectedAccountGuids: K } = ye(), { trends: E, connect: te } = A(), { beatStore: O } = Ge(), se = po() && r.show_insights_widget_in_master, X = l || a, [de, ue] = h.useState(!1), [V, re] = h.useState(!1), [Y, me] = h.useState("Chart"), [j, ae] = h.useState(""), [he, ie] = h.useState(!1), [le, D] = h.useState(window.innerHeight), F = X ? 56 : 0, d = le - 208, b = le - (se ? 550 + F : 266), [I, U] = h.useState(!1), Ee = r.show_connections_widget_in_master;
+  } = J(), { isTransactionDataLoaded: S, loadTransactionData: R, setFilter: L } = ve(), { selectedDateRange: w, setSelectedCategoryData: k, setSelectedDateRange: H } = Ce(), { isInitialized: z, selectedAccounts: P, selectedAccountGuids: K } = ye(), { trends: E, connect: te } = A(), { beatStore: O } = Be(), re = fo() && r.show_insights_widget_in_master, X = l || a, [de, ue] = g.useState(!1), [V, ae] = g.useState(!1), [Y, me] = g.useState("Chart"), [j, ie] = g.useState(""), [he, le] = g.useState(!1), [ce, D] = g.useState(window.innerHeight), F = X ? 56 : 0, d = ce - 208, b = ce - (re ? 550 + F : 266), [I, U] = g.useState(!1), Ee = r.show_connections_widget_in_master;
   Ie({
     widgetName: "TrendsWidget",
     isLoaded: de
   });
-  const _e = h.useMemo(() => V ? O.getFilteredBeats({ templates: Uo }) : [], [V]);
-  h.useEffect(() => {
+  const _e = g.useMemo(() => V ? O.getFilteredBeats({ templates: Xo }) : [], [V]);
+  g.useEffect(() => {
     const N = () => D(window.innerHeight);
-    return window.addEventListener("resize", N), c || i().finally(), g || _().finally(), S || R().finally(), () => window.removeEventListener("resize", N);
-  }, []), h.useEffect(() => {
-    z && c && (O.loadBeats().finally(() => re(!0)), m(P, w.start, w.end).then(() => {
+    return window.addEventListener("resize", N), c || i().finally(), m || _().finally(), S || R().finally(), () => window.removeEventListener("resize", N);
+  }, []), g.useEffect(() => {
+    z && c && (O.loadBeats().finally(() => ae(!0)), h(P, w.start, w.end).then(() => {
       p(
         P,
         w.start,
@@ -1438,7 +1448,7 @@ const Lo = h.memo(Io), Xe = ({
         time_period: `${Se(w.end, w.start)}M`
       });
     }));
-  }, [z, c, P, w]), h.useEffect(() => {
+  }, [z, c, P, w]), g.useEffect(() => {
     if (f.length !== 0) {
       const N = {
         accounts: K,
@@ -1453,42 +1463,42 @@ const Lo = h.memo(Io), Xe = ({
     }
   }, [f]);
   const ge = (N) => {
-    k(N), ie(!0);
+    k(N), le(!0);
   }, Me = () => {
-    k(null), ie(!1);
+    k(null), le(!1);
   }, Ae = () => {
     U(!0), o(v.TRENDS_CLICK_CONNECT_ACCOUNTS);
-  }, ft = (N, ee) => {
+  }, yt = (N, ee) => {
     me(ee ?? Y), o(v.TRENDS_CLICK_TOGGLE_VIEW, {
       ...G,
       toggleView: ee
     });
-  }, yt = (N) => {
-    const ee = qe(N?.[0], 1), pe = N?.[1], Tt = Se(pe, ee);
+  }, Ct = (N) => {
+    const ee = Je(N?.[0], 1), pe = N?.[1], St = Se(pe, ee);
     H({ start: ee, end: pe }), o(v.TRENDS_CLICK_TIME_WINDOW, {
       ...G,
-      time_period: Tt + "M"
+      time_period: St + "M"
     });
-  }, Ct = (N) => {
+  }, _t = (N) => {
     o(v.TRENDS_CLICK_FILTER, {
       ...G,
       filterValue: N
     });
-  }, _t = (N) => {
-    ae(N);
-  }, bt = () => {
-    ae(""), o(v.TRENDS_CLICK_ALL_CATEGORIES, G);
+  }, bt = (N) => {
+    ie(N);
+  }, Tt = () => {
+    ie(""), o(v.TRENDS_CLICK_ALL_CATEGORIES, G);
   };
   if (!z || !c || !de || !T)
     return /* @__PURE__ */ e(Le, {});
-  const Pe = y.length === 0 || f.length === 0, be = Xo(E, Ee, Ae);
+  const Ve = y.length === 0 || f.length === 0, be = Zo(E, Ee, Ae);
   return /* @__PURE__ */ C(
-    dt,
+    ut,
     {
-      calendarActions: { onRangeChanged: yt },
+      calendarActions: { onRangeChanged: Ct },
       dateRange: w,
       dateRangeVariant: u ? "timeframetabs" : "timeframebuttons",
-      onAccountsFilterClick: Ct,
+      onAccountsFilterClick: _t,
       onBackClick: t,
       sx: n,
       title: E.title,
@@ -1508,22 +1518,22 @@ const Lo = h.memo(Io), Xe = ({
                   sx: { px: u ? 16 : 0, py: 16 },
                   children: [
                     /* @__PURE__ */ e(
-                      gt,
+                      pt,
                       {
                         selectedCategoryGuid: j,
                         selectedDateRange: w
                       }
                     ),
-                    /* @__PURE__ */ e(ht, { onTabChange: ft, selectedTab: Y })
+                    /* @__PURE__ */ e(gt, { onTabChange: yt, selectedTab: Y })
                   ]
                 }
               ),
-              /* @__PURE__ */ e(x, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(W, { flexGrow: 1, children: j && /* @__PURE__ */ C(Te, { onClick: bt, sx: { p: 0, pr: 5 }, children: [
-                /* @__PURE__ */ e(oo, {}),
+              /* @__PURE__ */ e(x, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(W, { flexGrow: 1, children: j && /* @__PURE__ */ C(Te, { onClick: Tt, sx: { p: 0, pr: 5 }, children: [
+                /* @__PURE__ */ e(so, {}),
                 E.all_categories
               ] }) }) }),
-              Pe && /* @__PURE__ */ e(
-                fo,
+              Ve && /* @__PURE__ */ e(
+                yo,
                 {
                   header: be.header,
                   icon: "multiline_chart",
@@ -1533,10 +1543,10 @@ const Lo = h.memo(Io), Xe = ({
                   sx: { height: d, maxWidth: 432 }
                 }
               ),
-              !Pe && /* @__PURE__ */ C(x, { flexDirection: X ? "row" : "column", gap: X ? 48 : 16, children: [
-                Y === "Chart" && /* @__PURE__ */ C(St, { children: [
+              !Ve && /* @__PURE__ */ C(x, { flexDirection: X ? "row" : "column", gap: X ? 48 : 16, children: [
+                Y === "Chart" && /* @__PURE__ */ C(wt, { children: [
                   /* @__PURE__ */ e(W, { sx: { width: X ? "68%" : "100%" }, children: /* @__PURE__ */ e(
-                    jo,
+                    Uo,
                     {
                       availableHeight: d,
                       minHeight: 450,
@@ -1545,15 +1555,15 @@ const Lo = h.memo(Io), Xe = ({
                     }
                   ) }),
                   /* @__PURE__ */ C(x, { gap: 16, sx: { width: X ? "32%" : "100%" }, children: [
-                    se && V && _e.length > 0 && /* @__PURE__ */ e(
-                      Vo,
+                    re && V && _e.length > 0 && /* @__PURE__ */ e(
+                      Fo,
                       {
                         beats: _e,
                         onInsightCardClick: s
                       }
                     ),
                     /* @__PURE__ */ e(
-                      Bo,
+                      Po,
                       {
                         availableHeight: b,
                         onCategoryClick: ge
@@ -1562,21 +1572,21 @@ const Lo = h.memo(Io), Xe = ({
                   ] })
                 ] }),
                 Y === "Table" && /* @__PURE__ */ e(W, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
-                  pt,
+                  ft,
                   {
                     height: "unset",
-                    onClickRow: _t,
+                    onClickRow: bt,
                     selectedCategory: j,
                     selectedDateRange: w
                   }
                 ) })
               ] }),
-              he && /* @__PURE__ */ e($o, { onClose: Me })
+              he && /* @__PURE__ */ e(zo, { onClose: Me })
             ]
           }
         ),
         /* @__PURE__ */ e(
-          yo,
+          Co,
           {
             onClose: () => U(!1),
             showConnectWidget: I,
@@ -1586,11 +1596,11 @@ const Lo = h.memo(Io), Xe = ({
       ]
     }
   );
-}, ls = M(Zo);
+}, cs = M(Qo);
 export {
-  rs as TrendsFullWidget,
-  is as TrendsMicroWidget,
-  as as TrendsMiniWidget,
-  us as TrendsStore,
-  ls as TrendsWidget
+  as as TrendsFullWidget,
+  ls as TrendsMicroWidget,
+  is as TrendsMiniWidget,
+  ms as TrendsStore,
+  cs as TrendsWidget
 };