@mx-cartographer/experiences 7.0.23-alpha.al8 → 7.0.23-alpha.al9

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