chore: upgrade valtio to v2

.changeset/chubby-bags-crash.md

@@ -0,0 +1,27 @@
+---
+'@reown/appkit-adapter-ethers5': patch
+'@reown/appkit-adapter-ethers': patch
+'@reown/appkit-adapter-solana': patch
+'@reown/appkit-adapter-wagmi': patch
+'@reown/appkit-wallet-button': patch
+'@reown/appkit-utils': patch
+'@reown/appkit-experimental': patch
+'@reown/appkit-controllers': patch
+'@reown/appkit': patch
+'@reown/appkit-siwe': patch
+'@reown/appkit-pay': patch
+'@reown/appkit-adapter-bitcoin': patch
+'@reown/appkit-cdn': patch
+'@reown/appkit-cli': patch
+'@reown/appkit-codemod': patch
+'@reown/appkit-common': patch
+'@reown/appkit-core': patch
+'@reown/appkit-polyfills': patch
+'@reown/appkit-scaffold-ui': patch
+'@reown/appkit-siwx': patch
+'@reown/appkit-testing': patch
+'@reown/appkit-ui': patch
+'@reown/appkit-wallet': patch
+---
+
+Upgrades Valtio to v2

apps/demo/package.json

@@ -63,7 +63,7 @@
     "tailwindcss-animate": "1.0.7",
     "viem": "2.31.3",
     "wagmi": "2.15.6",
-    "valtio": "1.13.2"
+    "valtio": "2.1.5"
   },
   "devDependencies": {
     "@types/node": "22.13.4",

apps/laboratory/app/library/ethers5-all-internal/page.tsx

@@ -2,21 +2,20 @@
 
 import { Ethers5Adapter } from '@reown/appkit-adapter-ethers5'
 import { mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { Ethers5Tests } from '@/src/components/Ethers/Ethers5Tests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { SiweData } from '@/src/components/Siwe/SiweData'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
 import { siweConfig } from '@/src/utils/SiweUtils'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const networks = ConstantsUtil.EvmNetworks
 const ethers5Adapter = new Ethers5Adapter()
 
-const modal = createAppKit({
+const config = {
   adapters: [ethers5Adapter],
   networks,
   defaultNetwork: mainnet,
@@ -25,17 +24,17 @@ const modal = createAppKit({
   privacyPolicyUrl: 'https://reown.com/privacy-policy',
   siweConfig,
   customWallets: ConstantsUtil.CustomWallets
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function Ethers() {
   return (
-    <InitializeBoundary>
-      <AppKitButtons />
-      <AppKitInfo />
-      <SiweData />
-      <Ethers5Tests />
-    </InitializeBoundary>
+    <AppKitProvider config={config}>
+      <InitializeBoundary>
+        <AppKitButtons />
+        <AppKitInfo />
+        <SiweData />
+        <Ethers5Tests />
+      </InitializeBoundary>
+    </AppKitProvider>
   )
 }

apps/laboratory/app/library/ethers5-all/page.tsx

@@ -2,40 +2,39 @@
 
 import { Ethers5Adapter } from '@reown/appkit-adapter-ethers5'
 import { mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { Ethers5Tests } from '@/src/components/Ethers/Ethers5Tests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { SiweData } from '@/src/components/Siwe/SiweData'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
 import { siweConfig } from '@/src/utils/SiweUtils'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const networks = ConstantsUtil.EvmNetworks
 
 const ethers5Adapter = new Ethers5Adapter()
 
-const modal = createAppKit({
+const config = {
   adapters: [ethers5Adapter],
   networks,
   defaultNetwork: mainnet,
   projectId: ConstantsUtil.ProjectId,
   termsConditionsUrl: 'https://reown.com/terms-of-service',
   privacyPolicyUrl: 'https://reown.com/privacy-policy',
   siweConfig
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function Ethers() {
   return (
-    <InitializeBoundary>
-      <AppKitButtons />
-      <AppKitInfo />
-      <SiweData />
-      <Ethers5Tests />
-    </InitializeBoundary>
+    <AppKitProvider config={config}>
+      <InitializeBoundary>
+        <AppKitButtons />
+        <AppKitInfo />
+        <SiweData />
+        <Ethers5Tests />
+      </InitializeBoundary>
+    </AppKitProvider>
   )
 }

apps/laboratory/app/library/ethers5-no-socials/page.tsx

@@ -2,22 +2,21 @@
 
 import { Ethers5Adapter } from '@reown/appkit-adapter-ethers5'
 import { mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { Ethers5Tests } from '@/src/components/Ethers/Ethers5Tests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { SiweData } from '@/src/components/Siwe/SiweData'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
 import { siweConfig } from '@/src/utils/SiweUtils'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const networks = ConstantsUtil.EvmNetworks
 
 const ethersAdapter = new Ethers5Adapter()
 
-const modal = createAppKit({
+const config = {
   adapters: [ethersAdapter],
   networks,
   defaultNetwork: mainnet,
@@ -27,17 +26,17 @@ const modal = createAppKit({
     socials: []
   },
   siweConfig
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function Ethers() {
   return (
-    <InitializeBoundary>
-      <AppKitButtons />
-      <AppKitInfo />
-      <SiweData />
-      <Ethers5Tests />
-    </InitializeBoundary>
+    <AppKitProvider config={config}>
+      <InitializeBoundary>
+        <AppKitButtons />
+        <AppKitInfo />
+        <SiweData />
+        <Ethers5Tests />
+      </InitializeBoundary>
+    </AppKitProvider>
   )
 }

apps/laboratory/app/library/ethers5-siwe/page.tsx

@@ -2,39 +2,38 @@
 
 import { Ethers5Adapter } from '@reown/appkit-adapter-ethers5'
 import { mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { Ethers5Tests } from '@/src/components/Ethers/Ethers5Tests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { SiweData } from '@/src/components/Siwe/SiweData'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
 import { siweConfig } from '@/src/utils/SiweUtils'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const networks = ConstantsUtil.EvmNetworks
 
 const ethers5Adapter = new Ethers5Adapter()
 
-const modal = createAppKit({
+const config = {
   adapters: [ethers5Adapter],
   networks,
   defaultNetwork: mainnet,
   projectId: ConstantsUtil.ProjectId,
   siweConfig,
   customWallets: ConstantsUtil.CustomWallets
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function EthersSiwe() {
   return (
-    <InitializeBoundary>
-      <AppKitButtons />
-      <AppKitInfo />
-      <SiweData />
-      <Ethers5Tests />
-    </InitializeBoundary>
+    <AppKitProvider config={config}>
+      <InitializeBoundary>
+        <AppKitButtons />
+        <AppKitInfo />
+        <SiweData />
+        <Ethers5Tests />
+      </InitializeBoundary>
+    </AppKitProvider>
   )
 }

apps/laboratory/app/library/multichain-ethers5-solana/page.tsx

@@ -5,16 +5,15 @@ import { HuobiWalletAdapter, SolflareWalletAdapter } from '@solana/wallet-adapte
 import { EthersAdapter } from '@reown/appkit-adapter-ethers'
 import { SolanaAdapter } from '@reown/appkit-adapter-solana'
 import { type AppKitNetwork, mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitConnections } from '@/src/components/AppKitConnections'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { Ethers5Tests } from '@/src/components/Ethers/Ethers5Tests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { SolanaTests } from '@/src/components/Solana/SolanaTests'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const networks = [...ConstantsUtil.EvmNetworks, ...ConstantsUtil.SolanaNetworks] as [
   AppKitNetwork,
@@ -27,27 +26,26 @@ const solanaWeb3JsAdapter = new SolanaAdapter({
   wallets: [new HuobiWalletAdapter(), new SolflareWalletAdapter()]
 })
 
-const modal = createAppKit({
+const config = {
   adapters: [etherAdapter, solanaWeb3JsAdapter],
-  projectId: ConstantsUtil.ProjectId,
   networks,
   defaultNetwork: mainnet,
   customWallets: ConstantsUtil.CustomWallets,
   termsConditionsUrl: 'https://reown.com/terms-of-service',
   privacyPolicyUrl: 'https://reown.com/privacy-policy'
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function MultiChainEthers5Solana() {
   return (
-    <InitializeBoundary>
-      <AppKitButtons />
-      <AppKitConnections namespace="eip155" title="EVM Connections" />
-      <AppKitConnections namespace="solana" title="Solana Connections" />
-      <AppKitInfo />
-      <Ethers5Tests />
-      <SolanaTests />
-    </InitializeBoundary>
+    <AppKitProvider config={config}>
+      <InitializeBoundary>
+        <AppKitButtons />
+        <AppKitConnections namespace="eip155" title="EVM Connections" />
+        <AppKitConnections namespace="solana" title="Solana Connections" />
+        <AppKitInfo />
+        <Ethers5Tests />
+        <SolanaTests />
+      </InitializeBoundary>
+    </AppKitProvider>
   )
 }

apps/laboratory/app/library/multichain-wagmi-bitcoin/page.tsx

@@ -8,16 +8,15 @@ import { WagmiProvider } from 'wagmi'
 import { BitcoinAdapter } from '@reown/appkit-adapter-bitcoin'
 import { WagmiAdapter } from '@reown/appkit-adapter-wagmi'
 import { type AppKitNetwork, mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
 
 import { AppKitButtons } from '@/src/components/AppKitButtons'
 import { AppKitConnections } from '@/src/components/AppKitConnections'
 import { AppKitInfo } from '@/src/components/AppKitInfo'
 import { BitcoinTests } from '@/src/components/Bitcoin/BitcoinTests'
 import InitializeBoundary from '@/src/components/InitializeBoundary'
 import { WagmiTests } from '@/src/components/Wagmi/WagmiTests'
+import { AppKitProvider } from '@/src/context/AppKitContext'
 import { ConstantsUtil } from '@/src/utils/ConstantsUtil'
-import { ThemeStore } from '@/src/utils/StoreUtil'
 
 const queryClient = new QueryClient()
 
@@ -34,29 +33,29 @@ const wagmiAdapter = new WagmiAdapter({
 
 const bitcoinAdapter = new BitcoinAdapter()
 
-const modal = createAppKit({
+const config = {
   adapters: [wagmiAdapter, bitcoinAdapter],
   networks,
   defaultNetwork: mainnet,
   projectId: ConstantsUtil.ProjectId,
 
   metadata: ConstantsUtil.Metadata
-})
-
-ThemeStore.setModal(modal)
+}
 
 export default function MultiChainWagmiSolana() {
   return (
     <WagmiProvider config={wagmiAdapter.wagmiConfig}>
       <QueryClientProvider client={queryClient}>
-        <InitializeBoundary>
-          <AppKitButtons />
-          <AppKitConnections namespace="eip155" title="EVM Connections" />
-          <AppKitConnections namespace="bip122" title="Bitcoin Connections" />
-          <AppKitInfo />
-          <WagmiTests />
-          <BitcoinTests />
-        </InitializeBoundary>
+        <AppKitProvider config={config}>
+          <InitializeBoundary>
+            <AppKitButtons />
+            <AppKitConnections namespace="eip155" title="EVM Connections" />
+            <AppKitConnections namespace="bip122" title="Bitcoin Connections" />
+            <AppKitInfo />
+            <WagmiTests />
+            <BitcoinTests />
+          </InitializeBoundary>
+        </AppKitProvider>
       </QueryClientProvider>
     </WagmiProvider>
   )