@mx-cartographer/experiences 7.0.23-alpha.al12 → 7.0.23-alpha.al13

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 (5) hide show
  1. package/dist/{AccountStore-DCDmxODy.mjs → AccountStore-BaMynkQT.mjs} +18 -18
  2. package/dist/accounts/index.es.js +1 -1
  3. package/dist/common/index.es.js +1 -1
  4. package/dist/trends/index.es.js +395 -397
  5. package/package.json +1 -1
package/dist/trends/index.es.js CHANGED
@@ -1,73 +1,73 @@
1
- import { jsx as e, jsxs as f, Fragment as Pe } from "react/jsx-runtime";
2
- import a from "react";
3
- import { observer as A } from "mobx-react-lite";
4
- import { Icon as ae, Text as Q, CategoryIcon as Te, P as X, H3 as De, ChevronRightIcon as Ke } from "@mxenabled/mxui";
1
+ import { jsx as e, jsxs as f, Fragment as ze } from "react/jsx-runtime";
2
+ import i from "react";
3
+ import { observer as M } from "mobx-react-lite";
4
+ import { Icon as re, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as Fe } from "@mxenabled/mxui";
5
5
  import O from "@mui/material/Box";
6
6
  import _ from "@mui/material/Stack";
7
- import Ce from "@mui/material/Button";
7
+ import pe from "@mui/material/Button";
8
8
  import { addSeconds as Ie } from "date-fns/addSeconds";
9
- import { differenceInCalendarMonths as re } from "date-fns/differenceInCalendarMonths";
10
- import { a as $e, g as je, S as Ye, L as Ee, u as Ue } from "../TrendsStore-WrHxzdbQ.mjs";
11
- import { T as to } from "../TrendsStore-WrHxzdbQ.mjs";
12
- import { i as Xe, c as Ze, d as Qe, e as qe, f as Je, h as et, b as Le, g as xe, j as _e } from "../SpendingData-D5vsfYKo.mjs";
13
- import tt from "@mui/material/ToggleButton";
14
- import nt from "@mui/material/ToggleButtonGroup";
15
- import { u as R, k as K, e as N, a as $, f as ie, c as ce, v as ee, l as ve, p as ot, m as st } from "../hooks-DkUqN6JE.mjs";
16
- import { u as j } from "../useScreenSize-B6JyS_Lj.mjs";
17
- import { f as q, D as B } from "../Dialog-CWW597AF.mjs";
18
- import { DataGridPro as rt } from "@mui/x-data-grid-pro";
19
- import { C as at } from "../CurrencyText-YUhH2caW.mjs";
9
+ import { differenceInCalendarMonths as Ce } from "date-fns/differenceInCalendarMonths";
10
+ import { a as Pe, g as Ke, S as $e, L as Ee, u as je } from "../TrendsStore-WrHxzdbQ.mjs";
11
+ import { T as Jn } from "../TrendsStore-WrHxzdbQ.mjs";
12
+ import { i as Ye, c as Ue, d as Xe, e as Ze, f as Qe, h as qe, b as Le, g as xe, j as _e } from "../SpendingData-D5vsfYKo.mjs";
13
+ import Je from "@mui/material/ToggleButton";
14
+ import et from "@mui/material/ToggleButtonGroup";
15
+ import { u as R, k as F, e as H, a as P, f as ae, c as ie, v as q, l as ve, p as tt, m as nt } from "../hooks-DkUqN6JE.mjs";
16
+ import { u as K } from "../useScreenSize-B6JyS_Lj.mjs";
17
+ import { f as Z, D as B } from "../Dialog-CWW597AF.mjs";
18
+ import { DataGridPro as ot } from "@mui/x-data-grid-pro";
19
+ import { C as st } from "../CurrencyText-YUhH2caW.mjs";
20
20
  import { c as Me } from "../Category-CevNQ03n.mjs";
21
- import { b as it } from "../Localization-2MODESHW.mjs";
21
+ import { b as rt } from "../Localization-2MODESHW.mjs";
22
22
  import { H as be } from "../HeaderCell-DjuifqHJ.mjs";
23
- import { T as M, b as ct } from "../ViewMoreMicroCard-DFAY0tA8.mjs";
23
+ import { T as A, b as at } from "../ViewMoreMicroCard-DFAY0tA8.mjs";
24
24
  import { A as y, W as Ae } from "../WidgetContainer-CdBs9WOZ.mjs";
25
25
  import { a as Re, T as ke } from "../TransactionDetails-C-z3HGTT.mjs";
26
26
  import { D as fe } from "../Drawer-kEE73B87.mjs";
27
- import { L as J } from "../Loader-DUaFpDGv.mjs";
28
- import { useTheme as Ne } from "@mui/material/styles";
27
+ import { L as Q } from "../Loader-DUaFpDGv.mjs";
28
+ import { useTheme as He } from "@mui/material/styles";
29
29
  import { L as ye } from "../LineChart-BWWmmJxV.mjs";
30
- import { M as lt } from "../MiniWidgetContainer-CTyjmE1h.mjs";
31
- import { subMonths as dt } from "date-fns";
32
- import { TrendingUp as ht, TrendingDown as ut, MultilineChart as mt, ExpandLess as gt, ExpandMore as pt } from "@mxenabled/mx-icons";
33
- import { a as Ct, f as Z } from "../NumberFormatting-CtWHhyBX.mjs";
34
- import { M as ft } from "../MicroWidgetContainer-Dxz8uBN9.mjs";
35
- import Tt from "@mui/material/Collapse";
36
- import yt from "@mui/material/List";
37
- import _t from "@mui/material/ListItem";
38
- import bt from "@mui/material/ListItemButton";
39
- import St from "@mui/material/ListItemIcon";
40
- import wt from "@mui/material/ListItemText";
41
- import He from "@mui/material/styles/useTheme";
42
- import Dt from "@mui/material/Divider";
43
- import { useTheme as It, Stack as Et } from "@mui/material";
44
- import Lt from "@mui/material/Paper";
45
- import { b as xt } from "../CategoryUtil-BR3H5i6n.mjs";
46
- import { E as vt } from "../ExportCsvAction-CbMfQ2Wa.mjs";
47
- import { E as Mt } from "../EmptyState-C0lr9E5T.mjs";
30
+ import { M as it } from "../MiniWidgetContainer-CTyjmE1h.mjs";
31
+ import { subMonths as ct } from "date-fns";
32
+ import { TrendingUp as lt, TrendingDown as dt, MultilineChart as ht, ExpandLess as ut, ExpandMore as mt } from "@mxenabled/mx-icons";
33
+ import { a as gt, f as U } from "../NumberFormatting-CtWHhyBX.mjs";
34
+ import { M as pt } from "../MicroWidgetContainer-Dxz8uBN9.mjs";
35
+ import Ct from "@mui/material/Collapse";
36
+ import ft from "@mui/material/List";
37
+ import Tt from "@mui/material/ListItem";
38
+ import yt from "@mui/material/ListItemButton";
39
+ import _t from "@mui/material/ListItemIcon";
40
+ import bt from "@mui/material/ListItemText";
41
+ import Ne from "@mui/material/styles/useTheme";
42
+ import St from "@mui/material/Divider";
43
+ import { useTheme as wt, Stack as Dt } from "@mui/material";
44
+ import It from "@mui/material/Paper";
45
+ import { b as Et } from "../CategoryUtil-BR3H5i6n.mjs";
46
+ import { E as Lt } from "../ExportCsvAction-CbMfQ2Wa.mjs";
47
+ import { E as xt } from "../EmptyState-C0lr9E5T.mjs";
48
48
  const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
49
- nt,
49
+ et,
50
50
  {
51
51
  exclusive: !0,
52
52
  onChange: o,
53
53
  orientation: "horizontal",
54
54
  value: n,
55
- children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(tt, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(ae, { name: "table_chart_view" }) : /* @__PURE__ */ e(ae, { name: "format_list_bulleted" }) }, t))
55
+ children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(Je, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(re, { name: "table_chart_view" }) : /* @__PURE__ */ e(re, { name: "format_list_bulleted" }) }, t))
56
56
  }
57
57
  ), Oe = ({ selectedDateRange: n, selectedCategoryGuid: o }) => {
58
- const { trends: t } = R(), { isMobile: s, isDesktop: i } = j(), { getCategoryName: h } = K(), d = a.useMemo(() => {
59
- const l = q(
58
+ const { trends: t } = R(), { isMobile: s, isDesktop: a } = K(), { getCategoryName: h } = F(), d = i.useMemo(() => {
59
+ const c = Z(
60
60
  n.start,
61
61
  s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
62
- ), c = q(
62
+ ), l = Z(
63
63
  n.end,
64
64
  s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
65
65
  );
66
- return `${l} - ${c}`;
66
+ return `${c} - ${l}`;
67
67
  }, [n, s]);
68
68
  return /* @__PURE__ */ f(O, { sx: { mr: 10, minWidth: "60%" }, children: [
69
69
  /* @__PURE__ */ e(
70
- Q,
70
+ X,
71
71
  {
72
72
  display: "block",
73
73
  fontWeight: 700,
@@ -76,39 +76,39 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
76
76
  overflow: "visible",
77
77
  textOverflow: "unset"
78
78
  },
79
- variant: i ? "H3" : "Body",
79
+ variant: a ? "H3" : "Body",
80
80
  children: h(o) || t.sub_title
81
81
  }
82
82
  ),
83
- /* @__PURE__ */ e(Q, { variant: i ? "Body" : "Small", children: d })
83
+ /* @__PURE__ */ e(X, { variant: a ? "Body" : "Small", children: d })
84
84
  ] });
85
- }, At = (n) => {
85
+ }, vt = (n) => {
86
86
  const o = n.row[n.field];
87
- return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(at, { amount: o, variant: "Small" }) });
88
- }, Rt = ({ categoryGuid: n, topLevelCategoryGuid: o }) => {
87
+ return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(st, { amount: o, variant: "Small" }) });
88
+ }, Mt = ({ categoryGuid: n, topLevelCategoryGuid: o }) => {
89
89
  const { categories: t } = R(), s = t.default_categories[n]?.replace(/&/g, "&") ?? Me[n];
90
90
  return /* @__PURE__ */ f(_, { alignItems: "center", direction: "row", justifyContent: "center", children: [
91
91
  /* @__PURE__ */ e(
92
92
  O,
93
93
  {
94
- "aria-label": it(t.category_icon_label_aria, s),
94
+ "aria-label": rt(t.category_icon_label_aria, s),
95
95
  role: "img",
96
96
  children: /* @__PURE__ */ e(Te, { categoryGuid: o })
97
97
  }
98
98
  ),
99
- /* @__PURE__ */ e(Q, { sx: { ml: 12, pb: 6 }, variant: "Small", children: s })
99
+ /* @__PURE__ */ e(X, { sx: { ml: 12, pb: 6 }, variant: "Small", children: s })
100
100
  ] });
101
- }, kt = (n) => /* @__PURE__ */ e(_, { alignItems: "center", direction: "row", height: "100%", width: "100%", children: /* @__PURE__ */ e(
102
- Rt,
101
+ }, At = (n) => /* @__PURE__ */ e(_, { alignItems: "center", direction: "row", height: "100%", width: "100%", children: /* @__PURE__ */ e(
102
+ Mt,
103
103
  {
104
104
  categoryGuid: n.row.category,
105
105
  topLevelCategoryGuid: n.row.top_level_category_guid
106
106
  }
107
- ) }), Nt = (n, o) => {
107
+ ) }), Rt = (n, o) => {
108
108
  const t = [], s = new Date(n);
109
109
  for (; s <= o; ) {
110
- const i = q(s, B.MONTH);
111
- t.push(i), s.setMonth(s.getMonth() + 1);
110
+ const a = Z(s, B.MONTH);
111
+ t.push(a), s.setMonth(s.getMonth() + 1);
112
112
  }
113
113
  return t;
114
114
  }, Ve = ({
@@ -116,19 +116,19 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
116
116
  selectedDateRange: o,
117
117
  selectedCategory: t,
118
118
  onClickRow: s,
119
- height: i = "100dvh",
119
+ height: a = "100dvh",
120
120
  sx: h = {}
121
121
  }) => {
122
- const { onEvent: d } = N(), l = q(/* @__PURE__ */ new Date(), B.MONTH_SHORT), [c, m] = a.useState([
123
- { field: l, sort: "desc" }
124
- ]), C = a.useMemo(() => Nt(o.start, o.end), [o]), u = [
122
+ const { onEvent: d } = H(), c = Z(/* @__PURE__ */ new Date(), B.MONTH_SHORT), [l, m] = i.useState([
123
+ { field: c, sort: "desc" }
124
+ ]), C = i.useMemo(() => Rt(o.start, o.end), [o]), u = [
125
125
  {
126
126
  field: "category",
127
127
  flex: 1,
128
128
  headerName: "Category",
129
129
  minWidth: 175,
130
130
  renderHeader: be,
131
- renderCell: kt,
131
+ renderCell: At,
132
132
  sortable: !0,
133
133
  type: "string"
134
134
  },
@@ -139,79 +139,79 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
139
139
  headerName: r,
140
140
  minWidth: 100,
141
141
  renderHeader: be,
142
- renderCell: At,
142
+ renderCell: vt,
143
143
  align: "right",
144
144
  headerAlign: "right",
145
145
  sortable: !0,
146
146
  hideSortIcons: !1,
147
147
  type: "number",
148
- sortComparator: $e
148
+ sortComparator: Pe
149
149
  })
150
150
  )
151
- ], b = a.useMemo(() => {
151
+ ], b = i.useMemo(() => {
152
152
  const r = n.filter(
153
- (p) => !Xe(p) && !Ze(p)
153
+ (p) => !Ye(p) && !Ue(p)
154
154
  ), T = (t ? r.filter(
155
155
  (p) => p.category_guid === t || p.top_level_category_guid === t
156
156
  ) : r).reduce(
157
- (p, w) => {
158
- const { category_guid: D, top_level_category_guid: E, month: k, total: I, year: H } = w, L = t ? D : E;
159
- p[L] || (p[L] = {
160
- id: L,
161
- category: L,
162
- category_guid: D,
163
- top_level_category_guid: E
157
+ (p, L) => {
158
+ const { category_guid: w, top_level_category_guid: I, month: k, total: D, year: N } = L, x = t ? w : I;
159
+ p[x] || (p[x] = {
160
+ id: x,
161
+ category: x,
162
+ category_guid: w,
163
+ top_level_category_guid: I
164
164
  });
165
- const x = q(new Date(H, k - 1), B.MONTH_SHORT);
166
- return p[L][x] || (p[L][x] = 0), p[L][x] = p[L][x] + Math.abs(I), p;
165
+ const E = Z(new Date(N, k - 1), B.MONTH_SHORT);
166
+ return p[x][E] || (p[x][E] = 0), p[x][E] = p[x][E] + Math.abs(D), p;
167
167
  },
168
168
  {}
169
169
  );
170
170
  return Object.values(T);
171
171
  }, [n, t]);
172
- return /* @__PURE__ */ e(O, { sx: { height: i, width: "100%", overflowX: "auto", boxShadow: "none", ...h }, children: /* @__PURE__ */ e(
173
- rt,
172
+ return /* @__PURE__ */ e(O, { sx: { height: a, width: "100%", overflowX: "auto", boxShadow: "none", ...h }, children: /* @__PURE__ */ e(
173
+ ot,
174
174
  {
175
175
  columns: u,
176
176
  disableColumnFilter: !0,
177
177
  disableColumnMenu: !0,
178
178
  hideFooter: !0,
179
- initialState: { sorting: { sortModel: c } },
179
+ initialState: { sorting: { sortModel: l } },
180
180
  onRowClick: (r) => {
181
181
  s?.(r.row.category), d(y.TRENDS_CLICK_LIST_ITEM, {
182
- ...M,
182
+ ...A,
183
183
  listItem: Me[r.row.category]
184
184
  });
185
185
  },
186
186
  onSortModelChange: (r) => {
187
- m(r), d(y.TRENDS_CLICK_TABLE_SORT, M);
187
+ m(r), d(y.TRENDS_CLICK_TABLE_SORT, A);
188
188
  },
189
189
  rows: b,
190
190
  slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
191
- sortModel: c,
191
+ sortModel: l,
192
192
  sortingOrder: ["asc", "desc"]
193
193
  }
194
194
  ) });
195
- }, Ht = {
195
+ }, kt = {
196
196
  title: "Transaction List"
197
- }, Wt = ({
197
+ }, Ht = ({
198
198
  categoryGuid: n,
199
199
  dateRange: o,
200
200
  isOpen: t,
201
201
  onClose: s
202
202
  }) => {
203
- const { onEvent: i } = N(), { selectedAccountGuids: h } = $(), { common: d } = R(), { setFilter: l, sortedTransactions: c } = ie(), [m, C] = a.useState(""), u = a.useMemo(
204
- () => c.find((r) => r.guid === m),
205
- [m, c]
203
+ const { onEvent: a } = H(), { selectedAccountGuids: h } = P(), { common: d } = R(), { setFilter: c, sortedTransactions: l } = ae(), [m, C] = i.useState(""), u = i.useMemo(
204
+ () => l.find((r) => r.guid === m),
205
+ [m, l]
206
206
  );
207
- a.useEffect(() => {
208
- l({
207
+ i.useEffect(() => {
208
+ c({
209
209
  accounts: h,
210
210
  dateRange: o,
211
211
  custom: (r) => n === "" || n === r.category_guid || n === r.top_level_category_guid,
212
212
  showSplits: !!n
213
213
  });
214
- }, [h, n, o]), a.useEffect(() => i(y.TRENDS_VIEW_TRANSACTIONS), []);
214
+ }, [h, n, o]), i.useEffect(() => a(y.TRENDS_VIEW_TRANSACTIONS), []);
215
215
  const b = () => {
216
216
  C(""), s();
217
217
  };
@@ -221,80 +221,80 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
221
221
  ariaLabelClose: d.close_aria,
222
222
  isOpen: t,
223
223
  onClose: b,
224
- title: Ht.title,
224
+ title: kt.title,
225
225
  children: [
226
226
  u && /* @__PURE__ */ e(Re, { transaction: u }),
227
227
  !u && /* @__PURE__ */ e(ke, { onClick: C })
228
228
  ]
229
229
  }
230
230
  );
231
- }, Ot = A(Wt), Vt = ({ onBackClick: n, sx: o }) => {
232
- const { onEvent: t } = N(), { isDesktop: s, isTablet: i, isMobile: h } = j(), { visibleAccounts: d } = ce(), { loadMonthlyCategoryTotals: l, monthlyCategoryTotals: c, getCategoryName: m } = K(), { sortedTransactions: C } = ie(), { selectedDateRange: u, setSelectedDateRange: b } = ee(), { isCopyLoaded: r, isInitialized: g, selectedAccounts: T, setSelectedAccounts: p } = $(), { trends: w } = R(), [D, E] = a.useState(!1), [k, I] = a.useState(!1), [H, L] = a.useState("Chart"), [x, z] = a.useState(""), [le, F] = a.useState(window.innerHeight), de = le - (h ? 315 : 345);
233
- a.useEffect(() => {
234
- const S = () => F(window.innerHeight);
231
+ }, Nt = M(Ht), Wt = ({ onBackClick: n, sx: o }) => {
232
+ const { onEvent: t } = H(), { isDesktop: s, isTablet: a, isMobile: h } = K(), { visibleAccounts: d } = ie(), { loadMonthlyCategoryTotals: c, monthlyCategoryTotals: l, getCategoryName: m } = F(), { sortedTransactions: C } = ae(), { selectedDateRange: u, setSelectedDateRange: b } = q(), { isCopyLoaded: r, isInitialized: g, selectedAccounts: T, setSelectedAccounts: p } = P(), { trends: L } = R(), [w, I] = i.useState(!1), [k, D] = i.useState(!1), [N, x] = i.useState("Chart"), [E, $] = i.useState(""), [z, ce] = i.useState(window.innerHeight), ee = z - (h ? 315 : 345);
233
+ i.useEffect(() => {
234
+ const S = () => ce(window.innerHeight);
235
235
  return window.addEventListener("resize", S), () => window.removeEventListener("resize", S);
236
- }, []), a.useEffect(() => {
236
+ }, []), i.useEffect(() => {
237
237
  p(d);
238
- }, [d]), a.useEffect(() => {
239
- g && l(
238
+ }, [d]), i.useEffect(() => {
239
+ g && c(
240
240
  T,
241
241
  u.start,
242
242
  u.end
243
243
  ).finally(() => {
244
- E(!0);
244
+ I(!0);
245
245
  });
246
246
  }, [g, T, u]);
247
- const P = a.useMemo(() => {
248
- if (!D) return { stackedDatasets: [], unstackedDatasets: [] };
249
- const S = je(
250
- c,
247
+ const te = i.useMemo(() => {
248
+ if (!w) return { stackedDatasets: [], unstackedDatasets: [] };
249
+ const S = Ke(
250
+ l,
251
251
  u.start,
252
252
  u.end
253
- ), W = x.length ? S.filter(
254
- (G) => G.top_level_category_guid === x || G.category_guid === x
255
- ) : Qe(S);
253
+ ), W = E.length ? S.filter(
254
+ (G) => G.top_level_category_guid === E || G.category_guid === E
255
+ ) : Xe(S);
256
256
  return {
257
- stackedDatasets: W.filter(qe),
258
- unstackedDatasets: W.filter(Je)
257
+ stackedDatasets: W.filter(Ze),
258
+ unstackedDatasets: W.filter(Qe)
259
259
  };
260
- }, [c, x, u]), te = (S, W) => {
261
- L(W ?? H), t(y.TRENDS_CLICK_TOGGLE_VIEW);
262
- }, he = (S) => {
263
- const W = Ie(S?.[0], 1), G = S?.[1], pe = re(G, W);
260
+ }, [l, E, u]), ne = (S, W) => {
261
+ x(W ?? N), t(y.TRENDS_CLICK_TOGGLE_VIEW);
262
+ }, oe = (S) => {
263
+ const W = Ie(S?.[0], 1), G = S?.[1], ge = Ce(G, W);
264
264
  b({ start: W, end: G }), t(y.TRENDS_CLICK_TIME_WINDOW, {
265
- time_period: pe + "M"
265
+ time_period: ge + "M"
266
266
  });
267
- }, ne = () => {
267
+ }, le = () => {
268
268
  t(y.TRENDS_CLICK_FILTER);
269
- }, oe = (S) => {
270
- z(S);
271
- }, ue = (S) => {
272
- z(S), t(y.TRENDS_CLICK_LEGEND, { category: m(S) });
273
269
  }, se = (S) => {
270
+ $(S);
271
+ }, de = (S) => {
272
+ $(S), t(y.TRENDS_CLICK_LEGEND, { category: m(S) });
273
+ }, he = (S) => {
274
274
  t(y.TRENDS_HOVER_LEGEND, { category: m(S) });
275
- }, me = (S) => {
275
+ }, ue = (S) => {
276
276
  t(y.TRENDS_HOVER_AREA, { category: S });
277
- }, ge = (S) => {
277
+ }, me = (S) => {
278
278
  t(y.TRENDS_HOVER_POINT, { category: S });
279
279
  };
280
- return !r || !g || !D ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ f(
280
+ return !r || !g || !w ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ f(
281
281
  Ae,
282
282
  {
283
283
  accountOptions: d,
284
- calendarActions: { onRangeChanged: he },
284
+ calendarActions: { onRangeChanged: oe },
285
285
  dateRange: u,
286
286
  dateRangeVariant: "timeframebuttons",
287
- onAccountsFilterClick: ne,
287
+ onAccountsFilterClick: le,
288
288
  onBackClick: n,
289
289
  sx: o,
290
- title: w.title,
290
+ title: L.title,
291
291
  children: [
292
292
  /* @__PURE__ */ f(
293
293
  _,
294
294
  {
295
295
  sx: {
296
296
  // eslint-disable-next-line no-nested-ternary
297
- px: s ? 48 : i ? 24 : 12
297
+ px: s ? 48 : a ? 24 : 12
298
298
  },
299
299
  children: [
300
300
  /* @__PURE__ */ f(
@@ -307,40 +307,40 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
307
307
  /* @__PURE__ */ e(
308
308
  Oe,
309
309
  {
310
- selectedCategoryGuid: x,
310
+ selectedCategoryGuid: E,
311
311
  selectedDateRange: u
312
312
  }
313
313
  ),
314
- /* @__PURE__ */ e(We, { onTabChange: te, selectedTab: H })
314
+ /* @__PURE__ */ e(We, { onTabChange: ne, selectedTab: N })
315
315
  ]
316
316
  }
317
317
  ),
318
318
  /* @__PURE__ */ f(_, { alignItems: "center", flexDirection: "row", width: "100%", children: [
319
- /* @__PURE__ */ e(O, { flexGrow: 1, children: x && /* @__PURE__ */ f(Ce, { onClick: () => z(""), sx: { p: 0, pr: 5 }, children: [
320
- /* @__PURE__ */ e(ae, { name: "arrow_back" }),
321
- w.all_categories
319
+ /* @__PURE__ */ e(O, { flexGrow: 1, children: E && /* @__PURE__ */ f(pe, { onClick: () => $(""), sx: { p: 0, pr: 5 }, children: [
320
+ /* @__PURE__ */ e(re, { name: "arrow_back" }),
321
+ L.all_categories
322
322
  ] }) }),
323
- /* @__PURE__ */ e(Ce, { onClick: () => I(!0), sx: { px: 5 }, children: `${w.view_transactions} (${C.length})` })
323
+ /* @__PURE__ */ e(pe, { onClick: () => D(!0), sx: { px: 5 }, children: `${L.view_transactions} (${C.length})` })
324
324
  ] }),
325
325
  /* @__PURE__ */ f(O, { children: [
326
- H === "Chart" && /* @__PURE__ */ e(
327
- Ye,
326
+ N === "Chart" && /* @__PURE__ */ e(
327
+ $e,
328
328
  {
329
- availableHeight: de,
330
- onClickLegend: ue,
331
- onHoverArea: me,
332
- onHoverLegend: se,
333
- onHoverPoint: ge,
334
- stackedDatasets: P.stackedDatasets,
335
- unstackedDatasets: P.unstackedDatasets
329
+ availableHeight: ee,
330
+ onClickLegend: de,
331
+ onHoverArea: ue,
332
+ onHoverLegend: he,
333
+ onHoverPoint: me,
334
+ stackedDatasets: te.stackedDatasets,
335
+ unstackedDatasets: te.unstackedDatasets
336
336
  }
337
337
  ),
338
- H === "Table" && /* @__PURE__ */ e(
338
+ N === "Table" && /* @__PURE__ */ e(
339
339
  Ve,
340
340
  {
341
- monthlyCategoryTotals: c,
342
- onClickRow: oe,
343
- selectedCategory: x,
341
+ monthlyCategoryTotals: l,
342
+ onClickRow: se,
343
+ selectedCategory: E,
344
344
  selectedDateRange: u
345
345
  }
346
346
  )
@@ -349,19 +349,19 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
349
349
  }
350
350
  ),
351
351
  /* @__PURE__ */ e(
352
- Ot,
352
+ Nt,
353
353
  {
354
- categoryGuid: x,
354
+ categoryGuid: E,
355
355
  dateRange: u,
356
356
  isOpen: k,
357
- onClose: () => I(!1)
357
+ onClose: () => D(!1)
358
358
  }
359
359
  )
360
360
  ]
361
361
  }
362
362
  );
363
- }, Xn = A(Vt), Gt = () => {
364
- const n = Ne(), { monthlyCategoryTotals: o } = K(), { trends: t } = R(), s = et(o);
363
+ }, Yn = M(Wt), Ot = () => {
364
+ const n = He(), { monthlyCategoryTotals: o } = F(), { trends: t } = R(), s = qe(o);
365
365
  return /* @__PURE__ */ e(
366
366
  ye,
367
367
  {
@@ -378,35 +378,35 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
378
378
  valueFormatterString: "0,0"
379
379
  }
380
380
  );
381
- }, Bt = A(Gt), zt = ({ onPrimaryCtaClick: n, sx: o }) => {
382
- const { visibleAccounts: t } = ce(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: i } = K(), { isInitialized: h } = ve(), { trends: d } = R(), { isCopyLoaded: l, selectedAccounts: c, setSelectedAccounts: m } = $();
383
- return a.useEffect(() => {
381
+ }, Vt = M(Ot), Gt = ({ onPrimaryCtaClick: n, sx: o }) => {
382
+ const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: a } = F(), { isInitialized: h } = ve(), { trends: d } = R(), { isCopyLoaded: c, selectedAccounts: l, setSelectedAccounts: m } = P();
383
+ return i.useEffect(() => {
384
384
  m(t);
385
- }, [t]), a.useEffect(() => {
386
- h && s(c).finally();
387
- }, [h, c]), !l || !h ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ e(
388
- lt,
385
+ }, [t]), i.useEffect(() => {
386
+ h && s(l).finally();
387
+ }, [h, l]), !c || !h ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
388
+ it,
389
389
  {
390
390
  onPrimaryCtaClick: n,
391
391
  primaryCtaLabel: d.primary_cta,
392
392
  subTitle: d.sub_title,
393
393
  sx: o,
394
394
  title: d.mini_title,
395
- children: i ? /* @__PURE__ */ e(Bt, {}) : /* @__PURE__ */ e(J, {})
395
+ children: a ? /* @__PURE__ */ e(Vt, {}) : /* @__PURE__ */ e(Q, {})
396
396
  }
397
397
  );
398
- }, Zn = A(zt), Ft = 70, Se = ({
398
+ }, Un = M(Gt), Bt = 70, Se = ({
399
399
  title: n,
400
400
  totalAmount: o,
401
401
  transactionType: t,
402
402
  percentage: s,
403
- secondaryLabel: i,
403
+ secondaryLabel: a,
404
404
  shouldDisplayPercentage: h
405
405
  }) => {
406
- const { availableWidth: d } = ot(), l = a.useRef(null), c = a.useRef(null), m = Ct(Number(Math.abs(s)), {
406
+ const { availableWidth: d } = tt(), c = i.useRef(null), l = i.useRef(null), m = gt(Number(Math.abs(s)), {
407
407
  style: "percent",
408
408
  minimumIntegerDigits: 1
409
- }), C = d === 288 && Z(o, "0,0.00").length > 10 ? Z(o, "0,0") : Z(o, "0,0.00"), u = t === "spending" ? s > 0 : s >= 0, b = t === "spending" ? "error.main" : "success.main", r = t === "spending" ? "success.main" : "text.secondary", g = l?.current, T = c?.current, p = g && T ? g.scrollWidth > T.clientWidth - Ft : !1;
409
+ }), C = d === 288 && U(o, "0,0.00").length > 10 ? U(o, "0,0") : U(o, "0,0.00"), u = t === "spending" ? s > 0 : s >= 0, b = t === "spending" ? "error.main" : "success.main", r = t === "spending" ? "success.main" : "text.secondary", g = c?.current, T = l?.current, p = g && T ? g.scrollWidth > T.clientWidth - Bt : !1;
410
410
  return /* @__PURE__ */ f(
411
411
  _,
412
412
  {
@@ -429,11 +429,11 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
429
429
  justifyContent: "space-between"
430
430
  },
431
431
  children: [
432
- /* @__PURE__ */ e(X, { color: "text.secondary", variant: "caption", children: n }),
432
+ /* @__PURE__ */ e(Y, { color: "text.secondary", variant: "caption", children: n }),
433
433
  h && /* @__PURE__ */ f(_, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
434
- u ? /* @__PURE__ */ e(ht, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(ut, { size: 20, sx: { color: r } }),
434
+ u ? /* @__PURE__ */ e(lt, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(dt, { size: 20, sx: { color: r } }),
435
435
  /* @__PURE__ */ e(
436
- X,
436
+ Y,
437
437
  {
438
438
  sx: {
439
439
  color: u ? b : r,
@@ -450,7 +450,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
450
450
  /* @__PURE__ */ f(
451
451
  _,
452
452
  {
453
- ref: c,
453
+ ref: l,
454
454
  sx: {
455
455
  alignItems: "center",
456
456
  flexDirection: "row",
@@ -460,17 +460,17 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
460
460
  /* @__PURE__ */ e(
461
461
  O,
462
462
  {
463
- ref: l,
463
+ ref: c,
464
464
  sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
465
465
  children: /* @__PURE__ */ e(De, { children: C })
466
466
  }
467
467
  ),
468
468
  h && d >= 450 && !p && /* @__PURE__ */ e(
469
- X,
469
+ Y,
470
470
  {
471
471
  color: u ? b : r,
472
472
  variant: "caption",
473
- children: i
473
+ children: a
474
474
  }
475
475
  )
476
476
  ]
@@ -479,49 +479,49 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
479
479
  ]
480
480
  }
481
481
  );
482
- }, Pt = A(() => {
482
+ }, zt = M(() => {
483
483
  const { trends: n } = R();
484
484
  return /* @__PURE__ */ f(_, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
485
- /* @__PURE__ */ e(mt, { size: 32 }),
485
+ /* @__PURE__ */ e(ht, { size: 32 }),
486
486
  /* @__PURE__ */ f(_, { children: [
487
- /* @__PURE__ */ e(X, { fontWeight: 600, variant: "body1", children: n.zero_state_content_header }),
488
- /* @__PURE__ */ e(X, { color: "text.secondary", variant: "subtitle2", children: n.zero_state_content_description })
487
+ /* @__PURE__ */ e(Y, { fontWeight: 600, variant: "body1", children: n.zero_state_content_header }),
488
+ /* @__PURE__ */ e(Y, { color: "text.secondary", variant: "subtitle2", children: n.zero_state_content_description })
489
489
  ] })
490
490
  ] });
491
- }), Qn = A(({ onCtaClick: n }) => {
492
- const { visibleAccounts: o } = ce(), { onEvent: t } = N(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: i, monthlyTotalsLoaded: h } = K(), d = {
493
- start: dt(/* @__PURE__ */ new Date(), 1),
491
+ }), Xn = M(({ onCtaClick: n }) => {
492
+ const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: h } = F(), d = {
493
+ start: ct(/* @__PURE__ */ new Date(), 1),
494
494
  end: /* @__PURE__ */ new Date()
495
- }, { trends: l } = R(), { selectedAccounts: c, setSelectedAccounts: m, isInitialized: C } = $();
496
- a.useEffect(() => {
495
+ }, { trends: c } = R(), { selectedAccounts: l, setSelectedAccounts: m, isInitialized: C } = P();
496
+ i.useEffect(() => {
497
497
  m(o);
498
- }, [o]), a.useEffect(() => {
499
- C && i(c, d.start).then(() => {
498
+ }, [o]), i.useEffect(() => {
499
+ C && a(l, d.start).then(() => {
500
500
  t(y.TRENDS_LOAD_WIDGET, {
501
501
  state: o?.length ? "default" : "zeroState"
502
502
  });
503
503
  });
504
- }, [C, c]);
505
- const { spendingData: u, incomeData: b } = a.useMemo(
504
+ }, [C, l]);
505
+ const { spendingData: u, incomeData: b } = i.useMemo(
506
506
  () => ({
507
507
  spendingData: Le(s, d),
508
508
  incomeData: xe(s, d)
509
509
  }),
510
510
  [s, d]
511
- ), [r, g] = u, [T, p] = b, w = _e(g.y, r.y), D = _e(p.y, T.y), E = C && !o?.length, k = () => {
511
+ ), [r, g] = u, [T, p] = b, L = _e(g.y, r.y), w = _e(p.y, T.y), I = C && !o?.length, k = () => {
512
512
  t(
513
- E ? y.TRENDS_CLICK_GET_STARTED : y.TRENDS_CLICK_VIEW_MORE
513
+ I ? y.TRENDS_CLICK_GET_STARTED : y.TRENDS_CLICK_VIEW_MORE
514
514
  ), n();
515
515
  };
516
- return !h || !C ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ e(
517
- ft,
516
+ return !h || !C ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
517
+ pt,
518
518
  {
519
519
  className: "mx-trends-microwidget",
520
- ctaLabel: l.micro_primary_cta_label,
520
+ ctaLabel: c.micro_primary_cta_label,
521
521
  onCTAClick: k,
522
- subHeader: E ? void 0 : l.micro_subheader,
523
- title: l.title,
524
- children: E ? /* @__PURE__ */ e(Pt, {}) : /* @__PURE__ */ f(
522
+ subHeader: I ? void 0 : c.micro_subheader,
523
+ title: c.title,
524
+ children: I ? /* @__PURE__ */ e(zt, {}) : /* @__PURE__ */ f(
525
525
  _,
526
526
  {
527
527
  sx: {
@@ -533,10 +533,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
533
533
  /* @__PURE__ */ e(
534
534
  Se,
535
535
  {
536
- percentage: w,
537
- secondaryLabel: l.micro_secondary_label,
536
+ percentage: L,
537
+ secondaryLabel: c.micro_secondary_label,
538
538
  shouldDisplayPercentage: g.y !== 0 && r.y !== 0,
539
- title: l.spending_label,
539
+ title: c.spending_label,
540
540
  totalAmount: g.y,
541
541
  transactionType: "spending"
542
542
  }
@@ -544,10 +544,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
544
544
  /* @__PURE__ */ e(
545
545
  Se,
546
546
  {
547
- percentage: D,
548
- secondaryLabel: l.micro_secondary_label,
547
+ percentage: w,
548
+ secondaryLabel: c.micro_secondary_label,
549
549
  shouldDisplayPercentage: p.y !== 0 && T.y !== 0,
550
- title: l.income_label,
550
+ title: c.income_label,
551
551
  totalAmount: p.y,
552
552
  transactionType: "income"
553
553
  }
@@ -557,17 +557,17 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
557
557
  )
558
558
  }
559
559
  );
560
- }), Kt = A(
560
+ }), Ft = M(
561
561
  ({ isExpanded: n, onClick: o }) => {
562
- const t = He();
563
- return /* @__PURE__ */ e(_t, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(bt, { onClick: o, sx: { justifyContent: "center" }, children: /* @__PURE__ */ f(
562
+ const t = Ne();
563
+ return /* @__PURE__ */ e(Tt, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(yt, { onClick: o, sx: { justifyContent: "center" }, children: /* @__PURE__ */ f(
564
564
  _,
565
565
  {
566
566
  sx: { color: t.palette.primary.main, flexDirection: "row", alignItems: "center" },
567
567
  children: [
568
- /* @__PURE__ */ e(wt, { children: /* @__PURE__ */ e(Q, { bold: !0, variant: "body2", children: n ? "View less" : "View more" }) }),
569
- /* @__PURE__ */ e(St, { sx: { color: t.palette.primary.main }, children: n ? /* @__PURE__ */ e(gt, {}) : /* @__PURE__ */ e(
570
- pt,
568
+ /* @__PURE__ */ e(bt, { children: /* @__PURE__ */ e(X, { bold: !0, variant: "body2", children: n ? "View less" : "View more" }) }),
569
+ /* @__PURE__ */ e(_t, { sx: { color: t.palette.primary.main }, children: n ? /* @__PURE__ */ e(ut, {}) : /* @__PURE__ */ e(
570
+ mt,
571
571
  {
572
572
  sx: {
573
573
  transition: "transform 0.3s ease-in-out",
@@ -579,51 +579,51 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
579
579
  }
580
580
  ) }) });
581
581
  }
582
- ), we = A(
582
+ ), we = M(
583
583
  ({
584
584
  totalAmount: n,
585
585
  guid: o,
586
586
  name: t,
587
587
  transactions: s,
588
- onClick: i,
588
+ onClick: a,
589
589
  isLastItem: h = !1,
590
590
  showDivider: d = !0
591
591
  }) => {
592
- const { trends: l } = R(), { onEvent: c } = N(), m = `${s.length} ${s.length === 1 ? l.transaction : l.transactions}`, C = () => {
593
- i?.(), c(y.TRENDS_CLICK_LIST_ITEM, {
594
- ...M,
592
+ const { trends: c } = R(), { onEvent: l } = H(), m = `${s.length} ${s.length === 1 ? c.transaction : c.transactions}`, C = () => {
593
+ a?.(), l(y.TRENDS_CLICK_LIST_ITEM, {
594
+ ...A,
595
595
  listItem: t
596
596
  });
597
597
  };
598
- return /* @__PURE__ */ f(a.Fragment, { children: [
598
+ return /* @__PURE__ */ f(i.Fragment, { children: [
599
599
  /* @__PURE__ */ e(
600
600
  Ee,
601
601
  {
602
602
  leftIcon: o ? /* @__PURE__ */ e(Te, { categoryGuid: o }) : void 0,
603
603
  onClick: C,
604
- rightContent: Z(Math.abs(n), "0,0.00"),
605
- rightIcon: i ? /* @__PURE__ */ e(Ke, {}) : void 0,
604
+ rightContent: U(Math.abs(n), "0,0.00"),
605
+ rightIcon: a ? /* @__PURE__ */ e(Fe, {}) : void 0,
606
606
  subtitle: m,
607
607
  title: t
608
608
  }
609
609
  ),
610
- d && /* @__PURE__ */ e(Dt, { sx: { ml: h ? 24 : 68 } })
610
+ d && /* @__PURE__ */ e(St, { sx: { ml: h ? 24 : 68 } })
611
611
  ] }, o);
612
612
  }
613
- ), $t = A(
613
+ ), Pt = M(
614
614
  ({ availableHeight: n = 0, onCategoryClick: o }) => {
615
- const { collapsedCategories: t, visibleCategories: s, setVisibleListLength: i } = ee(), { isLargeDesktop: h, isDesktop: d } = j(), { trends: l } = R(), { onEvent: c } = N(), [m, C] = a.useState(!1), u = d || h;
616
- a.useEffect(() => {
615
+ const { collapsedCategories: t, visibleCategories: s, setVisibleListLength: a } = q(), { isLargeDesktop: h, isDesktop: d } = K(), { trends: c } = R(), { onEvent: l } = H(), [m, C] = i.useState(!1), u = d || h;
616
+ i.useEffect(() => {
617
617
  const g = Math.floor(n / 64) - 1, T = s.length + t.length;
618
- g !== s.length && (i(u ? Math.max(g, 5) : 5), C(g >= T));
618
+ g !== s.length && (a(u ? Math.max(g, 5) : 5), C(g >= T));
619
619
  }, [n]);
620
620
  const b = () => {
621
- C(!m), c(y.TRENDS_CLICK_VIEW_MORE, {
622
- ...M
621
+ C(!m), l(y.TRENDS_CLICK_VIEW_MORE, {
622
+ ...A
623
623
  });
624
624
  }, r = s.length + (m ? t.length : 0);
625
- return /* @__PURE__ */ e(_, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(yt, { children: [
626
- /* @__PURE__ */ e(_, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(De, { children: l.categories }) }),
625
+ return /* @__PURE__ */ e(_, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(ft, { children: [
626
+ /* @__PURE__ */ e(_, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(De, { children: c.categories }) }),
627
627
  s.map((g, T) => /* @__PURE__ */ e(
628
628
  we,
629
629
  {
@@ -635,7 +635,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
635
635
  g.guid
636
636
  )),
637
637
  /* @__PURE__ */ e(
638
- Tt,
638
+ Ct,
639
639
  {
640
640
  in: m,
641
641
  sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
@@ -654,10 +654,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
654
654
  })
655
655
  }
656
656
  ),
657
- t.length > 0 && /* @__PURE__ */ e(Kt, { isExpanded: m, onClick: b })
657
+ t.length > 0 && /* @__PURE__ */ e(Ft, { isExpanded: m, onClick: b })
658
658
  ] }) });
659
659
  }
660
- ), jt = [
660
+ ), Kt = [
661
661
  "BillAmountNotStandard",
662
662
  "CategorySpendingV2",
663
663
  "CostOfLivingToIncome",
@@ -691,46 +691,46 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
691
691
  "WeeklyNewMerchantsV2",
692
692
  "WeeklyNoSpendDays",
693
693
  "WeeklySmallPurchasesSummary"
694
- ], Yt = ({ onInsightCardClick: n }) => {
695
- const o = It(), { onEvent: t } = N(), { isMobile: s, isDesktop: i, isLargeDesktop: h } = j(), { beatStore: d, endpoint: l, sessionToken: c } = ve(), { isInitialized: m } = $(), [C, u] = a.useState(!1), b = o.palette.mode === "dark", r = i || h, g = r || s ? 1 : 2;
696
- a.useEffect(() => {
694
+ ], $t = ({ onInsightCardClick: n }) => {
695
+ const o = wt(), { onEvent: t } = H(), { isMobile: s, isDesktop: a, isLargeDesktop: h } = K(), { beatStore: d, endpoint: c, sessionToken: l } = ve(), { isInitialized: m } = P(), [C, u] = i.useState(!1), b = o.palette.mode === "dark", r = a || h, g = r || s ? 1 : 2;
696
+ i.useEffect(() => {
697
697
  m && d.loadBeats().finally(() => u(!0));
698
698
  }, [m]);
699
- const T = a.useMemo(() => C ? d.getFilteredBeats({ templates: jt }) : [], [C]), p = () => null, w = (I) => {
700
- n?.(I), t(y.TRENDS_CLICK_INSIGHT, M);
701
- }, D = r ? 200 : 170, E = r ? 170 : 124, k = T.length > 0 ? D : E;
702
- return /* @__PURE__ */ e(Et, { sx: { height: k }, children: /* @__PURE__ */ e(
703
- ct,
699
+ const T = i.useMemo(() => C ? d.getFilteredBeats({ templates: Kt }) : [], [C]), p = () => null, L = (D) => {
700
+ n?.(D), t(y.TRENDS_CLICK_INSIGHT, A);
701
+ }, w = r ? 200 : 170, I = r ? 170 : 124, k = T.length > 0 ? w : I;
702
+ return /* @__PURE__ */ e(Dt, { sx: { height: k }, children: /* @__PURE__ */ e(
703
+ at,
704
704
  {
705
705
  areBeatsLoading: d.isLoading,
706
706
  beats: T,
707
- endpoint: l,
707
+ endpoint: c,
708
708
  logOutUser: p,
709
- onCardClick: w,
709
+ onCardClick: L,
710
710
  showBorder: !0,
711
711
  showCTAColocatedWithText: !1,
712
712
  showCarouselControls: !0,
713
713
  showHeader: r,
714
714
  showIcon: !0,
715
715
  showWithMargin: !1,
716
- token: c,
716
+ token: l,
717
717
  useDarkMode: b,
718
718
  userHasFullInsightFeedBeats: !1,
719
719
  variant: "outlined",
720
720
  visibleCardsCount: g
721
721
  }
722
722
  ) });
723
- }, Ut = A(Yt), Xt = A(({ chartLabel: n, chartColor: o }) => {
724
- const { onEvent: t } = N(), {
725
- categoryDetailsChartData: { monthlyAmounts: s, tooltipLabels: i }
726
- } = ee();
723
+ }, jt = M($t), Yt = M(({ chartLabel: n, chartColor: o }) => {
724
+ const { onEvent: t } = H(), {
725
+ categoryDetailsChartData: { monthlyAmounts: s, tooltipLabels: a }
726
+ } = q();
727
727
  return /* @__PURE__ */ e(_, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
728
728
  ye,
729
729
  {
730
730
  baseline: "min",
731
731
  colors: [o],
732
732
  curveType: "bump",
733
- customTooltipLabels: i,
733
+ customTooltipLabels: a,
734
734
  datasets: [s],
735
735
  height: 265,
736
736
  labels: [n],
@@ -738,7 +738,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
738
738
  stroke: o
739
739
  }),
740
740
  onItemClick: () => {
741
- t(y.TRENDS_CLICK_CHART, M);
741
+ t(y.TRENDS_CLICK_CHART, A);
742
742
  },
743
743
  showArea: !0,
744
744
  showAverage: !0,
@@ -753,47 +753,47 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
753
753
  valueFormatterString: "0,0"
754
754
  }
755
755
  ) });
756
- }), Zt = A(({ onClose: n }) => {
757
- const o = He(), { onEvent: t } = N(), { common: s, trends: i } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: d } = ee(), { sortedTransactions: l } = ie(), [c, m] = a.useState(null);
756
+ }), Ut = M(({ onClose: n }) => {
757
+ const o = Ne(), { onEvent: t } = H(), { common: s, trends: a } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: d } = q(), { sortedTransactions: c } = ae(), [l, m] = i.useState(null);
758
758
  if (!h)
759
759
  return null;
760
- const { guid: C, name: u, is_income: b, totalAmount: r } = h, g = b ? i.category_income : i.category_spending, T = xt(C, o), p = b ? i.income_label : i.spending_label, w = ` ${h.transactions.length === 1 ? i.transaction : i.transactions} (${h.transactions.length})`, D = a.useMemo(
761
- () => l.find((I) => I.guid === c),
762
- [c, l]
763
- ), E = (I) => I.category_guid === C || I.top_level_category_guid === C, k = () => {
764
- n?.(), t(y.TRENDS_CLICK_BACK, M);
760
+ const { guid: C, name: u, is_income: b, totalAmount: r } = h, g = b ? a.category_income : a.category_spending, T = Et(C, o), p = b ? a.income_label : a.spending_label, L = ` ${h.transactions.length === 1 ? a.transaction : a.transactions} (${h.transactions.length})`, w = i.useMemo(
761
+ () => c.find((D) => D.guid === l),
762
+ [l, c]
763
+ ), I = (D) => D.category_guid === C || D.top_level_category_guid === C, k = () => {
764
+ n?.(), t(y.TRENDS_CLICK_BACK, A);
765
765
  };
766
766
  return /* @__PURE__ */ f(
767
767
  fe,
768
768
  {
769
- ariaLabelClose: i.close_category_details,
769
+ ariaLabelClose: a.close_category_details,
770
770
  isOpen: !0,
771
771
  onClose: k,
772
772
  shouldShowHeaderShadow: !0,
773
773
  title: g,
774
774
  children: [
775
775
  /* @__PURE__ */ f(_, { sx: { alignItems: "center", height: "100%" }, children: [
776
- /* @__PURE__ */ f(Lt, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
776
+ /* @__PURE__ */ f(It, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
777
777
  /* @__PURE__ */ e(
778
778
  Ee,
779
779
  {
780
780
  leftIcon: /* @__PURE__ */ e(Te, { categoryGuid: C }),
781
- rightContent: Z(Math.abs(r), "0,0.00"),
781
+ rightContent: U(Math.abs(r), "0,0.00"),
782
782
  subtitle: d,
783
783
  title: u
784
784
  }
785
785
  ),
786
- /* @__PURE__ */ e(Xt, { chartColor: T, chartLabel: p }),
786
+ /* @__PURE__ */ e(Yt, { chartColor: T, chartLabel: p }),
787
787
  /* @__PURE__ */ f(_, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
788
- /* @__PURE__ */ e(Q, { bold: !0, variant: "body1", children: w }),
789
- /* @__PURE__ */ e(vt, { filter: E })
788
+ /* @__PURE__ */ e(X, { bold: !0, variant: "body1", children: L }),
789
+ /* @__PURE__ */ e(Lt, { filter: I })
790
790
  ] })
791
791
  ] }),
792
792
  /* @__PURE__ */ e(
793
793
  ke,
794
794
  {
795
795
  bgcolor: "transparent",
796
- filter: E,
796
+ filter: I,
797
797
  height: "calc(100vh - 475px)",
798
798
  onClick: m
799
799
  }
@@ -803,39 +803,39 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
803
803
  fe,
804
804
  {
805
805
  ariaLabelClose: s.close_aria,
806
- isOpen: !!D,
806
+ isOpen: !!w,
807
807
  onClose: () => m(""),
808
- title: i.transaction,
809
- children: D && /* @__PURE__ */ e(Re, { transaction: D })
808
+ title: a.transaction,
809
+ children: w && /* @__PURE__ */ e(Re, { transaction: w })
810
810
  }
811
811
  )
812
812
  ]
813
813
  }
814
814
  );
815
- }), Qt = (n, o) => {
815
+ }), Xt = (n, o) => {
816
816
  const t = xe(n, o), s = Le(n, o);
817
- return [t, s].filter((i) => i.length > 0);
818
- }, qt = (n, o) => {
819
- const [t, s] = n, i = t, h = s ?? t, d = [];
820
- if (i) {
821
- const l = i.reduce((c, m) => c + m.y, 0);
822
- d.push({ label: o.income_label, amount: l });
817
+ return [t, s].filter((a) => a.length > 0);
818
+ }, Zt = (n, o) => {
819
+ const [t, s] = n, a = t, h = s ?? t, d = [];
820
+ if (a) {
821
+ const c = a.reduce((l, m) => l + m.y, 0);
822
+ d.push({ label: o.income_label, amount: c });
823
823
  }
824
824
  if (h) {
825
- const l = h.reduce((c, m) => c + m.y, 0);
826
- d.push({ label: o.spending_label, amount: l });
825
+ const c = h.reduce((l, m) => l + m.y, 0);
826
+ d.push({ label: o.spending_label, amount: c });
827
827
  }
828
828
  return d;
829
- }, Jt = ({
829
+ }, Qt = ({
830
830
  availableHeight: n = 0,
831
831
  minHeight: o = 500,
832
832
  selectedDateRange: t,
833
833
  totals: s
834
834
  }) => {
835
- const i = Ne(), { onEvent: h } = N(), { trends: d } = R(), { isSmallMobile: l, isMobile: c, isSmallTablet: m, isTablet: C } = j(), u = [i.palette.chart?.chart1, i.palette.chart?.chart2], b = Qt(s, t), r = qt(b, d), [g, T] = a.useState(0), p = 458, w = 195, D = 56, E = c || l ? w : m || C ? p : g;
836
- return a.useEffect(() => {
837
- const I = Math.max(n - D, o);
838
- T(I);
835
+ const a = He(), { onEvent: h } = H(), { trends: d } = R(), { isSmallMobile: c, isMobile: l, isSmallTablet: m, isTablet: C } = K(), u = [a.palette.chart?.chart1, a.palette.chart?.chart2], b = Xt(s, t), r = Zt(b, d), [g, T] = i.useState(0), p = 458, L = 195, w = 56, I = l || c ? L : m || C ? p : g;
836
+ return i.useEffect(() => {
837
+ const D = Math.max(n - w, o);
838
+ T(D);
839
839
  }, [n]), /* @__PURE__ */ e(
840
840
  ye,
841
841
  {
@@ -843,10 +843,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
843
843
  colors: u,
844
844
  curveType: "bump",
845
845
  datasets: b,
846
- height: E,
846
+ height: I,
847
847
  labels: r,
848
848
  onItemClick: () => {
849
- h(y.TRENDS_CLICK_CHART, M);
849
+ h(y.TRENDS_CLICK_CHART, A);
850
850
  },
851
851
  showArea: !0,
852
852
  showAxisHighlight: !0,
@@ -859,172 +859,170 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
859
859
  valueFormatterString: "0,0"
860
860
  }
861
861
  );
862
- }, en = A(Jt), tn = ({ onBackClick: n, onInsightCardClick: o, sx: t }) => {
863
- const { onEvent: s } = N(), { config: i } = st(), { isLargeDesktop: h, isDesktop: d, isMobile: l } = j(), { visibleAccounts: c } = ce(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = K(), { setFilter: b } = ie(), { selectedDateRange: r, setSelectedCategoryData: g, setSelectedDateRange: T } = ee(), {
862
+ }, qt = M(Qt), Jt = ({ onBackClick: n, onInsightCardClick: o, sx: t }) => {
863
+ const { onEvent: s } = H(), { config: a } = nt(), { isLargeDesktop: h, isDesktop: d, isMobile: c } = K(), { visibleAccounts: l } = ie(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = F(), { setFilter: b } = ae(), { selectedDateRange: r, setSelectedCategoryData: g, setSelectedDateRange: T } = q(), {
864
864
  isCopyLoaded: p,
865
- isInitialized: w,
866
- selectedAccounts: D,
867
- selectedAccountGuids: E,
865
+ isInitialized: L,
866
+ selectedAccounts: w,
867
+ selectedAccountGuids: I,
868
868
  setSelectedAccounts: k
869
- } = $(), { trends: I } = R(), H = Ue(), L = d || h, [x, z] = a.useState(!1), [le, F] = a.useState(!1), [Y, de] = a.useState("Chart"), [P, te] = a.useState(""), [he, ne] = a.useState(!1), [oe, ue] = a.useState(window.innerHeight), se = oe - 208, me = oe - (H ? 494 : 266);
870
- a.useEffect(() => {
871
- const v = () => ue(window.innerHeight);
869
+ } = P(), { trends: D } = R(), N = je(), x = d || h, [E, $] = i.useState(!1), [z, ce] = i.useState("Chart"), [J, ee] = i.useState(""), [te, ne] = i.useState(!1), [oe, le] = i.useState(window.innerHeight), se = oe - 208, de = oe - (N ? 494 : 266);
870
+ i.useEffect(() => {
871
+ const v = () => le(window.innerHeight);
872
872
  return window.addEventListener("resize", v), () => window.removeEventListener("resize", v);
873
- }, []), a.useEffect(() => {
874
- k(c);
875
- }, [c]), a.useEffect(() => {
876
- w && c?.length ? (F(!1), m(D, r.start, r.end).then(() => {
873
+ }, []), i.useEffect(() => {
874
+ k(l);
875
+ }, [l]), i.useEffect(() => {
876
+ L && m(w, r.start, r.end).then(() => {
877
877
  C(
878
- D,
878
+ w,
879
879
  r.start,
880
880
  r.end
881
881
  );
882
882
  }).finally(() => {
883
- z(!0), s(y.TRENDS_LOAD_WIDGET, {
884
- ...M,
885
- time_period: `${re(r.end, r.start)}M`
883
+ $(!0), s(y.TRENDS_LOAD_WIDGET, {
884
+ ...A,
885
+ time_period: `${Ce(r.end, r.start)}M`
886
886
  });
887
- })) : w && !c?.length && (F(!0), z(!0), s(y.TRENDS_LOAD_WIDGET, {
888
- ...M,
889
- time_period: `${re(r.end, r.start)}M`
890
- }));
891
- }, [w, D, r]), a.useEffect(() => {
892
- w && !c?.length ? F(!0) : c?.length && F(!1);
893
- }, [w, c]), a.useEffect(() => {
887
+ });
888
+ }, [L, w, r]), i.useEffect(() => {
894
889
  if (u.length !== 0) {
895
890
  const v = {
896
- accounts: E,
891
+ accounts: I,
897
892
  dateRange: { start: r.start, end: r.end }
898
893
  };
899
894
  b({
900
895
  ...v,
901
896
  custom: (V) => !!u.find(
902
- (U) => U.top_level_category_guid === V.top_level_category_guid || U.category_guid === V.category_guid
897
+ (j) => j.top_level_category_guid === V.top_level_category_guid || j.category_guid === V.category_guid
903
898
  )
904
899
  });
905
900
  }
906
901
  }, [u]);
907
- const ge = (v) => {
902
+ const he = (v) => {
908
903
  g(v), ne(!0);
909
- }, S = () => {
904
+ }, ue = () => {
910
905
  g(null), ne(!1);
911
- }, W = (v, V) => {
912
- de(V ?? Y), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
913
- ...M,
906
+ }, me = (v, V) => {
907
+ ce(V ?? z), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
908
+ ...A,
914
909
  toggleView: V
915
910
  });
916
- }, G = (v) => {
917
- const V = Ie(v?.[0], 1), U = v?.[1], Fe = re(U, V);
918
- T({ start: V, end: U }), s(y.TRENDS_CLICK_TIME_WINDOW, {
919
- ...M,
920
- time_period: Fe + "M"
911
+ }, S = (v) => {
912
+ const V = Ie(v?.[0], 1), j = v?.[1], Be = Ce(j, V);
913
+ T({ start: V, end: j }), s(y.TRENDS_CLICK_TIME_WINDOW, {
914
+ ...A,
915
+ time_period: Be + "M"
921
916
  });
922
- }, pe = (v) => {
917
+ }, W = (v) => {
923
918
  s(y.TRENDS_CLICK_FILTER, {
924
- ...M,
919
+ ...A,
925
920
  filterValue: v
926
921
  });
927
- }, Ge = (v) => {
928
- te(v);
929
- }, Be = () => {
930
- te(""), s(y.TRENDS_CLICK_ALL_CATEGORIES, M);
931
- }, ze = i.show_connections_widget_in_master ? "buttons" : "no-buttons";
932
- return !p || !x ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ e(
922
+ }, G = (v) => {
923
+ ee(v);
924
+ }, ge = () => {
925
+ ee(""), s(y.TRENDS_CLICK_ALL_CATEGORIES, A);
926
+ }, Ge = a.show_connections_widget_in_master ? "buttons" : "no-buttons";
927
+ return !p || !E ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ f(
933
928
  Ae,
934
929
  {
935
- accountOptions: c,
936
- calendarActions: { onRangeChanged: G },
930
+ accountOptions: l,
931
+ calendarActions: { onRangeChanged: S },
937
932
  dateRange: r,
938
- dateRangeVariant: l ? "timeframetabs" : "timeframebuttons",
939
- onAccountsFilterClick: pe,
933
+ dateRangeVariant: c ? "timeframetabs" : "timeframebuttons",
934
+ onAccountsFilterClick: W,
940
935
  onBackClick: n,
941
936
  sx: t,
942
- title: I.title,
943
- children: le ? /* @__PURE__ */ e(
944
- Mt,
945
- {
946
- header: I.zero_state_content_header,
947
- icon: "",
948
- onClick: () => {
949
- },
950
- primaryButton: I.empty_state_primary,
951
- subText: I.empty_state_sub_text,
952
- sx: { height: se },
953
- variant: ze
954
- }
955
- ) : /* @__PURE__ */ f(
956
- _,
957
- {
958
- sx: {
959
- px: l ? 0 : 48
960
- },
961
- children: [
962
- /* @__PURE__ */ f(
963
- _,
964
- {
965
- flexDirection: "row",
966
- justifyContent: "space-between",
967
- sx: { pb: l ? 12 : 24, pt: l ? 24 : 48 },
968
- children: [
969
- /* @__PURE__ */ e(
970
- Oe,
937
+ title: D.title,
938
+ children: [
939
+ E && l.length > 0 && /* @__PURE__ */ f(
940
+ _,
941
+ {
942
+ sx: {
943
+ px: c ? 0 : 48
944
+ },
945
+ children: [
946
+ /* @__PURE__ */ f(
947
+ _,
948
+ {
949
+ flexDirection: "row",
950
+ justifyContent: "space-between",
951
+ sx: { pb: c ? 12 : 24, pt: c ? 24 : 48 },
952
+ children: [
953
+ /* @__PURE__ */ e(
954
+ Oe,
955
+ {
956
+ selectedCategoryGuid: J,
957
+ selectedDateRange: r
958
+ }
959
+ ),
960
+ /* @__PURE__ */ e(We, { onTabChange: me, selectedTab: z })
961
+ ]
962
+ }
963
+ ),
964
+ /* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: J && /* @__PURE__ */ f(pe, { onClick: ge, sx: { p: 0, pr: 5 }, children: [
965
+ /* @__PURE__ */ e(re, { name: "arrow_back" }),
966
+ D.all_categories
967
+ ] }) }) }),
968
+ /* @__PURE__ */ f(_, { flexDirection: x ? "row" : "column", gap: x ? 48 : 16, children: [
969
+ z === "Chart" && /* @__PURE__ */ f(ze, { children: [
970
+ /* @__PURE__ */ e(O, { sx: { width: x ? "68%" : "100%" }, children: /* @__PURE__ */ e(
971
+ qt,
971
972
  {
972
- selectedCategoryGuid: P,
973
- selectedDateRange: r
973
+ availableHeight: se,
974
+ minHeight: 450,
975
+ selectedDateRange: r,
976
+ totals: u
974
977
  }
975
- ),
976
- /* @__PURE__ */ e(We, { onTabChange: W, selectedTab: Y })
977
- ]
978
- }
979
- ),
980
- /* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: P && /* @__PURE__ */ f(Ce, { onClick: Be, sx: { p: 0, pr: 5 }, children: [
981
- /* @__PURE__ */ e(ae, { name: "arrow_back" }),
982
- I.all_categories
983
- ] }) }) }),
984
- /* @__PURE__ */ f(_, { flexDirection: L ? "row" : "column", gap: L ? 48 : 16, children: [
985
- Y === "Chart" && /* @__PURE__ */ f(Pe, { children: [
986
- /* @__PURE__ */ e(O, { sx: { width: L ? "68%" : "100%" }, children: /* @__PURE__ */ e(
987
- en,
978
+ ) }),
979
+ /* @__PURE__ */ f(_, { gap: 16, sx: { width: x ? "32%" : "100%" }, children: [
980
+ N && /* @__PURE__ */ e(jt, { onInsightCardClick: o }),
981
+ /* @__PURE__ */ e(
982
+ Pt,
983
+ {
984
+ availableHeight: de,
985
+ onCategoryClick: he
986
+ }
987
+ )
988
+ ] })
989
+ ] }),
990
+ z === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
991
+ Ve,
988
992
  {
989
- availableHeight: se,
990
- minHeight: 450,
991
- selectedDateRange: r,
992
- totals: u
993
+ height: "unset",
994
+ monthlyCategoryTotals: u,
995
+ onClickRow: G,
996
+ selectedCategory: J,
997
+ selectedDateRange: r
993
998
  }
994
- ) }),
995
- /* @__PURE__ */ f(_, { gap: 16, sx: { width: L ? "32%" : "100%" }, children: [
996
- H && /* @__PURE__ */ e(Ut, { onInsightCardClick: o }),
997
- /* @__PURE__ */ e(
998
- $t,
999
- {
1000
- availableHeight: me,
1001
- onCategoryClick: ge
1002
- }
1003
- )
1004
- ] })
999
+ ) })
1005
1000
  ] }),
1006
- Y === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
1007
- Ve,
1008
- {
1009
- height: "unset",
1010
- monthlyCategoryTotals: u,
1011
- onClickRow: Ge,
1012
- selectedCategory: P,
1013
- selectedDateRange: r
1014
- }
1015
- ) })
1016
- ] }),
1017
- he && /* @__PURE__ */ e(Zt, { onClose: S })
1018
- ]
1019
- }
1020
- )
1001
+ te && /* @__PURE__ */ e(Ut, { onClose: ue })
1002
+ ]
1003
+ }
1004
+ ),
1005
+ E && l.length === 0 && /* @__PURE__ */ e(
1006
+ xt,
1007
+ {
1008
+ header: D.zero_state_content_header,
1009
+ icon: "",
1010
+ onClick: () => {
1011
+ },
1012
+ primaryButton: D.empty_state_primary,
1013
+ subText: D.empty_state_sub_text,
1014
+ sx: { height: se },
1015
+ variant: Ge
1016
+ }
1017
+ )
1018
+ ]
1021
1019
  }
1022
1020
  );
1023
- }, qn = A(tn);
1021
+ }, Zn = M(Jt);
1024
1022
  export {
1025
- Xn as TrendsFullWidget,
1026
- Qn as TrendsMicroWidget,
1027
- Zn as TrendsMiniWidget,
1028
- to as TrendsStore,
1029
- qn as TrendsWidget
1023
+ Yn as TrendsFullWidget,
1024
+ Xn as TrendsMicroWidget,
1025
+ Un as TrendsMiniWidget,
1026
+ Jn as TrendsStore,
1027
+ Zn as TrendsWidget
1030
1028
  };