@web3modal/scaffold - npm Package Compare versions

Comparing version 3.0.0-alpha.5 to 3.0.0-b284aa83

dist/esm/index.js

@@ -0,2 +1,6 @@
+export * from './src/modal/w3m-account-button/index.js';
+export * from './src/modal/w3m-button/index.js';
+export * from './src/modal/w3m-connect-button/index.js';
 export * from './src/modal/w3m-modal/index.js';
+export * from './src/modal/w3m-network-button/index.js';
 export * from './src/modal/w3m-router/index.js';
@@ -22,3 +26,2 @@ export * from './src/views/w3m-account-view/index.js';
 export * from './src/partials/w3m-connecting-wc-web/index.js';
-export * from './src/partials/w3m-connecting-widget/index.js';
 export * from './src/partials/w3m-header/index.js';
@@ -25,0 +28,0 @@ export * from './src/partials/w3m-help-widget/index.js';

dist/esm/src/client.js

@@ -76,6 +76,9 @@ import { AccountController, ApiController, BlockchainApiController, ConnectionController, ConnectorController, CoreHelperUtil, ModalController, NetworkController, OptionsController, ThemeController } from '@web3modal/core';
         NetworkController.setClient(options.networkControllerClient);
-        ConnectionController.setClient(options.connectionControllerClient);
+        NetworkController.setDefaultCaipNetwork(options.defaultChain);
         OptionsController.setProjectId(options.projectId);
         OptionsController.setIncludeWalletIds(options.includeWalletIds);
         OptionsController.setExcludeWalletIds(options.excludeWalletIds);
+        OptionsController.setFeaturedWalletIds(options.featuredWalletIds);
+        OptionsController.setTokens(options.tokens);
+        ConnectionController.setClient(options.connectionControllerClient);
         ApiController.setSdkVersion(options._sdkVersion);
@@ -88,5 +91,2 @@ if (options.themeMode) {
         }
-        if (options.defaultChain) {
-            NetworkController.setDefaultCaipNetwork(options.defaultChain);
-        }
     }
@@ -93,0 +93,0 @@ async initOrContinue() {

dist/esm/src/modal/w3m-modal/index.js

@@ -8,2 +8,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 import { ApiController, ModalController, SnackController, ThemeController } from '@web3modal/core';
+import { UiHelperUtil, initializeTheming } from '@web3modal/ui';
 import { LitElement, html } from 'lit';
@@ -13,3 +14,2 @@ import { customElement, state } from 'lit/decorators.js';
 import styles from './styles.js';
-import { UiHelperUtil, initializeTheming } from '@web3modal/ui';
 const SCROLL_LOCK = 'scroll-lock';
@@ -23,5 +23,3 @@ let W3mModal = class W3mModal extends LitElement {
         this.initializeTheming();
-        ApiController.fetchRecommendedWallets();
-        ApiController.fetchNetworkImages();
-        ApiController.fetchConnectorImages();
+        ApiController.prefetch();
         this.unsubscribe.push(ModalController.subscribeKey('open', val => (val ? this.onOpen() : this.onClose())));
@@ -28,0 +26,0 @@ }

dist/esm/src/partials/w3m-all-wallets-list/index.js

@@ -22,5 +22,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
         this.recommended = ApiController.state.recommended;
+        this.featured = ApiController.state.featured;
         this.unsubscribe.push(...[
             ApiController.subscribeKey('wallets', val => (this.wallets = val)),
-            ApiController.subscribeKey('recommended', val => (this.recommended = val))
+            ApiController.subscribeKey('recommended', val => (this.recommended = val)),
+            ApiController.subscribeKey('featured', val => (this.featured = val))
         ]);
@@ -67,3 +69,3 @@ }
         const { walletImages } = AssetController.state;
-        const wallets = [...this.recommended, ...this.wallets];
+        const wallets = [...this.featured, ...this.recommended, ...this.wallets];
         return wallets.map(wallet => html `
@@ -79,4 +81,4 @@ <wui-card-select
     paginationLoaderTemplate() {
-        const { wallets, recommended, count } = ApiController.state;
-        if (count === 0 || [...wallets, ...recommended].length < count) {
+        const { wallets, recommended, featured, count } = ApiController.state;
+        if (count === 0 || [...featured, ...wallets, ...recommended].length < count) {
             return this.shimmerTemplate(4, PAGINATOR_ID);
@@ -121,2 +123,5 @@ }
 ], W3mAllWalletsList.prototype, "recommended", void 0);
+__decorate([
+    state()
+], W3mAllWalletsList.prototype, "featured", void 0);
 W3mAllWalletsList = __decorate([
@@ -123,0 +128,0 @@ customElement('w3m-all-wallets-list')

dist/esm/src/partials/w3m-connecting-wc-desktop/index.js

@@ -7,33 +7,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetUtil, ConnectionController, CoreHelperUtil } from '@web3modal/core';
-import { html } from 'lit';
+import { ConnectionController, CoreHelperUtil } from '@web3modal/core';
 import { customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-let W3mConnectingWcDesktop = class W3mConnectingWcDesktop extends WcConnectingLitElement {
-    render() {
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+let W3mConnectingWcDesktop = class W3mConnectingWcDesktop extends W3mConnectingWidget {
+    constructor() {
+        super();
         if (!this.wallet) {
             throw new Error('w3m-connecting-wc-desktop: No wallet provided');
         }
-        this.isReady();
-        return html `
-      <w3m-connecting-widget
-        imageSrc=${ifDefined(AssetUtil.getWalletImage(this.wallet.image_id))}
-        name=${this.wallet.name}
-        .error=${Boolean(this.error)}
-        .onConnect=${this.onConnect.bind(this)}
-        .onCopyUri=${this.onCopyUri.bind(this)}
-        .autoConnect=${false}
-      ></w3m-connecting-widget>
-    `;
+        this.onConnect = this.onConnectProxy.bind(this);
+        this.onRender = this.onRenderProxy.bind(this);
     }
-    isReady() {
+    onRenderProxy() {
         if (!this.ready && this.uri) {
+            this.ready = true;
             this.timeout = setTimeout(() => {
-                this.ready = true;
-                this.onConnect();
+                this.onConnect?.();
             }, 250);
         }
     }
-    onConnect() {
+    onConnectProxy() {
         if (this.wallet?.desktop_link && this.uri) {
@@ -40,0 +30,0 @@ try {

dist/esm/src/partials/w3m-connecting-wc-injected/index.js

@@ -7,25 +7,18 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetUtil, ConnectionController, ModalController } from '@web3modal/core';
-import { html } from 'lit';
+import { ConnectionController, ModalController } from '@web3modal/core';
 import { customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-let W3mConnectingWcInjected = class W3mConnectingWcInjected extends WcConnectingLitElement {
-    render() {
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+let W3mConnectingWcInjected = class W3mConnectingWcInjected extends W3mConnectingWidget {
+    constructor() {
+        super();
         if (!this.wallet) {
             throw new Error('w3m-connecting-wc-injected: No wallet provided');
         }
-        return html `
-      <w3m-connecting-widget
-        name=${this.wallet.name}
-        imageSrc=${ifDefined(AssetUtil.getWalletImage(this.wallet.image_id))}
-        .error=${Boolean(this.error)}
-        .onConnect=${this.onConnect.bind(this)}
-      ></w3m-connecting-widget>
-    `;
+        this.onConnect = this.onConnectProxy.bind(this);
+        this.onAutoConnect = this.onConnectProxy.bind(this);
     }
-    async onConnect() {
+    async onConnectProxy() {
         try {
             this.error = false;
-            await ConnectionController.connectInjected();
+            await ConnectionController.connectExternal('injected');
             ModalController.close();
@@ -32,0 +25,0 @@ }

dist/esm/src/partials/w3m-connecting-wc-mobile/index.js

@@ -7,11 +7,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetUtil, ConnectionController, CoreHelperUtil } from '@web3modal/core';
-import { html } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-let W3mConnectingWcMobile = class W3mConnectingWcMobile extends WcConnectingLitElement {
+import { ConnectionController, CoreHelperUtil } from '@web3modal/core';
+import { customElement } from 'lit/decorators.js';
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+let W3mConnectingWcMobile = class W3mConnectingWcMobile extends W3mConnectingWidget {
     constructor() {
         super();
-        this.buffering = false;
+        if (!this.wallet) {
+            throw new Error('w3m-connecting-wc-mobile: No wallet provided');
+        }
+        this.onConnect = this.onConnectProxy.bind(this);
+        this.onRender = this.onRenderProxy.bind(this);
         document.addEventListener('visibilitychange', this.onBuffering.bind(this));
@@ -23,26 +25,9 @@ }
     }
-    render() {
-        if (!this.wallet) {
-            throw new Error('w3m-connecting-wc-mobile: No wallet provided');
-        }
-        this.isReady();
-        return html `
-      <w3m-connecting-widget
-        name=${this.wallet.name}
-        imageSrc=${ifDefined(AssetUtil.getWalletImage(this.wallet.image_id))}
-        .buffering=${this.buffering}
-        .error=${Boolean(this.error)}
-        .onConnect=${this.onConnect.bind(this)}
-        .onCopyUri=${this.onCopyUri.bind(this)}
-        .autoConnect=${false}
-      ></w3m-connecting-widget>
-    `;
-    }
-    isReady() {
+    onRenderProxy() {
         if (!this.ready && this.uri) {
             this.ready = true;
-            this.onConnect();
+            this.onConnect?.();
         }
     }
-    onConnect() {
+    onConnectProxy() {
         if (this.wallet?.mobile_link && this.uri) {
@@ -69,5 +54,2 @@ try {
 };
-__decorate([
-    state()
-], W3mConnectingWcMobile.prototype, "buffering", void 0);
 W3mConnectingWcMobile = __decorate([
@@ -74,0 +56,0 @@ customElement('w3m-connecting-wc-mobile')

dist/esm/src/partials/w3m-connecting-wc-qrcode/index.js

@@ -11,10 +11,21 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 import { ifDefined } from 'lit/directives/if-defined.js';
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
 import styles from './styles.js';
-let W3mConnectingWcQrcode = class W3mConnectingWcQrcode extends WcConnectingLitElement {
+let W3mConnectingWcQrcode = class W3mConnectingWcQrcode extends W3mConnectingWidget {
+    constructor() {
+        super();
+        this.forceUpdate = () => {
+            this.requestUpdate();
+        };
+        window.addEventListener('resize', this.forceUpdate);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        window.removeEventListener('resize', this.forceUpdate);
+    }
     render() {
-        this.isReady();
+        this.onRenderProxy();
         return html `
       <wui-flex padding="xl" flexDirection="column" gap="xl" alignItems="center">
-        <wui-shimmer borderRadius="l" width="100%"> ${this.qrCodeTenmplate()} </wui-shimmer>
+        <wui-shimmer borderRadius="l" width="100%"> ${this.qrCodeTemplate()} </wui-shimmer>
 
@@ -32,8 +43,10 @@ <wui-text variant="paragraph-500" color="fg-100">
     }
-    isReady() {
+    onRenderProxy() {
         if (!this.ready && this.uri) {
-            this.timeout = setTimeout(() => (this.ready = true), 250);
+            this.timeout = setTimeout(() => {
+                this.ready = true;
+            }, 250);
         }
     }
-    qrCodeTenmplate() {
+    qrCodeTemplate() {
         if (!this.uri || !this.ready) {
@@ -40,0 +53,0 @@ return null;

dist/esm/src/partials/w3m-connecting-wc-qrcode/styles.js

@@ -15,3 +15,3 @@ import { css } from 'lit';
     aspect-ratio: 1 / 1;
-    border-radius: var(--wui-border-radius-m) !important;
+    border-radius: var(--wui-border-radius-l) !important;
   }
@@ -18,0 +18,0 @@

dist/esm/src/partials/w3m-connecting-wc-web/index.js

@@ -7,33 +7,17 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetUtil, ConnectionController, CoreHelperUtil } from '@web3modal/core';
-import { html } from 'lit';
+import { ConnectionController, CoreHelperUtil } from '@web3modal/core';
 import { customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-let W3mConnectingWcWeb = class W3mConnectingWcWeb extends WcConnectingLitElement {
-    render() {
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+let W3mConnectingWcWeb = class W3mConnectingWcWeb extends W3mConnectingWidget {
+    constructor() {
+        super();
         if (!this.wallet) {
             throw new Error('w3m-connecting-wc-web: No wallet provided');
         }
-        this.isReady();
-        return html `
-      <w3m-connecting-widget
-        name=${this.wallet.name}
-        imageSrc=${ifDefined(AssetUtil.getWalletImage(this.wallet.image_id))}
-        .error=${Boolean(this.error)}
-        .onConnect=${this.onConnect.bind(this)}
-        .onCopyUri=${this.onCopyUri.bind(this)}
-        .autoConnect=${false}
-      ></w3m-connecting-widget>
-    `;
+        this.onConnect = this.onConnectProxy.bind(this);
+        this.secondaryBtnLabel = 'Open';
+        this.secondaryLabel = 'Open and continue in a new browser tab';
+        this.secondaryBtnIcon = 'externalLink';
     }
-    isReady() {
-        if (!this.ready && this.uri) {
-            this.timeout = setTimeout(() => {
-                this.ready = true;
-                this.onConnect();
-            }, 250);
-        }
-    }
-    onConnect() {
+    onConnectProxy() {
         if (this.wallet?.webapp_link && this.uri) {
@@ -40,0 +24,0 @@ try {

dist/esm/src/partials/w3m-header/index.js

@@ -54,5 +54,2 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     titleTemplate() {
-        if (!this.heading) {
-            return null;
-        }
         return html `<wui-text variant="paragraph-700" color="fg-100">${this.heading}</wui-text>`;
@@ -59,0 +56,0 @@ }

dist/esm/src/views/w3m-account-view/index.js

@@ -78,3 +78,5 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
           <wui-flex gap="s" flexDirection="column" alignItems="center">
-            <wui-text variant="paragraph-500" color="fg-200">${this.showBalance()}</wui-text>
+            <wui-text variant="paragraph-500" color="fg-200">
+              ${CoreHelperUtil.formatBalance(this.balance, this.balanceSymbol)}
+            </wui-text>
             <wui-button size="sm" variant="shade" @click=${this.onExplorer.bind(this)}>
@@ -95,3 +97,3 @@ <wui-icon size="sm" color="inherit" slot="iconLeft" name="compass"></wui-icon>
           imageSrc=${ifDefined(networkImage)}
-          ?chevron=${true}
+          ?chevron=${this.isMultiNetwork()}
           @click=${this.onNetworks.bind(this)}
@@ -116,2 +118,6 @@ >
     }
+    isMultiNetwork() {
+        const { requestedCaipNetworks } = NetworkController.state;
+        return requestedCaipNetworks ? requestedCaipNetworks.length > 1 : false;
+    }
     onCopyAddress() {
@@ -129,3 +135,5 @@ try {
     onNetworks() {
-        RouterController.push('Networks');
+        if (this.isMultiNetwork()) {
+            RouterController.push('Networks');
+        }
     }
@@ -145,15 +153,2 @@ async onDisconnect() {
     }
-    showBalance() {
-        let formattedBalance = undefined;
-        if (this.balance === '0.0') {
-            formattedBalance = '0';
-        }
-        else if (typeof this.balance === 'string' && this.balance.length > 6) {
-            formattedBalance = this.balance.substring(0, 6);
-        }
-        else if (typeof this.balance === 'string') {
-            formattedBalance = this.balance;
-        }
-        return formattedBalance ? `${formattedBalance} ${this.balanceSymbol}` : '_._';
-    }
     onExplorer() {
@@ -160,0 +155,0 @@ const { addressExplorerUrl } = AccountController.state;

dist/esm/src/views/w3m-all-wallets-view/styles.js

 import { css } from 'lit';
 export default css `
   wui-grid {
-    max-height: 360px;
+    max-height: 420px;
     overflow: scroll;
@@ -6,0 +6,0 @@ scrollbar-width: none;

dist/esm/src/views/w3m-connect-view/index.js

@@ -7,6 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetController, AssetUtil, ConnectionController, ConnectorController, CoreHelperUtil, RouterController, StorageUtil } from '@web3modal/core';
+import { ApiController, AssetUtil, ConnectionController, ConnectorController, CoreHelperUtil, RouterController, StorageUtil } from '@web3modal/core';
 import { LitElement, html } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
+import styles from './styles.js';
 let W3mConnectView = class W3mConnectView extends LitElement {
@@ -25,6 +26,41 @@ constructor() {
       <wui-flex flexDirection="column" padding="s" gap="xs">
-        ${this.recentTemplate()} ${this.connectorsTemplate()} ${this.dynamicTemplate()}
+        ${this.walletConnectConnectorTemplate()} ${this.recentTemplate()} ${this.featuredTemplate()}
+        ${this.connectorsTemplate()} ${this.allWalletsTemplate()}
       </wui-flex>
     `;
     }
+    walletConnectConnectorTemplate() {
+        const connector = this.connectors.find(c => c.type === 'WALLET_CONNECT');
+        if (!connector) {
+            return null;
+        }
+        const { tagLabel, tagVariant } = this.getTag(connector);
+        return html `
+      <wui-list-wallet
+        imageSrc=${ifDefined(AssetUtil.getConnectorImage(connector.imageId))}
+        name=${connector.name ?? 'Unknown'}
+        @click=${() => this.onConnector(connector)}
+        tagLabel=${ifDefined(tagLabel)}
+        tagVariant=${ifDefined(tagVariant)}
+      >
+      </wui-list-wallet>
+    `;
+    }
+    featuredTemplate() {
+        const { featured } = ApiController.state;
+        if (!featured.length) {
+            return null;
+        }
+        const recent = StorageUtil.getRecentWallets();
+        const recentIds = recent.map(wallet => wallet.id);
+        const featuredWallets = featured.filter(wallet => !recentIds.includes(wallet.id));
+        return featuredWallets.map(wallet => html `
+        <wui-list-wallet
+          imageSrc=${ifDefined(AssetUtil.getWalletImage(wallet.image_id))}
+          name=${wallet.name ?? 'Unknown'}
+          @click=${() => RouterController.push('ConnectingWalletConnect', { wallet })}
+        >
+        </wui-list-wallet>
+      `);
+    }
     recentTemplate() {
@@ -45,2 +81,5 @@ const recent = StorageUtil.getRecentWallets();
         return this.connectors.map(connector => {
+            if (connector.type === 'WALLET_CONNECT') {
+                return null;
+            }
             const { tagLabel, tagVariant } = this.getTag(connector);
@@ -59,13 +98,11 @@ return html `
     }
-    dynamicTemplate() {
+    allWalletsTemplate() {
         if (CoreHelperUtil.isMobile()) {
             return null;
         }
-        const { walletImages } = AssetController.state;
-        const walletImagesSrc = Object.values(walletImages).map(src => ({ src }));
         return html `
       <wui-list-wallet
         name="All Wallets"
+        walletIcon="allWallets"
         showAllWallets
-        .walletImages=${walletImagesSrc}
         @click=${this.onAllWallets.bind(this)}
@@ -106,2 +143,3 @@ ></wui-list-wallet>
 };
+W3mConnectView.styles = styles;
 __decorate([
@@ -108,0 +146,0 @@ state()

dist/esm/src/views/w3m-connecting-external-view/index.js

@@ -7,27 +7,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { AssetUtil, ConnectionController, ModalController, RouterController } from '@web3modal/core';
-import { LitElement, html } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-let W3mConnectingExternalView = class W3mConnectingExternalView extends LitElement {
+import { ConnectionController, ModalController } from '@web3modal/core';
+import { customElement } from 'lit/decorators.js';
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+let W3mConnectingExternalView = class W3mConnectingExternalView extends W3mConnectingWidget {
     constructor() {
-        super(...arguments);
-        this.connector = RouterController.state.data?.connector;
-        this.error = false;
-    }
-    render() {
+        super();
         if (!this.connector) {
             throw new Error('w3m-connecting-view: No connector provided');
         }
-        const { name, imageId } = this.connector;
-        return html `
-      <w3m-connecting-widget
-        name=${ifDefined(name)}
-        imageSrc=${ifDefined(AssetUtil.getConnectorImage(imageId))}
-        .error=${this.error}
-        .onConnect=${this.onConnect.bind(this)}
-      ></w3m-connecting-widget>
-    `;
+        this.onConnect = this.onConnectProxy.bind(this);
+        this.onAutoConnect = this.onConnectProxy.bind(this);
+        this.isWalletConnect = false;
     }
-    async onConnect() {
+    async onConnectProxy() {
         try {
@@ -45,5 +34,2 @@ this.error = false;
 };
-__decorate([
-    state()
-], W3mConnectingExternalView.prototype, "error", void 0);
 W3mConnectingExternalView = __decorate([
@@ -50,0 +36,0 @@ customElement('w3m-connecting-external-view')

dist/esm/src/views/w3m-connecting-wc-view/index.js

@@ -98,3 +98,2 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     platformTemplate() {
-        const multiPlatform = this.platforms.length > 1;
         if (!this.platform) {
@@ -105,16 +104,17 @@ return null;
             case 'injected':
-                return html `
-          <w3m-connecting-wc-injected .multiPlatfrom=${multiPlatform}></w3m-connecting-wc-injected>
-        `;
+                return html `<w3m-connecting-wc-injected></w3m-connecting-wc-injected>`;
             case 'desktop':
                 return html `
-          <w3m-connecting-wc-desktop .multiPlatfrom=${multiPlatform}></w3m-connecting-wc-desktop>
+          <w3m-connecting-wc-desktop .onRetry=${() => this.initializeConnection(true)}>
+          </w3m-connecting-wc-desktop>
         `;
             case 'web':
                 return html `
-          <w3m-connecting-wc-web .multiPlatfrom=${multiPlatform}></w3m-connecting-wc-web>
+          <w3m-connecting-wc-web .onRetry=${() => this.initializeConnection(true)}>
+          </w3m-connecting-wc-web>
         `;
             case 'mobile':
                 return html `
-          <w3m-connecting-wc-mobile .multiPlatfrom=${multiPlatform}></w3m-connecting-wc-mobile>
+          <w3m-connecting-wc-mobile .onRetry=${() => this.initializeConnection(true)}>
+          </w3m-connecting-wc-mobile>
         `;
@@ -121,0 +121,0 @@ case 'qrcode':

dist/esm/src/views/w3m-get-wallet-view/index.js

@@ -7,3 +7,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-import { ApiController, AssetController, AssetUtil, CoreHelperUtil } from '@web3modal/core';
+import { ApiController, AssetUtil, CoreHelperUtil } from '@web3modal/core';
 import { LitElement, html } from 'lit';
@@ -18,4 +18,2 @@ import { customElement } from 'lit/decorators.js';
     render() {
-        const { walletImages } = AssetController.state;
-        const walletImagesSrc = Object.values(walletImages).map(src => ({ src }));
         return html `
@@ -27,3 +25,3 @@ <wui-flex flexDirection="column" padding="s" gap="xs">
           showAllWallets
-          .walletImages=${walletImagesSrc}
+          walletIcon="allWallets"
           icon="externalLink"
@@ -41,3 +39,2 @@ @click=${() => {
           name=${wallet.name ?? 'Unknown'}
-          tagLabel="get wallet"
           tagVariant="main"
@@ -44,0 +41,0 @@ imageSrc=${ifDefined(AssetUtil.getWalletImage(wallet.image_id))}

dist/types/index.d.ts

@@ -0,2 +1,6 @@
+export * from './src/modal/w3m-account-button/index.js';
+export * from './src/modal/w3m-button/index.js';
+export * from './src/modal/w3m-connect-button/index.js';
 export * from './src/modal/w3m-modal/index.js';
+export * from './src/modal/w3m-network-button/index.js';
 export * from './src/modal/w3m-router/index.js';
@@ -22,3 +26,2 @@ export * from './src/views/w3m-account-view/index.js';
 export * from './src/partials/w3m-connecting-wc-web/index.js';
-export * from './src/partials/w3m-connecting-widget/index.js';
 export * from './src/partials/w3m-header/index.js';
@@ -25,0 +28,0 @@ export * from './src/partials/w3m-help-widget/index.js';

dist/types/src/client.d.ts

@@ -9,3 +9,5 @@ import type { ApiControllerState, ConnectionControllerClient, ModalControllerArguments, NetworkControllerClient, NetworkControllerState, OptionsControllerState, ThemeControllerState, ThemeMode, ThemeVariables } from '@web3modal/core';
     excludeWalletIds?: OptionsControllerState['excludeWalletIds'];
+    featuredWalletIds?: OptionsControllerState['featuredWalletIds'];
     defaultChain?: NetworkControllerState['caipNetwork'];
+    tokens?: OptionsControllerState['tokens'];
     _sdkVersion: ApiControllerState['sdkVersion'];
@@ -12,0 +14,0 @@ }

dist/types/src/partials/w3m-all-wallets-list/index.d.ts

@@ -9,2 +9,3 @@ import { LitElement } from 'lit';
     private recommended;
+    private featured;
     constructor();
@@ -11,0 +12,0 @@ firstUpdated(): void;

dist/types/src/partials/w3m-connecting-wc-desktop/index.d.ts

@@ -1,6 +0,6 @@
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-export declare class W3mConnectingWcDesktop extends WcConnectingLitElement {
-    render(): import("lit-html").TemplateResult<1>;
-    private isReady;
-    private onConnect;
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingWcDesktop extends W3mConnectingWidget {
+    constructor();
+    private onRenderProxy;
+    private onConnectProxy;
 }
@@ -7,0 +7,0 @@ declare global {

dist/types/src/partials/w3m-connecting-wc-injected/index.d.ts

@@ -1,5 +0,5 @@
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-export declare class W3mConnectingWcInjected extends WcConnectingLitElement {
-    render(): import("lit-html").TemplateResult<1>;
-    private onConnect;
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingWcInjected extends W3mConnectingWidget {
+    constructor();
+    private onConnectProxy;
 }
@@ -6,0 +6,0 @@ declare global {

dist/types/src/partials/w3m-connecting-wc-mobile/index.d.ts

@@ -1,9 +0,7 @@
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-export declare class W3mConnectingWcMobile extends WcConnectingLitElement {
-    private buffering;
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingWcMobile extends W3mConnectingWidget {
     constructor();
     disconnectedCallback(): void;
-    render(): import("lit-html").TemplateResult<1>;
-    private isReady;
-    private onConnect;
+    private onRenderProxy;
+    private onConnectProxy;
     private onBuffering;
@@ -10,0 +8,0 @@ }

dist/types/src/partials/w3m-connecting-wc-qrcode/index.d.ts

@@ -1,7 +0,10 @@
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-export declare class W3mConnectingWcQrcode extends WcConnectingLitElement {
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingWcQrcode extends W3mConnectingWidget {
     static styles: import("lit").CSSResult;
+    constructor();
+    disconnectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
-    private isReady;
-    private qrCodeTenmplate;
+    private onRenderProxy;
+    private qrCodeTemplate;
+    private forceUpdate;
 }
@@ -8,0 +11,0 @@ declare global {

dist/types/src/partials/w3m-connecting-wc-web/index.d.ts

@@ -1,6 +0,5 @@
-import { WcConnectingLitElement } from '../../utils/WcConnectingLitElement.js';
-export declare class W3mConnectingWcWeb extends WcConnectingLitElement {
-    render(): import("lit-html").TemplateResult<1>;
-    private isReady;
-    private onConnect;
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingWcWeb extends W3mConnectingWidget {
+    constructor();
+    private onConnectProxy;
 }
@@ -7,0 +6,0 @@ declare global {

dist/types/src/views/w3m-account-view/index.d.ts

@@ -16,6 +16,6 @@ import { LitElement } from 'lit';
     render(): import("lit-html").TemplateResult<1>;
+    private isMultiNetwork;
     private onCopyAddress;
     private onNetworks;
     private onDisconnect;
-    private showBalance;
     private onExplorer;
@@ -22,0 +22,0 @@ }

dist/types/src/views/w3m-connect-view/index.d.ts

 import { LitElement } from 'lit';
 export declare class W3mConnectView extends LitElement {
+    static styles: import("lit").CSSResult;
     private unsubscribe;
@@ -8,5 +9,7 @@ private connectors;
     render(): import("lit-html").TemplateResult<1>;
+    private walletConnectConnectorTemplate;
+    private featuredTemplate;
     private recentTemplate;
     private connectorsTemplate;
-    private dynamicTemplate;
+    private allWalletsTemplate;
     private getTag;
@@ -13,0 +16,0 @@ private onConnector;

dist/types/src/views/w3m-connecting-external-view/index.d.ts

@@ -1,7 +0,5 @@
-import { LitElement } from 'lit';
-export declare class W3mConnectingExternalView extends LitElement {
-    private readonly connector;
-    private error;
-    render(): import("lit-html").TemplateResult<1>;
-    private onConnect;
+import { W3mConnectingWidget } from '../../utils/w3m-connecting-widget/index.js';
+export declare class W3mConnectingExternalView extends W3mConnectingWidget {
+    constructor();
+    private onConnectProxy;
 }
@@ -8,0 +6,0 @@ declare global {

package.json

 {
   "name": "@web3modal/scaffold",
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-b284aa83",
   "type": "module",
@@ -18,6 +18,5 @@ "main": "./dist/esm/index.js",
   "dependencies": {
-    "@web3modal/core": "3.0.0-alpha.5",
-    "@web3modal/ui": "3.0.0-alpha.5",
-    "lit": "2.8.0",
-    "motion": "10.16.2"
+    "@web3modal/core": "3.0.0-b284aa83",
+    "@web3modal/ui": "3.0.0-b284aa83",
+    "lit": "2.8.0"
   },
@@ -24,0 +23,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

316205

increased by7.28%

Dependency count

3

decreased by-25%

Number of package files

132

increased by10%

Lines of code

3351

increased by11.25%

Dependency changes

• + Added@web3modal/core@3.0.0-b284aa83(transitive)

• + Added@web3modal/ui@3.0.0-b284aa83(transitive)

• - Removedmotion@10.16.2

• - Removed@web3modal/core@3.0.0-alpha.5(transitive)

• - Removed@web3modal/ui@3.0.0-alpha.5(transitive)

• Updated@web3modal/core@3.0.0-b284aa83

• Updated@web3modal/ui@3.0.0-b284aa83