Skip to content

Commit 8f4e1bd

Browse files
taylorjdawsontaylorjdawson
authored
Merge pull request #534 from blocknative/release/1.24.0
Release: 1.24.0
2 parents 04c7799 + 4fe575c commit 8f4e1bd

22 files changed

+306
-1074
lines changed

‎.circleci/config.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ jobs:
1010
- v1-dependencies-{{ checksum "package.json" }}
1111
- v1-dependencies-
1212
- run: yarn
13+
- run: yarn lint
1314
- run: yarn test
1415
- run: yarn build
1516
- save_cache:

‎.prettierrc.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,6 @@ module.exports = {
55
printWidth: 80,
66
tabWidth: 2,
77
arrowParens: 'avoid',
8-
svelteSortOrder: 'scripts-styles-markup'
8+
svelteSortOrder: 'options-scripts-styles-markup',
9+
plugins: ['prettier-plugin-svelte']
910
}

‎package.json

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "bnc-onboard",
3-
"version": "1.23.0",
3+
"version": "1.24.0",
44
"description": "Onboard users to web3 by allowing them to select a wallet, get that wallet ready to transact and have access to synced wallet state.",
55
"keywords": [
66
"ethereum",
@@ -20,6 +20,14 @@
2020
"url": "https://github.com/blocknative/onboard"
2121
},
2222
"license": "MIT",
23+
"scripts": {
24+
"build": "rimraf dist && rollup -c && babel dist/cjs --out-dir dist/cjs && babel dist/esm --out-dir dist/esm",
25+
"test": "echo \"TBD\" && exit 0",
26+
"prepare": "npm run build",
27+
"lint": "eslint 'src/**/*.ts' && prettier --check {'src/**/*.ts','src/**/*.svelte'}",
28+
"lint:fix": "eslint 'src/**/*.ts' --fix",
29+
"format": "prettier --write {'src/**/*.ts','src/**/*.svelte'}"
30+
},
2331
"devDependencies": {
2432
"@babel/cli": "^7.7.0",
2533
"@babel/core": "^7.5.5",
@@ -48,7 +56,7 @@
4856
"@cvbb/eth-keyring": "^1.1.0",
4957
"@ledgerhq/hw-app-eth": "^5.21.0",
5058
"@ledgerhq/hw-transport-u2f": "^5.21.0",
51-
"@portis/web3": "^2.0.0-beta.57",
59+
"@portis/web3": "^4.0.0",
5260
"@toruslabs/torus-embed": "^1.9.2",
5361
"@walletconnect/web3-provider": "^1.4.1",
5462
"authereum": "^0.1.12",
@@ -61,14 +69,10 @@
6169
"ethereumjs-util": "^7.0.3",
6270
"fortmatic": "^2.2.1",
6371
"hdkey": "^2.0.1",
72+
"prettier-plugin-svelte": "^2.2.0",
6473
"regenerator-runtime": "^0.13.7",
6574
"trezor-connect": "^8.1.9",
6675
"walletlink": "^2.0.2",
6776
"web3-provider-engine": "^15.0.4"
68-
},
69-
"scripts": {
70-
"build": "rimraf dist && rollup -c && babel dist/cjs --out-dir dist/cjs && babel dist/esm --out-dir dist/esm",
71-
"test": "echo \"TBD\" && exit 0",
72-
"prepare": "npm run build"
7377
}
7478
}

‎src/components/Modal.svelte

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -87,12 +87,14 @@
8787
<aside
8888
transition:fade
8989
class="bn-onboard-custom bn-onboard-modal"
90-
on:click={closeModal}>
90+
on:click={closeModal}
91+
>
9192
<section
9293
class:bn-onboard-dark-mode={$app.darkMode}
9394
class:no-padding-branding={$app.displayBranding}
9495
class="bn-onboard-custom bn-onboard-modal-content"
95-
on:click={e => e.stopPropagation()}>
96+
on:click={e => e.stopPropagation()}
97+
>
9698
<slot />
9799
{#if $app.displayBranding}
98100
<Branding darkMode={$app.darkMode} />
@@ -103,7 +105,8 @@
103105
class:bn-onboard-dark-mode-close-background={$app.darkMode}
104106
on:click={closeModal}
105107
on:mouseenter={() => (closeHovered = true)}
106-
on:mouseleave={() => (closeHovered = false)}>
108+
on:mouseleave={() => (closeHovered = false)}
109+
>
107110
<svg
108111
xmlns="http://www.w3.org/2000/svg"
109112
xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -112,14 +115,20 @@
112115
viewBox="0 0 47.971 47.971"
113116
style="enable-background:new 0 0 47.971 47.971; transition: fill 150ms
114117
ease-in-out;"
115-
fill={closeHovered ? ($app.darkMode ? '#ffffff' : '#4a4a4a') : '#9B9B9B'}
116-
xml:space="preserve">
118+
fill={closeHovered
119+
? $app.darkMode
120+
? '#ffffff'
121+
: '#4a4a4a'
122+
: '#9B9B9B'}
123+
xml:space="preserve"
124+
>
117125
<g>
118126
<path
119127
d="M28.228,23.986L47.092,5.122c1.172-1.171,1.172-3.071,0-4.242c-1.172-1.172-3.07-1.172-4.242,0L23.986,19.744L5.121,0.88
120128
c-1.172-1.172-3.07-1.172-4.242,0c-1.172,1.171-1.172,3.071,0,4.242l18.865,18.864L0.879,42.85c-1.172,1.171-1.172,3.071,0,4.242
121129
C1.465,47.677,2.233,47.97,3,47.97s1.535-0.293,2.121-0.879l18.865-18.864L42.85,47.091c0.586,0.586,1.354,0.879,2.121,0.879
122-
s1.535-0.293,2.121-0.879c1.172-1.171,1.172-3.071,0-4.242L28.228,23.986z" />
130+
s1.535-0.293,2.121-0.879c1.172-1.171,1.172-3.071,0-4.242L28.228,23.986z"
131+
/>
123132
</g>
124133
<g />
125134
<g />

‎src/components/ModalHeader.svelte

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,8 @@
3838
<header class="bn-onboard-custom bn-onboard-modal-content-header">
3939
<div
4040
class:bn-onboard-dark-mode-background={$app.darkMode}
41-
class="bn-onboard-custom bn-onboard-modal-content-header-icon">
41+
class="bn-onboard-custom bn-onboard-modal-content-header-icon"
42+
>
4243
{@html icon}
4344
</div>
4445
<h3 class="bn-onboard-custom bn-onboard-modal-content-header-heading">

‎src/components/Wallets.svelte

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313
export let loadingWallet: string | undefined
1414
export let showingAllWalletModules: boolean = false
1515
export let showAllWallets: () => void
16+
export let walletsDisabled: boolean = false
17+
1618
let selectedWallet: WritableStore
1719
1820
const unsubscribe = wallet.subscribe(wallet => (selectedWallet = wallet))
@@ -68,33 +70,39 @@
6870
{#each modalData.primaryWallets as wallet, i (wallet.name)}
6971
<li>
7072
<IconButton
73+
disabled={walletsDisabled}
7174
onclick={() => handleWalletSelect(wallet)}
7275
iconSrc={wallet.iconSrc}
7376
iconSrcSet={wallet.iconSrcSet}
7477
svg={wallet.svg}
7578
text={wallet.name}
7679
currentlySelected={wallet.name === selectedWallet.name}
77-
{loadingWallet} />
80+
{loadingWallet}
81+
/>
7882
</li>
7983
{/each}
8084

8185
{#if modalData.secondaryWallets && modalData.secondaryWallets.length && !showingAllWalletModules}
8286
<div>
83-
<Button onclick={showAllWallets}>Show More</Button>
87+
<Button disabled={walletsDisabled} onclick={showAllWallets}
88+
>Show More</Button
89+
>
8490
</div>
8591
{/if}
8692

8793
{#if showingAllWalletModules}
8894
{#each modalData.secondaryWallets as wallet, i (wallet.name)}
8995
<li>
9096
<IconButton
97+
disabled={walletsDisabled}
9198
onclick={() => handleWalletSelect(wallet)}
9299
iconSrc={wallet.iconSrc}
93100
iconSrcSet={wallet.iconSrcSet}
94101
svg={wallet.svg}
95102
text={wallet.name}
96103
currentlySelected={wallet.name === selectedWallet.name}
97-
{loadingWallet} />
104+
{loadingWallet}
105+
/>
98106
</li>
99107
{/each}
100108
{/if}

‎src/constants.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { StorageKeys } from './interfaces'
2+
3+
export const STORAGE_KEYS: StorageKeys = {
4+
TERMS_AGREEMENT: 'onboard.js:agreement'
5+
}

‎src/elements/Branding.svelte

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -42,18 +42,21 @@
4242
href="https://hubs.ly/H0qh2g10"
4343
class="bn-onboard-clickable"
4444
target="_blank"
45-
rel="noopener noreferrer">
45+
rel="noopener noreferrer"
46+
>
4647
<span>Blocknative</span>
4748
<div class="bn-logo">
4849
{#if darkMode}
4950
<svg
5051
height="130"
5152
viewBox="0 0 91 130"
5253
width="91"
53-
xmlns="http://www.w3.org/2000/svg">
54+
xmlns="http://www.w3.org/2000/svg"
55+
>
5456
<g
5557
style="stroke:#fff;stroke-width:2.70793;fill:none;fill-rule:evenodd;stroke-linecap:round;stroke-linejoin:round"
56-
transform="translate(1.818182 .909091)">
58+
transform="translate(1.818182 .909091)"
59+
>
5760
<path
5861
d="m1.35473654 25.2695268
5962
41.68515786-24.21771792c.5647044-.32807482 1.2619836-.32807795
@@ -63,25 +66,29 @@
6366
12.1113348c.5601525.3254236.9048434.9243111.9048434
6467
1.5721317v48.4560123c0 .647825-.3446953 1.246715-.9048537
6568
1.572138l-41.6835092
66-
24.215895c-.5655731.328567-1.2640448.328023-1.8291052-.001426l-41.5311197-24.21401c-.5587764-.325785-.90240476-.923899-.90240476-1.570712v-49.505258-24.5082917c0-.6478147.34468473-1.2466978.9048293-1.5721235z" />
69+
24.215895c-.5655731.328567-1.2640448.328023-1.8291052-.001426l-41.5311197-24.21401c-.5587764-.325785-.90240476-.923899-.90240476-1.570712v-49.505258-24.5082917c0-.6478147.34468473-1.2466978.9048293-1.5721235z"
70+
/>
6771
<path
6872
d="m22.0428451 114.442824v-25.2731141l-21.59284788-12.5449388
6973
42.75014288 24.6551909c.5648507.325765 1.260898.324109
7074
1.8241926-.004339l42.2766571-24.6508519-21.5955473
7175
12.6370084v-24.2248276c0-.6488012-.3457266-1.2484405-.9072187-1.5735092l-20.9222804-12.1126883
7276
21.6729314-12.6370084-42.4525958
73-
24.4763352c-.5545159.3197099-1.236865.3218902-1.7934127.0057303l-20.85286908-11.8459598" />
77+
24.4763352c-.5545159.3197099-1.236865.3218902-1.7934127.0057303l-20.85286908-11.8459598"
78+
/>
7479
</g>
7580
</svg>
7681
{:else}
7782
<svg
7883
height="130"
7984
viewBox="0 0 91 130"
8085
width="91"
81-
xmlns="http://www.w3.org/2000/svg">
86+
xmlns="http://www.w3.org/2000/svg"
87+
>
8288
<g
8389
style="stroke:#000;stroke-width:2.70793;fill:none;fill-rule:evenodd;stroke-linecap:round;stroke-linejoin:round"
84-
transform="translate(1.818182 .909091)">
90+
transform="translate(1.818182 .909091)"
91+
>
8592
<path
8693
d="m1.35473654 25.2695268
8794
41.68515786-24.21771792c.5647044-.32807482 1.2619836-.32807795
@@ -91,14 +98,16 @@
9198
12.1113348c.5601525.3254236.9048434.9243111.9048434
9299
1.5721317v48.4560123c0 .647825-.3446953 1.246715-.9048537
93100
1.572138l-41.6835092
94-
24.215895c-.5655731.328567-1.2640448.328023-1.8291052-.001426l-41.5311197-24.21401c-.5587764-.325785-.90240476-.923899-.90240476-1.570712v-49.505258-24.5082917c0-.6478147.34468473-1.2466978.9048293-1.5721235z" />
101+
24.215895c-.5655731.328567-1.2640448.328023-1.8291052-.001426l-41.5311197-24.21401c-.5587764-.325785-.90240476-.923899-.90240476-1.570712v-49.505258-24.5082917c0-.6478147.34468473-1.2466978.9048293-1.5721235z"
102+
/>
95103
<path
96104
d="m22.0428451 114.442824v-25.2731141l-21.59284788-12.5449388
97105
42.75014288 24.6551909c.5648507.325765 1.260898.324109
98106
1.8241926-.004339l42.2766571-24.6508519-21.5955473
99107
12.6370084v-24.2248276c0-.6488012-.3457266-1.2484405-.9072187-1.5735092l-20.9222804-12.1126883
100108
21.6729314-12.6370084-42.4525958
101-
24.4763352c-.5545159.3197099-1.236865.3218902-1.7934127.0057303l-20.85286908-11.8459598" />
109+
24.4763352c-.5545159.3197099-1.236865.3218902-1.7934127.0057303l-20.85286908-11.8459598"
110+
/>
102111
</g>
103112
</svg>
104113
{/if}

‎src/elements/Button.svelte

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
<script lang="ts">
22
import { app } from '../stores'
33
export let onclick: () => void = () => {}
4-
export let position: string
4+
export let position: string = ''
5+
export let disabled: boolean = false
56
</script>
67

78
<style>
@@ -17,6 +18,8 @@
1718
font-family: inherit;
1819
transition: background 150ms ease-in-out;
1920
line-height: 1.15;
21+
opacity: 1;
22+
transition: opacity 200ms;
2023
}
2124
2225
button:focus {
@@ -35,15 +38,25 @@
3538
position: absolute;
3639
left: 0;
3740
}
41+
42+
.disabled {
43+
cursor: inherit;
44+
pointer-events: none;
45+
opacity: 0.4;
46+
}
3847
</style>
3948

4049
<button
4150
on:click={onclick}
51+
{disabled}
52+
class:disabled
4253
class="bn-onboard-custom bn-onboard-prepare-button"
4354
class:bn-onboard-prepare-button-right={position === 'right'}
4455
class:bn-onboard-prepare-button-left={position === 'left'}
45-
class:bn-onboard-prepare-button-center={position !== 'left' && position !== 'right'}
56+
class:bn-onboard-prepare-button-center={position !== 'left' &&
57+
position !== 'right'}
4658
class:bn-onboard-dark-mode-link={$app.darkMode}
47-
class:bn-onboard-dark-mode-background-hover={$app.darkMode}>
59+
class:bn-onboard-dark-mode-background-hover={$app.darkMode}
60+
>
4861
<slot />
4962
</button>

‎src/elements/IconButton.svelte

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
export let text: string
99
export let loadingWallet: string | undefined
1010
export let currentlySelected: boolean = false
11+
export let disabled: boolean = false
1112
</script>
1213

1314
<style>
@@ -27,6 +28,14 @@
2728
color: inherit;
2829
line-height: 1.15;
2930
font-family: inherit;
31+
opacity: 1;
32+
transition: opacity 200ms;
33+
}
34+
35+
.disabled {
36+
cursor: inherit;
37+
pointer-events: none;
38+
opacity: 0.4;
3039
}
3140
3241
button:hover {
@@ -86,9 +95,12 @@
8695

8796
<button
8897
on:click={onclick}
98+
{disabled}
99+
class:disabled
89100
class="bn-onboard-custom bn-onboard-icon-button"
90101
class:bn-onboard-dark-mode-background-hover={$app.darkMode}
91-
class:bn-onboard-selected-wallet={currentlySelected}>
102+
class:bn-onboard-selected-wallet={currentlySelected}
103+
>
92104
<div>
93105
{#if loadingWallet === text}
94106
<Spinner />

‎src/interfaces.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,21 @@ export interface WalletSelectModuleOptions {
2323
description?: string
2424
wallets?: Array<WalletModule | WalletInitOptions>
2525
explanation?: string
26+
agreement?: TermsOfServiceAgreementOptions
2627
}
2728

2829
export interface WalletSelectModule {
2930
heading: string
3031
description: string
3132
wallets: Array<WalletModule | WalletInitOptions>
3233
explanation?: string
34+
agreement?: TermsOfServiceAgreementOptions
35+
}
36+
37+
export interface TermsOfServiceAgreementOptions {
38+
version: string
39+
termsUrl?: string
40+
privacyUrl?: string
3341
}
3442

3543
export interface WalletCheckModule {
@@ -480,8 +488,23 @@ export interface AppState {
480488
walletSelectDisplayedUI: boolean
481489
walletCheckDisplayedUI: boolean
482490
displayBranding: boolean
491+
agreement: TermsOfServiceAgreementOptions
483492
}
484493

485494
export interface CancelablePromise extends Promise<any> {
486495
cancel: () => void
487496
}
497+
498+
export interface StorageKeys {
499+
TERMS_AGREEMENT: string
500+
}
501+
502+
/**
503+
* The object that will be stored in local storage to track
504+
* user's agreement to the terms.
505+
*/
506+
export interface TermsAgreementState {
507+
version: string
508+
terms?: boolean
509+
privacy?: boolean
510+
}

‎src/modules/check/network.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ import {
55
WalletCheckCustomOptions
66
} from '../../interfaces'
77
import { networkIcon } from './icons'
8-
import { app } from './../../stores'
9-
import { get } from 'svelte/store'
108

119
function network(
1210
options: WalletCheckCustomOptions = {}

0 commit comments

Comments
 (0)