solariskit 1.0.0 → 1.2.0

package/dist/{WalletButton-DkkREZEg.d.ts → WalletButton-B-bj9FNL.d.ts}

@@ -1,7 +1,6 @@
 
-import { o as WalletInstance } from "./Wallet-B3fOxQx_.js";
+import { o as WalletInstance } from "./Wallet-epUweMuA.js";
 import React, { JSX, ReactNode } from "react";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { Address } from "viem";
 import { Chain } from "wagmi/chains";
 import { RequiredConditionalValue } from "@vanilla-extract/sprinkles";
@@ -96,7 +95,7 @@ declare const responsiveProperties: {
     };
     display: {
       values: {
-        block: {
+        flex: {
           defaultClass: string;
           conditions: {
             smallScreen: string;
@@ -110,7 +109,7 @@ declare const responsiveProperties: {
             largeScreen: string;
           };
         };
-        flex: {
+        block: {
           defaultClass: string;
           conditions: {
             smallScreen: string;
@@ -186,7 +185,7 @@ declare function RainbowKitProvider({
   modalSize,
   showRecentTransactions,
   theme
-}: RainbowKitProviderProps): _$react_jsx_runtime0.JSX.Element;
+}: RainbowKitProviderProps): React.JSX.Element;
 //#endregion
 //#region src/components/RainbowKitProvider/AuthenticationContext.d.ts
 type AuthenticationStatus = "loading" | "unauthenticated" | "authenticated";
@@ -217,7 +216,7 @@ declare function RainbowKitAuthenticationProvider<Message = unknown>({
   children,
   enabled,
   status
-}: RainbowKitAuthenticationProviderProps<Message>): _$react_jsx_runtime0.JSX.Element;
+}: RainbowKitAuthenticationProviderProps<Message>): React.JSX.Element;
 //#endregion
 //#region src/components/ConnectButton/ConnectButtonRenderer.d.ts
 interface ConnectButtonRendererProps {
@@ -253,7 +252,7 @@ interface ConnectButtonRendererProps {
 }
 declare function ConnectButtonRenderer({
   children
-}: ConnectButtonRendererProps): _$react_jsx_runtime0.JSX.Element;
+}: ConnectButtonRendererProps): React.JSX.Element;
 declare namespace ConnectButtonRenderer {
   var displayName: string;
 }
@@ -272,7 +271,7 @@ declare function ConnectButton({
   chainStatus,
   label,
   showBalance
-}: ConnectButtonProps): _$react_jsx_runtime0.JSX.Element | null;
+}: ConnectButtonProps): React.JSX.Element | null;
 declare namespace ConnectButton {
   var __defaultProps: {
     readonly accountStatus: "full";

package/dist/{WalletButton-DiROWLU6.js → WalletButton-CsbqNc5l.js}

@@ -2,9 +2,10 @@
 import React, { Fragment, createContext, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from "react";
 import { createMapValueFn, createNormalizeValueFn } from "@vanilla-extract/sprinkles/createUtils";
 import { createSprinkles } from "@vanilla-extract/sprinkles/createRuntimeSprinkles";
-import { useBalance, useConfig, useConnect, useConnection, useConnectionEffect, useConnectors, useDisconnect, useEnsAvatar, useEnsName, usePublicClient, useSignMessage, useSwitchChain } from "wagmi";
+import { useBalance, useChainId, useConfig, useConnect, useConnection, useConnectionEffect, useConnectors, useDisconnect, useEnsAvatar, useEnsName, usePublicClient, useSignMessage, useSwitchChain } from "wagmi";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
+import { polyconDataUri } from "@akshatmittal/polycons";
 import { UserRejectedRequestError, formatUnits, isAddress } from "viem";
 import { normalize } from "viem/ens";
 import { mainnet } from "wagmi/chains";
@@ -1591,7 +1592,7 @@ function AsyncImage({ alt, background, borderColor, borderRadius, useAsImage, bo
 		width: typeof width === "string" ? width : void 0,
 		testId,
 		children: [/* @__PURE__ */ jsx(Box, {
-			...isRemoteImage ? {
+			...src ? isRemoteImage ? {
 				"aria-hidden": true,
 				as: "img",
 				onLoad: setRemoteImageLoaded,
@@ -1600,7 +1601,7 @@ function AsyncImage({ alt, background, borderColor, borderRadius, useAsImage, bo
 				"aria-hidden": true,
 				as: "img",
 				src
-			},
+			} : { "aria-hidden": true },
 			height: "full",
 			position: "absolute",
 			...ios ? { WebkitUserSelect: "none" } : {},
@@ -1658,125 +1659,6 @@ const SpinnerIcon = ({ height = 21, width = 21 }) => {
 	});
 };
 
-//#endregion
-//#region src/components/Avatar/polyconDataUri.ts
-const neutralPairs = [
-	["#FF5C16", "#FCFCFC"],
-	["#FF5C16", "#131416"],
-	["#D075FF", "#FCFCFC"],
-	["#D075FF", "#131416"],
-	["#BAF24A", "#FCFCFC"],
-	["#BAF24A", "#131416"],
-	["#89B0FF", "#FCFCFC"],
-	["#89B0FF", "#131416"],
-	["#FCFCFC", "#FF5C16"],
-	["#131416", "#FF5C16"],
-	["#FCFCFC", "#D075FF"],
-	["#131416", "#D075FF"],
-	["#FCFCFC", "#BAF24A"],
-	["#131416", "#BAF24A"],
-	["#FCFCFC", "#89B0FF"],
-	["#131416", "#89B0FF"]
-];
-const tonalPairs = [
-	["#FFA680", "#FF5C16"],
-	["#661800", "#FF5C16"],
-	["#EAC2FF", "#D075FF"],
-	["#3D065F", "#D075FF"],
-	["#E5FFC3", "#BAF24A"],
-	["#013330", "#BAF24A"],
-	["#CCE7FF", "#89B0FF"],
-	["#190066", "#89B0FF"],
-	["#FF5C16", "#FFA680"],
-	["#FF5C16", "#661800"],
-	["#D075FF", "#EAC2FF"],
-	["#D075FF", "#3D065F"],
-	["#BAF24A", "#E5FFC3"],
-	["#BAF24A", "#013330"],
-	["#89B0FF", "#CCE7FF"],
-	["#89B0FF", "#190066"],
-	["#661800", "#FFA680"],
-	["#FFA680", "#661800"],
-	["#3D065F", "#EAC2FF"],
-	["#EAC2FF", "#3D065F"],
-	["#013330", "#E5FFC3"],
-	["#E5FFC3", "#013330"],
-	["#190066", "#CCE7FF"],
-	["#CCE7FF", "#190066"]
-];
-const complementaryPairs = [
-	["#EAC2FF", "#013330"],
-	["#013330", "#EAC2FF"],
-	["#CCE7FF", "#661800"],
-	["#661800", "#CCE7FF"],
-	["#E5FFC3", "#3D065F"],
-	["#3D065F", "#E5FFC3"],
-	["#FFA680", "#190066"],
-	["#190066", "#FFA680"],
-	["#CCE7FF", "#013330"],
-	["#013330", "#CCE7FF"]
-];
-const colorPairs = [
-	...neutralPairs,
-	...tonalPairs,
-	...complementaryPairs
-];
-function hashSeed(seed) {
-	let hash = 0;
-	for (let i = 0; i < seed.length; i++) hash = seed.charCodeAt(i) + (hash << 6) + (hash << 16) - hash;
-	return hash;
-}
-function polyconDataUri(seed, size) {
-	const hash = hashSeed(seed.length < 6 ? seed.padEnd(6, " ") : seed);
-	const [backgroundColor, foregroundColor] = colorPairs[Math.abs(hash) % colorPairs.length] ?? ["#FF5C16", "#FCFCFC"];
-	const grid = 2;
-	const margin = size * .25;
-	const cellSize = (size - 2 * margin) / grid;
-	const filledGrid = Array.from({ length: grid }, () => Array.from({ length: grid }, () => false));
-	const stack = [[Math.floor(grid / 2), Math.floor(grid / 2)]];
-	let pathData = "";
-	if (filledGrid[1]) filledGrid[1][1] = true;
-	while (stack.length > 0) {
-		const currentCell = stack.pop();
-		if (!currentCell) continue;
-		const [x, y] = currentCell;
-		const cellHash = Math.abs(hash >> x * 3 + y * 5) & 15;
-		const neighbors = [];
-		for (const [dx, dy] of [
-			[0, 1],
-			[1, 0],
-			[0, -1],
-			[-1, 0]
-		]) {
-			const nextX = x + dx;
-			const nextY = y + dy;
-			if (nextX >= 0 && nextX < grid && nextY >= 0 && nextY < grid && !filledGrid[nextX]?.[nextY]) neighbors.push([nextX, nextY]);
-		}
-		while (neighbors.length > 0) {
-			const neighborIndex = Math.abs(cellHash + neighbors.length) % neighbors.length;
-			const nextCell = neighbors.splice(neighborIndex, 1)[0];
-			if (!nextCell) continue;
-			const [nextX, nextY] = nextCell;
-			stack.push(nextCell);
-			if (filledGrid[nextX]) filledGrid[nextX][nextY] = true;
-		}
-		const rotation = cellHash % 4 * 90;
-		const isSquare = cellHash % 5 === 0;
-		const cx = margin + x * cellSize;
-		const cy = margin + y * cellSize;
-		if (isSquare) {
-			pathData += `M${cx},${cy} h${cellSize} v${cellSize} h-${cellSize}z `;
-			continue;
-		}
-		if (rotation === 0) pathData += `M${cx},${cy} h${cellSize} v${cellSize}z `;
-		else if (rotation === 90) pathData += `M${cx + cellSize},${cy} v${cellSize} h-${cellSize}z `;
-		else if (rotation === 180) pathData += `M${cx + cellSize},${cy + cellSize} h-${cellSize} v-${cellSize}z `;
-		else pathData += `M${cx},${cy + cellSize} v-${cellSize} h${cellSize}z `;
-	}
-	const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${size} ${size}"><rect width="${size}" height="${size}" fill="${backgroundColor}"/><path d="${pathData.trim()}" fill="${foregroundColor}"/></svg>`;
-	return `data:image/svg+xml,${encodeURIComponent(svg)}`;
-}
-
 //#endregion
 //#region src/components/Avatar/EmojiAvatar.tsx
 const EmojiAvatar = ({ address, ensImage, size }) => {
@@ -1895,6 +1777,12 @@ const DropdownIcon = () => /* @__PURE__ */ jsxs("svg", {
 	})]
 });
 
+//#endregion
+//#region src/utils/isChainIdSupported.ts
+function isChainIdSupported(chains, chainId) {
+	return chainId != null && chains.some((chain) => chain.id === chainId);
+}
+
 //#endregion
 //#region src/components/RainbowKitProvider/provideRainbowKitChains.ts
 const getChainIconUrl = (chainId) => `https://static.createmytoken.com/images/chains/${chainId}.png`;
@@ -1912,15 +1800,32 @@ const RainbowKitChainContext = createContext({
 });
 function RainbowKitChainProvider({ chainSearchThreshold = 5, children, initialChain }) {
 	const { chains } = useConfig();
+	const { status } = useConnection();
+	const wagmiChainId = useChainId();
+	const { mutate: switchChain } = useSwitchChain();
+	const appliedInitialChainIdRef = useRef(void 0);
+	const initialChainId = typeof initialChain === "number" ? initialChain : initialChain?.id;
+	const configuredInitialChainId = isChainIdSupported(chains, initialChainId) ? initialChainId : void 0;
+	useEffect(() => {
+		if (status !== "disconnected" || configuredInitialChainId == null) return;
+		if (appliedInitialChainIdRef.current === configuredInitialChainId) return;
+		appliedInitialChainIdRef.current = configuredInitialChainId;
+		if (wagmiChainId !== configuredInitialChainId) switchChain({ chainId: configuredInitialChainId });
+	}, [
+		configuredInitialChainId,
+		status,
+		switchChain,
+		wagmiChainId
+	]);
 	return /* @__PURE__ */ jsx(RainbowKitChainContext.Provider, {
 		value: useMemo(() => ({
 			chains: provideRainbowKitChains(chains),
 			chainSearchThreshold,
-			initialChainId: typeof initialChain === "number" ? initialChain : initialChain?.id
+			initialChainId
 		}), [
 			chainSearchThreshold,
 			chains,
-			initialChain
+			initialChainId
 		]),
 		children
 	});
@@ -2242,9 +2147,16 @@ function useProfile({ address, includeBalance }) {
 	};
 }
 
+//#endregion
+//#region src/hooks/useSelectedChainId.ts
+function useSelectedChainId(connectedChainId) {
+	const wagmiChainId = useChainId();
+	return connectedChainId ?? wagmiChainId;
+}
+
 //#endregion
 //#region src/hooks/useChainId.ts
-function useChainId() {
+function useChainId$1() {
 	const { chain: activeChain } = useConnection();
 	return activeChain?.id ?? null;
 }
@@ -2394,7 +2306,7 @@ const TransactionStoreContext = React.createContext(null);
 function TransactionStoreProvider({ children }) {
 	const provider = usePublicClient();
 	const { address } = useConnection();
-	const chainId = useChainId();
+	const chainId = useChainId$1();
 	const { refetch } = useBalance({
 		address,
 		query: { enabled: false }
@@ -2440,7 +2352,7 @@ function useTransactionStore() {
 function useRecentTransactions() {
 	const store = useTransactionStore();
 	const { address } = useConnection();
-	const chainId = useChainId();
+	const chainId = useChainId$1();
 	const [transactions, setTransactions] = useState(() => store && address && chainId ? store.getTransactions(address, chainId) : []);
 	useEffect(() => {
 		if (store && address && chainId) {
@@ -2696,7 +2608,7 @@ function setRainbowKitVersion({ version }) {
 }
 function useFingerprint() {
 	const fingerprint = useCallback(() => {
-		setRainbowKitVersion({ version: "1.0.0" });
+		setRainbowKitVersion({ version: "1.2.0" });
 	}, []);
 	useEffect(() => {
 		fingerprint();
@@ -2769,7 +2681,8 @@ function addRecentWalletId(walletId) {
 function useWalletConnectors(mergeEIP6963WithRkConnectors = false) {
 	const rainbowKitChains = useRainbowKitChains();
 	const initialChainId = useInitialChainId();
-	const { connectAsync } = useConnect();
+	const selectedChainId = useChainId();
+	const { mutateAsync: connect } = useConnect();
 	const defaultCreatedConnectors = useConnectors();
 	const { setIsWalletConnectModalOpen } = useWalletConnectOpenState();
 	const defaultConnectors = defaultCreatedConnectors.map((connector) => ({
@@ -2778,9 +2691,9 @@ function useWalletConnectors(mergeEIP6963WithRkConnectors = false) {
 	}));
 	async function connectWallet(connector, parameters) {
 		const walletChainId = await connector.getChainId();
-		const result = await connectAsync({
+		const result = await connect({
 			...parameters,
-			chainId: parameters?.chainId ?? initialChainId ?? rainbowKitChains.find(({ id }) => id === walletChainId)?.id ?? rainbowKitChains[0]?.id,
+			chainId: parameters?.chainId ?? selectedChainId ?? initialChainId ?? (isChainIdSupported(rainbowKitChains, walletChainId) ? walletChainId : void 0) ?? rainbowKitChains[0]?.id,
 			connector
 		});
 		if (result) addRecentWalletId(connector.id);
@@ -2860,7 +2773,7 @@ function useWalletConnectors(mergeEIP6963WithRkConnectors = false) {
 
 //#endregion
 //#region src/components/Icons/Assets.tsx
-const src$1 = async () => (await import("./assets-CTAKUsg7.js")).default;
+const src$1 = async () => (await import("./assets-DGFjAppz.js")).default;
 const preloadAssetsIcon = () => loadImages(src$1);
 const AssetsIcon = () => /* @__PURE__ */ jsx(AsyncImage, {
 	background: "#d0d5de",
@@ -2872,7 +2785,7 @@ const AssetsIcon = () => /* @__PURE__ */ jsx(AsyncImage, {
 
 //#endregion
 //#region src/components/Icons/Login.tsx
-const src = async () => (await import("./login-jACia2OZ.js")).default;
+const src = async () => (await import("./login-VHg-UliQ.js")).default;
 const preloadLoginIcon = () => loadImages(src);
 const LoginIcon = () => /* @__PURE__ */ jsx(AsyncImage, {
 	background: "#d0d5de",
@@ -3030,7 +2943,7 @@ const CloseButton = ({ "aria-label": ariaLabel = "Close", onClose }) => {
 
 //#endregion
 //#region src/components/SignIn/SignIn.tsx
-const signInIcon = async () => (await import("./sign-CzTxopYk.js")).default;
+const signInIcon = async () => (await import("./sign-DqCbFd_U.js")).default;
 function SignIn({ onClose, onCloseModal }) {
 	const [{ status, ...state }, setState] = React.useState({ status: "idle" });
 	const authAdapter = useAuthenticationAdapter();
@@ -3057,7 +2970,7 @@ function SignIn({ onClose, onCloseModal }) {
 	}, [getNonce]);
 	const mobile = isMobile();
 	const { address, chain: activeChain } = useConnection();
-	const { signMessageAsync } = useSignMessage();
+	const { mutateAsync: signMessage } = useSignMessage();
 	const signIn = async () => {
 		try {
 			const chainId = activeChain?.id;
@@ -3092,7 +3005,7 @@ function SignIn({ onClose, onCloseModal }) {
 					...x,
 					status: "signing"
 				}));
-				signature = await signMessageAsync({ message });
+				signature = await signMessage({ message });
 			} catch (error) {
 				if (error instanceof UserRejectedRequestError) return setState((x) => ({
 					...x,
@@ -3481,9 +3394,7 @@ function abbreviateETHBalance(number) {
 //#endregion
 //#region src/components/ConnectButton/formatAddress.ts
 function formatAddress(address) {
-	const leadingChars = 4;
-	const trailingChars = 4;
-	return address.length < leadingChars + trailingChars ? address : `${address.substring(0, leadingChars)}\u2026${address.substring(address.length - trailingChars)}`;
+	return address.length < 8 ? address : `${address.substring(0, 4)}\u2026${address.substring(address.length - 4)}`;
 }
 
 //#endregion
@@ -3543,7 +3454,7 @@ const DisconnectIcon = () => /* @__PURE__ */ jsxs("svg", {
 function useClearRecentTransactions() {
 	const store = useTransactionStore();
 	const { address } = useConnection();
-	const chainId = useChainId();
+	const chainId = useChainId$1();
 	return useCallback(() => {
 		if (!address || !chainId) throw new Error("No address or chain ID found");
 		store.clearTransactions(address, chainId);
@@ -3954,7 +3865,7 @@ function AccountModal({ onClose, open }) {
 		address,
 		includeBalance: open
 	});
-	const { disconnect } = useDisconnect();
+	const { mutate: disconnect } = useDisconnect();
 	if (!address) return null;
 	return /* @__PURE__ */ jsx(Fragment$1, { children: address && /* @__PURE__ */ jsx(Dialog, {
 		onClose,
@@ -4128,28 +4039,24 @@ var SearchInputClassName = "_5a0qia2";
 //#endregion
 //#region src/components/ChainModal/ChainModal.tsx
 function ChainModal({ onClose, open }) {
-	const { chainId } = useConnection();
+	const { chainId: connectedChainId, isConnected } = useConnection();
+	const currentChainId = useSelectedChainId(connectedChainId);
 	const { chains } = useConfig();
 	const [pendingChainId, setPendingChainId] = useState(null);
 	const [searchQuery, setSearchQuery] = useState("");
-	const { switchChain } = useSwitchChain({ mutation: {
+	const { mutate: switchChain } = useSwitchChain({ mutation: {
 		onMutate: ({ chainId: _chainId }) => {
 			setPendingChainId(_chainId);
 		},
-		onSuccess: () => {
-			if (pendingChainId) setPendingChainId(null);
-		},
-		onError: () => {
-			if (pendingChainId) setPendingChainId(null);
-		},
 		onSettled: () => {
+			setPendingChainId(null);
 			onClose();
 		}
 	} });
-	const { disconnect } = useDisconnect();
+	const { mutate: disconnect } = useDisconnect();
 	const titleId = "rk_chain_modal_title";
 	const mobile = isMobile();
-	const isCurrentChainSupported = chains.some((chain) => chain.id === chainId);
+	const isConnectedToUnsupportedChain = isConnected && !isChainIdSupported(chains, connectedChainId);
 	const chainIconSize = mobile ? "36" : "28";
 	const rainbowkitChains = useRainbowKitChains();
 	const chainSearchThreshold = useChainSearchThreshold();
@@ -4162,7 +4069,6 @@ function ChainModal({ onClose, open }) {
 	useEffect(() => {
 		if (!open) setSearchQuery("");
 	}, [open]);
-	if (!chainId) return null;
 	return /* @__PURE__ */ jsx(Dialog, {
 		onClose,
 		open,
@@ -4197,7 +4103,7 @@ function ChainModal({ onClose, open }) {
 							/* @__PURE__ */ jsx(CloseButton, { onClose })
 						]
 					}),
-					!isCurrentChainSupported && /* @__PURE__ */ jsx(Box, {
+					isConnectedToUnsupportedChain && /* @__PURE__ */ jsx(Box, {
 						marginX: "8",
 						textAlign: mobile ? "center" : "left",
 						children: /* @__PURE__ */ jsx(Text, {
@@ -4230,7 +4136,7 @@ function ChainModal({ onClose, open }) {
 							filteredChains.map(({ iconBackground, iconUrl, id, name }, idx) => {
 								return /* @__PURE__ */ jsx(Chain$1, {
 									chainId: id,
-									currentChainId: chainId,
+									currentChainId,
 									switchChain,
 									chainIconSize,
 									isLoading: pendingChainId === id,
@@ -4251,7 +4157,7 @@ function ChainModal({ onClose, open }) {
 									children: t("chains.search.no_results")
 								})
 							}),
-							!isCurrentChainSupported && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Box, {
+							isConnectedToUnsupportedChain && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Box, {
 								background: "generalBorderDim",
 								height: "1",
 								marginX: "8"
@@ -4808,12 +4714,6 @@ function ConnectDetail({ compactModeEnabled, connectionError, onClose, qrCodeUri
 
 //#endregion
 //#region src/components/ConnectOptions/DesktopOptions.tsx
-let WalletStep = /* @__PURE__ */ function(WalletStep) {
-	WalletStep["None"] = "NONE";
-	WalletStep["LearnCompact"] = "LEARN_COMPACT";
-	WalletStep["Connect"] = "CONNECT";
-	return WalletStep;
-}({});
 function DesktopOptions({ onClose }) {
 	const titleId = "rk_connect_title";
 	const [selectedOptionId, setSelectedOptionId] = useState();
@@ -4821,7 +4721,7 @@ function DesktopOptions({ onClose }) {
 	const [qrCodeUri, setQrCodeUri] = useState();
 	const hasQrCode = !!selectedWallet?.qrCode && qrCodeUri;
 	const [connectionError, setConnectionError] = useState(false);
-	const [walletStep, setWalletStep] = useState(WalletStep.None);
+	const [walletStep, setWalletStep] = useState("NONE");
 	const compactModeEnabled = useContext(ModalSizeContext) === ModalSizeOptions.COMPACT;
 	const { disclaimer: Disclaimer } = useContext(AppContext);
 	const safari = isSafari();
@@ -4858,7 +4758,7 @@ function DesktopOptions({ onClose }) {
 		setQrCodeUri(uri);
 		setTimeout(() => {
 			setSelectedWallet(sWallet);
-			changeWalletStep(WalletStep.Connect);
+			changeWalletStep("CONNECT");
 		}, uri ? 0 : 50);
 	};
 	const selectWallet = async (wallet) => {
@@ -4877,7 +4777,7 @@ function DesktopOptions({ onClose }) {
 	selectWalletRef.current = selectWallet;
 	useEffect(() => {
 		if (connector && !initialized.current) {
-			setWalletStep(WalletStep.Connect);
+			setWalletStep("CONNECT");
 			selectWalletRef.current?.(connector);
 			initialized.current = true;
 		}
@@ -4898,18 +4798,18 @@ function DesktopOptions({ onClose }) {
 		setConnectionError(false);
 	}, [walletStep, selectedWallet]);
 	switch (walletStep) {
-		case WalletStep.None:
+		case "NONE":
 			walletContent = /* @__PURE__ */ jsx(ConnectModalIntro, { getWallet: () => window.open(GET_WALLET_URL, "_blank", "noopener,noreferrer") });
 			break;
-		case WalletStep.LearnCompact:
+		case "LEARN_COMPACT":
 			walletContent = /* @__PURE__ */ jsx(ConnectModalIntro, {
 				compactModeEnabled,
 				getWallet: () => window.open(GET_WALLET_URL, "_blank", "noopener,noreferrer")
 			});
 			headerLabel = t("intro.title");
-			headerBackButtonLink = WalletStep.None;
+			headerBackButtonLink = "NONE";
 			break;
-		case WalletStep.Connect:
+		case "CONNECT":
 			walletContent = selectedWallet && /* @__PURE__ */ jsx(ConnectDetail, {
 				compactModeEnabled,
 				connectionError,
@@ -4919,7 +4819,7 @@ function DesktopOptions({ onClose }) {
 				wallet: selectedWallet
 			});
 			headerLabel = hasQrCode && (selectedWallet.name === "WalletConnect" ? t("connect_scan.fallback_title") : t("connect_scan.title", { wallet: selectedWallet.name }));
-			headerBackButtonLink = compactModeEnabled ? connector ? null : WalletStep.None : null;
+			headerBackButtonLink = compactModeEnabled ? connector ? null : "NONE" : null;
 			headerBackButtonCallback = compactModeEnabled ? !connector ? clearSelectedWallet : () => {} : () => {};
 			break;
 		default: break;
@@ -4928,7 +4828,7 @@ function DesktopOptions({ onClose }) {
 		display: "flex",
 		flexDirection: "row",
 		style: { maxHeight: compactModeEnabled ? 468 : 504 },
-		children: [(compactModeEnabled ? walletStep === WalletStep.None : true) && /* @__PURE__ */ jsxs(Box, {
+		children: [(compactModeEnabled ? walletStep === "NONE" : true) && /* @__PURE__ */ jsxs(Box, {
 			className: compactModeEnabled ? "_1c95jmh4" : "_1c95jmh3",
 			display: "flex",
 			flexDirection: "column",
@@ -4941,7 +4841,7 @@ function DesktopOptions({ onClose }) {
 						compactModeEnabled && Disclaimer && /* @__PURE__ */ jsx(Box, {
 							marginLeft: "16",
 							width: "28",
-							children: /* @__PURE__ */ jsx(InfoButton, { onClick: () => changeWalletStep(WalletStep.LearnCompact) })
+							children: /* @__PURE__ */ jsx(InfoButton, { onClick: () => changeWalletStep("LEARN_COMPACT") })
 						}),
 						compactModeEnabled && !Disclaimer && /* @__PURE__ */ jsx(Box, {
 							marginLeft: "16",
@@ -5038,7 +4938,7 @@ function DesktopOptions({ onClose }) {
 								hover: "grow"
 							}),
 							cursor: "pointer",
-							onClick: () => changeWalletStep(WalletStep.LearnCompact),
+							onClick: () => changeWalletStep("LEARN_COMPACT"),
 							paddingY: "4",
 							style: { willChange: "transform" },
 							transition: "default",
@@ -5052,7 +4952,7 @@ function DesktopOptions({ onClose }) {
 					})]
 				})] })
 			]
-		}), (compactModeEnabled ? walletStep !== WalletStep.None : true) && /* @__PURE__ */ jsxs(Fragment$1, { children: [!compactModeEnabled && /* @__PURE__ */ jsx(Box, {
+		}), (compactModeEnabled ? walletStep !== "NONE" : true) && /* @__PURE__ */ jsxs(Fragment$1, { children: [!compactModeEnabled && /* @__PURE__ */ jsx(Box, {
 			background: "generalBorder",
 			minWidth: "1",
 			width: "1"
@@ -5137,7 +5037,7 @@ const LoadingSpinner = ({ wallet }) => {
 	const width = 80;
 	const height = 80;
 	const radiusFactor = 20;
-	const perimeter = 2 * (width + height - 4 * radiusFactor);
+	const perimeter = 2 * (160 - 4 * radiusFactor);
 	return /* @__PURE__ */ jsxs("svg", {
 		className: spinner,
 		viewBox: "0 0 86 86",
@@ -5458,7 +5358,7 @@ function ConnectOptions({ onClose }) {
 function ConnectModal({ onClose, open }) {
 	const titleId = "rk_connect_title";
 	const connectionStatus = useConnectionStatus();
-	const { disconnect } = useDisconnect();
+	const { mutate: disconnect } = useDisconnect();
 	const { isConnecting } = useConnection();
 	const onAuthCancel = React.useCallback(() => {
 		onClose();
@@ -5524,7 +5424,7 @@ function ModalProvider({ children }) {
 	const connectionStatus = useConnectionStatus();
 	const { chainId } = useConnection();
 	const { chains } = useConfig();
-	const isCurrentChainSupported = chains.some((chain) => chain.id === chainId);
+	const isCurrentChainSupported = isChainIdSupported(chains, chainId);
 	const closeModals = useCallback(({ keepConnectModalOpen = false } = {}) => {
 		if (!keepConnectModalOpen) closeConnectModal();
 		closeAccountModal();
@@ -5549,7 +5449,7 @@ function ModalProvider({ children }) {
 			connectModalOpen,
 			isWalletConnectModalOpen,
 			openAccountModal: isCurrentChainSupported && connectionStatus === "connected" ? openAccountModal : void 0,
-			openChainModal: connectionStatus === "connected" ? openChainModal : void 0,
+			openChainModal: chains.length > 0 ? openChainModal : void 0,
 			openConnectModal: connectionStatus === "disconnected" || connectionStatus === "unauthenticated" ? openConnectModal : void 0,
 			setIsWalletConnectModalOpen
 		}), [
@@ -5561,6 +5461,7 @@ function ModalProvider({ children }) {
 			openChainModal,
 			openConnectModal,
 			isCurrentChainSupported,
+			chains.length,
 			isWalletConnectModalOpen
 		]),
 		children: [
@@ -5623,10 +5524,10 @@ function useConnectModal() {
 const noop = () => {};
 function ConnectButtonRenderer({ children }) {
 	const isMounted = useIsMounted();
-	const { address } = useConnection();
-	const { chainId } = useConnection();
+	const { address, chainId: connectedChainId } = useConnection();
+	const chainId = useSelectedChainId(connectedChainId);
 	const { chains: wagmiChains } = useConfig();
-	const isCurrentChainSupported = wagmiChains.some((chain) => chain.id === chainId);
+	const isConnectedChainSupported = connectedChainId ? isChainIdSupported(wagmiChains, connectedChainId) : true;
 	const rainbowkitChainsById = useRainbowKitChainsById();
 	const authenticationStatus = useAuthenticationStatus() ?? void 0;
 	const rainbowKitChain = chainId ? rainbowkitChainsById[chainId] : void 0;
@@ -5671,7 +5572,7 @@ function ConnectButtonRenderer({ children }) {
 			iconUrl: resolvedChainIconUrl,
 			id: chainId,
 			name: chainName,
-			unsupported: !isCurrentChainSupported
+			unsupported: !isConnectedChainSupported
 		} : void 0,
 		chainModalOpen,
 		connectModalOpen,
@@ -5713,6 +5614,59 @@ function ConnectButton({ accountStatus = defaultProps.accountStatus, chainStatus
 	return ready ? /* @__PURE__ */ jsx(ConnectButtonRenderer, { children: ({ account, chain, mounted, openAccountModal, openChainModal, openConnectModal }) => {
 		const ready = mounted && connectionStatus !== "loading";
 		const unsupportedChain = chain?.unsupported ?? false;
+		const chainButton = chain && (chains.length > 1 || unsupportedChain) ? /* @__PURE__ */ jsxs(Box, {
+			alignItems: "center",
+			"aria-label": "Chain Selector",
+			as: "button",
+			background: unsupportedChain ? "connectButtonBackgroundError" : "connectButtonBackground",
+			borderRadius: "connectButton",
+			boxShadow: "connectButton",
+			className: touchableStyles({
+				active: "shrink",
+				hover: "grow"
+			}),
+			color: unsupportedChain ? "connectButtonTextError" : "connectButtonText",
+			display: mapResponsiveValue(chainStatus, (value) => value === "none" ? "none" : "flex"),
+			fontFamily: "body",
+			fontWeight: "bold",
+			gap: "6",
+			onClick: openChainModal,
+			paddingX: "10",
+			paddingY: "8",
+			testId: unsupportedChain ? "wrong-network-button" : "chain-button",
+			transition: "default",
+			type: "button",
+			children: [unsupportedChain ? /* @__PURE__ */ jsx(Box, {
+				alignItems: "center",
+				display: "flex",
+				height: "24",
+				paddingX: "4",
+				children: t("connect_wallet.wrong_network.label")
+			}) : /* @__PURE__ */ jsxs(Box, {
+				alignItems: "center",
+				display: "flex",
+				gap: "6",
+				children: [chain.hasIcon ? /* @__PURE__ */ jsx(Box, {
+					display: mapResponsiveValue(chainStatus, (value) => value === "full" || value === "icon" ? "block" : "none"),
+					height: "24",
+					width: "24",
+					children: /* @__PURE__ */ jsx(AsyncImage, {
+						alt: chain.name ?? "Chain icon",
+						background: chain.iconBackground,
+						borderRadius: "full",
+						height: "24",
+						src: chain.iconUrl,
+						width: "24"
+					})
+				}) : null, /* @__PURE__ */ jsx(Box, {
+					display: mapResponsiveValue(chainStatus, (value) => {
+						if (value === "icon" && !chain.iconUrl) return "block";
+						return value === "full" || value === "name" ? "block" : "none";
+					}),
+					children: chain.name ?? chain.id
+				})]
+			}), /* @__PURE__ */ jsx(DropdownIcon, {})]
+		}, unsupportedChain ? "unsupported" : "supported") : null;
 		return /* @__PURE__ */ jsx(Box, {
 			display: "flex",
 			gap: "12",
@@ -5724,59 +5678,7 @@ function ConnectButton({ accountStatus = defaultProps.accountStatus, chainStatus
 					userSelect: "none"
 				}
 			},
-			children: ready && account && connectionStatus === "connected" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ jsxs(Box, {
-				alignItems: "center",
-				"aria-label": "Chain Selector",
-				as: "button",
-				background: unsupportedChain ? "connectButtonBackgroundError" : "connectButtonBackground",
-				borderRadius: "connectButton",
-				boxShadow: "connectButton",
-				className: touchableStyles({
-					active: "shrink",
-					hover: "grow"
-				}),
-				color: unsupportedChain ? "connectButtonTextError" : "connectButtonText",
-				display: mapResponsiveValue(chainStatus, (value) => value === "none" ? "none" : "flex"),
-				fontFamily: "body",
-				fontWeight: "bold",
-				gap: "6",
-				onClick: openChainModal,
-				paddingX: "10",
-				paddingY: "8",
-				testId: unsupportedChain ? "wrong-network-button" : "chain-button",
-				transition: "default",
-				type: "button",
-				children: [unsupportedChain ? /* @__PURE__ */ jsx(Box, {
-					alignItems: "center",
-					display: "flex",
-					height: "24",
-					paddingX: "4",
-					children: t("connect_wallet.wrong_network.label")
-				}) : /* @__PURE__ */ jsxs(Box, {
-					alignItems: "center",
-					display: "flex",
-					gap: "6",
-					children: [chain.hasIcon ? /* @__PURE__ */ jsx(Box, {
-						display: mapResponsiveValue(chainStatus, (value) => value === "full" || value === "icon" ? "block" : "none"),
-						height: "24",
-						width: "24",
-						children: /* @__PURE__ */ jsx(AsyncImage, {
-							alt: chain.name ?? "Chain icon",
-							background: chain.iconBackground,
-							borderRadius: "full",
-							height: "24",
-							src: chain.iconUrl,
-							width: "24"
-						})
-					}) : null, /* @__PURE__ */ jsx(Box, {
-						display: mapResponsiveValue(chainStatus, (value) => {
-							if (value === "icon" && !chain.iconUrl) return "block";
-							return value === "full" || value === "name" ? "block" : "none";
-						}),
-						children: chain.name ?? chain.id
-					})]
-				}), /* @__PURE__ */ jsx(DropdownIcon, {})]
-			}, unsupportedChain ? "unsupported" : "supported"), !unsupportedChain && /* @__PURE__ */ jsxs(Box, {
+			children: ready && account && connectionStatus === "connected" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [chainButton, !unsupportedChain && /* @__PURE__ */ jsxs(Box, {
 				alignItems: "center",
 				as: "button",
 				background: "connectButtonBackground",
@@ -5835,7 +5737,7 @@ function ConnectButton({ accountStatus = defaultProps.accountStatus, chainStatus
 						})]
 					})
 				})]
-			})] }) : /* @__PURE__ */ jsx(Box, {
+			})] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [chainButton, /* @__PURE__ */ jsx(Box, {
 				as: "button",
 				background: "accentColor",
 				borderRadius: "connectButton",
@@ -5854,7 +5756,7 @@ function ConnectButton({ accountStatus = defaultProps.accountStatus, chainStatus
 				transition: "default",
 				type: "button",
 				children: mounted && label === "Connect Wallet" ? t("connect_wallet.label") : label
-			}, "connect")
+			}, "connect")] })
 		});
 	} }) : null;
 }
@@ -6020,4 +5922,4 @@ const WalletButton = ({ wallet }) => {
 WalletButton.Custom = WalletButtonRenderer;
 
 //#endregion
-export { createAuthenticationAdapter as S, useTransactionStore as _, useConnectModal as a, EmojiAvatar as b, ChainModal as c, dialogContentMobile as d, RainbowKitProvider as f, cssObjectFromTheme as g, cssStringFromTheme as h, useChainModal as i, AccountModal as l, baseTheme as m, ConnectButton as n, MobileOptions as o, lightTheme as p, useAccountModal as r, DesktopOptions as s, WalletButton as t, dialogContent as u, useChainId as v, RainbowKitAuthenticationProvider as x, Avatar as y };
+export { createAuthenticationAdapter as S, useTransactionStore as _, useConnectModal as a, EmojiAvatar as b, ChainModal as c, dialogContentMobile as d, RainbowKitProvider as f, cssObjectFromTheme as g, cssStringFromTheme as h, useChainModal as i, AccountModal as l, baseTheme as m, ConnectButton as n, MobileOptions as o, lightTheme as p, useAccountModal as r, DesktopOptions as s, WalletButton as t, dialogContent as u, useChainId$1 as v, RainbowKitAuthenticationProvider as x, Avatar as y };

package/dist/components/index.d.ts

@@ -1,6 +1,6 @@
 
-import { a as ConnectButtonProps, d as RainbowKitProviderProps, i as ConnectButton, m as AvatarComponentProps, n as WalletButtonProps, p as AvatarComponent, t as WalletButton, u as RainbowKitProvider } from "../WalletButton-DkkREZEg.js";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { a as ConnectButtonProps, d as RainbowKitProviderProps, i as ConnectButton, m as AvatarComponentProps, n as WalletButtonProps, p as AvatarComponent, t as WalletButton, u as RainbowKitProvider } from "../WalletButton-B-bj9FNL.js";
+import React from "react";
 
 //#region src/components/Avatar/Avatar.d.ts
 interface AvatarProps {
@@ -14,7 +14,7 @@ declare function Avatar({
   imageUrl,
   loading,
   size
-}: AvatarProps): _$react_jsx_runtime0.JSX.Element;
+}: AvatarProps): React.JSX.Element;
 //#endregion
 //#region src/components/Avatar/EmojiAvatar.d.ts
 declare const EmojiAvatar: AvatarComponent;
@@ -136,7 +136,7 @@ interface AccountModalProps {
 declare function AccountModal({
   onClose,
   open
-}: AccountModalProps): _$react_jsx_runtime0.JSX.Element | null;
+}: AccountModalProps): React.JSX.Element | null;
 //#endregion
 //#region src/components/ChainModal/ChainModal.d.ts
 interface ChainModalProps {
@@ -146,6 +146,6 @@ interface ChainModalProps {
 declare function ChainModal({
   onClose,
   open
-}: ChainModalProps): _$react_jsx_runtime0.JSX.Element | null;
+}: ChainModalProps): React.JSX.Element;
 //#endregion
 export { AccountModal, type AccountModalProps, Avatar, type AvatarProps, ChainModal, type ChainModalProps, ConnectButton, type ConnectButtonProps, EmojiAvatar, type AvatarComponentProps as EmojiAvatarProps, RainbowKitProvider, type RainbowKitProviderProps, WalletButton, type WalletButtonProps, emojiAvatarForAddress };

package/dist/components/index.js

@@ -1,5 +1,5 @@
 "use client";
-import { b as EmojiAvatar, c as ChainModal, f as RainbowKitProvider, l as AccountModal, n as ConnectButton, t as WalletButton, y as Avatar } from "../WalletButton-DiROWLU6.js";
+import { b as EmojiAvatar, c as ChainModal, f as RainbowKitProvider, l as AccountModal, n as ConnectButton, t as WalletButton, y as Avatar } from "../WalletButton-CsbqNc5l.js";
 
 //#region src/components/Avatar/emojiAvatarForAddress.ts
 const colors = [

package/dist/index.d.ts

@@ -1,10 +1,8 @@
 
-import { c as RainbowKitAuthenticationProvider, d as RainbowKitProviderProps, f as Theme, g as ThemeVars, h as DisclaimerComponent, i as ConnectButton, l as createAuthenticationAdapter, o as AuthenticationConfig, p as AvatarComponent, r as WalletButtonRendererProps, s as AuthenticationStatus, t as WalletButton, u as RainbowKitProvider } from "./WalletButton-DkkREZEg.js";
-import { a as WalletDetailsParams, i as Wallet, r as RainbowKitWalletConnectParameters, s as WalletList, t as CreateConnector } from "./Wallet-B3fOxQx_.js";
-import { ReactNode } from "react";
-import * as _$wagmi from "wagmi";
+import { c as RainbowKitAuthenticationProvider, d as RainbowKitProviderProps, f as Theme, g as ThemeVars, h as DisclaimerComponent, i as ConnectButton, l as createAuthenticationAdapter, o as AuthenticationConfig, p as AvatarComponent, r as WalletButtonRendererProps, s as AuthenticationStatus, t as WalletButton, u as RainbowKitProvider } from "./WalletButton-B-bj9FNL.js";
+import { a as WalletDetailsParams, i as Wallet, r as RainbowKitWalletConnectParameters, s as WalletList, t as CreateConnector } from "./Wallet-epUweMuA.js";
+import React, { ReactNode } from "react";
 import { CreateConfigParameters, CreateConnectorFn } from "wagmi";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { Transport } from "viem";
 import { Chain } from "wagmi/chains";
 
@@ -35,7 +33,7 @@ declare const getDefaultConfig: <chains extends _chains, transports extends _tra
   projectId,
   walletConnectParameters,
   ...wagmiParameters
-}: GetDefaultConfigParameters<chains, transports>) => _$wagmi.Config<chains, transports, _$wagmi.CreateConnectorFn[]>;
+}: GetDefaultConfigParameters<chains, transports>) => import("wagmi").Config<chains, transports, import("wagmi").CreateConnectorFn[]>;
 //#endregion
 //#region src/wallets/connectorsForWallets.d.ts
 interface ConnectorsForWalletsParameters {
@@ -171,6 +169,9 @@ declare const lightTheme: {
       selectedWallet: string;
       walletLogo: string;
     };
+    fonts: {
+      body: string;
+    };
     radii: {
       actionButton: string;
       connectButton: string;
@@ -178,9 +179,6 @@ declare const lightTheme: {
       modal: string;
       modalMobile: string;
     };
-    fonts: {
-      body: string;
-    };
     blurs: {
       modalOverlay: string;
     };
@@ -235,6 +233,9 @@ declare const darkTheme: {
       selectedWallet: string;
       walletLogo: string;
     };
+    fonts: {
+      body: string;
+    };
     radii: {
       actionButton: string;
       connectButton: string;
@@ -242,9 +243,6 @@ declare const darkTheme: {
       modal: string;
       modalMobile: string;
     };
-    fonts: {
-      body: string;
-    };
     blurs: {
       modalOverlay: string;
     };
@@ -299,6 +297,9 @@ declare const midnightTheme: {
       selectedWallet: string;
       walletLogo: string;
     };
+    fonts: {
+      body: string;
+    };
     radii: {
       actionButton: string;
       connectButton: string;
@@ -306,9 +307,6 @@ declare const midnightTheme: {
       modal: string;
       modalMobile: string;
     };
-    fonts: {
-      body: string;
-    };
     blurs: {
       modalOverlay: string;
     };
@@ -335,14 +333,14 @@ declare function DesktopOptions({
   onClose
 }: {
   onClose: () => void;
-}): _$react_jsx_runtime0.JSX.Element;
+}): React.JSX.Element;
 //#endregion
 //#region src/components/ConnectOptions/MobileOptions.d.ts
 declare function MobileOptions({
   onClose
 }: {
   onClose: () => void;
-}): _$react_jsx_runtime0.JSX.Element;
+}): React.JSX.Element;
 //#endregion
 //#region src/__private__/index.d.ts
 declare const __private__: {

package/dist/index.js

@@ -1,6 +1,6 @@
 "use client";
-import { S as createAuthenticationAdapter, _ as useTransactionStore, a as useConnectModal, d as dialogContentMobile, f as RainbowKitProvider, g as cssObjectFromTheme, h as cssStringFromTheme, i as useChainModal, m as baseTheme, n as ConnectButton, o as MobileOptions, p as lightTheme, r as useAccountModal, s as DesktopOptions, t as WalletButton, u as dialogContent, v as useChainId, x as RainbowKitAuthenticationProvider } from "./WalletButton-DiROWLU6.js";
-import { a as injectedWallet, i as getWalletConnectConnector, n as safeWallet, o as base, r as metaMaskWallet, t as walletConnectWallet } from "./walletConnectors-CvfKowGR.js";
+import { S as createAuthenticationAdapter, _ as useTransactionStore, a as useConnectModal, d as dialogContentMobile, f as RainbowKitProvider, g as cssObjectFromTheme, h as cssStringFromTheme, i as useChainModal, m as baseTheme, n as ConnectButton, o as MobileOptions, p as lightTheme, r as useAccountModal, s as DesktopOptions, t as WalletButton, u as dialogContent, v as useChainId$1, x as RainbowKitAuthenticationProvider } from "./WalletButton-CsbqNc5l.js";
+import { a as injectedWallet, i as getWalletConnectConnector, n as safeWallet, o as base, r as metaMaskWallet, t as walletConnectWallet } from "./walletConnectors-C02JPPxf.js";
 import { useCallback } from "react";
 import { createConfig, http, useConnection } from "wagmi";
 
@@ -167,7 +167,7 @@ function getDefaultWallets(parameters) {
 function useAddRecentTransaction() {
 	const store = useTransactionStore();
 	const { address } = useConnection();
-	const chainId = useChainId();
+	const chainId = useChainId$1();
 	return useCallback((transaction) => {
 		if (!address || !chainId) throw new Error("No address or chain ID found");
 		store.addTransaction(address, chainId, transaction);

package/dist/{walletConnectors-CvfKowGR.js → walletConnectors-C02JPPxf.js}

@@ -11,7 +11,7 @@ const base = ({ appName, appIcon }) => {
 		name: "Base",
 		shortName: "Base",
 		rdns: "app.base.account",
-		iconUrl: async () => (await import("./base-BLNzR5ZY.js")).default,
+		iconUrl: async () => (await import("./base-CioEwoIx.js")).default,
 		iconAccent: "#0000FF",
 		iconBackground: "#0000FF",
 		installed: true,
@@ -98,7 +98,7 @@ function getInjectedConnector({ flag, namespace, target }) {
 const injectedWallet = () => ({
 	id: "injected",
 	name: "Browser Wallet",
-	iconUrl: async () => (await import("./injectedWallet-Dg7isXIs.js")).default,
+	iconUrl: async () => (await import("./injectedWallet-Bq0gF2WF.js")).default,
 	iconBackground: "#fff",
 	createConnector: getInjectedConnector({})
 });
@@ -159,7 +159,7 @@ const metaMaskWallet = ({ projectId, walletConnectParameters }) => ({
 	name: "MetaMask Mobile",
 	shortName: "MetaMask",
 	rdns: "io.metamask.mobile",
-	iconUrl: async () => (await import("./metaMaskWallet-r9D3peIN.js")).default,
+	iconUrl: async () => (await import("./metaMaskWallet-Rs3AEK6Y.js")).default,
 	iconAccent: "#f6851a",
 	iconBackground: "#fff",
 	mobile: { getUri: (uri) => `https://metamask.app.link/wc?uri=${encodeURIComponent(uri)}` },
@@ -177,7 +177,7 @@ const safeWallet = () => ({
 	name: "Safe",
 	iconAccent: "#12ff80",
 	iconBackground: "#fff",
-	iconUrl: async () => (await import("./safeWallet-B3H2_qec.js")).default,
+	iconUrl: async () => (await import("./safeWallet-DTOh4YIR.js")).default,
 	installed: !(typeof window === "undefined") && window?.parent !== window,
 	createConnector: (walletDetails) => {
 		return createConnector((config) => ({
@@ -195,7 +195,7 @@ const walletConnectWallet = ({ projectId, options }) => {
 		id: "walletConnect",
 		name: "WalletConnect",
 		installed: void 0,
-		iconUrl: async () => (await import("./walletConnectWallet-CMhOxkhx.js")).default,
+		iconUrl: async () => (await import("./walletConnectWallet-Bk6DMfRO.js")).default,
 		iconBackground: "#3b99fc",
 		qrCode: { getUri },
 		createConnector: getWalletConnectConnector({

package/dist/wallets/walletConnectors/index.d.ts

@@ -1,5 +1,5 @@
 
-import { c as walletConnectWallet, i as Wallet, n as DefaultWalletOptions } from "../../Wallet-B3fOxQx_.js";
+import { c as walletConnectWallet, i as Wallet, n as DefaultWalletOptions } from "../../Wallet-epUweMuA.js";
 import { BaseAccountParameters } from "wagmi/connectors";
 
 //#region src/wallets/walletConnectors/base/base.d.ts
@@ -30,4 +30,4 @@ declare const metaMaskWallet: ({
 //#region src/wallets/walletConnectors/safeWallet/safeWallet.d.ts
 declare const safeWallet: () => Wallet;
 //#endregion
-export { base, baseAccount, injectedWallet, metaMaskWallet, safeWallet, walletConnectWallet };
+export { BaseOptions, base, baseAccount, injectedWallet, metaMaskWallet, safeWallet, walletConnectWallet };

package/dist/wallets/walletConnectors/index.js

@@ -1,4 +1,4 @@
 "use client";
-import { a as injectedWallet, n as safeWallet, o as base, r as metaMaskWallet, s as baseAccount, t as walletConnectWallet } from "../../walletConnectors-CvfKowGR.js";
+import { a as injectedWallet, n as safeWallet, o as base, r as metaMaskWallet, s as baseAccount, t as walletConnectWallet } from "../../walletConnectors-C02JPPxf.js";
 
 export { base, baseAccount, injectedWallet, metaMaskWallet, safeWallet, walletConnectWallet };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "solariskit",
-  "version": "1.0.0",
+  "version": "1.2.0",
   "description": "The best way to connect a wallet",
   "keywords": [
     "blockchain",
@@ -33,58 +33,77 @@
     "./components": "./dist/components/index.js"
   },
   "dependencies": {
-    "@base-org/account": "^2.5.3",
-    "@coinbase/wallet-sdk": "^4.3.7",
-    "@safe-global/safe-apps-provider": "^0.18.6",
-    "@safe-global/safe-apps-sdk": "^9.1.0",
     "@vanilla-extract/css": "1.20.1",
     "@vanilla-extract/dynamic": "2.1.5",
     "@vanilla-extract/sprinkles": "1.6.5",
-    "@walletconnect/ethereum-provider": "^2.23.9",
     "clsx": "2.1.1",
     "cuer": "0.0.3",
-    "react-remove-scroll": "2.7.2"
+    "qr": "0.5.5",
+    "react-remove-scroll": "2.7.2",
+    "@akshatmittal/polycons": "1.1.0"
   },
   "devDependencies": {
+    "@base-org/account": "^2.5.6",
     "@rollup/plugin-replace": "^6.0.3",
-    "@tanstack/react-query": "^5.97.0",
+    "@safe-global/safe-apps-provider": "^0.18.6",
+    "@safe-global/safe-apps-sdk": "^9.1.0",
+    "@tanstack/react-query": "^5.100.14",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
     "@types/node": "^24.12.2",
     "@types/postcss-prefix-selector": "^1.16.3",
-    "@types/react": "^19.2.14",
+    "@types/react": "^19.2.16",
     "@types/react-dom": "^19.2.3",
     "@vanilla-extract/css-utils": "0.1.6",
     "@vanilla-extract/private": "1.0.9",
     "@vanilla-extract/rollup-plugin": "^1.5.3",
     "@vanilla-extract/vite-plugin": "^5.2.2",
-    "autoprefixer": "^10.4.27",
-    "jsdom": "^29.0.2",
-    "msw": "^2.14.3",
-    "nock": "^14.0.14",
-    "postcss": "^8.5.9",
+    "@walletconnect/ethereum-provider": "^2.23.9",
+    "autoprefixer": "^10.5.0",
+    "jsdom": "^29.1.1",
+    "msw": "^2.14.6",
+    "nock": "^14.0.15",
+    "postcss": "^8.5.15",
     "postcss-prefix-selector": "^2.1.1",
-    "react": "^19.2.5",
-    "react-dom": "^19.2.5",
-    "tsdown": "^0.21.7",
-    "typescript": "^6.0.2",
-    "viem": "^2.47.12",
-    "vite": "^8.0.8",
-    "vitest": "^4.1.4",
-    "wagmi": "^3.6.1",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
+    "tsdown": "^0.22.1",
+    "typescript": "^6.0.3",
+    "viem": "^2.52.0",
+    "vite": "^8.0.16",
+    "vitest": "^4.1.8",
+    "wagmi": "^3.6.16",
     "@workspace/typescript-config": "0.0.0"
   },
   "peerDependencies": {
+    "@base-org/account": "^2.5.1",
+    "@safe-global/safe-apps-provider": "^0.18.6",
+    "@safe-global/safe-apps-sdk": "^9.1.0",
     "@tanstack/react-query": ">=5.0.0",
-    "react": ">=18",
-    "react-dom": ">=18",
-    "viem": "2.x",
+    "@walletconnect/ethereum-provider": "^2.21.1",
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19",
+    "viem": "^2.0.0",
     "wagmi": "^3.0.0"
   },
+  "peerDependenciesMeta": {
+    "@base-org/account": {
+      "optional": true
+    },
+    "@safe-global/safe-apps-provider": {
+      "optional": true
+    },
+    "@safe-global/safe-apps-sdk": {
+      "optional": true
+    },
+    "@walletconnect/ethereum-provider": {
+      "optional": true
+    }
+  },
   "engines": {
-    "node": ">=12.4"
+    "node": ">=24"
   },
   "scripts": {
     "build": "tsdown",