Add the Bitski extension injected provider (#1327)

* Add the Bitski extension injected provider
* Update packages/injected/package.json
* Bump version in demo package and yarn it
Co-authored-by: Adam Carpenter <adamcarpenter86@gmail.com>

Author: pzuraq

packages/demo/package.json

@@ -28,7 +28,7 @@
     "@web3-onboard/fortmatic": "^2.0.14",
     "@web3-onboard/gas": "^2.1.3",
     "@web3-onboard/gnosis": "^2.1.3",
-    "@web3-onboard/injected-wallets": "^2.2.4",
+    "@web3-onboard/injected-wallets": "^2.3.0-alpha.1",
     "@web3-onboard/keepkey": "^2.3.1",
     "@web3-onboard/keystone": "^2.3.1",
     "@web3-onboard/ledger": "^2.3.1",

packages/injected/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/injected-wallets",
-  "version": "2.2.4",
+  "version": "2.3.0-alpha.1",
   "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",

packages/injected/src/constants.ts

@@ -6,6 +6,7 @@ export const WALLET_NAMES: { [key: string]: string } = {
   atoken: 'AToken',
   binance: 'Binance Chain Wallet',
   bitpie: 'Bitpie',
+  bitski: 'Bitski',
   coinbasewallet: 'Coinbase Wallet',
   dcentwallet: "D'CENT",
   metamask: 'MetaMask',

packages/injected/src/icons/bitski.ts

@@ -0,0 +1 @@
+export default `<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none" xmlns:v="https://vecta.io/nano"><g clip-path="url(#G)"><g clip-path="url(#H)"><path fill="#ff245a" d="M0 0h32v32H0z"/><g filter="url(#B)"><path stroke="url(#D)" stroke-width="16" d="M 8.00001 8.00001 L 24 8 L 24 24 L 8 24 Z"/></g><mask id="A" maskUnits="userSpaceOnUse" x="4" y="4" width="24" height="24" mask-type="alpha"><path fill-rule="evenodd" d="M10.377 8.118l-3.541 3.541c-.266.266-.249.482.017.748l10.872 10.872c.266.266.482.283.748.017l4.971-4.971c2.593-2.593 2.377-5.336.332-7.381-1.463-1.463-2.992-1.995-4.738-1.513-.283.083-.416.05-.549-.083-.049-.049-.088-.106-.139-.179l-.061-.087c-.2-.299-.532-.765-.798-1.031-2.095-2.095-4.771-2.277-7.115.066zm4.572 4.571l-.848.848c-.266.266-.482.249-.748-.017l-.798-.798c-.266-.266-.283-.482-.017-.748l.848-.848c.432-.432 1.047-.482 1.546.017.515.515.449 1.114.017 1.546zm5.436 2.677l-2.227 2.228c-.266.266-.482.249-.748-.017l-.798-.798c-.266-.266-.283-.482-.017-.748l2.228-2.228c.648-.648 1.263-.765 1.795-.233.549.549.416 1.147-.233 1.795zM7.792 17.352a.98.98 0 0 0 0 1.385l6.927 6.927a.98.98 0 0 0 1.385 0 .98.98 0 0 0 0-1.385l-6.927-6.927a.98.98 0 0 0-1.385 0z" fill="#fff"/></mask><g mask="url(#A)"><g filter="url(#C)"><rect x="6.645" y="6.42" width="18.704" height="19.719" rx="9.352" fill="url(#E)"/><rect x="6.645" y="6.42" width="18.704" height="19.719" rx="9.352" fill="url(#F)" fill-opacity=".12"/><rect x="6.645" y="6.42" width="18.704" height="19.719" rx="9.352" fill="#fff" fill-opacity=".2" style="mix-blend-mode:overlay"/></g></g></g></g><defs><filter id="B" x="-100" y="-100" width="232" height="232" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0"/><feBlend in="SourceGraphic"/><feGaussianBlur stdDeviation="50"/></filter><filter id="C" x="-53.355" y="-9.58" width="138.705" height="139.72" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="A"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="44"/><feGaussianBlur stdDeviation="30"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.28 0"/><feBlend in2="A"/><feBlend in="SourceGraphic"/></filter><linearGradient id="D" x1="16" y1="0" x2="16" y2="31.594" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".5"/><stop offset=".633" stop-color="#e00037"/></linearGradient><linearGradient id="E" x1="15.997" y1="6.42" x2="15.997" y2="26.139" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset=".544" stop-color="#f9f7fa"/><stop offset=".77" stop-color="#f7f7f7"/><stop offset="1" stop-color="#e6e6e6"/></linearGradient><radialGradient id="F" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(15.9967 11.8975) rotate(90) scale(14.2418 13.5087)"><stop offset=".479" stop-color="#fff"/><stop offset="1"/></radialGradient><clipPath id="G"><rect width="32" height="32" rx="8" fill="#fff"/></clipPath><clipPath id="H"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></svg>`

packages/injected/src/types.ts

@@ -55,6 +55,7 @@ export enum ProviderLabel {
   AToken = 'AToken',
   Binance = 'Binance Smart Wallet',
   Bitpie = 'Bitpie',
+  Bitski = 'Bitski',
   BlockWallet = 'BlockWallet',
   Brave = 'Brave Wallet',
   Coinbase = 'Coinbase Wallet',
@@ -107,7 +108,8 @@ export enum InjectedNameSpace {
   XFI = 'xfi',
   GameStop = 'gamestop',
   BitKeep = 'bitkeep',
-  Avalanche = 'avalanche'
+  Avalanche = 'avalanche',
+  Bitski = 'Bitski'
 }
 
 export interface CustomWindow extends Window {
@@ -124,6 +126,9 @@ export interface CustomWindow extends Window {
     ethereum: InjectedProvider
   }
   avalanche: InjectedProvider
+  Bitski: {
+    getProvider(): InjectedProvider
+  }
 }
 
 export type InjectedProvider = ExternalProvider &

packages/injected/src/wallets.ts

@@ -565,6 +565,19 @@ const core: InjectedWalletModule = {
   platforms: ['desktop', 'Chrome', 'Chromium', 'Microsoft Edge']
 }
 
+const bitski: InjectedWalletModule = {
+  label: ProviderLabel.Bitski,
+  injectedNamespace: InjectedNameSpace.Bitski,
+  checkProviderIdentity: ({ provider }) =>
+    !!provider && !!provider.getProvider && !!provider.getProvider().isBitski,
+  getIcon: async () => (await import('./icons/bitski.js')).default,
+  getInterface: async () => ({
+    provider:
+      window.Bitski && window.Bitski.getProvider && window.Bitski.getProvider()
+  }),
+  platforms: ['all']
+}
+
 const wallets = [
   exodus,
   metamask,
@@ -598,7 +611,8 @@ const wallets = [
   gamestop,
   bitkeep,
   sequence,
-  core
+  core,
+  bitski
 ]
 
 export default wallets