add thirdweb connector

packages/agw-react/package.json

@@ -37,6 +37,11 @@
       "import": "./dist/esm/exports/privy.js",
       "require": "./dist/cjs/exports/privy.js"
     },
+    "./thirdweb": {
+      "types": "./dist/types/exports/thirdweb.d.ts",
+      "import": "./dist/esm/exports/thirdweb.js",
+      "require": "./dist/cjs/exports/thirdweb.js"
+    },
     "./package.json": "./package.json"
   },
   "typesVersions": {
@@ -61,6 +66,7 @@
     "@tanstack/react-query": "^5",
     "react": ">=18",
     "typescript": ">=5.0.4",
+    "thirdweb": "^5.68.0",
     "viem": "^2.21.26",
     "wagmi": "^2"
   },
@@ -75,11 +81,15 @@
     "@wagmi/core": "^2",
     "react": ">=18.3.1",
     "react-dom": ">=18.3.1",
+    "thirdweb": "^5.68.0",
     "viem": "^2.21.26"
   },
   "peerDependenciesMeta": {
     "typescript": {
       "optional": true
+    },
+    "thirdweb": {
+      "optional": true
     }
   },
   "keywords": [

packages/agw-react/src/abstractWalletConnector.ts

@@ -13,7 +13,7 @@ import { abstractTestnet } from 'viem/chains';
 import { AGW_APP_ID, ICON_URL } from './constants.js';
 
 // TODO: support Abstract mainnet
-const VALID_CHAINS: Record<number, Chain> = {
+export const VALID_CHAINS: Record<number, Chain> = {
   [abstractTestnet.id]: abstractTestnet,
 };
 

packages/agw-react/src/abstractWalletThirdweb.ts

@@ -0,0 +1,36 @@
+import { createEmitter } from '@wagmi/core/internal';
+import { EIP1193, type Wallet } from 'thirdweb/wallets';
+import type { Chain } from 'viem/chains';
+
+import {
+  abstractWalletConnector,
+  VALID_CHAINS,
+} from './abstractWalletConnector.js';
+
+/**
+ * Create a thirdweb wallet for Abstract Global Wallet
+ *
+ * @returns A wallet instance wrapping Abstract Global Wallet to be used with the thirdweb Connect SDK
+ *
+ * @example
+ * ```tsx
+ * import { createThirdwebClient } from "thirdweb";
+ * import { abstractWallet } from "@abstract-foundation/agw-react/thirdweb"
+ *
+ * const client = createThirdwebClient({ clientId });
+ *
+ * <ConnectButton client={client} wallets=[abstractWallet()]>
+ * ```
+ */
+const abstractWallet = (): Wallet => {
+  const connector = abstractWalletConnector()({
+    chains: Object.values(VALID_CHAINS) as [Chain, ...Chain[]],
+    emitter: createEmitter('xyz.abs'),
+  });
+  return EIP1193.fromProvider({
+    provider: connector.getProvider,
+    walletId: 'xyz.abs',
+  });
+};
+
+export { abstractWallet };

packages/agw-react/src/exports/thirdweb.ts

@@ -0,0 +1 @@
+export { abstractWallet } from '../abstractWalletThirdweb.js';