@mx-cartographer/experiences 9.4.42 → 9.4.43
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.
- package/CHANGELOG.md +8 -0
- package/dist/categories/components/CategoryList.es.js +34 -27
- package/dist/categories/components/CategoryList.es.js.map +1 -1
- package/dist/common/components/listitems/CollapseExpandListItem.es.js +26 -25
- package/dist/common/components/listitems/CollapseExpandListItem.es.js.map +1 -1
- package/dist/core/stores/TransactionStore.es.js +1 -1
- package/dist/core/stores/TransactionStore.es.js.map +1 -1
- package/dist/core/types/localization/CommonCopy.d.ts +2 -0
- package/dist/core/types/localization/TrendsCopy.d.ts +0 -1
- package/dist/core/utils/CategoryUtil.d.ts +11 -0
- package/dist/core/utils/CategoryUtil.es.js +36 -32
- package/dist/core/utils/CategoryUtil.es.js.map +1 -1
- package/dist/core/utils/NetWorthUtils.d.ts +2 -2
- package/dist/core/utils/NetWorthUtils.es.js +64 -64
- package/dist/core/utils/NetWorthUtils.es.js.map +1 -1
- package/dist/core/utils/TransactionUtils.d.ts +2 -2
- package/dist/core/utils/TransactionUtils.es.js +93 -92
- package/dist/core/utils/TransactionUtils.es.js.map +1 -1
- package/dist/debts/components/debtstable/AccountCell.es.js +13 -13
- package/dist/debts/components/debtstable/AccountCell.es.js.map +1 -1
- package/dist/finstrong/components/SpendLessThanYouMake/SpendLessThanYouMakeComponent.es.js +40 -36
- package/dist/finstrong/components/SpendLessThanYouMake/SpendLessThanYouMakeComponent.es.js.map +1 -1
- package/dist/networth/components/AssetsLiabilitiesDetail.es.js +47 -47
- package/dist/networth/components/AssetsLiabilitiesDetail.es.js.map +1 -1
- package/dist/spending/components/MiniSpendingChart.es.js +52 -47
- package/dist/spending/components/MiniSpendingChart.es.js.map +1 -1
- package/dist/spending/components/Spending.es.js +82 -74
- package/dist/spending/components/Spending.es.js.map +1 -1
- package/dist/spending/utils/SpendingData.d.ts +7 -5
- package/dist/spending/utils/SpendingData.es.js +34 -31
- package/dist/spending/utils/SpendingData.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,38 +1,42 @@
|
|
|
1
|
-
import { useAccountStore as
|
|
2
|
-
import { formatCurrency as
|
|
3
|
-
import { EmptyState as
|
|
4
|
-
import
|
|
5
|
-
import { getSpendingData as
|
|
6
|
-
import
|
|
7
|
-
import
|
|
1
|
+
import { useAccountStore as I, useCategoryStore as M, useFinstrongStore as z, useGlobalCopyStore as L, useGlobalStore as T } from "../../../common/context/hooks.es.js";
|
|
2
|
+
import { formatCurrency as f } from "../../../core/utils/NumberFormatting.es.js";
|
|
3
|
+
import { EmptyState as k } from "../../../common/components/EmptyState.es.js";
|
|
4
|
+
import R from "../shared/DoubleBarChart.es.js";
|
|
5
|
+
import { getSpendingData as j } from "../../../spending/utils/SpendingData.es.js";
|
|
6
|
+
import F from "../../../spending/components/SpendingDonut.es.js";
|
|
7
|
+
import H from "../../../spending/components/SpendingLegend.es.js";
|
|
8
8
|
import o from "react";
|
|
9
|
-
import { observer as
|
|
9
|
+
import { observer as B } from "mobx-react-lite";
|
|
10
10
|
import d from "@mui/material/Stack";
|
|
11
|
-
import { H3 as
|
|
12
|
-
import { endOfMonth as
|
|
13
|
-
import { startOfMonth as
|
|
14
|
-
import
|
|
15
|
-
import { ChevronRight as
|
|
11
|
+
import { H3 as E } from "@mxenabled/mxui";
|
|
12
|
+
import { endOfMonth as G } from "date-fns/endOfMonth";
|
|
13
|
+
import { startOfMonth as O } from "date-fns/startOfMonth";
|
|
14
|
+
import Y from "@mui/material/Button";
|
|
15
|
+
import { ChevronRight as A } from "@mxenabled/mx-icons";
|
|
16
16
|
import { jsx as t, jsxs as a } from "react/jsx-runtime";
|
|
17
|
-
import { useTheme as
|
|
18
|
-
import
|
|
19
|
-
var
|
|
20
|
-
const { accounts: p } =
|
|
17
|
+
import { useTheme as P } from "@mui/material/styles";
|
|
18
|
+
import W from "@mui/material/Card";
|
|
19
|
+
var q = () => {
|
|
20
|
+
const { accounts: p } = I(), { categories: _, dateRangeCategoryTotals: l, loadDateRangeCategoryTotals: S } = M(), { monthlySummaries: r, handleFinstrongWidgetPrimaryCtaClick: m } = z(), { appDataStore: c } = T(), { categories: g, finstrong: e, goals: b, spending: x } = L(), w = P(), [s, C] = o.useState("");
|
|
21
21
|
o.useEffect(() => {
|
|
22
|
-
|
|
22
|
+
S(p, O(/* @__PURE__ */ new Date()), G(/* @__PURE__ */ new Date())).finally();
|
|
23
23
|
}, [p]);
|
|
24
|
-
const i = o.useMemo(() =>
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
24
|
+
const i = o.useMemo(() => j(_, b, g, w, l), [
|
|
25
|
+
_,
|
|
26
|
+
g,
|
|
27
|
+
l
|
|
28
|
+
]), u = (n) => {
|
|
29
|
+
C(s === n ? "" : n);
|
|
30
|
+
}, { totalSpending: h, totalIncome: y } = o.useMemo(() => r?.reduce((n, { standard_spend: D = 0, income: v = 0 }) => ({
|
|
31
|
+
totalSpending: n.totalSpending + D,
|
|
32
|
+
totalIncome: n.totalIncome + v
|
|
29
33
|
}), {
|
|
30
34
|
totalSpending: 0,
|
|
31
35
|
totalIncome: 0
|
|
32
36
|
}), [r]);
|
|
33
37
|
return /* @__PURE__ */ a(d, {
|
|
34
38
|
sx: { gap: 24 },
|
|
35
|
-
children: [
|
|
39
|
+
children: [y > 0 || h > 0 ? /* @__PURE__ */ t(R, {
|
|
36
40
|
...c.appData.client_profile?.allow_trends_widget && { buttonLabel: e.key_indicators_spend.spend_less_than_you_make_drawer.view_more },
|
|
37
41
|
chartFor: "spending_vs_income",
|
|
38
42
|
data: r,
|
|
@@ -40,9 +44,9 @@ var W = () => {
|
|
|
40
44
|
legendLabelMain: e.key_indicators_spend.spend_less_than_you_make_drawer.spending,
|
|
41
45
|
onClick: () => m("trends")(),
|
|
42
46
|
title: e.key_indicators_spend.spend_less_than_you_make_drawer.trends,
|
|
43
|
-
totalComparison: y
|
|
44
|
-
totalMain:
|
|
45
|
-
}) : /* @__PURE__ */ t(
|
|
47
|
+
totalComparison: f(y, "0,0.00"),
|
|
48
|
+
totalMain: f(h, "0,0.00")
|
|
49
|
+
}) : /* @__PURE__ */ t(k, {
|
|
46
50
|
header: e.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_title,
|
|
47
51
|
icon: "multiline_chart",
|
|
48
52
|
subText: e.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_description,
|
|
@@ -58,7 +62,7 @@ var W = () => {
|
|
|
58
62
|
mt: 8
|
|
59
63
|
}
|
|
60
64
|
}
|
|
61
|
-
}), i.donutData.length > 0 ? /* @__PURE__ */ a(
|
|
65
|
+
}), i.donutData.length > 0 ? /* @__PURE__ */ a(W, {
|
|
62
66
|
sx: {
|
|
63
67
|
px: 16,
|
|
64
68
|
py: 24
|
|
@@ -73,8 +77,8 @@ var W = () => {
|
|
|
73
77
|
pt: 16,
|
|
74
78
|
px: 16
|
|
75
79
|
},
|
|
76
|
-
children: [/* @__PURE__ */ t(
|
|
77
|
-
endIcon: /* @__PURE__ */ t(
|
|
80
|
+
children: [/* @__PURE__ */ t(E, { children: e.key_indicators_spend.spend_less_than_you_make_drawer.spending }), c.appData.client_profile?.allow_spending_widget && /* @__PURE__ */ t(Y, {
|
|
81
|
+
endIcon: /* @__PURE__ */ t(A, {}),
|
|
78
82
|
onClick: () => m("spending")(),
|
|
79
83
|
size: "small",
|
|
80
84
|
sx: {
|
|
@@ -93,18 +97,18 @@ var W = () => {
|
|
|
93
97
|
pt: 16,
|
|
94
98
|
px: 24
|
|
95
99
|
},
|
|
96
|
-
children: [/* @__PURE__ */ t(
|
|
100
|
+
children: [/* @__PURE__ */ t(F, {
|
|
97
101
|
data: i,
|
|
98
102
|
onSelected: u,
|
|
99
103
|
selectedId: s,
|
|
100
|
-
totalLabel:
|
|
101
|
-
}), /* @__PURE__ */ t(
|
|
104
|
+
totalLabel: x.total_spending
|
|
105
|
+
}), /* @__PURE__ */ t(H, {
|
|
102
106
|
data: i,
|
|
103
107
|
onSelected: u,
|
|
104
108
|
selectedId: s
|
|
105
109
|
})]
|
|
106
110
|
})]
|
|
107
|
-
}) : /* @__PURE__ */ t(
|
|
111
|
+
}) : /* @__PURE__ */ t(k, {
|
|
108
112
|
header: e.key_indicators_spend.spend_less_than_you_make_drawer.spending_zero_state_title,
|
|
109
113
|
icon: "donut_small",
|
|
110
114
|
subText: e.key_indicators_spend.spend_less_than_you_make_drawer.spending_zero_state_description,
|
|
@@ -122,9 +126,9 @@ var W = () => {
|
|
|
122
126
|
}
|
|
123
127
|
})]
|
|
124
128
|
});
|
|
125
|
-
},
|
|
129
|
+
}, pe = B(q);
|
|
126
130
|
export {
|
|
127
|
-
|
|
131
|
+
pe as default
|
|
128
132
|
};
|
|
129
133
|
|
|
130
134
|
//# sourceMappingURL=SpendLessThanYouMakeComponent.es.js.map
|
package/dist/finstrong/components/SpendLessThanYouMake/SpendLessThanYouMakeComponent.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SpendLessThanYouMakeComponent.es.js","names":[],"sources":["../../../../src/finstrong/components/SpendLessThanYouMake/SpendLessThanYouMakeComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { endOfMonth } from 'date-fns/endOfMonth'\n\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { H3 } from '@mxenabled/mxui'\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport {\n useAccountStore,\n useCategoryStore,\n useFinstrongStore,\n useGlobalStore,\n useGlobalCopyStore,\n} from '../../../common'\nimport { EmptyState } from '../../../common/components/EmptyState'\nimport DoubleBarChart from '../shared/DoubleBarChart'\nimport { getSpendingData } from '../../../spending/utils/SpendingData'\nimport SpendingDonut from '../../../spending/components/SpendingDonut'\nimport SpendingLegend from '../../../spending/components/SpendingLegend'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\n\nconst SpendLessThanYouMakeComponent: React.FC = () => {\n const { accounts } = useAccountStore()\n const { categories, dateRangeCategoryTotals, loadDateRangeCategoryTotals } = useCategoryStore()\n const { monthlySummaries, handleFinstrongWidgetPrimaryCtaClick } = useFinstrongStore()\n const { appDataStore } = useGlobalStore()\n const { finstrong: copy
|
|
1
|
+
{"version":3,"file":"SpendLessThanYouMakeComponent.es.js","names":[],"sources":["../../../../src/finstrong/components/SpendLessThanYouMake/SpendLessThanYouMakeComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { endOfMonth } from 'date-fns/endOfMonth'\n\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { H3 } from '@mxenabled/mxui'\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport {\n useAccountStore,\n useCategoryStore,\n useFinstrongStore,\n useGlobalStore,\n useGlobalCopyStore,\n} from '../../../common'\nimport { EmptyState } from '../../../common/components/EmptyState'\nimport DoubleBarChart from '../shared/DoubleBarChart'\nimport { getSpendingData } from '../../../spending/utils/SpendingData'\nimport SpendingDonut from '../../../spending/components/SpendingDonut'\nimport SpendingLegend from '../../../spending/components/SpendingLegend'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\n\nconst SpendLessThanYouMakeComponent: React.FC = () => {\n const { accounts } = useAccountStore()\n const { categories, dateRangeCategoryTotals, loadDateRangeCategoryTotals } = useCategoryStore()\n const { monthlySummaries, handleFinstrongWidgetPrimaryCtaClick } = useFinstrongStore()\n const { appDataStore } = useGlobalStore()\n const {\n categories: categoriesCopy,\n finstrong: copy,\n goals: goalsCopy,\n spending: spendingCopy,\n } = useGlobalCopyStore()\n const theme = useTheme()\n\n const [selectedId, setSelectedId] = React.useState('')\n\n // Load category data for spending chart\n React.useEffect(() => {\n loadDateRangeCategoryTotals(\n accounts,\n startOfMonth(new Date()),\n endOfMonth(new Date()),\n ).finally()\n }, [accounts])\n\n // Spending data for donut chart\n const spendingData = React.useMemo(\n () => getSpendingData(categories, goalsCopy, categoriesCopy, theme, dateRangeCategoryTotals),\n [categories, categoriesCopy, dateRangeCategoryTotals],\n )\n\n const handleSelected = (id: string) => {\n setSelectedId(selectedId === id ? '' : id)\n }\n\n const { totalSpending, totalIncome } = React.useMemo(() => {\n return monthlySummaries?.reduce(\n (\n totals: { totalSpending: number; totalIncome: number },\n { standard_spend = 0, income = 0 },\n ) => ({\n totalSpending: totals.totalSpending + standard_spend,\n totalIncome: totals.totalIncome + income,\n }),\n { totalSpending: 0, totalIncome: 0 },\n )\n }, [monthlySummaries])\n\n //TODO: Add Functionalities for View More Buttons\n return (\n <Stack sx={{ gap: 24 }}>\n {totalIncome > 0 || totalSpending > 0 ? (\n <DoubleBarChart\n {...(appDataStore.appData.client_profile?.allow_trends_widget && {\n buttonLabel: copy.key_indicators_spend.spend_less_than_you_make_drawer.view_more,\n })}\n chartFor=\"spending_vs_income\"\n data={monthlySummaries}\n legendLabelComparison={copy.key_indicators_spend.spend_less_than_you_make_drawer.income}\n legendLabelMain={copy.key_indicators_spend.spend_less_than_you_make_drawer.spending}\n onClick={() => handleFinstrongWidgetPrimaryCtaClick('trends')()}\n title={copy.key_indicators_spend.spend_less_than_you_make_drawer.trends}\n totalComparison={formatCurrency(totalIncome, '0,0.00')}\n totalMain={formatCurrency(totalSpending, '0,0.00')}\n />\n ) : (\n <EmptyState\n header={copy.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_title}\n icon=\"multiline_chart\"\n subText={\n copy.key_indicators_spend.spend_less_than_you_make_drawer.trends_zero_state_description\n }\n sx={{\n backgroundColor: 'background.paper',\n borderRadius: '8px',\n boxShadow: 1,\n p: 24,\n pb: 48,\n '.empty-state-subtext': {\n fontSize: 15,\n lineHeight: '24px',\n mt: 8,\n },\n }}\n />\n )}\n\n {/* Mini Spending Chart Component */}\n {spendingData.donutData.length > 0 ? (\n <Card\n sx={{\n px: 16,\n py: 24,\n }}\n >\n <Stack\n sx={{\n alignItems: 'center',\n flexDirection: 'row',\n gap: 12,\n justifyContent: 'space-between',\n pb: 8,\n pt: 16,\n px: 16,\n }}\n >\n <H3>{copy.key_indicators_spend.spend_less_than_you_make_drawer.spending}</H3>\n {appDataStore.appData.client_profile?.allow_spending_widget && (\n <Button\n endIcon={<ChevronRight />}\n onClick={() => handleFinstrongWidgetPrimaryCtaClick('spending')()}\n size=\"small\"\n sx={{\n pl: 8,\n height: 24,\n }}\n variant=\"text\"\n >\n {copy.key_indicators_spend.spend_less_than_you_make_drawer.view_more}\n </Button>\n )}\n </Stack>\n <Stack\n sx={{ flexDirection: 'row', gap: 12, justifyContent: 'center', pb: 32, pt: 16, px: 24 }}\n >\n <SpendingDonut\n data={spendingData}\n onSelected={handleSelected}\n selectedId={selectedId}\n totalLabel={spendingCopy.total_spending}\n />\n\n <SpendingLegend\n data={spendingData}\n onSelected={handleSelected}\n selectedId={selectedId}\n />\n </Stack>\n </Card>\n ) : (\n <EmptyState\n header={\n copy.key_indicators_spend.spend_less_than_you_make_drawer.spending_zero_state_title\n }\n icon=\"donut_small\"\n subText={\n copy.key_indicators_spend.spend_less_than_you_make_drawer\n .spending_zero_state_description\n }\n sx={{\n backgroundColor: 'background.paper',\n borderRadius: '8px',\n boxShadow: 1,\n p: 24,\n pb: 48,\n '.empty-state-subtext': {\n fontSize: 15,\n lineHeight: '24px',\n mt: 8,\n },\n }}\n />\n )}\n </Stack>\n )\n}\n\nexport default observer(SpendLessThanYouMakeComponent)\n"],"mappings":"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"}
|
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
import { useGlobalCopyStore as
|
|
1
|
+
import { useGlobalCopyStore as _ } from "../../common/context/hooks.es.js";
|
|
2
2
|
import { groupAccounts as x } from "../../core/utils/NetWorthUtils.es.js";
|
|
3
|
-
import { CurrencyText as
|
|
3
|
+
import { CurrencyText as c } from "../../common/components/CurrencyText.es.js";
|
|
4
4
|
import w from "./NetWorthChange.es.js";
|
|
5
5
|
import I from "react";
|
|
6
|
-
import { observer as
|
|
7
|
-
import
|
|
6
|
+
import { observer as j } from "mobx-react-lite";
|
|
7
|
+
import h from "@mui/material/Stack";
|
|
8
8
|
import { Icon as d, Text as m } from "@mxenabled/mxui";
|
|
9
|
-
import { Fragment as
|
|
10
|
-
import { useTheme as
|
|
11
|
-
import
|
|
12
|
-
import
|
|
9
|
+
import { Fragment as f, jsx as t, jsxs as r } from "react/jsx-runtime";
|
|
10
|
+
import { useTheme as S } from "@mui/material/styles";
|
|
11
|
+
import k from "@mui/material/Box";
|
|
12
|
+
import u from "@mui/material/Divider";
|
|
13
13
|
import C from "@mui/material/List";
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
18
|
-
import
|
|
19
|
-
import
|
|
20
|
-
var
|
|
21
|
-
const [o,
|
|
22
|
-
return /* @__PURE__ */ r(
|
|
23
|
-
/* @__PURE__ */ t(
|
|
14
|
+
import y from "@mui/material/ListItem";
|
|
15
|
+
import A from "@mui/material/ListItemButton";
|
|
16
|
+
import b from "@mui/material/ListItemIcon";
|
|
17
|
+
import p from "@mui/material/ListItemText";
|
|
18
|
+
import g from "@mui/material/ListSubheader";
|
|
19
|
+
import T from "@mui/material/Collapse";
|
|
20
|
+
var W = ({ accounts: i, name: a, icon: n }) => {
|
|
21
|
+
const [o, l] = I.useState(!1);
|
|
22
|
+
return /* @__PURE__ */ r(f, { children: [
|
|
23
|
+
/* @__PURE__ */ t(y, {
|
|
24
24
|
sx: (e) => ({ backgroundColor: e.palette.background.paper }),
|
|
25
|
-
children: /* @__PURE__ */ r(
|
|
26
|
-
onClick: () =>
|
|
25
|
+
children: /* @__PURE__ */ r(A, {
|
|
26
|
+
onClick: () => l(!o),
|
|
27
27
|
children: [
|
|
28
|
-
n && /* @__PURE__ */ t(
|
|
28
|
+
n && /* @__PURE__ */ t(b, { children: /* @__PURE__ */ t(d, {
|
|
29
29
|
name: n,
|
|
30
30
|
size: 24,
|
|
31
31
|
sx: { mr: 12 }
|
|
32
32
|
}) }),
|
|
33
|
-
/* @__PURE__ */ t(
|
|
33
|
+
/* @__PURE__ */ t(p, { primary: /* @__PURE__ */ t(m, {
|
|
34
34
|
sx: { fontWeight: 700 },
|
|
35
35
|
variant: "body1",
|
|
36
36
|
children: a
|
|
37
37
|
}) }),
|
|
38
|
-
/* @__PURE__ */ t(
|
|
38
|
+
/* @__PURE__ */ t(b, { children: o ? /* @__PURE__ */ t(d, {
|
|
39
39
|
name: "expand_less",
|
|
40
40
|
size: 24
|
|
41
41
|
}) : /* @__PURE__ */ t(d, {
|
|
@@ -45,15 +45,15 @@ var T = ({ accounts: i, name: a, icon: n }) => {
|
|
|
45
45
|
]
|
|
46
46
|
})
|
|
47
47
|
}),
|
|
48
|
-
/* @__PURE__ */ t(
|
|
49
|
-
/* @__PURE__ */ t(
|
|
48
|
+
/* @__PURE__ */ t(u, {}),
|
|
49
|
+
/* @__PURE__ */ t(T, {
|
|
50
50
|
in: o,
|
|
51
51
|
timeout: "auto",
|
|
52
52
|
unmountOnExit: !0,
|
|
53
|
-
children: i.map((e,
|
|
53
|
+
children: i.map((e, s) => /* @__PURE__ */ r(C, { children: [/* @__PURE__ */ t(y, {
|
|
54
54
|
sx: () => ({ py: 14 }),
|
|
55
|
-
children: /* @__PURE__ */ t(
|
|
56
|
-
primary: /* @__PURE__ */ r(
|
|
55
|
+
children: /* @__PURE__ */ t(p, {
|
|
56
|
+
primary: /* @__PURE__ */ r(h, {
|
|
57
57
|
direction: "row",
|
|
58
58
|
justifyContent: "space-between",
|
|
59
59
|
sx: { fontWeight: 400 },
|
|
@@ -61,7 +61,7 @@ var T = ({ accounts: i, name: a, icon: n }) => {
|
|
|
61
61
|
sx: { marginRight: 10 },
|
|
62
62
|
variant: "body1",
|
|
63
63
|
children: e.accountName
|
|
64
|
-
}), /* @__PURE__ */ t(
|
|
64
|
+
}), /* @__PURE__ */ t(c, {
|
|
65
65
|
amount: e.balance,
|
|
66
66
|
sx: { flexShrink: 0 },
|
|
67
67
|
variant: "body2"
|
|
@@ -72,16 +72,16 @@ var T = ({ accounts: i, name: a, icon: n }) => {
|
|
|
72
72
|
pr: 16
|
|
73
73
|
}
|
|
74
74
|
})
|
|
75
|
-
}),
|
|
75
|
+
}), s < i.length - 1 ? /* @__PURE__ */ t(u, { variant: "inset" }) : /* @__PURE__ */ t(u, {})] }, e.accountName))
|
|
76
76
|
})
|
|
77
77
|
] });
|
|
78
|
-
}, v = ({ groupedAccounts: i }) => /* @__PURE__ */ t(
|
|
78
|
+
}, v = ({ groupedAccounts: i }) => /* @__PURE__ */ t(f, { children: i.map(({ accounts: a, icon: n, name: o }) => /* @__PURE__ */ t(W, {
|
|
79
79
|
accounts: a,
|
|
80
80
|
icon: n,
|
|
81
81
|
name: o
|
|
82
|
-
}, o)) }),
|
|
83
|
-
const { net_worth: e } =
|
|
84
|
-
return /* @__PURE__ */ r(
|
|
82
|
+
}, o)) }), z = ({ netWorth: i, assets: a, liabilities: n, totalAssets: o, totalLiabilities: l }) => {
|
|
83
|
+
const { net_worth: e, accounts: s } = _(), L = S();
|
|
84
|
+
return /* @__PURE__ */ r(f, { children: [/* @__PURE__ */ r(k, {
|
|
85
85
|
sx: {
|
|
86
86
|
alignItems: "center",
|
|
87
87
|
display: "flex",
|
|
@@ -95,7 +95,7 @@ var T = ({ accounts: i, name: a, icon: n }) => {
|
|
|
95
95
|
variant: "body1",
|
|
96
96
|
children: e.current_net_worth
|
|
97
97
|
}),
|
|
98
|
-
/* @__PURE__ */ t(
|
|
98
|
+
/* @__PURE__ */ t(c, {
|
|
99
99
|
amount: i?.y ?? 0,
|
|
100
100
|
variant: "h1"
|
|
101
101
|
}),
|
|
@@ -103,56 +103,56 @@ var T = ({ accounts: i, name: a, icon: n }) => {
|
|
|
103
103
|
currencyLabel: e.this_month,
|
|
104
104
|
iconSize: 20,
|
|
105
105
|
netWorth: i,
|
|
106
|
-
theme:
|
|
106
|
+
theme: L
|
|
107
107
|
})
|
|
108
108
|
]
|
|
109
109
|
}), /* @__PURE__ */ r(C, { children: [
|
|
110
|
-
/* @__PURE__ */ t(
|
|
110
|
+
/* @__PURE__ */ t(g, {
|
|
111
111
|
sx: {
|
|
112
112
|
mb: 8,
|
|
113
113
|
mt: 12,
|
|
114
114
|
mx: 8
|
|
115
115
|
},
|
|
116
|
-
children: /* @__PURE__ */ t(
|
|
116
|
+
children: /* @__PURE__ */ t(p, { primary: /* @__PURE__ */ r(h, {
|
|
117
117
|
direction: "row",
|
|
118
118
|
justifyContent: "space-between",
|
|
119
119
|
children: [/* @__PURE__ */ t(m, {
|
|
120
120
|
sx: { fontWeight: 700 },
|
|
121
121
|
variant: "caption",
|
|
122
122
|
children: e.assets
|
|
123
|
-
}), /* @__PURE__ */ t(
|
|
123
|
+
}), /* @__PURE__ */ t(c, {
|
|
124
124
|
amount: o,
|
|
125
125
|
sx: { fontWeight: 400 },
|
|
126
126
|
variant: "caption"
|
|
127
127
|
})]
|
|
128
128
|
}) })
|
|
129
129
|
}),
|
|
130
|
-
/* @__PURE__ */ t(v, { groupedAccounts: x(a) }),
|
|
131
|
-
/* @__PURE__ */ t(
|
|
130
|
+
/* @__PURE__ */ t(v, { groupedAccounts: x(a, s.account_types) }),
|
|
131
|
+
/* @__PURE__ */ t(g, {
|
|
132
132
|
sx: {
|
|
133
133
|
mb: 8,
|
|
134
134
|
mt: 12,
|
|
135
135
|
mx: 8
|
|
136
136
|
},
|
|
137
|
-
children: /* @__PURE__ */ t(
|
|
137
|
+
children: /* @__PURE__ */ t(p, { primary: /* @__PURE__ */ r(h, {
|
|
138
138
|
direction: "row",
|
|
139
139
|
justifyContent: "space-between",
|
|
140
140
|
children: [/* @__PURE__ */ t(m, {
|
|
141
141
|
sx: { fontWeight: 700 },
|
|
142
142
|
variant: "caption",
|
|
143
143
|
children: e.liabilities
|
|
144
|
-
}), /* @__PURE__ */ t(
|
|
145
|
-
amount:
|
|
144
|
+
}), /* @__PURE__ */ t(c, {
|
|
145
|
+
amount: l,
|
|
146
146
|
sx: { fontWeight: 400 },
|
|
147
147
|
variant: "caption"
|
|
148
148
|
})]
|
|
149
149
|
}) })
|
|
150
150
|
}),
|
|
151
|
-
/* @__PURE__ */ t(v, { groupedAccounts: x(n) })
|
|
151
|
+
/* @__PURE__ */ t(v, { groupedAccounts: x(n, s.account_types) })
|
|
152
152
|
] })] });
|
|
153
|
-
},
|
|
153
|
+
}, Y = j(z);
|
|
154
154
|
export {
|
|
155
|
-
|
|
155
|
+
Y as default
|
|
156
156
|
};
|
|
157
157
|
|
|
158
158
|
//# sourceMappingURL=AssetsLiabilitiesDetail.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetsLiabilitiesDetail.es.js","names":[],"sources":["../../../src/networth/components/AssetsLiabilitiesDetail.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\nimport React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Collapse from '@mui/material/Collapse'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport ListSubheader from '@mui/material/ListSubheader'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport { CurrencyText, useGlobalCopyStore } from '../../common/'\nimport NetWorthChange from './NetWorthChange'\nimport { AccountGroup, AssetsLiabilities } from '../../core/types/NetWorth'\nimport { groupAccounts } from '../../core/utils/NetWorthUtils'\n\nconst Group: React.FC<AccountGroup> = ({ accounts, name, icon }) => {\n const [isOpen, setIsOpen] = React.useState(false)\n\n return (\n <>\n <ListItem sx={(theme) => ({ backgroundColor: theme.palette.background.paper })}>\n <ListItemButton onClick={() => setIsOpen(!isOpen)}>\n {icon && (\n <ListItemIcon>\n <Icon name={icon} size={24} sx={{ mr: 12 }} />\n </ListItemIcon>\n )}\n <ListItemText\n primary={\n <Text sx={{ fontWeight: 700 }} variant=\"body1\">\n {name}\n </Text>\n }\n />\n <ListItemIcon>\n {isOpen ? <Icon name=\"expand_less\" size={24} /> : <Icon name=\"expand_more\" size={24} />}\n </ListItemIcon>\n </ListItemButton>\n </ListItem>\n <Divider />\n <Collapse in={isOpen} timeout=\"auto\" unmountOnExit={true}>\n {accounts.map((account, index) => (\n <List key={account.accountName}>\n <ListItem sx={() => ({ py: 14 })}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\" sx={{ fontWeight: 400 }}>\n <Text\n sx={{\n marginRight: 10,\n }}\n variant=\"body1\"\n >\n {account.accountName}\n </Text>\n <CurrencyText\n amount={account.balance}\n sx={{\n flexShrink: 0,\n }}\n variant=\"body2\"\n />\n </Stack>\n }\n sx={{ pl: 72, pr: 16 }}\n />\n </ListItem>\n {index < accounts.length - 1 ? <Divider variant=\"inset\" /> : <Divider />}\n </List>\n ))}\n </Collapse>\n </>\n )\n}\n\nconst ListGroup: React.FC<{\n groupedAccounts: AccountGroup[]\n}> = ({ groupedAccounts }) => (\n <>\n {groupedAccounts.map(({ accounts, icon, name }) => (\n <Group accounts={accounts} icon={icon} key={name} name={name} />\n ))}\n </>\n)\n\nconst AssetsLiabilitiesDetail: React.FC<AssetsLiabilities> = ({\n netWorth,\n assets,\n liabilities,\n totalAssets,\n totalLiabilities,\n}) => {\n const { net_worth: copy } = useGlobalCopyStore()\n\n const theme = useTheme()\n\n return (\n <>\n <Box\n sx={{\n alignItems: 'center',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'space-between',\n paddingTop: 24,\n marginBottom: 8,\n }}\n >\n <Text variant=\"body1\">{copy.current_net_worth}</Text>\n <CurrencyText amount={netWorth?.y ?? 0} variant=\"h1\" />\n {netWorth && (\n <NetWorthChange\n currencyLabel={copy.this_month}\n iconSize={20}\n netWorth={netWorth}\n theme={theme}\n />\n )}\n </Box>\n <List>\n <ListSubheader sx={{ mb: 8, mt: 12, mx: 8 }}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Text sx={{ fontWeight: 700 }} variant=\"caption\">\n {copy.assets}\n </Text>\n <CurrencyText amount={totalAssets} sx={{ fontWeight: 400 }} variant=\"caption\" />\n </Stack>\n }\n />\n </ListSubheader>\n <ListGroup groupedAccounts={groupAccounts(assets)} />\n <ListSubheader sx={{ mb: 8, mt: 12, mx: 8 }}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Text sx={{ fontWeight: 700 }} variant=\"caption\">\n {copy.liabilities}\n </Text>\n <CurrencyText\n amount={totalLiabilities}\n sx={{ fontWeight: 400 }}\n variant=\"caption\"\n />\n </Stack>\n }\n />\n </ListSubheader>\n <ListGroup groupedAccounts={groupAccounts(liabilities)} />\n </List>\n </>\n )\n}\n\nexport default observer(AssetsLiabilitiesDetail)\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsBA,IAAM,IAAA,CAAiC,EAAE,UAAA,GAAU,MAAA,GAAM,MAAA,EAAA,MAAW;AAClE,QAAM,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAK;AAEhD,SACE,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,IACE,gBAAA,EAAC,GAAD;AAAA,MAAU,IAAA,CAAK,OAAW,EAAE,iBAAiB,EAAM,QAAQ,WAAW,MAAM;AAAA,MAC1E,UAAA,gBAAA,EAAC,GAAD;AAAA,QAAgB,SAAA,MAAe,EAAU,CAAC,CAAM;AAAA,QAAhD,UAAA;AAAA,UACG,KACC,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,YAAM,MAAM;AAAA,YAAM,MAAM;AAAA,YAAI,IAAI,EAAE,IAAI,GAAG;AAAA,UAAI,CAAA,EACjC,CAAA;AAAA,UAEhB,gBAAA,EAAC,GAAD,EACE,SACE,gBAAA,EAAC,GAAD;AAAA,YAAM,IAAI,EAAE,YAAY,IAAI;AAAA,YAAG,SAAQ;AAAA,YACpC,UAAA;AAAA,UACG,CAAA,EAET,CAAA;AAAA,UACD,gBAAA,EAAC,GAAD,EAAA,UACG,IAAS,gBAAA,EAAC,GAAD;AAAA,YAAM,MAAK;AAAA,YAAc,MAAM;AAAA,UAAK,CAAA,IAAI,gBAAA,EAAC,GAAD;AAAA,YAAM,MAAK;AAAA,YAAc,MAAM;AAAA,UAAK,CAAA,EAC1E,CAAA;AAAA,QACA;AAAA;IACR,CAAA;AAAA,IACV,gBAAA,EAAC,GAAD,CAAU,CAAA;AAAA,IACV,gBAAA,EAAC,GAAD;AAAA,MAAU,IAAI;AAAA,MAAQ,SAAQ;AAAA,MAAO,eAAe;AAAA,MACjD,UAAA,EAAS,IAAA,CAAK,GAAS,MACtB,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,QAAU,IAAA,OAAW,EAAE,IAAI,GAAG;AAAA,QAC5B,UAAA,gBAAA,EAAC,GAAD;AAAA,UACE,SACE,gBAAA,EAAC,GAAD;AAAA,YAAO,WAAU;AAAA,YAAM,gBAAe;AAAA,YAAgB,IAAI,EAAE,YAAY,IAAI;AAAA,YAA5E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,cACE,IAAI,EACF,aAAa,GACf;AAAA,cACA,SAAQ;AAAA,cAEP,UAAA,EAAQ;AAAA,YACL,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,cACE,QAAQ,EAAQ;AAAA,cAChB,IAAI,EACF,YAAY,EACd;AAAA,cACA,SAAQ;AAAA,YACT,CAAA,CACI;AAAA;UAET,IAAI;AAAA,YAAE,IAAI;AAAA,YAAI,IAAI;AAAA,UAAG;AAAA,QACtB,CAAA;AAAA,MACO,CAAA,GACT,IAAQ,EAAS,SAAS,IAAI,gBAAA,EAAC,GAAD,EAAS,SAAQ,QAAS,CAAA,IAAI,gBAAA,EAAC,GAAD,CAAU,CAAA,CACnE,EAAA,GA1BK,EAAQ,WA0Bb,CACP;AAAA,IACO,CAAA;AAAA,EACV,EAAA,CAAA;AAEN,GAEM,IAAA,CAEA,EAAE,iBAAA,EAAA,MACN,gBAAA,EAAA,GAAA,EAAA,UACG,EAAgB,IAAA,CAAK,EAAE,UAAA,GAAU,MAAA,GAAM,MAAA,EAAA,MACtC,gBAAA,EAAC,GAAD;AAAA,EAAiB,UAAA;AAAA,EAAgB,MAAA;AAAA,EAAuB,MAAA;AAAO,GAAnB,CAAmB,CAChE,EACD,CAAA,GAGE,IAAA,CAAwD,EAC5D,UAAA,GACA,QAAA,GACA,aAAA,GACA,aAAA,GACA,kBAAA,EAAA,MACI;AACJ,QAAM,EAAE,WAAW,EAAA,
|
|
1
|
+
{"version":3,"file":"AssetsLiabilitiesDetail.es.js","names":[],"sources":["../../../src/networth/components/AssetsLiabilitiesDetail.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\nimport React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Collapse from '@mui/material/Collapse'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport ListSubheader from '@mui/material/ListSubheader'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport { CurrencyText, useGlobalCopyStore } from '../../common/'\nimport NetWorthChange from './NetWorthChange'\nimport { AccountGroup, AssetsLiabilities } from '../../core/types/NetWorth'\nimport { groupAccounts } from '../../core/utils/NetWorthUtils'\n\nconst Group: React.FC<AccountGroup> = ({ accounts, name, icon }) => {\n const [isOpen, setIsOpen] = React.useState(false)\n\n return (\n <>\n <ListItem sx={(theme) => ({ backgroundColor: theme.palette.background.paper })}>\n <ListItemButton onClick={() => setIsOpen(!isOpen)}>\n {icon && (\n <ListItemIcon>\n <Icon name={icon} size={24} sx={{ mr: 12 }} />\n </ListItemIcon>\n )}\n <ListItemText\n primary={\n <Text sx={{ fontWeight: 700 }} variant=\"body1\">\n {name}\n </Text>\n }\n />\n <ListItemIcon>\n {isOpen ? <Icon name=\"expand_less\" size={24} /> : <Icon name=\"expand_more\" size={24} />}\n </ListItemIcon>\n </ListItemButton>\n </ListItem>\n <Divider />\n <Collapse in={isOpen} timeout=\"auto\" unmountOnExit={true}>\n {accounts.map((account, index) => (\n <List key={account.accountName}>\n <ListItem sx={() => ({ py: 14 })}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\" sx={{ fontWeight: 400 }}>\n <Text\n sx={{\n marginRight: 10,\n }}\n variant=\"body1\"\n >\n {account.accountName}\n </Text>\n <CurrencyText\n amount={account.balance}\n sx={{\n flexShrink: 0,\n }}\n variant=\"body2\"\n />\n </Stack>\n }\n sx={{ pl: 72, pr: 16 }}\n />\n </ListItem>\n {index < accounts.length - 1 ? <Divider variant=\"inset\" /> : <Divider />}\n </List>\n ))}\n </Collapse>\n </>\n )\n}\n\nconst ListGroup: React.FC<{\n groupedAccounts: AccountGroup[]\n}> = ({ groupedAccounts }) => (\n <>\n {groupedAccounts.map(({ accounts, icon, name }) => (\n <Group accounts={accounts} icon={icon} key={name} name={name} />\n ))}\n </>\n)\n\nconst AssetsLiabilitiesDetail: React.FC<AssetsLiabilities> = ({\n netWorth,\n assets,\n liabilities,\n totalAssets,\n totalLiabilities,\n}) => {\n const { net_worth: copy, accounts: accountsCopy } = useGlobalCopyStore()\n\n const theme = useTheme()\n\n return (\n <>\n <Box\n sx={{\n alignItems: 'center',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'space-between',\n paddingTop: 24,\n marginBottom: 8,\n }}\n >\n <Text variant=\"body1\">{copy.current_net_worth}</Text>\n <CurrencyText amount={netWorth?.y ?? 0} variant=\"h1\" />\n {netWorth && (\n <NetWorthChange\n currencyLabel={copy.this_month}\n iconSize={20}\n netWorth={netWorth}\n theme={theme}\n />\n )}\n </Box>\n <List>\n <ListSubheader sx={{ mb: 8, mt: 12, mx: 8 }}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Text sx={{ fontWeight: 700 }} variant=\"caption\">\n {copy.assets}\n </Text>\n <CurrencyText amount={totalAssets} sx={{ fontWeight: 400 }} variant=\"caption\" />\n </Stack>\n }\n />\n </ListSubheader>\n <ListGroup groupedAccounts={groupAccounts(assets, accountsCopy.account_types)} />\n <ListSubheader sx={{ mb: 8, mt: 12, mx: 8 }}>\n <ListItemText\n primary={\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Text sx={{ fontWeight: 700 }} variant=\"caption\">\n {copy.liabilities}\n </Text>\n <CurrencyText\n amount={totalLiabilities}\n sx={{ fontWeight: 400 }}\n variant=\"caption\"\n />\n </Stack>\n }\n />\n </ListSubheader>\n <ListGroup groupedAccounts={groupAccounts(liabilities, accountsCopy.account_types)} />\n </List>\n </>\n )\n}\n\nexport default observer(AssetsLiabilitiesDetail)\n"],"mappings":"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"}
|
|
@@ -1,112 +1,117 @@
|
|
|
1
|
-
import { useCategoryStore as
|
|
2
|
-
import { getIncomeData as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { useCategoryStore as I, useGlobalCopyStore as D } from "../../common/context/hooks.es.js";
|
|
2
|
+
import { getIncomeData as j, getSpendingData as L } from "../utils/SpendingData.es.js";
|
|
3
|
+
import f from "./SpendingDonut.es.js";
|
|
4
|
+
import S from "./SpendingLegend.es.js";
|
|
5
|
+
import M from "./SpendingTabLabel.es.js";
|
|
6
6
|
import i from "react";
|
|
7
|
-
import { observer as
|
|
8
|
-
import
|
|
9
|
-
import { jsx as e, jsxs as
|
|
10
|
-
import { useTheme as
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
var
|
|
15
|
-
const t =
|
|
7
|
+
import { observer as w } from "mobx-react-lite";
|
|
8
|
+
import C from "@mui/material/Stack";
|
|
9
|
+
import { jsx as e, jsxs as p } from "react/jsx-runtime";
|
|
10
|
+
import { useTheme as A } from "@mui/material/styles";
|
|
11
|
+
import h from "@mui/material/Box";
|
|
12
|
+
import y from "@mui/material/Tab";
|
|
13
|
+
import R from "@mui/material/Tabs";
|
|
14
|
+
var k = () => {
|
|
15
|
+
const t = A(), { categories: r, goals: _, spending: a } = D(), { categories: l, dateRangeCategoryTotals: c } = I(), g = i.useMemo(() => [
|
|
16
16
|
t.palette.chartMono.chartMono5,
|
|
17
17
|
t.palette.chartMono.chartMono4,
|
|
18
18
|
t.palette.chartMono.chartMono3,
|
|
19
19
|
t.palette.chartMono.chartMono2,
|
|
20
20
|
t.palette.chartMono.chartMono1,
|
|
21
21
|
t.palette.chartMono.chartMono6
|
|
22
|
-
], [t]), [o,
|
|
22
|
+
], [t]), [o, u] = i.useState(""), [n, v] = i.useState(0), s = i.useMemo(() => L(l, _, r, t, c), [
|
|
23
|
+
l,
|
|
23
24
|
r,
|
|
25
|
+
c
|
|
26
|
+
]), m = i.useMemo(() => j(l, r, c, g), [
|
|
24
27
|
l,
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
28
|
+
r,
|
|
29
|
+
c,
|
|
30
|
+
g
|
|
31
|
+
]), T = (b, x) => {
|
|
32
|
+
v(x), u("");
|
|
33
|
+
}, d = (b) => {
|
|
34
|
+
u(o === b ? "" : b);
|
|
30
35
|
};
|
|
31
|
-
return /* @__PURE__ */
|
|
36
|
+
return /* @__PURE__ */ p(h, {
|
|
32
37
|
width: "100%",
|
|
33
38
|
children: [
|
|
34
|
-
/* @__PURE__ */
|
|
39
|
+
/* @__PURE__ */ p(R, {
|
|
35
40
|
"aria-label": a.mini_title,
|
|
36
|
-
onChange:
|
|
41
|
+
onChange: T,
|
|
37
42
|
sx: { touchAction: "manipulation" },
|
|
38
43
|
value: n,
|
|
39
44
|
variant: "fullWidth",
|
|
40
|
-
children: [/* @__PURE__ */ e(
|
|
45
|
+
children: [/* @__PURE__ */ e(y, {
|
|
41
46
|
"aria-controls": "spending-tabpanel",
|
|
42
47
|
id: "spending-tab",
|
|
43
|
-
label: /* @__PURE__ */ e(
|
|
44
|
-
amount:
|
|
48
|
+
label: /* @__PURE__ */ e(M, {
|
|
49
|
+
amount: s.totalAmount,
|
|
45
50
|
label: a.spend_tab_title,
|
|
46
51
|
variant: "mini"
|
|
47
52
|
}),
|
|
48
53
|
tabIndex: n === 0 ? 0 : -1
|
|
49
|
-
}), /* @__PURE__ */ e(
|
|
54
|
+
}), /* @__PURE__ */ e(y, {
|
|
50
55
|
"aria-controls": "income-tabpanel",
|
|
51
56
|
id: "income-tab",
|
|
52
|
-
label: /* @__PURE__ */ e(
|
|
53
|
-
amount:
|
|
57
|
+
label: /* @__PURE__ */ e(M, {
|
|
58
|
+
amount: m.totalAmount,
|
|
54
59
|
label: a.income_tab_title,
|
|
55
60
|
variant: "mini"
|
|
56
61
|
}),
|
|
57
62
|
tabIndex: n === 1 ? 0 : -1
|
|
58
63
|
})]
|
|
59
64
|
}),
|
|
60
|
-
/* @__PURE__ */ e(
|
|
65
|
+
/* @__PURE__ */ e(h, {
|
|
61
66
|
"aria-labelledby": "spending-tab",
|
|
62
67
|
hidden: n !== 0,
|
|
63
68
|
id: "spending-tabpanel",
|
|
64
69
|
role: "tabpanel",
|
|
65
|
-
children: /* @__PURE__ */
|
|
70
|
+
children: /* @__PURE__ */ p(C, {
|
|
66
71
|
direction: "row",
|
|
67
72
|
gap: 16,
|
|
68
73
|
justifyContent: "center",
|
|
69
74
|
p: 24,
|
|
70
|
-
children: [/* @__PURE__ */ e(
|
|
71
|
-
data:
|
|
72
|
-
onSelected:
|
|
75
|
+
children: [/* @__PURE__ */ e(f, {
|
|
76
|
+
data: s,
|
|
77
|
+
onSelected: d,
|
|
73
78
|
selectedId: o,
|
|
74
79
|
totalLabel: a.total_spending
|
|
75
|
-
}), /* @__PURE__ */ e(
|
|
76
|
-
data:
|
|
77
|
-
onSelected:
|
|
80
|
+
}), /* @__PURE__ */ e(S, {
|
|
81
|
+
data: s,
|
|
82
|
+
onSelected: d,
|
|
78
83
|
selectedId: o
|
|
79
84
|
})]
|
|
80
85
|
})
|
|
81
86
|
}),
|
|
82
|
-
/* @__PURE__ */ e(
|
|
87
|
+
/* @__PURE__ */ e(h, {
|
|
83
88
|
"aria-labelledby": "income-tab",
|
|
84
89
|
hidden: n !== 1,
|
|
85
90
|
id: "income-tabpanel",
|
|
86
91
|
role: "tabpanel",
|
|
87
|
-
children: /* @__PURE__ */
|
|
92
|
+
children: /* @__PURE__ */ p(C, {
|
|
88
93
|
direction: "row",
|
|
89
94
|
gap: 16,
|
|
90
95
|
justifyContent: "center",
|
|
91
96
|
p: 24,
|
|
92
|
-
children: [/* @__PURE__ */ e(
|
|
93
|
-
data:
|
|
97
|
+
children: [/* @__PURE__ */ e(f, {
|
|
98
|
+
data: m,
|
|
94
99
|
isIncome: !0,
|
|
95
|
-
onSelected:
|
|
100
|
+
onSelected: d,
|
|
96
101
|
selectedId: o,
|
|
97
102
|
totalLabel: a.total_income
|
|
98
|
-
}), /* @__PURE__ */ e(
|
|
99
|
-
data:
|
|
100
|
-
onSelected:
|
|
103
|
+
}), /* @__PURE__ */ e(S, {
|
|
104
|
+
data: m,
|
|
105
|
+
onSelected: d,
|
|
101
106
|
selectedId: o
|
|
102
107
|
})]
|
|
103
108
|
})
|
|
104
109
|
})
|
|
105
110
|
]
|
|
106
111
|
});
|
|
107
|
-
},
|
|
112
|
+
}, Q = w(k);
|
|
108
113
|
export {
|
|
109
|
-
|
|
114
|
+
Q as default
|
|
110
115
|
};
|
|
111
116
|
|
|
112
117
|
//# sourceMappingURL=MiniSpendingChart.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MiniSpendingChart.es.js","names":[],"sources":["../../../src/spending/components/MiniSpendingChart.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\nimport { useTheme } from '@mui/material/styles'\n\nimport { useCategoryStore, useGlobalCopyStore } from '../../common'\nimport { getIncomeData, getSpendingData } from '../utils/SpendingData'\n\nimport SpendingTabLabel from './SpendingTabLabel'\nimport SpendingDonut from './SpendingDonut'\nimport SpendingLegend from './SpendingLegend'\n\nconst MiniSpendingChart = () => {\n const theme = useTheme()\n const { goals: goalsCopy
|
|
1
|
+
{"version":3,"file":"MiniSpendingChart.es.js","names":[],"sources":["../../../src/spending/components/MiniSpendingChart.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\nimport { useTheme } from '@mui/material/styles'\n\nimport { useCategoryStore, useGlobalCopyStore } from '../../common'\nimport { getIncomeData, getSpendingData } from '../utils/SpendingData'\n\nimport SpendingTabLabel from './SpendingTabLabel'\nimport SpendingDonut from './SpendingDonut'\nimport SpendingLegend from './SpendingLegend'\n\nconst MiniSpendingChart = () => {\n const theme = useTheme()\n const {\n categories: categoriesCopy,\n goals: goalsCopy,\n spending: spendingCopy,\n } = useGlobalCopyStore()\n const { categories, dateRangeCategoryTotals } = useCategoryStore()\n\n const incomeColors = React.useMemo(\n () => [\n theme.palette.chartMono.chartMono5,\n theme.palette.chartMono.chartMono4,\n theme.palette.chartMono.chartMono3,\n theme.palette.chartMono.chartMono2,\n theme.palette.chartMono.chartMono1,\n theme.palette.chartMono.chartMono6,\n ],\n [theme],\n ) as string[]\n\n const [selectedId, setSelectedId] = React.useState('')\n const [selectedTab, setSelectedTab] = React.useState(0)\n\n const spendingData = React.useMemo(\n () => getSpendingData(categories, goalsCopy, categoriesCopy, theme, dateRangeCategoryTotals),\n [categories, categoriesCopy, dateRangeCategoryTotals],\n )\n\n const incomeData = React.useMemo(\n () => getIncomeData(categories, categoriesCopy, dateRangeCategoryTotals, incomeColors),\n [categories, categoriesCopy, dateRangeCategoryTotals, incomeColors],\n )\n\n const handleTabChange = (_event: React.SyntheticEvent, newValue: number) => {\n setSelectedTab(newValue)\n setSelectedId('')\n }\n\n const handleSelected = (id: string) => {\n setSelectedId(selectedId === id ? '' : id)\n }\n\n return (\n <Box width=\"100%\">\n <Tabs\n aria-label={spendingCopy.mini_title}\n onChange={handleTabChange}\n sx={{ touchAction: 'manipulation' }}\n value={selectedTab}\n variant=\"fullWidth\"\n >\n <Tab\n aria-controls=\"spending-tabpanel\"\n id=\"spending-tab\"\n label={\n <SpendingTabLabel\n amount={spendingData.totalAmount}\n label={spendingCopy.spend_tab_title}\n variant=\"mini\"\n />\n }\n tabIndex={selectedTab === 0 ? 0 : -1}\n />\n <Tab\n aria-controls=\"income-tabpanel\"\n id=\"income-tab\"\n label={\n <SpendingTabLabel\n amount={incomeData.totalAmount}\n label={spendingCopy.income_tab_title}\n variant=\"mini\"\n />\n }\n tabIndex={selectedTab === 1 ? 0 : -1}\n />\n </Tabs>\n <Box\n aria-labelledby=\"spending-tab\"\n hidden={selectedTab !== 0}\n id=\"spending-tabpanel\"\n role=\"tabpanel\"\n >\n <Stack direction=\"row\" gap={16} justifyContent={'center'} p={24}>\n <SpendingDonut\n data={spendingData}\n onSelected={handleSelected}\n selectedId={selectedId}\n totalLabel={spendingCopy.total_spending}\n />\n\n <SpendingLegend data={spendingData} onSelected={handleSelected} selectedId={selectedId} />\n </Stack>\n </Box>\n <Box\n aria-labelledby=\"income-tab\"\n hidden={selectedTab !== 1}\n id=\"income-tabpanel\"\n role=\"tabpanel\"\n >\n <Stack direction=\"row\" gap={16} justifyContent={'center'} p={24}>\n <SpendingDonut\n data={incomeData}\n isIncome={true}\n onSelected={handleSelected}\n selectedId={selectedId}\n totalLabel={spendingCopy.total_income}\n />\n\n <SpendingLegend data={incomeData} onSelected={handleSelected} selectedId={selectedId} />\n </Stack>\n </Box>\n </Box>\n )\n}\n\nexport default observer(MiniSpendingChart)\n"],"mappings":"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"}
|