@undefine-ui/design-system 2.13.0 → 2.14.1

package/dist/index.cjs

@@ -112,7 +112,6 @@ __export(index_exports, {
   fShortenNumber: () => fShortenNumber,
   formatFullname: () => formatFullname,
   getCurrencySymbol: () => getCurrencySymbol,
-  getInitColorSchemeScript: () => getInitColorSchemeScript,
   getInitials: () => getInitials,
   getStorage: () => getStorage,
   grey: () => grey,
@@ -5851,8 +5850,10 @@ var getBackgroundDefault = (contrast) => {
 // src/theme/create-theme.ts
 var createTheme = (settings) => {
   const initialTheme = {
+    cssVariables: true,
     colorSchemes,
     breakpoints,
+    defaultColorScheme: settings.colorScheme,
     colorSchemeSelector: "data-mui-color-scheme",
     shadows: shadows(settings.colorScheme),
     customShadows: customShadows(settings.colorScheme),
@@ -5896,20 +5897,10 @@ var shouldSkipGeneratingVar = (keys) => {
 };
 
 // src/theme/color-scheme-script.tsx
-var import_InitColorSchemeScript = __toESM(require("@mui/material/InitColorSchemeScript"), 1);
-var import_jsx_runtime38 = require("react/jsx-runtime");
 var schemeConfig = {
   modeStorageKey: "theme-mode",
   defaultMode: defaultSettings.colorScheme
 };
-var getInitColorSchemeScript = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
-  import_InitColorSchemeScript.default,
-  {
-    modeStorageKey: schemeConfig.modeStorageKey,
-    colorSchemeNode: schemeConfig.defaultMode
-  },
-  schemeConfig.modeStorageKey
-);
 
 // src/theme/ThemeProvider.tsx
 var import_CssBaseline = __toESM(require("@mui/material/CssBaseline"), 1);
@@ -5925,18 +5916,18 @@ var import__8 = require("@fontsource/geist/500.css");
 var import__9 = require("@fontsource/geist/600.css");
 var import__10 = require("@fontsource/geist/700.css");
 var import_satoshi = require("./satoshi-4X3TX4PE.css");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var ThemeProvider = ({ children }) => {
   const settings = useSettings();
   const theme = createTheme(settings);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
     import_styles31.ThemeProvider,
     {
       theme,
       defaultMode: schemeConfig.defaultMode,
       modeStorageKey: schemeConfig.modeStorageKey,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_CssBaseline.default, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_CssBaseline.default, {}),
         children
       ]
     }
@@ -5946,7 +5937,7 @@ var ThemeProvider = ({ children }) => {
 // src/components/Logo/index.tsx
 var import_Link = __toESM(require("@mui/material/Link"), 1);
 var import_Box2 = __toESM(require("@mui/material/Box"), 1);
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var LOGO_MAP = {
   full: {
     black: "https://res.cloudinary.com/dvbtbsinu/image/upload/v1763077834/define-agency/logos/logo-black-full_mjngwu.png",
@@ -5974,7 +5965,7 @@ var Logo = ({
   const type = isFull ? "full" : "single";
   const color = isWhite ? "white" : isBlack ? "black" : "default";
   const logoImg = src ?? LOGO_MAP[type][color];
-  const logo = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  const logo = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     import_Box2.default,
     {
       component: "img",
@@ -5987,10 +5978,10 @@ var Logo = ({
   if (disableLink) {
     return logo;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_Link.default, { component: LinkComponent, href, sx: { display: "contents" }, children: logo });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_Link.default, { component: LinkComponent, href, sx: { display: "contents" }, children: logo });
 };
 var AnimatedLogo = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
     "svg",
     {
       width: "120",
@@ -5999,7 +5990,7 @@ var AnimatedLogo = () => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("style", { children: `
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("style", { children: `
           @keyframes fadeIn {
             from {
               opacity: 0;
@@ -6060,7 +6051,7 @@ var AnimatedLogo = () => {
             transform-origin: center;
           }
         ` }),
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "rect",
           {
             className: "background-rect",
@@ -6071,7 +6062,7 @@ var AnimatedLogo = () => {
             fill: "white"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "path",
           {
             className: "bars",
@@ -6079,7 +6070,7 @@ var AnimatedLogo = () => {
             fill: "#5E30EB"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "path",
           {
             className: "d-letter",
@@ -6099,7 +6090,7 @@ var import_x_data_grid2 = require("@mui/x-data-grid");
 // src/components/Table/components/TableNoRows.tsx
 var import_Box3 = __toESM(require("@mui/material/Box"), 1);
 var import_styles32 = require("@mui/material/styles");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var StyledGridOverlay = (0, import_styles32.styled)("div")(({ theme }) => ({
   display: "flex",
   flexDirection: "column",
@@ -6109,7 +6100,7 @@ var StyledGridOverlay = (0, import_styles32.styled)("div")(({ theme }) => ({
   height: "100%"
 }));
 var TableNoRows = ({ noRowsTitle = "No Rows" }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(StyledGridOverlay, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_Box3.default, { sx: { mt: 1 }, children: noRowsTitle }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(StyledGridOverlay, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_Box3.default, { sx: { mt: 1 }, children: noRowsTitle }) });
 };
 var TableNoRows_default = TableNoRows;
 
@@ -6119,7 +6110,7 @@ var import_Typography2 = __toESM(require("@mui/material/Typography"), 1);
 var import_Pagination = __toESM(require("@mui/material/Pagination"), 1);
 var import_PaginationItem2 = __toESM(require("@mui/material/PaginationItem"), 1);
 var import_x_data_grid = require("@mui/x-data-grid");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var TablePagination = () => {
   const apiRef = (0, import_x_data_grid.useGridApiContext)();
   const page = (0, import_x_data_grid.useGridSelector)(apiRef, import_x_data_grid.gridPageSelector);
@@ -6128,7 +6119,7 @@ var TablePagination = () => {
   const rowCount = (0, import_x_data_grid.useGridSelector)(apiRef, import_x_data_grid.gridRowCountSelector);
   const from = page * pageSize + 1;
   const to = Math.min((page + 1) * pageSize, rowCount);
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
     import_Stack.default,
     {
       direction: "row",
@@ -6137,14 +6128,14 @@ var TablePagination = () => {
       width: 1,
       p: 1.5,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
           import_Stack.default,
           {
             direction: { xs: "column", md: "row" },
             alignItems: { xs: "flex-start", md: "center" },
             spacing: 2,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                 import_Pagination.default,
                 {
                   size: "medium",
@@ -6156,17 +6147,17 @@ var TablePagination = () => {
                   showFirstButton: true,
                   showLastButton: true,
                   onChange: (_, value) => apiRef.current.setPage(value - 1),
-                  renderItem: (item) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_PaginationItem2.default, { ...item })
+                  renderItem: (item) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_PaginationItem2.default, { ...item })
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_Stack.default, { direction: "row", alignItems: "center", spacing: 1, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_Typography2.default, { variant: "body2", color: "text.secondary", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_Stack.default, { direction: "row", alignItems: "center", spacing: 1, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_Typography2.default, { variant: "body2", color: "text.secondary", children: [
                 pageSize,
                 " Items per page"
               ] }) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_Typography2.default, { variant: "body2", color: "text.secondary", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_Typography2.default, { variant: "body2", color: "text.secondary", children: [
           `${from} \u2013 ${to} of ${rowCount !== -1 ? rowCount : `more than ${to}`} items`,
           " "
         ] })
@@ -6176,10 +6167,10 @@ var TablePagination = () => {
 };
 
 // src/components/Table/Table.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var Table = (props) => {
   const { data, showToolbar = false, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_Box4.default, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_Box4.default, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     import_x_data_grid2.DataGrid,
     {
       rowHeight: 64,
@@ -6231,7 +6222,7 @@ var imageClasses = {
 };
 
 // src/components/Image/index.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
   const {
     src,
@@ -6330,7 +6321,7 @@ var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
   const showLoader = status === "idle" || status === "loading";
   const showError = status === "error";
   const loadingAttr = lazy ? "lazy" : imgLoading ?? "eager";
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
     import_Box5.default,
     {
       className: imageClasses.root.concat(className ? ` ${className}` : ""),
@@ -6345,7 +6336,7 @@ var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
       },
       ...rest,
       children: [
-        showLoader && (loadingIndicator ?? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        showLoader && (loadingIndicator ?? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_Skeleton.default,
           {
             animation: "wave",
@@ -6360,7 +6351,7 @@ var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
             }
           }
         )),
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_Box5.default,
           {
             ref: setRefs,
@@ -6389,7 +6380,7 @@ var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
             }
           }
         ),
-        withOverlay && !showError && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        withOverlay && !showError && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_Box5.default,
           {
             className: imageClasses.overlay,
@@ -6401,7 +6392,7 @@ var Image = (0, import_react12.forwardRef)(function Image2(props, ref) {
             children: overlay
           }
         ),
-        showError && (renderError ?? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        showError && (renderError ?? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_Box5.default,
           {
             className: imageClasses.overlay,
@@ -6434,9 +6425,9 @@ var import_FormHelperText = __toESM(require("@mui/material/FormHelperText"), 1);
 // src/components/Upload/components/Placeholder.tsx
 var import_Stack2 = __toESM(require("@mui/material/Stack"), 1);
 var import_Box6 = __toESM(require("@mui/material/Box"), 1);
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var UploadPlaceholder = ({ hasError, ...rest }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
     import_Box6.default,
     {
       sx: {
@@ -6447,7 +6438,7 @@ var UploadPlaceholder = ({ hasError, ...rest }) => {
       },
       ...rest,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
           Icon,
           {
             icon: "CloudUpload",
@@ -6458,10 +6449,10 @@ var UploadPlaceholder = ({ hasError, ...rest }) => {
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_Stack2.default, { spacing: 1, sx: { textAlign: "center", mt: 2 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_Box6.default, { sx: { typography: "h8" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_Stack2.default, { spacing: 1, sx: { textAlign: "center", mt: 2 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_Box6.default, { sx: { typography: "h8" }, children: [
             "Drag files here or",
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
               import_Box6.default,
               {
                 component: "span",
@@ -6474,7 +6465,7 @@ var UploadPlaceholder = ({ hasError, ...rest }) => {
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
             import_Box6.default,
             {
               sx: {
@@ -6529,12 +6520,12 @@ var fileData = (file) => {
 };
 
 // src/components/Upload/components/RejectionFiles.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var RejectionFiles = ({ files }) => {
   if (!files.length) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     import_Paper2.default,
     {
       variant: "outlined",
@@ -6549,13 +6540,13 @@ var RejectionFiles = ({ files }) => {
       },
       children: files.map(({ file, errors }) => {
         const { path, size } = fileData(file);
-        return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_Box7.default, { sx: { my: 1 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_Typography3.default, { variant: "subtitle2", noWrap: true, children: [
+        return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_Box7.default, { sx: { my: 1 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_Typography3.default, { variant: "subtitle2", noWrap: true, children: [
             path,
             " - ",
             size ? fData(size) : ""
           ] }),
-          errors.map((error2) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_Box7.default, { component: "span", sx: { typography: "caption" }, children: [
+          errors.map((error2) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_Box7.default, { component: "span", sx: { typography: "caption" }, children: [
             "- ",
             error2.message
           ] }, error2.code))
@@ -6568,9 +6559,9 @@ var RejectionFiles = ({ files }) => {
 // src/components/Upload/components/UploadProgress.tsx
 var import_Box8 = __toESM(require("@mui/material/Box"), 1);
 var import_CircularProgress2 = __toESM(require("@mui/material/CircularProgress"), 1);
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var UploadProgress = ({ progress: progress2 = 20 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
     import_Box8.default,
     {
       sx: {
@@ -6581,8 +6572,8 @@ var UploadProgress = ({ progress: progress2 = 20 }) => {
         height: "100%"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_Box8.default, { sx: { position: "relative", display: "inline-flex" }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_Box8.default, { sx: { position: "relative", display: "inline-flex" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
             import_CircularProgress2.default,
             {
               variant: "determinate",
@@ -6595,7 +6586,7 @@ var UploadProgress = ({ progress: progress2 = 20 }) => {
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
             import_CircularProgress2.default,
             {
               variant: "determinate",
@@ -6607,7 +6598,7 @@ var UploadProgress = ({ progress: progress2 = 20 }) => {
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
             import_Box8.default,
             {
               sx: {
@@ -6620,11 +6611,11 @@ var UploadProgress = ({ progress: progress2 = 20 }) => {
                 alignItems: "center",
                 justifyContent: "center"
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_Box8.default, { sx: { typography: "h6", color: "common.black" }, children: `${Math.round(progress2)}` })
+              children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_Box8.default, { sx: { typography: "h6", color: "common.black" }, children: `${Math.round(progress2)}` })
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_Box8.default, { sx: { mt: 2, typography: "h6" }, children: "Uploading" })
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_Box8.default, { sx: { mt: 2, typography: "h6" }, children: "Uploading" })
       ]
     }
   );
@@ -6638,11 +6629,11 @@ var import_IconButton3 = __toESM(require("@mui/material/IconButton"), 1);
 // src/components/Upload/components/SingleFilePreview.tsx
 var import_Box9 = __toESM(require("@mui/material/Box"), 1);
 var import_IconButton2 = __toESM(require("@mui/material/IconButton"), 1);
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var SingleFilePreview = ({ file }) => {
   const fileName = typeof file === "string" ? file : file.name;
   const previewUrl = typeof file === "string" ? file : URL.createObjectURL(file);
-  const renderImg = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  const renderImg = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_Box9.default,
     {
       component: "img",
@@ -6656,7 +6647,7 @@ var SingleFilePreview = ({ file }) => {
       }
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_Box9.default,
     {
       sx: {
@@ -6672,7 +6663,7 @@ var SingleFilePreview = ({ file }) => {
   );
 };
 var DeleteButton = ({ sx, ...rest }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_IconButton2.default,
     {
       size: "small",
@@ -6691,13 +6682,13 @@ var DeleteButton = ({ sx, ...rest }) => {
         ...sx
       },
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Icon, { icon: "XMark", sx: { width: 18, height: 18 } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { icon: "XMark", sx: { width: 18, height: 18 } })
     }
   );
 };
 
 // src/components/Upload/components/MultiFilePreview.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var MultiFilePreview = ({ files, onRemove }) => {
   const scrollRef = (0, import_react13.useRef)(null);
   const handleScroll = (direction) => {
@@ -6711,8 +6702,8 @@ var MultiFilePreview = ({ files, onRemove }) => {
     }
   };
   const showNavigation = files.length > 2;
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_Box10.default, { sx: { position: "relative", width: 1 }, children: [
-    showNavigation && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_Box10.default, { sx: { position: "relative", width: 1 }, children: [
+    showNavigation && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       import_IconButton3.default,
       {
         size: "small",
@@ -6729,10 +6720,10 @@ var MultiFilePreview = ({ files, onRemove }) => {
             bgcolor: (theme) => varAlpha(theme.vars.palette.common.whiteChannel, 1)
           }
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { icon: "NavArrowLeft", width: 20 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Icon, { icon: "NavArrowLeft", width: 20 })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       import_Box10.default,
       {
         ref: scrollRef,
@@ -6751,7 +6742,7 @@ var MultiFilePreview = ({ files, onRemove }) => {
         children: files.map((file, index) => {
           const fileName = typeof file === "string" ? file : file.name;
           const previewUrl = typeof file === "string" ? file : URL.createObjectURL(file);
-          return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
             import_Box10.default,
             {
               sx: {
@@ -6763,7 +6754,7 @@ var MultiFilePreview = ({ files, onRemove }) => {
                 flexShrink: 0
               },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                   import_Box10.default,
                   {
                     component: "img",
@@ -6777,7 +6768,7 @@ var MultiFilePreview = ({ files, onRemove }) => {
                     }
                   }
                 ),
-                onRemove && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+                onRemove && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                   DeleteButton,
                   {
                     onClick: (e) => {
@@ -6793,7 +6784,7 @@ var MultiFilePreview = ({ files, onRemove }) => {
         })
       }
     ),
-    showNavigation && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    showNavigation && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       import_IconButton3.default,
       {
         size: "small",
@@ -6810,14 +6801,14 @@ var MultiFilePreview = ({ files, onRemove }) => {
             bgcolor: (theme) => varAlpha(theme.vars.palette.common.whiteChannel, 1)
           }
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { icon: "NavArrowRight", width: 20 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Icon, { icon: "NavArrowRight", width: 20 })
       }
     )
   ] });
 };
 
 // src/components/Upload/Upload.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var Upload = ({
   sx,
   value,
@@ -6844,19 +6835,19 @@ var Upload = ({
   const hasError = isDragReject || !!error2;
   const renderContent = () => {
     if (isUploading) {
-      return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(UploadProgress, { progress: uploadProgress });
+      return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(UploadProgress, { progress: uploadProgress });
     }
     if (hasFile) {
-      return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SingleFilePreview, { file: value });
+      return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SingleFilePreview, { file: value });
     }
     if (hasFiles) {
-      return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(MultiFilePreview, { files: value, onRemove });
+      return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MultiFilePreview, { files: value, onRemove });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(UploadPlaceholder, { hasError });
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(UploadPlaceholder, { hasError });
   };
   const shouldShowDropzone = !hasFile && !hasFiles && !isUploading;
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_Box11.default, { sx: { width: 1, position: "relative", ...sx }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_Box11.default, { sx: { width: 1, position: "relative", ...sx }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
       import_Box11.default,
       {
         ...shouldShowDropzone ? getRootProps() : {},
@@ -6895,51 +6886,51 @@ var Upload = ({
           }
         },
         children: [
-          shouldShowDropzone && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("input", { ...getInputProps() }),
+          shouldShowDropzone && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("input", { ...getInputProps() }),
           renderContent()
         ]
       }
     ),
-    hasFile && !isUploading && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DeleteButton, { onClick: onDelete }),
-    hasFiles && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_Stack3.default, { direction: "row", spacing: 2, sx: { mt: 2 }, children: [
-      onRemoveAll && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+    hasFile && !isUploading && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DeleteButton, { onClick: onDelete }),
+    hasFiles && /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_Stack3.default, { direction: "row", spacing: 2, sx: { mt: 2 }, children: [
+      onRemoveAll && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
         import_Button3.default,
         {
           variant: "outlined",
           color: "inherit",
           size: "small",
           onClick: onRemoveAll,
-          startIcon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { icon: "Trash", sx: { width: 14, height: 14 } }),
+          startIcon: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { icon: "Trash", sx: { width: 14, height: 14 } }),
           children: "Remove all"
         }
       ),
-      onUpload && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      onUpload && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
         import_Button3.default,
         {
           variant: "contained",
           size: "small",
           onClick: onUpload,
-          startIcon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { icon: "CloudUpload", sx: { width: 14, height: 14 } }),
+          startIcon: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { icon: "CloudUpload", sx: { width: 14, height: 14 } }),
           children: "Upload files"
         }
       )
     ] }),
-    helperText && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_FormHelperText.default, { error: !!error2, sx: { color: "text.body", fontWeight: 500, mt: 1 }, children: helperText }),
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(RejectionFiles, { files: [...fileRejections] })
+    helperText && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_FormHelperText.default, { error: !!error2, sx: { color: "text.body", fontWeight: 500, mt: 1 }, children: helperText }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(RejectionFiles, { files: [...fileRejections] })
   ] });
 };
 
 // src/components/HookForm/Form.tsx
 var import_react_hook_form = require("react-hook-form");
 var import_Box12 = __toESM(require("@mui/material/Box"), 1);
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var Form = ({
   children,
   onSubmit,
   methods,
   ...rest
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react_hook_form.FormProvider, { ...methods, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_hook_form.FormProvider, { ...methods, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     import_Box12.default,
     {
       component: "form",
@@ -6968,7 +6959,7 @@ var import_FormLabel = __toESM(require("@mui/material/FormLabel"), 1);
 var import_FormControl = __toESM(require("@mui/material/FormControl"), 1);
 var import_FormHelperText2 = __toESM(require("@mui/material/FormHelperText"), 1);
 var import_FormControlLabel2 = __toESM(require("@mui/material/FormControlLabel"), 1);
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var RHFSwitch = ({
   name,
   description,
@@ -6980,16 +6971,16 @@ var RHFSwitch = ({
 }) => {
   const { control } = (0, import_react_hook_form2.useFormContext)();
   const baseAriaLabel = `Switch ${name}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     import_react_hook_form2.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_Box13.default, { sx: slotProps?.wrap, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_Box13.default, { sx: slotProps?.wrap, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           import_FormControlLabel2.default,
           {
-            control: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            control: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               import_Switch2.default,
               {
                 ...field,
@@ -7004,9 +6995,9 @@ var RHFSwitch = ({
                 }
               }
             ),
-            label: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_Stack4.default, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_Typography4.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: label }),
-              description && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_Typography4.default, { variant: "body2", color: "textBody", children: description })
+            label: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_Stack4.default, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_Typography4.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: label }),
+              description && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_Typography4.default, { variant: "body2", color: "textBody", children: description })
             ] }),
             sx: {
               alignItems: description ? "flex-start" : "center",
@@ -7015,7 +7006,7 @@ var RHFSwitch = ({
             ...other
           }
         ),
-        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           import_FormHelperText2.default,
           {
             error: !!error2,
@@ -7038,19 +7029,19 @@ var RHFMultiSwitch = ({
 }) => {
   const { control } = (0, import_react_hook_form2.useFormContext)();
   const getSelected = (currentValues, optionValue) => currentValues.includes(optionValue) ? currentValues.filter((value) => value !== optionValue) : [...currentValues, optionValue];
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     import_react_hook_form2.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
         import_FormControl.default,
         {
           component: "fieldset",
           sx: slotProps?.formControl?.sx,
           ...slotProps?.formControl,
           children: [
-            label && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            label && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               import_FormLabel.default,
               {
                 component: "legend",
@@ -7059,12 +7050,12 @@ var RHFMultiSwitch = ({
                 children: label
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_FormGroup.default, { ...other, children: options.map((option) => {
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_FormGroup.default, { ...other, children: options.map((option) => {
               const itemAriaLabel = option.label || `Option ${option.value}`;
-              return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 import_FormControlLabel2.default,
                 {
-                  control: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                  control: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                     import_Switch2.default,
                     {
                       checked: (field.value || []).includes(option.value),
@@ -7087,7 +7078,7 @@ var RHFMultiSwitch = ({
                 option.value
               );
             }) }),
-            (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_FormHelperText2.default, { error: !!error2, sx: { mx: 0 }, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
+            (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_FormHelperText2.default, { error: !!error2, sx: { mx: 0 }, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
           ]
         }
       )
@@ -7097,10 +7088,10 @@ var RHFMultiSwitch = ({
 
 // src/components/HookForm/RHFUpload.tsx
 var import_react_hook_form3 = require("react-hook-form");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var RHFUpload = ({ name, multiple, helperText, ...rest }) => {
   const { control, setValue } = (0, import_react_hook_form3.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     import_react_hook_form3.Controller,
     {
       name,
@@ -7128,7 +7119,7 @@ var RHFUpload = ({ name, multiple, helperText, ...rest }) => {
         const onRemoveAll = () => {
           setValue(name, [], { shouldValidate: true });
         };
-        return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
           Upload,
           {
             multiple,
@@ -7158,7 +7149,7 @@ var import_Box14 = __toESM(require("@mui/material/Box"), 1);
 var import_FormHelperText3 = __toESM(require("@mui/material/FormHelperText"), 1);
 var import_InputBase3 = require("@mui/material/InputBase");
 var import_TextField2 = __toESM(require("@mui/material/TextField"), 1);
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var OTPInput = (props) => {
   const { length = 6, onChange, onComplete, error: error2, helperText, containerProps, ...rest } = props;
   const theme = (0, import_styles37.useTheme)();
@@ -7226,19 +7217,18 @@ var OTPInput = (props) => {
       onComplete?.(newOtp.join(""));
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_Box14.default, { display: "flex", justifyContent: "center", ...containerProps, children: otp.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_Box14.default, { display: "flex", justifyContent: "center", ...containerProps, children: otp.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       import_Box14.default,
       {
         display: "flex",
         alignItems: "center",
         sx: {
-          width: "100%",
           "&:not(:last-of-type)": {
             mr: 1.5
           }
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           import_TextField2.default,
           {
             size: "medium",
@@ -7321,21 +7311,21 @@ var OTPInput = (props) => {
       },
       index
     )) }),
-    error2 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_FormHelperText3.default, { sx: { color: "error.main" }, children: helperText })
+    error2 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_FormHelperText3.default, { sx: { color: "error.main" }, children: helperText })
   ] });
 };
 var OTPInput_default = OTPInput;
 
 // src/components/HookForm/RHFOTPInput.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var RHFOTPInput = ({ name, length = 6, helperText, ...rest }) => {
   const { control, setValue } = (0, import_react_hook_form4.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     import_react_hook_form4.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         OTPInput_default,
         {
           length,
@@ -7355,16 +7345,16 @@ var import_react_hook_form5 = require("react-hook-form");
 var import_IconButton4 = __toESM(require("@mui/material/IconButton"), 1);
 var import_InputAdornment2 = __toESM(require("@mui/material/InputAdornment"), 1);
 var import_TextField3 = __toESM(require("@mui/material/TextField"), 1);
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var RHFTextField = ({ name, helperText, type, slotProps, ...rest }) => {
   const { control } = (0, import_react_hook_form5.useFormContext)();
   const passwordVisibility = useBoolean();
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     import_react_hook_form5.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
         import_TextField3.default,
         {
           ...field,
@@ -7385,7 +7375,7 @@ var RHFTextField = ({ name, helperText, type, slotProps, ...rest }) => {
             input: {
               ...slotProps?.input,
               ...type === "password" && {
-                endAdornment: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_InputAdornment2.default, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_IconButton4.default, { edge: "end", onClick: passwordVisibility.onToggle, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                endAdornment: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_InputAdornment2.default, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_IconButton4.default, { edge: "end", onClick: passwordVisibility.onToggle, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
                   Icon,
                   {
                     icon: passwordVisibility.value ? "EyeClosed" : "Eye",
@@ -7412,7 +7402,7 @@ var import_FormLabel2 = __toESM(require("@mui/material/FormLabel"), 1);
 var import_RadioGroup = __toESM(require("@mui/material/RadioGroup"), 1);
 var import_FormControl2 = __toESM(require("@mui/material/FormControl"), 1);
 var import_FormHelperText4 = __toESM(require("@mui/material/FormHelperText"), 1);
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var RHFRadioGroup = ({
   name,
   label,
@@ -7424,13 +7414,13 @@ var RHFRadioGroup = ({
   const { control } = (0, import_react_hook_form6.useFormContext)();
   const labelledby = `${name}-radio-buttons-group-label`;
   const ariaLabel = (val) => `Radio ${val}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     import_react_hook_form6.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_FormControl2.default, { component: "fieldset", sx: slotProps?.wrap, children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_FormControl2.default, { component: "fieldset", sx: slotProps?.wrap, children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           import_FormLabel2.default,
           {
             id: labelledby,
@@ -7440,11 +7430,11 @@ var RHFRadioGroup = ({
             children: label
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_RadioGroup.default, { ...field, "aria-labelledby": labelledby, ...other, children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_RadioGroup.default, { ...field, "aria-labelledby": labelledby, ...other, children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           import_FormControlLabel3.default,
           {
             value: option.value,
-            control: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+            control: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
               import_Radio2.default,
               {
                 ...slotProps?.radio,
@@ -7456,9 +7446,9 @@ var RHFRadioGroup = ({
                 }
               }
             ),
-            label: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_Stack5.default, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_Typography5.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: option.label }),
-              option?.description && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_Typography5.default, { variant: "body2", color: "textBody", children: option?.description })
+            label: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_Stack5.default, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_Typography5.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: option.label }),
+              option?.description && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_Typography5.default, { variant: "body2", color: "textBody", children: option?.description })
             ] }),
             sx: {
               alignItems: option?.description ? "flex-start" : "center"
@@ -7466,7 +7456,7 @@ var RHFRadioGroup = ({
           },
           option.value
         )) }),
-        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_FormHelperText4.default, { error: !!error2, sx: { mx: 0 }, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
+        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_FormHelperText4.default, { error: !!error2, sx: { mx: 0 }, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
       ] })
     }
   );
@@ -7476,7 +7466,7 @@ var RHFRadioGroup = ({
 var import_react_hook_form7 = require("react-hook-form");
 var import_TextField4 = __toESM(require("@mui/material/TextField"), 1);
 var import_Autocomplete4 = __toESM(require("@mui/material/Autocomplete"), 1);
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var RHFAutocomplete = ({
   name,
   label,
@@ -7487,12 +7477,12 @@ var RHFAutocomplete = ({
   ...other
 }) => {
   const { control, setValue } = (0, import_react_hook_form7.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     import_react_hook_form7.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
         import_Autocomplete4.default,
         {
           ...field,
@@ -7501,7 +7491,7 @@ var RHFAutocomplete = ({
             setValue(name, newValue, { shouldValidate: true });
             handleChange?.(newValue);
           },
-          renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+          renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
             import_TextField4.default,
             {
               label,
@@ -7530,7 +7520,7 @@ var import_FormLabel3 = __toESM(require("@mui/material/FormLabel"), 1);
 var import_FormControl3 = __toESM(require("@mui/material/FormControl"), 1);
 var import_FormHelperText5 = __toESM(require("@mui/material/FormHelperText"), 1);
 var import_FormControlLabel4 = __toESM(require("@mui/material/FormControlLabel"), 1);
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var RHFCheckbox = ({
   name,
   description,
@@ -7542,16 +7532,16 @@ var RHFCheckbox = ({
 }) => {
   const { control } = (0, import_react_hook_form8.useFormContext)();
   const baseAriaLabel = `Checkbox for ${name}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     import_react_hook_form8.Controller,
     {
       name,
       control,
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_Box15.default, { sx: slotProps?.wrap, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_Box15.default, { sx: slotProps?.wrap, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           import_FormControlLabel4.default,
           {
-            control: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+            control: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
               import_Checkbox3.default,
               {
                 ...field,
@@ -7566,9 +7556,9 @@ var RHFCheckbox = ({
                 }
               }
             ),
-            label: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_Stack6.default, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_Typography6.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: label }),
-              description && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_Typography6.default, { variant: "body2", color: "textBody", children: description })
+            label: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_Stack6.default, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_Typography6.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: label }),
+              description && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_Typography6.default, { variant: "body2", color: "textBody", children: description })
             ] }),
             sx: {
               alignItems: description ? "flex-start" : "center",
@@ -7577,7 +7567,7 @@ var RHFCheckbox = ({
             ...other
           }
         ),
-        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_FormHelperText5.default, { error: !!error2, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
+        (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_FormHelperText5.default, { error: !!error2, ...slotProps?.formHelperText, children: error2 ? error2?.message : helperText })
       ] })
     }
   );
@@ -7593,13 +7583,13 @@ var RHFMultiCheckbox = ({
 }) => {
   const { control } = (0, import_react_hook_form8.useFormContext)();
   const getSelected = (currentValues, optionValue) => currentValues.includes(optionValue) ? currentValues.filter((value) => value !== optionValue) : [...currentValues, optionValue];
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     import_react_hook_form8.Controller,
     {
       name,
       control,
       defaultValue: [],
-      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
+      render: ({ field, fieldState: { error: error2 } }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
         import_FormControl3.default,
         {
           component: "fieldset",
@@ -7607,7 +7597,7 @@ var RHFMultiCheckbox = ({
           sx: slotProps?.formControl?.sx,
           ...slotProps?.formControl,
           children: [
-            label && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+            label && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
               import_FormLabel3.default,
               {
                 component: "legend",
@@ -7616,12 +7606,12 @@ var RHFMultiCheckbox = ({
                 children: label
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_FormGroup2.default, { row, ...other, children: options.map((option) => {
+            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_FormGroup2.default, { row, ...other, children: options.map((option) => {
               const itemAriaLabel = option.label || `Option ${option.value}`;
-              return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
                 import_FormControlLabel4.default,
                 {
-                  control: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+                  control: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
                     import_Checkbox3.default,
                     {
                       checked: (field.value || []).includes(option.value),
@@ -7639,9 +7629,9 @@ var RHFMultiCheckbox = ({
                       }
                     }
                   ),
-                  label: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_Stack6.default, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_Typography6.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: option.label }),
-                    option?.description && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_Typography6.default, { variant: "body2", color: "textBody", children: option?.description })
+                  label: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_Stack6.default, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_Typography6.default, { variant: "bodyMd", color: "textHeader", fontWeight: 500, children: option.label }),
+                    option?.description && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_Typography6.default, { variant: "body2", color: "textBody", children: option?.description })
                   ] }),
                   sx: {
                     alignItems: option?.description ? "flex-start" : "center"
@@ -7650,7 +7640,7 @@ var RHFMultiCheckbox = ({
                 option.value
               );
             }) }),
-            (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+            (!!error2 || helperText) && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
               import_FormHelperText5.default,
               {
                 sx: { mx: 0, ...slotProps?.formHelperText?.sx },
@@ -7680,17 +7670,17 @@ var Field = {
 // src/components/CopyButton/index.tsx
 var import_Tooltip2 = __toESM(require("@mui/material/Tooltip"), 1);
 var import_IconButton5 = __toESM(require("@mui/material/IconButton"), 1);
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var CopyButton = ({ text: text2, size = "small" }) => {
   const { copy, isCopied } = useCopyToClipboard();
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_Tooltip2.default, { title: isCopied ? "Copied" : "Copy", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_Tooltip2.default, { title: isCopied ? "Copied" : "Copy", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     import_IconButton5.default,
     {
       size,
       onClick: () => copy(text2),
       "aria-label": "copy token",
       sx: { color: "icon.black" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { icon: isCopied ? "ClipboardCheck" : "Copy", sx: { width: 20, height: 20 } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Icon, { icon: isCopied ? "ClipboardCheck" : "Copy", sx: { width: 20, height: 20 } })
     }
   ) });
 };
@@ -7699,9 +7689,9 @@ var CopyButton = ({ text: text2, size = "small" }) => {
 var import_Portal = __toESM(require("@mui/material/Portal"), 1);
 var import_Box16 = __toESM(require("@mui/material/Box"), 1);
 var import_LinearProgress = __toESM(require("@mui/material/LinearProgress"), 1);
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var LoadingScreen = ({ portal, sx, ...rest }) => {
-  const content = /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
     import_Box16.default,
     {
       sx: {
@@ -7715,16 +7705,16 @@ var LoadingScreen = ({ portal, sx, ...rest }) => {
         ...sx
       },
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_LinearProgress.default, { color: "primary", sx: { width: 1, maxWidth: 360 } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_LinearProgress.default, { color: "primary", sx: { width: 1, maxWidth: 360 } })
     }
   );
   if (portal) {
-    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_Portal.default, { children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_Portal.default, { children: content });
   }
   return content;
 };
 var SplashScreen = ({ portal, sx, ...rest }) => {
-  const content = /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
     import_Box16.default,
     {
       sx: {
@@ -7741,11 +7731,11 @@ var SplashScreen = ({ portal, sx, ...rest }) => {
         ...sx
       },
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(AnimatedLogo, {})
+      children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(AnimatedLogo, {})
     }
   );
   if (portal) {
-    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_Portal.default, { children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_Portal.default, { children: content });
   }
   return content;
 };
@@ -7833,7 +7823,6 @@ var SplashScreen = ({ portal, sx, ...rest }) => {
   fShortenNumber,
   formatFullname,
   getCurrencySymbol,
-  getInitColorSchemeScript,
   getInitials,
   getStorage,
   grey,