chore: changes for 1.3.6 release

CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## Manifest Version 1.3.6
+
+- better display of blockchain explorer button
+- updated ethers dependency to latest 6.11.1
+- better handling of type sigining
+- changed the password input for unlock to not lose focus
+- activated focus on password input for unlock on view enter
+- disabled integration of fire wallet(in cause user has it installed) with type signing due to incompatibility
+- other misc improvements
+- added a check when sending native token to check if internet / RPC or Blockchain and show a message to the user
+- customize testNets icons to show a small dev icon on the top right corner
+- updated testNets templates to include newer networks
+- show icons for testNets too in most places
+
 ## Manifest Version 1.3.5
 
 - added copy button to chainId for easier development

package.json

@@ -24,7 +24,7 @@
     "@ionic/vue-router": "^7.2.3",
     "@types/chrome": "^0.0.243",
     "core-js": "^3.32.0",
-    "ethers": "^6.7.0",
+    "ethers": "^6.11.1",
     "vue": "^3.3.4",
     "vue-router": "^4.2.4"
   },

src/App.vue

@@ -6,7 +6,7 @@
 
 <script lang="ts">
 import { IonApp, IonRouterOutlet } from "@ionic/vue";
-import { defineComponent, onBeforeMount, onMounted, onUnmounted } from "vue";
+import { defineComponent, onBeforeMount, onMounted } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { getSettings } from "@/utils/platform";
 import { getSelectedAddress } from "@/utils/wallet";
@@ -68,6 +68,11 @@ export default defineComponent({
       return true;
     };
 
+    if (chrome?.runtime?.onMessage) {
+      chrome.runtime.onMessage.addListener(pageListener);
+      console.info("page listener set");
+    }
+
     onBeforeMount(() => {
       getSettings().then((settings) => {
         if (settings.theme !== "system") {
@@ -75,18 +80,14 @@ export default defineComponent({
           document.body.classList.add(settings.theme);
         }
       });
-      if (chrome?.runtime?.onMessage) {
-        chrome.runtime.onMessage.addListener(pageListener);
-        console.info("page listener set");
-      }
     });
 
-    onUnmounted(() => {
+    // onUnmounted(() => {
-      if (chrome?.runtime?.onMessage) {
+    //   if (chrome?.runtime?.onMessage) {
-        chrome.runtime.onMessage.removeListener(pageListener);
+    //     chrome.runtime.onMessage.removeListener(pageListener);
-        console.info("page listener removed");
+    //     console.info("page listener removed");
-      }
+    //   }
-    });
+    // });
 
     onMounted(() => {
       switch (route?.query?.route ?? "") {

src/extension/content.ts

@@ -59,18 +59,40 @@ window.addEventListener("message", (event) => {
     event.data.data.data.resId = event.data.resId
     event.data.data.data.type = "CLWALLET_CONTENT_MSG"
     event.data.data.data.website = document?.location?.href ?? ''
-    if ((event?.data?.data?.data?.method ?? 'x') in allowedMethods) {
+    if ((event?.data?.data?.method ?? 'x') in allowedMethods) {
+      event.data.data.data.method = event?.data?.data?.method ?? ''
       chrome?.runtime?.sendMessage(event.data.data.data, (res) => {
         if (chrome.runtime.lastError) {
           console.warn("LOC1: Error sending message:", chrome.runtime.lastError);
         }
-        const data = { type: "CLWALLET_PAGE", data: res, resId: event.data.resId };
+        const id = Number(event.data.resId.replace(/[A-Za-z]/g, '').slice(0, 10))
+        const data = { 
+          target: 'metamask-inpage',
+          type: "CLWALLET_PAGE",
+          resId: event.data.resId,
+          data: { name: 'metamask-provider', data: {
+              jsonrpc: '2.0',
+              id,
+              result: res,
+          },
+          id,
+          method: event?.data?.data?.data?.method ?? '',
+          params: event?.data?.data?.data?.params ?? [],
+        },
+      }
+
         // console.info('data out', data)
         window.postMessage(data, "*");
       })
     }
     else {
-      const data = { type: "CLWALLET_PAGE", data: { error: true, message: 'ClearWallet: Unknown method requested ' + event?.data?.data?.data?.method ?? '' }, resId: event.data.resId };
+      const data = { 
+        type: "CLWALLET_PAGE", 
+        data: {
+        data: {
+          result: { error: true, message: 'ClearWallet: Unknown method requested ' + event?.data?.data?.data?.method ?? '' }
+        } }
+        , resId: event.data.resId };
       window.postMessage(data, "*");
     }
   } else if (event?.data?.type === "CLWALLET_PING") {

src/extension/inject.ts

@@ -70,16 +70,23 @@ const getListnersCount = (): number => {
 }
 
 const sendMessage = (args: RequestArguments, ping = false, from = 'request'): Promise<unknown> => {
-if(Object.values(promResolvers).filter(r=> r).length < 10 ) {
+if(promResolvers.size < 10 ) {
     return new Promise((resolve, reject) => {
         const resId = [...`${Math.random().toString(16) + Date.now().toString(16)}`].slice(2).join('')
         promResolvers.set(resId, { resolve, reject })
+        const p = [ "eth_signTypedData", "eth_signTypedData_v3", "eth_signTypedData_v4"]
+        const method = args.method
+        if (p.includes(args.method)) {
+            args.method = undefined as any
+        }
         const data = { 
             type: "CLWALLET_CONTENT", 
-            data: { data: args, name: 'metamask-provider' },
+            target: 'metamask-contentscript',
+            data: {
+                method,
+                name: 'metamask-provider', data: args, jsonrpc: '2.0', id: Number(resId.replace(/[A-Za-z]/g, '').slice(0, 10)) },
             resId,
             from,
-            target: 'metamask-contentscript'
         }
         if (ping) {
             data.type = 'CLWALLET_PING'
@@ -89,8 +96,10 @@ if(Object.values(promResolvers).filter(r=> r).length < 10 ) {
  
     }) 
     } else {
-        return new Promise((resolve, reject) => {
+        return new Promise((_resolve, reject) => {
-            reject(new Error("You have reached the maximum number of concurent wallet messeges."))
+            setTimeout(() => {
+            reject({code: -32000, message: 'ClearWallet: Too many requests', error: true })
+            } , 200)
         })
     }
 }
@@ -164,45 +173,6 @@ class MetaMaskAPI {
                 return sendMessage(arg1 as RequestArguments, false, 'sendAsync') as Promise<unknown>
             }
     }
-    // Deprecated
-    // send (arg1: unknown, arg2: unknown): unknown {
-    //     if (arg2 === undefined) {
-    //         if( typeof arg1 === 'string' ) {
-    //             return sendMessage({
-    //                 method: arg1,
-    //                 params: undefined
-    //             })
-    //         } else if (typeof arg1 === 'object') {
-    //             return sendMessage(arg1 as RequestArguments)
-    //         } else {
-    //             console.error('ERROR: Clear Wallet: faulty request')
-    //         }
-    //     }else if( typeof arg1 === 'string' ) {
-    //         return sendMessage({
-    //             method: arg1,
-    //             params: arg2 as object
-    //         })
-    //     }else if (typeof arg2 === 'function'){
-    //             sendMessage(arg1 as RequestArguments).then(result => {
-    //                 (arg2 as (e?: any, r?: any) => any )(undefined, {
-    //                         id: (arg1 as RequestArguments)?.id,
-    //                         jsonrpc: '2.0',
-    //                         method: (arg1 as RequestArguments).method,
-    //                         result
-    //                       }
-    //                 )
-    //             }).catch( e => {
-    //                 (arg2 as (er?: any, r?: any) => any )(new Error(e), {
-    //                     id: (arg1 as RequestArguments)?.id,
-    //                     jsonrpc: '2.0',
-    //                     method: (arg1 as RequestArguments).method,
-    //                     error: new Error(e)
-    //                   }
-    //             )
-    //             })
-    //         } 
-    // }
-
     send (arg1: unknown, arg2: unknown): unknown {
         const resultFmt = async (result: Promise<any>) => {
             return {
@@ -360,6 +330,10 @@ class MetaMaskAPI {
 
 const eth = new Proxy( new MetaMaskAPI(), {
     deleteProperty: () => { return true },
+    // set(obj, prop, value) {
+    //     // Reflect.set(obj, prop, value);
+    //     return true;
+    //   }
 })
 
 const listner =  function(event: any) {
@@ -367,30 +341,31 @@ const listner =  function(event: any) {
     const eventData = event?.data
     const eventDataData = event?.data?.data
     const eventDataDataData = event?.data?.data?.data
+    const resId = eventData?.resId
+    const result = eventDataDataData?.result
     if (eventData?.type === "CLWALLET_PAGE") {
     try {
-        if(eventData?.error){
+        if(result?.error){
-            promResolvers.get(eventData.resId)?.reject(eventData);
+            promResolvers.get(resId).reject(result);
-            // console.info('Error: ', event?.data?.data)
         }else {
-            promResolvers.get(eventData.resId)?.resolve(eventDataData);
+            promResolvers.get(resId).resolve(result);
         }
-        promResolvers.delete(event.data.resId)
     } catch (e) {
         // console.error('Failed to connect resolve msg', e)
+        promResolvers.get(resId)?.reject({code: -32000, message: 'Failed to connect resolve msg', error: true });
     }
     } else if(eventData?.type === "CLWALLET_PAGE_LISTENER") {
         if((eventDataData?.listner ?? 'x') in listners ) {
             try {
                 const listnerName = eventDataData.listner as ('accountsChanged' | 'connect' | 'disconnect' | 'chainChanged')
                 if( listnerName === 'connect' && eventDataData) {
-                    (<any>eth).networkVersion = eventDataDataData?.chainId?.toString(10) ?? '137';
+                    (<any>eth).networkVersion = String(parseInt(eventDataDataData?.chainId ?? "0x89", 16));
                     (<any>eth).chainId = eventDataDataData?.chainId ?? '0x89';
                     (<any>eth).selectedAddress = eventDataData?.address?.[0] ?? null;
                     (<any>eth).accounts = [eventDataData.address?.[0]] ?? [];
                     (<any>eth).isConnected = () => true;
                 } else if( listnerName === 'chainChanged' ) {
-                    (<any>eth).networkVersion = eventDataData?.toString(10) ?? '137';
+                    (<any>eth).networkVersion = String(parseInt(eventDataDataData ?? "0x89", 16));
                     (<any>eth).chainId = eventDataData ?? '0x89';
                 } else if ( listnerName === 'accountsChanged' ) {
                     (<any>eth).accounts = [eventDataData?.[0]] ?? [];
@@ -407,11 +382,18 @@ const listner =  function(event: any) {
             }
         }   
     }
+    if(promResolvers.has(resId) && (eventData?.type === "CLWALLET_PAGE" || eventData?.type === "CLWALLET_PAGE_LISTENER")) {
+        promResolvers.delete(resId)
+    }
   }
 
 window.addEventListener("message",listner)
 
-
+Object.defineProperties(eth, {
+    selectedAddress: { enumerable: false },
+    chainId: { enumerable: false },
+    networkVersion: { enumerable: false },
+});
 
 const web3Shim = {
     currentProvider: eth,
@@ -438,7 +420,7 @@ loadEIP1193Provider(eth)
 // HELPERS TO CLONE METAMASK API
 
 // window.addEventListener("message" , (event) => {
-//     console.log('event', event)
+//     console.log('event', JSON.stringify(event?.data?.data, null, 2), JSON.stringify(event?.data, null, 2))
 // })
 
 // setTimeout(() => {
@@ -458,22 +440,26 @@ loadEIP1193Provider(eth)
 // }, 5000)
 
 // setTimeout(() => {
-//     // console.log('Metamask clone test');
+    // console.log('Metamask clone test');
-//     // (<any>window).ethereum.request({method: 'eth_requestAccounts', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'eth_requestAccounts', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum.request({method: 'eth_accounts', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'eth_accounts', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum.request({method: 'eth_chainId', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'eth_chainId', params: Array(0)}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum.request({method: 'wallet_requestPermissions', params: [{eth_accounts: {}}]}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'wallet_requestPermissions', params: [{eth_accounts: {}}]}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum.request({method: 'net_version', params: []}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'net_version', params: []}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum.request({method: 'wallet_switchEthereumChain', params: [{chainId: "0x89"}]}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'wallet_switchEthereumChain', params: [{chainId: "0x89"}]}).then((res: any) => { console.log(res, '111111111')});
-//     // (<any>window).ethereum2.request({method: 'wallet_switchEthereumChain', params: [{chainId: "0x89"}]}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum2.request({method: 'wallet_switchEthereumChain', params: [{chainId: "0x89"}]}).then((res: any) => { console.log(res, '111111111')});
-//     //    (<any>window).ethereum.on('connect', ((a: any, b: any) => console.log('connect', a, b)));
+    //    (<any>window).ethereum.on('connect', ((a: any, b: any) => console.log('connect', a, b)));
-//     // (<any>window).ethereum.on('accountsChanged', ((a: any, b: any) => console.log('accountsChanged', a, b)));
+    // (<any>window).ethereum.on('accountsChanged', ((a: any, b: any) => console.log('accountsChanged', a, b)));
-//     // (<any>window).ethereum.on('chainChanged', ((a: any) => console.log('chainChanged', a, typeof a)));
+    // (<any>window).ethereum.on('chainChanged', ((a: any) => console.log('chainChanged', a, typeof a)));
-//     // console.log((<any>window).ethereum.on('message', (a: any, b:any) => console.log(a,b)))
+    // console.log((<any>window).ethereum.on('message', (a: any, b:any) => console.log(a,b)))
-//     console.log((<any>window).ethereum.toString())
+    // console.dir((<any>window).ethereum);
+    // (<any>window).ethereum.request({method: 'net_version', params: []}).then((res: any) => { console.log(res, '111111111')});
+    // (<any>window).ethereum.request({method: 'eth_blockNumber', params:  Array(0)}).then((res: any) => { console.log(res, '2222222')});
+
     // console.log((<any>window).ethereum2.toString())
     // console.log((<any>window).ethereum.Symbold)
 
-// }, 3500)
+// }, 5500)
+
 
 // console.log( (window as any).ethereum.request({method: 'eth_chainId'}))

src/extension/listners.ts

@@ -2,10 +2,15 @@ import type { listnerType } from '@/extension/types'
 
 export const triggerListner = ( type: listnerType, listnerData: any ) => {
     const data = { type: "CLWALLET_EXT_LISTNER", data: { listner: type, data: listnerData } }
-    chrome.tabs.query({}, (tabs) => tabs.forEach( tab => 
+    chrome.tabs.query({}, (tabs) => tabs.forEach( async tab => 
         {   
             if (tab?.id) {
-                chrome.tabs.sendMessage(tab.id, data) 
+                try {
+                    await chrome.tabs.sendMessage(tab.id, data)
+                } catch
+                {
+                    // ignore
+                }
             }
         }
     ));

src/extension/manifest.json

@@ -3,8 +3,8 @@
     "name": "__MSG_appName__",
     "description": "__MSG_appDesc__",
     "default_locale": "en",
-    "version": "1.3.5",
+    "version": "1.3.6",
-    "version_name": "1.3.5",
+    "version_name": "1.3.6",
     "icons": {
       "16": "assets/extension-icon/wallet_16.png",
       "32": "assets/extension-icon/wallet_32.png",

src/extension/serviceWorker.ts

@@ -38,7 +38,9 @@ import {
 import type { RequestArguments } from '@/extension/types'
 import { rpcError } from '@/extension/rpcConstants'
 import { updatePrices } from '@/utils/gecko'
-import { mainNets, testNets } from '@/utils/networks'
+import { allTemplateNets } from '@/utils/networks'
+
+// const METAMAKS_EXTENSION_ID = 'nkbihfbeogaeaoehlefnkodbefgpgknn'
 
 let notificationUrl: string
 
@@ -155,8 +157,6 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
         return true
     }
  
-    console.info('main listener', message);
-
     (async () => {
         if (!(message?.method)) {
             sendResponse({
@@ -175,7 +175,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_call', e)
+                        console.warn('Error: eth_call', e)
                     }
                     break
                 }
@@ -196,7 +196,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.log('eth_getBlockByNumber', e)
+                        console.warn('Error: eth_getBlockByNumber', e)
                     }
                     break;
                 }
@@ -213,7 +213,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_getTransactionCount', e)
+                        console.warn('Error: eth_getTransactionCount', e)
                     }
                     break
                 }
@@ -226,7 +226,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_getTransactionByHash', e)
+                        console.warn('Error: eth_getTransactionByHash', e)
                     }
                     break
                 }
@@ -239,7 +239,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_getTransactionReceipt', e)
+                        console.warn('Error: eth_getTransactionReceipt', e)
                     }
                     break
                 }
@@ -252,7 +252,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_gasPrice', e)
+                        console.warn('Error: eth_gasPrice', e)
                     }
                     break;
                 }
@@ -267,7 +267,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_getBalance', e)
+                        console.warn('Error: eth_getBalance', e)
                     }
                     break
                 }
@@ -280,7 +280,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_getCode', e)
+                        console.warn('Error: eth_getCode', e)
                     }
                     break
                 }
@@ -293,7 +293,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             code: rpcError.USER_REJECTED,
                             message: 'No network or user selected'
                         })
-                        console.error('eth_blockNumber', e)
+                        console.warn('Error: eth_blockNumber', e)
                     }
                     break               
                 }
@@ -335,7 +335,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                         code: rpcError.USER_REJECTED,
                         message: 'No network or user selected'
                     })
-                    console.error('eth_estimateGas', err)
+                    console.warn('Error: eth_estimateGas', err)
                     }
                 }
                     break          
@@ -350,7 +350,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                         code: rpcError.USER_REJECTED,
                         message: 'No network or user selected'
                     })
-                    console.error('eth_accounts', e)
+                    console.warn('Error: eth_accounts', e)
                 }
                 break
                 }
@@ -365,7 +365,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                         code: rpcError.USER_REJECTED,
                         message: 'No network or user selected'
                     })
-                    console.error('eth_chainId', e)
+                    console.warn('Error: eth_chainId', e)
                 }
                 break
                 }
@@ -478,7 +478,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                             } as any)
                         }
                         } catch(err) {
-                            // console.log(err)
+                            console.warn('Error: eth_sendTransaction', err)
                             sendResponse({
                                 error: true,
                                 code: rpcError.USER_REJECTED,
@@ -545,7 +545,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                       clearPk()
                     }
                     } catch (e) {
-                        // console.info(e)
+                        console.warn('Error: signTypedData', e)
                         sendResponse({
                             error: true,
                             code: rpcError.USER_REJECTED,
@@ -599,7 +599,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                 }
                 case 'net_version': {
                     const network = await getSelectedNetwork()
-                    const chainId = network?.chainId ?? 0
+                    const chainId = String(network?.chainId ?? 1)
                     sendResponse(chainId)
                     break
                 }
@@ -634,7 +634,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                 }
                 case 'wallet_addEthereumChain': {
                     const userNetworks = await getNetworks()
-                    const networks = {...mainNets, ...testNets, ...userNetworks}
+                    const networks = {...allTemplateNets, ...userNetworks}
                     const chainId = Number(message?.params?.[0]?.chainId ?? '0')
                     if(!chainId) {
                         sendResponse({
@@ -693,7 +693,8 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                     const [network, account] = await Promise.all([pNetwork, pAccount])
                     const address = account?.address ? [account?.address] : []
                     const chainId = `0x${(network?.chainId ?? 0).toString(16)}`
-                    const data = { type: "CLWALLET_PAGE_LISTENER", data: {
+                    const data = { 
+                        type: "CLWALLET_PAGE_LISTENER", data: {
                         listner: 'connect',
                         data: {
                             chainId
@@ -743,6 +744,7 @@ const mainListner = (message: RequestArguments, sender:any, sendResponse: (a: an
                 }
             }
         }
+ 
     }
     )();
     return true;

src/utils/networks.ts

@@ -68,57 +68,66 @@ export const mainNets: {[key: number]: Network} = {
 }
 
 export const testNets = {
-    5: {
+    11155111: {
-        name: 'TESTNET Ethereum Goerli',
+        name: 'TESTNET Ethereum Sepolia',
-        rpc: 'https://rpc.ankr.com/eth_goerli',
+        rpc: 'https://ethereum-sepolia-rpc.publicnode.com',
-        chainId: 5,
+        chainId: 11155111,
-        explorer: 'https://goerli.etherscan.io',
+        explorer: 'https://sepolia.etherscan.io',
-        icon: 'eth.webp'
+        icon: 'eth_t.webp'
     },
-    4: {
+    84532: {
-        name: 'TESTNET Ethereum Rinkeby',
+        name: 'TESTNET Base Sepolia',
-        rpc: 'https://rpc.ankr.com/eth_rinkeby',
+        rpc: 'https://sepolia.base.org',
-        chainId: 4,
+        chainId: 84532,
-        explorer: 'https://rinkeby.etherscan.io',
+        explorer: 'https://sepolia.basescan.org/',
-        icon: 'eth.webp'
+        icon: 'base_t.webp'
     },
-    80001: {
+    80002: {
-        name: 'TESTNET Polygon',
+        name: 'TESTNET Polygon Amoy',
-        rpc: 'https://rpc.ankr.com/polygon_mumbai',
+        rpc: 'https://rpc-amoy.polygon.technology',
-        chainId: 80001,
+        chainId: 80002,
-        explorer: 'https://mumbai.polygonscan.com',
+        explorer: 'https://oklink.com/amoy',
-        icon:'polygon.webp'
+        icon:'polygon_t.webp'
     },
-    100100: {
+    100200: {
         name: 'TESTNET Gnosis Chiado',
-        rpc: 'https://gnosis-mainnet.public.blastapi.io',
+        rpc: 'https://rpc.chiadochain.net',
-        chainId: 100100,
+        chainId: 100200,
-        explorer: '',
+        explorer: 'https://gnosis-chiado.blockscout.com',
-        icon:'xdai.webp'
+        icon:'xdai_t.webp'
     },
     420: {
         name: 'TESTNET Optimism Goreli',
         rpc: 'https://goerli.optimism.io/',
         chainId: 420,
         explorer: 'https://goerli.etherscan.io',
-        icon: 'optimism.webp'
+        icon: 'optimism_t.webp'
+    },
+    11155420 : {
+        name: 'TESTNET Optimism Sepolia',
+        rpc: 'https://sepolia.optimism.io',
+        chainId: 11155420 ,
+        explorer: 'https://sepolia-optimistic.etherscan.io/',
+        icon: 'optimism_t.webp'
     },
     97: {
         name: 'TESTNET BSC',
         rpc: 'https://bsctestapi.terminet.io/rpc',
         chainId: 97,
         explorer: 'https://testnet.bscscan.com',
-        icon: 'binance.webp'
+        icon: 'binance_t.webp'
     },
-    421613: {
+    421614: {
-        name: 'TESTNET Arbitrum One',
+        name: 'TESTNET Arbitrum Sepolia',
-        rpc: 'https://goerli-rollup.arbitrum.io/rpc/',
+        rpc: 'https://sepolia-rollup.arbitrum.io/rpc',
-        chainId: 421613,
+        chainId: 421614,
-        explorer: 'https://testnet.arbiscan.io',
+        explorer: 'https://sepolia.arbiscan.io/',
-        icon: 'arbitrum.webp'
+        icon: 'arbitrum_t.webp'
     },
 }
 
+export const allTemplateNets = {...mainNets, ...testNets}
+
 export const chainIdToPriceId = (chainId: number): string => {
     return mainNets?.[chainId]?.priceId ?? 'x'
 }

src/utils/wallet.ts

@@ -36,15 +36,15 @@ export const signTypedData = async (msg: string) => {
     const account = await getSelectedAccount()
     const wallet = new ethers.Wallet(account.pk)
     const parsedMsg = JSON.parse(msg)
-    if(parsedMsg?.primaryType) {
+    const types = {} as Record<string, any>
-        if(parsedMsg.primaryType in parsedMsg.types){
+    for (const key in parsedMsg.types) {
-            parsedMsg.types = {
+        if (key !== 'EIP712Domain') {
-                [parsedMsg.primaryType]: parsedMsg.types[parsedMsg.primaryType]
+            types[key] = parsedMsg.types[key]
         }
     }
-    }
+    parsedMsg.types = types
-
+    const args = [parsedMsg.domain, parsedMsg.types, parsedMsg.message]
-    return await wallet.signTypedData(parsedMsg.domain, parsedMsg.types, parsedMsg.message)
+    return await wallet.signTypedData(args[0], args[1], args[2])
 }
 
 export const getBalance = async () =>{

src/views/AssetsTab.vue

@@ -47,7 +47,7 @@
               <ion-item v-for="token of ethTokens" :key="token.address">
                 <ion-avatar
                   v-if="token?.image"
-                  style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                  style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                 >
                   <img
                     :alt="token?.name"
@@ -71,7 +71,7 @@
               <ion-item v-for="token of polyTokens" :key="token.address">
                 <ion-avatar
                   v-if="token?.image"
-                  style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                  style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                 >
                   <img
                     :alt="token?.name"
@@ -96,7 +96,7 @@
               <ion-item v-for="nft of ethNfts" :key="nft.address">
                 <ion-avatar
                   v-if="nft?.imageURI"
-                  style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                  style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                 >
                   <img
                     :alt="nft?.collectionName"
@@ -120,7 +120,7 @@
               <ion-item v-for="nft of polyNfts" :key="nft.address">
                 <ion-avatar
                   v-if="nft?.imageURI"
-                  style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                  style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                 >
                   <img
                     :alt="nft?.collectionName"
@@ -144,7 +144,7 @@
             <ion-item v-for="nft of poaps" :key="nft.eventId">
               <ion-avatar
                 v-if="nft?.image"
-                style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
               >
                 <img
                   :alt="nft?.title"

src/views/ContractError.vue

@@ -12,12 +12,12 @@
       >
       <ion-item>
         <ion-avatar
-          v-if="(mainNets as any)[selectedNetwork?.chainId]?.icon"
+          v-if="(allTemplateNets as any)[selectedNetwork?.chainId]?.icon"
-          style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+          style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
         >
           <img
             :alt="selectedNetwork?.name"
-            :src="getUrl('assets/chain-icons/' + (mainNets as any)[selectedNetwork?.chainId]?.icon)"
+            :src="getUrl('assets/chain-icons/' + (allTemplateNets as any)[selectedNetwork?.chainId]?.icon)"
           />
         </ion-avatar>
         <ion-label>Network ID: {{ selectedNetwork?.chainId }}</ion-label>
@@ -75,7 +75,7 @@ import {
 import { useRoute } from "vue-router";
 import { getSelectedNetwork, getUrl, hexTostr } from "@/utils/platform";
 import type { Network } from "@/extension/types";
-import { mainNets } from "@/utils/networks";
+import { allTemplateNets } from "@/utils/networks";
 
 export default defineComponent({
   components: {
@@ -112,7 +112,7 @@ export default defineComponent({
       contract,
       loading,
       selectedNetwork,
-      mainNets,
+      allTemplateNets,
       getUrl,
       error,
     };

src/views/HomeTab.vue

@@ -4,7 +4,7 @@
       <ion-toolbar>
         <ion-title>
           <ion-avatar
-            style="margin: 0.3rem; width: 1.8rem; height: 1.8rem; display: inline-flex"
+            style="margin: 0.3rem; width: 1.6rem; height: 1.6rem; display: inline-flex"
           >
             <img alt="clw" :src="getUrl('assets/extension-icon/wallet_32.png')" />
           </ion-avatar>
@@ -71,11 +71,15 @@
                 )
               )
             "
+            class="ion-text-wrap"
             expand="block"
             style="margin: auto; width: 98%; font-size: 0.8rem; padding: 0.6rem"
             >View Address on
             {{
-              `${selectedNetwork.explorer}`.replace("https://", "").replace("http://", "")
+              `${selectedNetwork.explorer}`
+                .replace("https://", "")
+                .replace("http://", "")
+                .replace(/\/.*/, "")
             }}
           </ion-button>
         </ion-item>
@@ -84,14 +88,14 @@
         <ion-label>No EVM Networks found</ion-label>
         <ion-button @click="goToAddNetwork">Add Network</ion-button>
       </ion-item>
-      <ion-item v-else>
+      <ion-item style="font-size: 0.86rem" v-else>
         <ion-avatar
-          v-if="(mainNets as any)[selectedNetwork?.chainId]?.icon"
+          v-if="(allTemplateNets as any)[selectedNetwork?.chainId]?.icon"
-          style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+          style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
         >
           <img
             :alt="selectedNetwork?.name"
-            :src="getUrl('assets/chain-icons/' + (mainNets as any)[selectedNetwork?.chainId]?.icon)"
+            :src="getUrl('assets/chain-icons/' + (allTemplateNets as any)[selectedNetwork?.chainId]?.icon)"
           />
         </ion-avatar>
         <ion-label
@@ -277,7 +281,7 @@ import {
   getVersion,
 } from "@/utils/platform";
 import type { Network, Account, Networks } from "@/extension/types";
-import { mainNets } from "@/utils/networks";
+import { allTemplateNets } from "@/utils/networks";
 import router from "@/router";
 import { triggerListner } from "@/extension/listners";
 import { copyOutline } from "ionicons/icons";
@@ -405,7 +409,7 @@ export default defineComponent({
       toastState,
       getToastRef,
       networksModal,
-      mainNets,
+      allTemplateNets,
       getUrl,
       openTab,
       settings,

src/views/NetworksTab.vue

@@ -22,12 +22,12 @@
       <ion-list v-for="network of networks" :key="network.chainId">
         <ion-item>
           <ion-avatar
-            v-if="(mainNets as any)[network.chainId]?.icon"
+            v-if="(allTemplateNets as any)[network.chainId]?.icon"
-            style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+            style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
           >
             <img
               :alt="network.name"
-              :src="getUrl('assets/chain-icons/' + (mainNets as any)[network.chainId].icon)"
+              :src="getUrl('assets/chain-icons/' + (allTemplateNets as any)[network.chainId].icon)"
             />
           </ion-avatar>
           <ion-label>
@@ -63,7 +63,7 @@ import {
   onIonViewWillEnter,
   IonAvatar,
 } from "@ionic/vue";
-import { mainNets } from "@/utils/networks";
+import { allTemplateNets } from "@/utils/networks";
 import { addCircleOutline, copyOutline } from "ionicons/icons";
 import router from "@/router/index";
 import type { Networks } from "@/extension/types";
@@ -126,7 +126,7 @@ export default defineComponent({
       copyText,
       getToastRef,
       getUrl,
-      mainNets,
+      allTemplateNets,
       deleteNetwork,
       editNetwork,
       loading,

src/views/RequestNetwork.vue

@@ -112,7 +112,6 @@ import {
 import { useRoute } from "vue-router";
 import { getUrl, saveSelectedNetwork, saveNetwork, hexTostr } from "@/utils/platform";
 import type { Network } from "@/extension/types";
-import { mainNets, testNets } from "@/utils/networks";
 import { approve, walletPing } from "@/extension/userRequest";
 import { triggerListner } from "@/extension/listners";
 
@@ -137,7 +136,6 @@ export default defineComponent({
     const rid = (route?.params?.rid as string) ?? "";
     const networkData = hexTostr((route.params?.param as string) ?? "");
     const alertOpen = ref(false);
-    const templateNetworks = Object.assign({}, mainNets, testNets) ?? {};
     const timerReject = ref(140);
     let interval: any;
     const website = ref("");
@@ -208,7 +206,6 @@ export default defineComponent({
       onCancel,
       alertOpen,
       loading,
-      templateNetworks,
       getUrl,
       onAddSwitch,
       timerReject,

src/views/SendToken.vue

@@ -198,9 +198,15 @@ export default defineComponent({
     // };
 
     onIonViewWillEnter(async () => {
+      try {
         selectedNetwork.value = await getSelectedNetwork();
         selectedAccount.value = await getSelectedAccount();
         currentBalance.value = Number(formatEther((await getBalance()).toString()));
+      } catch (e) {
+        alertOpen.value = true;
+        alertMsg.value =
+          "Error getting network & balance Internet or RPC or blockchain may be down";
+      }
       loading.value = false;
     });
 

src/views/SignTx.vue

@@ -12,12 +12,12 @@
       >
       <ion-item>
         <ion-avatar
-          v-if="(mainNets as any)[selectedNetwork?.chainId]?.icon"
+          v-if="(allTemplateNets as any)[selectedNetwork?.chainId]?.icon"
-          style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+          style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
         >
           <img
             :alt="selectedNetwork?.name"
-            :src="getUrl('assets/chain-icons/' + (mainNets as any)[selectedNetwork?.chainId]?.icon)"
+            :src="getUrl('assets/chain-icons/' + (allTemplateNets as any)[selectedNetwork?.chainId]?.icon)"
           />
         </ion-avatar>
         <ion-label>Network ID: {{ selectedNetwork?.chainId }}</ion-label>
@@ -201,7 +201,7 @@ import {
 } from "@/utils/platform";
 import { getBalance, getGasPrice, estimateGas } from "@/utils/wallet";
 import type { Network } from "@/extension/types";
-import { mainNets, chainIdToPriceId } from "@/utils/networks";
+import { allTemplateNets, chainIdToPriceId } from "@/utils/networks";
 import UnlockModal from "@/views/UnlockModal.vue";
 import router from "@/router";
 
@@ -424,7 +424,7 @@ export default defineComponent({
       bars,
       loading,
       selectedNetwork,
-      mainNets,
+      allTemplateNets,
       getUrl,
       setGasLimit,
       setGasPrice,

src/views/SwitchNetwork.vue

@@ -20,12 +20,12 @@
                 <ion-item>Network Name: {{ selectedNetwork?.name }}</ion-item>
                 <ion-item>
                   <ion-avatar
-                    v-if="(templateNetworks as any)[selectedNetwork?.chainId]?.icon"
+                    v-if="(allTemplateNets as any)[selectedNetwork?.chainId]?.icon"
-                    style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                    style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                   >
                     <img
                       :alt="selectedNetwork?.name"
-                      :src="getUrl('assets/chain-icons/' + (templateNetworks as any)[selectedNetwork?.chainId]?.icon)"
+                      :src="getUrl('assets/chain-icons/' + (allTemplateNets as any)[selectedNetwork?.chainId]?.icon)"
                     />
                   </ion-avatar>
                   <ion-label>Network ID: {{ selectedNetwork?.chainId }}</ion-label>
@@ -42,7 +42,7 @@
                 <ion-item>
                   <ion-avatar
                     v-if="(existingNetworks as any)[networkId]?.icon"
-                    style="margin-right: 1rem; width: 1.8rem; height: 1.8rem"
+                    style="margin-right: 1rem; width: 1.6rem; height: 1.6rem"
                   >
                     <img
                       :alt="(existingNetworks as any)[networkId]?.name"
@@ -132,7 +132,7 @@ import {
   numToHexStr,
 } from "@/utils/platform";
 import type { Network, Networks } from "@/extension/types";
-import { mainNets, testNets } from "@/utils/networks";
+import { allTemplateNets } from "@/utils/networks";
 import { approve, walletPing } from "@/extension/userRequest";
 import { triggerListner } from "@/extension/listners";
 
@@ -162,7 +162,6 @@ export default defineComponent({
     const alertMsg = ref("");
     const networkCase = ref("");
     let pnetworks: Promise<Networks>;
-    const templateNetworks = Object.assign({}, mainNets, testNets) ?? {};
     const addChainUrl = `${chainListPage}${networkId.value}`;
     const timerReject = ref(140);
     let interval: any;
@@ -186,8 +185,8 @@ export default defineComponent({
       existingNetworks.value = await pnetworks;
       if ((networkId.value ?? "0") in existingNetworks.value ?? {}) {
         networkCase.value = "exists";
-      } else if ((networkId.value ?? "0") in templateNetworks) {
+      } else if ((networkId.value ?? "0") in allTemplateNets) {
-        existingNetworks.value = templateNetworks;
+        existingNetworks.value = allTemplateNets;
         networkCase.value = "inTemplates";
       } else {
         networkCase.value = "doesNotExist";
@@ -217,9 +216,10 @@ export default defineComponent({
 
     const onSwitchTemplates = async () => {
       loading.value = true;
-      selectedNetwork.value = templateNetworks[Number(networkId.value)];
+      const nId = Number(networkId.value) as keyof typeof allTemplateNets;
-      await saveNetwork(templateNetworks[Number(networkId.value)]);
+      selectedNetwork.value = allTemplateNets[nId];
-      await saveSelectedNetwork(templateNetworks[Number(networkId.value)]);
+      await saveNetwork(allTemplateNets[nId]);
+      await saveSelectedNetwork(allTemplateNets[nId]);
       triggerListner("chainChanged", numToHexStr(selectedNetwork.value?.chainId ?? 0));
       approve(rid);
       loading.value = false;
@@ -240,7 +240,7 @@ export default defineComponent({
       loading,
       networkCase,
       selectedNetwork,
-      templateNetworks,
+      allTemplateNets,
       getUrl,
       onSwitchTemplates,
       onSwitchNotExisting,

src/views/UnlockModal.vue

@@ -2,10 +2,10 @@
   <ion-page>
     <ion-header>
       <ion-toolbar>
-        <ion-buttons slot="start">
-          <ion-button @click="close">Close</ion-button>
-        </ion-buttons>
         <ion-title>Unlock to Proceed</ion-title>
+        <ion-buttons slot="end">
+          <ion-button @click="close" color="primary">Close</ion-button>
+        </ion-buttons>
       </ion-toolbar>
     </ion-header>
 
@@ -30,10 +30,30 @@
         <ion-item>
           <ion-label>Unlock Password</ion-label>
         </ion-item>
+        <ion-list>
           <ion-item>
-          <ion-input aria-label="password" v-model="mpPass" type="password"></ion-input>
+            <ion-input
+              aria-label="password"
+              placeholder=""
+              class="password-input"
+              type="password"
+              @ion-input="mpPass = String($event.target.value)"
+              fill="solid"
+              ref="ionInput"
+            ></ion-input>
+
+            <!-- <ion-input
+            label="Password"
+            label-placement="floating"
+            fill="outline"
+            placeholder=""
+            type="password"
+            ref="ionInput"
+            @ion-input="mpPass = String($event.target.value)"
+          ></ion-input> -->
           </ion-item>
         </ion-list>
+      </ion-list>
       <ion-item>
         <ion-button @click="unlock">Confirm</ion-button>
       </ion-item>
@@ -57,7 +77,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "vue";
+import { defineComponent, ref, onMounted } from "vue";
 import {
   IonContent,
   IonHeader,
@@ -133,6 +153,14 @@ export default defineComponent({
       }
     };
 
+    onMounted(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 150));
+      const el = document?.querySelector(
+        ".password-input .native-input"
+      ) as HTMLInputElement;
+      el?.focus?.();
+    });
+
     return {
       loading,
       unlock,

yarn.lock

@@ -7,10 +7,10 @@
   resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
   integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
 
-"@adraffy/ens-normalize@1.9.2":
+"@adraffy/ens-normalize@1.10.1":
-  version "1.9.2"
+  version "1.10.1"
-  resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.9.2.tgz#60111a5d9db45b2e5cbb6231b0bb8d97e8659316"
+  resolved "https://registry.npmjs.org/@adraffy/ens-normalize/-/ens-normalize-1.10.1.tgz#63430d04bd8c5e74f8d7d049338f1cd9d4f02069"
-  integrity sha512-0h+FrQDqe2Wn+IIGFkTCd4aAwTJ+7834Ek1COohCyV26AXhwQ7WQaz+4F/nLOeVl/3BtWHOHLPsq46V8YB46Eg==
+  integrity sha512-96Z2IP3mYmF1Xg2cDm8f1gWGf/HUVedQ3FMifV4kG/PQ4yEP51xDtRAEfhVNt5f/uzpNkZHwWQuUcu6D6K+Ekw==
 
 "@ampproject/remapping@^2.1.0":
   version "2.2.0"
@@ -1115,15 +1115,17 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
-"@noble/hashes@1.1.2":
+"@noble/curves@1.2.0":
-  version "1.1.2"
+  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.1.2.tgz#e9e035b9b166ca0af657a7848eb2718f0f22f183"
+  resolved "https://registry.npmjs.org/@noble/curves/-/curves-1.2.0.tgz#92d7e12e4e49b23105a2555c6984d41733d65c35"
-  integrity sha512-KYRCASVTv6aeUi1tsF8/vpyR7zpfs3FUzy2Jqm+MU+LmUKhQ0y2FpfwqkCcxSg2ua4GALJd8k2R76WxwZGbQpA==
+  integrity sha512-oYclrNgRaM9SsBUBVbb8M6DTV7ZHRTKugureoYEncY5c65HOmRzvSiTE3y5CYaPYJA/GVkrhXEoF0M3Ya9PMnw==
+  dependencies:
+    "@noble/hashes" "1.3.2"
 
-"@noble/secp256k1@1.7.1":
+"@noble/hashes@1.3.2":
-  version "1.7.1"
+  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/@noble/secp256k1/-/secp256k1-1.7.1.tgz#b251c70f824ce3ca7f8dc3df08d58f005cc0507c"
+  resolved "https://registry.npmjs.org/@noble/hashes/-/hashes-1.3.2.tgz#6f26dbc8fbc7205873ce3cee2f690eba0d421b39"
-  integrity sha512-hOUk6AyBFmqVrv7k5WAw/LpszxVbj9gGN4JRkIX52fdFAj1UA61KXmZDvqVEm+pOyec3+fIeZB02LYa/pWOArw==
+  integrity sha512-MVC8EAQp7MvEcm30KWENFjgR+Mkmf+D189XJTkFIlwohU5hcBbn1ZkKq7KVTi2Hme3PMGF390DaL52beVrIihQ==
 
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
@@ -2717,14 +2719,14 @@ esutils@^2.0.2:
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
   integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
 
-ethers@^6.7.0:
+ethers@^6.11.1:
-  version "6.7.0"
+  version "6.11.1"
-  resolved "https://registry.yarnpkg.com/ethers/-/ethers-6.7.0.tgz#0f772c31a9450de28aa518b181c8cb269bbe7fd1"
+  resolved "https://registry.npmjs.org/ethers/-/ethers-6.11.1.tgz#96aae00b627c2e35f9b0a4d65c7ab658259ee6af"
-  integrity sha512-pxt5hK82RNwcTX2gOZP81t6qVPVspnkpeivwEgQuK9XUvbNtghBnT8GNIb/gPh+WnVSfi8cXC9XlfT8sqc6D6w==
+  integrity sha512-mxTAE6wqJQAbp5QAe/+o+rXOID7Nw91OZXvgpjDa1r4fAbq2Nu314oEZSbjoRLacuCzs7kUC3clEvkCQowffGg==
   dependencies:
-    "@adraffy/ens-normalize" "1.9.2"
+    "@adraffy/ens-normalize" "1.10.1"
-    "@noble/hashes" "1.1.2"
+    "@noble/curves" "1.2.0"
-    "@noble/secp256k1" "1.7.1"
+    "@noble/hashes" "1.3.2"
     "@types/node" "18.15.13"
     aes-js "4.0.0-beta.5"
     tslib "2.4.0"