@mx-cartographer/experiences 6.26.18-alpha.mega3 → 6.26.18-alpha.mega4

package/dist/dashboard/Greeting/index.es.js

@@ -1,71 +0,0 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import l from "react";
-import { observer as h } from "mobx-react-lite";
-import r from "@mui/material/Stack";
-import C from "@mui/material/Paper";
-import { H1 as b, P as w } from "@mxenabled/mxui";
-import { useMediaQuery as y } from "@mui/system";
-import S from "../../common/components/addaccounts/AddAccounts/index.es.js";
-import x from "../../common/components/accountfilter/AccountFilter/index.es.js";
-import { useAccountStore as v, useGlobalUiStore as z, useGlobalCopyStore as G, useAppConfig as D } from "../../common/context/hooks/index.es.js";
-import { useScreenSize as F } from "../../common/hooks/useScreenSize/index.es.js";
-import k from "../../common/components/ConnectDrawer/index.es.js";
-const B = () => {
-  const [i, c] = l.useState(!1), u = y("(max-width:320px)"), { visibleAccounts: a } = v(), { selectedAccountGuids: _, setSelectedAccountGuids: m } = z(), { common: t, connect: f } = G(), { config: p } = D(), { isMobile: d } = F(), g = {
-    accountFilterOptionsCopy: {
-      accountTypeAccounts: t.account_filter.account_type_accounts,
-      cancelButton: t.cancel_button,
-      filterButton: t.filter_button,
-      filterButtonAria: t.account_filter.filter_button_generic_aria,
-      selectAllAccounts: t.account_filter.select_all_accounts,
-      toggleAccountTypeAccounts: t.account_filter.toggle_account_type_accounts,
-      unselectAllAccounts: t.account_filter.unselect_all_accounts,
-      zeroStateButton: t.account_filter.zero_state_button,
-      zeroStateDescription: t.account_filter.zero_state_description,
-      zeroStateTitle: t.account_filter.zero_state_title
-    },
-    title: t.filter_button
-  }, A = () => {
-    const o = (/* @__PURE__ */ new Date()).getHours();
-    return o > 1 && o < 12 ? t.good_morning : o >= 12 && o < 18 ? t.good_afternoon : t.good_evening;
-  };
-  return /* @__PURE__ */ n(l.Fragment, { children: [
-    /* @__PURE__ */ e(C, { sx: { gap: 12, mb: d ? 24 : 0, p: 24 }, children: /* @__PURE__ */ n(r, { alignItems: "center", flexDirection: "row", justifyContent: "space-between", children: [
-      /* @__PURE__ */ n(r, { children: [
-        /* @__PURE__ */ e(b, { variant: u ? "H2" : "H1", children: A() }),
-        /* @__PURE__ */ e(w, { color: "text.secondary", children: t.heres_your_spending_overview })
-      ] }),
-      /* @__PURE__ */ n(r, { flexDirection: "row", children: [
-        p.show_connections_widget_in_master && /* @__PURE__ */ e(S, { handleConnectClick: () => c(!0) }),
-        /* @__PURE__ */ e(
-          x,
-          {
-            accounts: a,
-            copy: g,
-            onConnectAccountClick: () => c(!0),
-            onFilterClick: (s) => {
-              m(s);
-            },
-            selectedAccountGuids: _,
-            showAccountNumbers: !1,
-            sx: {
-              maxWidth: "100%"
-            },
-            variant: "text"
-          }
-        )
-      ] })
-    ] }) }),
-    i && /* @__PURE__ */ e(
-      k,
-      {
-        onClose: () => c(!1),
-        showConnectWidget: i,
-        title: f.mini_title
-      }
-    )
-  ] });
-}, $ = h(B);
-export {
-  $ as default
-};

package/dist/dashboard/constants/Dashboard/index.es.js

@@ -1,4 +0,0 @@
-var i = /* @__PURE__ */ ((e) => (e[e.Main = 0] = "Main", e[e.RightSide = 1] = "RightSide", e[e.Disabled = 2] = "Disabled", e))(i || {});
-export {
-  i as DashboardLocation
-};

package/dist/debts/DebtsWidget/index.es.js

@@ -1,111 +0,0 @@
-import { jsx as t, jsxs as p } from "react/jsx-runtime";
-import e from "react";
-import { observer as N } from "mobx-react-lite";
-import f from "@mui/material/Stack";
-import R from "../components/SnowballCard/index.es.js";
-import z from "../components/SnowballDrawer/index.es.js";
-import K from "../components/DebtDrawer/index.es.js";
-import U from "../components/PaydownDrawer/index.es.js";
-import { DebtsChart as j } from "../components/DebtsChart/index.es.js";
-import { DebtsTable as M } from "../components/DebtsTable/index.es.js";
-import { DebtsPriorityAction as V } from "../components/actions/DebtsPriorityAction/index.es.js";
-import { transformDebtsChartData as Y } from "../utils/DebtsWidget/index.es.js";
-import { useAccountUiStore as $ } from "../../accounts/hooks/useUiStore/index.es.js";
-import { useDebtsUiStore as q } from "../hooks/useDebtsUiStore/index.es.js";
-import { PaydownButton as J } from "../components/debtspaydown/PaydownButton/index.es.js";
-import { useScreenSize as Q } from "../../common/hooks/useScreenSize/index.es.js";
-import { useGlobalCopyStore as X, useEvent as Z, useGlobalUiStore as tt, useAccountStore as et, useGoalStore as ot, useDebtStore as rt } from "../../common/context/hooks/index.es.js";
-import { ANALYTICS_EVENTS as c } from "../../common/constants/Analytics/index.es.js";
-import st from "../../common/components/Loader/index.es.js";
-import nt from "../../common/components/WidgetContainer/index.es.js";
-const it = ({ onBackClick: h, sx: E }) => {
-  const [O, d] = e.useState(!1), [k, u] = e.useState(!1), [I, D] = e.useState(!1), [n, v] = e.useState(""), { isDesktop: L, isMobile: o } = Q(), { debts: P } = X(), { onEvent: i } = Z(), { isCopyLoaded: _, isInitialized: l, setSelectedAccounts: b } = tt(), { setSelectedAccount: T } = $(), { selectedDebtPriority: C, setSelectedDebtChartData: g } = q(), { visibleDebtAccounts: s } = et(), { goalsLoaded: B, loadGoals: G, monthlyCashFlowProfile: S } = ot(), { debts: w } = rt(), a = e.useMemo(() => {
-    const r = S?.extra_payment ?? 0;
-    return Y(w, C, r);
-  }, [w, C, S]);
-  e.useEffect(() => {
-    b(s), i(c.DEBTS_VIEW);
-  }, []), e.useEffect(() => {
-    b(s);
-  }, [s]), e.useEffect(() => {
-    l && G().finally();
-  }, [l]);
-  const x = (r) => v(r), y = () => {
-    const r = s.find((m) => m.guid === n), A = a.find((m) => m.guid === n);
-    r && T(r), A && g(A), d(!0);
-  }, W = () => i(c.DEBTS_CLICK_FILTER), F = () => {
-    D(!0), i(c.DEBTS_CLICK_SNOWBALL_CTA);
-  }, H = () => {
-    u(!0), i(c.DEBTS_CLICK_PAYDOWN);
-  };
-  return !B || !_ || !l ? /* @__PURE__ */ t(st, {}) : /* @__PURE__ */ p(
-    nt,
-    {
-      accountOptions: s,
-      actions: [
-        /* @__PURE__ */ t(V, {}, "prioritize-debts"),
-        /* @__PURE__ */ t(J, { onClick: H }, "extra-paydown")
-      ],
-      onAccountsFilterClick: W,
-      onBackClick: h,
-      sx: E,
-      title: P.title,
-      children: [
-        /* @__PURE__ */ p(f, { sx: { px: L ? "48px" : "24px" }, children: [
-          /* @__PURE__ */ p(
-            f,
-            {
-              sx: {
-                alignItems: o ? "flex-start" : "flex-end",
-                flexDirection: o ? "column" : "row",
-                mx: o ? "-12px" : 0
-              },
-              children: [
-                /* @__PURE__ */ t(
-                  j,
-                  {
-                    debts: a,
-                    height: o ? 250 : void 0,
-                    hoveredDebtGuid: n,
-                    onClickArea: y,
-                    onHoverArea: x,
-                    sx: { mr: o ? "4px" : "-48px" }
-                  }
-                ),
-                /* @__PURE__ */ t(
-                  R,
-                  {
-                    debts: a,
-                    onClickCta: F,
-                    sx: { mb: o ? "0px" : "64px" }
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ t(f, { sx: { mx: o ? "-24px" : 0 }, children: /* @__PURE__ */ t(
-            M,
-            {
-              debts: a,
-              hoveredDebtGuid: n,
-              onClickRow: y,
-              onHoverRow: x
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ t(
-          z,
-          {
-            isOpen: I,
-            onClose: () => D(!1)
-          }
-        ),
-        /* @__PURE__ */ t(K, { isOpen: O, onClose: () => d(!1) }),
-        /* @__PURE__ */ t(U, { isOpen: k, onClose: () => u(!1) })
-      ]
-    }
-  );
-}, It = N(it);
-export {
-  It as default
-};

package/dist/debts/components/DebtDrawer/index.es.js

@@ -1,28 +0,0 @@
-import { jsx as t, jsxs as m, Fragment as c } from "react/jsx-runtime";
-import n from "@mui/material/Stack";
-import { useDebtsUiStore as p } from "../../hooks/useDebtsUiStore/index.es.js";
-import d from "../../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader/index.es.js";
-import f from "../debtsdrawer/DebtDetailsChart/index.es.js";
-import D from "../debtsdrawer/DebtDetailsContent/index.es.js";
-import { useGlobalCopyStore as b } from "../../../common/context/hooks/index.es.js";
-import h from "../../../common/components/drawer/Drawer/index.es.js";
-const k = ({ isOpen: o, onClose: e, sx: a }) => {
-  const { debts: r } = b(), { showError: s, showCompleted: i } = p(), l = s || i ? /* @__PURE__ */ t(c, {}) : /* @__PURE__ */ t(f, {});
-  return /* @__PURE__ */ t(
-    h,
-    {
-      ariaLabelClose: r.details_close_aria,
-      isOpen: o,
-      onClose: e,
-      sx: { ...a },
-      title: r.details_title,
-      children: /* @__PURE__ */ m(n, { bgcolor: "background.default", children: [
-        /* @__PURE__ */ t(d, { customDetailsChart: l }),
-        /* @__PURE__ */ t(D, {})
-      ] })
-    }
-  );
-};
-export {
-  k as default
-};

package/dist/debts/components/DebtsChart/index.es.js

@@ -1,134 +0,0 @@
-import { jsx as _ } from "react/jsx-runtime";
-import { LineChart as b } from "@mui/x-charts";
-import { useTheme as D } from "@mui/material/styles";
-import { adjustBrightness as L, BASE_LINE_COLOR as k } from "../../utils/DebtsChart/index.es.js";
-import { useEvent as I } from "../../../common/context/hooks/index.es.js";
-import { formatDate as S, DATE_FORMATS_INTL as v } from "../../../common/constants/DateFormats/index.es.js";
-import { formatCurrency as H } from "../../../common/utils/NumberFormatting/index.es.js";
-import { ANALYTICS_EVENTS as w } from "../../../common/constants/Analytics/index.es.js";
-const V = ({
-  sx: p,
-  height: g = 500,
-  width: h,
-  debts: f,
-  hoveredDebtGuid: l,
-  onClickArea: y,
-  onHoverArea: T
-}) => {
-  const A = D(), { onEvent: E } = I(), m = f.filter((e) => !e.is_impossible), r = [
-    ...new Set(
-      m.flatMap((e) => e.dataset.map((t) => new Date(t.x).getTime()))
-    )
-  ].sort((e, t) => e - t).map((e) => new Date(e)), n = m.map((e) => {
-    const t = new Map(e.dataset.map((o) => [new Date(o.x).getTime(), o.y]));
-    let a = t.get(r[0].getTime()) ?? 0;
-    const i = r.map((o) => {
-      const d = t.get(o.getTime()) ?? a;
-      return a = d, { x: o, y: d };
-    });
-    return { ...e, dataset: i };
-  }), c = n.reduce(
-    (e, t) => e + (t.dataset[0]?.y ?? 0),
-    0
-  ), M = r.map((e, t) => {
-    const a = t / (r.length - 1), i = c * (1 - a);
-    return { x: e, y: i };
-  }), x = Math.ceil(c / 100) * 100, C = r, s = n.map((e, t) => {
-    const a = 1 - t / n.length * 0.5, i = L(k, a);
-    return {
-      id: `debt-${t}`,
-      guid: e.guid,
-      label: e.name,
-      data: e.dataset.map((o) => o.y),
-      color: i,
-      curve: "linear",
-      type: "line",
-      area: !0,
-      stack: "total",
-      showMark: !1
-    };
-  });
-  s.push({
-    id: "payoff-line",
-    label: "Payoff Line",
-    data: M.map((e) => e.y),
-    color: A.palette.grey[700],
-    curve: "linear",
-    type: "line",
-    stack: void 0,
-    showMark: !1,
-    disableHighlight: !0
-  });
-  const u = (e) => s.findIndex((t) => t?.guid === e);
-  return /* @__PURE__ */ _(
-    b,
-    {
-      axisHighlight: { x: "none" },
-      disableLineItemHighlight: !0,
-      height: g,
-      onAreaClick: (e, t) => {
-        y?.();
-        const a = s.find((i) => i.id === t.seriesId);
-        E(w.DEBTS_CLICK_CHART_AREA, { account_guid: a?.guid });
-      },
-      onHighlightChange: (e) => {
-        const t = s.find((a) => a.id === e?.seriesId)?.guid;
-        T?.(t ?? "");
-      },
-      series: s,
-      skipAnimation: !0,
-      slotProps: {
-        legend: {
-          hidden: !0
-        }
-      },
-      sx: {
-        p: 4,
-        "& .MuiBarLabel-root": {
-          fontSize: 10,
-          fontWeight: 600
-        },
-        "& .MuiAreaElement-root": {
-          opacity: 0.4,
-          transition: "opacity 0.3s ease"
-        },
-        "& .MuiAreaElement-root:hover": {
-          opacity: 1
-        },
-        "& .MuiLineElement-series-payoff-line": {
-          strokeDasharray: "10 5",
-          strokeWidth: 1
-        },
-        [`& .MuiLineElement-series-debt-${u(l ?? "0")}`]: {
-          opacity: 1
-        },
-        [`& .MuiAreaElement-series-debt-${u(l ?? "0")}`]: {
-          opacity: 1
-        },
-        ...p
-      },
-      tooltip: { trigger: "none" },
-      width: h,
-      xAxis: [
-        {
-          data: C,
-          scaleType: "time",
-          min: r[0],
-          disableTicks: !0,
-          valueFormatter: (e) => S(e, v.MONTH_SHORT_YEAR)
-        }
-      ],
-      yAxis: [
-        {
-          min: 0,
-          max: x,
-          disableTicks: !0,
-          valueFormatter: (e) => H(e, "0a")
-        }
-      ]
-    }
-  );
-};
-export {
-  V as DebtsChart
-};

package/dist/debts/components/DebtsTable/AccountCell/index.es.js

@@ -1,24 +0,0 @@
-import { jsxs as o, jsx as n } from "react/jsx-runtime";
-import { InstitutionLogo as a, Text as i } from "@mxenabled/mxui";
-import c from "@mui/material/Stack";
-import { AccountTypeName as l } from "../../../../common/types/Account/index.es.js";
-const d = (r) => {
-  const t = r.row.account, e = l[t.account_type];
-  return /* @__PURE__ */ o(c, { alignItems: "center", flexDirection: "row", children: [
-    /* @__PURE__ */ n(
-      a,
-      {
-        alt: `${t.institutionName}`,
-        institutionGuid: t.institution_guid || ""
-      }
-    ),
-    /* @__PURE__ */ o(c, { ml: 12, children: [
-      /* @__PURE__ */ n(i, { variant: "Small", children: t.name }),
-      /* @__PURE__ */ n(i, { variant: "XSmall", children: e })
-    ] })
-  ] });
-};
-export {
-  d as AccountCell,
-  d as default
-};

package/dist/debts/components/DebtsTable/PriorityCell/index.es.js

@@ -1,32 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import n from "@mui/material/Box";
-import { Text as i } from "@mxenabled/mxui";
-const c = (o) => {
-  const t = {
-    text: "#121417",
-    background: "#FFB252"
-  };
-  return o === "!" && (t.text = "#FFFFFF", t.background = "#DF320C"), o === "✓" && (t.text = "#FFFFFF", t.background = "#09A57F"), t;
-}, s = (o) => {
-  const t = String(o.formattedValue), r = c(t);
-  return /* @__PURE__ */ e(
-    n,
-    {
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        width: 20,
-        // Adjust the size as needed
-        height: 20,
-        borderRadius: "50%",
-        backgroundColor: r.background,
-        marginLeft: "10px"
-      },
-      children: /* @__PURE__ */ e(i, { color: r.text, fontWeight: 700, variant: "Small", children: t })
-    }
-  );
-};
-export {
-  s as PriorityCell
-};

package/dist/debts/components/DebtsTable/index.es.js

@@ -1,174 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import c from "react";
-import { useTheme as E } from "@mui/material";
-import { DataGridPro as I } from "@mui/x-data-grid-pro";
-import T from "@mui/material/Box";
-import { Icon as w } from "@mxenabled/mxui";
-import { priorityComparator as M, getPriorityValue as R } from "../../utils/DebtsTable/index.es.js";
-import { HeaderCell as o } from "../../../trends/components/trendstable/HeaderCell/index.es.js";
-import { PriorityCell as v } from "../debtstable/PriorityCell/index.es.js";
-import { AccountCell as H } from "../debtstable/AccountCell/index.es.js";
-import { useEvent as D, useGlobalCopyStore as F } from "../../../common/context/hooks/index.es.js";
-import { useScreenSize as L } from "../../../common/hooks/useScreenSize/index.es.js";
-import { formatCurrency as f } from "../../../common/utils/NumberFormatting/index.es.js";
-import { formatDate as W, DATE_FORMATS_INTL as O } from "../../../common/constants/DateFormats/index.es.js";
-import { ANALYTICS_EVENTS as h } from "../../../common/constants/Analytics/index.es.js";
-const ee = ({
-  sx: p = {},
-  debts: a,
-  hoveredDebtGuid: g,
-  onHoverRow: n,
-  onClickRow: b
-}) => {
-  const _ = E(), { onEvent: d } = D(), { isMobile: t } = L(), { debts: r } = F(), [m, y] = c.useState([
-    { field: "priority", sort: "asc" }
-  ]), s = [
-    {
-      field: "priority",
-      headerName: r.table_column_priority,
-      renderHeader: o,
-      renderCell: v,
-      sortComparator: M,
-      sortable: !0,
-      hideSortIcons: !0,
-      type: "custom",
-      align: "left",
-      headerAlign: "left",
-      minWidth: t ? 67 : 72,
-      flex: t ? 0.2 : 0.4
-    },
-    {
-      field: "account",
-      headerName: r.table_column_account,
-      renderHeader: o,
-      renderCell: H,
-      sortable: !1,
-      type: "custom",
-      align: "left",
-      headerAlign: "left",
-      minWidth: t ? 180 : 225,
-      flex: 1
-    },
-    {
-      field: "balance",
-      headerName: r.table_column_balance,
-      renderHeader: o,
-      valueFormatter: (e) => f(e, "0,0"),
-      sortable: !0,
-      hideSortIcons: t,
-      type: "number",
-      align: t ? "right" : "left",
-      headerAlign: t ? "right" : "left",
-      minWidth: t ? 70 : 122,
-      flex: t ? 0.4 : 0.6
-    },
-    {
-      field: "interest_rate",
-      headerName: r.table_column_interest_rate,
-      renderHeader: o,
-      valueFormatter: (e) => isNaN(e) ? "---" : `${Number(e).toFixed(2)}%`,
-      sortable: !0,
-      hideSortIcons: t,
-      type: "number",
-      align: "left",
-      headerAlign: "left",
-      minWidth: 122,
-      flex: 0.6
-    },
-    {
-      field: "projected_payoff_date",
-      headerName: r.table_column_payoff_date,
-      renderHeader: o,
-      valueFormatter: (e) => e ? W(e, O.MONTH_SHORT_YEAR) : "---",
-      sortable: !0,
-      hideSortIcons: t,
-      type: "number",
-      align: "left",
-      headerAlign: "left",
-      minWidth: 122,
-      flex: 0.6
-    },
-    {
-      field: "monthly_payment",
-      headerName: r.table_column_amount_due,
-      renderHeader: o,
-      valueFormatter: (e) => typeof e == "number" ? f(e, "0,0") : "---",
-      sortable: !0,
-      hideSortIcons: t,
-      type: "number",
-      align: "left",
-      headerAlign: "left",
-      minWidth: 122,
-      flex: 0.6
-    }
-  ], C = [
-    ...s.slice(0, 3),
-    {
-      field: "chevron",
-      headerName: "",
-      renderHeader: void 0,
-      renderCell: () => /* @__PURE__ */ l(w, { name: "chevron_right'" }),
-      sortable: !0,
-      hideSortIcons: !0,
-      type: "custom",
-      align: "right",
-      headerAlign: "right",
-      width: 20
-    }
-  ], u = c.useMemo(() => a.map((e, i) => ({
-    ...e,
-    id: i,
-    priority: R(e)
-  })), [a]), S = (e) => {
-    const x = e.target.closest("[data-id]")?.getAttribute("data-id"), A = a[Number(x)];
-    n?.(A?.guid ?? "");
-  }, N = (e) => u.find((i) => i.guid === e)?.id;
-  return /* @__PURE__ */ l(
-    T,
-    {
-      sx: {
-        height: "100dvh",
-        width: "100%",
-        mt: "15px",
-        overflowX: "auto",
-        boxShadow: "none",
-        ...p
-      },
-      children: /* @__PURE__ */ l(
-        I,
-        {
-          columns: t ? C : s,
-          disableColumnFilter: !0,
-          disableColumnMenu: !0,
-          hideFooter: !0,
-          initialState: { sorting: { sortModel: m } },
-          onRowClick: (e) => {
-            b(), d(h.TRENDS_CLICK_TABLE_ROW, { account_guid: e.row.guid });
-          },
-          onSortModelChange: (e) => {
-            y(e), d(h.TRENDS_CLICK_TABLE_SORT);
-          },
-          rows: u,
-          slotProps: {
-            baseIconButton: { color: "secondary", sx: { ml: 8 } },
-            row: {
-              onMouseEnter: S,
-              onMouseLeave: () => n?.("")
-            }
-          },
-          sortModel: m,
-          sortingOrder: ["asc", "desc"],
-          sx: {
-            [`& .MuiDataGrid-row[data-id="${N(g)}"]`]: {
-              backgroundColor: _.palette.mode === "light" ? "#f8f9fb" : "#1f2329",
-              filter: "brightness(98%)"
-            }
-          }
-        }
-      )
-    }
-  );
-};
-export {
-  ee as DebtsTable
-};

package/dist/debts/components/PaydownDrawer/index.es.js

@@ -1,21 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import n from "../debtspaydown/PaydownContent/index.es.js";
-import { useGlobalCopyStore as d } from "../../../common/context/hooks/index.es.js";
-import i from "../../../common/components/drawer/Drawer/index.es.js";
-const w = ({ isOpen: e, onClose: t, sx: a }) => {
-  const { debts: r } = d();
-  return /* @__PURE__ */ o(
-    i,
-    {
-      ariaLabelClose: r.paydown_drawer_close_aria,
-      isOpen: e,
-      onClose: t,
-      sx: { ...a },
-      title: r.paydown_drawer_title,
-      children: /* @__PURE__ */ o(n, {})
-    }
-  );
-};
-export {
-  w as default
-};

package/dist/debts/components/SnowballCard/index.es.js

@@ -1,65 +0,0 @@
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
-import f from "react";
-import { observer as S } from "mobx-react-lite";
-import { useTheme as u, Card as y, Stack as i } from "@mui/material";
-import { Text as o } from "@mxenabled/mxui";
-import { getPayoffProjection as w } from "../../utils/SnowballCard/index.es.js";
-import { useDebtsUiStore as _ } from "../../hooks/useDebtsUiStore/index.es.js";
-import { useGlobalCopyStore as v, useGoalStore as g } from "../../../common/context/hooks/index.es.js";
-import { useScreenSize as C } from "../../../common/hooks/useScreenSize/index.es.js";
-const P = ({ debts: n, onClickCta: c, sx: m }) => {
-  const t = u(), { isMobile: a } = C(), { debts: e } = v(), { selectedDebtPriority: p } = _(), { monthlyCashFlowProfile: s } = g(), { payoffDate: d, payoffSavings: h, payoffDuration: x } = f.useMemo(() => {
-    const b = s?.extra_payment ?? 0;
-    return w(n, p, b);
-  }, [n, p, s]);
-  return /* @__PURE__ */ r(
-    y,
-    {
-      sx: {
-        boxShadow: t.shadows[2],
-        width: a ? "100%" : "186px",
-        minWidth: "186px",
-        ...m
-      },
-      children: /* @__PURE__ */ l(i, { sx: { gap: "12px", p: "16px" }, children: [
-        /* @__PURE__ */ l(
-          i,
-          {
-            gap: a ? "4px" : "0",
-            sx: {
-              borderBottom: "1px solid",
-              borderBottomColor: t.palette.grey[300],
-              pb: "8px"
-            },
-            children: [
-              /* @__PURE__ */ r(o, { variant: "XSmall", children: e.snowball_card_date_description }),
-              /* @__PURE__ */ r(o, { bold: !0, color: t.palette.primary.main, variant: "Small", children: d })
-            ]
-          }
-        ),
-        /* @__PURE__ */ l(i, { gap: a ? "4px" : "0", children: [
-          /* @__PURE__ */ r(o, { bold: !0, variant: "Small", children: h }),
-          /* @__PURE__ */ r(o, { sx: { whiteSpace: "normal" }, variant: "XSmall", children: e.snowball_card_amount_description })
-        ] }),
-        /* @__PURE__ */ l(i, { gap: a ? "4px" : "0", children: [
-          /* @__PURE__ */ r(o, { bold: !0, variant: "Small", children: x }),
-          /* @__PURE__ */ r(o, { variant: "XSmall", children: e.snowball_card_duration_description })
-        ] }),
-        /* @__PURE__ */ r(
-          o,
-          {
-            bold: !0,
-            color: t.palette.primary.main,
-            onClick: c,
-            sx: { cursor: "pointer" },
-            variant: "Small",
-            children: e.snowball_card_cta
-          }
-        )
-      ] })
-    }
-  );
-}, F = S(P);
-export {
-  F as default
-};