@mx-cartographer/experiences 9.2.4-alpha.al4 → 9.3.0-alph.bb2

package/dist/recurringtransactions/index.es.js

@@ -1,1024 +1,20 @@
-import { jsx as e, jsxs as c, Fragment as B } from "react/jsx-runtime";
-import x from "react";
-import { observer as T } from "mobx-react-lite";
-import { endOfMonth as z } from "date-fns/endOfMonth";
-import { endOfToday as J } from "date-fns/endOfToday";
-import { startOfMonth as k } from "date-fns/startOfMonth";
-import { startOfToday as Q } from "date-fns/startOfToday";
-import { subDays as ee } from "date-fns/subDays";
-import Be from "@mui/material/Alert";
-import Fe from "@mui/material/Snackbar";
-import { R as De } from "../RecurringSettings-7zGNq-fh.mjs";
-import { M as Jn } from "../RecurringSettings-7zGNq-fh.mjs";
-import { addMonths as Ue } from "date-fns/addMonths";
-import { subMonths as Ye } from "date-fns/subMonths";
-import { isBefore as je } from "date-fns/isBefore";
-import q from "@mui/material/Grid";
-import he from "@mui/material/IconButton";
-import d from "@mui/material/Stack";
-import fe from "@mui/material/Tab";
-import Ke from "@mui/material/Tabs";
-import { Cancel as Se, CheckCircle as we, Schedule as Ve, MonetizationOn as qe, ChevronLeft as Ze, ChevronRight as Xe, CurrencyExchange as Je } from "@mxenabled/mx-icons";
-import { Text as h, MerchantLogo as te, InstitutionLogo as Qe, H3 as et, H2 as tt, P as Z } from "@mxenabled/mxui";
-import { g as nt, L as O, b as G } from "../Localization-DnoVyBNK.mjs";
-import { getWeeksInMonth as xe } from "date-fns/getWeeksInMonth";
-import { enCA as rt } from "date-fns/locale/en-CA";
-import { enUS as be } from "date-fns/locale/en-US";
-import { es as it } from "date-fns/locale/es";
-import { fr as ot } from "date-fns/locale/fr";
-import { frCA as at } from "date-fns/locale/fr-CA";
-import { useTheme as ne } from "@mui/material/styles";
-import { AdapterDateFns as st } from "@mui/x-date-pickers/AdapterDateFnsV3";
-import { DateCalendar as ct } from "@mui/x-date-pickers/DateCalendar";
-import { LocalizationProvider as lt } from "@mui/x-date-pickers/LocalizationProvider";
-import { isSameDay as dt } from "date-fns/isSameDay";
-import ut from "@mui/material/Badge";
-import { PickersDay as mt } from "@mui/x-date-pickers/PickersDay";
-import { I as F } from "../IconBacking-DgT8DCeh.mjs";
-import { u as b, a as U, h as D, f as Y, D as Ie, g as re } from "../hooks-97sNJ_lf.mjs";
-import { b as E, a as _, g as ye, e as pt, R as gt } from "../RecurringTransactionsUtil-CfWviBh1.mjs";
-import { f as I, D as v } from "../DateFormats-HudZ3Bjs.mjs";
-import { T as W } from "../Sizes-DISGrlUg.mjs";
-import { A as M } from "../Analytics-D-jdcL72.mjs";
-import ht from "@mui/material/Button";
-import X from "@mui/material/Divider";
-import Ce from "@mui/material/List";
-import ve from "@mui/material/ListItem";
-import ft from "@mui/material/ListSubheader";
-import xt from "@mui/material/ListItemAvatar";
-import bt from "@mui/material/ListItemButton";
-import yt from "@mui/material/ListItemText";
-import { f as A } from "../NumberFormatting--XMeeBfr.mjs";
-import N from "@mui/material/Box";
-import { u as Me } from "../useScreenSize-mWpmnh5w.mjs";
-import { S as Le } from "../StatusBar-CPfSXe80.mjs";
-import { d as Ct } from "../ManageIncome-CRSMKFWt.mjs";
-import { c as er, M as tr, S as nr } from "../ManageIncome-CRSMKFWt.mjs";
-import { D as ie } from "../Drawer-DLUMdk6P.mjs";
-import { S as Ae } from "../SkeletonLoader-BaNboJjD.mjs";
-import { u as oe } from "../useWidgetLoadTimer-B0tB-yzL.mjs";
-import { L as ae } from "../Loader-CxeBwuPG.mjs";
-import { W as Rt } from "../WidgetContainer-DKRs7nIV.mjs";
-import { M as Tt } from "../MiniWidgetContainer-Bmv_WeUd.mjs";
-import { u as _t } from "../useDimensions-CeDR9V8N.mjs";
-import { M as Dt } from "../MicroWidgetContainer-B2NnKBgW.mjs";
-const j = {
-  gridRow: 1,
-  gridColumn: 1,
-  zIndex: 2
-}, K = (t) => t ? { margin: "0 0 -6px -4px" } : void 0, se = ({ isOffset: t = !1, size: n = 16 }) => /* @__PURE__ */ e(
-  F,
-  {
-    backingSx: { backgroundColor: "background.paper" },
-    size: n,
-    sx: { ...K(t) },
-    children: /* @__PURE__ */ e(Ve, { color: "primary", filled: !0, sx: { fontSize: n, ...j } })
-  }
-), ce = ({ isOffset: t = !1, size: n = 16 }) => /* @__PURE__ */ e(
-  F,
-  {
-    backingSx: { backgroundColor: "background.paper" },
-    size: n,
-    sx: { ...K(t) },
-    children: /* @__PURE__ */ e(
-      qe,
-      {
-        filled: !0,
-        sx: { color: "categories.income", fontSize: n, ...j }
-      }
-    )
-  }
-), le = ({ isOffset: t = !1, size: n = 16 }) => /* @__PURE__ */ e(
-  F,
-  {
-    backingSx: { backgroundColor: "background.paper" },
-    size: n,
-    sx: { ...K(t) },
-    children: /* @__PURE__ */ e(Se, { color: "error", filled: !0, sx: { fontSize: n, ...j } })
-  }
-), de = ({ isOffset: t = !1, size: n = 16 }) => /* @__PURE__ */ e(
-  F,
-  {
-    backingSx: { backgroundColor: "background.paper" },
-    size: n,
-    sx: { ...K(t) },
-    children: /* @__PURE__ */ e(we, { color: "success", filled: !0, sx: { fontSize: n, ...j } })
-  }
-), St = T(
-  ({ day: t, outsideCurrentMonth: n, ...r }) => {
-    const { recurring: i } = b(), { selectedAccountGuids: o } = U(), { recurrences: s, setSelectedDay: u } = D(), a = x.useMemo(
-      () => s.filter((f) => o.includes(f.accountGuid)),
-      [o, s]
-    ).filter(
-      (f) => dt(f.occurredOnDate || f.expectedDate, t)
-    ), l = a.some(
-      (f) => f.type !== E.Income && f.status === _.Upcoming
-    ), m = a.some(
-      (f) => f.type !== E.Income && f.status === _.Missed
-    ), g = a.some(
-      (f) => f.type !== E.Income && f.status === _.Paid
-    ), y = a.some((f) => f.type === E.Income), C = (l ? 1 : 0) + (m ? 1 : 0) + (g ? 1 : 0) + (y ? 1 : 0), S = [
-      g && i.paid,
-      m && i.missed,
-      l && i.upcoming,
-      y && i.income
-    ].filter(Boolean), L = S.length > 0 ? `${I(t, v.MONTH_DAY_YEAR)}, ${S.join(", ")}` : I(t, v.MONTH_DAY_YEAR);
-    return /* @__PURE__ */ e(
-      ut,
-      {
-        badgeContent: a.length > 0 && /* @__PURE__ */ c(B, { children: [
-          m && /* @__PURE__ */ e(le, { isOffset: !0 }),
-          g && /* @__PURE__ */ e(de, { isOffset: !0 }),
-          l && /* @__PURE__ */ e(se, { isOffset: !0 }),
-          y && /* @__PURE__ */ e(ce, { isOffset: !0 })
-        ] }),
-        overlap: "circular",
-        sx: {
-          "& .MuiBadge-badge": {
-            padding: 0,
-            marginRight: `${(C - 1) * 6 + 1}px`,
-            flexWrap: "nowrap"
-          }
-        },
-        children: /* @__PURE__ */ e(
-          mt,
-          {
-            "aria-label": L,
-            day: t,
-            onClick: () => u(t),
-            outsideCurrentMonth: n,
-            sx: {
-              "&.MuiPickersDay-root": {
-                ...n && {
-                  color: "text.disabled"
-                },
-                ...r.today && {
-                  color: "primary.main"
-                }
-              }
-            },
-            ...r
-          }
-        )
-      }
-    );
-  }
-), $ = ({ icon: t, label: n }) => /* @__PURE__ */ c(d, { alignItems: "center", flexDirection: "row", sx: { gap: 6 }, children: [
-  /* @__PURE__ */ e(t, {}),
-  /* @__PURE__ */ e(h, { variant: "caption", children: n })
-] }), wt = T(() => {
-  const { recurring: t } = b();
-  return /* @__PURE__ */ c(
-    d,
-    {
-      alignItems: "center",
-      "aria-hidden": !0,
-      flexDirection: "row",
-      gap: 16,
-      justifyContent: "center",
-      mt: 12,
-      children: [
-        /* @__PURE__ */ e($, { icon: se, label: t.expense }),
-        /* @__PURE__ */ e($, { icon: ce, label: t.income }),
-        /* @__PURE__ */ e($, { icon: le, label: t.missed }),
-        /* @__PURE__ */ e($, { icon: de, label: t.paid })
-      ]
-    }
-  );
-}), Re = 58, It = () => {
-  const t = nt();
-  return {
-    [O.EN_US]: be,
-    [O.EN_CA]: rt,
-    [O.FR]: ot,
-    [O.FR_CA]: at,
-    [O.ES]: it
-  }[t] || be;
-}, Ee = T(() => {
-  const t = ne(), { onEvent: n } = Y(), { recurring: r } = b(), { selectedDay: i, setDateRange: o } = D(), [s, u] = x.useState(
-    xe(/* @__PURE__ */ new Date()) * W + Re
-  ), p = (m) => {
-    u(xe(m) * W + Re), o({
-      start: k(m),
-      end: z(m)
-    }), a(m), n(M.RECURRING_TRANSACTIONS_CLICK_CALENDAR_RIGHT);
-  }, a = (m) => {
-    m && requestAnimationFrame(() => {
-      const g = document.getElementById("recurrence-list");
-      g?.setAttribute("tabindex", "-1"), g?.focus();
-    });
-  }, l = /* @__PURE__ */ e(
-    ct,
-    {
-      minDate: k(/* @__PURE__ */ new Date()),
-      onChange: a,
-      onMonthChange: p,
-      showDaysOutsideCurrentMonth: !0,
-      slots: {
-        day: St
-      },
-      sx: {
-        "& .MuiPickersArrowSwitcher-button": {
-          color: "primary.main",
-          "&:disabled": {
-            color: "action.disabled"
-          }
-        },
-        "& .MuiButtonBase-root.MuiPickersDay-root": {
-          borderRadius: "4px",
-          "&:focus, &:hover": {
-            borderRadius: "4px"
-          }
-        },
-        "& .MuiPickersCalendarHeader-root": {
-          mt: 0,
-          pl: 16,
-          pr: 8
-        },
-        "& .MuiPickersCalendarHeader-label": {
-          fontFamily: t.typography.body1.fontFamily,
-          fontSize: t.typography.body1.fontSize,
-          fontWeight: 600
-        },
-        "& .MuiDayCalendar-slideTransition": {
-          minHeight: s
-        },
-        "&.MuiDateCalendar-root": {
-          minHeight: s + W
-        },
-        "& .MuiButtonBase-root, .MuiDayCalendar-weekDayLabel": {
-          height: W,
-          width: W,
-          margin: 0
-        },
-        "& .MuiDayCalendar-weekDayLabel": {
-          fontFamily: t.typography.h3.fontFamily,
-          fontSize: t.typography.body2.fontSize
-        },
-        "& .MuiPickersDay-dayOutsideMonth": {
-          color: "text.secondary"
-        },
-        textTransform: "capitalize"
-      },
-      value: i,
-      views: ["day"]
-    }
-  );
-  return /* @__PURE__ */ e(d, { "aria-labelledby": "calendar-label", justifyContent: "center", role: "group", children: /* @__PURE__ */ c(lt, { adapterLocale: It(), dateAdapter: st, children: [
-    i && l,
-    !i && l,
-    /* @__PURE__ */ e(h, { id: "calendar-label", sx: { alignSelf: "center" }, variant: "body2", children: r.calendar_tooltip }),
-    /* @__PURE__ */ e(wt, {})
-  ] }) });
-}), vt = (t) => {
-  if (t.type === E.Income)
-    return /* @__PURE__ */ e(ce, {});
-  switch (t.status) {
-    case _.Missed:
-      return /* @__PURE__ */ e(le, {});
-    case _.Paid:
-      return /* @__PURE__ */ e(de, {});
-    default:
-      return /* @__PURE__ */ e(se, {});
-  }
-}, Mt = (t, n) => {
-  switch (t.status) {
-    case _.Paid:
-      return t.expectedDate ? G(
-        n.paid_on,
-        I(
-          t.occurredOnDate || t.expectedDate,
-          v.MONTH_DAY
-        )
-      ) : n.paid;
-    case _.Missed:
-      return G(
-        n.missed_on,
-        I(t.expectedDate, v.MONTH_DAY)
-      );
-    case _.Upcoming:
-      return G(
-        n.upcoming_on,
-        I(t.expectedDate, v.MONTH_DAY)
-      );
-    default:
-      return n.unknown;
-  }
-}, Te = ({
-  recurrence: t,
-  isMini: n = !1,
-  onRecurrenceClick: r = () => {
-  },
-  showOrdinal: i = !1
-}) => {
-  const { recurring: o } = b(), { detailedRepeatingTransactions: s } = D(), u = x.useMemo(
-    () => s.find((C) => C.guid === t.repeatingTransactionGuid),
-    [t, s]
-  ), p = t.type === E.Income, a = t.status === _.Paid, l = t.status === _.Missed, m = t.status === _.Upcoming;
-  let g = o.paid?.toLowerCase();
-  return l ? g = o.missed?.toLowerCase() : m && (g = i ? ye(o, u || {}, !0) : ye(o, u || {}, !1)), //TODO: implement common/components/ListItemRow.tsx
-  /* @__PURE__ */ e(ve, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(bt, { onClick: () => {
-    r(t);
-  }, children: [
-    /* @__PURE__ */ e(xt, { children: /* @__PURE__ */ e(
-      te,
-      {
-        categoryGuid: t.categoryGuid,
-        merchantGuid: t.merchantGuid
-      }
-    ) }),
-    /* @__PURE__ */ e(yt, { children: /* @__PURE__ */ c(
-      d,
-      {
-        direction: "row",
-        gap: 4,
-        sx: { justifyContent: "space-between", textOverflow: "ellipsis", textWrap: "nowrap" },
-        children: [
-          /* @__PURE__ */ c(d, { direction: "column", width: "50%", children: [
-            /* @__PURE__ */ e(h, { bold: !0, variant: "body1", children: t.name }),
-            /* @__PURE__ */ e(d, { alignItems: "center", direction: "row", gap: 6, children: n ? /* @__PURE__ */ c(d, { direction: "row", gap: 4, children: [
-              vt(t),
-              /* @__PURE__ */ e(h, { variant: "caption", children: Mt(t, o) })
-            ] }) : /* @__PURE__ */ c(B, { children: [
-              t.institutionGuid && /* @__PURE__ */ e(
-                Qe,
-                {
-                  alt: "",
-                  institutionGuid: t.institutionGuid,
-                  size: 12
-                }
-              ),
-              /* @__PURE__ */ e(h, { sx: { maxWidth: 250 }, variant: "caption", children: t.institutionName })
-            ] }) })
-          ] }),
-          /* @__PURE__ */ c(d, { alignItems: "flex-end", width: "100%", children: [
-            /* @__PURE__ */ c(h, { bold: !0, color: p ? "success.main" : "text.primary", variant: "body1", children: [
-              p ? "+" : "",
-              A(t.amount, "0,0.00")
-            ] }),
-            !n && /* @__PURE__ */ c(
-              d,
-              {
-                direction: "row",
-                sx: {
-                  alignItems: "center",
-                  gap: 6,
-                  justifyContent: "flex-end",
-                  textTransform: "uppercase",
-                  width: "100%"
-                },
-                children: [
-                  a && /* @__PURE__ */ e(we, { color: "success", filled: !0, size: 12 }),
-                  l && /* @__PURE__ */ e(Se, { color: "error", filled: !0, size: 12 }),
-                  /* @__PURE__ */ e(h, { bold: !0, color: "text.secondary", variant: "caption", children: g })
-                ]
-              }
-            )
-          ] })
-        ]
-      }
-    ) })
-  ] }) });
-}, P = T(
-  ({
-    recurrences: t,
-    isMini: n = !1,
-    onResetClick: r,
-    onRecurrenceClick: i,
-    sx: o = {},
-    title: s
-  }) => {
-    const { recurring: u } = b(), p = x.useMemo(() => pt(t), [t]);
-    return /* @__PURE__ */ c(d, { id: "recurrence-list", sx: { gap: 8, mt: 4, ...o }, tabIndex: -1, children: [
-      s && /* @__PURE__ */ c(
-        d,
-        {
-          sx: {
-            alignItems: "center",
-            flexDirection: "row",
-            justifyContent: "space-between",
-            px: 24
-          },
-          children: [
-            /* @__PURE__ */ e(et, { bold: !0, variant: "body1", children: s }),
-            r && /* @__PURE__ */ e(ht, { onClick: r, size: "small", variant: "text", children: u.reset })
-          ]
-        }
-      ),
-      t.length === 0 ? /* @__PURE__ */ e(h, { fontStyle: "italic", sx: { py: 24, textAlign: "center" }, children: u.no_activities }) : /* @__PURE__ */ e(Ce, { "aria-label": s, children: n ? t.map((a, l) => /* @__PURE__ */ c(x.Fragment, { children: [
-        /* @__PURE__ */ e(
-          Te,
-          {
-            isMini: n,
-            onRecurrenceClick: i,
-            recurrence: a
-          }
-        ),
-        /* @__PURE__ */ e(X, { sx: { mx: 24 } })
-      ] }, `recurrence-${l}`)) : p.map((a, l) => /* @__PURE__ */ c(x.Fragment, { children: [
-        /* @__PURE__ */ e(ve, { children: /* @__PURE__ */ e(
-          Ce,
-          {
-            "aria-labelledby": `date-group-header-${a.id}`,
-            subheader: /* @__PURE__ */ e(
-              ft,
-              {
-                "aria-hidden": "true",
-                id: `date-group-header-${a.id}`,
-                role: "presentation",
-                sx: { bgcolor: "background.paper", ml: 8, pb: 4, pt: 12 },
-                children: /* @__PURE__ */ e(h, { bold: !0, variant: "caption", children: I(a.date, v.DAY_OF_WEEK_MONTH_DAY) })
-              }
-            ),
-            sx: { width: "100%" },
-            children: a.recurrences.map((m, g) => /* @__PURE__ */ e(x.Fragment, { children: /* @__PURE__ */ e(
-              Te,
-              {
-                isMini: n,
-                onRecurrenceClick: i,
-                recurrence: m
-              }
-            ) }, `day-recurrence-${g}`))
-          }
-        ) }, a.id),
-        /* @__PURE__ */ e(X, { sx: { mx: 24 } })
-      ] }, `recurrence-${l}`)) })
-    ] });
-  }
-), _e = T(
-  ({ expected: t, isExpense: n = !0, missed: r, paid: i, title: o, total: s, upcoming: u }) => {
-    const p = ne(), { isSmallMobile: a } = Me(), { recurring: l } = b(), m = x.useMemo(() => {
-      const g = [{ color: p.palette.success.main, percentage: `${i / t}` }];
-      return r && g.push({ color: p.palette.error.main, percentage: `${r / t}` }), g;
-    }, [i, t, r]);
-    return /* @__PURE__ */ c(d, { children: [
-      /* @__PURE__ */ c(d, { sx: { flexDirection: "row", justifyContent: "space-between", pb: 12 }, children: [
-        /* @__PURE__ */ e(h, { bold: !0, variant: "body1", children: `${o} (${s})` }),
-        /* @__PURE__ */ e(h, { bold: !0, color: n ? "text.primary" : "success.main", variant: "body1", children: `${n ? "-" : "+"}${A(t, "0,0.00")}` })
-      ] }),
-      /* @__PURE__ */ e(Le, { data: m, height: 12 }),
-      /* @__PURE__ */ c(d, { sx: { alignItems: "center", flexDirection: "row", gap: 2, my: 8 }, children: [
-        /* @__PURE__ */ e(N, { sx: { bgcolor: "success.main", height: 8, mr: 8, width: 8 } }),
-        !a && /* @__PURE__ */ e(h, { bold: !0, variant: "body2", children: A(i, "0,0.00") }),
-        /* @__PURE__ */ e(h, { variant: "caption", children: l.paid?.toLowerCase() }),
-        r !== void 0 && /* @__PURE__ */ c(B, { children: [
-          /* @__PURE__ */ e(N, { sx: { bgcolor: "error.main", height: 8, ml: 16, mr: 8, width: 8 } }),
-          !a && /* @__PURE__ */ e(h, { bold: !0, variant: "body2", children: A(r, "0,0.00") }),
-          /* @__PURE__ */ e(h, { variant: "caption", children: l.missed?.toLowerCase() })
-        ] }),
-        /* @__PURE__ */ e(N, { sx: { bgcolor: "divider", height: 8, ml: 16, mr: 8, width: 8 } }),
-        !a && /* @__PURE__ */ e(h, { bold: !0, variant: "body2", children: A(u, "0,0.00") }),
-        /* @__PURE__ */ e(h, { variant: "caption", children: l.upcoming?.toLowerCase() })
-      ] })
-    ] });
-  }
-), Ge = T(() => {
-  const { recurring: t } = b(), {
-    selectedRecurrence: n,
-    selectedRepeatingTransaction: r,
-    setSelectedRecurrence: i,
-    setSelectedRepeatingTransactionGuid: o
-  } = D(), s = () => {
-    o(null), i(null);
-  };
-  return /* @__PURE__ */ e(
-    ie,
-    {
-      ariaLabelClose: t.close_drawer_aria,
-      isOpen: !!r,
-      onClose: s,
-      title: r?.repeating_transaction_type === gt.Income ? t.income_details : t.expense_details,
-      children: r && /* @__PURE__ */ e(
-        Ct,
-        {
-          onDeleted: s,
-          recurringTransaction: r,
-          selectedRecurrence: n
-        }
-      )
-    }
-  );
-}), Lt = T(() => {
-  const { recurring: t } = b(), { availableWidth: n } = Ie(), { isDesktop: r, isSmallMobile: i, isMobile: o } = Me(n), { onEvent: s } = Y(), {
-    currentMonthExpenses: u,
-    currentMonthIncome: p,
-    dateRange: a,
-    expenseTotal: l,
-    incomeTotal: m,
-    missedExpenseTotal: g,
-    pastRecurrences: y,
-    paidExpenseTotal: C,
-    paidIncomeTotal: S,
-    selectedDay: L,
-    selectedDayRecurrences: f,
-    setDateRange: w,
-    setSelectedRecurrence: H,
-    setSelectedRepeatingTransactionGuid: ue,
-    upcomingExpenseTotal: Ne,
-    upcomingIncomeTotal: ke,
-    upcomingRecurrences: me
-  } = D(), [V, Oe] = x.useState(0), We = je(a.start, /* @__PURE__ */ new Date()), Pe = (R, $e) => {
-    Oe($e);
-  }, pe = (R) => {
-    ue(R.repeatingTransactionGuid), H(R), s(M.RECURRING_TRANSACTIONS_CLICK_UPCOMING, {
-      transaction_guid: R.transaction?.guid
-    });
-  }, ge = (R) => {
-    ue(R.repeatingTransactionGuid), H(R), s(M.RECURRING_TRANSACTIONS_CLICK_PAID, {
-      transaction_guid: R.transaction?.guid
-    });
-  }, ze = () => {
-    const R = Ue(a.start, 1);
-    w({
-      start: k(R),
-      end: z(R)
-    });
-  }, He = () => {
-    const R = Ye(a.start, 1);
-    w({
-      start: k(R),
-      end: z(R)
-    });
-  };
-  return /* @__PURE__ */ c(
-    q,
-    {
-      container: !0,
-      sx: {
-        pt: 16
-      },
-      children: [
-        /* @__PURE__ */ c(q, { size: { sm: 12, md: "grow" }, width: "100%", children: [
-          /* @__PURE__ */ c(d, { sx: { gap: 16, px: r ? 48 : 24 }, children: [
-            /* @__PURE__ */ c(d, { alignItems: "center", direction: "row", justifyContent: "space-between", children: [
-              /* @__PURE__ */ e(tt, { variant: "h3", children: G(
-                t.header_title,
-                I(a.start, v.MONTH_LONG)
-              ) }),
-              !r && /* @__PURE__ */ c(d, { direction: "row", gap: 4, children: [
-                /* @__PURE__ */ e(
-                  he,
-                  {
-                    color: "primary",
-                    disabled: We,
-                    onClick: He,
-                    children: /* @__PURE__ */ e(Ze, {})
-                  }
-                ),
-                /* @__PURE__ */ e(he, { color: "primary", onClick: ze, children: /* @__PURE__ */ e(Xe, {}) })
-              ] })
-            ] }),
-            /* @__PURE__ */ e(
-              _e,
-              {
-                expected: l,
-                missed: g,
-                paid: C,
-                title: t.expenses,
-                total: u.length,
-                upcoming: Ne
-              }
-            ),
-            /* @__PURE__ */ e(
-              _e,
-              {
-                expected: m,
-                isExpense: !1,
-                paid: S,
-                title: t.deposits,
-                total: p.length,
-                upcoming: ke
-              }
-            ),
-            r && /* @__PURE__ */ e(
-              P,
-              {
-                onRecurrenceClick: pe,
-                recurrences: me,
-                title: t.upcoming_activity
-              }
-            )
-          ] }),
-          !r && /* @__PURE__ */ c(d, { sx: { px: o ? 0 : 24 }, children: [
-            /* @__PURE__ */ c(Ke, { onChange: Pe, value: V, variant: "fullWidth", children: [
-              /* @__PURE__ */ e(
-                fe,
-                {
-                  label: /* @__PURE__ */ e(h, { bold: !0, sx: { textTransform: "none" }, variant: "body1", children: i ? t.upcoming : t.upcoming_activity })
-                }
-              ),
-              /* @__PURE__ */ e(
-                fe,
-                {
-                  label: /* @__PURE__ */ e(h, { bold: !0, sx: { textTransform: "none" }, variant: "body1", children: i ? t.past : t.past_transactions })
-                }
-              )
-            ] }),
-            V === 0 && /* @__PURE__ */ e(
-              P,
-              {
-                onRecurrenceClick: pe,
-                recurrences: me
-              }
-            ),
-            V === 1 && /* @__PURE__ */ e(
-              P,
-              {
-                onRecurrenceClick: ge,
-                recurrences: y
-              }
-            )
-          ] })
-        ] }),
-        r && /* @__PURE__ */ e(q, { size: { xs: "auto" }, sx: { minWidth: 450 }, children: /* @__PURE__ */ c(d, { gap: 24, children: [
-          /* @__PURE__ */ e(Ee, {}),
-          /* @__PURE__ */ e(
-            P,
-            {
-              onRecurrenceClick: ge,
-              recurrences: f || y,
-              title: L ? G(
-                t.day_transactions,
-                I(L, v.MONTH_DAY)
-              ) : t.past_transactions
-            }
-          )
-        ] }) }),
-        /* @__PURE__ */ e(Ge, {})
-      ]
-    }
-  );
-}), jn = T(
-  ({ onBackClick: t, onMenuClick: n, sx: r = {} }) => {
-    const { recurring: i } = b(), { isInitialized: o, selectedAccountGuids: s } = U(), { alert: u, isDataLoaded: p, loadRepeatingTransactionData: a, setAlert: l, setDateRange: m } = D(), { setFilter: g } = re(), { onEvent: y } = Y(), [C, S] = x.useState(!1);
-    return oe({
-      widgetName: "RecurringTransactionsWidget",
-      isLoaded: p
-    }), x.useEffect(() => {
-      p || a().finally();
-    }, []), x.useEffect(() => {
-      g({
-        dateRange: { start: ee(Q(), 90), end: J() },
-        accounts: s
-      }), m({ start: k(/* @__PURE__ */ new Date()), end: z(/* @__PURE__ */ new Date()) });
-    }, [s]), o ? /* @__PURE__ */ c(
-      Rt,
-      {
-        actions: [
-          {
-            label: i.action_title,
-            iconName: "credit_card_gear",
-            onClick: () => {
-              S(!0), y(M.RECURRING_TRANSACTIONS_CLICK_SETTINGS);
-            }
-          }
-        ],
-        hasDivider: !0,
-        onAccountsFilterClick: () => y(M.RECURRING_TRANSACTIONS_CLICK_FILTER),
-        onBackClick: t,
-        onMenuClick: n,
-        sx: r,
-        title: i.title,
-        children: [
-          p ? /* @__PURE__ */ e(Lt, {}) : /* @__PURE__ */ e(Ae, { sx: { m: 48 }, variant: "list" }),
-          /* @__PURE__ */ e(
-            ie,
-            {
-              ariaLabelClose: i.close_drawer_aria,
-              isOpen: C,
-              onClose: () => S(!1),
-              shouldShowHeaderBorders: !1,
-              title: i.action_title,
-              children: /* @__PURE__ */ e(De, {})
-            }
-          ),
-          /* @__PURE__ */ e(
-            Fe,
-            {
-              anchorOrigin: { vertical: "bottom", horizontal: "right" },
-              autoHideDuration: 3500,
-              onClose: (L, f) => {
-                f !== "clickaway" && l("", u.severity);
-              },
-              open: !!u.message,
-              children: /* @__PURE__ */ e(
-                Be,
-                {
-                  onClose: () => l("", u.severity),
-                  severity: u.severity,
-                  variant: "filled",
-                  children: u.message
-                }
-              )
-            }
-          )
-        ]
-      }
-    ) : /* @__PURE__ */ e(ae, {});
-  }
-), At = T(() => {
-  const { recurring: t } = b(), { availableWidth: n } = Ie(), {
-    selectedDay: r,
-    selectedDayRecurrences: i,
-    setSelectedDay: o,
-    setSelectedRecurrence: s,
-    setSelectedRepeatingTransactionGuid: u,
-    upcomingRecurrences: p
-  } = D(), a = (m) => {
-    u(m.repeatingTransactionGuid), s(m);
-  }, l = n < 750;
-  return /* @__PURE__ */ c(d, { flexDirection: l ? "column" : "row", width: "100%", children: [
-    /* @__PURE__ */ e(Ee, {}),
-    !l && /* @__PURE__ */ e(X, { flexItem: !0, orientation: "vertical", sx: { my: 16, ml: 16 } }),
-    /* @__PURE__ */ e(
-      P,
-      {
-        isMini: !0,
-        onRecurrenceClick: a,
-        onResetClick: r ? () => o(r) : void 0,
-        recurrences: i || p.slice(0, 5),
-        sx: { width: l ? "100%" : "calc(100% - 336px)", mt: 12 },
-        title: r ? G(
-          t.day_transactions,
-          I(r, v.MONTH_DAY)
-        ) : t.upcoming_activity
-      }
-    )
-  ] });
-}), Kn = T(
-  ({ onPrimaryCtaClick: t, sx: n }) => {
-    const { recurring: r } = b(), { setFilter: i } = re(), { isDataLoaded: o, loadRepeatingTransactionData: s } = D(), { isInitialized: u, selectedAccountGuids: p } = U();
-    return oe({
-      widgetName: "RecurringTransactionsMiniWidget",
-      isLoaded: o
-    }), x.useEffect(() => {
-      o || s().finally();
-    }, []), x.useEffect(() => {
-      p.length > 0 && i({
-        dateRange: { start: ee(Q(), 90), end: J() },
-        accounts: p
-      });
-    }, [p]), u ? /* @__PURE__ */ c(
-      Tt,
-      {
-        className: "mx-exp-recurring-transactions-miniwidget",
-        onPrimaryCtaClick: t,
-        primaryCtaLabel: r.primary_cta,
-        primaryCtaLabelAria: r.primary_cta_aria,
-        subTitle: r.sub_title,
-        sx: n,
-        title: r.mini_title,
-        children: [
-          o ? /* @__PURE__ */ e(At, {}) : /* @__PURE__ */ e(Ae, { sx: { mx: 16 }, variant: "list" }),
-          /* @__PURE__ */ e(Ge, {})
-        ]
-      }
-    ) : /* @__PURE__ */ e(ae, {});
-  }
-), Et = T(() => {
-  const { recurring: t } = b();
-  return /* @__PURE__ */ c(d, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
-    /* @__PURE__ */ e(Je, { size: 32 }),
-    /* @__PURE__ */ c(d, { children: [
-      /* @__PURE__ */ e(Z, { fontWeight: 600, variant: "body1", children: t.zero_state_content_header }),
-      /* @__PURE__ */ e(Z, { color: "text.secondary", variant: "subtitle2", children: t.zero_state_content_description })
-    ] })
-  ] });
-}), Gt = ({
-  amount: t,
-  bgcolor: n,
-  isLargeScreen: r,
-  isSmallScreen: i,
-  label: o
-}) => /* @__PURE__ */ c(d, { sx: { alignItems: "center", flexDirection: "row", gap: 8 }, children: [
-  /* @__PURE__ */ e(
-    N,
-    {
-      sx: {
-        borderRadius: "2px",
-        bgcolor: n,
-        height: 8,
-        width: 8
-      }
-    }
-  ),
-  /* @__PURE__ */ c(d, { sx: { alignItems: "center", flexDirection: "row", gap: 2 }, children: [
-    !i && /* @__PURE__ */ e(h, { bold: !0, variant: "caption", children: A(t, t === 0 || !r ? "0,0" : "0,0.00") }),
-    /* @__PURE__ */ e(h, { variant: "caption", children: o })
-  ] })
-] }), Nt = ({
-  upcomingRecurrences: t,
-  logoSize: n = 32,
-  maxLogos: r = 3
-}) => {
-  const i = (o) => o * (n / 2);
-  return /* @__PURE__ */ e(
-    N,
-    {
-      sx: {
-        position: "relative",
-        width: 64
-      },
-      children: t.map((o, s) => s < r ? /* @__PURE__ */ e(
-        N,
-        {
-          sx: {
-            borderRadius: "4px",
-            left: i(s),
-            outlineColor: "common.white",
-            outlineStyle: "solid",
-            outlineWidth: 2,
-            position: "absolute"
-          },
-          children: /* @__PURE__ */ e(
-            te,
-            {
-              categoryGuid: o.categoryGuid || "",
-              merchantGuid: o.merchantGuid || "",
-              size: n
-            }
-          )
-        },
-        `${o.categoryGuid}-${o.merchantGuid}-${s}`
-      ) : null)
-    }
-  );
-}, kt = ({
-  upcomingRecurrences: t,
-  maxLogos: n = 3
-}) => /* @__PURE__ */ e(d, { sx: { flexDirection: "row", gap: 4 }, children: t?.slice(0, n).map((r, i) => /* @__PURE__ */ e(
-  te,
-  {
-    categoryGuid: r.categoryGuid || "",
-    merchantGuid: r.merchantGuid || ""
-  },
-  `${r.categoryGuid}-${r.merchantGuid}-${i}`
-)) }), Ot = T(() => {
-  const t = ne(), [n, { width: r }] = _t(), {
-    upcomingRecurrences: i,
-    expenseTotal: o,
-    missedExpenseTotal: s,
-    paidExpenseTotal: u,
-    upcomingExpenseTotal: p
-  } = D(), { recurring: a } = b(), l = r <= 288, m = r >= 450, g = 32, y = i.length > 0, C = x.useMemo(() => A(o, o === 0 ? "0,0" : "0,0.00"), [o]), S = x.useMemo(() => {
-    const w = [
-      { color: t.palette.success.main, percentage: `${u / o}` }
-    ];
-    return s && w.push({
-      color: t.palette.error.main,
-      percentage: `${s / o}`
-    }), w;
-  }, [
-    u,
-    o,
-    s,
-    t.palette.success.main,
-    t.palette.error.main
-  ]), L = () => y ? l ? /* @__PURE__ */ e(
-    Nt,
-    {
-      logoSize: g,
-      maxLogos: 3,
-      upcomingRecurrences: i.slice(0, 3)
-    }
-  ) : /* @__PURE__ */ e(kt, { maxLogos: 3, upcomingRecurrences: i.slice(0, 3) }) : /* @__PURE__ */ e(d, { sx: { width: l ? 64 : 104 } }), f = [
-    {
-      amount: u,
-      bgColor: "success.main",
-      label: a.paid
-    },
-    {
-      amount: s,
-      bgColor: "error.main",
-      label: a.missed
-    },
-    {
-      amount: p,
-      bgColor: "neutral.light",
-      label: a.upcoming
-    }
-  ];
-  return /* @__PURE__ */ c(B, { children: [
-    /* @__PURE__ */ c(d, { ref: n, sx: { flexDirection: "row", justifyContent: "space-between" }, children: [
-      /* @__PURE__ */ c(
-        d,
-        {
-          sx: [
-            C.length >= 10 && l ? { flexDirection: "column" } : { flexDirection: "row", gap: 2 },
-            {
-              alignItems: "baseline",
-              overflow: "hidden",
-              textOverflow: "ellipsis",
-              whiteSpace: "nowrap"
-            }
-          ],
-          children: [
-            /* @__PURE__ */ e(
-              h,
-              {
-                sx: { width: "100%" },
-                variant: C.length >= 10 && l ? "h3" : "h2",
-                children: C
-              }
-            ),
-            /* @__PURE__ */ e(Z, { sx: { pr: 12 }, variant: "caption", children: a.expected })
-          ]
-        }
-      ),
-      L()
-    ] }),
-    /* @__PURE__ */ c(d, { sx: { pt: 12 }, children: [
-      /* @__PURE__ */ e(Le, { data: S }),
-      /* @__PURE__ */ e(
-        d,
-        {
-          sx: {
-            alignItems: "center",
-            flexDirection: "row",
-            gap: 16,
-            mt: 4
-          },
-          children: f.map((w, H) => /* @__PURE__ */ e(
-            Gt,
-            {
-              amount: w.amount,
-              bgcolor: w.bgColor,
-              isLargeScreen: m,
-              isSmallScreen: l,
-              label: w.label
-            },
-            `recurrence-legend-${H}`
-          ))
-        }
-      )
-    ] })
-  ] });
-}), Vn = T(
-  ({ onCTAClick: t }) => {
-    const { onEvent: n } = Y(), { isInitialized: r, selectedAccountGuids: i } = U(), {
-      loadRepeatingTransactionData: o,
-      upcomingRecurrences: s,
-      repeatingTransactions: u,
-      setDateRange: p,
-      isDataLoaded: a
-    } = D(), { setFilter: l } = re(), { recurring: m, budgets: g } = b();
-    oe({
-      widgetName: "RecurringTransactionsMicroWidget",
-      isLoaded: a
-    }), x.useEffect(() => {
-      a || o().finally(() => {
-        n(M.RECURRING_TRANSACTIONS_LOAD_WIDGET, {
-          state: s.length > 0 ? "default" : "zeroState"
-        });
-      });
-    }, []), x.useEffect(() => {
-      r && (l({
-        dateRange: { start: ee(Q(), 90), end: J() },
-        accounts: i
-      }), p({ start: k(/* @__PURE__ */ new Date()), end: z(/* @__PURE__ */ new Date()) }));
-    }, [r, i]);
-    const y = () => {
-      n(
-        s.length > 0 ? M.RECURRING_TRANSACTIONS_CLICK_GET_STARTED : M.RECURRING_TRANSACTIONS_CLICK_VIEW_ALL
-      ), t();
-    };
-    if (!r || !a) return /* @__PURE__ */ e(ae, { height: 100 });
-    const C = !u?.length;
-    return /* @__PURE__ */ e(
-      Dt,
-      {
-        className: "mx-recurring-transaction-microwidget",
-        ctaLabel: C ? g.get_started_cta : m.primary_cta,
-        onCTAClick: y,
-        title: m.recurring_expenses,
-        children: C ? /* @__PURE__ */ e(Et, {}) : /* @__PURE__ */ e(Ot, {})
-      }
-    );
-  }
-), qn = T(
-  ({ isOpen: t, onClose: n, selectedTab: r }) => {
-    const { cashflow: i } = b();
-    return /* @__PURE__ */ e(
-      ie,
-      {
-        ariaLabelClose: i.close_settings_aria,
-        isOpen: t,
-        onClose: n,
-        title: i.cashflow_settings,
-        children: /* @__PURE__ */ e(De, { defaultSelectedTab: r })
-      }
-    );
-  }
-);
+import { SelectTransaction as i } from "./components/shared/recurringsettings/SelectTransaction.es.js";
+import { AddRecurringTransactionDetails as t } from "./components/shared/recurringsettings/AddRecurringTransactionDetails.es.js";
+import { ManageExpenses as e } from "./components/shared/recurringsettings/ManageExpenses.es.js";
+import { ManageIncome as a } from "./components/shared/recurringsettings/ManageIncome.es.js";
+import { RecurringSettings as g } from "./components/shared/RecurringSettings.es.js";
+import { RecurringTransactionsWidget as p } from "./RecurringTransactionsWidget.es.js";
+import { RecurringTransactionsMiniWidget as u } from "./RecurringTransactionsMiniWidget.es.js";
+import { RecurringTransactionsMicroWidget as d } from "./RecurringTransactionsMicroWidget.es.js";
+import { RecurringSettingsDrawer as M } from "./components/RecurringSettingsDrawer.es.js";
 export {
-  er as AddRecurringTransactionDetails,
-  Jn as ManageExpenses,
-  tr as ManageIncome,
-  De as RecurringSettings,
-  qn as RecurringSettingsDrawer,
-  Vn as RecurringTransactionsMicroWidget,
-  Kn as RecurringTransactionsMiniWidget,
-  jn as RecurringTransactionsWidget,
-  nr as SelectTransaction
+  t as AddRecurringTransactionDetails,
+  e as ManageExpenses,
+  a as ManageIncome,
+  g as RecurringSettings,
+  M as RecurringSettingsDrawer,
+  d as RecurringTransactionsMicroWidget,
+  u as RecurringTransactionsMiniWidget,
+  p as RecurringTransactionsWidget,
+  i as SelectTransaction
 };
-//# sourceMappingURL=index.es.js.map