@reown/appkit-scaffold-ui 0.0.3

package/dist/esm/src/views/w3m-onramp-fiat-select-view/styles.js

@@ -0,0 +1,12 @@
+import { css } from 'lit';
+export default css `
+  :host > wui-grid {
+    max-height: 360px;
+    overflow: auto;
+  }
+
+  wui-grid::-webkit-scrollbar {
+    display: none;
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/views/w3m-onramp-fiat-select-view/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/views/w3m-onramp-fiat-select-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;CASjB,CAAA"}

package/dist/esm/src/views/w3m-onramp-providers-view/index.js

@@ -0,0 +1,105 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { CoreHelperUtil, AccountController, ConstantsUtil, OnRampController, RouterController, NetworkController, BlockchainApiController, EventsController, ChainController } from '@reown/appkit-core';
+import { customElement } from '@reown/appkit-ui';
+import { LitElement, html } from 'lit';
+import { state } from 'lit/decorators.js';
+import { W3mFrameRpcConstants } from '@reown/appkit-wallet';
+let W3mOnRampProvidersView = class W3mOnRampProvidersView extends LitElement {
+    constructor() {
+        super();
+        this.unsubscribe = [];
+        this.providers = OnRampController.state.providers;
+        this.unsubscribe.push(...[
+            OnRampController.subscribeKey('providers', val => {
+                this.providers = val;
+            })
+        ]);
+    }
+    firstUpdated() {
+        const urlPromises = this.providers.map(async (provider) => {
+            if (provider.name === 'coinbase') {
+                return await this.getCoinbaseOnRampURL();
+            }
+            return Promise.resolve(provider?.url);
+        });
+        Promise.all(urlPromises).then(urls => {
+            this.providers = this.providers.map((provider, index) => ({
+                ...provider,
+                url: urls[index] || ''
+            }));
+        });
+    }
+    render() {
+        return html `
+      <wui-flex flexDirection="column" .padding=${['0', 's', 's', 's']} gap="xs">
+        ${this.onRampProvidersTemplate()}
+      </wui-flex>
+      <w3m-onramp-providers-footer></w3m-onramp-providers-footer>
+    `;
+    }
+    onRampProvidersTemplate() {
+        return this.providers
+            .filter(provider => provider.supportedChains.includes(ChainController.state.activeChain ?? 'eip155'))
+            .map(provider => html `
+          <w3m-onramp-provider-item
+            label=${provider.label}
+            name=${provider.name}
+            feeRange=${provider.feeRange}
+            @click=${() => {
+            this.onClickProvider(provider);
+        }}
+            ?disabled=${!provider.url}
+          ></w3m-onramp-provider-item>
+        `);
+    }
+    onClickProvider(provider) {
+        OnRampController.setSelectedProvider(provider);
+        RouterController.push('BuyInProgress');
+        CoreHelperUtil.openHref(provider.url, 'popupWindow', 'width=600,height=800,scrollbars=yes');
+        EventsController.sendEvent({
+            type: 'track',
+            event: 'SELECT_BUY_PROVIDER',
+            properties: {
+                provider: provider.name,
+                isSmartAccount: AccountController.state.preferredAccountType ===
+                    W3mFrameRpcConstants.ACCOUNT_TYPES.SMART_ACCOUNT
+            }
+        });
+    }
+    async getCoinbaseOnRampURL() {
+        const address = AccountController.state.address;
+        const network = NetworkController.state.caipNetwork;
+        if (!address) {
+            throw new Error('No address found');
+        }
+        if (!network?.name) {
+            throw new Error('No network found');
+        }
+        const defaultNetwork = ConstantsUtil.WC_COINBASE_PAY_SDK_CHAIN_NAME_MAP[network.name] ?? ConstantsUtil.WC_COINBASE_PAY_SDK_FALLBACK_CHAIN;
+        const purchaseCurrency = OnRampController.state.purchaseCurrency;
+        const assets = purchaseCurrency
+            ? [purchaseCurrency.symbol]
+            : OnRampController.state.purchaseCurrencies.map(currency => currency.symbol);
+        return await BlockchainApiController.generateOnRampURL({
+            defaultNetwork,
+            destinationWallets: [
+                { address, blockchains: ConstantsUtil.WC_COINBASE_PAY_SDK_CHAINS, assets }
+            ],
+            partnerUserId: address,
+            purchaseAmount: OnRampController.state.purchaseAmount
+        });
+    }
+};
+__decorate([
+    state()
+], W3mOnRampProvidersView.prototype, "providers", void 0);
+W3mOnRampProvidersView = __decorate([
+    customElement('w3m-onramp-providers-view')
+], W3mOnRampProvidersView);
+export { W3mOnRampProvidersView };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/views/w3m-onramp-providers-view/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/views/w3m-onramp-providers-view/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/src/views/w3m-onramp-tokens-select-view/index.js

@@ -0,0 +1,75 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { OnRampController, ModalController, AssetController } from '@reown/appkit-core';
+import { customElement } from '@reown/appkit-ui';
+import { LitElement, html } from 'lit';
+import { state } from 'lit/decorators.js';
+import styles from './styles.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+let W3mOnrampTokensView = class W3mOnrampTokensView extends LitElement {
+    constructor() {
+        super();
+        this.unsubscribe = [];
+        this.selectedCurrency = OnRampController.state.purchaseCurrencies;
+        this.tokens = OnRampController.state.purchaseCurrencies;
+        this.tokenImages = AssetController.state.tokenImages;
+        this.unsubscribe.push(...[
+            OnRampController.subscribe(val => {
+                this.selectedCurrency = val.purchaseCurrencies;
+                this.tokens = val.purchaseCurrencies;
+            }),
+            AssetController.subscribeKey('tokenImages', val => (this.tokenImages = val))
+        ]);
+    }
+    disconnectedCallback() {
+        this.unsubscribe.forEach(unsubscribe => unsubscribe());
+    }
+    render() {
+        return html `
+      <wui-flex flexDirection="column" .padding=${['0', 's', 's', 's']} gap="xs">
+        ${this.currenciesTemplate()}
+      </wui-flex>
+      <w3m-legal-footer></w3m-legal-footer>
+    `;
+    }
+    currenciesTemplate() {
+        return this.tokens.map(token => html `
+        <wui-list-item
+          imageSrc=${ifDefined(this.tokenImages?.[token.symbol])}
+          @click=${() => this.selectToken(token)}
+          variant="image"
+        >
+          <wui-flex gap="3xs" alignItems="center">
+            <wui-text variant="paragraph-500" color="fg-100">${token.name}</wui-text>
+            <wui-text variant="small-400" color="fg-200">${token.symbol}</wui-text>
+          </wui-flex>
+        </wui-list-item>
+      `);
+    }
+    selectToken(currency) {
+        if (!currency) {
+            return;
+        }
+        OnRampController.setPurchaseCurrency(currency);
+        ModalController.close();
+    }
+};
+W3mOnrampTokensView.styles = styles;
+__decorate([
+    state()
+], W3mOnrampTokensView.prototype, "selectedCurrency", void 0);
+__decorate([
+    state()
+], W3mOnrampTokensView.prototype, "tokens", void 0);
+__decorate([
+    state()
+], W3mOnrampTokensView.prototype, "tokenImages", void 0);
+W3mOnrampTokensView = __decorate([
+    customElement('w3m-onramp-token-select-view')
+], W3mOnrampTokensView);
+export { W3mOnrampTokensView };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/views/w3m-onramp-tokens-select-view/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/views/w3m-onramp-tokens-select-view/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEvF,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,MAAM,MAAM,aAAa,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGjD,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,UAAU;IAWjD;QACE,KAAK,EAAE,CAAA;QARD,gBAAW,GAAmB,EAAE,CAAA;QAGxB,qBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,kBAAkB,CAAA;QAC5D,WAAM,GAAG,gBAAgB,CAAC,KAAK,CAAC,kBAAkB,CAAA;QACjD,gBAAW,GAAG,eAAe,CAAC,KAAK,CAAC,WAAW,CAAA;QAI9D,IAAI,CAAC,WAAW,CAAC,IAAI,CACnB,GAAG;YACD,gBAAgB,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE;gBAC/B,IAAI,CAAC,gBAAgB,GAAG,GAAG,CAAC,kBAAkB,CAAA;gBAC9C,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,kBAAkB,CAAA;YACtC,CAAC,CAAC;YACF,eAAe,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,CAAC;SAC7E,CACF,CAAA;IACH,CAAC;IAEe,oBAAoB;QAClC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC,WAAW,EAAE,CAAC,CAAA;IACxD,CAAC;IAGe,MAAM;QACpB,OAAO,IAAI,CAAA;kDACmC,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;UAC5D,IAAI,CAAC,kBAAkB,EAAE;;;KAG9B,CAAA;IACH,CAAC;IAGO,kBAAkB;QACxB,OAAO,IAAI,CAAC,MAAM,CAAC,GAAG,CACpB,KAAK,CAAC,EAAE,CAAC,IAAI,CAAA;;qBAEE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;mBAC7C,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;;;;+DAIe,KAAK,CAAC,IAAI;2DACd,KAAK,CAAC,MAAM;;;OAGhE,CACF,CAAA;IACH,CAAC;IAEO,WAAW,CAAC,QAA0B;QAC5C,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAM;QACR,CAAC;QAED,gBAAgB,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAA;QAC9C,eAAe,CAAC,KAAK,EAAE,CAAA;IACzB,CAAC;;AA9DsB,0BAAM,GAAG,MAAM,AAAT,CAAS;AAMtB;IAAf,KAAK,EAAE;6DAAoE;AAC5D;IAAf,KAAK,EAAE;mDAA0D;AACjD;IAAhB,KAAK,EAAE;wDAAwD;AATrD,mBAAmB;IAD/B,aAAa,CAAC,8BAA8B,CAAC;GACjC,mBAAmB,CAgE/B"}

package/dist/esm/src/views/w3m-onramp-tokens-select-view/styles.js

@@ -0,0 +1,12 @@
+import { css } from 'lit';
+export default css `
+  :host > wui-grid {
+    max-height: 360px;
+    overflow: auto;
+  }
+
+  wui-grid::-webkit-scrollbar {
+    display: none;
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/views/w3m-onramp-tokens-select-view/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/views/w3m-onramp-tokens-select-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;CASjB,CAAA"}

package/dist/esm/src/views/w3m-profile-view/index.js

@@ -0,0 +1,158 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { AccountController, ChainController, ConnectorController, CoreHelperUtil, ModalController, RouterController, SnackController } from '@reown/appkit-core';
+import { UiHelperUtil, customElement } from '@reown/appkit-ui';
+import { LitElement, html } from 'lit';
+import { state } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import styles from './styles.js';
+let W3mProfileView = class W3mProfileView extends LitElement {
+    constructor() {
+        super();
+        this.usubscribe = [];
+        this.address = AccountController.state.address;
+        this.profileImage = AccountController.state.profileImage;
+        this.profileName = AccountController.state.profileName;
+        this.accounts = AccountController.state.allAccounts;
+        this.usubscribe.push(AccountController.subscribeKey('address', address => {
+            if (address) {
+                this.address = address;
+            }
+            else {
+                ModalController.close();
+            }
+        }));
+        this.usubscribe.push(AccountController.subscribeKey('profileImage', profileImage => {
+            this.profileImage = profileImage;
+        }));
+        this.usubscribe.push(AccountController.subscribeKey('profileName', profileName => {
+            this.profileName = profileName;
+        }));
+    }
+    disconnectedCallback() {
+        this.usubscribe.forEach(unsubscribe => unsubscribe());
+    }
+    render() {
+        if (!this.address) {
+            throw new Error('w3m-profile-view: No account provided');
+        }
+        const name = this.profileName?.split('.')[0];
+        return html `
+      <wui-flex flexDirection="column" gap="l" .padding=${['0', 'xl', 'm', 'xl']}>
+        <wui-flex flexDirection="column" alignItems="center" gap="l">
+          <wui-avatar
+            alt=${this.address}
+            address=${this.address}
+            imageSrc=${ifDefined(this.profileImage)}
+            size="2lg"
+          ></wui-avatar>
+          <wui-flex flexDirection="column" alignItems="center">
+            <wui-flex gap="3xs" alignItems="center" justifyContent="center">
+              <wui-text variant="title-6-600" color="fg-100" data-testid="account-settings-address">
+                ${name
+            ? UiHelperUtil.getTruncateString({
+                string: name,
+                charsStart: 20,
+                charsEnd: 0,
+                truncate: 'end'
+            })
+            : UiHelperUtil.getTruncateString({
+                string: this.address,
+                charsStart: 4,
+                charsEnd: 6,
+                truncate: 'middle'
+            })}
+              </wui-text>
+              <wui-icon-link
+                size="md"
+                icon="copy"
+                iconColor="fg-200"
+                @click=${this.onCopyAddress}
+              ></wui-icon-link>
+            </wui-flex>
+          </wui-flex>
+        </wui-flex>
+        <wui-flex
+          data-testid="account-settings-button"
+          justifyContent="center"
+          alignItems="center"
+          class="account-settings-button"
+          @click=${() => RouterController.push('AccountSettings')}
+        >
+          <wui-text variant="paragraph-500" color="fg-100">Account Settings</wui-text>
+        </wui-flex>
+        ${this.accountsTemplate()}
+      </wui-flex>
+    `;
+    }
+    accountsTemplate() {
+        return html `<wui-flex flexDirection="column">
+      <wui-flex .padding=${['3xs', 'm', 's', 's']}>
+        <wui-text color="fg-200" variant="paragraph-400">Your accounts</wui-text>
+      </wui-flex>
+      <wui-flex flexDirection="column" gap="xxs">
+        ${this.accounts.map(account => this.accountTemplate(account))}
+      </wui-flex>
+    </wui-flex>`;
+    }
+    async onSwitchAccount(account) {
+        AccountController.setShouldUpdateToAddress(account.address, ChainController.state.activeChain);
+        const emailConnector = ConnectorController.getAuthConnector();
+        if (!emailConnector) {
+            return;
+        }
+        await emailConnector.provider.setPreferredAccount(account.type);
+        await emailConnector.provider.connect();
+    }
+    accountTemplate(account) {
+        return html `<wui-list-account accountAddress=${account.address} accountType=${account.type}>
+      ${account.address === this.address
+            ? ''
+            : html `<wui-button
+            slot="action"
+            textVariant="small-600"
+            size="sm"
+            variant="accent"
+            @click=${() => this.onSwitchAccount(account)}
+            >Switch</wui-button
+          >`}
+    </wui-list-account>`;
+    }
+    onCopyAddress() {
+        try {
+            if (this.profileName) {
+                CoreHelperUtil.copyToClopboard(this.profileName);
+                SnackController.showSuccess('Name copied');
+            }
+            else if (this.address) {
+                CoreHelperUtil.copyToClopboard(this.address);
+                SnackController.showSuccess('Address copied');
+            }
+        }
+        catch {
+            SnackController.showError('Failed to copy');
+        }
+    }
+};
+W3mProfileView.styles = styles;
+__decorate([
+    state()
+], W3mProfileView.prototype, "address", void 0);
+__decorate([
+    state()
+], W3mProfileView.prototype, "profileImage", void 0);
+__decorate([
+    state()
+], W3mProfileView.prototype, "profileName", void 0);
+__decorate([
+    state()
+], W3mProfileView.prototype, "accounts", void 0);
+W3mProfileView = __decorate([
+    customElement('w3m-profile-view')
+], W3mProfileView);
+export { W3mProfileView };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/views/w3m-profile-view/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/views/w3m-profile-view/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/src/views/w3m-profile-view/styles.js

@@ -0,0 +1,63 @@
+import { css } from 'lit';
+export default css `
+  wui-flex {
+    width: 100%;
+  }
+
+  wui-icon-link {
+    margin-right: calc(var(--wui-icon-box-size-md) * -1);
+  }
+
+  .account-links {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .account-links wui-flex {
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex: 1;
+    background: red;
+    align-items: center;
+    justify-content: center;
+    height: 48px;
+    padding: 10px;
+    flex: 1 0 0;
+
+    border-radius: var(--XS, 16px);
+    border: 1px solid var(--dark-accent-glass-010, rgba(71, 161, 255, 0.1));
+    background: var(--dark-accent-glass-010, rgba(71, 161, 255, 0.1));
+    transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-md);
+    will-change: background-color;
+  }
+
+  .account-links wui-flex:hover {
+    background: var(--dark-accent-glass-015, rgba(71, 161, 255, 0.15));
+  }
+
+  .account-links wui-flex wui-icon {
+    width: var(--S, 20px);
+    height: var(--S, 20px);
+  }
+
+  .account-links wui-flex wui-icon svg path {
+    stroke: #47a1ff;
+  }
+
+  .account-settings-button {
+    padding: calc(var(--wui-spacing-m) - 1px) var(--wui-spacing-2l);
+    height: 40px;
+    border-radius: var(--wui-border-radius-xxs);
+    border: 1px solid var(--wui-color-gray-glass-002);
+    background: var(--wui-color-gray-glass-002);
+    cursor: pointer;
+  }
+
+  .account-settings-button:hover {
+    background: var(--wui-color-gray-glass-005);
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/views/w3m-profile-view/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/views/w3m-profile-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DjB,CAAA"}

package/dist/esm/src/views/w3m-register-account-name-success-view/index.js

@@ -0,0 +1,79 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { customElement } from '@reown/appkit-ui';
+import { CoreHelperUtil, RouterController } from '@reown/appkit-core';
+import { LitElement, html } from 'lit';
+import styles from './styles.js';
+import { NavigationUtil } from '@reown/appkit-common';
+let W3mRegisterAccountNameSuccess = class W3mRegisterAccountNameSuccess extends LitElement {
+    render() {
+        return html `
+      <wui-flex
+        flexDirection="column"
+        alignItems="center"
+        gap="xxl"
+        .padding=${['0', '0', 'l', '0']}
+      >
+        ${this.onboardingTemplate()} ${this.buttonsTemplate()}
+        <wui-link
+          @click=${() => {
+            CoreHelperUtil.openHref(NavigationUtil.URLS.FAQ, '_blank');
+        }}
+        >
+          Learn more
+          <wui-icon color="inherit" slot="iconRight" name="externalLink"></wui-icon>
+        </wui-link>
+      </wui-flex>
+    `;
+    }
+    onboardingTemplate() {
+        return html ` <wui-flex
+      flexDirection="column"
+      gap="xxl"
+      alignItems="center"
+      .padding=${['0', 'xxl', '0', 'xxl']}
+    >
+      <wui-flex gap="s" alignItems="center" justifyContent="center">
+        <wui-icon-box
+          size="xl"
+          iconcolor="success-100"
+          backgroundcolor="success-100"
+          icon="checkmark"
+          background="opaque"
+        ></wui-icon-box>
+      </wui-flex>
+      <wui-flex flexDirection="column" alignItems="center" gap="s">
+        <wui-text align="center" variant="medium-600" color="fg-100">
+          Account name chosen successfully
+        </wui-text>
+        <wui-text align="center" variant="paragraph-400" color="fg-100">
+          You can now fund your account and trade crypto
+        </wui-text>
+      </wui-flex>
+    </wui-flex>`;
+    }
+    buttonsTemplate() {
+        return html `<wui-flex
+      .padding=${['0', '2l', '0', '2l']}
+      gap="s"
+      class="continue-button-container"
+    >
+      <wui-button fullWidth size="lg" borderRadius="xs" @click=${this.redirectToAccount.bind(this)}
+        >Let's Go!
+      </wui-button>
+    </wui-flex>`;
+    }
+    redirectToAccount() {
+        RouterController.replace('Account');
+    }
+};
+W3mRegisterAccountNameSuccess.styles = styles;
+W3mRegisterAccountNameSuccess = __decorate([
+    customElement('w3m-register-account-name-success-view')
+], W3mRegisterAccountNameSuccess);
+export { W3mRegisterAccountNameSuccess };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/views/w3m-register-account-name-success-view/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/views/w3m-register-account-name-success-view/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrE,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,MAAM,MAAM,aAAa,CAAA;AAChC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG9C,IAAM,6BAA6B,GAAnC,MAAM,6BAA8B,SAAQ,UAAU;IAI3C,MAAM;QACpB,OAAO,IAAI,CAAA;;;;;mBAKI,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAU;;UAEtC,IAAI,CAAC,kBAAkB,EAAE,IAAI,IAAI,CAAC,eAAe,EAAE;;mBAE1C,GAAG,EAAE;YACZ,cAAc,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAA;QAC5D,CAAC;;;;;;KAMN,CAAA;IACH,CAAC;IAGO,kBAAkB;QACxB,OAAO,IAAI,CAAA;;;;iBAIE,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAU;;;;;;;;;;;;;;;;;;;gBAmBlC,CAAA;IACd,CAAC;IAEO,eAAe;QACrB,OAAO,IAAI,CAAA;iBACE,CAAC,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,CAAU;;;;iEAIiB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC;;;gBAGlF,CAAA;IACd,CAAC;IAEO,iBAAiB;QACvB,gBAAgB,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;IACrC,CAAC;;AAlEsB,oCAAM,GAAG,MAAM,AAAT,CAAS;AAD3B,6BAA6B;IADzC,aAAa,CAAC,wCAAwC,CAAC;GAC3C,6BAA6B,CAoEzC"}

package/dist/esm/src/views/w3m-register-account-name-success-view/styles.js

@@ -0,0 +1,7 @@
+import { css } from 'lit';
+export default css `
+  .continue-button-container {
+    width: 100%;
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/views/w3m-register-account-name-success-view/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/views/w3m-register-account-name-success-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;CAIjB,CAAA"}