Fix svg and url handiling

Author: lnbc1QWFyb24

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/core",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "scripts": {
     "build": "rollup -c",
     "dev": "rollup -c -w",

packages/core/src/utils.ts

@@ -36,14 +36,6 @@ export function validEnsChain(chainId: ChainId): boolean {
   }
 }
 
-export function isUrl(str: string): boolean {
-  let url
-
-  try {
-    url = new URL(str)
-  } catch (_) {
-    return false
-  }
-
-  return url.protocol === 'http:' || url.protocol === 'https:'
+export function isSVG(str: string): boolean {
+  return str.includes('<svg')
 }

packages/core/src/views/connect/Sidebar.svelte

@@ -4,7 +4,7 @@
   import { internalState$ } from '../../streams'
   import en from '../../i18n/en.json'
   import type { i18n } from '../../types'
-  import { isUrl } from '../../utils'
+  import { isSVG } from '../../utils'
 
   export let step: keyof i18n['connect']
 
@@ -111,10 +111,10 @@
   <div class="inner-container">
     <div class="icon-container">
       {#if logo || icon}
-        {#if isUrl(logo || icon)}
-          <img height="100%" src={logo || icon} alt="logo" />
-        {:else}
+        {#if isSVG(logo || icon)}
           {@html logo || icon}
+        {:else}
+          <img height="100%" src={logo || icon} alt="logo" />
         {/if}
       {:else}
         {@html blocknative}

packages/core/src/views/shared/WalletAppBadge.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { fade } from 'svelte/transition'
-  import { isUrl } from '../../utils'
+  import { isSVG } from '../../utils'
   import Spinner from './Spinner.svelte'
   export let size: number // px
   export let icon: Promise<string> | string // svg string or url string
@@ -150,12 +150,12 @@
       <div class="placeholder-icon" />
     {:then iconLoaded}
       <div in:fade class="icon">
-        {#if isUrl(iconLoaded)}
-          <!-- load img url -->
-          <img height="100%" src={iconLoaded} alt="logo" />
-        {:else}
+        {#if isSVG(iconLoaded)}
           <!-- render svg string -->
           {@html iconLoaded}
+        {:else}
+          <!-- load img url -->
+          <img height="100%" src={iconLoaded} alt="logo" />
         {/if}
       </div>
     {/await}

packages/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/react",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Collection of React Hooks for web3-onboard",
   "module": "dist/index.js",
   "browser": "dist/index.js",
@@ -22,7 +22,7 @@
   },
   "dependencies": {
     "@web3-onboard/common": "^2.0.1",
-    "@web3-onboard/core": "^2.0.2"
+    "@web3-onboard/core": "^2.0.3"
   },
   "peerDependencies": {
     "react": "^17.0.2"