diff --git a/docs/onboarding/12 Wallet/0 Overview.mdx b/docs/onboarding/12 Wallet/0 Overview.mdx index dad3c98c9..03e8cf447 100644 --- a/docs/onboarding/12 Wallet/0 Overview.mdx +++ b/docs/onboarding/12 Wallet/0 Overview.mdx @@ -161,37 +161,30 @@ The Wallet SDK comes out of the box with support for the most popular wallets th description="Connect with OKX Wallet" /> - -{" "} -
- -
- -{" "} -
- -
- -{" "} -
- -
- +
+ +
+
+ +
+
+ +
+
+ +

diff --git a/docs/onboarding/12 Wallet/4 Wallets/OneKey Wallet.mdx b/docs/onboarding/12 Wallet/4 Wallets/OneKey Wallet.mdx new file mode 100644 index 000000000..08bd93945 --- /dev/null +++ b/docs/onboarding/12 Wallet/4 Wallets/OneKey Wallet.mdx @@ -0,0 +1,68 @@ +--- +slug: /wallet/onekey-wallet +title: OneKey Wallet +--- + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; +import CodeBlock from "@theme/CodeBlock"; + +Prompt users to connect to their [OneKey wallet](https://onekey.so). + +## Usage + +```javascript +import { OneKeyWallet } from "@thirdweb-dev/wallets"; + +const wallet = new OneKeyWallet(); + +wallet.connect(); +``` + +## Configuration + +Optionally, provide a configuration object when instantiating the `OneKeyWallet` class. + +
+ projectId (recommended) +
+ +This is only relevant if you want to use [WalletConnect](https://walletconnect.com/) for connecting to OneKey wallet mobile app when MetaMask is not injected. + +This `projectId` can be obtained at [cloud.walletconnect.com](https://cloud.walletconnect.com/). It is highly recommended to use your own project id and only use the default one for testing purposes. + +```javascript +import { OneKeyWallet } from "@thirdweb-dev/wallets"; + +const wallet = new OneKeyWallet( + // highlight-start + { + projectId: "YOUR_WALLET_CONNECT_PROJECT_ID", + }, + // highlight-end +); +``` + +
+
+ +
+ recommended (optional) +
+ +Show this wallet as "recommended" in the [ConnectWallet Modal](/react/react.connectwallet). + +```ts +OneKeyWallet({ + // highlight-start + recommended: true, + // highlight-end +}); +``` + +
+
+ +## Methods + +Inherits all the public methods from the [`AbstractClientWallet`](interfaces/abstract-client-wallet) class. \ No newline at end of file diff --git a/docs/onboarding/20 Connect/3 Connect Wallet Component/3 Supported Wallets.mdx b/docs/onboarding/20 Connect/3 Connect Wallet Component/3 Supported Wallets.mdx index 86ac3be70..5e39a7420 100644 --- a/docs/onboarding/20 Connect/3 Connect Wallet Component/3 Supported Wallets.mdx +++ b/docs/onboarding/20 Connect/3 Connect Wallet Component/3 Supported Wallets.mdx @@ -167,6 +167,14 @@ The following wallets are supported by the SDKs: description="Connect with Defi Wallet" /> +
+ +
diff --git a/docs/react/Connecting Wallets.mdx b/docs/react/Connecting Wallets.mdx index 2538f6e39..0a7b851cf 100644 --- a/docs/react/Connecting Wallets.mdx +++ b/docs/react/Connecting Wallets.mdx @@ -37,6 +37,7 @@ There are two ways you connect user's wallet to your application using thirdweb' | Coin98 Wallet | [`coin98Wallet`](/react/react.coin98) | | Rabby Wallet | [`rabbyWallet`](/react/react.rabby) | | Defi Wallet | [`cryptoDefiWallet`](/react/react.defiwallet) | +| OneKey Wallet | [`oneKeyWallet`](/react/react.onekey) |
diff --git a/docs/react/wallets/oneKeyWallet.mdx b/docs/react/wallets/oneKeyWallet.mdx new file mode 100644 index 000000000..a0a1aa90c --- /dev/null +++ b/docs/react/wallets/oneKeyWallet.mdx @@ -0,0 +1,91 @@ +--- +title: oneKeyWallet +slug: /react.onekey +displayed_sidebar: react +--- + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; +import CodeBlock from "@theme/CodeBlock"; +import { CustomizeWalletConfigurator } from "@components/build-wallet/CustomizeWalletConfigurator"; + +A wallet configurator for [OneKey Wallet](/wallet/onekey-wallet) which allows integrating the wallet with React. + +```tsx +import { oneKeyWallet } from "@thirdweb-dev/react"; + +const oneKeyWalletConfig = oneKeyWallet(options); +``` + +## options + +
+ projectId (recommended) +
+ +Your project's unique identifier that can be obtained at [cloud.walletconnect.com](https://cloud.walletconnect.com). + +Defaults to a common thirdweb projectId. We recommend getting your own projectId at +[cloud.walletconnect.com](https://cloud.walletconnect.com) when launching your project. + +```javascript +import { oneKeyWallet } from "@thirdweb-dev/react"; + +oneKeyWallet( + // highlight-start + { + projectId: "", + }, + // highlight-end +); +``` + +
+
+ +
+ recommended (optional) +
+ +Show this wallet as "recommended" in the [ConnectWallet Modal](/react/react.connectwallet). + +```ts +oneKeyWallet({ + // highlight-start + recommended: true, + // highlight-end +}); +``` + +
+
+ +## Usage with `ConnectWallet` + +To allow users to connect to this wallet using the [ConnectWallet](/react/react.connectwallet) component, you can add it to [ThirdwebProvider's supportedWallets](/react/react.thirdwebprovider#supportedwallets-optional) prop. + +```tsx + + + +``` + +## Usage with `useConnect` + +you can use the `useConnect` hook to programmatically connect to the wallet without using the [ConnectWallet](/react/react.connectwallet) component. + +The wallet also needs to be added in [ThirdwebProvider's supportedWallets](/react/react.thirdwebprovider#supportedwallets-optional) if you want the wallet to auto-connect on next page load. + +```tsx +const oneKeyWalletConfig = oneKeyWallet(); + +function App() { + const connect = useConnect(); + + const handleConnect = async () => { + await connect(oneKeyWalletConfig, connectOptions); + }; + + return
...
; +} +``` \ No newline at end of file diff --git a/static/assets/wallets/onekey.png b/static/assets/wallets/onekey.png new file mode 100644 index 000000000..009bda537 Binary files /dev/null and b/static/assets/wallets/onekey.png differ