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

package/dist/transactions/components/splitmanager/SplitRow/index.es.js

@@ -0,0 +1,126 @@
+import { jsxs as r, jsx as t } from "react/jsx-runtime";
+import S from "react";
+import { observer as w } from "mobx-react-lite";
+import g from "@mui/material/Box";
+import b from "@mui/material/Button";
+import m from "@mui/material/Grid";
+import N from "@mui/material/IconButton";
+import i from "@mui/material/Stack";
+import d from "@mui/icons-material/Cancel";
+import T from "@mui/icons-material/ChevronRight";
+import E from "@mui/icons-material/DeleteOutlined";
+import { useTokens as O, CategoryIcon as k, Text as s } from "@mxenabled/mxui";
+import v from "../../../../categories/components/CategorySelectorDrawer/index.es.js";
+import { ON_CLICK_EVENTS as R } from "../../../constants/OnClickEvents/index.es.js";
+import A from "../../../../common/components/CurrencyInput/index.es.js";
+import { useEvent as B, useGlobalCopyStore as X } from "../../../../common/context/hooks/index.es.js";
+import { formatCurrency as z } from "../../../../common/utils/NumberFormatting/index.es.js";
+const D = ({
+  index: c,
+  onDeleteRow: _,
+  onCategoryChanged: f,
+  onUpdateAmount: h,
+  split: e
+}) => {
+  const o = O(), { onEvent: y } = B(), { transactions: n } = X(), [p, C] = S.useState(`${e.amount}`), [I, l] = S.useState(!1), u = c === 0, x = (a) => {
+    isNaN(Number(a)) || (C(a), h(c, Number(a)));
+  };
+  return /* @__PURE__ */ r(
+    g,
+    {
+      bgcolor: "background.paper",
+      className: "mx-txn-split-manager-row",
+      pb: o.Spacing.Tiny,
+      px: o.Spacing.XSmall,
+      children: [
+        /* @__PURE__ */ r(m, { alignItems: u ? "center" : "start", container: !0, children: [
+          /* @__PURE__ */ t(m, { item: !0, xs: 7, children: /* @__PURE__ */ r(i, { alignItems: "start", children: [
+            /* @__PURE__ */ t(
+              b,
+              {
+                endIcon: /* @__PURE__ */ t(T, {}),
+                onClick: () => l(!0),
+                startIcon: /* @__PURE__ */ t(k, { categoryGuid: e.top_level_category_guid }),
+                sx: { px: o.Spacing.Small, py: o.Spacing.XSmall },
+                children: e.category
+              }
+            ),
+            /* @__PURE__ */ t(g, { children: !e.category_guid && /* @__PURE__ */ r(
+              i,
+              {
+                color: "error.main",
+                direction: "row",
+                gap: o.Spacing.XSmall,
+                p: o.Spacing.Small,
+                children: [
+                  /* @__PURE__ */ t(d, { sx: { fontSize: o.FontSize.Body } }),
+                  /* @__PURE__ */ t(s, { variant: "Small", children: n.split_transaction_errors_select_category })
+                ]
+              }
+            ) })
+          ] }) }),
+          /* @__PURE__ */ t(m, { item: !0, xs: 5, children: u ? /* @__PURE__ */ t("div", { className: "mx-txn-split-manager-row-top-container", children: /* @__PURE__ */ t(s, { children: z(e.amount, "0,0.00") }) }) : /* @__PURE__ */ r(i, { alignItems: "start", children: [
+            /* @__PURE__ */ r(i, { alignItems: "start", direction: "row", gap: o.Spacing.XSmall, children: [
+              /* @__PURE__ */ t(
+                A,
+                {
+                  amount: p,
+                  "aria-label": n.split_transaction_edit_split_amount,
+                  inputProps: {
+                    noValidate: !0
+                  },
+                  name: "split-amount-input",
+                  setAmount: x,
+                  sx: {
+                    ".MuiOutlinedInput-input": { p: o.Spacing.Small }
+                  },
+                  type: "number"
+                }
+              ),
+              /* @__PURE__ */ t(
+                N,
+                {
+                  "aria-label": n.split_transaction_delete_split_btn,
+                  color: "secondary",
+                  onClick: () => {
+                    y(R.ON_TRANSACTION_SPLIT_DELETE_CLICK), _(c);
+                  },
+                  sx: { w: 44, h: 44 },
+                  children: /* @__PURE__ */ t(E, {})
+                }
+              )
+            ] }),
+            !p && /* @__PURE__ */ r(
+              i,
+              {
+                color: "error.main",
+                direction: "row",
+                gap: o.Spacing.XSmall,
+                py: o.Spacing.Small,
+                children: [
+                  /* @__PURE__ */ t(d, { sx: { fontSize: o.FontSize.Body } }),
+                  /* @__PURE__ */ t(s, { variant: "Small", children: n.split_transaction_errors_enter_an_amount })
+                ]
+              }
+            )
+          ] }) })
+        ] }),
+        /* @__PURE__ */ t(
+          v,
+          {
+            initialSelected: e.category_guid,
+            onClose: () => l(!1),
+            onSelect: (a) => {
+              f(c, a), l(!1);
+            },
+            showDrawer: I,
+            title: n.actions_select_a_category
+          }
+        )
+      ]
+    }
+  );
+}, tt = w(D);
+export {
+  tt as default
+};

package/dist/transactions/components/tagmanager/Header/index.es.js

@@ -0,0 +1,78 @@
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import a from "react";
+import { observer as T } from "mobx-react-lite";
+import h from "@mui/material/Box";
+import N from "@mui/material/Button";
+import C from "@mui/material/Stack";
+import S from "@mui/material/styles/useTheme";
+import { Text as b, TextField as x, P as E } from "@mxenabled/mxui";
+import { ON_CLICK_EVENTS as i } from "../../../constants/OnClickEvents/index.es.js";
+import { useEvent as y, useTransactionStore as D, useGlobalCopyStore as I } from "../../../../common/context/hooks/index.es.js";
+import O from "../../../../common/components/dialog/Dialog/index.es.js";
+const G = () => {
+  const l = S(), { onEvent: d } = y(), { addTag: m } = D(), { transactions: e } = I(), [t, r] = a.useState(!1), [o, c] = a.useState(""), [_, g] = a.useState(""), f = a.useRef(null);
+  a.useEffect(() => {
+    t && f?.current?.focus();
+  }, [t]);
+  const p = () => {
+    d(
+      t ? i.ON_TRANSACTION_TAGS_TAG_ADD_CANCEL_CLICK : i.ON_TRANSACTION_TAGS_TAG_ADD_CLICK
+    ), t || c(""), r(!t);
+  }, u = async () => {
+    d(i.ON_TRANSACTION_TAGS_TAG_ADDED), await m(o), r(!1);
+  };
+  return a.useEffect(() => {
+    g(o.length > 40 ? e.tags_error_name_must_be_40_chars : "");
+  }, [o]), /* @__PURE__ */ s(h, { className: "mx-txn-tag-manager-header", children: [
+    /* @__PURE__ */ s(
+      C,
+      {
+        alignItems: "center",
+        bgcolor: l.palette.background.default,
+        direction: "row",
+        justifyContent: "space-between",
+        px: 24,
+        py: 16,
+        children: [
+          /* @__PURE__ */ n(b, { bold: !0, children: e.tags_your_tags }),
+          /* @__PURE__ */ n(
+            N,
+            {
+              "aria-expanded": t,
+              "aria-label": e.tags_add_tag_btn_aria,
+              onClick: p,
+              children: e.tags_add_tag_btn
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ s(
+      O,
+      {
+        copy: { title: e.tags_add_tag_btn },
+        isOpen: t,
+        onClose: () => r(!1),
+        onPrimaryAction: u,
+        onSecondaryAction: () => r(!1),
+        children: [
+          /* @__PURE__ */ n(
+            x,
+            {
+              "aria-label": e.tags_placeholder,
+              name: "add-tag",
+              onChange: (A) => c(A.target.value),
+              placeholder: e.tags_placeholder,
+              sx: { width: "100%" },
+              value: o
+            }
+          ),
+          /* @__PURE__ */ n(E, { id: "add-tag-error", sx: { color: "error.main" }, variant: "ParagraphSmall", children: _ })
+        ]
+      }
+    )
+  ] });
+}, V = T(G);
+export {
+  V as default
+};

package/dist/transactions/components/tagmanager/SearchBox/index.es.js

@@ -0,0 +1,37 @@
+import { jsx as o } from "react/jsx-runtime";
+import { observer as s } from "mobx-react-lite";
+import p from "@mui/icons-material/HighlightOff";
+import l from "@mui/icons-material/Search";
+import d from "@mui/material/Box";
+import h from "@mui/material/IconButton";
+import a from "@mui/material/InputAdornment";
+import { useTokens as f, TextField as g } from "@mxenabled/mxui";
+import { useGlobalCopyStore as u } from "../../../../common/context/hooks/index.es.js";
+const x = ({ onSearchValueChanged: r, searchValue: e }) => {
+  const { common: n, transactions: c } = u(), t = f(), i = /* @__PURE__ */ o(
+    h,
+    {
+      "aria-label": c.tags_cancel_search || "Search",
+      onClick: () => r(""),
+      children: /* @__PURE__ */ o(p, {})
+    }
+  );
+  return /* @__PURE__ */ o(d, { className: "mx-txn-tag-manager-search", px: t.Spacing.Large, py: t.Spacing.Medium, children: /* @__PURE__ */ o(
+    g,
+    {
+      InputProps: {
+        startAdornment: /* @__PURE__ */ o(a, { position: "start", children: /* @__PURE__ */ o(l, { color: "disabled" }) }),
+        endAdornment: /* @__PURE__ */ o(a, { position: "end", sx: { padding: 0 }, children: e ? i : null })
+      },
+      "aria-label": n.search_aria,
+      name: "search",
+      onChange: (m) => r(m.target.value),
+      placeholder: n.search_placeholder,
+      sx: { bgcolor: "background.paper", width: "100%" },
+      value: e
+    }
+  ) });
+}, C = s(x);
+export {
+  C as default
+};

package/dist/transactions/components/tagmanager/TagManager/index.es.js

@@ -0,0 +1,32 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import t from "react";
+import { observer as d } from "mobx-react-lite";
+import f from "@mui/material/Divider";
+import l from "@mui/material/List";
+import p from "@mui/material/Paper";
+import g from "../Header/index.es.js";
+import h from "../SearchBox/index.es.js";
+import u from "../TagRow/index.es.js";
+import { useTransactionStore as x } from "../../../../common/context/hooks/index.es.js";
+const S = ({ selectedTags: m, onTagChecked: s }) => {
+  const { tags: i } = x(), [o, n] = t.useState(""), c = i.filter(
+    (r) => r.name.toLowerCase().includes(o.toLowerCase())
+  );
+  return /* @__PURE__ */ a("div", { className: "mx-txn-tag-manager", children: [
+    /* @__PURE__ */ e(
+      h,
+      {
+        onSearchValueChanged: (r) => n(r),
+        searchValue: o
+      }
+    ),
+    /* @__PURE__ */ e(g, {}),
+    /* @__PURE__ */ e(p, { sx: { boxShadow: "none" }, children: /* @__PURE__ */ e(l, { children: c.map((r) => /* @__PURE__ */ a(t.Fragment, { children: [
+      /* @__PURE__ */ e(u, { onTagChecked: s, selectedTags: m, tag: r }),
+      /* @__PURE__ */ e(f, { sx: { ml: 24 } })
+    ] }, r.guid)) }) })
+  ] });
+}, B = d(S);
+export {
+  B as default
+};

package/dist/transactions/components/tagmanager/TagRow/index.es.js

@@ -0,0 +1,114 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import a from "react";
+import { observer as x } from "mobx-react-lite";
+import b from "@mui/icons-material/DeleteOutlined";
+import D from "@mui/icons-material/Edit";
+import G from "@mui/material/Checkbox";
+import p from "@mui/material/IconButton";
+import L from "@mui/material/ListItem";
+import k from "@mui/material/ListItemButton";
+import v from "@mui/material/ListItemIcon";
+import w from "@mui/material/ListItemText";
+import R from "@mui/material/Stack";
+import { TextField as P, P as K, Text as B } from "@mxenabled/mxui";
+import { ON_CLICK_EVENTS as r } from "../../../constants/OnClickEvents/index.es.js";
+import { useEvent as $, useTransactionStore as j, useGlobalCopyStore as V } from "../../../../common/context/hooks/index.es.js";
+import u from "../../../../common/components/dialog/Dialog/index.es.js";
+const F = ({ onTagChecked: f, selectedTags: m, tag: e }) => {
+  const { onEvent: o } = $(), { removeTag: h, updateTag: A } = j(), { common: d, transactions: n } = V(), [g, i] = a.useState(!1), [C, s] = a.useState(!1), [c, _] = a.useState(""), [T, E] = a.useState(""), N = async () => {
+    o(r.ON_TRANSACTION_TAGS_TAG_EDIT_SAVED), e && await A({ ...e, name: c }), i(!1);
+  }, S = async () => {
+    o(r.ON_TRANSACTION_TAGS_TAG_DELETED), await h(e.guid), s(!1);
+  };
+  a.useEffect(() => {
+    E(c.length > 40 ? n.tags_error_name_must_be_40_chars : "");
+  }, [c]);
+  const I = () => {
+    o(r.ON_TRANSACTION_TAGS_TAG_EDIT_CLICK), _(e.name), i(!0);
+  }, y = () => {
+    o(r.ON_TRANSACTION_TAGS_TAG_DELETE_CLICK), s(!0);
+  };
+  return /* @__PURE__ */ l(
+    L,
+    {
+      className: "mx-txn-transaction-manager-row",
+      disableGutters: !0,
+      disablePadding: !0,
+      secondaryAction: !e.is_default_tag && /* @__PURE__ */ l(R, { direction: "row", children: [
+        /* @__PURE__ */ t(
+          p,
+          {
+            "aria-label": `Edit ${e.name} tag`,
+            color: "secondary",
+            onClick: I,
+            children: /* @__PURE__ */ t(D, { color: "secondary" })
+          }
+        ),
+        /* @__PURE__ */ t(
+          p,
+          {
+            "aria-label": `Delete ${e.name} tag`,
+            color: "secondary",
+            onClick: y,
+            children: /* @__PURE__ */ t(b, { color: "secondary" })
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ l(
+          k,
+          {
+            "aria-checked": m.includes(e.guid),
+            onClick: () => f(e.guid),
+            role: "checkbox",
+            children: [
+              /* @__PURE__ */ t(v, { sx: { ml: 0 }, children: /* @__PURE__ */ t(G, { checked: m.includes(e.guid), edge: "start", tabIndex: -1 }) }),
+              /* @__PURE__ */ t(w, { children: e.name })
+            ]
+          }
+        ),
+        /* @__PURE__ */ l(
+          u,
+          {
+            copy: { title: "Update tag name" },
+            isOpen: g,
+            onClose: () => i(!1),
+            onPrimaryAction: N,
+            onSecondaryAction: () => i(!1),
+            children: [
+              /* @__PURE__ */ t(
+                P,
+                {
+                  "aria-describedby": T ? "update-tag-error" : void 0,
+                  "aria-label": n.tags_update_the_tag_name,
+                  name: "update-tag",
+                  onChange: (O) => _(O.target.value),
+                  placeholder: "Tag name",
+                  sx: { width: "100%" },
+                  value: c
+                }
+              ),
+              /* @__PURE__ */ t(K, { id: "update-tag-error", sx: { color: "error.main" }, variant: "ParagraphSmall", children: T })
+            ]
+          }
+        ),
+        /* @__PURE__ */ t(
+          u,
+          {
+            copy: { title: n.tags_delete_title },
+            isOpen: C,
+            onClose: () => s(!1),
+            onPrimaryAction: S,
+            onSecondaryAction: () => o(r.ON_TRANSACTION_TAGS_TAG_DELETE_CANCEL_CLICK),
+            primaryText: d.delete_button,
+            secondaryText: d.cancel_button,
+            children: /* @__PURE__ */ t(B, { truncate: !1, children: n.tags_deleting_this_tag_will_remove_it })
+          }
+        )
+      ]
+    }
+  );
+}, ne = x(F);
+export {
+  ne as default
+};

package/dist/transactions/components/transactionwidget/AddAccountModal/index.es.js

@@ -0,0 +1,29 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import { observer as s } from "mobx-react-lite";
+import { Text as a } from "@mxenabled/mxui";
+import { useGlobalCopyStore as p, useGlobalUiStore as i } from "../../../../common/context/hooks/index.es.js";
+import u from "../../../../common/components/dialog/Dialog/index.es.js";
+import f from "../../../../common/components/Loader/index.es.js";
+const _ = ({ copy: r, isOpen: c, onClose: e, onPrimaryAction: n }) => {
+  const { common: m, transactions: o } = p(), { isCopyLoaded: d } = i();
+  return d ? /* @__PURE__ */ l(
+    u,
+    {
+      copy: {
+        title: r.title
+      },
+      isOpen: c,
+      onClose: e,
+      onPrimaryAction: n,
+      primaryText: o.add_manual_account,
+      secondaryText: m.cancel_button,
+      children: [
+        /* @__PURE__ */ t(a, { component: "p", sx: { marginBottom: "20px" }, truncate: !1, children: o.add_account_modal_message }),
+        /* @__PURE__ */ t(a, { component: "p", truncate: !1, children: o.add_account_modal_cta })
+      ]
+    }
+  ) : /* @__PURE__ */ t(f, {});
+}, h = s(_);
+export {
+  h as default
+};

package/dist/transactions/components/transactionwidget/actions/EditCategoryAction/index.es.js

@@ -0,0 +1,54 @@
+import { jsxs as _, jsx as i } from "react/jsx-runtime";
+import s from "react";
+import { observer as g } from "mobx-react-lite";
+import u from "@mui/material/Box";
+import { P as f } from "@mxenabled/mxui";
+import C from "../../../../../categories/components/CategorySelectorDrawer/index.es.js";
+import { useTransactionStore as h, useGlobalCopyStore as x, useCategoryStore as S } from "../../../../../common/context/hooks/index.es.js";
+import w from "../../../../../common/components/dialog/Dialog/index.es.js";
+import { buildDynamicCopy as l } from "../../../../../common/utils/Localization/index.es.js";
+const T = ({ onClose: c, transaction: t }) => {
+  const { addOrUpdateTransactionRule: p, updateTransaction: d } = h(), { transactions: o } = x(), { categories: m } = S(), [e, n] = s.useState(""), y = s.useMemo(
+    () => m.find((a) => a.guid === e),
+    [e]
+  ), r = async (a) => {
+    await d({ ...t, category_guid: e }), a && await p(e, t), n(""), c();
+  };
+  return /* @__PURE__ */ _(u, { className: "mx-txn-edit-category-action", children: [
+    /* @__PURE__ */ i(
+      C,
+      {
+        initialSelected: t.category_guid,
+        onClose: c,
+        onSelect: (a) => n(a),
+        showDrawer: !!t,
+        title: o.actions_select_a_category
+      }
+    ),
+    /* @__PURE__ */ i(
+      w,
+      {
+        copy: {
+          title: l(
+            o.actions_apply_to_all_transaction_types,
+            t.description
+          )
+        },
+        isOpen: !!e,
+        onClose: () => r(!1),
+        onPrimaryAction: () => r(!0),
+        onSecondaryAction: () => r(!1),
+        primaryText: o.actions_apply_to_all,
+        secondaryText: o.actions_this_time_only,
+        children: /* @__PURE__ */ i(f, { variant: "Paragraph", children: l(
+          o.actions_all_past_and_future,
+          t.description,
+          y?.name
+        ) })
+      }
+    )
+  ] });
+}, R = g(T);
+export {
+  R as default
+};

package/dist/transactions/constants/Actions/index.es.js

@@ -0,0 +1,19 @@
+var r = /* @__PURE__ */ ((a) => (a[a.Category = 0] = "Category", a[a.Date = 1] = "Date", a[a.Memo = 2] = "Memo", a[a.Tags = 3] = "Tags", a))(r || {}), e = /* @__PURE__ */ ((a) => (a[a.SplitTransaction = 0] = "SplitTransaction", a[a.HideTransaction = 1] = "HideTransaction", a[a.MerchantLogo = 2] = "MerchantLogo", a))(e || {});
+const g = [
+  0,
+  1,
+  2,
+  3
+  /* Tags */
+], T = [
+  0,
+  1,
+  2
+  /* MerchantLogo */
+];
+export {
+  e as BottomActions,
+  T as DEFAULT_BOTTOM_ACTIONS,
+  g as DEFAULT_TOP_ACTIONS,
+  r as TopActions
+};