@mxenabled/mxui 1.0.2-alpha.JB0 → 1.0.3-alpha.JB0

package/dist/index.es.js

@@ -1,32 +1,32 @@
 import { jsx as a, jsxs as y } from "react/jsx-runtime";
 import m from "react";
 import k from "@mui/material/Stack";
-import { useTheme as C, createTheme as P } from "@mui/material/styles";
+import { useTheme as T, createTheme as O } from "@mui/material/styles";
 import j from "@mui/material/Icon";
-import { endOfMonth as S } from "date-fns/endOfMonth";
+import { endOfMonth as H } from "date-fns/endOfMonth";
 import { endOfYear as X } from "date-fns/endOfYear";
 import { startOfToday as Y } from "date-fns/startOfToday";
-import { startOfMonth as F } from "date-fns/startOfMonth";
-import { startOfYear as w } from "date-fns/startOfYear";
+import { startOfMonth as w } from "date-fns/startOfMonth";
+import { startOfYear as F } from "date-fns/startOfYear";
 import { subDays as R } from "date-fns/subDays";
 import { subMonths as Q } from "date-fns/subMonths";
 import { subYears as J } from "date-fns/subYears";
 import q from "@mui/material/useMediaQuery";
 import { LocalizationProvider as e0, StaticDateRangePicker as r0 } from "@mui/x-date-pickers-pro";
 import { AdapterDateFns as t0 } from "@mui/x-date-pickers-pro/AdapterDateFnsV3";
-import L from "@mui/material/Box";
+import E from "@mui/material/Box";
 import o0 from "@mui/material/ToggleButton";
 import a0 from "@mui/material/ToggleButtonGroup";
 import B from "@mui/material/Slide";
 import D from "@mui/material/Button";
-import O from "@mui/material/Toolbar";
-import _ from "@mui/material/IconButton";
+import _ from "@mui/material/Toolbar";
+import V from "@mui/material/IconButton";
 import i0 from "@mui/material/Drawer";
 import n0 from "@mui/material/Typography";
 import l0 from "@mui/material/TextField";
 import c0 from "@mui/material/Snackbar";
 import s0 from "@mui/material/Alert";
-import { light as V, buildTheme as E, dark as d0 } from "@mxenabled/design-tokens";
+import { light as P, buildTheme as L, dark as d0 } from "@mxenabled/design-tokens";
 import { LicenseInfo as u0 } from "@mui/x-license-pro";
 import { circularProgressClasses as p0 } from "@mui/material/CircularProgress";
 import h0 from "@mui/material/styles/createPalette";
@@ -51,7 +51,7 @@ const h = ({
   }
 );
 var m0 = /* @__PURE__ */ ((e) => (e[e.Lighter = 100] = "Lighter", e[e.Light = 200] = "Light", e[e.Normal = 300] = "Normal", e[e.Dark = 400] = "Dark", e[e.Darker = 500] = "Darker", e))(m0 || {});
-const b = ({
+const f = ({
   color: e,
   fill: o = !1,
   name: r,
@@ -60,10 +60,10 @@ const b = ({
   weight: i = 300,
   ...n
 }) => {
-  const [c, f] = m.useState(!1);
+  const [c, b] = m.useState(!1);
   return m.useEffect(() => {
     document.fonts.ready.then(() => {
-      f(!0);
+      b(!0);
     });
   }, []), /* @__PURE__ */ a(
     j,
@@ -88,7 +88,7 @@ const b = ({
       children: r
     }
   );
-}, se = ({
+}, de = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -97,7 +97,7 @@ const b = ({
     d: "M2.24801 6.76647H0.573286C0.327604 6.76647 0.110586 6.60678 0.0327867 6.37748C-0.0450124 6.14408 0.0327866 5.88612 0.229332 5.73871L7.6571 0.116699C7.85774 -0.0388996 8.14027 -0.0388996 8.34501 0.116699L15.7728 5.73871C15.9693 5.89021 16.0471 6.14408 15.9693 6.37748C15.8915 6.61088 15.6745 6.76647 15.4288 6.76647H13.7582V12.323H14.3929C14.7122 12.323 14.9661 12.5809 14.9661 12.8962C14.9661 13.2156 14.7082 13.4695 14.3929 13.4695H1.60924C1.28986 13.4695 1.03599 13.2115 1.03599 12.8962C1.03599 12.5768 1.29395 12.323 1.60924 12.323H2.24801V6.76647ZM5.70393 6.76647H3.39043V12.323H5.70393V6.76647ZM9.15985 12.323V6.76647H6.84635V12.323H9.15985ZM10.3023 12.3189H12.6158V6.76647H10.3023V12.3189ZM0.573256 14.8535H15.4288C15.7441 14.8535 15.998 15.1115 15.998 15.4267C15.998 15.7461 15.74 16 15.4247 16H0.573256C0.253871 16 0 15.742 0 15.4267C0 15.1074 0.257965 14.8535 0.573256 14.8535Z",
     fill: e
   }
-) })), de = ({
+) })), ue = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -106,7 +106,7 @@ const b = ({
     d: "M15.429 14.854H.573a.572.572 0 100 1.146h14.852a.572.572 0 00.004-1.146zM.573 6.766h1.675v5.557h-.639a.572.572 0 100 1.146h12.784a.572.572 0 100-1.146h-.635V6.766h1.67a.568.568 0 00.541-.389.574.574 0 00-.196-.638L8.345.117a.565.565 0 00-.688 0L.23 5.739a.572.572 0 00.344 1.027zm2.817 0h2.314v5.557H3.39V6.766zm5.77 0v5.557H6.846V6.766H9.16zm3.456 5.553h-2.314V6.766h2.314v5.553zM8 1.288l5.724 4.336H2.277L8 1.288z",
     fill: e
   }
-) })), ue = ({
+) })), pe = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -115,7 +115,7 @@ const b = ({
     d: "M5.854 3.133a.426.426 0 010 .643L1.757 7.5h13.774c.26 0 .469.224.469.5s-.21.5-.469.5H1.757l4.097 3.724a.426.426 0 010 .643.536.536 0 01-.708 0l-5-4.546a.426.426 0 010-.642l5-4.546a.536.536 0 01.708 0z",
     fill: e
   }
-) })), pe = ({
+) })), he = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -126,7 +126,7 @@ const b = ({
     fill: e,
     fillRule: "evenodd"
   }
-) })), he = ({
+) })), ge = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -135,7 +135,7 @@ const b = ({
     d: "M11.5 0a.5.5 0 01.5.5V2h2.5A1.5 1.5 0 0116 3.5v11a1.5 1.5 0 01-1.5 1.5h-13A1.5 1.5 0 010 14.5v-11A1.5 1.5 0 011.5 2H4V.5a.5.5 0 011 0V2h6V.5a.5.5 0 01.5-.5zM15 6H1v8.5a.5.5 0 00.5.5h13a.5.5 0 00.5-.5V6zm-4.5 1a.5.5 0 01.5.5V10h2.5a.5.5 0 010 1H11v2.5a.5.5 0 01-1 0V11H6v2.5a.5.5 0 01-1 0V11H2.5a.5.5 0 010-1H5V7.5a.5.5 0 011 0V10h4V7.5a.5.5 0 01.5-.5zm4-4h-13a.5.5 0 00-.5.5V5h14V3.5a.5.5 0 00-.5-.5z",
     fill: e
   }
-) })), ge = ({
+) })), me = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -144,7 +144,7 @@ const b = ({
     d: "M8 0c4.4 0 8 3.6 8 8s-3.6 8-8 8-8-3.6-8-8 3.6-8 8-8zm4.358 5.151a.5.5 0 00-.707-.01L6.858 9.803 4.35 7.363a.5.5 0 10-.698.718l2.858 2.777a.5.5 0 00.697 0l5.142-5a.5.5 0 00.01-.707z",
     fill: e
   }
-) })), me = ({
+) })), be = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -162,7 +162,7 @@ const b = ({
     d: "M10.799 2.68a.6.6 0 01.011.848L6.457 8l4.353 4.472a.6.6 0 01-.86.837L5.19 8.42a.6.6 0 010-.838l4.76-4.89a.6.6 0 01.849-.012z",
     fill: e
   }
-) })), be = ({
+) })), ye = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -171,7 +171,7 @@ const b = ({
     d: "M5.207 13.32a.6.6 0 01-.012-.848L9.55 8 5.195 3.528a.6.6 0 11.86-.837l4.76 4.89a.6.6 0 010 .838l-4.76 4.89a.6.6 0 01-.848.012z",
     fill: e
   }
-) })), f0 = ({
+) })), b0 = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -180,7 +180,7 @@ const b = ({
     d: "M13.79 2.21a.72.72 0 0 1 0 1.02L9.018 8l4.77 4.77a.72.72 0 1 1-1.018 1.02L8 9.018l-4.77 4.77a.72.72 0 1 1-1.02-1.018L6.982 8l-4.77-4.77A.72.72 0 0 1 3.23 2.21L8 6.982l4.77-4.77a.72.72 0 0 1 1.02 0Z",
     fill: e
   }
-) })), ye = ({
+) })), Me = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -189,7 +189,7 @@ const b = ({
     d: "M12.644.156l3.2 3.2a.533.533 0 010 .754L5.177 14.777a.534.534 0 01-.247.14L.663 15.984a.533.533 0 01-.647-.647l1.067-4.267a.534.534 0 01.14-.248L11.89.156a.533.533 0 01.754 0zM10.133 3.42l-8.051 8.052-.815 3.261 3.26-.815 8.052-8.052-2.446-2.446zm2.134-2.132l-1.38 1.378 2.446 2.446 1.38-1.379-2.446-2.445z",
     fill: e
   }
-) })), Me = ({
+) })), Te = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -198,7 +198,7 @@ const b = ({
     d: "M1.5 1.933l5.4 6.72c.066.081.1.18.1.28v5.134h2V8.933c0-.1.036-.199.1-.28l5.4-6.72h-13zM6 9.09L.1 1.747C-.145 1.439.09 1 .5 1h15c.413 0 .648.439.4.747L10 9.089v5.444c0 .258-.223.467-.5.467h-3c-.275 0-.5-.209-.5-.467V9.09z",
     fill: e
   }
-) })), Ce = ({
+) })), ve = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -207,7 +207,7 @@ const b = ({
     d: "M1.317 2.317a4.5 4.5 0 016.364 0c.117.117.223.238.32.363.095-.124.2-.245.316-.362a4.5 4.5 0 016.364 6.364l-.004.004-6.328 6.172a.5.5 0 01-.698 0L1.317 8.682a4.5 4.5 0 010-6.365zm5.657.708a3.5 3.5 0 00-4.952 4.947L8 13.802l5.977-5.83a3.5 3.5 0 00-4.952-4.947c-.235.235-.42.51-.586.815a.5.5 0 01-.878 0 3.46 3.46 0 00-.587-.815z",
     fill: e
   }
-) })), Te = ({
+) })), xe = ({
   color: e = "currentColor",
   ...o
 }) => /* @__PURE__ */ y(h, { ...o, children: [
@@ -225,7 +225,7 @@ const b = ({
       fill: e
     }
   )
-] }), ve = ({
+] }), Ae = ({
   color: e = "currentColor",
   ...o
 }) => /* @__PURE__ */ y(h, { ...o, children: [
@@ -261,7 +261,7 @@ const b = ({
       fillRule: "evenodd"
     }
   )
-] }), xe = ({
+] }), Ce = ({
   color: e = "currentColor",
   ...o
 }) => /* @__PURE__ */ a(h, { ...o, children: /* @__PURE__ */ a(
@@ -272,7 +272,7 @@ const b = ({
     fill: e,
     fillRule: "evenodd"
   }
-) }), Ae = ({
+) }), De = ({
   color: e = "currentColor",
   ...o
 }) => /* @__PURE__ */ y(h, { ...o, children: [
@@ -300,7 +300,7 @@ const b = ({
     }
   )
 ] });
-var d = /* @__PURE__ */ ((e) => (e.AutoTransport = "CAT-7829f71c-2e8c-afa5-2f55-fa3634b89874", e.BillsUtilities = "CAT-79b02f2f-2adc-88f0-ac2b-4e71ead9cfc8", e.BusinessServices = "CAT-94b11142-e97b-941a-f67f-6e18d246a23f", e.Education = "CAT-bf5c9cca-c96b-b50d-440d-38d9adfda5b0", e.Entertainment = "CAT-e04e9d1e-e041-c315-2e50-094143ab3f73", e.FeesCharges = "CAT-d73ee74b-13a4-ac3e-4015-fc4ba9a62b2a", e.Financial = "CAT-6c7de3f8-de6c-7061-1dd2-b093044014bf", e.FoodDining = "CAT-bd56d35a-a9a7-6e10-66c1-5b9cc1b6c81a", e.GiftsDonations = "CAT-8edf9663-623e-4735-490e-31288f0a70b0", e.HealthFitness = "CAT-52fa4693-c088-afb2-2a99-7bc39bb23a0f", e.Home = "CAT-b709172b-4eb7-318e-3b5d-e0f0500b32ac", e.Income = "CAT-bf9f3294-4c40-1677-d269-54fbc189faf3", e.Investments = "CAT-ccd42390-9e8c-3fb6-a5d9-6c31182d9c5c", e.Kids = "CAT-0cb1d99d-f558-99e3-2282-b31f359b411a", e.PersonalCare = "CAT-e5154228-fe45-790d-a280-f6bf5ae5ac9f", e.Pets = "CAT-7cccbafa-87d7-c9a6-661b-8b3402fe9e78", e.Shopping = "CAT-aad51b46-d6f7-3da5-fd6e-492328b3023f", e.Taxes = "CAT-d00fc539-aa14-009b-4ffb-7e8c7b839954", e.Transfer = "CAT-bce48142-fea4-ff45-20d9-0a642d44de83", e.Travel = "CAT-ea23d844-cbd1-eb10-f6ac-0df9610e59ae", e.Uncategorized = "CAT-d7851c65-3353-e490-1953-fb9235e681e4", e))(d || {}), b0 = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(b0 || {});
+var d = /* @__PURE__ */ ((e) => (e.AutoTransport = "CAT-7829f71c-2e8c-afa5-2f55-fa3634b89874", e.BillsUtilities = "CAT-79b02f2f-2adc-88f0-ac2b-4e71ead9cfc8", e.BusinessServices = "CAT-94b11142-e97b-941a-f67f-6e18d246a23f", e.Education = "CAT-bf5c9cca-c96b-b50d-440d-38d9adfda5b0", e.Entertainment = "CAT-e04e9d1e-e041-c315-2e50-094143ab3f73", e.FeesCharges = "CAT-d73ee74b-13a4-ac3e-4015-fc4ba9a62b2a", e.Financial = "CAT-6c7de3f8-de6c-7061-1dd2-b093044014bf", e.FoodDining = "CAT-bd56d35a-a9a7-6e10-66c1-5b9cc1b6c81a", e.GiftsDonations = "CAT-8edf9663-623e-4735-490e-31288f0a70b0", e.HealthFitness = "CAT-52fa4693-c088-afb2-2a99-7bc39bb23a0f", e.Home = "CAT-b709172b-4eb7-318e-3b5d-e0f0500b32ac", e.Income = "CAT-bf9f3294-4c40-1677-d269-54fbc189faf3", e.Investments = "CAT-ccd42390-9e8c-3fb6-a5d9-6c31182d9c5c", e.Kids = "CAT-0cb1d99d-f558-99e3-2282-b31f359b411a", e.PersonalCare = "CAT-e5154228-fe45-790d-a280-f6bf5ae5ac9f", e.Pets = "CAT-7cccbafa-87d7-c9a6-661b-8b3402fe9e78", e.Shopping = "CAT-aad51b46-d6f7-3da5-fd6e-492328b3023f", e.Taxes = "CAT-d00fc539-aa14-009b-4ffb-7e8c7b839954", e.Transfer = "CAT-bce48142-fea4-ff45-20d9-0a642d44de83", e.Travel = "CAT-ea23d844-cbd1-eb10-f6ac-0df9610e59ae", e.Uncategorized = "CAT-d7851c65-3353-e490-1953-fb9235e681e4", e))(d || {}), f0 = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(f0 || {});
 const W = {
   guid: d.Uncategorized,
   colorName: "uncategorized",
@@ -407,14 +407,14 @@ const W = {
     icon: "airplane_ticket"
   },
   W
-], M0 = 0.625, C0 = ({
+], M0 = 0.625, T0 = ({
   categoryGuid: e,
   icon_ratio: o = M0,
   size: r = 32,
   sx: l = {},
   variant: t = "filled"
 }) => {
-  const i = C(), n = m.useMemo(
+  const i = T(), n = m.useMemo(
     () => y0.find((s) => s.guid === e) ?? W,
     [e]
   ), c = i.palette.categories[n.colorName];
@@ -435,16 +435,16 @@ const W = {
       justifyContent: "center",
       sx: [...Array.isArray(l) ? l : [l]],
       width: r,
-      children: /* @__PURE__ */ a(b, { name: n.icon, size: r * o })
+      children: /* @__PURE__ */ a(f, { name: n.icon, size: r * o })
     }
   );
-}, T0 = ({
+}, v0 = ({
   items: e,
   onChange: o,
   isValid: r,
   selected: l
 }) => {
-  const t = C(), i = e?.map((n) => {
+  const t = T(), i = e?.map((n) => {
     const c = n.getValue({ isValid: r });
     return {
       label: n.label,
@@ -454,7 +454,7 @@ const W = {
       disabled: !r(c)
     };
   });
-  return /* @__PURE__ */ a(L, { sx: { gridColumn: 1, gridRow: "2/3", ml: 4, mt: 24, mr: 32 }, children: /* @__PURE__ */ a(a0, { color: "primary", orientation: "vertical", value: l, children: i?.map((n) => /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(E, { sx: { gridColumn: 1, gridRow: "2/3", ml: 4, mt: 24, mr: 32 }, children: /* @__PURE__ */ a(a0, { color: "primary", orientation: "vertical", value: l, children: i?.map((n) => /* @__PURE__ */ a(
     o0,
     {
       onClick: n.onClick,
@@ -482,23 +482,23 @@ const W = {
     },
     n.label
   )) }) });
-}, De = ({
+}, ke = ({
   copy: e,
   dateRange: o,
   onRangeChanged: r,
   selectedShortcut: l = e.dateRangeThisMonth,
   sx: t = {}
 }) => {
-  const i = C(), n = q(i.breakpoints.down("sm")), c = m.useMemo(() => {
+  const i = T(), n = q(i.breakpoints.down("sm")), c = m.useMemo(() => {
     const u = Y(), s = Q(u, 1), g = J(u, 1);
     return [
       {
         label: e.dateRangeThisMonth,
-        getValue: () => [F(u), S(u)]
+        getValue: () => [w(u), H(u)]
       },
       {
         label: e.dateRangeLastMonth,
-        getValue: () => [F(s), S(s)]
+        getValue: () => [w(s), H(s)]
       },
       {
         label: e.dateRangeLast30Days,
@@ -510,18 +510,18 @@ const W = {
       },
       {
         label: e.dateRangeYTD,
-        getValue: () => [w(u), u]
+        getValue: () => [F(u), u]
       },
       {
         label: e.dateRangeLastYear,
-        getValue: () => [w(g), X(g)]
+        getValue: () => [F(g), X(g)]
       },
       {
         label: e.dateRangeCustom,
         getValue: () => [u, u]
       }
     ];
-  }, [e]), f = (u, s) => {
+  }, [e]), b = (u, s) => {
     const g = s.shortcut;
     r?.(u, g ? g.label : e.dateRangeCustom);
   };
@@ -534,7 +534,7 @@ const W = {
         end: e.dateRangeTo,
         toolbarTitle: e.dateRangeToolbarTitle
       },
-      onChange: f,
+      onChange: b,
       showDaysOutsideCurrentMonth: !0,
       slotProps: {
         actionBar: { actions: [] },
@@ -546,17 +546,17 @@ const W = {
         }
       },
       slots: {
-        leftArrowIcon: () => /* @__PURE__ */ a(b, { name: "chevron_left", size: 28 }),
-        shortcuts: (u) => /* @__PURE__ */ a(T0, { selected: l, ...u }),
-        rightArrowIcon: () => /* @__PURE__ */ a(b, { name: "chevron_right", size: 28 })
+        leftArrowIcon: () => /* @__PURE__ */ a(f, { name: "chevron_left", size: 28 }),
+        shortcuts: (u) => /* @__PURE__ */ a(v0, { selected: l, ...u }),
+        rightArrowIcon: () => /* @__PURE__ */ a(f, { name: "chevron_right", size: 28 })
       },
       sx: { ...t },
       value: o
     }
   ) }) });
-}, ke = m.forwardRef(function(o, r) {
+}, Ee = m.forwardRef(function(o, r) {
   return /* @__PURE__ */ a(B, { direction: "up", ref: r, ...o });
-}), v0 = ({
+}), x0 = ({
   hasSecondaryAction: e = !0,
   isPrimaryDisabled: o,
   onPrimaryAction: r,
@@ -565,9 +565,9 @@ const W = {
   primaryText: i = "Save",
   secondaryColor: n = "primary",
   secondaryText: c = "Cancel",
-  ...f
+  ...b
 }) => /* @__PURE__ */ y(
-  O,
+  _,
   {
     sx: {
       display: "flex",
@@ -577,7 +577,7 @@ const W = {
         padding: 24
       }
     },
-    ...f,
+    ...b,
     children: [
       e && /* @__PURE__ */ a(
         D,
@@ -601,9 +601,9 @@ const W = {
     ]
   }
 ), Le = ({ copy: e, onClose: o, ...r }) => {
-  const l = C();
+  const l = T();
   return /* @__PURE__ */ y(
-    O,
+    _,
     {
       sx: {
         "&.MuiToolbar-gutters": {
@@ -612,12 +612,12 @@ const W = {
       },
       ...r,
       children: [
-        /* @__PURE__ */ a(L, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ a(A0, { sx: { fontWeight: 600 }, variant: "H3", children: e.title }) }),
-        /* @__PURE__ */ a(_, { "aria-label": e.close_aria, onClick: o, sx: { mr: -12 }, children: /* @__PURE__ */ a(f0, { color: l.palette.primary.main }) })
+        /* @__PURE__ */ a(E, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ a(C0, { sx: { fontWeight: 600 }, variant: "H3", children: e.title }) }),
+        /* @__PURE__ */ a(V, { "aria-label": e.close_aria, onClick: o, sx: { mr: -12 }, children: /* @__PURE__ */ a(b0, { color: l.palette.primary.main }) })
       ]
     }
   );
-}, Ee = ({
+}, Se = ({
   className: e,
   disableSave: o,
   id: r,
@@ -626,7 +626,7 @@ const W = {
   onSave: i,
   primaryText: n,
   secondaryText: c,
-  children: f,
+  children: b,
   ...u
 }) => /* @__PURE__ */ y(
   i0,
@@ -639,9 +639,9 @@ const W = {
     variant: "temporary",
     ...u,
     children: [
-      f,
+      b,
       i && /* @__PURE__ */ a(
-        v0,
+        x0,
         {
           isPrimaryDisabled: o,
           onPrimaryAction: i,
@@ -652,7 +652,7 @@ const W = {
       )
     ]
   }
-), $ = 32, H = "https://content.moneydesktop.com/storage/MD_Assets", x0 = `${H}/serenity/default_institution_logo.png`, He = ({
+), $ = 32, S = "https://content.moneydesktop.com/storage/MD_Assets", A0 = `${S}/serenity/default_institution_logo.png`, Ie = ({
   alt: e,
   institutionGuid: o,
   logoUrl: r,
@@ -663,15 +663,15 @@ const W = {
   {
     alt: e,
     height: l,
-    onError: (i) => i.target.src = x0,
-    src: r || `${H}/Ipad%20Logos/100x100/${o}_100x100.png`,
+    onError: (i) => i.target.src = A0,
+    src: r || `${S}/Ipad%20Logos/100x100/${o}_100x100.png`,
     style: {
       borderRadius: 4
     },
     width: l,
     ...t
   }
-), Ie = ({
+), He = ({
   alt: e = "",
   categoryGuid: o,
   merchantGuid: r,
@@ -679,7 +679,7 @@ const W = {
   ...t
 }) => {
   const [i, n] = m.useState(!1);
-  return /* @__PURE__ */ y(L, { display: "inline-block", position: "relative", ...t, children: [
+  return /* @__PURE__ */ y(E, { display: "inline-block", position: "relative", ...t, children: [
     r && !i && /* @__PURE__ */ a(
       "img",
       {
@@ -687,7 +687,7 @@ const W = {
         "aria-hidden": !e,
         height: l,
         onError: () => n(!0),
-        src: `${H}/merchant_logos/${r}.png`,
+        src: `${S}/merchant_logos/${r}.png`,
         style: {
           borderRadius: 4,
           boxSizing: "border-box",
@@ -696,9 +696,9 @@ const W = {
         width: l
       }
     ),
-    /* @__PURE__ */ a(C0, { categoryGuid: o, size: l })
+    /* @__PURE__ */ a(T0, { categoryGuid: o, size: l })
   ] });
-}, T = ({
+}, v = ({
   bold: e,
   className: o = "",
   children: r,
@@ -729,8 +729,8 @@ const W = {
     ...c,
     children: r
   }
-), A0 = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(T, { className: `mx-kmui-text h1 ${e}`, component: "h1", variant: "H1", ...r, children: o }), Se = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(T, { className: `mx-kmui-text h2 ${e}`, component: "h2", variant: "H2", ...r, children: o }), Fe = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(T, { className: `mx-kmui-text h3 ${e}`, component: "h3", variant: "H3", ...r, children: o }), we = ({ className: e = "", children: o, truncate: r, ...l }) => /* @__PURE__ */ a(
-  T,
+), C0 = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(v, { className: `mx-kmui-text h1 ${e}`, component: "h1", variant: "H1", ...r, children: o }), we = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(v, { className: `mx-kmui-text h2 ${e}`, component: "h2", variant: "H2", ...r, children: o }), Fe = ({ className: e = "", children: o, ...r }) => /* @__PURE__ */ a(v, { className: `mx-kmui-text h3 ${e}`, component: "h3", variant: "H3", ...r, children: o }), Re = ({ className: e = "", children: o, truncate: r, ...l }) => /* @__PURE__ */ a(
+  v,
   {
     className: `mx-kmui-text p ${e}`,
     component: "p",
@@ -739,7 +739,7 @@ const W = {
     ...l,
     children: o
   }
-), Re = ({
+), Ne = ({
   disabled: e = !1,
   label: o = "",
   shrink: r = !0,
@@ -760,7 +760,7 @@ const W = {
 function D0(e) {
   return /* @__PURE__ */ a(B, { ...e, direction: "left", mountOnEnter: !0, unmountOnExit: !0 });
 }
-const Ne = ({
+const ze = ({
   open: e,
   handleClose: o,
   message: r,
@@ -769,11 +769,11 @@ const Ne = ({
   snackbarSx: i,
   showAction: n = !1,
   showClose: c = !1,
-  actionText: f = "Undo",
+  actionText: b = "Undo",
   onActionClick: u,
   multiLine: s = !1
 }) => {
-  const g = C(), K = {
+  const g = T(), K = {
     success: g.palette.success.dark,
     error: g.palette.error.light,
     info: g.palette.info.lighter,
@@ -798,17 +798,17 @@ const Ne = ({
               color: g.palette.success.contrastText,
               height: 44
             },
-            children: f
+            children: b
           }
         ),
         c && /* @__PURE__ */ a(
-          _,
+          V,
           {
             "aria-label": "close",
             color: "inherit",
             onClick: o,
             sx: { height: 44, width: 44 },
-            children: /* @__PURE__ */ a(b, { fill: !0, name: "close", size: 24, weight: 400 })
+            children: /* @__PURE__ */ a(f, { fill: !0, name: "close", size: 24, weight: 400 })
           }
         )
       ]
@@ -853,7 +853,7 @@ const Ne = ({
           },
           variant: "filled",
           children: /* @__PURE__ */ a(
-            T,
+            v,
             {
               sx: {
                 lineHeight: g.typography.Body.lineHeight,
@@ -873,27 +873,27 @@ const Ne = ({
   REACT: "react",
   REACT_NATIVE: "react_native",
   NATIVE: "native"
-}, x = {
+}, A = {
   LIGHT: "light",
   DARK: "dark"
-}, G = m.createContext(V), U = m.createContext(
-  E(x.LIGHT, M.REACT_NATIVE)
-), ze = ({
+}, G = m.createContext(P), U = m.createContext(
+  L(A.LIGHT, M.REACT_NATIVE)
+), Oe = ({
   children: e,
   target: o = M.REACT,
-  theme: r = x.LIGHT,
+  theme: r = A.LIGHT,
   tokenOverrides: l
 }) => {
-  const [t, i] = m.useState(r === x.LIGHT ? V : d0), n = m.useMemo(() => ({
+  const [t, i] = m.useState(r === A.LIGHT ? P : d0), n = m.useMemo(() => ({
     ...l
   }), [l]);
   return m.useEffect(() => {
-    const c = E(r, o, { ...n });
+    const c = L(r, o, { ...n });
     i(c);
   }, [r, o, n]), o === M.REACT ? /* @__PURE__ */ a(G.Provider, { value: t, children: e }) : (console.warn("DEPRECATED: Use static values instead of tokens"), /* @__PURE__ */ a(U.Provider, { value: t, children: e }));
-}, Pe = (e = M.REACT, o = {}) => {
+}, Be = (e = M.REACT, o = {}) => {
   const r = e === M.REACT ? G : U, l = m.useContext(r);
-  return l || E(x.LIGHT, e, { ...o });
+  return l || L(A.LIGHT, e, { ...o });
 }, p = {
   LIGHT: "light",
   DARK: "dark"
@@ -930,15 +930,36 @@ const Ne = ({
   Warning400: "#E07C02",
   Warning500: "#C33E01",
   White: "#FFFFFF"
-}, L0 = (e, o = {}) => {
-  const r = {
-    ...k0,
-    ...o.primary?.[100] && { Primary100: o.primary[100] },
-    ...o.primary?.[200] && { Primary200: o.primary[200] },
-    ...o.primary?.[300] && { Primary300: o.primary[300] },
-    ...o.primary?.[400] && { Primary400: o.primary[400] },
-    ...o.primary?.[500] && { Primary500: o.primary[500] }
-  };
+}, E0 = (e = {}) => ({
+  ...k0,
+  ...e.primary?.[100] && { Primary100: e.primary[100] },
+  ...e.primary?.[200] && { Primary200: e.primary[200] },
+  ...e.primary?.[300] && { Primary300: e.primary[300] },
+  ...e.primary?.[400] && { Primary400: e.primary[400] },
+  ...e.primary?.[500] && { Primary500: e.primary[500] },
+  ...e.secondary?.[100] && { Neutral500: e.secondary[100] },
+  ...e.secondary?.[200] && { Neutral600: e.secondary[200] },
+  ...e.secondary?.[300] && { Neutral700: e.secondary[300] },
+  ...e.secondary?.[400] && { Neutral800: e.secondary[400] },
+  ...e.secondary?.[500] && { Neutral900: e.secondary[500] },
+  ...e.error?.[100] && { Error100: e.error[100] },
+  ...e.error?.[200] && { Error200: e.error[200] },
+  ...e.error?.[300] && { Error300: e.error[300] },
+  ...e.error?.[400] && { Error400: e.error[400] },
+  ...e.error?.[500] && { Error500: e.error[500] },
+  ...e.warning?.[100] && { Warning100: e.warning[100] },
+  ...e.warning?.[200] && { Warning200: e.warning[200] },
+  ...e.warning?.[300] && { Warning300: e.warning[300] },
+  ...e.warning?.[400] && { Warning400: e.warning[400] },
+  ...e.warning?.[500] && { Warning500: e.warning[500] },
+  ...e.success?.[100] && { Success100: e.success[100] },
+  ...e.success?.[150] && { Success150: e.success[150] },
+  ...e.success?.[200] && { Success200: e.success[200] },
+  ...e.success?.[300] && { Success300: e.success[300] },
+  ...e.success?.[400] && { Success400: e.success[400] },
+  ...e.success?.[500] && { Success500: e.success[500] }
+}), L0 = (e, o = {}) => {
+  const r = E0(o);
   return h0({
     mode: e,
     border: {
@@ -1067,8 +1088,8 @@ const Ne = ({
       chartMono6: "#002966"
     }
   });
-}, v = "Inter, Helvetica, Arial, sans-serif", E0 = (e) => g0(e, {
-  fontFamily: v,
+}, x = "Inter, Helvetica, Arial, sans-serif", S0 = (e) => g0(e, {
+  fontFamily: x,
   fontSize: 15,
   Body: {
     fontSize: 15,
@@ -1080,19 +1101,19 @@ const Ne = ({
   },
   caption: void 0,
   H1: {
-    fontFamily: v,
+    fontFamily: x,
     fontWeight: 700,
     fontSize: 31,
     lineHeight: "40px"
   },
   H2: {
-    fontFamily: v,
+    fontFamily: x,
     fontWeight: 700,
     fontSize: 23,
     lineHeight: "32px"
   },
   H3: {
-    fontFamily: v,
+    fontFamily: x,
     fontWeight: 700,
     fontSize: 18,
     lineHeight: "24px"
@@ -1127,13 +1148,13 @@ const Ne = ({
 u0.setLicenseKey(
   "6e7dd593526efa1f157230ecf06c9b02Tz0xMDA5NjAsRT0xNzYyMDQxNjAwMDAwLFM9cHJvLExNPWFubnVhbCxQVj1RMy0yMDI0LEtWPTI="
 );
-const A = [...P().shadows];
-A[1] = "0px 2px 8px rgba(106, 115, 129, 0.12)";
-A[2] = "0px 6px 12px rgba(106, 115, 129, 0.16), 0px 3px 8px rgba(87, 102, 117, 0.06)";
-A[3] = "0px 12px 20px rgba(106, 115, 129, 0.22)";
-const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px rgba(82, 138, 224, 0.8)", H0 = "cubic-bezier(.475,.425,0,.995)", Be = (e, o = {}) => {
-  const r = L0(e, o), l = E0(r);
-  return P({
+const C = [...O().shadows];
+C[1] = "0px 2px 8px rgba(106, 115, 129, 0.12)";
+C[2] = "0px 6px 12px rgba(106, 115, 129, 0.16), 0px 3px 8px rgba(87, 102, 117, 0.06)";
+C[3] = "0px 12px 20px rgba(106, 115, 129, 0.22)";
+const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px rgba(82, 138, 224, 0.8)", I0 = "cubic-bezier(.475,.425,0,.995)", _e = (e, o = {}) => {
+  const r = L0(e, o), l = S0(r);
+  return O({
     breakpoints: {
       values: {
         xs: 0,
@@ -1144,7 +1165,7 @@ const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px
       }
     },
     palette: r,
-    shadows: A,
+    shadows: C,
     shape: {
       borderRadius: 4
     },
@@ -1169,10 +1190,10 @@ const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px
       MuiAlert: {
         defaultProps: {
           iconMapping: {
-            success: /* @__PURE__ */ a(b, { fill: !0, name: "check_circle", size: 24, weight: 400 }),
-            error: /* @__PURE__ */ a(b, { fill: !0, name: "error", size: 24, weight: 400 }),
-            warning: /* @__PURE__ */ a(b, { fill: !0, name: "warning", size: 24, weight: 400 }),
-            info: /* @__PURE__ */ a(b, { fill: !0, name: "info", size: 24, weight: 400 })
+            success: /* @__PURE__ */ a(f, { fill: !0, name: "check_circle", size: 24, weight: 400 }),
+            error: /* @__PURE__ */ a(f, { fill: !0, name: "error", size: 24, weight: 400 }),
+            warning: /* @__PURE__ */ a(f, { fill: !0, name: "warning", size: 24, weight: 400 }),
+            info: /* @__PURE__ */ a(f, { fill: !0, name: "info", size: 24, weight: 400 })
           }
         },
         styleOverrides: {
@@ -1561,7 +1582,7 @@ const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px
             // Body
             lineHeight: "20px",
             // Body
-            transition: `box-shadow 350ms ${H0}`,
+            transition: `box-shadow 350ms ${I0}`,
             width: "100%",
             "&.MuiOutlinedInput-input.Mui-disabled": {
               padding: 12,
@@ -1937,50 +1958,50 @@ const N = "0px 0px 0px 2px rgba(82, 138, 224, 0.8)", z = "inset 0px 0px 0px 2px
   });
 };
 export {
-  se as AccountsFilledIcon,
-  de as AccountsIcon,
-  ue as ArrowLeftIcon,
-  pe as AttentionFilledIcon,
+  de as AccountsFilledIcon,
+  ue as AccountsIcon,
+  pe as ArrowLeftIcon,
+  he as AttentionFilledIcon,
   h as BaseIcon,
-  ke as BottomSheetTransition,
-  he as CalendarIcon,
+  Ee as BottomSheetTransition,
+  ge as CalendarIcon,
   d as CategoryGuids,
-  C0 as CategoryIcon,
+  T0 as CategoryIcon,
   y0 as CategoryIconList,
-  b0 as CategoryIconVariants,
-  ge as CheckmarkFilledIcon,
-  me as ChevronDownIcon,
+  f0 as CategoryIconVariants,
+  me as CheckmarkFilledIcon,
+  be as ChevronDownIcon,
   fe as ChevronLeftIcon,
-  be as ChevronRightIcon,
-  f0 as CloseIcon,
-  De as DateRangePicker,
-  v0 as DialogFooter,
+  ye as ChevronRightIcon,
+  b0 as CloseIcon,
+  ke as DateRangePicker,
+  x0 as DialogFooter,
   Le as DialogHeader,
-  Ee as Drawer,
-  ye as EditIcon,
-  Me as FilterIcon,
-  v0 as Footer,
-  A0 as H1,
-  Se as H2,
+  Se as Drawer,
+  Me as EditIcon,
+  Te as FilterIcon,
+  x0 as Footer,
+  C0 as H1,
+  we as H2,
   Fe as H3,
-  Ce as HeartIcon,
-  v as INTER,
-  b as Icon,
+  ve as HeartIcon,
+  x as INTER,
+  f as Icon,
   m0 as IconWeight,
-  He as InstitutionLogo,
-  ve as MXLogoCopyrightIcon,
-  xe as MXLogoFilledIcon,
-  Te as MXLogoIcon,
-  Ae as MXLogoOutlineIcon,
-  Ie as MerchantLogo,
-  we as P,
+  Ie as InstitutionLogo,
+  Ae as MXLogoCopyrightIcon,
+  Ce as MXLogoFilledIcon,
+  xe as MXLogoIcon,
+  De as MXLogoOutlineIcon,
+  He as MerchantLogo,
+  Re as P,
   M as TARGETS,
-  x as THEMES,
-  T as Text,
-  Re as TextField,
-  Ne as Toast,
-  ze as TokenProvider,
-  Be as createMXTheme,
-  Pe as useTokens
+  A as THEMES,
+  v as Text,
+  Ne as TextField,
+  ze as Toast,
+  Oe as TokenProvider,
+  _e as createMXTheme,
+  Be as useTokens
 };
 //# sourceMappingURL=index.es.js.map