@coinbase/cdp-wagmi 0.0.14 → 0.0.15

package/README.md

@@ -94,6 +94,15 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 );
 ```
 
+### Sign in and connection
+
+In order to connect the CDP Embedded Wallet, the end application user must first go through the 2 step sign in flow. As a result, the consumer has 3 options:
+1. Use @coinbase/cdp-core's `signInWithEmail` + `verifyEmailOTP`
+2. Use @coinbase/cdp-hooks' `useSignInWithEmail` + `useVerifyEmailOTP`
+3. Use @coinbase/cdp-react `<SignIn />` component
+
+After using any of these methods, the CDP embedded wallet's connector should automatically connect.
+
 ### Call Wagmi Hooks
 
 Now, your application should be able to successfully call Wagmi hooks. For example:

package/dist/esm/index.js

@@ -1,4 +1,5 @@
-import { createCDPEmbeddedWalletConnector as r } from "./index2.js";
+import { CDP_CONNECTOR_ID as o, createCDPEmbeddedWalletConnector as r } from "./index2.js";
 export {
+  o as CDP_CONNECTOR_ID,
   r as createCDPEmbeddedWalletConnector
 };

package/dist/esm/index2.js

@@ -1,12 +1,13 @@
-import { createCDPEmbeddedWallet as w, STANDARD_ERROR_CODES as g, EIP1193ProviderError as I, initialize as p } from "@coinbase/cdp-core";
-import { SwitchChainError as y, numberToHex as b, getAddress as f } from "viem";
-import { createConnector as D } from "wagmi";
-function Z(d) {
-  return D((a) => {
-    const v = d.providerConfig?.chains ?? a.chains ?? [];
-    let h, i, r, u, c, m;
-    async function C() {
-      m || (m = p(d.cdpConfig)), await m;
+import { createCDPEmbeddedWallet as I, STANDARD_ERROR_CODES as l, EIP1193ProviderError as y, initialize as p } from "@coinbase/cdp-core";
+import { SwitchChainError as f, numberToHex as b, getAddress as D } from "viem";
+import { createConnector as P } from "wagmi";
+const E = "cdp-embedded-wallet";
+function M(u) {
+  return P((s) => {
+    const C = u.providerConfig?.chains ?? s.chains ?? [];
+    let m, r, o, n, c, g;
+    async function w() {
+      g || (g = p(u.cdpConfig)), await g;
     }
     return {
       /**
@@ -18,7 +19,7 @@ function Z(d) {
        */
       async setup() {
         const e = await this.getProvider();
-        r || (r = this.onDisconnect.bind(this), e.on("disconnect", r)), c || (c = this.onAccountsChanged.bind(this), e.on("accountsChanged", c)), i || (i = this.onChainChanged.bind(this), e.on("chainChanged", i)), u || (u = this.onConnect.bind(this), e.on("connect", u));
+        n || (n = this.onConnect.bind(this), e.on("connect", n));
       },
       /**
        * Connector function called when the user connects their wallet.
@@ -34,24 +35,28 @@ function Z(d) {
         chainId: e,
         isReconnecting: t
       } = {}) {
-        let o = [];
-        t && (o = await this.getAccounts());
+        let d = [], i = await this.getChainId();
+        const h = await this.getProvider();
+        n && (h.removeListener("connect", n), n = void 0), c || (c = this.onAccountsChanged.bind(this), h.on("accountsChanged", c)), r || (r = this.onChainChanged.bind(this), h.on("chainChanged", r)), o || (o = this.onDisconnect.bind(this), h.on("disconnect", o));
         try {
-          if (!o?.length && !t && (o = await (await this.getProvider()).request({ method: "eth_requestAccounts" }), o.length === 0))
-            throw new Error("User has no evm addresses available or is not authenticated");
-          let n = await this.getChainId();
-          return e && n !== e && (n = (await this.switchChain({ chainId: e }).catch(
-            (l) => {
-              if (l.code === g.provider.userRejectedRequest) throw l;
-              return { id: n };
+          if (d = await this.getAccounts(), t)
+            return { accounts: d, chainId: i };
+          if (!d?.length && !t)
+            throw new Error(
+              "Please use our hooks / SignIn component to connect your wallet. See the README for more details."
+            );
+          return e && i !== e && (i = (await this.switchChain({ chainId: e }).catch(
+            (a) => {
+              if (a.code === l.provider.userRejectedRequest) throw a;
+              return { id: i };
             }
-          ))?.id ?? n), { accounts: o, chainId: n };
-        } catch (n) {
-          const s = n;
-          throw s.code === g.provider.userRejectedRequest ? new I(
-            g.provider.userRejectedRequest,
-            s.message
-          ) : s;
+          ))?.id ?? i), { accounts: d, chainId: i };
+        } catch (v) {
+          const a = v;
+          throw a.code === l.provider.userRejectedRequest ? new y(
+            l.provider.userRejectedRequest,
+            a.message
+          ) : a;
         }
       },
       /**
@@ -60,7 +65,7 @@ function Z(d) {
        */
       async disconnect() {
         const e = await this.getProvider();
-        await e.request({ method: "wallet_disconnect" }), r && (e.removeListener("disconnect", r), r = void 0), c && (e.removeListener("accountsChanged", c), c = void 0), i && (e.removeListener("chainChanged", i), i = void 0);
+        await e.request({ method: "wallet_disconnect" }), o && (e.removeListener("disconnect", o), o = void 0), c && (e.removeListener("accountsChanged", c), c = void 0), r && (e.removeListener("chainChanged", r), r = void 0), n || (n = this.onConnect.bind(this), e.on("connect", n));
       },
       /**
        * Get the accounts of the user
@@ -87,10 +92,10 @@ function Z(d) {
        * @returns {EIP1193Provider} The 1193 provider
        */
       async getProvider() {
-        return await C(), h || (h = w({
-          chains: v,
-          transports: d.providerConfig.transports
-        })), h.provider;
+        return await w(), m || (m = I({
+          chains: C,
+          transports: u.providerConfig.transports
+        })), m.provider;
       },
       /**
        * Checks if the user is authorized
@@ -116,8 +121,8 @@ function Z(d) {
        * @param accounts - {readonly string[]} - The accounts of the user (wagmi expects readonly string, not 0xstring)
        */
       onAccountsChanged(e) {
-        a.emitter.emit("change", {
-          accounts: e.map((t) => f(t))
+        s.emitter.emit("change", {
+          accounts: e.map((t) => D(t))
         });
       },
       /**
@@ -127,7 +132,7 @@ function Z(d) {
        */
       onChainChanged(e) {
         const t = Number(e);
-        a.emitter.emit("change", { chainId: t });
+        s.emitter.emit("change", { chainId: t });
       },
       /**
        * Handle connect events ensuring we emit the events to wagmi
@@ -137,13 +142,13 @@ function Z(d) {
        */
       async onConnect({ chainId: e }) {
         const t = await this.getAccounts();
-        t.length !== 0 && a.emitter.emit("connect", { accounts: t, chainId: Number(e) });
+        t.length !== 0 && s.emitter.emit("connect", { accounts: t, chainId: Number(e) });
       },
       /**
        * Handle disconnect events ensuring we emit the events to wagmi
        */
       async onDisconnect() {
-        a.emitter.emit("disconnect");
+        s.emitter.emit("disconnect");
       },
       /**
        * Switches the user to the specified chain
@@ -153,8 +158,8 @@ function Z(d) {
        * @returns {Promise<Chain>} The chain that was switched to
        */
       async switchChain({ chainId: e }) {
-        const t = v.find((n) => n.id === e);
-        if (!t) throw new y(new Error("Chain not configured"));
+        const t = C.find((i) => i.id === e);
+        if (!t) throw new f(new Error("Chain not configured"));
         return await (await this.getProvider()).request({
           method: "wallet_switchEthereumChain",
           params: [{ chainId: b(e) }]
@@ -162,12 +167,13 @@ function Z(d) {
       },
       // Below are temporary values while we dev
       icon: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDJMMiA3VjE3TDEyIDIyTDIyIDE3VjdMMTIgMloiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K",
-      id: "cdp",
+      id: E,
       name: "CDP",
       type: "injected"
     };
   });
 }
 export {
-  Z as createCDPEmbeddedWalletConnector
+  E as CDP_CONNECTOR_ID,
+  M as createCDPEmbeddedWalletConnector
 };

package/dist/types/index.d.ts

@@ -2,6 +2,8 @@ import { CDPEmbeddedWalletConfig } from '@coinbase/cdp-core';
 import { Config } from '@coinbase/cdp-core';
 import { createConnector } from 'wagmi';
 
+export declare const CDP_CONNECTOR_ID = "cdp-embedded-wallet";
+
 export declare function createCDPEmbeddedWalletConnector(parameters: {
     cdpConfig: Config;
     providerConfig: CDPEmbeddedWalletConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cdp-wagmi",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "type": "module",
   "files": [
     "dist/**",
@@ -18,7 +18,7 @@
     "react": ">=18.2.0",
     "viem": "^2.33.0",
     "wagmi": "^2.16.0",
-    "@coinbase/cdp-core": "^0.0.14"
+    "@coinbase/cdp-core": "^0.0.15"
   },
   "devDependencies": {
     "@tanstack/react-query": "^5.0.0",
@@ -34,7 +34,7 @@
     "@size-limit/webpack": "^11.2.0",
     "@size-limit/webpack-why": "^11.2.0",
     "size-limit": "^11.2.0",
-    "@coinbase/cdp-core": "^0.0.14"
+    "@coinbase/cdp-core": "^0.0.15"
   },
   "size-limit": [
     {