@coinbase/cdp-hooks 0.0.20 → 0.0.22

package/README.md

@@ -58,6 +58,27 @@ function App() {
 }
 ```
 
+#### Smart Account Configuration
+
+You can configure the provider to automatically create Smart Accounts for new users:
+
+```tsx
+function App() {
+  return (
+    <CDPHooksProvider
+      config={{
+        projectId: "your-project-id",
+        createAccountOnLogin: "evm-smart", // Creates Smart Accounts instead of EOAs
+      }}
+    >
+      <App />
+    </CDPHooksProvider>
+  );
+}
+```
+
+* When `createAccountOnLogin` is set to `"evm-smart"`, new users will automatically get both an EOA and a Smart Account.
+
 ### Sign In a User
 
 End user authentication proceeds in two steps:
@@ -89,7 +110,8 @@ function SignIn() {
       });
 
       console.log("Signed in user:", user);
-      console.log("User EVM address", user.evmAccounts[0]);
+      console.log("User EVM address (EOA):", user.evmAccounts[0]);
+      console.log("User Smart Account:", user.evmSmartAccounts?.[0]);
     } catch (error) {
       console.error("Sign in failed:", error);
     }
@@ -120,7 +142,10 @@ function UserInformation() {
     <div>
       <h2>User Information</h2>
       <p>User ID: {user.userId}</p>
-      <p>EVM Address: {evmAddress}</p>
+      <p>EVM Address (EOA): {evmAddress}</p>
+      {user.evmSmartAccounts?.[0] && (
+        <p>Smart Account: {user.evmSmartAccounts[0]}</p>
+      )}
       { email && <p>EmailAddress: {emailAddress}</p>}
     </div>
   );
@@ -327,3 +352,150 @@ function ExportKey() {
   return <button onClick={handleExport}>Export Private Key</button>;
 }
 ```
+
+### Smart Account Operations
+
+Smart Accounts provide advanced account abstraction features with React hooks.
+
+#### Send User Operations
+
+Send user operations from Smart Accounts with support for multiple calls and paymaster sponsorship. The hook returns a method to execute the user operation and `status`, `data`, and `error` properties to read the result of the user operation:
+
+```tsx
+import { useSendUserOperation, useCurrentUser } from "@coinbase/cdp-hooks";
+
+function SendUserOperation() {
+  const { sendUserOperation, status, data, error } = useSendUserOperation();
+  const { currentUser } = useCurrentUser();
+
+  const handleSendUserOperation = async () => {
+    const smartAccount = currentUser?.evmSmartAccounts?.[0];
+    if (!smartAccount) return;
+
+    try {
+      // This will automatically start tracking the user operation status
+      const result = await sendUserOperation({
+        evmSmartAccount: smartAccount,
+        network: "base-sepolia",
+        calls: [{
+          to: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+          value: 1000000000000000000n,
+          data: "0x",
+        }],
+      });
+
+      console.log("User Operation Hash:", result.userOperationHash);
+    } catch (error) {
+      console.error("Failed to send user operation:", error);
+    }
+  };
+
+  return (
+    <div>
+      {status === "idle" && <p>Ready to send user operation</p>}
+      
+      {status === "pending" && (
+        <div>
+          <p>User operation pending...</p>
+          {data && <p>User Op Hash: {data.userOpHash}</p>}
+        </div>
+      )}
+      
+      {status === "success" && data && (
+        <div>
+          <p>User operation successful!</p>
+          <p>Transaction Hash: {data.transactionHash}</p>
+          <p>Status: {data.status}</p>
+        </div>
+      )}
+      
+      {status === "error" && (
+        <div>
+          <p>User operation failed</p>
+          <p>Error: {error?.message}</p>
+        </div>
+      )}
+      
+      <button onClick={handleSendUserOperation} disabled={status === "pending"}>
+        {status === "pending" ? "Sending..." : "Send User Operation"}
+      </button>
+    </div>
+  );
+}
+```
+
+#### Track User Operation Status
+
+Use the `useWaitForUserOperation` hook to poll for user operation status and provide real-time updates. This hook immediately fires off a query to get the result of the user operation:
+
+```tsx
+import { useWaitForUserOperation, useState } from "react";
+
+function WaitForUserOperation() {
+  const { status, data, error } = useWaitForUserOperation({
+    userOperationHash: "0x1234567890abcdef1234567890abcdef1234567890abcdef1234567890abcdef",
+    evmSmartAccount: "0x1234567890123456789012345678901234567890",
+    network: "base-sepolia"
+  });
+
+  return (
+    <div>
+      {status === "idle" && <p>No user operation being tracked</p>}
+      
+      {status === "pending" && (
+        <div>
+          <p>User operation pending...</p>
+          {data && <p>User Op Hash: {data.userOpHash}</p>}
+        </div>
+      )}
+      
+      {status === "success" && data && (
+        <div>
+          <p>User operation successful!</p>
+          <p>Transaction Hash: {data.transactionHash}</p>
+          <p>Status: {data.status}</p>
+        </div>
+      )}
+      
+      {status === "error" && (
+        <div>
+          <p>User operation failed</p>
+          <p>Error: {error?.message}</p>
+        </div>
+      )}
+    </div>
+  );
+}
+```
+
+#### Conditional Polling
+
+You can control when the `useWaitForUserOperation` hook should start polling using the `enabled` parameter:
+
+```tsx
+function ConditionalWaitForUserOperation() {
+  const [shouldPoll, setShouldPoll] = useState(false);
+  
+  const { status, data, error } = useWaitForUserOperation({
+    userOperationHash: "0x1234...",
+    evmSmartAccount: "0x5678...", 
+    network: "base-sepolia",
+    enabled: shouldPoll // Only poll when this is true
+  });
+
+  return (
+    <div>
+      <button onClick={() => setShouldPoll(true)}>
+        Start Polling
+      </button>
+      <button onClick={() => setShouldPoll(false)}>
+        Stop Polling  
+      </button>
+      
+      <p>Status: {status}</p>
+      {data && <p>User Operation Status: {data.status}</p>}
+      {error && <p>Error: {error.message}</p>}
+    </div>
+  );
+}
+```

package/dist/esm/index.js

@@ -1,27 +1,29 @@
 import { APIError as n } from "@coinbase/cdp-core";
-import { CDPContext as i, CDPHooksProvider as r } from "./index2.js";
-import { useConfig as o, useCurrentUser as a, useEnforceAuthenticated as m, useEnforceUnauthenticated as E, useEvmAddress as S, useExportEvmAccount as c, useGetAccessToken as g, useIsInitialized as d, useIsSignedIn as f, useSendEvmTransaction as v, useSignEvmHash as I, useSignEvmMessage as P, useSignEvmTransaction as T, useSignEvmTypedData as h, useSignInWithEmail as p, useSignInWithSms as x, useSignOut as A, useVerifyEmailOTP as C, useVerifySmsOTP as l } from "./index3.js";
+import { CDPContext as i, CDPHooksProvider as u } from "./index2.js";
+import { useConfig as o, useCurrentUser as a, useEnforceAuthenticated as m, useEnforceUnauthenticated as E, useEvmAddress as S, useExportEvmAccount as c, useGetAccessToken as d, useIsInitialized as g, useIsSignedIn as f, useSendEvmTransaction as v, useSendUserOperation as p, useSignEvmHash as I, useSignEvmMessage as P, useSignEvmTransaction as T, useSignEvmTypedData as h, useSignInWithEmail as x, useSignInWithSms as A, useSignOut as C, useVerifyEmailOTP as O, useVerifySmsOTP as U, useWaitForUserOperation as l } from "./index3.js";
 export {
   n as APIError,
   i as CDPContext,
-  r as CDPHooksProvider,
+  u as CDPHooksProvider,
   o as useConfig,
   a as useCurrentUser,
   m as useEnforceAuthenticated,
   E as useEnforceUnauthenticated,
   S as useEvmAddress,
   c as useExportEvmAccount,
-  g as useGetAccessToken,
-  d as useIsInitialized,
+  d as useGetAccessToken,
+  g as useIsInitialized,
   f as useIsSignedIn,
   v as useSendEvmTransaction,
+  p as useSendUserOperation,
   I as useSignEvmHash,
   P as useSignEvmMessage,
   T as useSignEvmTransaction,
   h as useSignEvmTypedData,
-  p as useSignInWithEmail,
-  x as useSignInWithSms,
-  A as useSignOut,
-  C as useVerifyEmailOTP,
-  l as useVerifySmsOTP
+  x as useSignInWithEmail,
+  A as useSignInWithSms,
+  C as useSignOut,
+  O as useVerifyEmailOTP,
+  U as useVerifySmsOTP,
+  l as useWaitForUserOperation
 };

package/dist/esm/index10.js

@@ -1,6 +1,35 @@
-function e(r) {
-  return typeof r == "string" ? { address: r, type: "json-rpc" } : r;
+import { parseAccount as I } from "./index11.js";
+import { uid as M } from "./index12.js";
+function O(n) {
+  const { batch: s, chain: e, ccipRead: u, key: d = "base", name: f = "Base Client", type: m = "base" } = n, o = n.experimental_blockTag ?? (typeof e?.experimental_preconfirmationTime == "number" ? "pending" : void 0), b = e?.blockTime ?? 12e3, p = Math.min(Math.max(Math.floor(b / 2), 500), 4e3), t = n.pollingInterval ?? p, g = n.cacheTime ?? t, x = n.account ? I(n.account) : void 0, { config: h, request: T, value: k } = n.transport({
+    chain: e,
+    pollingInterval: t
+  }), _ = { ...h, ...k }, c = {
+    account: x,
+    batch: s,
+    cacheTime: g,
+    ccipRead: u,
+    chain: e,
+    key: d,
+    name: f,
+    pollingInterval: t,
+    request: T,
+    transport: _,
+    type: m,
+    uid: M(),
+    ...o ? { experimental_blockTag: o } : {}
+  };
+  function i(l) {
+    return (v) => {
+      const a = v(l);
+      for (const y in c)
+        delete a[y];
+      const r = { ...l, ...a };
+      return Object.assign(r, { extend: i(r) });
+    };
+  }
+  return Object.assign(c, { extend: i(c) });
 }
 export {
-  e as parseAccount
+  O as createClient
 };

package/dist/esm/index100.js

@@ -1,196 +1,37 @@
-import { formatGwei as a } from "./index90.js";
-import { BaseError as t } from "./index81.js";
-class s extends t {
-  constructor({ cause: r, message: e } = {}) {
-    const n = e?.replace("execution reverted: ", "")?.replace("execution reverted", "");
-    super(`Execution reverted ${n ? `with reason: ${n}` : "for an unknown reason"}.`, {
-      cause: r,
-      name: "ExecutionRevertedError"
-    });
-  }
-}
-Object.defineProperty(s, "code", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: 3
-});
-Object.defineProperty(s, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /execution reverted/
-});
-class c extends t {
-  constructor({ cause: r, maxFeePerGas: e } = {}) {
-    super(`The fee cap (\`maxFeePerGas\`${e ? ` = ${a(e)} gwei` : ""}) cannot be higher than the maximum allowed value (2^256-1).`, {
-      cause: r,
-      name: "FeeCapTooHighError"
-    });
-  }
-}
-Object.defineProperty(c, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /max fee per gas higher than 2\^256-1|fee cap higher than 2\^256-1/
-});
-class i extends t {
-  constructor({ cause: r, maxFeePerGas: e } = {}) {
-    super(`The fee cap (\`maxFeePerGas\`${e ? ` = ${a(e)}` : ""} gwei) cannot be lower than the block base fee.`, {
-      cause: r,
-      name: "FeeCapTooLowError"
-    });
-  }
-}
-Object.defineProperty(i, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /max fee per gas less than block base fee|fee cap less than block base fee|transaction is outdated/
-});
-class u extends t {
-  constructor({ cause: r, nonce: e } = {}) {
-    super(`Nonce provided for the transaction ${e ? `(${e}) ` : ""}is higher than the next one expected.`, { cause: r, name: "NonceTooHighError" });
-  }
-}
-Object.defineProperty(u, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /nonce too high/
-});
-class l extends t {
-  constructor({ cause: r, nonce: e } = {}) {
-    super([
-      `Nonce provided for the transaction ${e ? `(${e}) ` : ""}is lower than the current nonce of the account.`,
-      "Try increasing the nonce or find the latest nonce with `getTransactionCount`."
-    ].join(`
-`), { cause: r, name: "NonceTooLowError" });
-  }
-}
-Object.defineProperty(l, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /nonce too low|transaction already imported|already known/
-});
-class d extends t {
-  constructor({ cause: r, nonce: e } = {}) {
-    super(`Nonce provided for the transaction ${e ? `(${e}) ` : ""}exceeds the maximum allowed nonce.`, { cause: r, name: "NonceMaxValueError" });
-  }
-}
-Object.defineProperty(d, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /nonce has max value/
-});
-class h extends t {
-  constructor({ cause: r } = {}) {
-    super([
-      "The total cost (gas * gas fee + value) of executing this transaction exceeds the balance of the account."
-    ].join(`
-`), {
-      cause: r,
+import { formatEther as E } from "./index90.js";
+import { formatGwei as t } from "./index91.js";
+import { BaseError as y } from "./index82.js";
+import { prettyPrint as l } from "./index93.js";
+class x extends y {
+  constructor(e, { account: a, docsPath: n, chain: m, data: f, gas: u, gasPrice: r, maxFeePerGas: o, maxPriorityFeePerGas: s, nonce: d, to: p, value: i }) {
+    const g = l({
+      from: a?.address,
+      to: p,
+      value: typeof i < "u" && `${E(i)} ${m?.nativeCurrency?.symbol || "ETH"}`,
+      data: f,
+      gas: u,
+      gasPrice: typeof r < "u" && `${t(r)} gwei`,
+      maxFeePerGas: typeof o < "u" && `${t(o)} gwei`,
+      maxPriorityFeePerGas: typeof s < "u" && `${t(s)} gwei`,
+      nonce: d
+    });
+    super(e.shortMessage, {
+      cause: e,
+      docsPath: n,
       metaMessages: [
-        "This error could arise when the account does not have enough funds to:",
-        " - pay for the total gas fee,",
-        " - pay for the value to send.",
-        " ",
-        "The cost of the transaction is calculated as `gas * gas fee + value`, where:",
-        " - `gas` is the amount of gas needed for transaction to execute,",
-        " - `gas fee` is the gas fee,",
-        " - `value` is the amount of ether to send to the recipient."
-      ],
-      name: "InsufficientFundsError"
-    });
-  }
-}
-Object.defineProperty(h, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /insufficient funds|exceeds transaction sender account balance/
-});
-class f extends t {
-  constructor({ cause: r, gas: e } = {}) {
-    super(`The amount of gas ${e ? `(${e}) ` : ""}provided for the transaction exceeds the limit allowed for the block.`, {
-      cause: r,
-      name: "IntrinsicGasTooHighError"
-    });
-  }
-}
-Object.defineProperty(f, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /intrinsic gas too high|gas limit reached/
-});
-class p extends t {
-  constructor({ cause: r, gas: e } = {}) {
-    super(`The amount of gas ${e ? `(${e}) ` : ""}provided for the transaction is too low.`, {
-      cause: r,
-      name: "IntrinsicGasTooLowError"
-    });
-  }
-}
-Object.defineProperty(p, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /intrinsic gas too low/
-});
-class g extends t {
-  constructor({ cause: r }) {
-    super("The transaction type is not supported for this chain.", {
-      cause: r,
-      name: "TransactionTypeNotSupportedError"
-    });
-  }
-}
-Object.defineProperty(g, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /transaction type not valid/
-});
-class b extends t {
-  constructor({ cause: r, maxPriorityFeePerGas: e, maxFeePerGas: n } = {}) {
-    super([
-      `The provided tip (\`maxPriorityFeePerGas\`${e ? ` = ${a(e)} gwei` : ""}) cannot be higher than the fee cap (\`maxFeePerGas\`${n ? ` = ${a(n)} gwei` : ""}).`
-    ].join(`
-`), {
-      cause: r,
-      name: "TipAboveFeeCapError"
-    });
-  }
-}
-Object.defineProperty(b, "nodeMessage", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: /max priority fee per gas higher than max fee per gas|tip higher than fee cap/
-});
-class x extends t {
-  constructor({ cause: r }) {
-    super(`An error occurred while executing: ${r?.shortMessage}`, {
-      cause: r,
-      name: "UnknownNodeError"
-    });
+        ...e.metaMessages ? [...e.metaMessages, " "] : [],
+        "Estimate Gas Arguments:",
+        g
+      ].filter(Boolean),
+      name: "EstimateGasExecutionError"
+    }), Object.defineProperty(this, "cause", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: void 0
+    }), this.cause = e;
   }
 }
 export {
-  s as ExecutionRevertedError,
-  c as FeeCapTooHighError,
-  i as FeeCapTooLowError,
-  h as InsufficientFundsError,
-  f as IntrinsicGasTooHighError,
-  p as IntrinsicGasTooLowError,
-  d as NonceMaxValueError,
-  u as NonceTooHighError,
-  l as NonceTooLowError,
-  b as TipAboveFeeCapError,
-  g as TransactionTypeNotSupportedError,
-  x as UnknownNodeError
+  x as EstimateGasExecutionError
 };