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

package/dist/recurringtransactions/components/actions/PaymentScheduleAction/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/actions/PaymentScheduleAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport {\n  ANALYTICS_EVENTS,\n  DataRow,\n  Drawer,\n  useEvent,\n  useGlobalCopyStore,\n  useRecurringTransactionsStore,\n} from '../../../common'\nimport { type RepeatingTransaction, Frequency } from '../../../core'\n\nimport { getFrequencyLabel } from '../../../core/utils/RecurringTransactionsUtil'\n\nimport { PaymentSchedule } from '../PaymentSchedule'\n\ninterface FrequencyActionProps {\n  repeatingTransaction: RepeatingTransaction\n}\n\nexport const PaymentScheduleAction = observer(({ repeatingTransaction }: FrequencyActionProps) => {\n  const { recurring: copy } = useGlobalCopyStore()\n  const { updateRepeatingTransaction } = useRecurringTransactionsStore()\n\n  const { onEvent } = useEvent()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [frequency, setFrequency] = React.useState<Frequency>(repeatingTransaction.recurrence_type)\n  const [firstDay, setFirstDay] = React.useState(repeatingTransaction.recurrence_day)\n  const [secondDay, setSecondDay] = React.useState(repeatingTransaction.second_recurrence_day)\n\n  const handleSave = async () => {\n    await updateRepeatingTransaction({\n      ...repeatingTransaction,\n      recurrence_type: frequency,\n      recurrence_day: firstDay,\n      second_recurrence_day: secondDay,\n    })\n\n    setIsOpen(false)\n  }\n\n  const handleOpen = () => {\n    setIsOpen(true)\n    onEvent(ANALYTICS_EVENTS.RECURRING_TRANSACTIONS_DETAILS_CLICK_PAYMENT_SCHEDULE)\n  }\n\n  return (\n    <>\n      <DataRow\n        iconName=\"sync\"\n        label={copy.activity_schedule}\n        onClick={handleOpen}\n        showChevron={false}\n        value={`${getFrequencyLabel(copy, repeatingTransaction, true)}`}\n      />\n      <Drawer\n        ariaLabelClose={copy.close_drawer_aria}\n        isOpen={isOpen}\n        onClose={() => setIsOpen(false)}\n        onPrimaryAction={handleSave}\n        title={copy.payment_schedule}\n      >\n        <PaymentSchedule\n          firstDay={firstDay}\n          frequency={frequency}\n          onFirstDayChange={setFirstDay}\n          onFrequencyChange={setFrequency}\n          onSecondDayChange={setSecondDay}\n          secondDay={secondDay}\n        />\n      </Drawer>\n    </>\n  )\n})\n"],"mappings":";;;;;;;;;AAqBA,IAAa,IAAwB,EAAA,CAAU,EAAE,sBAAA,EAAA,MAAiD;AAChG,QAAM,EAAE,WAAW,EAAA,IAAS,EAAmB,GACzC,EAAE,4BAAA,EAAA,IAA+B,EAA8B,GAE/D,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAK,GAC1C,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAoB,EAAqB,eAAe,GAC1F,CAAC,GAAU,CAAA,IAAe,EAAM,SAAS,EAAqB,cAAc,GAC5E,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAqB,qBAAqB,GAErF,IAAa,YAAY;AAC7B,UAAM,EAA2B;AAAA,MAC/B,GAAG;AAAA,MACH,iBAAiB;AAAA,MACjB,gBAAgB;AAAA,MAChB,uBAAuB;AAAA,IACzB,CAAC,GAED,EAAU,EAAK;AAAA,EACjB,GAEM,IAAA,MAAmB;AACvB,IAAA,EAAU,EAAI,GACd,EAAQ,EAAiB,qDAAqD;AAAA,EAChF;AAEA,SACE,gBAAA,EAAA,GAAA,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,IACE,UAAS;AAAA,IACT,OAAO,EAAK;AAAA,IACZ,SAAS;AAAA,IACT,aAAa;AAAA,IACb,OAAO,GAAG,EAAkB,GAAM,GAAsB,EAAI,CAAA;AAAA,EAC7D,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,IACE,gBAAgB,EAAK;AAAA,IACb,QAAA;AAAA,IACR,SAAA,MAAe,EAAU,EAAK;AAAA,IAC9B,iBAAiB;AAAA,IACjB,OAAO,EAAK;AAAA,cAEZ,gBAAA,EAAC,GAAD;AAAA,MACY,UAAA;AAAA,MACC,WAAA;AAAA,MACX,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACR,WAAA;AAAA,IACZ,CAAA;AAAA,EACK,CAAA,CACR,EAAA,CAAA;AAEN,CAAC"}

package/dist/recurringtransactions/components/micro/MerchantLogosRow/index.es.js

@@ -0,0 +1,19 @@
+import "react";
+import m from "@mui/material/Stack";
+import { MerchantLogo as c } from "@mxenabled/mxui";
+import { jsx as t } from "react/jsx-runtime";
+var G = ({ upcomingRecurrences: i, maxLogos: r = 3 }) => /* @__PURE__ */ t(m, {
+  sx: {
+    flexDirection: "row",
+    gap: 4
+  },
+  children: i?.slice(0, r).map((o, a) => /* @__PURE__ */ t(c, {
+    categoryGuid: o.categoryGuid || "",
+    merchantGuid: o.merchantGuid || ""
+  }, `${o.categoryGuid}-${o.merchantGuid}-${a}`))
+});
+export {
+  G as MerchantLogosRow
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/micro/MerchantLogosRow/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/micro/MerchantLogosRow.tsx"],"sourcesContent":["import React from 'react'\nimport Stack from '@mui/material/Stack'\nimport { MerchantLogo } from '@mxenabled/mxui'\nimport { Recurrence } from '../../../core'\n\ninterface MerchantLogosRowProps {\n  upcomingRecurrences: Recurrence[]\n  maxLogos?: number\n}\n\nexport const MerchantLogosRow: React.FC<MerchantLogosRowProps> = ({\n  upcomingRecurrences,\n  maxLogos = 3,\n}) => {\n  return (\n    <Stack sx={{ flexDirection: 'row', gap: 4 }}>\n      {upcomingRecurrences?.slice(0, maxLogos).map((recurrence, index) => (\n        <MerchantLogo\n          categoryGuid={recurrence.categoryGuid || ''}\n          key={`${recurrence.categoryGuid}-${recurrence.merchantGuid}-${index}`}\n          merchantGuid={recurrence.merchantGuid || ''}\n        />\n      ))}\n    </Stack>\n  )\n}\n"],"mappings":";;;;AAUA,IAAa,IAAA,CAAqD,EAChE,qBAAA,GACA,UAAA,IAAW,EAAA,MAGT,gBAAA,EAAC,GAAD;AAAA,EAAO,IAAI;AAAA,IAAE,eAAe;AAAA,IAAO,KAAK;AAAA,EAAE;AAAA,YACvC,GAAqB,MAAM,GAAG,CAAQ,EAAE,IAAA,CAAK,GAAY,MACxD,gBAAA,EAAC,GAAD;AAAA,IACE,cAAc,EAAW,gBAAgB;AAAA,IAEzC,cAAc,EAAW,gBAAgB;AAAA,EAC1C,GAFM,GAAG,EAAW,YAAA,IAAgB,EAAW,YAAA,IAAgB,CAAA,EAE/D,CACF;AACI,CAAA"}

package/dist/recurringtransactions/components/micro/OverlappingMerchantLogos/index.es.js

@@ -0,0 +1,33 @@
+import "react";
+import { MerchantLogo as l } from "@mxenabled/mxui";
+import { jsx as i } from "react/jsx-runtime";
+import a from "@mui/material/Box";
+var c = ({ upcomingRecurrences: e, logoSize: r = 32, maxLogos: m = 3 }) => {
+  const n = (o) => o * (r / 2);
+  return /* @__PURE__ */ i(a, {
+    sx: {
+      position: "relative",
+      width: 64
+    },
+    children: e.map((o, t) => t < m ? /* @__PURE__ */ i(a, {
+      sx: {
+        borderRadius: "4px",
+        left: n(t),
+        outlineColor: "common.white",
+        outlineStyle: "solid",
+        outlineWidth: 2,
+        position: "absolute"
+      },
+      children: /* @__PURE__ */ i(l, {
+        categoryGuid: o.categoryGuid || "",
+        merchantGuid: o.merchantGuid || "",
+        size: r
+      })
+    }, `${o.categoryGuid}-${o.merchantGuid}-${t}`) : null)
+  });
+};
+export {
+  c as OverlappingMerchantLogos
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/micro/OverlappingMerchantLogos/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/micro/OverlappingMerchantLogos.tsx"],"sourcesContent":["import React from 'react'\nimport Box from '@mui/material/Box'\nimport { MerchantLogo } from '@mxenabled/mxui'\nimport { Recurrence } from '../../../core'\n\ninterface OverlappingMerchantLogosProps {\n  upcomingRecurrences: Recurrence[]\n  logoSize?: number\n  maxLogos?: number\n}\n\nexport const OverlappingMerchantLogos: React.FC<OverlappingMerchantLogosProps> = ({\n  upcomingRecurrences,\n  logoSize = 32,\n  maxLogos = 3,\n}) => {\n  const ICON_OVERLAP_X = (i: number) => i * (logoSize / 2)\n\n  return (\n    <Box\n      sx={{\n        position: 'relative',\n        width: 64,\n      }}\n    >\n      {upcomingRecurrences.map((recurrence, index) => {\n        if (index < maxLogos) {\n          return (\n            <Box\n              key={`${recurrence.categoryGuid}-${recurrence.merchantGuid}-${index}`}\n              sx={{\n                borderRadius: '4px',\n                left: ICON_OVERLAP_X(index),\n                outlineColor: 'common.white',\n                outlineStyle: 'solid',\n                outlineWidth: 2,\n                position: 'absolute',\n              }}\n            >\n              <MerchantLogo\n                categoryGuid={recurrence.categoryGuid || ''}\n                merchantGuid={recurrence.merchantGuid || ''}\n                size={logoSize}\n              />\n            </Box>\n          )\n        }\n        return null\n      })}\n    </Box>\n  )\n}\n"],"mappings":";;;;AAWA,IAAa,IAAA,CAAqE,EAChF,qBAAA,GACA,UAAA,IAAW,IACX,UAAA,IAAW,EAAA,MACP;AACJ,QAAM,IAAA,CAAkB,MAAc,KAAK,IAAW;AAEtD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,UAAU;AAAA,MACV,OAAO;AAAA,IACT;AAAA,cAEC,EAAoB,IAAA,CAAK,GAAY,MAChC,IAAQ,IAER,gBAAA,EAAC,GAAD;AAAA,MAEE,IAAI;AAAA,QACF,cAAc;AAAA,QACd,MAAM,EAAe,CAAK;AAAA,QAC1B,cAAc;AAAA,QACd,cAAc;AAAA,QACd,cAAc;AAAA,QACd,UAAU;AAAA,MACZ;AAAA,gBAEA,gBAAA,EAAC,GAAD;AAAA,QACE,cAAc,EAAW,gBAAgB;AAAA,QACzC,cAAc,EAAW,gBAAgB;AAAA,QACzC,MAAM;AAAA,MACP,CAAA;AAAA,IACE,GAfE,GAAG,EAAW,YAAA,IAAgB,EAAW,YAAA,IAAgB,CAAA,EAe3D,IAGF,IACR;AAAA,EACE,CAAA;AAET"}

package/dist/recurringtransactions/components/micro/RecurrenceLegend/index.es.js

@@ -0,0 +1,37 @@
+import { formatCurrency as p } from "../../../../core/utils/NumberFormatting/index.es.js";
+import i from "@mui/material/Stack";
+import { Text as t } from "@mxenabled/mxui";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import x from "@mui/material/Box";
+var g = ({ amount: e, bgcolor: n, isLargeScreen: c, isSmallScreen: a, label: m }) => /* @__PURE__ */ o(i, {
+  sx: {
+    alignItems: "center",
+    flexDirection: "row",
+    gap: 8
+  },
+  children: [/* @__PURE__ */ r(x, { sx: {
+    borderRadius: "2px",
+    bgcolor: n,
+    height: 8,
+    width: 8
+  } }), /* @__PURE__ */ o(i, {
+    sx: {
+      alignItems: "center",
+      flexDirection: "row",
+      gap: 2
+    },
+    children: [!a && /* @__PURE__ */ r(t, {
+      bold: !0,
+      variant: "caption",
+      children: p(e, e === 0 || !c ? "0,0" : "0,0.00")
+    }), /* @__PURE__ */ r(t, {
+      variant: "caption",
+      children: m
+    })]
+  })]
+});
+export {
+  g as RecurrenceLegend
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/micro/RecurrenceLegend/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/micro/RecurrenceLegend.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { Text } from '@mxenabled/mxui'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\ntype RecurringSettingsProps = {\n  amount: number\n  bgcolor: string\n  isLargeScreen: boolean\n  isSmallScreen: boolean\n  label: string\n}\n\nexport const RecurrenceLegend = ({\n  amount,\n  bgcolor,\n  isLargeScreen,\n  isSmallScreen,\n  label,\n}: RecurringSettingsProps) => (\n  <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n    <Box\n      sx={{\n        borderRadius: '2px',\n        bgcolor,\n        height: 8,\n        width: 8,\n      }}\n    />\n\n    <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 2 }}>\n      {!isSmallScreen && (\n        <Text bold={true} variant=\"caption\">\n          {formatCurrency(amount, amount === 0 || !isLargeScreen ? '0,0' : '0,0.00')}\n        </Text>\n      )}\n      <Text variant=\"caption\">{label}</Text>\n    </Stack>\n  </Stack>\n)\n"],"mappings":";;;;;AAYA,IAAa,IAAA,CAAoB,EAC/B,QAAA,GACA,SAAA,GACA,eAAA,GACA,eAAA,GACA,OAAA,EAAA,MAEA,gBAAA,EAAC,GAAD;AAAA,EAAO,IAAI;AAAA,IAAE,YAAY;AAAA,IAAU,eAAe;AAAA,IAAO,KAAK;AAAA,EAAE;AAAA,YAAhE,CACE,gBAAA,EAAC,GAAD,EACE,IAAI;AAAA,IACF,cAAc;AAAA,IACd,SAAA;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,EACT,EACD,CAAA,GAED,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,KAAK;AAAA,IAAE;AAAA,cAAhE,CACG,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,MAAM,MAAM;AAAA,MAAM,SAAQ;AAAA,gBACvB,EAAe,GAAQ,MAAW,KAAK,CAAC,IAAgB,QAAQ,QAAQ;AAAA,IACrE,CAAA,GAER,gBAAA,EAAC,GAAD;AAAA,MAAM,SAAQ;AAAA,gBAAW;AAAA,IAAY,CAAA,CAChC;AAAA,IACF"}

package/dist/recurringtransactions/components/recurrencecalendar/Legend/index.es.js

@@ -0,0 +1,48 @@
+import { useGlobalCopyStore as a } from "../../../../common/context/hooks/index.es.js";
+import { IncomeBadge as c, MissedBadge as m, PaidBadge as l, UpcomingExpenseBadge as p } from "../../RecurrenceBadges/index.es.js";
+import { observer as s } from "mobx-react-lite";
+import i from "@mui/material/Stack";
+import { Text as d } from "@mxenabled/mxui";
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
+var o = ({ icon: e, label: t }) => /* @__PURE__ */ n(i, {
+  alignItems: "center",
+  flexDirection: "row",
+  sx: { gap: 6 },
+  children: [/* @__PURE__ */ r(e, {}), /* @__PURE__ */ r(d, {
+    variant: "caption",
+    children: t
+  })]
+}), v = s(() => {
+  const { recurring: e } = a();
+  return /* @__PURE__ */ n(i, {
+    alignItems: "center",
+    "aria-hidden": !0,
+    flexDirection: "row",
+    gap: 16,
+    justifyContent: "center",
+    mt: 12,
+    children: [
+      /* @__PURE__ */ r(o, {
+        icon: p,
+        label: e.expense
+      }),
+      /* @__PURE__ */ r(o, {
+        icon: c,
+        label: e.income
+      }),
+      /* @__PURE__ */ r(o, {
+        icon: m,
+        label: e.missed
+      }),
+      /* @__PURE__ */ r(o, {
+        icon: l,
+        label: e.paid
+      })
+    ]
+  });
+});
+export {
+  v as Legend
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/recurrencecalendar/Legend/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/recurrencecalendar/Legend.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\nimport { IncomeBadge, MissedBadge, PaidBadge, UpcomingExpenseBadge } from '../RecurrenceBadges'\nimport { useGlobalCopyStore } from '../../../common'\n\ninterface SymbolProps {\n  icon: any\n  label: string\n}\n\nconst Symbol = ({ icon: Icon, label }: SymbolProps) => (\n  <Stack alignItems=\"center\" flexDirection=\"row\" sx={{ gap: 6 }}>\n    <Icon />\n    <Text variant=\"caption\">{label}</Text>\n  </Stack>\n)\n\nexport const Legend = observer(() => {\n  const { recurring: copy } = useGlobalCopyStore()\n\n  return (\n    <Stack\n      alignItems=\"center\"\n      aria-hidden={true}\n      flexDirection=\"row\"\n      gap={16}\n      justifyContent=\"center\"\n      mt={12}\n    >\n      <Symbol icon={UpcomingExpenseBadge} label={copy.expense} />\n      <Symbol icon={IncomeBadge} label={copy.income} />\n      <Symbol icon={MissedBadge} label={copy.missed} />\n      <Symbol icon={PaidBadge} label={copy.paid} />\n    </Stack>\n  )\n})\n"],"mappings":";;;;;;AAaA,IAAM,IAAA,CAAU,EAAE,MAAM,GAAM,OAAA,EAAA,MAC5B,gBAAA,EAAC,GAAD;AAAA,EAAO,YAAW;AAAA,EAAS,eAAc;AAAA,EAAM,IAAI,EAAE,KAAK,EAAE;AAAA,YAA5D,CACE,gBAAA,EAAC,GAAD,CAAO,CAAA,GACP,gBAAA,EAAC,GAAD;AAAA,IAAM,SAAQ;AAAA,cAAW;AAAA,EAAY,CAAA,CAChC;IAGI,IAAS,EAAA,MAAe;AACnC,QAAM,EAAE,WAAW,EAAA,IAAS,EAAmB;AAE/C,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAW;AAAA,IACX,eAAa;AAAA,IACb,eAAc;AAAA,IACd,KAAK;AAAA,IACL,gBAAe;AAAA,IACf,IAAI;AAAA,cANN;AAAA,MAQE,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAM;AAAA,QAAsB,OAAO,EAAK;AAAA,MAAU,CAAA;AAAA,MAC1D,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAM;AAAA,QAAa,OAAO,EAAK;AAAA,MAAS,CAAA;AAAA,MAChD,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAM;AAAA,QAAa,OAAO,EAAK;AAAA,MAAS,CAAA;AAAA,MAChD,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAM;AAAA,QAAW,OAAO,EAAK;AAAA,MAAO,CAAA;AAAA,IACvC;AAAA;AAEX,CAAC"}

package/dist/recurringtransactions/components/recurrencecalendar/RecurrenceCalendar/index.es.js

@@ -0,0 +1,111 @@
+import { LOCALES as t, getLocale as g } from "../../../../core/utils/Localization/index.es.js";
+import { useEvent as D, useGlobalCopyStore as b, useRecurringTransactionsStore as A } from "../../../../common/context/hooks/index.es.js";
+import { ANALYTICS_EVENTS as M } from "../../../../common/constants/Analytics/index.es.js";
+import "../../../../common/constants/Sizes/index.es.js";
+import { RecurrenceDay as S } from "../RecurrenceDay/index.es.js";
+import { Legend as R } from "../Legend/index.es.js";
+import E from "react";
+import { observer as T } from "mobx-react-lite";
+import L from "@mui/material/Stack";
+import { Text as v } from "@mxenabled/mxui";
+import { endOfMonth as x } from "date-fns/endOfMonth";
+import { startOfMonth as l } from "date-fns/startOfMonth";
+import { jsx as o, jsxs as H } from "react/jsx-runtime";
+import { useTheme as _ } from "@mui/material/styles";
+import { AdapterDateFns as k } from "@mui/x-date-pickers/AdapterDateFnsV3";
+import { DateCalendar as w } from "@mui/x-date-pickers/DateCalendar";
+import { LocalizationProvider as F } from "@mui/x-date-pickers/LocalizationProvider";
+import { getWeeksInMonth as c } from "date-fns/getWeeksInMonth";
+import { enCA as I } from "date-fns/locale/en-CA";
+import { enUS as d } from "date-fns/locale/en-US";
+import { es as N } from "date-fns/locale/es";
+import { fr as O } from "date-fns/locale/fr";
+import { frCA as z } from "date-fns/locale/fr-CA";
+var p = 58, P = () => {
+  const e = g();
+  return {
+    [t.EN_US]: d,
+    [t.EN_CA]: I,
+    [t.FR]: O,
+    [t.FR_CA]: z,
+    [t.ES]: N
+  }[e] || d;
+}, ce = T(() => {
+  const e = _(), { onEvent: f } = D(), { recurring: u } = b(), { selectedDay: a, setDateRange: y } = A(), [n, h] = E.useState(c(/* @__PURE__ */ new Date()) * 44 + p), C = (r) => {
+    h(c(r) * 44 + p), y({
+      start: l(r),
+      end: x(r)
+    }), i(r), f(M.RECURRING_TRANSACTIONS_CLICK_CALENDAR_RIGHT);
+  }, i = (r) => {
+    r && requestAnimationFrame(() => {
+      const s = document.getElementById("recurrence-list");
+      s?.setAttribute("tabindex", "-1"), s?.focus();
+    });
+  }, m = /* @__PURE__ */ o(w, {
+    minDate: l(/* @__PURE__ */ new Date()),
+    onChange: i,
+    onMonthChange: C,
+    showDaysOutsideCurrentMonth: !0,
+    slots: { day: S },
+    sx: {
+      "& .MuiPickersArrowSwitcher-button": {
+        color: "primary.main",
+        "&:disabled": { color: "action.disabled" }
+      },
+      "& .MuiButtonBase-root.MuiPickersDay-root": {
+        borderRadius: "4px",
+        "&:focus, &:hover": { borderRadius: "4px" }
+      },
+      "& .MuiPickersCalendarHeader-root": {
+        mt: 0,
+        pl: 16,
+        pr: 8
+      },
+      "& .MuiPickersCalendarHeader-label": {
+        fontFamily: e.typography.body1.fontFamily,
+        fontSize: e.typography.body1.fontSize,
+        fontWeight: 600
+      },
+      "& .MuiDayCalendar-slideTransition": { minHeight: n },
+      "&.MuiDateCalendar-root": { minHeight: n + 44 },
+      "& .MuiButtonBase-root, .MuiDayCalendar-weekDayLabel": {
+        height: 44,
+        width: 44,
+        margin: 0
+      },
+      "& .MuiDayCalendar-weekDayLabel": {
+        fontFamily: e.typography.h3.fontFamily,
+        fontSize: e.typography.body2.fontSize
+      },
+      "& .MuiPickersDay-dayOutsideMonth": { color: "text.secondary" },
+      textTransform: "capitalize"
+    },
+    value: a,
+    views: ["day"]
+  });
+  return /* @__PURE__ */ o(L, {
+    "aria-labelledby": "calendar-label",
+    justifyContent: "center",
+    role: "group",
+    children: /* @__PURE__ */ H(F, {
+      adapterLocale: P(),
+      dateAdapter: k,
+      children: [
+        a && m,
+        !a && m,
+        /* @__PURE__ */ o(v, {
+          id: "calendar-label",
+          sx: { alignSelf: "center" },
+          variant: "body2",
+          children: u.calendar_tooltip
+        }),
+        /* @__PURE__ */ o(R, {})
+      ]
+    })
+  });
+});
+export {
+  ce as RecurrenceCalendar
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/recurrencecalendar/RecurrenceCalendar/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/recurrencecalendar/RecurrenceCalendar.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { getWeeksInMonth } from 'date-fns/getWeeksInMonth'\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { Locale } from 'date-fns'\nimport { enCA } from 'date-fns/locale/en-CA'\nimport { enUS } from 'date-fns/locale/en-US'\nimport { es } from 'date-fns/locale/es'\nimport { fr } from 'date-fns/locale/fr'\nimport { frCA } from 'date-fns/locale/fr-CA'\n\nimport { Text } from '@mxenabled/mxui'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV3'\nimport { DateCalendar } from '@mui/x-date-pickers/DateCalendar'\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'\n\nimport {\n  ANALYTICS_EVENTS,\n  TOUCH_TARGET,\n  useEvent,\n  useRecurringTransactionsStore,\n  useGlobalCopyStore,\n} from '../../../common'\nimport { getLocale, LOCALES } from '../../../core'\n\nimport { RecurrenceDay } from './RecurrenceDay'\nimport { Legend } from './Legend'\n\nconst HEADER_HEIGHT = 58\n\nconst getDateFnsLocale = () => {\n  const locale = getLocale()\n  const localeMap: Record<string, Locale> = {\n    [LOCALES.EN_US]: enUS,\n    [LOCALES.EN_CA]: enCA,\n    [LOCALES.FR]: fr,\n    [LOCALES.FR_CA]: frCA,\n    [LOCALES.ES]: es,\n  }\n  return localeMap[locale] || enUS\n}\n\nexport const RecurrenceCalendar = observer(() => {\n  const theme = useTheme()\n  const { onEvent } = useEvent()\n  const { recurring: copy } = useGlobalCopyStore()\n  const { selectedDay, setDateRange } = useRecurringTransactionsStore()\n  const [calendarHeight, setCalendarHeight] = React.useState(\n    getWeeksInMonth(new Date()) * TOUCH_TARGET + HEADER_HEIGHT,\n  )\n\n  const handleMonthChange = (date: Date) => {\n    setCalendarHeight(getWeeksInMonth(date) * TOUCH_TARGET + HEADER_HEIGHT)\n    setDateRange({\n      start: startOfMonth(date),\n      end: endOfMonth(date),\n    })\n    handleDateChange(date)\n    onEvent(ANALYTICS_EVENTS.RECURRING_TRANSACTIONS_CLICK_CALENDAR_RIGHT)\n  }\n\n  const handleDateChange = (date: Date | null) => {\n    if (!date) return\n\n    requestAnimationFrame(() => {\n      const recurrenceList = document.getElementById('recurrence-list')\n      recurrenceList?.setAttribute('tabindex', '-1')\n      recurrenceList?.focus()\n    })\n  }\n\n  const calendar = (\n    <DateCalendar\n      minDate={startOfMonth(new Date())}\n      onChange={handleDateChange}\n      onMonthChange={handleMonthChange}\n      showDaysOutsideCurrentMonth={true}\n      slots={{\n        day: RecurrenceDay,\n      }}\n      sx={{\n        '& .MuiPickersArrowSwitcher-button': {\n          color: 'primary.main',\n          '&:disabled': {\n            color: 'action.disabled',\n          },\n        },\n        '& .MuiButtonBase-root.MuiPickersDay-root': {\n          borderRadius: '4px',\n          '&:focus, &:hover': {\n            borderRadius: '4px',\n          },\n        },\n        '& .MuiPickersCalendarHeader-root': {\n          mt: 0,\n          pl: 16,\n          pr: 8,\n        },\n        '& .MuiPickersCalendarHeader-label': {\n          fontFamily: theme.typography.body1.fontFamily,\n          fontSize: theme.typography.body1.fontSize,\n          fontWeight: 600,\n        },\n        '& .MuiDayCalendar-slideTransition': {\n          minHeight: calendarHeight,\n        },\n        '&.MuiDateCalendar-root': {\n          minHeight: calendarHeight + TOUCH_TARGET,\n        },\n        '& .MuiButtonBase-root, .MuiDayCalendar-weekDayLabel': {\n          height: TOUCH_TARGET,\n          width: TOUCH_TARGET,\n          margin: 0,\n        },\n        '& .MuiDayCalendar-weekDayLabel': {\n          fontFamily: theme.typography.h3.fontFamily,\n          fontSize: theme.typography.body2.fontSize,\n        },\n        '& .MuiPickersDay-dayOutsideMonth': {\n          color: 'text.secondary',\n        },\n        textTransform: 'capitalize',\n      }}\n      value={selectedDay}\n      views={['day']}\n    />\n  )\n\n  return (\n    <Stack aria-labelledby=\"calendar-label\" justifyContent=\"center\" role=\"group\">\n      <LocalizationProvider adapterLocale={getDateFnsLocale()} dateAdapter={AdapterDateFns}>\n        {/*NOTE: This seems odd, but because the DateCalendar cannot go from a controlled\n         /*      calendar to an un-controlled calendar, we have to create 2 different instances\n         /*      when there a selectedDay and when selectedDay is undefined */}\n        {selectedDay && calendar}\n        {!selectedDay && calendar}\n\n        <Text id=\"calendar-label\" sx={{ alignSelf: 'center' }} variant=\"body2\">\n          {copy.calendar_tooltip}\n        </Text>\n        <Legend />\n      </LocalizationProvider>\n    </Stack>\n  )\n})\n"],"mappings":"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"}

package/dist/recurringtransactions/components/recurrencecalendar/RecurrenceDay/index.es.js

@@ -0,0 +1,48 @@
+import { DATE_FORMATS_INTL as y, formatDate as D } from "../../../../core/constants/DateFormats/index.es.js";
+import { useGlobalCopyStore as B, useGlobalUiStore as M, useRecurringTransactionsStore as O } from "../../../../common/context/hooks/index.es.js";
+import { RecurrenceStatus as p, RecurrenceType as c } from "../../../../core/types/RepeatingTransaction/index.es.js";
+import { IncomeBadge as h, MissedBadge as A, PaidBadge as I, UpcomingExpenseBadge as S } from "../../RecurrenceBadges/index.es.js";
+import T from "react";
+import { observer as P } from "mobx-react-lite";
+import { Fragment as _, jsx as o, jsxs as E } from "react/jsx-runtime";
+import { isSameDay as G } from "date-fns/isSameDay";
+import U from "@mui/material/Badge";
+import { PickersDay as Y } from "@mui/x-date-pickers/PickersDay";
+var W = P(({ day: r, outsideCurrentMonth: u, ...d }) => {
+  const { recurring: s } = B(), { selectedAccountGuids: l } = M(), { recurrences: f, setSelectedDay: x } = O(), t = T.useMemo(() => f.filter((e) => l.includes(e.accountGuid)), [l, f]).filter((e) => G(e.occurredOnDate || e.expectedDate, r)), i = t.some((e) => e.type !== c.Income && e.status === p.Upcoming), a = t.some((e) => e.type !== c.Income && e.status === p.Missed), n = t.some((e) => e.type !== c.Income && e.status === p.Paid), m = t.some((e) => e.type === c.Income), R = (i ? 1 : 0) + (a ? 1 : 0) + (n ? 1 : 0) + (m ? 1 : 0), g = [
+    n && s.paid,
+    a && s.missed,
+    i && s.upcoming,
+    m && s.income
+  ].filter(Boolean), b = g.length > 0 ? `${D(r, y.MONTH_DAY_YEAR)}, ${g.join(", ")}` : D(r, y.MONTH_DAY_YEAR);
+  return /* @__PURE__ */ o(U, {
+    badgeContent: t.length > 0 && /* @__PURE__ */ E(_, { children: [
+      a && /* @__PURE__ */ o(A, { isOffset: !0 }),
+      n && /* @__PURE__ */ o(I, { isOffset: !0 }),
+      i && /* @__PURE__ */ o(S, { isOffset: !0 }),
+      m && /* @__PURE__ */ o(h, { isOffset: !0 })
+    ] }),
+    overlap: "circular",
+    sx: { "& .MuiBadge-badge": {
+      padding: 0,
+      marginRight: `${(R - 1) * 6 + 1}px`,
+      flexWrap: "nowrap"
+    } },
+    children: /* @__PURE__ */ o(Y, {
+      "aria-label": b,
+      day: r,
+      onClick: () => x(r),
+      outsideCurrentMonth: u,
+      sx: { "&.MuiPickersDay-root": {
+        ...u && { color: "text.disabled" },
+        ...d.today && { color: "primary.main" }
+      } },
+      ...d
+    })
+  });
+});
+export {
+  W as RecurrenceDay
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/recurrencecalendar/RecurrenceDay/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/recurringtransactions/components/recurrencecalendar/RecurrenceDay.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { isSameDay } from 'date-fns/isSameDay'\n\nimport Badge from '@mui/material/Badge'\nimport { PickersDay, PickersDayProps } from '@mui/x-date-pickers/PickersDay'\n\nimport {\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useRecurringTransactionsStore,\n} from '../../../common'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\nimport { RecurrenceStatus, RecurrenceType } from '../../../core'\n\nimport { IncomeBadge, MissedBadge, PaidBadge, UpcomingExpenseBadge } from '../RecurrenceBadges'\n\nexport const RecurrenceDay = observer(\n  ({ day, outsideCurrentMonth, ...other }: PickersDayProps<Date>) => {\n    const { recurring: copy } = useGlobalCopyStore()\n    const { selectedAccountGuids } = useGlobalUiStore()\n    const { recurrences, setSelectedDay } = useRecurringTransactionsStore()\n\n    const filteredRecurrences = React.useMemo(\n      () =>\n        recurrences.filter((recurrence) => selectedAccountGuids.includes(recurrence.accountGuid)),\n      [selectedAccountGuids, recurrences],\n    )\n\n    const dayRecurrences = filteredRecurrences.filter((a) =>\n      isSameDay(a.occurredOnDate || a.expectedDate, day),\n    )\n    const hasUpcoming = dayRecurrences.some(\n      (a) => a.type !== RecurrenceType.Income && a.status === RecurrenceStatus.Upcoming,\n    )\n    const hasMissed = dayRecurrences.some(\n      (a) => a.type !== RecurrenceType.Income && a.status === RecurrenceStatus.Missed,\n    )\n    const hasPaid = dayRecurrences.some(\n      (a) => a.type !== RecurrenceType.Income && a.status === RecurrenceStatus.Paid,\n    )\n    const hasIncome = dayRecurrences.some((a) => a.type === RecurrenceType.Income)\n\n    const totalBadges =\n      (hasUpcoming ? 1 : 0) + (hasMissed ? 1 : 0) + (hasPaid ? 1 : 0) + (hasIncome ? 1 : 0)\n\n    const statusParts = [\n      hasPaid && copy.paid,\n      hasMissed && copy.missed,\n      hasUpcoming && copy.upcoming,\n      hasIncome && copy.income,\n    ].filter(Boolean) as string[]\n\n    const ariaLabel =\n      statusParts.length > 0\n        ? `${formatDate(day, DATE_FORMATS_INTL.MONTH_DAY_YEAR)}, ${statusParts.join(', ')}`\n        : formatDate(day, DATE_FORMATS_INTL.MONTH_DAY_YEAR)\n\n    return (\n      <Badge\n        badgeContent={\n          dayRecurrences.length > 0 && (\n            <>\n              {hasMissed && <MissedBadge isOffset={true} />}\n              {hasPaid && <PaidBadge isOffset={true} />}\n              {hasUpcoming && <UpcomingExpenseBadge isOffset={true} />}\n              {hasIncome && <IncomeBadge isOffset={true} />}\n            </>\n          )\n        }\n        overlap=\"circular\"\n        sx={{\n          '& .MuiBadge-badge': {\n            padding: 0,\n            marginRight: `${(totalBadges - 1) * 6 + 1}px`,\n            flexWrap: 'nowrap',\n          },\n        }}\n      >\n        <PickersDay\n          aria-label={ariaLabel}\n          day={day}\n          onClick={() => setSelectedDay(day)}\n          outsideCurrentMonth={outsideCurrentMonth}\n          sx={{\n            '&.MuiPickersDay-root': {\n              ...(outsideCurrentMonth && {\n                color: 'text.disabled',\n              }),\n              ...(other.today && {\n                color: 'primary.main',\n              }),\n            },\n          }}\n          {...other}\n        />\n      </Badge>\n    )\n  },\n)\n"],"mappings":";;;;;;;;;;AAiBA,IAAa,IAAgB,EAAA,CAC1B,EAAE,KAAA,GAAK,qBAAA,GAAqB,GAAG,EAAA,MAAmC;AACjE,QAAM,EAAE,WAAW,EAAA,IAAS,EAAmB,GACzC,EAAE,sBAAA,EAAA,IAAyB,EAAiB,GAC5C,EAAE,aAAA,GAAa,gBAAA,EAAA,IAAmB,EAA8B,GAQhE,IANsB,EAAM,QAAA,MAE9B,EAAY,OAAA,CAAQ,MAAe,EAAqB,SAAS,EAAW,WAAW,CAAC,GAC1F,CAAC,GAAsB,CAAW,CAGb,EAAoB,OAAA,CAAQ,MACjD,EAAU,EAAE,kBAAkB,EAAE,cAAc,CAAG,CACnD,GACM,IAAc,EAAe,KAAA,CAChC,MAAM,EAAE,SAAS,EAAe,UAAU,EAAE,WAAW,EAAiB,QAC3E,GACM,IAAY,EAAe,KAAA,CAC9B,MAAM,EAAE,SAAS,EAAe,UAAU,EAAE,WAAW,EAAiB,MAC3E,GACM,IAAU,EAAe,KAAA,CAC5B,MAAM,EAAE,SAAS,EAAe,UAAU,EAAE,WAAW,EAAiB,IAC3E,GACM,IAAY,EAAe,KAAA,CAAM,MAAM,EAAE,SAAS,EAAe,MAAM,GAEvE,KACH,IAAc,IAAI,MAAM,IAAY,IAAI,MAAM,IAAU,IAAI,MAAM,IAAY,IAAI,IAE/E,IAAc;AAAA,IAClB,KAAW,EAAK;AAAA,IAChB,KAAa,EAAK;AAAA,IAClB,KAAe,EAAK;AAAA,IACpB,KAAa,EAAK;AAAA,EACpB,EAAE,OAAO,OAAO,GAEV,IACJ,EAAY,SAAS,IACjB,GAAG,EAAW,GAAK,EAAkB,cAAc,CAAA,KAAM,EAAY,KAAK,IAAI,CAAA,KAC9E,EAAW,GAAK,EAAkB,cAAc;AAEtD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,cACE,EAAe,SAAS,KACtB,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,MACG,KAAa,gBAAA,EAAC,GAAD,EAAa,UAAU,GAAO,CAAA;AAAA,MAC3C,KAAW,gBAAA,EAAC,GAAD,EAAW,UAAU,GAAO,CAAA;AAAA,MACvC,KAAe,gBAAA,EAAC,GAAD,EAAsB,UAAU,GAAO,CAAA;AAAA,MACtD,KAAa,gBAAA,EAAC,GAAD,EAAa,UAAU,GAAO,CAAA;AAAA,IAC5C,EAAA,CAAA;AAAA,IAGN,SAAQ;AAAA,IACR,IAAI,EACF,qBAAqB;AAAA,MACnB,SAAS;AAAA,MACT,aAAa,IAAI,IAAc,KAAK,IAAI,CAAA;AAAA,MACxC,UAAU;AAAA,IACZ,EACF;AAAA,cAEA,gBAAA,EAAC,GAAD;AAAA,MACE,cAAY;AAAA,MACP,KAAA;AAAA,MACL,SAAA,MAAe,EAAe,CAAG;AAAA,MACZ,qBAAA;AAAA,MACrB,IAAI,EACF,wBAAwB;AAAA,QACtB,GAAI,KAAuB,EACzB,OAAO,gBACT;AAAA,QACA,GAAI,EAAM,SAAS,EACjB,OAAO,eACT;AAAA,MACF,EACF;AAAA,MACA,GAAI;AAAA,IACL,CAAA;AAAA,EACI,CAAA;AAEX,CACF"}

package/dist/recurringtransactions/components/shared/RecurringSettings/AddRecurringTransaction/index.es.js

@@ -0,0 +1,93 @@
+import { useGlobalCopyStore as w, useRecurringTransactionsStore as B, useTransactionStore as G, useUserStore as j } from "../../../../../common/context/hooks/index.es.js";
+import S from "../../../../../common/components/drawer/Drawer/index.es.js";
+import { Frequency as L, RepeatingType as T } from "../../../../../core/types/RepeatingTransaction/index.es.js";
+import { getNextPaymentDate as M } from "../../../../../core/utils/RecurringTransactionsUtil/index.es.js";
+import { expenseFilter as h, expenseFilterSearch as P, incomeFilter as F, incomeFilterSearch as U } from "../../../../../transactions/utils/Filters/index.es.js";
+import { SelectTransaction as k } from "../SelectTransaction/index.es.js";
+import { AddRecurringTransactionDetails as z } from "../AddRecurringTransactionDetails/index.es.js";
+import o from "react";
+import { observer as E } from "mobx-react-lite";
+import N from "@mui/material/Button";
+import { Add as H } from "@mxenabled/mx-icons";
+import { Fragment as I, jsx as i, jsxs as J } from "react/jsx-runtime";
+import { fromUnixTime as K } from "date-fns/fromUnixTime";
+import { formatISO as Q } from "date-fns/formatISO";
+var ce = E(({ isIncome: a = !1, label: f, onAddRecurringTransaction: x = () => null }) => {
+  const { recurring: r } = w(), { filter: s, setFilter: c, transactions: _ } = G(), { addRepeatingTransaction: D } = B(), { user: C } = j(), [O, d] = o.useState(!1), [u, p] = o.useState(""), [m, R] = o.useState(L.EveryMonth), [l, A] = o.useState(1), [y, b] = o.useState(15), e = o.useMemo(() => _.find((t) => t.guid === u), [u, _]), q = () => {
+    d(!0), c(a ? {
+      ...s,
+      custom: F
+    } : {
+      ...s,
+      custom: h
+    });
+  }, v = async () => {
+    if (!e) {
+      g();
+      return;
+    }
+    x();
+    const t = M(m, K(e.date), l), n = {
+      account_guid: e.account_guid,
+      amount: e.amount,
+      created_by: 0,
+      merchant_guid: e.merchant_guid,
+      description: e.payee || e.description || e.feed_description,
+      predicted_occurs_on: Q(t, { representation: "date" }),
+      recurrence_day: l,
+      recurrence_type: m,
+      repeating_transaction_type: a ? T.Income : T.Bill,
+      second_recurrence_day: y,
+      transaction_type: e.transaction_type,
+      user_guid: C.guid
+    };
+    await D(n, e), g();
+  }, g = () => {
+    p(""), d(!1);
+  };
+  return /* @__PURE__ */ J(I, { children: [
+    /* @__PURE__ */ i(N, {
+      onClick: q,
+      startIcon: /* @__PURE__ */ i(H, { size: 24 }),
+      variant: "contained",
+      children: f
+    }),
+    /* @__PURE__ */ i(S, {
+      ariaLabelClose: r.close_drawer_aria,
+      isOpen: O,
+      onClose: () => d(!1),
+      title: f,
+      children: /* @__PURE__ */ i(k, {
+        description: a ? r.add_income_description : r.add_expense_description,
+        onSearch: (t) => {
+          c({
+            ...s,
+            custom: (n) => a ? t ? U(n, t) : F(n) : t ? P(n, t) : h(n)
+          });
+        },
+        onSelected: (t) => p(t)
+      })
+    }),
+    /* @__PURE__ */ i(S, {
+      ariaLabelClose: r.close_drawer_aria,
+      isOpen: !!u,
+      onClose: () => p(""),
+      onPrimaryAction: v,
+      title: a ? r.income_details : r.expense_details,
+      children: e && /* @__PURE__ */ i(z, {
+        firstDay: l,
+        frequency: m,
+        onFirstDayChange: A,
+        onFrequencyChange: R,
+        onSecondDayChange: b,
+        secondDay: y,
+        transaction: e
+      })
+    })
+  ] });
+});
+export {
+  ce as AddRecurringTransaction
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/shared/RecurringSettings/AddRecurringTransaction/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../src/recurringtransactions/components/shared/recurringsettings/AddRecurringTransaction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { formatISO } from 'date-fns/formatISO'\nimport { fromUnixTime } from 'date-fns/fromUnixTime'\n\nimport Button from '@mui/material/Button'\n\nimport { Add } from '@mxenabled/mx-icons'\n\nimport {\n  Drawer,\n  useGlobalCopyStore,\n  useRecurringTransactionsStore,\n  useTransactionStore,\n  useUserStore,\n} from '../../../../common'\nimport {\n  type RepeatingTransaction,\n  type Transaction,\n  Frequency,\n  RepeatingType,\n} from '../../../../core'\n\nimport { SelectTransaction } from './SelectTransaction'\nimport { AddRecurringTransactionDetails } from './AddRecurringTransactionDetails'\n\nimport {\n  expenseFilter,\n  expenseFilterSearch,\n  incomeFilter,\n  incomeFilterSearch,\n} from '../../../../transactions/utils/Filters'\n\nimport { getNextPaymentDate } from '../../../../core/utils/RecurringTransactionsUtil'\n\ninterface AddRecurringTransactionProps {\n  isIncome?: boolean\n  label: string\n  onAddRecurringTransaction?: () => void\n}\n\nexport const AddRecurringTransaction = observer(\n  ({\n    isIncome = false,\n    label,\n    onAddRecurringTransaction = () => null,\n  }: AddRecurringTransactionProps) => {\n    const { recurring: copy } = useGlobalCopyStore()\n    const { filter, setFilter, transactions } = useTransactionStore()\n    const { addRepeatingTransaction } = useRecurringTransactionsStore()\n    const { user } = useUserStore()\n\n    const [isSelectTransactionOpen, setIsSelectTransactionOpen] = React.useState(false)\n    const [transactionGuid, setTransactionGuid] = React.useState('')\n    const [frequency, setFrequency] = React.useState(Frequency.EveryMonth)\n    const [firstDay, setFirstDay] = React.useState(1)\n    const [secondDay, setSecondDay] = React.useState(15)\n\n    const transaction = React.useMemo(\n      () => transactions.find((t) => t.guid === transactionGuid),\n      [transactionGuid, transactions],\n    )\n\n    const handleOpen = () => {\n      setIsSelectTransactionOpen(true)\n\n      if (isIncome) {\n        setFilter({ ...filter, custom: incomeFilter })\n      } else {\n        setFilter({ ...filter, custom: expenseFilter })\n      }\n    }\n\n    const handleAddRecurringTransaction = async () => {\n      if (!transaction) {\n        closeOnAdd()\n        return\n      }\n      onAddRecurringTransaction()\n\n      const nextDate = getNextPaymentDate(frequency, fromUnixTime(transaction.date), firstDay)\n\n      const repeatingTransaction = {\n        account_guid: transaction.account_guid,\n        amount: transaction.amount,\n        created_by: 0, // User\n        merchant_guid: transaction.merchant_guid,\n        description: transaction.payee || transaction.description || transaction.feed_description,\n        predicted_occurs_on: formatISO(nextDate, { representation: 'date' }),\n        recurrence_day: firstDay,\n        recurrence_type: frequency,\n        repeating_transaction_type: isIncome ? RepeatingType.Income : RepeatingType.Bill,\n        second_recurrence_day: secondDay,\n        transaction_type: transaction.transaction_type,\n        user_guid: user.guid,\n      } as RepeatingTransaction\n\n      await addRepeatingTransaction(repeatingTransaction, transaction)\n\n      closeOnAdd()\n    }\n\n    const closeOnAdd = () => {\n      setTransactionGuid('')\n      setIsSelectTransactionOpen(false)\n    }\n\n    return (\n      <>\n        <Button onClick={handleOpen} startIcon={<Add size={24} />} variant=\"contained\">\n          {label}\n        </Button>\n\n        <Drawer\n          ariaLabelClose={copy.close_drawer_aria}\n          isOpen={isSelectTransactionOpen}\n          onClose={() => setIsSelectTransactionOpen(false)}\n          title={label}\n        >\n          <SelectTransaction\n            description={isIncome ? copy.add_income_description : copy.add_expense_description}\n            onSearch={(searchValue) => {\n              setFilter({\n                ...filter,\n                custom: (transaction: Transaction) => {\n                  if (isIncome) {\n                    return searchValue\n                      ? incomeFilterSearch(transaction, searchValue)\n                      : incomeFilter(transaction)\n                  } else {\n                    return searchValue\n                      ? expenseFilterSearch(transaction, searchValue)\n                      : expenseFilter(transaction)\n                  }\n                },\n              })\n            }}\n            onSelected={(guid) => setTransactionGuid(guid)}\n          />\n        </Drawer>\n\n        <Drawer\n          ariaLabelClose={copy.close_drawer_aria}\n          isOpen={Boolean(transactionGuid)}\n          onClose={() => setTransactionGuid('')}\n          onPrimaryAction={handleAddRecurringTransaction}\n          title={isIncome ? copy.income_details : copy.expense_details}\n        >\n          {transaction && (\n            <AddRecurringTransactionDetails\n              firstDay={firstDay}\n              frequency={frequency}\n              onFirstDayChange={setFirstDay}\n              onFrequencyChange={setFrequency}\n              onSecondDayChange={setSecondDay}\n              secondDay={secondDay}\n              transaction={transaction}\n            />\n          )}\n        </Drawer>\n      </>\n    )\n  },\n)\n"],"mappings":"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"}

package/dist/recurringtransactions/components/shared/RecurringSettings/AddRecurringTransactionDetails/index.es.js

@@ -0,0 +1,42 @@
+import { useGlobalCopyStore as l } from "../../../../../common/context/hooks/index.es.js";
+import { fromUnixToDayOfWeekAndDate as u } from "../../../../../core/utils/DateUtil/index.es.js";
+import h from "../../../../../transactions/components/shared/transactionlist/TransactionRow/index.es.js";
+import s from "../../../../../common/components/SubheaderRow/index.es.js";
+import { PaymentSchedule as x } from "../../../PaymentSchedule/index.es.js";
+import { observer as y } from "mobx-react-lite";
+import m from "@mui/material/Stack";
+import { Text as b } from "@mxenabled/mxui";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import g from "@mui/material/Box";
+var B = y(({ bgcolor: e = "background.default", firstDay: i, secondDay: n, frequency: a, onFrequencyChange: d, onFirstDayChange: p, onSecondDayChange: c, transaction: t }) => {
+  const { recurring: f } = l();
+  return /* @__PURE__ */ o(m, {
+    bgcolor: e,
+    gap: 24,
+    height: "100%",
+    children: [/* @__PURE__ */ o(m, { children: [/* @__PURE__ */ r(s, {
+      bgcolor: e,
+      children: u(t.date)
+    }), /* @__PURE__ */ r(h, {
+      component: "div",
+      transaction: t
+    })] }), /* @__PURE__ */ o(g, { children: [/* @__PURE__ */ r(b, {
+      bold: !0,
+      sx: { mx: 24 },
+      variant: "body1",
+      children: f.payment_schedule
+    }), /* @__PURE__ */ r(x, {
+      firstDay: i,
+      frequency: a,
+      onFirstDayChange: p,
+      onFrequencyChange: d,
+      onSecondDayChange: c,
+      secondDay: n
+    })] })]
+  });
+});
+export {
+  B as AddRecurringTransactionDetails
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/shared/RecurringSettings/AddRecurringTransactionDetails/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../src/recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../../../common'\nimport { type Transaction, Frequency } from '../../../../core'\nimport SubheaderRow from '../../../../common/components/SubheaderRow'\n\nimport { TransactionRow } from '../../../../transactions'\n\nimport { fromUnixToDayOfWeekAndDate } from '../../../../core/utils/DateUtil'\nimport { PaymentSchedule } from '../../PaymentSchedule'\n\ninterface AddRecurringTransactionDetailsProps {\n  bgcolor?: string\n  firstDay: number\n  secondDay?: number\n  frequency: Frequency\n  onFrequencyChange: (frequency: Frequency) => void\n  onFirstDayChange: (day: number) => void\n  onSecondDayChange: (day: number) => void\n  transaction: Transaction\n}\n\nexport const AddRecurringTransactionDetails = observer(\n  ({\n    bgcolor = 'background.default',\n    firstDay,\n    secondDay,\n    frequency,\n    onFrequencyChange,\n    onFirstDayChange,\n    onSecondDayChange,\n    transaction,\n  }: AddRecurringTransactionDetailsProps) => {\n    const { recurring: copy } = useGlobalCopyStore()\n\n    return (\n      <Stack bgcolor={bgcolor} gap={24} height=\"100%\">\n        <Stack>\n          <SubheaderRow bgcolor={bgcolor}>\n            {fromUnixToDayOfWeekAndDate(transaction.date)}\n          </SubheaderRow>\n          <TransactionRow component=\"div\" transaction={transaction} />\n        </Stack>\n\n        <Box>\n          <Text bold={true} sx={{ mx: 24 }} variant=\"body1\">\n            {copy.payment_schedule}\n          </Text>\n\n          <PaymentSchedule\n            firstDay={firstDay}\n            frequency={frequency}\n            onFirstDayChange={onFirstDayChange}\n            onFrequencyChange={onFrequencyChange}\n            onSecondDayChange={onSecondDayChange}\n            secondDay={secondDay}\n          />\n        </Box>\n      </Stack>\n    )\n  },\n)\n"],"mappings":";;;;;;;;;;AA2BA,IAAa,IAAiC,EAAA,CAC3C,EACC,SAAA,IAAU,sBACV,UAAA,GACA,WAAA,GACA,WAAA,GACA,mBAAA,GACA,kBAAA,GACA,mBAAA,GACA,aAAA,EAAA,MACyC;AACzC,QAAM,EAAE,WAAW,EAAA,IAAS,EAAmB;AAE/C,SACE,gBAAA,EAAC,GAAD;AAAA,IAAgB,SAAA;AAAA,IAAS,KAAK;AAAA,IAAI,QAAO;AAAA,cAAzC,CACE,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MAAuB,SAAA;AAAA,gBACpB,EAA2B,EAAY,IAAI;AAAA,IAChC,CAAA,GACd,gBAAA,EAAC,GAAD;AAAA,MAAgB,WAAU;AAAA,MAAmB,aAAA;AAAA,IAAc,CAAA,CACtD,EAAA,CAAA,GAEP,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MAAM,MAAM;AAAA,MAAM,IAAI,EAAE,IAAI,GAAG;AAAA,MAAG,SAAQ;AAAA,gBACvC,EAAK;AAAA,IACF,CAAA,GAEN,gBAAA,EAAC,GAAD;AAAA,MACY,UAAA;AAAA,MACC,WAAA;AAAA,MACO,kBAAA;AAAA,MACC,mBAAA;AAAA,MACA,mBAAA;AAAA,MACR,WAAA;AAAA,IACZ,CAAA,CACE,EAAA,CAAA,CACA;AAAA;AAEX,CACF"}

package/dist/recurringtransactions/components/shared/RecurringSettings/ManageExpenses/index.es.js

@@ -0,0 +1,57 @@
+import { useEvent as d, useGlobalCopyStore as f, useRecurringTransactionsStore as u } from "../../../../../common/context/hooks/index.es.js";
+import { ANALYTICS_EVENTS as a } from "../../../../../common/constants/Analytics/index.es.js";
+import { Frequency as x, RepeatingType as h } from "../../../../../core/types/RepeatingTransaction/index.es.js";
+import { RecurringRow as R } from "../RecurringRow/index.es.js";
+import { AddRecurringTransaction as E } from "../AddRecurringTransaction/index.es.js";
+import { RecurringSettingsZeroState as S } from "../RecurringSettingsZeroState/index.es.js";
+import _ from "react";
+import { observer as C } from "mobx-react-lite";
+import T from "@mui/material/Stack";
+import { Fragment as A, jsx as r, jsxs as t } from "react/jsx-runtime";
+import o from "@mui/material/Box";
+import c from "@mui/material/Divider";
+import v from "@mui/material/List";
+var P = C(() => {
+  const { recurring: s } = f(), { detailedRepeatingTransactions: p } = u(), { onEvent: i } = d(), m = (e) => {
+    i(a.RECURRING_TRANSACTIONS_CLICK_EXPENSE, { repeating_transaction_guid: e.guid });
+  }, g = () => {
+    i(a.RECURRING_TRANSACTIONS_CLICK_ADD_EXPENSE);
+  }, n = p.filter((e) => e.repeating_transaction_type !== h.Income && (e.transactions.length > 0 || e.recurrence_type === x.EveryYear));
+  return /* @__PURE__ */ r(A, { children: n.length !== 0 ? /* @__PURE__ */ t(T, {
+    sx: {
+      height: "calc(100vh - 109px)",
+      maxHeight: "calc(100vh - 109px)"
+    },
+    children: [/* @__PURE__ */ r(o, {
+      sx: {
+        flex: 1,
+        overflow: "auto"
+      },
+      children: /* @__PURE__ */ r(v, {
+        sx: { bgcolor: "background.paper" },
+        children: n.map((e, l) => /* @__PURE__ */ t(_.Fragment, { children: [/* @__PURE__ */ r(R, {
+          onClick: m,
+          repeatingTransaction: e
+        }), /* @__PURE__ */ r(c, { variant: l < n.length - 1 ? "inset" : "fullWidth" })] }, e.guid))
+      })
+    }), /* @__PURE__ */ t(o, { children: [/* @__PURE__ */ r(c, {}), /* @__PURE__ */ r(o, {
+      sx: {
+        alignContent: "center",
+        bgcolor: "background.paper",
+        justifyContent: "flex-end",
+        px: 24,
+        py: 12,
+        textAlign: "right"
+      },
+      children: /* @__PURE__ */ r(E, {
+        label: s.add_expense,
+        onAddRecurringTransaction: g
+      })
+    })] })]
+  }) : /* @__PURE__ */ r(S, { zeroStateFor: "expenses" }) });
+});
+export {
+  P as ManageExpenses
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/recurringtransactions/components/shared/RecurringSettings/ManageExpenses/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../src/recurringtransactions/components/shared/recurringsettings/ManageExpenses.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport Stack from '@mui/material/Stack'\n\nimport {\n  ANALYTICS_EVENTS,\n  useEvent,\n  useGlobalCopyStore,\n  useRecurringTransactionsStore,\n} from '../../../../common'\nimport { type RepeatingTransaction, Frequency, RepeatingType } from '../../../../core'\n\nimport { RecurringRow } from './RecurringRow'\nimport { AddRecurringTransaction } from './AddRecurringTransaction'\nimport { RecurringSettingsZeroState } from './RecurringSettingsZeroState'\n\nexport const ManageExpenses = observer(() => {\n  const { recurring: copy } = useGlobalCopyStore()\n  const { detailedRepeatingTransactions } = useRecurringTransactionsStore()\n  const { onEvent } = useEvent()\n\n  const onClick = (repeatingTransaction: RepeatingTransaction) => {\n    onEvent(ANALYTICS_EVENTS.RECURRING_TRANSACTIONS_CLICK_EXPENSE, {\n      repeating_transaction_guid: repeatingTransaction.guid,\n    })\n  }\n\n  const onAdd = () => {\n    onEvent(ANALYTICS_EVENTS.RECURRING_TRANSACTIONS_CLICK_ADD_EXPENSE)\n  }\n\n  const filteredTransactions = detailedRepeatingTransactions.filter(\n    (rt) =>\n      rt.repeating_transaction_type !== RepeatingType.Income &&\n      (rt.transactions.length > 0 || rt.recurrence_type === Frequency.EveryYear),\n  )\n\n  return (\n    <>\n      {filteredTransactions.length !== 0 ? (\n        <Stack\n          sx={{\n            height: 'calc(100vh - 109px)',\n            maxHeight: 'calc(100vh - 109px)',\n          }}\n        >\n          <Box sx={{ flex: 1, overflow: 'auto' }}>\n            <List sx={{ bgcolor: 'background.paper' }}>\n              {filteredTransactions.map((rt, index) => (\n                <React.Fragment key={rt.guid}>\n                  <RecurringRow onClick={onClick} repeatingTransaction={rt} />\n                  <Divider\n                    variant={index < filteredTransactions.length - 1 ? 'inset' : 'fullWidth'}\n                  />\n                </React.Fragment>\n              ))}\n            </List>\n          </Box>\n          <Box>\n            <Divider />\n            <Box\n              sx={{\n                alignContent: 'center',\n                bgcolor: 'background.paper',\n                justifyContent: 'flex-end',\n                px: 24,\n                py: 12,\n                textAlign: 'right',\n              }}\n            >\n              <AddRecurringTransaction label={copy.add_expense} onAddRecurringTransaction={onAdd} />\n            </Box>\n          </Box>\n        </Stack>\n      ) : (\n        <RecurringSettingsZeroState zeroStateFor=\"expenses\" />\n      )}\n    </>\n  )\n})\n"],"mappings":";;;;;;;;;;;;;AAoBA,IAAa,IAAiB,EAAA,MAAe;AAC3C,QAAM,EAAE,WAAW,EAAA,IAAS,EAAmB,GACzC,EAAE,+BAAA,EAAA,IAAkC,EAA8B,GAClE,EAAE,SAAA,EAAA,IAAY,EAAS,GAEvB,IAAA,CAAW,MAA+C;AAC9D,IAAA,EAAQ,EAAiB,sCAAsC,EAC7D,4BAA4B,EAAqB,KACnD,CAAC;AAAA,EACH,GAEM,IAAA,MAAc;AAClB,IAAA,EAAQ,EAAiB,wCAAwC;AAAA,EACnE,GAEM,IAAuB,EAA8B,OAAA,CACxD,MACC,EAAG,+BAA+B,EAAc,WAC/C,EAAG,aAAa,SAAS,KAAK,EAAG,oBAAoB,EAAU,UACpE;AAEA,SACE,gBAAA,EAAA,GAAA,EAAA,UACG,EAAqB,WAAW,IAC/B,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,QAAQ;AAAA,MACR,WAAW;AAAA,IACb;AAAA,cAJF,CAME,gBAAA,EAAC,GAAD;AAAA,MAAK,IAAI;AAAA,QAAE,MAAM;AAAA,QAAG,UAAU;AAAA,MAAO;AAAA,gBACnC,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAI,EAAE,SAAS,mBAAmB;AAAA,kBACrC,EAAqB,IAAA,CAAK,GAAI,MAC7B,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,UAAuB,SAAA;AAAA,UAAS,sBAAsB;AAAA,QAAK,CAAA,GAC3D,gBAAA,EAAC,GAAD,EACE,SAAS,IAAQ,EAAqB,SAAS,IAAI,UAAU,YAC9D,CAAA,CACa,EAAA,GALK,EAAG,IAKR,CACjB;AAAA,MACG,CAAA;AAAA,IACH,CAAA,GACL,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD,CAAU,CAAA,GACV,gBAAA,EAAC,GAAD;AAAA,MACE,IAAI;AAAA,QACF,cAAc;AAAA,QACd,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,gBAEA,gBAAA,EAAC,GAAD;AAAA,QAAyB,OAAO,EAAK;AAAA,QAAa,2BAA2B;AAAA,MAAQ,CAAA;AAAA,IAClF,CAAA,CACF,EAAA,CAAA,CACA;AAAA,OAEP,gBAAA,EAAC,GAAD,EAA4B,cAAa,WAAY,CAAA,EAEvD,CAAA;AAEN,CAAC"}