Skip to content

Commit 2ba8d26

Browse files
goosewobblergoosewobbler
authored
Add frame connector (#1700)
1 parent 6053661 commit 2ba8d26

File tree

14 files changed

+347
-7
lines changed

14 files changed

+347
-7
lines changed

‎.circleci/config.yml‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -197,6 +197,12 @@ jobs:
197197
working_directory: ~/web3-onboard-monorepo/packages/injected
198198
steps:
199199
- node-build-steps
200+
build-frame:
201+
docker:
202+
- image: cimg/node:16.13.1
203+
working_directory: ~/web3-onboard-monorepo/packages/frame
204+
steps:
205+
- node-build-steps
200206
build-keepkey:
201207
docker:
202208
- image: cimg/node:16.13.1
@@ -421,6 +427,12 @@ jobs:
421427
working_directory: ~/web3-onboard-monorepo/packages/injected
422428
steps:
423429
- node-staging-build-steps
430+
build-staging-frame:
431+
docker:
432+
- image: cimg/node:16.13.1
433+
working_directory: ~/web3-onboard-monorepo/packages/frame
434+
steps:
435+
- node-staging-build-steps
424436
build-staging-keepkey:
425437
docker:
426438
- image: cimg/node:16.13.1
@@ -647,6 +659,12 @@ workflows:
647659
<<: *deploy_production_filters
648660
- build-staging-injected:
649661
<<: *deploy_staging_filters
662+
frame:
663+
jobs:
664+
- build-frame:
665+
<<: *deploy_production_filters
666+
- build-staging-frame:
667+
<<: *deploy_staging_filters
650668
keepkey:
651669
jobs:
652670
- build-keepkey:
@@ -839,4 +857,3 @@ workflows:
839857
<<: *deploy_production_filters
840858
- build-staging-cede-store:
841859
<<: *deploy_staging_filters
842-

‎README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,7 @@ For full documentation, check out the README.md for each package or the [docs pa
103103
- [Frontier](packages/frontier/README.md)
104104
- [XDEFI](packages/xdefi/README.md)
105105
- [Infinity Wallet](packages/infinity-wallet/README.md)
106+
- [Frame](packages/frame/README.md)
106107

107108
**Hardware Wallets**
108109

‎docs/src/lib/services/onboard.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ const intiOnboard = async (theme) => {
5151
const { default: uauthModule } = await import('@web3-onboard/uauth')
5252
const { default: trustModule } = await import('@web3-onboard/trust')
5353
const { default: xdefiModule } = await import('@web3-onboard/xdefi')
54+
const { default: frameModule } = await import('@web3-onboard/frame')
5455
const INFURA_ID = '8b60d52405694345a99bcb82e722e0af'
5556

5657
const injected = injectedModule()
@@ -76,6 +77,7 @@ const intiOnboard = async (theme) => {
7677
const torus = torusModule()
7778
const trust = trustModule()
7879
const xdefi = xdefiModule()
80+
const frame = frameModule()
7981
const cede = cedeModule()
8082

8183
const portis = portisModule({
@@ -132,6 +134,7 @@ const intiOnboard = async (theme) => {
132134
keystone,
133135
keepkey,
134136
portis,
137+
frame,
135138
infinityWallet
136139
],
137140
chains: [

‎docs/src/routes/docs/[...1]overview/[...1]introduction.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ Web3-Onboard is the quickest and easiest way to add multi-wallet and multi-chain
3535

3636
web3-onboard supports all EVM networks. Supporting a new network is simply a matter of adding its details in the Chains section upon initialization. For more information see [initialization options](../../docs/modules/core.md#options).
3737

38-
- Ethereum
38+
- Ethereum
3939
- Polygon
4040
- Base Goerli
4141
- Goerli
@@ -156,6 +156,7 @@ We recommend you add the [Core Repo](../../docs/modules/core.md#install) and con
156156
- [MEW](../../docs/wallets/mewwallet.md#install)
157157
- [Portis](../../docs/wallets/portis.md#install)
158158
- [Web3Auth](../../docs/wallets/web3auth.md#install)
159+
- [Frame](../../docs/wallets/frame.md#install)
159160

160161
**Hardware Wallets**
161162

‎docs/src/routes/docs/[...4]wallets/frame.md‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
# Frame
2+
3+
[Frame](https://frame.sh/) is a privacy focused EVM desktop wallet, enabling a secure system-wide interface to your chains and web3 accounts.
4+
5+
### Install
6+
7+
```sh copy
8+
yarn add @web3-onboard/core @web3-onboard/frame
9+
```
10+
11+
or
12+
13+
```sh copy
14+
npm install @web3-onboard/core @web3-onboard/frame
15+
```
16+
17+
## Usage
18+
19+
```typescript
20+
import Onboard from '@web3-onboard/core'
21+
import frameModule from '@web3-onboard/frame'
22+
23+
// initialize the module
24+
const frame = frameModule()
25+
26+
const onboard = Onboard({
27+
// ... other Onboard options
28+
wallets: [
29+
frame
30+
//... other wallets
31+
]
32+
})
33+
34+
const connectedWallets = await onboard.connectWallet()
35+
console.log(connectedWallets)
36+
```
37+
38+
### Filtering Platforms
39+
40+
You may decide that on certain platforms you do not want to display this wallet as a selectable option. To do that you can use the `filter` init option which is an array of platforms that you would like this wallet to **not** be displayed to the end user:
41+
42+
```typescript
43+
import Onboard from '@web3-onboard/core'
44+
import frameModule from '@web3-onboard/frame'
45+
46+
const frame = frameModule({ filter: ['iOS', 'Android'] })
47+
48+
const onboard = Onboard({
49+
// ... other Onboard options
50+
wallets: [
51+
frame
52+
//... other wallets
53+
]
54+
})
55+
56+
const connectedWallets = await onboard.connectWallet()
57+
console.log(connectedWallets)
58+
```
59+
60+
The following is a list of the platforms that can be filtered:
61+
62+
```typescript
63+
type Platform =
64+
| 'Windows Phone'
65+
| 'Windows'
66+
| 'macOS'
67+
| 'iOS'
68+
| 'Android'
69+
| 'Linux'
70+
| 'Chrome OS'
71+
| 'Android Browser'
72+
| 'Chrome'
73+
| 'Chromium'
74+
| 'Firefox'
75+
| 'Microsoft Edge'
76+
| 'Opera'
77+
| 'Safari'
78+
| 'desktop'
79+
| 'mobile'
80+
| 'tablet'
81+
```

‎packages/demo/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@
2727
"@web3-onboard/coinbase": "^2.2.3-alpha.2",
2828
"@web3-onboard/transaction-preview": "^2.0.7-alpha.2",
2929
"@web3-onboard/dcent": "^2.2.6-alpha.2",
30+
"@web3-onboard/frame": "2.21.2-alpha.1",
3031
"@web3-onboard/frontier": "^2.0.3-alpha.2",
3132
"@web3-onboard/fortmatic": "^2.0.18-alpha.2",
3233
"@web3-onboard/gas": "^2.1.7-alpha.2",

‎packages/demo/src/App.svelte‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<script>
22
import Onboard from '@web3-onboard/core'
33
import fortmaticModule from '@web3-onboard/fortmatic'
4+
import frameModule from '@web3-onboard/frame'
45
import gnosisModule from '@web3-onboard/gnosis'
56
import infinityWalletModule from '@web3-onboard/infinity-wallet'
67
import injectedModule, { ProviderLabel } from '@web3-onboard/injected-wallets'
@@ -170,6 +171,7 @@
170171
})
171172
172173
const dcent = dcentModule()
174+
const frameWallet = frameModule()
173175
const sequence = sequenceModule()
174176
const enkrypt = enkryptModule()
175177
const mewWallet = mewWalletModule()
@@ -180,6 +182,7 @@
180182
const onboard = Onboard({
181183
wallets: [
182184
injected,
185+
frameWallet,
183186
ledger,
184187
trezor,
185188
walletConnect,

‎packages/frame/README.md‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
# @web3-onboard/frame
2+
3+
## Wallet module for connecting Frame to web3-onboard
4+
5+
[Frame](https://frame.sh/) is a privacy focused EVM desktop wallet, enabling a secure system-wide interface to your chains and web3 accounts.
6+
7+
### Install
8+
9+
`npm i @web3-onboard/core @web3-onboard/frame`
10+
11+
### Usage
12+
13+
```typescript
14+
import Onboard from '@web3-onboard/core'
15+
import frameModule from '@web3-onboard/frame'
16+
17+
const frame = frameModule()
18+
19+
const onboard = Onboard({
20+
// ... other Onboard options
21+
wallets: [
22+
frame
23+
//... other wallets
24+
]
25+
})
26+
27+
const connectedWallets = await onboard.connectWallet()
28+
console.log(connectedWallets)
29+
```
30+
31+
### Filtering Platforms
32+
33+
You may decide that on certain platforms you do not want to display this wallet as a selectable option. To do that you can use the `filter` init option which is an array of platforms that you would like this wallet to **not** be displayed to the end user:
34+
35+
```typescript
36+
import Onboard from '@web3-onboard/core'
37+
import frameModule from '@web3-onboard/frame'
38+
39+
const frame = frameModule({ filter: ['iOS', 'Android'] })
40+
41+
const onboard = Onboard({
42+
// ... other Onboard options
43+
wallets: [
44+
frame
45+
//... other wallets
46+
]
47+
})
48+
49+
const connectedWallets = await onboard.connectWallet()
50+
console.log(connectedWallets)
51+
```
52+
53+
The following is a list of the platforms that can be filtered:
54+
55+
```typescript
56+
type Platform =
57+
| 'Windows Phone'
58+
| 'Windows'
59+
| 'macOS'
60+
| 'iOS'
61+
| 'Android'
62+
| 'Linux'
63+
| 'Chrome OS'
64+
| 'Android Browser'
65+
| 'Chrome'
66+
| 'Chromium'
67+
| 'Firefox'
68+
| 'Microsoft Edge'
69+
| 'Opera'
70+
| 'Safari'
71+
| 'desktop'
72+
| 'mobile'
73+
| 'tablet'
74+
```

‎packages/frame/package.json‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
{
2+
"name": "@web3-onboard/frame",
3+
"version": "2.21.2-alpha.1",
4+
"description": "Frame wallet module for connecting 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.",
5+
"keywords": [
6+
"Ethereum",
7+
"Web3",
8+
"EVM",
9+
"Frame",
10+
"dapp",
11+
"Multichain",
12+
"Wallet",
13+
"Transaction",
14+
"Provider",
15+
"Hardware Wallet",
16+
"Notifications",
17+
"React",
18+
"Svelte",
19+
"Vue",
20+
"Next",
21+
"Nuxt",
22+
"MetaMask",
23+
"Coinbase",
24+
"WalletConnect",
25+
"Ledger",
26+
"Trezor",
27+
"Connect Wallet",
28+
"Ethereum Hooks",
29+
"Blocknative",
30+
"Mempool",
31+
"pending",
32+
"confirmed",
33+
"Injected Wallet",
34+
"Crypto",
35+
"Crypto Wallet"
36+
],
37+
"repository": {
38+
"type": "git",
39+
"url": "https://github.com/blocknative/web3-onboard.git",
40+
"directory": "packages/frame"
41+
},
42+
"homepage": "https://onboard.blocknative.com",
43+
"bugs": "https://github.com/blocknative/web3-onboard/issues",
44+
"module": "dist/index.js",
45+
"browser": "dist/index.js",
46+
"main": "dist/index.js",
47+
"type": "module",
48+
"typings": "dist/index.d.ts",
49+
"files": [
50+
"dist"
51+
],
52+
"scripts": {
53+
"build": "tsc",
54+
"dev": "tsc -w",
55+
"type-check": "tsc --noEmit"
56+
},
57+
"license": "MIT",
58+
"devDependencies": {
59+
"typescript": "^4.5.5"
60+
},
61+
"dependencies": {
62+
"@web3-onboard/common": "^2.3.1",
63+
"eth-provider": "^0.13.6"
64+
}
65+
}

‎packages/frame/src/icon.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export default `
2+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 153.4 152.9" color="#00d2be">
3+
<path fill="currentColor" d="M145.1,75.6v-58c0-5.1-4.2-9.3-9.3-9.3h0H77.7c-0.6,0-1.1-0.2-1.6-0.6l-7-7c-0.4-0.4-1-0.7-1.6-0.7H9.3 C4.2,0,0,4.1,0,9.3c0,0,0,0,0,0l0,0v58c0,0.6,0.2,1.1,0.6,1.6l7,7c0.4,0.4,0.7,1,0.7,1.6v58c0,5.1,4.2,9.3,9.3,9.3c0,0,0,0,0,0h58.2 c0.6,0,1.1,0.2,1.6,0.6l7,7c0.4,0.4,1,0.6,1.6,0.6h58.2c5.1,0,9.3-4.1,9.3-9.3c0,0,0,0,0,0l0,0v-58c0-0.6-0.2-1.1-0.6-1.6l-7-7 C145.4,76.7,145.1,76.2,145.1,75.6z M105.6,106.6H47.9c-0.7,0-1.3-0.6-1.3-1.3V47.7c0-0.7,0.6-1.3,1.3-1.3h57.7 c0.7,0,1.3,0.6,1.3,1.3v57.6C107,106,106.4,106.6,105.6,106.6z" />
4+
</svg>`

0 commit comments

Comments
 (0)