@mx-cartographer/experiences 7.10.21 → 7.10.22

package/dist/TransactionDetails-B9cwOn5s.mjs

@@ -0,0 +1,1193 @@
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import _ from "react";
+import { observer as D } from "mobx-react-lite";
+import L from "@mui/material/Box";
+import Q from "@mui/material/Divider";
+import Z from "@mui/material/List";
+import q from "@mui/material/Paper";
+import I from "@mui/material/Stack";
+import { CategoryIcon as _e, CategoryIconVariants as ge, Text as S, Icon as A, IconWeight as b, P as V, useTokens as ae, MerchantLogo as he, TextField as me } from "@mxenabled/mxui";
+import { C as we, a as Le, i as ke } from "./User-Bs3hX0dH.mjs";
+import ne from "@mui/material/Button";
+import Re from "@mui/material/FormGroup";
+import Y from "@mui/material/IconButton";
+import Te from "@mui/material/TextField";
+import { u as ue } from "./useAriaLive-MkYebyUR.mjs";
+import { O as g } from "./Transaction-RmKYEKSk.mjs";
+import { h as E, m as ye, g as v, u as O, b as Pe, o as Ge } from "./hooks-DWJQ4phS.mjs";
+import { A as k } from "./Analytics-i5h6BxR1.mjs";
+import Me from "@mui/material/ToggleButton";
+import Se from "@mui/material/styles/useTheme";
+import { Delete as ee, ChevronRight as Ke, Cancel as te, Search as Be, Edit as $e, Flag as Fe } from "@mxenabled/mx-icons";
+import { fromUnixTime as de } from "date-fns/fromUnixTime";
+import M from "@mui/material/Avatar";
+import R from "@mui/material/ListItem";
+import K from "@mui/material/ListItemAvatar";
+import P from "@mui/material/ListItemText";
+import { f as Ce, D as fe } from "./DateFormats-Cs-NbEZ7.mjs";
+import B from "@mui/material/ListItemButton";
+import $ from "@mui/material/ListItemIcon";
+import { a as Ae } from "./CategorySelectorDrawer-CPIIt1lu.mjs";
+import { u as H } from "./TransactionList-5JxQV7f6.mjs";
+import { D as F } from "./Dialog-BqUCsQvo.mjs";
+import { b as X } from "./Localization-2MODESHW.mjs";
+import { getUnixTime as He } from "date-fns/getUnixTime";
+import { D as re } from "./Drawer-DV4NTsFg.mjs";
+import { f as oe } from "./NumberFormatting-DjTD0t3W.mjs";
+import pe from "@mui/material/InputAdornment";
+import Ue from "@mui/material/Checkbox";
+import ce from "@mui/material/Grid";
+import { C as Xe } from "./CurrencyInput-niY2izw5.mjs";
+import ze from "@mui/material/Switch";
+import { L as Ve } from "./Loader-DUaFpDGv.mjs";
+var W = /* @__PURE__ */ ((t) => (t[t.Category = 0] = "Category", t[t.Date = 1] = "Date", t[t.Memo = 2] = "Memo", t[t.Tags = 3] = "Tags", t))(W || {}), J = /* @__PURE__ */ ((t) => (t[t.SplitTransaction = 0] = "SplitTransaction", t[t.HideTransaction = 1] = "HideTransaction", t[t.MerchantLogo = 2] = "MerchantLogo", t))(J || {});
+const We = [
+  0,
+  1,
+  2,
+  3
+  /* Tags */
+], Ye = [
+  0,
+  1,
+  2
+  /* MerchantLogo */
+], je = ({ transaction: t }) => {
+  const { addOrUpdateTransactionRule: o, updateTransaction: l } = E(), { categories: a } = ye(), { onEvent: r } = v(), { setShouldDisableDrawerScroll: n, updateManualTransaction: s } = H(), { transactions: i } = O(), [d, m] = _.useState(!1), [u, p] = _.useState(""), T = async (h) => {
+    await l({ ...t, category_guid: u }), h && await o(u, t), p(""), r(k.TRANSACTION_DETAILS_CLICK_CATEGORY, {
+      transaction_guid: t.guid
+    });
+  }, y = (h) => {
+    if (t.is_manual && !t.guid) {
+      const N = a.find((U) => U.guid === h);
+      s({
+        ...t,
+        category: N?.name,
+        category_guid: h,
+        top_level_category_guid: N?.parent_guid || h
+      });
+    } else
+      p(h);
+    C();
+  }, C = () => {
+    m(!1), n(!1);
+  }, w = _.useMemo(
+    () => a.find((h) => h.guid === u),
+    [u]
+  );
+  return /* @__PURE__ */ c(_.Fragment, { children: [
+    /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          r(g.ON_TRANSACTION_CATEGORY_CLICK), m(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(
+            _e,
+            {
+              categoryGuid: t.top_level_category_guid,
+              size: 24,
+              sx: { color: "text.primary" },
+              variant: ge.Transparent
+            }
+          ) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: i.category_title,
+              primaryTypographyProps: { variant: "XSmall" },
+              secondary: /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: t.category ?? i.actions_select_a_category })
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      Ae,
+      {
+        initialSelected: t.category_guid,
+        onClose: C,
+        onSelect: y,
+        showDrawer: d,
+        title: i.actions_select_a_category
+      }
+    ),
+    /* @__PURE__ */ e(
+      F,
+      {
+        copy: {
+          title: X(
+            i.actions_apply_to_all_transaction_types,
+            t.description
+          )
+        },
+        isOpen: !!u,
+        onClose: () => p(""),
+        onPrimaryAction: () => T(!0),
+        onSecondaryAction: () => T(!1),
+        primaryText: i.actions_apply_to_all,
+        secondaryText: i.actions_this_time_only,
+        children: /* @__PURE__ */ e(V, { variant: "Paragraph", children: X(
+          i.actions_all_past_and_future,
+          t.description,
+          w?.name
+        ) })
+      }
+    )
+  ] });
+}, qe = ({ transaction: t }) => {
+  const o = ae(), { onEvent: l } = v(), { updateTransaction: a } = E(), { updateManualTransaction: r } = H(), { common: n, transactions: s } = O(), [i, d] = _.useState(!1), [m, u] = _.useState(t.date), p = (y) => {
+    u(He(y));
+  }, T = async () => {
+    if (t.is_manual && !t.guid) {
+      r({ ...t, date: m }), d(!1);
+      return;
+    }
+    await a({ ...t, date: m }), l(k.TRANSACTION_DETAILS_CLICK_DATE, { transaction_guid: t.guid }), d(!1);
+  };
+  return /* @__PURE__ */ c(L, { className: "mx-txn-date-action", children: [
+    /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          l(g.ON_TRANSACTION_DATE_CLICK), d(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(A, { name: "calendar_month", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: s.date_title,
+              primaryTypographyProps: { variant: "XSmall" },
+              secondary: /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: Ce(de(t.date), fe.YEAR_MONTH_DAY) })
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      re,
+      {
+        ariaLabelClose: n.close_aria,
+        isOpen: i,
+        onClose: () => d(!1),
+        onPrimaryAction: T,
+        primaryText: n.save_button,
+        secondaryText: n.cancel_button,
+        title: s.date_edit_title,
+        children: /* @__PURE__ */ e(I, { alignItems: "center", mt: o.Spacing.XXLarge, children: /* @__PURE__ */ e(
+          we,
+          {
+            beginDate: de(m),
+            copy: {
+              nextAria: s.date_next_aria,
+              prevAria: s.date_prev_aria,
+              today: n.date_range_picker.today
+            },
+            onDateSelected: p,
+            selectionType: Le.Single
+          }
+        ) })
+      }
+    )
+  ] });
+}, Je = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { removeTransaction: l } = E(), { setShouldDisableDrawerScroll: a } = H(), { common: r, transactions: n } = O(), [s, i] = _.useState(!1), d = async () => {
+    await l(t.guid), o(g.ON_TRANSACTION_DELETE_DELETED);
+  };
+  return /* @__PURE__ */ c(L, { className: "mx-txn-delete", children: [
+    t && /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          o(g.ON_TRANSACTION_DELETE_CLICK), a(!0), i(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { variant: "rounded", children: /* @__PURE__ */ e(ee, { color: "secondary", fontSize: "small" }) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: n.manual_transaction_delete_title,
+              secondary: n.manual_transaction_delete_subtitle
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(ee, {}) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      F,
+      {
+        copy: { title: n.manual_transaction_delete_title },
+        isOpen: s,
+        onClose: () => {
+          a(!1), i(!1);
+        },
+        onPrimaryAction: d,
+        onSecondaryAction: () => o(g.ON_TRANSACTION_DELETE_CANCEL),
+        primaryText: r.delete_button,
+        secondaryText: r.cancel_button,
+        children: /* @__PURE__ */ e(S, { sx: { whiteSpace: "normal" }, variant: "Paragraph", children: n.manual_transaction_delete_description })
+      }
+    )
+  ] });
+}, Qe = D(Je), Ze = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { updateTransaction: l } = E(), { setShouldDisableDrawerScroll: a } = H(), { common: r, transactions: n } = O(), [s, i] = _.useState(!1), d = async () => {
+    await l({ ...t, merchant_guid: "" }), o(k.TRANSACTION_DETAILS_CLICK_DELETE_LOGO, {
+      transaction_guid: t.guid
+    });
+  };
+  return /* @__PURE__ */ c(L, { className: "mx-txn-delete-logo", children: [
+    t && /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          o(g.ON_TRANSACTION_DELETE_LOGO_CLICK), i(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(A, { name: "delete", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+          /* @__PURE__ */ e(P, { primary: n.merchant_logo_title, secondary: n.merchant_logo_desc }),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ c(
+      F,
+      {
+        copy: { title: n.merchant_logo_modal_title },
+        isOpen: s,
+        onClose: () => {
+          a(!1), i(!1);
+        },
+        onPrimaryAction: d,
+        onSecondaryAction: () => o(g.ON_TRANSACTION_DELETE_LOGO_CANCEL),
+        primaryText: r.delete_button,
+        secondaryText: r.cancel_button,
+        title: n.merchant_logo_modal_title,
+        children: [
+          /* @__PURE__ */ e(S, { sx: { whiteSpace: "normal" }, variant: "Paragraph", children: n.merchant_logo_modal_desc }),
+          /* @__PURE__ */ e(S, { bold: !0, sx: { whiteSpace: "normal" }, variant: "Paragraph", children: ` ${n.merchant_logo_modal_desc_bold}` })
+        ]
+      }
+    )
+  ] });
+}, et = D(Ze), tt = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { updateTransaction: l } = E(), { setShouldDisableDrawerScroll: a } = H(), { common: r, transactions: n } = O(), [s, i] = _.useState(!1), d = t.is_hidden, m = async () => {
+    await l({ ...t, is_hidden: !t.is_hidden }), o(
+      d ? g.ON_TRANSACTION_UNHIDDEN : g.ON_TRANSACTION_HIDDEN
+    );
+  };
+  return /* @__PURE__ */ c(L, { className: "mx-txn-hide-transaction", children: [
+    t && /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        "aria-checked": d,
+        onClick: () => {
+          o(
+            d ? g.ON_TRANSACTION_UNHIDE_CLICK : g.ON_TRANSACTION_HIDE_CLICK
+          ), o(
+            d ? "transaction_details_click_unhide_transaction" : "transaction_details_click_hide_transaction",
+            {
+              transaction_guid: t.guid
+            }
+          ), i(!0);
+        },
+        role: "switch",
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: d ? /* @__PURE__ */ e(
+            A,
+            {
+              name: "visibilityOff",
+              sx: { color: "text.primary" },
+              weight: b.Dark
+            }
+          ) : /* @__PURE__ */ e(A, { name: "visibility", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: d ? n.hide_trnx_subtitle_unhide_trnx : n.hide_trnx_subtitle_hide_trnx,
+              secondary: d ? n.hide_trnx_desc_unhiding : n.hide_trnx_desc_hiding
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(
+            ze,
+            {
+              checked: d,
+              id: "hide-transaction",
+              name: "hide-transaction",
+              tabIndex: -1
+            }
+          ) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      F,
+      {
+        copy: {
+          title: d ? n.hide_trnx_subtitle_unhide_trnx : n.hide_trnx_subtitle_hide_trnx
+        },
+        isOpen: s,
+        onClose: () => {
+          a(!1), i(!1);
+        },
+        onPrimaryAction: m,
+        onSecondaryAction: () => o(
+          d ? g.ON_TRANSACTION_UNHIDE_CANCEL_CLICK : g.ON_TRANSACTION_HIDE_CANCEL_CLICK
+        ),
+        primaryText: d ? r.unhide_button : r.hide_button,
+        secondaryText: r.cancel_button,
+        children: /* @__PURE__ */ e(S, { truncate: !1, variant: "Paragraph", children: d ? n.hide_trnx_desc_unhiding : n.hide_trnx_desc_hiding })
+      }
+    )
+  ] });
+}, at = D(tt), be = ({ transaction: t }) => {
+  const { amount: o, description: l, isIncome: a, merchant_guid: r, payee: n, top_level_category_guid: s } = t;
+  return /* @__PURE__ */ c(I, { className: "mx-txn-amount-header", direction: "row", gap: 12, px: 16, py: 24, children: [
+    /* @__PURE__ */ e(
+      he,
+      {
+        categoryGuid: s || "",
+        merchantGuid: r || "",
+        size: 64
+      }
+    ),
+    /* @__PURE__ */ c(I, { overflow: "hidden'", children: [
+      /* @__PURE__ */ e(S, { bold: !0, mb: 4, truncate: !0, variant: "Body", children: l || n }),
+      /* @__PURE__ */ c(V, { color: a ? "success.main" : "text.primary", truncate: !0, variant: "H1", children: [
+        a ? "+" : "",
+        oe(o, "0,0.00")
+      ] })
+    ] })
+  ] });
+}, nt = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { updateTransaction: l } = E(), { updateManualTransaction: a } = H(), { common: r, transactions: n } = O(), [s, i] = _.useState(!1), [d, m] = _.useState("");
+  _.useEffect(() => {
+    s && m(t.memo ? t.memo : "");
+  }, [s]);
+  const u = async () => {
+    if (t.is_manual && !t.guid) {
+      a({ ...t, memo: d }), i(!1);
+      return;
+    }
+    await l({ ...t, memo: d }), o(k.TRANSACTION_DETAILS_CLICK_MEMO, { transaction_guid: t.guid }), i(!1);
+  };
+  return /* @__PURE__ */ c("div", { className: "mx-txn-memo-action", children: [
+    /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          o(g.ON_TRANSACTION_MEMO_CLICK), i(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(A, { name: "article", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: n.memo_title,
+              primaryTypographyProps: { variant: "XSmall" },
+              secondary: /* @__PURE__ */ e(
+                S,
+                {
+                  bold: !0,
+                  sx: { overflowWrap: "break-word", whiteSpace: "wrap" },
+                  variant: "Body",
+                  children: t.memo ? t.memo : n.memo_desc
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ c(
+      re,
+      {
+        ariaLabelClose: r.close_aria,
+        isOpen: s,
+        onClose: () => i(!1),
+        onPrimaryAction: u,
+        title: n.memo_title,
+        children: [
+          /* @__PURE__ */ e(be, { transaction: t }),
+          /* @__PURE__ */ e(
+            Te,
+            {
+              "aria-label": n.memo_desc_aria,
+              focused: !0,
+              multiline: !0,
+              name: "memo",
+              onChange: (p) => m(p.target.value),
+              placeholder: n.memo_desc,
+              rows: 4,
+              sx: { mx: 16, width: "calc(100% - 32px)" },
+              value: d
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}, rt = D(nt), ot = ({
+  index: t,
+  onDeleteRow: o,
+  onCategoryChanged: l,
+  onUpdateAmount: a,
+  split: r
+}) => {
+  const n = ae(), { onEvent: s } = v(), { transactions: i } = O(), [d, m] = _.useState(`${r.amount}`), [u, p] = _.useState(!1), T = t === 0, y = (C) => {
+    isNaN(Number(C)) || (m(C), a(t, Number(C)));
+  };
+  return /* @__PURE__ */ c(
+    L,
+    {
+      bgcolor: "background.paper",
+      className: "mx-txn-split-manager-row",
+      pb: n.Spacing.Tiny,
+      px: n.Spacing.XSmall,
+      children: [
+        /* @__PURE__ */ c(ce, { alignItems: T ? "center" : "start", container: !0, children: [
+          /* @__PURE__ */ e(ce, { item: !0, xs: 7, children: /* @__PURE__ */ c(I, { alignItems: "start", children: [
+            /* @__PURE__ */ e(
+              ne,
+              {
+                endIcon: /* @__PURE__ */ e(Ke, {}),
+                onClick: () => p(!0),
+                startIcon: /* @__PURE__ */ e(_e, { categoryGuid: r.top_level_category_guid }),
+                sx: { px: n.Spacing.Small, py: n.Spacing.XSmall },
+                children: r.category
+              }
+            ),
+            /* @__PURE__ */ e(L, { children: !r.category_guid && /* @__PURE__ */ c(
+              I,
+              {
+                color: "error.main",
+                direction: "row",
+                gap: n.Spacing.XSmall,
+                p: n.Spacing.Small,
+                children: [
+                  /* @__PURE__ */ e("span", { "aria-label": "error", role: "img", children: /* @__PURE__ */ e(te, { sx: { fontSize: n.FontSize.Body } }) }),
+                  /* @__PURE__ */ e(S, { variant: "Small", children: i.split_transaction_errors_select_category })
+                ]
+              }
+            ) })
+          ] }) }),
+          /* @__PURE__ */ e(ce, { item: !0, xs: 5, children: T ? /* @__PURE__ */ e("div", { className: "mx-txn-split-manager-row-top-container", children: /* @__PURE__ */ e(S, { children: oe(r.amount, "0,0.00") }) }) : /* @__PURE__ */ c(I, { alignItems: "start", children: [
+            /* @__PURE__ */ c(I, { alignItems: "start", direction: "row", gap: n.Spacing.XSmall, children: [
+              /* @__PURE__ */ e(
+                Xe,
+                {
+                  amount: d,
+                  ariaLabel: i.split_transaction_edit_split_amount,
+                  minAmount: 0.01,
+                  name: "split-amount-input",
+                  setAmount: y,
+                  sx: {
+                    ".MuiOutlinedInput-input": { p: n.Spacing.Small }
+                  },
+                  type: "number"
+                }
+              ),
+              /* @__PURE__ */ e(
+                Y,
+                {
+                  "aria-label": i.split_transaction_delete_split_btn,
+                  color: "secondary",
+                  onClick: () => {
+                    s(g.ON_TRANSACTION_SPLIT_DELETE_CLICK), o(t);
+                  },
+                  sx: { w: 44, h: 44 },
+                  children: /* @__PURE__ */ e(ee, {})
+                }
+              )
+            ] }),
+            !d && /* @__PURE__ */ c(
+              I,
+              {
+                color: "error.main",
+                direction: "row",
+                gap: n.Spacing.XSmall,
+                py: n.Spacing.Small,
+                children: [
+                  /* @__PURE__ */ e("span", { "aria-label": "error", role: "img", children: /* @__PURE__ */ e(te, { sx: { fontSize: n.FontSize.Body } }) }),
+                  /* @__PURE__ */ e(S, { variant: "Small", children: i.split_transaction_errors_enter_an_amount })
+                ]
+              }
+            )
+          ] }) })
+        ] }),
+        /* @__PURE__ */ e(
+          Ae,
+          {
+            initialSelected: r.category_guid,
+            onClose: () => p(!1),
+            onSelect: (C) => {
+              l(t, C), p(!1);
+            },
+            showDrawer: u,
+            title: i.actions_select_a_category
+          }
+        )
+      ]
+    }
+  );
+}, it = D(ot), lt = ({
+  onAddSplit: t,
+  onCategoryChanged: o,
+  onDeleteSplit: l,
+  onUpdateAmount: a,
+  splits: r,
+  transaction: n
+}) => {
+  const s = ae(), { transactions: i } = O(), { onEvent: d } = v(), [m, u] = _.useState(""), { announce: p, ariaLive: T } = ue();
+  return _.useEffect(() => {
+    if (r.length <= 1)
+      u(i.split_transaction_errors_min_splits), p(i.split_transaction_errors_min_splits);
+    else if (r[0].amount < 0) {
+      const y = X(
+        i.split_transaction_errors_totals_must_equal_amount,
+        oe(n.amount, "0,0.00")
+      );
+      u(y), p(y);
+    } else
+      u(""), p("");
+  }, [r]), /* @__PURE__ */ c(L, { className: "mx-txn-split-manager", children: [
+    T,
+    r.map((y, C) => /* @__PURE__ */ e(
+      it,
+      {
+        index: C,
+        onCategoryChanged: o,
+        onDeleteRow: l,
+        onUpdateAmount: a,
+        split: y
+      },
+      C
+    )),
+    m && /* @__PURE__ */ c(
+      I,
+      {
+        color: "error.main",
+        direction: "row",
+        gap: s.Spacing.XSmall,
+        p: s.Spacing.Medium,
+        children: [
+          /* @__PURE__ */ e("span", { "aria-label": "error", role: "img", children: /* @__PURE__ */ e(te, { sx: { fontSize: s.FontSize.Body } }) }),
+          /* @__PURE__ */ e(S, { variant: "Small", children: m })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(L, { p: s.Spacing.Medium, children: /* @__PURE__ */ e(
+      ne,
+      {
+        "aria-label": i.split_transaction_add_split_btn,
+        onClick: () => {
+          d(g.ON_TRANSACTION_SPLIT_ADD_CLICK), t();
+        },
+        children: i.split_transaction_add_split_btn
+      }
+    ) })
+  ] });
+}, st = D(lt), ct = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { announce: l, ariaLive: a } = ue(), { splitTransaction: r, unSplitTransaction: n } = E(), { common: s, transactions: i } = O(), { setShouldDisableDrawerScroll: d } = H(), { categories: m } = ye(), u = {
+    ...t,
+    amount: t.amount - 1,
+    guid: "",
+    has_been_split: !1,
+    parent_guid: t.guid
+  }, p = {
+    ...t,
+    amount: 1,
+    category_guid: void 0,
+    category: i.split_transaction_select_category_btn,
+    guid: "",
+    has_been_split: !1,
+    parent_guid: t.guid,
+    top_level_category_guid: void 0
+  }, [T, y] = _.useState(!1), [C, w] = _.useState(!1), [h, N] = _.useState([]), U = () => {
+    const f = [...h];
+    f.push({ ...p }), f[0].amount -= 1, N(f), l(
+      X(
+        i.split_transaction_add_split_announcement,
+        f.length
+      )
+    );
+  }, ie = (f) => {
+    if (f > 0) {
+      const G = h[f], x = [...h];
+      x.splice(f, 1), x[0].amount += G.amount, N(x), l(
+        X(i.split_transaction_delete_split_announcement, f + 1)
+      );
+    }
+  }, le = (f, G) => {
+    const x = [...h];
+    x[f].amount = G, x[0].amount = t.amount - x.reduce(
+      (z, se, Ee) => z + (Ee !== 0 ? se.amount : 0),
+      0
+    ), N(x);
+  }, Ne = (f, G) => {
+    const x = [...h], z = m.find((se) => se.guid === G);
+    z && (x[f] = {
+      ...x[f],
+      category_guid: G,
+      category: z.name,
+      top_level_category_guid: z.parent_guid || G
+    }, N(x), l(
+      X(
+        i.split_transaction_select_category_announcement,
+        z.name,
+        f + 1
+      )
+    ));
+  }, xe = () => {
+    if (t.parent_guid || t.has_been_split) {
+      w(!0);
+      return;
+    }
+    N([{ ...u }, { ...p }]), o(k.TRANSACTION_DETAILS_CLICK_SPLIT, {
+      transaction_guid: t.guid
+    }), y(!0);
+  }, Ie = async () => {
+    o(g.ON_TRANSACTION_SPLIT_SAVE_CLICK), await r({ ...t, has_been_split: !0 }, h), y(!1);
+  }, De = async () => {
+    o(g.ON_TRANSACTION_SPLIT_CANCEL_CLICK), N([{ ...u }, { ...p }]), y(!1);
+  }, Oe = async () => {
+    o(k.TRANSACTION_DETAILS_CLICK_UNSPLIT, {
+      transaction_guid: t.guid
+    });
+    const f = t.parent_guid ?? t.guid;
+    await n(f);
+  }, ve = _.useMemo(() => {
+    const f = h.some((x) => !x.category_guid), G = h.some((x) => x.amount <= 0);
+    return f || G;
+  }, [h]);
+  return /* @__PURE__ */ c(_.Fragment, { children: [
+    t && /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(B, { onClick: xe, children: [
+      /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(A, { name: "call_split", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+      /* @__PURE__ */ e(
+        P,
+        {
+          primary: t.has_been_split || t.parent_guid ? i.split_transaction_unsplit_title : i.split_transaction_title,
+          secondary: t.has_been_split || t.parent_guid ? i.split_transaction_unsplit_subtitle : i.split_transaction_desc
+        }
+      ),
+      /* @__PURE__ */ e($, { children: t.has_been_split || t.parent_guid ? /* @__PURE__ */ e(A, { name: "delete", weight: b.Dark }) : /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+    ] }) }),
+    /* @__PURE__ */ c(
+      re,
+      {
+        ariaLabelClose: s.close_aria,
+        isOpen: T,
+        isPrimaryDisabled: ve,
+        onClose: De,
+        onPrimaryAction: Ie,
+        primaryText: s.save_button,
+        secondaryText: s.cancel_button,
+        title: i.split_transaction_title,
+        children: [
+          a,
+          /* @__PURE__ */ e(be, { transaction: t }),
+          /* @__PURE__ */ e(
+            st,
+            {
+              onAddSplit: U,
+              onCategoryChanged: Ne,
+              onDeleteSplit: ie,
+              onUpdateAmount: le,
+              splits: h,
+              transaction: t
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      F,
+      {
+        copy: { title: i.split_transaction_unsplit_title },
+        isOpen: C,
+        onClose: () => {
+          d(!1), w(!1);
+        },
+        onPrimaryAction: Oe,
+        onSecondaryAction: () => {
+          o(g.ON_TRANSACTION_UNSPLIT_CANCEL);
+        },
+        primaryText: s.delete_button,
+        secondaryText: s.cancel_button,
+        children: /* @__PURE__ */ e(V, { variant: "Paragraph", children: X(
+          i.split_transaction_unsplit_description,
+          t.description
+        ) })
+      }
+    )
+  ] });
+}, dt = D(ct), _t = () => {
+  const t = Se(), { onEvent: o } = v(), { addTag: l } = E(), { transactions: a } = O(), [r, n] = _.useState(!1), [s, i] = _.useState(""), [d, m] = _.useState(""), u = _.useRef(null);
+  _.useEffect(() => {
+    r && u?.current?.focus();
+  }, [r]);
+  const p = () => {
+    o(
+      r ? g.ON_TRANSACTION_TAGS_TAG_ADD_CANCEL_CLICK : g.ON_TRANSACTION_TAGS_TAG_ADD_CLICK
+    ), r || i(""), n(!r);
+  }, T = async () => {
+    o(g.ON_TRANSACTION_TAGS_TAG_ADDED), await l(s), n(!1);
+  };
+  return _.useEffect(() => {
+    m(s.length > 40 ? a.tags_error_name_must_be_40_chars : "");
+  }, [s]), /* @__PURE__ */ c(L, { className: "mx-txn-tag-manager-header", children: [
+    /* @__PURE__ */ c(
+      I,
+      {
+        alignItems: "center",
+        bgcolor: t.palette.background.default,
+        direction: "row",
+        justifyContent: "space-between",
+        px: 24,
+        py: 16,
+        children: [
+          /* @__PURE__ */ e(S, { bold: !0, children: a.tags_your_tags }),
+          /* @__PURE__ */ e(
+            ne,
+            {
+              "aria-expanded": r,
+              "aria-label": a.tags_add_tag_btn_aria,
+              onClick: p,
+              children: a.tags_add_tag_btn
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ c(
+      F,
+      {
+        copy: { title: a.tags_add_tag_btn },
+        isOpen: r,
+        onClose: () => n(!1),
+        onPrimaryAction: T,
+        onSecondaryAction: () => n(!1),
+        children: [
+          /* @__PURE__ */ e(
+            me,
+            {
+              "aria-label": a.tags_placeholder,
+              name: "add-tag",
+              onChange: (y) => i(y.target.value),
+              placeholder: a.tags_placeholder,
+              sx: { width: "100%" },
+              value: s
+            }
+          ),
+          /* @__PURE__ */ e(V, { id: "add-tag-error", sx: { color: "error.main" }, variant: "ParagraphSmall", children: d })
+        ]
+      }
+    )
+  ] });
+}, mt = D(_t), ut = ({ onSearchValueChanged: t, searchValue: o }) => {
+  const { common: l, transactions: a } = O(), r = ae(), n = /* @__PURE__ */ e(
+    Y,
+    {
+      "aria-label": a.tags_cancel_search || "Search",
+      onClick: () => t(""),
+      children: /* @__PURE__ */ e(te, {})
+    }
+  );
+  return /* @__PURE__ */ e(L, { className: "mx-txn-tag-manager-search", px: r.Spacing.Large, py: r.Spacing.Medium, children: /* @__PURE__ */ e(
+    me,
+    {
+      InputProps: {
+        startAdornment: /* @__PURE__ */ e(pe, { position: "start", children: /* @__PURE__ */ e(Be, { color: "disabled" }) }),
+        endAdornment: /* @__PURE__ */ e(pe, { position: "end", sx: { padding: 0 }, children: o ? n : null })
+      },
+      "aria-label": l.search_aria,
+      name: "search",
+      onChange: (s) => t(s.target.value),
+      placeholder: l.search_placeholder,
+      sx: { bgcolor: "background.paper", width: "100%" },
+      value: o
+    }
+  ) });
+}, pt = D(ut), gt = ({ onTagChecked: t, selectedTags: o, tag: l }) => {
+  const { onEvent: a } = v(), { removeTag: r, updateTag: n } = E(), { common: s, transactions: i } = O(), [d, m] = _.useState(!1), [u, p] = _.useState(!1), [T, y] = _.useState(""), [C, w] = _.useState(""), h = async () => {
+    a(g.ON_TRANSACTION_TAGS_TAG_EDIT_SAVED), l && await n({ ...l, name: T }), m(!1);
+  }, N = async () => {
+    a(g.ON_TRANSACTION_TAGS_TAG_DELETED), await r(l.guid), p(!1);
+  };
+  _.useEffect(() => {
+    w(T.length > 40 ? i.tags_error_name_must_be_40_chars : "");
+  }, [T]);
+  const U = () => {
+    a(g.ON_TRANSACTION_TAGS_TAG_EDIT_CLICK), y(l.name), m(!0);
+  }, ie = () => {
+    a(g.ON_TRANSACTION_TAGS_TAG_DELETE_CLICK), p(!0);
+  };
+  return /* @__PURE__ */ c(
+    R,
+    {
+      className: "mx-txn-transaction-manager-row",
+      disableGutters: !0,
+      disablePadding: !0,
+      secondaryAction: !l.is_default_tag && /* @__PURE__ */ c(I, { direction: "row", children: [
+        /* @__PURE__ */ e(
+          Y,
+          {
+            "aria-label": `Edit ${l.name} tag`,
+            color: "secondary",
+            onClick: U,
+            children: /* @__PURE__ */ e($e, { color: "secondary" })
+          }
+        ),
+        /* @__PURE__ */ e(
+          Y,
+          {
+            "aria-label": `Delete ${l.name} tag`,
+            color: "secondary",
+            onClick: ie,
+            children: /* @__PURE__ */ e(ee, { color: "secondary" })
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ c(
+          B,
+          {
+            "aria-checked": o.includes(l.guid),
+            onClick: () => t(l.guid),
+            role: "checkbox",
+            children: [
+              /* @__PURE__ */ e($, { sx: { ml: 0 }, children: /* @__PURE__ */ e(Ue, { checked: o.includes(l.guid), edge: "start", tabIndex: -1 }) }),
+              /* @__PURE__ */ e(P, { children: l.name })
+            ]
+          }
+        ),
+        /* @__PURE__ */ c(
+          F,
+          {
+            copy: { title: "Update tag name" },
+            isOpen: d,
+            onClose: () => m(!1),
+            onPrimaryAction: h,
+            onSecondaryAction: () => m(!1),
+            children: [
+              /* @__PURE__ */ e(
+                me,
+                {
+                  "aria-describedby": C ? "update-tag-error" : void 0,
+                  "aria-label": i.tags_update_the_tag_name,
+                  name: "update-tag",
+                  onChange: (le) => y(le.target.value),
+                  placeholder: "Tag name",
+                  sx: { width: "100%" },
+                  value: T
+                }
+              ),
+              /* @__PURE__ */ e(V, { id: "update-tag-error", sx: { color: "error.main" }, variant: "ParagraphSmall", children: C })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          F,
+          {
+            copy: { title: i.tags_delete_title },
+            isOpen: u,
+            onClose: () => p(!1),
+            onPrimaryAction: N,
+            onSecondaryAction: () => a(g.ON_TRANSACTION_TAGS_TAG_DELETE_CANCEL_CLICK),
+            primaryText: s.delete_button,
+            secondaryText: s.cancel_button,
+            children: /* @__PURE__ */ e(S, { truncate: !1, children: i.tags_deleting_this_tag_will_remove_it })
+          }
+        )
+      ]
+    }
+  );
+}, ht = D(gt), Tt = ({ selectedTags: t, onTagChecked: o }) => {
+  const { tags: l } = E(), [a, r] = _.useState(""), n = l.filter(
+    (s) => s.name.toLowerCase().includes(a.toLowerCase())
+  );
+  return /* @__PURE__ */ c("div", { className: "mx-txn-tag-manager", children: [
+    /* @__PURE__ */ e(
+      pt,
+      {
+        onSearchValueChanged: (s) => r(s),
+        searchValue: a
+      }
+    ),
+    /* @__PURE__ */ e(mt, {}),
+    /* @__PURE__ */ e(q, { sx: { boxShadow: "none" }, children: /* @__PURE__ */ e(Z, { children: n.map((s) => /* @__PURE__ */ c(_.Fragment, { children: [
+      /* @__PURE__ */ e(ht, { onTagChecked: o, selectedTags: t, tag: s }),
+      /* @__PURE__ */ e(Q, { sx: { ml: 24 } })
+    ] }, s.guid)) }) })
+  ] });
+}, yt = D(Tt), St = ({ transaction: t }) => {
+  const { onEvent: o } = v(), { tags: l, updateTaggings: a, updateTransaction: r } = E(), { common: n, transactions: s } = O(), { updateManualTransaction: i } = H(), [d, m] = _.useState(!1), [u, p] = _.useState(t.tags);
+  _.useEffect(() => {
+    p(t.tags);
+  }, [d, t]);
+  const T = (w) => {
+    const h = [...u], N = u.indexOf(w);
+    N >= 0 ? h.splice(N, 1) : h.push(w), p(h);
+  }, y = async () => {
+    if (t.is_manual && !t.guid) {
+      i({ ...t, tags: u }), m(!1);
+      return;
+    }
+    await a(u, t.guid), await r({ ...t, tags: u }), o(k.TRANSACTION_DETAILS_CLICK_TAGS, { transaction_guid: t.guid }), m(!1);
+  }, C = _.useMemo(
+    () => t.tags.map(
+      (w, h, N) => `${l.find((U) => U.guid === w)?.name}${h < N.length - 1 ? " / " : ""}`
+    ),
+    [l, t]
+  );
+  return /* @__PURE__ */ c(_.Fragment, { children: [
+    /* @__PURE__ */ e(R, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ c(
+      B,
+      {
+        onClick: () => {
+          o(g.ON_TRANSACTION_TAGS_CLICK), m(!0);
+        },
+        children: [
+          /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: /* @__PURE__ */ e(A, { name: "local_offer", sx: { color: "text.primary" }, weight: b.Dark }) }) }),
+          /* @__PURE__ */ e(
+            P,
+            {
+              primary: s.tags_title,
+              primaryTypographyProps: { variant: "XSmall" },
+              secondary: /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: t.tags?.length > 0 ? C : s.tags_desc })
+            }
+          ),
+          /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(A, { name: "chevron_right", weight: b.Dark }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      re,
+      {
+        ariaLabelClose: n.close_aria,
+        isOpen: d,
+        onClose: () => m(!1),
+        onPrimaryAction: y,
+        primaryText: n.save_button,
+        secondaryText: n.cancel_button,
+        title: s.tags_title,
+        children: /* @__PURE__ */ e(yt, { onTagChecked: T, selectedTags: u })
+      }
+    )
+  ] });
+}, Ct = D(St), ft = ({ transaction: t, viewOnly: o = !1 }) => {
+  const { updateTransaction: l } = E(), { common: a, transactions: r } = O(), { onEvent: n } = v(), { announce: s, ariaLive: i } = ue(), [d, m] = _.useState(!1), [u, p] = _.useState(""), T = _.useRef(null);
+  _.useEffect(() => {
+    d && (p(t.description), T?.current?.focus());
+  }, [d]);
+  const y = () => {
+    m(!0), n(g.ON_TRANSACTION_DESCRIPTION_EDIT_CLICK), setTimeout(() => document.getElementById("transaction-description-input")?.focus(), 0);
+  }, C = async () => {
+    n(k.TRANSACTION_DETAILS_CLICK_DESCRIPTION, {
+      transaction_guid: t.guid
+    }), await l({ ...t, description: u }), m(!1), s(`${r.payee_title}: ${u}`), setTimeout(() => document.getElementById("transaction-description-edit-button")?.focus(), 0);
+  };
+  return /* @__PURE__ */ c(L, { className: "mx-txn-transaction-description", children: [
+    i,
+    d ? /* @__PURE__ */ c(Re, { row: !0, children: [
+      /* @__PURE__ */ e(
+        Te,
+        {
+          "aria-label": r.payee_title,
+          id: "transaction-description-input",
+          label: r.payee_title,
+          name: r.payee_title,
+          onChange: (w) => p(w.target.value),
+          ref: T,
+          sx: {
+            backgroundColor: "background.paper",
+            ".MuiOutlinedInput-root": { borderTopRightRadius: 0, borderBottomRightRadius: 0 },
+            ".MuiOutlinedInput-input": { p: 11 },
+            width: 250
+          },
+          value: u
+        }
+      ),
+      /* @__PURE__ */ e(
+        ne,
+        {
+          disabled: !u,
+          onClick: C,
+          sx: {
+            borderTopLeftRadius: 0,
+            borderBottomLeftRadius: 0
+          },
+          variant: "outlined",
+          children: a.save_button
+        }
+      )
+    ] }) : /* @__PURE__ */ c(I, { alignItems: "center", direction: "row", gap: 4, sx: { minHeight: 44 }, children: [
+      /* @__PURE__ */ e(S, { bold: !0, children: t.description }),
+      !o && /* @__PURE__ */ e(
+        Y,
+        {
+          "aria-label": r.payee_edit,
+          id: "transaction-description-edit-button",
+          onClick: y,
+          sx: { color: "action.active" },
+          children: /* @__PURE__ */ e(A, { name: "create", size: 22 })
+        }
+      )
+    ] })
+  ] });
+}, At = D(ft), bt = ({ transaction: t }) => {
+  const { updateTransaction: o } = E(), { transactions: l } = O(), { onEvent: a } = v(), r = Se(), n = async () => {
+    a(k.TRANSACTION_DETAILS_CLICK_FLAG, { transaction_guid: t.guid }), await o({ ...t, is_flagged: !t.is_flagged });
+  };
+  return /* @__PURE__ */ e("div", { className: "mx-txn-transaction-flag", children: /* @__PURE__ */ e(
+    Me,
+    {
+      "aria-label": l.flag_btn_aria,
+      "aria-pressed": t.is_flagged,
+      color: "warning",
+      onClick: n,
+      selected: t.is_flagged,
+      sx: {
+        borderRadius: 6,
+        color: r.palette.secondary.main,
+        "&.Mui-selected": {
+          color: r.palette.common.white,
+          backgroundColor: r.palette.warning.dark,
+          ":hover": {
+            color: r.palette.common.white,
+            backgroundColor: r.palette.warning.main
+          }
+        },
+        ":hover": {
+          color: r.palette.warning.contrastText,
+          backgroundColor: r.palette.warning.light
+        }
+      },
+      value: "flagged",
+      children: /* @__PURE__ */ e(Fe, { color: "inherit" })
+    }
+  ) });
+}, Nt = D(bt), j = (t, o, l, a = !0, r = "inset") => a ? /* @__PURE__ */ c(_.Fragment, { children: [
+  /* @__PURE__ */ c(R, { disableGutters: !0, disablePadding: !0, children: [
+    /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(M, { sx: { bgcolor: "border.light" }, variant: "rounded", children: t }) }),
+    /* @__PURE__ */ e(
+      P,
+      {
+        primary: o,
+        primaryTypographyProps: { variant: "XSmall" },
+        secondary: l
+      }
+    )
+  ] }),
+  /* @__PURE__ */ e(Q, { variant: r })
+] }) : null, xt = ({ transaction: t }) => {
+  const { transactions: o } = O(), { tags: l } = E(), a = _.useMemo(() => {
+    const r = new Map(l.map((n) => [n.guid, n.name]));
+    return t.tags.map((n) => r.get(n)).filter(Boolean).join(" / ");
+  }, [l, t.tags]);
+  return /* @__PURE__ */ c(Z, { sx: { "& .MuiListItem-root": { px: 24, py: 12 } }, children: [
+    j(
+      /* @__PURE__ */ e(
+        _e,
+        {
+          categoryGuid: t.top_level_category_guid,
+          size: 24,
+          sx: { color: "text.primary" },
+          variant: ge.Transparent
+        }
+      ),
+      o.category_title,
+      /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: t.category ?? o.actions_select_a_category })
+    ),
+    j(
+      /* @__PURE__ */ e(A, { name: "calendar_month", sx: { color: "text.primary" }, weight: b.Dark }),
+      o.date_title,
+      /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: Ce(de(t.date), fe.YEAR_MONTH_DAY) })
+    ),
+    j(
+      /* @__PURE__ */ e(A, { name: "article", sx: { color: "text.primary" }, weight: b.Dark }),
+      o.memo_title,
+      /* @__PURE__ */ e(S, { bold: !0, sx: { overflowWrap: "break-word", whiteSpace: "wrap" }, variant: "Body", children: t.memo ?? o.memo_desc }),
+      !!t.memo,
+      t.tags?.length > 0 ? "inset" : "fullWidth"
+    ),
+    j(
+      /* @__PURE__ */ e(A, { name: "local_offer", sx: { color: "text.primary" }, weight: b.Dark }),
+      o.tags_title,
+      /* @__PURE__ */ e(S, { bold: !0, variant: "Body", children: t.tags?.length ? a : o.tags_desc }),
+      !!t.tags?.length,
+      "fullWidth"
+    )
+  ] });
+}, It = D(xt), Dt = ({
+  bottomActions: t = Ye,
+  canFlagTransaction: o = !0,
+  topActions: l = We,
+  transaction: a
+}) => {
+  const { onEvent: r } = v(), { isCopyLoaded: n } = Pe(), { userFeatures: s } = Ge(), i = a?.number && a.number.length > 4;
+  if (_.useEffect(
+    () => r(k.TRANSACTION_DETAILS_VIEW, { transaction_guid: a.guid }),
+    []
+  ), !n)
+    return /* @__PURE__ */ e(Ve, {});
+  const d = ke(s, "MX_TXN_DETAILS_VIEW_ONLY");
+  return /* @__PURE__ */ e(L, { className: "mx-txn-transaction-details", width: "100%", children: a && /* @__PURE__ */ c(I, { children: [
+    /* @__PURE__ */ c(I, { gap: 12, p: 24, children: [
+      /* @__PURE__ */ e(q, { elevation: 2, sx: { width: 64 }, children: /* @__PURE__ */ e(
+        he,
+        {
+          categoryGuid: a.top_level_category_guid || "",
+          merchantGuid: a.merchant_guid || "",
+          size: 64
+        }
+      ) }),
+      /* @__PURE__ */ e(At, { transaction: a, viewOnly: d }),
+      /* @__PURE__ */ c(I, { direction: "row", justifyContent: "space-between", sx: { minHeight: 44 }, children: [
+        /* @__PURE__ */ c(V, { color: a.isIncome ? "success.main" : "text.primary", variant: "H1", children: [
+          a.isIncome ? "+" : "",
+          oe(a.amount, "0,0.00")
+        ] }),
+        !d && o && /* @__PURE__ */ e(Nt, { transaction: a })
+      ] }),
+      /* @__PURE__ */ c(I, { bgcolor: "background.highlight", borderRadius: "12px", gap: 4, p: 8, children: [
+        /* @__PURE__ */ e(S, { bold: !0, children: `${a.account}
+                ${i ? a.number : "•".repeat(4).concat(a.number ?? "")}` }),
+        /* @__PURE__ */ e(S, { bold: !0, color: "secondary", variant: "Tiny", children: a.feed_description })
+      ] })
+    ] }),
+    /* @__PURE__ */ e(q, { square: !0, sx: { boxShadow: "none" }, children: d ? /* @__PURE__ */ e(It, { transaction: a }) : /* @__PURE__ */ e(Z, { children: l.map((m, u) => /* @__PURE__ */ c(_.Fragment, { children: [
+      m === W.Category && /* @__PURE__ */ e(je, { transaction: a }),
+      m === W.Date && /* @__PURE__ */ e(qe, { transaction: a }),
+      m === W.Memo && /* @__PURE__ */ e(rt, { transaction: a }),
+      m === W.Tags && /* @__PURE__ */ e(Ct, { transaction: a }),
+      /* @__PURE__ */ e(Q, { variant: u < l.length - 1 ? "inset" : "fullWidth" })
+    ] }, m)) }) }),
+    !d && t.length > 0 && /* @__PURE__ */ c(_.Fragment, { children: [
+      /* @__PURE__ */ e(S, { bold: !0, mb: 8, ml: 26, mt: 16, variant: "Body", children: "Actions" }),
+      /* @__PURE__ */ e(q, { square: !0, sx: { boxShadow: "none" }, children: /* @__PURE__ */ c(Z, { children: [
+        t.map((m, u) => /* @__PURE__ */ c(_.Fragment, { children: [
+          m === J.SplitTransaction && /* @__PURE__ */ e(dt, { transaction: a }),
+          m === J.HideTransaction && /* @__PURE__ */ e(at, { transaction: a }),
+          m === J.MerchantLogo && /* @__PURE__ */ e(et, { transaction: a }),
+          /* @__PURE__ */ e(Q, { variant: u < t.length - 1 ? "inset" : "fullWidth" })
+        ] }, m)),
+        a.is_manual && !a.parent_guid && !a.has_been_split && /* @__PURE__ */ e(Qe, { transaction: a })
+      ] }) })
+    ] })
+  ] }) });
+}, ha = D(Dt);
+export {
+  J as B,
+  je as C,
+  qe as D,
+  rt as M,
+  ha as T,
+  Ct as a,
+  W as b
+};