Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add keplr wallet #2255

Merged
merged 6 commits into from
Aug 14, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 50 additions & 0 deletions docs/src/routes/docs/[...4]wallets/[...38]keplr/+page.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
---
title: Keplr Wallet
---

# {$frontmatter.title}

## Wallet module for connecting Keplr Wallet through Web3 Onboard

### Install

<Tabs values={['yarn', 'npm']}>
<TabPanel value="yarn">

```sh copy
yarn add @web3-onboard/keplr
```

</TabPanel>
<TabPanel value="npm">

```sh copy
npm install @web3-onboard/keplr
```

</TabPanel>
</Tabs>

## Usage

```typescript
import Onboard from '@web3-onboard/core'
import KeplrWallet from '@web3-onboard/keplr'

const keplr = KeplrWallet()

const onboard = Onboard({
// ... other Onboard options
wallets: [
keplr
//... other wallets
]
})

const connectedWallets = await onboard.connectWallet()
console.log(connectedWallets)
```

## Build Environments

For build env configurations and setups please see the Build Env section [here](/docs/modules/core#build-environments)
3 changes: 2 additions & 1 deletion packages/demo/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -44,8 +44,9 @@
"@web3-onboard/gas": "^2.2.1",
"@web3-onboard/gnosis": "^2.3.1",
"@web3-onboard/infinity-wallet": "^2.1.1",
"@web3-onboard/injected-wallets": "^2.11.1",
"@web3-onboard/injected-wallets": "^2.11.2-alpha.2",
"@web3-onboard/keepkey": "^2.3.8",
"@web3-onboard/keplr": "2.0.0-alpha.1",
"@web3-onboard/keystone": "^2.3.8",
"@web3-onboard/ledger": "^2.7.1",
"@web3-onboard/magic": "^2.2.1",
Expand Down
5 changes: 4 additions & 1 deletion packages/demo/src/App.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
import bitgetModule from '@web3-onboard/bitget'
import bloomModule from '@web3-onboard/bloom'
import particleAuthModule from '@web3-onboard/particle-network'
import keplrModule from '@web3-onboard/keplr'
import capsuleModule, {
Environment,
OAuthMethod
Expand Down Expand Up @@ -257,6 +258,7 @@
clientKey: 'cSTLqhvONB5j588Wz6E5WJLMPrHeUlGbymf1DFhO',
appId: 'b1f0239a-edb0-41f9-b0f5-ab780bb02a9e'
})
const keplr = keplrModule()

const dcent = dcentModule()
const bitget = bitgetModule()
Expand Down Expand Up @@ -322,7 +324,8 @@
blocto,
venly,
particle,
passport
passport,
keplr
],
transactionPreview,
gas,
Expand Down
2 changes: 1 addition & 1 deletion packages/injected/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@web3-onboard/injected-wallets",
"version": "2.11.2-alpha.1",
"version": "2.11.2-alpha.2",
"description": "Injected wallet module for connecting browser extension and mobile wallets to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
"keywords": [
"Ethereum",
Expand Down
33 changes: 33 additions & 0 deletions packages/injected/src/icons/keplr.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
export default `
<svg width="42" height="42" viewBox="0 0 42 42" fill="none"
xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_425_5107)">
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint0_linear_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint1_radial_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint2_radial_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint3_radial_425_5107)"/>
<path d="M17.2526 32.2614V22.5192L26.7185 32.2614H31.9849V32.0079L21.0964 20.9122L31.1469 10.3857V10.2614H25.8464L17.2526 19.5635V10.2614H12.9849V32.2614H17.2526Z" fill="white"/>
</g>
<defs>
<linearGradient id="paint0_linear_425_5107" x1="21" y1="0" x2="21" y2="42" gradientUnits="userSpaceOnUse">
<stop stop-color="#1FD1FF"/>
<stop offset="1" stop-color="#1BB8FF"/>
</linearGradient>
<radialGradient id="paint1_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(2.00623 40.4086) rotate(-45.1556) scale(67.3547 68.3624)">
<stop stop-color="#232DE3"/>
<stop offset="1" stop-color="#232DE3" stop-opacity="0"/>
</radialGradient>
<radialGradient id="paint2_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(39.7379 41.7602) rotate(-138.45) scale(42.1137 64.2116)">
<stop stop-color="#8B4DFF"/>
<stop offset="1" stop-color="#8B4DFF" stop-opacity="0"/>
</radialGradient>
<radialGradient id="paint3_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(20.6501 0.311498) rotate(90) scale(33.1135 80.3423)">
<stop stop-color="#24D5FF"/>
<stop offset="1" stop-color="#1BB8FF" stop-opacity="0"/>
</radialGradient>
<clipPath id="clip0_425_5107">
<rect width="42" height="42" fill="white"/>
</clipPath>
</defs>
</svg>
`
11 changes: 7 additions & 4 deletions packages/injected/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,8 @@ export enum ProviderIdentityFlag {
Lif3Wallet = 'isLif3Wallet',
ZodiacPilot = 'isZodiacPilot',
StableWallet = 'isStableWallet',
Echooo = 'isEchooo'
Echooo = 'isEchooo',
Keplr = 'keplr'
}

/**
Expand Down Expand Up @@ -101,7 +102,8 @@ export enum ProviderExternalUrl {
Lif3Wallet = 'https://lif3.com',
Rabby = 'https://rabby.io',
ZodiacPilot = 'https://pilot.gnosisguild.org/',
Echooo = 'https://www.echooo.xyz'
Echooo = 'https://www.echooo.xyz',
Keplr = 'https://www.keplr.app/download'
}

export enum ProviderLabel {
Expand Down Expand Up @@ -164,7 +166,8 @@ export enum ProviderLabel {
Lif3Wallet = 'Lif3 Wallet',
ZodiacPilot = 'Zodiac Pilot',
StableWallet = 'StableWallet',
Echooo = 'Echooo'
Echooo = 'Echooo',
Keplr = 'Keplr'
}

export interface MeetOneProvider extends ExternalProvider {
Expand Down Expand Up @@ -291,7 +294,7 @@ export interface InjectedWalletOptions {
walletUnavailableMessage?: (wallet: WalletModule) => string
/**Function that can be used to sort the order of wallets that are displayed */
sort?: (wallets: WalletModule[]) => WalletModule[]
/** A boolean that can be passed to disable supporting 6963 (https://eips.ethereum.org/EIPS/eip-6963)
/** A boolean that can be passed to disable supporting 6963 (https://eips.ethereum.org/EIPS/eip-6963)
* which will display wallets available on the browser
*/
disable6963Support?: boolean
Expand Down
14 changes: 13 additions & 1 deletion packages/injected/src/wallets.ts
Original file line number Diff line number Diff line change
Expand Up @@ -920,6 +920,17 @@ const echooo: InjectedWalletModule = {
externalUrl: ProviderExternalUrl.Echooo
}

const keplr: InjectedWalletModule = {
label: ProviderLabel.Keplr,
injectedNamespace: InjectedNameSpace.Ethereum,
checkProviderIdentity: ({ provider }) =>
!!provider && !!provider[ProviderIdentityFlag.Keplr],
getIcon: async () => (await import('./icons/keplr.js')).default,
getInterface: getInjectedInterface(ProviderIdentityFlag.Keplr),
platforms: ['all'],
externalUrl: ProviderExternalUrl.Keplr
}

const wallets = [
zeal,
exodus,
Expand Down Expand Up @@ -978,7 +989,8 @@ const wallets = [
Lif3Wallet,
zodiacPilot,
stablewallet,
echooo
echooo,
keplr
]

export default wallets
33 changes: 33 additions & 0 deletions packages/keplr/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
# @web3-onboard/keplr

## Wallet module for connecting keplr Wallet through web3-onboard

Keplr Wallet SDK wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.

### Install

**NPM**
`npm i @web3-onboard/core @web3-onboard/keplr`

**Yarn**
`yarn add @web3-onboard/core @web3-onboard/keplr`

## Usage

```typescript
import Onboard from '@web3-onboard/core'
import keplrModule from '@web3-onboard/keplr'

const keplr = keplrModule()

const onboard = Onboard({
// ... other Onboard options
wallets: [
keplr
//... other wallets
]
})

const connectedWallets = await onboard.connectWallet()
console.log(connectedWallets)
```
66 changes: 66 additions & 0 deletions packages/keplr/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
{
"name": "@web3-onboard/keplr",
"version": "2.0.0-alpha.1",
"description": "Keplr Wallet SDK wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
"keywords": [
"Ethereum",
"Web3",
"EVM",
"dapp",
"Multichain",
"Wallet",
"Transaction",
"Provider",
"Hardware Wallet",
"Notifications",
"React",
"Svelte",
"Vue",
"Next",
"Nuxt",
"MetaMask",
"Coinbase",
"WalletConnect",
"Ledger",
"Trezor",
"Connect Wallet",
"Ethereum Hooks",
"Blocknative",
"Mempool",
"pending",
"confirmed",
"Injected Wallet",
"Crypto",
"Crypto Wallet",
"Enkrypt",
"Keplr"
],
"repository": {
"type": "git",
"url": "https://github.com/blocknative/web3-onboard.git",
"directory": "packages/keplr"
},
"homepage": "https://www.blocknative.com/onboard",
"bugs": "https://github.com/blocknative/web3-onboard/issues",
"module": "dist/index.js",
"browser": "dist/index.js",
"main": "dist/index.js",
"type": "module",
"typings": "dist/index.d.ts",
"files": [
"dist"
],
"scripts": {
"build": "tsc",
"dev": "tsc -w",
"type-check": "tsc --noEmit"
},
"license": "MIT",
"devDependencies": {
"@types/node": "^17.0.21",
"typescript": "^5.4.5"
},
"dependencies": {
"@web3-onboard/common": "^2.4.1"
}
}
33 changes: 33 additions & 0 deletions packages/keplr/src/icon.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
export default `
<svg width="42" height="42" viewBox="0 0 42 42" fill="none"
xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_425_5107)">
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint0_linear_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint1_radial_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint2_radial_425_5107)"/>
<path d="M32.4545 0H9.54545C4.27365 0 0 4.27365 0 9.54545V32.4545C0 37.7264 4.27365 42 9.54545 42H32.4545C37.7264 42 42 37.7264 42 32.4545V9.54545C42 4.27365 37.7264 0 32.4545 0Z" fill="url(#paint3_radial_425_5107)"/>
<path d="M17.2526 32.2614V22.5192L26.7185 32.2614H31.9849V32.0079L21.0964 20.9122L31.1469 10.3857V10.2614H25.8464L17.2526 19.5635V10.2614H12.9849V32.2614H17.2526Z" fill="white"/>
</g>
<defs>
<linearGradient id="paint0_linear_425_5107" x1="21" y1="0" x2="21" y2="42" gradientUnits="userSpaceOnUse">
<stop stop-color="#1FD1FF"/>
<stop offset="1" stop-color="#1BB8FF"/>
</linearGradient>
<radialGradient id="paint1_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(2.00623 40.4086) rotate(-45.1556) scale(67.3547 68.3624)">
<stop stop-color="#232DE3"/>
<stop offset="1" stop-color="#232DE3" stop-opacity="0"/>
</radialGradient>
<radialGradient id="paint2_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(39.7379 41.7602) rotate(-138.45) scale(42.1137 64.2116)">
<stop stop-color="#8B4DFF"/>
<stop offset="1" stop-color="#8B4DFF" stop-opacity="0"/>
</radialGradient>
<radialGradient id="paint3_radial_425_5107" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(20.6501 0.311498) rotate(90) scale(33.1135 80.3423)">
<stop stop-color="#24D5FF"/>
<stop offset="1" stop-color="#1BB8FF" stop-opacity="0"/>
</radialGradient>
<clipPath id="clip0_425_5107">
<rect width="42" height="42" fill="white"/>
</clipPath>
</defs>
</svg>
`
38 changes: 38 additions & 0 deletions packages/keplr/src/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import {
type WalletInit,
type EIP1193Provider,
createDownloadMessage
} from '@web3-onboard/common'
import { createEIP1193Provider } from '@web3-onboard/common'

import { CustomWindow } from './types.js'

declare const window: CustomWindow

function keplr(): WalletInit {
if (typeof window === 'undefined') return () => null

return () => {
return {
label: 'Keplr Wallet',
getIcon: async () => (await import('./icon.js')).default,
getInterface: async () => {
const keplrwalletInjectionExists = window.hasOwnProperty('keplr')

let provider: EIP1193Provider

if (keplrwalletInjectionExists) {
provider = createEIP1193Provider(window['keplr'])
} else {
const downloadUrl = 'https://www.keplr.app/download'
throw new Error(createDownloadMessage('keplr Wallet', downloadUrl))
}
return {
provider
}
}
}
}
}

export default keplr
5 changes: 5 additions & 0 deletions packages/keplr/src/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import type { EIP1193Provider } from '@web3-onboard/common'

export interface CustomWindow extends Window {
keplr?: EIP1193Provider
}
15 changes: 15 additions & 0 deletions packages/keplr/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{
"extends": "../../tsconfig.json",
"include": ["src/**/*"],

"compilerOptions": {
"outDir": "dist",
"rootDir": "src",
"declaration": true,
"declarationDir": "dist",
"paths": {
"*": ["./src/*", "./node_modules/*"]
},
"typeRoots": ["node_modules/@types"]
}
}
Loading
Loading