UNPKG

@mindsorg/web3modal-angular

Version:

Web3Modal implementation for Angular

1,446 lines (1,418 loc) 87.9 kB
import * as i0 from '@angular/core'; import { EventEmitter, Optional, Injectable, ViewEncapsulation, Component, Input, NgModule } from '@angular/core'; import * as env from 'detect-browser'; import { take } from 'rxjs/operators'; import * as i2 from '@angular/common'; import { CommonModule } from '@angular/common'; var injected = /*#__PURE__*/Object.freeze({ __proto__: null, get CIPHER () { return CIPHER; }, get COINBASE () { return COINBASE; }, get DAPPER () { return DAPPER; }, get FALLBACK () { return FALLBACK; }, get IMTOKEN () { return IMTOKEN; }, get METAMASK () { return METAMASK; }, get NIFTY () { return NIFTY; }, get OPERA () { return OPERA; }, get SAFE () { return SAFE; }, get STATUS () { return STATUS; }, get TOKENARY () { return TOKENARY; }, get TRUST () { return TRUST; } }); var providers = /*#__PURE__*/Object.freeze({ __proto__: null, get ARKANE () { return ARKANE; }, get AUTHEREUM () { return AUTHEREUM; }, get BITSKI () { return BITSKI; }, get BURNERCONNECT () { return BURNERCONNECT; }, get CIPHER () { return CIPHER; }, get COINBASE () { return COINBASE; }, get DAPPER () { return DAPPER; }, get DCENT () { return DCENT; }, get FALLBACK () { return FALLBACK; }, get FORTMATIC () { return FORTMATIC; }, get IMTOKEN () { return IMTOKEN; }, get METAMASK () { return METAMASK; }, get MEWCONNECT () { return MEWCONNECT; }, get NIFTY () { return NIFTY; }, get OPERA () { return OPERA; }, get SAFE () { return SAFE; }, get SQUARELINK () { return SQUARELINK; }, get STATUS () { return STATUS; }, get TOKENARY () { return TOKENARY; }, get TORUS () { return TORUS; }, get TRUST () { return TRUST; }, get UNILOGIN () { return UNILOGIN; }, get WALLETCONNECT () { return WALLETCONNECT; }, get WALLETLINK () { return WALLETLINK; } }); const CHAIN_DATA_LIST = { 1: { chainId: 1, chain: "ETH", network: "mainnet", networkId: 1 }, 2: { chainId: 2, chain: "EXP", network: "expanse", networkId: 1 }, 3: { chainId: 3, chain: "ETH", network: "ropsten", networkId: 3 }, 4: { chainId: 4, chain: "ETH", network: "rinkeby", networkId: 4 }, 5: { chainId: 5, chain: "ETH", network: "goerli", networkId: 5 }, 6: { chainId: 6, chain: "ETC", network: "kotti", networkId: 6 }, 8: { chainId: 8, chain: "UBQ", network: "ubiq", networkId: 88 }, 9: { chainId: 9, chain: "UBQ", network: "ubiq-testnet", networkId: 2 }, 10: { chainId: 10, chain: "ETH", network: "optimism", networkId: 10 }, 11: { chainId: 11, chain: "META", network: "metadium", networkId: 11 }, 12: { chainId: 12, chain: "META", network: "metadium-testnet", networkId: 12 }, 18: { chainId: 18, chain: "TST", network: "thundercore-testnet", networkId: 18 }, 22: { chainId: 22, chain: "LYX", network: "lukso-l14-testnet", networkId: 22 }, 23: { chainId: 23, chain: "LYX", network: "lukso-l15-testnet", networkId: 23 }, 30: { chainId: 30, chain: "RSK", network: "rsk", networkId: 30 }, 31: { chainId: 31, chain: "RSK", network: "rsk-testnet", networkId: 31 }, 42: { chainId: 42, chain: "ETH", network: "kovan", networkId: 42 }, 56: { chainId: 56, chain: "BSC", network: "binance", networkId: 56 }, 60: { chainId: 60, chain: "GO", network: "gochain", networkId: 60 }, 61: { chainId: 61, chain: "ETC", network: "etc", networkId: 1 }, 62: { chainId: 62, chain: "ETC", network: "etc-morden", networkId: 2 }, 63: { chainId: 63, chain: "ETC", network: "etc-testnet", networkId: 7 }, 64: { chainId: 64, chain: "ELLA", network: "ellaism", networkId: 64 }, 69: { chainId: 69, chain: "ETH", network: "optimism-kovan", networkId: 69 }, 76: { chainId: 76, chain: "MIX", network: "mix", networkId: 76 }, 77: { chainId: 77, chain: "POA", network: "poa-sokol", networkId: 77 }, 88: { chainId: 88, chain: "TOMO", network: "tomochain", networkId: 88 }, 97: { chainId: 97, chain: "BSC", network: "binance-testnet", networkId: 97 }, 99: { chainId: 99, chain: "POA", network: "poa-core", networkId: 99 }, 100: { chainId: 100, chain: "XDAI", network: "xdai", networkId: 100 }, 101: { chainId: 101, chain: "ETI", network: "etherinc", networkId: 1 }, 108: { chainId: 108, chain: "TT", network: "thundercore", networkId: 108 }, 162: { chainId: 162, chain: "PHT", network: "sirius", networkId: 162 }, 163: { chainId: 163, chain: "PHT", network: "lightstreams", networkId: 163 }, 211: { chainId: 211, chain: "FTN", network: "freight", networkId: 0 }, 250: { chainId: 250, chain: "FTM", network: "fantom", networkId: 250 }, 269: { chainId: 269, chain: "HPB", network: "hpb", networkId: 100 }, 385: { chainId: 385, chain: "CRO", network: "lisinski", networkId: 385 }, 820: { chainId: 820, chain: "CLO", network: "callisto", networkId: 1 }, 821: { chainId: 821, chain: "CLO", network: "callisto-testnet", networkId: 2 }, 137: { chainId: 137, chain: "MATIC", network: "matic", networkId: 137 }, 42161: { chainId: 42161, chain: "ETH", network: "arbitrum", networkId: 42161 }, 42220: { chainId: 42220, chain: "CELO", network: "celo", networkId: 42220 }, 44787: { chainId: 44787, chain: "CELO", network: "celo-alfajores", networkId: 44787 }, 62320: { chainId: 62320, chain: "CELO", network: "celo-baklava", networkId: 62320 }, 80001: { chainId: 80001, chain: "MUMBAI", network: "mumbai", networkId: 80001 }, 43113: { chainId: 43113, chain: "AVAX", network: "avalanche-fuji-testnet", networkId: 43113 }, 43114: { chainId: 43114, chain: "AVAX", network: "avalanche-fuji-mainnet", networkId: 43114 }, 246529: { chainId: 246529, chain: "ARTIS sigma1", network: "artis-s1", networkId: 246529 }, 246785: { chainId: 246785, chain: "ARTIS tau1", network: "artis-t1", networkId: 246785 }, 1007: { chainId: 1007, chain: "NewChain TestNet", network: "newchain-testnet", networkId: 1007 }, 1012: { chainId: 1012, chain: "NewChain MainNet", network: "newchain-mainnet", networkId: 1012 }, 421611: { chainId: 421611, chain: "ETH", network: "arbitrum-rinkeby", networkId: 421611 } }; const CONNECT_EVENT = 'connect'; const ERROR_EVENT = 'error'; const CLOSE_EVENT = 'close'; const INJECTED_PROVIDER_ID = 'injected'; const CACHED_PROVIDER_KEY = 'WEB3_CONNECT_CACHED_PROVIDER'; // -- EventController --------------------------------------------------------- // class EventController { constructor() { this._eventCallbacks = []; } on(eventCallback) { this._eventCallbacks.push(eventCallback); } off(eventObj) { // remove specific event callback if (eventObj) { if (eventObj.callback) { this._eventCallbacks = this._eventCallbacks.filter((eventCallback) => eventCallback.event !== eventObj.event || eventCallback.callback !== eventObj.callback); } // No callback to remove, remove entire event else { this._eventCallbacks = this._eventCallbacks.filter((eventCallback) => eventCallback.event !== eventObj.event); } } else { this._eventCallbacks = []; } } trigger(event, result) { let eventCallbacks = this._eventCallbacks.filter((eventCallback) => eventCallback.event === event); if (eventCallbacks && eventCallbacks.length) { eventCallbacks.forEach((eventCallback) => { eventCallback.callback(result); }); } } } const ConnectToInjected = async () => { let provider = null; if (window.ethereum) { provider = window.ethereum; try { await window.ethereum.enable(); } catch (error) { throw new Error('User Rejected'); } } else if (window.web3) { provider = window.web3.currentProvider; } else { throw new Error('No Web3 Provider found'); } return provider; }; let local; if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined') { local = window.localStorage; } const setLocal = (key, data) => { const jsonData = JSON.stringify(data); if (local) { local.setItem(key, jsonData); } }; const getLocal = (key) => { let data = null; let raw = null; if (local) { raw = local.getItem(key); } if (raw && typeof raw === 'string') { try { data = JSON.parse(raw); } catch (error) { return null; } } return data; }; const removeLocal = (key) => { if (local) { local.removeItem(key); } }; const updateLocal = (key, data) => { const localData = getLocal(key) || {}; const mergedData = { ...localData, ...data }; setLocal(key, mergedData); }; function checkInjectedProviders() { const result = { injectedAvailable: !!window.ethereum || !!window.web3, }; if (result.injectedAvailable) { let fallbackProvider = true; Object.values(injected).forEach(provider => { const isAvailable = verifyInjectedProvider(provider.check); if (isAvailable) { result[provider.check] = true; fallbackProvider = false; } }); const browser = env.detect(); if (browser && browser.name === 'opera') { result[OPERA.check] = true; fallbackProvider = false; } if (fallbackProvider) { result[FALLBACK.check] = true; } } return result; } function verifyInjectedProvider(check) { return window.ethereum ? window.ethereum[check] || (window.web3 && window.web3.currentProvider) ? window.web3 ? window.web3.currentProvider[check] : true : false : window.web3 && window.web3.currentProvider ? window.web3.currentProvider[check] : false; } function getInjectedProvider() { let result = null; const injectedProviders = checkInjectedProviders(); if (injectedProviders.injectedAvailable) { delete injectedProviders.injectedAvailable; const checks = Object.keys(injectedProviders); result = getProviderInfoFromChecksArray(checks); } return result; } function getInjectedProviderName() { const injectedProvider = getInjectedProvider(); return injectedProvider ? injectedProvider.name : null; } function getProviderInfo(provider) { if (!provider) return FALLBACK; const checks = Object.values(providers) .filter(x => provider[x.check]) .map(x => x.check); return getProviderInfoFromChecksArray(checks); } function getProviderInfoFromChecksArray(checks) { const check = filterProviderChecks(checks); return filterProviders('check', check); } function getProviderInfoByName(name) { return filterProviders('name', name); } function getProviderInfoById(id) { return filterProviders('id', id); } function getProviderInfoByCheck(check) { return filterProviders('check', check); } function isMobile() { let mobile = false; function hasTouchEvent() { try { document.createEvent('TouchEvent'); return true; } catch (e) { return false; } } function hasMobileUserAgent() { if (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i.test(navigator.userAgent.substr(0, 4))) { return true; } else if (hasTouchEvent()) { return true; } return false; } mobile = hasMobileUserAgent(); return mobile; } function getProviderDescription(providerInfo) { if (providerInfo.description) { return providerInfo.description; } let description = ''; switch (providerInfo.type) { case 'injected': description = `Connect to your ${providerInfo.name} Wallet`; break; case 'web': description = `Connect with your ${providerInfo.name} account`; break; case 'qrcode': description = `Scan with ${providerInfo.name} to connect`; break; case 'hardware': description = `Connect to your ${providerInfo.name} Hardware Wallet`; break; default: break; } return description; } function filterMatches(array, condition, fallback) { let result = fallback; const matches = array.filter(condition); if (!!matches && matches.length) { result = matches[0]; } return result; } function filterProviders(param, value) { if (!value) return FALLBACK; const match = filterMatches(Object.values(providers), x => x[param] === value, FALLBACK); return match || FALLBACK; } function filterProviderChecks(checks) { if (!!checks && checks.length) { if (checks.length > 1) { if (checks[0] === METAMASK.check || checks[0] === CIPHER.check) { return checks[1]; } } return checks[0]; } return FALLBACK.check; } function getChainId(network) { const chains = Object.values(CHAIN_DATA_LIST); const match = filterMatches(chains, x => x.network === network, undefined); if (!match) { throw new Error(`No chainId found match ${network}`); } return match.chainId; } function findMatchingRequiredOptions(requiredOptions, providedOptions) { const matches = requiredOptions.filter(requiredOption => { if (typeof requiredOption === 'string') { return requiredOption in providedOptions; } const matches = findMatchingRequiredOptions(requiredOption, providedOptions); return matches && matches.length; }); return matches; } const ConnectToWalletConnect = (WalletConnectProvider, opts) => { return new Promise(async (resolve, reject) => { let bridge = 'https://bridge.walletconnect.org'; let qrcode = true; let infuraId = ''; let rpc = undefined; let chainId = 1; console.log('wallet connect'); // todo remove dev item if (opts) { bridge = opts.bridge || bridge; qrcode = typeof opts.qrcode !== 'undefined' ? opts.qrcode : qrcode; infuraId = opts.infuraId || ''; rpc = opts.rpc || undefined; chainId = opts.network && getChainId(opts.network) ? getChainId(opts.network) : 1; } const provider = new WalletConnectProvider({ bridge, qrcode, infuraId, rpc, chainId, }); try { await provider.enable(); resolve(provider); } catch (e) { reject(e); } }); }; const ConnectToFortmatic = async (Fortmatic, opts) => { if (opts && opts.key) { try { const key = opts.key; const fm = new Fortmatic(key, opts.network); const provider = await fm.getProvider(); provider.fm = fm; await fm.user.login(); const isLoggedIn = await fm.user.isLoggedIn(); if (isLoggedIn) { return provider; } else { throw new Error('Failed to login to Fortmatic'); } } catch (error) { throw error; } } else { throw new Error('Missing Fortmatic key'); } }; // Supports Torus package versions 0.2.* const ConnectToTorus = async (Torus, opts) => { return new Promise(async (resolve, reject) => { try { // defaults let buttonPosition = 'bottom-left'; let apiKey = 'torus-default'; let modalZIndex = 99999999; let network = { host: 'mainnet' }; let defaultVerifier = undefined; // parsing to Torus interfaces network = opts.networkParams || opts.network ? { host: opts.network, ...opts.networkParams } : network; const torus = new Torus({ buttonPosition: opts.config?.buttonPosition || buttonPosition, apiKey: opts.config?.apiKey || apiKey, modalZIndex: opts.config?.modalZIndex || modalZIndex, }); await torus.init({ showTorusButton: false, ...opts.config, network, }); if (opts.loginParams) { defaultVerifier = opts.loginParams.verifier; } await torus.login({ verifier: defaultVerifier }); const provider = torus.provider; provider.torus = torus; resolve(provider); } catch (err) { reject(err); } }); }; const ConnectToSquarelink = (Squarelink, opts) => { return new Promise(async (resolve, reject) => { if (opts && opts.id) { try { const id = opts.id; const network = opts.network || 'mainnet'; const config = opts.config; const sqlk = new Squarelink(id, network, config); const provider = await sqlk.getProvider(); provider.sqlk = sqlk; await provider.enable(); return resolve(provider); } catch (error) { return reject(new Error('Failed to login to Squarelink')); } } else { return reject(new Error('Missing Squarelink Id')); } }); }; const ConnectToArkane = (Arkane, opts) => { return new Promise(async (resolve, reject) => { if (opts && opts.clientId) { try { const options = { clientId: opts.clientId, rpcUrl: opts.nodeUrl, environment: opts.environment, signMethod: 'POPUP', }; const provider = await window.Arkane.createArkaneProviderEngine(options); return resolve(provider); } catch (error) { console.error(error); return reject(new Error('Failed to login to Arkane 2')); } } else { return reject(new Error('Please provide an Arkane client id')); } }); }; const ConnectToAuthereum = (Authereum, opts = {}) => { return new Promise(async (resolve, reject) => { try { const authereum = new Authereum({ ...opts, networkName: opts.networkName || opts.network, }); const provider = authereum.getProvider(); provider.authereum = authereum; await provider.enable(); resolve(provider); } catch (error) { return reject(error); } }); }; const ConnectToBurnerConnect = async (BurnerConnectProvider, opts) => { opts.defaultNetwork = opts.defaultNetwork || opts.network; const provider = new BurnerConnectProvider(opts); await provider.enable(); return provider; }; const ConnectToUniLogin = async (UniLogin, options) => { try { const uniloginProvider = new UniLogin.create(options.network || 'mainnet'); await uniloginProvider.enable(); uniloginProvider.on = () => { }; return uniloginProvider; } catch (error) { return error; } }; const ConnectToMewConnect = (MewConnectProvider, opts) => { return new Promise(async (resolve, reject) => { let infuraId = ''; let rpc = undefined; let chainId = 1; if (opts) { infuraId = opts.infuraId || ''; rpc = opts.rpc || undefined; if (opts.infuraId && !rpc) { rpc = `wss://mainnet.infura.io/ws/v3/${infuraId}`; } chainId = opts.network && getChainId(opts.network) ? getChainId(opts.network) : 1; } if (!MewConnectProvider.Provider.isConnected) { const mewConnect = new MewConnectProvider.Provider(); const provider = mewConnect.makeWeb3Provider(chainId, rpc, true); mewConnect.on('disconnected', () => { }); try { const address = await mewConnect.enable(); console.log(address); // todo remove dev item resolve(provider); } catch (e) { reject(e); } } }); }; const ConnectToDcentWallet = async (DcentProvider, opts) => { const provider = new DcentProvider(opts); await provider.enable(); return provider; }; const ConnectToBitski = async (Bitski, opts) => { const bitski = new Bitski(opts.clientId, opts.callbackUrl, opts.extraBitskiOptions); await bitski.signIn(); const provider = bitski.getProvider(opts.extraProviderOptions); return provider; }; const ConnectToWalletLink = (WalletLinkProvider, opts) => { return new Promise(async (resolve, reject) => { let infuraUrl = ''; let appName = ""; let appLogoUrl = ""; let darkMode = false; let chainId = 1; if (opts) { appName = opts.appName || appName; appLogoUrl = opts.appLogoUrl || appLogoUrl; darkMode = opts.darkMode || darkMode; infuraUrl = opts.infuraUrl || ''; chainId = opts.network && getChainId(opts.network) ? getChainId(opts.network) : 1; } if (!infuraUrl) { throw new Error('Missing Infura URL for WalletLink Provider'); } const provider = new WalletLinkProvider({ appName, appLogoUrl, darkMode }).makeWeb3Provider(infuraUrl, chainId); try { await provider.enable(); resolve(provider); } catch (e) { reject(e); } }); }; var index = /*#__PURE__*/Object.freeze({ __proto__: null, arkane: ConnectToArkane, authereum: ConnectToAuthereum, bitski: ConnectToBitski, burnerconnect: ConnectToBurnerConnect, dcentwallet: ConnectToDcentWallet, fortmatic: ConnectToFortmatic, injected: ConnectToInjected, mewconnect: ConnectToMewConnect, squarelink: ConnectToSquarelink, torus: ConnectToTorus, unilogin: ConnectToUniLogin, walletconnect: ConnectToWalletConnect, walletlink: ConnectToWalletLink }); const FALLBACK = { id: 'injected', name: 'Web3', logo: 'https://cdn-assets.minds.com/web3modal-assets/web3-default.svg', type: 'injected', check: 'isWeb3', }; const METAMASK = { id: 'injected', name: 'MetaMask', logo: 'https://cdn-assets.minds.com/web3modal-assets/metamask.svg', type: 'injected', check: 'isMetaMask', }; const SAFE = { id: 'injected', name: 'Safe', logo: 'https://cdn-assets.minds.com/web3modal-assets/safe.svg', type: 'injected', check: 'isSafe', }; const NIFTY = { id: 'injected', name: 'Nifty', logo: 'https://cdn-assets.minds.com/web3modal-assets/niftyWallet.png', type: 'injected', check: 'isNiftyWallet', }; const DAPPER = { id: 'injected', name: 'Dapper', logo: 'https://cdn-assets.minds.com/web3modal-assets/dapper.png', type: 'injected', check: 'isDapper', }; const OPERA = { id: 'injected', name: 'Opera', logo: 'https://cdn-assets.minds.com/web3modal-assets/opera.svg', type: 'injected', check: 'isOpera', }; const TRUST = { id: 'injected', name: 'Trust', logo: 'https://cdn-assets.minds.com/web3modal-assets/trust.svg', type: 'injected', check: 'isTrust', }; const COINBASE = { id: 'injected', name: 'Coinbase', logo: 'https://cdn-assets.minds.com/web3modal-assets/coinbase.svg', type: 'injected', check: 'isToshi', }; const CIPHER = { id: 'injected', name: 'Cipher', logo: 'https://cdn-assets.minds.com/web3modal-assets/cipher.svg', type: 'injected', check: 'isCipher', }; const IMTOKEN = { id: 'injected', name: 'imToken', logo: 'https://cdn-assets.minds.com/web3modal-assets/imtoken.svg', type: 'injected', check: 'isImToken', }; const STATUS = { id: 'injected', name: 'Status', logo: 'https://cdn-assets.minds.com/web3modal-assets/status.svg', type: 'injected', check: 'isStatus', }; const TOKENARY = { id: 'injected', name: 'Tokenary', logo: 'https://cdn-assets.minds.com/web3modal-assets/tokenary.png', type: 'injected', check: 'isTokenary', }; const WALLETCONNECT = { id: 'walletconnect', name: 'WalletConnect', logo: 'https://cdn-assets.minds.com/web3modal-assets/walletconnect-circle.svg', type: 'qrcode', check: 'isWalletConnect', package: { required: [['infuraId', 'rpc']], }, }; const WALLETLINK = { id: 'walletlink', name: 'Coinbase', logo: 'https://cdn-assets.minds.com/web3modal-assets/coinbase.svg', type: 'qrcode', check: 'isWalletLink', package: { required: ['infuraUrl'], }, }; const FORTMATIC = { id: 'fortmatic', name: 'Fortmatic', logo: 'https://cdn-assets.minds.com/web3modal-assets/fortmatic.svg', type: 'web', check: 'isFortmatic', package: { required: ['key'], }, }; const SQUARELINK = { id: 'squarelink', name: 'Squarelink', logo: 'https://cdn-assets.minds.com/web3modal-assets/squarelink.svg', type: 'web', check: 'isSquarelink', package: { required: ['id'], }, }; const TORUS = { id: 'torus', name: 'Torus', logo: 'https://cdn-assets.minds.com/web3modal-assets/torus.svg', type: 'web', check: 'isTorus', }; const ARKANE = { id: 'arkane', name: 'Arkane', logo: 'https://cdn-assets.minds.com/web3modal-assets/arkane.svg', type: 'web', check: 'isArkane', package: { required: ['clientId'], }, }; const AUTHEREUM = { id: 'authereum', name: 'Authereum', logo: 'https://cdn-assets.minds.com/web3modal-assets/authereum.svg', type: 'web', check: 'isAuthereum', }; const BURNERCONNECT = { id: 'burnerconnect', name: 'Burner Connect', logo: 'https://cdn-assets.minds.com/web3modal-assets/burnerwallet.png', type: 'web', check: 'isBurnerProvider', }; const UNILOGIN = { id: 'unilogin', name: 'UniLogin', logo: 'https://cdn-assets.minds.com/web3modal-assets/unilogin.svg', check: 'isUniLogin', type: 'web', }; const MEWCONNECT = { id: 'mewconnect', name: 'MEW wallet', logo: 'https://cdn-assets.minds.com/web3modal-assets/mewwallet.png', type: 'qrcode', check: 'isMEWconnect', package: { required: [['infuraId', 'rpc']], }, }; const DCENT = { id: 'dcentwallet', name: "D'CENT", logo: 'https://cdn-assets.minds.com/web3modal-assets/dcentwallet.png', type: 'hardware', check: 'isDcentWallet', package: { required: ['rpcUrl'], }, }; const BITSKI = { id: 'bitski', name: 'Bitski', logo: 'https://cdn-assets.minds.com/web3modal-assets/bitski.svg', type: 'web', check: 'isBitski', package: { required: ['clientId', 'callbackUrl'], }, }; class ProviderController { constructor(opts) { this.cachedProvider = ''; this.shouldCacheProvider = false; this.disableInjectedProvider = false; this.eventController = new EventController(); this.injectedProvider = null; this.providers = []; this.network = ''; this.getUserOptions = () => { const mobile = isMobile(); const defaultProviderList = this.providers.map(({ id }) => id); const displayInjected = !!this.injectedProvider && !this.disableInjectedProvider; const onlyInjected = displayInjected && mobile; const providerList = []; if (onlyInjected) { providerList.push(INJECTED_PROVIDER_ID); } else { if (displayInjected) { providerList.push(INJECTED_PROVIDER_ID); } defaultProviderList.forEach((id) => { if (id !== INJECTED_PROVIDER_ID) { const result = this.shouldDisplayProvider(id); if (result) { providerList.push(id); } } }); } const userOptions = []; providerList.forEach((id) => { let provider = this.getProvider(id); if (typeof provider !== 'undefined') { let { id, name, logo, connector } = provider; // replace logo with configuration set logo, use default as fallback. logo = this.providerOptions[id]?.logoUrl ?? logo; userOptions.push({ name, logo, description: getProviderDescription(provider), onClick: () => this.connectTo(id, connector), }); } }); return userOptions; }; this.connectTo = async (id, connector) => { try { const providerPackage = this.getProviderOption(id, 'package'); const providerOptions = this.getProviderOption(id, 'options'); const opts = { network: this.network || undefined, ...providerOptions }; const provider = await connector(providerPackage, opts); this.eventController.trigger(CONNECT_EVENT, provider); if (this.shouldCacheProvider && this.cachedProvider !== id) { this.setCachedProvider(id); } } catch (error) { this.eventController.trigger(ERROR_EVENT); } }; this.cachedProvider = getLocal(CACHED_PROVIDER_KEY) || ''; this.disableInjectedProvider = opts.disableInjectedProvider; this.shouldCacheProvider = opts.cacheProvider; this.providerOptions = opts.providerOptions; this.network = opts.network; this.injectedProvider = getInjectedProvider(); this.providers = Object.keys(index).map((id) => { let providerInfo; if (id === INJECTED_PROVIDER_ID) { providerInfo = this.injectedProvider || FALLBACK; } else { providerInfo = getProviderInfoById(id); } // parse custom display options if (this.providerOptions[id]) { const options = this.providerOptions[id]; if (typeof options.display !== 'undefined') { providerInfo = { ...providerInfo, ...this.providerOptions[id].display, }; } } return { ...providerInfo, connector: index[id], package: providerInfo.package, }; }); // parse custom providers Object.keys(this.providerOptions) .filter(key => key.startsWith('custom-')) .map(id => { if (id && this.providerOptions[id]) { const options = this.providerOptions[id]; if (typeof options.display !== 'undefined' && typeof options.connector !== 'undefined') { this.providers.push({ ...FALLBACK, id, ...options.display, connector: options.connector, }); } } }); } shouldDisplayProvider(id) { const provider = this.getProvider(id); if (typeof provider !== 'undefined') { const providerPackageOptions = this.providerOptions[id]; if (providerPackageOptions) { const isProvided = !!providerPackageOptions.package; if (isProvided) { const requiredOptions = provider.package ? provider.package.required : undefined; if (requiredOptions && requiredOptions.length) { const providedOptions = providerPackageOptions.options; if (providedOptions && Object.keys(providedOptions).length) { const matches = findMatchingRequiredOptions(requiredOptions, providedOptions); if (requiredOptions.length === matches.length) { return true; } } } else { return true; } } } } return false; } getProvider(id) { return filterMatches(this.providers, x => x.id === id, undefined); } getProviderOption(id, key) { return this.providerOptions && this.providerOptions[id] && this.providerOptions[id][key] ? this.providerOptions[id][key] : {}; } clearCachedProvider() { this.cachedProvider = ''; removeLocal(CACHED_PROVIDER_KEY); } setCachedProvider(id) { this.cachedProvider = id; setLocal(CACHED_PROVIDER_KEY, id); } async connectToCachedProvider() { const provider = this.getProvider(this.cachedProvider); if (typeof provider !== 'undefined') { await this.connectTo(provider.id, provider.connector); } } on(event, callback) { this.eventController.on({ event, callback, }); return () => this.eventController.off({ event, callback, }); } off(event, callback) { this.eventController.off({ event, callback, }); } } class Web3WalletConnector { constructor(configOptions) { this.providers = []; this.setConfiguration = (options) => { this.providerController = new ProviderController(options); this.clearCachedProvider(); this.providers = this.providerController.getUserOptions(); }; if (!configOptions) { this.providerController = new ProviderController({ disableInjectedProvider: false, cacheProvider: false, providerOptions: {}, network: "", }); } else { this.providerController = new ProviderController(configOptions); } this.providers = this.providerController.getUserOptions(); } get cachedProvider() { return this.providerController.cachedProvider; } async checkIfCachedProviderOrSingleOption() { if (this.cachedProvider) { await this.providerController.connectToCachedProvider(); return; } if (this.providers && this.providers.length === 1 && this.providers[0].name) { await this.providers[0].onClick(); return; } } clearCachedProvider() { this.providerController.clearCachedProvider(); } setCachedProvider(id) { this.providerController.setCachedProvider(id); } } class Web3ModalService { constructor(configOptions) { this.shouldOpen = new EventEmitter(); this.providers = new EventEmitter(); this.web3WalletConnector = new Web3WalletConnector(configOptions); } async open() { this.providers.next(this.web3WalletConnector.providers); return await new Promise((resolve, reject) => { this.web3WalletConnector.providerController.on(CONNECT_EVENT, provider => { resolve(provider); }); this.web3WalletConnector.providerController.on(ERROR_EVENT, error => { reject(error); }); this.shouldOpen.next(true); this.shouldOpen.pipe(take(1)).subscribe({ next: (open) => { if (!open) { reject('Dismissed modal'); } } }); }).finally(() => { this.close(); }); } setConfiguration(options) { this.web3WalletConnector.setConfiguration(options); } clearCachedProvider() { this.web3WalletConnector.providerController.clearCachedProvider(); } setCachedProvider(id) { this.web3WalletConnector.providerController.setCachedProvider(id); } close() { this.shouldOpen.next(false); } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Web3ModalService, deps: "invalid", target: i0.ɵɵFactoryTarget.Injectable }); } static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Web3ModalService }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Web3ModalService, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Optional }] }] }); class Modal { constructor() { this.allowClose = true; this.hidden = true; this.closed = new EventEmitter(); } set _hidden(value) { this.hidden = value; } set open(value) { this.hidden = !value; } close(event) { if (!this.allowClose) return; this.hidden = !this.hidden; this.closed.next(true); event.stopPropagation(); } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Modal, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: Modal, isStandalone: false, selector: "m-modal", inputs: { open: "open", allowClose: "allowClose" }, outputs: { closed: "closed" }, host: { properties: { "hidden": "hidden" } }, ngImport: i0, template: "<div class=\"m-modal-bg\" (click)=\"close($event)\"></div>\n<div class=\"m-modal-container\">\n <ng-content></ng-content>\n</div>", styles: ["m-modal .m-modal-bg{width:100%;height:100%;top:0;left:0;position:fixed;cursor:pointer;z-index:99999991;background-color:#000c}m-modal .m-modal-container{position:fixed;margin:auto;z-index:99999995;width:800px;max-width:100%;left:50%;top:50%;max-height:98vh;display:block;box-sizing:border-box;transform:translate(-50%,-50%);padding:32px;outline:0;border-radius:6px;overflow-y:auto;-webkit-overflow-scrolling:touch;font-family:Roboto,sans-serif}m-modal{position:relative;inset:0;height:100%;width:100%;overflow:overlay;overflow:scroll}\n"], encapsulation: i0.ViewEncapsulation.None }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Modal, decorators: [{ type: Component, args: [{ selector: 'm-modal', host: { '[hidden]': 'hidden', }, inputs: ['open', 'allowClose'], outputs: ['closed'], encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"m-modal-bg\" (click)=\"close($event)\"></div>\n<div class=\"m-modal-container\">\n <ng-content></ng-content>\n</div>", styles: ["m-modal .m-modal-bg{width:100%;height:100%;top:0;left:0;position:fixed;cursor:pointer;z-index:99999991;background-color:#000c}m-modal .m-modal-container{position:fixed;margin:auto;z-index:99999995;width:800px;max-width:100%;left:50%;top:50%;max-height:98vh;display:block;box-sizing:border-box;transform:translate(-50%,-50%);padding:32px;outline:0;border-radius:6px;overflow-y:auto;-webkit-overflow-scrolling:touch;font-family:Roboto,sans-serif}m-modal{position:relative;inset:0;height:100%;width:100%;overflow:overlay;overflow:scroll}\n"] }] }] }); /** * Component wrapper for Metamask logo SVG. */ class Web3ModalMetamaskLogoComponent { static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Web3ModalMetamaskLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: Web3ModalMetamaskLogoComponent, isStandalone: false, selector: "m-web3-modal-metamask-logo", ngImport: i0, template: ` <svg width="345px" height="322px" viewBox="0 0 345 322" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 48.2 (47327) - http://www.bohemiancoding.com/sketch --> <title>metamask</title> <desc>Created with Sketch.</desc> <defs></defs> <g id="metamask" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g fill-rule="nonzero" id="Shape"> <polygon stroke="#F6851B" fill="#F6851B" points="125.609336 54.7652595 214.004731 52.4943349 190.464604 99.3115951"></polygon> <polygon stroke="#F6851B" fill="#F6851B" points="190.464604 99.3115951 141.18833 100.253458 125.609336 54.7652595"></polygon> <polygon stroke="#E4761B" fill="#E4761B" points="141.18833 100.253458 18.3981091 10.6018951 125.609336 54.7652595"></polygon> <polygon stroke="#763D16" fill="#763D16" points="71.4163573 141.226234 15.4535146 127.296088 12.6090885 114.4584"></polygon> <polygon stroke="#763D16" fill="#763D16" points="17.187184 142.752141 15.4535146 127.296088 71.4163573 141.226234"></polygon> <polygon stroke="#763D16" fill="#763D16" points="17.187184 142.752141 71.4163573 141.226234 24.7516021 165.079784"></polygon> <polygon stroke="#763D16" fill="#763D16" points="24.7516021 165.079784 71.4163573 141.226234 93.8508404 145.045596"></polygon> <polygon stroke="#763D16" fill="#763D16" points="71.3609734 70.3102307 71.4163573 141.226234 12.6090885 114.4584"></polygon> <polygon stroke="#763D16" fill="#763D16" points="93.8508404 145.045596 71.4163573 141.226234 71.3609734 70.3102307"></polygon> <polygon stroke="#E2761B" fill="#E2761B" points="118.836084 279.399985 19.5398793 317.895193 92.5830263 289.102142"></polygon> <polygon stroke="#E2761B" fill="#E2761B" points="92.5830263 289.102142 113.53989 279.852373 118.836084 279.399985"></polygon> <polygon stroke="#E2761B" fill="#E2761B" points="315.42735 0.938069582 190.464604 99.3115951 214.004731 52.4943349"></polygon> <polygon stroke="#763D16" fill="#763D16" points="5.30887973 119.190961 12.6090885 114.4584 15.4535146 127.296088"></polygon> <polygon stroke="#763D16" fill="#763D16" points="17.187184 142.752141 7.16155177 133.026086 15.4535146 127.296088"></polygon> <polygon stroke="#E4761B" fill="#E4761B" points="92.5830263 289.102142 19.5398793 317.895193 0.492086977 239.803694"></polygon> <polygon stroke="#763D16" fill="#763D16" points="12.6090885 114.4584 2.68213692 60.7724764 71.3609734 70.3102307"></polygon> <polygon stroke="#763D16" fill="#763D16" points="269.169992 138.581129 328.878431 108.955677 325.724354 122.481291"></polygon> <polygon stroke="#763D16" fill="#763D16" points="24.7516021 165.079784 10.3994778 147.108352 17.187184 142.752141"></polygon> <polygon stroke="#763D16" fill="#763D16" points="323.656824 138.68867 269.169992 138.581129 325.724354 122.481291"></polygon> <polygon stroke="#763D16" fill="#763D16" points="323.656824 138.68867 315.532189 162.174839 269.169992 138.581129"></polygon> <polygon stroke="#763D16" fill="#763D16" points="315.532189 162.174839 242.896561 143.14059 269.169992 138.581129"></polygon> <polygon stroke="#763D16" fill="#763D16" points="328.878431 108.955677 269.169992 138.581129 263.485955 65.7680278"></polygon> <polygon stroke="#763D16" fill="#763D16" points="263.485955 65.7680278 269.169992 138.581129 242.896561 143.14059"></polygon> <polygon stroke="#F6851B" fill="#F6851B" points="68.2087529 169.187957 0.492086977 239.803694 24.7516021 165.079784"></polygon> <polygon stroke="#E4761B" fill="#E4761B" points="0.492086977 239.803694 56.3767556 230.10087 92.5830263 289.102142"></polygon> <polygon stroke="#F6851B" fill="#F6851B" points="56.3767556 230.10087 0.492086977 239.803694 68.2087529 169.187957"></polygon> <polygon stroke="#763D16" fill="#763D16" points="71.3609734 70.3102307 141.18833 100.253458 93.8508404 145.045596"></polygon> <polygon stroke="#F6851B" fill="#F6851B" points="24.7516021 165.079784 93.8508404 145.045596 68.2087529 169.187957"></polygon> <polygon stroke="#763D16" fill="#763D16" points="242.896561 143.14059 190.464604 99.3115951 263.485955 65.7680278"></polygon> <polygon stroke="#763D16" fill="#763D16" points="71.3609734 70.3102307 2.68213692 60.7724764 18.3981091 10.6018951"></polygon> <polygon stroke="#763D16" fill="#763D16" points="18.3981091 10.6018951 141.18833 100.253458 71.3609734 70.3102307"></polygon> <polygon stroke="#E4761B" fill="#E4761B" points="140.88318 168.733865 68.2087529 169.187957 93.8508404 145.045596"></polygon> <polygon stroke="#E4761B" fill="#E4761B" points="93.8508404 145.045596 141.18833 100.253458 140.88318 168.733865"></polygon> <polygon stroke="#E4761B" fill="#E476