@devopness/ui-react 2.174.0 → 2.175.0

package/dist/ui-react.js

@@ -863,7 +863,7 @@ function Cf() {
         L++;
       }
     }
-    function q() {
+    function U() {
       {
         if (L--, L === 0) {
           var w = {
@@ -912,16 +912,16 @@ function Cf() {
 ` + Z + w;
       }
     }
-    var oe = !1, U;
+    var oe = !1, G;
     {
       var re = typeof WeakMap == "function" ? WeakMap : Map;
-      U = new re();
+      G = new re();
     }
     function j(w, D) {
       if (!w || oe)
         return "";
       {
-        var ee = U.get(w);
+        var ee = G.get(w);
         if (ee !== void 0)
           return ee;
       }
@@ -976,17 +976,17 @@ function Cf() {
                   if (qe--, Ge--, Ge < 0 || pe[qe] !== ot[Ge]) {
                     var gt = `
 ` + pe[qe].replace(" at new ", " at ");
-                    return w.displayName && gt.includes("<anonymous>") && (gt = gt.replace("<anonymous>", w.displayName)), typeof w == "function" && U.set(w, gt), gt;
+                    return w.displayName && gt.includes("<anonymous>") && (gt = gt.replace("<anonymous>", w.displayName)), typeof w == "function" && G.set(w, gt), gt;
                   }
                 while (qe >= 1 && Ge >= 0);
               break;
             }
         }
       } finally {
-        oe = !1, A.current = Pe, q(), Error.prepareStackTrace = be;
+        oe = !1, A.current = Pe, U(), Error.prepareStackTrace = be;
       }
       var Ln = w ? w.displayName || w.name : "", gn = Ln ? Y(Ln) : "";
-      return typeof w == "function" && U.set(w, gn), gn;
+      return typeof w == "function" && G.set(w, gn), gn;
     }
     function ve(w, D, ee) {
       return j(w, !1);
@@ -2402,16 +2402,16 @@ function Ph(e, t, n) {
     return function(R, P, B) {
       var _ = R.attrs, h = R.componentStyle, k = R.defaultProps, H = R.foldedComponentIds, I = R.styledComponentId, F = R.target, L = Be.useContext(ms), N = ol(), W = R.shouldForwardProp || N.shouldForwardProp;
       process.env.NODE_ENV !== "production" && qs(I);
-      var ie = Yf(P, L, k) || Jn, Q = function(q, A, Z) {
-        for (var Y, oe = st(st({}, A), { className: void 0, theme: Z }), U = 0; U < q.length; U += 1) {
-          var re = Qn(Y = q[U]) ? Y(oe) : Y;
+      var ie = Yf(P, L, k) || Jn, Q = function(U, A, Z) {
+        for (var Y, oe = st(st({}, A), { className: void 0, theme: Z }), G = 0; G < U.length; G += 1) {
+          var re = Qn(Y = U[G]) ? Y(oe) : Y;
           for (var j in re) oe[j] = j === "className" ? wn(oe[j], re[j]) : j === "style" ? st(st({}, oe[j]), re[j]) : re[j];
         }
         return A.className && (oe.className = wn(oe.className, A.className)), oe;
       }(_, P, ie), $ = Q.as || F, z = {};
       for (var K in Q) Q[K] === void 0 || K[0] === "$" || K === "as" || K === "theme" && Q.theme === ie || (K === "forwardedAs" ? z.as = Q.forwardedAs : W && !W(K, $) || (z[K] = Q[K], W || process.env.NODE_ENV !== "development" || Of(K) || al.has(K) || !Ia.has($) || (al.add(K), console.warn('styled-components: it looks like an unknown prop "'.concat(K, '" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)')))));
-      var te = function(q, A) {
-        var Z = ol(), Y = q.generateAndInjectStyles(A, Z.styleSheet, Z.stylis);
+      var te = function(U, A) {
+        var Z = ol(), Y = U.generateAndInjectStyles(A, Z.styleSheet, Z.stylis);
         return process.env.NODE_ENV !== "production" && qs(Y), Y;
       }(h, Q);
       process.env.NODE_ENV !== "production" && R.warnTooManyClasses && R.warnTooManyClasses(te);
@@ -2477,9 +2477,9 @@ function Va(e, t, n) {
 }
 var ad = function(e) {
   return Va(Ph, e);
-}, G = ad;
+}, q = ad;
 Ia.forEach(function(e) {
-  G[e] = ad(e);
+  q[e] = ad(e);
 });
 function gs(e) {
   for (var t = [], n = 1; n < arguments.length; n++) t[n - 1] = arguments[n];
@@ -2551,7 +2551,7 @@ const $h = {
     default:
       return "34px";
   }
-}, Nh = G.div`
+}, Nh = q.div`
   ${({ $iconSize: e }) => je`
     /** Base */
     display: flex;
@@ -2561,7 +2561,7 @@ const $h = {
     /** Flex Layout */
     align-items: center;
   `}
-`, Lh = G.span``, Bh = G.button`
+`, Lh = q.span``, Bh = q.button`
   ${({
   $backgroundColor: e,
   $borderColor: t,
@@ -3625,7 +3625,7 @@ function U1() {
     function X(j) {
       return b(j) === u;
     }
-    function q(j) {
+    function U(j) {
       return b(j) === r;
     }
     function A(j) {
@@ -3640,13 +3640,13 @@ function U1() {
     function oe(j) {
       return b(j) === i;
     }
-    function U(j) {
+    function G(j) {
       return b(j) === o;
     }
     function re(j) {
       return b(j) === f;
     }
-    we.AsyncMode = C, we.ConcurrentMode = R, we.ContextConsumer = P, we.ContextProvider = B, we.Element = _, we.ForwardRef = h, we.Fragment = k, we.Lazy = H, we.Memo = I, we.Portal = F, we.Profiler = L, we.StrictMode = N, we.Suspense = W, we.isAsyncMode = Q, we.isConcurrentMode = $, we.isContextConsumer = z, we.isContextProvider = K, we.isElement = te, we.isForwardRef = X, we.isFragment = q, we.isLazy = A, we.isMemo = Z, we.isPortal = Y, we.isProfiler = oe, we.isStrictMode = U, we.isSuspense = re, we.isValidElementType = v, we.typeOf = b;
+    we.AsyncMode = C, we.ConcurrentMode = R, we.ContextConsumer = P, we.ContextProvider = B, we.Element = _, we.ForwardRef = h, we.Fragment = k, we.Lazy = H, we.Memo = I, we.Portal = F, we.Profiler = L, we.StrictMode = N, we.Suspense = W, we.isAsyncMode = Q, we.isConcurrentMode = $, we.isContextConsumer = z, we.isContextProvider = K, we.isElement = te, we.isForwardRef = X, we.isFragment = U, we.isLazy = A, we.isMemo = Z, we.isPortal = Y, we.isProfiler = oe, we.isStrictMode = G, we.isSuspense = re, we.isValidElementType = v, we.typeOf = b;
   }()), we;
 }
 var xl;
@@ -3819,8 +3819,8 @@ function K1() {
     function T($) {
       if (process.env.NODE_ENV !== "production")
         var z = {}, K = 0;
-      function te(q, A, Z, Y, oe, U, re) {
-        if (Y = Y || m, U = U || Z, re !== n) {
+      function te(U, A, Z, Y, oe, G, re) {
+        if (Y = Y || m, G = G || Z, re !== n) {
           if (l) {
             var j = new Error(
               "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
@@ -3830,22 +3830,22 @@ function K1() {
             var ve = Y + ":" + Z;
             !z[ve] && // Avoid spamming the console because they are often not actionable except for lib authors
             K < 3 && (i(
-              "You are manually calling a React.PropTypes validation function for the `" + U + "` prop on `" + Y + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
+              "You are manually calling a React.PropTypes validation function for the `" + G + "` prop on `" + Y + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
             ), z[ve] = !0, K++);
           }
         }
-        return A[Z] == null ? q ? A[Z] === null ? new p("The " + oe + " `" + U + "` is marked as required " + ("in `" + Y + "`, but its value is `null`.")) : new p("The " + oe + " `" + U + "` is marked as required in " + ("`" + Y + "`, but its value is `undefined`.")) : null : $(A, Z, Y, oe, U);
+        return A[Z] == null ? U ? A[Z] === null ? new p("The " + oe + " `" + G + "` is marked as required " + ("in `" + Y + "`, but its value is `null`.")) : new p("The " + oe + " `" + G + "` is marked as required in " + ("`" + Y + "`, but its value is `undefined`.")) : null : $(A, Z, Y, oe, G);
       }
       var X = te.bind(null, !1);
       return X.isRequired = te.bind(null, !0), X;
     }
     function O($) {
-      function z(K, te, X, q, A, Z) {
+      function z(K, te, X, U, A, Z) {
         var Y = K[te], oe = N(Y);
         if (oe !== $) {
-          var U = W(Y);
+          var G = W(Y);
           return new p(
-            "Invalid " + q + " `" + A + "` of type " + ("`" + U + "` supplied to `" + X + "`, expected ") + ("`" + $ + "`."),
+            "Invalid " + U + " `" + A + "` of type " + ("`" + G + "` supplied to `" + X + "`, expected ") + ("`" + $ + "`."),
             { expectedType: $ }
           );
         }
@@ -3857,50 +3857,50 @@ function K1() {
       return T(s);
     }
     function v($) {
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         if (typeof $ != "function")
           return new p("Property `" + A + "` of component `" + X + "` has invalid PropType notation inside arrayOf.");
         var Z = K[te];
         if (!Array.isArray(Z)) {
           var Y = N(Z);
-          return new p("Invalid " + q + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected an array."));
+          return new p("Invalid " + U + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected an array."));
         }
         for (var oe = 0; oe < Z.length; oe++) {
-          var U = $(Z, oe, X, q, A + "[" + oe + "]", n);
-          if (U instanceof Error)
-            return U;
+          var G = $(Z, oe, X, U, A + "[" + oe + "]", n);
+          if (G instanceof Error)
+            return G;
         }
         return null;
       }
       return T(z);
     }
     function b() {
-      function $(z, K, te, X, q) {
+      function $(z, K, te, X, U) {
         var A = z[K];
         if (!c(A)) {
           var Z = N(A);
-          return new p("Invalid " + X + " `" + q + "` of type " + ("`" + Z + "` supplied to `" + te + "`, expected a single ReactElement."));
+          return new p("Invalid " + X + " `" + U + "` of type " + ("`" + Z + "` supplied to `" + te + "`, expected a single ReactElement."));
         }
         return null;
       }
       return T($);
     }
     function C() {
-      function $(z, K, te, X, q) {
+      function $(z, K, te, X, U) {
         var A = z[K];
         if (!e.isValidElementType(A)) {
           var Z = N(A);
-          return new p("Invalid " + X + " `" + q + "` of type " + ("`" + Z + "` supplied to `" + te + "`, expected a single ReactElement type."));
+          return new p("Invalid " + X + " `" + U + "` of type " + ("`" + Z + "` supplied to `" + te + "`, expected a single ReactElement type."));
         }
         return null;
       }
       return T($);
     }
     function R($) {
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         if (!(K[te] instanceof $)) {
           var Z = $.name || m, Y = Q(K[te]);
-          return new p("Invalid " + q + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected ") + ("instance of `" + Z + "`."));
+          return new p("Invalid " + U + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected ") + ("instance of `" + Z + "`."));
         }
         return null;
       }
@@ -3911,7 +3911,7 @@ function K1() {
         return process.env.NODE_ENV !== "production" && (arguments.length > 1 ? i(
           "Invalid arguments supplied to oneOf, expected an array, got " + arguments.length + " arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."
         ) : i("Invalid argument supplied to oneOf, expected an array.")), s;
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         for (var Z = K[te], Y = 0; Y < $.length; Y++)
           if (y(Z, $[Y]))
             return null;
@@ -3919,22 +3919,22 @@ function K1() {
           var ve = W(j);
           return ve === "symbol" ? String(j) : j;
         });
-        return new p("Invalid " + q + " `" + A + "` of value `" + String(Z) + "` " + ("supplied to `" + X + "`, expected one of " + oe + "."));
+        return new p("Invalid " + U + " `" + A + "` of value `" + String(Z) + "` " + ("supplied to `" + X + "`, expected one of " + oe + "."));
       }
       return T(z);
     }
     function B($) {
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         if (typeof $ != "function")
           return new p("Property `" + A + "` of component `" + X + "` has invalid PropType notation inside objectOf.");
         var Z = K[te], Y = N(Z);
         if (Y !== "object")
-          return new p("Invalid " + q + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected an object."));
+          return new p("Invalid " + U + " `" + A + "` of type " + ("`" + Y + "` supplied to `" + X + "`, expected an object."));
         for (var oe in Z)
           if (r(Z, oe)) {
-            var U = $(Z, oe, X, q, A + "." + oe, n);
-            if (U instanceof Error)
-              return U;
+            var G = $(Z, oe, X, U, A + "." + oe, n);
+            if (G instanceof Error)
+              return G;
           }
         return null;
       }
@@ -3950,9 +3950,9 @@ function K1() {
             "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + ie(K) + " at index " + z + "."
           ), s;
       }
-      function te(X, q, A, Z, Y) {
-        for (var oe = [], U = 0; U < $.length; U++) {
-          var re = $[U], j = re(X, q, A, Z, Y, n);
+      function te(X, U, A, Z, Y) {
+        for (var oe = [], G = 0; G < $.length; G++) {
+          var re = $[G], j = re(X, U, A, Z, Y, n);
           if (j == null)
             return null;
           j.data && r(j.data, "expectedType") && oe.push(j.data.expectedType);
@@ -3963,8 +3963,8 @@ function K1() {
       return T(te);
     }
     function h() {
-      function $(z, K, te, X, q) {
-        return F(z[K]) ? null : new p("Invalid " + X + " `" + q + "` supplied to " + ("`" + te + "`, expected a ReactNode."));
+      function $(z, K, te, X, U) {
+        return F(z[K]) ? null : new p("Invalid " + X + " `" + U + "` supplied to " + ("`" + te + "`, expected a ReactNode."));
       }
       return T($);
     }
@@ -3974,15 +3974,15 @@ function K1() {
       );
     }
     function H($) {
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         var Z = K[te], Y = N(Z);
         if (Y !== "object")
-          return new p("Invalid " + q + " `" + A + "` of type `" + Y + "` " + ("supplied to `" + X + "`, expected `object`."));
+          return new p("Invalid " + U + " `" + A + "` of type `" + Y + "` " + ("supplied to `" + X + "`, expected `object`."));
         for (var oe in $) {
-          var U = $[oe];
-          if (typeof U != "function")
-            return k(X, q, A, oe, W(U));
-          var re = U(Z, oe, X, q, A + "." + oe, n);
+          var G = $[oe];
+          if (typeof G != "function")
+            return k(X, U, A, oe, W(G));
+          var re = G(Z, oe, X, U, A + "." + oe, n);
           if (re)
             return re;
         }
@@ -3991,21 +3991,21 @@ function K1() {
       return T(z);
     }
     function I($) {
-      function z(K, te, X, q, A) {
+      function z(K, te, X, U, A) {
         var Z = K[te], Y = N(Z);
         if (Y !== "object")
-          return new p("Invalid " + q + " `" + A + "` of type `" + Y + "` " + ("supplied to `" + X + "`, expected `object`."));
+          return new p("Invalid " + U + " `" + A + "` of type `" + Y + "` " + ("supplied to `" + X + "`, expected `object`."));
         var oe = t({}, K[te], $);
-        for (var U in oe) {
-          var re = $[U];
-          if (r($, U) && typeof re != "function")
-            return k(X, q, A, U, W(re));
+        for (var G in oe) {
+          var re = $[G];
+          if (r($, G) && typeof re != "function")
+            return k(X, U, A, G, W(re));
           if (!re)
             return new p(
-              "Invalid " + q + " `" + A + "` key `" + U + "` supplied to `" + X + "`.\nBad object: " + JSON.stringify(K[te], null, "  ") + `
+              "Invalid " + U + " `" + A + "` key `" + G + "` supplied to `" + X + "`.\nBad object: " + JSON.stringify(K[te], null, "  ") + `
 Valid keys: ` + JSON.stringify(Object.keys($), null, "  ")
             );
-          var j = re(Z, U, X, q, A + "." + U, n);
+          var j = re(Z, G, X, U, A + "." + G, n);
           if (j)
             return j;
         }
@@ -5208,10 +5208,10 @@ function Jm(e) {
  */
 function Qm(e, t) {
   let n;
-  if (t ? n = G(e).withConfig({
+  if (t ? n = q(e).withConfig({
     displayName: t.label,
     shouldForwardProp: t.shouldForwardProp
-  }) : n = G(e), process.env.NODE_ENV !== "production") {
+  }) : n = q(e), process.env.NODE_ENV !== "production") {
     const r = (...o) => {
       const i = typeof e == "string" ? `"${e}"` : "component";
       return o.length === 0 ? console.error([`MUI: Seems like you called \`styled(${i})()\` without a \`style\` argument.`, 'You must provide a `styles` argument: `styled("div")(styleYouForgotToPass)`.'].join(`
@@ -8820,13 +8820,13 @@ const nv = (e) => {
   }), te = {
     ...L,
     exited: z
-  }, X = nv(te), q = {};
-  if (d.props.tabIndex === void 0 && (q.tabIndex = "-1"), K) {
+  }, X = nv(te), U = {};
+  if (d.props.tabIndex === void 0 && (U.tabIndex = "-1"), K) {
     const {
       onEnter: re,
       onExited: j
     } = ie();
-    q.onEnter = re, q.onExited = j;
+    U.onEnter = re, U.onExited = j;
   }
   const A = {
     slots: {
@@ -8849,7 +8849,7 @@ const nv = (e) => {
     getSlotProps: N,
     ownerState: te,
     className: de(c, X?.root, !te.open && te.exited && X?.hidden)
-  }), [oe, U] = Me("backdrop", {
+  }), [oe, G] = Me("backdrop", {
     ref: i?.ref,
     elementType: o,
     externalForwardedProps: A,
@@ -8871,14 +8871,14 @@ const nv = (e) => {
     children: /* @__PURE__ */ x.jsxs(Z, {
       ...Y,
       children: [!b && o ? /* @__PURE__ */ x.jsx(oe, {
-        ...U
+        ...G
       }) : null, /* @__PURE__ */ x.jsx(Ao, {
         disableEnforceFocus: p,
         disableAutoFocus: y,
         disableRestoreFocus: S,
         isEnabled: $,
         open: h,
-        children: /* @__PURE__ */ E.cloneElement(d, q)
+        children: /* @__PURE__ */ E.cloneElement(d, U)
       })]
     })
   });
@@ -9579,7 +9579,7 @@ const pv = (e) => {
   }, h = pv(_), k = E.useCallback(() => {
     if (l === "anchorPosition")
       return process.env.NODE_ENV !== "production" && (c || console.error('MUI: You need to provide a `anchorPosition` prop when using <Popover anchorReference="anchorPosition" />.')), c;
-    const U = Or(i), re = U && U.nodeType === 1 ? U : wt(B.current).body, j = re.getBoundingClientRect();
+    const G = Or(i), re = G && G.nodeType === 1 ? G : wt(B.current).body, j = re.getBoundingClientRect();
     if (process.env.NODE_ENV !== "production") {
       const ve = re.getBoundingClientRect();
       process.env.NODE_ENV !== "test" && ve.top === 0 && ve.left === 0 && ve.right === 0 && ve.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(`
@@ -9589,13 +9589,13 @@ const pv = (e) => {
       top: j.top + nu(j, s.vertical),
       left: j.left + ru(j, s.horizontal)
     };
-  }, [i, s.horizontal, s.vertical, c, l]), H = E.useCallback((U) => ({
-    vertical: nu(U, S.vertical),
-    horizontal: ru(U, S.horizontal)
-  }), [S.horizontal, S.vertical]), I = E.useCallback((U) => {
+  }, [i, s.horizontal, s.vertical, c, l]), H = E.useCallback((G) => ({
+    vertical: nu(G, S.vertical),
+    horizontal: ru(G, S.horizontal)
+  }), [S.horizontal, S.vertical]), I = E.useCallback((G) => {
     const re = {
-      width: U.offsetWidth,
-      height: U.offsetHeight
+      width: G.offsetWidth,
+      height: G.offsetHeight
     }, j = H(re);
     if (l === "none")
       return {
@@ -9627,11 +9627,11 @@ const pv = (e) => {
       transformOrigin: ou(j)
     };
   }, [i, l, k, H, g]), [F, L] = E.useState(y), N = E.useCallback(() => {
-    const U = B.current;
-    if (!U)
+    const G = B.current;
+    if (!G)
       return;
-    const re = I(U);
-    re.top !== null && U.style.setProperty("top", re.top), re.left !== null && (U.style.left = re.left), U.style.transformOrigin = re.transformOrigin, L(!0);
+    const re = I(G);
+    re.top !== null && G.style.setProperty("top", re.top), re.left !== null && (G.style.left = re.left), G.style.transformOrigin = re.transformOrigin, L(!0);
   }, [I]);
   E.useEffect(() => (R && window.addEventListener("scroll", N), () => window.removeEventListener("scroll", N)), [i, R, N]);
   const W = () => {
@@ -9648,11 +9648,11 @@ const pv = (e) => {
   } : null, [y, N]), E.useEffect(() => {
     if (!y)
       return;
-    const U = Ts(() => {
+    const G = Ts(() => {
       N();
     }), re = un(Or(i));
-    return re.addEventListener("resize", U), () => {
-      U.clear(), re.removeEventListener("resize", U);
+    return re.addEventListener("resize", G), () => {
+      G.clear(), re.removeEventListener("resize", G);
     };
   }, [i, y, N]);
   let Q = b;
@@ -9670,13 +9670,13 @@ const pv = (e) => {
     elementType: Ir,
     externalForwardedProps: $,
     ownerState: _,
-    getSlotProps: (U) => ({
-      ...U,
+    getSlotProps: (G) => ({
+      ...G,
       onEntering: (re, j) => {
-        U.onEntering?.(re, j), W();
+        G.onEntering?.(re, j), W();
       },
       onExited: (re) => {
-        U.onExited?.(re), ie();
+        G.onExited?.(re), ie();
       }
     }),
     additionalProps: {
@@ -9686,7 +9686,7 @@ const pv = (e) => {
   });
   b === "auto" && !z.muiSupportAuto && (Q = void 0);
   const te = f || (i ? wt(Or(i)).body : void 0), [X, {
-    slots: q,
+    slots: U,
     slotProps: A,
     ...Z
   }] = Me("root", {
@@ -9728,7 +9728,7 @@ const pv = (e) => {
   return /* @__PURE__ */ x.jsx(X, {
     ...Z,
     ...!nm(X) && {
-      slots: q,
+      slots: U,
       slotProps: A,
       disableScrollLock: R
     },
@@ -10210,12 +10210,12 @@ const wv = je`
   border-top: 1px solid ${V("slate.300")};
 `, Cv = (e) => je`
   background-color: ${e ? V(e) : ""};
-`, Sv = G.div`
+`, Sv = q.div`
   display: flex;
   flex-direction: column;
   border-radius: 10px;
   background-color: ${V("white")};
-`, cu = G.div`
+`, cu = q.div`
   display: grid;
   grid-template-areas: 'badge text';
   grid-template-columns: auto auto;
@@ -10233,7 +10233,7 @@ const wv = je`
     border-radius: 0;
     background-color: ${V("purple.250")};
   }
-`, lu = G.span`
+`, lu = q.span`
   grid-area: text;
   white-space: nowrap;
   overflow: hidden;
@@ -10246,7 +10246,7 @@ const wv = je`
     color: #fff;
     fill: #fff;
   }
-`, uu = G.span`
+`, uu = q.span`
   grid-area: badge;
 
   display: flex;
@@ -10263,16 +10263,16 @@ const wv = je`
   color: ${V("blue.800")};
 
   ${({ $backgroundColor: e }) => !!e && Ev}
-`, Tv = G.div`
+`, Tv = q.div`
   cursor: pointer;
   display: flex;
   height: 100%;
 `;
-G.div`
+q.div`
   display: grid;
   grid-template-columns: auto 230px auto;
 `;
-G.div`
+q.div`
   grid-column: 2 / 3;
 `;
 const Ov = ({
@@ -10288,7 +10288,7 @@ const Ov = ({
     Pv,
     e.ariaLabel ?? e.name
   );
-}, $v = G.a`
+}, $v = q.a`
   display: flex;
   align-items: center;
   cursor: pointer;
@@ -10870,15 +10870,15 @@ function p2(e) {
 function f2(e) {
   var t = e.state, n = e.options, r = e.name;
   if (!t.modifiersData[r]._skip) {
-    for (var o = n.mainAxis, i = o === void 0 ? !0 : o, s = n.altAxis, c = s === void 0 ? !0 : s, l = n.fallbackPlacements, d = n.padding, u = n.boundary, f = n.rootBoundary, m = n.altBoundary, g = n.flipVariations, y = g === void 0 ? !0 : g, p = n.allowedAutoPlacements, T = t.options.placement, O = Dt(T), S = O === T, v = l || (S || !y ? [So(T)] : p2(T)), b = [T].concat(v).reduce(function(X, q) {
-      return X.concat(Dt(q) === Is ? d2(t, {
-        placement: q,
+    for (var o = n.mainAxis, i = o === void 0 ? !0 : o, s = n.altAxis, c = s === void 0 ? !0 : s, l = n.fallbackPlacements, d = n.padding, u = n.boundary, f = n.rootBoundary, m = n.altBoundary, g = n.flipVariations, y = g === void 0 ? !0 : g, p = n.allowedAutoPlacements, T = t.options.placement, O = Dt(T), S = O === T, v = l || (S || !y ? [So(T)] : p2(T)), b = [T].concat(v).reduce(function(X, U) {
+      return X.concat(Dt(U) === Is ? d2(t, {
+        placement: U,
         boundary: u,
         rootBoundary: f,
         padding: d,
         flipVariations: y,
         allowedAutoPlacements: p
-      }) : q);
+      }) : U);
     }, []), C = t.rects.reference, R = t.rects.popper, P = /* @__PURE__ */ new Map(), B = !0, _ = b[0], h = 0; h < b.length; h++) {
       var k = b[h], H = Dt(k), I = sr(k) === or, F = [ct, Ct].indexOf(H) >= 0, L = F ? "width" : "height", N = Br(t, {
         placement: k,
@@ -10898,11 +10898,11 @@ function f2(e) {
       P.set(k, Q);
     }
     if (B)
-      for (var $ = y ? 3 : 1, z = function(q) {
+      for (var $ = y ? 3 : 1, z = function(U) {
         var A = b.find(function(Z) {
           var Y = P.get(Z);
           if (Y)
-            return Y.slice(0, q).every(function(oe) {
+            return Y.slice(0, U).every(function(oe) {
               return oe;
             });
         });
@@ -11030,7 +11030,7 @@ function S2(e) {
       var I, F = b === "y" ? ct : lt, L = b === "y" ? Ct : St, N = b === "y" ? "height" : "width", W = R[b], ie = W + T[F], Q = W - T[L], $ = g ? -B[N] / 2 : 0, z = S === or ? P[N] : B[N], K = S === or ? -B[N] : -P[N], te = t.elements.arrow, X = g && te ? Ls(te) : {
         width: 0,
         height: 0
-      }, q = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : tp(), A = q[F], Z = q[L], Y = _r(0, P[N], X[N]), oe = v ? P[N] / 2 - $ - Y - A - h.mainAxis : z - Y - A - h.mainAxis, U = v ? -P[N] / 2 + $ + Y + Z + h.mainAxis : K + Y + Z + h.mainAxis, re = t.elements.arrow && Gr(t.elements.arrow), j = re ? b === "y" ? re.clientTop || 0 : re.clientLeft || 0 : 0, ve = (I = k?.[b]) != null ? I : 0, Ee = W + oe - ve - j, Ae = W + U - ve, He = _r(g ? No(ie, Ee) : ie, W, g ? Rn(Q, Ae) : Q);
+      }, U = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : tp(), A = U[F], Z = U[L], Y = _r(0, P[N], X[N]), oe = v ? P[N] / 2 - $ - Y - A - h.mainAxis : z - Y - A - h.mainAxis, G = v ? -P[N] / 2 + $ + Y + Z + h.mainAxis : K + Y + Z + h.mainAxis, re = t.elements.arrow && Gr(t.elements.arrow), j = re ? b === "y" ? re.clientTop || 0 : re.clientLeft || 0 : 0, ve = (I = k?.[b]) != null ? I : 0, Ee = W + oe - ve - j, Ae = W + G - ve, He = _r(g ? No(ie, Ee) : ie, W, g ? Rn(Q, Ae) : Q);
       R[b] = He, H[b] = He - W;
     }
     if (c) {
@@ -12045,13 +12045,13 @@ const Bo = /* @__PURE__ */ E.forwardRef(function(t, n) {
     ...N
   } = r, W = /* @__PURE__ */ E.isValidElement(i) ? i : /* @__PURE__ */ x.jsx("span", {
     children: i
-  }), ie = pr(), Q = ui(), [$, z] = E.useState(), [K, te] = E.useState(null), X = E.useRef(!1), q = m || O, A = Sn(), Z = Sn(), Y = Sn(), oe = Sn(), [U, re] = Os({
+  }), ie = pr(), Q = ui(), [$, z] = E.useState(), [K, te] = E.useState(null), X = E.useRef(!1), U = m || O, A = Sn(), Z = Sn(), Y = Sn(), oe = Sn(), [G, re] = Os({
     controlled: P,
     default: !1,
     name: "Tooltip",
     state: "open"
   });
-  let j = U;
+  let j = G;
   if (process.env.NODE_ENV !== "production") {
     const {
       current: ce
@@ -12139,13 +12139,13 @@ const Bo = /* @__PURE__ */ E.forwardRef(function(t, n) {
 `));
   }, [$]));
   const At = {};
-  g || (nt.onTouchStart = Mt, nt.onTouchEnd = Ft), f || (nt.onMouseOver = po(ke, nt.onMouseOver), nt.onMouseLeave = po(Ie, nt.onMouseLeave), q || (At.onMouseOver = ke, At.onMouseLeave = Ie)), u || (nt.onFocus = po(se, nt.onFocus), nt.onBlur = po(Se, nt.onBlur), q || (At.onFocus = se, At.onBlur = Se)), process.env.NODE_ENV !== "production" && W.props.title && console.error(["MUI: You have provided a `title` prop to the child of <Tooltip />.", `Remove this title prop \`${W.props.title}\` or the Tooltip component.`].join(`
+  g || (nt.onTouchStart = Mt, nt.onTouchEnd = Ft), f || (nt.onMouseOver = po(ke, nt.onMouseOver), nt.onMouseLeave = po(Ie, nt.onMouseLeave), U || (At.onMouseOver = ke, At.onMouseLeave = Ie)), u || (nt.onFocus = po(se, nt.onFocus), nt.onBlur = po(Se, nt.onBlur), U || (At.onFocus = se, At.onBlur = Se)), process.env.NODE_ENV !== "production" && W.props.title && console.error(["MUI: You have provided a `title` prop to the child of <Tooltip />.", `Remove this title prop \`${W.props.title}\` or the Tooltip component.`].join(`
 `));
   const Ot = {
     ...r,
     isRtl: Q,
     arrow: o,
-    disableInteractive: q,
+    disableInteractive: U,
     placement: B,
     PopperComponentProp: _,
     touch: X.current
@@ -12429,7 +12429,7 @@ process.env.NODE_ENV !== "production" && (Bo.propTypes = {
    */
   TransitionProps: a.object
 });
-const K2 = G.span`
+const K2 = q.span`
   display: block;
   overflow: hidden;
   white-space: nowrap;
@@ -12563,7 +12563,7 @@ const K2 = G.span`
       )
     }
   );
-}, f3 = ({
+}, m3 = ({
   anchorType: e,
   content: t,
   onSelect: n,
@@ -12718,7 +12718,7 @@ const K2 = G.span`
       ] }))
     }
   );
-}, nb = G.span`
+}, nb = q.span`
   font-family: ${rt("roboto")};
   font-size: 0.8em;
   font-weight: 400;
@@ -12751,7 +12751,7 @@ const ob = "error-message", ib = ({
       children: o
     }
   );
-}, ab = G.div`
+}, ab = q.div`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -12762,7 +12762,7 @@ const ob = "error-message", ib = ({
   > button:nth-child(4) {
     visibility: hidden;
   }
-`, cb = G.div`
+`, cb = q.div`
   display: flex;
   & > button:nth-child(1),
   > button:nth-child(2),
@@ -12770,7 +12770,7 @@ const ob = "error-message", ib = ({
     margin-right: 15px;
   }
   ${(e) => e.hideFirstAndLastButton && sb}
-`, h3 = ({
+`, g3 = ({
   disableAllActions: e = !1,
   disablePreviousActions: t = !1,
   disableNextActions: n = !1,
@@ -12831,7 +12831,7 @@ const ob = "error-message", ib = ({
       children: "Last"
     }
   )
-] }) }), lb = G.label`
+] }) }), lb = q.label`
   color: ${V("blue.950")};
   font-family: ${rt("roboto")};
   font-size: 13px;
@@ -12839,14 +12839,14 @@ const ob = "error-message", ib = ({
   & > strong {
     font-weight: bold;
   }
-`, ub = G.div`
+`, ub = q.div`
   display: flex;
   flex-direction: row;
   align-items: flex-end;
   height: 42px;
   padding-bottom: 10px;
   gap: 10px;
-`, db = G(ld)`
+`, db = q(ld)`
   fill: ${V("slate.400")};
   width: 13px;
   height: 13px;
@@ -12893,10 +12893,10 @@ const ob = "error-message", ib = ({
       )
     }
   )
-] }), fb = G.div`
+] }), fb = q.div`
   width: 30px;
   overflow: hidden;
-`, hb = G.svg.attrs({
+`, hb = q.svg.attrs({
   viewBox: "0 0 1 1",
   preserveAspectRatio: "none"
 })`
@@ -12907,7 +12907,7 @@ const ob = "error-message", ib = ({
   margin-left: -2px;
   fill: ${({ fill: e }) => e};
   stroke: ${({ stroke: e }) => e};
-`, m3 = ({ fill: e, stroke: t, style: n, onClick: r }) => /* @__PURE__ */ x.jsx(fb, { onClick: r, children: /* @__PURE__ */ x.jsx(
+`, y3 = ({ fill: e, stroke: t, style: n, onClick: r }) => /* @__PURE__ */ x.jsx(fb, { onClick: r, children: /* @__PURE__ */ x.jsx(
   hb,
   {
     fill: e,
@@ -13377,7 +13377,7 @@ const Nb = ({
     ...o,
     children: e
   }
-), cp = G(Nb)`
+), cp = q(Nb)`
   color: ${V("purple.800")};
   font-family: ${rt("roboto")};
 `, Lb = ({ imageSrc: e, text: t = "Loading..." }) => /* @__PURE__ */ x.jsx(Db, { children: /* @__PURE__ */ x.jsxs("div", { children: [
@@ -13389,7 +13389,7 @@ const Nb = ({
     }
   ),
   /* @__PURE__ */ x.jsx(cp, { className: "translate", children: t })
-] }) }), Bb = G(Cb)`
+] }) }), Bb = q(Cb)`
   color: ${(e) => e.color ?? "#000"};
   fill: ${(e) => e.color ?? "#000"};
   &&& {
@@ -13401,7 +13401,7 @@ const Nb = ({
     color: e,
     ...t
   }
-), Db = G.div`
+), Db = q.div`
   position: fixed;
   top: 150px;
   left: 0;
@@ -13424,30 +13424,30 @@ const Nb = ({
   &&& {
     margin: 20px;
   }
-`, Vb = G.div`
+`, Vb = q.div`
   padding-top: ${({ paddingTop: e }) => e ?? "0"};
-`, Fb = G.div`
+`, Fb = q.div`
   padding-top: ${({ paddingTop: e }) => e ?? "0"};
   display: flex;
   height: 42px;
   justify-content: ${({ isAlignLeft: e }) => e ? "flex-start" : "center"};
   align-items: center;
-`, Hb = G(Pb)`
+`, Hb = q(Pb)`
   &&& {
     margin: 10px;
   }
-`, Wb = G(Lb)`
+`, Wb = q(Lb)`
   ${lp}
-`, qb = G(Rb)`
+`, qb = q(Rb)`
   ${lp}
-`, Ub = G(zb)`
+`, Ub = q(zb)`
   margin: 5px auto;
 `, Gb = {
   bar: qb,
   page: Wb,
   circle: Hb,
   ring: Ub
-}, g3 = ({
+}, v3 = ({
   text: e = "",
   variant: t = "page",
   paddingTop: n,
@@ -13496,30 +13496,30 @@ const Nb = ({
       background-color: ${V("purple.300")};
     }
   }
-`, Kb = G.div`
+`, Kb = q.div`
   width: ${({ widthPercent: e, width: t }) => e ? `${String(e)}%` : `${String(t ?? 1)}px`};
   height: ${({ heightPercent: e, height: t }) => e ? `${String(e)}%` : `${String(t ?? 1)}px`};
   border-radius: ${(e) => e.borderRadius ?? 0}px;
   ${Yb}
-`, y3 = (e) => /* @__PURE__ */ x.jsx(
+`, b3 = (e) => /* @__PURE__ */ x.jsx(
   Kb,
   {
     "data-testid": "skeleton",
     className: e.className,
     ...e
   }
-), Zb = G.div`
+), Zb = q.div`
   width: ${({ isSmallContainer: e }) => e ? 100 : 170}px;
   height: ${({ isSmallContainer: e }) => e ? 100 : 170}px;
   overflow: hidden;
-`, Xb = G.img`
+`, Xb = q.img`
   width: 100%;
   height: auto;
   margin-bottom: 40px;
   border-radius: 5px;
   object-fit: cover;
   pointer-events: none;
-`, Jb = G.div`
+`, Jb = q.div`
   display: flex;
   align-items: center;
   flex-direction: column;
@@ -13529,14 +13529,14 @@ const Nb = ({
   margin-bottom: 32px;
   font-family: 'Roboto', sans-serif;
   font-size: 14px;
-`, Qb = G.div`
+`, Qb = q.div`
   max-width: 330px;
   width: 100%;
   text-align: center;
 `, e4 = `
   You do not have any items created for this module.
   To create use the Add button above.
-`, v3 = ({ isSmallContainer: e, image: t, message: n }) => /* @__PURE__ */ x.jsxs(Jb, { children: [
+`, x3 = ({ isSmallContainer: e, image: t, message: n }) => /* @__PURE__ */ x.jsxs(Jb, { children: [
   t && /* @__PURE__ */ x.jsx(
     Zb,
     {
@@ -13570,27 +13570,27 @@ const Nb = ({
       background-color: ${V("purple.300")};
     }
   }
-`, t4 = G.div`
+`, t4 = q.div`
   width: 36px;
   height: 36px;
   border-radius: 5px;
   ${hi}
-`, n4 = G.div`
+`, n4 = q.div`
   width: 50%;
   height: 18px;
   border-radius: 2px;
   ${hi}
-`, r4 = G.div`
+`, r4 = q.div`
   width: 25px;
   height: 25px;
   border-radius: 20px;
   ${hi}
-`, o4 = G.div`
+`, o4 = q.div`
   width: 20%;
   height: 14px;
   border-radius: 2px;
   ${hi}
-`, i4 = G.div`
+`, i4 = q.div`
   display: flex;
   height: 105px;
   width: relative;
@@ -13602,7 +13602,7 @@ const Nb = ({
   overflow: hidden;
   flex-direction: column;
   align-items: center;
-`, a4 = G.div`
+`, a4 = q.div`
   width: 100%;
   display: grid;
   grid-template-columns: 36px calc(100% - 36px);
@@ -13610,7 +13610,7 @@ const Nb = ({
   align-items: center;
   grid-gap: 15px;
   color: ${V("gray.615")};
-`, s4 = G.div`
+`, s4 = q.div`
   max-width: 100%;
   width: 100%;
   height: 63px;
@@ -13619,7 +13619,7 @@ const Nb = ({
   padding: 0px 15px;
   border-bottom: 1px solid ${V("slate.300")};
   box-sizing: border-box;
-`, c4 = G.div`
+`, c4 = q.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -13628,7 +13628,7 @@ const Nb = ({
   height: 42px;
   padding: 0px 15px;
   box-sizing: border-box;
-`, b3 = () => /* @__PURE__ */ x.jsxs(i4, { "data-testid": "card-loading", children: [
+`, w3 = () => /* @__PURE__ */ x.jsxs(i4, { "data-testid": "card-loading", children: [
   /* @__PURE__ */ x.jsx(s4, { children: /* @__PURE__ */ x.jsxs(a4, { children: [
     /* @__PURE__ */ x.jsx(t4, {}),
     /* @__PURE__ */ x.jsx(n4, {})
@@ -13637,18 +13637,18 @@ const Nb = ({
     /* @__PURE__ */ x.jsx(r4, {}),
     /* @__PURE__ */ x.jsx(o4, {})
   ] })
-] }), l4 = G.div`
+] }), l4 = q.div`
   display: flex;
   flex-direction: ${({ direction: e }) => e ?? "row"};
   justify-content: ${({ justify: e }) => e ?? "flex-start"};
   align-items: ${({ align: e }) => e ?? "flex-start"};
   flex-wrap: ${({ wrap: e }) => e ?? "nowrap"};
   gap: ${({ gap: e }) => e ?? "0"};
-`, x3 = ({ children: e, ...t }) => /* @__PURE__ */ x.jsx(l4, { ...t, children: e }), u4 = G.div`
+`, C3 = ({ children: e, ...t }) => /* @__PURE__ */ x.jsx(l4, { ...t, children: e }), u4 = q.div`
   width: 100%;
   display: flex;
   align-items: center;
-`, up = G.div`
+`, up = q.div`
   width: 12px;
   height: 12px;
   padding: 0 15px;
@@ -13662,7 +13662,7 @@ const Nb = ({
   > svg {
     fill: ${V("gray.615")};
   }
-`, d4 = G.span`
+`, d4 = q.span`
   user-select: all;
   max-width: calc(100% - 42px);
   text-overflow: ellipsis;
@@ -13672,9 +13672,9 @@ const Nb = ({
   &:hover ~ ${up} {
     opacity: 1;
   }
-`, p4 = G.div`
+`, p4 = q.div`
   cursor: pointer;
-`, f4 = 12, w3 = ({ id: e, children: t }) => {
+`, f4 = 12, S3 = ({ id: e, children: t }) => {
   const n = `copy_${e}`, [
     r,
     o
@@ -13852,7 +13852,7 @@ const m4 = (e) => {
     h.current && I && (h.current.style.position = "");
     const {
       duration: oe,
-      easing: U
+      easing: G
     } = rr({
       style: S,
       timeout: v,
@@ -13865,7 +13865,7 @@ const m4 = (e) => {
       A.style.transitionDuration = `${re}ms`, k.current = re;
     } else
       A.style.transitionDuration = typeof oe == "string" ? oe : `${oe}ms`;
-    A.style[F] = `${Y}px`, A.style.transitionTimingFunction = U, g && g(A, Z);
+    A.style[F] = `${Y}px`, A.style.transitionTimingFunction = G, g && g(A, Z);
   }), z = W((A, Z) => {
     A.style[F] = "auto", m && m(A, Z);
   }), K = W((A) => {
@@ -13882,12 +13882,12 @@ const m4 = (e) => {
       mode: "exit"
     });
     if (v === "auto") {
-      const U = B.transitions.getAutoHeightDuration(Z);
-      A.style.transitionDuration = `${U}ms`, k.current = U;
+      const G = B.transitions.getAutoHeightDuration(Z);
+      A.style.transitionDuration = `${G}ms`, k.current = G;
     } else
       A.style.transitionDuration = typeof Y == "string" ? Y : `${Y}ms`;
     A.style[F] = H, A.style.transitionTimingFunction = oe, T && T(A);
-  }), q = (A) => {
+  }), U = (A) => {
     v === "auto" && _.start(k.current || 0, A), o && o(L.current, A);
   };
   return /* @__PURE__ */ x.jsx(b, {
@@ -13898,7 +13898,7 @@ const m4 = (e) => {
     onExit: K,
     onExited: te,
     onExiting: X,
-    addEndListener: q,
+    addEndListener: U,
     nodeRef: L,
     timeout: v === "auto" ? null : v,
     ...C,
@@ -14821,9 +14821,9 @@ const I4 = Xe("MuiButtonBase", ["root", "disabled", "focusVisible"]), N4 = (e) =
   E.useEffect(() => {
     z && m && !u && Q.pulsate();
   }, [u, m, z, Q]);
-  const X = Kt(Q, "start", P, f), q = Kt(Q, "stop", O, f), A = Kt(Q, "stop", S, f), Z = Kt(Q, "stop", _, f), Y = Kt(Q, "stop", (se) => {
+  const X = Kt(Q, "start", P, f), U = Kt(Q, "stop", O, f), A = Kt(Q, "stop", S, f), Z = Kt(Q, "stop", _, f), Y = Kt(Q, "stop", (se) => {
     z && se.preventDefault(), B && B(se);
-  }, f), oe = Kt(Q, "start", H, f), U = Kt(Q, "stop", h, f), re = Kt(Q, "stop", k, f), j = Kt(Q, "stop", (se) => {
+  }, f), oe = Kt(Q, "start", H, f), G = Kt(Q, "stop", h, f), re = Kt(Q, "stop", k, f), j = Kt(Q, "stop", (se) => {
     Mo(se.target) || K(!1), p && p(se);
   }, !1), ve = $t((se) => {
     ie.current || (ie.current = se.currentTarget), Mo(se.target) && (K(!0), b && b(se)), v && v(se);
@@ -14860,7 +14860,7 @@ const I4 = Xe("MuiButtonBase", ["root", "disabled", "focusVisible"]), N4 = (e) =
     ownerState: We,
     onBlur: j,
     onClick: T,
-    onContextMenu: q,
+    onContextMenu: U,
     onFocus: ve,
     onKeyDown: Ae,
     onKeyUp: He,
@@ -14868,7 +14868,7 @@ const I4 = Xe("MuiButtonBase", ["root", "disabled", "focusVisible"]), N4 = (e) =
     onMouseLeave: Y,
     onMouseUp: Z,
     onDragLeave: A,
-    onTouchEnd: U,
+    onTouchEnd: G,
     onTouchMove: re,
     onTouchStart: oe,
     ref: Ie,
@@ -15267,7 +15267,7 @@ const H4 = je`
     color: #fff;
     fill: #fff;
   }
-`, Cu = G.span`
+`, Cu = q.span`
   grid-area: text;
   white-space: nowrap;
   overflow: hidden;
@@ -15277,7 +15277,7 @@ const H4 = je`
   font-family: ${rt("roboto")};
   color: ${({ color: e }) => V(e ?? "blue.800")};
 `;
-G.span`
+q.span`
   grid-area: badge;
 
   display: flex;
@@ -15295,7 +15295,7 @@ G.span`
 
   ${(e) => e.bgColor && H4}
 `;
-const W4 = G(dp)`
+const W4 = q(dp)`
   width: 100%;
   box-shadow: none !important;
   border: 1px solid #909090;
@@ -15304,7 +15304,7 @@ const W4 = G(dp)`
   &.Mui-disabled {
     opacity: 0.5;
   }
-`, q4 = G(mp)`
+`, q4 = q(mp)`
   width: 100%;
   padding: 0 4px !important;
   margin: 0 !important;
@@ -15337,7 +15337,7 @@ const W4 = G(dp)`
       transform: rotate(180deg);
     }
   }
-`, U4 = G(pp)`
+`, U4 = q(pp)`
   padding-top: 8px !important;
   padding-bottom: 8px !important;
   padding-left: 28px !important;
@@ -15346,7 +15346,7 @@ const W4 = G(dp)`
   flex-direction: column;
   gap: 8px;
   border-top: 1px solid #ddd;
-`, C3 = ({
+`, E3 = ({
   label: e,
   tooltip: t,
   isDisabled: n = !1,
@@ -15423,13 +15423,13 @@ const W4 = G(dp)`
   top: 0;
   bottom: 0;
   z-index: 999;
-`, K4 = G.div`
+`, K4 = q.div`
   display: flex;
   justify-content: center;
   align-items: center;
   background: #fff;
   ${({ isFullContainer: e }) => e ? Y4 : G4}
-`, Z4 = G.img`
+`, Z4 = q.img`
   width: 140px;
   height: 140px;
 
@@ -15450,7 +15450,7 @@ const W4 = G(dp)`
     src: X4,
     alt: "This is an animated GIF image of the devopness starship"
   }
-) }), S3 = os(J4), gp = /* @__PURE__ */ E.createContext(void 0);
+) }), T3 = os(J4), gp = /* @__PURE__ */ E.createContext(void 0);
 process.env.NODE_ENV !== "production" && (gp.displayName = "FormControlContext");
 function Q4() {
   return E.useContext(gp);
@@ -15552,15 +15552,15 @@ const t5 = (e) => {
     default: !!s,
     name: "SwitchBase",
     state: "checked"
-  }), H = Q4(), I = (q) => {
-    O && O(q), H && H.onFocus && H.onFocus(q);
-  }, F = (q) => {
-    p && p(q), H && H.onBlur && H.onBlur(q);
-  }, L = (q) => {
-    if (q.nativeEvent.defaultPrevented)
+  }), H = Q4(), I = (U) => {
+    O && O(U), H && H.onFocus && H.onFocus(U);
+  }, F = (U) => {
+    p && p(U), H && H.onBlur && H.onBlur(U);
+  }, L = (U) => {
+    if (U.nativeEvent.defaultPrevented)
       return;
-    const A = q.target.checked;
-    k(A), T && T(q, A);
+    const A = U.target.checked;
+    k(A), T && T(U, A);
   };
   let N = c;
   H && typeof N > "u" && (N = H.disabled);
@@ -15586,13 +15586,13 @@ const t5 = (e) => {
       component: "span",
       ..._
     },
-    getSlotProps: (q) => ({
-      ...q,
+    getSlotProps: (U) => ({
+      ...U,
       onFocus: (A) => {
-        q.onFocus?.(A), I(A);
+        U.onFocus?.(A), I(A);
       },
       onBlur: (A) => {
-        q.onBlur?.(A), F(A);
+        U.onBlur?.(A), F(A);
       }
     }),
     ownerState: ie,
@@ -15608,9 +15608,9 @@ const t5 = (e) => {
     elementType: r5,
     className: Q.input,
     externalForwardedProps: $,
-    getSlotProps: (q) => ({
+    getSlotProps: (U) => ({
       onChange: (A) => {
-        q.onChange?.(A), L(A);
+        U.onChange?.(A), L(A);
       }
     }),
     ownerState: ie,
@@ -16064,7 +16064,7 @@ const f5 = ({
       ...c
     }
   );
-}, E3 = os(f5), h5 = Od({
+}, O3 = os(f5), h5 = Od({
   themeId: Ps
 });
 function m5(e) {
@@ -16854,7 +16854,7 @@ const wp = /* @__PURE__ */ E.forwardRef(function(t, n) {
     ownerState: $
   });
   process.env.NODE_ENV !== "production" && d && I && console.error('MUI: You can not use the `centered={true}` and `variant="scrollable"` properties at the same time on a `Tabs` component.');
-  const [X, q] = E.useState(!1), [A, Z] = E.useState(Tu), [Y, oe] = E.useState(!1), [U, re] = E.useState(!1), [j, ve] = E.useState(!1), [Ee, Ae] = E.useState({
+  const [X, U] = E.useState(!1), [A, Z] = E.useState(Tu), [Y, oe] = E.useState(!1), [G, re] = E.useState(!1), [j, ve] = E.useState(!1), [Ee, Ae] = E.useState({
     overflow: "hidden",
     scrollbarWidth: 0
   }), He = /* @__PURE__ */ new Map(), Te = E.useRef(null), ke = E.useRef(null), Ie = {
@@ -16975,7 +16975,7 @@ const wp = /* @__PURE__ */ E.forwardRef(function(t, n) {
       ...jt,
       onChange: en
     }) : null;
-    const fe = I && (S === "auto" && (Y || U) || S === !0);
+    const fe = I && (S === "auto" && (Y || G) || S === !0);
     return ne.scrollButtonStart = fe ? /* @__PURE__ */ x.jsx(nt, {
       direction: i ? "right" : "left",
       onClick: Ft,
@@ -16984,7 +16984,7 @@ const wp = /* @__PURE__ */ E.forwardRef(function(t, n) {
     }) : null, ne.scrollButtonEnd = fe ? /* @__PURE__ */ x.jsx(nt, {
       direction: i ? "left" : "right",
       onClick: Ht,
-      disabled: !U,
+      disabled: !G,
       ...At
     }) : null, ne;
   }, It = $t((ne) => {
@@ -17049,7 +17049,7 @@ const wp = /* @__PURE__ */ E.forwardRef(function(t, n) {
       };
     }
   }, [I, S, j, u?.length]), E.useEffect(() => {
-    q(!0);
+    U(!0);
   }, []), E.useEffect(() => {
     Se();
   }), E.useEffect(() => {
@@ -17326,7 +17326,7 @@ process.env.NODE_ENV !== "production" && (wp.propTypes = {
    */
   visibleScrollbar: a.bool
 });
-const A5 = G.div`
+const A5 = q.div`
   display: grid;
   grid-template-columns: auto;
   grid-template-rows: 82px 1fr;
@@ -17352,7 +17352,7 @@ const A5 = G.div`
 `, I5 = {
   white: ye("logo_devopness_beta.png"),
   colored: ye("logo_devopness_alfa.png")
-}, T3 = ({
+}, R3 = ({
   className: e,
   logo: t = "colored",
   backgroundColor: n = "indigo.10",
@@ -17374,7 +17374,7 @@ const A5 = G.div`
       o
     ]
   }
-) : null, O3 = ({ trigger: e, children: t }) => /* @__PURE__ */ x.jsx(
+) : null, P3 = ({ trigger: e, children: t }) => /* @__PURE__ */ x.jsx(
   As,
   {
     variant: "popover",
@@ -17400,7 +17400,7 @@ const A5 = G.div`
       )
     ] })
   }
-), N5 = G.div`
+), N5 = q.div`
   cursor: pointer;
   display: flex;
   justify-content: center;
@@ -17468,7 +17468,7 @@ const A5 = G.div`
     f,
     u
   ]), /* @__PURE__ */ x.jsx(N5, { children: /* @__PURE__ */ x.jsx(Xt, { title: m(), children: c }) });
-}, R3 = os(L5), B5 = G.div`
+}, $3 = os(L5), B5 = q.div`
   display: flex;
   min-height: ${({ $disableMinHeight: e }) => e ? "auto" : "105px"};
   width: relative;
@@ -17480,7 +17480,7 @@ const A5 = G.div`
   overflow: hidden;
   flex-direction: column;
   align-items: center;
-`, z5 = G.div`
+`, z5 = q.div`
   align-items: center;
   background-color: ${({ $backgroundColor: e }) => V(e)};
   border-radius: 5px;
@@ -17490,7 +17490,7 @@ const A5 = G.div`
   justify-content: center;
   height: 36px;
   width: 36px;
-`, D5 = G.span`
+`, D5 = q.span`
   color: ${V("blue.950")};
   font-size: 16px;
   font-weight: bold;
@@ -17498,7 +17498,7 @@ const A5 = G.div`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-`, V5 = G.span`
+`, V5 = q.span`
   color: ${V("gray.615")};
   font-size: 13px;
   grid-area: subtitle;
@@ -17506,13 +17506,13 @@ const A5 = G.div`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-`, Ru = G.span`
+`, Ru = q.span`
   color: ${V("blue.950")};
   font-size: 16px;
   font-weight: bold;
   grid-area: indicator;
   text-align: right;
-`, F5 = G.div`
+`, F5 = q.div`
   align-items: center;
   background-color: ${({ $backgroundColor: e }) => V(e ?? "transparent")};
   border-bottom: ${({ $borderBottomColor: e, $hideBorder: t }) => t ? "none" : `1px solid ${V(e ?? "slate.300")}`};
@@ -17526,7 +17526,7 @@ const A5 = G.div`
   height: 63px;
   padding: 14px 15px 0 15px;
   width: 100%;
-`, H5 = G.div`
+`, H5 = q.div`
   align-items: center;
   box-sizing: border-box;
   display: flex;
@@ -17573,9 +17573,9 @@ const A5 = G.div`
       width: 100%;
     }
   }
-`, Pu = G.span`
+`, Pu = q.span`
   text-transform: uppercase;
-`, W5 = G.span`
+`, W5 = q.span`
   font-size: 23px;
   font-weight: 700;
   font-family: ${rt("roboto")};
@@ -17583,7 +17583,7 @@ const A5 = G.div`
 `, q5 = ({ indicator: e }) => {
   if (e !== void 0)
     return typeof e == "number" && e > 99 ? /* @__PURE__ */ x.jsx(Ru, { children: "+99" }) : /* @__PURE__ */ x.jsx(Ru, { children: e });
-}, $u = "white", _u = "gray.615", ku = 23, P3 = ({ children: e, ...t }) => /* @__PURE__ */ x.jsxs(
+}, $u = "white", _u = "gray.615", ku = 23, _3 = ({ children: e, ...t }) => /* @__PURE__ */ x.jsxs(
   B5,
   {
     $disableMinHeight: !t.footer && !e,
@@ -17708,7 +17708,7 @@ const A5 = G.div`
       )
     ]
   }
-), U5 = G(wp)`
+), U5 = q(wp)`
   &.${Yn.root} {
     height: 40px;
     min-height: 40px;
@@ -17726,7 +17726,7 @@ const A5 = G.div`
   & .${Yn.indicator} {
     background-color: ${V("purple.800")};
   }
-`, G5 = G(vp)`
+`, G5 = q(vp)`
   &.${at.root} {
     min-width: auto;
     color: ${V("blue.950")};
@@ -17743,7 +17743,7 @@ const A5 = G.div`
     color: ${V("purple.800")};
     font-weight: 600;
   }
-`, $3 = ({
+`, k3 = ({
   data: e,
   currentTabIndex: t,
   onTabClick: n = (r) => null
@@ -17794,13 +17794,13 @@ const A5 = G.div`
     case "success":
       return V("green.150");
   }
-}, Z5 = G.div`
+}, Z5 = q.div`
   display: flex;
   align-items: center;
   width: 100%;
   padding-top: ${(e) => e.noPadding ? "" : "42px"};
   padding-bottom: ${(e) => e.noPadding ? "" : "20px"};
-`, X5 = G.div`
+`, X5 = q.div`
   display: flex;
   align-items: center;
   width: 100%;
@@ -17809,13 +17809,13 @@ const A5 = G.div`
   border: 1px solid ${(e) => Mu(e.type)};
   border-radius: 20px;
   padding: 9px 15px 8px;
-`, J5 = G.div`
+`, J5 = q.div`
   height: 13px;
   width: 13px;
   padding: 0;
   margin-right: 15px;
   color: ${(e) => Y5(e.type)};
-`, Q5 = G.label`
+`, Q5 = q.label`
   color: ${V("blue.950")};
   font-family: ${rt("roboto")};
   font-size: 13px;
@@ -17823,7 +17823,7 @@ const A5 = G.div`
   line-height: 1.5;
   white-space: pre-wrap;
   ${(e) => e.fullWidth ? "width: 100%;" : ""}
-`, e3 = G.div`
+`, e3 = q.div`
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
@@ -17836,7 +17836,7 @@ const A5 = G.div`
   error: "blue.950",
   success: "red.500",
   warning: "red.500"
-}, r3 = 13, _3 = (e) => /* @__PURE__ */ x.jsx(Z5, { noPadding: e.noPadding, children: /* @__PURE__ */ x.jsxs(X5, { type: e.type, children: [
+}, r3 = 13, M3 = (e) => /* @__PURE__ */ x.jsx(Z5, { noPadding: e.noPadding, children: /* @__PURE__ */ x.jsxs(X5, { type: e.type, children: [
   /* @__PURE__ */ x.jsx(J5, { type: e.type, children: Dr(t3[e.type], r3) }),
   /* @__PURE__ */ x.jsx(
     Q5,
@@ -17915,7 +17915,7 @@ const A5 = G.div`
   & {
     -moz-appearance: textfield;
   }
-`, s3 = G.div`
+`, s3 = q.div`
   display: flex;
   flex-direction: column;
   text-align: left;
@@ -17923,7 +17923,7 @@ const A5 = G.div`
   font-size: 16px;
   position: relative;
   ${o3}
-`, Eo = G.div`
+`, Eo = q.div`
   ${({ hasError: e, disabled: t, readOnly: n }) => je`
     display: flex;
     align-items: center;
@@ -17940,7 +17940,7 @@ const A5 = G.div`
       `}
     }
   `}
-`, rs = G.input`
+`, rs = q.input`
   ${({ hasIcon: e, iconPosition: t, publicStyle: n, type: r, removeArrows: o }) => je`
     max-width: 100%;
     width: 100%;
@@ -17967,7 +17967,7 @@ const A5 = G.div`
 
     ${r === "number" && (o ? a3 : i3)}
   `}
-`, Mr = G.div`
+`, Mr = q.div`
   ${({ iconPosition: e }) => je`
     display: flex;
     align-items: center;
@@ -17984,7 +17984,7 @@ const A5 = G.div`
       max-height: 18px;
     }
   `}
-`, c3 = G.div`
+`, c3 = q.div`
   ${({ disabled: e, readOnly: t, error: n }) => je`
     ${!!n && ka.error()};
     ${!!e && ka.disabled()};
@@ -18085,36 +18085,66 @@ const A5 = G.div`
   ] });
 });
 l3.displayName = "Input";
+const u3 = q.div`
+  display: grid;
+  grid-template-columns: repeat(12, 1fr);
+  grid-template-rows: auto;
+  grid-column-gap: 30px;
+  grid-row-gap: 30px;
+
+  margin-top: ${({ shouldRemoveTopMargin: e }) => e ? "0px" : "42px"};
+  padding-left: 30px;
+  padding-right: 30px;
+
+  @media (max-width: 640px) {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+`, d3 = q.section`
+  grid-column: 4 / 10;
+
+  @media (max-width: 768px) {
+    grid-column: 2 / 12;
+  }
+
+  background: ${({ styles: e }) => e?.backgroundWrapperContent ?? "transparent"};
+  height: ${({ styles: e }) => e?.height ? `${String(e.height)}px` : "auto"};
+`, j3 = ({
+  shouldRemoveTopMargin: e = !1,
+  styles: t,
+  children: n
+}) => /* @__PURE__ */ x.jsx(u3, { shouldRemoveTopMargin: e, children: /* @__PURE__ */ x.jsx(d3, { styles: t, children: n }) });
 export {
-  C3 as AccordionExpand,
-  _3 as Alert,
-  m3 as ArrowHead,
+  E3 as AccordionExpand,
+  M3 as Alert,
+  y3 as ArrowHead,
   Rb as BarLoader,
   rn as Button,
-  P3 as Card,
-  b3 as CardLoading,
-  E3 as CheckBox,
+  _3 as Card,
+  w3 as CardLoading,
+  O3 as CheckBox,
   Pb as CircleLoader,
-  w3 as CopyToClipboard,
-  T3 as Cover,
-  f3 as Dropdown,
-  v3 as EmptyData,
+  j3 as Container,
+  S3 as CopyToClipboard,
+  R3 as Cover,
+  m3 as Dropdown,
+  x3 as EmptyData,
   ib as ErrorMessage,
-  x3 as FlexContainer,
+  C3 as FlexContainer,
   on as IconComponent,
   l3 as Input,
   pb as Label,
   Xa as Link,
-  S3 as LoadStarship,
-  g3 as Loader,
+  T3 as LoadStarship,
+  v3 as Loader,
   Lb as PageLoader,
-  h3 as Pagination,
-  O3 as PopoverPopupState,
+  g3 as Pagination,
+  P3 as PopoverPopupState,
   zb as RingLoader,
-  y3 as Skeleton,
-  $3 as Tabs,
+  b3 as Skeleton,
+  k3 as Tabs,
   cp as Text,
-  R3 as TimerCounter,
+  $3 as TimerCounter,
   Xt as Tooltip,
   V as getColor,
   rt as getFont,