@movable/ui 3.14.1 → 3.16.0-alpha.0

package/lib/index.mjs

@@ -123,14 +123,14 @@ function wf() {
         }
       return null;
     }
-    var z = Object.assign, _ = 0, $, W, U, F, k, V, ee;
+    var z = Object.assign, _ = 0, N, W, U, F, k, V, ee;
     function J() {
     }
     J.__reactDisabledLog = !0;
     function K() {
       {
         if (_ === 0) {
-          $ = console.log, W = console.info, U = console.warn, F = console.error, k = console.group, V = console.groupCollapsed, ee = console.groupEnd;
+          N = console.log, W = console.info, U = console.warn, F = console.error, k = console.group, V = console.groupCollapsed, ee = console.groupEnd;
           var O = {
             configurable: !0,
             enumerable: !0,
@@ -160,7 +160,7 @@ function wf() {
           };
           Object.defineProperties(console, {
             log: z({}, O, {
-              value: $
+              value: N
             }),
             info: z({}, O, {
               value: W
@@ -930,7 +930,7 @@ function Mf() {
         }
       }
     }
-    var w = c, R = u, j = l, M = s, A = t, b = d, P = o, B = y, I = g, z = r, _ = a, $ = i, W = m, U = !1;
+    var w = c, R = u, j = l, M = s, A = t, b = d, P = o, B = y, I = g, z = r, _ = a, N = i, W = m, U = !1;
     function F(L) {
       return U || (U = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), k(L) || v(L) === c;
     }
@@ -970,7 +970,7 @@ function Mf() {
     function oe(L) {
       return v(L) === m;
     }
-    je.AsyncMode = w, je.ConcurrentMode = R, je.ContextConsumer = j, je.ContextProvider = M, je.Element = A, je.ForwardRef = b, je.Fragment = P, je.Lazy = B, je.Memo = I, je.Portal = z, je.Profiler = _, je.StrictMode = $, je.Suspense = W, je.isAsyncMode = F, je.isConcurrentMode = k, je.isContextConsumer = V, je.isContextProvider = ee, je.isElement = J, je.isForwardRef = K, je.isFragment = G, je.isLazy = X, je.isMemo = te, je.isPortal = ne, je.isProfiler = re, je.isStrictMode = Y, je.isSuspense = oe, je.isValidElementType = x, je.typeOf = v;
+    je.AsyncMode = w, je.ConcurrentMode = R, je.ContextConsumer = j, je.ContextProvider = M, je.Element = A, je.ForwardRef = b, je.Fragment = P, je.Lazy = B, je.Memo = I, je.Portal = z, je.Profiler = _, je.StrictMode = N, je.Suspense = W, je.isAsyncMode = F, je.isConcurrentMode = k, je.isContextConsumer = V, je.isContextProvider = ee, je.isElement = J, je.isForwardRef = K, je.isFragment = G, je.isLazy = X, je.isMemo = te, je.isPortal = ne, je.isProfiler = re, je.isStrictMode = Y, je.isSuspense = oe, je.isValidElementType = x, je.typeOf = v;
   })()), je;
 }
 var Ws;
@@ -1160,7 +1160,7 @@ function Nf() {
     }
     function C(k) {
       function V(ee, J, K, G, X, te) {
-        var ne = ee[J], re = $(ne);
+        var ne = ee[J], re = N(ne);
         if (re !== k) {
           var Y = W(ne);
           return new f(
@@ -1181,7 +1181,7 @@ function Nf() {
           return new f("Property `" + X + "` of component `" + K + "` has invalid PropType notation inside arrayOf.");
         var te = ee[J];
         if (!Array.isArray(te)) {
-          var ne = $(te);
+          var ne = N(te);
           return new f("Invalid " + G + " `" + X + "` of type " + ("`" + ne + "` supplied to `" + K + "`, expected an array."));
         }
         for (var re = 0; re < te.length; re++) {
@@ -1197,7 +1197,7 @@ function Nf() {
       function k(V, ee, J, K, G) {
         var X = V[ee];
         if (!l(X)) {
-          var te = $(X);
+          var te = N(X);
           return new f("Invalid " + K + " `" + G + "` of type " + ("`" + te + "` supplied to `" + J + "`, expected a single ReactElement."));
         }
         return null;
@@ -1208,7 +1208,7 @@ function Nf() {
       function k(V, ee, J, K, G) {
         var X = V[ee];
         if (!e.isValidElementType(X)) {
-          var te = $(X);
+          var te = N(X);
           return new f("Invalid " + K + " `" + G + "` of type " + ("`" + te + "` supplied to `" + J + "`, expected a single ReactElement type."));
         }
         return null;
@@ -1246,7 +1246,7 @@ function Nf() {
       function V(ee, J, K, G, X) {
         if (typeof k != "function")
           return new f("Property `" + X + "` of component `" + K + "` has invalid PropType notation inside objectOf.");
-        var te = ee[J], ne = $(te);
+        var te = ee[J], ne = N(te);
         if (ne !== "object")
           return new f("Invalid " + G + " `" + X + "` of type " + ("`" + ne + "` supplied to `" + K + "`, expected an object."));
         for (var re in te)
@@ -1294,7 +1294,7 @@ function Nf() {
     }
     function B(k) {
       function V(ee, J, K, G, X) {
-        var te = ee[J], ne = $(te);
+        var te = ee[J], ne = N(te);
         if (ne !== "object")
           return new f("Invalid " + G + " `" + X + "` of type `" + ne + "` " + ("supplied to `" + K + "`, expected `object`."));
         for (var re in k) {
@@ -1311,7 +1311,7 @@ function Nf() {
     }
     function I(k) {
       function V(ee, J, K, G, X) {
-        var te = ee[J], ne = $(te);
+        var te = ee[J], ne = N(te);
         if (ne !== "object")
           return new f("Invalid " + G + " `" + X + "` of type `" + ne + "` " + ("supplied to `" + K + "`, expected `object`."));
         var re = t({}, ee[J], k);
@@ -1368,14 +1368,14 @@ Valid keys: ` + JSON.stringify(Object.keys(k), null, "  ")
     function _(k, V) {
       return k === "symbol" ? !0 : V ? V["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && V instanceof Symbol : !1;
     }
-    function $(k) {
+    function N(k) {
       var V = typeof k;
       return Array.isArray(k) ? "array" : k instanceof RegExp ? "object" : _(V, k) ? "symbol" : V;
     }
     function W(k) {
       if (typeof k > "u" || k === null)
         return "" + k;
-      var V = $(k);
+      var V = N(k);
       if (V === "object") {
         if (k instanceof Date)
           return "date";
@@ -2845,10 +2845,10 @@ function uu(e = {}) {
         const _ = I.theme.components?.[u]?.styleOverrides;
         if (!_)
           return null;
-        const $ = {};
+        const N = {};
         for (const W in _)
-          $[W] = Lo(I, _[W], I.theme.modularCssLayers ? "theme" : void 0);
-        return g(I, $);
+          N[W] = Lo(I, _[W], I.theme.modularCssLayers ? "theme" : void 0);
+        return g(I, N);
       }), u && !T && A.push(function(I) {
         const _ = I.theme?.components?.[u]?.variants;
         return _ ? cu(I, _, [], I.theme.modularCssLayers ? "theme" : void 0) : null;
@@ -3853,14 +3853,14 @@ function Wm(e = {}) {
       columnSpacing: b = M,
       unstable_level: P = 0,
       ...B
-    } = y, I = s(R, h.breakpoints, (V) => V !== !1), z = s(j, h.breakpoints), _ = d.columns ?? (P ? void 0 : C), $ = d.spacing ?? (P ? void 0 : M), W = d.rowSpacing ?? d.spacing ?? (P ? void 0 : A), U = d.columnSpacing ?? d.spacing ?? (P ? void 0 : b), F = {
+    } = y, I = s(R, h.breakpoints, (V) => V !== !1), z = s(j, h.breakpoints), _ = d.columns ?? (P ? void 0 : C), N = d.spacing ?? (P ? void 0 : M), W = d.rowSpacing ?? d.spacing ?? (P ? void 0 : A), U = d.columnSpacing ?? d.spacing ?? (P ? void 0 : b), F = {
       ...y,
       level: P,
       columns: _,
       container: E,
       direction: v,
       wrap: w,
-      spacing: $,
+      spacing: N,
       rowSpacing: W,
       columnSpacing: U,
       size: I,
@@ -7295,15 +7295,15 @@ const Ft = me("MuiTouchRipple", ["root", "ripple", "rippleVisible", "ripplePulsa
     else {
       const {
         clientX: _,
-        clientY: $
+        clientY: N
       } = v.touches && v.touches.length > 0 ? v.touches[0] : v;
-      B = Math.round(_ - P.left), I = Math.round($ - P.top);
+      B = Math.round(_ - P.left), I = Math.round(N - P.top);
     }
     if (M)
       z = Math.sqrt((2 * P.width ** 2 + P.height ** 2) / 3), z % 2 === 0 && (z += 1);
     else {
-      const _ = Math.max(Math.abs((b ? b.clientWidth : 0) - B), B) * 2 + 2, $ = Math.max(Math.abs((b ? b.clientHeight : 0) - I), I) * 2 + 2;
-      z = Math.sqrt(_ ** 2 + $ ** 2);
+      const _ = Math.max(Math.abs((b ? b.clientWidth : 0) - B), B) * 2 + 2, N = Math.max(Math.abs((b ? b.clientHeight : 0) - I), I) * 2 + 2;
+      z = Math.sqrt(_ ** 2 + N ** 2);
     }
     v?.touches ? y.current === null && (y.current = () => {
       T({
@@ -7454,7 +7454,7 @@ const Oy = me("MuiButtonBase", ["root", "disabled", "focusVisible"]), Ry = (e) =
     tabIndex: I = 0,
     TouchRippleProps: z,
     touchRippleRef: _,
-    type: $,
+    type: N,
     ...W
   } = o, U = S.useRef(null), F = ly(), k = at(F.ref, _), [V, ee] = S.useState(!1);
   u && V && ee(!1), S.useImperativeHandle(i, () => ({
@@ -7487,7 +7487,7 @@ const Oy = me("MuiButtonBase", ["root", "disabled", "focusVisible"]), Ry = (e) =
   let Ve = c;
   Ve === "button" && (W.href || W.to) && (Ve = y);
   const Ie = {};
-  Ve === "button" ? (Ie.type = $ === void 0 ? "button" : $, Ie.disabled = u) : (!W.href && !W.to && (Ie.role = "button"), u && (Ie["aria-disabled"] = u));
+  Ve === "button" ? (Ie.type = N === void 0 ? "button" : N, Ie.disabled = u) : (!W.href && !W.to && (Ie.role = "button"), u && (Ie["aria-disabled"] = u));
   const Ge = at(r, U), Ae = {
     ...o,
     centerRipple: a,
@@ -7518,7 +7518,7 @@ const Oy = me("MuiButtonBase", ["root", "disabled", "focusVisible"]), Ry = (e) =
     onTouchStart: re,
     ref: Ge,
     tabIndex: u ? -1 : I,
-    type: $,
+    type: N,
     ...Ie,
     ...W,
     children: [s, J ? /* @__PURE__ */ p.jsx(zu, {
@@ -7929,8 +7929,8 @@ const My = (e, t) => {
     className: ae(P.root, z.className, s),
     ...v
   };
-  let $ = l || "li";
-  return A ? ($ = !_.component && !l ? "div" : $, d === "li" && ($ === "li" ? $ = "div" : _.component === "li" && (_.component = "div")), /* @__PURE__ */ p.jsx(En.Provider, {
+  let N = l || "li";
+  return A ? (N = !_.component && !l ? "div" : N, d === "li" && (N === "li" ? N = "div" : _.component === "li" && (_.component = "div")), /* @__PURE__ */ p.jsx(En.Provider, {
     value: R,
     children: /* @__PURE__ */ p.jsxs(_y, {
       as: d,
@@ -7941,7 +7941,7 @@ const My = (e, t) => {
       children: [/* @__PURE__ */ p.jsx(I, {
         ...z,
         ...!ro(I) && {
-          as: $,
+          as: N,
           ownerState: {
             ...b,
             ...z.ownerState
@@ -7955,7 +7955,7 @@ const My = (e, t) => {
     value: R,
     children: /* @__PURE__ */ p.jsxs(I, {
       ...z,
-      as: $,
+      as: N,
       ref: B,
       ...!ro(I) && {
         ownerState: {
@@ -8787,12 +8787,12 @@ const Zy = {
     // eslint-disable-next-line react/prop-types
     TransitionComponent: T = Jt,
     ...C
-  } = t, E = or(), x = S.useRef(), v = Kn(), w = S.useRef(null), R = at(w, Yn(a), r), j = (_) => ($) => {
+  } = t, E = or(), x = S.useRef(), v = Kn(), w = S.useRef(null), R = at(w, Yn(a), r), j = (_) => (N) => {
     if (_) {
       const W = w.current;
-      $ === void 0 ? _(W) : _(W, $);
+      N === void 0 ? _(W) : _(W, N);
     }
-  }, M = j(d), A = j((_, $) => {
+  }, M = j(d), A = j((_, N) => {
     us(_);
     const {
       duration: W,
@@ -8813,10 +8813,10 @@ const Zy = {
       duration: ra ? k : k * 0.666,
       delay: U,
       easing: F
-    })].join(","), c && c(_, $);
+    })].join(","), c && c(_, N);
   }), b = j(u), P = j(g), B = j((_) => {
     const {
-      duration: $,
+      duration: N,
       delay: W,
       easing: U
     } = fr({
@@ -8827,7 +8827,7 @@ const Zy = {
       mode: "exit"
     });
     let F;
-    f === "auto" ? (F = v.transitions.getAutoHeightDuration(_.clientHeight), x.current = F) : F = $, _.style.transition = [v.transitions.create("opacity", {
+    f === "auto" ? (F = v.transitions.getAutoHeightDuration(_.clientHeight), x.current = F) : F = N, _.style.transition = [v.transitions.create("opacity", {
       duration: F,
       delay: W
     }), v.transitions.create("transform", {
@@ -8852,7 +8852,7 @@ const Zy = {
     timeout: f === "auto" ? null : f,
     ...C,
     children: (_, {
-      ownerState: $,
+      ownerState: N,
       ...W
     }) => /* @__PURE__ */ S.cloneElement(a, {
       style: {
@@ -9484,7 +9484,7 @@ function _b(e) {
         allowedAutoPlacements: f
       }) : G);
     }, []), w = t.rects.reference, R = t.rects.popper, j = /* @__PURE__ */ new Map(), M = !0, A = v[0], b = 0; b < v.length; b++) {
-      var P = v[b], B = rn(P), I = yr(P) === hr, z = [At, Wt].indexOf(B) >= 0, _ = z ? "width" : "height", $ = ao(t, {
+      var P = v[b], B = rn(P), I = yr(P) === hr, z = [At, Wt].indexOf(B) >= 0, _ = z ? "width" : "height", N = ao(t, {
         placement: P,
         boundary: d,
         rootBoundary: m,
@@ -9493,7 +9493,7 @@ function _b(e) {
       }), W = z ? I ? Ut : Mt : I ? Wt : At;
       w[_] > R[_] && (W = Fo(W));
       var U = Fo(W), F = [];
-      if (a && F.push($[B] <= 0), l && F.push($[W] <= 0, $[U] <= 0), F.every(function(K) {
+      if (a && F.push(N[B] <= 0), l && F.push(N[W] <= 0, N[U] <= 0), F.every(function(K) {
         return K;
       })) {
         A = P, M = !1;
@@ -9631,10 +9631,10 @@ function Gb(e) {
   };
   if (R) {
     if (a) {
-      var I, z = v === "y" ? At : Mt, _ = v === "y" ? Wt : Ut, $ = v === "y" ? "height" : "width", W = R[v], U = W + T[z], F = W - T[_], k = g ? -M[$] / 2 : 0, V = E === hr ? j[$] : M[$], ee = E === hr ? -M[$] : -j[$], J = t.elements.arrow, K = g && J ? fs(J) : {
+      var I, z = v === "y" ? At : Mt, _ = v === "y" ? Wt : Ut, N = v === "y" ? "height" : "width", W = R[v], U = W + T[z], F = W - T[_], k = g ? -M[N] / 2 : 0, V = E === hr ? j[N] : M[N], ee = E === hr ? -M[N] : -j[N], J = t.elements.arrow, K = g && J ? fs(J) : {
         width: 0,
         height: 0
-      }, G = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : Ku(), X = G[z], te = G[_], ne = Yr(0, j[$], K[$]), re = x ? j[$] / 2 - k - ne - X - b.mainAxis : V - ne - X - b.mainAxis, Y = x ? -j[$] / 2 + k + ne + te + b.mainAxis : ee + ne + te + b.mainAxis, oe = t.elements.arrow && To(t.elements.arrow), L = oe ? v === "y" ? oe.clientTop || 0 : oe.clientLeft || 0 : 0, ye = (I = P?.[v]) != null ? I : 0, le = W + re - ye - L, be = W + Y - ye, _e = Yr(g ? Ko(U, le) : U, W, g ? Fn(F, be) : F);
+      }, G = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : Ku(), X = G[z], te = G[_], ne = Yr(0, j[N], K[N]), re = x ? j[N] / 2 - k - ne - X - b.mainAxis : V - ne - X - b.mainAxis, Y = x ? -j[N] / 2 + k + ne + te + b.mainAxis : ee + ne + te + b.mainAxis, oe = t.elements.arrow && To(t.elements.arrow), L = oe ? v === "y" ? oe.clientTop || 0 : oe.clientLeft || 0 : 0, ye = (I = P?.[v]) != null ? I : 0, le = W + re - ye - L, be = W + Y - ye, _e = Yr(g ? Ko(U, le) : U, W, g ? Fn(F, be) : F);
       R[v] = _e, B[v] = _e - W;
     }
     if (l) {
@@ -9972,7 +9972,7 @@ const c0 = (e) => {
       process.env.NODE_ENV !== "test" && U.top === 0 && U.left === 0 && U.right === 0 && U.bottom === 0 && console.warn(["MUI: The `anchorEl` prop provided to the component is invalid.", "The anchor element should be part of the document layout.", "Make sure the element is present in the document or that it's not display none."].join(`
 `));
     }
-    let $ = [{
+    let N = [{
       name: "preventOverflow",
       options: {
         altBoundary: s
@@ -9992,11 +9992,11 @@ const c0 = (e) => {
         _(U);
       }
     }];
-    l != null && ($ = $.concat(l)), d && d.modifiers != null && ($ = $.concat(d.modifiers));
+    l != null && (N = N.concat(l)), d && d.modifiers != null && (N = N.concat(d.modifiers));
     const W = o0(A, C.current, {
       placement: R,
       ...d,
-      modifiers: $
+      modifiers: N
     });
     return w.current(W), () => {
       W.destroy(), w.current(null);
@@ -10700,7 +10700,7 @@ const td = /* @__PURE__ */ S.forwardRef(function(t, r) {
     title: I,
     TransitionComponent: z,
     TransitionProps: _,
-    ...$
+    ...N
   } = o, W = /* @__PURE__ */ S.isValidElement(a) ? a : /* @__PURE__ */ p.jsx("span", {
     children: a
   }), U = Kn(), F = ts(), [k, V] = S.useState(), [ee, J] = S.useState(null), K = S.useRef(!1), G = h || C, X = or(), te = or(), ne = or(), re = or(), [Y, oe] = eo({
@@ -10783,9 +10783,9 @@ const td = /* @__PURE__ */ S.forwardRef(function(t, r) {
   u ? (gt.title = !L && Dt && !m ? I : null, gt["aria-describedby"] = L ? ye : null) : (gt["aria-label"] = Dt ? I : null, gt["aria-labelledby"] = L && !Dt ? ye : null);
   const pe = {
     ...gt,
-    ...$,
+    ...N,
     ...W.props,
-    className: ae($.className, W.props.className),
+    className: ae(N.className, W.props.className),
     onTouchStart: mt,
     ref: vt,
     ...C ? {
@@ -11946,7 +11946,7 @@ const $0 = rt(/* @__PURE__ */ p.jsx("path", {
     elementType: W0,
     externalForwardedProps: R,
     ownerState: v
-  }), [_, $] = Ce("closeButton", {
+  }), [_, N] = Ce("closeButton", {
     elementType: xs,
     externalForwardedProps: R,
     ownerState: v
@@ -11974,7 +11974,7 @@ const $0 = rt(/* @__PURE__ */ p.jsx("path", {
         title: l,
         color: "inherit",
         onClick: g,
-        ...$,
+        ...N,
         children: /* @__PURE__ */ p.jsx(W, {
           fontSize: "small",
           ...U
@@ -12679,7 +12679,7 @@ const K0 = (e) => {
       className: I.loadingIconPlaceholder,
       ownerState: B
     })
-  }), $ = i || "", W = typeof E == "boolean" ? (
+  }), N = i || "", W = typeof E == "boolean" ? (
     // use plain HTML span to minimize the runtime overhead
     /* @__PURE__ */ p.jsx("span", {
       className: I.loadingWrapper,
@@ -12695,7 +12695,7 @@ const K0 = (e) => {
   ) : null;
   return /* @__PURE__ */ p.jsxs(X0, {
     ownerState: B,
-    className: ae(o.className, I.root, d, $),
+    className: ae(o.className, I.root, d, N),
     component: u,
     disabled: m || E,
     focusRipple: !g,
@@ -12948,12 +12948,12 @@ const tv = (e) => {
     const X = G.target.checked;
     P(X), T && T(G, X);
   };
-  let $ = l;
-  B && typeof $ > "u" && ($ = B.disabled);
+  let N = l;
+  B && typeof N > "u" && (N = B.disabled);
   const W = w === "checkbox" || w === "radio", U = {
     ...t,
     checked: b,
-    disabled: $,
+    disabled: N,
     disableFocusRipple: c,
     edge: u
   }, F = tv(U), k = {
@@ -12985,7 +12985,7 @@ const tv = (e) => {
     additionalProps: {
       centerRipple: !0,
       focusRipple: !c,
-      disabled: $,
+      disabled: N,
       role: void 0,
       tabIndex: null
     }
@@ -13004,7 +13004,7 @@ const tv = (e) => {
       autoFocus: o,
       checked: i,
       defaultChecked: s,
-      disabled: $,
+      disabled: N,
       id: W ? m : void 0,
       name: y,
       readOnly: E,
@@ -13494,18 +13494,18 @@ const mv = (e) => {
     size: f,
     variant: T
   }, x = mv(E), [v, w] = S.useState(() => {
-    let $ = !1;
+    let N = !1;
     return i && S.Children.forEach(i, (W) => {
       if (!sr(W, ["Input", "Select"]))
         return;
       const U = sr(W, ["Select"]) ? W.props.input : W;
-      U && fv(U.props) && ($ = !0);
-    }), $;
+      U && fv(U.props) && (N = !0);
+    }), N;
   }), [R, j] = S.useState(() => {
-    let $ = !1;
+    let N = !1;
     return i && S.Children.forEach(i, (W) => {
-      sr(W, ["Input", "Select"]) && (Jo(W.props, !0) || Jo(W.props.inputProps, !0)) && ($ = !0);
-    }), $;
+      sr(W, ["Input", "Select"]) && (Jo(W.props, !0) || Jo(W.props.inputProps, !0)) && (N = !0);
+    }), N;
   }), [M, A] = S.useState(!1);
   c && M && A(!1);
   const b = d !== void 0 && !c ? d : M;
@@ -15371,7 +15371,7 @@ const ji = (e, t) => {
     onFocus: I,
     onKeyDown: z,
     onKeyUp: _,
-    placeholder: $,
+    placeholder: N,
     readOnly: W,
     renderSuffix: U,
     rows: F,
@@ -15494,7 +15494,7 @@ const ji = (e, t) => {
           id: C,
           onAnimationStart: Ot,
           name: A,
-          placeholder: $,
+          placeholder: N,
           readOnly: W,
           required: be.required,
           rows: F,
@@ -17593,19 +17593,19 @@ const Ox = {
     ...x
   } = t, v = S.useRef(null), w = at(v, Yn(l), r), R = (z) => (_) => {
     if (z) {
-      const $ = v.current;
-      _ === void 0 ? z($) : z($, _);
+      const N = v.current;
+      _ === void 0 ? z(N) : z(N, _);
     }
   }, j = R(h), M = R((z, _) => {
     us(z);
-    const $ = fr({
+    const N = fr({
       style: T,
       timeout: C,
       easing: c
     }, {
       mode: "enter"
     });
-    z.style.webkitTransition = o.transitions.create("opacity", $), z.style.transition = o.transitions.create("opacity", $), d && d(z, _);
+    z.style.webkitTransition = o.transitions.create("opacity", N), z.style.transition = o.transitions.create("opacity", N), d && d(z, _);
   }), A = R(m), b = R(f), P = R((z) => {
     const _ = fr({
       style: T,
@@ -17633,7 +17633,7 @@ const Ox = {
     ...x,
     children: (z, {
       ownerState: _,
-      ...$
+      ...N
     }) => /* @__PURE__ */ S.cloneElement(l, {
       style: {
         opacity: 0,
@@ -17643,7 +17643,7 @@ const Ox = {
         ...l.props.style
       },
       ref: w,
-      ...$
+      ...N
     })
   });
 });
@@ -17947,18 +17947,18 @@ function Ax(e) {
   }, [A]), S.useEffect(() => {
     u ? R() : (!C || !i) && A();
   }, [u, A, C, i, R]);
-  const b = (_) => ($) => {
-    _.onKeyDown?.($), !($.key !== "Escape" || $.which === 229 || // Wait until IME is settled.
-    !j()) && (r || ($.stopPropagation(), c && c($, "escapeKeyDown")));
-  }, P = (_) => ($) => {
-    _.onClick?.($), $.target === $.currentTarget && c && c($, "backdropClick");
+  const b = (_) => (N) => {
+    _.onKeyDown?.(N), !(N.key !== "Escape" || N.which === 229 || // Wait until IME is settled.
+    !j()) && (r || (N.stopPropagation(), c && c(N, "escapeKeyDown")));
+  }, P = (_) => (N) => {
+    _.onClick?.(N), N.target === N.currentTarget && c && c(N, "backdropClick");
   };
   return {
     getRootProps: (_ = {}) => {
-      const $ = Cu(e);
-      delete $.onTransitionEnter, delete $.onTransitionExited;
+      const N = Cu(e);
+      delete N.onTransitionEnter, delete N.onTransitionExited;
       const W = {
-        ...$,
+        ...N,
         ..._
       };
       return {
@@ -17975,23 +17975,23 @@ function Ax(e) {
       };
     },
     getBackdropProps: (_ = {}) => {
-      const $ = _;
+      const N = _;
       return {
         "aria-hidden": !0,
-        ...$,
-        onClick: P($),
+        ...N,
+        onClick: P(N),
         open: u
       };
     },
     getTransitionProps: () => {
       const _ = () => {
         T(!1), a && a();
-      }, $ = () => {
+      }, N = () => {
         T(!0), s && s(), i && A();
       };
       return {
         onEnter: va(_, l?.props.onEnter ?? ec),
-        onExited: va($, l?.props.onExited ?? ec)
+        onExited: va(N, l?.props.onExited ?? ec)
       };
     },
     rootRef: y,
@@ -18092,7 +18092,7 @@ const $x = (e) => {
     hideBackdrop: v,
     keepMounted: w
   }, {
-    getRootProps: $,
+    getRootProps: N,
     getBackdropProps: W,
     getTransitionProps: U,
     portalRef: F,
@@ -18131,7 +18131,7 @@ const $x = (e) => {
       ...z,
       component: m
     },
-    getSlotProps: $,
+    getSlotProps: N,
     ownerState: J,
     className: ae(l, K?.root, !J.open && J.exited && K?.hidden)
   }), [re, Y] = Ce("backdrop", {
@@ -18487,35 +18487,35 @@ const Dx = (e) => {
       left: `${Math.round(be)}px`,
       transformOrigin: rc(L)
     };
-  }, [a, c, P, B, g]), [z, _] = S.useState(y), $ = S.useCallback(() => {
+  }, [a, c, P, B, g]), [z, _] = S.useState(y), N = S.useCallback(() => {
     const Y = M.current;
     if (!Y)
       return;
     const oe = I(Y);
     oe.top !== null && Y.style.setProperty("top", oe.top), oe.left !== null && (Y.style.left = oe.left), Y.style.transformOrigin = oe.transformOrigin, _(!0);
   }, [I]);
-  S.useEffect(() => (R && window.addEventListener("scroll", $), () => window.removeEventListener("scroll", $)), [a, R, $]);
+  S.useEffect(() => (R && window.addEventListener("scroll", N), () => window.removeEventListener("scroll", N)), [a, R, N]);
   const W = () => {
-    $();
+    N();
   }, U = () => {
     _(!1);
   };
   S.useEffect(() => {
-    y && $();
+    y && N();
   }), S.useImperativeHandle(i, () => y ? {
     updatePosition: () => {
-      $();
+      N();
     }
-  } : null, [y, $]), S.useEffect(() => {
+  } : null, [y, N]), S.useEffect(() => {
     if (!y)
       return;
     const Y = es(() => {
-      $();
+      N();
     }), oe = Xt(Ur(a));
     return oe.addEventListener("resize", Y), () => {
       Y.clear(), oe.removeEventListener("resize", Y);
     };
-  }, [a, y, $]);
+  }, [a, y, N]);
   let F = v;
   const k = {
     slots: {
@@ -18908,7 +18908,7 @@ const zx = {
     externalForwardedProps: B,
     shouldForwardComponentProp: !0,
     ownerState: w
-  }), [$, W] = Ce("list", {
+  }), [N, W] = Ce("list", {
     className: ae(R.list, c.className),
     elementType: Gx,
     shouldForwardComponentProp: !0,
@@ -18954,7 +18954,7 @@ const zx = {
     ownerState: w,
     ...x,
     classes: h,
-    children: /* @__PURE__ */ p.jsx($, {
+    children: /* @__PURE__ */ p.jsx(N, {
       actions: M,
       autoFocus: i && (P === -1 || l),
       autoFocusItem: j,
@@ -19413,11 +19413,11 @@ const tT = (e) => {
     tabIndex: z,
     // catching `type` from Input which makes no sense for SelectInput
     type: _,
-    value: $,
+    value: N,
     variant: W = "standard",
     ...U
   } = t, [F, k] = eo({
-    controlled: $,
+    controlled: N,
     default: d,
     name: "Select"
   }), [V, ee] = eo({
@@ -19840,7 +19840,7 @@ const nT = rt(/* @__PURE__ */ p.jsx("path", {
     variant: I,
     classes: s
   }, _ = rT(z), {
-    root: $,
+    root: N,
     ...W
   } = _, U = h || {
     standard: /* @__PURE__ */ p.jsx(oT, {
@@ -20101,7 +20101,7 @@ const lT = {
     required: I = !1,
     rows: z,
     select: _ = !1,
-    SelectProps: $,
+    SelectProps: N,
     slots: W = {},
     slotProps: U = {},
     type: F,
@@ -20128,11 +20128,11 @@ const lT = {
       inputLabel: T,
       htmlInput: C,
       formHelperText: h,
-      select: $,
+      select: N,
       ...U
     }
   }, Y = {}, oe = re.slotProps.inputLabel;
-  V === "outlined" && (oe && typeof oe.shrink < "u" && (Y.notched = oe.shrink), Y.label = v), _ && ((!$ || !$.native) && (Y.id = void 0), Y["aria-describedby"] = void 0);
+  V === "outlined" && (oe && typeof oe.shrink < "u" && (Y.notched = oe.shrink), Y.label = v), _ && ((!N || !N.native) && (Y.id = void 0), Y["aria-describedby"] = void 0);
   const [L, ye] = Ce("root", {
     elementType: uT,
     shouldForwardComponentProp: !0,
@@ -21655,7 +21655,7 @@ const Ct = {
   cyan1000: "#002329",
   deepPurpleA800: "#500fc4",
   deepPurple1000: "#16073E"
-}, N = {
+}, $ = {
   text: {
     primary: it[900],
     secondary: it[700],
@@ -22015,7 +22015,7 @@ function vO({ Header: e, children: t, sx: r, itemProps: o, ...i }) {
     alignContent: "flex-start",
     alignItems: "center",
     py: 8,
-    backgroundColor: N.neutral50,
+    backgroundColor: $.neutral50,
     minHeight: "100vh",
     overflow: "auto",
     ...r
@@ -22038,7 +22038,7 @@ function TO({ Header: e, children: t, sx: r, itemProps: o, ...i }) {
     alignContent: "flex-start",
     alignItems: "center",
     py: 8,
-    backgroundColor: N.neutral50,
+    backgroundColor: $.neutral50,
     minHeight: "100vh",
     overflow: "auto",
     ...r
@@ -23522,7 +23522,7 @@ const dp = /* @__PURE__ */ S.forwardRef(function(t, r) {
     U.style.webkitTransition = o.transitions.create("-webkit-transform", F), U.style.transition = o.transitions.create("transform", F), Do(d, U, u), T && T(U);
   }), _ = A((U) => {
     U.style.webkitTransition = "", U.style.transition = "", C && C(U);
-  }), $ = (U) => {
+  }), N = (U) => {
     s && s(j.current, U);
   }, W = S.useCallback(() => {
     j.current && Do(d, j.current, u);
@@ -23546,7 +23546,7 @@ const dp = /* @__PURE__ */ S.forwardRef(function(t, r) {
     onExit: z,
     onExited: _,
     onExiting: I,
-    addEndListener: $,
+    addEndListener: N,
     appear: l,
     in: h,
     timeout: v,
@@ -23695,7 +23695,10 @@ const vE = {
   MuiTooltip: {
     styleOverrides: {
       tooltip: {
-        backgroundColor: N.neutral800
+        backgroundColor: $.neutral800
+      },
+      arrow: {
+        color: $.neutral800
       }
     }
   }
@@ -23957,291 +23960,291 @@ const vE = {
   MuiChip: {
     styleOverrides: {
       filledDefault: {
-        backgroundColor: N.neutral200,
-        color: N.text.primary,
+        backgroundColor: $.neutral200,
+        color: $.text.primary,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.text.primary,
-            backgroundColor: N.neutral300
+            color: $.text.primary,
+            backgroundColor: $.neutral300
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral700,
+          color: $.neutral700,
           opacity: 0.26,
           "&:hover, &:focus, &:active": {
-            color: N.neutral700
+            color: $.neutral700
           }
         }
       },
       filledPrimary: {
-        backgroundColor: N.blue50,
-        color: N.blue1000,
+        backgroundColor: $.blue50,
+        color: $.blue1000,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.blue1000,
-            backgroundColor: N.blue100
+            color: $.blue1000,
+            backgroundColor: $.blue100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.primary.dark,
+          color: $.primary.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.primary.dark
+            color: $.primary.dark
           }
         }
       },
       filledSecondary: {
-        backgroundColor: N.purple50,
-        color: N.purple1000,
+        backgroundColor: $.purple50,
+        color: $.purple1000,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.purple1000,
-            backgroundColor: N.purple100
+            color: $.purple1000,
+            backgroundColor: $.purple100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.secondary.dark,
+          color: $.secondary.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.secondary.dark
+            color: $.secondary.dark
           }
         }
       },
       filledError: {
-        backgroundColor: N.red50,
-        color: N.red1000,
+        backgroundColor: $.red50,
+        color: $.red1000,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.red1000,
-            backgroundColor: N.red100
+            color: $.red1000,
+            backgroundColor: $.red100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.error.dark,
+          color: $.error.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.error.dark
+            color: $.error.dark
           }
         }
       },
       filledWarning: {
-        backgroundColor: N.orange50,
-        color: N.orange1000,
+        backgroundColor: $.orange50,
+        color: $.orange1000,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.orange1000,
-            backgroundColor: N.orange100
+            color: $.orange1000,
+            backgroundColor: $.orange100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.warning.dark,
+          color: $.warning.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.warning.dark
+            color: $.warning.dark
           }
         }
       },
       filledInfo: {
-        backgroundColor: N.cyan50,
-        color: N.cyan900,
+        backgroundColor: $.cyan50,
+        color: $.cyan900,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.cyan900,
-            backgroundColor: N.cyan100
+            color: $.cyan900,
+            backgroundColor: $.cyan100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.info.dark,
+          color: $.info.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.info.dark
+            color: $.info.dark
           }
         }
       },
       filledSuccess: {
-        backgroundColor: N.green50,
-        color: N.green1000,
+        backgroundColor: $.green50,
+        color: $.green1000,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.green1000,
-            backgroundColor: N.green100
+            color: $.green1000,
+            backgroundColor: $.green100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.success.dark,
+          color: $.success.dark,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.success.dark
+            color: $.success.dark
           }
         }
       },
       filledAi: {
-        backgroundColor: N.deepPurple50,
-        color: N.deepPurple900,
+        backgroundColor: $.deepPurple50,
+        color: $.deepPurple900,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.deepPurple900,
-            backgroundColor: N.deepPurple100
+            color: $.deepPurple900,
+            backgroundColor: $.deepPurple100
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.deepPurple900,
+          color: $.deepPurple900,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.deepPurple900
+            color: $.deepPurple900
           }
         }
       },
       contrastFilledDefault: {
-        color: N.neutral00,
-        backgroundColor: N.neutral700,
+        color: $.neutral00,
+        backgroundColor: $.neutral700,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.neutral800
+            color: $.neutral00,
+            backgroundColor: $.neutral800
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.26,
           "&:hover, &:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledPrimary: {
-        color: N.neutral00,
-        backgroundColor: N.lightBlueA700,
+        color: $.neutral00,
+        backgroundColor: $.lightBlueA700,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.info.dark
+            color: $.neutral00,
+            backgroundColor: $.info.dark
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledSecondary: {
-        color: N.neutral00,
-        backgroundColor: N.secondary.main,
+        color: $.neutral00,
+        backgroundColor: $.secondary.main,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.secondary.dark
+            color: $.neutral00,
+            backgroundColor: $.secondary.dark
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover, &:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledError: {
-        color: N.neutral00,
-        backgroundColor: N.error.main,
+        color: $.neutral00,
+        backgroundColor: $.error.main,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.error.dark
+            color: $.neutral00,
+            backgroundColor: $.error.dark
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledWarning: {
-        color: N.neutral00,
-        backgroundColor: N.yellow800,
+        color: $.neutral00,
+        backgroundColor: $.yellow800,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.yellow900
+            color: $.neutral00,
+            backgroundColor: $.yellow900
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledInfo: {
-        color: N.neutral00,
-        backgroundColor: N.cyanA700,
+        color: $.neutral00,
+        backgroundColor: $.cyanA700,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.cyan700
+            color: $.neutral00,
+            backgroundColor: $.cyan700
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledSuccess: {
-        color: N.neutral00,
-        backgroundColor: N.success.main,
+        color: $.neutral00,
+        backgroundColor: $.success.main,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.success.dark
+            color: $.neutral00,
+            backgroundColor: $.success.dark
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledAi: {
-        color: N.neutral00,
-        backgroundColor: N.deepPurpleA700,
+        color: $.neutral00,
+        backgroundColor: $.deepPurpleA700,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.deepPurpleA700
+            color: $.neutral00,
+            backgroundColor: $.deepPurpleA700
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       },
       contrastFilledInProgress: {
-        color: N.neutral00,
-        backgroundColor: N.greenA700,
+        color: $.neutral00,
+        backgroundColor: $.greenA700,
         "&.MuiChip-clickable": {
           "&:hover, &:focus, &:active": {
-            color: N.neutral00,
-            backgroundColor: N.greenA900
+            color: $.neutral00,
+            backgroundColor: $.greenA900
           }
         },
         ".MuiChip-deleteIcon": {
-          color: N.neutral00,
+          color: $.neutral00,
           opacity: 0.7,
           "&:hover,&:focus, &:active": {
-            color: N.neutral00
+            color: $.neutral00
           }
         }
       }
@@ -24254,7 +24257,7 @@ const vE = {
         border: "none",
         height: "auto",
         ".MuiDataGrid-toolbarContainer .MuiTextField-root": {
-          backgroundColor: N.neutral100,
+          backgroundColor: $.neutral100,
           padding: "8px",
           borderRadius: "8px"
         },
@@ -24263,12 +24266,12 @@ const vE = {
           color: "red"
         },
         ".MuiDataGrid-toolbarContainer button": {
-          backgroundColor: N.neutral100,
-          color: N.neutral900,
+          backgroundColor: $.neutral100,
+          color: $.neutral900,
           padding: "4px 10px"
         },
         ".MuiDataGrid-toolbarContainer svg": {
-          color: N.neutral700
+          color: $.neutral700
         },
         ".MuiDataGrid-cell:focus": {
           outline: "none"
@@ -24341,20 +24344,20 @@ const vE = {
           minWidth: "unset",
           borderRadius: e.spacing(1),
           "&:active,&.Mui-focusVisible,&:focus,&:focus-visible": {
-            outline: `1px solid ${N.primary.light}`
+            outline: `1px solid ${$.primary.light}`
           },
           "&.Mui-disabled": {
-            backgroundColor: N.neutral200,
-            color: N.text.disabled
+            backgroundColor: $.neutral200,
+            color: $.text.disabled
           }
         }),
         containedPrimary: {
-          backgroundColor: N.primary.main
+          backgroundColor: $.primary.main
         },
         textPrimary: {
-          color: N.primary.dark,
+          color: $.primary.dark,
           "&:hover": {
-            backgroundColor: N.primary.hover
+            backgroundColor: $.primary.hover
           },
           "&:disabled": {
             backgroundColor: "unset"
@@ -24362,40 +24365,40 @@ const vE = {
         },
         textError: {
           "&:hover": {
-            backgroundColor: N.error.hover
+            backgroundColor: $.error.hover
           },
           "&:active": {
-            backgroundColor: N.error.hover
+            backgroundColor: $.error.hover
           },
           "&:disabled": {
             backgroundColor: "unset"
           }
         },
         outlinedInherit: {
-          borderColor: Ee(N.neutral900, 0.03)
+          borderColor: Ee($.neutral900, 0.03)
         },
         outlinedPrimary: {
-          color: N.primary.dark,
-          border: `0.5px solid ${N.action.disabled}`,
+          color: $.primary.dark,
+          border: `0.5px solid ${$.action.disabled}`,
           "&:hover": {
-            border: `0.5px solid ${N.primary.outlinedBorder}`
+            border: `0.5px solid ${$.primary.outlinedBorder}`
           },
           "&:active": {
-            backgroundColor: N.primary.hover
+            backgroundColor: $.primary.hover
           },
           "&:disabled": {
             backgroundColor: "unset",
-            border: `0.5px solid ${N.neutral200}`
+            border: `0.5px solid ${$.neutral200}`
           }
         },
         containedInherit: {
-          backgroundColor: N.neutral100,
+          backgroundColor: $.neutral100,
           "&:hover": {
-            backgroundColor: N.neutral200
+            backgroundColor: $.neutral200
           }
         },
         card: {
-          backgroundColor: N.neutral100,
+          backgroundColor: $.neutral100,
           color: "text.primary",
           textTransform: "capitalize",
           fontSize: "13px",
@@ -24409,10 +24412,10 @@ const vE = {
       styleOverrides: {
         root: {
           "&:focus": {
-            backgroundColor: N.action.focus
+            backgroundColor: $.action.focus
           },
           "&.MuiIconButton-colorPrimary:focus": {
-            backgroundColor: N.primary.focus
+            backgroundColor: $.primary.focus
           }
         }
       }
@@ -24440,7 +24443,7 @@ const vE = {
     MuiLink: {
       styleOverrides: {
         root: {
-          color: N.primary.dark,
+          color: $.primary.dark,
           textDecoration: "none"
         }
       }
@@ -24451,7 +24454,7 @@ const vE = {
           ".MuiButtonBase-root": {
             textTransform: "none",
             "&:hover": {
-              color: N.text.primary
+              color: $.text.primary
             }
           }
         }
@@ -24466,7 +24469,7 @@ const vE = {
       styleOverrides: {
         root: {
           "&.MuiRadio-root:not(.Mui-disabled):not(.MuiRadio-error) + .MuiTypography-root": {
-            color: N.text.primary
+            color: $.text.primary
           }
         }
       }
@@ -24475,13 +24478,13 @@ const vE = {
       styleOverrides: {
         root: {
           "&.MuiCheckbox-root:not(.Mui-disabled):not(.MuiCheckbox-error) + .MuiTypography-root": {
-            color: N.text.primary
+            color: $.text.primary
           }
         }
       }
     }
   },
-  palette: N
+  palette: $
 });
 export {
   FE as DemoComponent,