@mxenabled/mxui 1.5.13-alpha.al0 → 1.5.14

package/dist/index.es.js

@@ -17,8 +17,8 @@ import { AdapterDateFns as Ce } from "@mui/x-date-pickers-pro/AdapterDateFnsV3";
 import { MultiInputDateRangeField as xe } from "@mui/x-date-pickers-pro/MultiInputDateRangeField";
 import j from "@mui/material/Box";
 import Re from "@mui/material/ToggleButton";
-import Me from "@mui/material/ToggleButtonGroup";
-import Ae from "@mui/material/MenuItem";
+import Ae from "@mui/material/ToggleButtonGroup";
+import Me from "@mui/material/MenuItem";
 import Q from "@mui/material/TextField";
 import { usePickerLayout as Ee, PickersLayoutRoot as Se, PickersLayoutContentWrapper as Ie, pickersLayoutClasses as P } from "@mui/x-date-pickers/PickersLayout";
 import J from "@mui/material/Slide";
@@ -27,9 +27,9 @@ import q from "@mui/material/IconButton";
 import ve from "@mui/material/Typography";
 import ye from "@mui/material/Drawer";
 import He from "@mui/material/Snackbar";
-import Fe from "@mui/material/Alert";
-import { light as ee, buildTheme as $, dark as Oe } from "@mxenabled/design-tokens";
-import { FormControlLabel as ke, Box as _, Typography as X, Radio as B, Checkbox as Le, alpha as b, darken as D, lighten as F, getContrastRatio as De } from "@mui/material";
+import Le from "@mui/material/Alert";
+import { light as ee, buildTheme as G, dark as Fe } from "@mxenabled/design-tokens";
+import { FormControlLabel as ke, Box as _, Typography as X, Radio as B, Checkbox as Oe, alpha as b, darken as D, lighten as L, getContrastRatio as De } from "@mui/material";
 import { circularProgressClasses as Ne } from "@mui/material/CircularProgress";
 import { LicenseInfo as we } from "@mui/x-license-pro";
 const f = ({
@@ -127,7 +127,7 @@ const R = ({
     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
   }
-) })), $0 = ({
+) })), G0 = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(f, { ...o, children: /* @__PURE__ */ a(
@@ -136,7 +136,7 @@ const R = ({
     d: "M2.68 5.201a.6.6 0 01.848-.011L8 9.543l4.472-4.353a.6.6 0 11.837.86l-4.89 4.76a.6.6 0 01-.838 0l-4.89-4.76a.6.6 0 01-.012-.849z",
     fill: e
   }
-) })), G0 = ({
+) })), $0 = ({
   color: e = "currentColor",
   ...o
 }) => (console.warn('<AccountsFilledIcon /> DEPRECATED - use <Icon name="icon_name" />'), /* @__PURE__ */ a(f, { ...o, children: /* @__PURE__ */ a(
@@ -283,109 +283,109 @@ const R = ({
     }
   )
 ] });
-var g = /* @__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))(g || {}), _e = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(_e || {});
+var h = /* @__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))(h || {}), _e = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(_e || {});
 const oe = {
-  guid: g.Uncategorized,
+  guid: h.Uncategorized,
   colorName: "uncategorized",
   icon: "category"
 }, Be = [
   {
-    guid: g.AutoTransport,
+    guid: h.AutoTransport,
     colorName: "autoTransport",
     icon: "directions_car"
   },
   {
-    guid: g.BillsUtilities,
+    guid: h.BillsUtilities,
     colorName: "billsUtilities",
     icon: "electrical_services"
   },
   {
-    guid: g.BusinessServices,
+    guid: h.BusinessServices,
     colorName: "businessServices",
     icon: "business_center"
   },
   {
-    guid: g.Education,
+    guid: h.Education,
     colorName: "education",
     icon: "school"
   },
   {
-    guid: g.Entertainment,
+    guid: h.Entertainment,
     colorName: "entertainment",
     icon: "stadium"
   },
   {
-    guid: g.FeesCharges,
+    guid: h.FeesCharges,
     colorName: "feesCharges",
     icon: "problem"
   },
   {
-    guid: g.Financial,
+    guid: h.Financial,
     colorName: "financial",
     icon: "price_check"
   },
   {
-    guid: g.FoodDining,
+    guid: h.FoodDining,
     colorName: "foodDining",
     icon: "grocery"
   },
   {
-    guid: g.GiftsDonations,
+    guid: h.GiftsDonations,
     colorName: "giftsDonations",
     icon: "featured_seasonal_and_gifts"
   },
   {
-    guid: g.HealthFitness,
+    guid: h.HealthFitness,
     colorName: "healthFitness",
     icon: "ecg_heart"
   },
   {
-    guid: g.Home,
+    guid: h.Home,
     colorName: "home",
     icon: "cottage"
   },
   {
-    guid: g.Income,
+    guid: h.Income,
     colorName: "income",
     icon: "monetization_on"
   },
   {
-    guid: g.Investments,
+    guid: h.Investments,
     colorName: "investments",
     icon: "bid_landscape"
   },
   {
-    guid: g.Kids,
+    guid: h.Kids,
     colorName: "kids",
     icon: "face"
   },
   {
-    guid: g.PersonalCare,
+    guid: h.PersonalCare,
     colorName: "personalCare",
     icon: "volunteer_activism"
   },
   {
-    guid: g.Pets,
+    guid: h.Pets,
     colorName: "pets",
     icon: "pet_supplies"
   },
   {
-    guid: g.Shopping,
+    guid: h.Shopping,
     colorName: "shopping",
     icon: "shopping_cart"
   },
   {
-    guid: g.Taxes,
+    guid: h.Taxes,
     colorName: "taxes",
     icon: "heap_snapshot_large"
   },
   {
-    guid: g.Transfer,
+    guid: h.Transfer,
     colorName: "transfer",
     icon: "compare_arrows"
   },
   {
-    guid: g.Travel,
+    guid: h.Travel,
     colorName: "travel",
     icon: "airplane_ticket"
   },
@@ -398,7 +398,7 @@ const oe = {
   variant: c = "filled"
 }) => {
   const r = H(), n = x.useMemo(
-    () => Be.find((u) => u.guid === e) ?? oe,
+    () => Be.find((m) => m.guid === e) ?? oe,
     [e]
   ), s = r.palette.categories[n.colorName];
   return /* @__PURE__ */ a(
@@ -406,13 +406,13 @@ const oe = {
     {
       alignItems: "center",
       bgcolor: () => {
-        let u = s;
-        return c === "twotone" && (u = `${u}20`), c === "transparent" || c === "basic" ? "transparent" : u;
+        let m = s;
+        return c === "twotone" && (m = `${m}20`), c === "transparent" || c === "basic" ? "transparent" : m;
       },
       borderRadius: 1,
       color: () => {
-        const u = c === "filled" ? r.palette.common.white : s;
-        return c === "basic" ? r.palette.text.primary : u;
+        const m = c === "filled" ? r.palette.common.white : s;
+        return c === "basic" ? r.palette.text.primary : m;
       },
       height: i,
       justifyContent: "center",
@@ -421,7 +421,7 @@ const oe = {
       children: /* @__PURE__ */ a(R, { name: n.icon, size: i * o })
     }
   );
-}, $e = ({
+}, Ge = ({
   items: e,
   onChange: o,
   isValid: i,
@@ -437,7 +437,7 @@ const oe = {
       disabled: !i(s)
     };
   });
-  return /* @__PURE__ */ a(j, { sx: { gridColumn: 1, gridRow: "2/3", ml: 4, mt: 24, mr: 32 }, children: /* @__PURE__ */ a(Me, { color: "primary", orientation: "vertical", value: l, children: r?.map((n) => /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(j, { sx: { gridColumn: 1, gridRow: "2/3", ml: 4, mt: 24, mr: 32 }, children: /* @__PURE__ */ a(Ae, { color: "primary", orientation: "vertical", value: l, children: r?.map((n) => /* @__PURE__ */ a(
     Re,
     {
       onClick: n.onClick,
@@ -465,7 +465,7 @@ const oe = {
     },
     n.label
   )) }) });
-}, Ge = ({
+}, $e = ({
   items: e,
   onChange: o,
   isValid: i,
@@ -496,7 +496,7 @@ const oe = {
       sx: { width: "100%" },
       value: l,
       variant: "outlined",
-      children: r?.map((n) => /* @__PURE__ */ a(Ae, { onClick: n.onClick, value: n.label, children: n.label }, n.label))
+      children: r?.map((n) => /* @__PURE__ */ a(Me, { onClick: n.onClick, value: n.label, children: n.label }, n.label))
     }
   ) });
 }, Ue = (e) => {
@@ -536,7 +536,7 @@ const oe = {
   sx: c = {}
 }) => {
   const r = H(), n = fe(r.breakpoints.down("sm")), s = x.useMemo(() => {
-    const t = he(), u = ge(t, 1), C = me(t, 1);
+    const t = he(), m = ge(t, 1), C = me(t, 1);
     return [
       {
         label: e.dateRangeThisMonth,
@@ -544,7 +544,7 @@ const oe = {
       },
       {
         label: e.dateRangeLastMonth,
-        getValue: () => [Z(u), W(u)]
+        getValue: () => [Z(m), W(m)]
       },
       {
         label: e.dateRangeLast30Days,
@@ -567,8 +567,8 @@ const oe = {
         getValue: () => [t, t]
       }
     ];
-  }, [e]), d = (t, u) => {
-    const C = u.shortcut;
+  }, [e]), d = (t, m) => {
+    const C = m.shortcut;
     i?.(t, C ? C.label : e.dateRangeCustom);
   };
   return /* @__PURE__ */ a(I, { gap: n ? 0 : 16, m: n ? 0 : 8, children: /* @__PURE__ */ a(be, { dateAdapter: Ce, children: /* @__PURE__ */ a(
@@ -595,13 +595,13 @@ const oe = {
         ...n && { layout: Ue },
         leftArrowIcon: () => /* @__PURE__ */ a(R, { name: "chevron_left", size: 28 }),
         shortcuts: (t) => n ? /* @__PURE__ */ a(
-          Ge,
+          $e,
           {
             selectLabel: e.dateRangeSelectARange,
             selected: l,
             ...t
           }
-        ) : /* @__PURE__ */ a($e, { selected: l, ...t }),
+        ) : /* @__PURE__ */ a(Ge, { selected: l, ...t }),
         rightArrowIcon: () => /* @__PURE__ */ a(R, { name: "chevron_right", size: 28 }),
         ...n && {
           toolbar: (t) => /* @__PURE__ */ a(
@@ -610,8 +610,8 @@ const oe = {
               dateSeparator: "",
               ...t,
               slotProps: {
-                textField: ({ position: u }) => ({
-                  label: u === "start" ? e.dateRangeFrom : e.dateRangeTo
+                textField: ({ position: m }) => ({
+                  label: m === "start" ? e.dateRangeFrom : e.dateRangeTo
                 })
               },
               sx: { gap: 8 }
@@ -788,7 +788,7 @@ const oe = {
       )
     ]
   }
-), re = 32, G = "https://content.moneydesktop.com/storage/MD_Assets", Ke = `${G}/serenity/default_institution_logo.png`, no = ({
+), re = 32, $ = "https://content.moneydesktop.com/storage/MD_Assets", Ke = `${$}/serenity/default_institution_logo.png`, no = ({
   alt: e,
   institutionGuid: o,
   logoUrl: i,
@@ -800,7 +800,7 @@ const oe = {
     alt: e,
     height: l,
     onError: (r) => r.target.src = Ke,
-    src: i || `${G}/Ipad%20Logos/100x100/${o}_100x100.png`,
+    src: i || `${$}/Ipad%20Logos/100x100/${o}_100x100.png`,
     style: {
       borderRadius: 4
     },
@@ -823,7 +823,7 @@ const oe = {
         "aria-hidden": !e,
         height: l,
         onError: () => n(!0),
-        src: `${G}/merchant_logos/${i}.png`,
+        src: `${$}/merchant_logos/${i}.png`,
         style: {
           backgroundColor: s.palette.common.white,
           borderRadius: 4,
@@ -857,109 +857,103 @@ function Ye(e) {
   return /* @__PURE__ */ a(J, { ...e, direction: "left", mountOnEnter: !0, unmountOnExit: !0 });
 }
 const so = ({
-  open: e,
+  open: e = !0,
   handleClose: o,
-  message: i,
-  autoHideDuration: l = 3e3,
-  severity: c = "success",
-  snackbarSx: r,
-  showAction: n = !1,
-  showClose: s = !1,
-  actionText: d = "Undo",
-  onActionClick: t,
-  multiLine: u = !1
+  closeAriaLabel: i,
+  message: l,
+  autoHideDuration: c = 3e3,
+  severity: r = "success",
+  snackbarSx: n,
+  showAction: s = !1,
+  showClose: d = !1,
+  actionText: t = "Undo",
+  onActionClick: m
 }) => {
-  const C = H(), L = /* @__PURE__ */ T(
-    I,
-    {
-      alignItems: u ? "flex-end" : "center",
-      direction: u ? "column-reverse" : "row",
-      justifyContent: (
-        // eslint-disable-next-line no-nested-ternary
-        u && n && s ? "space-between" : "flex-end"
-      ),
-      children: [
-        n && /* @__PURE__ */ a(
-          V,
-          {
-            color: "inherit",
-            onClick: t || o,
-            size: "small",
-            sx: {
-              color: C.palette.success.contrastText,
-              height: 44
-            },
-            children: d
-          }
-        ),
-        s && /* @__PURE__ */ a(
-          q,
-          {
-            "aria-label": "close",
-            color: "inherit",
-            onClick: o,
-            sx: { height: 44, width: 44 },
-            children: /* @__PURE__ */ a(R, { fill: !0, name: "close", size: 24, weight: 400 })
-          }
-        )
-      ]
-    }
-  );
+  const C = H(), O = d && /* @__PURE__ */ a(q, { "aria-label": i, color: "inherit", onClick: o, size: "small", children: /* @__PURE__ */ a(R, { fill: !0, name: "close" }) }), g = `${r}.main`;
   return /* @__PURE__ */ a(
     He,
     {
       TransitionComponent: Ye,
       anchorOrigin: { vertical: "bottom", horizontal: "right" },
-      autoHideDuration: l,
+      autoHideDuration: c,
       onClose: o,
       open: e,
       sx: {
-        ...r,
-        width: u ? 400 : 325
+        ...n,
+        maxWidth: 568,
+        minWidth: 288,
+        minHeight: 56
       },
       children: /* @__PURE__ */ a(
-        Fe,
+        Le,
         {
-          action: L,
-          severity: c,
+          action: O,
+          severity: r,
           sx: {
+            backgroundColor: g,
             display: "flex",
-            alignItems: "stretch",
-            minHeight: s && n && u ? 120 : 56,
-            maxHeight: u ? 120 : 56,
             width: "100%",
-            "& .MuiAlert-icon": {
-              alignSelf: u ? "flex-start" : "center"
-            },
+            py: 8,
             "& .MuiAlert-message": {
-              paddingTop: u ? 12 : 8,
-              paddingBottom: u ? 12 : 8,
-              alignSelf: u ? "flex-start" : "center"
+              my: 0,
+              flex: 1,
+              overflow: "hidden"
             },
             "& .MuiAlert-action": {
-              alignItems: "stretch",
-              height: "auto"
+              alignItems: d ? "flex-start" : "center"
             }
           },
           variant: "filled",
-          children: /* @__PURE__ */ a(
-            k,
+          children: /* @__PURE__ */ T(
+            I,
             {
               sx: {
-                lineHeight: C.typography.body1.lineHeight,
-                whiteSpace: u ? "normal" : "nowrap",
-                overflow: u ? "visible" : "hidden",
-                textOverflow: u ? "clip" : "ellipsis"
+                flexDirection: "row",
+                flexWrap: "wrap",
+                alignItems: "baseline",
+                justifyContent: "space-between",
+                width: "100%",
+                rowGap: "16px",
+                columnGap: "16px"
               },
-              truncate: !u,
-              children: i
+              children: [
+                /* @__PURE__ */ a(
+                  k,
+                  {
+                    sx: {
+                      lineHeight: C.typography.body1.lineHeight,
+                      flex: 1,
+                      minWidth: "70%",
+                      px: 5
+                    },
+                    truncate: !1,
+                    children: l
+                  }
+                ),
+                s && /* @__PURE__ */ a(
+                  V,
+                  {
+                    color: "inherit",
+                    onClick: m || o,
+                    size: "small",
+                    sx: {
+                      color: C.palette.success.contrastText,
+                      whiteSpace: "nowrap",
+                      flexShrink: 0,
+                      minWidth: "auto",
+                      justifyContent: "flex-start"
+                    },
+                    children: t
+                  }
+                )
+              ]
             }
           )
         }
       )
     }
   );
-}, O = {
+}, F = {
   REACT: "react",
   REACT_NATIVE: "react_native",
   NATIVE: "native"
@@ -967,23 +961,23 @@ const so = ({
   LIGHT: "light",
   DARK: "dark"
 }, te = x.createContext(ee), ie = x.createContext(
-  $(N.LIGHT, O.REACT_NATIVE)
+  G(N.LIGHT, F.REACT_NATIVE)
 ), uo = ({
   children: e,
-  target: o = O.REACT,
+  target: o = F.REACT,
   theme: i = N.LIGHT,
   tokenOverrides: l
 }) => {
-  const [c, r] = x.useState(i === N.LIGHT ? ee : Oe), n = x.useMemo(() => ({
+  const [c, r] = x.useState(i === N.LIGHT ? ee : Fe), n = x.useMemo(() => ({
     ...l
   }), [l]);
   return x.useEffect(() => {
-    const s = $(i, o, { ...n });
+    const s = G(i, o, { ...n });
     r(s);
-  }, [i, o, n]), o === O.REACT ? /* @__PURE__ */ a(te.Provider, { value: c, children: e }) : (console.warn("DEPRECATED: Use static values instead of tokens"), /* @__PURE__ */ a(ie.Provider, { value: c, children: e }));
-}, po = (e = O.REACT, o = {}) => {
-  const i = e === O.REACT ? te : ie, l = x.useContext(i);
-  return l || $(N.LIGHT, e, { ...o });
+  }, [i, o, n]), o === F.REACT ? /* @__PURE__ */ a(te.Provider, { value: c, children: e }) : (console.warn("DEPRECATED: Use static values instead of tokens"), /* @__PURE__ */ a(ie.Provider, { value: c, children: e }));
+}, po = (e = F.REACT, o = {}) => {
+  const i = e === F.REACT ? te : ie, l = x.useContext(i);
+  return l || G(N.LIGHT, e, { ...o });
 }, ho = ({
   component: e = B,
   variant: o = "outlined",
@@ -995,11 +989,11 @@ const so = ({
   value: s,
   disabled: d = !1,
   error: t = !1,
-  icon: u = !1,
+  icon: m = !1,
   sx: C = {},
-  ...L
+  ...O
 }) => {
-  const m = H(), ae = () => m.palette.background.paper, w = () => t ? `inset 0px 0px 0px 2px ${m.palette.error.main}` : d ? i ? `inset 0px 0px 0px 2px ${m.palette.action.disabled}` : o === "outlined" ? `inset 0px 0px 0px 1px ${m.palette.action.disabledBackground}` : `inset 0px 0px 0px 1px ${m.palette.action.disabled}` : o === "outlined" ? i ? `inset 0px 0px 0px 2px ${b(m.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${b(m.palette.common.black, 0.23)}` : i ? `inset 0px 0px 0px 2px ${b(m.palette.primary.main, 0.5)}` : m.shadows[1], ne = () => d || t ? m.palette.background.paper : b(m.palette.primary.main, 0.1), le = () => d || t ? w() : o === "outlined" ? i ? `inset 0px 0px 0px 2px ${b(m.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${b(m.palette.primary.main, 0.5)}` : w(), ce = () => d || t ? m.palette.background.paper : b(m.palette.primary.main, 0.3);
+  const g = H(), ae = () => g.palette.background.paper, w = () => t ? `inset 0px 0px 0px 2px ${g.palette.error.main}` : d ? i ? `inset 0px 0px 0px 2px ${g.palette.action.disabled}` : o === "outlined" ? `inset 0px 0px 0px 1px ${g.palette.action.disabledBackground}` : `inset 0px 0px 0px 1px ${g.palette.action.disabled}` : o === "outlined" ? i ? `inset 0px 0px 0px 2px ${b(g.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${b(g.palette.common.black, 0.23)}` : i ? `inset 0px 0px 0px 2px ${b(g.palette.primary.main, 0.5)}` : g.shadows[1], ne = () => d || t ? g.palette.background.paper : b(g.palette.primary.main, 0.1), le = () => d || t ? w() : o === "outlined" ? i ? `inset 0px 0px 0px 2px ${b(g.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${b(g.palette.primary.main, 0.5)}` : w(), ce = () => d || t ? g.palette.background.paper : b(g.palette.primary.main, 0.3);
   return /* @__PURE__ */ a(
     ke,
     {
@@ -1017,10 +1011,10 @@ const so = ({
               fontSize: "20px"
             }
           },
-          ...L
+          ...O
         }
       ) : /* @__PURE__ */ a(
-        Le,
+        Oe,
         {
           name: n,
           sx: {
@@ -1032,12 +1026,12 @@ const so = ({
               fontSize: "20px"
             }
           },
-          ...L
+          ...O
         }
       ),
       disabled: d,
       label: /* @__PURE__ */ T(_, { sx: { display: "flex", alignItems: "flex-start", width: "100%" }, children: [
-        u && /* @__PURE__ */ a(_, { sx: { mr: 12, mt: "8px", flexShrink: 0 }, children: u }),
+        m && /* @__PURE__ */ a(_, { sx: { mr: 12, mt: "8px", flexShrink: 0 }, children: m }),
         /* @__PURE__ */ T(_, { sx: { flex: 1, minWidth: 0, py: "8px" }, children: [
           c && /* @__PURE__ */ a(X, { fontWeight: 600, sx: { lineHeight: "24px", pb: "4px" }, variant: "body1", children: c }),
           /* @__PURE__ */ a(X, { sx: { lineHeight: "20px" }, variant: "subtitle2", children: r })
@@ -1050,7 +1044,7 @@ const so = ({
         padding: "6px 16px",
         alignItems: "flex-start",
         justifyContent: "space-between",
-        borderRadius: m.shape.borderRadius / 2,
+        borderRadius: g.shape.borderRadius / 2,
         mb: 16,
         cursor: d ? "not-allowed" : "pointer",
         opacity: d ? 0.6 : 1,
@@ -1058,8 +1052,8 @@ const so = ({
         border: "none",
         boxShadow: w(),
         boxSizing: "border-box",
-        transition: m.transitions.create(["background-color", "box-shadow"], {
-          duration: m.transitions.duration.short
+        transition: g.transitions.create(["background-color", "box-shadow"], {
+          duration: g.transitions.duration.short
         }),
         "&:hover": {
           backgroundColor: ne(),
@@ -1069,7 +1063,7 @@ const so = ({
           backgroundColor: ce()
         },
         "&:focus-visible": {
-          outline: `2px solid ${m.palette.info.main}`,
+          outline: `2px solid ${g.palette.info.main}`,
           outlineOffset: "2px"
         },
         ...C
@@ -1079,18 +1073,18 @@ const so = ({
   );
 }, y = {
   LIGHT: "light"
-}, M = (e) => ({
-  50: F(e, 0.95),
-  100: F(e, 0.85),
-  200: F(e, 0.7),
-  300: F(e, 0.55),
-  400: F(e, 0.3),
+}, A = (e) => ({
+  50: L(e, 0.95),
+  100: L(e, 0.85),
+  200: L(e, 0.7),
+  300: L(e, 0.55),
+  400: L(e, 0.3),
   500: e,
   600: D(e, 0.3),
   700: D(e, 0.5),
   800: D(e, 0.65),
   900: D(e, 0.75)
-}), A = "#FFFFFF", z = "#000000", Xe = "#F9F9F9", je = "#000000", Qe = "#FFFFFF", Je = "#1A1A1A", E = {
+}), M = "#FFFFFF", z = "#000000", Xe = "#F9F9F9", je = "#000000", Qe = "#FFFFFF", Je = "#1A1A1A", E = {
   PRIMARY: "#2C64EF",
   SECONDARY: "#808080",
   INFO: "#2C64EF",
@@ -1113,7 +1107,7 @@ const so = ({
   CHART_MONO4: "#2F73DA",
   CHART_MONO5: "#034AB3",
   CHART_MONO6: "#002966"
-}, p = {
+}, u = {
   AUTO_TRANSPORTT: "#00B0FF",
   BILLS_UTILITIES: "#F949BD",
   BUSINESS_SERVICES: "#2979FF",
@@ -1136,7 +1130,7 @@ const so = ({
   TRANSFER: "#2B9580",
   TRAVEL: "#3D5AFE",
   UNCATEGORIZED: "#8495AD"
-}, h = {
+}, p = {
   AUTO_TRANSPORTT: "#77DAFF",
   BILLS_UTILITIES: "#FF81D4",
   BUSINESS_SERVICES: "#4BBAFF",
@@ -1160,7 +1154,7 @@ const so = ({
   TRAVEL: "#76ACF7",
   UNCATEGORIZED: "#BCC6D4"
 }, qe = (e, o) => {
-  const i = M(o?.primary || E.PRIMARY), l = M(o?.secondary || E.SECONDARY), c = M(o?.error || E.ERROR), r = M(o?.warning || E.WARNING), n = M(o?.info || E.INFO), s = M(o?.success || E.SUCCESS), d = M(o?.grey || E.GREY), t = e === y.LIGHT;
+  const i = A(o?.primary || E.PRIMARY), l = A(o?.secondary || E.SECONDARY), c = A(o?.error || E.ERROR), r = A(o?.warning || E.WARNING), n = A(o?.info || E.INFO), s = A(o?.success || E.SUCCESS), d = A(o?.grey || E.GREY), t = e === y.LIGHT;
   return {
     mode: e,
     // DEPRECATED: Use grey instead
@@ -1174,7 +1168,7 @@ const so = ({
       darker: d[500]
     },
     common: {
-      white: A,
+      white: M,
       black: z
     },
     primary: {
@@ -1206,12 +1200,12 @@ const so = ({
       dark: t ? d[700] : d[200],
       /* DEPRECATED: Use dark instead */
       darker: t ? d[900] : d[100],
-      contrastText: De(t ? d[700] : d[400], "#fff") > 4.5 ? A : d[900]
+      contrastText: De(t ? d[700] : d[400], "#fff") > 4.5 ? M : d[900]
     },
     text: {
-      primary: t ? d[900] : A,
-      secondary: t ? d[600] : b(A, 0.7),
-      disabled: t ? d[500] : b(A, 0.38)
+      primary: t ? d[900] : M,
+      secondary: t ? d[600] : b(M, 0.7),
+      disabled: t ? d[500] : b(M, 0.38)
     },
     error: {
       ...c,
@@ -1255,7 +1249,7 @@ const so = ({
     },
     grey: d,
     action: {
-      active: t ? b(z, 0.56) : b(A, 0.56),
+      active: t ? b(z, 0.56) : b(M, 0.56),
       hoverOpacity: t ? 0.1 : 0.2,
       selectedOpacity: t ? 0.16 : 0.25,
       focusOpacity: 0.3
@@ -1266,30 +1260,30 @@ const so = ({
       highlight: t ? d[200] : d[600],
       highlightPrimary: t ? i[100] : i[500]
     },
-    divider: t ? b(z, 0.12) : b(A, 0.24),
+    divider: t ? b(z, 0.12) : b(M, 0.24),
     categories: {
-      autoTransport: t ? p.AUTO_TRANSPORTT : h.AUTO_TRANSPORTT,
-      billsUtilities: t ? p.BILLS_UTILITIES : h.BILLS_UTILITIES,
-      businessServices: t ? p.BUSINESS_SERVICES : h.BUSINESS_SERVICES,
-      education: t ? p.EDUCATION : h.EDUCATION,
-      entertainment: t ? p.ENTERTAINMENT : h.ENTERTAINMENT,
-      feesCharges: t ? p.FEES_CHARGES : h.FEES_CHARGES,
-      financial: t ? p.FINANCIAL : h.FINANCIAL,
-      foodDining: t ? p.FOOD_DINING : h.FOOD_DINING,
-      giftsDonations: t ? p.GIFTS_DONATIONS : h.GIFTS_DONATIONS,
-      healthFitness: t ? p.HEALTH_FITNESS : h.HEALTH_FITNESS,
-      home: t ? p.HOME : h.HOME,
-      income: t ? p.INCOME : h.INCOME,
-      investments: t ? p.INVESTMENTS : h.INVESTMENTS,
-      kids: t ? p.KIDS : h.KIDS,
-      others: t ? p.OTHERS : h.OTHERS,
-      personalCare: t ? p.PERSONAL_CARE : h.PERSONAL_CARE,
-      pets: t ? p.PETS : h.PETS,
-      shopping: t ? p.SHOPPING : h.SHOPPING,
-      taxes: t ? p.TAXES : h.TAXES,
-      transfer: t ? p.TRANSFER : h.TRANSFER,
-      travel: t ? p.TRAVEL : h.TRAVEL,
-      uncategorized: t ? p.UNCATEGORIZED : h.UNCATEGORIZED
+      autoTransport: t ? u.AUTO_TRANSPORTT : p.AUTO_TRANSPORTT,
+      billsUtilities: t ? u.BILLS_UTILITIES : p.BILLS_UTILITIES,
+      businessServices: t ? u.BUSINESS_SERVICES : p.BUSINESS_SERVICES,
+      education: t ? u.EDUCATION : p.EDUCATION,
+      entertainment: t ? u.ENTERTAINMENT : p.ENTERTAINMENT,
+      feesCharges: t ? u.FEES_CHARGES : p.FEES_CHARGES,
+      financial: t ? u.FINANCIAL : p.FINANCIAL,
+      foodDining: t ? u.FOOD_DINING : p.FOOD_DINING,
+      giftsDonations: t ? u.GIFTS_DONATIONS : p.GIFTS_DONATIONS,
+      healthFitness: t ? u.HEALTH_FITNESS : p.HEALTH_FITNESS,
+      home: t ? u.HOME : p.HOME,
+      income: t ? u.INCOME : p.INCOME,
+      investments: t ? u.INVESTMENTS : p.INVESTMENTS,
+      kids: t ? u.KIDS : p.KIDS,
+      others: t ? u.OTHERS : p.OTHERS,
+      personalCare: t ? u.PERSONAL_CARE : p.PERSONAL_CARE,
+      pets: t ? u.PETS : p.PETS,
+      shopping: t ? u.SHOPPING : p.SHOPPING,
+      taxes: t ? u.TAXES : p.TAXES,
+      transfer: t ? u.TRANSFER : p.TRANSFER,
+      travel: t ? u.TRAVEL : p.TRAVEL,
+      uncategorized: t ? u.UNCATEGORIZED : p.UNCATEGORIZED
     },
     chart: {
       chart1: S.CHART1,
@@ -2214,13 +2208,13 @@ export {
   f as BaseIcon,
   eo as BottomSheetTransition,
   z0 as CalendarIcon,
-  g as CategoryGuids,
+  h as CategoryGuids,
   Ve as CategoryIcon,
   Be as CategoryIconList,
   _e as CategoryIconVariants,
   V0 as CheckmarkFilledIcon,
-  $0 as ChevronDownIcon,
-  G0 as ChevronLeftIcon,
+  G0 as ChevronDownIcon,
+  $0 as ChevronLeftIcon,
   U0 as ChevronRightIcon,
   W0 as CloseIcon,
   q0 as DateRangePicker,
@@ -2245,7 +2239,7 @@ export {
   lo as MerchantLogo,
   to as P,
   ho as SelectionBox,
-  O as TARGETS,
+  F as TARGETS,
   N as THEMES,
   k as Text,
   co as TextField,