@mx-cartographer/experiences 6.25.3-alpha.al3 → 6.25.3-alpha.mega2

package/dist/trends/components/TrendsMicroSpendingIncomeBox.js

@@ -0,0 +1,245 @@
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import u from "react";
+import W from "@mui/material/Box";
+import i from "@mui/material/Stack";
+import { TrendingUp as P, TrendingDown as R } from "@mxenabled/mx-icons";
+import { P as c, H3 as I } from "@mxenabled/mxui";
+import "bowser";
+import "date-fns/getUnixTime";
+import "date-fns/intlFormat";
+import "../../common/constants/Account.js";
+import "../../common/constants/Category.js";
+import "date-fns/addMonths";
+import "date-fns/addQuarters";
+import "date-fns/addWeeks";
+import "date-fns/addYears";
+import "date-fns/getDay";
+import "date-fns/isBefore";
+import "date-fns/nextDay";
+import "date-fns/setDate";
+import "date-fns/startOfToday";
+import "date-fns/fromUnixTime";
+import { formatPercentage as j, formatCurrency as l } from "../../common/utils/NumberFormatting.js";
+import "@mui/material";
+import "@mui/material/Button";
+import "@mui/material/Tooltip";
+import "@mui/material/IconButton";
+import "../../common/components/accountfilter/AccountFilterOptions.js";
+import { useWidgetContainerProvider as D } from "../../common/context/hooks.js";
+import "../../common/context/GlobalDataProvider.js";
+import "../../common/context/WidgetContainerProvider.js";
+import "@mui/material/styles/useTheme";
+import "@mui/material/useMediaQuery";
+import "@mxenabled/cssinjs";
+import "date-fns/addDays";
+import "date-fns/eachDayOfInterval";
+import "date-fns/eachWeekOfInterval";
+import "date-fns/endOfMonth";
+import "date-fns/format";
+import "date-fns/isSameMonth";
+import "date-fns/startOfMonth";
+import "date-fns/subMonths";
+import "@mui/material/Paper";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import "d3";
+import "@mui/material/styles";
+import "@mui/x-charts";
+import "../../common/components/charts/linechart/CustomLegend.js";
+import "@mui/x-charts/ChartsTooltip";
+import "../../common/components/charts/stackedlinechart/CustomAreaTooltip.js";
+import "date-fns/differenceInCalendarDays";
+import "date-fns/endOfToday";
+import "date-fns/endOfYear";
+import "date-fns/startOfYear";
+import "date-fns/subDays";
+import "date-fns/subYears";
+import "@mui/material/ButtonGroup";
+import "@mui/material/Tab";
+import "@mui/material/Tabs";
+import "@mui/material/ToggleButton";
+import "@mui/material/ToggleButtonGroup";
+import "@mui/material/Dialog";
+import "@mui/material/DialogContent";
+import "../../common/components/ErrorBoundary.js";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "../../common/components/WidgetContainer.js";
+import "../../common/components/ConnectDrawer.js";
+import "uuid";
+import "@mui/material/CircularProgress";
+import "../../common/components/SearchBox.js";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import "@mui/material/ListItem";
+import "@mui/material/ListItemAvatar";
+import "@mui/material/ListItemButton";
+import "@mui/material/ListItemText";
+import "@mui/material/ListItemIcon";
+import "../../common/components/ListItemAction.js";
+import "@mui/material/MenuItem";
+import "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "../../accounts/AccountsWidget.js";
+import "../../accounts/AccountsMiniWidget.js";
+import "../../accounts/ConnectMiniWidget.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsContent.js";
+import "../../common/types/Account.js";
+import "posthog-js";
+import "../../cashflow/CashflowMiniWidget.js";
+import "../../cashflow/CashflowWidget.js";
+import "../../cashflow/CashflowOnboarding.js";
+import "date-fns/differenceInDays";
+import "../../categories/components/CategorySelector.js";
+import "../../categories/components/CategorySelectorDrawer.js";
+import "../../categories/components/CategoryRow.js";
+import "../../debts/DebtsWidget.js";
+import "@mui/x-data-grid-pro";
+import "date-fns";
+import "@mui/material/Divider";
+import "@mui/material/List";
+import "../../finstrong/components/FinancialStrengthGraph.js";
+import "../../finstrong/components/CreditScoreGraph.js";
+import "../../finstrong/FinstrongWidget.js";
+import "../../goals/GoalsWidget.js";
+import "../../goals/GoalsMicroWidget.js";
+import "../../investments/util/InvestmentUtil.js";
+import "../../merchants/components/MerchantLookup.js";
+import "../../networth/components/NetWorthChart.js";
+import "../../networth/components/NetWorthList.js";
+import "../../networth/components/NetWorthSummary.js";
+import "../../networth/NetWorthMicroWidget.js";
+import "../../networth/NetWorthWidget.js";
+import "../../notifications/components/NotificationList.js";
+import "../../notifications/components/NotificationDrawer.js";
+import "date-fns/formatISO";
+import "../../transactions/constants/Analytics.js";
+import "../../transactions/constants/Transaction.js";
+import "../../transactions/components/shared/transactionlist/TransactionRow.js";
+import "../../transactions/components/shared/TransactionList.js";
+import "../../transactions/components/shared/TransactionTable.js";
+import "../../transactions/components/shared/TransactionDetails.js";
+import "../../transactions/components/transactionwidget/AddAccountModal.js";
+import "../../transactions/TransactionWidget.js";
+import "../../settings/SettingsWidget.js";
+import "../../settings/components/SettingsWidgetContents.js";
+import "../../settings/components/profile/ProfileTab.js";
+import "../../settings/components/devices/DeviceTab.js";
+import "../../settings/NotificationSettingsWidget.js";
+import "../../settings/components/notifications/NotificationSettings.js";
+import "../../settings/components/notifications/AccountNotificationProfiles.js";
+import "../../settings/components/notifications/BudgetNotificationProfiles.js";
+import "../../settings/components/notifications/InsightsNotificationProfiles.js";
+import "../../settings/components/transactionrules/TransactionRulesTab.js";
+import "../../recurringtransactions/RecurringTransactionsWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMiniWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMicroWidget.js";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "../../recurringtransactions/components/shared/RecurringSettings.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageIncome.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageExpenses.js";
+import "../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.js";
+import "../../recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.js";
+import "../TrendsFullWidget.js";
+import "../TrendsMiniWidget.js";
+import "../TrendsMicroWidget.js";
+import "../TrendsWidget.js";
+import "date-fns/addSeconds";
+import "date-fns/getMonth";
+const S = 70, Ri = ({
+  title: w,
+  totalAmount: t,
+  transactionType: m,
+  percentage: p,
+  secondaryLabel: b,
+  shouldDisplayPercentage: a
+}) => {
+  const { availableWidth: d } = D(), f = u.useRef(null), x = u.useRef(null), v = j(Number(Math.abs(p)), {
+    style: "percent",
+    minimumIntegerDigits: 1
+  }), y = d === 288 && l(t, "0,0.00").length > 10 ? l(t, "0,0") : l(t, "0,0.00"), e = m === "spending" ? p > 0 : p >= 0, n = m === "spending" ? "error.main" : "success.main", s = m === "spending" ? "success.main" : "text.secondary", g = f?.current, h = x?.current, C = g && h ? g.scrollWidth > h.clientWidth - S : !1;
+  return /* @__PURE__ */ o(
+    i,
+    {
+      sx: {
+        border: 1,
+        borderColor: "divider",
+        borderRadius: "4px",
+        flex: 1,
+        minWidth: 0,
+        px: 12,
+        py: 8
+      },
+      children: [
+        /* @__PURE__ */ o(
+          i,
+          {
+            sx: {
+              alignItems: "center",
+              flexDirection: "row",
+              justifyContent: "space-between"
+            },
+            children: [
+              /* @__PURE__ */ r(c, { color: "text.secondary", variant: "caption", children: w }),
+              a && /* @__PURE__ */ o(i, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
+                e ? /* @__PURE__ */ r(P, { size: 20, sx: { color: n } }) : /* @__PURE__ */ r(R, { size: 20, sx: { color: s } }),
+                /* @__PURE__ */ r(
+                  c,
+                  {
+                    sx: {
+                      color: e ? n : s,
+                      fontWeight: 600
+                    },
+                    variant: "body2",
+                    children: v
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o(
+          i,
+          {
+            ref: x,
+            sx: {
+              alignItems: "center",
+              flexDirection: "row",
+              justifyContent: "space-between"
+            },
+            children: [
+              /* @__PURE__ */ r(
+                W,
+                {
+                  ref: f,
+                  sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
+                  children: /* @__PURE__ */ r(I, { children: y })
+                }
+              ),
+              a && d >= 450 && !C && /* @__PURE__ */ r(
+                c,
+                {
+                  color: e ? n : s,
+                  variant: "caption",
+                  children: b
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  Ri as TrendsMicroSpendingIncomeBox
+};
+//# sourceMappingURL=TrendsMicroSpendingIncomeBox.js.map

package/dist/trends/components/TrendsMicroSpendingIncomeBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrendsMicroSpendingIncomeBox.js","sources":["../../../src/trends/components/TrendsMicroSpendingIncomeBox.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { TrendingDown, TrendingUp } from '@mxenabled/mx-icons'\nimport { H3, P } from '@mxenabled/mxui'\n\nimport { formatCurrency, formatPercentage, useWidgetContainerProvider } from '../../common'\n\nconst secondaryLabelWidth = 70\n\ninterface TrendsMicroSpendingIncomeBoxProps {\n  title: string\n  totalAmount: number\n  transactionType: 'spending' | 'income'\n  percentage: number\n  secondaryLabel: string\n  shouldDisplayPercentage: boolean\n}\nexport const TrendsMicroSpendingIncomeBox = ({\n  title,\n  totalAmount,\n  transactionType,\n  percentage,\n  secondaryLabel,\n  shouldDisplayPercentage,\n}: TrendsMicroSpendingIncomeBoxProps) => {\n  const { availableWidth } = useWidgetContainerProvider()\n\n  const amountRef = React.useRef<HTMLSpanElement | null>(null)\n  const containerRef = React.useRef<HTMLDivElement | null>(null)\n\n  const displayPercentage = formatPercentage(Number(Math.abs(percentage)), {\n    style: 'percent',\n    minimumIntegerDigits: 1,\n  })\n\n  const displayTotalAmount =\n    availableWidth === 288 && formatCurrency(totalAmount, '0,0.00').length > 10\n      ? formatCurrency(totalAmount, '0,0')\n      : formatCurrency(totalAmount, '0,0.00')\n\n  const isGainPercentage = transactionType === 'spending' ? percentage > 0 : percentage >= 0\n  const isGainPercentageColor = transactionType === 'spending' ? 'error.main' : 'success.main'\n  const isLossPercentageColor = transactionType === 'spending' ? 'success.main' : 'text.secondary'\n\n  const amountElement = amountRef?.current\n  const containerElement = containerRef?.current\n  const isOverflowing =\n    amountElement && containerElement\n      ? amountElement.scrollWidth > containerElement.clientWidth - secondaryLabelWidth\n      : false\n  return (\n    <Stack\n      sx={{\n        border: 1,\n        borderColor: 'divider',\n        borderRadius: '4px',\n        flex: 1,\n        minWidth: 0,\n        px: 12,\n        py: 8,\n      }}\n    >\n      <Stack\n        sx={{\n          alignItems: 'center',\n          flexDirection: 'row',\n          justifyContent: 'space-between',\n        }}\n      >\n        <P color=\"text.secondary\" variant=\"caption\">\n          {title}\n        </P>\n        {shouldDisplayPercentage && (\n          <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 4 }}>\n            {isGainPercentage ? (\n              <TrendingUp size={20} sx={{ color: isGainPercentageColor }} />\n            ) : (\n              <TrendingDown size={20} sx={{ color: isLossPercentageColor }} />\n            )}\n            <P\n              sx={{\n                color: isGainPercentage ? isGainPercentageColor : isLossPercentageColor,\n                fontWeight: 600,\n              }}\n              variant=\"body2\"\n            >\n              {displayPercentage}\n            </P>\n          </Stack>\n        )}\n      </Stack>\n      <Stack\n        ref={containerRef}\n        sx={{\n          alignItems: 'center',\n          flexDirection: 'row',\n          justifyContent: 'space-between',\n        }}\n      >\n        <Box\n          ref={amountRef}\n          sx={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}\n        >\n          <H3>{displayTotalAmount}</H3>\n        </Box>\n        {shouldDisplayPercentage && availableWidth >= 450 && !isOverflowing && (\n          <P\n            color={isGainPercentage ? isGainPercentageColor : isLossPercentageColor}\n            variant=\"caption\"\n          >\n            {secondaryLabel}\n          </P>\n        )}\n      </Stack>\n    </Stack>\n  )\n}\n"],"names":["secondaryLabelWidth","TrendsMicroSpendingIncomeBox","title","totalAmount","transactionType","percentage","secondaryLabel","shouldDisplayPercentage","availableWidth","useWidgetContainerProvider","amountRef","React","containerRef","displayPercentage","formatPercentage","displayTotalAmount","formatCurrency","isGainPercentage","isGainPercentageColor","isLossPercentageColor","amountElement","containerElement","isOverflowing","jsxs","Stack","jsx","P","TrendingUp","TrendingDown","Box","H3"],"mappings":"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"}

package/dist/trends/components/TrendsTable.js

@@ -0,0 +1,247 @@
+import { jsx as _ } from "react/jsx-runtime";
+import s from "react";
+import v from "@mui/material/Box";
+import { DataGridPro as D } from "@mui/x-data-grid-pro";
+import "bowser";
+import "date-fns/getUnixTime";
+import { ANALYTICS_EVENTS as T } from "../../common/constants/Analytics.js";
+import { formatDate as l, DATE_FORMATS_INTL as d } from "../../common/constants/DateFormats.js";
+import "../../common/constants/Account.js";
+import "../../common/constants/Category.js";
+import "date-fns/addMonths";
+import "date-fns/addQuarters";
+import "date-fns/addWeeks";
+import "date-fns/addYears";
+import "date-fns/getDay";
+import "date-fns/isBefore";
+import "date-fns/nextDay";
+import "date-fns/setDate";
+import "date-fns/startOfToday";
+import "date-fns/fromUnixTime";
+import "numeral";
+import "@mui/material";
+import "@mui/material/Button";
+import "@mxenabled/mxui";
+import "@mui/material/Tooltip";
+import "@mui/material/IconButton";
+import "../../common/components/accountfilter/AccountFilterOptions.js";
+import { useEvent as R } from "../../common/context/hooks.js";
+import "../../common/context/GlobalDataProvider.js";
+import "../../common/context/WidgetContainerProvider.js";
+import "@mui/material/styles/useTheme";
+import "@mui/material/useMediaQuery";
+import "@mxenabled/cssinjs";
+import "date-fns/addDays";
+import "date-fns/eachDayOfInterval";
+import "date-fns/eachWeekOfInterval";
+import "date-fns/endOfMonth";
+import "date-fns/format";
+import "date-fns/isSameMonth";
+import "date-fns/startOfMonth";
+import "date-fns/subMonths";
+import "@mui/material/Paper";
+import "@mxenabled/mx-icons";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import "d3";
+import "@mui/material/styles";
+import "@mui/x-charts";
+import "../../common/components/charts/linechart/CustomLegend.js";
+import "@mui/x-charts/ChartsTooltip";
+import "@mui/material/Stack";
+import "../../common/components/charts/stackedlinechart/CustomAreaTooltip.js";
+import "date-fns/differenceInCalendarDays";
+import "date-fns/endOfToday";
+import "date-fns/endOfYear";
+import "date-fns/startOfYear";
+import "date-fns/subDays";
+import "date-fns/subYears";
+import "@mui/material/ButtonGroup";
+import "@mui/material/Tab";
+import "@mui/material/Tabs";
+import "@mui/material/ToggleButton";
+import "@mui/material/ToggleButtonGroup";
+import "@mui/material/Dialog";
+import "@mui/material/DialogContent";
+import "../../common/components/ErrorBoundary.js";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "../../common/components/WidgetContainer.js";
+import "../../common/components/ConnectDrawer.js";
+import "uuid";
+import "@mui/material/CircularProgress";
+import "../../common/components/SearchBox.js";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import "@mui/material/ListItem";
+import "@mui/material/ListItemAvatar";
+import "@mui/material/ListItemButton";
+import "@mui/material/ListItemText";
+import "@mui/material/ListItemIcon";
+import "../../common/components/ListItemAction.js";
+import "@mui/material/MenuItem";
+import "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "../../accounts/AccountsWidget.js";
+import "../../accounts/AccountsMiniWidget.js";
+import "../../accounts/ConnectMiniWidget.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsContent.js";
+import "../../common/types/Account.js";
+import "posthog-js";
+import "../../cashflow/CashflowMiniWidget.js";
+import "../../cashflow/CashflowWidget.js";
+import "../../cashflow/CashflowOnboarding.js";
+import "date-fns/differenceInDays";
+import "../../categories/components/CategorySelector.js";
+import "../../categories/components/CategorySelectorDrawer.js";
+import "../../categories/components/CategoryRow.js";
+import "../../debts/DebtsWidget.js";
+import { HeaderCell as C } from "./trendstable/HeaderCell.js";
+import "date-fns";
+import "@mui/material/Divider";
+import "@mui/material/List";
+import "../../finstrong/components/FinancialStrengthGraph.js";
+import "../../finstrong/components/CreditScoreGraph.js";
+import "../../finstrong/FinstrongWidget.js";
+import "../../goals/GoalsWidget.js";
+import "../../goals/GoalsMicroWidget.js";
+import "../../investments/util/InvestmentUtil.js";
+import "../../merchants/components/MerchantLookup.js";
+import "../../networth/components/NetWorthChart.js";
+import "../../networth/components/NetWorthList.js";
+import "../../networth/components/NetWorthSummary.js";
+import "../../networth/NetWorthMicroWidget.js";
+import "../../networth/NetWorthWidget.js";
+import "../../notifications/components/NotificationList.js";
+import "../../notifications/components/NotificationDrawer.js";
+import "date-fns/formatISO";
+import "../../transactions/constants/Analytics.js";
+import "../../transactions/constants/Transaction.js";
+import "../../transactions/components/shared/transactionlist/TransactionRow.js";
+import "../../transactions/components/shared/TransactionList.js";
+import "../../transactions/components/shared/TransactionTable.js";
+import "../../transactions/components/shared/TransactionDetails.js";
+import "../../transactions/components/transactionwidget/AddAccountModal.js";
+import "../../transactions/TransactionWidget.js";
+import "../../settings/SettingsWidget.js";
+import "../../settings/components/SettingsWidgetContents.js";
+import "../../settings/components/profile/ProfileTab.js";
+import "../../settings/components/devices/DeviceTab.js";
+import "../../settings/NotificationSettingsWidget.js";
+import "../../settings/components/notifications/NotificationSettings.js";
+import "../../settings/components/notifications/AccountNotificationProfiles.js";
+import "../../settings/components/notifications/BudgetNotificationProfiles.js";
+import "../../settings/components/notifications/InsightsNotificationProfiles.js";
+import "../../settings/components/transactionrules/TransactionRulesTab.js";
+import "../../recurringtransactions/RecurringTransactionsWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMiniWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMicroWidget.js";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "../../recurringtransactions/components/shared/RecurringSettings.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageIncome.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageExpenses.js";
+import "../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.js";
+import "../../recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.js";
+import "../TrendsFullWidget.js";
+import "../TrendsMiniWidget.js";
+import "../TrendsMicroWidget.js";
+import "../TrendsWidget.js";
+import "date-fns/addSeconds";
+import "date-fns/getMonth";
+import { AmountCell as x } from "./trendstable/AmountCell.js";
+import { CategoryCell as I } from "./trendstable/CategoryCell.js";
+import { amountComparator as L } from "../utils/TrendsData.js";
+const B = (p, e) => {
+  const o = [], m = new Date(p);
+  for (; m <= e; ) {
+    const a = l(m, d.MONTH);
+    o.push(a), m.setMonth(m.getMonth() + 1);
+  }
+  return o;
+}, Fr = ({
+  monthlyCategoryTotals: p,
+  selectedDateRange: e,
+  selectedCategory: o,
+  onClickRow: m,
+  height: a = "100dvh",
+  sx: S = {}
+}) => {
+  const { onEvent: c } = R(), g = l(/* @__PURE__ */ new Date(), d.MONTH_SHORT), [u, M] = s.useState([
+    { field: g, sort: "desc" }
+  ]), N = s.useMemo(() => B(e.start, e.end), [e]), w = [
+    {
+      field: "category",
+      headerName: "Category",
+      minWidth: 175,
+      renderHeader: C,
+      renderCell: I,
+      sortable: !0,
+      type: "string"
+    },
+    ...N.map(
+      (i) => ({
+        field: i,
+        headerName: i,
+        minWidth: 75,
+        renderHeader: C,
+        renderCell: x,
+        align: "right",
+        headerAlign: "right",
+        sortable: !0,
+        hideSortIcons: !1,
+        type: "number",
+        sortComparator: L
+      })
+    )
+  ], O = s.useMemo(() => {
+    const b = (o ? p.filter(
+      (t) => t.category_guid === o || t.top_level_category_guid === o
+    ) : p).reduce(
+      (t, E) => {
+        const { category_guid: f, top_level_category_guid: h, month: H, total: y, year: A } = E, r = o ? f : h;
+        t[r] || (t[r] = {
+          id: r,
+          category: r,
+          category_guid: f,
+          top_level_category_guid: h
+        });
+        const n = l(new Date(A, H - 1), d.MONTH_SHORT);
+        return t[r][n] || (t[r][n] = 0), t[r][n] = t[r][n] + y, t;
+      },
+      {}
+    );
+    return Object.values(b);
+  }, [p, o]);
+  return /* @__PURE__ */ _(v, { sx: { height: a, width: "100%", overflowX: "auto", boxShadow: "none", ...S }, children: /* @__PURE__ */ _(
+    D,
+    {
+      columns: w,
+      disableColumnFilter: !0,
+      disableColumnMenu: !0,
+      hideFooter: !0,
+      initialState: { sorting: { sortModel: u } },
+      onRowClick: (i) => {
+        m?.(i.row.category), c(T.TRENDS_CLICK_TABLE_ROW);
+      },
+      onSortModelChange: (i) => {
+        M(i), c(T.TRENDS_CLICK_TABLE_SORT);
+      },
+      rows: O,
+      slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
+      sortModel: u,
+      sortingOrder: ["asc", "desc"]
+    }
+  ) });
+};
+export {
+  Fr as default
+};
+//# sourceMappingURL=TrendsTable.js.map

package/dist/trends/components/TrendsTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrendsTable.js","sources":["../../../src/trends/components/TrendsTable.tsx"],"sourcesContent":["import React from 'react'\nimport Box from '@mui/material/Box'\nimport { DataGridPro, GridColDef, GridSortModel } from '@mui/x-data-grid-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  DATE_FORMATS_INTL,\n  formatDate,\n  MonthlyCategoryTotals,\n  useEvent,\n} from '../../common'\n\nimport { AmountCell } from './trendstable/AmountCell'\nimport { CategoryCell } from './trendstable/CategoryCell'\nimport { HeaderCell } from './trendstable/HeaderCell'\nimport { amountComparator } from '../utils/TrendsData'\n\nconst generateMonthHeaders = (start: Date, end: Date): string[] => {\n  const result: string[] = []\n  const current = new Date(start)\n\n  while (current <= end) {\n    const formattedDate = formatDate(current, DATE_FORMATS_INTL.MONTH)\n    result.push(formattedDate)\n    current.setMonth(current.getMonth() + 1)\n  }\n\n  return result\n}\n\ninterface CategoryRow {\n  id: string\n  category: string\n  [key: string]: string | number // For dynamic month keys with string or number values\n}\n\ninterface TrendsTableProps {\n  sx?: any\n  height?: number | string\n  monthlyCategoryTotals: MonthlyCategoryTotals[]\n  selectedDateRange: { start: Date; end: Date }\n  selectedCategory?: string\n  onClickRow?: (category: string) => void\n}\n\nconst TrendsTable: React.FC<TrendsTableProps> = ({\n  monthlyCategoryTotals,\n  selectedDateRange,\n  selectedCategory,\n  onClickRow,\n  height = '100dvh',\n  sx = {},\n}) => {\n  const { onEvent } = useEvent()\n  const monthName = formatDate(new Date(), DATE_FORMATS_INTL.MONTH_SHORT)\n  const [sortModel, setSortModel] = React.useState<GridSortModel>([\n    { field: monthName, sort: 'desc' },\n  ])\n\n  // Generate all headers for the selected date range\n  const headerNames = React.useMemo(() => {\n    return generateMonthHeaders(selectedDateRange.start, selectedDateRange.end)\n  }, [selectedDateRange])\n\n  const columns: GridColDef[] = [\n    {\n      field: 'category',\n      headerName: 'Category',\n      minWidth: 175,\n      renderHeader: HeaderCell,\n      renderCell: CategoryCell,\n      sortable: true,\n      type: 'string',\n    },\n    ...headerNames.map(\n      (headerName) =>\n        ({\n          field: headerName,\n          headerName: headerName,\n          minWidth: 75,\n          renderHeader: HeaderCell,\n          renderCell: AmountCell,\n          align: 'right',\n          headerAlign: 'right',\n          sortable: true,\n          hideSortIcons: false,\n          type: 'number',\n          sortComparator: amountComparator,\n        }) as GridColDef,\n    ),\n  ]\n\n  const rows = React.useMemo(() => {\n    const selectedCategoryTotals = selectedCategory\n      ? monthlyCategoryTotals.filter(\n          (total) =>\n            total.category_guid === selectedCategory ||\n            total.top_level_category_guid === selectedCategory,\n        )\n      : monthlyCategoryTotals\n\n    const groupedTotals = selectedCategoryTotals.reduce(\n      (groups: Record<string, CategoryRow>, item) => {\n        const { category_guid, top_level_category_guid, month, total, year } = item\n\n        // Determine the grouping key based on selectedCategory\n        const groupKey = selectedCategory ? category_guid : top_level_category_guid\n\n        if (!groups[groupKey]) {\n          groups[groupKey] = {\n            id: groupKey,\n            category: groupKey,\n            category_guid,\n            top_level_category_guid,\n          }\n        }\n\n        // Format the month name and assign the total\n        const monthName = formatDate(new Date(year, month - 1), DATE_FORMATS_INTL.MONTH_SHORT)\n\n        // Accumulate totals for the month\n        if (!groups[groupKey][monthName]) {\n          groups[groupKey][monthName] = 0\n        }\n        groups[groupKey][monthName] = (groups[groupKey][monthName] as number) + total\n\n        return groups\n      },\n      {},\n    )\n\n    // Convert grouped totals into an array of rows\n    return Object.values(groupedTotals)\n  }, [monthlyCategoryTotals, selectedCategory])\n\n  return (\n    <Box sx={{ height: height, width: '100%', overflowX: 'auto', boxShadow: 'none', ...sx }}>\n      <DataGridPro\n        columns={columns}\n        disableColumnFilter={true}\n        disableColumnMenu={true}\n        hideFooter={true}\n        initialState={{ sorting: { sortModel } }}\n        onRowClick={(r) => {\n          onClickRow?.(r.row.category)\n          onEvent(ANALYTICS_EVENTS.TRENDS_CLICK_TABLE_ROW)\n        }}\n        onSortModelChange={(newModel) => {\n          setSortModel(newModel)\n          onEvent(ANALYTICS_EVENTS.TRENDS_CLICK_TABLE_SORT)\n        }}\n        rows={rows}\n        slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n        sortModel={sortModel}\n        sortingOrder={['asc', 'desc']}\n      />\n    </Box>\n  )\n}\n\nexport default TrendsTable\n"],"names":["generateMonthHeaders","start","end","result","current","formattedDate","formatDate","DATE_FORMATS_INTL","TrendsTable","monthlyCategoryTotals","selectedDateRange","selectedCategory","onClickRow","height","sx","onEvent","useEvent","monthName","sortModel","setSortModel","React","headerNames","columns","HeaderCell","CategoryCell","headerName","AmountCell","amountComparator","rows","groupedTotals","total","groups","item","category_guid","top_level_category_guid","month","year","groupKey","jsx","Box","DataGridPro","r","ANALYTICS_EVENTS","newModel"],"mappings":"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"}

package/dist/trends/components/TrendsViewToggle.js

@@ -0,0 +1,18 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Icon as e } from "@mxenabled/mxui";
+import a from "@mui/material/ToggleButton";
+import i from "@mui/material/ToggleButtonGroup";
+const p = ({ selectedTab: t, onTabChange: l }) => /* @__PURE__ */ o(
+  i,
+  {
+    exclusive: !0,
+    onChange: l,
+    orientation: "horizontal",
+    value: t,
+    children: ["Chart", "Table"].map((r) => /* @__PURE__ */ o(a, { color: "primary", sx: { width: 56 }, value: r, children: r === "Chart" ? /* @__PURE__ */ o(e, { name: "table_chart_view" }) : /* @__PURE__ */ o(e, { name: "format_list_bulleted" }) }, r))
+  }
+);
+export {
+  p as default
+};
+//# sourceMappingURL=TrendsViewToggle.js.map

package/dist/trends/components/TrendsViewToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrendsViewToggle.js","sources":["../../../src/trends/components/TrendsViewToggle.tsx"],"sourcesContent":["import { Icon } from '@mxenabled/mxui'\nimport ToggleButton from '@mui/material/ToggleButton'\nimport ToggleButtonGroup from '@mui/material/ToggleButtonGroup'\n\nexport type TrendsTabValue = 'Chart' | 'Table'\n\ninterface TrendsViewToggleProps {\n  selectedTab: TrendsTabValue\n  onTabChange: (_event: React.SyntheticEvent, newValue: TrendsTabValue) => void\n}\n\nconst TrendsViewToggle: React.FC<TrendsViewToggleProps> = ({ selectedTab, onTabChange }) => {\n  return (\n    <ToggleButtonGroup\n      exclusive={true}\n      onChange={onTabChange}\n      orientation=\"horizontal\"\n      value={selectedTab}\n    >\n      {['Chart', 'Table'].map((tab) => (\n        <ToggleButton color=\"primary\" key={tab} sx={{ width: 56 }} value={tab}>\n          {tab === 'Chart' ? (\n            <Icon name=\"table_chart_view\" />\n          ) : (\n            <Icon name=\"format_list_bulleted\" />\n          )}\n        </ToggleButton>\n      ))}\n    </ToggleButtonGroup>\n  )\n}\n\nexport default TrendsViewToggle\n"],"names":["TrendsViewToggle","selectedTab","onTabChange","jsx","ToggleButtonGroup","tab","ToggleButton","Icon"],"mappings":";;;;AAWA,MAAMA,IAAoD,CAAC,EAAE,aAAAC,GAAa,aAAAC,QAEtE,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAW;AAAA,IACX,UAAUF;AAAA,IACV,aAAY;AAAA,IACZ,OAAOD;AAAA,IAEN,UAAC,CAAA,SAAS,OAAO,EAAE,IAAI,CAACI,MACvB,gBAAAF,EAACG,GAAa,EAAA,OAAM,WAAoB,IAAI,EAAE,OAAO,GAAA,GAAM,OAAOD,GAC/D,UAAAA,MAAQ,UACP,gBAAAF,EAACI,KAAK,MAAK,mBAAA,CAAmB,IAE9B,gBAAAJ,EAACI,GAAK,EAAA,MAAK,uBAAuB,CAAA,EAAA,GAJHF,CAMnC,CACD;AAAA,EAAA;AAAA;"}

package/dist/trends/components/trendstable/AmountCell.js

@@ -0,0 +1,11 @@
+import { jsx as e } from "react/jsx-runtime";
+import o from "@mui/material/Stack";
+import { CurrencyText as r } from "../../../common/components/CurrencyText.js";
+const x = (t) => {
+  const n = t.row[t.field];
+  return /* @__PURE__ */ e(o, { alignItems: "flex-end", tabIndex: t.tabIndex, children: /* @__PURE__ */ e(r, { amount: n, variant: "Small" }) });
+};
+export {
+  x as AmountCell
+};
+//# sourceMappingURL=AmountCell.js.map

package/dist/trends/components/trendstable/AmountCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AmountCell.js","sources":["../../../../src/trends/components/trendstable/AmountCell.tsx"],"sourcesContent":["import { GridCellParams } from '@mui/x-data-grid'\nimport Stack from '@mui/material/Stack'\n\nimport { CurrencyText } from '../../../common/components/CurrencyText'\n\nexport const AmountCell = (params: GridCellParams) => {\n  const amount = params.row[params.field]\n\n  return (\n    <Stack alignItems=\"flex-end\" tabIndex={params.tabIndex}>\n      <CurrencyText amount={amount} variant=\"Small\" />\n    </Stack>\n  )\n}\n"],"names":["AmountCell","params","amount","jsx","Stack","CurrencyText"],"mappings":";;;AAKa,MAAAA,IAAa,CAACC,MAA2B;AACpD,QAAMC,IAASD,EAAO,IAAIA,EAAO,KAAK;AAEtC,SACG,gBAAAE,EAAAC,GAAA,EAAM,YAAW,YAAW,UAAUH,EAAO,UAC5C,UAAA,gBAAAE,EAACE,GAAa,EAAA,QAAAH,GAAgB,SAAQ,QAAA,CAAQ,EAChD,CAAA;AAEJ;"}