@mx-cartographer/experiences 7.4.17 → 7.5.0

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 (14) hide show
  1. package/CHANGELOG.md +5 -0
  2. package/dist/{CategoryStore-U7hOZAbP.mjs → CategoryStore-CA3tS1BO.mjs} +25 -22
  3. package/dist/SpendingData-DQ1b9uqq.mjs +53 -0
  4. package/dist/TrendsStore-yO7qYv97.mjs +186 -0
  5. package/dist/accounts/index.es.js +1 -1
  6. package/dist/categories/index.es.js +1 -1
  7. package/dist/categories/stores/CategoryStore.d.ts +1 -0
  8. package/dist/common/index.es.js +4 -4
  9. package/dist/trends/components/TrendsTable.d.ts +0 -2
  10. package/dist/trends/index.es.js +677 -639
  11. package/dist/trends/utils/TrendsData.d.ts +1 -0
  12. package/package.json +1 -1
  13. package/dist/SpendingData-BuJ03S9d.mjs +0 -55
  14. package/dist/TrendsStore-BW9FGQeE.mjs +0 -182
package/dist/trends/index.es.js CHANGED
@@ -1,91 +1,92 @@
1
- import { jsxs as f, jsx as e, Fragment as rt } from "react/jsx-runtime";
2
- import u, { useRef as at, useState as it, useEffect as ct } from "react";
1
+ import { jsxs as f, jsx as e, Fragment as ct } from "react/jsx-runtime";
2
+ import u, { useRef as lt, useState as dt, useEffect as ut } from "react";
3
3
  import { observer as R } from "mobx-react-lite";
4
- import { CategoryIcon as Se, Text as $, Icon as fe, P as he, H3 as Fe, ChevronRightIcon as lt } from "@mxenabled/mxui";
5
- import H from "@mui/material/Box";
6
- import b from "@mui/material/Stack";
7
- import _e from "@mui/material/Button";
8
- import { addSeconds as $e } from "date-fns/addSeconds";
9
- import { differenceInCalendarMonths as Re } from "date-fns/differenceInCalendarMonths";
10
- import { useTheme as be } from "@mui/material/styles";
11
- import { LineChart as dt } from "@mui/x-charts";
12
- import { u as ee } from "../useScreenSize-B6JyS_Lj.mjs";
13
- import { u as ut } from "../useDimensions-27p2evRx.mjs";
14
- import ht from "@mui/material/Card";
15
- import gt from "@mui/material/CardContent";
16
- import ke from "@mui/material/Divider";
17
- import Oe from "@mui/material/Grid";
18
- import { u as N, m as U, g as V, b as me, h as xe, d as ve, v as pe, p as ze, f as Ne, a as mt } from "../hooks-ZMp65DFz.mjs";
19
- import { b as Ke } from "../Localization-2MODESHW.mjs";
4
+ import { CategoryIcon as Se, Text as P, Icon as _e, P as he, H3 as Ye, ChevronRightIcon as ht } from "@mxenabled/mxui";
5
+ import N from "@mui/material/Box";
6
+ import S from "@mui/material/Stack";
7
+ import be from "@mui/material/Button";
8
+ import { addSeconds as je } from "date-fns/addSeconds";
9
+ import { differenceInCalendarMonths as ke } from "date-fns/differenceInCalendarMonths";
10
+ import { useTheme as me } from "@mui/material/styles";
11
+ import { LineChart as gt } from "@mui/x-charts";
12
+ import { u as J } from "../useScreenSize-B6JyS_Lj.mjs";
13
+ import { u as mt } from "../useDimensions-27p2evRx.mjs";
14
+ import pt from "@mui/material/Card";
15
+ import Ct from "@mui/material/CardContent";
16
+ import He from "@mui/material/Divider";
17
+ import Ge from "@mui/material/Grid";
18
+ import { u as k, m as $, g as V, b as pe, h as xe, d as ve, v as Ce, p as Ue, f as We, a as yt } from "../hooks-ZMp65DFz.mjs";
19
+ import { b as ft } from "../Localization-2MODESHW.mjs";
20
20
  import { C as Te } from "../CurrencyText-Dr0EZ7bp.mjs";
21
- import { useTheme as pt, Card as Ct, CardContent as yt, Box as ft, Stack as _t } from "@mui/material";
22
- import { f as J, a as F } from "../Dialog-BPTr3qHE.mjs";
23
- import { C as Ae, c as Tt } from "../Category-CevNQ03n.mjs";
24
- import { f as se, a as St } from "../NumberFormatting-DjTD0t3W.mjs";
25
- import { a as bt, g as xt, L as je } from "../TrendsStore-BW9FGQeE.mjs";
26
- import { T as Gn } from "../TrendsStore-BW9FGQeE.mjs";
27
- import { i as vt, c as wt, d as Dt, e as It, f as Et, h as Lt, b as Ye, g as Ue, j as Ge } from "../SpendingData-BuJ03S9d.mjs";
28
- import Mt from "@mui/material/ToggleButton";
29
- import At from "@mui/material/ToggleButtonGroup";
30
- import { DataGridPro as Rt } from "@mui/x-data-grid-pro";
31
- import { H as Be } from "../HeaderCell-DjuifqHJ.mjs";
32
- import { T as G, b as kt } from "../ViewMoreMicroCard-DwR0v_ll.mjs";
33
- import { A as v, W as Xe } from "../WidgetContainer-CoFDmQRE.mjs";
34
- import { a as Ze, T as Qe } from "../TransactionDetails-m5PddMQn.mjs";
35
- import { D as He } from "../Drawer-By9V-B5L.mjs";
21
+ import { useTheme as _t, Card as bt, CardContent as Tt, Box as St, Stack as xt } from "@mui/material";
22
+ import { f as U, a as G } from "../Dialog-BPTr3qHE.mjs";
23
+ import { C as Ae, b as Be, c as vt } from "../Category-CevNQ03n.mjs";
24
+ import { f as se, a as wt } from "../NumberFormatting-DjTD0t3W.mjs";
25
+ import { c as It, a as Ve, g as Lt, L as Xe } from "../TrendsStore-yO7qYv97.mjs";
26
+ import { T as Vn } from "../TrendsStore-yO7qYv97.mjs";
27
+ import { c as Et, i as Dt, d as Mt, e as At, b as Ze, g as Qe, f as Fe } from "../SpendingData-DQ1b9uqq.mjs";
28
+ import Rt from "@mui/material/ToggleButton";
29
+ import kt from "@mui/material/ToggleButtonGroup";
30
+ import { parseISO as Pe } from "date-fns/parseISO";
31
+ import { DataGridPro as Ht } from "@mui/x-data-grid-pro";
32
+ import { H as Re } from "../HeaderCell-DjuifqHJ.mjs";
33
+ import { T as B, b as Nt } from "../ViewMoreMicroCard-DwR0v_ll.mjs";
34
+ import { A as I, W as qe } from "../WidgetContainer-CoFDmQRE.mjs";
35
+ import { a as Je, T as et } from "../TransactionDetails-m5PddMQn.mjs";
36
+ import { D as Ne } from "../Drawer-By9V-B5L.mjs";
36
37
  import { u as we } from "../useWidgetLoadTimer-hIOioiKx.mjs";
37
38
  import { L as ge } from "../Loader-DUaFpDGv.mjs";
38
- import { L as We } from "../LineChart-BQRxZF3p.mjs";
39
- import { M as Ht } from "../MiniWidgetContainer-Bg02sF1Y.mjs";
40
- import { subMonths as Nt } from "date-fns";
41
- import { TrendingUp as Wt, TrendingDown as Ot, MultilineChart as Gt, ExpandLess as Bt, ExpandMore as Vt } from "@mxenabled/mx-icons";
42
- import { M as Pt } from "../MicroWidgetContainer-r6mtxRer.mjs";
43
- import Ft from "@mui/material/Collapse";
44
- import $t from "@mui/material/List";
45
- import zt from "@mui/material/ListItem";
46
- import Kt from "@mui/material/ListItemButton";
47
- import jt from "@mui/material/ListItemIcon";
48
- import Yt from "@mui/material/ListItemText";
49
- import qe from "@mui/material/styles/useTheme";
50
- import Ut from "@mui/material/Paper";
51
- import { b as Xt } from "../CategoryUtil-DUM8NuGO.mjs";
52
- import { E as Zt } from "../ExportCsvAction-Cglo8Mca.mjs";
53
- import { u as Qt } from "../useInsightsEnabled-B7dxpDrX.mjs";
54
- import { E as qt } from "../EmptyState-DoxNUae-.mjs";
55
- import { l as Jt } from "../ConnectDrawer-BkvlItWx.mjs";
56
- const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
57
- const { categories: t } = N(), { getCategoryName: n } = U(), s = n(o);
58
- return /* @__PURE__ */ f(b, { alignItems: "center", direction: "column", gap: "8", justifyContent: "center", mb: 4, children: [
39
+ import { L as Oe } from "../LineChart-BQRxZF3p.mjs";
40
+ import { M as Wt } from "../MiniWidgetContainer-Bg02sF1Y.mjs";
41
+ import { subMonths as Ot } from "date-fns";
42
+ import { TrendingUp as Gt, TrendingDown as Bt, MultilineChart as Vt, ExpandLess as Ft, ExpandMore as Pt } from "@mxenabled/mx-icons";
43
+ import { M as $t } from "../MicroWidgetContainer-r6mtxRer.mjs";
44
+ import zt from "@mui/material/Collapse";
45
+ import Kt from "@mui/material/List";
46
+ import Yt from "@mui/material/ListItem";
47
+ import jt from "@mui/material/ListItemButton";
48
+ import Ut from "@mui/material/ListItemIcon";
49
+ import Xt from "@mui/material/ListItemText";
50
+ import tt from "@mui/material/styles/useTheme";
51
+ import Zt from "@mui/material/Paper";
52
+ import { b as Qt } from "../CategoryUtil-DUM8NuGO.mjs";
53
+ import { E as qt } from "../ExportCsvAction-Cglo8Mca.mjs";
54
+ import { u as Jt } from "../useInsightsEnabled-B7dxpDrX.mjs";
55
+ import { E as eo } from "../EmptyState-DoxNUae-.mjs";
56
+ import { l as to } from "../ConnectDrawer-BkvlItWx.mjs";
57
+ const ot = ({ categoryGuid: t, topLevelCategoryGuid: r }) => {
58
+ const { categories: n } = k(), { getCategoryName: o } = $(), s = o(t);
59
+ return /* @__PURE__ */ f(S, { alignItems: "center", direction: "column", gap: "8", justifyContent: "center", mb: 4, children: [
59
60
  /* @__PURE__ */ e(
60
- H,
61
+ N,
61
62
  {
62
- "aria-label": Ke(t.category_icon_label_aria, s),
63
+ "aria-label": ft(n.category_icon_label_aria, s),
63
64
  mb: 4,
64
65
  role: "img",
65
66
  children: /* @__PURE__ */ e(Se, { categoryGuid: r })
66
67
  }
67
68
  ),
68
- /* @__PURE__ */ e($, { variant: "Body", children: s })
69
+ /* @__PURE__ */ e(P, { variant: "Body", children: s })
69
70
  ] });
70
- }, eo = ({
71
- categoryGuids: { guid: o, topLevelGuid: r },
72
- hoveredAreaData: t,
73
- cursorPosition: n,
71
+ }, oo = ({
72
+ categoryGuids: { guid: t, topLevelGuid: r },
73
+ hoveredAreaData: n,
74
+ cursorPosition: o,
74
75
  chartContainerRef: s
75
76
  }) => {
76
- const h = be(), g = at(null), [d, c] = it({ x: n.x, y: n.y });
77
- if (ct(() => {
77
+ const h = me(), g = lt(null), [d, c] = dt({ x: o.x, y: o.y });
78
+ if (ut(() => {
78
79
  (() => {
79
- const l = g.current, T = s.current;
80
- if (!l || !T) return;
81
- const a = l.getBoundingClientRect(), p = T.getBoundingClientRect();
82
- let _ = n.x, y = n.y;
83
- _ + a.width * 2 > p.right ? _ = n.x - a.width : _ - a.width < p.left && (_ = n.x), y + a.height * 2 > p.bottom && (y = n.y - a.height), c({ x: _, y });
80
+ const l = g.current, b = s.current;
81
+ if (!l || !b) return;
82
+ const i = l.getBoundingClientRect(), C = b.getBoundingClientRect();
83
+ let p = o.x, _ = o.y;
84
+ p + i.width * 2 > C.right ? p = o.x - i.width : p - i.width < C.left && (p = o.x), _ + i.height * 2 > C.bottom && (_ = o.y - i.height), c({ x: p, y: _ });
84
85
  })();
85
- }, [n, s]), !t) return null;
86
- const m = t.reduce((C, l) => C + l.y, 0);
86
+ }, [o, s]), !n) return null;
87
+ const m = n.reduce((y, l) => y + l.y, 0);
87
88
  return /* @__PURE__ */ e(
88
- ht,
89
+ pt,
89
90
  {
90
91
  ref: g,
91
92
  sx: {
@@ -95,21 +96,21 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
95
96
  width: 250,
96
97
  pointerEvents: "none"
97
98
  },
98
- children: /* @__PURE__ */ f(gt, { children: [
99
- /* @__PURE__ */ f(H, { alignItems: "center", display: "flex", flexDirection: "column", children: [
100
- /* @__PURE__ */ e(Je, { categoryGuid: o, topLevelCategoryGuid: r }),
101
- /* @__PURE__ */ e($, { variant: "Small", children: `${t.length}-month total` }),
99
+ children: /* @__PURE__ */ f(Ct, { children: [
100
+ /* @__PURE__ */ f(N, { alignItems: "center", display: "flex", flexDirection: "column", children: [
101
+ /* @__PURE__ */ e(ot, { categoryGuid: t, topLevelCategoryGuid: r }),
102
+ /* @__PURE__ */ e(P, { variant: "Small", children: `${n.length}-month total` }),
102
103
  /* @__PURE__ */ e(Te, { amount: m, bold: !0, formatString: "0,0", variant: "body2" })
103
104
  ] }),
104
- /* @__PURE__ */ e(ke, { sx: { my: 16, width: "100%" } }),
105
- /* @__PURE__ */ e(Oe, { container: !0, children: t.map((C, l) => /* @__PURE__ */ f(u.Fragment, { children: [
106
- l > 0 && l % 3 === 0 && /* @__PURE__ */ e(ke, { sx: { my: 16, width: "100%" } }),
107
- /* @__PURE__ */ e(Oe, { item: !0, xs: 4, children: /* @__PURE__ */ f(H, { alignItems: "center", display: "flex", flexDirection: "column", children: [
108
- /* @__PURE__ */ e($, { color: h.palette.text.secondary, variant: "XSmall", children: C.x }),
105
+ /* @__PURE__ */ e(He, { sx: { my: 16, width: "100%" } }),
106
+ /* @__PURE__ */ e(Ge, { container: !0, children: n.map((y, l) => /* @__PURE__ */ f(u.Fragment, { children: [
107
+ l > 0 && l % 3 === 0 && /* @__PURE__ */ e(He, { sx: { my: 16, width: "100%" } }),
108
+ /* @__PURE__ */ e(Ge, { item: !0, xs: 4, children: /* @__PURE__ */ f(N, { alignItems: "center", display: "flex", flexDirection: "column", children: [
109
+ /* @__PURE__ */ e(P, { color: h.palette.text.secondary, variant: "XSmall", children: y.x }),
109
110
  /* @__PURE__ */ e(
110
111
  Te,
111
112
  {
112
- amount: C.y,
113
+ amount: y.y,
113
114
  bold: !0,
114
115
  formatString: "0,0",
115
116
  variant: "Body"
@@ -120,40 +121,40 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
120
121
  ] })
121
122
  }
122
123
  );
123
- }, to = R(eo), oo = ({
124
- categoryGuids: { guid: o, topLevelGuid: r },
125
- itemData: { dataIndex: t },
126
- series: n,
124
+ }, no = R(oo), so = ({
125
+ categoryGuids: { guid: t, topLevelGuid: r },
126
+ itemData: { dataIndex: n },
127
+ series: o,
127
128
  xData: s
128
129
  }) => {
129
- const h = pt(), g = n.data[t], d = s[t];
130
- return g === void 0 || !d ? null : /* @__PURE__ */ e(Ct, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(yt, { children: /* @__PURE__ */ f(ft, { alignItems: "center", display: "flex", flexDirection: "column", children: [
131
- /* @__PURE__ */ e(Je, { categoryGuid: o, topLevelCategoryGuid: r }),
132
- /* @__PURE__ */ e($, { color: h.palette.text.secondary, variant: "Small", children: J(d, F.MONTH_SHORT_YEAR) }),
130
+ const h = _t(), g = o.data[n], d = s[n];
131
+ return g === void 0 || !d ? null : /* @__PURE__ */ e(bt, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(Tt, { children: /* @__PURE__ */ f(St, { alignItems: "center", display: "flex", flexDirection: "column", children: [
132
+ /* @__PURE__ */ e(ot, { categoryGuid: t, topLevelCategoryGuid: r }),
133
+ /* @__PURE__ */ e(P, { color: h.palette.text.secondary, variant: "Small", children: U(d, G.MONTH_SHORT_YEAR) }),
133
134
  /* @__PURE__ */ e(Te, { amount: String(g), bold: !0, formatString: "0,0", variant: "Body" })
134
135
  ] }) }) });
135
- }, no = ({
136
- sx: o,
136
+ }, ro = ({
137
+ sx: t,
137
138
  categoryGuids: r,
138
- hoveredLegend: t,
139
- legendRef: n,
139
+ hoveredLegend: n,
140
+ legendRef: o,
140
141
  onHoverLegend: s,
141
142
  onClickLegend: h
142
143
  }) => {
143
- const { isMobile: g } = ee(), { getCategoryName: d } = U();
144
+ const { isMobile: g } = J(), { getCategoryName: d } = $();
144
145
  return /* @__PURE__ */ e(
145
- b,
146
+ S,
146
147
  {
147
148
  direction: "row",
148
149
  flexWrap: "wrap",
149
150
  gap: g ? 2 : 6,
150
151
  justifyContent: "start",
151
- ref: n,
152
- sx: o,
152
+ ref: o,
153
+ sx: t,
153
154
  children: r.map(({ guid: c, top_level_guid: m }) => {
154
- const C = t === c, l = Ae[c], T = Ae[m], a = l ?? T ?? Ae.default, p = a + "33";
155
+ const y = n === c, l = Ae[c], b = Ae[m], i = l ?? b ?? Ae.default, C = i + "33";
155
156
  return /* @__PURE__ */ f(
156
- _e,
157
+ be,
157
158
  {
158
159
  onClick: () => h(c),
159
160
  onMouseEnter: () => s(c),
@@ -167,22 +168,22 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
167
168
  paddingX: 8,
168
169
  paddingY: 4,
169
170
  borderRadius: 1,
170
- opacity: C ? 1 : 0.7
171
+ opacity: y ? 1 : 0.7
171
172
  },
172
173
  children: [
173
174
  /* @__PURE__ */ e(
174
- H,
175
+ N,
175
176
  {
176
177
  sx: {
177
178
  width: 16,
178
179
  height: 16,
179
180
  marginRight: g ? 5 : 10,
180
181
  borderRadius: "2px",
181
- backgroundColor: t ? C ? a : p : a
182
+ backgroundColor: n ? y ? i : C : i
182
183
  }
183
184
  }
184
185
  ),
185
- /* @__PURE__ */ e($, { variant: "Body", children: d(c) })
186
+ /* @__PURE__ */ e(P, { variant: "Body", children: d(c) })
186
187
  ]
187
188
  },
188
189
  c
@@ -190,111 +191,111 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
190
191
  })
191
192
  }
192
193
  );
193
- }, so = ({
194
- onHoverArea: o,
194
+ }, ao = ({
195
+ onHoverArea: t,
195
196
  onHoverPoint: r,
196
- onHoverLegend: t,
197
- onClickLegend: n,
197
+ onHoverLegend: n,
198
+ onClickLegend: o,
198
199
  stackedDatasets: s,
199
200
  unstackedDatasets: h = [],
200
201
  availableHeight: g = 0,
201
202
  minimumHeight: d = 350
202
203
  }) => {
203
- const c = be(), { isMobile: m } = ee(), [C, { height: l }] = ut(), T = u.useRef(null), [a, p] = u.useState(0);
204
+ const c = me(), { isMobile: m } = J(), [y, { height: l }] = mt(), b = u.useRef(null), [i, C] = u.useState(0);
204
205
  u.useEffect(() => {
205
- const i = Math.max(g - l, d);
206
- p(i);
206
+ const a = Math.max(g - l, d);
207
+ C(a);
207
208
  }, [g, l]);
208
- const [_, y] = u.useState(null), [E, x] = u.useState({
209
+ const [p, _] = u.useState(null), [x, v] = u.useState({
209
210
  hoveredSeriesId: null,
210
211
  hoveredAreaData: null,
211
212
  isAreaHovered: !1,
212
213
  cursorPos: { x: 0, y: 0 }
213
- }), { hoveredSeriesId: I, hoveredAreaData: W, isAreaHovered: L, cursorPos: O } = E, A = L && I && W, M = !A, P = [...s, ...h], z = P[0]?.dataset.length ?? 0, X = P.flatMap((i) => i.dataset.map((S) => S.x)), Ce = P.flatMap((i) => i.dataset.map((S) => S.y)), te = s[0]?.dataset?.map(
214
- (i, S) => s.reduce((D, Y) => D + Y.dataset[S]?.y || 0, 0)
214
+ }), { hoveredSeriesId: D, hoveredAreaData: M, isAreaHovered: L, cursorPos: A } = x, ee = L && D && M, W = !ee, F = [...s, ...h], z = F[0]?.dataset.length ?? 0, X = F.flatMap((a) => a.dataset.map((T) => T.x)), ye = F.flatMap((a) => a.dataset.map((T) => T.y)), te = s[0]?.dataset?.map(
215
+ (a, T) => s.reduce((E, j) => E + j.dataset[T]?.y || 0, 0)
215
216
  ) ?? [0], re = Math.max(...te), Z = Math.max(
216
- ...h.flatMap((i) => i.dataset.map((S) => S.y))
217
- ), ce = Math.floor(Math.min(...Ce) / 100) * 100, oe = Math.ceil(Math.max(re, Z) / 100) * 100, K = s.map((i, S) => ({
218
- id: `stacked-${S}`,
219
- guid: i.category_guid,
220
- top_level_guid: i.top_level_category_guid,
217
+ ...h.flatMap((a) => a.dataset.map((T) => T.y))
218
+ ), ce = Math.floor(Math.min(...ye) / 100) * 100, oe = Math.ceil(Math.max(re, Z) / 100) * 100, K = s.map((a, T) => ({
219
+ id: `stacked-${T}`,
220
+ guid: a.category_guid,
221
+ top_level_guid: a.top_level_category_guid,
221
222
  area: !0,
222
- color: s[S].category_color ?? c.palette.primary.main,
223
- data: i.dataset.map((D) => D.y),
224
- label: s[S].category_name,
223
+ color: s[T].category_color ?? c.palette.primary.main,
224
+ data: a.dataset.map((E) => E.y),
225
+ label: s[T].category_name,
225
226
  stack: "total",
226
227
  type: "line",
227
228
  highlightScope: { highlight: "item" },
228
- valueFormatter: (D) => se(D, "0,0")
229
- })), ae = h.map((i, S) => ({
230
- id: `unstacked-${S}`,
231
- guid: i.category_guid,
232
- top_level_guid: i.top_level_category_guid,
229
+ valueFormatter: (E) => se(E, "0,0")
230
+ })), ae = h.map((a, T) => ({
231
+ id: `unstacked-${T}`,
232
+ guid: a.category_guid,
233
+ top_level_guid: a.top_level_category_guid,
233
234
  area: !1,
234
- color: i.category_color,
235
- data: i.dataset.map((D) => D.y),
236
- label: i.category_name,
235
+ color: a.category_color,
236
+ data: a.dataset.map((E) => E.y),
237
+ label: a.category_name,
237
238
  type: "line",
238
- valueFormatter: (D) => se(D, "0,0")
239
+ valueFormatter: (E) => se(E, "0,0")
239
240
  })), ne = [...K, ...ae], ie = [
240
- ...K.map(({ guid: i, top_level_guid: S }) => ({
241
- guid: i,
242
- top_level_guid: S
241
+ ...K.map(({ guid: a, top_level_guid: T }) => ({
242
+ guid: a,
243
+ top_level_guid: T
243
244
  })),
244
- ...ae.map(({ guid: i, top_level_guid: S }) => ({
245
- guid: i,
246
- top_level_guid: S
245
+ ...ae.map(({ guid: a, top_level_guid: T }) => ({
246
+ guid: a,
247
+ top_level_guid: T
247
248
  }))
248
- ], Q = (i) => {
249
- const D = i.startsWith("stacked-") ? s[parseInt(i.split("-")[1])] : h[parseInt(i.split("-")[1])];
249
+ ], Q = (a) => {
250
+ const E = a.startsWith("stacked-") ? s[parseInt(a.split("-")[1])] : h[parseInt(a.split("-")[1])];
250
251
  return {
251
- guid: D?.category_guid,
252
- topLevelGuid: D?.top_level_category_guid
252
+ guid: E?.category_guid,
253
+ topLevelGuid: E?.top_level_category_guid
253
254
  };
254
- }, w = (i) => {
255
- y(i), t?.(i ?? "");
256
- }, B = (i) => {
257
- n?.(i ?? "");
258
- }, j = () => {
259
- const i = Q(String(I)).guid;
260
- i && n?.(i);
261
- }, le = (i) => {
262
- const S = String(i?.seriesId), D = Q(S).guid, Y = ne.find((de) => de.id === S), Ie = Y && i?.dataIndex !== void 0, Ee = Y && i?.dataIndex === void 0;
263
- if (Ie)
264
- x({
265
- hoveredSeriesId: S,
255
+ }, w = (a) => {
256
+ _(a), n?.(a ?? "");
257
+ }, O = (a) => {
258
+ o?.(a ?? "");
259
+ }, Y = () => {
260
+ const a = Q(String(D)).guid;
261
+ a && o?.(a);
262
+ }, le = (a) => {
263
+ const T = String(a?.seriesId), E = Q(T).guid, j = ne.find((de) => de.id === T), Le = j && a?.dataIndex !== void 0, Ee = j && a?.dataIndex === void 0;
264
+ if (Le)
265
+ v({
266
+ hoveredSeriesId: T,
266
267
  hoveredAreaData: null,
267
268
  isAreaHovered: !1,
268
- cursorPos: O
269
- }), r?.(D);
269
+ cursorPos: A
270
+ }), r?.(E);
270
271
  else if (Ee) {
271
- const de = Y?.data.map((Le, Me) => ({
272
+ const de = j?.data.map((De, Me) => ({
272
273
  x: X[Me],
273
- y: Le
274
+ y: De
274
275
  })) ?? [];
275
- x({
276
- hoveredSeriesId: S,
276
+ v({
277
+ hoveredSeriesId: T,
277
278
  hoveredAreaData: de,
278
279
  isAreaHovered: !0,
279
- cursorPos: O
280
- }), o?.(D);
280
+ cursorPos: A
281
+ }), t?.(E);
281
282
  } else
282
- x({
283
+ v({
283
284
  hoveredSeriesId: null,
284
285
  hoveredAreaData: null,
285
286
  isAreaHovered: !1,
286
- cursorPos: O
287
+ cursorPos: A
287
288
  });
288
- }, ye = (i) => {
289
- const S = i.currentTarget.getBoundingClientRect();
290
- x((D) => ({
291
- ...D,
289
+ }, fe = (a) => {
290
+ const T = a.currentTarget.getBoundingClientRect();
291
+ v((E) => ({
292
+ ...E,
292
293
  cursorPos: {
293
- x: i.clientX - S.left,
294
- y: i.clientY - S.top
294
+ x: a.clientX - T.left,
295
+ y: a.clientY - T.top
295
296
  }
296
297
  }));
297
- }, De = {
298
+ }, Ie = {
298
299
  p: 4,
299
300
  "& .MuiBarLabel-root": {
300
301
  fontSize: 10,
@@ -310,18 +311,18 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
310
311
  '& [class*="MuiLineElement-series-unstacked-"]': {
311
312
  strokeWidth: 3
312
313
  },
313
- ..._ && K.reduce((i, S, D) => {
314
- const Y = `.MuiAreaElement-series-stacked-${D}`;
315
- return i[Y] = {
316
- opacity: K[D].guid === _ ? 0.9 : 0.2
317
- }, i;
314
+ ...p && K.reduce((a, T, E) => {
315
+ const j = `.MuiAreaElement-series-stacked-${E}`;
316
+ return a[j] = {
317
+ opacity: K[E].guid === p ? 0.9 : 0.2
318
+ }, a;
318
319
  }, {})
319
320
  };
320
321
  return /* @__PURE__ */ e(
321
- H,
322
+ N,
322
323
  {
323
- onMouseMove: ye,
324
- ref: T,
324
+ onMouseMove: fe,
325
+ ref: b,
325
326
  sx: {
326
327
  position: "relative",
327
328
  touchAction: "pan-y",
@@ -334,18 +335,18 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
334
335
  }
335
336
  },
336
337
  children: /* @__PURE__ */ f(
337
- b,
338
+ S,
338
339
  {
339
340
  direction: { xs: "column", md: "column" },
340
341
  spacing: { xs: 0, md: 4 },
341
342
  sx: { width: "100%", position: "relative" },
342
343
  children: [
343
344
  /* @__PURE__ */ e(
344
- dt,
345
+ gt,
345
346
  {
346
- height: a,
347
+ height: i,
347
348
  margin: { bottom: 50 },
348
- onAreaClick: j,
349
+ onAreaClick: Y,
349
350
  onHighlightChange: le,
350
351
  series: ne,
351
352
  skipAnimation: !0,
@@ -355,24 +356,24 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
355
356
  }
356
357
  },
357
358
  slots: {
358
- itemContent: (i) => M && I ? /* @__PURE__ */ e(
359
- oo,
359
+ itemContent: (a) => W && D ? /* @__PURE__ */ e(
360
+ so,
360
361
  {
361
- categoryGuids: Q(I),
362
+ categoryGuids: Q(D),
362
363
  xData: X,
363
- ...i
364
+ ...a
364
365
  }
365
366
  ) : null
366
367
  },
367
- sx: De,
368
+ sx: Ie,
368
369
  tooltip: {
369
- trigger: M ? "item" : "none"
370
+ trigger: W ? "item" : "none"
370
371
  },
371
372
  xAxis: [
372
373
  {
373
374
  data: X,
374
375
  scaleType: "time",
375
- valueFormatter: (i) => J(i, F.MONTH_SHORT_YEAR),
376
+ valueFormatter: (a) => U(a, G.MONTH_SHORT_YEAR),
376
377
  tickNumber: z
377
378
  // How many ticks to show on the x-axis
378
379
  }
@@ -386,25 +387,25 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
386
387
  }
387
388
  ),
388
389
  /* @__PURE__ */ e(
389
- no,
390
+ ro,
390
391
  {
391
392
  categoryGuids: ie,
392
- hoveredLegend: _,
393
- legendRef: C,
394
- onClickLegend: B,
393
+ hoveredLegend: p,
394
+ legendRef: y,
395
+ onClickLegend: O,
395
396
  onHoverLegend: w,
396
397
  sx: { px: m ? 0 : 24 }
397
398
  }
398
399
  ),
399
- A && /* @__PURE__ */ e(
400
- to,
400
+ ee && /* @__PURE__ */ e(
401
+ no,
401
402
  {
402
- categoryGuids: Q(I),
403
- chartContainerRef: T,
404
- cursorPosition: O,
405
- hoveredAreaData: W.map((i) => ({
406
- ...i,
407
- x: J(i.x, F.MONTH_SHORT_YEAR)
403
+ categoryGuids: Q(D),
404
+ chartContainerRef: b,
405
+ cursorPosition: A,
406
+ hoveredAreaData: M.map((a) => ({
407
+ ...a,
408
+ x: U(a.x, G.MONTH_SHORT_YEAR)
408
409
  }))
409
410
  }
410
411
  )
@@ -413,29 +414,32 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
413
414
  )
414
415
  }
415
416
  );
416
- }, et = ({ selectedTab: o, onTabChange: r }) => /* @__PURE__ */ e(
417
- At,
417
+ }, nt = ({ selectedTab: t, onTabChange: r }) => /* @__PURE__ */ e(
418
+ kt,
418
419
  {
419
420
  exclusive: !0,
420
421
  onChange: r,
421
422
  orientation: "horizontal",
422
- value: o,
423
- children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(Mt, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(fe, { name: "table_chart_view" }) : /* @__PURE__ */ e(fe, { name: "format_list_bulleted" }) }, t))
423
+ value: t,
424
+ children: ["Chart", "Table"].map((n) => /* @__PURE__ */ e(Rt, { color: "primary", sx: { width: 56 }, value: n, children: n === "Chart" ? /* @__PURE__ */ e(_e, { name: "table_chart_view" }) : /* @__PURE__ */ e(_e, { name: "format_list_bulleted" }) }, n))
424
425
  }
425
- ), tt = ({ selectedDateRange: o, selectedCategoryGuid: r }) => {
426
- const { trends: t } = N(), { isMobile: n, isDesktop: s } = ee(), { getCategoryName: h } = U(), g = u.useMemo(() => {
427
- const d = J(
428
- o.start,
429
- n ? F.MONTH_SHORT_YEAR : F.MONTH_YEAR
430
- ), c = J(
431
- o.end,
432
- n ? F.MONTH_SHORT_YEAR : F.MONTH_YEAR
426
+ ), st = ({ selectedDateRange: t, selectedCategoryGuid: r }) => {
427
+ const { trends: n } = k(), { isMobile: o, isDesktop: s } = J(), { getCategoryName: h } = $(), g = u.useMemo(() => {
428
+ const d = t.start.getFullYear() === t.end.getFullYear() ? U(
429
+ t.start,
430
+ o ? G.MONTH_SHORT : G.MONTH_LONG
431
+ ) : U(
432
+ t.start,
433
+ o ? G.MONTH_SHORT_YEAR : G.MONTH_YEAR
434
+ ), c = U(
435
+ t.end,
436
+ o ? G.MONTH_SHORT_YEAR : G.MONTH_YEAR
433
437
  );
434
438
  return `${d} - ${c}`;
435
- }, [o, n]);
436
- return /* @__PURE__ */ f(H, { sx: { mr: 10, minWidth: "60%" }, children: [
439
+ }, [t, o]);
440
+ return /* @__PURE__ */ f(N, { sx: { mr: 10, minWidth: "60%" }, children: [
437
441
  /* @__PURE__ */ e(
438
- $,
442
+ P,
439
443
  {
440
444
  display: "block",
441
445
  fontWeight: 700,
@@ -445,257 +449,292 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
445
449
  textOverflow: "unset"
446
450
  },
447
451
  variant: s ? "H3" : "Body",
448
- children: h(r) || t.sub_title
452
+ children: h(r) || n.sub_title
449
453
  }
450
454
  ),
451
- /* @__PURE__ */ e($, { variant: s ? "Body" : "Small", children: g })
455
+ /* @__PURE__ */ e(P, { variant: s ? "subtitle1" : "body2", children: g })
452
456
  ] });
453
- }, ro = (o) => {
454
- const r = o.row[o.field];
455
- return /* @__PURE__ */ e(b, { alignItems: "flex-end", tabIndex: o.tabIndex, children: /* @__PURE__ */ e(Te, { amount: r, variant: "Small" }) });
456
- }, ao = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
457
- const { getCategoryName: t } = U(), { categories: n } = N(), s = n.default_categories[o]?.replace(/&amp;/g, "&") ?? t(o);
458
- return /* @__PURE__ */ f(b, { alignItems: "center", direction: "row", justifyContent: "center", children: [
459
- /* @__PURE__ */ e(
460
- H,
461
- {
462
- "aria-label": Ke(n.category_icon_label_aria, s),
463
- role: "img",
464
- children: /* @__PURE__ */ e(Se, { categoryGuid: r })
465
- }
466
- ),
467
- /* @__PURE__ */ e($, { sx: { ml: 12, pb: 6 }, variant: "Small", children: s })
457
+ }, $e = (t) => {
458
+ const r = t.row.category_guid, n = t.row.top_level_category_guid, o = r === Be.INCOME || n === Be.INCOME, s = t.row[t.field];
459
+ return /* @__PURE__ */ e(S, { alignItems: "flex-end", direction: "row", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(
460
+ Te,
461
+ {
462
+ amount: s,
463
+ isIncome: o,
464
+ sx: { fontWeight: o ? 600 : 500 },
465
+ symbol: o ? "+" : void 0,
466
+ variant: "body2"
467
+ }
468
+ ) });
469
+ }, io = ({ categoryGuid: t, topLevelCategoryGuid: r }) => {
470
+ const { getCategoryName: n } = $(), { categories: o } = k(), s = o.default_categories[t]?.replace(/&amp;/g, "&") ?? n(t);
471
+ return /* @__PURE__ */ f(S, { alignItems: "center", direction: "row", justifyContent: "center", children: [
472
+ /* @__PURE__ */ e(N, { "aria-hidden": !0, children: /* @__PURE__ */ e(Se, { categoryGuid: r, variant: "twotone" }) }),
473
+ /* @__PURE__ */ e(P, { sx: { ml: 12 }, variant: "body2", children: s })
468
474
  ] });
469
- }, io = (o) => /* @__PURE__ */ e(b, { alignItems: "center", direction: "row", height: "100%", width: "100%", children: /* @__PURE__ */ e(
470
- ao,
475
+ }, co = (t) => /* @__PURE__ */ e(S, { alignItems: "center", direction: "row", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(
476
+ io,
471
477
  {
472
- categoryGuid: o.row.category,
473
- topLevelCategoryGuid: o.row.top_level_category_guid
478
+ categoryGuid: t.row.category,
479
+ topLevelCategoryGuid: t.row.top_level_category_guid
474
480
  }
475
- ) }), co = (o, r) => {
476
- const t = [], n = new Date(o);
477
- for (; n <= r; ) {
478
- const s = J(n, F.MONTH);
479
- t.push(s), n.setMonth(n.getMonth() + 1);
481
+ ) }), lo = (t, r) => {
482
+ const n = [], o = new Date(t);
483
+ for (; o <= r; ) {
484
+ const s = U(o, G.MONTH_LONG);
485
+ n.push(s), o.setMonth(o.getMonth() + 1);
480
486
  }
481
- return t;
482
- }, ot = ({
483
- monthlyCategoryTotals: o,
484
- selectedDateRange: r,
485
- selectedCategory: t,
487
+ return n;
488
+ }, rt = ({
489
+ selectedDateRange: t,
490
+ selectedCategory: r,
486
491
  onClickRow: n,
487
- height: s = "100dvh",
488
- sx: h = {}
492
+ height: o = "100%",
493
+ sx: s = {}
489
494
  }) => {
490
- const { onEvent: g } = V(), d = J(/* @__PURE__ */ new Date(), F.MONTH_SHORT), [c, m] = u.useState([
491
- { field: d, sort: "desc" }
492
- ]), C = u.useMemo(() => co(r.start, r.end), [r]), l = [
495
+ const h = me(), { onEvent: g } = V(), { transactions: d, spending: c } = k(), { trendsCategories: m } = $(), y = u.useMemo(() => lo(t.start, t.end), [t]), l = h.palette.mode === "light", b = [
493
496
  {
494
497
  field: "category",
495
498
  flex: 1,
496
- headerName: "Category",
499
+ headerClassName: "trends-table-header",
500
+ headerName: d.category_title,
497
501
  minWidth: 175,
498
- renderHeader: Be,
499
- renderCell: io,
502
+ renderHeader: Re,
503
+ renderCell: co,
500
504
  sortable: !0,
505
+ sortComparator: It,
501
506
  type: "string"
502
507
  },
503
- ...C.map(
504
- (a) => ({
505
- field: a,
508
+ ...y.map(
509
+ (p) => ({
510
+ field: p,
506
511
  flex: 1,
507
- headerName: a,
512
+ headerClassName: "trends-table-header",
513
+ headerName: p,
508
514
  minWidth: 100,
509
- renderHeader: Be,
510
- renderCell: ro,
515
+ renderHeader: Re,
516
+ renderCell: $e,
511
517
  align: "right",
512
518
  headerAlign: "right",
513
519
  sortable: !0,
514
520
  hideSortIcons: !1,
515
521
  type: "number",
516
- sortComparator: bt
522
+ sortComparator: Ve
517
523
  })
518
- )
519
- ], T = u.useMemo(() => {
520
- const a = o.filter(
521
- (y) => !vt(y) && !wt(y)
522
- ), _ = (t ? a.filter(
523
- (y) => y.category_guid === t || y.top_level_category_guid === t
524
- ) : a).reduce(
525
- (y, E) => {
526
- const { category_guid: x, top_level_category_guid: I, month: W, total: L, year: O } = E, A = t ? x : I;
527
- y[A] || (y[A] = {
528
- id: A,
529
- category: A,
530
- category_guid: x,
531
- top_level_category_guid: I
532
- });
533
- const M = J(new Date(O, W - 1), F.MONTH_SHORT);
534
- return y[A][M] || (y[A][M] = 0), y[A][M] = y[A][M] + Math.abs(L), y;
535
- },
536
- {}
537
- );
538
- return Object.values(_);
539
- }, [o, t]);
540
- return /* @__PURE__ */ e(H, { sx: { height: s, width: "100%", overflowX: "auto", boxShadow: "none", ...h }, children: /* @__PURE__ */ e(
541
- Rt,
524
+ ),
542
525
  {
543
- columns: l,
526
+ field: "total",
527
+ flex: 1,
528
+ headerClassName: "trends-table-header",
529
+ headerName: `${c.total[0].toUpperCase()}${c.total.slice(1)}`,
530
+ minWidth: 100,
531
+ renderHeader: Re,
532
+ renderCell: $e,
533
+ align: "right",
534
+ headerAlign: "right",
535
+ sortable: !0,
536
+ hideSortIcons: !1,
537
+ type: "number",
538
+ sortComparator: Ve
539
+ }
540
+ ], i = u.useMemo(() => {
541
+ if (r)
542
+ return m.find((p) => p.guid === r);
543
+ }, [r, m]), C = u.useMemo(() => {
544
+ let p = m;
545
+ return i && (p = i.subCategories.filter(
546
+ (_) => _.monthlyAmounts.some((x) => x.amount !== 0)
547
+ )), p.map((_) => {
548
+ let x = _.totalMonthlyAmounts;
549
+ i && (x = _.monthlyAmounts);
550
+ const v = x.reduce(
551
+ (M, L) => {
552
+ const A = U(Pe(L.isoDate), G.MONTH_LONG);
553
+ return M[A] = L.amount, M;
554
+ },
555
+ {}
556
+ ), D = x.reduce((M, L) => {
557
+ const A = U(Pe(L.isoDate), G.MONTH_LONG);
558
+ return M + (y.includes(A) ? L.amount : 0);
559
+ }, 0);
560
+ return {
561
+ id: _.guid,
562
+ category: _.guid,
563
+ top_level_category_guid: _.parent_guid || _.guid,
564
+ total: D,
565
+ ...v
566
+ };
567
+ });
568
+ }, [m]);
569
+ return /* @__PURE__ */ e(N, { sx: { height: o, width: "100%", overflowX: "auto", boxShadow: "none", ...s }, children: /* @__PURE__ */ e(
570
+ Ht,
571
+ {
572
+ columns: b,
544
573
  disableColumnFilter: !0,
545
574
  disableColumnMenu: !0,
546
575
  hideFooter: !0,
547
- initialState: { sorting: { sortModel: c } },
548
- onRowClick: (a) => {
549
- n?.(a.row.category), g(v.TRENDS_CLICK_LIST_ITEM, {
550
- ...G,
551
- listItem: Tt[a.row.category]
576
+ initialState: { sorting: { sortModel: [{ field: "category", sort: "asc" }] } },
577
+ onRowClick: (p) => {
578
+ i || n?.(p.row.category), g(I.TRENDS_CLICK_LIST_ITEM, {
579
+ ...B,
580
+ listItem: vt[p.row.category]
552
581
  });
553
582
  },
554
- onSortModelChange: (a) => {
555
- m(a), g(v.TRENDS_CLICK_TABLE_SORT, G);
556
- },
557
- rows: T,
583
+ rowHeight: 64,
584
+ rows: C,
558
585
  slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
559
- sortModel: c,
560
- sortingOrder: ["asc", "desc"]
586
+ sortingOrder: ["asc", "desc"],
587
+ sx: {
588
+ borderColor: "divider",
589
+ borderWidth: 1,
590
+ borderStyle: "solid",
591
+ borderRadius: 2,
592
+ "& .MuiDataGrid-columnHeaders": {
593
+ bgcolor: l ? "neutral.50" : "neutral.800",
594
+ borderBottom: "none"
595
+ },
596
+ "& .trends-table-header": {
597
+ bgcolor: l ? "neutral.50" : "neutral.800"
598
+ }
599
+ }
561
600
  }
562
601
  ) });
563
- }, lo = {
602
+ }, uo = {
564
603
  title: "Transaction List"
565
- }, uo = ({
566
- categoryGuid: o,
604
+ }, ho = ({
605
+ categoryGuid: t,
567
606
  dateRange: r,
568
- isOpen: t,
569
- onClose: n
607
+ isOpen: n,
608
+ onClose: o
570
609
  }) => {
571
- const { onEvent: s } = V(), { selectedAccountGuids: h } = me(), { common: g } = N(), { setFilter: d, sortedTransactions: c } = xe(), [m, C] = u.useState(""), l = u.useMemo(
572
- () => c.find((a) => a.guid === m),
610
+ const { onEvent: s } = V(), { selectedAccountGuids: h } = pe(), { common: g } = k(), { setFilter: d, sortedTransactions: c } = xe(), [m, y] = u.useState(""), l = u.useMemo(
611
+ () => c.find((i) => i.guid === m),
573
612
  [m, c]
574
613
  );
575
614
  u.useEffect(() => {
576
615
  d({
577
616
  accounts: h,
578
617
  dateRange: r,
579
- custom: (a) => o === "" || o === a.category_guid || o === a.top_level_category_guid,
580
- showSplits: !!o
618
+ custom: (i) => t === "" || t === i.category_guid || t === i.top_level_category_guid,
619
+ showSplits: !!t
581
620
  });
582
- }, [h, o, r]), u.useEffect(() => s(v.TRENDS_VIEW_TRANSACTIONS), []);
583
- const T = () => {
584
- C(""), n();
621
+ }, [h, t, r]), u.useEffect(() => s(I.TRENDS_VIEW_TRANSACTIONS), []);
622
+ const b = () => {
623
+ y(""), o();
585
624
  };
586
625
  return /* @__PURE__ */ f(
587
- He,
626
+ Ne,
588
627
  {
589
628
  ariaLabelClose: g.close_aria,
590
- isOpen: t,
591
- onClose: T,
592
- title: lo.title,
629
+ isOpen: n,
630
+ onClose: b,
631
+ title: uo.title,
593
632
  children: [
594
- l && /* @__PURE__ */ e(Ze, { transaction: l }),
595
- !l && /* @__PURE__ */ e(Qe, { onClick: C })
633
+ l && /* @__PURE__ */ e(Je, { transaction: l }),
634
+ !l && /* @__PURE__ */ e(et, { onClick: y })
596
635
  ]
597
636
  }
598
637
  );
599
- }, ho = R(uo), go = ({ onBackClick: o, sx: r }) => {
600
- const { onEvent: t } = V(), { isDesktop: n, isTablet: s, isMobile: h } = ee(), { visibleAccounts: g } = ve(), { loadMonthlyCategoryTotals: d, monthlyCategoryTotals: c, getCategoryName: m } = U(), { sortedTransactions: C } = xe(), { selectedDateRange: l, setSelectedDateRange: T } = pe(), { isCopyLoaded: a, isInitialized: p, selectedAccounts: _, setSelectedAccounts: y } = me(), { trends: E } = N(), [x, I] = u.useState(!1), [W, L] = u.useState(!1), [O, A] = u.useState("Chart"), [M, P] = u.useState(""), [z, X] = u.useState(window.innerHeight), te = z - (h ? 315 : 345);
638
+ }, go = R(ho), mo = ({ onBackClick: t, sx: r }) => {
639
+ const { onEvent: n } = V(), { isDesktop: o, isTablet: s, isMobile: h } = J(), { visibleAccounts: g } = ve(), { loadMonthlyCategoryTotals: d, monthlyCategoryTotals: c, getCategoryName: m } = $(), { sortedTransactions: y } = xe(), { selectedDateRange: l, setSelectedDateRange: b } = Ce(), { isCopyLoaded: i, isInitialized: C, selectedAccounts: p, setSelectedAccounts: _ } = pe(), { trends: x } = k(), [v, D] = u.useState(!1), [M, L] = u.useState(!1), [A, ee] = u.useState("Chart"), [W, F] = u.useState(""), [z, X] = u.useState(window.innerHeight), te = z - (h ? 315 : 345);
601
640
  we({
602
641
  widgetName: "TrendsFullWidget",
603
- isLoaded: x
642
+ isLoaded: v
604
643
  }), u.useEffect(() => {
605
644
  const w = () => X(window.innerHeight);
606
645
  return window.addEventListener("resize", w), () => window.removeEventListener("resize", w);
607
646
  }, []), u.useEffect(() => {
608
- y(g);
647
+ _(g);
609
648
  }, [g]), u.useEffect(() => {
610
- p && d(
611
- _,
649
+ C && d(
650
+ p,
612
651
  l.start,
613
652
  l.end
614
653
  ).finally(() => {
615
- I(!0);
654
+ D(!0);
616
655
  });
617
- }, [p, _, l]);
656
+ }, [C, p, l]);
618
657
  const re = u.useMemo(() => {
619
- if (!x) return { stackedDatasets: [], unstackedDatasets: [] };
620
- const w = xt(
658
+ if (!v) return { stackedDatasets: [], unstackedDatasets: [] };
659
+ const w = Lt(
621
660
  c,
622
661
  l.start,
623
662
  l.end
624
- ), B = M.length ? w.filter(
625
- (j) => j.top_level_category_guid === M || j.category_guid === M
626
- ) : Dt(w);
663
+ ), O = W.length ? w.filter(
664
+ (Y) => Y.top_level_category_guid === W || Y.category_guid === W
665
+ ) : Et(w);
627
666
  return {
628
- stackedDatasets: B.filter(It),
629
- unstackedDatasets: B.filter(Et)
667
+ stackedDatasets: O.filter(Dt),
668
+ unstackedDatasets: O.filter(Mt)
630
669
  };
631
- }, [c, M, l]), Z = (w, B) => {
632
- A(B ?? O), t(v.TRENDS_CLICK_TOGGLE_VIEW);
670
+ }, [c, W, l]), Z = (w, O) => {
671
+ ee(O ?? A), n(I.TRENDS_CLICK_TOGGLE_VIEW);
633
672
  }, ce = (w) => {
634
- const B = $e(w?.[0], 1), j = w?.[1], le = Re(j, B);
635
- T({ start: B, end: j }), t(v.TRENDS_CLICK_TIME_WINDOW, {
673
+ const O = je(w?.[0], 1), Y = w?.[1], le = ke(Y, O);
674
+ b({ start: O, end: Y }), n(I.TRENDS_CLICK_TIME_WINDOW, {
636
675
  time_period: le + "M"
637
676
  });
638
677
  }, oe = () => {
639
- t(v.TRENDS_CLICK_FILTER);
678
+ n(I.TRENDS_CLICK_FILTER);
640
679
  }, K = (w) => {
641
- P(w);
680
+ F(w);
642
681
  }, ae = (w) => {
643
- P(w), t(v.TRENDS_CLICK_LEGEND, { category: m(w) });
682
+ F(w), n(I.TRENDS_CLICK_LEGEND, { category: m(w) });
644
683
  }, ne = (w) => {
645
- t(v.TRENDS_HOVER_LEGEND, { category: m(w) });
684
+ n(I.TRENDS_HOVER_LEGEND, { category: m(w) });
646
685
  }, ie = (w) => {
647
- t(v.TRENDS_HOVER_AREA, { category: w });
686
+ n(I.TRENDS_HOVER_AREA, { category: w });
648
687
  }, Q = (w) => {
649
- t(v.TRENDS_HOVER_POINT, { category: w });
688
+ n(I.TRENDS_HOVER_POINT, { category: w });
650
689
  };
651
- return !a || !p || !x ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ f(
652
- Xe,
690
+ return !i || !C || !v ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ f(
691
+ qe,
653
692
  {
654
693
  accountOptions: g,
655
694
  calendarActions: { onRangeChanged: ce },
656
695
  dateRange: l,
657
696
  dateRangeVariant: "timeframebuttons",
658
697
  onAccountsFilterClick: oe,
659
- onBackClick: o,
698
+ onBackClick: t,
660
699
  sx: r,
661
- title: E.title,
700
+ title: x.title,
662
701
  children: [
663
702
  /* @__PURE__ */ f(
664
- b,
703
+ S,
665
704
  {
666
705
  sx: {
667
706
  // eslint-disable-next-line no-nested-ternary
668
- px: n ? 48 : s ? 24 : 12
707
+ px: o ? 48 : s ? 24 : 12
669
708
  },
670
709
  children: [
671
710
  /* @__PURE__ */ f(
672
- b,
711
+ S,
673
712
  {
674
713
  flexDirection: "row",
675
714
  justifyContent: "space-between",
676
715
  sx: { pb: h ? 12 : 24, pt: h ? 24 : 48 },
677
716
  children: [
678
717
  /* @__PURE__ */ e(
679
- tt,
718
+ st,
680
719
  {
681
- selectedCategoryGuid: M,
720
+ selectedCategoryGuid: W,
682
721
  selectedDateRange: l
683
722
  }
684
723
  ),
685
- /* @__PURE__ */ e(et, { onTabChange: Z, selectedTab: O })
724
+ /* @__PURE__ */ e(nt, { onTabChange: Z, selectedTab: A })
686
725
  ]
687
726
  }
688
727
  ),
689
- /* @__PURE__ */ f(b, { alignItems: "center", flexDirection: "row", width: "100%", children: [
690
- /* @__PURE__ */ e(H, { flexGrow: 1, children: M && /* @__PURE__ */ f(_e, { onClick: () => P(""), sx: { p: 0, pr: 5 }, children: [
691
- /* @__PURE__ */ e(fe, { name: "arrow_back" }),
692
- E.all_categories
728
+ /* @__PURE__ */ f(S, { alignItems: "center", flexDirection: "row", width: "100%", children: [
729
+ /* @__PURE__ */ e(N, { flexGrow: 1, children: W && /* @__PURE__ */ f(be, { onClick: () => F(""), sx: { p: 0, pr: 5 }, children: [
730
+ /* @__PURE__ */ e(_e, { name: "arrow_back" }),
731
+ x.all_categories
693
732
  ] }) }),
694
- /* @__PURE__ */ e(_e, { onClick: () => L(!0), sx: { px: 5 }, children: `${E.view_transactions} (${C.length})` })
733
+ /* @__PURE__ */ e(be, { onClick: () => L(!0), sx: { px: 5 }, children: `${x.view_transactions} (${y.length})` })
695
734
  ] }),
696
- /* @__PURE__ */ f(H, { children: [
697
- O === "Chart" && /* @__PURE__ */ e(
698
- so,
735
+ /* @__PURE__ */ f(N, { children: [
736
+ A === "Chart" && /* @__PURE__ */ e(
737
+ ao,
699
738
  {
700
739
  availableHeight: te,
701
740
  onClickLegend: ae,
@@ -706,12 +745,11 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
706
745
  unstackedDatasets: re.unstackedDatasets
707
746
  }
708
747
  ),
709
- O === "Table" && /* @__PURE__ */ e(
710
- ot,
748
+ A === "Table" && /* @__PURE__ */ e(
749
+ rt,
711
750
  {
712
- monthlyCategoryTotals: c,
713
751
  onClickRow: K,
714
- selectedCategory: M,
752
+ selectedCategory: W,
715
753
  selectedDateRange: l
716
754
  }
717
755
  )
@@ -720,26 +758,26 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
720
758
  }
721
759
  ),
722
760
  /* @__PURE__ */ e(
723
- ho,
761
+ go,
724
762
  {
725
- categoryGuid: M,
763
+ categoryGuid: W,
726
764
  dateRange: l,
727
- isOpen: W,
765
+ isOpen: M,
728
766
  onClose: () => L(!1)
729
767
  }
730
768
  )
731
769
  ]
732
770
  }
733
771
  );
734
- }, Rn = R(go), mo = () => {
735
- const { monthlyCategoryTotals: o } = U(), { trends: r } = N(), t = be(), { availableHeight: n = 300 } = ze(), s = Lt(o);
772
+ }, Hn = R(mo), po = () => {
773
+ const { monthlyCategoryTotals: t } = $(), { trends: r } = k(), n = me(), { availableHeight: o = 300 } = Ue(), s = At(t);
736
774
  return /* @__PURE__ */ e(
737
- We,
775
+ Oe,
738
776
  {
739
777
  baseline: "min",
740
- colors: [t.palette.primary.main],
778
+ colors: [n.palette.primary.main],
741
779
  datasets: [s],
742
- height: n,
780
+ height: o,
743
781
  labels: [r.spending_label],
744
782
  showArea: !0,
745
783
  showAverage: !0,
@@ -749,41 +787,41 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
749
787
  valueFormatterString: "0,0"
750
788
  }
751
789
  );
752
- }, po = R(mo), Co = ({ onPrimaryCtaClick: o, sx: r }) => {
753
- const { visibleAccounts: t } = ve(), { loadMonthlyCategoryTotals: n, monthlyTotalsLoaded: s } = U(), { isInitialized: h } = Ne(), { trends: g } = N(), { isCopyLoaded: d, selectedAccounts: c, setSelectedAccounts: m } = me();
790
+ }, Co = R(po), yo = ({ onPrimaryCtaClick: t, sx: r }) => {
791
+ const { visibleAccounts: n } = ve(), { loadMonthlyCategoryTotals: o, monthlyTotalsLoaded: s } = $(), { isInitialized: h } = We(), { trends: g } = k(), { isCopyLoaded: d, selectedAccounts: c, setSelectedAccounts: m } = pe();
754
792
  return we({
755
793
  widgetName: "TrendsMiniWidget",
756
794
  isLoaded: s
757
795
  }), u.useEffect(() => {
758
- m(t);
759
- }, [t]), u.useEffect(() => {
760
- h && n(c).finally();
796
+ m(n);
797
+ }, [n]), u.useEffect(() => {
798
+ h && o(c).finally();
761
799
  }, [h, c]), !d || !h ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ e(
762
- Ht,
800
+ Wt,
763
801
  {
764
802
  contentStyles: { height: "calc(100% - 72px)", ":last-child": { pb: 0 } },
765
- onPrimaryCtaClick: o,
803
+ onPrimaryCtaClick: t,
766
804
  primaryCtaLabel: g.primary_cta,
767
805
  subTitle: g.sub_title,
768
806
  sx: { height: "100%", ...r },
769
807
  title: g.mini_title,
770
- children: s ? /* @__PURE__ */ e(po, {}) : /* @__PURE__ */ e(ge, {})
808
+ children: s ? /* @__PURE__ */ e(Co, {}) : /* @__PURE__ */ e(ge, {})
771
809
  }
772
810
  );
773
- }, kn = R(Co), yo = 70, Ve = ({
774
- title: o,
811
+ }, Nn = R(yo), fo = 70, ze = ({
812
+ title: t,
775
813
  totalAmount: r,
776
- transactionType: t,
777
- percentage: n,
814
+ transactionType: n,
815
+ percentage: o,
778
816
  secondaryLabel: s,
779
817
  shouldDisplayPercentage: h
780
818
  }) => {
781
- const { availableWidth: g } = ze(), d = u.useRef(null), c = u.useRef(null), m = St(Number(Math.abs(n)), {
819
+ const { availableWidth: g } = Ue(), d = u.useRef(null), c = u.useRef(null), m = wt(Number(Math.abs(o)), {
782
820
  style: "percent",
783
821
  minimumIntegerDigits: 1
784
- }), C = g === 288 && se(r, "0,0.00").length > 10 ? se(r, "0,0") : se(r, "0,0.00"), l = t === "spending" ? n > 0 : n >= 0, T = t === "spending" ? "error.main" : "success.main", a = t === "spending" ? "success.main" : "text.secondary", p = d?.current, _ = c?.current, y = p && _ ? p.scrollWidth > _.clientWidth - yo : !1;
822
+ }), y = g === 288 && se(r, "0,0.00").length > 10 ? se(r, "0,0") : se(r, "0,0.00"), l = n === "spending" ? o > 0 : o >= 0, b = n === "spending" ? "error.main" : "success.main", i = n === "spending" ? "success.main" : "text.secondary", C = d?.current, p = c?.current, _ = C && p ? C.scrollWidth > p.clientWidth - fo : !1;
785
823
  return /* @__PURE__ */ f(
786
- b,
824
+ S,
787
825
  {
788
826
  sx: {
789
827
  border: 1,
@@ -796,7 +834,7 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
796
834
  },
797
835
  children: [
798
836
  /* @__PURE__ */ f(
799
- b,
837
+ S,
800
838
  {
801
839
  sx: {
802
840
  alignItems: "center",
@@ -804,14 +842,14 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
804
842
  justifyContent: "space-between"
805
843
  },
806
844
  children: [
807
- /* @__PURE__ */ e(he, { color: "text.secondary", variant: "caption", children: o }),
808
- h && /* @__PURE__ */ f(b, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
809
- l ? /* @__PURE__ */ e(Wt, { size: 20, sx: { color: T } }) : /* @__PURE__ */ e(Ot, { size: 20, sx: { color: a } }),
845
+ /* @__PURE__ */ e(he, { color: "text.secondary", variant: "caption", children: t }),
846
+ h && /* @__PURE__ */ f(S, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
847
+ l ? /* @__PURE__ */ e(Gt, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(Bt, { size: 20, sx: { color: i } }),
810
848
  /* @__PURE__ */ e(
811
849
  he,
812
850
  {
813
851
  sx: {
814
- color: l ? T : a,
852
+ color: l ? b : i,
815
853
  fontWeight: 600
816
854
  },
817
855
  variant: "body2",
@@ -823,7 +861,7 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
823
861
  }
824
862
  ),
825
863
  /* @__PURE__ */ f(
826
- b,
864
+ S,
827
865
  {
828
866
  ref: c,
829
867
  sx: {
@@ -833,17 +871,17 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
833
871
  },
834
872
  children: [
835
873
  /* @__PURE__ */ e(
836
- H,
874
+ N,
837
875
  {
838
876
  ref: d,
839
877
  sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
840
- children: /* @__PURE__ */ e(Fe, { children: C })
878
+ children: /* @__PURE__ */ e(Ye, { children: y })
841
879
  }
842
880
  ),
843
- h && g >= 450 && !y && /* @__PURE__ */ e(
881
+ h && g >= 450 && !_ && /* @__PURE__ */ e(
844
882
  he,
845
883
  {
846
- color: l ? T : a,
884
+ color: l ? b : i,
847
885
  variant: "caption",
848
886
  children: s
849
887
  }
@@ -854,53 +892,53 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
854
892
  ]
855
893
  }
856
894
  );
857
- }, fo = R(() => {
858
- const { trends: o } = N();
859
- return /* @__PURE__ */ f(b, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
860
- /* @__PURE__ */ e(Gt, { size: 32 }),
861
- /* @__PURE__ */ f(b, { children: [
862
- /* @__PURE__ */ e(he, { fontWeight: 600, variant: "body1", children: o.zero_state_content_header }),
863
- /* @__PURE__ */ e(he, { color: "text.secondary", variant: "subtitle2", children: o.zero_state_content_description })
895
+ }, _o = R(() => {
896
+ const { trends: t } = k();
897
+ return /* @__PURE__ */ f(S, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
898
+ /* @__PURE__ */ e(Vt, { size: 32 }),
899
+ /* @__PURE__ */ f(S, { children: [
900
+ /* @__PURE__ */ e(he, { fontWeight: 600, variant: "body1", children: t.zero_state_content_header }),
901
+ /* @__PURE__ */ e(he, { color: "text.secondary", variant: "subtitle2", children: t.zero_state_content_description })
864
902
  ] })
865
903
  ] });
866
- }), Hn = R(({ onCtaClick: o }) => {
867
- const { visibleAccounts: r } = ve(), { onEvent: t } = V(), { monthlyCategoryTotals: n, loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: h } = U(), g = {
868
- start: Nt(/* @__PURE__ */ new Date(), 1),
904
+ }), Wn = R(({ onCtaClick: t }) => {
905
+ const { visibleAccounts: r } = ve(), { onEvent: n } = V(), { monthlyCategoryTotals: o, loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: h } = $(), g = {
906
+ start: Ot(/* @__PURE__ */ new Date(), 1),
869
907
  end: /* @__PURE__ */ new Date()
870
- }, { trends: d } = N(), { selectedAccounts: c, setSelectedAccounts: m, isInitialized: C } = me();
908
+ }, { trends: d } = k(), { selectedAccounts: c, setSelectedAccounts: m, isInitialized: y } = pe();
871
909
  we({
872
910
  widgetName: "TrendsMicroWidget",
873
911
  isLoaded: h
874
912
  }), u.useEffect(() => {
875
913
  m(r);
876
914
  }, [r]), u.useEffect(() => {
877
- C && s(c, g.start).then(() => {
878
- t(v.TRENDS_LOAD_WIDGET, {
915
+ y && s(c, g.start).then(() => {
916
+ n(I.TRENDS_LOAD_WIDGET, {
879
917
  state: r?.length ? "default" : "zeroState"
880
918
  });
881
919
  });
882
- }, [C, c]);
883
- const { spendingData: l, incomeData: T } = u.useMemo(
920
+ }, [y, c]);
921
+ const { spendingData: l, incomeData: b } = u.useMemo(
884
922
  () => ({
885
- spendingData: Ye(n, g),
886
- incomeData: Ue(n, g)
923
+ spendingData: Ze(o, g),
924
+ incomeData: Qe(o, g)
887
925
  }),
888
- [n, g]
889
- ), [a, p] = l, [_, y] = T, E = Ge(p.y, a.y), x = Ge(y.y, _.y), I = C && !r?.length, W = () => {
890
- t(
891
- I ? v.TRENDS_CLICK_GET_STARTED : v.TRENDS_CLICK_VIEW_MORE
892
- ), o();
926
+ [o, g]
927
+ ), [i, C] = l, [p, _] = b, x = Fe(C.y, i.y), v = Fe(_.y, p.y), D = y && !r?.length, M = () => {
928
+ n(
929
+ D ? I.TRENDS_CLICK_GET_STARTED : I.TRENDS_CLICK_VIEW_MORE
930
+ ), t();
893
931
  };
894
- return !h || !C ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ e(
895
- Pt,
932
+ return !h || !y ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ e(
933
+ $t,
896
934
  {
897
935
  className: "mx-trends-microwidget",
898
936
  ctaLabel: d.micro_primary_cta_label,
899
- onCTAClick: W,
900
- subHeader: I ? void 0 : d.micro_subheader,
937
+ onCTAClick: M,
938
+ subHeader: D ? void 0 : d.micro_subheader,
901
939
  title: d.title,
902
- children: I ? /* @__PURE__ */ e(fo, {}) : /* @__PURE__ */ f(
903
- b,
940
+ children: D ? /* @__PURE__ */ e(_o, {}) : /* @__PURE__ */ f(
941
+ S,
904
942
  {
905
943
  sx: {
906
944
  alignItems: "stretch",
@@ -909,24 +947,24 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
909
947
  },
910
948
  children: [
911
949
  /* @__PURE__ */ e(
912
- Ve,
950
+ ze,
913
951
  {
914
- percentage: E,
952
+ percentage: x,
915
953
  secondaryLabel: d.micro_secondary_label,
916
- shouldDisplayPercentage: p.y !== 0 && a.y !== 0,
954
+ shouldDisplayPercentage: C.y !== 0 && i.y !== 0,
917
955
  title: d.spending_label,
918
- totalAmount: p.y,
956
+ totalAmount: C.y,
919
957
  transactionType: "spending"
920
958
  }
921
959
  ),
922
960
  /* @__PURE__ */ e(
923
- Ve,
961
+ ze,
924
962
  {
925
- percentage: x,
963
+ percentage: v,
926
964
  secondaryLabel: d.micro_secondary_label,
927
- shouldDisplayPercentage: y.y !== 0 && _.y !== 0,
965
+ shouldDisplayPercentage: _.y !== 0 && p.y !== 0,
928
966
  title: d.income_label,
929
- totalAmount: y.y,
967
+ totalAmount: _.y,
930
968
  transactionType: "income"
931
969
  }
932
970
  )
@@ -935,21 +973,21 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
935
973
  )
936
974
  }
937
975
  );
938
- }), _o = R(
939
- ({ isExpanded: o, onClick: r }) => {
940
- const t = qe();
941
- return /* @__PURE__ */ e(zt, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(Kt, { onClick: r, sx: { justifyContent: "center" }, children: /* @__PURE__ */ f(
942
- b,
976
+ }), bo = R(
977
+ ({ isExpanded: t, onClick: r }) => {
978
+ const n = tt();
979
+ return /* @__PURE__ */ e(Yt, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(jt, { onClick: r, sx: { justifyContent: "center" }, children: /* @__PURE__ */ f(
980
+ S,
943
981
  {
944
- sx: { color: t.palette.primary.main, flexDirection: "row", alignItems: "center" },
982
+ sx: { color: n.palette.primary.main, flexDirection: "row", alignItems: "center" },
945
983
  children: [
946
- /* @__PURE__ */ e(Yt, { children: /* @__PURE__ */ e($, { bold: !0, variant: "body2", children: o ? "View less" : "View more" }) }),
947
- /* @__PURE__ */ e(jt, { sx: { color: t.palette.primary.main }, children: o ? /* @__PURE__ */ e(Bt, {}) : /* @__PURE__ */ e(
948
- Vt,
984
+ /* @__PURE__ */ e(Xt, { children: /* @__PURE__ */ e(P, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
985
+ /* @__PURE__ */ e(Ut, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(Ft, {}) : /* @__PURE__ */ e(
986
+ Pt,
949
987
  {
950
988
  sx: {
951
989
  transition: "transform 0.3s ease-in-out",
952
- transform: o ? "rotate(180deg)" : "rotate(0deg)"
990
+ transform: t ? "rotate(180deg)" : "rotate(0deg)"
953
991
  }
954
992
  }
955
993
  ) })
@@ -957,97 +995,97 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
957
995
  }
958
996
  ) }) });
959
997
  }
960
- ), Pe = R(
998
+ ), Ke = R(
961
999
  ({
962
- totalAmount: o,
1000
+ totalAmount: t,
963
1001
  guid: r,
964
- name: t,
965
- transactions: n,
1002
+ name: n,
1003
+ transactions: o,
966
1004
  onClick: s,
967
1005
  isLastItem: h = !1,
968
1006
  showDivider: g = !0
969
1007
  }) => {
970
- const { trends: d } = N(), { onEvent: c } = V(), m = `${n.length} ${n.length === 1 ? d.transaction : d.transactions}`, C = () => {
971
- s?.(), c(v.TRENDS_CLICK_LIST_ITEM, {
972
- ...G,
973
- listItem: t
1008
+ const { trends: d } = k(), { onEvent: c } = V(), m = `${o.length} ${o.length === 1 ? d.transaction : d.transactions}`, y = () => {
1009
+ s?.(), c(I.TRENDS_CLICK_LIST_ITEM, {
1010
+ ...B,
1011
+ listItem: n
974
1012
  });
975
1013
  };
976
1014
  return /* @__PURE__ */ f(u.Fragment, { children: [
977
1015
  /* @__PURE__ */ e(
978
- je,
1016
+ Xe,
979
1017
  {
980
1018
  leftIcon: r ? /* @__PURE__ */ e(Se, { categoryGuid: r }) : void 0,
981
- onClick: C,
982
- rightContent: se(Math.abs(o), "0,0.00"),
983
- rightIcon: s ? /* @__PURE__ */ e(lt, {}) : void 0,
1019
+ onClick: y,
1020
+ rightContent: se(Math.abs(t), "0,0.00"),
1021
+ rightIcon: s ? /* @__PURE__ */ e(ht, {}) : void 0,
984
1022
  subtitle: m,
985
- title: t
1023
+ title: n
986
1024
  }
987
1025
  ),
988
- g && /* @__PURE__ */ e(ke, { sx: { ml: h ? 24 : 68 } })
1026
+ g && /* @__PURE__ */ e(He, { sx: { ml: h ? 24 : 68 } })
989
1027
  ] }, r);
990
1028
  }
991
1029
  ), To = R(
992
- ({ availableHeight: o = 0, onCategoryClick: r }) => {
993
- const { collapsedCategories: t, visibleCategories: n, setVisibleListLength: s } = pe(), { isLargeDesktop: h, isDesktop: g } = ee(), { trends: d } = N(), { onEvent: c } = V(), [m, C] = u.useState(!1), l = g || h;
1030
+ ({ availableHeight: t = 0, onCategoryClick: r }) => {
1031
+ const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: s } = Ce(), { isLargeDesktop: h, isDesktop: g } = J(), { trends: d } = k(), { onEvent: c } = V(), [m, y] = u.useState(!1), l = g || h;
994
1032
  u.useEffect(() => {
995
- const p = Math.floor(o / 64) - 1, _ = n.length + t.length;
996
- p !== n.length && (s(l ? Math.max(p, 5) : 5), C(p >= _));
997
- }, [o]);
998
- const T = () => {
999
- C(!m), c(v.TRENDS_CLICK_VIEW_MORE, {
1000
- ...G
1033
+ const C = Math.floor(t / 64) - 1, p = o.length + n.length;
1034
+ C !== o.length && (s(l ? Math.max(C, 5) : 5), y(C >= p));
1035
+ }, [t]);
1036
+ const b = () => {
1037
+ y(!m), c(I.TRENDS_CLICK_VIEW_MORE, {
1038
+ ...B
1001
1039
  });
1002
- }, a = n.length + (m ? t.length : 0);
1003
- return /* @__PURE__ */ e(b, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f($t, { children: [
1004
- /* @__PURE__ */ e(b, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Fe, { children: d.categories }) }),
1005
- n.map((p, _) => /* @__PURE__ */ e(
1006
- Pe,
1040
+ }, i = o.length + (m ? n.length : 0);
1041
+ return /* @__PURE__ */ e(S, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(Kt, { children: [
1042
+ /* @__PURE__ */ e(S, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Ye, { children: d.categories }) }),
1043
+ o.map((C, p) => /* @__PURE__ */ e(
1044
+ Ke,
1007
1045
  {
1008
- ...p,
1009
- isLastItem: _ === a - 1,
1010
- onClick: p.transactions.length > 0 ? () => r(p) : void 0,
1046
+ ...C,
1047
+ isLastItem: p === i - 1,
1048
+ onClick: C.transactions.length > 0 ? () => r(C) : void 0,
1011
1049
  showDivider: !0
1012
1050
  },
1013
- p.guid
1051
+ C.guid
1014
1052
  )),
1015
1053
  /* @__PURE__ */ e(
1016
- Ft,
1054
+ zt,
1017
1055
  {
1018
1056
  in: m,
1019
1057
  sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
1020
- children: t.map((p, _) => {
1021
- const y = n.length + _;
1058
+ children: n.map((C, p) => {
1059
+ const _ = o.length + p;
1022
1060
  return /* @__PURE__ */ e(
1023
- Pe,
1061
+ Ke,
1024
1062
  {
1025
- ...p,
1026
- isLastItem: y === a - 1,
1027
- onClick: p.transactions.length > 0 ? () => r(p) : void 0,
1063
+ ...C,
1064
+ isLastItem: _ === i - 1,
1065
+ onClick: C.transactions.length > 0 ? () => r(C) : void 0,
1028
1066
  showDivider: !0
1029
1067
  },
1030
- p.guid
1068
+ C.guid
1031
1069
  );
1032
1070
  })
1033
1071
  }
1034
1072
  ),
1035
- t.length > 0 && /* @__PURE__ */ e(_o, { isExpanded: m, onClick: T })
1073
+ n.length > 0 && /* @__PURE__ */ e(bo, { isExpanded: m, onClick: b })
1036
1074
  ] }) });
1037
1075
  }
1038
- ), So = ({ beats: o, onInsightCardClick: r }) => {
1039
- const { onEvent: t } = V(), { isMobile: n, isDesktop: s, isLargeDesktop: h } = ee(), { beatStore: g, endpoint: d, sessionToken: c } = Ne(), m = s || h, C = m || n ? 1 : 2, l = () => null, T = (x) => {
1040
- r?.(x), t(v.TRENDS_CLICK_INSIGHT, G);
1041
- }, a = m ? 200 : 170, p = m ? 170 : 124, _ = m ? 56 : 0, y = o.length > 0 ? a + _ : p, E = m && o.length > 0 ? a : void 0;
1042
- return /* @__PURE__ */ e(_t, { sx: { height: y }, children: /* @__PURE__ */ e(
1043
- kt,
1076
+ ), So = ({ beats: t, onInsightCardClick: r }) => {
1077
+ const { onEvent: n } = V(), { isMobile: o, isDesktop: s, isLargeDesktop: h } = J(), { beatStore: g, endpoint: d, sessionToken: c } = We(), m = s || h, y = m || o ? 1 : 2, l = () => null, b = (v) => {
1078
+ r?.(v), n(I.TRENDS_CLICK_INSIGHT, B);
1079
+ }, i = m ? 200 : 170, C = m ? 170 : 124, p = m ? 56 : 0, _ = t.length > 0 ? i + p : C, x = m && t.length > 0 ? i : void 0;
1080
+ return /* @__PURE__ */ e(xt, { sx: { height: _ }, children: /* @__PURE__ */ e(
1081
+ Nt,
1044
1082
  {
1045
1083
  areBeatsLoading: g.isLoading,
1046
- beats: o,
1084
+ beats: t,
1047
1085
  endpoint: d,
1048
- heightOverrides: E,
1086
+ heightOverrides: x,
1049
1087
  logOutUser: l,
1050
- onCardClick: T,
1088
+ onCardClick: b,
1051
1089
  showBorder: !0,
1052
1090
  showCTAColocatedWithText: !1,
1053
1091
  showCarouselControls: !0,
@@ -1057,28 +1095,28 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1057
1095
  token: c,
1058
1096
  userHasFullInsightFeedBeats: !1,
1059
1097
  variant: "outlined",
1060
- visibleCardsCount: C
1098
+ visibleCardsCount: y
1061
1099
  }
1062
1100
  ) });
1063
- }, bo = R(So), xo = R(({ chartLabel: o, chartColor: r }) => {
1064
- const { onEvent: t } = V(), {
1065
- categoryDetailsChartData: { monthlyAmounts: n, tooltipLabels: s }
1066
- } = pe();
1067
- return /* @__PURE__ */ e(b, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
1068
- We,
1101
+ }, xo = R(So), vo = R(({ chartLabel: t, chartColor: r }) => {
1102
+ const { onEvent: n } = V(), {
1103
+ categoryDetailsChartData: { monthlyAmounts: o, tooltipLabels: s }
1104
+ } = Ce();
1105
+ return /* @__PURE__ */ e(S, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
1106
+ Oe,
1069
1107
  {
1070
1108
  baseline: "min",
1071
1109
  colors: [r],
1072
1110
  curveType: "bump",
1073
1111
  customTooltipLabels: s,
1074
- datasets: [n],
1112
+ datasets: [o],
1075
1113
  height: 265,
1076
- labels: [o],
1114
+ labels: [t],
1077
1115
  markStyles: () => ({
1078
1116
  stroke: r
1079
1117
  }),
1080
1118
  onItemClick: () => {
1081
- t(v.TRENDS_CLICK_CHART, G);
1119
+ n(I.TRENDS_CLICK_CHART, B);
1082
1120
  },
1083
1121
  showArea: !0,
1084
1122
  showAverage: !0,
@@ -1093,70 +1131,70 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1093
1131
  valueFormatterString: "0,0"
1094
1132
  }
1095
1133
  ) });
1096
- }), vo = R(({ onClose: o }) => {
1097
- const r = qe(), { onEvent: t } = V(), { common: n, trends: s } = N(), { selectedCategoryData: h, selectedDateRangeMonthRange: g } = pe(), { sortedTransactions: d } = xe(), [c, m] = u.useState(null);
1134
+ }), wo = R(({ onClose: t }) => {
1135
+ const r = tt(), { onEvent: n } = V(), { common: o, trends: s } = k(), { selectedCategoryData: h, selectedDateRangeMonthRange: g } = Ce(), { sortedTransactions: d } = xe(), [c, m] = u.useState(null);
1098
1136
  if (!h)
1099
1137
  return null;
1100
- const { guid: C, name: l, is_income: T, totalAmount: a } = h, p = T ? s.category_income : s.category_spending, _ = Xt(C, r), y = T ? s.income_label : s.spending_label, E = ` ${h.transactions.length === 1 ? s.transaction : s.transactions} (${h.transactions.length})`, x = u.useMemo(
1138
+ const { guid: y, name: l, is_income: b, totalAmount: i } = h, C = b ? s.category_income : s.category_spending, p = Qt(y, r), _ = b ? s.income_label : s.spending_label, x = ` ${h.transactions.length === 1 ? s.transaction : s.transactions} (${h.transactions.length})`, v = u.useMemo(
1101
1139
  () => d.find((L) => L.guid === c),
1102
1140
  [c, d]
1103
- ), I = (L) => L.category_guid === C || L.top_level_category_guid === C, W = () => {
1104
- o?.(), t(v.TRENDS_CLICK_BACK, G);
1141
+ ), D = (L) => L.category_guid === y || L.top_level_category_guid === y, M = () => {
1142
+ t?.(), n(I.TRENDS_CLICK_BACK, B);
1105
1143
  };
1106
1144
  return /* @__PURE__ */ f(
1107
- He,
1145
+ Ne,
1108
1146
  {
1109
1147
  ariaLabelClose: s.close_category_details,
1110
1148
  isOpen: !0,
1111
- onClose: W,
1149
+ onClose: M,
1112
1150
  shouldShowHeaderShadow: !0,
1113
- title: p,
1151
+ title: C,
1114
1152
  children: [
1115
- /* @__PURE__ */ f(b, { sx: { alignItems: "center", height: "100%" }, children: [
1116
- /* @__PURE__ */ f(Ut, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
1153
+ /* @__PURE__ */ f(S, { sx: { alignItems: "center", height: "100%" }, children: [
1154
+ /* @__PURE__ */ f(Zt, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
1117
1155
  /* @__PURE__ */ e(
1118
- je,
1156
+ Xe,
1119
1157
  {
1120
- leftIcon: /* @__PURE__ */ e(Se, { categoryGuid: C }),
1121
- rightContent: se(Math.abs(a), "0,0.00"),
1158
+ leftIcon: /* @__PURE__ */ e(Se, { categoryGuid: y }),
1159
+ rightContent: se(Math.abs(i), "0,0.00"),
1122
1160
  subtitle: g,
1123
1161
  title: l
1124
1162
  }
1125
1163
  ),
1126
- /* @__PURE__ */ e(xo, { chartColor: _, chartLabel: y }),
1127
- /* @__PURE__ */ f(b, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
1128
- /* @__PURE__ */ e($, { bold: !0, variant: "body1", children: E }),
1129
- /* @__PURE__ */ e(Zt, { filter: I })
1164
+ /* @__PURE__ */ e(vo, { chartColor: p, chartLabel: _ }),
1165
+ /* @__PURE__ */ f(S, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
1166
+ /* @__PURE__ */ e(P, { bold: !0, variant: "body1", children: x }),
1167
+ /* @__PURE__ */ e(qt, { filter: D })
1130
1168
  ] })
1131
1169
  ] }),
1132
1170
  /* @__PURE__ */ e(
1133
- Qe,
1171
+ et,
1134
1172
  {
1135
1173
  bgcolor: "transparent",
1136
- filter: I,
1174
+ filter: D,
1137
1175
  height: "calc(100vh - 475px)",
1138
1176
  onClick: m
1139
1177
  }
1140
1178
  )
1141
1179
  ] }),
1142
1180
  /* @__PURE__ */ e(
1143
- He,
1181
+ Ne,
1144
1182
  {
1145
- ariaLabelClose: n.close_aria,
1146
- isOpen: !!x,
1183
+ ariaLabelClose: o.close_aria,
1184
+ isOpen: !!v,
1147
1185
  onClose: () => m(""),
1148
1186
  title: s.transaction,
1149
- children: x && /* @__PURE__ */ e(Ze, { transaction: x })
1187
+ children: v && /* @__PURE__ */ e(Je, { transaction: v })
1150
1188
  }
1151
1189
  )
1152
1190
  ]
1153
1191
  }
1154
1192
  );
1155
- }), wo = (o, r) => {
1156
- const t = Ue(o, r), n = Ye(o, r);
1157
- return [t, n].filter((s) => s.length > 0);
1158
- }, Do = (o, r) => {
1159
- const [t, n] = o, s = t, h = n ?? t, g = [];
1193
+ }), Io = (t, r) => {
1194
+ const n = Qe(t, r), o = Ze(t, r);
1195
+ return [n, o].filter((s) => s.length > 0);
1196
+ }, Lo = (t, r) => {
1197
+ const [n, o] = t, s = n, h = o ?? n, g = [];
1160
1198
  if (s) {
1161
1199
  const d = s.reduce((c, m) => c + m.y, 0);
1162
1200
  g.push({ label: r.income_label, amount: d });
@@ -1166,27 +1204,27 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1166
1204
  g.push({ label: r.spending_label, amount: d });
1167
1205
  }
1168
1206
  return g;
1169
- }, Io = ({
1170
- availableHeight: o = 0,
1207
+ }, Eo = ({
1208
+ availableHeight: t = 0,
1171
1209
  minHeight: r = 500,
1172
- selectedDateRange: t,
1173
- totals: n
1210
+ selectedDateRange: n,
1211
+ totals: o
1174
1212
  }) => {
1175
- const s = be(), { onEvent: h } = V(), { trends: g } = N(), { isSmallMobile: d, isMobile: c, isSmallTablet: m, isTablet: C } = ee(), l = [s.palette.chart?.chart1, s.palette.chart?.chart2], T = wo(n, t), a = Do(T, g), [p, _] = u.useState(0), y = 458, E = 195, x = 56, I = c || d ? E : m || C ? y : p;
1213
+ const s = me(), { onEvent: h } = V(), { trends: g } = k(), { isSmallMobile: d, isMobile: c, isSmallTablet: m, isTablet: y } = J(), l = [s.palette.chart?.chart1, s.palette.chart?.chart2], b = Io(o, n), i = Lo(b, g), [C, p] = u.useState(0), _ = 458, x = 195, v = 56, D = c || d ? x : m || y ? _ : C;
1176
1214
  return u.useEffect(() => {
1177
- const L = Math.max(o - x, r);
1178
- _(L);
1179
- }, [o]), /* @__PURE__ */ e(
1180
- We,
1215
+ const L = Math.max(t - v, r);
1216
+ p(L);
1217
+ }, [t]), /* @__PURE__ */ e(
1218
+ Oe,
1181
1219
  {
1182
1220
  baseline: "min",
1183
1221
  colors: l,
1184
1222
  curveType: "bump",
1185
- datasets: T,
1186
- height: I,
1187
- labels: a,
1223
+ datasets: b,
1224
+ height: D,
1225
+ labels: i,
1188
1226
  onItemClick: () => {
1189
- h(v.TRENDS_CLICK_CHART, G);
1227
+ h(I.TRENDS_CLICK_CHART, B);
1190
1228
  },
1191
1229
  showArea: !0,
1192
1230
  showAxisHighlight: !0,
@@ -1199,7 +1237,7 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1199
1237
  valueFormatterString: "0.0a"
1200
1238
  }
1201
1239
  );
1202
- }, Eo = R(Io), Lo = [
1240
+ }, Do = R(Eo), Mo = [
1203
1241
  "BillAmountNotStandard",
1204
1242
  "CategorySpendingV2",
1205
1243
  "CostOfLivingToIncome",
@@ -1233,14 +1271,14 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1233
1271
  "WeeklyNewMerchantsV2",
1234
1272
  "WeeklyNoSpendDays",
1235
1273
  "WeeklySmallPurchasesSummary"
1236
- ], Mo = ({ onBackClick: o, onInsightCardClick: r, sx: t }) => {
1237
- const { onEvent: n } = V(), { config: s } = mt(), { isLargeDesktop: h, isDesktop: g, isMobile: d } = ee(), { visibleAccounts: c } = ve(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: l } = U(), { setFilter: T } = xe(), { selectedDateRange: a, setSelectedCategoryData: p, setSelectedDateRange: _ } = pe(), {
1238
- isCopyLoaded: y,
1239
- isInitialized: E,
1240
- selectedAccounts: x,
1241
- selectedAccountGuids: I,
1242
- setSelectedAccounts: W
1243
- } = me(), { trends: L, connect: O } = N(), { beatStore: A } = Ne(), P = Qt() && s.show_insights_widget_in_master, z = g || h, [X, Ce] = u.useState(!1), [te, re] = u.useState(!1), [Z, ce] = u.useState("Chart"), [oe, K] = u.useState(""), [ae, ne] = u.useState(!1), [ie, Q] = u.useState(window.innerHeight), w = z ? 56 : 0, B = ie - 208, j = ie - (P ? 550 + w : 266), [le, ye] = u.useState(!1), De = s.show_connections_widget_in_master ? "buttons" : "no-buttons", i = u.useMemo(
1274
+ ], Ao = ({ onBackClick: t, onInsightCardClick: r, sx: n }) => {
1275
+ const { onEvent: o } = V(), { config: s } = yt(), { isLargeDesktop: h, isDesktop: g, isMobile: d } = J(), { visibleAccounts: c } = ve(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: y, monthlyCategoryTotals: l } = $(), { setFilter: b } = xe(), { selectedDateRange: i, setSelectedCategoryData: C, setSelectedDateRange: p } = Ce(), {
1276
+ isCopyLoaded: _,
1277
+ isInitialized: x,
1278
+ selectedAccounts: v,
1279
+ selectedAccountGuids: D,
1280
+ setSelectedAccounts: M
1281
+ } = pe(), { trends: L, connect: A } = k(), { beatStore: ee } = We(), F = Jt() && s.show_insights_widget_in_master, z = g || h, [X, ye] = u.useState(!1), [te, re] = u.useState(!1), [Z, ce] = u.useState("Chart"), [oe, K] = u.useState(""), [ae, ne] = u.useState(!1), [ie, Q] = u.useState(window.innerHeight), w = z ? 56 : 0, O = ie - 208, Y = ie - (F ? 550 + w : 266), [le, fe] = u.useState(!1), Ie = s.show_connections_widget_in_master ? "buttons" : "no-buttons", a = u.useMemo(
1244
1282
  () => c && c.length === 0 || l.length === 0,
1245
1283
  [c, l]
1246
1284
  );
@@ -1248,180 +1286,180 @@ const Je = ({ categoryGuid: o, topLevelCategoryGuid: r }) => {
1248
1286
  widgetName: "TrendsWidget",
1249
1287
  isLoaded: X
1250
1288
  }), u.useEffect(() => {
1251
- E && A.loadBeats().finally(() => re(!0));
1252
- }, [E]);
1253
- const S = u.useMemo(() => te ? A.getFilteredBeats({ templates: Lo }) : [], [te]);
1289
+ x && ee.loadBeats().finally(() => re(!0));
1290
+ }, [x]);
1291
+ const T = u.useMemo(() => te ? ee.getFilteredBeats({ templates: Mo }) : [], [te]);
1254
1292
  u.useEffect(() => {
1255
- const k = () => Q(window.innerHeight);
1256
- return window.addEventListener("resize", k), () => window.removeEventListener("resize", k);
1293
+ const H = () => Q(window.innerHeight);
1294
+ return window.addEventListener("resize", H), () => window.removeEventListener("resize", H);
1257
1295
  }, []), u.useEffect(() => {
1258
- W(c);
1296
+ M(c);
1259
1297
  }, [c]), u.useEffect(() => {
1260
- E && m(x, a.start, a.end).then(() => {
1261
- C(
1262
- x,
1263
- a.start,
1264
- a.end
1265
- );
1266
- }).finally(() => {
1267
- Ce(!0), n(v.TRENDS_LOAD_WIDGET, {
1268
- ...G,
1269
- time_period: `${Re(a.end, a.start)}M`
1298
+ x && Promise.all([
1299
+ m(
1300
+ v,
1301
+ i.start,
1302
+ i.end
1303
+ ),
1304
+ y(v, i.start, i.end)
1305
+ ]).finally(() => {
1306
+ ye(!0), o(I.TRENDS_LOAD_WIDGET, {
1307
+ ...B,
1308
+ time_period: `${ke(i.end, i.start)}M`
1270
1309
  });
1271
1310
  });
1272
- }, [E, x, a]), u.useEffect(() => {
1311
+ }, [x, v, i]), u.useEffect(() => {
1273
1312
  if (l.length !== 0) {
1274
- const k = {
1275
- accounts: I,
1276
- dateRange: { start: a.start, end: a.end }
1313
+ const H = {
1314
+ accounts: D,
1315
+ dateRange: { start: i.start, end: i.end }
1277
1316
  };
1278
- T({
1279
- ...k,
1317
+ b({
1318
+ ...H,
1280
1319
  custom: (q) => !!l.find(
1281
1320
  (ue) => ue.top_level_category_guid === q.top_level_category_guid || ue.category_guid === q.category_guid
1282
1321
  )
1283
1322
  });
1284
1323
  }
1285
1324
  }, [l]);
1286
- const D = (k) => {
1287
- p(k), ne(!0);
1288
- }, Y = () => {
1289
- p(null), ne(!1);
1290
- }, Ie = () => {
1291
- ye(!0), n(v.TRENDS_CLICK_CONNECT_ACCOUNTS);
1292
- }, Ee = (k, q) => {
1293
- ce(q ?? Z), n(v.TRENDS_CLICK_TOGGLE_VIEW, {
1294
- ...G,
1325
+ const E = (H) => {
1326
+ C(H), ne(!0);
1327
+ }, j = () => {
1328
+ C(null), ne(!1);
1329
+ }, Le = () => {
1330
+ fe(!0), o(I.TRENDS_CLICK_CONNECT_ACCOUNTS);
1331
+ }, Ee = (H, q) => {
1332
+ ce(q ?? Z), o(I.TRENDS_CLICK_TOGGLE_VIEW, {
1333
+ ...B,
1295
1334
  toggleView: q
1296
1335
  });
1297
- }, de = (k) => {
1298
- const q = $e(k?.[0], 1), ue = k?.[1], st = Re(ue, q);
1299
- _({ start: q, end: ue }), n(v.TRENDS_CLICK_TIME_WINDOW, {
1300
- ...G,
1301
- time_period: st + "M"
1336
+ }, de = (H) => {
1337
+ const q = je(H?.[0], 1), ue = H?.[1], it = ke(ue, q);
1338
+ p({ start: q, end: ue }), o(I.TRENDS_CLICK_TIME_WINDOW, {
1339
+ ...B,
1340
+ time_period: it + "M"
1302
1341
  });
1303
- }, Le = (k) => {
1304
- n(v.TRENDS_CLICK_FILTER, {
1305
- ...G,
1306
- filterValue: k
1342
+ }, De = (H) => {
1343
+ o(I.TRENDS_CLICK_FILTER, {
1344
+ ...B,
1345
+ filterValue: H
1307
1346
  });
1308
- }, Me = (k) => {
1309
- K(k);
1310
- }, nt = () => {
1311
- K(""), n(v.TRENDS_CLICK_ALL_CATEGORIES, G);
1347
+ }, Me = (H) => {
1348
+ K(H);
1349
+ }, at = () => {
1350
+ K(""), o(I.TRENDS_CLICK_ALL_CATEGORIES, B);
1312
1351
  };
1313
- return !y || !X ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ f(
1314
- Xe,
1352
+ return !_ || !X ? /* @__PURE__ */ e(ge, {}) : /* @__PURE__ */ f(
1353
+ qe,
1315
1354
  {
1316
1355
  accountOptions: c,
1317
1356
  calendarActions: { onRangeChanged: de },
1318
- dateRange: a,
1357
+ dateRange: i,
1319
1358
  dateRangeVariant: d ? "timeframetabs" : "timeframebuttons",
1320
- onAccountsFilterClick: Le,
1321
- onBackClick: o,
1322
- sx: t,
1359
+ onAccountsFilterClick: De,
1360
+ onBackClick: t,
1361
+ sx: n,
1323
1362
  title: L.title,
1324
1363
  children: [
1325
- i && /* @__PURE__ */ e(
1326
- qt,
1364
+ a && /* @__PURE__ */ e(
1365
+ eo,
1327
1366
  {
1328
1367
  header: L.zero_state_content_header,
1329
1368
  icon: "",
1330
- onClick: Ie,
1369
+ onClick: Le,
1331
1370
  primaryButton: L.empty_state_primary,
1332
1371
  subText: L.empty_state_sub_text,
1333
- sx: { height: B },
1334
- variant: De
1372
+ sx: { height: O },
1373
+ variant: Ie
1335
1374
  }
1336
1375
  ),
1337
- !i && /* @__PURE__ */ f(
1338
- b,
1376
+ !a && /* @__PURE__ */ f(
1377
+ S,
1339
1378
  {
1340
1379
  sx: {
1341
1380
  px: d ? 0 : 48
1342
1381
  },
1343
1382
  children: [
1344
1383
  /* @__PURE__ */ f(
1345
- b,
1384
+ S,
1346
1385
  {
1347
1386
  flexDirection: "row",
1348
1387
  justifyContent: "space-between",
1349
1388
  sx: { pb: d ? 12 : 24, pt: d ? 24 : 48 },
1350
1389
  children: [
1351
1390
  /* @__PURE__ */ e(
1352
- tt,
1391
+ st,
1353
1392
  {
1354
1393
  selectedCategoryGuid: oe,
1355
- selectedDateRange: a
1394
+ selectedDateRange: i
1356
1395
  }
1357
1396
  ),
1358
- /* @__PURE__ */ e(et, { onTabChange: Ee, selectedTab: Z })
1397
+ /* @__PURE__ */ e(nt, { onTabChange: Ee, selectedTab: Z })
1359
1398
  ]
1360
1399
  }
1361
1400
  ),
1362
- /* @__PURE__ */ e(b, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(H, { flexGrow: 1, children: oe && /* @__PURE__ */ f(_e, { onClick: nt, sx: { p: 0, pr: 5 }, children: [
1363
- /* @__PURE__ */ e(fe, { name: "arrow_back" }),
1401
+ /* @__PURE__ */ e(S, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(N, { flexGrow: 1, children: oe && /* @__PURE__ */ f(be, { onClick: at, sx: { p: 0, pr: 5 }, children: [
1402
+ /* @__PURE__ */ e(_e, { name: "arrow_back" }),
1364
1403
  L.all_categories
1365
1404
  ] }) }) }),
1366
- /* @__PURE__ */ f(b, { flexDirection: z ? "row" : "column", gap: z ? 48 : 16, children: [
1367
- Z === "Chart" && /* @__PURE__ */ f(rt, { children: [
1368
- /* @__PURE__ */ e(H, { sx: { width: z ? "68%" : "100%" }, children: /* @__PURE__ */ e(
1369
- Eo,
1405
+ /* @__PURE__ */ f(S, { flexDirection: z ? "row" : "column", gap: z ? 48 : 16, children: [
1406
+ Z === "Chart" && /* @__PURE__ */ f(ct, { children: [
1407
+ /* @__PURE__ */ e(N, { sx: { width: z ? "68%" : "100%" }, children: /* @__PURE__ */ e(
1408
+ Do,
1370
1409
  {
1371
- availableHeight: B,
1410
+ availableHeight: O,
1372
1411
  minHeight: 450,
1373
- selectedDateRange: a,
1412
+ selectedDateRange: i,
1374
1413
  totals: l
1375
1414
  }
1376
1415
  ) }),
1377
- /* @__PURE__ */ f(b, { gap: 16, sx: { width: z ? "32%" : "100%" }, children: [
1378
- P && te && S.length > 0 && /* @__PURE__ */ e(
1379
- bo,
1416
+ /* @__PURE__ */ f(S, { gap: 16, sx: { width: z ? "32%" : "100%" }, children: [
1417
+ F && te && T.length > 0 && /* @__PURE__ */ e(
1418
+ xo,
1380
1419
  {
1381
- beats: S,
1420
+ beats: T,
1382
1421
  onInsightCardClick: r
1383
1422
  }
1384
1423
  ),
1385
1424
  /* @__PURE__ */ e(
1386
1425
  To,
1387
1426
  {
1388
- availableHeight: j,
1389
- onCategoryClick: D
1427
+ availableHeight: Y,
1428
+ onCategoryClick: E
1390
1429
  }
1391
1430
  )
1392
1431
  ] })
1393
1432
  ] }),
1394
- Z === "Table" && /* @__PURE__ */ e(H, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1395
- ot,
1433
+ Z === "Table" && /* @__PURE__ */ e(N, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1434
+ rt,
1396
1435
  {
1397
1436
  height: "unset",
1398
- monthlyCategoryTotals: l,
1399
1437
  onClickRow: Me,
1400
1438
  selectedCategory: oe,
1401
- selectedDateRange: a
1439
+ selectedDateRange: i
1402
1440
  }
1403
1441
  ) })
1404
1442
  ] }),
1405
- ae && /* @__PURE__ */ e(vo, { onClose: Y })
1443
+ ae && /* @__PURE__ */ e(wo, { onClose: j })
1406
1444
  ]
1407
1445
  }
1408
1446
  ),
1409
1447
  /* @__PURE__ */ e(
1410
- Jt,
1448
+ to,
1411
1449
  {
1412
- onClose: () => ye(!1),
1450
+ onClose: () => fe(!1),
1413
1451
  showConnectWidget: le,
1414
- title: O.mini_title
1452
+ title: A.mini_title
1415
1453
  }
1416
1454
  )
1417
1455
  ]
1418
1456
  }
1419
1457
  );
1420
- }, Nn = R(Mo);
1458
+ }, On = R(Ao);
1421
1459
  export {
1422
- Rn as TrendsFullWidget,
1423
- Hn as TrendsMicroWidget,
1424
- kn as TrendsMiniWidget,
1425
- Gn as TrendsStore,
1426
- Nn as TrendsWidget
1460
+ Hn as TrendsFullWidget,
1461
+ Wn as TrendsMicroWidget,
1462
+ Nn as TrendsMiniWidget,
1463
+ Vn as TrendsStore,
1464
+ On as TrendsWidget
1427
1465
  };