@mx-cartographer/experiences 9.0.0-alpha.mega1 → 9.0.0-ram1-bug-alpha-testing

package/dist/SpendingLegend-5Ct_FZ8o.mjs

@@ -0,0 +1,193 @@
+import { g as _ } from "./TransactionUtils-BphBJBbU.mjs";
+import { C as p } from "./Category-DEKZGLYe.mjs";
+import { jsxs as f, Fragment as N, jsx as d } from "react/jsx-runtime";
+import T from "react";
+import { observer as k } from "mobx-react-lite";
+import S from "@mui/material/Box";
+import A from "@mui/material/Button";
+import h from "@mui/material/Stack";
+import { useTheme as M } from "@mui/material/styles";
+import { CategoryIcon as G, CategoryIconVariants as O, Text as y, P as $ } from "@mxenabled/mxui";
+import { f as b } from "./NumberFormatting--XMeeBfr.mjs";
+import { D as j } from "./Donut-SzzfZDHF.mjs";
+import { u as R } from "./useAriaLive-MkYebyUR.mjs";
+import { u as v } from "./hooks-BaO_gOI6.mjs";
+import { u as V } from "./useScreenSize-mWpmnh5w.mjs";
+const D = 5, B = (i, l, s, m) => m.reduce((o, n) => {
+  const r = i.find((u) => u.guid === n.category_guid);
+  if (!r) return o;
+  const t = r.parent_guid ?? r.guid, a = i.find((u) => u.guid === t);
+  if (!a || n.total <= 0) return o;
+  const c = {
+    guid: r.guid,
+    name: r.guid === t ? `${l.parent_category_totals_label_general} ${r.name}` : r.name,
+    color: _(a.guid, s),
+    amount: n.total
+  }, e = o.find((u) => u.guid === t);
+  return e ? (e.amount += n.total, e.categoryTotals?.push(c)) : o.push({
+    guid: t,
+    name: a.name,
+    color: _(a.guid, s),
+    categoryTotals: [c],
+    amount: n.total
+  }), o;
+}, []), nt = (i, l, s, m) => {
+  const n = B(i, l, s, m).filter(
+    (e) => e.guid !== p.INCOME && e.guid !== p.INVESTMENTS && e.guid !== p.TRANSFER && e.amount > 0
+  ).sort((e, u) => u.amount - e.amount), r = n.reduce(
+    (e, u) => e + u.amount,
+    0
+  ), t = n.length > D ? D : n.length, a = n.slice(0, t), c = a.map((e) => ({
+    id: e.guid,
+    color: _(e.guid, s),
+    label: e.name,
+    value: e.amount / r * 100
+  }));
+  if (n.length > 5) {
+    const e = n.slice(D), u = e.reduce(
+      (C, g) => C + g.amount,
+      0
+    );
+    a.push({
+      guid: "other",
+      color: s.palette.categories.others || "",
+      name: l.saving_goal_other,
+      categoryTotals: e,
+      amount: u
+    }), c.push({
+      id: "other",
+      color: s.palette.categories.others || "",
+      label: l.saving_goal_other,
+      value: u / r * 100
+    });
+  }
+  return {
+    categoryData: a,
+    donutData: c,
+    totalAmount: r
+  };
+}, et = (i, l, s) => {
+  const m = i.filter(
+    (t) => t.guid === p.INCOME || t.parent_guid === p.INCOME
+  ), o = l.filter((t) => m.some((a) => a.guid === t.category_guid)).sort((t, a) => t.total - a.total).map((t, a) => ({
+    guid: t.category_guid,
+    name: i.find((c) => c.guid === t.category_guid)?.name,
+    color: s[a % s.length],
+    categoryTotals: [],
+    amount: Math.abs(t.total)
+  })), n = o.reduce(
+    (t, a) => t + a.amount,
+    0
+  ), r = o.map((t) => ({
+    id: t.guid,
+    color: t.color,
+    label: t.name,
+    value: t.amount / n * 100
+  }));
+  return {
+    categoryData: o,
+    donutData: r,
+    totalAmount: n
+  };
+}, P = ({
+  data: i,
+  isIncome: l = !1,
+  onSelected: s,
+  onViewTransactions: m,
+  selectedId: o,
+  size: n = 150,
+  totalLabel: r,
+  variant: t = "mini"
+}) => {
+  const { spending: a } = v(), c = M(), { isTablet: e } = V(), { announce: u, ariaLive: C } = R(), g = T.useMemo(
+    () => o ? i.categoryData.find((x) => x.guid === o) : void 0,
+    [o]
+  );
+  T.useEffect(() => {
+    if (g) {
+      const x = b(g.amount, t === "mini" ? "0,0" : "0,0.00");
+      u(`${g.name}: ${x}`);
+    }
+  }, [g, u, t]);
+  const E = i.donutData.length > 0 ? i.donutData : [{ id: "0", color: c.palette.divider, value: 100 }], I = () => {
+    m?.(o);
+  }, w = e ? 32 : 48;
+  return /* @__PURE__ */ f(N, { children: [
+    C,
+    /* @__PURE__ */ d(j, { data: E, onClick: s, selectedId: o, size: n, children: /* @__PURE__ */ d(h, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ f(h, { alignItems: "center", justifyContent: "center", minHeight: n, minWidth: n, children: [
+      g && /* @__PURE__ */ f(
+        h,
+        {
+          alignItems: "center",
+          gap: t === "mini" ? 0 : 8,
+          mb: t === "mini" ? 0 : 8,
+          mt: t === "mini" ? 0 : -16,
+          sx: t === "mini" ? { gap: 0, mb: 0 } : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } },
+          children: [
+            /* @__PURE__ */ d(S, { "aria-hidden": "true", role: "presentation", children: /* @__PURE__ */ d(
+              G,
+              {
+                categoryGuid: l ? p.INCOME : g.guid,
+                size: t === "mini" ? 24 : w,
+                variant: O.Transparent
+              }
+            ) }),
+            /* @__PURE__ */ d(
+              y,
+              {
+                color: "text.secondary",
+                noWrap: !0,
+                variant: t === "mini" ? "tiny" : "body1",
+                children: g ? g.name : r
+              }
+            )
+          ]
+        }
+      ),
+      !g && t === "full" && /* @__PURE__ */ d(y, { bold: !0, color: "text.secondary", sx: { mb: { xs: 4, xl: 8 } }, children: r }),
+      /* @__PURE__ */ d($, { variant: t === "mini" ? "h2" : "h1", children: g ? b(g.amount, t === "mini" ? "0,0" : "0,0.00") : b(i.totalAmount, t === "mini" ? "0,0" : "0,0.00") }),
+      !g && t === "mini" && /* @__PURE__ */ d(y, { color: "text.secondary", noWrap: !0, variant: "tiny", children: r }),
+      t === "full" && /* @__PURE__ */ d(
+        A,
+        {
+          "aria-label": `View ${g?.name || ""} Transactions`,
+          disabled: i.categoryData.length === 0,
+          onClick: I,
+          sx: { mt: { xl: 4, xs: 0 }, zIndex: 1 },
+          variant: "text",
+          children: a.view_transactions
+        }
+      )
+    ] }) }) })
+  ] });
+}, at = k(P), rt = ({ data: i, onSelected: l, selectedId: s }) => {
+  const m = (o, n) => {
+    (o.key === "Enter" || o.key === " ") && (o.preventDefault(), l(n));
+  };
+  return /* @__PURE__ */ d(h, { gap: 8, height: "100%", justifyContent: "center", my: "auto", children: i.categoryData.map((o) => /* @__PURE__ */ f(
+    h,
+    {
+      alignItems: "center",
+      "aria-label": o.name,
+      "aria-pressed": o.guid === s,
+      direction: "row",
+      gap: 8,
+      onClick: () => l(o.guid),
+      onKeyDown: (n) => m(n, o.guid),
+      role: "button",
+      sx: { cursor: "pointer", touchAction: "manipulation" },
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ d(S, { borderRadius: 4, height: 8, sx: { backgroundColor: o.color }, width: 8 }),
+        /* @__PURE__ */ d(y, { bold: o.guid === s, variant: "caption", children: o.name })
+      ]
+    },
+    o.guid
+  )) });
+};
+export {
+  at as S,
+  et as a,
+  rt as b,
+  nt as g
+};

package/dist/ToggleListItem-Dl1lXNwj.mjs

@@ -0,0 +1,91 @@
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import l from "@mui/material/ListItem";
+import f from "@mui/material/ListItemButton";
+import g from "@mui/material/ListItemIcon";
+import d from "@mui/material/ListItemText";
+import a from "@mui/material/Stack";
+import p from "@mui/material/Switch";
+import { Text as s } from "@mxenabled/mxui";
+import I from "@mui/material/ListItemAvatar";
+const S = ({
+  avatar: r,
+  endIcon: o,
+  isChecked: c,
+  isDisabled: i = !1,
+  isPrimaryTextBold: n = !1,
+  onClick: e,
+  onToggle: h,
+  primaryText: x,
+  secondaryText: y
+}) => (
+  //TODO: implement common/components/ListItemRow.tsx
+  /* @__PURE__ */ t(
+    l,
+    {
+      secondaryAction: /* @__PURE__ */ t(p, { checked: c, onChange: h }),
+      sx: {
+        "& .MuiListItemSecondaryAction-root": { right: o ? 64 : 24 },
+        "& .MuiListItemButton-root": { pr: 24 }
+      },
+      children: /* @__PURE__ */ m(f, { onClick: i ? void 0 : () => e(), children: [
+        r && /* @__PURE__ */ t(I, { children: r }),
+        /* @__PURE__ */ t(d, { slotProps: { primary: { fontWeight: 400 } }, children: /* @__PURE__ */ t(a, { alignItems: "center", direction: "row", justifyContent: "space-between", children: /* @__PURE__ */ m(a, { sx: { width: "100%" }, children: [
+          /* @__PURE__ */ t(
+            s,
+            {
+              bold: n,
+              color: "text.primary",
+              sx: {
+                mr: 80
+              },
+              variant: "body1",
+              children: x
+            }
+          ),
+          /* @__PURE__ */ t(s, { color: "text.secondary", variant: "caption", children: y })
+        ] }) }) }),
+        !i && o && /* @__PURE__ */ t(g, { children: o })
+      ] })
+    }
+  )
+), W = ({
+  isChecked: r,
+  isDisabled: o = !1,
+  onToggle: c,
+  primaryText: i,
+  secondaryText: n = void 0,
+  useExtraPadding: e = !0
+}) => /* @__PURE__ */ t(
+  l,
+  {
+    secondaryAction: /* @__PURE__ */ t(p, { checked: r, disabled: o, onChange: c }),
+    sx: {
+      pl: e ? 48 : 0,
+      "& .MuiListItemSecondaryAction-root": { right: e ? 64 : 24 }
+    },
+    children: /* @__PURE__ */ t(
+      d,
+      {
+        primary: i,
+        secondary: n,
+        slotProps: {
+          primary: {
+            fontWeight: 400,
+            variant: "body1",
+            maxWidth: "calc(100% - 60px)",
+            color: "text.primary"
+          },
+          secondary: {
+            color: "text.secondary",
+            maxWidth: "calc(100% - 60px)",
+            variant: "caption"
+          }
+        }
+      }
+    )
+  }
+);
+export {
+  S as T,
+  W as a
+};