@mx-cartographer/experiences 8.0.19 → 8.0.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/CHANGELOG.md +8 -4
  2. package/dist/{AccountStore-DpYvNnql.mjs → AccountStore-B7zfcad7.mjs} +1 -1
  3. package/dist/{BudgetUtil-CLhRnCoX.mjs → BudgetUtil-DZpOoZQa.mjs} +1 -1
  4. package/dist/{GlobalAccountFilter-B73Pw1hJ.mjs → GlobalAccountFilter-CmnaZDS6.mjs} +27 -27
  5. package/dist/{Help-DBAosGjO.mjs → Help-BkmSY96v.mjs} +1 -1
  6. package/dist/{ManageIncome-CvfRTf-j.mjs → ManageIncome-BJ7c7plg.mjs} +1 -1
  7. package/dist/{NotificationSettings-D7VqsrZy.mjs → NotificationSettings-DBT37CVB.mjs} +1 -1
  8. package/dist/{RecurringSettings-DJIUgK5A.mjs → RecurringSettings-DnD0AqWa.mjs} +1 -1
  9. package/dist/{SpendingLegend-BCnXkPCD.mjs → SpendingLegend-CypdabwS.mjs} +1 -1
  10. package/dist/{TransactionDetails-KklNHa-s.mjs → TransactionDetails-D6XZakc-.mjs} +1 -1
  11. package/dist/WidgetContainer-DYKMArWw.mjs +468 -0
  12. package/dist/accounts/index.es.js +95 -93
  13. package/dist/budgets/index.es.js +448 -444
  14. package/dist/cashflow/index.es.js +233 -231
  15. package/dist/common/components/GlobalAccountFilter.d.ts +2 -1
  16. package/dist/common/components/WidgetContainer.d.ts +2 -1
  17. package/dist/common/components/WidgetDateRangeSelector.d.ts +12 -0
  18. package/dist/common/hooks/index.d.ts +1 -0
  19. package/dist/common/hooks/useWidgetHeaderStyles.d.ts +32 -0
  20. package/dist/common/index.es.js +133 -132
  21. package/dist/core/types/Widgets.d.ts +1 -0
  22. package/dist/dashboard/index.es.js +3 -3
  23. package/dist/debts/components/actions/DebtsPriorityAction.d.ts +2 -1
  24. package/dist/debts/components/debtspriority/DebtsPriorityButton.d.ts +2 -1
  25. package/dist/debts/index.es.js +589 -587
  26. package/dist/finstrong/FinstrongWidget.d.ts +1 -1
  27. package/dist/finstrong/index.es.js +737 -745
  28. package/dist/goals/GoalsWidget.d.ts +1 -1
  29. package/dist/goals/index.es.js +439 -438
  30. package/dist/help/HelpWidget.d.ts +1 -1
  31. package/dist/help/index.es.js +21 -12
  32. package/dist/investments/InvestmentsWidget.d.ts +1 -1
  33. package/dist/investments/index.es.js +418 -417
  34. package/dist/networth/index.es.js +265 -278
  35. package/dist/notifications/index.es.js +1 -1
  36. package/dist/recurringtransactions/RecurringTransactionsWidget.d.ts +1 -1
  37. package/dist/recurringtransactions/index.es.js +235 -232
  38. package/dist/settings/SettingsWidget.d.ts +1 -1
  39. package/dist/settings/index.es.js +283 -282
  40. package/dist/spending/index.es.js +109 -108
  41. package/dist/transactions/index.es.js +280 -277
  42. package/dist/trends/index.es.js +622 -615
  43. package/dist/{useScreenSize-B6JyS_Lj.mjs → useScreenSize-CUcpY7aJ.mjs} +1 -1
  44. package/package.json +1 -1
  45. package/dist/WidgetContainer-D-pbSa7L.mjs +0 -441
@@ -1,122 +1,122 @@
1
- import { jsxs as C, jsx as e, Fragment as wt } from "react/jsx-runtime";
2
- import g, { useRef as vt, useState as Dt, useEffect as It } from "react";
1
+ import { jsxs as C, jsx as e, Fragment as vt } from "react/jsx-runtime";
2
+ import g, { useRef as Dt, useState as It, useEffect as Lt } from "react";
3
3
  import { observer as A } from "mobx-react-lite";
4
- import { CategoryIcon as we, Text as F, Icon as He, H3 as Ge, P as pe } from "@mxenabled/mxui";
5
- import N from "@mui/material/Box";
4
+ import { CategoryIcon as we, Text as $, Icon as He, H3 as Ge, P as pe } from "@mxenabled/mxui";
5
+ import H from "@mui/material/Box";
6
6
  import S from "@mui/material/Stack";
7
7
  import Te from "@mui/material/Button";
8
8
  import { addSeconds as et } from "date-fns/addSeconds";
9
9
  import { differenceInCalendarMonths as Se } from "date-fns/differenceInCalendarMonths";
10
- import Lt from "numeral";
11
- import { useTheme as ae, styled as Et, alpha as Mt } from "@mui/material/styles";
12
- import { useItemTooltip as At, ChartsTooltipContainer as Rt } from "@mui/x-charts/ChartsTooltip";
13
- import { LineChart as kt } from "@mui/x-charts/LineChart";
14
- import { u as j } from "../useScreenSize-B6JyS_Lj.mjs";
15
- import { u as Ht } from "../useDimensions-CeDR9V8N.mjs";
10
+ import Et from "numeral";
11
+ import { useTheme as re, styled as Mt, alpha as At } from "@mui/material/styles";
12
+ import { useItemTooltip as Rt, ChartsTooltipContainer as kt } from "@mui/x-charts/ChartsTooltip";
13
+ import { LineChart as Ht } from "@mui/x-charts/LineChart";
14
+ import { u as Z } from "../useScreenSize-CUcpY7aJ.mjs";
15
+ import { u as Nt } from "../useDimensions-CeDR9V8N.mjs";
16
16
  import tt from "@mui/material/Card";
17
17
  import ot from "@mui/material/CardContent";
18
18
  import Ne from "@mui/material/Divider";
19
19
  import $e from "@mui/material/Grid";
20
- import { u as R, l as U, g as $, b as fe, h as ve, d as De, B as ye, p as nt, f as Be, a as st } from "../hooks-BxkfR-Ff.mjs";
20
+ import { u as R, l as Q, g as z, b as fe, h as ve, d as De, B as ye, p as nt, f as Be, a as st } from "../hooks-BxkfR-Ff.mjs";
21
21
  import { b as rt } from "../Localization-CPkpIwIx.mjs";
22
22
  import { C as xe } from "../CurrencyText-CA-E5N_y.mjs";
23
- import { C as Re, b as ze, c as Nt } from "../Category-CevNQ03n.mjs";
24
- import { f as Y, D as P } from "../DateFormats-BMpMrZpW.mjs";
25
- import { f as re, a as Wt } from "../NumberFormatting-QCaNwbjv.mjs";
26
- import { c as Ot, a as Ke, g as Gt, L as Bt } from "../TrendsStore-CYdTo7cN.mjs";
27
- import { T as us } from "../TrendsStore-CYdTo7cN.mjs";
28
- import { c as Pt, i as Vt, d as Ft, e as $t, b as at, g as it, f as Ye } from "../SpendingData-Bz1bCWAs.mjs";
29
- import zt from "@mui/material/ToggleButton";
30
- import Kt from "@mui/material/ToggleButtonGroup";
23
+ import { C as Re, b as ze, c as Wt } from "../Category-CevNQ03n.mjs";
24
+ import { f as X, D as G } from "../DateFormats-BMpMrZpW.mjs";
25
+ import { f as se, a as Ot } from "../NumberFormatting-QCaNwbjv.mjs";
26
+ import { c as Gt, a as Ke, g as Bt, L as Pt } from "../TrendsStore-CYdTo7cN.mjs";
27
+ import { T as ms } from "../TrendsStore-CYdTo7cN.mjs";
28
+ import { c as Vt, i as Ft, d as $t, e as zt, b as at, g as it, f as Ye } from "../SpendingData-Bz1bCWAs.mjs";
29
+ import Kt from "@mui/material/ToggleButton";
30
+ import Yt from "@mui/material/ToggleButtonGroup";
31
31
  import { parseISO as lt } from "date-fns/parseISO";
32
32
  import { H as ke } from "../HeaderCell-P8w6CmfO.mjs";
33
- import { T as W, b as Yt } from "../ViewMoreMicroCard-BJOZcYnB.mjs";
34
- import { useGridApiContext as jt, useGridRootProps as Ut, DataGridPro as Xt } from "@mui/x-data-grid-pro";
35
- import Zt from "@mui/material/Badge";
36
- import Qt from "@mui/material/IconButton";
33
+ import { T as W, b as jt } from "../ViewMoreMicroCard-BJOZcYnB.mjs";
34
+ import { useGridApiContext as Ut, useGridRootProps as Xt, DataGridPro as Zt } from "@mui/x-data-grid-pro";
35
+ import Qt from "@mui/material/Badge";
36
+ import qt from "@mui/material/IconButton";
37
37
  import { A as v } from "../Analytics-0Xm_BjHU.mjs";
38
38
  import { T as ct } from "../EmbeddedCard-xngm4vLT.mjs";
39
- import { T as dt } from "../TransactionDetails-KklNHa-s.mjs";
39
+ import { T as dt } from "../TransactionDetails-D6XZakc-.mjs";
40
40
  import { D as Pe } from "../Drawer-Bbe4AMB1.mjs";
41
41
  import { u as Ie } from "../useWidgetLoadTimer-DgN1bTyu.mjs";
42
42
  import { L as Le } from "../Loader-D3rjKx72.mjs";
43
- import { W as ut } from "../WidgetContainer-D-pbSa7L.mjs";
43
+ import { W as ut } from "../WidgetContainer-DYKMArWw.mjs";
44
44
  import { L as Ve } from "../LineChart-EAr5ox5U.mjs";
45
- import { M as qt } from "../MiniWidgetContainer-Bhkv-hpz.mjs";
46
- import { subMonths as Jt } from "date-fns";
47
- import { TrendingUp as eo, TrendingDown as to, MultilineChart as oo, ExpandLess as no, ExpandMore as so, ChevronRight as ro, ArrowBack as ao } from "@mxenabled/mx-icons";
48
- import { M as io } from "../MicroWidgetContainer-B_EnfvCq.mjs";
49
- import lo from "@mui/material/Collapse";
45
+ import { M as Jt } from "../MiniWidgetContainer-Bhkv-hpz.mjs";
46
+ import { subMonths as eo } from "date-fns";
47
+ import { TrendingUp as to, TrendingDown as oo, MultilineChart as no, ExpandLess as so, ExpandMore as ro, ChevronRight as ao, ArrowBack as io } from "@mxenabled/mx-icons";
48
+ import { M as lo } from "../MicroWidgetContainer-B_EnfvCq.mjs";
49
+ import co from "@mui/material/Collapse";
50
50
  import We from "@mui/material/List";
51
51
  import mt from "@mui/material/ListItem";
52
- import co from "@mui/material/ListItemButton";
53
- import uo from "@mui/material/ListItemIcon";
52
+ import uo from "@mui/material/ListItemButton";
53
+ import mo from "@mui/material/ListItemIcon";
54
54
  import ht from "@mui/material/ListItemText";
55
55
  import gt from "@mui/material/styles/useTheme";
56
56
  import { b as Oe } from "../CategoryUtil-BVixr0d5.mjs";
57
- import { Stack as mo } from "@mui/material";
58
- import ho from "@mui/material/ListItemAvatar";
59
- import { E as go } from "../ExportCsvAction-CHCmCCqf.mjs";
60
- import { u as po } from "../useInsightsEnabled-DL_oNyI0.mjs";
61
- import { E as fo } from "../EmptyState-DHAkGsjk.mjs";
62
- import { C as yo } from "../ConnectDrawer-C0wjwcJt.mjs";
63
- const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
64
- const { categories: n } = R(), { getCategoryName: o } = U(), r = o(t);
57
+ import { Stack as ho } from "@mui/material";
58
+ import go from "@mui/material/ListItemAvatar";
59
+ import { E as po } from "../ExportCsvAction-CHCmCCqf.mjs";
60
+ import { u as fo } from "../useInsightsEnabled-DL_oNyI0.mjs";
61
+ import { E as yo } from "../EmptyState-DHAkGsjk.mjs";
62
+ import { C as Co } from "../ConnectDrawer-C0wjwcJt.mjs";
63
+ const pt = ({ categoryGuid: t, topLevelCategoryGuid: n }) => {
64
+ const { categories: s } = R(), { getCategoryName: o } = Q(), r = o(t);
65
65
  return /* @__PURE__ */ C(S, { alignItems: "center", direction: "column", gap: "8", justifyContent: "center", mb: 4, children: [
66
66
  /* @__PURE__ */ e(
67
- N,
67
+ H,
68
68
  {
69
- "aria-label": rt(n.category_icon_label_aria, r),
69
+ "aria-label": rt(s.category_icon_label_aria, r),
70
70
  mb: 4,
71
71
  role: "img",
72
- children: /* @__PURE__ */ e(we, { categoryGuid: s })
72
+ children: /* @__PURE__ */ e(we, { categoryGuid: n })
73
73
  }
74
74
  ),
75
- /* @__PURE__ */ e(F, { variant: "body1", children: r })
75
+ /* @__PURE__ */ e($, { variant: "body1", children: r })
76
76
  ] });
77
- }, Co = ({
78
- categoryGuids: { guid: t, topLevelGuid: s },
79
- hoveredAreaData: n,
77
+ }, _o = ({
78
+ categoryGuids: { guid: t, topLevelGuid: n },
79
+ hoveredAreaData: s,
80
80
  cursorPosition: o,
81
81
  chartContainerRef: r
82
82
  }) => {
83
- const i = ae(), a = vt(null), [c, u] = Dt({ x: o.x, y: o.y });
84
- if (It(() => {
83
+ const c = re(), a = Dt(null), [d, u] = It({ x: o.x, y: o.y });
84
+ if (Lt(() => {
85
85
  (() => {
86
86
  const m = a.current, _ = r.current;
87
87
  if (!m || !_) return;
88
88
  const h = m.getBoundingClientRect(), p = _.getBoundingClientRect();
89
- let f = o.x, T = o.y;
90
- 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), u({ x: f, y: T });
89
+ let y = o.x, T = o.y;
90
+ y + h.width * 2 > p.right ? y = o.x - h.width : y - h.width < p.left && (y = o.x), T + h.height * 2 > p.bottom && (T = o.y - h.height), u({ x: y, y: T });
91
91
  })();
92
- }, [o, r]), !n) return null;
93
- const l = n.reduce((y, m) => y + m.y, 0);
92
+ }, [o, r]), !s) return null;
93
+ const i = s.reduce((f, m) => f + m.y, 0);
94
94
  return /* @__PURE__ */ e(
95
95
  tt,
96
96
  {
97
97
  ref: a,
98
98
  sx: {
99
99
  position: "absolute",
100
- top: c.y,
101
- left: c.x,
100
+ top: d.y,
101
+ left: d.x,
102
102
  width: 250,
103
103
  pointerEvents: "none"
104
104
  },
105
105
  children: /* @__PURE__ */ C(ot, { children: [
106
- /* @__PURE__ */ C(N, { alignItems: "center", display: "flex", flexDirection: "column", children: [
107
- /* @__PURE__ */ e(pt, { categoryGuid: t, topLevelCategoryGuid: s }),
108
- /* @__PURE__ */ e(F, { variant: "body2", children: `${n.length}-month total` }),
109
- /* @__PURE__ */ e(xe, { amount: l, bold: !0, formatString: "0,0", variant: "body2" })
106
+ /* @__PURE__ */ C(H, { alignItems: "center", display: "flex", flexDirection: "column", children: [
107
+ /* @__PURE__ */ e(pt, { categoryGuid: t, topLevelCategoryGuid: n }),
108
+ /* @__PURE__ */ e($, { variant: "body2", children: `${s.length}-month total` }),
109
+ /* @__PURE__ */ e(xe, { amount: i, bold: !0, formatString: "0,0", variant: "body2" })
110
110
  ] }),
111
111
  /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
112
- /* @__PURE__ */ e($e, { container: !0, children: n.map((y, m) => /* @__PURE__ */ C(g.Fragment, { children: [
112
+ /* @__PURE__ */ e($e, { container: !0, children: s.map((f, m) => /* @__PURE__ */ C(g.Fragment, { children: [
113
113
  m > 0 && m % 3 === 0 && /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
114
- /* @__PURE__ */ e($e, { item: !0, xs: 4, children: /* @__PURE__ */ C(N, { alignItems: "center", display: "flex", flexDirection: "column", children: [
115
- /* @__PURE__ */ e(F, { color: i.palette.text.secondary, variant: "caption", children: y.x }),
114
+ /* @__PURE__ */ e($e, { item: !0, xs: 4, children: /* @__PURE__ */ C(H, { alignItems: "center", display: "flex", flexDirection: "column", children: [
115
+ /* @__PURE__ */ e($, { color: c.palette.text.secondary, variant: "caption", children: f.x }),
116
116
  /* @__PURE__ */ e(
117
117
  xe,
118
118
  {
119
- amount: y.y,
119
+ amount: f.y,
120
120
  bold: !0,
121
121
  formatString: "0,0",
122
122
  variant: "body1"
@@ -127,15 +127,15 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
127
127
  ] })
128
128
  }
129
129
  );
130
- }, _o = A(Co), bo = ({
130
+ }, bo = A(_o), To = ({
131
131
  sx: t,
132
- categoryGuids: s,
133
- hoveredLegend: n,
132
+ categoryGuids: n,
133
+ hoveredLegend: s,
134
134
  legendRef: o,
135
135
  onHoverLegend: r,
136
- onClickLegend: i
136
+ onClickLegend: c
137
137
  }) => {
138
- const { isMobile: a } = j(), { getCategoryName: c } = U();
138
+ const { isMobile: a } = Z(), { getCategoryName: d } = Q();
139
139
  return /* @__PURE__ */ e(
140
140
  S,
141
141
  {
@@ -145,12 +145,12 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
145
145
  justifyContent: "start",
146
146
  ref: o,
147
147
  sx: t,
148
- children: s.map(({ guid: u, top_level_guid: l }) => {
149
- const y = n === u, m = Re[u], _ = Re[l], h = m ?? _ ?? Re.default, p = h + "33";
148
+ children: n.map(({ guid: u, top_level_guid: i }) => {
149
+ const f = s === u, m = Re[u], _ = Re[i], h = m ?? _ ?? Re.default, p = h + "33";
150
150
  return /* @__PURE__ */ C(
151
151
  Te,
152
152
  {
153
- onClick: () => i(u),
153
+ onClick: () => c(u),
154
154
  onMouseEnter: () => r(u),
155
155
  onMouseLeave: () => r(null),
156
156
  sx: {
@@ -162,22 +162,22 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
162
162
  paddingX: 8,
163
163
  paddingY: 4,
164
164
  borderRadius: 1,
165
- opacity: y ? 1 : 0.7
165
+ opacity: f ? 1 : 0.7
166
166
  },
167
167
  children: [
168
168
  /* @__PURE__ */ e(
169
- N,
169
+ H,
170
170
  {
171
171
  sx: {
172
172
  width: 16,
173
173
  height: 16,
174
174
  marginRight: a ? 5 : 10,
175
175
  borderRadius: "2px",
176
- backgroundColor: n ? y ? h : p : h
176
+ backgroundColor: s ? f ? h : p : h
177
177
  }
178
178
  }
179
179
  ),
180
- /* @__PURE__ */ e(F, { variant: "body1", children: c(u) })
180
+ /* @__PURE__ */ e($, { variant: "body1", children: d(u) })
181
181
  ]
182
182
  },
183
183
  u
@@ -185,128 +185,128 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
185
185
  })
186
186
  }
187
187
  );
188
- }, To = ({
189
- categoryGuids: { guid: t, topLevelGuid: s },
190
- series: n,
188
+ }, So = ({
189
+ categoryGuids: { guid: t, topLevelGuid: n },
190
+ series: s,
191
191
  xData: o
192
192
  }) => {
193
- const r = At(), i = ae();
193
+ const r = Rt(), c = re();
194
194
  if (!r?.identifier) return null;
195
- const { dataIndex: a, seriesId: c } = r.identifier;
196
- if (a == null || !c) return null;
197
- const l = n.find((m) => m.id === c)?.data?.[a], y = o?.[a];
198
- return l === void 0 || !y ? null : /* @__PURE__ */ e(tt, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(ot, { children: /* @__PURE__ */ C(N, { alignItems: "center", display: "flex", flexDirection: "column", children: [
199
- /* @__PURE__ */ e(pt, { categoryGuid: t, topLevelCategoryGuid: s }),
200
- /* @__PURE__ */ e(F, { color: i.palette.text.secondary, variant: "body2", children: Y(y, P.MONTH_SHORT_YEAR) }),
201
- /* @__PURE__ */ e(xe, { amount: String(l), bold: !0, formatString: "0,0", variant: "body1" })
195
+ const { dataIndex: a, seriesId: d } = r.identifier;
196
+ if (a == null || !d) return null;
197
+ const i = s.find((m) => m.id === d)?.data?.[a], f = o?.[a];
198
+ return i === void 0 || !f ? null : /* @__PURE__ */ e(tt, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(ot, { children: /* @__PURE__ */ C(H, { alignItems: "center", display: "flex", flexDirection: "column", children: [
199
+ /* @__PURE__ */ e(pt, { categoryGuid: t, topLevelCategoryGuid: n }),
200
+ /* @__PURE__ */ e($, { color: c.palette.text.secondary, variant: "body2", children: X(f, G.MONTH_SHORT_YEAR) }),
201
+ /* @__PURE__ */ e(xe, { amount: String(i), bold: !0, formatString: "0,0", variant: "body1" })
202
202
  ] }) }) });
203
- }, So = ({
203
+ }, xo = ({
204
204
  onHoverArea: t,
205
- onHoverPoint: s,
206
- onHoverLegend: n,
205
+ onHoverPoint: n,
206
+ onHoverLegend: s,
207
207
  onClickLegend: o,
208
208
  stackedDatasets: r,
209
- unstackedDatasets: i = [],
209
+ unstackedDatasets: c = [],
210
210
  availableHeight: a = 0,
211
- minimumHeight: c = 350
211
+ minimumHeight: d = 350
212
212
  }) => {
213
- const u = ae(), { isMobile: l } = j(), [y, { height: m }] = Ht(), _ = g.useRef(null), [h, p] = g.useState(0);
213
+ const u = re(), { isMobile: i } = Z(), [f, { height: m }] = Nt(), _ = g.useRef(null), [h, p] = g.useState(0);
214
214
  g.useEffect(() => {
215
- const d = Math.max(a - m, c);
216
- p(d);
215
+ const l = Math.max(a - m, d);
216
+ p(l);
217
217
  }, [a, m]);
218
- const [f, T] = g.useState(null), [x, k] = g.useState({
218
+ const [y, T] = g.useState(null), [N, x] = g.useState({
219
219
  hoveredSeriesId: null,
220
220
  hoveredAreaData: null,
221
221
  isAreaHovered: !1,
222
222
  cursorPos: { x: 0, y: 0 }
223
- }), { hoveredSeriesId: L, hoveredAreaData: E, isAreaHovered: w, cursorPos: M } = x, ie = w && L && E, X = !ie, V = [...r, ...i], Z = V[0]?.dataset.length ?? 0, O = V.flatMap((d) => d.dataset.map((b) => b.x)), G = V.flatMap((d) => d.dataset.map((b) => b.y)), Q = r[0]?.dataset?.map(
224
- (d, b) => r.reduce((I, K) => I + K.dataset[b]?.y || 0, 0)
225
- ) ?? [0], Ce = Math.max(...Q), le = Math.max(
226
- ...i.flatMap((d) => d.dataset.map((b) => b.y))
227
- ), q = Math.floor(Math.min(...G) / 100) * 100, ce = Math.ceil(Math.max(Ce, le) / 100) * 100, z = r.map((d, b) => ({
223
+ }), { hoveredSeriesId: L, hoveredAreaData: M, isAreaHovered: E, cursorPos: w } = N, K = E && L && M, ae = !K, Y = [...r, ...c], q = Y[0]?.dataset.length ?? 0, P = Y.flatMap((l) => l.dataset.map((b) => b.x)), V = Y.flatMap((l) => l.dataset.map((b) => b.y)), O = r[0]?.dataset?.map(
224
+ (l, b) => r.reduce((I, F) => I + F.dataset[b]?.y || 0, 0)
225
+ ) ?? [0], J = Math.max(...O), Ce = Math.max(
226
+ ...c.flatMap((l) => l.dataset.map((b) => b.y))
227
+ ), ie = Math.floor(Math.min(...V) / 100) * 100, ee = Math.ceil(Math.max(J, Ce) / 100) * 100, j = r.map((l, b) => ({
228
228
  id: `stacked-${b}`,
229
- guid: d.category_guid,
230
- top_level_guid: d.top_level_category_guid,
229
+ guid: l.category_guid,
230
+ top_level_guid: l.top_level_category_guid,
231
231
  area: !0,
232
232
  color: r[b].category_color ?? u.palette.primary.main,
233
- data: d.dataset.map((I) => I.y),
233
+ data: l.dataset.map((I) => I.y),
234
234
  label: r[b].category_name,
235
235
  stack: "total",
236
236
  type: "line",
237
237
  highlightScope: { highlight: "item" },
238
- valueFormatter: (I) => re(I, "0,0")
239
- })), J = i.map((d, b) => ({
238
+ valueFormatter: (I) => se(I, "0,0")
239
+ })), oe = c.map((l, b) => ({
240
240
  id: `unstacked-${b}`,
241
- guid: d.category_guid,
242
- top_level_guid: d.top_level_category_guid,
241
+ guid: l.category_guid,
242
+ top_level_guid: l.top_level_category_guid,
243
243
  area: !1,
244
- color: d.category_color,
245
- data: d.dataset.map((I) => I.y),
246
- label: d.category_name,
244
+ color: l.category_color,
245
+ data: l.dataset.map((I) => I.y),
246
+ label: l.category_name,
247
247
  type: "line",
248
- valueFormatter: (I) => re(I, "0,0")
249
- })), ne = [...z, ...J], ee = [
250
- ...z.map(({ guid: d, top_level_guid: b }) => ({
251
- guid: d,
248
+ valueFormatter: (I) => se(I, "0,0")
249
+ })), U = [...j, ...oe], de = [
250
+ ...j.map(({ guid: l, top_level_guid: b }) => ({
251
+ guid: l,
252
252
  top_level_guid: b
253
253
  })),
254
- ...J.map(({ guid: d, top_level_guid: b }) => ({
255
- guid: d,
254
+ ...oe.map(({ guid: l, top_level_guid: b }) => ({
255
+ guid: l,
256
256
  top_level_guid: b
257
257
  }))
258
- ], te = (d) => {
259
- const I = d.startsWith("stacked-") ? r[parseInt(d.split("-")[1])] : i[parseInt(d.split("-")[1])];
258
+ ], B = (l) => {
259
+ const I = l.startsWith("stacked-") ? r[parseInt(l.split("-")[1])] : c[parseInt(l.split("-")[1])];
260
260
  return {
261
261
  guid: I?.category_guid,
262
262
  topLevelGuid: I?.top_level_category_guid
263
263
  };
264
- }, se = (d) => {
265
- T(d), n?.(d ?? "");
266
- }, de = (d) => {
267
- o?.(d ?? "");
268
- }, ue = () => {
269
- const d = te(String(L)).guid;
270
- d && o?.(d);
271
- }, me = (d) => {
272
- const b = String(d?.seriesId), I = te(b).guid, K = ne.find((he) => he.id === b), _e = K && d?.dataIndex !== void 0, Ee = K && d?.dataIndex === void 0;
273
- if (_e)
274
- k({
264
+ }, ue = (l) => {
265
+ T(l), s?.(l ?? "");
266
+ }, ne = (l) => {
267
+ o?.(l ?? "");
268
+ }, le = () => {
269
+ const l = B(String(L)).guid;
270
+ l && o?.(l);
271
+ }, ce = (l) => {
272
+ const b = String(l?.seriesId), I = B(b).guid, F = U.find((he) => he.id === b), Ee = F && l?.dataIndex !== void 0, _e = F && l?.dataIndex === void 0;
273
+ if (Ee)
274
+ x({
275
275
  hoveredSeriesId: b,
276
276
  hoveredAreaData: null,
277
277
  isAreaHovered: !1,
278
- cursorPos: M
279
- }), s?.(I);
280
- else if (Ee) {
281
- const he = K?.data.map((Me, Ae) => ({
282
- x: O[Ae],
278
+ cursorPos: w
279
+ }), n?.(I);
280
+ else if (_e) {
281
+ const he = F?.data.map((Me, Ae) => ({
282
+ x: P[Ae],
283
283
  y: Me
284
284
  })) ?? [];
285
- k({
285
+ x({
286
286
  hoveredSeriesId: b,
287
287
  hoveredAreaData: he,
288
288
  isAreaHovered: !0,
289
- cursorPos: M
289
+ cursorPos: w
290
290
  }), t?.(I);
291
291
  } else
292
- k({
292
+ x({
293
293
  hoveredSeriesId: null,
294
294
  hoveredAreaData: null,
295
295
  isAreaHovered: !1,
296
- cursorPos: M
296
+ cursorPos: w
297
297
  });
298
- }, D = (d) => {
299
- if (d.target instanceof Element && d.target.classList[0]?.includes("MuiMarkElement-root"))
298
+ }, me = (l) => {
299
+ if (l.target instanceof Element && l.target.classList[0]?.includes("MuiMarkElement-root"))
300
300
  return;
301
- const b = d.currentTarget.getBoundingClientRect();
302
- k((I) => ({
301
+ const b = l.currentTarget.getBoundingClientRect();
302
+ x((I) => ({
303
303
  ...I,
304
304
  cursorPos: {
305
- x: d.clientX - b.left,
306
- y: d.clientY - b.top
305
+ x: l.clientX - b.left,
306
+ y: l.clientY - b.top
307
307
  }
308
308
  }));
309
- }, B = {
309
+ }, D = {
310
310
  p: 4,
311
311
  "& .MuiBarLabel-root": {
312
312
  fontSize: 10,
@@ -322,17 +322,17 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
322
322
  '& [class*="MuiLineElement-series-unstacked-"]': {
323
323
  strokeWidth: 3
324
324
  },
325
- ...f && z.reduce((d, b, I) => {
326
- const K = `.MuiAreaElement-series-stacked-${I}`;
327
- return d[K] = {
328
- opacity: z[I].guid === f ? 0.9 : 0.2
329
- }, d;
325
+ ...y && j.reduce((l, b, I) => {
326
+ const F = `.MuiAreaElement-series-stacked-${I}`;
327
+ return l[F] = {
328
+ opacity: j[I].guid === y ? 0.9 : 0.2
329
+ }, l;
330
330
  }, {})
331
331
  };
332
332
  return /* @__PURE__ */ e(
333
- N,
333
+ H,
334
334
  {
335
- onMouseMove: D,
335
+ onMouseMove: me,
336
336
  ref: _,
337
337
  sx: {
338
338
  position: "relative",
@@ -353,68 +353,68 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
353
353
  sx: { width: "100%", position: "relative" },
354
354
  children: [
355
355
  /* @__PURE__ */ e(
356
- kt,
356
+ Ht,
357
357
  {
358
358
  height: h,
359
359
  hideLegend: !0,
360
360
  margin: { bottom: 24, left: 12, right: 54, top: 48 },
361
- onAreaClick: ue,
362
- onHighlightChange: me,
363
- series: ne,
361
+ onAreaClick: le,
362
+ onHighlightChange: ce,
363
+ series: U,
364
364
  skipAnimation: !0,
365
365
  slotProps: {
366
- tooltip: { trigger: X ? "item" : "none" }
366
+ tooltip: { trigger: ae ? "item" : "none" }
367
367
  },
368
368
  slots: {
369
- tooltip: X && L ? (d) => /* @__PURE__ */ e(Rt, { children: /* @__PURE__ */ e(
370
- To,
369
+ tooltip: ae && L ? (l) => /* @__PURE__ */ e(kt, { children: /* @__PURE__ */ e(
370
+ So,
371
371
  {
372
- ...d,
373
- categoryGuids: te(L),
374
- series: ne,
375
- xData: O
372
+ ...l,
373
+ categoryGuids: B(L),
374
+ series: U,
375
+ xData: P
376
376
  }
377
377
  ) }) : void 0
378
378
  },
379
- sx: B,
379
+ sx: D,
380
380
  xAxis: [
381
381
  {
382
- data: O,
382
+ data: P,
383
383
  scaleType: "time",
384
- valueFormatter: (d) => Y(d, P.MONTH_SHORT_YEAR),
385
- tickNumber: Z
384
+ valueFormatter: (l) => X(l, G.MONTH_SHORT_YEAR),
385
+ tickNumber: q
386
386
  // How many ticks to show on the x-axis
387
387
  }
388
388
  ],
389
389
  yAxis: [
390
390
  {
391
- min: q,
392
- max: ce || 100,
393
- valueFormatter: (d) => Lt(d).format("0a")
391
+ min: ie,
392
+ max: ee || 100,
393
+ valueFormatter: (l) => Et(l).format("0a")
394
394
  }
395
395
  ]
396
396
  }
397
397
  ),
398
398
  /* @__PURE__ */ e(
399
- bo,
399
+ To,
400
400
  {
401
- categoryGuids: ee,
402
- hoveredLegend: f,
403
- legendRef: y,
404
- onClickLegend: de,
405
- onHoverLegend: se,
406
- sx: { px: l ? 0 : 24 }
401
+ categoryGuids: de,
402
+ hoveredLegend: y,
403
+ legendRef: f,
404
+ onClickLegend: ne,
405
+ onHoverLegend: ue,
406
+ sx: { px: i ? 0 : 24 }
407
407
  }
408
408
  ),
409
- ie && /* @__PURE__ */ e(
410
- _o,
409
+ K && /* @__PURE__ */ e(
410
+ bo,
411
411
  {
412
- categoryGuids: te(L),
412
+ categoryGuids: B(L),
413
413
  chartContainerRef: _,
414
- cursorPosition: M,
415
- hoveredAreaData: E.map((d) => ({
416
- ...d,
417
- x: Y(d.x, P.MONTH_SHORT_YEAR)
414
+ cursorPosition: w,
415
+ hoveredAreaData: M.map((l) => ({
416
+ ...l,
417
+ x: X(l.x, G.MONTH_SHORT_YEAR)
418
418
  }))
419
419
  }
420
420
  )
@@ -423,20 +423,20 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
423
423
  )
424
424
  }
425
425
  );
426
- }, ft = ({ selectedTab: t, onTabChange: s }) => {
427
- const { common: n } = R();
426
+ }, ft = ({ selectedTab: t, onTabChange: n }) => {
427
+ const { common: s } = R();
428
428
  return /* @__PURE__ */ e(
429
- Kt,
429
+ Yt,
430
430
  {
431
- "aria-label": n.view_toggle,
431
+ "aria-label": s.view_toggle,
432
432
  exclusive: !0,
433
- onChange: s,
433
+ onChange: n,
434
434
  orientation: "horizontal",
435
435
  value: t,
436
436
  children: ["Chart", "Table"].map((o) => /* @__PURE__ */ e(
437
- zt,
437
+ Kt,
438
438
  {
439
- "aria-label": o === "Chart" ? n.view_chart : n.view_table,
439
+ "aria-label": o === "Chart" ? s.view_chart : s.view_table,
440
440
  "aria-pressed": t === o,
441
441
  color: "primary",
442
442
  sx: { width: 56 },
@@ -447,21 +447,21 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
447
447
  ))
448
448
  }
449
449
  );
450
- }, yt = ({ selectedDateRange: t, selectedCategoryGuid: s }) => {
451
- const { trends: n } = R(), { isMobile: o, isDesktop: r } = j(), { getCategoryName: i } = U(), a = g.useMemo(() => {
452
- const l = t.start.getFullYear() === t.end.getFullYear() ? Y(
450
+ }, yt = ({ selectedDateRange: t, selectedCategoryGuid: n }) => {
451
+ const { trends: s } = R(), { isMobile: o, isDesktop: r } = Z(), { getCategoryName: c } = Q(), a = g.useMemo(() => {
452
+ const i = t.start.getFullYear() === t.end.getFullYear() ? X(
453
453
  t.start,
454
- o ? P.MONTH_SHORT : P.MONTH_LONG
455
- ) : Y(
454
+ o ? G.MONTH_SHORT : G.MONTH_LONG
455
+ ) : X(
456
456
  t.start,
457
- o ? P.MONTH_SHORT_YEAR : P.MONTH_YEAR
458
- ), y = Y(
457
+ o ? G.MONTH_SHORT_YEAR : G.MONTH_YEAR
458
+ ), f = X(
459
459
  t.end,
460
- o ? P.MONTH_SHORT_YEAR : P.MONTH_YEAR
460
+ o ? G.MONTH_SHORT_YEAR : G.MONTH_YEAR
461
461
  );
462
- return `${l} - ${y}`;
463
- }, [t, o]), u = i(s) || (o ? n.sub_title : n.sub_title_by_category);
464
- return /* @__PURE__ */ C(N, { children: [
462
+ return `${i} - ${f}`;
463
+ }, [t, o]), u = c(n) || (o ? s.sub_title : s.sub_title_by_category);
464
+ return /* @__PURE__ */ C(H, { children: [
465
465
  /* @__PURE__ */ e(
466
466
  Ge,
467
467
  {
@@ -474,56 +474,56 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
474
474
  children: u
475
475
  }
476
476
  ),
477
- /* @__PURE__ */ e(F, { variant: r ? "subtitle1" : "body2", children: a })
477
+ /* @__PURE__ */ e($, { variant: r ? "subtitle1" : "body2", children: a })
478
478
  ] });
479
- }, xo = (t) => {
480
- const s = t.id === "total";
479
+ }, wo = (t) => {
480
+ const n = t.id === "total";
481
481
  return /* @__PURE__ */ C(S, { alignItems: "center", direction: "row", role: "rowheader", tabIndex: t.tabIndex, children: [
482
- !s && /* @__PURE__ */ e(N, { "aria-hidden": !0, children: /* @__PURE__ */ e(we, { categoryGuid: t.row.top_level_category_guid, variant: "twotone" }) }),
483
- /* @__PURE__ */ e(F, { bold: s, sx: { ml: 12 }, variant: s ? "body1" : "body2", children: t.row.category })
482
+ !n && /* @__PURE__ */ e(H, { "aria-hidden": !0, children: /* @__PURE__ */ e(we, { categoryGuid: t.row.top_level_category_guid, variant: "twotone" }) }),
483
+ /* @__PURE__ */ e($, { bold: n, sx: { ml: 12 }, variant: n ? "body1" : "body2", children: t.row.category })
484
484
  ] });
485
485
  }, je = (t) => {
486
- const s = t.row.category_guid, n = t.row.top_level_category_guid, o = s === ze.INCOME || n === ze.INCOME, r = t.id === "total", i = t.field === "total", a = i ? t.row[t.field] : t.row.monthlyAmounts[t.field];
486
+ const n = t.row.category_guid, s = t.row.top_level_category_guid, o = n === ze.INCOME || s === ze.INCOME, r = t.id === "total", c = t.field === "total", a = c ? t.row[t.field] : t.row.monthlyAmounts[t.field];
487
487
  return /* @__PURE__ */ e(S, { alignItems: "flex-end", direction: "row", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(
488
488
  xe,
489
489
  {
490
490
  amount: o ? Math.abs(a) : a,
491
491
  isIncome: o,
492
- sx: { fontWeight: o || i || r ? 600 : 500 },
492
+ sx: { fontWeight: o || c || r ? 600 : 500 },
493
493
  symbol: o ? "+" : void 0,
494
494
  variant: r ? "body1" : "body2"
495
495
  }
496
496
  ) });
497
- }, Ue = (t, s) => {
498
- const n = Y(lt(s.isoDate), P.MONTH_LONG);
499
- return t[n] = s.amount, t;
500
- }, Xe = (t) => (s, n) => {
501
- const o = Y(lt(n.isoDate), P.MONTH_LONG);
502
- return s + (t.includes(o) ? n.amount : 0);
503
- }, wo = (t, s) => {
504
- const n = [], o = new Date(t);
505
- for (; o <= s; ) {
506
- const r = Y(o, P.MONTH_LONG);
507
- n.push(r), o.setMonth(o.getMonth() + 1);
497
+ }, Ue = (t, n) => {
498
+ const s = X(lt(n.isoDate), G.MONTH_LONG);
499
+ return t[s] = n.amount, t;
500
+ }, Xe = (t) => (n, s) => {
501
+ const o = X(lt(s.isoDate), G.MONTH_LONG);
502
+ return n + (t.includes(o) ? s.amount : 0);
503
+ }, vo = (t, n) => {
504
+ const s = [], o = new Date(t);
505
+ for (; o <= n; ) {
506
+ const r = X(o, G.MONTH_LONG);
507
+ s.push(r), o.setMonth(o.getMonth() + 1);
508
508
  }
509
- return n;
510
- }, vo = (t, s) => {
511
- const n = {
509
+ return s;
510
+ }, Do = (t, n) => {
511
+ const s = {
512
512
  field: "category",
513
513
  flex: 1,
514
514
  headerClassName: "trends-table-header",
515
- headerName: s.category_title,
515
+ headerName: n.category_title,
516
516
  minWidth: 210,
517
517
  renderHeader: ke,
518
- renderCell: xo,
518
+ renderCell: wo,
519
519
  sortable: !0,
520
- sortComparator: Ot,
520
+ sortComparator: Gt,
521
521
  type: "string"
522
- }, o = t.map((i) => ({
523
- field: i,
522
+ }, o = t.map((c) => ({
523
+ field: c,
524
524
  flex: 1,
525
525
  headerClassName: "trends-table-header",
526
- headerName: i,
526
+ headerName: c,
527
527
  minWidth: 100,
528
528
  renderHeader: ke,
529
529
  renderCell: je,
@@ -533,12 +533,12 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
533
533
  hideSortIcons: !1,
534
534
  type: "number",
535
535
  sortComparator: Ke,
536
- valueGetter: (a, c) => c.monthlyAmounts?.[i] ?? 0
536
+ valueGetter: (a, d) => d.monthlyAmounts?.[c] ?? 0
537
537
  })), r = {
538
538
  field: "total",
539
539
  flex: 1,
540
540
  headerClassName: "trends-table-header",
541
- headerName: s.table_column_total,
541
+ headerName: n.table_column_total,
542
542
  minWidth: 100,
543
543
  renderHeader: ke,
544
544
  renderCell: je,
@@ -549,25 +549,25 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
549
549
  type: "number",
550
550
  sortComparator: Ke
551
551
  };
552
- return [n, ...o, r];
553
- }, Ze = (t, s, n, o, r) => {
554
- const i = t.filter((a) => a.is_income === n).map((a) => {
555
- let c = a.totalMonthlyAmounts;
556
- return r && (c = a.monthlyAmounts), {
552
+ return [s, ...o, r];
553
+ }, Ze = (t, n, s, o, r) => {
554
+ const c = t.filter((a) => a.is_income === s).map((a) => {
555
+ let d = a.totalMonthlyAmounts;
556
+ return r && (d = a.monthlyAmounts), {
557
557
  id: a.guid,
558
558
  category: a.name,
559
559
  category_guid: a.guid,
560
560
  isParent: !1,
561
561
  top_level_category_guid: a.parent_guid || a.guid,
562
- total: c.reduce(Xe(o), 0),
563
- monthlyAmounts: c.reduce(Ue, {})
562
+ total: d.reduce(Xe(o), 0),
563
+ monthlyAmounts: d.reduce(Ue, {})
564
564
  };
565
565
  });
566
- if (r && r.is_income === n) {
566
+ if (r && r.is_income === s) {
567
567
  const a = r.monthlyAmounts.reduce(Xe(o), 0);
568
- a !== 0 && i.push({
568
+ a !== 0 && c.push({
569
569
  id: `sub-${r.guid}`,
570
- category: rt(s.category_general, r.name),
570
+ category: rt(n.category_general, r.name),
571
571
  category_guid: r.guid,
572
572
  isParent: !0,
573
573
  top_level_category_guid: r.guid,
@@ -575,52 +575,52 @@ const pt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
575
575
  monthlyAmounts: r.monthlyAmounts.reduce(Ue, {})
576
576
  });
577
577
  }
578
- return i;
579
- }, Do = Et("div")({
578
+ return c;
579
+ }, Io = Mt("div")({
580
580
  display: "flex",
581
581
  visibility: "hidden",
582
582
  width: 0
583
583
  });
584
- function Io({
584
+ function Lo({
585
585
  direction: t,
586
- index: s,
587
- sortingOrder: n,
586
+ index: n,
587
+ sortingOrder: s,
588
588
  disabled: o,
589
589
  className: r,
590
- field: i
590
+ field: c
591
591
  }) {
592
- const a = jt(), c = Ut();
592
+ const a = Ut(), d = Xt();
593
593
  let u = null;
594
- const l = {};
595
- if (t === "asc" ? u = c.slots.columnSortedAscendingIcon : t === "desc" ? u = c.slots.columnSortedDescendingIcon : (u = c.slots.columnUnsortedIcon ?? null, l.sortingOrder = n), !u) return null;
596
- const m = a.current.getColumn(i)?.headerName ?? i;
594
+ const i = {};
595
+ if (t === "asc" ? u = d.slots.columnSortedAscendingIcon : t === "desc" ? u = d.slots.columnSortedDescendingIcon : (u = d.slots.columnUnsortedIcon ?? null, i.sortingOrder = s), !u) return null;
596
+ const m = a.current.getColumn(c)?.headerName ?? c;
597
597
  let _ = "";
598
598
  t === "asc" ? _ = ", sorted ascending" : t === "desc" && (_ = ", sorted descending");
599
- const h = ["Total", "Category"].includes(m) ? "" : " category totals", p = `Sort by ${m}${h}${_}`, f = /* @__PURE__ */ e(u, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...l }), T = /* @__PURE__ */ e(
600
- Qt,
599
+ const h = ["Total", "Category"].includes(m) ? "" : " category totals", p = `Sort by ${m}${h}${_}`, y = /* @__PURE__ */ e(u, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...i }), T = /* @__PURE__ */ e(
600
+ qt,
601
601
  {
602
602
  disabled: o,
603
603
  size: "small",
604
604
  tabIndex: -1,
605
- ...c.slotProps?.baseIconButton,
605
+ ...d.slotProps?.baseIconButton,
606
606
  "aria-label": p,
607
607
  className: `MuiDataGrid-sortButton${r ? ` ${r}` : ""}`,
608
608
  title: p,
609
- children: f
609
+ children: y
610
610
  }
611
611
  );
612
- return /* @__PURE__ */ e(Do, { className: "MuiDataGrid-iconButtonContainer", children: s != null ? /* @__PURE__ */ e(Zt, { badgeContent: s, color: "default", overlap: "circular", children: T }) : T });
612
+ return /* @__PURE__ */ e(Io, { className: "MuiDataGrid-iconButtonContainer", children: n != null ? /* @__PURE__ */ e(Qt, { badgeContent: n, color: "default", overlap: "circular", children: T }) : T });
613
613
  }
614
- const Lo = g.memo(Io), Qe = ({
614
+ const Eo = g.memo(Lo), Qe = ({
615
615
  columns: t,
616
- onRowClick: s,
617
- parentCategory: n,
616
+ onRowClick: n,
617
+ parentCategory: s,
618
618
  rows: o,
619
619
  totalRow: r
620
620
  }) => {
621
- const i = ae(), { onEvent: a } = $(), c = i.palette.mode === "light";
621
+ const c = re(), { onEvent: a } = z(), d = c.palette.mode === "light";
622
622
  return /* @__PURE__ */ e(
623
- Xt,
623
+ Zt,
624
624
  {
625
625
  columns: t,
626
626
  disableColumnFilter: !0,
@@ -628,9 +628,9 @@ const Lo = g.memo(Io), Qe = ({
628
628
  hideFooter: !0,
629
629
  initialState: { sorting: { sortModel: [{ field: "category", sort: "asc" }] } },
630
630
  onRowClick: (u) => {
631
- n || s?.(u.row.category_guid), a(v.TRENDS_CLICK_LIST_ITEM, {
631
+ s || n?.(u.row.category_guid), a(v.TRENDS_CLICK_LIST_ITEM, {
632
632
  ...W,
633
- listItem: Nt[u.row.category_guid]
633
+ listItem: Wt[u.row.category_guid]
634
634
  });
635
635
  },
636
636
  pinnedRows: {
@@ -639,7 +639,7 @@ const Lo = g.memo(Io), Qe = ({
639
639
  rowHeight: 64,
640
640
  rows: o,
641
641
  slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
642
- slots: { columnHeaderSortIcon: Lo },
642
+ slots: { columnHeaderSortIcon: Eo },
643
643
  sortingOrder: ["asc", "desc"],
644
644
  sx: {
645
645
  borderColor: "divider",
@@ -647,43 +647,43 @@ const Lo = g.memo(Io), Qe = ({
647
647
  borderStyle: "solid",
648
648
  borderRadius: 2,
649
649
  "& .MuiDataGrid-columnHeaders": {
650
- bgcolor: c ? "neutral.50" : "neutral.800",
650
+ bgcolor: d ? "neutral.50" : "neutral.800",
651
651
  borderBottom: "none"
652
652
  },
653
653
  "& .trends-table-header": {
654
- bgcolor: c ? "neutral.50" : "neutral.800"
654
+ bgcolor: d ? "neutral.50" : "neutral.800"
655
655
  }
656
656
  }
657
657
  }
658
658
  );
659
659
  }, Ct = ({
660
660
  selectedDateRange: t,
661
- selectedCategory: s,
662
- onClickRow: n,
661
+ selectedCategory: n,
662
+ onClickRow: s,
663
663
  height: o = "100%",
664
664
  sx: r = {}
665
665
  }) => {
666
- const { trends: i } = R(), { trendsCategories: a } = U(), c = g.useMemo(() => wo(t.start, t.end), [t]), u = g.useMemo(() => vo(c, i), [c, i]), l = g.useMemo(() => {
667
- if (s)
668
- return a.find((h) => h.guid === s);
669
- }, [s, a]), [y, m] = g.useMemo(() => {
666
+ const { trends: c } = R(), { trendsCategories: a } = Q(), d = g.useMemo(() => vo(t.start, t.end), [t]), u = g.useMemo(() => Do(d, c), [d, c]), i = g.useMemo(() => {
667
+ if (n)
668
+ return a.find((h) => h.guid === n);
669
+ }, [n, a]), [f, m] = g.useMemo(() => {
670
670
  let h = a;
671
- return l && (h = l.subCategories.filter(
672
- (p) => p.monthlyAmounts.some((f) => f.amount !== 0)
671
+ return i && (h = i.subCategories.filter(
672
+ (p) => p.monthlyAmounts.some((y) => y.amount !== 0)
673
673
  )), [
674
- Ze(h, i, !0, c, l),
675
- Ze(h, i, !1, c, l)
674
+ Ze(h, c, !0, d, i),
675
+ Ze(h, c, !1, d, i)
676
676
  ];
677
- }, [a, c, l, i]), _ = {
677
+ }, [a, d, i, c]), _ = {
678
678
  id: "total",
679
- category: i.table_column_total,
679
+ category: c.table_column_total,
680
680
  category_guid: "total",
681
681
  isParent: !1,
682
682
  top_level_category_guid: "total",
683
683
  total: m.reduce((h, p) => h + p.total, 0),
684
684
  monthlyAmounts: m.reduce(
685
- (h, p) => (Object.entries(p.monthlyAmounts).forEach(([f, T]) => {
686
- h[f] = (h[f] || 0) + T;
685
+ (h, p) => (Object.entries(p.monthlyAmounts).forEach(([y, T]) => {
686
+ h[y] = (h[y] || 0) + T;
687
687
  }), h),
688
688
  {}
689
689
  )
@@ -694,21 +694,21 @@ const Lo = g.memo(Io), Qe = ({
694
694
  gap: 24,
695
695
  sx: { height: o, width: "100%", overflowX: "auto", boxShadow: "none", ...r },
696
696
  children: [
697
- (!l || l && l.is_income) && /* @__PURE__ */ e(
697
+ (!i || i && i.is_income) && /* @__PURE__ */ e(
698
698
  Qe,
699
699
  {
700
700
  columns: u,
701
- onRowClick: n,
702
- parentCategory: l,
703
- rows: y
701
+ onRowClick: s,
702
+ parentCategory: i,
703
+ rows: f
704
704
  }
705
705
  ),
706
- (!l || l && !l.is_income) && /* @__PURE__ */ e(
706
+ (!i || i && !i.is_income) && /* @__PURE__ */ e(
707
707
  Qe,
708
708
  {
709
709
  columns: u,
710
- onRowClick: n,
711
- parentCategory: l,
710
+ onRowClick: s,
711
+ parentCategory: i,
712
712
  rows: m,
713
713
  totalRow: _
714
714
  }
@@ -716,116 +716,117 @@ const Lo = g.memo(Io), Qe = ({
716
716
  ]
717
717
  }
718
718
  );
719
- }, Eo = {
719
+ }, Mo = {
720
720
  title: "Transaction List"
721
- }, Mo = ({
721
+ }, Ao = ({
722
722
  categoryGuid: t,
723
- dateRange: s,
724
- isOpen: n,
723
+ dateRange: n,
724
+ isOpen: s,
725
725
  onClose: o
726
726
  }) => {
727
- const { onEvent: r } = $(), { selectedAccountGuids: i } = fe(), { common: a } = R(), { setFilter: c, sortedTransactions: u } = ve(), [l, y] = g.useState(""), m = g.useMemo(
728
- () => u.find((h) => h.guid === l),
729
- [l, u]
727
+ const { onEvent: r } = z(), { selectedAccountGuids: c } = fe(), { common: a } = R(), { setFilter: d, sortedTransactions: u } = ve(), [i, f] = g.useState(""), m = g.useMemo(
728
+ () => u.find((h) => h.guid === i),
729
+ [i, u]
730
730
  );
731
731
  g.useEffect(() => {
732
- c({
733
- accounts: i,
734
- dateRange: s,
732
+ d({
733
+ accounts: c,
734
+ dateRange: n,
735
735
  custom: (h) => t === "" || t === h.category_guid || t === h.top_level_category_guid,
736
736
  showSplits: !!t
737
737
  });
738
- }, [i, t, s]), g.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
738
+ }, [c, t, n]), g.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
739
739
  const _ = () => {
740
- y(""), o();
740
+ f(""), o();
741
741
  };
742
742
  return /* @__PURE__ */ C(
743
743
  Pe,
744
744
  {
745
745
  ariaLabelClose: a.close_aria,
746
- isOpen: n,
746
+ isOpen: s,
747
747
  onClose: _,
748
- title: Eo.title,
748
+ title: Mo.title,
749
749
  children: [
750
750
  m && /* @__PURE__ */ e(dt, { transaction: m }),
751
- !m && /* @__PURE__ */ e(ct, { onClick: y })
751
+ !m && /* @__PURE__ */ e(ct, { onClick: f })
752
752
  ]
753
753
  }
754
754
  );
755
- }, Ao = A(Mo), Ro = ({ onBackClick: t, sx: s }) => {
756
- const { onEvent: n } = $(), { isDesktop: o, isTablet: r, isMobile: i } = j(), { isAccountDataLoaded: a, loadAccountData: c } = De(), {
757
- categoriesLoaded: u,
758
- loadCategories: l,
759
- loadDateRangeCategoryTotals: y,
760
- loadMonthlyCategoryTotals: m,
761
- monthlyCategoryTotals: _,
762
- getCategoryName: h
763
- } = U(), {
764
- isTransactionDataLoaded: p,
765
- loadTransactionData: f,
766
- sortedTransactions: T
767
- } = ve(), { selectedDateRange: x, setSelectedDateRange: k } = ye(), { isInitialized: L, selectedAccounts: E } = fe(), { trends: w } = R(), [M, ie] = g.useState(!1), [X, V] = g.useState(!1), [Z, O] = g.useState("Chart"), [G, Q] = g.useState(""), [Ce, le] = g.useState(window.innerHeight), ce = Ce - (i ? 315 : 345);
755
+ }, Ro = A(Ao), ko = ({ onBackClick: t, onMenuClick: n, sx: s }) => {
756
+ const { onEvent: o } = z(), { isDesktop: r, isTablet: c, isMobile: a } = Z(), { isAccountDataLoaded: d, loadAccountData: u } = De(), {
757
+ categoriesLoaded: i,
758
+ loadCategories: f,
759
+ loadDateRangeCategoryTotals: m,
760
+ loadMonthlyCategoryTotals: _,
761
+ monthlyCategoryTotals: h,
762
+ getCategoryName: p
763
+ } = Q(), {
764
+ isTransactionDataLoaded: y,
765
+ loadTransactionData: T,
766
+ sortedTransactions: N
767
+ } = ve(), { selectedDateRange: x, setSelectedDateRange: L } = ye(), { isInitialized: M, selectedAccounts: E } = fe(), { trends: w } = R(), [K, ae] = g.useState(!1), [Y, q] = g.useState(!1), [P, V] = g.useState("Chart"), [O, J] = g.useState(""), [Ce, ie] = g.useState(window.innerHeight), j = Ce - (a ? 315 : 345);
768
768
  Ie({
769
769
  widgetName: "TrendsFullWidget",
770
- isLoaded: M
770
+ isLoaded: K
771
771
  }), g.useEffect(() => {
772
- const D = () => le(window.innerHeight);
773
- return window.addEventListener("resize", D), a || c().finally(), u || l().finally(), p || f().finally(), () => window.removeEventListener("resize", D);
772
+ const D = () => ie(window.innerHeight);
773
+ return window.addEventListener("resize", D), d || u().finally(), i || f().finally(), y || T().finally(), () => window.removeEventListener("resize", D);
774
774
  }, []), g.useEffect(() => {
775
- L && y(E, x.start, x.end).then(() => {
776
- m(
775
+ M && m(E, x.start, x.end).then(() => {
776
+ _(
777
777
  E,
778
778
  x.start,
779
779
  x.end
780
780
  );
781
781
  }).finally(() => {
782
- ie(!0), n(v.TRENDS_LOAD_WIDGET, {
782
+ ae(!0), o(v.TRENDS_LOAD_WIDGET, {
783
783
  ...W,
784
784
  time_period: `${Se(x.end, x.start)}M`
785
785
  });
786
786
  });
787
- }, [L, E, x]);
788
- const z = g.useMemo(() => {
789
- if (!M) return { stackedDatasets: [], unstackedDatasets: [] };
790
- const D = Gt(
791
- _,
787
+ }, [M, E, x]);
788
+ const oe = g.useMemo(() => {
789
+ if (!K) return { stackedDatasets: [], unstackedDatasets: [] };
790
+ const D = Bt(
791
+ h,
792
792
  x.start,
793
793
  x.end
794
- ), B = G.length ? D.filter(
795
- (d) => d.top_level_category_guid === G || d.category_guid === G
796
- ) : Pt(D);
794
+ ), l = O.length ? D.filter(
795
+ (b) => b.top_level_category_guid === O || b.category_guid === O
796
+ ) : Vt(D);
797
797
  return {
798
- stackedDatasets: B.filter(Vt),
799
- unstackedDatasets: B.filter(Ft)
798
+ stackedDatasets: l.filter(Ft),
799
+ unstackedDatasets: l.filter($t)
800
800
  };
801
- }, [_, G, x]), J = (D, B) => {
802
- O(B ?? Z), n(v.TRENDS_CLICK_TOGGLE_VIEW);
803
- }, ne = (D) => {
804
- const B = et(D?.[0], 1), d = D?.[1], b = Se(d, B);
805
- k({ start: B, end: d }), n(v.TRENDS_CLICK_TIME_WINDOW, {
806
- time_period: b + "M"
807
- });
808
- }, ee = () => {
809
- n(v.TRENDS_CLICK_FILTER);
810
- }, te = (D) => {
811
- Q(D);
812
- }, se = (D) => {
813
- Q(D), n(v.TRENDS_CLICK_LEGEND, { category: h(D) });
801
+ }, [h, O, x]), U = (D, l) => {
802
+ V(l ?? P), o(v.TRENDS_CLICK_TOGGLE_VIEW);
814
803
  }, de = (D) => {
815
- n(v.TRENDS_HOVER_LEGEND, { category: h(D) });
804
+ const l = et(D?.[0], 1), b = D?.[1], I = Se(b, l);
805
+ L({ start: l, end: b }), o(v.TRENDS_CLICK_TIME_WINDOW, {
806
+ time_period: I + "M"
807
+ });
808
+ }, B = () => {
809
+ o(v.TRENDS_CLICK_FILTER);
816
810
  }, ue = (D) => {
817
- n(v.TRENDS_HOVER_AREA, { category: D });
811
+ J(D);
812
+ }, ne = (D) => {
813
+ J(D), o(v.TRENDS_CLICK_LEGEND, { category: p(D) });
814
+ }, le = (D) => {
815
+ o(v.TRENDS_HOVER_LEGEND, { category: p(D) });
816
+ }, ce = (D) => {
817
+ o(v.TRENDS_HOVER_AREA, { category: D });
818
818
  }, me = (D) => {
819
- n(v.TRENDS_HOVER_POINT, { category: D });
819
+ o(v.TRENDS_HOVER_POINT, { category: D });
820
820
  };
821
- return !L || !M ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ C(
821
+ return !M || !K ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ C(
822
822
  ut,
823
823
  {
824
- calendarActions: { onRangeChanged: ne },
824
+ calendarActions: { onRangeChanged: de },
825
825
  dateRange: x,
826
826
  dateRangeVariant: "timeframebuttons",
827
- onAccountsFilterClick: ee,
827
+ onAccountsFilterClick: B,
828
828
  onBackClick: t,
829
+ onMenuClick: n,
829
830
  sx: s,
830
831
  title: w.title,
831
832
  children: [
@@ -834,7 +835,7 @@ const Lo = g.memo(Io), Qe = ({
834
835
  {
835
836
  sx: {
836
837
  // eslint-disable-next-line no-nested-ternary
837
- px: o ? 48 : r ? 24 : 12
838
+ px: r ? 48 : c ? 24 : 12
838
839
  },
839
840
  children: [
840
841
  /* @__PURE__ */ C(
@@ -842,44 +843,44 @@ const Lo = g.memo(Io), Qe = ({
842
843
  {
843
844
  flexDirection: "row",
844
845
  justifyContent: "space-between",
845
- sx: { pb: i ? 12 : 24, pt: i ? 24 : 48 },
846
+ sx: { pb: a ? 12 : 24, pt: a ? 24 : 48 },
846
847
  children: [
847
848
  /* @__PURE__ */ e(
848
849
  yt,
849
850
  {
850
- selectedCategoryGuid: G,
851
+ selectedCategoryGuid: O,
851
852
  selectedDateRange: x
852
853
  }
853
854
  ),
854
- /* @__PURE__ */ e(ft, { onTabChange: J, selectedTab: Z })
855
+ /* @__PURE__ */ e(ft, { onTabChange: U, selectedTab: P })
855
856
  ]
856
857
  }
857
858
  ),
858
859
  /* @__PURE__ */ C(S, { alignItems: "center", flexDirection: "row", width: "100%", children: [
859
- /* @__PURE__ */ e(N, { flexGrow: 1, children: G && /* @__PURE__ */ C(Te, { onClick: () => Q(""), sx: { p: 0, pr: 5 }, children: [
860
+ /* @__PURE__ */ e(H, { flexGrow: 1, children: O && /* @__PURE__ */ C(Te, { onClick: () => J(""), sx: { p: 0, pr: 5 }, children: [
860
861
  /* @__PURE__ */ e(He, { name: "arrow_back" }),
861
862
  w.all_categories
862
863
  ] }) }),
863
- /* @__PURE__ */ e(Te, { onClick: () => V(!0), sx: { px: 5 }, children: `${w.view_transactions} (${T.length})` })
864
+ /* @__PURE__ */ e(Te, { onClick: () => q(!0), sx: { px: 5 }, children: `${w.view_transactions} (${N.length})` })
864
865
  ] }),
865
- /* @__PURE__ */ C(N, { children: [
866
- Z === "Chart" && /* @__PURE__ */ e(
867
- So,
866
+ /* @__PURE__ */ C(H, { children: [
867
+ P === "Chart" && /* @__PURE__ */ e(
868
+ xo,
868
869
  {
869
- availableHeight: ce,
870
- onClickLegend: se,
871
- onHoverArea: ue,
872
- onHoverLegend: de,
870
+ availableHeight: j,
871
+ onClickLegend: ne,
872
+ onHoverArea: ce,
873
+ onHoverLegend: le,
873
874
  onHoverPoint: me,
874
- stackedDatasets: z.stackedDatasets,
875
- unstackedDatasets: z.unstackedDatasets
875
+ stackedDatasets: oe.stackedDatasets,
876
+ unstackedDatasets: oe.unstackedDatasets
876
877
  }
877
878
  ),
878
- Z === "Table" && /* @__PURE__ */ e(
879
+ P === "Table" && /* @__PURE__ */ e(
879
880
  Ct,
880
881
  {
881
- onClickRow: te,
882
- selectedCategory: G,
882
+ onClickRow: ue,
883
+ selectedCategory: O,
883
884
  selectedDateRange: x
884
885
  }
885
886
  )
@@ -888,27 +889,27 @@ const Lo = g.memo(Io), Qe = ({
888
889
  }
889
890
  ),
890
891
  /* @__PURE__ */ e(
891
- Ao,
892
+ Ro,
892
893
  {
893
- categoryGuid: G,
894
+ categoryGuid: O,
894
895
  dateRange: x,
895
- isOpen: X,
896
- onClose: () => V(!1)
896
+ isOpen: Y,
897
+ onClose: () => q(!1)
897
898
  }
898
899
  )
899
900
  ]
900
901
  }
901
902
  );
902
- }, rs = A(Ro), ko = () => {
903
- const { monthlyCategoryTotals: t } = U(), { trends: s } = R(), n = ae(), { availableHeight: o = 300 } = nt(), r = g.useMemo(() => $t(t), [t]);
903
+ }, as = A(ko), Ho = () => {
904
+ const { monthlyCategoryTotals: t } = Q(), { trends: n } = R(), s = re(), { availableHeight: o = 300 } = nt(), r = g.useMemo(() => zt(t), [t]);
904
905
  return /* @__PURE__ */ e(
905
906
  Ve,
906
907
  {
907
908
  baseline: "min",
908
- colors: [n.palette.primary.main],
909
+ colors: [s.palette.primary.main],
909
910
  datasets: [r],
910
911
  height: o,
911
- labels: [s.spending_label],
912
+ labels: [n.spending_label],
912
913
  showArea: !0,
913
914
  showAverage: !0,
914
915
  showLegend: !0,
@@ -917,39 +918,39 @@ const Lo = g.memo(Io), Qe = ({
917
918
  valueFormatterString: "0,0"
918
919
  }
919
920
  );
920
- }, Ho = A(ko), No = ({ onPrimaryCtaClick: t, sx: s }) => {
921
- const { isAccountDataLoaded: n, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: i } = U(), { isInitialized: a } = Be(), { trends: c } = R(), { selectedAccounts: u } = fe();
921
+ }, No = A(Ho), Wo = ({ onPrimaryCtaClick: t, sx: n }) => {
922
+ const { isAccountDataLoaded: s, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: c } = Q(), { isInitialized: a } = Be(), { trends: d } = R(), { selectedAccounts: u } = fe();
922
923
  return g.useEffect(() => {
923
- n || o().finally();
924
+ s || o().finally();
924
925
  }, []), Ie({
925
926
  widgetName: "TrendsMiniWidget",
926
- isLoaded: i
927
+ isLoaded: c
927
928
  }), g.useEffect(() => {
928
- a && n && r(u).finally();
929
- }, [n, a, u]), !n || !a || !i ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
930
- qt,
929
+ a && s && r(u).finally();
930
+ }, [s, a, u]), !s || !a || !c ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
931
+ Jt,
931
932
  {
932
933
  contentStyles: { height: "calc(100% - 72px)", minHeight: 300, ":last-child": { pb: 0 } },
933
934
  onPrimaryCtaClick: t,
934
- primaryCtaLabel: c.primary_cta,
935
- subTitle: c.sub_title,
936
- sx: { height: "100%", ...s },
937
- title: c.mini_title,
938
- children: /* @__PURE__ */ e(Ho, {})
935
+ primaryCtaLabel: d.primary_cta,
936
+ subTitle: d.sub_title,
937
+ sx: { height: "100%", ...n },
938
+ title: d.mini_title,
939
+ children: /* @__PURE__ */ e(No, {})
939
940
  }
940
941
  );
941
- }, as = A(No), Wo = 70, qe = ({
942
+ }, is = A(Wo), Oo = 70, qe = ({
942
943
  title: t,
943
- totalAmount: s,
944
- transactionType: n,
944
+ totalAmount: n,
945
+ transactionType: s,
945
946
  percentage: o,
946
947
  secondaryLabel: r,
947
- shouldDisplayPercentage: i
948
+ shouldDisplayPercentage: c
948
949
  }) => {
949
- const { availableWidth: a } = nt(), c = g.useRef(null), u = g.useRef(null), l = Wt(Number(Math.abs(o)), {
950
+ const { availableWidth: a } = nt(), d = g.useRef(null), u = g.useRef(null), i = Ot(Number(Math.abs(o)), {
950
951
  style: "percent",
951
952
  minimumIntegerDigits: 1
952
- }), y = a === 288 && re(s, "0,0.00").length > 10 ? re(s, "0,0") : re(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 = c?.current, f = u?.current, T = p && f ? p.scrollWidth > f.clientWidth - Wo : !1;
953
+ }), f = a === 288 && se(n, "0,0.00").length > 10 ? se(n, "0,0") : se(n, "0,0.00"), m = s === "spending" ? o > 0 : o >= 0, _ = s === "spending" ? "error.main" : "success.main", h = s === "spending" ? "success.main" : "text.secondary", p = d?.current, y = u?.current, T = p && y ? p.scrollWidth > y.clientWidth - Oo : !1;
953
954
  return /* @__PURE__ */ C(
954
955
  S,
955
956
  {
@@ -973,8 +974,8 @@ const Lo = g.memo(Io), Qe = ({
973
974
  },
974
975
  children: [
975
976
  /* @__PURE__ */ e(pe, { color: "text.secondary", variant: "caption", children: t }),
976
- i && /* @__PURE__ */ C(S, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
977
- m ? /* @__PURE__ */ e(eo, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(to, { size: 20, sx: { color: h } }),
977
+ c && /* @__PURE__ */ C(S, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
978
+ m ? /* @__PURE__ */ e(to, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(oo, { size: 20, sx: { color: h } }),
978
979
  /* @__PURE__ */ e(
979
980
  pe,
980
981
  {
@@ -983,7 +984,7 @@ const Lo = g.memo(Io), Qe = ({
983
984
  fontWeight: 600
984
985
  },
985
986
  variant: "body2",
986
- children: l
987
+ children: i
987
988
  }
988
989
  )
989
990
  ] })
@@ -1001,14 +1002,14 @@ const Lo = g.memo(Io), Qe = ({
1001
1002
  },
1002
1003
  children: [
1003
1004
  /* @__PURE__ */ e(
1004
- N,
1005
+ H,
1005
1006
  {
1006
- ref: c,
1007
+ ref: d,
1007
1008
  sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
1008
- children: /* @__PURE__ */ e(Ge, { children: y })
1009
+ children: /* @__PURE__ */ e(Ge, { children: f })
1009
1010
  }
1010
1011
  ),
1011
- i && a >= 450 && !T && /* @__PURE__ */ e(
1012
+ c && a >= 450 && !T && /* @__PURE__ */ e(
1012
1013
  pe,
1013
1014
  {
1014
1015
  color: m ? _ : h,
@@ -1022,54 +1023,54 @@ const Lo = g.memo(Io), Qe = ({
1022
1023
  ]
1023
1024
  }
1024
1025
  );
1025
- }, Oo = A(() => {
1026
+ }, Go = A(() => {
1026
1027
  const { trends: t } = R();
1027
1028
  return /* @__PURE__ */ C(S, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
1028
- /* @__PURE__ */ e(oo, { size: 32 }),
1029
+ /* @__PURE__ */ e(no, { size: 32 }),
1029
1030
  /* @__PURE__ */ C(S, { children: [
1030
1031
  /* @__PURE__ */ e(pe, { fontWeight: 600, variant: "body1", children: t.zero_state_content_header }),
1031
1032
  /* @__PURE__ */ e(pe, { color: "text.secondary", variant: "subtitle2", children: t.zero_state_content_description })
1032
1033
  ] })
1033
1034
  ] });
1034
- }), is = A(({ onCtaClick: t }) => {
1035
- const { isAccountDataLoaded: s, loadAccountData: n, visibleAccounts: o } = De();
1035
+ }), ls = A(({ onCtaClick: t }) => {
1036
+ const { isAccountDataLoaded: n, loadAccountData: s, visibleAccounts: o } = De();
1036
1037
  g.useEffect(() => {
1037
- s || n().finally();
1038
+ n || s().finally();
1038
1039
  }, []);
1039
- const { onEvent: r } = $(), { monthlyCategoryTotals: i, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: c } = U(), u = {
1040
- start: Jt(/* @__PURE__ */ new Date(), 1),
1040
+ const { onEvent: r } = z(), { monthlyCategoryTotals: c, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: d } = Q(), u = {
1041
+ start: eo(/* @__PURE__ */ new Date(), 1),
1041
1042
  end: /* @__PURE__ */ new Date()
1042
- }, { trends: l } = R(), { selectedAccounts: y, isInitialized: m } = fe();
1043
+ }, { trends: i } = R(), { selectedAccounts: f, isInitialized: m } = fe();
1043
1044
  Ie({
1044
1045
  widgetName: "TrendsMicroWidget",
1045
- isLoaded: c
1046
+ isLoaded: d
1046
1047
  }), g.useEffect(() => {
1047
- m && a(y, u.start).then(() => {
1048
+ m && a(f, u.start).then(() => {
1048
1049
  r(v.TRENDS_LOAD_WIDGET, {
1049
1050
  state: o?.length ? "default" : "zeroState"
1050
1051
  });
1051
1052
  });
1052
- }, [m, y]);
1053
+ }, [m, f]);
1053
1054
  const { spendingData: _, incomeData: h } = g.useMemo(
1054
1055
  () => ({
1055
- spendingData: at(i, u),
1056
- incomeData: it(i, u)
1056
+ spendingData: at(c, u),
1057
+ incomeData: it(c, u)
1057
1058
  }),
1058
- [i, u]
1059
- ), [p, f] = _, [T, x] = h, k = Ye(f.y, p.y), L = Ye(x.y, T.y), E = m && !o?.length, w = () => {
1059
+ [c, u]
1060
+ ), [p, y] = _, [T, N] = h, x = Ye(y.y, p.y), L = Ye(N.y, T.y), M = m && !o?.length, E = () => {
1060
1061
  r(
1061
- E ? v.TRENDS_CLICK_GET_STARTED : v.TRENDS_CLICK_VIEW_MORE
1062
+ M ? v.TRENDS_CLICK_GET_STARTED : v.TRENDS_CLICK_VIEW_MORE
1062
1063
  ), t();
1063
1064
  };
1064
- return !c || !m ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
1065
- io,
1065
+ return !d || !m ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
1066
+ lo,
1066
1067
  {
1067
1068
  className: "mx-trends-microwidget",
1068
- ctaLabel: l.micro_primary_cta_label,
1069
- onCTAClick: w,
1070
- subHeader: E ? void 0 : l.micro_subheader,
1071
- title: l.title,
1072
- children: E ? /* @__PURE__ */ e(Oo, {}) : /* @__PURE__ */ C(
1069
+ ctaLabel: i.micro_primary_cta_label,
1070
+ onCTAClick: E,
1071
+ subHeader: M ? void 0 : i.micro_subheader,
1072
+ title: i.title,
1073
+ children: M ? /* @__PURE__ */ e(Go, {}) : /* @__PURE__ */ C(
1073
1074
  S,
1074
1075
  {
1075
1076
  sx: {
@@ -1081,11 +1082,11 @@ const Lo = g.memo(Io), Qe = ({
1081
1082
  /* @__PURE__ */ e(
1082
1083
  qe,
1083
1084
  {
1084
- percentage: k,
1085
- secondaryLabel: l.micro_secondary_label,
1086
- shouldDisplayPercentage: f.y !== 0 && p.y !== 0,
1087
- title: l.spending_label,
1088
- totalAmount: f.y,
1085
+ percentage: x,
1086
+ secondaryLabel: i.micro_secondary_label,
1087
+ shouldDisplayPercentage: y.y !== 0 && p.y !== 0,
1088
+ title: i.spending_label,
1089
+ totalAmount: y.y,
1089
1090
  transactionType: "spending"
1090
1091
  }
1091
1092
  ),
@@ -1093,10 +1094,10 @@ const Lo = g.memo(Io), Qe = ({
1093
1094
  qe,
1094
1095
  {
1095
1096
  percentage: L,
1096
- secondaryLabel: l.micro_secondary_label,
1097
- shouldDisplayPercentage: x.y !== 0 && T.y !== 0,
1098
- title: l.income_label,
1099
- totalAmount: x.y,
1097
+ secondaryLabel: i.micro_secondary_label,
1098
+ shouldDisplayPercentage: N.y !== 0 && T.y !== 0,
1099
+ title: i.income_label,
1100
+ totalAmount: N.y,
1100
1101
  transactionType: "income"
1101
1102
  }
1102
1103
  )
@@ -1105,17 +1106,17 @@ const Lo = g.memo(Io), Qe = ({
1105
1106
  )
1106
1107
  }
1107
1108
  );
1108
- }), Go = A(
1109
- ({ isExpanded: t, onClick: s }) => {
1110
- const n = gt();
1111
- return /* @__PURE__ */ e(mt, { children: /* @__PURE__ */ e(co, { onClick: s, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
1109
+ }), Bo = A(
1110
+ ({ isExpanded: t, onClick: n }) => {
1111
+ const s = gt();
1112
+ return /* @__PURE__ */ e(mt, { children: /* @__PURE__ */ e(uo, { onClick: n, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
1112
1113
  S,
1113
1114
  {
1114
- sx: { color: n.palette.primary.main, flexDirection: "row", alignItems: "center" },
1115
+ sx: { color: s.palette.primary.main, flexDirection: "row", alignItems: "center" },
1115
1116
  children: [
1116
- /* @__PURE__ */ e(ht, { children: /* @__PURE__ */ e(F, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
1117
- /* @__PURE__ */ e(uo, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(no, {}) : /* @__PURE__ */ e(
1118
- so,
1117
+ /* @__PURE__ */ e(ht, { children: /* @__PURE__ */ e($, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
1118
+ /* @__PURE__ */ e(mo, { sx: { color: s.palette.primary.main }, children: t ? /* @__PURE__ */ e(so, {}) : /* @__PURE__ */ e(
1119
+ ro,
1119
1120
  {
1120
1121
  sx: {
1121
1122
  transition: "transform 0.3s ease-in-out",
@@ -1130,83 +1131,83 @@ const Lo = g.memo(Io), Qe = ({
1130
1131
  ), Je = A(
1131
1132
  ({
1132
1133
  totalAmount: t,
1133
- guid: s,
1134
- name: n,
1134
+ guid: n,
1135
+ name: s,
1135
1136
  transactions: o,
1136
1137
  onClick: r,
1137
- isLastItem: i = !1,
1138
+ isLastItem: c = !1,
1138
1139
  showDivider: a = !0
1139
1140
  }) => {
1140
- const { trends: c } = R(), { onEvent: u } = $(), l = ae(), y = `${o.length} ${o.length === 1 ? c.transaction : c.transactions}`, m = () => {
1141
+ const { trends: d } = R(), { onEvent: u } = z(), i = re(), f = `${o.length} ${o.length === 1 ? d.transaction : d.transactions}`, m = () => {
1141
1142
  r?.(), u(v.TRENDS_CLICK_LIST_ITEM, {
1142
1143
  ...W,
1143
- listItem: n
1144
+ listItem: s
1144
1145
  });
1145
1146
  };
1146
1147
  return /* @__PURE__ */ C(g.Fragment, { children: [
1147
1148
  /* @__PURE__ */ e(
1148
- Bt,
1149
+ Pt,
1149
1150
  {
1150
- leftIcon: s ? /* @__PURE__ */ e(
1151
+ leftIcon: n ? /* @__PURE__ */ e(
1151
1152
  we,
1152
1153
  {
1153
- categoryGuid: s,
1154
+ categoryGuid: n,
1154
1155
  sx: {
1155
- bgcolor: Mt(Oe(s, l), 0.15),
1156
- border: `1px solid ${Oe(s, l)}`,
1156
+ bgcolor: At(Oe(n, i), 0.15),
1157
+ border: `1px solid ${Oe(n, i)}`,
1157
1158
  color: "text.primary"
1158
1159
  }
1159
1160
  }
1160
1161
  ) : void 0,
1161
1162
  onClick: m,
1162
- rightContent: re(Math.abs(t), "0,0.00"),
1163
- rightIcon: r ? /* @__PURE__ */ e(ro, {}) : void 0,
1164
- subtitle: y,
1165
- title: n
1163
+ rightContent: se(Math.abs(t), "0,0.00"),
1164
+ rightIcon: r ? /* @__PURE__ */ e(ao, {}) : void 0,
1165
+ subtitle: f,
1166
+ title: s
1166
1167
  }
1167
1168
  ),
1168
- a && /* @__PURE__ */ e(Ne, { component: "li", sx: { ml: i ? 24 : 68 } })
1169
- ] }, s);
1169
+ a && /* @__PURE__ */ e(Ne, { component: "li", sx: { ml: c ? 24 : 68 } })
1170
+ ] }, n);
1170
1171
  }
1171
- ), Bo = A(
1172
- ({ availableHeight: t = 0, onCategoryClick: s }) => {
1173
- const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: r } = ye(), { isLargeDesktop: i, isDesktop: a } = j(), { trends: c } = R(), { onEvent: u } = $(), [l, y] = g.useState(!1), m = a || i;
1172
+ ), Po = A(
1173
+ ({ availableHeight: t = 0, onCategoryClick: n }) => {
1174
+ const { collapsedCategories: s, visibleCategories: o, setVisibleListLength: r } = ye(), { isLargeDesktop: c, isDesktop: a } = Z(), { trends: d } = R(), { onEvent: u } = z(), [i, f] = g.useState(!1), m = a || c;
1174
1175
  g.useEffect(() => {
1175
- const p = Math.floor(t / 64) - 1, f = o.length + n.length;
1176
- p !== o.length && (r(m ? Math.max(p, 5) : 5), y(p >= f));
1176
+ const p = Math.floor(t / 64) - 1, y = o.length + s.length;
1177
+ p !== o.length && (r(m ? Math.max(p, 5) : 5), f(p >= y));
1177
1178
  }, [t]);
1178
1179
  const _ = () => {
1179
- y(!l), u(v.TRENDS_CLICK_VIEW_MORE, {
1180
+ f(!i), u(v.TRENDS_CLICK_VIEW_MORE, {
1180
1181
  ...W
1181
1182
  });
1182
- }, h = o.length + (l ? n.length : 0);
1183
+ }, h = o.length + (i ? s.length : 0);
1183
1184
  return /* @__PURE__ */ C(S, { sx: { width: "100%" }, children: [
1184
- /* @__PURE__ */ e(S, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Ge, { children: c.categories }) }),
1185
+ /* @__PURE__ */ e(S, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Ge, { children: d.categories }) }),
1185
1186
  /* @__PURE__ */ C(We, { children: [
1186
- o.map((p, f) => /* @__PURE__ */ e(
1187
+ o.map((p, y) => /* @__PURE__ */ e(
1187
1188
  Je,
1188
1189
  {
1189
1190
  ...p,
1190
- isLastItem: f === h - 1,
1191
- onClick: p.transactions.length > 0 ? () => s(p) : void 0,
1191
+ isLastItem: y === h - 1,
1192
+ onClick: p.transactions.length > 0 ? () => n(p) : void 0,
1192
1193
  showDivider: !0
1193
1194
  },
1194
1195
  p.guid
1195
1196
  )),
1196
1197
  /* @__PURE__ */ e(
1197
- lo,
1198
+ co,
1198
1199
  {
1199
1200
  component: "li",
1200
- in: l,
1201
+ in: i,
1201
1202
  sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
1202
- children: /* @__PURE__ */ e(We, { children: n.map((p, f) => {
1203
- const T = o.length + f;
1203
+ children: /* @__PURE__ */ e(We, { children: s.map((p, y) => {
1204
+ const T = o.length + y;
1204
1205
  return /* @__PURE__ */ e(
1205
1206
  Je,
1206
1207
  {
1207
1208
  ...p,
1208
1209
  isLastItem: T === h - 1,
1209
- onClick: p.transactions.length > 0 ? () => s(p) : void 0,
1210
+ onClick: p.transactions.length > 0 ? () => n(p) : void 0,
1210
1211
  showDivider: !0
1211
1212
  },
1212
1213
  p.guid
@@ -1214,53 +1215,53 @@ const Lo = g.memo(Io), Qe = ({
1214
1215
  }) })
1215
1216
  }
1216
1217
  ),
1217
- n.length > 0 && /* @__PURE__ */ e(Go, { isExpanded: l, onClick: _ })
1218
+ s.length > 0 && /* @__PURE__ */ e(Bo, { isExpanded: i, onClick: _ })
1218
1219
  ] })
1219
1220
  ] });
1220
1221
  }
1221
- ), Po = ({ beats: t, onInsightCardClick: s }) => {
1222
- const { onEvent: n } = $(), { isMobile: o, isDesktop: r, isLargeDesktop: i } = j(), { beatStore: a, endpoint: c, sessionToken: u } = Be(), l = r || i, y = l || o ? 1 : 2, m = () => null, _ = (T) => {
1223
- s?.(T), n(v.TRENDS_CLICK_INSIGHT, W);
1224
- }, h = l ? 200 : 170, p = l ? 170 : 124, f = t.length > 0 ? h : p;
1225
- return /* @__PURE__ */ e(mo, { sx: { height: f }, children: /* @__PURE__ */ e(
1226
- Yt,
1222
+ ), Vo = ({ beats: t, onInsightCardClick: n }) => {
1223
+ const { onEvent: s } = z(), { isMobile: o, isDesktop: r, isLargeDesktop: c } = Z(), { beatStore: a, endpoint: d, sessionToken: u } = Be(), i = r || c, f = i || o ? 1 : 2, m = () => null, _ = (T) => {
1224
+ n?.(T), s(v.TRENDS_CLICK_INSIGHT, W);
1225
+ }, h = i ? 200 : 170, p = i ? 170 : 124, y = t.length > 0 ? h : p;
1226
+ return /* @__PURE__ */ e(ho, { sx: { height: y }, children: /* @__PURE__ */ e(
1227
+ jt,
1227
1228
  {
1228
1229
  areBeatsLoading: a.isLoading,
1229
1230
  beats: t,
1230
- endpoint: c,
1231
+ endpoint: d,
1231
1232
  headerSx: { p: 0 },
1232
1233
  logOutUser: m,
1233
1234
  onCardClick: _,
1234
1235
  showBorder: !0,
1235
1236
  showCarouselControls: !0,
1236
- showHeader: l,
1237
+ showHeader: i,
1237
1238
  showIcon: !0,
1238
1239
  showWithMargin: !1,
1239
1240
  token: u,
1240
1241
  userHasFullInsightFeedBeats: !1,
1241
1242
  variant: "outlined",
1242
- visibleCardsCount: y
1243
+ visibleCardsCount: f
1243
1244
  }
1244
1245
  ) });
1245
- }, Vo = A(Po), Fo = A(({ chartLabel: t, chartColor: s }) => {
1246
- const { onEvent: n } = $(), {
1246
+ }, Fo = A(Vo), $o = A(({ chartLabel: t, chartColor: n }) => {
1247
+ const { onEvent: s } = z(), {
1247
1248
  categoryDetailsChartData: { monthlyAmounts: o, tooltipLabels: r }
1248
1249
  } = ye();
1249
1250
  return /* @__PURE__ */ e(S, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
1250
1251
  Ve,
1251
1252
  {
1252
1253
  baseline: "min",
1253
- colors: [s],
1254
+ colors: [n],
1254
1255
  curveType: "bump",
1255
1256
  customTooltipLabels: r,
1256
1257
  datasets: [o],
1257
1258
  height: 265,
1258
1259
  labels: [t],
1259
1260
  markStyles: () => ({
1260
- stroke: s
1261
+ stroke: n
1261
1262
  }),
1262
1263
  onItemClick: () => {
1263
- n(v.TRENDS_CLICK_CHART, W);
1264
+ s(v.TRENDS_CLICK_CHART, W);
1264
1265
  },
1265
1266
  showArea: !0,
1266
1267
  showAverage: !0,
@@ -1275,18 +1276,18 @@ const Lo = g.memo(Io), Qe = ({
1275
1276
  valueFormatterString: "0,0"
1276
1277
  }
1277
1278
  ) });
1278
- }), $o = A(() => {
1279
- const t = gt(), { is_mobile_webview: s } = st(), { isDesktop: n, isSmallTablet: o, isTablet: r } = j(), { common: i, trends: a } = R(), { selectedCategoryData: c, selectedDateRangeMonthRange: u } = ye(), { sortedTransactions: l } = ve(), [y, m] = g.useState(null);
1280
- if (!c)
1279
+ }), zo = A(() => {
1280
+ const t = gt(), { is_mobile_webview: n } = st(), { isDesktop: s, isSmallTablet: o, isTablet: r } = Z(), { common: c, trends: a } = R(), { selectedCategoryData: d, selectedDateRangeMonthRange: u } = ye(), { sortedTransactions: i } = ve(), [f, m] = g.useState(null);
1281
+ if (!d)
1281
1282
  return null;
1282
- const { guid: _, name: h, is_income: p, totalAmount: f } = c, T = Oe(_, t), x = p ? a.income_label : a.spending_label, k = ` ${c.transactions.length === 1 ? a.transaction : a.transactions} (${c.transactions.length})`, L = g.useMemo(
1283
- () => l.find((M) => M.guid === y),
1284
- [y, l]
1285
- ), E = l.length > 0 && !s && (n || r && !o), w = (M) => M.category_guid === _ || M.top_level_category_guid === _;
1283
+ const { guid: _, name: h, is_income: p, totalAmount: y } = d, T = Oe(_, t), N = p ? a.income_label : a.spending_label, x = ` ${d.transactions.length === 1 ? a.transaction : a.transactions} (${d.transactions.length})`, L = g.useMemo(
1284
+ () => i.find((w) => w.guid === f),
1285
+ [f, i]
1286
+ ), M = i.length > 0 && !n && (s || r && !o), E = (w) => w.category_guid === _ || w.top_level_category_guid === _;
1286
1287
  return /* @__PURE__ */ C(S, { sx: { alignItems: "center", height: "100%" }, children: [
1287
1288
  /* @__PURE__ */ C(S, { sx: { borderRadius: 0, pb: 4, pt: 16, px: 12, width: "100%" }, children: [
1288
1289
  /* @__PURE__ */ e(We, { sx: { px: 12 }, children: /* @__PURE__ */ C(mt, { children: [
1289
- /* @__PURE__ */ e(ho, { children: /* @__PURE__ */ e(we, { categoryGuid: _ }) }),
1290
+ /* @__PURE__ */ e(go, { children: /* @__PURE__ */ e(we, { categoryGuid: _ }) }),
1290
1291
  /* @__PURE__ */ e(
1291
1292
  ht,
1292
1293
  {
@@ -1296,19 +1297,19 @@ const Lo = g.memo(Io), Qe = ({
1296
1297
  secondaryTypographyProps: { component: "div", variant: "body2" }
1297
1298
  }
1298
1299
  ),
1299
- /* @__PURE__ */ e(F, { component: "div", variant: "h3", children: re(Math.abs(f), "0,0.00") })
1300
+ /* @__PURE__ */ e($, { component: "div", variant: "h3", children: se(Math.abs(y), "0,0.00") })
1300
1301
  ] }) }),
1301
- /* @__PURE__ */ e(Fo, { chartColor: T, chartLabel: x }),
1302
+ /* @__PURE__ */ e($o, { chartColor: T, chartLabel: N }),
1302
1303
  /* @__PURE__ */ C(S, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 12 }, children: [
1303
- /* @__PURE__ */ e(F, { bold: !0, variant: "body1", children: k }),
1304
- E && /* @__PURE__ */ e(go, { filter: w })
1304
+ /* @__PURE__ */ e($, { bold: !0, variant: "body1", children: x }),
1305
+ M && /* @__PURE__ */ e(po, { filter: E })
1305
1306
  ] })
1306
1307
  ] }),
1307
1308
  /* @__PURE__ */ e(
1308
1309
  ct,
1309
1310
  {
1310
1311
  bgcolor: "transparent",
1311
- filter: w,
1312
+ filter: E,
1312
1313
  height: "calc(100vh - 475px)",
1313
1314
  onClick: m
1314
1315
  }
@@ -1316,7 +1317,7 @@ const Lo = g.memo(Io), Qe = ({
1316
1317
  /* @__PURE__ */ e(
1317
1318
  Pe,
1318
1319
  {
1319
- ariaLabelClose: i.close_aria,
1320
+ ariaLabelClose: c.close_aria,
1320
1321
  isOpen: !!L,
1321
1322
  onClose: () => m(""),
1322
1323
  title: a.transaction,
@@ -1324,30 +1325,30 @@ const Lo = g.memo(Io), Qe = ({
1324
1325
  }
1325
1326
  )
1326
1327
  ] });
1327
- }), zo = (t, s) => {
1328
- const n = it(t, s), o = at(t, s);
1329
- return [n, o].filter((r) => r.length > 0);
1330
- }, Ko = (t, s) => {
1331
- const [n, o] = t, r = n, i = o ?? n, a = [];
1328
+ }), Ko = (t, n) => {
1329
+ const s = it(t, n), o = at(t, n);
1330
+ return [s, o].filter((r) => r.length > 0);
1331
+ }, Yo = (t, n) => {
1332
+ const [s, o] = t, r = s, c = o ?? s, a = [];
1332
1333
  if (r) {
1333
- const c = r.reduce((u, l) => u + l.y, 0);
1334
- a.push({ label: s.income_label, amount: c });
1334
+ const d = r.reduce((u, i) => u + i.y, 0);
1335
+ a.push({ label: n.income_label, amount: d });
1335
1336
  }
1336
- if (i) {
1337
- const c = i.reduce((u, l) => u + l.y, 0);
1338
- a.push({ label: s.spending_label, amount: c });
1337
+ if (c) {
1338
+ const d = c.reduce((u, i) => u + i.y, 0);
1339
+ a.push({ label: n.spending_label, amount: d });
1339
1340
  }
1340
1341
  return a;
1341
- }, Yo = ({
1342
+ }, jo = ({
1342
1343
  availableHeight: t = 0,
1343
- minHeight: s = 500,
1344
- selectedDateRange: n,
1344
+ minHeight: n = 500,
1345
+ selectedDateRange: s,
1345
1346
  totals: o
1346
1347
  }) => {
1347
- const r = ae(), { onEvent: i } = $(), { trends: a } = R(), { isSmallMobile: c, isMobile: u, isSmallTablet: l, isTablet: y } = j(), m = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = zo(o, n), h = Ko(_, a), [p, f] = g.useState(0), T = 458, x = 195, k = 56, L = u || c ? x : l || y ? T : p;
1348
+ const r = re(), { onEvent: c } = z(), { trends: a } = R(), { isSmallMobile: d, isMobile: u, isSmallTablet: i, isTablet: f } = Z(), m = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = Ko(o, s), h = Yo(_, a), [p, y] = g.useState(0), T = 458, N = 195, x = 56, L = u || d ? N : i || f ? T : p;
1348
1349
  return g.useEffect(() => {
1349
- const w = Math.max(t - k, s);
1350
- f(w);
1350
+ const E = Math.max(t - x, n);
1351
+ y(E);
1351
1352
  }, [t]), /* @__PURE__ */ e(
1352
1353
  Ve,
1353
1354
  {
@@ -1358,7 +1359,7 @@ const Lo = g.memo(Io), Qe = ({
1358
1359
  height: L,
1359
1360
  labels: h,
1360
1361
  onItemClick: () => {
1361
- i(v.TRENDS_CLICK_CHART, W);
1362
+ c(v.TRENDS_CLICK_CHART, W);
1362
1363
  },
1363
1364
  showArea: !0,
1364
1365
  showAxisHighlight: !0,
@@ -1371,7 +1372,7 @@ const Lo = g.memo(Io), Qe = ({
1371
1372
  valueFormatterString: "0.0a"
1372
1373
  }
1373
1374
  );
1374
- }, jo = A(Yo), Uo = [
1375
+ }, Uo = A(jo), Xo = [
1375
1376
  "BillAmountNotStandard",
1376
1377
  "CategorySpendingV2",
1377
1378
  "CostOfLivingToIncome",
@@ -1405,101 +1406,107 @@ const Lo = g.memo(Io), Qe = ({
1405
1406
  "WeeklyNewMerchantsV2",
1406
1407
  "WeeklyNoSpendDays",
1407
1408
  "WeeklySmallPurchasesSummary"
1408
- ], Xo = (t, s, n) => ({
1409
- description: s ? t.empty_state_sub_text : t.empty_state_sub_text_no_aggregation,
1410
- header: s ? t.zero_state_content_header : t.zero_state_content_header_no_aggregation,
1411
- onClickHandler: s ? n : void 0,
1412
- primaryButton: s ? t.empty_state_primary : void 0
1413
- }), Zo = ({ onBackClick: t, onInsightCardClick: s, sx: n }) => {
1414
- const { onEvent: o } = $(), { config: r } = st(), { isDesktop: i, isLargeDesktop: a, isMobile: c } = j(), { isAccountDataLoaded: u, loadAccountData: l, visibleAccounts: y } = De(), {
1415
- categoriesLoaded: m,
1416
- loadCategories: _,
1417
- loadDateRangeCategoryTotals: h,
1418
- loadMonthlyCategoryTotals: p,
1419
- monthlyCategoryTotals: f,
1420
- monthlyTotalsLoaded: T
1421
- } = U(), { isTransactionDataLoaded: x, loadTransactionData: k, setFilter: L } = ve(), { selectedCategoryData: E, selectedDateRange: w, setSelectedCategoryData: M, setSelectedDateRange: ie } = ye(), { isInitialized: X, selectedAccounts: V, selectedAccountGuids: Z } = fe(), { trends: O, connect: G } = R(), { beatStore: Q } = Be(), le = po() && r.show_insights_widget_in_master, q = i || a, [ce, z] = g.useState(!1), [J, ne] = g.useState(!1), [ee, te] = g.useState("Chart"), [se, de] = g.useState(""), [ue, me] = g.useState(window.innerHeight), D = q ? 56 : 0, B = ue - 208, d = ue - (le ? 550 + D : 266), [b, I] = g.useState(!1), K = r.show_connections_widget_in_master;
1409
+ ], Zo = (t, n, s) => ({
1410
+ description: n ? t.empty_state_sub_text : t.empty_state_sub_text_no_aggregation,
1411
+ header: n ? t.zero_state_content_header : t.zero_state_content_header_no_aggregation,
1412
+ onClickHandler: n ? s : void 0,
1413
+ primaryButton: n ? t.empty_state_primary : void 0
1414
+ }), Qo = ({
1415
+ onBackClick: t,
1416
+ onMenuClick: n,
1417
+ onInsightCardClick: s,
1418
+ sx: o
1419
+ }) => {
1420
+ const { onEvent: r } = z(), { config: c } = st(), { isDesktop: a, isLargeDesktop: d, isMobile: u } = Z(), { isAccountDataLoaded: i, loadAccountData: f, visibleAccounts: m } = De(), {
1421
+ categoriesLoaded: _,
1422
+ loadCategories: h,
1423
+ loadDateRangeCategoryTotals: p,
1424
+ loadMonthlyCategoryTotals: y,
1425
+ monthlyCategoryTotals: T,
1426
+ monthlyTotalsLoaded: N
1427
+ } = Q(), { isTransactionDataLoaded: x, loadTransactionData: L, setFilter: M } = ve(), { selectedCategoryData: E, selectedDateRange: w, setSelectedCategoryData: K, setSelectedDateRange: ae } = ye(), { isInitialized: Y, selectedAccounts: q, selectedAccountGuids: P } = fe(), { trends: V, connect: O } = R(), { beatStore: J } = Be(), ie = fo() && c.show_insights_widget_in_master, ee = a || d, [j, oe] = g.useState(!1), [U, de] = g.useState(!1), [B, ue] = g.useState("Chart"), [ne, le] = g.useState(""), [ce, me] = g.useState(window.innerHeight), D = ee ? 56 : 0, l = ce - 208, b = ce - (ie ? 550 + D : 266), [I, F] = g.useState(!1), Ee = c.show_connections_widget_in_master;
1422
1428
  Ie({
1423
1429
  widgetName: "TrendsWidget",
1424
- isLoaded: ce
1430
+ isLoaded: j
1425
1431
  });
1426
- const _e = g.useMemo(() => J ? Q.getFilteredBeats({ templates: Uo }) : [], [J]);
1432
+ const _e = g.useMemo(() => U ? J.getFilteredBeats({ templates: Xo }) : [], [U]);
1427
1433
  g.useEffect(() => {
1428
- const H = () => me(window.innerHeight);
1429
- return window.addEventListener("resize", H), u || l().finally(), m || _().finally(), x || k().finally(), () => window.removeEventListener("resize", H);
1434
+ const k = () => me(window.innerHeight);
1435
+ return window.addEventListener("resize", k), i || f().finally(), _ || h().finally(), x || L().finally(), () => window.removeEventListener("resize", k);
1430
1436
  }, []), g.useEffect(() => {
1431
- X && u && (Q.loadBeats().finally(() => ne(!0)), h(V, w.start, w.end).then(() => {
1432
- p(
1433
- V,
1437
+ Y && i && (J.loadBeats().finally(() => de(!0)), p(q, w.start, w.end).then(() => {
1438
+ y(
1439
+ q,
1434
1440
  w.start,
1435
1441
  w.end
1436
1442
  ).finally();
1437
1443
  }).finally(() => {
1438
- z(!0), o(v.TRENDS_LOAD_WIDGET, {
1444
+ oe(!0), r(v.TRENDS_LOAD_WIDGET, {
1439
1445
  ...W,
1440
1446
  time_period: `${Se(w.end, w.start)}M`
1441
1447
  });
1442
1448
  }));
1443
- }, [X, u, V, w]), g.useEffect(() => {
1444
- if (f.length !== 0) {
1445
- const H = {
1446
- accounts: Z,
1449
+ }, [Y, i, q, w]), g.useEffect(() => {
1450
+ if (T.length !== 0) {
1451
+ const k = {
1452
+ accounts: P,
1447
1453
  dateRange: { start: w.start, end: w.end }
1448
1454
  };
1449
- L({
1450
- ...H,
1451
- custom: (oe) => !!f.find(
1452
- (ge) => ge.top_level_category_guid === oe.top_level_category_guid || ge.category_guid === oe.category_guid
1455
+ M({
1456
+ ...k,
1457
+ custom: (te) => !!T.find(
1458
+ (ge) => ge.top_level_category_guid === te.top_level_category_guid || ge.category_guid === te.category_guid
1453
1459
  )
1454
1460
  });
1455
1461
  }
1456
- }, [f]);
1457
- const Ee = (H) => {
1458
- M(H);
1459
- }, he = () => {
1460
- M(null), o(v.TRENDS_CLICK_BACK, W);
1462
+ }, [T]);
1463
+ const he = (k) => {
1464
+ K(k);
1461
1465
  }, Me = () => {
1462
- I(!0), o(v.TRENDS_CLICK_CONNECT_ACCOUNTS);
1463
- }, Ae = (H, oe) => {
1464
- te(oe ?? ee), o(v.TRENDS_CLICK_TOGGLE_VIEW, {
1466
+ K(null), r(v.TRENDS_CLICK_BACK, W);
1467
+ }, Ae = () => {
1468
+ F(!0), r(v.TRENDS_CLICK_CONNECT_ACCOUNTS);
1469
+ }, _t = (k, te) => {
1470
+ ue(te ?? B), r(v.TRENDS_CLICK_TOGGLE_VIEW, {
1465
1471
  ...W,
1466
- toggleView: oe
1472
+ toggleView: te
1467
1473
  });
1468
- }, _t = (H) => {
1469
- const oe = et(H?.[0], 1), ge = H?.[1], xt = Se(ge, oe);
1470
- ie({ start: oe, end: ge }), o(v.TRENDS_CLICK_TIME_WINDOW, {
1474
+ }, bt = (k) => {
1475
+ const te = et(k?.[0], 1), ge = k?.[1], wt = Se(ge, te);
1476
+ ae({ start: te, end: ge }), r(v.TRENDS_CLICK_TIME_WINDOW, {
1471
1477
  ...W,
1472
- time_period: xt + "M"
1478
+ time_period: wt + "M"
1473
1479
  });
1474
- }, bt = (H) => {
1475
- o(v.TRENDS_CLICK_FILTER, {
1480
+ }, Tt = (k) => {
1481
+ r(v.TRENDS_CLICK_FILTER, {
1476
1482
  ...W,
1477
- filterValue: H
1483
+ filterValue: k
1478
1484
  });
1479
- }, Tt = (H) => {
1480
- de(H);
1481
- }, St = () => {
1482
- de(""), o(v.TRENDS_CLICK_ALL_CATEGORIES, W);
1485
+ }, St = (k) => {
1486
+ le(k);
1487
+ }, xt = () => {
1488
+ le(""), r(v.TRENDS_CLICK_ALL_CATEGORIES, W);
1483
1489
  };
1484
- if (!X || !u || !ce || !T)
1490
+ if (!Y || !i || !j || !N)
1485
1491
  return /* @__PURE__ */ e(Le, {});
1486
- const Fe = y.length === 0 || f.length === 0, be = Xo(O, K, Me);
1492
+ const Fe = m.length === 0 || T.length === 0, be = Zo(V, Ee, Ae);
1487
1493
  return /* @__PURE__ */ C(
1488
1494
  ut,
1489
1495
  {
1490
- calendarActions: { onRangeChanged: _t },
1496
+ calendarActions: { onRangeChanged: bt },
1491
1497
  dateRange: w,
1492
- dateRangeVariant: c ? "timeframetabs" : "timeframebuttons",
1493
- onAccountsFilterClick: bt,
1498
+ dateRangeVariant: u ? "timeframetabs" : "timeframebuttons",
1499
+ onAccountsFilterClick: Tt,
1494
1500
  onBackClick: t,
1495
- sx: n,
1496
- title: O.title,
1501
+ onMenuClick: n,
1502
+ sx: o,
1503
+ title: V.title,
1497
1504
  children: [
1498
1505
  /* @__PURE__ */ C(
1499
1506
  S,
1500
1507
  {
1501
1508
  sx: {
1502
- px: c ? 0 : 48
1509
+ px: u ? 0 : 48
1503
1510
  },
1504
1511
  children: [
1505
1512
  /* @__PURE__ */ C(
@@ -1507,68 +1514,68 @@ const Lo = g.memo(Io), Qe = ({
1507
1514
  {
1508
1515
  flexDirection: "row",
1509
1516
  justifyContent: "space-between",
1510
- sx: { px: c ? 16 : 0, py: 16 },
1517
+ sx: { px: u ? 16 : 0, py: 16 },
1511
1518
  children: [
1512
1519
  /* @__PURE__ */ e(
1513
1520
  yt,
1514
1521
  {
1515
- selectedCategoryGuid: se,
1522
+ selectedCategoryGuid: ne,
1516
1523
  selectedDateRange: w
1517
1524
  }
1518
1525
  ),
1519
- /* @__PURE__ */ e(ft, { onTabChange: Ae, selectedTab: ee })
1526
+ /* @__PURE__ */ e(ft, { onTabChange: _t, selectedTab: B })
1520
1527
  ]
1521
1528
  }
1522
1529
  ),
1523
- /* @__PURE__ */ e(S, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(N, { flexGrow: 1, children: se && /* @__PURE__ */ C(Te, { onClick: St, sx: { p: 0, pr: 5 }, children: [
1524
- /* @__PURE__ */ e(ao, {}),
1525
- O.all_categories
1530
+ /* @__PURE__ */ e(S, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(H, { flexGrow: 1, children: ne && /* @__PURE__ */ C(Te, { onClick: xt, sx: { p: 0, pr: 5 }, children: [
1531
+ /* @__PURE__ */ e(io, {}),
1532
+ V.all_categories
1526
1533
  ] }) }) }),
1527
1534
  Fe && /* @__PURE__ */ e(
1528
- fo,
1535
+ yo,
1529
1536
  {
1530
1537
  header: be.header,
1531
1538
  icon: "multiline_chart",
1532
1539
  onClick: be.onClickHandler,
1533
1540
  primaryButton: be.primaryButton,
1534
1541
  subText: be.description,
1535
- sx: { height: B, maxWidth: 432 }
1542
+ sx: { height: l, maxWidth: 432 }
1536
1543
  }
1537
1544
  ),
1538
- !Fe && /* @__PURE__ */ C(S, { flexDirection: q ? "row" : "column", gap: q ? 48 : 16, children: [
1539
- ee === "Chart" && /* @__PURE__ */ C(wt, { children: [
1540
- /* @__PURE__ */ e(N, { sx: { width: q ? "68%" : "100%" }, children: /* @__PURE__ */ e(
1541
- jo,
1545
+ !Fe && /* @__PURE__ */ C(S, { flexDirection: ee ? "row" : "column", gap: ee ? 48 : 16, children: [
1546
+ B === "Chart" && /* @__PURE__ */ C(vt, { children: [
1547
+ /* @__PURE__ */ e(H, { sx: { width: ee ? "68%" : "100%" }, children: /* @__PURE__ */ e(
1548
+ Uo,
1542
1549
  {
1543
- availableHeight: B,
1550
+ availableHeight: l,
1544
1551
  minHeight: 450,
1545
1552
  selectedDateRange: w,
1546
- totals: f
1553
+ totals: T
1547
1554
  }
1548
1555
  ) }),
1549
- /* @__PURE__ */ C(S, { gap: 16, sx: { width: q ? "32%" : "100%" }, children: [
1550
- le && J && _e.length > 0 && /* @__PURE__ */ e(
1551
- Vo,
1556
+ /* @__PURE__ */ C(S, { gap: 16, sx: { width: ee ? "32%" : "100%" }, children: [
1557
+ ie && U && _e.length > 0 && /* @__PURE__ */ e(
1558
+ Fo,
1552
1559
  {
1553
1560
  beats: _e,
1554
1561
  onInsightCardClick: s
1555
1562
  }
1556
1563
  ),
1557
1564
  /* @__PURE__ */ e(
1558
- Bo,
1565
+ Po,
1559
1566
  {
1560
- availableHeight: d,
1561
- onCategoryClick: Ee
1567
+ availableHeight: b,
1568
+ onCategoryClick: he
1562
1569
  }
1563
1570
  )
1564
1571
  ] })
1565
1572
  ] }),
1566
- ee === "Table" && /* @__PURE__ */ e(N, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1573
+ B === "Table" && /* @__PURE__ */ e(H, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1567
1574
  Ct,
1568
1575
  {
1569
1576
  height: "unset",
1570
- onClickRow: Tt,
1571
- selectedCategory: se,
1577
+ onClickRow: St,
1578
+ selectedCategory: ne,
1572
1579
  selectedDateRange: w
1573
1580
  }
1574
1581
  ) })
@@ -1576,33 +1583,33 @@ const Lo = g.memo(Io), Qe = ({
1576
1583
  /* @__PURE__ */ e(
1577
1584
  Pe,
1578
1585
  {
1579
- ariaLabelClose: O.close_category_details,
1586
+ ariaLabelClose: V.close_category_details,
1580
1587
  isOpen: !!E,
1581
- onClose: he,
1588
+ onClose: Me,
1582
1589
  shouldShowHeaderShadow: !0,
1583
- title: E?.is_income ? O.category_income : O.category_spending,
1584
- children: E && /* @__PURE__ */ e($o, {})
1590
+ title: E?.is_income ? V.category_income : V.category_spending,
1591
+ children: E && /* @__PURE__ */ e(zo, {})
1585
1592
  }
1586
1593
  )
1587
1594
  ]
1588
1595
  }
1589
1596
  ),
1590
1597
  /* @__PURE__ */ e(
1591
- yo,
1598
+ Co,
1592
1599
  {
1593
- onClose: () => I(!1),
1594
- showConnectWidget: b,
1595
- title: G.mini_title
1600
+ onClose: () => F(!1),
1601
+ showConnectWidget: I,
1602
+ title: O.mini_title
1596
1603
  }
1597
1604
  )
1598
1605
  ]
1599
1606
  }
1600
1607
  );
1601
- }, ls = A(Zo);
1608
+ }, cs = A(Qo);
1602
1609
  export {
1603
- rs as TrendsFullWidget,
1604
- is as TrendsMicroWidget,
1605
- as as TrendsMiniWidget,
1606
- us as TrendsStore,
1607
- ls as TrendsWidget
1610
+ as as TrendsFullWidget,
1611
+ ls as TrendsMicroWidget,
1612
+ is as TrendsMiniWidget,
1613
+ ms as TrendsStore,
1614
+ cs as TrendsWidget
1608
1615
  };