@mx-cartographer/experiences 7.2.12 → 7.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,82 +1,83 @@
1
- import { jsxs as m, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as h, jsx as t, Fragment as mt } from "react/jsx-runtime";
2
2
  import p from "react";
3
- import { observer as x } from "mobx-react-lite";
3
+ import { observer as v } from "mobx-react-lite";
4
4
  import { startOfMonth as nt } from "date-fns/startOfMonth";
5
5
  import { endOfMonth as ot } from "date-fns/endOfMonth";
6
- import D from "@mui/material/Box";
6
+ import x from "@mui/material/Box";
7
7
  import C from "@mui/material/Stack";
8
8
  import N from "@mui/material/Tab";
9
9
  import at from "@mui/material/Tabs";
10
- import mt from "@mui/material/styles/useTheme";
10
+ import ht from "@mui/material/styles/useTheme";
11
11
  import { b as V } from "../CategoryUtil-BR3H5i6n.mjs";
12
- import { b } from "../Category-CevNQ03n.mjs";
13
- import { Text as f, CategoryIcon as ht, CategoryIconVariants as ft } from "@mxenabled/mxui";
14
- import { f as A } from "../NumberFormatting-Buh7u8Oi.mjs";
15
- import yt from "@mui/material/Button";
12
+ import { b as S } from "../Category-CevNQ03n.mjs";
13
+ import { Text as y, CategoryIcon as ft, CategoryIconVariants as yt } from "@mxenabled/mxui";
14
+ import { f as w } from "../NumberFormatting-Buh7u8Oi.mjs";
15
+ import { u as bt } from "../useAriaLive-B3_pRUio.mjs";
16
+ import Ct from "@mui/material/Button";
16
17
  import { useTheme as it } from "@mui/material";
17
- import { u as w, b as R, m as z, d as rt, a as st, h as Ct, g as _t } from "../hooks-D6XlXHf4.mjs";
18
- import { u as ct } from "../useScreenSize-B6JyS_Lj.mjs";
19
- import { D as bt } from "../Donut-1UMNcG67.mjs";
18
+ import { u as I, b as R, m as z, d as rt, a as st, h as _t, g as St } from "../hooks-D6XlXHf4.mjs";
19
+ import { u as lt } from "../useScreenSize-B6JyS_Lj.mjs";
20
+ import { D as Tt } from "../Donut-oaQFlbit.mjs";
20
21
  import { L as F } from "../Loader-DUaFpDGv.mjs";
21
- import { M as St } from "../MiniWidgetContainer-D0gfmbaF.mjs";
22
+ import { M as Mt } from "../MiniWidgetContainer-D0gfmbaF.mjs";
22
23
  import { startOfToday as U } from "date-fns/startOfToday";
23
- import { T as Tt, a as Mt } from "../TransactionDetails-DW7T0W0z.mjs";
24
- import Dt from "@mui/material/Collapse";
24
+ import { T as Dt, a as xt } from "../TransactionDetails-DW7T0W0z.mjs";
25
+ import wt from "@mui/material/Collapse";
25
26
  import B from "@mui/material/Divider";
26
27
  import q from "@mui/material/List";
27
28
  import J from "@mui/material/ListItem";
28
- import xt from "@mui/material/ListItemButton";
29
+ import vt from "@mui/material/ListItemButton";
29
30
  import { D as Q } from "../Drawer-kEE73B87.mjs";
30
- import { A as Z, W as wt } from "../WidgetContainer-C88Ecu2W.mjs";
31
- const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
32
- if (c.total > 0) {
33
- const a = n.find((s) => s.guid === c.category_guid);
34
- if (!a) return i;
35
- const o = a.parent_guid ?? a.guid, e = n.find((s) => s.guid === o);
36
- if (!e) return i;
31
+ import { A as Z, W as It } from "../WidgetContainer-C88Ecu2W.mjs";
32
+ const j = 5, Et = (n, c, r) => r.reduce((l, a) => {
33
+ if (a.total > 0) {
34
+ const i = n.find((s) => s.guid === a.category_guid);
35
+ if (!i) return l;
36
+ const o = i.parent_guid ?? i.guid, e = n.find((s) => s.guid === o);
37
+ if (!e) return l;
37
38
  const d = {
38
- guid: a.guid,
39
- name: a.guid === o ? `General ${a.name}` : a.name,
40
- color: V(e.guid, l),
41
- amount: c.total
42
- }, u = i.find((s) => s.guid === o);
43
- u ? (u.amount += c.total, u.categoryTotals?.push(d)) : i.push({
39
+ guid: i.guid,
40
+ name: i.guid === o ? `General ${i.name}` : i.name,
41
+ color: V(e.guid, c),
42
+ amount: a.total
43
+ }, u = l.find((s) => s.guid === o);
44
+ u ? (u.amount += a.total, u.categoryTotals?.push(d)) : l.push({
44
45
  guid: o,
45
46
  name: e.name,
46
- color: V(e.guid, l),
47
+ color: V(e.guid, c),
47
48
  categoryTotals: [d],
48
- amount: c.total
49
+ amount: a.total
49
50
  });
50
51
  }
51
- return i;
52
- }, []), lt = (n, l, r, i) => {
53
- const c = vt(n, r, i), a = c.filter(
54
- (s) => s.guid !== b.INCOME && s.guid !== b.INVESTMENTS && s.guid !== b.TRANSFER
55
- ).sort((s, g) => g.amount - s.amount), o = a.reduce(
56
- (s, g) => s + g.amount,
52
+ return l;
53
+ }, []), ct = (n, c, r, l) => {
54
+ const a = Et(n, r, l), i = a.filter(
55
+ (s) => s.guid !== S.INCOME && s.guid !== S.INVESTMENTS && s.guid !== S.TRANSFER
56
+ ).sort((s, m) => m.amount - s.amount), o = i.reduce(
57
+ (s, m) => s + m.amount,
57
58
  0
58
- ), e = a.length > j ? j : a.length, d = a.slice(0, e), u = d.map((s) => ({
59
+ ), e = i.length > j ? j : i.length, d = i.slice(0, e), u = d.map((s) => ({
59
60
  id: s.guid,
60
61
  color: V(s.guid, r),
61
62
  label: s.name,
62
63
  value: s.amount / o * 100
63
64
  }));
64
- if (a.length > 5) {
65
- const s = a.slice(j, c.length), g = s.reduce(
66
- (S, _) => S + _.amount,
65
+ if (i.length > 5) {
66
+ const s = i.slice(j, a.length), m = s.reduce(
67
+ (T, g) => T + g.amount,
67
68
  0
68
69
  );
69
70
  d.push({
70
71
  guid: "other",
71
72
  color: r.palette.categories.others || "",
72
- name: l.saving_goal_other,
73
+ name: c.saving_goal_other,
73
74
  categoryTotals: s,
74
- amount: g
75
+ amount: m
75
76
  }), u.push({
76
77
  id: "other",
77
78
  color: r.palette.categories.others || "",
78
- label: l.saving_goal_other,
79
- value: g / o * 100
79
+ label: c.saving_goal_other,
80
+ value: m / o * 100
80
81
  });
81
82
  }
82
83
  return {
@@ -84,106 +85,131 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
84
85
  donutData: u,
85
86
  totalAmount: o
86
87
  };
87
- }, dt = (n, l, r) => {
88
- const i = n.filter(
89
- (e) => e.guid === b.INCOME || e.parent_guid === b.INCOME
90
- ), c = l.filter((e) => i.some((d) => d.guid === e.category_guid)).sort((e, d) => e.total - d.total).map((e, d) => ({
88
+ }, dt = (n, c, r) => {
89
+ const l = n.filter(
90
+ (e) => e.guid === S.INCOME || e.parent_guid === S.INCOME
91
+ ), a = c.filter((e) => l.some((d) => d.guid === e.category_guid)).sort((e, d) => e.total - d.total).map((e, d) => ({
91
92
  guid: e.category_guid,
92
93
  name: n.find((u) => u.guid === e.category_guid)?.name,
93
94
  color: r[d],
94
95
  categoryTotals: [],
95
96
  amount: Math.abs(e.total)
96
- })), a = c.reduce(
97
+ })), i = a.reduce(
97
98
  (e, d) => e + d.amount,
98
99
  0
99
- ), o = c.map((e) => ({
100
+ ), o = a.map((e) => ({
100
101
  id: e.guid,
101
102
  color: e.color,
102
103
  label: e.name,
103
- value: e.amount / a * 100
104
+ value: e.amount / i * 100
104
105
  }));
105
106
  return {
106
- categoryData: c,
107
+ categoryData: a,
107
108
  donutData: o,
108
- totalAmount: a
109
+ totalAmount: i
109
110
  };
110
- }, W = ({ amount: n, label: l }) => /* @__PURE__ */ m(C, { direction: "column", children: [
111
- /* @__PURE__ */ t(f, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: l }),
112
- /* @__PURE__ */ t(f, { variant: "XSmall", children: A(n, "0,0") })
111
+ }, W = ({ amount: n, label: c }) => /* @__PURE__ */ h(C, { direction: "column", children: [
112
+ /* @__PURE__ */ t(y, { bold: !0, sx: { textTransform: "none" }, variant: "Body", children: c }),
113
+ /* @__PURE__ */ t(y, { variant: "XSmall", children: w(n, "0,0") })
113
114
  ] }), At = ({
114
115
  data: n,
115
- isIncome: l = !1,
116
+ isIncome: c = !1,
116
117
  onSelected: r,
117
- onViewTransactions: i,
118
- selectedId: c,
119
- size: a = 150,
118
+ onViewTransactions: l,
119
+ selectedId: a,
120
+ size: i = 150,
120
121
  totalLabel: o,
121
122
  variant: e = "mini"
122
123
  }) => {
123
- const { spending: d } = w(), u = it(), { isTablet: s } = ct(), g = p.useMemo(
124
- () => c ? n.categoryData.find((v) => v.guid === c) : void 0,
125
- [c]
126
- ), S = p.useMemo(() => n.donutData.length > 0 ? n.donutData : [{ id: "0", color: u.palette.divider, value: 100 }], [n, u]), _ = () => {
127
- i?.(c);
128
- }, y = s ? 32 : 48;
129
- return /* @__PURE__ */ t(bt, { data: S, onClick: r, selectedId: c, size: a, children: /* @__PURE__ */ t(C, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ m(C, { alignItems: "center", justifyContent: "center", minHeight: a, minWidth: a, children: [
130
- g && /* @__PURE__ */ m(
131
- C,
132
- {
133
- alignItems: "center",
134
- gap: e === "mini" ? 0 : 8,
135
- mb: e === "mini" ? 0 : 8,
136
- mt: e === "mini" ? 0 : -16,
137
- sx: e === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
138
- children: [
139
- /* @__PURE__ */ t(
140
- ht,
141
- {
142
- categoryGuid: l ? b.INCOME : g.guid,
143
- size: e === "mini" ? 24 : y,
144
- variant: ft.Transparent
145
- }
146
- ),
147
- /* @__PURE__ */ t(f, { color: "secondary", noWrap: !0, variant: e === "mini" ? "Tiny" : "Body", children: g ? g.name : o })
148
- ]
149
- }
150
- ),
151
- !g && e === "full" && /* @__PURE__ */ t(f, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: o }),
152
- /* @__PURE__ */ t(f, { variant: e === "mini" ? "H2" : "H1", children: g ? A(g.amount, "0,0") : A(n.totalAmount, "0,0") }),
153
- !g && e === "mini" && /* @__PURE__ */ t(f, { color: "secondary", noWrap: !0, variant: "Tiny", children: o }),
154
- e === "full" && /* @__PURE__ */ t(
155
- yt,
156
- {
157
- "aria-label": `View ${g?.name || ""} Transactions`,
158
- disabled: n.categoryData.length === 0,
159
- onClick: _,
160
- sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
161
- variant: "text",
162
- children: d.view_transactions
163
- }
164
- )
165
- ] }) }) });
166
- }, O = x(At), tt = ({ data: n, onSelected: l, selectedId: r }) => /* @__PURE__ */ t(C, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: n.categoryData.map((i) => /* @__PURE__ */ m(
167
- C,
168
- {
169
- alignItems: "center",
170
- "aria-label": i.name,
171
- "aria-selected": i.guid === r,
172
- direction: "row",
173
- gap: 8,
174
- onClick: () => l(i.guid),
175
- role: "button",
176
- sx: { cursor: "pointer" },
177
- children: [
178
- /* @__PURE__ */ t(D, { borderRadius: 4, height: 8, sx: { backgroundColor: i.color }, width: 8 }),
179
- /* @__PURE__ */ t(f, { bold: i.guid === r, variant: "XSmall", children: i.name })
180
- ]
181
- },
182
- i.guid
183
- )) }), Et = () => {
184
- const n = mt(), { goals: l, spending: r } = w(), { selectedAccounts: i } = R(), {
185
- categories: c,
186
- dateRangeCategoryTotals: a,
124
+ const { spending: d } = I(), u = it(), { isTablet: s } = lt(), { announce: m, ariaLive: T } = bt(), g = p.useMemo(
125
+ () => a ? n.categoryData.find((D) => D.guid === a) : void 0,
126
+ [a]
127
+ );
128
+ p.useEffect(() => {
129
+ if (g) {
130
+ const D = w(g.amount, "0,0");
131
+ m(`${g.name}: ${D}`);
132
+ }
133
+ }, [g, m]);
134
+ const b = p.useMemo(() => n.donutData.length > 0 ? n.donutData : [{ id: "0", color: u.palette.divider, value: 100 }], [n, u]), E = () => {
135
+ l?.(a);
136
+ }, _ = s ? 32 : 48;
137
+ return /* @__PURE__ */ h(mt, { children: [
138
+ T,
139
+ /* @__PURE__ */ t(Tt, { data: b, onClick: r, selectedId: a, size: i, children: /* @__PURE__ */ t(C, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ h(C, { alignItems: "center", justifyContent: "center", minHeight: i, minWidth: i, children: [
140
+ g && /* @__PURE__ */ h(
141
+ C,
142
+ {
143
+ alignItems: "center",
144
+ gap: e === "mini" ? 0 : 8,
145
+ mb: e === "mini" ? 0 : 8,
146
+ mt: e === "mini" ? 0 : -16,
147
+ sx: e === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
148
+ children: [
149
+ /* @__PURE__ */ t(
150
+ ft,
151
+ {
152
+ categoryGuid: c ? S.INCOME : g.guid,
153
+ size: e === "mini" ? 24 : _,
154
+ variant: yt.Transparent
155
+ }
156
+ ),
157
+ /* @__PURE__ */ t(
158
+ y,
159
+ {
160
+ color: "secondary",
161
+ noWrap: !0,
162
+ variant: e === "mini" ? "Tiny" : "Body",
163
+ children: g ? g.name : o
164
+ }
165
+ )
166
+ ]
167
+ }
168
+ ),
169
+ !g && e === "full" && /* @__PURE__ */ t(y, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: o }),
170
+ /* @__PURE__ */ t(y, { variant: e === "mini" ? "H2" : "H1", children: g ? w(g.amount, "0,0") : w(n.totalAmount, "0,0") }),
171
+ !g && e === "mini" && /* @__PURE__ */ t(y, { color: "secondary", noWrap: !0, variant: "Tiny", children: o }),
172
+ e === "full" && /* @__PURE__ */ t(
173
+ Ct,
174
+ {
175
+ "aria-label": `View ${g?.name || ""} Transactions`,
176
+ disabled: n.categoryData.length === 0,
177
+ onClick: E,
178
+ sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
179
+ variant: "text",
180
+ children: d.view_transactions
181
+ }
182
+ )
183
+ ] }) }) })
184
+ ] });
185
+ }, O = v(At), tt = ({ data: n, onSelected: c, selectedId: r }) => {
186
+ const l = (a, i) => {
187
+ (a.key === "Enter" || a.key === " ") && (a.preventDefault(), c(i));
188
+ };
189
+ return /* @__PURE__ */ t(C, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: n.categoryData.map((a) => /* @__PURE__ */ h(
190
+ C,
191
+ {
192
+ alignItems: "center",
193
+ "aria-label": a.name,
194
+ "aria-pressed": a.guid === r,
195
+ direction: "row",
196
+ gap: 8,
197
+ onClick: () => c(a.guid),
198
+ onKeyDown: (i) => l(i, a.guid),
199
+ role: "button",
200
+ sx: { cursor: "pointer" },
201
+ tabIndex: 0,
202
+ children: [
203
+ /* @__PURE__ */ t(x, { borderRadius: 4, height: 8, sx: { backgroundColor: a.color }, width: 8 }),
204
+ /* @__PURE__ */ t(y, { bold: a.guid === r, variant: "XSmall", children: a.name })
205
+ ]
206
+ },
207
+ a.guid
208
+ )) });
209
+ }, Lt = () => {
210
+ const n = ht(), { goals: c, spending: r } = I(), { selectedAccounts: l } = R(), {
211
+ categories: a,
212
+ dateRangeCategoryTotals: i,
187
213
  dataRangeTotalsLoaded: o,
188
214
  loadDateRangeCategoryTotals: e
189
215
  } = z(), d = p.useMemo(
@@ -199,108 +225,134 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
199
225
  );
200
226
  p.useEffect(() => {
201
227
  e(
202
- i,
228
+ l,
203
229
  nt(/* @__PURE__ */ new Date()),
204
230
  ot(/* @__PURE__ */ new Date())
205
231
  ).finally();
206
- }, [i]);
207
- const [u, s] = p.useState(""), [g, S] = p.useState(0), _ = p.useMemo(
208
- () => lt(c, l, n, a),
209
- [c, a]
210
- ), y = p.useMemo(
211
- () => dt(c, a, d),
212
- [c, a, d]
213
- ), v = (E, L) => {
214
- S(L), s("");
215
- }, M = (E) => {
216
- s(u === E ? "" : E);
232
+ }, [l]);
233
+ const [u, s] = p.useState(""), [m, T] = p.useState(0), g = p.useMemo(
234
+ () => ct(a, c, n, i),
235
+ [a, i]
236
+ ), b = p.useMemo(
237
+ () => dt(a, i, d),
238
+ [a, i, d]
239
+ ), E = (D, L) => {
240
+ T(L), s("");
241
+ }, _ = (D) => {
242
+ s(u === D ? "" : D);
217
243
  };
218
- return o ? /* @__PURE__ */ m(D, { width: "100%", children: [
219
- /* @__PURE__ */ m(at, { onChange: v, value: g, variant: "fullWidth", children: [
220
- /* @__PURE__ */ t(
221
- N,
222
- {
223
- label: /* @__PURE__ */ t(
224
- W,
244
+ return o ? /* @__PURE__ */ h(x, { width: "100%", children: [
245
+ /* @__PURE__ */ h(
246
+ at,
247
+ {
248
+ "aria-label": r.mini_title,
249
+ onChange: E,
250
+ value: m,
251
+ variant: "fullWidth",
252
+ children: [
253
+ /* @__PURE__ */ t(
254
+ N,
225
255
  {
226
- amount: _.totalAmount,
227
- label: r.spend_tab_title
256
+ "aria-controls": "spending-tabpanel",
257
+ id: "spending-tab",
258
+ label: /* @__PURE__ */ t(
259
+ W,
260
+ {
261
+ amount: g.totalAmount,
262
+ label: r.spend_tab_title
263
+ }
264
+ ),
265
+ tabIndex: m === 0 ? 0 : -1
228
266
  }
229
- )
230
- }
231
- ),
232
- /* @__PURE__ */ t(
233
- N,
234
- {
235
- label: /* @__PURE__ */ t(
236
- W,
267
+ ),
268
+ /* @__PURE__ */ t(
269
+ N,
237
270
  {
238
- amount: y.totalAmount,
239
- label: r.income_tab_title
271
+ "aria-controls": "income-tabpanel",
272
+ id: "income-tab",
273
+ label: /* @__PURE__ */ t(
274
+ W,
275
+ {
276
+ amount: b.totalAmount,
277
+ label: r.income_tab_title
278
+ }
279
+ ),
280
+ tabIndex: m === 1 ? 0 : -1
240
281
  }
241
282
  )
242
- }
243
- )
244
- ] }),
245
- g === 0 && /* @__PURE__ */ t(D, { children: /* @__PURE__ */ m(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
246
- /* @__PURE__ */ t(
247
- O,
248
- {
249
- data: _,
250
- onSelected: M,
251
- selectedId: u,
252
- totalLabel: r.total_spending
253
- }
254
- ),
255
- /* @__PURE__ */ t(
256
- tt,
257
- {
258
- data: _,
259
- onSelected: M,
260
- selectedId: u
261
- }
262
- )
263
- ] }) }),
264
- g === 1 && /* @__PURE__ */ t(D, { children: /* @__PURE__ */ m(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
265
- /* @__PURE__ */ t(
266
- O,
267
- {
268
- data: y,
269
- isIncome: !0,
270
- onSelected: M,
271
- selectedId: u,
272
- totalLabel: r.total_income
273
- }
274
- ),
275
- /* @__PURE__ */ t(tt, { data: y, onSelected: M, selectedId: u })
276
- ] }) })
283
+ ]
284
+ }
285
+ ),
286
+ /* @__PURE__ */ t(
287
+ x,
288
+ {
289
+ "aria-labelledby": "spending-tab",
290
+ hidden: m !== 0,
291
+ id: "spending-tabpanel",
292
+ role: "tabpanel",
293
+ children: /* @__PURE__ */ h(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
294
+ /* @__PURE__ */ t(
295
+ O,
296
+ {
297
+ data: g,
298
+ onSelected: _,
299
+ selectedId: u,
300
+ totalLabel: r.total_spending
301
+ }
302
+ ),
303
+ /* @__PURE__ */ t(tt, { data: g, onSelected: _, selectedId: u })
304
+ ] })
305
+ }
306
+ ),
307
+ /* @__PURE__ */ t(
308
+ x,
309
+ {
310
+ "aria-labelledby": "income-tab",
311
+ hidden: m !== 1,
312
+ id: "income-tabpanel",
313
+ role: "tabpanel",
314
+ children: /* @__PURE__ */ h(C, { direction: "row", gap: 16, justifyContent: "center", p: 24, children: [
315
+ /* @__PURE__ */ t(
316
+ O,
317
+ {
318
+ data: b,
319
+ isIncome: !0,
320
+ onSelected: _,
321
+ selectedId: u,
322
+ totalLabel: r.total_income
323
+ }
324
+ ),
325
+ /* @__PURE__ */ t(tt, { data: b, onSelected: _, selectedId: u })
326
+ ] })
327
+ }
328
+ )
277
329
  ] }) : /* @__PURE__ */ t(F, { height: 250 });
278
- }, It = x(Et), Lt = ({ onPrimaryCtaClick: n, sx: l = {} }) => {
279
- const { visibleAccounts: r } = rt(), { spending: i } = w(), { isCopyLoaded: c, isInitialized: a, setSelectedAccounts: o } = R();
330
+ }, Nt = v(Lt), Wt = ({ onPrimaryCtaClick: n, sx: c = {} }) => {
331
+ const { visibleAccounts: r } = rt(), { spending: l } = I(), { isCopyLoaded: a, isInitialized: i, setSelectedAccounts: o } = R();
280
332
  return p.useEffect(() => {
281
333
  o(r);
282
- }, [r]), !c || !a ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
283
- St,
334
+ }, [r]), !a || !i ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
335
+ Mt,
284
336
  {
285
337
  className: "mx-exp-spending-miniwidget",
286
338
  onPrimaryCtaClick: n,
287
- primaryCtaLabel: i.primary_cta,
288
- sx: l,
289
- title: i.mini_title,
290
- children: /* @__PURE__ */ t(It, {})
339
+ primaryCtaLabel: l.primary_cta,
340
+ sx: c,
341
+ title: l.mini_title,
342
+ children: /* @__PURE__ */ t(Nt, {})
291
343
  }
292
344
  );
293
- }, he = x(Lt), Nt = ({
345
+ }, be = v(Wt), Ot = ({
294
346
  data: n,
295
- onSelected: l,
347
+ onSelected: c,
296
348
  selectedId: r = "",
297
- title: i
349
+ title: l
298
350
  }) => {
299
- const { spending: c } = w(), a = n.categoryData.find((o) => o.guid === r);
300
- return /* @__PURE__ */ m(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
301
- /* @__PURE__ */ t(f, { bold: !0, sx: { py: 12 }, children: `${i} ${c.by_category}` }),
351
+ const { spending: a } = I(), i = n.categoryData.find((o) => o.guid === r);
352
+ return /* @__PURE__ */ h(C, { direction: "column", justifyContent: "center", maxWidth: 400, minWidth: 275, width: "100%", children: [
353
+ /* @__PURE__ */ t(y, { bold: !0, sx: { py: 12 }, children: `${l} ${a.by_category}` }),
302
354
  /* @__PURE__ */ t(B, { "aria-hidden": "true" }),
303
- /* @__PURE__ */ t(q, { children: n.categoryData.map((o) => /* @__PURE__ */ m(p.Fragment, { children: [
355
+ /* @__PURE__ */ t(q, { children: n.categoryData.map((o) => /* @__PURE__ */ h(p.Fragment, { children: [
304
356
  /* @__PURE__ */ t(
305
357
  J,
306
358
  {
@@ -309,15 +361,15 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
309
361
  sx: {
310
362
  minHeight: 44
311
363
  },
312
- children: /* @__PURE__ */ m(
313
- xt,
364
+ children: /* @__PURE__ */ h(
365
+ vt,
314
366
  {
315
- "aria-expanded": a?.guid === o.guid,
316
- onClick: () => l(o.guid),
367
+ "aria-expanded": i?.guid === o.guid,
368
+ onClick: () => c(o.guid),
317
369
  sx: { minHeight: 44, px: 8, py: 0 },
318
370
  children: [
319
371
  /* @__PURE__ */ t(
320
- D,
372
+ x,
321
373
  {
322
374
  borderRadius: 4,
323
375
  flexShrink: 0,
@@ -326,7 +378,7 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
326
378
  width: 8
327
379
  }
328
380
  ),
329
- /* @__PURE__ */ m(
381
+ /* @__PURE__ */ h(
330
382
  C,
331
383
  {
332
384
  alignItems: "center",
@@ -334,8 +386,8 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
334
386
  justifyContent: "space-between",
335
387
  width: "100%",
336
388
  children: [
337
- /* @__PURE__ */ t(f, { bold: r === o.guid, children: o.name }),
338
- /* @__PURE__ */ t(f, { bold: r === o.guid, variant: "Body", children: A(o.amount, "0,0") })
389
+ /* @__PURE__ */ t(y, { bold: r === o.guid, children: o.name }),
390
+ /* @__PURE__ */ t(y, { bold: r === o.guid, variant: "Body", children: w(o.amount, "0,0") })
339
391
  ]
340
392
  }
341
393
  )
@@ -345,8 +397,8 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
345
397
  }
346
398
  ),
347
399
  /* @__PURE__ */ t(B, {}),
348
- o.categoryTotals && o.categoryTotals.length > 0 && /* @__PURE__ */ t(Dt, { in: a?.guid === o.guid, unmountOnExit: !0, children: /* @__PURE__ */ m(q, { children: [
349
- a?.categoryTotals?.map((e) => /* @__PURE__ */ t(
400
+ o.categoryTotals && o.categoryTotals.length > 0 && /* @__PURE__ */ t(wt, { in: i?.guid === o.guid, unmountOnExit: !0, children: /* @__PURE__ */ h(q, { children: [
401
+ i?.categoryTotals?.map((e) => /* @__PURE__ */ t(
350
402
  J,
351
403
  {
352
404
  sx: {
@@ -354,12 +406,12 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
354
406
  pr: 8,
355
407
  py: 0
356
408
  },
357
- children: /* @__PURE__ */ m(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
358
- /* @__PURE__ */ m(f, { children: [
409
+ children: /* @__PURE__ */ h(C, { direction: "row", justifyContent: "space-between", width: "100%", children: [
410
+ /* @__PURE__ */ h(y, { children: [
359
411
  e.name,
360
412
  " "
361
413
  ] }),
362
- /* @__PURE__ */ t(f, { children: A(e.amount, "0,0") })
414
+ /* @__PURE__ */ t(y, { children: w(e.amount, "0,0") })
363
415
  ] })
364
416
  },
365
417
  e.guid
@@ -367,17 +419,17 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
367
419
  /* @__PURE__ */ t(B, {})
368
420
  ] }) })
369
421
  ] }, o.guid)) }),
370
- /* @__PURE__ */ t(f, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${c.total}: ${A(n.totalAmount, "0,0")}` })
422
+ /* @__PURE__ */ t(y, { bold: !0, sx: { mt: 12, pr: 8, textAlign: "right" }, children: `${a.total}: ${w(n.totalAmount, "0,0")}` })
371
423
  ] });
372
- }, Wt = x(Nt), Ot = ({
424
+ }, Rt = v(Ot), kt = ({
373
425
  data: n,
374
- onSelected: l,
426
+ onSelected: c,
375
427
  onViewTransactions: r,
376
- selectedId: i,
377
- title: c
428
+ selectedId: l,
429
+ title: a
378
430
  }) => {
379
- const { isDesktop: a, isMobile: o } = ct(), { isLoadingCategoryTotals: e } = z(), { spending: d } = w();
380
- return /* @__PURE__ */ m(
431
+ const { isDesktop: i, isMobile: o } = lt(), { isLoadingCategoryTotals: e } = z(), { spending: d } = I();
432
+ return /* @__PURE__ */ h(
381
433
  C,
382
434
  {
383
435
  alignItems: o ? "center" : "flex-start",
@@ -398,7 +450,7 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
398
450
  onSelected: () => {
399
451
  },
400
452
  selectedId: "",
401
- size: a ? 400 : 300,
453
+ size: i ? 400 : 300,
402
454
  totalLabel: "Loading ...",
403
455
  variant: "full"
404
456
  }
@@ -407,19 +459,19 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
407
459
  O,
408
460
  {
409
461
  data: n,
410
- onSelected: l,
462
+ onSelected: c,
411
463
  onViewTransactions: r,
412
- selectedId: i,
413
- size: a ? 400 : 300,
464
+ selectedId: l,
465
+ size: i ? 400 : 300,
414
466
  totalLabel: d.total_amount,
415
467
  variant: "full"
416
468
  }
417
469
  ),
418
- /* @__PURE__ */ t(Wt, { data: n, onSelected: l, selectedId: i, title: c })
470
+ /* @__PURE__ */ t(Rt, { data: n, onSelected: c, selectedId: l, title: a })
419
471
  ]
420
472
  }
421
473
  );
422
- }, et = x(Ot), Rt = (n) => [
474
+ }, et = v(kt), $t = (n) => [
423
475
  n.palette.chartMono.chartMono5,
424
476
  n.palette.chartMono.chartMono4,
425
477
  n.palette.chartMono.chartMono3,
@@ -427,61 +479,61 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
427
479
  n.palette.chartMono.chartMono1,
428
480
  n.palette.chartMono.chartMono6
429
481
  ], Gt = () => {
430
- const n = it(), { clientConfig: l } = st(), { categories: r, dateRangeCategoryTotals: i, loadDateRangeCategoryTotals: c } = z(), { goals: a, spending: o } = w(), { displayedDateRange: e, selectedAccounts: d, selectedAccountGuids: u } = R(), { setFilter: s, sortedTransactions: g } = Ct(), S = l?.master?.deep_link_params?.account_guids, _ = l?.master?.deep_link_params?.view, [y, v] = p.useState(""), [M, E] = p.useState(_ === "income" ? 1 : 0), [L, H] = p.useState(""), [gt, P] = p.useState(!1);
482
+ const n = it(), { clientConfig: c } = st(), { categories: r, dateRangeCategoryTotals: l, loadDateRangeCategoryTotals: a } = z(), { goals: i, spending: o } = I(), { displayedDateRange: e, selectedAccounts: d, selectedAccountGuids: u } = R(), { setFilter: s, sortedTransactions: m } = _t(), T = c?.master?.deep_link_params?.account_guids, g = c?.master?.deep_link_params?.view, [b, E] = p.useState(""), [_, D] = p.useState(g === "income" ? 1 : 0), [L, H] = p.useState(""), [gt, P] = p.useState(!1);
431
483
  p.useEffect(() => {
432
- c(
484
+ a(
433
485
  d,
434
486
  e.start,
435
487
  e.end
436
488
  ).finally();
437
489
  }, [d, e]);
438
- const G = p.useMemo(
439
- () => lt(r, a, n, i),
440
- [r, i]
441
- ), X = p.useMemo(
442
- () => dt(r, i, Rt(n)),
443
- [r, i]
444
- ), k = p.useMemo(
445
- () => g.find((h) => h.guid === L),
446
- [L, g]
447
- ), ut = (h, I) => {
448
- E(I), v("");
449
- }, Y = (h) => {
450
- v(y === h || h === "0" ? "" : h);
451
- }, K = (h) => {
452
- const I = {
453
- accounts: S || u,
490
+ const k = p.useMemo(
491
+ () => ct(r, i, n, l),
492
+ [r, l]
493
+ ), K = p.useMemo(
494
+ () => dt(r, l, $t(n)),
495
+ [r, l]
496
+ ), $ = p.useMemo(
497
+ () => m.find((f) => f.guid === L),
498
+ [L, m]
499
+ ), ut = (f, A) => {
500
+ D(A), E("");
501
+ }, X = (f) => {
502
+ E(b === f || f === "0" ? "" : f);
503
+ }, Y = (f) => {
504
+ const A = {
505
+ accounts: T || u,
454
506
  dateRange: e
455
507
  };
456
- if (M === 0)
457
- if (h === "other") {
458
- const T = G.categoryData.find(($) => $.guid === "other");
508
+ if (_ === 0)
509
+ if (f === "other") {
510
+ const M = k.categoryData.find((G) => G.guid === "other");
459
511
  s({
460
- ...I,
461
- custom: ($) => !!T?.categoryTotals?.find((pt) => pt.guid === $.top_level_category_guid)
512
+ ...A,
513
+ custom: (G) => !!M?.categoryTotals?.find((pt) => pt.guid === G.top_level_category_guid)
462
514
  });
463
515
  } else
464
516
  s({
465
- ...I,
466
- custom: (T) => h ? T.top_level_category_guid === h : T.top_level_category_guid !== b.INCOME && T.top_level_category_guid !== b.INVESTMENTS && T.top_level_category_guid !== b.TRANSFER,
467
- showSplits: !!h
517
+ ...A,
518
+ custom: (M) => f ? M.top_level_category_guid === f : M.top_level_category_guid !== S.INCOME && M.top_level_category_guid !== S.INVESTMENTS && M.top_level_category_guid !== S.TRANSFER,
519
+ showSplits: !!f
468
520
  });
469
521
  else
470
522
  s({
471
- ...I,
472
- custom: (T) => h ? T.category_guid === h : T.category_guid === b.INCOME || T.top_level_category_guid === b.INCOME
523
+ ...A,
524
+ custom: (M) => f ? M.category_guid === f : M.category_guid === S.INCOME || M.top_level_category_guid === S.INCOME
473
525
  });
474
526
  P(!0);
475
527
  };
476
- return /* @__PURE__ */ m(D, { children: [
477
- /* @__PURE__ */ m(at, { onChange: ut, value: M, variant: "fullWidth", children: [
528
+ return /* @__PURE__ */ h(x, { children: [
529
+ /* @__PURE__ */ h(at, { onChange: ut, value: _, variant: "fullWidth", children: [
478
530
  /* @__PURE__ */ t(
479
531
  N,
480
532
  {
481
533
  label: /* @__PURE__ */ t(
482
534
  W,
483
535
  {
484
- amount: G.totalAmount,
536
+ amount: k.totalAmount,
485
537
  label: o.spend_tab_title
486
538
  }
487
539
  )
@@ -493,30 +545,30 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
493
545
  label: /* @__PURE__ */ t(
494
546
  W,
495
547
  {
496
- amount: X.totalAmount,
548
+ amount: K.totalAmount,
497
549
  label: o.income_tab_title
498
550
  }
499
551
  )
500
552
  }
501
553
  )
502
554
  ] }),
503
- M === 0 && /* @__PURE__ */ t(
555
+ _ === 0 && /* @__PURE__ */ t(
504
556
  et,
505
557
  {
506
- data: G,
507
- onSelected: Y,
508
- onViewTransactions: K,
509
- selectedId: y,
558
+ data: k,
559
+ onSelected: X,
560
+ onViewTransactions: Y,
561
+ selectedId: b,
510
562
  title: o.spend_tab_title
511
563
  }
512
564
  ),
513
- M === 1 && /* @__PURE__ */ t(
565
+ _ === 1 && /* @__PURE__ */ t(
514
566
  et,
515
567
  {
516
- data: X,
517
- onSelected: Y,
518
- onViewTransactions: K,
519
- selectedId: y,
568
+ data: K,
569
+ onSelected: X,
570
+ onViewTransactions: Y,
571
+ selectedId: b,
520
572
  title: o.income_tab_title
521
573
  }
522
574
  ),
@@ -527,44 +579,44 @@ const j = 5, vt = (n, l, r) => r.reduce((i, c) => {
527
579
  isOpen: gt,
528
580
  onClose: () => P(!1),
529
581
  title: o.transactions_drawer_title,
530
- children: /* @__PURE__ */ t(Tt, { onClick: H })
582
+ children: /* @__PURE__ */ t(Dt, { onClick: H })
531
583
  }
532
584
  ),
533
585
  /* @__PURE__ */ t(
534
586
  Q,
535
587
  {
536
588
  ariaLabelClose: o.close_drawer_aria,
537
- isOpen: !!k,
589
+ isOpen: !!$,
538
590
  onClose: () => H(""),
539
591
  title: o.transaction_details_drawer_title,
540
- children: k && /* @__PURE__ */ t(Mt, { transaction: k })
592
+ children: $ && /* @__PURE__ */ t(xt, { transaction: $ })
541
593
  }
542
594
  )
543
595
  ] });
544
- }, kt = x(Gt), $t = ({ onBackClick: n, sx: l = {} }) => {
545
- const { visibleAccounts: r } = rt(), { spending: i } = w(), { isCopyLoaded: c, isInitialized: a, setDisplayedDate: o, setSelectedAccounts: e } = R(), { onEvent: d } = _t(), { clientConfig: u } = st(), s = u?.master?.deep_link_params?.date_range, [g, S] = p.useState(!1);
596
+ }, Bt = v(Gt), jt = ({ onBackClick: n, sx: c = {} }) => {
597
+ const { visibleAccounts: r } = rt(), { spending: l } = I(), { isCopyLoaded: a, isInitialized: i, setDisplayedDate: o, setSelectedAccounts: e } = R(), { onEvent: d } = St(), { clientConfig: u } = st(), s = u?.master?.deep_link_params?.date_range, [m, T] = p.useState(!1);
546
598
  p.useEffect(() => {
547
599
  e(r);
548
600
  }, [r]), p.useEffect(() => {
549
- s && Array.isArray(s) && s.length === 2 ? o(s[0], s[1]) : o(nt(U()), ot(U())), S(!0), d(Z.SPENDING_VIEW);
601
+ s && Array.isArray(s) && s.length === 2 ? o(s[0], s[1]) : o(nt(U()), ot(U())), T(!0), d(Z.SPENDING_VIEW);
550
602
  }, []);
551
- const _ = (y) => {
552
- o(y[0], y[1]);
603
+ const g = (b) => {
604
+ o(b[0], b[1]);
553
605
  };
554
- return !c || !a || !g ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
555
- wt,
606
+ return !a || !i || !m ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(
607
+ It,
556
608
  {
557
609
  accountOptions: r,
558
- calendarActions: { onRangeChanged: _ },
610
+ calendarActions: { onRangeChanged: g },
559
611
  onAccountsFilterClick: () => d(Z.SPENDING_CLICK_FILTER),
560
612
  onBackClick: n,
561
- sx: l,
562
- title: i.title,
563
- children: /* @__PURE__ */ t(D, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(kt, {}) })
613
+ sx: c,
614
+ title: l.title,
615
+ children: /* @__PURE__ */ t(x, { height: "calc(100dvh - 150px)", overflow: "scroll", width: "100%", children: /* @__PURE__ */ t(Bt, {}) })
564
616
  }
565
617
  );
566
- }, fe = x($t);
618
+ }, Ce = v(jt);
567
619
  export {
568
- he as SpendingMiniWidget,
569
- fe as SpendingWidget
620
+ be as SpendingMiniWidget,
621
+ Ce as SpendingWidget
570
622
  };