@mx-cartographer/experiences 8.0.0-alpha.bb2 → 8.0.0-alpha.bb4

package/dist/SpendingLegend-6FqtMcBV.mjs

@@ -0,0 +1,193 @@
+import { b as T } from "./CategoryUtil-DfVKKkRf.mjs";
+import { b as p } from "./Category-Ccoew_sA.mjs";
+import { jsxs as y, Fragment as v, jsx as c } from "react/jsx-runtime";
+import _ from "react";
+import { observer as w } from "mobx-react-lite";
+import N from "@mui/material/Button";
+import f from "@mui/material/Stack";
+import { useTheme as k } from "@mui/material/styles";
+import { CategoryIcon as M, CategoryIconVariants as A, Text as h } from "@mxenabled/mxui";
+import { D as G } from "./Donut-Dmy3JTWd.mjs";
+import { u as O } from "./TransactionDetails-Bn0qY5Hw.mjs";
+import { u as $ } from "./hooks-C41HAxM5.mjs";
+import { u as j } from "./useScreenSize-B5afALev.mjs";
+import { f as x } from "./NumberFormatting-DjTD0t3W.mjs";
+import R from "@mui/material/Box";
+const D = 5, V = (i, l, g, d) => d.reduce((o, n) => {
+  const r = i.find((s) => s.guid === n.category_guid);
+  if (!r) return o;
+  const t = r.parent_guid ?? r.guid, a = i.find((s) => s.guid === t);
+  if (!a) return o;
+  const m = {
+    guid: r.guid,
+    name: r.guid === t ? `${l.parent_category_totals_label_general} ${r.name}` : r.name,
+    color: T(a.guid, g),
+    amount: n.total
+  }, e = o.find((s) => s.guid === t);
+  return e ? (e.amount += n.total, e.categoryTotals?.push(m)) : o.push({
+    guid: t,
+    name: a.name,
+    color: T(a.guid, g),
+    categoryTotals: [m],
+    amount: n.total
+  }), o;
+}, []), ot = (i, l, g, d) => {
+  const o = V(i, l, g, d), n = o.filter(
+    (e) => e.guid !== p.INCOME && e.guid !== p.INVESTMENTS && e.guid !== p.TRANSFER
+  ).sort((e, s) => s.amount - e.amount), r = n.reduce(
+    (e, s) => e + s.amount,
+    0
+  ), t = n.length > D ? D : n.length, a = n.slice(0, t), m = a.map((e) => ({
+    id: e.guid,
+    color: T(e.guid, g),
+    label: e.name,
+    value: e.amount / r * 100
+  }));
+  if (n.length > 5) {
+    const e = n.slice(D, o.length), s = e.reduce(
+      (C, u) => C + u.amount,
+      0
+    );
+    a.push({
+      guid: "other",
+      color: g.palette.categories.others || "",
+      name: l.saving_goal_other,
+      categoryTotals: e,
+      amount: s
+    }), m.push({
+      id: "other",
+      color: g.palette.categories.others || "",
+      label: l.saving_goal_other,
+      value: s / r * 100
+    });
+  }
+  return {
+    categoryData: a,
+    donutData: m,
+    totalAmount: r
+  };
+}, nt = (i, l, g) => {
+  const d = i.filter(
+    (t) => t.guid === p.INCOME || t.parent_guid === p.INCOME
+  ), o = l.filter((t) => d.some((a) => a.guid === t.category_guid)).sort((t, a) => t.total - a.total).map((t, a) => ({
+    guid: t.category_guid,
+    name: i.find((m) => m.guid === t.category_guid)?.name,
+    color: g[a],
+    categoryTotals: [],
+    amount: Math.abs(t.total)
+  })), n = o.reduce(
+    (t, a) => t + a.amount,
+    0
+  ), r = o.map((t) => ({
+    id: t.guid,
+    color: t.color,
+    label: t.name,
+    value: t.amount / n * 100
+  }));
+  return {
+    categoryData: o,
+    donutData: r,
+    totalAmount: n
+  };
+}, B = ({
+  data: i,
+  isIncome: l = !1,
+  onSelected: g,
+  onViewTransactions: d,
+  selectedId: o,
+  size: n = 150,
+  totalLabel: r,
+  variant: t = "mini"
+}) => {
+  const { spending: a } = $(), m = k(), { isTablet: e } = j(), { announce: s, ariaLive: C } = O(), u = _.useMemo(
+    () => o ? i.categoryData.find((b) => b.guid === o) : void 0,
+    [o]
+  );
+  _.useEffect(() => {
+    if (u) {
+      const b = x(u.amount, "0,0");
+      s(`${u.name}: ${b}`);
+    }
+  }, [u, s]);
+  const S = i.donutData.length > 0 ? i.donutData : [{ id: "0", color: m.palette.divider, value: 100 }], E = () => {
+    d?.(o);
+  }, I = e ? 32 : 48;
+  return /* @__PURE__ */ y(v, { children: [
+    C,
+    /* @__PURE__ */ c(G, { data: S, onClick: g, selectedId: o, size: n, children: /* @__PURE__ */ c(f, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ y(f, { alignItems: "center", justifyContent: "center", minHeight: n, minWidth: n, children: [
+      u && /* @__PURE__ */ y(
+        f,
+        {
+          alignItems: "center",
+          gap: t === "mini" ? 0 : 8,
+          mb: t === "mini" ? 0 : 8,
+          mt: t === "mini" ? 0 : -16,
+          sx: t === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
+          children: [
+            /* @__PURE__ */ c(
+              M,
+              {
+                categoryGuid: l ? p.INCOME : u.guid,
+                size: t === "mini" ? 24 : I,
+                variant: A.Transparent
+              }
+            ),
+            /* @__PURE__ */ c(
+              h,
+              {
+                color: "secondary",
+                noWrap: !0,
+                variant: t === "mini" ? "tiny" : "body1",
+                children: u ? u.name : r
+              }
+            )
+          ]
+        }
+      ),
+      !u && t === "full" && /* @__PURE__ */ c(h, { bold: !0, color: "secondary", sx: { mb: { xs: 4, xl: 8 } }, children: r }),
+      /* @__PURE__ */ c(h, { variant: t === "mini" ? "h2" : "h1", children: u ? x(u.amount, "0,0") : x(i.totalAmount, "0,0") }),
+      !u && t === "mini" && /* @__PURE__ */ c(h, { color: "secondary", noWrap: !0, variant: "tiny", children: r }),
+      t === "full" && /* @__PURE__ */ c(
+        N,
+        {
+          "aria-label": `View ${u?.name || ""} Transactions`,
+          disabled: i.categoryData.length === 0,
+          onClick: E,
+          sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
+          variant: "text",
+          children: a.view_transactions
+        }
+      )
+    ] }) }) })
+  ] });
+}, et = w(B), at = ({ data: i, onSelected: l, selectedId: g }) => {
+  const d = (o, n) => {
+    (o.key === "Enter" || o.key === " ") && (o.preventDefault(), l(n));
+  };
+  return /* @__PURE__ */ c(f, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: i.categoryData.map((o) => /* @__PURE__ */ y(
+    f,
+    {
+      alignItems: "center",
+      "aria-label": o.name,
+      "aria-pressed": o.guid === g,
+      direction: "row",
+      gap: 8,
+      onClick: () => l(o.guid),
+      onKeyDown: (n) => d(n, o.guid),
+      role: "button",
+      sx: { cursor: "pointer" },
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ c(R, { borderRadius: 4, height: 8, sx: { backgroundColor: o.color }, width: 8 }),
+        /* @__PURE__ */ c(h, { bold: o.guid === g, variant: "caption", children: o.name })
+      ]
+    },
+    o.guid
+  )) });
+};
+export {
+  et as S,
+  nt as a,
+  at as b,
+  ot as g
+};

package/dist/{StatusBar-BK_uYHAB.mjs → StatusBar-CPfSXe80.mjs}

@@ -1,9 +1,9 @@
-import { jsx as a } from "react/jsx-runtime";
+import { jsx as c } from "react/jsx-runtime";
 import i from "@mui/material/Box";
 import p from "@mui/material/Stack";
-const s = ({ data: c, height: r = 8 }) => {
+const s = ({ data: a, height: r = 8 }) => {
   const o = `${r / 4}px`;
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ c(
     p,
     {
       bgcolor: "divider",
@@ -12,7 +12,7 @@ const s = ({ data: c, height: r = 8 }) => {
       gap: 2,
       height: r,
       width: "100%",
-      children: c.map((t, d) => /* @__PURE__ */ a(
+      children: a.map((t, d) => /* @__PURE__ */ c(
         i,
         {
           bgcolor: t.color,
@@ -24,7 +24,7 @@ const s = ({ data: c, height: r = 8 }) => {
       ))
     }
   );
-}, l = s;
+};
 export {
-  l as S
+  s as S
 };

package/dist/{TabContentContainer-j01JYR_7.mjs → TabContentContainer-CnMXkVqr.mjs}

@@ -1,21 +1,21 @@
 import { jsx as e } from "react/jsx-runtime";
-const b = ({
+const n = ({
   children: o,
   index: t,
   name: a,
-  value: n,
-  ...r
+  value: r,
+  ...b
 }) => /* @__PURE__ */ e(
   "div",
   {
     "aria-labelledby": `${a}-tab-${t}`,
-    hidden: n !== t,
+    hidden: r !== t,
     id: `${a}-tabpanel-${t}`,
     role: "tabpanel",
-    ...r,
-    children: n === t && o
+    ...b,
+    children: r === t && o
   }
-), i = b;
+);
 export {
-  i as T
+  n as T
 };

package/dist/{ToggleListItem-r0Kx56wF.mjs → ToggleListItem-ciFTiqRS.mjs}

@@ -1,11 +1,11 @@
 import { jsx as e, jsxs as S } from "react/jsx-runtime";
-import x from "@mui/material/ListItem";
+import o from "@mui/material/ListItem";
 import c from "@mui/material/ListItemButton";
 import p from "@mui/material/ListItemIcon";
-import D from "@mui/material/ListItemText";
-import L from "@mui/material/Stack";
-import o from "@mui/material/Switch";
-import { Text as u } from "@mxenabled/mxui";
+import u from "@mui/material/ListItemText";
+import x from "@mui/material/Stack";
+import D from "@mui/material/Switch";
+import { Text as L } from "@mxenabled/mxui";
 import w from "@mui/material/ListItemAvatar";
 var B = /* @__PURE__ */ ((r) => (r.Accounts = "accounts", r.Budgets = "budgets", r.Insights = "insights", r.Personal = "personal", r))(B || {}), P = /* @__PURE__ */ ((r) => (r[r.DebtPaymentReminder = 3] = "DebtPaymentReminder", r[r.AccountBalanceLow = 6] = "AccountBalanceLow", r[r.AccountDepositLarge = 7] = "AccountDepositLarge", r[r.TransactionExpenseLarge = 8] = "TransactionExpenseLarge", r[r.TransactionFeeCharge = 9] = "TransactionFeeCharge", r[r.InternationalTransaction = 23] = "InternationalTransaction", r[r.AccountDepositLargePosted = 48] = "AccountDepositLargePosted", r))(P || {}), b = /* @__PURE__ */ ((r) => (r[r.BudgetExceeded = 1] = "BudgetExceeded", r[r.BudgetOffTarget = 2] = "BudgetOffTarget", r))(b || {}), A = /* @__PURE__ */ ((r) => (r[r.AccountBalanceLow = 33] = "AccountBalanceLow", r[r.BillAmountNotStandard = 49] = "BillAmountNotStandard", r[r.CategorySpending = 50] = "CategorySpending", r[r.CreditCardCloseToLimit = 51] = "CreditCardCloseToLimit", r[r.DebtPaymentReminder = 37] = "DebtPaymentReminder", r[r.DuplicatePayment = 42] = "DuplicatePayment", r[r.MonthlySpendComparison = 53] = "MonthlySpendComparison", r[r.MonthlySpendToIncomeComparison = 54] = "MonthlySpendToIncomeComparison", r[r.MonthlySubscriptionAggregate = 55] = "MonthlySubscriptionAggregate", r[r.MonthlyTopMerchantSpending = 56] = "MonthlyTopMerchantSpending", r[r.SaveAnExtra100Dollars = 57] = "SaveAnExtra100Dollars", r[r.SavingsOpportunity = 58] = "SavingsOpportunity", r[r.SetUpDirectDeposit = 59] = "SetUpDirectDeposit", r[r.SwitchDirectDeposit = 60] = "SwitchDirectDeposit", r[r.UncategorizedTransactions = 61] = "UncategorizedTransactions", r[r.UnifiedDeposit = 62] = "UnifiedDeposit", r[r.UpcomingBill = 63] = "UpcomingBill", r[r.WeekendSpendingSummary = 64] = "WeekendSpendingSummary", r[r.WeeklyNewMerchants = 65] = "WeeklyNewMerchants", r[r.DiscoveredAccounts = 52] = "DiscoveredAccounts", r[r.TransactionExpenseLarge = 39] = "TransactionExpenseLarge", r[r.PromotionalCampaignMessages = 67] = "PromotionalCampaignMessages", r[r.TransparentOverdraft = 68] = "TransparentOverdraft", r))(A || {});
 const z = ({
@@ -21,18 +21,18 @@ const z = ({
 }) => (
   //TODO: implement common/components/ListItemRow.tsx
   /* @__PURE__ */ e(
-    x,
+    o,
     {
-      secondaryAction: /* @__PURE__ */ e(o, { checked: l, onChange: C }),
+      secondaryAction: /* @__PURE__ */ e(D, { checked: l, onChange: C }),
       sx: {
         "& .MuiListItemSecondaryAction-root": { right: a ? 64 : 24 },
         "& .MuiListItemButton-root": { pr: 24 }
       },
       children: /* @__PURE__ */ S(c, { onClick: d ? void 0 : () => m(), children: [
         r && /* @__PURE__ */ e(w, { children: r }),
-        /* @__PURE__ */ e(D, { primaryTypographyProps: { fontWeight: 400 }, children: /* @__PURE__ */ e(L, { alignItems: "center", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ S(L, { sx: { width: "100%" }, children: [
+        /* @__PURE__ */ e(u, { primaryTypographyProps: { fontWeight: 400 }, children: /* @__PURE__ */ e(x, { alignItems: "center", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ S(x, { sx: { width: "100%" }, children: [
           /* @__PURE__ */ e(
-            u,
+            L,
             {
               bold: n,
               color: "text.primary",
@@ -43,7 +43,7 @@ const z = ({
               children: v
             }
           ),
-          /* @__PURE__ */ e(u, { color: "text.secondary", variant: "caption", children: M })
+          /* @__PURE__ */ e(L, { color: "text.secondary", variant: "caption", children: M })
         ] }) }) }),
         !d && a && /* @__PURE__ */ e(p, { children: a })
       ] })
@@ -57,18 +57,23 @@ const z = ({
   secondaryText: n = void 0,
   useExtraPadding: m = !0
 }) => /* @__PURE__ */ e(
-  x,
+  o,
   {
-    secondaryAction: /* @__PURE__ */ e(o, { checked: r, disabled: a, onChange: l }),
+    secondaryAction: /* @__PURE__ */ e(D, { checked: r, disabled: a, onChange: l }),
     sx: {
       pl: m ? 48 : 0,
       "& .MuiListItemSecondaryAction-root": { right: m ? 64 : 24 }
     },
     children: /* @__PURE__ */ e(
-      D,
+      u,
       {
         primary: d,
-        primaryTypographyProps: { fontWeight: 400, variant: "body1", maxWidth: "calc(100% - 60px)" },
+        primaryTypographyProps: {
+          fontWeight: 400,
+          variant: "body1",
+          maxWidth: "calc(100% - 60px)",
+          color: "text.primary"
+        },
         secondary: n,
         secondaryTypographyProps: {
           color: "text.secondary",

package/dist/TransactionApi-CjBoLleL.mjs

@@ -0,0 +1,86 @@
+import { F as g, A as e } from "./Fetch-DecPFeGU.mjs";
+class u {
+  fetchInstance;
+  constructor(n, t, a) {
+    this.fetchInstance = new g(n, t, void 0, a);
+  }
+  addTag = async (n) => this.fetchInstance.post(e.TAGS, n).then((t) => t.tag).catch((t) => t);
+  addTagging = async (n) => this.fetchInstance.post(e.TAGGINGS, n).then((t) => t.tagging).catch((t) => t);
+  addTransaction = async (n) => this.fetchInstance.post(e.TRANSACTIONS, n).then((t) => t.transaction).catch((t) => t);
+  addTransactionRule = async (n) => this.fetchInstance.post(e.TRANSACTION_RULES, n).then((t) => t).catch((t) => t);
+  getTaggings = async () => this.fetchInstance.get(e.TAGGINGS).then((n) => n.map((t) => t.tagging));
+  getTags = async () => this.fetchInstance.get(e.TAGS).then((n) => n.map((t) => t.tag));
+  getTransactionRules = async () => this.fetchInstance.get(e.TRANSACTION_RULES).then((n) => n.transaction_rules);
+  getTransactionsByDateRange = async (n, t) => this.fetchInstance.get(`${e.TRANSACTIONS}/by_date/${n}/${t}`).then((a) => a.map((c) => c.transaction));
+  // DEPRECATED
+  getTransactionsByAccountsAndDateRange = async (n, t, a) => {
+    console.warn("DEPRECATED: getTransactionsByAccountsAndDateRange will be removed");
+    const c = n.reduce(
+      (o, s, r) => `${o}account_guids[]=${s}${r !== n.length - 1 ? "&" : ""}`,
+      ""
+    );
+    return this.fetchInstance.get(`${e.TRANSACTIONS}/by_date/${t}/${a}?${c}`).then((o) => o.map((s) => s.transaction));
+  };
+  // DEPRECATED
+  getTransactionsByGuids = async (n) => (console.warn("DEPRECATED: getTransactionsByGuids will be removed"), this.fetchInstance.post(`${e.TRANSACTIONS}/by_guids`, { guids: n.join("+") }).then((t) => t.map((a) => a.transaction)));
+  // DEPRECATED
+  getTransactionsByCategoryAndDate = async (n, t, a) => (console.warn("DEPRECATED: getTransactionsByCategoryAndDate will be removed"), this.fetchInstance.get(
+    `${e.TRANSACTIONS}/by_category_guid/${n}/by_date/${t}/${a}`
+  ).then((c) => c.map((o) => o.transaction)));
+  // DEPRECATED
+  getTransactionsByCategoryDateAndAccounts = async (n, t, a, c) => {
+    console.warn("DEPRECATED: getTransactionsByCategoryDateAndAccounts will be removed");
+    const o = c.reduce(
+      (s, r, i) => `${s}account_guids[]=${r}${i !== c.length - 1 ? "&" : ""}`,
+      ""
+    );
+    return this.fetchInstance.get(
+      `${e.TRANSACTIONS}/by_category_guid/${n}/by_date/${t}/${a}?${o}`
+    ).then((s) => s.map((r) => r.transaction));
+  };
+  // DEPRECATED
+  getTransactionsByCategoriesDateAndAccounts = async (n, t, a, c) => {
+    console.warn("DEPRECATED: getTransactionsByCategoriesDateAndAccounts will be removed");
+    const o = c.reduce(
+      (s, r, i) => `${s}account_guids[]=${r}${i !== c.length - 1 ? "&" : ""}`,
+      ""
+    );
+    return this.fetchInstance.get(
+      `${e.TRANSACTIONS}/by_category_guids/${n.join(
+        "+"
+      )}/by_date/${t}/${a}?${o}`
+    ).then((s) => s.map((r) => r.transaction));
+  };
+  /**
+   * DEPRECATED
+   * Get all transactions by the top level category, between begin date and end date, and optionally
+   * filtered by accounts
+   * @param categoryGuid The top level category guid
+   * @param beginDate the start date
+   * @param endDate the end date
+   * @param accountGuids an optional list of account guids
+   */
+  getTransactionsByTopLevelCategoryAndDate = async (n, t, a, c = []) => {
+    console.warn("DEPRECATED: getTransactionsByTopLevelCategoryAndDate will be removed");
+    let o = `${e.TRANSACTIONS}/by_top_level_category_guid/${n}/by_date/${t}/${a}`;
+    if (c.length > 0) {
+      const s = c.reduce(
+        (r, i, h) => `${r}account_guids[]=${i}${h !== c.length - 1 ? "&" : ""}`,
+        ""
+      );
+      o += `?${s}`;
+    }
+    return this.fetchInstance.get(o).then((s) => s.map((r) => r.transaction));
+  };
+  removeTag = async (n) => this.fetchInstance.delete(`${e.TAGS}/${n}`).then((t) => t).catch((t) => t);
+  removeTagging = async (n) => this.fetchInstance.delete(`${e.TAGGINGS}/${n}`).then((t) => t).catch((t) => t);
+  removeTransaction = async (n) => this.fetchInstance.delete(`${e.TRANSACTIONS}/${n}`).then((t) => t);
+  removeTransactionRule = async (n) => this.fetchInstance.delete(`${e.TRANSACTION_RULES}/${n}`).catch((t) => t);
+  removeTransactionSplit = async (n) => this.fetchInstance.delete(`${e.TRANSACTIONS}/${n}/unsplit`).then((t) => t).catch((t) => t);
+  updateTransactionRule = async (n) => this.fetchInstance.put(`${e.TRANSACTION_RULES}/${n.guid}`, n).then((t) => t).catch((t) => t);
+  updateTag = async (n) => this.fetchInstance.put(`${e.TAGS}/${n.guid}`, n).then((t) => t.tag).catch((t) => t);
+  updateTransaction = async (n) => this.fetchInstance.put(`${e.TRANSACTIONS}/${n.guid}`, n).then((t) => t.transaction).catch((t) => t);
+}
+export {
+  u as T
+};