@mx-cartographer/experiences 7.0.22 → 7.0.23-alpha.al0

package/dist/trends/index.es.js

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as f, Fragment as Fe } from "react/jsx-runtime";
 import i from "react";
 import { observer as M } from "mobx-react-lite";
-import { Icon as se, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as Pe } from "@mxenabled/mxui";
+import { Icon as re, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as Pe } from "@mxenabled/mxui";
 import O from "@mui/material/Box";
 import _ from "@mui/material/Stack";
 import pe from "@mui/material/Button";
@@ -12,7 +12,7 @@ import { T as eo } from "../TrendsStore-WrHxzdbQ.mjs";
 import { i as Ue, c as Xe, d as Ze, e as Qe, f as qe, h as Je, b as Le, g as xe, j as _e } from "../SpendingData-D5vsfYKo.mjs";
 import et from "@mui/material/ToggleButton";
 import tt from "@mui/material/ToggleButtonGroup";
-import { u as R, k as F, e as H, a as P, f as re, c as ae, v as q, l as ve, p as nt, m as ot } from "../hooks-DkUqN6JE.mjs";
+import { u as R, k as F, e as H, a as P, f as ae, c as ie, v as q, l as ve, p as nt, m as ot } from "../hooks-DkUqN6JE.mjs";
 import { u as K } from "../useScreenSize-B6JyS_Lj.mjs";
 import { f as Z, D as B } from "../Dialog-CWW597AF.mjs";
 import { DataGridPro as st } from "@mui/x-data-grid-pro";
@@ -52,7 +52,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     onChange: o,
     orientation: "horizontal",
     value: n,
-    children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(et, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(se, { name: "table_chart_view" }) : /* @__PURE__ */ e(se, { name: "format_list_bulleted" }) }, t))
+    children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(et, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(re, { name: "table_chart_view" }) : /* @__PURE__ */ e(re, { name: "format_list_bulleted" }) }, t))
   }
 ), Oe = ({ selectedDateRange: n, selectedCategoryGuid: o }) => {
   const { trends: t } = R(), { isMobile: s, isDesktop: a } = K(), { getCategoryName: h } = F(), l = i.useMemo(() => {
@@ -200,7 +200,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
   isOpen: t,
   onClose: s
 }) => {
-  const { onEvent: a } = H(), { selectedAccountGuids: h } = P(), { common: l } = R(), { setFilter: c, sortedTransactions: d } = re(), [m, C] = i.useState(""), u = i.useMemo(
+  const { onEvent: a } = H(), { selectedAccountGuids: h } = P(), { common: l } = R(), { setFilter: c, sortedTransactions: d } = ae(), [m, C] = i.useState(""), u = i.useMemo(
     () => d.find((r) => r.guid === m),
     [m, d]
   );
@@ -229,9 +229,9 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     }
   );
 }, Wt = M(Nt), Ot = ({ onBackClick: n, sx: o }) => {
-  const { onEvent: t } = H(), { isDesktop: s, isTablet: a, isMobile: h } = K(), { visibleAccounts: l } = ae(), { loadMonthlyCategoryTotals: c, monthlyCategoryTotals: d, getCategoryName: m } = F(), { sortedTransactions: C } = re(), { selectedDateRange: u, setSelectedDateRange: b } = q(), { isCopyLoaded: r, isInitialized: g, selectedAccounts: T, setSelectedAccounts: p } = P(), { trends: E } = R(), [w, I] = i.useState(!1), [k, D] = i.useState(!1), [N, x] = i.useState("Chart"), [L, $] = i.useState(""), [z, ie] = i.useState(window.innerHeight), ee = z - (h ? 315 : 345);
+  const { onEvent: t } = H(), { isDesktop: s, isTablet: a, isMobile: h } = K(), { visibleAccounts: l } = ie(), { loadMonthlyCategoryTotals: c, monthlyCategoryTotals: d, getCategoryName: m } = F(), { sortedTransactions: C } = ae(), { selectedDateRange: u, setSelectedDateRange: b } = q(), { isCopyLoaded: r, isInitialized: g, selectedAccounts: T, setSelectedAccounts: p } = P(), { trends: E } = R(), [w, I] = i.useState(!1), [k, D] = i.useState(!1), [N, x] = i.useState("Chart"), [L, $] = i.useState(""), [z, ce] = i.useState(window.innerHeight), ee = z - (h ? 315 : 345);
   i.useEffect(() => {
-    const S = () => ie(window.innerHeight);
+    const S = () => ce(window.innerHeight);
     return window.addEventListener("resize", S), () => window.removeEventListener("resize", S);
   }, []), i.useEffect(() => {
     p(l);
@@ -264,9 +264,9 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     b({ start: W, end: G }), t(y.TRENDS_CLICK_TIME_WINDOW, {
       time_period: ge + "M"
     });
-  }, ce = () => {
+  }, le = () => {
     t(y.TRENDS_CLICK_FILTER);
-  }, le = (S) => {
+  }, se = (S) => {
     $(S);
   }, de = (S) => {
     $(S), t(y.TRENDS_CLICK_LEGEND, { category: m(S) });
@@ -284,7 +284,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
       calendarActions: { onRangeChanged: oe },
       dateRange: u,
       dateRangeVariant: "timeframebuttons",
-      onAccountsFilterClick: ce,
+      onAccountsFilterClick: le,
       onBackClick: n,
       sx: o,
       title: E.title,
@@ -317,7 +317,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
               ),
               /* @__PURE__ */ f(_, { alignItems: "center", flexDirection: "row", width: "100%", children: [
                 /* @__PURE__ */ e(O, { flexGrow: 1, children: L && /* @__PURE__ */ f(pe, { onClick: () => $(""), sx: { p: 0, pr: 5 }, children: [
-                  /* @__PURE__ */ e(se, { name: "arrow_back" }),
+                  /* @__PURE__ */ e(re, { name: "arrow_back" }),
                   E.all_categories
                 ] }) }),
                 /* @__PURE__ */ e(pe, { onClick: () => D(!0), sx: { px: 5 }, children: `${E.view_transactions} (${C.length})` })
@@ -339,7 +339,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
                   Ve,
                   {
                     monthlyCategoryTotals: d,
-                    onClickRow: le,
+                    onClickRow: se,
                     selectedCategory: L,
                     selectedDateRange: u
                   }
@@ -379,7 +379,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     }
   );
 }, Gt = M(Vt), Bt = ({ onPrimaryCtaClick: n, sx: o }) => {
-  const { visibleAccounts: t } = ae(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: a } = F(), { isInitialized: h } = ve(), { trends: l } = R(), { isCopyLoaded: c, selectedAccounts: d, setSelectedAccounts: m } = P();
+  const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: a } = F(), { isInitialized: h } = ve(), { trends: l } = R(), { isCopyLoaded: c, selectedAccounts: d, setSelectedAccounts: m } = P();
   return i.useEffect(() => {
     m(t);
   }, [t]), i.useEffect(() => {
@@ -489,7 +489,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     ] })
   ] });
 }), Zn = M(({ onCtaClick: n }) => {
-  const { visibleAccounts: o } = ae(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: h } = F(), l = {
+  const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: h } = F(), l = {
     start: lt(/* @__PURE__ */ new Date(), 1),
     end: /* @__PURE__ */ new Date()
   }, { trends: c } = R(), { selectedAccounts: d, setSelectedAccounts: m, isInitialized: C } = P();
@@ -754,7 +754,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     }
   ) });
 }), Xt = M(({ onClose: n }) => {
-  const o = Ne(), { onEvent: t } = H(), { common: s, trends: a } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: l } = q(), { sortedTransactions: c } = re(), [d, m] = i.useState(null);
+  const o = Ne(), { onEvent: t } = H(), { common: s, trends: a } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: l } = q(), { sortedTransactions: c } = ae(), [d, m] = i.useState(null);
   if (!h)
     return null;
   const { guid: C, name: u, is_income: b, totalAmount: r } = h, g = b ? a.category_income : a.category_spending, T = Lt(C, o), p = b ? a.income_label : a.spending_label, E = ` ${h.transactions.length === 1 ? a.transaction : a.transactions} (${h.transactions.length})`, w = i.useMemo(
@@ -860,15 +860,15 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     }
   );
 }, Jt = M(qt), en = ({ onBackClick: n, onInsightCardClick: o, sx: t }) => {
-  const { onEvent: s } = H(), { config: a } = ot(), { isLargeDesktop: h, isDesktop: l, isMobile: c } = K(), { visibleAccounts: d } = ae(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = F(), { setFilter: b } = re(), { selectedDateRange: r, setSelectedCategoryData: g, setSelectedDateRange: T } = q(), {
+  const { onEvent: s } = H(), { config: a } = ot(), { isLargeDesktop: h, isDesktop: l, isMobile: c } = K(), { visibleAccounts: d } = ie(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = F(), { setFilter: b } = ae(), { selectedDateRange: r, setSelectedCategoryData: g, setSelectedDateRange: T } = q(), {
     isCopyLoaded: p,
     isInitialized: E,
     selectedAccounts: w,
     selectedAccountGuids: I,
     setSelectedAccounts: k
-  } = P(), { trends: D } = R(), N = Ye(), x = l || h, [L, $] = i.useState(!1), [z, ie] = i.useState("Chart"), [J, ee] = i.useState(""), [te, ne] = i.useState(!1), [oe, ce] = i.useState(window.innerHeight), le = oe - 208, de = oe - (N ? 494 : 266);
+  } = P(), { trends: D } = R(), N = Ye(), x = l || h, [L, $] = i.useState(!1), [z, ce] = i.useState("Chart"), [J, ee] = i.useState(""), [te, ne] = i.useState(!1), [oe, le] = i.useState(window.innerHeight), se = oe - 208, de = oe - (N ? 494 : 266);
   i.useEffect(() => {
-    const v = () => ce(window.innerHeight);
+    const v = () => le(window.innerHeight);
     return window.addEventListener("resize", v), () => window.removeEventListener("resize", v);
   }, []), i.useEffect(() => {
     k(d);
@@ -904,7 +904,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
   }, ue = () => {
     g(null), ne(!1);
   }, me = (v, V) => {
-    ie(V ?? z), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
+    ce(V ?? z), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
       ...A,
       toggleView: V
     });
@@ -923,10 +923,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
     ee(v);
   }, ge = () => {
     ee(""), s(y.TRENDS_CLICK_ALL_CATEGORIES, A);
-  };
-  if (!p || !L) return /* @__PURE__ */ e(Q, {});
-  const Ge = a.show_connections_widget_in_master ? "buttons" : "no-buttons", Be = L && d.length === 0;
-  return /* @__PURE__ */ f(
+  }, Ge = a.show_connections_widget_in_master ? "buttons" : "no-buttons", Be = L && !d?.length;
+  return !p || !L ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
     Ae,
     {
       accountOptions: d,
@@ -937,86 +935,84 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
       onBackClick: n,
       sx: t,
       title: D.title,
-      children: [
-        /* @__PURE__ */ f(
-          _,
-          {
-            sx: {
-              px: c ? 0 : 48
-            },
-            children: [
-              /* @__PURE__ */ f(
-                _,
-                {
-                  flexDirection: "row",
-                  justifyContent: "space-between",
-                  sx: { pb: c ? 12 : 24, pt: c ? 24 : 48 },
-                  children: [
-                    /* @__PURE__ */ e(
-                      Oe,
-                      {
-                        selectedCategoryGuid: J,
-                        selectedDateRange: r
-                      }
-                    ),
-                    /* @__PURE__ */ e(We, { onTabChange: me, selectedTab: z })
-                  ]
-                }
-              ),
-              Be && /* @__PURE__ */ e(
-                vt,
-                {
-                  header: "",
-                  icon: "",
-                  onClick: () => {
-                  },
-                  primaryButton: D.empty_state_primary,
-                  subText: D.empty_state_sub_text,
-                  variant: Ge
-                }
-              ),
-              /* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: J && /* @__PURE__ */ f(pe, { onClick: ge, sx: { p: 0, pr: 5 }, children: [
-                /* @__PURE__ */ e(se, { name: "arrow_back" }),
-                D.all_categories
-              ] }) }) }),
-              /* @__PURE__ */ f(_, { flexDirection: x ? "row" : "column", gap: x ? 48 : 16, children: [
-                z === "Chart" && /* @__PURE__ */ f(Fe, { children: [
-                  /* @__PURE__ */ e(O, { sx: { width: x ? "68%" : "100%" }, children: /* @__PURE__ */ e(
-                    Jt,
+      children: Be ? /* @__PURE__ */ e(
+        vt,
+        {
+          header: D.zero_state_content_header,
+          icon: "",
+          onClick: () => {
+          },
+          primaryButton: D.empty_state_primary,
+          subText: D.empty_state_sub_text,
+          sx: { height: se },
+          variant: Ge
+        }
+      ) : /* @__PURE__ */ f(
+        _,
+        {
+          sx: {
+            px: c ? 0 : 48
+          },
+          children: [
+            /* @__PURE__ */ f(
+              _,
+              {
+                flexDirection: "row",
+                justifyContent: "space-between",
+                sx: { pb: c ? 12 : 24, pt: c ? 24 : 48 },
+                children: [
+                  /* @__PURE__ */ e(
+                    Oe,
                     {
-                      availableHeight: le,
-                      minHeight: 450,
-                      selectedDateRange: r,
-                      totals: u
+                      selectedCategoryGuid: J,
+                      selectedDateRange: r
                     }
-                  ) }),
-                  /* @__PURE__ */ f(_, { gap: 16, sx: { width: x ? "32%" : "100%" }, children: [
-                    N && /* @__PURE__ */ e(Yt, { onInsightCardClick: o }),
-                    /* @__PURE__ */ e(
-                      Kt,
-                      {
-                        availableHeight: de,
-                        onCategoryClick: he
-                      }
-                    )
-                  ] })
-                ] }),
-                z === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
-                  Ve,
+                  ),
+                  /* @__PURE__ */ e(We, { onTabChange: me, selectedTab: z })
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: J && /* @__PURE__ */ f(pe, { onClick: ge, sx: { p: 0, pr: 5 }, children: [
+              /* @__PURE__ */ e(re, { name: "arrow_back" }),
+              D.all_categories
+            ] }) }) }),
+            /* @__PURE__ */ f(_, { flexDirection: x ? "row" : "column", gap: x ? 48 : 16, children: [
+              z === "Chart" && /* @__PURE__ */ f(Fe, { children: [
+                /* @__PURE__ */ e(O, { sx: { width: x ? "68%" : "100%" }, children: /* @__PURE__ */ e(
+                  Jt,
                   {
-                    height: "unset",
-                    monthlyCategoryTotals: u,
-                    onClickRow: G,
-                    selectedCategory: J,
-                    selectedDateRange: r
+                    availableHeight: se,
+                    minHeight: 450,
+                    selectedDateRange: r,
+                    totals: u
                   }
-                ) })
-              ] })
-            ]
-          }
-        ),
-        te && /* @__PURE__ */ e(Xt, { onClose: ue })
-      ]
+                ) }),
+                /* @__PURE__ */ f(_, { gap: 16, sx: { width: x ? "32%" : "100%" }, children: [
+                  N && /* @__PURE__ */ e(Yt, { onInsightCardClick: o }),
+                  /* @__PURE__ */ e(
+                    Kt,
+                    {
+                      availableHeight: de,
+                      onCategoryClick: he
+                    }
+                  )
+                ] })
+              ] }),
+              z === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
+                Ve,
+                {
+                  height: "unset",
+                  monthlyCategoryTotals: u,
+                  onClickRow: G,
+                  selectedCategory: J,
+                  selectedDateRange: r
+                }
+              ) })
+            ] }),
+            te && /* @__PURE__ */ e(Xt, { onClose: ue })
+          ]
+        }
+      )
     }
   );
 }, Qn = M(en);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-cartographer/experiences",
-  "version": "7.0.22",
+  "version": "7.0.23-alpha.al0",
   "description": "Library containing experience widgets",
   "author": "MX",
   "license": "MIT",