@perkos/ui-payment-thirdweb 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +98 -0
- package/dist/index.d.mts +33 -0
- package/dist/index.d.ts +33 -0
- package/dist/index.js +92 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +75 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +56 -0
package/README.md
ADDED
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
# @perkos/ui-payment-thirdweb
|
|
2
|
+
|
|
3
|
+
Thirdweb wallet adapter for `@perkos/ui-payment`.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @perkos/ui-payment @perkos/ui-payment-thirdweb thirdweb
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
```tsx
|
|
14
|
+
import { PaymentButton } from "@perkos/ui-payment";
|
|
15
|
+
import { useThirdwebWallet } from "@perkos/ui-payment-thirdweb";
|
|
16
|
+
|
|
17
|
+
function Checkout({ paymentOptions }) {
|
|
18
|
+
const wallet = useThirdwebWallet();
|
|
19
|
+
|
|
20
|
+
return (
|
|
21
|
+
<PaymentButton
|
|
22
|
+
wallet={wallet}
|
|
23
|
+
accepts={paymentOptions}
|
|
24
|
+
onPaymentSigned={(envelope) => {
|
|
25
|
+
// Retry your API request with the signed payment
|
|
26
|
+
fetch("/api/paid-service", {
|
|
27
|
+
headers: {
|
|
28
|
+
"PAYMENT-SIGNATURE": btoa(JSON.stringify(envelope)),
|
|
29
|
+
},
|
|
30
|
+
});
|
|
31
|
+
}}
|
|
32
|
+
onError={(error) => console.error(error)}
|
|
33
|
+
/>
|
|
34
|
+
);
|
|
35
|
+
}
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## Requirements
|
|
39
|
+
|
|
40
|
+
This package requires:
|
|
41
|
+
- `@perkos/ui-payment` >= 1.0.0
|
|
42
|
+
- `thirdweb` >= 5.0.0
|
|
43
|
+
- `react` >= 18.0.0
|
|
44
|
+
|
|
45
|
+
Your app must be wrapped in Thirdweb's `ThirdwebProvider`.
|
|
46
|
+
|
|
47
|
+
## API
|
|
48
|
+
|
|
49
|
+
### useThirdwebWallet()
|
|
50
|
+
|
|
51
|
+
Returns a `WalletAdapter` compatible with `@perkos/ui-payment`.
|
|
52
|
+
|
|
53
|
+
```tsx
|
|
54
|
+
const wallet = useThirdwebWallet();
|
|
55
|
+
|
|
56
|
+
// wallet.address - Connected wallet address
|
|
57
|
+
// wallet.chainId - Current chain ID
|
|
58
|
+
// wallet.isConnected - Whether wallet is connected
|
|
59
|
+
// wallet.signTypedData() - Sign EIP-712 data
|
|
60
|
+
// wallet.switchChain() - Switch to a different chain
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### getThirdwebChain(chainId)
|
|
64
|
+
|
|
65
|
+
Get Thirdweb chain object from chain ID.
|
|
66
|
+
|
|
67
|
+
```tsx
|
|
68
|
+
import { getThirdwebChain } from "@perkos/ui-payment-thirdweb";
|
|
69
|
+
|
|
70
|
+
const chain = getThirdwebChain(43114); // Returns avalanche chain object
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
### isChainSupported(chainId)
|
|
74
|
+
|
|
75
|
+
Check if a chain ID is supported.
|
|
76
|
+
|
|
77
|
+
```tsx
|
|
78
|
+
import { isChainSupported } from "@perkos/ui-payment-thirdweb";
|
|
79
|
+
|
|
80
|
+
isChainSupported(43114); // true (Avalanche)
|
|
81
|
+
isChainSupported(999); // false
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
## Supported Chains
|
|
85
|
+
|
|
86
|
+
| Chain | Chain ID |
|
|
87
|
+
|-------|----------|
|
|
88
|
+
| Ethereum | 1 |
|
|
89
|
+
| Avalanche | 43114 |
|
|
90
|
+
| Avalanche Fuji | 43113 |
|
|
91
|
+
| Base | 8453 |
|
|
92
|
+
| Base Sepolia | 84532 |
|
|
93
|
+
| Celo | 42220 |
|
|
94
|
+
| Celo Sepolia | 11142220 |
|
|
95
|
+
|
|
96
|
+
## License
|
|
97
|
+
|
|
98
|
+
MIT
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Chain } from 'thirdweb/chains';
|
|
2
|
+
import { WalletAdapter } from '@perkos/ui-payment';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* @perkos/ui-payment-thirdweb - Thirdweb Wallet Adapter
|
|
6
|
+
* Implements WalletAdapter interface for Thirdweb SDK
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Hook that returns a WalletAdapter for Thirdweb
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* import { PaymentButton } from "@perkos/ui-payment";
|
|
15
|
+
* import { useThirdwebWallet } from "@perkos/ui-payment-thirdweb";
|
|
16
|
+
*
|
|
17
|
+
* function Checkout() {
|
|
18
|
+
* const wallet = useThirdwebWallet();
|
|
19
|
+
* return <PaymentButton wallet={wallet} accepts={options} onPaymentSigned={handle} />;
|
|
20
|
+
* }
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
declare function useThirdwebWallet(): WalletAdapter;
|
|
24
|
+
/**
|
|
25
|
+
* Get Thirdweb chain object from chain ID
|
|
26
|
+
*/
|
|
27
|
+
declare function getThirdwebChain(chainId: number): Chain | undefined;
|
|
28
|
+
/**
|
|
29
|
+
* Check if a chain ID is supported
|
|
30
|
+
*/
|
|
31
|
+
declare function isChainSupported(chainId: number): boolean;
|
|
32
|
+
|
|
33
|
+
export { getThirdwebChain, isChainSupported, useThirdwebWallet };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Chain } from 'thirdweb/chains';
|
|
2
|
+
import { WalletAdapter } from '@perkos/ui-payment';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* @perkos/ui-payment-thirdweb - Thirdweb Wallet Adapter
|
|
6
|
+
* Implements WalletAdapter interface for Thirdweb SDK
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Hook that returns a WalletAdapter for Thirdweb
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* import { PaymentButton } from "@perkos/ui-payment";
|
|
15
|
+
* import { useThirdwebWallet } from "@perkos/ui-payment-thirdweb";
|
|
16
|
+
*
|
|
17
|
+
* function Checkout() {
|
|
18
|
+
* const wallet = useThirdwebWallet();
|
|
19
|
+
* return <PaymentButton wallet={wallet} accepts={options} onPaymentSigned={handle} />;
|
|
20
|
+
* }
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
declare function useThirdwebWallet(): WalletAdapter;
|
|
24
|
+
/**
|
|
25
|
+
* Get Thirdweb chain object from chain ID
|
|
26
|
+
*/
|
|
27
|
+
declare function getThirdwebChain(chainId: number): Chain | undefined;
|
|
28
|
+
/**
|
|
29
|
+
* Check if a chain ID is supported
|
|
30
|
+
*/
|
|
31
|
+
declare function isChainSupported(chainId: number): boolean;
|
|
32
|
+
|
|
33
|
+
export { getThirdwebChain, isChainSupported, useThirdwebWallet };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/index.ts
|
|
21
|
+
var index_exports = {};
|
|
22
|
+
__export(index_exports, {
|
|
23
|
+
getThirdwebChain: () => getThirdwebChain,
|
|
24
|
+
isChainSupported: () => isChainSupported,
|
|
25
|
+
useThirdwebWallet: () => useThirdwebWallet
|
|
26
|
+
});
|
|
27
|
+
module.exports = __toCommonJS(index_exports);
|
|
28
|
+
|
|
29
|
+
// src/useThirdwebWallet.ts
|
|
30
|
+
var import_react = require("react");
|
|
31
|
+
var import_react2 = require("thirdweb/react");
|
|
32
|
+
var import_chains = require("thirdweb/chains");
|
|
33
|
+
var celoSepolia = (0, import_chains.defineChain)({
|
|
34
|
+
id: 11142220,
|
|
35
|
+
name: "Celo Sepolia",
|
|
36
|
+
nativeCurrency: { name: "Celo", symbol: "CELO", decimals: 18 },
|
|
37
|
+
rpc: "https://alfajores-forno.celo-testnet.org"
|
|
38
|
+
});
|
|
39
|
+
var CHAIN_ID_TO_THIRDWEB = {
|
|
40
|
+
1: import_chains.ethereum,
|
|
41
|
+
43114: import_chains.avalanche,
|
|
42
|
+
43113: import_chains.avalancheFuji,
|
|
43
|
+
8453: import_chains.base,
|
|
44
|
+
84532: import_chains.baseSepolia,
|
|
45
|
+
42220: import_chains.celo,
|
|
46
|
+
11142220: celoSepolia
|
|
47
|
+
};
|
|
48
|
+
function useThirdwebWallet() {
|
|
49
|
+
const account = (0, import_react2.useActiveAccount)();
|
|
50
|
+
const chain = (0, import_react2.useActiveWalletChain)();
|
|
51
|
+
const switchChainFn = (0, import_react2.useSwitchActiveWalletChain)();
|
|
52
|
+
return (0, import_react.useMemo)(
|
|
53
|
+
() => ({
|
|
54
|
+
address: account?.address,
|
|
55
|
+
chainId: chain?.id,
|
|
56
|
+
isConnected: !!account,
|
|
57
|
+
signTypedData: async (params) => {
|
|
58
|
+
if (!account) {
|
|
59
|
+
throw new Error("Wallet not connected");
|
|
60
|
+
}
|
|
61
|
+
const signature = await account.signTypedData({
|
|
62
|
+
domain: params.domain,
|
|
63
|
+
types: params.types,
|
|
64
|
+
primaryType: params.primaryType,
|
|
65
|
+
message: params.message
|
|
66
|
+
});
|
|
67
|
+
return signature;
|
|
68
|
+
},
|
|
69
|
+
switchChain: async (chainId) => {
|
|
70
|
+
const targetChain = CHAIN_ID_TO_THIRDWEB[chainId];
|
|
71
|
+
if (!targetChain) {
|
|
72
|
+
throw new Error(`Unsupported chain ID: ${chainId}`);
|
|
73
|
+
}
|
|
74
|
+
await switchChainFn(targetChain);
|
|
75
|
+
}
|
|
76
|
+
}),
|
|
77
|
+
[account, chain?.id, switchChainFn]
|
|
78
|
+
);
|
|
79
|
+
}
|
|
80
|
+
function getThirdwebChain(chainId) {
|
|
81
|
+
return CHAIN_ID_TO_THIRDWEB[chainId];
|
|
82
|
+
}
|
|
83
|
+
function isChainSupported(chainId) {
|
|
84
|
+
return chainId in CHAIN_ID_TO_THIRDWEB;
|
|
85
|
+
}
|
|
86
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
87
|
+
0 && (module.exports = {
|
|
88
|
+
getThirdwebChain,
|
|
89
|
+
isChainSupported,
|
|
90
|
+
useThirdwebWallet
|
|
91
|
+
});
|
|
92
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/useThirdwebWallet.ts"],"sourcesContent":["/**\n * @perkos/ui-payment-thirdweb\n * Thirdweb wallet adapter for @perkos/ui-payment\n *\n * @example\n * ```tsx\n * import { PaymentButton } from \"@perkos/ui-payment\";\n * import { useThirdwebWallet } from \"@perkos/ui-payment-thirdweb\";\n *\n * function Checkout() {\n * const wallet = useThirdwebWallet();\n * return (\n * <PaymentButton\n * wallet={wallet}\n * accepts={paymentOptions}\n * onPaymentSigned={handlePayment}\n * />\n * );\n * }\n * ```\n */\n\nexport {\n useThirdwebWallet,\n getThirdwebChain,\n isChainSupported,\n} from \"./useThirdwebWallet\";\n","/**\n * @perkos/ui-payment-thirdweb - Thirdweb Wallet Adapter\n * Implements WalletAdapter interface for Thirdweb SDK\n */\n\nimport { useMemo } from \"react\";\nimport {\n useActiveAccount,\n useActiveWalletChain,\n useSwitchActiveWalletChain,\n} from \"thirdweb/react\";\nimport {\n avalanche,\n avalancheFuji,\n base,\n baseSepolia,\n celo,\n ethereum,\n defineChain,\n} from \"thirdweb/chains\";\n\n// Define Celo Sepolia (not in thirdweb by default)\nconst celoSepolia = defineChain({\n id: 11142220,\n name: \"Celo Sepolia\",\n nativeCurrency: { name: \"Celo\", symbol: \"CELO\", decimals: 18 },\n rpc: \"https://alfajores-forno.celo-testnet.org\",\n});\n\nimport type { Chain } from \"thirdweb/chains\";\nimport type { WalletAdapter, SignTypedDataParams } from \"@perkos/ui-payment\";\n\n/**\n * Map chain IDs to Thirdweb chain objects\n */\nconst CHAIN_ID_TO_THIRDWEB: Record<number, Chain> = {\n 1: ethereum,\n 43114: avalanche,\n 43113: avalancheFuji,\n 8453: base,\n 84532: baseSepolia,\n 42220: celo,\n 11142220: celoSepolia,\n};\n\n/**\n * Hook that returns a WalletAdapter for Thirdweb\n *\n * @example\n * ```tsx\n * import { PaymentButton } from \"@perkos/ui-payment\";\n * import { useThirdwebWallet } from \"@perkos/ui-payment-thirdweb\";\n *\n * function Checkout() {\n * const wallet = useThirdwebWallet();\n * return <PaymentButton wallet={wallet} accepts={options} onPaymentSigned={handle} />;\n * }\n * ```\n */\nexport function useThirdwebWallet(): WalletAdapter {\n const account = useActiveAccount();\n const chain = useActiveWalletChain();\n const switchChainFn = useSwitchActiveWalletChain();\n\n return useMemo<WalletAdapter>(\n () => ({\n address: account?.address as `0x${string}` | undefined,\n chainId: chain?.id,\n isConnected: !!account,\n\n signTypedData: async (params: SignTypedDataParams): Promise<`0x${string}`> => {\n if (!account) {\n throw new Error(\"Wallet not connected\");\n }\n\n // Thirdweb's signTypedData expects the same format\n const signature = await account.signTypedData({\n domain: params.domain,\n types: params.types,\n primaryType: params.primaryType,\n message: params.message,\n });\n\n return signature as `0x${string}`;\n },\n\n switchChain: async (chainId: number): Promise<void> => {\n const targetChain = CHAIN_ID_TO_THIRDWEB[chainId];\n\n if (!targetChain) {\n throw new Error(`Unsupported chain ID: ${chainId}`);\n }\n\n await switchChainFn(targetChain);\n },\n }),\n [account, chain?.id, switchChainFn]\n );\n}\n\n/**\n * Get Thirdweb chain object from chain ID\n */\nexport function getThirdwebChain(chainId: number): Chain | undefined {\n return CHAIN_ID_TO_THIRDWEB[chainId];\n}\n\n/**\n * Check if a chain ID is supported\n */\nexport function isChainSupported(chainId: number): boolean {\n return chainId in CHAIN_ID_TO_THIRDWEB;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACKA,mBAAwB;AACxB,IAAAA,gBAIO;AACP,oBAQO;AAGP,IAAM,kBAAc,2BAAY;AAAA,EAC9B,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,gBAAgB,EAAE,MAAM,QAAQ,QAAQ,QAAQ,UAAU,GAAG;AAAA,EAC7D,KAAK;AACP,CAAC;AAQD,IAAM,uBAA8C;AAAA,EAClD,GAAG;AAAA,EACH,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AACZ;AAgBO,SAAS,oBAAmC;AACjD,QAAM,cAAU,gCAAiB;AACjC,QAAM,YAAQ,oCAAqB;AACnC,QAAM,oBAAgB,0CAA2B;AAEjD,aAAO;AAAA,IACL,OAAO;AAAA,MACL,SAAS,SAAS;AAAA,MAClB,SAAS,OAAO;AAAA,MAChB,aAAa,CAAC,CAAC;AAAA,MAEf,eAAe,OAAO,WAAwD;AAC5E,YAAI,CAAC,SAAS;AACZ,gBAAM,IAAI,MAAM,sBAAsB;AAAA,QACxC;AAGA,cAAM,YAAY,MAAM,QAAQ,cAAc;AAAA,UAC5C,QAAQ,OAAO;AAAA,UACf,OAAO,OAAO;AAAA,UACd,aAAa,OAAO;AAAA,UACpB,SAAS,OAAO;AAAA,QAClB,CAAC;AAED,eAAO;AAAA,MACT;AAAA,MAEA,aAAa,OAAO,YAAmC;AACrD,cAAM,cAAc,qBAAqB,OAAO;AAEhD,YAAI,CAAC,aAAa;AAChB,gBAAM,IAAI,MAAM,yBAAyB,OAAO,EAAE;AAAA,QACpD;AAEA,cAAM,cAAc,WAAW;AAAA,MACjC;AAAA,IACF;AAAA,IACA,CAAC,SAAS,OAAO,IAAI,aAAa;AAAA,EACpC;AACF;AAKO,SAAS,iBAAiB,SAAoC;AACnE,SAAO,qBAAqB,OAAO;AACrC;AAKO,SAAS,iBAAiB,SAA0B;AACzD,SAAO,WAAW;AACpB;","names":["import_react"]}
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
// src/useThirdwebWallet.ts
|
|
2
|
+
import { useMemo } from "react";
|
|
3
|
+
import {
|
|
4
|
+
useActiveAccount,
|
|
5
|
+
useActiveWalletChain,
|
|
6
|
+
useSwitchActiveWalletChain
|
|
7
|
+
} from "thirdweb/react";
|
|
8
|
+
import {
|
|
9
|
+
avalanche,
|
|
10
|
+
avalancheFuji,
|
|
11
|
+
base,
|
|
12
|
+
baseSepolia,
|
|
13
|
+
celo,
|
|
14
|
+
ethereum,
|
|
15
|
+
defineChain
|
|
16
|
+
} from "thirdweb/chains";
|
|
17
|
+
var celoSepolia = defineChain({
|
|
18
|
+
id: 11142220,
|
|
19
|
+
name: "Celo Sepolia",
|
|
20
|
+
nativeCurrency: { name: "Celo", symbol: "CELO", decimals: 18 },
|
|
21
|
+
rpc: "https://alfajores-forno.celo-testnet.org"
|
|
22
|
+
});
|
|
23
|
+
var CHAIN_ID_TO_THIRDWEB = {
|
|
24
|
+
1: ethereum,
|
|
25
|
+
43114: avalanche,
|
|
26
|
+
43113: avalancheFuji,
|
|
27
|
+
8453: base,
|
|
28
|
+
84532: baseSepolia,
|
|
29
|
+
42220: celo,
|
|
30
|
+
11142220: celoSepolia
|
|
31
|
+
};
|
|
32
|
+
function useThirdwebWallet() {
|
|
33
|
+
const account = useActiveAccount();
|
|
34
|
+
const chain = useActiveWalletChain();
|
|
35
|
+
const switchChainFn = useSwitchActiveWalletChain();
|
|
36
|
+
return useMemo(
|
|
37
|
+
() => ({
|
|
38
|
+
address: account?.address,
|
|
39
|
+
chainId: chain?.id,
|
|
40
|
+
isConnected: !!account,
|
|
41
|
+
signTypedData: async (params) => {
|
|
42
|
+
if (!account) {
|
|
43
|
+
throw new Error("Wallet not connected");
|
|
44
|
+
}
|
|
45
|
+
const signature = await account.signTypedData({
|
|
46
|
+
domain: params.domain,
|
|
47
|
+
types: params.types,
|
|
48
|
+
primaryType: params.primaryType,
|
|
49
|
+
message: params.message
|
|
50
|
+
});
|
|
51
|
+
return signature;
|
|
52
|
+
},
|
|
53
|
+
switchChain: async (chainId) => {
|
|
54
|
+
const targetChain = CHAIN_ID_TO_THIRDWEB[chainId];
|
|
55
|
+
if (!targetChain) {
|
|
56
|
+
throw new Error(`Unsupported chain ID: ${chainId}`);
|
|
57
|
+
}
|
|
58
|
+
await switchChainFn(targetChain);
|
|
59
|
+
}
|
|
60
|
+
}),
|
|
61
|
+
[account, chain?.id, switchChainFn]
|
|
62
|
+
);
|
|
63
|
+
}
|
|
64
|
+
function getThirdwebChain(chainId) {
|
|
65
|
+
return CHAIN_ID_TO_THIRDWEB[chainId];
|
|
66
|
+
}
|
|
67
|
+
function isChainSupported(chainId) {
|
|
68
|
+
return chainId in CHAIN_ID_TO_THIRDWEB;
|
|
69
|
+
}
|
|
70
|
+
export {
|
|
71
|
+
getThirdwebChain,
|
|
72
|
+
isChainSupported,
|
|
73
|
+
useThirdwebWallet
|
|
74
|
+
};
|
|
75
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/useThirdwebWallet.ts"],"sourcesContent":["/**\n * @perkos/ui-payment-thirdweb - Thirdweb Wallet Adapter\n * Implements WalletAdapter interface for Thirdweb SDK\n */\n\nimport { useMemo } from \"react\";\nimport {\n useActiveAccount,\n useActiveWalletChain,\n useSwitchActiveWalletChain,\n} from \"thirdweb/react\";\nimport {\n avalanche,\n avalancheFuji,\n base,\n baseSepolia,\n celo,\n ethereum,\n defineChain,\n} from \"thirdweb/chains\";\n\n// Define Celo Sepolia (not in thirdweb by default)\nconst celoSepolia = defineChain({\n id: 11142220,\n name: \"Celo Sepolia\",\n nativeCurrency: { name: \"Celo\", symbol: \"CELO\", decimals: 18 },\n rpc: \"https://alfajores-forno.celo-testnet.org\",\n});\n\nimport type { Chain } from \"thirdweb/chains\";\nimport type { WalletAdapter, SignTypedDataParams } from \"@perkos/ui-payment\";\n\n/**\n * Map chain IDs to Thirdweb chain objects\n */\nconst CHAIN_ID_TO_THIRDWEB: Record<number, Chain> = {\n 1: ethereum,\n 43114: avalanche,\n 43113: avalancheFuji,\n 8453: base,\n 84532: baseSepolia,\n 42220: celo,\n 11142220: celoSepolia,\n};\n\n/**\n * Hook that returns a WalletAdapter for Thirdweb\n *\n * @example\n * ```tsx\n * import { PaymentButton } from \"@perkos/ui-payment\";\n * import { useThirdwebWallet } from \"@perkos/ui-payment-thirdweb\";\n *\n * function Checkout() {\n * const wallet = useThirdwebWallet();\n * return <PaymentButton wallet={wallet} accepts={options} onPaymentSigned={handle} />;\n * }\n * ```\n */\nexport function useThirdwebWallet(): WalletAdapter {\n const account = useActiveAccount();\n const chain = useActiveWalletChain();\n const switchChainFn = useSwitchActiveWalletChain();\n\n return useMemo<WalletAdapter>(\n () => ({\n address: account?.address as `0x${string}` | undefined,\n chainId: chain?.id,\n isConnected: !!account,\n\n signTypedData: async (params: SignTypedDataParams): Promise<`0x${string}`> => {\n if (!account) {\n throw new Error(\"Wallet not connected\");\n }\n\n // Thirdweb's signTypedData expects the same format\n const signature = await account.signTypedData({\n domain: params.domain,\n types: params.types,\n primaryType: params.primaryType,\n message: params.message,\n });\n\n return signature as `0x${string}`;\n },\n\n switchChain: async (chainId: number): Promise<void> => {\n const targetChain = CHAIN_ID_TO_THIRDWEB[chainId];\n\n if (!targetChain) {\n throw new Error(`Unsupported chain ID: ${chainId}`);\n }\n\n await switchChainFn(targetChain);\n },\n }),\n [account, chain?.id, switchChainFn]\n );\n}\n\n/**\n * Get Thirdweb chain object from chain ID\n */\nexport function getThirdwebChain(chainId: number): Chain | undefined {\n return CHAIN_ID_TO_THIRDWEB[chainId];\n}\n\n/**\n * Check if a chain ID is supported\n */\nexport function isChainSupported(chainId: number): boolean {\n return chainId in CHAIN_ID_TO_THIRDWEB;\n}\n"],"mappings":";AAKA,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,IAAM,cAAc,YAAY;AAAA,EAC9B,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,gBAAgB,EAAE,MAAM,QAAQ,QAAQ,QAAQ,UAAU,GAAG;AAAA,EAC7D,KAAK;AACP,CAAC;AAQD,IAAM,uBAA8C;AAAA,EAClD,GAAG;AAAA,EACH,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AACZ;AAgBO,SAAS,oBAAmC;AACjD,QAAM,UAAU,iBAAiB;AACjC,QAAM,QAAQ,qBAAqB;AACnC,QAAM,gBAAgB,2BAA2B;AAEjD,SAAO;AAAA,IACL,OAAO;AAAA,MACL,SAAS,SAAS;AAAA,MAClB,SAAS,OAAO;AAAA,MAChB,aAAa,CAAC,CAAC;AAAA,MAEf,eAAe,OAAO,WAAwD;AAC5E,YAAI,CAAC,SAAS;AACZ,gBAAM,IAAI,MAAM,sBAAsB;AAAA,QACxC;AAGA,cAAM,YAAY,MAAM,QAAQ,cAAc;AAAA,UAC5C,QAAQ,OAAO;AAAA,UACf,OAAO,OAAO;AAAA,UACd,aAAa,OAAO;AAAA,UACpB,SAAS,OAAO;AAAA,QAClB,CAAC;AAED,eAAO;AAAA,MACT;AAAA,MAEA,aAAa,OAAO,YAAmC;AACrD,cAAM,cAAc,qBAAqB,OAAO;AAEhD,YAAI,CAAC,aAAa;AAChB,gBAAM,IAAI,MAAM,yBAAyB,OAAO,EAAE;AAAA,QACpD;AAEA,cAAM,cAAc,WAAW;AAAA,MACjC;AAAA,IACF;AAAA,IACA,CAAC,SAAS,OAAO,IAAI,aAAa;AAAA,EACpC;AACF;AAKO,SAAS,iBAAiB,SAAoC;AACnE,SAAO,qBAAqB,OAAO;AACrC;AAKO,SAAS,iBAAiB,SAA0B;AACzD,SAAO,WAAW;AACpB;","names":[]}
|
package/package.json
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@perkos/ui-payment-thirdweb",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Thirdweb wallet adapter for @perkos/ui-payment",
|
|
5
|
+
"main": "./dist/index.js",
|
|
6
|
+
"module": "./dist/index.mjs",
|
|
7
|
+
"types": "./dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"types": "./dist/index.d.ts",
|
|
11
|
+
"import": "./dist/index.mjs",
|
|
12
|
+
"require": "./dist/index.js"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": [
|
|
16
|
+
"dist"
|
|
17
|
+
],
|
|
18
|
+
"scripts": {
|
|
19
|
+
"build": "tsup",
|
|
20
|
+
"dev": "tsup --watch",
|
|
21
|
+
"lint": "tsc --noEmit",
|
|
22
|
+
"clean": "rm -rf dist",
|
|
23
|
+
"prepublishOnly": "npm run build"
|
|
24
|
+
},
|
|
25
|
+
"keywords": [
|
|
26
|
+
"x402",
|
|
27
|
+
"payment",
|
|
28
|
+
"thirdweb",
|
|
29
|
+
"wallet",
|
|
30
|
+
"react",
|
|
31
|
+
"perkos"
|
|
32
|
+
],
|
|
33
|
+
"author": "PerkOS",
|
|
34
|
+
"license": "MIT",
|
|
35
|
+
"repository": {
|
|
36
|
+
"type": "git",
|
|
37
|
+
"url": "https://github.com/PerkOS-xyz/pkg-ui-payment-thirdweb.git"
|
|
38
|
+
},
|
|
39
|
+
"peerDependencies": {
|
|
40
|
+
"@perkos/ui-payment": ">=1.0.0",
|
|
41
|
+
"react": ">=18.0.0",
|
|
42
|
+
"thirdweb": ">=5.0.0"
|
|
43
|
+
},
|
|
44
|
+
"devDependencies": {
|
|
45
|
+
"@perkos/ui-payment": "^1.0.0",
|
|
46
|
+
"@types/node": "^20.10.0",
|
|
47
|
+
"@types/react": "^18.2.0",
|
|
48
|
+
"react": "^18.2.0",
|
|
49
|
+
"thirdweb": "^5.0.0",
|
|
50
|
+
"tsup": "^8.0.1",
|
|
51
|
+
"typescript": "^5.3.3"
|
|
52
|
+
},
|
|
53
|
+
"engines": {
|
|
54
|
+
"node": ">=18.0.0"
|
|
55
|
+
}
|
|
56
|
+
}
|