@mx-cartographer/experiences 6.26.33-alpha.mm0 → 7.0.0-alpha.mega1

package/dist/cashflow/index.es.js

@@ -0,0 +1,1098 @@
+import { jsxs as o, Fragment as B, jsx as e } from "react/jsx-runtime";
+import f, { useState as K } from "react";
+import { observer as T } from "mobx-react-lite";
+import D from "@mui/material/Box";
+import k from "@mui/material/Button";
+import v from "@mui/material/Divider";
+import r from "@mui/material/Stack";
+import ie from "@mui/material/styles/useTheme";
+import { Text as p, P as O, Icon as H, InstitutionLogo as xe, H1 as ce, H2 as qe } from "@mxenabled/mxui";
+import { G as Xe, t as le, u as L, p as ae, c as Oe, a as X, o as de, f as U, g as Ne, n as ke } from "../hooks-30y_BLwc.mjs";
+import { C as R } from "../CurrencyText-YUhH2caW.mjs";
+import { u as me } from "../useScreenSize-B6JyS_Lj.mjs";
+import { L as re } from "../Loader-Dp1P2gNw.mjs";
+import { I as ue } from "../CashflowStore-D9Dpuz7X.mjs";
+import { C as Hn } from "../CashflowStore-D9Dpuz7X.mjs";
+import { b as q } from "../Localization-2MODESHW.mjs";
+import { M as Ye } from "../MiniWidgetContainer-BoOp-A05.mjs";
+import { R as Qe } from "../RecurringSettings-D_HnMYZP.mjs";
+import Ve from "@mui/material/Tabs";
+import Ce from "@mui/material/Tab";
+import { getUnixTime as j } from "date-fns/getUnixTime";
+import Z from "@mui/material/List";
+import ee from "@mui/material/ListItem";
+import { A as Ke } from "../AccountListItem-DFlbdcmT.mjs";
+import { f as Y, D as Q } from "../Dialog-CWW597AF.mjs";
+import Je from "@mui/material/ListSubheader";
+import { f as J } from "../NumberFormatting-CtWHhyBX.mjs";
+import { isAfter as He } from "date-fns/isAfter";
+import { isBefore as Fe } from "date-fns/isBefore";
+import { isToday as We } from "date-fns/isToday";
+import { startOfToday as z } from "date-fns/startOfToday";
+import { addDays as we } from "date-fns/addDays";
+import { alpha as Ze, keyframes as et } from "@mui/material/styles";
+import { DataGridPro as tt } from "@mui/x-data-grid-pro";
+import { T as _e } from "../TabContentContainer-j01JYR_7.mjs";
+import { M as nt, S as ot, i as it, c as Se, b as at } from "../ManageIncome-ndMuhJMG.mjs";
+import { D as $e } from "../Drawer-kEE73B87.mjs";
+import { formatISO as rt } from "date-fns/formatISO";
+import { fromUnixTime as ye } from "date-fns/fromUnixTime";
+import { startOfMonth as st } from "date-fns/startOfMonth";
+import { subDays as Ge } from "date-fns/subDays";
+import { S as ct, b as lt } from "../TransactionDetails-WBHFmbxL.mjs";
+import { F as dt, R as Ie, e as De } from "../RepeatingTransaction-BPWfaB3f.mjs";
+import { h as mt } from "../DateUtil-BcuH7ErC.mjs";
+import { endOfToday as ut } from "date-fns/endOfToday";
+import { W as ve, A as Ae } from "../WidgetContainer-DWCusxYI.mjs";
+import { F as ht, A as M } from "../Fetch-CkFKy79O.mjs";
+const V = () => {
+  if (!f.useContext(Xe))
+    throw new Error("useCashflowUiStore() must be used within the GlobalDataContext");
+  return le().uiStore;
+}, pt = ({ remaining: i }) => {
+  const { cashflow: n } = L();
+  return /* @__PURE__ */ o(B, { children: [
+    /* @__PURE__ */ e(
+      D,
+      {
+        sx: {
+          borderRadius: "1px",
+          backgroundColor: i < 0 ? "error.main" : i > 0 ? "success.main" : "warning.main",
+          height: 6,
+          width: 6
+        }
+      }
+    ),
+    /* @__PURE__ */ e(p, { bold: !0, sx: { flexGrow: 1, fontSize: 12 }, children: n.remaining_cash }),
+    /* @__PURE__ */ e(R, { amount: i, bold: !0, sx: { fontSize: 12 } })
+  ] });
+}, he = T(pt), ft = ({ onAddIncomeClick: i }) => {
+  const n = ie(), { availableWidth: t } = ae(), { isMobile: s } = me(), { visibleCashAccounts: d, visibleCashBalance: g } = Oe(), { selectedAccountGuids: m } = X(), { cashflow: c } = L(), { userProfile: C } = de(), {
+    daysUntilNextIncome: a,
+    expensesTilNextIncome: u,
+    selectedCashAccounts: l,
+    setNextIncome: b,
+    setSelectedCashAccounts: _,
+    setUpcomingExpenses: S
+  } = V(), { isDataLoaded: y, nextIncomeRecurrence: h, upcomingExpenses: I } = U();
+  f.useEffect(() => {
+    _(
+      d.filter((w) => m.includes(w.guid))
+    );
+  }, [d, m]), f.useEffect(() => {
+    h && b(h), S(I);
+  }, [h, I]);
+  const A = f.useMemo(
+    () => d.filter((w) => m.includes(w.guid)).reduce((w, G) => w + (G?.balance || 0), 0),
+    [m, I]
+  ), F = f.useMemo(
+    () => u.filter((w) => m.includes(w.accountGuid || "")).reduce((w, G) => w + G.amount, 0),
+    [m, u]
+  ), P = f.useMemo(
+    () => A - F,
+    [A, F]
+  ), $ = C?.has_completed_cash_flow_onboarding && !!i;
+  return y ? /* @__PURE__ */ e(D, { className: "mx-cashflow", pl: 16, pr: 16, pt: 16, children: t > 610 ? /* @__PURE__ */ o(
+    r,
+    {
+      border: `1px solid ${n.palette.border.light}`,
+      borderRadius: 1,
+      direction: "row",
+      justifyContent: "space-between",
+      px: 24,
+      children: [
+        /* @__PURE__ */ o(r, { pb: 14, pt: 12, children: [
+          /* @__PURE__ */ e(R, { amount: A, variant: "H2" }),
+          /* @__PURE__ */ e(O, { variant: "XSmall", whiteSpace: "nowrap", children: q(
+            c.total_cash_accounts,
+            l.length
+          ) })
+        ] }),
+        /* @__PURE__ */ e(r, { pt: 18, children: /* @__PURE__ */ e(H, { name: "remove" }) }),
+        /* @__PURE__ */ o(r, { pb: 14, pt: 12, children: [
+          /* @__PURE__ */ e(R, { amount: F, variant: "H2" }),
+          /* @__PURE__ */ e(O, { variant: "XSmall", whiteSpace: "nowrap", children: q(c.expenses_due, u.length) })
+        ] }),
+        /* @__PURE__ */ e(r, { pt: 18, children: /* @__PURE__ */ e(H, { name: "equal" }) }),
+        /* @__PURE__ */ o(r, { pb: 14, pr: 24, pt: 12, children: [
+          /* @__PURE__ */ e(R, { amount: P, variant: "H2" }),
+          /* @__PURE__ */ o(r, { alignItems: "center", direction: "row", gap: 8, children: [
+            /* @__PURE__ */ e(O, { variant: "XSmall", whiteSpace: "nowrap", children: c.available_to_spend }),
+            /* @__PURE__ */ e(ue, { body: c.tooltip_body, title: c.tooltip_title })
+          ] })
+        ] }),
+        /* @__PURE__ */ e(r, { borderLeft: `1px solid ${n.palette.border.light}`, pb: 12, pl: 24, pt: 12, children: $ ? /* @__PURE__ */ o(B, { children: [
+          /* @__PURE__ */ e(p, { variant: "H2", children: q(c.days, a) }),
+          /* @__PURE__ */ e(O, { variant: "XSmall", whiteSpace: "nowrap", children: c.next_paycheck })
+        ] }) : /* @__PURE__ */ e(
+          k,
+          {
+            onClick: i,
+            startIcon: /* @__PURE__ */ e(H, { name: "add" }),
+            sx: { fontSize: 13, lineHeight: "initial" },
+            children: c.add_income
+          }
+        ) })
+      ]
+    }
+  ) : /* @__PURE__ */ o(r, { border: `1px solid ${n.palette.border.light}`, borderRadius: 1, children: [
+    /* @__PURE__ */ o(r, { direction: "row", justifyContent: "space-between", p: 16, children: [
+      /* @__PURE__ */ e(p, { variant: "Small", children: q(
+        c.total_cash_accounts,
+        l.length
+      ) }),
+      /* @__PURE__ */ e(R, { amount: g, bold: !0, variant: "XSmall" })
+    ] }),
+    /* @__PURE__ */ e(v, {}),
+    /* @__PURE__ */ o(r, { direction: "row", justifyContent: "space-between", p: 16, children: [
+      /* @__PURE__ */ e(p, { variant: "Small", children: q(c.expenses_due, u.length) }),
+      /* @__PURE__ */ e(R, { amount: F, bold: !0, symbol: "-", variant: "XSmall" })
+    ] }),
+    /* @__PURE__ */ e(v, {}),
+    /* @__PURE__ */ e(
+      r,
+      {
+        alignItems: "center",
+        bgcolor: "background.default",
+        direction: "row",
+        gap: 8,
+        height: 48,
+        justifyContent: "space-between",
+        px: 16,
+        sx: { borderBottomLeftRadius: 4, borderBottomRightRadius: 4 },
+        children: /* @__PURE__ */ e(he, { remaining: P })
+      }
+    ),
+    /* @__PURE__ */ e(v, {}),
+    $ ? /* @__PURE__ */ o(r, { direction: "row", justifyContent: "space-between", p: 16, children: [
+      /* @__PURE__ */ e(p, { variant: "Small", children: c.next_paycheck }),
+      /* @__PURE__ */ e(p, { bold: !0, variant: "XSmall", children: q(c.days, a) })
+    ] }) : /* @__PURE__ */ o(
+      r,
+      {
+        alignItems: "center",
+        direction: "row",
+        justifyContent: "space-between",
+        pl: 16,
+        pr: 2,
+        py: 2,
+        children: [
+          /* @__PURE__ */ e(p, { variant: "Small", children: c.next_paycheck }),
+          /* @__PURE__ */ e(
+            k,
+            {
+              onClick: i,
+              startIcon: /* @__PURE__ */ e(H, { name: "add" }),
+              sx: { fontSize: 13 },
+              children: c.add_income
+            }
+          )
+        ]
+      }
+    )
+  ] }) }) : /* @__PURE__ */ e(re, { height: s ? 210 : 120 });
+}, gt = T(ft), bt = ({ onPrimaryCtaClick: i, sx: n = {} }) => {
+  const { cashflow: t } = L(), { isCopyLoaded: s, isInitialized: d } = X(), { loadRepeatingTransactions: g } = U();
+  return f.useEffect(() => {
+    d && g().finally();
+  }, [d]), s ? /* @__PURE__ */ e(
+    Ye,
+    {
+      className: "mx-exp-cashflow-miniwidget",
+      onPrimaryCtaClick: i,
+      primaryCtaLabel: t.primary_cta,
+      subTitle: t.sub_title,
+      sx: n,
+      title: t.title,
+      children: /* @__PURE__ */ e(gt, { onAddIncomeClick: i })
+    }
+  ) : /* @__PURE__ */ e(re, {});
+}, Rn = T(bt), xt = ({ remaining: i }) => /* @__PURE__ */ e(
+  ee,
+  {
+    sx: {
+      alignItems: "center",
+      backgroundColor: "background.highlight",
+      display: "flex",
+      gap: 12,
+      padding: "12px 24px",
+      borderBottomLeftRadius: "3px",
+      borderBottomRightRadius: "3px",
+      minHeight: "auto"
+    },
+    children: /* @__PURE__ */ e(he, { remaining: i })
+  }
+);
+var te = /* @__PURE__ */ ((i) => (i.EXPENSE = "expense", i.INCOME = "income", i))(te || {});
+const Ct = ({ recurrence: i }) => /* @__PURE__ */ o(B, { children: [
+  /* @__PURE__ */ o(ee, { sx: { display: "flex", alignItems: "center", gap: 16, px: 24, py: 12 }, children: [
+    /* @__PURE__ */ o(r, { alignItems: "center", height: 32, width: 32, children: [
+      /* @__PURE__ */ e(p, { bold: !0, sx: { fontSize: 11 }, children: Y(i.expectedDate, Q.MONTH) }),
+      /* @__PURE__ */ e(p, { bold: !0, sx: { fontSize: 11 }, children: Y(i.expectedDate, Q.DAY) })
+    ] }),
+    /* @__PURE__ */ e(p, { sx: { flexGrow: 1, fontSize: 13 }, children: i.name }),
+    /* @__PURE__ */ e(
+      R,
+      {
+        amount: i.amount,
+        bold: !0,
+        sx: { textAlign: "right", fontSize: 13 }
+      }
+    )
+  ] }),
+  /* @__PURE__ */ e(v, {})
+] }), Ee = T(Ct), wt = ({ total: i, type: n }) => {
+  const { cashflow: t } = L();
+  return /* @__PURE__ */ o(B, { children: [
+    /* @__PURE__ */ o(
+      Je,
+      {
+        sx: {
+          alignItems: "center",
+          backgroundColor: "background.highlight",
+          display: "flex",
+          justifyContent: "space-between",
+          pb: 4,
+          pt: 12,
+          px: 24
+        },
+        children: [
+          /* @__PURE__ */ e(p, { bold: !0, sx: { fontSize: 12 }, children: n === te.EXPENSE ? t.expenses : t.income }),
+          /* @__PURE__ */ o(p, { bold: !0, sx: { fontSize: 13 }, children: [
+            n === te.EXPENSE ? "-" : "+",
+            J(i, "0,0.00")
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(v, {})
+  ] });
+}, Te = T(wt), oe = (i, n) => (t) => t.accountGuid === i.guid && (We(t.expectedDate) || He(t.expectedDate, n.start)) && Fe(t.expectedDate, n.end), _t = () => {
+  const { availableWidth: i } = ae(), { cashflow: n } = L(), { upcomingExpenses: t, upcomingIncome: s } = U(), { dateRange: d, selectedCashAccounts: g } = V();
+  return /* @__PURE__ */ o(r, { children: [
+    /* @__PURE__ */ o(r, { direction: i < 400 ? "column" : "row", justifyContent: "space-between", children: [
+      /* @__PURE__ */ e(p, { bold: !0, sx: { fontSize: 15, mb: 12, whiteSpace: "normal" }, children: n.accounts_breakdown }),
+      /* @__PURE__ */ o(p, { bold: !0, sx: { fontSize: 15, mb: 12, whiteSpace: "normal" }, children: [
+        Y(d.start, Q.FULL_MONTH_DAY),
+        " -",
+        " ",
+        Y(d.end, Q.FULL_MONTH_DAY)
+      ] })
+    ] }),
+    /* @__PURE__ */ e(r, { children: g.map((m) => {
+      const c = s.filter(oe(m, d)).sort((l, b) => j(l.expectedDate) - j(b.expectedDate)), C = t.filter(
+        oe(m, d)
+      ), a = c.reduce(
+        (l, b) => l + b.amount,
+        0
+      ), u = C.reduce(
+        (l, b) => l + b.amount,
+        0
+      );
+      return /* @__PURE__ */ o(
+        Z,
+        {
+          sx: {
+            border: "1px solid",
+            borderColor: "border.light",
+            mb: 24,
+            borderRadius: 1
+          },
+          children: [
+            /* @__PURE__ */ e(
+              Ke,
+              {
+                account: m,
+                listItemProps: {
+                  disableGutters: !1,
+                  disablePadding: !1,
+                  sx: { borderTopRadius: 1, pr: 24 }
+                }
+              }
+            ),
+            /* @__PURE__ */ e(v, {}),
+            c.length > 0 && /* @__PURE__ */ e(ee, { children: /* @__PURE__ */ e(
+              Z,
+              {
+                subheader: /* @__PURE__ */ e(Te, { total: a, type: te.INCOME }),
+                sx: { width: "100%" },
+                children: c.map((l) => /* @__PURE__ */ e(Ee, { recurrence: l }, l.repeatingTransactionGuid))
+              }
+            ) }),
+            C.length > 0 && /* @__PURE__ */ e(ee, { children: /* @__PURE__ */ e(
+              Z,
+              {
+                subheader: /* @__PURE__ */ e(Te, { total: u, type: te.EXPENSE }),
+                sx: { width: "100%" },
+                children: C.map((l) => /* @__PURE__ */ e(Ee, { recurrence: l }, l.repeatingTransactionGuid))
+              }
+            ) }),
+            /* @__PURE__ */ e(
+              xt,
+              {
+                remaining: (m.available_balance || m.balance || 0) + a - u
+              }
+            )
+          ]
+        },
+        m.guid
+      );
+    }) })
+  ] });
+}, St = T(_t), yt = () => {
+  const { availableWidth: i } = ae(), n = ie(), { cashflow: t } = L(), { upcomingExpenses: s, upcomingIncome: d } = U(), { dateRange: g, selectedCashAccounts: m } = V(), c = [
+    {
+      field: "account",
+      flex: 1.5,
+      headerName: t.accounts,
+      renderCell: ({ value: { name: a, nickname: u, institution_guid: l, account_number: b } }) => {
+        const _ = u || a;
+        return /* @__PURE__ */ o(r, { alignItems: "center", flexDirection: "row", gap: 12, children: [
+          /* @__PURE__ */ e(
+            xe,
+            {
+              alt: t.institution_logo,
+              institutionGuid: l || "",
+              size: 16
+            }
+          ),
+          `${_} ${b ? `*${b}` : ""}`
+        ] });
+      }
+    },
+    {
+      field: "balance",
+      flex: 1,
+      headerName: t.balance,
+      type: "number",
+      renderCell: (a) => J(a.value, "0,0.00")
+    },
+    {
+      field: "income",
+      flex: 1,
+      headerName: t.projected_income,
+      type: "number",
+      renderCell: (a) => `+${J(a.value, "0,0.00")}`
+    },
+    {
+      field: "expenses",
+      flex: 1.1,
+      headerName: t.projected_expenses,
+      type: "number",
+      renderCell: (a) => `-${J(a.value, "0,0.00")}`
+    },
+    {
+      field: "remaining",
+      flex: 1,
+      headerName: t.remaining,
+      type: "number",
+      renderCell: (a) => {
+        const u = a.row.balance + a.row.income - a.row.expenses;
+        return /* @__PURE__ */ e(
+          p,
+          {
+            color: Math.sign(u) === -1 ? n.palette.error.main : n.palette.text.primary,
+            variant: "Small",
+            children: J(u, "0,0.00")
+          }
+        );
+      }
+    }
+  ], C = f.useMemo(() => m.map((a) => {
+    const u = s.filter(
+      oe(a, { start: z(), end: we(z(), 30) })
+    ).reduce((_, S) => _ + S.amount, 0), l = d.filter(
+      oe(a, { start: z(), end: we(z(), 30) })
+    ).reduce((_, S) => _ + S.amount, 0), b = (a.balance || 0) + l - u;
+    return {
+      account: a,
+      balance: a.balance || 0,
+      id: a.guid,
+      income: l,
+      expenses: u,
+      remaining: b
+    };
+  }), [m, s, d]);
+  return /* @__PURE__ */ o(
+    D,
+    {
+      sx: {
+        width: "100%"
+      },
+      children: [
+        /* @__PURE__ */ o(
+          r,
+          {
+            direction: i < 540 ? "column" : "row",
+            justifyContent: "space-between",
+            mb: 12,
+            children: [
+              /* @__PURE__ */ o(r, { alignItems: "center", direction: "row", gap: 8, children: [
+                /* @__PURE__ */ e(
+                  p,
+                  {
+                    bold: !0,
+                    sx: {
+                      fontSize: 15,
+                      whiteSpace: "normal"
+                    },
+                    children: t.cash_inflow_and_outflow
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  ue,
+                  {
+                    body: t.table_tooltip_body,
+                    title: t.table_tooltip_title
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ o(p, { bold: !0, sx: { fontSize: 15, whiteSpace: "normal" }, children: [
+                Y(g.start, Q.FULL_MONTH_DAY),
+                " -",
+                " ",
+                Y(g.end, Q.FULL_MONTH_DAY)
+              ] })
+            ]
+          }
+        ),
+        i > 650 ? /* @__PURE__ */ e(
+          tt,
+          {
+            columnHeaderHeight: 48,
+            columns: c,
+            density: "standard",
+            disableColumnMenu: !0,
+            disableRowSelectionOnClick: !0,
+            hideFooter: !0,
+            rowHeight: 48,
+            rows: C,
+            sx: {
+              border: "1px solid",
+              borderColor: "border.light",
+              borderRadius: 1,
+              "& .MuiDataGrid-columnHeader .MuiIconButton-root": {
+                color: n.palette.primary.main,
+                "&:hover": {
+                  backgroundColor: Ze(n.palette.primary.main, 0.1)
+                }
+              },
+              "& .MuiDataGrid-sortIcon": {
+                color: n.palette.primary.main
+              }
+            }
+          }
+        ) : C.map((a) => {
+          const { name: u, nickname: l, institution_guid: b, account_number: _ } = a.account, S = l || u;
+          return /* @__PURE__ */ e(
+            Z,
+            {
+              sx: {
+                border: "1px solid",
+                borderColor: "border.light",
+                borderRadius: 1,
+                marginBottom: 24
+              },
+              children: /* @__PURE__ */ e(ee, { sx: { minHeight: "auto" }, children: /* @__PURE__ */ o(r, { width: "100%", children: [
+                /* @__PURE__ */ o(
+                  r,
+                  {
+                    alignItems: "center",
+                    flexDirection: "row",
+                    justifyContent: "space-between",
+                    px: 16,
+                    py: 12,
+                    children: [
+                      /* @__PURE__ */ o(r, { alignItems: "center", flexDirection: "row", gap: 8, width: "50%", children: [
+                        /* @__PURE__ */ e(
+                          xe,
+                          {
+                            alt: t.institution_logo,
+                            institutionGuid: b || "",
+                            size: 16
+                          }
+                        ),
+                        /* @__PURE__ */ e(p, { variant: "Small", children: `${S} ${_ ? `*${_}` : ""}` })
+                      ] }),
+                      /* @__PURE__ */ e(R, { amount: a.balance, bold: !0, variant: "Small" })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ e(v, { sx: { width: "100%" } }),
+                /* @__PURE__ */ o(
+                  r,
+                  {
+                    alignItems: "center",
+                    flexDirection: "row",
+                    justifyContent: "space-between",
+                    px: 16,
+                    py: 12,
+                    children: [
+                      /* @__PURE__ */ e(p, { variant: "Small", children: t.projected_income }),
+                      /* @__PURE__ */ e(R, { amount: a.income, bold: !0, symbol: "+", variant: "Small" })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ e(v, { sx: { width: "100%" } }),
+                /* @__PURE__ */ o(
+                  r,
+                  {
+                    alignItems: "center",
+                    flexDirection: "row",
+                    justifyContent: "space-between",
+                    px: 16,
+                    py: 12,
+                    children: [
+                      /* @__PURE__ */ e(p, { variant: "Small", children: t.projected_expenses }),
+                      /* @__PURE__ */ e(R, { amount: a.expenses, bold: !0, symbol: "-", variant: "Small" })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ e(v, { sx: { width: "100%" } }),
+                /* @__PURE__ */ e(
+                  r,
+                  {
+                    alignItems: "center",
+                    bgcolor: "background.default",
+                    flexDirection: "row",
+                    gap: 8,
+                    justifyContent: "space-between",
+                    px: 16,
+                    py: 12,
+                    sx: { borderBottomLeftRadius: "4px", borderBottomRightRadius: "4px" },
+                    children: /* @__PURE__ */ e(he, { remaining: a.remaining })
+                  }
+                )
+              ] }) })
+            },
+            a.id
+          );
+        })
+      ]
+    }
+  );
+}, It = T(yt), Dt = () => {
+  const { cashflow: i } = L(), { isDesktop: n } = me(), { onEvent: t } = Ne(), [s, d] = f.useState(0), g = (m, c) => {
+    d(c);
+  };
+  return f.useEffect(() => {
+    t(s === 0 ? "cash_flow_summary" : "cash_flow_details");
+  }, [s]), /* @__PURE__ */ o(D, { children: [
+    /* @__PURE__ */ o(
+      Ve,
+      {
+        "aria-label": i.cashflow_summary_and_details,
+        centered: !0,
+        onChange: g,
+        textColor: "primary",
+        value: s,
+        variant: "fullWidth",
+        children: [
+          /* @__PURE__ */ e(
+            Ce,
+            {
+              "aria-controls": "cashflow-tabpanel-0",
+              id: "cashflow-tab-0",
+              label: i.summary,
+              sx: {
+                textTransform: "none"
+              }
+            }
+          ),
+          /* @__PURE__ */ e(
+            Ce,
+            {
+              "aria-controls": "cashflow-tabpanel-1",
+              id: "cashflow-tab-1",
+              label: i.details,
+              sx: {
+                textTransform: "none"
+              }
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(D, { sx: { mb: 32 } }),
+    /* @__PURE__ */ e(_e, { index: 0, name: "cashflow", value: s, children: /* @__PURE__ */ e(D, { sx: { m: n ? 48 : 16 }, children: /* @__PURE__ */ e(It, {}) }) }),
+    /* @__PURE__ */ e(_e, { index: 1, name: "cashflow", value: s, children: /* @__PURE__ */ e(D, { sx: { m: n ? 48 : 16 }, children: /* @__PURE__ */ e(St, {}) }) })
+  ] });
+}, vt = T(Dt), ne = ({
+  amount: i,
+  isMobile: n = !1,
+  isTotal: t = !1,
+  label: s,
+  symbol: d,
+  tooltip: g
+}) => /* @__PURE__ */ o(
+  r,
+  {
+    bgcolor: t ? "background.default" : "transparent",
+    direction: n ? "row" : "column",
+    justifyContent: n ? "space-between" : "initial",
+    padding: n ? "14px 16px" : 0,
+    sx: { borderBottomLeftRadius: 4, borderBottomRightRadius: 4 },
+    children: [
+      !n && /* @__PURE__ */ e(R, { amount: i, component: "h2", variant: "H2" }),
+      /* @__PURE__ */ o(r, { alignItems: "center", component: "span", direction: "row", gap: 8, mt: 2, children: [
+        /* @__PURE__ */ e(p, { bold: t, variant: "Small", children: s }),
+        g
+      ] }),
+      n && /* @__PURE__ */ e(R, { amount: i, component: "h2", symbol: d, variant: "Small" })
+    ]
+  }
+), Re = (i, n) => (t) => t.accountGuid && i.includes(t.accountGuid) && (We(t.expectedDate) || He(t.expectedDate, n.start)) && Fe(t.expectedDate, n.end), At = () => {
+  const { availableWidth: i } = ae(), { cashflow: n } = L(), { upcomingExpenses: t, upcomingIncome: s } = U(), { selectedAccountGuids: d } = X(), { dateRange: g, selectedCashAccounts: m } = V(), { userProfile: c } = de(), [C, a] = f.useState(!1), u = f.useMemo(
+    () => t.filter(Re(d, g)),
+    [g, d, t]
+  ), l = f.useMemo(
+    () => s.filter(Re(d, g)),
+    [g, d, s]
+  ), b = f.useMemo(
+    () => m.reduce((I, A) => I + (A?.balance || 0), 0),
+    [m]
+  ), _ = u.reduce((I, A) => I + A.amount, 0), S = l.reduce((I, A) => I + A.amount, 0), y = b - _ + S, h = i < 725;
+  return /* @__PURE__ */ o(r, { sx: { mx: h ? 16 : 0, my: h ? 24 : 42 }, children: [
+    /* @__PURE__ */ o(
+      r,
+      {
+        border: h ? "1px solid" : "none",
+        borderColor: "border.light",
+        borderRadius: 2,
+        flexDirection: h ? "column" : "row",
+        gap: h ? 0 : 24,
+        justifyContent: "center",
+        children: [
+          /* @__PURE__ */ e(
+            ne,
+            {
+              amount: b,
+              isMobile: h,
+              label: n.cash_and_bank
+            }
+          ),
+          h && /* @__PURE__ */ e(v, {}),
+          c?.has_completed_cash_flow_onboarding ? /* @__PURE__ */ o(B, { children: [
+            !h && /* @__PURE__ */ e(p, { sx: { fontSize: 25, lineHeight: 1 }, children: "+" }),
+            /* @__PURE__ */ e(
+              ne,
+              {
+                amount: S,
+                isMobile: h,
+                label: n.to_be_received,
+                symbol: h ? "+" : void 0
+              }
+            )
+          ] }) : /* @__PURE__ */ e(
+            k,
+            {
+              onClick: () => a(!0),
+              startIcon: /* @__PURE__ */ e(H, { name: "add" }),
+              sx: { fontSize: 13 },
+              children: n.add_income
+            }
+          ),
+          h ? /* @__PURE__ */ e(v, {}) : /* @__PURE__ */ e(p, { sx: { fontSize: 25, lineHeight: 1 }, children: "-" }),
+          /* @__PURE__ */ e(
+            ne,
+            {
+              amount: _,
+              isMobile: h,
+              label: n.to_be_paid_out,
+              symbol: h ? "-" : void 0
+            }
+          ),
+          h ? /* @__PURE__ */ e(v, {}) : /* @__PURE__ */ e(p, { sx: { fontSize: 25, lineHeight: 1 }, children: "=" }),
+          /* @__PURE__ */ e(
+            ne,
+            {
+              amount: y,
+              isMobile: h,
+              isTotal: h,
+              label: n.remaining_cash,
+              tooltip: /* @__PURE__ */ e(
+                ue,
+                {
+                  body: n.remaining_income_tooltip_body,
+                  title: n.remaining_income_tooltip_title
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      $e,
+      {
+        ariaLabelClose: n.close_manage_income_aria,
+        isOpen: C,
+        onClose: () => a(!1),
+        shouldShowHeaderBorders: !1,
+        title: n.manage_income,
+        children: /* @__PURE__ */ e(nt, {})
+      }
+    )
+  ] });
+}, Et = T(At), Tt = ({ handleNextStep: i }) => {
+  const { completeOnboarding: n } = le(), { cashflow: t } = L(), s = ie();
+  return /* @__PURE__ */ o(r, { children: [
+    /* @__PURE__ */ e(ce, { pb: 12, children: t.welcome_title }),
+    /* @__PURE__ */ e(
+      qe,
+      {
+        color: s.palette.primary.light,
+        pb: 8,
+        sx: { wordBreak: "break-word", whiteSpace: "initial" },
+        variant: "H3",
+        children: t.welcome_sub_title
+      }
+    ),
+    /* @__PURE__ */ e(O, { pb: 32, children: t.welcome_description }),
+    /* @__PURE__ */ o(r, { direction: "column", mb: 32, spacing: 32, children: [
+      /* @__PURE__ */ o(O, { sx: { display: "flex", alignItems: "center", fontSize: 18 }, children: [
+        /* @__PURE__ */ e(
+          D,
+          {
+            bgcolor: s.palette.primary.lighter,
+            borderRadius: 1,
+            component: "span",
+            height: 44,
+            mr: 24,
+            sx: { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 },
+            width: 44,
+            children: /* @__PURE__ */ e(H, { color: "primary", name: "currency_exchange" })
+          }
+        ),
+        t.bullet_one
+      ] }),
+      /* @__PURE__ */ o(O, { sx: { display: "flex", alignItems: "center", fontSize: 18 }, children: [
+        /* @__PURE__ */ e(
+          D,
+          {
+            bgcolor: s.palette.primary.lighter,
+            borderRadius: 1,
+            component: "span",
+            height: 44,
+            mr: 24,
+            sx: { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 },
+            width: 44,
+            children: /* @__PURE__ */ e(H, { color: "primary", name: "cardiology" })
+          }
+        ),
+        t.bullet_two
+      ] }),
+      /* @__PURE__ */ o(O, { sx: { display: "flex", alignItems: "center", fontSize: 18 }, children: [
+        /* @__PURE__ */ e(
+          D,
+          {
+            bgcolor: s.palette.primary.lighter,
+            borderRadius: 1,
+            component: "span",
+            height: 44,
+            mr: 24,
+            sx: { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 },
+            width: 44,
+            children: /* @__PURE__ */ e(H, { color: "primary", name: "flare" })
+          }
+        ),
+        t.bullet_three
+      ] })
+    ] }),
+    /* @__PURE__ */ o(r, { direction: "row", spacing: 16, children: [
+      /* @__PURE__ */ e(k, { onClick: i, variant: "contained", children: t.get_started_button }),
+      /* @__PURE__ */ e(k, { onClick: n, variant: "outlined", children: t.skip_button })
+    ] })
+  ] });
+}, Rt = T(Tt), Le = "https://content.moneydesktop.com/storage/MD_Assets/md/cashflow", Me = {
+  CASHFLOW_ONBOARDING: `${Le}/cashflow-onboarding.png`,
+  CASHFLOW_LOADING_ANIMATION: `${Le}/loading-animation.gif`
+}, Lt = () => {
+  const { cashflow: i } = L();
+  return /* @__PURE__ */ o(f.Fragment, { children: [
+    /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("img", { alt: "Loading", src: Me.CASHFLOW_LOADING_ANIMATION }) }),
+    /* @__PURE__ */ e(ce, { pb: 12, children: i.loading_title }),
+    /* @__PURE__ */ e(O, { children: i.loading_description })
+  ] });
+}, Ot = T(Lt), Nt = et`
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+`, kt = () => {
+  const { addRepeatingTransaction: i, repeatingTransactions: n } = U(), { cashflow: t, common: s } = L(), { completeOnboarding: d } = le(), { isDirty: g } = V(), { isMobile: m } = me(), { isCopyLoaded: c, setDisplayedDate: C } = X(), { filter: a, setFilter: u, transactions: l } = ke(), b = ie(), [_, S] = K(!0), [y, h] = f.useState(dt.EveryMonth), [I, A] = f.useState(1), [F, P] = f.useState(15), [$, w] = K(!1), [G, pe] = K(1), [N, je] = K([]), [fe, se] = K(""), W = f.useMemo(
+    () => l.find((x) => x.guid === fe),
+    [fe, l]
+  ), ze = !!n.filter(
+    (x) => x.repeating_transaction_type === Ie.Income
+  ).length, ge = async () => {
+    pe(2), C(
+      //  Beginning of the month, 90 days before today
+      st(Ge(z(), 90)),
+      z()
+    ), u({ ...a, custom: Se }), pe(3);
+  }, Be = async () => {
+    if (!(N.length < 1)) {
+      w(!0);
+      for (let x = 0; x < N.length; x++) {
+        const E = N[x], be = De(y, ye(E.date)), Pe = {
+          account_guid: E.account_guid,
+          amount: E.amount,
+          merchant_guid: E.merchant_guid,
+          description: E.feed_description || E.description,
+          predicted_occurs_on: rt(be, { representation: "date" }),
+          recurrence_day: be.getDay(),
+          recurrence_type: y,
+          repeating_transaction_type: Ie.Income,
+          transaction_type: E.transaction_type
+        };
+        await i(Pe, E);
+      }
+      await d();
+    }
+  }, Ue = !W && _ || !W && N.length < 1;
+  return c ? /* @__PURE__ */ o(
+    D,
+    {
+      sx: {
+        display: "flex",
+        alignItems: m ? "flex-start" : "center",
+        backgroundColor: b.palette.background.paper,
+        backgroundImage: m ? null : `url(${Me.CASHFLOW_ONBOARDING})`,
+        backgroundRepeat: "no-repeat",
+        backgroundPosition: "left 100px",
+        backgroundSize: "35%",
+        py: 24
+      },
+      children: [
+        G === 1 && /* @__PURE__ */ e(
+          D,
+          {
+            sx: {
+              ...m ? { display: "flex", flexDirection: "column", maxWidth: "100%", padding: "0 16px" } : { maxWidth: 590, ml: "40%", mr: 90 }
+            },
+            children: /* @__PURE__ */ e(Rt, { handleNextStep: ge })
+          }
+        ),
+        G === 2 && /* @__PURE__ */ e(
+          D,
+          {
+            sx: {
+              ...m ? { display: "flex", flexDirection: "column", maxWidth: "100%", padding: "0 16px" } : { maxWidth: 590, ml: "40%", mr: 90 }
+            },
+            children: /* @__PURE__ */ e(Ot, {})
+          }
+        ),
+        G === 3 && /* @__PURE__ */ o(
+          D,
+          {
+            sx: {
+              ...m ? { display: "flex", flexDirection: "column", maxWidth: "100%", padding: "0 16px" } : { maxWidth: 590, ml: "40%", mr: 90 }
+            },
+            children: [
+              /* @__PURE__ */ e(ce, { pb: 12, children: t.add_income_title }),
+              /* @__PURE__ */ e(O, { mb: 24, children: t.add_income_description }),
+              N.length > 0 && !W && /* @__PURE__ */ o(B, { children: [
+                /* @__PURE__ */ e(Z, { children: N.map((x, E) => /* @__PURE__ */ o(f.Fragment, { children: [
+                  /* @__PURE__ */ e(ct, { bgcolor: "background.paper", children: mt(
+                    j(x.nextDate || x.date)
+                  ) }),
+                  /* @__PURE__ */ e(lt, { transaction: x }),
+                  E !== N.length - 1 && /* @__PURE__ */ e(v, {})
+                ] }, x.guid)) }),
+                /* @__PURE__ */ o(r, { alignItems: "center", direction: "row", children: [
+                  /* @__PURE__ */ e(v, { sx: { flexGrow: 1 } }),
+                  /* @__PURE__ */ e(
+                    k,
+                    {
+                      onClick: () => S(!0),
+                      startIcon: /* @__PURE__ */ e(H, { name: "add", size: 20 }),
+                      children: t.add_income
+                    }
+                  )
+                ] })
+              ] }),
+              Ue && /* @__PURE__ */ e(
+                ot,
+                {
+                  bgcolor: "background.paper",
+                  onSearch: (x) => u({
+                    ...a,
+                    custom: (E) => x ? it(E, x) : Se(E)
+                  }),
+                  onSelected: (x) => {
+                    se(x), S(!1);
+                  }
+                }
+              ),
+              !ze && g && /* @__PURE__ */ e(O, { color: "error", mt: 16, children: t.confirm_error }),
+              W && /* @__PURE__ */ o(B, { children: [
+                /* @__PURE__ */ e(
+                  at,
+                  {
+                    bgcolor: "background.paper",
+                    firstDay: I,
+                    frequency: y,
+                    onFirstDayChange: A,
+                    onFrequencyChange: h,
+                    onSecondDayChange: P,
+                    secondDay: F,
+                    transaction: W
+                  }
+                ),
+                /* @__PURE__ */ o(r, { direction: "row", gap: 16, ml: 24, mt: 32, children: [
+                  /* @__PURE__ */ e(
+                    k,
+                    {
+                      "aria-disabled": !W,
+                      onClick: () => {
+                        const x = [...N];
+                        x.push({
+                          ...W,
+                          nextDate: De(y, ye(W.date)),
+                          frequency: y
+                        }), je(x), se("");
+                      },
+                      variant: "contained",
+                      children: s.confirm_button
+                    }
+                  ),
+                  /* @__PURE__ */ e(
+                    k,
+                    {
+                      onClick: () => {
+                        se(""), S(!0), ge().finally();
+                      },
+                      variant: "outlined",
+                      children: s.cancel_button
+                    }
+                  )
+                ] })
+              ] }),
+              N.length > 0 && !W && /* @__PURE__ */ o(r, { direction: "row", gap: 16, ml: 24, mt: 32, children: [
+                /* @__PURE__ */ e(
+                  k,
+                  {
+                    "aria-disabled": N.length < 1 || $,
+                    onClick: Be,
+                    startIcon: $ ? /* @__PURE__ */ e(
+                      H,
+                      {
+                        name: "progress_activity",
+                        sx: {
+                          animation: `${Nt} 2s linear infinite`
+                        }
+                      }
+                    ) : null,
+                    variant: "contained",
+                    children: t.confirm_income_button
+                  }
+                ),
+                /* @__PURE__ */ e(k, { onClick: d, variant: "outlined", children: t.skip_button })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ e(re, {});
+}, Ht = T(kt), Ft = ({ onBackClick: i, sx: n = {} }) => {
+  const {
+    selectedAccounts: t,
+    selectedAccountGuids: s,
+    setSelectedAccounts: d,
+    shouldDisableNextDate: g,
+    shouldDisablePrevDate: m
+  } = X(), { onEvent: c } = Ne(), { visibleCashAccounts: C } = Oe(), { setFilter: a } = ke(), { userProfile: u } = de(), { dateRange: l, setSelectedCashAccounts: b } = V(), { loadRepeatingTransactions: _, setDateRange: S } = U(), { cashflow: y } = L(), { isCopyLoaded: h, isInitialized: I } = X(), [A, F] = f.useState(!1);
+  return f.useEffect(() => {
+    I && (S(l), _().finally());
+  }, [I]), f.useEffect(() => {
+    d(C);
+  }, [C]), f.useEffect(() => {
+    const P = C.map((w) => w.guid), $ = t.filter(
+      (w) => s.includes(w.guid) && P.includes(w.guid)
+    );
+    b($), a({
+      dateRange: { start: Ge(z(), 90), end: ut() },
+      accounts: $.map((w) => w.guid)
+    });
+  }, [C, t]), !h || !I ? /* @__PURE__ */ e(re, {}) : u?.has_completed_cash_flow_onboarding ? /* @__PURE__ */ o(
+    ve,
+    {
+      accountOptions: C,
+      actions: [
+        {
+          label: y.cashflow_settings,
+          iconName: "settings",
+          onClick: () => {
+            F(!0), c(Ae.CASH_FLOW_CLICK_SETTINGS);
+          }
+        }
+      ],
+      calendarActions: {
+        shouldDisableNext: g,
+        shouldDisablePrevious: m,
+        shouldDisablePicker: !0,
+        onRangeChanged: () => {
+        }
+      },
+      dateRange: l,
+      dateRangeVariant: "readonly",
+      onAccountsFilterClick: () => c(Ae.CASH_FLOW_CLICK_FILTER),
+      onBackClick: i,
+      sx: n,
+      title: y.title,
+      children: [
+        /* @__PURE__ */ e(Et, {}),
+        /* @__PURE__ */ e(vt, {}),
+        /* @__PURE__ */ e(
+          $e,
+          {
+            ariaLabelClose: y.close_settings_aria,
+            isOpen: A,
+            onClose: () => F(!1),
+            shouldShowHeaderBorders: !1,
+            title: y.cashflow_settings,
+            children: /* @__PURE__ */ e(Qe, {})
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ e(
+    ve,
+    {
+      onBackClick: i,
+      sx: { height: "100%", overflow: "auto" },
+      title: y.title,
+      children: /* @__PURE__ */ e(Ht, {})
+    }
+  );
+}, Ln = T(Ft);
+class On {
+  fetchInstance;
+  constructor(n, t) {
+    this.fetchInstance = new ht(n, t);
+  }
+  addCashflowEvent = async (n) => this.fetchInstance.post(M.CASHFLOW_EVENTS, { ...n }).then((t) => t);
+  addCashflowSequence = async (n) => this.fetchInstance.post(M.CASHFLOW_SEQUENCES, { ...n }).then((t) => t.cashflow_sequence);
+  getCashflowSequences = async () => this.fetchInstance.get(M.CASHFLOW_SEQUENCES).then((n) => n.cashflow_sequences);
+  getCashflowEventsByDateRange = async (n, t) => this.fetchInstance.get(
+    `${M.CASHFLOW_EVENTS}/from/${j(n)}/to/${j(t)}`
+  ).then((s) => s.cashflow_events);
+  deleteCashflowSequence = async (n) => this.fetchInstance.delete(`${M.CASHFLOW_SEQUENCES}/${n}`).then((t) => t);
+  getProjectedCashflowEvents = async (n, t) => this.fetchInstance.get(
+    `${M.CASHFLOW_SEQUENCES}/projected_events/from/${j(
+      n
+    )}/to/${j(t)}`
+  ).then((s) => s.cashflow_events);
+  updateCashflowSequence = async (n) => this.fetchInstance.put(`${M.CASHFLOW_SEQUENCES}/${n.guid}`, n).then((t) => t.cashflow_sequence);
+}
+export {
+  On as CashflowApi,
+  Rn as CashflowMiniWidget,
+  Ht as CashflowOnboarding,
+  Hn as CashflowStore,
+  Ln as CashflowWidget
+};