@mxenabled/mxui 2.2.4 → 2.2.6

package/dist/index.es.js

@@ -1,18 +1,18 @@
 import { jsx as a, jsxs as b } from "react/jsx-runtime";
-import H from "react";
+import N from "react";
 import A from "@mui/material/Stack";
 import { useTheme as E, createTheme as $ } from "@mui/material/styles";
 import { Icon as le, ExpandMore as se, Close as ce } from "@mxenabled/mx-icons";
 import { endOfMonth as U } from "date-fns/endOfMonth";
 import { endOfYear as de } from "date-fns/endOfYear";
-import { startOfToday as pe } from "date-fns/startOfToday";
-import { startOfMonth as V } from "date-fns/startOfMonth";
-import { startOfYear as G } from "date-fns/startOfYear";
+import { startOfToday as ue } from "date-fns/startOfToday";
+import { startOfMonth as G } from "date-fns/startOfMonth";
+import { startOfYear as V } from "date-fns/startOfYear";
 import { subDays as W } from "date-fns/subDays";
-import { subMonths as ue } from "date-fns/subMonths";
+import { subMonths as pe } from "date-fns/subMonths";
 import { subYears as he } from "date-fns/subYears";
 import ge from "@mui/material/useMediaQuery";
-import { usePickerContext as j, useIsValidValue as Z, LocalizationProvider as fe, StaticDateRangePicker as me } from "@mui/x-date-pickers-pro";
+import { usePickerContext as X, useIsValidValue as Z, LocalizationProvider as me, StaticDateRangePicker as fe } from "@mui/x-date-pickers-pro";
 import { AdapterDateFns as be } from "@mui/x-date-pickers-pro/AdapterDateFns";
 import { MultiInputDateRangeField as Te } from "@mui/x-date-pickers-pro/MultiInputDateRangeField";
 import Q from "@mui/material/Box";
@@ -24,14 +24,14 @@ import { usePickerLayout as Ce, PickersLayoutRoot as Se, PickersLayoutContentWra
 import q from "@mui/material/Slide";
 import B from "@mui/material/Button";
 import ee from "@mui/material/IconButton";
-import Ie from "@mui/material/Typography";
-import ye from "@mui/material/Drawer";
+import ye from "@mui/material/Typography";
+import Ie from "@mui/material/Drawer";
 import Ee from "@mui/material/Snackbar";
 import Oe from "@mui/material/Alert";
-import { FormControlLabel as Fe, Box as w, Typography as Y, Radio as P, Checkbox as ve, alpha as m, darken as N, lighten as O, getContrastRatio as Ne } from "@mui/material";
-import { circularProgressClasses as He } from "@mui/material/CircularProgress";
-import { LicenseInfo as Le } from "@mui/x-license";
-const L = ({
+import { FormControlLabel as Fe, Box as w, Typography as Y, Radio as P, Checkbox as ve, alpha as f, darken as L, lighten as O, getContrastRatio as Le } from "@mui/material";
+import { circularProgressClasses as Ne } from "@mui/material/CircularProgress";
+import { LicenseInfo as He } from "@mui/x-license";
+const H = ({
   children: e,
   height: i,
   size: r = 16,
@@ -52,7 +52,7 @@ const L = ({
 ), x = ({ color: e, fill: i = !1, name: r, size: s = 20, sx: l, ...t }) => /* @__PURE__ */ a(le, { color: e, fill: i, name: r, size: s, sx: l, ...t }), Ft = ({
   color: e = "currentColor",
   ...i
-}) => /* @__PURE__ */ b(L, { ...i, children: [
+}) => /* @__PURE__ */ b(H, { ...i, children: [
   /* @__PURE__ */ a(
     "path",
     {
@@ -70,7 +70,7 @@ const L = ({
 ] }), vt = ({
   color: e = "currentColor",
   ...i
-}) => /* @__PURE__ */ b(L, { ...i, children: [
+}) => /* @__PURE__ */ b(H, { ...i, children: [
   /* @__PURE__ */ a(
     "path",
     {
@@ -103,10 +103,10 @@ const L = ({
       fillRule: "evenodd"
     }
   )
-] }), Nt = ({
+] }), Lt = ({
   color: e = "currentColor",
   ...i
-}) => /* @__PURE__ */ a(L, { ...i, children: /* @__PURE__ */ a(
+}) => /* @__PURE__ */ a(H, { ...i, children: /* @__PURE__ */ a(
   "path",
   {
     clipRule: "evenodd",
@@ -114,10 +114,10 @@ const L = ({
     fill: e,
     fillRule: "evenodd"
   }
-) }), Ht = ({
+) }), Nt = ({
   color: e = "currentColor",
   ...i
-}) => /* @__PURE__ */ b(L, { ...i, children: [
+}) => /* @__PURE__ */ b(H, { ...i, children: [
   /* @__PURE__ */ a(
     "path",
     {
@@ -142,109 +142,109 @@ const L = ({
     }
   )
 ] });
-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 || {}), ke = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(ke || {});
+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 || {}), ke = /* @__PURE__ */ ((e) => (e.Basic = "basic", e.Filled = "filled", e.Transparent = "transparent", e.TwoTone = "two-tone", e))(ke || {});
 const te = {
-  guid: g.Uncategorized,
+  guid: h.Uncategorized,
   colorName: "uncategorized",
   icon: "category"
 }, De = [
   {
-    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"
   },
@@ -256,8 +256,8 @@ const te = {
   sx: s = {},
   variant: l = "filled"
 }) => {
-  const t = E(), n = H.useMemo(
-    () => De.find((p) => p.guid === e) ?? te,
+  const t = E(), n = N.useMemo(
+    () => De.find((m) => m.guid === e) ?? te,
     [e]
   ), c = t.palette.categories[n.colorName];
   return /* @__PURE__ */ a(
@@ -265,13 +265,13 @@ const te = {
     {
       alignItems: "center",
       bgcolor: () => {
-        let p = c;
-        return l === "twotone" && (p = `${p}20`), l === "transparent" || l === "basic" ? "transparent" : p;
+        let m = c;
+        return l === "twotone" && (m = `${m}20`), l === "transparent" || l === "basic" ? "transparent" : m;
       },
       borderRadius: 1,
       color: () => {
-        const p = l === "filled" ? t.palette.common.white : c;
-        return l === "basic" ? t.palette.text.primary : p;
+        const m = l === "filled" ? t.palette.common.white : c;
+        return l === "basic" ? t.palette.text.primary : m;
       },
       height: r,
       justifyContent: "center",
@@ -281,7 +281,7 @@ const te = {
     }
   );
 }, _e = ({ items: e, selected: i }) => {
-  const r = E(), { setValue: s } = j(), l = Z(), t = e?.map((n) => {
+  const r = E(), { setValue: s } = X(), l = Z(), t = e?.map((n) => {
     const c = n.getValue({ isValid: l });
     return {
       label: n.label,
@@ -324,7 +324,7 @@ const te = {
   selected: i,
   selectLabel: r
 }) => {
-  const { setValue: s } = j(), l = Z(), t = e?.map((n) => {
+  const { setValue: s } = X(), l = Z(), t = e?.map((n) => {
     const c = n.getValue({ isValid: l });
     return {
       label: n.label,
@@ -384,23 +384,23 @@ const te = {
       ]
     }
   );
-}, Lt = ({
+}, Ht = ({
   copy: e,
   dateRange: i,
   onRangeChanged: r,
   selectedShortcut: s = e.dateRangeThisMonth,
   sx: l = {}
 }) => {
-  const t = E(), n = ge(t.breakpoints.down("sm")), c = H.useMemo(() => {
-    const o = pe(), p = ue(o, 1), T = he(o, 1);
+  const t = E(), n = ge(t.breakpoints.down("sm")), c = N.useMemo(() => {
+    const o = ue(), m = pe(o, 1), T = he(o, 1);
     return [
       {
         label: e.dateRangeThisMonth,
-        getValue: () => [V(o), U(o)]
+        getValue: () => [G(o), U(o)]
       },
       {
         label: e.dateRangeLastMonth,
-        getValue: () => [V(p), U(p)]
+        getValue: () => [G(m), U(m)]
       },
       {
         label: e.dateRangeLast30Days,
@@ -412,23 +412,23 @@ const te = {
       },
       {
         label: e.dateRangeYTD,
-        getValue: () => [G(o), o]
+        getValue: () => [V(o), o]
       },
       {
         label: e.dateRangeLastYear,
-        getValue: () => [G(T), de(T)]
+        getValue: () => [V(T), de(T)]
       },
       {
         label: e.dateRangeCustom,
         getValue: () => [o, o]
       }
     ];
-  }, [e]), d = (o, p) => {
-    const T = p.shortcut;
+  }, [e]), d = (o, m) => {
+    const T = m.shortcut;
     r?.(o, T ? T.label : e.dateRangeCustom);
   };
-  return /* @__PURE__ */ a(A, { gap: n ? 0 : 16, m: n ? 0 : 8, children: /* @__PURE__ */ a(fe, { dateAdapter: be, children: /* @__PURE__ */ a(
-    me,
+  return /* @__PURE__ */ a(A, { gap: n ? 0 : 16, m: n ? 0 : 8, children: /* @__PURE__ */ a(me, { dateAdapter: be, children: /* @__PURE__ */ a(
+    fe,
     {
       calendars: 1,
       localeText: {
@@ -467,8 +467,8 @@ const te = {
               format: "MM/dd/yyyy",
               ...o,
               slotProps: {
-                textField: ({ position: p }) => ({
-                  label: p === "start" ? e.dateRangeFrom : e.dateRangeTo
+                textField: ({ position: m }) => ({
+                  label: m === "start" ? e.dateRangeFrom : e.dateRangeTo
                 })
               },
               sx: { gap: 8 }
@@ -480,7 +480,7 @@ const te = {
       value: i
     }
   ) }) });
-}, kt = H.forwardRef(function(i, r) {
+}, kt = N.forwardRef(function(i, r) {
   return /* @__PURE__ */ a(q, { direction: "up", ref: r, ...i });
 }), $e = ({
   hasSecondaryAction: e = !0,
@@ -530,7 +530,7 @@ const te = {
   uppercase: n,
   ...c
 }) => /* @__PURE__ */ a(
-  Ie,
+  ye,
   {
     className: `mx-kmui-text ${i}`,
     color: s,
@@ -578,7 +578,7 @@ const te = {
   children: d,
   ...o
 }) => /* @__PURE__ */ b(
-  ye,
+  Ie,
   {
     anchor: "right",
     className: `mx-kmui-drawer ${e}`,
@@ -630,7 +630,7 @@ const te = {
   size: s = oe,
   ...l
 }) => {
-  const [t, n] = H.useState(!1), c = E();
+  const [t, n] = N.useState(!1), c = E();
   return /* @__PURE__ */ b(Q, { display: "inline-block", position: "relative", ...l, children: [
     r && !t && /* @__PURE__ */ a(
       "img",
@@ -669,113 +669,106 @@ const te = {
     ...l
   }
 );
-function Ve(e) {
+function Ge(e) {
   return /* @__PURE__ */ a(q, { ...e, direction: "left", mountOnEnter: !0, unmountOnExit: !0 });
 }
-const Vt = ({
-  open: e,
+const Gt = ({
+  open: e = !0,
   handleClose: i,
-  message: r,
-  autoHideDuration: s = 3e3,
-  severity: l = "success",
-  snackbarSx: t,
-  showAction: n = !1,
-  showClose: c = !1,
-  actionText: d = "Undo",
-  onActionClick: o,
-  multiLine: p = !1
+  closeAriaLabel: r,
+  message: s,
+  autoHideDuration: l = 3e3,
+  severity: t = "success",
+  snackbarSx: n,
+  showAction: c = !1,
+  showClose: d = !1,
+  actionText: o = "Undo",
+  onActionClick: m
 }) => {
-  const T = E(), v = /* @__PURE__ */ b(
-    A,
-    {
-      alignItems: p ? "flex-end" : "center",
-      direction: p ? "column-reverse" : "row",
-      justifyContent: (
-        // eslint-disable-next-line no-nested-ternary
-        p && n && c ? "space-between" : "flex-end"
-      ),
-      children: [
-        n && /* @__PURE__ */ a(
-          B,
-          {
-            color: "inherit",
-            onClick: o || i,
-            size: "small",
-            sx: {
-              color: T.palette.success.contrastText,
-              height: 44
-            },
-            children: d
-          }
-        ),
-        c && /* @__PURE__ */ a(
-          ee,
-          {
-            "aria-label": "close",
-            color: "inherit",
-            onClick: i,
-            sx: { height: 44, width: 44 },
-            children: /* @__PURE__ */ a(x, { fill: !0, name: "close", size: 24 })
-          }
-        )
-      ]
-    }
-  );
+  const T = E(), v = d && /* @__PURE__ */ a(ee, { "aria-label": r, color: "inherit", onClick: i, size: "small", children: /* @__PURE__ */ a(x, { fill: !0, name: "close" }) }), g = `${t}.main`;
   return /* @__PURE__ */ a(
     Ee,
     {
-      TransitionComponent: Ve,
       anchorOrigin: { vertical: "bottom", horizontal: "right" },
-      autoHideDuration: s,
+      autoHideDuration: l,
       onClose: i,
       open: e,
+      slots: { transition: Ge },
       sx: {
-        ...t,
-        width: p ? 400 : 325
+        ...n,
+        maxWidth: 568,
+        minWidth: 288,
+        minHeight: 56
       },
       children: /* @__PURE__ */ a(
         Oe,
         {
           action: v,
-          severity: l,
+          severity: t,
           sx: {
+            backgroundColor: g,
             display: "flex",
-            alignItems: "stretch",
-            minHeight: c && n && p ? 120 : 56,
-            maxHeight: p ? 120 : 56,
             width: "100%",
-            "& .MuiAlert-icon": {
-              alignSelf: p ? "flex-start" : "center"
-            },
+            py: 8,
             "& .MuiAlert-message": {
-              paddingTop: p ? 12 : 8,
-              paddingBottom: p ? 12 : 8,
-              alignSelf: p ? "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(
-            F,
+          children: /* @__PURE__ */ b(
+            A,
             {
               sx: {
-                lineHeight: T.typography.body1.lineHeight,
-                whiteSpace: p ? "normal" : "nowrap",
-                overflow: p ? "visible" : "hidden",
-                textOverflow: p ? "clip" : "ellipsis"
+                flexDirection: "row",
+                flexWrap: "wrap",
+                alignItems: "baseline",
+                justifyContent: "space-between",
+                width: "100%",
+                rowGap: "16px",
+                columnGap: "16px"
               },
-              truncate: !p,
-              children: r
+              children: [
+                /* @__PURE__ */ a(
+                  F,
+                  {
+                    sx: {
+                      lineHeight: T.typography.body1.lineHeight,
+                      flex: 1,
+                      minWidth: "70%",
+                      px: 5
+                    },
+                    children: s
+                  }
+                ),
+                c && /* @__PURE__ */ a(
+                  B,
+                  {
+                    color: "inherit",
+                    onClick: m || i,
+                    size: "small",
+                    sx: {
+                      color: T.palette.success.contrastText,
+                      whiteSpace: "nowrap",
+                      flexShrink: 0,
+                      minWidth: "auto",
+                      justifyContent: "flex-start"
+                    },
+                    children: o
+                  }
+                )
+              ]
             }
           )
         }
       )
     }
   );
-}, Gt = ({
+}, Vt = ({
   component: e = P,
   variant: i = "outlined",
   selected: r,
@@ -786,11 +779,11 @@ const Vt = ({
   value: c,
   disabled: d = !1,
   error: o = !1,
-  icon: p = !1,
+  icon: m = !1,
   sx: T = {},
   ...v
 }) => {
-  const f = E(), re = () => f.palette.background.paper, k = () => o ? `inset 0px 0px 0px 2px ${f.palette.error.main}` : d ? r ? `inset 0px 0px 0px 2px ${f.palette.action.disabled}` : i === "outlined" ? `inset 0px 0px 0px 1px ${f.palette.action.disabledBackground}` : `inset 0px 0px 0px 1px ${f.palette.action.disabled}` : i === "outlined" ? r ? `inset 0px 0px 0px 2px ${m(f.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${m(f.palette.common.black, 0.23)}` : r ? `inset 0px 0px 0px 2px ${m(f.palette.primary.main, 0.5)}` : f.shadows[1], ie = () => d || o ? f.palette.background.paper : m(f.palette.primary.main, 0.1), ae = () => d || o ? k() : i === "outlined" ? r ? `inset 0px 0px 0px 2px ${m(f.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${m(f.palette.primary.main, 0.5)}` : k(), ne = () => d || o ? f.palette.background.paper : m(f.palette.primary.main, 0.3);
+  const g = E(), re = () => g.palette.background.paper, k = () => o ? `inset 0px 0px 0px 2px ${g.palette.error.main}` : d ? r ? `inset 0px 0px 0px 2px ${g.palette.action.disabled}` : i === "outlined" ? `inset 0px 0px 0px 1px ${g.palette.action.disabledBackground}` : `inset 0px 0px 0px 1px ${g.palette.action.disabled}` : i === "outlined" ? r ? `inset 0px 0px 0px 2px ${f(g.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${f(g.palette.common.black, 0.23)}` : r ? `inset 0px 0px 0px 2px ${f(g.palette.primary.main, 0.5)}` : g.shadows[1], ie = () => d || o ? g.palette.background.paper : f(g.palette.primary.main, 0.1), ae = () => d || o ? k() : i === "outlined" ? r ? `inset 0px 0px 0px 2px ${f(g.palette.primary.main, 0.5)}` : `inset 0px 0px 0px 1px ${f(g.palette.primary.main, 0.5)}` : k(), ne = () => d || o ? g.palette.background.paper : f(g.palette.primary.main, 0.3);
   return /* @__PURE__ */ a(
     Fe,
     {
@@ -828,7 +821,7 @@ const Vt = ({
       ),
       disabled: d,
       label: /* @__PURE__ */ b(w, { sx: { display: "flex", alignItems: "flex-start", width: "100%" }, children: [
-        p && /* @__PURE__ */ a(w, { sx: { mr: 12, mt: "8px", flexShrink: 0 }, children: p }),
+        m && /* @__PURE__ */ a(w, { sx: { mr: 12, mt: "8px", flexShrink: 0 }, children: m }),
         /* @__PURE__ */ b(w, { sx: { flex: 1, minWidth: 0, py: "8px" }, children: [
           l && /* @__PURE__ */ a(Y, { fontWeight: 600, sx: { lineHeight: "24px", pb: "4px" }, variant: "body1", children: l }),
           /* @__PURE__ */ a(Y, { sx: { lineHeight: "20px" }, variant: "subtitle2", children: t })
@@ -841,7 +834,7 @@ const Vt = ({
         padding: "6px 16px",
         alignItems: "flex-start",
         justifyContent: "space-between",
-        borderRadius: f.shape.borderRadius / 2,
+        borderRadius: g.shape.borderRadius / 2,
         mb: 16,
         cursor: d ? "not-allowed" : "pointer",
         opacity: d ? 0.6 : 1,
@@ -849,8 +842,8 @@ const Vt = ({
         border: "none",
         boxShadow: k(),
         boxSizing: "border-box",
-        transition: f.transitions.create(["background-color", "box-shadow"], {
-          duration: f.transitions.duration.short
+        transition: g.transitions.create(["background-color", "box-shadow"], {
+          duration: g.transitions.duration.short
         }),
         "&:hover": {
           backgroundColor: ie(),
@@ -860,7 +853,7 @@ const Vt = ({
           backgroundColor: ne()
         },
         "&:focus-visible": {
-          outline: `2px solid ${f.palette.info.main}`,
+          outline: `2px solid ${g.palette.info.main}`,
           outlineOffset: "2px"
         },
         ...T
@@ -868,7 +861,7 @@ const Vt = ({
       value: c
     }
   );
-}, y = {
+}, I = {
   LIGHT: "light"
 }, R = (e) => ({
   50: O(e, 0.95),
@@ -877,11 +870,11 @@ const Vt = ({
   300: O(e, 0.55),
   400: O(e, 0.3),
   500: e,
-  600: N(e, 0.3),
-  700: N(e, 0.5),
-  800: N(e, 0.65),
-  900: N(e, 0.75)
-}), M = "#FFFFFF", _ = "#000000", Ge = "#F9F9F9", We = "#000000", Ye = "#FFFFFF", Ke = "#000000", C = {
+  600: L(e, 0.3),
+  700: L(e, 0.5),
+  800: L(e, 0.65),
+  900: L(e, 0.75)
+}), M = "#FFFFFF", _ = "#000000", Ve = "#F9F9F9", We = "#000000", Ye = "#FFFFFF", Ke = "#000000", C = {
   PRIMARY: "#2C64EF",
   SECONDARY: "#808080",
   INFO: "#2C64EF",
@@ -897,7 +890,7 @@ const Vt = ({
   CHART5: "#60A9FF",
   CHART6: "#C8BAEE",
   CHART7: "#585E67"
-}, I = {
+}, y = {
   CHART_MONO1: "#C3EAFF",
   CHART_MONO2: "#8ED7FF",
   CHART_MONO3: "#60A9FF",
@@ -927,7 +920,7 @@ const Vt = ({
   TRANSFER: "#2B9580",
   TRAVEL: "#3D5AFE",
   UNCATEGORIZED: "#8495AD"
-}, h = {
+}, p = {
   AUTO_TRANSPORTT: "#77DAFF",
   BILLS_UTILITIES: "#FF81D4",
   BUSINESS_SERVICES: "#4BBAFF",
@@ -950,8 +943,8 @@ const Vt = ({
   TRANSFER: "#75C7B7",
   TRAVEL: "#76ACF7",
   UNCATEGORIZED: "#BCC6D4"
-}, Xe = (e, i) => {
-  const r = R(i?.primary || C.PRIMARY), s = R(i?.secondary || C.SECONDARY), l = R(i?.error || C.ERROR), t = R(i?.warning || C.WARNING), n = R(i?.info || C.INFO), c = R(i?.success || C.SUCCESS), d = R(i?.grey || C.GREY), o = e === y.LIGHT;
+}, je = (e, i) => {
+  const r = R(i?.primary || C.PRIMARY), s = R(i?.secondary || C.SECONDARY), l = R(i?.error || C.ERROR), t = R(i?.warning || C.WARNING), n = R(i?.info || C.INFO), c = R(i?.success || C.SUCCESS), d = R(i?.grey || C.GREY), o = e === I.LIGHT;
   return {
     mode: e,
     common: {
@@ -975,12 +968,12 @@ const Vt = ({
       light: o ? d[300] : d[600],
       main: o ? d[500] : d[400],
       dark: o ? d[700] : d[200],
-      contrastText: Ne(o ? d[700] : d[400], "#fff") > 4.5 ? M : d[900]
+      contrastText: Le(o ? d[700] : d[400], "#fff") > 4.5 ? M : d[900]
     },
     text: {
       primary: o ? d[900] : M,
-      secondary: o ? d[600] : m(M, 0.7),
-      disabled: o ? d[500] : m(M, 0.38)
+      secondary: o ? d[600] : f(M, 0.7),
+      disabled: o ? d[500] : f(M, 0.38)
     },
     error: {
       ...l,
@@ -1008,41 +1001,41 @@ const Vt = ({
     },
     grey: d,
     action: {
-      active: o ? m(_, 0.56) : m(M, 0.56),
+      active: o ? f(_, 0.56) : f(M, 0.56),
       hoverOpacity: o ? 0.1 : 0.2,
       selectedOpacity: o ? 0.16 : 0.25,
       focusOpacity: 0.3
     },
     background: {
-      default: o ? i?.background?.default?.light || Ge : i?.background?.default?.dark || We,
+      default: o ? i?.background?.default?.light || Ve : i?.background?.default?.dark || We,
       paper: o ? i?.background?.paper?.light || Ye : i?.background?.paper?.dark || Ke,
       highlight: o ? d[200] : d[600],
       highlightPrimary: o ? r[100] : r[500]
     },
-    divider: o ? m(_, 0.12) : m(M, 0.24),
+    divider: o ? f(_, 0.12) : f(M, 0.24),
     categories: {
-      autoTransport: o ? u.AUTO_TRANSPORTT : h.AUTO_TRANSPORTT,
-      billsUtilities: o ? u.BILLS_UTILITIES : h.BILLS_UTILITIES,
-      businessServices: o ? u.BUSINESS_SERVICES : h.BUSINESS_SERVICES,
-      education: o ? u.EDUCATION : h.EDUCATION,
-      entertainment: o ? u.ENTERTAINMENT : h.ENTERTAINMENT,
-      feesCharges: o ? u.FEES_CHARGES : h.FEES_CHARGES,
-      financial: o ? u.FINANCIAL : h.FINANCIAL,
-      foodDining: o ? u.FOOD_DINING : h.FOOD_DINING,
-      giftsDonations: o ? u.GIFTS_DONATIONS : h.GIFTS_DONATIONS,
-      healthFitness: o ? u.HEALTH_FITNESS : h.HEALTH_FITNESS,
-      home: o ? u.HOME : h.HOME,
-      income: o ? u.INCOME : h.INCOME,
-      investments: o ? u.INVESTMENTS : h.INVESTMENTS,
-      kids: o ? u.KIDS : h.KIDS,
-      others: o ? u.OTHERS : h.OTHERS,
-      personalCare: o ? u.PERSONAL_CARE : h.PERSONAL_CARE,
-      pets: o ? u.PETS : h.PETS,
-      shopping: o ? u.SHOPPING : h.SHOPPING,
-      taxes: o ? u.TAXES : h.TAXES,
-      transfer: o ? u.TRANSFER : h.TRANSFER,
-      travel: o ? u.TRAVEL : h.TRAVEL,
-      uncategorized: o ? u.UNCATEGORIZED : h.UNCATEGORIZED
+      autoTransport: o ? u.AUTO_TRANSPORTT : p.AUTO_TRANSPORTT,
+      billsUtilities: o ? u.BILLS_UTILITIES : p.BILLS_UTILITIES,
+      businessServices: o ? u.BUSINESS_SERVICES : p.BUSINESS_SERVICES,
+      education: o ? u.EDUCATION : p.EDUCATION,
+      entertainment: o ? u.ENTERTAINMENT : p.ENTERTAINMENT,
+      feesCharges: o ? u.FEES_CHARGES : p.FEES_CHARGES,
+      financial: o ? u.FINANCIAL : p.FINANCIAL,
+      foodDining: o ? u.FOOD_DINING : p.FOOD_DINING,
+      giftsDonations: o ? u.GIFTS_DONATIONS : p.GIFTS_DONATIONS,
+      healthFitness: o ? u.HEALTH_FITNESS : p.HEALTH_FITNESS,
+      home: o ? u.HOME : p.HOME,
+      income: o ? u.INCOME : p.INCOME,
+      investments: o ? u.INVESTMENTS : p.INVESTMENTS,
+      kids: o ? u.KIDS : p.KIDS,
+      others: o ? u.OTHERS : p.OTHERS,
+      personalCare: o ? u.PERSONAL_CARE : p.PERSONAL_CARE,
+      pets: o ? u.PETS : p.PETS,
+      shopping: o ? u.SHOPPING : p.SHOPPING,
+      taxes: o ? u.TAXES : p.TAXES,
+      transfer: o ? u.TRANSFER : p.TRANSFER,
+      travel: o ? u.TRAVEL : p.TRAVEL,
+      uncategorized: o ? u.UNCATEGORIZED : p.UNCATEGORIZED
     },
     chart: {
       chart1: S.CHART1,
@@ -1054,16 +1047,16 @@ const Vt = ({
       chart7: S.CHART7
     },
     chartMono: {
-      chartMono1: I.CHART_MONO1,
-      chartMono2: I.CHART_MONO2,
-      chartMono3: I.CHART_MONO3,
-      chartMono4: I.CHART_MONO4,
-      chartMono5: I.CHART_MONO5,
-      chartMono6: I.CHART_MONO6
+      chartMono1: y.CHART_MONO1,
+      chartMono2: y.CHART_MONO2,
+      chartMono3: y.CHART_MONO3,
+      chartMono4: y.CHART_MONO4,
+      chartMono5: y.CHART_MONO5,
+      chartMono6: y.CHART_MONO6
     }
   };
-}, X = "Inter, Helvetica, Arial, sans-serif", je = (e) => {
-  const i = e?.fontFamily ? `${e?.fontFamily}, ${X}` : X;
+}, j = "Inter, Helvetica, Arial, sans-serif", Xe = (e) => {
+  const i = e?.fontFamily ? `${e?.fontFamily}, ${j}` : j;
   return {
     fontFamily: i,
     fontSize: 15,
@@ -1122,11 +1115,11 @@ const Vt = ({
     ...e
   };
 };
-Le.setLicenseKey(
+He.setLicenseKey(
   "702b0c04dc7df078768d2d45cd3a98c6Tz0xMjEzMDYsRT0xNzkzNzUwMzk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
 );
 const Wt = (e, i) => {
-  const r = Xe(e, i?.paletteOptions), s = je(i?.typographyOptions), l = [...$().shadows];
+  const r = je(e, i?.paletteOptions), s = Xe(i?.typographyOptions), l = [...$().shadows];
   return l[1] = "0px 2px 8px 0 rgba(0, 0, 0, 0.12)", l[8] = "0px 6px 12px 0 rgba(0, 0, 0, 0.16), 0px 3px 8px 0 rgba(0, 0, 0, 0.06)", l[16] = "0px 12px 20px 0 rgba(0, 0, 0, 0.22)", $({
     breakpoints: {
       values: {
@@ -1160,7 +1153,7 @@ const Wt = (e, i) => {
         styleOverrides: {
           root: ({ theme: t, ownerState: n }) => {
             const c = n.severity || "info";
-            let d = t.palette.mode === y.LIGHT ? t.palette[c]?.[50] : t.palette[c]?.[800];
+            let d = t.palette.mode === I.LIGHT ? t.palette[c]?.[50] : t.palette[c]?.[800];
             if (n.variant === "filled") {
               const o = c === "warning";
               d = t.palette[c]?.[o ? 400 : 600];
@@ -1248,7 +1241,7 @@ const Wt = (e, i) => {
       MuiCircularProgress: {
         styleOverrides: {
           root: {
-            [`& .${He.circle}`]: {
+            [`& .${Ne.circle}`]: {
               strokeLinecap: "round"
             }
           }
@@ -1471,7 +1464,7 @@ const Wt = (e, i) => {
               backgroundColor: t.palette.action.hover
             },
             "&:active": {
-              backgroundColor: t.palette.mode === y.LIGHT ? t.palette[n].light : t.palette[n].dark
+              backgroundColor: t.palette.mode === I.LIGHT ? t.palette[n].light : t.palette[n].dark
             }
           })
         }
@@ -1617,7 +1610,7 @@ const Wt = (e, i) => {
       },
       MuiPaper: {
         styleOverrides: {
-          root: {
+          rounded: {
             borderRadius: 8
           }
         }
@@ -1793,9 +1786,9 @@ const Wt = (e, i) => {
               outlineOffset: "2px"
             },
             "&:hover": {
-              backgroundColor: m(
+              backgroundColor: f(
                 t.palette.primary.main,
-                r.mode === y.LIGHT ? 0.1 : 0.2
+                r.mode === I.LIGHT ? 0.1 : 0.2
               ),
               borderColor: t.palette.primary.main
             },
@@ -1819,7 +1812,7 @@ const Wt = (e, i) => {
             props: { color: "error" },
             style: {
               "&:hover": {
-                backgroundColor: m(r.error.main, r.mode === y.LIGHT ? 0.1 : 0.2),
+                backgroundColor: f(r.error.main, r.mode === I.LIGHT ? 0.1 : 0.2),
                 borderColor: r.error.main
               },
               "&.Mui-selected": {
@@ -1841,9 +1834,9 @@ const Wt = (e, i) => {
             props: { color: "standard" },
             style: {
               "&:hover": {
-                backgroundColor: m(
+                backgroundColor: f(
                   r.secondary.main,
-                  r.mode === y.LIGHT ? 0.1 : 0.2
+                  r.mode === I.LIGHT ? 0.1 : 0.2
                 ),
                 borderColor: r.secondary.main
               },
@@ -1883,13 +1876,13 @@ const Wt = (e, i) => {
   });
 };
 export {
-  L as BaseIcon,
+  H as BaseIcon,
   kt as BottomSheetTransition,
-  g as CategoryGuids,
+  h as CategoryGuids,
   Pe as CategoryIcon,
   De as CategoryIconList,
   ke as CategoryIconVariants,
-  Lt as DateRangePicker,
+  Ht as DateRangePicker,
   $e as DialogFooter,
   _t as DialogHeader,
   Bt as Drawer,
@@ -1897,19 +1890,19 @@ export {
   Ue as H1,
   Dt as H2,
   wt as H3,
-  X as INTER,
+  j as INTER,
   x as Icon,
   zt as InstitutionLogo,
   vt as MXLogoCopyrightIcon,
-  Nt as MXLogoFilledIcon,
+  Lt as MXLogoFilledIcon,
   Ft as MXLogoIcon,
-  Ht as MXLogoOutlineIcon,
+  Nt as MXLogoOutlineIcon,
   $t as MerchantLogo,
   Pt as P,
-  Gt as SelectionBox,
+  Vt as SelectionBox,
   F as Text,
   Ut as TextField,
-  Vt as Toast,
+  Gt as Toast,
   Wt as createMXTheme
 };
 //# sourceMappingURL=index.es.js.map