@mx-cartographer/experiences 7.12.5 → 7.12.6

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.
@@ -1,72 +1,72 @@
1
- import { jsxs as C, jsx as e, Fragment as St } from "react/jsx-runtime";
2
- import h, { useRef as wt, useState as xt, useEffect as vt } from "react";
1
+ import { jsxs as C, jsx as e, Fragment as wt } from "react/jsx-runtime";
2
+ import g, { useRef as xt, useState as vt, useEffect as Dt } from "react";
3
3
  import { observer as M } from "mobx-react-lite";
4
- import { CategoryIcon as xe, Text as Q, Icon as He, H3 as Oe, P as fe, ChevronRightIcon as Dt } from "@mxenabled/mxui";
4
+ import { CategoryIcon as xe, Text as Q, Icon as He, H3 as Ge, P as fe, ChevronRightIcon as It } from "@mxenabled/mxui";
5
5
  import W from "@mui/material/Box";
6
6
  import x from "@mui/material/Stack";
7
7
  import Te from "@mui/material/Button";
8
- import { addSeconds as qe } from "date-fns/addSeconds";
8
+ import { addSeconds as Je } from "date-fns/addSeconds";
9
9
  import { differenceInCalendarMonths as Se } from "date-fns/differenceInCalendarMonths";
10
- import It from "numeral";
11
- import { useTheme as ce, styled as Lt } from "@mui/material/styles";
12
- import { useItemTooltip as Et, ChartsTooltipContainer as Mt } from "@mui/x-charts/ChartsTooltip";
13
- import { LineChart as At } from "@mui/x-charts/LineChart";
10
+ import Lt from "numeral";
11
+ import { useTheme as ne, 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
14
  import { u as q } from "../useScreenSize-B6JyS_Lj.mjs";
15
- import { u as Rt } from "../useDimensions-CeDR9V8N.mjs";
16
- import Je from "@mui/material/Card";
17
- import et from "@mui/material/CardContent";
15
+ import { u as Ht } from "../useDimensions-CeDR9V8N.mjs";
16
+ import et from "@mui/material/Card";
17
+ import tt from "@mui/material/CardContent";
18
18
  import Ne from "@mui/material/Divider";
19
- import Ve from "@mui/material/Grid";
20
- import { u as A, l as J, g as $, b as ye, h as ve, d as De, B as Ce, p as tt, f as Ge, a as ot } from "../hooks-BxkfR-Ff.mjs";
21
- import { b as nt } from "../Localization-CPkpIwIx.mjs";
19
+ import Fe from "@mui/material/Grid";
20
+ import { u as A, l as J, g as $, b as ye, h as ve, d as De, B as Ce, p as ot, f as Be, a as nt } from "../hooks-BxkfR-Ff.mjs";
21
+ import { b as st } from "../Localization-CPkpIwIx.mjs";
22
22
  import { C as we } from "../CurrencyText-CA-E5N_y.mjs";
23
- import { C as Re, b as Fe, c as kt } from "../Category-CevNQ03n.mjs";
23
+ import { C as Re, b as $e, c as Nt } from "../Category-CevNQ03n.mjs";
24
24
  import { f as Z, D as B } from "../DateFormats-BMpMrZpW.mjs";
25
- import { f as oe, a as Ht } from "../NumberFormatting-QCaNwbjv.mjs";
26
- import { c as Nt, a as $e, g as Wt, L as st } from "../TrendsStore-st6GjDtg.mjs";
27
- import { T as us } from "../TrendsStore-st6GjDtg.mjs";
28
- import { c as Ot, i as Gt, d as Bt, e as Pt, b as rt, g as at, f as ze } from "../SpendingData-Bz1bCWAs.mjs";
29
- import Vt from "@mui/material/ToggleButton";
30
- import Ft from "@mui/material/ToggleButtonGroup";
31
- import { parseISO as it } from "date-fns/parseISO";
25
+ import { f as oe, a as Wt } from "../NumberFormatting-QCaNwbjv.mjs";
26
+ import { c as Ot, a as ze, g as Gt, L as rt } from "../TrendsStore-st6GjDtg.mjs";
27
+ import { T as ms } from "../TrendsStore-st6GjDtg.mjs";
28
+ import { c as Bt, i as Pt, d as Vt, e as Ft, b as at, g as it, f as Ke } from "../SpendingData-Bz1bCWAs.mjs";
29
+ import $t from "@mui/material/ToggleButton";
30
+ import zt from "@mui/material/ToggleButtonGroup";
31
+ import { parseISO as lt } from "date-fns/parseISO";
32
32
  import { H as ke } from "../HeaderCell-DjuifqHJ.mjs";
33
- import { T as G, b as $t } from "../ViewMoreMicroCard-DirvUT9O.mjs";
34
- import { useGridApiContext as zt, useGridRootProps as Kt, DataGridPro as Yt } from "@mui/x-data-grid-pro";
35
- import jt from "@mui/material/Badge";
36
- import Ut from "@mui/material/IconButton";
33
+ import { T as G, b as Kt } from "../ViewMoreMicroCard-DirvUT9O.mjs";
34
+ import { useGridApiContext as Yt, useGridRootProps as jt, DataGridPro as Ut } from "@mui/x-data-grid-pro";
35
+ import Xt from "@mui/material/Badge";
36
+ import Zt from "@mui/material/IconButton";
37
37
  import { A as v } from "../Analytics-BYItVAe-.mjs";
38
- import { T as lt } from "../StatusIndicator-Bo80rdKq.mjs";
39
- import { T as ct } from "../TransactionDetails-DWZuZgBw.mjs";
38
+ import { T as ct } from "../StatusIndicator-Bo80rdKq.mjs";
39
+ import { T as dt } from "../TransactionDetails-DWZuZgBw.mjs";
40
40
  import { D as We } from "../Drawer-DV4NTsFg.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 dt } from "../WidgetContainer-B0ncgABX.mjs";
44
- import { L as Be } from "../LineChart-B1qbKR8q.mjs";
45
- import { M as Xt } from "../MiniWidgetContainer-Cu72GNsE.mjs";
46
- import { subMonths as Zt } from "date-fns";
47
- import { TrendingUp as Qt, TrendingDown as qt, MultilineChart as Jt, ExpandLess as eo, ExpandMore as to, ArrowBack as oo } from "@mxenabled/mx-icons";
48
- import { M as no } from "../MicroWidgetContainer-B_EnfvCq.mjs";
49
- import so from "@mui/material/Collapse";
50
- import ro from "@mui/material/List";
51
- import ao from "@mui/material/ListItem";
52
- import io from "@mui/material/ListItemButton";
53
- import lo from "@mui/material/ListItemIcon";
54
- import co from "@mui/material/ListItemText";
55
- import ut from "@mui/material/styles/useTheme";
56
- import { Stack as uo } from "@mui/material";
57
- import mo from "@mui/material/Paper";
58
- import { b as ho } from "../CategoryUtil-BVixr0d5.mjs";
59
- import { E as go } from "../ExportCsvAction-Bg6gO_Cz.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-CioFo6Wy.mjs";
63
- const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
43
+ import { W as ut } from "../WidgetContainer-B0ncgABX.mjs";
44
+ import { L as Pe } from "../LineChart-B1qbKR8q.mjs";
45
+ import { M as Qt } from "../MiniWidgetContainer-Cu72GNsE.mjs";
46
+ import { subMonths as qt } from "date-fns";
47
+ import { TrendingUp as Jt, TrendingDown as eo, MultilineChart as to, ExpandLess as oo, ExpandMore as no, ArrowBack as so } from "@mxenabled/mx-icons";
48
+ import { M as ro } from "../MicroWidgetContainer-B_EnfvCq.mjs";
49
+ import ao from "@mui/material/Collapse";
50
+ import io from "@mui/material/List";
51
+ import lo from "@mui/material/ListItem";
52
+ import co from "@mui/material/ListItemButton";
53
+ import uo from "@mui/material/ListItemIcon";
54
+ import mo from "@mui/material/ListItemText";
55
+ import mt from "@mui/material/styles/useTheme";
56
+ import { b as Oe } from "../CategoryUtil-BVixr0d5.mjs";
57
+ import { Stack as ho } from "@mui/material";
58
+ import go from "@mui/material/Paper";
59
+ import { E as po } from "../ExportCsvAction-Bg6gO_Cz.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-CioFo6Wy.mjs";
63
+ const ht = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
64
64
  const { categories: n } = A(), { getCategoryName: o } = J(), r = o(t);
65
65
  return /* @__PURE__ */ C(x, { alignItems: "center", direction: "column", gap: "8", justifyContent: "center", mb: 4, children: [
66
66
  /* @__PURE__ */ e(
67
67
  W,
68
68
  {
69
- "aria-label": nt(n.category_icon_label_aria, r),
69
+ "aria-label": st(n.category_icon_label_aria, r),
70
70
  mb: 4,
71
71
  role: "img",
72
72
  children: /* @__PURE__ */ e(xe, { categoryGuid: s })
@@ -74,25 +74,25 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
74
74
  ),
75
75
  /* @__PURE__ */ e(Q, { variant: "Body", children: r })
76
76
  ] });
77
- }, Co = ({
77
+ }, _o = ({
78
78
  categoryGuids: { guid: t, topLevelGuid: s },
79
79
  hoveredAreaData: n,
80
80
  cursorPosition: o,
81
81
  chartContainerRef: r
82
82
  }) => {
83
- const l = ce(), a = wt(null), [u, c] = xt({ x: o.x, y: o.y });
84
- if (vt(() => {
83
+ const l = ne(), a = xt(null), [u, c] = vt({ x: o.x, y: o.y });
84
+ if (Dt(() => {
85
85
  (() => {
86
- const g = a.current, _ = r.current;
87
- if (!g || !_) return;
88
- const m = g.getBoundingClientRect(), p = _.getBoundingClientRect();
86
+ const m = a.current, _ = r.current;
87
+ if (!m || !_) return;
88
+ const h = m.getBoundingClientRect(), p = _.getBoundingClientRect();
89
89
  let f = o.x, T = o.y;
90
- f + m.width * 2 > p.right ? f = o.x - m.width : f - m.width < p.left && (f = o.x), T + m.height * 2 > p.bottom && (T = o.y - m.height), c({ x: f, y: T });
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), c({ x: f, y: T });
91
91
  })();
92
92
  }, [o, r]), !n) return null;
93
- const i = n.reduce((y, g) => y + g.y, 0);
93
+ const i = n.reduce((y, m) => y + m.y, 0);
94
94
  return /* @__PURE__ */ e(
95
- Je,
95
+ et,
96
96
  {
97
97
  ref: a,
98
98
  sx: {
@@ -102,16 +102,16 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
102
102
  width: 250,
103
103
  pointerEvents: "none"
104
104
  },
105
- children: /* @__PURE__ */ C(et, { children: [
105
+ children: /* @__PURE__ */ C(tt, { children: [
106
106
  /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
107
- /* @__PURE__ */ e(mt, { categoryGuid: t, topLevelCategoryGuid: s }),
107
+ /* @__PURE__ */ e(ht, { categoryGuid: t, topLevelCategoryGuid: s }),
108
108
  /* @__PURE__ */ e(Q, { variant: "Small", children: `${n.length}-month total` }),
109
109
  /* @__PURE__ */ e(we, { amount: i, bold: !0, formatString: "0,0", variant: "body2" })
110
110
  ] }),
111
111
  /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
112
- /* @__PURE__ */ e(Ve, { container: !0, children: n.map((y, g) => /* @__PURE__ */ C(h.Fragment, { children: [
113
- g > 0 && g % 3 === 0 && /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
114
- /* @__PURE__ */ e(Ve, { item: !0, xs: 4, children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
112
+ /* @__PURE__ */ e(Fe, { container: !0, children: n.map((y, m) => /* @__PURE__ */ C(g.Fragment, { children: [
113
+ m > 0 && m % 3 === 0 && /* @__PURE__ */ e(Ne, { sx: { my: 16, width: "100%" } }),
114
+ /* @__PURE__ */ e(Fe, { item: !0, xs: 4, children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
115
115
  /* @__PURE__ */ e(Q, { color: l.palette.text.secondary, variant: "XSmall", children: y.x }),
116
116
  /* @__PURE__ */ e(
117
117
  we,
@@ -123,11 +123,11 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
123
123
  }
124
124
  )
125
125
  ] }) })
126
- ] }, g)) })
126
+ ] }, m)) })
127
127
  ] })
128
128
  }
129
129
  );
130
- }, _o = M(Co), bo = ({
130
+ }, bo = M(_o), To = ({
131
131
  sx: t,
132
132
  categoryGuids: s,
133
133
  hoveredLegend: n,
@@ -146,7 +146,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
146
146
  ref: o,
147
147
  sx: t,
148
148
  children: s.map(({ guid: c, top_level_guid: i }) => {
149
- const y = n === c, g = Re[c], _ = Re[i], m = g ?? _ ?? Re.default, p = m + "33";
149
+ const y = n === c, m = Re[c], _ = Re[i], h = m ?? _ ?? Re.default, p = h + "33";
150
150
  return /* @__PURE__ */ C(
151
151
  Te,
152
152
  {
@@ -173,7 +173,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
173
173
  height: 16,
174
174
  marginRight: a ? 5 : 10,
175
175
  borderRadius: "2px",
176
- backgroundColor: n ? y ? m : p : m
176
+ backgroundColor: n ? y ? h : p : h
177
177
  }
178
178
  }
179
179
  ),
@@ -185,22 +185,22 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
185
185
  })
186
186
  }
187
187
  );
188
- }, To = ({
188
+ }, So = ({
189
189
  categoryGuids: { guid: t, topLevelGuid: s },
190
190
  series: n,
191
191
  xData: o
192
192
  }) => {
193
- const r = Et(), l = ce();
193
+ const r = At(), l = ne();
194
194
  if (!r?.identifier) return null;
195
195
  const { dataIndex: a, seriesId: u } = r.identifier;
196
196
  if (a == null || !u) return null;
197
- const i = n.find((g) => g.id === u)?.data?.[a], y = o?.[a];
198
- return i === void 0 || !y ? null : /* @__PURE__ */ e(Je, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(et, { children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
199
- /* @__PURE__ */ e(mt, { categoryGuid: t, topLevelCategoryGuid: s }),
197
+ const i = n.find((m) => m.id === u)?.data?.[a], y = o?.[a];
198
+ return i === void 0 || !y ? null : /* @__PURE__ */ e(et, { sx: { pt: 4, px: 8 }, children: /* @__PURE__ */ e(tt, { children: /* @__PURE__ */ C(W, { alignItems: "center", display: "flex", flexDirection: "column", children: [
199
+ /* @__PURE__ */ e(ht, { categoryGuid: t, topLevelCategoryGuid: s }),
200
200
  /* @__PURE__ */ e(Q, { color: l.palette.text.secondary, variant: "Small", children: Z(y, B.MONTH_SHORT_YEAR) }),
201
201
  /* @__PURE__ */ e(we, { amount: String(i), bold: !0, formatString: "0,0", variant: "Body" })
202
202
  ] }) }) });
203
- }, So = ({
203
+ }, wo = ({
204
204
  onHoverArea: t,
205
205
  onHoverPoint: s,
206
206
  onHoverLegend: n,
@@ -210,21 +210,21 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
210
210
  availableHeight: a = 0,
211
211
  minimumHeight: u = 350
212
212
  }) => {
213
- const c = ce(), { isMobile: i } = q(), [y, { height: g }] = Rt(), _ = h.useRef(null), [m, p] = h.useState(0);
214
- h.useEffect(() => {
215
- const d = Math.max(a - g, u);
213
+ const c = ne(), { isMobile: i } = q(), [y, { height: m }] = Ht(), _ = g.useRef(null), [h, p] = g.useState(0);
214
+ g.useEffect(() => {
215
+ const d = Math.max(a - m, u);
216
216
  p(d);
217
- }, [a, g]);
218
- const [f, T] = h.useState(null), [S, R] = h.useState({
217
+ }, [a, m]);
218
+ const [f, T] = g.useState(null), [S, R] = 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: w, isAreaHovered: k, cursorPos: H } = S, z = k && L && w, P = !z, K = [...r, ...l], E = K[0]?.dataset.length ?? 0, te = K.flatMap((d) => d.dataset.map((b) => b.x)), O = K.flatMap((d) => d.dataset.map((b) => b.y)), ne = r[0]?.dataset?.map(
223
+ }), { hoveredSeriesId: L, hoveredAreaData: w, isAreaHovered: k, cursorPos: H } = S, z = k && L && w, P = !z, K = [...r, ...l], E = K[0]?.dataset.length ?? 0, te = K.flatMap((d) => d.dataset.map((b) => b.x)), O = K.flatMap((d) => d.dataset.map((b) => b.y)), se = r[0]?.dataset?.map(
224
224
  (d, b) => r.reduce((I, U) => I + U.dataset[b]?.y || 0, 0)
225
- ) ?? [0], se = Math.max(...ne), X = Math.max(
225
+ ) ?? [0], re = Math.max(...se), X = Math.max(
226
226
  ...l.flatMap((d) => d.dataset.map((b) => b.y))
227
- ), de = Math.floor(Math.min(...O) / 100) * 100, ue = Math.ceil(Math.max(se, X) / 100) * 100, V = r.map((d, b) => ({
227
+ ), de = Math.floor(Math.min(...O) / 100) * 100, ue = Math.ceil(Math.max(re, X) / 100) * 100, V = r.map((d, b) => ({
228
228
  id: `stacked-${b}`,
229
229
  guid: d.category_guid,
230
230
  top_level_guid: d.top_level_category_guid,
@@ -236,7 +236,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
236
236
  type: "line",
237
237
  highlightScope: { highlight: "item" },
238
238
  valueFormatter: (I) => oe(I, "0,0")
239
- })), re = l.map((d, b) => ({
239
+ })), ae = l.map((d, b) => ({
240
240
  id: `unstacked-${b}`,
241
241
  guid: d.category_guid,
242
242
  top_level_guid: d.top_level_category_guid,
@@ -246,12 +246,12 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
246
246
  label: d.category_name,
247
247
  type: "line",
248
248
  valueFormatter: (I) => oe(I, "0,0")
249
- })), Y = [...V, ...re], me = [
249
+ })), Y = [...V, ...ae], me = [
250
250
  ...V.map(({ guid: d, top_level_guid: b }) => ({
251
251
  guid: d,
252
252
  top_level_guid: b
253
253
  })),
254
- ...re.map(({ guid: d, top_level_guid: b }) => ({
254
+ ...ae.map(({ guid: d, top_level_guid: b }) => ({
255
255
  guid: d,
256
256
  top_level_guid: b
257
257
  }))
@@ -261,14 +261,14 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
261
261
  guid: I?.category_guid,
262
262
  topLevelGuid: I?.top_level_category_guid
263
263
  };
264
- }, ae = (d) => {
264
+ }, ie = (d) => {
265
265
  T(d), n?.(d ?? "");
266
266
  }, he = (d) => {
267
267
  o?.(d ?? "");
268
- }, ie = () => {
268
+ }, le = () => {
269
269
  const d = j(String(L)).guid;
270
270
  d && o?.(d);
271
- }, le = (d) => {
271
+ }, ce = (d) => {
272
272
  const b = String(d?.seriesId), I = j(b).guid, U = Y.find((ge) => ge.id === b), Ee = U && d?.dataIndex !== void 0, _e = U && d?.dataIndex === void 0;
273
273
  if (Ee)
274
274
  R({
@@ -353,21 +353,21 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
353
353
  sx: { width: "100%", position: "relative" },
354
354
  children: [
355
355
  /* @__PURE__ */ e(
356
- At,
356
+ kt,
357
357
  {
358
- height: m,
358
+ height: h,
359
359
  hideLegend: !0,
360
360
  margin: { bottom: 24, left: 12, right: 54, top: 48 },
361
- onAreaClick: ie,
362
- onHighlightChange: le,
361
+ onAreaClick: le,
362
+ onHighlightChange: ce,
363
363
  series: Y,
364
364
  skipAnimation: !0,
365
365
  slotProps: {
366
366
  tooltip: { trigger: P ? "item" : "none" }
367
367
  },
368
368
  slots: {
369
- tooltip: P && L ? (d) => /* @__PURE__ */ e(Mt, { children: /* @__PURE__ */ e(
370
- To,
369
+ tooltip: P && L ? (d) => /* @__PURE__ */ e(Rt, { children: /* @__PURE__ */ e(
370
+ So,
371
371
  {
372
372
  ...d,
373
373
  categoryGuids: j(L),
@@ -390,24 +390,24 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
390
390
  {
391
391
  min: de,
392
392
  max: ue || 100,
393
- valueFormatter: (d) => It(d).format("0a")
393
+ valueFormatter: (d) => Lt(d).format("0a")
394
394
  }
395
395
  ]
396
396
  }
397
397
  ),
398
398
  /* @__PURE__ */ e(
399
- bo,
399
+ To,
400
400
  {
401
401
  categoryGuids: me,
402
402
  hoveredLegend: f,
403
403
  legendRef: y,
404
404
  onClickLegend: he,
405
- onHoverLegend: ae,
405
+ onHoverLegend: ie,
406
406
  sx: { px: i ? 0 : 24 }
407
407
  }
408
408
  ),
409
409
  z && /* @__PURE__ */ e(
410
- _o,
410
+ bo,
411
411
  {
412
412
  categoryGuids: j(L),
413
413
  chartContainerRef: _,
@@ -423,10 +423,10 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
423
423
  )
424
424
  }
425
425
  );
426
- }, ht = ({ selectedTab: t, onTabChange: s }) => {
426
+ }, gt = ({ selectedTab: t, onTabChange: s }) => {
427
427
  const { common: n } = A();
428
428
  return /* @__PURE__ */ e(
429
- Ft,
429
+ zt,
430
430
  {
431
431
  "aria-label": n.view_toggle,
432
432
  exclusive: !0,
@@ -434,7 +434,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
434
434
  orientation: "horizontal",
435
435
  value: t,
436
436
  children: ["Chart", "Table"].map((o) => /* @__PURE__ */ e(
437
- Vt,
437
+ $t,
438
438
  {
439
439
  "aria-label": o === "Chart" ? n.view_chart : n.view_table,
440
440
  "aria-pressed": t === o,
@@ -447,8 +447,8 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
447
447
  ))
448
448
  }
449
449
  );
450
- }, gt = ({ selectedDateRange: t, selectedCategoryGuid: s }) => {
451
- const { trends: n } = A(), { isMobile: o, isDesktop: r } = q(), { getCategoryName: l } = J(), a = h.useMemo(() => {
450
+ }, pt = ({ selectedDateRange: t, selectedCategoryGuid: s }) => {
451
+ const { trends: n } = A(), { isMobile: o, isDesktop: r } = q(), { getCategoryName: l } = J(), a = g.useMemo(() => {
452
452
  const i = t.start.getFullYear() === t.end.getFullYear() ? Z(
453
453
  t.start,
454
454
  o ? B.MONTH_SHORT : B.MONTH_LONG
@@ -463,7 +463,7 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
463
463
  }, [t, o]), c = l(s) || (o ? n.sub_title : n.sub_title_by_category);
464
464
  return /* @__PURE__ */ C(W, { children: [
465
465
  /* @__PURE__ */ e(
466
- Oe,
466
+ Ge,
467
467
  {
468
468
  sx: {
469
469
  fontSize: r ? null : 15,
@@ -476,14 +476,14 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
476
476
  ),
477
477
  /* @__PURE__ */ e(Q, { variant: r ? "subtitle1" : "body2", children: a })
478
478
  ] });
479
- }, wo = (t) => {
479
+ }, xo = (t) => {
480
480
  const s = t.id === "total";
481
481
  return /* @__PURE__ */ C(x, { alignItems: "center", direction: "row", role: "rowheader", tabIndex: t.tabIndex, children: [
482
482
  !s && /* @__PURE__ */ e(W, { "aria-hidden": !0, children: /* @__PURE__ */ e(xe, { categoryGuid: t.row.top_level_category_guid, variant: "twotone" }) }),
483
483
  /* @__PURE__ */ e(Q, { bold: s, sx: { ml: 12 }, variant: s ? "body1" : "body2", children: t.row.category })
484
484
  ] });
485
- }, Ke = (t) => {
486
- const s = t.row.category_guid, n = t.row.top_level_category_guid, o = s === Fe.INCOME || n === Fe.INCOME, r = t.id === "total", l = t.field === "total", a = l ? t.row[t.field] : t.row.monthlyAmounts[t.field];
485
+ }, Ye = (t) => {
486
+ const s = t.row.category_guid, n = t.row.top_level_category_guid, o = s === $e.INCOME || n === $e.INCOME, r = t.id === "total", l = t.field === "total", a = l ? t.row[t.field] : t.row.monthlyAmounts[t.field];
487
487
  return /* @__PURE__ */ e(x, { alignItems: "flex-end", direction: "row", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(
488
488
  we,
489
489
  {
@@ -494,20 +494,20 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
494
494
  variant: r ? "body1" : "body2"
495
495
  }
496
496
  ) });
497
- }, Ye = (t, s) => {
498
- const n = Z(it(s.isoDate), B.MONTH_LONG);
497
+ }, je = (t, s) => {
498
+ const n = Z(lt(s.isoDate), B.MONTH_LONG);
499
499
  return t[n] = s.amount, t;
500
- }, je = (t) => (s, n) => {
501
- const o = Z(it(n.isoDate), B.MONTH_LONG);
500
+ }, Ue = (t) => (s, n) => {
501
+ const o = Z(lt(n.isoDate), B.MONTH_LONG);
502
502
  return s + (t.includes(o) ? n.amount : 0);
503
- }, xo = (t, s) => {
503
+ }, vo = (t, s) => {
504
504
  const n = [], o = new Date(t);
505
505
  for (; o <= s; ) {
506
506
  const r = Z(o, B.MONTH_LONG);
507
507
  n.push(r), o.setMonth(o.getMonth() + 1);
508
508
  }
509
509
  return n;
510
- }, vo = (t, s) => {
510
+ }, Do = (t, s) => {
511
511
  const n = {
512
512
  field: "category",
513
513
  flex: 1,
@@ -515,9 +515,9 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
515
515
  headerName: s.category_title,
516
516
  minWidth: 210,
517
517
  renderHeader: ke,
518
- renderCell: wo,
518
+ renderCell: xo,
519
519
  sortable: !0,
520
- sortComparator: Nt,
520
+ sortComparator: Ot,
521
521
  type: "string"
522
522
  }, o = t.map((l) => ({
523
523
  field: l,
@@ -526,13 +526,13 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
526
526
  headerName: l,
527
527
  minWidth: 100,
528
528
  renderHeader: ke,
529
- renderCell: Ke,
529
+ renderCell: Ye,
530
530
  align: "center",
531
531
  headerAlign: "center",
532
532
  sortable: !0,
533
533
  hideSortIcons: !1,
534
534
  type: "number",
535
- sortComparator: $e,
535
+ sortComparator: ze,
536
536
  valueGetter: (a, u) => u.monthlyAmounts?.[l] ?? 0
537
537
  })), r = {
538
538
  field: "total",
@@ -541,16 +541,16 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
541
541
  headerName: s.table_column_total,
542
542
  minWidth: 100,
543
543
  renderHeader: ke,
544
- renderCell: Ke,
544
+ renderCell: Ye,
545
545
  align: "center",
546
546
  headerAlign: "center",
547
547
  sortable: !0,
548
548
  hideSortIcons: !1,
549
549
  type: "number",
550
- sortComparator: $e
550
+ sortComparator: ze
551
551
  };
552
552
  return [n, ...o, r];
553
- }, Ue = (t, s, n, o, r) => {
553
+ }, Xe = (t, s, n, o, r) => {
554
554
  const l = t.filter((a) => a.is_income === n).map((a) => {
555
555
  let u = a.totalMonthlyAmounts;
556
556
  return r && (u = a.monthlyAmounts), {
@@ -559,29 +559,29 @@ const mt = ({ categoryGuid: t, topLevelCategoryGuid: s }) => {
559
559
  category_guid: a.guid,
560
560
  isParent: !1,
561
561
  top_level_category_guid: a.parent_guid || a.guid,
562
- total: u.reduce(je(o), 0),
563
- monthlyAmounts: u.reduce(Ye, {})
562
+ total: u.reduce(Ue(o), 0),
563
+ monthlyAmounts: u.reduce(je, {})
564
564
  };
565
565
  });
566
566
  if (r && r.is_income === n) {
567
- const a = r.monthlyAmounts.reduce(je(o), 0);
567
+ const a = r.monthlyAmounts.reduce(Ue(o), 0);
568
568
  a !== 0 && l.push({
569
569
  id: `sub-${r.guid}`,
570
- category: nt(s.category_general, r.name),
570
+ category: st(s.category_general, r.name),
571
571
  category_guid: r.guid,
572
572
  isParent: !0,
573
573
  top_level_category_guid: r.guid,
574
574
  total: a,
575
- monthlyAmounts: r.monthlyAmounts.reduce(Ye, {})
575
+ monthlyAmounts: r.monthlyAmounts.reduce(je, {})
576
576
  });
577
577
  }
578
578
  return l;
579
- }, Do = Lt("div")({
579
+ }, Io = Et("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
586
  index: s,
587
587
  sortingOrder: n,
@@ -589,15 +589,15 @@ function Io({
589
589
  className: r,
590
590
  field: l
591
591
  }) {
592
- const a = zt(), u = Kt();
592
+ const a = Yt(), u = jt();
593
593
  let c = null;
594
594
  const i = {};
595
595
  if (t === "asc" ? c = u.slots.columnSortedAscendingIcon : t === "desc" ? c = u.slots.columnSortedDescendingIcon : (c = u.slots.columnUnsortedIcon ?? null, i.sortingOrder = n), !c) return null;
596
- const g = a.current.getColumn(l)?.headerName ?? l;
596
+ const m = a.current.getColumn(l)?.headerName ?? l;
597
597
  let _ = "";
598
598
  t === "asc" ? _ = ", sorted ascending" : t === "desc" && (_ = ", sorted descending");
599
- const m = ["Total", "Category"].includes(g) ? "" : " category totals", p = `Sort by ${g}${m}${_}`, f = /* @__PURE__ */ e(c, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...i }), T = /* @__PURE__ */ e(
600
- Ut,
599
+ const h = ["Total", "Category"].includes(m) ? "" : " category totals", p = `Sort by ${m}${h}${_}`, f = /* @__PURE__ */ e(c, { className: "MuiDataGrid-sortIcon", fontSize: "small", ...i }), T = /* @__PURE__ */ e(
600
+ Zt,
601
601
  {
602
602
  disabled: o,
603
603
  size: "small",
@@ -609,18 +609,18 @@ function Io({
609
609
  children: f
610
610
  }
611
611
  );
612
- return /* @__PURE__ */ e(Do, { className: "MuiDataGrid-iconButtonContainer", children: s != null ? /* @__PURE__ */ e(jt, { badgeContent: s, color: "default", overlap: "circular", children: T }) : T });
612
+ return /* @__PURE__ */ e(Io, { className: "MuiDataGrid-iconButtonContainer", children: s != null ? /* @__PURE__ */ e(Xt, { badgeContent: s, color: "default", overlap: "circular", children: T }) : T });
613
613
  }
614
- const Lo = h.memo(Io), Xe = ({
614
+ const Eo = g.memo(Lo), Ze = ({
615
615
  columns: t,
616
616
  onRowClick: s,
617
617
  parentCategory: n,
618
618
  rows: o,
619
619
  totalRow: r
620
620
  }) => {
621
- const l = ce(), { onEvent: a } = $(), u = l.palette.mode === "light";
621
+ const l = ne(), { onEvent: a } = $(), u = l.palette.mode === "light";
622
622
  return /* @__PURE__ */ e(
623
- Yt,
623
+ Ut,
624
624
  {
625
625
  columns: t,
626
626
  disableColumnFilter: !0,
@@ -630,7 +630,7 @@ const Lo = h.memo(Io), Xe = ({
630
630
  onRowClick: (c) => {
631
631
  n || s?.(c.row.category_guid), a(v.TRENDS_CLICK_LIST_ITEM, {
632
632
  ...G,
633
- listItem: kt[c.row.category_guid]
633
+ listItem: Nt[c.row.category_guid]
634
634
  });
635
635
  },
636
636
  pinnedRows: {
@@ -639,7 +639,7 @@ const Lo = h.memo(Io), Xe = ({
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",
@@ -656,23 +656,23 @@ const Lo = h.memo(Io), Xe = ({
656
656
  }
657
657
  }
658
658
  );
659
- }, pt = ({
659
+ }, ft = ({
660
660
  selectedDateRange: t,
661
661
  selectedCategory: s,
662
662
  onClickRow: n,
663
663
  height: o = "100%",
664
664
  sx: r = {}
665
665
  }) => {
666
- const { trends: l } = A(), { trendsCategories: a } = J(), u = h.useMemo(() => xo(t.start, t.end), [t]), c = h.useMemo(() => vo(u, l), [u, l]), i = h.useMemo(() => {
666
+ const { trends: l } = A(), { trendsCategories: a } = J(), u = g.useMemo(() => vo(t.start, t.end), [t]), c = g.useMemo(() => Do(u, l), [u, l]), i = g.useMemo(() => {
667
667
  if (s)
668
- return a.find((m) => m.guid === s);
669
- }, [s, a]), [y, g] = h.useMemo(() => {
670
- let m = a;
671
- return i && (m = i.subCategories.filter(
668
+ return a.find((h) => h.guid === s);
669
+ }, [s, a]), [y, m] = g.useMemo(() => {
670
+ let h = a;
671
+ return i && (h = i.subCategories.filter(
672
672
  (p) => p.monthlyAmounts.some((f) => f.amount !== 0)
673
673
  )), [
674
- Ue(m, l, !0, u, i),
675
- Ue(m, l, !1, u, i)
674
+ Xe(h, l, !0, u, i),
675
+ Xe(h, l, !1, u, i)
676
676
  ];
677
677
  }, [a, u, i, l]), _ = {
678
678
  id: "total",
@@ -680,11 +680,11 @@ const Lo = h.memo(Io), Xe = ({
680
680
  category_guid: "total",
681
681
  isParent: !1,
682
682
  top_level_category_guid: "total",
683
- total: g.reduce((m, p) => m + p.total, 0),
684
- monthlyAmounts: g.reduce(
685
- (m, p) => (Object.entries(p.monthlyAmounts).forEach(([f, T]) => {
686
- m[f] = (m[f] || 0) + T;
687
- }), m),
683
+ total: m.reduce((h, p) => h + p.total, 0),
684
+ monthlyAmounts: m.reduce(
685
+ (h, p) => (Object.entries(p.monthlyAmounts).forEach(([f, T]) => {
686
+ h[f] = (h[f] || 0) + T;
687
+ }), h),
688
688
  {}
689
689
  )
690
690
  };
@@ -695,7 +695,7 @@ const Lo = h.memo(Io), Xe = ({
695
695
  sx: { height: o, width: "100%", overflowX: "auto", boxShadow: "none", ...r },
696
696
  children: [
697
697
  (!i || i && i.is_income) && /* @__PURE__ */ e(
698
- Xe,
698
+ Ze,
699
699
  {
700
700
  columns: c,
701
701
  onRowClick: n,
@@ -704,38 +704,38 @@ const Lo = h.memo(Io), Xe = ({
704
704
  }
705
705
  ),
706
706
  (!i || i && !i.is_income) && /* @__PURE__ */ e(
707
- Xe,
707
+ Ze,
708
708
  {
709
709
  columns: c,
710
710
  onRowClick: n,
711
711
  parentCategory: i,
712
- rows: g,
712
+ rows: m,
713
713
  totalRow: _
714
714
  }
715
715
  )
716
716
  ]
717
717
  }
718
718
  );
719
- }, Eo = {
719
+ }, Mo = {
720
720
  title: "Transaction List"
721
- }, Mo = ({
721
+ }, Ao = ({
722
722
  categoryGuid: t,
723
723
  dateRange: s,
724
724
  isOpen: n,
725
725
  onClose: o
726
726
  }) => {
727
- const { onEvent: r } = $(), { selectedAccountGuids: l } = ye(), { common: a } = A(), { setFilter: u, sortedTransactions: c } = ve(), [i, y] = h.useState(""), g = h.useMemo(
728
- () => c.find((m) => m.guid === i),
727
+ const { onEvent: r } = $(), { selectedAccountGuids: l } = ye(), { common: a } = A(), { setFilter: u, sortedTransactions: c } = ve(), [i, y] = g.useState(""), m = g.useMemo(
728
+ () => c.find((h) => h.guid === i),
729
729
  [i, c]
730
730
  );
731
- h.useEffect(() => {
731
+ g.useEffect(() => {
732
732
  u({
733
733
  accounts: l,
734
734
  dateRange: s,
735
- custom: (m) => t === "" || t === m.category_guid || t === m.top_level_category_guid,
735
+ custom: (h) => t === "" || t === h.category_guid || t === h.top_level_category_guid,
736
736
  showSplits: !!t
737
737
  });
738
- }, [l, t, s]), h.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
738
+ }, [l, t, s]), g.useEffect(() => r(v.TRENDS_VIEW_TRANSACTIONS), []);
739
739
  const _ = () => {
740
740
  y(""), o();
741
741
  };
@@ -745,35 +745,35 @@ const Lo = h.memo(Io), Xe = ({
745
745
  ariaLabelClose: a.close_aria,
746
746
  isOpen: n,
747
747
  onClose: _,
748
- title: Eo.title,
748
+ title: Mo.title,
749
749
  children: [
750
- g && /* @__PURE__ */ e(ct, { transaction: g }),
751
- !g && /* @__PURE__ */ e(lt, { onClick: y })
750
+ m && /* @__PURE__ */ e(dt, { transaction: m }),
751
+ !m && /* @__PURE__ */ e(ct, { onClick: y })
752
752
  ]
753
753
  }
754
754
  );
755
- }, Ao = M(Mo), Ro = ({ onBackClick: t, sx: s }) => {
755
+ }, Ro = M(Ao), ko = ({ onBackClick: t, sx: s }) => {
756
756
  const { onEvent: n } = $(), { isDesktop: o, isTablet: r, isMobile: l } = q(), { isAccountDataLoaded: a, loadAccountData: u } = De(), {
757
757
  categoriesLoaded: c,
758
758
  loadCategories: i,
759
759
  loadDateRangeCategoryTotals: y,
760
- loadMonthlyCategoryTotals: g,
760
+ loadMonthlyCategoryTotals: m,
761
761
  monthlyCategoryTotals: _,
762
- getCategoryName: m
762
+ getCategoryName: h
763
763
  } = J(), {
764
764
  isTransactionDataLoaded: p,
765
765
  loadTransactionData: f,
766
766
  sortedTransactions: T
767
- } = ve(), { selectedDateRange: S, setSelectedDateRange: R } = Ce(), { isInitialized: L, selectedAccounts: w } = ye(), { trends: k } = A(), [H, z] = h.useState(!1), [P, K] = h.useState(!1), [E, te] = h.useState("Chart"), [O, ne] = h.useState(""), [se, X] = h.useState(window.innerHeight), ue = se - (l ? 315 : 345);
767
+ } = ve(), { selectedDateRange: S, setSelectedDateRange: R } = Ce(), { isInitialized: L, selectedAccounts: w } = ye(), { trends: k } = A(), [H, z] = g.useState(!1), [P, K] = g.useState(!1), [E, te] = g.useState("Chart"), [O, se] = g.useState(""), [re, X] = g.useState(window.innerHeight), ue = re - (l ? 315 : 345);
768
768
  Ie({
769
769
  widgetName: "TrendsFullWidget",
770
770
  isLoaded: H
771
- }), h.useEffect(() => {
771
+ }), g.useEffect(() => {
772
772
  const D = () => X(window.innerHeight);
773
773
  return window.addEventListener("resize", D), a || u().finally(), c || i().finally(), p || f().finally(), () => window.removeEventListener("resize", D);
774
- }, []), h.useEffect(() => {
774
+ }, []), g.useEffect(() => {
775
775
  L && y(w, S.start, S.end).then(() => {
776
- g(
776
+ m(
777
777
  w,
778
778
  S.start,
779
779
  S.end
@@ -785,41 +785,41 @@ const Lo = h.memo(Io), Xe = ({
785
785
  });
786
786
  });
787
787
  }, [L, w, S]);
788
- const V = h.useMemo(() => {
788
+ const V = g.useMemo(() => {
789
789
  if (!H) return { stackedDatasets: [], unstackedDatasets: [] };
790
- const D = Wt(
790
+ const D = Gt(
791
791
  _,
792
792
  S.start,
793
793
  S.end
794
794
  ), F = O.length ? D.filter(
795
795
  (d) => d.top_level_category_guid === O || d.category_guid === O
796
- ) : Ot(D);
796
+ ) : Bt(D);
797
797
  return {
798
- stackedDatasets: F.filter(Gt),
799
- unstackedDatasets: F.filter(Bt)
798
+ stackedDatasets: F.filter(Pt),
799
+ unstackedDatasets: F.filter(Vt)
800
800
  };
801
- }, [_, O, S]), re = (D, F) => {
801
+ }, [_, O, S]), ae = (D, F) => {
802
802
  te(F ?? E), n(v.TRENDS_CLICK_TOGGLE_VIEW);
803
803
  }, Y = (D) => {
804
- const F = qe(D?.[0], 1), d = D?.[1], b = Se(d, F);
804
+ const F = Je(D?.[0], 1), d = D?.[1], b = Se(d, F);
805
805
  R({ start: F, end: d }), n(v.TRENDS_CLICK_TIME_WINDOW, {
806
806
  time_period: b + "M"
807
807
  });
808
808
  }, me = () => {
809
809
  n(v.TRENDS_CLICK_FILTER);
810
810
  }, j = (D) => {
811
- ne(D);
812
- }, ae = (D) => {
813
- ne(D), n(v.TRENDS_CLICK_LEGEND, { category: m(D) });
814
- }, he = (D) => {
815
- n(v.TRENDS_HOVER_LEGEND, { category: m(D) });
811
+ se(D);
816
812
  }, ie = (D) => {
817
- n(v.TRENDS_HOVER_AREA, { category: D });
813
+ se(D), n(v.TRENDS_CLICK_LEGEND, { category: h(D) });
814
+ }, he = (D) => {
815
+ n(v.TRENDS_HOVER_LEGEND, { category: h(D) });
818
816
  }, le = (D) => {
817
+ n(v.TRENDS_HOVER_AREA, { category: D });
818
+ }, ce = (D) => {
819
819
  n(v.TRENDS_HOVER_POINT, { category: D });
820
820
  };
821
821
  return !L || !H ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ C(
822
- dt,
822
+ ut,
823
823
  {
824
824
  calendarActions: { onRangeChanged: Y },
825
825
  dateRange: S,
@@ -845,18 +845,18 @@ const Lo = h.memo(Io), Xe = ({
845
845
  sx: { pb: l ? 12 : 24, pt: l ? 24 : 48 },
846
846
  children: [
847
847
  /* @__PURE__ */ e(
848
- gt,
848
+ pt,
849
849
  {
850
850
  selectedCategoryGuid: O,
851
851
  selectedDateRange: S
852
852
  }
853
853
  ),
854
- /* @__PURE__ */ e(ht, { onTabChange: re, selectedTab: E })
854
+ /* @__PURE__ */ e(gt, { onTabChange: ae, selectedTab: E })
855
855
  ]
856
856
  }
857
857
  ),
858
858
  /* @__PURE__ */ C(x, { alignItems: "center", flexDirection: "row", width: "100%", children: [
859
- /* @__PURE__ */ e(W, { flexGrow: 1, children: O && /* @__PURE__ */ C(Te, { onClick: () => ne(""), sx: { p: 0, pr: 5 }, children: [
859
+ /* @__PURE__ */ e(W, { flexGrow: 1, children: O && /* @__PURE__ */ C(Te, { onClick: () => se(""), sx: { p: 0, pr: 5 }, children: [
860
860
  /* @__PURE__ */ e(He, { name: "arrow_back" }),
861
861
  k.all_categories
862
862
  ] }) }),
@@ -864,19 +864,19 @@ const Lo = h.memo(Io), Xe = ({
864
864
  ] }),
865
865
  /* @__PURE__ */ C(W, { children: [
866
866
  E === "Chart" && /* @__PURE__ */ e(
867
- So,
867
+ wo,
868
868
  {
869
869
  availableHeight: ue,
870
- onClickLegend: ae,
871
- onHoverArea: ie,
870
+ onClickLegend: ie,
871
+ onHoverArea: le,
872
872
  onHoverLegend: he,
873
- onHoverPoint: le,
873
+ onHoverPoint: ce,
874
874
  stackedDatasets: V.stackedDatasets,
875
875
  unstackedDatasets: V.unstackedDatasets
876
876
  }
877
877
  ),
878
878
  E === "Table" && /* @__PURE__ */ e(
879
- pt,
879
+ ft,
880
880
  {
881
881
  onClickRow: j,
882
882
  selectedCategory: O,
@@ -888,7 +888,7 @@ const Lo = h.memo(Io), Xe = ({
888
888
  }
889
889
  ),
890
890
  /* @__PURE__ */ e(
891
- Ao,
891
+ Ro,
892
892
  {
893
893
  categoryGuid: O,
894
894
  dateRange: S,
@@ -899,10 +899,10 @@ const Lo = h.memo(Io), Xe = ({
899
899
  ]
900
900
  }
901
901
  );
902
- }, rs = M(Ro), ko = () => {
903
- const { monthlyCategoryTotals: t } = J(), { trends: s } = A(), n = ce(), { availableHeight: o = 300 } = tt(), r = h.useMemo(() => Pt(t), [t]);
902
+ }, as = M(ko), Ho = () => {
903
+ const { monthlyCategoryTotals: t } = J(), { trends: s } = A(), n = ne(), { availableHeight: o = 300 } = ot(), r = g.useMemo(() => Ft(t), [t]);
904
904
  return /* @__PURE__ */ e(
905
- Be,
905
+ Pe,
906
906
  {
907
907
  baseline: "min",
908
908
  colors: [n.palette.primary.main],
@@ -917,17 +917,17 @@ const Lo = h.memo(Io), Xe = ({
917
917
  valueFormatterString: "0,0"
918
918
  }
919
919
  );
920
- }, Ho = M(ko), No = ({ onPrimaryCtaClick: t, sx: s }) => {
921
- const { isAccountDataLoaded: n, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: l } = J(), { isInitialized: a } = Ge(), { trends: u } = A(), { selectedAccounts: c } = ye();
922
- return h.useEffect(() => {
920
+ }, No = M(Ho), Wo = ({ onPrimaryCtaClick: t, sx: s }) => {
921
+ const { isAccountDataLoaded: n, loadAccountData: o } = De(), { loadMonthlyCategoryTotals: r, monthlyTotalsLoaded: l } = J(), { isInitialized: a } = Be(), { trends: u } = A(), { selectedAccounts: c } = ye();
922
+ return g.useEffect(() => {
923
923
  n || o().finally();
924
924
  }, []), Ie({
925
925
  widgetName: "TrendsMiniWidget",
926
926
  isLoaded: l
927
- }), h.useEffect(() => {
927
+ }), g.useEffect(() => {
928
928
  a && n && r(c).finally();
929
929
  }, [n, a, c]), !n || !a || !l ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
930
- Xt,
930
+ Qt,
931
931
  {
932
932
  contentStyles: { height: "calc(100% - 72px)", minHeight: 300, ":last-child": { pb: 0 } },
933
933
  onPrimaryCtaClick: t,
@@ -935,10 +935,10 @@ const Lo = h.memo(Io), Xe = ({
935
935
  subTitle: u.sub_title,
936
936
  sx: { height: "100%", ...s },
937
937
  title: u.mini_title,
938
- children: /* @__PURE__ */ e(Ho, {})
938
+ children: /* @__PURE__ */ e(No, {})
939
939
  }
940
940
  );
941
- }, as = M(No), Wo = 70, Ze = ({
941
+ }, is = M(Wo), Oo = 70, Qe = ({
942
942
  title: t,
943
943
  totalAmount: s,
944
944
  transactionType: n,
@@ -946,10 +946,10 @@ const Lo = h.memo(Io), Xe = ({
946
946
  secondaryLabel: r,
947
947
  shouldDisplayPercentage: l
948
948
  }) => {
949
- const { availableWidth: a } = tt(), u = h.useRef(null), c = h.useRef(null), i = Ht(Number(Math.abs(o)), {
949
+ const { availableWidth: a } = ot(), u = g.useRef(null), c = g.useRef(null), i = Wt(Number(Math.abs(o)), {
950
950
  style: "percent",
951
951
  minimumIntegerDigits: 1
952
- }), y = a === 288 && oe(s, "0,0.00").length > 10 ? oe(s, "0,0") : oe(s, "0,0.00"), g = n === "spending" ? o > 0 : o >= 0, _ = n === "spending" ? "error.main" : "success.main", m = n === "spending" ? "success.main" : "text.secondary", p = u?.current, f = c?.current, T = p && f ? p.scrollWidth > f.clientWidth - Wo : !1;
952
+ }), y = a === 288 && oe(s, "0,0.00").length > 10 ? oe(s, "0,0") : oe(s, "0,0.00"), m = n === "spending" ? o > 0 : o >= 0, _ = n === "spending" ? "error.main" : "success.main", h = n === "spending" ? "success.main" : "text.secondary", p = u?.current, f = c?.current, T = p && f ? p.scrollWidth > f.clientWidth - Oo : !1;
953
953
  return /* @__PURE__ */ C(
954
954
  x,
955
955
  {
@@ -974,12 +974,12 @@ const Lo = h.memo(Io), Xe = ({
974
974
  children: [
975
975
  /* @__PURE__ */ e(fe, { color: "text.secondary", variant: "caption", children: t }),
976
976
  l && /* @__PURE__ */ C(x, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
977
- g ? /* @__PURE__ */ e(Qt, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(qt, { size: 20, sx: { color: m } }),
977
+ m ? /* @__PURE__ */ e(Jt, { size: 20, sx: { color: _ } }) : /* @__PURE__ */ e(eo, { size: 20, sx: { color: h } }),
978
978
  /* @__PURE__ */ e(
979
979
  fe,
980
980
  {
981
981
  sx: {
982
- color: g ? _ : m,
982
+ color: m ? _ : h,
983
983
  fontWeight: 600
984
984
  },
985
985
  variant: "body2",
@@ -1005,13 +1005,13 @@ const Lo = h.memo(Io), Xe = ({
1005
1005
  {
1006
1006
  ref: u,
1007
1007
  sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
1008
- children: /* @__PURE__ */ e(Oe, { children: y })
1008
+ children: /* @__PURE__ */ e(Ge, { children: y })
1009
1009
  }
1010
1010
  ),
1011
1011
  l && a >= 450 && !T && /* @__PURE__ */ e(
1012
1012
  fe,
1013
1013
  {
1014
- color: g ? _ : m,
1014
+ color: m ? _ : h,
1015
1015
  variant: "caption",
1016
1016
  children: r
1017
1017
  }
@@ -1022,54 +1022,54 @@ const Lo = h.memo(Io), Xe = ({
1022
1022
  ]
1023
1023
  }
1024
1024
  );
1025
- }, Oo = M(() => {
1025
+ }, Go = M(() => {
1026
1026
  const { trends: t } = A();
1027
1027
  return /* @__PURE__ */ C(x, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
1028
- /* @__PURE__ */ e(Jt, { size: 32 }),
1028
+ /* @__PURE__ */ e(to, { size: 32 }),
1029
1029
  /* @__PURE__ */ C(x, { children: [
1030
1030
  /* @__PURE__ */ e(fe, { fontWeight: 600, variant: "body1", children: t.zero_state_content_header }),
1031
1031
  /* @__PURE__ */ e(fe, { color: "text.secondary", variant: "subtitle2", children: t.zero_state_content_description })
1032
1032
  ] })
1033
1033
  ] });
1034
- }), is = M(({ onCtaClick: t }) => {
1034
+ }), ls = M(({ onCtaClick: t }) => {
1035
1035
  const { isAccountDataLoaded: s, loadAccountData: n, visibleAccounts: o } = De();
1036
- h.useEffect(() => {
1036
+ g.useEffect(() => {
1037
1037
  s || n().finally();
1038
1038
  }, []);
1039
1039
  const { onEvent: r } = $(), { monthlyCategoryTotals: l, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: u } = J(), c = {
1040
- start: Zt(/* @__PURE__ */ new Date(), 1),
1040
+ start: qt(/* @__PURE__ */ new Date(), 1),
1041
1041
  end: /* @__PURE__ */ new Date()
1042
- }, { trends: i } = A(), { selectedAccounts: y, isInitialized: g } = ye();
1042
+ }, { trends: i } = A(), { selectedAccounts: y, isInitialized: m } = ye();
1043
1043
  Ie({
1044
1044
  widgetName: "TrendsMicroWidget",
1045
1045
  isLoaded: u
1046
- }), h.useEffect(() => {
1047
- g && a(y, c.start).then(() => {
1046
+ }), g.useEffect(() => {
1047
+ m && a(y, c.start).then(() => {
1048
1048
  r(v.TRENDS_LOAD_WIDGET, {
1049
1049
  state: o?.length ? "default" : "zeroState"
1050
1050
  });
1051
1051
  });
1052
- }, [g, y]);
1053
- const { spendingData: _, incomeData: m } = h.useMemo(
1052
+ }, [m, y]);
1053
+ const { spendingData: _, incomeData: h } = g.useMemo(
1054
1054
  () => ({
1055
- spendingData: rt(l, c),
1056
- incomeData: at(l, c)
1055
+ spendingData: at(l, c),
1056
+ incomeData: it(l, c)
1057
1057
  }),
1058
1058
  [l, c]
1059
- ), [p, f] = _, [T, S] = m, R = ze(f.y, p.y), L = ze(S.y, T.y), w = g && !o?.length, k = () => {
1059
+ ), [p, f] = _, [T, S] = h, R = Ke(f.y, p.y), L = Ke(S.y, T.y), w = m && !o?.length, k = () => {
1060
1060
  r(
1061
1061
  w ? v.TRENDS_CLICK_GET_STARTED : v.TRENDS_CLICK_VIEW_MORE
1062
1062
  ), t();
1063
1063
  };
1064
- return !u || !g ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
1065
- no,
1064
+ return !u || !m ? /* @__PURE__ */ e(Le, {}) : /* @__PURE__ */ e(
1065
+ ro,
1066
1066
  {
1067
1067
  className: "mx-trends-microwidget",
1068
1068
  ctaLabel: i.micro_primary_cta_label,
1069
1069
  onCTAClick: k,
1070
1070
  subHeader: w ? void 0 : i.micro_subheader,
1071
1071
  title: i.title,
1072
- children: w ? /* @__PURE__ */ e(Oo, {}) : /* @__PURE__ */ C(
1072
+ children: w ? /* @__PURE__ */ e(Go, {}) : /* @__PURE__ */ C(
1073
1073
  x,
1074
1074
  {
1075
1075
  sx: {
@@ -1079,7 +1079,7 @@ const Lo = h.memo(Io), Xe = ({
1079
1079
  },
1080
1080
  children: [
1081
1081
  /* @__PURE__ */ e(
1082
- Ze,
1082
+ Qe,
1083
1083
  {
1084
1084
  percentage: R,
1085
1085
  secondaryLabel: i.micro_secondary_label,
@@ -1090,7 +1090,7 @@ const Lo = h.memo(Io), Xe = ({
1090
1090
  }
1091
1091
  ),
1092
1092
  /* @__PURE__ */ e(
1093
- Ze,
1093
+ Qe,
1094
1094
  {
1095
1095
  percentage: L,
1096
1096
  secondaryLabel: i.micro_secondary_label,
@@ -1105,17 +1105,17 @@ const Lo = h.memo(Io), Xe = ({
1105
1105
  )
1106
1106
  }
1107
1107
  );
1108
- }), Go = M(
1108
+ }), Bo = M(
1109
1109
  ({ isExpanded: t, onClick: s }) => {
1110
- const n = ut();
1111
- return /* @__PURE__ */ e(ao, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(io, { onClick: s, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
1110
+ const n = mt();
1111
+ return /* @__PURE__ */ e(lo, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(co, { onClick: s, sx: { justifyContent: "center" }, children: /* @__PURE__ */ C(
1112
1112
  x,
1113
1113
  {
1114
1114
  sx: { color: n.palette.primary.main, flexDirection: "row", alignItems: "center" },
1115
1115
  children: [
1116
- /* @__PURE__ */ e(co, { children: /* @__PURE__ */ e(Q, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
1117
- /* @__PURE__ */ e(lo, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(eo, {}) : /* @__PURE__ */ e(
1118
- to,
1116
+ /* @__PURE__ */ e(mo, { children: /* @__PURE__ */ e(Q, { bold: !0, variant: "body2", children: t ? "View less" : "View more" }) }),
1117
+ /* @__PURE__ */ e(uo, { sx: { color: n.palette.primary.main }, children: t ? /* @__PURE__ */ e(oo, {}) : /* @__PURE__ */ e(
1118
+ no,
1119
1119
  {
1120
1120
  sx: {
1121
1121
  transition: "transform 0.3s ease-in-out",
@@ -1127,7 +1127,7 @@ const Lo = h.memo(Io), Xe = ({
1127
1127
  }
1128
1128
  ) }) });
1129
1129
  }
1130
- ), Qe = M(
1130
+ ), qe = M(
1131
1131
  ({
1132
1132
  totalAmount: t,
1133
1133
  guid: s,
@@ -1137,63 +1137,73 @@ const Lo = h.memo(Io), Xe = ({
1137
1137
  isLastItem: l = !1,
1138
1138
  showDivider: a = !0
1139
1139
  }) => {
1140
- const { trends: u } = A(), { onEvent: c } = $(), i = `${o.length} ${o.length === 1 ? u.transaction : u.transactions}`, y = () => {
1140
+ const { trends: u } = A(), { onEvent: c } = $(), i = ne(), y = `${o.length} ${o.length === 1 ? u.transaction : u.transactions}`, m = () => {
1141
1141
  r?.(), c(v.TRENDS_CLICK_LIST_ITEM, {
1142
1142
  ...G,
1143
1143
  listItem: n
1144
1144
  });
1145
1145
  };
1146
- return /* @__PURE__ */ C(h.Fragment, { children: [
1146
+ return /* @__PURE__ */ C(g.Fragment, { children: [
1147
1147
  /* @__PURE__ */ e(
1148
- st,
1148
+ rt,
1149
1149
  {
1150
- leftIcon: s ? /* @__PURE__ */ e(xe, { categoryGuid: s }) : void 0,
1151
- onClick: y,
1150
+ leftIcon: s ? /* @__PURE__ */ e(
1151
+ xe,
1152
+ {
1153
+ categoryGuid: s,
1154
+ sx: {
1155
+ bgcolor: Mt(Oe(s, i), 0.15),
1156
+ border: `1px solid ${Oe(s, i)}`,
1157
+ color: "text.primary"
1158
+ }
1159
+ }
1160
+ ) : void 0,
1161
+ onClick: m,
1152
1162
  rightContent: oe(Math.abs(t), "0,0.00"),
1153
- rightIcon: r ? /* @__PURE__ */ e(Dt, {}) : void 0,
1154
- subtitle: i,
1163
+ rightIcon: r ? /* @__PURE__ */ e(It, {}) : void 0,
1164
+ subtitle: y,
1155
1165
  title: n
1156
1166
  }
1157
1167
  ),
1158
1168
  a && /* @__PURE__ */ e(Ne, { sx: { ml: l ? 24 : 68 } })
1159
1169
  ] }, s);
1160
1170
  }
1161
- ), Bo = M(
1171
+ ), Po = M(
1162
1172
  ({ availableHeight: t = 0, onCategoryClick: s }) => {
1163
- const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: r } = Ce(), { isLargeDesktop: l, isDesktop: a } = q(), { trends: u } = A(), { onEvent: c } = $(), [i, y] = h.useState(!1), g = a || l;
1164
- h.useEffect(() => {
1173
+ const { collapsedCategories: n, visibleCategories: o, setVisibleListLength: r } = Ce(), { isLargeDesktop: l, isDesktop: a } = q(), { trends: u } = A(), { onEvent: c } = $(), [i, y] = g.useState(!1), m = a || l;
1174
+ g.useEffect(() => {
1165
1175
  const p = Math.floor(t / 64) - 1, f = o.length + n.length;
1166
- p !== o.length && (r(g ? Math.max(p, 5) : 5), y(p >= f));
1176
+ p !== o.length && (r(m ? Math.max(p, 5) : 5), y(p >= f));
1167
1177
  }, [t]);
1168
1178
  const _ = () => {
1169
1179
  y(!i), c(v.TRENDS_CLICK_VIEW_MORE, {
1170
1180
  ...G
1171
1181
  });
1172
- }, m = o.length + (i ? n.length : 0);
1173
- return /* @__PURE__ */ e(x, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ C(ro, { children: [
1174
- /* @__PURE__ */ e(x, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Oe, { children: u.categories }) }),
1182
+ }, h = o.length + (i ? n.length : 0);
1183
+ return /* @__PURE__ */ e(x, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ C(io, { children: [
1184
+ /* @__PURE__ */ e(x, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(Ge, { children: u.categories }) }),
1175
1185
  o.map((p, f) => /* @__PURE__ */ e(
1176
- Qe,
1186
+ qe,
1177
1187
  {
1178
1188
  ...p,
1179
- isLastItem: f === m - 1,
1189
+ isLastItem: f === h - 1,
1180
1190
  onClick: p.transactions.length > 0 ? () => s(p) : void 0,
1181
1191
  showDivider: !0
1182
1192
  },
1183
1193
  p.guid
1184
1194
  )),
1185
1195
  /* @__PURE__ */ e(
1186
- so,
1196
+ ao,
1187
1197
  {
1188
1198
  in: i,
1189
1199
  sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
1190
1200
  children: n.map((p, f) => {
1191
1201
  const T = o.length + f;
1192
1202
  return /* @__PURE__ */ e(
1193
- Qe,
1203
+ qe,
1194
1204
  {
1195
1205
  ...p,
1196
- isLastItem: T === m - 1,
1206
+ isLastItem: T === h - 1,
1197
1207
  onClick: p.transactions.length > 0 ? () => s(p) : void 0,
1198
1208
  showDivider: !0
1199
1209
  },
@@ -1202,21 +1212,21 @@ const Lo = h.memo(Io), Xe = ({
1202
1212
  })
1203
1213
  }
1204
1214
  ),
1205
- n.length > 0 && /* @__PURE__ */ e(Go, { isExpanded: i, onClick: _ })
1215
+ n.length > 0 && /* @__PURE__ */ e(Bo, { isExpanded: i, onClick: _ })
1206
1216
  ] }) });
1207
1217
  }
1208
- ), Po = ({ beats: t, onInsightCardClick: s }) => {
1209
- const { onEvent: n } = $(), { isMobile: o, isDesktop: r, isLargeDesktop: l } = q(), { beatStore: a, endpoint: u, sessionToken: c } = Ge(), i = r || l, y = i || o ? 1 : 2, g = () => null, _ = (S) => {
1218
+ ), Vo = ({ beats: t, onInsightCardClick: s }) => {
1219
+ const { onEvent: n } = $(), { isMobile: o, isDesktop: r, isLargeDesktop: l } = q(), { beatStore: a, endpoint: u, sessionToken: c } = Be(), i = r || l, y = i || o ? 1 : 2, m = () => null, _ = (S) => {
1210
1220
  s?.(S), n(v.TRENDS_CLICK_INSIGHT, G);
1211
- }, m = i ? 200 : 170, p = i ? 170 : 124, f = i ? 56 : 0, T = t.length > 0 ? m + f : p;
1212
- return /* @__PURE__ */ e(uo, { sx: { height: T }, children: /* @__PURE__ */ e(
1213
- $t,
1221
+ }, h = i ? 200 : 170, p = i ? 170 : 124, f = i ? 56 : 0, T = t.length > 0 ? h + f : p;
1222
+ return /* @__PURE__ */ e(ho, { sx: { height: T }, children: /* @__PURE__ */ e(
1223
+ Kt,
1214
1224
  {
1215
1225
  areBeatsLoading: a.isLoading,
1216
1226
  beats: t,
1217
1227
  endpoint: u,
1218
1228
  headerSx: { p: 0 },
1219
- logOutUser: g,
1229
+ logOutUser: m,
1220
1230
  onCardClick: _,
1221
1231
  showBorder: !0,
1222
1232
  showCTAColocatedWithText: !1,
@@ -1230,12 +1240,12 @@ const Lo = h.memo(Io), Xe = ({
1230
1240
  visibleCardsCount: y
1231
1241
  }
1232
1242
  ) });
1233
- }, Vo = M(Po), Fo = M(({ chartLabel: t, chartColor: s }) => {
1243
+ }, Fo = M(Vo), $o = M(({ chartLabel: t, chartColor: s }) => {
1234
1244
  const { onEvent: n } = $(), {
1235
1245
  categoryDetailsChartData: { monthlyAmounts: o, tooltipLabels: r }
1236
1246
  } = Ce();
1237
1247
  return /* @__PURE__ */ e(x, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
1238
- Be,
1248
+ Pe,
1239
1249
  {
1240
1250
  baseline: "min",
1241
1251
  colors: [s],
@@ -1263,14 +1273,14 @@ const Lo = h.memo(Io), Xe = ({
1263
1273
  valueFormatterString: "0,0"
1264
1274
  }
1265
1275
  ) });
1266
- }), $o = M(({ onClose: t }) => {
1267
- const s = ut(), { is_mobile_webview: n } = ot(), { isDesktop: o, isSmallTablet: r, isTablet: l } = q(), { onEvent: a } = $(), { common: u, trends: c } = A(), { selectedCategoryData: i, selectedDateRangeMonthRange: y } = Ce(), { sortedTransactions: g } = ve(), [_, m] = h.useState(null);
1276
+ }), zo = M(({ onClose: t }) => {
1277
+ const s = mt(), { is_mobile_webview: n } = nt(), { isDesktop: o, isSmallTablet: r, isTablet: l } = q(), { onEvent: a } = $(), { common: u, trends: c } = A(), { selectedCategoryData: i, selectedDateRangeMonthRange: y } = Ce(), { sortedTransactions: m } = ve(), [_, h] = g.useState(null);
1268
1278
  if (!i)
1269
1279
  return null;
1270
- const { guid: p, name: f, is_income: T, totalAmount: S } = i, R = T ? c.category_income : c.category_spending, L = ho(p, s), w = T ? c.income_label : c.spending_label, k = ` ${i.transactions.length === 1 ? c.transaction : c.transactions} (${i.transactions.length})`, H = h.useMemo(
1271
- () => g.find((E) => E.guid === _),
1272
- [_, g]
1273
- ), z = g.length > 0 && !n && (o || l && !r), P = (E) => E.category_guid === p || E.top_level_category_guid === p, K = () => {
1280
+ const { guid: p, name: f, is_income: T, totalAmount: S } = i, R = T ? c.category_income : c.category_spending, L = Oe(p, s), w = T ? c.income_label : c.spending_label, k = ` ${i.transactions.length === 1 ? c.transaction : c.transactions} (${i.transactions.length})`, H = g.useMemo(
1281
+ () => m.find((E) => E.guid === _),
1282
+ [_, m]
1283
+ ), z = m.length > 0 && !n && (o || l && !r), P = (E) => E.category_guid === p || E.top_level_category_guid === p, K = () => {
1274
1284
  t?.(), a(v.TRENDS_CLICK_BACK, G);
1275
1285
  };
1276
1286
  return /* @__PURE__ */ C(
@@ -1283,9 +1293,9 @@ const Lo = h.memo(Io), Xe = ({
1283
1293
  title: R,
1284
1294
  children: [
1285
1295
  /* @__PURE__ */ C(x, { sx: { alignItems: "center", height: "100%" }, children: [
1286
- /* @__PURE__ */ C(mo, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
1296
+ /* @__PURE__ */ C(go, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
1287
1297
  /* @__PURE__ */ e(
1288
- st,
1298
+ rt,
1289
1299
  {
1290
1300
  leftIcon: /* @__PURE__ */ e(xe, { categoryGuid: p }),
1291
1301
  rightContent: oe(Math.abs(S), "0,0.00"),
@@ -1293,19 +1303,19 @@ const Lo = h.memo(Io), Xe = ({
1293
1303
  title: f
1294
1304
  }
1295
1305
  ),
1296
- /* @__PURE__ */ e(Fo, { chartColor: L, chartLabel: w }),
1306
+ /* @__PURE__ */ e($o, { chartColor: L, chartLabel: w }),
1297
1307
  /* @__PURE__ */ C(x, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
1298
1308
  /* @__PURE__ */ e(Q, { bold: !0, variant: "body1", children: k }),
1299
- z && /* @__PURE__ */ e(go, { filter: P })
1309
+ z && /* @__PURE__ */ e(po, { filter: P })
1300
1310
  ] })
1301
1311
  ] }),
1302
1312
  /* @__PURE__ */ e(
1303
- lt,
1313
+ ct,
1304
1314
  {
1305
1315
  bgcolor: "transparent",
1306
1316
  filter: P,
1307
1317
  height: "calc(100vh - 475px)",
1308
- onClick: m
1318
+ onClick: h
1309
1319
  }
1310
1320
  )
1311
1321
  ] }),
@@ -1314,18 +1324,18 @@ const Lo = h.memo(Io), Xe = ({
1314
1324
  {
1315
1325
  ariaLabelClose: u.close_aria,
1316
1326
  isOpen: !!H,
1317
- onClose: () => m(""),
1327
+ onClose: () => h(""),
1318
1328
  title: c.transaction,
1319
- children: H && /* @__PURE__ */ e(ct, { transaction: H })
1329
+ children: H && /* @__PURE__ */ e(dt, { transaction: H })
1320
1330
  }
1321
1331
  )
1322
1332
  ]
1323
1333
  }
1324
1334
  );
1325
- }), zo = (t, s) => {
1326
- const n = at(t, s), o = rt(t, s);
1335
+ }), Ko = (t, s) => {
1336
+ const n = it(t, s), o = at(t, s);
1327
1337
  return [n, o].filter((r) => r.length > 0);
1328
- }, Ko = (t, s) => {
1338
+ }, Yo = (t, s) => {
1329
1339
  const [n, o] = t, r = n, l = o ?? n, a = [];
1330
1340
  if (r) {
1331
1341
  const u = r.reduce((c, i) => c + i.y, 0);
@@ -1336,25 +1346,25 @@ const Lo = h.memo(Io), Xe = ({
1336
1346
  a.push({ label: s.spending_label, amount: u });
1337
1347
  }
1338
1348
  return a;
1339
- }, Yo = ({
1349
+ }, jo = ({
1340
1350
  availableHeight: t = 0,
1341
1351
  minHeight: s = 500,
1342
1352
  selectedDateRange: n,
1343
1353
  totals: o
1344
1354
  }) => {
1345
- const r = ce(), { onEvent: l } = $(), { trends: a } = A(), { isSmallMobile: u, isMobile: c, isSmallTablet: i, isTablet: y } = q(), g = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = zo(o, n), m = Ko(_, a), [p, f] = h.useState(0), T = 458, S = 195, R = 56, L = c || u ? S : i || y ? T : p;
1346
- return h.useEffect(() => {
1355
+ const r = ne(), { onEvent: l } = $(), { trends: a } = A(), { isSmallMobile: u, isMobile: c, isSmallTablet: i, isTablet: y } = q(), m = [r.palette.chart?.chart1, r.palette.chart?.chart2], _ = Ko(o, n), h = Yo(_, a), [p, f] = g.useState(0), T = 458, S = 195, R = 56, L = c || u ? S : i || y ? T : p;
1356
+ return g.useEffect(() => {
1347
1357
  const k = Math.max(t - R, s);
1348
1358
  f(k);
1349
1359
  }, [t]), /* @__PURE__ */ e(
1350
- Be,
1360
+ Pe,
1351
1361
  {
1352
1362
  baseline: "min",
1353
- colors: g,
1363
+ colors: m,
1354
1364
  curveType: "bump",
1355
1365
  datasets: _,
1356
1366
  height: L,
1357
- labels: m,
1367
+ labels: h,
1358
1368
  onItemClick: () => {
1359
1369
  l(v.TRENDS_CLICK_CHART, G);
1360
1370
  },
@@ -1369,7 +1379,7 @@ const Lo = h.memo(Io), Xe = ({
1369
1379
  valueFormatterString: "0.0a"
1370
1380
  }
1371
1381
  );
1372
- }, jo = M(Yo), Uo = [
1382
+ }, Uo = M(jo), Xo = [
1373
1383
  "BillAmountNotStandard",
1374
1384
  "CategorySpendingV2",
1375
1385
  "CostOfLivingToIncome",
@@ -1403,30 +1413,30 @@ const Lo = h.memo(Io), Xe = ({
1403
1413
  "WeeklyNewMerchantsV2",
1404
1414
  "WeeklyNoSpendDays",
1405
1415
  "WeeklySmallPurchasesSummary"
1406
- ], Xo = (t, s, n) => ({
1416
+ ], Zo = (t, s, n) => ({
1407
1417
  description: s ? t.empty_state_sub_text : t.empty_state_sub_text_no_aggregation,
1408
1418
  header: s ? t.zero_state_content_header : t.zero_state_content_header_no_aggregation,
1409
1419
  onClickHandler: s ? n : void 0,
1410
1420
  primaryButton: s ? t.empty_state_primary : void 0
1411
- }), Zo = ({ onBackClick: t, onInsightCardClick: s, sx: n }) => {
1412
- const { onEvent: o } = $(), { config: r } = ot(), { isDesktop: l, isLargeDesktop: a, isMobile: u } = q(), { isAccountDataLoaded: c, loadAccountData: i, visibleAccounts: y } = De(), {
1413
- categoriesLoaded: g,
1421
+ }), Qo = ({ onBackClick: t, onInsightCardClick: s, sx: n }) => {
1422
+ const { onEvent: o } = $(), { config: r } = nt(), { isDesktop: l, isLargeDesktop: a, isMobile: u } = q(), { isAccountDataLoaded: c, loadAccountData: i, visibleAccounts: y } = De(), {
1423
+ categoriesLoaded: m,
1414
1424
  loadCategories: _,
1415
- loadDateRangeCategoryTotals: m,
1425
+ loadDateRangeCategoryTotals: h,
1416
1426
  loadMonthlyCategoryTotals: p,
1417
1427
  monthlyCategoryTotals: f,
1418
1428
  monthlyTotalsLoaded: T
1419
- } = J(), { isTransactionDataLoaded: S, loadTransactionData: R, setFilter: L } = ve(), { selectedDateRange: w, setSelectedCategoryData: k, setSelectedDateRange: H } = Ce(), { isInitialized: z, selectedAccounts: P, selectedAccountGuids: K } = ye(), { trends: E, connect: te } = A(), { beatStore: O } = Ge(), se = po() && r.show_insights_widget_in_master, X = l || a, [de, ue] = h.useState(!1), [V, re] = h.useState(!1), [Y, me] = h.useState("Chart"), [j, ae] = h.useState(""), [he, ie] = h.useState(!1), [le, D] = h.useState(window.innerHeight), F = X ? 56 : 0, d = le - 208, b = le - (se ? 550 + F : 266), [I, U] = h.useState(!1), Ee = r.show_connections_widget_in_master;
1429
+ } = J(), { isTransactionDataLoaded: S, loadTransactionData: R, setFilter: L } = ve(), { selectedDateRange: w, setSelectedCategoryData: k, setSelectedDateRange: H } = Ce(), { isInitialized: z, selectedAccounts: P, selectedAccountGuids: K } = ye(), { trends: E, connect: te } = A(), { beatStore: O } = Be(), re = fo() && r.show_insights_widget_in_master, X = l || a, [de, ue] = g.useState(!1), [V, ae] = g.useState(!1), [Y, me] = g.useState("Chart"), [j, ie] = g.useState(""), [he, le] = g.useState(!1), [ce, D] = g.useState(window.innerHeight), F = X ? 56 : 0, d = ce - 208, b = ce - (re ? 550 + F : 266), [I, U] = g.useState(!1), Ee = r.show_connections_widget_in_master;
1420
1430
  Ie({
1421
1431
  widgetName: "TrendsWidget",
1422
1432
  isLoaded: de
1423
1433
  });
1424
- const _e = h.useMemo(() => V ? O.getFilteredBeats({ templates: Uo }) : [], [V]);
1425
- h.useEffect(() => {
1434
+ const _e = g.useMemo(() => V ? O.getFilteredBeats({ templates: Xo }) : [], [V]);
1435
+ g.useEffect(() => {
1426
1436
  const N = () => D(window.innerHeight);
1427
- return window.addEventListener("resize", N), c || i().finally(), g || _().finally(), S || R().finally(), () => window.removeEventListener("resize", N);
1428
- }, []), h.useEffect(() => {
1429
- z && c && (O.loadBeats().finally(() => re(!0)), m(P, w.start, w.end).then(() => {
1437
+ return window.addEventListener("resize", N), c || i().finally(), m || _().finally(), S || R().finally(), () => window.removeEventListener("resize", N);
1438
+ }, []), g.useEffect(() => {
1439
+ z && c && (O.loadBeats().finally(() => ae(!0)), h(P, w.start, w.end).then(() => {
1430
1440
  p(
1431
1441
  P,
1432
1442
  w.start,
@@ -1438,7 +1448,7 @@ const Lo = h.memo(Io), Xe = ({
1438
1448
  time_period: `${Se(w.end, w.start)}M`
1439
1449
  });
1440
1450
  }));
1441
- }, [z, c, P, w]), h.useEffect(() => {
1451
+ }, [z, c, P, w]), g.useEffect(() => {
1442
1452
  if (f.length !== 0) {
1443
1453
  const N = {
1444
1454
  accounts: K,
@@ -1453,42 +1463,42 @@ const Lo = h.memo(Io), Xe = ({
1453
1463
  }
1454
1464
  }, [f]);
1455
1465
  const ge = (N) => {
1456
- k(N), ie(!0);
1466
+ k(N), le(!0);
1457
1467
  }, Me = () => {
1458
- k(null), ie(!1);
1468
+ k(null), le(!1);
1459
1469
  }, Ae = () => {
1460
1470
  U(!0), o(v.TRENDS_CLICK_CONNECT_ACCOUNTS);
1461
- }, ft = (N, ee) => {
1471
+ }, yt = (N, ee) => {
1462
1472
  me(ee ?? Y), o(v.TRENDS_CLICK_TOGGLE_VIEW, {
1463
1473
  ...G,
1464
1474
  toggleView: ee
1465
1475
  });
1466
- }, yt = (N) => {
1467
- const ee = qe(N?.[0], 1), pe = N?.[1], Tt = Se(pe, ee);
1476
+ }, Ct = (N) => {
1477
+ const ee = Je(N?.[0], 1), pe = N?.[1], St = Se(pe, ee);
1468
1478
  H({ start: ee, end: pe }), o(v.TRENDS_CLICK_TIME_WINDOW, {
1469
1479
  ...G,
1470
- time_period: Tt + "M"
1480
+ time_period: St + "M"
1471
1481
  });
1472
- }, Ct = (N) => {
1482
+ }, _t = (N) => {
1473
1483
  o(v.TRENDS_CLICK_FILTER, {
1474
1484
  ...G,
1475
1485
  filterValue: N
1476
1486
  });
1477
- }, _t = (N) => {
1478
- ae(N);
1479
- }, bt = () => {
1480
- ae(""), o(v.TRENDS_CLICK_ALL_CATEGORIES, G);
1487
+ }, bt = (N) => {
1488
+ ie(N);
1489
+ }, Tt = () => {
1490
+ ie(""), o(v.TRENDS_CLICK_ALL_CATEGORIES, G);
1481
1491
  };
1482
1492
  if (!z || !c || !de || !T)
1483
1493
  return /* @__PURE__ */ e(Le, {});
1484
- const Pe = y.length === 0 || f.length === 0, be = Xo(E, Ee, Ae);
1494
+ const Ve = y.length === 0 || f.length === 0, be = Zo(E, Ee, Ae);
1485
1495
  return /* @__PURE__ */ C(
1486
- dt,
1496
+ ut,
1487
1497
  {
1488
- calendarActions: { onRangeChanged: yt },
1498
+ calendarActions: { onRangeChanged: Ct },
1489
1499
  dateRange: w,
1490
1500
  dateRangeVariant: u ? "timeframetabs" : "timeframebuttons",
1491
- onAccountsFilterClick: Ct,
1501
+ onAccountsFilterClick: _t,
1492
1502
  onBackClick: t,
1493
1503
  sx: n,
1494
1504
  title: E.title,
@@ -1508,22 +1518,22 @@ const Lo = h.memo(Io), Xe = ({
1508
1518
  sx: { px: u ? 16 : 0, py: 16 },
1509
1519
  children: [
1510
1520
  /* @__PURE__ */ e(
1511
- gt,
1521
+ pt,
1512
1522
  {
1513
1523
  selectedCategoryGuid: j,
1514
1524
  selectedDateRange: w
1515
1525
  }
1516
1526
  ),
1517
- /* @__PURE__ */ e(ht, { onTabChange: ft, selectedTab: Y })
1527
+ /* @__PURE__ */ e(gt, { onTabChange: yt, selectedTab: Y })
1518
1528
  ]
1519
1529
  }
1520
1530
  ),
1521
- /* @__PURE__ */ e(x, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(W, { flexGrow: 1, children: j && /* @__PURE__ */ C(Te, { onClick: bt, sx: { p: 0, pr: 5 }, children: [
1522
- /* @__PURE__ */ e(oo, {}),
1531
+ /* @__PURE__ */ e(x, { alignItems: "center", flexDirection: "row", sx: { pb: 8 }, width: "100%", children: /* @__PURE__ */ e(W, { flexGrow: 1, children: j && /* @__PURE__ */ C(Te, { onClick: Tt, sx: { p: 0, pr: 5 }, children: [
1532
+ /* @__PURE__ */ e(so, {}),
1523
1533
  E.all_categories
1524
1534
  ] }) }) }),
1525
- Pe && /* @__PURE__ */ e(
1526
- fo,
1535
+ Ve && /* @__PURE__ */ e(
1536
+ yo,
1527
1537
  {
1528
1538
  header: be.header,
1529
1539
  icon: "multiline_chart",
@@ -1533,10 +1543,10 @@ const Lo = h.memo(Io), Xe = ({
1533
1543
  sx: { height: d, maxWidth: 432 }
1534
1544
  }
1535
1545
  ),
1536
- !Pe && /* @__PURE__ */ C(x, { flexDirection: X ? "row" : "column", gap: X ? 48 : 16, children: [
1537
- Y === "Chart" && /* @__PURE__ */ C(St, { children: [
1546
+ !Ve && /* @__PURE__ */ C(x, { flexDirection: X ? "row" : "column", gap: X ? 48 : 16, children: [
1547
+ Y === "Chart" && /* @__PURE__ */ C(wt, { children: [
1538
1548
  /* @__PURE__ */ e(W, { sx: { width: X ? "68%" : "100%" }, children: /* @__PURE__ */ e(
1539
- jo,
1549
+ Uo,
1540
1550
  {
1541
1551
  availableHeight: d,
1542
1552
  minHeight: 450,
@@ -1545,15 +1555,15 @@ const Lo = h.memo(Io), Xe = ({
1545
1555
  }
1546
1556
  ) }),
1547
1557
  /* @__PURE__ */ C(x, { gap: 16, sx: { width: X ? "32%" : "100%" }, children: [
1548
- se && V && _e.length > 0 && /* @__PURE__ */ e(
1549
- Vo,
1558
+ re && V && _e.length > 0 && /* @__PURE__ */ e(
1559
+ Fo,
1550
1560
  {
1551
1561
  beats: _e,
1552
1562
  onInsightCardClick: s
1553
1563
  }
1554
1564
  ),
1555
1565
  /* @__PURE__ */ e(
1556
- Bo,
1566
+ Po,
1557
1567
  {
1558
1568
  availableHeight: b,
1559
1569
  onCategoryClick: ge
@@ -1562,21 +1572,21 @@ const Lo = h.memo(Io), Xe = ({
1562
1572
  ] })
1563
1573
  ] }),
1564
1574
  Y === "Table" && /* @__PURE__ */ e(W, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1565
- pt,
1575
+ ft,
1566
1576
  {
1567
1577
  height: "unset",
1568
- onClickRow: _t,
1578
+ onClickRow: bt,
1569
1579
  selectedCategory: j,
1570
1580
  selectedDateRange: w
1571
1581
  }
1572
1582
  ) })
1573
1583
  ] }),
1574
- he && /* @__PURE__ */ e($o, { onClose: Me })
1584
+ he && /* @__PURE__ */ e(zo, { onClose: Me })
1575
1585
  ]
1576
1586
  }
1577
1587
  ),
1578
1588
  /* @__PURE__ */ e(
1579
- yo,
1589
+ Co,
1580
1590
  {
1581
1591
  onClose: () => U(!1),
1582
1592
  showConnectWidget: I,
@@ -1586,11 +1596,11 @@ const Lo = h.memo(Io), Xe = ({
1586
1596
  ]
1587
1597
  }
1588
1598
  );
1589
- }, ls = M(Zo);
1599
+ }, cs = M(Qo);
1590
1600
  export {
1591
- rs as TrendsFullWidget,
1592
- is as TrendsMicroWidget,
1593
- as as TrendsMiniWidget,
1594
- us as TrendsStore,
1595
- ls as TrendsWidget
1601
+ as as TrendsFullWidget,
1602
+ ls as TrendsMicroWidget,
1603
+ is as TrendsMiniWidget,
1604
+ ms as TrendsStore,
1605
+ cs as TrendsWidget
1596
1606
  };