@mx-cartographer/experiences 9.2.4-alpha.al0 → 9.3.0-alpha.bb1

package/dist/transactions/components/shared/TransactionTable/cells/CategoryCell/index.es.js

@@ -0,0 +1,38 @@
+import { useGlobalCopyStore as s } from "../../../../../../common/context/hooks/index.es.js";
+import n from "react";
+import { observer as l } from "mobx-react-lite";
+import c from "@mui/material/Stack";
+import { Icon as r, Text as m } from "@mxenabled/mxui";
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+var _ = (e) => {
+  const { transactions: a } = s(), [i, o] = n.useState(!1);
+  return /* @__PURE__ */ p(c, {
+    alignItems: "center",
+    direction: "row",
+    gap: 8,
+    height: "100%",
+    onMouseEnter: () => o(!0),
+    onMouseLeave: () => o(!1),
+    width: "100%",
+    children: [
+      e.row.has_been_split && /* @__PURE__ */ t(r, {
+        name: "call_split",
+        size: 16
+      }),
+      /* @__PURE__ */ t(m, {
+        tabIndex: e.tabIndex,
+        variant: "body2",
+        children: e.row.has_been_split ? a.split_transaction_category_label : e.row.category
+      }),
+      !e.row.has_been_split && i && /* @__PURE__ */ t(r, {
+        name: "edit",
+        sx: { color: "action.active" }
+      })
+    ]
+  });
+}, g = l(_);
+export {
+  g as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/cells/CategoryCell/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../../src/transactions/components/shared/transactiontable/cells/CategoryCell.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { GridCellParams } from '@mui/x-data-grid-pro'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../../../../common'\n\nconst CategoryCell = (params: GridCellParams) => {\n  const { transactions: copy } = useGlobalCopyStore()\n  const [isHover, setIsHover] = React.useState(false)\n\n  return (\n    <Stack\n      alignItems=\"center\"\n      direction=\"row\"\n      gap={8}\n      height=\"100%\"\n      onMouseEnter={() => setIsHover(true)}\n      onMouseLeave={() => setIsHover(false)}\n      width=\"100%\"\n    >\n      {params.row.has_been_split && <Icon name=\"call_split\" size={16} />}\n      <Text tabIndex={params.tabIndex} variant=\"body2\">\n        {params.row.has_been_split ? copy.split_transaction_category_label : params.row.category}\n      </Text>\n      {!params.row.has_been_split && isHover && (\n        <Icon name=\"edit\" sx={{ color: 'action.active' }} />\n      )}\n    </Stack>\n  )\n}\n\nexport default observer(CategoryCell)\n"],"mappings":";;;;;;AAWA,IAAM,IAAA,CAAgB,MAA2B;AAC/C,QAAM,EAAE,cAAc,EAAA,IAAS,EAAmB,GAC5C,CAAC,GAAS,CAAA,IAAc,EAAM,SAAS,EAAK;AAElD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAW;AAAA,IACX,WAAU;AAAA,IACV,KAAK;AAAA,IACL,QAAO;AAAA,IACP,cAAA,MAAoB,EAAW,EAAI;AAAA,IACnC,cAAA,MAAoB,EAAW,EAAK;AAAA,IACpC,OAAM;AAAA,cAPR;AAAA,MASG,EAAO,IAAI,kBAAkB,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAa,MAAM;AAAA,MAAK,CAAA;AAAA,MACjE,gBAAA,EAAC,GAAD;AAAA,QAAM,UAAU,EAAO;AAAA,QAAU,SAAQ;AAAA,kBACtC,EAAO,IAAI,iBAAiB,EAAK,mCAAmC,EAAO,IAAI;AAAA,MAC5E,CAAA;AAAA,MACL,CAAC,EAAO,IAAI,kBAAkB,KAC7B,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAO,IAAI,EAAE,OAAO,gBAAgB;AAAA,MAAI,CAAA;AAAA,IAEhD;AAAA;AAEX,GAEA,IAAe,EAAS,CAAY"}

package/dist/transactions/components/shared/TransactionTable/cells/DateCell/index.es.js

@@ -0,0 +1,14 @@
+import { DATE_FORMATS_INTL as t, formatDate as o } from "../../../../../../core/constants/DateFormats/index.es.js";
+import { fromUnixUTC as e } from "../../../../../../core/utils/DateUtil/index.es.js";
+import { Text as a } from "@mxenabled/mxui";
+import { jsx as m } from "react/jsx-runtime";
+var x = (r) => /* @__PURE__ */ m(a, {
+  tabIndex: r.tabIndex,
+  variant: "body2",
+  children: o(e(r.row.date), t.MONTH_DAY)
+});
+export {
+  x as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/cells/DateCell/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../../src/transactions/components/shared/transactiontable/cells/DateCell.tsx"],"sourcesContent":["import { GridCellParams } from '@mui/x-data-grid'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { DATE_FORMATS_INTL, formatDate } from '../../../../../core/constants'\nimport { fromUnixUTC } from '../../../../../core/utils/DateUtil'\n\nconst DateCell = (params: GridCellParams) => {\n  return (\n    <Text tabIndex={params.tabIndex} variant=\"body2\">\n      {formatDate(fromUnixUTC(params.row.date), DATE_FORMATS_INTL.MONTH_DAY)}\n    </Text>\n  )\n}\n\nexport default DateCell\n"],"mappings":";;;;AAOA,IAAM,IAAA,CAAY,MAEd,gBAAA,EAAC,GAAD;AAAA,EAAM,UAAU,EAAO;AAAA,EAAU,SAAQ;AAAA,YACtC,EAAW,EAAY,EAAO,IAAI,IAAI,GAAG,EAAkB,SAAS;AACjE,CAAA"}

package/dist/transactions/components/shared/TransactionTable/cells/FlagCell/index.es.js

@@ -0,0 +1,46 @@
+import { useGlobalCopyStore as c } from "../../../../../../common/context/hooks/index.es.js";
+import { observer as f } from "mobx-react-lite";
+import { Icon as l } from "@mxenabled/mxui";
+import { jsx as e, jsxs as g } from "react/jsx-runtime";
+import { useTheme as p } from "@mui/material/styles";
+import h from "@mui/material/Box";
+var x = (i) => {
+  const r = p(), s = r.palette.mode === "dark", { transactions: t } = c(), { is_flagged: a, is_hidden: o, has_been_viewed: n, parent_guid: d } = i.row, m = !n && !d;
+  return /* @__PURE__ */ g(h, {
+    "aria-label": o ? t.is_excluded : t.is_flagged,
+    tabIndex: i.tabIndex,
+    children: [
+      a && /* @__PURE__ */ e(l, {
+        fill: !0,
+        name: "flag",
+        size: 16,
+        sx: { color: s ? "primary.main" : "warning.dark" }
+      }),
+      !a && o && /* @__PURE__ */ e(l, {
+        name: "visibility_off",
+        size: 16
+      }),
+      m && /* @__PURE__ */ e("svg", {
+        "data-testid": "svg",
+        style: {
+          display: "inline-block",
+          height: 16,
+          fill: r.palette.primary.light,
+          verticalAlign: "middle",
+          width: 16
+        },
+        viewBox: "0 0 512 512",
+        children: /* @__PURE__ */ e("circle", {
+          cx: "256",
+          cy: "256",
+          r: "60"
+        })
+      })
+    ]
+  });
+}, k = f(x);
+export {
+  k as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/cells/FlagCell/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../../src/transactions/components/shared/transactiontable/cells/FlagCell.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport { observer } from 'mobx-react-lite'\n\nimport { useTheme } from '@mui/material/styles'\nimport { GridRenderCellParams } from '@mui/x-data-grid-pro'\nimport { Icon } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../../../../common'\n\nconst FlagCell = (params: GridRenderCellParams) => {\n  const theme = useTheme()\n  const isDarkMode = theme.palette.mode === 'dark'\n\n  const { transactions: transactionsCopy } = useGlobalCopyStore()\n  const { is_flagged, is_hidden, has_been_viewed, parent_guid } = params.row\n  const isChildOfSplit = !!parent_guid\n  const hasNotBeenViewed = !has_been_viewed && !isChildOfSplit\n\n  return (\n    <Box\n      aria-label={is_hidden ? transactionsCopy.is_excluded : transactionsCopy.is_flagged}\n      tabIndex={params.tabIndex}\n    >\n      {is_flagged && (\n        <Icon\n          fill={true}\n          name=\"flag\"\n          size={16}\n          sx={{ color: isDarkMode ? 'primary.main' : 'warning.dark' }}\n        />\n      )}\n      {!is_flagged && is_hidden && <Icon name=\"visibility_off\" size={16} />}\n      {hasNotBeenViewed && (\n        <svg\n          data-testid=\"svg\"\n          style={{\n            display: 'inline-block',\n            height: 16,\n            fill: theme.palette.primary.light,\n            verticalAlign: 'middle',\n            width: 16,\n          }}\n          viewBox=\"0 0 512 512\"\n        >\n          <circle cx=\"256\" cy=\"256\" r=\"60\" />\n        </svg>\n      )}\n    </Box>\n  )\n}\n\nexport default observer(FlagCell)\n"],"mappings":";;;;;;AASA,IAAM,IAAA,CAAY,MAAiC;AACjD,QAAM,IAAQ,EAAS,GACjB,IAAa,EAAM,QAAQ,SAAS,QAEpC,EAAE,cAAc,EAAA,IAAqB,EAAmB,GACxD,EAAE,YAAA,GAAY,WAAA,GAAW,iBAAA,GAAiB,aAAA,EAAA,IAAgB,EAAO,KAEjE,IAAmB,CAAC,KAAmB,CADpB;AAGzB,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,cAAY,IAAY,EAAiB,cAAc,EAAiB;AAAA,IACxE,UAAU,EAAO;AAAA,cAFnB;AAAA,MAIG,KACC,gBAAA,EAAC,GAAD;AAAA,QACE,MAAM;AAAA,QACN,MAAK;AAAA,QACL,MAAM;AAAA,QACN,IAAI,EAAE,OAAO,IAAa,iBAAiB,eAAe;AAAA,MAC3D,CAAA;AAAA,MAEF,CAAC,KAAc,KAAa,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAiB,MAAM;AAAA,MAAK,CAAA;AAAA,MACnE,KACC,gBAAA,EAAC,OAAD;AAAA,QACE,eAAY;AAAA,QACZ,OAAO;AAAA,UACL,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,MAAM,EAAM,QAAQ,QAAQ;AAAA,UAC5B,eAAe;AAAA,UACf,OAAO;AAAA,QACT;AAAA,QACA,SAAQ;AAAA,kBAER,gBAAA,EAAC,UAAD;AAAA,UAAQ,IAAG;AAAA,UAAM,IAAG;AAAA,UAAM,GAAE;AAAA,QAAM,CAAA;AAAA,MAC/B,CAAA;AAAA,IAEJ;AAAA;AAET,GAEA,IAAe,EAAS,CAAQ"}

package/dist/transactions/components/shared/TransactionTable/cells/HeaderCell/index.es.js

@@ -0,0 +1,12 @@
+import { Text as r } from "@mxenabled/mxui";
+import { jsx as a } from "react/jsx-runtime";
+var d = (e) => /* @__PURE__ */ a(r, {
+  fontWeight: 600,
+  variant: "body2",
+  children: e.colDef.headerName
+});
+export {
+  d as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/cells/HeaderCell/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../../src/transactions/components/shared/transactiontable/cells/HeaderCell.tsx"],"sourcesContent":["import { Text } from '@mxenabled/mxui'\n\nimport { GridColumnHeaderParams } from '@mui/x-data-grid'\n\nconst HeaderCell = (params: GridColumnHeaderParams) => (\n  <Text fontWeight={600} variant=\"body2\">\n    {params.colDef.headerName}\n  </Text>\n)\n\nexport default HeaderCell\n"],"mappings":";;AAIA,IAAM,IAAA,CAAc,MAClB,gBAAA,EAAC,GAAD;AAAA,EAAM,YAAY;AAAA,EAAK,SAAQ;AAAA,YAC5B,EAAO,OAAO;AACX,CAAA"}

package/dist/transactions/components/shared/TransactionTable/cells/PayeeCell/index.es.js

@@ -0,0 +1,28 @@
+import r from "@mui/material/Stack";
+import { MerchantLogo as n, Text as i } from "@mxenabled/mxui";
+import { jsx as t, jsxs as o } from "react/jsx-runtime";
+var a = (e) => /* @__PURE__ */ o(r, {
+  alignItems: "center",
+  direction: "row",
+  gap: 8,
+  children: [/* @__PURE__ */ t(n, {
+    categoryGuid: e.row.top_level_category_guid || "",
+    merchantGuid: e.row.merchant_guid || ""
+  }), /* @__PURE__ */ o(r, {
+    alignItems: "flex-start",
+    direction: "column",
+    children: [/* @__PURE__ */ t(i, {
+      tabIndex: e.tabIndex,
+      variant: "body2",
+      children: e.row.payee
+    }), e.row.is_hidden && /* @__PURE__ */ t(i, {
+      variant: "caption",
+      children: e.excludedText
+    })]
+  })]
+});
+export {
+  a as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/cells/PayeeCell/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../../src/transactions/components/shared/transactiontable/cells/PayeeCell.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack'\n\nimport { GridCellParams } from '@mui/x-data-grid'\n\nimport { MerchantLogo, Text } from '@mxenabled/mxui'\n\ninterface PayeeCellProps extends GridCellParams {\n  excludedText: string\n}\n\nconst PayeeCell = (params: PayeeCellProps) => {\n  return (\n    <Stack alignItems=\"center\" direction=\"row\" gap={8}>\n      <MerchantLogo\n        categoryGuid={params.row.top_level_category_guid || ''}\n        merchantGuid={params.row.merchant_guid || ''}\n      />\n      <Stack alignItems=\"flex-start\" direction=\"column\">\n        <Text tabIndex={params.tabIndex} variant=\"body2\">\n          {params.row.payee}\n        </Text>\n        {params.row.is_hidden && <Text variant=\"caption\">{params.excludedText}</Text>}\n      </Stack>\n    </Stack>\n  )\n}\n\nexport default PayeeCell\n"],"mappings":";;;AAUA,IAAM,IAAA,CAAa,MAEf,gBAAA,EAAC,GAAD;AAAA,EAAO,YAAW;AAAA,EAAS,WAAU;AAAA,EAAM,KAAK;AAAA,YAAhD,CACE,gBAAA,EAAC,GAAD;AAAA,IACE,cAAc,EAAO,IAAI,2BAA2B;AAAA,IACpD,cAAc,EAAO,IAAI,iBAAiB;AAAA,EAC3C,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,IAAO,YAAW;AAAA,IAAa,WAAU;AAAA,cAAzC,CACE,gBAAA,EAAC,GAAD;AAAA,MAAM,UAAU,EAAO;AAAA,MAAU,SAAQ;AAAA,gBACtC,EAAO,IAAI;AAAA,IACR,CAAA,GACL,EAAO,IAAI,aAAa,gBAAA,EAAC,GAAD;AAAA,MAAM,SAAQ;AAAA,gBAAW,EAAO;AAAA,IAAmB,CAAA,CACvE;AAAA,IACF"}

package/dist/transactions/components/shared/TransactionTable/index.es.js

@@ -0,0 +1,124 @@
+import { useEvent as w, useGlobalCopyStore as b, useGlobalUiStore as T, useTransactionStore as N } from "../../../../common/context/hooks/index.es.js";
+import { ANALYTICS_EVENTS as S } from "../../../../common/constants/Analytics/index.es.js";
+import A from "../../../../common/components/Loader/index.es.js";
+import { useTransactionsUiStore as E } from "../../../context/hooks/index.es.js";
+import H from "../transactiontable/cells/AccountCell/index.es.js";
+import v from "../transactiontable/cells/AmountCell/index.es.js";
+import O from "../transactiontable/cells/CategoryCell/index.es.js";
+import L from "../transactiontable/cells/DateCell/index.es.js";
+import k from "../transactiontable/cells/FlagCell/index.es.js";
+import l from "../transactiontable/cells/HeaderCell/index.es.js";
+import D from "../transactiontable/cells/PayeeCell/index.es.js";
+import d from "react";
+import { observer as G } from "mobx-react-lite";
+import I from "@mui/material/Paper";
+import { jsx as r } from "react/jsx-runtime";
+import { DataGridPro as P } from "@mui/x-data-grid-pro";
+var F = ({ height: i = "100dvh", onCategoryClick: s, onRowClick: c }) => {
+  const { onEvent: m } = w(), { transactions: o } = b(), { isCopyLoaded: u } = T(), { isLoading: f, sortedTransactions: a } = N(), { clearExpandedSplits: p, toggleSplit: C } = E();
+  d.useEffect(() => () => p(), []);
+  const g = d.useMemo(() => a.map((e) => ({
+    id: e.guid,
+    isHovering: !1,
+    ...e
+  })), [a]), n = ({ row: { id: e, guid: t, has_been_split: _ }, field: y }) => _ ? C(e) : y === "category" ? (m(S.TRANSACTIONS_TABLE_CLICK_CATEGORY, { guid: t }), s?.(t)) : c?.(t), h = (e, t) => {
+    t.key !== "Enter" && t.key !== " " || n(e);
+  };
+  if (!u) return /* @__PURE__ */ r(A, {});
+  const x = [
+    {
+      field: "flag",
+      headerName: "",
+      minWidth: 32,
+      width: 32,
+      sortable: !1,
+      renderCell: (e) => /* @__PURE__ */ r(k, { ...e }),
+      renderHeader: () => /* @__PURE__ */ r("span", { "aria-label": o.transaction_status })
+    },
+    {
+      field: "date",
+      headerName: o.date_title,
+      width: 103,
+      renderHeader: l,
+      renderCell: (e) => e.row.parent_guid ? null : /* @__PURE__ */ r(L, { ...e }),
+      sortingOrder: ["desc", "asc"]
+    },
+    {
+      cellClassName: "vertical-align-center",
+      field: "payee",
+      headerName: o.payee_title,
+      flex: 0.33,
+      renderHeader: l,
+      renderCell: (e) => /* @__PURE__ */ r(D, {
+        ...e,
+        excludedText: o.is_excluded
+      }),
+      sortingOrder: ["asc", "desc"]
+    },
+    {
+      field: "category",
+      headerName: o.category_title,
+      flex: 0.25,
+      renderHeader: l,
+      renderCell: (e) => /* @__PURE__ */ r(O, { ...e }),
+      sortingOrder: ["asc", "desc"]
+    },
+    {
+      field: "account",
+      headerName: o.account_title,
+      flex: 0.33,
+      renderHeader: l,
+      renderCell: (e) => e.row.parent_guid ? null : /* @__PURE__ */ r(H, { ...e }),
+      sortingOrder: ["asc", "desc"]
+    },
+    {
+      field: "amount",
+      headerName: o.amount_title,
+      flex: 0.25,
+      renderHeader: l,
+      renderCell: v,
+      align: "right",
+      headerAlign: "right",
+      sortingOrder: ["asc", "desc"]
+    }
+  ];
+  return /* @__PURE__ */ r(I, {
+    sx: {
+      height: i,
+      px: 24,
+      width: "100%",
+      boxShadow: "none"
+    },
+    children: /* @__PURE__ */ r(P, {
+      columns: x,
+      disableColumnFilter: !0,
+      disableColumnMenu: !0,
+      getCellClassName: (e) => e.row.parent_guid ? "split-row" : e.row.is_hidden ? "excluded-row" : "",
+      hideFooter: !0,
+      initialState: { sorting: { sortModel: [{
+        field: "date",
+        sort: "desc"
+      }] } },
+      loading: f,
+      onCellClick: n,
+      onCellKeyDown: h,
+      rows: g,
+      slotProps: { baseIconButton: {
+        color: "secondary",
+        sx: { ml: 8 }
+      } },
+      sx: {
+        "& .split-row": { bgcolor: "background.default" },
+        "& .excluded-row": {
+          bgcolor: "grey.50",
+          color: "text.secondary"
+        }
+      }
+    })
+  });
+}, ee = G(F);
+export {
+  ee as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/TransactionTable/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/TransactionTable.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Paper from '@mui/material/Paper'\nimport { DataGridPro, GridCellParams, GridColDef } from '@mui/x-data-grid-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n} from '../../../common'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\n\nimport {\n  AccountCell,\n  AmountCell,\n  CategoryCell,\n  DateCell,\n  FlagCell,\n  HeaderCell,\n  PayeeCell,\n} from './transactiontable/cells'\n\ninterface TransactionTableProps {\n  height?: number | string\n  onCategoryClick?: (guid: string) => void\n  onRowClick?: (guid: string) => void\n}\n\nconst TransactionTable: React.FC<TransactionTableProps> = ({\n  height = '100dvh',\n  onCategoryClick,\n  onRowClick,\n}) => {\n  const { onEvent } = useEvent()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { isLoading, sortedTransactions } = useTransactionStore()\n  const { clearExpandedSplits, toggleSplit } = useTransactionsUiStore()\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  const rows = React.useMemo(\n    () =>\n      sortedTransactions.map((transaction) => ({\n        id: transaction.guid,\n        isHovering: false,\n        ...transaction,\n      })),\n    [sortedTransactions],\n  )\n\n  const handleCellClick = ({ row: { id, guid, has_been_split }, field }: GridCellParams) => {\n    if (has_been_split) return toggleSplit(id)\n\n    if (field === 'category') {\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_TABLE_CLICK_CATEGORY, { guid })\n      return onCategoryClick?.(guid)\n    }\n\n    return onRowClick?.(guid)\n  }\n\n  const handleCellKeyDown = (params: GridCellParams, event: React.KeyboardEvent) => {\n    if (event.key !== 'Enter' && event.key !== ' ') return\n    handleCellClick(params)\n  }\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  const columns: GridColDef[] = [\n    {\n      field: 'flag',\n      headerName: '',\n      minWidth: 32,\n      width: 32,\n      sortable: false,\n      renderCell: (params) => <FlagCell {...params} />,\n      renderHeader: () => <span aria-label={copy.transaction_status} />,\n    },\n    {\n      field: 'date',\n      headerName: copy.date_title,\n      width: 103,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <DateCell {...params} />),\n      sortingOrder: ['desc', 'asc'],\n    },\n    {\n      cellClassName: 'vertical-align-center',\n      field: 'payee',\n      headerName: copy.payee_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <PayeeCell {...params} excludedText={copy.is_excluded} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'category',\n      headerName: copy.category_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <CategoryCell {...params} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'account',\n      headerName: copy.account_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <AccountCell {...params} />),\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'amount',\n      headerName: copy.amount_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: AmountCell,\n      align: 'right',\n      headerAlign: 'right',\n      sortingOrder: ['asc', 'desc'],\n    },\n  ]\n\n  return (\n    <Paper sx={{ height: height, px: 24, width: '100%', boxShadow: 'none' }}>\n      <DataGridPro\n        columns={columns}\n        disableColumnFilter={true}\n        disableColumnMenu={true}\n        getCellClassName={(params) => {\n          if (params.row.parent_guid) return 'split-row'\n          if (params.row.is_hidden) return 'excluded-row'\n          return ''\n        }}\n        hideFooter={true}\n        initialState={{ sorting: { sortModel: [{ field: 'date', sort: 'desc' }] } }}\n        loading={isLoading}\n        onCellClick={handleCellClick}\n        onCellKeyDown={handleCellKeyDown}\n        rows={rows}\n        slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n        sx={{\n          '& .split-row': {\n            bgcolor: 'background.default',\n          },\n          '& .excluded-row': {\n            bgcolor: 'grey.50',\n            color: 'text.secondary',\n          },\n        }}\n      />\n    </Paper>\n  )\n}\n\nexport default observer(TransactionTable)\n"],"mappings":"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"}

package/dist/transactions/components/shared/getEmbeddedInstanceSlotByBeatTemplates/index.es.js

@@ -0,0 +1,25 @@
+import { buildChartData as l, buildDataSeries as o } from "../../../utils/Transactions/index.es.js";
+import { TinyBarChart as s } from "../../../../common/components/TinyBarChart/index.es.js";
+import { jsx as n } from "react/jsx-runtime";
+var c = { BILL_AMOUNT_NOT_STANDARD: "BillAmountNotStandard" }, T = (r, t) => {
+  if (t) if (t.template === c.BILL_AMOUNT_NOT_STANDARD) {
+    const a = t.data_series ? o(t.data_series) : [], e = l(a, t.payload?.merchant_name);
+    return {
+      instanceSlot: /* @__PURE__ */ n(s, {
+        color: (i) => i.palette.categories.billsUtilities,
+        data: e.slice(-3)
+      }),
+      dataSeries: a,
+      chartData: e,
+      callToAction: r.view_history
+    };
+  } else
+    return null;
+  return null;
+};
+export {
+  c as BeatTemplates,
+  T as getEmbeddedInstanceSlotByBeatTemplates
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/shared/getEmbeddedInstanceSlotByBeatTemplates/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/getEmbeddedInstanceSlotByBeatTemplates.tsx"],"sourcesContent":["import type { Theme } from '@mui/material/styles'\n\nimport { TinyBarChart } from '../../../common/components/TinyBarChart'\nimport type { CommonCopy } from '../../../core/types/localization/CommonCopy'\nimport { type Beat } from '../../../insights/types/CommonBeat'\n\nimport { buildChartData, buildDataSeries, type ChartDataProps } from '../../utils/Transactions'\n\nexport const BeatTemplates = {\n  BILL_AMOUNT_NOT_STANDARD: 'BillAmountNotStandard',\n}\n\nexport const getEmbeddedInstanceSlotByBeatTemplates = (copy: CommonCopy, beat?: Beat) => {\n  if (beat) {\n    switch (beat.template) {\n      case BeatTemplates.BILL_AMOUNT_NOT_STANDARD: {\n        const dataSeries = beat.data_series\n          ? (buildDataSeries(beat.data_series) as ChartDataProps[])\n          : []\n        const chartData = buildChartData(dataSeries, beat.payload?.merchant_name)\n\n        return {\n          instanceSlot: (\n            <TinyBarChart\n              color={(theme: Theme) => {\n                return theme.palette.categories.billsUtilities\n              }}\n              data={chartData.slice(-3)}\n            />\n          ),\n          dataSeries,\n          chartData,\n          callToAction: copy.view_history,\n        }\n      }\n      default: {\n        return null\n      }\n    }\n  }\n  return null\n}\n"],"mappings":";;;AAQA,IAAa,IAAgB,EAC3B,0BAA0B,wBAC5B,GAEa,IAAA,CAA0C,GAAkB,MAAgB;AACvF,MAAI,EACF,KAAQ,EAAK,aACN,EAAc,0BAA0B;AAC3C,UAAM,IAAa,EAAK,cACnB,EAAgB,EAAK,WAAW,IACjC,CAAC,GACC,IAAY,EAAe,GAAY,EAAK,SAAS,aAAa;AAExE,WAAO;AAAA,MACL,cACE,gBAAA,EAAC,GAAD;AAAA,QACE,OAAA,CAAQ,MACC,EAAM,QAAQ,WAAW;AAAA,QAElC,MAAM,EAAU,MAAM,EAAE;AAAA,MACzB,CAAA;AAAA,MAEH,YAAA;AAAA,MACA,WAAA;AAAA,MACA,cAAc,EAAK;AAAA,IACrB;AAAA,EACF;AAEE,WAAO;AAIb,SAAO;AACT"}

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

@@ -0,0 +1,68 @@
+import { buildDynamicCopy as S } from "../../../../core/utils/Localization/index.es.js";
+import { useEvent as g, useGlobalCopyStore as v } from "../../../../common/context/hooks/index.es.js";
+import { useAriaLive as h } from "../../../../common/hooks/useAriaLive/index.es.js";
+import { formatCurrency as x } from "../../../../core/utils/NumberFormatting/index.es.js";
+import { ON_CLICK_EVENTS as y } from "../../../constants/OnClickEvents/index.es.js";
+import E from "../SplitRow/index.es.js";
+import s from "react";
+import { observer as N } from "mobx-react-lite";
+import L from "@mui/material/Stack";
+import { Text as T } from "@mxenabled/mxui";
+import A from "@mui/material/Button";
+import { Cancel as D } from "@mxenabled/mx-icons";
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import p from "@mui/material/Box";
+var I = ({ onAddSplit: c, onCategoryChanged: _, onDeleteSplit: f, onUpdateAmount: u, splits: t, transaction: d }) => {
+  const { transactions: o } = v(), { onEvent: C } = g(), [n, e] = s.useState(""), { announce: i, ariaLive: b } = h();
+  return s.useEffect(() => {
+    if (t.length <= 1)
+      e(o.split_transaction_errors_min_splits), i(o.split_transaction_errors_min_splits);
+    else if (t[0].amount < 0) {
+      const a = S(o.split_transaction_errors_totals_must_equal_amount, x(d.amount, "0,0.00"));
+      e(a), i(a);
+    } else
+      e(""), i("");
+  }, [t]), /* @__PURE__ */ l(p, {
+    className: "mx-txn-split-manager",
+    children: [
+      b,
+      t.map((a, m) => /* @__PURE__ */ r(E, {
+        index: m,
+        onCategoryChanged: _,
+        onDeleteRow: f,
+        onUpdateAmount: u,
+        split: a
+      }, m)),
+      n && /* @__PURE__ */ l(L, {
+        bgcolor: "background.paper",
+        color: "error.main",
+        direction: "row",
+        gap: 8,
+        p: 16,
+        children: [/* @__PURE__ */ r("span", {
+          "aria-label": "error",
+          role: "img",
+          children: /* @__PURE__ */ r(D, { sx: { fontSize: 15 } })
+        }), /* @__PURE__ */ r(T, {
+          variant: "body2",
+          children: n
+        })]
+      }),
+      /* @__PURE__ */ r(p, {
+        p: 16,
+        children: /* @__PURE__ */ r(A, {
+          "aria-label": o.split_transaction_add_split_btn,
+          onClick: () => {
+            C(y.ON_TRANSACTION_SPLIT_ADD_CLICK), c();
+          },
+          children: o.split_transaction_add_split_btn
+        })
+      })
+    ]
+  });
+}, H = N(I);
+export {
+  H as default
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/transactions/components/splitmanager/SplitManager/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/transactions/components/splitmanager/SplitManager.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Cancel as CancelIcon } from '@mxenabled/mx-icons'\n\nimport { useEvent, useGlobalCopyStore } from '../../../common'\nimport type { Transaction } from '../../../core'\nimport { useAriaLive } from '../../../common/hooks/useAriaLive'\n\nimport SplitRow from './SplitRow'\n\nimport { ON_CLICK_EVENTS } from '../../constants/OnClickEvents'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\ninterface SplitManagerProps {\n  onAddSplit: () => void\n  onCategoryChanged: (index: number, categoryGuid: string) => void\n  onDeleteSplit: (index: number) => void\n  onUpdateAmount: (index: number, amount: number) => void\n  splits: Transaction[]\n  transaction: Transaction\n}\n\nconst SplitManager: React.FC<SplitManagerProps> = ({\n  onAddSplit,\n  onCategoryChanged,\n  onDeleteSplit,\n  onUpdateAmount,\n  splits,\n  transaction,\n}) => {\n  const { transactions: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n\n  const [error, setError] = React.useState('')\n  const { announce, ariaLive } = useAriaLive()\n\n  React.useEffect(() => {\n    if (splits.length <= 1) {\n      setError(copy.split_transaction_errors_min_splits)\n      announce(copy.split_transaction_errors_min_splits)\n    } else if (splits[0].amount < 0) {\n      const errorCopy = buildDynamicCopy(\n        copy.split_transaction_errors_totals_must_equal_amount,\n        formatCurrency(transaction.amount, '0,0.00'),\n      ) as string\n      setError(errorCopy)\n      announce(errorCopy)\n    } else {\n      setError('')\n      announce('')\n    }\n  }, [splits])\n\n  return (\n    <Box className=\"mx-txn-split-manager\">\n      {ariaLive}\n      {splits.map((split, index) => (\n        <SplitRow\n          index={index}\n          key={index}\n          onCategoryChanged={onCategoryChanged}\n          onDeleteRow={onDeleteSplit}\n          onUpdateAmount={onUpdateAmount}\n          split={split}\n        />\n      ))}\n      {error && (\n        <Stack bgcolor=\"background.paper\" color=\"error.main\" direction=\"row\" gap={8} p={16}>\n          {/* TODO: Move span with aria-label and role into @mxenabled/mx-icons */}\n          <span aria-label=\"error\" role=\"img\">\n            <CancelIcon sx={{ fontSize: 15 }} />\n          </span>\n          <Text variant=\"body2\">{error}</Text>\n        </Stack>\n      )}\n      <Box p={16}>\n        <Button\n          aria-label={copy.split_transaction_add_split_btn}\n          onClick={() => {\n            onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_SPLIT_ADD_CLICK)\n            onAddSplit()\n          }}\n        >\n          {copy.split_transaction_add_split_btn}\n        </Button>\n      </Box>\n    </Box>\n  )\n}\n\nexport default observer(SplitManager)\n"],"mappings":";;;;;;;;;;;;;;AA6BA,IAAM,IAAA,CAA6C,EACjD,YAAA,GACA,mBAAA,GACA,eAAA,GACA,gBAAA,GACA,QAAA,GACA,aAAA,EAAA,MACI;AACJ,QAAM,EAAE,cAAc,EAAA,IAAS,EAAmB,GAC5C,EAAE,SAAA,EAAA,IAAY,EAAS,GAEvB,CAAC,GAAO,CAAA,IAAY,EAAM,SAAS,EAAE,GACrC,EAAE,UAAA,GAAU,UAAA,EAAA,IAAa,EAAY;AAE3C,SAAA,EAAM,UAAA,MAAgB;AACpB,QAAI,EAAO,UAAU;AACnB,MAAA,EAAS,EAAK,mCAAmC,GACjD,EAAS,EAAK,mCAAmC;AAAA,aACxC,EAAO,CAAA,EAAG,SAAS,GAAG;AAC/B,YAAM,IAAY,EAChB,EAAK,mDACL,EAAe,EAAY,QAAQ,QAAQ,CAC7C;AACA,MAAA,EAAS,CAAS,GAClB,EAAS,CAAS;AAAA,IACpB;AACE,MAAA,EAAS,EAAE,GACX,EAAS,EAAE;AAAA,EAEf,GAAG,CAAC,CAAM,CAAC,GAGT,gBAAA,EAAC,GAAD;AAAA,IAAK,WAAU;AAAA,cAAf;AAAA,MACG;AAAA,MACA,EAAO,IAAA,CAAK,GAAO,MAClB,gBAAA,EAAC,GAAD;AAAA,QACS,OAAA;AAAA,QAEY,mBAAA;AAAA,QACnB,aAAa;AAAA,QACG,gBAAA;AAAA,QACT,OAAA;AAAA,MACR,GALM,CAKN,CACF;AAAA,MACA,KACC,gBAAA,EAAC,GAAD;AAAA,QAAO,SAAQ;AAAA,QAAmB,OAAM;AAAA,QAAa,WAAU;AAAA,QAAM,KAAK;AAAA,QAAG,GAAG;AAAA,kBAAhF,CAEE,gBAAA,EAAC,QAAD;AAAA,UAAM,cAAW;AAAA,UAAQ,MAAK;AAAA,oBAC5B,gBAAA,EAAC,GAAD,EAAY,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;AAAA,QAC/B,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,UAAM,SAAQ;AAAA,oBAAS;AAAA,QAAY,CAAA,CAC9B;AAAA;MAET,gBAAA,EAAC,GAAD;AAAA,QAAK,GAAG;AAAA,kBACN,gBAAA,EAAC,GAAD;AAAA,UACE,cAAY,EAAK;AAAA,UACjB,SAAA,MAAe;AACb,YAAA,EAAQ,EAAgB,8BAA8B,GACtD,EAAW;AAAA,UACb;AAAA,oBAEC,EAAK;AAAA,QACA,CAAA;AAAA,MACL,CAAA;AAAA,IACF;AAAA;AAET,GAEA,IAAe,EAAS,CAAY"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/transactions/components/splitmanager/SplitRow.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Grid from '@mui/material/Grid'\nimport IconButton from '@mui/material/IconButton'\nimport Stack from '@mui/material/Stack'\n\nimport { CategoryIcon, Text } from '@mxenabled/mxui'\nimport {\n  Cancel as CancelIcon,\n  ChevronRight as ChevronRightIcon,\n  Delete as DeleteOutlinedIcon,\n} from '@mxenabled/mx-icons'\n\nimport { CategorySelectorDrawer } from '../../../categories'\n\nimport { CurrencyInput, useGlobalCopyStore } from '../../../common'\nimport type { Transaction } from '../../../core'\n\nimport { useEvent } from '../../../common'\nimport { ON_CLICK_EVENTS } from '../../constants/OnClickEvents'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\n\ninterface SplitRowProps {\n  index: number\n  onCategoryChanged: (index: number, categoryGuid: string) => void\n  onDeleteRow: (index: number) => void\n  onUpdateAmount: (index: number, amount: number) => void\n  split: Transaction\n}\n\nconst SplitRow: React.FC<SplitRowProps> = ({\n  index,\n  onDeleteRow,\n  onCategoryChanged,\n  onUpdateAmount,\n  split,\n}) => {\n  const { onEvent } = useEvent()\n  const { transactions: copy } = useGlobalCopyStore()\n\n  const [amount, setAmount] = React.useState(`${split.amount}`)\n  const [categorySelectorOpen, setCategorySelectorOpen] = React.useState(false)\n\n  const isTopRow = index === 0\n\n  const handleChangeAmount = (value: string) => {\n    if (!isNaN(Number(value))) {\n      setAmount(value)\n      onUpdateAmount(index, Number(value))\n    }\n  }\n\n  return (\n    <Box bgcolor=\"background.paper\" className=\"mx-txn-split-manager-row\" pb={4} px={8}>\n      <Grid alignItems={isTopRow ? 'center' : 'start'} container={true}>\n        <Grid size={7}>\n          <Stack alignItems=\"start\">\n            <Button\n              endIcon={<ChevronRightIcon />}\n              onClick={() => setCategorySelectorOpen(true)}\n              startIcon={<CategoryIcon categoryGuid={split.top_level_category_guid} />}\n              sx={{ px: 12, py: 8 }}\n            >\n              {split.category}\n            </Button>\n            <Box>\n              {!split.category_guid && (\n                <Stack color=\"error.main\" direction=\"row\" gap={8} p={12}>\n                  <span aria-label=\"error\" role=\"img\">\n                    <CancelIcon sx={{ fontSize: 15 }} />\n                  </span>\n                  <Text variant=\"body2\">{copy.split_transaction_errors_select_category}</Text>\n                </Stack>\n              )}\n            </Box>\n          </Stack>\n        </Grid>\n        <Grid size={5}>\n          {isTopRow ? (\n            <div className=\"mx-txn-split-manager-row-top-container\">\n              <Text>{formatCurrency(split.amount, '0,0.00')}</Text>\n            </div>\n          ) : (\n            <Stack alignItems=\"start\">\n              <Stack alignItems=\"start\" direction=\"row\" gap={8}>\n                <CurrencyInput\n                  amount={amount}\n                  ariaLabel={copy.split_transaction_edit_split_amount}\n                  label={copy.split_transaction_edit_split_amount}\n                  minAmount={0.01}\n                  name=\"split-amount-input\"\n                  setAmount={handleChangeAmount}\n                  sx={{\n                    '.MuiOutlinedInput-input': { p: 12 },\n                  }}\n                  type=\"number\"\n                />\n                <IconButton\n                  aria-label={copy.split_transaction_delete_split_btn}\n                  color=\"secondary\"\n                  onClick={() => {\n                    onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_SPLIT_DELETE_CLICK)\n                    onDeleteRow(index)\n                  }}\n                  sx={{ w: 44, h: 44 }}\n                >\n                  <DeleteOutlinedIcon />\n                </IconButton>\n              </Stack>\n              {!amount && (\n                <Stack color=\"error.main\" direction=\"row\" gap={8} py={12}>\n                  <span aria-label=\"error\" role=\"img\">\n                    <CancelIcon sx={{ fontSize: 15 }} />\n                  </span>\n                  <Text variant=\"body2\">{copy.split_transaction_errors_enter_an_amount}</Text>\n                </Stack>\n              )}\n            </Stack>\n          )}\n        </Grid>\n      </Grid>\n\n      <CategorySelectorDrawer\n        initialSelected={split.category_guid}\n        onClose={() => setCategorySelectorOpen(false)}\n        onSelect={(guid: string) => {\n          onCategoryChanged(index, guid)\n          setCategorySelectorOpen(false)\n        }}\n        showDrawer={categorySelectorOpen}\n        title={copy.actions_select_a_category}\n      />\n    </Box>\n  )\n}\n\nexport default observer(SplitRow)\n"],"mappings":"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"}

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

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