@funkit/connect 1.4.0 → 1.4.2

package/dist/index.js

@@ -11,7 +11,7 @@ import {
 import "./chunk-I24HX4XM.js";
 
 // src/components/ConnectButton/ConnectButton.tsx
-import React148, { useContext as useContext30, useEffect as useEffect35, useState as useState45 } from "react";
+import React135, { useContext as useContext27, useEffect as useEffect34, useState as useState44 } from "react";
 
 // src/css/sprinkles.css.ts
 import { createMapValueFn as _51c72 } from "@vanilla-extract/sprinkles/createUtils";
@@ -130,13 +130,13 @@ import PrivyJS, {
   getUserEmbeddedWallet,
   LocalStorage
 } from "@privy-io/js-sdk-core";
-import React143, {
-  createContext as createContext19,
+import React130, {
+  createContext as createContext18,
   useCallback as useCallback31,
-  useContext as useContext26,
-  useEffect as useEffect31,
+  useContext as useContext23,
+  useEffect as useEffect30,
   useMemo as useMemo35,
-  useState as useState40
+  useState as useState39
 } from "react";
 import { useConfig as useConfig5, useConnect as useConnect2, useDisconnect as useDisconnect3 } from "wagmi";
 
@@ -192,7 +192,8 @@ import { datadogLogs } from "@datadog/browser-logs";
 var DDOG_CLIENT_TOKEN = "pub4f86c6be8c792cb48dc156a8c17d9a47";
 var FUN_DEV_API_KEYS = [
   "hnHevQR0y394nBprGrvNx4HgoZHUwMet5mXTOBhf",
-  "MYny3w7xJh6PRlRgkJ9604sHouY2MTke6lCPpSHq"
+  "MYny3w7xJh6PRlRgkJ9604sHouY2MTke6lCPpSHq",
+  "Z9SZaOwpmE40KX61mUKWm5hrpGh7WHVkaTvQJpQk"
 ];
 function setDdogEnv(environment) {
   datadogLogs.setGlobalContextProperty("env", environment);
@@ -367,7 +368,7 @@ var flagConfig = {
           {
             key: "apiKey",
             type: "isAnyOf",
-            values: ["hnHevQR0y394nBprGrvNx4HgoZHUwMet5mXTOBhf"]
+            values: ["Z9SZaOwpmE40KX61mUKWm5hrpGh7WHVkaTvQJpQk"]
           }
         ],
         value: true
@@ -1129,13 +1130,13 @@ var useFunkitConnectChainsById = () => groupChainsById(useFunkitConnectChains())
 var useInitialChainId = () => useContext3(FunkitConnectChainContext).initialChainId;
 
 // src/components/FunkitProvider/ModalContext.tsx
-import React142, {
-  createContext as createContext18,
+import React129, {
+  createContext as createContext17,
   useCallback as useCallback30,
-  useContext as useContext25,
-  useEffect as useEffect30,
+  useContext as useContext22,
+  useEffect as useEffect29,
   useMemo as useMemo34,
-  useState as useState39
+  useState as useState38
 } from "react";
 import { useAccount as useAccount11, useAccountEffect as useAccountEffect2, useConfig as useConfig4 } from "wagmi";
 
@@ -1888,7 +1889,7 @@ function GeneralWalletProvider({ children }) {
         userId: userInfo.id
       });
     }
-  }, [userInfo]);
+  }, [apiKey, userInfo]);
   const intervalRef = useRef2();
   const [isFetchingAssets, setIsFetchingAssets] = useState6(false);
   const [walletAssets, setWalletAssets] = useState6(null);
@@ -2183,12 +2184,6 @@ var useActivityTraversal = () => {
 // src/components/ProfileDetails/ProfileDetails.tsx
 import React107, { useCallback as useCallback24, useState as useState31 } from "react";
 
-// src/components/ConnectOptions/DesktopOptions.css.ts
-var QRCodeBackgroundClassName = "mu4zht0";
-var ScrollClassName = "mu4zht2 _1rsrm2fba _1rsrm2fbw";
-var sidebar = "mu4zht3";
-var sidebarCompactMode = "mu4zht4";
-
 // src/components/FunCheckoutHistoryModal/FunCheckoutHistoryContent.tsx
 import React91, { useCallback as useCallback22, useMemo as useMemo26, useState as useState26 } from "react";
 
@@ -2936,7 +2931,6 @@ function FunkitCheckoutProvider({ children }) {
     historyDepositAddress,
     isGuestUserOnCheckoutHistory,
     isUserLoggedIn,
-    walletAddress,
     userInfo
   ]);
   useEffect7(() => {
@@ -4207,7 +4201,7 @@ var ASSET_LOGO_SRCS = {
   WEETH: "https://assets.coingecko.com/coins/images/33033/large/weETH.png?1701438396",
   GMX: "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/arbitrum/assets/0xfc5A1A6EB076a2C7aD06eD22C90d7E710E35ad0a/logo.png",
   TYBG: "https://assets.coingecko.com/coins/images/34563/large/tybg.png?1705400778",
-  LUCK: "https://pbs.twimg.com/profile_images/1798811045005516800/6UGU4Mjm_400x400.jpg",
+  LUCK: "https://s3.us-west-2.amazonaws.com/sdk-cdn.fun.xyz/images/luck.jpg",
   WSTETH: "https://assets.coingecko.com/coins/images/18834/large/wstETH.png?1696518295",
   WETH: "https://www.cryptocompare.com/media/38553079/weth.png",
   MNT: "https://img.cryptorank.io/coins/mantle1681720399218.png",
@@ -4272,8 +4266,8 @@ function AsyncImage({
   width,
   testId
 }) {
-  const src7 = useAsyncImage(srcProp || fallbackSrc);
-  const isRemoteImage = src7 && /^http/.test(src7);
+  const src3 = useAsyncImage(srcProp || fallbackSrc);
+  const isRemoteImage = src3 && /^http/.test(src3);
   const [isRemoteImageLoaded, setRemoteImageLoaded] = useReducer2(
     () => true,
     false
@@ -4294,11 +4288,11 @@ function AsyncImage({
     width: typeof width === "string" ? width : void 0,
     testId
   }, /* @__PURE__ */ React26.createElement(Box, {
-    ...useAsImage ? { "aria-hidden": true, as: "img", src: src7 } : isRemoteImage ? {
+    ...useAsImage ? { "aria-hidden": true, as: "img", src: src3 } : isRemoteImage ? {
       "aria-hidden": true,
       as: "img",
       onLoad: setRemoteImageLoaded,
-      src: src7,
+      src: src3,
       onError: ({ currentTarget }) => {
         currentTarget.onerror = null;
         currentTarget.src = fallbackSrc;
@@ -4315,9 +4309,9 @@ function AsyncImage({
       ...!useAsImage ? isRemoteImage ? {
         opacity: isRemoteImageLoaded ? 1 : 0
       } : {
-        backgroundImage: src7 ? `url(${src7})` : void 0,
+        backgroundImage: src3 ? `url(${src3})` : void 0,
         backgroundRepeat: "no-repeat",
-        opacity: src7 ? 1 : 0
+        opacity: src3 ? 1 : 0
       } : {}
     },
     width: "full"
@@ -5845,16 +5839,6 @@ import React52, { useMemo as useMemo10 } from "react";
 
 // src/components/Icons/Info.tsx
 import React51 from "react";
-var InfoIcon = () => /* @__PURE__ */ React51.createElement("svg", {
-  fill: "none",
-  height: "12",
-  viewBox: "0 0 8 12",
-  width: "8",
-  xmlns: "http://www.w3.org/2000/svg"
-}, /* @__PURE__ */ React51.createElement("path", {
-  d: "M3.64258 7.99609C4.19336 7.99609 4.5625 7.73828 4.68555 7.24609C4.69141 7.21094 4.70312 7.16406 4.70898 7.13477C4.80859 6.60742 5.05469 6.35547 6.04492 5.76367C7.14648 5.10156 7.67969 4.3457 7.67969 3.24414C7.67969 1.39844 6.17383 0.255859 3.95898 0.255859C2.32422 0.255859 1.05859 0.894531 0.548828 1.86719C0.396484 2.14844 0.320312 2.44727 0.320312 2.74023C0.314453 3.37305 0.742188 3.79492 1.42188 3.79492C1.91406 3.79492 2.33594 3.54883 2.53516 3.11523C2.78711 2.47656 3.23242 2.21289 3.83594 2.21289C4.55664 2.21289 5.10742 2.65234 5.10742 3.29102C5.10742 3.9707 4.7793 4.29883 3.81836 4.87891C3.02148 5.36523 2.50586 5.92773 2.50586 6.76562V6.90039C2.50586 7.55664 2.96289 7.99609 3.64258 7.99609ZM3.67188 11.4473C4.42773 11.4473 5.04297 10.8672 5.04297 10.1406C5.04297 9.41406 4.42773 8.83984 3.67188 8.83984C2.91602 8.83984 2.30664 9.41406 2.30664 10.1406C2.30664 10.8672 2.91602 11.4473 3.67188 11.4473Z",
-  fill: "currentColor"
-}));
 var FunInfoIcon = () => /* @__PURE__ */ React51.createElement("svg", {
   width: "13",
   height: "14",
@@ -6744,6 +6728,11 @@ import React63 from "react";
 // src/components/QRCode/QRCode.tsx
 import QRCodeUtil from "qrcode";
 import React62, { useMemo as useMemo15 } from "react";
+
+// src/components/QRCode/QRCode.css.ts
+var QRCodeBackgroundClassName = "mthwt00";
+
+// src/components/QRCode/QRCode.tsx
 var generateMatrix = (value, errorCorrectionLevel) => {
   const arr = Array.prototype.slice.call(
     QRCodeUtil.create(value, { errorCorrectionLevel }).modules.data,
@@ -7942,7 +7931,7 @@ var Chain3 = ({
   switchChain,
   chainIconSize,
   isLoading,
-  src: src7,
+  src: src3,
   name,
   iconBackground,
   idx
@@ -11664,12 +11653,12 @@ function ProfileDetails({ onClose, onDisconnect }) {
     [onSelectActivity, view]
   );
   return /* @__PURE__ */ React107.createElement(Box, {
-    className: sidebarCompactMode,
     display: "flex",
     flexDirection: "column",
     marginTop: "16",
     paddingX: "20",
-    width: "full"
+    width: "full",
+    minWidth: "full"
   }, view === 0 /* HOME */ ? /* @__PURE__ */ React107.createElement(Home, {
     onClose,
     onChangeView: (newView) => setView(newView),
@@ -11842,11 +11831,11 @@ function ChainModal({ onClose, open }) {
 }
 
 // src/components/ConnectModal/ConnectModal.tsx
-import React139 from "react";
+import React126 from "react";
 import { useAccount as useAccount10, useDisconnect as useDisconnect2 } from "wagmi";
 
 // src/components/FunConnectOptions/FunConnectOptions.tsx
-import React137, { useCallback as useCallback28, useState as useState38 } from "react";
+import React123, { useCallback as useCallback28, useState as useState37 } from "react";
 
 // src/components/FunConnectOptions/FunConnectErrorStep.tsx
 import React111 from "react";
@@ -11896,7 +11885,7 @@ function isArc() {
 }
 function getBrowser() {
   var _a, _b;
-  if (typeof navigator === "undefined" || Object.keys(navigator).length === 0)
+  if (typeof navigator === "undefined")
     return "Browser" /* Browser */;
   const ua2 = (_a = navigator.userAgent) == null ? void 0 : _a.toLowerCase();
   if ((_b = navigator.brave) == null ? void 0 : _b.isBrave)
@@ -12931,10 +12920,10 @@ var FunWeb2ConnectingStep = (props) => {
 };
 
 // src/components/FunConnectOptions/FunWeb3ConnectingStep.tsx
-import React136 from "react";
+import React122 from "react";
 
-// src/components/ConnectOptions/ConnectDetails.tsx
-import React135, { useContext as useContext23, useEffect as useEffect29 } from "react";
+// src/components/FunConnectOptions/ConnectDetails.tsx
+import React121, { useEffect as useEffect28 } from "react";
 
 // src/hooks/useWindowSize.ts
 import { useEffect as useEffect27, useState as useState36 } from "react";
@@ -12973,33 +12962,6 @@ var useWindowSize = () => {
   return windowSize;
 };
 
-// src/utils/colors.ts
-var convertHexToRGBA = (hexCode, opacity = 1) => {
-  let hex = hexCode.replace("#", "");
-  if (hex.length === 3) {
-    hex = `${hex[0]}${hex[0]}${hex[1]}${hex[1]}${hex[2]}${hex[2]}`;
-  }
-  const r = parseInt(hex.substring(0, 2), 16);
-  const g = parseInt(hex.substring(2, 4), 16);
-  const b = parseInt(hex.substring(4, 6), 16);
-  if (opacity > 1 && opacity <= 100) {
-    opacity = opacity / 100;
-  }
-  return `rgba(${r},${g},${b},${opacity})`;
-};
-var getGradientRGBAs = (hexColor) => {
-  if (!hexColor)
-    return null;
-  return [
-    convertHexToRGBA(hexColor, 0.2),
-    convertHexToRGBA(hexColor, 0.14),
-    convertHexToRGBA(hexColor, 0.1)
-  ];
-};
-var isHexString = (color) => {
-  return /^#([0-9a-f]{3}){1,2}$/i.test(color);
-};
-
 // src/utils/platforms.ts
 import { UAParser } from "ua-parser-js";
 var ua = UAParser();
@@ -13025,117 +12987,28 @@ function getPlatform() {
   return "Desktop" /* Desktop */;
 }
 
-// src/components/Button/ActionButton.tsx
-import React120 from "react";
-var sizeVariants = {
-  large: {
-    fontSize: "16",
-    paddingX: "24",
-    paddingY: "10"
-  },
-  medium: {
-    fontSize: "14",
-    height: "28",
-    paddingX: "12",
-    paddingY: "4"
-  },
-  small: {
-    fontSize: "14",
-    paddingX: "10",
-    paddingY: "5"
-  }
-};
-function ActionButton({
-  disabled = false,
-  href,
-  label,
-  onClick,
-  rel = "noreferrer noopener",
-  size = "medium",
-  target = "_blank",
-  testId,
-  type = "primary"
-}) {
-  const isPrimary = type === "primary";
-  const isNotLarge = size !== "large";
-  const mobile = isMobile();
-  const background = !disabled ? isPrimary ? "accentColor" : isNotLarge ? "actionButtonSecondaryBackground" : null : "actionButtonSecondaryBackground";
-  const { fontSize, height, paddingX, paddingY } = sizeVariants[size];
-  const hasBorder = !mobile || !isNotLarge;
-  return /* @__PURE__ */ React120.createElement(Box, {
-    ...href ? !disabled ? { as: "a", href, rel, target } : {} : { as: "button", type: "button" },
-    onClick: !disabled ? onClick : void 0,
-    ...hasBorder ? {
-      borderColor: mobile && !isNotLarge && !isPrimary ? "actionButtonBorderMobile" : "actionButtonBorder",
-      borderStyle: "solid",
-      borderWidth: "1"
-    } : {},
-    borderRadius: "actionButton",
-    className: !disabled && touchableStyles({ active: "shrinkSm", hover: "grow" }),
-    display: "block",
-    paddingX,
-    paddingY,
-    style: { willChange: "transform" },
-    testId,
-    textAlign: "center",
-    transition: "transform",
-    ...background ? { background } : {},
-    ...height ? { height } : {}
-  }, /* @__PURE__ */ React120.createElement(Text, {
-    color: !disabled ? isPrimary ? "accentColorForeground" : "accentColor" : "modalTextSecondary",
-    size: fontSize,
-    weight: "bold"
-  }, label));
-}
-
-// src/components/Icons/Connect.tsx
-import React121 from "react";
-var src = async () => (await import("./connect-XNDTNVUH.js")).default;
-var preloadConnectIcon = () => loadImages(src);
-var ConnectIcon = () => /* @__PURE__ */ React121.createElement(AsyncImage, {
-  background: "#515a70",
-  borderColor: "generalBorder",
-  borderRadius: "10",
-  height: "48",
-  src,
-  width: "48"
-});
-
-// src/components/Icons/Create.tsx
-import React122 from "react";
-var src2 = async () => (await import("./create-PAJXJDV3.js")).default;
-var preloadCreateIcon = () => loadImages(src2);
-var CreateIcon = () => /* @__PURE__ */ React122.createElement(AsyncImage, {
-  background: "#e3a5e8",
-  borderColor: "generalBorder",
-  borderRadius: "10",
-  height: "48",
-  src: src2,
-  width: "48"
-});
-
 // src/components/Icons/LinkIcon.tsx
-import React123 from "react";
+import React120 from "react";
 var LinkIcon = () => {
-  return /* @__PURE__ */ React123.createElement("svg", {
+  return /* @__PURE__ */ React120.createElement("svg", {
     width: "21",
     height: "11",
     viewBox: "0 0 21 11",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
-  }, /* @__PURE__ */ React123.createElement("path", {
+  }, /* @__PURE__ */ React120.createElement("path", {
     d: "M7.375 1.33325H5.29167C3.32748 1.33325 2.34539 1.33325 1.73519 1.94345C1.125 2.55365 1.125 3.53575 1.125 5.49992C1.125 7.46409 1.125 8.44617 1.7352 9.05638C2.34539 9.66658 3.32748 9.66658 5.29167 9.66658H7.375",
     stroke: "currentColor",
     strokeWidth: "2.08333",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React123.createElement("path", {
+  }), /* @__PURE__ */ React120.createElement("path", {
     d: "M13.625 9.66658H15.7083C17.6725 9.66658 18.6546 9.66658 19.2648 9.05638C19.875 8.44617 19.875 7.46409 19.875 5.49992C19.875 3.53575 19.875 2.55364 19.2648 1.94344C18.6546 1.33325 17.6725 1.33325 15.7083 1.33325H13.625",
     stroke: "currentColor",
     strokeWidth: "2.08333",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React123.createElement("path", {
+  }), /* @__PURE__ */ React120.createElement("path", {
     d: "M6.3335 5.5H14.6668",
     stroke: "currentColor",
     strokeWidth: "2.08333",
@@ -13144,1436 +13017,178 @@ var LinkIcon = () => {
   }));
 };
 
-// src/components/Icons/Refresh.tsx
-import React124 from "react";
-var src3 = async () => (await import("./refresh-5KGGHTJP.js")).default;
-var preloadRefreshIcon = () => loadImages(src3);
-var RefreshIcon = () => /* @__PURE__ */ React124.createElement(AsyncImage, {
-  background: "#515a70",
-  borderColor: "generalBorder",
-  borderRadius: "10",
-  height: "48",
-  src: src3,
-  width: "48"
-});
-
-// src/components/Icons/Scan.tsx
-import React125 from "react";
-var src4 = async () => (await import("./scan-HZBLXLM4.js")).default;
-var preloadScanIcon = () => loadImages(src4);
-var ScanIcon = () => /* @__PURE__ */ React125.createElement(AsyncImage, {
-  background: "#515a70",
-  borderColor: "generalBorder",
-  borderRadius: "10",
-  height: "48",
-  src: src4,
-  width: "48"
-});
-
-// src/components/ConnectOptions/DesktopOptions.tsx
-import React134, { Fragment as Fragment4, useContext as useContext22, useEffect as useEffect28, useRef as useRef10, useState as useState37 } from "react";
-
-// src/components/ConnectModal/ConnectModalIntro.tsx
-import React131, { useContext as useContext21 } from "react";
-
-// src/components/Disclaimer/DisclaimerLink.tsx
-import React126 from "react";
-var DisclaimerLink = ({
-  children,
-  href
-}) => {
-  return /* @__PURE__ */ React126.createElement(Box, {
-    as: "a",
-    color: "accentColor",
-    href,
-    rel: "noreferrer",
-    target: "_blank"
-  }, children);
-};
-
-// src/components/Disclaimer/DisclaimerText.tsx
-import React127 from "react";
-var DisclaimerText = ({ children }) => {
-  return /* @__PURE__ */ React127.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "12",
-    weight: "medium"
-  }, children);
+// src/components/FunConnectOptions/ConnectDetails.tsx
+var getBrowserSrc = async () => {
+  const browser = getBrowser();
+  switch (browser) {
+    case "Arc" /* Arc */:
+      return (await import("./Arc-QDJFTGH2.js")).default;
+    case "Brave" /* Brave */:
+      return (await import("./Brave-YATE5BIM.js")).default;
+    case "Chrome" /* Chrome */:
+      return (await import("./Chrome-LGF33C3S.js")).default;
+    case "Edge" /* Edge */:
+      return (await import("./Edge-K2JEGI5S.js")).default;
+    case "Firefox" /* Firefox */:
+      return (await import("./Firefox-NP5SYEK5.js")).default;
+    case "Opera" /* Opera */:
+      return (await import("./Opera-KV54PXPA.js")).default;
+    case "Safari" /* Safari */:
+      return (await import("./Safari-2QIYKJ4P.js")).default;
+    default:
+      return (await import("./Browser-HN7O5MN7.js")).default;
+  }
 };
-
-// src/components/FunkitProvider/AppContext.ts
-import { createContext as createContext17 } from "react";
-var defaultAppInfo = {
-  appName: void 0,
-  disclaimer: void 0,
-  learnMoreUrl: "https://learn.rainbow.me/understanding-web3?utm_source=rainbowkit&utm_campaign=learnmore"
+var preloadBrowserIcon = () => loadImages(getBrowserSrc);
+var getPlatformSrc = async () => {
+  const platform = getPlatform();
+  switch (platform) {
+    case "Windows" /* Windows */:
+      return (await import("./Windows-R3CKAIUV.js")).default;
+    case "macOS" /* MacOS */:
+      return (await import("./Macos-2KTZ2XLP.js")).default;
+    case "Linux" /* Linux */:
+      return (await import("./Linux-NS2LQPT4.js")).default;
+    default:
+      return (await import("./Linux-NS2LQPT4.js")).default;
+  }
 };
-var AppContext = createContext17(defaultAppInfo);
-
-// src/components/Icons/Assets.tsx
-import React129 from "react";
-var src5 = async () => (await import("./assets-26YY4GVD.js")).default;
-var preloadAssetsIcon = () => loadImages(src5);
-var AssetsIcon = () => /* @__PURE__ */ React129.createElement(AsyncImage, {
-  background: "#d0d5de",
-  borderRadius: "10",
-  height: "48",
-  src: src5,
-  width: "48"
-});
-
-// src/components/Icons/Login.tsx
-import React130 from "react";
-var src6 = async () => (await import("./login-ZSMM5UYL.js")).default;
-var preloadLoginIcon = () => loadImages(src6);
-var LoginIcon = () => /* @__PURE__ */ React130.createElement(AsyncImage, {
-  background: "#d0d5de",
-  borderRadius: "10",
-  height: "48",
-  src: src6,
-  width: "48"
-});
-
-// src/components/ConnectModal/ConnectModalIntro.tsx
-function ConnectModalIntro({
-  compactModeEnabled = false,
-  getWallet
-}) {
-  const { disclaimer: Disclaimer, learnMoreUrl } = useContext21(AppContext);
-  const { i18n: i18n2 } = useContext21(I18nContext);
-  return /* @__PURE__ */ React131.createElement(React131.Fragment, null, /* @__PURE__ */ React131.createElement(Box, {
+var preloadPlatformIcon = () => loadImages(getPlatformSrc);
+function LinkItem() {
+  return /* @__PURE__ */ React121.createElement(Box, {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: "full"
+  }, /* @__PURE__ */ React121.createElement(Box, {
+    style: { flex: 1 }
+  }, /* @__PURE__ */ React121.createElement(FunDivider, null)), /* @__PURE__ */ React121.createElement(Box, {
+    display: "flex",
     alignItems: "center",
+    justifyContent: "center",
     color: "accentColor",
+    background: "modalBorder",
+    padding: "8",
+    borderRadius: "13"
+  }, /* @__PURE__ */ React121.createElement(LinkIcon, null)), /* @__PURE__ */ React121.createElement(Box, {
+    style: { flex: 1 }
+  }, /* @__PURE__ */ React121.createElement(FunDivider, null)));
+}
+function ConnectDetail({
+  compactModeEnabled,
+  qrCodeUri,
+  wallet
+}) {
+  const {
+    downloadUrls,
+    iconBackground,
+    iconUrl,
+    name,
+    qrCode,
+    ready,
+    getDesktopUri
+  } = wallet;
+  const safari = isSafari();
+  const funkitConfig = useFunkitConfig();
+  const appConfig = {
+    name: funkitConfig.appName,
+    logoSrc: funkitConfig.appLogoSrc,
+    logoBackground: funkitConfig.appLogoBackgroundColor
+  };
+  const hasExtension = !!wallet.extensionDownloadUrl;
+  const hasQrCode = qrCode && qrCodeUri;
+  const { width: windowWidth } = useWindowSize();
+  const smallWindow = windowWidth && windowWidth < 768;
+  useEffect28(() => {
+    preloadBrowserIcon();
+    preloadPlatformIcon();
+  }, []);
+  return /* @__PURE__ */ React121.createElement(Box, {
     display: "flex",
     flexDirection: "column",
     height: "full",
-    justifyContent: "space-around"
-  }, /* @__PURE__ */ React131.createElement(Box, {
-    marginBottom: "10"
-  }, !compactModeEnabled && /* @__PURE__ */ React131.createElement(Text, {
-    color: "modalText",
-    size: "18",
-    weight: "heavy"
-  }, i18n2.t("intro.title"))), /* @__PURE__ */ React131.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "32",
-    justifyContent: "center",
-    marginY: "20",
-    style: { maxWidth: 312 }
-  }, /* @__PURE__ */ React131.createElement(Box, {
+    width: "full"
+  }, hasQrCode ? /* @__PURE__ */ React121.createElement(Box, {
     alignItems: "center",
     display: "flex",
-    flexDirection: "row",
-    gap: "16"
-  }, /* @__PURE__ */ React131.createElement(Box, {
-    borderRadius: "6",
-    height: "48",
-    minWidth: "48",
-    width: "48"
-  }, /* @__PURE__ */ React131.createElement(AssetsIcon, null)), /* @__PURE__ */ React131.createElement(Box, {
+    height: "full",
+    justifyContent: "center",
+    flexDirection: "column"
+  }, /* @__PURE__ */ React121.createElement(QRCode, {
+    logoBackground: iconBackground,
+    logoSize: compactModeEnabled ? 60 : 72,
+    logoUrl: iconUrl,
+    size: compactModeEnabled ? 318 : smallWindow ? Math.max(280, Math.min(windowWidth - 308, 382)) : 382,
+    uri: qrCodeUri
+  }), /* @__PURE__ */ React121.createElement(Box, {
     display: "flex",
-    flexDirection: "column",
-    gap: "4"
-  }, /* @__PURE__ */ React131.createElement(Text, {
+    alignItems: "center",
+    justifyContent: "center",
+    paddingTop: "20"
+  }, /* @__PURE__ */ React121.createElement(Text, {
+    weight: "medium",
     color: "modalText",
     size: "14",
-    weight: "bold"
-  }, i18n2.t("intro.digital_asset.title")), /* @__PURE__ */ React131.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "medium"
-  }, i18n2.t("intro.digital_asset.description")))), /* @__PURE__ */ React131.createElement(Box, {
+    style: { paddingRight: 8 }
+  }, "Copy Link"), /* @__PURE__ */ React121.createElement(CopyAddress, {
+    address: qrCodeUri,
+    type: "button"
+  }))) : /* @__PURE__ */ React121.createElement(Box, {
     alignItems: "center",
     display: "flex",
-    flexDirection: "row",
-    gap: "16"
-  }, /* @__PURE__ */ React131.createElement(Box, {
-    borderRadius: "6",
-    height: "48",
-    minWidth: "48",
-    width: "48"
-  }, /* @__PURE__ */ React131.createElement(LoginIcon, null)), /* @__PURE__ */ React131.createElement(Box, {
+    justifyContent: "center",
+    style: { flexGrow: 1 }
+  }, /* @__PURE__ */ React121.createElement(Box, {
+    alignItems: "center",
     display: "flex",
     flexDirection: "column",
-    gap: "4"
-  }, /* @__PURE__ */ React131.createElement(Text, {
-    color: "modalText",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("intro.login.title")), /* @__PURE__ */ React131.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "medium"
-  }, i18n2.t("intro.login.description"))))), /* @__PURE__ */ React131.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "12",
-    justifyContent: "center",
-    margin: "10"
-  }, /* @__PURE__ */ React131.createElement(ActionButton, {
-    label: i18n2.t("intro.get.label"),
-    onClick: getWallet
-  }), /* @__PURE__ */ React131.createElement(Box, {
-    as: "a",
-    className: touchableStyles({ active: "shrink", hover: "grow" }),
-    display: "block",
-    href: learnMoreUrl,
-    paddingX: "12",
-    paddingY: "4",
-    rel: "noreferrer",
-    style: { willChange: "transform" },
-    target: "_blank",
-    transition: "default"
-  }, /* @__PURE__ */ React131.createElement(Text, {
-    color: "accentColor",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("intro.learn_more.label")))), Disclaimer && !compactModeEnabled && /* @__PURE__ */ React131.createElement(Box, {
-    marginBottom: "8",
-    marginTop: "12",
-    textAlign: "center"
-  }, /* @__PURE__ */ React131.createElement(Disclaimer, {
-    Link: DisclaimerLink,
-    Text: DisclaimerText
-  }))));
-}
-
-// src/components/Icons/Back.tsx
-import React132 from "react";
-var BackIcon = () => /* @__PURE__ */ React132.createElement("svg", {
-  fill: "none",
-  height: "17",
-  viewBox: "0 0 11 17",
-  width: "11",
-  xmlns: "http://www.w3.org/2000/svg"
-}, /* @__PURE__ */ React132.createElement("path", {
-  d: "M0.99707 8.6543C0.99707 9.08496 1.15527 9.44531 1.51562 9.79688L8.16016 16.3096C8.43262 16.5732 8.74902 16.7051 9.13574 16.7051C9.90918 16.7051 10.5508 16.0811 10.5508 15.3076C10.5508 14.9121 10.3838 14.5605 10.0938 14.2705L4.30176 8.64551L10.0938 3.0293C10.3838 2.74805 10.5508 2.3877 10.5508 2.00098C10.5508 1.23633 9.90918 0.603516 9.13574 0.603516C8.74902 0.603516 8.43262 0.735352 8.16016 0.999023L1.51562 7.51172C1.15527 7.85449 1.00586 8.21484 0.99707 8.6543Z",
-  fill: "currentColor"
-}));
-
-// src/components/InfoButton/InfoButton.tsx
-import React133 from "react";
-var InfoButton = ({
-  "aria-label": ariaLabel = "Info",
-  onClick
-}) => {
-  const mobile = isMobile();
-  return /* @__PURE__ */ React133.createElement(Box, {
-    alignItems: "center",
-    "aria-label": ariaLabel,
-    as: "button",
-    background: "closeButtonBackground",
-    borderColor: "actionButtonBorder",
-    borderRadius: "full",
-    borderStyle: "solid",
-    borderWidth: mobile ? "0" : "1",
-    className: touchableStyles({ active: "shrinkSm", hover: "growLg" }),
-    color: "closeButton",
-    display: "flex",
-    height: mobile ? "30" : "28",
-    justifyContent: "center",
-    onClick,
-    style: { willChange: "transform" },
-    transition: "default",
-    type: "button",
-    width: mobile ? "30" : "28"
-  }, /* @__PURE__ */ React133.createElement(InfoIcon, null));
-};
-
-// src/components/ConnectOptions/DesktopOptions.tsx
-function DesktopOptions({ onClose }) {
-  const titleId = "rk_connect_title";
-  const [selectedOptionId, setSelectedOptionId] = useState37();
-  const [selectedWallet, setSelectedWallet] = useState37();
-  const [qrCodeUri, setQrCodeUri] = useState37();
-  const hasQrCode = !!(selectedWallet == null ? void 0 : selectedWallet.qrCode) && qrCodeUri;
-  const [connectionError, setConnectionError] = useState37(false);
-  const modalSize = useContext22(ModalSizeContext);
-  const compactModeEnabled = modalSize === ModalSizeOptions.COMPACT;
-  const { disclaimer: Disclaimer } = useContext22(AppContext);
-  const { i18n: i18n2 } = useContext22(I18nContext);
-  const safari = isSafari();
-  const initialized = useRef10(false);
-  const { connector } = useContext22(WalletButtonContext);
-  const mergeEIP6963WithRkConnectors = !connector;
-  const wallets = useWalletConnectors(mergeEIP6963WithRkConnectors).filter((wallet) => wallet.ready || !!wallet.extensionDownloadUrl).sort((a, b) => a.groupIndex - b.groupIndex);
-  const groupedWallets = groupBy(wallets, (wallet) => wallet.groupName);
-  const supportedI18nGroupNames = [
-    "Recommended",
-    "Other",
-    "Popular",
-    "More",
-    "Others",
-    "Installed"
-  ];
-  useEffect28(() => {
-    if (connector && !initialized.current) {
-      changeWalletStep("CONNECT" /* Connect */);
-      selectWallet(connector);
-      initialized.current = true;
-    }
-  }, [connector]);
-  const connectToWallet = (wallet) => {
-    var _a, _b;
-    setConnectionError(false);
-    if (wallet.ready) {
-      (_b = (_a = wallet == null ? void 0 : wallet.connect) == null ? void 0 : _a.call(wallet)) == null ? void 0 : _b.catch(() => {
-        setConnectionError(true);
-      });
-    }
-  };
-  const onDesktopUri = async (wallet) => {
-    const sWallet = wallets.find((w) => wallet.id === w.id);
-    if (!(sWallet == null ? void 0 : sWallet.getDesktopUri))
-      return;
-    setTimeout(async () => {
-      var _a;
-      const uri = await ((_a = sWallet == null ? void 0 : sWallet.getDesktopUri) == null ? void 0 : _a.call(sWallet));
-      if (uri)
-        window.open(uri, safari ? "_blank" : "_self");
-    }, 0);
-  };
-  const onQrCode = async (wallet) => {
-    var _a;
-    const sWallet = wallets.find((w) => wallet.id === w.id);
-    const uri = await ((_a = sWallet == null ? void 0 : sWallet.getQrCodeUri) == null ? void 0 : _a.call(sWallet));
-    setQrCodeUri(uri);
-    setTimeout(
-      () => {
-        setSelectedWallet(sWallet);
-        changeWalletStep("CONNECT" /* Connect */);
-      },
-      uri ? 0 : 50
-    );
-  };
-  const selectWallet = async (wallet) => {
-    addLatestWalletId(wallet.id);
-    if (wallet.ready) {
-      onQrCode(wallet);
-      onDesktopUri(wallet);
-    }
-    connectToWallet(wallet);
-    setSelectedOptionId(wallet.id);
-    if (!wallet.ready) {
-      setSelectedWallet(wallet);
-      changeWalletStep(
-        (wallet == null ? void 0 : wallet.extensionDownloadUrl) ? "DOWNLOAD_OPTIONS" /* DownloadOptions */ : "CONNECT" /* Connect */
-      );
-    }
-  };
-  const getWalletDownload = (id) => {
-    var _a;
-    setSelectedOptionId(id);
-    const sWallet = wallets.find((w) => id === w.id);
-    const isMobile2 = (_a = sWallet == null ? void 0 : sWallet.downloadUrls) == null ? void 0 : _a.qrCode;
-    const isDesktop = !!(sWallet == null ? void 0 : sWallet.desktopDownloadUrl);
-    const isExtension = !!(sWallet == null ? void 0 : sWallet.extensionDownloadUrl);
-    setSelectedWallet(sWallet);
-    if (isMobile2 && (isExtension || isDesktop)) {
-      changeWalletStep("DOWNLOAD_OPTIONS" /* DownloadOptions */);
-    } else if (isMobile2) {
-      changeWalletStep("DOWNLOAD" /* Download */);
-    } else if (isDesktop) {
-      changeWalletStep("INSTRUCTIONS_DESKTOP" /* InstructionsDesktop */);
-    } else {
-      changeWalletStep("INSTRUCTIONS_EXTENSION" /* InstructionsExtension */);
-    }
-  };
-  const clearSelectedWallet = () => {
-    setSelectedOptionId(void 0);
-    setSelectedWallet(void 0);
-    setQrCodeUri(void 0);
-  };
-  const changeWalletStep = (newWalletStep, isBack = false) => {
-    if (isBack && newWalletStep === "GET" /* Get */ && initialWalletStep === "GET" /* Get */) {
-      clearSelectedWallet();
-    } else if (!isBack && newWalletStep === "GET" /* Get */) {
-      setInitialWalletStep("GET" /* Get */);
-    } else if (!isBack && newWalletStep === "CONNECT" /* Connect */) {
-      setInitialWalletStep("CONNECT" /* Connect */);
-    }
-    setWalletStep(newWalletStep);
-  };
-  const [initialWalletStep, setInitialWalletStep] = useState37(
-    "NONE" /* None */
-  );
-  const [walletStep, setWalletStep] = useState37("NONE" /* None */);
-  let walletContent = null;
-  let headerLabel = null;
-  let headerBackButtonLink = null;
-  let headerBackButtonCallback;
-  useEffect28(() => {
-    setConnectionError(false);
-  }, [walletStep, selectedWallet]);
-  const hasExtension = !!(selectedWallet == null ? void 0 : selectedWallet.extensionDownloadUrl);
-  const hasExtensionAndMobile = !!(hasExtension && (selectedWallet == null ? void 0 : selectedWallet.mobileDownloadUrl));
-  switch (walletStep) {
-    case "NONE" /* None */:
-      walletContent = /* @__PURE__ */ React134.createElement(ConnectModalIntro, {
-        getWallet: () => changeWalletStep("GET" /* Get */)
-      });
-      break;
-    case "LEARN_COMPACT" /* LearnCompact */:
-      walletContent = /* @__PURE__ */ React134.createElement(ConnectModalIntro, {
-        compactModeEnabled,
-        getWallet: () => changeWalletStep("GET" /* Get */)
-      });
-      headerLabel = i18n2.t("intro.title");
-      headerBackButtonLink = "NONE" /* None */;
-      break;
-    case "GET" /* Get */:
-      walletContent = /* @__PURE__ */ React134.createElement(GetDetail, {
-        getWalletDownload,
-        compactModeEnabled
-      });
-      headerLabel = i18n2.t("get.title");
-      headerBackButtonLink = compactModeEnabled ? "LEARN_COMPACT" /* LearnCompact */ : "NONE" /* None */;
-      break;
-    case "CONNECT" /* Connect */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(ConnectDetail, {
-        changeWalletStep,
-        compactModeEnabled,
-        connectionError,
-        onClose,
-        qrCodeUri,
-        reconnect: connectToWallet,
-        wallet: selectedWallet
-      });
-      headerLabel = hasQrCode && (selectedWallet.name === "WalletConnect" ? i18n2.t("connect_scan.fallback_title") : i18n2.t("connect_scan.title", {
-        wallet: selectedWallet.name
-      }));
-      headerBackButtonLink = compactModeEnabled ? connector ? null : "NONE" /* None */ : null;
-      headerBackButtonCallback = compactModeEnabled ? !connector ? clearSelectedWallet : () => void 0 : () => void 0;
-      break;
-    case "DOWNLOAD_OPTIONS" /* DownloadOptions */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(DownloadOptionsDetail, {
-        changeWalletStep,
-        wallet: selectedWallet
-      });
-      headerLabel = selectedWallet && i18n2.t("get_options.short_title", { wallet: selectedWallet.name });
-      headerBackButtonLink = connector ? "CONNECT" /* Connect */ : compactModeEnabled ? "NONE" /* None */ : null;
-      break;
-    case "DOWNLOAD" /* Download */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(DownloadDetail, {
-        changeWalletStep,
-        wallet: selectedWallet
-      });
-      headerLabel = selectedWallet && i18n2.t("get_mobile.title", { wallet: selectedWallet.name });
-      headerBackButtonLink = hasExtensionAndMobile ? "DOWNLOAD_OPTIONS" /* DownloadOptions */ : initialWalletStep;
-      break;
-    case "INSTRUCTIONS_MOBILE" /* InstructionsMobile */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(InstructionMobileDetail, {
-        connectWallet: selectWallet,
-        wallet: selectedWallet
-      });
-      headerLabel = selectedWallet && i18n2.t("get_options.title", {
-        wallet: compactModeEnabled ? selectedWallet.shortName || selectedWallet.name : selectedWallet.name
-      });
-      headerBackButtonLink = "DOWNLOAD" /* Download */;
-      break;
-    case "INSTRUCTIONS_EXTENSION" /* InstructionsExtension */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(InstructionExtensionDetail, {
-        wallet: selectedWallet
-      });
-      headerLabel = selectedWallet && i18n2.t("get_options.title", {
-        wallet: compactModeEnabled ? selectedWallet.shortName || selectedWallet.name : selectedWallet.name
-      });
-      headerBackButtonLink = "DOWNLOAD_OPTIONS" /* DownloadOptions */;
-      break;
-    case "INSTRUCTIONS_DESKTOP" /* InstructionsDesktop */:
-      walletContent = selectedWallet && /* @__PURE__ */ React134.createElement(InstructionDesktopDetail, {
-        connectWallet: selectWallet,
-        wallet: selectedWallet
-      });
-      headerLabel = selectedWallet && i18n2.t("get_options.title", {
-        wallet: compactModeEnabled ? selectedWallet.shortName || selectedWallet.name : selectedWallet.name
-      });
-      headerBackButtonLink = "DOWNLOAD_OPTIONS" /* DownloadOptions */;
-      break;
-    default:
-      break;
-  }
-  return /* @__PURE__ */ React134.createElement(Box, {
-    display: "flex",
-    flexDirection: "row",
-    style: { maxHeight: compactModeEnabled ? 468 : 504 }
-  }, (compactModeEnabled ? walletStep === "NONE" /* None */ : true) && /* @__PURE__ */ React134.createElement(Box, {
-    className: compactModeEnabled ? sidebarCompactMode : sidebar,
-    display: "flex",
-    flexDirection: "column",
-    marginTop: "16"
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    display: "flex",
-    justifyContent: "space-between"
-  }, compactModeEnabled && Disclaimer && /* @__PURE__ */ React134.createElement(Box, {
-    marginLeft: "16",
-    width: "28"
-  }, /* @__PURE__ */ React134.createElement(InfoButton, {
-    onClick: () => changeWalletStep("LEARN_COMPACT" /* LearnCompact */)
-  })), compactModeEnabled && !Disclaimer && /* @__PURE__ */ React134.createElement(Box, {
-    marginLeft: "16",
-    width: "28"
-  }), /* @__PURE__ */ React134.createElement(Box, {
-    marginLeft: compactModeEnabled ? "0" : "6",
-    paddingBottom: "8",
-    paddingTop: "2",
-    paddingX: "18"
-  }, /* @__PURE__ */ React134.createElement(Text, {
-    as: "h1",
-    color: "modalText",
-    id: titleId,
-    size: "18",
-    weight: "heavy",
-    testId: "connect-header-label"
-  }, i18n2.t("connect.title"))), compactModeEnabled && /* @__PURE__ */ React134.createElement(Box, {
-    marginRight: "16"
-  }, /* @__PURE__ */ React134.createElement(CloseButton, {
-    onClose
-  }))), /* @__PURE__ */ React134.createElement(Box, {
-    className: ScrollClassName,
-    paddingBottom: "18"
-  }, Object.entries(groupedWallets).map(
-    ([groupName, wallets2], index) => wallets2.length > 0 && /* @__PURE__ */ React134.createElement(Fragment4, {
-      key: index
-    }, groupName ? /* @__PURE__ */ React134.createElement(Box, {
-      marginBottom: "8",
-      marginTop: "16",
-      marginX: "6"
-    }, /* @__PURE__ */ React134.createElement(Text, {
-      color: groupName === "Installed" ? "accentColor" : "modalTextSecondary",
-      size: "14",
-      weight: "bold"
-    }, supportedI18nGroupNames.includes(groupName) ? i18n2.t(
-      `connector_group.${groupName.toLowerCase()}`
-    ) : groupName)) : null, /* @__PURE__ */ React134.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "4"
-    }, wallets2.map((wallet) => {
-      return /* @__PURE__ */ React134.createElement(ModalSelection, {
-        currentlySelected: wallet.id === selectedOptionId,
-        iconBackground: wallet.iconBackground,
-        iconUrl: wallet.iconUrl,
-        key: wallet.id,
-        name: wallet.name,
-        onClick: () => selectWallet(wallet),
-        ready: wallet.ready,
-        recent: wallet.recent,
-        testId: `wallet-option-${wallet.id}`,
-        isFunkitSdkConnector: wallet.isFunkitSdkConnector
-      });
-    })))
-  )), compactModeEnabled && /* @__PURE__ */ React134.createElement(React134.Fragment, null, /* @__PURE__ */ React134.createElement(Box, {
-    background: "generalBorder",
-    height: "1",
-    marginTop: "-1"
-  }), Disclaimer ? /* @__PURE__ */ React134.createElement(Box, {
-    paddingX: "24",
-    paddingY: "16",
-    textAlign: "center"
-  }, /* @__PURE__ */ React134.createElement(Disclaimer, {
-    Link: DisclaimerLink,
-    Text: DisclaimerText
-  })) : /* @__PURE__ */ React134.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    justifyContent: "space-between",
-    paddingX: "24",
-    paddingY: "16"
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    paddingY: "4"
-  }, /* @__PURE__ */ React134.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "medium"
-  }, i18n2.t("connect.new_to_ethereum.description"))), /* @__PURE__ */ React134.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "row",
-    gap: "4",
-    justifyContent: "center"
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    className: touchableStyles({
-      active: "shrink",
-      hover: "grow"
-    }),
-    cursor: "pointer",
-    onClick: () => changeWalletStep("LEARN_COMPACT" /* LearnCompact */),
-    paddingY: "4",
-    style: { willChange: "transform" },
-    transition: "default"
-  }, /* @__PURE__ */ React134.createElement(Text, {
-    color: "accentColor",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("connect.new_to_ethereum.learn_more.label"))))))), (compactModeEnabled ? walletStep !== "NONE" /* None */ : true) && /* @__PURE__ */ React134.createElement(React134.Fragment, null, !compactModeEnabled && /* @__PURE__ */ React134.createElement(Box, {
-    background: "generalBorder",
-    minWidth: "1",
-    width: "1"
-  }), /* @__PURE__ */ React134.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    margin: "16",
-    style: { flexGrow: 1 }
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    justifyContent: "space-between",
-    marginBottom: "12"
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    width: "28"
-  }, headerBackButtonLink && /* @__PURE__ */ React134.createElement(Box, {
-    as: "button",
-    className: touchableStyles({
-      active: "shrinkSm",
-      hover: "growLg"
-    }),
-    color: "accentColor",
-    onClick: () => {
-      headerBackButtonLink && changeWalletStep(headerBackButtonLink, true);
-      headerBackButtonCallback == null ? void 0 : headerBackButtonCallback();
-    },
-    paddingX: "8",
-    paddingY: "4",
-    style: {
-      boxSizing: "content-box",
-      height: 17,
-      willChange: "transform"
-    },
-    transition: "default",
-    type: "button"
-  }, /* @__PURE__ */ React134.createElement(BackIcon, null))), /* @__PURE__ */ React134.createElement(Box, {
-    display: "flex",
-    justifyContent: "center",
-    style: { flexGrow: 1 }
-  }, headerLabel && /* @__PURE__ */ React134.createElement(Text, {
-    color: "modalText",
-    size: "18",
-    textAlign: "center",
-    weight: "heavy"
-  }, headerLabel)), /* @__PURE__ */ React134.createElement(CloseButton, {
-    onClose
-  })), /* @__PURE__ */ React134.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    style: { minHeight: compactModeEnabled ? 396 : 432 }
-  }, /* @__PURE__ */ React134.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "6",
-    height: "full",
-    justifyContent: "center",
-    marginX: "8"
-  }, walletContent)))));
-}
-
-// src/components/ConnectOptions/ConnectDetails.tsx
-var getBrowserSrc = async () => {
-  const browser = getBrowser();
-  switch (browser) {
-    case "Arc" /* Arc */:
-      return (await import("./Arc-QDJFTGH2.js")).default;
-    case "Brave" /* Brave */:
-      return (await import("./Brave-YATE5BIM.js")).default;
-    case "Chrome" /* Chrome */:
-      return (await import("./Chrome-LGF33C3S.js")).default;
-    case "Edge" /* Edge */:
-      return (await import("./Edge-K2JEGI5S.js")).default;
-    case "Firefox" /* Firefox */:
-      return (await import("./Firefox-NP5SYEK5.js")).default;
-    case "Opera" /* Opera */:
-      return (await import("./Opera-KV54PXPA.js")).default;
-    case "Safari" /* Safari */:
-      return (await import("./Safari-2QIYKJ4P.js")).default;
-    default:
-      return (await import("./Browser-HN7O5MN7.js")).default;
-  }
-};
-var preloadBrowserIcon = () => loadImages(getBrowserSrc);
-var getPlatformSrc = async () => {
-  const platform = getPlatform();
-  switch (platform) {
-    case "Windows" /* Windows */:
-      return (await import("./Windows-R3CKAIUV.js")).default;
-    case "macOS" /* MacOS */:
-      return (await import("./Macos-2KTZ2XLP.js")).default;
-    case "Linux" /* Linux */:
-      return (await import("./Linux-NS2LQPT4.js")).default;
-    default:
-      return (await import("./Linux-NS2LQPT4.js")).default;
-  }
-};
-var preloadPlatformIcon = () => loadImages(getPlatformSrc);
-function GetDetail({
-  getWalletDownload,
-  compactModeEnabled
-}) {
-  const wallets = useWalletConnectors().filter(
-    (wallet) => wallet.isFunkitSdkConnector
-  );
-  const shownWallets = wallets.splice(0, 5);
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    height: "full",
-    marginTop: "18",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "28",
-    height: "full",
-    width: "full"
-  }, shownWallets == null ? void 0 : shownWallets.filter(
-    (wallet) => {
-      var _a;
-      return wallet.extensionDownloadUrl || wallet.desktopDownloadUrl || wallet.qrCode && ((_a = wallet.downloadUrls) == null ? void 0 : _a.qrCode);
-    }
-  ).map((wallet) => {
-    const { downloadUrls, iconBackground, iconUrl, id, name, qrCode } = wallet;
-    const hasMobileCompanionApp = (downloadUrls == null ? void 0 : downloadUrls.qrCode) && qrCode;
-    const hasExtension = !!wallet.extensionDownloadUrl;
-    const hasMobileAndExtension = (downloadUrls == null ? void 0 : downloadUrls.qrCode) && hasExtension;
-    const hasMobileAndDesktop = (downloadUrls == null ? void 0 : downloadUrls.qrCode) && !!wallet.desktopDownloadUrl;
-    return /* @__PURE__ */ React135.createElement(Box, {
-      alignItems: "center",
-      display: "flex",
-      gap: "16",
-      justifyContent: "space-between",
-      key: wallet.id,
-      width: "full"
-    }, /* @__PURE__ */ React135.createElement(Box, {
-      alignItems: "center",
-      display: "flex",
-      flexDirection: "row",
-      gap: "16"
-    }, /* @__PURE__ */ React135.createElement(AsyncImage, {
-      background: iconBackground,
-      borderColor: "actionButtonBorder",
-      borderRadius: "10",
-      height: "48",
-      src: iconUrl,
-      width: "48"
-    }), /* @__PURE__ */ React135.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "2"
-    }, /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalText",
-      size: "14",
-      weight: "bold"
-    }, name), /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalTextSecondary",
-      size: "14",
-      weight: "medium"
-    }, hasMobileAndExtension ? i18n2.t("get.mobile_and_extension.description") : hasMobileAndDesktop ? i18n2.t("get.mobile_and_desktop.description") : hasMobileCompanionApp ? i18n2.t("get.mobile.description") : hasExtension ? i18n2.t("get.extension.description") : null))), /* @__PURE__ */ React135.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "4"
-    }, /* @__PURE__ */ React135.createElement(ActionButton, {
-      label: i18n2.t("get.action.label"),
-      onClick: () => getWalletDownload(id),
-      type: "secondary"
-    })));
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    borderRadius: "10",
-    display: "flex",
-    flexDirection: "column",
-    gap: "8",
-    justifyContent: "space-between",
-    marginBottom: "4",
-    paddingY: "8",
-    style: { maxWidth: 275, textAlign: "center" }
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalText",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("get.looking_for.title")), /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "medium"
-  }, compactModeEnabled ? i18n2.t("get.looking_for.desktop.compact_description") : i18n2.t("get.looking_for.desktop.wide_description"))));
-}
-function LinkItem() {
-  return /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    style: { flex: 1 }
-  }, /* @__PURE__ */ React135.createElement(FunDivider, null)), /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    color: "accentColor",
-    background: "modalBorder",
-    padding: "8",
-    borderRadius: "13"
-  }, /* @__PURE__ */ React135.createElement(LinkIcon, null)), /* @__PURE__ */ React135.createElement(Box, {
-    style: { flex: 1 }
-  }, /* @__PURE__ */ React135.createElement(FunDivider, null)));
-}
-function ConnectDetail({
-  compactModeEnabled,
-  qrCodeUri,
-  wallet
-}) {
-  const {
-    downloadUrls,
-    iconBackground,
-    iconUrl,
-    name,
-    qrCode,
-    ready,
-    getDesktopUri
-  } = wallet;
-  const safari = isSafari();
-  const funkitConfig = useFunkitConfig();
-  const appConfig = {
-    name: funkitConfig.appName,
-    logoSrc: funkitConfig.appLogoSrc,
-    logoBackground: funkitConfig.appLogoBackgroundColor
-  };
-  const hasExtension = !!wallet.extensionDownloadUrl;
-  const hasQrCode = qrCode && qrCodeUri;
-  const { width: windowWidth } = useWindowSize();
-  const smallWindow = windowWidth && windowWidth < 768;
-  useEffect29(() => {
-    preloadBrowserIcon();
-    preloadPlatformIcon();
-  }, []);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    height: "full",
-    width: "full"
-  }, hasQrCode ? /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    height: "full",
-    justifyContent: "center",
-    flexDirection: "column"
-  }, /* @__PURE__ */ React135.createElement(QRCode, {
-    logoBackground: iconBackground,
-    logoSize: compactModeEnabled ? 60 : 72,
-    logoUrl: iconUrl,
-    size: compactModeEnabled ? 318 : smallWindow ? Math.max(280, Math.min(windowWidth - 308, 382)) : 382,
-    uri: qrCodeUri
-  }), /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    paddingTop: "20"
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    weight: "medium",
-    color: "modalText",
-    size: "14",
-    style: { paddingRight: 8 }
-  }, "Copy Link"), /* @__PURE__ */ React135.createElement(CopyAddress, {
-    address: qrCodeUri,
-    type: "button"
-  }))) : /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    justifyContent: "center",
-    style: { flexGrow: 1 }
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "8"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "4",
-    style: { textAlign: "center" }
-  }, ready && !hasQrCode ? /* @__PURE__ */ React135.createElement(Box, {
-    width: "full",
-    display: "flex",
-    flexDirection: "column",
-    gap: "24"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    id: "link-graphics",
-    display: "flex",
-    flexDirection: "row",
-    justifyContent: "space-between"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    style: { width: 80, height: 80 }
-  }, /* @__PURE__ */ React135.createElement(AsyncImage, {
-    background: appConfig.logoBackground,
-    borderRadius: "menuButton",
-    src: appConfig.logoSrc,
-    width: 80,
-    height: 80
-  })), /* @__PURE__ */ React135.createElement(LinkItem, null), /* @__PURE__ */ React135.createElement(Box, {
-    style: { width: 80, height: 80 }
-  }, /* @__PURE__ */ React135.createElement(AsyncImage, {
-    background: iconBackground,
-    borderRadius: "menuButton",
-    src: iconUrl,
-    width: 80,
-    height: 80
-  }))), /* @__PURE__ */ React135.createElement(Box, {
-    id: "link-text",
-    display: "flex",
-    flexDirection: "column",
-    gap: "10"
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "accentColor",
-    weight: "semibold",
-    size: "18"
-  }, "Connecting to ", name, "..."), /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalTextSecondary",
-    weight: "medium",
-    size: "14"
-  }, "Approve the ", appConfig.name, " application to execute transactions seamlessly."))) : null))));
-}
-var DownloadOptionsBox = ({
-  actionLabel,
-  description,
-  iconAccent,
-  iconBackground,
-  iconUrl,
-  isCompact,
-  onAction,
-  title,
-  url,
-  variant
-}) => {
-  const isBrowserCard = variant === "browser";
-  const gradientRgbas = !isBrowserCard && iconAccent && getGradientRGBAs(iconAccent);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    borderRadius: "13",
-    display: "flex",
-    justifyContent: "center",
-    overflow: "hidden",
-    paddingX: isCompact ? "18" : "44",
-    position: "relative",
-    style: { flex: 1, isolation: "isolate" },
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    borderColor: "actionButtonBorder",
-    borderRadius: "13",
-    borderStyle: "solid",
-    borderWidth: "1",
-    style: {
-      bottom: "0",
-      left: "0",
-      position: "absolute",
-      right: "0",
-      top: "0",
-      zIndex: 1
-    }
-  }), isBrowserCard && /* @__PURE__ */ React135.createElement(Box, {
-    background: "downloadTopCardBackground",
-    height: "full",
-    position: "absolute",
-    style: {
-      zIndex: 0
-    },
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "row",
-    justifyContent: "space-between",
-    style: {
-      bottom: "0",
-      filter: "blur(20px)",
-      left: "0",
-      position: "absolute",
-      right: "0",
-      top: "0",
-      transform: "translate3d(0, 0, 0)"
-    }
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    style: {
-      filter: "blur(100px)",
-      marginLeft: -27,
-      marginTop: -20,
-      opacity: 0.6,
-      transform: "translate3d(0, 0, 0)"
-    }
-  }, /* @__PURE__ */ React135.createElement(AsyncImage, {
-    borderRadius: "full",
-    height: "200",
-    src: iconUrl,
-    width: "200"
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    style: {
-      filter: "blur(100px)",
-      marginRight: 0,
-      marginTop: 105,
-      opacity: 0.6,
-      overflow: "auto",
-      transform: "translate3d(0, 0, 0)"
-    }
-  }, /* @__PURE__ */ React135.createElement(AsyncImage, {
-    borderRadius: "full",
-    height: "200",
-    src: iconUrl,
-    width: "200"
-  })))), !isBrowserCard && gradientRgbas && /* @__PURE__ */ React135.createElement(Box, {
-    background: "downloadBottomCardBackground",
-    style: {
-      bottom: "0",
-      left: "0",
-      position: "absolute",
-      right: "0",
-      top: "0"
-    }
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    position: "absolute",
-    style: {
-      background: `radial-gradient(50% 50% at 50% 50%, ${gradientRgbas[0]} 0%, ${gradientRgbas[1]} 25%, rgba(0,0,0,0) 100%)`,
-      height: 564,
-      left: -215,
-      top: -197,
-      transform: "translate3d(0, 0, 0)",
-      width: 564
-    }
-  }), /* @__PURE__ */ React135.createElement(Box, {
-    position: "absolute",
-    style: {
-      background: `radial-gradient(50% 50% at 50% 50%, ${gradientRgbas[2]} 0%, rgba(0, 0, 0, 0) 100%)`,
-      height: 564,
-      left: -1,
-      top: -76,
-      transform: "translate3d(0, 0, 0)",
-      width: 564
-    }
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "flex-start",
-    display: "flex",
-    flexDirection: "row",
-    gap: "24",
-    height: "max",
-    justifyContent: "center",
-    style: { zIndex: 1 }
-  }, /* @__PURE__ */ React135.createElement(Box, null, /* @__PURE__ */ React135.createElement(AsyncImage, {
-    height: "60",
-    src: iconUrl,
-    width: "60",
-    ...iconBackground ? {
-      background: iconBackground,
-      borderColor: "generalBorder",
-      borderRadius: "10"
-    } : null
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "4",
-    style: { flex: 1 },
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalText",
-    size: "14",
-    weight: "bold"
-  }, title), /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "medium"
-  }, description), /* @__PURE__ */ React135.createElement(Box, {
-    marginTop: "14",
-    width: "max"
-  }, /* @__PURE__ */ React135.createElement(ActionButton, {
-    href: url,
-    label: actionLabel,
-    onClick: onAction,
-    size: "medium"
-  })))));
-};
-function DownloadOptionsDetail({
-  changeWalletStep,
-  wallet
-}) {
-  const browser = getBrowser();
-  const platform = getPlatform();
-  const modalSize = useContext23(ModalSizeContext);
-  const isCompact = modalSize === "compact";
-  const {
-    desktop,
-    desktopDownloadUrl,
-    extension,
-    extensionDownloadUrl,
-    mobileDownloadUrl
-  } = wallet;
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  useEffect29(() => {
-    preloadCreateIcon();
-    preloadScanIcon();
-    preloadRefreshIcon();
-    preloadConnectIcon();
-  }, []);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "24",
-    height: "full",
-    marginBottom: "8",
-    marginTop: "4",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
+    gap: "8"
+  }, /* @__PURE__ */ React121.createElement(Box, {
     alignItems: "center",
     display: "flex",
     flexDirection: "column",
-    gap: "8",
-    height: "full",
-    justifyContent: "center",
-    width: "full"
-  }, extensionDownloadUrl && /* @__PURE__ */ React135.createElement(DownloadOptionsBox, {
-    actionLabel: i18n2.t("get_options.extension.download.label", {
-      browser
-    }),
-    description: i18n2.t("get_options.extension.description"),
-    iconUrl: getBrowserSrc,
-    isCompact,
-    onAction: () => changeWalletStep(
-      (extension == null ? void 0 : extension.instructions) ? "INSTRUCTIONS_EXTENSION" /* InstructionsExtension */ : "CONNECT" /* Connect */
-    ),
-    title: i18n2.t("get_options.extension.title", {
-      wallet: wallet.name,
-      browser
-    }),
-    url: extensionDownloadUrl,
-    variant: "browser"
-  }), desktopDownloadUrl && /* @__PURE__ */ React135.createElement(DownloadOptionsBox, {
-    actionLabel: i18n2.t("get_options.desktop.download.label", {
-      platform
-    }),
-    description: i18n2.t("get_options.desktop.description"),
-    iconUrl: getPlatformSrc,
-    isCompact,
-    onAction: () => changeWalletStep(
-      (desktop == null ? void 0 : desktop.instructions) ? "INSTRUCTIONS_DESKTOP" /* InstructionsDesktop */ : "CONNECT" /* Connect */
-    ),
-    title: i18n2.t("get_options.desktop.title", {
-      wallet: wallet.name,
-      platform
-    }),
-    url: desktopDownloadUrl,
-    variant: "desktop"
-  }), mobileDownloadUrl && /* @__PURE__ */ React135.createElement(DownloadOptionsBox, {
-    actionLabel: i18n2.t("get_options.mobile.download.label", {
-      wallet: wallet.name
-    }),
-    description: i18n2.t("get_options.mobile.description"),
-    iconAccent: wallet.iconAccent,
-    iconBackground: wallet.iconBackground,
-    iconUrl: wallet.iconUrl,
-    isCompact,
-    onAction: () => {
-      changeWalletStep("DOWNLOAD" /* Download */);
-    },
-    title: i18n2.t("get_options.mobile.title", { wallet: wallet.name }),
-    variant: "app"
-  })));
-}
-function DownloadDetail({
-  changeWalletStep,
-  wallet
-}) {
-  const { downloadUrls, qrCode } = wallet;
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  useEffect29(() => {
-    preloadCreateIcon();
-    preloadScanIcon();
-  }, []);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
+    gap: "4",
+    style: { textAlign: "center" }
+  }, ready && !hasQrCode ? /* @__PURE__ */ React121.createElement(Box, {
+    width: "full",
     display: "flex",
     flexDirection: "column",
-    gap: "24",
-    height: "full",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    style: { maxWidth: 220, textAlign: "center" }
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "modalTextSecondary",
-    size: "14",
-    weight: "semibold"
-  }, i18n2.t("get_mobile.description"))), /* @__PURE__ */ React135.createElement(Box, {
-    height: "full"
-  }, (downloadUrls == null ? void 0 : downloadUrls.qrCode) ? /* @__PURE__ */ React135.createElement(QRCode, {
-    logoSize: 0,
-    size: 268,
-    uri: downloadUrls.qrCode
-  }) : null), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    borderRadius: "10",
+    gap: "24"
+  }, /* @__PURE__ */ React121.createElement(Box, {
+    id: "link-graphics",
     display: "flex",
     flexDirection: "row",
-    gap: "8",
-    height: "34",
-    justifyContent: "space-between",
-    marginBottom: "12",
-    paddingY: "8"
-  }, /* @__PURE__ */ React135.createElement(ActionButton, {
-    label: i18n2.t("get_mobile.continue.label"),
-    onClick: () => changeWalletStep(
-      (qrCode == null ? void 0 : qrCode.instructions) ? "INSTRUCTIONS_MOBILE" /* InstructionsMobile */ : "CONNECT" /* Connect */
-    )
-  })));
-}
-var stepIcons = {
-  connect: () => /* @__PURE__ */ React135.createElement(ConnectIcon, null),
-  create: () => /* @__PURE__ */ React135.createElement(CreateIcon, null),
-  install: (wallet) => /* @__PURE__ */ React135.createElement(AsyncImage, {
-    background: wallet.iconBackground,
-    borderColor: "generalBorder",
-    borderRadius: "10",
-    height: "48",
-    src: wallet.iconUrl,
-    width: "48"
-  }),
-  refresh: () => /* @__PURE__ */ React135.createElement(RefreshIcon, null),
-  scan: () => /* @__PURE__ */ React135.createElement(ScanIcon, null)
-};
-function InstructionMobileDetail({
-  connectWallet,
-  wallet
-}) {
-  var _a, _b, _c, _d;
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    height: "full",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "28",
-    height: "full",
-    justifyContent: "center",
-    paddingY: "32",
-    style: { maxWidth: 320 }
-  }, (_b = (_a = wallet == null ? void 0 : wallet.qrCode) == null ? void 0 : _a.instructions) == null ? void 0 : _b.steps.map((d, idx) => {
-    var _a2;
-    return /* @__PURE__ */ React135.createElement(Box, {
-      alignItems: "center",
-      display: "flex",
-      flexDirection: "row",
-      gap: "16",
-      key: idx
-    }, /* @__PURE__ */ React135.createElement(Box, {
-      borderRadius: "10",
-      height: "48",
-      minWidth: "48",
-      overflow: "hidden",
-      position: "relative",
-      width: "48"
-    }, (_a2 = stepIcons[d.step]) == null ? void 0 : _a2.call(stepIcons, wallet)), /* @__PURE__ */ React135.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "4"
-    }, /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalText",
-      size: "14",
-      weight: "bold"
-    }, i18n2.t(d.title, void 0, {
-      rawKeyIfTranslationMissing: true
-    })), /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalTextSecondary",
-      size: "14",
-      weight: "medium"
-    }, i18n2.t(d.description, void 0, {
-      rawKeyIfTranslationMissing: true
-    }))));
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "12",
-    justifyContent: "center",
-    marginBottom: "16"
-  }, /* @__PURE__ */ React135.createElement(ActionButton, {
-    label: i18n2.t("get_instructions.mobile.connect.label"),
-    onClick: () => connectWallet(wallet)
-  }), /* @__PURE__ */ React135.createElement(Box, {
-    as: "a",
-    className: touchableStyles({ active: "shrink", hover: "grow" }),
-    display: "block",
-    href: (_d = (_c = wallet == null ? void 0 : wallet.qrCode) == null ? void 0 : _c.instructions) == null ? void 0 : _d.learnMoreUrl,
-    paddingX: "12",
-    paddingY: "4",
-    rel: "noreferrer",
-    style: { willChange: "transform" },
-    target: "_blank",
-    transition: "default"
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "accentColor",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("get_instructions.mobile.learn_more.label")))));
-}
-function InstructionExtensionDetail({
-  wallet
-}) {
-  var _a, _b, _c, _d;
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    height: "full",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "28",
-    height: "full",
-    justifyContent: "center",
-    paddingY: "32",
-    style: { maxWidth: 320 }
-  }, (_b = (_a = wallet == null ? void 0 : wallet.extension) == null ? void 0 : _a.instructions) == null ? void 0 : _b.steps.map((d, idx) => {
-    var _a2;
-    return /* @__PURE__ */ React135.createElement(Box, {
-      alignItems: "center",
-      display: "flex",
-      flexDirection: "row",
-      gap: "16",
-      key: idx
-    }, /* @__PURE__ */ React135.createElement(Box, {
-      borderRadius: "10",
-      height: "48",
-      minWidth: "48",
-      overflow: "hidden",
-      position: "relative",
-      width: "48"
-    }, (_a2 = stepIcons[d.step]) == null ? void 0 : _a2.call(stepIcons, wallet)), /* @__PURE__ */ React135.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "4"
-    }, /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalText",
-      size: "14",
-      weight: "bold"
-    }, i18n2.t(d.title, void 0, {
-      rawKeyIfTranslationMissing: true
-    })), /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalTextSecondary",
-      size: "14",
-      weight: "medium"
-    }, i18n2.t(d.description, void 0, {
-      rawKeyIfTranslationMissing: true
-    }))));
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    gap: "12",
-    justifyContent: "center",
-    marginBottom: "16"
-  }, /* @__PURE__ */ React135.createElement(ActionButton, {
-    label: i18n2.t("get_instructions.extension.refresh.label"),
-    onClick: window.location.reload.bind(window.location)
-  }), /* @__PURE__ */ React135.createElement(Box, {
-    as: "a",
-    className: touchableStyles({ active: "shrink", hover: "grow" }),
-    display: "block",
-    href: (_d = (_c = wallet == null ? void 0 : wallet.extension) == null ? void 0 : _c.instructions) == null ? void 0 : _d.learnMoreUrl,
-    paddingX: "12",
-    paddingY: "4",
-    rel: "noreferrer",
-    style: { willChange: "transform" },
-    target: "_blank",
-    transition: "default"
-  }, /* @__PURE__ */ React135.createElement(Text, {
-    color: "accentColor",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("get_instructions.extension.learn_more.label")))));
-}
-function InstructionDesktopDetail({
-  connectWallet,
-  wallet
-}) {
-  var _a, _b, _c, _d;
-  const { i18n: i18n2 } = useContext23(I18nContext);
-  return /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    height: "full",
-    width: "full"
-  }, /* @__PURE__ */ React135.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "28",
-    height: "full",
-    justifyContent: "center",
-    paddingY: "32",
-    style: { maxWidth: 320 }
-  }, (_b = (_a = wallet == null ? void 0 : wallet.desktop) == null ? void 0 : _a.instructions) == null ? void 0 : _b.steps.map((d, idx) => {
-    var _a2;
-    return /* @__PURE__ */ React135.createElement(Box, {
-      alignItems: "center",
-      display: "flex",
-      flexDirection: "row",
-      gap: "16",
-      key: idx
-    }, /* @__PURE__ */ React135.createElement(Box, {
-      borderRadius: "10",
-      height: "48",
-      minWidth: "48",
-      overflow: "hidden",
-      position: "relative",
-      width: "48"
-    }, (_a2 = stepIcons[d.step]) == null ? void 0 : _a2.call(stepIcons, wallet)), /* @__PURE__ */ React135.createElement(Box, {
-      display: "flex",
-      flexDirection: "column",
-      gap: "4"
-    }, /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalText",
-      size: "14",
-      weight: "bold"
-    }, i18n2.t(d.title, void 0, {
-      rawKeyIfTranslationMissing: true
-    })), /* @__PURE__ */ React135.createElement(Text, {
-      color: "modalTextSecondary",
-      size: "14",
-      weight: "medium"
-    }, i18n2.t(d.description, void 0, {
-      rawKeyIfTranslationMissing: true
-    }))));
-  })), /* @__PURE__ */ React135.createElement(Box, {
-    alignItems: "center",
+    justifyContent: "space-between"
+  }, /* @__PURE__ */ React121.createElement(Box, {
+    style: { width: 80, height: 80 }
+  }, /* @__PURE__ */ React121.createElement(AsyncImage, {
+    background: appConfig.logoBackground,
+    borderRadius: "menuButton",
+    src: appConfig.logoSrc,
+    width: 80,
+    height: 80
+  })), /* @__PURE__ */ React121.createElement(LinkItem, null), /* @__PURE__ */ React121.createElement(Box, {
+    style: { width: 80, height: 80 }
+  }, /* @__PURE__ */ React121.createElement(AsyncImage, {
+    background: iconBackground,
+    borderRadius: "menuButton",
+    src: iconUrl,
+    width: 80,
+    height: 80
+  }))), /* @__PURE__ */ React121.createElement(Box, {
+    id: "link-text",
     display: "flex",
     flexDirection: "column",
-    gap: "12",
-    justifyContent: "center",
-    marginBottom: "16"
-  }, /* @__PURE__ */ React135.createElement(ActionButton, {
-    label: i18n2.t("get_instructions.desktop.connect.label"),
-    onClick: () => connectWallet(wallet)
-  }), /* @__PURE__ */ React135.createElement(Box, {
-    as: "a",
-    className: touchableStyles({ active: "shrink", hover: "grow" }),
-    display: "block",
-    href: (_d = (_c = wallet == null ? void 0 : wallet.desktop) == null ? void 0 : _c.instructions) == null ? void 0 : _d.learnMoreUrl,
-    paddingX: "12",
-    paddingY: "4",
-    rel: "noreferrer",
-    style: { willChange: "transform" },
-    target: "_blank",
-    transition: "default"
-  }, /* @__PURE__ */ React135.createElement(Text, {
+    gap: "10"
+  }, /* @__PURE__ */ React121.createElement(Text, {
     color: "accentColor",
-    size: "14",
-    weight: "bold"
-  }, i18n2.t("get_instructions.desktop.learn_more.label")))));
+    weight: "semibold",
+    size: "18"
+  }, "Connecting to ", name, "..."), /* @__PURE__ */ React121.createElement(Text, {
+    color: "modalTextSecondary",
+    weight: "medium",
+    size: "14"
+  }, "Approve the ", appConfig.name, " application to execute transactions seamlessly."))) : null))));
 }
 
 // src/components/FunConnectOptions/FunWeb3ConnectingStep.tsx
@@ -14583,8 +13198,8 @@ function FunWeb3ConnectingStep({
   selectedWallet,
   qrCodeUri
 }) {
-  const [animateOut, setAnimateOut] = React136.useState(false);
-  return /* @__PURE__ */ React136.createElement(Box, null, /* @__PURE__ */ React136.createElement(FunModalTitleSection, {
+  const [animateOut, setAnimateOut] = React122.useState(false);
+  return /* @__PURE__ */ React122.createElement(Box, null, /* @__PURE__ */ React122.createElement(FunModalTitleSection, {
     title: "Connect Wallet",
     hasBackButton: true,
     onBack: () => {
@@ -14596,27 +13211,23 @@ function FunWeb3ConnectingStep({
     backAnimation: animateOut,
     hasCloseButton: true,
     onClose
-  }), selectedWallet ? /* @__PURE__ */ React136.createElement(Box, {
+  }), selectedWallet ? /* @__PURE__ */ React122.createElement(Box, {
     display: "flex",
     flexDirection: "column",
     paddingY: "20",
     gap: "24",
     className: animateOut ? animateContentOutClass : animateContentInClass
-  }, /* @__PURE__ */ React136.createElement(ConnectDetail, {
-    changeWalletStep: () => void 0,
+  }, /* @__PURE__ */ React122.createElement(ConnectDetail, {
     compactModeEnabled: true,
     qrCodeUri,
-    onClose,
-    wallet: selectedWallet,
-    connectionError: false,
-    reconnect: () => void 0
-  }), /* @__PURE__ */ React136.createElement(FunButton, {
+    wallet: selectedWallet
+  }), /* @__PURE__ */ React122.createElement(FunButton, {
     isDisabled: true,
-    titleSuffix: /* @__PURE__ */ React136.createElement(Box, {
+    titleSuffix: /* @__PURE__ */ React122.createElement(Box, {
       display: "flex",
       alignItems: "center",
       color: "modalText"
-    }, /* @__PURE__ */ React136.createElement(SpinnerIcon, {
+    }, /* @__PURE__ */ React122.createElement(SpinnerIcon, {
       height: 21,
       width: 21
     })),
@@ -14626,13 +13237,13 @@ function FunWeb3ConnectingStep({
 
 // src/components/FunConnectOptions/FunConnectOptions.tsx
 function FunConnectOptions({ onClose }) {
-  const [step, setStep] = useState38(0 /* SIGNIN */);
-  const [selectedWallet, setSelectedWallet] = useState38();
-  const [qrCodeUri, setQrCodeUri] = useState38("");
-  const [emailInput, setEmailInput] = useState38("");
-  const [otpInput, setOtpInput] = useState38("");
-  const [farcasterUri, setFarcasterUri] = useState38("");
-  const [farcasterToken, setFarcasterToken] = useState38("");
+  const [step, setStep] = useState37(0 /* SIGNIN */);
+  const [selectedWallet, setSelectedWallet] = useState37();
+  const [qrCodeUri, setQrCodeUri] = useState37("");
+  const [emailInput, setEmailInput] = useState37("");
+  const [otpInput, setOtpInput] = useState37("");
+  const [farcasterUri, setFarcasterUri] = useState37("");
+  const [farcasterToken, setFarcasterToken] = useState37("");
   const changeStep = (newStep) => {
     setStep(newStep);
     if (newStep === 0 /* SIGNIN */) {
@@ -14650,17 +13261,17 @@ function FunConnectOptions({ onClose }) {
       });
     }
   }, []);
-  return /* @__PURE__ */ React137.createElement(Box, {
+  return /* @__PURE__ */ React123.createElement(Box, {
     display: "flex",
     flexDirection: "row"
-  }, /* @__PURE__ */ React137.createElement(Box, {
-    className: sidebarCompactMode,
+  }, /* @__PURE__ */ React123.createElement(Box, {
     display: "flex",
     flexDirection: "column",
     marginTop: "16",
     paddingX: "20",
+    minWidth: "full",
     width: "full"
-  }, step === 0 /* SIGNIN */ ? /* @__PURE__ */ React137.createElement(FunSignInStep, {
+  }, step === 0 /* SIGNIN */ ? /* @__PURE__ */ React123.createElement(FunSignInStep, {
     emailInput,
     setEmailInput,
     onClose,
@@ -14673,24 +13284,24 @@ function FunConnectOptions({ onClose }) {
       setFarcasterUri(connectUri);
       changeStep(3 /* PENDING_FARCASTER */);
     }
-  }) : step === 2 /* PENDING_WALLET */ ? /* @__PURE__ */ React137.createElement(FunWeb3ConnectingStep, {
+  }) : step === 2 /* PENDING_WALLET */ ? /* @__PURE__ */ React123.createElement(FunWeb3ConnectingStep, {
     onClose,
     changeStep,
     selectedWallet,
     qrCodeUri
-  }) : step === 1 /* PENDING_EMAIL */ ? /* @__PURE__ */ React137.createElement(FunWeb2ConnectingStep, {
+  }) : step === 1 /* PENDING_EMAIL */ ? /* @__PURE__ */ React123.createElement(FunWeb2ConnectingStep, {
     emailInput,
     otpInput,
     setOtpInput,
     onClose,
     onBack: () => changeStep(0 /* SIGNIN */),
     setSelectedWallet
-  }) : step === 3 /* PENDING_FARCASTER */ ? /* @__PURE__ */ React137.createElement(FunFarcasterConnectingStep, {
+  }) : step === 3 /* PENDING_FARCASTER */ ? /* @__PURE__ */ React123.createElement(FunFarcasterConnectingStep, {
     farcasterUri,
     farcasterToken,
     changeStep,
     onClose
-  }) : step === 4 /* ERROR */ ? /* @__PURE__ */ React137.createElement(FunConnectErrorStep, {
+  }) : step === 4 /* ERROR */ ? /* @__PURE__ */ React123.createElement(FunConnectErrorStep, {
     title: "Connection Failed",
     onBack: () => changeStep(0 /* SIGNIN */),
     onClose,
@@ -14710,16 +13321,81 @@ function FunConnectOptions({ onClose }) {
 }
 
 // src/components/SignIn/SignIn.tsx
-import React138, { useCallback as useCallback29, useContext as useContext24, useRef as useRef11 } from "react";
+import React125, { useCallback as useCallback29, useContext as useContext21, useRef as useRef10 } from "react";
 import { UserRejectedRequestError } from "viem";
 import { useAccount as useAccount9, useSignMessage } from "wagmi";
+
+// src/components/Button/ActionButton.tsx
+import React124 from "react";
+var sizeVariants = {
+  large: {
+    fontSize: "16",
+    paddingX: "24",
+    paddingY: "10"
+  },
+  medium: {
+    fontSize: "14",
+    height: "28",
+    paddingX: "12",
+    paddingY: "4"
+  },
+  small: {
+    fontSize: "14",
+    paddingX: "10",
+    paddingY: "5"
+  }
+};
+function ActionButton({
+  disabled = false,
+  href,
+  label,
+  onClick,
+  rel = "noreferrer noopener",
+  size = "medium",
+  target = "_blank",
+  testId,
+  type = "primary"
+}) {
+  const isPrimary = type === "primary";
+  const isNotLarge = size !== "large";
+  const mobile = isMobile();
+  const background = !disabled ? isPrimary ? "accentColor" : isNotLarge ? "actionButtonSecondaryBackground" : null : "actionButtonSecondaryBackground";
+  const { fontSize, height, paddingX, paddingY } = sizeVariants[size];
+  const hasBorder = !mobile || !isNotLarge;
+  return /* @__PURE__ */ React124.createElement(Box, {
+    ...href ? !disabled ? { as: "a", href, rel, target } : {} : { as: "button", type: "button" },
+    onClick: !disabled ? onClick : void 0,
+    ...hasBorder ? {
+      borderColor: mobile && !isNotLarge && !isPrimary ? "actionButtonBorderMobile" : "actionButtonBorder",
+      borderStyle: "solid",
+      borderWidth: "1"
+    } : {},
+    borderRadius: "actionButton",
+    className: !disabled && touchableStyles({ active: "shrinkSm", hover: "grow" }),
+    display: "block",
+    paddingX,
+    paddingY,
+    style: { willChange: "transform" },
+    testId,
+    textAlign: "center",
+    transition: "transform",
+    ...background ? { background } : {},
+    ...height ? { height } : {}
+  }, /* @__PURE__ */ React124.createElement(Text, {
+    color: !disabled ? isPrimary ? "accentColorForeground" : "accentColor" : "modalTextSecondary",
+    size: fontSize,
+    weight: "bold"
+  }, label));
+}
+
+// src/components/SignIn/SignIn.tsx
 var signInIcon = async () => (await import("./sign-FZVB2CS6.js")).default;
 function SignIn({
   onClose,
   onCloseModal
 }) {
-  const { i18n: i18n2 } = useContext24(I18nContext);
-  const [{ status, ...state }, setState] = React138.useState({ status: "idle" });
+  const { i18n: i18n2 } = useContext21(I18nContext);
+  const [{ status, ...state }, setState] = React125.useState({ status: "idle" });
   const authAdapter = useAuthenticationAdapter();
   const getNonce = useCallback29(async () => {
     try {
@@ -14733,8 +13409,8 @@ function SignIn({
       }));
     }
   }, [authAdapter, i18n2]);
-  const onceRef = useRef11(false);
-  React138.useEffect(() => {
+  const onceRef = useRef10(false);
+  React125.useEffect(() => {
     if (onceRef.current)
       return;
     onceRef.current = true;
@@ -14796,17 +13472,17 @@ function SignIn({
       });
     }
   };
-  return /* @__PURE__ */ React138.createElement(Box, {
+  return /* @__PURE__ */ React125.createElement(Box, {
     position: "relative"
-  }, /* @__PURE__ */ React138.createElement(Box, {
+  }, /* @__PURE__ */ React125.createElement(Box, {
     display: "flex",
     paddingRight: "16",
     paddingTop: "16",
     position: "absolute",
     right: "0"
-  }, /* @__PURE__ */ React138.createElement(CloseButton, {
+  }, /* @__PURE__ */ React125.createElement(CloseButton, {
     onClose
-  })), /* @__PURE__ */ React138.createElement(Box, {
+  })), /* @__PURE__ */ React125.createElement(Box, {
     alignItems: "center",
     display: "flex",
     flexDirection: "column",
@@ -14814,58 +13490,58 @@ function SignIn({
     padding: "24",
     paddingX: "18",
     style: { paddingTop: mobile ? "60px" : "36px" }
-  }, /* @__PURE__ */ React138.createElement(Box, {
+  }, /* @__PURE__ */ React125.createElement(Box, {
     alignItems: "center",
     display: "flex",
     flexDirection: "column",
     gap: mobile ? "6" : "4",
     style: { maxWidth: mobile ? 320 : 280 }
-  }, /* @__PURE__ */ React138.createElement(Box, {
+  }, /* @__PURE__ */ React125.createElement(Box, {
     alignItems: "center",
     display: "flex",
     flexDirection: "column",
     gap: mobile ? "32" : "16"
-  }, /* @__PURE__ */ React138.createElement(AsyncImage, {
+  }, /* @__PURE__ */ React125.createElement(AsyncImage, {
     height: 40,
     src: signInIcon,
     width: 40
-  }), /* @__PURE__ */ React138.createElement(Text, {
+  }), /* @__PURE__ */ React125.createElement(Text, {
     color: "modalText",
     size: mobile ? "20" : "18",
     textAlign: "center",
     weight: "heavy"
-  }, i18n2.t("sign_in.label"))), /* @__PURE__ */ React138.createElement(Box, {
+  }, i18n2.t("sign_in.label"))), /* @__PURE__ */ React125.createElement(Box, {
     alignItems: "center",
     display: "flex",
     flexDirection: "column",
     gap: mobile ? "16" : "12"
-  }, /* @__PURE__ */ React138.createElement(Text, {
+  }, /* @__PURE__ */ React125.createElement(Text, {
     color: "modalTextSecondary",
     size: mobile ? "16" : "14",
     textAlign: "center"
-  }, i18n2.t("sign_in.description")), status === "idle" && state.errorMessage ? /* @__PURE__ */ React138.createElement(Text, {
+  }, i18n2.t("sign_in.description")), status === "idle" && state.errorMessage ? /* @__PURE__ */ React125.createElement(Text, {
     color: "error",
     size: mobile ? "16" : "14",
     textAlign: "center",
     weight: "bold"
-  }, state.errorMessage) : null)), /* @__PURE__ */ React138.createElement(Box, {
+  }, state.errorMessage) : null)), /* @__PURE__ */ React125.createElement(Box, {
     alignItems: !mobile ? "center" : void 0,
     display: "flex",
     flexDirection: "column",
     gap: "8",
     width: "full"
-  }, /* @__PURE__ */ React138.createElement(ActionButton, {
+  }, /* @__PURE__ */ React125.createElement(ActionButton, {
     disabled: !state.nonce || status === "signing" || status === "verifying",
     label: !state.nonce ? i18n2.t("sign_in.message.preparing") : status === "signing" ? i18n2.t("sign_in.signature.waiting") : status === "verifying" ? i18n2.t("sign_in.signature.verifying") : i18n2.t("sign_in.message.send"),
     onClick: signIn,
     size: mobile ? "large" : "medium",
     testId: "auth-message-button"
-  }), mobile ? /* @__PURE__ */ React138.createElement(ActionButton, {
+  }), mobile ? /* @__PURE__ */ React125.createElement(ActionButton, {
     label: "Cancel",
     onClick: onClose,
     size: "large",
     type: "secondary"
-  }) : /* @__PURE__ */ React138.createElement(Box, {
+  }) : /* @__PURE__ */ React125.createElement(Box, {
     as: "button",
     borderRadius: "full",
     className: touchableStyles({ active: "shrink", hover: "grow" }),
@@ -14877,7 +13553,7 @@ function SignIn({
     style: { willChange: "transform" },
     target: "_blank",
     transition: "default"
-  }, /* @__PURE__ */ React138.createElement(Text, {
+  }, /* @__PURE__ */ React125.createElement(Text, {
     color: "closeButton",
     size: mobile ? "16" : "14",
     weight: "bold"
@@ -14890,38 +13566,38 @@ function ConnectModal({ onClose, open }) {
   const connectionStatus = useConnectionStatus();
   const { disconnect } = useDisconnect2();
   const { isConnecting } = useAccount10();
-  const onAuthCancel = React139.useCallback(() => {
+  const onAuthCancel = React126.useCallback(() => {
     onClose();
     disconnect();
   }, [onClose, disconnect]);
-  const onConnectModalCancel = React139.useCallback(() => {
+  const onConnectModalCancel = React126.useCallback(() => {
     if (isConnecting)
       disconnect();
     onClose();
   }, [onClose, disconnect, isConnecting]);
   if (connectionStatus === "disconnected" || connectionStatus === "loading") {
-    return /* @__PURE__ */ React139.createElement(Dialog, {
+    return /* @__PURE__ */ React126.createElement(Dialog, {
       onClose: onConnectModalCancel,
       open,
       titleId,
       isSmartCloseable: true
-    }, /* @__PURE__ */ React139.createElement(DialogContent, {
+    }, /* @__PURE__ */ React126.createElement(DialogContent, {
       bottomSheetOnMobile: true,
       padding: "0"
-    }, /* @__PURE__ */ React139.createElement(FunConnectOptions, {
+    }, /* @__PURE__ */ React126.createElement(FunConnectOptions, {
       onClose: onConnectModalCancel
     })));
   }
   if (connectionStatus === "unauthenticated") {
-    return /* @__PURE__ */ React139.createElement(Dialog, {
+    return /* @__PURE__ */ React126.createElement(Dialog, {
       onClose: onAuthCancel,
       open,
       titleId,
       isSmartCloseable: true
-    }, /* @__PURE__ */ React139.createElement(DialogContent, {
+    }, /* @__PURE__ */ React126.createElement(DialogContent, {
       bottomSheetOnMobile: true,
       padding: "0"
-    }, /* @__PURE__ */ React139.createElement(SignIn, {
+    }, /* @__PURE__ */ React126.createElement(SignIn, {
       onClose: onAuthCancel,
       onCloseModal: onClose
     })));
@@ -14930,7 +13606,7 @@ function ConnectModal({ onClose, open }) {
 }
 
 // src/components/FunCheckoutHistoryModal/FunCheckoutHistoryModal.tsx
-import React140 from "react";
+import React127 from "react";
 function FunCheckoutHistoryModal({
   onClose,
   open,
@@ -14942,17 +13618,17 @@ function FunCheckoutHistoryModal({
       "Unable to open checkout history modal without a depositAddress"
     );
   }
-  return /* @__PURE__ */ React140.createElement(Dialog, {
+  return /* @__PURE__ */ React127.createElement(Dialog, {
     open,
     onClose,
     titleId: "fun-checkout-history-modal"
-  }, /* @__PURE__ */ React140.createElement(DialogContent, {
+  }, /* @__PURE__ */ React127.createElement(DialogContent, {
     bottomSheetOnMobile: true,
     padding: "0"
-  }, /* @__PURE__ */ React140.createElement(Box, {
+  }, /* @__PURE__ */ React127.createElement(Box, {
     paddingTop: "20",
     paddingX: "20"
-  }, /* @__PURE__ */ React140.createElement(FunCheckoutHistoryContent, {
+  }, /* @__PURE__ */ React127.createElement(FunCheckoutHistoryContent, {
     depositAddress,
     initialPage,
     onClose,
@@ -14961,20 +13637,20 @@ function FunCheckoutHistoryModal({
 }
 
 // src/components/FunDevTestModal/FunDevTestModal.tsx
-import React141 from "react";
+import React128 from "react";
 function FunDevTestModal({ onClose, open }) {
-  return /* @__PURE__ */ React141.createElement(Dialog, {
+  return /* @__PURE__ */ React128.createElement(Dialog, {
     onClose,
     open,
     titleId: "dev/test modal"
-  }, /* @__PURE__ */ React141.createElement(DialogContent, {
+  }, /* @__PURE__ */ React128.createElement(DialogContent, {
     bottomSheetOnMobile: true
-  }, /* @__PURE__ */ React141.createElement(Box, null)));
+  }, /* @__PURE__ */ React128.createElement(Box, null)));
 }
 
 // src/components/FunkitProvider/ModalContext.tsx
 function useModalStateValue() {
-  const [isModalOpen, setModalOpen] = useState39(false);
+  const [isModalOpen, setModalOpen] = useState38(false);
   return {
     closeModal: useCallback30(() => setModalOpen(false), []),
     isModalOpen,
@@ -14982,8 +13658,8 @@ function useModalStateValue() {
   };
 }
 function useModalStateValueWithId() {
-  const [isModalOpen, setModalOpen] = useState39(false);
-  const [modalId, setModalId] = useState39(null);
+  const [isModalOpen, setModalOpen] = useState38(false);
+  const [modalId, setModalId] = useState38(null);
   return {
     closeModal: useCallback30(() => {
       setModalId(null);
@@ -14997,7 +13673,7 @@ function useModalStateValueWithId() {
     }, [])
   };
 }
-var ModalContext = createContext18({
+var ModalContext = createContext17({
   accountModalOpen: false,
   chainModalOpen: false,
   connectModalOpen: false,
@@ -15024,7 +13700,7 @@ function ModalProvider({ children }) {
     isModalOpen: chainModalOpen,
     openModal: openChainModal
   } = useModalStateValue();
-  const [isWalletConnectModalOpen, setIsWalletConnectModalOpen] = useState39(false);
+  const [isWalletConnectModalOpen, setIsWalletConnectModalOpen] = useState38(false);
   const {
     closeModal: closeFunCheckoutModal,
     isModalOpen: funCheckoutModalOpen,
@@ -15062,11 +13738,11 @@ function ModalProvider({ children }) {
     onConnect: () => closeModals({ keepConnectModalOpen: isUnauthenticated }),
     onDisconnect: () => closeModals()
   });
-  useEffect30(() => {
+  useEffect29(() => {
     if (isUnauthenticated)
       closeModals();
   }, [isUnauthenticated]);
-  return /* @__PURE__ */ React142.createElement(ModalContext.Provider, {
+  return /* @__PURE__ */ React129.createElement(ModalContext.Provider, {
     value: useMemo34(
       () => ({
         accountModalOpen,
@@ -15106,21 +13782,21 @@ function ModalProvider({ children }) {
         openFunDevTestModal
       ]
     )
-  }, children, /* @__PURE__ */ React142.createElement(ConnectModal, {
+  }, children, /* @__PURE__ */ React129.createElement(ConnectModal, {
     onClose: closeConnectModal,
     open: connectModalOpen
-  }), /* @__PURE__ */ React142.createElement(AccountModal, {
+  }), /* @__PURE__ */ React129.createElement(AccountModal, {
     onClose: closeAccountModal,
     open: accountModalOpen
-  }), /* @__PURE__ */ React142.createElement(ChainModal, {
+  }), /* @__PURE__ */ React129.createElement(ChainModal, {
     onClose: closeChainModal,
     open: chainModalOpen
-  }), /* @__PURE__ */ React142.createElement(FunCheckoutModal, {
+  }), /* @__PURE__ */ React129.createElement(FunCheckoutModal, {
     onClose: closeFunCheckoutModal,
     open: funCheckoutModalOpen,
     checkoutId: funCheckoutModalId,
     key: funCheckoutModalId
-  }), depositAddressInitialPageCombined ? /* @__PURE__ */ React142.createElement(FunCheckoutHistoryModal, {
+  }), depositAddressInitialPageCombined ? /* @__PURE__ */ React129.createElement(FunCheckoutHistoryModal, {
     onClose: closeFunCheckoutHistoryModal,
     open: funCheckoutHistoryModalOpen,
     depositAddress: deconstructDepositAddressAndInitialPage(
@@ -15129,13 +13805,13 @@ function ModalProvider({ children }) {
     initialPage: deconstructDepositAddressAndInitialPage(
       depositAddressInitialPageCombined
     ).initialPage
-  }) : null, /* @__PURE__ */ React142.createElement(FunDevTestModal, {
+  }) : null, /* @__PURE__ */ React129.createElement(FunDevTestModal, {
     onClose: closeFunDevTestModal,
     open: funDevTestModalOpen
   }));
 }
 function useModalState() {
-  const { accountModalOpen, chainModalOpen, connectModalOpen } = useContext25(ModalContext);
+  const { accountModalOpen, chainModalOpen, connectModalOpen } = useContext22(ModalContext);
   return {
     accountModalOpen,
     chainModalOpen,
@@ -15143,19 +13819,19 @@ function useModalState() {
   };
 }
 function useAccountModal() {
-  const { accountModalOpen, openAccountModal } = useContext25(ModalContext);
+  const { accountModalOpen, openAccountModal } = useContext22(ModalContext);
   return { accountModalOpen, openAccountModal };
 }
 function useChainModal() {
-  const { chainModalOpen, openChainModal } = useContext25(ModalContext);
+  const { chainModalOpen, openChainModal } = useContext22(ModalContext);
   return { chainModalOpen, openChainModal };
 }
 function useWalletConnectOpenState() {
-  const { isWalletConnectModalOpen, setIsWalletConnectModalOpen } = useContext25(ModalContext);
+  const { isWalletConnectModalOpen, setIsWalletConnectModalOpen } = useContext22(ModalContext);
   return { isWalletConnectModalOpen, setIsWalletConnectModalOpen };
 }
 function useConnectModal() {
-  const { connectModalOpen, openConnectModal } = useContext25(ModalContext);
+  const { connectModalOpen, openConnectModal } = useContext22(ModalContext);
   const { isWalletConnectModalOpen } = useWalletConnectOpenState();
   return {
     connectModalOpen: connectModalOpen || isWalletConnectModalOpen,
@@ -15163,11 +13839,11 @@ function useConnectModal() {
   };
 }
 function useFunCheckoutModal() {
-  const { funCheckoutModalOpen, openFunCheckoutModal } = useContext25(ModalContext);
+  const { funCheckoutModalOpen, openFunCheckoutModal } = useContext22(ModalContext);
   return { funCheckoutModalOpen, openFunCheckoutModal };
 }
 function useFunCheckoutHistoryModal() {
-  const { funCheckoutHistoryModalOpen, openFunCheckoutHistoryModal } = useContext25(ModalContext);
+  const { funCheckoutHistoryModalOpen, openFunCheckoutHistoryModal } = useContext22(ModalContext);
   return { funCheckoutHistoryModalOpen, openFunCheckoutHistoryModal };
 }
 
@@ -15211,7 +13887,7 @@ var isFunkitSdkConnector = (wallet) => {
 };
 var isEIP6963Connector = (wallet) => {
   var _a;
-  return !!(!wallet.isFunkitSdkConnector && ((_a = wallet.icon) == null ? void 0 : _a.startsWith("data:image")) && wallet.uid && wallet.name);
+  return !!(!wallet.isFunkitSdkConnector && ((_a = wallet.icon) == null ? void 0 : _a.replace(/\n/g, "").startsWith("data:image")) && wallet.uid && wallet.name);
 };
 var rainbowKitConnectorWithWalletConnect = (wallet, walletConnectModalConnector) => {
   const shouldUseWalletConnectModal = wallet.id === "walletConnect" && walletConnectModalConnector;
@@ -15395,7 +14071,7 @@ var ERROR_MESSAGES = {
   PRIVY_USER_NOT_INITIALIZED: "Privy user not initialized",
   FARCASTER_NOT_INITIALIZED: "Unable to initialize Farcaster login"
 };
-var FunkitWeb2Context = createContext19({
+var FunkitWeb2Context = createContext18({
   isSendingOtpEmail: false,
   isGeneratingFcUri: false,
   handleSendOtpEmail: () => Promise.resolve({ success: false, error: "" }),
@@ -15434,15 +14110,15 @@ var FunkitWeb2Provider = ({
   const { connectAsync } = useConnect2();
   const { chains } = useConfig5();
   const { connectors, disconnectAsync } = useDisconnect3();
-  const [privy, setPrivy] = useState40(null);
-  const [privyIframeUrl, setPrivyIframeUrl] = useState40();
-  const [loginMethod, setLoginMethod] = useState40(
+  const [privy, setPrivy] = useState39(null);
+  const [privyIframeUrl, setPrivyIframeUrl] = useState39();
+  const [loginMethod, setLoginMethod] = useState39(
     getLoginMethodFromCache() || null
   );
   const wallets = useWalletConnectors();
-  const [isLoggingIn, setIsLoggingIn] = useState40(false);
-  const [loginErrorMessage, setLoginErrorMessage] = useState40("");
-  const [loggedInUser, setLoggedInUser] = useState40(null);
+  const [isLoggingIn, setIsLoggingIn] = useState39(false);
+  const [loginErrorMessage, setLoginErrorMessage] = useState39("");
+  const [loggedInUser, setLoggedInUser] = useState39(null);
   const setLoginMethodAndCache = useCallback31(
     (method) => {
       try {
@@ -15458,7 +14134,7 @@ var FunkitWeb2Provider = ({
     },
     []
   );
-  useEffect31(() => {
+  useEffect30(() => {
     const newPrivy = new PrivyJS({
       appId: funkitConfig.privyAppId,
       storage: new LocalStorage(),
@@ -15660,7 +14336,7 @@ var FunkitWeb2Provider = ({
       }
     }
   }, [handleFunkitWeb2Login, initChainId, loginMethod]);
-  useEffect31(() => {
+  useEffect30(() => {
     if (privy && privyIframeUrl && isNotNullish(initChainId)) {
       const iframe = document.getElementById(
         PRIVY_IFRAME_ID
@@ -15702,7 +14378,7 @@ var FunkitWeb2Provider = ({
     },
     [privy, setLoginMethodAndCache]
   );
-  const [isSendingOtpEmail, setIsSendingOtpEmail] = useState40(false);
+  const [isSendingOtpEmail, setIsSendingOtpEmail] = useState39(false);
   const handleSendOtpEmail = useCallback31(
     async (emailAddress) => {
       try {
@@ -15730,7 +14406,7 @@ var FunkitWeb2Provider = ({
     },
     [privy, setLoginMethodAndCache]
   );
-  const [isGeneratingFcUri, setIsGeneratingFcUri] = useState40(false);
+  const [isGeneratingFcUri, setIsGeneratingFcUri] = useState39(false);
   const handleGenerateFcUri = useCallback31(async () => {
     try {
       if (!privy)
@@ -15847,15 +14523,15 @@ var FunkitWeb2Provider = ({
     handleFunkitWeb2Logout,
     web2UserInfo
   };
-  return /* @__PURE__ */ React143.createElement(FunkitWeb2Context.Provider, {
+  return /* @__PURE__ */ React130.createElement(FunkitWeb2Context.Provider, {
     value: contextValue
-  }, privyIframeUrl ? /* @__PURE__ */ React143.createElement("iframe", {
+  }, privyIframeUrl ? /* @__PURE__ */ React130.createElement("iframe", {
     id: PRIVY_IFRAME_ID,
     src: privyIframeUrl,
     style: { display: "none" }
   }) : null, children);
 };
-var useFunkitWeb2Login = () => useContext26(FunkitWeb2Context);
+var useFunkitWeb2Login = () => useContext23(FunkitWeb2Context);
 
 // src/hooks/useConnectionStatus.ts
 function useConnectionStatus() {
@@ -15878,27 +14554,27 @@ function useConnectionStatus() {
 }
 
 // src/components/FunkitProvider/ShowBalanceContext.tsx
-import React144, { createContext as createContext20, useContext as useContext27, useState as useState41 } from "react";
-var ShowBalanceContext = createContext20({
+import React131, { createContext as createContext19, useContext as useContext24, useState as useState40 } from "react";
+var ShowBalanceContext = createContext19({
   showBalance: void 0,
   setShowBalance: () => void 0
 });
 function ShowBalanceProvider({ children }) {
-  const [showBalance, setShowBalance] = useState41();
-  return /* @__PURE__ */ React144.createElement(ShowBalanceContext.Provider, {
+  const [showBalance, setShowBalance] = useState40();
+  return /* @__PURE__ */ React131.createElement(ShowBalanceContext.Provider, {
     value: { showBalance, setShowBalance }
   }, children);
 }
-var useShowBalance = () => useContext27(ShowBalanceContext);
+var useShowBalance = () => useContext24(ShowBalanceContext);
 
 // src/components/Icons/Dropdown.tsx
-import React145 from "react";
-var DropdownIcon = () => /* @__PURE__ */ React145.createElement("svg", {
+import React132 from "react";
+var DropdownIcon = () => /* @__PURE__ */ React132.createElement("svg", {
   fill: "none",
   height: "7",
   width: "14",
   xmlns: "http://www.w3.org/2000/svg"
-}, /* @__PURE__ */ React145.createElement("path", {
+}, /* @__PURE__ */ React132.createElement("path", {
   d: "M12.75 1.54001L8.51647 5.0038C7.77974 5.60658 6.72026 5.60658 5.98352 5.0038L1.75 1.54001",
   stroke: "currentColor",
   strokeLinecap: "round",
@@ -15908,14 +14584,14 @@ var DropdownIcon = () => /* @__PURE__ */ React145.createElement("svg", {
 }));
 
 // src/components/ConnectButton/ConnectButtonRenderer.tsx
-import React147, { useContext as useContext29 } from "react";
+import React134, { useContext as useContext26 } from "react";
 import { useAccount as useAccount16, useBalance, useConfig as useConfig6 } from "wagmi";
 
 // src/hooks/useIsMounted.ts
-import { useCallback as useCallback32, useEffect as useEffect32, useState as useState42 } from "react";
+import { useCallback as useCallback32, useEffect as useEffect31, useState as useState41 } from "react";
 function useIsMounted() {
-  const [isMounted, setIsMounted] = useState42(false);
-  useEffect32(() => {
+  const [isMounted, setIsMounted] = useState41(false);
+  useEffect31(() => {
     setIsMounted(true);
     return () => {
       setIsMounted(false);
@@ -15941,7 +14617,7 @@ function useMainnetEnsAvatar(name) {
 }
 
 // src/transactions/useRecentTransactions.ts
-import { useEffect as useEffect34, useState as useState44 } from "react";
+import { useEffect as useEffect33, useState as useState43 } from "react";
 import { useAccount as useAccount15 } from "wagmi";
 
 // src/hooks/useChainId.ts
@@ -15953,7 +14629,7 @@ function useChainId() {
 }
 
 // src/transactions/TransactionStoreContext.tsx
-import React146, { createContext as createContext21, useContext as useContext28, useEffect as useEffect33, useState as useState43 } from "react";
+import React133, { createContext as createContext20, useContext as useContext25, useEffect as useEffect32, useState as useState42 } from "react";
 import { useAccount as useAccount14, usePublicClient } from "wagmi";
 
 // src/transactions/transactionStore.ts
@@ -16096,30 +14772,30 @@ function createTransactionStore({
 
 // src/transactions/TransactionStoreContext.tsx
 var storeSingleton;
-var TransactionStoreContext = createContext21(null);
+var TransactionStoreContext = createContext20(null);
 function TransactionStoreProvider({
   children
 }) {
   const provider = usePublicClient();
   const { address } = useAccount14();
   const chainId = useChainId();
-  const [store] = useState43(
+  const [store] = useState42(
     () => storeSingleton != null ? storeSingleton : storeSingleton = createTransactionStore({ provider })
   );
-  useEffect33(() => {
+  useEffect32(() => {
     store.setProvider(provider);
   }, [store, provider]);
-  useEffect33(() => {
+  useEffect32(() => {
     if (address && chainId) {
       store.waitForPendingTransactions(address, chainId);
     }
   }, [store, address, chainId]);
-  return /* @__PURE__ */ React146.createElement(TransactionStoreContext.Provider, {
+  return /* @__PURE__ */ React133.createElement(TransactionStoreContext.Provider, {
     value: store
   }, children);
 }
 function useTransactionStore() {
-  const store = useContext28(TransactionStoreContext);
+  const store = useContext25(TransactionStoreContext);
   if (!store) {
     throw new Error("Transaction hooks must be used within FunkitProvider");
   }
@@ -16131,10 +14807,10 @@ function useRecentTransactions() {
   const store = useTransactionStore();
   const { address } = useAccount15();
   const chainId = useChainId();
-  const [transactions, setTransactions] = useState44(
+  const [transactions, setTransactions] = useState43(
     () => store && address && chainId ? store.getTransactions(address, chainId) : []
   );
-  useEffect34(() => {
+  useEffect33(() => {
     if (store && address && chainId) {
       setTransactions(store.getTransactions(address, chainId));
       return store.onChange(() => {
@@ -16146,8 +14822,8 @@ function useRecentTransactions() {
 }
 
 // src/components/FunkitProvider/ShowRecentTransactionsContext.ts
-import { createContext as createContext22 } from "react";
-var ShowRecentTransactionsContext = createContext22(false);
+import { createContext as createContext21 } from "react";
+var ShowRecentTransactionsContext = createContext21(false);
 
 // src/components/ConnectButton/abbreviateETHBalance.ts
 var units = ["k", "m", "b", "t"];
@@ -16197,7 +14873,7 @@ function ConnectButtonRenderer({
   const chainIconUrl = (_c = funkitConnectChain == null ? void 0 : funkitConnectChain.iconUrl) != null ? _c : void 0;
   const chainIconBackground = (_d = funkitConnectChain == null ? void 0 : funkitConnectChain.iconBackground) != null ? _d : void 0;
   const resolvedChainIconUrl = useAsyncImage(chainIconUrl);
-  const showRecentTransactions = useContext29(ShowRecentTransactionsContext);
+  const showRecentTransactions = useContext26(ShowRecentTransactionsContext);
   const hasPendingTransactions = useRecentTransactions().some(({ status }) => status === "pending") && showRecentTransactions;
   const { showBalance } = useShowBalance();
   const computeShouldShowBalance = () => {
@@ -16218,7 +14894,7 @@ function ConnectButtonRenderer({
   const { openChainModal } = useChainModal();
   const { openAccountModal } = useAccountModal();
   const { accountModalOpen, chainModalOpen, connectModalOpen } = useModalState();
-  return /* @__PURE__ */ React147.createElement(React147.Fragment, null, children({
+  return /* @__PURE__ */ React134.createElement(React134.Fragment, null, children({
     account: address ? {
       address,
       balanceDecimals: balanceData == null ? void 0 : balanceData.decimals,
@@ -16266,8 +14942,8 @@ function ChainSelectorButton({
   chain
 }) {
   var _a, _b;
-  const { i18n: i18n2 } = useContext30(I18nContext);
-  return /* @__PURE__ */ React148.createElement(Box, {
+  const { i18n: i18n2 } = useContext27(I18nContext);
+  return /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     "aria-label": "Chain Selector",
     as: "button",
@@ -16293,37 +14969,37 @@ function ChainSelectorButton({
     testId: unsupportedChain ? "wrong-network-button" : "chain-button",
     transition: "default",
     type: "button"
-  }, unsupportedChain ? /* @__PURE__ */ React148.createElement(Box, {
+  }, unsupportedChain ? /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     display: "flex",
     height: "24",
     paddingX: "4"
-  }, i18n2.t("connect_wallet.wrong_network.label")) : /* @__PURE__ */ React148.createElement(Box, {
+  }, i18n2.t("connect_wallet.wrong_network.label")) : /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     display: "flex",
     gap: "6"
-  }, chain.hasIcon ? /* @__PURE__ */ React148.createElement(Box, {
+  }, chain.hasIcon ? /* @__PURE__ */ React135.createElement(Box, {
     display: mapResponsiveValue(
       chainStatus,
       (value) => value === "full" || value === "icon" ? "block" : "none"
     ),
     height: "24",
     width: "24"
-  }, /* @__PURE__ */ React148.createElement(AsyncImage, {
+  }, /* @__PURE__ */ React135.createElement(AsyncImage, {
     alt: (_a = chain.name) != null ? _a : "Chain icon",
     background: chain.iconBackground,
     borderRadius: "full",
     height: "24",
     src: chain.iconUrl,
     width: "24"
-  })) : null, /* @__PURE__ */ React148.createElement(Box, {
+  })) : null, /* @__PURE__ */ React135.createElement(Box, {
     display: mapResponsiveValue(chainStatus, (value) => {
       if (value === "icon" && !chain.iconUrl) {
         return "block";
       }
       return value === "full" || value === "name" ? "block" : "none";
     })
-  }, (_b = chain.name) != null ? _b : chain.id)), /* @__PURE__ */ React148.createElement(DropdownIcon, null));
+  }, (_b = chain.name) != null ? _b : chain.id)), /* @__PURE__ */ React135.createElement(DropdownIcon, null));
 }
 function AccountButton({
   openAccountModal,
@@ -16332,7 +15008,7 @@ function AccountButton({
   accountStatus
 }) {
   const { userInfo } = useGeneralWallet();
-  return /* @__PURE__ */ React148.createElement(Box, {
+  return /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     as: "button",
     background: "accentColor",
@@ -16350,14 +15026,14 @@ function AccountButton({
     testId: "account-button",
     transition: "default",
     type: "button"
-  }, account.displayBalance && /* @__PURE__ */ React148.createElement(Box, {
+  }, account.displayBalance && /* @__PURE__ */ React135.createElement(Box, {
     display: mapResponsiveValue(
       showBalance,
       (value) => value ? "block" : "none"
     ),
     padding: "8",
     paddingLeft: "12"
-  }, account.displayBalance), /* @__PURE__ */ React148.createElement(Box, {
+  }, account.displayBalance), /* @__PURE__ */ React135.createElement(Box, {
     background: "connectButtonInnerBackground",
     borderColor: "accentColor",
     borderRadius: "connectButton",
@@ -16369,32 +15045,32 @@ function AccountButton({
     paddingX: "8",
     paddingY: "6",
     transition: "default"
-  }, /* @__PURE__ */ React148.createElement(Box, {
+  }, /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     display: "flex",
     gap: "6",
     height: "24"
-  }, /* @__PURE__ */ React148.createElement(Box, {
+  }, /* @__PURE__ */ React135.createElement(Box, {
     display: mapResponsiveValue(
       accountStatus,
       (value) => value === "full" || value === "avatar" ? "block" : "none"
     )
-  }, /* @__PURE__ */ React148.createElement(Avatar, {
+  }, /* @__PURE__ */ React135.createElement(Avatar, {
     address: account.address,
     imageUrl: account.ensAvatar || userInfo.iconSrc,
     loading: account.hasPendingTransactions,
     size: 24
-  })), /* @__PURE__ */ React148.createElement(Box, {
+  })), /* @__PURE__ */ React135.createElement(Box, {
     alignItems: "center",
     display: "flex",
     gap: "6"
-  }, /* @__PURE__ */ React148.createElement(Box, {
+  }, /* @__PURE__ */ React135.createElement(Box, {
     display: mapResponsiveValue(
       accountStatus,
       (value) => value === "full" || value === "address" ? "block" : "none"
     ),
     style: { textWrap: "nowrap" }
-  }, userInfo.nameTruncated), /* @__PURE__ */ React148.createElement(DropdownIcon, null)))));
+  }, userInfo.nameTruncated), /* @__PURE__ */ React135.createElement(DropdownIcon, null)))));
 }
 function ConnectButton({
   accountStatus = defaultProps.accountStatus,
@@ -16407,14 +15083,14 @@ function ConnectButton({
   const chains = useFunkitConnectChains();
   const connectionStatus = useConnectionStatus();
   const { setShowBalance } = useShowBalance();
-  const [ready, setReady] = useState45(false);
-  const { i18n: i18n2 } = useContext30(I18nContext);
-  useEffect35(() => {
+  const [ready, setReady] = useState44(false);
+  const { i18n: i18n2 } = useContext27(I18nContext);
+  useEffect34(() => {
     setShowBalance(showBalance);
     if (!ready)
       setReady(true);
   }, [showBalance, setShowBalance, ready]);
-  return ready ? /* @__PURE__ */ React148.createElement(ConnectButtonRenderer, null, ({
+  return ready ? /* @__PURE__ */ React135.createElement(ConnectButtonRenderer, null, ({
     account,
     chain,
     mounted,
@@ -16425,7 +15101,7 @@ function ConnectButton({
     var _a;
     const ready2 = mounted && connectionStatus !== "loading";
     const unsupportedChain = (_a = chain == null ? void 0 : chain.unsupported) != null ? _a : false;
-    return /* @__PURE__ */ React148.createElement(Box, {
+    return /* @__PURE__ */ React135.createElement(Box, {
       display: "flex",
       gap: "12",
       ...!ready2 && {
@@ -16436,17 +15112,17 @@ function ConnectButton({
           userSelect: "none"
         }
       }
-    }, ready2 && account && connectionStatus === "connected" ? /* @__PURE__ */ React148.createElement(React148.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React148.createElement(ChainSelectorButton, {
+    }, ready2 && account && connectionStatus === "connected" ? /* @__PURE__ */ React135.createElement(React135.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React135.createElement(ChainSelectorButton, {
       unsupportedChain,
       chainStatus,
       openChainModal,
       chain
-    }), !unsupportedChain && /* @__PURE__ */ React148.createElement(AccountButton, {
+    }), !unsupportedChain && /* @__PURE__ */ React135.createElement(AccountButton, {
       openAccountModal,
       account,
       showBalance,
       accountStatus
-    })) : /* @__PURE__ */ React148.createElement(Box, {
+    })) : /* @__PURE__ */ React135.createElement(Box, {
       as: "button",
       background: "accentColor",
       borderRadius: "connectButton",
@@ -16465,19 +15141,19 @@ function ConnectButton({
       testId: "connect-button",
       transition: "default",
       type: "button"
-    }, /* @__PURE__ */ React148.createElement(Box, {
+    }, /* @__PURE__ */ React135.createElement(Box, {
       display: "flex",
       gap: "8",
       alignItems: "center"
     }, mounted && label === "Connect Wallet" ? i18n2.t("connect_wallet.label") : label, suffixIcon)));
-  }) : /* @__PURE__ */ React148.createElement(React148.Fragment, null);
+  }) : /* @__PURE__ */ React135.createElement(React135.Fragment, null);
 }
 ConnectButton.__defaultProps = defaultProps;
 ConnectButton.Custom = ConnectButtonRenderer;
 
 // src/components/FunkitProvider/FunkitProvider.tsx
 import { QueryClientProvider } from "@tanstack/react-query";
-import React149, { createContext as createContext23, useContext as useContext31 } from "react";
+import React139, { createContext as createContext23, useContext as useContext28 } from "react";
 import { useAccountEffect as useAccountEffect3, WagmiProvider } from "wagmi";
 
 // src/config/getDefaultConfig.ts
@@ -16500,6 +15176,11 @@ var computeWalletConnectMetaData = ({
   };
 };
 
+// src/utils/colors.ts
+var isHexString = (color) => {
+  return /^#([0-9a-f]{3}){1,2}$/i.test(color);
+};
+
 // src/utils/omitUndefinedValues.ts
 function omitUndefinedValues(obj) {
   return Object.fromEntries(
@@ -17287,26 +15968,47 @@ function validateFunkitProviderProps(props) {
   validateTheme(props);
 }
 
+// src/components/FunkitProvider/AppContext.ts
+import { createContext as createContext22 } from "react";
+var defaultAppInfo = {
+  appName: void 0,
+  disclaimer: void 0,
+  learnMoreUrl: "https://learn.rainbow.me/understanding-web3?utm_source=rainbowkit&utm_campaign=learnmore"
+};
+var AppContext = createContext22(defaultAppInfo);
+
 // src/components/FunkitProvider/useFingerprint.ts
-import { useCallback as useCallback33, useEffect as useEffect36 } from "react";
+import { useCallback as useCallback33, useEffect as useEffect35 } from "react";
 var storageKey6 = "funkit-connect-version";
 function setFunkitConnectVersion({ version }) {
   localStorage.setItem(storageKey6, version);
 }
 function getCurrentSdkVersion() {
-  return "1.4.0";
+  return "1.4.2";
 }
 function useFingerprint() {
   const fingerprint = useCallback33(() => {
     setFunkitConnectVersion({ version: getCurrentSdkVersion() });
   }, []);
-  useEffect36(() => {
+  useEffect35(() => {
     fingerprint();
   }, [fingerprint]);
 }
 
 // src/components/FunkitProvider/usePreloadImages.ts
-import { useCallback as useCallback34, useEffect as useEffect37 } from "react";
+import { useCallback as useCallback34, useEffect as useEffect36 } from "react";
+
+// src/components/Icons/Assets.tsx
+import React137 from "react";
+var src = async () => (await import("./assets-26YY4GVD.js")).default;
+var preloadAssetsIcon = () => loadImages(src);
+
+// src/components/Icons/Login.tsx
+import React138 from "react";
+var src2 = async () => (await import("./login-ZSMM5UYL.js")).default;
+var preloadLoginIcon = () => loadImages(src2);
+
+// src/components/FunkitProvider/usePreloadImages.ts
 function usePreloadImages() {
   const funkitConnectChains = useFunkitConnectChains();
   const walletConnectors = useWalletConnectors();
@@ -17324,7 +16026,7 @@ function usePreloadImages() {
       loadImages(signInIcon);
     }
   }, [walletConnectors, funkitConnectChains, isUnauthenticated]);
-  useEffect37(() => {
+  useEffect36(() => {
     preloadImages();
   }, [preloadImages]);
 }
@@ -17358,9 +16060,9 @@ function FunkitProvider(props) {
     !!props.debug,
     getCurrentSdkVersion()
   );
-  const MainChild = /* @__PURE__ */ React149.createElement(FunkitThemeProvider, {
+  const MainChild = /* @__PURE__ */ React139.createElement(FunkitThemeProvider, {
     theme: props.theme
-  }, /* @__PURE__ */ React149.createElement(FunkitProviderInner, {
+  }, /* @__PURE__ */ React139.createElement(FunkitProviderInner, {
     appInfo: props.appInfo,
     avatar: props.avatar,
     id: props.id,
@@ -17371,9 +16073,9 @@ function FunkitProvider(props) {
     sandbox: props.sandbox,
     modalSize: props.modalSize
   }, props.children));
-  return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React149.createElement(WagmiProvider, {
+  return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React139.createElement(WagmiProvider, {
     config: finalWagmiConfig
-  }, /* @__PURE__ */ React149.createElement(QueryClientProvider, {
+  }, /* @__PURE__ */ React139.createElement(QueryClientProvider, {
     client: finalQueryClient
   }, MainChild)) : MainChild;
 }
@@ -17403,35 +16105,35 @@ function FunkitProviderInner({
   const modalSizeFinal = modalSize || ModalSizeOptions.WIDE;
   const coolMode = false;
   const showRecentTransactions = false;
-  return /* @__PURE__ */ React149.createElement(FunkitConfigContext.Provider, {
+  return /* @__PURE__ */ React139.createElement(FunkitConfigContext.Provider, {
     value: funkitConfig
-  }, /* @__PURE__ */ React149.createElement(FunkitConnectChainProvider, {
+  }, /* @__PURE__ */ React139.createElement(FunkitConnectChainProvider, {
     initialChain
-  }, /* @__PURE__ */ React149.createElement(WalletButtonProvider, null, /* @__PURE__ */ React149.createElement(I18nProvider, {
+  }, /* @__PURE__ */ React139.createElement(WalletButtonProvider, null, /* @__PURE__ */ React139.createElement(I18nProvider, {
     locale
-  }, /* @__PURE__ */ React149.createElement(CoolModeContext.Provider, {
+  }, /* @__PURE__ */ React139.createElement(CoolModeContext.Provider, {
     value: coolMode
-  }, /* @__PURE__ */ React149.createElement(ModalSizeProvider, {
+  }, /* @__PURE__ */ React139.createElement(ModalSizeProvider, {
     modalSize: modalSizeFinal
-  }, /* @__PURE__ */ React149.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React149.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React149.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React149.createElement(ShowRecentTransactionsContext.Provider, {
+  }, /* @__PURE__ */ React139.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React139.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React139.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React139.createElement(ShowRecentTransactionsContext.Provider, {
     value: showRecentTransactions
-  }, /* @__PURE__ */ React149.createElement(FunkitSandboxContext.Provider, {
+  }, /* @__PURE__ */ React139.createElement(FunkitSandboxContext.Provider, {
     value: isSandboxMode
-  }, /* @__PURE__ */ React149.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React149.createElement(TransactionStoreProvider, null, /* @__PURE__ */ React149.createElement(AvatarContext.Provider, {
+  }, /* @__PURE__ */ React139.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React139.createElement(TransactionStoreProvider, null, /* @__PURE__ */ React139.createElement(AvatarContext.Provider, {
     value: avatarContext
-  }, /* @__PURE__ */ React149.createElement(AppContext.Provider, {
+  }, /* @__PURE__ */ React139.createElement(AppContext.Provider, {
     value: appContext
-  }, /* @__PURE__ */ React149.createElement(ThemeIdContext2.Provider, {
+  }, /* @__PURE__ */ React139.createElement(ThemeIdContext2.Provider, {
     value: id
-  }, /* @__PURE__ */ React149.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React149.createElement(FunToastProvider, null, /* @__PURE__ */ React149.createElement(FunkitMoonpayProvider, {
+  }, /* @__PURE__ */ React139.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React139.createElement(FunToastProvider, null, /* @__PURE__ */ React139.createElement(FunkitMoonpayProvider, {
     debug: !!debug
-  }, /* @__PURE__ */ React149.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React149.createElement("div", {
+  }, /* @__PURE__ */ React139.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React139.createElement("div", {
     ...createThemeRootProps2(id),
     style: {
       width: "100%",
       height: "100%"
     }
-  }, /* @__PURE__ */ React149.createElement("style", {
+  }, /* @__PURE__ */ React139.createElement("style", {
     dangerouslySetInnerHTML: {
       __html: [
         `${selector}{${cssStringFromTheme(
@@ -17443,18 +16145,18 @@ function FunkitProviderInner({
 }
 
 // src/components/WalletButton/WalletButton.tsx
-import React151, { useContext as useContext33 } from "react";
+import React141, { useContext as useContext30 } from "react";
 
 // src/components/WalletButton/WalletButton.css.ts
 var border = "_85s11r0";
 var maxWidth = "_85s11r1";
 
 // src/components/WalletButton/WalletButtonRenderer.tsx
-import React150, {
-  useContext as useContext32,
-  useEffect as useEffect38,
+import React140, {
+  useContext as useContext29,
+  useEffect as useEffect37,
   useMemo as useMemo36,
-  useState as useState46
+  useState as useState45
 } from "react";
 import { useAccount as useAccount17, useAccountEffect as useAccountEffect4 } from "wagmi";
 function WalletButtonRenderer({
@@ -17464,16 +16166,16 @@ function WalletButtonRenderer({
   const isMounted = useIsMounted();
   const { openConnectModal } = useConnectModal();
   const { connectModalOpen } = useModalState();
-  const { connector, setConnector } = useContext32(WalletButtonContext);
+  const { connector, setConnector } = useContext29(WalletButtonContext);
   const [firstConnector] = useWalletConnectors().filter((wallet2) => wallet2.isFunkitSdkConnector).filter((_wallet) => _wallet.id.toLowerCase() === wallet.toLowerCase()).sort((a, b) => a.groupIndex - b.groupIndex);
   if (!firstConnector) {
     throw new Error("Connector not found");
   }
   const connectionStatus = useConnectionStatus();
-  const [loading, setLoading] = useState46(false);
-  const [isError, setIsError] = useState46(false);
+  const [loading, setLoading] = useState45(false);
+  const [isError, setIsError] = useState45(false);
   const mobile = isMobile();
-  useEffect38(() => {
+  useEffect37(() => {
     if (!connectModalOpen && connector)
       setConnector(null);
   }, [connectModalOpen, connector, setConnector]);
@@ -17510,7 +16212,7 @@ function WalletButtonRenderer({
   const isStatusLoading = connectionStatus === "loading";
   const ready = !isConnecting && !!openConnectModal && firstConnector && !isStatusLoading;
   const isNotSupported = !(firstConnector == null ? void 0 : firstConnector.installed) || !(firstConnector == null ? void 0 : firstConnector.ready);
-  return /* @__PURE__ */ React150.createElement(React150.Fragment, null, children({
+  return /* @__PURE__ */ React140.createElement(React140.Fragment, null, children({
     error: isError,
     loading,
     connected: isLastWalletIdConnected,
@@ -17531,15 +16233,15 @@ function WalletButtonRenderer({
 
 // src/components/WalletButton/WalletButton.tsx
 var WalletButton = ({ wallet }) => {
-  const { i18n: i18n2 } = useContext33(I18nContext);
-  return /* @__PURE__ */ React151.createElement(WalletButtonRenderer, {
+  const { i18n: i18n2 } = useContext30(I18nContext);
+  return /* @__PURE__ */ React141.createElement(WalletButtonRenderer, {
     wallet
   }, ({ ready, connect, connected, mounted, connector, loading }) => {
     const isDisabled = !ready || loading;
     const connectorName = (connector == null ? void 0 : connector.name) || "";
     if (!mounted)
       return;
-    return /* @__PURE__ */ React151.createElement(Box, {
+    return /* @__PURE__ */ React141.createElement(Box, {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
@@ -17547,7 +16249,7 @@ var WalletButton = ({ wallet }) => {
       style: {
         pointerEvents: isDisabled ? "none" : "all"
       }
-    }, /* @__PURE__ */ React151.createElement(Box, {
+    }, /* @__PURE__ */ React141.createElement(Box, {
       as: "button",
       borderRadius: "menuButton",
       borderStyle: "solid",
@@ -17569,7 +16271,7 @@ var WalletButton = ({ wallet }) => {
       transition: "default",
       width: "full",
       background: "connectButtonBackground"
-    }, /* @__PURE__ */ React151.createElement(Box, {
+    }, /* @__PURE__ */ React141.createElement(Box, {
       color: "modalText",
       fontFamily: "body",
       fontSize: "16",
@@ -17577,28 +16279,28 @@ var WalletButton = ({ wallet }) => {
       transition: "default",
       display: "flex",
       alignItems: "center"
-    }, /* @__PURE__ */ React151.createElement(Box, {
+    }, /* @__PURE__ */ React141.createElement(Box, {
       alignItems: "center",
       display: "flex",
       flexDirection: "row",
       gap: "12",
       paddingRight: "6"
-    }, /* @__PURE__ */ React151.createElement(Box, null, loading ? /* @__PURE__ */ React151.createElement(SpinnerIcon, null) : /* @__PURE__ */ React151.createElement(AsyncImage, {
+    }, /* @__PURE__ */ React141.createElement(Box, null, loading ? /* @__PURE__ */ React141.createElement(SpinnerIcon, null) : /* @__PURE__ */ React141.createElement(AsyncImage, {
       background: connector == null ? void 0 : connector.iconBackground,
       borderRadius: "6",
       height: "28",
       src: connector == null ? void 0 : connector.iconUrl,
       width: "28"
-    })), /* @__PURE__ */ React151.createElement(Box, {
+    })), /* @__PURE__ */ React141.createElement(Box, {
       alignItems: "center",
       display: "flex",
       flexDirection: "column",
       color: "modalText"
-    }, /* @__PURE__ */ React151.createElement(Box, {
+    }, /* @__PURE__ */ React141.createElement(Box, {
       testId: `wallet-button-label-${(connector == null ? void 0 : connector.id) || ""}`
     }, loading ? i18n2.t("connect.status.connecting", {
       wallet: connectorName
-    }) : connectorName)), connected ? /* @__PURE__ */ React151.createElement(Box, {
+    }) : connectorName)), connected ? /* @__PURE__ */ React141.createElement(Box, {
       background: "connectionIndicator",
       borderColor: "selectedOptionBorder",
       borderRadius: "full",
@@ -17635,608 +16337,218 @@ function getDefaultWallets(parameters) {
   };
 }
 
-// src/components/ConnectOptions/MobileOptions.tsx
-import React152, {
-  useCallback as useCallback35,
-  useContext as useContext34,
-  useEffect as useEffect39,
-  useRef as useRef12,
-  useState as useState47
-} from "react";
-
-// src/components/ConnectOptions/MobileOptions.css.ts
-var rotatingBorder = "_1dcc7392";
-var scroll = "_1dcc7390";
-var spinner = "_1dcc7393";
-
-// src/components/ConnectOptions/MobileOptions.tsx
-var LoadingSpinner = ({ wallet }) => {
-  const width = 80;
-  const height = 80;
-  const radiusFactor = 20;
-  const perimeter = 2 * (width + height - 4 * radiusFactor);
-  return /* @__PURE__ */ React152.createElement("svg", {
-    className: spinner,
-    viewBox: "0 0 86 86",
-    width: "86",
-    height: "86"
-  }, /* @__PURE__ */ React152.createElement("title", null, "Loading"), /* @__PURE__ */ React152.createElement("rect", {
-    x: "3",
-    y: "3",
-    width,
-    height,
-    rx: radiusFactor,
-    ry: radiusFactor,
-    strokeDasharray: `${perimeter / 3} ${2 * perimeter / 3}`,
-    strokeDashoffset: perimeter,
-    className: rotatingBorder,
-    style: {
-      stroke: (wallet == null ? void 0 : wallet.iconAccent) || "#0D3887"
-    }
-  }));
-};
-function WalletButton2({
-  onClose,
-  wallet,
-  connecting
-}) {
-  const {
-    connect,
-    iconBackground,
-    iconUrl,
-    id,
-    name,
-    getMobileUri,
-    ready,
-    shortName,
-    showWalletConnectModal
-  } = wallet;
-  const coolModeRef = useCoolMode(iconUrl);
-  const initialized = useRef12(false);
-  const { i18n: i18n2 } = useContext34(I18nContext);
-  const onConnect = useCallback35(async () => {
-    const onMobileUri = async () => {
-      const mobileUri = await (getMobileUri == null ? void 0 : getMobileUri());
-      if (!mobileUri)
-        return;
-      if (mobileUri) {
-        setWalletConnectDeepLink({ mobileUri, name });
-      }
-      if (mobileUri.startsWith("http")) {
-        const link = document.createElement("a");
-        link.href = mobileUri;
-        link.target = "_blank";
-        link.rel = "noreferrer noopener";
-        link.click();
-      } else {
-        window.location.href = mobileUri;
-      }
-    };
-    if (id !== "walletConnect")
-      onMobileUri();
-    if (showWalletConnectModal) {
-      showWalletConnectModal();
-      onClose == null ? void 0 : onClose();
-      return;
-    }
-    connect == null ? void 0 : connect();
-  }, [connect, getMobileUri, showWalletConnectModal, onClose, name, id]);
-  useEffect39(() => {
-    if (connecting && !initialized.current) {
-      onConnect();
-      initialized.current = true;
-    }
-  }, [connecting, onConnect]);
-  return /* @__PURE__ */ React152.createElement(Box, {
-    as: "button",
-    color: ready ? "modalText" : "modalTextSecondary",
-    disabled: !ready,
-    fontFamily: "body",
-    key: id,
-    onClick: onConnect,
-    ref: coolModeRef,
-    style: { overflow: "visible", textAlign: "center" },
-    testId: `wallet-option-${id}`,
-    type: "button",
-    width: "full"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    paddingBottom: "8",
-    paddingTop: "10",
-    position: "relative"
-  }, connecting ? /* @__PURE__ */ React152.createElement(LoadingSpinner, {
-    wallet
-  }) : null, /* @__PURE__ */ React152.createElement(AsyncImage, {
-    background: iconBackground,
-    borderRadius: "13",
-    boxShadow: "walletLogo",
-    height: "60",
-    src: iconUrl,
-    width: "60"
-  })), !connecting ? /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    textAlign: "center"
-  }, /* @__PURE__ */ React152.createElement(Text, {
-    as: "h2",
-    color: wallet.ready ? "modalText" : "modalTextSecondary",
-    size: "13",
-    weight: "medium"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    as: "span",
-    position: "relative"
-  }, shortName != null ? shortName : name, !wallet.ready && " (unsupported)")), wallet.recent && /* @__PURE__ */ React152.createElement(Text, {
-    color: "accentColor",
-    size: "12",
-    weight: "medium"
-  }, i18n2.t("connect.recent"))) : null));
-}
-function MobileOptions({ onClose }) {
-  var _a;
-  const titleId = "rk_connect_title";
-  const wallets = useWalletConnectors().filter(
-    (wallet) => wallet.isFunkitSdkConnector
-  );
-  const { disclaimer: Disclaimer, learnMoreUrl } = useContext34(AppContext);
-  let headerLabel = null;
-  let walletContent = null;
-  let headerBackgroundContrast = false;
-  let headerBackButtonLink = null;
-  const [walletStep, setWalletStep] = useState47(
-    "CONNECT" /* Connect */
-  );
-  const { i18n: i18n2 } = useContext34(I18nContext);
-  const ios = isIOS();
-  switch (walletStep) {
-    case "CONNECT" /* Connect */: {
-      headerLabel = i18n2.t("connect.title");
-      headerBackgroundContrast = true;
-      walletContent = /* @__PURE__ */ React152.createElement(Box, null, /* @__PURE__ */ React152.createElement(Box, {
-        background: "profileForeground",
-        className: scroll,
-        display: "flex",
-        paddingBottom: "20",
-        paddingTop: "6"
-      }, /* @__PURE__ */ React152.createElement(Box, {
-        display: "flex",
-        style: { margin: "0 auto" }
-      }, wallets.filter((wallet) => wallet.ready).map((wallet) => {
-        return /* @__PURE__ */ React152.createElement(Box, {
-          key: wallet.id,
-          paddingX: "20"
-        }, /* @__PURE__ */ React152.createElement(Box, {
-          width: "60"
-        }, /* @__PURE__ */ React152.createElement(WalletButton2, {
-          onClose,
-          wallet
-        })));
-      }))), /* @__PURE__ */ React152.createElement(Box, {
-        background: "generalBorder",
-        height: "1",
-        marginBottom: "32",
-        marginTop: "-1"
-      }), /* @__PURE__ */ React152.createElement(Box, {
-        alignItems: "center",
-        display: "flex",
-        flexDirection: "column",
-        gap: "32",
-        paddingX: "32",
-        style: { textAlign: "center" }
-      }, /* @__PURE__ */ React152.createElement(Box, {
-        display: "flex",
-        flexDirection: "column",
-        gap: "8",
-        textAlign: "center"
-      }, /* @__PURE__ */ React152.createElement(Text, {
-        color: "modalText",
-        size: "16",
-        weight: "bold"
-      }, i18n2.t("intro.title")), /* @__PURE__ */ React152.createElement(Text, {
-        color: "modalTextSecondary",
-        size: "16"
-      }, i18n2.t("intro.description")))), /* @__PURE__ */ React152.createElement(Box, {
-        paddingTop: "32",
-        paddingX: "20"
-      }, /* @__PURE__ */ React152.createElement(Box, {
-        display: "flex",
-        gap: "14",
-        justifyContent: "center"
-      }, /* @__PURE__ */ React152.createElement(ActionButton, {
-        label: i18n2.t("intro.get.label"),
-        onClick: () => setWalletStep("GET" /* Get */),
-        size: "large",
-        type: "secondary"
-      }), /* @__PURE__ */ React152.createElement(ActionButton, {
-        href: learnMoreUrl,
-        label: i18n2.t("intro.learn_more.label"),
-        size: "large",
-        type: "secondary"
-      }))), Disclaimer && /* @__PURE__ */ React152.createElement(Box, {
-        marginTop: "28",
-        marginX: "32",
-        textAlign: "center"
-      }, /* @__PURE__ */ React152.createElement(Disclaimer, {
-        Link: DisclaimerLink,
-        Text: DisclaimerText
-      })));
-      break;
-    }
-    case "GET" /* Get */: {
-      headerLabel = i18n2.t("get.title");
-      headerBackButtonLink = "CONNECT" /* Connect */;
-      const mobileWallets = (_a = wallets == null ? void 0 : wallets.filter(
-        (wallet) => {
-          var _a2, _b, _c;
-          return ((_a2 = wallet.downloadUrls) == null ? void 0 : _a2.ios) || ((_b = wallet.downloadUrls) == null ? void 0 : _b.android) || ((_c = wallet.downloadUrls) == null ? void 0 : _c.mobile);
-        }
-      )) == null ? void 0 : _a.splice(0, 3);
-      walletContent = /* @__PURE__ */ React152.createElement(Box, null, /* @__PURE__ */ React152.createElement(Box, {
-        alignItems: "center",
-        display: "flex",
-        flexDirection: "column",
-        height: "full",
-        marginBottom: "36",
-        marginTop: "5",
-        paddingTop: "12",
-        width: "full"
-      }, mobileWallets.map((wallet, index) => {
-        const { downloadUrls, iconBackground, iconUrl, name } = wallet;
-        if (!(downloadUrls == null ? void 0 : downloadUrls.ios) && !(downloadUrls == null ? void 0 : downloadUrls.android) && !(downloadUrls == null ? void 0 : downloadUrls.mobile)) {
-          return null;
-        }
-        return /* @__PURE__ */ React152.createElement(Box, {
-          display: "flex",
-          gap: "16",
-          key: wallet.id,
-          paddingX: "20",
-          width: "full"
-        }, /* @__PURE__ */ React152.createElement(Box, {
-          style: { minHeight: 48, minWidth: 48 }
-        }, /* @__PURE__ */ React152.createElement(AsyncImage, {
-          background: iconBackground,
-          borderColor: "generalBorder",
-          borderRadius: "10",
-          height: "48",
-          src: iconUrl,
-          width: "48"
-        })), /* @__PURE__ */ React152.createElement(Box, {
-          display: "flex",
-          flexDirection: "column",
-          width: "full"
-        }, /* @__PURE__ */ React152.createElement(Box, {
-          alignItems: "center",
-          display: "flex",
-          height: "48"
-        }, /* @__PURE__ */ React152.createElement(Box, {
-          width: "full"
-        }, /* @__PURE__ */ React152.createElement(Text, {
-          color: "modalText",
-          size: "18",
-          weight: "bold"
-        }, name)), /* @__PURE__ */ React152.createElement(ActionButton, {
-          href: (ios ? downloadUrls == null ? void 0 : downloadUrls.ios : downloadUrls == null ? void 0 : downloadUrls.android) || (downloadUrls == null ? void 0 : downloadUrls.mobile),
-          label: i18n2.t("get.action.label"),
-          size: "small",
-          type: "secondary"
-        })), index < mobileWallets.length - 1 && /* @__PURE__ */ React152.createElement(Box, {
-          background: "generalBorderDim",
-          height: "1",
-          marginY: "10",
-          width: "full"
-        })));
-      })), /* @__PURE__ */ React152.createElement(Box, {
-        style: { marginBottom: "42px" }
-      }), /* @__PURE__ */ React152.createElement(Box, {
-        alignItems: "center",
-        display: "flex",
-        flexDirection: "column",
-        gap: "36",
-        paddingX: "36",
-        style: { textAlign: "center" }
-      }, /* @__PURE__ */ React152.createElement(Box, {
-        display: "flex",
-        flexDirection: "column",
-        gap: "12",
-        textAlign: "center"
-      }, /* @__PURE__ */ React152.createElement(Text, {
-        color: "modalText",
-        size: "16",
-        weight: "bold"
-      }, i18n2.t("get.looking_for.title")), /* @__PURE__ */ React152.createElement(Text, {
-        color: "modalTextSecondary",
-        size: "16"
-      }, i18n2.t("get.looking_for.mobile.description")))));
-      break;
-    }
-  }
-  return /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    flexDirection: "column",
-    paddingBottom: "36"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    background: headerBackgroundContrast ? "profileForeground" : "modalBackground",
-    display: "flex",
-    flexDirection: "column",
-    paddingBottom: "4",
-    paddingTop: "14"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    justifyContent: "center",
-    paddingBottom: "6",
-    paddingX: "20",
-    position: "relative"
-  }, headerBackButtonLink && /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    position: "absolute",
-    style: {
-      left: 0,
-      marginBottom: -20,
-      marginTop: -20
-    }
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    alignItems: "center",
-    as: "button",
-    className: touchableStyles({
-      active: "shrinkSm",
-      hover: "growLg"
-    }),
-    color: "accentColor",
-    display: "flex",
-    marginLeft: "4",
-    marginTop: "20",
-    onClick: () => setWalletStep(headerBackButtonLink),
-    padding: "16",
-    style: { height: 17, willChange: "transform" },
-    transition: "default",
-    type: "button"
-  }, /* @__PURE__ */ React152.createElement(BackIcon, null))), /* @__PURE__ */ React152.createElement(Box, {
-    marginTop: "4",
-    textAlign: "center",
-    width: "full"
-  }, /* @__PURE__ */ React152.createElement(Text, {
-    as: "h1",
-    color: "modalText",
-    id: titleId,
-    size: "20",
-    weight: "bold"
-  }, headerLabel)), /* @__PURE__ */ React152.createElement(Box, {
-    alignItems: "center",
-    display: "flex",
-    height: "32",
-    paddingRight: "14",
-    position: "absolute",
-    right: "0"
-  }, /* @__PURE__ */ React152.createElement(Box, {
-    style: { marginBottom: -20, marginTop: -20 }
-  }, /* @__PURE__ */ React152.createElement(CloseButton, {
-    onClose
-  }))))), /* @__PURE__ */ React152.createElement(Box, {
-    display: "flex",
-    flexDirection: "column"
-  }, walletContent));
-}
-
 // src/__private__/index.ts
 var __private__ = {
-  DesktopOptions,
   dialogContent,
-  dialogContentMobile,
-  MobileOptions
+  dialogContentMobile
 };
 
 // src/components/Icons/FunkitPaymentsIconLine.tsx
-import React153 from "react";
+import React142 from "react";
 function MetaMaskPaymentIcon({ size = 16 }) {
-  return /* @__PURE__ */ React153.createElement("svg", {
+  return /* @__PURE__ */ React142.createElement("svg", {
     width: size,
     height: size,
     viewBox: "0 0 28 28",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
-  }, /* @__PURE__ */ React153.createElement("path", {
+  }, /* @__PURE__ */ React142.createElement("path", {
     d: "M24.0891 3.1199L15.3446 9.61456L16.9617 5.7828L24.0891 3.1199Z",
     fill: "#E2761B",
     stroke: "#E2761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M3.90207 3.1199L12.5763 9.67608L11.0383 5.7828L3.90207 3.1199Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M20.9429 18.1745L18.6139 21.7426L23.597 23.1136L25.0295 18.2536L20.9429 18.1745Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M2.97929 18.2536L4.40301 23.1136L9.38607 21.7426L7.05713 18.1745L2.97929 18.2536Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.10483 12.1456L7.71626 14.2461L12.6642 14.4658L12.4884 9.14877L9.10483 12.1456Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M18.8864 12.1456L15.4589 9.08725L15.3446 14.4658L20.2837 14.2461L18.8864 12.1456Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.38606 21.7426L12.3566 20.2925L9.79033 18.2888L9.38606 21.7426Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.6347 20.2925L18.6139 21.7426L18.2009 18.2888L15.6347 20.2925Z",
     fill: "#E4761B",
     stroke: "#E4761B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M18.6139 21.7426L15.6347 20.2925L15.8719 22.2348L15.8456 23.0521L18.6139 21.7426Z",
     fill: "#D7C1B3",
     stroke: "#D7C1B3",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.38606 21.7426L12.1544 23.0521L12.1368 22.2348L12.3566 20.2925L9.38606 21.7426Z",
     fill: "#D7C1B3",
     stroke: "#D7C1B3",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M12.1984 17.0056L9.72002 16.2762L11.4689 15.4765L12.1984 17.0056Z",
     fill: "#233447",
     stroke: "#233447",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.7928 17.0056L16.5223 15.4765L18.28 16.2762L15.7928 17.0056Z",
     fill: "#233447",
     stroke: "#233447",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.38606 21.7426L9.80791 18.1745L7.05712 18.2536L9.38606 21.7426Z",
     fill: "#CD6116",
     stroke: "#CD6116",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M18.1921 18.1745L18.6139 21.7426L20.9429 18.2536L18.1921 18.1745Z",
     fill: "#CD6116",
     stroke: "#CD6116",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M20.2837 14.2461L15.3446 14.4658L15.8016 17.0057L16.5311 15.4765L18.2888 16.2762L20.2837 14.2461Z",
     fill: "#CD6116",
     stroke: "#CD6116",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.72002 16.2762L11.4777 15.4765L12.1984 17.0057L12.6642 14.4658L7.71626 14.2461L9.72002 16.2762Z",
     fill: "#CD6116",
     stroke: "#CD6116",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M7.71626 14.2461L9.79033 18.2888L9.72002 16.2762L7.71626 14.2461Z",
     fill: "#E4751F",
     stroke: "#E4751F",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M18.2888 16.2762L18.2009 18.2888L20.2837 14.2461L18.2888 16.2762Z",
     fill: "#E4751F",
     stroke: "#E4751F",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M12.6642 14.4658L12.1984 17.0057L12.7784 20.0025L12.9102 16.0565L12.6642 14.4658Z",
     fill: "#E4751F",
     stroke: "#E4751F",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.3446 14.4658L15.1073 16.0477L15.2128 20.0025L15.8016 17.0057L15.3446 14.4658Z",
     fill: "#E4751F",
     stroke: "#E4751F",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.8016 17.0056L15.2128 20.0025L15.6347 20.2925L18.2009 18.2888L18.2888 16.2762L15.8016 17.0056Z",
     fill: "#F6851B",
     stroke: "#F6851B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.72002 16.2762L9.79033 18.2888L12.3566 20.2925L12.7784 20.0025L12.1984 17.0056L9.72002 16.2762Z",
     fill: "#F6851B",
     stroke: "#F6851B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.8456 23.0521L15.8719 22.2348L15.6522 22.0414H12.339L12.1368 22.2348L12.1544 23.0521L9.38606 21.7426L10.3528 22.5336L12.3126 23.8958H15.6786L17.6472 22.5336L18.6139 21.7426L15.8456 23.0521Z",
     fill: "#C0AD9E",
     stroke: "#C0AD9E",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.6347 20.2925L15.2128 20.0025H12.7784L12.3566 20.2925L12.1368 22.2348L12.339 22.0414H15.6522L15.8719 22.2348L15.6347 20.2925Z",
     fill: "#161616",
     stroke: "#161616",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M24.4583 10.0364L25.2053 6.45072L24.0891 3.1199L15.6347 9.39485L18.8864 12.1456L23.4827 13.4903L24.5022 12.3038L24.0628 11.9874L24.7658 11.3459L24.221 10.924L24.924 10.3879L24.4583 10.0364Z",
     fill: "#763D16",
     stroke: "#763D16",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M2.79472 6.45072L3.54174 10.0364L3.06717 10.3879L3.77024 10.924L3.23415 11.3459L3.93722 11.9874L3.4978 12.3038L4.50847 13.4903L9.10483 12.1456L12.3566 9.39485L3.90207 3.1199L2.79472 6.45072Z",
     fill: "#763D16",
     stroke: "#763D16",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M23.4827 13.4903L18.8864 12.1456L20.2837 14.2461L18.2009 18.2888L20.9429 18.2536H25.0295L23.4827 13.4903Z",
     fill: "#F6851B",
     stroke: "#F6851B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M9.10484 12.1456L4.50848 13.4903L2.97929 18.2536H7.05713L9.79033 18.2888L7.71626 14.2461L9.10484 12.1456Z",
     fill: "#F6851B",
     stroke: "#F6851B",
     strokeWidth: "0.0878845",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M15.3446 14.4658L15.6347 9.39485L16.9705 5.7828H11.0383L12.3566 9.39485L12.6642 14.4658L12.7696 16.0653L12.7784 20.0025H15.2128L15.2304 16.0653L15.3446 14.4658Z",
     fill: "#F6851B",
     stroke: "#F6851B",
@@ -18246,29 +16558,29 @@ function MetaMaskPaymentIcon({ size = 16 }) {
   }));
 }
 function MastercardPaymentIcon({ size = 16 }) {
-  return /* @__PURE__ */ React153.createElement("svg", {
+  return /* @__PURE__ */ React142.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     height: size,
     viewBox: "0 0 152.407 108"
-  }, /* @__PURE__ */ React153.createElement("g", null, /* @__PURE__ */ React153.createElement("rect", {
+  }, /* @__PURE__ */ React142.createElement("g", null, /* @__PURE__ */ React142.createElement("rect", {
     width: "152.407",
     height: "108",
     fill: "transparent"
-  }), /* @__PURE__ */ React153.createElement("g", null, /* @__PURE__ */ React153.createElement("rect", {
+  }), /* @__PURE__ */ React142.createElement("g", null, /* @__PURE__ */ React142.createElement("rect", {
     x: "60.4117",
     y: "25.6968",
     width: "31.5",
     height: "56.6064",
     fill: "#ff5f00"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M382.20839,306a35.9375,35.9375,0,0,1,13.7499-28.3032,36,36,0,1,0,0,56.6064A35.938,35.938,0,0,1,382.20839,306Z",
     transform: "translate(-319.79649 -252)",
     fill: "#eb001b"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M454.20349,306a35.99867,35.99867,0,0,1-58.2452,28.3032,36.00518,36.00518,0,0,0,0-56.6064A35.99867,35.99867,0,0,1,454.20349,306Z",
     transform: "translate(-319.79649 -252)",
     fill: "#f79e1b"
-  }), /* @__PURE__ */ React153.createElement("path", {
+  }), /* @__PURE__ */ React142.createElement("path", {
     d: "M450.76889,328.3077v-1.1589h.4673v-.2361h-1.1901v.2361h.4675v1.1589Zm2.3105,0v-1.3973h-.3648l-.41959.9611-.41971-.9611h-.365v1.3973h.2576v-1.054l.3935.9087h.2671l.39351-.911v1.0563Z",
     transform: "translate(-319.79649 -252)",
     fill: "#f79e1b"
@@ -18278,29 +16590,29 @@ function FunkitPaymentsIconLine({
   size = 16,
   gap = "2"
 }) {
-  return /* @__PURE__ */ React153.createElement(Box, {
+  return /* @__PURE__ */ React142.createElement(Box, {
     display: "flex",
     flexDirection: "row",
     gap,
     alignItems: "center",
     justifyContent: "center"
-  }, /* @__PURE__ */ React153.createElement(MetaMaskPaymentIcon, {
+  }, /* @__PURE__ */ React142.createElement(MetaMaskPaymentIcon, {
     size
-  }), /* @__PURE__ */ React153.createElement(MastercardPaymentIcon, {
+  }), /* @__PURE__ */ React142.createElement(MastercardPaymentIcon, {
     size
-  }), /* @__PURE__ */ React153.createElement(CoinbaseIcon, {
+  }), /* @__PURE__ */ React142.createElement(CoinbaseIcon, {
     size
   }));
 }
 
 // src/transactions/useAddRecentTransaction.ts
-import { useCallback as useCallback36 } from "react";
+import { useCallback as useCallback35 } from "react";
 import { useAccount as useAccount18 } from "wagmi";
 function useAddRecentTransaction() {
   const store = useTransactionStore();
   const { address } = useAccount18();
   const chainId = useChainId();
-  return useCallback36(
+  return useCallback35(
     (transaction) => {
       if (!address || !chainId) {
         throw new Error("No address or chain ID found");