@wagmi/connectors 4.0.0 → 4.0.2

package/src/metaMask.ts

@@ -0,0 +1,334 @@
+import {
+  EventType,
+  MetaMaskSDK,
+  type MetaMaskSDKOptions,
+  SDKProvider,
+} from '@metamask/sdk'
+import {
+  ChainNotConfiguredError,
+  createConnector,
+  normalizeChainId,
+} from '@wagmi/core'
+import type { Evaluate, ExactPartial, Omit } from '@wagmi/core/internal'
+import {
+  type Address,
+  type ProviderConnectInfo,
+  type ProviderRpcError,
+  ResourceUnavailableRpcError,
+  RpcError,
+  SwitchChainError,
+  UserRejectedRequestError,
+  type WalletPermission,
+  getAddress,
+  numberToHex,
+} from 'viem'
+
+export type MetaMaskParameters = Evaluate<
+  ExactPartial<
+    Omit<
+      MetaMaskSDKOptions,
+      | 'checkInstallationImmediately'
+      | 'checkInstallationOnAllCalls'
+      | 'defaultReadOnlyChainId'
+      | 'readonlyRPCMap'
+    >
+  >
+>
+
+metaMask.type = 'metaMask' as const
+export function metaMask(parameters: MetaMaskParameters = {}) {
+  type Provider = SDKProvider
+  type Properties = {
+    onConnect(connectInfo: ProviderConnectInfo): void
+  }
+  type StorageItem = { 'metaMaskSDK.disconnected': true }
+  type Listener = Parameters<Provider['on']>[1]
+
+  let sdk: MetaMaskSDK
+  let walletProvider: Provider | undefined
+
+  return createConnector<Provider, Properties, StorageItem>((config) => ({
+    id: 'metaMaskSDK',
+    name: 'MetaMask',
+    type: metaMask.type,
+    async setup() {
+      const provider = await this.getProvider()
+      if (provider)
+        provider.on('connect', this.onConnect.bind(this) as Listener)
+    },
+    async connect({ chainId, isReconnecting } = {}) {
+      const provider = await this.getProvider()
+
+      let accounts: readonly Address[] | null = null
+      if (!isReconnecting) {
+        accounts = await this.getAccounts().catch(() => null)
+        const isAuthorized = !!accounts?.length
+        if (isAuthorized)
+          // Attempt to show another prompt for selecting account if already connected
+          try {
+            const permissions = (await provider.request({
+              method: 'wallet_requestPermissions',
+              params: [{ eth_accounts: {} }],
+            })) as WalletPermission[]
+            accounts = permissions[0]?.caveats?.[0]?.value?.map(getAddress)
+          } catch (err) {
+            const error = err as RpcError
+            // Not all injected providers support `wallet_requestPermissions` (e.g. MetaMask iOS).
+            // Only bubble up error if user rejects request
+            if (error.code === UserRejectedRequestError.code)
+              throw new UserRejectedRequestError(error)
+            // Or prompt is already open
+            if (error.code === ResourceUnavailableRpcError.code) throw error
+          }
+      }
+
+      try {
+        if (!accounts?.length) {
+          const requestedAccounts = (await sdk.connect()) as string[]
+          accounts = requestedAccounts.map(getAddress)
+        }
+
+        provider.removeListener(
+          'connect',
+          this.onConnect.bind(this) as Listener,
+        )
+        provider.on(
+          'accountsChanged',
+          this.onAccountsChanged.bind(this) as Listener,
+        )
+        provider.on('chainChanged', this.onChainChanged as Listener)
+        provider.on('disconnect', this.onDisconnect.bind(this) as Listener)
+
+        // Backward compatibility with older wallet (<7.3) version that return accounts before authorization
+        if (!sdk.isExtensionActive() && !sdk._getConnection()?.isAuthorized()) {
+          function waitForAuthorized() {
+            return new Promise((resolve) => {
+              const connection = sdk._getConnection()
+              const connector = connection?.getConnector()
+              connector?.once(EventType.AUTHORIZED, () => resolve(true))
+            })
+          }
+          await waitForAuthorized()
+        }
+
+        // Switch to chain if provided
+        let currentChainId = await this.getChainId()
+        if (chainId && currentChainId !== chainId) {
+          const chain = await this.switchChain!({ chainId }).catch((error) => {
+            if (error.code === UserRejectedRequestError.code) throw error
+            return { id: currentChainId }
+          })
+          currentChainId = chain?.id ?? currentChainId
+        }
+
+        await config.storage?.removeItem('metaMaskSDK.disconnected')
+
+        return { accounts, chainId: currentChainId }
+      } catch (err) {
+        const error = err as RpcError
+        if (error.code === UserRejectedRequestError.code)
+          throw new UserRejectedRequestError(error)
+        if (error.code === ResourceUnavailableRpcError.code)
+          throw new ResourceUnavailableRpcError(error)
+        throw error
+      }
+    },
+    async disconnect() {
+      const provider = await this.getProvider()
+
+      provider.removeListener(
+        'accountsChanged',
+        this.onAccountsChanged.bind(this),
+      )
+      provider.removeListener('chainChanged', this.onChainChanged)
+      provider.removeListener('disconnect', this.onDisconnect.bind(this))
+      provider.on('connect', this.onConnect.bind(this) as Listener)
+
+      sdk.terminate()
+
+      // Add shim signalling connector is disconnected
+      await config.storage?.setItem('metaMaskSDK.disconnected', true)
+    },
+    async getAccounts() {
+      const provider = await this.getProvider()
+      const accounts = (await provider.request({
+        method: 'eth_accounts',
+      })) as string[]
+      return accounts.map(getAddress)
+    },
+    async getChainId() {
+      const provider = await this.getProvider()
+      const chainId =
+        provider.chainId ?? (await provider?.request({ method: 'eth_chainId' }))
+      return normalizeChainId(chainId)
+    },
+    async getProvider() {
+      if (!walletProvider) {
+        if (!sdk || !sdk?.isInitialized()) {
+          sdk = new MetaMaskSDK({
+            enableDebug: false,
+            dappMetadata: { name: 'wagmi' },
+            extensionOnly: true,
+            modals: {
+              // Disable by default since it pops up when mobile tries to reconnect
+              otp() {
+                const noop = () => {}
+                return { mount: noop, unmount: noop }
+              },
+            },
+            useDeeplink: true,
+            _source: 'wagmi',
+            ...parameters,
+            checkInstallationImmediately: false,
+            checkInstallationOnAllCalls: false,
+          })
+          await sdk.init()
+        }
+        try {
+          walletProvider = sdk.getProvider()
+        } catch (error) {
+          // TODO: SDK sometimes throws errors when MM extension or mobile provider is not detected (don't throw for those errors)
+          const regex = /^SDK state invalid -- undefined( mobile)? provider$/
+          if (!regex.test((error as Error).message)) throw error
+        }
+      }
+      return walletProvider!
+    },
+    async isAuthorized() {
+      try {
+        const isDisconnected =
+          // If shim exists in storage, connector is disconnected
+          await config.storage?.getItem('metaMaskSDK.disconnected')
+        if (isDisconnected) return false
+
+        const accounts = await this.getAccounts()
+        return !!accounts.length
+      } catch {
+        return false
+      }
+    },
+    async switchChain({ chainId }) {
+      const provider = await this.getProvider()
+
+      const chain = config.chains.find((x) => x.id === chainId)
+      if (!chain) throw new SwitchChainError(new ChainNotConfiguredError())
+
+      try {
+        await Promise.all([
+          provider.request({
+            method: 'wallet_switchEthereumChain',
+            params: [{ chainId: numberToHex(chainId) }],
+          }),
+          new Promise<void>((resolve) =>
+            config.emitter.once('change', ({ chainId: currentChainId }) => {
+              if (currentChainId === chainId) resolve()
+            }),
+          ),
+        ])
+        return chain
+      } catch (err) {
+        const error = err as RpcError
+
+        // Indicates chain is not added to provider
+        if (
+          error.code === 4902 ||
+          // Unwrapping for MetaMask Mobile
+          // https://github.com/MetaMask/metamask-mobile/issues/2944#issuecomment-976988719
+          (error as ProviderRpcError<{ originalError?: { code: number } }>)
+            ?.data?.originalError?.code === 4902
+        ) {
+          try {
+            const { default: blockExplorer, ...blockExplorers } =
+              chain.blockExplorers ?? {}
+            let blockExplorerUrls: string[] = []
+            if (blockExplorer)
+              blockExplorerUrls = [
+                blockExplorer.url,
+                ...Object.values(blockExplorers).map((x) => x.url),
+              ]
+
+            await provider.request({
+              method: 'wallet_addEthereumChain',
+              params: [
+                {
+                  chainId: numberToHex(chainId),
+                  chainName: chain.name,
+                  nativeCurrency: chain.nativeCurrency,
+                  rpcUrls: [chain.rpcUrls.default?.http[0] ?? ''],
+                  blockExplorerUrls,
+                },
+              ],
+            })
+
+            const currentChainId = await this.getChainId()
+            if (currentChainId !== chainId)
+              throw new UserRejectedRequestError(
+                new Error('User rejected switch after adding network.'),
+              )
+
+            return chain
+          } catch (error) {
+            throw new UserRejectedRequestError(error as Error)
+          }
+        }
+
+        if (error.code === UserRejectedRequestError.code)
+          throw new UserRejectedRequestError(error)
+        throw new SwitchChainError(error)
+      }
+    },
+    async onAccountsChanged(accounts) {
+      // Disconnect if there are no accounts
+      if (accounts.length === 0) this.onDisconnect()
+      // Connect if emitter is listening for connect event (e.g. is disconnected and connects through wallet interface)
+      else if (config.emitter.listenerCount('connect')) {
+        const chainId = (await this.getChainId()).toString()
+        this.onConnect({ chainId })
+        await config.storage?.removeItem('metaMaskSDK.disconnected')
+      }
+      // Regular change event
+      else config.emitter.emit('change', { accounts: accounts.map(getAddress) })
+    },
+    onChainChanged(chain) {
+      const chainId = normalizeChainId(chain)
+      config.emitter.emit('change', { chainId })
+    },
+    async onConnect(connectInfo) {
+      const accounts = await this.getAccounts()
+      if (accounts.length === 0) return
+
+      const chainId = normalizeChainId(connectInfo.chainId)
+      config.emitter.emit('connect', { accounts, chainId })
+
+      const provider = await this.getProvider()
+      if (provider) {
+        provider.removeListener('connect', this.onConnect.bind(this))
+        provider.on('accountsChanged', this.onAccountsChanged.bind(this) as any)
+        provider.on('chainChanged', this.onChainChanged as any)
+        provider.on('disconnect', this.onDisconnect.bind(this) as any)
+      }
+    },
+    async onDisconnect(error) {
+      const provider = await this.getProvider()
+
+      // If MetaMask emits a `code: 1013` error, wait for reconnection before disconnecting
+      // https://github.com/MetaMask/providers/pull/120
+      if (error && (error as RpcError<1013>).code === 1013) {
+        if (provider && !!(await this.getAccounts()).length) return
+      }
+
+      // No need to remove 'metaMaskSDK.disconnected' from storage because `onDisconnect` is typically
+      // only called when the wallet is disconnected through the wallet's interface, meaning the wallet
+      // actually disconnected and we don't need to simulate it.
+      config.emitter.emit('disconnect')
+
+      provider.removeListener(
+        'accountsChanged',
+        this.onAccountsChanged.bind(this),
+      )
+      provider.removeListener('chainChanged', this.onChainChanged)
+      provider.removeListener('disconnect', this.onDisconnect.bind(this))
+      provider.on('connect', this.onConnect.bind(this) as any)
+    },
+  }))
+}

package/src/safe.ts

@@ -1,7 +1,10 @@
 import { SafeAppProvider } from '@safe-global/safe-apps-provider'
 import { type Opts, default as SafeAppsSDK } from '@safe-global/safe-apps-sdk'
-import { ProviderNotFoundError } from '@wagmi/core'
-import { createConnector, normalizeChainId } from '@wagmi/core'
+import {
+  ProviderNotFoundError,
+  createConnector,
+  normalizeChainId,
+} from '@wagmi/core'
 import type { Evaluate } from '@wagmi/core/internal'
 import { getAddress } from 'viem'
 
@@ -19,12 +22,13 @@ export type SafeParameters = Evaluate<
   }
 >
 
+safe.type = 'safe' as const
 export function safe(parameters: SafeParameters = {}) {
-  type Provider = SafeAppProvider
-  type Properties = {}
-  type StorageItem = { 'safe.shimDisconnect': true }
+  const { shimDisconnect = false } = parameters
 
-  const shimDisconnectStorageKey = 'safe.shimDisconnect'
+  type Provider = SafeAppProvider | undefined
+  type Properties = {}
+  type StorageItem = { 'safe.disconnected': true }
 
   let provider_: Provider | undefined
   let SDK: typeof SafeAppsSDK.default
@@ -39,12 +43,8 @@ export function safe(parameters: SafeParameters = {}) {
   return createConnector<Provider, Properties, StorageItem>((config) => ({
     id: 'safe',
     name: 'Safe',
+    type: safe.type,
     async connect() {
-      // Only allowed in iframe context
-      const isIframe =
-        typeof window !== 'undefined' && window?.parent !== window
-      if (!isIframe) throw new ProviderNotFoundError()
-
       const provider = await this.getProvider()
       if (!provider) throw new ProviderNotFoundError()
 
@@ -53,19 +53,20 @@ export function safe(parameters: SafeParameters = {}) {
 
       provider.on('disconnect', this.onDisconnect.bind(this))
 
-      // Add shim to storage signalling wallet is connected
-      if (parameters.shimDisconnect)
-        await config.storage?.setItem(shimDisconnectStorageKey, true)
+      // Remove disconnected shim if it exists
+      if (shimDisconnect) await config.storage?.removeItem('safe.disconnected')
 
       return { accounts, chainId }
     },
     async disconnect() {
       const provider = await this.getProvider()
+      if (!provider) throw new ProviderNotFoundError()
+
       provider.removeListener('disconnect', this.onDisconnect.bind(this))
 
-      // Remove shim signalling wallet is disconnected
-      if (parameters.shimDisconnect)
-        await config.storage?.removeItem(shimDisconnectStorageKey)
+      // Add shim signalling connector is disconnected
+      if (shimDisconnect)
+        await config.storage?.setItem('safe.disconnected', true)
     },
     async getAccounts() {
       const provider = await this.getProvider()
@@ -75,6 +76,11 @@ export function safe(parameters: SafeParameters = {}) {
       )
     },
     async getProvider() {
+      // Only allowed in iframe context
+      const isIframe =
+        typeof window !== 'undefined' && window?.parent !== window
+      if (!isIframe) return
+
       if (!provider_) {
         const safe = await sdk.safe.getInfo()
         if (!safe) throw new Error('Could not load Safe information')
@@ -90,9 +96,9 @@ export function safe(parameters: SafeParameters = {}) {
     async isAuthorized() {
       try {
         const isDisconnected =
-          parameters.shimDisconnect &&
-          // If shim does not exist in storage, wallet is disconnected
-          !(await config.storage?.getItem(shimDisconnectStorageKey))
+          shimDisconnect &&
+          // If shim exists in storage, connector is disconnected
+          (await config.storage?.getItem('safe.disconnected'))
         if (isDisconnected) return false
 
         const accounts = await this.getAccounts()

package/src/version.ts

@@ -1 +1 @@
-export const version = '4.0.0'
+export const version = '4.0.2'

package/src/walletConnect.ts

@@ -5,11 +5,7 @@ import {
   normalizeChainId,
 } from '@wagmi/core'
 import type { Evaluate, ExactPartial, Omit } from '@wagmi/core/internal'
-import {
-  EthereumProvider,
-  OPTIONAL_EVENTS,
-  OPTIONAL_METHODS,
-} from '@walletconnect/ethereum-provider'
+import { EthereumProvider } from '@walletconnect/ethereum-provider'
 import {
   type Address,
   type ProviderConnectInfo,
@@ -71,6 +67,7 @@ export type WalletConnectParameters = Evaluate<
     ExactPartial<Pick<EthereumProviderOptions, 'showQrModal'>>
 >
 
+walletConnect.type = 'walletConnect' as const
 export function walletConnect(parameters: WalletConnectParameters) {
   const isNewChainsStale = parameters.isNewChainsStale ?? true
 
@@ -104,8 +101,9 @@ export function walletConnect(parameters: WalletConnectParameters) {
   return createConnector<Provider, Properties, StorageItem>((config) => ({
     id: 'walletConnect',
     name: 'WalletConnect',
+    type: walletConnect.type,
     async setup() {
-      const provider = await this.getProvider()
+      const provider = await this.getProvider().catch(() => null)
       if (!provider) return
       provider.on('connect', this.onConnect.bind(this))
       provider.on('session_delete', this.onSessionDelete.bind(this))
@@ -137,8 +135,7 @@ export function walletConnect(parameters: WalletConnectParameters) {
             .filter((chain) => chain.id !== targetChainId)
             .map((optionalChain) => optionalChain.id)
           await provider.connect({
-            chains: [targetChainId],
-            optionalChains,
+            optionalChains: [targetChainId, ...optionalChains],
             ...('pairingTopic' in rest
               ? { pairingTopic: rest.pairingTopic }
               : {}),
@@ -173,21 +170,21 @@ export function walletConnect(parameters: WalletConnectParameters) {
     async disconnect() {
       const provider = await this.getProvider()
       try {
-        await provider.disconnect()
+        await provider?.disconnect()
       } catch (error) {
         if (!/No matching key/i.test((error as Error).message)) throw error
       } finally {
-        provider.removeListener(
+        provider?.removeListener(
           'accountsChanged',
           this.onAccountsChanged.bind(this),
         )
-        provider.removeListener('chainChanged', this.onChainChanged)
-        provider.removeListener('disconnect', this.onDisconnect.bind(this))
-        provider.removeListener(
+        provider?.removeListener('chainChanged', this.onChainChanged)
+        provider?.removeListener('disconnect', this.onDisconnect.bind(this))
+        provider?.removeListener(
           'session_delete',
           this.onSessionDelete.bind(this),
         )
-        provider.on('connect', this.onConnect.bind(this))
+        provider?.on('connect', this.onConnect.bind(this))
 
         this.setRequestedChainsIds([])
       }
@@ -198,14 +195,11 @@ export function walletConnect(parameters: WalletConnectParameters) {
     },
     async getProvider({ chainId } = {}) {
       async function initProvider() {
-        const [defaultChain, ...optionalChains] = config.chains.map((x) => x.id)
-        if (!defaultChain) return
+        const optionalChains = config.chains.map((x) => x.id) as [number]
+        if (!optionalChains.length) return
         return await EthereumProvider.init({
           ...parameters,
-          chains: [defaultChain],
           disableProviderPing: true,
-          optionalMethods: OPTIONAL_METHODS,
-          optionalEvents: OPTIONAL_EVENTS,
           optionalChains,
           projectId: parameters.projectId,
           rpcMap: Object.fromEntries(
@@ -269,7 +263,7 @@ export function walletConnect(parameters: WalletConnectParameters) {
             params: [
               {
                 chainId: numberToHex(chain.id),
-                blockExplorerUrls: [chain.blockExplorers?.default],
+                blockExplorerUrls: [chain.blockExplorers?.default.url],
                 chainName: chain.name,
                 nativeCurrency: chain.nativeCurrency,
                 rpcUrls: [...chain.rpcUrls.default.http],
@@ -286,6 +280,7 @@ export function walletConnect(parameters: WalletConnectParameters) {
         })
         return chain
       } catch (error) {
+        console.log({ error })
         const message =
           typeof error === 'string'
             ? error

package/dist/esm/index.js

@@ -1,7 +0,0 @@
-export { coinbaseWallet, } from './coinbaseWallet.js';
-export { injected } from './injected.js';
-export { ledger } from './ledger.js';
-export { safe } from './safe.js';
-export { walletConnect, } from './walletConnect.js';
-export { version } from './version.js';
-//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,cAAc,GACf,MAAM,qBAAqB,CAAA;AAE5B,OAAO,EAA2B,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjE,OAAO,EAAyB,MAAM,EAAE,MAAM,aAAa,CAAA;AAE3D,OAAO,EAAuB,IAAI,EAAE,MAAM,WAAW,CAAA;AAErD,OAAO,EAEL,aAAa,GACd,MAAM,oBAAoB,CAAA;AAE3B,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA"}

package/dist/esm/index.test-d.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.test-d.js","sourceRoot":"","sources":["../../src/index.test-d.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAA;AAErC,uFAAuF;AACvF,YAAY,CAAC,CAAC,CAAC,CAAC,aAAa,EAAU,CAAA"}